/* ===========================================
   Design Tokens — Violet Theme
   =========================================== */
:root {
  /* Surfaces */
  --bg-deep: #080a10;
  --bg-surface: #0d1017;
  --bg-card: #111520;
  --bg-card-hover: #151c2a;
  --bg-elevated: #1a2030;

  /* Borders */
  --border: #1e2638;
  --border-glow: #2a3550;

  /* Text */
  --text-primary: #e4e8f0;
  --text-secondary: #c8ceda;
  --text-muted: #a0a8bc;

  /* Brand */
  --gold: #e8c840;
  --gold-dim: rgba(232, 200, 64, .08);
  --blue: #5b8af5;
  --blue-dim: rgba(91, 138, 245, .08);

  /* Accent (violet) */
  --accent: #9b8af5;
  --accent-dim: rgba(155, 138, 245, .08);
  --accent-glow: rgba(155, 138, 245, .15);

  /* Semantic */
  --orange: #f5a623;
  --orange-dim: rgba(245, 166, 35, .08);
  --red: #f55252;
  --red-dim: rgba(245, 82, 82, .08);

  /* Quadrant colors */
  --sweet: #22c55e;
  --sweet-bg: rgba(34, 197, 94, .1);
  --undiscovered: #5b8af5;
  --undiscovered-bg: rgba(91, 138, 245, .1);
  --gap: #f5a623;
  --gap-bg: rgba(245, 166, 35, .1);
  --miss: #f55252;
  --miss-bg: rgba(245, 82, 82, .1);

  /* Layout */
  --header-height: 54px;
  --sidebar-width: 240px;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow: 350ms ease;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5);

  /* Legacy compat for lab/TI pages */
  --bg-primary: #080a10;
  --bg-secondary: #0d1017;
  --bg-hover: #151c2a;
  --border-subtle: #1e2638;
  --border-medium: #1e2638;
  --munchkin-lime: #9b8af5;
  --purple-400: #9b8af5;
  --purple-500: #8b7ae8;
  --purple-600: #7b6ad8;
  --purple-700: #6b5ac8;
  --purple-300: #b8a8ff;
  --status-healthy-bg: rgba(34, 197, 94, .1);
  --status-healthy-text: #22c55e;
  --status-healthy-border: #22c55e;
  --status-growing-pains-bg: rgba(245, 166, 35, .1);
  --status-growing-pains-text: #f5a623;
  --status-drift-bg: rgba(91, 138, 245, .1);
  --status-drift-text: #5b8af5;
  --status-drift-border: #5b8af5;
  --status-declining-bg: rgba(245, 82, 82, .1);
  --status-declining-text: #f55252;
  --status-declining-border: #f55252;
  --border-selected: #9b8af5;
  --arrow-up: #22c55e;
  --arrow-down: #f55252;
}