:root{color-scheme:dark;--ink:#111116;--cream:#fff0cb;--gold:#ffc558;--muted:#b7adb5}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 70% 0,#40304b 0,transparent 50%),#121219;color:var(--cream);font:16px system-ui,sans-serif}main{max-width:1060px;margin:auto;padding:24px}header{position:relative;padding:20px 0 26px}header .back{display:block;margin-bottom:24px}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:800;color:var(--gold)}h1{font-size:clamp(38px,6vw,72px);line-height:1;margin:12px 0;letter-spacing:-.06em}h1 em{color:var(--gold);font-style:normal}p{line-height:1.55}header p{color:var(--muted);margin:0}a{color:var(--gold);text-underline-offset:4px}.game{border:1px solid #67536c;border-radius:20px;overflow:hidden;background:#191820;box-shadow:0 22px 80px #0007}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px}.toolbar>div{display:flex;gap:7px}button{font:inherit;font-weight:750;background:#302937;color:var(--cream);border:1px solid #66546e;border-radius:10px;padding:10px 15px;cursor:pointer;touch-action:none}button:hover{background:#4c3b50}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:disabled{opacity:.4;cursor:default}.stage{position:relative;background:#22202d;line-height:0}canvas{display:block;width:100%;height:auto;aspect-ratio:16/9}.overlay{position:absolute;inset:0;background:#101018cf;display:flex;align-items:center;justify-content:center;padding:20px;line-height:normal;overflow:auto}.overlay[hidden]{display:none}.sheet{max-width:620px;width:100%;text-align:center}.sheet h2{font-size:clamp(24px,4vw,38px);margin:8px 0}.sheet p{color:#d1c4d0;margin:8px 0 14px}.levels{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:20px 0}.levels button{padding:12px 4px;min-height:80px}.levels b{display:block;font-size:25px}.levels small{display:block;font-size:11px;line-height:1.3;margin-top:5px}#result-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}#result-actions[hidden]{display:none}#next,#resume{background:var(--gold);color:#201b22;border-color:var(--gold)}.hud{position:absolute;top:12px;left:14px;right:14px;display:flex;justify-content:space-between;gap:8px;line-height:1;background:#17141ec9;padding:9px 12px;border-radius:9px;pointer-events:none;font:700 13px ui-monospace,monospace}.overlay:not([hidden])~.hud{display:none}.touch{display:flex;justify-content:space-between;padding:12px 16px;background:#201c28}.touch>div{display:flex;gap:10px}.touch button{min-width:64px;min-height:48px;font-size:20px}.touch button[data-key=jump]{min-width:110px;background:#654b27;border-color:#a77d34}.hint{margin:0;padding:0 16px 14px;font-size:13px;color:var(--muted)}footer{font-size:13px;color:var(--muted);padding-top:18px}footer label{display:inline-flex;align-items:center;gap:8px}#share-link{width:100%;padding:10px;margin-top:12px;border:1px solid #b99a60;border-radius:6px;background:#17141e;color:var(--cream)}#share-note{font-size:12px}@media(max-width:600px){main{padding:12px}header{padding-top:6px}.toolbar{padding:9px;font-size:12px}.toolbar button{padding:8px;font-size:12px}.overlay{padding:10px;align-items:flex-start}.sheet h2{font-size:22px;margin:4px}.sheet p{font-size:12px;line-height:1.35;margin:6px}.levels{margin:8px 0;gap:5px}.levels button{min-height:60px;padding:5px 2px}.levels b{font-size:20px}.levels small{font-size:9px}.eyebrow{font-size:9px}.hud{top:6px;left:6px;right:6px;font-size:10px;padding:7px}.touch{padding:9px}#result-actions button,#resume{padding:8px;font-size:12px}#share-note{font-size:10px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
@media(min-width:800px){header{padding:4px 0 16px}header .back{margin-bottom:12px}h1{font-size:46px}.game{max-width:min(100%,calc((100dvh - 245px)*1.7778));min-width:540px;margin-inline:auto}footer{max-width:900px;margin:auto}}

[hidden]{display:none!important}

/* Keep every tool readable on narrow touch screens. */
@media(max-width:600px){.hud{flex-wrap:wrap;gap:5px 10px}.hud span{white-space:nowrap}.sheet{padding-bottom:8px}}

.modebar{padding:12px 16px;background:#27202e;display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:13px}.modebar select{background:#17131e;color:#ffe5ab;border:1px solid #a37b43;border-radius:8px;padding:9px;font:inherit;max-width:100%}.modebar span{color:#b7adb5}.objective{background:#352b22;color:#ffe1a1;padding:12px 16px;margin:0;font-weight:800;font-size:14px}

.field-guide{max-width:850px;margin:30px auto;color:#cfc1cf;line-height:1.6}.field-guide h2{color:#ffdc91;font-size:24px}.field-guide li{margin-bottom:10px}.field-guide b{color:#fff0cb}
