/* The active brand owns both the image list and its counter. */
.image-dialog{width:min(1040px,calc(100vw - 32px));height:min(960px,calc(100dvh - 32px));max-width:none;max-height:none;overflow:hidden;background:#191919;color:#fff;border:1px solid #ffffff26}
.dialog-shell{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.dialog-header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px 20px;border-bottom:1px solid #ffffff20}
.dialog-header p{margin:0 0 4px;font:400 9px/1.2 Inter,Arial,sans-serif;letter-spacing:.18em;color:#a5a5a5}
.dialog-header h2{margin:0;font:500 21px/1.2 Inter,Arial,sans-serif;letter-spacing:-.02em}
.image-dialog .dialog-close{position:static;flex:none;width:44px;height:44px;border:1px solid #ffffff50;background:transparent;color:#fff;transition:background .2s,color .2s}
.image-dialog .dialog-close:is(:hover,:focus-visible){background:#fff;color:#111}
.dialog-stage{min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:12px 20px;touch-action:pan-y pinch-zoom}
.image-dialog .dialog-image{display:block;max-width:100%;max-height:100%;width:100%;height:100%;min-height:0;object-fit:contain;margin:0;user-select:none}
.dialog-footer{min-width:0;background:#f7f7f5;color:#111;padding-bottom:10px}
.image-dialog .dialog-controls{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:16px;padding:12px 20px 8px;min-height:0}
.image-dialog .dialog-controls button{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;transition:background .2s,color .2s,transform .15s}
.image-dialog .dialog-controls button:disabled{opacity:.3;cursor:default}
.image-dialog .dialog-controls button:disabled:hover{background:transparent;color:inherit}
.dialog-detail{min-width:0;text-align:center}
[data-gallery-count]{font:500 14px/1.5 Inter,Arial,sans-serif;font-variant-numeric:tabular-nums}
.image-dialog .dialog-controls [data-gallery-caption]{margin:3px 0 0;font-size:11px;line-height:1.5;color:#656565;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.dialog-thumbnails{position:relative;display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;padding:5px 20px 7px;scrollbar-width:thin;scrollbar-color:#aaa transparent}
.dialog-thumbnail{position:relative;flex:0 0 54px;height:54px;padding:3px;background:#eeece8;border:1px solid transparent;opacity:.55;cursor:pointer;transition:opacity .2s,border-color .2s,transform .2s}
.dialog-thumbnail>img{display:block;width:100%;height:100%;object-fit:contain}
.dialog-thumbnail[aria-current="true"]{opacity:1;border-color:#111}
.dialog-thumbnail:is(:hover,:focus-visible){opacity:1}
.image-dialog button:focus-visible{outline:2px solid currentColor;outline-offset:3px}
#gallery-hint{text-align:center;margin:3px 16px 0;font-size:10px;line-height:1.5;color:#666}
@media(max-width:760px){
 .image-dialog{width:calc(100vw - 20px);height:calc(100dvh - 20px)}
 .dialog-header{padding:9px 12px}
 .dialog-header h2{font-size:18px}
 .dialog-stage{padding:10px}
 .image-dialog .dialog-controls{padding:10px 12px 5px;gap:10px}
 .dialog-thumbnails{padding-inline:12px}
 .dialog-thumbnail{flex-basis:48px;height:48px}
}
@media(max-height:500px) and (min-width:560px){
 .dialog-shell{grid-template-columns:minmax(0,1fr) 210px;grid-template-rows:58px minmax(0,1fr)}
 .dialog-header{grid-column:1/-1;padding:6px 12px}
 .dialog-stage{grid-column:1;grid-row:2;padding:8px}
 .dialog-footer{grid-column:2;grid-row:2;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding-top:10px}
 .image-dialog .dialog-controls{gap:5px;padding-inline:10px;flex:none}
 .dialog-thumbnails{flex:1;min-height:0;flex-wrap:wrap;align-content:flex-start;gap:8px;padding:12px;overflow-y:auto}
 .dialog-thumbnail{flex-basis:50px;height:50px}
 #gallery-hint{margin-top:8px;flex:none}
}
@media(prefers-reduced-motion:no-preference){
 .image-dialog[open]{animation:gallery-open .2s ease-out}
 .dialog-thumbnail:active,.image-dialog .dialog-controls button:active:not(:disabled){transform:scale(.96)}
 @keyframes gallery-open{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}
@media(prefers-reduced-motion:reduce){.image-dialog,.image-dialog *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}