/* Midnight skyline and clear cyan/gold flight cues, scoped to this route. */
body[data-mini="swing"] { --accent: #70f2ed; --surface: #103247; background: #061321; }
body[data-mini="swing"] .mini-stage { border-color: #5899ad; box-shadow: 0 0 0 1px #030b14, inset 0 1px #b1f7ff25; }
body[data-mini="swing"] .mini-hud { background: linear-gradient(#071a2af5, #071a2adb 70%, #071a2a00); }
body[data-mini="swing"] .mini-hud > span:first-child { border-color: #ffda8247; background: #102f43e6; }
body[data-mini="swing"] .mini-hud button { border-color: #79e3e747; background: #173a4e; }
body[data-mini="swing"] .mini-buddy { border-color: #5899ad; border-top-color: #6bbed328; background: linear-gradient(110deg, #153e50, #091b2b); }
body[data-mini="swing"] .buddy-talk { border: 0; background: transparent; padding-inline: 3px; }
body[data-mini="swing"] .mini-overlay { background: #03101c99; }
body[data-mini="swing"] .mini-panel { border-color: #77dfe078; background: radial-gradient(ellipse at 50% 0, #20546a, #0b2032 78%); box-shadow: inset 0 1px #c6ffff40, 0 18px 50px #0008; }
body[data-mini="swing"] .mini-hero::before { border-color: #79efed8c; box-shadow: 0 0 0 10px #70f2ed08, 0 0 0 11px #70f2ed20; }
body[data-mini="swing"] .cast-choice { border-radius: 50%; background: linear-gradient(145deg,#245b70,#091c2f); }
body[data-mini="swing"] .cast-choice[aria-pressed="true"] { border-color: #ffe3a0; background: #426068; box-shadow: 0 0 0 2px #ffda8230, inset 0 1px #fff5; }
body[data-mini="swing"] .mini-play { width: 94px; border-radius: 28px; background: linear-gradient(145deg,#fff0bc,#edb959); }
body[data-mini="swing"] .mini-hint { color: #c1dde5; }

/* Loop 1: reserve vertical space for the flight, keep HUD targets usable. */
body[data-mini="swing"] .mini-shell { padding: 0 2px env(safe-area-inset-bottom, 0px); }
body[data-mini="swing"] .mini-buddy { height: 44px; gap: 5px; padding-inline: 5px; }
body[data-mini="swing"] .buddy-portrait { align-self: center; width: 42px; height: 42px; margin-top: 0; }
body[data-mini="swing"] .buddy-talk { padding-block: 4px; }
body[data-mini="swing"] .buddy-badge { color: #ffe1a1; font-size: 11px; }
body[data-mini="swing"] .mini-hud { gap: 6px; padding-block: 0; }
body[data-mini="swing"] .mini-hud button { width: 44px; height: 43px; border-radius: 0 0 12px 12px; }
body[data-mini="swing"] .mini-hud > span:first-child { min-width: 84px; }
body[data-mini="swing"] .mini-overlay { padding: 10px; }

/* Loop 4: a clear action and a compact flight debrief. */
body[data-mini="swing"] .mini-panel-state { margin: 0; color: #98e3e9; font-size: 12px; font-weight: 750; letter-spacing: .12em; }
body[data-mini="swing"] .mini-result-details { margin: 0; padding: 8px 10px; border-block: 1px solid #70f2ed26; color: #dbedf0; font-size: 12px; font-variant-numeric: tabular-nums; text-align: center; }
body[data-mini="swing"] .mini-play { display: flex; justify-content: center; gap: 9px; width: 100%; min-height: 48px; border-radius: 14px; font-size: 15px; font-weight: 800; }
body[data-mini="swing"] .mini-play svg { width: 20px; height: 20px; }
body[data-mini="swing"] .mini-next { min-height: 44px; }
body[data-mini="swing"] [data-mode="result"] .mini-panel { gap: 9px; }
body[data-mini="swing"] [data-mode="result"] .mini-panel-state { color: #ffe4a4; }
body[data-mini="swing"] [data-mode="result"] .mini-hero { height: 96px; }
body[data-mini="swing"] [data-mode="result"] .panel-portrait { width: 100px; height: 100px; }
body[data-mini="swing"] [data-mode="result"] .mini-hero::before { width: 86px; height: 86px; }
body[data-mini="swing"] [data-mode="result"] .mini-hero::after { display: none; }

/* Loop 5: keep the replay action nearer on short portrait screens. */
body[data-mini="swing"] .mini-play { height: 48px; }
body[data-mini="swing"] .mini-overlay { backdrop-filter: none; }
@media (max-height: 740px) {
    body[data-mini="swing"] [data-mode="result"] .mini-hero { display: none; }
    body[data-mini="swing"] [data-mode="result"] .mini-panel { gap: 8px; padding: 12px; }
}
@media (max-height: 650px) {
    body[data-mini="swing"] .mini-buddy { height: 40px; }
    body[data-mini="swing"] .buddy-portrait { width: 38px; height: 38px; }
    body[data-mini="swing"] .buddy-talk { padding-inline: 0; }
}

/* One brief shower on a major result, never during flight. */
body[data-mini="swing"] .swing-celebration { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
body[data-mini="swing"] .swing-celebration span { position: absolute; top: -32px; left: 8%; font-size: 21px; opacity: 0; }
body[data-mini="swing"] .swing-celebration span:nth-child(2) { left: 20%; animation-delay: .12s; }
body[data-mini="swing"] .swing-celebration span:nth-child(3) { left: 33%; animation-delay: .24s; }
body[data-mini="swing"] .swing-celebration span:nth-child(4) { left: 45%; animation-delay: .08s; }
body[data-mini="swing"] .swing-celebration span:nth-child(5) { left: 57%; animation-delay: .2s; }
body[data-mini="swing"] .swing-celebration span:nth-child(6) { left: 69%; animation-delay: .04s; }
body[data-mini="swing"] .swing-celebration span:nth-child(7) { left: 81%; animation-delay: .16s; }
body[data-mini="swing"] .swing-celebration span:nth-child(8) { left: 91%; animation-delay: .28s; }
body[data-mini="swing"] .swing-celebrate .swing-celebration span { animation-name: swing-result-stars; animation-duration: 1.2s; animation-fill-mode: both; animation-timing-function: ease-out; }
@keyframes swing-result-stars { 0% { opacity: 0; transform: translateY(0) rotate(-12deg); } 15% { opacity: .85; } 100% { opacity: 0; transform: translateY(190px) rotate(34deg); } }
@media (prefers-reduced-motion: reduce) { body[data-mini="swing"] .swing-celebration { display: none; } }

/* Route progress shares the existing 43px toolbar; no extra playfield band. */
body[data-mini="swing"] .mini-hud > span:first-child { flex-shrink: 0; }
body[data-mini="swing"] .mini-hud button { flex-shrink: 0; }
body[data-mini="swing"] .swing-progress { flex: 1; min-width: 0; max-width: 200px; color: #f3e2b5; }
body[data-mini="swing"] .swing-distance { display: block; font-size: 11px; font-weight: 750; text-align: center; font-variant-numeric: tabular-nums; white-space: nowrap; }
body[data-mini="swing"] .swing-progress-track { display: flex; align-items: center; gap: 4px; height: 12px; }
body[data-mini="swing"] .swing-progress-track > span { font-size: 12px; line-height: 1; color: #ffda82; }
body[data-mini="swing"] #route-progress { appearance: none; display: block; flex: 1; width: 0; min-width: 0; height: 5px; border: 0; border-radius: 3px; overflow: hidden; background: #4e748180; color: #ffda82; }
body[data-mini="swing"] #route-progress::-webkit-progress-bar { background: #4e748180; border-radius: 3px; }
body[data-mini="swing"] #route-progress::-webkit-progress-value { background: #ffda82; border-radius: 3px; }
body[data-mini="swing"] #route-progress::-moz-progress-bar { background: #ffda82; border-radius: 3px; }
