/* =====================================================================
   苹果风全局层（apple-ui.css） —— 唯一真源
   ---------------------------------------------------------------------
   定位：① 设计令牌库（全站唯一取值来源，后续改造都从这里取）
         ② 无障碍修复（键盘焦点可见）
         ③ 通用质感增强（字体平滑 / 等宽数字 / 缓动 / 按压）
   原则：令牌只「新增」，不改各页面已有的颜色与布局；
         会改变像素的只有「键盘焦点」一项，且鼠标操作完全不受影响。
   基准：Apple HIG —— 主蓝 #007AFF / 近黑 #1D1D1F / 次文字 #6E6E73 / 画布 #F5F5F7
   建于 2026-09-26（S 档）。改这里 ⇒ 全站 33 页同时生效。
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. 设计令牌（Design Tokens）
   改一个值 = 全站统一。新代码一律用令牌，不要再写死具体数值。
   --------------------------------------------------------------------- */
:root{
  /* 主色族（Apple System Blue） */
  --brand:        #007AFF;   /* 主色 */
  --brand-strong: #0062CC;   /* 渐变深端 / hover 加深 */
  --brand-soft:   #E8F1FF;   /* 浅底（选中态 / 标签底） */
  --brand-ring:   rgba(0,122,255,.18);  /* 焦点光晕 */

  /* 语义色（Apple System Colors）—— 少数页面的非苹果取值已收敛到此 */
  --danger:  #FF3B30;   --danger-soft:  #FDECEC;
  --success: #34C759;   --success-soft: #E8F7EE;
  --warn:    #FF9500;   --warn-soft:    #FDF3E1;
  --info:    #007AFF;
  --purple:  #AF52DE;   /* 原 #8B5CF6（Tailwind violet） */
  --indigo:  #5856D6;   /* 原 #7C3AED / #534AB7 / #4338CA（Tailwind indigo） */

  /* 中性色 */
  --ink:    #1D1D1F;   /* 正文近黑 */
  --ink-2:  #6E6E73;   /* 次要文字（原 #64748B / #94A3B8 收敛至此） */
  --ink-3:  #8E8E93;   /* 弱化文字 / 占位 */
  --line:   #E6E8EB;   /* 分隔线 / 边框 */
  --canvas: #F5F5F7;   /* 画布灰 */
  --surface:#FFFFFF;   /* 卡片白 */

  /* 圆角 —— 5 级阶梯（苹果量级） */
  --r-xs:   6px;
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   16px;
  --r-pill: 999px;

  /* 阴影 —— 4 级层级（苹果量级） */
  --sh-1: 0 1px 2px rgba(0,0,0,.04);
  --sh-2: 0 2px 8px rgba(0,0,0,.06);
  --sh-3: 0 6px 20px rgba(0,0,0,.08);
  --sh-4: 0 12px 32px rgba(0,0,0,.12);

  /* 字号 —— 9 级阶梯（半像素 11.5/12.5/13.5 不再使用） */
  --fs-11: 11px;  --fs-12: 12px;  --fs-13: 13px;
  --fs-14: 14px;  --fs-15: 15px;  --fs-17: 17px;
  --fs-20: 20px;  --fs-24: 24px;  --fs-28: 28px;

  /* 字体粗细 —— 3 档（正文 400 / 强调 600 / 标题 700） */
  --fw-normal: 400;
  --fw-medium: 600;
  --fw-bold:   700;

  /* 动效 —— 3 级时长 + 统一缓动 */
  --dur-fast: .15s;
  --dur:      .2s;
  --dur-slow: .3s;
  --ease: cubic-bezier(.4,0,.2,1);       /* 通用（进出手感均衡） */
  --ease-out: cubic-bezier(0,0,.2,1);    /* 进场 / 展开 */
}

/* ---------------------------------------------------------------------
   2. 键盘焦点可见（无障碍修复）
   背景：全站 116 处 outline:none 让键盘用户「Tab 走一遍看不见焦点」。
   做法：鼠标操作完全不显示（:focus-visible 的语义），键盘操作显示苹果焦点环。
   必须 !important：历史写法有 107 种不同特异性，只有这样才能真正盖住。
   --------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
summary:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible{
  outline: 2px solid var(--brand) !important;
  outline-offset: 2px !important;
}

/* 文本输入类：苹果式聚焦（边框变蓝 + 淡蓝光晕），与系统控件观感一致 */
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus-visible,
textarea:focus-visible,
select:focus-visible{
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px var(--brand-ring) !important;
  outline: none !important;
}

/* 复选框 / 单选：外环即可，不加光晕 */
input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible{
  outline: 2px solid var(--brand) !important;
  outline-offset: 2px !important;
}

/* ---------------------------------------------------------------------
   3. 字体渲染质感（苹果质感的关键细节）
   --------------------------------------------------------------------- */
*{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body{
  font-variant-numeric: tabular-nums;   /* 数字等宽，表格列对齐 */
  font-feature-settings: "tnum" 1;
  text-rendering: optimizeLegibility;
}

/* ---------------------------------------------------------------------
   4. 统一动效（替换默认生硬缓动；颜色布局不变）
   --------------------------------------------------------------------- */
button, .btn, .btn-primary, .btn-ghost, .btn-nav-ghost,
.mod-card, a.card, .chip, .stats-tab, .range-tabs button{
  transition: all var(--dur) var(--ease);
}

/* 卡片 hover 微抬升（苹果轻盈感） */
.mod-card:hover{
  transform: translateY(-2px);
  box-shadow: var(--sh-3);
}

/* 按钮按压手感 */
button:active, .btn:active, .btn-primary:active,
.btn-ghost:active, .btn-nav-ghost:active{
  transform: scale(.97);
}

/* ---------------------------------------------------------------------
   5. 无障碍：尊重系统「减弱动态效果」
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    transition: none !important;
    animation: none !important;
  }
}
