/* Site admin (BACKEND.md): the announcement bar. Colours follow the page's own tokens when it has them. */
.site-notice { position: relative; z-index: 60; display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; padding: 8px 52px 8px 16px; font-family: inherit; font-size: 15px; font-weight: 600; line-height: 1.45; text-align: center; background: var(--notice-bg, #14171f); color: var(--notice-ink, #fff); }
.site-notice--promo { background: var(--notice-promo-bg, var(--purple, var(--accent, #4a2a80))); color: var(--notice-promo-ink, #fff); }
.site-notice--closed { background: var(--notice-closed-bg, #8a2c1d); color: #fff; }
.site-notice__text { margin: 0; color: inherit; text-decoration: none; overflow-wrap: anywhere; }
a.site-notice__text { text-decoration: underline; text-underline-offset: 3px; }
.site-notice__close { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border: 0; border-radius: 50%; background: transparent; color: inherit; font: 400 24px/1 system-ui, sans-serif; cursor: pointer; }
.site-notice__close:hover { background: rgba(255, 255, 255, .14); }
.site-notice a:focus-visible, .site-notice__close:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }