/* checkhub-web · 主题与布局。日/夜双主题用 CSS 变量，组件只写一遍。 */
body.light{
  --app-bg:#e9edf2; --scr-bg:#fff; --text:#16261d; --head:#0b3d66; --sub:#6b8278;
  --brand:#0b3d66; --logo-grad:#0e9f6e; --logo-ink:#fff; --border:#eef2f0;
  --field-bg:#fff; --field-border:#cfe6dc; --field-text:#16261d; --field-radius:30px; --field-shadow:0 6px 16px rgba(14,159,110,.12);
  --btn-radius:30px; --btn-main-bg:#0e9f6e; --btn-main-text:#fff; --btn-main-shadow:0 8px 18px rgba(14,159,110,.28);
  --btn-soft-bg:#fff; --btn-soft-text:#b42318; --btn-soft-border:#fcc9c2;
  --accent:#0e9f6e; --stat-bg:#f3faf7; --stat-border:#dcefe5;
  --hero-bg:linear-gradient(160deg,#e7f8f0,#f3fbf7); --hero-border:1px solid #d6efe3;
  --risk-vbg:#fff5f4; --risk-vborder:#fcc9c2; --risk-ico:#e8412f; --risk-glow:none; --risk-title:#d92d20; --risk-soft:#fff5f4;
  --warn-vbg:#fffaeb; --warn-vborder:#fec84b; --warn-ico:#b54708; --warn-title:#b54708;
  --amber-bg:#fffaeb; --amber-text:#b54708; --amber-border:#fec84b;
  --safe-bg:#ecfdf3; --safe-text:#067647; --safe-border:#75e0a7;
  --chip-bg:#fdeeec; --chip-text:#d92d20; --chip-border:#fcc9c2;
  --vn:#16261d; --soft-bg:#f3faf7; --card-bg:#fff; --navy-ico:#0b3d66;
}
body.dark{
  --app-bg:#2a313b; --scr-bg:radial-gradient(120% 60% at 50% -6%, rgba(45,212,191,.18), transparent 60%), #0c1420;
  --text:#e6ecf4; --head:#fff; --sub:#93a4b8;
  --brand:#fff; --logo-grad:linear-gradient(135deg,#2dd4bf,#0e9f6e); --logo-ink:#04231d; --border:rgba(255,255,255,.08);
  --field-bg:rgba(255,255,255,.06); --field-border:rgba(255,255,255,.14); --field-text:#fff; --field-radius:14px; --field-shadow:none;
  --btn-radius:13px; --btn-main-bg:linear-gradient(135deg,#2dd4bf,#0e9f6e); --btn-main-text:#04231d; --btn-main-shadow:none;
  --btn-soft-bg:rgba(255,255,255,.07); --btn-soft-text:#cfe9e2; --btn-soft-border:rgba(255,255,255,.14);
  --accent:#2dd4bf; --stat-bg:rgba(255,255,255,.05); --stat-border:rgba(255,255,255,.09);
  --hero-bg:transparent; --hero-border:none;
  --risk-vbg:radial-gradient(120% 90% at 50% 0%, rgba(244,63,94,.28), rgba(244,63,94,.05)); --risk-vborder:rgba(244,63,94,.4);
  --risk-ico:#f43f5e; --risk-glow:0 0 30px rgba(244,63,94,.5); --risk-title:#ff8b9a; --risk-soft:rgba(244,63,94,.1);
  --warn-vbg:radial-gradient(120% 90% at 50% 0%, rgba(251,191,36,.2), rgba(251,191,36,.04)); --warn-vborder:rgba(251,191,36,.4);
  --warn-ico:#d9a93f; --warn-title:#fbbf24;
  --amber-bg:rgba(251,191,36,.15); --amber-text:#fbbf24; --amber-border:rgba(251,191,36,.35);
  --safe-bg:rgba(45,212,191,.13); --safe-text:#5eead4; --safe-border:rgba(45,212,191,.35);
  --chip-bg:rgba(244,63,94,.12); --chip-text:#ff8b9a; --chip-border:rgba(244,63,94,.3);
  --vn:#fff; --soft-bg:rgba(255,255,255,.05); --card-bg:rgba(255,255,255,.03); --navy-ico:#0e9f6e;
}

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;background:var(--app-bg);
  -webkit-font-smoothing:antialiased;line-height:1.5;color:var(--text);transition:background .3s}
.app{max-width:480px;margin:0 auto;min-height:100vh;background:var(--scr-bg);
  box-shadow:0 0 60px rgba(8,16,28,.12)}
.scr,.btn,.field,.verdict,.stat,.chip,.rowline,.seeall,.disc,.rep-card{
  transition:background-color .25s,color .25s,border-color .25s,box-shadow .25s}

.appbar{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--border);position:sticky;top:0;
  background:var(--scr-bg);z-index:5}
.brand{display:flex;align-items:center;gap:8px;font-weight:800;font-size:16px;color:var(--brand);text-decoration:none}
.brand .d{width:21px;height:21px;border-radius:7px;display:flex;align-items:center;justify-content:center;
  background:var(--logo-grad);color:var(--logo-ink);font-size:12px}
.appbar .sp{flex:1}
.tg{cursor:pointer;border:1px solid var(--border);background:transparent;color:var(--brand);
  font-size:13px;font-weight:700;padding:8px 13px;border-radius:30px}
.back{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--sub);text-decoration:none;font-weight:600}

.scr{padding:20px 17px 28px}
.hero{margin:-20px -17px 20px;padding:26px 18px 24px;background:var(--hero-bg);border-bottom:var(--hero-border)}
.badge-pill{display:inline-block;font-size:11px;font-weight:700;color:var(--accent);
  background:var(--stat-bg);border:1px solid var(--stat-border);border-radius:20px;padding:5px 11px;margin-bottom:13px}
h1.h{font-size:24px;font-weight:800;line-height:1.2;color:var(--head);margin-bottom:8px;letter-spacing:-.02em}
h1.h .hl{color:var(--accent)}
p.s{font-size:13.5px;color:var(--sub);margin-bottom:16px}

.field{display:flex;align-items:center;background:var(--field-bg);border:1.5px solid var(--field-border);
  border-radius:var(--field-radius);padding:4px 6px 4px 6px;box-shadow:var(--field-shadow);overflow:hidden}
.dialsel{appearance:none;-webkit-appearance:none;border:0;outline:none;cursor:pointer;
  background:transparent;color:var(--field-text);font-size:14px;font-weight:700;
  padding:12px 22px 12px 12px;border-right:1.5px solid var(--field-border);
  background-image:linear-gradient(45deg,transparent 50%,var(--sub) 50%),linear-gradient(135deg,var(--sub) 50%,transparent 50%);
  background-position:calc(100% - 13px) 50%,calc(100% - 8px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.dialsel option{color:#16261d}
.field input{flex:1;min-width:0;border:0;outline:none;font-size:15px;padding:12px 12px;background:none;color:var(--field-text)}

.btn{display:block;text-align:center;text-decoration:none;border:0;cursor:pointer;width:100%;
  border-radius:var(--btn-radius);padding:14px;font-size:14px;font-weight:700;margin-top:11px}
.btn small{display:block;font-weight:500;font-size:11px;opacity:.85;margin-top:2px}
.btn-main{background:var(--btn-main-bg);color:var(--btn-main-text);box-shadow:var(--btn-main-shadow)}
.btn-soft{background:var(--btn-soft-bg);color:var(--btn-soft-text);border:1.5px solid var(--btn-soft-border)}

.stats{display:flex;gap:9px;margin-top:22px}
.stat{flex:1;text-align:center;background:var(--stat-bg);border:1px solid var(--stat-border);border-radius:14px;padding:13px 6px}
.stat .ic{font-size:15px;display:block;margin-bottom:3px}
.stat b{display:block;font-size:18px;color:var(--accent);font-weight:800} .stat span{font-size:10px;color:var(--sub)}
.foot-note{font-size:11px;color:var(--sub);margin-top:16px;text-align:center;line-height:1.5}

/* How it works */
.how{margin-top:26px;padding-top:22px;border-top:1px solid var(--border)}
.how-title{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--sub);margin-bottom:14px}
.how-step{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px}
.how-step .n{flex:none;width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;
  font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center}
.how-step b{display:block;font-size:13.5px;color:var(--text)} .how-step span{font-size:12px;color:var(--sub)}

.verdict{border-radius:18px;padding:22px;text-align:center;margin-bottom:14px}
.verdict.risk{background:var(--risk-vbg);border:1px solid var(--risk-vborder)}
.verdict.warn{background:var(--warn-vbg);border:1px solid var(--warn-vborder)}
.vico{width:50px;height:50px;border-radius:50%;color:#fff;font-size:26px;
  display:inline-flex;align-items:center;justify-content:center;margin-bottom:10px}
.risk .vico{background:var(--risk-ico);box-shadow:var(--risk-glow)} .warn .vico{background:var(--warn-ico)}
.vt{font-size:19px;font-weight:800;letter-spacing:.03em}
.risk .vt{color:var(--risk-title)} .warn .vt{color:var(--warn-title)}
.vn{font-size:15px;color:var(--vn);font-weight:600;margin-top:4px}
.vs{font-size:12px;color:var(--sub);margin-top:4px}

.center{text-align:center}
.pill{display:inline-block;font-size:11px;font-weight:700;padding:4px 11px;border-radius:20px;
  background:var(--amber-bg);color:var(--amber-text);border:1px solid var(--amber-border)}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:13px 0}
.chip{font-size:11px;border-radius:8px;padding:5px 10px;font-weight:600;
  background:var(--chip-bg);color:var(--chip-text);border:1px solid var(--chip-border)}
.rowline{display:flex;justify-content:space-between;font-size:13px;padding:11px 2px;border-bottom:1px solid var(--border)}
.rowline span:first-child{color:var(--sub)} .rowline b{color:var(--text);font-weight:600}
.seeall{display:flex;justify-content:space-between;align-items:center;text-decoration:none;margin-top:14px;
  padding:14px 15px;border-radius:12px;background:var(--risk-soft);border:1px solid var(--risk-vborder);
  color:var(--risk-title);font-size:13px;font-weight:700}
.seeall .ar{font-size:18px;line-height:1}
.disc{font-size:11.5px;color:var(--sub);background:var(--soft-bg);border-radius:10px;padding:12px;margin:14px 0;line-height:1.5}

.badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px}
.badge.community{background:var(--amber-bg);color:var(--amber-text);border:1px solid var(--amber-border)}
.badge.verified{background:var(--safe-bg);color:var(--safe-text);border:1px solid var(--safe-border)}
.mini{display:flex;align-items:center;gap:10px;background:var(--risk-soft);border:1px solid var(--risk-vborder);
  border-radius:11px;padding:11px 12px;margin:12px 0 14px}
.mini .mico{width:30px;height:30px;border-radius:50%;background:var(--risk-ico);color:#fff;flex:none;
  display:flex;align-items:center;justify-content:center;font-size:15px}
.mini b{font-size:13px;color:var(--risk-title)} .mini span{font-size:11px;color:var(--sub);display:block}
.rep-card{border:1px solid var(--border);border-radius:11px;padding:13px;margin-bottom:10px;background:var(--card-bg)}
.rep-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.rep-head .date{font-size:11px;color:var(--sub)}
.rep-type{font-size:13px;font-weight:700;color:var(--text);margin-bottom:3px}
.rep-desc{font-size:12px;color:var(--sub);line-height:1.45}
.rep-meta{display:flex;gap:8px;margin-top:9px;font-size:11px;color:var(--sub);align-items:center}
.rep-meta .ev{background:var(--soft-bg);border-radius:5px;padding:2px 7px}

.step{display:flex;gap:11px;margin-bottom:14px;align-items:flex-start}
.step .n{flex:none;width:25px;height:25px;border-radius:50%;background:var(--navy-ico);color:#fff;
  font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.step .t b{display:block;font-size:13px;color:var(--text)} .step .t span{color:var(--sub);font-size:12px}
.err{font-size:14px;color:var(--sub);text-align:center;padding:30px 10px}