/* The director's cut: a cinematic opening, an editorial studio, a living gallery. */
.home { --w: 1280px; --section-space: 126px; }
.home .bar { background: var(--night); color: var(--paper); border-color: #ffffff14; }
.home .bar .mark { color: var(--paper); }
.home .bar nav a { color: #c4c9bb; }
.home .bar nav a:hover { color: var(--acid); }
.home .bar .lang-select { color: #e2e5d8; border-color: #ffffff2b; }
.home .bar .lang-select option { color: var(--ink); background: var(--paper); }
.home .reading-progress { background: var(--acid); }
.home .display { font-size: clamp(42px, 5.4vw, 76px); line-height: 1.04; letter-spacing: -.055em; font-weight: 500; }
.home .display em { font-family: var(--serif); font-style: italic; font-weight: 400; letter-spacing: -.03em; }
.home .eyebrow { display: flex; align-items: center; gap: 22px; font: 10px/1.6 var(--mono); letter-spacing: .09em; }
.chapter { opacity: .65; }
.home .section-heading { display: grid; grid-template-columns: 1fr .65fr; align-items: end; gap: 22px 100px; margin-bottom: 46px; }
.home .section-heading > .eyebrow { grid-column: 1 / -1; margin-bottom: 6px; }
.home .section-heading h2 { margin: 0; }
.home .section-intro { max-width: 370px; margin: 0 0 6px; color: var(--ink-soft); font-size: 15px; line-height: 1.7; }
.home .section-heading > .text-link { justify-self: end; margin-bottom: 8px; }
.home .text-link { padding-bottom: 7px; border-bottom: 1px solid currentColor; font-size: 13px; }
.home .text-link:hover { text-decoration: none; }

/* Opening: all typography is real text, all art is local. */
.opening { overflow: hidden; background: var(--night); color: var(--paper); }
.scene-hero { max-width: 1360px; margin: 0 auto; padding: 28px 32px 0; }
.hero-topline { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.hero-topline .eyebrow { margin: 0; color: #b3bbab; gap: 12px; font-size: 9px; }
.status-light { width: 5px; height: 5px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 9px #d8ef7655; }
.edition { color: #8e9885; font: 9px var(--mono); letter-spacing: .09em; }
.hero-composition { min-height: 650px; position: relative; display: flex; align-items: center; }
.hero-type { position: relative; z-index: 2; width: 58%; padding: 48px 0 46px; }
.hero-type h1 { position: relative; width: max-content; max-width: 100%; margin: 0 0 34px; word-spacing: .06em; font-size: clamp(95px, 11.3vw, 162px); font-weight: 500; letter-spacing: -.085em; line-height: .85; }
.hero-type h1 em { display: inline-block; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.2em; letter-spacing: -.045em; line-height: .9; color: var(--acid); padding-bottom: .06em; }
.title-period { display: inline-flex; align-items: center; justify-content: center; vertical-align: .7em; margin-left: .6em; height: 1.6em; width: 1.6em; border: 1px solid #d8ef764d; border-radius: 50%; color: var(--acid); font-size: .2em; letter-spacing: 0; }
.hero-type > p:not(.purchase-note) { max-width: 345px; margin: 0 0 25px; color: #b8c0b1; font-size: 14px; line-height: 1.75; }
.hero-actions { display: flex; align-items: center; gap: 25px; }
.scene-button { display: inline-flex; align-items: center; gap: 26px; padding: 7px 7px 7px 21px; background: var(--acid); color: #192315; border-radius: 3px; min-height: 50px; font-size: 13px; font-weight: 600; text-decoration: none; transition: background .2s; }
.scene-button:hover { background: #ebffa1; color: #192315; }
.button-arrow { display: grid; place-items: center; width: 35px; height: 35px; border-left: 1px solid #26371933; font-size: 23px; font-weight: 400; }
.hero-explore { display: inline-flex; align-items: center; gap: 12px; color: #d4d9cc; text-decoration: none; font-size: 12px; }
.hero-explore:hover { color: var(--acid); }
.play-symbol { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid #a5b09866; border-radius: 50%; font-size: 14px; }
.purchase-note { font: 10px/1.8 var(--mono); color: #a0ab94; margin-top: 19px; max-width: 420px; }
.hero-art { position: absolute; width: 79%; right: -16%; top: 10px; bottom: 0; margin: 0; pointer-events: none; mask-image: linear-gradient(90deg, transparent, #000 15%, #000 93%, transparent), linear-gradient(180deg, transparent, #000 12%, #000 85%, transparent); mask-composite: intersect; }
.hero-art img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: lighten; transform: translate3d(var(--art-x, 0px), var(--art-y, 0px), 0); transition: transform .45s ease-out; }
.hero-art figcaption { position: absolute; bottom: 38px; left: 30%; width: 46%; display: flex; justify-content: space-between; align-items: flex-end; font: 8px/1.6 var(--mono); color: #929e86; letter-spacing: .06em; }
.art-cross { position: absolute; color: #819174; font: 20px var(--mono); }
.cross-one { top: 16%; left: 20%; }.cross-two { right: 22%; bottom: 15%; }
.hero-baseline { display: flex; align-items: center; gap: 48px; border-top: 1px solid #dce5cc25; min-height: 63px; color: #a5ae9b; font: 10px var(--mono); }
.hero-baseline > span::before { content: "+"; color: var(--acid); margin-right: 10px; }
.hero-baseline a { margin-left: auto; text-decoration: none; color: #b8c0ae; font-size: 8px; letter-spacing: .06em; }
.manifesto-strip { display: flex; justify-content: space-around; align-items: center; gap: 35px; height: 70px; overflow: hidden; background: var(--acid); color: #28391c; font-size: clamp(16px, 2vw, 24px); font-weight: 500; letter-spacing: -.03em; white-space: nowrap; }
.manifesto-strip i { font-style: normal; font-size: 36px; font-weight: 400; }

/* The actual app. Native feature radios keep this usable without scripts. */
.studio-section { padding-top: 110px; }
.home .inspector-frame { grid-template-columns: 185px minmax(0, 1fr); border: 1px solid #d0d3c4; border-radius: 3px; background: #e6e7dc; min-height: 565px; }
.home .feat-sidebar { padding: 21px 15px; background: transparent; border-color: #d0d3c4; gap: 3px; }
.home .feat-sidebar label { padding: 9px 11px; font-size: 12px; border-radius: 2px; }
.home .feat-item input:checked ~ label { background: var(--night); color: var(--paper); }
.home .feat-item input:checked ~ label .dot { background: var(--acid) !important; }
.home .feat-detail { padding: 36px 44px; align-items: center; }
.home .feat-panel h3 { font-size: 30px; font-weight: 500; margin-bottom: 12px; }
.home .feat-panel p { font-size: 14px; max-width: 67ch; color: #535e4b; }
.home .feat-panel.has-shot { gap: 28px; }
.home .feat-copy { max-width: 740px; }
.home .feat-shot { max-width: 820px; border: 1px solid #232d2344; border-radius: 7px; box-shadow: 0 18px 38px #2331181c; }
.home .feat-panel:not(.has-shot) { padding: 55px 40px; }
.home .feat-panel:not(.has-shot) h3 { max-width: 18ch; font-size: 54px; }
.home .feat-panel:not(.has-shot) p { max-width: 49ch; margin-top: 25px; }

/* Three graphic gestures explain the product, without playing fake video. */
.process-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 34px; }
.process-grid article { min-width: 0; }
.process-grid h3 { font-size: 26px; font-weight: 500; letter-spacing: -.045em; margin: 23px 0 13px; }
.process-grid p { margin: 0; max-width: 34ch; color: var(--ink-soft); font-size: 14px; }
.process-art { height: 225px; position: relative; overflow: hidden; background: #e3e4d9; border: 1px solid #d2d6c7; }
.process-number { position: absolute; bottom: 10px; right: 14px; font: 10px var(--mono); color: #4b5b3d; }
.record-disc { position: absolute; top: 50%; left: 50%; width: 77px; height: 77px; border-radius: 50%; background: #647450; box-shadow: 0 0 0 18px #d6dac9, 0 0 0 19px #b6c09f; transform: translate(-50%,-50%); }
.record-label { position: absolute; top: 16px; left: 18px; font: 9px var(--mono); letter-spacing: .1em; color: #50633e; }
.viewfinder-corner { position: absolute; inset: 30px; border: 1px solid #b7c0a6; clip-path: polygon(0 0,20% 0,20% 1%,1% 1%,1% 20%,0 20%,0 0,100% 0,100% 20%,99% 20%,99% 1%,80% 1%,80% 0,100% 0,100% 100%,80% 100%,80% 99%,99% 99%,99% 80%,100% 80%,100% 100%,0 100%,0 80%,1% 80%,1% 99%,20% 99%,20% 100%,0 100%); }
.edit-art { background: #dbdecd; }
.edit-track { position: absolute; height: 29px; border-radius: 3px; background: #7f8f5d; background-image: repeating-linear-gradient(90deg,transparent 0 9px,#dce6c044 9px 10px); }
.track-one { top: 74px; width: 75%; left: 12%; }.track-two { top: 112px; width: 48%; left: 12%; background-color: #a4b583; }
.edit-playhead { position: absolute; left: 55%; top: 46px; bottom: 45px; width: 1px; background: #344424; }
.edit-playhead::before { content: ""; position: absolute; width: 9px; height: 9px; left: -4px; top: -2px; background: #344424; clip-path: polygon(0 0,100% 0,100% 60%,50% 100%,0 60%); }
.export-art { background: #d1d7c1; }
.format-square { position: absolute; width: 85px; height: 85px; border: 1px solid #8b9976; top: 43px; left: 20%; transform: rotate(-12deg); }
.format-portrait { position: absolute; width: 65px; height: 112px; border: 1px solid #788a5d; top: 44px; left: 49%; transform: rotate(13deg); }
.format-landscape { position: absolute; display: grid; place-items: center; width: 155px; height: 96px; left: calc(50% - 78px); top: 82px; background: #64794c; color: #e8f0d9; font-size: 65px; font-weight: 400; box-shadow: 0 9px 24px #46592f25; }

/* A real, selectable gallery with room for the artwork. */
.theme-gallery { margin-top: 128px; color: var(--paper); background: var(--night); }
.gallery-inner { padding-top: 95px; padding-bottom: 58px; }
.theme-gallery .eyebrow { color: #b4c38d; }.theme-gallery .section-intro { color: #aeb8a4; }
.theme-player { display: flex; flex-direction: column; }
.theme-options { display: flex; order: 2; border-bottom: 1px solid #d7dfca2a; margin-top: 20px; gap: 8px; }
.theme-option { flex: 1; min-width: 0; }
.theme-option input { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
.theme-option label { display: flex; align-items: center; gap: 10px; padding: 13px 7px 19px; border-bottom: 2px solid transparent; color: #a0ad92; font-size: 10px; cursor: pointer; }
.theme-option label img { width: 39px; height: 28px; object-fit: cover; border-radius: 2px; filter: saturate(.6); }
.theme-option input:checked ~ label { color: var(--acid); border-color: var(--acid); }
.theme-option input:checked ~ label img { filter: none; }
.theme-option input:focus-visible ~ label { outline: 2px solid var(--acid); outline-offset: -2px; }
.theme-select-mark { margin-left: auto; font-size: 15px; }
.theme-screen { order: 1; background: #242c21; overflow: hidden; border-radius: 2px; }
.theme-scene { display: none; position: relative; margin: 0; }
.theme-scene > img { width: 100%; aspect-ratio: 2.1; object-fit: cover; }
.theme-scene figcaption { position: absolute; inset: auto 0 0; padding: 58px 32px 24px; display: grid; grid-template-columns: 1fr auto; align-items: end; color: #fff; background: linear-gradient(transparent,#000b); }
.theme-caption-label { font: 8px/1.6 var(--mono); letter-spacing: .12em; grid-column: 1/-1; margin-bottom: 7px; }
.theme-scene strong { font-size: clamp(32px,4.4vw,62px); line-height: 1.1; font-weight: 400; letter-spacing: -.04em; }
.theme-availability { padding: 5px 9px; font: 9px var(--mono); border: 1px solid #fff7; border-radius: 2px; }
.theme-scene-index { position: absolute; top: 25px; right: 30px; font: 9px var(--mono); }
.theme-player:has(#theme-banana:checked) #theme-scene-banana,
.theme-player:has(#theme-hokusai:checked) #theme-scene-hokusai,
.theme-player:has(#theme-pop:checked) #theme-scene-pop,
.theme-player:has(#theme-utamaro:checked) #theme-scene-utamaro,
.theme-player:has(#theme-hiroshige:checked) #theme-scene-hiroshige { display: block; }
.gallery-disclosure { max-width: 710px; margin: 23px 0 0; color: #a0ad92; font: 10px/1.8 var(--mono); }

/* Words become edits. The sample is illustrative, never a false live control. */
.words-section { display: grid; grid-template-columns: 1fr .95fr; gap: 86px; align-items: center; }
.words-copy h2 { margin: 0 0 25px; }
.words-copy > p:not(.eyebrow) { max-width: 440px; margin: 0 0 25px; color: var(--ink-soft); font-size: 14px; }
.transcript-art { background: #e0e4d5; padding: 24px 28px; border: 1px solid #ccd3bd; transform: rotate(2deg); }
.transcript-topline { display: flex; justify-content: space-between; gap: 15px; color: #5a6a48; font: 8px var(--mono); }
.transcript-art > p { margin: 45px 0; font-size: clamp(24px,3vw,40px); line-height: 1.55; letter-spacing: -.03em; }
.transcript-art del { color: #959e88; text-decoration-thickness: 1px; }
.transcript-art mark { color: #26381b; background: #c2d594; box-shadow: 4px 0 #c2d594,-4px 0 #c2d594; }
.transcript-bottom { display: flex; align-items: center; justify-content: space-between; font: 9px var(--mono); color: #5a6a48; border-top: 1px solid #b8c3a6; padding-top: 18px; }
.transcript-bottom > span:last-child { font-size: 24px; }
.ownership-band { margin-top: 126px; background: var(--acid); }
.ownership-inner { padding-top: 78px; padding-bottom: 65px; }
.ownership-inner > .eyebrow { color: #4d5d32; }
.ownership-inner > h2 { margin: 20px 0 55px; font-size: clamp(60px, 8vw, 114px); letter-spacing: -.07em; }
.ownership-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 38px; border-top: 1px solid #26371755; padding-top: 24px; }
.ownership-facts a { position: relative; text-decoration: none; color: #27381c; }
.ownership-facts a > span { font: 9px var(--mono); }
.ownership-facts h3 { margin: 22px 0 9px; font-size: 21px; font-weight: 500; letter-spacing: -.03em; }
.ownership-facts p { max-width: 30ch; margin: 0; font-size: 13px; color: #4d6032; }
.ownership-facts i { position: absolute; right: 4px; top: -7px; font-size: 24px; font-style: normal; }
.ownership-facts a:hover h3 { text-decoration: underline; text-underline-offset: 5px; }
.keyboard-invitation { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 100px; }
.keyboard-invitation h2 { margin: 0 0 26px; }
.command-art { display: flex; gap: 18px; justify-content: center; padding: 40px 0; }
.command-art span { display: grid; place-items: center; width: 145px; height: 145px; background: #e2e5d9; border: 1px solid #c7ceb8; border-bottom-width: 7px; border-radius: 16px; font-size: 78px; font-weight: 400; color: #758760; transform: rotate(-9deg); box-shadow: 0 24px 32px #26391610; }
.command-art span + span { transform: rotate(8deg) translateY(22px); }
.scene-faq { display: grid; grid-template-columns: .85fr 1.2fr; gap: 0 86px; align-items: start; }
.scene-faq > .eyebrow { grid-column: 1; }
.scene-faq > h2 { grid-column: 1; margin: 0; font-size: 56px; }
.scene-faq > .lede { grid-column: 1; margin: 22px 0; font-size: 14px; }
.scene-faq .faq { grid-column: 2; grid-row: 1 / span 4; max-width: none; }
.scene-faq .faq summary { font-size: 14px; padding: 18px 0; }
.scene-faq .faq details p { font-size: 13px; }
.closing-scene { position: relative; overflow: hidden; background: var(--night); color: var(--paper); margin-top: 125px; }
.closing-inner { position: relative; padding-top: 85px; padding-bottom: 86px; }
.closing-inner .eyebrow { color: #acba96; }.closing-inner h2 { margin: 25px 0 40px; font-size: clamp(65px, 8.4vw, 120px); }
.closing-inner h2 em { color: var(--acid); }
.closing-asterisk { position: absolute; top: 50%; right: 5%; transform: translateY(-50%) rotate(-15deg); color: var(--acid); font-size: clamp(170px,29vw,380px); line-height: 1; font-weight: 400; }
.home footer { margin-top: 0; background: var(--night); color: #b8c2aa; border-color: #d8ef7629; overflow: hidden; }
.footer-wordmark { max-width: 1360px; margin: 0 auto; padding: 10px 26px 0; color: var(--paper); font-size: clamp(100px,20.5vw,290px); font-weight: 500; letter-spacing: -.09em; line-height: 1; white-space: nowrap; }
.footer-wordmark > span { display: inline-block; vertical-align: top; font-size: .24em; margin-top: .45em; margin-left: .18em; color: var(--acid); }
.home .foot { padding-top: 42px; }
.home .footer-top .mark { color: var(--paper); }
.home .footer-top p,.home .footer-bottom,.home .footer-links a,.home .footer-bottom a { color: #a2af94; }
.home .footer-top .text-link { color: var(--acid); }
.home .footer-bottom { border-color: #d8ef7621; }
.home .footer-links a:hover,.home .footer-bottom a:hover { color: var(--acid); }
.home :focus-visible { outline-color: #6e8c3f; }
.opening :focus-visible,.theme-gallery :focus-visible,.closing-scene :focus-visible,.home .bar :focus-visible,.home footer :focus-visible { outline-color: var(--acid); }

/* Motion enhances the composition; it never gates content. */
@media (prefers-reduced-motion: no-preference) {
  .hero-type { animation: entrance .8s ease both; }
  .hero-art { animation: art-entrance 1.2s ease both; }
  [data-reveal].will-reveal { opacity: 0; transform: translateY(24px); }
  [data-reveal].will-reveal.is-visible { opacity: 1; transform: translateY(0); transition: opacity .7s ease,transform .7s ease; }
  .transcript-art.will-reveal.is-visible { transform: rotate(2deg); }
}
@keyframes entrance { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes art-entrance { from { opacity: 0; transform: translateX(20px) scale(.98); } to { opacity: 1; transform: translateX(0) scale(1); } }

/* CJK needs its own typographic proportions, not squeezed Latin settings. */
.home:lang(zh-Hans) .hero-type h1, .home:lang(ja) .hero-type h1 { font-size: clamp(65px, 7.8vw, 110px); line-height: 1.1; letter-spacing: -.075em; }
.home:lang(zh-Hans) .display em,.home:lang(zh-Hans) .hero-type h1 em { font-family: "Songti SC",STSong,serif; font-style: normal; }
.home:lang(ja) .display em,.home:lang(ja) .hero-type h1 em { font-family: "Yu Mincho","Hiragino Mincho ProN",serif; font-style: normal; }
.home:lang(ja) .hero-type h1 { font-size: clamp(53px,6.4vw,90px); }
.home:lang(zh-Hans) .display,.home:lang(ja) .display { font-size: clamp(35px,4.6vw,64px); line-height: 1.2; }
.home:lang(zh-Hans) .ownership-inner h2,.home:lang(ja) .ownership-inner h2 { font-size: clamp(58px,7vw,96px); }
.home:lang(zh-Hans) .closing-inner h2,.home:lang(ja) .closing-inner h2 { font-size: clamp(56px,7.5vw,104px); }
.home:lang(ja) .theme-option label { font-size: 9px; gap: 7px; }
@media (max-width: 1000px) {
  .home { --section-space: 90px; }
  .hero-composition { min-height: 585px; }
  .hero-type { width: 64%; }
  .hero-art { width: 92%; right: -29%; }
  .hero-baseline { gap: 25px; }
  .home .section-heading { gap: 20px 42px; }
  .home .feat-detail { padding: 30px; }
  .home .inspector-frame { grid-template-columns: 160px minmax(0,1fr); min-height: 530px; }
  .home .feat-sidebar { padding: 16px 8px; }
  .home .feat-sidebar label { font-size: 11px; }
  .process-grid { gap: 22px; }
  .process-art { height: 190px; }
  .words-section, .keyboard-invitation, .scene-faq { gap: 45px; }
  .theme-option label { flex-wrap: wrap; gap: 8px; }
  .theme-option label img { display: none; }
  .theme-gallery,.ownership-band,.closing-scene { margin-top: 95px; }
}
@media (max-width: 760px) {
  .scene-hero { padding: 23px 24px 0; }
  .hero-composition { min-height: 660px; align-items: flex-start; }
  .hero-type { width: 100%; padding-top: 35px; }
  .hero-type h1 { font-size: 100px; }
  .hero-type > p:not(.purchase-note) { max-width: 290px; }
  .hero-art { top: 255px; right: -23%; width: 89%; bottom: -12px; }
  .hero-art figcaption { display: none; }
  .art-cross { display: none; }
  .hero-type .purchase-note { max-width: 290px; }
  .hero-baseline { flex-wrap: wrap; gap: 14px 26px; padding: 22px 0; font-size: 8px; }
  .hero-baseline a { display: none; }
  .manifesto-strip { gap: 20px; justify-content: flex-start; padding: 0 25px; height: 58px; }
  .manifesto-strip span:last-of-type,.manifesto-strip i:last-child { display: none; }
  .home .section-heading { grid-template-columns: 1fr; gap: 18px; }
  .home .section-heading > .eyebrow { grid-column: auto; }
  .home .section-heading > .text-link { justify-self: start; }
  .home .section-intro { max-width: 480px; }
  .home .inspector-frame { grid-template-columns: 1fr; min-height: 0; }
  .home .feat-sidebar { padding: 14px; flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid #d0d3c4; }
  .home .feat-sidebar label { padding: 8px 9px; }
  .home .feat-detail { padding: 25px; min-height: 280px; }
  .home .feat-panel:not(.has-shot) { padding: 30px 6px; }
  .home .feat-panel:not(.has-shot) h3 { font-size: 38px; }
  .process-grid { gap: 28px; grid-template-columns: 1fr; }
  .process-grid article { display: grid; grid-template-columns: 180px 1fr; gap: 12px 28px; align-content: center; }
  .process-art { grid-row: 1/span 2; height: 180px; }
  .process-grid h3 { align-self: end; margin: 15px 0 0; font-size: 24px; }
  .process-grid p { align-self: start; font-size: 13px; margin-bottom: 12px; }
  .format-landscape { width: 110px; height: 72px; left: calc(50% - 55px); top: 70px; font-size: 47px; }
  .format-square { width: 64px; height: 64px; left: 18%; }.format-portrait { height: 87px; width: 52px; }
  .theme-options { flex-wrap: wrap; gap: 0 12px; }.theme-option { flex: 0 1 auto; }
  .theme-option label { padding: 12px 5px; gap: 12px; }.theme-select-mark { display: none; }
  .theme-scene > img { aspect-ratio: 1.55; }.theme-scene figcaption { padding: 45px 22px 22px; }
  .gallery-inner { padding-top: 65px; padding-bottom: 40px; }
  .words-section { grid-template-columns: 1fr; gap: 42px; }
  .transcript-art { max-width: 520px; margin: 0 8px; }
  .transcript-art > p { font-size: 35px; }
  .ownership-inner { padding-top: 58px; padding-bottom: 50px; }
  .ownership-facts { grid-template-columns: 1fr; gap: 26px; }
  .ownership-facts a { border-bottom: 1px solid #26371733; padding-bottom: 23px; }
  .ownership-facts h3 { margin-top: 13px; }.ownership-facts p { max-width: 50ch; }
  .keyboard-invitation { gap: 40px; grid-template-columns: .75fr 1fr; }
  .command-art { gap: 10px; }.command-art span { width: 90px; height: 90px; font-size: 48px; border-radius: 10px; }
  .scene-faq { display: block; }.scene-faq .faq { margin-top: 35px; }
  .closing-asterisk { right: -3%; font-size: 200px; opacity: .2; pointer-events: none; }
  .closing-inner > :not(.closing-asterisk) { position: relative; z-index: 1; }
  .closing-inner { padding-top: 65px; padding-bottom: 65px; }
  .footer-wordmark { font-size: 20vw; padding-inline: 22px; }
}
@media (max-width: 540px) {
  .home { --section-space: 74px; }
  .scene-hero { padding-inline: 20px; }
  .edition { display: none; }
  .hero-topline .eyebrow { font-size: 8px; letter-spacing: .05em; }
  .hero-type { padding-top: 42px; padding-bottom: 0; }
  .hero-type h1 { font-size: clamp(79px,20.5vw,110px); margin-bottom: 25px; }
  .hero-composition { display: block; min-height: 0; padding-bottom: 260px; }
  .hero-type > p:not(.purchase-note) { font-size: 13px; max-width: 305px; }
  .hero-actions { gap: 17px; flex-wrap: wrap; }
  .scene-button { padding-left: 15px; gap: 12px; font-size: 11px; }
  .hero-explore { font-size: 11px; gap: 8px; }
  .purchase-note { font-size: 10px; }
  .hero-type .purchase-note { max-width: none; text-wrap: balance; }
  .hero-art { top: auto; bottom: -18px; height: 300px; width: 124%; right: -12%; }
  .hero-art img { object-fit: contain; }
  .hero-baseline { gap: 12px 20px; }.hero-baseline > span { font-size: 9px; }.hero-baseline > span::before { margin-right: 6px; }
  .hero-baseline > span:last-of-type { display: none; }
  .manifesto-strip { height: 51px; font-size: 16px; gap: 23px; }.manifesto-strip i { font-size: 25px; }
  .home .display { font-size: 44px; }.home .section-heading { margin-bottom: 32px; }
  .home .eyebrow { font-size: 8px; gap: 16px; }
  .home .section-intro { font-size: 13px; }
  .studio-section { padding-top: 65px; }
  .home .feat-sidebar { padding: 11px; gap: 2px; }.home .feat-sidebar label { padding: 7px 8px; font-size: 10px; }
  .home .feat-detail { padding: 22px 18px; }.home .feat-panel h3 { font-size: 25px; }.home .feat-panel p { font-size: 12px; }.home .feat-panel.has-shot { gap: 22px; }
  .home .feat-panel:not(.has-shot) h3 { font-size: 35px; }
  .process-grid article { display: block; }.process-art { height: 195px; }.process-grid h3 { margin-top: 20px; }.process-grid p { margin: 11px 0 8px; max-width: 46ch; }
  .record-disc { width: 70px; height: 70px; }.format-landscape { width: 145px; height: 88px; left: calc(50% - 72px); top: 76px; }
  .theme-gallery,.ownership-band,.closing-scene { margin-top: 75px; }
  .theme-scene > img { aspect-ratio: 1.1; }.theme-scene figcaption { padding: 40px 15px 18px; }.theme-scene strong { font-size: 33px; }.theme-availability { font-size: 8px; }.theme-scene-index { top: 20px; right: 18px; }
  .theme-option label { font-size: 10px; }.gallery-disclosure { font-size: 9px; }
  .words-copy > p:not(.eyebrow) { font-size: 13px; }.transcript-art { padding: 21px; }.transcript-art > p { font-size: 30px; margin-block: 32px; }
  .ownership-inner > h2 { font-size: 72px; margin-bottom: 36px; }
  .keyboard-invitation { grid-template-columns: 1fr; gap: 25px; }.command-art { padding: 30px 0; justify-content: flex-start; padding-left: 15px; }.command-art span { width: 108px; height: 108px; font-size: 56px; }
  .scene-faq > h2 { font-size: 43px; }.scene-faq .faq summary { font-size: 13px; }
  .closing-inner h2 { font-size: 65px; }.closing-asterisk { top: 40%; right: -30%; font-size: 230px; }
  .home:lang(zh-Hans) .hero-type h1 { font-size: clamp(58px,17vw,85px); }
  .home:lang(ja) .hero-type h1 { font-size: clamp(45px,12.5vw,65px); }
  .home:lang(zh-Hans) .display,.home:lang(ja) .display { font-size: clamp(32px,8.9vw,43px); }
  .home:lang(zh-Hans) .ownership-inner h2,.home:lang(ja) .ownership-inner h2 { font-size: 60px; }
  .home:lang(zh-Hans) .closing-inner h2,.home:lang(ja) .closing-inner h2 { font-size: clamp(42px,12vw,62px); }
}
@media (prefers-reduced-motion: reduce) { .hero-art img { transform: none; }.transcript-art { transform: none; } }

/* Review captures retain the complete app window, including the timeline. */
.home .feat-shot img { height: auto; object-fit: contain; }
.home .feat-shot figcaption { padding: 10px 14px; background: #e6ebdc; color: var(--ink-soft); font-size: 11px; }
.theme-scene.workspace-scene > img { height: auto; aspect-ratio: 1920 / 1324; object-fit: contain; }
.theme-scene.workspace-scene figcaption { position: relative; inset: auto; padding: 22px 28px; gap: 6px 16px; background: #20271e; }
.theme-scene.workspace-scene strong { font-size: clamp(26px, 3.4vw, 42px); }
.theme-scene.workspace-scene .theme-scene-index { position: static; grid-column: 1 / -1; justify-self: end; color: #bac5b0; }
@media (max-width: 540px) {
  .theme-scene.workspace-scene figcaption { padding: 18px; }
  .theme-scene.workspace-scene .theme-availability { font-size: 9px; }
}