/* Phone chapters: complete native workspace windows, played on arrival. */
.phone-preview{display:none}
@media(max-width:760px), (max-width:1000px) and (max-height:500px){
 #unify .reading-mobile-caption,#unify .first-scene-scroll,#unify .responsive-view-controls,#unify .responsive-view-note,
 #filing .filing-layout,#return .recall-stage,#return .third-actions,#return .return-benefit,#return .recall-status,
 #craft .craft-workspace{display:none!important}
 #unify,#filing,#return{padding:30px 0 24px}
 #unify .unify-title,#filing>header,#return>header{margin:0 auto 20px;padding:0;width:calc(100% - 40px);text-align:left}
 #unify .unify-title h2,#filing>header h2,#return>header h2{font-size:29px;text-align:left;text-wrap:pretty}
 .phone-preview{display:block;margin:0 14px;text-align:left}
 .phone-preview>figcaption{font:18px/1.5 var(--serif);color:#494337;margin:0 6px 24px;max-width:34ch}
 .phone-preview>a{display:block;border-radius:9px;overflow:hidden;background:#faf8f2;box-shadow:0 1px 2px #332b2022,0 8px 18px -12px #332b2033}
 .phone-preview .preview-crop{position:relative;aspect-ratio:800/560}
 .phone-preview .preview-crop img{position:absolute;width:100%;max-width:none;height:auto;left:0;top:0}
 .phone-preview .preview-recall{aspect-ratio:1024/575}
 .phone-preview>a:focus-visible{outline:2px solid #806331;outline-offset:4px}
 .phone-preview img{display:block;width:100%;height:auto}
 .phone-preview .preview-detail{margin:12px 0 0;font:11px/1.5 system-ui;color:#625b4e;text-align:center}
 .phone-preview .phone-demo-note{font:12px/1.5 system-ui;color:#625b4e;margin:20px auto 0;text-align:center;max-width:28ch}
 #craft .craft-phone-preview{margin:0}
 #craft .craft-phone-preview>figcaption{display:block;font:18px/1.5 var(--serif);text-align:center;max-width:none;margin-bottom:24px}
 #craft .craft-phone-preview .preview-detail{font-size:11px}
 #return + .closing-story > #craft{padding-top:88px}
}

@media(max-width:760px), (max-width:1000px) and (max-height:500px){
 .phone-film-viewport{position:relative;overflow:hidden;background:#faf8f2;border-radius:10px;box-shadow:0 1px 2px #332b2022,0 8px 18px -12px #332b2033;isolation:isolate;contain:layout paint}
 .phone-film-viewport>a{display:block;position:relative;width:100%;aspect-ratio:800/560}
 #return .phone-film-viewport>a{aspect-ratio:1024/640}
 .phone-film-viewport img{display:block;width:100%;height:auto}
 .phone-film-viewport iframe{position:absolute;inset:0 auto auto 0;border:0;max-width:none;margin:0;transform-origin:0 0;pointer-events:none;opacity:0}
 .phone-film[data-ready=true] iframe{opacity:1}
 .phone-film[data-ready=true] .phone-film-viewport>a,.phone-film-viewport:has(iframe)>a{visibility:hidden}
 #return .return-purpose{font:18px/1.5 var(--serif);color:#494337;max-width:34ch;margin-top:16px}
 #return .phone-film{margin-top:24px}
}

/* Reserve the film's height before it loads, so scrolling never moves the story.
   A soft paper dissolve separates loops without leaving a frozen gesture. */
@media(max-width:760px), (max-width:1000px) and (max-height:500px){
 .phone-film-viewport{width:100%;margin-inline:auto;aspect-ratio:800/720;min-height:0}
 #filing .phone-film-viewport{aspect-ratio:800/680}
 #return .phone-film-viewport{aspect-ratio:812/780}
 .phone-film-viewport::after{content:'';position:absolute;inset:0;z-index:2;background:#faf8f2;opacity:0;pointer-events:none;transition:opacity .35s ease}
 .phone-film[data-phase=reset] .phone-film-viewport::after{opacity:1}
}
@media(prefers-reduced-motion:reduce){
 .phone-film-viewport,#filing .phone-film-viewport,#return .phone-film-viewport{aspect-ratio:auto;min-height:0;max-height:none}
 .phone-film-viewport::after{display:none}
}

@media(max-width:760px), (max-width:1000px) and (max-height:500px){
 .phone-film[data-error=true] .phone-film-viewport{aspect-ratio:auto;min-height:0;max-height:none}
}

@media(max-width:760px), (max-width:1000px) and (max-height:500px){
 .phone-film{width:calc(100% - 16px);max-width:none;margin-inline:auto}
}
