/* ── FastFlowTrack — Design Tokens ─────────────────────────────────────────── */
:root {
  /* Fonts */
  --font: 'IBM Plex Sans', sans-serif;
  --mono: 'IBM Plex Mono', monospace;

  /* Background layers */
  --bg:  #0f0f0d;
  --bg2: #161613;
  --bg3: #1e1e1a;
  --bg4: #252521;
  --bg5: #2d2d28;

  /* Borders */
  --border:  rgba(255,255,255,0.07);
  --border2: rgba(255,255,255,0.13);
  --border3: rgba(255,255,255,0.22);

  /* Text */
  --text:  #e8e8e2;
  --muted: #8a8a80;
  --hint:  #55554e;

  /* Primary — kelly green */
  --amber:    #4cbb17;
  --amber-bg: rgba(76,187,23,0.13);
  --amber-t:  #6dd637;

  /* Status colors */
  --green:     #4caf50;
  --green-bg:  rgba(76,175,80,0.13);
  --green-t:   #6fcf73;

  --red:       #e05050;
  --red-bg:    rgba(224,80,80,0.13);
  --red-t:     #f07070;

  --blue:      #4a9edd;
  --blue-bg:   rgba(74,158,221,0.13);
  --blue-t:    #72b8f0;

  --purple:    #a080e0;
  --purple-bg: rgba(160,128,224,0.13);
  --purple-t:  #c0a0f0;

  --orange:    #e07840;
  --orange-bg: rgba(224,120,64,0.13);
  --orange-t:  #f09860;

  /* Shape */
  --radius:    5px;
  --radius-lg: 9px;

  /* Sizing */
  --header-h:  52px;
  --sidebar-w: 210px;
  --detail-w:  400px;
}