/* GENERATED by design/build-tokens.mjs from design/tokens.json. Edit the JSON, then rerun.
   Light is the default (Quetzal is light-first). Dark follows the OS unless
   <html data-theme="light|dark"> forces a mode. Font URLs are relative to this
   file: ship design/fonts/ next to it (see design/DESIGN.md, "Font loading"). */

@font-face {
  font-family: "Geist";
  src: url("fonts/Geist-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "Geist Mono";
  src: url("fonts/GeistMono-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: block;
}

:root {
  color-scheme: light;
  --font-sans: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", SFMono-Regular, Menlo, monospace;

  /* colour */
  --c-ground: #FFFFFF;
  --c-canvas: #F3F4F8;
  --c-tile: #F3F3F3;
  --c-card: #FFFFFF;
  --c-field: #EEEEEE;
  --c-field-pressed: #E2E2E2;
  --c-divider: #E2E2E2;
  --c-hairline: rgba(0,0,0,0.07);
  --c-separator: rgba(0,0,0,0.08);
  --c-pressed-overlay: rgba(0,0,0,0.04);
  --c-text-primary: #000000;
  --c-text-secondary: #5E5E66;
  --c-text-tertiary: #8E8E93;
  --c-placeholder: #8E8E93;
  --c-text-on-ink: #FFFFFF;
  --c-text-on-ink-secondary: rgba(255,255,255,0.65);
  --c-fill-on-ink: rgba(255,255,255,0.10);
  --c-action: #000000;
  --c-action-text: #FFFFFF;
  --c-action-pressed: #38383D;
  --c-action-disabled: #C6C6C6;
  --c-ink-from: #38383D;
  --c-ink-mid: #141416;
  --c-ink-to: #000000;
  --c-ink-thumb-ring: #1A1A1C;
  --c-accent: #006F4F;
  --c-accent-wash: rgba(0,111,79,0.10);
  --c-accent-on-ink: #2EE6A6;
  --c-switch-on-ink: #0A8A63;
  --c-copper: #691E07;
  --c-bronze: #8A5A1C;
  --c-warning: #A33A12;
  --c-warning-wash: rgba(163,58,18,0.10);
  --c-danger: #D1301F;
  --c-danger-wash: rgba(209,48,31,0.10);
  --c-success: #006F4F;
  --c-info: #0A84FF;
  --c-record: #E5372B;
  --c-record-hi: #FF6B5E;
  --c-switch-off-track: #E5E5EA;
  --c-scrim: rgba(0,0,0,0.25);
  --c-scrim-dialog: rgba(0,0,0,0.45);
  --c-glass-fallback: rgba(255,255,255,0.92);
  --c-glass-border: rgba(0,0,0,0.08);
  --c-glass-inset: rgba(255,255,255,0.70);
  --c-sidebar-from: #0B0B0C;
  --c-sidebar-to: #17171A;
  --c-sidebar-muted: rgba(255,255,255,0.72);
  --c-sidebar-chip: rgba(255,255,255,0.16);
  --c-sidebar-dot: #3CCF91;
  --g-ink: linear-gradient(135deg, var(--c-ink-from) 0%, var(--c-ink-mid) 48%, var(--c-ink-to) 100%);
  --g-record: linear-gradient(148deg, var(--c-record-hi) 0%, var(--c-record) 100%);

  /* type: font shorthand + tracking per role */
  --t-large-title: 800 30px/1.3 var(--font-sans);
  --t-large-title-tracking: -1.2px;
  --t-title: 800 26px/1.3 var(--font-sans);
  --t-title-tracking: -0.9px;
  --t-number-large: 800 28px/1.3 var(--font-sans);
  --t-number-large-tracking: -1.2px;
  --t-question: 800 24px/1.25 var(--font-sans);
  --t-question-tracking: -0.6px;
  --t-number: 800 24px/1.3 var(--font-sans);
  --t-number-tracking: -1px;
  --t-section: 700 20px/1.3 var(--font-sans);
  --t-section-tracking: -0.5px;
  --t-card-heading: 600 18px/1.3 var(--font-sans);
  --t-card-heading-tracking: -0.2px;
  --t-hero-line: 800 18px/1.3 var(--font-sans);
  --t-hero-line-tracking: -0.45px;
  --t-nav-title: 700 17px/1.3 var(--font-sans);
  --t-nav-title-tracking: -0.3px;
  --t-card-title: 700 16px/1.3 var(--font-sans);
  --t-card-title-tracking: -0.25px;
  --t-button: 700 16px/1.3 var(--font-sans);
  --t-button-tracking: 0px;
  --t-row-label: 600 16px/1.3 var(--font-sans);
  --t-row-label-tracking: 0px;
  --t-row-value: 500 16px/1.3 var(--font-sans);
  --t-row-value-tracking: 0px;
  --t-body-large: 500 16px/1.375 var(--font-sans);
  --t-body-large-tracking: 0px;
  --t-label: 600 15px/1.3 var(--font-sans);
  --t-label-tracking: 0px;
  --t-body: 500 15px/1.3 var(--font-sans);
  --t-body-tracking: 0px;
  --t-callout: 500 15px/1.4 var(--font-sans);
  --t-callout-tracking: 0px;
  --t-pill: 700 14px/1.3 var(--font-sans);
  --t-pill-tracking: 0px;
  --t-small: 600 13px/1.3 var(--font-sans);
  --t-small-tracking: 0px;
  --t-micro: 600 12px/1.3 var(--font-sans);
  --t-micro-tracking: 0px;
  --t-kicker: 700 12px/1.3 var(--font-sans);
  --t-kicker-tracking: 0.6px;
  --t-mono: 400 14px/1.4 var(--font-mono);
  --t-mono-tracking: 0px;

  /* space */
  --s-xxs: 2px;
  --s-xs: 4px;
  --s-s: 6px;
  --s-m: 8px;
  --s-gap: 10px;
  --s-l: 12px;
  --s-tile-pad: 14px;
  --s-gutter: 16px;
  --s-screen-inset: 20px;
  --s-section: 24px;
  --s-xl: 32px;

  /* radius (mobile scale; --r-web-* is Quetzal web's denser desktop scale) */
  --r-xs: 8px;
  --r-s: 11px;
  --r-m: 12px;
  --r-control: 14px;
  --r-row: 16px;
  --r-tile: 20px;
  --r-card: 22px;
  --r-ink: 26px;
  --r-pill: 999px;
  --r-web-control: 10px;
  --r-web-card: 16px;
  --r-web-chip: 10px;
  --r-web-sm: 8px;
  --r-web-md: 12px;
  --r-web-lg: 16px;

  /* elevation */
  --sh-card: 0 8px 32px rgba(0,0,0,0.12);
  --sh-row-card: 0 10px 26px rgba(0,0,0,0.10);
  --sh-glass: 0 10px 36px rgba(0,0,0,0.18);
  --sh-ink: 0 14px 40px rgba(0,0,0,0.40);
  --sh-segment-thumb: 0 2px 12px rgba(0,0,0,0.10);
  --sh-media: 0 8px 24px rgba(0,0,0,0.30);
  --sh-web-card: 0 1px 2px rgba(16,24,40,0.04), 0 12px 28px -22px rgba(16,24,40,0.18);
  --sh-web-raised: 0 2px 6px rgba(16,24,40,0.06), 0 22px 48px -24px rgba(16,24,40,0.30);

  /* size / hit targets */
  --size-min-hit: 44px;
  --size-icon-button: 40px;
  --size-button: 52px;
  --size-button-compact: 44px;
  --size-button-first-run: 50px;
  --size-ink-pill: 42px;
  --size-pill-small: 36px;
  --size-chip: 36px;
  --size-pill: 32px;
  --size-status-pill: 28px;
  --size-segment-height: 34px;
  --size-segment-track-padding: 3px;
  --size-composer-min: 52px;
  --size-composer-max: 140px;
  --size-send-button: 40px;
  --size-remove-badge: 22px;
  --size-avatar: 36px;
  --size-avatar-large: 50px;
  --size-assistant-mark: 24px;
  --size-thumb: 52px;
  --size-thumb-tall: 72px;
  --size-status-dot: 7px;
  --size-kpi-min-height: 92px;
  --size-header-height: 52px;
  --size-switch-width: 51px;
  --size-switch-height: 31px;
  --size-switch-thumb: 27px;
  --size-web-button: 40px;
  --size-web-button-sm: 36px;
  --size-web-button-lg: 44px;
  --size-web-icon-button: 40px;
  --size-web-switch-width: 44px;
  --size-web-switch-height: 24px;
  --size-web-rail-collapsed: 72px;
  --size-web-rail-expanded: 216px;
  --size-web-toast-width: 360px;
  --size-web-dialog-width: 420px;

  /* opacity */
  --o-pressed-card: 0.85;
  --o-pressed-tile: 0.7;
  --o-pressed-row: 0.6;
  --o-pressed-ink-card: 0.9;
  --o-disabled: 0.4;
  --o-send-disabled: 0.35;
  --o-web-disabled: 0.45;

  /* motion */
  --dur-instant: 140ms;
  --dur-fast: 150ms;
  --dur-base: 200ms;
  --dur-cover: 180ms;
  --dur-check: 260ms;
  --dur-rise: 400ms;
  --dur-entrance: 450ms;
  --dur-rise-slow: 600ms;
  --dur-toast: 4200ms;
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-emphasized: cubic-bezier(0.22, 1, 0.36, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --c-ground: #000000;
    --c-canvas: #0A0A0B;
    --c-tile: #2C2C2E;
    --c-card: #1C1C1E;
    --c-field: #2C2C2E;
    --c-field-pressed: #454547;
    --c-divider: rgba(255,255,255,0.12);
    --c-hairline: rgba(255,255,255,0.10);
    --c-separator: rgba(255,255,255,0.12);
    --c-pressed-overlay: rgba(255,255,255,0.12);
    --c-text-primary: #FFFFFF;
    --c-text-secondary: #A1A1AA;
    --c-text-tertiary: #8E8E93;
    --c-placeholder: #8E8E93;
    --c-text-on-ink: #FFFFFF;
    --c-text-on-ink-secondary: rgba(255,255,255,0.65);
    --c-fill-on-ink: rgba(255,255,255,0.10);
    --c-action: #FFFFFF;
    --c-action-text: #000000;
    --c-action-pressed: #D6D6D6;
    --c-action-disabled: #3A3A3C;
    --c-ink-from: #45454C;
    --c-ink-mid: #404046;
    --c-ink-to: #3A3A40;
    --c-ink-thumb-ring: #3A3A40;
    --c-accent: #12A374;
    --c-accent-wash: rgba(18,163,116,0.10);
    --c-accent-on-ink: #2EE6A6;
    --c-switch-on-ink: #0A8A63;
    --c-copper: #CF6A3E;
    --c-bronze: #CF6A3E;
    --c-warning: #CF6A3E;
    --c-warning-wash: rgba(207,106,62,0.10);
    --c-danger: #FF453A;
    --c-danger-wash: rgba(255,69,58,0.10);
    --c-success: #12A374;
    --c-info: #0A84FF;
    --c-record: #E5372B;
    --c-record-hi: #FF6B5E;
    --c-switch-off-track: rgba(255,255,255,0.14);
    --c-scrim: rgba(0,0,0,0.25);
    --c-scrim-dialog: rgba(0,0,0,0.45);
    --c-glass-fallback: rgba(28,28,30,0.92);
    --c-glass-border: rgba(255,255,255,0.12);
    --c-glass-inset: rgba(255,255,255,0.09);
    --c-sidebar-from: #45454C;
    --c-sidebar-to: #3A3A40;
    --c-sidebar-muted: rgba(255,255,255,0.68);
    --c-sidebar-chip: rgba(255,255,255,0.14);
    --c-sidebar-dot: #3CCF91;
    --sh-card: 0 8px 32px rgba(0,0,0,0.60);
    --sh-row-card: 0 10px 26px rgba(0,0,0,0.60);
    --sh-glass: 0 10px 36px rgba(0,0,0,0.60);
    --sh-ink: 0 14px 40px rgba(0,0,0,0.70);
    --sh-segment-thumb: 0 2px 12px rgba(0,0,0,0.50);
    --sh-media: 0 8px 24px rgba(0,0,0,0.60);
    --sh-web-card: 0 1px 2px rgba(0,0,0,0.40), 0 12px 28px -22px rgba(0,0,0,0.60);
    --sh-web-raised: 0 2px 8px rgba(0,0,0,0.50), 0 24px 50px -24px rgba(0,0,0,0.70);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --c-ground: #000000;
  --c-canvas: #0A0A0B;
  --c-tile: #2C2C2E;
  --c-card: #1C1C1E;
  --c-field: #2C2C2E;
  --c-field-pressed: #454547;
  --c-divider: rgba(255,255,255,0.12);
  --c-hairline: rgba(255,255,255,0.10);
  --c-separator: rgba(255,255,255,0.12);
  --c-pressed-overlay: rgba(255,255,255,0.12);
  --c-text-primary: #FFFFFF;
  --c-text-secondary: #A1A1AA;
  --c-text-tertiary: #8E8E93;
  --c-placeholder: #8E8E93;
  --c-text-on-ink: #FFFFFF;
  --c-text-on-ink-secondary: rgba(255,255,255,0.65);
  --c-fill-on-ink: rgba(255,255,255,0.10);
  --c-action: #FFFFFF;
  --c-action-text: #000000;
  --c-action-pressed: #D6D6D6;
  --c-action-disabled: #3A3A3C;
  --c-ink-from: #45454C;
  --c-ink-mid: #404046;
  --c-ink-to: #3A3A40;
  --c-ink-thumb-ring: #3A3A40;
  --c-accent: #12A374;
  --c-accent-wash: rgba(18,163,116,0.10);
  --c-accent-on-ink: #2EE6A6;
  --c-switch-on-ink: #0A8A63;
  --c-copper: #CF6A3E;
  --c-bronze: #CF6A3E;
  --c-warning: #CF6A3E;
  --c-warning-wash: rgba(207,106,62,0.10);
  --c-danger: #FF453A;
  --c-danger-wash: rgba(255,69,58,0.10);
  --c-success: #12A374;
  --c-info: #0A84FF;
  --c-record: #E5372B;
  --c-record-hi: #FF6B5E;
  --c-switch-off-track: rgba(255,255,255,0.14);
  --c-scrim: rgba(0,0,0,0.25);
  --c-scrim-dialog: rgba(0,0,0,0.45);
  --c-glass-fallback: rgba(28,28,30,0.92);
  --c-glass-border: rgba(255,255,255,0.12);
  --c-glass-inset: rgba(255,255,255,0.09);
  --c-sidebar-from: #45454C;
  --c-sidebar-to: #3A3A40;
  --c-sidebar-muted: rgba(255,255,255,0.68);
  --c-sidebar-chip: rgba(255,255,255,0.14);
  --c-sidebar-dot: #3CCF91;
  --sh-card: 0 8px 32px rgba(0,0,0,0.60);
  --sh-row-card: 0 10px 26px rgba(0,0,0,0.60);
  --sh-glass: 0 10px 36px rgba(0,0,0,0.60);
  --sh-ink: 0 14px 40px rgba(0,0,0,0.70);
  --sh-segment-thumb: 0 2px 12px rgba(0,0,0,0.50);
  --sh-media: 0 8px 24px rgba(0,0,0,0.60);
  --sh-web-card: 0 1px 2px rgba(0,0,0,0.40), 0 12px 28px -22px rgba(0,0,0,0.60);
  --sh-web-raised: 0 2px 8px rgba(0,0,0,0.50), 0 24px 50px -24px rgba(0,0,0,0.70);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-instant: 0.01ms;
    --dur-fast: 0.01ms;
    --dur-base: 0.01ms;
    --dur-cover: 0.01ms;
    --dur-check: 0.01ms;
    --dur-rise: 0.01ms;
    --dur-entrance: 0.01ms;
    --dur-rise-slow: 0.01ms;
  }
}