:root{color-scheme:dark;font-family:Arial,sans-serif;color:#e6efef;background:#09191e}*{box-sizing:border-box}body{margin:0}header{display:flex;justify-content:space-between;gap:20px;padding:24px 4%;border-bottom:1px solid #294348}a{color:#bde8dc;text-decoration:none}nav{display:flex;gap:24px}main{max-width:1500px;margin:auto;padding:28px 4%}h1,h2{font-family:Georgia,serif;font-weight:400}h1{font-size:44px;margin:10px 0}h2{font-size:30px}small{color:#d5bd84;font-size:10px;letter-spacing:2px}p{color:#aebfc3;line-height:1.7;font-size:13px}button,select{font:inherit;color:#e4f2ed;background:#173139;border:1px solid #526867;padding:13px 18px;cursor:pointer}button:hover{border-color:#dfc486;background:#25444b}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid #efcd80;outline-offset:3px}.intro{display:flex;align-items:center;gap:25px;margin-bottom:24px}.intro>div{flex:1}#begin,#upgrade{background:#d0b77f;color:#10232b}.arena{position:relative;border:1px solid #3b5358;background:#132c35;overflow:hidden}canvas{width:100%;height:min(70vh,760px);min-height:420px;display:block;touch-action:none}.hud{position:absolute;top:22px;left:24px;right:24px;display:flex;justify-content:space-between;pointer-events:none}.hud>div{display:flex;flex-direction:column;gap:10px;text-shadow:0 2px 6px #000}.hud>div:last-child{align-items:flex-end}.hud button,.hud label{pointer-events:auto}.hud label{font-size:11px}.hud strong{font-size:16px}.hud span{font-size:12px}progress{height:6px;accent-color:#a0e0cc;width:180px}.reticle{position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);font-size:35px;color:#e1faf1;pointer-events:none;text-shadow:0 0 10px #10353c}.abilities{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:8px;white-space:nowrap}.abilities button{background:#102731e8;font-size:12px}#overlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;padding:28px;background:#091f29ed;border:1px solid #7c8471;width:min(90%,480px)}#overlay[hidden]{display:none}.command{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:25px}.command h2{margin:10px 0}.help{border-top:1px solid #294248;margin-top:20px}@media(max-width:700px){header,nav{gap:12px;flex-wrap:wrap}.intro{flex-wrap:wrap}.intro>div{flex-basis:100%}h1{font-size:34px}canvas{min-height:480px}.hud{left:12px;right:12px}.abilities{width:96%;justify-content:center}.abilities button{padding:12px 7px;font-size:10px}.command{align-items:flex-start}.hud strong{font-size:13px}}