/* Uses the existing institutional palette; no reset and no module restyling. */
.ui-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.ui-loading { display: flex; align-items: center; justify-content: center; gap: 12px; }
.ui-spinner { width: 18px; height: 18px; border: 2px solid #c3d9df; border-top-color: #087d82; border-radius: 50%; animation: ui-spin .8s linear infinite; }
@keyframes ui-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ui-spinner { animation: none; } }
.tablewrap:focus-visible { outline: 3px solid #087d82; outline-offset: 3px; }
form[aria-busy="true"] button[type="submit"] { cursor: progress; }
@media (forced-colors: active) { .ui-spinner { border-color: CanvasText; border-top-color: Highlight; } }

/* Keep account identity and actions clear at narrow widths, without changing navigation. */
@media (max-width: 560px) {
  body.signed-in31 { --header-height: 104px; }
  body.signed-in31 > header { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 40px 40px; height: var(--header-height); min-height: var(--header-height); padding: 8px 14px; gap: 8px; }
  body.signed-in31 > header .brand { padding: 0; min-width: 0; width: auto; }
  body.signed-in31 > header #menu-toggle20 { grid-column: 2; grid-row: 1; }
  body.signed-in31 > header .topright { grid-column: 1 / -1; grid-row: 2; width: 100%; min-width: 0; gap: 8px; }
  body.signed-in31 > header #who { flex: 1; min-width: 0; max-width: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.signed-in31 > header .topright button { flex-shrink: 0; }
  body.signed-in31 .app-sidebar { top: var(--header-height); height: calc(100dvh - var(--header-height)); }
  body.signed-in31 .shell { min-height: calc(100dvh - var(--header-height)); }
}