/* ===== Мини-диагностика: плашка + панель ===== */
#dg{--dgY:var(--yellow,#f6e36a);--dgO:var(--orange,#e8813a);--dgS:var(--surface,#fff);--dgI:var(--surface-ink,#1d1b19);--dgE:var(--card-edge,rgba(29,27,25,.1));--dgD:#1d1b19;--dgL:#f5f0ea;font-family:var(--f,"Onest",system-ui,sans-serif)}
#dg *{box-sizing:border-box}
#dg button{font:inherit;cursor:pointer}
.dg-teaser{position:fixed;right:22px;bottom:22px;z-index:95;opacity:0;transform:translateY(18px) scale(.96);pointer-events:none;transition:opacity .45s var(--ease,ease),transform .55s var(--ease,ease)}
#dg.show .dg-teaser{opacity:1;transform:none;pointer-events:auto}
#dg.open .dg-teaser,#dg.hid .dg-teaser{opacity:0;transform:translateY(18px) scale(.96);pointer-events:none}
.dg-tcard{position:relative;display:flex;gap:14px;align-items:center;width:300px;padding:14px 16px 14px 14px;border-radius:24px;text-decoration:none;transition:transform .3s var(--ease,ease),box-shadow .3s}
.dg-tcard:hover{transform:translateY(-3px)}
.dg-av{position:relative;flex:none;width:58px;height:66px}
.dg-av img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:16px;display:block}
.dg-on{position:absolute;right:-3px;bottom:-3px;width:14px;height:14px;border-radius:50%;background:#2cc840;border:3px solid var(--dgS);animation:dgPulse 2s ease-in-out infinite}
@keyframes dgPulse{50%{box-shadow:0 0 0 5px rgba(44,200,64,.18)}}
.dg-tx{display:grid;gap:6px;min-width:0}
.dg-live{display:inline-flex;align-items:center;gap:6px;justify-self:start;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 9px;border-radius:999px}
.dg-live i{width:6px;height:6px;border-radius:50%;background:#2cc840;animation:dgBlink 2s infinite}
@keyframes dgBlink{50%{opacity:.25}}
.dg-tx b{font-size:15px;line-height:1.25;font-weight:800;letter-spacing:-.01em}
.dg-tx em{font-style:normal;font-size:13px;font-weight:700;display:flex;align-items:center;gap:8px}
.dg-tx em span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:12px;transition:transform .25s}
.dg-tcard:hover em span{transform:translateX(3px)}
.dg-hide{position:absolute;z-index:2;top:-9px;right:-9px;width:26px;height:26px;border-radius:50%;border:0;display:grid;place-items:center;padding:0;box-shadow:0 4px 12px -4px rgba(0,0,0,.35)}
.dg-hide svg{width:11px;height:11px}
.dg-beam{display:none}

.dg-shade{position:fixed;inset:0;z-index:99;background:rgba(15,14,12,.28);opacity:0;pointer-events:none;transition:opacity .35s}
#dg.open .dg-shade{opacity:1;pointer-events:auto}
.dg-panel{position:fixed;z-index:100;right:22px;top:22px;bottom:22px;width:410px;display:flex;flex-direction:column;border-radius:30px;overflow:hidden;opacity:0;visibility:hidden;transform:translateX(24px) scale(.98);transition:opacity .3s,transform .45s var(--ease,ease),visibility 0s .45s;box-shadow:0 40px 80px -30px rgba(0,0,0,.5)}
#dg.open .dg-panel{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .45s var(--ease,ease)}
.dg-head{display:flex;align-items:center;gap:12px;padding:16px 16px 12px 18px}
.dg-head .dg-av{width:42px;height:42px}.dg-head .dg-av img{border-radius:50%}.dg-head .dg-on{width:12px;height:12px;border-width:2px;right:-1px;bottom:-1px}
.dg-ht{flex:1;display:grid;gap:2px;min-width:0}.dg-ht b{font-size:16px;font-weight:800;letter-spacing:-.01em}.dg-ht small{font-size:12.5px;opacity:.6}
.dg-x{width:38px;height:38px;border-radius:50%;border:0;display:grid;place-items:center;padding:0;transition:transform .2s}
.dg-x:hover{transform:rotate(90deg)}.dg-x svg{width:15px;height:15px}
.dg-giftpill{margin:0 18px 6px;display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;padding:9px 14px;border-radius:999px}
.dg-panel.res .dg-giftpill{display:none}
.dg-scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:12px 18px 20px;scrollbar-width:thin}
.dg-prog{display:flex;align-items:center;gap:12px;font-size:13px;margin-bottom:18px}.dg-prog span{opacity:.6;white-space:nowrap}.dg-prog b{opacity:1}
.dg-prog>i{flex:1;height:6px;border-radius:999px;overflow:hidden}.dg-prog>i>i{display:block;height:100%;border-radius:999px;transition:width .45s var(--ease,ease)}
.dg-q{margin:0 0 6px;font-size:22px;line-height:1.18;font-weight:800;letter-spacing:-.025em}
.dg-sub{margin:0 0 16px;font-size:14px;line-height:1.5;opacity:.6}
.dg-opts{display:grid;gap:8px}
.dg-opt{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:0;padding:14px 16px;border-radius:16px;font-size:15px;font-weight:600;line-height:1.3;transition:background .2s,box-shadow .2s,transform .15s}
.dg-opt:active{transform:scale(.99)}
.dg-mk{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;transition:all .2s}
.dg-mk.c{border-radius:6px}
.dg-opt.on .dg-mk::after{content:"";width:8px;height:8px;border-radius:50%}
.dg-opt.on .dg-mk.c::after{content:"✓";width:auto;height:auto;border-radius:0;background:none!important;font-size:13px;font-weight:900;line-height:1}
.dg-opt.shake{animation:dgShake .5s}
@keyframes dgShake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}0%,100%{box-shadow:inset 0 0 0 2px #e05252}}
.dg-nav{display:flex;gap:8px;margin-top:16px}.dg-nav:empty{display:none}
.dg-back{border:0;padding:14px 18px;border-radius:999px;font-weight:700;font-size:14px;background:transparent}
.dg-next,.dg-send{flex:1;border:0;padding:15px 20px;border-radius:999px;font-weight:800;font-size:15px;display:flex;justify-content:center;gap:8px;transition:transform .2s,opacity .2s}
.dg-next:hover,.dg-send:not(:disabled):hover{transform:translateY(-2px)}
.dg-send{width:100%;margin-top:12px}.dg-send:disabled{opacity:.45;cursor:default}
/* результат */
.dg-gift{display:flex;gap:12px;align-items:center;padding:14px;border-radius:20px;margin-bottom:18px}
.dg-gift i{font-style:normal;font-size:22px;width:44px;height:44px;flex:none;display:grid;place-items:center;border-radius:14px}
.dg-gift small{display:block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;opacity:.7}.dg-gift b{font-size:15px}
.dg-k{display:block;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;opacity:.55;margin-bottom:6px}
.dg-risk{margin:0 0 16px;font-size:22px;line-height:1.2;font-weight:800;letter-spacing:-.025em}
.dg-recs{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.dg-recs li{display:flex;gap:12px;padding:14px;border-radius:18px}
.dg-recs em{font-style:normal;flex:none;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-size:12px;font-weight:800}
.dg-recs b{display:block;font-size:14.5px;margin-bottom:3px}.dg-recs p{margin:0;font-size:13px;line-height:1.5;opacity:.65}
.dg-lead{margin-top:16px;padding:18px;border-radius:22px}
.dg-lead-h{display:block;font-size:18px;line-height:1.2;font-weight:800;letter-spacing:-.02em;margin-bottom:6px}
.dg-lead-p{margin:0 0 14px;font-size:13px;line-height:1.5;opacity:.65}
.dg-via{display:flex;gap:6px;margin-bottom:10px}
.dg-via label{flex:1}.dg-via input{position:absolute;opacity:0;pointer-events:none}
.dg-via span{display:block;text-align:center;font-size:13px;font-weight:700;padding:10px 6px;border-radius:999px;cursor:pointer;transition:all .2s}
.dg-in{width:100%;border:0;border-radius:999px;padding:15px 18px;font:600 16px var(--f,inherit);outline:none}
.dg-cons{display:block;margin-top:10px;font-size:11.5px;line-height:1.45;opacity:.7}.dg-cons input{vertical-align:-2px;margin:0 6px 0 0;accent-color:var(--dgO)}.dg-cons a{color:inherit}
.dg-ok{display:none;margin:12px 0 0;font-weight:700;font-size:14px}
.dg-lead.done .dg-ok{display:block}.dg-lead.done .dg-send,.dg-lead.done .dg-in,.dg-lead.done .dg-via,.dg-lead.done .dg-cons{display:none}

/* ---------- 1 · Светлая карточка ---------- */
.dgv1 .dg-tcard{background:var(--dgS);color:var(--dgI);box-shadow:0 0 0 1px var(--dgE),0 24px 50px -20px rgba(0,0,0,.35)}
.dgv1 .dg-live{background:color-mix(in srgb,var(--dgY) 55%,transparent);color:var(--dgI)}
.dgv1 .dg-tx em span{background:var(--dgY);color:#1d1b19}
.dgv1 .dg-hide{background:var(--dgI);color:var(--dgS)}
.dgv1 .dg-panel{background:color-mix(in srgb,var(--dgY) 8%,var(--dgS));color:var(--dgI)}
.dgv1 .dg-x{background:color-mix(in srgb,var(--dgI) 8%,transparent);color:var(--dgI)}
.dgv1 .dg-giftpill{background:var(--dgY);color:#1d1b19}
.dgv1 .dg-prog>i{background:color-mix(in srgb,var(--dgI) 10%,transparent)}.dgv1 .dg-prog>i>i{background:var(--dgO)}
.dgv1 .dg-opt{background:var(--dgS);color:var(--dgI);box-shadow:inset 0 0 0 1px var(--dgE)}
.dgv1 .dg-opt:hover{box-shadow:inset 0 0 0 1.5px var(--dgI)}
.dgv1 .dg-mk{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--dgI) 30%,transparent)}
.dgv1 .dg-opt.on{background:color-mix(in srgb,var(--dgY) 45%,var(--dgS));box-shadow:inset 0 0 0 1.5px var(--dgI)}
.dgv1 .dg-opt.on .dg-mk{background:var(--dgI);box-shadow:none;color:var(--dgY)}.dgv1 .dg-opt.on .dg-mk::after{background:var(--dgY)}
.dgv1 .dg-back{color:var(--dgI);box-shadow:inset 0 0 0 1px var(--dgE)}
.dgv1 .dg-next,.dgv1 .dg-send{background:var(--dgI);color:var(--dgS)}
.dgv1 .dg-next span{color:var(--dgY)}
.dgv1 .dg-gift{background:var(--dgY);color:#1d1b19}.dgv1 .dg-gift i{background:rgba(255,255,255,.55)}
.dgv1 .dg-recs li{background:var(--dgS);box-shadow:inset 0 0 0 1px var(--dgE)}.dgv1 .dg-recs em{background:var(--dgY);color:#1d1b19}
.dgv1 .dg-lead{background:var(--dgD);color:var(--dgL)}
.dgv1 .dg-lead .dg-via span{background:rgba(255,255,255,.08)}.dgv1 .dg-lead .dg-via input:checked+span{background:var(--dgY);color:#1d1b19}
.dgv1 .dg-lead .dg-in{background:#fff;color:#1d1b19}
.dgv1 .dg-lead .dg-send{background:var(--dgO);color:#1d1b19}

/* ---------- 2 · Тёмная с бегущим лучом ---------- */
.dgv2 .dg-tcard{background:var(--dgD);color:var(--dgL);box-shadow:0 24px 50px -20px rgba(0,0,0,.5);overflow:hidden}
.dgv2 .dg-beam{display:block;position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
.dgv2 .dg-beam::before{content:"";position:absolute;left:-50%;top:-120%;width:200%;height:340%;background:conic-gradient(from 0deg,transparent 0 250deg,color-mix(in srgb,var(--dgY) 30%,transparent) 290deg,var(--dgY) 345deg,transparent 360deg);animation:dgSpin 3.6s linear infinite}
.dgv2 .dg-beam::after{content:"";position:absolute;inset:1.5px;border-radius:23px;background:var(--dgD);background-image:radial-gradient(rgba(246,227,106,.09) 1px,transparent 1.3px);background-size:16px 16px}
@keyframes dgSpin{to{transform:rotate(360deg)}}
.dgv2 .dg-av,.dgv2 .dg-tx{position:relative;z-index:1}
.dgv2 .dg-on{border-color:var(--dgD)}
.dgv2 .dg-live{background:rgba(255,255,255,.08);color:rgba(245,240,234,.75)}
.dgv2 .dg-tx em{color:var(--dgY)}.dgv2 .dg-tx em span{background:var(--dgY);color:#1d1b19}
.dgv2 .dg-hide{background:var(--dgY);color:#1d1b19}
.dgv2 .dg-panel{background:var(--dgD);color:var(--dgL);background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1.3px);background-size:22px 22px}
.dgv2 .dg-head .dg-on{border-color:var(--dgD)}
.dgv2 .dg-x{background:rgba(255,255,255,.08);color:var(--dgL)}
.dgv2 .dg-giftpill{background:color-mix(in srgb,var(--dgY) 14%,transparent);color:var(--dgY);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--dgY) 35%,transparent)}
.dgv2 .dg-prog>i{background:rgba(255,255,255,.1)}.dgv2 .dg-prog>i>i{background:var(--dgY)}
.dgv2 .dg-opt{background:rgba(255,255,255,.05);color:rgba(245,240,234,.85);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.dgv2 .dg-opt:hover{background:rgba(255,255,255,.09)}
.dgv2 .dg-mk{box-shadow:inset 0 0 0 2px rgba(255,255,255,.3)}
.dgv2 .dg-opt.on{background:color-mix(in srgb,var(--dgY) 12%,transparent);color:#fff;box-shadow:inset 0 0 0 1.5px var(--dgY)}
.dgv2 .dg-opt.on .dg-mk{background:var(--dgY);box-shadow:none;color:#1d1b19}.dgv2 .dg-opt.on .dg-mk::after{background:#1d1b19}
.dgv2 .dg-back{color:rgba(245,240,234,.7);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.dgv2 .dg-next,.dgv2 .dg-send{background:var(--dgY);color:#1d1b19}
.dgv2 .dg-gift{background:color-mix(in srgb,var(--dgY) 12%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--dgY) 30%,transparent)}.dgv2 .dg-gift i{background:var(--dgY)}.dgv2 .dg-gift small{color:var(--dgY);opacity:1}
.dgv2 .dg-recs li{background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}.dgv2 .dg-recs em{background:color-mix(in srgb,var(--dgY) 15%,transparent);color:var(--dgY)}
.dgv2 .dg-lead{background:var(--dgY);color:#1d1b19}
.dgv2 .dg-lead .dg-via span{background:rgba(29,27,25,.08)}.dgv2 .dg-lead .dg-via input:checked+span{background:#1d1b19;color:var(--dgY)}
.dgv2 .dg-lead .dg-in{background:#fff;color:#1d1b19}
.dgv2 .dg-lead .dg-send{background:#1d1b19;color:var(--dgY)}

/* ---------- 3 · Чат с Михаилом ---------- */
.dgv3 .dg-tcard{width:auto;max-width:330px;padding:0;background:none;align-items:flex-end;gap:10px;flex-direction:row-reverse}
.dgv3 .dg-av{width:64px;height:64px}.dgv3 .dg-av img{border-radius:50%;box-shadow:0 0 0 3px var(--dgY),0 18px 34px -14px rgba(0,0,0,.5)}
.dgv3 .dg-on{border-color:var(--dgY)}
.dgv3 .dg-tx{background:var(--dgS);color:var(--dgI);padding:13px 15px;border-radius:22px 22px 6px 22px;box-shadow:0 0 0 1px var(--dgE),0 20px 40px -18px rgba(0,0,0,.35);margin-bottom:22px;animation:dgBubble .5s var(--ease,ease) both .2s}
@keyframes dgBubble{from{opacity:0;transform:translateY(8px) scale(.94)}}
.dgv3 .dg-live{background:none;padding:0;color:color-mix(in srgb,var(--dgI) 55%,transparent);letter-spacing:.04em;text-transform:none;font-size:12px}
.dgv3 .dg-live::after{content:" · сейчас"}
.dgv3 .dg-tx b{font-size:14.5px}
.dgv3 .dg-tx em{color:var(--dgI)}.dgv3 .dg-tx em span{background:var(--dgY);color:#1d1b19}
.dgv3 .dg-hide{top:-10px;right:auto;left:-10px;background:var(--dgI);color:var(--dgS)}
.dgv3 .dg-panel{background:color-mix(in srgb,var(--dgY) 6%,var(--bg,#f5f0ea));color:var(--dgI);background-image:linear-gradient(color-mix(in srgb,var(--dgI) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--dgI) 5%,transparent) 1px,transparent 1px);background-size:28px 28px}
.dgv3 .dg-head{background:var(--dgS);box-shadow:0 1px 0 var(--dgE)}
.dgv3 .dg-x{background:color-mix(in srgb,var(--dgI) 8%,transparent);color:var(--dgI)}
.dgv3 .dg-giftpill{display:none}
.dgv3 .dg-chat{display:flex;flex-direction:column;gap:8px}
.dgv3 .dg-msg{max-width:86%;padding:12px 15px;border-radius:20px;font-size:14.5px;line-height:1.45;opacity:0;transform:translateY(8px);transition:opacity .3s,transform .35s var(--ease,ease)}
.dgv3 .dg-msg.in{opacity:1;transform:none}
.dgv3 .dg-msg.bot{align-self:flex-start;background:var(--dgS);border-bottom-left-radius:6px;box-shadow:0 0 0 1px var(--dgE)}
.dgv3 .dg-msg.me{align-self:flex-end;background:var(--dgD);color:var(--dgL);border-bottom-right-radius:6px;font-weight:600}
.dgv3 .dg-msg.wide{max-width:100%}
.dgv3 .dg-msg b{display:block;font-size:16px;line-height:1.25;letter-spacing:-.01em}
.dgv3 .dg-msg small{display:block;margin-top:4px;font-size:13px;opacity:.6}
.dgv3 .dg-msg .dg-recs{margin-top:10px}.dgv3 .dg-msg .dg-recs li{background:color-mix(in srgb,var(--dgY) 18%,var(--dgS));padding:12px}.dgv3 .dg-recs em{background:var(--dgY);color:#1d1b19}
.dgv3 .dg-msg.form{padding:0;background:none;box-shadow:none}
.dgv3 .dg-lead{margin:0;background:var(--dgD);color:var(--dgL)}
.dgv3 .dg-lead .dg-via span{background:rgba(255,255,255,.08)}.dgv3 .dg-lead .dg-via input:checked+span{background:var(--dgY);color:#1d1b19}
.dgv3 .dg-lead .dg-in{background:#fff;color:#1d1b19}.dgv3 .dg-lead .dg-send{background:var(--dgY);color:#1d1b19}
.dgv3 .dg-msg.typing{padding:14px 16px}
.dg-dots{display:flex;gap:4px}.dg-dots i{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.35;animation:dgDot 1s infinite}.dg-dots i:nth-child(2){animation-delay:.15s}.dg-dots i:nth-child(3){animation-delay:.3s}
@keyframes dgDot{30%{opacity:1;transform:translateY(-3px)}}
.dgv3 .dg-chips{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin:4px 0 2px;animation:dgBubble .4s var(--ease,ease) both}
.dgv3 .dg-chip{border:0;padding:10px 14px;border-radius:999px;font-size:13.5px;font-weight:700;background:var(--dgS);color:var(--dgI);box-shadow:inset 0 0 0 1.5px var(--dgI);transition:all .2s}
.dgv3 .dg-chip:hover,.dgv3 .dg-chip.on{background:var(--dgY);color:#1d1b19}
.dgv3 .dg-chip.go{background:var(--dgD);color:var(--dgY);box-shadow:none}.dgv3 .dg-chip.go:disabled{opacity:.35;cursor:default}

/* ---------- телефон ---------- */
@media (max-width:600px){
  .dg-teaser{right:12px;bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  .dg-tcard{width:min(300px,calc(100vw - 24px));padding:12px 14px 12px 12px;gap:12px;border-radius:22px}
  .dg-av{width:48px;height:56px}
  .dg-tx b{font-size:14px}.dg-tx em{font-size:12.5px}
  .dgv3 .dg-tcard{width:auto;max-width:calc(100vw - 24px)}.dgv3 .dg-av{width:56px;height:56px}
  .dg-panel{left:0;right:0;top:auto;bottom:0;width:auto;height:min(92vh,760px);height:min(92dvh,760px);border-radius:28px 28px 0 0;transform:translateY(100%);padding-bottom:env(safe-area-inset-bottom,0px)}
  #dg.open .dg-panel{transform:none}
  .dg-head{padding:14px 14px 10px 16px}
  .dg-giftpill{margin:0 14px 4px}
  .dg-scroll{padding:10px 14px 18px}
  .dg-q,.dg-risk{font-size:20px}
  .dg-opt{padding:13px 14px;font-size:14.5px}
  html.dg-lock,html.dg-lock body{overflow:hidden}
}
@media (prefers-reduced-motion:reduce){.dgv2 .dg-beam::before,.dg-on,.dg-live i{animation:none}}

/* ---------- общие для новых вариантов ---------- */
.dg-sticker,.dg-bar{display:none}
.dg-key{display:none}
.dg-seg{display:none}
.dgv4 .dg-tcard,.dgv5 .dg-tcard{display:none}
.dgv4 .dg-beam,.dgv5 .dg-beam{display:none}
.dgv4 .dg-panel,.dgv5 .dg-panel{left:50%;right:auto;top:50%;bottom:auto;max-height:min(760px,calc(100vh - 48px));transform:translate(-50%,-46%) scale(.97)}
#dg.dgv4.open .dg-panel,#dg.dgv5.open .dg-panel{transform:translate(-50%,-50%)}
.dgv4 .dg-shade,.dgv5 .dg-shade{background:rgba(15,14,12,.45);backdrop-filter:blur(4px)}
.dgv4 .dg-prog>i,.dgv5 .dg-prog>i{display:none}
.dgv4 .dg-seg,.dgv5 .dg-seg{display:flex;flex:1;gap:5px}
.dg-seg i{flex:1;height:6px;border-radius:999px;transition:background .3s}

/* ---------- 2 · Стикер ---------- */
.dgv4 .dg-sticker{display:block;position:relative;width:236px;padding:26px 20px 18px;background:var(--dgY);color:#1d1b19;text-decoration:none;border-radius:6px 6px 22px 6px;transform:rotate(-4deg);box-shadow:0 2px 0 rgba(0,0,0,.06),0 26px 40px -18px rgba(0,0,0,.45);transition:transform .35s var(--ease,ease)}
.dgv4 .dg-sticker::before{content:"";position:absolute;inset:0;border-radius:inherit;background-image:radial-gradient(rgba(29,27,25,.12) 1px,transparent 1.3px);background-size:14px 14px;pointer-events:none}
.dgv4 .dg-sticker::after{content:"";position:absolute;right:0;bottom:0;width:30px;height:30px;border-radius:0 0 22px 0;background:linear-gradient(315deg,transparent 50%,rgba(0,0,0,.12) 50%)}
.dgv4 .dg-sticker:hover{transform:rotate(-1deg) translateY(-4px)}
.dg-tape{position:absolute;left:50%;top:-11px;width:84px;height:24px;margin-left:-42px;background:rgba(255,255,255,.55);transform:rotate(3deg);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.dgv4 .dg-sticker small{position:relative;display:block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;opacity:.65}
.dgv4 .dg-sticker b{position:relative;display:block;margin:8px 0 8px;font-size:22px;line-height:1.08;font-weight:900;letter-spacing:-.03em}
.dg-st-q{position:relative;display:block;font-size:13px;line-height:1.4;opacity:.75}
.dgv4 .dg-sticker em{position:relative;display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-style:normal;font-weight:800;font-size:14px;padding:9px 16px;border-radius:999px;background:#1d1b19;color:var(--dgY)}
.dgv4 .dg-hide{background:#1d1b19;color:var(--dgY);top:-6px;right:-12px}
.dgv4 .dg-panel{width:min(600px,calc(100vw - 48px));background:var(--dgY);color:#1d1b19;background-image:radial-gradient(rgba(29,27,25,.1) 1px,transparent 1.3px);background-size:18px 18px;border-radius:32px}
.dgv4 .dg-head{padding:20px 22px 8px}
.dgv4 .dg-head .dg-on{border-color:var(--dgY)}
.dgv4 .dg-x{background:#1d1b19;color:var(--dgY)}
.dgv4 .dg-giftpill{margin:0 22px 4px;background:#1d1b19;color:var(--dgY);align-self:flex-start}
.dgv4 .dg-scroll{padding:14px 22px 24px}
.dgv4 .dg-seg i{background:rgba(29,27,25,.14)}.dgv4 .dg-seg i.on{background:#1d1b19}
.dgv4 .dg-q{font-size:28px}.dgv4 .dg-sub{opacity:.7}
.dgv4 .dg-opts{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.dgv4 .dg-opt{flex-direction:column;align-items:flex-start;gap:14px;min-height:108px;padding:16px;background:#fff;color:#1d1b19;border-radius:20px;box-shadow:0 2px 0 rgba(29,27,25,.08);font-size:15px}
.dgv4 .dg-opt:hover{transform:translateY(-2px);box-shadow:0 10px 20px -10px rgba(29,27,25,.35)}
.dgv4 .dg-mk{display:none}
.dgv4 .dg-key{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;font-style:normal;font-size:13px;font-weight:900;background:var(--dgY);color:#1d1b19}
.dgv4 .dg-opt.on{background:#1d1b19;color:#fff}.dgv4 .dg-opt.on .dg-key{background:var(--dgY)}
.dgv4 .dg-opt:last-child:nth-child(odd){grid-column:1/-1;min-height:0;flex-direction:row;align-items:center}
.dgv4 .dg-back{color:#1d1b19;box-shadow:inset 0 0 0 1.5px #1d1b19}
.dgv4 .dg-next,.dgv4 .dg-send{background:#1d1b19;color:var(--dgY)}
.dgv4 .dg-gift{background:#1d1b19;color:#fff}.dgv4 .dg-gift i{background:var(--dgY)}.dgv4 .dg-gift small{color:var(--dgY);opacity:1}
.dgv4 .dg-risk{font-size:28px}
.dgv4 .dg-recs{grid-template-columns:repeat(2,minmax(0,1fr))}
.dgv4 .dg-recs li{flex-direction:column;gap:10px;background:#fff;border-radius:20px}.dgv4 .dg-recs em{background:var(--dgY);color:#1d1b19}
.dgv4 .dg-lead{background:#1d1b19;color:#f5f0ea}
.dgv4 .dg-lead .dg-via span{background:rgba(255,255,255,.08)}.dgv4 .dg-lead .dg-via input:checked+span{background:var(--dgY);color:#1d1b19}
.dgv4 .dg-lead .dg-in{background:#fff;color:#1d1b19}.dgv4 .dg-lead .dg-send{background:var(--dgY);color:#1d1b19}

/* ---------- 3 · Полоска снизу + тёмное окно по центру ---------- */
.dgv5 .dg-teaser{right:auto;left:calc(50% - min(350px,50vw - 16px));width:min(700px,calc(100vw - 32px))}
.dgv5 .dg-bar{display:flex;align-items:center;gap:14px;padding:10px 10px 10px 12px;border-radius:999px;background:var(--dgD);color:#f5f0ea;text-decoration:none;box-shadow:0 26px 50px -20px rgba(0,0,0,.6);transition:transform .3s var(--ease,ease)}
.dgv5 .dg-bar em{transition:transform .25s var(--ease,ease),box-shadow .25s var(--ease,ease)}.dgv5 .dg-bar em:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(0,0,0,.45)}
.dg-av.xs{width:46px;height:46px}.dg-av.xs img{border-radius:50%}.dgv5 .dg-av.xs .dg-on{width:13px;height:13px;border-width:2px;border-color:var(--dgD);right:-1px;bottom:-1px}
.dg-bar-t{flex:1;display:grid;gap:2px;min-width:0}.dg-bar-t b{font-size:15px;font-weight:800;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dg-bar-t small{font-size:12.5px;opacity:.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dgv5 .dg-bar em{flex:none;font-style:normal;font-weight:800;font-size:14px;padding:13px 20px;border-radius:999px;background:var(--dgY);color:#1d1b19;display:flex;gap:8px}
.dgv5 .dg-hide{top:-10px;right:-6px;background:var(--dgY);color:#1d1b19}
.dgv5 .dg-panel{width:min(680px,calc(100vw - 48px));background:var(--dgD);color:#f5f0ea;border-radius:32px;background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1.3px);background-size:22px 22px}
.dgv5 .dg-head{padding:22px 26px 6px}.dgv5 .dg-head .dg-on{border-color:var(--dgD)}
.dgv5 .dg-x{background:rgba(255,255,255,.08);color:#f5f0ea}
.dgv5 .dg-giftpill{margin:0 26px 4px;align-self:flex-start;background:none;padding:0;color:var(--dgY)}
.dgv5 .dg-scroll{padding:16px 26px 28px}
.dgv5 .dg-seg i{background:rgba(255,255,255,.12)}.dgv5 .dg-seg i.on{background:var(--dgY)}
.dgv5 .dg-q{font-size:32px;line-height:1.1}
.dgv5 .dg-opts{gap:6px}
.dgv5 .dg-opt{background:transparent;color:rgba(245,240,234,.88);padding:14px 16px;border-radius:16px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);font-size:16px}
.dgv5 .dg-opt:hover{background:rgba(255,255,255,.06)}
.dgv5 .dg-mk{display:none}
.dgv5 .dg-key{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:8px;font-style:normal;font-size:13px;font-weight:800;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.25);color:rgba(245,240,234,.7)}
.dgv5 .dg-opt.on{background:var(--dgY);color:#1d1b19;box-shadow:none}.dgv5 .dg-opt.on .dg-key{background:#1d1b19;color:var(--dgY);box-shadow:none}
.dgv5 .dg-nav::after{content:"Можно отвечать цифрами на клавиатуре";align-self:center;margin-left:auto;font-size:12px;opacity:.4}
.dgv5 .dg-back{color:rgba(245,240,234,.7);box-shadow:inset 0 0 0 1px rgba(255,255,255,.15)}
.dgv5 .dg-next{flex:0 0 auto;background:var(--dgY);color:#1d1b19}
.dgv5 .dg-gift{background:color-mix(in srgb,var(--dgY) 12%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--dgY) 30%,transparent)}.dgv5 .dg-gift i{background:var(--dgY)}.dgv5 .dg-gift small{color:var(--dgY);opacity:1}
.dgv5 .dg-risk{font-size:32px;line-height:1.1}
.dgv5 .dg-recs{grid-template-columns:repeat(2,minmax(0,1fr))}
.dgv5 .dg-recs li{flex-direction:column;gap:10px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.dgv5 .dg-recs em{background:var(--dgY);color:#1d1b19}
.dgv5 .dg-lead{background:var(--dgY);color:#1d1b19}
.dgv5 .dg-lead .dg-via span{background:rgba(29,27,25,.08)}.dgv5 .dg-lead .dg-via input:checked+span{background:#1d1b19;color:var(--dgY)}
.dgv5 .dg-lead .dg-in{background:#fff;color:#1d1b19}.dgv5 .dg-lead .dg-send{background:#1d1b19;color:var(--dgY)}

@media (max-width:600px){
  .dgv4 .dg-panel,.dgv5 .dg-panel{left:0;right:0;top:auto;bottom:0;width:auto;max-height:none;height:min(92vh,760px);height:min(92dvh,760px);border-radius:28px 28px 0 0;transform:translateY(100%)}
  #dg.dgv4.open .dg-panel,#dg.dgv5.open .dg-panel{transform:none}
  .dgv4 .dg-sticker{width:200px;padding:22px 16px 14px}.dgv4 .dg-sticker b{font-size:19px}
  .dgv4 .dg-q,.dgv4 .dg-risk,.dgv5 .dg-q,.dgv5 .dg-risk{font-size:23px}
  .dgv4 .dg-head,.dgv5 .dg-head{padding:16px 16px 6px}.dgv4 .dg-giftpill,.dgv5 .dg-giftpill{margin:0 16px 4px}.dgv4 .dg-scroll,.dgv5 .dg-scroll{padding:12px 16px 20px}
  .dgv4 .dg-opt{min-height:92px;font-size:14px;padding:13px}
  .dgv4 .dg-recs,.dgv5 .dg-recs{grid-template-columns:minmax(0,1fr)}
  .dgv5 .dg-teaser{left:8px;width:calc(100vw - 16px)}
  .dgv5 .dg-bar{gap:10px;padding:8px 8px 8px 8px}.dgv5 .dg-av.xs{width:40px;height:40px}
  .dgv5 .dg-bar-t b{font-size:13.5px;white-space:normal;line-height:1.2}.dgv5 .dg-bar-t small{display:none}
  .dgv5 .dg-bar em{padding:11px 14px;font-size:13px}.dgv5 .dg-bar em{font-size:0}.dgv5 .dg-bar em span{font-size:16px}
  .dgv5 .dg-nav::after{display:none}
}
/* окно не обрезает последний блок: прокручивается только середина */
.dg-head,.dg-giftpill{flex:none}
.dg-scroll{min-height:0;flex:1 1 auto}
.dgv4 .dg-panel,.dgv5 .dg-panel{max-height:min(760px,calc(var(--vh,1vh)*100 - 48px))}
.dg-lead{margin-bottom:4px}
/* полоска крупнее */
.dgv5 .dg-teaser{left:calc(50% - min(410px,50vw - 16px));width:min(820px,calc(100vw - 32px))}
.dgv5 .dg-bar{gap:18px;padding:12px 12px 12px 14px}
.dgv5 .dg-av.xs{width:58px;height:58px}.dgv5 .dg-av.xs .dg-on{width:15px;height:15px}
.dgv5 .dg-bar-t b{font-size:18px}.dgv5 .dg-bar-t small{font-size:13.5px}
.dgv5 .dg-bar em{font-size:16px;padding:17px 26px}
@media (max-width:600px){
  .dgv5 .dg-teaser{left:8px;width:calc(100vw - 16px)}
  .dgv5 .dg-bar{flex-wrap:wrap;border-radius:26px;padding:12px;gap:10px 12px}
  .dgv5 .dg-av.xs{width:48px;height:48px}
  .dgv5 .dg-bar-t{flex:1 1 0}.dgv5 .dg-bar-t b{font-size:15px;white-space:normal;line-height:1.25}
  .dgv5 .dg-bar em{flex:1 1 100%;justify-content:center;font-size:15px;padding:14px 18px}.dgv5 .dg-bar em span{font-size:inherit}
}
/* ПК: полоска чуть компактнее */
@media (min-width:601px){
  .dgv5 .dg-teaser{left:calc(50% - min(380px,50vw - 16px));width:min(760px,calc(100vw - 32px))}
  .dgv5 .dg-bar{gap:14px;padding:10px 10px 10px 12px}
  .dgv5 .dg-av.xs{width:50px;height:50px}.dgv5 .dg-av.xs .dg-on{width:13px;height:13px}
  .dgv5 .dg-bar-t b{font-size:16px}.dgv5 .dg-bar-t small{font-size:12.5px}
  .dgv5 .dg-bar em{font-size:14.5px;padding:14px 22px}
}
/* тексты полоски: полный на ПК, короткий на телефоне */
.dg-bar .dg-m{display:none}
#dg button,.dg-via span{white-space:nowrap}
@media (max-width:600px){
  .dg-bar .dg-d{display:none}.dg-bar .dg-m{display:inline}
  /* компактная полоска в одну строку */
  .dgv5 .dg-teaser{left:8px;width:calc(100vw - 16px)}
  .dgv5 .dg-bar{flex-wrap:nowrap;border-radius:999px;padding:7px 7px 7px 8px;gap:10px}
  .dgv5 .dg-av.xs{width:42px;height:42px}.dgv5 .dg-av.xs .dg-on{width:12px;height:12px}
  .dgv5 .dg-bar-t{flex:1 1 auto}
  .dgv5 .dg-bar-t b{font-size:14px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dgv5 .dg-bar-t small{display:block;font-size:11.5px;opacity:.65;white-space:nowrap}
  .dgv5 .dg-bar em{flex:none;font-size:14px;padding:12px 16px;gap:6px}
  .dgv5 .dg-hide{top:-8px;right:-2px;width:24px;height:24px}
  /* кнопки внизу шага — всегда в одну строку */
  .dg-nav{gap:8px}
  .dg-back{flex:none;padding:13px 14px;font-size:13.5px}
  .dg-next{flex:1 1 auto;padding:13px 14px;font-size:14px}
  .dgv5 .dg-next{flex:1 1 auto}
  .dg-via span{font-size:12.5px;padding:10px 4px}
  .dg-send{font-size:14.5px;padding:14px 12px}
}
@media (max-width:370px){.dgv5 .dg-bar-t b{font-size:13px}.dgv5 .dg-bar-t small{font-size:10.5px}.dgv5 .dg-bar em{padding:11px 13px;font-size:13px}.dg-back{padding:13px 11px}}
@media (max-width:600px){
  .dgv5 .dg-bar{border-radius:24px;padding:8px 8px 8px 9px}
  .dgv5 .dg-bar-t{min-width:0}
  .dgv5 .dg-bar-t b{white-space:normal;overflow:visible;font-size:13.5px;line-height:1.18}
  .dgv5 .dg-bar-t small{margin-top:2px;overflow:visible}
  .dgv5 .dg-bar em{padding:12px 14px}
}
@media (max-width:370px){.dgv5 .dg-bar-t b{font-size:12.8px}.dgv5 .dg-av.xs{width:36px;height:36px}}
/* варианты ответов переносятся, а не уезжают за экран */
#dg .dg-opt,#dg .dg-chip{white-space:normal;min-width:0;max-width:100%}
#dg .dg-opt span{min-width:0;overflow-wrap:anywhere}
.dg-opts{min-width:0}