* { box-sizing: border-box; }
:root { color-scheme: light; font: 16px/1.5 system-ui, sans-serif; color: #142740; background: #f0f4f8; }
body { margin: 0; }
.bar { background: #142740; color: #fff; padding: 1rem max(1rem, calc((100vw - 75rem) / 2)); display: flex; gap: 1rem; justify-content: space-between; align-items: center; }
.bar a { color: inherit; text-decoration: none; font-weight: 750; }
.bar small { display: block; font-weight: 400; }
main { max-width: 76rem; margin: auto; padding: 1.5rem 1rem; }
h1, h2, h3 { margin-block: .4em; }
.eyebrow { color: #355f88; font-weight: 700; }
form, .actions, nav { display: flex; flex-wrap: wrap; align-items: end; gap: .65rem; }
#login { display: grid; }
label { display: grid; gap: .3rem; }
input, select, button { font: inherit; min-height: 2.6rem; border-radius: 6px; padding: .45rem .65rem; }
input, select { background: white; border: 1px solid #899fb6; max-width: 100%; }
button { border: 1px solid #24619a; background: #fff; color: #184970; cursor: pointer; font-weight: 650; }
button[type="submit"], button[aria-current="page"] { background: #174b79; color: white; }
button:disabled { opacity: .65; cursor: wait; }
nav { margin: .6rem 0 1.4rem; }
#alerts:not(:empty) { background: #a12f20; color: #fff; padding: .05rem .4rem; border-radius: 1rem; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: .65rem; }
.card, .box { background: white; padding: .85rem; border: 1px solid #ccd8e5; border-radius: 8px; }
.card strong { display: block; font-size: 1.4rem; }
.box { margin-block: 1rem; overflow: auto; }
table { width: 100%; border-collapse: collapse; background: white; text-align: left; }
td, th { padding: .55rem; border-bottom: 1px solid #d8e3ee; vertical-align: top; }
td { overflow-wrap: anywhere; }
.chart { display: grid; grid-template-columns: max-content minmax(2rem,1fr) max-content; gap: .3rem .65rem; align-items: center; }
.chart progress { width: 100%; }
#status[data-error="true"] { color: #9b2119; }
[hidden] { display: none !important; }
@media print {
  nav, .bar, form, .actions, button, #status, .non-print { display: none !important; }
  body { background: white; }
  main { padding: 0; }
}
@media print { .printing-report #view > section > :not(h1):not(.print-report) { display: none !important; } }

/* The public sign-in screen shares this stylesheet with the signed-in panel. */
@media screen {
  body:has(#access:not([hidden])) > .bar { display: none; }
  main:has(#access:not([hidden])) {
    display: grid;
    grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
    grid-template-rows: minmax(.375rem, 1fr) auto minmax(.375rem, 1fr);
    min-height: 100vh;
    min-height: 100svh;
    max-width: none;
    padding: 0;
    background: radial-gradient(ellipse at top right, #e9f7ff, #fff 57%);
  }
  #access { display: contents; }
  .access-art {
    grid-area: 1 / 1 / -1;
    position: relative;
    overflow: hidden;
    max-height: 100svh;
    background: #073263;
  }
  .access-art img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 25%;
  }
  .access-panel, main:has(#access:not([hidden])) > #status {
    grid-column: 2;
    width: min(100% - 3rem, 25rem);
    justify-self: center;
  }
  .access-panel { grid-row: 2; min-width: 0; }
  .access-heading { text-align: center; margin-bottom: 2rem; }
  .access-logo { display: block; width: min(10rem, 65%); height: auto; margin: 0 auto 1.15rem; }
  .access-heading h1 {
    font-size: clamp(1.65rem, 3.2vw, 2.45rem);
    line-height: 1.12;
    letter-spacing: -.035em;
    color: #0a2544;
    margin: 0 0 .65rem;
  }
  .access-heading p { color: #455b74; margin: 0 auto; max-width: 34ch; }
  #login, #access-flow form { display: grid; gap: 1rem; }
  .access-panel label { color: #193453; font-size: .93rem; font-weight: 650; gap: .45rem; }
  .access-field { position: relative; display: block; }
  .access-field svg {
    position: absolute;
    z-index: 1;
    inset-inline-start: .9rem;
    top: 50%;
    width: 1.15rem;
    height: 1.15rem;
    transform: translateY(-50%);
    fill: none;
    stroke: #456a90;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
  }
  .access-panel input {
    width: 100%;
    min-height: 3.1rem;
    font-size: 1rem;
    font-weight: 400;
    color: #142740;
    border-color: #b4c7da;
    border-radius: .65rem;
    background: #f8fbff;
  }
  .access-field input { padding-inline-start: 2.65rem; }
  .access-panel :is(input, button):focus-visible {
    outline: 2px solid #006dc0;
    outline-offset: 3px;
  }
  .access-panel button[type="submit"] {
    min-height: 3.1rem;
    margin-top: .25rem;
    border-color: #0a4c9d;
    border-radius: .65rem;
    background: linear-gradient(110deg, #104cab, #0069b8);
    box-shadow: 0 6px 15px #0a4c9d2c;
  }
  .access-panel button[type="submit"]:hover:not(:disabled) { background: #093f91; }
  #access-actions {
    margin-top: .9rem;
    display: grid;
    justify-items: center;
    gap: .1rem;
  }
  #access-actions button, #access-flow > button {
    min-height: 2.75rem;
    border: 0;
    background: transparent;
    color: #114e95;
    font-size: .92rem;
  }
  #access-actions button:hover, #access-flow > button:hover {
    text-decoration: underline;
    text-underline-offset: .2em;
  }
  #access-flow { border-top: 1px solid #d7e5f0; padding-top: .75rem; }
  #access-flow h2 { font-size: 1.3rem; }
  #access-flow p { color: #455b74; }
  #access-flow > button { margin-top: .65rem; }
  main:has(#access:not([hidden])) > #status {
    grid-row: 3;
    align-self: start;
    margin: 0;
    overflow-wrap: anywhere;
  }
  main:has(#access:not([hidden])) > #status:not(:empty) {
    margin-block: .75rem 1rem;
    padding: .65rem .85rem;
    border-radius: .6rem;
    background: #e9f4ff;
  }
  main:has(#access:not([hidden])) > #status[data-error="true"]:not(:empty) { background: #fff0ee; }
}

@media screen and (max-width: 48rem) {
  main:has(#access:not([hidden])) {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr);
    align-content: start;
  }
  .access-panel, main:has(#access:not([hidden])) > #status { grid-column: 1; }
  .access-panel { grid-row: 1; padding-block: clamp(1.65rem, 6vw, 3rem) 1rem; }
  .access-heading { margin-bottom: 1.5rem; }
  .access-logo { width: 8rem; margin-bottom: .85rem; }
  main:has(#access:not([hidden])) > #status { grid-row: 2; }
  .access-art {
    grid-area: 3 / 1;
    width: min(100% - 3rem, 25rem);
    max-height: clamp(8rem, 30vw, 11rem);
    justify-self: center;
    border-radius: .85rem;
  }
  .access-art img { object-position: center 66%; }
}

@media screen and (max-height: 48rem) {
  .access-heading { margin-bottom: 1rem; }
  .access-logo { margin-bottom: .65rem; }
  #login { gap: .65rem; }
  #access-actions { margin-top: .45rem; gap: 0; }
}

@media screen and (max-width: 48rem) and (max-height: 48rem) {
  .access-panel { padding-block: .75rem .5rem; }
}

@media screen and (max-height: 42rem) {
  .access-heading { margin-bottom: .5rem; }
  .access-logo { margin-bottom: .35rem; }
  #login { gap: .4rem; }
  .access-field input { display: block; }
  #access-actions { margin-top: .25rem; }
}

@media screen and (max-width: 24rem) and (max-height: 42rem) {
  .access-panel, .access-art, main:has(#access:not([hidden])) > #status {
    width: calc(100% - 1.5rem);
  }
  .access-panel { padding-block: .5rem .35rem; }
}

@media screen {
  body:has(#workspace:not([hidden])) > .bar { display: none; }
  main:has(#workspace:not([hidden])) { max-width: none; padding: 0; background: #eff5fb; }
  #workspace { display: grid; grid-template-columns: 15rem minmax(0, 1fr); min-height: 100svh; }
  #workspace[data-collapsed="true"] { grid-template-columns: 4.3rem minmax(0, 1fr); }
  .admin-sidebar { background: #102943; color: #eef6ff; align-self: start; position: sticky; top: 0; max-height: 100svh; min-height: 100svh; overflow: auto; padding: 1rem .7rem; }
  .admin-brand { display: flex; align-items: center; gap: .55rem; color: inherit; text-decoration: none; white-space: nowrap; }
  .admin-brand img { border-radius: .5rem; background: #fff; flex: 0 0 46px; }
  .admin-brand strong, .admin-brand small { display: block; }
  .admin-brand small { color: #bfd8f2; }
  #admin-menu { margin: .8rem 0 0; border-color: #547493; background: transparent; color: #fff; }
  #navigation { display: grid; align-items: stretch; gap: .22rem; margin: .55rem 0 0; }
  #navigation button { display: flex; gap: .55rem; align-items: center; text-align: left; border: 0; background: transparent; color: #eef6ff; border-radius: .55rem; font-size: .88rem; }
  #navigation button > :first-child { flex: 0 0 1.15rem; text-align: center; font-size: 1.12rem; }
  #navigation button:hover { background: #254661; }
  #navigation button[aria-current="page"] { color: #0e437b; background: #d8ecff; }
  #workspace[data-collapsed="true"] :is(.admin-brand span,.menu-label) { display: none; }
  #workspace[data-collapsed="true"] #navigation button > span:not(:first-child) { display: none; }
  .admin-workarea { min-width: 0; padding: clamp(.8rem, 2.4vw, 2rem); }
  .admin-topbar { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem; margin-bottom: 1.25rem; padding: .65rem .8rem; border: 1px solid #d3e1ef; background: #fff; border-radius: .8rem; }
  .admin-topbar time { color: #3e5c7b; font-size: .83rem; }
  .admin-identity, .admin-top-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; min-width: 0; }
  .admin-identity { font-weight: 700; overflow-wrap: anywhere; }
  .admin-top-actions { margin-inline-start: auto; }
  .admin-avatar, .admin-profile-photo [data-profile-avatar] { display: grid; place-items: center; width: 40px; height: 40px; overflow: hidden; border-radius: 50%; background: #d8ecff; color: #194f82; }
  .admin-avatar img, .admin-profile-photo img { width: 100%; height: 100%; object-fit: cover; }
  .admin-profile-photo [data-profile-avatar] { width: 78px; height: 78px; margin-bottom: .75rem; }
  .admin-profile-photo canvas { display: block; width: min(100%, 200px); height: auto; border-radius: 50%; }
  .admin-profile-photo label { margin-block: .5rem; }
  #view h1 { font-size: clamp(1.45rem, 3vw, 2.2rem); margin-bottom: .65rem; }
  #workspace .card, #workspace .box { border-color: #d6e4f2; border-radius: .85rem; box-shadow: 0 6px 18px rgb(22 60 104 / 7%); }
  #workspace .box th { background: #edf6ff; }
  #workspace form { margin-block: .65rem; }
  #workspace textarea { font: inherit; border: 1px solid #899fb6; border-radius: .4rem; min-height: 4rem; max-width: 100%; padding: .45rem; }
  #view :is(td, input, a) { overflow-wrap: anywhere; }
  #workspace :is(a,button,input,summary,select,textarea):focus-visible { outline: 2px solid #287fca; outline-offset: 2px; }
  main:has(#workspace:not([hidden])) > #status:not(:empty) { position: fixed; z-index: 10; bottom: .6rem; right: .8rem; max-width: min(90vw,30rem); padding: .7rem 1rem; border: 1px solid #bdd3eb; border-radius: .6rem; background: #fff; box-shadow: 0 5px 24px #15375c26; }
}
@media screen and (max-width: 46rem) {
  #workspace, #workspace[data-collapsed="true"] { grid-template-columns: minmax(0, 1fr); }
  .admin-sidebar { position: static; min-height: 0; padding: .7rem; }
  #workspace[data-collapsed="true"] #navigation { display: none; }
  #workspace[data-collapsed="true"] :is(.admin-brand span,.menu-label) { display: block; }
  .admin-top-actions { margin-inline-start: 0; }
  #workspace form > label { max-width: 100%; }
}
@media print { .admin-sidebar, .admin-topbar { display: none !important; } }