.contact-float {
  --contact-safe-top: env(safe-area-inset-top, 0px);
  --contact-safe-right: env(safe-area-inset-right, 0px);
  --contact-safe-bottom: env(safe-area-inset-bottom, 0px);
  --contact-safe-left: env(safe-area-inset-left, 0px);
  position: fixed;
  z-index: 40;
  left: calc(16px + env(safe-area-inset-left, 0px));
  top: calc(16px + env(safe-area-inset-top, 0px));
  width: 76px;
  height: 76px;
  padding: 10px 0 9px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 50%;
  background: rgba(35, 49, 56, .88);
  color: #fff;
  box-shadow: 0 4px 18px rgba(16, 29, 35, .2);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  cursor: grab;
  clip-path: inset(-24px);
  transition: left .28s cubic-bezier(.22,1,.36,1), top .28s cubic-bezier(.22,1,.36,1), transform .24s ease, clip-path .24s ease;
}
.contact-float svg { width: 30px; height: 30px; flex: none; pointer-events: none; }
.contact-float span { font: 500 16px/1.2 Arial, sans-serif; letter-spacing: .08em; pointer-events: none; }
.contact-float.is-dragging { cursor: grabbing; transition: none; }
.contact-float.is-scroll-hidden {
  transform: translate3d(var(--contact-hide-x, 0px), var(--contact-hide-y, 0px), 0);
}
.contact-float.is-scroll-hidden[data-dock-edge="left"] { clip-path: inset(-24px -24px -24px 60%); }
.contact-float.is-scroll-hidden[data-dock-edge="right"] { clip-path: inset(-24px 60% -24px -24px); }
.contact-float.is-scroll-hidden[data-dock-edge="top"] { clip-path: inset(60% -24px -24px -24px); }
.contact-float.is-scroll-hidden[data-dock-edge="bottom"] { clip-path: inset(-24px -24px 60% -24px); }
.contact-float > svg, .contact-float > span { transition: opacity .14s ease; }
.contact-float.is-scroll-hidden > svg, .contact-float.is-scroll-hidden > span { opacity: 0; }
.contact-float::after {
  content: "咨询";
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  font: 600 16px/1.2 Arial, sans-serif;
  letter-spacing: .06em;
  opacity: 0;
  pointer-events: none;
  transition: opacity .14s ease;
}
.contact-float.is-scroll-hidden::after { opacity: 1; }
.contact-float[data-dock-edge="left"]::after { right: 0; top: 0; width: 40%; height: 100%; writing-mode: vertical-rl; }
.contact-float[data-dock-edge="right"]::after { left: 0; top: 0; width: 40%; height: 100%; writing-mode: vertical-rl; }
.contact-float[data-dock-edge="top"]::after { left: 0; bottom: 0; width: 100%; height: 40%; }
.contact-float[data-dock-edge="bottom"]::after { left: 0; top: 0; width: 100%; height: 40%; }
.contact-float:focus-visible { outline: 3px solid #fff; outline-offset: 3px; box-shadow: 0 0 0 7px #334b59, 0 4px 18px rgba(16, 29, 35, .2); }
.contact-float[data-cover-hidden],
body.modal-open .contact-float { visibility: hidden; pointer-events: none; }
@media (prefers-reduced-motion: reduce) {
  .contact-float { transition: none; }
}
@media (forced-colors: active) {
  .contact-float { background: ButtonFace; color: ButtonText; border: 2px solid ButtonText; }
  .contact-float:focus-visible { outline-color: Highlight; }
}
