:root {
  --red-700: #8E0E14;
  --red-600: #B3121A;
  --red-500: #E11B22;
  --red-400: #FF4A3D;
  --red-300: #FF8079;
  --ink-950: #050506;
  --ink-900: #0A0A0B;
  --ink-800: #141416;
  --ink-700: #1C1C1F;
  --ink-600: #26262A;
  --ink-500: #34343A;
  --gray-600: #55555A;
  --gray-500: #6B6B70;
  --gray-400: #9A9AA0;
  --gray-300: #C9C9CE;
  --gray-200: #E4E4E7;
  --gray-100: #F1F1F3;
  --gray-50:  #F7F7F8;
  --white:    #FFFFFF;
  --brand-red: var(--red-500);
  --brand-ink: var(--ink-900);
  --brand-on-red: var(--white);
  --surface:          var(--white);
  --surface-alt:      var(--gray-50);
  --surface-sunken:   var(--gray-100);
  --border:           var(--gray-200);
  --border-strong:    var(--gray-300);
  --surface-dark:         var(--ink-900);
  --surface-dark-raised:  var(--ink-800);
  --surface-dark-high:    var(--ink-700);
  --border-dark:          var(--ink-600);
  --text:          var(--ink-900);
  --text-muted:    var(--gray-600);
  --text-subtle:   var(--gray-500);
  --text-on-dark:        var(--white);
  --text-on-dark-muted:  var(--gray-300);
  --text-on-dark-subtle: var(--gray-400);
  --action:        var(--red-500);
  --action-hover:  var(--red-600);
  --action-on-dark: var(--red-400);
  --focus-ring:    var(--red-500);
  --live:          var(--red-500);
  --live-on-dark:  var(--red-400);
  --font-display: 'Archivo', 'Archivo Fallback', system-ui, sans-serif;
  --font-text:    'Archivo', 'Archivo Fallback', system-ui, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'Cascadia Mono', Menlo, monospace;
  --step--2: clamp(0.694rem, 0.68rem + 0.06vw, 0.75rem);
  --step--1: clamp(0.833rem, 0.80rem + 0.14vw, 0.938rem);
  --step-0:  clamp(1rem, 0.96rem + 0.18vw, 1.125rem);
  --step-1:  clamp(1.2rem, 1.13rem + 0.32vw, 1.44rem);
  --step-2:  clamp(1.44rem, 1.32rem + 0.53vw, 1.85rem);
  --step-3:  clamp(1.73rem, 1.54rem + 0.83vw, 2.37rem);
  --step-4:  clamp(2.07rem, 1.78rem + 1.28vw, 3.05rem);
  --step-5:  clamp(2.49rem, 2.04rem + 1.94vw, 3.9rem);
  --step-6:  clamp(2.99rem, 2.34rem + 2.86vw, 5rem);
  --step-7:  clamp(3.58rem, 2.63rem + 4.15vw, 6.7rem);

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-black: 800;
  --width-display: 108;
  --width-normal: 100;

  --leading-tight: 0.95;
  --leading-snug: 1.12;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;

  --tracking-display: -0.022em;
  --tracking-normal: 0;
  --tracking-wide: 0.08em;
  --tracking-mono: 0.14em;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --section-y: clamp(4rem, 2.5rem + 6.5vw, 8.5rem);
  --section-y-tight: clamp(2.5rem, 1.8rem + 3vw, 4.5rem);
  --container: 1320px;
  --container-narrow: 780px;
  --gutter: clamp(1.25rem, 0.9rem + 1.6vw, 2.5rem);
  --radius: 0;
  --radius-device: 6px;
  --radius-full: 9999px;

  --border-hairline: 1px;
  --border-thick: 3px;
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.06), 0 2px 8px rgb(0 0 0 / 0.04);
  --shadow-md: 0 4px 12px rgb(0 0 0 / 0.08), 0 12px 32px rgb(0 0 0 / 0.06);
  --shadow-lg: 0 12px 32px rgb(0 0 0 / 0.14), 0 32px 64px rgb(0 0 0 / 0.12);
  --shadow-device: 0 24px 60px rgb(0 0 0 / 0.45), 0 2px 0 rgb(255 255 255 / 0.04) inset;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 140ms;
  --duration: 260ms;
  --duration-slow: 620ms;
  --z-base: 1;
  --z-sticky: 100;
  --z-header: 200;
  --z-dock: 300;
  --z-overlay: 400;
  --z-modal: 500;
}