/* Deliberate phone composition. All story text participates in document flow. */
@media(max-width:760px), (max-width:1024px) and (max-height:600px){
 html{scrollbar-gutter:auto;scroll-padding-top:76px}
 body{overflow-x:clip}
 [data-mobile-story=true] .story-runway{height:auto;background:var(--sage)}
 [data-mobile-story=true] .story-runway>.page{position:relative;top:auto;height:auto;min-height:0;overflow:clip;background:var(--sage)}
 [data-mobile-story=true] .page>header{position:sticky;top:0;z-index:8;margin:0;padding:12px 6vw;min-height:72px;gap:12px;align-items:center;background:#7e826cf5;backdrop-filter:blur(12px)}
 [data-mobile-story=true] header .brand{font-size:12px;white-space:nowrap;letter-spacing:.04em}
 [data-mobile-story=true] .brand span{width:6px;height:6px;margin-right:7px}
 [data-mobile-story=true] .nav{gap:14px;flex-shrink:0}
 [data-mobile-story=true] .nav .text-button{font-size:12px;white-space:nowrap;min-height:44px}
 [data-mobile-story=true] #track,[data-mobile-story=true] #settings{display:none}
 [data-mobile-story=true] .mobile-hero{padding:30px 0 24px}
 [data-mobile-story=true] .copy{position:relative;top:auto;bottom:auto;left:auto;width:auto;max-width:none;margin:0 6vw 24px;opacity:1;transform:none}
 [data-mobile-story=true] .copy .eyebrow{font-size:9px;letter-spacing:.13em;margin-bottom:14px}
 [data-mobile-story=true] .copy h1.tech-title{font-size:clamp(42px,12vw,74px);line-height:1.05;display:grid;grid-template-columns:2.3em 1fr;column-gap:2px}
 [data-mobile-story=true] .tech-line{height:1.18em;width:calc(100% + 12px);margin-left:-6px}
 [data-mobile-story=true] .tech-line:first-child{grid-column:1/-1;width:4em}
 [data-mobile-story=true] .tech-line:nth-child(2){width:2.4em}
 [data-mobile-story=true] .tech-name{width:3.65em}
 [data-mobile-story=true] .copy p{display:block;font-size:13px;line-height:1.7;max-width:none;margin:12px 0 0}
 [data-mobile-story=true] .copy p br{display:none}
 [data-mobile-story=true] .story-media-frame{position:relative;inset:auto;width:100%;aspect-ratio:4/3;max-height:55svh;background:var(--sage)}
 [data-mobile-story=true] .stage{inset:0;background:var(--sage);transform:none!important;filter:none!important}
 [data-mobile-story=true] .stage video,[data-mobile-story=true] .stage>img{object-fit:cover;object-position:center}
 [data-mobile-story=true] .stage #portrait{opacity:1}
 [data-mobile-story=true] .stage:not(.ready) #portrait{opacity:0}
 [data-mobile-story=true] .showcase-dim,[data-mobile-story=true] .folio,[data-mobile-story=true] .status,[data-mobile-story=true] .intro-caption{display:none}
 [data-mobile-story=true] .bottom{position:relative;inset:auto;margin:20px 6vw 0;padding-top:16px;display:grid;grid-template-columns:1fr auto;gap:12px;opacity:1}
 [data-mobile-story=true] .hint{width:auto;font-size:13px}
 [data-mobile-story=true] .hint small{font-size:11px;letter-spacing:0}
 [data-mobile-story=true] .play{font-size:12px;min-height:44px;min-width:100px}
 [data-mobile-story=true] .directions{grid-column:1/-1;grid-row:2;display:flex;width:100%;gap:8px;justify-content:space-between}
 [data-mobile-story=true] .directions button{min-width:44px;min-height:44px;flex:1;padding:0 9px;font-size:13px}
 [data-mobile-story=true] .mobile-about{padding-top:38px}
 [data-mobile-story=true] .mobile-scene{position:relative;margin:0;width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--sage)}
 [data-mobile-story=true] .mobile-scene video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:85% center;opacity:1}
 [data-mobile-story=true] .mobile-scene-2 video{object-position:center}
 [data-mobile-story=true] .mobile-replay{position:absolute;right:6vw;bottom:14px;min-height:44px;border:1px solid var(--line);border-radius:999px;padding:0 16px;background:#24282099;color:var(--paper);font-size:12px}
 [data-mobile-story=true] .intro-copy{display:block;position:relative;inset:auto;opacity:1;width:auto;max-width:none;padding:32px 6vw 26px;pointer-events:auto}
 [data-mobile-story=true] .intro-copy .eyebrow{font-size:10px;margin-bottom:14px}
 [data-mobile-story=true] .intro-copy h2{font-size:38px;line-height:1.25;margin:0 0 20px}
 [data-mobile-story=true] .intro-copy h2 br{display:none}
 [data-mobile-story=true] .intro-copy .intro-name{font-size:20px;margin-bottom:12px}
 [data-mobile-story=true] .intro-copy p{font-size:15px;line-height:1.8}
 [data-mobile-story=true] .story-skills{font-size:12px;line-height:1.9;margin-top:16px;opacity:.8}
 [data-mobile-story=true] .career-step{position:relative;inset:auto;display:block;opacity:1;width:auto;max-width:none;height:auto;overflow:visible;padding:0 6vw 36px;pointer-events:auto}
 [data-mobile-story=true] .career-list{transform:none;padding:0;will-change:auto}
 [data-mobile-story=true] .career-entry{min-height:0;display:block;margin:0;padding:30px 0;border-bottom:1px solid var(--line)}
 [data-mobile-story=true] .career-entry:first-child{border-top:1px solid var(--line)}
 [data-mobile-story=true] .career-entry:last-child{padding-bottom:10px}
 [data-mobile-story=true] .career-entry .career-year{font-size:52px;margin:0 0 18px;line-height:1;color:var(--accent)}
 [data-mobile-story=true] .career-entry h3{font-size:20px;line-height:1.5;margin:0 0 10px}
 [data-mobile-story=true] .career-entry .career-period{font-size:12px;margin:0 0 14px}
 [data-mobile-story=true] .career-entry .career-description{font-size:15px;line-height:1.85;margin:0}
 [data-mobile-story=true] .folder-directory{position:relative;inset:auto;opacity:1;pointer-events:auto;padding-bottom:28px}
 [data-mobile-story=true] .directory-copy{position:relative;inset:auto;max-width:none;width:auto;margin:30px 6vw 20px;opacity:1}
 [data-mobile-story=true] .directory-eyebrow{font-size:10px;margin-bottom:16px}
 [data-mobile-story=true] .directory-copy h2{font-size:clamp(32px,9vw,46px);margin-bottom:18px;line-height:1.2}
 [data-mobile-story=true] .directory-copy h2 br{display:none}
 [data-mobile-story=true] .directory-copy>p:not(.directory-eyebrow){display:block;font-size:15px;line-height:1.8}
 [data-mobile-story=true] .directory-copy>a{font-size:13px;min-height:44px}
 [data-mobile-story=true] .folder-launch{position:relative;inset:auto;display:block;width:86%;max-width:420px;min-width:0;aspect-ratio:2.65;margin:24px auto 48px;transform:none;opacity:1}
 [data-mobile-story=true] .folder-launch:hover{transform:none}
 [data-mobile-story=true] .folder-launch-hint{font-size:12px}
 [data-mobile-story=true] .directory-bottom{position:relative;inset:auto;margin:0 6vw;font-size:10px;opacity:1}
 [data-mobile-story=true] .directory-bottom>span:last-child{display:none}
 [data-mobile-story=true] .home-showcase{position:relative;inset:auto;display:block;padding:38px 6vw 24px;background:#242820d9;opacity:1;transform:none;pointer-events:auto}
 [data-mobile-story=true] .showcase-label{font-size:10px}
 [data-mobile-story=true] .showcase-label>span:last-child{display:none}
 [data-mobile-story=true] .showcase-heading{margin:26px 0}
 [data-mobile-story=true] .showcase-heading h2{font-size:34px}
 [data-mobile-story=true] .showcase-heading>p{font-size:12px;margin-top:12px}
 [data-mobile-story=true] .showcase-deck{width:auto;margin:0;perspective:none;overflow:visible;display:grid;gap:30px}
 [data-mobile-story=true] .home-work{position:relative;inset:auto;width:100%;opacity:1!important;transform:none!important;visibility:visible!important;pointer-events:auto;will-change:auto}
 [data-mobile-story=true] .home-work-meta{opacity:1!important;padding-top:16px;grid-template-columns:20px minmax(0,1fr)}
 [data-mobile-story=true] .home-work-meta h3{font-size:24px}
 [data-mobile-story=true] .home-work-meta p{font-size:13px;line-height:1.8}
 [data-mobile-story=true] .home-work-number{font-size:11px}
 [data-mobile-story=true] .showcase-foot{display:flex;justify-content:space-between;font-size:12px;margin-top:24px;border-top:1px solid var(--line);padding-top:14px}
 [data-mobile-story=true] .showcase-navigation{display:none}
 [data-mobile-story=true] .showcase-foot>a{pointer-events:auto}
 [data-mobile-story=true] .mobile-outro{padding-top:28px;background:#242820d9}
 [data-mobile-story=true] .mobile-outro .mobile-scene{aspect-ratio:3/2}
 [data-mobile-story=true] .contact{--contact-overlap:48px;min-height:0;padding-bottom:max(16px,env(safe-area-inset-bottom))}
 [data-mobile-story=true] .contact-label{font-size:10px;letter-spacing:.05em}
 [data-mobile-story=true] .contact-label>span:last-child{display:none}
 [data-mobile-story=true] .contact-body{grid-template-columns:120px minmax(0,1fr);gap:20px 16px;padding:30px 0}
 [data-mobile-story=true] .contact-portrait{grid-row:1}
 [data-mobile-story=true] .contact-portrait figcaption{font-size:11px}
 [data-mobile-story=true] .contact-portrait figcaption>span{font-size:11px;line-height:1.7;word-break:keep-all;text-wrap:balance}
 [data-mobile-story=true] .contact h2{font-size:clamp(30px,8vw,42px)}
 [data-mobile-story=true] .contact-copy{grid-column:1/-1;font-size:15px;line-height:1.85}
 [data-mobile-story=true] .contact-connect{display:flex;flex-direction:column;margin:0;gap:26px}
 [data-mobile-story=true] .contact-qr{width:220px;max-width:100%;align-self:center;padding:10px 10px 14px}
 [data-mobile-story=true] .contact-qr figcaption strong{font-size:16px}
 [data-mobile-story=true] .contact-qr figcaption>span,[data-mobile-story=true] .contact-qr>p{font-size:12px}
 [data-mobile-story=true] .contact-channels{width:100%}
 [data-mobile-story=true] .contact-link{min-height:86px;padding:16px 0;grid-template-columns:minmax(0,1fr) 44px}
 [data-mobile-story=true] .contact-channel{font-size:11px}
 [data-mobile-story=true] .contact-name{font-size:20px}
 [data-mobile-story=true] .contact-arrow{width:44px;height:44px;font-size:22px}
 [data-mobile-story=true] .contact-arrow.copy-label{font-size:12px}
 [data-mobile-story=true] .contact-profile{font-size:13px;min-height:44px}
 [data-mobile-story=true] .contact-feedback{font-size:12px}
 [data-mobile-story=true] .site-footer{margin-top:0;gap:8px;font-size:12px}
 [data-mobile-story=true] .site-footer small{font-size:10px}
 [data-mobile-story=true] .contact.has-contact-motion .contact-reveal,[data-mobile-story=true] .contact.has-contact-motion .contact-portrait{opacity:1;transform:none}
 #folder-dialog{height:100dvh}
 .folder-dialog-heading{top:max(72px,env(safe-area-inset-top));left:6%;right:6%}
 .folder-close{top:max(12px,env(safe-area-inset-top));min-height:44px;font-size:12px}
 .folder-category-grid{top:154px;bottom:max(44px,env(safe-area-inset-bottom));max-height:none;gap:24px;padding:8px 4px 24px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
 .folder-category-summary{font-size:14px}
 .folder-category-foot{font-size:10px}
 .folder-travel,.folder-dialog-hint{display:none}
 #wechat-qr-dialog{max-height:90dvh}
 .qr-modal-close{width:44px;height:44px}
 .qr-modal-hint{font-size:13px!important}
 .works{padding-top:24px}.works-label{font-size:10px}.works-heading h2{font-size:40px}.works-heading p{font-size:13px}
 .works-filters{gap:8px}.works-filters button{font-size:13px;min-height:44px;padding:0 14px}.works-filters>p{font-size:12px}
 .work-meta p{font-size:14px}.work-meta .work-category{font-size:12px}.works-foot{font-size:12px}
 .case-header{font-size:12px}.case-summary p,.chapter-heading p{font-size:15px}.case-facts dt{font-size:12px}.case-facts dd{font-size:14px}
 .case-image figcaption,.case-jump a{font-size:13px}.case-footer{font-size:12px}
}
@media(min-width:761px) and (max-width:1024px) and (max-height:600px){
 [data-mobile-story=true] .story-media-frame{max-height:none;aspect-ratio:16/9}
 [data-mobile-story=true] .mobile-scene{aspect-ratio:16/9}
 [data-mobile-story=true] .contact-body{grid-template-columns:180px minmax(0,1fr)}
 [data-mobile-story=true] .contact h2{font-size:42px}
 [data-mobile-story=true] .contact-copy{grid-column:2}
 [data-mobile-story=true] .contact-connect{grid-column:1/-1;display:grid;grid-template-columns:220px 1fr;gap:32px}
}
@media(max-width:360px){
 [data-mobile-story=true] header .brand{font-size:11px}
 [data-mobile-story=true] .nav{gap:10px}
 [data-mobile-story=true] .nav .text-button{font-size:11px}
 [data-mobile-story=true] .contact-body{grid-template-columns:100px minmax(0,1fr);gap:20px 12px}
 [data-mobile-story=true] .contact h2{font-size:28px}
 [data-mobile-story=true] .contact-name{font-size:18px}
}