/* Buffered extraction without changing folder material or desktop composition. */
.stage[data-mode="stack"] .card{will-change:transform}
.stage[data-mode="stack"] .card-face{transition:transform 520ms cubic-bezier(.28,.12,.24,1),opacity 260ms ease,filter 260ms ease}
.stage[data-mode="stack"] .card.is-active .card-face{transition:transform 700ms cubic-bezier(.22,.61,.36,1);will-change:transform}
dialog::before{transition-duration:380ms}

@media(max-width:760px) and (orientation:portrait){
 :root{--mobile-header:146px}
 main{background-size:29px 100%,100% 29px,100% 100%}
 .identity{padding-left:102px}
 .relief-emblem{width:98px;height:98px}
 .views{height:64px;right:18px;gap:10px}
 .view{width:58px;height:62px;padding:0;justify-content:flex-start}
 .view .relief-icon{width:58px;height:55.5px}
 .caption{right:146px!important}
 .stage[data-mode="stack"]{bottom:calc(70px + var(--phone-safe))}
 /* Keep centring and extraction on one animation clock. No animated filters. */
 .stage[data-mode="stack"] .card .card-face,
 .stage[data-mode="stack"] .card.is-active .card-face,
 .stage[data-mode="stack"] .card:not(.is-active) .card-face,
 .stage[data-mode="stack"].has-focus .card:not(.is-active) .card-face{
   transform:translate3d(0,calc(var(--lift,0px) * var(--extraction,0)),0);
   transition:opacity 180ms linear;will-change:transform
 }
 .stage[data-mode="stack"] .card:not(.is-active) .folder-shell{filter:none}
 .stage[data-mode="grid"] .card-face{transition:transform 480ms cubic-bezier(.2,.7,.25,1)}
 /* Reveal the frozen rail underneath the returning artwork, not one frame later. */
 body.viewer-is-closing>.sidebar,body.viewer-is-closing>main{visibility:visible;pointer-events:none}
 #viewer::before{display:block;position:fixed;inset:0;z-index:-1;background:#eef2f7;opacity:1;transition:opacity 380ms ease}
 #viewer::backdrop{background:transparent}
 #viewer.is-closing{background:transparent}
 #viewer.is-closing::before{opacity:0}
 #viewer.is-closing::after{opacity:0;transition:opacity 200ms}
}
@media(max-width:760px) and (max-height:620px) and (orientation:portrait){
 :root{--mobile-header:130px}
 .identity{padding-left:96px}
 .relief-emblem{width:90px;height:90px}
}
@media(prefers-reduced-motion:reduce){
 .stage[data-mode="stack"] .card-face,.stage[data-mode="stack"] .card.is-active .card-face,
 .stage[data-mode="grid"] .card-face,dialog::before,#viewer::before{transition:none}
}
