/* ═══════════════════════════════════════════════════════════════
   SKILLS WORKSHOP (BLUEPRINT) — DESIGN TOKENS
   Engineering-blueprint / high-tech factory theme. :root vars only.
═══════════════════════════════════════════════════════════════ */

:root {
  /* ── Blueprint paper ─────────────────────────────────────── */
  --bp-950: #061a33; /* page background (deepest) */
  --bp-900: #0a2547;
  --bp-850: #0d2d55; /* section bands */
  --bp-800: #10355f; /* panels */
  --bp-700: #154272; /* raised panels / inputs */
  --bp-600: #1c5089; /* hover */

  /* ── Drafting grid & line work ───────────────────────────── */
  --grid-minor: rgba(150, 200, 255, 0.07);
  --grid-major: rgba(150, 200, 255, 0.14);
  --line: rgba(190, 225, 255, 0.28);
  --line-bright: rgba(210, 235, 255, 0.6);
  --ink: #e8f3ff; /* white-line drafting ink */
  --ink-cyan: #8fd3ff; /* primary accent: cyan pencil */
  --ink-cyan-soft: rgba(143, 211, 255, 0.14);

  /* ── Construction / factory accents ──────────────────────── */
  --hazard: #ffb800; /* safety yellow */
  --hazard-soft: rgba(255, 184, 0, 0.14);
  --hazard-dark: #1a1300; /* text on hazard */
  --redline: #ff7a6b; /* redline markup, "without skill" */
  --redline-soft: rgba(255, 122, 107, 0.16);
  --pass: #5ff2b0; /* inspection pass, "with skill" */
  --pass-soft: rgba(95, 242, 176, 0.14);

  /* ── Text ────────────────────────────────────────────────── */
  --text: #eef6ff;
  --text-soft: #c3d8ef;
  --text-muted: #93b1d1; /* AA on --bp-850 */
  --text-faint: #6f90b5; /* decorative labels only */

  /* ── Typography ──────────────────────────────────────────── */
  --font-display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --font-body: "IBM Plex Sans", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", Menlo, monospace;
  --font-hand: "Architects Daughter", "Comic Sans MS", cursive;

  /* ── Spacing scale ───────────────────────────────────────── */
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 7rem;

  /* ── Radii & effects (blueprints are square-cornered) ─────── */
  --radius-sm: 2px;
  --radius-md: 3px;
  --shadow-panel: 0 18px 40px -20px rgba(0, 8, 20, 0.9);
  --grid-size: 24px;

  /* ── Layout ──────────────────────────────────────────────── */
  --container: 1140px;
  --container-narrow: 760px;
  --nav-h: 64px;
}