@media (max-width:759px), (max-width:959px) and (max-height:500px){
 :root{--gutter:24px;--panel-inset:16px;--muted:#675942;scroll-padding-top:84px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
 body{overflow-x:clip}
 .atmosphere,.wash,.ink-cloud{display:none!important}
 main{width:100%;min-width:0}
 .site-header{height:auto;min-height:112px;padding:12px var(--gutter);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;background:var(--paper)}
 .wordmark{font-size:16px;line-height:1.5;min-width:0;min-height:44px;display:flex;align-items:center}
 .languages{grid-column:2;grid-row:1;font-size:14px;gap:12px}
 .languages button{min-height:44px;padding:8px 0}
 .back-link{grid-column:1/-1;grid-row:2;min-height:36px;font-size:14px;gap:12px;align-items:center;width:max-content;max-width:100%}
 .hero{display:flex;flex-direction:column;min-height:0;gap:20px;padding:32px var(--gutter) 40px}
 .hero-copy{display:contents;padding:0!important}
 .hero-copy>.eyebrow{order:0;margin:0;font-size:12px;line-height:1.6;letter-spacing:.04em;flex-wrap:wrap;gap:8px 16px}
 .hero h1,html:lang(zh-CN) .hero h1{order:1;font-size:clamp(30px,8vw,40px)!important;line-height:1.3!important;letter-spacing:0!important;text-align:left;overflow-wrap:break-word;max-width:100%;text-wrap:pretty}
 .hero-summary,html:lang(zh-CN) .hero-summary{order:2;margin:0;font-size:16px!important;line-height:1.75!important;letter-spacing:.025em!important;max-width:100%}
 .hero-art{order:3;position:relative;height:320px;min-height:320px;max-height:none;margin:4px 0 0;overflow:hidden;isolation:isolate}
 .hero-art .sculpture-world,html[data-static-sculpture] .hero-art .sculpture-world{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:1}
 .hero-art .sculpture-stage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:1!important;mask-image:none!important;-webkit-mask-image:none!important}
 .hero-art .sculpture-poster{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:contain;transform:none!important;max-width:100%}
 .art-guides{display:none}
 .hero>.plate-note{order:4;position:static;max-width:100%;display:flex;flex-wrap:wrap;flex-direction:row;gap:8px 16px;font-size:12px;line-height:1.6;margin:0;padding:0}
 .hero-copy .explore{order:5;align-self:stretch;width:100%;min-height:48px;font-size:16px;line-height:1.6;margin:0;gap:24px}
 .hero-facts{order:6;grid-template-columns:minmax(0,1fr);gap:20px;margin:4px 0 0;padding-top:20px;width:100%;max-width:100%}
 .hero-facts>div{font-size:14px;line-height:1.65;gap:8px;min-width:0}
 .hero-facts .label{font-size:12px;line-height:1.6}
 .hero-baseline{order:7;position:static;margin-top:4px;display:flex;flex-direction:column;gap:8px;font-size:12px;line-height:1.6;letter-spacing:.025em}
 .hero-baseline span,.hero-baseline span:nth-child(2),.hero-baseline span:last-child{max-width:100%!important;text-align:left!important;margin-left:0!important}
 .hero-baseline span:last-child{display:none}
 .chapter,.chapter#reflection,.closing,.practice-section{padding:64px var(--gutter);min-height:0}
 .overview,.reading-map{margin-inline:var(--gutter);padding-block:32px}
 .overview-grid{grid-template-columns:minmax(0,1fr)}
 .overview-grid>a,.overview-grid>a:first-child{padding:20px 0;border-left:0;border-bottom:1px solid var(--line)}
 .section-heading,.chapter>.section-heading,#journeys>.section-heading,#handoff>.section-heading{max-width:100%!important}
 .section-heading h2,.chapter h2,html:lang(zh-CN) .chapter h2,#reflection .section-heading h2{font-size:30px!important;line-height:1.4!important;letter-spacing:.01em!important;max-width:100%}
 .chapter-intro,.chapter>.chapter-intro,#journeys>.intro-grid,#handoff>.editorial-row{max-width:100%!important;min-height:0!important;margin-top:24px}
 .body-copy,.chapter-intro .body-copy,.settings-copy p,.state-text p,html:lang(zh-CN) .body-copy,html:lang(zh-CN) .settings-copy p,html:lang(zh-CN) .state-text p{font-size:16px!important;line-height:1.8!important;letter-spacing:.025em!important}
 .lead,html:lang(zh-CN) .lead{font-size:22px;line-height:1.6;letter-spacing:.02em}
 .section-index{font-size:12px;line-height:1.6;letter-spacing:.04em;margin-bottom:20px}
 .source-note,.source-link,.figure-label,.evidence figcaption,.paper-panel figcaption,.product-figure figcaption,.method-map figcaption,.delivery-board figcaption{font-size:13px!important;line-height:1.7!important;letter-spacing:.02em}
 h3,html:lang(zh-CN) h3{overflow-wrap:break-word}
 .cjk-clause,.heading-clause,.title-line{white-space:normal}
 .intro-grid,.editorial-row,.state-study,.settings-layout,.index-layout,.ownership,.original-fragments,.component-pair,.review-steps,.suite-tiers,.handoff-detail,.framework-grid,.decision-row,.transfer-grid,.task-evidence,.flow,.scope-layout,.moment-panel,.verification-grid,.two-paths,.workstreams,.task-samples,.method-columns,.research-copy,.priority-layout,.detail-pair,.design-study:last-child .detail-pair,.create-inputs,.inline-detail,.update-layout,.delete-layout,.delivery-details,.outcome-layout,.other-views,.film-copy,.participation-grid,.editing-grid,.validation-grid{grid-template-columns:minmax(0,1fr)!important;gap:24px}
 .priority-layout>.evidence{position:static}
 .judgment{padding-right:var(--gutter)}
 .chapter *,.hero *,.closing *{min-width:0}
 .chapter-nav{background:var(--paper);padding-inline:var(--gutter);max-width:100%;gap:24px}
 .chapter-nav a{min-height:44px;font-size:14px;line-height:1.6}
 .chapter-nav[open]{max-height:75svh;overflow:auto}
 .nav-groups{grid-template-columns:1fr 1fr;gap:20px 16px}
 .chapter-nav>summary{min-height:56px;font-size:14px}
 .mobile-contents{background:var(--paper);padding-inline:var(--gutter)}
 .chapter .main-product,.chapter .settings-product,.timeline-study{margin-inline:0!important}
 .paper-panel,.system-figure,.evidence,.method-map,.delivery-board,.journey-figure,.product-figure,.handoff-figure,.film-gallery{padding-inline:var(--panel-inset)}
 .figure-label{flex-wrap:wrap;gap:8px 16px}
 .gallery-toolbar{padding-inline:var(--gutter);gap:16px;align-items:flex-start;flex-direction:column}
 .gallery-actions{width:100%;gap:8px;flex-wrap:wrap}
 .gallery-actions button{min-height:44px;min-width:44px;font-size:14px}
 .component-card{width:calc(100vw - 48px);max-width:342px}
 .component-card.wide{width:calc(100vw - 48px);max-width:480px}
 .component-image{height:300px;padding:16px}
 .component-card figcaption{padding-inline:0;gap:16px}
 .source-link,.text-link{min-height:44px;white-space:normal;overflow-wrap:anywhere}
 .closing-copy{max-width:100%}
 .closing .next-project{font-size:32px;line-height:1.3;gap:16px}
 .next-project .direction-icon{flex:none;width:40px;height:40px}
 .closing-copy>p:not(.eyebrow){max-width:100%;font-size:16px;line-height:1.75}
 .site-footer{padding:24px var(--gutter);display:flex;flex-direction:column;gap:16px;background:var(--paper);font-size:13px;line-height:1.7}
 .site-footer details{order:initial;width:100%;max-width:100%;margin:0}
 .site-footer summary{text-align:left;font-size:14px}
 .site-footer>a{margin:0;font-size:14px}
 .lightbox{width:calc(100vw - 24px);max-width:calc(100vw - 24px);height:calc(100dvh - 24px);max-height:calc(100dvh - 24px)}
 .lightbox-toolbar{height:auto;min-height:100px;display:flex;flex-wrap:wrap;gap:4px 16px;padding:12px 16px;font-size:14px;line-height:1.5}
 .lightbox-toolbar>span{flex-basis:100%;max-width:100%}
 .lightbox-toolbar>div{width:100%;justify-content:space-between;gap:16px}
 .lightbox-toolbar button{min-height:44px;font-size:14px}
 .lightbox-viewport{height:calc(100% - 100px);padding:16px}
}

@media (max-width:759px), (max-width:959px) and (max-height:500px) {
 /* The outer directory already owns the shared 24px page inset. */
 .mobile-contents summary, .mobile-contents .contents-links { padding-inline: 0; }
 .mobile-contents[open] { max-height: 75svh; overflow-y: auto; }
 .hero .eyebrow > span:first-child { white-space: nowrap; flex-shrink: 0; }
}

@media (max-width:759px), (max-width:959px) and (max-height:500px) {
 .figure-label > span { min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: break-word; }
 .figure-label > span:only-child { flex: 0 1 100%; }
}

@media (max-width:759px), (max-width:959px) and (max-height:500px) {
 .scope-request > p, .intent-example, .pull-quote { text-wrap: balance; }
}

@media (max-width:759px), (max-width:959px) and (max-height:500px) {
 .case-body:has(> .mobile-contents) > nav.chapter-nav { display: none; }
 .mobile-contents { display: block; position: sticky; top: 0; z-index: 25; border-block: 1px solid var(--line); }
}
