/* imex contact dock · replaces .icon-bar · v5 2026-09-07 (60px marks, corner-anchored, no labels, soft hover) */
.imx-dock{position:fixed;right:12px;bottom:20px;z-index:2147483000;display:flex;flex-direction:column;align-items:center;gap:12px;padding:8px 6px 4px;
  --imx-blue:#003761;--imx-blue2:#2478b6;--imx-fb:#1877f2;--imx-line:#06c755;--imx-ease:cubic-bezier(.22,1,.36,1);--imx-ease-soft:cubic-bezier(.25,.8,.25,1);
  font-family:inherit;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
.imx-dock.imx-dragging{cursor:grabbing}
.imx-dock.imx-dragging .imx-btn{transform:scale(1.02);transition:none}
.imx-dock.imx-gone{display:none}
.imx-btn{position:relative;display:flex;align-items:center;justify-content:center;text-decoration:none;width:60px;height:60px;border-radius:50%;
  box-shadow:0 6px 18px rgba(0,55,97,.16);transition:transform .5s var(--imx-ease-soft),box-shadow .5s var(--imx-ease-soft);cursor:pointer;-webkit-tap-highlight-color:transparent}
.imx-fb{background:var(--imx-fb)}.imx-line{background:var(--imx-line)}
.imx-btn svg{display:block;fill:#fff;pointer-events:none}
.imx-btn:hover{transform:translateY(-1px) scale(1.02);box-shadow:0 10px 22px rgba(0,55,97,.20)}
.imx-btn:active{transform:scale(.985)}
.imx-btn:focus{outline:0}.imx-btn:focus-visible{outline:2px solid var(--imx-blue2);outline-offset:2px}
/* hover X · removes the dock for this visit */
.imx-close{position:absolute;top:-6px;right:-4px;width:22px;height:22px;border:0;border-radius:50%;background:#fff;color:#6b7c8a;font-size:15px;line-height:22px;padding:0;text-align:center;cursor:pointer;
  box-shadow:0 2px 8px rgba(0,55,97,.18);opacity:0;transform:scale(.6);transition:opacity .25s ease-out,transform .5s var(--imx-ease),color .2s;pointer-events:none}
.imx-dock:hover .imx-close,.imx-close:focus-visible{opacity:1;transform:scale(1);pointer-events:auto}
.imx-close:hover{color:#d64545;background:#fff}
.imx-dragging .imx-close{opacity:0!important;pointer-events:none}
@media (hover:none){.imx-close{opacity:1;transform:scale(1);pointer-events:auto;top:-2px;right:-2px;width:20px;height:20px;font-size:14px;line-height:20px}}

/* LINE OA speech bubble · enter: move out on a long ease-out while fading in · exit: slide back, fade after the move starts */
.imx-bubble{position:absolute;bottom:4px;width:248px;background:#fff;border-radius:16px;padding:14px 14px 12px;
  box-shadow:0 18px 44px rgba(0,55,97,.22),0 1px 2px rgba(0,55,97,.10);color:#0f1f2d;font-size:13px;line-height:1.45;
  opacity:0;pointer-events:none;visibility:hidden;will-change:transform,opacity;transform-origin:100% calc(100% - 30px);
  transform:translate3d(14px,0,0) scale(.92);
  transition:transform .55s var(--imx-ease),opacity .28s ease-out .12s,visibility 0s linear .6s}
/* invisible hit-bridge across the 16px gap · without it the pointer leaves the dock on the way to the bubble,
   mouseleave fires and the bubble hides while you are reaching for the Add-friend button */
.imx-bubble::before{content:"";position:absolute;top:0;bottom:0;width:18px}
.imx-dock[data-side=right] .imx-bubble::before{left:100%}
.imx-dock[data-side=left] .imx-bubble::before{right:100%}
.imx-dock[data-side=right] .imx-bubble{right:calc(100% + 16px)}
.imx-dock[data-side=left] .imx-bubble{left:calc(100% + 16px);transform-origin:0 calc(100% - 30px);transform:translate3d(-14px,0,0) scale(.92)}
.imx-bubble.imx-on{opacity:1;pointer-events:auto;visibility:visible;transform:translate3d(0,0,0) scale(1);
  transition:transform .6s var(--imx-ease),opacity .32s ease-out,visibility 0s}
.imx-bubble::after{content:"";position:absolute;bottom:23px;width:14px;height:14px;background:#fff;transform:rotate(45deg);box-shadow:4px 4px 10px rgba(0,55,97,.08)}
.imx-dock[data-side=right] .imx-bubble::after{right:-7px}
.imx-dock[data-side=left] .imx-bubble::after{left:-7px}
.imx-line.imx-pulse{animation:imx-pulse 1.1s var(--imx-ease-soft) 1}
@keyframes imx-pulse{0%{transform:scale(1)}40%{transform:scale(1.05)}100%{transform:scale(1)}}
.imx-x{position:absolute;top:8px;right:8px;width:24px;height:24px;border:0;border-radius:50%;background:transparent;color:#6b7c8a;font-size:18px;line-height:1;cursor:pointer;padding:0}
.imx-x:hover{background:rgba(0,55,97,.06);color:var(--imx-blue)}
.imx-bub-head{display:flex;align-items:center;gap:10px;margin-bottom:8px;padding-right:22px}
.imx-ava{width:36px;height:36px;border-radius:50%;background:var(--imx-line);display:flex;align-items:center;justify-content:center;flex:none}
.imx-ava svg{fill:#fff;width:20px;height:20px}
.imx-bub-head b{display:block;font-size:13px;color:var(--imx-blue);letter-spacing:.01em}
.imx-bub-head small{display:block;font-size:11px;color:#6b7c8a;margin-top:1px}
.imx-bubble p{margin:0 0 10px;color:#334552}
.imx-add{display:flex;align-items:center;justify-content:center;gap:8px;height:38px;border-radius:10px;background:var(--imx-line);color:#fff!important;font-weight:600;font-size:13px;text-decoration:none!important;transition:filter .25s ease-out,transform .5s var(--imx-ease)}
.imx-add:hover{filter:brightness(1.06);transform:translateY(-1px)}
.imx-add svg{width:16px;height:16px;fill:#fff}

@media (max-width:576px){.imx-dock{right:10px;bottom:16px}.imx-bubble{width:min(248px,calc(100vw - 96px))}}
@media (prefers-reduced-motion:reduce){.imx-dock *,.imx-bubble,.imx-btn{transition:none!important;animation:none!important}}