:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#f4f1ea;--surface:#fff;--surface-2:#ebe7dd;--ink:#1d2433;--ink-soft:#4b5568;--line:#cfc9bb;--accent:#3b3fd6;--accent-ink:#fff;--black-cell:#1d2433;--wrong:#c2261f;--good:#1c7c4d;--sel-ring:#1d2433;--root:#1e56c8;--root-bg:#dbe6fb;--third:#b8236e;--third-bg:#f8dcea;--fifth:#1b7a4f;--fifth-bg:#d8f0e4;--seventh:#a35a00;--seventh-bg:#fbe6c8;--radius:10px;--font:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-music:"Noto Music", "Segoe UI Symbol", "Apple Symbols", "Bravura Text", var(--font)}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}:root:not([data-theme=light]){--bg:#12161f;--surface:#1c2230;--surface-2:#272f42;--ink:#eef0f6;--ink-soft:#aab2c5;--line:#38415a;--accent:#8f94ff;--accent-ink:#12161f;--black-cell:#070a10;--wrong:#ff7b73;--good:#5fd39a;--sel-ring:#fff;--root:#8fb3ff;--root-bg:#1f3157;--third:#ff8cc0;--third-bg:#4a1f37;--fifth:#6fdba5;--fifth-bg:#1a4231;--seventh:#ffbe6b;--seventh-bg:#4b3513}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font);margin:0;line-height:1.4}button,select{font:inherit;color:inherit}.app{max-width:560px;padding:12px 16px calc(24px + env(safe-area-inset-bottom));flex-direction:column;gap:12px;margin:0 auto;display:flex}.top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.brand h1{letter-spacing:.02em;margin:0;font-size:1.35rem}.brand p{color:var(--ink-soft);margin:0;font-size:.8rem}.top-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.level-pick{color:var(--ink-soft);align-items:center;gap:6px;font-size:.85rem;display:flex}.level-pick select{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);max-width:12.5rem;min-height:44px;padding:0 8px}.btn{cursor:pointer;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);min-height:44px;padding:0 14px}.btn:hover{background:var(--surface-2)}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.banner{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);min-height:7.5rem;padding:10px 14px;position:relative}.listen{white-space:nowrap;min-width:44px;position:absolute;top:6px;right:8px}.banner .clue-name{padding-right:6.5rem}.banner-meta{color:var(--ink-soft);font-size:.8rem}.clue-name{font-family:var(--font-music);font-size:1.7rem;font-weight:700;line-height:1.2}.formula{flex-wrap:wrap;align-items:center;gap:4px;margin-top:4px;display:flex}.formula-label{color:var(--ink-soft);margin-right:4px;font-size:.8rem}.dot{color:var(--ink-soft)}.desc{color:var(--ink-soft);margin:6px 0 0;font-size:.85rem}.chip{text-align:center;min-width:2rem;font-family:var(--font-music);border:2px solid #0000;border-radius:999px;padding:1px 8px;font-weight:600;display:inline-block}.chip.current{border-color:var(--ink)}.role-root{--role:var(--root);--role-bg:var(--root-bg)}.role-third{--role:var(--third);--role-bg:var(--third-bg)}.role-fifth{--role:var(--fifth);--role-bg:var(--fifth-bg)}.role-seventh{--role:var(--seventh);--role-bg:var(--seventh-bg)}.chip.role-root,.chip.role-third,.chip.role-fifth,.chip.role-seventh{background:var(--role-bg);color:var(--role)}.board{justify-content:center;display:flex}.grid{--cell:clamp(44px, calc((100vw - 32px) / var(--cols,7)), 62px);background:var(--black-cell);border-radius:var(--radius);flex-direction:column;gap:2px;padding:4px;display:inline-flex}.grid:focus-visible{outline-offset:4px}.row{gap:2px;display:flex}.cell{width:var(--cell);height:var(--cell);cursor:pointer;background:var(--surface);color:var(--ink);font-family:var(--font-music);font-size:calc(var(--cell) * .4);border:0;border-radius:4px;justify-content:center;align-items:center;padding:0;font-weight:600;display:flex;position:relative}.cell.black{background:var(--black-cell);cursor:default}.cell.in-entry{background:var(--role-bg,var(--surface-2));box-shadow:inset 0 -4px 0 var(--role,var(--accent))}.cell.selected{outline:3px solid var(--sel-ring);outline-offset:-3px;z-index:1}.cell.wrong{color:var(--wrong)}.cell .num{font-family:var(--font);color:var(--ink-soft);font-size:.6rem;font-weight:600;position:absolute;top:2px;left:4px}.cell .rolemark{color:var(--role);font-size:.6rem;font-weight:700;position:absolute;top:2px;right:4px}.cell .wrong-mark{font-family:var(--font);color:var(--wrong);font-size:.65rem;font-weight:700;position:absolute;bottom:1px;right:4px}.cell.wrong:after{content:"";border:2px dashed var(--wrong);pointer-events:none;border-radius:3px;position:absolute;inset:3px}.status{text-align:center;min-height:1.5rem;color:var(--ink-soft);font-size:.9rem}.status.solved{color:var(--good);font-size:1rem}.status .btn{margin-left:8px}.keyboard{flex-direction:column;gap:6px;display:flex}.key-row{gap:6px;display:flex}.key{cursor:pointer;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);min-width:44px;min-height:48px;font-family:var(--font-music);flex:1;font-size:1.1rem;font-weight:600}.key:hover:not(:disabled){background:var(--surface-2)}.key:disabled{opacity:.4;cursor:default}.key[aria-pressed=true]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.key.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-family:var(--font);flex:2}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:0 14px}.panel summary{cursor:pointer;align-items:center;min-height:44px;font-weight:600;display:flex}.panel[open] summary{border-bottom:1px solid var(--line);margin-bottom:8px}.clues{grid-template-columns:1fr 1fr;gap:12px;padding-bottom:12px;display:grid}.clues h2{color:var(--ink-soft);margin:0 0 4px;font-size:.85rem}.clues ul{margin:0;padding:0;list-style:none}.clue{text-align:left;cursor:pointer;width:100%;min-height:44px;font-family:var(--font-music);background:0 0;border:0;border-radius:6px;padding:4px 8px}.clue:hover{background:var(--surface-2)}.clue.active{background:var(--surface-2);font-weight:700}.clue.done{color:var(--ink-soft);text-decoration:line-through;text-decoration-thickness:1px}.clue .n{font-family:var(--font);margin-right:4px;font-weight:700}.clue .len{color:var(--ink-soft);font-size:.8em}fieldset{border:0;margin:0 0 10px;padding:0}legend{color:var(--ink-soft);margin-bottom:2px;padding:0;font-size:.85rem}.opt{cursor:pointer;align-items:center;gap:8px;min-height:44px;display:flex}.opt input{width:20px;height:20px;accent-color:var(--accent)}.shortcuts{color:var(--ink-soft);padding-bottom:10px;font-size:.8rem}@media (width<=380px){.clues{grid-template-columns:1fr}.clue-name{font-size:1.45rem}}@media (prefers-reduced-motion:no-preference){.cell,.key,.btn{transition:background-color .12s}}.score{color:var(--ink-soft);white-space:nowrap;font-size:.85rem;font-weight:600}.letters{font-family:var(--font-music);margin:4px 0 0;font-weight:600}.feedback{background:var(--role-bg,var(--surface-2));color:var(--ink);border:1px solid var(--line);border-left:6px solid var(--role,var(--accent));border-radius:var(--radius);padding:10px 14px;font-size:.95rem}.feedback[hidden]{display:none}.cell.given{background:var(--surface-2)}.cell.given:before,.cell.hinted:before{content:"";background:var(--ink-soft);border-radius:50%;width:6px;height:6px;position:absolute;bottom:3px;left:3px}.cell.hinted:before{border-radius:1px;transform:rotate(45deg)}.cell.given.in-entry,.cell.hinted.in-entry{background:var(--role-bg,var(--surface-2))}.key.wide{font-family:var(--font);flex:1}.summary{color:var(--ink-soft);margin:4px 0 8px;font-size:.85rem;font-weight:400}.overlay{z-index:10;background:#080a1099;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.dialog{background:var(--surface);width:100%;max-width:440px;max-height:100%;color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:18px;overflow:auto}.dialog h2{margin:2px 0 8px;font-size:1.2rem}.dialog p{margin:0 0 10px}.dialog .step{color:var(--ink-soft);font-size:.8rem}.dialog-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:12px;display:flex}.primary-btn{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.tut-line{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;display:flex}.chip.big{min-width:3rem;padding:4px 14px;font-size:1.3rem}.dialog.menu{max-width:520px;max-height:min(92vh,720px)}.level-block{margin-bottom:14px}.level-block h3{margin:0;font-size:1rem}.level-count,.level-note{color:var(--ink-soft);margin:2px 0 6px;font-size:.8rem}.tiles{grid-template-columns:repeat(5,minmax(44px,1fr));gap:6px;display:grid}.tile{cursor:pointer;background:var(--surface-2);border-radius:var(--radius);border:2px solid #0000;flex-direction:column;justify-content:center;align-items:center;min-height:48px;padding:2px;font-weight:700;display:flex;position:relative}.tile .tile-g{min-height:.7rem;font-size:.7rem;line-height:1}.tile.open{border-color:var(--accent);background:var(--surface)}.tile.progress{border-color:var(--accent)}.tile.done{background:var(--fifth-bg);color:var(--fifth)}.tile.perfect{background:var(--seventh-bg);color:var(--seventh)}.tile.locked{opacity:.45;cursor:not-allowed}.tile.current{outline:3px solid var(--sel-ring);outline-offset:1px}.x2{vertical-align:-.08em;font-size:1.75em;font-weight:700;line-height:0}.acc-key[data-acc="2"]{font-size:1.6rem}