/* The first primary visual fits within a square based on the available media width.
   Natural images remain proportional; portrait stages keep their media left aligned. */
.continuous-edition .flow-media{container-type:inline-size}
.continuous-edition .flow-media>.case-media:first-child>.case-plate:not(.video-stage):not(.op-player-stage):not(.op-motion-stage){width:fit-content!important;max-width:100%;min-height:0}
.continuous-edition .flow-media>.case-media:first-child>.case-plate:not(.video-stage):not(.op-player-stage):not(.op-motion-stage)>img{width:calc(100cqw * var(--primary-image-width-ratio,1))!important;height:auto!important;max-width:100%!important;max-height:100cqw!important;object-fit:contain;object-position:left top}
.continuous-edition .flow-media>.case-media:first-child>.case-plate:is(.video-stage,.op-player-stage,.op-motion-stage){width:calc(100cqw * var(--primary-image-width-ratio,1))!important;max-height:100cqw}
.continuous-edition .flow-media>.case-media:first-child>.case-plate:is(.video-stage,.op-player-stage,.op-motion-stage)>:is(img,video,iframe){object-fit:contain!important;object-position:left center}

/* One format per heading level, including case and comparison headings. */
.continuous-edition{--detail-h3-size:18px;--detail-h3-weight:600;--detail-h3-leading:1.5;--detail-heading-gap:12px}
.case-commentary>h3,.comparison-reading h3,.editorial-analysis h3,.case-study-extra>h3,.continuous-edition .editorial-row>.editorial-eyebrow{font-size:var(--detail-h3-size);font-weight:var(--detail-h3-weight);line-height:var(--detail-h3-leading);color:var(--ink);margin:0 0 var(--detail-heading-gap)}
.continuous-edition .practice-card.article-note{max-width:820px;background:var(--surface,#f0f0ec);padding:24px;border:0;border-radius:16px}
.practice-card.article-note>h3{font-size:13px;font-weight:500;color:var(--muted);margin-bottom:16px}
.practice-card.article-note .practice-context{font-size:16px;line-height:1.9}

/* Role headings sit beside their copy; gallery-wide explanations keep the
   media's left edge. On small screens these two roles stack for readability. */
.continuous-edition .editorial-row{display:grid;grid-template-columns:112px minmax(0,1fr);gap:24px;width:100%;max-width:none;margin:32px 0;padding:0;border:0;background:transparent}
.editorial-copy{min-width:0}
.continuous-edition .flow-content strong{font-weight:600}
.editorial-copy p{font-size:16px;line-height:1.9;word-break:keep-all;overflow-wrap:break-word}
.editorial-copy .comparison-reading{max-width:none;margin:20px 0 0;padding:0}
.editorial-row .practice-context{max-width:none;margin:0}
.continuous-edition .case-commentary{max-width:none;padding:0;margin:20px 0 28px;background:transparent;border:0}
.related-case-media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.related-case-media:has(>:only-child){display:block}
.related-case-media>.case-media:last-child:nth-child(odd){grid-column:1/-1}
/* Subgrid aligns media and caption rows while leaving controls in their own row.
   Galleries with other child shapes retain their normal-flow layout. */
@supports (grid-template-rows:subgrid){
 @media(min-width:761px){
  .related-case-media:not(:has(>figure>:nth-child(4))):not(:has(>figure>:only-child)):not(:has(>figure>:first-child:not(.case-plate))):not(:has(>figure>:nth-child(2):not(figcaption))){row-gap:0}
  .related-case-media:not(:has(>figure>:nth-child(4))):not(:has(>figure>:only-child)):not(:has(>figure>:first-child:not(.case-plate))):not(:has(>figure>:nth-child(2):not(figcaption)))>figure{display:grid;grid-template-rows:subgrid;grid-row:span 3;align-self:stretch;align-content:start}
  .related-case-media:not(:has(>figure>:nth-child(4))):not(:has(>figure>:only-child)):not(:has(>figure>:first-child:not(.case-plate))):not(:has(>figure>:nth-child(2):not(figcaption)))>figure>.case-plate{align-self:stretch}
 }
}
@media(max-width:760px){
 .continuous-edition .editorial-row{grid-template-columns:minmax(0,1fr);gap:10px;margin:24px 0}
 .related-case-media{grid-template-columns:minmax(0,1fr);gap:24px}
}

.edition-archive .edition-list{grid-auto-rows:1fr}
.edition-archive .edition-banner-link{height:100%;box-sizing:border-box}
.edition-archive .edition-banner-image{aspect-ratio:8/5;min-height:0}
.edition-archive .edition-banner-image>img{display:block;width:100%;height:100%;max-height:none;object-fit:cover}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-character"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-clinical"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-collage"]{--primary-image-width-ratio:0.8}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-color"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-craft"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-editorial"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-glass"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-gradient"]{--primary-image-width-ratio:0.8}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-heritage"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-index"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-local"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-maximalism"]{--primary-image-width-ratio:0.5263671875}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-micrographics"]{--primary-image-width-ratio:0.8}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-minimal"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-mixedtype"]{--primary-image-width-ratio:0.8}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-organic"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-pen2026-specimen"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-remote2026-applications"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-retro"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-serif"]{--primary-image-width-ratio:0.666666666667}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-surreal"]{--primary-image-width-ratio:0.8}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-sustainable"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-tactile"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-graphic-variable"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-ai"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-analog-official-film"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-calm-ariya"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-character"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-craft"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-generative"]{--primary-image-width-ratio:0.8038585209}
.continuous-edition .flow-media>figure[data-media-id="M-video-hybrid-blue-shark"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-local"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-lofi"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-maximal"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-moloco2026-overview"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-platform-lesmills"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-realtime-witcher"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-sensory"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-story"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-surreal-meowwolf"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-video-type-cities"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-3d-modelviewer"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-accessible-performance"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-ai-co-creation"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-anchor-narrative-sequence"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-anti-grid"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-atum2026-mobile"]{--primary-image-width-ratio:0.965075669383}
.continuous-edition .flow-media>figure[data-media-id="M-web-cards-carbon"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-color-dropbox"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-conversation-google"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-dark-mode"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-experimental-navigation"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-expressive-type"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-feedback-carbon"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-guided-scroll"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-human-craft"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-interactive-demo"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-luxuria2026-search"]{--primary-image-width-ratio:0.966875}
.continuous-edition .flow-media>figure[data-media-id="M-web-machine-readable"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-mindful-ux"]{--primary-image-width-ratio:0.4828125}
.continuous-edition .flow-media>figure[data-media-id="M-web-modalities-google"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-motion-apple-tabbar"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-motion-juan-lab"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-nature-organic"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-personalized-ui"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-playful-web"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-quiet-ui"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-retro-poolsuite"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-sustainable-web"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-tactile-juan"]{--primary-image-width-ratio:1}
.continuous-edition .flow-media>figure[data-media-id="M-web-transparent-ai"]{--primary-image-width-ratio:1}
