:root {
  --matador-navy: #0d2942;
  --matador-ocean: #397cb5;
  --matador-sky: #52aef4;
  --matador-sky-soft: rgba(82, 174, 244, 0.14);
  --matador-line: rgba(111, 184, 237, 0.27);
  --accent: var(--matador-sky);
  --blue: var(--matador-sky);
  --cyan: #79c7ff;
}

html { background: #071524; }

body {
  background:
    radial-gradient(circle at 100% 0%, rgba(82, 174, 244, 0.16), transparent 27rem),
    radial-gradient(circle at 0% 100%, rgba(57, 124, 181, 0.12), transparent 31rem),
    linear-gradient(145deg, #071524 0%, #0d2942 100%) !important;
  font-family: "Aptos", "Segoe UI Variable", "Segoe UI", sans-serif !important;
}

a { color: #87cfff; }

.matador-wordmark { display: block; width: clamp(138px, 18vw, 212px); height: auto; }
.matador-dashboard-brand, .matador-login-brand { display: flex; align-items: center; gap: 14px; }
.matador-dashboard-brand .matador-wordmark { width: clamp(148px, 18vw, 220px); }
.matador-login-brand { margin: 2px 0 22px; }
.matador-login-brand .matador-wordmark { width: 186px; }
.matador-dashboard-brand h1, .matador-login-brand h2 { letter-spacing: -0.035em; }

.topbar { background: rgba(7, 21, 36, 0.9) !important; border-bottom-color: var(--matador-line) !important; }

.header-button, .top-actions .button, .button.primary, button.primary {
  border-color: rgba(82, 174, 244, 0.72) !important;
  background: var(--matador-sky-soft) !important;
  color: #b9e3ff !important;
}

.header-button:hover, .header-button:focus-visible, .top-actions .button:hover, .top-actions .button:focus-visible, .button.primary:hover, .button.primary:focus-visible, button.primary:hover, button.primary:focus-visible {
  background: rgba(82, 174, 244, 0.24) !important;
  border-color: var(--matador-sky) !important;
}

.admin-nav::before {
  content: "";
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  background: center / contain no-repeat url("/static/assets/matador-app.svg");
  filter: drop-shadow(0 5px 10px rgba(82, 174, 244, 0.24));
}

.admin-nav a:hover, .admin-nav a:focus-visible, .admin-nav a[aria-current="page"] {
  border-color: rgba(82, 174, 244, 0.82) !important;
  background: rgba(82, 174, 244, 0.13) !important;
  color: #b9e3ff !important;
}

@media (max-width: 640px) {
  .matador-dashboard-brand { gap: 10px; }
  .matador-dashboard-brand .matador-wordmark { width: 130px; }
  .matador-dashboard-brand h1 { font-size: 18px; }
}