:root {
  --cite-bg-color: #ffffff;
  --cite-border-color: #d1d9e0;
  --cite-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}
@media (prefers-color-scheme: dark) {
  :root {
    --cite-bg-color: #1e1e1e;
    --cite-border-color: #444444;
    --cite-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
  }
}

/* 1. 基础链接：作为定位锚点 */
.cite-link {
  position: relative;
  display: inline-block;
  cursor: pointer;
  font-weight: 500;
  -webkit-tap-highlight-color: transparent;
}

/* 2. 浮窗容器通用重置 (不分设备) */
.cite-link span {
  /* 默认隐藏状态 */
  display: block;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;

  white-space: normal;
  text-align: left;
  line-height: 1.5;
  font-size: 0.85rem;
  z-index: 100;
  color: var(--text-color);
  padding: 12px 20px;

  background-color: var(--cite-bg-color);
  border: 1px solid var(--cite-border-color);
  box-shadow: var(--cite-shadow);
  border-radius: 8px;
}

/* ============================================================
   设备适配逻辑
   ============================================================ */
/* 4. 桌面端 (769px 以上)：相对于引用文字悬浮 */
@media screen and (min-width: 769px) {
  .cite-link span {
    position: absolute;
    bottom: 145%;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    width: 300px;
    transition: var(--appear-or-dis), transform 0.25s ease;
  }

  .cite-link:hover span {
    visibility: visible;
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }

  /* 桌面端小箭头 */
  .cite-link span::after {
    /* 这个画法太天才了 */
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 8px;
    border-style: solid;
    border-color: var(--cite-bg-color) transparent transparent transparent;
    filter: drop-shadow(0 1px 0 var(--cite-border-color));
  }
}

/* 5. 移动端 (768px 以下)：强制吸底 */
@media screen and (max-width: 768px) {
  .cite-link span {
    position: fixed;
    width: calc(100% - 2 * var(--floating-side-gap));
    left: auto;
    right: var(--floating-side-gap);
    top: auto;
    bottom: var(--nav-height-space);
    /* 浮于nav上方 */

    /* 动画：从下方滑入 */
    transform: translateY(120%);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s;

    pointer-events: auto;
  }

  /* 引用文字点击后的视觉反馈 */
  .cite-link.is-peeking {
    background-color: var(--bg-color-active);
    outline: 1px solid var(--link-color);
    border-radius: 3px;
    z-index: 100; 
    /* 高度要超过overlay */
  }

  /* 手机端激活状态 (通过 JS 控制的 .is-peeking) */
  .cite-link.is-peeking span {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }

  #tooltip-overlay {
    /* background-color: rgba(255, 0, 0); */
    z-index: 90;
  }
}