#starArena .starShell{max-width:1100px;margin:auto}
#starArena .starHero{border:1px solid var(--gg-gold-border);background:var(--gg-gold-bg);box-shadow:var(--gg-gold-shadow);padding:24px;border-radius:12px;position:relative;overflow:hidden}
#starArena .starHero:after{content:"";position:absolute;width:240px;height:240px;border:1px solid #d6aa3a20;border-radius:50%;right:-90px;top:-100px;pointer-events:none}
#starArena .starHero h2{font-size:clamp(26px,5vw,40px);letter-spacing:-1px}
#starArena .starHero .sub{max-width:620px;line-height:1.6}
#starArena .starHud{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:8px 0}
#starArena .starHudItem{padding:9px 5px;background:#14171c;border:1px solid #ffffff10;border-radius:6px;min-width:0;text-align:center}
#starArena .starHudItem small{font-size:9px;letter-spacing:1px;color:#a2a7ae;display:block}
#starArena .starHudItem b{font-size:20px;color:#f5f5f3;font-variant-numeric:tabular-nums}
#starArena .starGameLayout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:12px;align-items:start}
#starArena .starCanvasBox{position:relative;aspect-ratio:1;width:100%;max-width:min(100%,calc(100dvh - 320px));margin:0 auto;border:1px solid var(--gg-gold-border);border-radius:8px;overflow:hidden;background:#080a0d}
#starArena #starCanvas{display:block;width:100%;height:100%;aspect-ratio:1;touch-action:none}
#starArena .starArenaBar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;align-items:center;margin-top:8px;font-size:11px;color:#a2a7ae}
#starArena .starArenaBar b{color:#69dfa2;font-size:10px;letter-spacing:1px}
#starArena .starArenaBar b.offline{color:#ffa569}
#starArena .starPrize{border-bottom:1px solid #ffffff12;padding-bottom:12px;margin-bottom:12px}
#starArena .starPrize small{display:block;color:#a2a7ae;font-size:10px;letter-spacing:1px}
#starArena .starPrize b{display:block;color:#d6aa3a;font-size:28px;line-height:1.5}
#starArena .starPilot{display:flex;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid #ffffff09;min-width:0}
#starArena .starPilot img{height:30px;width:30px;object-fit:cover;border-radius:7px;flex-shrink:0}
#starArena .starPilot>div{flex:1;min-width:0}
#starArena .starPilot b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
#starArena .starPilot small{display:block;color:#a2a7ae;font-size:9px}
#starArena .starPilot strong{text-align:center;font-size:15px}
#starArena .starPilot.me b{color:#d6aa3a}
#starArena .starPilot.out{opacity:.55}
#starArena #starStandings{max-height:280px;overflow:auto;margin-top:8px!important}
#starArena .starControlDeck{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}
#starArena .starStick{display:none;position:relative;flex-shrink:0;width:100px;height:100px;border:1px solid #d6aa3a50;background:radial-gradient(circle,#26323b,#10151c);border-radius:50%;touch-action:none}
#starArena .starStick:before{content:"";position:absolute;inset:28px;background:#d6aa3a;border:3px solid #efda9b70;border-radius:50%;transform:translate(var(--sx,0px),var(--sy,0px));pointer-events:none}
#starArena .starActions{display:flex;gap:8px;flex:1;justify-content:flex-end}
#starArena .starActions button{min-height:48px;touch-action:none;user-select:none;min-width:76px;font-size:11px}
#starArena button.pressed{filter:brightness(1.2);transform:translateY(1px)}
#starArena .starTools{display:flex;gap:8px;margin-top:12px}
#starArena .starTools button{flex:1;min-height:40px;font-size:11px}
#starArena .starKeyHelp{font-size:11px;line-height:1.7;color:#a2a7ae;margin-top:10px}
#starArena button:focus-visible{outline:2px solid #d6aa3a;outline-offset:3px}
@media(pointer:coarse){#starArena .starStick{display:block}#starArena .starKeyHelp{display:none}}
@media(max-width:720px){
 #starArena .starHero{padding:18px}#starArena .starGameLayout{grid-template-columns:minmax(0,1fr)}
 #starArena .starCanvasBox{max-width:100%;width:100%}#starArena .starGameLayout>.panel{padding:12px}
 #starArena .starHud{gap:3px}#starArena .starHudItem{padding:7px 2px}#starArena .starHudItem b{font-size:16px}#starArena .starHudItem small{font-size:7px;letter-spacing:0}
 #starArena .starStick{display:block;width:88px;height:88px}#starArena .starStick:before{inset:24px}
 #starArena .starKeyHelp{display:none}#starArena .starActions button{min-height:58px;min-width:86px}
 #starArena .starPrize{display:flex;align-items:center;justify-content:space-between;padding-bottom:7px;margin-bottom:4px}
 #starArena .starPrize b{font-size:22px}#starArena #starStandings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px;max-height:190px}
 #starArena .starPilot img{width:24px;height:24px}#starArena .starPilot b{font-size:10px}
}
@media(prefers-reduced-motion:reduce){#starArena *{animation:none!important;transition:none!important}}

#starArena #starCanvas{cursor:crosshair}
#starArena .starStick:after{content:"MOVER";position:absolute;left:0;right:0;bottom:5px;text-align:center;font-size:9px;font-weight:700;color:#e7d49e;pointer-events:none}
#starArena .starAimStick:after{content:"MIRAR / ATIRAR"}
#starArena .starAimStick:before{background:#65cee6;border-color:#bbf2ff80}
@media(pointer:coarse),(max-width:720px){
 #starArena #starFire{display:none}
 #starArena .starControlDeck{justify-content:space-between;gap:8px}
 #starArena .starActions{flex:0 1 auto;min-width:0}
 #starArena #starDash{min-width:0;padding:12px 9px;font-size:11px}
}

/* Cockpit: neutral surfaces, gold accents and a larger readable playfield. */
#starArena .starShell{max-width:1200px}
#starArena .starFlightHeader{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 12px}
#starArena .starFlightHeader small{display:block;color:#a2a7ae;font-size:9px;letter-spacing:1.4px}
#starArena .starFlightHeader h2{margin:3px 0 0;font:700 24px 'Space Grotesk',system-ui;letter-spacing:2px}
#starArena .starTelemetry{display:flex;gap:16px;text-align:right;flex-shrink:0}
#starArena .starTelemetry b{display:block;font-size:12px;color:#d6aa3a;font-variant-numeric:tabular-nums;margin-top:4px}
#starArena .starHud{gap:5px;margin:0 0 10px}
#starArena .starHudItem{border-radius:8px;border-top:2px solid #ffffff20;padding:6px 4px}
#starArena .starHudItem:first-child{border-top-color:#69dfa2}
#starArena .starHudItem:nth-child(2){border-top-color:#60d6ed}
#starArena .starHudItem:nth-child(5){border-top-color:#d6aa3a}
#starArena .starHudItem b{font-size:18px}
#starArena .starHudItem small{letter-spacing:.5px}
#starArena .starGameLayout{grid-template-columns:minmax(0,1fr) 235px;gap:16px}
#starArena .starCanvasBox{max-width:min(100%,calc(100dvh - 290px));border-radius:12px;border-color:var(--gg-gold-border);box-shadow:var(--gg-gold-shadow)}
#starArena .starGameLayout>.panel{background:var(--gg-gold-bg);border:1px solid var(--gg-gold-border);border-radius:12px;padding:14px}
#starArena .starArenaBar{font-size:10px;gap:6px;padding:4px 0}
#starArena #starPhase{color:#f5f5f3}
#starArena .starPilot{border-radius:6px;padding:10px 3px}
#starArena .starPilot.me{background:#d6aa3a0d}
#starArena .starPilot small{line-height:1.5}
#starArena .starPrize b{font-size:25px}
#starArena .starStick{border-width:2px}
#starArena .starAimStick{border-color:#60d6ed70}
@media(max-width:720px){
 #starArena .starFlightHeader{margin-bottom:8px;gap:8px}
 #starArena .starFlightHeader h2{font-size:19px;letter-spacing:1px}
 #starArena .starFlightHeader small{font-size:8px;letter-spacing:.5px}
 #starArena .starTelemetry{gap:9px}
 #starArena .starTelemetry b{font-size:10px}
 #starArena .starHudItem{padding:5px 1px}
 #starArena .starHudItem b{font-size:15px}
 #starArena .starHudItem small{font-size:7px}
 #starArena .starGameLayout{grid-template-columns:minmax(0,1fr);gap:12px}
 #starArena .starCanvasBox{width:100%;max-width:100%}
 #starArena .starPilot{padding:6px 3px}
 #starArena .starControlDeck{margin-top:8px}
}