@import url('https://use.typekit.net/leq1sdk.css');

/* ================================================================
   FORGE DESIGN SYSTEM — SEMANTIC TOKENS
   Last deployed: 2026-02-24
   Default values = Foundry dark (renders correctly before JS runs)
   ================================================================ */

:root {
  /* --- Page backgrounds --- */
  --bg-primary:        #222830;
  --bg-surface:        #2A3545;
  --bg-surface-hover:  #324055;
  --bg-surface-alt:    rgba(42,53,69,0.5);

  /* --- Text --- */
  --text-primary:      #F5F7FA;
  --text-secondary:    rgba(245,247,250,0.55);
  --text-muted:        rgba(245,247,250,0.50);
  --text-faint:        rgba(245,247,250,0.38);

  /* --- Accents --- */
  --accent-primary:    #64A8E6;
  --accent-primary-soft: rgba(100,168,230,0.1);
  --accent-primary-border: rgba(100,168,230,0.28);
  --accent-secondary:  #D37A22;
  --accent-secondary-soft:   rgba(211,122,34,0.1);
  --accent-secondary-border: rgba(211,122,34,0.28);
  --accent-glow:       #82BDF0;

  /* --- Borders & dividers --- */
  --border-color:      rgba(255,255,255,0.07);
  --border-subtle:     rgba(255,255,255,0.05);
  --border-strong:     rgba(255,255,255,0.12);

  /* --- Shadows --- */
  --card-shadow:       rgba(0,0,0,0.4);
  --card-shadow-hover: rgba(0,0,0,0.55);

  /* --- Gradient bar --- */
  --gradient-bar:      linear-gradient(90deg, #D37A22 0%, #64A8E6 100%);

  /* --- Typography --- */
  --font-display:      'halogen', 'Michroma', sans-serif;
  --font-body:         'Space Grotesk', sans-serif;
  --font-slab:         'Roboto Slab', serif;
  --font-mono:         'DM Mono', 'Courier New', monospace;

  /* --- Settings bar --- */
  --settings-bg:       rgba(34,40,48,0.95);
  --settings-border:   rgba(255,255,255,0.07);
  --settings-text:     rgba(245,247,250,0.55);
  --settings-text-hover: rgba(245,247,250,0.9);
  --settings-control-bg: rgba(255,255,255,0.06);
  --settings-control-border: rgba(255,255,255,0.12);
}