/* Vendored from the Liberal Democrats Design System, https://claude.ai/artifact/2YDVJiD9c3YtsA4Gq6T6bF (read 2026-10-19). Do not edit; update from the artifact. */
/* Liberal Democrats — generated from tokens.json */
:root, [data-theme="light"] {
  --ld-orange: #ff6400;
  --ld-orange-dark: #e65a00;
  --ld-orange-darker: #cc5000;
  --ld-orange-50: #fde0cc;
  --ld-magenta: #ff0075;
  --ld-magenta-50: #fbd9e3;
  --ld-navy: #072f5f;
  --ld-navy-50: #cdd6e4;
  --ld-green: #4f9161;
  --ld-green-50: #d6e3dc;
  --ld-black: #000000;
  --ld-white: #ffffff;
  --ld-riso-red: #ff0000;
  --ld-error: #c8102e;
  --opp-labour: #e4003b;
  --opp-conservative: #0087dc;
  --opp-reform: #00bed6;
  --opp-snp: #fdf38e;
  --opp-green: #00a85a;
  --opp-plaid: #005851;
  --text-heading: var(--ld-orange);
  --text-body: var(--ld-black);
  --text-inverse: var(--ld-white);
  --surface-page: var(--ld-white);
  --surface-brand: var(--ld-orange);
  --surface-dark: var(--ld-navy);
  --accent-1: var(--ld-magenta);
  --accent-2: var(--ld-navy);
  --accent-3: var(--ld-green);
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --radius-none: 0;
  --radius-sm: 2px;
  --radius-pill: 999px;
  --border-thin: 1px;
  --border-frame: 2px;
  --border-heavy: 4px;
  --container-max: 1200px;
  --font-sans: 'Open Sans', system-ui, sans-serif;
  --font-display-alt: 'Rumelaz Gekinsa', 'Open Sans', sans-serif;
  --font-heading: 'Open Sans', system-ui, sans-serif;
  --font-emotive: 'Rumelaz Gekinsa', 'Open Sans', sans-serif;
  --font-body: 'Open Sans', system-ui, sans-serif;
}
.headline-xl { font-family: var(--font-heading); font-size: 64px; line-height: 1; font-weight: 800; letter-spacing: -0.04em; }
.headline-l { font-family: var(--font-heading); font-size: 44px; line-height: 1; font-weight: 800; letter-spacing: -0.04em; }
.section-heading { font-family: var(--font-heading); font-size: 30px; font-weight: 800; letter-spacing: -0.04em; }
.label-caps { font-family: var(--font-heading); font-size: 15px; font-weight: 800; }
.emotive-statement { font-family: var(--font-emotive); font-size: 52px; line-height: 0.95; font-weight: 400; letter-spacing: -0.02em; }
.emotive-italic { font-family: var(--font-emotive); font-size: 30px; line-height: 1; font-weight: 400; font-style: italic; }
.emotive-key { font-family: var(--font-emotive); font-size: 104px; line-height: 0.85; font-weight: 400; }
.body { font-family: var(--font-body); font-size: 16px; line-height: 1.2; font-weight: 400; }
.body-bold { font-family: var(--font-body); font-size: 16px; line-height: 1.2; font-weight: 700; }
.body-light { font-family: var(--font-body); font-size: 22px; font-weight: 300; }
.caption { font-family: var(--font-body); font-size: 12px; line-height: 1.3; font-weight: 400; }
.imprint { font-family: var(--font-body); font-size: 9px; line-height: 1.3; font-weight: 400; }