.direction-bar{position:absolute;z-index:5;top:100px;left:6vw;right:6vw;display:flex;justify-content:space-between;gap:20px;font:11px/1.5 monospace;letter-spacing:.1em;color:var(--body-text)}.direction-bar a{text-underline-offset:5px}.viewfinder{position:absolute;inset:155px 4vw 55px;pointer-events:none;color:var(--text);opacity:.48;z-index:2;border:1px solid color-mix(in srgb,currentColor 22%,transparent)}.finder-corner{position:absolute;inset:-1px;border:12px solid transparent;border-image:linear-gradient(135deg,currentColor,transparent 14%,transparent 86%,currentColor) 12}.finder-caption,.finder-readout{position:absolute;font:10px/1.5 monospace;letter-spacing:.15em}.finder-caption{top:12px;left:16px}.finder-readout{bottom:12px;right:16px}.finder-focus{position:absolute;left:var(--focus-x,75%);top:var(--focus-y,40%);width:45px;height:45px;border:1px solid currentColor;transform:translate(-50%,-50%);transition:left .35s ease-out,top .35s ease-out;opacity:.45}.hero-copy{z-index:3}.hero-links a{transition:background .2s,color .2s,transform .2s}.hero-links a:hover{transform:translateY(-3px)}
.project-playground{margin:24px 0;border:1px solid var(--line);background:var(--page);overflow:hidden}.demo-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:12px;font:10px/1.5 monospace;color:var(--muted)}.demo-top output{color:var(--text)}.shot-stage{height:210px;overflow:hidden;position:relative;display:grid;place-items:center;background:var(--panel-alt)}.composition-lines{position:absolute;inset:0;background:linear-gradient(to right,transparent 33%,var(--line) 33%,var(--line) calc(33% + 1px),transparent calc(33% + 1px),transparent 66%,var(--line) 66%,var(--line) calc(66% + 1px),transparent calc(66% + 1px)),linear-gradient(to bottom,transparent 33%,var(--line) 33%,var(--line) calc(33% + 1px),transparent calc(33% + 1px),transparent 66%,var(--line) 66%,var(--line) calc(66% + 1px),transparent calc(66% + 1px));opacity:.35}.shot-subject{font:bold 44px/.9 Arial,sans-serif;letter-spacing:-.06em;color:var(--highlight);transition:transform .65s cubic-bezier(.2,.8,.2,1);transform:scale(.85)}[data-framing=medium] .shot-subject{transform:scale(1.45) translateX(12%)}[data-framing=close] .shot-subject{transform:scale(2.65) translateX(16%)}.shot-marker{position:absolute;bottom:10px;left:12px;font:9px/1.3 monospace;color:var(--muted);background:var(--panel-alt)}.demo-tabs{display:flex;border-top:1px solid var(--line)}.demo-tabs button{flex:1;min-height:44px;background:transparent;color:var(--body-text);border:0;padding:10px 8px;cursor:pointer;font:12px/1.4 monospace}.demo-tabs button:hover,.demo-tabs button[aria-pressed=true]{background:var(--control);color:var(--text)}.demo-tabs button:disabled{opacity:.55;cursor:default}.sample-table{height:210px;overflow:auto;padding:14px}.sample-table table{width:100%;border-collapse:collapse;font:13px/1.6 monospace;text-align:left}.sample-table td,.sample-table th{padding:9px 5px;border-bottom:1px solid var(--line);white-space:pre}.sample-table th{font-weight:400;color:var(--muted)}[data-cleaned=true] .sample-table td{color:var(--highlight)}.project-playground .recipe-note{font:10px/1.5 monospace;margin:0;padding:10px 12px;color:var(--muted)}.experience-reveal{opacity:0;transform:translateY(24px);transition:opacity .65s,transform .65s}.experience-visible{opacity:1;transform:none}
/* A separately addressable cinematic composition. */
.cinematic{--highlight:#eac28e;--panel:#201e1c;--panel-alt:#151514;--page:#101110;--text:#f3eee5;--body-text:#c5c0b7;--muted:#a8a399;--line:#48453f;--control:#302b23;background:var(--page);color:var(--text)}[data-theme=light] .cinematic{--highlight:#825320;--panel:#e8e5dd;--panel-alt:#f4f2ec;--page:#faf9f5;--text:#25251f;--body-text:#45443e;--muted:#67645c;--line:#b4afa3;--control:#e5dfd3}.cinematic .site-header{padding-inline:4vw;background:var(--page)}.cinematic .wordmark{letter-spacing:-.06em}.cinematic .opening{height:180svh}.cinematic .opening-stick{background:var(--page)}.cinematic .hero-image{inset:0 0 0 48%;opacity:.6;filter:grayscale(1)!important;transform:none!important;background-position:60% center}.cinematic .hero-shade{background:linear-gradient(90deg,var(--page) 30%,transparent 90%),linear-gradient(0deg,var(--page),transparent 60%)}.cinematic .hero-copy{left:7vw;right:5vw;bottom:14vh;color:var(--text)}.cinematic .hero-copy h1{font-size:clamp(4rem,10.4vw,10.5rem);line-height:.9;letter-spacing:-.085em;max-width:1100px}.cinematic .hero-copy h1 span{color:transparent;-webkit-text-stroke:1px var(--highlight);font-style:normal}.cinematic .hero-copy .micro{color:var(--highlight);margin-bottom:30px}.cinematic .hero-sub{max-width:480px}.cinematic .hero-sub>a{display:none}.cinematic .hero-sub p{font-size:17px;line-height:1.7}.cinematic .hero-links a{color:var(--text);border-color:var(--line);background:transparent}.cinematic .hero-links a:first-child{color:var(--page);background:var(--text)}.cinematic .hero-progress{color:var(--muted)}.cinematic .viewfinder{inset:155px 3vw 60px}.cinematic .hero-reveal span{color:var(--highlight)}.cinematic .statement{padding:120px 9vw;background:var(--page)}.cinematic .statement p{font-size:clamp(2rem,4vw,4.5rem);max-width:1000px;letter-spacing:-.045em}.cinematic .flagship-section{padding:100px 7vw;background:var(--panel-alt)}.cinematic .section-heading h2,.cinematic .work-intro h2{font-size:clamp(2.5rem,6vw,6rem);line-height:.95;letter-spacing:-.065em}.cinematic .flagship-grid{grid-template-columns:1fr;gap:0}.cinematic .flagship-grid>article{display:grid;grid-template-columns:1fr 1.15fr;column-gap:7vw;padding:65px 0;border:0;border-top:1px solid var(--line);background:transparent}.cinematic .flagship-grid>article>h3{font-size:clamp(3rem,5vw,5rem);letter-spacing:-.06em;grid-column:1}.cinematic .flagship-grid>article>p,.cinematic .flagship-grid>article>ul,.cinematic .flagship-links{grid-column:1}.cinematic .flagship-grid>article>.project-playground{grid-column:2;grid-row:1/6;margin:0;align-self:center;transform:rotate(-2deg);box-shadow:15px 25px 0 color-mix(in srgb,var(--highlight) 8%,transparent)}.cinematic .flagship-grid>article:nth-child(2)>.project-playground{transform:rotate(2deg)}.cinematic .shot-stage,.cinematic .sample-table{height:260px}.cinematic .lab-section{background:var(--page);padding-block:100px}.cinematic .lab-card{border-radius:0;background:var(--panel-alt)}.cinematic .mini-visual{filter:grayscale(.8)}.cinematic .about{padding-block:120px;background:var(--panel-alt)}.cinematic .about-copy h2{font-size:clamp(3rem,7vw,7rem);letter-spacing:-.06em}.cinematic .contact{padding-block:100px}.cinematic .contact h2{letter-spacing:-.065em}
@media(max-width:850px){.direction-bar{top:95px;font-size:9px;letter-spacing:0;left:5vw;right:5vw}.viewfinder{inset:140px 3vw 65px}.finder-focus{display:none}.cinematic .opening{height:150svh}.cinematic .hero-image{inset:0;opacity:.3}.cinematic .hero-copy h1{font-size:clamp(3rem,11.5vw,6rem)}.cinematic .hero-copy{bottom:14vh}.cinematic .hero-sub p{font-size:15px}.cinematic .hero-copy .micro{font-size:9px;max-width:260px}.cinematic .flagship-grid>article{display:flex;flex-direction:column;gap:15px;padding:40px 0}.cinematic .flagship-grid>article>.project-playground{width:100%;transform:none!important;box-shadow:none;order:1}.cinematic .statement,.cinematic .flagship-section,.cinematic .lab-section,.cinematic .about,.cinematic .contact{padding-block:65px}.cinematic .hero-links{display:flex;flex-wrap:wrap}.cinematic .hero-links a{font-size:10px;padding:12px}.demo-top{font-size:9px}}
@media(prefers-reduced-motion:reduce){.experience-reveal{opacity:1;transform:none}.experience-reveal,.shot-subject,.finder-focus,.hero-links a{transition:none}.cinematic .opening{height:auto;min-height:100svh}.cinematic .opening-stick{position:relative;min-height:100svh}}