#viewer{position:fixed;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;padding:0;border:0;background:#000;overflow:auto;color:#fff}
#viewer::backdrop{background:#000}
.cinema-toolbar{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 28px}
.cinema-toolbar{justify-content:flex-end}
#closeViewer{font-size:30px;font-weight:300;padding:6px 12px}
.cinema-layout{display:grid;grid-template-columns:minmax(0,3fr) minmax(250px,1fr);gap:34px;width:76%;max-width:1600px;margin:26px auto 0;align-items:start}
.cinema-screen{min-width:0;display:grid;place-items:center;min-height:min(59vw,66dvh)}
#viewer #mediaStage{width:100%;max-height:none;aspect-ratio:16/9;background:#050505}
#viewer #mediaStage.portrait{width:min(100%,37.125dvh);aspect-ratio:9/16}
#viewer #mediaStage.square{width:min(100%,66dvh);aspect-ratio:1}
.cinema-details{min-width:0;padding:0 0 20px}
.cinema-details h2{font-size:clamp(23px,1.7vw,34px);font-weight:700;letter-spacing:.14em;text-transform:uppercase;line-height:1.35;margin:0 0 24px;overflow-wrap:anywhere}
.cinema-details .eyebrow{margin:0 0 14px;font-size:9px}
#viewerCount{font-size:11px;color:#999;letter-spacing:.2em;margin:0 0 28px}
#viewer #viewerDescription{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:21px;line-height:1.6;color:#eee;margin:0}
#viewer #viewerRole{font-family:'Cormorant Garamond',Georgia,serif;font-size:18px;font-style:italic;color:var(--gold);margin-top:35px;line-height:1.6}
.cinema-arrow{position:fixed;z-index:2;top:44%;width:52px;height:70px;font-family:Arial,sans-serif;font-weight:200;font-size:58px;color:#aaa;line-height:1}
.cinema-arrow:hover{color:white}.cinema-previous{left:12px}.cinema-next{right:12px}
#viewerThumbnails{display:flex;gap:4px;overflow-x:auto;overscroll-behavior-x:contain;padding:0 0 8px;margin:38px 0 0;scroll-snap-type:x proximity}
.cinema-thumbnail{position:relative;flex:0 0 260px;aspect-ratio:16/9;overflow:hidden;padding:0;background:#141414;scroll-snap-align:start;text-align:left;border:1px solid transparent}
.cinema-thumbnail img{width:100%;height:100%;object-fit:cover;display:block;opacity:.65;transition:opacity .2s}
.cinema-thumbnail.active{border-color:var(--gold)}.cinema-thumbnail:hover img,.cinema-thumbnail.active img{opacity:1}
.cinema-thumbnail span{position:absolute;inset:0;padding:12px;background:linear-gradient(rgba(0,0,0,.6),transparent 65%);font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:17px;line-height:1.3;color:white}
@media(min-width:1600px){.cinema-layout{grid-template-columns:minmax(0,3fr) minmax(300px,1fr)}}
.cinema-screen{position:relative}.cinema-fullscreen{justify-self:end;min-height:44px;margin-top:8px;border:1px solid #655d46;padding:8px 14px;font-size:12px;color:#eee;background:#141414;white-space:nowrap}.cinema-see-more{display:none;min-height:44px;padding:8px 0;color:var(--gold);font-size:12px;text-decoration:underline;text-underline-offset:4px}
.cinema-screen:fullscreen,.cinema-screen:-webkit-full-screen,#viewer.player-expanded .cinema-screen{position:fixed;inset:0;width:100vw;height:100dvh;background:#000;z-index:20;display:flex;align-items:center;justify-content:center;min-height:0;padding:0}
#viewer .cinema-screen:fullscreen #mediaStage,#viewer .cinema-screen:-webkit-full-screen #mediaStage,#viewer.player-expanded #mediaStage{width:100%;height:100%;max-height:none;aspect-ratio:auto}
.cinema-screen:fullscreen .cinema-fullscreen,.cinema-screen:-webkit-full-screen .cinema-fullscreen,.player-expanded .cinema-fullscreen{position:absolute;bottom:18px;right:18px;z-index:21;margin:0;background:rgba(0,0,0,.8)}
@media(max-width:900px){#viewer .cinema-layout{gap:16px}#viewer .cinema-details h2{font-size:19px;letter-spacing:.07em;line-height:1.3;margin-bottom:10px}#viewer .cinema-details .eyebrow{margin-bottom:8px}#viewer #viewerCount{margin-bottom:12px}#viewer .cinema-details #viewerDescription{font-family:Montserrat,Arial,sans-serif;font-style:normal;font-size:13px;line-height:1.65;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}#viewer .cinema-details:not(.details-expanded) #viewerRole{display:none}#viewer .details-expanded #viewerDescription{display:block;overflow:visible}#viewer .cinema-details #viewerRole{font-size:14px;margin-top:12px}.cinema-see-more{display:inline-block}#viewer #viewerThumbnails{margin-top:14px}#viewer .cinema-thumbnail{flex-basis:160px}#viewer .cinema-thumbnail span{font-size:14px;padding:8px}.cinema-fullscreen{font-size:12px;padding:8px 12px}}
@media(max-width:900px){.cinema-toolbar{height:54px;padding:0 16px}.cinema-layout{width:86%;grid-template-columns:minmax(0,1fr);gap:24px;margin-top:12px}.cinema-screen{min-height:0}.cinema-details h2{font-size:23px;margin-bottom:15px}.cinema-details{padding-bottom:0}#viewer #mediaStage.portrait{width:min(100%,28.125dvh)}#viewer #mediaStage.square{width:min(100%,50dvh)}#viewer #viewerDescription{font-size:20px}.cinema-arrow{width:28px;font-size:38px;top:26%}.cinema-previous{left:0}.cinema-next{right:0}.cinema-thumbnail{flex-basis:190px}#viewerThumbnails{margin-top:26px}#viewerCount{margin-bottom:18px}}
#viewer #mediaStage{position:relative}#viewer .cinema-fullscreen{position:absolute;right:12px;bottom:12px;width:44px;height:44px;min-height:44px;display:grid;place-items:center;padding:0;margin:0;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:white;z-index:3}#viewer .cinema-fullscreen svg{width:24px;height:24px;display:block}#viewer .cinema-fullscreen:hover{background:rgba(0,0,0,.9)}
#viewer .cinema-screen:fullscreen .cinema-fullscreen,#viewer.player-expanded .cinema-fullscreen{right:16px;bottom:76px}
