

:root {

  --red:      #BF211E;
  --red-dark: #8A1512;
  --ink:      #272C2D;
  --base:     #1A1E1F;
  --slate:    #475459;
  --steel:    #9CA3A7;

  --red-accent: #EE3423;
  --fog:      #F8F8F8;
  --paper:    #FFFFFF;

  --grid-line:       rgba(255,255,255,.055);
  --card-border:     rgba(255,255,255,.09);
  --hairline:        rgba(255,255,255,.12);
  --rule:            rgba(255,255,255,.14);
  --panel-border:    rgba(255,255,255,.15);
  --ring:            rgba(255,255,255,.25);
  --titleblock-edge: rgba(255,255,255,.28);
  --glyph-line:      rgba(255,255,255,.35);
  --slug-sub:        rgba(255,255,255,.4);
  --steel-hairline:  rgba(156,163,167,.45);
  --chip-fill:       rgba(255,255,255,.05);
  --shadow-card:     rgba(0,0,0,.45);

  --ink-hairline: rgba(39,44,45,.08);

  --red-tint:  rgba(191,33,30,.16);
  --red-edge:  rgba(191,33,30,.5);

  --ghost-edge:       rgba(255,255,255,.85);
  --card-on-red:      rgba(0,0,0,.18);
  --card-on-red-edge: rgba(255,255,255,.18);
  --on-red:           rgba(255,255,255,.9);
  --on-red-quote:     rgba(255,255,255,.95);
  --on-red-muted:     rgba(255,255,255,.65);
  --on-red-hover:     #FFD9D8;
  --foot-link-hover:  #F5B5B4;

  --star: #FBBC04;

  --focus-ring: var(--paper);

  --accent: var(--red-accent);

  --font-display: 'Big Shoulders Display', 'Arial Narrow', sans-serif;
  --font-body:    'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-mono:    ui-monospace, 'Cascadia Mono', Consolas, monospace;

  --fs-1:  0.75rem;
  --fs-2:  0.8125rem;
  --fs-3:  0.9063rem;
  --fs-4:  0.9375rem;
  --fs-5:  1rem;
  --fs-6:  1.0625rem;
  --fs-7:  1.125rem;
  --fs-8:  1.2rem;
  --fs-9:  1.6rem;

  --fs-10: clamp(2.6rem, 4.6vw, 4rem);
  --fs-11: clamp(2.8rem, 4.8vw, 4.2rem);
  --fs-12: clamp(3.5rem, 7vw, 6.6rem);

  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.125rem;
  --sp-6:  1.5rem;
  --sp-7:  1.75rem;
  --sp-8:  2rem;
  --sp-9:  2.75rem;
  --sp-10: 3.25rem;
  --sp-11: 3.5rem;
  --sp-12: 4.5rem;

  --wrap-max: 1180px;
  --wrap-pad: var(--sp-7);

  --radius-btn:   8px;
  --radius-card:  12px;
  --radius-panel: 14px;
  --radius-plate: 10px;
  --radius-pill:  999px;

  --grid-cell:    28px;
  --nut-size:     12px;
  --panel-offset: 16px;

  --nav-rule:      4px;

  --masthead-h:    calc(var(--logo-h) + 1.25rem + var(--nav-rule));

  --logo-h:      56px;
  --sbb-logo-w: 140px;

}
