/* Design tokens — 四维鼎立 "Tech Blue" visual language: clean light surfaces,
 * sky-blue accent, cool-grey hairline borders, subtle blue glow effects,
 * monospace-forward "command center" feel. Light tech aesthetic. */
:root {
  /* Surfaces — cool blue-grey panels */
  --bg: #dbe4f0;
  --bg-panel: #e8eef6;
  --bg-subtle: #cdd8e8;
  --bg-elevated: #edf2f8;

  /* Text — dark navy on light */
  --text: #1a2332;
  --text-muted: #5a6a7e;
  --text-faint: #94a3b8;

  /* Accent — sky blue (primary CTA) */
  --accent: #3b82f6;
  --accent-hover: #2563eb;
  --accent-soft: rgba(59, 130, 246, 0.1);
  --accent-fg: #ffffff;

  /* Border — cool blue-grey hairline */
  --border: #d4ddea;
  --border-strong: #b8c5d6;

  /* Status — tech-friendly accents */
  --green: #16a34a;
  --green-bg: rgba(22, 163, 74, 0.08);
  --blue: #3b82f6;
  --blue-bg: rgba(59, 130, 246, 0.08);
  --red: #dc2626;
  --red-bg: rgba(220, 38, 38, 0.08);
  --amber: #d97706;
  --amber-bg: rgba(217, 119, 6, 0.08);

  /* Selected (user chat bubbles) — sky blue */
  --selected: #3b82f6;
  --selected-fg: #ffffff;

  /* Radii — slightly tighter, more technical */
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;

  /* Shadows — blue-tinted ambient */
  --shadow-xs: 0 1px 2px rgba(30, 60, 100, 0.06);
  --shadow-sm: 0 1px 4px rgba(30, 60, 100, 0.08);
  --shadow-md: 0 4px 20px rgba(30, 60, 100, 0.1);
  --shadow-lg: 0 18px 60px rgba(30, 60, 100, 0.15);

  /* Typography — Inter + JetBrains Mono */
  --font-sans: 'Inter', -apple-system, 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', Menlo, Consolas, monospace;
  --font-serif: 'Source Serif 4', Georgia, serif;
}

/* Dark mode — deep navy with sky-blue accent */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0f1729;
    --bg-panel: #162033;
    --bg-subtle: #1c2840;
    --bg-elevated: #1c2840;

    --text: #e4e8f1;
    --text-muted: #7a8ba3;
    --text-faint: #4a5a70;

    --accent: #60a5fa;
    --accent-hover: #93c5fd;
    --accent-soft: rgba(96, 165, 250, 0.15);
    --accent-fg: #0f1729;

    --border: #243044;
    --border-strong: #2f3f58;

    --green-bg: rgba(22, 163, 74, 0.12);
    --blue-bg: rgba(59, 130, 246, 0.12);
    --red-bg: rgba(220, 38, 38, 0.12);
    --amber-bg: rgba(217, 119, 6, 0.12);
  }
}