:root {
  --fs-blue:   #3B6BFF;
  --fs-teal:   #12E2CC;
  --fs-violet: #9B6BFF;
  --fs-slate:  #263D60;
  --fs-white:  #FFFFFF;

  --fs-blue-hover: #5A85FF;
  --fs-blue-soft:  rgba(59, 107, 255, 0.18);
  --fs-teal-soft:  rgba(18, 226, 204, 0.16);
  --fs-violet-soft:rgba(155, 107, 255, 0.18);

  --fs-ink:       #060B16;
  --fs-ink-2:     #0B1426;
  --fs-ink-3:     #111E36;
  --fs-line:      #1B2F52;
  --fs-text:      #F7F9FF;
  --fs-muted:     #AEBCD6;

  --fs-good: #2EE59D;
  --fs-warn: #FFB547;
  --fs-bad:  #FF5C7A;

  --fs-gradient: linear-gradient(90deg, var(--fs-blue), var(--fs-teal) 55%, var(--fs-violet));
}

body {
  background:
    radial-gradient(1200px 600px at 15% -10%, rgba(59, 107, 255, 0.18), transparent 60%),
    radial-gradient(900px 500px at 100% 0%, rgba(18, 226, 204, 0.12), transparent 55%),
    var(--fs-ink) !important;
}

.fsdHero,
.metric-card,
.fsv-card,
.acc-card {
  background: linear-gradient(180deg, rgba(20, 34, 62, 0.92), rgba(10, 18, 36, 0.92)) !important;
  border: 1px solid rgba(120, 150, 220, 0.18) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 18px 40px rgba(0, 0, 0, 0.35) !important;
}

.fsdBar--rev { background: linear-gradient(90deg, #2F5BFF, #4F8BFF 60%, #6FA8FF) !important; box-shadow: 0 8px 28px rgba(59, 107, 255, 0.45) !important; }
.fsdBar--cost { background: linear-gradient(90deg, #08B8A5, #12E2CC) !important; box-shadow: 0 8px 28px rgba(18, 226, 204, 0.35) !important; }
.fsdCostRow > * { filter: saturate(1.5) brightness(1.15); }
.fsdBar--profit { background: linear-gradient(90deg, #7B3CFF, #B37BFF) !important; box-shadow: 0 8px 28px rgba(155, 107, 255, 0.45) !important; }
.stat-delta-row { filter: saturate(1.6) brightness(1.2); }
.fsdCanal div { filter: saturate(1.4) brightness(1.12); }