:root {
  color-scheme: light;

  --c-abyss: #061530;
  --c-navy: #0A1F44;
  --c-navy-soft: #12315F;
  --c-brand: #1D6FE0;
  --c-brand-deep: #1553B0;
  --c-azure: #3B9EFF;
  --c-sky: #7CC4FF;
  --c-ice: #D8ECFF;
  --c-mist: #EEF6FF;
  --c-white: #FFFFFF;
  --c-ink: #0B1B33;
  --c-ink-2: #48607F;
  --c-ink-3: #94A9C4;
  --c-ok: #12A57A;
  --c-warn: #E0A21D;
  --c-err: #DC3B4B;

  --c-on-dark: #FFFFFF;
  --c-on-dark-2: #C6DCF5;
  --c-on-dark-3: #9FBBDC;
  --c-on-dark-4: #7E9BBE;
  --c-line-dark: rgba(124, 196, 255, .18);
  --c-line-light: #D8ECFF;
  --c-line-soft: #E3EFFC;

  --c-surface-dark: #071B36;
  --c-surface-dark-2: #0E2A55;
  --c-surface-deep: #04101F;
  --c-field-bg: #F8FBFF;
  --c-ok-deep: #0C7C5C;
  --c-warn-deep: #8A6208;
  --c-err-deep: #C22C3B;
  --c-ok-bg: #F5FCF9;
  --c-warn-bg: #FFFAF0;
  --c-err-bg: #FFF7F8;

  --c-glass-dark: rgba(4, 16, 31, .62);
  --c-glass-light: rgba(255, 255, 255, .045);
  --c-veil-dark: rgba(4, 16, 31, .78);
  --c-scrim: rgba(4, 14, 28, .93);
  --c-overlay: rgba(6, 21, 48, .74);
  --c-tint-azure: rgba(59, 158, 255, .12);
  --c-tint-brand: rgba(29, 111, 224, .13);
  --c-track-dark: rgba(124, 196, 255, .08);
  --c-track-light: rgba(255, 255, 255, .2);

  --g-brand: linear-gradient(135deg, #1D6FE0 0%, #3B9EFF 55%, #7CC4FF 100%);
  --g-brand-hover: linear-gradient(135deg, #1553B0 0%, #1D6FE0 55%, #3B9EFF 100%);
  --g-logo: linear-gradient(135deg, #1D6FE0 0%, #7CC4FF 100%);
  --g-deep: linear-gradient(135deg, #0A1F44 0%, #133A6B 55%, #0E2A55 100%);
  --g-hero: radial-gradient(1200px 600px at 15% 0%, #0E2A55 0%, #061530 60%, #04101F 100%);
  --g-progress: linear-gradient(90deg, #1D6FE0 0%, #7CC4FF 100%);
  --g-veil: linear-gradient(180deg, rgba(4, 16, 31, .15) 0%, rgba(4, 16, 31, .05) 45%, rgba(4, 16, 31, .82) 100%);

  --ctx-text: var(--c-ink);
  --ctx-muted: var(--c-ink-2);
  --ctx-soft: var(--c-ink-3);
  --ctx-accent: var(--c-brand);
  --ctx-line: var(--c-line-light);
  --ctx-surface: var(--c-white);

  --f-head: 'Manrope', 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --f-body: 'Golos Text', 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --f-mono: ui-monospace, 'Cascadia Mono', 'Segoe UI Mono', Consolas, 'Liberation Mono', monospace;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-black: 800;

  --lh-tight: 1.12;
  --lh-head: 1.2;
  --lh-snug: 1.35;
  --lh-base: 1.6;
  --lh-relaxed: 1.7;

  --lh-hero: 1.08;

  --ls-hero: -0.03em;
  --ls-tight: -0.025em;
  --ls-head: -0.02em;
  --ls-flat: 0;
  --ls-wide: 0.06em;
  --ls-caps: 0.1em;

  --fs-hero: clamp(1.0625rem, min(0.5rem + 5.2vw, 1.5rem + 2vw), 4rem);
  --fs-h1: clamp(1rem, min(0.531rem + 4.167vw, 1.269rem + 1.356vw), 2.625rem);
  --fs-h2: clamp(0.875rem, min(0.453rem + 3.75vw, 1.148rem + 1.102vw), 2.25rem);
  --fs-h3: clamp(0.8125rem, min(0.453rem + 2.917vw, 1.074rem + 0.551vw), 1.625rem);
  --fs-lead: clamp(0.719rem, min(0.297rem + 2.917vw, 0.996rem + 0.254vw), 1.25rem);
  --fs-base: clamp(0.6875rem, min(0.219rem + 2.833vw, 0.938rem + 0.093vw), 1.031rem);
  --fs-sm: clamp(0.625rem, min(0.313rem + 2vw, 0.815rem + 0.085vw), 0.9rem);
  --fs-xs: clamp(0.625rem, min(0.313rem + 1.667vw, 0.728rem + 0.085vw), 0.8125rem);

  --sp-1: clamp(0.1875rem, min(0.031rem + 0.833vw, 0.228rem + 0.085vw), 0.3125rem);
  --sp-2: clamp(0.3125rem, min(1.667vw, 0.393rem + 0.169vw), 0.5625rem);
  --sp-3: clamp(0.4375rem, min(0.1875rem + 1.667vw, 0.558rem + 0.254vw), 0.8125rem);
  --sp-4: clamp(0.5625rem, min(0.156rem + 2.5vw, 0.701rem + 0.424vw), 1.125rem);
  --sp-5: clamp(0.6875rem, min(0.125rem + 3.333vw, 0.867rem + 0.508vw), 1.375rem);
  --sp-6: clamp(0.75rem, min(0.094rem + 4.167vw, 1.01rem + 0.678vw), 1.6875rem);
  --sp-7: clamp(0.9375rem, min(0.031rem + 5.833vw, 1.318rem + 0.932vw), 2.25rem);
  --sp-8: clamp(1.125rem, min(0.1875rem + 6.667vw, 1.604rem + 1.271vw), 2.875rem);
  --sp-9: clamp(1.375rem, min(0.3125rem + 8.333vw, 2.011rem + 1.864vw), 3.875rem);
  --sp-10: clamp(1.625rem, min(0.0625rem + 11.667vw, 2.413rem + 2.712vw), 5.125rem);
  --sp-11: clamp(2rem, min(0.375rem + 13.333vw, 2.852rem + 3.898vw), 6.75rem);
  --sp-12: clamp(2.5rem, min(1.0625rem + 15vw, 3.576rem + 5.424vw), 9rem);

  --container-max: 1680px;
  --container-narrow: 62.5rem;
  --container-pad: clamp(0.5rem, min(0.0625rem + 5vw, 0.263rem + 4.237vw), 4.5rem);

  --header-h: clamp(2.75rem, min(2.3125rem + 5vw, 3.047rem + 2.203vw), 5.25rem);
  --tap: 44px;
  --playlist-w: 384px;
  --playlist-w-lg: 320px;

  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 11px;
  --r-lg: 18px;
  --r-xl: 22px;
  --r-2xl: 26px;
  --r-pill: 999px;

  --bw-hair: 1px;
  --bw-field: 1.5px;
  --bw-thick: 2px;

  --sh-card: 0 1px 2px rgba(11, 27, 51, .04), 0 10px 28px rgba(11, 27, 51, .06);
  --sh-raised: 0 18px 44px rgba(11, 27, 51, .14);
  --sh-player: 0 30px 70px rgba(2, 10, 24, .6);
  --sh-brand: 0 12px 30px rgba(29, 111, 224, .32);
  --sh-brand-sm: 0 6px 20px rgba(29, 111, 224, .35);
  --sh-modal: 0 40px 90px rgba(2, 10, 24, .45);
  --sh-focus: 0 0 0 4px rgba(29, 111, 224, .13);
  --sh-focus-ok: 0 0 0 4px rgba(18, 165, 122, .13);
  --sh-focus-err: 0 0 0 4px rgba(220, 59, 75, .13);
  --sh-hair-dark: inset 0 1px 0 rgba(255, 255, 255, .06);

  --glow-brand: 0 0 60px rgba(29, 111, 224, .35);
  --glow-azure: 0 0 80px rgba(59, 158, 255, .28);
  --glow-sky-sm: 0 0 24px rgba(124, 196, 255, .22);

  --z-below: -1;
  --z-base: 1;
  --z-raised: 10;
  --z-sticky: 100;
  --z-header: 200;
  --z-dropdown: 300;
  --z-overlay: 400;
  --z-modal: 500;
  --z-toast: 600;

  --dur-instant: 80ms;
  --dur-fast: 140ms;
  --dur-base: 220ms;
  --dur-slow: 380ms;
  --dur-slower: 600ms;

  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --ease-in: cubic-bezier(.55, .06, .68, .19);
  --ease-in-out: cubic-bezier(.65, .05, .36, 1);
  --ease-spring: cubic-bezier(.34, 1.4, .64, 1);
}

@media (min-width: 2000px) {
  :root {
    --fs-hero: clamp(4rem, 0.875rem + 1.7vw, 6.5rem);
    --fs-h1: clamp(2.625rem, 0.75rem + 1.5vw, 4.5rem);
    --fs-h2: clamp(2.25rem, 0.75rem + 1.2vw, 3.75rem);
    --fs-h3: clamp(1.625rem, 0.625rem + 0.8vw, 2.625rem);
    --fs-lead: clamp(1.25rem, 0.5rem + 0.6vw, 2rem);
    --fs-base: clamp(1.031rem, 0.375rem + 0.525vw, 1.6875rem);
    --fs-sm: clamp(0.9rem, 0.3625rem + 0.43vw, 1.4375rem);
    --fs-xs: clamp(0.8125rem, 0.3125rem + 0.4vw, 1.3125rem);

    --sp-1: clamp(0.3125rem, 0.1875rem + 0.1vw, 0.4375rem);
    --sp-2: clamp(0.5625rem, 0.3125rem + 0.2vw, 0.8125rem);
    --sp-3: clamp(0.8125rem, 0.5rem + 0.25vw, 1.125rem);
    --sp-4: clamp(1.125rem, 0.6875rem + 0.35vw, 1.5625rem);
    --sp-5: clamp(1.375rem, 0.8125rem + 0.45vw, 1.9375rem);
    --sp-6: clamp(1.6875rem, 1rem + 0.55vw, 2.375rem);
    --sp-7: clamp(2.25rem, 1.375rem + 0.7vw, 3.125rem);
    --sp-8: clamp(2.875rem, 1.75rem + 0.9vw, 4rem);
    --sp-9: clamp(3.875rem, 2.375rem + 1.2vw, 5.375rem);
    --sp-10: clamp(5.125rem, 3.125rem + 1.6vw, 7.125rem);
    --sp-11: clamp(6.75rem, 4.125rem + 2.1vw, 9.375rem);
    --sp-12: clamp(9rem, 5.5rem + 2.8vw, 12.5rem);

    --header-h: clamp(5.25rem, 3.25rem + 1.6vw, 7.25rem);

    --r-xs: 8px;
    --r-sm: 10px;
    --r-md: 13px;
    --r-lg: 22px;
    --r-xl: 27px;
    --r-2xl: 32px;
  }
}
