/* IQIN — design tokens
   Dark, instrument-panel aesthetic: a trust layer should look like it measures
   things, not like it sells things. Signal green/amber/red carries real meaning
   throughout (score bands), never decorative. */

@font-face {
  font-family: 'InterVariable';
  src: url('/fonts/InterVariable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'InterVariable';
  src: url('/fonts/InterVariable-Italic.woff2') format('woff2');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

:root {
  --bg: #06080d;
  --bg-raised: #0a0d15;
  --surface: #0e1220;
  --surface-2: #12172a;
  --surface-3: #171d33;
  --border: #1f2740;
  --border-bright: #2e3a5c;

  --text: #eef1fb;
  --text-muted: #97a1c4;
  --text-dim: #5c6690;

  --accent: #5b8cff;
  --accent-bright: #7ea2ff;
  --accent-glow: rgba(91, 140, 255, 0.16);

  --signal-a: #35d0a0;   /* Intent */
  --signal-b: #7c9bff;   /* Identity */
  --signal-c: #f0b34d;   /* Custody */
  --signal-d: #e8688a;   /* Origin */
  --signal-e: #52c7e0;   /* Coherence */

  --good: #35d0a0;
  --warn: #f0b34d;
  --bad: #ea5f6f;

  --radius-sm: 6px;
  --radius: 12px;
  --radius-lg: 20px;

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-md: 0 8px 30px rgba(0,0,0,0.45);
  --shadow-glow: 0 0 60px rgba(91,140,255,0.10);

  --font-body: 'InterVariable', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-display: var(--font-body);
  --font-mono: ui-monospace, 'SFMono-Regular', Menlo, Consolas, 'Liberation Mono', monospace;

  /* Four sizes, that's it: small (meta/labels/nav), body (copy), heading
     (section headers, card titles), hero (H1 only). Every font-size in the
     site's CSS resolves to one of these four, nothing in between. */
  --text-sm: 14px;
  --text-body: 16px;
  --text-heading: 24px;
  --text-hero: 40px;

  --container: 1400px;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --bg: #f5f6fb;
    --bg-raised: #ffffff;
    --surface: #ffffff;
    --surface-2: #f0f2f9;
    --surface-3: #e7eaf5;
    --border: #dfe3f0;
    --border-bright: #c7cde3;
    --text: #10142a;
    --text-muted: #565f82;
    --text-dim: #8891b3;
    --accent: #2f5fdb;
    --accent-bright: #1c46b8;
    --accent-glow: rgba(47,95,219,0.10);
    --shadow-glow: 0 0 60px rgba(47,95,219,0.08);
  }
}

:root[data-theme="light"] {
  --bg: #f5f6fb;
  --bg-raised: #ffffff;
  --surface: #ffffff;
  --surface-2: #f0f2f9;
  --surface-3: #e7eaf5;
  --border: #dfe3f0;
  --border-bright: #c7cde3;
  --text: #10142a;
  --text-muted: #565f82;
  --text-dim: #8891b3;
  --accent: #2f5fdb;
  --accent-bright: #1c46b8;
  --accent-glow: rgba(47,95,219,0.10);
  --shadow-glow: 0 0 60px rgba(47,95,219,0.08);
}