/* 07H. Keep live regions, messages, hidden state and dismissal behaviour. */
@media screen {
  body #notice,
  body :is(.notice, .screening-info-panel, .empty-state, .session-draft-recovery),
  body [role="alert"]:not(.visually-hidden):not(.sr-only) {
    color: var(--common-ink);
    background: var(--common-shade);
    border: 1px solid var(--common-frame);
    border-inline-start: 4px solid var(--common-ink);
    border-radius: 8px;
    padding: 12px 16px;
    font: 400 16px/1.5 var(--common-font);
    overflow-wrap: anywhere;
    box-shadow: none;
  }
  body #notice.error,
  body [role="alert"]:not(.visually-hidden):not(.sr-only) {
    border: 3px double var(--common-ink);
    color: var(--common-ink);
    background: var(--common-paper);
  }
  body :is(.notice, .screening-info-panel, .empty-state, .session-draft-recovery) > :is(p,h3,strong),
  body [role="alert"]:not(.visually-hidden):not(.sr-only) > p {
    color: inherit;
  }
  body :is(.connection-status, .explorer-status-bar, .status-pill) {
    color: var(--common-ink);
    background-color: var(--common-shade);
    border-color: var(--common-frame);
    font-family: var(--common-font);
  }
  /* Validation notices are outside the form in the existing DOM. Bring the
   * unchanged live region above an open modal, so its message remains visible. */
  body:has(.shell :is(.media-folder-modal, .media-detail-modal, .screening-assignment-modal):not([hidden]):not(.hidden) > [role="dialog"][aria-modal="true"]) #notice:not([hidden]) {
    position: fixed;
    z-index: 3001;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    width: min(680px, calc(100vw - 32px));
    max-height: 30dvh;
    overflow-y: auto;
    margin: 0;
  }
}