/* 阅读页的置顶、目录、置底按钮：由 reader-floating-controls.js 移到 body portal。 */

/* 按钮已被搬到 body 最外层，避免被 article/main 的 transform 或 contain 困住。 */
body > .back-to-top-button.songline-reading-float-button,
body > .scroll-to-bottom-button.songline-reading-float-button,
body > .back-to-top-button[data-songline-float-portal="1"],
body > .scroll-to-bottom-button[data-songline-float-portal="1"]{
  position:fixed!important;
  left:auto!important;
  top:auto!important;
  right:26px!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  max-width:44px!important;
  max-height:44px!important;
  padding:0!important;
  margin:0!important;
  border-radius:999px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  z-index:10020!important;
  transform:none!important;
  translate:none!important;
  inset:auto 26px auto auto!important;
  opacity:0!important;
  pointer-events:none!important;
  contain:none!important;
  will-change:auto!important;
}

body > .back-to-top-button.songline-reading-float-button,
body > .back-to-top-button[data-songline-float-portal="1"]{
  bottom:104px!important;
}

body > .scroll-to-bottom-button.songline-reading-float-button,
body > .scroll-to-bottom-button[data-songline-float-portal="1"]{
  bottom:48px!important;
}

body > .back-to-top-button.songline-reading-float-button.show,
body > .scroll-to-bottom-button.songline-reading-float-button.show,
body > .back-to-top-button[data-songline-float-portal="1"].show,
body > .scroll-to-bottom-button[data-songline-float-portal="1"].show{
  opacity:1!important;
  pointer-events:auto!important;
}

body > .back-to-top-button.songline-reading-float-button svg,
body > .scroll-to-bottom-button.songline-reading-float-button svg,
body > .back-to-top-button[data-songline-float-portal="1"] svg,
body > .scroll-to-bottom-button[data-songline-float-portal="1"] svg{
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  min-height:20px!important;
  display:block!important;
}

/* hover/focus 只允许视觉变化，不改变定位基准。 */
body > .back-to-top-button.songline-reading-float-button:hover,
body > .scroll-to-bottom-button.songline-reading-float-button:hover,
body > .back-to-top-button[data-songline-float-portal="1"]:hover,
body > .scroll-to-bottom-button[data-songline-float-portal="1"]:hover,
body > .back-to-top-button.songline-reading-float-button:focus-visible,
body > .scroll-to-bottom-button.songline-reading-float-button:focus-visible,
body > .back-to-top-button[data-songline-float-portal="1"]:focus-visible,
body > .scroll-to-bottom-button[data-songline-float-portal="1"]:focus-visible{
  transform:translateY(-2px) scale(1.04)!important;
}

/* 手机端：body 直出三键，右侧竖排。 */
@media(max-width:980px){
  body > .back-to-top-button.songline-reading-float-button,
  body > .scroll-to-bottom-button.songline-reading-float-button,
  body > .back-to-top-button[data-songline-float-portal="1"],
  body > .scroll-to-bottom-button[data-songline-float-portal="1"],
  body > .mobile-toc-fab{
    position:fixed!important;
    left:auto!important;
    top:auto!important;
    right:14px!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
    max-width:42px!important;
    max-height:42px!important;
    padding:0!important;
    margin:0!important;
    border-radius:999px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    z-index:10020!important;
    transform:none!important;
    translate:none!important;
    contain:none!important;
    will-change:auto!important;
  }

  body > .back-to-top-button.songline-reading-float-button,
  body > .back-to-top-button[data-songline-float-portal="1"]{
    bottom:178px!important;
  }

  body > .mobile-toc-fab{
    bottom:124px!important;
  }

  body > .scroll-to-bottom-button.songline-reading-float-button,
  body > .scroll-to-bottom-button[data-songline-float-portal="1"]{
    bottom:70px!important;
  }

  body > .mobile-toc-fab svg,
  body > .mobile-toc-fab .ui-icon{
    width:20px!important;
    height:20px!important;
    min-width:20px!important;
    min-height:20px!important;
    display:block!important;
  }

  html.mobile-toc-open body > .mobile-toc-fab{
    opacity:0!important;
    pointer-events:none!important;
  }
}

@media(max-width:430px){
  body > .back-to-top-button.songline-reading-float-button,
  body > .scroll-to-bottom-button.songline-reading-float-button,
  body > .back-to-top-button[data-songline-float-portal="1"],
  body > .scroll-to-bottom-button[data-songline-float-portal="1"],
  body > .mobile-toc-fab{
    right:12px!important;
  }

  body > .back-to-top-button.songline-reading-float-button,
  body > .back-to-top-button[data-songline-float-portal="1"]{
    bottom:172px!important;
  }

  body > .mobile-toc-fab{
    bottom:120px!important;
  }

  body > .scroll-to-bottom-button.songline-reading-float-button,
  body > .scroll-to-bottom-button[data-songline-float-portal="1"]{
    bottom:68px!important;
  }
}

/* 手机端 Markdown 目录抽屉。 */
/* v20.18.5：手机端 Markdown 阅读目录改为固定悬浮抽屉 */
@media(max-width:980px){
  /* 隐藏原始目录源，避免它固定在文章最下方占位置 */
  .mobile-toc-source-hidden{
    display:none!important;
    visibility:hidden!important;
    width:0!important;
    height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
  }

  /* 悬浮目录按钮：跟随屏幕 */
  .mobile-toc-fab{
    position:fixed!important;
    right:14px!important;
    bottom:calc(18px + env(safe-area-inset-bottom, 0px))!important;
    z-index:9998!important;
    min-width:68px!important;
    height:44px!important;
    padding:0 15px!important;
    border-radius:999px!important;
    border:1px solid color-mix(in srgb, var(--accent) 24%, transparent)!important;
    background:
      radial-gradient(circle at 28% 18%, rgba(255,255,255,.45), transparent 36%),
      color-mix(in srgb, var(--panel) 86%, transparent)!important;
    color:var(--text)!important;
    box-shadow:0 18px 42px rgba(15,23,42,.20)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    font-weight:900!important;
    letter-spacing:.04em!important;
    appearance:none!important;
    -webkit-appearance:none!important;
  }

  .mobile-toc-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:9996!important;
    background:rgba(15,23,42,.34)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:opacity .18s ease, visibility .18s ease!important;
  }

  .mobile-toc-drawer{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    bottom:calc(10px + env(safe-area-inset-bottom, 0px))!important;
    z-index:9997!important;
    max-height:min(72vh, 560px)!important;
    display:grid!important;
    grid-template-rows:auto auto minmax(0,1fr)!important;
    border-radius:24px!important;
    border:1px solid color-mix(in srgb, var(--accent) 16%, var(--border))!important;
    background:color-mix(in srgb, var(--panel) 94%, transparent)!important;
    box-shadow:0 24px 70px rgba(15,23,42,.30)!important;
    overflow:hidden!important;
    transform:translateY(calc(100% + 22px))!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:transform .22s ease, visibility .22s ease!important;
    backdrop-filter:blur(22px)!important;
    -webkit-backdrop-filter:blur(22px)!important;
  }

  .mobile-toc-open .mobile-toc-backdrop{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  .mobile-toc-open .mobile-toc-drawer{
    transform:translateY(0)!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  .mobile-toc-open .mobile-toc-fab{
    opacity:0!important;
    pointer-events:none!important;
  }

  .mobile-toc-drawer-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    padding:14px 15px 10px!important;
  }
  .mobile-toc-drawer-head strong{
    display:block!important;
    font-size:17px!important;
    line-height:1.2!important;
    color:var(--text)!important;
  }
  .mobile-toc-drawer-head small{
    display:block!important;
    margin-top:3px!important;
    color:var(--muted)!important;
    font-size:12px!important;
  }
  .mobile-toc-close{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    border-radius:999px!important;
    border:1px solid color-mix(in srgb, var(--accent) 13%, var(--border))!important;
    background:color-mix(in srgb, var(--panel) 78%, transparent)!important;
    color:var(--text)!important;
    font-size:24px!important;
    line-height:1!important;
    display:grid!important;
    place-items:center!important;
    appearance:none!important;
    -webkit-appearance:none!important;
  }

  .mobile-toc-search{
    display:grid!important;
    gap:6px!important;
    padding:0 15px 12px!important;
  }
  .mobile-toc-search span{
    font-size:12px!important;
    color:var(--muted)!important;
    font-weight:800!important;
  }
  .mobile-toc-search input{
    width:100%!important;
    height:42px!important;
    min-height:42px!important;
    border-radius:14px!important;
    border:1px solid color-mix(in srgb, var(--accent) 16%, var(--border))!important;
    background:color-mix(in srgb, var(--bg) 72%, transparent)!important;
    color:var(--text)!important;
    padding:0 12px!important;
    font:inherit!important;
    box-sizing:border-box!important;
  }

  .mobile-toc-list{
    min-height:0!important;
    max-height:100%!important;
    overflow:auto!important;
    padding:0 12px 14px!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .mobile-toc-item{
    display:block!important;
    width:100%!important;
    box-sizing:border-box!important;
    padding:10px 10px!important;
    margin:0 0 6px!important;
    border-radius:13px!important;
    color:var(--muted)!important;
    text-decoration:none!important;
    line-height:1.42!important;
    font-size:13px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
    background:transparent!important;
  }
  .mobile-toc-item.depth-2{padding-left:18px!important}
  .mobile-toc-item.depth-3{padding-left:28px!important;font-size:12.5px!important}
  .mobile-toc-item.depth-4{padding-left:36px!important;font-size:12px!important}
  .mobile-toc-item.depth-5,.mobile-toc-item.depth-6{padding-left:36px!important;font-size:12px!important}
  .mobile-toc-item:hover,
  .mobile-toc-item:focus{
    color:var(--text)!important;
    background:color-mix(in srgb, var(--accent) 9%, transparent)!important;
  }
  .mobile-toc-empty{
    margin:8px 4px 14px!important;
    padding:12px!important;
    border-radius:14px!important;
    color:var(--muted)!important;
    background:color-mix(in srgb, var(--accent) 6%, transparent)!important;
    font-size:13px!important;
  }

  /* 撤销上一版“正文内折叠卡片”的手机端表现 */
  .toc-card.mobile-reading-toc,
  .article-toc.mobile-reading-toc,
  .post-toc.mobile-reading-toc,
  .table-of-contents.mobile-reading-toc,
  .reading-toc.mobile-reading-toc,
  aside.toc.mobile-reading-toc{
    display:none!important;
  }
}

@media(min-width:981px){
  .mobile-toc-fab,
  .mobile-toc-backdrop,
  .mobile-toc-drawer{
    display:none!important;
  }
}

/* 手机阅读页右侧三键：回到顶部、目录、下滑到底部。 */
@media(max-width:980px){

  .back-to-top-button,
  .mobile-toc-fab,
  .scroll-to-bottom-button{
    position:fixed!important;
    right:14px!important;
    left:auto!important;
    z-index:9994!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
    padding:0!important;
    border-radius:999px!important;
    border:1.5px solid var(--border)!important;
    background:rgba(255,242,220,.92)!important;
    color:var(--accent-2)!important;
    box-shadow:var(--shadow)!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:24px!important;
    font-weight:900!important;
    letter-spacing:0!important;
    appearance:none!important;
    -webkit-appearance:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  .back-to-top-button{ bottom:178px!important; }
  .mobile-toc-fab{ bottom:124px!important; }
  .scroll-to-bottom-button{ bottom:70px!important; }

  .mobile-toc-fab span,
  .mobile-toc-fab .ui-icon{
    display:inline-grid!important;
    place-items:center!important;
    width:22px!important;
    height:22px!important;
    line-height:1!important;
  }
  .mobile-toc-fab svg,
  .back-to-top-button svg,
  .scroll-to-bottom-button svg{
    width:20px!important;
    height:20px!important;
  }

  .back-to-top-button:hover,
  .back-to-top-button:focus-visible,
  .mobile-toc-fab:hover,
  .mobile-toc-fab:focus-visible,
  .scroll-to-bottom-button:hover,
  .scroll-to-bottom-button:focus-visible{
    transform:translateY(-3px) scale(1.06)!important;
    background:rgba(246,220,181,.96)!important;
    border-color:var(--accent-2)!important;
    color:#6f3f1d!important;
    box-shadow:0 18px 42px rgba(87,58,31,.18)!important;
    outline:none!important;
  }

  body.dark .back-to-top-button,
  body.dark .mobile-toc-fab,
  body.dark .scroll-to-bottom-button{
    background:rgba(19,43,66,.86)!important;
    border-color:#2b4360!important;
    color:#cfe6ff!important;
  }
  body.dark .back-to-top-button:hover,
  body.dark .back-to-top-button:focus-visible,
  body.dark .mobile-toc-fab:hover,
  body.dark .mobile-toc-fab:focus-visible,
  body.dark .scroll-to-bottom-button:hover,
  body.dark .scroll-to-bottom-button:focus-visible{
    background:rgba(19,43,66,.96)!important;
    color:#ffffff!important;
    border-color:#7dd3fc!important;
    box-shadow:0 18px 42px rgba(0,0,0,.34)!important;
  }

  .mobile-toc-open .mobile-toc-fab{
    opacity:0!important;
    pointer-events:none!important;
  }
}

@media(max-width: 430px){
  .back-to-top-button,
  .mobile-toc-fab,
  .scroll-to-bottom-button{
    right:12px!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
  }
  .back-to-top-button{ bottom:172px!important; }
  .mobile-toc-fab{ bottom:120px!important; }
  .scroll-to-bottom-button{ bottom:68px!important; }
}


/* v20.18.5-cleanup：已移除旧的左下角目录按钮定位，保留右侧三键竖排方案。 */