/* Design tokens — extracted verbatim from prototype/conduit-proto.html. */
  /* ============================= TOKENS =============================
     Warm mustard-yellow "cream dashboard" theme.
  ==================================================================== */
  :root {
    --font-sans: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

    --ink: #1c1a15;
    --ink-2: #6b6558;
    --muted: #9c9483;
    --surface: #fdf6e8;
    --surface-raised: #ffffff;
    --surface-sunken: #f7efdd;
    --border: #ece1cb;
    --border-strong: #ddcda3;
    --accent: #f5c518;
    --accent-strong: #d9a812;
    --accent-soft: #fdf0c8;
    --accent-contrast: #1c1a15;
    --focus-ring: #d9a812;

    --good: #1f9254;
    --good-ink: #147a41;
    --critical-ink: #b23327;

    --env-1: #2a78d6;
    --env-2: #eb6834;
    --env-3: #1baf7a;
    --env-4: #8b5cf6;
    --env-5: #e87ba4;

    --shadow-drawer: 0 20px 60px rgba(60, 45, 10, 0.16);
    --shadow-pop: 0 8px 28px rgba(60, 45, 10, 0.14);
    --radius-s: 8px;
    --radius-m: 14px;
    --radius-l: 22px;
    color-scheme: light;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      color-scheme: dark;
      --ink: #f5efe0;
      --ink-2: #cdc3a8;
      --muted: #9c9483;
      --surface: #17130f;
      --surface-raised: #221c16;
      --surface-sunken: #120e0b;
      --border: #33291e;
      --border-strong: #453626;
      --accent: #f5c518;
      --accent-strong: #ffd84d;
      --accent-soft: rgba(245, 197, 24, 0.16);
      --accent-contrast: #1c1a15;
      --focus-ring: #f5c518;
      --good-ink: #4ade80;
      --critical-ink: #f87171;
      --env-1: #3987e5; --env-2: #d95926; --env-3: #199e70; --env-4: #a78bfa; --env-5: #d55181;
      --shadow-drawer: 0 20px 60px rgba(0, 0, 0, 0.55);
      --shadow-pop: 0 8px 28px rgba(0, 0, 0, 0.5);
    }
  }
  :root[data-theme="dark"] {
    color-scheme: dark;
    --ink: #f5efe0; --ink-2: #cdc3a8; --muted: #9c9483;
    --surface: #17130f; --surface-raised: #221c16; --surface-sunken: #120e0b;
    --border: #33291e; --border-strong: #453626;
    --accent: #f5c518; --accent-strong: #ffd84d; --accent-soft: rgba(245, 197, 24, 0.16); --accent-contrast: #1c1a15;
    --focus-ring: #f5c518;
    --good-ink: #4ade80; --critical-ink: #f87171;
    --env-1: #3987e5; --env-2: #d95926; --env-3: #199e70; --env-4: #a78bfa; --env-5: #d55181;
    --shadow-drawer: 0 20px 60px rgba(0, 0, 0, 0.55);
    --shadow-pop: 0 8px 28px rgba(0, 0, 0, 0.5);
  }