/**
 * OMEGA Syndicate — Vivid Fintech (2026)
 * Saturated blue + green + gold on dark — clearly visible, pro trading UI.
 */
:root {
  --bg: #061018;
  --bg2: #0a1620;
  --bg3: #0c1a14;
  --bg4: #101e28;
  --dark: #030810;
  --glass: rgba(10, 22, 32, 0.72);
  --border: rgba(0, 200, 255, 0.18);
  --border2: rgba(255, 255, 255, 0.07);
  --border3: rgba(255, 214, 51, 0.28);

  --gold: #ffd633;
  --goldm: #c9a820;
  --goldd: #2a2410;
  --gold-dim: rgba(255, 214, 51, 0.16);
  --golddim: var(--gold-dim);
  --gold2: rgba(255, 214, 51, 0.14);

  --green: #00e887;
  --greenm: #00b86a;
  --greend: #082818;
  --green2: rgba(0, 232, 135, 0.14);
  --greendim: var(--green2);
  --lime: #b8ff3c;

  --yellow: #ffe566;
  --blue: #00b8ff;
  --cyan: #00e5ff;
  --cyan2: rgba(0, 229, 255, 0.2);
  --blue-dim: rgba(0, 184, 255, 0.12);
  --blue-deep: #0090cc;

  --purple: #6b8cff;
  --purple2: rgba(107, 140, 255, 0.12);
  --red: #ff4d6a;
  --red2: rgba(255, 77, 106, 0.14);

  --text: #eef6ff;
  --white: #f4fbff;
  --muted: #8aa8bc;
  --gray: #5a7080;
  --gray2: #152028;

  --g-blue: rgba(0, 200, 255, 0.38);
  --g-green: rgba(0, 232, 135, 0.34);
  --g-gold: rgba(255, 214, 51, 0.32);

  --gradient-cta: linear-gradient(135deg, var(--gold) 0%, var(--lime) 42%, var(--green) 72%, var(--cyan) 100%);
  --gradient-highlight: linear-gradient(135deg, var(--gold) 0%, var(--green) 55%, var(--cyan) 100%);
  --gradient-text: linear-gradient(135deg, var(--gold) 0%, var(--white) 38%, var(--cyan) 72%, var(--green) 100%);
  --gradient-bg: linear-gradient(
    165deg,
    #061018 0%,
    #081820 35%,
    #0a1a12 68%,
    #061018 100%
  );

  --cmd-bg: #0a1620;
  --cmd-cyan: var(--cyan);
  --cmd-green: var(--green);
  --cmd-red: var(--red);

  --r: 20px;
  --rs: 12px;
  --font-display: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --nav-h: 72px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

html,
body {
  background: var(--gradient-bg);
  background-color: var(--bg);
  color: var(--text);
}

.nav {
  background: rgba(6, 16, 24, 0.92) !important;
  border-bottom: 1px solid rgba(0, 200, 255, 0.12) !important;
}

.nav-logo span {
  filter: drop-shadow(0 0 12px rgba(0, 229, 255, 0.45));
}

.nav-cta,
.btn-primary,
.btn-brand {
  background: var(--gradient-cta) !important;
  color: #031018 !important;
  box-shadow: 0 4px 28px rgba(0, 232, 135, 0.35), 0 0 20px rgba(0, 200, 255, 0.15) !important;
}

.nav-ghost:hover,
.btn-outline:hover {
  border-color: rgba(0, 229, 255, 0.45) !important;
  background: var(--blue-dim) !important;
}

body.shell-app .cmd-kpi .num,
body.shell-app .mono-kpi .num {
  color: var(--cyan) !important;
  text-shadow: 0 0 18px rgba(0, 229, 255, 0.35);
}

body.shell-app .mono-kpi--green .num,
body.shell-app .cmd-kpi .num.pos,
body.shell-app .btc-stat-val.pos {
  color: var(--green) !important;
  text-shadow: 0 0 16px rgba(0, 232, 135, 0.4);
}

body.shell-app .tier-chip,
body.shell-app .t-pro {
  background: var(--gold2) !important;
  color: var(--gold) !important;
  border: 1px solid var(--border3);
}

body.shell-app .cmd-section-h,
body.shell-app .app-nav-link:hover {
  color: var(--cyan) !important;
}

body.shell-app .cmd-bot.t-green {
  border-color: rgba(0, 232, 135, 0.5) !important;
  box-shadow: 0 0 16px rgba(0, 232, 135, 0.12);
}

body.shell-app .cmd-live-dot {
  background: var(--green) !important;
  box-shadow: 0 0 14px var(--green) !important;
}

.aurora {
  background:
    radial-gradient(ellipse 90% 55% at 50% -5%, var(--g-green), transparent 55%),
    radial-gradient(ellipse 70% 45% at 95% 85%, var(--g-blue), transparent 52%),
    radial-gradient(ellipse 60% 40% at 5% 70%, var(--g-gold), transparent 48%),
    var(--bg) !important;
}

.aurora::before {
  background: radial-gradient(circle, rgba(0, 200, 255, 0.42), transparent 68%) !important;
  opacity: 0.65 !important;
}

.aurora::after {
  background: radial-gradient(circle, rgba(0, 232, 135, 0.38), transparent 68%) !important;
  opacity: 0.6 !important;
}

.hero-orb--a { background: rgba(0, 200, 255, 0.5) !important; }
.hero-orb--b { background: rgba(0, 232, 135, 0.45) !important; }
.hero-orb--c { background: rgba(255, 214, 51, 0.38) !important; }

.hero-stat .val {
  color: var(--cyan) !important;
  text-shadow: 0 0 16px rgba(0, 229, 255, 0.35);
}

.hero-founder__glow {
  background:
    radial-gradient(ellipse 85% 65% at 50% 88%, rgba(0, 232, 135, 0.42), transparent 65%),
    radial-gradient(ellipse 70% 45% at 50% 95%, rgba(0, 200, 255, 0.22), transparent 72%) !important;
}

.hero-founder__figure {
  filter:
    drop-shadow(0 24px 40px rgba(0, 0, 0, 0.6))
    drop-shadow(0 0 32px rgba(0, 232, 135, 0.12)) !important;
}

.hero-founder__label {
  border-color: rgba(0, 200, 255, 0.25) !important;
  background: rgba(6, 16, 24, 0.9) !important;
}

.hero-founder__tag {
  color: var(--gold) !important;
}

.hero-stage {
  background: linear-gradient(155deg, rgba(8, 24, 36, 0.97), rgba(6, 20, 16, 0.95)) !important;
  border-color: rgba(0, 200, 255, 0.22) !important;
  box-shadow:
    0 40px 80px rgba(0, 0, 0, 0.55),
    0 0 60px rgba(0, 232, 135, 0.06),
    inset 0 0 80px rgba(0, 200, 255, 0.04) !important;
}

.hero-stage__mesh {
  background:
    radial-gradient(ellipse 70% 55% at 18% 35%, rgba(0, 200, 255, 0.22), transparent 55%),
    radial-gradient(ellipse 60% 50% at 85% 70%, rgba(0, 232, 135, 0.18), transparent 50%),
    radial-gradient(ellipse 50% 40% at 50% 90%, rgba(255, 214, 51, 0.1), transparent 55%) !important;
}

.term-line .c-green { color: var(--green) !important; }
.term-line .c-cyan { color: var(--cyan) !important; }
.term-line .c-gold { color: var(--gold) !important; }

.trust-card,
.terminal,
.pricing-card {
  border-color: rgba(0, 200, 255, 0.16) !important;
}

.section-tag {
  color: var(--gold) !important;
  border-color: var(--border3) !important;
}

.hero-badge i {
  background: var(--green) !important;
  box-shadow: 0 0 12px rgba(0, 232, 135, 0.55) !important;
}