:root {
  color-scheme: light dark;
  --hkw-radius: .65rem;
  --hkw-content-max: 1280px;
  --hkw-brand-accent: #0d6efd;
  --hkw-brand-accent-rgb: 13, 110, 253;
}

body { min-height: 100vh; }
.hkw-shell { max-width: var(--hkw-content-max); margin-inline: auto; }
.hkw-brand-logo { display: block; max-width: min(220px, 42vw); max-height: 56px; width: auto; height: auto; object-fit: contain; }
.hkw-brand-title { line-height: 1.2; }
.hkw-card { border-radius: var(--hkw-radius); }
.hkw-app-footer { background: color-mix(in srgb, var(--bs-body-bg) 92%, transparent); }
.hkw-muted { color: var(--bs-secondary-color); }
.hkw-page-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.login-page { max-width: 760px; }
.login-form { max-width: 560px; margin-inline: auto; }
.login-brand-wrap { min-height: 96px; display: flex; align-items: center; justify-content: center; }
.login-brand-logo { max-width: min(340px, 100%); max-height: 96px; width: auto; height: auto; object-fit: contain; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(var(--hkw-brand-accent-rgb), .45); outline-offset: 2px; }
@media (max-width: 575.98px) { .hkw-brand-logo { max-width: 150px; max-height: 44px; } .hkw-page-actions > * { flex: 1 1 100%; } }
