/* Direction: Test Night — midnight indigo stage, a single warm signal-amber spotlight */
/* Completed by the platform from the short form: both modes, every
   palette token, each text-on-ground pair at its floor. To restyle, write the
   short form again (the decisions in one :root) and it is completed again. */

:root {
  color-scheme: dark;
  --canvas: #0e1022;
  --surface: #171a33;
  --surface-2: #1f2344;
  --border: #2d3260;
  --border-strong: #565864;
  --ink: #f3f1ea;
  --muted: #a9acc9;
  --accent: #ffb23e;
  --accent-hover: #ffbe5b;
  --accent-ink: #0e1022;
  --accent-text: #ffc15f;
  --accent-strong: #ffb23e;
  --accent-soft: #433428;
  --accent-border: #7a592f;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #102928;
  --success-strong: #499c68;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #331f1d;
  --warning-strong: #c57a40;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #341321;
  --danger-strong: #d16969;
  --chart-1: #ffb23e;
  --chart-2: #96d266;
  --chart-3: #28c2bf;
  --chart-4: #8fc2fe;
  --chart-5: #c888eb;
  --chart-6: #fca0aa;

  --font-display: "Bricolage Grotesque", "Inter", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --display-weight: 800;
  --display-tracking: -0.03em;
  --radius-card: 20px;
  --radius-btn: 999px;
  --radius-input: 12px;
  --x-glow: #ffb23e;
  --font-sans: "Inter", system-ui, sans-serif;
  --eyebrow-tracking: 0.08em;
}

html[data-theme="light"] {
  color-scheme: light;
  --canvas: #ffffff;
  --surface: #ffffff;
  --surface-2: #f3f3f4;
  --border: #dddee0;
  --border-strong: #b7b7bd;
  --ink: #0e1022;
  --muted: #656770;
  --accent: #ffb23e;
  --accent-hover: #d99735;
  --accent-ink: #0e1022;
  --accent-text: #8f6422;
  --accent-strong: #8f6422;
  --accent-soft: #fff4e4;
  --accent-border: #ffdca8;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #e3f0e8;
  --success-strong: #137638;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #f6eae1;
  --warning-strong: #a64c08;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #f7e4e4;
  --danger-strong: #b91c1c;
  --chart-1: #c18321;
  --chart-2: #6c9c45;
  --chart-3: #1b8b88;
  --chart-4: #5496df;
  --chart-5: #915dad;
  --chart-6: #dc7482;
}

.stage {
  background:
    radial-gradient(60rem 28rem at 85% -10%, color-mix(in srgb, var(--x-glow) 22%, transparent), transparent 70%),
    radial-gradient(40rem 24rem at -10% 20%, color-mix(in srgb, var(--accent-text) 8%, transparent), transparent 70%);
}
@keyframes pulse-dot { 0%,100% { transform: scale(1); opacity: 1 } 50% { transform: scale(1.5); opacity: .55 } }
.live-dot { animation: pulse-dot 2s ease-in-out infinite; }
html.reduced-motion .live-dot { animation: none; }
@keyframes pop-in { from { transform: translateY(14px) scale(.96) } to { transform: none } }
.pop-in { animation: pop-in .5s cubic-bezier(.2,.8,.2,1); }
html.reduced-motion .pop-in { animation: none; }
.htmx-request .btn[type="submit"] { opacity: .7; pointer-events: none; }