:root {
  --bg-a: #f7f9ff;
  --bg-b: #fff2e9;
  --panel: #ffffff;
  --ink: #102134;
  --muted: #5f6f82;
  --brand: #f97316;
  --brand-strong: #c14600;
}

body {
  background:
    radial-gradient(circle at 100% 0%, rgba(249, 115, 22, 0.13), transparent 30%),
    radial-gradient(circle at 0% 100%, rgba(59, 130, 246, 0.11), transparent 32%),
    linear-gradient(135deg, var(--bg-a), var(--bg-b));
  color: var(--ink);
  min-height: 100vh;
}

.hero-panel {
  background: linear-gradient(120deg, #13243a, #1f3d62);
  color: #f8fbff;
  box-shadow: 0 18px 40px rgba(20, 40, 66, 0.28);
}

.metric-card {
  background: var(--panel);
  border: 1px solid rgba(16, 33, 52, 0.08);
  box-shadow: 0 8px 18px rgba(26, 53, 81, 0.06);
}

.card {
  background: var(--panel);
}

.table > :not(caption) > * > * {
  border-bottom-color: rgba(16, 33, 52, 0.09);
}

.btn-primary {
  --bs-btn-bg: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand-strong);
  --bs-btn-hover-border-color: var(--brand-strong);
}

.navbar .nav-link {
  opacity: 0.88;
}

.navbar .nav-link:hover {
  opacity: 1;
  color: #fff;
}

.text-secondary {
  color: var(--muted) !important;
}