:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5;--bg: #07070f;--surface: #0f0f1a;--surface-2: #16162a;--surface-3: #1e1e38;--border: rgba(255, 255, 255, .06);--border-bright: rgba(255, 255, 255, .12);--text: #e8e8f0;--text-dim: rgba(255, 255, 255, .45);--accent: #7c3aed;--accent-2: #a78bfa;--accent-glow: rgba(124, 58, 237, .35);--gold: #f59e0b;--green: #10b981;--red: #ef4444;--blue: #3b82f6;--cyan: #06b6d4;--cell-size: 42px;--gap: 3px;--radius: 10px;--board-pad: 8px;--cell-depth: 4px;--cell-highlight: rgba(255, 255, 255, .15);--cell-shadow: rgba(0, 0, 0, .5)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100dvh;background:var(--bg);color:var(--text);overflow-x:hidden;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.landing{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:2rem 1.5rem;text-align:center}.landing-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.landing-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:1.5rem;max-width:420px;animation:landingFadeIn 1s ease-out}@keyframes landingFadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.landing-logo{font-size:3rem;font-weight:900;background:linear-gradient(135deg,var(--accent),var(--accent-2),var(--cyan),var(--gold));background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:logoShift 3s ease infinite;letter-spacing:-.04em;line-height:1.1;text-shadow:0 0 60px rgba(124,58,237,.3)}.landing-subtitle{font-size:.9rem;color:var(--text-dim);font-weight:500;line-height:1.6;max-width:320px}.landing-features{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;width:100%}.landing-feature{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.75rem .5rem;display:flex;flex-direction:column;align-items:center;gap:.3rem;animation:featurePop .6s ease-out backwards}.landing-feature:nth-child(1){animation-delay:.2s}.landing-feature:nth-child(2){animation-delay:.35s}.landing-feature:nth-child(3){animation-delay:.5s}@keyframes featurePop{0%{opacity:0;transform:scale(.8) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.landing-feature .icon{font-size:1.3rem}.landing-feature .label{font-size:.6rem;font-weight:700;color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em}.play-btn{padding:.9rem 2.5rem;background:linear-gradient(135deg,var(--accent),#9333ea);border:none;border-radius:50px;color:#fff;font-size:1.1rem;font-weight:800;cursor:pointer;transition:all .3s;box-shadow:0 0 40px var(--accent-glow),0 8px 24px #0006;animation:playPulse 2s ease-in-out infinite;touch-action:manipulation;letter-spacing:.05em}.play-btn:hover{transform:scale(1.05);box-shadow:0 0 60px var(--accent-glow),0 12px 32px #00000080}.play-btn:active{transform:scale(.97)}@keyframes playPulse{0%,to{box-shadow:0 0 40px var(--accent-glow),0 8px 24px #0006}50%{box-shadow:0 0 60px #7c3aed80,0 8px 24px #0006}}.landing-stats{display:flex;gap:1.5rem;opacity:.6}.landing-stat{text-align:center}.landing-stat .num{font-size:1.2rem;font-weight:800;color:var(--accent-2)}.landing-stat .lbl{font-size:.55rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em}.landing-footer{position:absolute;bottom:1.5rem;font-size:.55rem;color:#fff3;z-index:2}@keyframes logoShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.app{min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:.5rem .5rem 0;position:relative;max-width:100vw}.game-layout{display:flex;gap:.75rem;align-items:flex-start;width:100%;max-width:900px;flex:1;min-height:0;justify-content:center}.game-center{display:flex;flex-direction:column;align-items:center;gap:.5rem;flex-shrink:0}.side-panel{width:160px;display:flex;flex-direction:column;gap:.5rem;flex-shrink:0;position:sticky;top:.5rem}.panel-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.5rem}.panel-section-title{font-size:.5rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);font-weight:700;margin-bottom:.4rem;padding-bottom:.3rem;border-bottom:1px solid var(--border)}.stat-row{display:flex;justify-content:space-between;align-items:center;padding:.2rem 0}.stat-row .stat-label{font-size:.5rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)}.stat-row .stat-value{font-size:.85rem;font-weight:800;font-variant-numeric:tabular-nums}.stat-row .stat-value.score{color:var(--gold)}.stat-row .stat-value.combo{color:var(--accent-2)}.stat-row .stat-value.level{color:var(--green)}.stat-row .stat-value.xp{color:var(--blue)}.xp-bar-mini{width:100%;height:3px;background:var(--bg);border-radius:2px;margin-top:.3rem;overflow:hidden}.xp-bar-mini-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--accent));border-radius:2px;transition:width .5s ease-out}.challenge-mini{display:flex;align-items:flex-start;gap:.3rem}.challenge-mini-icon{font-size:.85rem;flex-shrink:0}.challenge-mini-info{display:flex;flex-direction:column;gap:.1rem;min-width:0}.challenge-mini-desc{font-size:.55rem;font-weight:600;color:var(--text);line-height:1.3}.challenge-mini-goal{font-size:.5rem;color:var(--gold);font-weight:700}.panel-buttons{display:flex;flex-direction:column;gap:.25rem}.panel-buttons .btn{width:100%;justify-content:center;font-size:.6rem;padding:.35rem .5rem}.ai-section .ai-coach-text{font-size:.55rem;color:var(--cyan);line-height:1.4;font-weight:500}.ai-hint-section .ai-hint-text{font-size:.6rem;font-weight:700;color:var(--green)}.ai-hint-section .ai-hint-clears{color:var(--gold)}.powerups-col{display:flex;flex-direction:column;gap:.3rem}.powerups-col .powerup-btn{width:100%;justify-content:space-between;font-size:.55rem;padding:.4rem .5rem}.header{width:100%;max-width:480px;display:flex;justify-content:space-between;align-items:center;padding:.4rem 0;gap:.5rem;flex-shrink:0}.header-left{display:flex;align-items:center;gap:.5rem}.logo{font-size:1.25rem;font-weight:900;background:linear-gradient(135deg,var(--accent),var(--accent-2),var(--cyan));background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:logoShift 4s ease infinite;letter-spacing:-.03em}.header-right{display:flex;align-items:center;gap:.35rem}.btn{display:inline-flex;align-items:center;gap:.3rem;padding:.4rem .75rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-size:.7rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;touch-action:manipulation}.btn:hover,.btn:active{background:var(--surface-2);border-color:var(--border-bright)}.btn-accent{background:var(--accent);border-color:var(--accent);color:#fff}.btn-accent:hover{background:#6d28d9}.btn-gold{background:#f59e0b26;border-color:#f59e0b4d;color:var(--gold)}.btn-green{background:#10b98126;border-color:#10b9814d;color:var(--green)}.btn-sm{padding:.3rem .55rem;font-size:.65rem}.btn-icon{width:32px;height:32px;padding:0;display:grid;place-items:center;border-radius:50%}.stats-bar{width:100%;max-width:480px;display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem;margin-bottom:.4rem;flex-shrink:0}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.4rem .5rem;text-align:center;position:relative;overflow:hidden}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.4}.stat-label{font-size:.5rem;text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);margin-bottom:.1rem}.stat-value{font-size:1rem;font-weight:800;font-variant-numeric:tabular-nums}.stat-value.score{color:var(--gold)}.stat-value.combo{color:var(--accent-2)}.stat-value.level{color:var(--green)}.stat-value.xp{color:var(--blue)}.xp-bar-wrap{width:100%;max-width:480px;height:4px;background:var(--surface);border-radius:2px;margin-bottom:.5rem;overflow:hidden;border:1px solid var(--border);flex-shrink:0}.xp-bar-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--accent),var(--cyan));background-size:200% 100%;border-radius:2px;transition:width .5s ease-out;animation:xpShimmer 2s linear infinite}@keyframes xpShimmer{0%{background-position:0% 0%}to{background-position:200% 0%}}.game-area{display:flex;flex-direction:column;gap:.5rem;align-items:center;width:100%;max-width:480px;flex:1;min-height:0}.board-wrapper{position:relative;perspective:800px}.board{display:grid;grid-template-columns:repeat(8,var(--cell-size));grid-template-rows:repeat(8,var(--cell-size));gap:var(--gap);background:linear-gradient(145deg,#0c0c18,#112);border:2px solid var(--border);border-radius:calc(var(--radius) + 6px);padding:var(--board-pad);position:relative;box-shadow:0 0 60px #7c3aed0f,0 20px 60px #00000080,inset 0 1px #ffffff08;transform-style:preserve-3d;transition:transform .3s ease}.board:hover{transform:rotateX(1deg) rotateY(-.5deg)}.board.shake{animation:shake .4s ease}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}.cell{width:var(--cell-size);height:var(--cell-size);border-radius:5px;background:#ffffff06;border:1px solid rgba(255,255,255,.03);cursor:pointer;position:relative;transition:all .12s ease;transform-style:preserve-3d}.cell:hover{background:#ffffff0f;border-color:#ffffff1a}.cell.filled{border:none;transform:translateZ(var(--cell-depth));box-shadow:inset 0 1px 1px var(--cell-highlight),0 var(--cell-depth) 0 #0000004d,0 calc(var(--cell-depth) + 2px) 8px #0006}.cell.filled:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:5px;background:linear-gradient(135deg,rgba(255,255,255,.18) 0%,transparent 50%);pointer-events:none}.cell.filled:after{content:"";position:absolute;top:2px;right:-1px;bottom:0;left:2px;border-radius:0 5px 5px 0;background:linear-gradient(90deg,transparent,rgba(0,0,0,.2));pointer-events:none}.cell.ghost{transform:translateZ(2px);opacity:.35;animation:ghostPulse 1.2s ease-in-out infinite;border:1px dashed rgba(255,255,255,.2)}@keyframes ghostPulse{0%,to{opacity:.25;transform:translateZ(2px)}50%{opacity:.5;transform:translateZ(4px)}}.cell.clearing{animation:clearFlash3D .5s ease-out forwards}@keyframes clearFlash3D{0%{transform:translateZ(var(--cell-depth)) scale(1);filter:brightness(2)}30%{transform:translateZ(calc(var(--cell-depth) * 3)) scale(1.15);filter:brightness(3)}to{transform:translateZ(0) scale(0);filter:brightness(0);opacity:0}}.cell.invalid-flash{animation:invalidFlash .3s ease}@keyframes invalidFlash{0%,to{background:#ffffff06}50%{background:#ef444459;border-color:#ef444480}}.particle-canvas{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100dvh;pointer-events:none;z-index:10}.piece-tray{display:flex;flex-direction:row;gap:.5rem;width:100%;justify-content:center;align-items:center;padding:.4rem 0;flex-shrink:0}.tray-label{display:none}.piece-slot{background:var(--surface);border:2px solid var(--border);border-radius:calc(var(--radius) + 2px);padding:.6rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;min-height:80px;min-width:80px;position:relative;flex:1;max-width:120px;touch-action:manipulation}.piece-slot:active{transform:scale(.95)}.piece-slot:hover{border-color:var(--border-bright);background:var(--surface-2)}.piece-slot.selected{border-color:var(--accent);box-shadow:0 0 20px var(--accent-glow),inset 0 0 20px #7c3aed14;transform:translateY(-2px)}.piece-slot.used{opacity:.2;pointer-events:none}.piece-slot .hotkey{position:absolute;top:3px;right:5px;font-size:.5rem;color:var(--text-dim);font-weight:700}.piece-grid{display:grid;gap:2px}.piece-cell{width:16px;height:16px;border-radius:3px;box-shadow:inset 0 1px 1px #ffffff26}.piece-cell.empty{background:transparent;box-shadow:none}.powerups-row{display:flex;gap:.4rem;justify-content:center;width:100%;padding:.3rem 0;flex-shrink:0}.powerup-btn{display:flex;align-items:center;gap:.3rem;padding:.45rem .65rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all .2s;color:var(--text);font-size:.6rem;font-weight:600;touch-action:manipulation}.powerup-btn:active:not(:disabled){transform:scale(.93)}.powerup-btn:hover:not(:disabled){border-color:var(--accent);background:var(--surface-2)}.powerup-btn:disabled{opacity:.25;cursor:not-allowed}.powerup-btn .icon{font-size:1rem}.powerup-count{font-size:.55rem;color:var(--text-dim);font-weight:800}.combo-badge{position:absolute;top:-10px;right:-10px;background:linear-gradient(135deg,var(--accent),#d946ef);color:#fff;font-size:.65rem;font-weight:800;padding:.2rem .45rem;border-radius:20px;animation:comboPop .4s ease;box-shadow:0 0 16px var(--accent-glow),0 4px 12px #0000004d;z-index:5}@keyframes comboPop{0%{transform:scale(0) rotate(-10deg)}60%{transform:scale(1.3) rotate(5deg)}to{transform:scale(1) rotate(0)}}.level-up-banner{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:linear-gradient(135deg,var(--accent),var(--accent-2),var(--cyan));background-size:200% 200%;color:#fff;padding:1.25rem 2.5rem;border-radius:20px;font-size:1.3rem;font-weight:900;text-align:center;z-index:100;animation:levelUp 1.8s ease forwards,logoShift 2s ease infinite;box-shadow:0 0 80px var(--accent-glow),0 20px 40px #00000080}.level-up-banner .sub{font-size:.7rem;font-weight:500;opacity:.85;margin-top:.2rem}@keyframes levelUp{0%{transform:translate(-50%,-50%) scale(0) rotate(-10deg);opacity:0}15%{transform:translate(-50%,-50%) scale(1.15) rotate(3deg);opacity:1}25%{transform:translate(-50%,-50%) scale(1) rotate(0)}80%{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}to{transform:translate(-50%,-50%) scale(1.3) rotate(5deg);opacity:0}}.achievement-toast{position:fixed;top:1rem;right:1rem;background:var(--surface-2);border:1px solid var(--gold);border-radius:var(--radius);padding:.75rem 1rem;display:flex;align-items:center;gap:.6rem;z-index:90;animation:slideIn .4s ease,slideOut .4s ease 2.5s forwards;box-shadow:0 0 24px #f59e0b26,0 8px 24px #0006;max-width:260px}@keyframes slideIn{0%{transform:translate(120%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOut{0%{transform:translate(0);opacity:1}to{transform:translate(120%);opacity:0}}.achievement-toast .icon{font-size:1.3rem}.achievement-toast .info .name{font-weight:700;font-size:.75rem;color:var(--gold)}.achievement-toast .info .desc{font-size:.6rem;color:var(--text-dim)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:grid;place-items:center;z-index:200;animation:fadeIn .2s ease;padding:1rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--surface);border:1px solid var(--border-bright);border-radius:20px;padding:1.5rem;width:100%;max-width:420px;max-height:85dvh;overflow-y:auto;animation:modalIn .3s ease;box-shadow:0 20px 60px #00000080}@keyframes modalIn{0%{transform:scale(.92) translateY(20px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.modal h2{font-size:1.1rem;font-weight:800;margin-bottom:.75rem;display:flex;align-items:center;gap:.4rem}.form-group{margin-bottom:.75rem}.form-group label{display:block;font-size:.65rem;font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem}.form-group input{width:100%;padding:.55rem .65rem;background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:.8rem;font-family:inherit;outline:none;transition:border-color .2s}.form-group input:focus{border-color:var(--accent)}.form-group input::placeholder{color:#ffffff26}.form-actions{display:flex;gap:.4rem;margin-top:1rem}.form-actions .btn{flex:1;justify-content:center}.leaderboard-list{display:flex;flex-direction:column;gap:.3rem}.lb-entry{display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem;background:var(--bg);border-radius:var(--radius);border:1px solid var(--border)}.lb-entry.me{border-color:var(--accent);background:#7c3aed0f}.lb-rank{font-weight:800;font-size:.8rem;min-width:24px;text-align:center}.lb-rank.gold{color:var(--gold)}.lb-rank.silver{color:#94a3b8}.lb-rank.bronze{color:#d97706}.lb-info{flex:1;min-width:0}.lb-name{font-weight:600;font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lb-score{font-weight:800;font-size:.8rem;color:var(--gold);font-variant-numeric:tabular-nums}.lb-addr{font-size:.55rem;color:var(--text-dim);font-family:ui-monospace,monospace}.lb-date{font-size:.5rem;color:var(--text-dim)}.export-panel{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000e0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:300;display:grid;place-items:center;animation:fadeIn .2s;padding:1rem}.export-content{background:var(--surface);border:1px solid var(--border-bright);border-radius:20px;padding:1.5rem;width:100%;max-width:500px;max-height:80dvh;overflow-y:auto}.export-content h2{font-size:1.1rem;font-weight:800;margin-bottom:.4rem}.export-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem;margin:.75rem 0}.export-stat{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:.5rem;text-align:center}.export-stat .num{font-size:1.2rem;font-weight:800;color:var(--green)}.export-stat .lbl{font-size:.55rem;color:var(--text-dim);text-transform:uppercase}.export-table{width:100%;border-collapse:collapse;margin:.75rem 0;font-size:.65rem}.export-table th{text-align:left;padding:.35rem;border-bottom:1px solid var(--border);color:var(--text-dim);font-size:.55rem;text-transform:uppercase;letter-spacing:.05em}.export-table td{padding:.3rem .35rem;border-bottom:1px solid rgba(255,255,255,.02);font-family:ui-monospace,monospace;font-size:.6rem;word-break:break-all}.export-actions{display:flex;gap:.4rem;margin-top:.75rem}.game-over-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:grid;place-items:center;border-radius:calc(var(--radius) + 6px);z-index:50;animation:fadeIn .5s ease}.game-over-card{text-align:center;padding:1.5rem}.game-over-card h2{font-size:1.6rem;font-weight:900;margin-bottom:.4rem;background:linear-gradient(135deg,var(--red),#f97316,var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.game-over-card .final-score{font-size:2.5rem;font-weight:900;color:var(--gold);margin:.4rem 0;text-shadow:0 0 30px rgba(245,158,11,.3)}.game-over-card .stats{font-size:.7rem;color:var(--text-dim);margin-bottom:1.25rem;line-height:1.8}.game-over-card .btn{margin:.2rem}.profile-badge{display:flex;align-items:center;gap:.3rem;padding:.25rem .6rem;background:var(--surface);border:1px solid var(--border);border-radius:20px;font-size:.65rem;font-weight:600;cursor:pointer;transition:all .2s}.profile-badge:hover{border-color:var(--accent)}.profile-badge .avatar{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;font-size:.5rem;font-weight:800}.airdrop-badge{display:inline-flex;align-items:center;gap:.2rem;padding:.15rem .45rem;background:#7c3aed1f;border:1px solid rgba(124,58,237,.25);border-radius:20px;font-size:.55rem;font-weight:600;color:var(--accent-2)}.challenge-banner{width:100%;max-width:480px;padding:.4rem .6rem;background:linear-gradient(135deg,#f59e0b1a,#7c3aed1a);border:1px solid rgba(245,158,11,.2);border-radius:var(--radius);display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.4rem;flex-shrink:0}.challenge-info{display:flex;align-items:center;gap:.4rem;font-size:.65rem;font-weight:600}.challenge-info .icon{font-size:1rem}.challenge-goal{font-size:.6rem;color:var(--gold);font-weight:700}.streak-badge{display:inline-flex;align-items:center;gap:.2rem;padding:.15rem .45rem;background:#f59e0b1f;border:1px solid rgba(245,158,11,.25);border-radius:20px;font-size:.55rem;font-weight:700;color:var(--gold)}.cell.hazard{background:repeating-linear-gradient(45deg,#ef444426,#ef444426 3px,#ef444414 3px,#ef444414 6px);border-color:#ef444440}.cell.hazard:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle,rgba(239,68,68,.3),transparent);border-radius:5px;animation:hazardPulse 2s ease-in-out infinite}@keyframes hazardPulse{0%,to{opacity:.3}50%{opacity:.7}}.cell.wild-card{background:conic-gradient(from 0deg,#7c3aed,#3b82f6,#10b981,#f59e0b,#ef4444,#ec4899,#7c3aed);animation:wildSpin 3s linear infinite;border:none}@keyframes wildSpin{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}.rotate-btn{position:absolute;bottom:-28px;left:50%;transform:translate(-50%);background:var(--surface-2);border:1px solid var(--border-bright);border-radius:50%;width:24px;height:24px;display:grid;place-items:center;cursor:pointer;font-size:.65rem;color:var(--text);transition:all .2s;z-index:2}.rotate-btn:hover{background:var(--accent);border-color:var(--accent)}.skill-tree{display:flex;flex-direction:column;gap:.75rem}.skill-branch{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:.75rem}.skill-branch-title{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.5rem;display:flex;align-items:center;gap:.3rem}.skill-branch-title.speed{color:var(--cyan)}.skill-branch-title.precision{color:var(--gold)}.skill-branch-title.power{color:var(--red)}.skill-list{display:flex;flex-direction:column;gap:.3rem}.skill-item{display:flex;align-items:center;gap:.5rem;padding:.4rem .5rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:all .2s}.skill-item:hover:not(.locked){border-color:var(--accent);background:var(--surface-2)}.skill-item.unlocked{border-color:var(--green);background:#10b9810f}.skill-item.locked{opacity:.4;cursor:not-allowed}.skill-item .icon{font-size:1rem}.skill-item .info{flex:1}.skill-item .name{font-size:.7rem;font-weight:700}.skill-item .desc{font-size:.55rem;color:var(--text-dim)}.skill-item .cost{font-size:.6rem;font-weight:700;color:var(--blue)}.skill-points-badge{display:inline-flex;align-items:center;gap:.2rem;padding:.15rem .45rem;background:#3b82f61f;border:1px solid rgba(59,130,246,.25);border-radius:20px;font-size:.55rem;font-weight:700;color:var(--blue);cursor:pointer;transition:all .2s}.skill-points-badge:hover{border-color:var(--blue);background:#3b82f633}.timer-bar-wrap{width:100%;max-width:480px;height:3px;background:var(--surface);border-radius:2px;margin-bottom:.3rem;overflow:hidden;border:1px solid var(--border);flex-shrink:0}.timer-bar-fill{height:100%;background:var(--green);border-radius:2px;transition:width 1s linear,background-color .5s}.timer-bar-fill.warning{background:var(--gold)}.timer-bar-fill.danger{background:var(--red)}.ai-coach-tip{width:100%;max-width:480px;padding:.4rem .6rem;background:linear-gradient(135deg,#06b6d41a,#3b82f61a);border:1px solid rgba(6,182,212,.2);border-radius:var(--radius);display:flex;align-items:center;gap:.4rem;margin-bottom:.3rem;flex-shrink:0;animation:fadeIn .3s ease}.ai-coach-icon{font-size:.9rem;flex-shrink:0}.ai-coach-text{font-size:.6rem;font-weight:600;color:var(--cyan);line-height:1.4}.ai-hint-badge{width:100%;max-width:480px;padding:.3rem .6rem;background:#10b9811a;border:1px solid rgba(16,185,129,.25);border-radius:var(--radius);font-size:.6rem;font-weight:600;color:var(--green);margin-bottom:.3rem;flex-shrink:0;animation:fadeIn .3s ease;text-align:center}.ai-hint-clears{color:var(--gold)}.cell.ai-hint{box-shadow:inset 0 0 8px #10b98166,0 0 12px #10b98133;border-color:#10b98180!important;animation:aiHintPulse 1s ease-in-out infinite}@keyframes aiHintPulse{0%,to{box-shadow:inset 0 0 6px #10b9814d,0 0 8px #10b98126}50%{box-shadow:inset 0 0 12px #10b98180,0 0 16px #10b9814d}}.btn-ai-on{background:#06b6d433!important;border-color:var(--cyan)!important;color:var(--cyan)!important}.ai-analysis{background:var(--bg);border:1px solid rgba(6,182,212,.2);border-radius:var(--radius);padding:.75rem;margin:.75rem 0;text-align:left}.ai-analysis-title{font-size:.75rem;font-weight:700;color:var(--cyan);margin-bottom:.5rem;display:flex;align-items:center;gap:.3rem}.ai-analysis-row{display:flex;justify-content:space-between;align-items:center;padding:.2rem 0;font-size:.6rem}.ai-analysis-row .ai-label{color:var(--text-dim);font-weight:600}.ai-analysis-row .ai-value{color:var(--text);font-weight:700;font-variant-numeric:tabular-nums}.ai-analysis-suggestion{margin-top:.5rem;padding:.4rem .5rem;background:#06b6d40f;border-radius:6px;font-size:.6rem;color:var(--cyan);font-weight:500;line-height:1.5}.toast{position:fixed;bottom:5rem;left:50%;transform:translate(-50%);background:var(--surface-2);border:1px solid var(--border-bright);border-radius:var(--radius);padding:.5rem 1rem;font-size:.7rem;font-weight:600;z-index:90;animation:toastIn .3s ease,toastOut .3s ease 2s forwards;box-shadow:0 8px 24px #0006;text-align:center;max-width:90vw}@keyframes toastIn{0%{transform:translate(-50%) translateY(16px);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}@keyframes toastOut{0%{transform:translate(-50%) translateY(0);opacity:1}to{transform:translate(-50%) translateY(16px);opacity:0}}.cell.pressure{background:#f59e0b1f;border-color:#f59e0b33;animation:pressureGlow 1.5s ease-in-out infinite}@keyframes pressureGlow{0%,to{box-shadow:inset 0 0 4px #f59e0b1a}50%{box-shadow:inset 0 0 8px #f59e0b40}}@media(min-width:769px){:root{--cell-size: 50px;--cell-depth: 5px;--gap: 3px}.app{padding:1.5rem 2rem;justify-content:center}.game-layout{max-width:900px}.side-panel{width:180px}.piece-cell{width:20px;height:20px}.header,.timer-bar-wrap{max-width:900px}.landing-logo{font-size:4rem}}@media(max-width:768px){.game-layout{flex-direction:column;align-items:center;gap:.5rem}.side-panel{width:100%;max-width:380px;flex-direction:row;flex-wrap:wrap;gap:.35rem;position:static}.side-panel .panel-section{flex:1;min-width:120px}.panel-buttons{flex-direction:row;flex-wrap:wrap}.panel-buttons .btn{flex:1;min-width:80px}.powerups-col{flex-direction:row;gap:.25rem}.powerups-col .powerup-btn{flex:1;justify-content:center;gap:.2rem}.piece-tray{flex-direction:row;gap:.4rem;width:100%;justify-content:center}.piece-slot{min-height:70px;min-width:70px;padding:.5rem}}@media(max-width:400px){:root{--cell-size: 34px;--cell-depth: 3px}.piece-cell{width:14px;height:14px}.piece-slot{min-height:65px;min-width:65px;padding:.4rem}}@media(max-width:350px){:root{--cell-size: 30px;--cell-depth: 2px}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#ffffff26}@supports (padding-bottom: env(safe-area-inset-bottom)){.app{padding-bottom:env(safe-area-inset-bottom)}.piece-tray{padding-bottom:max(.4rem,env(safe-area-inset-bottom))}}
