/* QilyLean sitewide floating dock standard v3｜2026-08-19
 * One visual contract for every public page, desktop and mobile.
 * V3 keeps free X/Y dragging while the pointer is held, then automatically returns the dock to the viewport bottom-right home position.
 */
:root{
  --qily-dock-size:62px;
  --qily-dock-gap:8px;
  --qily-dock-bg:#0f4b5a;
  --qily-dock-bg-hover:#12606f;
  --qily-dock-border:#caa15f;
  --qily-dock-font-size:15px;
  --qily-dock-edge:12px;
}

html body #floatDock.qily-float-dock{
  position:fixed!important;
  right:max(var(--qily-dock-edge),env(safe-area-inset-right))!important;
  left:auto!important;
  top:auto!important;
  bottom:max(var(--qily-dock-edge),env(safe-area-inset-bottom))!important;
  z-index:9000!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:var(--qily-dock-gap)!important;
  max-height:calc(100dvh - 16px)!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
  touch-action:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  cursor:grab!important;
}

html body #floatDock.qily-float-dock .qily-float-btn,
html body #floatDock.qily-float-dock .qily-float-btn[data-action="share"]{
  box-sizing:border-box!important;
  display:flex!important;
  flex:0 0 var(--qily-dock-size)!important;
  align-items:center!important;
  justify-content:center!important;
  width:var(--qily-dock-size)!important;
  min-width:var(--qily-dock-size)!important;
  max-width:var(--qily-dock-size)!important;
  height:var(--qily-dock-size)!important;
  min-height:var(--qily-dock-size)!important;
  max-height:var(--qily-dock-size)!important;
  margin:0!important;
  padding:5px!important;
  border:1.5px solid var(--qily-dock-border)!important;
  border-radius:50%!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:var(--qily-dock-bg)!important;
  box-shadow:0 8px 20px rgba(7,60,71,.22)!important;
  filter:none!important;
  font:inherit!important;
  font-size:var(--qily-dock-font-size)!important;
  font-weight:900!important;
  line-height:1.08!important;
  letter-spacing:0!important;
  text-align:center!important;
  text-shadow:none!important;
  white-space:normal!important;
  overflow:hidden!important;
  cursor:grab!important;
  touch-action:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease!important;
}

html body #floatDock.qily-float-dock .qily-float-btn:is(:hover,:focus-visible){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:var(--qily-dock-bg-hover)!important;
  border-color:#ffe39b!important;
  box-shadow:0 10px 24px rgba(7,60,71,.30)!important;
  outline:2px solid rgba(255,227,155,.45)!important;
  outline-offset:2px!important;
  transform:translateY(-1px)!important;
}

html body #floatDock.qily-float-dock .qily-float-btn:active,
html body #floatDock.qily-float-dock .qily-float-btn[data-qily-pressed="true"]{
  background:#073c47!important;
  transform:scale(.96)!important;
}

html body #floatDock.qily-float-dock.qily-dock-dragging,
html body #floatDock.qily-float-dock.qily-dock-dragging .qily-float-btn{
  cursor:grabbing!important;
}
html body #floatDock.qily-float-dock.qily-dock-dragging{
  will-change:left,top!important;
}
html body #floatDock.qily-float-dock.qily-dock-dragging .qily-float-btn{
  transform:none!important;
}

html body #floatDock.qily-float-dock [data-action="share"] .qily-share-label-line{
  display:block!important;
  margin:0!important;
  padding:0!important;
  font-size:var(--qily-dock-font-size)!important;
  font-weight:900!important;
  line-height:1.02!important;
  letter-spacing:0!important;
  text-align:center!important;
  white-space:nowrap!important;
}
html body #floatDock.qily-float-dock [data-action="share"] .qily-share-label-primary,
html body #floatDock.qily-float-dock [data-action="share"] .qily-share-label-url{
  font-size:var(--qily-dock-font-size)!important;
  font-weight:900!important;
  letter-spacing:0!important;
}

@media(max-width:640px){
  :root{
    --qily-dock-size:58px;
    --qily-dock-gap:7px;
    --qily-dock-font-size:14px;
    --qily-dock-edge:8px;
  }
  html body #floatDock.qily-float-dock{
    right:max(var(--qily-dock-edge),env(safe-area-inset-right))!important;
    bottom:max(var(--qily-dock-edge),env(safe-area-inset-bottom))!important;
    top:auto!important;
  }
  html body #floatDock.qily-float-dock .qily-float-btn,
  html body #floatDock.qily-float-dock .qily-float-btn[data-action="share"]{
    padding:4px!important;
    font-size:var(--qily-dock-font-size)!important;
  }
  html body #floatDock.qily-float-dock [data-action="share"] .qily-share-label-primary,
  html body #floatDock.qily-float-dock [data-action="share"] .qily-share-label-url{
    font-size:var(--qily-dock-font-size)!important;
  }
}

@media(prefers-reduced-motion:reduce){
  html body #floatDock.qily-float-dock .qily-float-btn{transition:none!important;}
}
