:root {
  
  /* Brown and Gold Theme */
  /*
  --bg:        #1C1208;
  --bg-accent: #2c1d0c;

  --text:      #F4E5B8;
  --muted:     rgba(244, 229, 184, 0.45);
  --accent:    #D4A830;
  --secondary: #4A8B7F;
  --third:     #6BA3A8;

  --border:         rgba(244, 229, 184, 0.3);
  --border-accent:  rgba(212, 168, 48, 0.3);
  
  --grid:      rgba(212, 168, 48, 0.05); 
  */


  /* Purple Retrowave/Cyber Theme */
  --bg:        #0f0a24;
  --bg-accent: #261d49af;
   
  
  --text:      #f2f0e4;
  --muted:     rgba(242, 240, 228, 0.45);
  --accent:    rgb(204, 255, 0);
  --secondary: rgba(204, 0, 255, 1);
  --third:     rgba(219, 140, 255, 1);

  --border:         rgba(242, 240, 228, 0.3);
  --border-accent:  rgba(204, 255, 0, 0.3);

  --grid:      rgba(242, 240, 228, 0.07);

  --hud-bg:     rgba(219, 140, 255, 0.1);

  /* Project-card thumbnail shape. Accepts any clip-path value:
     inset(... round ...), circle(), ellipse(), polygon(), path(), url(#clip).
     Default is none: the card's border-radius + overflow hidden already
     round the strip's top corners, and skipping clip-path avoids
     re-rasterizing the mask every animation frame. Set a shape here only
     for non-rectangular thumbnails. */
  --thumb-mask: none;


  --serif:     'Farao', Georgia, serif;
  --sans:      'Space Grotesk', system-ui, sans-serif;
  --mono:      Consolas, SFMono-Regular, monospace;
  --max:       1040px;
  --px:        2.5rem;
}