/* Panda branding with readable text in both appearance modes. */
body .apt-brand-dark{display:none!important}
body.dark .apt-brand-light{display:none!important}
body.dark .apt-brand-dark{display:block!important}
body aside .apt-home-brand{padding:0;gap:0;width:100%}
body aside .apt-brand-logo{width:100%;height:auto;object-fit:contain}
.auth-overlay .auth-card>img{width:100%;max-width:350px;height:auto;margin:0 auto 24px;object-fit:contain}
@media(max-width:700px){body aside .apt-brand-logo{max-width:270px}.auth-overlay .auth-card>img{margin-bottom:22px}}

body .header-logo::before,body .header-logo::after{content:none!important;display:none!important}
body .header-identity img{opacity:1;width:100%;height:auto;object-fit:contain;filter:none}

/* Keep the mascot in colour: only the dark logo asset changes text colour. */
body.dark .header-identity img,body.dark .auth-card>img{filter:none!important}
/* Centre the logo across both header rows, with equal space at the page edges. */
body header{padding-bottom:28px}
body .header-identity{grid-column:1;grid-row:1 / 3;align-self:center}
body header>.week-progress-header{grid-column:2;grid-row:1}
body header>.controls{grid-column:2;grid-row:2}
@media(max-width:700px){body header{padding-bottom:18px}body header>.controls{grid-column:2;justify-content:flex-end;flex-wrap:wrap}body header>.controls .status{text-align:right}}

/* Slightly larger combined logo, within the available header column. */
body .header-identity{width:min(100%,270px)}
@media(max-width:700px){body .header-identity{width:min(100%,220px)}}