/* Живая речь: полки и экран ролика.
   Поверх player.css, themes.css, cinema.css и countries.css: свои только те
   куски, которых там нет. Плеер и словарь берутся из общего движка embed. */

/* ── полки ───────────────────────────────────────────────────── */
.lv-shelf{max-width:1180px;margin:0 auto 34px}
.lv-shelf h2{font-family:var(--font-d);font-size:1.25rem;font-weight:600;margin:0 0 6px}
.lv-line{color:var(--ink-dim);font-size:.875rem;line-height:1.55;margin:0 0 16px;max-width:70ch}
.lv-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(288px,1fr))}

.lv-card{display:flex;flex-direction:column;overflow:hidden;border-radius:20px;text-decoration:none;
  color:var(--ink);background:var(--core);box-shadow:inset 0 0 0 1px var(--shell-line);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
a.lv-card:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--gold) 40%,transparent),0 20px 44px -24px color-mix(in oklab,var(--gold) 45%,transparent)}
a.lv-card:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.lv-card.off{opacity:.92}

.lv-thumb{position:relative;aspect-ratio:16/9;background-size:cover;background-position:center;background-color:#000}
.lv-card.off .lv-thumb{filter:grayscale(.55);opacity:.5}
.lv-badge{position:absolute;left:10px;bottom:10px;font-size:.6875rem;font-weight:700;padding:4px 9px;border-radius:99px;
  color:var(--mint);background:color-mix(in oklab,#000 62%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--mint) 40%,transparent)}
.lv-badge.wait{color:var(--gold);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--gold) 40%,transparent)}
.lv-min{position:absolute;right:10px;bottom:10px;font-size:.6875rem;font-weight:700;padding:4px 9px;border-radius:99px;
  color:#e8e4da;background:color-mix(in oklab,#000 62%,transparent)}

.lv-body{display:flex;flex-direction:column;gap:5px;padding:14px 16px 16px}
.lv-body h3{font-family:var(--font-d);font-size:1.0625rem;font-weight:600;margin:0}
.lv-ch{color:var(--gold);font-size:.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.lv-note{color:var(--ink-dim);font-size:.8438rem;line-height:1.5;margin:0}
.lv-why{color:var(--ink-faint);font-size:.8125rem;line-height:1.5;margin:6px 0 0}
.lv-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.lv-chip{font-size:.6875rem;font-weight:700;padding:4px 9px;border-radius:99px;color:var(--ink-dim);background:var(--shell)}

.lv-count{color:var(--ink-faint);font-size:.75rem;margin:0 0 16px}

/* ── экран ролика ────────────────────────────────────────────── */
.lv-stage{max-width:900px;margin:0 auto}
.lv-hook{max-width:62ch;margin:0 0 18px;font-family:var(--font-d);font-size:clamp(1.0625rem,2.4vw,1.3125rem);
  font-weight:600;line-height:1.45;color:var(--ink)}
.lv-break{display:flex;flex-direction:column;gap:16px;max-width:68ch}
.lv-break section{padding:0}
.lv-break h3{font-family:var(--font-d);font-size:1rem;font-weight:600;margin:0 0 5px;color:var(--gold)}
.lv-break p{margin:0;font-size:.9375rem;line-height:1.65;color:var(--ink)}

.lv-watch{margin:18px 0 0;padding:14px 16px;border-radius:16px;background:var(--shell);max-width:68ch}
.lv-watch b{display:block;font-size:.8125rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-dim);margin-bottom:8px}
.lv-watch ul{margin:0;padding-left:18px;color:var(--ink);font-size:.9063rem;line-height:1.6}
.lv-watch li+li{margin-top:5px}

.cp-origin{align-self:flex-start;margin-top:8px;font-size:.6563rem;font-weight:700;padding:3px 8px;border-radius:99px;
  color:var(--ink-dim);background:var(--shell)}
.cp-note{color:var(--ink-faint);font-size:.8125rem;line-height:1.5;margin-top:4px}

.lv-warn{margin:16px 0 0;padding:13px 16px;border-radius:16px;max-width:68ch;
  color:var(--ink);font-size:.875rem;line-height:1.55;background:var(--gold-soft);
  box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--gold) 30%,transparent)}
.lv-warn b{color:var(--gold)}

.lv-honest{margin:0;padding:14px 16px;border-radius:16px;max-width:68ch;color:var(--ink-dim);
  font-size:.8438rem;line-height:1.6;background:var(--shell)}
/* Транскрипция тут стоит обычным блоком, а не колонкой у плеера: снимаем
   и растяжку по флексу, и градиентную маску (она съедала первые 22 пикселя
   текста, и честная плашка читалась полупрозрачной). */
.lv-lines{margin-top:12px;max-width:68ch;flex:none;mask-image:none;-webkit-mask-image:none}

.lv-next{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.lv-next a{min-height:42px;display:inline-flex;align-items:center;padding:0 16px;border-radius:99px;text-decoration:none;
  font-size:.875rem;font-weight:700;color:var(--gold);background:var(--gold-soft);
  box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--gold) 30%,transparent)}
.lv-next a:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

@media (max-width:700px){
  .lv-grid{grid-template-columns:1fr}
}