/* Cinematic extension of the existing portfolio, without layout dependencies. */
:root{--accent:#8ef1df;--panel:#11181d;--cinema-pad:clamp(24px,6vw,100px)}
.topbar{border-color:#ffffff13}.hero{background:radial-gradient(ellipse at 77% 44%,#14333a,#0a1117 48%,#080b10 75%)}.hero h1{letter-spacing:-.08em}.section-heading h2{font-weight:800}.section-sub{font-size:15px}.project-card{border-color:#ffffff18;border-radius:3px;background:#0f171d;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.project-card:hover,.project-card:focus-within{transform:translateY(-5px);border-color:#8ef1df80;box-shadow:0 18px 44px #0004}.poster{padding:18px;height:auto;aspect-ratio:16/10;display:block;background:#101d25}.poster:after{display:none}.card-index{position:absolute;right:16px;top:17px;z-index:3;font:9px monospace;letter-spacing:1px;color:#9bcbc8}.poster-tag{position:absolute;top:15px;left:15px;z-index:3;font-size:9px;letter-spacing:1px}.cover-reveal{position:absolute;right:16px;bottom:18px;font:10px monospace;letter-spacing:2px;color:var(--accent);z-index:3;transform:translateY(5px);opacity:0;transition:.2s}.project-card:hover .cover-reveal,.project-card:focus-within .cover-reveal{opacity:1;transform:none}.project-meta{padding:24px;gap:14px}.project-meta h3{font-size:20px;letter-spacing:-.035em}.project-meta p{line-height:1.75}.card-bottom{margin-top:8px}.open-project{font-size:11px;letter-spacing:1px;text-align:right;white-space:nowrap}.tag{font-size:9px;border-color:#47636075;background:#0b171b55}.work-grid .poster{height:auto;aspect-ratio:16/11}.work-grid .project-meta{padding:20px}.work-grid .project-meta h3{font-size:18px}.work-grid .card-index{display:none}
/* Media reserves dimensions and remains invisible until successfully decoded. */
.media-frame{position:relative;isolation:isolate;overflow:hidden;background:#111f27;min-height:120px;aspect-ratio:16/9;contain:layout}.media-frame>img{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .35s ease;z-index:0}.media-frame.is-loaded>img{opacity:1}.image-fallback{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:clamp(18px,4vw,60px);gap:12px;background:linear-gradient(90deg,#08101666,transparent);pointer-events:none}.image-fallback[hidden]{display:none}.fallback-role{font:10px monospace;letter-spacing:2px;color:var(--accent)}.image-fallback strong{font-size:clamp(24px,3vw,48px);font-weight:800;letter-spacing:-.05em;line-height:1.08;max-width:90%}.fallback-status{font-size:11px;color:#a6bbc2}.image-fallback code{max-width:100%;font:10px/1.5 monospace;color:#7f999f;overflow-wrap:anywhere}.image-fallback small{font:9px monospace;color:#78979d}.media-status{position:absolute;bottom:12px;right:12px;color:#a9c6c9;font:8px monospace;letter-spacing:1.5px;background:#091419b8;padding:5px 7px;z-index:2}.media-status[hidden]{display:none}.card-image{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}.card-image .image-fallback{padding:48px 20px 35px}.card-image .image-fallback strong{font-size:clamp(22px,2vw,30px)}.card-image code,.card-image small,.card-image .fallback-role{display:none}.card-image .fallback-status{font-size:9px}.card-image img{transition:opacity .35s,transform .8s ease}.project-card:hover .card-image img{transform:scale(1.035)}
/* One large feature and two compact supporting features. */
.featured-grid{grid-template-columns:1.5fr 1fr;grid-template-rows:repeat(2,minmax(240px,auto));gap:20px}.cinematic-feature{position:relative;min-height:280px;display:block;border-color:#ffffff22}.cinematic-feature:first-child{grid-row:span 2;min-height:610px}.cinematic-feature .poster{position:absolute;inset:0;height:100%;width:100%;aspect-ratio:auto}.cinematic-feature .poster:after{display:block;position:absolute;inset:0;width:auto;height:auto;border:0;border-radius:0;box-shadow:none;background:linear-gradient(0deg,#071015 0%,#071015b8 24%,#07101520 70%,#07101530);z-index:1}.cinematic-feature .project-meta{position:absolute;left:0;bottom:0;right:0;z-index:3;padding:clamp(22px,3vw,45px);gap:10px}.cinematic-feature .project-meta h3{font-size:clamp(28px,3vw,44px);line-height:1.05;max-width:90%}.cinematic-feature:first-child .project-meta h3{font-size:clamp(40px,5vw,76px);max-width:85%;letter-spacing:-.065em}.cinematic-feature .project-meta p{max-width:500px;color:#b9c9ce;font-size:13px;-webkit-line-clamp:2}.cinematic-feature .card-image .image-fallback{justify-content:flex-start;align-items:flex-end;padding-top:72px;text-align:right}.cinematic-feature .card-image .image-fallback strong{display:none}.cinematic-feature .card-image .fallback-status{font:9px monospace;letter-spacing:1px}.cinematic-feature .media-status{top:50px;bottom:auto;right:20px}.cinematic-feature .card-index{color:#a0d1d0}.cinematic-feature .cover-reveal{display:none}
/* The retained native dialog now behaves as a dedicated full-screen project experience. */
#project-dialog{position:fixed;inset:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0;background:#080d12;overflow-y:auto;overscroll-behavior:contain;scroll-behavior:smooth;color:var(--text);box-shadow:none}#project-dialog .dialog-shell{padding:0}#project-dialog .dialog-top{position:sticky;top:0;z-index:20;height:70px;padding:0 var(--cinema-pad);background:#080e14ef;border-bottom:1px solid #ffffff1a;backdrop-filter:blur(12px)}#project-dialog .dialog-top .kicker{margin:0;font-size:9px;letter-spacing:2px}.close{font:10px monospace;letter-spacing:1px;padding:10px 15px;border-color:#536d7366;border-radius:2px}.close:hover{border-color:var(--accent);color:var(--accent)}#detail-content{overflow-wrap:normal}.project-hero{position:relative;min-height:650px;height:76vh;max-height:980px;overflow:hidden;display:flex;align-items:flex-end;padding:60px var(--cinema-pad) 85px;isolation:isolate;background:#112b32}.hero-cover{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;z-index:-3}.hero-texture{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;opacity:.22;z-index:-2;mix-blend-mode:screen}.project-logo{height:65px;width:180px;aspect-ratio:auto;background:transparent;margin-bottom:16px}.hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#080d12 0%,#080d12aa 20%,#080d1200 75%),linear-gradient(90deg,#071015ce 0%,#07101530 65%,transparent)}.project-hero-copy{max-width:1000px;position:relative;z-index:1}.project-hero-copy .kicker{font-size:11px;letter-spacing:3px;color:#9cebdc}.project-hero h2{font-weight:850;font-size:clamp(54px,7.8vw,120px);line-height:.96;letter-spacing:-.07em;margin:24px 0 26px;max-width:1050px;text-wrap:balance}.detail-kinds{gap:8px}.detail-kinds .tag{color:#d0e6e4;background:#08191c8c;font-size:10px}.project-role{color:#aec6c9;font-size:13px;margin:20px 0 0}.project-hero .hero-actions{gap:12px;margin-top:28px}.project-hero .hero-actions .btn{font:10px monospace;letter-spacing:1px;padding:15px 22px}.project-scroll{position:absolute;right:var(--cinema-pad);bottom:30px;color:#7f9ea5;font:9px monospace;letter-spacing:2px}.hero-cover .image-fallback{inset:30px 35px auto auto;padding:22px;border-top:1px solid #68969c66;background:#07101588;max-width:350px;align-items:flex-end;text-align:right;justify-content:flex-start}.hero-cover .image-fallback strong{font-size:20px;line-height:1.2;letter-spacing:-.025em}.hero-cover .fallback-status{font-size:9px}.hero-cover .media-status{display:none}.hero-cover.is-fallback .image-fallback{inset:0;max-width:none;padding:60px var(--cinema-pad);justify-content:flex-start;background:radial-gradient(ellipse at 70% 45%,#214d59,#0a1720)}.hero-cover.is-fallback .image-fallback strong{max-width:500px}.detail-nav{position:sticky;top:70px;z-index:15;display:flex;gap:clamp(20px,4vw,65px);padding:0 var(--cinema-pad);background:#0a1118f7;border-block:1px solid #ffffff15;backdrop-filter:blur(12px);overflow:auto;white-space:nowrap}.detail-nav button{border:0;background:transparent;font:10px monospace;letter-spacing:1px;color:#7d949f;padding:22px 0;border-bottom:2px solid transparent}.detail-nav button:hover,.detail-nav button.active{color:var(--accent);border-bottom-color:var(--accent)}.project-body{max-width:1560px;margin:auto;padding:0 var(--cinema-pad)}.project-body .detail-section{padding:90px 0;border-color:#ffffff14;scroll-margin-top:145px}.project-body .detail-section h3{font-size:clamp(34px,4vw,62px);line-height:1.05;letter-spacing:-.06em;font-weight:780;margin:15px 0 35px}.editorial-overview{display:grid;grid-template-columns:1.6fr 1fr;gap:clamp(35px,7vw,110px)}.editorial-overview .detail-text{font-size:16px;line-height:1.95;color:#b1c0c9;max-width:820px}.original-copy{margin-top:28px;font-size:12px;border-top:1px solid #32434c;padding-top:15px}.original-copy .detail-text{font-size:14px;margin-top:20px}.project-facts{padding:28px 30px;background:#0f1820;border:1px solid #ffffff15;height:fit-content}.project-facts h4{font:10px monospace;letter-spacing:2px;color:#8fbbbc;margin:0 0 20px}.project-facts h4:not(:first-child){margin-top:30px;padding-top:25px;border-top:1px solid #ffffff14}.project-facts dl{margin:0;font-size:13px}.project-facts dt{font:9px monospace;letter-spacing:1px;text-transform:uppercase;color:#6b8a97;margin-bottom:5px}.project-facts dd{margin:0 0 18px;color:#c3d2d7;line-height:1.7}.project-facts details p{font-size:12px;color:#94adb8}.project-facts .details-links{gap:14px}.project-facts .details-links a{font-size:12px;text-decoration:none}.detail-section-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:10px}.source-caption{font:9px monospace;color:#6d8a98;letter-spacing:2px;margin-bottom:35px}.media-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.media-item{padding:0;background:#0d171f;border-color:#263a44;border-radius:2px;overflow:hidden;gap:0}.media-item figcaption{font-size:13px;color:#c2d4d8;padding:17px 20px;border-bottom:1px solid #253943}.media-item>a{padding:15px 20px;font-size:11px;color:#8bc2c0;text-decoration:none}.media-item .btn{margin:16px 20px 0;font:10px monospace;align-self:flex-start}.expand-image{padding:0;border:0;background:#081119;color:var(--accent);position:relative;text-align:left;display:block;width:100%;cursor:zoom-in}.expand-image>span{position:absolute;right:16px;bottom:15px;z-index:3;font:9px monospace;letter-spacing:1px;background:#081119d9;padding:6px}.media-item .media-frame{aspect-ratio:16/10;min-height:0}.media-item .media-frame.is-loaded:not(.is-placeholder){background:#080f15}.media-item .media-frame img{max-height:none;background:transparent;object-fit:contain}.media-item .image-fallback{padding:25px}.media-item .image-fallback strong{font-size:25px}.video-facade{position:relative;padding:0;background:transparent}.play-video{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:16px;width:80%;padding:10px 0;border:0;background:transparent;color:#f1f8f8;font:10px monospace;letter-spacing:2px}.play-video span{display:grid;place-items:center;width:65px;height:65px;border:1px solid #adfff0;border-radius:50%;background:#163c42ac;font-size:23px;padding-left:4px;transition:background .2s}.play-video:hover span,.play-video:focus-visible span{background:#296068}.video-facade .image-fallback{justify-content:flex-end;padding-bottom:24px}.video-facade .image-fallback strong{display:none}.video-facade .image-fallback .fallback-role{display:none}.video-facade .image-fallback code,.video-facade .image-fallback small{display:none}.media-item video,.media-item iframe{width:100%;aspect-ratio:16/10;max-height:none;display:block;object-fit:contain;border:0;background:#050a10}.media-error{padding:12px 20px}.gallery-empty{padding:25px 30px;border:1px dashed #304c55;margin-top:24px;border-radius:2px}.gallery-empty>span{font:9px monospace;color:#7dafb4;letter-spacing:2px}.gallery-empty p{font-size:13px;color:#829daa;margin:12px 0 0;max-width:650px}.gallery-empty code{display:block;margin-top:10px;color:#5f838c;font-size:10px;overflow-wrap:anywhere}.contribution-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.contribution-card{background:linear-gradient(130deg,#13242d,#0e171f);border:1px solid #2a3e48;border-top:2px solid #528982;padding:30px}.contribution-card>span{font:9px monospace;letter-spacing:1px;color:#77abae}.contribution-card h4{font-size:23px;letter-spacing:-.035em;line-height:1.3;margin:22px 0 15px}.contribution-card p{font-size:14px;color:#9eb5c0;line-height:1.85;margin:0}.engineering-breakdown{background:radial-gradient(ellipse at 90% 40%,#16393f,transparent 60%)}.engineering-breakdown>p:not(.kicker){color:#9bb5bf;font-size:14px}.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.back-projects{margin-top:40px;font:10px monospace;letter-spacing:1px}
/* Native, keyboard-trapped image viewer; Escape returns to the project. */
#media-lightbox{position:fixed;inset:0;margin:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;background:#050a0ff7;border:0;border-radius:0;padding:0;color:#f0f7f8;overflow:hidden}#media-lightbox::backdrop{background:#02070ae8}.lightbox-toolbar{height:70px;display:flex;justify-content:space-between;align-items:center;padding:0 25px;gap:20px;border-bottom:1px solid #203440}.lightbox-toolbar p{font-size:13px;margin:0}.lightbox-toolbar button,.lightbox-controls button{border:1px solid #49656d;background:#12232c;color:#bdf5e9;border-radius:3px;min-width:44px;height:42px}.lightbox-controls{height:70px;display:flex;justify-content:center;align-items:center;gap:25px}.lightbox-controls span{font:11px monospace;color:#8eb4bc}#lightbox-stage{height:calc(100dvh - 140px);position:relative;touch-action:pan-y;display:flex;justify-content:center;align-items:center}#lightbox-stage>.media-frame{width:100%;height:100%;aspect-ratio:auto;background:transparent}#lightbox-stage>.btn{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);font-size:11px}#lightbox-stage img{object-fit:contain!important}.lightbox-toolbar button:hover,.lightbox-controls button:hover{border-color:var(--accent)}
@media(min-width:1101px){.work-grid{gap:24px}.hero{padding-top:105px;padding-bottom:105px;min-height:780px}.hero-art{height:470px}}
@media(max-width:1000px){.featured-grid{grid-template-columns:1.25fr 1fr;gap:15px}.cinematic-feature:first-child{min-height:610px}.cinematic-feature .project-meta{padding:22px}.cinematic-feature .card-technologies{display:none}.project-hero{height:72vh;min-height:560px}.project-hero h2{font-size:80px}.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.editorial-overview{gap:40px;grid-template-columns:1.3fr 1fr}.project-facts{padding:22px}.project-body .detail-section{padding:70px 0}.project-body .detail-section h3{font-size:44px}}
@media(max-width:760px){.featured-grid{display:flex;flex-direction:column}.cinematic-feature,.cinematic-feature:first-child{min-height:430px}.cinematic-feature:first-child{min-height:530px}.cinematic-feature .project-meta h3{font-size:36px}.cinematic-feature:first-child .project-meta h3{font-size:54px}.cinematic-feature .project-meta{padding:30px}.cinematic-feature .project-meta p{font-size:13px}.project-hero{height:75svh;min-height:580px;padding:45px 24px 70px}.project-hero h2{font-size:clamp(46px,10vw,80px);max-width:100%}.project-hero-copy .kicker{font-size:9px;letter-spacing:2px}.project-role{font-size:12px}.hero-cover .image-fallback{inset:16px 20px auto auto;padding:14px;max-width:260px}.hero-cover .image-fallback strong{font-size:16px}.hero-cover .image-fallback code{font-size:8px}.hero-cover .image-fallback small{font-size:8px}.project-scroll{right:24px;font-size:8px}.editorial-overview{grid-template-columns:1fr;gap:35px}.media-gallery,.contribution-grid{grid-template-columns:1fr}.detail-nav{gap:27px;padding-inline:24px}.detail-nav button{font-size:9px;padding:18px 0}#project-dialog .dialog-top{height:60px;padding-inline:20px}.detail-nav{top:60px}.project-body{padding:0 24px}.project-body .detail-section{padding:60px 0;scroll-margin-top:122px}.project-body .detail-section h3{font-size:40px}.source-caption{display:none}.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-actions .btn{width:auto}.project-hero .hero-actions .btn{padding:13px 15px;font-size:9px}.project-facts{padding:28px}.hero-cover.is-fallback .image-fallback{padding:25px}.contribution-card{padding:25px}.contribution-card h4{font-size:22px}}
@media(max-width:480px){.related-grid{grid-template-columns:1fr}.work-grid .poster{height:auto;aspect-ratio:16/10}.card-index{font-size:8px}.project-hero .hero-actions{display:flex;flex-wrap:wrap;gap:9px}.project-hero .hero-actions .btn{font-size:8px;padding:13px 12px}.project-hero h2{font-size:52px}.project-role{max-width:270px}.project-hero .detail-kinds .tag{font-size:8px}#detail-brand{font-size:8px!important;letter-spacing:1px!important;max-width:115px}.close{font-size:8px;padding:10px}#lightbox-stage>.btn{width:auto;white-space:nowrap}.cinematic-feature .project-meta{padding:25px}.cinematic-feature .poster-tag{max-width:60%}.cinematic-feature .card-index{display:none}.cinematic-feature .image-fallback{padding-inline:20px}.cinematic-feature .project-meta .card-bottom{margin-top:5px}.cinematic-feature .project-meta p{-webkit-line-clamp:2}.hero-cover .image-fallback{max-width:250px}.editorial-overview .detail-text{font-size:15px}.project-body .detail-section h3{font-size:36px}}
@media(prefers-reduced-motion:reduce){#project-dialog{scroll-behavior:auto}.project-card,.cover-reveal,.card-image img,.media-frame>img,.play-video span{transition:none!important}.project-card:hover,.project-card:focus-within,.project-card:hover .card-image img{transform:none!important}}

.btn.secondary{background:transparent;color:var(--text)}.feature-original-preview{display:flex;gap:13px;align-items:center;margin:3px 0}.feature-original-preview .media-frame{width:100px;height:58px;min-height:0;aspect-ratio:auto;border:1px solid #49646b66;flex-shrink:0}.feature-original-preview>span{font:8px/1.8 monospace;letter-spacing:1px;color:#8cb3b9}.feature-original-preview small{font-size:8px;color:#6b8b97}.feature-original-preview .image-fallback{display:none}.feature-original-preview img{object-fit:contain}.cinematic-feature:not(:first-child) .feature-original-preview{display:none}

.motion-toggle{background:transparent;border:0;color:#809da7;font:9px monospace;letter-spacing:.5px;padding:10px;cursor:pointer}.motion-toggle[aria-pressed="true"]{color:var(--accent)}.dialog-top .motion-toggle{margin-left:auto}.reduce-motion,.reduce-motion #project-dialog{scroll-behavior:auto!important}.reduce-motion *{transition:none!important;animation:none!important}.reduce-motion .project-card:hover,.reduce-motion .project-card:focus-within,.reduce-motion .project-card:hover .card-image img,.reduce-motion .btn:hover{transform:none!important}@media(max-width:480px){.dialog-top .motion-toggle{font-size:8px;max-width:70px;padding:5px}}
.featured-grid{grid-template-rows:repeat(2,minmax(320px,auto))}.cinematic-feature:first-child{min-height:660px}.cinematic-feature:not(:first-child) .project-meta{padding:25px}.cinematic-feature:not(:first-child) .project-meta h3{font-size:32px;line-height:1.04}.cinematic-feature:not(:first-child) .card-technologies{display:none}.cinematic-feature:not(:first-child) .project-meta p{font-size:12px}.cinematic-feature .poster-tag{font-size:8px}@media(max-width:760px){.cinematic-feature:first-child{min-height:530px}.cinematic-feature:not(:first-child){min-height:430px}.cinematic-feature:not(:first-child) .project-meta h3{font-size:38px}}

.detail-nav{scrollbar-width:none}.detail-nav::-webkit-scrollbar{display:none}
.topbar nav{scrollbar-width:none}.topbar nav::-webkit-scrollbar{display:none}.cinematic-feature .card-image.is-placeholder .fallback-status{display:none}