/* GENERATED by scripts/web/generate.mjs — do not edit.
   Source of truth is src/theme/theme.ts. Re-run the script after changing it. */

:root {
  --color-surface-page: #faf9f6;
  --color-surface-card: #ffffff;
  --color-surface-sunken: #ded9cd;
  --color-surface-plate: #ded9cd;
  --color-surface-scrim: rgba(28, 23, 15, 0.4);
  --color-surface-scrim-warm: rgba(28, 23, 15, 0.239);
  --color-surface-scrim-hero: #1C170F;
  --color-surface-media-backdrop: #0b0b0b;
  --color-surface-tag: #ded9cd;
  --color-surface-pill: #faf9f6;
  --color-surface-well: #faf9f6;
  --color-surface-quote: #f4f2ed;
  --color-surface-tile: #f4f2ed;
  --color-surface-track: #f4f2ed;
  --color-surface-socket: #f4f2ed;
  --color-surface-moonbun-disc: #f4f2ed;
  --color-text-primary: #373328;
  --color-text-secondary: #7a7362;
  --color-text-muted: #7a7362;
  --color-text-quiet: #a3a3a3;
  --color-text-disabled: #c6c0b0;
  --color-text-inverse: #ffffff;
  --color-text-link: #2418e9;
  --color-text-warm: #74642f;
  --color-text-placeholder: #c6c0b0;
  --color-action-primary: #4e53ff;
  --color-action-primary-pressed: #322afd;
  --color-action-on-primary: #ffffff;
  --color-action-danger: #ef4444;
  --color-border-subtle: #e6e6e6;
  --color-border-strong: #d3d3d3;
  --color-border-divider: #ded9cd;
  --color-border-hairline: #f4f2ed;
  --color-border-warm: #c6c0b0;
  --color-border-hero: #c6c0b0;
  --color-border-link: #e7eaff;
  --color-state-waiting-line: #f59e0b;
  --color-state-reconnecting-surface: #fffbeb;
  --color-state-reconnecting-icon: #f59e0b;
  --color-state-reconnecting-meta: #b45309;
  --color-state-pending-surface: #fef3c7;
  --color-state-pending-surface-quiet: #fffbeb;
  --color-state-pending-content: #b45309;
  --color-state-pending-icon: #f59e0b;
  --color-state-pending-icon-quiet: #d3d3d3;
  --color-state-pending-band: #fffbeb;
  --color-state-open-surface: #fef3c7;
  --color-state-open-content: #b45309;
  --color-state-open-icon: #f59e0b;
  --color-state-resolved-surface: #f0fdf4;
  --color-state-resolved-content: #22c55e;
  --color-state-danger-surface: #fef2f2;
  --color-state-danger-border: #ef4444;
  --color-state-danger-content: #b91c1c;
  --color-state-resolved-strong: #15803d;
  --color-option-border-selected: #4e53ff;
  --color-option-surface-selected: #f2f4ff;
  --color-option-check-fill: #4e53ff;
  --color-option-check-off: #faf9f6;
  --color-option-label: #373328;
  --color-option-label-selected: #0a086d;
  --color-option-dot: #ffffff;
  --color-profile-strength-danger: #ef4444;
  --color-profile-strength-warning: #f59e0b;
  --color-profile-strength-success: #22c55e;
  --color-notification-mark-bell: #ef4444;
  --color-notification-mark-row: #fcd34d;
  --color-notification-row-disc: #f4f2ed;
  --color-notification-row-read: #c6c0b0;
  --color-voice-countdown-normal: #7a7362;
  --color-voice-countdown-warning: #f59e0b;
  --color-voice-countdown-danger: #ef4444;
  --color-waveform-paused: #afb9ff;
  --color-play-disc-surface: rgba(255, 255, 255, 0.92);
  --color-play-disc-glyph: #373328;
  --color-glow-warm: #fff7ed;
  --color-glow-cool: #f2f4ff;
  --color-insight-topic-surface: #f2f4ff;
  --color-avatar-initial-surface: #e7eaff;
  --color-avatar-initial-label: #2418e9;
  --color-avatar-empty-surface: #ded9cd;
  --color-avatar-empty-glyph: #7a7362;
  --color-avatar-well-glyph: #ded9cd;
  --color-progress-complete: #4e53ff;
  --color-progress-current: #afb9ff;
  --color-progress-empty: #ded9cd;
  --color-chapter-dots-done: #4e53ff;
  --color-chapter-dots-todo: #c6c0b0;
  --color-hatch-tips-dot-current: #4e53ff;
  --color-hatch-tips-dot-other: #c6c0b0;
  --color-moonbun-feelings-face: #f4f2ed;
  --color-moonbun-feelings-picked-surface: #e7eaff;
  --color-moonbun-feelings-picked-ring: #4e53ff;
  --color-moonbun-feelings-link: #4e53ff;
  --color-moonbun-pill-info: #ded9cd;
  --color-moonbun-ready-ring: #fcd34d;
  --color-moonbun-ready-dot: #4e53ff;
  --color-moonbun-ready-dot-rim: #ffffff;
  --color-moonbun-eat-sparkle: #fcd34d;
  --color-moonbun-about-disc-now: #e7eaff;
  --color-moonbun-about-silhouette: #c6c0b0;
  --color-moonbun-about-now-surface: #e7eaff;
  --color-moonbun-about-now-label: #4e53ff;
  --color-hatch-moment-scrim: rgba(28, 23, 15, 0.6);
  --color-hatch-moment-heading: #ffffff;
  --color-hatch-moment-body: #e6e6e6;
  --color-hatch-moment-bar-fill: #ffffff;
  --color-hatch-moment-bar-track: #ffffff;
  --color-record-type-agreement-surface: #dcfce7;
  --color-record-type-agreement-label: #15803d;
  --color-record-type-agreement-icon: #22c55e;
  --color-record-type-conversation-surface: #ded9cd;
  --color-record-type-conversation-label: #373328;
  --color-record-type-conversation-icon: #7a7362;
  --color-record-type-conflict-surface: #fef3c7;
  --color-record-type-conflict-label: #b45309;
  --color-record-type-conflict-icon: #fcd34d;
  --color-record-status-pending-surface: #fef3c7;
  --color-record-status-pending-content: #b45309;
  --color-record-status-pending-icon: #fcd34d;
  --color-record-status-settled-surface: #dcfce7;
  --color-record-status-settled-content: #15803d;
  --color-record-status-settled-icon: #22c55e;
  --color-button-primary-fill: #4e53ff;
  --color-button-primary-fill-pressed: #322afd;
  --color-button-primary-label: #faf9f6;
  --color-button-danger-fill: #ef4444;
  --color-button-danger-fill-pressed: #b91c1c;
  --color-button-danger-label: #faf9f6;
  --color-button-secondary-fill: #ffffff;
  --color-button-secondary-fill-pressed: #f5f5f5;
  --color-button-secondary-label: #4e53ff;
  --color-button-secondary-label-pressed: #1e14c5;
  --color-button-secondary-icon: #322afd;
  --color-button-text-label: #4e53ff;
  --color-button-text-label-pressed: #0a086d;
  --color-button-text-icon: #322afd;
  --color-slider-groove: #ded9cd;
  --color-slider-fill: #4e53ff;
  --color-slider-knob: #faf9f6;
  --color-slider-stop-passed: #faf9f6;
  --color-slider-stop-ahead: #c6c0b0;
  --color-attribution-you-surface: #f2f4ff;
  --color-attribution-you-label: #2418e9;
  --color-attribution-partner-surface: #faf9f6;
  --color-attribution-partner-label: #7a7362;
  --color-event-created: #7a7362;
  --color-event-proposed: #2418e9;
  --color-event-edited: #b45309;
  --color-event-resolution-written: #b45309;
  --color-event-side-added: #b45309;
  --color-event-confirmed: #22c55e;
  --color-event-closed: #22c55e;
  --color-event-resolution-confirmed: #15803d;
  --color-event-reply-works: #22c55e;
  --color-event-conclusion-written: #b45309;
  --color-event-conclusion-confirmed: #15803d;
  --color-event-superseded: #7a7362;
  --color-pill-surface: #ffffff;
  --color-pill-label: #2418e9;
  --color-pill-brand-surface: #e7eaff;
  --color-pill-brand-label: #2418e9;
  --color-pill-plus-surface: #4e53ff;
  --color-pill-plus-label: #ffffff;
  --color-pill-success-surface: #f0fdf4;
  --color-pill-success-label: #15803d;
  --color-pill-badge-surface: #f2f4ff;
  --color-pill-badge-label: #4e53ff;
  --color-plan-badge-surface: #f59e0b;
  --color-plan-badge-label: #ffffff;
  --color-plan-legal: #8a8a8a;
  --color-settings-row-surface: #ffffff;
  --color-settings-row-icon-pill: #f2f4ff;
  --color-settings-row-icon-glyph: #afb9ff;
  --color-settings-row-title: #373328;
  --color-settings-row-subtitle: #7a7362;
  --color-settings-row-value-text: #000000;
  --color-toggle-track-on: #4e53ff;
  --color-toggle-track-off: #ded9cd;
  --color-toggle-track-disabled: #c6c0b0;
  --color-toggle-knob: #ffffff;
  --color-pairing-row-paired-surface: #f2f4ff;
  --color-pairing-row-paired-meta: #2418e9;
  --color-pairing-row-surface: #ffffff;
  --color-pairing-row-meta: #7a7362;
  --color-nav-pill-surface: #ffffff;
  --color-nav-selected-content: #4e53ff;
  --color-nav-selected-label: #373328;
  --color-nav-content: #a3a3a3;
  --color-nav-band-surface: rgba(255, 255, 255, 0.08);
  --color-journey-ready: #322afd;
  --color-journey-locked: #c6c0b0;
  --color-journey-insight-reminder-surface: #fffbeb;
  --color-journey-insight-reminder-content: #78350f;
  --color-journey-prompt-answered: #86efac;
  --color-journey-prompt-pending-you: #fcd34d;
  --color-journey-prompt-empty: #c6c0b0;
  --color-book-overlay-text: #ffffff;
  --color-book-scrim: #000000;
  --color-book-overlay-shadow: rgba(0, 0, 0, 0.48);
  --color-glass-tint: rgba(255, 255, 255, 0.18);
  --color-glass-border: rgba(255, 255, 255, 0.8);
  --color-backdrop-warm: #ffedd5;
  --color-backdrop-cool: #e7eaff;
  --color-celebration-ground: #f97316;
  --color-celebration-plus-ground: #22c55e;
  --color-celebration-ground-opacity: 0.08;
  --color-celebration-ground-height: 480;
  --color-celebration-seal-number: #ffffff;
  --color-celebration-seal-number-shadow-color: rgba(28, 23, 15, 0.141);
  --color-celebration-seal-number-shadow-offset-y: 6;
  --color-celebration-seal-number-shadow-radius: 14;
  --color-celebration-seal-waiting-opacity: 0.35;
  --color-celebration-rays: #fcd34d;
  --color-celebration-rays-opacity: 0.55;
  --color-celebration-rays-glow: #fef3c7;
  --color-celebration-waiting-ring: #f59e0b;
  --color-celebration-story-fact: #4e53ff;
  --color-energy-gain: #22c55e;
  --color-energy-amount: #373328;
  --color-accent-50: #fff7ed;
  --color-accent-100: #ffedd5;
  --color-accent-200: #fed7aa;
  --color-accent-300: #fdba74;
  --color-accent-400: #fb923c;
  --color-accent-500: #f97316;
  --color-accent-600: #ea580c;
  --color-accent-700: #c2410c;
  --color-accent-800: #9a3412;
  --color-accent-900: #431407;

  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-28: 28px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-56: 56px;
  --space-64: 64px;
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 20px;
  --space-xl: 24px;
  --space-2xl: 32px;
  --space-3xl: 40px;
  --space-4xl: 48px;

  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 999px;
  --radius-full: 999px;

  --duration-fast: 150ms;
  --duration-base: 300ms;
  --duration-slow: 450ms;
  --duration-tick: 600ms;
  --easing-standard: cubic-bezier(0, 0, 0.58, 1);
  --easing-decelerate: cubic-bezier(0.16, 1, 0.3, 1);

  --elevation-subtle: inset 1px 1px 1.5px 0px rgba(255, 252, 245, 0.4), inset -1px -1px 2px 0px rgba(28, 23, 15, 0.051), 0px 1px 2px 0px rgba(28, 23, 15, 0.071);
  --elevation-surface: inset 1px 1px 2px 0px rgba(255, 252, 245, 0.502), inset -1px -2px 3px 0px rgba(28, 23, 15, 0.102), 0px 2px 6px 0px rgba(28, 23, 15, 0.102);
  --elevation-raised: inset 2px 2px 4px 0px rgba(255, 252, 245, 0.549), inset -2px -3px 6px 0px rgba(28, 23, 15, 0.141), 0px 6px 14px -2px rgba(28, 23, 15, 0.141), 0px 2px 4px 0px rgba(28, 23, 15, 0.059);
  --elevation-floating: inset 3px 3px 6px 0px rgba(255, 252, 245, 0.6), inset -3px -4px 8px 0px rgba(28, 23, 15, 0.161), 0px 16px 32px -8px rgba(28, 23, 15, 0.18), 0px 4px 8px 0px rgba(28, 23, 15, 0.078);
  --elevation-pressed: inset 2px 3px 6px 0px rgba(28, 23, 15, 0.078), inset -1px -2px 3px 0px rgba(255, 252, 245, 0.639);
  --elevation-card: inset 2px 2px 4px 0px rgba(255, 252, 245, 0.549), inset -2px -3px 6px 0px rgba(28, 23, 15, 0.141), 0px 6px 14px -2px rgba(28, 23, 15, 0.141), 0px 2px 4px 0px rgba(28, 23, 15, 0.059);
  --elevation-sheet: inset 3px 3px 6px 0px rgba(255, 252, 245, 0.6), inset -3px -4px 8px 0px rgba(28, 23, 15, 0.161), 0px 16px 32px -8px rgba(28, 23, 15, 0.18), 0px 4px 8px 0px rgba(28, 23, 15, 0.078);
  --elevation-nav: inset 3px 3px 6px 0px rgba(255, 252, 245, 0.6), inset -3px -4px 8px 0px rgba(28, 23, 15, 0.161), 0px 16px 32px -8px rgba(28, 23, 15, 0.18), 0px 4px 8px 0px rgba(28, 23, 15, 0.078);
  --elevation-glass: inset 3px 3px 6px 0px rgba(255, 252, 245, 0.6), inset -3px -4px 8px 0px rgba(28, 23, 15, 0.161), 0px 16px 32px -8px rgba(28, 23, 15, 0.18), 0px 4px 8px 0px rgba(28, 23, 15, 0.078);

  --font-regular: "Bricolage Grotesque"; /* BricolageGrotesque16pt-Regular */
  --font-medium: "Bricolage Grotesque"; /* BricolageGrotesque16pt-Medium */
  --font-semibold: "Bricolage Grotesque"; /* BricolageGrotesque16pt-SemiBold */
  --font-bold: "Bricolage Grotesque"; /* BricolageGrotesque16pt-Bold */
}

.t-display {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 56px;
  line-height: 64px;
  font-weight: 700;
}

.t-h1 {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 40px;
  line-height: 48px;
  font-weight: 700;
}

.t-h2 {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 32px;
  line-height: 40px;
  font-weight: 600;
}

.t-h3 {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
}

.t-h4 {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 20px;
  line-height: 28px;
  font-weight: 500;
}

.t-h5 {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 400;
}

.t-body-large {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}

.t-body {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}

.t-body-small {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
}

.t-caption {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
}

.t-label {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}

.t-link {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 16px;
  line-height: 20px;
  font-weight: 500;
}

.t-tagline {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}

.t-tagline-caps {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 13px;
  line-height: 18px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.t-h4-strong {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
}

.t-h5-strong {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 600;
}

.t-body-large-strong {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
}

.t-body-large-bold {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
}

.t-body-strong {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
}

.t-body-large-medium {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}

.t-label-strong {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
}

.t-body-small-medium {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}

.t-body-small-strong {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
}

.t-body-small-bold {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
}

.t-caption-strong {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
}

.t-caption-medium {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
}

.t-nav-label {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 12px;
  line-height: 18px;
  font-weight: 500;
}

.t-nav-label-bold {
  font-family: "Bricolage Grotesque", system-ui, sans-serif;
  font-size: 12px;
  line-height: 18px;
  font-weight: 700;
}