/* Екран відео між анкетою і результатом: відлік → звук → відео → «Дивитись результат».
   Перенесено з /diagnostic (там інлайн), тут — окремим файлом для /vytoky. */
.dv{position:fixed;inset:0;background:#000;z-index:9998;display:none}
.dv.is-on{display:block}
.dv__video{width:100%;height:100%;object-fit:cover;object-position:center bottom;opacity:0;transition:opacity .5s ease}
/* Ролик вертикальний 9:16. На широкому екрані «cover» лишав самі руки й стіл —
   там показуємо його цілком, по центру, на темному тлі. */
@media (min-aspect-ratio: 4/5){
  .dv{background:radial-gradient(ellipse at center,#1c1c1c 0%,#000 72%)}
  .dv__video{object-fit:contain;object-position:center center}
}
.dv__count{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:rgba(0,0,0,.95);z-index:10;transition:opacity .5s ease;padding:0 24px 15vh;text-align:center}
.dv__count h2{color:#fff;font-size:clamp(28px,7vw,42px);font-weight:700;margin:0 0 12px;animation:dvUp .5s ease}
.dv__count p{color:rgba(255,255,255,.8);font-size:clamp(16px,4.4vw,20px);margin:0 0 36px;animation:dvUp .5s ease .2s backwards}
.dv__num{color:#14b8a6;font-size:120px;font-weight:700;line-height:1;animation:dvPulse 1s ease}
@keyframes dvPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}}
@keyframes dvUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.dv__sound{position:fixed;inset:0;background:#000;z-index:11;display:none;align-items:center;justify-content:center;padding:20px}
.dv__sound.is-on{display:flex}
.dv__sound div{text-align:center;max-width:400px;width:100%}
.dv__sound svg{width:60px;height:60px;color:#14b8a6;margin:0 auto 24px;display:block;animation:dvBreath 2s ease-in-out infinite}
@keyframes dvBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.dv__sound p{color:rgba(255,255,255,.85);font-size:17px;margin:0 0 32px;line-height:1.5}
.dv__sound button{background:#14b8a6;color:#fff;border:0;padding:14px 32px;font-size:16px;font-weight:600;border-radius:30px;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 14px rgba(20,184,166,.25);transition:transform .15s,box-shadow .2s;font-family:inherit}
.dv__sound button:active{transform:scale(.98)}
.dv__sound button svg{width:16px;height:16px;margin:0;animation:none}
.dv__bar{position:fixed;top:0;left:0;right:0;height:4px;background:rgba(255,255,255,.2);z-index:10000;display:none}
.dv__bar.is-on{display:block}
.dv__bar i{display:block;height:100%;width:0;background:#14b8a6;transition:width .25s linear}
.dv__over{position:fixed;left:0;right:0;bottom:0;min-height:200px;padding:20px 20px calc(30px + env(safe-area-inset-bottom,0px));
  background:linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.7) 40%,transparent 100%);display:none;align-items:flex-end;justify-content:center;pointer-events:none;z-index:9999}
.dv__over.is-on{display:flex}
.dv__over div{text-align:center;max-width:500px;pointer-events:auto}
.dv__spin{width:50px;height:50px;border:4px solid rgba(255,255,255,.3);border-top-color:#14b8a6;border-radius:50%;margin:0 auto 20px;animation:dvSpin 1s linear infinite}
@keyframes dvSpin{to{transform:rotate(360deg)}}
.dv__text{color:#fff;font-size:16px;font-weight:500;margin:0 0 20px}
.dv__go{display:none;background:#14b8a6;color:#fff;border:0;padding:16px 32px;font-size:16px;font-weight:600;border-radius:30px;cursor:pointer;
  box-shadow:0 4px 14px rgba(20,184,166,.3);font-family:inherit;animation:dvUp .5s ease}
.dv__go.is-on{display:inline-block}
.dv__skip{position:fixed;top:calc(14px + env(safe-area-inset-top,0px));right:14px;z-index:10001;background:rgba(0,0,0,.45);color:rgba(255,255,255,.85);
  border:1px solid rgba(255,255,255,.25);border-radius:20px;padding:6px 12px;font-size:13px;cursor:pointer;display:none;font-family:inherit}
.dv__skip.is-on{display:block}

/* Розбір від AI на екрані результату: та сама картка, що й «Чому так», у кольорах теми сторінки */
.sk__ai{margin:1.1rem 0 0;padding:1.1rem 1.15rem 1rem;border-radius:12px;
  background:color-mix(in srgb,var(--ab-fg,#F6F1E6) 6%,transparent);border:1px solid var(--ab-brd,rgba(255,255,255,.12));color:var(--ab-fg,#F6F1E6)}
.sk__ai h3{margin:0 0 .6rem;font-size:1.05rem;color:var(--ab-fg,#F6F1E6)}
.sk__ai .ai-analysis-content{font-size:.95rem;line-height:1.55;color:var(--ab-fg2,#B9B0A0)}
.sk__ai .ai-analysis-content strong{display:block;margin:.9rem 0 .25rem;font-size:1rem;color:var(--ab-fg,#F6F1E6)}
.sk__ai .ai-analysis-content strong:first-child{margin-top:0}
.sk__ai .ai-analysis-content ul{margin:.2rem 0 .4rem;padding-left:1.1rem}
.sk__ai .ai-analysis-content li{margin:.15rem 0}
.sk__ai p{margin:0;color:var(--ab-fg2,#B9B0A0);font-size:.95rem;line-height:1.55}
.sk__aiwait{display:flex;align-items:center;gap:.7rem;color:var(--ab-fg2,#B9B0A0);font-size:.95rem}
.sk__aiwait i{width:18px;height:18px;border:3px solid color-mix(in srgb,var(--ab-acc,#14b8a6) 25%,transparent);border-top-color:var(--ab-acc,#14b8a6);border-radius:50%;animation:dvSpin 1s linear infinite;flex:none}

/* Дзвінок: пояснення над кнопками */
.sk__call{margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--ab-brd,rgba(255,255,255,.12))}
.sk__call h3{margin:0 0 .35rem;font-size:1.1rem;color:var(--ab-fg,#F6F1E6)}
.sk__call p{margin:0 0 .2rem;color:var(--ab-fg2,#B9B0A0);font-size:.95rem;line-height:1.5}
.sk__call .price{font-weight:700;color:var(--ab-fg,#F6F1E6);white-space:nowrap}
.sk__call .sk__cta{margin-top:.9rem}
.sk__cta button.b1,.sk__cta button.b2{cursor:pointer;font-family:inherit;background:transparent}
.sk__cta button.b1{border:0;background:var(--ab-acc)}
/* nl2br після заголовка-блоку і подвійні переноси дають порожні рядки */
.sk__ai .ai-analysis-content strong+br,.sk__ai .ai-analysis-content br+br,.sk__ai .ai-analysis-content ul+br{display:none}