/* Generated by scripts/design_tokens.py from shared/design-tokens.json. */
:root {
  --type-micro: 11px;
  --type-caption: 12px;
  --type-body: 13px;
  --type-card: 14px;
  --type-section: 16px;
  --type-value: 18px;
  --type-metric: 22px;
  --type-title: 22px;
  --type-hero: 26px;
  --space-hair: 2px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-xxl: 32px;
  --space-xxxl: 48px;
  --layout-page-padding: 24px;
  --layout-page-narrow: 16px;
  --layout-card-padding: 16px;
  --layout-section-gap: 16px;
  --layout-field-gap: 12px;
  --layout-control-height: 32px;
  --layout-touch-height: 44px;
  --layout-sidebar-width: 212px;
  --layout-toolbar-height: 64px;
  --layout-navigation-height: 44px;
  --layout-calendar-width: 360px;
  --radius-control: 6px;
  --radius-inset: 8px;
  --radius-card: 12px;
  --line-tight: 1.3;
  --line-compact: 1.4;
  --line-body: 1.6;
  --green: var(--color-accent);
  --green-dark: var(--color-button-hover);
  --muted: var(--color-muted);
  --border: var(--color-border);
  --line: var(--color-border);
  --red: var(--color-danger);
  --amber: var(--color-warning);
  --radius: var(--radius-card);
  --surface: var(--color-surface);
  --appearance-surface: var(--color-surface);
  --appearance-raised: var(--color-raised);
  --appearance-line: var(--color-border);
  --appearance-text: var(--color-text);
  --appearance-muted: var(--color-muted);
  --appearance-selected: var(--color-selected);
  --appearance-accent: var(--color-accent);
  --market-up: var(--color-up);
  --market-up-bg: var(--color-up-bg);
  --market-up-border: var(--color-up-border);
  --market-down: var(--color-down);
  --market-down-bg: var(--color-down-bg);
  --market-down-border: var(--color-down-border);
  --market-neutral: var(--color-neutral);
  --market-neutral-bg: var(--color-neutral-bg);
  --market-neutral-border: var(--color-neutral-border);
  --dark-up: var(--color-up);
  --dark-down: var(--color-down);
  --dark-warning: var(--color-warning);
  --dark-warning-bg: var(--color-warning-bg);
  --dark-danger-bg: var(--color-danger-bg);
  --dark-positive-bg: var(--color-up-bg);
  --dark-negative-bg: var(--color-down-bg);
}
:root {
  --color-canvas: #f4f6f5;
  --color-surface: #ffffff;
  --color-raised: #edf2ef;
  --color-selected: #e5f0ea;
  --color-text: #25382f;
  --color-muted: #5c6e64;
  --color-border: #dae3dd;
  --color-border-strong: #b9cdc0;
  --color-accent: #216653;
  --color-button: #216653;
  --color-button-hover: #174d3e;
  --color-on-accent: #ffffff;
  --color-warning: #8c601d;
  --color-warning-bg: #fbf2e3;
  --color-warning-border: #e8d9bc;
  --color-danger: #b23e4b;
  --color-danger-bg: #fbedee;
  --color-danger-border: #e9c9ce;
  --color-up: #b24751;
  --color-up-bg: #fff6f5;
  --color-up-border: #ecd7d8;
  --color-down: #27704f;
  --color-down-bg: #f1f8f4;
  --color-down-border: #cfe4d8;
  --color-neutral: #65736a;
  --color-neutral-bg: #f7f8f8;
  --color-neutral-border: #e1e5e3;
  --color-info: #326a91;
  --color-event-fed: #77569a;
}
:root[data-theme=dark] {
  --color-canvas: #11191e;
  --color-surface: #182329;
  --color-raised: #223039;
  --color-selected: #26463f;
  --color-text: #e1e9ed;
  --color-muted: #a6b7c0;
  --color-border: #34454e;
  --color-border-strong: #587268;
  --color-accent: #83d7bb;
  --color-button: #24654f;
  --color-button-hover: #2a7963;
  --color-on-accent: #f5fffa;
  --color-warning: #e7bf7b;
  --color-warning-bg: #342d21;
  --color-warning-border: #65553a;
  --color-danger: #ff9299;
  --color-danger-bg: #38272e;
  --color-danger-border: #6b4149;
  --color-up: #ff9299;
  --color-up-bg: #30242b;
  --color-up-border: #654048;
  --color-down: #71d8a5;
  --color-down-bg: #1b302a;
  --color-down-border: #385e4b;
  --color-neutral: #a6b7c0;
  --color-neutral-bg: #223039;
  --color-neutral-border: #34454e;
  --color-info: #7ac9e5;
  --color-event-fed: #c9a6ed;
}