:root{
  --ground:#F0F2F4; --surface:#FFFFFF; --sunk:#E4E8EC;
  --line:#D3D9DF; --text:#151A21; --muted:#5C6672; --faint:#8A94A1;
  --out:#A9640F; --in:#14705A;
  --c1:#C77F14;--c2:#B45435;--c3:#9A414B;--c4:#6C4A80;--c5:#37598B;
  --c6:#1E7A66;--c7:#567C2E;--c8:#A2711C;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB",sans-serif;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#0D1014; --surface:#151A21; --sunk:#1C232C;
    --line:#232B36; --text:#E9ECF1; --muted:#7E8896; --faint:#5A6270;
    --out:#E8A33D; --in:#46B79A;
    --c1:#E8A33D;--c2:#D4785C;--c3:#B8686F;--c4:#8E6E9E;--c5:#5E7CA6;
    --c6:#4E9E8C;--c7:#7FA05A;--c8:#C9954A;
  }
}
:root[data-theme="dark"]{
  --ground:#0D1014; --surface:#151A21; --sunk:#1C232C;
  --line:#232B36; --text:#E9ECF1; --muted:#7E8896; --faint:#5A6270;
  --out:#E8A33D; --in:#46B79A;
  --c1:#E8A33D;--c2:#D4785C;--c3:#B8686F;--c4:#8E6E9E;--c5:#5E7CA6;
  --c6:#4E9E8C;--c7:#7FA05A;--c8:#C9954A;
}

*{box-sizing:border-box;}
body{
  margin:0; background:var(--ground); color:var(--text);
  font-family:var(--sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1000px; margin:0 auto; padding:0 28px;}
.prose{max-width:62ch;}
h2{
  font-size:13px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--muted); font-weight:600; margin:0 0 20px;
}
h3{font-size:19px; margin:0 0 8px; font-weight:600; text-wrap:balance;}
p{margin:0 0 16px; color:var(--muted);}
p strong{color:var(--text); font-weight:600;}
section{padding:76px 0 66px; border-top:1px solid var(--line);}
section:first-of-type{border-top:0;}
a{color:var(--out);}
:focus-visible{outline:2px solid var(--out); outline-offset:3px; border-radius:4px;}

/* ── Hero：产品就是一个数字，所以数字就是 hero ───────── */
.hero{padding:110px 0 84px;}
.eyebrow{
  font-family:var(--mono); font-size:12px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--faint); margin-bottom:26px;
}
.figure{
  font-family:var(--mono); font-weight:500; letter-spacing:-.045em;
  line-height:.92; font-size:clamp(60px,14vw,164px);
  font-variant-numeric:tabular-nums; margin-bottom:6px;
}
.figure .cents{font-size:.42em; color:var(--muted); letter-spacing:-.02em;}
.figure .sym{color:var(--out);}
.figure{margin-bottom:26px;}
.figure .cursor{
  display:inline-block; width:.055em; height:.72em; background:var(--out);
  margin-left:.06em; vertical-align:baseline; animation:blink 1.1s step-end infinite;
}
@keyframes blink{50%{opacity:0}}
.stamp{font-family:var(--mono); font-size:13px; color:var(--faint); margin-bottom:40px;}
.claim{font-size:clamp(21px,3vw,29px); line-height:1.35; color:var(--text);
       max-width:20ch; text-wrap:balance; margin:0 0 14px; font-weight:500;}
.sub{max-width:52ch; margin-bottom:38px;}

/* ── 安装命令 ─────────────────────────────────────── */
.cmd{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  background:var(--surface); border:1px solid var(--line);
  border-radius:10px; padding:15px 18px; max-width:520px;
}
.cmd code{font-family:var(--mono); font-size:14.5px; color:var(--text);}
.cmd code .dim{color:var(--faint);}
.copy{
  margin-left:auto; background:none; border:1px solid var(--line);
  color:var(--muted); font-family:var(--mono); font-size:12px;
  padding:5px 12px; border-radius:6px; cursor:pointer;
}
.copy:hover{border-color:var(--muted); color:var(--text);}
.after{font-family:var(--mono); font-size:13px; color:var(--faint); margin-top:12px;}

/* ── 签名：对账分解 ───────────────────────────────── */
.recon{margin-top:8px;}
.track{display:flex; width:100%; gap:3px; height:44px;}
.band{
  border-radius:4px; min-width:3px;
  transition:flex-grow 1.1s cubic-bezier(.4,0,.15,1),
             opacity .8s ease, transform 1.1s cubic-bezier(.4,0,.15,1);
}
.band.ghost{background:var(--sunk); border:1px dashed var(--faint);}
.recon.split .band.ghost{opacity:.42; transform:translateY(13px);}
.legend{
  display:flex; flex-wrap:wrap; gap:8px 22px; margin-top:22px;
  font-family:var(--mono); font-size:12.5px; color:var(--muted);
}
.legend span{display:flex; align-items:center; gap:8px;}
.dot{width:9px; height:9px; border-radius:2px; flex:none;}
.dot.ghost{background:var(--sunk); border:1px dashed var(--faint);}
.math{
  font-family:var(--mono); font-size:14px; margin-top:34px;
  border-collapse:collapse; font-variant-numeric:tabular-nums;
}
.math td{padding:5px 0;}
.math td:first-child{color:var(--faint); width:22px;}
.math td:nth-child(2){color:var(--muted); padding-right:38px;}
.math td:last-child{text-align:right;}
.math tr.sum td{border-top:1px solid var(--line); padding-top:11px; color:var(--text);}

/* ── 价格 ─────────────────────────────────────────── */
.prices{display:flex; flex-direction:column; gap:9px; margin-top:26px; max-width:560px;}
.price{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px;
       align-items:center; font-family:var(--mono); font-size:14px;}
.price .bar{height:26px; border-radius:4px; background:var(--sunk);
            display:flex; align-items:center; padding:0 11px; color:var(--muted);
            font-size:12.5px; white-space:nowrap; overflow:hidden;}
.price.ours .bar{background:var(--out); color:var(--ground); font-weight:600;}
.price .num{color:var(--muted); font-variant-numeric:tabular-nums;}
.price.ours .num{color:var(--out);}

/* ── 原则 ─────────────────────────────────────────── */
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(248px,1fr)); gap:34px; margin-top:30px;}
.card p{margin-bottom:0; font-size:15px;}
.card .k{
  font-family:var(--mono); font-size:12px; color:var(--out);
  letter-spacing:.08em; margin-bottom:11px; text-transform:uppercase;
}

/* ── 截图 ─────────────────────────────────────────── */
.shot{
  margin-top:30px; border:1px solid var(--line); border-radius:12px;
  overflow:hidden; background:var(--surface); line-height:0;
}
.shot img{width:100%; height:auto; display:block;}

/* ── 终端示例 ─────────────────────────────────────── */
pre{
  background:var(--surface); border:1px solid var(--line); border-radius:10px;
  padding:20px 22px; overflow-x:auto; font-family:var(--mono); font-size:13px;
  line-height:1.65; color:var(--muted); margin:0;
}
pre b{color:var(--text); font-weight:500;}
pre .o{color:var(--out);}

footer{padding:56px 0 76px; border-top:1px solid var(--line);
        font-family:var(--mono); font-size:13px; color:var(--faint);
        display:flex; gap:26px; flex-wrap:wrap;}

.reveal{opacity:0; transform:translateY(16px);
        transition:opacity .7s ease, transform .7s cubic-bezier(.3,0,.2,1);}
.reveal.in{opacity:1; transform:none;}

@media (prefers-reduced-motion:reduce){
  *{transition:none !important; animation:none !important;}
  .reveal{opacity:1; transform:none;}
  .recon.split .band.ghost{transform:none;}
}

/* ── waitlist ─────────────────────────────────────── */
.form{background:var(--surface); border:1px solid var(--line); border-radius:12px;
      padding:22px 24px; max-width:560px;}
.form .row{display:flex; gap:10px; flex-wrap:wrap;}
.form input[type=email]{
  flex:1 1 240px; min-width:0; background:var(--ground); color:var(--text);
  border:1px solid var(--line); border-radius:8px; padding:12px 14px;
  font-family:var(--mono); font-size:14px;
}
.form input[type=email]::placeholder{color:var(--faint);}
.form input[type=email]:focus{outline:2px solid var(--out); outline-offset:1px;}
.form button{
  background:var(--out); color:var(--ground); border:0; border-radius:8px;
  padding:12px 20px; font-family:var(--mono); font-size:13px; font-weight:600; cursor:pointer;
}
.form button:hover{filter:brightness(1.08);}
.form button:disabled{opacity:.5; cursor:default; filter:none;}
.form .note{font-family:var(--mono); font-size:12px; color:var(--faint); margin-top:12px;}
.opt{margin-top:18px; padding-top:16px; border-top:1px solid var(--line);}
.opt .q{display:block; font-family:var(--mono); font-size:12px; color:var(--faint); margin-bottom:9px;}
.chips{display:flex; flex-wrap:wrap; gap:8px;}
.chips label{
  font-family:var(--mono); font-size:12.5px; color:var(--muted);
  border:1px solid var(--line); border-radius:999px; padding:5px 13px; cursor:pointer;
}
.chips label:hover{border-color:var(--muted);}
.chips input{position:absolute; opacity:0; pointer-events:none;}
.chips label:has(input:checked){border-color:var(--out); color:var(--text); background:var(--sunk);}
.msg{margin-top:14px; font-family:var(--mono); font-size:13px;}
.msg.ok{color:var(--in);}
.msg.bad{color:var(--out);}
.alt{margin-top:60px; padding-top:26px; border-top:1px solid var(--line);}

/* honeypot: off-canvas, never focusable */
.hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0; pointer-events:none;}
