/* Original films, in their original framing. */
#project-dialog.film-dragging{will-change:transform,opacity;user-select:none;-webkit-user-select:none}
#project-dialog{overscroll-behavior-y:contain;overscroll-behavior-x:auto}
/* Fade a single dark layer back to the page; avoid a full-screen blur pass
   over the moving previews on tablets. */
#project-dialog::backdrop{backdrop-filter:none;-webkit-backdrop-filter:none}
/* Reserve vertical film gestures before the browser commits to scrolling. */
#project-film{touch-action:pinch-zoom}
#project-film:fullscreen{touch-action:auto}
#project-film:-webkit-full-screen{touch-action:auto}
#project-dialog.film-native-fullscreen #project-film{touch-action:auto}
.work{background:var(--paper)}
.work-heading{align-items:center;gap:24px;margin-bottom:40px}.work-heading h2{font-size:clamp(38px,4.8vw,72px)}

.film-grid{grid-template-columns:minmax(0,1fr) minmax(0,.3166fr);align-items:start;gap:34px}
.film-grid .project{grid-column:auto}.film-grid .project-media{height:auto;aspect-ratio:910/512;background:#000;isolation:isolate}.film-grid .film-portrait .project-media{aspect-ratio:512/910}
.work-preview{width:100%;height:100%;object-fit:contain;display:block;background:#000;pointer-events:none}
.film-grid .project-media:after{background:linear-gradient(180deg,#0006,transparent 23%,transparent 68%,#000b)}
.film-grid .image-label{font-size:8px;left:20px;top:20px;font-weight:400;letter-spacing:.1em}
.film-play{position:absolute;z-index:2;bottom:18px;left:20px;display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:0;color:#fff;text-shadow:0 1px 9px #000}.film-play>span{font-size:18px;line-height:1}
.film-duration{position:absolute;z-index:2;bottom:20px;right:20px;color:#eee;font-size:8px}
.film-portrait .film-duration{display:none}.film-portrait .film-play{font-size:8px;gap:8px}
.film-grid .project-caption{display:block;margin-top:18px}.film-grid .project-caption h3{font-size:15px;line-height:1.5}.film-grid .project-caption>span{display:block;margin-top:8px;max-width:none;text-align:left;font-size:8px;letter-spacing:.04em;color:#99918b}
.film-grid .project:hover .film-play>span{transform:scale(1.18)}.film-play>span{transition:transform .2s}
#project-dialog{background:#090808;width:min(1040px,calc(100% - 32px));max-height:94svh}
#project-dialog .project-dialog-media{aspect-ratio:auto;max-height:none;background:#000;overflow:visible}
#project-film{display:block;width:100%;height:auto;max-height:70svh;object-fit:contain;background:#000;outline-offset:-4px}
#project-dialog[data-format=portrait]{width:min(500px,calc(100% - 32px))}
#project-dialog[data-format=portrait] #project-film{height:65svh;max-height:720px}
#project-dialog .project-dialog-copy{padding:24px 30px 30px}#project-dialog .project-dialog-copy h2{font-size:27px;margin:16px 0 24px}
#project-dialog .dialog-eyebrow{font-size:8px;color:#b1a9a3;line-height:1.8}
/* A reserved toolbar keeps app controls out of the native video surface. */
#project-dialog .project-dialog-toolbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:6px 10px;background:#090808;isolation:isolate}
#project-dialog .project-dialog-toolbar .dialog-close,#project-dialog .project-mute{position:static;float:none;margin:0;inset:auto;width:44px;height:44px;min-width:44px;min-height:44px;display:grid;place-items:center;background:#090808;color:#eee}
#project-dialog .project-mute{padding:11px;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.project-mute svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.project-mute[aria-pressed=false] .audio-slash,.project-mute[aria-pressed=true] .audio-wave{display:none}
#project-dialog .project-mute[aria-pressed=true]{color:var(--accent-soft)}
#project-dialog .project-mute:focus-visible{outline:2px solid var(--accent-line);outline-offset:-3px}
#project-dialog:not(.film-native-fullscreen) #project-film::-webkit-media-controls-mute-button{display:none}
#film-status{font-size:11px;color:#b9b0a9}
@media(max-width:900px){.film-grid{gap:22px}.film-grid .image-label{left:14px;top:14px;font-size:7px}.film-play{left:14px;bottom:14px;font-size:8px}.film-duration{right:14px;bottom:15px}.film-portrait .film-play{font-size:0}.film-portrait .film-play>span{font-size:22px}.film-grid .project-caption h3{font-size:12px}}
@media(max-width:900px){.work .section-top{margin-bottom:28px}.work-heading{display:block;margin-bottom:24px}.work-heading h2{font-size:38px}.film-grid{grid-template-columns:1fr;gap:36px}.film-grid .film-portrait{width:min(100%,340px)}.film-grid .film-portrait .project-media{max-height:72svh;aspect-ratio:512/910}.film-grid .film-portrait{justify-self:center}.film-portrait .film-play{font-size:9px}.film-grid .project-caption h3{font-size:14px}.film-grid .project-caption>span{font-size:8px}.film-grid .image-label{font-size:7px}#project-dialog .project-dialog-copy{padding:22px 20px 26px}#project-dialog .project-dialog-copy h2{font-size:23px}#project-dialog .dialog-eyebrow{font-size:7px}#project-dialog[data-format=portrait] #project-film{height:63svh}.film-duration{font-size:7px}}

/* Project-specific authorship and readable disclosure accompany every FPV preview. */
.project-entry{min-width:0}.project-entry>.project{width:100%;display:block}.film-author,.film-disclosure{font-size:12px;line-height:1.7;color:#beb6b1;margin:14px 0 0;letter-spacing:0}.film-author a{display:inline;text-decoration:underline;text-underline-offset:4px}.film-author a:hover{color:var(--accent-soft)}.film-disclosure{padding-top:12px;border-top:1px solid #3a3430}.film-disclosure>span{display:block;color:#dedad7;margin-bottom:5px}.film-ai-label{position:absolute;z-index:3;top:44px;left:14px;right:14px;width:fit-content;max-width:calc(100% - 28px);padding:5px 8px;font-size:11px;line-height:1.4;color:#f1efee;background:#171513eF;border:1px solid #74655a;border-radius:3px;pointer-events:none;text-shadow:none}.film-grid .project-entry.film-portrait{width:100%}#project-dialog .project-dialog-media{position:relative}#project-ai-label{position:static;inset:auto;display:inline-block;width:auto;max-width:100%;height:auto;margin:0 0 14px;vertical-align:top}#project-ai-label[hidden]{display:none}#project-dialog .film-author{margin-top:-10px;margin-bottom:18px}#project-dialog .film-disclosure{margin-bottom:24px}#project-dialog .film-disclosure,#project-dialog .film-author{font-size:12px}
@media(max-width:900px){.film-grid .project-entry.film-portrait{width:min(100%,340px,calc(72svh * 512 / 910));justify-self:center;margin-inline:auto}.project-entry>.project.film-portrait{width:100%}.film-grid .film-portrait .project-media{margin-inline:auto}.film-author,.film-disclosure{font-size:12px}.film-ai-label{font-size:11px}}

.film-disclosure,#project-dialog .film-disclosure{font-size:11px;line-height:1.75}.film-disclosure>span{font-size:10px;letter-spacing:.025em}@media(max-width:900px){.film-disclosure,#project-dialog .film-disclosure{font-size:11px}}

/* Keep metadata in normal flow, clear of the film and native player controls. */
.film-event{font-size:11px;line-height:1.7;color:#beb6b1;margin:10px 0 0}#project-dialog .film-event{font-size:12px;margin:-10px 0 20px}#project-dialog .film-event[hidden]{display:none}

/* Pair original landscape and portrait formats; keep mobile a single column. */
@media(min-width:901px){.film-grid{grid-template-columns:repeat(12,minmax(0,1fr))}.film-grid>.project-entry.film-landscape{grid-column:span 9}.film-grid>.project-entry.film-portrait{grid-column:span 3}.film-grid>.project-entry:nth-last-child(-n+2){grid-column:span 6}}

/* The intro film has one visible home; keep its card if motion/rendering is unavailable. */
@media(min-width:901px){.film-grid>.project-entry.film-landscape.film-row-reverse-wide{grid-column:4/-1;grid-row:2}.film-grid>.project-entry.film-portrait.film-row-reverse-portrait{grid-column:1/span 3;grid-row:2}}
.rig-film-active .project-entry--bridge-fallback{display:none}
@media(min-width:901px){.film-grid>.project-entry.film-landscape{grid-column:span 9}.film-grid>.project-entry.film-portrait{grid-column:span 3}.film-grid>.project-entry.film-wide-last,.film-grid>.project-entry--bridge-fallback{grid-column:1/-1}}

/* Manual quality choice; native playback controls stay inside the video. */
.film-quality{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 20px;background:#141210;color:#c0b8b2;font:11px 'IBM Plex Mono',monospace}
.film-quality[hidden]{display:none}.film-quality label{font-size:11px;font-weight:400}.film-quality select{display:block;width:auto;max-width:100%;min-height:40px;margin:0;padding:8px 30px 8px 12px;border:1px solid #504740;background:#1b1816;color:#f0eeed;font:inherit;border-radius:2px}.film-quality-status{flex-basis:100%;font-size:11px;line-height:1.6}.film-quality-status[hidden]{display:none}
@media(max-width:650px){.film-quality select{font-size:16px}.film-quality{padding:10px 16px}}

.film-original{display:block;width:fit-content;max-width:100%;min-height:44px;padding:12px 0;margin:4px 0 12px;line-height:1.6}.film-original:hover{text-decoration:underline}

@media(max-width:750px){.project-entry.film-portrait>.project-detail-link{margin-inline:auto;text-align:center}}

/* A compact category row keeps the larger collection easy to browse. */
.work-filters{display:flex;flex-wrap:wrap;gap:8px;margin:-12px 0 30px}.work-filters button{min-height:44px;padding:10px 15px;border:1px solid #554146;background:transparent;color:#c8b8b9;font:10px var(--typeface),monospace;cursor:pointer}.work-filters button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.work-filters button:hover{border-color:var(--accent-soft);color:var(--accent-ink)}.work-filters button:focus-visible{outline:2px solid var(--accent-soft);outline-offset:3px}.film-filter-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.film-grid>.project-entry[hidden]{display:none!important}.work[data-film-filter=multicam] .project-entry--bridge-fallback{display:block}
@media(min-width:901px){.film-grid>.project-entry.film-landscape{grid-column:span 6}.film-grid>.project-entry.film-feature{grid-column:span 9}.film-grid>.project-entry.film-portrait{grid-column:span 3}.film-grid>.project-entry.film-wide-last,.film-grid>.project-entry--bridge-fallback{grid-column:1/-1}.film-grid>.project-entry.film-row-reverse-wide{grid-column:4/-1;grid-row:2}.film-grid>.project-entry.film-row-reverse-portrait{grid-column:1/span 3;grid-row:2}.work:not([data-film-filter=all]) .film-grid>.project-entry{grid-column:span 6;grid-row:auto}.work:not([data-film-filter=all]) .film-grid>.film-portrait{width:min(100%,340px);justify-self:center}}
@media(max-width:900px){.work-filters{margin:0 0 28px;gap:7px}.work-filters button{padding-inline:12px;font-size:10px}}

/* Give reference metadata a clear rhythm, without repeated stacked labels. */
.project-entry--dgb .project-caption{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:10px 24px;margin-top:20px}
.project-entry--dgb .project-caption h3{line-height:1.5}.film-grid .project-entry--dgb .project-caption>span{margin:0;font-size:11px;line-height:1.7;letter-spacing:0;color:#b7acad;text-align:left}
.project-entry--dgb>.project-detail-link{margin-top:6px;padding-top:12px;line-height:1.6}
#project-dialog .project-dialog-copy{display:flex;flex-direction:column;align-items:stretch;gap:12px}
#project-dialog .project-dialog-copy>:is(h2,p,.film-event,.film-author,.dialog-eyebrow){margin:0;line-height:1.7}
#project-dialog .project-dialog-copy h2{margin:0 0 4px;line-height:1.3;text-wrap:balance}
#project-dialog .project-dialog-copy .dialog-eyebrow{font-size:10px;letter-spacing:.03em}
#project-dialog .project-dialog-copy>.text-link{align-self:flex-start;margin-top:8px;min-height:44px;display:inline-flex;align-items:center}
@media(max-width:650px){.project-entry--dgb .project-caption{display:block}.film-grid .project-entry--dgb .project-caption>span{display:block;margin-top:9px}#project-dialog .project-dialog-copy{padding:26px 22px 28px;gap:14px}}
/* Preview sound is an overlay control, never an unstyled block in the caption. */
.project-entry{position:relative}
.preview-audio{--preview-audio-opacity:.62;position:absolute;z-index:4;top:12px;right:12px;width:44px;height:44px;min-width:44px;min-height:44px;padding:15px;display:grid;place-items:center;background:transparent;color:#c3b6b9;border:0;border-radius:0;clip-path:none;isolation:isolate;opacity:var(--preview-audio-opacity);transition:opacity .18s ease,color .18s ease}
.preview-audio::before{content:"";position:absolute;inset:7px;z-index:-1;background:rgba(10,9,9,.48);border:1px solid #8b626633;clip-path:polygon(4px 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%,0 4px);pointer-events:none;transition:background-color .18s ease,border-color .18s ease}
.preview-audio svg{display:block;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.preview-audio[aria-pressed=false] .audio-wave,.preview-audio[aria-pressed=true] .audio-slash{display:none}
.preview-audio[aria-pressed=true]{--preview-audio-opacity:.9;color:var(--accent-ink)}
.preview-audio[aria-pressed=true]::before{background:var(--accent);border-color:var(--accent-line)}
.preview-audio:is(:hover,:focus-visible){--preview-audio-opacity:1;color:var(--accent-ink)}
.preview-audio:focus-visible{outline:2px solid var(--accent-soft);outline-offset:-4px}
.preview-audio--bridge{top:24px;right:24px}
.rig-film .preview-audio--bridge{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,background-color .18s ease,color .18s ease}
.rig-film[data-audio-ready="true"] .preview-audio--bridge{opacity:var(--preview-audio-opacity);visibility:visible;pointer-events:auto}
@media(prefers-reduced-motion:reduce){.preview-audio,.preview-audio::before{transition:none}}

/* Mixed editorial sizes; measured rows pack the complete original formats. */
@media(min-width:751px){
 #work .film-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:row dense;gap:0 24px;align-items:start}
 #work .film-grid.is-packed{grid-auto-rows:1px;row-gap:0}
 #work .film-grid>.project-entry{--work-offset:0px;width:100%;max-width:none;grid-column:span 1;grid-row:auto;align-self:start;margin:0;padding:var(--work-offset) 0 28px;min-width:0}
 #work .film-grid>.project-entry.film-landscape{grid-column:span 2}
 #work .film-grid>.project-entry.film-landscape:nth-of-type(3n){grid-column:span 1}
 #work .film-grid .project-media{aspect-ratio:16/9;height:auto;max-height:none}
 #work .film-grid .film-portrait .project-media{aspect-ratio:512/910;max-height:none}
 #work .film-grid .project-caption{margin-top:12px}
 #work .film-grid .preview-audio{top:calc(12px + var(--work-offset,0px))}
 #work[data-film-filter="teaser"] .film-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px;margin-inline:auto}
 #work[data-film-filter="teaser"] .film-grid>.project-entry{grid-column:span 1}
}
@media(min-width:751px) and (max-width:1000px){#work .film-grid{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:20px}}
@media(max-width:750px){
 #work .film-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense;gap:26px 14px;align-items:start}
 #work .film-grid>.project-entry{width:100%;max-width:none;margin:0;grid-column:span 2;grid-row:auto;justify-self:stretch}
 #work .film-grid>.project-entry.film-portrait{grid-column:span 1;width:100%;margin-inline:0}
 #work .film-grid>.project-entry.film-portrait:nth-of-type(even){margin-top:12px}
 #work .film-grid .film-portrait .project-media{aspect-ratio:512/910;max-height:none}
 #work .film-grid .project-caption{margin-top:12px}
 #work .film-grid>.project-entry.film-portrait.is-mobile-solo{grid-column:1/-1;width:min(100%,320px);justify-self:center;margin:0 auto}
}
@media(max-width:360px){
 #work .film-grid{grid-template-columns:1fr;gap:28px}
 #work .film-grid>.project-entry,#work .film-grid>.project-entry.film-portrait{grid-column:1;max-width:100%;margin:0}
 #work .film-grid>.project-entry.film-portrait{width:min(100%,260px);justify-self:center}
}