/* R-Sense portal design tokens (GP-D1, 5 Oct 2026; one family across every surface, 23 Oct 2026).
   One palette, one status vocabulary, one type scale and one dark mode for every surface:
   index.html (app.css, planning.css), the framed devplan.html (Planning, Outbox, Jira control room),
   the cockpit (backlog2.html), the companion (companion.css) and the Fronts page.
   Change a value here, never in a page.

   Fronts keeps its own copy of these values inline, and must: the same file is published standalone as a
   claude.ai artifact with no portal behind it, so a linked stylesheet would ship a page with no styles at
   all. tests/design_family_test.py holds the two copies to the same values, so they cannot drift. */
:root {
  /* surfaces and ink */
  --ground: #F4F2EC; --surface: #FFFFFF; --surface-2: #F6F5F1; --ink: #1A1C20; --ink-2: #3E434A; --muted: #5A5F66;
  --line: #E2DED5; --line-2: #EFECE5;
  /* one accent */
  --accent: #1E5B57; --accent-soft: #E3EEEC; --accent-ink: #123B38; --side: #1A1C20;
  /* signals */
  --ok: #2F7D5B; --ok-bg: #E3F0E6; --risk: #A4473C; --risk-bg: #F6E3E0; --warn: #A97A1E; --warn-bg: #F6EBD3;
  /* requirement status: one order everywhere — Not started → Designed → Partly built → To verify → Complete.
     Plain colour for bars, borders and dots; -ink for text on the -bg tint (AA). */
  --st-none: #A4473C;  --st-none-bg: #F6E0DC;  --st-none-ink: #8A2E24;
  --st-des: #5A55A8;   --st-des-bg: #E8E7F6;   --st-des-ink: #463F8E;
  --st-part: #A97A1E;  --st-part-bg: #F6EBD3;  --st-part-ink: #6E4E00;
  --st-unv: #6B7785;   --st-unv-bg: #E7EBEE;   --st-unv-ink: #434C57;
  --st-built: #2F7D5B; --st-built-bg: #DDEFE6; --st-built-ink: #1F5E42;
  /* type */
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "Source Serif 4", Georgia, serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --fs-xs: 12px; --fs-sm: 13px; --fs-md: 14px; --fs-lg: 16px; --fs-xl: 20px; --fs-2xl: 28px;
  /* shape */
  --r-sm: 6px; --r-md: 8px; --r-lg: 14px; --r-pill: 999px;
}
/* Dark mode, one definition for every surface (lifted from the Fronts page, 23 Oct, which had the only
   one). Guarded so a page that asks for light explicitly keeps it, and offered again under an explicit
   data-theme="dark" for a page that chooses. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground: #15171A; --surface: #1E2124; --surface-2: #262A2E;
    --ink: #ECEAE4; --ink-2: #C9C6BE; --muted: #8E918F;
    --line: #33373C; --line-2: #2A2D31;
    --accent: #3E8F89; --accent-soft: #1C3230; --accent-ink: #BFE4E0;
    --ok: #6FBF93; --ok-bg: #1B2F24; --risk: #D98B80; --risk-bg: #33211E;
    --warn: #D4A64A; --warn-bg: #332814;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --ground: #15171A; --surface: #1E2124; --surface-2: #262A2E;
  --ink: #ECEAE4; --ink-2: #C9C6BE; --muted: #8E918F;
  --line: #33373C; --line-2: #2A2D31;
  --accent: #3E8F89; --accent-soft: #1C3230; --accent-ink: #BFE4E0;
  --ok: #6FBF93; --ok-bg: #1B2F24; --risk: #D98B80; --risk-bg: #33211E;
  --warn: #D4A64A; --warn-bg: #332814;
  color-scheme: dark;
}
/* status chips shared by every page */
.st-none { color: var(--st-none-ink); background: var(--st-none-bg); }
.st-des { color: var(--st-des-ink); background: var(--st-des-bg); }
.st-part { color: var(--st-part-ink); background: var(--st-part-bg); }
.st-unv { color: var(--st-unv-ink); background: var(--st-unv-bg); }
.st-built { color: var(--st-built-ink); background: var(--st-built-bg); }
