/* Портреты голосов становятся кнопками, когда служба отдала образцы. Цвета и радиус из переменных мира. */
.vgrid.is-live .vf{cursor:pointer}
.vf-play{position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.vf-play:focus-visible{outline:3px solid var(--w-acc);outline-offset:-6px}
.vf-badge{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--w-acc);color:var(--w-on-acc);box-shadow:0 10px 24px -12px rgba(0,0,0,.6);transition:transform .2s cubic-bezier(.23,1,.32,1)}
.vf-play:active .vf-badge{transform:scale(.97)}
.vf-badge .i-stop{display:none}
.vf-play.is-playing .i-play{display:none}.vf-play.is-playing .i-stop{display:block}
.vf-play.is-playing .vf-badge::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--w-acc);opacity:0;animation:vfRing 1.4s cubic-bezier(.23,1,.32,1) infinite}
@keyframes vfRing{0%{transform:scale(.9);opacity:.8}100%{transform:scale(1.25);opacity:0}}
@media (hover:hover) and (pointer:fine){.vf-play:hover .vf-badge{transform:scale(1.06)}}
.vf-now{max-width:680px;margin:18px auto 0;padding:0 16px;text-align:center;color:var(--w-ink2);font-size:15px;line-height:1.45;min-height:1.45em}
@media (prefers-reduced-motion:reduce){.vf-play.is-playing .vf-badge::after{animation:none;opacity:.6}.vf-badge{transition:none}}
.vf-text{max-width:720px;margin:10px auto 0;padding:0 16px;text-align:center;color:var(--w-ink);font-size:16px;line-height:1.5}
.vf-text p{margin:0 0 6px}
.vf-more{background:none;border:0;padding:8px 4px;min-height:44px;font:inherit;font-size:15px;color:var(--w-acc);text-decoration:underline;cursor:pointer}
.vf-more:focus-visible{outline:2px solid var(--w-acc);outline-offset:2px}