:root{--bg:#0d1420;--text:#dcd3c0;--text-sub:#a89f8c;--accent:#d06a55;--gold:#cfa84a}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg);color:var(--text);overscroll-behavior:none;font-family:system-ui,sans-serif}.logo,.menu-title,.clear-word{font-family:Shippori Mincho,serif;font-weight:600}#app{flex-direction:column;height:100dvh;display:flex;position:relative}.hud{align-items:center;gap:14px;width:100%;padding:12px 16px 6px;display:flex}.logo-wrap{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.logo{letter-spacing:.32em;color:inherit;cursor:pointer;background:0 0;border:none;padding:0;font-size:1.05rem}.logo:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.hud-stats{color:var(--text-sub);font-variant-numeric:tabular-nums;gap:14px;margin-left:auto;font-size:.85rem;display:flex}.hud-stats .stat{white-space:nowrap}.stat-chapter{opacity:.85}@media (width<=560px){.stat-chapter{display:none}}.restart,.sound,.help{font:inherit;color:var(--text);border:1px solid var(--text-sub);cursor:pointer;white-space:nowrap;background:0 0;border-radius:8px;min-height:38px;padding:6px 12px;font-size:.8rem}.help{padding:6px 11px;font-size:.9rem;line-height:1}.restart:hover,.sound:hover,.help:hover{border-color:var(--text)}.restart:focus-visible,.sound:focus-visible,.help:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.sound[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}.board{flex:1;width:100%;min-height:0;position:relative}.board canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.board canvas:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}.hint,.note{inset-inline:0;text-align:center;color:var(--text-sub);pointer-events:none;font-size:.85rem;transition:opacity .5s;position:absolute;bottom:16px}.note{transition:opacity .8s;bottom:42px}.hint.is-hidden,.note.is-hidden{opacity:0}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.to-title{font:inherit;color:var(--text-sub);background:color-mix(in srgb, var(--bg) 70%, transparent);border:1px solid var(--text-sub);cursor:pointer;border-radius:999px;min-height:34px;padding:6px 13px;font-size:.78rem;position:absolute;top:8px;left:12px}.to-title:hover{color:var(--text);border-color:var(--text)}.to-title:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.clear-banner{pointer-events:none;flex-direction:column;justify-content:center;align-items:center;transition:opacity .45s;display:flex;position:absolute;inset:0}.clear-banner.is-hidden{opacity:0}.clear-word{letter-spacing:.32em;color:var(--gold);padding-left:.32em;font-size:1.9rem}.clear-stats{color:var(--text-sub);margin-top:6px;font-size:.9rem}.menu{z-index:10;background:color-mix(in srgb, var(--bg) 84%, transparent);justify-content:center;align-items:center;transition:opacity .45s,visibility .45s;display:flex;position:absolute;inset:0}.menu.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.menu-inner{text-align:center;max-width:420px;padding:24px}.menu-title{letter-spacing:.42em;margin:10px 0 2px;padding-left:.42em;font-size:2.1rem}.menu-tagline{color:var(--text-sub);margin-bottom:18px;font-size:.95rem}.menu-help{color:var(--text-sub);margin-bottom:24px;font-size:.85rem;line-height:2.1;list-style:none}.menu-actions{flex-direction:column;align-items:center;gap:10px;display:flex}.menu-actions button{font:inherit;color:var(--text);border:1px solid var(--text-sub);cursor:pointer;background:0 0;border-radius:10px;min-width:240px;min-height:46px;padding:11px 18px;font-size:.95rem}.menu-actions button:hover{border-color:var(--text)}.menu-actions button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.menu-continue{border-color:var(--accent);border-width:2px}.menu-danger{color:var(--accent);border-color:var(--accent)}.menu-confirm-text{color:var(--text-sub);margin-bottom:16px;font-size:.85rem;line-height:1.9}.stage-select{text-align:left;margin-top:18px}.stage-select summary{cursor:pointer;color:var(--text-sub);text-align:center;padding:6px;font-size:.85rem;list-style:none}.stage-select summary::-webkit-details-marker{display:none}.stage-select summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.stage-grid{grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:6px;max-height:190px;margin-top:10px;padding:4px;display:grid;overflow-y:auto}.stage-grid button{font:inherit;min-width:0;min-height:38px;color:var(--text);border:1px solid var(--text-sub);cursor:pointer;background:0 0;border-radius:8px;padding:4px;font-size:.8rem}.stage-grid button:hover{border-color:var(--text)}.stage-grid button[aria-current=true]{border-color:var(--accent);color:var(--accent);border-width:2px}.stage-grid button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.stage-chapter{color:var(--text-sub);grid-column:1/-1;margin-top:6px;font-size:.75rem}.help-panel{z-index:9;background:color-mix(in srgb, var(--bg) 88%, transparent);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.help-panel.is-hidden{display:none}.help-inner{text-align:left;max-width:380px;padding:24px}.help-inner h2{text-align:center;margin-bottom:12px;font-size:1rem}.help-inner dl{color:var(--text-sub);margin-bottom:18px;font-size:.85rem;line-height:1.9}.help-inner dt{color:var(--text);margin-top:10px}.help-close{font:inherit;color:var(--text);border:1px solid var(--text-sub);cursor:pointer;background:0 0;border-radius:10px;min-height:44px;margin:0 auto;padding:10px 22px;font-size:.9rem;display:block}.help-close:hover{border-color:var(--text)}.help-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.emblem{width:150px;margin:0 auto;display:block}.emblem-thread{stroke-width:3px;stroke-linecap:round}.emblem-node{fill:var(--text)}.emblem-a{stroke:var(--accent);animation:4.2s ease-in-out infinite emblem-cool}.emblem-knot{fill:none;stroke:var(--accent);stroke-width:1.5px;animation:4.2s ease-in-out infinite emblem-knot}.emblem-b{animation:4.2s ease-in-out infinite emblem-untie}.emblem-b .emblem-thread{stroke:var(--accent);animation:4.2s ease-in-out infinite emblem-cool}@keyframes emblem-untie{0%,38%{transform:translateY(0)}58%,to{transform:translateY(34px)}}@keyframes emblem-cool{0%,40%{stroke:var(--accent)}52%{stroke:var(--gold)}70%,to{stroke:var(--text)}}@keyframes emblem-knot{0%,42%{opacity:1}56%,to{opacity:0}}@media (prefers-reduced-motion:reduce){.menu{transition:none}.emblem-a,.emblem-b,.emblem-b .emblem-thread,.emblem-knot{animation:none}.emblem-b{transform:translateY(34px)}.emblem-a,.emblem-b .emblem-thread{stroke:var(--text)}.emblem-knot{opacity:0}}@media (width<=430px){.logo{letter-spacing:.14em;font-size:.88rem}.hud{gap:7px;padding:10px 10px 6px}.hud-stats{gap:8px;font-size:.75rem}.restart,.sound,.help{min-height:34px;padding:5px 9px;font-size:.72rem}.help{padding:5px 9px;font-size:.85rem}}@media (prefers-reduced-motion:reduce){.hint{transition:none}}@media (width>=720px){.hud,.board{max-width:720px;margin-inline:auto}}