/* redmutex.com — visual tokens v1 (RED-126)
 *
 * "Operator-first" visual language: instrument-panel geometry, signal-red brand
 * accent, control-room ink for dark surfaces, and a monospaced supporting voice
 * for technical labels.
 *
 * These tokens are the working baseline for hero/tile/icon art. The CTO should
 * mirror them in the redmutex.com Tailwind/CSS layer so swap-in art renders
 * with the same palette as the surrounding chrome.
 */
:root {
  /* Brand */
  --rm-red-700: #8C0B20;       /* hover / pressed accents */
  --rm-red-600: #C8102E;       /* primary brand red — operator signal red */
  --rm-red-500: #E63950;       /* tints in illustration */
  --rm-red-100: #FCE3E7;       /* light wash on light surfaces */

  /* Ink (text + dark surface) */
  --rm-ink-900: #0B0F14;       /* deepest dark surface (control-room near-black) */
  --rm-ink-800: #121722;
  --rm-ink-700: #1A2230;       /* primary text on light */
  --rm-ink-500: #4A5568;       /* secondary text */
  --rm-ink-400: #6B7280;       /* tertiary / instrument labels */

  /* Paper (light surface) */
  --rm-paper-50: #F7F8FA;      /* default page background */
  --rm-paper-100: #EEF1F5;     /* card on light */
  --rm-paper-200: #DEE3EB;     /* border on light */

  /* Mute lines (grid, tick marks) */
  --rm-mute-300-light: #C7CDD6;
  --rm-mute-300-dark:  #2A3344;

  /* Signals */
  --rm-signal-green: #10B981;  /* positive / live */
  --rm-signal-amber: #F59E0B;  /* warn */
  --rm-signal-blue:  #2563EB;  /* informational accent */

  /* Type */
  --rm-font-display: "Inter", "SF Pro Display", system-ui, sans-serif;
  --rm-font-body:    "Inter", system-ui, sans-serif;
  --rm-font-mono:    "JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace;

  /* Radii / spacing */
  --rm-radius-sm: 6px;
  --rm-radius-md: 12px;
  --rm-radius-lg: 20px;

  /* Motion */
  --rm-motion-fast: 120ms cubic-bezier(0.2, 0.8, 0.2, 1);
  --rm-motion-base: 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

/* Dark theme overrides — applied by the site's existing dark-mode strategy */
:root[data-theme="dark"],
.dark {
  --rm-paper-50:  #0B0F14;
  --rm-paper-100: #121722;
  --rm-paper-200: #1F2837;
  --rm-ink-700:   #E6EAF1;
  --rm-ink-500:   #A6AFBE;
  --rm-ink-400:   #7A8597;
}