:root {
  --premium-navy: #10243e;
  --premium-blue: #1768ac;
  --premium-teal: #12b8a6;
  --premium-cyan: #42d9ce;
  --premium-bg: #f2f7fc;
  --premium-text: #172b46;
  --premium-border: #dce7f2;
  --premium-shadow: 0 12px 32px rgba(16, 36, 62, .09);
}

* {
  scrollbar-color: #a9c7dc transparent;
  scrollbar-width: thin;
}

body {
  color: var(--premium-text);
  background-color: var(--premium-bg);
  background-image:
    radial-gradient(ellipse at 0% 0%, rgba(18,184,166,.08), transparent 42%),
    radial-gradient(ellipse at 100% 0%, rgba(23,104,172,.07), transparent 38%);
}

button, [role="button"], a {
  transition: background-color .2s ease, color .2s ease,
              box-shadow .2s ease, transform .2s ease;
}

button:not(:disabled):hover,
[role="button"]:hover {
  filter: brightness(1.035);
}

button:focus-visible, a:focus-visible, input:focus-visible {
  outline: 3px solid rgba(18,184,166,.5);
  outline-offset: 2px;
}

input, textarea, select {
  border-radius: 10px;
  border-color: var(--premium-border);
}

input:focus, textarea:focus, select:focus {
  border-color: var(--premium-teal);
  box-shadow: 0 0 0 3px rgba(18,184,166,.12);
}

table {
  border-collapse: separate;
  border-spacing: 0;
}

thead th {
  color: #536b86;
  font-weight: 700;
}

tbody tr:hover {
  background-color: rgba(23,104,172,.045);
}

img {
  max-width: 100%;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }
}