/* Shared shell for the standalone simulation pages. Load after their own styles. */
html.dark { --teal: #62d0ce; --border: #3b4a57; color: #edf1ef; background: #172230; color-scheme: dark; }
html.dark body { color: #edf1ef; background: #172230; }
html.dark :is(.panel, .plot, .stage, .card, .note) { background: #202d3b; border-color: #3b4a57; }
html.dark :is(p, .small, .unit, .badge, .limits, .timeends, .status, footer, .stat span, .stat small, .flightstats span) { color: #b8c9d3; }
html.dark :is(input[type=number], select, button) { color: #edf1ef; background: #283949; border-color: #637c8d; }
html.dark .temp input { color: #edf1ef; }
html.dark button:hover { background: #344c5c; }
html.dark button.primary { color: #102530; background: #62d0ce; border-color: #62d0ce; }
html.dark .notice { background: #203f46; color: #d5f1ef; }
html.dark .equation { color: #edf1ef; }
html.dark .stat { border-color: #45606c; }
html.dark .key .v { color: #62d0ce; }
html.dark .key .vx { color: #85b8ff; }
html.dark .key .vy { color: #ffb47b; }
html.dark .key .a { color: #c6a1fa; }
.simulation-theme-toggle { margin-left: auto; padding: 8px 12px; min-height: 40px; border: 1px solid #81969a; border-radius: 7px; font: 600 12px system-ui, sans-serif; background: transparent; color: inherit; cursor: pointer; flex-shrink: 0; }
.simulation-theme-toggle:focus-visible { outline: 3px solid #c8892c; outline-offset: 3px; }
@media(max-width:540px) { header { flex-wrap: wrap; } header .badge { display: none; } }