:root{color-scheme:dark;--bg:#090a0b;--fg:#f0efea;--muted:#a0a1a2;--line:#ffffff24;--font:'DM Sans',Arial,sans-serif;--display:'Space Grotesk',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:16px;line-height:1.65}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #e7c5b4;outline-offset:6px}button{border:0}p,h1,h2,h3{margin:0}h1,h2,h3{font-family:var(--display);font-weight:500;line-height:1.07}button,a,summary{touch-action:manipulation}.wrap{width:min(1180px,calc(100% - 112px));margin-inline:auto}.soft{color:#848586}.header{height:88px;padding:0 48px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:#090a0bdc;backdrop-filter:blur(20px);z-index:20;border-bottom:1px solid #ffffff0b}.brand-crop{display:block;width:144px;height:42px;overflow:hidden;position:relative}.brand-crop img{position:absolute;width:190px;max-width:none;left:-20px;top:-34px}.header nav{display:flex;gap:34px}.header a{font-size:13px}.header nav a{color:#b7b8b9;transition:color .2s}.header nav a:hover,.header nav a.active{color:#fff}.nav-reel{border-bottom:1px solid #888;padding:5px 0}.nav-reel span{margin-left:16px}.hero{padding-top:76px;position:relative;isolation:isolate}.eyebrow,.section-label,.hero-line,.small-index,.tool-strip>span,.contribution>span,.job-date,.video-type,.poster-caption>span,.remake{font-size:10px;letter-spacing:2px;font-weight:500}.eyebrow{display:flex;align-items:center;gap:12px}.signal{width:6px;height:6px;border-radius:50%;background:#e0b39d;box-shadow:0 0 16px #df9b6a}.slash{color:#595a5c;margin:0 8px}h1{font-size:clamp(58px,7.7vw,108px);letter-spacing:-6px;margin:40px 0 35px;line-height:1.01}.period{color:#d2a58e}.hero-bottom{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:54px}.role{font-size:19px;margin-bottom:8px}.intro{font-size:15px;color:#a9aaad;line-height:1.75}.round-link{display:flex;align-items:center;gap:18px;font-size:14px}.circle{width:51px;height:51px;border:1px solid #ffffff50;border-radius:50%;display:grid;place-items:center;font-size:25px;transition:background .25s,transform .25s}.round-link:hover .circle{background:#efeee8;color:#111;transform:rotate(45deg)}.hero-line{border-top:1px solid var(--line);display:flex;gap:40px;padding:22px 0;color:#8c8e91;font-size:9px;letter-spacing:1.5px}.scroll-hint{margin-left:auto}.contours{position:absolute;right:-20px;top:75px;width:440px;height:500px;z-index:-1;opacity:.25;background:repeating-radial-gradient(ellipse at 85% 48%,transparent 0 25px,#8f776634 26px 27px,transparent 28px 44px);mask-image:linear-gradient(90deg,transparent,black);transform:rotate(-15deg)}.reel-section{padding-top:75px;padding-bottom:120px}.section-label{display:flex;justify-content:space-between;color:#919294;padding-bottom:23px;border-bottom:1px solid var(--line);font-size:9px}.heading-row{display:flex;align-items:flex-end;justify-content:space-between;margin:38px 0 36px;gap:24px}h2{font-size:clamp(33px,4vw,52px);letter-spacing:-1.8px}.heading-row>p{font-size:13px;color:#939498}.video{aspect-ratio:16/9;position:relative;background:#121314;overflow:hidden;border:1px solid #ffffff1e}.poster{width:100%;height:100%;display:block;background:transparent;position:relative;padding:0;overflow:hidden;text-align:left}.thumbnail{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s,opacity .8s;opacity:.83}.thumbnail[hidden]{display:none}.poster:hover .thumbnail{transform:scale(1.025);opacity:1}.poster-shade{position:absolute;inset:0;background:linear-gradient(0deg,#000b,transparent 60%)}.play-disc{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;border:1px solid #ffffff85;background:#1115;backdrop-filter:blur(10px);border-radius:50%;display:grid;place-items:center;padding-left:4px;font-size:19px;transition:background .25s,scale .25s}.poster:hover .play-disc{background:#f1eee9;color:#171719;scale:1.06}.poster-caption{position:absolute;bottom:30px;left:32px;right:32px;display:flex;align-items:center;justify-content:space-between;gap:15px}.poster-caption strong{font-weight:500;font-size:19px}.poster-caption>span{font-size:9px;color:#d5d5d5}.video iframe,#dialog-player iframe{width:100%;height:100%;border:0;position:absolute;inset:0}.media-footer{display:flex;justify-content:space-between;gap:20px;color:#919294;font-size:11px;padding:15px 0}.media-footer>div{display:flex;gap:25px}.media-footer button,.media-footer a{background:none;padding:0;font-size:11px;color:#c6c6c7}.media-footer a:hover,.media-footer button:hover{color:white}.work-section{overflow:hidden}.project{position:relative;isolation:isolate;--accent:#d7a191;--glow:#972d25}.project-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 85% 35%,color-mix(in srgb,var(--glow) 19%,transparent),transparent 65%);opacity:.45;transition:opacity 1.8s}.project.lit .project-glow{opacity:1}.project-inner{padding-top:80px;padding-bottom:85px}.project-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px}.project-heading h2{font-size:clamp(44px,6vw,78px);letter-spacing:-3px;margin-top:16px}.roman{font-family:Georgia,serif;color:#b88e7e}.accent{color:var(--accent)}.project-role{font-size:13px;text-align:right;line-height:1.9}.project-role>span{font-size:11px;color:#97989b}.project-description{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;margin:36px 0 40px}.project-description>p{font-size:22px;line-height:1.45;color:#cecece}.project-description>div>p{color:#a1a2a6;font-size:14px}.tags{display:flex;flex-wrap:wrap;gap:18px;margin-top:23px;color:var(--accent);font-size:10px}.video-controls{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.tabs{display:flex;gap:6px;border:1px solid var(--line);padding:4px;border-radius:4px}.tabs button{background:none;font-size:12px;padding:10px 18px;border-radius:2px;color:#999}.tabs button[aria-pressed=true]{background:#ece9e2;color:#111}.video-type{color:#959598;font-size:9px}.fallback-art{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding-left:12%;font-family:Georgia,serif;font-size:clamp(35px,7vw,90px);line-height:.85;letter-spacing:-4px;color:#ebded2;background:radial-gradient(ellipse at 85% 50%,#653329,#151114 65%)}.fallback-art i{position:absolute;right:15%;font-size:2.2em;font-style:normal;color:#8f3f35}.contribution{margin-top:24px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:25px}.contribution>span{font-size:9px;color:var(--accent);white-space:nowrap}.contribution p{font-size:11px;color:#a6a7aa}.contribution b{font-weight:400;color:#4e5152;margin:0 10px}.shock{--accent:#93cfc2;--glow:#147c68}.shock .project-glow{background:radial-gradient(ellipse at 10% 45%,#16786422,transparent 65%)}.shock-title{font-family:var(--display);background:radial-gradient(ellipse at 80% 45%,#124f43,#0d1618 65%);color:#accac2}.remake{color:#8a9995;margin-top:9px}.about{padding-top:90px;padding-bottom:100px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:85px;margin-top:45px}.about-grid h2{font-size:41px;line-height:1.22}.about-grid p{font-size:14px;color:#a2a3a6;margin-bottom:19px}.about-grid .large-copy{font-size:21px;line-height:1.6;color:#e0dfda}.practice{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:50px}.practice>div{border-top:1px solid var(--line);padding-top:18px}.small-index{color:#777}.practice h3{font-size:25px;margin:23px 0 15px}.practice p{font-size:13px;color:#9c9da0}.tool-strip{border-block:1px solid var(--line);padding:24px 0;display:flex;align-items:center;gap:60px;margin-top:45px}.tool-strip>span{color:#8d8e90;font-size:9px}.tool-strip p{font-size:15px}.tool-strip i{color:#58595c;font-style:normal;margin:0 20px}.experience{padding-bottom:90px}.experience .heading-row{margin-bottom:55px}.experience-list{border-top:1px solid var(--line)}.job{border-bottom:1px solid var(--line);padding:27px 0}.job:not(details),.job summary{display:grid;grid-template-columns:190px 1fr 100px;align-items:center;gap:20px}.job-date{font-size:9px;color:#8a8d8e;letter-spacing:1px}.job h3{font-size:22px;margin-bottom:7px;letter-spacing:-.4px}.job p{color:#9e9fa1;font-size:12px}.job a{font-size:11px;text-align:right}.job summary{cursor:pointer;list-style:none}.job summary::-webkit-details-marker,.education summary::-webkit-details-marker{display:none}.plus{justify-self:end;font-size:22px;font-weight:400}.job[open] .plus{transform:rotate(45deg)}.job-detail{margin:22px 120px 0 210px;color:#a7a8aa;font-size:13px;max-width:650px}.job-detail span{display:block;margin-top:12px;color:#7f8184;font-size:11px}.education{margin-top:35px;font-size:13px;color:#adaeb0}.education summary{list-style:none;display:flex;justify-content:space-between;cursor:pointer;padding:16px 0}.education>div{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding:25px 0}.education p{font-size:12px}.education strong{color:#d2d2d1;font-weight:500}footer{border-top:1px solid var(--line);padding:27px 0 40px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#999}footer i{font-style:normal;color:#4d5052;margin:0 14px}dialog{padding:0;width:min(1400px,94vw);max-width:none;border:1px solid #555;background:#101112;color:#eee;box-shadow:0 30px 100px #000b}dialog::backdrop{background:#000d;backdrop-filter:blur(12px)}.dialog-bar{padding:14px 20px;display:flex;justify-content:space-between;align-items:center;font-size:12px}.dialog-bar button{background:none;font-size:12px}#dialog-player{position:relative;aspect-ratio:16/9}.skip{position:fixed;left:15px;top:-100px;z-index:100;background:white;color:black;padding:12px}.skip:focus{top:10px}.reveal{transition:opacity .8s,transform .8s}.js-motion .reveal:not(.visible){opacity:0;transform:translateY(24px)}
@media(min-width:1600px){.wrap{width:min(1280px,calc(100% - 160px))}.hero{padding-top:105px}h1{font-size:122px}.hero-bottom{margin-bottom:70px}}
@media(max-width:800px){.wrap{width:calc(100% - 44px)}.header{height:74px;padding:0 22px}.header nav{gap:20px}.nav-reel{display:none}.brand-crop{width:115px}.brand-crop img{width:160px;top:-26px;left:-18px}.hero{padding-top:55px}h1{font-size:65px;letter-spacing:-3.5px}.hero-bottom{align-items:flex-start;gap:20px}.hero-line{gap:20px;font-size:8px}.scroll-hint{display:none}.contours{right:0;width:280px}.hero .eyebrow{font-size:8px;letter-spacing:1px}.reel-section{padding-top:50px;padding-bottom:75px}.heading-row{align-items:flex-start}.heading-row>p{max-width:150px;font-size:11px}.section-label{font-size:8px;letter-spacing:1.2px}.section-label>span:last-child{max-width:42%;text-align:right}.project-inner{padding-top:50px;padding-bottom:60px}.project-description{gap:30px;grid-template-columns:1fr 1.3fr}.project-description>p{font-size:19px}.project-description>div>p{font-size:13px}.project-role{font-size:11px}.project-role>span{font-size:9px}.project-heading h2{font-size:49px;letter-spacing:-2px}.poster-caption{bottom:20px;left:20px;right:20px}.poster-caption strong{font-size:15px}.poster-caption>span{display:none}.contribution{display:block}.contribution p{margin-top:10px}.about-grid{gap:30px}.about-grid h2{font-size:33px}.practice{gap:25px}.tool-strip{gap:25px}.tool-strip p{font-size:12px}.tool-strip i{margin:0 8px}.job:not(details),.job summary{grid-template-columns:115px 1fr 75px;gap:12px}.job h3{font-size:19px}.job-detail{margin-left:127px;margin-right:20px}.education>div{grid-template-columns:1fr}}
@media(max-width:520px){h1{font-size:clamp(43px,11vw,58px);letter-spacing:-2.6px}.hero-bottom{flex-direction:column;gap:26px}.round-link{gap:12px}.circle{width:40px;height:40px;font-size:20px}.intro{font-size:14px}.hero-line{justify-content:space-between;gap:7px;letter-spacing:.5px}.header nav{gap:16px}.header nav a{font-size:11px}.brand-crop{width:100px}.heading-row{display:block}.heading-row>p{margin-top:15px;max-width:none}.project-heading{display:block}.project-role{text-align:left;margin-top:18px}.project-heading h2{font-size:47px}.project-description{grid-template-columns:1fr;gap:20px;margin:24px 0}.project-description>p br{display:none}.project-description>p{font-size:20px}.video-type{display:none}.tabs{width:100%}.tabs button{flex:1;font-size:11px;padding-inline:8px}.play-disc{width:55px;height:55px;font-size:15px}.poster-caption{bottom:13px;left:13px}.poster-caption strong{font-size:12px}.media-footer{font-size:9px;flex-wrap:wrap;gap:7px}.media-footer>div{gap:20px}.media-footer button,.media-footer a{font-size:10px}.contribution b{margin:0 5px}.about{padding-top:50px;padding-bottom:65px}.about-grid{grid-template-columns:1fr;gap:25px}.about-grid h2{font-size:35px}.practice{grid-template-columns:1fr;gap:25px;margin-top:25px}.practice>div{display:grid;grid-template-columns:30px 90px 1fr;gap:10px}.practice h3{margin:0;font-size:20px}.practice p{font-size:12px}.tool-strip{display:block}.tool-strip p{margin-top:10px}.job:not(details),.job summary{grid-template-columns:1fr 70px}.job-date{grid-column:1 / -1}.job h3{font-size:20px}.job p{font-size:11px}.job-detail{margin:20px 0 0}.experience{padding-bottom:50px}footer{font-size:8px}.dialog-bar{padding:12px;font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.js-motion .reveal:not(.visible){opacity:1;transform:none}}

/* Revision 2: personal introduction, studio credits, and readable type. */
.brand-crop{mix-blend-mode:screen}
.hero-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:64px;align-items:center;margin:42px 0 52px}
.hero-copy h1{font-size:clamp(39px,4.15vw,61px);line-height:1.12;letter-spacing:-2.4px;margin:0 0 29px}
.hero-copy .role{font-size:20px;margin-bottom:15px}
.hero-copy .intro{font-size:17px;line-height:1.8;max-width:580px}
.hero-copy .round-link{margin-top:30px;font-size:16px;width:fit-content}
.hero-portrait{margin:0;width:100%;max-width:410px;justify-self:end}
.portrait-window{position:relative;overflow:hidden;aspect-ratio:459/689;background:#191415}
.portrait-window img{position:absolute;width:446.1874%;max-width:none;height:auto;left:-113.0719%;top:-24.5283%}
.hero-portrait figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:15px;font-size:11px;letter-spacing:1px;color:#b5b5b6}
.hero-portrait figcaption span{color:#939598}
.studios{padding:32px 0 54px;border-bottom:1px solid var(--line)}
.studios h2{font-family:var(--font);font-size:14px;letter-spacing:1px;line-height:1.5;font-weight:400;color:#b4b5b7;margin-bottom:25px}
.studio-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.studio-list a{display:flex;flex-direction:column;align-items:flex-start;padding:12px 0;transition:transform .25s}
.studio-list a:hover{transform:translateY(-4px)}
.studio-list strong{font-family:var(--display);font-size:24px;font-weight:500;letter-spacing:-.7px;line-height:1.3;margin-bottom:13px}
.studio-list span{font-size:14px;color:#c1c2c3;line-height:1.65}
.studio-list small{font-size:13px;color:#999b9e;margin-top:5px;line-height:1.65}
.header a{font-size:15px}.header nav{gap:32px}
.eyebrow,.section-label,.hero-line,.small-index,.tool-strip>span,.contribution>span,.job-date,.video-type,.poster-caption>span,.remake{font-size:12px;letter-spacing:1.2px}
.hero-line{gap:25px}.heading-row>p{font-size:16px}
.project-role{font-size:16px}.project-role>span{font-size:14px}
.project-description>div>p{font-size:17px;line-height:1.8}
.tags{font-size:14px;gap:18px}.tabs button{font-size:15px;padding:12px 20px}
.media-footer,.media-footer button,.media-footer a{font-size:14px}
.contribution p{font-size:14px;line-height:1.8}.contribution{align-items:baseline}
.about-grid p{font-size:17px;line-height:1.8}.about-grid .large-copy{font-size:23px}
.practice p{font-size:16px;line-height:1.8}.tool-strip p{font-size:17px}
.job p{font-size:16px}.job a{font-size:14px}.job-detail{font-size:16px;line-height:1.8}.job-detail span{font-size:14px}
.education{font-size:16px}.education p{font-size:15px;line-height:1.8}
footer{font-size:12px}.dialog-bar,.dialog-bar button{font-size:15px}
@media(min-width:1600px){.hero{padding-top:70px}.hero-copy h1{font-size:66px}.hero-portrait{max-width:430px}}
@media(max-width:1000px){.hero-layout{gap:35px}.hero-copy h1{font-size:42px;letter-spacing:-1.7px}.hero-copy .role{font-size:18px}.hero-copy .intro{font-size:16px}.hero-portrait figcaption{display:block}.hero-portrait figcaption span{display:block;margin-top:4px}.studio-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 35px}.hero-line{flex-wrap:wrap}.contribution{display:block}.contribution p{margin-top:10px}.tool-strip i{margin:0 9px}}
@media(max-width:700px){.hero-layout{grid-template-columns:1fr;gap:35px}.hero-copy h1{font-size:clamp(36px,6.8vw,48px)}.hero-portrait{max-width:340px;justify-self:start}.portrait-window{aspect-ratio:459/580}.portrait-window img{top:-29.1379%}.hero-copy .intro{max-width:600px}.hero-line{font-size:11px;gap:15px}.hero .eyebrow{font-size:11px;letter-spacing:.7px}.project-heading{display:block}.project-role{text-align:left;margin-top:20px}.project-description{grid-template-columns:1fr;gap:20px}.about-grid{grid-template-columns:1fr}.practice{grid-template-columns:1fr}.practice>div{display:block}.practice h3{margin:15px 0}.job:not(details),.job summary{grid-template-columns:1fr 80px}.job-date{grid-column:1/-1}.job-detail{margin:20px 0 0}.tool-strip{display:block}.tool-strip p{margin-top:12px}.section-label{font-size:11px}.section-label>span:last-child{max-width:45%}}
@media(max-width:520px){.header nav a{font-size:14px}.header nav{gap:14px}.brand-crop{width:92px}.hero{padding-top:38px}.hero-layout{margin-top:28px}.hero-copy .role{font-size:17px}.hero-line{font-size:10px;letter-spacing:.5px}.hero-portrait figcaption{font-size:12px}.studio-list{gap:20px}.studio-list strong{font-size:22px}.studio-list span{font-size:14px}.studio-list small{font-size:13px}.heading-row>p{font-size:15px}.project-description>div>p{font-size:16px}.tabs button{font-size:14px;padding-inline:8px}.media-footer,.media-footer button,.media-footer a{font-size:13px}.poster-caption strong{font-size:15px}.job p{font-size:15px}.job a{font-size:13px}.education p{font-size:15px}footer{font-size:11px;gap:20px;letter-spacing:.4px}.dialog-bar,.dialog-bar button{font-size:13px}}

/* Review notes: cleaner opening, official marks, and scroll-led atmosphere. */
.hero-layout{margin-top:0}.hero-copy .role{font-size:25px;line-height:1.4}
.project-heading .eyebrow{font-size:19px;letter-spacing:1.5px}
.remake-title{font-size:.68em;color:#b9ccc6;letter-spacing:-1px}
.studio-logo{height:94px;width:100%;display:flex;align-items:center;margin-bottom:22px}
.studio-logo img{width:160px;height:94px;object-fit:contain;object-position:left center}
.studio-logo img[hidden]{display:none}
.cold-logo img{width:76px;height:76px}
.nightdive-logo img{width:168px}
.pcf-logo img{filter:invert(1);width:180px}
.bullets-logo img{width:92px}
.reel-section{position:relative;isolation:isolate}
#reel .heading-row>p{max-width:430px;text-align:right}
.scroll-scene{position:absolute;inset:0;pointer-events:none;z-index:-1;overflow:hidden;contain:paint;--scroll-shift:0px;--scroll-drift:0px;--scroll-turn:0deg;mask-image:linear-gradient(transparent,#000 12%,#000 87%,transparent)}
.scene-layer{position:absolute;inset:-140px -80px;transform:translate3d(0,var(--scroll-shift),0);will-change:transform}
.audio-scene{left:calc((100% - 100vw)/2);right:calc((100% - 100vw)/2)}
.contour-layer{background:repeating-radial-gradient(ellipse at 92% 43%,transparent 0 28px,#b39c7e26 29px 30px,transparent 31px 53px);opacity:.62;mask-image:linear-gradient(90deg,transparent 15%,#000 85%);transform:translate3d(var(--scroll-drift),var(--scroll-shift),0) rotate(var(--scroll-turn))}
.audio-light{background:radial-gradient(ellipse at 4% 55%,#5a51452e,transparent 60%);transform:translate3d(0,calc(var(--scroll-shift) * -0.6),0)}
.shell-light{background:radial-gradient(ellipse at 88% 37%,#b4322b42,transparent 54%),radial-gradient(ellipse at 2% 65%,#ddd0bb1f,transparent 40%)}
.shell-strata{background:linear-gradient(116deg,transparent 15%,#c5b6a414 15.3%,transparent 15.8%,transparent 31%,#e8dcc518 31.3%,transparent 32%,transparent 80%,#9e3a3030 80.3%,transparent 81%);transform:translate3d(var(--scroll-drift),calc(var(--scroll-shift) * -0.7),0)}
.shell-dust{background-image:radial-gradient(circle,#d6c1a957 0 1px,transparent 1.5px),radial-gradient(circle,#aa514042 0 1px,transparent 1.5px);background-size:113px 173px,199px 127px;background-position:0 0,43px 79px;opacity:.38;mask-image:linear-gradient(90deg,#000,transparent 30%,transparent 70%,#000);transform:translate3d(calc(var(--scroll-drift) * -.4),calc(var(--scroll-shift) * 1.4),0)}
.shock-grid{background-image:linear-gradient(#49bda51c 1px,transparent 1px),linear-gradient(90deg,#49bda51c 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(90deg,#000,transparent 28%,transparent 70%,#000);transform:translate3d(var(--scroll-drift),var(--scroll-shift),0)}
.shock-orbit{background:repeating-radial-gradient(ellipse at 8% 50%,transparent 0 70px,#4ac3a522 71px 72px,transparent 73px 110px),radial-gradient(ellipse at 8% 50%,#1599792b,transparent 57%);mask-image:linear-gradient(90deg,#000,transparent 60%);transform:translate3d(0,calc(var(--scroll-shift) * -.65),0)}
.shock-scan{background:linear-gradient(0deg,transparent 45%,#66dab50c 48%,#6aecc334 50%,#66dab50c 52%,transparent 55%);opacity:.65;transform:translate3d(0,calc(var(--scroll-shift) * 1.5),0)}
@media(max-width:700px){.hero-copy .role{font-size:23px}.project-heading .eyebrow{font-size:17px}.studio-logo{height:78px}.studio-logo img{max-width:100%;height:78px}.cold-logo img{width:65px;height:65px}.pcf-logo img{width:150px}.bullets-logo img{width:76px}#reel .heading-row>p{text-align:left}.scene-layer{opacity:.5}.shell-dust{opacity:.23}}
@media(prefers-reduced-motion:reduce){.scene-layer{transform:none!important;will-change:auto}}

/* Revision 4: centered studio marks and backgrounds grounded in each identity. */
.studio-list a{align-items:center;text-align:center}
.studio-logo{justify-content:center}
.studio-logo img{object-position:center}
#mortal-shell .poster{background:#161011}
.project .project-glow{opacity:.35}
.mortal-scene{mask-image:linear-gradient(transparent,#000 9%,#000 88%,transparent)}
.shell-ruins{background-image:linear-gradient(90deg,#090a0b33,#090a0b99 40%,#090a0b99 65%,#090a0b44),url('assets/ms2-atmosphere.webp');background-size:cover;background-position:center center;opacity:.85;transform:translate3d(0,var(--scroll-shift),0)}
.shell-mist{background:radial-gradient(ellipse at 88% 20%,#8c100c38,transparent 55%),radial-gradient(ellipse at 4% 60%,#dbd2bf20,transparent 42%);transform:translate3d(var(--scroll-drift),calc(var(--scroll-shift) * -.8),0)}
.shell-dust{opacity:.18}
.shodan-art{left:0;right:auto;width:min(48vw,700px);background-image:url('assets/shock-atmosphere.webp');background-size:auto 115%;background-repeat:no-repeat;background-position:left center;opacity:.48;mask-image:linear-gradient(90deg,#000 0%,#000 25%,transparent 98%);transform:translate3d(0,var(--scroll-shift),0)}
.circuit-traces{left:auto;right:-40px;width:min(43vw,650px);background:linear-gradient(90deg,#090a0b00,#091c171a),url('assets/circuit-traces.svg') right center/cover no-repeat;opacity:.45;mask-image:linear-gradient(90deg,transparent,#000 85%);transform:translate3d(var(--scroll-drift),calc(var(--scroll-shift) * -.7),0)}
.shock-scan{opacity:.3}
.logo-echo{inset:auto;width:clamp(350px,40vw,680px);height:650px;background:url('assets/erdeli-echo.svg') center/contain no-repeat;opacity:.16}
.echo-left{left:-170px;top:10%;transform:translate3d(var(--scroll-drift),var(--scroll-shift),0) rotate(-14deg);mask-image:linear-gradient(90deg,#000,transparent 95%)}
.echo-right{right:-170px;bottom:5%;transform:translate3d(calc(var(--scroll-drift) * -1),calc(var(--scroll-shift) * -.8),0) rotate(14deg);mask-image:linear-gradient(90deg,transparent 5%,#000)}
.audio-light{background:radial-gradient(ellipse at 0% 42%,#b5b4aa15,transparent 48%),radial-gradient(ellipse at 100% 65%,#a7a7a312,transparent 45%)}
@media(max-width:700px){.studio-logo{justify-content:center}.shell-ruins{opacity:.65;background-position:65% center}.shodan-art{width:65vw;opacity:.3}.circuit-traces{width:55vw;opacity:.3}.logo-echo{width:400px;opacity:.12}.echo-left{left:-220px}.echo-right{right:-220px}}

/* Revision 5: clearer labels, tool identities, and SHODAN cable pulses. */
.studios h2{font-family:var(--display);font-size:28px;line-height:1.25;letter-spacing:-.5px;color:#e5e4df;margin-bottom:32px}
.project-role{font-size:22px;line-height:1.6}.project-role>span{font-size:17px;color:#b1b3b6}
.tool-strip{gap:40px;padding:30px 0}.tool-strip>span{font-size:14px;white-space:nowrap}
.tool-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:35px;flex:1}
.tool-logos a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;font-size:16px;text-align:center;transition:color .2s}
.tool-logos img{display:block;width:80px;height:72px;object-fit:contain}
.tool-logos .wwise-tool{width:110px}.tool-logos .waveweaver-tool{width:66px;height:72px;object-fit:contain}.tool-logos .reaper-tool{width:76px;mix-blend-mode:screen}
.tool-logos a:hover{color:#9fd4c5}
.tool-logos .unreal-tool{filter:invert(1)}
.tool-logos .wwise-tool{filter:brightness(0) invert(1)}
.glow-cables{position:absolute;top:0;height:100%;width:clamp(180px,27vw,460px);overflow:visible;fill:none;pointer-events:none;mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent)}
.cables-left{left:-45px;transform:translate3d(0,calc(var(--scroll-shift) * .45),0)}
.cables-right{right:-45px;transform:translate3d(0,calc(var(--scroll-shift) * -.45),0) scaleX(-1)}
.cable-bases{stroke:#327d69;stroke-width:2;opacity:.28}
.cable-pulses{stroke:#84ffd1;stroke-width:2.5;stroke-linecap:round;filter:drop-shadow(0 0 4px #3eedb8) drop-shadow(0 0 10px #2cd79d);opacity:.7}
.cable-pulses path{stroke-dasharray:28 972;animation:cable-flow var(--pulse-time,14s) linear infinite;animation-delay:var(--pulse-delay,0s);animation-play-state:paused}
.shock.cables-active .cable-pulses path{animation-play-state:running}
@keyframes cable-flow{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
@media(max-width:800px){.project-role{font-size:20px}.project-role>span{font-size:16px}.tool-strip{display:block}.tool-logos{margin-top:25px;gap:20px}.studios h2{font-size:26px}.glow-cables{width:23vw}.cable-pulses{opacity:.5}}
@media(max-width:520px){.studios h2{font-size:25px}.tool-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 20px}.tool-logos a{font-size:15px}.glow-cables{width:28vw}.cable-pulses{opacity:.4}}
@media(prefers-reduced-motion:reduce){.glow-cables{transform:none!important}.cable-pulses path{animation:none!important;stroke-dasharray:none}.cable-pulses{opacity:.12;filter:none}}

/* Original artwork, seamless portrait, and Mortal Shell atmosphere. */
.brand-crop{width:144px;height:42px;mix-blend-mode:normal;background:none;overflow:visible}
.brand-crop img{position:static;display:block;width:100%;height:100%;object-fit:contain;max-width:100%;filter:none}
.hero-portrait{max-width:none;width:145%;margin-right:-13%;position:relative;pointer-events:none}
.portrait-window{aspect-ratio:1.2;background:transparent;overflow:visible;mask-image:radial-gradient(ellipse at 54% 49%,#000 33%,#000b 57%,transparent 76%)}
.portrait-window img{position:static;width:100%;height:100%;max-width:100%;object-fit:cover;object-position:57% center}
.hero-copy{position:relative;z-index:1}.hero{overflow:clip}
.project-heading a{color:inherit;text-decoration:none}.project-heading a:hover{color:#fff}.project-heading a:focus-visible{outline:2px solid currentColor;outline-offset:8px}
.ms2-heading img{display:block;width:370px;max-width:100%;height:100px;object-fit:contain;object-position:left center}
.steam-caption{display:block;font-family:var(--body,Arial,sans-serif);font-size:14px;line-height:1.5;font-weight:400;letter-spacing:.5px;margin-top:12px;color:#b9b6af}
.tool-logos .unreal-tool,.tool-logos .wwise-tool{filter:none}.tool-logos .unreal-tool{width:78px;height:78px}
.tool-logos .wwise-tool{width:120px;height:78px}
.tool-logos .waveweaver-tool{width:160px;height:78px;object-fit:cover;object-position:center 48%;clip-path:inset(0)}
.reaper-crop{display:block;position:relative;width:104px;height:90px;overflow:hidden;mix-blend-mode:screen}
.tool-logos .reaper-tool{position:absolute;width:120px;height:auto;max-width:none;left:-8px;top:-4px;object-fit:initial}
.shell-breath{position:absolute;inset:-10%;background:radial-gradient(ellipse at 91% 45%,#b31b134d,transparent 34%),radial-gradient(ellipse at 8% 73%,#ead8b51c,transparent 32%);animation:shell-breath 11s ease-in-out infinite alternate paused;transform:translateY(var(--scroll-shift))}
.shell-embers{position:absolute;inset:0;transform:translateY(calc(var(--scroll-shift) * -1.2))}
.shell-embers i{position:absolute;left:var(--x);bottom:2%;width:2px;height:5px;border-radius:50%;background:#edc6a4;box-shadow:0 0 7px 2px #c74223;opacity:0;animation:shell-rise var(--duration) linear infinite paused;animation-delay:var(--delay)}
.mortal.cables-active .shell-embers i,.mortal.cables-active .shell-breath{animation-play-state:running}
@keyframes shell-rise{0%{transform:translate(0,0) rotate(-20deg);opacity:0}15%{opacity:.55}75%{opacity:.3}100%{transform:translate(36px,-1000px) rotate(45deg);opacity:0}}
@keyframes shell-breath{from{opacity:.35}to{opacity:.9}}
@media(max-width:700px){.brand-crop{width:100px}.hero-portrait{width:115%;max-width:520px;margin:0 -7.5%;justify-self:center}.portrait-window{aspect-ratio:1.2}.ms2-heading img{width:300px;height:85px}.shell-embers i:nth-child(even){display:none}}
@media(prefers-reduced-motion:reduce){.shell-breath,.shell-embers i{animation:none!important}.shell-breath,.shell-embers{transform:none!important}.shell-breath{opacity:.5}}

.ms2-heading img{height:auto;width:370px}.tool-logos .waveweaver-tool{filter:brightness(1.35)}
@media(max-width:700px){.ms2-heading img{width:300px;height:auto}}

/* Revision 7: restrained hero, irregular photographic edge and ash-covered vista. */
.brand-lockup{display:flex;align-items:center;gap:12px;color:var(--fg)}
.brand-lockup svg{width:24px;height:34px;flex:none}.brand-lockup>span{font-family:var(--display);font-size:25px;font-weight:500;letter-spacing:2px;line-height:1}
.hero-copy h1{font-size:clamp(37px,3.15vw,53px);line-height:1.15;letter-spacing:-1.9px;text-wrap:balance}
.hero-portrait{width:175%;margin-right:-22%;max-width:none}.portrait-window{aspect-ratio:1.25;mask-image:url('assets/portrait-edge.svg');mask-size:100% 100%;mask-repeat:no-repeat}
.portrait-window img{object-fit:cover;object-position:55% center}.hero-layout{position:relative}.hero-copy{z-index:2}.hero{overflow:visible}
.ms2-heading{white-space:nowrap}.roman-mark{display:inline-block;width:.75em;height:1.14em;vertical-align:-.18em;color:#b41f28;margin-left:.05em;overflow:visible}
.shell-ruins{inset:-170px -70px;background-image:linear-gradient(180deg,#090a0b55,#090a0b77 35%,#090a0bbb 80%),url('assets/ms2-vista.png');background-position:center 25%;background-size:cover;opacity:.82;transform:translate3d(calc(var(--scroll-drift) * -.5),calc(var(--scroll-shift) * 1.5),0)}
.mortal .project-glow{display:none}.shell-mist{background:radial-gradient(ellipse at 70% 20%,#c3d2da28,transparent 55%),radial-gradient(ellipse at 10% 60%,#a4b2b41a,transparent 40%)}
.shell-breath{background:radial-gradient(ellipse at 80% 24%,#bdcbdc35,transparent 46%),radial-gradient(ellipse at 3% 50%,#adc0c921,transparent 40%)}
.shell-dust{opacity:.3}.shell-embers i{background:#e5e4df;box-shadow:0 0 3px #b5bfc1;width:3px;height:3px}.shell-embers i:nth-child(3n){width:2px;height:4px;background:#8d969d}
.tool-logos a{transition:transform .25s ease,color .25s ease}.tool-logos a:hover,.tool-logos a:focus-visible{transform:translateY(-4px)}
@media(max-width:1000px){.hero-copy h1{font-size:40px}.hero-portrait{width:155%;margin-right:-16%}}
@media(max-width:700px){.hero-copy h1{font-size:clamp(32px,6.3vw,43px);letter-spacing:-1.3px}.hero-portrait{width:125%;max-width:620px;margin:-25px -12.5% 0}.brand-lockup{gap:8px}.brand-lockup>span{font-size:20px;letter-spacing:1px}.brand-lockup svg{width:19px;height:28px}.ms2-heading{white-space:normal}.shell-ruins{background-position:60% center}}
@media(prefers-reduced-motion:reduce){.tool-logos a:hover,.tool-logos a:focus-visible{transform:none}.shell-ruins{transform:none!important}}

body{overflow-x:visible}.hero-copy .intro{max-width:660px}

/* Revision 8: direct introduction and official red/black project atmosphere. */
.brand-lockup>span{font-family:var(--font);font-weight:450;font-size:24px;letter-spacing:3px}
.hero-copy h1{font-family:var(--font);font-size:clamp(44px,4vw,64px);font-weight:550;line-height:1.08;letter-spacing:-2px;color:var(--fg);margin:0 0 14px;text-wrap:initial}
.hero-copy .role{font-size:24px;font-weight:450;line-height:1.4;color:var(--fg);margin:0 0 28px}
.hero-copy .intro{font-size:19px;line-height:1.7;color:#c6c7c8;max-width:520px;margin-bottom:30px}
.shell-ruins{inset:0;background:radial-gradient(ellipse at 83% 18%,#8a100c 0%,#4b0a09 40%,#190909 69%,#090a0b 90%);opacity:1;transform:none}
.shell-tree{inset:-80px 5% auto auto;width:70%;height:570px;background:url('assets/ms2-tree.webp') center top/contain no-repeat;filter:brightness(.2);opacity:.8;transform:translate3d(0,calc(var(--scroll-shift) * .6),0)}
.shell-figure{inset:70px -8% auto auto;width:56%;height:780px;background:url('assets/ms2-figure.webp') right top/contain no-repeat;filter:brightness(.22) sepia(.4);opacity:.65;transform:translate3d(0,calc(var(--scroll-shift) * -.7),0);mask-image:linear-gradient(#000 65%,transparent)}
.mortal-scene:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#090a0bd9 0%,#13080799 52%,#090a0b20),linear-gradient(0deg,#090a0b,transparent 45%);pointer-events:none}
.shell-mist{background:radial-gradient(ellipse at 90% 35%,#e8411c18,transparent 55%)}
.shell-breath{background:radial-gradient(ellipse at 95% 30%,#c6291929,transparent 55%);z-index:1}
.shell-embers{z-index:2}.shell-embers i{bottom:var(--start,2%);width:3px;height:4px;background:#f0d1b1;box-shadow:0 0 5px #d99a6f;opacity:.5}.shell-embers i:nth-child(3n){width:5px;height:3px;background:#b9aaa0}
@keyframes shell-rise{0%{transform:translate(0,160px) rotate(0);opacity:0}15%{opacity:.8}75%{opacity:.6}100%{transform:translate(65px,-650px) rotate(160deg);opacity:0}}
.mortal .project-description>div>p{color:#dedbd8}.mortal .project-role>span{color:#d0c5bf}.mortal .tags{color:#efb3a1}.mortal .tabs button[aria-pressed="false"]{color:#e2d5ce;background:#100a09b0}
.shodan-art{left:-5%;top:-40px;width:68%;height:800px;background:url('assets/shock-circuit-face.svg') center top/cover no-repeat;opacity:.44;mask-image:linear-gradient(90deg,#000 12%,#0009 55%,transparent 97%),linear-gradient(#000 55%,transparent 95%);mask-composite:intersect;transform:translate3d(0,var(--scroll-shift),0)}
.circuit-traces{opacity:.18}.cable-bases{stroke:#24616e}.cable-pulses{stroke:#86ebf4;filter:drop-shadow(0 0 4px #2ddef0) drop-shadow(0 0 10px #19b7c7)}
.contribution{display:block;padding:25px 28px;margin-top:30px;border-top:1px solid #ffffff35;border-left:2px solid var(--accent,#b9c7c5);background:#090a0ba6}
.contribution>span{display:block;font-size:15px;font-weight:600;letter-spacing:1.2px;margin-bottom:10px;color:var(--fg)}
.contribution p{font-size:20px;line-height:1.65;margin:0;color:#e1e1dd}.contribution b{margin:0 12px;color:#777}
.tool-logos .reaper-tool{position:static;width:100px;height:90px;max-width:100%;object-fit:contain;mix-blend-mode:normal;filter:none}.tool-logos a{background:transparent}
@media(max-width:700px){.hero-copy h1{font-size:44px}.hero-copy .role{font-size:22px}.hero-copy .intro{font-size:17px}.brand-lockup>span{font-size:20px;letter-spacing:2px}.shell-tree{width:100%;right:-15%;height:400px}.shell-figure{width:85%;right:-30%;opacity:.4}.shodan-art{width:100%;left:-20%;opacity:.3}.contribution{padding:20px}.contribution p{font-size:18px}.contribution b{margin:0 5px}}
@media(prefers-reduced-motion:reduce){.shell-embers i{animation:none!important;opacity:.45}.shell-tree,.shell-figure{transform:none!important}}

/* Revision 9: editorial density, clearer ownership and balanced spacing. */
.hero{padding-top:24px}.hero-layout{margin-top:0;margin-bottom:8px}
.studios{padding-top:12px;padding-bottom:28px}.studios h2{margin-bottom:18px}
.studio-list a{padding:6px 0}.studio-logo{margin-bottom:12px;height:84px}.studio-list strong{margin-bottom:8px}
.project-inner{padding-top:48px;padding-bottom:42px}
.project-heading{align-items:center}.project-role{font-size:28px;font-weight:500;line-height:1.4}.project-role>span{display:inline-block;font-size:16px;font-weight:400;margin-top:6px}
.project-description{margin:26px 0 28px;gap:48px}.project-description>div>p,.shock .project-description>div>p{color:#dedbd8;line-height:1.7}
.project .tags{font-size:18px;font-weight:500;gap:24px;margin-top:16px}
.shell-tree{top:-100px;right:-8%;width:110%;height:820px;background-position:center top}
.shell-figure{top:auto;bottom:-60px;right:-9%;width:54%;height:760px;background-position:right bottom;mask-image:linear-gradient(transparent,#000 22%,#000 85%,transparent)}
.contribution{margin-top:20px;padding:20px 24px}.contribution p{font-size:18px;line-height:1.7;max-width:1050px}
.reel-section{padding-top:40px;padding-bottom:48px}.heading-row{margin:0 0 24px}.experience .heading-row{margin:0 0 26px}
.experience{padding-top:24px;padding-bottom:32px}.job{padding:19px 0}.job h3{margin-bottom:4px}.education{margin-top:18px}
.about{padding-top:32px;padding-bottom:36px}.about-grid{margin-top:0;gap:60px}.about-grid p{margin-bottom:14px;line-height:1.7}.about-grid p:last-child{margin-bottom:0}
.practice{margin-top:28px;gap:32px}.practice h3{margin:12px 0 10px}.practice p{line-height:1.65;color:#bfc0c2}
.tool-strip{margin-top:28px;padding:22px 0}
@media(max-width:1000px){.project-role{font-size:25px}.project-description{gap:28px}.shell-tree{height:650px}.shell-figure{width:65%;right:-18%}}
@media(max-width:700px){.hero{padding-top:28px}.hero-layout{margin-bottom:0;gap:16px}.studios{padding-top:8px;padding-bottom:24px}.project-inner{padding-top:36px;padding-bottom:32px}.project-heading{display:block}.project-role{font-size:24px;margin-top:18px}.project-role>span{font-size:15px}.project .tags{font-size:17px;gap:18px}.project-description{margin:22px 0;gap:16px}.shell-tree{width:135%;right:-20%;height:480px;top:-60px}.shell-figure{width:85%;right:-30%;bottom:-30px;height:620px}.contribution{padding:18px;margin-top:16px}.contribution p{font-size:17px}.reel-section{padding:30px 0 36px}.experience{padding-top:16px;padding-bottom:26px}.about{padding-top:26px;padding-bottom:28px}.about-grid{gap:24px}.practice{gap:20px;margin-top:24px}.job{padding:18px 0}.tool-strip{margin-top:24px}}

/* Revision 10: compact scope summaries and orbital atmosphere. */
.studios{position:relative;z-index:3;margin-top:-95px;padding-top:28px;background:linear-gradient(transparent,#090a0bf2 55px,#090a0b 115px)}
.studio-list span{font-size:16px}.studio-list small{font-size:15px;color:#b3b5b7}
.hero-copy .round-link{font-size:20px;gap:18px}.hero-copy .round-link .circle{width:60px;height:60px;font-size:25px}
.job-date{font-size:17px;color:#bfc2c4;letter-spacing:.4px;font-variant-numeric:tabular-nums}
.contribution p{max-width:none;font-size:19px;line-height:1.7}
.shock-name{display:flex;align-items:center;gap:18px;white-space:nowrap}.shock-name .remake-title{font-family:var(--font);font-size:17px;line-height:1.3;font-weight:450;letter-spacing:.4px;text-transform:uppercase;border:1px solid #b7ced744;border-radius:3px;padding:7px 10px;color:#b9cbd0}
.shock .project-heading h2{font-size:clamp(44px,4.7vw,70px)}
.shock-scene{background:#070b10;mask-image:linear-gradient(transparent,#000 7%,#000 90%,transparent)}
.citadel-art{inset:-100px 0;background:linear-gradient(90deg,#080b1099,#080b10aa 44%,#080b1066),linear-gradient(0deg,#090a0b,transparent 60%),url('assets/citadel-station.png') center top/cover no-repeat;opacity:.8;transform:translate3d(0,var(--scroll-shift),0)}
.orbit-stars{inset:-100px -50px;background-image:radial-gradient(circle,#b4d9efaa 0 1px,transparent 1.6px),radial-gradient(circle,#edd7b888 0 1px,transparent 1.5px);background-size:179px 257px,293px 197px;background-position:17px 29px,137px 83px;opacity:.35;mask-image:linear-gradient(90deg,#000,transparent 24%,transparent 76%,#000);transform:translate3d(calc(var(--scroll-drift) * -.8),calc(var(--scroll-shift) * -.6),0)}
.station-haze{position:absolute;inset:0;background:radial-gradient(ellipse at 93% 48%,#c68d4924,transparent 45%);animation:station-light 12s ease-in-out infinite alternate paused;opacity:.3}.shock.cables-active .station-haze{animation-play-state:running}
@keyframes station-light{from{opacity:.25}to{opacity:.65}}
.shock .project-glow{display:none}.reel-footer{justify-content:flex-end}
@media(max-width:1100px){.shock-name{gap:10px}.shock-name .remake-title{font-size:13px;padding:5px 7px}.shock .project-heading{flex-wrap:wrap}.studios{margin-top:-65px}.job-date{font-size:16px}}
@media(max-width:700px){.studios{margin-top:-45px;padding-top:20px}.studio-list span{font-size:15px}.studio-list small{font-size:14px}.hero-copy .round-link{font-size:18px}.hero-copy .round-link .circle{width:56px;height:56px}.job-date{font-size:16px}.shock .project-heading h2{font-size:clamp(32px,7vw,46px);letter-spacing:-1.3px}.shock-name{gap:9px}.shock-name .remake-title{font-size:11px;letter-spacing:0;padding:4px 6px}.contribution p{font-size:17px}.citadel-art{background-position:32% top;opacity:.55}}
@media(prefers-reduced-motion:reduce){.station-haze{animation:none}.citadel-art,.orbit-stars{transform:none!important}}

.citadel-art{background-size:auto,auto,100% auto}
@media(max-width:700px){.citadel-art{background-size:auto,auto,auto 750px}}

/* Revision 11: original green SHODAN atmosphere and matching custom poster. */
.shock-scene{background:transparent;mask-image:linear-gradient(transparent,#000 12%,#000 87%,transparent)}
.shodan-art{inset:-140px auto -140px 0;width:min(48vw,700px);height:auto;background:url('assets/shock-atmosphere.webp') left center/auto 115% no-repeat;opacity:.48;mask-image:linear-gradient(90deg,#000 0%,#000 25%,transparent 98%);mask-composite:add;transform:translate3d(0,var(--scroll-shift),0)}
.circuit-traces{left:auto;right:-40px;width:min(43vw,650px);background:linear-gradient(90deg,#090a0b00,#091c171a),url('assets/circuit-traces.svg') right center/cover no-repeat;opacity:.45;mask-image:linear-gradient(90deg,transparent,#000 85%);transform:translate3d(var(--scroll-drift),calc(var(--scroll-shift) * -.7),0)}
.shock-scan{opacity:.3}.cable-bases{stroke:#327d69;stroke-width:2;opacity:.28}.cable-pulses{stroke:#84ffd1;stroke-width:2.5;stroke-linecap:round;filter:drop-shadow(0 0 4px #3eedb8) drop-shadow(0 0 10px #2cd79d);opacity:.7}
@media(max-width:700px){.shodan-art{width:85%;opacity:.3}.circuit-traces{opacity:.25}}
@media(prefers-reduced-motion:reduce){.shodan-art,.circuit-traces{transform:none!important}}

/* Hero shortcuts: project overview and direct access to the reel. */
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px 32px;margin-top:30px}
.hero-copy .hero-actions .round-link{margin-top:0;white-space:nowrap}
.hero-actions .reel-link .circle{font-size:18px}
.hero-actions .reel-link:hover .circle{transform:none}
@media(max-width:700px){.hero-actions{gap:16px 24px}.hero-copy .hero-actions .round-link{font-size:18px;gap:12px}}

/* Unnumbered practices and direct contact. */
.practice h3{margin-top:0}
.contact{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;padding-top:46px;padding-bottom:48px;border-top:1px solid var(--line)}
.contact h2{font-size:clamp(30px,3vw,44px);letter-spacing:-1px}.contact p{font-size:17px;color:#bfc0c2;margin-top:14px}
.contact-links{justify-self:end}.contact-primary{font-size:clamp(20px,2vw,28px);display:inline-block;border-bottom:1px solid #ffffff50;padding:8px 0;overflow-wrap:anywhere}
.contact-primary span{margin-left:10px}.contact-secondary{display:flex;flex-wrap:wrap;gap:24px;margin-top:18px;font-size:17px}.contact a:hover{color:#e7c5b4}.file-type{font-size:12px;border:1px solid #ffffff40;padding:2px 5px;border-radius:3px;margin-left:5px;vertical-align:middle}
@media(max-width:700px){.contact{grid-template-columns:1fr;gap:20px;padding-top:32px;padding-bottom:32px}.contact-links{justify-self:start}}
@media(max-width:520px){.practice>div{grid-template-columns:90px 1fr}.practice h3{margin:0}}

/* MS2 contribution accent: change the left rule only. */
#mortal-shell .contribution{border-left-color:#c52c36}

/* iPhone fixes: code-drawn icons, unobstructed mobile navigation, bounded artwork. */
.ui-icon{display:inline-block;width:1em;height:1em;vertical-align:-.14em;flex-shrink:0;pointer-events:none}
.circle .ui-icon{width:24px;height:24px}.play-disc .ui-icon{width:25px;height:25px}.play-disc{padding-left:3px}
button{-webkit-appearance:none;appearance:none}
@media(max-width:800px){
 .header{position:relative;top:auto;background:#090a0b;backdrop-filter:none;-webkit-backdrop-filter:none}
 html{scroll-padding-top:24px}
}
@media(max-width:700px){
 .shock-scene{background:radial-gradient(ellipse at 5% 25%,#0b251d77,transparent 65%);-webkit-mask-image:linear-gradient(transparent,#000 8%,#000 91%,transparent);mask-image:linear-gradient(transparent,#000 8%,#000 91%,transparent)}
 .shock .shodan-art{inset:-24px auto auto 0;width:100%;height:740px;background-position:left top;background-size:auto 620px;opacity:.32;-webkit-mask-image:radial-gradient(ellipse 105% 410px at 0 235px,#000 0%,transparent 85%);mask-image:radial-gradient(ellipse 105% 410px at 0 235px,#000 0%,transparent 85%);transform:translate3d(0,calc(var(--scroll-shift) * .35),0)}
 .shock .circuit-traces{display:none}
 .shock .glow-cables{width:32vw;opacity:.5;-webkit-mask-image:linear-gradient(transparent,#000 15%,#000 85%,transparent);mask-image:linear-gradient(transparent,#000 15%,#000 85%,transparent)}
 .shock .cables-left{left:-35px}.shock .cables-right{right:-35px}.shock .shock-scan{opacity:.13}
 .play-disc{background:rgba(9,10,11,.82);color:#f0efea;-webkit-backdrop-filter:none;backdrop-filter:none}
 .play-disc .ui-icon{width:22px;height:22px}
}
@media(hover:none){.poster:hover .play-disc{background:rgba(9,10,11,.82);color:#f0efea;scale:1}.poster:hover .thumbnail{transform:none;opacity:.83}}

/* Contain decorative bleed without creating a sideways page on iOS. */
html,body{width:100%;max-width:100%;overflow:visible;overscroll-behavior:auto}
#main{width:100%;max-width:100%;overflow:clip;display:flow-root}
@media(max-width:800px){
 html,body{touch-action:auto}
 .hero-layout,.project-inner,.about-grid,.practice,.studio-list,.contact{min-width:0}
 .hero-copy,.project-heading>div,.project-description>div,.studio-list>a,.about-grid>div,.practice>div,.contact>div{min-width:0}
 .contact-secondary a{overflow-wrap:anywhere}
}
@media(max-width:380px){
 .header{padding-inline:16px}.header nav{gap:10px}.header nav a{font-size:12px}
 .brand-lockup>span{font-size:18px;letter-spacing:1px}.brand-lockup svg{width:16px}
}

/* Preserve native zoom/pan; only decorative content is clipped. */
.viewport-zoomed .scroll-scene *{animation-play-state:paused!important;transition:none!important}
@media(pointer:coarse){html{scroll-behavior:auto}}
#video-dialog{overscroll-behavior:contain;max-height:90dvh;overflow:auto}

/* Direct contact access on desktop and phones. */
.header-actions{display:flex;align-items:center;gap:24px}
.header .nav-contact{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 20px;border:1px solid #e8e5dc70;border-radius:4px;color:#f0efea;transition:background .2s,color .2s}
.header .nav-contact:hover{background:#efeee8;color:#101112}
@media(max-width:800px){.header{display:grid;grid-template-columns:1fr auto;height:auto;min-height:104px;gap:4px 16px;padding-block:10px}.header>.brand{grid-column:1;grid-row:1}.header-actions{grid-column:2;grid-row:1}.header nav{grid-column:1/-1;grid-row:2;justify-content:center;gap:28px}.header nav a{display:inline-flex;align-items:center;min-height:36px;font-size:14px}.header .nav-contact{padding:7px 16px;font-size:14px}}

/* Roomier layout, animated disclosures, and a solid safe-area header. */
@media(min-width:801px){.wrap{width:min(1360px,calc(100% - 96px))}}
@media(min-width:1600px){.wrap{width:min(1440px,calc(100% - 144px))}}
.experience{padding-top:52px;padding-bottom:64px}
.experience .heading-row{margin-bottom:36px}
.about{padding-top:64px;padding-bottom:56px;border-top:1px solid var(--line)}
.about-grid{column-gap:80px}.about-grid>div{max-width:640px}
.practice{margin-top:42px;gap:40px}
.job .plus,.education summary>span{transition:transform .35s cubic-bezier(.22,1,.36,1)}
.education[open] summary>span{transform:rotate(45deg)}
@media(max-width:800px){
 .header{position:sticky;top:0;z-index:50;background:#090a0b;backdrop-filter:none;-webkit-backdrop-filter:none;padding-top:calc(10px + env(safe-area-inset-top,0px));padding-left:max(22px,env(safe-area-inset-left,0px));padding-right:max(22px,env(safe-area-inset-right,0px));border-bottom:1px solid #ffffff24}
 html{scroll-padding-top:calc(124px + env(safe-area-inset-top,0px))}
 .experience{padding-top:36px;padding-bottom:44px}
 .about{padding-top:44px;padding-bottom:40px}
 .about-grid{gap:28px}.practice{margin-top:32px;gap:28px}
}

/* Readable education entries and opaque coverage above embedded-browser headers. */
.education{font-size:18px}
.education p{font-size:17px;line-height:1.75;color:#bfc0c2}
.education strong{display:inline-block;font-size:19px;line-height:1.4;margin-bottom:8px;color:#efeee8}
.education>div{gap:36px;padding-block:28px}
@media(max-width:800px){
 .education>div{gap:28px}
 /* Extend paint above the sticky edge when an iOS webview offsets its viewport.
    No overlay over the controls, gesture interception, or scroll locking. */
 .header{overflow:visible}
 .header::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:max(160px,env(safe-area-inset-top,0px));background:#090a0b;pointer-events:none}
}