:root {
  color-scheme: light;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  --phone-breakpoint: 767px;
  --touch-target: 44px;
  --page-max: 72rem;
}
* { box-sizing: border-box; }
html, body { min-width: 0; min-height: 100%; overflow-x: hidden; }
body {
  margin: 0;
  background: #f5f7fa;
  color: #172033;
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
  padding-bottom: env(safe-area-inset-bottom);
}
.site-header {
  padding: calc(1rem + env(safe-area-inset-top)) 1.5rem 1rem;
  background: #fff;
  border-bottom: 1px solid #dce3eb;
}
.site-header { display:flex; align-items:center; justify-content:space-between; }
.settings-link { min-width:44px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:.4rem; color:#3d4652; text-decoration:none; border-radius:.6rem; }
.settings-link svg { width:21px; height:21px; }
.header-actions { display:flex; align-items:center; gap:.5rem; }
.admin-link { min-height:44px; display:inline-flex; align-items:center; padding:0 .8rem; color:#27415f; text-decoration:none; border-radius:.6rem; }
.admin-users { width:100%; border-collapse:collapse; background:#fff; }
.admin-users th,.admin-users td { padding:.7rem; border:1px solid #dce3eb; text-align:left; vertical-align:top; }
.admin-actions { display:grid; gap:.5rem; }
.settings-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.settings-card { background:#fff; border:1px solid #dce3eb; border-radius:1rem; padding:1.4rem; min-width:0; }
.settings-card form { display:grid; gap:.75rem; }
.settings-card label { display:grid; gap:.35rem; }
.settings-card input { width:100%; min-height:44px; padding:.65rem; font:inherit; border:1px solid #aebdca; border-radius:.55rem; }
.passkey-list { padding:0; list-style:none; }
.back-link { display:inline-flex; min-height:44px; align-items:center; }
.brand { color: #315a8a; font-size: 1.25rem; font-weight: 750; text-decoration: none; }
.page-shell { width: min(var(--page-max), calc(100% - 2rem)); margin: 2rem auto; }
.foundation-card { padding: 2rem; border: 1px solid #dce3eb; border-radius: 1rem; background: #fff; }
.button {
  display: inline-flex;
  min-height: var(--touch-target);
  align-items: center;
  justify-content: center;
  padding: .7rem 1.1rem;
  border: 1px solid transparent;
  border-radius: .65rem;
  font: inherit;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}
.button.primary { background: #315a8a; color: #fff; }
.button.secondary { border-color: #bdc9d6; background: #fff; color: #27415f; }
.button:hover { filter: brightness(.96); }
.button:focus-visible, a:focus-visible, input:focus-visible { outline: 3px solid rgba(49,90,138,.35); outline-offset: 2px; }
.home-card { max-width: 40rem; margin-inline: auto; padding: 2rem; border: 1px solid #dce3eb; border-radius: 1rem; background: #fff; }
.home-actions { display: flex; align-items: center; gap: 1rem; margin-top: 2rem; }
.home-actions form { margin: 0; }
@media (max-width: 767px) {
  .desktop-admin-navigation, .admin-users, .admin-actions { display:none !important; }
  .site-header { padding-inline: 1rem; }
  .page-shell { width: 100%; margin: 0; padding: 1rem; }
  .home-card { width: 100%; padding: 1.25rem; border-radius: .85rem; }
  .home-actions { flex-direction: column; align-items: stretch; }
  .home-actions .button, .home-actions form, .home-actions form .button { width: 100%; }
  .settings-grid { grid-template-columns:1fr; }
  .settings-card { width:100%; padding:1rem; }
  .settings-card input { font-size:16px; }
  .settings-card .button { width:100%; min-height:44px; }
  .admin-users,.admin-users tbody { display:block; }
  .admin-users thead { display:none; }
  .admin-users tr { display:block; background:#fff; border:1px solid #dce3eb; border-radius:1rem; padding:1rem; margin-bottom:1rem; }
  .admin-users td { display:block; border:0; padding:.3rem 0; }
  .admin-actions .button { width:100%; min-height:44px; }
}