/* ============================================================
   Sanomatic — design tokens (single source of truth)
   Change the theme here; every page that links this file updates.
   ============================================================ */

:root {
  /* ---- Palette ---- */
  --paper: #F7F9FA;          /* page background (cool near-white) */
  --paper-2: #FFFFFF;
  --panel-tint: #EDF1F3;     /* tinted panels / cards / fields' resting fill */
  --card: #FFFFFF;
  --ink: #16232B;            /* primary text (cool slate near-black) */
  --ink-soft: #38484F;
  --muted: #5C6B72;
  --faint: #93A2A9;
  --accent: #0B7A57;         /* brand green */
  --accent-deep: #095F44;
  --signal: #12A56F;
  --accent-wash: rgba(11, 122, 87, 0.07);
  --line: rgba(22, 35, 43, 0.13);
  --line-soft: rgba(22, 35, 43, 0.08);

  /* ---- Typography ---- */
  --serif: "Newsreader", Georgia, "Times New Roman", serif;
  --sans: "IBM Plex Sans", "Segoe UI", Helvetica, Arial, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* ---- System tokens (radii, focus, motion, elevation) ---- */
  --radius: 6px;
  --radius-sm: 4px;
  --radius-lg: 10px;
  --ease: 0.15s ease;
  --focus-ring: 0 0 0 3px rgba(11, 122, 87, 0.22);
  --shadow-sm: 0 1px 2px rgba(9, 95, 68, 0.12);
  --shadow-md: 0 6px 22px rgba(22, 35, 43, 0.10);

  /* ---- Form semantic tokens (consumed by form.css) ---- */
  --field-bg: var(--card);
  --field-bg-hover: var(--paper-2);
  --field-border: var(--line);
  --field-border-strong: rgba(22, 35, 43, 0.24);
  --danger: #B4443B;
  --danger-wash: rgba(180, 68, 59, 0.08);
}

/* Deliberate single-theme light pages. Hold light in both toggle states. */
:root[data-theme="light"], :root[data-theme="dark"] { color-scheme: light; }