/* Keep the console shell in place; only the work area waits for its data. */
html.mail-loading #main{opacity:0;pointer-events:none}
html.mail-loading #sidebar .nav-badge{visibility:hidden}
#main{transition:opacity 160ms ease-out}
#mail-loading{position:fixed;top:48px;left:0;right:0;height:2px;z-index:2147483000;overflow:hidden;pointer-events:none;background:transparent}
#mail-loading::after,html.mail-navigating::after{content:"";display:block;height:2px;width:35%;background:linear-gradient(90deg,transparent,var(--accent,#EAB308),var(--cyan,#00D4FF),transparent);animation:mail-sweep 1.1s ease-in-out infinite}
html.mail-navigating::after{position:fixed;top:48px;left:0;z-index:2147483000;pointer-events:none}
@keyframes mail-sweep{from{transform:translateX(-100%)}to{transform:translateX(390%)}}
/* Supporting browsers retain the old document while the next one renders. */
@view-transition{navigation:auto}
#topbar{view-transition-name:mail-topbar}
#sidebar{view-transition-name:mail-sidebar}
#tool-rail{view-transition-name:mail-rail}
::view-transition-group(*){animation-duration:160ms}
::view-transition-old(mail-topbar),::view-transition-new(mail-topbar),::view-transition-old(mail-sidebar),::view-transition-new(mail-sidebar),::view-transition-old(mail-rail),::view-transition-new(mail-rail){animation:none;mix-blend-mode:normal}
.mail-load-error{padding:32px;color:var(--tx);font:14px var(--font)}
@media(prefers-reduced-motion:reduce){#main{transition:none}#mail-loading::after,html.mail-navigating::after{animation:none;transform:none;width:100%;background:var(--accent,#EAB308)}@view-transition{navigation:none}}