/* The official brand mark carries each page change. */
.page-wipe{z-index:150;background:#061316;clip-path:none;transform:translateY(101%);transition:transform .42s cubic-bezier(.76,0,.24,1);isolation:isolate}
.page-wipe:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,#0097b224,transparent 55%);z-index:-1}
.transition-brand{position:relative;width:clamp(200px,30vw,380px)}
.transition-brand img{display:block;width:100%;height:auto}
.transition-logo-base{opacity:.16}
.transition-logo-fill{position:absolute;inset:0;clip-path:inset(0 100% 0 0)}
.transition-line{position:absolute;left:0;right:0;height:1px;bottom:-32px;background:#2bbbd0;transform:scaleX(0);transform-origin:left}
.leaving .page-wipe,.route-arriving .page-wipe{transform:none;pointer-events:auto;clip-path:none}
.leaving .transition-logo-fill{animation:routeLogoFill .56s .28s ease-out forwards}
.leaving .transition-line{animation:routeLineFill .65s .28s ease-out forwards}
.route-arriving .page-wipe{transition:none}
.route-arriving .transition-logo-fill{clip-path:inset(0)}
.route-arriving .transition-line{transform:scaleX(1)}
.route-arriving.route-reveal .page-wipe{transform:translateY(-101%);transition:transform .65s cubic-bezier(.76,0,.24,1)}
@keyframes routeLogoFill{from{clip-path:inset(0 100% 0 0);opacity:.35}to{clip-path:inset(0);opacity:1}}
@keyframes routeLineFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.motion-paused .page-wipe{display:none}
@media(prefers-reduced-motion:reduce){.page-wipe{transition:none}.transition-logo-fill,.transition-line{animation:none!important}}