/* Official SAPAR AT SAPAR volume views — original full compositions, zero cropping */
.volume-reimagined{position:relative;isolation:isolate}
.volume-layout{gap:clamp(30px,5vw,90px);grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.volume-stage{height:min(760px,72vw);min-height:620px;overflow:hidden}
.volume-stage .codex-arch{inset:2% 3% 7%;border-radius:49% 49% 5% 5%}
.volume-stage .codex-orbit{max-width:100%;width:90%;height:auto;aspect-ratio:1}
.volume-main-link{position:relative;z-index:4;width:94%;height:84%;display:flex;align-items:center;justify-content:center;perspective:1000px;isolation:isolate;cursor:zoom-in;text-decoration:none;border:0;outline-offset:8px;--volume-rx:0deg;--volume-ry:0deg}
.volume-main-link:before{content:"";position:absolute;inset:12% 6%;z-index:-1;background:radial-gradient(ellipse,rgba(224,171,91,.16),rgba(11,36,56,.03) 54%,transparent 73%);filter:blur(16px);pointer-events:none}
.volume-main-image{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 22px 35px rgba(0,0,0,.38));transform:perspective(1600px) rotateX(var(--volume-rx)) rotateY(var(--volume-ry));transition:transform .48s cubic-bezier(.16,.7,.2,1),opacity .22s ease,filter .4s ease;will-change:transform}
.volume-main-link:hover .volume-main-image{filter:drop-shadow(0 28px 48px rgba(0,0,0,.42)) drop-shadow(0 0 17px rgba(242,190,110,.15))}
.volume-main-image.is-changing{opacity:.15;transform:scale(.985)}
.volume-zoom-label{position:absolute;right:4%;bottom:2%;display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(213,172,101,.55);padding:10px 14px;background:rgba(5,19,32,.87);backdrop-filter:blur(7px);color:#edd3a3;font:700 10px/1.3 var(--sans);letter-spacing:.12em;box-shadow:0 10px 25px rgba(0,0,0,.18);white-space:nowrap}
.volume-zoom-label span{font-size:15px}
.volume-stage .codex-stage-label{bottom:5px;max-width:94%;line-height:1.5;white-space:normal}
.volume-copy>p{margin:26px 0}
.volume-view-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:8px;margin:30px 0 22px}
.volume-view-tabs .volume-view{display:flex;align-items:center;flex-direction:column;gap:9px;justify-content:flex-start;text-align:center;cursor:pointer;padding:10px 5px 13px;line-height:1.3}
.volume-view-tabs .volume-view span:not(.volume-thumb){font-size:9px;letter-spacing:.06em;text-transform:uppercase}
.volume-view-tabs .volume-view .volume-number{font:500 18px/1 var(--serif);color:#e6bd76}
.volume-thumb{height:91px;width:100%;max-width:102px;display:grid;place-items:center;overflow:hidden;flex:0 0 91px}
.volume-thumb img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}
.volume-view-tabs .volume-view:focus-visible,.volume-main-link:focus-visible{outline:2px solid #f6d496;outline-offset:4px}
.volume-view-tabs .volume-view.active .volume-thumb{background:rgba(236,197,128,.07)}
/* The four real user-uploaded images should never be stretched in the cards either. */
.cover-collection .cover-tile img{object-fit:contain;background:#07182b}
@media(max-width:1080px){.volume-layout{gap:28px}.volume-stage{min-height:570px;height:650px}.volume-view-tabs{gap:4px}.volume-thumb{height:70px;flex-basis:70px}.volume-view-tabs .volume-view span:not(.volume-thumb){font-size:8px}}
@media(max-width:780px){.volume-layout{grid-template-columns:minmax(0,1fr)}.volume-stage{height:min(670px,105vw);min-height:440px;max-height:670px}.volume-main-link{width:90%;height:83%}.volume-copy{padding-top:14px}.volume-view-tabs{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.volume-thumb{height:82px;flex-basis:82px}.volume-stage .codex-arch{inset:1% 5% 5%}.volume-main-image{transform:none!important}}
@media(max-width:480px){.volume-stage{min-height:440px;height:490px}.volume-main-link{width:92%;height:82%}.volume-view-tabs{margin:24px 0 17px}.volume-view-tabs .volume-view{padding:9px 3px;gap:7px}.volume-thumb{height:65px;flex-basis:65px}.volume-view-tabs .volume-view .volume-number{font-size:17px}.volume-view-tabs .volume-view span:not(.volume-thumb){font-size:8px;letter-spacing:0}.volume-zoom-label{font-size:8px;padding:8px 10px}.volume-stage .codex-stage-label{font-size:8px}.volume-copy>.display{font-size:clamp(50px,12vw,64px)}}
@media(max-width:375px){.volume-view-tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.volume-view-tabs .volume-view{padding:9px;gap:5px}.volume-thumb{height:70px;flex-basis:70px}}
@media(prefers-reduced-motion:reduce){.volume-main-image{transition:none!important;transform:none!important}.volume-stage .codex-orbit{animation:none!important}}
