/* Mabel Console colour tokens: the ONLY place colours are defined (one light set, one dark set).
   Components (app.css, the UI scripts) use var(--token) only.
   Palette: paper-grey neutrals with a faint warm cast; the brand colour is an inky blue-violet ("ink"),
   used for primary actions, focus, the current page and the first chart series, nowhere else.
   Status colours are earthy and only tint a surface when something is wrong.
   Every text token is >= 4.5:1 on --bg, --card, --raised and --side, and on its own --*-soft tint, in both themes;
   --border (inputs, controls) is >= 3:1 on --card. */

:root, :root[data-theme="light"] {
  color-scheme: light;
  /* surfaces */
  --bg: #F6F6F3;
  --side: #EEEEEA;
  --card: #FFFFFF;
  --card-glass: #F6F6F3;
  --raised: #F1F1ED;
  --raised-2: #E4E4DE;
  --overlay: rgba(28, 28, 26, 0.38);
  /* text */
  --fg: #1F1F1C;
  --fg-muted: #55554F;
  --fg-subtle: #686862;
  /* lines */
  --border: #8B8B83;
  --border-soft: #E2E2DC;
  --border-strong: #CDCDC5;
  /* accent: ink violet */
  --accent: #4F46B8;
  --accent-hover: #433BA0;
  --on-accent: #FFFFFF;
  --accent-text: #4740AA;
  --accent-soft: #ECEBF6;
  --accent-2: #2A6F7A;
  /* status */
  --ok: #2C6A3B;     --ok-fill: #3B7F4C;     --ok-soft: #E8F0E8;
  --warn: #8A4F06;   --warn-fill: #B7781A;   --warn-soft: #F7EEDD;
  --danger: #A3302A; --danger-fill: #B0362E; --danger-soft: #F7E8E5; --on-danger: #FFFFFF;
  --info: #335A8C;   --info-soft: #E9EEF4;
  /* focus, shadows, charts */
  --ring: #4F46B8;
  --ring-soft: rgba(79, 70, 184, 0.20);
  --shadow: none;
  --shadow-lg: 0 10px 28px rgba(28, 28, 26, 0.13), 0 1px 3px rgba(28, 28, 26, 0.08);
  --shadow-accent: none;
  --chart-1: #4F46B8; --chart-2: #2A6F7A; --chart-fill: rgba(79, 70, 184, 0.06); --chart-grid: rgba(31, 31, 28, 0.07);
  /* chart series (brokers, groups): each >= 4.5:1 on --card */
  --series-1: #4F46B8; --series-2: #23706A; --series-3: #9A5A12; --series-4: #A8385A; --series-5: #2F62A0; --series-6: #4D7228;
  --bg-grad: none;
  /* tooltip (inverted) */
  --tip-bg: #1F1F1C; --tip-fg: #F6F6F3;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #141413;
  --side: #181817;
  --card: #1B1B1A;
  --card-glass: #141413;
  --raised: #222220;
  --raised-2: #2C2C29;
  --overlay: rgba(0, 0, 0, 0.58);
  --fg: #E9E8E3;
  --fg-muted: #A9A8A0;
  --fg-subtle: #94938B;
  --border: #6F6E67;
  --border-soft: #2B2B28;
  --border-strong: #3A3A36;
  --accent: #5B52C9;
  --accent-hover: #6A62D4;
  --on-accent: #FFFFFF;
  --accent-text: #ADA6F0;
  --accent-soft: rgba(124, 115, 222, 0.15);
  --accent-2: #5DB3BD;
  --ok: #7BBE8A;     --ok-fill: #3B7F4C;     --ok-soft: rgba(110, 180, 125, 0.11);
  --warn: #D7A75A;   --warn-fill: #B7781A;   --warn-soft: rgba(215, 167, 90, 0.11);
  --danger: #EC8A7E; --danger-fill: #B0362E; --danger-soft: rgba(236, 138, 126, 0.12); --on-danger: #FFFFFF;
  --info: #93B1DA;   --info-soft: rgba(147, 177, 218, 0.11);
  --ring: #ADA6F0;
  --ring-soft: rgba(173, 166, 240, 0.25);
  --shadow: none;
  --shadow-lg: 0 14px 36px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.04);
  --shadow-accent: none;
  --chart-1: #ADA6F0; --chart-2: #5DB3BD; --chart-fill: rgba(173, 166, 240, 0.07); --chart-grid: rgba(233, 232, 227, 0.07);
  --series-1: #ADA6F0; --series-2: #5DB3A8; --series-3: #D7A75A; --series-4: #E58FA6; --series-5: #82A9DE; --series-6: #A3C77A;
  --bg-grad: none;
  --tip-bg: #E9E8E3; --tip-fg: #141413;
}