:root {
  --sidebar-width: 180px;
  font-family: "Instrument Sans", "Segoe UI", sans-serif;
  color: #192e40;
  background: #f7f9fc;
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; }
header { display: flex; min-height: 66px; background: #16344d; color: white; }
.brand { width: var(--sidebar-width); flex-shrink: 0; padding: 20px 18px; font-size: 21px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a { color: inherit; text-decoration: none; }
#top { display: flex; }
#top a { display: grid; place-items: center; padding: 0 26px; font-weight: 600; }
#top a:hover, #top a[aria-current] { background: #0d253b; }
#top a[aria-current] { box-shadow: inset 0 -3px #83c4fa; }
.workspace { display: grid; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); min-height: calc(100vh - 66px); }
.workspace.signed-out { grid-template-columns: minmax(0, 1fr); }
aside { background: #eef3f8; border-right: 2px solid #a0b4c8; }
aside h2 { margin: 0; padding: 22px 18px; font-size: 19px; }
.group { background: #aebfd1; padding: 10px 18px; font-size: 12px; font-weight: 700; text-transform: uppercase; }
#sidebar a { display: block; padding: 12px 15px; border-left: 3px solid transparent; }
#sidebar a:hover, #sidebar a[aria-current] { background: #dbeaf8; }
#sidebar a[aria-current] { border-color: #286da4; font-weight: 600; }
main { padding: 32px 40px; }
h1 { margin: 0 0 22px; font-size: 28px; }
form, #results { max-width: 830px; background: white; border: 1px solid #d6e0ea; border-radius: 7px; padding: 24px; }
.fields { display: grid; grid-template-columns: 120px minmax(180px, 460px); gap: 12px 18px; align-items: center; }
input, select, button { font: inherit; }
input, select { width: 100%; padding: 9px 11px; min-height: 40px; border: 1px solid #a8bbcd; border-radius: 4px; }
.actions { display: flex; gap: 10px; margin-top: 22px; }
.actions[hidden] { display: none; }
.sidebar-logout { display: block; margin: 12px 15px; }
.sidebar-status:not(:empty) { display: block; margin: 0 15px 12px; }
button, .action-link { min-height: 40px; border: 1px solid #9db2c5; border-radius: 4px; background: #f3f7fc; color: #17344d; padding: 8px 16px; cursor: pointer; }
.action-link:not([hidden]) { display: inline-flex; align-items: center; }
.primary { background: #1e537e; color: white; border-color: #1e537e; min-width: 76px; }
button:disabled, select:disabled { cursor: default; color: #65768a; background: #eef2f6; }
:focus-visible { outline: 3px solid #428dd0; outline-offset: 2px; }
#results { margin-top: 20px; overflow-x: auto; }
#results h2 { margin-top: 0; font-size: 20px; }
table { width: 100%; border-collapse: collapse; text-align: left; }
th, td { padding: 10px 12px; border-bottom: 1px solid #d6e0ea; }
th { background: #eef3f8; }
.record-action { display: inline-block; margin-bottom: 16px; }
.record-action, td a { color: #1e537e; text-decoration: underline; }
#con { background: #b8b8b8; border-color: #808080; color: #17212b; }
.user-list { max-width: 830px; margin-bottom: 20px; overflow-x: auto; }
.user-filters { display: grid; grid-template-columns: minmax(220px, 2fr) repeat(2, minmax(140px, 1fr)); gap: 12px; margin-bottom: 16px; }
.user-filters label { display: grid; gap: 6px; }
.new-user { max-width: 830px; }
.new-user summary {
  width: fit-content;
  padding: 10px 16px;
  border-radius: 4px;
  background: #1e537e;
  color: white;
  cursor: pointer;
}
.new-user[open] summary { margin-bottom: 12px; }
.user-list td .action-link { text-align: left; }
#user-details { margin-top: 16px; padding: 16px; background: white; border: 1px solid #d6e0ea; border-radius: 7px; }
#user-details h2 { margin-top: 0; }
#account-controls { border: 0; padding: 0; }
#account-role { min-height: 34px; }
#location-access { margin: 16px 0 0; border: 1px solid #a8bbcd; }
#location-choices label { display: flex; align-items: center; gap: 8px; }
#location-choices input { width: auto; min-height: 0; }
.account-state { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#account-summary:empty, #assign-role-status:empty, #account-fields[hidden] { display: none; }
#account-fields { margin: 0; row-gap: 6px; }
#account-fields dd {
  margin: 0;
  padding: 7px 10px;
  min-height: 34px;
  background: #eef2f6;
  border: 1px solid #a8bbcd;
  border-radius: 3px;
  overflow-wrap: anywhere;
}
.save-status:empty, #organization-residents p:empty { display: none; }
#organization-residents { max-width: 830px; margin-top: 20px; padding: 24px; background: white; border: 1px solid #d6e0ea; border-radius: 7px; }
#organization-residents h2 { margin-top: 0; font-size: 20px; }