/* A collection becomes an open magazine, in the same scene. */
body[data-petro-collection]{padding-left:0;background:#fff}
body[data-petro-collection] .petro-action-rail{display:none}
body[data-petro-collection] .site-header.petro-shared-header{height:66px;width:100%;margin:0;padding:12px 3%;background:#fff;gap:20px}
body[data-petro-collection] .site-header .mast-name{font-size:29px!important}
body[data-petro-collection] .site-header .site-nav{gap:26px}
body[data-petro-collection] .site-header .site-nav .petro-glass{backdrop-filter:none;-webkit-backdrop-filter:none}
.petro-collection{--book-height:clamp(220px,calc((100svh - 220px)/2),350px);--book-width:calc(var(--book-height) * .8);height:calc(100svh - 66px);min-height:660px;position:relative;isolation:isolate;overflow:hidden;background:#fff}
.petro-collection .showroom-track{display:block;width:100%;padding:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-snap-type:none;scroll-behavior:smooth;overscroll-behavior-x:contain;mask-image:linear-gradient(90deg,transparent,#000 1%,#000 99%,transparent)}
.collection-grid{display:grid;grid-template-columns:repeat(8,var(--book-width));grid-template-rows:repeat(2,var(--book-height));justify-content:center;gap:20px 28px;width:max-content;min-width:100%;padding:15px 34px 22px;perspective:1400px}
.petro-collection .issue-object{width:var(--book-width);height:var(--book-height);aspect-ratio:auto;scroll-snap-align:none}
.petro-collection .object-face{padding:12px 13px 13px}
.petro-collection .object-mast{font:400 13px/1 Cochin,Georgia,serif;letter-spacing:.14em}
.petro-collection .object-edition{margin-top:7px;padding-top:6px;font-size:7px;flex-direction:row;justify-content:space-between;gap:6px}
.petro-collection .object-title{margin:auto 0;padding:12px 0 9px;font:400 clamp(23px,calc(var(--book-height) * .12),39px)/1.04 Cochin,Georgia,serif}
.petro-collection .issue-object[data-open-issue=hooded] .object-title{font-size:clamp(21px,calc(var(--book-height) * .102),33px)}
.petro-collection .object-invitation{font-size:7px;margin:0;letter-spacing:.06em}
.petro-collection .object-drift{transform:rotate(-.8deg)}
.petro-collection.has-motion .object-drift{animation:collection-float 10s ease-in-out infinite alternate;animation-delay:calc(var(--object-index,0) * -.65s)}
.petro-collection.has-motion .object-face:before{animation:cover-lacquer 13s ease-in-out infinite alternate;animation-delay:calc(var(--object-index,0) * -.7s)}
.petro-collection[data-motion-paused] .object-drift,.petro-collection[data-motion-paused] .object-face:before,.petro-collection:not(.is-in-view) .object-drift,.petro-collection:not(.is-in-view) .object-face:before{animation-play-state:paused}
.collection-invitation{position:absolute;z-index:6;bottom:48px;left:50%;transform:translateX(-50%);padding:13px 34px 12px;text-align:center;white-space:nowrap;background:#ffffffec;border:1px solid white;box-shadow:0 10px 38px #48484818;backdrop-filter:blur(14px);pointer-events:none}
.collection-invitation h1{margin:0;font:400 36px/1.08 Cochin,Georgia,serif;color:#484848}
.collection-invitation h1 em{font:400 1.75em/.6 Boisterous,cursive;font-style:normal;color:#ef5b73;vertical-align:-.03em;margin:0 -.08em 0 .02em}
.collection-invitation p{font:400 11px/1.4 Jost,Arial,sans-serif;margin:8px 0 0}
.petro-collection .showroom-controls{position:absolute;bottom:0;left:0;right:0;padding:0 3%;font-size:10px;z-index:8}
.petro-collection .showroom-all{border:0;padding:12px 0;font-size:10px}
.petro-collection .showroom-controls button{border:0;font-size:10px}
@keyframes collection-float{from{transform:translateY(2px) rotate(-1deg)}to{transform:translateY(-4px) rotate(.8deg)}}
/* The open issue is a native dialog: Escape, focus trap, and original URL. */
.issue-viewer{--issue-base:#ff3d9a;--issue-light:#ffa3d7;--issue-depth:#b8125e;--issue-ink:#484848;position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;padding:0;border:0;margin:0;overflow:auto;overscroll-behavior:contain;background:radial-gradient(ellipse at 10% 10%,var(--issue-light),transparent 60%),radial-gradient(ellipse at 100% 100%,var(--issue-depth),transparent 75%),var(--issue-base);color:#484848}
.issue-viewer::backdrop{background:#fff}
.issue-viewer[open]{display:flex;flex-direction:column;align-items:center;justify-content:center}
.reader-close{position:absolute;z-index:5;top:22px;left:4%;border:1px solid #ffffff90;border-radius:999px;background:#ffffffe6;color:#484848;padding:12px 18px;min-height:44px;font:400 12px/1.3 Jost,Arial,sans-serif;cursor:pointer}
.reader-stage{position:relative;width:min(1060px,88vw);height:min(620px,74svh);min-height:400px;perspective:1800px;margin:70px 0 38px;filter:drop-shadow(12px 28px 25px #351c3a40)}
.reader-content{position:relative;display:grid;grid-template-columns:1fr 1fr;width:100%;height:100%;background:#fffefa;box-shadow:inset 0 1px #fff,5px 4px 0 #eee,6px 5px 0 #ccc,9px 8px 0 #fafafa;transform:rotate(-.7deg);isolation:isolate}
.reader-content:after{content:"";position:absolute;inset:0;left:calc(50% - 17px);width:34px;background:linear-gradient(90deg,transparent,#00000015 43%,#00000030 49%,#ffffffaa 53%,#0000000a 61%,transparent);pointer-events:none;z-index:3}
.reader-copy{display:flex;flex-direction:column;padding:9% 9% 8%;min-width:0;background:linear-gradient(100deg,#fffefa 65%,#eeeae3);position:relative;z-index:2}
.reader-running-head{display:flex;justify-content:space-between;gap:12px;font:400 10px/1.4 Jost,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid #c7c1b9;padding-bottom:12px;margin:0 0 20px}
.reader-title{font:400 clamp(34px,4.6vw,65px)/1.03 Cochin,Georgia,serif;margin:auto 0 18px;letter-spacing:-.015em;text-wrap:balance;color:#484848}
.reader-source-excerpt{font:400 clamp(16px,1.6vw,21px)/1.4 Cochin,Georgia,serif;margin:0 0 24px;max-width:34ch;color:#484848}
.reader-read{display:inline-flex;align-items:center;align-self:flex-start;color:#484848;min-height:44px;padding:10px 0;border-bottom:1px solid #777;font:400 12px/1.4 Jost,Arial,sans-serif;text-decoration:none}
.reader-art{min-width:0;position:relative;overflow:hidden;display:grid;place-items:center;background:radial-gradient(ellipse at 20% 0,var(--issue-light),transparent 72%),var(--issue-base)}
.reader-art img{width:100%;height:100%;object-fit:cover;object-position:65% 45%;display:block}
.reader-number{font:400 clamp(170px,28vw,380px)/.8 Cochin,Georgia,serif;color:var(--issue-ink);letter-spacing:-.08em;opacity:.65;transform:rotate(-90deg);text-shadow:1px 1px 0 #ffffff60}
.reader-art:after{content:"PETRO";position:absolute;bottom:24px;right:25px;font:400 20px/1 Cochin,Georgia,serif;letter-spacing:.15em;color:var(--issue-ink)}
.reader-stage.is-arriving .reader-content{animation:reader-arrive .7s .45s both}
.magazine-flight{position:fixed;z-index:2147483646;margin:0;pointer-events:none;perspective:1600px;transform-origin:left center;filter:drop-shadow(8px 16px 16px #351c3a35)}
.magazine-flight .object-face{height:100%;width:100%;transform:none;padding:7%}
.magazine-flight .object-mast{font-size:clamp(30px,4vw,60px)}
.magazine-flight .object-title{font-size:clamp(28px,4vw,60px)}
.magazine-flight .object-edition{font-size:10px}
.magazine-flight .object-invitation{font-size:10px}
@keyframes reader-arrive{from{opacity:0;transform:rotate(-.7deg) scale(.94)}to{opacity:1;transform:rotate(-.7deg) scale(1)}}
@media(max-width:760px){
 body[data-petro-collection] .site-header.petro-shared-header{height:auto;min-height:58px;padding:10px 5%}
 body[data-petro-collection] .site-header .mast-name{font-size:27px!important}
 .petro-collection{--book-height:clamp(205px,calc((100svh - 226px)/2),300px);height:calc(100svh - 60px);min-height:600px}
 .collection-grid{gap:15px 18px;padding:12px 22px 22px}
 .petro-collection .object-title{font-size:clamp(24px,calc(var(--book-height) * .12),36px)}
 .petro-collection .issue-object[data-open-issue=hooded] .object-title{font-size:clamp(21px,calc(var(--book-height) * .102),30px)}
 .petro-collection .object-face{padding:10px 11px 11px}
 .petro-collection .object-edition{font-size:6px;line-height:1.3;min-height:20px}
 .petro-collection .object-mast{font-size:12px}
 .petro-collection .object-invitation{font-size:6px}
 .collection-invitation{bottom:50px;padding:10px 26px}
 .collection-invitation h1{font-size:30px}.collection-invitation p{font-size:10px}
 .petro-collection .showroom-all{font-size:9px}.petro-collection .showroom-playback{gap:4px}
 .reader-close{top:14px;left:5%;font-size:11px}
 .reader-stage{width:90vw;height:auto;min-height:0;margin:80px 0 30px;filter:drop-shadow(7px 16px 18px #351c3a35)}
 .issue-viewer[open]{justify-content:flex-start}
 .reader-content{grid-template-columns:1fr;transform:rotate(-.5deg)}
 .reader-content:after{display:none}
 .reader-copy{padding:24px 25px 27px;min-height:330px;background:linear-gradient(100deg,#fffefa 80%,#f0ece5)}
 .reader-running-head{font-size:9px;margin-bottom:20px}
 .reader-title{font-size:clamp(34px,9.5vw,52px);margin:10px 0 15px}
 .reader-source-excerpt{font-size:18px;line-height:1.3;margin-bottom:15px}
 .reader-art{height:180px;border-top:1px solid #ded6ce}
 .reader-art img{object-position:65% 28%}.reader-number{font-size:160px;transform:none}
 .reader-art:after{font-size:15px;bottom:16px;right:17px}
}
@media(prefers-reduced-motion:reduce){.petro-collection .object-drift,.petro-collection .object-face:before,.reader-stage.is-arriving .reader-content{animation:none!important}.petro-collection .showroom-track{scroll-behavior:auto}.magazine-flight{display:none!important}}
@media(forced-colors:active){.collection-invitation,.reader-content,.reader-copy,.issue-viewer{background:Canvas;color:CanvasText}.reader-content{border:1px solid CanvasText}.reader-title,.reader-source-excerpt,.reader-read{color:CanvasText}.magazine-flight{display:none}}