/* 调整tabber位置的修复样式 */
.tabber {
  /* Keep fixed positioning and z-index, but avoid forcing top/right so responsive rules can override */
  position: fixed !important;
  z-index: 1000 !important;
}

/* 添加一些美观调整 */
.tabber {
  border-radius: 2.5rem !important;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1) !important;
}

@media (max-width: 768px) {
  /* Keep the tabber fixed on small screens to avoid it centering and growing full-width.
     Make it slightly inset from the top-right and allow vertical stacking at very small widths. */
  .tabber {
    position: fixed !important;
    margin: 0 !important;
    width: auto !important;
    max-width: calc(100% - 20px) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.4rem !important;
    background: transparent !important;
  }

  /* If the viewport is very narrow, keep the tabber compact and allow stacking (handled by toggle_button.css) */
  @media (max-width: 420px) {
    .tabber {
      right: 8px !important;
      padding: 6px !important;
      background: rgba(0,0,0,0.06) !important;
    }
  }
}

/* Ensure tabber is nudged down on medium and small screens to avoid overlapping top-centered title.
   These use !important so they reliably override earlier rules and inline styles if needed. */
@media (max-width: 960px) {
  .tabber {
    top: clamp(80px, 10vh, 140px) !important;
  }
}