/* Dollar & Dragon design tokens (Direction C "Twin Session", final). Generated by brand/build/web.py. */
:root {
  /* Colour: brand */
  --cd-cobalt: #2438E8;        /* brand colour: hero bands, buttons on white, links, main chart series */
  --cd-night: #0A0E2A;          /* primary text on light; dark ground */
  --cd-white: #FFFFFF;
  --cd-mist: #EEF0FA;            /* light panels, cards on white */
  --cd-slate: #5A6078;          /* secondary text on light (6.2:1 on white) */
  --cd-accent: #FFD60A;        /* highlight ONLY: primary CTA on cobalt, tag pills, active nav underline */
  --cd-rule: #D5D9EE;            /* hairlines, borders, chart grid */
  --cd-on-cobalt-muted: #DDE1FF; /* body text on cobalt */
  --cd-on-dark-muted: #C9CEF7;    /* secondary text on cobalt/night */
  /* Colour: data (up is NOT cobalt) */
  --cd-up: #A548A1;                /* orchid: rises, inflows; text-safe on white (5.2:1) */
  --cd-down: #E05A00;            /* orange: falls, outflows; graphics and large text */
  --cd-down-text: #B84A00;  /* small down figures on white/mist (5.2:1) */
  --cd-up-on-dark: #C06CBC; /* up on night backgrounds (5.5:1) */
  --cd-down-on-dark: #E05A00;    /* 5.1:1 on night */
  /* Type */
  --cd-font-head: "Space Grotesk", "Inter", system-ui, sans-serif;   /* headlines, wordmark, big numbers */
  --cd-font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;  /* body, UI, labels */
  --cd-weight-head: 700; --cd-weight-body: 400; --cd-weight-ui: 600;
  --cd-tracking-head: -0.03em;  /* display sizes; use -0.01em below 24px */
  --cd-leading-head: 1.04; --cd-leading-body: 1.55;
  --cd-text-xs: 0.8125rem;  /* 13px labels */
  --cd-text-sm: 0.9375rem;  /* 15px */
  --cd-text-md: 1.0625rem;  /* 17px body */
  --cd-text-lg: 1.3125rem;  /* 21px lead */
  --cd-text-xl: 1.75rem;    /* 28px card titles */
  --cd-text-2xl: 2.5rem;    /* 40px section heads */
  --cd-text-3xl: clamp(2.5rem, 4.2vw + 1rem, 4rem);  /* 40-64px hero */
  --cd-numeric: tabular-nums;  /* font-variant-numeric for all figures */
  /* Spacing (4px base) */
  --cd-space-1: 4px; --cd-space-2: 8px; --cd-space-3: 12px; --cd-space-4: 16px; --cd-space-5: 24px;
  --cd-space-6: 32px; --cd-space-7: 48px; --cd-space-8: 64px; --cd-space-9: 96px;
  --cd-page-max: 1296px; --cd-gutter: clamp(20px, 5vw, 72px);
  /* Radius */
  --cd-radius-sm: 8px; --cd-radius-md: 16px; --cd-radius-lg: 22px; --cd-radius-pill: 999px;
  --cd-radius-mark: 22%;   /* the tile mark's corner radius, relative */
  /* Elevation */
  --cd-shadow-card: 0 20px 50px rgba(10, 14, 42, 0.25);
  --cd-shadow-sm: 0 2px 8px rgba(10, 14, 42, 0.08);
  /* Focus */
  --cd-focus: 0 0 0 3px #FFD60A;
}
/* Signed figures: <span class="cd-fig cd-up">▲ +1.2%</span> / <span class="cd-fig cd-down">▼ −0.8%</span> */
.cd-fig { font-family: var(--cd-font-body); font-variant-numeric: var(--cd-numeric); font-weight: 600; white-space: nowrap; }
.cd-up { color: var(--cd-up); }
.cd-down { color: var(--cd-down-text); }