/* 嘉圆 设计令牌 v1.0 | 2026-10-14
   颜色对比度已按 WCAG 2.x 计算（见品牌规范第 3 节）。
   v0 仅提供浅色主题（决策：暂不做深色模式）。 */

:root {
  /* ---- 品牌色 ---- */
  --jy-red-600: #C23B2E;   /* 品牌红：标志、主按钮、关键强调；在米白底上对比度 5.00 */
  --jy-red-700: #A62F24;   /* 品牌红悬停态 */
  --jy-red-50:  #FBE9E7;   /* 红色浅底，用于提示块 */

  --jy-gold-500: #E2B66A;  /* 金色：铜钱、徽章、高亮底色（不作文字色） */
  --jy-gold-100: #FBF1DC;  /* 金色浅底 */

  --jy-teal-600: #1F7A70;  /* 辅助青：学习进度、完成状态；在米白底上对比度 4.86 */
  --jy-teal-50:  #E6F2F0;

  /* ---- 中性色 ---- */
  --jy-paper:    #FBF8F2;  /* 页面背景（米白，适合长时间阅读） */
  --jy-surface:  #FFFFFF;  /* 卡片表面 */
  --jy-ink-900:  #2B2B2B;  /* 正文 */
  --jy-ink-700:  #5F5F5F;  /* 次要文字；对比度 6.02 */
  --jy-ink-400:  #9A9A9A;  /* 禁用态、占位文字（仅用于非关键信息） */
  --jy-line:     #E7E1D6;  /* 分隔线、边框 */

  /* ---- 语义色 ---- */
  --jy-success: var(--jy-teal-600);
  --jy-warning: #8A5A00;   /* 警示文字；在米白底上需复核对比度 */
  --jy-danger:  var(--jy-red-600);
  --jy-info:    var(--jy-teal-600);

  /* ---- 字体（系统字体，决策：不购买字体授权） ---- */
  --jy-font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
                  "Microsoft YaHei", "Noto Sans SC", "Helvetica Neue", Arial, sans-serif;
  --jy-font-display: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --jy-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* ---- 字号（移动端基准 16px，行高 1.7 利于中文阅读） ---- */
  --jy-text-xs: 0.75rem;   /* 12px */
  --jy-text-sm: 0.875rem;  /* 14px */
  --jy-text-md: 1rem;      /* 16px，正文 */
  --jy-text-lg: 1.125rem;  /* 18px */
  --jy-text-xl: 1.375rem;  /* 22px */
  --jy-text-2xl: 1.75rem;  /* 28px */
  --jy-text-3xl: 2.25rem;  /* 36px，仅用于桌面端大标题 */
  --jy-leading: 1.7;
  --jy-leading-tight: 1.3;

  /* ---- 间距（4px 基准） ---- */
  --jy-space-1: 4px;
  --jy-space-2: 8px;
  --jy-space-3: 12px;
  --jy-space-4: 16px;
  --jy-space-5: 24px;
  --jy-space-6: 32px;
  --jy-space-7: 48px;
  --jy-gutter: 16px;       /* 移动端左右边距 */

  /* ---- 圆角与阴影 ---- */
  --jy-radius-sm: 6px;
  --jy-radius-md: 12px;
  --jy-radius-lg: 20px;
  --jy-radius-pill: 999px;
  --jy-shadow-1: 0 1px 2px rgba(43, 43, 43, 0.06);
  --jy-shadow-2: 0 4px 16px rgba(43, 43, 43, 0.08);

  /* ---- 动效（每个动效不超过 3 秒；减少动态效果时自动关闭） ---- */
  --jy-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --jy-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --jy-dur-fast: 160ms;
  --jy-dur-base: 280ms;
  --jy-dur-slow: 600ms;
}

/* 减少动态效果：尊重系统设置，规格第 5.2 节要求 */
@media (prefers-reduced-motion: reduce) {
  :root {
    --jy-dur-fast: 0ms;
    --jy-dur-base: 0ms;
    --jy-dur-slow: 0ms;
  }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}