.g45-gallery {
    --g45-c-lg: 4; --g45-c-md: 3; --g45-c-sm: 2;
    --g45-cols: var(--g45-c-lg);
    --g45-gap: 12px; --g45-radius: 8px; --g45-rn: 1; --g45-row: 220px; --g45-accent: #039191;
    --g45-tx: #fff; --g45-ov: rgba(0,0,0,.7); --g45-react: #fff; --g45-bw: 0px; --g45-bc: #e5e7eb; --g45-vr: 1.7778;
    position: relative; width: 100%; max-width: 100%; container-type: inline-size; box-sizing: border-box;
}
.g45-gallery *, .g45-gallery *::before, .g45-gallery *::after { box-sizing: border-box; }
@media (max-width: 1024px) { .g45-gallery { --g45-cols: var(--g45-c-md); } }
@media (max-width: 640px) { .g45-gallery { --g45-cols: var(--g45-c-sm); } }
.g45-gallery.g45-no-responsive { --g45-cols: var(--g45-c-lg); }
.g45-gallery.g45-responsive-fixed-columns { --g45-cols: var(--g45-c-lg); }
.g45-gallery [hidden] { display: none !important; }
.g45-notice { padding: 12px 16px; border: 1px dashed currentColor; border-radius: 6px; opacity: .7; }

/* toolbar: filters + search */
.g45-toolbar { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin: 0 0 16px; }
.g45-fa-center.g45-toolbar, .g45-fa-center .g45-filters { justify-content: center; }
.g45-fa-end.g45-toolbar, .g45-fa-end .g45-filters { justify-content: flex-end; }
.g45-fa-center .g45-filter-choice { justify-content: center; }
.g45-fa-end .g45-filter-choice { justify-content: flex-end; }
.g45-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.g45-filter-choice { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; max-width: 100%; }
.g45-filter-choice-mobile { display: none; }
.g45-gallery.g45-mobile-filter-style .g45-filter-choice-desktop { display: none; }
.g45-gallery.g45-mobile-filter-style .g45-filter-choice-mobile { display: flex; }
.g45-appearance-custom .g45-filter, .g45-appearance-custom .g45-more, .g45-appearance-custom .g45-page {
    appearance: none; cursor: pointer; font: inherit; font-size: var(--g45-bs, 14px); line-height: 1.2; padding: .55em 1.15em; border-radius: var(--g45-br, 999px);
    border: 1px solid rgba(127,127,127,.4); background: transparent; color: inherit;
    transition: background-color .2s, color .2s, border-color .2s;
}
.g45-appearance-custom .g45-filter:hover, .g45-appearance-custom .g45-more:hover, .g45-appearance-custom .g45-page:hover { border-color: var(--g45-accent); }
.g45-appearance-custom .g45-filter.is-active, .g45-appearance-custom .g45-page.is-active { background: var(--g45-accent); border-color: var(--g45-accent); color: #fff; }
.g45-appearance-custom .g45-filter:focus-visible, .g45-appearance-custom .g45-more:focus-visible, .g45-appearance-custom .g45-page:focus-visible, .g45-appearance-custom .g45-search-input:focus-visible, .g45-appearance-custom .g45-filter-select:focus-visible { outline: 3px solid var(--g45-accent); outline-offset: 2px; }
.g45-appearance-custom .g45-search-input, .g45-appearance-custom .g45-filter-select { font: inherit; font-size: var(--g45-bs, 14px); padding: .55em 1em; border-radius: var(--g45-br, 999px); border: 1px solid rgba(127,127,127,.4); background: transparent; color: inherit; min-width: 200px; max-width: 100%; }

/* button style: filled */
.g45-bst-filled .g45-filter, .g45-bst-filled .g45-more, .g45-bst-filled .g45-page { background: rgba(127,127,127,.16); border-color: transparent; }
.g45-bst-filled .g45-filter:hover, .g45-bst-filled .g45-more:hover, .g45-bst-filled .g45-page:hover { background: rgba(127,127,127,.3); }
.g45-bst-filled .g45-filter.is-active, .g45-bst-filled .g45-page.is-active { background: var(--g45-accent); color: #fff; }

/* items container, per layout */
.g45-items { position: relative; margin: var(--g45-grid-margin, 0px); }
.g45-item { position: relative; margin: 0; min-width: 0; border-radius: var(--g45-radius); overflow: hidden; background: rgba(127,127,127,.15); border: var(--g45-bw) solid var(--g45-bc); }
.g45-layout-grid .g45-items {
    display: grid; gap: var(--g45-gap); grid-auto-flow: dense;
    grid-template-columns: repeat(var(--g45-cols), minmax(0, 1fr));
    grid-auto-rows: 200px;
    grid-auto-rows: calc((100cqw - (var(--g45-cols) - 1) * var(--g45-gap)) / var(--g45-cols) / var(--g45-rn));
}
.g45-layout-grid .g45-item { height: 100%; display: flex; flex-direction: column; }
.g45-layout-grid .g45-link { position: relative; flex: 1 1 0; min-height: 0; }
.g45-layout-grid .g45-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.g45-layout-grid .g45-span-2x1 { grid-column: span min(2, var(--g45-cols)); }
.g45-layout-grid .g45-span-1x2 { grid-row: span 2; }
.g45-layout-grid .g45-span-2x2 { grid-column: span min(2, var(--g45-cols)); grid-row: span 2; }
@media (max-width: 640px) {
    .g45-layout-grid .g45-span-2x1, .g45-layout-grid .g45-span-2x2 { grid-column: span min(2, var(--g45-cols)); }
}
.g45-layout-masonry .g45-items { column-count: var(--g45-cols); column-gap: var(--g45-gap); }
.g45-layout-masonry .g45-item { break-inside: avoid; -webkit-column-break-inside: avoid; margin-bottom: var(--g45-gap); }
.g45-layout-masonry .g45-vid .g45-img { aspect-ratio: var(--g45-vr); object-fit: cover; }
.g45-layout-justified .g45-items { display: flex; flex-wrap: wrap; gap: var(--g45-gap); }
.g45-layout-justified .g45-items::after { content: ""; flex-grow: 100000; }
.g45-jl-justify .g45-items::after { display: none; }
.g45-layout-justified .g45-item { flex: var(--g45-r) 1 calc(var(--g45-r) * var(--g45-row)); }
.g45-layout-justified .g45-link { aspect-ratio: var(--g45-r); }
.g45-layout-justified .g45-img { width: 100%; height: 100%; object-fit: cover; }

/* link + image */
.g45-link { display: block; position: relative; width: 100%; color: inherit; text-decoration: none; }
.g45-link:focus-visible { outline: 3px solid var(--g45-accent); outline-offset: -3px; }
.g45-img { display: block; width: 100%; max-width: 100%; height: auto; }

/* layout arrangements (grid engine) */
.g45-layout-grid.g45-lay-focus .g45-item:first-child { grid-column: 2 / span 2; grid-row: 2 / span 2; }
.g45-layout-grid.g45-lay-header .g45-item:first-child { grid-column: 1 / -1; }
.g45-layout-grid.g45-lay-collage .g45-item:nth-child(6n+3), .g45-layout-grid.g45-lay-collage .g45-item:nth-child(9n+7) { grid-column: span min(2, var(--g45-cols)); }
@media (max-width: 640px) { .g45-layout-grid.g45-lay-focus .g45-item:first-child { grid-column: 1 / -1; grid-row: span 2; } }

/* skins */
.g45-appearance-custom .g45-ov-btn { display: inline-block; margin-top: 14px; padding: .55em 1.3em; border-radius: var(--g45-br, 0); background: var(--g45-accent); color: #fff; font-size: var(--g45-bs, 14px); font-weight: 700; line-height: 1.2; }
.g45-hover-dim .g45-link:hover .g45-img, .g45-hover-dim .g45-link:focus-visible .g45-img { filter: brightness(.6); }
.g45-hover-fade .g45-img { transition: opacity var(--g45-fade-duration,300ms) ease; }
.g45-hover-fade .g45-link:hover .g45-img, .g45-hover-fade .g45-link:focus-visible .g45-img { opacity: var(--g45-fade-opacity,.8); }
.g45-no-image-zoom.g45-hover-zoom .g45-link:hover .g45-img, .g45-no-image-zoom.g45-hover-zoom .g45-link:focus-visible .g45-img { transform: none !important; }
.g45-view-split .g45-items { grid-auto-rows: auto; }
.g45-view-split .g45-item { height: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; background: transparent; }
.g45-view-split .g45-link { grid-column: 2; grid-row: 1; flex: none; aspect-ratio: 4 / 3; }
.g45-view-split .g45-text { grid-column: 1; grid-row: 1; align-self: center; padding: 16px 18px; text-align: start; }
.g45-view-split .g45-text .g45-title { font-size: calc(var(--g45-tsz, 16px) * 1.15); }
.g45-view-split .g45-react { grid-column: 1 / -1; }
@media (max-width: 640px) {
    .g45-view-split .g45-items { grid-template-columns: 1fr; }
    .g45-view-split .g45-item { grid-template-columns: 1fr; }
    .g45-view-split .g45-link, .g45-view-split .g45-text { grid-column: 1; grid-row: auto; }
}
.g45-skin-circular.g45-layout-grid .g45-items { grid-auto-rows: auto; }
.g45-skin-circular .g45-item { height: auto; background: transparent; border: 0; border-radius: 0; overflow: visible; box-shadow: none; }
.g45-skin-circular .g45-link { flex: none; aspect-ratio: 1; border-radius: 50%; overflow: hidden; }
.g45-preset-mode.g45-skin-circular .g45-text { text-align: center; }
.g45-skin-circular .g45-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.g45-skin-circular .g45-text, .g45-view-split .g45-text { color: var(--g45-text-color, inherit); }
.g45-sh-soft .g45-item { box-shadow: 0 2px 10px rgba(0,0,0,.14); }
.g45-sh-strong .g45-item { box-shadow: 0 10px 28px rgba(0,0,0,.34); }

/* hover effects */
.g45-img { transition: transform .45s ease; }
.g45-hover-zoom .g45-link:hover .g45-img, .g45-hover-zoom .g45-link:focus-visible .g45-img { transform: scale(1.06); }
.g45-hover-lift .g45-item { transition: transform .25s ease, box-shadow .25s ease; }
.g45-hover-lift .g45-item:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0,0,0,.25); }
@media (hover: none) {
    .g45-hover-zoom:not(.g45-m-hover) .g45-link:hover .g45-img { transform: none; }
    .g45-hover-lift:not(.g45-m-hover) .g45-item:hover { transform: none; box-shadow: none; }
    .g45-m-titles.g45-title-hover .g45-cap { opacity: 1; transform: none; }
}

/* black and white thumbnails, color on hover (optional) */
.g45-bw .g45-img { filter: grayscale(1); transition: transform .45s ease, filter var(--g45-bwt, .8s) ease-in-out; }
.g45-bw .g45-link:hover .g45-img, .g45-bw .g45-link:focus-visible .g45-img { filter: none; }
@media (hover: none) { .g45-bw-touch .g45-img { filter: none; } }
@media (prefers-reduced-motion: reduce) { .g45-bw .g45-img { transition: none; } }

/* text over / below the image */
.g45-cap {
    position: absolute; inset: auto 0 0 0; padding: 28px 14px 12px; color: var(--g45-tx, #fff); text-align: start;
    background: linear-gradient(to top, var(--g45-ov), rgba(0,0,0,0)); pointer-events: none;
    opacity: 0; transform: translateY(8px); transition: opacity .25s ease, transform .25s ease;
}
.g45-tv-top .g45-cap { inset: 0 0 auto 0; padding: 12px 14px 28px; background: linear-gradient(to bottom, var(--g45-ov), rgba(0,0,0,0)); transform: translateY(-8px); }
.g45-tv-center .g45-cap { inset: 0; padding: 14px; display: flex; flex-direction: column; justify-content: center; background: var(--g45-ov); transform: none; }
.g45-title { display: block; font-weight: 600; font-size: var(--g45-tsz, 16px); line-height: 1.3; }
.g45-sub { display: block; margin-top: 2px; font-weight: 400; font-size: var(--g45-csz, 13px); line-height: 1.35; color: var(--g45-cc, inherit); opacity: .9; }
.g45-title-always .g45-cap, .g45-title-hover .g45-link:hover .g45-cap, .g45-title-hover .g45-link:focus-visible .g45-cap { opacity: 1; transform: none; }
.g45-text { padding: 10px 12px; line-height: 1.35; text-align: start; color: var(--g45-tx, inherit); }
.g45-ta-center .g45-cap, .g45-ta-center .g45-text { text-align: center; }
.g45-ta-end .g45-cap, .g45-ta-end .g45-text { text-align: end; }

/* play badge on video items */
.g45-play { position: absolute; top: 50%; left: 50%; width: 56px; height: 56px; margin: -28px 0 0 -28px; border-radius: 50%; background: rgba(0,0,0,.6); pointer-events: none; transition: background-color .2s; }
.g45-play::after { content: ""; position: absolute; top: 50%; left: 50%; margin: -9px 0 0 -6px; border-style: solid; border-width: 9px 0 9px 15px; border-color: transparent transparent transparent #fff; }
.g45-link:hover .g45-play { background: var(--g45-accent); }

/* love / like / share icons */
.g45-react { position: absolute; z-index: 2; top: 8px; inset-inline-end: 8px; display: flex; gap: 4px; }
.g45-r { appearance: none; display: inline-flex; align-items: center; gap: .4em; border: 0; border-radius: var(--g45-br, 999px); padding: .45em .75em; cursor: pointer;
    background: rgba(0,0,0,.45); color: var(--g45-react); font: inherit; font-size: var(--g45-bs, 14px); line-height: 1; }
.g45-r svg { width: var(--g45-ri, 1.3em); height: var(--g45-ri, 1.3em); }
.g45-r-love { color: var(--g45-rc-love, var(--g45-react)); }
.g45-r-like { color: var(--g45-rc-like, var(--g45-react)); }
.g45-r-share { color: var(--g45-rc-share, var(--g45-react)); }
.g45-r-love svg { width: var(--g45-ri-love, var(--g45-ri, 1.3em)); height: var(--g45-ri-love, var(--g45-ri, 1.3em)); }
.g45-r-like svg { width: var(--g45-ri-like, var(--g45-ri, 1.3em)); height: var(--g45-ri-like, var(--g45-ri, 1.3em)); }
.g45-r-share svg { width: var(--g45-ri-share, var(--g45-ri, 1.3em)); height: var(--g45-ri-share, var(--g45-ri, 1.3em)); }
.g45-r:hover { background: rgba(0,0,0,.65); }
.g45-r:focus-visible { outline: 2px solid var(--g45-accent); outline-offset: 2px; }
.g45-r.is-on { box-shadow: inset 0 0 0 2px var(--g45-react); }
.g45-n:empty { display: none; }
.g45-rp-below .g45-react { position: static; justify-content: flex-start; padding: 0 12px 10px; }
.g45-rp-below .g45-r { background: transparent; padding: .3em .55em; }
.g45-rp-below .g45-r { color: inherit; }
.g45-rp-below .g45-r-love { color: var(--g45-rc-love, inherit); }
.g45-rp-below .g45-r-like { color: var(--g45-rc-like, inherit); }
.g45-rp-below .g45-r-share { color: var(--g45-rc-share, inherit); }
.g45-toast { position: absolute; z-index: 5; left: 50%; bottom: 12px; transform: translateX(-50%); padding: 8px 14px; border-radius: 6px; background: rgba(0,0,0,.8); color: #fff; font-size: 14px; opacity: 0; pointer-events: none; transition: opacity .2s; }
.g45-toast.is-on { opacity: 1; }

/* zoom icon in the center of the images marked in the editor */
.g45-zoomi { position: absolute; z-index: 1; top: 50%; left: 50%; width: var(--g45-zs, 44px); height: var(--g45-zs, 44px); margin: calc(var(--g45-zs, 44px) / -2) 0 0 calc(var(--g45-zs, 44px) / -2);
    display: grid; place-items: center; border-radius: var(--g45-br, 999px); background: rgba(0,0,0,.45); color: var(--g45-zc, #fff); pointer-events: none; transition: opacity .2s, transform .2s; }
.g45-zoomi svg { width: 56%; height: 56%; }
.g45-zm-hover .g45-zoomi { opacity: 0; transform: scale(.85); }
.g45-zm-hover .g45-link:hover .g45-zoomi, .g45-zm-hover .g45-link:focus-visible .g45-zoomi { opacity: 1; transform: none; }
@media (hover: none) { .g45-zm-hover .g45-zoomi { opacity: 1; transform: none; } }

/* share menu: horizontal or vertical, placed by the script */
.g45-sm { --sm-bg: rgba(20,22,28,.95); --sm-fg: #fff; --sm-btn: rgba(255,255,255,.14); --sm-btn-h: rgba(255,255,255,.3);
    position: fixed; z-index: 2147483600; display: flex; gap: 6px; padding: 6px; border-radius: 14px; background: var(--sm-bg); box-shadow: 0 10px 28px rgba(0,0,0,.38); box-sizing: border-box; }
.g45-sm-v { flex-direction: column; }
.g45-sm-light { --sm-bg: rgba(255,255,255,.98); --sm-fg: #111; --sm-btn: rgba(0,0,0,.08); --sm-btn-h: rgba(0,0,0,.18); }
.g45-sm-b { appearance: none; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: var(--g45-br, 50%); background: var(--sm-btn); color: var(--sm-fg);
    font: 700 12px/1 system-ui, sans-serif; cursor: pointer; transition: background-color .15s; }
.g45-sm-b:hover { background: var(--sm-btn-h); }
.g45-sm-b:focus-visible { outline: 2px solid var(--sm-fg); outline-offset: 2px; }

/* footer: load more + pagination */
.g45-footer { display: flex; justify-content: center; margin-top: 20px; }
.g45-pages { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: center; }
.g45-page { min-width: 2.6em; padding: .55em .8em; text-align: center; }
.g45-page-gap { padding: 0 6px; opacity: .6; }
.g45-empty { text-align: center; padding: 24px 0; opacity: .7; }

/* ---------- lightbox ---------- */
html.g45-lb-open { overflow: hidden; }
.g45-lb { --lb-def: rgba(8,10,14,.94); --lb-fg: #fff; --lb-btn: rgba(255,255,255,.14); --lb-btn-h: rgba(255,255,255,.28);
    --lb-text-top: 0px; --lb-text-bot: 72px; --lb-text-pad: 12px; --lb-text-bw: 0px; --lb-text-br: 0px; --lb-thumbs-h: 0px; --lb-thumbs-size-h: calc(var(--lb-th) + 16px); --lb-thumbs-top-h: 0px; --lb-th: 64px; --lb-thumb-gap: 8px; --lb-thumb-bw: 2px; --lb-thumb-br: 6px; --lb-tsz: 16px; --lb-csz: 13px; --lb-bs: 44px; --lb-br: 50%; --lb-vr: 1.7778; --lb-vmax: 100000px; --lb-vrad: 0px; --lb-vbg: #000;
    --lb-speed: 280ms; --lb-tspeed: 220ms; --vp: #039191;
    position: fixed; inset: 0; z-index: 2147483000; background: var(--lb-bg, var(--lb-def)); color: var(--lb-fg); touch-action: none; user-select: none; -webkit-user-select: none; }
.g45-lb *, .g45-lb *::before, .g45-lb *::after { box-sizing: border-box; }
.g45-lb-light { --lb-def: rgba(250,250,252,.96); --lb-fg: #111; --lb-btn: rgba(0,0,0,.08); --lb-btn-h: rgba(0,0,0,.18); }
.g45-lb[hidden], .g45-lb [hidden] { display: none !important; }   /* the hidden attribute must win over the display of our own buttons */
.g45-lb.g45-text-top { --lb-text-top: 64px; --lb-text-bot: 16px; }
.g45-lb.g45-has-thumbs { --lb-thumbs-h: var(--lb-thumbs-size-h); }
.g45-lb.g45-thumbs-top { --lb-thumbs-top-h: var(--lb-thumbs-size-h); --lb-thumbs-h: 0px; }
.g45-lb-stage { position: absolute; inset: calc(56px + var(--lb-text-top) + var(--lb-thumbs-top-h)) 16px calc(var(--lb-text-bot) + var(--lb-thumbs-h)); display: flex; align-items: center; justify-content: center; }
.g45-lb-img { display: block; flex: none; max-width: none; user-select: none; -webkit-user-drag: none; cursor: zoom-in; }
.g45-lb.is-zoomed .g45-lb-img { cursor: grab; }
.g45-lb.is-dragging .g45-lb-img { cursor: grabbing; }
.g45-lb-media { width: min(var(--lb-vmax), 100%, calc((100vh - 130px - var(--lb-text-top) - var(--lb-thumbs-h) - var(--lb-thumbs-top-h)) * var(--lb-vr))); aspect-ratio: var(--lb-vr); border-radius: var(--lb-vrad); overflow: hidden; background: var(--lb-vbg); }
.g45-lb-media iframe, .g45-lb-media video { display: block; width: 100%; height: 100%; border: 0; background: var(--lb-vbg); }
.g45-lb-doc { width: min(1100px, 100%); height: 100%; aspect-ratio: auto; background: #fff; }
.g45-lb-html { width: min(900px, 100%); max-height: 100%; overflow: auto; padding: 24px; border-radius: 8px; background: #fff; color: #111; user-select: text; -webkit-user-select: text; touch-action: pan-y; }
.g45-lb-btn { position: absolute; z-index: 2; display: grid; place-items: center; width: var(--lb-bs); height: var(--lb-bs); padding: 0; border: 0; border-radius: var(--lb-br);
    background: var(--lb-btn); color: var(--lb-fg); cursor: pointer; transition: background-color .2s; font: inherit; }
.g45-lb-btn svg { width: 52%; height: 52%; }
.g45-lb-btn:hover { background: var(--lb-btn-h); }
.g45-lb-btn:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.g45-lb-light .g45-lb-btn:focus-visible { outline-color: #111; }
.g45-lb-btn[disabled] { opacity: .35; cursor: default; }
.g45-lb-tools { position: absolute; z-index: 3; top: calc(8px + var(--lb-thumbs-top-h)); right: 8px; left: auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; align-items: center; max-width: calc(100% - 140px); }
.g45-lb.g45-tools-top-start .g45-lb-tools, .g45-lb.g45-tools-bottom-start .g45-lb-tools { left: 8px; right: auto; justify-content: flex-start; }
.g45-lb.g45-tools-bottom-end .g45-lb-tools, .g45-lb.g45-tools-bottom-start .g45-lb-tools { top: auto; bottom: calc(8px + var(--lb-thumbs-h) + var(--lb-text-bot)); }
.g45-lb-tools .g45-lb-btn, .g45-lb-side .g45-lb-btn { position: static; }
.g45-lb-react { display: flex; gap: 6px; align-items: center; }
.g45-lb-rbtn { width: auto; min-width: calc(var(--lb-bs) * .86); height: calc(var(--lb-bs) * .86); display: inline-flex; gap: 6px; padding: 0 12px; border-radius: var(--lb-br); }
.g45-lb-rbtn svg { width: 1.3em; height: 1.3em; }
.g45-lb-rbtn.is-on { box-shadow: inset 0 0 0 2px currentColor; }
.g45-lb-prev { top: 50%; inset-inline-start: 8px; margin-top: calc(var(--lb-bs) / -2); }
.g45-lb-next { top: 50%; inset-inline-end: 8px; margin-top: calc(var(--lb-bs) / -2); }
.g45-lb.g45-no-arrows .g45-lb-prev, .g45-lb.g45-no-arrows .g45-lb-next { display: none; }
.g45-lb[dir="rtl"] .g45-lb-prev svg, .g45-lb[dir="rtl"] .g45-lb-next svg { transform: scaleX(-1); }
.g45-lb-bar { position: absolute; z-index: 1; inset-inline: 0; bottom: var(--lb-thumbs-h); display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; padding: 12px 72px 16px; pointer-events: none; }
.g45-lb-text-top .g45-lb-bar, .g45-lb.g45-text-top .g45-lb-bar { top: calc(52px + var(--lb-thumbs-top-h)); bottom: auto; align-items: flex-start; }
.g45-lb-caption { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; text-align: start; line-height: 1.4; color: var(--lb-fg); padding: var(--lb-text-pad); border: var(--lb-text-bw) solid var(--lb-text-bc, transparent); border-radius: var(--lb-text-br); background: var(--lb-text-bg, transparent); }
.g45-lb-caption strong { font-size: var(--lb-tsz); color: var(--lb-tcl, var(--lb-fg)); }
.g45-lb.g45-ta-center .g45-lb-caption { text-align: center; align-items: center; }
.g45-lb.g45-ta-end .g45-lb-caption { text-align: end; align-items: flex-end; }
.g45-lb-caption span { font-size: var(--lb-csz); color: var(--lb-ccl, var(--lb-tcl, var(--lb-fg))); opacity: .85; }
.g45-lb-side { pointer-events: auto; display: flex; gap: 6px; }
.g45-lb-count { flex: none; font-size: 14px; opacity: .8; font-variant-numeric: tabular-nums; }
.g45-lb-thumbs { position: absolute; z-index: 2; inset-inline: 0; bottom: 0; height: var(--lb-thumbs-size-h); display: flex; gap: var(--lb-thumb-gap); align-items: center; padding: 8px 12px; overflow-x: auto; overflow-y: hidden; touch-action: pan-x; }
.g45-lb.g45-thumbs-top .g45-lb-thumbs { top: 0; bottom: auto; }
.g45-lb-thumbs[hidden] { display: none; }
.g45-lb-thumb { flex: none; height: var(--lb-th); padding: 0; border: var(--lb-thumb-bw) solid transparent; border-radius: var(--lb-thumb-br); background: none; cursor: pointer; opacity: .6; overflow: hidden; transition: opacity .2s, border-color .2s; }
.g45-lb-thumb img { display: block; height: 100%; width: auto; max-width: none; object-fit: cover; }
.g45-lb-thumb:hover, .g45-lb-thumb.is-on { opacity: 1; }
.g45-lb-thumb.is-on { border-color: var(--lb-thumb-active, var(--lb-fg)); }
.g45-lb-thumb:focus-visible { outline: 3px solid #fff; outline-offset: 1px; }
.g45-lb-toast { position: absolute; z-index: 5; left: 50%; bottom: 96px; transform: translateX(-50%); padding: 8px 14px; border-radius: 6px; background: rgba(0,0,0,.85); color: #fff; font-size: 14px; opacity: 0; pointer-events: none; transition: opacity .2s; }
.g45-lb-toast.is-on { opacity: 1; }
.g45-lb.is-loading .g45-lb-stage::after { content: ""; position: absolute; width: 36px; height: 36px; border: 3px solid var(--lb-btn-h); border-top-color: var(--lb-fg); border-radius: 50%; animation: g45-spin .8s linear infinite; }
@keyframes g45-spin { to { transform: rotate(360deg); } }
@media (max-width: 640px) {
    .g45-lb-stage { inset: calc(56px + var(--lb-text-top) + var(--lb-thumbs-top-h)) 0 calc(var(--lb-text-bot) + var(--lb-thumbs-h)); }
    .g45-lb-bar { padding-inline: 16px; }
    .g45-lb-caption { padding: var(--lb-text-pad-sm, var(--lb-text-pad)); }
    .g45-lb-caption strong { font-size: var(--lb-tsz-sm, var(--lb-tsz)); }
    .g45-lb-caption span { font-size: var(--lb-csz-sm, var(--lb-csz)); }
    .g45-lb-prev, .g45-lb-next { display: none; }
    .g45-lb:not(.g45-thumbs-m) .g45-lb-thumbs { display: none; }
    .g45-lb:not(.g45-thumbs-m) { --lb-thumbs-h: 0px; --lb-thumbs-top-h: 0px; }
    .g45-lb-tools { max-width: calc(100% - 120px); }
}

/* open / close animations and slide transitions */
.g45-in-fade { animation: g45-fade var(--lb-speed) ease both; }
.g45-in-zoom { animation: g45-zoomin var(--lb-speed) ease both; }
.g45-in-up { animation: g45-up var(--lb-speed) ease both; }
.g45-out-fade { animation: g45-fadeout var(--lb-speed) ease both; }
.g45-out-zoom { animation: g45-zoomout var(--lb-speed) ease both; }
.g45-t-fade { animation: g45-fade var(--lb-tspeed) ease both; }
.g45-t-slide { animation: g45-slide var(--lb-tspeed) ease both; }
@keyframes g45-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes g45-fadeout { from { opacity: 1; } to { opacity: 0; } }
@keyframes g45-zoomin { from { opacity: 0; transform: scale(.92); } to { opacity: 1; transform: none; } }
@keyframes g45-zoomout { from { opacity: 1; transform: none; } to { opacity: 0; transform: scale(.92); } }
@keyframes g45-up { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes g45-slide { from { opacity: 0; transform: translateX(calc(var(--dir, 1) * 8%)); } to { opacity: 1; transform: none; } }

/* ---------- custom HTML5 video player ---------- */
.g45-vp { position: relative; width: 100%; height: 100%; background: #000; color: #fff; outline: none; }
.g45-vp video { width: 100%; height: 100%; object-fit: contain; cursor: pointer; }
.g45-vp:focus-visible { box-shadow: inset 0 0 0 3px var(--vp); }
.g45-vp-btn { appearance: none; border: 0; background: transparent; color: var(--vp-icon-color, #fff); cursor: pointer; display: grid; place-items: center; width: var(--vp-control-size, 34px); height: var(--vp-control-size, 34px); padding: 0; font: inherit; font-size: 13px; font-weight: 700; }
.g45-vp-btn:focus-visible { outline: 2px solid var(--vp); outline-offset: 1px; }
.g45-vp-big { position: absolute; inset: 0; margin: auto; width: var(--vp-big-play-size, 84px); height: var(--vp-big-play-size, 84px); border-radius: 50%; background: var(--vp); box-shadow: 0 6px 24px rgba(0,0,0,.4); }
.g45-vp.is-playing .g45-vp-big { display: none; }
.g45-vp-bar { position: absolute; inset-inline: 0; bottom: 0; display: flex; align-items: center; gap: var(--vp-control-gap, 8px); padding: 22px 12px 8px; background: linear-gradient(transparent, var(--vp-bar-bg, rgba(0,0,0,.78))); opacity: 0; transition: opacity .25s; }
.g45-vp-bar-top { top: 0; bottom: auto; padding: 8px 12px 22px; background: linear-gradient(var(--vp-bar-bg, rgba(0,0,0,.78)), transparent); }
.g45-vp.show-ui .g45-vp-bar { opacity: 1; }
.g45-vp-time { font-size: 12px; font-variant-numeric: tabular-nums; min-width: 34px; text-align: center; }
.g45-vp-seek { flex: 1; min-width: 0; accent-color: var(--vp); }
.g45-vp-vol { width: 80px; accent-color: var(--vp); }
.g45-vp-speed { width: auto; min-width: 40px; }
@media (max-width: 640px) { .g45-vp-vol { display: none; } }

@media (prefers-reduced-motion: reduce) {
    .g45-img, .g45-cap, .g45-hover-lift .g45-item, .g45-filter, .g45-more, .g45-page, .g45-vp-bar { transition: none; }
    .g45-lb.is-loading .g45-lb-stage::after { animation-duration: 2s; }
    .g45-in-fade, .g45-in-zoom, .g45-in-up, .g45-out-fade, .g45-out-zoom, .g45-t-fade, .g45-t-slide { animation: none; }
    ::view-transition-group(g45-hero) { animation: none; }
}
::view-transition-group(g45-hero) { animation-duration: .32s; animation-timing-function: cubic-bezier(.2, .8, .2, 1); }

/* Theme integration: no front-end font or button paint reset by default. */
.g45-appearance-theme { --g45-accent: var(--wp--preset--color--primary, currentColor); color: inherit; }
.g45-appearance-theme .g45-title { font-size: var(--g45-tsz, inherit); font-weight: var(--g45-tw, inherit); }
.g45-appearance-theme .g45-sub { font-size: var(--g45-csz, inherit); }
.g45-appearance-theme .g45-text { color: var(--g45-text-color, inherit); }
.g45-appearance-theme :is(.g45-filter,.g45-more,.g45-page) { cursor: pointer; max-width: 100%; }
.g45-appearance-theme :is(.g45-search-input,.g45-filter-select) { max-width: 100%; min-width: 0; }
.g45-appearance-theme :is(.g45-filter,.g45-page).is-active { outline: 2px solid currentColor; outline-offset: 2px; }
.g45-gallery :is(.g45-filter,.g45-more,.g45-page,.g45-search-input,.g45-filter-select):focus-visible { outline: 3px solid var(--g45-accent); outline-offset: 3px; }
.g45-gallery .g45-title { font-weight: var(--g45-tw, 600); }
.g45-gallery .g45-filters { min-width: 0; max-width: 100%; }
.g45-gallery .g45-search { min-width: 0; max-width: 100%; }
.g45-gallery .g45-toolbar { min-width: 0; }
.g45-gallery .g45-text, .g45-gallery .g45-title, .g45-gallery .g45-sub { overflow-wrap: anywhere; }
/* Measured layouts use explicit row sizes and logical coordinates; CSS remains the no-JS fallback. */
.g45-layout-justified.g45-measured .g45-items { display: block; }
.g45-layout-justified.g45-measured .g45-items::after { display: none; }
.g45-layout-justified.g45-measured .g45-item { position: absolute; margin: 0; }
.g45-layout-justified.g45-measured .g45-link { aspect-ratio: auto; flex: none; }
.g45-layout-masonry.g45-measured .g45-items { column-count: auto; }
.g45-layout-masonry.g45-measured .g45-item { position: absolute; margin: 0; }
.g45-appearance-theme.g45-view-split .g45-text .g45-title { font-size: var(--g45-tsz, inherit); }
@media (prefers-reduced-motion: reduce) {
    .g45-gallery *, .g45-gallery *::before, .g45-gallery *::after { transition: none !important; animation: none !important; }
}

.g45-ov-btn { display: inline-block; margin-block-start: 14px; }
.g45-action-btn { position: absolute; z-index: 4; display: block; max-width: calc(100% - 20px); opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.g45-action-btn .g45-ov-btn { display: inline-block; max-width: 100%; margin: 0; pointer-events: auto; }
.g45-action-pos-center { top: 50%; left: 50%; transform: translate(-50%, -50%); }
.g45-action-pos-top_center { top: 10px; left: 50%; transform: translateX(-50%); }
.g45-action-pos-bottom_center { bottom: 10px; left: 50%; transform: translateX(-50%); }
.g45-action-pos-bottom_left { bottom: 10px; left: 10px; }
.g45-action-pos-bottom_right { bottom: 10px; right: 10px; }
.g45-title-always .g45-action-btn,
.g45-title-hover .g45-link:hover .g45-action-btn,
.g45-title-hover .g45-link:focus-visible .g45-action-btn,
.g45-title-none .g45-link:hover .g45-action-btn,
.g45-title-none .g45-link:focus-visible .g45-action-btn { opacity: 1; pointer-events: auto; }
@media (hover: none) { .g45-has-action .g45-action-btn { opacity: 1; pointer-events: auto; } }
@media (prefers-reduced-motion: reduce) { .g45-action-btn { transition: none; } }
.g45-appearance-theme.g45-bst-outline :is(.g45-filter,.g45-more,.g45-page) { background: transparent; color: inherit; border: 1px solid currentColor; padding: .55em 1.15em; }

.g45-appearance-theme :is(.g45-filter,.g45-page).is-active { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .22em; }
.g45-gallery .g45-vp { --vp: var(--g45-accent); }

/* List retains one item per row in the legacy engine as well. */
.g45-layout-justified.g45-lay-list:not(.g45-measured) .g45-items { display: block; }
.g45-layout-justified.g45-lay-list:not(.g45-measured) .g45-item { width: 100%; margin-bottom: var(--g45-gap); }
.g45-gallery.g45-skin-circular .g45-item { box-shadow: none; }

.g45-gallery.g45-skin-circular .g45-link { border: var(--g45-bw) solid var(--g45-bc); }
.g45-skin-circular.g45-sh-soft .g45-link { box-shadow: 0 2px 10px rgba(0,0,0,.14); }
.g45-skin-circular.g45-sh-strong .g45-link { box-shadow: 0 10px 28px rgba(0,0,0,.34); }
/* A narrow card stacks even inside a wide desktop gallery. */
.g45-view-split .g45-item { container-type: inline-size; container-name: g45-view-card; }
@container g45-view-card (max-width: 340px) {
    .g45-view-split .g45-link { grid-column: 1 / -1; grid-row: 1; }
    .g45-view-split .g45-text { grid-column: 1 / -1; grid-row: 2; }
    .g45-view-split .g45-react { grid-column: 1 / -1; grid-row: 3; }
}

/* The optional action remains usable with every skin, even when titles are hidden. */
.g45-has-action.g45-title-none .g45-link:hover .g45-cap,
.g45-has-action.g45-title-none .g45-link:focus-visible .g45-cap { opacity: 1; transform: none; }
@media (hover: none) {
    .g45-has-action .g45-cap { opacity: 1; transform: none; }
    .g45-has-action:not(.g45-m-titles):not(.g45-title-none) .g45-cap .g45-title,
    .g45-has-action:not(.g45-m-titles) .g45-cap .g45-sub { display: none; }
}
.g45-gallery .g45-ov-btn { align-self: center; max-width: 100%; padding: .55em 1.3em; border: 1px solid currentColor; line-height: 1.2; }
/* The same icon assets are used in cards and in the viewer. */
.g45-icon-system .g45-r :is(svg,.g45-custom-icon), .g45-lb [data-icon-name] :is(svg,.g45-custom-icon) { width: var(--g45-icon-size,22px); height: var(--g45-icon-size,22px); flex: none; object-fit: contain; }
.g45-custom-icon { display: inline-block; }
.g45-icon-tint { background: currentColor; mask-size: contain; mask-position: center; mask-repeat: no-repeat; -webkit-mask-size: contain; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; }
.g45-gallery.g45-icon-system .g45-react[data-icon-position] { position:absolute; inset-block-start:var(--g45-icon-inset,8px); inset-block-end:auto; inset-inline-start:auto; inset-inline-end:var(--g45-icon-inset,8px); transform:none; padding:0; gap:var(--g45-icon-gap,4px); flex-wrap:wrap; max-width:calc(100% - 2 * var(--g45-icon-inset,8px)); }
.g45-gallery.g45-icon-system .g45-react[data-icon-position="top_start"], .g45-gallery.g45-icon-system .g45-react[data-icon-position="center_start"], .g45-gallery.g45-icon-system .g45-react[data-icon-position="bottom_start"] { inset-inline-start:var(--g45-icon-inset,8px); inset-inline-end:auto; }
.g45-gallery.g45-icon-system .g45-react[data-icon-position="top_center"], .g45-gallery.g45-icon-system .g45-react[data-icon-position="center"], .g45-gallery.g45-icon-system .g45-react[data-icon-position="bottom_center"] { inset-inline-start:auto; inset-inline-end:auto; left:50%; right:auto; transform:translateX(-50%); }
.g45-gallery.g45-icon-system .g45-react[data-icon-position^="center"] { inset-block-start:50%; transform:translateY(-50%); }
.g45-gallery.g45-icon-system .g45-react[data-icon-position="center"] { transform:translate(-50%,-50%); }
.g45-gallery.g45-icon-system .g45-react[data-icon-position^="bottom"] { inset-block-start:auto; inset-block-end:var(--g45-icon-inset,8px); }
.g45-gallery.g45-icon-system .g45-react[data-icon-position^="below"] { position:static; max-width:100%; padding:4px 12px 10px; justify-content:flex-start; transform:none; }
.g45-gallery.g45-icon-system .g45-react[data-icon-position="below_center"] { justify-content:center; }
.g45-gallery.g45-icon-system .g45-react[data-icon-position="below_end"] { justify-content:flex-end; }
.g45-react .g45-r[hidden], .g45-lb [data-icon-name][hidden] { display:none!important; }

.g45-lb [data-icon-name] { min-width:calc(var(--g45-icon-size,22px) + 12px); min-height:calc(var(--g45-icon-size,22px) + 12px); }

.g45-lb-icon-group { position:absolute;z-index:5;display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 24px); }
.g45-lb-icon-group .g45-lb-btn { position:static; }
.g45-lb-icon-group[hidden] { display:none!important; }

/* Thumbnail fitting never changes the original image in the lightbox. */
.g45-gallery .g45-item .g45-img { object-fit:var(--g45-image-fit,cover);object-position:var(--g45-focus-x,50%) var(--g45-focus-y,50%); }
/* Optional badges and configurable media controls. */
.g45-media-control { box-sizing:border-box; display:inline-flex;align-items:center;justify-content:center;gap:0; width:calc(var(--g45-ctl-size,26px) + 18px);height:calc(var(--g45-ctl-size,26px) + 18px);padding:8px;min-width:0; color:var(--g45-ctl-color,#fff);background:var(--g45-ctl-bg,#252525);border:var(--g45-ctl-bw,0px) solid var(--g45-ctl-border,#fff);border-radius:var(--g45-ctl-radius,40px);line-height:1;transition:background-color .15s,opacity .15s; }
.g45-media-control > svg,.g45-media-control > .g45-custom-icon { width:var(--g45-ctl-size,26px);height:var(--g45-ctl-size,26px);max-width:none;flex:none; }
.g45-media-control:hover,.g45-link:hover .g45-play.g45-media-control { background:var(--g45-ctl-hover,#555); }
.g45-media-control:focus-visible { outline:3px solid var(--g45-ctl-focus,#fc3);outline-offset:3px; }
.g45-media-control:active { background:var(--g45-ctl-active,#111); }
.g45-play.g45-media-control { margin:0;z-index:4;transform:none; }
.g45-play.g45-media-control::after { content:none; }
.g45-media-control[data-visibility="hover"] { opacity:0; }
.g45-lb:hover .g45-media-control[data-visibility="hover"],.g45-lb:focus-within .g45-media-control[data-visibility="hover"],.g45-link:hover .g45-media-control[data-visibility="hover"],.g45-link:focus-visible .g45-media-control[data-visibility="hover"],.g45-vp:hover .g45-media-control[data-visibility="hover"],.g45-vp:focus-within .g45-media-control[data-visibility="hover"] { opacity:1; }
.g45-media-control[hidden],.g45-badge[hidden] { display:none!important; }
.g45-lb .g45-lb-prev.g45-media-control,.g45-lb .g45-lb-next.g45-media-control { margin:0; }
.g45-vp .g45-vp-big.g45-media-control { margin:0; }
.g45-vp .g45-vp-play.g45-media-control { position:relative;inset:auto;transform:none;width:36px;height:36px;padding:5px; }
.g45-vp .g45-vp-play.g45-media-control > * { width:22px;height:22px; }
.g45-lb[dir="rtl"] .g45-lb-prev.g45-media-control > *,.g45-lb[dir="rtl"] .g45-lb-next.g45-media-control > * { transform:scaleX(-1); }
.g45-lb[dir="rtl"] .g45-lb-prev.g45-media-control svg,.g45-lb[dir="rtl"] .g45-lb-next.g45-media-control svg { transform:scaleX(-1); }
.g45-badges { position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden; }
.g45-badge { box-sizing:border-box;position:absolute;display:inline-flex;align-items:center;gap:4px;max-width:calc(50% - 12px);padding:5px 8px;border-radius:4px;color:var(--g45-badge-fg,#fff);background:var(--g45-badge-bg,#31579c);font-size:var(--g45-badge-size,12px);line-height:1.3;font-weight:600;pointer-events:none; }
.g45-badge > svg,.g45-badge > img,.g45-badge > .g45-badge-custom-icon { flex:none;width:var(--g45-badge-icon-size,1.25em);height:var(--g45-badge-icon-size,1.25em);object-fit:contain; }
.g45-badge > span:not(.screen-reader-text) { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.g45-badge-ribbon { border-radius:0;transform:rotate(-25deg);margin:10px 0;transform-origin:center; }
.g45-badge-ribbon[data-corner$="end"] { transform:rotate(25deg); }
[dir="rtl"] .g45-badge-ribbon { transform:rotate(25deg); }
[dir="rtl"] .g45-badge-ribbon[data-corner$="end"] { transform:rotate(-25deg); }
.g45-item-extra-controls { margin:16px 0;padding:12px;border:1px solid #c3c4c7;border-radius:4px; }
.g45-item-extra-controls summary { cursor:pointer;font-weight:600; }
@media(hover:none){.g45-media-control[data-visibility="hover"]{opacity:1;}}
@media(prefers-reduced-motion:reduce){.g45-media-control{transition:none;}}

/* Optional reveal labels; inline positions make expansion point into each card. */
.g45-badge[data-content="text"]>svg{display:none}
.g45-badge-reveal{pointer-events:auto;cursor:help;gap:0;max-width:calc(100% - 16px)}
.g45-badge-reveal>.g45-badge-label{max-width:0;opacity:0;margin-inline-start:0;transition:max-width .22s ease,opacity .18s ease,margin-inline-start .22s ease}
.g45-badge-reveal.is-expanded>.g45-badge-label,.g45-badge-reveal:focus-visible>.g45-badge-label{max-width:16em;opacity:1;margin-inline-start:5px}
@media(hover:hover){.g45-badge-reveal:hover>.g45-badge-label{max-width:16em;opacity:1;margin-inline-start:5px}}
.g45-badge-reveal:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.g45-badge-reveal[data-corner$="end"]{flex-direction:row-reverse}
.g45-lb-badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;pointer-events:auto;max-width:100%}
.g45-lb-badges>.g45-badge{position:relative;inset:auto;max-width:100%;transform:none;margin:0;gap:4px;flex-direction:row;opacity:1;color:var(--g45-badge-fg,#fff);font-size:var(--g45-badge-size,12px)}
.g45-lb-badges .g45-badge>.g45-badge-label{color:inherit;font-size:inherit;opacity:1}
.g45-lb-badges>.g45-badge-reveal{gap:0}
.g45-lb-badges>.g45-badge-reveal>.g45-badge-label{opacity:0}
.g45-lb-badges>.g45-badge-reveal.is-expanded>.g45-badge-label,.g45-lb-badges>.g45-badge-reveal:focus-visible>.g45-badge-label{opacity:1}
@media(hover:hover){.g45-lb-badges>.g45-badge-reveal:hover>.g45-badge-label{opacity:1}}
@media(prefers-reduced-motion:reduce){.g45-badge-reveal>.g45-badge-label{transition:none}}

@media(pointer:coarse){.g45-badge-reveal{min-height:40px;min-width:40px;justify-content:center}}
.g45-badge > .g45-badge-custom-icon { display:block; flex:none; width:var(--g45-badge-icon-size,1.25em); height:var(--g45-badge-icon-size,1.25em); object-fit:contain; }
.g45-badge > .g45-badge-custom-icon.g45-icon-tint { background:currentColor; mask-size:contain;mask-position:center;mask-repeat:no-repeat;-webkit-mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat; }

.g45-category-link { color: inherit; text-decoration: underline; text-underline-offset: .15em; }
.g45-category-link:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }