/*!
 * ============================================================================
 * 文件名称：agn.base.css
 * 所属模块：AgnBase / 基础样式层
 * 功能用途：提供统一的盒模型重置、替换元素规范化、焦点环、滚动条与动效降级，
 *           并把「排版基线」拆成独立的第二级开关，避免接入动作改动存量页排版。
 * 启用方式（两级开关，独立可加、通常一起加）：
 *   class="agn-page"  —— 结构层。实测对存量页零视觉变化（不设字号/行高/字族/配色）。
 *   class="agn-typo"  —— 排版基线层。统一字号/行高/字族/文字色/页面底色、标题段落
 *                        列表链接、表单控件字面继承。
 *                        自 2026-10-15 起，本层**所有选择器都以 :where() 包裹**，
 *                        特异度归零，因此是**纯兜底层**：只在页面自身未定义处生效，
 *                        任何页面规则（哪怕是 .btn 这类单类选择器、乃至裸元素选择器）
 *                        都能压过它。故存量页启用后的可观测变化被压缩到仅剩
 *                        「页面没写过的元素从基线继承字号/行高/字色/字族」一处。
 * 加在哪：加在 <html> 或承载页面的根容器上。未加该类的页面完全不受影响（零回归）。
 * 链接顺序：本文件仍应置于页面内联 <style> **之前**（项目既定约定）。:where() 已使
 *           本层不再参与特异度竞争，位置不再是正确性的前提，但保持在前可让页面原有
 *           样式始终胜出，也使「删除页面声明后基线接管」的行为保持可预期。
 * 依赖关系：需先引入 agn.tokens.css（消费 --agn-* 令牌）
 * 创建时间：2026-10-14
 * 修改记录：
 *   2026-10-14  初版（评审建议 §5.4 第 2 期：reset + 排版 + 滚动条）
 *   2026-10-15  拆分启用开关：原 .agn-page 一揽子规则中「会改存量页渲染」的排版与
 *               字面规则（font-family/font-size/line-height/color/background、标题、
 *               段落、列表、链接、hr、code/pre、表单控件 font:inherit、::placeholder）
 *               全部迁移到 .agn-typo；.agn-page 只保留结构层。
 *               起因：试点页实测 —— 仅加 .agn-page 时，main.page 内 49 个元素中有
 *               46 个（93.9%）的字号或行高变化、页面高度 +28px。接入阶段应当零差异，
 *               排版基线属于「替换内联样式」阶段的既定目标，不应混在同一步。
 *   2026-10-15  滚动条规则改为仅显式选用类 .agn-scroll：原 .agn-page ::-webkit-scrollbar
 *               系列特异度 (0,1,0) 高于站点既有的 *::-webkit-scrollbar-thumb (0,0,0)，
 *               实测会把滚动条由「青绿 rgba(0,202,224,0.22) / 圆角 4px」覆盖为
 *               「白 15% / 圆角 999px」，是可观测的接入期视觉变化，故移除 .agn-page 侧
 *               选择器。此后 .agn-page 单独启用，除 :focus-visible 无障碍焦点环外，
 *               box-sizing 与 textarea resize 均与站内既有样式逐项一致。
 *   2026-10-15  移除 .agn-page img { height: auto }：向存量页推广时实测发现，该规则
 *               特异度 (0,1,1) 会静默压过 .ag-captcha-img{width:104px;height:42px}
 *               （0,1,0，由 auth.js 运行时注入），使验证码图高度由 42px 变 auto——
 *               这是接入阶段唯一「行为级」差异（其余 img/svg 的 display/max-width
 *               差异经四页实测 bounding box 前后完全一致、文档高度不变，属零影响）。
 *               结构层应保持零影响，故移除 height:auto，仅保留 display/max-width。
 *   2026-10-15  移除 .agn-page / .agn-page * { box-sizing: border-box }：向全站剩余
 *               页面推广时实测发现，drama / privacy / terms 三页是站内唯一未声明
 *               *{box-sizing:border-box} 的页面，该规则会让 drama.html 的 283 个元素
 *               box-sizing 由 content-box 变 border-box、36 个元素 bounding box 位移、
 *               文档高度 1030→1009。结构层须对存量页免疫，故移除该规则；
 *               此后 .agn-page 单独启用仅剩「替换元素 display/max-width 规范化 +
 *               :focus-visible 焦点环 + 动效降级」，实测对存量页 bounding box 零位移。
 *   2026-10-15  .agn-typo 全部选择器改为 :where() 包裹、特异度归零（纯兜底层）：
 *               试点实测发现原写法（如 .agn-typo button，特异度 (0,1,1)）会压过页面
 *               自带的单类选择器 —— text-to-video.html 的 .btn(0,1,0) / .btn-gold(0,1,0)
 *               所声明的 font-size:13px / font-weight:500 / font-weight:600 被「font: inherit」
 *               重置为继承值（14px / 400），实测 11 个元素字重反向变化；而 agn.ui.css 的
 *               .agn-btn / .agn-input 等组件尚未被页面采纳，没有任何规则接管被重置的
 *               属性 → 净回归。与结构层两次同类问题（box-sizing 重置、img{height:auto}
 *               压过验证码固定高）处理原则一致：基线层须对存量页免疫。
 *               改后本层不再参与特异度竞争，只在页面未定义处生效。
 * ============================================================================
 */

/* ==========================================================================
   1. 结构层 · 盒模型（刻意不做重置）
   2026-10-15 移除 .agn-page / .agn-page * { box-sizing: border-box }：
     该规则特异度 (0,1,0) 高于页面自带的 *{box-sizing:border-box}(0,0,0)，
     对已声明该约定的页面属空操作；但 drama / privacy / terms 三页是全站唯一
     未声明盒模型重置的页面——实测 drama.html 312 个元素中 283 个由 content-box
     变 border-box，36 个元素 bounding box 位移、文档高度 1030→1009（-21px），
     属接入期可观测的视觉变化。结构层须对存量页免疫（同 img{height:auto} 的处理），
     故整块移除；盒模型规范化留到「替换页面内联样式」阶段随 .agn-typo 逐页启用。
   ========================================================================== */

/* 结构层刻意不设任何字面属性：字号 / 行高 / 字族 / 配色 / 盒模型一律留给 .agn-typo 与页面自身样式 */

html.agn-page,
html.agn-page > body { min-height: 100%; }

/* ==========================================================================
   2. 结构层 · 替换元素与表单规范化
   ========================================================================== */
.agn-page img,
.agn-page svg,
.agn-page video,
.agn-page canvas { display: block; max-width: 100%; }
/* 刻意不设 img{height:auto}：它会压过页面给图片设定的固定高度（如 auth.js 注入的
   .ag-captcha-img{height:42px}），属接入期的行为变化，非结构层职责。 */

.agn-page textarea { resize: vertical; }
.agn-page [hidden] { display: none !important; }

/* 统一键盘可达焦点环（鼠标点击不触发，避免视觉噪音） */
.agn-page :focus-visible {
  outline: 2px solid var(--agn-border-active);
  outline-offset: 2px;
}

/* ==========================================================================
   3. 结构层 · 滚动条（显式选用）
   —— 刻意**不**作用于 .agn-page：本站 tech-theme.css 已有全局
      `*::-webkit-scrollbar-thumb`（青绿 rgba(0,202,224,0.22)、圆角 4px）。
      若让 .agn-page 再声明一份，会因特异度更高（0,1,0 vs 0,0,0）覆盖站点既有滚动条，
      实测表现即为"接入后滚动条变色/改圆角"——这是可观测的视觉变化。
      故此处只保留显式选用类 .agn-scroll，未加该类的页面滚动条保持原样。
   ========================================================================== */
.agn-scroll { scrollbar-width: thin; scrollbar-color: var(--agn-border-strong) transparent; }

.agn-scroll::-webkit-scrollbar { width: 8px; height: 8px; }
.agn-scroll::-webkit-scrollbar-track { background: transparent; }
.agn-scroll::-webkit-scrollbar-thumb {
  background: var(--agn-border-strong);
  border-radius: var(--agn-r-full);
}
.agn-scroll::-webkit-scrollbar-thumb:hover { background: var(--agn-text-3); }
.agn-scroll::-webkit-scrollbar-corner { background: transparent; }

/* ==========================================================================
   4. 结构层 · 动效降级（尊重系统「减少动态效果」偏好）
   仅当用户系统开启该偏好时生效；这是刻意保留的无障碍降级，不是回归。
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .agn-page *,
  .agn-page *::before,
  .agn-page *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ==========================================================================
   5. 排版基线层（.agn-typo）
   —— 以下规则统一字号/行高/字族/字面颜色与页面底色。**所有选择器均以 :where()
      包裹，特异度归零**，故本层是纯兜底层：只在页面自身未定义处生效，任何页面规则
      （哪怕是 .btn 这类单类选择器、乃至裸元素选择器）都能压过它。
      2026-10-15 之前为普通选择器 (0,1,1)，曾压过页面单类选择器导致净回归
      （表单控件 font:inherit 重置了按钮的字号与字重），详见文件头「修改记录」。
   ========================================================================== */
:where(.agn-typo) {
  font-family: var(--agn-font);
  font-size: var(--agn-fs-base);
  line-height: 1.6;
  color: var(--agn-text-1);
  background: var(--agn-canvas);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* --- 标题与段落 --- */
:where(.agn-typo) :where(h1, h2, h3, h4, h5, h6) {
  margin: 0;
  font-weight: 600;
  line-height: 1.3;
  color: var(--agn-text-1);
}
:where(.agn-typo) :where(h1) { font-size: var(--agn-fs-hero); }
:where(.agn-typo) :where(h2) { font-size: var(--agn-fs-xl); }
:where(.agn-typo) :where(h3) { font-size: var(--agn-fs-lg); }
:where(.agn-typo) :where(h4) { font-size: var(--agn-fs-md); }

:where(.agn-typo) :where(p) { margin: 0; }
:where(.agn-typo) :where(small) { font-size: var(--agn-fs-sm); color: var(--agn-text-3); }
:where(.agn-typo) :where(strong, b) { font-weight: 600; }

/* --- 链接 --- */
:where(.agn-typo) :where(a) {
  color: var(--agn-accent);
  text-decoration: none;
  transition: color var(--agn-t-fast) var(--agn-ease);
}
:where(.agn-typo) :where(a:hover) { color: var(--agn-accent-hover); }

/* --- 列表 --- */
:where(.agn-typo) :where(ul, ol) { margin: 0; padding-left: 1.4em; }
:where(.agn-typo) :where(li) { margin: 0; }

/* --- 分隔线与代码 --- */
:where(.agn-typo) :where(hr) {
  height: 0;
  margin: var(--agn-sp-4) 0;
  border: 0;
  border-top: 1px solid var(--agn-border);
}

:where(.agn-typo) :where(code, pre, kbd) { font-family: var(--agn-font-mono); font-size: 0.95em; }
:where(.agn-typo) :where(pre) { margin: 0; overflow-x: auto; }

/* --- 表单控件字面继承 --- */
:where(.agn-typo) :where(button, input, select, textarea) {
  font: inherit;
  color: inherit;
  margin: 0;
}

:where(.agn-typo) ::placeholder { color: var(--agn-text-muted); opacity: 1; }

/* ==========================================================================
   6. 排版工具类（少量、通用；按类名显式选用，未选用者零影响）
   ========================================================================== */
.agn-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.agn-sr-only {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}