/* Vibes Core Design Tokens - development layer */
:root {
  --vibes-bg: #070711;
  --vibes-bg-2: #0c1021;
  --vibes-surface: rgba(18, 22, 44, 0.92);
  --vibes-surface-2: rgba(27, 31, 61, 0.86);
  --vibes-border: rgba(143, 124, 255, 0.22);
  --vibes-border-strong: rgba(109, 247, 255, 0.32);
  --vibes-text: #f7f8ff;
  --vibes-muted: #aeb6df;
  --vibes-aqua: #6df7ff;
  --vibes-purple: #8c5bff;
  --vibes-pink: #ff4dd8;
  --vibes-coral: #ff7b54;
  --vibes-orange: #ffb14a;
  --vibes-green: #4dffb5;
  --vibes-danger: #ff5f6d;
  --vibes-radius: 22px;
  --vibes-radius-sm: 14px;
  --vibes-shadow: 0 18px 60px rgba(0,0,0,.35);
  --vibes-glow: 0 0 28px rgba(140,91,255,.35);
  --vibes-gradient: linear-gradient(135deg, var(--vibes-aqua), var(--vibes-purple) 48%, var(--vibes-pink));
  --vibes-warm-gradient: linear-gradient(135deg, var(--vibes-pink), var(--vibes-coral), var(--vibes-orange));
}
html body.vibes-theme,
html body {
  background: radial-gradient(circle at 12% 0%, rgba(140,91,255,.24), transparent 28%), radial-gradient(circle at 88% 8%, rgba(109,247,255,.12), transparent 32%), var(--vibes-bg) !important;
  color: var(--vibes-text);
}
a { color: var(--vibes-aqua); }
.vibes-gradient-text { background: var(--vibes-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; }
.vibes-hidden { display:none !important; }
.vibes-glass,
.vibes-card {
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  border: 1px solid var(--vibes-border);
  border-radius: var(--vibes-radius);
  box-shadow: var(--vibes-shadow);
  backdrop-filter: blur(16px);
}
.vibes-pill { border-radius: 999px; border: 1px solid var(--vibes-border); background: rgba(255,255,255,.06); color: var(--vibes-text); }
.vibes-status-dot { width: 9px; height: 9px; border-radius: 50%; display:inline-block; background: var(--vibes-green); box-shadow: 0 0 14px var(--vibes-green); }
.vibes-btn,
.btn-main,
.main-color {
  border-radius: 999px;
}
.btn-main, .btn-main:hover, button.btn-main {
  background: var(--vibes-warm-gradient) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 10px 30px rgba(255,77,216,.24);
}
input, textarea, select, .form-control {
  border-radius: 14px !important;
}