@charset "UTF-8";
/* ============================================================
   自己改样式就改这个文件（custom.css）
   ------------------------------------------------------------
   它是最后加载的样式表，写在里面的规则会覆盖页面里原来的样式，
   所以你只改这里就够了，不用去动 index.html / staff.html / admin.html。

   改完保存即生效（页面每次请求都重新读文件，不用重启服务、也不用换二维码）。

   提示：如果你把本文件用浏览器直接打开（file:// 双击打开）出现中文乱码，
   那是浏览器在猜编码 —— 本文件已声明 @charset "UTF-8"，用文本编辑器
   （文本编辑.app / VS Code）打开一定正常；也可访问
   http://127.0.0.1:8080/assets/custom.css 在浏览器里看。
   想反悔：把这个文件里加的东西删掉即可，原来的样式一直在页面里。

   下面每一段都标了「原来是什么」，改完记得刷新手机页面看看效果。
   ============================================================ */

/* ---------- 1. 字体 ---------- */
/* 原来：-apple-system,"PingFang SC","Microsoft YaHei",sans-serif
   想换字体：把新字体名加在最前面；手机上没有这个字体时会自动用后面的兜底。
   例：body{font-family:"PingFang SC","Microsoft YaHei",sans-serif} */
body {
  /* font-family: "PingFang SC", "Microsoft YaHei", sans-serif; */
}

/* 若要换成自定义字体文件（例如把 xxx.ttf 放到 server/pages/assets/ 下）：
@font-face {
  font-family: "活动字体";
  src: url("/assets/xxx.ttf") format("truetype");
  font-display: swap;
}
body, .hero h1 { font-family: "活动字体", "PingFang SC", sans-serif; }
*/

/* ---------- 2. 主色调 ---------- */
/* 原来：--red:#c8262c（主色/按钮） --red2:#e0563a（渐变第二色） --muted:#8a8f99（次要文字） */
:root {
  /* --red: #c8262c; */
  /* --red2: #e0563a; */
}

/* Top 图（红色 hero）的背景渐变；想换深一点/浅一点的品牌色就改这里 */
.hero {
  /* background: linear-gradient(160deg, #c8262c, #e0563a); */
}

/* ---------- 3. 标题与「赢」字 ---------- */
/* 原来：标题 22px；「赢」字 2em（=44px）、黄色 #ffd400、白边 3.5px */
.hero h1 {
  /* font-size: 22px; */          /* 整行字号 */
  /* font-weight: 700; */
}
.hero h1 .win {
  /* color: #ffd400; */           /* 黄字 */
  /* -webkit-text-stroke: 3.5px #fff; */  /* 白边粗细 */
  /* font-size: 2em; */           /* 放大倍数（2em = 2 倍） */
  /* margin-right: 2px; */        /* 与后面文字的距离 */
}

/* ---------- 4. 卡片与按钮 ---------- */
.card {
  /* border-radius: 14px; */
  /* padding: 18px; */
}
button {
  /* background: var(--red); */
  /* border-radius: 24px; */
}

/* ---------- 5. 顶部宣传图 ---------- */
.brand-banner {
  /* width: 100%; */              /* 自适应窗口宽度 */
  /* max-width: 100%; */          /* 想在电脑上限制宽度就写 max-width:900px; 并加 margin:0 auto 16px; */
}
