/* ========================================================================
   设计变量（Design Tokens）
   全站的颜色、字体、间距都从这里读取。想调整品牌色，只改这个文件就行。
   页面概念：首屏是会随滚动从「黄昏湖面」进入「夜晚」的 3D 场景，
   之后的内容区都在夜空底色上，内容最大宽度 1240px。
   ======================================================================== */

:root{
  /* 夜空底色：由深到浅（页面背景 → 区块底色 → 卡片） */
  --night:#110b1d; --night-2:#191128; --panel:#1f1633; --panel-2:#2a1f45;

  /* 分隔线 / 描边 */
  --line:rgba(232,216,255,.12); --line-2:rgba(232,216,255,.22);

  /* 深色背景上的文字：主文字 / 次要文字 / 最弱文字 */
  --ink:#f6eff7; --mute:#b9adca; --dim:#8b7fa1;

  /* 浅色（黄昏）背景上的文字 */
  --dusk-ink:#2a1a3c; --dusk-mute:#5a466f;

  /* 品牌点缀色：玫瑰粉 / 深玫瑰 / 蜜桃 / 薰衣草 / 鼠尾草绿（认证、成功状态） */
  --rose:#f2a4b6; --rose-deep:#b8475f; --peach:#f8d3c3; --lilac:#c3aef2; --sage:#a9c6b4;

  /* 字体：英文 Onest，中文 Noto Sans SC，后面是系统字体备用 */
  --f-sans:"Onest","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;

  /* 页面左右留白：手机 16px，大屏最多 48px */
  --gutter:clamp(16px,4vw,48px);

  color-scheme:dark;
}