/* ===========================================================
   克隆补充样式（原站由 Tailwind 预编译产物驱动，此文件只补交互态）
   =========================================================== */

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* 交互态隐藏（不依赖 Tailwind 的 hidden 类） */
.clone-hidden { display: none !important; }

/* 遮罩层：盖住页面但不盖弹窗（弹窗自身是 z-50） */
.clone-overlay {
  position: fixed;
  inset: 0;
  z-index: 49;
  background: rgba(0, 0, 0, .8);
  animation: clone-fade .2s ease-out;
}
@keyframes clone-fade { from { opacity: 0; } to { opacity: 1; } }

/* 弹窗内的滚动手感与原站一致 */
.clone-dialog [role="dialog"] { scrollbar-width: thin; }

/* 表单错误提示 */
.clone-field-error {
  color: #dc2626;
  font-size: 12px;
  margin-top: 4px;
}
.clone-input-invalid {
  border-color: #dc2626 !important;
  box-shadow: 0 0 0 1px #dc2626 !important;
}

/* 移动端菜单在克隆版里的层级 */
.clone-sheet { z-index: 50; }

/* 锚点定位时避开固定头部 */
section[id] { scroll-margin-top: 80px; }

/* 本地演示提示条（仅克隆版，可删） */
.clone-demo-bar {
  position: fixed;
  left: 50%;
  bottom: 16px;
  transform: translateX(-50%);
  z-index: 45;
  background: rgba(17, 24, 39, .92);
  color: #fff;
  font-size: 12px;
  line-height: 1.5;
  padding: 8px 14px;
  border-radius: 999px;
  max-width: calc(100% - 24px);
  text-align: center;
  pointer-events: none;
}
@media (max-width: 640px) {
  .clone-demo-bar { font-size: 11px; padding: 6px 10px; }
}

/* ── 被冻结的入场动画：用纯 CSS 重放，保证不改 layout 也不依赖 JS ──
   只动 opacity 与 translate 两个属性，不碰 transform，
   避免覆盖卡片自身的 hover:-translate-y-1。 */
@media (prefers-reduced-motion: no-preference) {
  [data-reveal-fixed] {
    animation: clone-card-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  [data-reveal-fixed]:nth-child(2) { animation-delay: 0.08s; }
  [data-reveal-fixed]:nth-child(3) { animation-delay: 0.16s; }
  [data-reveal-fixed]:nth-child(4) { animation-delay: 0.24s; }
}
@keyframes clone-card-in {
  from { opacity: 0; translate: 0 24px; }
  to   { opacity: 1; translate: 0 0; }
}

/* 搜索页：移动端输入框高度（flex-col 下 flex-1 会把高度压成内容高度） */
.search-page .search-form input[type="search"]{flex:1 1 auto;min-width:0;height:48px}
.search-page .search-form button{height:48px;flex:0 0 auto}
@media (max-width:767px){.search-page{padding-bottom:88px}}
