.cinema-page { padding-top:90px; max-width:1600px; }
.cinema-head { padding-bottom:68px; }
.cinema-head .eyebrow { color:#888; margin-bottom:40px; }
.cinema-title { display:flex; justify-content:space-between; gap:30px; align-items:end; }
.cinema-title h1 { font:400 clamp(38px,4.6vw,66px)/1.25 "Songti SC",serif; margin:0; letter-spacing:2px; }
.cinema-title > p { color:#777; font-size:10px; line-height:2.2; text-align:right; letter-spacing:1.5px; }
.cinema-intro { font-size:14px; line-height:2; color:#999; margin:30px 0; }
.index-link { display:inline-block; color:#aaa; font-size:12px; border-bottom:1px solid #555; padding:10px 0; }
.screening { border-top:1px solid #333; padding-top:28px; scroll-margin-top:28px; }
.screening-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:25px; }
.screening-heading .eyebrow { color:#888; margin:0; font-size:10px; }
.screening-heading h2 { font-size:15px; font-weight:400; margin:0; letter-spacing:2px; }
.screen { width:100%; aspect-ratio:16/9; background:#080808; border:1px solid #222; }
.screen video { display:block; width:100%; height:100%; object-fit:contain; }
.screening-meta { display:flex; justify-content:space-between; gap:20px; color:#888; font-size:10px; letter-spacing:1.5px; margin-top:16px; }
#playback-status { min-height:18px; color:#aaa; font-size:12px; }
.film-index { padding-top:65px; scroll-margin-top:30px; }
.film-index-head { display:flex; align-items:end; justify-content:space-between; gap:28px; border-top:1px solid #333; padding:30px 0 40px; }
.film-index-head .eyebrow { color:#777; font-size:10px; margin-bottom:18px; }
.film-index-head h2 { font:400 28px/1.5 "Songti SC",serif; margin:0; }
.film-index-head > p { color:#888; font-size:12px; }
.film-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:42px 26px; }
.film-still { position:relative; aspect-ratio:16/9; background:#090909; border:1px solid #222; }
.film-still img { width:100%; height:100%; object-fit:contain; }
.play-mark { position:absolute; left:14px; bottom:12px; background:rgba(0,0,0,.65); width:32px; height:32px; display:grid; place-items:center; color:#fff; font-size:22px; }
.film-duration { position:absolute; right:12px; bottom:12px; font-size:10px; background:rgba(0,0,0,.7); padding:5px 7px; color:#ddd; letter-spacing:1px; }
.film-caption { display:flex; justify-content:space-between; align-items:center; gap:12px; padding-top:14px; }
.film-caption h3 { margin:0; font-size:13px; font-weight:400; color:#bbb; }
.film-caption span { color:#666; font-size:9px; letter-spacing:1.5px; }
.film-card:hover .film-still,.film-card[aria-current="true"] .film-still { border-color:#aaa; }
.film-card[aria-current="true"] h3 { color:#fff; }
.cinema-page a:focus-visible { outline:2px solid #eee; outline-offset:6px; }
.cinema-end { border-top:1px solid #333; margin-top:90px; padding-top:35px; }
.cinema-end p { color:#aaa; font:400 24px/1.8 "Songti SC",serif; }
.cinema-end nav { display:flex; gap:30px; margin-top:30px; font-size:12px; color:#999; }
@media(max-width:1050px) { .film-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:800px) { .cinema-page { padding-top:130px; } .cinema-title { display:block; } .cinema-title > p { text-align:left; margin-top:24px; } .cinema-head { padding-bottom:45px; } .film-index-head { display:block; } .film-index-head h2 { font-size:25px; } .screening-meta { font-size:9px; letter-spacing:0; } .film-grid { gap:32px 18px; } .cinema-end p { font-size:21px; } }
@media(max-width:520px) { .film-grid { grid-template-columns:1fr; } .screen { aspect-ratio:auto; height:56vh; min-height:260px; max-height:520px; } .screening-heading .eyebrow { font-size:8px; } }