:root{color-scheme:dark;--bg:#171817;--panel:#20221f;--ink:#f4f2e9;--muted:#b6b9b0;--line:#383b35;--accent:#d5ed9c;--max:1440px;font-family:Arial,"Helvetica Neue",sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;line-height:1.55}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:.25em}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{opacity:.65;cursor:default}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
[hidden]{display:none!important}
.skip,.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip:focus{z-index:4;left:1rem;top:1rem;clip-path:none;width:auto;height:auto;background:var(--bg);padding:1rem}
.top,main,footer{max-width:var(--max);margin:0 auto;padding-inline:clamp(18px,5vw,76px)}
.top{display:flex;justify-content:space-between;align-items:center;gap:14px;min-height:85px}
.wordmark{display:inline-flex;gap:11px;align-items:center;font-weight:900;letter-spacing:-.065em;font-size:1.7rem;line-height:1}
.wordmark:hover{text-decoration:none}
.mark{font-size:2rem;color:var(--accent)}
nav{display:flex;flex-wrap:wrap;gap:clamp(12px,2.5vw,40px);align-items:center}
nav a{font-size:.92rem;color:var(--muted);font-weight:600}
nav a:hover,nav a[aria-current]{color:var(--ink)}
.hero{height:clamp(365px,42vw,560px);position:relative;isolation:isolate;overflow:hidden;border-radius:6px;background:#14362e;display:flex;align-items:flex-end}
.hero-art,.hero-shade{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.hero-art{object-position:center 49%}
.hero-shade{background:linear-gradient(90deg,#10221deb,transparent 74%),linear-gradient(0deg,#10181177,transparent 50%)}
.hero-body{padding:clamp(25px,4vw,64px);max-width:74%}
.hero h1{font-size:clamp(3rem,7vw,6.9rem);margin:.16em 0 .05em}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{letter-spacing:-.053em;line-height:1.04}
h1{font-size:clamp(3.2rem,7.3vw,6.6rem);margin:.16em 0 .3em;text-wrap:balance}
h2{font-size:clamp(2.05rem,4vw,3.8rem);margin:.15em 0 .35em}
h3{font-size:clamp(1.34rem,2vw,2.1rem)}
.hero-body>p:not(.eyebrow){font-size:clamp(1rem,1.65vw,1.45rem);margin-bottom:1.25em}
.eyebrow,.card-meta,.hero-code,.duration{font:600 .71rem/1.5 ui-monospace,Consolas,"Courier New",monospace;letter-spacing:.095em;text-transform:uppercase}
.eyebrow{color:var(--accent);margin:0}
.eyebrow i{display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor;margin-right:6px}
.eyebrow b{padding:0 .4em;color:var(--muted)}
.hero-code{position:absolute;right:22px;bottom:18px;color:#edf1d4;opacity:.85;font-size:.62rem}
.btn,.controls button{display:inline-flex;justify-content:center;align-items:center;gap:10px;min-height:43px;padding:10px 18px;border:1px solid transparent;border-radius:99px;font-size:.92rem;line-height:1.35;font-weight:700}
.primary{background:var(--accent);color:#182014}
.primary:hover{background:#e8ffc0;text-decoration:none}
.outline{border-color:#75816a;color:var(--ink);background:transparent}
.btn>span{font-size:.7em}
.shelf{margin-block:clamp(48px,6vw,88px)}
.section-head,.card-meta,.card h3,.film-info,footer{display:flex;justify-content:space-between;gap:18px;align-items:baseline}
.section-head{align-items:flex-end;margin-bottom:19px}
.section-head h2,.card h3{margin-bottom:0}
.quiet,.back,.film-info dt,.note a{color:var(--muted);font-size:.9rem}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(15px,2.5vw,35px)}
.thumb{position:relative;overflow:hidden;border-radius:4px;aspect-ratio:16/9}
.thumb img{width:100%;height:100%;display:block;transition:transform .3s}
.card:hover{text-decoration:none}
.card:hover img{transform:scale(1.035)}
.card:hover h3{color:var(--accent)}
.duration{position:absolute;bottom:8px;right:8px;background:#171a18e8;padding:3px 6px;border-radius:2px;font-size:.65rem}
.card-meta{color:var(--muted);font-size:.65rem;margin:12px 0 7px}
.card h3 span{font-weight:400;font-size:.7em;color:var(--accent)}
.note{display:grid;grid-template-columns:1fr 2.4fr 1fr;align-items:baseline;gap:24px;border-block:1px solid var(--line);padding:32px 0;margin-bottom:52px}
.note p{max-width:56ch;margin:0;color:#e0dfd6;font-size:clamp(1.04rem,1.7vw,1.4rem);line-height:1.45}
.note a{text-decoration:underline;text-underline-offset:.24em}
footer{border-top:1px solid var(--line);padding-block:30px;align-items:center;flex-wrap:wrap}
footer p{margin:0 auto 0 0;color:var(--muted);font-size:.85rem}
footer .wordmark{font-size:1.22rem}
footer nav a{font-size:.79rem}
.reading{max-width:1080px;padding:clamp(24px,5vw,76px) 0 clamp(48px,6vw,92px);margin:auto;min-height:67vh}
.narrow{max-width:760px}
.back{display:inline-block;margin-bottom:26px}
.lead,.prose p,.film-info p:not(.eyebrow){font-size:clamp(1.08rem,1.8vw,1.4rem);color:#dedfd5;line-height:1.55;max-width:67ch}
.plans{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:32px}
.plans section,.panel{border:1px solid var(--line);background:var(--panel);padding:clamp(20px,3vw,40px);border-radius:6px}
.plans section{display:flex;align-items:flex-start;flex-direction:column}
.plans h2,.panel h2{font-size:2.2rem;margin:14px 0}
.plans section>p:not(.eyebrow,.price),.panel p:not(.eyebrow){color:var(--muted)}
.plans .btn{margin-top:auto}
.studio{box-shadow:inset 0 3px var(--accent)}
.price{font-size:2.2rem;letter-spacing:-.06em;margin:.15em 0;font-weight:700}
.price small{font-size:1rem;letter-spacing:0;color:var(--muted)}
.panel{margin:30px 0}
.panel .status{margin:.8em 0 0;color:var(--accent)}
.history h2,.prose h2{font-size:clamp(1.5rem,2.7vw,2.1rem);margin:1.3em 0 .4em}
.history ol{padding:0;list-style:none}
.history li{border-bottom:1px solid var(--line);padding:.7em 0}
.textbtn{color:var(--muted);text-decoration:underline;text-underline-offset:.25em;padding:0;border:0;background:transparent}
.prose section{padding-bottom:.6rem}
.player{background:#0c0d0c;border:1px solid var(--line);border-radius:5px;overflow:hidden}
.screen{width:100%;aspect-ratio:16/9;overflow:hidden;display:grid;place-items:center}
.screen svg{display:block;width:100%;height:100%}
.controls{display:flex;align-items:center;gap:clamp(5px,1.5vw,16px);padding:10px;background:#22251f}
.controls button{border:0;padding:5px 12px;min-height:37px;color:var(--ink);background:#394132;font-size:.85rem;white-space:nowrap}
.controls input{min-width:0;flex:1;accent-color:var(--accent)}
.controls output{font: .77rem monospace;white-space:nowrap}
.player:fullscreen{display:flex;flex-direction:column;justify-content:center}
.player:fullscreen .screen{height:calc(100% - 60px);aspect-ratio:auto}
.player:fullscreen .screen svg{max-width:177.77vh;width:auto;max-height:100%}
.film-info{margin:28px 0;align-items:flex-start}
.film-info>div{max-width:60%}
.film-info dl{margin:0}
.film-info dd{margin:0 0 .5em}
.next{display:inline-block;border-top:1px solid var(--line);width:100%;padding-top:18px;color:var(--accent)}
@media(max-width:740px){.top{min-height:67px}.hero-body{max-width:87%}.cards{gap:14px}.note{grid-template-columns:1fr;gap:11px}.wordmark{font-size:1.35rem}.mark{font-size:1.65rem}footer nav{width:100%}.film-info{display:block}.film-info>div{max-width:100%}.plans{gap:10px}.card-meta span:last-child{display:none}.hero-code{display:none}}
@media(max-width:560px){nav a{font-size:.79rem}.top nav{gap:12px}.wordmark{gap:4px}.hero{height:420px}.hero-art{object-position:65% center}.hero-shade{background:linear-gradient(0deg,#11211df5 4%,#11211da2 40%,transparent 80%)}.hero-body{max-width:100%;padding:20px}.hero h1{font-size:clamp(2.65rem,10.5vw,4rem)}.hero-body>p:not(.eyebrow){max-width:25ch}.cards,.plans{grid-template-columns:1fr}.card-meta span:last-child{display:inline}.card{margin-bottom:10px}.cards h3{font-size:1.75rem}.controls{gap:5px;padding:6px}.controls button{padding:5px 8px}.controls output{font-size:.66rem}.note{margin-bottom:30px}.section-head{gap:5px}.section-head .quiet{font-size:.77rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.thumb img{transition:none}}