/* Mascot lockups: explicit dimensions prevent shifts while artwork loads. */
.brand.brand-identity {position: relative; gap: 0; min-height: 48px; width: max-content; max-width: 100%;}
.brand-lockup {display: block; width: 180px; height: 48px; max-width: 100%; flex: 0 1 auto;}
.brand-lockup img {display: block; width: 100%; height: 100%; object-fit: contain;}
.brand-lockup .brand-logo-dark {display: none;}
.brand-accessible-name {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;}
html[data-theme="dark"] .brand-lockup .brand-logo-light {display: none;}
html[data-theme="dark"] .brand-lockup .brand-logo-dark {display: block;}
.auth-showcase .brand-lockup {width: 195px; height: 52px;}
.brand.brand-identity.auth-mobile-brand {display: none;}
.setup-body .brand-identity {display: flex; align-items: center;}
.setup-body .side > .brand {z-index: 1; padding: 8px 12px; border-radius: 12px; background: #f6f4fc;}
html[data-theme="dark"] .setup-body .side > .brand {background: transparent;}
@media (max-width: 900px) {
    .brand.brand-identity.auth-mobile-brand {display: flex; padding: 0; margin-bottom: 22px;}
}
@media (max-width: 560px) {
    .marketing-nav .brand-lockup {width: clamp(126px, 35vw, 180px); height: 48px;}
}
@media print {
    .setup-body .side {background: #fff; color: #132238;}
    .setup-body .side-copy p, .setup-body .side-copy small {color: #526176;}
    .setup-body .ring {display: none;}
    .setup-body .side > .brand, html[data-theme="dark"] .setup-body .side > .brand {background: #fff;}
    .brand-lockup .brand-logo-light, html[data-theme="dark"] .brand-lockup .brand-logo-light {display: block;}
    .brand-lockup .brand-logo-dark, html[data-theme="dark"] .brand-lockup .brand-logo-dark {display: none;}
}