/* My PMOS Mission — design tokens. Generated from tokens.json. Light is default; dark follows the OS unless data-theme is set on <html>. */
:root {
  color-scheme: light dark;
  --berry-600: #9c3765;
  --berry-700: #82294f;
  --berry-100: #f0cfd9;
  --on-berry: #ffffff;
  --cream-50: #fcf7f2;
  --sand-100: #f3ece6;
  --surface-card: #ffffff;
  --peach-200: #f4c7a1;
  --on-peach: #2b1b22;
  --teal-700: #16615f;
  --teal-100: #d5e9e4;
  --ink: #2b1b22;
  --ink-muted: #6f5a60;
  --line: #eaddd8;
  --danger-600: #b3261e;
  --danger-100: #f9e3df;
  --shadow-float: 0 8px 24px rgba(43, 27, 34, 0.08);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 999px;
  --font-display: "Inter Tight", "Inter", system-ui, sans-serif;
  --font-text: "Inter", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --berry-600: #e58ab3;
    --berry-700: #f0a8c8;
    --berry-100: #4a2134;
    --on-berry: #2b1b22;
    --cream-50: #1c1418;
    --sand-100: #140e11;
    --surface-card: #261c21;
    --peach-200: #e0a877;
    --on-peach: #2b1b22;
    --teal-700: #72c7c0;
    --teal-100: #173b3a;
    --ink: #f6edf0;
    --ink-muted: #bfaeb4;
    --line: #3a2c33;
    --danger-600: #f2a196;
    --danger-100: #4a2320;
    --shadow-float: 0 8px 24px rgba(0, 0, 0, 0.45);
  }
}
:root[data-theme="dark"] {
  --berry-600: #e58ab3;
  --berry-700: #f0a8c8;
  --berry-100: #4a2134;
  --on-berry: #2b1b22;
  --cream-50: #1c1418;
  --sand-100: #140e11;
  --surface-card: #261c21;
  --peach-200: #e0a877;
  --on-peach: #2b1b22;
  --teal-700: #72c7c0;
  --teal-100: #173b3a;
  --ink: #f6edf0;
  --ink-muted: #bfaeb4;
  --line: #3a2c33;
  --danger-600: #f2a196;
  --danger-100: #4a2320;
  --shadow-float: 0 8px 24px rgba(0, 0, 0, 0.45);
}

/* Type scale */
.t-display-xl { font-family: var(--font-display); font-size: 64px; line-height: 64px; font-weight: 500; letter-spacing: -2.4px; }
.t-h1 { font-family: var(--font-display); font-size: 48px; line-height: 50px; font-weight: 500; letter-spacing: -1.6px; }
.t-h2 { font-family: var(--font-display); font-size: 34px; line-height: 38px; font-weight: 500; letter-spacing: -1px; }
.t-h3 { font-family: var(--font-display); font-size: 24px; line-height: 30px; font-weight: 500; letter-spacing: -0.5px; }
.t-stat { font-family: var(--font-display); font-size: 40px; line-height: 40px; font-weight: 500; letter-spacing: -1.4px; }
.t-button { font-family: var(--font-display); font-size: 15px; line-height: 20px; font-weight: 500; }
.t-eyebrow { font-family: var(--font-display); font-size: 12px; line-height: 16px; font-weight: 500; }
.t-body-article { font-family: var(--font-text); font-size: 18px; line-height: 30px; font-weight: 400; }
.t-body { font-family: var(--font-text); font-size: 16px; line-height: 26px; font-weight: 400; }
.t-caption { font-family: var(--font-text); font-size: 13px; line-height: 20px; font-weight: 400; }