/* Compact reusable operational alert; the popover is portaled outside the book scroller. */
.critical-notice { position: relative; display: inline-flex; flex: 0 0 2.75rem; width: 2.75rem; height: 1.5rem; align-items: center; justify-content: center; vertical-align: middle; }
.critical-notice__trigger { position: absolute; top: 50%; left: 50%; display: grid; width: 44px; height: 44px; padding: 0; transform: translate(-50%, -50%); place-items: center; border: 0; color: #a44d40; background: transparent; cursor: pointer; }
.critical-notice__trigger svg { display: block; width: 19px; height: 19px; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.critical-notice__trigger:hover, .critical-notice__trigger[aria-expanded="true"] { color: #83382e; }
.critical-notice__trigger:focus-visible { outline: 2px solid #a44d40; outline-offset: -6px; }
.critical-notice-popover { position: fixed; z-index: 1100; box-sizing: border-box; max-height: calc(100dvh - 16px); overflow-y: auto; padding: 0.75rem 0.85rem 0.55rem; border: 1px solid var(--line); color: var(--ink); background: var(--paper); box-shadow: 0 3px 12px rgba(28, 35, 33, 0.09); font-family: var(--font-interface); }
.critical-notice-popover[hidden] { display: none; }
.critical-notice-popover p { margin: 0; font-size: 0.875rem; font-weight: 600; line-height: 1.45; }
.critical-notice-popover__actions { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-top: 0.3rem; }
.critical-notice-popover__actions button { display: inline-flex; min-height: 34px; align-items: center; padding: 0 0.1rem; border: 0; color: var(--ink); background: transparent; font: inherit; font-size: 0.8125rem; cursor: pointer; }
.critical-notice-popover__actions [data-critical-details] { text-decoration: underline; text-underline-offset: 0.2em; }
.critical-notice-popover__actions [data-critical-close] { justify-content: center; width: 34px; color: var(--muted); font-size: 1.25rem; }
.critical-notice-popover__actions button:focus-visible { outline: 2px solid var(--brand-blue); outline-offset: 2px; }