/* Atlas — generated from tokens.json */
:root, [data-theme="light"] {
  --surface-canvas: #fefcf2; /* Page, shell and chart background. Source reuse (TradingView D01/D06). Paper: the cream page ground, taken from the logo field. */
  --surface-panel: #ffffff; /* Dominant analytical and reading panels; same value as canvas, separate role. */
  --surface-overlay: #ffffff; /* Menus, dialogs, popovers, temporary inspectors. */
  --surface-control: #f3efe0; /* Input and control fill. Not a card background. */
  --surface-hover: #f0ecdd; /* Transient hover on rows and commands. */
  --surface-selected: #e9e4d0; /* Quiet selection: selected category, open filter trigger, active nav. Always pair with a separate focus ring. */
  --surface-selection-tint: #ebe7da; /* Selected data row in tables. Atlas proposal. */
  --surface-ink: #0f0f0f; /* The black rounded data panel (radius 16, shadow-ink). Put tables, charts and evidence inside it and set data-theme="dark" on it so its contents use Ink tokens. */
  --text-primary: #141414; /* Data, controls, body. Passes on every surface (7.85:1 on surface-selected at worst). Paper: deep brand green ink (14.9:1 on cream). */
  --text-secondary: #3f3e3a; /* Supporting labels on every surface (5.48:1 on surface-selected at worst). Paper: green-tinted grey (9.1:1). */
  --text-muted: #6b6862; /* Metadata on surface-canvas (5.7:1) and surface-overlay (4.9:1) ONLY. Fails on surface-control (4.04), surface-selected (3.23) and selection tint (4.08): promote to text-secondary there. Paper: 5.5 on cream/white, 4.9 on control; fails on surface-selected (4.42) — use text-secondary there. */
  --text-inverse: #fefcf2; /* Label on action-primary (4.9:1) and action-hover (6.13:1). */
  --text-disabled: #a09a85; /* Inactive control labels only, never explanatory text (4.28:1 on canvas — below 4.5 by design; WCAG exempts disabled controls). */
  --text-on-light: #fefcf2; /* Foreground on selection-light (17.1:1). Foreground on selection-light in both themes (white in light theme, near-black in dark). */
  --border-subtle: #e7e3d3; /* Decorative row and panel separators. Not a control boundary. */
  --border-control: #7a7563; /* Essential input/control boundary (5.7:1 on canvas). Paper: 4.5 on cream, 4.0 on control fill. */
  --border-focus: #0055d4; /* 2px focus ring with 2px gap, on every surface (5.22:1 on surface-selected at worst). Paper: blue focus ring, deliberately not brand green, so focus never looks like selection. */
  --action-primary: #141414; /* Primary action fill, once per view. Fill only: 3.91:1 on canvas, so never small text. Paper: primary pill buttons in brand green with cream label (14.9:1). */
  --action-hover: #2a2a2a; /* Primary action hover. */
  --action-pressed: #05200f; /* Primary action pressed. */
  --action-link: #141414; /* Readable link on dark surfaces (9.21:1 on canvas). Paper: links are green and always underlined so they differ from body ink. */
  --selection-light: #141414; /* Selected pill, checked control, selected date endpoint. Pair only with text-on-light. Selected pill / checked control. Light theme: near-black fill; dark theme: near-white fill. Always pair with text-on-light. */
  --fin-increase-text: #087a68; /* Signed increase text on canvas (6.68), overlay (5.75), control (4.73), selection tint (4.78). Fails on surface-selected (3.79). Direction, never quality. Light: passes on panel, canvas, control, tint; fails on surface-selected (4.11). */
  --fin-decrease-text: #c4001a; /* Signed decrease text on canvas (5.78) and overlay (4.97) only. Fails on control (4.09), selected (3.27), selection tint (4.13): keep the sign and add a word there. Light: passes on every surface (≥4.88). */
  --fin-increase-mark: #089981; /* Candle/bar marks for increase. Not for small text. */
  --fin-decrease-mark: #f23645; /* Candle/bar marks for decrease. Not for small text. */
  --chart-grid: rgba(20,20,20, 0.08); /* Chart gridlines. Source CSS declaration, not a composited pixel. */
  --chart-crosshair: rgba(20,20,20, 0.45); /* Chart crosshair. Atlas proposal. */
  --chart-line: #141414; /* Primary plotted series. */
  --chart-series2: #b89a4f; /* Second categorical series. Identity, not favourable outcome. Paper: mid gold for second series; text on it uses brand green (5.7:1). */
  --heatmap-increase: #cdeee5; /* Heatmap tile, direction up. Categorical, not magnitude. */
  --heatmap-decrease: #fbd5d8; /* Heatmap tile, direction down. */
  --heatmap-unchanged: #e9e4d0; /* Heatmap tile for exact zero only. Missing uses a labelled state. */
  --status-warning: #8a4b00; /* System warning text/icon (11.25:1 on canvas). Not market direction. */
  --status-error: #b00012; /* System error text/icon (7.74:1 on canvas). Not a decrease. */
  --brand-cream: #fefcf2; /* UNVERIFIED raster sample of the logo field. Identity placements only (logo plate, cover). Not an approved token. */
  --brand-gold: #d8bc78; /* UNVERIFIED raster sample of the compass. Identity only — never 'verified', never a status. 10.4:1 on canvas; fails on brand-cream (1.79). */
  --brand-green: #141414; /* UNVERIFIED raster sample of the wordmark. Identity only — never 'gain' or 'good'. 14.9:1 on brand-cream; invisible on canvas. */
  --brand-eyebrow: #6b5a2e; /* Small labels above headings: dark gold on paper (6.5:1), gold on ink and on brand green (8.3:1). */
  --text-on-brand: #d6d2c6; /* Body text on a brand-green band (10.6:1). Headings on the band use brand-cream. */
  --shadow-ink: 0 1px 0 rgba(20,20,20,0.08), 0 24px 64px -24px rgba(20,20,20,0.35); /* Only on the black ink panel and floating menus — never on plain paper cards. */
}
[data-theme="dark"] {
  --surface-canvas: #0f0f0f;
  --surface-panel: #0f0f0f;
  --surface-overlay: #1f1f1f;
  --surface-control: #2e2e2e;
  --surface-hover: #2e2e2e;
  --surface-selected: #3d3d3d;
  --surface-selection-tint: #1a2c54;
  --surface-ink: #0f0f0f;
  --text-primary: #dbdbdb;
  --text-secondary: #b8b8b8;
  --text-muted: #8c8c8c;
  --text-inverse: #ffffff;
  --text-disabled: #777777;
  --text-on-light: #0f0f0f;
  --border-subtle: #2e2e2e;
  --border-control: #8c8c8c;
  --border-focus: #8cb4ff;
  --action-primary: #2962ff;
  --action-hover: #1e53e5;
  --action-pressed: #1849c6;
  --action-link: #8cb4ff;
  --selection-light: #f2f2f2;
  --fin-increase-text: #22ab94;
  --fin-decrease-text: #f7525f;
  --fin-increase-mark: #089981;
  --fin-decrease-mark: #f23645;
  --chart-grid: rgba(242, 242, 242, 0.2);
  --chart-crosshair: rgba(184, 184, 184, 0.6);
  --chart-line: #2962ff;
  --chart-series2: #22ab94;
  --heatmap-increase: #164f45;
  --heatmap-decrease: #652d35;
  --heatmap-unchanged: #333333;
  --status-warning: #f4be50;
  --status-error: #ff7c86;
  --brand-cream: #fefcf2;
  --brand-gold: #d8bc78;
  --brand-green: #141414;
  --brand-eyebrow: #d8bc78;
  --text-on-brand: #d6d2c6;
}
:root {
  --space-0: 0px; /* Flush structural joins. */
  --space-2: 2px; /* Optical adjustment; focus-ring gap. */
  --space-4: 4px; /* Structural seam between workbench regions; tight control groups. */
  --space-6: 6px; /* Icon–label gap in compact controls. */
  --space-8: 8px; /* Gap inside a control group. */
  --space-10: 10px; /* Compact control inset. */
  --space-12: 12px; /* Numeric cell padding; panel inner gap. */
  --space-16: 16px; /* Panel inset. */
  --space-20: 20px; /* Dialog inset. */
  --space-24: 24px; /* Gap between major groups. */
  --space-32: 32px; /* Gap between page sections. */
  --space-40: 40px; /* Gap between page sections inside a view. */
  --space-48: 48px; /* Large separation; reading-view side inset. */
  --space-64: 64px; /* Top inset of a reading view; landing section padding on small screens. */
  --space-96: 96px; /* Landing section padding on desktop. */
  --radius-none: 0px; /* Structural edges, toolbars, tables, chart plots. */
  --radius-small: 4px; /* Tags and small chips. */
  --radius-control: 6px; /* Buttons, inputs, settings shell. */
  --radius-popover: 10px; /* Filter popovers. */
  --radius-dialog: 12px; /* Catalogs and large dialogs. */
  --radius-pill: 99px; /* Category pills only. */
  --radius-panel: 16px; /* Ink panels and paper cards. */
  --height-pill: 28px; /* Category pill. */
  --height-compact: 32px; /* Compact button. */
  --height-filter: 34px; /* Filter trigger. */
  --height-command: 38px; /* Chart command target. */
  --height-control: 40px; /* Inputs, buttons, reading context bar. */
  --height-data-row: 40px; /* Dense result row. */
  --height-reading-row: 44px; /* Reading list row. */
  --height-table-header: 50px; /* Table header row. */
  --height-statement-row: 56px; /* Financial statement row. */
  --icon-ink: 20px; /* Icon drawing size. */
  --target-minimum: 24px; /* Minimum pointer target (WCAG floor) for dense tools. */
  --target-comfortable: 44px; /* Apple-comfortable target: landing links, primary actions, anything touch-likely. */
  --stroke-hairline: 1px; /* Separators and control borders. */
  --stroke-focus: 2px; /* Focus ring width. */
  --width-rail: 52px; /* Compact tool/navigation rail. */
  --width-nav: 208px; /* Expanded research navigation. */
  --width-inspector: 320px; /* Evidence inspector (280px minimum). */
  --width-chart-side: 346px; /* Chart-side context region. */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1); /* Default. Anything entering, exiting or responding to a press. */
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1); /* Something moving or morphing on screen (panel resize). */
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1); /* Inspector and drawer slide-in. */
  --dur-press: 160ms; /* Button press scale (0.97) and release. */
  --dur-hover: 120ms; /* Hover colour changes, with plain ease. */
  --dur-tooltip: 125ms; /* Tooltips and small popovers; adjacent tooltips open instantly. */
  --dur-menu: 180ms; /* Dropdowns and menus. */
  --dur-panel: 240ms; /* Inspector, drawer, dialog entry. Exit at 160ms. */
  --font-sans: Geist, -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --text-metadata: 400 12px/16px var(--font-sans); /* Short labels, source dates, units. Not explanations. */
  --text-eyebrow: 500 12px/16px var(--font-sans); /* Section label above a heading in panels. Sentence case, not all caps. */
  --text-control: 400 14px/20px var(--font-sans); /* Commands and form controls. */
  --text-control-strong: 500 14px/20px var(--font-sans); /* A justified strong control: primary button label, active nav item. */
  --text-data: 400 14px/20px var(--font-sans); /* Financial tables. Always tabular figures. */
  --text-menu: 400 14px/18px var(--font-sans); /* Compact tool-menu rows. */
  --text-reading: 400 16px/24px var(--font-sans); /* Business explanations, source excerpts, answers. 60–75 characters per line. */
  --text-title-3: 600 17px/24px var(--font-sans); /* Panel and card titles (Answer, Sources). */
  --text-dialog-title: 600 20px/26px var(--font-sans); /* Dialog and inspector titles. */
  --text-view-title: 600 28px/34px var(--font-sans); /* One per view: the research question or company. Up from the 24px candidate for a clearer step above panel titles. */
  --text-display: 600 64px/66px var(--font-sans); /* Landing hero only. Never inside the product. */
  --text-headline: 600 40px/44px var(--font-sans); /* Landing section headings. */
  --text-lede: 400 20px/30px var(--font-sans); /* Landing intro paragraph. */
}
.metadata {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: 0.01em;
}
.eyebrow {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.control {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: 0;
}
.control-strong {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  letter-spacing: 0;
}
.data {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: 0;
}
.menu {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: 0;
}
.reading {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  letter-spacing: 0;
}
.title-3 {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 24px;
  font-weight: 600;
  letter-spacing: -0.005em;
}
.dialog-title {
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 26px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.view-title {
  font-family: var(--font-sans);
  font-size: 28px;
  line-height: 34px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.display {
  font-family: var(--font-sans);
  font-size: 64px;
  line-height: 66px;
  font-weight: 600;
  letter-spacing: -0.03em;
}
.headline {
  font-family: var(--font-sans);
  font-size: 40px;
  line-height: 44px;
  font-weight: 600;
  letter-spacing: -0.025em;
}
.lede {
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 30px;
  font-weight: 400;
  letter-spacing: -0.005em;
}
