:root{--fenix: #f26b1d;--fenix-dark: #d9560f;--fenix-text: #ff8a47;--tint: #2a1a10;--tint-2: #54301a;--tint-3: #ffb27a;--charcoal: #141414;--charcoal-2: #232326;--gray: #8a8a8f;--bg: #0e0e0f;--bg-2: #141416;--surface: #1a1a1c;--surface-2: #232326;--surface-3: #2e2e32;--border: #2a2a2e;--border-strong: #3c3c42;--text: #f5f5f5;--muted: #a1a1a6;--accent: var(--fenix);--accent-strong: var(--fenix-dark);--accent-text: var(--fenix-text);--accent-ink: var(--charcoal);--info: #d4d4d8;--ok: #4ade80;--warn: var(--fenix-text);--danger: #ff6b6b;--beginner: var(--tint-3);--intermediate: var(--fenix);--hard: #e4e4e7;--star: var(--fenix);--radius: 16px;--radius-sm: 10px;--shadow: 0 12px 32px rgba(0, 0, 0, .5);--shadow-soft: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .25);--focus: 0 0 0 2px var(--bg), 0 0 0 4px var(--fenix);--font: ui-rounded, "SF Pro Rounded", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-top: env(safe-area-inset-top, 0px);color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg)}body{font-family:var(--font);color:var(--text);background:radial-gradient(1000px 440px at 50% -180px,rgba(242,107,29,.16) 0%,transparent 70%),radial-gradient(700px 400px at 110% 110%,rgba(242,107,29,.06) 0%,transparent 60%),var(--bg);background-attachment:fixed;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;line-height:1.45;min-width:320px}#root{min-height:100vh;min-height:100dvh}h1,h2,h3,h4{margin:0;line-height:1.2}p{margin:0}a{color:var(--accent-text)}button{font:inherit;color:inherit}:focus-visible{outline:none;box-shadow:var(--focus)}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:absolute;left:8px;top:-60px;z-index:2000;padding:10px 14px;border-radius:var(--radius-sm);background:var(--accent);color:var(--accent-ink);font-weight:700;text-decoration:none}.skip-link:focus{top:8px}.muted{color:var(--muted)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.85em}kbd{display:inline-block;min-width:1.6em;padding:1px 6px;border-radius:6px;border:1px solid var(--border-strong);background:var(--surface-2);font-family:inherit;font-size:.85em;text-align:center}.app{min-height:100vh;min-height:100dvh}.page{width:100%;max-width:760px;margin:0 auto;padding:calc(16px + var(--safe-top)) 16px calc(32px + var(--safe-bottom));display:flex;flex-direction:column;gap:16px}.page-loading{min-height:70vh;align-items:center;justify-content:center}.loading-mark{animation:brand-pulse 1.6s ease-in-out infinite}@keyframes brand-pulse{50%{opacity:.55;transform:scale(.96)}}.page-footer{display:flex;justify-content:center;padding-top:8px}.page-header{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:8px}.page-header h1{font-size:1.35rem;font-weight:800;letter-spacing:.01em}.page-header-actions{display:flex;justify-content:flex-end}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-soft);padding:18px;display:flex;flex-direction:column;gap:12px}.card-title{font-size:1rem;font-weight:700}.empty-state{text-align:center;color:var(--muted);padding:32px 12px;display:flex;flex-direction:column;align-items:center;gap:16px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 20px;border-radius:14px;border:1px solid transparent;font-weight:700;font-size:1rem;text-decoration:none;cursor:pointer;transition:transform .12s ease,background-color .15s ease,border-color .15s ease,opacity .15s ease;user-select:none}.btn:active:not(:disabled){transform:translateY(1px) scale(.985)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--accent);color:var(--accent-ink);box-shadow:0 6px 16px #f26b1d47,inset 0 1px #ffffff4d}.btn-primary:hover:not(:disabled){background:#f47a30}.btn-secondary{background:var(--surface-2);border-color:var(--border-strong);color:var(--text)}.btn-secondary:hover:not(:disabled){background:var(--surface-3)}.btn-ghost{background:transparent;color:var(--text);border-color:var(--border)}.btn-ghost:hover:not(:disabled){background:var(--surface-2)}.btn-danger{background:#ff6b6b1f;border-color:#ff6b6b73;color:#ffb4b4}.btn-danger-text{color:var(--danger)}.btn-xl{min-height:60px;font-size:1.15rem;border-radius:18px}.btn-small{min-height:36px;padding:6px 12px;font-size:.875rem;border-radius:10px}.icon-btn{width:48px;height:48px;display:inline-grid;place-items:center;border-radius:14px;border:1px solid var(--border);background:var(--surface);cursor:pointer;transition:background-color .15s ease}.icon-btn:hover:not(:disabled){background:var(--surface-2)}.icon-btn:disabled{opacity:.4}.button-row{display:flex;flex-wrap:wrap;gap:10px}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;font-size:.75rem;font-weight:700;background:var(--surface-2);border:1px solid var(--border);color:var(--muted);width:fit-content}.badge+.badge{margin-left:6px}.badge-ok{color:var(--ok);border-color:#4ade8059}.badge-error{color:var(--danger);border-color:#ff6b6b66}.badge-admin{color:var(--accent-text);background:var(--tint);border-color:var(--tint-2)}.badge-best{color:var(--accent-ink);background:var(--accent);border-color:transparent;margin:0 auto}.status-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:.8rem;font-weight:600;border:1px solid var(--border);background:var(--surface);color:var(--muted);white-space:nowrap}.status-ok{color:var(--ok)}.status-offline{color:var(--accent-text);background:var(--tint);border-color:var(--tint-2)}.status-warn{color:var(--danger)}.status-syncing{color:var(--info)}.difficulty-chip{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.75rem;font-weight:700;letter-spacing:.02em;border:1px solid var(--difficulty);background:color-mix(in srgb,var(--difficulty) 16%,transparent)}.difficulty-beginner{--difficulty: var(--beginner)}.difficulty-intermediate{--difficulty: var(--intermediate)}.difficulty-hard{--difficulty: var(--hard)}.difficulty-chip,.difficulty-title{color:var(--text)}.difficulty-title:before{content:"";display:inline-block;width:.7em;height:.7em;margin-right:.5em;border-radius:3px;background:var(--difficulty);vertical-align:.02em}.stars{display:inline-flex;gap:2px}.star-on{color:var(--star)}.star-off{color:#3c3c42}.stars-animate .star{animation:star-pop .5s cubic-bezier(.2,1.4,.4,1) both}@keyframes star-pop{0%{transform:scale(.2) rotate(-30deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.form{display:flex;flex-direction:column;gap:14px}.form-inline{flex-direction:row;flex-wrap:wrap;align-items:flex-end}.form-inline .field{flex:1 1 200px}.field{display:flex;flex-direction:column;gap:6px;font-size:.9rem;color:var(--muted)}.field-narrow{max-width:220px}.field input,.field select{min-height:46px;padding:10px 12px;border-radius:12px;border:1px solid var(--border-strong);background:var(--bg-2);color:var(--text);font:inherit;font-size:1rem;width:100%}.field input:focus-visible,.field select:focus-visible{border-color:var(--accent)}.field-help{color:var(--muted);font-size:.78rem}.input-row{display:flex;gap:8px}.input-row input{flex:1;min-width:0}.form-message{padding:10px 12px;border-radius:12px;font-size:.9rem}.form-error{background:#ff6b6b1a;color:#ffc1c1;border:1px solid rgba(255,107,107,.35)}.form-info{background:var(--tint);color:#ffc9a3;border:1px solid var(--tint-2)}.segmented{display:grid;grid-template-columns:1fr 1fr;padding:4px;background:var(--bg-2);border-radius:14px;border:1px solid var(--border)}.segmented button{min-height:44px;border:0;background:transparent;border-radius:10px;font-weight:700;color:var(--muted);cursor:pointer}.segmented button[aria-selected=true]{background:var(--surface-3);color:var(--text);box-shadow:var(--shadow-soft)}.kv{margin:0;display:grid;gap:8px}.kv>div{display:flex;justify-content:space-between;gap:12px;align-items:center}.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:600}.account-email{font-weight:700;font-size:1.1rem;word-break:break-all}.settings-list{list-style:none;margin:0;padding:0}.setting-row+.setting-row{border-top:1px solid var(--border)}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;cursor:pointer;min-height:56px}.setting-text{display:flex;flex-direction:column;gap:2px}.setting-label{font-weight:700}.setting-help{color:var(--muted);font-size:.85rem}.switch{appearance:none;flex:none;width:52px;height:32px;border-radius:999px;background:var(--surface-3);border:1px solid var(--border-strong);position:relative;cursor:pointer;transition:background-color .2s ease;margin:0}.switch:after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .2s ease;box-shadow:0 2px 6px #0003}.switch:checked{background:var(--accent)}.switch:checked:after{transform:translate(20px)}.shortcut-list{list-style:none;padding:0;margin:0;display:grid;gap:8px}.shortcut-list li{display:flex;justify-content:space-between;gap:12px;color:var(--muted)}.shortcut-list li>span:first-child{color:var(--text)}.install-page{max-width:480px;min-height:100dvh;gap:16px;justify-content:center}.install-hero{display:flex;justify-content:center}.install-card{gap:14px;text-align:center}.install-lead{margin:0;font-size:1.05rem;font-weight:600;color:var(--text)}.install-done{color:var(--ok)}.install-actions{display:flex;flex-direction:column;gap:10px}.install-steps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;text-align:left}.install-steps li{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:var(--surface-2);border:1px solid var(--border)}.install-steps strong{color:var(--accent-text)}.install-step-num{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--fenix);color:var(--accent-ink);font-weight:800}.install-glyph{display:inline-block;width:18px;height:18px;vertical-align:-3px;fill:none;stroke:var(--accent-text);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.install-benefits{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:.9rem}.install-benefits li:before{content:"✓";margin-right:8px;color:var(--accent-text);font-weight:800}.install-note{margin:0;font-size:.82rem;color:var(--muted)}.install-skip{align-self:center;color:var(--muted);text-decoration:underline;text-underline-offset:3px}.home{max-width:480px;gap:20px;min-height:100dvh}.home-top{display:flex;justify-content:flex-end}.home-hero{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:12px 0 4px}.brand-lockup{--lockup: min(280px, 76vw);display:flex;flex-direction:column;align-items:center;width:var(--lockup)}.logo-box{display:block;width:calc(var(--lockup) * .62);height:auto;aspect-ratio:1;margin:calc(var(--lockup) * -.044) 0 calc(var(--lockup) * .02);filter:drop-shadow(0 8px 16px rgba(242,107,29,.25));animation:logo-float 6s ease-in-out infinite}@keyframes logo-float{50%{transform:translateY(-4px) rotate(-1deg)}}.brand{width:100%;margin:0;line-height:0}.brand-wordmark{display:block;width:100%;height:auto}.home-tagline{color:var(--muted);max-width:32ch;margin-top:6px}.progress-card{gap:14px}.progress-row{display:flex;justify-content:space-between;align-items:flex-end}.progress-value{font-size:2rem;font-weight:800}.progress-value span{color:var(--muted);font-size:1.1rem}.progress-label{color:var(--muted);font-size:.85rem}.progress-stars{text-align:right}.progress-bar{height:10px;border-radius:999px;background:var(--bg-2);overflow:hidden}.progress-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--tint-3),var(--fenix));border-radius:inherit;transition:width .6s ease}.home-menu{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}.menu-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:92px;padding:14px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-soft);color:var(--text);text-decoration:none;font-weight:700;transition:background-color .15s ease,border-color .15s ease,transform .12s ease}.menu-tile:hover{background:var(--tint);border-color:var(--tint-2)}.menu-tile:active{transform:scale(.98)}.menu-tile svg{color:var(--accent)}.menu-tile-admin svg{color:var(--info)}.install-hint{text-align:center;color:var(--muted);font-size:.9rem}.home-footer{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;color:var(--muted);font-size:.8rem}.powered-by{display:inline-flex;align-items:center;gap:6px;color:var(--text);font-size:.85rem}.powered-by strong{color:var(--accent-text)}.origin-mark{display:block}.powered-by-block{display:flex;flex-direction:column;align-items:center;gap:2px}.app-version{margin:0;font-size:.72rem;letter-spacing:.06em;color:var(--muted);font-variant-numeric:tabular-nums}.about-card{flex-direction:row;align-items:center;gap:16px}.about-mark{flex:none}.about-brand{color:var(--accent-text)}.level-group{display:flex;flex-direction:column;gap:12px}.level-group-header{display:flex;justify-content:space-between;align-items:baseline}.difficulty-title{font-size:1.05rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.level-group-count{color:var(--muted);font-weight:700}.level-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}@media (max-width: 360px){.level-grid{grid-template-columns:repeat(2,1fr);gap:8px}}.level-card{width:100%;min-height:132px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:12px 8px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-soft);cursor:pointer;position:relative;overflow:hidden;transition:transform .12s ease,border-color .15s ease,background-color .15s ease}.level-card:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--difficulty)}.level-card:hover:not(:disabled){border-color:var(--tint-2);background-color:var(--tint)}.level-card:active:not(:disabled){transform:scale(.98)}.level-card.is-complete{border-color:var(--tint-2)}.level-card.is-locked{cursor:not-allowed;opacity:.55}.level-number{font-size:1.8rem;font-weight:900}.level-meta{font-size:.78rem;color:var(--muted)}.level-best{font-size:.75rem;color:var(--text);font-weight:600}.level-new{color:var(--accent-text)}.level-lock{color:var(--muted)}.leaderboard{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.leaderboard li{display:grid;grid-template-columns:36px 1fr auto auto auto;align-items:center;gap:10px;padding:12px 14px;border-radius:var(--radius-sm);background:var(--surface);border:1px solid var(--border)}.leaderboard li.is-me{border-color:var(--accent);background:var(--tint)}.lb-rank{font-weight:900;color:var(--accent-text)}.lb-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-score{font-weight:800}.lb-time{color:var(--muted);font-size:.85rem}@media (max-width: 420px){.leaderboard li{grid-template-columns:28px 1fr auto}.leaderboard .stars,.lb-time{display:none}}.modal-backdrop{position:fixed;inset:0;z-index:1500;display:grid;place-items:center;padding:16px;background:#000000a6;backdrop-filter:blur(4px);animation:fade-in .2s ease both}.modal{position:relative;width:100%;max-width:440px;max-height:calc(100dvh - 32px);overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:22px;padding:24px 20px 20px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:14px;animation:modal-in .28s cubic-bezier(.2,1.2,.4,1) both}.modal-title{font-size:1.25rem;font-weight:800}.modal-actions{display:flex;flex-direction:column;gap:10px;margin-top:6px}@keyframes fade-in{0%{opacity:0}}@keyframes modal-in{0%{opacity:0;transform:translateY(16px) scale(.97)}}.app-banner{position:fixed;left:50%;bottom:calc(16px + var(--safe-bottom));transform:translate(-50%);z-index:1400;display:flex;align-items:center;gap:12px;padding:10px 12px 10px 16px;border-radius:16px;background:var(--surface-2);border:1px solid var(--border-strong);color:var(--text);box-shadow:var(--shadow);font-weight:600;width:max-content;max-width:calc(100vw - 24px)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}[data-reduced-motion=true] *,[data-reduced-motion=true] *:before,[data-reduced-motion=true] *:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.page-game{max-width:1240px;height:100vh;height:100dvh;overflow:hidden;padding:calc(8px + var(--safe-top)) 10px calc(8px + var(--safe-bottom));gap:0}.game{flex:1;min-height:0;height:100%;display:flex;flex-direction:column;gap:10px;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.game.is-dragging,.game.is-dragging *{cursor:grabbing!important}.game-topbar{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;gap:8px}.game-title{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}.game-title h1{font-size:1.2rem;font-weight:800}.hud{margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-soft)}.hud-item{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:0}.hud dt{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);white-space:nowrap}.hud dd{margin:0;font-size:1.1rem;font-weight:800;font-variant-numeric:tabular-nums}.hud-sub{color:var(--muted);font-size:.85rem;font-weight:700}.hud-timer.is-low{color:var(--danger)}@media (max-width: 400px){.hud dt{font-size:.62rem;letter-spacing:.04em}}.game-topbar,.hud,.controls,.tray{flex:none}.game-body{flex:1;min-height:0;display:flex;flex-direction:column;gap:10px}.game-main{flex:1;min-height:0;display:flex;flex-direction:column;gap:10px;align-items:center}.game-wide .game-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,360px);gap:16px}.game-wide .game-main{height:100%}.board-area{position:relative;flex:1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center}.board-frame{padding:10px;border-radius:20px;background:linear-gradient(145deg,#ffffff12,#0003),linear-gradient(180deg,#303035,#1e1e22);box-shadow:0 16px 36px #0009,0 0 0 1px #ffffff0d,inset 0 1px #ffffff1f,inset 0 -2px #0006;transition:box-shadow .4s ease}.board-frame-small{padding:6px;border-radius:12px;width:fit-content}.board-frame.is-solved{box-shadow:0 0 0 3px var(--fenix),0 0 36px #f26b1d73,0 16px 36px #0009}.board{position:relative;border-radius:10px;background:#0b0b0c;box-shadow:inset 0 3px 10px #000000b3;touch-action:manipulation;outline:none}.board:focus-visible{box-shadow:inset 0 3px 10px #0009,var(--focus)}.board-cells{position:absolute;inset:0;display:grid;grid-template-columns:repeat(var(--cols),var(--cell));grid-auto-rows:var(--cell)}.board-cell{margin:2px;border-radius:calc(var(--cell) * .16);background:linear-gradient(180deg,#19191c,#232327);box-shadow:inset 0 2px 4px #0000008c,0 1px #ffffff0d}.piece-shape{display:block;overflow:visible;filter:drop-shadow(0 2px 2px rgba(0,0,0,.25))}.piece-seams{fill:none;stroke:#00000029;stroke-width:1}.board-piece{position:absolute;padding:0;margin:0;border:0;background:none;pointer-events:none;cursor:grab;z-index:2;transition:left .14s ease,top .14s ease;border-radius:8px}.board-piece,.board-piece .piece-shape{touch-action:none}.board-piece .piece-shape{pointer-events:none}.board-piece .piece-body,.board-piece .piece-sheen{pointer-events:visiblePainted}.board-piece.is-selected{z-index:3}.board-piece.is-selected .piece-shape{filter:drop-shadow(0 0 .5px #fff) drop-shadow(0 0 1.5px #fff) drop-shadow(0 0 8px var(--piece-color))}.board-piece:focus-visible{box-shadow:none}.board-piece:focus-visible .piece-shape{filter:drop-shadow(0 0 1px var(--fenix)) drop-shadow(0 0 2px var(--fenix)) drop-shadow(0 0 3px var(--fenix))}.board-piece.is-dragging{opacity:.25}.anim-place .piece-shape{animation:piece-pop .3s cubic-bezier(.2,1.4,.4,1)}.anim-shake .piece-shape,.tray-piece.anim-shake{animation:piece-shake .35s ease}@keyframes piece-pop{0%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes piece-shake{20%,60%{transform:translate(-4px)}40%,80%{transform:translate(4px)}}.board-preview{position:absolute;inset:0;pointer-events:none;z-index:4}.board-preview.is-valid .piece-shape{opacity:.5;filter:none}.preview-cell{position:absolute;width:var(--cell);height:var(--cell);padding:3px}.preview-cell:after{content:"";display:block;width:100%;height:100%;border-radius:calc(var(--cell) * .16);background:#ff5a5a59;box-shadow:inset 0 0 0 2px #ff7878e6}.board-hint{position:absolute;inset:0;pointer-events:none;z-index:5}.hint-cell{position:absolute;width:var(--cell);height:var(--cell);padding:3px}.hint-cell:after{content:"";display:block;width:100%;height:100%;border-radius:calc(var(--cell) * .16);border:2px dashed var(--fenix);background:#f26b1d61;box-shadow:0 0 10px #f26b1d73;animation:hint-pulse 1.1s ease-in-out infinite}.board-hint-remove .hint-cell:after{border-color:#ff8f8f;background:#ff5a5a2e}@keyframes hint-pulse{50%{opacity:.45}}.board-cursor{position:absolute;width:var(--cell);height:var(--cell);border-radius:calc(var(--cell) * .18);box-shadow:inset 0 0 0 3px var(--fenix);pointer-events:none;z-index:6}.pause-overlay{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;border-radius:20px;background:#0e0e0feb;color:var(--text);backdrop-filter:blur(8px);font-size:1.4rem;font-weight:800}.controls{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:100%;max-width:560px}.control-btn{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:60px;padding:8px 4px;border-radius:16px;border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-soft);cursor:pointer;transition:background-color .15s ease,border-color .15s ease,transform .1s ease,opacity .15s ease}.control-btn:hover:not(:disabled){background-color:var(--tint);border-color:var(--tint-2)}.control-btn:active:not(:disabled){transform:scale(.96)}.control-btn:disabled{opacity:.4;cursor:not-allowed}.control-btn svg{width:26px;height:26px}.control-label{font-size:.72rem;font-weight:700;color:var(--muted);white-space:nowrap}.control-hint svg{color:var(--accent)}.control-badge{position:absolute;top:6px;right:8px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--accent);color:var(--accent-ink);font-size:.72rem;font-weight:800;display:grid;place-items:center}@media (max-width: 360px){.controls{gap:5px}.control-label{font-size:.62rem}.control-btn{min-height:56px}}@media (max-height: 720px){.game,.game-body,.game-main{gap:8px}.game-topbar .icon-btn{width:44px;height:44px}.game-title h1{font-size:1.05rem}.hud{padding:5px 8px}.hud dd{font-size:1rem}.control-btn{min-height:50px;padding:5px 4px;gap:1px}.control-btn svg{width:22px;height:22px}.tray{padding:8px 10px;gap:6px}.tray-header h2,.tray-count{font-size:.72rem}.tray-piece{min-width:48px;min-height:48px;padding:6px}}@media (max-height: 600px){.control-btn{min-height:44px}.control-label{display:none}.hud dt{font-size:.58rem}}.tray{display:flex;flex-direction:column;gap:8px;min-width:0;padding:12px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-soft)}.tray-header{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.tray-header h2{font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.tray-count{font-size:.8rem;color:var(--muted);font-weight:600}.tray-empty{color:var(--muted);text-align:center;padding:16px}.tray-list{list-style:none;margin:0;padding:2px 2px 6px;display:grid;grid-auto-flow:column;grid-template-rows:repeat(var(--tray-rows, 2),auto);grid-auto-columns:max-content;gap:8px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:thin;scroll-snap-type:x proximity}.tray-item{scroll-snap-align:start}.tray-piece{display:grid;place-items:center;min-width:56px;min-height:56px;height:100%;padding:8px;border-radius:14px;border:2px solid transparent;background:var(--bg);cursor:grab;transition:border-color .15s ease,background-color .15s ease,transform .1s ease,opacity .15s ease}.tray-piece .piece-shape{touch-action:pan-x}.tray-piece:hover{background:var(--surface-3)}.tray-piece.is-selected{border-color:var(--accent);background:var(--tint);box-shadow:0 0 12px #f26b1d59}.tray-piece.is-dragging{opacity:.3}.tray-piece.is-hinted{border-color:var(--accent);border-style:dashed;animation:hint-pulse 1.1s ease-in-out infinite}.game-wide .tray{height:100%;min-height:0}.game-wide .tray-list{flex:1;min-height:0;display:flex;flex-wrap:wrap;align-content:flex-start;overflow-x:hidden;overflow-y:auto;scroll-snap-type:none}.game-wide .tray-piece .piece-shape{touch-action:pan-y}.drag-ghost{position:fixed;left:0;top:0;z-index:1200;pointer-events:none;will-change:transform}.drag-ghost .piece-shape{transform:scale(1.04);transform-origin:center;filter:drop-shadow(0 12px 18px rgba(0,0,0,.35))}.toast{position:fixed;left:50%;top:calc(14px + var(--safe-top));transform:translate(-50%);z-index:1300;max-width:min(92vw,460px);padding:10px 16px;border-radius:14px;font-weight:600;font-size:.92rem;text-align:center;box-shadow:var(--shadow);border:1px solid var(--border-strong);background:var(--surface-2);color:var(--text);animation:toast-in .25s ease both}.toast-warn{background:var(--tint);color:#ffc9a3;border-color:var(--tint-2)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-10px)}}.completion-modal{text-align:center;align-items:stretch;overflow:hidden}.completion-burst{position:absolute;inset:-40% -20% auto;height:220px;background:radial-gradient(closest-side,rgba(242,107,29,.2),transparent);pointer-events:none}.completion-title{position:relative;font-size:1.6rem;font-weight:900;letter-spacing:.04em;background:linear-gradient(180deg,var(--tint-3),var(--fenix));-webkit-background-clip:text;background-clip:text;color:transparent}.celebration-stars{--cstar: 50px;position:relative;display:flex;justify-content:center;align-items:flex-end;gap:10px;padding-top:4px}.cstar{position:relative;display:grid;place-items:center;width:var(--cstar);height:var(--cstar);animation:cstar-slot .35s ease-out both;animation-delay:calc(var(--i) * 90ms)}.cstar-center{--cstar: 64px;margin-bottom:10px}.cstar>*{grid-area:1 / 1}.cstar svg{width:100%;height:100%;overflow:visible}.cstar-empty path{fill:#232326;stroke:#3c3c42;stroke-width:1.2;stroke-linejoin:round}.cstar-fill{filter:drop-shadow(0 0 10px rgba(242,107,29,.55));clip-path:inset(100% 0 0 0);animation:cstar-fill var(--fill) cubic-bezier(.5,0,.3,1) both,cstar-bounce .55s cubic-bezier(.2,1.6,.4,1) both;animation-delay:var(--d),calc(var(--d) + var(--fill))}.cstar-shine{fill:none;stroke:#ffffffd9;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.cstar-ring{width:100%;height:100%;border-radius:50%;border:3px solid var(--fenix-text);opacity:0;animation:cstar-ring .6s ease-out both;animation-delay:calc(var(--d) + var(--fill))}.cstar-sparks{position:relative;width:0;height:0}.cstar-sparks span{position:absolute;left:-3px;top:-3px;width:6px;height:6px;border-radius:50%;background:var(--tint-3);box-shadow:0 0 6px var(--fenix);opacity:0;animation:cstar-spark .7s ease-out both;animation-delay:calc(var(--d) + var(--fill))}.cstar-missed .cstar-empty{animation:cstar-dim .4s ease-out both;animation-delay:var(--d)}@keyframes cstar-slot{0%{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}@keyframes cstar-fill{0%{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}@keyframes cstar-bounce{0%{transform:scale(1)}40%{transform:scale(1.3) rotate(-8deg)}to{transform:scale(1) rotate(0)}}@keyframes cstar-ring{0%{transform:scale(.5);opacity:.9}to{transform:scale(1.7);opacity:0}}@keyframes cstar-spark{0%{transform:rotate(var(--a)) translateY(0) scale(1);opacity:1}to{transform:rotate(var(--a)) translateY(calc(var(--cstar) * -.85)) scale(.2);opacity:0}}@keyframes cstar-dim{0%,to{transform:translate(0)}30%{transform:translate(-3px)}60%{transform:translate(3px)}}@media (prefers-reduced-motion: reduce){.cstar,.cstar-fill,.cstar-missed .cstar-empty{animation:none;clip-path:none}.cstar-ring,.cstar-sparks{display:none}}[data-reduced-motion=true] .cstar,[data-reduced-motion=true] .cstar-fill,[data-reduced-motion=true] .cstar-missed .cstar-empty{animation:none;clip-path:none}[data-reduced-motion=true] .cstar-ring,[data-reduced-motion=true] .cstar-sparks{display:none}.completion-stats{margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.completion-stats>div{padding:10px;border-radius:12px;background:var(--surface-2);border:1px solid var(--border)}.completion-stats dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.completion-stats dd{margin:0;font-size:1.2rem;font-weight:800;font-variant-numeric:tabular-nums}.completion-score{grid-column:1 / -1;background:var(--tint)!important;border-color:var(--tint-2)!important}.completion-score dd{font-size:1.8rem;color:var(--accent-text)}.completion-brand{justify-content:center;align-self:center;font-size:.78rem;color:var(--muted)}.score-breakdown{text-align:left;font-size:.9rem;color:var(--muted)}.score-breakdown summary{cursor:pointer;min-height:32px;display:flex;align-items:center;gap:6px;list-style:none}.score-breakdown summary::-webkit-details-marker{display:none}.score-breakdown summary:before{content:"▸";transition:transform .15s ease}.score-breakdown[open] summary:before{transform:rotate(90deg)}.score-breakdown ul{list-style:none;padding:0;margin:6px 0 0;display:grid;gap:4px}.score-breakdown li{display:flex;justify-content:space-between}.test-overlay{position:fixed;inset:0;z-index:1100;display:flex;flex-direction:column;overflow:hidden;background:var(--bg);padding:calc(8px + var(--safe-top)) 10px calc(8px + var(--safe-bottom))}.test-overlay .game{width:100%;max-width:1240px;margin:0 auto}.completion-kicker{position:relative;font-size:.75rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.completion-cheer{position:relative;font-weight:700;color:var(--tint-3)}.completion-title{animation:title-pop .6s cubic-bezier(.2,1.5,.4,1) both}@keyframes title-pop{0%{transform:scale(.6);opacity:0}}.completion-secondary{display:grid;grid-template-columns:1fr 1fr;gap:10px}.btn-next{animation:next-glow 1.8s ease-in-out 1s infinite}.btn-next-arrow{font-size:1.3em;line-height:1;transition:transform .15s ease}.btn-next:hover .btn-next-arrow{transform:translate(4px)}@keyframes next-glow{50%{box-shadow:0 0 0 6px #f26b1d40,0 6px 16px #f26b1d59}}@media (max-height: 680px){.completion-modal{gap:10px;padding:18px 16px 16px}.celebration-stars{--cstar: 40px}.cstar-center{--cstar: 52px;margin-bottom:8px}.completion-stats dd{font-size:1.05rem}.completion-score dd{font-size:1.5rem}}@media (max-height: 620px){.completion-modal{gap:7px;padding:14px 14px 12px}.completion-stats{grid-template-columns:repeat(4,1fr);gap:6px}.completion-stats>div{padding:6px 4px;text-align:center}.completion-stats dt{font-size:.6rem;letter-spacing:.04em}.completion-score dd{font-size:1.3rem}.completion-modal .btn-xl{min-height:50px}.completion-modal .modal-actions{gap:8px;margin-top:2px}}.confetti{position:fixed;inset:0;z-index:1600;overflow:hidden;pointer-events:none}.confetti-piece{position:absolute;top:-20px;border-radius:2px;opacity:0;animation-name:confetti-fall;animation-timing-function:cubic-bezier(.25,.6,.45,1);animation-fill-mode:forwards}@keyframes confetti-fall{0%{opacity:1;transform:translateZ(0) rotate(0)}85%{opacity:1}to{opacity:0;transform:translate3d(var(--drift),105vh,0) rotate(var(--spin))}}@media (prefers-reduced-motion: reduce){.confetti{display:none}}[data-reduced-motion=true] .confetti{display:none}