:root{--bg: #e0e6f0;--surface: #f2f5fa;--surface-2: #e4eaf4;--ink: #16181d;--muted: #5f6772;--on-bg: #16181d;--on-bg-muted: #5f6772;--line: #c9d3e1;--accent: #2f6df6;--accent-soft: #dfe8fe;--grid-line: #d8e0ea;--wall: #16181d;--clue-bg: #16181d;--clue-ink: #ffffff;--ok: #17915b;--ok-on-bg: #17915b;--bad: #d64545;--bad-on-bg: #d64545;--route-width: 34;--wall-width: 11;--radius: 14px;--board-max: 34rem;--font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg: #101217;--surface: #1a1d24;--surface-2: #232733;--ink: #f2f3f5;--muted: #9aa1ad;--on-bg: #f2f3f5;--on-bg-muted: #9aa1ad;--line: #2a2e38;--accent: #5b8cff;--accent-soft: #23304f;--grid-line: #262a33;--wall: #f2f3f5;--clue-bg: #f2f3f5;--clue-ink: #16181d;--ok: #35c98a;--ok-on-bg: #35c98a;--bad: #ff6f6f;--bad-on-bg: #ff6f6f}}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-text-size-adjust:100%}.app{max-width:var(--board-max);margin:0 auto;padding:1rem 1rem calc(1.5rem + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:.85rem}.topbar{background:var(--surface);box-shadow:0 2px 14px #14285a1f,0 1px 3px #14285a0f;position:relative;z-index:1}.topbar-inner{max-width:60rem;margin:0 auto;padding:.6rem 1rem;display:flex;align-items:center;gap:.75rem}.topbar-inner .tabs{margin-left:auto}h1{font-size:1.35rem;font-weight:700;letter-spacing:-.02em;margin:0;white-space:nowrap}h1 span{color:var(--muted);font-weight:600}@media (max-width: 560px){.topbar-inner{flex-wrap:wrap;row-gap:.5rem}.topbar-inner .tabs{order:3;width:100%;margin-left:0;justify-content:center}.topbar-inner #account{margin-left:auto}}.tabs,.pills{display:flex;gap:.25rem;padding:.25rem;background:var(--surface);border:1px solid var(--line);border-radius:999px}.options{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}.pills[hidden]{display:none}.tab,.pill{appearance:none;border:0;background:transparent;color:var(--muted);font:inherit;font-size:.85rem;font-weight:600;padding:.4rem .85rem;border-radius:999px;cursor:pointer;min-height:2.1rem;white-space:nowrap}.tab[aria-selected=true],.pill[aria-pressed=true]{background:var(--ink);color:var(--surface)}.pill:disabled{opacity:.4;cursor:default}.puzzle-no{margin:-.35rem 0 -.2rem;text-align:center;font-size:.8rem;font-weight:600;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--on-bg-muted)}.puzzle-no[hidden]{display:none}.timer{align-self:center;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:.45rem 1.1rem;text-align:center;font-size:1.5rem;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.02em;color:var(--muted);line-height:1;min-width:8.5rem}.timer.running{color:var(--ink)}.timer.done{color:var(--ok)}.board-wrap{display:flex;justify-content:center;align-items:center;flex:1;min-height:0;position:relative}.board-wrap.blurred .board{filter:blur(7px);pointer-events:none}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2}.overlay[hidden]{display:none}.overlay-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 12px 40px #0000002e;padding:1.25rem 1.5rem;text-align:center;min-width:14rem;max-width:90%}.overlay-card h2{margin:0 0 .35rem;font-size:1.15rem}.overlay-card p{margin:0 0 .9rem;color:var(--muted);font-size:.9rem;min-height:1.2em}.overlay-card .btn{width:100%;max-width:none}.overlay-card .btn[hidden]{display:none}.overlay-actions{display:flex;flex-direction:column;gap:.5rem}.overlay-actions:empty{display:none}.overlay-card.done{position:absolute;box-sizing:border-box;min-width:0;max-width:none;display:flex;flex-direction:column;justify-content:center;padding:1.5rem clamp(1rem,8%,3rem);box-shadow:none;border-radius:var(--radius)}.overlay-card.done .overlay-actions{max-width:22rem;width:100%;margin:0 auto}.overlay-card.done>h2{display:none}.overlay-card.done .overlay-actions{gap:.9rem;align-items:stretch}.overlay-card.done .overlay-actions h2{margin:0;font-size:1.6rem;letter-spacing:-.02em}.overlay-close{position:absolute;top:.4rem;right:.6rem;appearance:none;border:0;background:transparent;color:var(--muted);font-size:1.6rem;line-height:1;cursor:pointer;padding:.25rem .4rem}.overlay-card .eyebrow{margin:0;color:var(--muted);font-weight:600;font-size:.95rem}.stat{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius);padding:.9rem 1rem}.stat-big{font-size:2rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--ok)}.stat p{margin:.25rem 0 0;font-size:.9rem;color:var(--muted);font-weight:600}.actions-row{display:flex;gap:.6rem}.actions-row .btn{flex:1}.btn-big{min-height:3rem;font-size:.95rem;text-transform:uppercase;letter-spacing:.04em}.overlay-secondary{align-self:center}.overlay.soft{background:transparent}.overlay-card.enter{animation:card-in .6s cubic-bezier(.2,.8,.2,1) both}@keyframes card-in{0%{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.overlay-card.enter{animation:none}}.board{width:100%;max-width:var(--board-max);max-height:64dvh;aspect-ratio:var(--cols, 6) / var(--rows, 6);touch-action:none;-webkit-tap-highlight-color:transparent;user-select:none;outline:none;overflow:visible}.board:focus-visible{outline:3px solid var(--accent);outline-offset:4px;border-radius:var(--radius)}.board-bg{fill:var(--surface);stroke:var(--line);stroke-width:2}.grid line{stroke:var(--grid-line);stroke-width:2}.walls line{stroke:var(--wall);stroke-width:var(--wall-width);stroke-linecap:round}.route{fill:none;stroke:var(--accent);stroke-width:var(--route-width);stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s ease}.head{fill:var(--surface);opacity:.9;transition:opacity .15s ease}.is-empty .head,.is-solved .head{opacity:0}.is-solved .route{stroke:var(--ok)}.is-wrong .route{stroke:var(--bad)}.clues circle{fill:var(--clue-bg)}.clues text{fill:var(--clue-ink);text-anchor:middle;dominant-baseline:central;font-family:var(--font);font-weight:700}.hint-arrow path{stroke:var(--accent);stroke-width:12;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(255,255,255,.9))}.hint-arrow path{animation:nudge .9s ease-in-out infinite}@keyframes nudge{0%,to{transform:translate(-6px);opacity:.6}50%{transform:translate(8px);opacity:1}}@media (prefers-reduced-motion: reduce){.hint-arrow path{animation:none}}.linklike{appearance:none;border:0;background:transparent;color:inherit;font:inherit;font-weight:700;text-decoration:underline;cursor:pointer;padding:0}dialog.tutorial{border:0;border-radius:var(--radius);background:var(--surface);color:var(--ink);padding:1.25rem 1.25rem 1.1rem;width:min(92vw,24rem);box-shadow:0 18px 50px #00000040}dialog.tutorial::backdrop{background:#0a142873}dialog.tutorial h2{margin:0 0 .75rem;font-size:1.25rem;text-align:center}dialog.tutorial .tutorial-demo{width:9.5rem;margin:0 auto .9rem}dialog.tutorial .tutorial-demo .board{max-height:none;touch-action:auto}dialog.tutorial ol{margin:0 0 .6rem;padding-left:1.25rem;line-height:1.5;font-size:.95rem}dialog.tutorial ol li+li{margin-top:.35rem}dialog.tutorial .muted{margin:0 0 .9rem;font-size:.82rem;color:var(--muted)}dialog.tutorial .btn{width:100%;max-width:none}.status{margin:0;text-align:center;font-size:.95rem;font-weight:600;color:var(--on-bg-muted);min-height:1.4em}.status.solved{color:var(--ok-on-bg)}.status.wrong{color:var(--bad-on-bg)}.controls{display:flex;gap:.5rem;justify-content:center}.btn{appearance:none;font:inherit;font-weight:600;font-size:.9rem;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:.65rem 1.05rem;cursor:pointer;min-height:2.75rem;flex:1 1 auto;max-width:11rem}.btn:active{transform:translateY(1px)}@media (hover: hover) and (prefers-reduced-motion: no-preference){.btn:hover,.pill:hover,.tab:hover{animation:pulse .32s ease-out}}@keyframes pulse{0%{transform:scale(1)}40%{transform:scale(1.04)}to{transform:scale(1)}}.btn:disabled{opacity:.5;cursor:default;transform:none}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-share{background:var(--ok);border-color:var(--ok);color:#fff}.btn[hidden]{display:none}.btn-small{flex:0 0 auto;min-height:2.1rem;padding:.35rem .85rem;font-size:.85rem;border-radius:999px}.btn-link{background:transparent;border-color:transparent;color:var(--accent);font-weight:600}dialog.account{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--ink);padding:1.25rem;width:min(92vw,22rem)}dialog.account::backdrop{background:#00000059}dialog.account h2{margin:0 0 .75rem;font-size:1.1rem}dialog.account form{display:flex;flex-direction:column;gap:.6rem;margin-bottom:.75rem}dialog.account .field{display:flex;flex-direction:column;gap:.25rem;font-size:.85rem;color:var(--muted)}dialog.account input{font:inherit;padding:.55rem .7rem;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);color:var(--ink)}dialog.account form .btn-primary{width:100%;max-width:none}dialog.account .form-msg{margin:0;min-height:1.2em;font-size:.85rem;color:var(--muted)}dialog.account .form-msg.error{color:var(--bad)}dialog.account .muted{margin:0 0 .75rem;font-size:.85rem;color:var(--muted)}dialog.account .switch{margin:0 0 .75rem;font-size:.9rem;text-align:center}dialog.account .switch a{color:var(--accent);font-weight:600;text-decoration:none}dialog.account .switch a:hover{text-decoration:underline}.leaderboard{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:.9rem 1rem}.leaderboard[hidden]{display:none}.leaderboard h2{margin:0 0 .5rem;font-size:.95rem}.leaderboard p{margin:.25rem 0;font-size:.9rem}.leaderboard .muted{color:var(--muted)}.leaderboard .you{font-weight:600;color:var(--ok)}.leaderboard table{width:100%;border-collapse:collapse;margin-top:.4rem;font-size:.9rem}.leaderboard td{padding:.3rem .25rem;border-top:1px solid var(--grid-line)}.leaderboard td:first-child{color:var(--muted);width:3rem}.leaderboard td.time{text-align:right;font-variant-numeric:tabular-nums}.leaderboard tr.me td{font-weight:700;color:var(--accent)}.hint{margin:0;text-align:center;font-size:.8rem;line-height:1.5;color:var(--on-bg-muted);text-wrap:balance}@media (max-width: 380px){.btn{padding:.6rem .7rem;font-size:.85rem}h1{font-size:1.15rem}}html{background:var(--surface)}.about{margin-top:.5rem;padding-top:.9rem;border-top:1px solid rgba(0,0,0,.06);color:var(--on-bg-muted);font-size:.78rem;line-height:1.55}.about h2{margin:0 0 .3rem;font-size:.8rem;font-weight:700;color:var(--on-bg)}.about p{margin:0}