:root{color-scheme:dark;--bg:#101113;--panel:#191b1e;--line:#2c2e33;--text:#f0f1f3;--muted:#959ba5;--accent:#c5d8de;--glow:82,135,139}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.55 Arial,Helvetica,sans-serif}body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 88% 20%,rgba(var(--glow),.09),transparent 55%);z-index:-1;transition:background .4s}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}button{transition:background .18s,border-color .18s,transform .18s}button:hover:not(:disabled){border-color:#7e8894}a:hover{color:white}[hidden]{display:none!important}:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.skip-link{position:fixed;top:-100px;left:24px;padding:12px;background:var(--accent);color:var(--bg);z-index:10}.skip-link:focus{top:12px}.wrap{max-width:1660px;padding:0 48px;margin:auto}.site-header{height:96px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:block;line-height:0}.brand img{display:block}.header-label{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}.library{display:grid;grid-template-columns:250px minmax(0,1fr);gap:48px;padding:40px 0 52px;align-items:start}.project-library{position:sticky;top:24px}.library-heading{display:flex;justify-content:space-between;align-items:center;padding:0 12px 22px}.library-heading h1{font-size:15px;font-weight:500;margin:0}.library-heading>span{font:11px monospace;color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:1px 6px}#project-picker{display:flex;flex-direction:column;gap:8px}#project-picker button{display:flex;align-items:center;gap:13px;width:100%;text-align:left;border:1px solid transparent;background:transparent;border-radius:9px;padding:11px;position:relative}#project-picker button:hover{background:#1d2025;transform:translateX(2px)}#project-picker button[aria-pressed=true]{background:linear-gradient(100deg,rgba(var(--glow),.22),#1e2326);border-color:rgba(var(--glow),.4)}#project-picker button[aria-pressed=true]::before{content:"";position:absolute;left:-1px;top:20px;bottom:20px;width:3px;border-radius:3px;background:var(--accent)}.project-thumb{width:66px;height:52px;object-fit:cover;flex-shrink:0;border-radius:5px;background:#25282d;filter:saturate(.7);transition:filter .2s}#project-picker button[aria-pressed=true] .project-thumb,#project-picker button:hover .project-thumb{filter:saturate(1.1)}.project-label{display:flex;flex-direction:column;gap:5px;min-width:0}.project-name{font-size:13px;font-weight:600;line-height:1.35}.project-type{font-size:10px;color:var(--muted)}.project-detail{min-width:0;outline:none;scroll-margin-top:20px}.project-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:130px;padding:0 0 28px}.project-heading-copy{max-width:650px}.project-meta{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:13px}.project-meta p{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--accent);margin:0}#status{font-size:10px;color:#a9b0b9;line-height:1.6;padding:2px 7px;border:1px solid #363c43;border-radius:4px}#status.ready{color:#bce3c7;border-color:#355742}.project-heading h2{font-size:clamp(32px,3.3vw,52px);letter-spacing:-1.8px;line-height:1.08;font-weight:500;margin:0 0 14px}#description{font-size:14px;max-width:550px;color:#adb2ba;margin:0;line-height:1.7}.actions{flex-shrink:0}.primary{display:flex;gap:14px;align-items:center;justify-content:center;padding:13px 18px;border-radius:6px;border:1px solid var(--accent);background:var(--accent);color:#131b20;white-space:nowrap;font-size:12px;font-weight:600;transition:filter .2s,transform .2s}.primary:hover{filter:brightness(1.1);color:#111;transform:translateY(-1px)}.primary small{font-size:10px;font-weight:400;opacity:.65}.media-column{min-width:0}.stage{position:relative;aspect-ratio:16/9;border:1px solid #ffffff20;background:#070809;border-radius:11px;overflow:hidden;box-shadow:0 20px 65px #0004}.stage>img,.stage>video{display:block;width:100%;height:100%;object-fit:contain}.stage #enlarge{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffff40;border-radius:6px;background:#101318d9}.stage #enlarge svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5}.video-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);height:72px;width:72px;background:#e6edf2ed;border:1px solid #fff7;border-radius:50%;color:#121820;box-shadow:0 6px 30px #0005;display:grid;place-items:center}.video-play:hover{background:white}.video-play span{font-size:23px;margin-left:4px}.stage>p{position:absolute;inset:30% 10%;display:grid;place-content:center;text-align:center;background:#101113ef;color:var(--text);padding:20px}.stage>p button{background:transparent;border:1px solid var(--line);border-radius:4px;padding:7px 12px;margin-top:10px}.stage[aria-busy=true]::before{content:"Loading image…";position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-size:13px}.media-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0}.media-toolbar p{font-size:12px;color:#b0b6bf;margin:0}.media-navigation{display:flex;align-items:center;gap:6px;flex-shrink:0}.media-navigation>span{font:11px monospace;color:var(--muted);margin-right:9px}.media-navigation button{border:1px solid var(--line);background:#17191c;border-radius:5px;width:32px;height:32px}.media-navigation button:disabled{opacity:.3}#media-picker{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 12px;scrollbar-width:thin;scrollbar-color:#414650 transparent}#media-picker button{flex:0 0 112px;position:relative;overflow:hidden;border:2px solid transparent;background:#1a1d22;border-radius:6px;padding:0}#media-picker button[aria-pressed=true]{border-color:var(--accent)}#media-picker img{display:block;width:100%;height:63px;object-fit:cover;opacity:.75}#media-picker button[aria-pressed=true] img,#media-picker button:hover img{opacity:1}#media-picker .thumb-label{display:flex;align-items:center;justify-content:space-between;padding:5px 7px;font-size:9px;color:#b7bec8;text-transform:uppercase;letter-spacing:.4px}#media-picker .play-label{position:absolute;top:18px;left:44px;color:#fff;font-size:18px;text-shadow:0 2px 8px #000}.project-summary{border-top:1px solid var(--line);margin-top:12px;padding-top:22px;display:flex;gap:30px;align-items:baseline}.project-summary h3{color:var(--muted);font-size:11px;font-weight:400;margin:0;white-space:nowrap}.project-summary ul{display:flex;gap:12px 24px;flex-wrap:wrap;list-style:none;padding:0;margin:0;font-size:12px;color:#c8cdd5}.project-summary li{display:flex;align-items:center;gap:8px}.project-summary li::before{content:"";width:3px;height:3px;border-radius:50%;background:var(--accent)}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:22px 0;color:#727a86;font-size:11px}dialog{border:1px solid var(--line);background:#111318;color:var(--text);border-radius:10px;padding:48px 16px 16px;max-width:1600px;width:96vw}dialog::backdrop{background:#000e}dialog .close{position:absolute;right:12px;top:10px;border:1px solid var(--line);border-radius:5px;background:#252930;width:32px;height:32px;font-size:24px;line-height:1}#lightbox img{display:block;max-width:100%;max-height:80vh;margin:auto}#lightbox-caption{text-align:center;font-size:12px;color:var(--muted);margin:12px 0 0}@media(min-width:1500px){.library{gap:56px;grid-template-columns:270px minmax(0,1fr)}.project-thumb{width:74px;height:58px}.project-name{font-size:14px}}@media(max-width:1150px){.wrap{padding:0 28px}.library{grid-template-columns:205px minmax(0,1fr);gap:26px}.project-thumb{width:46px;height:44px}.project-heading{align-items:flex-start;flex-direction:column;gap:18px}.project-heading h2{font-size:38px}.primary{padding:11px 16px}.project-summary{flex-direction:column;gap:12px}}@media(max-width:760px){.wrap{padding:0 18px}.site-header{height:76px}.brand img{width:145px;height:auto}.header-label{font-size:9px;max-width:115px;text-align:right;line-height:1.6}.library{display:block;padding-top:24px}.project-library{position:static;margin-bottom:26px}.library-heading{padding:0 0 12px}.library-heading h1{font-size:15px}#project-picker{flex-direction:row;overflow-x:auto;padding:2px 2px 12px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#414650 transparent;gap:8px}#project-picker button{flex:0 0 155px;display:block;padding:7px;scroll-snap-align:start;border-color:var(--line)}#project-picker button:hover{transform:none}#project-picker button[aria-pressed=true]::before{display:none}.project-thumb{width:100%;height:72px;object-fit:cover}.project-label{padding:5px 3px 3px;gap:3px}.project-name{font-size:12px;white-space:nowrap}.project-type{font-size:10px}.project-heading{gap:16px;min-height:0;padding-bottom:22px}.project-heading h2{font-size:35px;letter-spacing:-1.1px}#description{font-size:13px}.project-meta{margin-bottom:10px}.stage{border-radius:7px}.video-play{width:50px;height:50px}.video-play span{font-size:17px}.media-toolbar{gap:10px;padding:10px 0 12px}.media-toolbar p{font-size:11px;max-width:65%}.media-navigation{gap:4px}.media-navigation>span{font-size:10px;margin-right:4px}.media-navigation button{width:30px;height:30px}#media-picker button{flex-basis:88px}#media-picker img{height:51px}#media-picker .play-label{top:12px;left:33px}.project-summary{padding-top:16px}.project-summary ul{gap:10px 18px;font-size:11px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}button,.primary{transition:none}}

#project-picker,#media-picker{position:relative}
/* A single viewport: the artwork adapts to available space. */
html,body{height:100%;overflow:hidden}body{height:100dvh}.wrap{height:100%;display:flex;flex-direction:column}.site-header{height:68px;flex:0 0 68px}.brand img{width:150px;height:auto}.library{flex:1;min-height:0;padding:24px 0 20px;gap:36px}.project-library{position:static;min-height:0;display:flex;flex-direction:column}.library-heading{flex:none;padding:0 10px 16px}#browse-projects{display:none}#project-picker{min-height:0;gap:5px;overflow:visible}#project-picker button{padding:8px 10px;min-height:0;flex:1}.project-thumb{width:62px;height:46px}.project-detail{display:flex;flex-direction:column;min-height:0;height:100%;overflow:hidden}.project-heading{flex:none;min-height:0;padding-bottom:18px;gap:20px}.project-heading h2{font-size:clamp(29px,3vw,45px);margin-bottom:9px}.project-meta{margin-bottom:9px}.project-heading-copy{min-width:0}#description{font-size:13px;line-height:1.55}.media-column{flex:1;min-height:0;display:flex;flex-direction:column}.stage{flex:1;min-height:0;aspect-ratio:auto}.stage>img,.stage>video{position:absolute;inset:0}.media-toolbar{flex:none;padding:8px 0}.media-navigation button{width:29px;height:29px}#media-picker{flex:none;gap:8px;overflow:hidden;padding:2px 2px 0;min-width:0}#media-picker button{flex:0 1 106px;min-width:0;height:64px}#media-picker img{height:43px}#media-picker .thumb-label{padding:3px 5px;font-size:8px}#media-picker .play-label{left:calc(50% - 7px);top:9px}.project-summary{flex:none;margin-top:13px;padding-top:12px;gap:20px;align-items:baseline;flex-direction:row}.project-summary ul{font-size:11px;gap:8px 16px}.project-summary h3{font-size:10px}footer{flex:none;padding:10px 0;font-size:10px}#lightbox{max-height:96dvh;overflow:hidden}#lightbox img{max-height:calc(96dvh - 110px)}
@media(min-width:761px) and (max-height:720px){.site-header{height:56px;flex-basis:56px}.library{padding:16px 0;gap:28px}.project-heading h2{font-size:31px}.project-heading{padding-bottom:12px}.project-meta{margin-bottom:6px}#project-picker button{padding:6px 8px}.project-thumb{height:38px;width:54px}.project-label{gap:3px}.project-heading h2{margin-bottom:7px}#media-picker button{height:52px}#media-picker img{height:33px}.project-summary{margin-top:9px;padding-top:9px}}
@media(min-width:761px) and (max-width:1150px){.project-heading{flex-direction:row;align-items:center;gap:16px}.project-heading h2{font-size:31px}.primary{padding:11px;font-size:11px;gap:8px}.project-summary h3{display:none}}
@media(max-width:760px){.wrap{padding:0 16px}.site-header{height:60px;flex-basis:60px}.brand img{width:128px}.header-label{font-size:8px;line-height:1.5;max-width:105px}.library{display:flex;flex-direction:column;gap:0;padding:14px 0 12px}.project-library{flex:none;margin:0 0 15px;display:block}.library-heading{padding:0;gap:8px}.library-heading h1{font-size:13px}.library-heading>span{margin-right:auto;font-size:9px}.library-heading #browse-projects{display:flex;align-items:center;gap:10px;font-size:11px;padding:7px 10px;border:1px solid var(--line);border-radius:5px;background:#1a1c20}#project-picker{display:none}.project-library.open{position:fixed;inset:74px 16px 40px;z-index:5;display:flex;flex-direction:column;padding:18px;background:#15181c;border:1px solid #414951;border-radius:10px;box-shadow:0 0 0 100vmax #000c}.project-library.open #project-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));flex:1;gap:10px;margin-top:18px;overflow:hidden}.project-library.open #project-picker button{display:flex;flex-direction:column;align-items:stretch;padding:8px;gap:6px;border:1px solid var(--line);width:100%;min-width:0}.project-library.open #project-picker button[aria-pressed=true]{border-color:var(--accent)}.project-library.open .project-thumb{width:100%;height:0;flex:1;min-height:0;object-fit:cover}.project-library.open .project-label{flex:none;gap:3px;padding:3px 0}.project-library.open .project-name{font-size:11px;white-space:normal}.project-library.open .project-type{font-size:9px}.project-detail{flex:1;min-height:0}.project-heading{flex:none;gap:12px;padding-bottom:16px;align-items:flex-start;flex-direction:column}.project-heading h2{font-size:30px;letter-spacing:-.8px;margin-bottom:8px}.project-meta{gap:8px;margin-bottom:8px}.project-meta p{font-size:9px;letter-spacing:1px}#status{font-size:8px}#description{font-size:12px;line-height:1.5;max-width:100%}.actions{align-self:stretch}.primary{padding:9px 12px;justify-content:center;font-size:11px}.stage{min-height:0;border-radius:6px;box-shadow:none}.video-play{width:48px;height:48px}.video-play span{font-size:17px}.media-toolbar{padding:7px 0;gap:5px}.media-toolbar p{font-size:10px;line-height:1.25;max-width:65%}.media-navigation>span{font-size:9px;margin-right:2px}.media-navigation button{width:26px;height:26px}.media-navigation{gap:3px}#media-picker{gap:4px;overflow:hidden}#media-picker button{flex:0 1 82px;min-width:0;height:43px;border-radius:4px}#media-picker img{height:100%;object-fit:cover}#media-picker .thumb-label{display:none}#media-picker .play-label{top:9px;left:calc(50% - 6px);font-size:15px}.project-summary{margin-top:12px;padding-top:10px;gap:0;display:block}.project-summary h3{display:none}.project-summary ul{font-size:9px;gap:5px 12px;line-height:1.4}.project-summary li{gap:5px}footer{padding:9px 0;font-size:9px}dialog{padding:43px 8px 8px}#lightbox img{max-height:calc(96dvh - 95px)}}
@media(max-width:760px) and (max-height:700px){.site-header{height:50px;flex-basis:50px}.library{padding-top:10px;padding-bottom:8px}.project-library{margin-bottom:10px}.project-heading{gap:8px;padding-bottom:10px}.project-heading h2{font-size:26px}.project-meta{margin-bottom:5px}.primary{padding:7px 10px}.project-summary{margin-top:8px;padding-top:7px}#media-picker button{height:34px}footer{padding:7px 0}}
.media-ambience{position:absolute;inset:-40px;background-size:cover;background-position:center;filter:blur(35px) brightness(.24) saturate(.65);pointer-events:none}.stage>img,.stage>video{z-index:1}.stage>button{z-index:2}.stage>p{z-index:3}.stage[aria-busy=true]::before{z-index:2}.project-library.open:focus-within{outline:none}@media(max-width:760px){#media-picker.many-views{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}#media-picker.many-views button{height:42px;width:100%;min-width:0}.library-heading{width:100%}.library-heading #browse-projects{margin-left:auto}}@media(max-width:760px) and (max-height:650px){#media-picker.many-views button{height:30px}.project-summary{font-size:9px}.project-heading h2{font-size:25px}}

@media(max-width:760px){#media-picker.many-views.nine-views{grid-template-columns:repeat(3,minmax(0,1fr))}}

:is(.stage,.lightbox-view) .viewer-arrow{position:absolute;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:44px;height:78px;padding:0 0 4px;border:1px solid #ffffff35;border-radius:8px;background:rgb(16 19 24 / 50%);color:#fff;font:36px/1 Arial,sans-serif;backdrop-filter:blur(8px);box-shadow:0 2px 12px #0003;opacity:1;transition:background .18s}:is(.stage,.lightbox-view) .viewer-prev{left:12px}:is(.stage,.lightbox-view) .viewer-next{right:12px}.stage:hover .viewer-arrow,.stage:focus-within .viewer-arrow{opacity:1}:is(.stage,.lightbox-view) .viewer-arrow:hover,:is(.stage,.lightbox-view) .viewer-arrow:focus-visible{background:rgb(16 19 24 / 65%);border-color:#ffffff90}:is(.stage,.lightbox-view) .viewer-arrow:focus-visible{outline-offset:-4px}:is(.stage,.lightbox-view) .viewer-arrow:disabled{opacity:.25}.media-navigation>span{margin-right:0}@media(max-width:760px){:is(.stage,.lightbox-view) .viewer-arrow{width:44px;height:66px;font-size:30px;opacity:1}:is(.stage,.lightbox-view) .viewer-prev{left:6px}:is(.stage,.lightbox-view) .viewer-next{right:6px}}@media(prefers-reduced-motion:reduce){:is(.stage,.lightbox-view) .viewer-arrow{transition:none}}





@media(max-width:760px){:is(.stage,.lightbox-view) .viewer-arrow{background:rgb(16 19 24 / 18%);backdrop-filter:none;border-color:#ffffff20;box-shadow:none;text-shadow:0 1px 4px #000}:is(.stage,.lightbox-view) .viewer-arrow:hover,:is(.stage,.lightbox-view) .viewer-arrow:focus-visible{background:rgb(16 19 24 / 30%);border-color:#ffffff50}}


.back-to-projects{display:none}@media(max-width:760px){html,body{height:auto;overflow:auto}body{min-height:100dvh}.wrap{height:auto;min-height:100dvh}.library{display:block;padding-top:22px}.project-library{margin-bottom:28px}.library-heading{padding-bottom:12px}.library-heading h1{font-size:19px;font-weight:600}.library-heading #browse-projects{display:none}.library-heading>span{margin-left:auto;margin-right:0}#project-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;overflow:visible;padding:0}#project-picker button{display:flex;flex-direction:row;align-items:center;gap:8px;flex:none;width:100%;min-height:76px;padding:9px;border-color:var(--line)}.project-thumb{width:44px;height:48px;flex:none}.project-label{padding:0;gap:4px}.project-name{font-size:12px;white-space:normal;line-height:1.3}.project-type{font-size:9px;line-height:1.3}.project-detail{height:auto;overflow:visible;scroll-margin-top:16px}.back-to-projects{display:block;width:fit-content;margin-bottom:18px;padding:10px 0;color:var(--accent);font-size:13px}.media-column{display:block}.stage{height:auto;min-height:0;aspect-ratio:4/3}.project-heading h2{font-size:32px}.project-summary{margin:18px 0 12px}footer{margin-top:20px;padding:18px 0}.media-toolbar p{font-size:12px}.media-navigation>span{font-size:11px}}


.lightbox-view{position:relative;touch-action:pan-y}.lightbox-view .viewer-arrow{z-index:2}#lightbox .close{z-index:3}