/* Vesper Learning — all source colors and fonts are maintained here. */
@import url("https://fonts.googleapis.com/css2?family=Familjen+Grotesk:wght@500;600;700&family=Public+Sans:ital,wght@0,400;0,600;0,700;1,400&family=IBM+Plex+Mono:wght@400;500&family=Patrick+Hand&display=swap");
:root {
  --vesper-navy: #081322;
  --vesper-navy-2: #0c192b;
  --vesper-paper: #f8f9fb;
  --vesper-white: #ffffff;
  --vesper-steel: #90b4e1;
  --font-display: "Familjen Grotesk", sans-serif;
  --font-body: "Public Sans", sans-serif;
  --font-mono: "IBM Plex Mono", monospace;
  --page-bg: #f5f6f8;
  --page-card: #ffffff;
  --page-ink: #16192b;
  --page-muted: #5a6078;
  --page-line: #d9dce5;
  --page-accent: #2b4bff;
  --page-on: #ffffff;
  --page-soft: #e6eaff;
  --page-body: "Public Sans", sans-serif;
  --page-display: "Familjen Grotesk", sans-serif;
  --checkout-bump: #eef0ff;
  --checkout-bump-border: #ff8c55;
  --checkout-divider: #d9dce5;
  --checkout-typo: #d9541a;
}
html[data-design="home"] {
  --night: #081322;
  --night-2: #0c192b;
  --paper: #f8f9fb;
  --white: #ffffff;
  --ink: #152031;
  --ink-soft: #4b5d72;
  --ink-faint: #76869b;
  --on-night: #ffffff;
  --on-night-soft: #cbd3de;
  --on-night-faint: #8ea2bf;
  --steel: #90b4e1;
  --steel-2: #8eb4e8;
  --ember: #ff8c55;
  --hair-dark: rgba(255, 255, 255, 0.08);
  --hair-light: #e2e7ee;
  --sans: "Manrope", Arial, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  color-scheme: dark;
}
html[data-design="sales"] {
  --bg: #f5f6f8;
  --surface: #ffffff;
  --sunk: #eceef3;
  --line: #d9dce5;
  --fg: #16192b;
  --muted: #5a6078;
  --accent: #2b4bff;
  --accent-soft: #e6eaff;
  --on-accent: #ffffff;
  --signal: #e2560c;
  --signal-soft: #fdeee5;
  --good: #127a4a;
  --ink: #16192b;
  --on-ink: #ffffff;
  --on-ink-muted: #b9bed6;
  --hero: #081322;
  --hero-fg: #ffffff;
  --hero-muted: #b9bed6;
  --hero-accent: #8fa2ff;
  --grid: rgba(143, 162, 255, 0.09);
  --tint: #eef1ff;
  --sales-showcase-ink: #0b1028;
  --sales-showcase-muted: #363d5a;
  --sales-showcase-success: #075c3d;
  --display: "Manrope", Arial, sans-serif;
  --body: "Public Sans", ui-sans-serif, system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  html[data-design="sales"]:not([data-theme="light"]) {
    --bg: #0f1120;
    --surface: #171a2c;
    --sunk: #1f2338;
    --line: #2c314a;
    --fg: #eceef8;
    --muted: #9aa0bd;
    --accent: #7d93ff;
    --accent-soft: #232a52;
    --on-accent: #0f1120;
    --signal: #ff8a4c;
    --signal-soft: #3a2418;
    --good: #5fd39a;
    --ink: #232a52;
    --on-ink: #ffffff;
    --on-ink-muted: #c3c8e4;
    --hero: #081322;
    --hero-fg: #ffffff;
    --hero-muted: #b9bed6;
    --hero-accent: #9fb0ff;
    --grid: rgba(143, 162, 255, 0.08);
    --tint: #141a35;
    color-scheme: dark;
  }
}
html[data-design="sales"][data-theme="dark"] {
  --bg: #0f1120;
  --surface: #171a2c;
  --sunk: #1f2338;
  --line: #2c314a;
  --fg: #eceef8;
  --muted: #9aa0bd;
  --accent: #7d93ff;
  --accent-soft: #232a52;
  --on-accent: #0f1120;
  --signal: #ff8a4c;
  --signal-soft: #3a2418;
  --good: #5fd39a;
  --ink: #232a52;
  --on-ink: #ffffff;
  --on-ink-muted: #c3c8e4;
  --hero: #081322;
  --hero-fg: #ffffff;
  --hero-muted: #b9bed6;
  --hero-accent: #9fb0ff;
  --grid: rgba(143, 162, 255, 0.08);
  --tint: #141a35;
  color-scheme: dark;
}
html[data-design="sales"] {
  --hero: #081322;
  --fg: #171b2e;
  --signal: #ff8c55;
  --signal-soft: #fff0e8;
  --accent: #2b4bff;
  --accent-soft: #e9eeff;
}
html[data-design="course"] {
  --bg: #f5f6f8;
  --surface: #ffffff;
  --sunk: #eceef3;
  --line: #d9dce5;
  --fg: #16192b;
  --muted: #5a6078;
  --accent: #2b4bff;
  --accent-soft: #e6eaff;
  --on-accent: #ffffff;
  --signal: #e2560c;
  --signal-soft: #fdeee5;
  --good: #127a4a;
  --good-soft: #e2f4ea;
  --warn: #9a5b00;
  --warn-soft: #fbf0dc;
  --code-bg: #14172a;
  --code-fg: #e8eaf6;
  --display: "Familjen Grotesk", ui-sans-serif, system-ui, sans-serif;
  --body: "Public Sans", ui-sans-serif, system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  html[data-design="course"]:not([data-theme="light"]) {
    --bg: #0f1120;
    --surface: #171a2c;
    --sunk: #1f2338;
    --line: #2c314a;
    --fg: #eceef8;
    --muted: #9aa0bd;
    --accent: #7d93ff;
    --accent-soft: #232a52;
    --on-accent: #0f1120;
    --signal: #ff8a4c;
    --signal-soft: #3a2418;
    --good: #5fd39a;
    --good-soft: #16302a;
    --warn: #f0b960;
    --warn-soft: #33281a;
    --code-bg: #0a0c18;
    --code-fg: #e8eaf6;
    color-scheme: dark;
  }
}
html[data-design="course"][data-theme="dark"] {
  --bg: #0f1120;
  --surface: #171a2c;
  --sunk: #1f2338;
  --line: #2c314a;
  --fg: #eceef8;
  --muted: #9aa0bd;
  --accent: #7d93ff;
  --accent-soft: #232a52;
  --on-accent: #0f1120;
  --signal: #ff8a4c;
  --signal-soft: #3a2418;
  --good: #5fd39a;
  --good-soft: #16302a;
  --warn: #f0b960;
  --warn-soft: #33281a;
  --code-bg: #0a0c18;
  --code-fg: #e8eaf6;
  color-scheme: dark;
}
html[data-design="account"] {
  color-scheme: light;
  --page-bg: #f5f6f9;
  --page-card: #fff;
  --page-ink: #16192b;
  --page-muted: #5a6078;
  --page-line: #d9dce5;
  --page-accent: #2b4bff;
  --page-on: #fff;
  --page-signal: #e2560c;
  --page-soft: #e6eaff;
  --page-display: "Familjen Grotesk", sans-serif;
  --page-body: "Public Sans", sans-serif;
  --checkout-bump: #eef0ff;
  --checkout-bump-border: #ff8c55;
  --checkout-divider: #d9dce5;
  --checkout-typo: #d9541a;
}
@media (prefers-color-scheme: dark) {
  html[data-design="account"] {
    color-scheme: dark;
    --page-bg: #0f1120;
    --page-card: #171a2c;
    --page-ink: #eceef8;
    --page-muted: #9aa0bd;
    --page-line: #2c314a;
    --page-accent: #7d93ff;
    --page-on: #0f1120;
    --page-signal: #ff8a4c;
    --page-soft: #232a52;
    --checkout-bump: #1b2340;
    --checkout-bump-border: #ff8c55;
    --checkout-divider: #2c314a;
    --checkout-typo: #ff8c55;
  }
}
html[data-design="offer"] {
  --bg: #eef0f4;
  --card: #ffffff;
  --line: #d9dce5;
  --ink: #16192b;
  --muted: #5a6078;
  --pale: #c9cdd9;
  --pants: #26305e;
  --accent: #2b4bff;
  --on-accent: #ffffff;
  --signal: #e2560c;
  --track: #f6d9c8;
  --grass: #dcefe3;
  --soft: #e6eaff;
  --display: "Familjen Grotesk", ui-sans-serif, system-ui, sans-serif;
  --body: "Public Sans", ui-sans-serif, system-ui, sans-serif;
  --hand: "Patrick Hand", "Comic Sans MS", cursive;
}
@media (prefers-color-scheme: dark) {
  html[data-design="offer"]:not([data-theme="light"]) {
    --bg: #0f1120;
    --card: #171a2c;
    --line: #2c314a;
    --ink: #eceef8;
    --muted: #9aa0bd;
    --pale: #3a4060;
    --pants: #6f7bb3;
    --accent: #7d93ff;
    --on-accent: #0f1120;
    --signal: #ff8a4c;
    --track: #4a2e22;
    --grass: #1d3329;
    --soft: #232a52;
    color-scheme: dark;
  }
}
html[data-design="offer"][data-theme="dark"] {
  --bg: #0f1120;
  --card: #171a2c;
  --line: #2c314a;
  --ink: #eceef8;
  --muted: #9aa0bd;
  --pale: #3a4060;
  --pants: #6f7bb3;
  --accent: #7d93ff;
  --on-accent: #0f1120;
  --signal: #ff8a4c;
  --track: #4a2e22;
  --grass: #1d3329;
  --soft: #232a52;
  color-scheme: dark;
}
:root {
  --literal-1: #e3e9f2;
  --literal-2: rgba(255, 255, 255, 0.28);
  --literal-3: rgba(255, 255, 255, 0.6);
  --literal-4: #c2cee0;
  --literal-5: rgba(255, 140, 85, 0.18);
  --literal-6: #f5f8fc;
  --literal-7: #0a1525;
  --literal-8: #fff;
  --literal-9: #000;
  --literal-10: rgba(0, 0, 0, 0.733);
  --literal-11: #8a9ab3;
  --literal-12: #a3b0c4;
  --literal-13: #a5b1c0;
  --literal-14: #526780;
  --literal-15: #d9541a;
  --literal-16: #13233b;
  --literal-17: rgba(8, 19, 34, 0.35);
  --literal-18: #eef1f5;
  --literal-19: #cfd6df;
  --literal-20: #dce4ef;
  --literal-21: rgba(142, 180, 232, 0.22);
  --literal-22: #8ea2bf;
  --literal-23: #7fd1a8;
  --literal-24: #61718a;
  --literal-25: #4f6b8c;
  --literal-26: #94a5bc;
  --literal-27: rgba(255, 255, 255, 0.18);
  --literal-28: #98a5b7;
  --literal-29: #a0acbc;
  --literal-30: rgba(91, 118, 255, 0.45);
  --literal-31: rgba(0, 0, 0, 0.8);
  --literal-32: rgba(255, 255, 255, 0.08);
  --literal-33: #0a0e19;
  --literal-34: #0d1117;
  --literal-35: #101530;
  --literal-36: #eef1fb;
  --literal-37: #c6cbe0;
  --literal-38: #6b7393;
  --literal-39: #2fd88a;
  --literal-40: #ff5d6c;
  --literal-41: #7d93ff;
  --literal-42: #ff9f4c;
  --literal-43: #1c2338;
  --literal-44: #151b2c;
  --literal-45: rgba(47, 216, 138, 0.14);
  --literal-46: #1d2540;
  --literal-47: rgba(47, 216, 138, 0.35);
  --literal-48: rgba(255, 93, 108, 0.35);
  --literal-49: rgba(255, 93, 108, 0.13);
  --literal-50: rgba(47, 216, 138, 0.13);
  --literal-51: #05070f;
  --literal-52: #2a3150;
  --literal-53: #1a2033;
  --literal-54: #161c2c;
  --literal-55: rgba(255, 255, 255, 0.14);
  --literal-56: #344eff;
  --literal-57: #eef1ff;
  --literal-58: #e5eaff;
  --literal-59: #ffc09f;
  --literal-60: #aebaff;
  --literal-61: #c1c8ed;
  --literal-62: #111731;
  --literal-63: #b5c4ff;
  --literal-64: #4169ff;
  --literal-65: #263765;
  --literal-66: #d3dcff;
  --literal-67: #7be0af;
  --literal-68: #ccd3ec;
  --literal-69: #1a2857;
  --literal-70: #0b1028;
  --literal-71: #354578;
  --literal-72: #080e1d;
  --literal-73: #445077;
  --literal-74: #dae2fa;
  --literal-75: #0005;
  --literal-76: #9bb0ff;
  --literal-77: #75e5b0;
  --literal-78: #8895b4;
  --literal-79: #111631;
  --literal-80: #bdc7ff;
  --literal-81: #d2d8ef;
  --literal-82: #363d5a;
  --literal-83: #81e6b3;
  --literal-84: #b9c3df;
  --literal-85: #c3cbe5;
  --literal-86: #1a130e;
  --literal-87: #cad3ed;
  --literal-88: #202846;
  --literal-89: #43517a;
  --literal-90: #d9e2ff;
  --literal-91: rgba(255, 153, 95, 0.14);
  --literal-92: rgba(255, 153, 95, 0.45);
  --literal-93: #ffb487;
  --literal-94: #ff995f;
  --literal-95: rgba(255, 153, 95, 0.7);
  --literal-96: rgba(255, 153, 95, 0);
  --literal-97: #26305e;
  --literal-98: #c9cdd9;
  --literal-99: #f6d9c8;
  --literal-100: #0002;
  --literal-101: #ffffff;
}
html[data-design="course"] {
  --course-bg: var(--bg);
  --course-surface: var(--surface);
  --course-line: var(--line);
  --course-fg: var(--fg);
  --course-muted: var(--muted);
  --course-accent: var(--accent);
  --font-display: var(--display);
  --font-body: var(--body);
  --font-mono: var(--mono);
}

/* Compact consent bar: use the shared brand navy, not the sales-page blue. */
:root {
  --cookie-navy: var(--vesper-navy);
  --cookie-bg: var(--vesper-paper);
  --cookie-on: var(--vesper-white);
  --cookie-line: var(--literal-20);
  --cookie-font: var(--font-body);
}

/* Server-rendered email and source-course literals resolve from this shared palette. */
:root {
  --vesper-orange: #ff8c55;
  --course-navy-elevated: #13203a;
  --course-navy-line: #26314f;
  --course-navy-muted: #c8cde0;
  --course-navy-kicker: #9fb0ff;
  --course-navy-success: #7fe0b8;
  --vesper-email-ink: #18212f;
  --vesper-email-font: Arial, sans-serif;
  --vesper-email-heading: var(--vesper-navy);
  --vesper-email-button-background: var(--vesper-navy);
  --vesper-email-button-foreground: var(--vesper-white);
  --vesper-email-badge: var(--vesper-orange);
  --course-source-segment-shadow: rgba(0, 0, 0, 0.12);
  --course-source-copy-border: rgba(255, 255, 255, 0.1);
  --course-source-copy-label: #a3a8c8;
  --course-source-menu-shadow: rgba(0, 0, 0, 0.25);
  --course-source-scrim: rgba(10, 12, 24, 0.45);
}