:root {
  /* Backgrounds */
  --bg:           #0B1220;
  --bg-alt:       #111827;
  --bg-card:      #1E293B;
  --bg-light:     #FFFFFF;
  --bg-panel:     #F8FAFC;
  --panel-border: #E5E7EB;

  /* Text */
  --text-light:      #F8FAFC;
  --text-muted:      #94A3B8;
  --text-muted-dark: #64748B;
  --text-dark:       #0F172A;
  --text-body:       #334155;
  --silver:          #CBD5E1;

  /* Brand */
  --gold:       #F59E0B;
  --gold-deep:  #D97706;
  --gold-light: #FCD34D;

  /* Category colors */
  --cyan:    #06B6D4;
  --emerald: #10B981;
  --rose:    #F43F5E;
  --violet:  #8B5CF6;
  --blue:    #3B82F6;
  --yellow:  #EAB308;

  /* AI */
  --ai:      #A855F7;
  --ai-deep: #7E22CE;

  /* Typography */
  --font-head: 'Inter', 'Calibri', 'Trebuchet MS', sans-serif;
  --font-body: 'Inter', 'Calibri', 'Trebuchet MS', sans-serif;
  --font-mono: 'Consolas', 'Courier New', monospace;

  /* Spacing */
  --section-gap: 96px;
  --card-gap:    16px;
  --card-pad:    24px;

  /* Layout */
  --content-max: 1280px;
  --content-pad: 48px;
  --nav-height:  64px;
}

@media (max-width: 768px) {
  :root {
    --section-gap: 64px;
    --content-pad: 20px;
  }
}