.announcement-card{--note-accent:#2268c4;--note-ink:#14243b;position:relative;box-sizing:border-box;overflow:hidden;background:#fff9ec;color:var(--note-ink);padding:18px 22px 20px;border-radius:8px;border:1px solid #14243b18;border-left:7px solid var(--note-accent);box-shadow:0 5px 16px #14243b10;text-align:left;isolation:isolate}
.announcement-orange{--note-accent:#c64b20}.announcement-gold{--note-accent:#9c710c}
.announcement-card:after{content:'';position:absolute;width:100px;height:100px;border:18px solid var(--note-accent);opacity:.055;right:-38px;bottom:-43px;transform:rotate(25deg);z-index:-1}
.announcement-kicker{display:block;font:700 10px/1.2 'Segoe UI',system-ui,sans-serif;letter-spacing:.15em;text-transform:uppercase;color:var(--note-accent);margin:0 0 9px}
.announcement-heading{display:block;font:750 22px/1.18 'Segoe UI',system-ui,sans-serif;letter-spacing:.01em;overflow-wrap:anywhere;margin:0 0 7px}
.announcement-message{font:500 17px/1.4 'Segoe UI',system-ui,sans-serif;letter-spacing:.012em;overflow-wrap:anywhere;margin:0!important;color:var(--note-ink)!important}
.tv-announcement[hidden]{display:none!important}.tv-header-slot>.tv-announcement{display:flex;flex-direction:column;justify-content:center;padding:10px 14px 12px;box-shadow:none}.tv-announcement> :not(.announcement-progress){flex:none}.tv-announcement .announcement-kicker{font-size:9px;margin-bottom:4px}.tv-announcement .announcement-heading{font-size:22px;line-height:1.12;margin-bottom:4px}.tv-announcement .announcement-message{font-size:32px;font-weight:700;line-height:1.12}.tv-announcement .announcement-progress[hidden]{display:none}
.tv-announcement .announcement-progress{position:absolute;bottom:0;left:0;width:100%;height:3px;background:var(--note-accent);transform-origin:left;animation:announcement-countdown var(--announcement-duration,30s) linear forwards}
@keyframes announcement-countdown{to{transform:scaleX(0)}}
@media(prefers-reduced-motion:reduce){.tv-announcement .announcement-progress{animation:none}}

/* Opaque overlay fills the shared banner slot without entering document flow. */
.tv-header-slot>.tv-announcement{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;aspect-ratio:auto;z-index:2;background:#fff9ec}
