/* «Живые архивы»: демо голосов (templates/partials/blocks.html, block_voice_demo; static/js/voices.js).
   Красный = исходник (живая запись), фиолетовый = голос модели. */
.vd{--ai-c:var(--violet);margin-top:var(--space-4);color:var(--fg,var(--text-on-dark))}
.on-light .vd{--ai-c:var(--violet-deep)}
.vd [hidden]{display:none!important}
.vd__live{display:flex;align-items:center;gap:10px;margin:0 0 var(--space-3);font:600 .9375rem/1.3 var(--font-body);color:var(--ai-c)}
.vd__dot{width:10px;height:10px;border-radius:50%;background:var(--ai-c);box-shadow:0 0 0 0 var(--ai-c);animation:vd-pulse 2s infinite}
@keyframes vd-pulse{0%{box-shadow:0 0 0 0 rgba(155,123,255,.6)}70%{box-shadow:0 0 0 10px rgba(155,123,255,0)}100%{box-shadow:0 0 0 0 rgba(155,123,255,0)}}
@media(prefers-reduced-motion:reduce){.vd__dot{animation:none}}

.vd__tabs{display:flex;flex-wrap:wrap;gap:8px}
.vd__tab{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:44px;padding:12px 18px;border:1px solid var(--border-dark);background:transparent;color:var(--text-on-dark);cursor:pointer;text-align:left;font:500 .875rem/1.2 var(--font-body)}
.vd__tab b{font:900 1.0625rem/1.1 var(--font-display);letter-spacing:.02em;text-transform:uppercase}
.vd__tab span{color:var(--text-muted-on-dark)}
.vd__tab:hover{border-color:var(--cream)}
.vd__tab[aria-selected="true"]{background:var(--cream);border-color:var(--cream);color:var(--ink)}
.vd__tab[aria-selected="true"] span{color:var(--text-muted-on-light)}
.vd__tab:focus-visible,.vd .mini__btn:focus-visible,.vd textarea:focus-visible{outline:3px solid var(--ai-c);outline-offset:3px}

.vd__panel{margin-top:var(--space-4)}
.vd__cols{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--space-6)}
@media(max-width:900px){.vd__cols{grid-template-columns:minmax(0,1fr);gap:var(--space-4)}}
.vd__k{display:block;margin-bottom:var(--space-2);font:800 .8125rem/1 var(--font-display);letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted-on-dark)}
.vd__k--ai{color:var(--ai-c)}
.vd__hint{margin:var(--space-2) 0 0;font-size:.9375rem;line-height:1.45;color:var(--text-muted-on-dark)}
.vd__side{display:flex;flex-direction:column;align-self:start;min-width:0}
.vd__pic{position:relative;margin:0 0 -64px;text-align:center;pointer-events:none}
.vd__pic img{display:block;width:auto;max-width:100%;height:clamp(240px,30vw,400px);margin:0 auto;object-fit:contain;object-position:bottom}
.vd__pic figcaption{position:absolute;right:0;bottom:72px;font-size:.75rem;color:var(--text-muted-on-dark);writing-mode:vertical-rl;transform:rotate(180deg)}
.vd__panel:not([hidden]) .vd__pic img{animation:vd-in .5s ease-out}
@keyframes vd-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.vd__panel:not([hidden]) .vd__pic img{animation:none}}
@media(max-width:900px){.vd__pic img{height:260px}}
.vd__orig{position:relative;padding:var(--space-3);border:1px solid var(--border-dark);background:rgba(23,23,26,.92)}

.vd__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--border-dark)}
.vd__row{padding:12px 0}
.vd__ph{border-bottom:1px solid var(--border-dark);align-items:flex-start}
.vd__ph .mini__btn{--btn-bg:var(--ai-c);--btn-fg:var(--ink)}
.vd__ph .mini__btn:disabled{background:var(--ink-3);color:var(--text-muted-on-dark);cursor:default;filter:none}
.vd__q{font:500 1.0625rem/1.45 var(--font-body);color:var(--text-on-dark)}
.vd__ph .mini__txt{gap:4px;padding-top:2px}
.vd__ph .mini__n{white-space:normal}
.vd__ph.is-on .vd__q{color:var(--ai-c)}
.vd .mini.is-on .mini__t{color:var(--red-2)}
.vd__st{flex:none;min-width:3.2em;padding-top:12px;text-align:right;font:600 .875rem/1.2 var(--font-body);font-variant-numeric:tabular-nums;color:var(--text-muted-on-dark)}
.vd__st.is-live{color:var(--ai-c)}
.vd__ph.is-wait .mini__ic{animation:vd-blink 1s infinite}
@keyframes vd-blink{50%{opacity:.25}}
@media(max-width:620px){.vd__st{min-width:0;max-width:5.5em}}

.vd__free{margin-top:var(--space-6);padding:var(--space-3);border:1px solid var(--ai-c)}
.vd__free textarea{width:100%;box-sizing:border-box;padding:12px;border:1px solid var(--border-dark);background:var(--ink);color:var(--text-on-dark);font:400 1.0625rem/1.45 var(--font-body);resize:vertical}
.vd__free-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:var(--space-2)}
.vd__free-row .vd__st{padding-top:0;text-align:left}
.vd__hist{margin-top:var(--space-3)}
.vd__dl{flex:none;align-self:center;min-height:44px;display:inline-flex;align-items:center;padding:0 4px;font:700 .8125rem/1 var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--ai-c);text-decoration:none}
.vd__dl:hover{text-decoration:underline}

.vd__label{display:flex;align-items:center;gap:10px;margin:var(--space-4) 0 0;font-size:.875rem;line-height:1.4;color:var(--text-muted-on-dark)}
.vd__label .ai-badge{margin:0;padding:2px 8px;font-size:.75rem;letter-spacing:.08em}
/* на странице «Живые архивы» основной акцент фиолетовый вместо красного (DESIGN.md, исключение раздела) */
.arhivy .label.red{background:var(--violet-deep)}
.arhivy .page-hero .btn:not(.ghost),.arhivy .bk .btn{background:var(--ai);border-color:transparent}
.arhivy .btn.ghost:hover{box-shadow:5px 5px 0 var(--violet)}
.arhivy .end-band{background:var(--ai)}
.arhivy .bk--cream .bk-card__ic{color:var(--violet-deep)}
.arhivy .bk__prose a{text-decoration-color:var(--violet)}