/* ============================================================
   tokens.css — TuxCore design system (Console direction)
   Single source of truth. Everything else consumes these vars.
   Layered dark grey + Hyprland brick-red accent.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600&family=Inter:wght@400;500&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  /* ── Surfaces (layered grey) ─────────────────────────────── */
  --bg:             #181a1d;   /* page background */
  --surface:        #212429;   /* cards, panels, nav */
  --surface-raised: #292d33;   /* modals, popovers, hover states */
  --surface-inset:  #141619;   /* inputs, wells, code blocks */

  /* The swappable-background system (Step 3) overrides --bg, or
     layers an image behind it; surfaces stay opaque on top. */

  /* ── Borders ─────────────────────────────────────────────── */
  --border:        #31363d;    /* default hairline */
  --border-strong: #3d434b;    /* hover / emphasis */

  /* ── Text ────────────────────────────────────────────────── */
  --text:        #e3e6e9;
  --text-muted:  #868d96;
  --text-faint:  #5f656d;

  /* ── Brand accent (your Hyprland reds) ───────────────────── */
  --accent:          #cc6666;
  --accent-hover:    #d67d7d;  /* lighter — hover on solid fills */
  --accent-strong:   #993333;
  --accent-dim:      #6b2a2a;
  --accent-contrast: #2a1414;  /* text/icons on a solid accent fill */

  /* ── Semantic ────────────────────────────────────────────── */
  --ok:    #7fae7f;  --ok-dim:    #2f4030;
  --warn:  #d4a35f;  --warn-dim:  #46371d;
  --error: #d9534f;  --error-dim: #46211f;
  --info:  #6f9fb5;  --info-dim:  #26383f;

  /* ── Typography ──────────────────────────────────────────── */
  --font-display: 'Space Grotesk', system-ui, sans-serif;  /* headings, UI */
  --font-body:    'Inter', system-ui, sans-serif;          /* body, notes */
  --font-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, monospace; /* data, values */

  --fs-xs:   11px;
  --fs-sm:   13px;
  --fs-base: 14px;
  --fs-md:   16px;
  --fs-lg:   18px;
  --fs-xl:   22px;
  --fs-2xl:  28px;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-bold:    600;

  --lh-tight: 1.25;
  --lh-base:  1.6;

  /* ── Radius (soft, crisp) ────────────────────────────────── */
  --r-sm:   4px;
  --r-md:   6px;   /* default for most elements */
  --r-lg:   10px;  /* cards */
  --r-pill: 999px;

  /* ── Spacing scale ───────────────────────────────────────── */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;

  /* ── Lines / focus / motion ──────────────────────────────── */
  --bw: 1px;
  --focus-ring: 0 0 0 2px var(--accent);
  --t-fast: 120ms ease;
  --t-base: 180ms ease;

  /* ── Layout ──────────────────────────────────────────────── */
  --maxw:   1180px;
  --rail-h: 38px;   /* the signature status rail */
}