:root{
 color-scheme:dark;--ink:#f3f0e9;--muted:#b8b7b3;--paper:#101010;
 --header-height:84px;--peek-height:clamp(160px,26dvh,260px);--film-gap:3px;
 --panel-height:calc(100dvh - var(--header-height) - var(--peek-height) - var(--film-gap));
 --edge:44px
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
html{overflow:clip}body{position:fixed;inset:0;overflow:hidden}
button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #e5efb6;outline-offset:5px}
button:disabled{opacity:.45;cursor:default}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:-100px;left:20px;z-index:100;background:#eee;color:#111;padding:15px}.skip-link:focus{top:10px}
.masthead{position:fixed;inset:0 0 auto;z-index:15;height:var(--header-height);padding:22px var(--edge);display:flex;justify-content:space-between;align-items:flex-start;background:var(--paper);pointer-events:none}
.masthead a,.masthead button{pointer-events:auto}
.wordmark{padding:0;text-align:left;font-size:26px;font-weight:500;letter-spacing:-1.4px;line-height:1}
.wordmark span{display:block;font-size:9px;letter-spacing:1.2px;word-spacing:3px;font-weight:400;margin-top:10px;opacity:.7}
nav{display:flex;gap:34px;align-items:center;font-size:12px;letter-spacing:.2px}nav button{min-height:44px}
.text-button span{font-size:9px;margin-left:8px;opacity:.55}.contact-button{border-bottom:1px solid #ffffff70;padding:0 0 4px}.contact-button span{margin-left:20px;font-size:16px}
#feed{margin-top:var(--header-height);height:calc(100vh - var(--header-height));height:calc(100dvh - var(--header-height));padding-bottom:0;overflow-y:auto;scrollbar-width:none;overscroll-behavior-y:contain}
#feed::-webkit-scrollbar{display:none}
.film{--media-aspect:1.777777778;--frame-height:calc((100vw - 160px) / var(--media-aspect));height:min(var(--panel-height),calc(var(--frame-height) + var(--details-clearance,96px)));margin-bottom:var(--film-gap);position:relative;isolation:isolate;overflow:hidden;background:#0d0d0d}
.film:last-child{margin-bottom:0}
.film.is-portrait{--media-aspect:.5625}
/* Portrait images use 90% of their fitted size; details follow beneath them. */
body:not(.theater-mode) .film.is-portrait{height:calc(min(calc(100dvh - var(--header-height)),var(--frame-height)) * .9 + var(--details-clearance,96px))}
.media-stage{position:absolute;inset:0 80px var(--details-clearance,96px);isolation:isolate;container-type:size;z-index:0;background:#000}
.poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:1;background:#000;pointer-events:none}
.player-wrap{position:absolute;inset:0;z-index:0;background:#000;pointer-events:none}
.player-wrap iframe{border:0;position:absolute;width:100%;height:100%;inset:0}
.film.has-played .poster{opacity:0}
.video-tap{position:absolute;inset:0;z-index:2;width:100%;height:100%;padding:0;background:transparent;touch-action:pan-y pinch-zoom;cursor:pointer}
.film-details{position:absolute;left:80px;right:80px;bottom:4px;z-index:5}
.player-controls{display:flex;align-items:center;gap:10px;width:100%;min-height:44px}
.control-button{flex:0 0 44px;width:44px;height:44px;padding:0;border:0;border-radius:0;background:transparent;color:#fff;display:grid;place-items:center;transition:opacity .2s}
.control-button:hover{opacity:.65}.control-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.4}
.play-control svg{width:16px;height:16px;fill:currentColor;stroke:none}.play-control span{display:none}
.project-caption{position:relative;top:4px;display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;margin:0 0 2px;padding:0;font-weight:400;text-align:center;white-space:normal;overflow-wrap:anywhere}
.caption-title{width:100%;min-width:0;color:var(--ink);font:400 17px/1.35 Georgia,'Times New Roman',serif;letter-spacing:-.2px}
.caption-roles{max-width:100%;min-width:0;color:var(--muted);font:400 10px/1.5 Arial,Helvetica,sans-serif;letter-spacing:.8px}
.caption-roles:empty{display:none}
.video-state{position:absolute;bottom:calc(var(--details-clearance,96px) - 14px);left:50%;transform:translateX(-50%);text-align:center;font-size:10px;line-height:12px;color:#ddd;max-width:90%;white-space:nowrap;z-index:4}.video-state:empty{display:none}
.position{position:fixed;right:36px;top:50%;max-height:calc(100dvh - 168px);transform:translateY(-50%);z-index:10;display:flex;align-items:center;flex-direction:column;gap:18px;font-size:10px;font-variant-numeric:tabular-nums}
.position>span:last-child{opacity:.4}#dots{display:flex;flex-direction:column;gap:4px;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
#dots button{height:25px;width:28px;flex-shrink:0;display:grid;place-items:center;padding:0}
#dots button::after{content:"";width:3px;height:15px;background:#ffffff40;border-radius:2px;transition:background .2s,height .2s}
#dots button[aria-current=true]::after{height:24px;background:#eee}
.round-button{height:44px;width:44px;border-radius:50%;border:1px solid #ffffff42;background:#2e2e2e6e;backdrop-filter:blur(18px);display:grid;place-items:center;transition:background .2s}
.round-button:hover{background:#6668}.round-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.4}
.feed-footer{display:none}
#theater-bio{display:none}
.next-teaser{display:none;position:absolute;inset:0;z-index:4;width:100%;height:100%;padding:0;background:transparent}
.film:not(.is-active) .next-teaser{display:block}
.film:not(.is-active) .video-tap,.film:not(.is-active) .video-state{visibility:hidden;pointer-events:none}
.timeline{flex:1 1 auto;min-width:0;width:100%;height:44px;margin:0 4px;appearance:none;background:transparent;cursor:pointer;touch-action:pan-x;--progress:0%}
.timeline::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:linear-gradient(to right,#eee var(--progress),#ffffff25 var(--progress))}
.timeline::-moz-range-track{height:3px;border-radius:2px;background:#ffffff25}.timeline::-moz-range-progress{height:3px;border-radius:2px;background:#eee}
.timeline::-webkit-slider-thumb{appearance:none;height:9px;width:9px;border-radius:50%;background:#eee;margin-top:-3px}.timeline::-moz-range-thumb{height:9px;width:9px;border:0;border-radius:50%;background:#eee}
dialog{color:#eee;border:1px solid #ffffff25;background:#20201ef5;backdrop-filter:blur(25px);border-radius:8px;width:min(650px,calc(100% - 32px));max-height:85dvh;padding:27px 36px 32px;box-shadow:0 30px 100px #0009}
dialog::backdrop{background:#0009;backdrop-filter:blur(12px)}.dialog-header{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:2px}.dialog-close{background:transparent;font-size:24px;border:0}
dialog h2{font:400 48px/1.1 Georgia,serif;letter-spacing:-1.5px;margin:22px 0 33px}
.index-row{width:100%;display:grid;grid-template-columns:30px 75px minmax(0,1fr) 35px;gap:15px;align-items:center;text-align:left;padding:16px 0;border-top:1px solid #ffffff20}
.index-row>span:first-child{font-size:10px;opacity:.5}.index-thumbnail{--thumbnail-width:75px;--thumbnail-height:45px;position:relative;display:block;width:var(--thumbnail-width);height:var(--thumbnail-height);overflow:hidden;border-radius:2px}.index-thumbnail img{position:absolute;left:50%;top:50%;display:block;width:var(--thumbnail-width);height:var(--thumbnail-height);object-fit:cover;object-position:var(--thumbnail-position,50% 50%);transform:translate(-50%,-50%) rotate(var(--thumbnail-rotation,0deg)) scale(var(--thumbnail-scale,1));transform-origin:center}.index-thumbnail.quarter-turn img{width:var(--thumbnail-height);height:var(--thumbnail-width)}.index-title{min-width:0}.index-title strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.index-row strong{font-size:15px;font-weight:400;display:block}.index-row small{font-size:10px;display:block;opacity:.5;margin-top:6px}.index-row>span:last-child{font-size:10px;opacity:.5}.index-row:hover strong{text-decoration:underline;text-underline-offset:4px}
.dialog-note{font-size:11px;opacity:.4;margin-top:27px}#contact-dialog p{font-size:14px;line-height:1.7;color:#c8c7c3;max-width:48ch}.contact-detail{font-size:clamp(15px,4vw,24px);display:flex;justify-content:space-between;padding:18px 0;border-bottom:1px solid #ffffff40}
#bio-copy{margin:14px 0}#bio-copy p{margin:0}#bio-copy p+p{margin-top:14px}
.phone-contact{align-items:center;gap:12px}.phone-contact>a{display:flex;align-items:center;min-height:44px}.phone-actions{display:flex;gap:8px;font-size:12px}.phone-actions a{display:grid;place-items:center;min-width:44px;min-height:44px;text-decoration:underline;text-underline-offset:4px}
.no-js{position:fixed;inset:40% 20%;z-index:50;background:#222;padding:30px}.no-js a{text-decoration:underline}
@media(min-width:1600px){:root{--edge:64px}}
@media(max-width:700px){
 :root{--edge:20px;--header-height:76px;--peek-height:clamp(145px,22dvh,210px);--film-gap:2.5px}
 .masthead{padding:20px var(--edge)}.wordmark{font-size:24px}.wordmark span{font-size:8px;letter-spacing:1px;word-spacing:2px;margin-top:8px}
 nav{gap:20px;font-size:10px}nav .contact-button{font-size:0;border:0;border-radius:0;width:38px;min-height:38px;padding:0}nav .contact-button span{font-size:19px;margin:0}
 .film{--frame-height:calc(100vw / var(--media-aspect))}
 .film-details{left:20px;right:20px;bottom:4px}.player-controls{gap:7px}
 .project-caption{margin:0 0 2px}.caption-title{font-size:16px}
 .media-stage{left:0;right:0}
 .position{display:none}.position>span{font-size:8px}#dots{gap:0}#dots button{height:22px;width:25px}#dots button::after{height:11px;width:2px}#dots button[aria-current=true]::after{height:18px}
 dialog{padding:20px 22px}dialog h2{font-size:39px}.index-row{grid-template-columns:20px 60px minmax(0,1fr) 30px;gap:10px}.index-thumbnail{--thumbnail-width:60px;--thumbnail-height:38px}.index-row strong{font-size:13px}.index-row small{font-size:9px}
}
/* Compact fallback for short windows that are not in theater mode. */
@media(orientation:landscape) and (max-height:600px){
 :root{--header-height:48px;--peek-height:clamp(58px,17dvh,74px);--film-gap:2px;--edge:max(16px,env(safe-area-inset-left))}
 .masthead{padding:0 var(--edge);align-items:center}.wordmark{font-size:21px;letter-spacing:-1px}.wordmark span{display:none}
 nav{gap:22px;font-size:10px}nav button{min-height:40px}.contact-button{border:0;padding:0}.contact-button span{margin-left:12px}
 .position{display:none}
 .film-details{left:var(--edge);right:var(--edge);bottom:4px}
 .project-caption{margin:0 0 2px}.caption-title{font-size:16px}
 .round-button{width:44px;height:44px;background:#2525258c}.round-button svg{width:17px;height:17px}
 .contact-detail{padding:12px 0}
 dialog{max-height:calc(100dvh - 20px);padding:15px 25px}.dialog-header{font-size:8px}dialog h2{font-size:30px;margin:10px 0 20px}.dialog-note{margin-top:16px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Widescreen keeps the whole feed scrollable, one full-viewport film at a time. */
body.theater-mode{background:var(--paper)}
body.theater-mode .masthead,body.theater-mode .position,body.theater-mode .film .next-teaser{display:none}
body.theater-mode #feed{background:var(--paper);margin-top:0;height:100vh;height:100dvh;padding:0;overflow-y:auto;scroll-snap-type:y mandatory;touch-action:pan-y pinch-zoom;overscroll-behavior-x:none}
body.theater-mode .film{width:100%;height:100vh;height:100dvh;margin:0;background:var(--paper);scroll-snap-align:start;scroll-snap-stop:always}
body.theater-mode .media-stage{inset:0;background:var(--paper)}
body.theater-mode .poster,body.theater-mode .player-wrap{inset:50% auto auto 50%;width:min(100vw,calc(100dvh * var(--media-aspect)));height:min(100dvh,calc(100vw / var(--media-aspect)));transform:translate(-50%,-50%)}
/* These exports contain a sideways picture. Contain the corrected rectangle
   in the stage, then swap the encoded box before rotating it. The cover and
   live player share exactly the same geometry in both feed and theater. */
.film.is-rotated .poster,.film.is-rotated .player-wrap{inset:50% auto auto 50%;width:min(100cqw,calc(100cqh * var(--media-aspect)));height:min(100cqh,calc(100cqw / var(--media-aspect)));transform:translate(-50%,-50%) rotate(var(--media-rotation));transform-origin:center}
.film.is-quarter-turn .poster,.film.is-quarter-turn .player-wrap{width:min(100cqh,calc(100cqw / var(--media-aspect)));height:min(100cqw,calc(100cqh * var(--media-aspect)))}
body.theater-mode .poster{object-position:center}
body.theater-mode .video-tap{touch-action:pan-y pinch-zoom}
body.theater-mode #theater-bio{display:block;position:fixed;top:max(12px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));z-index:20;min-width:44px;min-height:44px;padding:0;background:var(--paper);color:var(--ink);font-size:24px;font-weight:500;letter-spacing:-1.4px}
@media(orientation:landscape) and (max-aspect-ratio:23/10){body.theater-mode #theater-bio{font-size:18px;letter-spacing:-1px}}
body.theater-mode .film-details{left:0;right:0;bottom:0;padding:6px max(20px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));border:0;border-radius:0;background:var(--paper);backdrop-filter:none;opacity:1;visibility:visible;pointer-events:auto;transition:opacity .25s ease,visibility 0s}
body.theater-mode.theater-info-hidden .film-details{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,visibility 0s linear .25s}
body.theater-mode .project-caption{margin-bottom:6px}
body.theater-mode .video-state{bottom:max(130px,calc(env(safe-area-inset-bottom) + 114px));left:50%;right:auto;transform:translateX(-50%);text-align:center}
/* Fullscreen the feed so every film stays inside the fullscreen surface. */
#feed:fullscreen{width:100vw;height:100vh;height:100dvh;margin:0;padding:0;border:0;background:var(--paper)}

/* A quiet contact destination closes the feed, without wrapping to the top. */
.closing-contact{min-height:calc(100dvh - var(--header-height));padding:clamp(36px,6vw,88px) max(24px,env(safe-area-inset-left));display:flex;align-items:center;background:var(--paper);color:var(--ink)}
.closing-inner{width:min(100%,920px);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,90px);align-items:center}
.closing-portrait{display:block;width:100%;height:auto;aspect-ratio:4/5;max-height:62dvh;object-fit:cover;object-position:center 65%;border-radius:2px}
.closing-eyebrow{font-size:9px;letter-spacing:1.5px;color:var(--muted);margin:0 0 22px}
.closing-contact h2{font:400 clamp(36px,5vw,62px)/1.07 Georgia,'Times New Roman',serif;letter-spacing:-1.2px;margin:0 0 18px}
.closing-copy>p:not(.closing-eyebrow){font-size:15px;line-height:1.7;margin:0;color:var(--muted)}
.closing-bio{max-width:39ch;font-size:15px;line-height:1.65;color:var(--muted)}
.closing-bio p{margin:0}
.closing-bio p+p{margin-top:14px}
.closing-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:24px}
.closing-actions a{display:inline-flex;align-items:center;font-size:12px;min-height:44px;padding:4px 0;border-bottom:1px solid currentColor}
.closing-actions a span{margin-left:18px}
body.at-ending .position{visibility:hidden}
body.theater-mode .closing-contact{min-height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;padding-top:max(64px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}
.private-link{display:inline-flex;align-items:center;gap:20px;min-height:44px;margin-top:16px;padding:0;font-size:12px;border-bottom:1px solid currentColor}
.closing-copy>.private-link{font-size:11px;color:var(--muted);border:0;margin-top:24px}
#private-dialog{max-width:480px}
#private-dialog h2{font-size:clamp(30px,7vw,43px);margin-bottom:22px}
#private-dialog p{font-size:14px;line-height:1.6;color:var(--muted)}
#private-form label{display:block;font-size:11px;margin:24px 0 10px}
#private-password{width:100%;height:48px;background:var(--paper);color:var(--ink);border:1px solid color-mix(in srgb,var(--ink) 35%,transparent);border-radius:3px;padding:0 12px;font:16px Arial,Helvetica,sans-serif}
.private-submit{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;min-height:48px;background:var(--ink);color:var(--paper);font-size:13px;padding:12px 16px;border-radius:3px;margin-top:16px}
.private-lock{display:block;font-size:12px;min-height:44px;padding:0;border-bottom:1px solid currentColor;margin-top:12px}
#private-error{min-height:0;margin:14px 0 0}#private-error:empty{display:none}
#private-form[hidden],#private-unlocked[hidden]{display:none}
@media(max-width:600px) and (orientation:portrait){
 .closing-contact{padding:32px 28px 48px}
 .closing-inner{width:min(100%,360px);grid-template-columns:1fr;gap:28px}
 .closing-portrait{width:70%;max-height:34dvh;object-position:center 65%}
 .closing-eyebrow{margin-bottom:14px}.closing-contact h2{font-size:38px}
 .closing-actions{margin-top:18px}.closing-copy>.private-link{margin-top:14px}
}
@media(orientation:landscape) and (max-height:600px){
 .closing-inner{width:min(100%,740px);grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:40px}
 .closing-portrait{max-height:calc(100dvh - 96px);width:auto;max-width:100%;justify-self:center}
 .closing-contact h2{font-size:36px;margin-bottom:10px}.closing-eyebrow{margin-bottom:12px}
 .closing-actions{margin-top:12px}.closing-copy>.private-link{margin-top:6px}
}


/* Audio ownership is visible on the picture, independently of fading controls. */
.audio-indicator{
 display:none;position:absolute;z-index:5;
 top:var(--audio-indicator-top,calc((100cqh - min(100cqh,100cqw / var(--media-aspect))) / 2 + 10px));
 right:calc((100cqw - min(100cqw,100cqh * var(--media-aspect))) / 2 + 10px);
 align-items:center;justify-content:center;gap:8px;min-height:36px;padding:8px 11px;
 border:1px solid #ffffff42;border-radius:999px;background:#000c;color:#fff;
 font:500 10px/1.25 var(--editorial-font,Arial,sans-serif);letter-spacing:.055em;
 box-shadow:0 2px 10px #0002;cursor:pointer;touch-action:manipulation;
}
.film.is-audible .audio-indicator{display:inline-flex;animation:audio-badge-fade .35s ease 3s forwards}
.film.is-audible .audio-indicator:focus-visible{animation:none;opacity:1;visibility:visible;pointer-events:auto}
.film.is-audible .audio-indicator:hover{animation-play-state:paused}
.audio-indicator:hover{background:#000e;border-color:#ffffff80}
.audio-indicator-bars{display:flex;align-items:center;gap:2px;height:13px;width:12px}
.audio-indicator-bars i{display:block;width:2px;height:11px;border-radius:1px;background:currentColor;transform:scaleY(.6);animation:audio-pulse .9s ease-in-out infinite alternate}
.audio-indicator-bars i:nth-child(2){animation-delay:-.6s;transform:scaleY(1)}
.audio-indicator-bars i:nth-child(3){animation-delay:-.3s;transform:scaleY(.4)}
@keyframes audio-pulse{from{transform:scaleY(.35)}to{transform:scaleY(1)}}
@keyframes audio-badge-fade{from{opacity:1;visibility:visible}to{opacity:0;visibility:hidden;pointer-events:none}}
/* A newly audible neighbor may precede the navigation selection. */
.film.is-audible .next-teaser{pointer-events:none}
.film.is-audible:not(.is-active) .video-tap{visibility:visible;pointer-events:auto}
@media(max-width:700px){.audio-indicator{min-height:34px;padding:8px 10px;font-size:9px;gap:7px}}
@media(prefers-reduced-motion:reduce){
 .audio-indicator-bars i{animation:none}
 .film.is-audible .audio-indicator{animation:audio-badge-fade 1ms step-end 3s forwards!important}
 .film.is-audible .audio-indicator:focus-visible{animation:none!important}
}