:root{color-scheme:dark;font-family:Inter,system-ui,Arial,sans-serif;color:#dfebec;background:#081820}*{box-sizing:border-box}body{margin:0}header{padding:18px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #29414a;background:#102630}small,.kicker{color:#6ed5c8;font-size:10px;font-weight:750;letter-spacing:.18em}h1{font-size:25px;margin:5px 0 0}h1 span{font-weight:400;color:#91aeb8;font-size:18px}.badge{font-size:10px;letter-spacing:.1em;color:#edc56c;border:1px solid #846c39;border-radius:40px;padding:9px 12px}main{display:grid;grid-template-columns:minmax(0,1fr) 320px;min-height:calc(100vh - 121px)}.stage{position:relative;min-height:670px;height:calc(100vh - 121px);overflow:hidden}canvas{width:100%;height:100%;display:block;outline:none;touch-action:none}.overlay{position:absolute;top:20px;left:22px;right:22px;pointer-events:none;display:flex;flex-direction:column;gap:7px;text-shadow:0 2px 4px #000}.overlay b{font-size:18px}.overlay span{font-size:12px;color:#bcd1d9}#notice{position:absolute;bottom:94px;left:22px;max-width:calc(100% - 44px);padding:9px 12px;border:1px solid #54727a;background:#102630df;font-size:12px;border-radius:5px;pointer-events:none}.touch{display:flex;gap:9px;position:absolute;bottom:24px;left:22px}.touch button{background:#112933d9;min-width:52px}aside{padding:21px;max-height:calc(100vh - 121px);overflow:auto;background:#0e2029;border-left:1px solid #29414a}label{display:block;color:#a8c2c9;font-size:12px;margin:15px 0 7px}button,select{font:inherit;font-size:13px;color:#e0eef0;background:#18343e;border:1px solid #365963;min-height:44px;padding:9px 12px;border-radius:5px;cursor:pointer;width:100%}button:hover{background:#25505a}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,select:focus-visible{outline:2px solid #ffca6e;outline-offset:2px}button.active{border-color:#72e0cd;color:#72e0cd}.buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}#reset,#auto,#autoOverride{margin-top:9px}input[type=range]{width:100%;min-height:44px}.metric{padding:17px 0 5px;color:#82d3c9;font-size:14px}.metric strong{font-size:36px;letter-spacing:-.03em}.metric span{display:block;color:#a3b9bf;font-size:12px;margin-top:6px}.help,p{font-size:12px;line-height:1.6;color:#a6c0c8}.warning{color:#e5bf73}details{border-top:1px solid #2b454e;padding-top:15px;margin-top:18px}summary{min-height:38px;font-size:14px;font-weight:700;cursor:pointer}.bridge-row{padding:10px 0;border-bottom:1px solid #29414a;font-size:12px}.bridge-row button{margin-top:6px}footer{height:34px;padding:10px 24px;font-size:10px;color:#93afb8;border-top:1px solid #29414a}@media(max-width:850px){header{padding:14px;align-items:flex-start;gap:8px}.badge{max-width:130px;text-align:center;font-size:8px}h1{font-size:21px}h1 span{font-size:14px}main{display:block}.stage{height:65vh;min-height:390px}aside{max-height:none;border-left:0}.overlay{left:14px;top:14px}.overlay span{font-size:10px}.touch{left:14px;bottom:14px}footer{height:auto;line-height:1.5}.metric span{display:inline-block;margin-left:14px}select{font-size:16px}#notice{left:14px;bottom:78px;font-size:10px}}
.touch{width:calc(100% - 44px);max-width:410px;gap:6px}.touch button{flex:1;min-width:0;font-size:11px;padding:8px 5px}

.air-controls{position:absolute;bottom:24px;right:22px;display:flex;gap:6px}.air-controls[hidden]{display:none}.air-controls button{min-width:70px;font-size:11px;padding:8px}.air-controls{bottom:126px}#vehicleHelp{color:#e5bf73}

.dock-nav{display:flex;flex-wrap:wrap;gap:6px;padding:6px 14px;background:#102630;border-bottom:1px solid #31505c}.dock-nav a{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;color:#91e5d9;font:14px system-ui;text-decoration:none;border:1px solid #365963;border-radius:5px}.dock-nav a:focus-visible{outline:3px solid #ffca6e}select,input{font-size:16px!important}button,summary{min-height:44px}
@media(min-width:851px){body{display:flex;flex-direction:column;height:100dvh;overflow:hidden}header,.dock-nav,footer{flex-shrink:0}main{flex:1;min-height:0;height:auto}main>.viewport,main>.stage,main>section{min-height:0;height:auto}aside{min-height:0;height:auto;max-height:none;overflow:auto}}

#playHud{position:absolute;left:14px;right:14px;top:86px;padding:10px;background:#102630e8;color:#ffe29a;font-size:14px;pointer-events:none;border:1px solid #9c8552;border-radius:6px}#playHud[hidden],#playPanel[hidden]{display:none}#playPanel p{font-size:12px}#playPanel button{margin-top:8px}

#gunPanel input{width:100%;min-height:44px;background:#18343e;color:#e0eef0;border:1px solid #365963;padding:9px;border-radius:5px}#gunPanel button{margin-top:8px}#gunStatus{color:#ffe29a}

#gunScore{display:block;margin:12px 0;color:#ffe29a;font-size:13px;line-height:1.6}

.touch button,.air-controls button{touch-action:none;user-select:none}#nativeTouchFire[hidden]{display:none}#nativeTouchFire{border-color:#dfb75e;color:#ffe29a}.touch:has(#nativeTouchFire:not([hidden])){max-width:500px}
@media(max-width:850px){.touch:has(#nativeTouchFire:not([hidden])){display:grid;grid-template-columns:repeat(3,1fr);width:calc(100% - 28px);max-width:410px}.stage:has(#nativeTouchFire:not([hidden])) #notice{bottom:210px}.stage:has(#nativeTouchFire:not([hidden])) .air-controls{bottom:120px;right:14px}}
