/* ext-rl — полоса рилсов в карточке заведения */
.rlx { margin: 8px 0 18px; }
.rlx__strip { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 10px; scrollbar-width: thin; overscroll-behavior-x: contain; }
.rlx__card { position: relative; flex: none; width: 108px; aspect-ratio: 9 / 16; border-radius: 10px; overflow: hidden; background: #0B0C0E; color: #fff; text-decoration: none; scroll-snap-align: start;
  opacity: 0; transform: translateX(16px); animation: rlxIn .6s var(--ease) forwards; animation-delay: calc(var(--i) * 60ms); transition: box-shadow .3s; }
.rlx__card:hover { box-shadow: 0 14px 28px -14px rgba(0,0,0,.6), 0 0 0 1px var(--brass); }
@keyframes rlxIn { to { opacity: 1; transform: none; } }
.rlx__card img, .rlx__card video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.rlx__card:hover img { transform: scale(1.06); }
.rlx__card video { opacity: 0; transition: opacity .3s; }
.rlx__card.is-live video { opacity: 1; }
.rlx__card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,.7)); pointer-events: none; }
.rlx__noposter { position: absolute; inset: 0; display: grid; place-items: center; font: 400 40px var(--serif); color: var(--brass-hi); }
.rlx__play { position: absolute; left: 8px; top: 8px; z-index: 1; width: 22px; height: 22px; border-radius: 50%; background: rgba(0,0,0,.4); display: grid; place-items: center; }
.rlx__play svg { width: 10px; fill: #fff; margin-left: 2px; }
.rlx__meta { position: absolute; z-index: 1; left: 8px; right: 8px; bottom: 7px; display: grid; font-size: 11px; line-height: 1.3; }
.rlx__meta small { opacity: .75; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rlx__new { background: transparent; color: var(--ink); border: 1px dashed var(--brass); display: grid; place-content: center; justify-items: center; gap: 6px; text-align: center; padding: 10px; }
.rlx__new::after { display: none; }
.rlx__new span { font: 300 30px/1 var(--sans); color: var(--brass); transition: transform .4s var(--ease); }
.rlx__new:hover span { transform: rotate(90deg) scale(1.1); }
.rlx__new b { font: 500 15px/1.15 var(--serif); }
.rlx__sk { flex: none; width: 108px; aspect-ratio: 9 / 16; border-radius: 10px; background: linear-gradient(100deg, var(--porcelain-2) 40%, var(--paper) 50%, var(--porcelain-2) 60%) 0 0 / 300% 100%; animation: rlxSk 1.2s linear infinite; }
@keyframes rlxSk { to { background-position: -150% 0; } }