/* Local tokens and selectors never recolor or restyle the historical interface. */
.legacy-controls, .exo-dialog--legacy {
  --background: #0b1020; --surface: #151b2c; --text: #f4efe5; --muted: #b4b2c1; --accent: #c9a5b2; --line: #3f4051;
  --sans: Inter, system-ui, sans-serif; --serif: "Exo Editorial", Georgia, serif; --mono: ui-monospace, Consolas, monospace;
  color-scheme: dark;
}
.legacy-controls[data-theme="day"], .exo-dialog--legacy[data-theme="day"] {
  --background: #f4f0e8; --surface: #f9f6f0; --text: #202431; --muted: #55515d; --accent: #8f3149; --line: #bab1b3;
  color-scheme: light;
}
body[data-legacy] { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
.legacy-controls { position: fixed; z-index: 110; right: max(20px, env(safe-area-inset-right)); bottom: max(20px, env(safe-area-inset-bottom)); display: flex; overflow: hidden; border: 1px solid var(--line); border-radius: 4px; background: var(--background); color: var(--text); box-shadow: 0 6px 24px #0003; }
.legacy-controls :is(button, a) { box-sizing: border-box; display: inline-flex; justify-content: center; align-items: center; min-width: 62px; min-height: 44px; margin: 0; padding: 8px 12px; border: 0; border-radius: 0; background: transparent; color: var(--text); font: 400 11px/1.5 var(--sans); letter-spacing: .08em; text-decoration: none; cursor: pointer; transition: color 250ms; }
.legacy-controls a { border-left: 1px solid var(--line); }
.legacy-controls :is(button, a):hover { color: var(--accent); }
.legacy-controls :focus-visible { outline: 2px solid var(--accent); outline-offset: -4px; }
.legacy-controls button:disabled { opacity: .5; cursor: default; }
dialog.exo-dialog--legacy { border-top: 2px solid var(--accent); }
.exo-dialog--legacy .legacy-caption { color: var(--accent); font: 400 10px/1.6 var(--mono); letter-spacing: .12em; }
.exo-dialog--legacy .legacy-info-copy { white-space: pre-line; }
.exo-dialog--legacy [data-legacy-status] { padding-top: 16px; border-top: 1px solid var(--line); font-size: 12px; }
.exo-dialog--legacy .legacy-return { margin-top: 12px; }
@media (max-width: 540px) { .legacy-controls { right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); } }
@media (prefers-reduced-motion: reduce) { .legacy-controls * { transition: none; } }