.works-gallery{position:absolute;inset:100px 0 100px;opacity:1!important;display:flex;flex-direction:column;isolation:isolate;background:transparent}
.works-stage{position:relative;flex:1;min-height:160px;perspective:1260px;overflow:visible;background:transparent;touch-action:pan-y;cursor:grab;outline-offset:-5px}
.works-stage.is-dragging{cursor:grabbing}
.works-camera{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}
.works-ring{position:absolute;left:50%;top:calc(50% + 7dvh);width:0;height:0;transform-style:preserve-3d;pointer-events:none}
.work-anchor{position:absolute;transform-style:preserve-3d;pointer-events:none}
.work-card{display:block;position:absolute;width:216px;height:108px;left:-108px;top:-54px;border:1px solid #ffffff24;border-radius:5px;padding:0;background:var(--work-color);cursor:pointer;overflow:visible;transform-style:preserve-3d;pointer-events:auto;transition:scale .35s cubic-bezier(.22,1,.36,1),translate .35s cubic-bezier(.22,1,.36,1),box-shadow .35s;box-shadow:0 8px 25px #0006;backface-visibility:visible}
.work-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;border-radius:inherit;backface-visibility:hidden;transform:translateZ(.1px)}
.work-card .work-card-back{transform:rotateY(180deg) translateZ(.1px)}
.work-card:hover,.work-card:focus-visible,.work-card.is-selected{scale:1.28;translate:0 -16px;box-shadow:0 12px 35px #0009;outline:1px solid #ffffff8c}
.works-preview{position:absolute;left:50%;top:4%;width:clamp(255px,36vw,540px);margin:0;transform:translate(-50%,10px) scale(.96);opacity:0;pointer-events:none;transition:opacity .3s,transform .45s cubic-bezier(.22,1,.36,1);z-index:2}
.works-preview.is-active{opacity:1;transform:translate(-50%,0) scale(1)}
.works-preview img{display:block;width:100%;aspect-ratio:2/1;object-fit:cover;border-radius:7px;background:var(--work-color);box-shadow:0 15px 60px #0009}
.works-preview figcaption{margin-top:12px;text-align:center;font:400 18px/1.3 'Cormorant Garamond',serif;letter-spacing:.04em;color:#eee}
@media(max-width:700px){.works-gallery{inset:90px 0 90px}.works-stage{perspective:858px}.works-preview{top:9%;width:79.5vw;max-width:420px}.work-card{width:147.6px;height:73.8px;left:-73.8px;top:-36.9px}}
@media(max-height:560px){.works-gallery{inset:80px 0 80px}.works-preview{width:240px;top:0}}
@media(prefers-reduced-motion:reduce){.work-card,.works-preview{transition:none}}

/* Native modal stays open until explicitly closed; superellipse corners where supported. */
.work-viewer{position:fixed;inset:0;margin:auto;width:min(820px,90vw);max-width:90vw;max-height:86dvh;padding:0;overflow:auto;border:1px solid #ffffff24;border-radius:32px;background:#151617;color:#efefec;box-shadow:0 30px 100px #000b;font-family:'Inter',sans-serif;overscroll-behavior:contain}
@supports(corner-shape:superellipse(1.5)){.work-viewer{corner-shape:superellipse(1.5);border-radius:42px}}
.work-viewer::backdrop{background:rgba(0,0,0,.72)}
.work-viewer[open]{animation:work-viewer-in .28s cubic-bezier(.22,1,.36,1) both}
.work-viewer-image{display:block;width:100%;height:min(44dvh,410px);object-fit:contain;background:var(--work-color)}
.work-viewer-close{position:absolute;z-index:1;top:18px;left:18px;display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:0;background:transparent;color:white;font:400 26px/1 Arial,sans-serif;cursor:pointer;text-shadow:0 1px 5px #0008}
.work-viewer-close:hover{opacity:.65}.work-viewer-close:focus-visible{outline:2px solid #fff;outline-offset:3px}
.work-viewer-caption{padding:22px 28px 26px}.work-viewer-caption span{font-size:11px;letter-spacing:.1em;color:#a5aaad}.work-viewer-caption h3{margin:7px 0 0;font:400 32px/1.2 'Cormorant Garamond',serif}
@keyframes work-viewer-in{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:700px){.work-viewer{border-radius:26px}.work-viewer-caption{padding:18px 22px}.work-viewer-image{height:min(36dvh,320px)}}
@media(prefers-reduced-motion:reduce){.work-viewer[open]{animation:none}}
.work-card.has-cover img{object-fit:cover}
.work-viewer-subtitle{margin:10px 0 0;color:#adb2b5;font-size:14px;line-height:1.5}
.work-genres{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.work-genres .work-genre{font:400 12px/1.4 'Inter',sans-serif;letter-spacing:0;color:#e0e2e2;border:1px solid #ffffff30;border-radius:20px;padding:5px 11px}
.work-downloads{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.work-download{display:flex;flex-direction:column;gap:5px;min-width:145px;padding:12px 18px;border:1px solid #ffffff50;border-radius:6px;background:transparent;color:#efefec;text-decoration:none;font:500 15px/1.4 'Inter',sans-serif;text-align:left;cursor:pointer}
.work-download:hover{background:#ffffff0c}.work-download:focus-visible{outline:2px solid #fff;outline-offset:3px}
.work-download:disabled{color:#92989a;border-color:#ffffff20;cursor:default;background:transparent}
.work-download small{font-size:11px;font-weight:400;color:#92989a}
.work-genres[hidden],.work-downloads[hidden],.work-viewer-subtitle[hidden]{display:none}

/* Full-width posters and a compact, cover-toned details footer. */
.work-viewer{background:var(--work-color,#151617)}
.work-viewer .work-viewer-image{height:auto;max-height:none;width:100%;aspect-ratio:2/1;object-fit:cover}
.work-viewer-caption{background:var(--work-color,#151617)}
.work-viewer-meta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:18px}
.work-viewer-meta .work-genres{margin:0}
.work-viewer-meta .work-downloads{margin:0;margin-left:auto;display:block}
.work-viewer .work-download{display:inline-block;min-width:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;font:700 15px/1.5 'Inter',sans-serif;color:#c3c8cc;text-decoration:underline;text-underline-offset:4px;cursor:pointer;white-space:nowrap;transition:color .2s ease}
.work-viewer .work-download:hover,.work-viewer .work-download:focus-visible{background:none;color:#fff}
.work-viewer-meta .work-downloads[hidden]{display:none}

.work-viewer-video{display:block;width:100%;aspect-ratio:2/1;object-fit:cover;object-position:center;background:#000}
.work-viewer .work-viewer-image[hidden],.work-viewer-video[hidden]{display:none}

/* Switch between the spatial carousel and a scrollable two-column gallery. */
.work-grid-title{display:none}
.works-mode-toggle{position:absolute;right:3vw;bottom:26px;z-index:5;display:flex;align-items:center;gap:18px;padding:14px 20px;border:1px solid #ffffff38;border-radius:40px;background:#0c0d0ef2;color:#efefec;font:500 15px/1.2 'Inter',sans-serif;cursor:pointer}
.works-mode-toggle:focus-visible{outline:2px solid #fff;outline-offset:4px}
.works-mode-track{display:block;position:relative;width:42px;height:24px;border:1px solid #ffffff65;border-radius:20px;background:#454b50}
.works-mode-track::after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#f0f0ec;transform:translateX(18px);transition:transform .2s,background .2s}
.works-mode-toggle[aria-checked="false"] .works-mode-track{background:#181a1c}
.works-mode-toggle[aria-checked="false"] .works-mode-track::after{transform:translateX(0);background:#9da1a3}
.works-grid-mode .works-gallery{inset:210px 4.8vw 108px}
.works-grid-mode .works-stage{overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;perspective:none;cursor:default;scrollbar-width:thin;scrollbar-color:#ffffff45 transparent}
.works-grid-mode .works-camera{position:relative;inset:auto;transform:none!important;transform-style:flat}
.works-grid-mode .works-ring{position:relative;left:auto;top:auto;width:auto;height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 30px;padding:5px 8px 12px;transform:none!important;transform-style:flat}
.works-grid-mode .work-anchor{position:relative;min-width:0;transform:none!important;transform-style:flat;padding-bottom:38px}
.works-grid-mode .work-card{position:relative;left:auto;top:auto;width:100%;height:auto;aspect-ratio:2/1;transform-style:flat;scale:1;translate:0;box-shadow:none}
.works-grid-mode .work-card img{transform:none;backface-visibility:visible}
.works-grid-mode .work-card .work-card-back{display:none}
.works-grid-mode .work-card:hover,.works-grid-mode .work-card:focus-visible{scale:1;translate:0;outline:1px solid #ffffff8c}
.works-grid-mode .work-grid-title{display:block;position:absolute;top:calc(100% + 11px);left:0;color:#efefec;font:400 22px/1.2 'Cormorant Garamond',serif;text-align:left}
.works-grid-mode .works-preview{display:none}
@media(max-width:700px){.works-grid-mode .works-gallery{inset:180px 4vw 98px}.works-grid-mode .works-ring{gap:22px 14px;padding:4px}.works-grid-mode .work-grid-title{font-size:18px}.works-mode-toggle{right:4vw;bottom:20px;padding:12px 16px;font-size:13px;gap:12px}}
@media(max-height:560px){.works-grid-mode .works-gallery{top:160px;bottom:88px}.works-mode-toggle{bottom:16px;padding:10px 16px}}
@media(prefers-reduced-motion:reduce){.works-mode-track::after{transition:none}}

/* Let the grid scroll behind the transparent page chrome, without a cropped viewport. */
.works-grid-mode .works-gallery{inset:0 1.5vw}
.works-grid-mode .works-stage{padding:210px 0 108px;background:transparent}
.works-grid-mode>.page-label{z-index:2;background:transparent;pointer-events:none}
.digital-theme.works-mode:has(#works.works-grid-mode) header{background:transparent}
@media(max-width:700px){.works-grid-mode .works-gallery{inset:0 1.5vw}.works-grid-mode .works-stage{padding-top:180px;padding-bottom:98px}}
@media(max-height:560px){.works-grid-mode .works-gallery{inset:0 1.5vw}.works-grid-mode .works-stage{padding-top:160px;padding-bottom:88px}}

.digital-theme.works-grid-visible header{background:transparent}
