/* Larger approved artwork; keep its full captions and native proportions. */
:root{--header:104px}
.topbar .brand-identity{display:flex;align-items:center;flex:0 0 276px;width:276px;gap:2px;min-width:0}
.topbar .brand-identity .brand{display:block;position:relative;flex:none;width:252px;min-width:0;height:99px;margin:0;padding:0;overflow:hidden;border:0;background:transparent}
.brand-loop-poster,.brand-loop-video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.brand-loop-poster img{display:block;width:100%;height:100%;object-fit:contain}
/* Keep native inline decoding visible to the browser, under the RGBA surface. */
.brand-loop-video{opacity:.001;pointer-events:none}
.brand-loop-matte{display:block;position:absolute;inset:0;width:100%;height:100%;visibility:hidden;pointer-events:none}
.brand-matte-ready .brand-loop-matte{visibility:visible}
.brand-matte-ready .brand-loop-poster{visibility:hidden}
[data-theme=light] .topbar :is(.brand-loop-poster,.brand-loop-matte){filter:invert(1) hue-rotate(180deg)}
.topbar .brand-motion-toggle{display:flex;align-items:center;justify-content:center;flex:none;width:22px;min-width:22px;min-height:44px;padding:0;border:0;color:var(--muted);background:transparent}
.brand-motion-toggle svg{width:12px;height:12px;fill:currentColor}
.brand-motion-toggle .brand-play{display:none}
.brand-motion-toggle[data-paused=true] .brand-play{display:block}
.brand-motion-toggle[data-paused=true] .brand-pause{display:none}
.topbar .brand-motion-toggle:hover,.topbar .brand-motion-toggle:focus-visible{color:var(--blue);background:var(--bluefill)}
.topbar .brand-motion-toggle[hidden]{display:none}
/* Smaller identity marks without reducing the existing button hit areas. */
.market-icon{display:flex;align-items:center;justify-content:center;gap:3px}
.market-icon img{width:18px;height:18px;flex:none}
.market-open-arrows{display:block;width:8px;height:14px;flex:none;fill:none;stroke:var(--muted);stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.market-icon:hover .market-open-arrows,.market-icon[aria-pressed=true] .market-open-arrows{stroke:var(--blue)}
@media(max-width:760px){
 body.real-mode{--header:140px}
 .real-mode .topbar{grid-template-rows:84px 44px}
 .real-mode .topbar .brand-identity{grid-row:1;grid-column:1/5;justify-self:start;flex-basis:234px;width:234px;height:84px;margin:0}
 .real-mode .topbar .brand-identity .brand{width:210px;height:83px;min-width:0;margin:0}
}
@media(max-width:389px),(min-width:761px) and (max-width:1100px){
 .real-mode .topbar .account-menu>.login-entry{width:44px;min-width:44px;padding:0}
 .real-mode .topbar .account-menu>.login-entry>span:not(:first-child){display:none}
}
@media(prefers-reduced-motion:reduce){
 .brand-loop-video,.brand-loop-matte{display:none}
 .brand-matte-ready .brand-loop-poster{visibility:visible}
 .topbar .brand-motion-toggle{display:none}
}

@media(max-width:760px){
 .real-mode :is(.topbar,.mobile-menu-reading) .reader-tools{background:transparent;border:0;box-shadow:none}
 .real-mode :is(.topbar,.mobile-menu-reading) .reader-tools button{background:transparent}
 .real-mode :is(.topbar,.mobile-menu-reading) .reader-tools button:active{color:var(--blue)}
}