:root{--raised:inset 0 1.5px 0 #ffffff8c, inset 1px 0 0 #ffffff2e, inset -1px 0 0 #00000014, inset 0 -4px 0 #0000002e, 0 1px 1px #0000002e, 0 4px 8px -2px #00000047;--raised-strong:inset 0 2px 0 #fff9, inset 1px 0 0 #fff3, inset -1px 0 0 #0000001a, inset 0 -5px 0 #00000038, 0 2px 2px #0003, 0 8px 14px -4px #00000059;--pressed:inset 0 3px 5px #0003, inset 0 1px 1px #0000001f, inset 0 -1px 0 #ffffff4d;--tray:inset 0 4px 10px #00000042, inset 0 -1px 0 #ffffff4d, 0 0 0 1px #ffffff59, 0 1px 0 #fff6, 0 14px 30px -10px #00000059;--sheen:radial-gradient(ellipse 70% 50% at 30% 18%, #ffffff47, #fff0 70%), linear-gradient(180deg, #ffffff29, #fff0 55%);--ambient:radial-gradient(ellipse 70% 45% at 50% 28%, #fff8e673, transparent 70%), radial-gradient(ellipse 120% 60% at 50% 110%, #00000014, transparent 70%);--shade:radial-gradient(ellipse 120% 95% at 50% 40%, transparent 52%, #0000002e)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--ambient:radial-gradient(ellipse 80% 60% at 50% 32%, #ffffff0f, transparent 70%);--shade:radial-gradient(ellipse 130% 100% at 50% 40%, transparent 55%, #00000059);--sheen:linear-gradient(180deg, #ffffff1a, #fff0 55%)}}:root[data-theme=dark]{--ambient:radial-gradient(ellipse 80% 60% at 50% 32%, #ffffff0f, transparent 70%);--shade:radial-gradient(ellipse 130% 100% at 50% 40%, transparent 55%, #00000059);--sheen:linear-gradient(180deg, #ffffff1a, #fff0 55%)}@keyframes art-pop{0%{opacity:0;transform:scale(.4)}70%{opacity:1;transform:scale(1.08)}to{transform:scale(1)}}@keyframes art-pulse{0%{transform:scale(1)}45%{transform:scale(1.14)}to{transform:scale(1)}}@keyframes art-shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-5px)}40%,80%{transform:translate(5px)}}@keyframes art-press{0%{transform:scale(1)}40%{transform:scale(.9)}to{transform:scale(1)}}.art-pop{animation:.22s ease-out art-pop}.art-pulse{animation:.22s ease-out art-pulse}.art-shake{animation:.32s ease-in-out art-shake}.art-press{animation:.18s ease-out art-press}@media (prefers-reduced-motion:reduce){.art-pop,.art-pulse,.art-shake,.art-press{animation:none}}.sound-toggle{background:var(--btn,#00000040);width:36px;min-width:36px;height:36px;color:var(--ink,#fff);cursor:pointer;border:0;border-radius:50%;place-items:center;padding:0;display:inline-grid}.sound-toggle svg{width:20px;height:20px}.sound-toggle[aria-pressed=true]{opacity:.7}.sound-toggle:focus-visible{outline:3px solid var(--focus,#ffd54a);outline-offset:2px}:root{--bg:#f3f0e8;--ink:#1d1b17;--btn:#00000012;--btn-on:#2f6fdb;--btn-on-ink:#fff;--focus:#2f6fdb;--dialog:#fffdf9;--dialog-ink:#1d1b17;--line:#c9c4b8;--paper:#fbf9f3;--start:#cfc9bb;--target:#e2a92c;--target-ink:#2a1d00;--changed:#1f55c2;--hint:#6d3fc4;--good:#2f8a40;--key:#e3dfd5;--key-ink:#1d1b17;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#16181c;--ink:#eceae4;--btn:#ffffff1a;--dialog:#22252b;--dialog-ink:#eceae4;--line:#454a54;--paper:#2b2f36;--start:#4a4f58;--target:#c9961e;--changed:#2d63c9;--hint:#7a4fd0;--good:#3c9a52;--key:#5a5f69;--key-ink:#eceae4;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#16181c;--ink:#eceae4;--btn:#ffffff1a;--dialog:#22252b;--dialog-ink:#eceae4;--line:#454a54;--paper:#2b2f36;--start:#4a4f58;--target:#c9961e;--changed:#2d63c9;--hint:#7a4fd0;--good:#3c9a52;--key:#5a5f69;--key-ink:#eceae4;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--ambient), var(--shade), var(--grain,none), radial-gradient(ellipse 80% 60% at 50% 30%, color-mix(in srgb, var(--bg) 88%, #fff), var(--bg));color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;font:14px/1.3 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}#app.wl{grid-template-rows:auto auto minmax(0,1fr) auto;justify-items:center;gap:6px;height:100dvh;padding:8px 10px 10px;display:grid;position:relative}.wl-bar{flex-wrap:wrap;grid-row:1;justify-content:center;align-items:center;gap:6px;width:100%;display:flex}.wl-title{letter-spacing:1px;text-transform:uppercase;margin:0 6px 0 0;font:800 18px/1 Trebuchet MS,Segoe UI,sans-serif}.group{gap:3px;display:flex}.btn{font:inherit;color:var(--ink);background:var(--btn);cursor:pointer;border:0;border-radius:9px;min-height:34px;padding:7px 11px;box-shadow:inset 0 1px #ffffff1f,0 2px 6px #0000001f}.btn[hidden]{display:none}.btn:disabled{opacity:.45;cursor:default}.btn[aria-pressed=true]{background:var(--btn-on);color:var(--btn-on-ink);font-weight:700}.btn.primary{background:var(--btn-on);color:var(--btn-on-ink);font-weight:800}.btn:focus-visible,.wl-key:focus-visible,.wl-undo:focus-visible,button.wl-tile:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.sound-toggle{width:34px;height:34px}.wl-status{text-align:center;opacity:.9;grid-row:2;min-height:1.3em;margin:0;padding:0 6px;font-weight:600}.wl-stage{--len:4;--tile:min(54px, calc((100cqw - (var(--len) - 1) * 6px - 56px) / var(--len)), calc((100cqh - 6 * 6px - 14px) / 7));flex-direction:column;grid-row:3;justify-content:safe center;align-items:center;gap:4px;width:100%;min-height:0;display:flex;position:relative;container-type:size}.wl-list{scrollbar-width:thin;flex-direction:column;flex:0 auto;align-items:center;gap:6px;max-width:100%;min-height:0;padding:2px 56px;display:flex;overflow:hidden auto}.wl-row{grid-template-columns:repeat(var(--len), var(--tile));flex:none;gap:6px;display:grid;position:relative}.wl-stage>.wl-row.target{flex:none}.wl-row.target{border-top:2px dashed var(--line);margin-top:2px;padding-top:8px}.wl-tile{width:var(--tile);height:var(--tile);font:800 calc(var(--tile) * .5) / 1 "Trebuchet MS", "Segoe UI", sans-serif;background:var(--paper);color:var(--ink);text-transform:uppercase;box-shadow:var(--raised);background-image:var(--sheen);border-radius:8px;place-items:center;display:grid}.start .wl-tile{background-color:var(--start)}.target .wl-tile{background-color:var(--target);color:var(--target-ink)}.target.reached .wl-tile{background-color:var(--good);color:#fff}.step .wl-tile.changed{background-color:var(--changed);color:#fff}.step.hinted .wl-tile.changed{background-color:var(--hint)}.input .wl-tile{border:2px solid var(--line);background-color:var(--paper);cursor:pointer;box-shadow:var(--pressed);padding:0;transition:border-color .12s,transform .12s}.input .wl-tile.edited{color:var(--changed);border-color:var(--changed)}.input .wl-tile.cursor{border-color:var(--focus);box-shadow:var(--pressed), 0 0 0 3px color-mix(in srgb, var(--focus) 35%, transparent);transform:translateY(-2px)}.input .wl-tile:disabled{cursor:default;opacity:.7}.wl-undo{width:calc(var(--tile) * .72);height:calc(var(--tile) * .72);background:var(--btn);color:var(--ink);font:700 calc(var(--tile) * .4) / 1 system-ui, sans-serif;cursor:pointer;border:0;border-radius:50%;position:absolute;top:50%;left:100%;translate:8px -50%;box-shadow:0 2px 6px #0000001f}.wl-undo:disabled{opacity:.45;cursor:default}.wl-toast{background:var(--ink);color:var(--bg);z-index:5;white-space:nowrap;border-radius:8px;padding:8px 14px;font-weight:700;position:absolute;top:4px;left:50%;translate:-50%;box-shadow:0 6px 18px #00000040}.wl-toast[hidden]{display:none}.wl-keys{flex-direction:column;grid-row:4;gap:6px;width:min(100%,560px);display:flex}.wl-krow{justify-content:center;gap:5px;display:flex}.wl-key{background:var(--key);min-width:0;max-width:46px;height:50px;color:var(--key-ink);text-transform:uppercase;cursor:pointer;border:0;border-radius:6px;flex:1 1 0;padding:0;font:700 15px/1 system-ui,sans-serif;box-shadow:0 2px #00000026}.wl-key.wide{flex:1.6 1 0;max-width:74px;font-size:12px}.wl-key:disabled{opacity:.6;cursor:default}.overlay{z-index:30;background:#0a0a0c80;place-items:center;padding:12px;display:grid;position:absolute;inset:0;overflow:auto}.overlay[hidden]{display:none}.overlay.later{animation:1s step-end both wl-later}@keyframes wl-later{0%{opacity:0}to{opacity:1}}.dialog{background:var(--dialog);color:var(--dialog-ink);text-align:center;border-radius:16px;flex-direction:column;gap:10px;width:min(100%,420px);max-height:100%;padding:18px 20px;display:flex;overflow:auto;box-shadow:0 12px 40px #00000059}.dialog h2{margin:0;font:800 20px/1.2 Trebuchet MS,Segoe UI,sans-serif}.dialog p{opacity:.85;margin:0}.wl-result{font-weight:700;opacity:1!important}.wl-sol-title{text-transform:uppercase;letter-spacing:.8px;opacity:.75;font-size:12px}.wl-solution{letter-spacing:.5px;font-weight:700;line-height:1.5;opacity:1!important}.wl-nums{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.wl-num{flex-direction:column;align-items:center;display:flex}.wl-num b{font-size:24px;line-height:1}.wl-num span{opacity:.75;font-size:11px}.wl-dist-title{text-transform:uppercase;letter-spacing:.8px;opacity:.75;font-size:12px}.wl-dist{flex-direction:column;gap:4px;display:flex}.wl-dist-row{align-items:center;gap:6px;font-size:12px;display:flex}.wl-dist-n{text-align:right;width:22px;font-weight:700}.wl-dist-bar{background:var(--start);color:var(--ink);text-align:right;border-radius:3px;min-width:20px;padding:2px 6px;font-weight:700}.wl-dist-bar.hit{background:var(--good);color:#fff}.wl-dialog-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.wl-next{width:100%;font-size:13px}@media (prefers-reduced-motion:reduce){.input .wl-tile{transition:none}}@media (max-width:420px){.wl-title{font-size:15px}.btn{min-height:30px;padding:6px 8px;font-size:13px}.wl-key{height:46px;font-size:14px}}@media (max-height:560px) and (min-aspect-ratio:1){#app.wl{grid-template:"bar bar""stage keys"minmax(0,1fr)/minmax(0,1fr) auto;gap:3px;padding:6px 8px}.wl-bar{grid-area:bar}.wl-status{display:none}.wl-stage{--tile:min(54px, calc((100cqw - (var(--len) - 1) * 4px - 56px) / var(--len)), calc((100cqh - 6 * 4px - 12px) / 7));grid-area:stage;gap:2px}.wl-list,.wl-row{gap:4px}.wl-row.target{padding-top:6px}.wl-undo{left:auto;right:100%;translate:-8px -50%}.wl-keys{grid-area:keys;align-self:center;gap:4px;width:min(52vw,420px)}.wl-key{max-width:38px;height:34px;font-size:12px}.wl-key.wide{font-size:10px}.btn{min-height:28px;padding:4px 8px;font-size:12px}.sound-toggle{width:28px;height:28px}.wl-title{font-size:14px}}@media (max-height:300px){#app.wl{gap:2px;padding:4px 6px}.wl-title{display:none}.wl-bar{gap:3px}.btn{border-radius:6px;min-height:22px;padding:2px 5px;font-size:10px}.sound-toggle{width:22px;height:22px}.wl-key{height:24px;font-size:10px}.wl-key[data-key=enter]{font-size:0}.wl-key[data-key=enter]:before{content:"↵";font-size:12px}.wl-keys{gap:2px}.wl-krow{gap:3px}.dialog{gap:6px;padding:8px 10px}.dialog h2{font-size:15px}.wl-nums{gap:10px}.wl-num b{font-size:16px}.wl-dist,.wl-dist-title{display:none}}