.hx-helpbot { --hx-help-bg: #151927; --hx-help-card: #22283b; --hx-help-text: #f5f6ff; --hx-help-muted: #b9bfd4; --hx-help-border: #39415c; position: fixed; z-index: 1100; right: 22px; bottom: 22px; font: 14px/1.5 system-ui, sans-serif; color: var(--hx-help-text); }
.hx-helpbot *, .hx-helpbot *::before, .hx-helpbot *::after { box-sizing: border-box; }
.hx-helpbot [hidden] { display: none !important; }
.hx-help-launcher { display: flex; align-items: center; gap: 10px; margin-left: auto; background: linear-gradient(135deg, #6650cf, #403f9a); color: white; border: 1px solid #a49bf1; border-radius: 28px; padding: 13px 19px; box-shadow: 0 8px 30px #0005; cursor: pointer; font: inherit; font-weight: 650; }
.hx-help-launcher > span:first-child { font-size: 22px; }
.hx-help-launcher { position: relative; background: linear-gradient(120deg, #9333ea, #6548d5 55%, #394cb5); box-shadow: 0 8px 30px #24105466, 0 0 0 4px #a78bfa18; transition: transform .2s, box-shadow .2s; animation: hx-help-arrive .5s ease-out both; }
.hx-help-launcher:hover { transform: translateY(-3px); box-shadow: 0 13px 36px #24105488, 0 0 0 6px #a78bfa22; }
.hx-help-launcher > span:first-child { display: inline-block; color: #d9f9ff; animation: hx-help-spark 2.8s ease-in-out 3; }
.hx-help-launcher[aria-expanded="true"] > span:first-child { animation: none; transform: rotate(45deg); }
.hx-helpbot .hx-help-panel { transform-origin: bottom right; animation: hx-help-open .24s cubic-bezier(.2,.8,.2,1) both; }
.hx-helpbot .hx-help-panel.is-closing { animation: hx-help-close .17s ease-in both; pointer-events: none; }
.hx-help-header { background: linear-gradient(110deg, #7c3aed1c, #22d3ee0d); }
.hx-help-avatar { background: linear-gradient(135deg, #a855f7, #4f46e5); box-shadow: 0 4px 15px #7c3aed33; }
.hx-help-message { animation: hx-help-message .22s ease-out both; }
.hx-help-questions { animation: hx-help-message .3s ease-out both; }
.hx-help-typing { display: flex; align-items: center; gap: 5px; width: 65px; padding: 15px; }
.hx-help-typing span { width: 6px; height: 6px; border-radius: 50%; background: #a78bfa; animation: hx-help-dot .85s ease-in-out infinite; }
.hx-help-typing span:nth-child(2) { animation-delay: .12s; }
.hx-help-typing span:nth-child(3) { animation-delay: .24s; }
.hx-help-questions button, .hx-help-actions a { transition: background .18s, border-color .18s, transform .18s; }
.hx-help-questions button:hover, .hx-help-actions a:hover { transform: translateY(-2px); }
@keyframes hx-help-arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes hx-help-spark { 0%, 100% { transform: scale(1) rotate(0); } 50% { transform: scale(1.2) rotate(18deg); } }
@keyframes hx-help-open { from { opacity: 0; transform: translateY(16px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes hx-help-close { to { opacity: 0; transform: translateY(10px) scale(.97); } }
@keyframes hx-help-message { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
@keyframes hx-help-dot { 0%, 70%, 100% { transform: translateY(0); opacity: .5; } 35% { transform: translateY(-4px); opacity: 1; } }
.hx-helpbot .hx-help-panel { width: min(385px, calc(100vw - 32px)); max-width: none !important; max-height: min(640px, calc(100dvh - 120px)); display: flex; flex-direction: column; position: absolute; right: 0; bottom: 72px; border: 1px solid var(--hx-help-border); border-radius: 22px; background: var(--hx-help-bg); box-shadow: 0 18px 65px #0007; overflow: hidden; }
.hx-help-header { padding: 16px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--hx-help-border); }
.hx-help-header > div { display: flex; align-items: center; gap: 10px; }
.hx-help-avatar { width: 36px; height: 36px; display: grid; place-items: center; background: #6650cf; border-radius: 12px; color: white; font-weight: 750; }
.hx-help-header strong { display: block; font-size: 15px; }
.hx-help-header small { display: block; color: var(--hx-help-muted); font-size: 10px; margin-top: 2px; }
.hx-help-close { cursor: pointer; border: 0; background: transparent; color: var(--hx-help-muted); font-family: inherit; font-size: 26px; line-height: 1; padding: 6px 10px; }
.hx-help-messages { overflow-y: auto; overscroll-behavior: contain; padding: 16px; min-height: 160px; }
.hx-help-message { background: var(--hx-help-card); padding: 12px 14px; border-radius: 15px 15px 15px 4px; margin-bottom: 12px; }
.hx-help-message p { margin: 0; white-space: pre-line; font: inherit; color: inherit; }
.hx-help-user { margin-left: 32px; background: #5446a4; color: white; border-radius: 15px 15px 4px 15px; }
.hx-help-questions, .hx-help-actions { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 10px; }
.hx-help-questions button, .hx-help-actions a { border: 1px solid var(--hx-help-border); border-radius: 10px; padding: 8px 10px; background: transparent; color: var(--hx-help-text); text-decoration: none; cursor: pointer; font-family: inherit; font-size: 12px; line-height: 1.35; text-align: left; }
.hx-help-questions button:hover, .hx-help-actions a:hover { background: #6650cf; color: white; border-color: #a49bf1; }
.hx-help-shortcuts { padding: 12px 16px 16px; display: flex; flex-shrink: 0; justify-content: space-between; gap: 12px; border-top: 1px solid var(--hx-help-border); }
.hx-help-reset, .hx-help-shortcuts a { background: transparent; border: 0; padding: 0; color: var(--hx-help-muted); font-family: inherit; font-size: 11px; line-height: 1.5; cursor: pointer; text-decoration: underline; }
.hx-helpbot :focus-visible { outline: 3px solid #b1a7ff; outline-offset: 3px; }
body:not(.dark-mode) .hx-helpbot { --hx-help-bg: #fff; --hx-help-card: #f2f2fb; --hx-help-text: #25253f; --hx-help-muted: #5e617a; --hx-help-border: #dcddee; }
body:has(.cookie-banner:not([hidden])) .hx-helpbot { bottom: 155px; }
@media (max-width: 600px) { .hx-helpbot { right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); } .hx-helpbot .hx-help-panel { max-height: min(540px, calc(100dvh - 110px)); bottom: 66px; } .hx-help-launcher { padding: 10px 15px; } body:has(.cookie-banner:not([hidden])) .hx-helpbot { bottom: 175px; } body:has(.cookie-banner:not([hidden])) .hx-help-panel { max-height: calc(100dvh - 265px); } }
@media (prefers-reduced-motion: reduce) { .hx-helpbot *, .hx-helpbot *::before, .hx-helpbot *::after { animation: none !important; transition: none !important; } }