:root {
  --vo-blue: #1DACFC;
  --vo-orange: #FA7E02;
  --vo-yellow: #FCBF01;
  --vo-gold: #FAA201;
  --vo-orange-deep: #F96100;
  --vo-navy: #123D59;
  --vo-green: #2FCB7D;
  --vo-coral: #F45C4E;
  --vo-purple: #B679FD;

  --vo-blue-soft: #E8F7FF;
  --vo-blue-tint: #CDEDFE;
  --vo-blue-line: #99DAFE;
  --vo-blue-ink: #0A6594;
  --vo-orange-soft: #FEF2E6;
  --vo-orange-tint: #FEE3C7;
  --vo-orange-line: #FDC58D;
  --vo-orange-ink: #A34D00;
  --vo-yellow-soft: #FFF9E6;
  --vo-yellow-tint: #FEF1C7;
  --vo-yellow-line: #FEE28D;
  --vo-yellow-ink: var(--vo-navy);
  --vo-green-soft: #EAFAF2;
  --vo-green-tint: #D1F4E2;
  --vo-green-line: #A1E8C4;
  --vo-green-ink: #167344;
  --vo-coral-soft: #FEEFED;
  --vo-coral-tint: #FDDBD8;
  --vo-coral-line: #FAB6AF;
  --vo-coral-ink: #B42318;
  --vo-purple-soft: #F8F2FF;
  --vo-purple-tint: #EFE2FF;
  --vo-purple-line: #DEC3FE;
  --vo-purple-ink: #6E33C8;
  --vo-warning: #E08A00;
  --vo-warning-soft: #FFF8EB;
  --vo-warning-tint: #FFF1D6;
  --vo-warning-line: #F5C978;
  --vo-warning-ink: #8A5A00;
  --vo-danger: #C4271B;
  --vo-danger-soft: #FEF2F1;
  --vo-danger-tint: #FEE4E2;
  --vo-danger-line: #F4ABA5;
  --vo-danger-ink: #A61B12;

  --vo-canvas: #EAF5FE;
  --vo-canvas-warm: #FDF3E9;
  --vo-canvas-glass: rgba(234, 245, 254, .86);
  --vo-surface: #FFFFFF;
  --vo-surface-sunken: #F8F9FA;
  --vo-ink: #16303F;
  --vo-ink-soft: #4A6475;
  --vo-ink-mute: #587080;
  --vo-on-color: #FFFFFF;
  --vo-line: rgba(18, 61, 89, .10);
  --vo-line-strong: rgba(18, 61, 89, .20);
  --vo-field-line: #758896;
  --vo-neutral-tint: rgba(18, 61, 89, .07);
  --vo-scrim: rgba(13, 27, 36, .62);
  --vo-medal-silver: #A1B0C6;
  --vo-medal-silver-ring: #BCCCDF;
  --vo-medal-bronze: #BD6D30;
  --vo-medal-bronze-ring: #D3A98E;

  --vo-action: var(--vo-orange);
  --vo-action-hover: var(--vo-orange-deep);
  --vo-reward: var(--vo-gold);
  --vo-focus: var(--vo-blue-ink);

  --vo-font-display: 'Baloo 2', 'Rubik', system-ui, sans-serif;
  --vo-font-body: 'Rubik', system-ui, sans-serif;
  --vo-display-weight: 800;
  --vo-display-tracking: -0.01em;
  --vo-display-leading: 1.08;
  --vo-label-transform: uppercase;
  --vo-label-tracking: .04em;
  --vo-body-leading: 1.6;
  --vo-text-xs: .75rem;
  --vo-text-sm: .875rem;
  --vo-text-md: 1rem;
  --vo-text-lg: 1.125rem;
  --vo-text-xl: 1.375rem;
  --vo-text-2xl: 1.75rem;
  --vo-text-3xl: clamp(2rem, 4.6vw, 3.1rem);
  --vo-text-4xl: clamp(2.2rem, 4.6vw, 3.5rem);
  --vo-weight-regular: 400;
  --vo-weight-medium: 500;
  --vo-weight-bold: 700;

  --vo-space-1: .25rem;
  --vo-space-2: .5rem;
  --vo-space-3: .75rem;
  --vo-space-4: 1rem;
  --vo-space-5: 1.5rem;
  --vo-space-6: 2rem;
  --vo-space-7: 3rem;
  --vo-space-8: 4rem;
  --vo-space-9: 6rem;
  --vo-space-10: 8rem;

  --vo-radius-sm: 10px;
  --vo-radius-md: 16px;
  --vo-radius-lg: 24px;
  --vo-radius-xl: 32px;
  --vo-radius-pill: 999px;

  --vo-shadow-1: 0 1px 2px rgba(18, 61, 89, .06), 0 2px 8px rgba(18, 61, 89, .05);
  --vo-shadow-2: 0 2px 6px rgba(18, 61, 89, .07), 0 10px 24px rgba(18, 61, 89, .08);
  --vo-shadow-3: 0 6px 14px rgba(18, 61, 89, .09), 0 22px 46px rgba(18, 61, 89, .12);
  --vo-shadow-4: 0 12px 28px rgba(18, 61, 89, .12), 0 40px 80px rgba(18, 61, 89, .18);
  --vo-shadow-up: 0 -4px 18px rgba(18, 61, 89, .08);
  --vo-pop-offset: 6px;

  --vo-ease: cubic-bezier(.2, .7, .3, 1);
  --vo-dur-fast: .18s;
  --vo-dur: .25s;
  --vo-dur-slow: .45s;

  --vo-focus-width: 3px;
  --vo-focus-offset: 2px;
  --vo-container: 1180px;
  --vo-gutter: 20px;
  --vo-tap: 44px;
  --vo-z-sticky: 100;
  --vo-z-overlay: 200;
}

/* Each block sets the full set: a nested lang block inherits anything it leaves out from its parent's language. */
:lang(he) {
  --vo-font-display: 'Rubik', system-ui, sans-serif;
  --vo-font-body: 'Rubik', system-ui, sans-serif;
  --vo-display-weight: 800;
  --vo-display-tracking: -0.02em;
  --vo-display-leading: 1.22;
  --vo-label-transform: none;
  --vo-label-tracking: 0;
}

:lang(ar) {
  --vo-font-display: 'Cairo', system-ui, sans-serif;
  --vo-font-body: 'Cairo', system-ui, sans-serif;
  --vo-display-weight: 700;
  --vo-display-tracking: 0;
  --vo-display-leading: 1.45;
  --vo-label-transform: none;
  --vo-label-tracking: 0;
}

:lang(en) {
  --vo-font-display: 'Baloo 2', 'Rubik', system-ui, sans-serif;
  --vo-font-body: 'Rubik', system-ui, sans-serif;
  --vo-display-weight: 800;
  --vo-display-tracking: -0.01em;
  --vo-display-leading: 1.08;
  --vo-label-transform: uppercase;
  --vo-label-tracking: .04em;
}
