:root{font-family:system-ui,sans-serif;color:#f2f7ed;background:#083d30;color-scheme:dark}*{box-sizing:border-box}html{height:100%;overflow:hidden;overscroll-behavior:none;-webkit-text-size-adjust:100%}body{margin:0;position:fixed;inset:0;overflow:hidden;background:radial-gradient(ellipse at top,#176649,#052c25)}main{max-width:1050px;margin:auto;height:100dvh;display:flex;flex-direction:column;padding:10px 12px max(8px,env(safe-area-inset-bottom));gap:4px;overflow:hidden}header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-shrink:0}h1{font-size:clamp(1.05rem,4vw,1.8rem);line-height:1.15;margin:4px 0;white-space:nowrap}small{font-size:.65rem;letter-spacing:.07em;color:#dfc38a}nav{display:flex;gap:6px}button,select{font:inherit;border:1px solid #ffffff35;border-radius:10px;padding:8px 12px;background:#ffffff0c;color:inherit;cursor:pointer}button:disabled{opacity:.5}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #edcb85;outline-offset:3px}.route{display:flex;justify-content:space-between;gap:4px;font-size:.66rem;margin:3px 0;flex-shrink:0}.route a{text-decoration:none;color:#d7dccd}.route .active{color:#ffe0a3;font-weight:750}.dashboard{display:grid;grid-template-columns:1fr 1fr 1fr;border:1px solid #d8b873;border-radius:13px;background:#072c25;flex-shrink:0;padding:8px 0;text-align:center}.dashboard>div+div{border-left:1px solid #ffffff25}.dashboard span{display:block;font-size:.62rem;letter-spacing:.08em;color:#dfc38a}.dashboard strong{display:block;font-size:1.35rem;font-variant-numeric:tabular-nums}.scores{display:flex;gap:5px;justify-content:center;flex-shrink:0;font-size:.7rem}.scores span{padding:3px 8px;border:1px solid #ffffff25;border-radius:6px}.scores .active{border-color:#e5cb8f}#objective{text-align:center;font-size:.82rem;margin:2px 0;flex-shrink:0}.arena{flex:1;position:relative;min-height:0;min-width:0;width:100%;overflow:hidden}.arena canvas{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);touch-action:none;user-select:none;max-width:100%;max-height:100%}#message{text-align:center;font-size:.83rem;color:#f4deb0;margin:2px 0;min-height:2.5em;line-height:1.3;flex-shrink:0}.actions{display:flex;justify-content:center;gap:10px;align-items:center;flex-shrink:0}.actions label{display:flex;align-items:center;gap:5px;font-size:.8rem}input{accent-color:#dfc38a}.actions input{width:18px;height:18px}footer{flex-shrink:0;text-align:center;font-size:.68rem;color:#d3d7be}footer span{font-size:.58rem}dialog{border:1px solid #d9bf80;border-radius:20px;background:#0c4134;color:#f7f7ec;padding:24px;max-width:480px;width:calc(100% - 30px);max-height:90svh;overflow:auto;overscroll-behavior:contain;touch-action:pan-y}dialog::backdrop{background:#001e19bd;backdrop-filter:blur(5px)}h2{margin:0 0 10px}dialog p,li{font-size:.94rem;line-height:1.5}dialog label{display:block;margin:13px 0}select{display:block;width:100%;margin-top:6px;background:#10362c}.primary{width:100%;background:#e5cb8f;color:#17372a;font-weight:700;border:0;margin:8px 0}.note{font-size:.78rem;color:#d3d7be}.station-link{display:block;text-align:center;padding:12px;margin:14px 0;border:1px solid #d6c494;border-radius:12px;text-decoration:none;font-weight:700}input[type=range]{width:100%;margin-top:10px}@media(max-width:540px){header{display:block}header small{display:none}header h1{text-align:center}header nav{justify-content:center;margin:5px 0}header nav button{font-size:.72rem;padding:5px 12px}.route{font-size:.58rem}.dashboard{padding:5px 0}.dashboard strong{font-size:1.1rem}.dashboard span{font-size:.57rem}main{padding:7px 8px max(7px,env(safe-area-inset-bottom))}.actions{gap:7px}.actions button{font-size:.8rem;padding:7px 10px}#message{font-size:.75rem}#objective{font-size:.73rem}}
