/* 2.8: one gallery, uncropped artwork, and separate banner foreground artwork. */
.pp-pdp-gallery-column { min-width:0; align-self:start; }
.pp-pdp-gallery { border:0; padding:0; background:none; border-radius:0; }
.pp-pdp-stage { height:clamp(390px,34vw,520px); aspect-ratio:auto; background:radial-gradient(ellipse,#12334266,transparent 72%); touch-action:pan-y pinch-zoom; }
.pp-pdp-slide { min-width:0; }
.pp-pdp-slide>.pp-pdp-enlarge { display:flex; align-items:center; justify-content:center; width:100%; height:100%; cursor:zoom-in; }
.pp-pdp-slide>img,.pp-pdp-enlarge>img { width:auto; height:auto; max-width:94%; max-height:100%; object-fit:contain; border-radius:5px; filter:drop-shadow(0 8px 12px #0005); }
.pp-gallery-portrait .pp-pdp-slide:first-child img { width:auto; height:100%; max-width:92%; }
.pp-gallery-square .pp-pdp-slide:first-child img { width:min(92%,460px); height:auto; max-height:100%; }
.pp-gallery-landscape .pp-pdp-slide:first-child img,.pp-pdp-slide.pp-art-detail img { width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; }
.pp-gallery-single.pp-gallery-square .pp-pdp-stage { height:auto; aspect-ratio:1.12; max-height:460px; }
.pp-gallery-single.pp-gallery-landscape .pp-pdp-stage { height:auto; aspect-ratio:1.5; }
.pp-pdp-slide:first-child>.pp-pdp-art { width:auto; height:100%; max-width:92%; }
.pp-gallery-hint { text-align:center; color:#aec8d3; font:400 13px/1.4 var(--pp-body); margin:10px 0; }
.pp-pdp-thumbs { position:relative; display:flex; flex-wrap:nowrap; gap:10px; margin:12px 0 0; padding:4px 3px 9px; overflow-x:auto; scroll-snap-type:x proximity; }
.pp-pdp-gallery .pp-pdp-thumb,.pp-pdp-gallery.is-showing-detail .pp-pdp-thumb { display:block; flex:0 0 96px; height:72px; min-height:44px; aspect-ratio:4/3; padding:4px; scroll-snap-align:start; border:1px solid #315566; background:#071d27; }
.pp-pdp-gallery:not(.is-showing-detail) .pp-pdp-cover-thumb { display:block; }
.pp-pdp-thumb>img { object-fit:contain; width:100%; height:100%; }
.pp-pdp-thumb[aria-pressed=true] { border-color:#a6f2ff; box-shadow:0 0 0 1px #a6f2ff; }
.pp-pdp-thumb:focus-visible,.pp-pdp-enlarge:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.pp-gallery-lightbox { position:fixed; inset:0; width:100vw; height:100dvh; max-width:none; max-height:none; margin:0; padding:16px max(16px,env(safe-area-inset-right)) 16px max(16px,env(safe-area-inset-left)); border:0; background:#021018fa; color:#eafbff; }
.pp-gallery-lightbox[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:14px; }
.pp-gallery-lightbox::backdrop { background:#000e; }
.pp-lightbox-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.pp-gallery-lightbox button { min-width:44px; min-height:44px; padding:10px 16px; background:#0b2d40; border:1px solid #74ddec; border-radius:5px; color:#eafbff; font:600 16px/1.3 var(--pp-body); cursor:pointer; }
.pp-gallery-lightbox button:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.pp-lightbox-image { display:flex; align-items:center; justify-content:center; min-height:0; min-width:0; touch-action:pan-y pinch-zoom; }
.pp-lightbox-image>img { width:100%; height:100%; object-fit:contain; }
.pp-lightbox-image>.pp-pdp-art { height:min(70vh,700px); max-width:90vw; }
.pp-lightbox-controls { display:flex; justify-content:center; gap:16px; padding-bottom:env(safe-area-inset-bottom); }
.pp-lightbox-controls[hidden] { display:none; }
/* Let scenery show beyond the copy, rather than tinting the whole image cyan. */
.pp2-about { background-color:#a6f2ff; background-image:linear-gradient(90deg,#a6f2ff 0%,#a6f2fff5 62%,#a6f2ffcc 75%,#a6f2ff22 90%,transparent 100%),var(--pp-landscape-image); background-size:100% 100%,auto 100%; background-position:center,right bottom; background-repeat:no-repeat; }
.pp2-about-content { width:78%; }
.pp2-about .pp-about-artwork,.pp2-about-motto { display:none; }
/* Scenery can crop; the separate puffin cannot. */
.pp-pdp-support { background:#063363 url('images/support-wide-v23.webp') center bottom/cover no-repeat; min-height:260px; padding:24px 0; }
.pp-pdp-support::before { background:linear-gradient(90deg,transparent,#021a35a6 35%,#021a3580 75%,transparent); }
.pp-pdp-support>.pp-wrap { display:grid; grid-template-columns:minmax(140px,210px) minmax(0,1fr) auto; align-items:center; gap:20px 36px; padding:0; text-align:left; }
.pp-pdp-support .pp-support-mobile-mascot { display:block; position:static; grid-column:1; grid-row:1; width:100%; height:220px; max-height:220px; object-fit:contain; }
.pp-pdp-support-copy { grid-column:2; max-width:480px; }
.pp-pdp-support .pp-button { grid-column:3; justify-self:end; }
.pp-pdp-support-motto { display:none; }
@media(max-width:1100px) {
 .pp-pdp-stage { height:410px; }
 .pp2-about-content { width:86%; }
 .pp-pdp-support>.pp-wrap { gap:20px; grid-template-columns:150px minmax(0,1fr) auto; }
}
@media(max-width:800px) {
 .pp-pdp-gallery-column { max-width:580px; }
 .pp-pdp-stage { height:clamp(320px,65vw,430px); }
 .pp-gallery-square .pp-pdp-slide:first-child img { width:min(85%,370px); }
 .pp-gallery-single.pp-gallery-square .pp-pdp-stage { aspect-ratio:1.2; max-height:400px; }
 .pp-pdp-support { min-height:0; padding:22px 0; }
 .pp-pdp-support>.pp-wrap { grid-template-columns:minmax(90px,28%) minmax(0,1fr); gap:14px 20px; }
 .pp-pdp-support .pp-support-mobile-mascot { grid-row:1 / span 2; height:auto; max-height:200px; }
 .pp-pdp-support .pp-button { grid-column:2; justify-self:start; }
 .pp2-about { padding-bottom:150px; background-image:linear-gradient(180deg,#a6f2ff calc(100% - 150px),#a6f2ff00 calc(100% - 100px)),var(--pp-landscape-image); background-size:100% 100%,auto 180px; }
 .pp2-about-content { width:100%; }
}
@media(max-width:480px) {
 .pp-pdp-stage { height:340px; }
 .pp-gallery-square .pp-pdp-slide:first-child img { width:min(90%,290px); }
 .pp-gallery-single.pp-gallery-square .pp-pdp-stage { max-height:320px; }
 .pp-pdp-gallery .pp-pdp-thumb,.pp-pdp-gallery.is-showing-detail .pp-pdp-thumb { flex-basis:80px; height:60px; }
 .pp-pdp-support>.pp-wrap { gap:12px; }
 .pp-pdp-support .pp-support-mobile-mascot { max-height:155px; }
 .pp-pdp-support h2 { font-size:19px; }
 .pp-pdp-support p { font-size:16px; }
}
/* Keep one unavailable notice, while retaining variation-specific availability. */
.pp-pdp-summary:has(.pp-pdp-unavailable)>.stock.out-of-stock { display:none; }