.drone-shell { padding-top: 32px; }
.drone-heading { margin-bottom: 24px; }
.drone-heading h1 { font-size: clamp(36px, 7vw, 76px); letter-spacing: -.06em; line-height: 1; margin: 14px 0; }
.drone-heading em { color: #68efd3; font-style: normal; }
.drone-heading p { color: #aebfc9; }
.drone-arena { --fullscreen-ratio: .6666667; background: #091626 !important; }
.drone-stage { background: radial-gradient(ellipse, #18273c, #060e1c 75%); }
#battlefield { touch-action: none; cursor: crosshair; border: 1px solid #314858; outline-offset: -3px; }
#battlefield:focus-visible { outline: 2px solid #b8ffc4; }
.drone-hud strong { color: #eaf7f2; }
.drone-arena .drone-hud > div:first-child { border-color: #57baaa !important; background: #153331 !important; }
#time, #integrity { color: #72f5d7; }
.drone-arena .drone-hud > div { padding-inline: 4px !important; }
.drone-arena .drone-hud strong { font-size: clamp(12px, 2.8vw, 23px) !important; }
.drone-outcome { position: absolute; z-index: 2; top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(88%, 350px); padding: clamp(12px, 3vh, 28px); border: 1px solid #67edd299; border-radius: 12px; text-align: center; background: #0b1b2af5; box-shadow: 0 20px 80px #000a; pointer-events: none; }
.drone-outcome[hidden] { display: none; }
.drone-outcome h2 { font-size: clamp(18px, 4vh, 30px); margin: 6px 0; }
.drone-outcome > strong { font: 700 clamp(26px, 7vh, 54px) monospace; color: #82ffe2; }
.drone-outcome p { color: #bed0da; margin: 7px 0; font-size: 13px; }
.drone-notice { flex: 0 0 auto; order: 3; margin: 0; font-size: 12px; line-height: 1.3; color: #d7ece7; }
.drone-notice:empty { display: none; }
.drone-arena #finish { order: 4; flex: 0 0 auto; max-height: 28vh; overflow: auto; }
.drone-arena #save-status { display: block !important; font-size: 12px; margin: 4px 0; }
.drone-rankings { max-width: 900px; margin: 48px auto; }
.drone-rankings h2 { font-size: clamp(26px, 5vw, 42px); margin: 10px 0 20px; letter-spacing: -.045em; }
.drone-rankings ol { padding: 0; list-style: none; }
.drone-rankings li { display: flex; gap: 12px; align-items: center; padding: 13px 10px; border-bottom: 1px solid #34433f; }
.drone-rankings li > span:not(.ranking-cup) { overflow-wrap: anywhere; }
.drone-rankings li strong { margin-left: auto; white-space: nowrap; color: #8bf5d7; }
.drone-footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding-block: 25px; color: #a6bcb7; font-size: 13px; }
@media (max-width: 380px) { .drone-arena .drone-hud { gap: 3px !important; } .drone-arena .drone-hud > div > span { font-size: 7px !important; } .drone-arena .drone-hud strong { font-size: 11px !important; } }
@media (orientation: landscape) and (max-height: 540px) { .drone-outcome { padding: 8px 16px; } .drone-outcome .eyebrow, #final-record { display: none; } .drone-outcome p { margin: 3px 0; } }
@media (prefers-reduced-motion: reduce) { .drone-arena *, .drone-arena *::before { animation: none !important; transition: none !important; } }

/* Rotate only the presentation: world coordinates and seeded rules stay unchanged. */
@media (orientation: landscape) { .drone-arena { --fullscreen-ratio: 1.5 !important; } }
