/* Живой разговор с агентом сайт в блоке «Поговорите с Алиной» (27.10): окно контактов / «Позвоните мне» —
   поверх блока, после её прощания (как на сайт, sayt_agent/klient/vstroit_pokaz.py). Разметку ставит
   assets/razgovor.js; цвета — токены блока (--r-pleer, --r-pleer-t). */
#pleer .pz-blank{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;padding:1.25rem;
  background:color-mix(in srgb,var(--r-pleer) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
#pleer .pz-blank[hidden]{display:none}
#pleer .pz-nw{white-space:nowrap}
#pleer .pz-blank__karta{width:min(26rem,100%);display:flex;flex-direction:column;gap:.8rem;text-align:center;animation:pzVverh .55s cubic-bezier(.2,.8,.2,1)}
@keyframes pzVverh{from{transform:translateY(16px)}to{transform:none}}
#pleer .pz-blank__x{position:absolute;right:clamp(1rem,3vw,2.6rem);top:clamp(1rem,3vw,2.2rem);border:0;background:none;color:color-mix(in srgb,var(--r-pleer-t) 55%,transparent);font-size:1.75rem;line-height:1;cursor:pointer;padding:.5rem}
#pleer .pz-blank__x:hover{color:var(--r-pleer-t)}
#pleer .pz-blank__zag{margin:.2rem 0 0;font-family:var(--r-zag);font-stretch:38%;font-weight:640;letter-spacing:-.008em;line-height:.9;
  font-size:clamp(2rem,3.2vw,2.75rem);color:var(--r-pleer-t);text-wrap:balance;width:min(36rem,100vw - 2.5rem);align-self:center}
#pleer .pz-blank__lid{margin:0 0 .3rem;font-size:1rem;line-height:1.3;color:color-mix(in srgb,var(--r-pleer-t) 72%,transparent)}
#pleer .pz-forma{display:flex;flex-direction:column;gap:.55rem;margin:0}
#pleer .pz-forma[hidden],#pleer .pz-spasibo[hidden]{display:none}
#pleer .pz-gotovo .pz-blank__zag,#pleer .pz-gotovo .pz-blank__lid{display:none}   /* после отправки — только «спасибо» */
#pleer .pz-pole{display:flex;flex-direction:column;align-items:stretch;gap:.3rem;text-align:left}
#pleer .pz-pole input{width:100%;padding:.95rem 1.1rem;border:1px solid color-mix(in srgb,var(--r-pleer-t) 16%,transparent);border-radius:1rem;
  background:color-mix(in srgb,var(--r-pleer-t) 7%,transparent);color:var(--r-pleer-t);font:400 1rem/1.2 inherit;outline:none;transition:border-color .2s,background .2s}
#pleer .pz-pole input::placeholder{color:color-mix(in srgb,var(--r-pleer-t) 42%,transparent)}
#pleer .pz-pole input:focus{border-color:color-mix(in srgb,var(--r-pleer-t) 60%,transparent);background:color-mix(in srgb,var(--r-pleer-t) 10%,transparent)}
#pleer .pz-pole--osh input{border-color:var(--s1)}
#pleer .pz-osh{min-height:0;font-size:.8rem;line-height:1.3;color:var(--s1);padding-left:.3rem}
#pleer .pz-osh:empty{display:none}
#pleer .pz-lov{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
#pleer .pz-kn{margin-top:.3rem;border:0;cursor:pointer;height:3.25rem;padding:0 1.2rem;border-radius:100vw;background:var(--r-pleer-t);color:#2b2119;
  font:500 1.08rem/1 "Roboto Flex",Geist,sans-serif;font-stretch:88%;transition:transform .25s var(--krivaya),background .3s}
@media (hover:hover){#pleer .pz-kn:hover{background:#fff}}
#pleer .pz-kn:active{transform:scale(.98)}
#pleer .pz-kn[disabled]{opacity:.65;cursor:default;transform:none}
#pleer .pz-sogl{margin:.1rem 0 0;font-size:.75rem;line-height:1.35;color:color-mix(in srgb,var(--r-pleer-t) 45%,transparent)}
#pleer .pz-spasibo p{margin:0;color:color-mix(in srgb,var(--r-pleer-t) 72%,transparent)}
#pleer .pz-spasibo__zag{font-family:var(--r-zag);font-stretch:38%;font-weight:640;font-size:2.6rem;line-height:1;color:var(--r-pleer-t)!important;margin-bottom:.4rem!important}

/* 27.10 (заказчик): блок — как на сайт: кнопка — тонкое кольцо с живой волной без заливки, в разговоре на нём
   «стоп», вокруг — круговая волна в такт голосу (рисует razgovor.js на .kn-krug); цветные круги сцены не показываем;
   под кнопкой — живой текст. Дуги по бокам — украшение (sceny.js). */
#pleer .pleer2__holst{visibility:hidden}
#pleer .pleer2__sub{display:none}
#pleer .pleer2__kn,#pleer .pleer2__kn:hover,#pleer .pleer2__kn.igraet,#pleer .pleer2__kn.igraet:hover,#pleer .pleer2__kn:active{width:4.75rem;height:4.75rem;
  background:transparent!important;color:var(--r-pleer-t)!important;transform:none!important;
  box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--r-pleer-t) 62%,transparent)!important;transition:box-shadow .3s ease}
@media (hover:hover){#pleer .pleer2__kn:hover,#pleer .pleer2__kn.igraet:hover{box-shadow:inset 0 0 0 1.5px var(--r-pleer-t),0 0 0 8px color-mix(in srgb,var(--r-pleer-t) 7%,transparent)!important}}
#pleer .pleer2__kn:focus-visible{outline:1.5px solid var(--r-pleer-t);outline-offset:6px}
#pleer .kn-krug{position:absolute;left:50%;top:50%;width:11.5rem;height:11.5rem;margin:-5.75rem 0 0 -5.75rem;pointer-events:none}
#pleer .kn-vol{display:flex;align-items:center;gap:3px;width:auto!important;height:1.45rem}
#pleer .pleer2__kn.pauza .kn-vol{display:none}
#pleer .kn-vol i{display:block;width:2px;height:100%;border-radius:2px;background:currentColor;transform:scaleY(.22);animation:knStolb 1.7s ease-in-out infinite}
#pleer .kn-vol i:nth-child(1){--v:.42;animation-delay:-.9s}
#pleer .kn-vol i:nth-child(2){--v:.78;animation-delay:-.45s}
#pleer .kn-vol i:nth-child(3){--v:1;animation-delay:0s}
#pleer .kn-vol i:nth-child(4){--v:.7;animation-delay:-.6s}
#pleer .kn-vol i:nth-child(5){--v:.38;animation-delay:-1.2s}
@media (hover:hover){#pleer .pleer2__kn:hover .kn-vol i{animation-duration:.9s}}
@keyframes knStolb{0%,100%{transform:scaleY(.22)}50%{transform:scaleY(var(--v,.8))}}
@media (prefers-reduced-motion:reduce){#pleer .kn-vol i{animation:none;transform:scaleY(var(--v,.8))}}
#pleer .pz{position:absolute;left:50%;top:calc(50% + 3.6rem);z-index:4;width:min(30rem,62%);transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:.45rem;text-align:center;pointer-events:none;overflow:hidden;transition:transform .45s var(--krivaya)}
#pleer.pz-idet .pz{transform:translate(-50%,1.4rem)}            /* во время разговора текст — ниже круговой волны */
#pleer .pz p{margin:0}
#pleer:not(.pz-idet) .pz-sost:empty::before{content:'Нажмите и говорите'}
#pleer .pz-sost{min-height:1em;font:500 .78rem/1 "Roboto Flex",Geist,sans-serif;font-stretch:88%;letter-spacing:.12em;text-transform:uppercase;
  color:color-mix(in srgb,var(--r-pleer-t) 55%,transparent)}
#pleer .pz-titr{font-size:clamp(1rem,1.35vw,1.15rem);line-height:1.3;color:var(--r-pleer-t);text-wrap:pretty;flex:0 1 auto;min-height:0;overflow:hidden}
#pleer .pz-titr.pz-sverhu{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 1.6em);mask-image:linear-gradient(to bottom,transparent 0,#000 1.6em)}
#pleer .pz-titr.pz-snizu{-webkit-mask-image:linear-gradient(to top,transparent 0,#000 1.6em);mask-image:linear-gradient(to top,transparent 0,#000 1.6em)}
#pleer .pz-titr.pz-sverhu.pz-snizu{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 1.6em,#000 calc(100% - 1.6em),transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 1.6em,#000 calc(100% - 1.6em),transparent 100%)}
#pleer .pz-sost,#pleer .pz-ty,#pleer .pz-rol,#pleer .pz-v-brauzere{flex:none}
#pleer .pz-ty{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:.9rem;line-height:1.3;color:color-mix(in srgb,var(--r-pleer-t) 50%,transparent)}
#pleer .pz-rol{font-size:.95rem;line-height:1.3;color:color-mix(in srgb,var(--r-pleer-t) 62%,transparent);transition:opacity .3s}
#pleer .pz-v-brauzere{font-size:.78rem;white-space:nowrap;color:color-mix(in srgb,var(--r-pleer-t) 45%,transparent);transition:opacity .3s}
#pleer.pz-idet .pz-rol,#pleer.pz-idet .pz-v-brauzere{opacity:0}
@media (max-width:700px){#pleer .pz{width:min(17rem,58%)}#pleer .pz-titr{font-size:.95rem}#pleer .pz-rol{font-size:.85rem}#pleer .pz-ty{font-size:.82rem}}
@media (max-width:560px){#pleer.pz-idet .duga{opacity:.16}#pleer .duga{transition:opacity .45s}#pleer.pz-idet .pz{width:min(22rem,86%)}}
/* телефон: в разговоре кнопка с дугами выше — место её фразам (сверху блока пусто, внизу — «Позвоните мне») */
@media (max-width:560px){#pleer .pleer2__scena{transition:translate .5s var(--krivaya);translate:0 -4rem}#pleer.pz-idet .pleer2__scena{translate:0 -11rem}}