:root{color-scheme:dark;--gallery-ui-bg:rgba(7,7,7,.58);--gallery-border:rgba(255,255,255,.14);--gallery-text:#f4efe5;--gallery-muted:rgba(244,239,229,.72)}
*{box-sizing:border-box}
html{background:#050505;scroll-behavior:smooth;scroll-snap-type:y mandatory}
body.gallery-page{margin:0;background:#050505;color:var(--gallery-text);font-family:Georgia,"Times New Roman",serif;overflow-x:hidden;scrollbar-width:none}
body.gallery-page::-webkit-scrollbar{display:none}
.world-gallery{position:relative;scroll-snap-type:y mandatory}
.gallery-slide{position:relative;display:grid;place-items:center;width:100%;height:100svh;min-height:520px;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always;background:#050505;isolation:isolate}
.gallery-backdrop{position:absolute;inset:-4%;z-index:-3;background-position:center;background-size:cover;filter:blur(30px) brightness(.38) saturate(.92);transform:scale(1.1)}
.gallery-photo{position:relative;z-index:-1;width:100%;height:100%;object-fit:contain;object-position:center;user-select:none;opacity:.58;transform:none;transition:opacity 1.2s ease;will-change:opacity}
.gallery-slide.is-active .gallery-photo{opacity:1;transform:none}
.gallery-transition-fade .gallery-photo{transform:none;transition:opacity 1.15s ease}
.gallery-transition-plain .gallery-photo{opacity:1;transform:none;transition:none}
.gallery-vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.38),transparent 24%,transparent 72%,rgba(0,0,0,.55)),radial-gradient(circle at center,transparent 48%,rgba(0,0,0,.38) 100%)}
.gallery-caption{position:absolute;left:max(24px,env(safe-area-inset-left));bottom:max(26px,calc(env(safe-area-inset-bottom) + 16px));z-index:3;max-width:min(70vw,760px);font-size:clamp(18px,2.1vw,34px);letter-spacing:.04em;text-shadow:0 2px 18px #000;opacity:0;transform:translateY(12px);transition:opacity .7s ease .25s,transform .7s ease .25s}
.gallery-slide.is-active .gallery-caption{opacity:.94;transform:none}
.gallery-ui{position:fixed;z-index:20;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));display:flex;align-items:center;justify-content:space-between;gap:14px;pointer-events:none;transition:opacity .35s ease}
.gallery-ui-left,.gallery-ui-right{display:flex;align-items:center;gap:8px;pointer-events:auto}
.gallery-ui-left{min-width:0}
.gallery-page-title{max-width:36vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:10px 12px;border:1px solid var(--gallery-border);border-radius:999px;background:var(--gallery-ui-bg);backdrop-filter:blur(14px);font-size:14px;letter-spacing:.05em}
.gallery-control,.gallery-icon-btn{appearance:none;border:1px solid var(--gallery-border);background:var(--gallery-ui-bg);color:var(--gallery-text);border-radius:999px;min-height:42px;padding:0 15px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font:600 13px/1 Arial,sans-serif;letter-spacing:.02em;cursor:pointer;backdrop-filter:blur(14px);transition:background .2s ease,border-color .2s ease,transform .2s ease}
.gallery-icon-btn{width:42px;padding:0;font-size:20px}
.gallery-control:hover,.gallery-icon-btn:hover,.gallery-control.is-active{background:rgba(164,126,67,.68);border-color:rgba(231,205,151,.54)}
.gallery-control:active,.gallery-icon-btn:active{transform:scale(.96)}
.gallery-counter{padding:10px 12px;border:1px solid var(--gallery-border);border-radius:999px;background:var(--gallery-ui-bg);backdrop-filter:blur(14px);font:600 12px/1 Arial,sans-serif;color:var(--gallery-muted)}
.gallery-progress{display:flex;align-items:center;gap:8px;height:42px;padding:0 12px;border:1px solid var(--gallery-border);border-radius:999px;background:var(--gallery-ui-bg);backdrop-filter:blur(14px);font:600 11px/1 Arial,sans-serif;color:var(--gallery-muted)}
.gallery-progress input{width:120px;accent-color:#c9a363;cursor:pointer}
.gallery-progress-time{min-width:74px;text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.gallery-enter{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 42%,rgba(38,29,19,.3),rgba(0,0,0,.88));cursor:pointer;transition:opacity .8s ease,visibility .8s ease}
.gallery-enter.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.gallery-enter-inner{text-align:center;max-width:720px;text-shadow:0 3px 24px #000;animation:galleryPulse 3.2s ease-in-out infinite}
.gallery-enter-mark{display:block;font-size:38px;color:#d8b777;margin-bottom:16px}
.gallery-enter-title{display:block;margin:0 0 15px;font-size:clamp(38px,7vw,92px);font-weight:500;letter-spacing:.04em}
.gallery-enter-text{display:block;margin:0;color:var(--gallery-muted);font:500 clamp(14px,2vw,20px)/1.5 Arial,sans-serif;letter-spacing:.05em}
@keyframes galleryPulse{50%{transform:translateY(-4px);opacity:.82}}
.gallery-arrow{position:fixed;z-index:18;right:max(18px,env(safe-area-inset-right));width:46px;height:46px;border-radius:50%;border:1px solid var(--gallery-border);background:var(--gallery-ui-bg);color:#fff;font-size:23px;cursor:pointer;backdrop-filter:blur(12px)}
.gallery-arrow-up{bottom:82px}.gallery-arrow-down{bottom:28px}
.gallery-empty{height:100svh;display:grid;place-items:center;text-align:center;padding:30px;background:radial-gradient(circle at 50% 35%,#21180f,#050505 62%)}
.gallery-empty h1{font-size:clamp(38px,7vw,82px);font-weight:500;margin:0 0 16px}.gallery-empty p{color:var(--gallery-muted);margin:0 0 24px}
@media(max-width:760px){
 .gallery-ui{align-items:flex-start}.gallery-ui-right{flex-wrap:wrap;justify-content:flex-end}.gallery-page-title{display:none}.gallery-counter{order:4}.gallery-control{min-height:40px;padding:0 11px;font-size:12px}.gallery-progress{height:40px;padding:0 9px;gap:6px}.gallery-progress input{width:72px}.gallery-progress-time{display:none}.gallery-icon-btn{width:40px;min-height:40px}.gallery-caption{left:18px;bottom:24px;max-width:75vw;font-size:20px}.gallery-arrow{display:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.gallery-photo,.gallery-caption,.gallery-enter{transition:none!important;animation:none!important}}

/* Экран входа является настоящей кнопкой: это надёжнее разблокирует звук на Android. */
button.gallery-enter{appearance:none;-webkit-appearance:none;width:100%;border:0;color:var(--gallery-text);font:inherit;text-align:inherit}
button.gallery-enter:focus-visible{outline:2px solid #d8b777;outline-offset:-5px}


button.gallery-enter:disabled{cursor:wait;opacity:1}
button.gallery-enter[disabled] .gallery-enter-text{opacity:.72}
audio[data-gallery-audio]{position:fixed;width:1px;height:1px;opacity:0;pointer-events:none;left:-9999px;top:-9999px}
