:root {
  /* ---- core palette ---- */
  --bg:   #05070a;
  --bg2:  #080c12;
  --cyan: #22d3ee;
  --lime: #a3e635;
  --mag:  #ff2d75;
  --ink:  #dbe9ee;
  --dim:  #5f7683;
  --line: rgba(34,211,238,.20);
  --white: #fff;

  /* ---- semantic aliases ---- */
  --color-surface:      var(--bg);
  --color-surface-alt:  var(--bg2);
  --color-primary:      var(--cyan);
  --color-accent:       var(--lime);
  --color-text:         var(--ink);
  --color-text-muted:   var(--dim);
  --color-heading:      var(--white);
  --color-border:       var(--line);
  --color-error:        #f87171;
  --color-error-text:   #fca5a5;
  --color-error-bg:     rgba(248,113,113,.08);
  --color-error-border: rgba(248,113,113,.35);
  --color-success:      var(--lime);
  --color-success-bg:   rgba(163,230,53,.08);
  --color-success-border: rgba(163,230,53,.35);

  /* ---- translucent tints ---- */
  --tint-cyan-03: rgba(34,211,238,.03);
  --tint-cyan-05: rgba(34,211,238,.05);
  --tint-cyan-06: rgba(34,211,238,.06);
  --tint-cyan-12: rgba(34,211,238,.12);
  --tint-cyan-15: rgba(34,211,238,.15);
  --tint-lime-08: rgba(163,230,53,.08);
  --scrim-72: rgba(5,7,10,.72);
  --scrim-86: rgba(5,7,10,.86);
  --input-bg: rgba(255,255,255,.03);
  --placeholder: rgba(255,255,255,.22);

  /* ---- glows ---- */
  --glow-cyan-25: rgba(34,211,238,.25);
  --glow-cyan-30: rgba(34,211,238,.30);
  --glow-cyan-40: rgba(34,211,238,.40);
  --glow-cyan-50: rgba(34,211,238,.50);
  --glow-cyan-55: rgba(34,211,238,.55);
  --glow-lime-45: rgba(163,230,53,.45);
  --glow-lime-55: rgba(163,230,53,.55);

  /* ---- typography ---- */
  --mono: ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --disp: system-ui,"Segoe UI",Helvetica,Arial,sans-serif;

  --text-2xs: 10px;
  --text-xs:  11px;
  --text-sm:  12px;
  --text-btn: 13px;
  --text-body-sm: 13.5px;
  --text-body: 14px;
  --text-h4:  16px;
  --text-h3:  19px;
  --text-counter: 26px;
  --text-boot-logo: 34px;
  --text-lede:   clamp(15px, 1.7vw, 19px);
  --text-sub:    clamp(14px, 1.5vw, 17px);
  --text-dialog: clamp(22px, 3.2vw, 30px);
  --text-section:clamp(30px, 5vw, 60px);
  --text-stat:   clamp(38px, 6.4vw, 80px);
  --text-cta:    clamp(38px, 8vw, 104px);
  --text-hero:   clamp(44px, 8.6vw, 118px);

  /* ---- spacing ---- */
  --sp-2: 2px;  --sp-4: 4px;  --sp-6: 6px;  --sp-8: 8px;  --sp-10: 10px; --sp-12: 12px;
  --sp-14: 14px; --sp-16: 16px; --sp-18: 18px; --sp-20: 20px; --sp-22: 22px; --sp-24: 24px;
  --sp-26: 26px; --sp-30: 30px; --sp-34: 34px; --sp-44: 44px; --sp-48: 48px; --sp-56: 56px;
  --gutter:   clamp(16px, 4vw, 48px);
  --gutter-tb: clamp(14px, 4vw, 42px);
  --wrap-max: 1240px;

  /* ---- radius ---- */
  --radius-xs: 3px;
  --radius-sm: 4px;
  --radius-glyph: 5px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 14px;
  --radius-device: 22px;
  --radius-full: 100px;

  /* ---- layers ---- */
  --z-video: 0; --z-grid: 1; --z-content: 6; --z-bracket: 7;
  --z-vignette: 59; --z-scanlines: 60; --z-sweep: 61;
  --z-scrim: 85; --z-drawer: 90; --z-topbar: 95; --z-topbar-controls: 96;
  --z-reticle: 120; --z-overlay: 200;

  /* ---- motion ---- */
  --ease-out: cubic-bezier(.2,.7,.3,1);
  --ease-rise: cubic-bezier(.2,.7,.2,1);
  --ease-fill: cubic-bezier(.6,.1,.2,1);
  --dur-fast: .2s; --dur-modal: .28s; --dur-btn: .3s; --dur-drawer: .32s;
  --dur-fill: .38s; --dur-rise: .8s;
}