/* Canonical Meraki design tokens. The Content Center copy is generated. */
:root {
  color-scheme: dark;
  --bg: #0b1017;
  --surface: #141d27;
  --surface-2: #1a2632;
  --line: #2a3946;
  --text: #edf3f7;
  --text-muted: #a5b4c4;
  --accent: #2dd4bf;
  --accent-ink: #06201d;
  --focus: #78b8ff;
  --ok: #4ade80;
  --warn: #fbbf24;
  --bad: #f87171;
  --ok-bg: #113122;
  --warn-bg: #3a2a08;
  --bad-bg: #3b1414;
  --biz: var(--accent);
  --r-sm: 8px;
  --r: 12px;
  --r-lg: 16px;
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 24px;
  --s6: 32px;
  --s7: 48px;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 15px;
  --fs-lg: 18px;
  --fs-xl: 22px;
  --fs-2xl: 28px;
  --fs-num: 32px;
  --lh-tight: 1.2;
  --lh: 1.5;
  --bp-sm: 600px;
  --bp-md: 860px;
  --bp-lg: 1120px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --ink: var(--text);
  --fg: var(--text);
  --muted: var(--text-muted);
  --card: var(--surface);
  --soft: var(--surface-2);
  --side: var(--surface);
  --side-text: var(--text);
  --side-muted: var(--text-muted);
  --ok-soft: var(--ok-bg);
  --warn-soft: var(--warn-bg);
  --bad-soft: var(--bad-bg);
  --radius: var(--r);
  --shadow: 0 12px 36px #0003;
}
/* Theme changes use the same semantic tokens in both apps. */
[data-theme=light] {
 color-scheme:light;
 --bg:#f4f7fa;--surface:#ffffff;--surface-2:#e8eef3;--line:#bccbd8;
 --text:#172633;--text-muted:#485c6e;--accent:#08786c;--accent-ink:#ffffff;--focus:#145db5;
 --ok:#176b38;--warn:#805800;--bad:#b02727;
 --ok-bg:#e5f5e9;--warn-bg:#fff2cd;--bad-bg:#fde8e8;
 --shadow:0 12px 36px #1831451a;
}