/* TokenLordsRPG – Design Tokens (colors, radius, fonts) */
/* Import fonts (Orbitron for headings, Inter for body). Using CSS @import to avoid editing HTML head. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Orbitron:wght@500;600;700&display=swap');

:root {
  /* Color tokens (HSL) */
  --tl-bg: hsl(220, 10%, 7%);            /* #0F1114 */
  --tl-bg-light: hsl(220, 10%, 12%);     /* #1A1C21 */
  --tl-primary: hsl(38, 95%, 55%);       /* #F7A00F */
  --tl-accent: hsl(38, 90%, 65%);        /* #F9B642 */

  --tl-text: hsl(220, 10%, 85%);         /* #D0D3D9 */
  --tl-text-muted: hsl(220, 8%, 55%);    /* #838791 */
  --tl-primary-foreground: hsl(220, 20%, 10%);

  --tl-border: hsl(220, 10%, 18%);       /* #26292E */
  --tl-secondary: hsl(220, 8%, 25%);     /* #3B3E47 */
  --tl-destructive: hsl(0, 70%, 55%);

  /* Radius */
  --radius: 0.5rem;
}

/* Font utility classes */
.font-orbitron { font-family: 'Orbitron', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
.font-inter { font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }

/* Base body helpers (optional) */
body.tokenlords-dark {
  background: var(--tl-bg);
  color: var(--tl-text);
}