/* Image-led spreads share the cinema motion switch and source-pinned images. */
.folio-frame { min-width: 0; position: relative; }
.folio-image { display: block; height: 100%; background: #171921; position: relative; isolation: isolate; overflow: hidden; }
.folio-image::before { content: ''; position: absolute; inset: -16px; background-image: var(--photo-backdrop); background-size: cover; background-position: center; filter: blur(16px); opacity: .42; z-index: -1; }
.folio-image img { width: 100%; height: 100%; object-fit: contain; }
.folio-frame figcaption { display: flex; justify-content: space-between; gap: 8px; font: 11px/1.7 var(--mono); padding: 12px 0; }
.folio-frame figcaption a { flex-shrink: 0; min-height: 28px; }
.folio-frame figcaption a:hover { text-decoration: underline; text-underline-offset: 4px; }
.portrait-ribbon { display: flex; gap: 12px; min-width: 0; align-items: flex-start; }
.portrait-ribbon .folio-frame { flex: 1 1 0; transition: flex .65s cubic-bezier(.2,.7,.2,1); }
.portrait-ribbon .folio-frame:hover, .portrait-ribbon .folio-frame:focus-within { flex-grow: 1.55; }
.portrait-ribbon .folio-image { height: 330px; background: #ded0b7; box-shadow: 0 20px 30px #15152120; }
.portrait-ribbon .folio-frame:nth-child(2) { margin-top: 35px; }
.portrait-ribbon .folio-frame:nth-child(3) { margin-top: 70px; }
.portrait-ribbon figcaption { display: block; font-size: 11px; }
.portrait-ribbon figcaption > span { display: block; }
.cinema-page .about { padding: 55px 40px; background: #eee5d8f8; }
.about-main { display: block; }
.about-heading { position: static; display: grid; grid-template-columns: .85fr 1.15fr; gap: 55px; align-items: center; margin-bottom: 50px; }
.cinema-page .about-heading h2 { font-size: clamp(42px,4.2vw,65px); line-height: 1.55; margin: 24px 0; }
.about-heading h2 span { padding-left: 0; }
.about-heading .about-intro { font-size: 13px; line-height: 2; }
.about-heading .about-scope { margin: 15px 0; font-size: 12px; }
.creative-notes { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 40px 30px; padding: 0; align-items: start; }
.cinema-page .creative-note { padding: 0; margin: 0; border: 0; transform: none; background: transparent; }
.note-art { position: relative; height: 410px; overflow: hidden; }
.note-copy { padding: 24px 5px 0; }
.creative-note h3 { font-size: 21px; line-height: 1.7; margin: 10px 0; }
.creative-note p { font-size: 13px; line-height: 1.9; margin: 10px 0 16px; }
.creative-note .note-number { font-size: 11px; letter-spacing: .04em; }
.creative-note .text-link, .note-story-link { font-size: 12px; line-height: 1.9; }
.note-story-link { display: block; width: fit-content; margin-top: 20px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.note-art .folio-frame { height: 100%; }
.note-art .folio-image { height: calc(100% - 48px); }
.note-art figcaption { min-height: 48px; padding: 10px 12px; background: #f8f1e5; color: #453c35; }
.love-art { background: #433239; }
.love-art .folio-image { padding-left: 80px; }
.art-word { position: absolute; left: 18px; top: 22px; writing-mode: vertical-rl; font: 900 68px/1 var(--mono); letter-spacing: -.04em; color: #fff6e9; pointer-events: none; }
.making-art { display: grid; grid-template-columns: 1fr 140px; grid-template-rows: minmax(0,1fr); background: #e1d4c1; }
.making-art > * { min-height: 0; }
.making-art .folio-image { background: #131418; }
.detail-lenses { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; margin: 28px 0; }
.detail-lens { min-width: 0; }
.detail-lens > div { position: relative; aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: #16181e; border: 1px solid #a8926c; box-shadow: 0 6px 18px #4c371820; }
.detail-lens img { position: absolute; max-width: none; width: 420%; height: auto; }
.lens-crown img { left: -105%; top: -170%; }
.lens-wig img { left: -75%; top: -220%; }
.lens-expression img { left: -120%; top: -242%; }
.detail-lens figcaption { padding: 12px 0 0; font: 12px/1.7 var(--mono); text-align: center; }
.detail-lens figcaption b { font-weight: 400; color: #8d6354; }
.making-art .detail-lenses { grid-template-columns: 1fr; grid-template-rows: repeat(3,minmax(0,1fr)); gap: 13px; margin: 15px 20px; }
.making-art .detail-lens > div { width: 86px; margin: auto; }
.making-art .detail-lens figcaption { background: transparent; min-height: 0; padding: 6px 0; font-size: 11px; }
.making-notebook { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 18px; margin: 20px 0; }
.making-notebook summary { font-size: 12px; padding: 12px 0; min-height: 48px; }
.making-notebook p { font-size: 13px; padding-right: 0; margin-bottom: 18px; }
.creative-note .craft-caveat { font-size: 12px; }
.editorial-detail { border-block: 1px solid var(--line); margin: 22px 0; }
.editorial-detail summary { display: flex; justify-content: space-between; gap: 12px; align-items: center; cursor: pointer; list-style: none; padding: 15px 0; min-height: 48px; font-size: 13px; line-height: 1.8; }
.editorial-detail summary::-webkit-details-marker { display: none; }
.editorial-detail summary > span { font-size: 20px; }
.editorial-detail[open] summary > span { transform: rotate(45deg); }
.editorial-detail > p { line-height: 2; }
.record-art { height: 410px; position: relative; overflow: hidden; background: radial-gradient(ellipse at 70% 20%,#526260,#17292c 75%); color: #f9ead4; border: 1px solid #7d9792; }
.record-art::before { content: ''; position: absolute; inset: 14px; border: 1px solid #b2ccbf33; pointer-events: none; }
.vinyl { position: absolute; width: 330px; aspect-ratio: 1; border-radius: 50%; left: calc(50% - 185px); top: 55px; background: repeating-radial-gradient(circle,#0b1316 0 1px,#344241 2px,#0b1316 3px 5px); box-shadow: 12px 16px 35px #0009; display: grid; place-items: center; animation: record-turn 25s linear infinite paused; }
.vinyl::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: conic-gradient(transparent 0deg,#cad7c522 40deg,transparent 60deg 220deg,#cad7c52a 250deg,transparent 280deg); }
.vinyl-label { width: 115px; height: 115px; border-radius: 50%; display: grid; align-content: center; text-align: center; background: #d6b9a0; color: #27312e; position: relative; font: italic 900 36px/1 var(--mono); }
.vinyl-label::after { content: ''; width: 7px; height: 7px; background: #142425; border-radius: 50%; position: absolute; left: calc(50% - 3.5px); bottom: 12px; }
.vinyl-label small { font: 8px/2 var(--mono); letter-spacing: .06em; }
.record-corner { position: absolute; right: 24px; top: 28px; font: 11px/1.7 var(--mono); text-align: right; }
.record-arm { position: absolute; right: 38px; top: 85px; width: 10px; height: 180px; background: linear-gradient(90deg,#65736b,#e0dfc9,#768478); border-radius: 20px; transform: rotate(27deg); transform-origin: top; box-shadow: 7px 5px 8px #0005; }
.record-arm::before { content: ''; position: absolute; top: -12px; left: -10px; width: 30px; height: 30px; border-radius: 50%; background: radial-gradient(#414f47 20%,#c9d0b9 25% 50%,#526158 60%); }
.record-arm::after { content: ''; position: absolute; bottom: -14px; left: -6px; width: 22px; height: 35px; border-radius: 3px; background: #cfb390; }
.record-ticks { position: absolute; bottom: 25px; left: 30px; right: 30px; height: 12px; background: repeating-linear-gradient(90deg,#e8d5b466 0 1px,transparent 1px 9px); }
@keyframes record-turn { to { transform: rotate(360deg); } }
.cinema-page[data-motion-state='running'] .record-art[data-inview='true'] .vinyl { animation-play-state: running; }
.source-tickets { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 20px; }
.source-tickets a { position: relative; display: block; padding: 15px 18px; background: #dfd3bf; border-left: 2px dotted #a99476; }
.source-tickets small { display: block; font: 11px/1.8 var(--mono); }
.source-tickets strong { display: block; font-size: 14px; font-weight: 400; line-height: 1.8; margin-top: 6px; }
.source-tickets a > span { position: absolute; right: 8px; top: 10px; }
.source-tickets a:hover { background: #d1c2a8; }
.original-art { background: linear-gradient(130deg,#292331,#443d56); display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: minmax(0,1fr); gap: 12px; padding: 20px 16px 20px 55px; }
.original-art .folio-frame { height: 90%; align-self: start; }
.original-art .folio-frame:nth-child(2) { align-self: end; }
.original-art .folio-image { height: calc(100% - 70px); }
.original-art figcaption { display: block; padding: 10px 6px; min-height: 70px; background: #ded5e0; }
.original-art figcaption > span { display: block; font-size: 10px; }
.original-art .art-word { font-size: 38px; left: 8px; top: 26px; }
.reading-room { display: block; background: transparent; border-left: 0; padding: 35px 0 0; }
.reading-room > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 20px; }
.reading-room > div:first-child .eyebrow { flex-basis: 100%; }
.reading-room h3 { margin: 0; }
.reading-room > div:first-child p:not(.eyebrow) { font-size: 12px; }
.reading-links { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; }
.reading-links a, .reading-links a:first-child, .reading-links a:last-child { padding: 25px 18px 20px; border: 1px solid #bcb1a0; background: #f7efdf; min-height: 220px; }
.reading-links a::before { content: 'READ ↗'; display: block; font: italic 900 30px/1 var(--mono); letter-spacing: -.04em; color: #a78873; margin-bottom: 23px; }
.reading-links a:nth-child(2)::before { content: 'LOOK ↗'; }.reading-links a:nth-child(3)::before { content: 'PLAY ↗'; }.reading-links a:nth-child(4)::before { content: 'MORE ↗'; }
.reading-meta { font-size: 11px; }.reading-links h4 { font-size: 13px; line-height: 1.8; }.reading-links p { font-size: 12px; }.reading-arrow { display: none; }
.cinema-page .timeline { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; border-left: 0; padding: 0; }
.cinema-page .timeline li { position: relative; display: block; padding: 0; border: 1px solid #c7bba8; min-width: 0; background: #f5ecdfe8; }
.timeline li > time { position: absolute; top: 12px; left: 14px; z-index: 1; padding: 5px 8px; background: #f5eedfe8; color: #353431; font-size: 11px; }
.timeline li > a { display: block; padding: 0 18px 22px; position: relative; height: 100%; }
.timeline li > a > div { margin-top: 18px; }
.timeline h3 { font-size: 15px; line-height: 1.7; padding-right: 20px; }
.timeline .eyebrow { font-size: 10px; line-height: 1.7; margin-top: 0; }
.timeline .activity-desc { margin-top: 10px; font-size: 12px; line-height: 1.8; }
.timeline .arrow { position: absolute; right: 15px; top: 225px; }
.archive-visual { display: flex; position: relative; height: 200px; margin: 0 -18px; overflow: hidden; flex-direction: column; align-items: flex-end; justify-content: center; padding: 28px; isolation: isolate; }
.archive-visual b { font: 900 clamp(38px,4vw,66px)/1 var(--mono); letter-spacing: -.06em; }
.archive-visual > span { font: 900 30px/1.5 var(--mono); }.archive-visual i { font-size: 16px; font-weight: 400; font-style: normal; }
.archive-visual em { font: 10px/1.6 var(--mono); letter-spacing: .08em; margin-top: 8px; }
.archive-making { color: #71533b; background: linear-gradient(135deg,#ddcfb4,#f2e4d2); }
.archive-making::before { content: ''; position: absolute; left: -20px; top: 35px; width: 130px; height: 130px; border: 1px solid #a6865e; transform: rotate(35deg); z-index: -1; box-shadow: 0 0 0 18px #ddccac,0 0 0 19px #a6865e; }
.archive-music { color: #e8d9bf; background: #263e3c; }
.archive-music::before { content: ''; position: absolute; left: -50px; top: 20px; width: 200px; height: 200px; border-radius: 50%; background: repeating-radial-gradient(circle,#162623 0 4px,#75948b66 5px,#162623 6px 8px); z-index: -1; }
.archive-media { color: #3c4453; background: #c8d0d6; }
.archive-media::before { content: ''; position: absolute; inset: 17px; border: 1px solid #62717e88; z-index: -1; }.archive-media b { font-style: italic; }
.archive-photo { padding: 0; display: block; background: #121620; }
.archive-photo img { width: 100%; height: 100%; object-fit: contain; }
.archive-photo small { position: absolute; bottom: 0; left: 0; right: 0; background: #13151dea; color: #fff0dc; padding: 6px 10px; font-size: 11px; }
.contact-links { gap: 15px; border: 0; }
.cinema-page .contact-links > a, .cinema-page .contact-links > a:first-child { padding: 0 0 22px; border: 0; background: #f8efded9; transition: transform .5s,box-shadow .5s; }
.social-window { display: block; height: 250px; margin-bottom: 22px; background: #2c2d36; overflow: hidden; position: relative; }
.social-window::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,#322c3366,transparent 55%); }
.social-window img { width: 100%; height: 100%; object-fit: contain; transition: transform .8s; }
.contact-links > a:hover .social-window img { transform: scale(1.04); }
.contact-links .social-name, .contact-links .social-handle, .contact-links small { margin-inline: 18px; }
.contact-links .social-name { font-size: 30px; }.contact-links small { font-size: 12px; max-width: none; }
.contact-links .social-handle { font-size: 11px; }
.contact-links .arrow { right: 16px; top: 270px; }
/* Story chapters use wide photographic spreads and physical source artifacts. */
.attachment-layout { gap: 55px; align-items: start; padding-bottom: 20px; }
.cinema-page .story-pullquote { background: #d2b298; color: #2f2725; padding: 30px 35px; }
.story-pullquote blockquote { font-size: clamp(23px,2.4vw,35px); text-wrap: balance; }
.story-pullquote .quote-slash { opacity: .3; }
.attachment-gallery { position: relative; margin: 45px 0 35px; padding-left: 25px; border-left: 1px solid #d3b98b66; }
.attachment-gallery .portrait-ribbon { gap: 25px; }
.attachment-gallery .folio-image { height: 510px; }
.attachment-gallery .folio-frame:nth-child(2) { margin-top: 55px; }.attachment-gallery .folio-frame:nth-child(3) { margin-top: 100px; }
.attachment-gallery .folio-frame figcaption { display: flex; }
.gallery-margin { font: 11px/1.7 var(--mono); letter-spacing: .07em; margin-bottom: 25px; color: var(--muted); }
.gallery-coda { display: flex; justify-content: space-between; gap: 20px; font-size: 18px; line-height: 1.8; margin-top: 25px; }.gallery-coda > span { font: 11px/1.8 var(--mono); align-self: center; }
.craft-layout { gap: 60px; }.story-craft-photo { position: sticky; top: 105px; }
.story-craft-photo img { max-height: 660px; object-fit: contain; background: #131419; }
.craft-copy .detail-lenses { margin: 25px 0; }
.lens-disclosure { font-size: 12px; line-height: 1.9; color: var(--muted); }
.play-duet { gap: 30px; align-items: stretch; }
.music-feature { padding: 0 0 30px; }
.music-feature > .eyebrow { margin: 30px 24px 0; }
.music-feature h3, .music-feature > p, .music-feature .music-records { margin-inline: 24px; }
.music-feature .record-art { height: 390px; }
.music-feature { background: #16282ad9; --line:#7e938f; --muted:#c8d0c7; }
.cinema-page .circle-feature { padding: 0 25px 25px; background: #e9dfca; color: #3e3730; --line:#b4a58c; --muted:#6c6051; }
.circle-books { position: relative; height: 390px; margin: 0 -25px 30px; background: #d4c4a7; overflow: hidden; display: flex; align-items: center; justify-content: center; gap: 12px; padding: 35px 25px; }
.circle-books::before { content: ''; position: absolute; left: 25px; right: 25px; bottom: 28px; border-bottom: 1px solid #9e8157; }
.circle-books > a { width: 43%; max-width: 190px; box-shadow: 12px 18px 20px #503d3933; transform: perspective(700px) rotateY(-14deg) rotate(-8deg); transition: transform .6s; }
.circle-books > a:nth-child(2) { transform: perspective(700px) rotateY(-14deg) rotate(9deg) translateY(20px); }
.circle-books > a:hover, .circle-books > a:focus-visible { transform: none; }
.circle-books img { width: 100%; }
.circle-books > span { position: absolute; bottom: 10px; right: 25px; font: 10px/1.5 var(--mono); }
.circle-record { border-left: 2px dotted #a38e6c; border-block: 1px solid #bcac92; padding: 25px 20px; background: #f5ead6; }
.circle-record h4 { font: italic 900 clamp(24px,2.4vw,36px)/1.25 var(--mono); }
.story-play .story-paragraph { margin-block: 14px; }
.story-references { gap: 50px; }
.story-media-link { position: relative; background: linear-gradient(125deg,#d5c5af,#f1e8d7); color: #514436; border-left: 5px solid #a5855d; }
.story-media-link::before { content: 'PRESS ↗'; display: block; font: italic 900 40px/1 var(--mono); letter-spacing: -.04em; margin-bottom: 25px; }
.cinema-page[data-motion-state='still'] .portrait-ribbon .folio-frame, .cinema-page[data-motion-state='still'] .social-window img, .cinema-page[data-motion-state='still'] .circle-books > a { transition: none; }
@media (max-width:1100px) {
  .about-heading { gap: 25px; }.portrait-ribbon .folio-image { height: 260px; }
  .note-art, .record-art { height: 350px; }.vinyl { width: 290px; left: calc(50% - 162px); top: 45px; }.record-arm { right: 26px; }
  .making-art { grid-template-columns: 1fr 108px; }.making-art .detail-lenses { margin-inline: 12px; }.making-art .detail-lens > div { width: 76px; }
  .reading-links { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .cinema-page .timeline { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .social-window { height: 200px; }.contact-links .arrow { top: 224px; }.contact-links .social-name { font-size: 24px; }
  .attachment-gallery .folio-image { height: 380px; }.attachment-gallery .folio-frame figcaption { display: block; }
}
@media (max-width:800px) {
  .about-heading { grid-template-columns: 1fr; }.cinema-page .about-heading h2 { font-size: 48px; }.about-heading h2 br { display: none; }
  .portrait-ribbon .folio-image { height: 350px; }.portrait-ribbon .folio-frame:nth-child(2) { margin-top: 20px; }.portrait-ribbon .folio-frame:nth-child(3) { margin-top: 40px; }
  .creative-notes { grid-template-columns: 1fr; gap: 40px; }.note-art { height: 440px; }.making-art { grid-template-columns: 1fr 150px; }.making-art .detail-lens > div { width: 105px; }
  .original-art { padding-left: 60px; }.note-art.original-art .folio-image { height: calc(100% - 65px); }.note-art.original-art figcaption { min-height: 65px; }
  .record-art .vinyl { width: 350px; left: calc(50% - 195px); }
  .contact-links { grid-template-columns: repeat(2,minmax(0,1fr)); }.social-window { height: 250px; }.contact-links .arrow { top: 274px; }
  .attachment-layout { gap: 20px; }.attachment-gallery .portrait-ribbon { gap: 12px; }.attachment-gallery .folio-image { height: 300px; }.attachment-gallery .folio-frame:nth-child(2) { margin-top: 25px; }.attachment-gallery .folio-frame:nth-child(3) { margin-top: 50px; }
  .craft-layout { gap: 35px; }.story-craft-photo { position: static; }.story-craft-photo img { max-height: none; }
  .play-duet { grid-template-columns: 1fr; }.music-feature .record-art, .circle-books { height: 440px; }
}
@media (max-width:600px) {
  .cinema-page .about { padding: 35px 18px; }.about-heading { margin-bottom: 35px; }.cinema-page .about-heading h2 { font-size: clamp(35px,9vw,48px); }
  .about-heading h2 br { display: block; }.about-heading .eyebrow { font-size: 10px; }
  .portrait-ribbon { gap: 8px; }.portrait-ribbon .folio-image { height: 210px; }.portrait-ribbon .folio-frame:hover, .portrait-ribbon .folio-frame:focus-within { flex-grow: 1; }
  .portrait-ribbon figcaption, .portrait-ribbon figcaption a { font-size: 10px; }.portrait-ribbon figcaption a { display: inline-block; min-height: 32px; padding-top: 5px; }
  .note-art { height: 380px; }.love-art .folio-image { padding-left: 52px; }.art-word { font-size: 48px; left: 7px; }.note-copy { padding: 20px 0 0; }
  .creative-note h3 { font-size: 19px; }.creative-note p { font-size: 13px; }.making-art { grid-template-columns: 1fr 104px; }
  .making-art .detail-lenses { margin: 15px 10px; gap: 15px; }.making-art .detail-lens > div { width: 76px; }.making-art .detail-lens figcaption { font-size: 11px; }
  .making-notebook { grid-template-columns: 1fr; gap: 0; }.making-notebook summary { font-size: 13px; }
  .record-art .vinyl { width: 285px; left: calc(50% - 165px); top: 65px; }.record-arm { right: 22px; height: 160px; }.record-corner { font-size: 10px; right: 20px; }
  .source-tickets { grid-template-columns: 1fr; }.source-tickets a { padding: 13px 16px; }.source-tickets strong { font-size: 14px; }
  .original-art { padding-left: 45px; gap: 8px; padding-right: 10px; }.original-art .art-word { left: 5px; font-size: 30px; }
  .original-art .folio-frame { height: 94%; }.original-art .folio-image { height: calc(100% - 82px); }.original-art figcaption { padding-inline: 5px; min-height: 82px; font-size: 10px; }
  .original-art figcaption a { display: block; font-size: 11px; }.original-art figcaption > span { font-size: 9px; overflow-wrap: anywhere; }
  .reading-room { padding: 20px 0 0; }.reading-room > div:first-child { gap: 8px; }.reading-links { gap: 10px; }.reading-links a, .reading-links a:first-child, .reading-links a:last-child { padding: 18px 12px; min-height: 265px; }.reading-links a::before { font-size: 26px; }.reading-meta { font-size: 10px; }.reading-links h4 { font-size: 13px; }.reading-links p { font-size: 12px; }
  .cinema-page .notes { padding: 35px 18px; }.cinema-page .timeline { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 88%; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 22px; scroll-padding-inline: 0; }.timeline li { scroll-snap-align: start; }.archive-visual { height: 220px; }.timeline .arrow { top: 243px; }.archive-visual b { font-size: 68px; }
  .contact-links { gap: 18px 12px; }.social-window { height: 220px; }.contact-links .arrow { top: 243px; right: 9px; }.contact-links .social-name { font-size: 25px; }.contact-links .social-name, .contact-links .social-handle, .contact-links small { margin-inline: 12px; }.contact-links .social-handle { font-size: 11px; }.contact-links small { font-size: 12px; }
  .attachment-gallery { padding-left: 12px; margin-top: 30px; }.attachment-gallery .portrait-ribbon { display: grid; grid-template-columns: 1fr 1fr; gap: 15px 10px; }.attachment-gallery .folio-frame:first-child { grid-column: 1 / -1; }.attachment-gallery .folio-image { height: 280px; }.attachment-gallery .folio-frame:first-child .folio-image { height: 400px; }.attachment-gallery .folio-frame:nth-child(2), .attachment-gallery .folio-frame:nth-child(3) { margin-top: 0; }
  .attachment-gallery figcaption, .attachment-gallery figcaption a { font-size: 11px; }.gallery-coda { display: block; font-size: 16px; }.gallery-coda span { display: block; margin-top: 8px; }.gallery-margin { font-size: 10px; }
  .story-pullquote { padding: 28px 23px; }.craft-copy .detail-lenses { gap: 10px; }.detail-lens figcaption { font-size: 12px; }.detail-lens figcaption b { display: block; }
  .music-feature .record-art { height: 380px; }.circle-books { height: 350px; }.music-feature h3, .music-feature > p, .music-feature .music-records { margin-inline: 20px; }
  .circle-feature { padding-inline: 20px; }.circle-books { margin-inline: -20px; }.circle-record { padding: 20px 15px; }.circle-record h4 { font-size: 27px; }
}
/* Photographic doors and a full-width original-work exhibition. */
.cinema-page .story-invitation { display: block; padding: 48px 40px 24px; background: radial-gradient(ellipse at 50% 65%,#63515a70,transparent 65%),#20202ce8; }
.portal-heading { display: grid; grid-template-columns: 1.1fr 1fr; gap: 50px; align-items: end; margin-bottom: 42px; }
.story-invitation .portal-heading h2 { font-size: clamp(32px,4.2vw,60px); line-height: 1.45; margin: 15px 0 0; }
.portal-heading .invitation-link { margin-bottom: 10px; }
.portal-triptych { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; perspective: 1600px; padding-block: 14px 35px; }
.portal-door { min-width: 0; background: #26252d; border: 1px solid #d3b98b70; padding: 9px 9px 0; box-shadow: 0 25px 35px #0005; transform: rotateY(9deg); transform-origin: right center; transition: transform .65s,box-shadow .65s; }
.portal-door:nth-child(2) { transform: translateY(-14px); background: #3f3540; }
.portal-door:nth-child(3) { transform: rotateY(-9deg); transform-origin: left center; }
.portal-door:hover, .portal-door:focus-within { transform: translateY(-8px); box-shadow: 0 30px 50px #0007,0 0 25px #d3b98b18; }
.portal-door .folio-image { height: clamp(300px,34vw,460px); }
.portal-door .folio-image::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg,transparent 25%,#fff1d61c 45%,transparent 65%); translate: -110% 0; pointer-events: none; transition: translate .9s; }
.portal-door:hover .folio-image::after, .portal-door:focus-within .folio-image::after { translate: 110% 0; }
.portal-door figcaption { display: block; padding: 12px 5px 0; color: #d6c4b5; }
.portal-door figcaption > span { display: block; font: 900 clamp(17px,2.1vw,29px)/1.3 var(--mono); letter-spacing: -.04em; }
.portal-door figcaption a { display: inline-block; padding-block: 6px; }
.portal-chapter { display: flex; justify-content: space-between; gap: 8px; padding: 16px 5px; border-top: 1px solid #d3b98b44; font-size: 14px; }
.story-invitation .portal-foot { display: flex; justify-content: space-between; gap: 15px; font: 10px/1.8 var(--mono); letter-spacing: .05em; border-top: 1px solid #d3b98b44; padding-top: 20px; margin: 0; }
.portal-foot > span { font: 12px/1.8 var(--sans); }.portal-foot a { margin-left: 12px; text-decoration: underline; text-underline-offset: 4px; }
.original-layout { display: block; }
.original-copy { display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: 50px; margin-bottom: 35px; }
.original h2 { font-size: clamp(34px,4.3vw,62px); }.original-copy .original-lead { font-size: 20px; }
.original-panorama { display: grid; grid-template-columns: 1fr 1.18fr 1fr; gap: 20px; position: relative; padding: 30px 0 60px; }
.original-panorama::before { content: ''; position: absolute; inset: 0 -35px 15px; background: linear-gradient(120deg,#75839533,#b6779e25 48%,#e1b08122); clip-path: polygon(0 9%,100% 0,100% 90%,0 100%); pointer-events: none; }
.original-panorama .folio-frame { padding: 9px; background: #171821; box-shadow: 0 25px 40px #0005; align-self: start; }
.original-panorama .folio-frame:nth-child(2) { margin-top: 50px; }.original-panorama .folio-frame:nth-child(3) { margin-top: 100px; }
.original-panorama .folio-image { height: clamp(290px,35vw,480px); }
.original-panorama figcaption { display: block; padding: 12px 4px 0; }.original-panorama figcaption > span { display: block; font-size: 12px; color: #d2bfcf; }.original-panorama figcaption a { display: inline-block; padding-block: 6px; }
.original-bridge { display: grid; grid-template-columns: 1fr 210px 1.2fr; gap: 45px; align-items: center; padding: 45px 0 0; border-top: 1px solid #c7b2c766; }
.bridge-word { font: italic 900 clamp(30px,4.4vw,65px)/.94 var(--mono); letter-spacing: -.06em; color: #bba2b7; }
.bridge-cover { display: block; padding: 9px; background: #ede3d7; color: #4c3b3e; transform: perspective(700px) rotateY(-12deg) rotate(-6deg); box-shadow: 12px 18px 30px #0005; transition: transform .6s; }.bridge-cover:hover, .bridge-cover:focus-visible { transform: none; }.bridge-cover img { width: 100%; }.bridge-cover > span { display: block; padding: 10px 3px 2px; font: 11px/1.5 var(--mono); }
.original-bridge h3 { font-size: 26px; font-weight: 400; line-height: 1.7; margin: 18px 0; }.original-bridge p:not(.eyebrow) { font-size: 13px; line-height: 2; margin-bottom: 22px; }
.loupe-controls { margin: 4px 4px 0; padding-top: 10px; border-top: 1px solid #d3b98b44; }
.loupe-toggle { border: 1px solid #ab938a; border-radius: 25px; background: transparent; color: #eadccb; padding: 10px 15px; min-height: 44px; font: 12px/1.5 var(--sans); cursor: pointer; }.loupe-toggle[aria-pressed='true'] { background: #decbb0; color: #302c34; }
.loupe-help { display: block; font-size: 10px; line-height: 1.8; color: #cfbecb; padding-top: 8px; }
.photo-loupe { display: none; position: absolute; left: var(--loupe-left); top: var(--loupe-top); width: var(--loupe-size); height: var(--loupe-size); border-radius: 50%; pointer-events: none; background-image: var(--photo-full); background-repeat: no-repeat; background-color: #181820; background-size: var(--loupe-width) var(--loupe-height); background-position: var(--loupe-x) var(--loupe-y); box-shadow: 0 0 0 2px #ead4ae,0 0 0 7px #1d1b2266,0 10px 30px #0009; z-index: 2; }
[data-loupe-on='true'] .photo-loupe { display: block; }
.cinema-page[data-motion-state='still'] .portal-door, .cinema-page[data-motion-state='still'] .bridge-cover { transform: none; transition: none; }
.cinema-page[data-motion-state='still'] .portal-door .folio-image::after { display: none; }
@media (max-width:1000px) {
  .original-bridge { grid-template-columns: 170px 1fr; gap: 35px; }.bridge-word { display: none; }
  .portal-heading { gap: 25px; }.portal-chapter { font-size: 12px; }.portal-foot > span { font-size: 11px; }
  .original-panorama { gap: 12px; }.original-panorama .folio-frame { padding: 6px; }
}
@media (max-width:600px) {
  .cinema-page .story-invitation { padding: 28px 18px 22px; }
  .portal-heading { grid-template-columns: 1fr; gap: 6px; margin-bottom: 20px; }.story-invitation .portal-heading h2 { font-size: 38px; }
  .portal-triptych { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 88%; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; perspective: none; padding: 6px 2px 25px; }
  .portal-triptych .portal-door { transform: none; scroll-snap-align: center; box-shadow: none; }.portal-door .folio-image { height: 345px; }.portal-door figcaption > span { font-size: 25px; }.portal-chapter { font-size: 14px; }
  .story-invitation .portal-foot { display: block; }.portal-foot > span { display: block; margin-top: 10px; }
  .original-copy { grid-template-columns: 1fr; gap: 0; margin-bottom: 25px; }.original h2 { font-size: 36px; margin-bottom: 25px; }.original-copy .original-lead { font-size: 17px; }
  .original-panorama { grid-template-columns: 1fr; gap: 30px; padding: 20px 0 35px; }.original-panorama .folio-frame { padding: 8px; margin: 0 20px 0 0; }.original-panorama .folio-frame:nth-child(2) { margin: 0 0 0 20px; }.original-panorama .folio-frame:nth-child(3) { margin: 0 20px 0 0; }.original-panorama .folio-image { height: 380px; }
  .original-panorama figcaption { display: flex; flex-wrap: wrap; gap: 0 10px; align-items: center; }.original-panorama figcaption > span { font-size: 11px; }
  .original-bridge { grid-template-columns: 105px 1fr; gap: 25px; padding-top: 35px; }.original-bridge h3 { font-size: 20px; }.original-bridge .eyebrow { font-size: 9px; }.original-bridge p:not(.eyebrow) { font-size: 12px; }.original-bridge p br { display: none; }.bridge-cover { padding: 5px; }.bridge-cover > span { font-size: 9px; }
}
@media (prefers-reduced-motion:reduce) {
  .portal-triptych .portal-door, .bridge-cover { transform: none; transition: none; }.portal-door .folio-image::after { display: none; }
  .portrait-ribbon .folio-frame, .social-window img, .circle-books > a { transition: none; }
  .vinyl { animation: none; }
}