#cinema-dialog{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#070a10;color:var(--ink);overflow-y:auto;overscroll-behavior:contain;isolation:isolate}#cinema-dialog::backdrop{background:#070a10}.cinema-scene{position:fixed;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none}.cinema-close{position:fixed;top:max(24px,env(safe-area-inset-top));right:max(30px,env(safe-area-inset-right));width:48px;height:48px;z-index:5}.cinema-index{position:absolute;left:5.5%;top:43px;font:10px var(--sans);letter-spacing:.22em;color:#a6a4b5}.cinema-copy{position:relative;width:36%;max-width:460px;margin:clamp(150px,25vh,280px) 8% 90px auto;opacity:0;transform:translateY(18px);transition:opacity 1.6s ease,transform 1.6s ease;pointer-events:none}.cinema-copy.is-visible{opacity:1;transform:none;pointer-events:auto}.cinema-copy .eyebrow{font-size:10px;letter-spacing:.20em;margin-bottom:20px}.cinema-copy h2{font:400 clamp(68px,8vw,112px)/1.03 var(--serif);letter-spacing:-.05em;margin:0 0 25px}.cinema-intro{font:20px/1.8 var(--serif);color:#b2b5cb;margin:0 0 42px}.cinema-film{margin:0;display:flex;align-items:center;gap:26px;padding:23px 0;border-top:1px solid #c1bfd52b;border-bottom:1px solid #c1bfd51c}.cinema-film img{width:79px;height:116px;object-fit:cover;filter:saturate(.6)}.cinema-film figcaption{display:flex;flex-direction:column;gap:5px}.cinema-film small{font:9px/1.8 var(--sans);letter-spacing:.16em;color:#8c91a8;margin-bottom:9px}.cinema-film strong{font:400 25px/1.4 var(--serif)}.cinema-film span{font-size:12px;color:#929bb1}.cinema-return{margin-top:26px;min-height:44px;font-size:12px}.cinema-shade{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity 1.8s ease;background:linear-gradient(90deg,transparent 22%,#070a1040 50%,#070a10cc 82%)}#cinema-dialog[data-phase=cinema] .cinema-shade{opacity:1}html[lang^=zh] .cinema-copy h2{font-family:var(--cn);font-size:88px;letter-spacing:.06em}html[lang^=zh] .cinema-intro{font-family:var(--cn)}
@media(max-width:750px){.cinema-index{top:37px;left:7%}.cinema-close{top:20px;right:18px}.cinema-copy{width:auto;max-width:480px;margin:49svh 8% 60px;padding-top:22px}.cinema-copy h2{font-size:72px}.cinema-intro{font-size:18px;margin-bottom:30px}.cinema-film{gap:24px}.cinema-film img{width:69px;height:102px}.cinema-shade{background:linear-gradient(transparent 28%,#070a1070 45%,#070a10df 64%)}html[lang^=zh] .cinema-copy h2{font-size:65px}}
@media(prefers-reduced-motion:reduce){.cinema-copy,.cinema-shade{transition:none;transform:none}}
@media(min-width:751px) and (max-width:1000px){.cinema-copy{width:auto;max-width:580px;margin:54svh 8% 70px}.cinema-shade{background:linear-gradient(transparent 25%,#070a1080 48%,#070a10ef 66%)}}
.cinema-copy{margin-top:clamp(110px,17vh,190px)}.cinema-copy h2{font-size:clamp(66px,6.7vw,96px)}.cinema-intro{font-size:23px;margin-bottom:25px}#cinema-message-form{border-top:1px solid #c1bfd52b;padding-top:10px}#cinema-message-form label{display:block;font:11px/1.8 var(--sans);color:#a3b6c0;margin:15px 0 9px}#cinema-message-form textarea,#cinema-message-form input{display:block;width:100%;border:0;border-bottom:1px solid #a4bdcd40;border-radius:0;background:#afc2d006;color:#dbe7ed;font:14px/1.8 var(--sans);padding:11px;resize:vertical}#cinema-message-form input{min-height:44px}#cinema-message-form textarea{min-height:112px;max-height:250px}#cinema-message-form :focus-visible{outline:1px solid #a3c4d1;outline-offset:3px}.cinema-send{display:flex;align-items:center;gap:20px;margin-top:20px}.cinema-send button{min-height:44px;border:1px solid #a4bdcd60;padding:8px 18px;background:#afc2d00b;color:#d8e5eb;font-size:12px}.cinema-send button:disabled{opacity:.45;cursor:wait}.cinema-send span{font:10px/1.7 var(--sans);color:#7b929f}.cinema-manage{display:inline-block;color:#78909e;font-size:11px;min-height:35px}.cinema-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}#cinema-feedback{min-height:24px;font:12px/1.8 var(--sans);color:#b9ced9;margin:14px 0 8px}.cinema-return{display:block;margin-top:6px}@media(max-width:1000px){.cinema-copy{margin-top:49svh}}@media(max-width:600px){#cinema-message-form textarea,#cinema-message-form input{font-size:16px}.cinema-intro{font-size:20px}.cinema-send{align-items:flex-start;gap:14px}.cinema-send span{max-width:150px;padding-top:6px}.cinema-copy h2{font-size:66px}}
/* Portrait cinema is led by the moving film, with the conversation below its visual field. */
@media(max-width:1000px) and (orientation:portrait){
 .cinema-copy{width:auto;max-width:580px;margin:78svh 8% 70px;padding-top:0;isolation:isolate}
 .cinema-copy:before{content:'';position:absolute;inset:-45px -8vw -70px;z-index:-1;background:linear-gradient(transparent,#070a10eb 120px,#070a10f5);pointer-events:none}
 .cinema-copy .eyebrow{font-size:9px;letter-spacing:.14em;margin-bottom:14px}
 .cinema-copy h2,html[lang^=zh] .cinema-copy h2{font-size:clamp(38px,7.5vw,54px);margin-bottom:18px}
 .cinema-intro{font-size:17px;line-height:1.7;margin-bottom:26px}
 .cinema-shade{background:linear-gradient(transparent 58%,#070a1018 76%,#070a1070)}
}