:root {
  --mirage-bg: #070b16;
  --mirage-panel: #111827;
  --mirage-panel-soft: #172033;
  --mirage-text: #e5ecff;
  --mirage-muted: #a8b3cf;
  --mirage-cyan: #38dfff;
  --mirage-pink: #ff4fd8;
  --mirage-purple: #8b5cf6;
}

body {
  background:
    radial-gradient(circle at top left, rgba(56, 223, 255, 0.18), transparent 32rem),
    radial-gradient(circle at top right, rgba(255, 79, 216, 0.14), transparent 30rem),
    var(--mirage-bg);
  color: var(--mirage-text);
}

.header,
.navbar-main,
section#main-body,
.main-content,
.card,
.panel,
.tiles .tile {
  background-color: var(--mirage-panel);
  color: var(--mirage-text);
}

.card,
.panel,
.tiles .tile,
.client-home-panels .panel {
  border: 1px solid rgba(56, 223, 255, 0.18);
  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.28);
}

a {
  color: var(--mirage-cyan);
}

a:hover {
  color: var(--mirage-pink);
}

.btn-primary,
.primary-bg-color {
  background: linear-gradient(135deg, var(--mirage-cyan), var(--mirage-purple), var(--mirage-pink));
  border: 0;
}

.footer {
  background: #050814;
  color: var(--mirage-muted);
  border-top: 1px solid rgba(56, 223, 255, 0.18);
}