/* Generated from design/tokens.json. Do not edit by hand. */
@font-face {
  font-family: "IBM Plex Sans";
  src: url("/fonts/IBMPlexSans-Variable.woff2") format("woff2");
  font-weight: 100 700;
  font-display: swap;
}

:root {
  --ink: #0B2545;
  --blueprint: #0369A1;
  --sky: #38BDF8;
  --mist: #EEF6FC;
  --paper: #FFFFFF;
  --amber: #F59E0B;
  --slate: #5B6B82;
  --hairline: #D6E4F0;
  --grid: rgba(3,105,161,0.07);
  --success: #15803D;
  --danger: #B91C1C;
  --warning: #92400E;
  --hero-deep: #183361;
  --hero-mid: #224787;
  --hero-lift: #3E66A8;
  --channel-voice: #0369A1;
  --channel-whatsapp: #15803D;
  --channel-sms: #7C3AED;
  --channel-web: #0E7490;
  --brand-apple-black: #000000;
  --brand-apple-white: #FFFFFF;
  --brand-google-blue: #4285F4;
  --brand-google-red: #EA4335;
  --brand-google-yellow: #FBBC05;
  --brand-google-green: #34A853;
  --brand-google-light-fill: #FFFFFF;
  --brand-google-light-stroke: #747775;
  --brand-google-light-text: #1F1F1F;
  --brand-google-dark-fill: #131314;
  --brand-google-dark-stroke: #8E918F;
  --brand-google-dark-text: #E3E3E3;
  --channel-voice-on-dark: #7DD3FC;
  --channel-whatsapp-on-dark: #4ADE80;
  --channel-sms-on-dark: #C4B5FD;
  --channel-web-on-dark: #67E8F9;
  /* The light palette under fixed names, for what stays light in the dark appearance: the account
     card that holds Apple's and Google's buttons, and the quote preview (paper). */
  --light-ink: #0B2545;
  --light-blueprint: #0369A1;
  --light-sky: #38BDF8;
  --light-mist: #EEF6FC;
  --light-paper: #FFFFFF;
  --light-amber: #F59E0B;
  --light-slate: #5B6B82;
  --light-hairline: #D6E4F0;
  --light-grid: rgba(3,105,161,0.07);
  --light-success: #15803D;
  --light-danger: #B91C1C;
  --light-warning: #92400E;
  --light-hero-deep: #183361;
  --light-hero-mid: #224787;
  --light-hero-lift: #3E66A8;
  --night: #0A1628;
  --panel: #10213A;
  --ink-on-dark: #E6EEF7;
  --slate-on-dark: #8FA3BC;
  --hairline-on-dark: #1E3554;
  --success-on-dark: #4ADE80;
  --danger-on-dark: #FCA5A5;
  --warning-on-dark: #FCD34D;
  --grid-on-dark: rgba(56,189,248,0.08);
  --hero-deep-on-dark: #06101F;
  --hero-mid-on-dark: #0C1D38;
  --hero-lift-on-dark: #163562;
  --font-family: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --line-body: 1.5;
  --line-heading: 1.15;
  --font-2xs: 12px;
  --font-xs: 14px;
  --font-sm: 16px;
  --font-md: 18px;
  --font-lg: 22px;
  --font-xl: 28px;
  --font-2xl: 36px;
  --font-3xl: 48px;
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-48: 48px;
  --space-64: 64px;
  --radius-input: 6px;
  --radius-button: 10px;
  --radius-panel: 14px;
  --radius-sheet: 20px;
  --shadow-rest: 0 1px 2px rgba(11,37,69,0.06), 0 8px 20px rgba(11,37,69,0.08);
  --shadow-raised: 0 2px 6px rgba(11,37,69,0.07), 0 16px 36px rgba(11,37,69,0.12);
  --shadow-float: 0 16px 40px rgba(11,37,69,0.18), 0 2px 8px rgba(11,37,69,0.08);
  --focus-width: 3px;
  --focus-offset: 2px;
  --tap-target: 44px;
  --tap-floor: 48px;
  --press-opacity: 0.6;
  --bg: var(--mist);
  --surface: var(--paper);
  --text: var(--ink);
  --muted: var(--slate);
  --line: var(--hairline);
  --grid-line: var(--grid);
  --ok: var(--success);
  --bad: var(--danger);
  --warn: var(--warning);
  --primary: var(--blueprint);
  --on-primary: var(--paper);
  --on-bad: var(--paper);
  color-scheme: light;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: var(--night);
  --surface: var(--panel);
  --text: var(--ink-on-dark);
  --muted: var(--slate-on-dark);
  --line: var(--hairline-on-dark);
  --grid-line: var(--grid-on-dark);
  --ok: var(--success-on-dark);
  --bad: var(--danger-on-dark);
  --warn: var(--warning-on-dark);
  --blueprint: var(--sky);
  --ink: var(--ink-on-dark);
  --primary: var(--sky);
  --on-primary: var(--night);
  --on-bad: var(--night);
  --hero-deep: var(--hero-deep-on-dark);
  --hero-mid: var(--hero-mid-on-dark);
  --hero-lift: var(--hero-lift-on-dark);
  --channel-voice: var(--channel-voice-on-dark);
  --channel-whatsapp: var(--channel-whatsapp-on-dark);
  --channel-sms: var(--channel-sms-on-dark);
  --channel-web: var(--channel-web-on-dark);
  --shadow-rest: 0 1px 2px rgba(0,0,0,0.40), 0 10px 24px rgba(0,0,0,0.32);
  --shadow-raised: 0 4px 10px rgba(0,0,0,0.45), 0 18px 40px rgba(0,0,0,0.40);
  --shadow-float: 0 18px 44px rgba(0,0,0,0.55), 0 2px 8px rgba(0,0,0,0.35);
}

@media (prefers-color-scheme: dark) {
  :root[data-theme="system"] {
    color-scheme: dark;
    --bg: var(--night);
    --surface: var(--panel);
    --text: var(--ink-on-dark);
    --muted: var(--slate-on-dark);
    --line: var(--hairline-on-dark);
    --grid-line: var(--grid-on-dark);
    --ok: var(--success-on-dark);
    --bad: var(--danger-on-dark);
    --warn: var(--warning-on-dark);
    --blueprint: var(--sky);
    --ink: var(--ink-on-dark);
    --primary: var(--sky);
    --on-primary: var(--night);
    --on-bad: var(--night);
    --hero-deep: var(--hero-deep-on-dark);
    --hero-mid: var(--hero-mid-on-dark);
    --hero-lift: var(--hero-lift-on-dark);
    --channel-voice: var(--channel-voice-on-dark);
    --channel-whatsapp: var(--channel-whatsapp-on-dark);
    --channel-sms: var(--channel-sms-on-dark);
    --channel-web: var(--channel-web-on-dark);
    --shadow-rest: 0 1px 2px rgba(0,0,0,0.40), 0 10px 24px rgba(0,0,0,0.32);
    --shadow-raised: 0 4px 10px rgba(0,0,0,0.45), 0 18px 40px rgba(0,0,0,0.40);
    --shadow-float: 0 18px 44px rgba(0,0,0,0.55), 0 2px 8px rgba(0,0,0,0.35);
  }
}