:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#f4f6f8;--fg:#191c20;--muted:#5b6570;--cell-bg:#fff;--cell-line:#d5dae1;--cell-lit:#e3edfd;--trail:#3b82f6;--wall:#191c20;--checkpoint-bg:#191c20;--checkpoint-fg:#fff;--button-bg:#fff;--solved:#12894b;--hint:#f6c65b;--mistake:#f08a8a}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}:root:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0d1015;--fg:#e8ebee;--muted:#98a2ac;--cell-bg:#12161c;--cell-line:#262e38;--cell-lit:#22485f;--trail:#4cc9f0;--wall:#e8ebee;--checkpoint-bg:#e8ebee;--checkpoint-fg:#12161c;--button-bg:#191e25;--solved:#5ce68f;--hint:#8a6a1f;--mistake:#8f3030}}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0d1015;--fg:#e8ebee;--muted:#98a2ac;--cell-bg:#12161c;--cell-line:#262e38;--cell-lit:#22485f;--trail:#4cc9f0;--wall:#e8ebee;--checkpoint-bg:#e8ebee;--checkpoint-fg:#12161c;--button-bg:#191e25;--solved:#5ce68f;--hint:#8a6a1f;--mistake:#8f3030}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}body{background:var(--bg);min-height:100dvh;color:var(--fg);overscroll-behavior:none;-webkit-text-size-adjust:100%;place-items:center;margin:0;padding:1.25rem;font-family:system-ui,-apple-system,Segoe UI,sans-serif;display:grid}.shell{flex-direction:column;align-items:center;gap:.85rem;display:flex}h1{letter-spacing:.02em;margin:0;font-size:1.35rem}.status{min-height:1.4em;color:var(--muted);text-align:center;margin:0;font-size:.95rem}.shell.solved .status{color:var(--solved);font-weight:600}.board{width:min(92vw,62vh,540px);aspect-ratio:var(--cols) / var(--rows);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;position:relative}.cells{grid-template-columns:repeat(var(--cols), 1fr);grid-template-rows:repeat(var(--rows), 1fr);border:2px solid var(--cell-line);background:var(--cell-bg);border-radius:10px;display:grid;position:absolute;inset:0;overflow:hidden}.cell{background:0 0;position:relative}.cell:after{content:"";background:var(--cell-lit);opacity:0;position:absolute;inset:0}.cell.on-trail:after{opacity:1;animation:.3s cubic-bezier(.34,1.56,.64,1) cell-pop}@keyframes cell-pop{0%{opacity:0;transform:scale(.4)}60%{opacity:1;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}.cell.hint:after{background:var(--hint);opacity:1;animation:1.1s ease-in-out infinite hint-pulse}.cell.mistake:after{background:var(--mistake);opacity:1;animation:.65s ease-in-out infinite hint-pulse}@keyframes hint-pulse{50%{opacity:.35}}.overlay{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.gridline{stroke:var(--cell-line);stroke-width:.015px}.trail{fill:none;stroke:var(--trail);stroke-width:.36px;stroke-linecap:round;stroke-linejoin:round;opacity:.82}.shell.solved .trail{stroke:var(--solved);opacity:1;animation:.7s ease-out solve-glow}@keyframes solve-glow{0%{filter:none}35%{filter:drop-shadow(0 0 .3px var(--solved)) drop-shadow(0 0 .6px var(--solved))}to{filter:none}}.wall{stroke:var(--wall);stroke-width:.11px;stroke-linecap:round}.cp-shape{fill:var(--checkpoint-bg);rx:.32px;transform-box:fill-box;transform-origin:50%}.cp-ring{fill:none;stroke:none;transform-box:fill-box;transform-origin:50%}.cp-label{fill:var(--checkpoint-fg);font-family:system-ui,sans-serif;font-size:.4px;font-weight:600}.checkpoint.reached .cp-shape{animation:.38s cubic-bezier(.34,1.56,.64,1) cp-pop}@keyframes cp-pop{0%{transform:scale(1)}45%{transform:scale(1.42)}to{transform:scale(1)}}.tiers{flex-wrap:wrap;justify-content:center;gap:.4rem;display:flex}.tier{padding:.4rem .85rem;font-size:.9rem}.tier.active{border-color:var(--trail);background:var(--cell-lit);font-weight:600}.stage{justify-content:center;display:flex;position:relative}.timing{align-items:center;gap:.75rem;display:flex}.clock{font-variant-numeric:tabular-nums;letter-spacing:.02em;font-size:1.5rem;font-weight:600;line-height:1}.timing.hidden-clock .clock{visibility:hidden}.shell.solved .clock{color:var(--solved)}.curtain{background:var(--cell-bg);border:2px solid var(--cell-line);border-radius:10px;place-items:center;display:none;position:absolute;inset:0}.shell.waiting .curtain{display:grid}.shell.waiting .board>*{visibility:hidden}.start{border-color:var(--trail);color:var(--trail);padding:.7rem 2rem;font-size:1.05rem;font-weight:600}.toggle{border:1px solid var(--cell-line);background:var(--button-bg);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;align-items:center;gap:.4rem;padding:.5rem .9rem;display:inline-flex}.toggle input{width:1.05rem;height:1.05rem;accent-color:var(--trail);cursor:pointer;margin:0}.controls{flex-wrap:wrap;justify-content:center;gap:.6rem;display:flex}button{font:inherit;color:inherit;border:1px solid var(--cell-line);background:var(--button-bg);cursor:pointer;border-radius:8px;padding:.5rem 1.1rem}button:active{transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}button:disabled:active{transform:none}.hint-button{font-variant-numeric:tabular-nums;min-width:6.5rem}.theme-button{min-width:6rem}@media (prefers-reduced-motion:reduce){.cell:after,.cell.hint:after,.cell.mistake:after,.checkpoint.reached .cp-shape,.shell.solved .trail{animation:none}}
