/* Square spatial studies; the floating editorial composition remains intact. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.spatial-controls{display:flex;justify-content:space-between;align-items:flex-start;gap:20px 40px;border-top:1px solid #282828;padding:20px 0 35px;margin-top:-15px}
.spatial-switch{display:flex;gap:22px;flex-wrap:wrap}
.spatial-controls button{font:400 13px/1.5 var(--label);color:#aaa;background:none;border:0;padding:8px 0;cursor:pointer;min-height:40px}
.spatial-switch [aria-pressed=true]{color:#fff;text-decoration:underline;text-underline-offset:6px}
.spatial-controls button:disabled{opacity:.45;cursor:default}
.spatial-controls :focus-visible{outline:1px solid #fff;outline-offset:5px}
.spatial-instructions{text-align:right;max-width:420px}
.motion-status{font:400 12px/1.7 var(--label);color:#aaa;margin:7px 0 0}
.motion-status:empty{display:none}
.spatial-controls .motion-toggle{color:#eee;padding-block:7px;text-decoration:underline;text-underline-offset:5px}
.work-collection .work-image{aspect-ratio:1/1!important;position:relative;background:#000;border:1px solid #252525;overflow:hidden;isolation:isolate}
.work-collection[data-preview-mode=models] .work-image{transform:none!important;touch-action:pan-y pinch-zoom;cursor:pointer;user-select:none;-webkit-user-select:none}
.work-collection[data-preview-mode=models] .work-image.is-dragging{cursor:grabbing}
.work-collection .work-image>img{width:100%;height:100%;object-fit:cover}
.work-collection[data-preview-mode] .work-image>img{filter:grayscale(calc(1 - var(--spatial-color,0)));transition:filter .95s ease,opacity .35s ease,transform 1s ease}
.work-collection[data-preview-mode=models] .work-image>img{transform:none!important}
.spatial-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;pointer-events:none;filter:grayscale(calc(1 - var(--spatial-color,0)));transition:filter .95s ease}
[data-preview-mode=models] .has-model .spatial-canvas{opacity:var(--model-reveal,0)}

.spatial-note{display:none;position:absolute;inset:13px auto auto 14px;color:#aaa;font:400 10px/1.5 var(--label);letter-spacing:.04em;pointer-events:none;z-index:2}
[data-preview-mode=models] .has-model .spatial-note{display:block}
.work-collection[data-view-mode=list] .work-link{display:grid;grid-template-columns:125px 2fr 1fr 1fr;gap:12px 26px;align-items:center;padding:22px 0}
.work-collection[data-view-mode=list] .work-image{display:block;grid-column:1;grid-row:1/3;width:125px}
.work-collection[data-view-mode=list] .work-name{grid-column:2;grid-row:1;margin:0}
.work-collection[data-view-mode=list] .work-category{grid-column:3;grid-row:1;padding:0;margin:0}
.work-collection[data-view-mode=list] .work-context{grid-column:4;grid-row:1;margin:0}
.work-collection[data-view-mode=list] .work-badge{grid-column:2/5;grid-row:2;margin:0}
.list-labels{display:none!important}
/* Preserve abbreviations in content while displaying every heading in title case. */
body :is(h1,h2,h3,h4,h5,h6,[data-title-case],.eyebrow,.micro,.index-statement,.cover-lead,.work-category,.work-context,.work-badge,.recognition-project,.wordmark,.header .site-button,.chapter-nav a,.next-label,.view-switch button,.index-controls label,.footer-bottom,.narrative-back){text-transform:none}
@media(max-width:700px){
 .spatial-controls{display:block;margin-top:0;padding:14px 0 30px}
 .spatial-switch{gap:24px}.spatial-controls button{font-size:14px;min-height:44px}
 .spatial-instructions{text-align:left;margin-top:5px}.motion-status{font-size:12px}
 .spatial-note{inset:10px auto auto 10px;font-size:9px}
 .work-collection[data-view-mode=list] .work-link{grid-template-columns:1fr 112px;gap:8px 18px;align-items:start;min-height:145px}
 .work-collection[data-view-mode=list] .work-image{grid-column:2;grid-row:1/5;width:112px}
 .work-collection[data-view-mode=list] .work-name{grid-column:1;grid-row:1}
 .work-collection[data-view-mode=list] .work-category{grid-column:1;grid-row:2}
 .work-collection[data-view-mode=list] .work-context{grid-column:1;grid-row:3}
 .work-collection[data-view-mode=list] .work-badge{grid-column:1;grid-row:4}
}

/* Manual scene controls; square frames scroll normally with the page. */
.work-collection[data-view-mode=floating] .shell-journey[data-slot="2"]{width:130%;justify-self:end;max-width:none}
.journey-stops{display:none;gap:16px;margin:15px 0 0 25px;align-items:center;justify-content:space-between}
[data-preview-mode=models] .journey-card .journey-stops{display:flex}
.journey-stops button{position:relative;background:none;border:0;padding:0;min-height:44px;flex:1;cursor:pointer}
.journey-stops button::before{content:"";position:absolute;inset:21px 0 auto;height:1px;background:#555;transition:background .2s}
.journey-stops button[aria-pressed=true]::before,.journey-stops button:hover::before{background:#fff}
.journey-stops button:focus-visible{outline:1px solid #fff;outline-offset:4px}
.work-collection[data-view-mode=list] .shell-journey .work-link{grid-template-columns:162.5px 2fr 1fr 1fr}
.work-collection[data-view-mode=list] .shell-journey .work-image{width:162.5px}
[data-view-mode=list] .journey-stops{justify-content:flex-start;max-width:360px;margin:0 0 20px 188.5px}
@media(max-width:700px){.work-collection[data-view-mode=floating] .shell-journey,.work-collection[data-view-mode=floating] .shell-journey[data-slot="2"]{width:94.9%;max-width:100%}.journey-stops{margin-left:0;gap:12px}.work-collection[data-view-mode=list] .shell-journey .work-link{grid-template-columns:1fr 145.6px}.work-collection[data-view-mode=list] .shell-journey .work-image{width:145.6px}[data-view-mode=list] .journey-stops{margin:0 0 15px;max-width:100%}}

.index-controls{grid-template-columns:1fr 1fr 1.5fr}
@media(max-width:700px){.index-controls{grid-template-columns:1fr 1fr}.index-controls label:last-child{grid-column:auto}.spatial-controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.spatial-instructions{margin:0}}

@media(prefers-reduced-motion:reduce){.spatial-canvas,.work-collection .work-image>img,.journey-stops button::before{transition:none!important}}

.work-collection[data-view-mode=list] .spatial-note{display:none}

/* Render first. A scene button is required to display a model. */
.work-image .journey-render{position:absolute;inset:0;background:#000;z-index:3;display:grid;place-items:center;opacity:0;pointer-events:none}
.work-image .journey-render img{filter:grayscale(calc(1 - var(--spatial-color,0)));transition:filter .95s ease;display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:none!important}
[data-preview-mode=models] .work-image .journey-render{opacity:var(--render-reveal,1)}
[data-preview-mode=models] .showing-render .spatial-note{display:none}
.journey-stops button:disabled{opacity:.3;cursor:default}

@media(prefers-reduced-motion:reduce){.work-image .journey-render img{transition:none!important}}

/* List thumbnails share one fixed square; hovering never changes their frame. */
.work-collection[data-view-mode=list] .work-link,
.work-collection[data-view-mode=list] .shell-journey .work-link{grid-template-columns:125px 2fr 1fr 1fr}
.work-collection[data-view-mode=list] .work-card .work-image{width:125px;height:125px;min-width:125px;transform:none!important;align-self:center}
@media(max-width:700px){
 .work-collection[data-view-mode=list] .work-link,
 .work-collection[data-view-mode=list] .shell-journey .work-link{grid-template-columns:1fr 112px}
 .work-collection[data-view-mode=list] .work-card .work-image{width:112px;height:112px;min-width:112px}
}
