/* FormSMTP — design tokens ---------------------------------------------------------------------
   Warm paper canvas, ink for actions, one electric-lime accent for highlights and data.
   --primary is the action color (ink in light, lime in dark); --accent* is the highlight/data color. */
:root {
  --canvas: #efede7;
  --sheet: #ffffff;
  --surface: #ffffff;
  --surface-2: #f8f7f3;
  --surface-3: #f1efea;
  --line: #ebe8e1;
  --line-strong: #dcd8cf;
  --ink: #141413;
  --ink-2: #5f5c55;
  --ink-3: #96928a;
  --primary: #141413;
  --primary-hover: #2d2c29;
  --on-primary: #ffffff;
  --primary-soft: #eff8d6;
  --primary-ink: #3f6100;
  --accent: #c8f251;
  --accent-strong: #9ccc1f;
  --on-accent: #141413;
  --stamp: #e5484d;
  --stamp-soft: #fdeeee;
  --ok: #3b8a0c;
  --ok-soft: #edf7dd;
  --warn: #a8650a;
  --warn-soft: #fdf3e2;
  --ring: rgba(156, 204, 31, 0.38);
  --code-bg: #161614;
  --code-ink: #e7e5de;
  /* Single-series chart color (validated against the light surface: lightness band, chroma, contrast). */
  --series: #4d7a00;

  --font-ui: "Geist", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Geist", var(--font-ui);
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;

  --r-sheet: 20px;
  --r-card: 16px;
  --r-ctl: 10px;
  --shadow-xs: 0 1px 2px rgba(20, 20, 19, 0.04);
  --shadow-card: 0 1px 2px rgba(20, 20, 19, 0.03);
  --shadow-sheet: 0 1px 2px rgba(20, 20, 19, 0.03), 0 10px 30px -20px rgba(20, 20, 19, 0.16);
  --shadow-pop: 0 4px 8px -2px rgba(20, 20, 19, 0.06), 0 18px 44px -14px rgba(20, 20, 19, 0.22);
  --sidebar-w: 256px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --canvas: #0b0b0a;
    --sheet: #131312;
    --surface: #181816;
    --surface-2: #1d1d1b;
    --surface-3: #252522;
    --line: #272724;
    --line-strong: #383834;
    --ink: #f1f0eb;
    --ink-2: #a8a59d;
    --ink-3: #75726b;
    --primary: #cbf34f;
    --primary-hover: #d8f77a;
    --on-primary: #141413;
    --primary-soft: #222a10;
    --primary-ink: #d6f57c;
    --accent: #cbf34f;
    --accent-strong: #cbf34f;
    --stamp: #ff6b6b;
    --stamp-soft: #351a1a;
    --ok: #a9e35a;
    --ok-soft: #1d2711;
    --warn: #f1b45a;
    --warn-soft: #33250d;
    --ring: rgba(203, 243, 79, 0.24);
    --code-bg: #0e0e0d;
  --series: #76a012;
    --shadow-xs: none;
    --shadow-card: none;
    --shadow-sheet: 0 0 0 1px #1f1f1d;
    --shadow-pop: 0 0 0 1px var(--line), 0 20px 40px -12px rgba(0, 0, 0, 0.7);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #0b0b0a;
  --sheet: #131312;
  --surface: #181816;
  --surface-2: #1d1d1b;
  --surface-3: #252522;
  --line: #272724;
  --line-strong: #383834;
  --ink: #f1f0eb;
  --ink-2: #a8a59d;
  --ink-3: #75726b;
  --primary: #cbf34f;
  --primary-hover: #d8f77a;
  --on-primary: #141413;
  --primary-soft: #222a10;
  --primary-ink: #d6f57c;
  --accent: #cbf34f;
  --accent-strong: #cbf34f;
  --stamp: #ff6b6b;
  --stamp-soft: #351a1a;
  --ok: #a9e35a;
  --ok-soft: #1d2711;
  --warn: #f1b45a;
  --warn-soft: #33250d;
  --ring: rgba(203, 243, 79, 0.24);
  --code-bg: #0e0e0d;
  --series: #76a012;
  --shadow-xs: none;
  --shadow-card: none;
  --shadow-sheet: 0 0 0 1px #1f1f1d;
  --shadow-pop: 0 0 0 1px var(--line), 0 20px 40px -12px rgba(0, 0, 0, 0.7);
}