:root {
  color-scheme: light;
}

html {
  -webkit-text-size-adjust: 100%;
  /* 吸顶头(49px) + 设置分区导航(~41px) 总高约 90px，锚点跳转预留高度，避免目标被遮挡 */
  scroll-padding-top: 96px;
}

/* 移动端表单控件字号 ≥16px，规避 iOS Safari 聚焦时自动放大整页（桌面端不受影响）。
   需 !important 盖过 Tailwind 的 text-sm/text-xs 工具类（类选择器优先级更高）。 */
@media (max-width: 1023px) {
  input,
  select,
  textarea {
    font-size: 16px !important;
  }
}

body {
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior-y: none;
}

/* 顶栏动作链接 / 按钮：撑到 ~40px 命中区并右对齐，兼顾可点性与紧凑外观。
   纵向负外边距抵消增高，保持顶栏总高不变（49px），以免吸顶分区导航的 top 偏移错位。 */
.header-action > a,
.header-action > button {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  padding-inline: 0.5rem;
  margin-block: -0.5rem;
  margin-inline-end: -0.5rem;
  border-radius: 0.75rem;
  color: rgb(71 85 105); /* slate-600，统一并提升对比度 */
  transition: background-color 0.15s ease;
}

.header-action > a:active,
.header-action > button:active {
  background-color: rgb(241 245 249); /* slate-100 */
}

/* 锚点目标预留吸顶高度：深链跳转（scrollIntoView / :target）时
   不被吸顶头(49px) + 分区导航(~41px) 遮挡。scroll-margin 作用于被滚动到的元素，
   比 html 上的 scroll-padding 更可靠。 */
.tab-panel {
  scroll-margin-top: 104px;
}

/* 横向滚动的胶囊导航：隐藏滚动条，保留滑动 */
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

/* 原生 range 滑块统一视觉（移动端友好） */
input[type="range"] {
  accent-color: #0f172a;
  height: 1.75rem;
}

/* 隐藏搜索框原生的清除按钮，改用统一的 × 图标，避免各浏览器样式不一 */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

/* HTMX 请求指示器：默认隐藏，请求期间淡入 */
.htmx-indicator {
  opacity: 0;
  transition: opacity 0.15s ease;
}

.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
  opacity: 1;
}