/* Panda conversation capsule. Position belongs to CSS and stays fixed while the page scrolls. */
.panda-contact-dock {
  --contact-bottom:calc(16px + env(safe-area-inset-bottom,0px));
  position:fixed; top:auto; left:auto; inset-block-start:auto;
  right:max(12px,env(safe-area-inset-right,0px)); bottom:var(--contact-bottom);
  z-index:45; display:flex; align-items:center; gap:4px; padding:5px;
  width:127px; height:64px; box-sizing:border-box; border:1px solid #1b5743;
  border-radius:21px; background:linear-gradient(150deg,#0b4b39,#04261d); color:#04261d;
  box-shadow:0 7px 22px -9px rgb(4 38 29 / 30%),0 1px 3px rgb(4 38 29 / 12%),inset 0 1px 0 rgb(255 255 255 / 12%);
  font:600 10px/1.1 var(--body,'IBM Plex Sans',system-ui,sans-serif); isolation:isolate;
  transition:none !important; animation:none !important;
}
.panda-contact-dock *, .panda-contact-dock *::before, .panda-contact-dock *::after { box-sizing:border-box; }
.panda-contact-dock[hidden],html.panda-page-loading .panda-contact-dock { display:none !important; }
.panda-contact-dock .panda-contact-link {
  position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  flex:0 0 53px; width:53px; height:52px; padding:5px 2px; border:1px solid transparent; border-radius:15px;
  color:inherit; text-decoration:none; -webkit-tap-highlight-color:transparent; touch-action:manipulation;
  box-shadow:inset 0 1px 0 rgb(255 255 255 / 50%); transition:background-color 120ms ease,border-color 120ms ease;
}
.panda-contact-dock .panda-contact-telegram { background:#d3f8e8; }
.panda-contact-dock .panda-contact-chat { background:#ffd866; }
.panda-contact-name { font-size:9px; font-weight:700; letter-spacing:-.01em; white-space:nowrap; }
.panda-contact-link svg { display:block; width:23px; height:23px; flex:none; overflow:visible; }
.panda-contact-telegram svg { fill:currentColor; }
.panda-contact-chat svg { width:26px; height:26px; margin-top:-2px; }
.panda-contact-bubble { fill:#0b4b39; }
.panda-contact-ear, .panda-contact-eye, .panda-contact-nose { fill:#04261d; }
.panda-contact-face { fill:#fffdf6; }
.panda-contact-divider { width:1px; height:30px; flex:0 0 1px; background:rgb(211 248 232 / 20%); }
.panda-contact-dock .panda-contact-link:focus-visible { outline:3px solid #54f5be; outline-offset:3px; }
.panda-contact-tip { position:absolute; right:0; bottom:calc(100% + 14px); width:max-content; max-width:200px; padding:9px 12px; border:1px solid #1b5743; border-radius:11px; background:#04261d; color:#fffdf6; font:600 12px/1.3 var(--body,'IBM Plex Sans',system-ui,sans-serif); box-shadow:0 4px 14px rgb(4 38 29 / 18%); pointer-events:none; visibility:hidden; }
.panda-contact-link:focus-visible .panda-contact-tip { visibility:visible; }
@media (hover:hover) { .panda-contact-telegram:hover { background:#b8f3da; border-color:#54f5be; } .panda-contact-chat:hover { background:#fcc53a; border-color:#ffe7a3; } .panda-contact-link:hover .panda-contact-tip { visibility:visible; } }
body:has(.tabbar,.tabs) .panda-contact-dock { --contact-bottom:calc(max(68px,var(--tabs-h,68px),var(--tabbar-h,68px)) + 12px + env(safe-area-inset-bottom,0px)); }
/* The final control can scroll above the capsule without changing its location. */
body:has(> .panda-contact-dock):not([data-panda-screen="panda-run"])::after { content:""; display:block; height:84px; pointer-events:none; }
html:has(body > .panda-contact-dock) { scroll-padding-bottom:168px; }
body:has(> .panda-contact-dock) :is(input,textarea,select,form button) { scroll-margin-bottom:168px; }
/* Wide screens have an empty gutter beside the centered 480px app. */
@media (min-width:768px) { .panda-contact-dock { right:max(16px,calc(50vw - 383px)); } }
@media (prefers-reduced-motion:reduce) { .panda-contact-dock .panda-contact-link { transition:none !important; } }
.is-calm .panda-contact-dock .panda-contact-link { transition:none !important; }
/* Interaction fallbacks work before initialization and without JavaScript. */
body:has(dialog[open]:not([hidden] *):not(dialog:not([open]) *), [aria-modal="true"]:not([hidden]):not([hidden] *):not(dialog:not([open]) *), .panda-currency-overlay:not([hidden]):not([hidden] *):not(dialog:not([open]) *), .overlay:not([hidden]):not([hidden] *):not(dialog:not([open]) *)) .panda-contact-dock,
body:has(input:focus,textarea:focus,select:focus,[contenteditable="true"]:focus,form:focus-within) .panda-contact-dock,
body[data-panda-screen="panda-run"]:has(#run-controls:not([hidden])) .panda-contact-dock { display:none; }