/* The original header image remains the layout/accessible-name source. Only
   its monogram is covered during an explicitly requested home-arrival play. */
.header .brand-header{position:relative}
.header .brand-header .cs-axis-stage{position:absolute;left:-5.5%;top:-18%;width:34.4%;aspect-ratio:1;pointer-events:none;isolation:isolate;line-height:0}
.header .brand-header .cs-axis-stage :is(img,video){position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:contain;filter:none;pointer-events:none}
.header .brand-header .cs-axis-stage[hidden],.header .brand-header .cs-axis-stage [hidden]{display:none!important}
.header .brand-header:is([data-axis-state="playing"],[data-axis-state="settled"])>picture{clip-path:polygon(22% 0,100% 0,100% 100%,22% 100%)}
@media(prefers-reduced-motion:reduce),(forced-colors:active){.header .brand-header .cs-axis-stage{display:none!important}.header .brand-header>picture{clip-path:none!important}}
html[data-effects="off"] .header .brand-header .cs-axis-stage{display:none!important}
html[data-effects="off"] .header .brand-header>picture{clip-path:none!important}
@media print{.header .brand-header .cs-axis-stage{display:none!important}.header .brand-header>picture{clip-path:none!important}}

/* The same authored frames stay legible on the dark header. */
html[data-theme="dark"] .header .brand-header .cs-axis-stage :is(img,video){filter:brightness(1.9)}