/* An image field with a camera, rather than repeated decorative tiles. */
:root{--gallery:37svh;--card-gap:12px;--cell:220px;--row:160px;--columns:10}
.gallery-stage{position:absolute;z-index:3;left:var(--pad);right:var(--pad);top:var(--pad);height:var(--gallery);border-radius:12px;overflow:hidden;transition:height 1.25s var(--ease),left 1.25s var(--ease),right 1.25s var(--ease),top 1.25s var(--ease);isolation:isolate}
.gallery-viewport{position:absolute;inset:0;overflow:hidden;cursor:grab;touch-action:none;outline-offset:-3px}
.gallery-viewport.is-dragging{cursor:grabbing}.gallery-cloud{position:absolute;left:50%;top:50%;display:grid;grid-template-columns:repeat(var(--columns),var(--cell));grid-auto-rows:var(--row);gap:var(--card-gap);width:max-content;transform:translate(-50%,-50%) translate3d(var(--pan-x,0px),var(--pan-y,0px),0) scale(var(--camera,.58));transform-origin:center;will-change:transform;transition:transform 1.2s var(--ease);padding:10px}
html[data-stage="ready"] .gallery-cloud{transition:none}.media-card{position:relative;display:block;min-width:0;width:var(--cell);height:var(--row);padding:0;background:#dfe1d7;border:0;border-radius:12px;overflow:hidden;cursor:zoom-in;transition:transform .4s var(--ease),box-shadow .4s;box-shadow:0 0 0 1px #17191608;color:var(--ink)}
.media-card>img,.media-card>video{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none;transition:transform .6s var(--ease),opacity .2s}.media-card>video{position:absolute;inset:0;opacity:0;background:#171916}.media-card.is-playing>video{opacity:1}.media-card:focus-visible{outline:3px solid var(--lime);outline-offset:3px;z-index:40}.media-card:focus-visible,.media-card:hover{transform:scale(1.16);z-index:30;box-shadow:0 15px 40px #17191635}.media-card:hover>img{transform:scale(1.07)}.media-card.contain{background:#e6e8df}.media-card.contain>img{object-fit:contain;padding:16px}.media-card.synaps-card>img{padding:22px}.media-play{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;justify-content:center;width:33px;height:33px;background:#f4f5eddc;backdrop-filter:blur(6px);border-radius:50%;pointer-events:none;transition:opacity .2s}.media-play::after{content:"";border-left:8px solid var(--ink);border-top:5px solid transparent;border-bottom:5px solid transparent;margin-left:2px}.is-playing .media-play{opacity:0}
.gallery-tools{position:absolute;bottom:9px;right:10px;display:flex;gap:4px;z-index:40}.gallery-tools button{height:29px;min-width:29px;border-radius:30px;background:#f3f5e7e6;backdrop-filter:blur(8px);border:1px solid #17191614;font-size:16px;padding:3px 9px;line-height:1}.gallery-tools .gallery-reset{font-size:10px;padding-left:13px;padding-right:13px}.gallery-tools button:hover{background:var(--lime)}.gallery-hint{position:absolute;bottom:9px;left:12px;z-index:35;color:var(--ink);background:#f3f5e7db;backdrop-filter:blur(8px);border-radius:30px;padding:7px 12px;font-size:10px;line-height:1.2;pointer-events:none;transition:opacity .5s}.gallery-hint.is-hidden{opacity:0}
.boot-overlay{position:fixed;inset:0;background:var(--paper);display:grid;place-items:center;z-index:100;transition:opacity .45s ease,visibility .45s}.boot-overlay img{width:220px;height:110px}.boot-overlay.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.has-js:not([data-stage="ready"]):not([data-stage="settling"]) .story,.has-js:not([data-stage="ready"]):not([data-stage="settling"]) .wordmark,.has-js:not([data-stage="ready"]):not([data-stage="settling"]) .footer{opacity:0;transform:translateY(30px);pointer-events:none}.has-js:not([data-stage="ready"]):not([data-stage="settling"]) .topbar{opacity:0;pointer-events:none}.topbar{transition:opacity .5s .1s}.has-js:not([data-stage="ready"]) .gallery-tools,.has-js:not([data-stage="ready"]) .gallery-hint{opacity:0;pointer-events:none}.has-js:not([data-stage="ready"]) .gallery-viewport{pointer-events:none}.has-js:not([data-stage="ready"]):not([data-stage="settling"]) .gallery-stage{top:0;left:0;right:0;height:100svh;border-radius:0}.has-js[data-stage="loading"] .gallery-cloud{opacity:0}.gallery-cloud{opacity:1}.has-js[data-stage="ready"] .gallery-stage{transition:none}.gallery-space{min-height:calc(var(--gallery) + var(--pad) + 24px)}
.media-viewer{position:fixed;inset:0;margin:auto;width:100%;height:100%;max-width:none;max-height:none;padding:0;border:0;background:#171916f5;color:#f2f4e9;overflow:hidden}.media-viewer::backdrop{background:#171916}.viewer-top{position:absolute;top:18px;left:22px;right:22px;display:flex;align-items:center;justify-content:space-between;z-index:2}.viewer-title{font-size:12px}.viewer-actions{display:flex;gap:8px}.viewer-actions button{background:#f3f5e717;color:inherit;min-width:40px;height:40px;border-radius:50%;padding:7px;display:grid;place-items:center}.viewer-actions button:hover{background:#ccff43;color:#171916}.viewer-actions .close-mark{width:21px;height:21px}.viewer-actions .close-mark::before,.viewer-actions .close-mark::after{height:21px;left:10px}.viewer-content{position:absolute;inset:80px 66px 72px;overflow:auto;display:grid;place-items:center;overscroll-behavior:contain}.viewer-content>video{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:12px;box-shadow:0 20px 80px #0004}.viewer-content>video{width:100%;height:100%;background:#000}.viewer-side{position:absolute;top:50%;transform:translateY(-50%);background:#f3f5e71a;color:inherit;width:36px;height:54px;border-radius:30px;font-size:27px;font-weight:400;padding:0}.viewer-side:hover{background:var(--lime);color:var(--ink)}.viewer-prev{left:16px}.viewer-next{right:16px}.viewer-bottom{position:absolute;left:22px;right:22px;bottom:23px;display:flex;justify-content:space-between;font-size:11px;opacity:.65;gap:10px}.viewer-count{font-variant-numeric:tabular-nums}.viewer-message{position:absolute;left:10px;right:10px;bottom:4px;font-size:12px;text-align:center;color:#f2f4e9}.media-viewer button:focus-visible{outline-color:var(--lime)}

.viewer-content{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr)}


.viewer-actions button[hidden]{display:none}
html:not(.has-js) .boot-overlay{display:none}
.topbar{pointer-events:none}.topbar>.studio-badge,.topbar>.header-actions{pointer-events:auto}
.has-js:not([data-stage="ready"]):not([data-stage="settling"]) .topbar>*{pointer-events:none}
@media(max-width:760px){:root{--gallery:37svh;--card-gap:10px;--cell:180px;--row:134px;--columns:8}.gallery-stage{border-radius:9px}.media-card{border-radius:12px}.gallery-tools button{height:26px;min-width:26px}.gallery-reset{display:none}.gallery-hint{font-size:8px;padding:6px 9px;bottom:8px;left:8px}.gallery-tools{bottom:7px;right:7px}.gallery-space{min-height:calc(var(--gallery) + var(--pad) + 24px)}.viewer-content{inset:72px 12px 75px}.viewer-top{left:14px;right:14px;top:14px}.viewer-title{font-size:11px}.viewer-actions button{height:35px;min-width:35px}.viewer-side{top:auto;bottom:17px;transform:none;width:34px;height:34px;font-size:23px;z-index:3}.viewer-prev{left:auto;right:56px}.viewer-next{right:14px}.viewer-bottom{left:14px;right:105px;bottom:24px}.viewer-bottom .viewer-hint{display:none}.viewer-content>video{border-radius:8px}}
@media(max-height:740px) and (max-width:760px){:root{--gallery:31svh}.gallery-space{min-height:calc(var(--gallery) + 27px)}}
@media(max-width:480px){html[lang="ru"]{--gallery:min(48svh,calc(100svh - 352px))}}
@media(max-height:700px) and (min-width:761px){:root{--gallery:29svh}}
@media(hover:none){.media-card:hover{transform:none;box-shadow:none}.media-card:hover>img{transform:none}}
@media(prefers-reduced-motion:reduce){.gallery-stage,.gallery-cloud,.media-card,.media-card>img,.media-card>video,.boot-overlay{transition:none!important}.boot-overlay{display:none}.has-js .story,.has-js .wordmark,.has-js .footer,.has-js .topbar{opacity:1!important;transform:none!important}}

/* v4 — different formats, one continuous field, a quieter glass background. */
:root{--gallery:42svh;--cell:192px;--row:138px;--card-gap:18px;--columns:24;--motion-ease:cubic-bezier(.22,.7,.1,1)}
.ambient{background:var(--paper)}.ambient i{display:none}
#scene-bg{position:fixed;inset:0;width:100%;height:100%;z-index:1;opacity:.15;pointer-events:none}
.gallery-stage{border-radius:14px;transition:height 1.65s var(--motion-ease),left 1.65s var(--motion-ease),right 1.65s var(--motion-ease),top 1.65s var(--motion-ease)}
.gallery-cloud{grid-auto-flow:dense;padding:16px;transition:transform 1.55s var(--motion-ease)}
.media-card{grid-column:span var(--span-x,1);grid-row:span var(--span-y,1);width:100%;height:100%;border-radius:18px;transition:opacity 1s var(--motion-ease) var(--delay,0ms),transform 1.4s var(--motion-ease) var(--delay,0ms),filter 1s ease var(--delay,0ms),box-shadow .3s;transform:translate3d(0,0,0) rotate(0) scale(1);filter:blur(0)}
.media-card>img,.media-card>video{transition:transform .8s var(--motion-ease),opacity .35s}
html[data-stage="ready"] .media-card{transition:transform .55s var(--motion-ease),box-shadow .4s}
.media-card:hover,.media-card:focus-visible{transform:scale(1.09)}.media-card:hover>img{transform:scale(1.06)}
.media-card.contain>img{padding:24px}.media-card.contain{background:#e5e7dc}
.media-play{left:15px;bottom:15px;width:37px;height:37px}
.gallery-space{min-height:calc(var(--gallery) + var(--pad) + 22px)}
.expertise h2{font-size:clamp(25px,2.45vw,40px)}.story{padding-bottom:15px}.wordmark{height:min(15vw,22svh)}
.boot-overlay{display:flex;align-items:center;justify-content:center;transition:opacity .6s ease,visibility .6s}
.boot-brand{width:min(640px,60vw);display:flex;align-items:center;flex-direction:column;gap:30px;transform:translateY(-22px)}
.boot-overlay .boot-icon{width:170px;height:85px}.boot-overlay .boot-word{display:block;width:100%;height:auto;max-height:200px;object-fit:contain}
.boot-overlay .boot-wordmark{display:block;width:100%;height:auto;max-height:200px;object-fit:contain}
.boot-progress{position:absolute;bottom:clamp(26px,6vh,70px);left:var(--pad);right:var(--pad)}
.boot-progress-top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:17px}
.boot-status{font-size:clamp(17px,2vw,28px);letter-spacing:-.02em;line-height:1.2}.boot-number{font-size:clamp(27px,3.5vw,52px);font-variant-numeric:tabular-nums;line-height:1;letter-spacing:-.04em}
.boot-track{height:2px;background:#17191620;overflow:hidden}.boot-fill{display:block;height:100%;width:100%;transform-origin:left;transform:scaleX(0);background:var(--ink)}.boot-caption{display:block;margin-top:14px;font-size:11px;opacity:.56}
.story,.wordmark,.footer{transition:opacity 1s ease,transform 1.3s var(--motion-ease)}.topbar{transition:opacity .9s .2s}
html[data-stage="loading"] .gallery-cloud{opacity:1}
.has-js[data-stage="loading"] .media-card{opacity:0;transform:translate3d(var(--scatter-x,0px),var(--scatter-y,0px),0) rotate(var(--scatter-r,0deg)) scale(.75);filter:blur(6px)}
.viewer-title{line-height:1.3}.viewer-top{gap:15px}
.menu-layout{grid-template-columns:1fr 1fr;align-items:start}.menu-links>a{padding-block:24px}.contact-list{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;padding:25px 0;font-size:15px}.contact-list a{width:max-content;max-width:100%;line-height:1.2}.contact-list a:hover{text-decoration:underline;text-underline-offset:4px}.contact-list .contact-phone{grid-column:1/-1;font-size:clamp(20px,2vw,32px);letter-spacing:-.025em}.contact-list .contact-email-secondary{font-size:12px;opacity:.6}.menu-links .menu-policy{font-size:14px}
.cookie-notice:not([hidden]){position:fixed;left:50%;bottom:max(25px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:60;width:min(550px,calc(100% - 32px));padding:20px 22px;display:grid;grid-template-columns:1fr auto;gap:17px;color:#f4f5ed;background:linear-gradient(135deg,#ffffff23,#ffffff07 55%,#ffffff13),#252d29ba;border:1px solid #ffffff47;border-top-color:#ffffff75;border-radius:14px;box-shadow:0 12px 46px #07111d24,inset 0 1px 0 #ffffff26;backdrop-filter:blur(26px) saturate(120%);-webkit-backdrop-filter:blur(26px) saturate(120%);animation:cookie-appear .6s var(--motion-ease)}
.cookie-notice[hidden]{display:none}.cookie-notice h2{font-size:16px;font-weight:400;letter-spacing:-.02em;line-height:1.2;margin:0 0 7px}.cookie-notice p{font-size:11px;line-height:1.45;margin:0;opacity:.86}.cookie-notice p a{text-decoration:underline;text-underline-offset:3px}.cookie-actions{display:flex;flex-direction:column;gap:6px;justify-content:center}.cookie-actions button{font-size:11px;min-height:36px;padding:9px 13px;border-radius:8px;color:inherit;background:#ffffff18;border:1px solid #ffffff45;white-space:nowrap}.cookie-actions button:hover{background:#ffffff35}.cookie-actions .cookie-accept{background:var(--lime);border-color:var(--lime);color:var(--ink)}.cookie-actions .cookie-accept:hover{background:#d9ff79}.cookie-notice :is(a,button):focus-visible{outline:2px solid #fff;outline-offset:4px}.cookie-settings{font-size:inherit;color:inherit;background:none;padding:0;opacity:.65;text-decoration:underline;text-underline-offset:3px}.footer-controls{display:flex;gap:18px}
@keyframes cookie-appear{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@media(max-width:760px){:root{--gallery:37svh;--cell:180px;--row:134px;--columns:10;--card-gap:14px}.gallery-stage{border-radius:10px}.gallery-cloud{padding:12px}.media-card{border-radius:18px}.gallery-hint{font-size:8px}.wordmark{height:auto}.expertise h2{font-size:clamp(27px,6.5vw,38px)}.boot-brand{width:72vw;gap:24px}.boot-overlay .boot-icon{width:140px;height:70px}.boot-status{font-size:18px;max-width:220px}.boot-caption{font-size:10px}.viewer-title{font-size:10px;max-width:220px}.menu-layout{grid-template-columns:1fr;gap:20px}.contact-list{font-size:13px;padding:17px 0;gap:16px}.contact-list .contact-phone{font-size:24px}.menu-links>a{padding-block:17px}.menu-intro h2{font-size:32px}.menu-sign{width:110px;height:55px;margin-bottom:12px}.menu-intro>p:not(.eyebrow){font-size:12px}.menu-bottom{padding-top:16px}.menu-policy{font-size:12px!important}.cookie-notice:not([hidden]){bottom:max(16px,env(safe-area-inset-bottom));padding:17px;gap:13px;border-radius:12px}.cookie-notice h2{font-size:14px}.cookie-notice p{font-size:10px}.cookie-actions button{font-size:10px;padding:8px 10px}.footer-controls{gap:12px}.cookie-settings{font-size:9px}}
@media(max-width:480px){html[lang="ru"]{--gallery:min(49svh,calc(100svh - 352px))}.gallery-space{min-height:calc(var(--gallery) + 27px)}}
@media(max-height:700px) and (min-width:761px){:root{--gallery:37svh}.wordmark{height:21svh}.expertise h2{font-size:25px}.gallery-space{min-height:calc(var(--gallery) + 28px)}}
@media(max-height:760px) and (min-width:761px){.menu-layout{padding-top:10px;padding-bottom:25px}.menu-sign{width:120px;height:60px;margin-bottom:12px}.menu-intro h2{font-size:clamp(33px,3.2vw,47px)}.menu-intro>p:not(.eyebrow){font-size:16px}.contact-list{padding-block:18px;gap:14px}.menu-links>a{padding-block:17px}.menu-bottom{padding-top:20px}}
@media(hover:none){.media-card:hover{transform:none;box-shadow:none}.media-card:hover>img{transform:none}}
@media(prefers-reduced-motion:reduce){.story,.wordmark,.footer,.topbar{transition:none!important}.cookie-notice:not([hidden]){animation:none}}
@media(prefers-reduced-transparency:reduce){.cookie-notice:not([hidden]){background:#343d36;backdrop-filter:none}}
@supports not (backdrop-filter:blur(1px)){.cookie-notice:not([hidden]){background:#343d36}}
.legal-cookie-controls{position:relative;z-index:2;max-width:800px;margin:36px auto 0;font-size:12px}.legal-page{padding-bottom:180px}
@media(max-width:480px){.cookie-notice:not([hidden]){grid-template-columns:1fr;gap:12px}.cookie-actions{flex-direction:row}.cookie-actions button{flex:1;white-space:normal;line-height:1.3;min-height:38px}}
@media(min-width:761px) and (max-aspect-ratio:1/1){:root{--gallery:min(70svh,calc(100svh - 420px))}}
@media(max-width:760px){html[lang="en"]{--gallery:max(110px,min(37svh,calc(100svh - 39vw - 302px)))}}
/* v5 copy: the family studio, services and AI share one readable introduction. */
.menu-intro .eyebrow{max-width:470px}
.menu-intro>p:not(.eyebrow){margin:0 0 16px;font-size:15px;line-height:1.5}
.menu-intro>p:last-child{margin-bottom:0}
.menu-ai-label{display:block;margin-bottom:5px;font-size:11px;letter-spacing:.01em;opacity:.65}
.menu-bottom{gap:20px;flex-wrap:wrap}
.menu-bottom .menu-policy{font-size:11px;line-height:1.4}
.menu-bottom .menu-policy:hover{text-decoration:underline;text-underline-offset:4px}
.menu-top{position:sticky;top:0;z-index:2;background:var(--lime)}
@media(max-height:760px) and (min-width:761px){.menu-intro>p:not(.eyebrow){font-size:14px;line-height:1.45;margin-bottom:13px}.menu-sign{margin-bottom:8px}.menu-intro h2{margin-bottom:16px}}
@media(max-width:760px){.menu-intro>p:not(.eyebrow){font-size:13px;line-height:1.5;margin-bottom:14px}.menu-intro .eyebrow{max-width:310px}.menu-bottom{gap:12px}.menu-bottom .menu-policy{order:3;width:100%;font-size:10px}}
/* Give the copy more room above the wordmark while keeping the footer anchored. */
.screen > .story{padding-bottom:clamp(36px,5svh,56px)}
@media(max-width:760px){.screen > .story{padding-bottom:32px}}
@media(max-height:700px) and (min-width:761px){.screen > .story{padding-bottom:28px}}
@media(max-height:600px){.screen > .story{padding-bottom:24px}}

/* One paper tone supports transparent artwork in previews and the expanded view. */
:root{--media-paper:#e1e3da}
.media-card,.media-card.contain,.media-card>img{background:var(--media-paper)}
body{-webkit-user-select:none;user-select:none}
input,textarea,[contenteditable="true"],[data-allow-copy]{-webkit-user-select:text;user-select:text}
img,video,svg{-webkit-touch-callout:none;-webkit-user-drag:none}

/* Tinted glass keeps the moving portfolio visible through the interface. */
:root{
  --glass-dark:linear-gradient(135deg,#ffffff19,#ffffff03 55%,#ffffff12),#171916af;
  --glass-light:linear-gradient(135deg,#ffffff85,#ffffff12 55%,#ffffff40),#eef1e2a3;
  --glass-lime:linear-gradient(135deg,#ffffff55,#ffffff05 55%,#ffffff2b),#ccff43b8;
}
.studio-badge,.contact-pill,.menu-trigger,.gallery-tools button{
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  backdrop-filter:blur(20px) saturate(140%);
  border:1px solid #ffffff38;
  border-top-color:#ffffff73;
  box-shadow:0 6px 22px #17191614,inset 0 1px 0 #ffffff25,inset 0 -1px 0 #17191612;
}
.studio-badge,.contact-pill{background:var(--glass-dark)}
.menu-trigger{background:var(--glass-lime);border-color:#ffffff5c}
.gallery-tools button{background:var(--glass-light);border-color:#ffffff80}
/* Keep the gradient stable; only its underlying tint brightens on hover. */
.contact-pill,.menu-trigger,.gallery-tools button{transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease}
.contact-pill:hover{background:linear-gradient(135deg,#ffffff19,#ffffff03 55%,#ffffff12),#30372faf;color:#f2f3ec}
.menu-trigger:hover{background:linear-gradient(135deg,#ffffff55,#ffffff05 55%,#ffffff2b),#d5ff69c4;color:var(--ink)}
.gallery-tools button:hover{background:linear-gradient(135deg,#ffffff85,#ffffff12 55%,#ffffff40),#f4f7ecc4;color:var(--ink)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .studio-badge,.contact-pill{background:var(--ink)}
  .menu-trigger{background:var(--lime)}
  .gallery-tools button{background:#eef1e2}
    .contact-pill:hover{background:#30372f;color:#f2f3ec}
  .menu-trigger:hover{background:#d5ff69;color:var(--ink)}
  .gallery-tools button:hover{background:#f4f7ec;color:var(--ink)}
}
@media(prefers-reduced-transparency:reduce){
  .studio-badge,.contact-pill{background:var(--ink);-webkit-backdrop-filter:none;backdrop-filter:none}
  .menu-trigger{background:var(--lime);-webkit-backdrop-filter:none;backdrop-filter:none}
  .gallery-tools button{background:#eef1e2;-webkit-backdrop-filter:none;backdrop-filter:none}
    .contact-pill:hover{background:#30372f;color:#f2f3ec}
  .menu-trigger:hover{background:#d5ff69;color:var(--ink)}
  .gallery-tools button:hover{background:#f4f7ec;color:var(--ink)}
}

/* Keep touch galleries within the phone's raster and compositing budget. */
.media-card.is-unhydrated>img{visibility:hidden}
.media-card noscript>img{display:block;width:100%;height:100%;object-fit:cover}
html:not(.has-js) .media-card>img[data-src]{display:none}
html[data-gallery-mode="bounded"] .gallery-cloud{
  transform:translate(-50%,-50%) translate(var(--pan-x,0px),var(--pan-y,0px)) scale(var(--camera,.52));
  will-change:auto;transition:none;
}
html[data-gallery-mode="bounded"] .media-card,
html.has-js[data-gallery-mode="bounded"][data-stage="loading"] .media-card{
  transform:none;filter:none;transition:none;
}
html[data-gallery-mode="bounded"] .media-card>img,
html[data-gallery-mode="bounded"] .media-card>video{transition:none}
html[data-gallery-mode="bounded"][data-stage="ready"] .media-card{opacity:1}
html[data-gallery-mode="bounded"] .gallery-stage{transition:none}
html[data-gallery-mode="bounded"] .gallery-hint,
html[data-gallery-mode="bounded"] .media-play{backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-gallery-mode="bounded"] .studio-badge,
html[data-gallery-mode="bounded"] .contact-pill,
html[data-gallery-mode="bounded"] .menu-trigger,
html[data-gallery-mode="bounded"] .gallery-tools button{
  backdrop-filter:blur(10px) saturate(125%);
  -webkit-backdrop-filter:blur(10px) saturate(125%);
}
html[data-gallery-mode="bounded"] .cookie-notice:not([hidden]){
  backdrop-filter:blur(12px) saturate(120%);
  -webkit-backdrop-filter:blur(12px) saturate(120%);
}
@media(prefers-reduced-transparency:reduce){
  html[data-gallery-mode="bounded"] :is(.studio-badge,.contact-pill,.menu-trigger,.gallery-tools button,.cookie-notice){
    backdrop-filter:none;-webkit-backdrop-filter:none;
  }
}

/* A pointer may move dialog focus, but only keyboard navigation needs a ring. */
html[data-input="pointer"] :is(a,button,[tabindex]):focus{outline:none}
html[data-input="pointer"] .media-card:focus-visible:not(:hover){transform:none;box-shadow:0 0 0 1px #17191608}
.menu-close{border-radius:50%}
.gallery-tools button:focus-visible{outline-offset:2px}
.viewer-actions button:focus-visible{outline-offset:3px}
.topbar :is(.studio-badge,.contact-pill,.menu-trigger){cursor:pointer}
html[data-stage="ready"] .topbar :is(.studio-badge,.contact-pill,.menu-trigger){pointer-events:auto}
.topbar :is(.studio-badge,.contact-pill,.menu-trigger)>*{pointer-events:none}

/* The stage owns fitted image geometry; zoom never changes the layout box. */
.viewer-content{touch-action:auto}
.viewer-content.is-image-view{overflow:hidden;display:flex;align-items:center;justify-content:center;touch-action:none;cursor:zoom-in;padding:0}
.viewer-content.is-image-zoomed{cursor:grab}
.viewer-content.is-panning{cursor:grabbing}
.viewer-actions button,.viewer-side{transition:background-color .2s ease}
.viewer-actions button:hover,.viewer-side:hover{background:#f3f5e735;color:inherit}
.viewer-message{z-index:2;background:#171916db;border-radius:10px;padding:10px;line-height:1.4}
.viewer-retry{min-height:44px;margin-top:8px;padding:9px 14px;background:#ffffff18;color:inherit;border:1px solid #ffffff45;border-radius:8px;font-size:12px}
.viewer-retry:hover{background:#ffffff2b}
.viewer-image-stage{
  position:relative;flex:none;
  width:var(--viewer-fit-width,100%);height:var(--viewer-fit-height,100%);
  transform:translate(var(--viewer-pan-x,0px),var(--viewer-pan-y,0px)) scale(var(--viewer-scale,1));
  transform-origin:center;border-radius:12px;overflow:hidden;background:var(--media-paper);
  box-shadow:0 20px 80px #0004;
}
.viewer-image-stage>img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;padding:0;pointer-events:none}
.viewer-image-preview{opacity:1;transition:opacity .15s ease}
.viewer-image-original{opacity:0;transition:opacity .15s ease}
.viewer-image-stage.is-full-ready .viewer-image-preview{opacity:0}
.viewer-image-stage.is-full-ready .viewer-image-original{opacity:1}
.viewer-image-stage.is-full-error .viewer-image-preview{opacity:1}
.viewer-image-stage.is-full-error .viewer-image-original{opacity:0}
.viewer-image-stage.is-vector>img{padding:clamp(16px,4vw,40px)}
.viewer-actions button:disabled{opacity:.35;cursor:default}

/* Reveal one clipped viewport, without animating every artwork or its raster. */
@keyframes bounded-gallery-reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
html.has-js[data-gallery-mode="bounded"][data-stage="ready"] .gallery-stage{animation:bounded-gallery-reveal .5s var(--ease)}
@media(prefers-reduced-motion:reduce){
  html.has-js[data-gallery-mode="bounded"][data-stage="ready"] .gallery-stage{animation:none}
  .viewer-image-preview,.viewer-image-original{transition:none}
}

@media(max-width:760px),(pointer:coarse){
  .gallery-tools{right:10px;bottom:10px;gap:6px}
  .gallery-tools button{height:44px;min-height:44px;min-width:44px;padding:0;border-radius:22px;display:grid;place-items:center;font-size:20px;touch-action:manipulation}
  .gallery-tools .gallery-reset{display:none}
  .viewer-actions button{height:44px;min-width:44px;padding:0;touch-action:manipulation}
  .menu-close{width:44px;height:44px;touch-action:manipulation}
  .viewer-side{width:44px;height:44px;touch-action:manipulation}
  .viewer-title{min-width:0;overflow-wrap:anywhere}
  .viewer-image-stage{border-radius:8px}
}
@media(max-width:760px){
  .viewer-prev{right:68px}
  .viewer-bottom{right:124px}
}

/* Touch hover can remain latched after a tap; retain each control's base tint. */
@media(hover:none),(pointer:coarse){
  .contact-pill:hover{background:var(--glass-dark);color:#f2f3ec}
  .menu-trigger:hover{background:var(--glass-lime);color:var(--ink)}
  .gallery-tools button:hover{background:var(--glass-light);color:var(--ink)}
  .viewer-actions button:hover{background:#f3f5e717;color:inherit}
  .viewer-side:hover{background:#f3f5e71a;color:inherit}
  .menu-trigger:hover .menu-bars i{width:100%;transition:none}
  .menu-trigger:hover .arrow{transform:rotate(-90deg)}
  .media-card:hover{transform:none;box-shadow:0 0 0 1px #17191608}
  .media-card:hover>img{transform:none}
  @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
    .contact-pill:hover{background:var(--ink)}
    .menu-trigger:hover{background:var(--lime)}
    .gallery-tools button:hover{background:#eef1e2}
  }
  @media(prefers-reduced-transparency:reduce){
    .contact-pill:hover{background:var(--ink)}
    .menu-trigger:hover{background:var(--lime)}
    .gallery-tools button:hover{background:#eef1e2}
  }
}

/* Shared legal attribution below the contact panel. */
.social-note{max-width:900px;margin:18px 0 0;font-size:11px;line-height:1.5;color:inherit;opacity:.72;text-wrap:pretty}
@media(max-width:760px){.social-note{font-size:10px;margin-top:14px}}
