/* ═════ v1.19.1015 (задача 13, релиз 13а) — баннер «התקן אפליקציה» на витрине (превью, экран 17).
   Только телефон, первый заход; нижняя панель-лист не выше ¼ экрана над нижним меню
   сайта и над полоской согласия (меню сайта остаётся видимым и нажимаемым).
   Место снизу — переменная --vab-b (её ставит app-banner.js по меню и полоске).
   v1.19.1017 (13в): ролик — обложка-кнопка в баннере (.vab-tv), по нажатию окно .vab-ov с роликом. ═════ */
.vab{position:fixed;left:8px;right:8px;bottom:var(--vab-b,96px);z-index:95;max-height:25vh;max-height:25dvh;display:flex;flex-direction:column;font-family:inherit;direction:inherit}
.vab-sheet{background:#fff;color:#1b2238;border-radius:24px;padding:10px 12px 10px;box-shadow:0 -10px 34px -12px rgba(20,24,60,.5);overflow:hidden;min-height:0}
.vab-1{display:flex;align-items:center;gap:10px}
.vab-ic{width:48px;height:48px;border-radius:13px;flex:none;display:block;box-shadow:0 6px 14px -8px rgba(58,63,159,.7)}
.vab-rt{flex:1;display:flex;flex-direction:column;min-width:0;line-height:1.25}
.vab-rt b{font-size:16px;font-weight:800}
.vab-rt small{font-size:13px;color:#59647a}
.vab-x{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#eef1fb;color:#1b2238;flex:none;border:0;cursor:pointer;padding:0}
.vab-x svg,.vab-inst svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.vab-2{display:flex;gap:10px;align-items:stretch;margin-top:8px}
.vab-th{position:relative;width:72px;height:84px;flex:none;border-radius:14px;overflow:hidden;background:linear-gradient(160deg,#6e74e0,#3a3f9f)}
.vab-ma{position:absolute;top:8px;bottom:8px;left:10px;right:10px;border-radius:9px;background:#f5f6fb;display:flex;flex-direction:column;gap:4px;padding:0 0 5px;overflow:hidden}
.vab-mh{height:34%;background:linear-gradient(155deg,#6e74e0,#3a3f9f)}
.vab-mc{height:16%;margin:0 5px;border-radius:5px;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.vab-mc.s{height:12%}
.vab-mb{margin-top:auto;height:9%;background:#fff;border-top:1px solid #e3e7f1}
.vab-ib{flex:1;display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0}
.vab-inst{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:999px;background:linear-gradient(135deg,#5960db,#3a3f9f);color:#fff;font-weight:800;font-size:15px;text-decoration:none;position:relative;overflow:hidden}
.vab-done{min-height:44px;border:0;background:none;color:#3a3f9f;font:inherit;font-weight:700;font-size:14px;cursor:pointer;padding:0 8px}
.vab-ib b{font-size:16px;font-weight:800}
.vab-ib small{font-size:13px;color:#475569;line-height:1.35}
.vab-on{animation:vabup .55s cubic-bezier(.34,1.25,.64,1) .2s both}
.vab-off{animation:vabdown .3s ease-in both}
@keyframes vabup{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}}
@keyframes vabdown{to{transform:translateY(30px);opacity:0}}
.vab-inst svg{animation:vabbob 5s ease-in-out 1.5s infinite}
@keyframes vabbob{0%,18%,100%{transform:none}6%{transform:translateY(3px)}12%{transform:translateY(-1px)}}
@media (prefers-reduced-motion:reduce){.vab-on,.vab-off,.vab-inst svg{animation:none}}
html.a11y-anim .vab-on,html.a11y-anim .vab-off,html.a11y-anim .vab-inst svg{animation:none}
.vab-x:focus-visible,.vab-inst:focus-visible,.vab-done:focus-visible{outline:3px solid #22b8ef;outline-offset:2px}
@media (hover:hover){.vab-inst:hover{filter:brightness(1.06)}}
/* постоянная ссылка в подвале витрины */
footer .vc-applink{display:inline-block;margin-top:10px;color:#c9cef0;font-weight:700;text-decoration:underline;text-underline-offset:3px;min-height:24px}
/* низкий экран (ревью 13а, п. 3): без обложки, кнопки в один ряд — всё видно в пределах ¼ экрана */
@media (max-height:700px){
.vab-sheet{padding:8px 10px}
.vab-ic{width:40px;height:40px;border-radius:11px}
.vab-x{width:44px;height:44px}
.vab-rt b{font-size:15px}
.vab-2{margin-top:6px}
.vab-th{display:none}
.vab-ib.btn{flex-direction:row;align-items:center;gap:6px}
.vab-ib .vab-inst{flex:1;min-height:44px;font-size:14px}
.vab-ib .vab-done{flex:none}
}

/* ═════ v1.19.1017 (задача 13, релиз 13в) — ролик баннера. Обложка — кнопка с кадром ролика, значком
   воспроизведения и длительностью; окно — весь экран, ролик по центру (с v1.19.1021 — со звуками приложения), кнопки пауза, звук и закрыть
   (зона 48 px). «Меньше движения» — ролик не идёт сам: обложка и большая кнопка воспроизведения. ═════ */
.vab-tv{padding:0;border:0;cursor:pointer;display:block;background:#1b2238;color:#fff;font:inherit}
.vab-tv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;display:block}
.vab-pl{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(180deg,rgba(20,24,60,0) 30%,rgba(20,24,60,.45))}
.vab-pl svg{width:30px;height:30px;fill:#fff;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.vab-du{position:absolute;bottom:4px;right:6px;font-size:11px;font-weight:700;line-height:1.3;color:#fff;background:rgba(0,0,0,.55);padding:0 5px;border-radius:6px}
.vab-tv:focus-visible{outline:3px solid #22b8ef;outline-offset:2px}
.vab-ov{position:fixed;inset:0;z-index:130;background:#0b0e22;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));animation:vabfade .25s ease-out both}
.vab-vf{position:relative;flex:1 1 auto;min-height:0;width:100%;display:flex;align-items:center;justify-content:center}
.vab-v{display:block;max-width:100%;max-height:100%;width:auto;height:100%;aspect-ratio:720/1558;border-radius:18px;background:#1b2238;object-fit:contain}
.vab-big{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;border:0;background:rgba(58,63,159,.88);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.vab-big svg{width:34px;height:34px;fill:#fff}
.vab-ov-on .vab-big{display:none}
.vab-vc{flex:none;display:flex;gap:16px}
.vab-pp,.vab-mu,.vab-vx{width:48px;height:48px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
.vab-pp svg{width:22px;height:22px;fill:#fff}
.vab-vx svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round}
.vab-pp:focus-visible,.vab-mu:focus-visible,.vab-vx:focus-visible,.vab-big:focus-visible{outline:3px solid #22b8ef;outline-offset:2px}
@keyframes vabfade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.vab-ov{animation:none}}
html.a11y-anim .vab-ov{animation:none}
.vab-mu svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.vab-mu svg .f{fill:#fff;stroke:none}
@media (hover:hover){.vab-pp:hover,.vab-mu:hover,.vab-vx:hover{background:rgba(255,255,255,.24)}}
/* низкий экран: без обложки (как в 13а; правило .vab-tv выше иначе вернуло бы её) */
@media (max-height:700px){.vab-th.vab-tv{display:none}}