/* ==========================================================================
   学星官网 · 设计变量（全站唯一定义处）
   与小程序 ui/ui-design-spec.md 的色板对齐，品牌绿 #45BF72 沿用。
   规则：任何页面不得再写死 hex 色值 / 圆角 / 字号，一律引用这里的变量。
   ========================================================================== */

:root {
  /* ---- 品牌 ---------------------------------------------------------- */
  --brand: #45BF72;          /* 主色：按钮底、强调、进度 */
  --brand-hover: #3AA963;    /* 主按钮 hover */
  --brand-deep: #2A7F49;     /* 深一档，用于浅底上的文字/图标（对比度达标） */
  --brand-200: #D8F7E2;      /* 浅绿底 */
  --brand-050: #EFFCF3;      /* 更浅的区块底 */
  --brand-ink: #0B2417;      /* 品牌绿底上的文字（对 #45BF72 对比度 ≈ 7:1） */

  /* ---- 辅助色 -------------------------------------------------------- */
  --blue: #7AB7FF;           /* 家长报告 / 方法辅助 */
  --blue-050: #EFF6FF;
  --amber: #FFD76A;          /* 复习节点 / 成就感 */
  --amber-050: #FFF9E8;
  --coral: #FF8C78;          /* 错因 / 价格强调 */
  --coral-050: #FFF1EE;

  /* ---- 浅色面（正文区） ---------------------------------------------- */
  --page: #FFFFFF;
  --page-alt: #F7FAF8;       /* 交替区块底 */
  --card: #FFFFFF;
  --line: #E4EBE6;           /* 1px 细边框 */
  --line-strong: #D2DED6;

  /* ---- 浅色面的文字 -------------------------------------------------- */
  --ink: #24352B;            /* 标题 */
  --ink-2: #4A5B50;          /* 正文 */
  --ink-3: #708075;          /* 次级 / 说明 */

  /* ---- 深色面（首屏与导航） ------------------------------------------ */
  --d-bg: #0B1410;           /* 最深底 */
  --d-bg-2: #0E1A14;         /* 深底（方案文档指定色号） */
  --d-surface: #132019;      /* 深色卡片 */
  --d-surface-2: #17271F;    /* 深色卡片（高一层） */
  --d-line: rgba(255, 255, 255, 0.09);
  --d-line-2: rgba(255, 255, 255, 0.2);
  --d-ink: #EAF4EE;          /* 深底上的主文字 */
  --d-ink-2: #A9BFB2;        /* 深底上的正文 */
  --d-ink-3: #7D9488;        /* 深底上的次级 */
  --d-brand: #5CE08D;        /* 深底上的品牌绿（提亮，对比度达标） */

  /* ---- 圆角 ---------------------------------------------------------- */
  --r-sm: 8px;               /* 按钮、输入框 */
  --r-md: 12px;              /* 卡片 */
  --r-lg: 16px;
  --r-xl: 24px;
  --r-pill: 999px;

  /* ---- 间距 ---------------------------------------------------------- */
  --sp-1: 8px;
  --sp-2: 12px;
  --sp-3: 16px;
  --sp-4: 24px;
  --sp-5: 32px;
  --sp-6: 48px;
  --sp-7: 64px;
  --sp-8: 88px;              /* 桌面端区块上下留白 */

  /* ---- 字体 ---------------------------------------------------------- */
  --font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", Roboto, system-ui,
    sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas,
    "Liberation Mono", monospace;

  --fs-h1: 44px;
  --fs-h2: 32px;
  --fs-h3: 20px;
  --fs-body: 16px;
  --fs-sm: 14px;
  --fs-xs: 13px;

  --lh-tight: 1.25;
  --lh-body: 1.7;

  /* ---- 布局 ---------------------------------------------------------- */
  --maxw: 1120px;
  --gutter: 24px;
  --header-h: 64px;

  /* ---- 动效 ---------------------------------------------------------- */
  --ease: cubic-bezier(0.2, 0.7, 0.3, 1);
  --dur: 180ms;
}

@media (max-width: 720px) {
  :root {
    --fs-h1: 30px;
    --fs-h2: 24px;
    --fs-h3: 18px;
    --sp-8: 56px;
    --gutter: 20px;
  }
}