/* Общая база всех трёх версий: язык, лайтбокс, появление, доступность */
html[data-lang="ru"] [lang="en"], html[data-lang="en"] [lang="ru"] { display: none !important; }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; overflow-x: clip; }
main { display: block; overflow-x: clip; }
img { max-width: 100%; height: auto; display: block; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
a { color: inherit; }
mark { background: none; color: inherit; }
[data-full] { cursor: zoom-in; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* фильтр стороны */
main[data-filter="su"] [data-side="us"], main[data-filter="us"] [data-side="su"] { display: none !important; }

/* появление */
.rv { opacity: 0; transform: translate3d(0, 28px, 0); transition: opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); transition-delay: var(--d, 0s); }
.rv.in { opacity: 1; transform: none; }
html.no-js .rv { opacity: 1; transform: none; }

/* лайтбокс */
.lb { position: fixed; inset: 0; z-index: 900; display: grid; place-items: center; background: rgba(6, 7, 10, .94);
  opacity: 0; pointer-events: none; transition: opacity .3s; }
.lb.open { opacity: 1; pointer-events: auto; }
.lb img { max-width: min(94vw, 1800px); max-height: 84vh; width: auto; height: auto; object-fit: contain; cursor: zoom-out; }
.lb figure { margin: 0; display: grid; gap: 12px; justify-items: center; }
.lb figcaption { color: #e9e6df; font: 13px/1.4 var(--f-mono, monospace); letter-spacing: .06em; text-transform: uppercase; text-align: center; padding: 0 16px; }
.lb button { position: absolute; color: #e9e6df; font: 28px/1 var(--f-mono, monospace); padding: 18px; opacity: .7; }
.lb button:hover { opacity: 1; }
.lb .lb-x { top: 8px; right: 8px; }
.lb .lb-p { left: 4px; top: 50%; transform: translateY(-50%); }
.lb .lb-n { right: 4px; top: 50%; transform: translateY(-50%); }
@media (hover: none) { .lb .lb-p, .lb .lb-n { display: none; } }

@media (prefers-reduced-motion: reduce) {
  *:not(.tr):not(.tr *), *:not(.tr):not(.tr *)::before, *:not(.tr):not(.tr *)::after { animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; scroll-behavior: auto !important; }
  .rv { opacity: 1; transform: none; }
}
