/* Kalista — purple / fuchsia */
:root {
  --brand: #a855f7;
  --brand-deep: #7c3aed;
  --brand-light: #e879f9;
  --brand-fuchsia: #e879f9;
  --brand-pale: #d8b4fe;
  --brand-dim: rgba(168, 85, 247, 0.10);
  --brand-border: rgba(168, 85, 247, 0.25);
  --brand-glow: rgba(232, 121, 249, 0.15);
  --panel-inset-highlight: rgba(216, 180, 254, 0.05);
  --surface-inset-highlight: rgba(216, 180, 254, 0.07);

  --kalista: var(--brand);
  --kalista-fuchsia: var(--brand-light);
  --kalista-deep: var(--brand-deep);
  --kalista-light: var(--brand-pale);
  --kalista-dim: var(--brand-dim);
  --kalista-glow: var(--brand-glow);
  --kalista-border: var(--brand-border);

  --accent: var(--brand);
  --accent-light: var(--brand-light);
  --accent-dim: var(--brand-dim);

  --green-dim: rgba(52, 211, 153, 0.10);
  --red-dim: rgba(248, 113, 113, 0.10);
  --yellow-dim: rgba(251, 191, 36, 0.10);
  --blue-dim: rgba(96, 165, 250, 0.10);

  --bg: #0a0610;
  --bg-panel: #120b18;
  --bg-surface: #20152e;
  --bg-inset: #080510;
  --surface: var(--bg-panel);
  --surface-2: #181024;
  --surface-3: var(--bg-surface);

  --border-subtle: rgba(140, 100, 180, 0.12);
  --border: rgba(140, 100, 180, 0.18);
  --border-light: rgba(140, 100, 180, 0.28);
  --border-strong: rgba(140, 100, 180, 0.34);

  --text: #ede8f2;
  --text-primary: var(--text);
  --text-secondary: #a894b8;
  --text-muted: #6b5f7a;
  --text-label: #a894b8;

  --radius: 14px;
  --radius-sm: 10px;
}