:root {
  --bg-dark: #020712;
  --bg-card: #081633;
  --border-card: #15459e;
  --border-soft: rgba(21, 69, 158, 0.45);
  --accent-blue: #0055ff;
  --accent-cyan: #38b6ff;
  --text-main: #ffffff;
  --text-sub: #b2c9ed;
  --text-muted-custom: #8da4c4;
}

html, body {
  background-color: var(--bg-dark) !important;
  background: radial-gradient(circle at 50% -10%, #0c285e 0%, #020712 70%) no-repeat fixed !important;
  color: var(--text-main) !important;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  min-height: 100vh;
}

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

.text-white-50 {
  color: var(--text-sub) !important;
}

.text-accent {
  color: var(--accent-cyan) !important;
}

.card {
  background: radial-gradient(circle at 50% 10%, rgba(0, 85, 255, 0.12), rgba(8, 22, 51, 0.95)) !important;
  background-color: var(--bg-card) !important;
  border: 2px solid var(--border-card) !important;
  border-radius: 20px !important;
  box-shadow: 0 10px 30px rgba(0, 15, 45, 0.6) !important;
  color: var(--text-main) !important;
}

.btn-accent {
  background-color: var(--accent-blue) !important;
  border-color: var(--accent-cyan) !important;
  color: #ffffff !important;
  box-shadow: 0 0 14px rgba(0, 85, 255, 0.5);
  transition: all 0.2s ease;
}

.btn-accent:hover {
  background-color: #0044cc !important;
  border-color: #00ffcc !important;
  box-shadow: 0 0 18px rgba(0, 255, 204, 0.5);
  color: #ffffff !important;
}

.form-control, .form-select {
  background-color: #020712 !important;
  border: 1px solid var(--border-card) !important;
  color: #ffffff !important;
}

.form-control:focus, .form-select:focus {
  background-color: #030c1f !important;
  border-color: var(--accent-cyan) !important;
  color: #ffffff !important;
  box-shadow: 0 0 10px rgba(56, 182, 255, 0.3) !important;
}

.table-dark {
  background-color: transparent !important;
}

.table-dark tr {
  border-color: var(--border-soft) !important;
}

/* Footer */
.footer-squawk {
  background: rgba(8, 22, 51, 0.85);
  border: 1px solid rgba(21, 69, 158, 0.6);
  color: #a0aec0;
}

.footer-squawk strong {
  color: #ffffff;
}
.footer-credit-img {
  height: 20px;
  width: auto;
  vertical-align: -3px;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  display: inline-block;
  margin-left: 3px;
}