/* A screening room within the château. Colour comes from the films. */
.panel[data-screen-kind=films]{background:#222326;--ink:#f5f4ef;--muted:#b9b8b1;--line:#ffffff25;--accent:#d7bc70;color:var(--ink)}
.panel[data-screen-kind=films] .panel-bar{background:#222326;border-color:#ffffff24}
.panel[data-screen-kind=films] .screen-nav a:hover{color:#d7bc70}
.panel[data-screen-kind=films] .panel-bar .close{background:#f5f4ef0c;color:#f5f4ef;border-color:#ffffff40}
.screen-panel .cinema-page{width:100%;max-width:1580px;padding:62px 64px 80px;font:400 20px/1.5 var(--sans)}
.cinema-page .cinema-header{display:flex;justify-content:space-between;align-items:end;gap:36px;margin-bottom:40px}
.cinema-page .cinema-overline{font-size:14px;color:#c3c1b9;letter-spacing:.045em;margin:0 0 22px}
.cinema-page h1{font:400 clamp(42px,5.2vw,78px)/1.02 var(--sans);letter-spacing:-.05em;margin:0;color:#f5f4ef}
.cinema-page h1 em{font-family:var(--serif);font-size:1.07em;letter-spacing:-.04em}
.cinema-header-side{text-align:right;flex:none}.cinema-header-side p{font-size:16px;color:#b9b8b1;margin:18px 0 0;line-height:1.5}
.cinema-page .portfolio-tabs{background:transparent;border-color:#ffffff32;margin:0;gap:2px;padding:4px}
.cinema-page .portfolio-tabs a{min-width:93px;font-size:16px;color:#cccac1;padding:9px 20px}
.cinema-page .portfolio-tabs a[aria-current]{background:#f5f4ef;color:#222326;box-shadow:none}
.cinema-page .portfolio-tabs a:hover{color:#d7bc70}.cinema-page .portfolio-tabs a[aria-current]:hover{color:#222326}
.cinema-index{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff30;padding:16px 0 18px;margin-bottom:8px;font-size:14px;color:#c6c4bc}
.cinema-total{margin-left:22px;font-size:12px;font-variant-numeric:tabular-nums;color:#b9a775}
.cinema-motion{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-width:44px;min-height:44px;padding:0 12px;border:1px solid #ffffff28;border-radius:999px;background:transparent;color:#d9d7d0;font:400 13px/1 var(--sans);cursor:pointer}
.cinema-motion svg{width:14px;height:14px}.cinema-motion[aria-pressed=true]{background:#f5f4ef;color:#222326}
.cinema-page .cinema-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:74px 42px;align-items:start;margin:0}
.cinema-card{grid-column:span 6;min-width:0;position:relative}
.cinema-card.cinema-feature{grid-column:1/-1;margin-bottom:6px}
.cinema-card:nth-child(4n+2){grid-column:span 7}.cinema-card:nth-child(4n+3){grid-column:span 5;margin-top:100px}
.cinema-card:nth-child(4n+4){grid-column:span 5}.cinema-card:nth-child(4n+5){grid-column:span 7;margin-top:94px}
.cinema-card:last-child{grid-column:1/-1;max-width:980px;width:100%;margin:32px auto 0}
.cinema-open{display:block;width:100%;padding:0;border:0;border-radius:12px;background:transparent;color:#f5f4ef;text-align:left;cursor:pointer;font-family:var(--sans)}
.cinema-image{position:relative;display:block;width:100%;aspect-ratio:16/10;overflow:hidden;border-radius:12px;background:#18191b;isolation:isolate}
.cinema-feature .cinema-image,.cinema-card:last-child .cinema-image{aspect-ratio:16/9}
.cinema-image:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#17181b55,transparent 27%);pointer-events:none;z-index:2}
.cinema-image>img,.cinema-image>video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;transition:opacity .4s,transform .8s cubic-bezier(.2,.7,.2,1)}
.cinema-image>video{opacity:0;pointer-events:none}.cinema-open.is-previewing .cinema-preview{opacity:1}
.cinema-open:focus-visible{outline:2px solid #ddc47d;outline-offset:8px}
.cinema-watch{position:absolute;z-index:3;left:24px;bottom:24px;display:inline-flex;align-items:center;gap:10px;padding:10px 17px 10px 11px;border-radius:999px;background:#f5f4ef;color:#222326;font:500 14px/1.2 var(--sans);min-height:46px;transition:transform .25s,background .25s}
.cinema-watch svg{width:22px;height:22px}.cinema-card:not(.cinema-feature) .cinema-watch{left:18px;bottom:18px;padding:0;width:46px;justify-content:center;background:#f5f4efeb}
.cinema-card:not(.cinema-feature) .cinema-watch>span{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}
.cinema-duration{position:absolute;z-index:3;right:20px;bottom:23px;font:400 13px/1 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:.03em;color:#f5f4ef;background:#222326b8;border:1px solid #ffffff20;padding:8px 10px;border-radius:999px}
.cinema-caption{display:flex;align-items:baseline;gap:19px;padding-top:22px}
.cinema-number{font:italic 400 23px/1 var(--serif);color:#c2ab71;flex:none}
.cinema-name{font:400 clamp(24px,2.4vw,36px)/1.15 var(--sans);letter-spacing:-.035em;flex:1;text-wrap:balance}
.cinema-feature .cinema-name{font-size:clamp(32px,3vw,46px)}
.cinema-category{display:block;font:400 13px/1.5 var(--sans);letter-spacing:0;color:#b9b8b1;margin-top:9px}
.cinema-arrow{font:400 24px/1 var(--sans);color:#b9b8b1;transition:transform .25s}
.cinema-page .cinema-synopsis{font:400 17px/1.5 var(--sans);color:#b9b8b1;margin:12px 35px 0 45px;max-width:600px;text-wrap:pretty}
.cinema-card{opacity:0;transform:translateY(22px);transition:opacity .65s,transform .8s cubic-bezier(.16,1,.3,1)}
.cinema-card.is-visible{opacity:1;transform:none}
@media(hover:hover) and (pointer:fine){.cinema-open:hover .cinema-watch{transform:scale(1.06);background:#fffaf0}.cinema-open:hover .cinema-arrow{transform:translate(3px,-3px)}}
.cinema-end{display:flex;align-items:baseline;justify-content:space-between;gap:32px;padding-top:60px;margin-top:110px;border-top:1px solid #ffffff30}
.cinema-page .cinema-end>p{font:italic 400 clamp(36px,4vw,58px)/1.1 var(--serif);letter-spacing:-.035em;margin:0;color:#f5f4ef}
.cinema-end>a{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:52px;font:400 20px/1.3 var(--sans);text-decoration:none;border-bottom:1px solid #d7bc70;padding:10px 0;color:#f5f4ef}
.cinema-end>a span{color:#d7bc70}
.cinema-player{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:#1b1c1f;color:#f5f4ef;overflow:hidden;font-family:var(--sans)}
.cinema-player[open]{display:flex;flex-direction:column}.cinema-player::backdrop{background:#1b1c1f}
.cinema-player-top{flex:none;display:flex;align-items:center;gap:24px;padding:12px 28px;border-bottom:1px solid #ffffff20;min-height:76px}
.cinema-player-count{color:#d7bc70;font:400 14px/1 var(--sans);font-variant-numeric:tabular-nums;min-width:65px}
.cinema-player-word{font:400 14px/1 var(--sans);color:#b9b8b1}.cinema-icon{display:inline-flex;align-items:center;justify-content:center;width:48px;min-width:48px;height:48px;min-height:48px;padding:0;border-radius:50%;border:1px solid #ffffff50;color:#f5f4ef;background:transparent;font:400 24px/1 var(--sans);cursor:pointer;transition:background .2s}
.cinema-icon svg{width:24px;height:24px}.cinema-icon:hover{background:#ffffff15}.cinema-icon:disabled{opacity:.25;cursor:default}
.cinema-player-close{margin-left:auto}.cinema-player-stage{position:relative;flex:1;min-height:0;display:grid;place-items:center;padding:18px 28px;background:#151619}
.cinema-player-stage video{display:block;width:100%;height:100%;max-width:1600px;max-height:100%;min-height:0;object-fit:contain;background:#151619;border-radius:4px}
.cinema-player-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 36px 24px;flex:none}
.cinema-player-copy{min-width:0}.cinema-page .cinema-player-category{font:400 12px/1.3 var(--sans);color:#c2ab71;margin:0 0 8px}
.cinema-page #cinema-player-title{font:400 clamp(24px,2.6vw,36px)/1.15 var(--sans);letter-spacing:-.035em;margin:0 0 8px}
.cinema-page .cinema-player-description{font:400 16px/1.4 var(--sans);margin:0;color:#b9b8b1;max-width:820px}
.cinema-player-nav{display:flex;gap:10px;flex:none}.cinema-player:focus-visible{outline:none}
.cinema-page :is(button,a):focus-visible{outline:2px solid #d7bc70;outline-offset:5px}
@media(min-width:1700px){.screen-panel .cinema-page{padding-top:80px}}
@media(min-width:1001px){.screen-panel .cinema-page{padding-top:36px}.cinema-page .cinema-header{margin-bottom:24px}.cinema-page h1{font-size:clamp(42px,4.2vw,64px)}.cinema-page h1 br{display:none}.cinema-page h1 em{margin-left:.15em}.cinema-feature .cinema-image{max-height:calc(100dvh - 460px);min-height:240px}.cinema-page .cinema-overline{margin-bottom:16px}}
@media(max-width:1000px){.screen-panel .cinema-page{padding:42px 32px 65px}.cinema-grid{gap:54px 28px}.cinema-card:nth-child(n){grid-column:span 6;margin-top:0}.cinema-card.cinema-feature,.cinema-card:last-child{grid-column:1/-1}.cinema-name{font-size:26px}.cinema-page .cinema-synopsis{margin-left:0;font-size:17px}.cinema-caption{gap:12px}.cinema-header-side p{font-size:15px}}
@media(max-width:650px){.screen-panel .cinema-page{padding:32px 20px 55px}.cinema-page .cinema-header{display:block;margin-bottom:25px}.cinema-page h1{font-size:46px}.cinema-page .cinema-overline{font-size:13px;margin-bottom:18px}.cinema-header-side{display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left;margin-top:24px}.cinema-header-side p{margin:0;font-size:12px}.cinema-page .portfolio-tabs a{min-width:72px;padding:10px 14px;font-size:15px}.cinema-page .portfolio-tabs a span{font-size:11px}.cinema-index{padding:10px 0 14px;font-size:13px}.cinema-total{margin-left:10px;font-size:11px}.cinema-motion{min-height:44px;padding:0 10px;font-size:12px}.cinema-grid{grid-template-columns:minmax(0,1fr);gap:38px}.cinema-card:nth-child(n){grid-column:1;margin:0;max-width:none}.cinema-image{aspect-ratio:16/10;border-radius:9px}.cinema-feature .cinema-image{aspect-ratio:16/9}.cinema-caption{padding-top:17px;gap:13px}.cinema-name,.cinema-feature .cinema-name{font-size:27px}.cinema-number{font-size:21px}.cinema-category{font-size:12px;margin-top:7px}.cinema-page .cinema-synopsis{font-size:16px;line-height:1.5;margin:9px 0 0 37px}.cinema-watch{left:12px;bottom:12px;padding:8px 12px 8px 9px;min-height:44px;font-size:12px;gap:5px}.cinema-card:not(.cinema-feature) .cinema-watch{left:12px;bottom:12px;width:44px}.cinema-duration{right:12px;bottom:15px;font-size:11px;padding:7px 8px}.cinema-end{display:block;margin-top:60px;padding-top:32px}.cinema-page .cinema-end>p{font-size:40px;margin:0 0 22px}.cinema-end>a{font-size:18px;width:100%;min-height:48px}.cinema-player-top{padding:8px 12px;min-height:64px;gap:8px}.cinema-player-count{min-width:62px;font-size:12px}.cinema-player-word{font-size:11px}.cinema-icon{width:44px;min-width:44px;height:44px;min-height:44px}.cinema-player-stage{padding:8px}.cinema-player-bottom{align-items:flex-start;padding:17px 16px calc(20px + env(safe-area-inset-bottom,0px));gap:12px}.cinema-page #cinema-player-title{font-size:25px;margin-bottom:9px}.cinema-page .cinema-player-description{font-size:14px}.cinema-page .cinema-player-category{font-size:11px;line-height:1.5;margin-bottom:7px}.cinema-player-nav{gap:6px;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.cinema-card{opacity:1;transform:none}.cinema-page *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:650px){.screen-panel .cinema-page{padding-top:20px}.cinema-page h1{font-size:40px}.cinema-header-side{margin-top:18px}.cinema-page .cinema-header{margin-bottom:20px}.cinema-page .cinema-grid{grid-template-columns:minmax(0,1fr)}.cinema-index{padding-bottom:10px}}

/* Lou: a regular, easily scanned film selection. */
.cinema-page .cinema-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 32px}.cinema-page .cinema-card:nth-child(n){grid-column:auto;max-width:none;width:100%;margin:0}.cinema-page .cinema-image,.cinema-page .cinema-feature .cinema-image,.cinema-page .cinema-card:last-child .cinema-image{aspect-ratio:16/9;max-height:none;min-height:0}.cinema-page .cinema-name,.cinema-page .cinema-feature .cinema-name{font-size:28px}.cinema-page .cinema-watch{left:16px;bottom:16px}.cinema-page .cinema-card .cinema-synopsis{margin-left:0}@media(max-width:650px){.cinema-page .cinema-grid{grid-template-columns:minmax(0,1fr);gap:32px}.cinema-page .cinema-name{font-size:25px}}
