:root{font-family:system-ui,sans-serif;color:#f2f7ed;background:#083d30;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#176649,#052c25)}main{max-width:980px;margin:auto;padding:18px 18px 24px}header{display:flex;align-items:center;justify-content:space-between;gap:16px}h1{font-size:clamp(1.25rem,3vw,2rem);margin:5px 0 12px}small{font-size:.75rem;letter-spacing:.12em;color:#dfc38a}nav{display:flex;gap:8px}button,select{font:inherit;border:1px solid #ffffff35;border-radius:10px;padding:10px 14px;background:#ffffff0c;color:inherit;cursor:pointer}button:hover{background:#ffffff20}button:disabled{opacity:.5;cursor:wait}.scores{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:6px;margin:8px 0}.score{border:1px solid #ffffff20;border-radius:8px;padding:8px;font-size:.875rem;display:flex;align-items:center;gap:7px}.score.active{border-color:#e8cd93;background:#ffffff12}.dot{width:12px;height:12px;border-radius:50%;background:var(--p)}.status{display:flex;justify-content:space-between;font-size:.9rem;margin:12px 0;color:#e6d5ad}.arena{width:min(100%,650px,calc((100svh - 270px)*.8));margin:auto;aspect-ratio:720/900}canvas{display:block;width:100%;height:100%;object-fit:contain;touch-action:none;user-select:none}#message{text-align:center;min-height:2.5em;margin:8px;font-size:1rem;color:#f4deb0}.controls{max-width:420px;margin:10px auto;font-size:.9rem}.controls label{display:flex;align-items:center;gap:15px}input{width:100%;accent-color:#dfc38a}footer{text-align:center;font-size:.875rem;color:#d3d7be}footer span{font-size:.8rem}dialog{border:1px solid #d9bf80;border-radius:20px;background:#0c4134;color:#f7f7ec;padding:26px;max-width:460px;width:calc(100% - 30px);max-height:90svh}dialog::backdrop{background:#001e19bd;backdrop-filter:blur(5px)}h2{margin:9px 0;font-size:1.6rem}dialog p,li{font-size:1rem;line-height:1.5}li{margin:7px 0}label{display:block;margin:18px 0}select{display:block;width:100%;margin-top:7px;background:#10362c}.primary{width:100%;background:#e5cb8f;color:#17372a;font-weight:700;border:0;margin-top:8px}@media(max-width:520px){main{padding:10px}header{align-items:start}nav{gap:5px}nav button{font-size:.8rem;padding:8px}h1{max-width:200px}.arena{width:min(100%,calc((100svh - 255px)*.8))}.scores{grid-template-columns:repeat(3,1fr)}.score{font-size:.8rem;padding:6px}}

.station-link{display:block;text-align:center;padding:14px;margin:20px 0;border:1px solid #d6c494;border-radius:12px;color:#fff;text-decoration:none;font-weight:700}.station-link:hover{background:#ffffff15}

.objective{font-size:.875rem;line-height:1.35;margin:5px 0 0;color:#fff;max-width:32ch}

html{height:100%;overflow:hidden;overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{position:fixed;inset:0;height:100%;overflow:hidden;overscroll-behavior:none}
main{height:100dvh;width:100%;display:flex;flex-direction:column;overflow:hidden;padding:10px 10px max(10px,env(safe-area-inset-bottom));gap:3px}
header,.scores,.status,.dashboard,#message,.actions,footer,.controls{flex-shrink:0}
.arena{flex:1;position:relative;min-height:0;min-width:0;width:100%;max-width:none;aspect-ratio:auto;margin:0;overflow:hidden}
.arena canvas{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-width:100%;max-height:100%;width:auto;height:auto;touch-action:none;-webkit-user-select:none}
header h1{margin-bottom:4px}header small{letter-spacing:.04em}#message{font-size:.875rem;margin:3px 0;min-height:0}
footer{font-size:.75rem;line-height:1.4;margin-top:3px}.scores{margin:3px 0;padding:0}.status{margin:3px 0}
dialog{overflow:auto;overscroll-behavior:contain;touch-action:pan-y}dialog label{margin:10px 0}
.controls{margin:3px auto;max-height:130px;overflow:auto;touch-action:pan-y}

header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px}header>div{display:contents}header small{grid-column:1/-1}header h1{grid-column:1/-1;white-space:nowrap;max-width:none;font-size:clamp(1.05rem,5vw,1.8rem);line-height:1.15;margin:0}header .objective{grid-column:1;margin:0;max-width:none;font-size:.875rem}header nav{grid-column:2;grid-row:3}header nav button{padding:6px 8px;white-space:nowrap}
@media(max-width:520px){header small{display:none}header nav{grid-row:2}header .objective{font-size:.8rem}header nav button{font-size:.75rem}.scores{gap:4px}.score{padding:4px}.status{margin:2px 0}}
