/* ============================================================
 * 冠军大脑 · 设计系统
 *
 * 方向：高端咨询报告 / 杂志内页
 *   墨绿为主色，衬线标题，细线分隔，无阴影无渐变。
 *   留白优先于装饰——「高级」来自克制，不来自元素堆叠。
 * ========================================================== */

:root{
  /* ---------- 色 ---------- */
  --paper:#FBFBF9;          /* 中性白，比暖白冷，更干净 */
  --card:#FFFFFF;
  --ink:#14171A;            /* 近黑，不用纯黑（纯黑在小屏上发死） */
  --ink-2:#3D4449;          /* 正文 */
  --ink-3:#6B7378;          /* 次要 */
  --ink-4:#9AA1A6;          /* 极次要 / 占位 */

  --brand:#1C3A33;          /* 墨绿：主色 */
  --brand-2:#2E5A4E;        /* 亮一档，用于 hover */
  --accent:#B08A3E;         /* 陈金：只用于极少强调，不当主色 */
  --accent-bg:#F6F1E4;

  --hair:#E4E4E0;           /* 细线 */
  --hair-2:#EFEFEC;         /* 更细的线 */

  --danger:#8C3A2B;
  --danger-bg:#FBF2F0;

  /* ---------- 排版 ---------- */
  --serif:"Songti SC","Noto Serif SC","Source Han Serif SC","STSong",Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;

  /* ---------- 尺寸 ---------- */
  --r:10px;
  --r-sm:6px;
  --gut:22px;               /* 页面左右留白 */
  --safe-b:env(safe-area-inset-bottom,0px);
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}

html,body{height:100%;margin:0}

body{
  background:var(--paper);
  color:var(--ink);
  font:16px/1.7 var(--sans);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overscroll-behavior-y:none;
}

#app{height:100%;position:relative;overflow:hidden}

/* ---------- 视图 ---------- */
.view{position:absolute;inset:0;display:none;flex-direction:column;background:var(--paper)}
.view.is-active{display:flex}

.scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
.pad{padding:0 var(--gut)}

/* ============================================================
 * 顶栏
 * ========================================================== */
.bar{
  flex-shrink:0;
  display:flex;align-items:center;gap:14px;
  padding:calc(env(safe-area-inset-top,0px) + 18px) var(--gut) 14px;
}
.bar__t{
  font-family:var(--serif);
  font-size:17px;font-weight:600;letter-spacing:.12em;
  flex:1;
}
.bar__t--c{text-align:center}
.bar__a{
  background:none;border:0;padding:4px 0;font:inherit;font-size:13.5px;
  color:var(--ink-3);cursor:pointer;letter-spacing:.04em;flex-shrink:0;
}
.bar__a:hover{color:var(--brand)}
.bar__back{
  width:32px;height:32px;margin-left:-8px;flex-shrink:0;
  display:grid;place-items:center;background:none;border:0;padding:0;
  color:var(--ink);cursor:pointer;border-radius:50%;
}
.bar__back svg{width:19px;height:19px}
.bar__back:hover{background:rgba(20,23,26,.05)}

/* 顶部的细分隔线 */
.bar::after{
  content:'';position:absolute;left:0;right:0;
}
.rule{height:1px;background:var(--hair);margin:0 var(--gut)}

/* ============================================================
 * 首页
 * ========================================================== */
.cover{padding:44px 0 0}

/* 刊物式的刊头 */
.masthead{
  font-family:var(--serif);
  font-size:11.5px;letter-spacing:.42em;
  color:var(--ink-4);text-transform:uppercase;
  margin-bottom:30px;
}

.cover__h{
  font-family:var(--serif);
  font-size:31px;font-weight:600;line-height:1.42;
  letter-spacing:.01em;
  margin:0 0 18px;color:var(--ink);
}
.cover__h em{
  font-style:normal;
  border-bottom:1px solid var(--accent);
  padding-bottom:1px;
}
.cover__sub{
  margin:0 0 40px;font-size:15px;line-height:1.85;
  color:var(--ink-3);max-width:30em;
}

/* 上传区：细线框，不用虚线 */
.drop{
  position:relative;display:block;width:100%;
  border:1px solid var(--hair);border-radius:var(--r);
  background:var(--card);
  padding:34px 20px 30px;text-align:center;
  transition:border-color .2s,background .2s;
}
.drop:hover{border-color:var(--brand);background:#FDFDFC}

.drop__ico{width:34px;height:34px;margin:0 auto 16px;color:var(--ink-4)}
.drop__ico svg{width:100%;height:100%}
.drop__t{font-size:15px;font-weight:500;color:var(--ink)}
.drop__s{margin-top:6px;font-size:13px;color:var(--ink-4);letter-spacing:.02em}

/* 拍照 / 相册 两个入口并排 */
.drop__acts{
  display:flex;gap:10px;margin-top:22px;
}
.drop__btn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:7px;
  padding:13px 10px;border:0;border-radius:var(--r-sm);
  font:inherit;font-size:14px;font-weight:500;letter-spacing:.04em;
  background:var(--brand);color:#F7F7F5;cursor:pointer;
  transition:background .18s;
}
.drop__btn:hover{background:var(--brand-2)}
.drop__btn:active{background:#162E28}
.drop__btn svg{width:16px;height:16px;flex:none}

.drop__btn--ghost{
  background:transparent;color:var(--ink-2);
  box-shadow:inset 0 0 0 1px var(--hair);
}
.drop__btn--ghost:hover{background:#F2F2EF;color:var(--ink)}

.drop__img{
  display:none;width:100%;max-width:200px;margin:0 auto;
  border-radius:var(--r-sm);aspect-ratio:1/1;object-fit:cover;
}
.drop.has .drop__empty{display:none}
.drop.has .drop__img{display:block}
.drop.has{padding:14px}

/* 已选照片后的「换一张」——浮在图片右下角 */
.drop__again{
  display:none;margin:12px auto 0;padding:8px 18px;
  border:0;border-radius:100px;background:transparent;color:var(--ink-3);
  box-shadow:inset 0 0 0 1px var(--hair);
  font:inherit;font-size:13px;cursor:pointer;transition:background .18s,color .18s;
}
.drop__again:hover{background:#F2F2EF;color:var(--ink)}
.drop.has .drop__again{display:block}

/* 主按钮：墨绿实心，克制的小圆角 */
.btn{
  display:flex;align-items:center;justify-content:center;
  width:100%;padding:17px;border:0;border-radius:var(--r);
  font:inherit;font-size:15.5px;font-weight:500;letter-spacing:.06em;
  cursor:pointer;transition:background .18s,opacity .18s;
}
.btn--p{background:var(--brand);color:#F7F7F5}
.btn--p:not(:disabled):hover{background:var(--brand-2)}
.btn--p:not(:disabled):active{background:#162E28}
.btn--p:disabled{background:#E9E9E6;color:var(--ink-4);cursor:not-allowed}

.note{
  margin:20px 0 0;font-size:12.5px;line-height:1.8;
  color:var(--ink-4);text-align:center;
}

/* ============================================================
 * 分析中
 * ========================================================== */
.loading{
  flex:1;display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:0 var(--gut) 60px;text-align:center;
}
.loading__ring{
  width:150px;height:150px;border-radius:50%;
  overflow:hidden;position:relative;
  border:1px solid var(--hair);
  margin-bottom:32px;
}
.loading__ring img{width:100%;height:100%;object-fit:cover;filter:grayscale(.12)}
.loading__scan{
  position:absolute;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--brand),transparent);
  animation:sc 2.2s cubic-bezier(.45,0,.55,1) infinite;
}
@keyframes sc{0%,100%{top:8%}50%{top:92%}}

.loading__t{
  font-family:var(--serif);font-size:19px;font-weight:600;
  letter-spacing:.04em;margin:0 0 10px;
}
.loading__s{font-size:13.5px;color:var(--ink-4);margin:0 0 30px;min-height:20px;letter-spacing:.03em}

/* 进度：极细线，不用粗条 */
.pbar{width:100%;max-width:230px;height:1px;background:var(--hair);position:relative;overflow:hidden}
.pbar__f{position:absolute;inset:0 auto 0 0;width:0;background:var(--brand);transition:width .4s ease}

.steps{list-style:none;margin:34px 0 0;padding:0;width:100%;max-width:230px;text-align:left}
.steps li{
  font-size:13px;color:var(--ink-4);padding:8px 0 8px 26px;
  position:relative;letter-spacing:.03em;transition:color .35s;
  opacity:0;transform:translateY(8px);
  animation:stepIn .5s cubic-bezier(.16,1,.3,1) forwards;
}
.steps li:nth-child(1){animation-delay:.05s}
.steps li:nth-child(2){animation-delay:.16s}
.steps li:nth-child(3){animation-delay:.27s}
.steps li:nth-child(4){animation-delay:.38s}
@keyframes stepIn{to{opacity:1;transform:none}}

/* 每步前面是一条会生长的短线 */
.steps li::before{
  content:'';position:absolute;left:0;top:50%;width:9px;height:1px;
  background:var(--hair);transform:translateY(-50%);
  transition:background .35s,width .45s cubic-bezier(.16,1,.3,1);
}

/* 已完成：短线生长 + 变色，文字沉下来 */
.steps li.done{color:var(--ink-2)}
.steps li.done::before{background:var(--brand);width:16px}

/* 当前进行中：呼吸 */
.steps li.now{
  color:var(--ink);font-weight:500;
}
.steps li.now::before{
  background:var(--accent);width:16px;
  animation:nowPulse 1.4s ease-in-out infinite;
}
@keyframes nowPulse{
  0%,100%{opacity:1;transform:translateY(-50%) scaleX(1)}
  50%{opacity:.35;transform:translateY(-50%) scaleX(.45)}
}

/* 分析标题也给出轻微的入场 */
.loading__t{animation:stepIn .6s .1s cubic-bezier(.16,1,.3,1) both}

/* ============================================================
 * 报告
 * ========================================================== */
.rp{padding-bottom:calc(56px + var(--safe-b))}

/* 报告主体：逐段浮入，长页面有了呼吸感 */
.rp > *{
  animation:rpIn .55s cubic-bezier(.16,1,.3,1) both;
}
.rp > *:nth-child(1){animation-delay:.02s}
.rp > *:nth-child(2){animation-delay:.08s}
.rp > *:nth-child(3){animation-delay:.14s}
.rp > *:nth-child(4){animation-delay:.2s}
.rp > *:nth-child(5){animation-delay:.26s}
.rp > *:nth-child(6){animation-delay:.32s}
.rp > *:nth-child(7){animation-delay:.38s}
.rp > *:nth-child(8){animation-delay:.44s}
.rp > *:nth-child(n+9){animation-delay:.5s}
@keyframes rpIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* --- 报告头：深色压底，这是整份报告的重心 --- */
.rp__hero{
  margin:0 calc(var(--gut) * -1);            /* 抵消父级 padding，做成通栏 */
  padding:34px var(--gut) 34px;
  background:var(--brand);
  color:#F4F3EF;
  margin-bottom:34px;
}
.rp__hero::after{content:none}

.rp__kicker{
  font-family:var(--serif);font-size:11px;letter-spacing:.4em;
  color:rgba(244,243,239,.55);margin-bottom:18px;
}

/* 大数字：衬线 + 金色，深底上足够醒目 */
.rp__num{
  font-family:var(--serif);
  font-size:76px;line-height:.92;font-weight:600;
  letter-spacing:-.02em;color:#EFCE7A;
  display:flex;align-items:baseline;gap:12px;margin-bottom:10px;
}
.rp__num i{font-size:15px;font-style:normal;color:rgba(244,243,239,.5);letter-spacing:.1em;font-family:var(--sans)}
/* 匹配度是「高/中/低」这种词，不是数字，字号收一档 */
.rp__num--word{font-size:52px}
.rp__num--word.is-low span{color:#E8A498}
/* 低匹配时整个头版换警示色调（深红棕），一眼看出「这条路要慎重」 */
.rp__hero.is-low{background:#4A2B24}
.rp__hero.is-low .rp__num{color:#E8A498}
.rp__numlabel{
  font-size:12.5px;letter-spacing:.2em;color:rgba(244,243,239,.85);
  margin-bottom:22px;
}
.rp__type{
  font-family:var(--serif);font-size:30px;font-weight:600;
  line-height:1.35;margin:0 0 12px;letter-spacing:.02em;color:#F7F6F2;
}
.rp__verdict{margin:0;font-size:14.5px;line-height:1.85;color:rgba(244,243,239,.82)}

/* --- 气质刻度 --- */
.scale{display:flex;flex-direction:column;gap:0}
.scale__r{
  display:grid;grid-template-columns:54px 1fr 26px;
  align-items:center;gap:14px;
  padding:10px 0;border-bottom:1px solid var(--hair-2);
}
.scale__r:last-child{border-bottom:0}
.scale__n{font-size:13px;color:var(--ink-2);letter-spacing:.05em}
.scale__b{height:1px;background:var(--hair);position:relative}
.scale__b span{
  position:absolute;left:0;top:-1px;height:3px;width:var(--w,0);
  background:var(--brand);
  transition:width .9s cubic-bezier(.16,1,.3,1);
}
.scale__r.is-top .scale__b span{background:var(--accent);height:4px;top:-1.5px}
.scale__v{
  font-family:var(--serif);font-size:15px;color:var(--ink-2);
  text-align:right;font-variant-numeric:tabular-nums;
}
.scale__r.is-top .scale__n{color:var(--ink);font-weight:600}
.scale__r.is-top .scale__v{color:var(--accent);font-weight:600}

/* --- 章节 --- */
.ch{margin-bottom:38px}
.ch__n{
  font-family:var(--serif);font-size:11px;letter-spacing:.34em;
  color:var(--accent);margin-bottom:10px;font-weight:600;
}
.ch__t{
  font-family:var(--serif);font-size:22px;font-weight:600;
  letter-spacing:.03em;margin:0 0 20px;line-height:1.4;
  padding-bottom:14px;border-bottom:1px solid var(--ink);
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
}
.ch__t small{font-size:12px;font-weight:400;color:var(--ink-4);letter-spacing:.05em;font-family:var(--sans)}
.ch__b{font-size:15px;line-height:1.92;color:var(--ink-2)}
.ch__b p{margin:0 0 14px}
.ch__b p:last-child{margin-bottom:0}
.ch__b strong{color:var(--ink);font-weight:600}
.ch__lead{font-size:15.5px;color:var(--ink);line-height:1.88;margin-bottom:16px}

/* --- 条款：左侧竖线；第一条金色加重 --- */
.clause{
  padding:15px 0 15px 18px;border-left:2px solid var(--hair);
  margin-bottom:2px;transition:border-color .25s;
}
.clause:hover{border-left-color:var(--brand)}
.clause--hi{border-left-color:var(--accent);background:linear-gradient(90deg,rgba(176,138,62,.06),transparent 70%)}
.clause--hi .clause__h{color:var(--ink)}
.clause__h{
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  font-size:15.5px;font-weight:600;color:var(--ink);margin-bottom:8px;
}
.clause__h .pct{
  font-family:var(--serif);font-size:17px;color:var(--accent);
  font-variant-numeric:tabular-nums;margin-left:auto;font-weight:600;
}
.clause__b{font-size:14px;line-height:1.85;color:var(--ink-2);margin:0}
.clause__b + .clause__b{margin-top:7px}
.clause__b b{color:var(--ink);font-weight:600}
.clause__tag{
  display:inline-block;font-size:12px;color:var(--ink-3);
  border:1px solid var(--hair);border-radius:3px;
  padding:2px 7px;margin:8px 6px 0 0;letter-spacing:.03em;
}
.clause__risk{
  margin-top:9px;font-size:13.5px;color:var(--danger);
  padding-left:14px;position:relative;line-height:1.7;
}
.clause__risk::before{content:'注意';position:absolute;left:0;top:0;font-size:10px;letter-spacing:.1em;color:var(--danger);opacity:.55;writing-mode:vertical-rl;letter-spacing:.06em}

/* --- 权重标记 --- */
.wt{
  font-size:11px;letter-spacing:.1em;padding:2px 6px;
  border-radius:3px;font-weight:500;flex-shrink:0;
}
.wt--core{background:var(--danger-bg);color:var(--danger)}
.wt--key{background:var(--accent-bg);color:#8A6A28}
.wt--opt{background:#F2F2EF;color:var(--ink-4)}

/* --- 阶段流程 --- */
.flow{counter-reset:f;margin-top:4px}
.flow__i{
  position:relative;padding:0 0 20px 30px;
  border-left:1px solid var(--hair);margin-left:7px;
}
.flow__i:last-child{border-left-color:transparent;padding-bottom:0}
.flow__i::before{
  counter-increment:f;content:counter(f,decimal-leading-zero);
  position:absolute;left:-11px;top:1px;
  width:22px;height:22px;border-radius:50%;
  background:var(--paper);border:1px solid var(--hair);
  font-size:10px;color:var(--ink-3);
  display:grid;place-items:center;letter-spacing:.02em;
}
.flow__t{font-size:14.5px;font-weight:600;color:var(--ink);margin:0 0 5px}
.flow__d{font-size:13.5px;line-height:1.8;color:var(--ink-2);margin:0}
.flow__d em{font-style:normal;color:var(--ink-3)}

/* --- 提醒块 --- */
.callout{
  border:1px solid var(--hair);border-left:3px solid var(--accent);
  border-radius:0 var(--r-sm) var(--r-sm) 0;
  background:var(--accent-bg);padding:17px 19px;
}
.callout__t{
  font-family:var(--serif);font-size:14px;font-weight:600;
  letter-spacing:.08em;color:#7A5C1F;margin-bottom:8px;
}
.callout p{margin:0;font-size:14px;line-height:1.88;color:#5C4A21}

/* --- 提示条 --- */
.tip{
  border:1px solid var(--hair);border-radius:var(--r-sm);
  padding:12px 15px;font-size:13px;line-height:1.75;
  color:var(--ink-3);background:var(--card);margin-bottom:24px;
}

/* --- 历史 --- */
.hi{
  display:flex;gap:14px;align-items:center;
  padding:16px 0;border-bottom:1px solid var(--hair);
  cursor:pointer;
}
.hi:hover{opacity:.72}
.hi img,.hi__ph{
  width:46px;height:46px;border-radius:var(--r-sm);
  object-fit:cover;flex-shrink:0;border:1px solid var(--hair);
}
.hi__ph{background:#F2F2EF}
.hi__x{flex:1;min-width:0}
.hi__x h4{
  margin:0 0 4px;font-size:14.5px;font-weight:600;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.hi__x p{
  margin:0;font-size:12.5px;color:var(--ink-4);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.02em;
}
.hi__d{
  font-family:var(--serif);font-size:13px;color:var(--ink-4);
  flex-shrink:0;font-variant-numeric:tabular-nums;
}

.empty{
  text-align:center;padding:90px var(--gut);
  font-family:var(--serif);font-size:15px;color:var(--ink-4);
  letter-spacing:.06em;line-height:2;
}

/* 底部操作 */
.foot{
  flex-shrink:0;padding:14px var(--gut) calc(var(--safe-b) + 16px);
  border-top:1px solid var(--hair);background:var(--paper);
  display:flex;gap:10px;
}
.foot .btn{flex:1;padding:15px;font-size:14.5px}
.btn--g{background:transparent;color:var(--ink-2);border:1px solid var(--hair)}
.btn--g:hover{border-color:var(--ink-3);color:var(--ink)}

/* ============================================================
 * 入口分叉（首页底部的另外两条路）
 * ========================================================== */
.alt{margin-top:38px;padding-top:26px;border-top:1px solid var(--hair)}
.alt__t{
  font-family:var(--serif);font-size:12px;letter-spacing:.22em;
  color:var(--ink-4);margin-bottom:6px;
}
.alt__i{
  display:flex;align-items:center;gap:12px;width:100%;
  padding:17px 0;border:0;border-bottom:1px solid var(--hair-2);
  background:none;font:inherit;text-align:left;cursor:pointer;
  transition:padding-left .2s;
}
.alt__i:hover{padding-left:6px}
.alt__i:last-child{border-bottom:0}
.alt__x{flex:1;min-width:0}
.alt__x h4{margin:0 0 5px;font-size:15px;font-weight:600;color:var(--ink)}
.alt__x p{margin:0;font-size:12.5px;line-height:1.6;color:var(--ink-4)}
.alt__i svg{width:17px;height:17px;color:var(--ink-4);flex-shrink:0;transition:transform .2s,color .2s}
.alt__i:hover svg{transform:translateX(3px);color:var(--brand)}

/* ============================================================
 * 表单
 * ========================================================== */
.form-intro{padding:26px 0 30px}
.form-intro__t{
  font-family:var(--serif);font-size:25px;font-weight:600;
  line-height:1.42;margin:0 0 14px;letter-spacing:.01em;
}
.form-intro__d{margin:0;font-size:14.5px;line-height:1.85;color:var(--ink-3)}

.field{margin-bottom:20px}
.field__l{
  display:block;font-size:13px;font-weight:500;color:var(--ink-2);
  margin-bottom:9px;letter-spacing:.04em;
}
.field__o{color:var(--ink-4);font-weight:400;font-size:12px}
.field__i{
  width:100%;padding:14px 15px;font:inherit;font-size:15px;
  color:var(--ink);background:var(--card);
  border:1px solid var(--hair);border-radius:var(--r-sm);
  outline:none;transition:border-color .18s,box-shadow .18s;
  -webkit-appearance:none;appearance:none;
}
.field__i:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(28,58,51,.09)}
select.field__i{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7378' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:15px;
  padding-right:40px;
}

/* 问卷题 */
.q{padding:20px 0;border-bottom:1px solid var(--hair-2)}
.q:last-child{border-bottom:0}
.q__t{
  font-size:14.5px;font-weight:600;color:var(--ink);
  line-height:1.65;margin:0 0 13px;
}
.q__t i{
  font-style:normal;font-family:var(--serif);font-size:12px;
  color:var(--ink-4);margin-right:8px;letter-spacing:.06em;
}
.q__o{
  display:block;width:100%;text-align:left;
  padding:12px 15px;margin-bottom:7px;
  border:1px solid var(--hair);border-radius:var(--r-sm);
  background:var(--card);font:inherit;font-size:14px;
  color:var(--ink-2);cursor:pointer;line-height:1.55;
  transition:border-color .16s,background .16s,color .16s;
}
.q__o:last-child{margin-bottom:0}
.q__o:hover{border-color:var(--ink-4)}
.q__o.on{border-color:var(--brand);background:#F1F5F3;color:var(--ink);font-weight:500}

.form-foot{padding:22px 0 8px;text-align:center}
.form-foot__n{font-size:13px;color:var(--ink-4);letter-spacing:.04em}

/* 选择卡片 */
.pick{display:flex;flex-direction:column;gap:8px}
.pick__i{
  display:flex;align-items:center;gap:11px;width:100%;
  padding:15px 16px;border:1px solid var(--hair);border-radius:var(--r-sm);
  background:var(--card);font:inherit;text-align:left;cursor:pointer;
  transition:border-color .16s,background .16s;
}
.pick__i:hover{border-color:var(--ink-4)}
.pick__i.on{border-color:var(--brand);background:#F1F5F3}
.pick__x{flex:1;min-width:0}
.pick__x h5{margin:0 0 4px;font-size:14.5px;font-weight:600;color:var(--ink)}
.pick__x p{margin:0;font-size:12.5px;line-height:1.55;color:var(--ink-4)}
.pick__i.on .pick__x h5{color:var(--brand)}

/* 报告底部的下一步引导 */
.next{
  margin-top:34px;padding-top:26px;border-top:1px solid var(--hair);
}
.next__t{
  font-family:var(--serif);font-size:12px;letter-spacing:.22em;
  color:var(--ink-4);margin-bottom:6px;
}
.next__b{margin:0 0 18px;font-size:14px;line-height:1.75;color:var(--ink-3)}
.next .btn{margin-bottom:10px}

/* 报告类型标记 */
.rp__kind{
  display:inline-block;font-size:10.5px;letter-spacing:.18em;
  color:var(--ink-4);border:1px solid var(--hair);
  border-radius:3px;padding:3px 8px;margin-bottom:14px;
}

/* 历史条目上的类型标签 */
.hi__k{
  font-size:10px;letter-spacing:.1em;padding:2px 6px;
  border-radius:3px;background:#F2F2EF;color:var(--ink-4);
  margin-left:6px;vertical-align:middle;font-weight:400;
}

/* ---------- toast ---------- */
.toast{
  position:fixed;left:50%;bottom:calc(var(--safe-b) + 34px);
  transform:translate(-50%,12px);
  background:var(--ink);color:#F7F7F5;
  padding:12px 20px;border-radius:var(--r-sm);
  font-size:13.5px;letter-spacing:.02em;line-height:1.55;
  opacity:0;pointer-events:none;z-index:99;
  transition:opacity .22s,transform .22s;
  max-width:86vw;text-align:center;
}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* 桌面预览：收成手机宽度 */
@media (min-width:640px){
  body{background:#F0F0ED}
  #app{max-width:430px;margin:0 auto;box-shadow:0 1px 40px rgba(20,23,26,.09)}
  .toast{bottom:44px}
}
