/* ============================================================================
   菩澜渡 WisFerry · 节奏与动效层（ux.css）
   执笔：李诫 2026-10-03 ｜ 状态：v1.0.0
   定位：**纯增量**样式层 —— 只新增选择器与行为，不覆盖任何页面私有规则。
        目标 = 坤谦 2026-10-03 验收标准："舒适自然 + 有往下继续看的冲动和欲望"。
   引入：`<link rel="stylesheet" href="/css/ux.css">`，串在 tokens.css 之后、
         页面私有 <style> 之前。
   降级：无 JS / 系统减少动效 / IntersectionObserver 缺失 → 内容一律完整可见。
   ============================================================================ */

/* ── 1 滚动显现（核心：制造"往下看"的节拍） ─────────────────────────────
   安全纪律：`html.ds-ready` 由 js/ux.js 在 head 内同步加入；JS 失败则**不加**，
   于是本段全部失效、内容照常可见（永不出现"白屏/看不见内容"）。
   首屏 hero 不参与（避免照片闪动）。 */
html.ds-ready section:not(.hero){
  opacity:0;
  transform:translateY(var(--reveal-shift));
  transition:opacity var(--dur-slow) var(--ease-out),
             transform var(--dur-slow) var(--ease-out);
  will-change:opacity,transform;
}
html.ds-ready section:not(.hero).ds-in{
  opacity:1;
  transform:none;
  will-change:auto;
}

/* ── 2 首屏滚动提示（"往下看"） ───────────────────────────────────────── */
.scroll-cue{
  position:absolute;left:50%;bottom:22px;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  font-size:var(--fs-note);letter-spacing:var(--ls-kicker);
  color:rgba(255,255,255,.78);z-index:2;text-decoration:none;
  transition:color var(--dur-base) var(--ease-out);
}
.scroll-cue:hover{color:#fff}
.scroll-cue i{
  display:block;width:1px;height:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,0));
  animation:ds-cue 2s var(--ease-out) infinite;
}
@keyframes ds-cue{
  0%{transform:translateY(-8px);opacity:0}
  35%{opacity:1}
  100%{transform:translateY(10px);opacity:0}
}

/* ── 3 滚动与焦点 ─────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:no-preference){
  html{scroll-behavior:smooth}
}
html{scroll-padding-top:76px}               /* 锚点跳转时避开 sticky 导航 */
:focus-visible{
  outline:2px solid var(--c-brand);
  outline-offset:2px;
  border-radius:var(--radius-sm);
}
::selection{background:var(--c-tint);color:var(--c-ink)}

/* ── 4 移动端细节（"舒适自然"的手感） ────────────────────────────────── */
html{-webkit-text-size-adjust:100%}
button,a{-webkit-tap-highlight-color:rgba(139,110,78,.12)}
img{background:var(--c-tint)}              /* 图片未加载时不留白闪 */

/* ── 5 降级纪律 ─────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html.ds-ready section:not(.hero){
    opacity:1;transform:none;transition:none;
  }
  .scroll-cue i{animation:none}
}
