/* ==========================================================================
   设计 token
   规则：组件 CSS 里不允许出现自由 hex，一切颜色/间距/圆角都必须来自这里。
   暗色是默认主题（霓虹身份建立在暗底上），亮色在 themes.css 里同名覆盖。
   ========================================================================== */

:root {
  /* --- 背景层级 ---
     暖色的深底。原来是深蓝黑（#070a14 那一系），
     和「温馨」是打架的 —— 冷底会把任何暖色都压下去。 */
  --bg-0: #120d0a;          /* 页面底 */
  --bg-1: #1b1512;          /* 卡片面 */
  --bg-2: #29201a;          /* 抬升面 / 输入框 */
  --bg-3: #3a2c22;          /* 悬停抬升 */

  /* --- 玻璃拟态 --- */
  --glass-bg: rgba(41, 32, 26, 0.55);
  --glass-bg-strong: rgba(27, 21, 18, 0.85);
  --glass-border: rgba(255, 236, 214, 0.10);
  --glass-highlight: rgba(255, 236, 214, 0.06);

  /* --- 文字 --- */
  --text-0: #f2f5ff;        /* 主要 */
  --text-1: #aab3d0;        /* 次要 */
  --text-2: #6c7799;        /* 弱化 / 占位 */
  --text-inverse: #120d0a;

  /* --- 强调色：暖色系 ---
     变量名保留（pink/cyan/violet）是为了不动几十处引用 ——
     但值已经全部换成暖色：玫瑰 / 琥珀 / 陶土 / 橄榄 / 暖金。
     原来的紫青粉是霓虹那套，和「温馨」相冲。 */
  --neon-pink: #e2586b;    /* 玫瑰 */
  --neon-cyan: #e8963c;    /* 琥珀（正文链接色） */
  --neon-violet: #cf6a3e;  /* 陶土 */
  --neon-lime: #a3a03a;    /* 橄榄 */
  --neon-amber: #f0b429;   /* 暖金 */

  /* --- 语义色 ---
     语义色不能全暖：成功和警告都变成橙黄就分不清了。
     所以保留可辨识的色相，只把纯度降下来、往暖里偏一点。 */
  --ok: #7fb069;           /* 暖绿 */
  --warn: #e8963c;         /* 琥珀 */
  --danger: #d9534f;       /* 暖红 */
  --info: #cf6a3e;         /* 陶土 */

  /* --- 渐变 --- */
  --grad-primary: linear-gradient(135deg, #f0b429 0%, #e8963c 48%, #e2586b 100%);
  --grad-cta: linear-gradient(135deg, #e8963c 0%, #e2586b 100%);
  --grad-warm: linear-gradient(135deg, #f0b429 0%, #e2586b 100%);
  --grad-cool: linear-gradient(135deg, #a3a03a 0%, #e8963c 100%);

  /* 用于渐变描边（配合 padding + background-clip 技巧） */
  --grad-border: linear-gradient(135deg,
    rgba(240, 180, 41, 0.62), rgba(207, 106, 62, 0.50), rgba(226, 88, 107, 0.62));

  /* --- 辉光（昂贵，仅用于 hover/focus 与少数 hero 元素） --- */
  --glow-pink: 0 0 12px rgba(226, 88, 107, 0.55);
  --glow-cyan: 0 0 12px rgba(232, 150, 60, 0.50);
  --glow-violet: 0 0 12px rgba(207, 106, 62, 0.55);
  --glow-soft: 0 0 24px rgba(207, 106, 62, 0.30);
  --glow-lift: 0 12px 32px rgba(0, 0, 0, 0.55);

  /* --- 阴影（朴素，静态元素只用这个） --- */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.40);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.50);

  /* --- 圆角 --- */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* --- 间距（8px 基线，排列整齐的根本） --- */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;

  /* --- 字体 --- */
  --font-sans: "MiSans", "HarmonyOS Sans SC", "PingFang SC", "Microsoft YaHei",
    system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", "Cascadia Code", Consolas, monospace;
  /* 编辑排版层用。只用系统自带的衬线字体 —— 引外链字体等于给首屏加一次
     网络往返，和「零额外请求」的取向相反。中文回退到宋体系（宋体才是衬线）。 */
  --font-editorial: Georgia, "Times New Roman", "Songti SC", STSong, SimSun, serif;

  --fs-xs: 12px;
  --fs-sm: 14px;
  --fs-md: 16px;
  --fs-lg: 20px;
  --fs-xl: 28px;
  --fs-2xl: 34px;
  --fs-3xl: 40px;

  --lh-tight: 1.25;
  --lh-normal: 1.6;

  --fw-normal: 400;
  --fw-medium: 500;
  --fw-bold: 700;

  /* --- 布局 --- */
  --container: 1200px;
  --nav-h: 64px;
  --tabbar-h: 56px;         /* 手机底部 tab 的高度，正文要按它留出下边距 */
  --grid-gap: 20px;
  --feed-min-col: 260px;    /* 信息流最小列宽，决定「整齐」 */

  /* --- 层级 --- */
  --z-nav: 100;
  --z-dropdown: 200;
  --z-modal: 1000;
  --z-toast: 1100;

  /* --- 动效 --- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 120ms;
  --dur: 220ms;
  --dur-slow: 380ms;
}

/* 尊重系统的减少动效设置 */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur: 0ms;
    --dur-slow: 0ms;
  }
}