/* ============================================================
   DESIGN TOKENS — NEO-BRUTALISM / TOXIC ACID 
   ============================================================ */
:root {
  /* ── Core Brutalist Palette ── */
  --clr-bg: #030303;          /* The Abyss */
  --clr-surface: #0a0a0a;     /* Slightly elevated */
  --clr-surface-alt: #141414; /* Second tier */
  
  --clr-acid: #eeff00;        /* The focal point: Toxic Yellow/Green */
  --clr-acid-dim: rgba(238, 255, 0, 0.2);
  --clr-danger: #ff003c;      /* Immediate alert */
  
  --clr-text-pure: #ffffff;
  --clr-text-main: #e0e0e0;
  --clr-text-muted: #666666;
  --clr-text-dark: #000000;

  --border-hard: 1px solid #333333;
  --border-hard-acid: 2px solid var(--clr-acid);

  /* Default mappings to keep old CSS from breaking completely */
  --clr-brand-900: var(--clr-bg);
  --clr-white: var(--clr-text-pure);
  --clr-black: var(--clr-surface);
  --border-subtle: rgba(255,255,255,0.1);
  --border-visible: rgba(255,255,255,0.2);
  
  --accent-primary: var(--clr-acid);
  --bg-base: var(--clr-bg);

  /* ── Typography: Aggressive & Mechanical ── */
  --font-display: 'JetBrains Mono', 'Orbitron', monospace;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  /* Massive scaling for brutalism */
  --text-xs:   0.75rem; 
  --text-sm:   0.875rem;
  --text-base: 1rem;    
  --text-md:   1.25rem;  
  --text-lg:   1.5rem;   
  --text-xl:   2rem;     
  --text-2xl:  3rem;     
  --text-3xl:  4.5rem;   
  --text-4xl:  6rem;     
  --text-5xl:  8rem;     
  --text-6xl:  10rem;    

  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semibold: 600;
  --weight-bold:    700;
  --weight-black:   900;

  --leading-tight:  0.95;
  --leading-snug:   1.1;
  --leading-normal: 1.5;

  --tracking-tight:  -0.05em;
  --tracking-normal: 0em; 
  --tracking-wide:    0.05em;
  --tracking-widest:  0.2em;

  /* ── Sharpness (No rounded corners in brutalism) ── */
  --radius-sm:   0px;
  --radius-md:   0px;
  --radius-lg:   0px;
  --radius-xl:   0px;
  --radius-2xl:  0px;
  --radius-full: 0px;

  /* ── Z-Index ── */
  --z-below:   -1;
  --z-base:     0;
  --z-card:     10;
  --z-sticky:   100;
  --z-nav:      200;
  --z-overlay:  300;
  --z-modal:    400;
  --z-toast:    500;

  /* ── Transitions: Fast & Mechanical ── */
  --dur-fast:   100ms;
  --dur-normal: 200ms;
  --ease-mechanic: cubic-bezier(0, 0, 0, 1);
}