.top-right-contacts{
  position: fixed;
  top: 20px;        /* 右上角定位 */
  right: 20px;
  display: flex;
  flex-direction: column;   /* 纵向排列 */
  gap: 12px;
  z-index: 9999;   /* 悬浮在所有页面内容之上 */
  pointer-events: auto;
  background: transparent;  /* 自身无背景，不遮挡页面 */
}

.contact-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: #111;
  width: 72px;
  font-family: system-ui, -apple-system, "Helvetica Neue", Arial;
}

.icon-box{
  width: 72px;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffffcc;         /* 半透明白色方块 */
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease;
  backdrop-filter: blur(4px);     /* 背景模糊，使方块看起来悬浮 */
  border: 1px solid rgba(0,0,0,0.04);
}

.icon-box svg{
  width: 34px;
  height: 34px;
  stroke: currentColor;
  fill: none;
}

.contact-item:hover .icon-box,
.contact-item:focus .icon-box{
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 10px 22px rgba(0,0,0,0.12);
  background: #fff;
}

.contact-label{
  margin-top: 8px;
  font-size: 12px;
  line-height: 1;
  user-select: none;
  color: #222;
}

@media (max-width: 520px){
  .top-right-contacts{
    top: 14px;
    right: 14px;
    gap: 10px;
  }
  .contact-item{ width: 56px; }
  .icon-box{ width: 56px; border-radius: 8px; }
  .icon-box svg{ width: 28px; height: 28px; }
  .contact-label{ font-size: 11px; }
}