/* Mirrors the shared secondary-page scale defined at the top of about.css. */
:root{--black:#000;--white:#f5f5f3;--text:#aaa9a5;--quiet:#777773;--rule:#30302e;--gutter:clamp(20px,3.4vw,64px);--page-top:clamp(56px,6vw,104px);--page-bottom:clamp(72px,7vw,116px);--section-gap:clamp(48px,5vw,88px);--intro-gap:clamp(52px,5.6vw,104px);--fs-display:clamp(40px,5.2vw,86px);--fs-article:clamp(28px,2.8vw,44px);--fs-title:clamp(22px,1.9vw,30px);--fs-heading:clamp(19px,1.5vw,24px);--fs-lede:clamp(18px,1.45vw,23px);--fs-reading:17px;--fs-body:16px;--fs-small:14px;--fs-caption:13px;--header-height:calc(var(--header-h) + 68px);font-family:var(--font);color:var(--text);background:var(--black);color-scheme:dark;font-synthesis:none}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:150px}
body{margin:0;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:pointer}
button:disabled{opacity:.35;cursor:default}
a,button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4;flex-shrink:0}
img,video{display:block;max-width:100%}
figure,h1,h2,h3,p,ol{margin:0}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--white);outline-offset:5px}
::selection{color:var(--black);background:var(--white)}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:-80px;left:20px;z-index:80;background:var(--white);color:var(--black);padding:15px}
.skip-link:focus{top:15px}
.archive-header{position:sticky;top:var(--header-h);margin-top:var(--header-h);z-index:20;background:var(--black);padding-inline:var(--gutter)}
.theme-nav{height:68px;display:flex;align-items:center;gap:clamp(22px,3vw,48px);overflow-x:auto;scrollbar-width:none}
.theme-nav::-webkit-scrollbar{display:none}
.theme-button{flex-shrink:0;position:relative;height:56px;white-space:nowrap;font-size:var(--fs-small);font-weight:400;color:var(--text)}
.theme-button:hover,.theme-button[aria-pressed=true]{color:var(--white)}
.theme-button:focus-visible{outline-offset:-3px}
.wheel-section{position:relative;height:calc(100svh - var(--header-height));min-height:590px;max-height:950px;padding-bottom:62px}
.works-wheel{position:relative;width:100%;height:100%;min-height:360px;overflow:hidden;isolation:isolate}
.wheel-stage{position:absolute;inset:0;cursor:grab;touch-action:pan-x pinch-zoom;user-select:none;outline-offset:-7px}
.wheel-stage.is-dragging{cursor:grabbing}
.wheel-space{position:absolute;top:50%;left:50%;transform-style:preserve-3d;will-change:transform}
.wheel-card{position:absolute;backface-visibility:hidden;transform-style:preserve-3d;outline:none}
.wheel-card[aria-hidden=false]{will-change:transform}
.wheel-card[aria-hidden=true]{pointer-events:none}
.wheel-face{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:var(--black)}
.wheel-face img{width:100%;height:100%;object-fit:cover;user-select:none}
.wheel-card:focus-visible .wheel-face{outline:2px solid var(--white);outline-offset:-3px}
.wheel-action{position:absolute;right:12px;bottom:12px;background:rgba(0,0,0,.8);color:var(--white);padding:8px 12px;font-size:var(--fs-caption);opacity:0;transition:opacity .18s}
.wheel-card:hover .wheel-action,.wheel-card:focus-visible .wheel-action{opacity:1}
.wheel-label,.wheel-title{position:absolute;pointer-events:none;color:var(--white);font-weight:400;letter-spacing:-.04em}
/* The centre word is the active theme name, not the page title: it names whatever
   the ring is currently showing, so it stays a small marker inside the circle
   instead of borrowing the page-title step. */
.wheel-label{inset:0;display:grid;place-items:center;font-size:clamp(20px,1.6vw,32px)}
.archive-jump{position:absolute;right:var(--gutter);bottom:20px;display:grid;place-items:center;width:48px;height:48px;color:var(--white)}
.archive-jump svg{width:24px;height:24px;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round;transition:transform .16s ease}
.archive-jump:focus-visible{outline:1px solid currentColor;outline-offset:-5px;border-radius:50%}
@media(hover:hover) and (pointer:fine){.archive-jump:hover svg{transform:translateY(2px)}}
@media(prefers-reduced-motion:reduce){.archive-jump:hover svg{transform:none}}
.wheel-title{top:50%;left:var(--gutter);max-width:24%;transform:translateY(-50%);opacity:0;line-height:1.3;font-size:var(--fs-title)}
.wheel-index{position:absolute;top:8%;right:var(--gutter);padding:0;list-style:none;text-align:right;font-size:var(--fs-small);line-height:1.5;max-width:21%;z-index:3}
.wheel-index button{display:block;min-height:30px;max-width:100%;margin-left:auto;text-align:right}
.wheel-index button:hover,.wheel-index button[aria-current=true]{color:var(--white)}
.wheel-empty{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:24px;text-align:center;padding:24px}
.wheel-empty h2{font-size:var(--fs-title);font-weight:400;color:var(--white)}
.wheel-empty p{max-width:36ch;font-size:var(--fs-body);line-height:1.8}
.archive{--thumbnail-height:clamp(150px,13vw,230px);--thumbnail-gap:14px;--archive-font-size:var(--fs-body);--archive-columns:repeat(4,minmax(0,1fr)) minmax(0,4fr);padding:var(--page-top) var(--gutter) var(--page-bottom);min-height:300px;scroll-margin-top:0}
.archive-heading{display:flex;justify-content:space-between;gap:20px;align-items:baseline;margin-bottom:52px}
.archive-heading h2{font-size:var(--fs-title);font-weight:400;color:var(--white);letter-spacing:-.03em}
.archive-heading p{font-size:var(--fs-small);white-space:nowrap}
.archive-columns,.project-row{display:grid;grid-template-columns:var(--archive-columns);gap:0}
.archive-columns{border-bottom:1px solid var(--rule);padding-bottom:10px;font-size:var(--archive-font-size);line-height:1.5;font-weight:500}
.project-row{padding-block:10px;border-bottom:1px solid var(--rule);min-height:0;align-items:start;scroll-margin-top:150px}
.row-discipline,.row-title,.row-year,.row-medium{min-width:0;padding-top:0;padding-right:20px;font-size:var(--archive-font-size);line-height:1.5;font-weight:500;overflow-wrap:anywhere}
.row-title a:hover,.row-title a:focus-visible{color:var(--white)}
.row-title a{display:block;min-height:36px}
.row-year{font-variant-numeric:tabular-nums;min-width:0}
.row-gallery{display:flex;align-items:flex-start;gap:var(--thumbnail-gap);min-width:0;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
.row-gallery::-webkit-scrollbar{display:none}
.row-gallery:focus-visible{outline-offset:-2px}
/* Each frame matches its artwork, so the visible edges share the same gap. */
.row-image{position:relative;display:block;flex:0 0 auto;height:var(--thumbnail-height);width:calc(var(--thumbnail-height)*var(--thumbnail-ratio,1));aspect-ratio:var(--thumbnail-ratio,1)}
.row-image img{height:100%;width:100%;object-fit:contain;object-position:center top}
.row-gallery .row-image>.media-crop{--crop-fit-height:var(--thumbnail-height);width:100%;height:100%;margin:0}
.row-image:hover img{opacity:.8}
.row-image:focus-visible{outline-offset:-2px}
/* Keep the play control on the visible poster, including letterboxed videos. */
.thumbnail-poster{position:relative;display:block;width:100%;height:100%;aspect-ratio:var(--poster-ratio)}
.thumbnail-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.6);border:1px solid rgba(245,245,243,.65);color:var(--white);pointer-events:none}
.thumbnail-play svg{width:16px;height:16px;margin-left:2px;fill:currentColor;stroke:none}
.row-image:hover .thumbnail-play,.row-image:focus-visible .thumbnail-play{background:rgba(0,0,0,.8);border-color:var(--white)}
.row-interactive{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:20px;border:1px solid var(--rule);width:clamp(180px,20vw,300px);font-size:var(--fs-body);line-height:1.5}
.row-interactive strong{font-weight:500;color:var(--white);font-size:var(--fs-heading)}
.row-interactive span:last-child{font-size:var(--fs-small)}
.empty-message{padding:50px 0;line-height:1.8;max-width:55ch}
.empty-message button,.catalog-status button{display:block;margin-top:20px;color:var(--white);text-decoration:underline;text-underline-offset:5px;min-height:40px}
.catalog-status{padding-block:35px}
.archive-footer{padding:30px var(--gutter);border-top:1px solid var(--rule);display:flex;justify-content:space-between;gap:20px;font-size:var(--fs-small)}
.archive-footer>a{min-height:40px;display:flex;align-items:center;gap:10px}
.archive-footer>a:first-child{color:var(--white)}
.archive-footer span{color:var(--text)}
.project-viewer{position:fixed;inset:0;border:0;padding:0;margin:0;width:100%;max-width:none;height:100dvh;max-height:none;background:var(--black);color:var(--text)}
.project-viewer[open]{display:grid;grid-template-rows:64px minmax(0,1fr) 64px}
.project-viewer::backdrop{background:rgba(0,0,0,.85)}
.viewer-bar,.viewer-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-inline:var(--gutter);font-size:var(--fs-small)}
.viewer-bar{border-bottom:1px solid var(--rule)}
.viewer-bar button{display:flex;align-items:center;gap:15px;min-height:44px;color:var(--white)}
.viewer-bottom{border-top:1px solid var(--rule)}
.viewer-bottom button{min-height:44px;text-align:left}
.viewer-bottom button:last-child{text-align:right}
.viewer-bottom span{white-space:nowrap;font-size:var(--fs-caption)}
.viewer-scroll{overflow-y:auto;overscroll-behavior:contain;padding:48px var(--gutter) 60px;scroll-behavior:smooth}
.viewer-heading{max-width:850px;margin-bottom:40px}
.viewer-heading h2{font-weight:400;color:var(--white);font-size:var(--fs-article);letter-spacing:-.035em;line-height:1.15;overflow-wrap:anywhere}
.viewer-heading p{font-size:var(--fs-body);line-height:1.8;max-width:58ch;margin-top:24px}
.viewer-launch{display:inline-flex;margin-top:24px;padding:12px 0;min-height:44px;border-bottom:1px solid var(--text);color:var(--white)}
.viewer-media{display:flex;flex-direction:column;gap:50px}
.viewer-figure{min-width:0;display:flex;flex-direction:column;align-items:center;gap:12px}
.viewer-figure img,.viewer-figure video{width:auto;max-width:100%;height:auto;object-fit:contain;margin-inline:auto}
.viewer-figure.is-portrait img,.viewer-figure.is-portrait video{max-height:calc(100dvh - 160px)}
.viewer-figure figcaption{font-size:var(--fs-caption);line-height:1.6;align-self:flex-start;max-width:65ch}
.media-error{font-size:var(--fs-small);color:var(--white);line-height:1.8}
.media-error a{text-decoration:underline}
.viewer-experience{padding:60px 0;border-top:1px solid var(--rule);font-size:var(--fs-reading);line-height:1.8}
@media(max-width:1000px){.archive{--archive-font-size:var(--fs-body)}.wheel-title{max-width:22%;font-size:var(--fs-title)}.wheel-index{font-size:var(--fs-small);max-width:22%}}
@media(max-width:700px){:root{--header-height:calc(var(--header-h) + 58px)}html{scroll-padding-top:132px}.theme-nav{height:58px;gap:22px}.theme-button{font-size:var(--fs-small)}.wheel-section{height:calc(85svh - var(--header-height));min-height:450px;max-height:680px;padding-bottom:80px}.wheel-label{font-size:clamp(22px,5.5vw,30px)}.wheel-title{left:var(--gutter);top:auto;bottom:25px;transform:none;max-width:70%;font-size:var(--fs-heading)}.wheel-index{top:auto;bottom:0;right:var(--gutter);left:var(--gutter);max-width:none;display:flex;gap:22px;overflow-x:auto;scrollbar-width:none;text-align:left;font-size:var(--fs-caption)}.wheel-index li{flex-shrink:0}.wheel-index button{white-space:nowrap;min-height:44px}.wheel-action{right:6px;bottom:6px;padding:6px 8px;font-size:var(--fs-caption)}.archive{--thumbnail-height:160px;--thumbnail-gap:10px;--archive-font-size:var(--fs-small);padding-top:36px;padding-bottom:70px}.archive-heading{margin-bottom:32px}.archive-columns{grid-template-columns:minmax(0,1fr) 64px 64px;gap:8px 16px;padding-bottom:14px}.archive-columns .column-discipline,.archive-columns .column-images{display:none}.archive-columns .column-year,.archive-columns .column-medium{text-align:right}.project-row{grid-template-columns:minmax(0,1fr) 64px 64px;gap:8px 16px;min-height:0;padding-block:18px 22px}.row-title{grid-column:1;grid-row:1;padding:0}.row-discipline{grid-column:1;grid-row:2;padding:0}.row-year{grid-column:2;grid-row:1;padding:0;text-align:right}.row-medium{grid-column:3;grid-row:1;padding:0;text-align:right}.row-gallery{grid-column:1/-1;grid-row:3;margin-top:8px}.row-interactive{width:225px}.viewer-scroll{padding-top:30px}.viewer-heading{margin-bottom:30px}.viewer-heading p{font-size:var(--fs-body);margin-top:18px}.viewer-media{gap:30px}.viewer-bottom{gap:8px;font-size:var(--fs-small)}.viewer-bottom span{font-size:var(--fs-caption)}.viewer-figure figcaption{font-size:var(--fs-caption)}}
@media(max-width:360px){.wheel-section{min-height:410px}.viewer-bottom button{max-width:28%;line-height:1.5}}
@media(max-width:700px){.archive-jump{bottom:14px}}
@media(prefers-reduced-motion:reduce){html,.viewer-scroll{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}