*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);overflow-x:clip}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button,a,input{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button:disabled{opacity:.45;cursor:wait}.skip{position:fixed;top:-80px;z-index:9;background:var(--bg);padding:15px}.skip:focus{top:0}.topbar{height:72px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 4vw}.wordmark{font:25px var(--serif)}.edition,.eyebrow{font:10px var(--mono);text-transform:uppercase;letter-spacing:.15em;color:var(--accent)}.topbar nav{display:flex;gap:25px;font-size:12px;color:var(--dim)}.topbar .active{color:var(--text);border-bottom:1px solid var(--accent);padding:10px 0}.intro{display:flex;justify-content:space-between;align-items:flex-end;padding:32px 4vw 24px}.intro h1{font:clamp(36px,4vw,64px)/.98 var(--serif);font-weight:400;letter-spacing:-.035em;margin:12px 0 0}.intro h1 em{font-weight:400;color:var(--accent)}.intro>p{font-size:12px;line-height:1.8;color:var(--dim);margin:0}.mobile-break{display:none}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 4vw 18px;font:11px var(--mono)}.lenses,.tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.lenses>span{color:var(--dim);margin-right:15px}.lenses button{padding:10px 15px;border:1px solid var(--border);border-radius:2px}.lenses button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--bg)}.tools button{padding:10px;color:var(--dim)}.tools button[aria-pressed=true]{color:var(--accent)}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 290px;margin:0 4vw;border:1px solid var(--border);min-width:0}.stage{position:relative;height:clamp(470px,56vh,690px);min-width:0;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,var(--surface),var(--bg) 72%)}#canvas-host{position:absolute;inset:0}canvas{display:block;width:100%;height:100%;touch-action:pan-y}#labels{position:absolute;inset:0;pointer-events:none}.stage-top,.stage-bottom{position:absolute;left:22px;right:22px;display:flex;justify-content:space-between;gap:12px;font:9px/1.6 var(--mono);color:var(--dim);pointer-events:none}.stage-top{top:16px}.stage-bottom{bottom:16px}.stage-bottom button{pointer-events:auto;color:var(--accent)}#render-state{max-width:180px;text-align:right}#render-state[data-status=ready]{color:var(--accent)}.metanode{position:absolute;left:0;top:0;pointer-events:auto;text-align:center;white-space:nowrap;padding:8px 12px;max-width:260px}.metanode small{display:block;font:8px var(--mono);letter-spacing:.13em;color:var(--accent);margin-bottom:5px}.metanode strong{font:24px var(--serif);font-weight:400}.metanode.selected strong{color:var(--accent)}.project-node{position:absolute;left:0;top:0;pointer-events:auto;text-align:left;width:106px;padding:0;transition:opacity .3s;will-change:transform}.project-node img{display:block;width:106px;height:61px;object-fit:cover;border:1px solid var(--border);box-shadow:0 6px 15px var(--shadow);filter:saturate(.7);transition:border-color .2s,filter .2s}.project-node span{display:block;font-size:9px;margin-top:7px;white-space:nowrap;text-shadow:0 2px 5px var(--shadow)}.project-node[aria-pressed=true] img,.project-node:hover img{border-color:var(--accent);filter:saturate(1)}.project-node[aria-pressed=true] span{color:var(--accent)}.project-node.dimmed{opacity:.16}.detail{border-left:1px solid var(--border);padding:24px;min-width:0;background:var(--bg)}.detail h2{font:34px/1.03 var(--serif);letter-spacing:-.02em;font-weight:400;margin:18px 0}.detail p{font-size:11px;line-height:1.8;color:var(--dim)}.detail .detail-image{width:100%;aspect-ratio:16/10;object-fit:cover;margin:5px 0 8px}.detail .rule{height:1px;background:var(--border);margin:22px 0}.detail .detail-link{display:block;font:11px var(--mono);padding:12px 0;color:var(--accent);line-height:1.6}.detail .collection-link{display:block;text-align:left;width:100%;font:19px var(--serif);border-bottom:1px solid var(--border);padding:13px 0}.detail .collection-link small{font:9px var(--mono);color:var(--dim);float:right;margin-top:6px}.detail .reason{border-left:1px solid var(--accent);padding-left:12px}.detail .sample-label{font:9px/1.7 var(--mono);color:var(--accent)}.sample-button{display:block;border:1px solid var(--border);width:100%;padding:12px;text-align:left;font:11px var(--mono);margin:14px 0}.sample-button:hover{border-color:var(--accent)}.sample-tools{display:grid;gap:10px}.sample-tools label{font:10px var(--mono);color:var(--dim);display:flex;justify-content:space-between;gap:10px}.sample-tools input{width:100px;accent-color:var(--accent)}.index-strip{display:flex;gap:24px;margin:20px 4vw;padding:0 0 18px;border-bottom:1px solid var(--border)}.index-label{min-width:105px;padding-top:6px}.index-label h2{font:21px var(--serif);margin:0 0 6px}.index-label span{font:8px var(--mono);color:var(--dim)}#project-buttons{display:flex;flex:1;gap:8px;flex-wrap:wrap}#project-buttons button{padding:9px 12px;border:1px solid var(--border);font-size:10px;border-radius:2px}#project-buttons button[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}footer{margin:0 4vw 22px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font:9px var(--mono);color:var(--dim)}footer button{font:inherit;color:var(--accent)}dialog{background:var(--bg);color:var(--text);border:1px solid var(--border);max-width:580px;width:calc(100% - 32px);padding:32px}dialog::backdrop{background:var(--shadow);opacity:.8}dialog h2{font:38px/1.1 var(--serif);font-weight:400}dialog p{font-size:13px;line-height:1.7;color:var(--dim)}dialog a{color:var(--accent);text-decoration:underline}.close{float:right;font:11px var(--mono)}.noscript{padding:20px}.sample-mode .project-node,.sample-mode .metanode{display:none}.fallback #labels{display:flex;gap:15px;flex-wrap:wrap;padding:70px 25px;align-content:start}.fallback .project-node{position:static;transform:none!important}.fallback .metanode{display:none}
@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) 330px}.detail{padding:30px}.project-node,.project-node img{width:125px}.project-node img{height:73px}}
@media(max-width:1050px){.workspace{grid-template-columns:minmax(0,1fr) 245px}.detail{padding:19px}.detail h2{font-size:29px}.metanode strong{font-size:21px}.project-node,.project-node img{width:86px}.project-node img{height:50px}.stage-top{font-size:8px}.edition{display:none}}
@media(max-width:760px){.intro{padding-top:25px}.intro>p{display:none}.toolbar{align-items:flex-start;flex-wrap:wrap;gap:9px}.lenses>span{display:none}.tools{margin-left:auto}.lenses button{padding:10px}.workspace{grid-template-columns:minmax(0,1fr)}.stage{height:700px}.detail{border-left:0;border-top:1px solid var(--border);padding:22px;min-height:190px}.detail h2{font-size:34px;margin:10px 0}.detail .detail-image{float:right;width:37%;margin:0 0 10px 20px}.detail .rule{margin:14px 0}.detail .collection-link{font-size:22px;padding:9px 0}.detail .detail-link{clear:both}.index-strip{display:block}.index-label{margin-bottom:12px}.index-label h2{display:inline;margin-right:10px}.project-node,.project-node img{width:88px}.project-node img{height:49px}.project-node span{font-size:8px}.metanode strong{font-size:24px}.stage-top{left:15px;right:15px}.stage-top #lens-note{max-width:145px}.stage-bottom{left:15px;right:15px;font-size:8px}.topbar{height:60px}.topbar nav{gap:14px;font-size:11px}.wordmark{font-size:23px}.intro h1{font-size:43px}footer{font-size:8px}.mobile-break{display:initial}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

.project-node{width:var(--node-width,86px)}.project-node img{width:100%;height:auto;aspect-ratio:1.72}.metanode strong{font-size:clamp(18px,1.6vw,25px)}
@media(max-width:850px){.workspace{grid-template-columns:minmax(0,1fr)}.detail{border-left:0;border-top:1px solid var(--border)}}
@media(max-width:760px){.metanode strong{font-size:24px}}

.stage[data-portrait=true] .project-node span{overflow:hidden;text-overflow:ellipsis}.stage[data-portrait=true] #gesture{font-size:0}.stage[data-portrait=true] #gesture::after{content:"Tap a collection or project to explore";font:8px var(--mono)}

/* Full archive: bounded spatial windows, original media, native scroll-snap galleries. */
[hidden]{display:none!important}
.workspace{grid-template-columns:minmax(0,1fr) 350px}
.stage{height:clamp(540px,60vh,700px)}
.detail{max-height:clamp(540px,60vh,700px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.detail .project-description{font-size:13px;line-height:1.85}
.detail .project-credit{color:var(--text);font-size:11px}
.detail .project-tags,.detail .award{font:10px/1.7 var(--mono);color:var(--accent)}
.detail .external-link{display:inline-block;font-size:10px;padding:8px 15px 8px 0}
.project-node .text-cover{height:auto;aspect-ratio:1.72;padding:7px;background:var(--surface);border:1px solid var(--border);overflow:hidden}
.project-node .text-cover small{display:none}.project-node .text-cover i{font:14px/1 var(--serif)}
.project-node span{overflow:hidden;text-overflow:ellipsis}
.metanode strong{font-size:clamp(16px,1.45vw,23px)}
.media-gallery{margin:20px 0}
.media-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin}
.media-track figure{flex:0 0 100%;min-width:0;margin:0;scroll-snap-align:start}
.media-track figure>img,.media-track video,.media-track iframe,.media-track .play-video{display:block;width:100%;aspect-ratio:16/10;object-fit:contain;background:#0a0a0a;border:0}
.media-track figcaption{font:9px/1.5 var(--mono);color:var(--dim);padding:9px 2px}
.play-video{position:relative;padding:0}
.play-video img{width:100%;height:100%;object-fit:cover;opacity:.65}
.play-video span{position:absolute;left:0;right:0;top:45%;font:12px var(--mono);color:white;text-shadow:0 1px 4px black}
.gallery-nav{display:flex;justify-content:space-between;align-items:center;font:10px var(--mono);color:var(--dim)}
.gallery-nav button{padding:10px 17px;border:1px solid var(--border);color:var(--accent)}
.index-strip{display:block;margin:55px 4vw 30px;border:0}
.archive-heading{display:flex;align-items:end;justify-content:space-between;gap:20px}
.archive-heading h2{font:clamp(30px,3.3vw,49px)/1.1 var(--serif);font-weight:400;letter-spacing:-.02em;margin:10px 0}
.search-label{display:grid;gap:7px;font:9px var(--mono);color:var(--dim)}
#search{background:transparent;border:0;border-bottom:1px solid var(--border);font:12px var(--sans);color:var(--text);padding:12px 0;width:260px;border-radius:0}
#section-filters{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0 15px}
#section-filters button{border:1px solid var(--border);padding:11px 13px;font:10px var(--mono)}
#section-filters button[aria-pressed=true]{background:var(--accent);color:var(--bg);border-color:var(--accent)}
#section-filters small{margin-left:5px;opacity:.65}
.archive-summary{display:flex;justify-content:space-between;gap:15px;font:10px var(--mono);color:var(--dim);margin:20px 0}
.archive-summary button{color:var(--accent);font:inherit}
#project-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 22px}
#project-buttons .archive-card{min-width:0;border-bottom:1px solid var(--border)}
#project-buttons button{width:100%;padding:0;border:0;text-align:left;border-radius:0;height:100%;display:flex;flex-direction:column}
#project-buttons button[aria-pressed=true] .card-image{outline:1px solid var(--accent);outline-offset:4px}
.card-image{width:100%;position:relative;aspect-ratio:16/10;background:var(--surface);overflow:hidden}
.card-image>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s}
.archive-card button:hover .card-image>img{transform:scale(1.04)}
.text-cover{height:100%;padding:22px;background:linear-gradient(150deg,var(--surface),var(--bg));display:flex;flex-direction:column;justify-content:center;gap:12px}
.text-cover small{font:8px var(--mono);color:var(--accent);text-transform:uppercase;letter-spacing:.1em}
.text-cover i{font:clamp(22px,2.4vw,34px)/1.05 var(--serif);font-style:normal;font-weight:400}
.media-count{position:absolute;bottom:8px;left:9px;font:8px var(--mono);background:#151515dc;padding:5px 7px;color:#ded8cf}
.card-copy{padding:17px 0 22px}
.card-copy>small{font:8px/1.8 var(--mono);color:var(--accent);text-transform:uppercase;letter-spacing:.03em}
.card-copy h3{font:25px/1.12 var(--serif);font-weight:400;margin:9px 0;color:var(--text)}
.card-copy p{font:11px/1.8 var(--sans);color:var(--dim);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:10px 0}
.card-credit{display:block;font:9px/1.6 var(--mono);color:var(--dim);margin-top:13px}
#empty-results{font:15px var(--sans);padding:40px 0;color:var(--dim)}
@media(max-width:1200px){.workspace{grid-template-columns:minmax(0,1fr) 300px}.detail{padding:20px}.metanode strong{font-size:16px}#project-buttons{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:950px){.workspace{grid-template-columns:minmax(0,1fr)}.detail{max-height:none;border-left:0;border-top:1px solid var(--border)}.media-gallery{max-width:600px}.metanode strong{font-size:20px}}
@media(max-width:760px){.stage{height:700px}.detail{overflow:visible}.archive-heading{display:block}.search-label{margin-top:20px}#search{width:100%}#project-buttons{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 15px}.card-copy h3{font-size:23px}.card-copy p{font-size:11px}.text-cover{padding:14px}.text-cover i{font-size:25px}.text-cover small{font-size:7px}.media-count{font-size:7px}.metanode strong{font-size:22px}.index-strip{margin-top:35px}#section-filters button{font-size:9px;padding:10px}.stage[data-portrait=true] #gesture::after{content:"More projects ↻ cycles through the archive"}}
@media(max-width:480px){#project-buttons{grid-template-columns:minmax(0,1fr)}.card-image{aspect-ratio:16/9}.text-cover i{font-size:36px}.text-cover{padding:28px}.card-copy h3{font-size:29px}.card-copy p{font-size:12px}.card-copy>small{font-size:9px}.media-count{font-size:9px}}


@media(max-width:850px){.stage{height:700px}}

.gallery-nav button:disabled{cursor:default}.archive-heading{scroll-margin-top:30px}#project-list{scroll-margin-top:35px}
.stage:not([data-portrait]) #labels{visibility:hidden}.fallback .stage #labels{visibility:visible}

/* Work-led spatial refinement. Uses the existing portfolio tokens. */
.intro{padding-top:45px;padding-bottom:30px}
.intro h1{font-size:clamp(45px,5.8vw,88px)}
.intro>p{font-size:13px;max-width:310px}
.toolbar{padding-bottom:20px}.archive-jump{padding:10px;color:var(--accent)}
.workspace{display:block;border:0}
.stage{height:640px;border:1px solid var(--border);background:radial-gradient(ellipse at 50% 45%,var(--surface),var(--bg) 78%)}
.stage-top,.stage-bottom{left:26px;right:26px;font-size:10px}
.metanode strong{font-size:clamp(18px,1.7vw,25px)}
.metanode small{font-size:9px;letter-spacing:.12em}
.metanode{padding:10px 12px}
.project-node{perspective:800px}
.node-picture{position:relative;transform:rotateY(var(--depth-angle,0deg));transition:filter .25s,transform .4s;box-shadow:0 15px 28px var(--shadow);background:var(--surface)}
.node-picture img{filter:saturate(.92);aspect-ratio:16/10;object-fit:cover;border-color:var(--border)}
.node-picture>small{position:absolute;bottom:7px;right:7px;padding:4px 6px;background:var(--bg);font:8px var(--mono);color:var(--accent)}
.project-node span{font-size:11px;line-height:1.4;margin-top:10px;max-width:100%}
.project-node:hover .node-picture,.project-node:focus-visible .node-picture{transform:rotateY(0) translateY(-5px);filter:brightness(1.15)}
.project-node[aria-pressed=true] .node-picture{outline:1px solid var(--accent);outline-offset:4px}
.project-node.dimmed{opacity:.3}
.project-node .text-cover{aspect-ratio:16/10}
.project-node .text-cover i{font-size:19px}
.detail{border:0;border-bottom:1px solid var(--border);padding:40px 0;max-height:none;overflow:visible;scroll-margin-top:25px}
body[data-detail=none] .detail{display:none}
.reader-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 25px;align-items:center;margin-bottom:30px}
.reader-head .eyebrow{grid-column:1;margin:0;font:10px var(--mono);color:var(--accent)}
.reader-head h2{grid-column:1;font-size:clamp(34px,4.5vw,64px);line-height:1.04;max-width:850px;margin:12px 0 0;overflow-wrap:anywhere}
#close-reader{grid-column:2;grid-row:1/3;border:1px solid var(--border);padding:13px 18px;font:11px var(--mono);align-self:start}
.reader-body{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:4vw;align-items:start}
.reader-body.text-only{grid-template-columns:minmax(0,760px)}
.reader-copy{min-width:0}
.reader-copy .project-description{font:14px/1.9 var(--sans);margin:18px 0 24px}
.reader-copy .project-credit{font:11px/1.8 var(--mono);color:var(--accent);margin-top:0}
.reader-copy .reason{font:11px/1.8 var(--mono)}
.reader-copy .detail-link{display:inline-block;margin-right:18px}
.reader-body .media-gallery{position:sticky;top:25px;min-width:0;max-width:none;width:100%;margin:0}
.media-track{scrollbar-width:none}.media-track::-webkit-scrollbar{display:none}
.media-track figcaption{padding:12px 0;font-size:10px}
.gallery-thumbs{display:flex;gap:8px;overflow-x:auto;padding:5px 1px 12px;scrollbar-width:thin}
.gallery-thumbs button{position:relative;padding:0;flex:0 0 78px;border:1px solid var(--border);aspect-ratio:16/10;opacity:.6}
.gallery-thumbs button[aria-pressed=true]{border-color:var(--accent);opacity:1}
.gallery-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.gallery-thumbs small{position:absolute;bottom:1px;right:2px;background:var(--bg);padding:1px 3px;font:8px var(--mono)}
.gallery-nav{margin-top:3px}.gallery-nav button{min-width:44px;min-height:44px}
.related-project{display:flex;align-items:center;gap:15px;width:100%;padding:12px 0;border-bottom:1px solid var(--border);text-align:left}
.related-project>img,.related-project>.text-cover{width:82px;height:53px;object-fit:cover;flex:0 0 82px}
.related-project .text-cover{padding:6px}.related-project .text-cover small{display:none}.related-project .text-cover i{font-size:13px}
.related-project>span{font:21px/1.1 var(--serif)}
.related-project>span>small{display:block;font:9px/1.5 var(--mono);color:var(--dim);margin-top:6px}
body[data-detail=collection] #detail-content{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 25px}
body[data-detail=collection] #detail-content>p,body[data-detail=collection] #detail-content>h2,body[data-detail=collection] #detail-content>.detail-link{grid-column:1/-1}
body[data-detail=collection] .sample-button{max-width:300px;grid-column:1/-1}
body[data-detail=sample] #detail-content{max-width:580px}
.index-strip{margin-top:60px}
#section-filters{gap:0;border-bottom:1px solid var(--border)}
#section-filters button{border:0;border-bottom:2px solid transparent;padding:15px 12px;color:var(--dim)}
#section-filters button[aria-pressed=true]{background:none;color:var(--accent);border-color:var(--accent)}
#project-buttons{gap:38px 26px}
.card-image{aspect-ratio:16/10}.card-copy p{-webkit-line-clamp:2}
@media(max-width:1000px){
 .intro{padding-top:30px}.intro>p{font-size:11px}.stage{height:730px}
 .stage[data-portrait=true] .project-node span{font-size:9px}
 .project-node .text-cover i{font-size:13px}
 .reader-body{grid-template-columns:minmax(0,1fr)}.reader-body .media-gallery{position:static}
 .reader-copy{max-width:760px}.reader-head h2{font-size:42px}
 .metanode strong{font-size:24px}
}
@media(max-width:600px){
 .intro h1{font-size:51px}.intro{padding-top:27px}
 .toolbar{gap:12px}.tools{gap:0;justify-content:space-between;width:100%;font-size:9px}.tools button,.archive-jump{padding:10px 5px}
 .stage{height:720px}.stage-top,.stage-bottom{left:15px;right:15px;font-size:8px}
 .reader-head{display:flex;flex-direction:column;align-items:start;gap:12px;margin-bottom:22px}
 .reader-head h2{font-size:38px;margin:0}.reader-head .eyebrow{font-size:9px;line-height:1.8}
 #close-reader{padding:11px 14px;margin-top:5px}
 .detail{padding:28px 0}.reader-body{gap:24px}
 .gallery-thumbs button{flex-basis:64px}
 .reader-copy .project-description{font-size:13px}
 body[data-detail=collection] #detail-content{grid-template-columns:minmax(0,1fr)}
 .index-strip{margin-top:38px}
 #section-filters button{font-size:9px;padding:12px 8px}
 .metanode strong{font-size:22px}
}


/* Hallmark pre-emit critique: Philosophy 4, Hierarchy 4, Execution 4, Specificity 4, Restraint 4, Variety 3. */
.related-project>.text-cover{display:none}.project-node.connected .node-picture{outline:1px solid var(--border);outline-offset:3px}
