/* Design tokens of the MosChip Financial Reporting System (docs/ui-design/frs.css). One typeface: Geist, SIL OFL 1.1
   (../fonts/OFL.txt). Brand purple #693A94; coral #EA543F only for needs-you counts and blockers.
   tests/test_ui_contrast.py reads this file's :root blocks, so keep them as plain `--name: value;` lists with hex colours. */
@font-face { font-family: "Geist"; src: url("../fonts/Geist-Variable.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

/* ---- the design tokens (the names the .m-* components use) */
:root {
  --canvas: #f6f5f3; --surface: #ffffff; --sunken: #f1efec; --hover: #f3f1ee;
  --line: #e6e3de; --line-2: #d6d2cb; --line-strong: #8d8795;
  --ink: #1b1722; --ink-2: #4b4655; --ink-3: #55505f;
  --brand: #693a94; --brand-deep: #5a2e85; --brand-tint: #f2ecf8; --brand-line: #ddd0ea;
  --coral: #ea543f; --coral-text: #b23a26; --coral-tint: #fceae6;
  --ok: #0b6a4e; --ok-tint: #e3f3ec; --warn: #7a4500; --warn-tint: #fcf0dc;
  --bad: #b23a26; --bad-tint: #fceae6; --info: #2b4c86; --info-tint: #e6edf8;
  --chart-1: #693a94; --chart-2: #e0563f; --chart-3: #00968f; --grid: #eeebe7;
  --scrim: rgba(27, 23, 34, 0.32);
  --sh-1: 0 1px 2px rgba(27, 23, 34, 0.05);
  --sh-2: 0 1px 2px rgba(27, 23, 34, 0.04), 0 6px 20px -8px rgba(27, 23, 34, 0.14);
  --sh-3: 0 2px 6px rgba(27, 23, 34, 0.06), 0 24px 60px -18px rgba(27, 23, 34, 0.30);
  --r-sm: 8px; --r-md: 10px; --r-lg: 14px; --r-xl: 18px;
  --ease: cubic-bezier(0.23, 1, 0.32, 1); --ease-expo: cubic-bezier(0.19, 1, 0.22, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1); --ease-pop: cubic-bezier(0.34, 1.36, 0.64, 1);
  --font: "Geist", ui-sans-serif, system-ui, sans-serif;
  --focus-ring: 2px solid #693a94;
  --top-h: 60px;
}

/* ---- names the screens built before the new design still use. Same palette; plain values so the contrast test can read them.
   A screen that moves to the .m-* components stops using these; delete a name once nothing refers to it. */
:root {
  --paper: #ffffff; --sunk: #f1efec; --subtle: #faf9f7; --subtle-2: #f2ecf8;
  --ink-4: #8d8795; --ctl: #858090;
  --brand-2: #5a2e85; --tint: #f2ecf8; --tint-2: #ddd0ea; --on-brand: #ffffff;
  --teal: #00746f; --teal-t: #e0f2f1;
  --green: #0b6a4e; --green-t: #e3f3ec; --amber: #7a4500; --amber-t: #fcf0dc; --red: #b23a26; --red-t: #fceae6;
  --warn-ink: #7a4500; --warn-bd: #f0d9ad; --ok-ink: #0b6a4e; --ok-bd: #c6e6d8;
  --info-ink: #5a2e85; --info-bd: #ddd0ea; --bad-ink: #8f2c1c; --bad-bd: #f4c9c0;
  --av-n: #693a94; --av-l: #2b4c86; --av-j: #0b6a4e; --av-x: #4b4655;
  --toast-ok: #8de0b9;
  --sans: "Geist", ui-sans-serif, system-ui, sans-serif;
  --serif: var(--sans); --mono: var(--sans); --display: var(--sans);   /* one family; figures align through tabular numerals */
  --r: 10px; --r-xs: 6px;
  --sh: 0 1px 2px rgba(27, 23, 34, 0.05);
  --sh-pop: 0 2px 6px rgba(27, 23, 34, 0.06), 0 24px 60px -18px rgba(27, 23, 34, 0.30);
  --focus: 0 0 0 2px #ffffff, 0 0 0 4px #693a94;
  --d-td: 9px; --d-btn: 36px; --d-top: 60px; --d-card: 16px; --d-th: 40px; --d-page-y: 28px;
}
* { box-sizing: border-box; }
