.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px;background:linear-gradient(145deg,#1a1a2e,#16213e 40%,#0f3460);position:relative;overflow:hidden}.login-page:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 30% 30%,rgba(255,152,0,.08) 0%,transparent 50%),radial-gradient(circle at 70% 70%,rgba(76,175,80,.06) 0%,transparent 50%);animation:bgFloat 20s ease-in-out infinite}@keyframes bgFloat{0%,to{transform:translate(0) rotate(0)}50%{transform:translate(2%,2%) rotate(3deg)}}.login-page:after{content:"🌟 🎮 🎯 🚀";position:absolute;font-size:24px;opacity:.15;letter-spacing:60px;top:20%;left:50%;transform:translate(-50%);animation:starFloat 8s ease-in-out infinite}@keyframes starFloat{0%,to{transform:translate(-50%) translateY(0);opacity:.15}50%{transform:translate(-50%) translateY(-10px);opacity:.25}}.login-card{position:relative;z-index:1;width:100%;max-width:420px;padding:36px 40px;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;box-shadow:0 20px 50px #0000004d,0 0 0 1px #ffffff1a,inset 0 1px #fffc}.login-header{text-align:center;margin-bottom:20px}.login-logo{font-size:48px;display:inline-block;margin-bottom:8px;animation:logoWiggle 3s ease-in-out infinite;filter:drop-shadow(0 4px 8px rgba(255,152,0,.3))}@keyframes logoWiggle{0%,to{transform:rotate(-5deg) scale(1)}25%{transform:rotate(5deg) scale(1.05)}50%{transform:rotate(-3deg) scale(1)}75%{transform:rotate(3deg) scale(1.02)}}.login-header h1{margin:0 0 4px;font-size:24px;background:linear-gradient(135deg,#ff9800,#f57c00);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:800;letter-spacing:-.5px}.login-header p{margin:0;color:#666;font-size:12px;font-weight:500}.login-tabs{display:flex;gap:6px;margin-bottom:18px;background:#f5f5f5;padding:4px;border-radius:10px}.tab-btn{flex:1;padding:10px;border:none;border-radius:8px;background:transparent;color:#888;font-size:14px;font-weight:600;cursor:pointer;transition:all .25s ease}.tab-btn:hover{color:#555;background:#ffffff80}.tab-btn.active{background:#fff;color:#4caf50;box-shadow:0 2px 8px #00000014}.login-form{display:flex;flex-direction:column;gap:14px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{color:#555;font-size:12px;font-weight:600;letter-spacing:.3px}.form-group input{padding:12px 14px;border:2px solid #e8e8e8;border-radius:10px;background:#fafafa;color:#333;font-size:14px;transition:all .2s ease}.form-group input:focus{outline:none;border-color:#ff9800;background:#fff;box-shadow:0 0 0 4px #ff98001a}.form-group input::placeholder{color:#aaa;font-size:13px}.error-message{padding:10px 12px;background:#f4433614;border:1px solid rgba(244,67,54,.2);border-radius:8px;color:#e53935;font-size:12px;text-align:center;font-weight:500}.submit-btn{padding:13px;border:none;border-radius:10px;background:linear-gradient(135deg,#4caf50,#43a047);color:#fff;font-size:15px;font-weight:700;cursor:pointer;transition:all .25s ease;box-shadow:0 4px 15px #4caf5040}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4caf5059}.submit-btn:active{transform:translateY(0)}.submit-btn:disabled{opacity:.7;cursor:not-allowed;transform:none;box-shadow:none}.divider{display:flex;align-items:center;margin:16px 0;color:#bbb;font-size:12px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:linear-gradient(to right,transparent,#ddd,transparent)}.divider span{padding:0 12px;font-weight:500}.guest-btn{width:100%;padding:12px;border:2px dashed #FFB74D;border-radius:10px;background:linear-gradient(135deg,#ffe0b280,#ffcc8080);color:#e65100;font-size:14px;font-weight:600;cursor:pointer;transition:all .25s ease}.guest-btn:hover{border-style:solid;border-color:#ff9800;background:linear-gradient(135deg,#ffe0b2,#ffcc80);transform:translateY(-2px);box-shadow:0 4px 15px #ff980040}.guest-note{margin:10px 0 0;text-align:center;color:#999;font-size:11px;font-weight:500}@media(min-width:768px){.login-card{max-width:460px;padding:44px 48px}.login-logo{font-size:56px}.login-header h1{font-size:28px}.login-header p{font-size:14px}.form-group input{padding:14px 16px;font-size:15px}.submit-btn{padding:15px;font-size:16px}.guest-btn{padding:14px;font-size:15px}}@media(max-width:400px){.login-card{max-width:100%;padding:24px 20px}.login-logo{font-size:40px}.login-header h1{font-size:22px}}.level-select-page{min-height:100vh;background:linear-gradient(135deg,#fff8e1,#ffe0b2,#ffcc80);padding:20px}.level-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--bg-header);border-radius:var(--radius-lg);margin-bottom:24px;box-shadow:var(--shadow-md)}.header-left{display:flex;align-items:center;gap:12px}.back-to-tasks{display:inline-flex;align-items:center;padding:4px 12px;font-size:.75rem;color:#666;background:#fff9;border:1px solid #ddd;border-radius:16px;text-decoration:none;transition:all .2s;white-space:nowrap}.back-to-tasks:hover{color:#333;background:#fff;border-color:#bbb}.logo{font-size:44px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.level-header h1{margin:0;font-size:26px;color:var(--text-light);text-shadow:0 2px 4px rgba(0,0,0,.1)}.header-right,.user-info{display:flex;align-items:center;gap:16px}.user-name{color:var(--text-light);font-size:15px;font-weight:600}.user-stars{color:gold;font-size:15px;text-shadow:0 1px 2px rgba(0,0,0,.2)}.logout-btn,.login-btn,.admin-btn,.achievements-btn,.replays-btn{padding:10px 20px;border:none;border-radius:var(--radius-md);font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:var(--shadow-sm)}.achievements-btn{background:linear-gradient(135deg,gold,orange);color:#333}.achievements-btn:hover{background:linear-gradient(135deg,#ffe44d,#ffb833);transform:translateY(-2px);box-shadow:0 4px 12px #ffc10766}.replays-btn{background:linear-gradient(135deg,#1890ff,#36cfc9);color:#fff}.replays-btn:hover{background:linear-gradient(135deg,#40a9ff,#5cdbd3);transform:translateY(-2px);box-shadow:0 4px 12px #1890ff66}.parent-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.parent-btn:hover{background:linear-gradient(135deg,#7a8ff0,#8b5cb6);transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.create-btn{background:linear-gradient(135deg,#fa8c16,#faad14);color:#fff}.create-btn:hover{background:linear-gradient(135deg,#ffa940,#ffc53d);transform:translateY(-2px);box-shadow:0 4px 12px #fa8c1666}.theme-btn{background:linear-gradient(135deg,#722ed1,#9254de);color:#fff}.theme-btn:hover{background:linear-gradient(135deg,#9254de,#b37feb);transform:translateY(-2px);box-shadow:0 4px 12px #722ed166}.daily-btn{background:linear-gradient(135deg,#f5222d,#ff4d4f);color:#fff}.daily-btn:hover{background:linear-gradient(135deg,#ff4d4f,#ff7875);transform:translateY(-2px);box-shadow:0 4px 12px #f5222d66}.admin-btn{background:#ffffffe6;font-size:18px;padding:8px 12px}.admin-btn:hover{background:#fff;transform:translateY(-2px)}.login-btn{background:var(--bg-card);color:var(--color-primary-dark)}.login-btn:hover{background:#fff}.logout-btn{background:#ffffffe6;color:var(--text-secondary)}.logout-btn:hover,.login-btn:hover{transform:translateY(-2px)}.level-select-body{display:flex;gap:24px;flex:1;min-height:0}.chapter-sidebar{width:200px;flex-shrink:0;background:var(--bg-card);border-radius:var(--radius-lg);padding:16px;box-shadow:var(--shadow-md);display:flex;flex-direction:column;max-height:calc(100vh - 140px);overflow-y:auto}.chapter-sidebar-title{margin:0 0 12px;font-size:16px;font-weight:700;color:var(--text-primary);padding-bottom:10px;border-bottom:2px solid var(--border-color)}.chapter-list{display:flex;flex-direction:column;gap:6px}.chapter-item{display:flex;align-items:center;gap:10px;padding:12px 14px;border:2px solid transparent;border-radius:var(--radius-md);background:transparent;cursor:pointer;transition:all .2s;text-align:left;font-family:inherit}.chapter-item:hover{background:#fff8e1;border-color:#ffe0b2}.chapter-item.active{background:linear-gradient(135deg,#4caf50,#66bb6a);border-color:#4caf50;box-shadow:0 4px 12px #4caf504d}.chapter-item-icon{font-size:20px;flex-shrink:0}.chapter-item-info{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.chapter-item-name{font-size:14px;font-weight:700;color:var(--text-primary);white-space:nowrap}.chapter-item.active .chapter-item-name{color:var(--text-light)}.chapter-item-progress{font-size:11px;font-weight:500;color:var(--text-secondary)}.chapter-item.active .chapter-item-progress{color:#ffffffd9}.chapter-item-badge{font-size:16px;flex-shrink:0}.levels-container{flex:1;min-width:0;max-height:calc(100vh - 140px);overflow-y:auto;padding:4px}@media(max-width:768px){.level-select-body{flex-direction:column;gap:12px}.chapter-sidebar{width:100%;max-height:none;flex-direction:row;align-items:center;padding:10px 14px;gap:8px;overflow-x:auto;overflow-y:hidden}.chapter-sidebar-title{display:none}.chapter-list{flex-direction:row;gap:6px;flex-wrap:nowrap}.chapter-item{padding:8px 14px;white-space:nowrap;flex-shrink:0;border-radius:20px}.chapter-item-info{flex-direction:row;gap:6px;align-items:center}.chapter-item-icon{font-size:16px}.levels-container{max-height:none}}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px;color:var(--text-primary)}.load-warning,.load-error{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;padding:12px 14px;border-radius:10px;font-size:14px;font-weight:600}.load-warning{background:#fff8e1;border:1px solid #ffd54f;color:#8d6e00}.load-error{background:#ffebee;border:1px solid #ef9a9a;color:#b71c1c}.retry-btn{border:none;border-radius:8px;padding:8px 12px;background:#1976d2;color:#fff;font-size:13px;font-weight:600;cursor:pointer;box-shadow:var(--shadow-sm)}.retry-btn:hover{background:#1565c0}.empty-levels{padding:44px 12px;text-align:center;color:var(--text-secondary);font-size:16px;font-weight:600}.loading-icon{font-size:72px;animation:bounce 1s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.levels-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:24px}.level-card{position:relative;padding:28px;background:var(--bg-card);border-radius:var(--radius-lg);text-align:center;cursor:pointer;transition:all .3s;border:3px solid var(--border-color);box-shadow:var(--shadow-sm)}.level-card:hover:not(.locked){transform:translateY(-8px) scale(1.02);border-color:var(--color-secondary);box-shadow:0 12px 30px #4caf5040}.level-card.completed{border-color:var(--color-secondary);background:linear-gradient(180deg,#e8f5e9,#fff)}.level-card.locked{opacity:.6;cursor:not-allowed;background:#f5f5f5}.lock-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:44px;z-index:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.level-number{width:56px;height:56px;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#4caf50,#66bb6a);border-radius:50%;font-size:22px;font-weight:700;color:var(--text-light);box-shadow:0 4px 12px #4caf504d}.level-title{margin:0 0 10px;font-size:18px;font-weight:700;color:var(--text-primary)}.level-difficulty{font-size:14px;margin-bottom:14px;letter-spacing:2px}.level-stars{display:flex;justify-content:center;gap:6px}.level-stars .star{font-size:22px;color:#e0e0e0}.level-stars .star.active{color:gold;filter:drop-shadow(0 1px 2px rgba(255,193,7,.4))}.level-status{color:var(--text-secondary);font-size:13px;font-weight:500;margin-top:8px}.link-code-btn{background:linear-gradient(135deg,#7c4dff,#536dfe);color:#fff;border:none;padding:6px 12px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.link-code-btn:hover{transform:translateY(-1px);box-shadow:0 3px 10px #7c4dff4d}.link-code-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.link-code-modal{background:#fff;border-radius:20px;padding:32px;max-width:380px;width:90%;text-align:center;box-shadow:0 20px 60px #0003}.link-code-modal h3{margin:0 0 12px;font-size:22px;color:#333}.link-code-desc{font-size:14px;color:#666;line-height:1.6;margin-bottom:24px}.link-code-display{margin-bottom:20px}.link-code-value{font-size:36px;font-weight:800;letter-spacing:6px;color:#7c4dff;background:#f3edff;padding:16px 24px;border-radius:14px;border:2px dashed #b388ff;margin-bottom:12px;font-family:Courier New,monospace}.link-code-expires{font-size:12px;color:#999;margin-bottom:16px}.link-code-copy{background:linear-gradient(135deg,#7c4dff,#536dfe);color:#fff;border:none;padding:10px 24px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.link-code-copy:hover{transform:translateY(-1px);box-shadow:0 4px 12px #7c4dff66}.link-code-loading{font-size:14px;color:#999;padding:20px}.link-code-error{color:#e53935;font-size:14px;margin-bottom:16px}.link-code-error button{margin-top:8px;background:#e53935;color:#fff;border:none;padding:6px 16px;border-radius:8px;cursor:pointer}.link-code-close{display:block;width:100%;margin-top:12px;background:#f5f5f5;border:none;padding:10px;border-radius:10px;font-size:14px;color:#666;cursor:pointer;transition:background .2s}.link-code-close:hover{background:#e0e0e0}.block{display:flex;flex-direction:column;min-width:140px;margin:4px 0;border-radius:var(--radius-md);font-size:14px;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2);cursor:grab;-webkit-user-select:none;user-select:none;transition:transform .2s,box-shadow .2s;box-shadow:0 3px 8px #00000026;touch-action:none}.block:hover{transform:translateY(-3px);box-shadow:0 6px 16px #0003}.block.active{box-shadow:0 0 0 4px #fff,0 0 0 8px gold;animation:pulse .5s ease-in-out infinite alternate}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.03)}}.block.dragging{opacity:.85;transform:rotate(3deg) scale(1.05)}.block-content{display:flex;align-items:center;padding:12px 18px;gap:10px}.block-icon{font-size:20px}.block-label{flex:1;white-space:nowrap;display:flex;align-items:center;gap:2px}.param-value{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:24px;padding:0 8px;background:#ffffff4d;border-radius:12px;font-weight:700;transition:all .2s}.param-value.editable{cursor:pointer}.param-value.editable:hover{background:#ffffff80;transform:scale(1.1);box-shadow:0 2px 8px #00000026}.param-input{width:45px;height:26px;padding:0 6px;border:2px solid rgba(255,255,255,.8);border-radius:8px;background:#fffffff2;color:#333;font-size:14px;font-weight:700;text-align:center;outline:none;transition:all .2s}.param-input:focus{border-color:#fff;box-shadow:0 0 0 3px #ffffff4d}.param-picker{display:inline-flex;align-items:center;gap:2px;background:#fffffff2;border-radius:16px;padding:2px;box-shadow:0 2px 8px #0003}.param-picker-btn{width:28px;height:28px;border:none;border-radius:50%;font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;color:#fff}.param-picker-btn.minus{background:linear-gradient(180deg,#ef5350,#d32f2f)}.param-picker-btn.plus{background:linear-gradient(180deg,#66bb6a,#388e3c)}.param-picker-btn:hover:not(:disabled){transform:scale(1.1);box-shadow:0 2px 8px #0000004d}.param-picker-btn:active:not(:disabled){transform:scale(.95)}.param-picker-btn:disabled{opacity:.4;cursor:not-allowed}.param-picker-value{min-width:32px;text-align:center;font-size:18px;font-weight:700;color:#333;padding:0 4px}.param-picker-confirm{width:28px;height:28px;border:none;border-radius:50%;background:linear-gradient(180deg,#42a5f5,#1976d2);color:#fff;font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-left:4px}.param-picker-confirm:hover{transform:scale(1.1);box-shadow:0 2px 8px #0000004d}.param-value.editing{background:#fff9;box-shadow:0 0 0 2px #fffc;animation:editingPulse 1s ease-in-out infinite}@keyframes editingPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.param-modal-overlay{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.param-modal{background:#fff;border-radius:20px;padding:24px 32px;box-shadow:0 12px 40px #00000040;display:flex;flex-direction:column;align-items:center;gap:16px;min-width:220px;animation:modalIn .2s ease-out}@keyframes modalIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.param-modal-title{font-size:16px;font-weight:700;color:#333;text-align:center}.param-modal-controls{display:flex;align-items:center;gap:16px}.param-modal-btn{width:48px;height:48px;border:none;border-radius:50%;font-size:24px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;color:#fff}.param-modal-btn.minus{background:linear-gradient(180deg,#ef5350,#d32f2f)}.param-modal-btn.plus{background:linear-gradient(180deg,#66bb6a,#388e3c)}.param-modal-btn:hover:not(:disabled){transform:scale(1.15);box-shadow:0 4px 12px #0000004d}.param-modal-btn:active:not(:disabled){transform:scale(.95)}.param-modal-btn:disabled{opacity:.3;cursor:not-allowed}.param-modal-value{font-size:36px;font-weight:800;color:#333;min-width:50px;text-align:center;line-height:1}.param-modal-confirm{width:100%;padding:10px;border:none;border-radius:12px;background:linear-gradient(135deg,#42a5f5,#1976d2);color:#fff;font-size:16px;font-weight:700;cursor:pointer;transition:all .15s}.param-modal-confirm:hover{transform:translateY(-1px);box-shadow:0 4px 12px #1976d266}.param-input::-webkit-outer-spin-button,.param-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.param-input[type=number]{-moz-appearance:textfield}.block-shape-hat{border-radius:20px 20px var(--radius-md) var(--radius-md);position:relative;overflow:hidden}.block-shape-hat .block-content{position:relative;z-index:1}.block-shape-hat:before{content:"";position:absolute;top:0;left:0;right:0;height:8px;background:linear-gradient(to bottom,rgba(255,255,255,.3) 0%,transparent 100%);border-radius:20px 20px 0 0}.block-shape-stack,.block-shape-c-block{border-radius:var(--radius-md)}.block-shape-reporter{border-radius:24px;padding:8px 18px}.block-shape-boolean{clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,12px 100%,0 50%);padding:8px 24px}.block-body{background:#0000001f;margin:0 10px 10px;padding:10px;border-radius:6px;min-height:44px;transition:all .2s ease;border:2px solid transparent}.block-body.drag-over{background:#ffffff40;border-color:#fff9;box-shadow:inset 0 0 10px #fff3}.block-children{display:flex;flex-direction:column}.block-placeholder{color:#ffffffb3;font-size:13px;text-align:center;padding:10px;border:2px dashed rgba(255,255,255,.4);border-radius:6px}.block-body.placement-target{border-color:#ffd700b3;background:#ffd70026;animation:placementPulse 1.2s ease-in-out infinite;cursor:pointer}@keyframes placementPulse{0%,to{border-color:#ffd70080;box-shadow:inset 0 0 6px #ffd7001a}50%{border-color:#ffd700e6;box-shadow:inset 0 0 12px #ffd70040}}.touch-place-hint{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 14px;margin-top:6px;background:linear-gradient(135deg,#ffd70040,#ff980033);border:2px dashed rgba(255,215,0,.6);border-radius:8px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;text-shadow:0 1px 3px rgba(0,0,0,.3)}.touch-place-hint:active{transform:scale(.97);background:linear-gradient(135deg,#ffd70066,#ff980059)}.touch-place-icon{font-size:18px;animation:touchBounce .8s ease-in-out infinite}@keyframes touchBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.block-else-label{padding:8px 18px;font-size:14px;opacity:.9}.block-palette-item{display:flex;align-items:center;padding:12px 18px;gap:10px;border-radius:var(--radius-md);font-size:14px;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2);cursor:grab;transition:transform .2s,box-shadow .2s;box-shadow:0 3px 8px #00000026}.block-palette-item:hover{transform:translate(6px) scale(1.02);box-shadow:0 4px 12px #0003}.block-palette-item.block-shape-hat{border-radius:20px 20px var(--radius-md) var(--radius-md)}.block-palette-item.block-shape-reporter{border-radius:20px}.block-palette-item.block-shape-boolean{clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);padding-left:22px;padding-right:22px}.block-palette-item.advanced{position:relative;border:2px dashed rgba(255,255,255,.5)}.advanced-badge{position:absolute;top:-4px;right:-4px;font-size:12px;background:linear-gradient(135deg,gold,#ffa000);border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0003;z-index:1}.block-palette-item.highlighted{position:relative;animation:highlightPulse 1.5s ease-in-out infinite;box-shadow:0 0 0 3px #ffd70099,0 0 20px #ffd70066}@keyframes highlightPulse{0%,to{box-shadow:0 0 0 3px #ffd70099,0 0 20px #ffd70066;transform:scale(1)}50%{box-shadow:0 0 0 5px #ffd700cc,0 0 30px #ffd70099;transform:scale(1.03)}}.highlight-badge{position:absolute;top:-8px;left:-8px;font-size:16px;background:linear-gradient(135deg,#fff9c4,#ffe082);border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #ffc10766;z-index:2;animation:highlightBadgeBounce 1s ease-in-out infinite}@keyframes highlightBadgeBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.block-palette-item.pending-placement{position:relative;transform:scale(1.05);box-shadow:0 0 0 3px #ff9800cc,0 0 20px #ff980066;animation:pendingPlacementPulse 1s ease-in-out infinite}@keyframes pendingPlacementPulse{0%,to{box-shadow:0 0 0 3px #ff980099,0 0 16px #ff98004d}50%{box-shadow:0 0 0 5px #ff9800e6,0 0 24px #ff980080}}.pending-badge{position:absolute;top:-8px;right:-8px;font-size:14px;background:linear-gradient(135deg,#ff9800,#f57c00);border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #ff980080;z-index:2;animation:pendingBadgePulse 1s ease-in-out infinite}@keyframes pendingBadgePulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.block-palette{display:flex;flex-direction:column;height:100%;background:var(--bg-card);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);border:2px solid var(--border-color)}.palette-categories{display:flex;flex-wrap:wrap;gap:4px;padding:8px;background:linear-gradient(135deg,#ffe0b2,#fff3e0);border-bottom:2px solid var(--border-color);justify-content:center}.category-btn{padding:6px 10px;border:2px solid transparent;border-radius:var(--radius-md);background:var(--bg-card);color:var(--text-secondary);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:var(--shadow-sm)}.category-btn:hover{background:var(--bg-sidebar);color:var(--text-primary);transform:translateY(-2px)}.category-btn.active{background:var(--category-color);color:var(--text-light);border-color:transparent;box-shadow:0 4px 12px #0003}.category-btn.highlighted{box-shadow:0 0 0 3px #fff,0 0 0 6px gold,0 0 15px #ffd70080;animation:category-pulse .8s ease-in-out infinite alternate}@keyframes category-pulse{0%{transform:scale(1)}to{transform:scale(1.05)}}.palette-blocks{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;background:var(--bg-card);touch-action:pan-y!important;-webkit-overflow-scrolling:touch}.palette-blocks::-webkit-scrollbar{width:8px}.palette-blocks::-webkit-scrollbar-track{background:var(--bg-sidebar);border-radius:4px}.palette-blocks::-webkit-scrollbar-thumb{background:var(--color-primary-light);border-radius:4px}.palette-blocks::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}.palette-empty{text-align:center;color:var(--text-secondary);padding:24px;font-size:14px;background:var(--bg-sidebar);border-radius:var(--radius-md);border:2px dashed var(--border-color)}.palette-advanced-toggle{padding:10px 12px;background:linear-gradient(135deg,#1565c0,#0d47a1);border-top:2px solid var(--border-color);display:flex;flex-direction:column;gap:4px}.toggle-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;font-weight:600;color:#fff}.toggle-label input[type=checkbox]{width:16px;height:16px;accent-color:var(--color-secondary);cursor:pointer}.toggle-text{-webkit-user-select:none;user-select:none}.toggle-hint{font-size:11px;color:var(--text-secondary);margin-left:24px}.block-editor{display:flex;flex-direction:column;height:100%;min-height:0;max-height:100%;background:var(--bg-card);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);border:2px solid var(--border-color)}.editor-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:linear-gradient(135deg,#e3f2fd,#bbdefb);border-bottom:2px solid #90CAF9}.editor-header h3{margin:0;font-size:16px;font-weight:700;color:#1565c0}.editor-status{font-size:13px;color:var(--color-secondary);font-weight:600;animation:pulse 1s infinite}.editor-canvas{flex:1;overflow:auto;padding:16px;background:#f8f9fa;min-height:200px;min-width:0;position:relative;touch-action:pan-y!important;-webkit-overflow-scrolling:touch}.editor-canvas.disabled{pointer-events:none;opacity:.7}.editor-canvas::-webkit-scrollbar{width:8px}.editor-canvas::-webkit-scrollbar-track{background:var(--bg-sidebar);border-radius:4px}.editor-canvas::-webkit-scrollbar-thumb{background:var(--color-accent);border-radius:4px}.block-wrapper{position:relative;display:flex;align-items:flex-start;gap:8px;margin-bottom:6px;white-space:nowrap;min-width:fit-content}.block-delete-btn{position:absolute;right:-8px;top:50%;transform:translateY(-50%);width:26px;height:26px;border:2px solid #fff;border-radius:50%;background:var(--color-danger);color:#fff;font-size:16px;font-weight:700;cursor:pointer;opacity:0;transition:all .2s;display:flex;align-items:center;justify-content:center;z-index:10;box-shadow:var(--shadow-sm)}.block-wrapper:hover .block-delete-btn{opacity:1}@media(hover:none)and (pointer:coarse){.block-delete-btn{opacity:.7}.block-delete-btn:active{opacity:1;transform:translateY(-50%) scale(1.1)}}.block-delete-btn:hover{transform:translateY(-50%) scale(1.15);background:#c62828}.editor-hint{text-align:center;color:var(--text-secondary);padding:32px 24px;font-size:15px;font-weight:500;border:3px dashed var(--color-primary-light);border-radius:var(--radius-md);margin-top:8px;background:#ff98000d}.drag-preview{padding:12px 18px;background:var(--color-accent);color:#fff;border-radius:var(--radius-md);font-size:14px;font-weight:600;box-shadow:var(--shadow-lg);transform:rotate(3deg)}.placement-mode-banner{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:linear-gradient(135deg,#fff3e0,#ffe0b2);border-bottom:2px solid #FFB74D;gap:12px;animation:bannerSlideIn .25s ease-out}@keyframes bannerSlideIn{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.placement-mode-info{display:flex;align-items:center;gap:8px;font-size:13px;color:#e65100;font-weight:600}.placement-mode-info strong{color:#bf360c}.placement-mode-icon{font-size:18px;animation:placementIconBounce 1s ease-in-out infinite}@keyframes placementIconBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.placement-mode-cancel{padding:4px 14px;border:1px solid #E65100;border-radius:16px;background:#ffffffb3;color:#e65100;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s}.placement-mode-cancel:hover,.placement-mode-cancel:active{background:#e65100;color:#fff}.touch-place-end-zone{display:flex;align-items:center;justify-content:center;gap:10px;padding:16px;margin-top:10px;border:3px dashed #FFB74D;border-radius:var(--radius-md);background:linear-gradient(135deg,#ffb74d1a,#ff980014);color:#e65100;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s;animation:endZonePulse 1.5s ease-in-out infinite}@keyframes endZonePulse{0%,to{border-color:#ffb74d99;background:linear-gradient(135deg,#ffb74d14,#ff98000d)}50%{border-color:#ff9800e6;background:linear-gradient(135deg,#ffb74d2e,#ff98001f)}}.touch-place-end-zone:active{transform:scale(.98);background:linear-gradient(135deg,#ffb74d40,#ff980033)}.touch-place-end-icon{font-size:22px}.game-canvas-container{position:relative;display:flex;flex-direction:column;align-items:center;padding:8px;background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);border:2px solid var(--border-color);width:100%;max-width:100%;box-sizing:border-box;flex:1;min-height:0}.game-canvas{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;width:100%;overflow:hidden;border-radius:var(--radius-md);background:#faf3e0}.game-canvas canvas{display:block;border-radius:var(--radius-sm);box-shadow:0 4px 20px #00000026}.game-stats{display:flex;gap:4px;margin-top:0;padding:0 8px;background:linear-gradient(135deg,#333,#444);border-radius:25px;box-shadow:var(--shadow-sm);flex-wrap:nowrap;justify-content:flex-start;height:66px;align-items:center}.stat-item{display:flex;align-items:center;gap:2px;cursor:help;padding:0 4px;border-radius:15px;transition:background .2s;height:100%}.stat-item:hover{background:#ffffff1a}.stat-icon{font-size:20px;line-height:1}.stat-label{display:none}.stat-value{font-size:20px;font-weight:800;color:#fff;min-width:14px;text-align:left;margin-left:2px;line-height:1}.game-stats-controls{margin-top:14px;margin-bottom:10px;flex-shrink:0;display:flex;flex-direction:row;flex-wrap:nowrap!important;align-items:center;justify-content:center;width:fit-content;height:56px;padding:0 20px;box-sizing:border-box;background:linear-gradient(180deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,0) 2px,transparent 2px),linear-gradient(180deg,#3d405b,#2c2f48);border:1.5px solid rgba(255,255,255,.08);border-radius:28px;box-shadow:0 4px 16px #0003,inset 0 1px 1px #ffffff0d;z-index:10}.game-stats{display:flex;flex-direction:row;align-items:center;gap:16px;background:none;box-shadow:none;padding:0;margin:0;height:100%;border-radius:0}.game-stats:after{content:"";display:block;width:1px;height:28px;background:#ffffff1a;margin-left:14px}.stat-item{display:flex;align-items:center;background:transparent;padding:0;gap:8px;cursor:help;border-radius:8px;transition:background .2s}.stat-item:hover{background:#ffffff14;padding:3px 8px;margin:-3px -8px}.stat-value{font-size:20px;font-weight:800;font-family:JetBrains Mono,Menlo,monospace;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.4);min-width:18px;text-align:center}.stat-icon{font-size:18px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.inline-controls{display:flex;flex-direction:row;align-items:center;gap:6px;background:none;box-shadow:none;padding:0;margin-left:20px;height:100%;border-radius:0}.inline-btn{width:36px;height:36px;font-size:17px;border-radius:10px;background:#ffffff1a;box-shadow:none;border:1px solid rgba(255,255,255,.06);transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;display:flex;align-items:center;justify-content:center}.inline-btn:hover:not(:disabled){transform:translateY(-1px);background:#fff3;box-shadow:0 3px 10px #0003}.inline-btn:active:not(:disabled){transform:translateY(1px);background:#ffffff26;box-shadow:none}.inline-btn:focus{outline:none}.inline-btn:disabled{opacity:.4;cursor:not-allowed}.inline-btn.step,.inline-btn.reset{width:40px;height:40px;font-size:19px;border-radius:12px}.inline-btn.step{background:#2196f333}.inline-btn.step:hover:not(:disabled){background:#2196f359}.inline-btn.reset{background:#f4433633}.inline-btn.reset:hover:not(:disabled){background:#f4433659}.hint-wrapper{position:relative}.inline-btn.hint{background:#ffc10733}.inline-btn.hint.active{background:#ffc10780;box-shadow:0 0 8px #ffc10766}.inline-btn.speed{background:#9c27b033}.inline-hint-bubble{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);background:linear-gradient(135deg,#fff9c4,#fff176);border:2px solid #FFB300;border-radius:12px;padding:12px 14px;min-width:200px;max-width:280px;box-shadow:0 -2px 16px #0000001f,0 2px 4px #ffb30033;z-index:100;animation:hintBubbleIn .25s ease-out}.inline-hint-bubble:before{content:"";position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid #FFB300}.inline-hint-bubble:after{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #FFF176}@keyframes hintBubbleIn{0%{opacity:0;transform:translate(-50%) translateY(6px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.inline-hint-content p{margin:0;color:#5d4037;font-size:13px;line-height:1.6;font-weight:500}.inline-hint-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}.inline-hint-more{background:#ff9800;color:#fff;border:none;border-radius:6px;padding:4px 10px;font-size:12px;cursor:pointer;transition:background .2s}.inline-hint-more:hover{background:#f57c00}.inline-hint-close{background:#0000001a;color:#795548;border:none;border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:12px;cursor:pointer;transition:background .2s}.inline-hint-close:hover{background:#0003}.inline-btn.run{background:linear-gradient(135deg,#66bb6a,#43a047);width:52px;height:52px;font-size:26px;border-radius:50%;box-shadow:0 4px 14px #4caf5073,0 0 20px #4caf5026;border:2px solid rgba(255,255,255,.25);margin-left:8px;animation:runBreathe 2.5s ease-in-out infinite}@keyframes runBreathe{0%,to{box-shadow:0 4px 14px #4caf5073,0 0 20px #4caf5026}50%{box-shadow:0 4px 18px #4caf508c,0 0 28px #4caf5040}}.inline-btn.run:hover:not(:disabled){transform:scale(1.12);box-shadow:0 6px 20px #4caf508c,0 0 30px #4caf504d;animation:none}.inline-btn.run:active:not(:disabled){transform:scale(.96);box-shadow:0 2px 8px #4caf5066;animation:none}@media(max-width:768px){.game-stats-controls{height:48px;padding:0 12px;border-radius:24px}.game-stats{gap:10px}.game-stats:after{height:22px;margin-left:10px}.inline-controls{gap:5px;margin-left:12px}.stat-value{font-size:16px}.stat-icon{font-size:15px}.inline-btn{width:32px;height:32px;font-size:15px;flex-shrink:0}.inline-btn.step,.inline-btn.reset{width:34px;height:34px;font-size:16px}.inline-btn.run{width:42px;height:42px;font-size:20px;margin-left:6px}}.control-panel{display:flex;flex-direction:column;gap:8px;padding:10px;background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);border:2px solid var(--border-color);width:72px;min-width:72px;flex-shrink:0}.control-buttons{display:flex;flex-direction:column;gap:6px}.control-btn{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;padding:8px 4px;border:none;border-radius:var(--radius-md);font-size:10px;font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 3px 8px #0003;width:100%;min-height:50px;position:relative;overflow:visible}.control-btn:before{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(to bottom,rgba(255,255,255,.3),transparent);pointer-events:none;border-radius:var(--radius-md) var(--radius-md) 0 0}.control-btn:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 6px 16px #00000040}.control-btn:active{transform:translateY(0) scale(.98);box-shadow:0 2px 4px #00000026}.control-btn.primary{background:linear-gradient(180deg,#6fcf6f,#4caf50 40%,#388e3c);color:#fff;border:2px solid #2E7D32}.control-btn.primary:hover{background:linear-gradient(180deg,#81c784,#66bb6a 40%,#4caf50)}.control-btn.warning{background:linear-gradient(180deg,#ffd54f,#ff9800 40%,#f57c00);color:#fff;border:2px solid #EF6C00}.control-btn.danger{background:linear-gradient(180deg,#ef5350,#f44336 40%,#d32f2f);color:#fff;border:2px solid #C62828}.control-btn.secondary{background:linear-gradient(180deg,#b0bec5,#78909c 40%,#546e7a);color:#fff;border:2px solid #455A64}.control-btn.step{background:linear-gradient(180deg,#64b5f6,#2196f3 40%,#1976d2);color:#fff;border:2px solid #1565C0}.control-btn.step:hover{background:linear-gradient(180deg,#90caf9,#64b5f6 40%,#42a5f5)}.btn-icon{font-size:22px;line-height:1;flex-shrink:0;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}.btn-text{font-size:10px;letter-spacing:.5px;text-shadow:0 1px 2px rgba(0,0,0,.2)}.speed-control{display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:6px;background:linear-gradient(135deg,#f5f5f5,#e0e0e0);border-radius:var(--radius-md);border:1px solid #ccc}.speed-control label{color:var(--text-secondary);font-size:9px;font-weight:700;text-align:center;text-transform:uppercase;letter-spacing:.5px}.speed-control input[type=range]{width:100%;height:4px;border-radius:2px;background:linear-gradient(to right,#4caf50,#ffc107,#f44336);appearance:none;cursor:pointer;margin:3px 0}.speed-control input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,#fff,#e0e0e0);border:2px solid var(--color-primary);cursor:pointer;transition:all .15s ease;box-shadow:0 1px 3px #0000004d}.speed-control input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 2px 6px #0006}.speed-control input[type=range]:disabled{opacity:.4;cursor:not-allowed}.speed-label{color:var(--text-primary);font-size:9px;font-weight:700;text-align:center;padding:2px 4px;background:#fffc;border-radius:3px}.hint-section{margin-top:2px;position:relative}.hint-btn{width:100%;padding:6px 4px;border:2px dashed #FFB74D;border-radius:var(--radius-md);background:linear-gradient(135deg,#fff8e1,#ffecb3);color:#f57c00;font-size:10px;font-weight:700;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;line-height:1.2}.hint-btn:hover{border-color:#ff9800;background:linear-gradient(135deg,#ffecb3,#ffe082);color:#e65100;transform:scale(1.03)}.hint-bubble{position:absolute;top:100%;right:0;margin-top:8px;padding:10px;background:linear-gradient(135deg,#fff8e1,#ffecb3);border-radius:var(--radius-md);border-left:3px solid var(--color-primary);box-shadow:var(--shadow-md);z-index:100;min-width:180px;max-width:250px}.hint-bubble p{margin:0;color:var(--text-primary);font-size:12px;line-height:1.5}.more-hint-btn{margin-top:8px;padding:6px 10px;border:none;border-radius:var(--radius-sm);background:var(--color-primary);color:#fff;font-size:11px;font-weight:600;cursor:pointer;width:100%}.more-hint-btn:hover{background:var(--color-primary-dark)}@media(max-width:1200px)and (min-width:769px){.control-panel{flex-direction:row;flex-wrap:wrap;width:100%;min-width:auto;max-width:400px;padding:8px 12px;gap:6px;justify-content:center}.control-buttons{flex-direction:row;gap:6px}.control-btn{min-height:44px;padding:6px 12px;min-width:60px}.btn-icon{font-size:18px}.btn-text{font-size:9px}.speed-control{flex-direction:row;align-items:center;gap:6px;min-width:120px}.hint-section{margin-top:0}}.result-modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.result-modal{background:linear-gradient(180deg,#fff,#fff8e1);border-radius:var(--radius-xl);padding:36px;max-width:420px;width:90%;text-align:center;animation:slideUp .4s ease;box-shadow:0 20px 60px #00000040;border:3px solid var(--color-primary-light)}@keyframes slideUp{0%{opacity:0;transform:translateY(40px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.result-header{margin-bottom:24px}.result-header.success h2{color:var(--color-secondary)}.result-header.fail h2{color:var(--color-danger)}.result-emoji{display:block;font-size:72px;margin-bottom:16px;animation:bounce .6s ease}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-25px)}}.result-header h2{margin:0;font-size:32px;font-weight:700}.result-stars{display:flex;justify-content:center;gap:12px;margin-bottom:24px}.star{font-size:48px;opacity:.2;transform:scale(.8);transition:all .3s}.star.active{opacity:1;transform:scale(1);animation:starPop .4s ease;filter:drop-shadow(0 2px 4px rgba(255,193,7,.4))}@keyframes starPop{0%{transform:scale(0)}50%{transform:scale(1.4)}to{transform:scale(1)}}.star:nth-child(2).active{animation-delay:.1s}.star:nth-child(3).active{animation-delay:.2s}.result-stats{display:flex;justify-content:center;gap:28px;margin-bottom:24px;padding:18px;background:linear-gradient(135deg,#e3f2fd,#bbdefb);border-radius:var(--radius-md);border:2px solid #90CAF9}.stat{display:flex;flex-direction:column;gap:6px}.stat-label{color:var(--text-secondary);font-size:13px;font-weight:500}.stat-value{color:#1565c0;font-size:24px;font-weight:700}.result-goals{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}.goal{display:flex;align-items:center;gap:10px;padding:10px 18px;background:var(--bg-card);border-radius:var(--radius-md);color:var(--text-primary);font-size:15px;font-weight:500;border:2px solid var(--border-color)}.goal.secondary{opacity:.85}.goal.completed{color:var(--color-secondary);border-color:#a5d6a7;background:#e8f5e9}.goal.incomplete{color:var(--color-danger);border-color:#ffcdd2;background:#ffebee}.fail-reason{margin-bottom:24px;padding:20px;background:linear-gradient(135deg,#ffebee,#ffcdd2);border-radius:var(--radius-md);border-left:5px solid var(--color-danger)}.fail-message{color:#c62828;font-size:16px;font-weight:600;margin:0 0 12px}.fail-hint{color:var(--color-primary-dark);font-size:14px;font-weight:500;margin:0}.incomplete-goals{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}.result-actions{display:flex;gap:14px;justify-content:center}.action-btn{padding:16px 32px;border:none;border-radius:var(--radius-md);font-size:17px;font-weight:700;cursor:pointer;transition:all .2s;box-shadow:var(--shadow-sm)}.action-btn:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}.action-btn.primary{background:linear-gradient(135deg,#4caf50,#66bb6a);color:#fff}.action-btn.primary:hover{background:linear-gradient(135deg,#43a047,#4caf50)}.action-btn.secondary{background:linear-gradient(135deg,#78909c,#90a4ae);color:#fff}.action-btn.secondary:hover{background:linear-gradient(135deg,#607d8b,#78909c)}.fail-progress{margin-bottom:16px}.progress-bar{height:12px;background:#e0e0e0;border-radius:6px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#ff9800,#ffc107);border-radius:6px;transition:width .5s ease}.progress-text{font-size:13px;color:var(--text-secondary);margin-top:6px;display:block}.fail-explanation{margin-bottom:16px;padding:14px 18px;background:#fff3e0;border-radius:var(--radius-md);border-left:4px solid #FF9800}.fail-detail{margin:0;font-size:14px;color:#e65100;line-height:1.6}.fail-suggestions{margin-bottom:16px;padding:14px 18px;background:#e3f2fd;border-radius:var(--radius-md);text-align:left}.fail-suggestions h4{margin:0 0 10px;font-size:14px;color:#1565c0;font-weight:600}.fail-suggestions ul{margin:0;padding-left:20px}.fail-suggestions li{font-size:13px;color:#1976d2;line-height:1.6;margin:4px 0}.fail-blocks{margin-bottom:16px;display:flex;align-items:center;flex-wrap:wrap;gap:8px;justify-content:center}.blocks-label{font-size:13px;color:var(--text-secondary)}.suggested-blocks{display:flex;gap:6px}.suggested-block{padding:4px 10px;background:linear-gradient(135deg,#4caf50,#66bb6a);color:#fff;border-radius:var(--radius-sm);font-size:12px;font-weight:500}.incomplete-goals h4{margin:0 0 10px;font-size:14px;color:var(--text-secondary);font-weight:500;text-align:left}.fail-encouragement{margin:16px 0;padding:12px 18px;background:linear-gradient(135deg,#e8f5e9,#c8e6c9);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;gap:8px;border:2px dashed #81C784}.encouragement-icon{font-size:24px}.encouragement-text{font-size:15px;color:#2e7d32;font-weight:600}.result-header.fail{animation:shake .5s ease}.result-header.fail h2{font-size:18px;color:#e65100}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.thinking-tags{margin-top:12px;padding:10px 12px;background:linear-gradient(135deg,#e3f2fd,#f3e5f5);border-radius:10px}.thinking-tags h4{font-size:13px;color:#5c6bc0;margin-bottom:8px}.tags-container{display:flex;flex-wrap:wrap;gap:6px}.thinking-tag{display:inline-block;padding:3px 10px;background:linear-gradient(135deg,#7e57c2,#5c6bc0);color:#fff;border-radius:12px;font-size:12px;font-weight:600;animation:tagPop .3s ease forwards;opacity:0;transform:scale(.8)}.thinking-tag:nth-child(1){animation-delay:.1s}.thinking-tag:nth-child(2){animation-delay:.2s}.thinking-tag:nth-child(3){animation-delay:.3s}.thinking-tag:nth-child(4){animation-delay:.4s}@keyframes tagPop{to{opacity:1;transform:scale(1)}}.boss-complete{margin-top:12px;padding:14px;background:linear-gradient(135deg,#ffd54f,#ff8f00);border-radius:12px;text-align:center;animation:bossGlow 1s ease infinite alternate}.boss-emoji{font-size:36px;display:block;margin-bottom:6px}.boss-text{color:#fff;font-size:15px;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.2)}@keyframes bossGlow{0%{box-shadow:0 0 8px #ffc10766}to{box-shadow:0 0 20px #ffc107cc}}.lock-reason{display:block;font-size:10px;color:#999;margin-top:4px}.hint-panel{position:fixed;bottom:120px;left:50%;transform:translate(-50%);min-width:320px;max-width:480px;background:#fff;border-radius:16px;box-shadow:0 8px 32px #00000026;overflow:hidden;z-index:1000;animation:hintSlideIn .3s ease-out}.hint-panel--animating{animation:hintSlideIn .3s ease-out}@keyframes hintSlideIn{0%{opacity:0;transform:translate(-50%) translateY(20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.hint-panel--light{border-top:4px solid #FFB300}.hint-panel--light .hint-panel__header{background:linear-gradient(135deg,#fff8e1,#ffecb3)}.hint-panel--light .hint-panel__icon{background:#ffb300}.hint-panel--medium{border-top:4px solid #1976D2}.hint-panel--medium .hint-panel__header{background:linear-gradient(135deg,#e3f2fd,#bbdefb)}.hint-panel--medium .hint-panel__icon{background:#1976d2}.hint-panel--heavy{border-top:4px solid #7B1FA2}.hint-panel--heavy .hint-panel__header{background:linear-gradient(135deg,#f3e5f5,#e1bee7)}.hint-panel--heavy .hint-panel__icon{background:#7b1fa2}.hint-panel__header{display:flex;align-items:center;padding:12px 16px;gap:10px}.hint-panel__icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:18px;color:#fff}.hint-panel__title{flex:1;font-size:16px;font-weight:600;color:#333}.hint-panel__close{width:28px;height:28px;border:none;background:#0000001a;border-radius:50%;font-size:18px;color:#666;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.hint-panel__close:hover{background:#0003;color:#333}.hint-panel__content{padding:16px 20px}.hint-content--text{text-align:center}.hint-content__emoji{display:block;font-size:32px;margin-bottom:8px}.hint-content__message{font-size:15px;line-height:1.6;color:#444;margin:0}.hint-content--category .hint-content__categories{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;justify-content:center}.hint-content__category-tag{padding:6px 12px;background:#f0f0f0;border-radius:20px;font-size:13px;color:#555}.hint-content--highlight .hint-content__hint-text{margin-top:8px;padding:8px 12px;background:#f5f5f5;border-radius:8px;font-size:13px;color:#666;text-align:center}.hint-content--direction .hint-content__steps{margin:12px 0 0;padding-left:20px}.hint-content__step{font-size:14px;line-height:1.8;color:#555;margin-bottom:4px}.hint-content__step::marker{color:#1976d2;font-weight:700}.hint-content__suggested{margin-top:12px;padding-top:12px;border-top:1px dashed #ddd}.hint-content__suggested-label{display:block;font-size:13px;color:#888;margin-bottom:8px}.hint-content__blocks{display:flex;flex-wrap:wrap;gap:6px}.hint-content__block-tag{padding:4px 10px;background:#4c97ff;color:#fff;border-radius:12px;font-size:12px}.hint-content--partial .hint-content__demo-info{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;padding:10px;background:linear-gradient(135deg,#f3e5f5,#e1bee7);border-radius:10px;font-size:14px;color:#7b1fa2}.hint-content__demo-icon{font-size:20px}.hint-panel__footer{display:flex;gap:10px;padding:12px 16px;background:#f8f9fa;border-top:1px solid #eee}.hint-panel__btn{flex:1;padding:10px 16px;border:none;border-radius:10px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.hint-panel__btn--dismiss{background:#e0e0e0;color:#555}.hint-panel__btn--dismiss:hover{background:#d0d0d0}.hint-panel__btn--demo{background:linear-gradient(135deg,#7b1fa2,#9c27b0);color:#fff}.hint-panel__btn--demo:hover{transform:translateY(-1px);box-shadow:0 4px 12px #7b1fa24d}@media(max-width:600px){.hint-panel{min-width:280px;max-width:calc(100vw - 32px);bottom:100px}.hint-panel__header{padding:10px 14px}.hint-panel__content{padding:14px 16px}.hint-panel__footer{padding:10px 14px}}.demo-player{display:flex;flex-direction:column;gap:16px;background:var(--bg-card);border-radius:var(--radius-lg);padding:16px;box-shadow:var(--shadow-md)}.demo-canvas-wrapper{display:flex;justify-content:center;background:var(--bg-sidebar);border-radius:var(--radius-md);padding:12px}.demo-canvas{border-radius:var(--radius-md);box-shadow:inset 0 2px 8px #0000001a}.demo-controls{display:flex;justify-content:center;gap:12px}.demo-btn{padding:10px 20px;border:none;border-radius:var(--radius-md);background:var(--color-primary);color:var(--text-light);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:6px}.demo-btn:hover{background:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.demo-btn:active{transform:translateY(0)}.demo-steps{padding:12px;background:var(--bg-sidebar);border-radius:var(--radius-md)}.demo-steps h4{margin:0 0 10px;font-size:14px;color:var(--text-secondary)}.demo-steps ol{margin:0;padding-left:20px}.demo-step{padding:6px 8px;margin:4px 0;border-radius:var(--radius-sm);font-size:13px;color:var(--text-secondary);transition:all .2s}.demo-step.active{background:var(--color-primary-light);color:var(--color-primary-dark);font-weight:600;animation:stepPulse .5s ease-out}.demo-step.done{color:var(--color-success);text-decoration:line-through;opacity:.6}@keyframes stepPulse{0%{transform:scale(1);box-shadow:0 0 #ff980080}50%{transform:scale(1.02);box-shadow:0 0 0 8px #ff980000}to{transform:scale(1)}}.step-label{font-weight:500}.step-desc{font-size:12px;color:var(--text-secondary);margin-left:4px}@media(max-width:600px){.demo-canvas-wrapper{padding:8px}.demo-controls{flex-direction:column}.demo-btn{justify-content:center}}.demo-modal-container{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center}.demo-modal-overlay{position:absolute;inset:0;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn .2s ease-out}.demo-modal-content{position:relative;z-index:1;background:var(--bg-card);border-radius:var(--radius-xl);max-width:500px;max-height:90vh;width:95%;overflow:hidden;box-shadow:0 25px 80px #0006;animation:modalSlideUp .3s ease-out}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.demo-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:linear-gradient(135deg,#ff9800,#f57c00);color:#fff}.demo-modal-header h3{margin:0;font-size:18px;font-weight:600}.demo-modal-close{width:32px;height:32px;border:none;border-radius:50%;background:#fff3;color:#fff;font-size:20px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.demo-modal-close:hover{background:#ffffff4d;transform:rotate(90deg)}.demo-modal-body{padding:20px;max-height:60vh;overflow-y:auto}.demo-video-wrapper{border-radius:var(--radius-md);overflow:hidden;background:#000}.demo-video-wrapper video{width:100%;display:block}.demo-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.demo-placeholder-icon{font-size:64px;margin-bottom:16px;animation:bounce 1s infinite}.demo-placeholder p{color:var(--text-secondary);font-size:16px}.demo-modal-footer{padding:16px 20px;background:var(--bg-sidebar);border-top:1px solid var(--border-color);display:flex;flex-direction:column;gap:12px;align-items:center}.demo-tip{margin:0;font-size:14px;color:var(--text-secondary)}.demo-try-btn{padding:14px 32px;border:none;border-radius:var(--radius-lg);background:linear-gradient(135deg,#4caf50,#388e3c);color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #4caf504d}.demo-try-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4caf5066}.demo-try-btn:active{transform:translateY(0)}@media(max-width:600px){.demo-modal-content{max-width:100%;border-radius:var(--radius-lg) var(--radius-lg) 0 0;max-height:95vh}}.history-modal-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:900;display:flex;align-items:center;justify-content:center;animation:fadeIn .2s ease-out}.history-modal{background:#fff;border-radius:16px;width:90%;max-width:480px;max-height:70vh;display:flex;flex-direction:column;box-shadow:0 16px 48px #00000040;animation:slideUp .25s ease-out;overflow:hidden}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.history-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:linear-gradient(135deg,#ff9800,#f57c00);color:#fff}.history-modal-header h3{margin:0;font-size:16px;font-weight:700}.history-close-btn{width:32px;height:32px;border:none;border-radius:50%;background:#ffffff40;color:#fff;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.history-close-btn:hover{background:#fff6}.history-modal-body{flex:1;overflow-y:auto;padding:16px}.history-loading{text-align:center;padding:40px 20px;color:#999}.history-loading span{font-size:40px;display:block;margin-bottom:12px;animation:bounce 1s infinite}.history-loading p{margin:0;font-size:14px}.history-empty{text-align:center;padding:40px 20px;color:#999}.history-empty span{font-size:48px;display:block;margin-bottom:12px}.history-empty p{margin:0 0 4px;font-size:14px;font-weight:500;color:#666}.history-empty-sub{color:#aaa!important;font-size:12px!important}.history-summary{display:flex;gap:12px;margin-bottom:16px;padding:12px;background:linear-gradient(135deg,#fff8e1,#fff3e0);border-radius:12px;border:1px solid #FFE0B2}.summary-item{flex:1;text-align:center;display:flex;flex-direction:column;gap:2px}.summary-value{font-size:18px;font-weight:700;color:#e65100}.summary-label{font-size:11px;color:#8d6e63;font-weight:600}.history-list{display:flex;flex-direction:column;gap:8px}.history-item{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#f5f5f5;border-radius:12px;border:2px solid transparent;transition:all .2s ease}.history-item:hover{background:#fff3e0;border-color:#ffe0b2}.history-item-blocks{font-size:13px;color:#555}.history-item.passed{border-left:4px solid #4CAF50}.history-item.failed{border-left:4px solid #EF5350}.history-item-status{min-width:60px}.history-stars{font-size:14px}.history-failed-badge{font-size:11px;padding:3px 8px;background:#ffebee;color:#ef5350;border-radius:6px;font-weight:600}.history-item-info{flex:1;display:flex;gap:12px;font-size:13px;color:#555;font-weight:500}.history-item-date{font-size:12px;color:#999;white-space:nowrap}.history-play-btn{width:36px;height:36px;border:none;border-radius:50%;background:linear-gradient(135deg,#ff9800,#f57c00);color:#fff;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #ff98004d;transition:all .2s;flex-shrink:0}.history-play-btn:hover{transform:scale(1.1);box-shadow:0 4px 12px #ff980066}.history-play-btn:disabled{opacity:.7;cursor:default;transform:none}.history-replay-overlay{position:fixed;inset:0;background:#000000b3;z-index:1000;display:flex;align-items:center;justify-content:center}.history-replay-content{max-width:90%;max-height:90%}.achievement-unlock-overlay{position:fixed;inset:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:10000;animation:overlay-fade-in .3s ease}@keyframes overlay-fade-in{0%{opacity:0}to{opacity:1}}.achievement-unlock-modal{position:relative;background:linear-gradient(180deg,#1a1a2e,#16213e);border-radius:20px;padding:32px 40px;text-align:center;max-width:380px;width:90%;overflow:hidden;animation:modal-pop-in .6s cubic-bezier(.34,1.56,.64,1);box-shadow:0 20px 60px #00000080}@keyframes modal-pop-in{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.achievement-unlock-modal--animating{animation:modal-shake .6s ease}@keyframes modal-shake{0%,to{transform:scale(1)}25%{transform:scale(1.02)}50%{transform:scale(.98)}75%{transform:scale(1.01)}}.achievement-unlock-modal--legendary{background:linear-gradient(180deg,#1a1a2e,#2a1a10,#1a1a2e);border:2px solid #fa8c16}.achievement-unlock-modal--legendary:before{content:"";position:absolute;inset:-50%;background:radial-gradient(ellipse,rgba(250,140,22,.15) 0%,transparent 70%);animation:legendary-glow 2s infinite}@keyframes legendary-glow{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.achievement-unlock-modal--epic{border:2px solid #722ed1}.achievement-unlock-modal--rare{border:2px solid #1890ff}.achievement-unlock-modal__effects{position:absolute;inset:0;pointer-events:none;overflow:hidden}.achievement-unlock-modal__sparkle{position:absolute;font-size:24px;opacity:0;animation:sparkle 1.5s ease-out infinite}.sparkle-1{top:10%;left:10%;animation-delay:0s}.sparkle-2{top:20%;right:15%;animation-delay:.3s}.sparkle-3{top:60%;left:5%;animation-delay:.6s}.sparkle-4{top:70%;right:10%;animation-delay:.9s}.sparkle-5{top:40%;left:80%;animation-delay:1.2s}@keyframes sparkle{0%{transform:scale(0) rotate(0);opacity:0}50%{transform:scale(1) rotate(180deg);opacity:1}to{transform:scale(0) rotate(360deg);opacity:0}}.achievement-unlock-modal__header{margin-bottom:16px}.achievement-unlock-modal__badge{display:inline-block;padding:6px 16px;background:linear-gradient(90deg,#ff6b6b,#ff8e53);color:#fff;border-radius:20px;font-size:14px;font-weight:600;animation:badge-bounce .5s ease .3s}@keyframes badge-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.achievement-unlock-modal__icon{position:relative;width:100px;height:100px;margin:0 auto 20px;display:flex;align-items:center;justify-content:center}.achievement-unlock-modal__icon-emoji{font-size:56px;position:relative;z-index:2;animation:icon-pop .6s cubic-bezier(.34,1.56,.64,1) .2s both}@keyframes icon-pop{0%{transform:scale(0)}to{transform:scale(1)}}.achievement-unlock-modal__icon-ring{position:absolute;width:100%;height:100%;border:3px solid var(--rarity-color);border-radius:50%;opacity:.5;animation:ring-expand 1s ease-out infinite}.ring-2{animation-delay:.5s}@keyframes ring-expand{0%{transform:scale(.8);opacity:.8}to{transform:scale(1.5);opacity:0}}.achievement-unlock-modal__name{margin:0 0 8px;font-size:24px;font-weight:700;color:#fff;animation:text-slide-up .5s ease .4s both}@keyframes text-slide-up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.achievement-unlock-modal__description{margin:0 0 12px;font-size:14px;color:#a0a0a0;animation:text-slide-up .5s ease .5s both}.achievement-unlock-modal__rarity{display:inline-block;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500;margin-bottom:20px;animation:text-slide-up .5s ease .6s both}.achievement-unlock-modal__rewards{background:#ffffff0d;border-radius:12px;padding:16px;margin-bottom:20px;animation:text-slide-up .5s ease .7s both}.achievement-unlock-modal__rewards-label{display:block;font-size:13px;color:#888;margin-bottom:12px}.achievement-unlock-modal__rewards-list{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.achievement-unlock-modal__reward-item{display:flex;align-items:center;gap:6px}.achievement-unlock-modal__reward-item .reward-icon{font-size:24px}.achievement-unlock-modal__reward-item .reward-value{font-size:18px;font-weight:600;color:#fff}.achievement-unlock-modal__close{width:100%;padding:14px 24px;background:linear-gradient(90deg,var(--rarity-color) 0%,#36cfc9 100%);color:#fff;border:none;border-radius:10px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;animation:text-slide-up .5s ease .8s both}.achievement-unlock-modal__close:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.achievement-unlock-modal__close:active{transform:translateY(0)}.achievement-unlock-modal__progress{position:absolute;bottom:0;left:0;height:3px;background:var(--rarity-color);animation:progress-shrink linear forwards}@keyframes progress-shrink{0%{width:100%}to{width:0%}}@media(max-width:480px){.achievement-unlock-modal{padding:24px}.achievement-unlock-modal__icon{width:80px;height:80px}.achievement-unlock-modal__icon-emoji{font-size:44px}.achievement-unlock-modal__name{font-size:20px}}.game-page{min-height:100vh;max-height:100vh;display:flex;flex-direction:column;background:var(--bg-main);overflow:hidden;touch-action:none;position:fixed;inset:0}.game-page.loading,.game-page.error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.loading-icon{font-size:80px;animation:bounce 1s infinite}.game-page.loading p,.game-page.error p{color:var(--text-primary);font-size:18px;font-weight:500}.game-page.error button{padding:12px 24px;border:none;border-radius:var(--radius-md);background:var(--color-secondary);color:var(--text-light);font-size:16px;font-weight:600;box-shadow:var(--shadow-sm)}.game-header{display:flex;align-items:center;gap:24px;padding:12px 24px;background:var(--bg-header);box-shadow:var(--shadow-md)}.back-btn{padding:10px 18px;border:none;border-radius:var(--radius-md);background:#ffffffe6;color:var(--color-primary-dark);font-size:14px;font-weight:600;box-shadow:var(--shadow-sm)}.back-btn:hover{background:#fff}.level-info{display:flex;align-items:center;gap:12px}.level-num{padding:6px 14px;background:var(--color-primary);border-radius:20px;font-size:14px;font-weight:700;color:var(--text-light);box-shadow:var(--shadow-sm)}.level-info h2{margin:0;font-size:16px;color:var(--text-light);text-shadow:0 2px 4px rgba(0,0,0,.1)}.chapter{padding:6px 14px;background:var(--color-secondary);border-radius:20px;font-size:13px;font-weight:600;color:var(--text-light);box-shadow:var(--shadow-sm)}.level-intro{flex:1;padding:10px 18px;background:#ffffffe6;border-radius:var(--radius-md);color:var(--text-primary);font-size:15px;font-weight:500;box-shadow:var(--shadow-sm)}.user-status-panel{display:flex;align-items:center;gap:8px;padding:8px 16px;background:#fffffff2;border-radius:var(--radius-md);box-shadow:var(--shadow-sm)}.user-nickname{font-size:14px;font-weight:600;color:var(--text-primary)}.user-divider{color:#ccc;font-size:14px}.user-status-panel .badge{font-size:13px;font-weight:600;padding:4px 10px;border-radius:12px;cursor:help}.user-status-panel .badge.stars{background:linear-gradient(135deg,#ffc107,#ffd54f);color:#5d4037}.user-status-panel .badge.coins{background:linear-gradient(135deg,#ff9800,#ffb74d);color:#4e342e}.user-status-panel .badge.level{background:linear-gradient(135deg,#7c4dff,#b39ddb);color:#2d1b69}.level-progress{display:flex;align-items:center;gap:6px}.level-progress-details{display:flex;flex-direction:column;gap:2px}.level-progress-text{font-size:12px;font-weight:600;color:#5c5c5c;white-space:nowrap}.level-progress-bar{position:relative;width:160px;height:14px;background:#e0e0e0;border-radius:999px;overflow:hidden;box-shadow:inset 0 1px 3px #00000026}.level-progress-fill{height:100%;background:linear-gradient(90deg,#7c4dff,#26c6da);border-radius:999px;transition:width .5s ease;min-width:2px}.level-progress-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:10px;font-weight:700;color:#333;text-shadow:0 0 3px rgba(255,255,255,.8);white-space:nowrap}.history-btn{width:42px;height:42px;border:none;border-radius:var(--radius-md);background:#ffffffe6;font-size:20px;cursor:pointer;transition:all .2s;box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center}.history-btn:hover{background:#fff;transform:scale(1.1)}.settings-btn{width:42px;height:42px;border:none;border-radius:var(--radius-md);background:#ffffffe6;font-size:20px;cursor:pointer;transition:all .2s;box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center}.settings-btn:hover{background:#fff;transform:rotate(45deg) scale(1.1)}.settings-panel{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-start;justify-content:flex-end;padding:70px 20px 20px}.settings-overlay{position:absolute;inset:0;background:#0000004d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.settings-content{position:relative;z-index:1;background:#fff;border-radius:var(--radius-lg);padding:20px;min-width:280px;box-shadow:0 10px 40px #0003;animation:slideIn .2s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.settings-content h4{margin:0 0 16px;font-size:16px;color:var(--text-primary);border-bottom:2px solid var(--border-color);padding-bottom:10px}.setting-item{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border-color)}.setting-item span{font-size:14px;color:var(--text-primary);font-weight:500}.setting-toggle{display:flex;gap:4px;background:#f0f0f0;padding:3px;border-radius:8px}.setting-toggle button{padding:6px 14px;border:none;border-radius:6px;background:transparent;color:#666;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s}.setting-toggle button.active{background:var(--color-primary);color:#fff;box-shadow:0 2px 8px #ff98004d}.settings-close{width:100%;margin-top:16px;padding:10px;border:none;border-radius:var(--radius-md);background:var(--color-secondary);color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.settings-close:hover{background:#43a047}.setting-item.volume{flex-direction:row;gap:10px}.setting-item.volume input[type=range]{flex:1;height:6px;border-radius:3px;background:linear-gradient(to right,var(--color-primary-light),var(--color-secondary));appearance:none;cursor:pointer}.setting-item.volume input[type=range]::-webkit-slider-thumb{appearance:none;width:16px;height:16px;border-radius:50%;background:var(--color-primary);border:2px solid white;cursor:pointer;box-shadow:var(--shadow-sm)}.volume-value{min-width:40px;text-align:right;font-size:13px;color:var(--text-secondary)}.game-main{flex:1;display:flex;gap:12px;padding:12px 16px;overflow:hidden;max-height:calc(100vh - 80px)}.game-sidebar{width:180px;flex-shrink:0;display:flex;flex-direction:column}.game-sidebar.middle{width:280px}.game-sidebar.middle.code-area{min-height:0;max-height:calc(100vh - 120px);overflow:hidden}.game-center{flex:1;display:flex;flex-direction:column;justify-content:space-between;align-items:center;min-width:0;height:100%;position:relative;gap:0;background:linear-gradient(180deg,#00000005,#0000000f);border-radius:var(--radius-lg);padding:12px 8px}.game-display-area{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;flex:1;overflow:visible;width:100%;max-width:100%;padding-top:4px}.game-canvas-container{flex:1 1 auto;width:100%;min-height:0;box-sizing:border-box;display:flex;flex-direction:column;align-items:center}.game-display-area>.control-panel{display:none}@media(max-width:1200px)and (min-width:769px){.game-header{padding:8px 12px;gap:10px;flex-wrap:wrap}.level-intro{order:10;flex:1 1 100%;margin-top:4px;font-size:13px;padding:8px 12px}.game-main{flex-direction:row;flex-wrap:nowrap;gap:10px;padding:10px;max-height:calc(100vh - 90px);overflow:hidden}.game-sidebar.left.palette-area,.game-sidebar.right.palette-area{width:200px;min-width:200px;flex-shrink:0;max-height:100%;overflow:hidden}.game-sidebar.middle.code-area{width:240px;min-width:240px;flex-shrink:0;max-height:100%;overflow:hidden}.game-center{flex:1;min-width:320px;max-height:100%;overflow:visible}}@media(max-width:768px){.game-header{flex-direction:column;gap:8px;padding:10px 12px}.level-info{width:100%;justify-content:center;flex-wrap:wrap}.level-intro{text-align:center}.user-status-panel{display:none}.game-main{flex-direction:column;gap:10px;padding:10px;max-height:none;overflow:auto}.game-center{order:1;width:100%;max-height:50vh}.game-sidebar.middle.code-area{order:2;width:100%;max-height:30vh}.game-sidebar.left.palette-area,.game-sidebar.right.palette-area{order:3;width:100%;max-height:25vh;overflow:auto}.game-display-area{flex-direction:column}}.previous-solution-hint{display:flex;align-items:center;gap:8px;padding:10px 12px;margin-bottom:10px;background:linear-gradient(135deg,#e3f2fd,#bbdefb);border-radius:var(--radius-md);border:2px solid #64B5F6;font-size:13px;font-weight:500;color:#1565c0}.previous-solution-hint span{flex:1}.previous-solution-hint button{padding:6px 12px;border:none;border-radius:var(--radius-sm);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s}.previous-solution-hint button:first-of-type{background:#2196f3;color:#fff}.previous-solution-hint button:first-of-type:hover{background:#1976d2}.previous-solution-hint button.dismiss{padding:4px 8px;background:transparent;color:#64b5f6;font-size:16px}.previous-solution-hint button.dismiss:hover{color:#1976d2;background:#2196f31a}.demo-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center}.demo-overlay{position:absolute;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.demo-modal-content{position:relative;z-index:1;background:var(--bg-card);border-radius:var(--radius-lg);padding:20px;max-width:90vw;max-height:90vh;box-shadow:0 20px 60px #0006;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.demo-modal-content video{max-width:100%;max-height:70vh;border-radius:var(--radius-md)}.demo-close-btn{position:absolute;top:-10px;right:-10px;width:36px;height:36px;border:none;border-radius:50%;background:var(--color-error);color:#fff;font-size:20px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0000004d;transition:all .2s}.demo-close-btn:hover{transform:scale(1.1);background:#c62828}.achievement-card{display:flex;gap:16px;padding:16px;background:#fff;border-radius:12px;border:2px solid #e0e0e0;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.achievement-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.achievement-card--unlocked{border-color:var(--rarity-color);background:linear-gradient(135deg,#fff 0%,var(--rarity-bg) 100%)}.achievement-card--unlocked:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--rarity-color)}.achievement-card--hidden{background:#f5f5f5;border-style:dashed;border-color:#ccc}.achievement-card--hidden:hover{background:#eee}.achievement-card--legendary{background:linear-gradient(135deg,#fff,#fff7e6,#ffedd5)}.achievement-card--legendary.achievement-card--unlocked{animation:legendary-shine 3s infinite}@keyframes legendary-shine{0%,to{box-shadow:0 4px 12px #fa8c1633}50%{box-shadow:0 4px 20px #fa8c1666}}.achievement-card--compact{padding:12px;gap:12px}.achievement-card--compact .achievement-card__icon{width:48px;height:48px}.achievement-card--compact .achievement-card__icon-emoji{font-size:24px}.achievement-card--compact .achievement-card__name{font-size:14px}.achievement-card--compact .achievement-card__description{font-size:12px}.achievement-card__icon{position:relative;flex-shrink:0;width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#f8f8f8,#e8e8e8);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000001a}.achievement-card--unlocked .achievement-card__icon{background:linear-gradient(135deg,var(--rarity-bg) 0%,#fff 100%);box-shadow:0 2px 12px #00000026}.achievement-card__icon--locked{filter:grayscale(.5);opacity:.7}.achievement-card__icon--hidden{background:linear-gradient(135deg,#e0e0e0,#bdbdbd)}.achievement-card__icon-emoji{font-size:32px}.achievement-card__check{position:absolute;bottom:-2px;right:-2px;width:20px;height:20px;background:#52c41a;border-radius:50%;color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center;font-weight:700;border:2px solid #fff}.achievement-card__content{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.achievement-card__header{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.achievement-card__name{margin:0;font-size:16px;font-weight:600;color:#333}.achievement-card__rarity{font-size:10px;padding:2px 6px;border-radius:4px;font-weight:500;text-transform:uppercase}.achievement-card__description{margin:0;font-size:13px;color:#666;line-height:1.4}.achievement-card__progress{display:flex;align-items:center;gap:8px;margin-top:4px}.achievement-card__progress-bar{flex:1;height:6px;background:#e0e0e0;border-radius:3px;overflow:hidden}.achievement-card__progress-fill{height:100%;background:linear-gradient(90deg,#ff9800,#4caf50);border-radius:3px;transition:width .3s ease}.achievement-card__progress-text{font-size:11px;color:#888;min-width:40px;text-align:right}.achievement-card__rewards{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}.achievement-card__reward{font-size:12px;padding:2px 8px;background:#f5f5f5;border-radius:12px;color:#666}.achievement-card--unlocked .achievement-card__reward{background:#fffc}.achievement-card__unlock-time{font-size:11px;color:#52c41a;margin-top:4px}@media(max-width:480px){.achievement-card{padding:12px;gap:12px}.achievement-card__icon{width:52px;height:52px}.achievement-card__icon-emoji{font-size:26px}.achievement-card__name{font-size:14px}.achievement-card__description{font-size:12px}}.achievements-page{min-height:100vh;overflow-x:hidden;background:linear-gradient(180deg,#fff8e1,#ffecb3,#ffe0b2);color:#333;padding:20px 20px 40px}.achievements-header{display:flex;align-items:center;gap:16px;margin-bottom:24px;padding:16px 20px;background:linear-gradient(135deg,#ff9800,#f57c00);border-radius:16px;box-shadow:0 4px 15px #ff98004d}.achievements-back{background:#ffffff40;border:none;color:#fff;padding:10px 16px;border-radius:10px;cursor:pointer;font-size:14px;font-weight:600;transition:all .3s ease}.achievements-back:hover{background:#fff6}.achievements-title{margin:0;font-size:26px;font-weight:800;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.15)}.achievements-stats{margin-left:auto}.achievements-stat{display:flex;align-items:baseline;gap:4px;background:#ffffff40;padding:6px 14px;border-radius:20px}.stat-value{font-size:24px;font-weight:700;color:#fff}.stat-label{font-size:13px;color:#ffffffd9}.achievements-overview{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-bottom:24px}.overview-card{background:#fff;border-radius:16px;padding:20px;display:flex;align-items:center;gap:14px;position:relative;overflow:hidden;border:2px solid #FFE0B2;box-shadow:0 3px 12px #ff98001a;transition:all .3s ease}.overview-card:hover{transform:translateY(-3px);box-shadow:0 6px 20px #ff980033;border-color:#ffb74d}.overview-card--progress{grid-column:span 1}.overview-card__icon{font-size:36px;flex-shrink:0}.overview-card__content{flex:1}.overview-card__value{font-size:26px;font-weight:700;color:#e65100}.overview-card__label{font-size:12px;color:#999;margin-top:4px;font-weight:500}.overview-card__progress-ring{width:50px;height:50px;transform:rotate(-90deg)}.overview-card__progress-ring svg{width:100%;height:100%}.overview-card__progress-ring path:first-child{stroke:#ffe0b2}.overview-card__progress-ring path:last-child{stroke:#4caf50}.achievements-upcoming{background:#fff;border-radius:16px;padding:20px;margin-bottom:24px;border:2px solid #C8E6C9;box-shadow:0 3px 12px #4caf501a}.section-title{margin:0 0 16px;font-size:18px;font-weight:700;color:#333}.upcoming-list{display:flex;flex-direction:column;gap:10px}.upcoming-item{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#f1f8e9;border-radius:12px;border:1px solid #DCEDC8;transition:all .3s ease}.upcoming-item:hover{background:#e8f5e9;border-color:#a5d6a7}.upcoming-icon{font-size:28px;flex-shrink:0}.upcoming-info{flex:1;min-width:0}.upcoming-name{display:block;font-size:14px;font-weight:600;color:#333;margin-bottom:6px}.upcoming-progress{height:8px;background:#e0e0e0;border-radius:4px;overflow:hidden}.upcoming-progress-fill{height:100%;background:linear-gradient(90deg,#4caf50,#66bb6a);border-radius:4px;transition:width .3s ease}.upcoming-percent{font-size:14px;font-weight:700;color:#4caf50;min-width:40px;text-align:right}.achievements-filters{background:#fff;border-radius:16px;padding:20px;margin-bottom:24px;border:2px solid #E0E0E0;box-shadow:0 2px 8px #0000000d}.filter-group{margin-bottom:16px}.filter-group:last-child{margin-bottom:0}.filter-label{display:block;font-size:12px;color:#888;margin-bottom:8px;font-weight:600}.filter-tabs{display:flex;gap:8px;flex-wrap:wrap}.filter-tab{background:#f5f5f5;border:2px solid transparent;color:#666;padding:8px 14px;border-radius:10px;cursor:pointer;font-size:13px;font-weight:600;transition:all .3s ease}.filter-tab:hover{background:#fff3e0;color:#e65100;border-color:#ffe0b2}.filter-tab.active{background:linear-gradient(135deg,#ff9800,#f57c00);border-color:transparent;color:#fff;box-shadow:0 2px 8px #ff98004d}.filter-row{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap}.filter-group--inline{display:flex;align-items:center;gap:8px;margin-bottom:0}.filter-group--inline .filter-label{margin-bottom:0}.filter-select{background:#fff;border:2px solid #E0E0E0;color:#333;padding:8px 12px;border-radius:10px;font-size:13px;cursor:pointer;min-width:100px;font-weight:500;transition:border-color .2s}.filter-select:focus{outline:none;border-color:#ff9800}.view-toggle{display:flex;gap:4px;margin-left:auto}.view-btn{background:#f5f5f5;border:2px solid transparent;color:#888;padding:8px 12px;cursor:pointer;font-size:16px;transition:all .3s ease}.view-btn:first-child{border-radius:8px 0 0 8px}.view-btn:last-child{border-radius:0 8px 8px 0}.view-btn:hover{background:#fff3e0;color:#e65100}.view-btn.active{background:linear-gradient(135deg,#ff9800,#f57c00);border-color:transparent;color:#fff}.achievements-list-section{background:#fff;border-radius:16px;padding:20px;border:2px solid #E0E0E0;box-shadow:0 2px 8px #0000000d;margin-bottom:40px}.achievements-count{font-size:13px;color:#888;margin-bottom:16px;font-weight:500}.achievements-list{display:grid;gap:14px}.achievements-list--grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.achievements-list--list{grid-template-columns:1fr}.achievement-card{background:#fff;border:2px solid #E0E0E0;border-radius:14px;padding:16px;transition:all .3s ease}.achievement-card:hover{border-color:#ffb74d;box-shadow:0 4px 16px #ff980026;transform:translateY(-2px)}.achievement-card.unlocked{border-color:#a5d6a7;background:linear-gradient(135deg,#f1f8e9,#fff)}.achievements-empty{text-align:center;padding:60px 20px;color:#999}.empty-icon{font-size:48px;display:block;margin-bottom:16px}.achievements-empty p{margin:0;font-size:14px;font-weight:500}@media(max-width:768px){.achievements-page{padding:16px 16px 60px}.achievements-header{flex-wrap:wrap;padding:14px 16px}.achievements-title{font-size:20px;order:3;width:100%;margin-top:8px}.achievements-stats{order:2}.achievements-back{order:1}.overview-card{padding:16px}.overview-card__icon{font-size:28px}.overview-card__value{font-size:20px}.filter-tabs{overflow-x:auto;padding-bottom:4px;flex-wrap:nowrap}.filter-tab{flex-shrink:0}.filter-row{flex-direction:column;align-items:stretch}.view-toggle{margin-left:0;justify-content:flex-end}.achievements-list--grid{grid-template-columns:1fr}}@media(max-width:480px){.achievements-overview{grid-template-columns:repeat(2,1fr)}.overview-card--progress{grid-column:span 2}}.theme-shop{min-height:100vh;background:var(--theme-bg-gradient, linear-gradient(180deg, #1a1a2e 0%, #16213e 100%));padding-bottom:40px}.shop-header{display:flex;align-items:center;justify-content:space-between;padding:20px 40px;background:#0003;border-bottom:1px solid rgba(255,255,255,.1)}.shop-header h1{margin:0;font-size:24px;color:#fff}.user-coins{padding:8px 16px;background:#ffd70033;border-radius:20px;color:gold;font-weight:600;font-size:16px}.themes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;padding:24px 40px}.theme-card{background:#ffffff0d;border-radius:16px;overflow:hidden;cursor:pointer;transition:all .3s;border:2px solid transparent}.theme-card:hover{transform:translateY(-4px);box-shadow:0 8px 32px #0000004d}.theme-card--active{border-color:#52c41a}.theme-card--unlocked:hover{border-color:#ffffff4d}.theme-card--purchasable:hover{border-color:gold}.theme-preview{position:relative;height:140px;display:flex;align-items:center;justify-content:center;gap:20px}.preview-icon{font-size:48px}.preview-character{font-size:40px}.status-badge{position:absolute;top:12px;right:12px;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500}.status-badge--active{background:#52c41a;color:#fff}.status-badge--unlocked{background:#fff3;color:#fff}.status-badge--locked{background:#00000080;color:#ff4d4f}.theme-info{padding:16px}.theme-info h3{margin:0 0 8px;font-size:18px;color:#fff}.theme-info p{margin:0 0 16px;font-size:13px;color:#888}.theme-action{display:flex;justify-content:center}.active-label{color:#52c41a;font-weight:500}.use-btn{padding:8px 24px;border:1px solid rgba(255,255,255,.3);border-radius:20px;background:transparent;color:#fff;font-size:14px;cursor:pointer;transition:all .2s}.use-btn:hover{background:#ffffff1a}.price-btn{padding:8px 24px;border:none;border-radius:20px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.price-btn.purchasable{background:linear-gradient(135deg,gold,orange);color:#333}.price-btn.purchasable:hover{transform:scale(1.05);box-shadow:0 4px 12px #ffd70066}.price-btn.locked{background:#ffffff1a;color:#666;cursor:not-allowed}.color-preview{display:flex;height:6px}.color-preview span{flex:1}.shop-tip{text-align:center;padding:20px;color:#888;font-size:14px}@media(max-width:768px){.shop-header{padding:16px 20px}.shop-header h1{font-size:20px}.themes-grid{padding:16px 20px;gap:16px}}@media(max-width:480px){.themes-grid{grid-template-columns:1fr}}.shop-page{min-height:100vh;background:linear-gradient(180deg,#1a1a2e,#16213e,#0f3460);padding-bottom:40px}.shop-page-header{display:flex;align-items:center;justify-content:space-between;padding:16px 32px;background:#00000040;border-bottom:1px solid rgba(255,255,255,.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.shop-page-header h1{margin:0;font-size:24px;color:#fff;display:flex;align-items:center;gap:8px}.shop-title-icon{font-size:28px}.shop-back-btn{padding:8px 20px;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:#ffffff0d;color:#ddd;font-size:14px;cursor:pointer;transition:all .2s}.shop-back-btn:hover{background:#ffffff1f;color:#fff}.shop-wallet{display:flex;gap:12px}.wallet-item{display:flex;align-items:center;gap:6px;padding:6px 16px;border-radius:20px;font-weight:600;font-size:15px}.wallet-item.coins{background:#ffd70026;color:gold;border:1px solid rgba(255,215,0,.3)}.wallet-item.stars{background:#ffc1071f;color:#ffc107;border:1px solid rgba(255,193,7,.25)}.wallet-icon{font-size:16px}.shop-message{margin:12px 32px 0;padding:12px 20px;border-radius:10px;font-size:14px;font-weight:500;text-align:center;animation:slideDown .3s ease}.shop-message--success{background:#4caf5026;color:#81c784;border:1px solid rgba(76,175,80,.3)}.shop-message--error{background:#f4433626;color:#ef9a9a;border:1px solid rgba(244,67,54,.3)}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.equip-preview{display:flex;align-items:center;gap:20px;margin:16px 32px;padding:16px 24px;background:linear-gradient(135deg,#ffd70014,#ff980014);border:1px solid rgba(255,215,0,.2);border-radius:16px}.preview-character{display:flex;align-items:center;gap:4px;padding:10px 16px;background:#0003;border-radius:12px;min-width:80px;justify-content:center}.preview-skin{font-size:40px;line-height:1;filter:drop-shadow(0 2px 6px rgba(0,0,0,.3))}.preview-accessory{font-size:20px;line-height:1;margin-left:-4px}.preview-info{flex:1}.preview-label{font-size:12px;color:#888;margin-bottom:8px;text-transform:uppercase;letter-spacing:1px}.preview-items{display:flex;flex-wrap:wrap;gap:6px}.preview-tag{padding:4px 10px;border-radius:10px;font-size:12px;font-weight:500}.preview-tag.skin-tag{background:#ff980026;color:#ffb74d;border:1px solid rgba(255,152,0,.3)}.preview-tag.theme-tag{background:#2196f31f;color:#64b5f6;border:1px solid rgba(33,150,243,.25)}.preview-tag.acc-tag{background:#9c27b01f;color:#ce93d8;border:1px solid rgba(156,39,176,.25)}.shop-categories{display:flex;gap:8px;padding:16px 32px;overflow-x:auto;-webkit-overflow-scrolling:touch}.shop-cat-btn{display:flex;align-items:center;gap:6px;padding:10px 20px;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:#ffffff0a;color:#aaa;font-size:14px;cursor:pointer;transition:all .25s;white-space:nowrap}.shop-cat-btn:hover{background:#ffffff14;color:#ddd}.shop-cat-btn.active{background:linear-gradient(135deg,#ffd70033,#ff980033);border-color:#ffd70066;color:gold}.cat-icon{font-size:18px}.my-items-btn.active{background:linear-gradient(135deg,#4caf5033,#388e3c33);border-color:#4caf5066;color:#81c784}.shop-content{padding:0 32px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}.shop-loading{display:flex;flex-direction:column;align-items:center;padding:60px 0;color:#888}.loading-spinner{font-size:48px;animation:bounce 1s infinite}.shop-item-card{position:relative;background:#ffffff0a;border-radius:16px;padding:20px 16px 16px;display:flex;flex-direction:column;align-items:center;text-align:center;transition:all .3s;border:2px solid transparent;overflow:hidden}.shop-item-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px #0000004d;background:#ffffff12}.shop-item-card.rarity-common{border-color:#9e9e9e33}.shop-item-card.rarity-common:hover{border-color:#9e9e9e66}.shop-item-card.rarity-rare{border-color:#2196f340}.shop-item-card.rarity-rare:hover{border-color:#2196f380}.shop-item-card.rarity-epic{border-color:#9c27b040}.shop-item-card.rarity-epic:hover{border-color:#9c27b080}.shop-item-card.rarity-legendary{border-color:#ff98004d;background:#ff98000a}.shop-item-card.rarity-legendary:hover{border-color:#ff980099;box-shadow:0 12px 40px #ff980026}.shop-item-card.equipped{border-color:#4caf5080;background:#4caf500d}.item-rarity{position:absolute;top:8px;right:10px;font-size:11px;font-weight:600;opacity:.8}.item-icon-wrapper{position:relative;margin-bottom:12px}.item-icon{font-size:56px;display:block;line-height:1.2;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.equipped-badge,.owned-badge{position:absolute;bottom:-6px;left:50%;transform:translate(-50%);padding:2px 10px;border-radius:10px;font-size:11px;font-weight:600;white-space:nowrap}.equipped-badge{background:#4caf50;color:#fff}.owned-badge{background:#ffffff26;color:#aaa}.item-info{flex:1;margin-bottom:12px}.item-name{margin:0 0 6px;font-size:16px;font-weight:600;color:#eee}.item-desc{margin:0;font-size:12px;color:#888;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.item-quantity{margin-top:8px;font-size:13px;color:#ffc107}.item-quantity strong{font-size:16px}.shop-item-card.locked{opacity:.7;filter:saturate(.5)}.shop-item-card.locked:hover{transform:none;box-shadow:none}.item-lock-overlay{position:absolute;inset:0;background:#00000026;border-radius:14px;display:flex;align-items:center;justify-content:center;z-index:2;pointer-events:none}.lock-icon{font-size:32px;opacity:.6;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.item-icon.icon-locked{filter:grayscale(.6);opacity:.6}.item-unlock-req{margin-bottom:10px;padding:4px 12px;border-radius:12px;font-size:11px}.item-unlock-req.req-locked{background:#ff52521f;color:#ff8a80}.item-unlock-req.req-unlocked{background:#4caf501f;color:#81c784}.buy-btn.locked-btn{background:#ffffff0d;color:#888;cursor:not-allowed}.item-actions{width:100%}.item-btn{width:100%;padding:10px 16px;border:none;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.buy-btn{background:linear-gradient(135deg,gold,#ffa000);color:#333}.buy-btn:hover:not(:disabled){transform:scale(1.02);box-shadow:0 4px 16px #ffd70059}.buy-btn:disabled,.buy-btn.disabled{background:#ffffff14;color:#666;cursor:not-allowed}.equip-btn{background:#4caf5033;color:#81c784;border:1px solid rgba(76,175,80,.3)}.equip-btn:hover{background:#4caf504d}.equip-btn.unequip{background:#ffffff0f;color:#aaa;border-color:#ffffff26}.item-price{display:flex;align-items:center;justify-content:center;gap:4px}.shop-empty{grid-column:1 / -1;text-align:center;padding:60px 0;color:#666}.shop-empty span{font-size:48px;display:block;margin-bottom:12px}.shop-footer-tip{text-align:center;padding:30px 20px;color:#666;font-size:14px}@media(max-width:768px){.equip-preview{margin:12px 16px;padding:12px 16px;gap:12px}.preview-skin{font-size:32px}.shop-page-header{padding:12px 16px;flex-wrap:wrap;gap:8px}.shop-page-header h1{font-size:20px;order:-1;flex-basis:100%;text-align:center}.shop-categories{padding:12px 16px}.shop-content{padding:0 16px}.shop-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.shop-item-card{padding:14px 10px 12px}.item-icon{font-size:42px}.item-name{font-size:14px}.item-desc{font-size:11px}}@media(max-width:480px){.shop-grid{grid-template-columns:repeat(2,1fr)}}.daily-challenge{min-height:100vh;background:linear-gradient(180deg,#1a1a2e,#16213e);padding-bottom:40px}.daily-challenge.loading{display:flex;align-items:center;justify-content:center}.loading-spinner{color:#888;font-size:16px}.challenge-header{display:flex;align-items:center;justify-content:space-between;padding:20px 40px;background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff}.challenge-header h1{margin:0;font-size:24px}.time-remaining{padding:8px 16px;background:#0003;border-radius:20px;font-size:14px}.challenge-tabs{display:flex;gap:8px;padding:16px 40px;background:#0003}.tab-btn{padding:10px 20px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:transparent;color:#888;font-size:14px;cursor:pointer;transition:all .2s}.tab-btn:hover{border-color:#ffffff4d;color:#fff}.tab-btn.active{background:linear-gradient(135deg,#ff6b35,#f7931e);border-color:transparent;color:#fff}.challenge-content{padding:24px 40px}.challenge-info{display:grid;grid-template-columns:2fr 1fr;gap:24px}.challenge-card{background:#ffffff0d;border-radius:16px;padding:32px;text-align:center}.challenge-badge{display:inline-block;padding:6px 16px;background:linear-gradient(135deg,#ff6b35,#f7931e);border-radius:20px;color:#fff;font-size:14px;font-weight:600;margin-bottom:16px}.challenge-card h2{margin:0 0 12px;font-size:28px;color:#fff}.challenge-card>p{margin:0 0 24px;color:#888;font-size:16px}.challenge-difficulty{margin-bottom:24px;color:#888;font-size:14px}.challenge-difficulty span{margin-right:8px}.challenge-goal,.challenge-rewards{background:#ffffff08;border-radius:12px;padding:16px;margin-bottom:16px;text-align:left}.challenge-goal h3,.challenge-rewards h3{margin:0 0 8px;font-size:14px;color:#888}.challenge-goal p{margin:0;font-size:16px;color:#fff}.reward-item{display:flex;align-items:center;gap:8px;font-size:16px;color:#fff;padding:4px 0}.reward-item.bonus{color:#f7931e}.start-btn{width:100%;padding:16px;border:none;border-radius:12px;background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;font-size:18px;font-weight:600;cursor:pointer;transition:all .2s;margin-top:8px}.start-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #ff6b3566}.rank-rewards{background:#ffffff0d;border-radius:16px;padding:24px}.rank-rewards h3{margin:0 0 16px;font-size:16px;color:#fff}.rank-list{display:flex;flex-direction:column;gap:12px}.rank-item{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:#ffffff08;border-radius:8px}.rank-item.rank-1{background:#ffd7001a}.rank-item.rank-2{background:#c0c0c01a}.rank-item.rank-3{background:#cd7f321a}.rank-badge{font-size:13px;color:#fff}.rank-reward{font-size:13px;color:#f7931e;font-weight:500}.leaderboard-stats{display:flex;justify-content:space-between;margin-bottom:16px;color:#888;font-size:14px}.my-rank{color:#f7931e}.leaderboard-list{display:flex;flex-direction:column;gap:12px}.leaderboard-item{display:flex;align-items:center;gap:16px;padding:16px;background:#ffffff0d;border-radius:12px;transition:all .2s}.leaderboard-item:hover{background:#ffffff14}.leaderboard-item.top-1{background:linear-gradient(135deg,#ffd7001a,#ffd7000d);border:1px solid rgba(255,215,0,.3)}.leaderboard-item.top-2{background:linear-gradient(135deg,#c0c0c01a,#c0c0c00d);border:1px solid rgba(192,192,192,.3)}.leaderboard-item.top-3{background:linear-gradient(135deg,#cd7f321a,#cd7f320d);border:1px solid rgba(205,127,50,.3)}.leaderboard-item .rank{width:40px;text-align:center;font-size:20px;font-weight:700;color:#fff}.leaderboard-item .user-info{display:flex;align-items:center;gap:12px;flex:1}.user-avatar{font-size:24px}.user-name{font-size:15px;color:#fff}.user-score{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.user-score .score{font-size:16px;font-weight:600;color:#fff}.user-score .detail{font-size:12px;color:#888}.leaderboard-item .reward{color:#f7931e;font-size:13px;font-weight:500}.load-more-btn{display:block;width:100%;padding:12px;margin-top:16px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:transparent;color:#888;font-size:14px;cursor:pointer;transition:all .2s}.load-more-btn:hover{background:#ffffff0d;color:#fff}@media(max-width:1024px){.challenge-info{grid-template-columns:1fr}}@media(max-width:768px){.challenge-header{padding:16px 20px;flex-wrap:wrap;gap:12px}.challenge-header h1{font-size:20px;order:2;width:100%;text-align:center}.challenge-tabs{padding:12px 20px}.challenge-content{padding:16px 20px}.challenge-card{padding:24px 16px}}.parent-login-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;padding:20px}.login-container{width:100%;max-width:420px;background:#fff;border-radius:20px;padding:40px;box-shadow:0 20px 60px #0000004d}.login-header{text-align:center;margin-bottom:32px}.login-logo{font-size:64px;display:block;margin-bottom:16px}.login-header h1{margin:0 0 8px;font-size:28px;color:#333}.login-header p{margin:0;color:#888;font-size:14px}.login-tabs{display:flex;margin-bottom:24px;background:#f5f5f5;border-radius:10px;padding:4px}.login-tabs .tab-btn{flex:1;padding:12px;border:none;border-radius:8px;background:transparent;font-size:15px;font-weight:500;color:#888;cursor:pointer;transition:all .2s}.login-tabs .tab-btn.active{background:#fff;color:#667eea;box-shadow:0 2px 8px #0000001a}.login-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:14px;font-weight:500;color:#333}.form-group input{padding:14px 16px;border:2px solid #eee;border-radius:10px;font-size:15px;transition:all .2s;outline:none}.form-group input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group input::placeholder{color:#bbb}.form-error{color:#ff4d4f;font-size:14px;text-align:center;padding:12px;background:#fff2f0;border-radius:8px}.submit-btn{padding:16px;border:none;border-radius:10px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;margin-top:8px}.submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}.submit-btn:disabled{opacity:.7;cursor:not-allowed}.login-footer{margin-top:24px;text-align:center}.back-link{background:none;border:none;color:#888;font-size:14px;cursor:pointer;transition:color .2s}.back-link:hover{color:#667eea}@media(max-width:480px){.login-container{padding:30px 24px}.login-logo{font-size:48px}.login-header h1{font-size:24px}}.parent-dashboard{min-height:100vh;background:linear-gradient(180deg,#f5f7fa,#e8ecf1);padding-bottom:40px}.parent-dashboard.loading{display:flex;align-items:center;justify-content:center}.loading-spinner{font-size:18px;color:#888}.dashboard-header{display:flex;align-items:center;justify-content:space-between;padding:20px 40px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.dashboard-header h1{margin:0;font-size:24px}.header-right{display:flex;align-items:center;gap:16px}.user-name{font-size:15px;opacity:.9}.logout-btn{padding:8px 16px;border:1px solid rgba(255,255,255,.3);border-radius:6px;background:transparent;color:#fff;font-size:14px;cursor:pointer;transition:all .2s}.logout-btn:hover{background:#ffffff1a;border-color:#ffffff80}.overview-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:20px 40px;margin-top:-30px}.overview-card{background:#fff;border-radius:16px;padding:20px;display:flex;align-items:center;gap:16px;box-shadow:0 4px 20px #00000014}.card-icon{width:56px;height:56px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:28px}.card-content{flex:1}.card-value{font-size:24px;font-weight:700;color:#333}.card-label{font-size:13px;color:#888;margin-top:4px}.children-section{padding:0 40px;margin-top:20px}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.section-header h2{margin:0;font-size:20px;color:#333}.add-child-btn{padding:10px 20px;border:none;border-radius:8px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.add-child-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.empty-state{text-align:center;padding:60px 20px;background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014}.empty-icon{font-size:64px;margin-bottom:16px;opacity:.5}.empty-state p{color:#888;font-size:16px;margin-bottom:24px}.link-btn{padding:12px 24px;border:none;border-radius:8px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:15px;font-weight:500;cursor:pointer;transition:all .2s}.link-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.children-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px}.child-card{background:#fff;border-radius:16px;padding:24px;display:flex;gap:20px;box-shadow:0 4px 20px #00000014;transition:all .3s}.child-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px #0000001f}.child-avatar{width:72px;height:72px;background:linear-gradient(135deg,#ffecd2,#fcb69f);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:36px;flex-shrink:0}.child-info{flex:1;min-width:0}.child-info h3{margin:0 0 8px;font-size:18px;color:#333}.child-stats{display:flex;gap:16px;font-size:13px;color:#666;margin-bottom:8px}.child-activity{font-size:12px;color:#999}.child-actions{display:flex;flex-direction:column;gap:8px}.view-btn{padding:8px 16px;border:none;border-radius:6px;background:#667eea;color:#fff;font-size:13px;cursor:pointer;transition:all .2s}.view-btn:hover{background:#5569d4}.unlink-btn{padding:8px 16px;border:1px solid #ddd;border-radius:6px;background:transparent;color:#999;font-size:13px;cursor:pointer;transition:all .2s}.unlink-btn:hover{border-color:#ff4d4f;color:#ff4d4f}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#fff;border-radius:16px;padding:32px;width:90%;max-width:400px;text-align:center}.modal h3{margin:0 0 12px;font-size:20px;color:#333}.modal-desc{color:#888;font-size:14px;margin-bottom:24px}.link-input-group input{width:100%;padding:16px;border:2px solid #eee;border-radius:10px;font-size:20px;text-align:center;letter-spacing:4px;font-family:monospace;outline:none;transition:all .2s}.link-input-group input:focus{border-color:#667eea}.link-error{color:#ff4d4f;font-size:14px;margin-top:12px}.modal-actions{display:flex;gap:12px;margin-top:24px}.modal-actions button{flex:1;padding:14px;border-radius:10px;font-size:15px;font-weight:500;cursor:pointer;transition:all .2s}.cancel-btn{border:1px solid #ddd;background:#fff;color:#666}.cancel-btn:hover{background:#f5f5f5}.confirm-btn{border:none;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.confirm-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.confirm-btn:disabled{opacity:.7;cursor:not-allowed}@media(max-width:1024px){.overview-cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.dashboard-header{padding:16px 20px}.overview-cards{padding:16px 20px;margin-top:-20px}.children-section{padding:0 20px}.children-grid{grid-template-columns:1fr}}@media(max-width:480px){.overview-cards{grid-template-columns:1fr}.child-card{flex-direction:column;align-items:center;text-align:center}.child-actions{flex-direction:row;width:100%}.child-actions button{flex:1}}.child-detail{min-height:100vh;background:linear-gradient(180deg,#f5f7fa,#e8ecf1)}.child-detail.loading,.child-detail.error{display:flex;flex-direction:column;align-items:center;justify-content:center}.detail-header{display:flex;align-items:center;justify-content:space-between;padding:24px 40px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.back-btn{padding:8px 16px;border:1px solid rgba(255,255,255,.3);border-radius:8px;background:transparent;color:#fff;font-size:14px;cursor:pointer;transition:all .2s}.header-center{display:flex;align-items:center;gap:16px}.child-avatar-large{width:64px;height:64px;background:#fff3;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:32px}.detail-header h1{margin:0;font-size:24px}.header-stats{display:flex;gap:24px}.stat-item{display:flex;flex-direction:column;align-items:center;gap:4px}.stat-item .stat-value{font-size:18px;font-weight:600}.stat-item .stat-label{font-size:12px;opacity:.8}.detail-tabs{display:flex;gap:8px;padding:16px 40px;background:#fff;border-bottom:1px solid #eee}.detail-tabs .tab-btn{padding:10px 20px;border:none;border-radius:8px;background:transparent;color:#666;font-size:14px;cursor:pointer;transition:all .2s}.detail-tabs .tab-btn:hover{background:#f5f5f5;color:#333}.detail-tabs .tab-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.detail-content{padding:24px 40px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:24px}.stat-card{background:#fff;border-radius:12px;padding:20px;display:flex;align-items:center;gap:16px;box-shadow:0 2px 12px #0000000f}.stat-card .stat-icon{width:48px;height:48px;background:linear-gradient(135deg,#667eea20,#764ba220);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px}.stat-card .stat-info .stat-value{font-size:22px;font-weight:700;color:#333}.stat-card .stat-info .stat-label{font-size:13px;color:#888;margin-top:4px}.activity-chart{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 12px #0000000f;margin-bottom:24px}.activity-chart h3{margin:0 0 20px;font-size:16px;color:#333}.chart-container{display:flex;align-items:flex-end;justify-content:space-between;height:200px;padding:0 20px}.chart-bar-wrapper{display:flex;flex-direction:column;align-items:center;flex:1;height:100%}.chart-bar{width:32px;background:linear-gradient(180deg,#667eea,#764ba2);border-radius:4px 4px 0 0;position:relative;min-height:4px;transition:height .3s ease}.bar-value{position:absolute;top:-20px;left:50%;transform:translate(-50%);font-size:11px;color:#666;white-space:nowrap}.bar-label{margin-top:8px;font-size:12px;color:#888}.recent-achievements{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 12px #0000000f}.recent-achievements h3{margin:0 0 16px;font-size:16px;color:#333}.achievements-list{display:flex;flex-direction:column;gap:12px}.achievement-item{display:flex;justify-content:space-between;padding:12px 16px;background:#f9f9f9;border-radius:8px}.achievement-id{font-weight:500;color:#333}.achievement-date{font-size:13px;color:#888}.skills-overview{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 12px #0000000f;margin-bottom:24px}.skills-overview h3{margin:0 0 20px;font-size:16px;color:#333}.skills-radar{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.skill-item{padding:16px;background:#f9f9f9;border-radius:12px}.skill-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.skill-icon{font-size:20px}.skill-name{flex:1;font-weight:500;color:#333}.skill-level{font-size:13px;color:#667eea;font-weight:600}.skill-progress-bar{height:8px;background:#e0e0e0;border-radius:4px;overflow:hidden;margin-bottom:8px}.skill-progress-fill{height:100%;border-radius:4px;transition:width .3s ease}.skill-stats{display:flex;justify-content:space-between;font-size:12px;color:#888}.skill-summary{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 12px #0000000f}.skill-summary h3{margin:0 0 16px;font-size:16px;color:#333}.summary-content p{margin:8px 0;color:#666}.summary-content strong{color:#667eea}.progress-tab h3{margin:0 0 16px;font-size:16px;color:#333}.empty-progress{text-align:center;padding:40px;background:#fff;border-radius:12px;color:#888}.progress-list{display:flex;flex-direction:column;gap:12px}.progress-item{background:#fff;border-radius:12px;padding:16px 20px;display:flex;align-items:center;gap:16px;box-shadow:0 2px 12px #0000000f}.progress-info{display:flex;flex-direction:column;gap:4px}.progress-level{font-weight:600;color:#333}.progress-stars{font-size:14px;letter-spacing:2px}.progress-details{flex:1;display:flex;gap:16px;font-size:13px;color:#888}.progress-completed{color:#52c41a;font-size:13px}@media(max-width:1024px){.stats-grid{grid-template-columns:repeat(2,1fr)}.skills-radar{grid-template-columns:1fr}}@media(max-width:768px){.detail-header{flex-direction:column;gap:16px;padding:20px}.back-btn{align-self:flex-start}.header-stats{width:100%;justify-content:center}.detail-tabs{padding:12px 20px;overflow-x:auto}.detail-content{padding:16px 20px}.stats-grid{grid-template-columns:1fr}.chart-container{padding:0}.chart-bar{width:24px}.progress-item{flex-direction:column;align-items:flex-start}.progress-details{flex-wrap:wrap;gap:8px}}.level-editor{height:100vh;display:flex;flex-direction:column;background:#1a1a2e;color:#fff}.template-modal{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000}.template-modal__content{background:#252536;border-radius:20px;padding:32px;max-width:800px;width:90%;max-height:80vh;overflow-y:auto}.template-modal__content h2{margin:0 0 24px;text-align:center}.templates-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;margin-bottom:24px}.template-card{background:#1a1a2e;border:2px solid transparent;border-radius:12px;padding:16px;cursor:pointer;transition:all .2s;text-align:center}.template-card:hover{border-color:#667eea;transform:translateY(-4px)}.template-icon{font-size:40px;margin-bottom:8px}.template-name{font-size:15px;font-weight:600;margin-bottom:4px}.template-desc{font-size:12px;color:#888;margin-bottom:8px}.template-size{font-size:11px;color:#667eea}.template-modal__close{display:block;margin:0 auto;padding:12px 32px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:transparent;color:#fff;font-size:14px;cursor:pointer}.template-modal__close:hover{background:#ffffff1a}.editor-header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:#252536;border-bottom:1px solid rgba(255,255,255,.1)}.header-left{display:flex;align-items:center;gap:16px}.back-btn{padding:8px 16px;border:1px solid rgba(255,255,255,.2);border-radius:6px;background:transparent;color:#fff;font-size:14px;cursor:pointer}.level-title-input{padding:8px 12px;border:1px solid rgba(255,255,255,.2);border-radius:6px;background:#ffffff0d;color:#fff;font-size:16px;font-weight:600;width:200px}.level-title-input:focus{outline:none;border-color:#667eea}.header-right{display:flex;gap:12px}.btn{padding:8px 16px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary{background:#ffffff1a;color:#fff}.btn-secondary:hover{background:#fff3}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.editor-main{flex:1;display:flex;overflow:hidden}.editor-toolbar{width:180px;background:#252536;padding:16px;overflow-y:auto;border-right:1px solid rgba(255,255,255,.1)}.tool-section{margin-bottom:20px}.tool-section h3{font-size:13px;color:#888;margin:0 0 12px}.tool-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.tool-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:transparent;color:#888;font-size:11px;cursor:pointer;transition:all .2s}.tool-btn:hover{border-color:#ffffff4d;color:#fff}.tool-btn.active{background:#667eea;border-color:#667eea;color:#fff}.tool-icon{font-size:20px}.tool-name{font-size:10px}.direction-selector{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.direction-btn{padding:8px;border:1px solid rgba(255,255,255,.2);border-radius:6px;background:transparent;color:#888;font-size:16px;cursor:pointer;transition:all .2s}.direction-btn:hover{border-color:#fff6;color:#fff}.direction-btn.active{background:#667eea;border-color:#667eea;color:#fff}.editor-canvas-container{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;overflow:auto;background:#16213e}.editor-canvas{position:relative;background:#2d2d4a;border-radius:8px;box-shadow:0 8px 32px #0000004d}.canvas-tile{position:absolute;border:1px solid rgba(255,255,255,.1);cursor:pointer;transition:opacity .1s}.canvas-tile:hover{opacity:.8}.canvas-start{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}.start-icon{font-size:24px}.start-direction{font-size:12px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}.canvas-object{position:absolute;display:flex;align-items:center;justify-content:center;font-size:24px;pointer-events:auto;cursor:pointer}.canvas-size-controls{margin-top:16px;display:flex;align-items:center;gap:10px}.canvas-size-controls label{font-size:13px;color:#aaa;font-weight:600}.size-inputs{display:flex;align-items:center;gap:6px}.size-inputs input{width:56px;padding:6px 8px;background:#1a1a2e;border:2px solid #3a3a5c;border-radius:8px;color:#fff;font-size:14px;font-weight:600;text-align:center;transition:border-color .2s}.size-inputs input:focus{outline:none;border-color:#7c4dff}.size-separator{font-size:14px;color:#888;font-weight:700}.editor-panel{width:240px;background:#252536;padding:16px;overflow-y:auto;border-left:1px solid rgba(255,255,255,.1)}.panel-section{margin-bottom:24px}.panel-section h3{font-size:14px;margin:0 0 12px;color:#fff}.validate-btn{width:100%;padding:10px;border:none;border-radius:6px;background:#667eea;color:#fff;font-size:14px;cursor:pointer;transition:all .2s}.validate-btn:hover{background:#5569d4}.validation-result{margin-top:12px;padding:12px;border-radius:8px}.validation-result.valid{background:#52c41a1a;border:1px solid rgba(82,196,26,.3)}.validation-result.invalid{background:#ff4d4f1a;border:1px solid rgba(255,77,79,.3)}.valid-text{color:#52c41a;font-weight:500}.error-list,.warning-list{display:flex;flex-direction:column;gap:6px}.error-item{font-size:12px;color:#ff4d4f}.warning-item{font-size:12px;color:#faad14;margin-top:8px}.form-group{margin-bottom:12px}.form-group label{display:block;font-size:12px;color:#888;margin-bottom:6px}.form-group textarea{width:100%;padding:10px;border:1px solid rgba(255,255,255,.1);border-radius:6px;background:#ffffff0d;color:#fff;font-size:13px;resize:vertical}.form-group textarea:focus{outline:none;border-color:#667eea}.stats-list{display:flex;flex-direction:column;gap:8px}.stat-row{display:flex;justify-content:space-between;font-size:13px}.stat-row span:first-child{color:#888}.stat-row span:last-child{color:#fff}@media(max-width:1024px){.editor-toolbar{width:140px}.editor-panel{width:200px}.tool-grid{grid-template-columns:1fr}}@media(max-width:768px){.editor-main{flex-direction:column}.editor-toolbar{width:100%;flex-direction:row;overflow-x:auto;padding:12px}.tool-section{margin-bottom:0;margin-right:20px;min-width:max-content}.tool-grid{display:flex;gap:8px}.editor-panel{width:100%;max-height:200px}}.my-creations{min-height:100vh;background:linear-gradient(180deg,#1a1a2e,#16213e);padding-bottom:40px}.creations-header{display:flex;align-items:center;justify-content:space-between;padding:20px 40px;background:#0003;border-bottom:1px solid rgba(255,255,255,.1)}.creations-header .header-left{display:flex;align-items:center;gap:20px}.creations-header h1{margin:0;font-size:24px;color:#fff}.back-btn{padding:8px 16px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:transparent;color:#fff;font-size:14px;cursor:pointer;transition:all .2s}.back-btn:hover{background:#ffffff1a}.create-btn{padding:12px 24px;border:none;border-radius:8px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s}.create-btn:hover{transform:translateY(-2px);box-shadow:0 4px 16px #667eea66}.creations-filter{display:flex;gap:8px;padding:16px 40px}.filter-btn{padding:8px 16px;border:1px solid rgba(255,255,255,.1);border-radius:6px;background:transparent;color:#888;font-size:14px;cursor:pointer;transition:all .2s}.filter-btn:hover{border-color:#ffffff4d;color:#fff}.filter-btn.active{background:#667eea;border-color:#667eea;color:#fff}.loading-state{text-align:center;padding:60px;color:#888;font-size:16px}.empty-state{text-align:center;padding:80px 20px}.empty-icon{font-size:80px;opacity:.5;margin-bottom:20px}.empty-state h3{margin:0 0 8px;font-size:20px;color:#fff}.empty-state p{color:#888;margin-bottom:24px}.create-empty-btn{padding:14px 32px;border:none;border-radius:8px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.create-empty-btn:hover{transform:translateY(-2px);box-shadow:0 4px 16px #667eea66}.creations-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;padding:20px 40px}.creation-card{background:#ffffff0d;border-radius:16px;overflow:hidden;transition:all .3s}.creation-card:hover{transform:translateY(-4px);box-shadow:0 8px 32px #0000004d}.creation-preview{position:relative;height:160px;background:linear-gradient(135deg,#2d2d4a,#1a1a2e);display:flex;align-items:center;justify-content:center}.preview-placeholder{font-size:48px;opacity:.5}.public-badge{position:absolute;top:12px;right:12px;padding:4px 8px;background:#00000080;border-radius:4px;font-size:14px}.creation-info{padding:16px}.creation-info h3{margin:0 0 8px;font-size:16px;color:#fff}.creation-desc{font-size:13px;color:#888;margin:0 0 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.creation-meta{display:flex;gap:16px;font-size:12px;color:#666;margin-bottom:8px}.creation-stats{display:flex;gap:16px;font-size:12px;color:#888}.creation-actions{display:flex;gap:8px;padding:0 16px 16px}.action-btn{flex:1;padding:8px 12px;border:1px solid rgba(255,255,255,.1);border-radius:6px;background:transparent;color:#888;font-size:12px;cursor:pointer;transition:all .2s}.action-btn:hover{border-color:#ffffff4d;color:#fff}.edit-btn:hover{border-color:#667eea;color:#667eea}.share-btn:hover{border-color:#52c41a;color:#52c41a}.delete-btn{flex:0 0 auto;padding:8px}.delete-btn:hover{border-color:#ff4d4f;color:#ff4d4f}@media(max-width:768px){.creations-header{flex-direction:column;gap:16px;padding:16px 20px}.creations-filter{padding:12px 20px;overflow-x:auto}.creations-grid{padding:16px 20px;gap:16px}}*{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #FF9800;--color-primary-light: #FFB74D;--color-primary-dark: #F57C00;--color-secondary: #4CAF50;--color-accent: #2196F3;--color-danger: #F44336;--bg-main: #FFF8E1;--bg-card: #FFFFFF;--bg-header: linear-gradient(135deg, #FF9800 0%, #FFB74D 100%);--bg-sidebar: #FFF3E0;--text-primary: #333333;--text-secondary: #666666;--text-light: #FFFFFF;--border-color: #FFE0B2;--shadow-sm: 0 2px 8px rgba(255, 152, 0, .15);--shadow-md: 0 4px 16px rgba(255, 152, 0, .2);--shadow-lg: 0 8px 32px rgba(255, 152, 0, .25);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px}html,body,#root{height:100%;font-family:Comic Sans MS,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg-main);color:var(--text-primary);overflow-x:hidden;overflow-y:auto}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;transition:all .2s ease}button:hover{transform:translateY(-2px)}button:active{transform:translateY(0)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-sidebar);border-radius:4px}::-webkit-scrollbar-thumb{background:var(--color-primary-light);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}::selection{background:var(--color-primary);color:var(--text-light)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}.fade-in{animation:fadeIn .3s ease}.slide-up{animation:slideUp .4s ease}.bounce{animation:bounce 1s infinite}