:root {
  --paper: #FBFAF8;      /* page ground */
  --card: #FFFFFF;       /* placard */
  --mat: #ECEAE4;        /* image mat, table stripes */
  --line: #DEDBD3;       /* hairlines */
  --ink: #23262E;        /* text, frames */
  --ink-soft: #5C5F66;   /* secondary text */
  --ultra: #2740C8;      /* primary accent + reviews series (pigment: ultramarine) */
  --ultra-deep: #1B2C96; /* hover/active */
  --ochre: #B98A2E;      /* favorites series (pigment: ochre) */
  --viridian: #2E8B6A;   /* views series (pigment: viridian) */
  --red-dot: #C93B2E;    /* breakout badge + critical status ONLY */
  --ok: #2E7D4F; --warn: #B98A2E;  /* status; always icon+label, never color alone */
  --radius: 4px; --radius-card: 6px;
  --font-display: "Fraunces", Georgia, serif;
  --font-ui: "IBM Plex Sans", -apple-system, sans-serif;
  --font-data: "IBM Plex Mono", ui-monospace, monospace;

  /* Visual-elevation pass (additive only -- values above are frozen).
     6-8% tints of the three accent pigments for quiet structural fills:
     selected/active chrome, per-kind card identity, status chips. Never
     used for text at body size (contrast too low); pair with the solid
     pigment for text/dot/border. */
  --ultra-tint: #EEF0FB;
  --ochre-tint: #F7F1E3;
  --viridian-tint: #E9F3EF;

  /* darker variants for text on tints/paper — pair pigment for marks,
     -deep for text */
  --viridian-deep: #226C51;
  --ochre-deep: #7F5E1E;
}