/* One actual gallery, expanded across mouse and touch devices; retained V4 ink and material. */
.gallery-fullscreen-hint { display:none; position:relative; border:0; border-radius:4px; padding:0 4px; min-height:24px; color:var(--accent); background:none; font-size:18px; line-height:24px; font-weight:600; letter-spacing:.012em; text-align:center; text-decoration:none; }
.gallery-fullscreen-hint::after { content:""; position:absolute; bottom:2px; left:8px; right:8px; height:1px; background:var(--accent); clip-path:var(--rule-taper-shape); -webkit-mask-image:var(--rule-fade); mask-image:var(--rule-fade); pointer-events:none; }
.gallery-fullscreen-hint:hover { color:var(--ink); }
.hero-chapter .sweetie-portrait { --caption-height:48px; --caption-compact-height:48px; }
.gallery-can-expand .hero-chapter .sweetie-portrait { --caption-height:72px; --caption-compact-height:72px; }
.gallery-can-expand .hero-chapter .gallery-fullscreen-hint { display:block; flex:0 0 24px; min-height:24px; padding:0 8px; font-size:18px; line-height:24px; }
.gallery-home-placeholder { flex:none; align-self:center; }
html.gallery-expanded { overflow-y:hidden; }
html.gallery-expanded,html.gallery-expanded body { overflow-anchor:none; }
/* Only the actual media clip carries a border. A second arched container
   around its caption can never follow the photograph's corner geometry. */
.gallery-dialog { --dialog-gap:12px; --dialog-padding:10px; --gallery-width:min(calc(100vw - 64px),calc((100dvh - 116px) * .75)); --gallery-height:calc(var(--gallery-width) * 4 / 3); width:max-content; padding:var(--dialog-padding); margin:auto; border:0; border-radius:0; color:var(--ink); background:transparent; box-shadow:none; max-width:calc(100vw - 32px); max-height:calc(100dvh - 32px); overflow:visible; corner-shape:round; transform-origin:var(--dialog-padding) var(--dialog-padding); }
.gallery-dialog::backdrop { background:linear-gradient(145deg,rgb(36 58 47 / .44),rgb(79 72 73 / .40)); backdrop-filter:blur(24px) saturate(1.15); -webkit-backdrop-filter:blur(24px) saturate(1.15); }
.gallery-dialog-frame { position:relative; }
.gallery-dialog .sweetie-portrait { width:var(--gallery-width); max-width:none; margin:0; gap:var(--dialog-gap); transform-origin:0 0; }
.gallery-dialog .portrait-zoom { aspect-ratio:3/4; width:100%; height:var(--gallery-height); transform:none; }
/* Match the opening-controller selector, so its home-size height and scale
   cannot shrink or stretch the relocated stage inside the fullscreen clip. */
.gallery-dialog .portrait-zoom > .portrait-image { width:100%; height:100%; transform:none; transform-origin:50% 50%!important; box-shadow:0 24px 80px rgb(23 40 30 / .25); isolation:isolate; }
.gallery-dialog .portrait-image::after { content:""; position:absolute; inset:0; z-index:4; border:1px solid var(--edge-light); border-radius:inherit; corner-shape:inherit; pointer-events:none; }
.gallery-dialog .sweetie-portrait .gallery-bar { padding-inline:52px; height:48px; min-height:48px; max-width:100%; width:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; opacity:1; }
.gallery-dialog #gallery-hint { width:auto; flex:none; transform:none; animation:none; }
.gallery-dialog #gallery-count { flex:none; width:auto; text-align:center; }
.gallery-dialog .gallery-fullscreen-hint { display:none; }
.gallery-dialog-close { position:absolute; z-index:5; bottom:2px; right:0; display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid var(--control-rule); border-radius:50%; background:var(--soft); color:var(--ink); box-shadow:inset 0 1px 0 var(--edge-light); }
.gallery-dialog-close svg { display:block; width:24px; height:24px; fill:currentColor; }
.gallery-dialog-close:hover { background:rgb(238 232 217 / .98); }
.gallery-dialog :is(img,video) { -webkit-touch-callout:none; -webkit-user-drag:none; user-select:none; -webkit-user-select:none; }
.gallery-dialog [data-editor-id] { translate:none!important; scale:none!important; }
@media(prefers-reduced-motion:reduce) { .gallery-dialog { animation:none; } }
/* A short window gives the close control its own centered row. It remains in
   the same moving shell and never collides with the centered swipe cue. */
@media(max-height:459px),(max-width:359px) {
  .gallery-dialog { --gallery-width:min(calc(100vw - 64px),calc((100dvh - 172px) * .75)); }
  .gallery-dialog .sweetie-portrait .gallery-bar { padding-inline:0; }
  .gallery-dialog #gallery-hint { font-size:16px; }
  .gallery-dialog-close { position:relative; top:auto; right:auto; bottom:auto; margin:12px auto 0; }
}
@media(forced-colors:active) { .gallery-fullscreen-hint::after { background:CanvasText; clip-path:none; -webkit-mask-image:none; mask-image:none; } }
@media(prefers-reduced-transparency:reduce) { .gallery-dialog::backdrop { backdrop-filter:none; -webkit-backdrop-filter:none; background:rgb(36 58 47 / .88); } }
@supports not (backdrop-filter:blur(1px)) { .gallery-dialog::backdrop { background:rgb(36 58 47 / .80); } }

/* Finger-sized access uses the same caption rhythm and actual gallery. */
.gallery-fullscreen-hint:focus-visible { outline:none; color:var(--ink); }
.gallery-fullscreen-hint:focus-visible::after { height:2px; background:var(--ink); }
.gallery-touch-layout.gallery-can-expand .hero-chapter .sweetie-portrait { --caption-height:92px; --caption-compact-height:92px; }
.gallery-touch-layout.gallery-can-expand .hero-chapter .gallery-fullscreen-hint { display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px; min-height:44px; padding:0 8px; }
.gallery-touch-layout .gallery-fullscreen-hint::after { bottom:12px; }
.gallery-touch-layout .gallery-dialog { --dialog-padding:0px; --gallery-width:min(calc(100vw - 32px),calc((100dvh - 104px) * .75)); }
/* The gallery owns finger swipes; native pinch/pan must not move its fixed clip. */
.gallery-touch-layout .gallery-dialog .portrait-image { touch-action:none; -webkit-tap-highlight-color:transparent; -webkit-user-select:none; user-select:none; }
.gallery-touch-layout .gallery-dialog .gallery-bar { min-width:min(220px,calc(100vw - 32px)); position:relative; }
.gallery-dialog-close:focus-visible { outline:none; border-color:var(--ink); box-shadow:inset 0 0 0 1px var(--ink); }
@media(max-height:459px),(max-width:359px) {
  .gallery-touch-layout .gallery-dialog { --gallery-width:min(calc(100vw - 32px),calc((100dvh - 160px) * .75)); }
}