/* Night console (night-console) — generated by design-kit/scripts/tokens.mjs
   Mood: focused, technical, quiet
   Signature: Surfaces separated by 1px borders, monospace only for code and IDs, keyboard shortcuts visible, one cool blue accent. Real terminal/code content as the hero visual.
   Fonts: <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap">
   Use ONLY these variables for color, type, space, radius, shadow, motion. */
:root {
  color-scheme: dark;

  /* color roles */
  --color-bg: #0F1115;
  --color-surface: #171A21;
  --color-text: #E7EAF0;
  --color-muted: #9AA3B2;
  --color-border: #2A2F3A;
  --color-accent: #6CA0FF;          /* fills: primary buttons, selected states */
  --color-on-accent: #121212;         /* text on accent fills */
  --color-accent-text: #6CA0FF;     /* links and accent-colored text on bg */
  --color-accent-soft: #1E3F7D;     /* tinted backgrounds */
  --color-success: #3FB950;
  --color-warning: #D29922;
  --color-danger: #F0616D;
  --color-on-danger: #121212;
  --color-focus: #6CA0FF;
  --accent-50: #F3F7FD;
  --accent-100: #E1ECFE;
  --accent-200: #C2D9FF;
  --accent-300: #9ABEFE;
  --accent-400: #71A0F5;
  --accent-500: #5183E0;
  --accent-600: #3C6BC2;
  --accent-700: #2C54A1;
  --accent-800: #1E3F7D;
  --accent-900: #122B5A;

  /* type */
  --font-heading: "IBM Plex Sans", system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body: "IBM Plex Sans", system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-ui: "IBM Plex Sans", system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --step-n2: 0.75rem;   /* 12px */
  --step-n1: 0.8125rem;   /* 13px */
  --step-0: 0.9375rem;   /* 15px */
  --step-1: 1.125rem;   /* 18px */
  --step-2: 1.375rem;   /* 22px */
  --step-3: 1.625rem;   /* 26px */
  --step-4: 1.9375rem;   /* 31px */
  --step-5: 2.3125rem;   /* 37px */
  --step-6: 2.8125rem;   /* 45px */
  --weight-heading: 600;
  --tracking-heading: -0.01em;
  --leading-body: 1.55;
  --leading-heading: 1.12;
  --measure: 65ch;

  /* space (use only these) */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px; --space-10: 128px;

  /* shape and depth */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-pill: 999px;
  --shadow-1: none;
  --shadow-2: none;

  /* controls */
  --control-sm: 32px;
  --control-md: 36px;
  --control-lg: 40px;

  /* motion */
  --dur-fast: 100ms;
  --dur-slow: 180ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);
}
@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur-slow: 0ms; }
}