/* Generated from DesignSystem/design-tokens.json. Do not edit directly. */
:root {
  --color-background-canvas: #061a2e;
  --color-background-deep: #03111f;
  --color-background-canvas-glass: rgba(6, 26, 46, 0.82);
  --color-background-canvas-opaque: rgba(6, 26, 46, 0.97);
  --color-surface-default: #0a263f;
  --color-surface-default-glass: rgba(10, 38, 63, 0.86);
  --color-surface-default-opaque: rgba(10, 38, 63, 0.96);
  --color-surface-subtle: #0a3761;
  --color-surface-subtle-glass: rgba(10, 55, 97, 0.84);
  --color-surface-subtle-opaque: rgba(10, 55, 97, 0.96);
  --color-surface-raised: #104873;
  --color-text-primary: #f5fbfc;
  --color-text-on-accent: #ffffff;
  --color-text-on-media: rgba(255, 255, 255, 0.86);
  --color-text-on-media-muted: rgba(255, 255, 255, 0.52);
  --color-text-secondary: #93a9be;
  --color-text-secondary-tint: rgba(147, 169, 190, 0.16);
  --color-text-inverse: #061a2e;
  --color-text-disabled: #678098;
  --color-border-default: rgba(103, 229, 237, 0.20);
  --color-border-strong: rgba(103, 229, 237, 0.38);
  --color-overlay-scrim: rgba(3, 17, 31, 0.74);
  --color-overlay-scrim-soft: rgba(3, 17, 31, 0.48);
  --color-overlay-scrim-strong: rgba(3, 17, 31, 0.94);
  --color-shadow-soft: rgba(0, 0, 0, 0.18);
  --color-shadow-default: rgba(0, 0, 0, 0.34);
  --color-shadow-strong: rgba(0, 0, 0, 0.40);
  --color-shadow-text: rgba(0, 0, 0, 0.72);
  --color-surface-overlay-subtle: rgba(255, 255, 255, 0.04);
  --color-surface-overlay: rgba(255, 255, 255, 0.06);
  --color-surface-overlay-strong: rgba(255, 255, 255, 0.10);
  --color-surface-overlay-emphasis: rgba(255, 255, 255, 0.12);
  --color-border-on-dark-subtle: rgba(255, 255, 255, 0.14);
  --color-border-on-dark: rgba(255, 255, 255, 0.16);
  --color-border-on-dark-strong: rgba(255, 255, 255, 0.18);
  --color-border-on-dark-emphasis: rgba(255, 255, 255, 0.46);
  --color-brand-primary: #ff9f1c;
  --color-brand-primary-hover: #ffb13b;
  --color-brand-primary-pressed: #e98500;
  --color-brand-cyan: #16c7d9;
  --color-brand-magenta: #ffc857;
  --color-brand-text: #ffc857;
  --color-brand-tint-strong: rgba(255, 159, 28, 0.18);
  --color-brand-surface: rgba(255, 159, 28, 0.12);
  --color-information-surface-soft: rgba(25, 200, 255, 0.10);
  --color-information-surface-subtle: rgba(25, 200, 255, 0.08);
  --color-information-surface: rgba(25, 200, 255, 0.14);
  --color-information-surface-strong: rgba(25, 200, 255, 0.16);
  --color-information-surface-dense: rgba(25, 200, 255, 0.18);
  --color-information-aura: rgba(25, 200, 255, 0.20);
  --color-information-glow: rgba(25, 200, 255, 0.28);
  --color-information-border: rgba(25, 200, 255, 0.36);
  --color-information-border-strong: rgba(25, 200, 255, 0.42);
  --color-information-border-emphasis: rgba(25, 200, 255, 0.58);
  --color-information-emphasis: rgba(25, 200, 255, 0.72);
  --color-promoter-background: #031018;
  --color-promoter-background-mid: #061421;
  --color-promoter-overlay-soft: rgba(3, 16, 24, 0.34);
  --color-promoter-overlay: rgba(3, 16, 24, 0.86);
  --color-promoter-overlay-strong: rgba(3, 16, 24, 0.94);
  --color-promoter-surface: #071b28;
  --color-promoter-surface-subtle: #0b2638;
  --color-promoter-accent: #ff9f1c;
  --color-promoter-border: rgba(255, 159, 28, 0.34);
  --color-promoter-tint: rgba(255, 159, 28, 0.12);
  --color-artist-background: #061a2e;
  --color-artist-background-mid: #08243c;
  --color-artist-overlay-soft: rgba(6, 26, 46, 0.40);
  --color-artist-overlay: rgba(6, 26, 46, 0.86);
  --color-artist-overlay-strong: rgba(3, 17, 31, 0.94);
  --color-artist-surface: #0a263f;
  --color-artist-surface-subtle: #0a3761;
  --color-artist-accent: #ffc857;
  --color-artist-border: rgba(255, 200, 87, 0.34);
  --color-artist-tint: rgba(255, 200, 87, 0.12);
  --color-artist-tint-strong: rgba(255, 200, 87, 0.16);
  --color-artist-aura: rgba(255, 159, 28, 0.18);
  --color-success: #38c770;
  --color-success-text: #b6ffd0;
  --color-success-tint: rgba(56, 199, 112, 0.10);
  --color-success-tint-strong: rgba(56, 199, 112, 0.22);
  --color-success-border: rgba(56, 199, 112, 0.44);
  --color-information: #19c8ff;
  --color-warning: #ffb340;
  --color-warning-tint: rgba(255, 179, 64, 0.15);
  --color-error: #ff6b8b;
  --color-error-text: #ff9aae;
  --color-error-tint: rgba(255, 107, 139, 0.16);
  --color-error-surface: rgba(255, 107, 139, 0.18);
  --color-error-border: rgba(255, 107, 139, 0.46);
  --color-disabled: #777fad;
  --color-commercial-highlight: #ffd566;
  --color-commercial-tint: rgba(255, 213, 102, 0.10);
  --color-commercial-border: rgba(255, 213, 102, 0.45);
  --color-external-auth-google-text: #111111;
  --color-external-auth-google-surface-hover: #f4f4f4;
  --color-external-auth-apple-surface: #000000;
  --color-external-auth-apple-surface-hover: #161616;
  --font-family-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-display-large: clamp(2.75rem, 6vw, 4.5rem);
  --font-display-small: clamp(2.25rem, 4.5vw, 3.5rem);
  --font-heading-h1: clamp(2rem, 3.5vw, 3rem);
  --font-heading-h2: clamp(1.75rem, 3vw, 2.5rem);
  --font-heading-h3: 1.5rem;
  --font-heading-h4: 1.25rem;
  --font-body-large: 1.125rem;
  --font-body-default: 1rem;
  --font-body-small: 0.875rem;
  --font-label-default: 0.875rem;
  --font-label-action: 0.9375rem;
  --font-label-navigation: 0.875rem;
  --font-caption: 0.75rem;
  --font-overline: 0.8125rem;
  --font-code: 0.875rem;
  --line-height-display-large: 1;
  --line-height-display-small: 1.05;
  --line-height-heading-h1: 1.1;
  --line-height-heading-h2: 1.15;
  --line-height-heading-h3: 1.25;
  --line-height-heading-h4: 1.3;
  --line-height-body: 1.5;
  --line-height-body-large: 1.55;
  --line-height-label: 1.35;
  --line-height-action: 1.2;
  --line-height-caption: 1.4;
  --tracking-default: 0;
  --tracking-overline: 0.04em;
}