/* ============================================================
   base.css · 字体、重置、基础排版、工具类、无障碍
   ============================================================ */

/* 指定字体：Space Grotesk（拉丁）+ Noto Sans SC（简体中文）
   字体文件已本地化，预览无需联网，也不依赖任何外部视觉素材。 */
@font-face {
  font-family: "Space Grotesk";
  src: url("../fonts/space-grotesk-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Space Grotesk";
  src: url("../fonts/space-grotesk-500.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Noto Sans SC";
  src: url("../fonts/noto-sans-sc-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+2E80-2FFF, U+3000-303F, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF, U+FF00-FFEF;
}
@font-face {
  font-family: "Noto Sans SC";
  src: url("../fonts/noto-sans-sc-500.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
  unicode-range: U+2E80-2FFF, U+3000-303F, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF, U+FF00-FFEF;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html.menu-open, html.player-open { overflow: hidden; }

body {
  margin: 0;
  background: var(--c-paper);
  color: var(--c-ink);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, p, figure, blockquote { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
img, video { display: block; max-width: 100%; }
[hidden] { display: none !important; }

::selection { background: var(--c-feedback); color: var(--c-paper); }
:focus-visible { outline: 2px solid var(--c-feedback); outline-offset: 4px; }

/* 排版工具 */
.u-mono {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: .12em;
  line-height: 1.5;
  text-transform: uppercase;
}
.u-mid   { color: var(--c-mid); }
.u-small { font-size: var(--fs-small); line-height: 1.7; }
.u-h2    { font-size: var(--fs-h2); font-weight: 500; line-height: 1.1; letter-spacing: -.025em; }
.u-h3    { font-size: var(--fs-h3); font-weight: 500; line-height: 1.3; letter-spacing: -.01em; }

.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* 交互反馈规范（本轮修订）：
   链接 hover 下划线 / 卡片 hover 播放态 / 焦点框 → 近黑 --c-feedback；
   播放按钮 → 页面底色 --c-play。全站不再使用彩色强调色。 */
.link-feedback { position: relative; display: inline-block; }
.link-feedback::after {
  content: ""; position: absolute; left: 0; bottom: -.14em;
  width: 100%; height: 1px; background: var(--c-feedback);
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--dur-s) var(--ease);
}
.link-feedback:hover::after,
.link-feedback:focus-visible::after,
.link-feedback.is-current::after { transform: scaleX(1); }

/* ---------- 首屏进入：仅透明度淡入，无位移 ----------
   由 reveal.js 的 initIntro() 在 DOM 就绪后加 .is-intro 并写入 --intro-delay。
   backwards 只在延迟期与动画期生效；动画结束、或 JS 超时移除类名后，
   元素回到自然 opacity:1 —— 即使帧循环被节流也不会停在半透明。 */
.is-intro {
  animation: intro-fade .32s var(--ease) backwards;
  animation-delay: var(--intro-delay, 0s);
}
@keyframes intro-fade { from { opacity: 0 } to { opacity: 1 } }

/* 尊重系统减弱动效偏好：动效模块会在 JS 中同步跳过 */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .is-intro { animation: none; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}