/* Instrument light theme scope (spec §3.5). Opt-in per element via
   data-theme="instrument". Legacy dark values at :root are untouched;
   this scope re-points the --gs-* aliases so existing var() consumers
   (guided.css ships via esbuild) light up inside the scope only. */
[data-theme="instrument"] {
  color-scheme: light;

  --gs-bg-base: #FFFFFF;
  --gs-bg-card: #F6F6F4;
  --gs-bg-card-hover: #EFEFEC;
  --gs-bg-input: #EFEFEC;
  --gs-bg-elevated: #FFFFFF;

  --gs-border: rgba(22, 24, 29, 0.10);
  --gs-border-hover: rgba(22, 24, 29, 0.16);
  --gs-border-focus: #2E5CFF;

  --gs-text-primary: #16181D;
  --gs-text-secondary: #5C6066;
  --gs-text-tertiary: #63676E;
  --gs-text-muted: #8B9096;

  --gs-accent-blue: #2E5CFF;
  --gs-accent-blue-hover: #1F4AE0;
  --gs-accent-green: #0E8345;
  --gs-accent-amber: #A16207;
  --gs-accent-red: #C4232B;
  --gs-accent-red-hover: #A81D24;
  --gs-accent-purple: #2E5CFF; /* purple retired in Instrument; alias to accent */

  --gs-action-primary: #16181D;
  --gs-action-primary-hover: #000000;
  --gs-action-primary-end: #16181D; /* legacy gradient endpoint — collapses the gradient */
  --gs-action-destructive: #C4232B;
  --gs-action-destructive-hover: #A81D24;
  --gs-action-disabled-bg: #E4E4E1;
  --gs-action-disabled-text: #8B9096;
  --gs-focus-ring: #2E5CFF;
  --gs-text-on-action: #FFFFFF;

  --gs-radius-sm: 4px;
  --gs-radius-md: 6px;
  --gs-radius-lg: 8px;
  --gs-radius-xl: 12px;

  --gs-transition: 150ms linear;
}

/* Cross-surface component overrides */

/* Instrument button overrides — scoped, so the dashboard's dark buttons
   are untouched. No lift; darken on hover, compress on press (spec §4.2). */
[data-theme="instrument"] .gs-btn-primary {
  background: var(--gs-action-primary);
  border-radius: var(--gs-radius-md);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  transform: none;
  box-shadow: none;
  transition: background var(--t-fast, 150ms) linear, transform var(--t-press, 80ms) linear;
}
[data-theme="instrument"] .gs-btn-primary:hover:not(:disabled) {
  background: var(--gs-action-primary-hover);
  transform: none;
  box-shadow: none;
}
[data-theme="instrument"] .gs-btn-primary:active:not(:disabled) {
  transform: scale(0.985);
}
[data-theme="instrument"] .gs-btn-secondary {
  background: transparent;
  color: var(--gs-text-primary);
  border: 1px solid var(--gs-border-hover);
  border-radius: var(--gs-radius-md);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  transition: border-color var(--t-fast, 150ms) linear, transform var(--t-press, 80ms) linear;
}
[data-theme="instrument"] .gs-btn-secondary:hover:not(:disabled) {
  border-color: var(--gs-text-secondary);
}
[data-theme="instrument"] .gs-btn-secondary:active:not(:disabled) {
  transform: scale(0.985);
}

/* --- Component overrides: legacy classes hardcode dark gradients/washes
       that alias re-pointing can't reach. Scoped, so builder/editor
       surfaces (no data-theme) are untouched. --- */
[data-theme="instrument"].gs-body,
[data-theme="instrument"] .gs-body {
  background: var(--gs-bg-card);
  background-attachment: scroll;
}

[data-theme="instrument"] .gs-sidebar {
  background: var(--gs-bg-base);
  border-right: 1px solid var(--gs-border);
}

[data-theme="instrument"] .gs-sidebar-nav-item--active {
  background: var(--gs-action-primary);
  color: var(--gs-text-on-action);
}

[data-theme="instrument"] .gs-card,
[data-theme="instrument"] .gs-card-static {
  background: var(--gs-bg-elevated);
  border: 1px solid var(--gs-border);
  border-radius: var(--gs-radius-lg);
  box-shadow: var(--shadow-e1, 0 1px 2px rgba(22, 24, 29, 0.05));
}

[data-theme="instrument"] .gs-card {
  transition: border-color var(--t-fast, 150ms) linear, box-shadow var(--t-fast, 150ms) linear,
              transform var(--t-fast, 150ms) linear;
}

[data-theme="instrument"] .gs-card:hover {
  background: var(--gs-bg-elevated);
  border-color: var(--gs-border-hover);
  transform: translateY(-1px);
  box-shadow: var(--shadow-e2, 0 4px 12px rgba(22, 24, 29, 0.08));
}

[data-theme="instrument"] .gs-card:active {
  transform: scale(0.985);
  transition-duration: var(--t-press, 80ms);
}

[data-theme="instrument"] .gs-card--blue,
[data-theme="instrument"] .gs-card--purple,
[data-theme="instrument"] .gs-card--amber,
[data-theme="instrument"] .gs-card--green,
[data-theme="instrument"] .gs-card--red {
  border-top: 1px solid var(--gs-border); /* accent top-borders retired: accent ≠ decoration */
}

[data-theme="instrument"] .gs-input:focus {
  border-color: var(--gs-border-focus);
  box-shadow: 0 0 0 3px rgba(46, 92, 255, 0.15);
}

[data-theme="instrument"] .gs-badge {
  border-radius: var(--gs-radius-sm);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}

[data-theme="instrument"] .gs-badge-blue   { color: var(--gs-accent-blue);  background: rgba(46, 92, 255, 0.08); }
[data-theme="instrument"] .gs-badge-green  { color: var(--gs-accent-green); background: rgba(14, 131, 69, 0.08); }
[data-theme="instrument"] .gs-badge-amber  { color: var(--gs-accent-amber); background: rgba(161, 98, 7, 0.08); }
[data-theme="instrument"] .gs-badge-red    { color: var(--gs-accent-red);   background: rgba(196, 35, 43, 0.08); }
[data-theme="instrument"] .gs-badge-purple { color: var(--gs-accent-blue);  background: rgba(46, 92, 255, 0.08); }

@media (prefers-reduced-motion: reduce) {
  [data-theme="instrument"] .gs-btn-primary,
  [data-theme="instrument"] .gs-btn-secondary {
    transition-duration: 1ms;
  }

  [data-theme="instrument"] .gs-btn-primary:active:not(:disabled),
  [data-theme="instrument"] .gs-btn-secondary:active:not(:disabled) {
    transform: none;
  }

  [data-theme="instrument"] .gs-card,
  [data-theme="instrument"] .gs-card:hover,
  [data-theme="instrument"] .gs-card:active {
    transition-duration: 1ms;
    transform: none;
  }
}

[data-theme="instrument"] .drawer-panel {
  transform: translateX(-100%);
  transition: transform var(--t-base, 250ms) var(--ease-in-out-mech, cubic-bezier(0.65, 0, 0.35, 1));
}
[data-theme="instrument"] .drawer-panel--open { transform: translateX(0); }
[data-theme="instrument"] .drawer-scrim {
  opacity: 0;
  transition: opacity var(--t-base, 250ms) linear;
}
[data-theme="instrument"] .drawer-scrim--open { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  [data-theme="instrument"] .drawer-panel, [data-theme="instrument"] .drawer-scrim { transition-duration: 1ms; }
}

[data-theme="instrument"] .stat-tile {
  animation: instrument-rise 600ms var(--ease-out-expo, cubic-bezier(0.16, 1, 0.3, 1)) both;
}
[data-theme="instrument"] .stat-tile:nth-child(2) { animation-delay: 50ms; }
[data-theme="instrument"] .stat-tile:nth-child(3) { animation-delay: 100ms; }
[data-theme="instrument"] .stat-tile:nth-child(4) { animation-delay: 150ms; }
[data-theme="instrument"] .stat-tile:nth-child(5) { animation-delay: 200ms; }
[data-theme="instrument"] .stat-tile:nth-child(6) { animation-delay: 250ms; }
@keyframes instrument-rise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  [data-theme="instrument"] .stat-tile { animation-duration: 1ms; animation-delay: 0ms; }
}

/* Landing reveal stagger — relocated from landing.css (token-exempt file:
   these intended delays fall off the approved duration scale). */
[data-theme="instrument"] .reveal-d0 { animation-delay: 0ms; }
[data-theme="instrument"] .reveal-d1 { animation-delay: 50ms; }
[data-theme="instrument"] .reveal-d2 { animation-delay: 100ms; }
[data-theme="instrument"] .reveal-d3 { animation-delay: 150ms; }
[data-theme="instrument"] .reveal-d4 { animation-delay: 200ms; }
[data-theme="instrument"] .reveal--late { animation-delay: 350ms; }
@media (prefers-reduced-motion: reduce) {
  [data-theme="instrument"] .reveal-d0,
  [data-theme="instrument"] .reveal-d1,
  [data-theme="instrument"] .reveal-d2,
  [data-theme="instrument"] .reveal-d3,
  [data-theme="instrument"] .reveal-d4,
  [data-theme="instrument"] .reveal--late {
    animation-delay: 0ms;
  }
}

/* Builder shell: light page behind the editor. Overflow contract lives in
   the base rule (gspress-design-system.css) and is not duplicated here. */
[data-theme="instrument"].gs-builder-body,
[data-theme="instrument"] .gs-builder-body {
  background: var(--color-base);
}

/* Auth on the stage (elegance spec §4, amended at the wow gate — Jaye,
   2026-08-14). Dark ground with an accent glow: the SANCTIONED exception to
   accent-≠-decoration, in its glow-on-stage form — auth body only, never
   propagate. Scoped: :app loads every stylesheet on every page, and the
   dashboard body also carries gs-body. */
[data-theme="instrument"].gs-auth-body {
  background: radial-gradient(
    110% 70% at 50% -8%,
    color-mix(in srgb, var(--color-accent) 16%, var(--color-stage)),
    var(--color-stage) 62%
  );
}
/* The card IS the light on stage: hairline ring, no shadow (invisible on
   stage), modal-grade radius. Links inside stay accent — accent text is
   banned on the stage itself, not on the light card. */
[data-theme="instrument"].gs-auth-body .gs-card-static {
  border-radius: var(--radius-modal);
  border-color: var(--color-stage-border);
  box-shadow: none;
}
@media print {
  [data-theme="instrument"].gs-auth-body {
    background: var(--color-base);
  }
  [data-theme="instrument"].gs-auth-body .text-stage-ink,
  [data-theme="instrument"].gs-auth-body .text-stage-ink-secondary {
    color: var(--color-ink);
  }
}