@import url('/portal/local-fonts.css');
:root{color-scheme:dark;--bg:#101b21;--panel:#1a292c;--ink:#fff5da;--muted:#c3d2c6;--accent:#cdeb8e;--line:#435650;font:16px/1.5 'DM Sans',system-ui,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse at 80% 10%,#233a2f,var(--bg) 60%);color:var(--ink)}
main{width:min(1080px,calc(100% - 30px));margin:auto;padding-bottom:32px}
header,nav,.launch,.hud,.hud-actions,.action-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
header{min-height:64px;justify-content:space-between;border-bottom:1px solid var(--line)}
a{color:var(--accent);text-underline-offset:.22em}
header>a{font-weight:800}
h1,h2,p{margin:0 0 12px}
h1{font:700 clamp(2.9rem,8vw,5.5rem)/1 Fredoka,system-ui,sans-serif;letter-spacing:-.035em}
h2{font-size:1.55rem}
.kicker{font-weight:750;letter-spacing:.12em;color:var(--accent)}
#lobby{padding-block:40px}
#lobby>p:first-of-type{margin-bottom:12px}
fieldset{border:0;padding:0;margin:26px 0 16px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
legend{padding:0;margin-bottom:10px;font-weight:800}
fieldset label{display:flex;gap:9px;align-items:flex-start;padding:15px;background:var(--panel);border:1px solid var(--line);border-radius:12px;cursor:pointer}
fieldset label:has(:checked){border-color:var(--accent);background:#304434}
fieldset input{margin-top:6px;accent-color:var(--accent)}
small,.hint{color:var(--muted)}
small{display:block;margin-top:4px}
.hint{font-size:.9rem;margin:14px 0}
button,select{font:inherit;min-height:44px;padding:6px 12px;border-radius:8px;border:1px solid #72837b;background:#263936;color:var(--ink);cursor:pointer}
button:disabled{cursor:default;opacity:.54}
button.primary{background:var(--accent);color:#17231d;border-color:transparent;font-weight:850}
:focus-visible{outline:2px solid #ffe6a9;outline-offset:3px}
#game{margin-top:10px}
.hud{justify-content:space-between;margin-bottom:8px;font-variant-numeric:tabular-nums}
.hud strong{font-weight:850}
.arena{border:1px solid #526763;border-radius:12px;overflow:hidden;background:#172823;line-height:0}
canvas{display:block;width:100%;max-height:min(61vh,640px);object-fit:contain}
.run-status{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:8px;align-items:start}
#notice{margin:0;font-size:.91rem;min-height:2.65em}
meter{width:min(220px,75%);height:14px;accent-color:#cdeb8e}
meter::-webkit-meter-optimum-value{background:#cdeb8e}
kbd{font:700 .8rem monospace;color:#e4ebbf}
#touch{display:flex;align-items:center;gap:14px}
#touch[hidden],[hidden]{display:none!important}
#touch p{font-size:.8rem;color:var(--muted);margin:0}
#stick{flex:none;position:relative;width:78px;height:78px;border-radius:50%;border:1px solid #819783;background:#253d39;touch-action:none}
#thumb{position:absolute;inset:24px;border-radius:50%;background:var(--accent);pointer-events:none}
dialog{color:var(--ink);width:min(520px,calc(100% - 24px));max-height:88dvh;border:1px solid #72837b;background:#192b2c;border-radius:14px;padding:20px;overflow:auto}
dialog::backdrop{background:#091111c7}
#panel-content .choices{display:grid;gap:8px;margin-top:10px}
#panel-content .choices>button{text-align:left}
.bag-row{padding:8px 0;border-top:1px solid var(--line)}
.bag-row button{margin:4px 4px 0 0}
@media(max-width:700px){fieldset{grid-template-columns:1fr}#lobby{padding-block:26px}.run-status{grid-template-columns:1fr}.hud{gap:5px 10px;font-size:.88rem}.hud-actions{margin-left:auto}.hint.keyboard{display:none}}
@media(max-height:520px) and (pointer:coarse){header{min-height:36px}.arena{max-width:calc(100% - 116px)}canvas{max-height:58dvh}#game{position:relative}#touch{position:absolute;right:4px;top:85px;display:block;width:88px}#touch p{display:none}.run-status{grid-template-columns:1fr auto}.hud button,.action-row button{min-height:40px}}