/* ═══════════════════════════════════════════
   RenderDesk — Cosmic Theme
   ═══════════════════════════════════════════ */

html.cosmic {
  --bg-primary: #020010;
  --bg-secondary: rgba(6, 3, 28, 0.85);
  --bg-card: rgba(120, 80, 255, 0.04);
  --bg-card-hover: rgba(120, 80, 255, 0.08);
  --bg-glass: rgba(100, 60, 255, 0.06);
  --bg-input: rgba(80, 40, 200, 0.1);
  --border-subtle: rgba(140, 100, 255, 0.1);
  --border-hover: rgba(160, 120, 255, 0.2);
  --border-glow: rgba(180, 100, 255, 0.4);
  --text-primary: #e8e0ff;
  --text-secondary: #a090d0;
  --text-muted: #6a5a90;
  --text-dim: #3d3060;
  --accent: #a855f7;
  --accent-2: #ec4899;
  --accent-gradient: linear-gradient(135deg, #a855f7, #ec4899, #6366f1);
  --accent-glow: rgba(168, 85, 247, 0.15);
  --accent-soft: rgba(168, 85, 247, 0.1);
  --success: #4ade80;
  --success-bg: rgba(74, 222, 128, 0.1);
  --warning: #facc15;
  --warning-bg: rgba(250, 204, 21, 0.1);
  --danger: #fb7185;
  --danger-bg: rgba(251, 113, 133, 0.1);
  --shadow-glow: 0 0 80px rgba(168, 85, 247, 0.08);
}

html.cosmic .bg-layer .orb { display: none; }
html.cosmic .bg-grid {
  background-image:
    linear-gradient(rgba(140,100,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140,100,255,0.02) 1px, transparent 1px);
  mask-image: radial-gradient(ellipse at 50% 40%, black 30%, transparent 75%);
}

html.cosmic .sidebar {
  background: rgba(6, 3, 28, 0.9);
  border-right-color: rgba(140,100,255,0.08);
  backdrop-filter: blur(20px);
}

html.cosmic .sidebar-logo .logo-mark {
  background: linear-gradient(135deg, #a855f7, #ec4899);
  box-shadow: 0 0 25px rgba(168, 85, 247, 0.4);
}

html.cosmic .metric-card .shimmer {
  background: radial-gradient(circle, rgba(168,85,247,0.15), transparent 70%);
}

html.cosmic .panel,
html.cosmic .metric-card,
html.cosmic .engine-card {
  backdrop-filter: blur(12px);
}

html.cosmic .gauge-fill {
  background: linear-gradient(90deg, #a855f7, #ec4899, #6366f1);
}

html.cosmic .toast {
  background: rgba(6, 3, 28, 0.95);
  backdrop-filter: blur(16px);
}

/* Starfield canvas */
#starfield {
  position: fixed; inset: 0; z-index: 0;
  pointer-events: none; display: none;
}

html.cosmic #starfield { display: block; }

html.cosmic .sidebar-clock .dot-live {
  background: #a855f7;
  box-shadow: 0 0 8px #a855f7, 0 0 20px rgba(168,85,247,0.3);
}

html.cosmic .nav-item.active {
  background: rgba(168,85,247,0.12);
  color: #c084fc;
}

html.cosmic .env-badge.live {
  border-color: rgba(74,222,128,0.25);
  color: #4ade80;
}

html.cosmic .sparkline-bar {
  background: linear-gradient(180deg, #a855f7, #ec4899);
}

html.cosmic .service-action {
  background: rgba(168,85,247,0.12);
  color: #c084fc;
}

html.cosmic .service-action:hover {
  background: rgba(168,85,247,0.2);
}