[hidden]{display:none!important}body.in-gallery{overflow:auto;background:#faf9f5}#gallery{min-height:100dvh;padding:0 6vw 8vw}.gallery-header{display:flex;align-items:center;justify-content:space-between;padding:36px 0 55px;gap:24px}.gallery-header button{font:400 clamp(27px,3vw,42px)/1.3 Paloma,sans-serif;border:0;background:none;padding:0}.gallery-header>span{font-size:10px;letter-spacing:.12em;text-transform:uppercase}#gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:80px 6vw;align-items:start}.gallery-piece{border:0;background:none;padding:0;text-align:left;min-width:0}.gallery-piece img{display:block;width:100%;height:clamp(200px,27vw,400px);object-fit:contain}.gallery-caption{display:flex;gap:16px;margin-top:22px;font-size:12px;line-height:1.4}.gallery-number{color:#777b73;font-size:10px}.gallery-piece:hover img{opacity:.88}.project-photo{display:block;width:100%;height:auto;margin:32px 0}.project-medium{font-size:11px;color:#686b63}dialog{width:min(1000px,94vw)}.sequence-controls button:last-child{margin-left:0}@media(max-width:800px){#gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 7vw}.gallery-header{padding:24px 0 38px}.gallery-piece img{height:33vw}}@media(max-width:480px){#gallery-grid{grid-template-columns:1fr;gap:48px}.gallery-piece img{height:65vw}.gallery-header{align-items:flex-start;flex-direction:column;gap:10px}}
/* A persistent index beside a deliberately staggered gallery. */
#gallery{padding:150px 5vw 100px 240px}.gallery-header{position:fixed;top:0;left:0;right:0;z-index:12;justify-content:center;padding:24px 3vw 18px;background:#faf9f5}.gallery-header button{font-size:clamp(40px,6.4vw,94px);line-height:1.2}.gallery-header button:focus-visible{outline-offset:2px}#project-nav{position:fixed;left:30px;top:155px;bottom:28px;width:175px;overflow:auto;z-index:10;display:block;font:11px/1.5 Arial,sans-serif}#project-nav button{display:block;text-align:left;border:0;background:none;padding:6px 0;color:#77796f;max-width:100%}#project-nav button:hover,#project-nav button[aria-current]{color:#22261f;text-decoration:underline;text-underline-offset:4px}#all-projects{margin-bottom:20px}.gallery-info{margin-top:32px}#gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:70px 4vw;align-items:start}.gallery-piece{width:85%;margin:0 auto}.gallery-piece img{height:clamp(130px,19vw,290px)}.gallery-piece:nth-child(3n+2){margin-top:125px;width:100%}.gallery-piece:nth-child(3n){margin-top:50px;width:75%}.gallery-piece:nth-child(4n){width:100%}.gallery-caption{font-size:10px;gap:8px;margin-top:13px}.gallery-number{font-size:9px}#project-view{max-width:950px;margin:0 auto;outline:none}#project-view h2{font:400 28px/1.3 Paloma,Arial,sans-serif;margin:10px 0 12px}.project-description{font:13px/1.8 Arial,sans-serif;max-width:580px}.project-photo{max-height:85vh;object-fit:contain;width:100%;margin:48px 0}@media(max-width:1000px){#gallery{padding-left:195px}#project-nav{left:22px;width:150px}#gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:50px 4vw}.gallery-piece:nth-child(n){width:90%;margin-top:0}.gallery-piece:nth-child(even){margin-top:100px;width:78%}.gallery-piece img{height:26vw}}@media(max-width:600px){.gallery-header{padding-top:24px}.gallery-header button{font-size:8vw}#gallery{padding:105px 18px 70px 132px}#project-nav{left:15px;top:110px;width:105px;font-size:10px}#gallery-grid{grid-template-columns:1fr;gap:40px}.gallery-piece:nth-child(n){width:92%;margin:0}.gallery-piece:nth-child(even){width:78%;margin-left:auto}.gallery-piece img{height:42vw}.gallery-caption{display:none}.project-photo{margin:28px 0}#project-view h2{font-size:23px}}
/* Natural image proportions: no equal-height mats or artificial padding. */
.gallery-piece img{height:auto;width:100%;max-height:none;object-fit:initial;background:none}
.gallery-piece:nth-child(6n+1){width:100%}.gallery-piece:nth-child(6n+2){width:69%}.gallery-piece:nth-child(6n+3){width:86%}.gallery-piece:nth-child(6n+4){width:76%}.gallery-piece:nth-child(6n+5){width:94%}.gallery-piece:nth-child(6n){width:61%}
@media(max-width:600px){.gallery-piece:nth-child(odd){width:94%}.gallery-piece:nth-child(even){width:73%}.gallery-piece img{height:auto}}
/* One contained environment: neither the document nor the index scrolls. */
html,body,body.in-gallery{height:100%;overflow:hidden}#gallery{position:fixed;inset:0;height:100dvh;min-height:0;padding:0;overflow:hidden}.gallery-header{height:18dvh;padding:2dvh 3vw;background:none}.gallery-header button{font-size:clamp(32px,6.4vw,86px)}#project-nav{top:22dvh;bottom:5dvh;left:3vw;width:18vw;overflow:hidden;font-size:clamp(9px,1.1vw,12px);line-height:1.2}#project-nav button{padding:clamp(3px,.65vh,7px) 0}#all-projects{margin-bottom:1.8vh}.gallery-info{margin-top:2vh}#gallery-grid{position:absolute;left:25%;right:4%;top:23%;bottom:10%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:4vh 5vw;align-items:center}.gallery-piece:nth-child(n){margin:0 auto;width:auto;max-width:100%;max-height:100%;display:flex;flex-direction:column;align-items:flex-start;min-height:0}.gallery-piece img{width:auto;height:auto;max-width:100%;max-height:21vh;object-fit:contain;flex-shrink:1;min-height:0}.gallery-piece:nth-child(3n+2){transform:translateY(3vh)}.gallery-piece:nth-child(3n){transform:translateY(-2vh)}.gallery-piece:nth-child(3n+2) img{max-height:17vh}.gallery-piece:nth-child(3n) img{max-height:24vh}.gallery-caption{font-size:10px;line-height:1.25;margin-top:10px;flex-shrink:0}.gallery-pages{position:absolute;bottom:3vh;left:25%;right:4%;display:flex;align-items:center;justify-content:center;gap:22px;font-size:10px}.gallery-pages button,.project-image-controls button{background:none;border:0;padding:8px;font-size:18px}.gallery-pages button:disabled{opacity:.25}#project-view{position:absolute;left:25%;right:4%;top:22%;bottom:5%;display:flex;flex-direction:column;min-height:0}.project-copy{flex:0 0 auto}.project-copy h2{margin:0 0 8px!important}.project-description{font-size:12px;line-height:1.5;margin:8px 0;max-width:620px}.project-medium{margin:0 0 5px}.project-photo{display:block;min-height:0;flex:1;max-height:100%;height:0;width:100%;object-fit:contain;margin:16px 0 0}.project-image-controls{display:flex;gap:18px;align-items:center;justify-content:center;min-height:32px;font-size:10px}@media(max-width:600px){.gallery-header{height:15vh}.gallery-header button{font-size:8vw}#project-nav{top:19%;width:26%;left:3%;font-size:9px}#project-nav button{padding:.65vh 0}#gallery-grid{left:34%;right:5%;top:21%;bottom:10%;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:3vh 4vw}.gallery-piece img,.gallery-piece:nth-child(3n) img,.gallery-piece:nth-child(3n+2) img{max-height:15vh}.gallery-caption{display:none}.gallery-pages{left:34%}#project-view{left:34%;right:4%;top:20%}.project-copy h2{font-size:19px!important}.project-description{font-size:10px}.project-medium{font-size:9px}}
.nav-pages{display:flex;gap:22px}#project-nav .nav-pages button{font-size:16px}.nav-pages button:disabled{opacity:.25}
/* Ordered, continuously scrolling catalogue with shared caption baselines. */
#gallery-grid{top:22%;bottom:3%;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:clamp(230px,36vh,340px);gap:36px 4vw;align-items:stretch;padding:6px 6px 30px}#gallery-grid::-webkit-scrollbar{display:none}.gallery-piece:nth-child(n){display:grid;grid-template-rows:minmax(0,1fr) 34px;transform:none;margin:0;width:100%;height:100%;max-height:none;align-items:center;justify-items:center}.gallery-piece img,.gallery-piece svg,.gallery-piece:nth-child(3n) img,.gallery-piece:nth-child(3n+2) img{grid-row:1;width:auto;height:auto;max-width:100%;max-height:26vh;object-fit:contain;display:block;align-self:center;justify-self:center}.gallery-piece:nth-child(3n+2) img,.gallery-piece:nth-child(3n+2) svg{max-width:82%}.gallery-piece:nth-child(3n) img,.gallery-piece:nth-child(3n) svg{max-width:94%}.gallery-caption{display:flex;align-self:end;justify-self:stretch;align-items:baseline;height:30px;margin:0;font-size:11px;line-height:1.3;gap:10px}.gallery-number{font-size:10px;flex-shrink:0}.gallery-pages{display:none!important}
.project-copy{text-align:center;max-width:760px;margin:0 auto;width:100%;padding:0 0 12px}.project-copy h2{font-size:30px!important}.project-medium{white-space:pre-line;font-size:12px;line-height:1.6}.project-description{margin:10px auto}.project-photo{display:flex;align-items:center;justify-content:center;overflow:hidden}.project-photo>img,.project-photo>svg{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}.source-photo{overflow:hidden}
#project-nav{border-left:1px solid #deded6;padding-left:16px}#project-nav button{position:relative;transition:color .2s;padding:7px 0}#project-nav button:hover,#project-nav button[aria-current]{text-decoration:none;color:#262922}#project-nav button[aria-current]::before{content:'';position:absolute;width:5px;height:5px;background:currentColor;border-radius:50%;left:-19px;top:50%;transform:translateY(-50%)}#project-links>button{display:flex;gap:10px;align-items:baseline}#project-links>button::after{content:attr(data-index);font-size:9px;color:#a3a69b;margin-left:auto}#all-projects{margin-bottom:16px}.gallery-info{border-top:1px solid #deded6;padding-top:12px;margin-top:22px}
#project-view.about-view{display:grid;grid-template-columns:minmax(180px,.8fr) minmax(0,1.2fr);gap:35px;align-items:start;overflow:auto;scrollbar-width:none;padding:8px 0 25px}#project-view.about-view::-webkit-scrollbar{display:none}.about-portrait{width:100%;height:auto;max-height:60vh;object-fit:contain}.about-copy{font-size:13px;line-height:1.85}.about-copy h2{font:400 32px Paloma,sans-serif;margin-top:0}.about-copy a{color:inherit;text-underline-offset:4px}.academic-link{border:0;background:none;border-bottom:1px solid #a4a79d;padding:5px 0;color:inherit;cursor:pointer;margin-top:15px}
@media(max-width:800px){#gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:240px}.gallery-piece img,.gallery-piece svg,.gallery-piece:nth-child(3n) img,.gallery-piece:nth-child(3n+2) img{max-height:180px}#project-view.about-view{grid-template-columns:1fr}.about-portrait{max-width:240px;margin:auto}.about-copy{font-size:12px}#project-nav button{padding:6px 0}}
@media(max-width:600px){#gallery-grid{grid-template-columns:1fr;grid-auto-rows:240px;gap:25px;top:20%}.gallery-caption{display:flex;font-size:10px}.gallery-piece img,.gallery-piece svg,.gallery-piece:nth-child(3n) img,.gallery-piece:nth-child(3n+2) img{max-height:190px}.project-copy h2{font-size:23px!important}.project-medium{font-size:10px}#project-nav{padding-left:10px}#project-nav button[aria-current]::before{left:-13px}#project-links>button::after{display:none}}
/* A quiet transport symbol and a portrait-led introduction. */
#play{width:34px;height:34px;padding:2px;display:flex;align-items:center;justify-content:center;font-family:Paloma,sans-serif;font-size:26px;line-height:1;letter-spacing:-3px}#play svg{width:20px;height:20px;display:block}#play span{display:block;transform:rotate(-3deg)}
#project-view.about-view{display:block;max-width:630px;padding:18px 15px 40px;margin:0 auto}.about-introduction{position:relative;margin:26px auto 24px;width:min(100%,440px);padding-top:12px}.about-introduction h2{position:absolute;left:50%;top:-26px;transform:translateX(-50%) rotate(-3deg);z-index:2;width:115%;margin:0!important;text-align:center;font:400 clamp(32px,4.2vw,58px)/1.25 Paloma,sans-serif!important;white-space:nowrap}.about-introduction .about-portrait{display:block;width:100%;max-width:none;max-height:none;height:auto}.about-copy{width:100%;max-width:560px;margin:0 auto;font-size:13px;line-height:1.85}.about-copy p:first-child{margin-top:0}@media(max-width:600px){#project-view.about-view{padding:18px 2px 25px}.about-introduction h2{font-size:6vw!important;width:120%;top:-12px}.about-copy{font-size:11px;line-height:1.75}.about-introduction{margin-top:12px}}
/* The works are the index; only essential navigation remains above them. */
#project-nav{top:17dvh;bottom:auto;left:6%;right:6%;width:auto;display:flex;justify-content:space-between;align-items:center;border:0;padding:0;overflow:visible}
#project-nav #all-projects{margin:0}
#project-nav .gallery-info{margin:0;padding:0;border:0}
#project-nav button[aria-current]::before{display:none}
#project-nav button[aria-current]{text-decoration:underline;text-underline-offset:4px}
#gallery-grid,#project-view{left:6%;right:6%;top:25%}
#project-view{max-width:1050px;margin:0 auto}
.project-description{white-space:pre-line}
@media(max-width:600px){#project-nav{top:15dvh;font-size:11px}#gallery-grid,#project-view{top:23%}.about-introduction h2{font-size:9vw!important}}

.project-photo>.project-video{width:100%;height:100%;max-height:100%;border:0;object-fit:contain}.project-photo>iframe.project-video{aspect-ratio:16/9;height:auto;max-height:100%}

.project-photo{container-type:size}.project-photo>iframe.project-video{flex:none;width:min(100cqw,177.7778cqh);height:min(56.25cqw,100cqh);aspect-ratio:16/9}.project-photo>video.project-video{width:100%;height:100%;object-fit:contain}

/* Center each catalogue caption beneath its image. */
.gallery-caption{justify-content:center;text-align:center}
/* The CV unfolds within About, without opening a modal. */
.cv-section{margin-top:30px;border-top:1px solid #d9d9d1;border-bottom:1px solid #d9d9d1}
.cv-section summary{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:18px 0;font:12px/1.4 Arial,sans-serif;list-style:none}
.cv-section summary::-webkit-details-marker{display:none}
.cv-section summary::after{content:'+';font-size:19px;font-weight:400}
.cv-section[open] summary::after{content:'−'}
.cv-content{padding:0 0 20px}.cv-download{display:inline-block;margin-bottom:18px}.cv-preview{display:block;width:100%;height:65vh;border:0}.cv-text{white-space:pre-wrap}.cv-pending{color:#77796f;margin:0}
.cv-text{white-space:normal}.cv-text h3{font:400 14px/1.5 Arial,sans-serif;margin:25px 0 12px}.cv-entry{display:grid;grid-template-columns:38px minmax(0,1fr);gap:12px;margin:0 0 10px;font-size:12px;line-height:1.65}.cv-year{color:#77796f}.cv-collection{margin:0 0 7px;font-size:12px}
/* Archive typography study: typed records alongside the handwritten identity. */
:root{--record-font:'Courier New',Courier,monospace;--record-ink:#394963;--record-label:#30362f}
#project-nav{font-family:var(--record-font);font-size:11px;line-height:1.5}
#project-nav button{color:var(--record-label)}
.gallery-caption{font-family:var(--record-font);font-size:11px;line-height:1.45;color:var(--record-ink);gap:12px}
.gallery-number{font-family:var(--record-font);font-size:10px;color:#767b74;font-variant-numeric:tabular-nums}
.about-copy{font-family:var(--record-font);font-size:13px;line-height:1.7;color:var(--record-ink);max-width:560px}
.about-copy p{margin:0 0 20px}
.about-copy a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
.academic-link{font:11px/1.5 var(--record-font);color:var(--record-label);border:0;text-decoration:underline;text-underline-offset:4px;margin-top:4px}
.cv-section{margin-top:28px;border-top:1px solid #d9d9d1;border-bottom:0}
.cv-section summary{font:12px/1.5 var(--record-font);color:var(--record-label);padding:16px 0}
.cv-download{font:11px/1.5 var(--record-font)}
.cv-text h3{font:700 11px/1.5 var(--record-font);color:var(--record-label);margin:32px 0 16px;max-width:45ch}
.about-copy .cv-entry{font:12px/1.55 var(--record-font);grid-template-columns:42px minmax(0,1fr);gap:14px;margin:0 0 12px}
.cv-year{color:var(--record-label);font-variant-numeric:tabular-nums}
.about-copy .cv-collection{font:12px/1.55 var(--record-font);margin:0 0 7px}
.project-medium,.project-description,.project-image-controls{font-family:var(--record-font);color:var(--record-ink)}
.project-medium,.project-description{font-size:12px;line-height:1.65}
@media(max-width:600px){.about-copy{font-size:12px;line-height:1.65}.gallery-caption{font-size:10px}.about-copy .cv-entry{font-size:11px;grid-template-columns:34px minmax(0,1fr);gap:10px}}

/* Cleaner archive lettering: no typewriter serifs. */
:root{--record-font:Consolas,'Lucida Console',monospace}
/* Typography reference study: locally hosted IBM Plex Mono. */
@font-face{font-family:'IBM Plex Mono';src:url('assets/ibm-plex-mono-regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('assets/ibm-plex-mono-medium.ttf') format('truetype');font-weight:500 700;font-style:normal;font-display:swap}
:root{--record-font:'IBM Plex Mono',monospace;--record-ink:#30352e;--record-label:#252a24}
.about-copy{font-size:12px;line-height:1.8}
.cv-text h3{font-weight:500;font-size:12px;letter-spacing:0}
.about-copy .cv-entry{font-size:11px;line-height:1.7}
@media(max-width:600px){.about-copy{font-size:11px}.about-copy .cv-entry{font-size:10px}}
/* Two parallel archive sections, each opening in place. */
#project-view.about-view{max-width:980px}
.about-records{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;margin:42px auto 0;font:12px/1.7 var(--record-font);color:var(--record-ink);align-items:start}
.about-records>details{min-width:0;margin:0;border-top:1px solid #c8cbc2;border-bottom:0}
.about-records summary{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:18px 0 22px;cursor:pointer;list-style:none;font:500 12px/1.5 var(--record-font);color:var(--record-label)}
.about-records summary::-webkit-details-marker{display:none}
.about-records summary::after{content:'+';font:400 18px/1 var(--record-font)}
.about-records details[open]>summary::after{content:'−'}
.academic-entries{counter-reset:paper}
.academic-entry{counter-increment:paper;display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;margin:0 0 30px}
.academic-entry::before{content:counter(paper,decimal-leading-zero);font-size:10px;color:#777c72;padding-top:3px}
.academic-entry p{margin:0;font:12px/1.8 var(--record-font)}
.academic-entry em{font-style:italic}
.academic-entry a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px;overflow-wrap:anywhere}
.academic-entry a::after{content:' ↗'}
.about-records .cv-text h3:first-child{margin-top:0}
.about-records .cv-entry{font:11px/1.7 var(--record-font);grid-template-columns:36px minmax(0,1fr);gap:12px;margin:0 0 12px}
.about-records .cv-collection{font:11px/1.7 var(--record-font)}
@media(max-width:650px){.about-records{grid-template-columns:1fr;gap:26px;margin-top:30px}.academic-entry p{font-size:11px}}
/* Editorial archive study: portrait and text form one composed spread. */
#project-view.about-view{max-width:1120px;padding:32px 0 60px}
.about-layout{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1fr);column-gap:7%;align-items:start}
.about-layout .about-introduction{width:100%;margin:20px 0 0;padding:0}
.about-layout .about-introduction h2{font-size:clamp(31px,4.1vw,58px)!important;top:-31px;left:48%;width:115%;transform:translateX(-50%) rotate(-3deg)}
.about-layout .about-portrait{width:100%;height:auto;display:block}
.about-layout .about-copy{width:100%;max-width:none;margin:12px 0 0;font:400 12px/1.65 var(--record-font);color:#272d26}
.about-layout .about-copy p{margin:0 0 22px}
.about-layout .about-copy p:first-child{font-size:13px;line-height:1.55;letter-spacing:-.02em}
.about-layout .about-copy a{overflow-wrap:anywhere}
.about-records{margin-top:48px;column-gap:7%;grid-template-columns:minmax(0,.86fr) minmax(0,1fr)}
.about-records>details{border-top:1px solid #8c9187}
.about-records summary{font-size:15px;font-weight:400;padding:18px 0 28px;letter-spacing:-.02em}
.about-records summary::after{content:'[+]';font-size:12px}
.about-records details[open]>summary::after{content:'[−]'}
.academic-entry{grid-template-columns:22px minmax(0,1fr);gap:12px;margin-bottom:30px}
.academic-entry p{font-size:12px;line-height:1.65}
.academic-entry::before{font-size:10px}
.about-records .cv-entry{font-size:12px;line-height:1.6;grid-template-columns:38px minmax(0,1fr);gap:12px;margin-bottom:14px}
.cv-text h3{font-size:12px;font-weight:500;line-height:1.5;margin:30px 0 16px}
.about-records .cv-collection{font-size:12px;line-height:1.6}
#project-nav{font-size:12px}
@media(max-width:700px){#project-view.about-view{padding-top:26px}.about-layout{grid-template-columns:1fr;gap:26px}.about-layout .about-introduction{width:84%;max-width:440px;margin:20px auto 0}.about-layout .about-introduction h2{font-size:8vw!important;top:-24px}.about-layout .about-copy{max-width:560px;margin:0 auto;font-size:12px}.about-layout .about-copy p:first-child{font-size:13px}.about-records{grid-template-columns:1fr;gap:24px;margin-top:28px}}
/* Squarer archive typography; handwritten identity remains Paloma. */
@font-face{font-family:'Roboto Mono';src:url('assets/roboto-mono.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
:root{--record-font:'Roboto Mono',monospace}
.about-layout .about-copy,.academic-entry p,.about-records .cv-entry{font-weight:400;letter-spacing:-.035em}
.about-records summary,.cv-text h3{font-weight:500;letter-spacing:-.025em}
.project-references{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;max-width:820px;margin:22px auto 40px}
.project-reference{position:relative;display:flex;align-items:center;justify-content:center;width:76px;height:76px;padding:5px;border:1px solid transparent;background:none;cursor:pointer;opacity:.65;transition:opacity .15s,border-color .15s}
.project-reference img,.project-reference svg{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.project-reference:hover,.project-reference[aria-pressed="true"]{opacity:1}
.project-reference[aria-pressed="true"]{border-color:#777c72}
.project-reference:focus-visible{outline:2px solid #30352e;outline-offset:3px}
.reference-play{position:absolute;inset:0;display:grid;place-items:center;font:28px/1 sans-serif;color:white;text-shadow:0 1px 5px #222}
@media(max-width:600px){.project-references{gap:9px}.project-reference{width:60px;height:60px}}
#project-view:not(.about-view){overflow-y:auto;scrollbar-width:none;padding-bottom:24px}
#project-view:not(.about-view)::-webkit-scrollbar{display:none}
#project-view:not(.about-view) .project-photo{flex:0 0 clamp(240px,46dvh,620px);height:clamp(240px,46dvh,620px);max-height:none}
.project-image-controls,.project-references{flex-shrink:0}
/* Museum catalogue study: proportional sans serif and a travelling portrait. */
:root{--record-font:'Helvetica Neue',Helvetica,Arial,sans-serif;--record-ink:#292b27;--record-label:#292b27}
.about-layout .about-copy{font:400 15px/1.6 var(--record-font);letter-spacing:0}
.about-layout .about-copy p:first-child{font-size:15px;line-height:1.6;letter-spacing:0}
.about-reading{min-width:0}
.about-reading .about-records{margin-top:36px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
.about-records summary{font-size:15px;font-weight:500;letter-spacing:0;padding:16px 0 24px}
.about-records summary::after{content:'+';font-size:18px;font-weight:400}
.about-records details[open]>summary::after{content:'−'}
.academic-entry p,.about-records .cv-entry,.about-records .cv-collection{font:400 13px/1.55 var(--record-font);letter-spacing:0}
.cv-text h3{font:600 13px/1.4 var(--record-font);letter-spacing:0}
.about-records .cv-entry{grid-template-columns:34px minmax(0,1fr);gap:8px}
.gallery-caption{font-size:13px;letter-spacing:0}
.gallery-number{font-size:11px}
#project-nav{font-size:12px;letter-spacing:.035em}
@media(min-width:760px) and (min-height:560px){.about-layout .about-introduction{position:sticky;top:36px;align-self:start}.about-layout .about-portrait{max-height:calc(70dvh - 95px);object-fit:contain;object-position:top}}
@media(max-width:700px){.about-layout .about-copy,.about-layout .about-copy p:first-child{font-size:14px;line-height:1.6}.about-reading .about-records{gap:20px}}
@media(max-width:420px){.about-reading .about-records{grid-template-columns:1fr}}
/* Both headings stay side by side; the open record uses the full reading width. */
@media(min-width:421px){.about-reading .academic-entries,.about-reading .cv-content{width:calc(200% + 24px)}.about-reading .cv-content{margin-left:calc(-100% - 24px)}}
@media(min-width:421px) and (max-width:700px){.about-reading .academic-entries,.about-reading .cv-content{width:calc(200% + 20px)}.about-reading .cv-content{margin-left:calc(-100% - 20px)}}
/* The greeting lifts away as the biography scrolls; records remain below. */
.about-layout .about-introduction h2{transform:translateX(calc(-50% + var(--greeting-drift,0px))) translateY(var(--greeting-rise,0px)) rotate(-3deg);will-change:transform,opacity;pointer-events:none}
@media(prefers-reduced-motion:reduce){.about-layout .about-introduction h2{transform:translateX(-50%) rotate(-3deg);opacity:1!important;will-change:auto}}
/* End the portrait's sticky travel at the final biography line. */
.about-layout .about-copy>p:last-child{margin-bottom:0}
.about-layout .about-introduction{margin-bottom:0}
/* Let catalogue images travel behind the floating identity. */
.gallery-header{background:transparent;pointer-events:none}
.gallery-header button{background:transparent;pointer-events:auto;text-shadow:none}
#gallery-grid{top:0;padding-top:25dvh}
@media(max-width:600px){#gallery-grid{top:0;padding-top:23dvh}}
.stage h1{background:transparent;text-shadow:none}
/* Edge navigation has its own clear margins; the index keeps its existing grid. */
#project-nav{left:16px;right:16px;pointer-events:none}
#project-nav button{pointer-events:auto}
#gallery-grid{left:max(72px,6%);right:max(72px,6%)}
#project-view:not(.about-view){left:max(72px,6%);right:max(72px,6%);max-width:1280px}
#project-view:not(.about-view) .project-photo{flex-basis:clamp(320px,66dvh,860px);height:clamp(320px,66dvh,860px)}
@media(max-width:600px){#project-nav{left:10px;right:10px}#gallery-grid,#project-view:not(.about-view){left:60px;right:60px}#project-view:not(.about-view) .project-photo{flex-basis:56dvh;height:56dvh}}

/* Shared, transparent identity: centered on narrow screens too. */
.gallery-header{flex-direction:row;align-items:center;justify-content:center;background:transparent}
#return-landing{appearance:none;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;border:0;box-shadow:none;text-align:center}
#return-landing:focus:not(:focus-visible){outline:none}
#gallery-grid:focus{outline:none}
@media(max-width:600px){.gallery-header{left:0;right:0;width:100%;padding:2dvh 16px;align-items:center;justify-content:center}.gallery-header button{margin:0 auto;text-align:center}}

/* Local composition preview: artwork first, caption beneath, floating identity. */
#project-view:not(.about-view){top:0;bottom:0;padding-top:21dvh;padding-bottom:64px;left:max(72px,7%);right:max(72px,7%)}
#project-view:not(.about-view) .project-photo{flex:0 0 59dvh;height:59dvh;margin:0 0 26px}
#project-view:not(.about-view) .project-copy{padding:0;max-width:620px}
#project-view:not(.about-view) .project-copy h2{font:400 19px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif!important;letter-spacing:0;margin:0 0 10px!important}
#project-view:not(.about-view) .project-description{font:400 13px/1.6 "Helvetica Neue",Helvetica,Arial,sans-serif;white-space:pre-line;max-width:520px;margin:10px auto 18px}
#project-view:not(.about-view) .project-image-controls{margin-top:16px;flex-shrink:0}
#project-view:not(.about-view) .project-references{flex-shrink:0;margin-top:14px}
@media(max-width:600px){#project-view:not(.about-view){left:48px;right:48px;padding-top:22dvh;padding-bottom:40px}#project-view:not(.about-view) .project-photo{flex-basis:52dvh;height:52dvh;margin-bottom:22px}#project-view:not(.about-view) .project-copy h2{font-size:17px!important}}/* Keep project titles in the portfolio's handwritten typeface. */
#project-view:not(.about-view) .project-copy h2{font:400 clamp(26px,3vw,36px)/1.35 Paloma,sans-serif!important;letter-spacing:0}
@media(max-width:600px){#project-view:not(.about-view) .project-copy h2{font-size:28px!important}}/* Local study: numbered contact sheet. */
#project-view:not(.about-view) .project-references{gap:26px;align-items:end;margin:28px auto 40px;max-width:100%;padding:8px 4px}
.project-reference{display:grid;grid-template-rows:92px 24px;justify-items:center;align-items:end;width:auto;min-width:58px;max-width:140px;height:128px;padding:0 0 8px;border:0;border-bottom:1px solid transparent;opacity:.72;flex:0 0 auto}
.project-reference img,.project-reference svg{grid-row:1;max-height:92px;max-width:140px;width:auto;height:auto;align-self:end}
.project-reference[aria-pressed="true"]{border:0;border-bottom:1px solid #343a32;opacity:1}
.reference-number{grid-row:2;align-self:end;font:10px/1.2 Arial,sans-serif;letter-spacing:.08em;color:#757a70}
.project-reference[aria-pressed="true"] .reference-number{color:#262b24}
.project-reference .reference-play{top:35%;bottom:auto;left:50%;transform:translate(-50%,-50%)}
@media(max-width:600px){#project-view:not(.about-view) .project-references{width:100%;max-width:100%;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;gap:22px;padding:8px 4px 14px;scroll-snap-type:x proximity;scrollbar-width:thin}.project-reference{grid-template-rows:84px 24px;height:120px;max-width:128px;scroll-snap-align:start}.project-reference img,.project-reference svg{max-width:128px;max-height:84px}}
/* Video references are explicit, even without hovering. */
.project-reference .reference-play{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(250,249,245,.94);color:#252a24;font:17px/1 Arial,sans-serif;box-shadow:0 1px 5px #0002;pointer-events:none}
.reference-number{white-space:nowrap}
/* Composition study: one supporting band below the artwork. */
.project-caption-band{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:32px;align-items:start;flex:0 0 auto;width:100%;padding:6px 0 0}
#project-view:not(.about-view) .project-caption-band .project-copy{text-align:left;max-width:none;margin:0}
#project-view:not(.about-view) .project-caption-band .project-copy h2{font-size:clamp(25px,2.8vw,34px)!important;line-height:1.25;margin:0 0 16px!important}
#project-view:not(.about-view) .project-caption-band .project-description{margin:0;max-width:34em;color:#5c6159}
#project-view:not(.about-view) .project-caption-band .project-references{margin:0;padding:0;gap:20px;justify-content:flex-end;align-items:end;max-width:100%;width:100%}
.project-caption-band .project-reference{grid-template-rows:66px 22px;height:98px;min-width:48px;max-width:100px}
.project-caption-band .project-reference img,.project-caption-band .project-reference svg{max-width:100px;max-height:66px}
@media(max-width:650px){.project-caption-band{grid-template-columns:1fr;gap:24px;padding-top:0}#project-view:not(.about-view) .project-caption-band .project-references{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding-bottom:12px;gap:20px}.project-caption-band .project-reference{grid-template-rows:76px 22px;height:108px;max-width:116px}.project-caption-band .project-reference img,.project-caption-band .project-reference svg{max-width:116px;max-height:76px}}
/* Centered text beside the artwork; references stay directly under the image. */
#project-view.project-composition:not(.about-view){display:grid;grid-template-columns:minmax(160px,.65fr) minmax(0,1.65fr);grid-template-rows:auto auto 1fr;column-gap:40px;row-gap:22px;align-content:start;padding-top:23dvh}
#project-view.project-composition .project-copy{grid-column:1;grid-row:1;align-self:end;text-align:center;margin:0 auto;padding:0;width:100%}
#project-view.project-composition .project-copy h2{font-size:clamp(26px,3vw,36px)!important;text-align:center}
#project-view.project-composition .project-photo{grid-column:2;grid-row:1 / span 2;width:100%;height:55dvh;min-height:260px;margin:0;align-self:start}
#project-view.project-composition>.project-description{grid-column:1;grid-row:2;text-align:center;margin:0 auto;max-width:32em;align-self:start}
#project-view.project-composition .project-references{grid-column:2;grid-row:3;margin:0 auto;padding:0;justify-content:center;gap:22px;width:100%}
@media(max-width:700px){#project-view.project-composition:not(.about-view){grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto;gap:22px;padding-top:21dvh}#project-view.project-composition .project-copy{grid-column:1;grid-row:1;align-self:start}#project-view.project-composition .project-photo{grid-column:1;grid-row:2;height:48dvh;min-height:220px}#project-view.project-composition .project-references{grid-column:1;grid-row:3;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding:0 0 12px}#project-view.project-composition>.project-description{grid-column:1;grid-row:4;text-align:center}}
#project-view.project-composition:not(.about-view){grid-template-rows:max-content max-content max-content}
@media(max-width:700px){#project-view.project-composition:not(.about-view){grid-template-rows:max-content max-content max-content max-content}#project-view.project-composition .project-references{min-height:148px}}
.project-composition .project-reference{min-height:128px}.project-composition .project-reference img,.project-composition .project-reference svg{min-height:0}
/* Keep the contact sheet at its natural height inside the scrolling page. */
#project-view.project-composition .project-references{height:auto;min-height:150px;overflow-y:visible;align-self:start;align-items:flex-start}
#project-view.project-composition .project-reference{height:128px;min-height:128px;max-height:none;grid-template-rows:92px 24px;align-content:start;flex-shrink:0}
#project-view.project-composition .project-reference img,#project-view.project-composition .project-reference svg{height:auto;max-height:92px;max-width:140px;align-self:end}
/* About uses the full-height scroll area so its content can pass behind the name. */
#project-view.about-view{top:0;bottom:0;padding-top:25dvh;padding-bottom:60px;background:transparent}
.gallery-header,.gallery-header button{background:transparent!important;backdrop-filter:none;box-shadow:none}
@media(max-width:700px){#project-view.about-view{padding-top:25dvh}}
/* Center short contact sheets; allow larger sets to scroll from the first item. */
#project-view.project-composition .project-references{justify-content:safe center}
#project-view.project-composition .project-copy h2{will-change:opacity}
@media(prefers-reduced-motion:reduce){#project-view.project-composition .project-copy h2{will-change:auto}}
/* Image-only projects keep a centered title and contact sheet. */
#project-view.project-composition:not(.about-view):not(:has(>.project-description)){grid-template-columns:minmax(0,1fr);grid-template-rows:max-content max-content max-content}
#project-view.project-composition:not(:has(>.project-description)) .project-copy{grid-column:1;grid-row:1;align-self:start;max-width:900px}
#project-view.project-composition:not(:has(>.project-description)) .project-photo{grid-column:1;grid-row:2;justify-self:center;max-width:1050px}
#project-view.project-composition:not(:has(>.project-description)) .project-references{grid-column:1;grid-row:3;justify-self:center;max-width:1050px}
/* Navigation shares the floating identity's center line. */
#project-nav{top:9dvh;left:16px;right:16px;transform:translateY(-50%);z-index:13}
#project-nav button{min-height:44px;padding:10px 4px;background:transparent;border:0;border-radius:0;font:700 10px/1.2 var(--record-font);letter-spacing:.06em;text-align:center}
#project-nav button:hover,#project-nav button[aria-current]{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
#project-nav button:focus-visible{outline:2px solid #30352e;outline-offset:3px}
@media(max-width:600px){#project-nav{left:8px;right:8px}#project-nav button{font-size:9px;padding:10px 2px}.gallery-header button{font-size:6.2vw}}
