@font-face{font-family:Collection Sans;src:url(assets/space-grotesk-400.ttf) format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Film Display;src:url(assets/instrument-serif-regular.ttf) format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Film Display;src:url(assets/instrument-serif-italic.ttf) format('truetype');font-weight:400;font-style:italic;font-display:swap}
:root{--current-ground:#103c2c;--current-paper:#f0dfb7;--paper:#f0dfb7;--header-height:84px;--page-inset:clamp(22px,4vw,64px);--label-width:360px;--panel-ground:#14251f;--panel-paper:#f0dfb7;--panel-line:#f0dfb72e;--panel-pad:28px;--ease:cubic-bezier(.2,.8,.2,1);font-family:Collection Sans,Arial,sans-serif;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
body{margin:0}h1,h2,p{margin:0}p{text-wrap:pretty}h1,h2{text-wrap:balance}
button,input{font:inherit}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent;color:inherit}input{color:inherit}
a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px}
button{cursor:pointer;transition:opacity 120ms ease,transform 120ms var(--ease)}button:hover{opacity:.75}button:active{transform:scale(.96)}button:disabled{opacity:.45}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:fixed;left:20px;top:12px;z-index:100;transform:translateY(-200%);padding:12px 16px;background:var(--paper);color:#103c2c}.skip-link:focus{transform:translateY(0)}
.site-header{position:fixed;inset:0 0 auto;z-index:10;height:var(--header-height);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 var(--page-inset)}
.wordmark{font:400 22px/1 Film Display,Georgia,serif;letter-spacing:-.025em;text-decoration:none;white-space:nowrap}
.site-header nav{display:flex;align-items:center;gap:26px;font:400 10px/1.5 Collection Sans,Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase}
.site-header nav a,.site-header nav button{display:inline-flex;align-items:center;min-height:44px;border:0;background:none;padding:0;text-decoration:none;font:inherit;letter-spacing:inherit;text-transform:inherit}
.site-header nav a:hover,#open-selector:hover,#open-selector[aria-expanded=true]{text-decoration:underline;text-underline-offset:5px}
/* Artwork framing is unchanged: the entire image fits the same viewport stage. */
.scene-stage{position:relative;isolation:isolate;overflow:hidden;padding:0;display:block}
.scene-art{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:contain;object-position:center bottom;z-index:-2;mask:none;-webkit-mask:none;filter:none;opacity:1;animation:none;transition:none}
.film-scene{color:var(--paper)}
/* One centered label column across every scene; content never changes its origin. */
.film-notes{position:relative;width:var(--label-width);margin-inline:auto;padding-top:calc(var(--header-height) + 20px)}
.film-heading{display:flex;align-items:baseline;gap:12px}
.film-heading h1{font:400 30px/1.12 Film Display,Georgia,serif;letter-spacing:-.015em;outline-offset:6px;min-width:0}
.film-year{flex:none;font:400 10px/1.5 Collection Sans,Arial,sans-serif;opacity:.65;font-variant-numeric:tabular-nums}
.film-edition{margin-top:5px;font:400 10px/1.5 Collection Sans,Arial,sans-serif;opacity:.7}
.film-meta{display:flex;align-items:baseline;flex-wrap:wrap;gap:3px 12px;margin-top:7px;font:400 11px/1.55 Collection Sans,Arial,sans-serif;letter-spacing:0}
.film-director{opacity:.8}
.review-rating{font:400 12px/1.5 Georgia,serif;letter-spacing:.04em;text-decoration:none;white-space:nowrap}
.review-rating:hover{text-decoration:underline}
.review-teaser{margin-top:15px;max-width:340px;font:italic 15px/1.6 Georgia,serif;letter-spacing:0;white-space:pre-line}
.review-toggle,.review-source{display:inline-flex;align-items:center;gap:7px;min-height:40px;margin-top:3px;padding:0;border:0;background:none;font:400 10px/1.5 Collection Sans,Arial,sans-serif;letter-spacing:.015em;text-decoration:underline;text-underline-offset:4px;text-transform:lowercase}
.review-source{margin-top:8px}
.review-toggle span{font-size:13px;text-decoration:none}
body.dialog-open .film-notes{visibility:hidden;pointer-events:none}
.scene-dock{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:52px;padding:0 var(--page-inset)}
.scene-dock button{font:400 11px/1 Collection Sans,Arial,sans-serif;min-height:44px;border:0;background:none;padding:8px 0;text-transform:lowercase}
.scene-dock button span{display:inline-block;margin:0 5px}
.position-label{font:400 10px/1.5 Collection Sans,Arial,sans-serif;font-variant-numeric:tabular-nums;opacity:.65}
/* Shared panel surface, heading, close button and action baseline. */
dialog{color:var(--panel-paper);background:var(--panel-ground);border:1px solid var(--panel-line);border-radius:0;box-shadow:0 24px 90px #0005;padding:0}
dialog::backdrop{background:transparent;backdrop-filter:none}
.dialog-open{overflow:hidden}
.panel-close{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;border:0;background:none;font:400 26px/1 Georgia,serif}
#review-panel{width:min(440px,calc(100% - 40px));max-height:calc(100svh - 64px);margin:auto var(--page-inset) auto auto;inset:0;padding:var(--panel-pad);overflow:auto}
.reading-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:18px;margin-bottom:22px;border-bottom:1px solid var(--panel-line)}
#review-title{font:400 30px/1.15 Film Display,Georgia,serif;letter-spacing:-.015em}#review-title:focus{outline:none}
#close-review{margin:-6px -10px -6px 0}
#review-copy{font:400 15px/1.65 Georgia,serif;white-space:pre-line;letter-spacing:0}
#review-letterboxd{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:18px;font:400 11px/1.5 Collection Sans,Arial,sans-serif;text-transform:lowercase}
.no-script{padding:140px 24px 60px;line-height:1.6}
@media(max-width:700px){
 :root{--header-height:76px;--panel-pad:20px;--label-width:min(360px,calc(100% - 44px))}
 .site-header nav{gap:18px;font-size:10px;letter-spacing:.06em}
 .film-heading h1{font-size:28px}.film-heading{gap:10px}.film-meta{gap:3px 10px}
 .review-toggle,.review-source{min-height:44px}
 #review-panel{margin:auto;width:calc(100% - 24px);max-height:calc(100svh - 24px)}
 .reading-header{padding-bottom:15px;margin-bottom:20px}#review-title{font-size:28px}
}
@media(max-width:360px){:root{--page-inset:18px;--label-width:calc(100% - 36px)}.site-header nav{gap:14px}.film-meta{font-size:10px}}
@media(max-height:580px){:root{--header-height:56px}.film-notes{padding-top:76px}}
