/* Owner-approved artwork, 05/09/2026. Preserve source pixels and aspect ratio.
   Use the original alpha directly on the header and footer, without a backing. */
.official-brand{width:fit-content;justify-self:start;display:flex;flex:0 0 auto;align-items:center;justify-content:center;min-height:44px;padding:2px 6px;background:transparent!important;border-radius:0;text-decoration:none;line-height:0}
.official-brand .official-brand-art{display:block;width:180px;max-width:100%;height:auto;aspect-ratio:3/1;object-fit:contain;filter:none!important}
.official-brand-footer{width:fit-content;margin:0 auto 12px}
.hero-shell .topbar{justify-content:space-between!important;gap:8px!important}
@media(max-width:760px){.hero-shell .official-brand .official-brand-art{width:114px}.hero-shell .official-brand{padding:2px 4px}.hero-shell .topbar .top-actions{gap:5px}}
@media(max-width:360px){.hero-shell .official-brand .official-brand-art{width:96px}}


/* White contour follows the transparent artwork on dark surfaces. */
html[data-theme="dark"] .official-brand .official-brand-art{filter:drop-shadow(0 0 1px #fff) drop-shadow(0 0 4px #ffffffc9)!important}
@media(prefers-color-scheme:dark){html:not([data-theme="light"]) .official-brand .official-brand-art{filter:drop-shadow(0 0 1px #fff) drop-shadow(0 0 4px #ffffffc9)!important}}
/* The approved hero header stays dark in both themes. */
.rotezi-main .hero-shell .topbar .official-brand-art{filter:drop-shadow(0 0 1px #fff) drop-shadow(0 0 4px #ffffffc9)!important}