:root{color-scheme:dark;--ink:#f4f2e9;--dim:#b9c8c8;--accent:#ffc482;--line:#435557;--mono:ui-monospace,monospace}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:radial-gradient(ellipse at 60% 0,#243a3b,#111a1e 64%);font:15px/1.5 system-ui,sans-serif}a{color:inherit;text-decoration:none}
button{font:inherit;font-weight:750;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:disabled{opacity:.48;cursor:default}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px max(18px,calc((100vw - 1080px)/2));border-bottom:1px solid var(--line);background:#111a1d}.brand{display:flex;align-items:center;gap:9px;font-size:19px;font-weight:850}.bar>a:last-child{color:var(--dim);font-size:13px}
main{max-width:1120px;margin:auto;padding:26px 20px 48px}.intro{display:flex;justify-content:space-between;align-items:end;gap:14px;margin-bottom:18px}.intro>p{color:var(--dim);text-align:right;margin:0}.label,.alert label{color:var(--accent);font:800 10px/1.4 var(--mono);letter-spacing:.12em;margin:0}
h1{font-size:clamp(38px,6.6vw,76px);line-height:.96;letter-spacing:-.067em;margin:4px 0 0}h1 em{font-style:normal;color:var(--accent)}
.cabinet{overflow:hidden;background:#151f23;border:1px solid #536568;border-radius:13px;box-shadow:0 22px 64px #0b111777}.hud{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:10px 16px}.hud>div{display:grid;justify-content:start;align-content:center}.hud strong{font:800 19px var(--mono);font-variant-numeric:tabular-nums}.hud #clock.danger{color:#ff8b75}
progress{width:100%;height:8px;accent-color:#f29168}.hud .alert{justify-content:stretch;padding-right:12px}
.stage{position:relative;background:#26373b}.stage canvas{display:block;width:100%;aspect-ratio:3/2;height:auto;image-rendering:pixelated}
.overlay{position:absolute;inset:0;display:grid;place-items:center;padding:10px;background:#101b1db0}.overlay[hidden],.prompt[hidden]{display:none}
.brief{max-width:430px;width:100%;padding:clamp(10px,3vw,26px);border:1px solid #77837a;border-radius:10px;background:linear-gradient(145deg,#253639,#142226);box-shadow:0 12px 40px #0c1319b0}
.brief h2,.how h2{font-size:clamp(24px,4vw,39px);line-height:1.02;letter-spacing:-.045em;margin:5px 0 8px}.brief>p:not(.label){color:var(--dim);margin:0 0 12px}
.brief button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 10px;border:1px solid #ffca91;border-radius:5px;background:var(--accent);color:#241d19;text-align:left}
.prompt{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);white-space:nowrap;margin:0;padding:4px 8px;border:1px solid #e0a979;border-radius:5px;background:#241c19e8;color:#ffddab;font:750 11px var(--mono);pointer-events:none}
.controls{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 14px;color:var(--dim);font-size:12px}.controls button,.touch button{border:1px solid #577071;border-radius:5px;background:#263b3c;padding:5px 10px}
kbd{padding:1px 4px;border:1px solid #617575;border-radius:3px;color:#f3e7cf;font:750 10px var(--mono);white-space:nowrap}
.touch{display:none;align-items:center;justify-content:space-between;gap:10px;padding:5px 12px 10px;touch-action:none;user-select:none}.dpad{display:grid;grid-template-columns:repeat(3,43px);gap:3px}.dpad button{min-height:36px}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1}.touch .defuse{min-height:60px;border-color:#e8a878;color:#ffcd93}.defuse small{font-size:10px;color:var(--dim)}
.how{margin-top:16px;padding:14px 17px;background:#1a272b;border:1px solid var(--line);border-radius:10px}.how h2{font-size:23px}.how ol{padding-left:18px;margin:9px 0;color:var(--dim)}.how li+li{margin-top:6px}.how li b{color:var(--ink)}.daily-note{margin:10px 0 0;font-size:12px;color:var(--accent)}
@media(any-pointer:coarse){.touch{display:flex}}
@media(max-width:580px){main{padding:16px 8px 30px}.intro{display:block;padding-inline:4px}.intro>p{text-align:left;font-size:12px;margin-top:6px}.intro br{display:none}.hud{padding:7px;gap:4px}.hud strong{font-size:13px}.hud .label,.alert label{font-size:8px;letter-spacing:.04em}.hud .alert{padding-right:4px}.brief{max-width:310px}.brief>p:not(.label){font-size:12px;line-height:1.3;margin-bottom:7px}.controls{padding:5px 7px;font-size:10px}.prompt{font-size:9px;bottom:5px}}
