:root {
  --ui-color-brand: #2563eb;
  --ui-color-brand-hover: #1d4ed8;
  --ui-color-text: #172033;
  --ui-color-muted: #64748b;
  --ui-color-border: #cbd5e1;
  --ui-color-surface: #ffffff;
  --ui-focus: #0ea5e9;
  --ui-radius-sm: 0.625rem;
  --ui-radius-md: 0.875rem;
  --ui-shadow-focus: 0 0 0 3px rgba(14, 165, 233, 0.3);
  --ui-transition: 160ms ease;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.skip-link {
  position: fixed;
  z-index: 10000;
  top: 0.75rem;
  left: 0.75rem;
  padding: 0.75rem 1rem;
  border-radius: var(--ui-radius-sm);
  background: #0f172a;
  color: #fff;
  transform: translateY(-150%);
}

.skip-link:focus { transform: translateY(0); }

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--ui-focus);
  outline-offset: 2px;
  box-shadow: var(--ui-shadow-focus);
}

.ui-button {
  position: relative;
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border: 1px solid transparent;
  border-radius: var(--ui-radius-md);
  padding: 0.7rem 1.1rem;
  font: inherit;
  font-weight: 750;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--ui-transition), border-color var(--ui-transition), transform var(--ui-transition);
}

.ui-button:hover:not([aria-disabled="true"], :disabled) { transform: translateY(-1px); }
.ui-button--primary { background: var(--ui-color-brand); color: #fff; }
.ui-button--primary:hover:not(:disabled) { background: var(--ui-color-brand-hover); }
.ui-button--secondary { border-color: #7dd3fc; background: #fff; color: #075985; }
.ui-button--danger { background: #be123c; color: #fff; }
.ui-button--quiet { background: transparent; color: #334155; }
.ui-button--small { min-height: 2.25rem; padding: 0.45rem 0.75rem; font-size: 0.875rem; }
.ui-button--large { width: 100%; min-height: 3rem; padding: 0.85rem 1.25rem; }
.ui-button:disabled, .ui-button[aria-disabled="true"] { opacity: 0.6; cursor: not-allowed; transform: none; }
.ui-button[aria-busy="true"] .ui-button__label { opacity: 0.75; }
.ui-button .ui-spinner { display: none; }
.ui-button[aria-busy="true"] .ui-spinner { display: block; }

.ui-spinner {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: ui-spin 700ms linear infinite;
}

@keyframes ui-spin { to { transform: rotate(360deg); } }

.ui-alert {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1.125rem;
  border: 1px solid;
  border-radius: var(--ui-radius-md);
  padding: 0.875rem 1rem;
}
.ui-alert__content { display: grid; gap: 0.15rem; }
.ui-alert__dismiss { border: 0; background: transparent; color: inherit; font-size: 1.4rem; cursor: pointer; }
.ui-alert--info { border-color: #7dd3fc; background: #f0f9ff; color: #075985; }
.ui-alert--success { border-color: #86efac; background: #f0fdf4; color: #166534; }
.ui-alert--warning { border-color: #fde68a; background: #fffbeb; color: #92400e; }
.ui-alert--error { border-color: #fda4af; background: #fff1f2; color: #9f1239; }

.ui-field { display: grid; gap: 0.45rem; margin-bottom: 1rem; }
.ui-field label { display: block; margin: 0; color: #34445c; font-weight: 650; }
.ui-field input { min-height: 2.75rem; }
.ui-field small { color: var(--ui-color-muted); }
.ui-field__error { color: #be123c !important; }
.ui-field input[aria-invalid="true"] { border-color: #e11d48; }

.ui-empty {
  display: grid;
  justify-items: center;
  gap: 0.65rem;
  padding: clamp(2rem, 6vw, 4rem) 1.25rem;
  border: 1px dashed var(--ui-color-border);
  border-radius: 1rem;
  text-align: center;
}
.ui-empty__icon { display: grid; width: 3rem; height: 3rem; place-items: center; border-radius: 50%; background: #eff6ff; color: #1d4ed8; font-size: 1.5rem; }
.ui-empty p { max-width: 36rem; margin: 0 0 0.5rem; color: var(--ui-color-muted); }

.table-wrap { scrollbar-gutter: stable; -webkit-overflow-scrolling: touch; }
button, input, select, textarea { touch-action: manipulation; }
button:disabled, input:disabled, select:disabled, textarea:disabled { cursor: not-allowed; }

body.dark-mode .ui-alert--info,
body.dark-mode .ui-alert--success,
body.dark-mode .ui-alert--warning,
body.dark-mode .ui-alert--error { background: #111827; }
body.dark-mode .ui-field label { color: #f8fafc; }
body.dark-mode .ui-empty { border-color: #475569; }

@media (max-width: 640px) {
  .ui-button { width: 100%; }
  .site-header nav { width: 100%; }
  .site-header nav > * { flex: 1 1 auto; text-align: center; }
  .contact-button { right: 1rem !important; bottom: 1rem !important; padding: 0.8rem 1rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-contrast: more) {
  :root { --ui-color-border: #475569; }
  .ui-button, input, select, textarea { border-width: 2px; }
}