.p-help-button { position:fixed; right:16px; bottom:80px; z-index:100; display:flex; width:104px; height:48px; align-items:center; gap:10px; padding:6px 14px 6px 8px; border:1px solid rgba(255,255,255,.14); border-radius:26px; background:#182230; color:#fff; box-shadow:0 14px 32px rgba(12,22,36,.20), inset 0 1px 0 rgba(255,255,255,.12); cursor:pointer; transition:background .4s cubic-bezier(.22,1,.36,1), box-shadow .4s cubic-bezier(.22,1,.36,1), transform .4s cubic-bezier(.22,1,.36,1); }

.p-help-button::before { position:absolute; top:6px; left:6px; width:10px; height:10px; border-radius:50%; background:#FE8130; box-shadow:0 0 0 4px rgba(254,129,48,.16); animation:p-help-dot 1.8s cubic-bezier(.45,0,.55,1) infinite; content:""; }
.p-help-button__icon { display:flex; width:34px; height:34px; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.22); border-radius:50%; background:#fff; color:#182230; font-size:18px; font-weight:700; line-height:1; }
.p-help-button__label { padding-top:1px; font-size:12px; font-weight:700; letter-spacing:.14em; }
.p-help-button:hover { background:#243449; box-shadow:0 18px 38px rgba(12,22,36,.28), inset 0 1px 0 rgba(255,255,255,.16); transform:translateX(-4px); }
.p-help-button:active { transform:translateX(-2px) scale(.98); }
.p-help-button:focus-visible { outline:3px solid rgba(116,213,176,.58); outline-offset:4px; }

.p-help-chat { position:fixed; right:16px; bottom:140px; z-index:100; display:flex; width:450px; height:min(600px, calc(100dvh - 180px)); max-width:calc(100vw - 32px); flex-direction:column; justify-content:flex-start; padding:0; border-radius:20px; background:#fff; box-shadow:0 22px 60px rgba(12,22,36,.22); transform-origin:bottom right; animation:p-help-chat-in .35s cubic-bezier(.22,1,.36,1); }
.p-help-chat[hidden] { display:none; }
.p-help-chat__close { position:absolute; top:-42px; right:0; display:flex; width:32px; height:32px; align-items:center; justify-content:center; border:1px solid rgba(24,34,48,.18); border-radius:50%; background:#182230; color:#fff; font-size:22px; line-height:1; cursor:pointer; transition:background .3s cubic-bezier(.22,1,.36,1), transform .3s cubic-bezier(.22,1,.36,1); }
.p-help-chat__close:hover { background:#243449; transform:rotate(90deg); }

.p-help-chat__status { display:flex; min-height:100px; align-items:center; justify-content:space-between; gap:18px; padding:0 22px; border-radius:19px 19px 0 0; background:#17212f; color:#fff; }
.p-help-chat__state { display:flex; min-width:0; flex-direction:column; gap:7px; }
.p-help-chat__state-label { font-size:10px; white-space:nowrap; }
.p-help-chat__state strong { font-size:18px; white-space:nowrap; }

.jw-helper-face { display:flex; align-items:center; justify-content:center; gap:30px; width:130px; height:70px; flex:none; border-radius:22px; }
.jw-helper-face i { --eye-height:24px; display:block; width:24px; height:var(--eye-height); border-radius:7px; background:#55f5e8; box-shadow:0 0 8px #55f5e8, 0 0 18px rgba(85,245,232,.45); animation:p-help-blink 4s cubic-bezier(.45,0,.55,1) infinite; transition:transform .3s cubic-bezier(.22,1,.36,1), border-radius .3s cubic-bezier(.22,1,.36,1); }
.jw-helper-face i:last-child { transform:scale(1); }
.p-help-chat__close:hover ~ .p-help-chat__status .jw-helper-face i:first-child { transform:translate(16px,-4px); }
.p-help-chat__close:hover ~ .p-help-chat__status .jw-helper-face i:last-child { transform:translate(8px,-7px) scale(1.2); }

.p-help-chat__body { min-height:112px; flex:1; overflow-y:auto; padding:18px 20px; background:#f7f8fa; }
.p-help-chat__message { width:max-content; max-width:90%; margin-bottom:10px; padding:11px 13px; border-radius:4px 14px 14px 14px; background:#fff; color:#26313f; font-size:13px; line-height:1.55; box-shadow:0 4px 14px rgba(24,34,48,.06); white-space:pre-wrap; }
.p-help-chat__message--user { margin-left:auto; border-radius:14px 4px 14px 14px; background:#172230; color:#fff; }
.p-help-chat__message--loading { color:#697586; }
.p-help-chat__message--error { background:#fff1f0; color:#b42318; }
.p-help-chat__form { display:flex; align-items:center; gap:8px; padding:12px; border-top:1px solid #edf0f3; background:#fff; }
.p-help-chat__label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.p-help-chat__voice { display:flex; width:38px; height:38px; align-items:center; justify-content:center; flex:none; border:1px solid #e1e5ea; border-radius:10px; background:#fff; color:#172230; cursor:not-allowed; opacity:.55; }
.p-help-chat__voice .material-symbols-outlined { font-size:20px; }
.p-help-chat__form input { min-width:0; flex:1; height:38px; padding:0 12px; border:1px solid #e1e5ea; border-radius:10px; background:#fafbfc; color:#26313f; font:inherit; font-size:12px; outline:0; }
.p-help-chat__form input:disabled { cursor:not-allowed; opacity:.7; }
.p-help-chat__send { height:38px; padding:0 13px; border:0; border-radius:10px; background:#172230; color:#fff; font-size:12px; font-weight:700; cursor:pointer; }
.p-help-chat__send:disabled { cursor:not-allowed; opacity:.5; }

@keyframes p-help-chat-in {
	from { opacity:0; transform:translateY(10px) scale(.96); }
	to { opacity:1; transform:translateY(0) scale(1); }
}

@keyframes p-help-blink {
	0%, 47%, 53%, 100% { height:var(--eye-height); }
	49%, 51% { height:1px; }
}

@media (max-width:768px) {
	.p-help-button { width:92px; height:44px; gap:8px; padding-right:11px; }
	.p-help-button__icon { width:30px; height:30px; font-size:16px; }
	.p-help-button__label { font-size:11px; }
	.p-help-chat { right:16px; bottom:136px; height:min(600px, calc(100dvh - 160px)); }
	.p-help-chat__status { min-height:76px; gap:10px; padding:12px 16px; }
	.p-help-chat__state { gap:4px; }
	.p-help-chat__state-label { font-size:8px; }
	.p-help-chat__state strong { font-size:13px; }
	.jw-helper-face { width:118px; height:64px; gap:24px; }
	.jw-helper-face i { --eye-height:21px; width:21px; height:var(--eye-height); border-radius:6px; }
}

@media (prefers-reduced-motion:reduce) {
	.p-help-button { transition:none; }
	.p-help-button::before { animation:none; }
	.p-help-chat { animation:none; }
	.jw-helper-face i { animation:none; transition:none; }
}

@keyframes p-help-dot {
	0%, 100% { background:#FE8130; box-shadow:0 0 0 4px rgba(254,129,48,.16); transform:scale(1); }
	50% { background:#fff; box-shadow:0 0 0 4px rgba(255,255,255,.18); transform:scale(1.3); }
}