/* ==========================================================================
   爱刷刷 · Apple Design System  v2.0
   --------------------------------------------------------------------------
   风格：iOS / macOS 原生质感
   要素：Liquid Glass 材质 · Spring 物理动画 · 多层柔和阴影 ·
        SF Symbols 图标 · 连续圆角 · 微妙渐变
   原则：只覆盖视觉属性，绝不修改布局骨架
   ========================================================================== */

/* ==========================================================================
   ① Apple 系统设计令牌
   ========================================================================== */

:root {
  /* ── iOS 系统色（Apple HIG 官方值）────────────────────────── */
  --ios-blue:   #007AFF;
  --ios-green:  #34C759;
  --ios-indigo: #5856D6;
  --ios-orange: #FF9500;
  --ios-pink:   #FF2D55;
  --ios-purple: #AF52DE;
  --ios-red:    #FF3B30;
  --ios-teal:   #5AC8FA;
  --ios-yellow: #FFCC00;

  /* 品牌色（Apple 蓝 + 渐变搭档）*/
  --brand:  #007AFF;
  --brand2: #0A84FF;
  --brand3: #5AC8FA;
  --grad: linear-gradient(135deg, #007AFF 0%, #5AC8FA 100%);
  --grad-soft: linear-gradient(135deg, #F0F7FF 0%, #F5FAFF 100%);

  /* ── iOS Label 层级（文字）────────────────────────────────── */
  --label:            #000000;
  --label-2:          rgba(60, 60, 67, .60);
  --label-3:          rgba(60, 60, 67, .30);
  --label-4:          rgba(60, 60, 67, .18);

  --ink:  #1C1C1E;
  --ink2: #3C3C43;
  --ink3: #8E8E93;

  /* ── iOS Background 层级 ──────────────────────────────────── */
  --ios-bg:            #F2F2F7;   /* systemGroupedBackground */
  --ios-bg-elevated:   #FFFFFF;   /* secondarySystemGrouped */
  --card:              #FFFFFF;
  --card-2:            #F2F2F7;

  --fill:              rgba(120, 120, 128, .12);
  --fill-2:            rgba(120, 120, 128, .16);
  --fill-3:            rgba(120, 120, 128, .08);

  --sep:               rgba(60, 60, 67, .12);
  --sep-opaque:        #E5E5EA;
  --line:              rgba(60, 60, 67, .12);

  --bg: #F2F2F7;

  /* ── iOS 材质（Liquid Glass）─────────────────────────────── */
  --mat-ultra-thin: rgba(255, 255, 255, .44);
  --mat-thin:       rgba(255, 255, 255, .60);
  --mat-regular:    rgba(255, 255, 255, .72);
  --mat-thick:      rgba(255, 255, 255, .84);
  --mat-chrome:     rgba(249, 249, 249, .82);

  /* 模糊半径 */
  --blur-sm: saturate(180%) blur(12px);
  --blur:    saturate(180%) blur(20px);
  --blur-lg: saturate(200%) blur(30px);

  /* ── iOS 阴影（多层柔和扩散，非硬边）────────────────────── */
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, .04), 0 1px 3px rgba(0, 0, 0, .04);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .04), 0 2px 6px rgba(0, 0, 0, .04);
  --shadow:    0 1px 2px rgba(0, 0, 0, .04), 0 4px 10px rgba(0, 0, 0, .05),
               0 10px 20px rgba(0, 0, 0, .04);
  --shadow-md: 0 2px 4px rgba(0, 0, 0, .04), 0 6px 14px rgba(0, 0, 0, .05),
               0 16px 28px rgba(0, 0, 0, .05);
  --shadow-lg: 0 2px 6px rgba(0, 0, 0, .04), 0 10px 22px rgba(0, 0, 0, .06),
               0 24px 44px rgba(0, 0, 0, .06);
  --shadow-xl: 0 4px 10px rgba(0, 0, 0, .05), 0 16px 32px rgba(0, 0, 0, .07),
               0 36px 64px rgba(0, 0, 0, .08);

  /* 内高光（模拟光线打在材质边缘）*/
  --inset-hl: inset 0 1px 0 rgba(255, 255, 255, .72);
  --inset-hl-strong: inset 0 1.5px 0 rgba(255, 255, 255, .92);

  /* 聚焦环（Apple 蓝）*/
  --ring: 0 0 0 3.5px rgba(0, 122, 255, .16);
  --ring-error: 0 0 0 3.5px rgba(255, 59, 48, .16);

  /* ── 连续圆角（iOS squircle 近似）────────────────────────── */
  --r-xs:   6px;
  --r-sm:   8px;
  --r:     10px;
  --r-md:  12px;
  --r-lg:  14px;
  --r-xl:  18px;
  --r-2xl: 22px;
  --r-3xl: 28px;
  --r-full: 9999px;

  /* ── 间距（4pt 网格）──────────────────────────────────────── */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;

  /* ── 字体（SF Pro 优先）───────────────────────────────────── */
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display",
          "Helvetica Neue", "PingFang SC", "Hiragino Sans GB",
          "Microsoft YaHei", sans-serif;
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;

  /* ── Spring 物理动画（iOS 核心）──────────────────────────── */
  --spring:       cubic-bezier(.34, 1.56, .64, 1);   /* 弹性回弹 */
  --spring-soft:  cubic-bezier(.25, 1, .5, 1);       /* 柔和减速 */
  --spring-snappy: cubic-bezier(.2, .9, .3, 1);      /* 干脆 */
  --ease-ios:     cubic-bezier(.42, 0, .58, 1);      /* 标准 */

  --t-instant: 100ms;
  --t-fast:    160ms;
  --t-base:    240ms;
  --t-slow:    360ms;
  --t-spring:  500ms;

  /* ── 语义色 ───────────────────────────────────────────────── */
  --ok:   #34C759;
  --err:  #FF3B30;
  --warn: #FF9500;
  --info: #007AFF;
  --warm: #FF9500;
  --mint: #5AC8FA;

  --glow:        rgba(0, 122, 255, .10);
  --glow-soft:   rgba(0, 122, 255, .06);
  --glow-strong: rgba(0, 122, 255, .24);

  --chart-axis:  #8E8E93;
  --chart-split: rgba(60, 60, 67, .12);
  --chart-label: #3C3C43;
}

/* ── 暗色模式（iOS Dark Mode 官方值）──────────────────────────── */
[data-theme="dark"] {
  --label:   #FFFFFF;
  --label-2: rgba(235, 235, 245, .60);
  --label-3: rgba(235, 235, 245, .30);
  --label-4: rgba(235, 235, 245, .18);

  --ink:  #FFFFFF;
  --ink2: #EBEBF5;
  --ink3: #8E8E93;

  --ios-bg:          #000000;
  --ios-bg-elevated: #1C1C1E;
  --card:            #1C1C1E;
  --card-2:          #2C2C2E;

  --fill:   rgba(120, 120, 128, .24);
  --fill-2: rgba(120, 120, 128, .32);
  --fill-3: rgba(120, 120, 128, .16);

  --sep:        rgba(84, 84, 88, .36);
  --sep-opaque: #38383A;
  --line:       rgba(84, 84, 88, .36);

  --bg: #000000;

  /* 暗色材质 */
  --mat-ultra-thin: rgba(30, 30, 32, .44);
  --mat-thin:       rgba(30, 30, 32, .60);
  --mat-regular:    rgba(30, 30, 32, .72);
  --mat-thick:      rgba(30, 30, 32, .84);
  --mat-chrome:     rgba(22, 22, 24, .82);

  /* 暗色阴影 + 内高光 */
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, .32);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .32), 0 2px 6px rgba(0, 0, 0, .32);
  --shadow:    0 1px 2px rgba(0, 0, 0, .36), 0 4px 10px rgba(0, 0, 0, .36),
               0 10px 20px rgba(0, 0, 0, .32);
  --shadow-md: 0 2px 4px rgba(0, 0, 0, .36), 0 6px 14px rgba(0, 0, 0, .36),
               0 16px 28px rgba(0, 0, 0, .36);
  --shadow-lg: 0 2px 6px rgba(0, 0, 0, .40), 0 10px 22px rgba(0, 0, 0, .40),
               0 24px 44px rgba(0, 0, 0, .40);
  --shadow-xl: 0 4px 10px rgba(0, 0, 0, .44), 0 16px 32px rgba(0, 0, 0, .44),
               0 36px 64px rgba(0, 0, 0, .48);

  --inset-hl: inset 0 1px 0 rgba(255, 255, 255, .06);
  --inset-hl-strong: inset 0 1.5px 0 rgba(255, 255, 255, .10);

  --ring: 0 0 0 3.5px rgba(10, 132, 255, .22);
  --ring-error: 0 0 0 3.5px rgba(255, 69, 58, .22);

  --brand:  #0A84FF;
  --brand2: #409CFF;
  --brand3: #64D2FF;
  --grad: linear-gradient(135deg, #0A84FF 0%, #64D2FF 100%);
  --grad-soft: linear-gradient(135deg, #0A1F33 0%, #0D2438 100%);

  --ok:   #30D158;
  --err:  #FF453A;
  --warn: #FF9F0A;
  --info: #0A84FF;

  --glow:        rgba(10, 132, 255, .16);
  --glow-soft:   rgba(10, 132, 255, .10);
  --glow-strong: rgba(10, 132, 255, .32);

  --chart-axis:  #8E8E93;
  --chart-split: rgba(84, 84, 88, .36);
  --chart-label: #EBEBF5;
}

/* ==========================================================================
   ② 全局基础 — iOS 质感
   ========================================================================== */

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html {
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--sans);
  color: var(--ink);
  /* iOS 微妙渐变背景（多点径向，营造光感）*/
  background:
    radial-gradient(1200px 700px at 12% -8%, rgba(0, 122, 255, .055) 0%, transparent 55%),
    radial-gradient(1000px 600px at 92% 4%, rgba(175, 82, 222, .045) 0%, transparent 55%),
    radial-gradient(900px 700px at 50% 108%, rgba(90, 200, 250, .04) 0%, transparent 60%),
    var(--ios-bg) !important;
  background-attachment: fixed !important;
  line-height: 1.56;
  letter-spacing: -0.011em;
  overflow-x: hidden;
  -webkit-user-select: none;
  user-select: none;
}

[data-theme="dark"] body {
  background:
    radial-gradient(1200px 700px at 12% -8%, rgba(10, 132, 255, .07) 0%, transparent 55%),
    radial-gradient(1000px 600px at 92% 4%, rgba(175, 82, 222, .05) 0%, transparent 55%),
    var(--ios-bg) !important;
  background-attachment: fixed !important;
}

/* iOS 标题排版 */
h1, h2, h3, h4, h5, h6 {
  color: var(--ink);
  letter-spacing: -0.022em;
  font-weight: 600;
  line-height: 1.25;
}
h1 { font-size: 28px; font-weight: 700; letter-spacing: -0.028em; }
h2 { font-size: 22px; font-weight: 700; letter-spacing: -0.026em; }
h3 { font-size: 18px; letter-spacing: -0.022em; }

input, textarea, [contenteditable="true"] { -webkit-user-select: text; user-select: text; }

#app { min-height: 100%; }

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
  color: inherit;
  letter-spacing: inherit;
}

input, textarea, select { font-family: inherit; font-size: 16px; color: var(--ink); outline: none; }

a { color: inherit; text-decoration: none; }

/* iOS 滚动条（极细、半透明）*/
::-webkit-scrollbar { width: 7px; height: 7px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(60, 60, 67, .22);
  border-radius: var(--r-full);
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: rgba(60, 60, 67, .36); background-clip: content-box; }
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: rgba(235, 235, 245, .24); background-clip: content-box; }

/* ==========================================================================
   ③ 按钮 — iOS 胶囊 / 材质 / Spring 按压
   ========================================================================== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 12px 20px;
  border-radius: var(--r-md);
  font-size: 15.5px;
  font-weight: 590;               /* SF 的半粗，比 600 更柔和 */
  letter-spacing: -0.014em;
  white-space: nowrap;
  user-select: none;
  border: none;
  position: relative;
  isolation: isolate;
  -webkit-tap-highlight-color: transparent;
  transition:
    background-color var(--t-fast) var(--ease-ios),
    box-shadow var(--t-fast) var(--ease-ios),
    transform var(--t-fast) var(--spring),
    opacity var(--t-fast) var(--ease-ios),
    filter var(--t-fast) var(--ease-ios);
  /* Apple 按压：快速缩小 + 弹性回弹 */
  transform: scale(1);
  will-change: transform;
}

.btn:active {
  transform: scale(.965);
  transition-duration: 90ms;
}

/* 主按钮 — iOS 蓝 + 内高光 + 彩色光晕 */
.btn-primary {
  background: var(--brand);
  color: #fff;
  box-shadow:
    0 1px 2px rgba(0, 122, 255, .20),
    0 4px 12px rgba(0, 122, 255, .22),
    inset 0 1px 0 rgba(255, 255, 255, .22);
}
.btn-primary:hover {
  background: var(--brand2);
  box-shadow:
    0 2px 4px rgba(0, 122, 255, .22),
    0 8px 20px rgba(0, 122, 255, .28),
    inset 0 1px 0 rgba(255, 255, 255, .26);
}
.btn-primary:active { background: #0066D6; box-shadow: 0 1px 4px rgba(0, 122, 255, .24); }

/* 次级按钮 — 材质白 + 内高光 */
.btn-ghost {
  background: var(--card);
  color: var(--brand);
  box-shadow: var(--shadow-xs), var(--inset-hl);
}
.btn-ghost:hover { background: var(--card); box-shadow: var(--shadow-sm), var(--inset-hl); filter: brightness(.985); }
.btn-ghost:active { background: var(--fill-3); }

/* 灰色按钮 — iOS systemGray 风格 */
.btn-soft {
  background: var(--fill);
  color: var(--brand);
  box-shadow: none;
}
.btn-soft:hover { background: var(--fill-2); }
.btn-soft:active { background: rgba(120, 120, 128, .24); }

/* 危险 */
.btn-danger {
  background: var(--card);
  color: var(--ios-red);
  box-shadow: var(--shadow-xs), var(--inset-hl);
}
.btn-danger:hover { background: rgba(255, 59, 48, .06); }
.btn-danger:active { background: rgba(255, 59, 48, .12); }

/* 绿色 */
.btn-green {
  background: var(--ios-green);
  color: #fff;
  box-shadow:
    0 1px 2px rgba(52, 199, 89, .20),
    0 4px 12px rgba(52, 199, 89, .22),
    inset 0 1px 0 rgba(255, 255, 255, .22);
}
.btn-green:hover { filter: brightness(1.04); box-shadow: 0 6px 18px rgba(52, 199, 89, .28), inset 0 1px 0 rgba(255,255,255,.24); }
.btn-green:active { filter: brightness(.94); }

/* 分享 */
.btn-share {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 1px 2px rgba(0, 122, 255, .20), 0 4px 12px rgba(0, 122, 255, .22), inset 0 1px 0 rgba(255,255,255,.22);
}
.btn-share:hover { background: var(--brand2); }

/* 返回 */
.btn-back {
  background: var(--card);
  color: var(--brand);
  box-shadow: var(--shadow-xs), var(--inset-hl);
}
.btn-back:hover { filter: brightness(.985); }

/* 尺寸 */
.btn-sm { padding: 8px 14px; font-size: 14px; border-radius: var(--r); }
.btn-block { width: 100%; }

/* 禁用 */
.btn:disabled {
  background: var(--fill-3) !important;
  color: var(--label-3) !important;
  box-shadow: none !important;
  cursor: not-allowed;
  transform: none !important;
  filter: none !important;
}

/* 焦点环 */
.btn:focus-visible, button:focus-visible {
  outline: none;
  box-shadow: var(--ring);
}

/* ==========================================================================
   ④ 卡片 — iOS 材质 + 多层柔和阴影
   ========================================================================== */

.card {
  background: var(--card);
  border-radius: var(--r-2xl);
  box-shadow: var(--shadow-sm), var(--inset-hl);
  padding: 20px;
  border: none;
  transition: box-shadow var(--t-base) var(--ease-ios), transform var(--t-base) var(--spring);
}
[data-theme="dark"] .card { box-shadow: var(--shadow-sm), var(--inset-hl); }

.card-title {
  font-size: 17px;
  font-weight: 680;
  letter-spacing: -0.022em;
  color: var(--ink);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.card-sub, .cs-t { color: var(--ink3); font-size: 14px; }

/* 题目卡片 */
.quiz-card {
  background: var(--card);
  border-radius: var(--r-3xl);
  box-shadow: var(--shadow-md), var(--inset-hl);
  padding: 28px;
  border: none;
}
.quiz-card::before { display: none; }

/* 统计卡片 */
.stat-card {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  padding: 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  border: none;
  transition: box-shadow var(--t-base) var(--ease-ios), transform var(--t-base) var(--spring);
}
.stat-card:hover { box-shadow: var(--shadow-sm), var(--inset-hl); transform: translateY(-1px); }
.stat-card .si {
  border-radius: var(--r-md);
  box-shadow: none;
  /* iOS 图标容器：柔和渐变底 */
  background-image: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0));
}
.stat-card .sv {
  font-size: 27px;
  font-weight: 700;
  letter-spacing: -0.028em;
  color: var(--ink);
  line-height: 1.08;
  font-variant-numeric: tabular-nums;
}
.stat-card .sl { font-size: 13.5px; color: var(--ink3); margin-top: 2px; letter-spacing: -0.006em; }

/* 科目卡片 */
.subj-card {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  padding: 20px;
  border: none;
  transition: box-shadow var(--t-base) var(--ease-ios), transform var(--t-base) var(--spring);
}
.subj-card:hover { box-shadow: var(--shadow-md), var(--inset-hl); transform: translateY(-3px); }
.subj-card:active { transform: translateY(-1px) scale(.99); }
.subj-ico {
  border-radius: var(--r-md);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 2px 8px rgba(0, 0, 0, .10);
}
.subj-card h3 { font-size: 16.5px; font-weight: 640; letter-spacing: -0.02em; }
.subj-meta { color: var(--ink3); font-size: 13px; }
.subj-meta .sm-set { color: var(--brand); font-weight: 500; }
.subj-foot { border-top: 1px solid var(--sep); margin-top: 16px; padding-top: 14px; }
.subj-foot .go { color: var(--brand); font-weight: 590; font-size: 14px; }
.subj-cat {
  background: var(--fill);
  color: var(--ink2);
  border: none;
  box-shadow: none;
  font-weight: 500;
}
.subj-pin {
  background: var(--mat-thick);
  backdrop-filter: var(--blur-sm);
  -webkit-backdrop-filter: var(--blur-sm);
  border: none;
  box-shadow: var(--shadow-xs);
  border-radius: var(--r-sm);
}
.subj-pin:hover { box-shadow: var(--shadow-sm); }
.subj-pin.on { background: var(--brand); color: #fff; box-shadow: 0 2px 8px rgba(0,122,255,.28); }

/* ==========================================================================
   ⑤ 做题核心
   ========================================================================== */

.q-num {
  background: var(--fill);
  color: var(--ink2);
  border-radius: var(--r-full);
  box-shadow: none;
  font-weight: 560;
  font-size: 13.5px;
  font-variant-numeric: tabular-nums;
}

.q-stem {
  color: var(--ink);
  font-weight: 640;
  font-size: 18.5px;
  line-height: 1.62;
  letter-spacing: -0.019em;
}

/* 选项 — iOS 列表项质感 */
.opt {
  background: var(--card);
  border: none;
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  transition:
    background-color var(--t-fast) var(--ease-ios),
    box-shadow var(--t-fast) var(--ease-ios),
    transform var(--t-fast) var(--spring);
}
.opt:hover {
  background: var(--card);
  box-shadow: var(--shadow-sm), var(--inset-hl);
  transform: translateX(2px);
}
.opt:active { transform: translateX(2px) scale(.988); }

.opt .key {
  background: var(--fill);
  color: var(--ink2);
  border-radius: var(--r-sm);
  box-shadow: none;
  font-weight: 620;
  font-size: 14.5px;
}
.opt .txt { color: var(--ink); font-weight: 400; letter-spacing: -0.011em; }

/* 选中 — Apple 蓝 + 光晕 */
.opt.sel {
  background: rgba(0, 122, 255, .09);
  box-shadow:
    0 0 0 2px var(--brand),
    0 2px 10px rgba(0, 122, 255, .16),
    inset 0 1px 0 rgba(255, 255, 255, .5);
}
[data-theme="dark"] .opt.sel { background: rgba(10, 132, 255, .16); }
.opt.sel .key { background: var(--brand); color: #fff; box-shadow: 0 1px 4px rgba(0,122,255,.32); }

/* 正确 — 弹性脉冲 */
.opt.correct {
  background: rgba(52, 199, 89, .10);
  box-shadow: 0 0 0 2px var(--ios-green), 0 2px 10px rgba(52, 199, 89, .16);
  animation: ios-pop 400ms var(--spring);
}
[data-theme="dark"] .opt.correct { background: rgba(48, 209, 88, .16); }
.opt.correct .key { background: var(--ios-green); color: #fff; }

/* 错误 — 抖动 */
.opt.wrong {
  background: rgba(255, 59, 48, .09);
  box-shadow: 0 0 0 2px var(--ios-red), 0 2px 10px rgba(255, 59, 48, .14);
  animation: ios-shake 420ms var(--ease-ios);
}
[data-theme="dark"] .opt.wrong { background: rgba(255, 69, 58, .16); }
.opt.wrong .key { background: var(--ios-red); color: #fff; }

.opt.disabled { opacity: .58; }

/* 解析 */
.q-analysis {
  background: var(--fill-3);
  border: none;
  border-left: 3px solid var(--brand);
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--ink2);
  font-size: 14.5px;
  line-height: 1.68;
}
.q-analysis b { color: var(--brand); font-weight: 620; }

.recite-reveal {
  background: rgba(255, 149, 0, .08);
  border: none;
  box-shadow: inset 0 0 0 1px rgba(255, 149, 0, .22);
  border-radius: var(--r-xl);
}
.recite-reveal .q-analysis { background: var(--card); border-left-color: var(--ios-orange); }
.recite-reveal .q-analysis b { color: #C93400; }

/* 进度条 — iOS 纤细质感 */
.quiz-progress {
  background: var(--fill-2);
  border-radius: var(--r-full);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .04);
  height: 7px;
  overflow: hidden;
}
.quiz-progress .bar {
  background: var(--grad);
  border-radius: var(--r-full);
  box-shadow: 0 0 8px rgba(0, 122, 255, .32);
  transition: width 520ms var(--spring-soft);
}
.quiz-progress .bar::after { display: none; }

.quiz-count {
  background: transparent;
  color: var(--ink3);
  border-radius: 0;
  box-shadow: none;
  font-weight: 500;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.006em;
}

/* 模式标签 */
.mode-tag {
  border-radius: var(--r-sm);
  font-weight: 590;
  font-size: 12.5px;
  padding: 4px 10px;
  letter-spacing: -0.006em;
}
.mt-random { background: rgba(0, 122, 255, .12); color: var(--brand); box-shadow: none; }
.mt-wrong  { background: rgba(255, 59, 48, .12); color: #D70015; box-shadow: none; }
.mt-set    { background: var(--fill); color: var(--ink2); box-shadow: none; }
.mt-all    { background: var(--fill); color: var(--ink2); box-shadow: none; }
.mt-recite { background: rgba(255, 149, 0, .14); color: #C93400; box-shadow: none; }
[data-theme="dark"] .mt-wrong { color: #FF6961; }
[data-theme="dark"] .mt-recite { color: #FFB340; }

/* ==========================================================================
   ⑥ 表单 — iOS 输入质感
   ========================================================================== */

.input {
  background: var(--card);
  border: none;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  color: var(--ink);
  padding: 12px 15px;
  font-size: 15.5px;
  letter-spacing: -0.011em;
  transition: box-shadow var(--t-fast) var(--ease-ios), background-color var(--t-fast) var(--ease-ios);
}
.input::placeholder { color: var(--label-3); }
.input:hover { box-shadow: var(--shadow-sm), var(--inset-hl); }
.input:focus {
  background: var(--card);
  box-shadow: 0 0 0 2px var(--brand), var(--ring), var(--inset-hl);
}
.input:disabled {
  background: var(--fill-3);
  color: var(--label-3);
  box-shadow: none;
  cursor: not-allowed;
}
textarea.input { border-radius: var(--r-md); line-height: 1.6; }

.field label {
  display: block;
  font-size: 13.5px;
  font-weight: 560;
  color: var(--ink2);
  margin-bottom: 7px;
  letter-spacing: -0.006em;
}

/* 搜索框 */
.search-box {
  background: var(--fill);
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  transition: box-shadow var(--t-fast) var(--ease-ios), background-color var(--t-fast) var(--ease-ios);
}
.search-box:focus-within {
  background: var(--card);
  box-shadow: 0 0 0 2px var(--brand), var(--ring), var(--inset-hl);
}
.sb-input { background: transparent; color: var(--ink); font-size: 15px; }
.sb-input::placeholder { color: var(--label-3); }
.sb-ico { color: var(--label-3); }
.sb-clear { color: var(--label-3); }
.sb-clear:hover { color: var(--label-2); }

/* Chip */
.chip {
  background: var(--fill);
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--ink2);
  font-weight: 500;
  font-size: 14px;
  padding: 7px 14px;
  transition: all var(--t-fast) var(--ease-ios);
}
.chip:hover { background: var(--fill-2); color: var(--ink); }
.chip.active {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 2px 8px rgba(0, 122, 255, .24), inset 0 1px 0 rgba(255,255,255,.2);
}

/* 标签 */
.tag {
  background: var(--fill);
  color: var(--ink2);
  border-radius: var(--r-sm);
  box-shadow: none;
  font-weight: 500;
  font-size: 12.5px;
  padding: 3px 9px;
}

/* 分类筛选 */
.cat-chip {
  background: var(--fill);
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--ink2);
  font-weight: 500;
  font-size: 14px;
}
.cat-chip:hover { background: var(--fill-2); }
.cat-chip.on { background: var(--brand); color: #fff; box-shadow: 0 2px 8px rgba(0,122,255,.24); }

/* 分段控件 — iOS UISegmentedControl */
.seg {
  background: var(--fill);
  border-radius: var(--r);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .04);
  padding: 2px;
  gap: 2px;
}
.seg-btn {
  background: transparent;
  border-radius: var(--r-sm);
  color: var(--ink2);
  font-weight: 500;
  transition: all var(--t-fast) var(--ease-ios);
}
.seg-btn.on {
  background: var(--card);
  color: var(--ink);
  box-shadow: var(--shadow-xs), var(--inset-hl);
}

/* 开关 — iOS UISwitch */
.switch, .tool-switch {
  background: var(--fill-2) !important;
  border-radius: var(--r-full);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .06);
  transition: background-color var(--t-base) var(--spring-soft);
}
.switch.on, .tool-switch.on { background: var(--ios-green) !important; box-shadow: none; }
.switch-dot, .tool-switch-dot {
  background: #fff !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .18), 0 0 0 .5px rgba(0, 0, 0, .04);
  transition: transform var(--t-base) var(--spring);
}

/* ==========================================================================
   ⑦ 导航 — Liquid Glass 材质
   ========================================================================== */

.topbar {
  background: var(--mat-chrome) !important;
  backdrop-filter: var(--blur-lg);
  -webkit-backdrop-filter: var(--blur-lg);
  border-bottom: .5px solid var(--sep) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .5), 0 4px 16px rgba(0, 0, 0, .03);
}
[data-theme="dark"] .topbar { box-shadow: 0 1px 0 rgba(255,255,255,.04), 0 4px 16px rgba(0,0,0,.32); }

.top-nav a {
  border-radius: var(--r-sm);
  color: var(--ink2);
  font-weight: 500;
  transition: all var(--t-fast) var(--ease-ios);
}
.top-nav a:hover { background: var(--fill); color: var(--ink); box-shadow: none; }
.top-nav a.on { background: var(--fill); color: var(--ink); box-shadow: none; }

.mobile-nav {
  background: var(--mat-chrome) !important;
  backdrop-filter: var(--blur-lg);
  -webkit-backdrop-filter: var(--blur-lg);
  border-top: .5px solid var(--sep) !important;
  box-shadow: 0 -1px 0 rgba(255, 255, 255, .5), 0 -4px 16px rgba(0, 0, 0, .03);
}
[data-theme="dark"] .mobile-nav { box-shadow: 0 -1px 0 rgba(255,255,255,.04), 0 -4px 16px rgba(0,0,0,.32); }

.mobile-nav a {
  border-radius: var(--r-sm);
  color: var(--ink3);
  font-weight: 500;
  transition: color var(--t-fast) var(--ease-ios), transform var(--t-fast) var(--spring);
}
.mobile-nav a:active { transform: scale(.92); }
.mobile-nav a.on { color: var(--brand); background: transparent; box-shadow: none; }

.brand .mark {
  box-shadow: 0 1px 3px rgba(0, 122, 255, .24), inset 0 1px 0 rgba(255, 255, 255, .22);
  border-radius: var(--r-md);
}

/* 侧边栏 */
.sidebar, .side-nav {
  background: var(--mat-thin);
  backdrop-filter: var(--blur);
  -webkit-backdrop-filter: var(--blur);
  border-right: .5px solid var(--sep);
}
.side-nav a, .nav-pill {
  border-radius: var(--r);
  color: var(--ink2);
  font-weight: 500;
  transition: all var(--t-fast) var(--ease-ios);
}
.side-nav a:hover, .nav-pill:hover { background: var(--fill); color: var(--ink); box-shadow: none; }
.side-nav a.on, .nav-pill.on { background: var(--fill); color: var(--brand); box-shadow: none; }
.side-foot { border-top: .5px solid var(--sep); }
.avatar { border-radius: var(--r-md); box-shadow: inset 0 1px 0 rgba(255,255,255,.28); }
.burger {
  background: var(--mat-thick);
  backdrop-filter: var(--blur-sm);
  -webkit-backdrop-filter: var(--blur-sm);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: var(--shadow-xs);
  color: var(--ink2);
}

.admin-main { background: var(--bg); }
.admin-head {
  background: var(--mat-chrome) !important;
  backdrop-filter: var(--blur);
  -webkit-backdrop-filter: var(--blur);
  border-bottom: .5px solid var(--sep) !important;
  box-shadow: none;
}
.admin-body { background: var(--bg); }
.user-pill {
  background: var(--fill);
  border: none;
  border-radius: var(--r-full);
  box-shadow: none;
  color: var(--ink2);
  font-weight: 500;
}

/* ==========================================================================
   ⑧ 我的页
   ========================================================================== */

.me-hero {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-sm), var(--inset-hl);
  border: none;
}
.me-avatar {
  background: var(--grad);
  color: #fff;
  border-radius: var(--r-md);
  box-shadow: 0 2px 8px rgba(0, 122, 255, .24), inset 0 1px 0 rgba(255, 255, 255, .24);
  font-weight: 640;
}
.me-nick { color: var(--ink); font-weight: 640; letter-spacing: -0.02em; }
.me-name, .me-meta { color: var(--ink3); font-size: 13.5px; }

.me-btn {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  color: var(--ink);
  font-weight: 500;
  border: none;
  transition: box-shadow var(--t-base) var(--ease-ios), transform var(--t-base) var(--spring);
}
.me-btn:hover { box-shadow: var(--shadow-sm), var(--inset-hl); transform: translateY(-1px); }
.me-btn:active { transform: scale(.96); }
.me-btn.reward-btn { box-shadow: var(--shadow-xs), inset 0 1px 0 rgba(255,255,255,.72); }
.me-btn.reward-btn:hover { box-shadow: var(--shadow-sm), 0 0 0 3px rgba(255,149,0,.10), var(--inset-hl); }

/* 账号操作 */
.acct-btn {
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: none;
  border: none;
  transition: background-color var(--t-fast) var(--ease-ios), transform var(--t-fast) var(--spring);
}
.acct-btn:hover { background: var(--fill-3); box-shadow: none; transform: none; }
.acct-btn:active { background: var(--fill); transform: scale(.992); }
.acct-btn .ab-ico { box-shadow: none; border-radius: var(--r-sm); }
.ab-main b { color: var(--ink); font-weight: 500; }
.ab-main i { color: var(--ink3); font-style: normal; font-size: 13.5px; }
.ab-arrow { color: var(--label-3); }

/* 主题选择 */
.theme-item {
  background: var(--card);
  border: none;
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  transition: box-shadow var(--t-fast) var(--ease-ios), transform var(--t-fast) var(--spring);
}
.theme-item:hover { box-shadow: var(--shadow-sm), var(--inset-hl); transform: translateY(-1px); }
.theme-item:active { transform: scale(.98); }
.theme-item.on {
  box-shadow: 0 0 0 2px var(--brand), var(--shadow-sm), var(--inset-hl);
}
.ti-dot {
  border-radius: var(--r-sm);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 1px 3px rgba(0, 0, 0, .12);
}
.ti-name { color: var(--ink); font-weight: 500; }
.ti-check { color: var(--brand); }

.guest-card {
  background: rgba(255, 149, 0, .08);
  border-radius: var(--r-xl);
  box-shadow: inset 0 0 0 1px rgba(255, 149, 0, .20);
  border: none;
}
.guest-badge {
  background: rgba(255, 149, 0, .16);
  color: #C93400;
  border-radius: var(--r-sm);
  box-shadow: none;
  font-weight: 560;
}
[data-theme="dark"] .guest-badge { color: #FFB340; }

/* ==========================================================================
   ⑨ 套卷 / 记录 / 错题
   ========================================================================== */

.set-row {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  border: none;
  transition: box-shadow var(--t-fast) var(--ease-ios), transform var(--t-fast) var(--spring);
}
.set-row:hover { box-shadow: var(--shadow-sm), var(--inset-hl); transform: translateY(-1px); }
.set-row.all { background: rgba(0, 122, 255, .07); box-shadow: inset 0 1px 0 rgba(255,255,255,.5); }
.set-row.done { background: rgba(52, 199, 89, .08); box-shadow: inset 0 1px 0 rgba(255,255,255,.5); }
.set-row.done .set-no { color: #248A3D; }
[data-theme="dark"] .set-row.all { background: rgba(10, 132, 255, .14); }
[data-theme="dark"] .set-row.done { background: rgba(48, 209, 88, .14); }
[data-theme="dark"] .set-row.done .set-no { color: #30D158; }

.wrong-subj {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  border: none;
  transition: box-shadow var(--t-base) var(--ease-ios), transform var(--t-base) var(--spring);
}
.wrong-subj:hover { box-shadow: var(--shadow-sm), var(--inset-hl); transform: translateY(-2px); }
.ws-ico { box-shadow: none; border-radius: var(--r-sm); }
.wrong-q-item { border-bottom: .5px solid var(--sep); }
.wqi-sub { background: var(--fill); color: var(--ink2); box-shadow: none; border-radius: var(--r-sm); }

.sr-item, .sr-group {
  background: var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  border: none;
  transition: box-shadow var(--t-fast) var(--ease-ios), transform var(--t-fast) var(--spring);
}
.sr-item:hover, .sr-group:hover { box-shadow: var(--shadow-sm), var(--inset-hl); transform: translateY(-1px); }
.sr-item-inline:hover { background: var(--fill-3); }
.sri-tag, .sr-tag { background: var(--fill); color: var(--ink2); box-shadow: none; border-radius: var(--r-sm); }
.sri-stem .hl, .sr-stem .hl {
  background: rgba(255, 204, 0, .32);
  color: #8A6100;
  border-radius: var(--r-xs);
  padding: 0 3px;
}
[data-theme="dark"] .sri-stem .hl, [data-theme="dark"] .sr-stem .hl { background: rgba(255, 214, 10, .24); color: #FFD60A; }

.rec-item {
  background: var(--card) !important;
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  border: none;
  transition: box-shadow var(--t-fast) var(--ease-ios), transform var(--t-fast) var(--spring);
}
.rec-item:hover { box-shadow: var(--shadow-sm), var(--inset-hl); transform: translateY(-1px); }
.rec-score { color: var(--ink); font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.rec-tag { background: var(--fill); color: var(--ink2); box-shadow: none; border-radius: var(--r-sm); }
.rec-redo, .ref-btn {
  background: var(--fill);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--brand);
  font-weight: 500;
}
.rec-redo:hover, .ref-btn:hover { background: var(--fill-2); }
.pager {
  background: var(--card);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  border: none;
}
.pager button { color: var(--ink2); }
.pager-jump {
  background: var(--fill);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--ink);
}
.skeleton {
  background: linear-gradient(90deg, var(--fill-3) 25%, var(--fill) 50%, var(--fill-3) 75%) !important;
  background-size: 200% 100% !important;
  animation: ios-shimmer 1.6s var(--ease-ios) infinite !important;
  box-shadow: none;
  border-radius: var(--r-sm);
}

/* ==========================================================================
   ⑩ 工具 / 倒计时
   ========================================================================== */

.tool-card, .tool-item, .countdown, .cd-list, .cd-sec, .cd-card, .countdown-item {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  border: none;
  transition: box-shadow var(--t-base) var(--ease-ios), transform var(--t-base) var(--spring);
}
.tool-item:hover, .tool-card:hover { box-shadow: var(--shadow-sm), var(--inset-hl); transform: translateY(-1px); }
.tool-item:active { transform: scale(.992); }
.tool-ico { background: var(--fill) !important; border-radius: var(--r-md); box-shadow: none; }
.tool-t { color: var(--ink); font-weight: 590; letter-spacing: -0.014em; }
.tool-d { color: var(--ink3); font-size: 13.5px; }
.tool-arrow { color: var(--label-3); }
.tool-badge { background: var(--fill); color: var(--ink2); box-shadow: none; border-radius: var(--r-sm); }
.tool-off { opacity: .5; }
.tool-enable-tip, .tool-enable-row { color: var(--ink2); }

.cd-head, .cd-h-t, .cd-name, .cd-info, .cd-date, .cd-num { color: var(--ink); }
.cd-days, .cd-num { font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.cd-today { color: var(--ios-orange); }
.cd-over { color: var(--ios-red); }
.cd-empty { color: var(--ink3); }
.cd-op, .cd-ops { color: var(--ink2); }
.scd-main, .scd-name, .scd-md, .scd-days { color: var(--ink); }
.scd-ico { background: var(--fill); border-radius: var(--r-sm); box-shadow: none; }
.exam-bar {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  border: none;
}
.exam-item { color: var(--ink2); }
.ex-ico { background: var(--fill); border-radius: var(--r-sm); box-shadow: none; }
.ex-name, .ex-days, .ex-md { color: var(--ink2); }
.ex-today, .ex-soon { color: var(--ios-orange); }
.ex-near { color: var(--brand); }
.ex-far { color: var(--ink3); }

/* ==========================================================================
   ⑪ 通知 / 评论
   ========================================================================== */

.notif-btn {
  background: var(--fill);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--ink2);
  transition: background-color var(--t-fast) var(--ease-ios);
}
.notif-btn:hover { background: var(--fill-2); }
.notif-dot {
  background: var(--ios-red);
  color: #fff;
  border-radius: var(--r-full);
  box-shadow: 0 0 0 2px var(--card);
  font-weight: 600;
}
.notif-pop {
  background: var(--mat-thick) !important;
  backdrop-filter: var(--blur-lg);
  -webkit-backdrop-filter: var(--blur-lg);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xl), inset 0 .5px 0 rgba(255, 255, 255, .6);
  border: none;
}
.notif-pop-head { border-bottom: .5px solid var(--sep); color: var(--ink); font-weight: 620; }
.notif-empty { color: var(--ink3); }
.notif-item, .notif-it2, .notif-admin-item { border-bottom: .5px solid var(--sep); }
.notif-item:hover { background: var(--fill-3); }
.notif-it { color: var(--ink); font-weight: 500; }
.notif-it2 { color: var(--ink3); }
.notif-ic { color: var(--ink2); }
.notif-pin { background: rgba(255, 59, 48, .12); color: #D70015; border-radius: var(--r-sm); font-weight: 560; }
.notif-ico, .nt-ico { color: var(--brand); }
.notif-bar {
  background: var(--mat-regular);
  backdrop-filter: var(--blur);
  -webkit-backdrop-filter: var(--blur);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-xs), inset 0 .5px 0 rgba(255, 255, 255, .6);
}
.notif-bar-item, .notif-bar-content, .notif-bar-title { color: var(--ink); }

.cmt {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  border: none;
}
.cmt-board, .cmt-modal, .cmt-mask { background: var(--card); border: none; }
.cmt-board-head, .cmt-board-title { color: var(--ink); font-weight: 620; }
.cmt-name { color: var(--ink); font-weight: 590; }
.cmt-time { color: var(--ink3); font-size: 13px; }
.cmt-body { color: var(--ink2); letter-spacing: -0.006em; }
.cmt-btn {
  background: var(--fill) !important;
  border: none !important;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--ink2);
  font-weight: 500;
  transition: background-color var(--t-fast) var(--ease-ios), transform var(--t-fast) var(--spring);
}
.cmt-btn:hover { background: var(--fill-2) !important; color: var(--ink); }
.cmt-btn:active { transform: scale(.96); }
.cmt-replies { border-left: 2px solid var(--sep); }
.cmt-empty { color: var(--ink3); }
.cmt-count { background: var(--fill); color: var(--ink2); box-shadow: none; border-radius: var(--r-sm); }
.cmt-input-row input, .cmt-input-row textarea {
  background: var(--fill);
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--ink);
}
.cmt-input-row input:focus, .cmt-input-row textarea:focus {
  background: var(--card);
  box-shadow: 0 0 0 2px var(--brand), var(--ring);
}
.cmt-reply-to { color: var(--ink3); }
.cmt-open {
  background: var(--fill);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--brand);
  font-weight: 500;
}
.cmt-open:hover { background: var(--fill-2); }
.comment-btn {
  background: var(--fill);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--brand);
  font-weight: 500;
}
.liked { color: var(--ios-red); }

/* ==========================================================================
   ⑫ 结果页
   ========================================================================== */

.result-hero, .result-msg { color: var(--ink); }
.result-msg { font-weight: 700; letter-spacing: -0.028em; }
.result-sub { color: var(--ink3); }
.result-stats { color: var(--ink2); }
.result-stats > div {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
}
.score-ring { border-radius: 50%; box-shadow: none; background: transparent; }
.score-ring .pv .n { color: var(--ink); font-weight: 700; letter-spacing: -0.032em; font-variant-numeric: tabular-nums; }
.score-ring .pv .u { color: var(--ink3); }
.pct-bar { background: var(--fill-2) !important; border-radius: var(--r-full); box-shadow: none; }
.pct-bar > * { box-shadow: none; }
.rubric, .rubric-empty {
  background: var(--fill-3);
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--ink2);
}
.self-check { background: var(--card); border-radius: var(--r-md); box-shadow: var(--shadow-xs), var(--inset-hl); }
.re-grade, .retry {
  background: var(--fill);
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--brand);
  font-weight: 500;
}
.wr-row, .wr-d, .wr-s, .wr-ref, .wr-score { color: var(--ink2); }
.wr-score { color: var(--ink); font-weight: 700; }

/* ==========================================================================
   ⑬ 模态框 — iOS Sheet 质感
   ========================================================================== */

.modal {
  background: var(--mat-thick);
  backdrop-filter: var(--blur-lg);
  -webkit-backdrop-filter: var(--blur-lg);
  border: none;
  border-radius: var(--r-3xl);
  box-shadow: var(--shadow-xl), inset 0 .5px 0 rgba(255, 255, 255, .6);
}
.modal-head { border-bottom: .5px solid var(--sep); }
.modal-foot { border-top: .5px solid var(--sep); }
.modal-head h3 { color: var(--ink); font-weight: 640; letter-spacing: -0.022em; }
.modal-body { color: var(--ink2); }
.modal-wide { background: var(--mat-thick); border-radius: var(--r-3xl); box-shadow: var(--shadow-xl); }
.modal-x, .modal-close {
  background: var(--fill);
  border: none;
  border-radius: var(--r-full);
  box-shadow: none;
  color: var(--ink2);
  transition: background-color var(--t-fast) var(--ease-ios), transform var(--t-fast) var(--spring);
}
.modal-x:hover, .modal-close:hover { background: var(--fill-2); color: var(--ink); }
.modal-x:active, .modal-close:active { transform: scale(.90); }
.sb-mask, .cmt-mask { background: rgba(0, 0, 0, .32); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }

.dlg {
  background: var(--mat-thick);
  backdrop-filter: var(--blur-lg);
  -webkit-backdrop-filter: var(--blur-lg);
  border-radius: var(--r-3xl);
  box-shadow: var(--shadow-xl), inset 0 .5px 0 rgba(255, 255, 255, .6);
}
.dlg-ico { background: var(--fill); border-radius: var(--r-full); box-shadow: none; }
.dlg-title { color: var(--ink); font-weight: 640; letter-spacing: -0.02em; }
.dlg-msg { color: var(--ink2); }
.dlg-foot { border-top: .5px solid var(--sep); }

.toast {
  background: var(--mat-thick) !important;
  backdrop-filter: var(--blur-lg);
  -webkit-backdrop-filter: var(--blur-lg);
  color: var(--ink);
  border-radius: var(--r-full);
  box-shadow: var(--shadow-lg), inset 0 .5px 0 rgba(255, 255, 255, .6);
  font-weight: 500;
  font-size: 14.5px;
}

/* ==========================================================================
   ⑭ 徽章 / 状态
   ========================================================================== */

.badge {
  background: var(--fill);
  color: var(--ink2);
  border-radius: var(--r-sm);
  box-shadow: none;
  font-weight: 560;
  font-size: 12.5px;
  padding: 2px 8px;
}
.badge-ok   { background: rgba(52, 199, 89, .14) !important;  color: #248A3D !important; }
.badge-err  { background: rgba(255, 59, 48, .12) !important;  color: #D70015 !important; }
.badge-warn { background: rgba(255, 149, 0, .14) !important;  color: #C93400 !important; }
.badge-info { background: rgba(0, 122, 255, .12) !important;  color: #0062CC !important; }
[data-theme="dark"] .badge-ok { color: #30D158 !important; }
[data-theme="dark"] .badge-err { color: #FF6961 !important; }
[data-theme="dark"] .badge-warn { color: #FFB340 !important; }
[data-theme="dark"] .badge-info { color: #409CFF !important; }

.mask-badge { border-radius: var(--r-sm); box-shadow: none; font-weight: 560; }
.mb-a { background: rgba(0, 122, 255, .12) !important; color: #0062CC !important; }
.mb-b { background: rgba(52, 199, 89, .14) !important; color: #248A3D !important; }
.st-badge { background: var(--fill); border-radius: var(--r-sm); box-shadow: none; color: var(--ink2); }
.acc { background: rgba(255, 149, 0, .14) !important; color: #C93400 !important; border-radius: var(--r-sm); box-shadow: none; }

/* ==========================================================================
   ⑮ 表格
   ========================================================================== */

table { border-collapse: separate; border-spacing: 0; color: var(--ink); font-size: 14.5px; }
th {
  background: var(--fill-3);
  color: var(--ink2);
  border-bottom: .5px solid var(--sep);
  font-weight: 560;
  font-size: 13px;
  padding: 11px 14px;
  text-align: left;
}
td { border-bottom: .5px solid var(--sep); color: var(--ink2); padding: 13px 14px; }
tr:last-child td { border-bottom: none; }
tbody tr { transition: background-color var(--t-fast) var(--ease-ios); }
tbody tr:hover { background: var(--fill-3); }
.table-wrap {
  border: none;
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--shadow-xs), var(--inset-hl);
  background: var(--card);
}

/* ==========================================================================
   ⑯ 管理后台
   ========================================================================== */

.dash-num { color: var(--ink); font-weight: 700; letter-spacing: -0.028em; font-variant-numeric: tabular-nums; }
.dash-delta { color: var(--ink3); font-size: 13px; }
.ins-row { border-bottom: .5px solid var(--sep); }
.ins-ico { box-shadow: none; border-radius: var(--r-sm); }
.ins-name { color: var(--ink); font-weight: 500; }
.ins-num { color: var(--ink2); font-variant-numeric: tabular-nums; }
.ins-advice { border-top: .5px solid var(--sep); color: var(--ink2); }
.ins-advice b { color: var(--ios-red); }
.insight-box { background: var(--fill-3); border-radius: var(--r-md); box-shadow: none; }
.tcfg-head, .tcfg-row { color: var(--ink2); }
.tcfg-row input, .tcfg-row select {
  background: var(--fill);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--ink);
}
.grp, .group-card, .grp-head, .grp-q, .grp-sub, .grp-subs-head {
  background: var(--card);
  border-radius: var(--r-md);
  box-shadow: none;
  border: none;
}
.grp-head, .grp-q-head, .grp-subs-head { color: var(--ink); }
.grp-q-no, .grp-sub-no, .grp-sub-edit { color: var(--ink2); }
.grp-material, .grp-result-material {
  background: var(--fill-3);
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--ink2);
}
.qf-sheet { background: var(--mat-thick); border-radius: var(--r-2xl); box-shadow: var(--shadow-xl); backdrop-filter: var(--blur-lg); }
.scoring-row, .scoring-edit, .scoring-score {
  background: var(--fill-3);
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--ink2);
}
.scoring-row input, .rubric input { background: var(--fill); border: none; border-radius: var(--r-sm); box-shadow: none; color: var(--ink); }
.se-row, .se-label, .se-sel, .se-tag { color: var(--ink2); }
.se-sel { background: var(--fill); border: none; border-radius: var(--r-sm); box-shadow: none; color: var(--ink); }
.se-tag { background: var(--fill); border-radius: var(--r-sm); box-shadow: none; }
.se-empty { border: 1px dashed var(--label-3); border-radius: var(--r-md); box-shadow: none; color: var(--ink3); }
.sc-label { color: var(--ink3); }
.clr-grid, .clr-hex { color: var(--ink2); }
.clr { border-radius: var(--r-sm); box-shadow: inset 0 1px 0 rgba(255,255,255,.28); border: none; }
.dl-bar { background: var(--fill-2); box-shadow: none; border-radius: var(--r-full); }
.dl-btn, .dl-btn-sm, .dl-count { color: var(--ink2); }
.dl-btn { background: var(--fill); border: none; border-radius: var(--r-sm); box-shadow: none; }
.corr-stem { color: var(--ink2); }
.corr-type-badge, .corr-type, .corr-types {
  background: var(--fill);
  color: var(--ink2);
  border-radius: var(--r-sm);
  box-shadow: none;
  font-weight: 500;
}
.ans-pick { color: var(--ink2); }
.rubric-empty { color: var(--ink3); }
.today { color: var(--brand); }
.num { color: var(--ink); font-weight: 700; font-variant-numeric: tabular-nums; }
.pct { color: var(--ink2); font-variant-numeric: tabular-nums; }
.opt-editor .k { background: var(--fill); color: var(--ink2); border-radius: var(--r-sm); box-shadow: none; font-weight: 620; }
.opt-editor.ans .k { background: var(--brand); color: #fff; box-shadow: 0 1px 4px rgba(0,122,255,.28); }
.upload-box, .work-file, .work-file-btn, .work-file-label {
  background: var(--fill-3);
  border: 1.5px dashed var(--label-3);
  border-radius: var(--r-xl);
  box-shadow: none;
  color: var(--ink2);
}
.upload-box:hover, .work-file-btn:hover { border-color: var(--brand); background: rgba(0,122,255,.06); color: var(--brand); }
.drop-hint { background: var(--fill-3); border: 1.5px dashed var(--label-3); border-radius: var(--r-xl); box-shadow: none; color: var(--ink3); }
.drag-over { background: rgba(0,122,255,.08) !important; border-color: var(--brand) !important; box-shadow: var(--ring) !important; }
.work-wrap, .work-result, .work-result-view { background: var(--card); border-radius: var(--r-xl); box-shadow: var(--shadow-xs), var(--inset-hl); }
.work-tip { color: var(--ink3); }
.work-err { color: var(--ios-red); }
.file-chip, .folder-chip { background: var(--fill); border-radius: var(--r-sm); box-shadow: none; color: var(--ink2); }
.folder-row, .folder-rows, .fr-row { background: var(--card); border-radius: var(--r-sm); box-shadow: none; }
.illus { background: var(--fill-3); border-radius: var(--r-xl); box-shadow: none; }

/* ==========================================================================
   ⑰ 登录页
   ========================================================================== */

.auth-page {
  background:
    radial-gradient(900px 600px at 82% -6%, rgba(0, 122, 255, .10) 0%, transparent 58%),
    radial-gradient(760px 520px at 8% 104%, rgba(175, 82, 222, .09) 0%, transparent 58%),
    radial-gradient(600px 500px at 50% 50%, rgba(90, 200, 250, .06) 0%, transparent 62%),
    var(--ios-bg) !important;
}
.auth-page .blob { display: none; }

.auth-card {
  background: var(--mat-thick) !important;
  backdrop-filter: var(--blur-lg);
  -webkit-backdrop-filter: var(--blur-lg);
  border: none;
  border-radius: var(--r-3xl);
  box-shadow: var(--shadow-xl), inset 0 .5px 0 rgba(255, 255, 255, .7);
}
.auth-logo .mark {
  background: var(--grad);
  border-radius: var(--r-xl);
  box-shadow: 0 4px 16px rgba(0, 122, 255, .28), inset 0 1px 0 rgba(255, 255, 255, .28);
}
.auth-logo h1 { color: var(--ink); font-weight: 700; letter-spacing: -0.028em; }
.auth-logo p { color: var(--ink3); font-size: 14px; }
.logo-prev { background: var(--fill); border: none; border-radius: var(--r-xl); box-shadow: none; }
.logo-ico { color: var(--brand); }

.auth-tabs {
  background: var(--fill) !important;
  border-radius: var(--r-md);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .04);
  padding: 3px;
}
.auth-tabs button { color: var(--ink2); font-weight: 500; border-radius: var(--r-sm); }
.auth-tabs button.active { color: var(--ink); }
.auth-tabs .slider { background: var(--card) !important; border-radius: var(--r-sm); box-shadow: var(--shadow-xs), var(--inset-hl); }
.auth-hint { color: var(--ink3); font-size: 13.5px; }
.auth-hint b { color: var(--brand); font-weight: 590; }
.auth-up-hint {
  background: rgba(255, 149, 0, .10) !important;
  border: none;
  box-shadow: inset 0 0 0 1px rgba(255, 149, 0, .20);
  border-radius: var(--r-md);
  color: #C93400;
}
[data-theme="dark"] .auth-up-hint { color: #FFB340; }
.auth-theme {
  background: var(--fill);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--ink2);
}
.auth-theme:hover { background: var(--fill-2); }
.auth-auto { color: var(--ink3); }
.f-msg { color: var(--ios-red); font-size: 13.5px; }

/* ==========================================================================
   ⑱ 选择模式 / 题型
   ========================================================================== */

.choice-btn, .type-card, .type-pick, .choice-wide {
  background: var(--card) !important;
  border: none;
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  transition: box-shadow var(--t-base) var(--ease-ios), transform var(--t-base) var(--spring);
}
.choice-btn:hover, .type-card:hover, .type-pick:hover {
  box-shadow: var(--shadow-md), var(--inset-hl);
  transform: translateY(-3px);
}
.choice-btn:active, .type-card:active, .type-pick:active { transform: translateY(-1px) scale(.985); }
.cb-ico, .tp-ico { color: var(--brand); }
.cb-t, .tp-t { color: var(--ink); font-weight: 640; letter-spacing: -0.018em; }
.cb-d { color: var(--ink3); font-size: 13.5px; }
.type-tag { background: var(--fill); color: var(--ink2); border-radius: var(--r-sm); box-shadow: none; font-weight: 500; }
.mode-btn {
  background: var(--fill);
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--ink2);
  font-weight: 500;
}
.mode-btn.on {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 2px 8px rgba(0,122,255,.24), inset 0 1px 0 rgba(255,255,255,.2);
}
.cb-choice, .cb-random, .cb-text, .cb-op, .cb-mat { color: var(--ink2); }
.cb-op { color: var(--brand); font-weight: 590; }
.cb-mat { color: var(--ink3); }
.cb-text { color: var(--ink); font-weight: 500; }

/* ==========================================================================
   ⑲ 题型扩展
   ========================================================================== */

.fill-input {
  background: var(--card) !important;
  border: none;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-xs), var(--inset-hl);
  color: var(--ink);
}
.fill-input:focus { box-shadow: 0 0 0 2px var(--brand), var(--ring), var(--inset-hl); }
.fill-res { color: var(--ink2); }
.cls-row, .cls-res-row { background: var(--card) !important; border-radius: var(--r-md); box-shadow: var(--shadow-xs), var(--inset-hl); border: none; }
.cls-chip { background: var(--fill) !important; color: var(--ink2) !important; border-radius: var(--r-sm); box-shadow: none; font-weight: 500; }
.cls-chip-x { color: var(--ink3); }
.cls-chip-x:hover { color: var(--ios-red); }
.cls-text, .cls-cmp { color: var(--ink2); }
.cls-edit input { background: var(--fill); border: none; border-radius: var(--r-sm); box-shadow: none; color: var(--ink); }
.order-tip {
  background: var(--fill-3);
  color: var(--ink3);
  border-radius: var(--r-md);
  box-shadow: none;
  font-size: 13.5px;
}
.ord { background: var(--card); border-radius: var(--r-md); box-shadow: var(--shadow-xs), var(--inset-hl); color: var(--ink); }
.audio-player {
  background: var(--card);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs), var(--inset-hl);
}
.speak-btn {
  background: var(--brand);
  border: none;
  border-radius: var(--r-full);
  box-shadow: 0 2px 8px rgba(0, 122, 255, .24), inset 0 1px 0 rgba(255,255,255,.22);
  color: #fff;
}
.speak-btn:active { transform: scale(.92); }
.q-material { background: var(--fill-3); border-radius: var(--r-md); box-shadow: none; }
.q-material, .q-stem-row, .q-subj, .q-no, .q-mv { color: var(--ink2); }
.analysis-toggle {
  background: var(--fill);
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--brand);
  font-weight: 500;
}
.qcard { background: var(--card); border-radius: var(--r-3xl); box-shadow: var(--shadow-md), var(--inset-hl); }
.rmain, .search-res, .wrong-q, .wrong-q-list, .wrong-review { color: var(--ink2); }
.ref-ico { color: var(--brand); }
.wqi-tag { background: var(--fill); border-radius: var(--r-sm); box-shadow: none; }
.tp-badge { background: var(--fill); color: var(--ink2); border-radius: var(--r-sm); box-shadow: none; }
.tool-meta { color: var(--ink3); }
.guest { color: var(--ink2); }
.t-svg { color: currentColor; }
.dm-row { background: var(--card); border-radius: var(--r-md); box-shadow: var(--shadow-xs), var(--inset-hl); }
.link-btns, .list-ops, .item-ops, .row-ops, .td-actions, .rp-d, .rp-m, .q-mv { color: var(--ink2); }
.link-btns a, .list-ops button, .item-ops button, .row-ops button, .td-actions button { border-radius: var(--r-sm); color: var(--brand); }
.switch-row { color: var(--ink2); }
.beat-tip { background: var(--fill-3); border-radius: var(--r-md); box-shadow: none; color: var(--ink3); }
.tag-manage, .tag-item {
  background: var(--fill);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--ink2);
  font-weight: 500;
}
.tag-x { background: transparent; color: var(--ink3); border-radius: var(--r-full); box-shadow: none; }
.tag-x:hover { background: rgba(255, 59, 48, .12); color: var(--ios-red); }
.cat-bar { color: var(--ink2); }
.theme-list { color: var(--ink); }
.theme-toggle {
  background: var(--fill);
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--ink2);
}

.reward-modal { background: var(--mat-thick); }
.reward-qr img {
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-sm);
  background: #fff;
  border: none;
}
.reward-text, .share-tip { color: var(--ink2); }
.share-text {
  background: var(--fill) !important;
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--ink);
}
.share-modal, .wechat-qr-wrap { background: var(--card); }
.wechat-qr { border-radius: var(--r-xl); box-shadow: var(--shadow-sm); background: #fff; border: none; }

.subj-head, .subj-body, .subj-cd, .subj-go, .subj-ex { color: var(--ink2); }
.subj-cat-sm { background: var(--fill); color: var(--ink2); box-shadow: none; }
.subj-set-btn {
  background: var(--fill);
  border: none;
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--brand);
  font-weight: 500;
}
.stat-actions { color: var(--ink2); }
.sets-head { color: var(--ink); }
.set-info, .set-actions, .set-range, .set-rate, .set-done { color: var(--ink2); }
.set-done { background: rgba(52, 199, 89, .14); color: #248A3D; border-radius: var(--r-sm); box-shadow: none; font-weight: 560; }
.set-rate { background: var(--fill); color: var(--ink2); border-radius: var(--r-sm); box-shadow: none; }
.sub-no, .sub { color: var(--ink2); }
.wrong-type-row, .wrong-type-list, .wrong-head, .wrong-subj-grid { color: var(--ink2); }
.wrong-head { border-bottom: .5px solid var(--sep); }
.wt-ico, .wt-label, .wt-count, .wt-go { color: var(--ink2); }
.wt-go { color: var(--brand); font-weight: 590; }
.wq-top, .wq-stem { color: var(--ink); }
.wqi-dot { box-shadow: none; }
.wqi-more { color: var(--ink3); }
.ws-count, .ws-name { color: var(--ink2); }
.ws-name { color: var(--ink); font-weight: 590; }
.wh-name { color: var(--ink2); }
.practice-card, .practice-hint { background: var(--card); border-radius: var(--r-xl); box-shadow: var(--shadow-xs), var(--inset-hl); color: var(--ink2); }
.multi { color: var(--brand); font-weight: 590; }
.mv-btn { background: var(--fill); border: none; border-radius: var(--r-sm); box-shadow: none; color: var(--brand); }
.nai-main, .nai-title, .nai-time, .nai-content { color: var(--ink2); }
.nai-title { color: var(--ink); font-weight: 590; }

/* ==========================================================================
   ⑳ 通用元素
   ========================================================================== */

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
select, textarea {
  background: var(--fill-3);
  border: none;
  border-radius: var(--r-md);
  box-shadow: none;
  color: var(--ink);
  transition: box-shadow var(--t-fast) var(--ease-ios), background-color var(--t-fast) var(--ease-ios);
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus,
select:focus, textarea:focus {
  outline: none;
  background: var(--card);
  box-shadow: 0 0 0 2px var(--brand), var(--ring), var(--inset-hl);
}
input::placeholder, textarea::placeholder { color: var(--label-3); }

select {
  appearance: none;
  -webkit-appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--label-2) 50%),
                    linear-gradient(135deg, var(--label-2) 50%, transparent 50%);
  background-position: calc(100% - 18px) calc(50% + 1px), calc(100% - 13px) calc(50% + 1px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 34px;
}

input[type="checkbox"], input[type="radio"], input[type="range"] { accent-color: var(--brand); }

code, pre, kbd {
  background: var(--fill);
  border-radius: var(--r-sm);
  box-shadow: none;
  color: var(--ink);
  font-family: var(--mono);
  font-size: .92em;
}

hr { border: none; border-top: .5px solid var(--sep); box-shadow: none; }

.empty .ico {
  background: var(--fill-3);
  box-shadow: none;
  border-radius: var(--r-3xl);
}
.empty p { color: var(--ink3); }

.loading-wrap { color: var(--ink3); }
.spinner {
  border: 2.5px solid var(--fill-2);
  border-top-color: var(--brand);
  box-shadow: none;
}

.q-stem img, .q-analysis img, .opt .txt img, .txt img, .q-img {
  border-radius: var(--r-md);
  border: none;
  box-shadow: var(--shadow-xs);
  background: var(--card);
}
.logo-img, .img-prev { border-radius: var(--r-sm); box-shadow: none; }
.file-in { background: var(--fill); border: none; border-radius: var(--r-sm); box-shadow: none; color: var(--ink); }
.sr-count, .sr-g-head, .sr-go { color: var(--ink2); }
.sr-go, .sri-go { color: var(--brand); font-weight: 590; }
.sr-tags, .sr-tag-sub { color: var(--ink2); }
.sri-idx { color: var(--ink3); font-variant-numeric: tabular-nums; }

/* ==========================================================================
   ㉑ Spring 动画系统
   ========================================================================== */

/* 弹性弹出 */
@keyframes ios-pop {
  0%   { transform: scale(.97); }
  55%  { transform: scale(1.012); }
  100% { transform: scale(1); }
}

/* 抖动 */
@keyframes ios-shake {
  0%, 100% { transform: translateX(0); }
  15%      { transform: translateX(-5px); }
  30%      { transform: translateX(5px); }
  45%      { transform: translateX(-4px); }
  60%      { transform: translateX(4px); }
  80%      { transform: translateX(-2px); }
}

/* 淡入上浮 */
@keyframes ios-fade-up {
  from { opacity: 0; transform: translateY(12px) scale(.985); }
  to   { opacity: 1; transform: none; }
}

/* 闪光（骨架屏）*/
@keyframes ios-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* 脉冲（强调）*/
@keyframes ios-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: .55; }
}

/* 卡片入场（Spring + 交错）*/
.card, .stat-card, .subj-card, .quiz-card, .choice-btn, .type-card, .set-row, .tool-item {
  animation: ios-fade-up 460ms var(--spring-soft) both;
}
/* 子项交错延迟 */
.stat-row > *:nth-child(1), .subject-grid > *:nth-child(1), .g3 > *:nth-child(1) { animation-delay: 0ms; }
.stat-row > *:nth-child(2), .subject-grid > *:nth-child(2), .g3 > *:nth-child(2) { animation-delay: 45ms; }
.stat-row > *:nth-child(3), .subject-grid > *:nth-child(3), .g3 > *:nth-child(3) { animation-delay: 90ms; }
.stat-row > *:nth-child(4), .subject-grid > *:nth-child(4), .g3 > *:nth-child(4) { animation-delay: 135ms; }
.stat-row > *:nth-child(5), .subject-grid > *:nth-child(5) { animation-delay: 180ms; }
.stat-row > *:nth-child(6), .subject-grid > *:nth-child(6) { animation-delay: 225ms; }

/* 选项入场 */
.opt { animation: ios-fade-up 400ms var(--spring-soft) both; }
.opt:nth-child(1) { animation-delay: 0ms; }
.opt:nth-child(2) { animation-delay: 40ms; }
.opt:nth-child(3) { animation-delay: 80ms; }
.opt:nth-child(4) { animation-delay: 120ms; }
.opt:nth-child(5) { animation-delay: 160ms; }
.opt:nth-child(6) { animation-delay: 200ms; }

/* 减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ==========================================================================
   ㉒ 可读性保护
   ========================================================================== */

p, span, h1, h2, h3, h4, h5, h6,
.q-stem, .opt .txt, .card-title, .sv, .me-nick,
.sr-stem, .sri-stem, .wq-stem, .wqi-stem {
  text-shadow: none !important;
}

/* ==========================================================================
   ㉓ 响应式
   ========================================================================== */

@media (max-width: 640px) {
  :root {
    --r-3xl: 22px;
    --r-2xl: 18px;
    --r-xl: 15px;
  }
  .quiz-card { padding: 20px; }
  .card { padding: 16px; border-radius: var(--r-2xl); }
  .stat-card { padding: 14px; }
}

@media (prefers-contrast: more) {
  :root { --sep: rgba(60,60,67,.44); --ink3: var(--ink2); }
}

@media print {
  body { background: #fff !important; }
  .card, .quiz-card, .subj-card { box-shadow: none !important; }
}