:root{color-scheme:dark;--bg:#111;--panel:#1e1e1e;--text:#f2f2f2;--muted:#bdbdbd;--accent:#dedede;--line:#484848;font:17px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}
picture{display:block}
body{margin:0;background:var(--bg);color:var(--text)}
html{scroll-padding-top:140px}
a{color:inherit;text-decoration:none}
.prose a{font-weight:600}
.skip-link:hover{color:#000}
a:hover{color:var(--accent)}
button,.button{font:inherit;border:1px solid var(--line);border-radius:3px;padding:.55rem .9rem;background:var(--panel);color:var(--text);cursor:pointer;display:inline-block;text-decoration:none;min-height:44px}
button:hover,.button:hover{border-color:var(--accent);color:var(--accent)}
button:disabled{cursor:default;opacity:.6}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
button:focus-visible{position:relative;z-index:2}
.skip-link{position:absolute;left:1rem;top:-5rem;padding:.75rem;background:var(--text);color:var(--bg);z-index:20}
.skip-link:focus{top:1rem}
.site-header{padding:1.25rem clamp(1rem,4vw,4rem);display:flex;gap:2rem;align-items:center;border-bottom:1px solid var(--line)}
.brand{font-size:1.85rem;font-weight:300;text-decoration:none;letter-spacing:-.07em;white-space:nowrap}
.brand span{color:var(--accent)}
#site-nav{display:flex;align-items:center;gap:1.25rem;margin-left:auto;flex-wrap:wrap;font-size:.9rem}
#site-nav>a{text-decoration:none}
#site-nav [aria-current]{color:#fff;font-weight:600}
.languages{display:flex;gap:.6rem;font-size:.8rem}
.gallery-menu{position:relative}
.gallery-menu summary{cursor:pointer;min-height:44px;display:flex;align-items:center}
.gallery-menu summary::after{content:'';width:.45rem;height:.45rem;border-right:1px solid currentColor;border-bottom:1px solid currentColor;margin-left:.65rem;transform:translateY(-2px) rotate(45deg);transition:transform .22s ease}
.gallery-menu[open]>summary::after{transform:translateY(2px) rotate(225deg)}
.gallery-menu summary::-webkit-details-marker{display:none}
.submenu{position:absolute;z-index:5;min-width:12rem;padding:.5rem;background:var(--panel);border:1px solid var(--line);box-shadow:0 .5rem 1rem #0008}
.submenu a{display:block;padding:.35rem .7rem}
.menu-toggle{margin-left:auto}
main{max-width:1500px;margin:auto;padding:2rem clamp(1rem,4vw,4rem) 4rem;min-height:60vh}
.page-heading{margin:1rem 0 2rem}
h1{font-size:clamp(2rem,4vw,3.6rem);font-weight:450;line-height:1.13;max-width:22ch;margin:.5rem 0}
h2{line-height:1.25;font-size:1.4rem;font-weight:500}
p{max-width:75ch}
.intro{max-width:55ch;color:var(--muted);margin-bottom:2rem;font-size:1.15rem}
.category-grid,.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.category-card{display:block;text-decoration:none}
.category-card img{display:block;width:100%;height:auto;aspect-ratio:1.15;object-fit:cover}
.category-card h2{margin:.7rem 0 1.5rem}
.photo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.photo-link{display:block}
.photo-link img{display:block;width:100%;height:auto;aspect-ratio:1.15;object-fit:cover}
.gallery-contact{margin-top:2rem}
.place-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.place-list a{display:block;padding:1rem;background:var(--panel)}
.map-placeholder{background:var(--panel);border:1px solid var(--line);padding:1.5rem;min-height:12rem}
.map-placeholder.has-map{height:55vh;padding:0;z-index:0}
.video-card{padding-bottom:1.5rem}
.video-card img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.video-card a{font-size:.85rem}
.service-grid article{background:var(--panel);padding:1.5rem}
.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:3rem}
.about-layout img{width:100%;height:auto}
.prose{max-width:780px}
.prose h2{margin-top:2rem}
footer{padding:2rem clamp(1rem,4vw,4rem);border-top:1px solid var(--line);color:var(--muted)}
footer nav{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
footer button{font-size:.9rem}
.consent-banner{position:fixed;z-index:9;bottom:0;left:0;right:0;background:var(--panel);border-top:2px solid var(--line);padding:1rem;box-shadow:0 -1rem 3rem #0006;display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}
.consent-banner p{flex:1 1 25rem;margin:.25rem 0}
.consent-banner button{flex:0 1 auto}
.consent-actions{display:flex;flex-wrap:wrap;gap:.6rem}
.dialog-close{margin-top:1.5rem}
dialog{color:var(--text);background:var(--panel);border:1px solid var(--line);padding:1.5rem;max-width:min(92vw,700px);max-height:90dvh;overflow:auto}
dialog::backdrop{background:#000b}
dialog form{margin:0}
dialog input{width:1.25rem;height:1.25rem;vertical-align:middle;accent-color:var(--accent)}
dialog label{display:inline-block;padding:.4rem 0}
#viewer{width:95vw;max-width:1500px;background:#111}
#viewer .viewer-content{display:flex;justify-content:center;margin:1rem 0}
#viewer img{display:block;max-width:100%;max-height:65dvh;width:auto;height:auto}
#viewer iframe{width:100%;height:min(65dvh,720px);aspect-ratio:16/9;border:0}
.viewer-caption{min-height:1.6em}
.viewer-navigation{display:flex;gap:1rem;justify-content:space-between}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.noscript-note{padding:1rem;color:var(--muted)}
[hidden]{display:none!important}
.image-missing{display:block;padding:2rem;background:var(--panel)}
@media(max-width:1000px){.site-header{flex-wrap:wrap;gap:1rem}
#site-nav{margin:0;width:100%}
.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){main{padding-top:1rem}
.site-header{padding:1rem}
#site-nav{align-items:stretch;flex-direction:column;gap:.4rem}
#site-nav>a{padding:.6rem 0}
.submenu{position:static;box-shadow:none}
.languages{padding:.8rem 0}
.category-grid,.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.category-card h2{font-size:1.1rem}
.service-grid,.about-layout{grid-template-columns:1fr}
.place-list{grid-template-columns:repeat(2,minmax(0,1fr))}
.consent-banner{gap:.5rem}
.consent-banner p{font-size:.85rem}
.consent-banner button{font-size:.8rem;padding:.5rem}
.about-layout{gap:1rem}
.viewer-navigation button{font-size:.9rem}
footer nav{align-items:flex-start;gap:.8rem}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}
@media print{.site-header,footer,button,dialog,.consent-banner{display:none}
body{background:white;color:black}
a{color:black}
}


@media(max-width:1000px){html.js #site-nav:not(.is-open){display:none}
html.js .menu-toggle[hidden]{display:inline-block!important}
}

/* Original refleXtions identity: black canvas, photographic covers, monochrome details. */
:root{--bg:#000;--panel:#121212;--accent:#dedede;--muted:#b8b8b8;--line:#353535;font-weight:300}
body{background:#000}
.site-header{position:sticky;top:0;z-index:8;background:#000;min-height:124px;border-bottom:0;padding:1.6rem 2rem;gap:3rem}
.brand{display:block;flex-shrink:0;line-height:0;letter-spacing:normal}
.brand img{display:block;width:230px;max-width:48vw;height:auto}
#site-nav{gap:1.6rem;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase}
#site-nav>a,.gallery-menu summary{transition:color .25s ease}
.languages{letter-spacing:.02em;text-transform:none}
.submenu{padding:.8rem;min-width:15rem;border-top:2px solid var(--accent);font-size:.75rem;letter-spacing:.05em}
.submenu a{text-decoration:none;padding:.55rem .7rem}
main{max-width:1800px;padding:1rem 2rem 5rem}
.page-heading{text-align:center;margin:1rem auto 3rem}
.page-heading h1{margin:.5rem auto;font-weight:300;letter-spacing:-.035em}
.intro{margin:0 auto 3rem;text-align:center;font-size:1rem}
.page-index .page-heading,.page-index main>.intro{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0;padding:0}
.category-grid{gap:30px}
.category-grid article{min-width:0}
.category-card{position:relative;isolation:isolate;overflow:hidden;color:white;background:#141414}
.category-card picture{overflow:hidden}
.category-card img{aspect-ratio:1.12;filter:grayscale(1);transition:filter .65s ease,transform 1s cubic-bezier(.2,.65,.3,1)}
.category-card::after{content:'';position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,#0002,#0007 55%,#0009);transition:background-color .5s}
.category-caption{position:absolute;z-index:1;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1rem;gap:1.2rem}
.category-card h2{margin:0;font-size:clamp(1.5rem,2.7vw,2.6rem);font-weight:300;letter-spacing:-.035em;color:white;text-shadow:0 2px 18px #000}
.category-action{display:inline-flex;gap:1.5rem;align-items:center;border:1px solid #fff9;padding:.55rem 1.1rem;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;background:#0006;transition:background .3s,border-color .3s,transform .5s}
.category-card:hover,.category-card:focus-visible{color:white}
.category-card:hover img,.category-card:focus-visible img{filter:grayscale(0);transform:scale(1.045)}
.category-card:hover .category-action,.category-card:focus-visible .category-action{background:#000b;border-color:var(--accent);transform:translateY(-3px)}
.photo-grid{gap:24px}
.photo-link{overflow:hidden;background:#111}
.photo-link img{filter:grayscale(1);transition:filter .5s,transform .7s}
.photo-link:hover img,.photo-link:focus-visible img{filter:grayscale(0);transform:scale(1.025)}
#viewer{background:#050505;border-color:#333}
#viewer img{max-height:72dvh}
button,.button{border-radius:0;transition:background .25s,border-color .25s,color .25s}
.service-grid article{background:transparent;border-top:1px solid var(--line);padding:1.5rem 0}
.service-grid{gap:2.5rem}
footer{border-top:0;text-align:center;padding:3rem 2rem;color:var(--muted);font-size:.85rem}
footer nav{justify-content:center}
@keyframes portfolio-enter{from{transform:translateY(18px)}to{transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){dialog[open]{animation:portfolio-enter .25s ease both}}
@media(hover:none){.category-card img,.photo-link img{filter:none}.category-action{background:#0009}}
@media(max-width:1100px){.site-header{gap:1.5rem}#site-nav{gap:1rem}}
@media(max-width:1000px){html{scroll-padding-top:116px}.site-header{min-height:100px;max-height:85dvh;overflow-y:auto}.brand img{width:205px}#site-nav{padding-top:1rem}.category-grid{gap:20px}}
@media(max-width:600px){html{scroll-padding-top:108px}.site-header{padding:1rem;min-height:92px}.brand img{width:180px}main{padding:1rem 1rem 3rem}.category-grid{grid-template-columns:1fr;gap:20px}.category-card img{aspect-ratio:1.15}.category-card h2{font-size:2.1rem}.category-action{font-size:.65rem}.page-heading{margin-bottom:2rem}.photo-grid{gap:10px}.submenu{border-top:1px solid var(--accent)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.category-action>span{display:inline-block;width:.55rem;height:.55rem;border-top:1px solid currentColor;border-right:1px solid currentColor;position:relative}
.category-action>span::after{content:"";position:absolute;width:.7rem;height:1px;background:currentColor;right:-.08rem;top:.2rem;transform:rotate(-45deg)}


/* Navigation controls and three-part footer, in the same monochrome palette. */
#site-nav{gap:.6rem}
#site-nav>a,.gallery-menu summary{padding:.65rem .8rem;color:#b8b8b8;min-height:44px;display:flex;align-items:center;transition:color .18s,background-color .18s}
#site-nav>a[aria-current]{color:#fff;background:#222}
#site-nav>a:hover,#site-nav>a:focus-visible,.gallery-menu summary:hover,.gallery-menu summary:focus-visible,.gallery-menu[open]>summary{color:#000;background:#fff}
.submenu{top:100%;left:0;transform-origin:top center;border-top:0;padding:.5rem;min-width:15rem}
.submenu a{color:#ccc;transition:background-color .18s,color .18s;min-height:44px;display:flex;align-items:center}
.submenu a:hover,.submenu a:focus-visible{background:#fff;color:#000}
@keyframes submenu-enter{from{transform:translateY(-8px) scale(.98)}to{transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:no-preference){.gallery-menu[open]>.submenu{animation:submenu-enter .22s ease-out both}}
/* Compact language disclosure: globe, current-language badge and one alternative. */
.languages{position:relative;display:block;border:0;padding:0;margin-left:.5rem;font-size:.75rem;letter-spacing:.02em;text-transform:none;align-self:center}
.languages summary{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;color:#ccc;cursor:pointer;list-style:none}
.languages summary::-webkit-details-marker{display:none}
.language-icon{display:block;width:24px;height:24px;flex-shrink:0}
.language-current{position:absolute;top:1px;right:-1px;padding:0 3px;background:#000;color:#ddd;font-size:.5rem;line-height:1.4;letter-spacing:.03em}
.languages summary:hover,.languages summary:focus-visible{color:#fff;background:#222}
.language-options{position:absolute;z-index:5;top:100%;right:0;min-width:10rem;background:var(--panel);border:1px solid var(--line);padding:.4rem;transform-origin:top right}
#site-nav .languages a{display:flex;align-items:center;gap:.7rem;min-height:44px;padding:.5rem .7rem;color:#ddd}
#site-nav .languages a:hover,#site-nav .languages a:focus-visible{background:#fff;color:#000}
.language-option-code{font-size:.65rem;letter-spacing:.08em}
@media(prefers-reduced-motion:no-preference){.languages[open]>.language-options{animation:submenu-enter .22s ease-out both}}
.page-heading{transition:opacity .3s ease,transform .3s ease}
.page-heading.is-scrolled-away{opacity:0;transform:translateY(-18px);pointer-events:none}
.site-footer{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:1.5rem;align-items:center;border-top:1px solid #222;text-align:left;font-size:.75rem}
.site-footer .footer-links{justify-content:flex-start;gap:.2rem 1rem}
.site-footer .footer-links a,.site-footer .footer-links button{display:inline-flex;align-items:center;min-height:44px}
.site-footer .footer-links button{border:0;padding:0;background:transparent;color:inherit;font:inherit}
.site-footer .footer-links a:hover,.site-footer .footer-links button:hover{color:#fff}
.footer-copyright{margin:0;max-width:none;text-align:center;justify-self:center}
.site-footer .footer-social{justify-content:flex-end;gap:.35rem}
.footer-social a{width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#bbb;transition:color .18s,background-color .18s}
.footer-social a:hover,.footer-social a:focus-visible{color:#000;background:#fff}
.footer-social svg{display:block;flex-shrink:0}
@media(max-width:1000px){.submenu,.language-options{position:static}.languages{margin:.5rem 0;padding:0;align-self:flex-start}}
@media(max-width:700px){.site-footer{grid-template-columns:minmax(0,1fr) auto;gap:1.5rem 1rem;padding:2rem 1rem}.site-footer .footer-links{grid-column:1;grid-row:1}.site-footer .footer-social{grid-column:2;grid-row:1;align-self:start}.footer-copyright{grid-column:1/-1;grid-row:2}}


/* Scroll controls: the compensated margin preserves document position while shrinking. */
.site-header{background:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 55%,transparent 100%);transition:min-height .25s ease,padding .25s ease,margin-bottom .25s ease}
.brand img{transition:width .25s ease}
.site-header.is-compact{min-height:76px;padding-top:.6rem;padding-bottom:.6rem;margin-bottom:48px}
.site-header.is-compact .brand img{width:180px}
.back-to-top{position:fixed;right:1.25rem;bottom:calc(1.25rem + var(--consent-offset,0px) + env(safe-area-inset-bottom,0px));z-index:7;display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid #777;border-radius:50%;background:#111;color:#fff;box-shadow:0 3px 18px #0008;transition:background-color .2s,color .2s}
.back-to-top:hover,.back-to-top:focus-visible{background:#fff;color:#000}
.site-footer{padding-bottom:6rem}
@media(prefers-reduced-motion:no-preference){.back-to-top:not([hidden]){animation:portfolio-enter .2s ease-out both}}
@media(max-width:1000px){.site-header{padding-top:1rem;padding-bottom:1rem}.site-header.is-compact{margin-bottom:24px}.site-header.is-compact .brand img{width:165px}}
@media(max-width:600px){.site-header.is-compact{min-height:72px;padding-top:.45rem;padding-bottom:.45rem;margin-bottom:20px}.site-header.is-compact .brand img{width:145px}.back-to-top{right:1rem}.site-footer{padding-bottom:6rem}}


/* The mobile navigation icon follows the same expanded state as the menu. */
.menu-toggle{position:relative;width:48px;height:48px;min-height:48px;padding:0;background:transparent;color:#fff}
.menu-toggle:hover,.menu-toggle:focus-visible{background:#fff;color:#000}
.menu-icon{position:absolute;left:50%;top:50%;width:24px;height:20px;transform:translate(-50%,-50%)}
.menu-icon span{position:absolute;left:0;top:9px;width:24px;height:2px;background:currentColor;transition:transform .25s ease,opacity .15s ease}
.menu-icon span:nth-child(1){transform:translateY(-7px)}
.menu-icon span:nth-child(3){transform:translateY(7px)}
.menu-toggle[aria-expanded="true"] .menu-icon span:nth-child(1){transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-icon span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] .menu-icon span:nth-child(3){transform:rotate(-45deg)}


/* Services recall the original icon cards, with readable copy and full-card links. */
.service-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem;max-width:1500px;margin:0 auto}
.service-grid .service-card{display:flex;background:#262626;border:1px solid #303030;padding:0;text-align:center;transition:transform .25s ease,border-color .25s ease,background-color .25s ease}
.service-card-link{display:flex;flex-direction:column;align-items:center;width:100%;padding:2.5rem 1.5rem;color:#f2f2f2}
.service-icon{display:flex;align-items:center;justify-content:center;gap:.15rem;min-height:76px;margin-bottom:1.5rem;transition:transform .25s ease}
.service-icon img{width:64px;height:64px;object-fit:contain;filter:invert(1)}
.service-icon--events img{width:38px}
.service-card h2{margin:0 0 .85rem;font-size:1.25rem;font-weight:400}
.service-card p{margin:0;color:#c6c6c6;font-size:.95rem;line-height:1.6;max-width:24ch}
.service-card-arrow{display:block;color:#aaa;margin-top:auto;padding-top:1.5rem;transition:transform .25s ease,color .25s ease}
.service-grid .service-card:hover,.service-grid .service-card:focus-within{transform:translateY(-4px);border-color:#777;background:#2d2d2d}
.service-card:hover .service-icon,.service-card:focus-within .service-icon{transform:scale(1.08)}
.service-card:hover .service-card-arrow,.service-card:focus-within .service-card-arrow{transform:translateX(4px);color:#fff}
.services-contact{text-align:center;max-width:none;margin:2.5rem auto 0}
@media(max-width:1200px){.service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.service-grid{grid-template-columns:1fr;gap:1rem}.service-card-link{padding:2rem 1.5rem}}


/* Native document transitions enhance normal links; other browsers use the entry animation. */
@view-transition{navigation:auto}
main{view-transition-name:page-content}
.site-header{view-transition-name:site-header}
@keyframes content-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes content-exit{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:no-preference){
 main{animation:content-enter .7s cubic-bezier(.16,1,.3,1)}
 ::view-transition-old(root),::view-transition-new(root){animation:none}
 ::view-transition-group(site-header){animation:none}
 ::view-transition-old(site-header){display:none}
 ::view-transition-new(site-header){animation:none}
 ::view-transition-old(page-content){animation:content-exit .35s ease both}
 ::view-transition-new(page-content){animation:content-enter .7s cubic-bezier(.16,1,.3,1) both}
}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}


/* Full-viewport photo viewer: only the optional thumbnail rail scrolls horizontally. */
html.viewer-open{overflow:hidden}
#viewer{inset:0;margin:0;padding:0;border:0;width:100vw;height:100dvh;max-width:none;max-height:none;overflow:hidden;background:#050505;color:#eee}
#viewer[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:0;animation:none}
#viewer::backdrop{background:#000}
#viewer .viewer-toolbar{position:relative;z-index:3;display:flex;align-items:center;gap:2px;min-width:0;padding:.3rem .75rem;padding-top:max(.3rem,env(safe-area-inset-top));background:#101010}
#viewer button,#viewer .viewer-toolbar a,#viewer .viewer-more summary{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:44px;height:44px;min-height:44px;padding:10px;border:0;border-radius:0;background:transparent;color:#ddd;cursor:pointer}
#viewer button:hover,#viewer button:focus-visible,#viewer .viewer-toolbar a:hover,#viewer .viewer-toolbar a:focus-visible,#viewer .viewer-more summary:hover,#viewer .viewer-more summary:focus-visible{background:#333;color:#fff}
#viewer button:disabled{opacity:.3;cursor:default}
#viewer svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
#viewer [data-viewer-close]{order:99}
.viewer-counter{flex:1;min-width:3rem;font-size:.75rem;font-variant-numeric:tabular-nums;padding:0 .4rem}
.viewer-more{position:relative}
.viewer-more summary{list-style:none}
.viewer-more summary::-webkit-details-marker{display:none}
.viewer-more-panel{position:absolute;top:100%;right:0;display:flex;padding:.35rem;background:#171717;border:1px solid #444;box-shadow:0 8px 30px #0008}
#viewer .viewer-stage{position:relative;min-height:0;min-width:0;overflow:hidden}
#viewer .viewer-content{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);place-items:center;overflow:hidden;margin:0;touch-action:none;user-select:none}
#viewer .viewer-content img{grid-area:1/1;width:100%;height:100%;max-width:none;max-height:none;min-width:0;min-height:0;object-fit:contain;transform-origin:center;pointer-events:none;will-change:transform}
#viewer .viewer-content.is-zoomed{cursor:grab}
#viewer .viewer-content.is-dragging{cursor:grabbing}
#viewer .viewer-content iframe{width:100%;height:100%;max-height:none;border:0}
#viewer .viewer-navigation{position:absolute;inset:50% 0 auto;display:flex;justify-content:space-between;gap:0;transform:translateY(-50%);pointer-events:none}
#viewer .viewer-navigation button{pointer-events:auto;width:48px;height:64px;background:#0008;color:#fff}
#viewer .viewer-navigation button:hover{background:#222d}
#viewer .viewer-status{position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);max-width:85%;margin:0;padding:.35rem .75rem;background:#111d;font-size:.8rem;text-align:center;pointer-events:none}
#viewer .viewer-status:empty{display:none}
.viewer-progress{position:absolute;bottom:0;left:0;right:0;height:2px;pointer-events:none}
.viewer-progress span{display:block;height:100%;background:#ddd;transform:scaleX(0);transform-origin:left}
#viewer .viewer-thumbnails{display:flex;gap:8px;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;padding:10px max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom));background:#111}
.viewer-thumbnails::-webkit-scrollbar{display:none}
#viewer .viewer-thumbnails button{position:relative;width:76px;height:62px;flex:0 0 76px;padding:2px;border:2px solid transparent;opacity:.6}
#viewer .viewer-thumbnails button[aria-current]{border-color:#fff;opacity:1}
#viewer .viewer-thumbnails img{display:block;width:100%;height:100%;object-fit:cover;max-height:none}
#viewer .viewer-share-link{position:absolute;z-index:4;left:5%;bottom:1rem;width:90%;height:44px;padding:.5rem;background:#222;color:#fff;border:1px solid #aaa;font-size:16px}
#viewer .icon-pause,#viewer [aria-pressed="true"]>.icon-play{display:none}
#viewer [aria-pressed="true"]>.icon-pause{display:block}
@media(max-width:600px){#viewer .viewer-toolbar{gap:0;padding-left:.5rem;padding-right:.5rem}#viewer .viewer-toolbar button,#viewer .viewer-toolbar a,#viewer .viewer-more summary{width:40px}.viewer-counter{min-width:2.5rem;padding:0 .2rem}#viewer .viewer-navigation button{width:40px;height:56px}#viewer .viewer-thumbnails button{width:64px;flex-basis:64px;height:54px}}

#viewer.is-video .viewer-toolbar{justify-content:flex-end}

#viewer[open]{grid-template-rows:minmax(0,1fr)}
.viewer-shell{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-width:0;min-height:0;width:100%;height:100%;overflow:hidden;background:#050505}
.viewer-shell:fullscreen{width:100vw;height:100dvh}