:root{--portal-blue:#000000}
/* Black bridge with a central blue band shared by both pages. */
html.archive-arriving:before{content:'';position:fixed;inset:0;background:#000;z-index:2147483000;pointer-events:none}
.portal-blue,.archive-reveal{position:fixed;inset:0;z-index:2000;pointer-events:none;background:#000;will-change:opacity}
.portal-blue:after,.archive-reveal:after{content:'';position:absolute;left:50%;top:49%;width:38vmin;height:38vmin;box-sizing:border-box;border:3vmin solid var(--portal-blue);border-radius:50%;transform:translate(-50%,-50%);will-change:transform,opacity}
body.archive-departing{overflow:hidden;pointer-events:none}
body.archive-departing main{overflow:visible;perspective:850px}
body.archive-departing #stage{transform-origin:51% 48%;will-change:transform,filter;animation:iceCameraPush .38s cubic-bezier(.53,.02,.64,1) forwards;z-index:20}
body.archive-departing header,body.archive-departing .heading,body.archive-departing .views,body.archive-departing .content,body.archive-departing .gesture,body.archive-departing .folio,body.archive-departing .object-note,body.archive-departing .scene-lines{transition:opacity .18s,filter .25s;opacity:0;filter:blur(4px)}
body.archive-departing .portal-blue{animation:bridgeBlack .4s ease-in forwards}
body.archive-departing .portal-blue:after{animation:bandAppear .4s ease-out forwards}
@keyframes iceCameraPush{0%{transform:translate3d(0,0,0) scale(1);filter:brightness(1)}45%{filter:brightness(1.3) saturate(1.2)}100%{transform:translate3d(-2%,3%,360px) scale(3.7);filter:brightness(1.8) saturate(1.5) blur(4px)}}
@keyframes bridgeBlack{0%,62%{opacity:0}90%,100%{opacity:1}}
@keyframes bandAppear{0%,72%{opacity:0;transform:translate(-50%,-50%) scale(.8)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.archive-reveal{animation:bridgeReveal .6s ease-out both}
.archive-reveal:after{animation:bandRetract .6s cubic-bezier(.4,0,.2,1) both}
body.archive-entering{overflow:hidden}
body.archive-entering .workspace,body.archive-entering .topbar{transform-origin:55% 36%;animation:archiveCameraPull .6s cubic-bezier(.16,.67,.21,1) both;will-change:transform,opacity,filter}
body.archive-entering .backdrop{animation:backdropPull .6s ease-out both}
.portal-ripples{position:fixed;inset:0;perspective:800px;z-index:90;pointer-events:none;overflow:hidden}
.portal-ripple{position:absolute;left:50%;top:53%;width:35vmin;height:35vmin;margin:-17.5vmin;border-radius:50%;border:1.3px solid #a8e8ffb3;background:radial-gradient(ellipse,transparent 61%,#58bbff08 64%,#c2f3ff16 68%,transparent 72%);box-shadow:0 0 12px #67c8ff60,inset 0 0 15px #7bd5ff45;opacity:0;transform-style:preserve-3d;animation:portalRipple .32s cubic-bezier(.11,.48,.24,1) calc(.12s + var(--i)*.03s) both}
@keyframes bridgeReveal{0%,18%{opacity:1}85%,100%{opacity:0}}
@keyframes bandRetract{0%,10%{opacity:1;transform:translate(-50%,-50%) scale(1)}75%,100%{opacity:0;transform:translate(-50%,-50%) scale(.05)}}
@keyframes archiveCameraPull{0%{transform:perspective(1200px) translateZ(240px) scale(1.15);opacity:.25;filter:blur(13px)}32%{opacity:.7}100%{transform:perspective(1200px) translateZ(0) scale(1);opacity:1;filter:blur(0)}}
@keyframes backdropPull{from{transform:scale(1.6);filter:brightness(2) saturate(1.7)}to{transform:scale(1);filter:none}}
@keyframes portalRipple{0%{transform:translate3d(0,0,110px) rotateX(58deg) scale(.13);opacity:0}12%{opacity:.8}65%{opacity:.25}100%{transform:translate3d(0,11vh,-50px) rotateX(58deg) scale(7);opacity:0}}
@media(prefers-reduced-motion:reduce){.portal-blue,.archive-reveal,.portal-ripples{display:none}body.archive-departing #stage,body.archive-entering .workspace,body.archive-entering .topbar,body.archive-entering .backdrop{animation:none!important}html.archive-arriving:before{display:none}html.archive-arriving body{visibility:visible}}



/* The page transition uses only the black bridge and camera motion. */
.portal-blue:after,.archive-reveal:after{content:none;animation:none}

/* Camera motion now crosses directly into the destination page. */