/* dist.css —— 推广人中心（2026-10-25）
 *
 * 只服务 dist.html。风格延续整站的宣纸 + 朱红 + 描金，不引入新色系。
 * 三条自我约束：
 *   ① 不做「日入过万」式的收益暗示 —— 页面上出现的每个数字都能从 19.9 元和 30% 算出来；
 *   ② 3D 只用 transform，动效在 prefers-reduced-motion 下全关；
 *   ③ 手机优先：所有表格在窄屏转成卡片行，不横向滚动（横向滚动在微信里极易误触）。
 */

/* ---------- 页面骨架 ---------- */
.dw{max-width:860px;margin:0 auto;padding:0 16px 96px}
.dw-hero{
  position:relative;margin:18px 0 14px;border-radius:22px;overflow:hidden;
  background:
    radial-gradient(620px 300px at 88% -10%, rgba(228,192,120,.30), transparent 62%),
    radial-gradient(420px 260px at 0% 110%, rgba(46,107,92,.28), transparent 60%),
    linear-gradient(150deg,#1B2029,#232A35 52%,#2A2320);
  color:#F6EFE0;padding:26px 22px 24px;
  box-shadow:0 2px 0 rgba(255,255,255,.06) inset, 0 26px 50px -26px rgba(20,24,30,.55);
  transform-style:preserve-3d;
}
.dw-hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
.dw-kicker{
  display:inline-flex;align-items:center;gap:7px;font-size:11.5px;letter-spacing:.14em;
  color:#E9C98F;border:1px solid rgba(228,192,120,.35);border-radius:999px;padding:4px 10px;
  background:rgba(228,192,120,.08);
}
.dw-hero h1{
  font-family:"Songti SC","Noto Serif SC",serif;font-weight:600;
  font-size:30px;line-height:1.32;margin:14px 0 8px;letter-spacing:.01em;
}
.dw-hero h1 em{font-style:normal;color:#F0C87E;position:relative}
.dw-hero p{font-size:13.5px;line-height:1.75;color:#CFC6B6;margin:0}
.dw-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}
.dw-fact{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  border-radius:13px;padding:11px 10px;text-align:center;backdrop-filter:blur(4px);
}
.dw-fact b{display:block;font-size:20px;color:#F3D49B;font-family:"Songti SC",serif;line-height:1.2}
.dw-fact span{font-size:11px;color:#B8B0A2;display:block;margin-top:3px}

/* ---------- 通用卡片 ---------- */
.dw-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:16px;box-shadow:var(--shadow);margin-top:14px;
}
.dw-card > h2{
  font-family:"Songti SC",serif;font-size:16.5px;font-weight:600;margin:0 0 4px;
  display:flex;align-items:center;gap:8px;
}
.dw-card > h2 .n{
  width:20px;height:20px;border-radius:6px;background:var(--red-soft);color:var(--red);
  font-size:11px;display:inline-flex;align-items:center;justify-content:center;font-family:inherit;
}
.dw-sub{font-size:12.5px;color:var(--ink3);line-height:1.7;margin:0 0 10px}

/* ---------- 计算示例 ---------- */
.dw-calc{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0 4px}
.dw-calc div{
  border:1px dashed var(--line);border-radius:12px;padding:10px;text-align:center;background:#FCFAF4;
}
.dw-calc b{display:block;font-size:17px;color:var(--ink);font-family:"Songti SC",serif}
.dw-calc span{font-size:11px;color:var(--ink3);display:block;margin-top:2px}
.dw-calc i{font-style:normal;font-size:11px;color:var(--jade)}

/* ---------- 步骤 ---------- */
.dw-steps{counter-reset:s;margin:8px 0 0;padding:0;list-style:none}
.dw-steps li{
  counter-increment:s;position:relative;padding:0 0 14px 34px;
  font-size:13px;color:var(--ink2);line-height:1.7;
}
.dw-steps li::before{
  content:counter(s);position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;
  background:var(--gold-soft);color:var(--gold);font-size:11.5px;
  display:flex;align-items:center;justify-content:center;border:1px solid #E7D3A9;
}
.dw-steps li:not(:last-child)::after{
  content:"";position:absolute;left:11px;top:25px;bottom:2px;width:0;border-left:1px dashed var(--line);
}
.dw-steps b{color:var(--ink)}

/* ---------- 合规提示 ---------- */
.dw-note{
  border:1px solid #EADFC8;background:#FDFAF1;border-radius:12px;padding:12px 13px;
  font-size:12.5px;line-height:1.8;color:#6B5A36;margin-top:12px;
}
.dw-note b{color:#8A6A1F}
.dw-note.bad{background:var(--red-soft);border-color:#EBCFC9;color:#8E3A32}
.dw-note.good{background:var(--jade-soft);border-color:#CFE3DB;color:#2E6B5C}

/* ---------- 表单 ---------- */
.dw-form .field{margin-bottom:11px}
.dw-form label.lab{display:block;font-size:12px;color:var(--ink2);margin-bottom:5px}
.dw-form input,.dw-form select{
  width:100%;height:44px;border:1px solid var(--line);border-radius:11px;background:#FFFDF8;
  padding:0 12px;font-size:14px;color:var(--ink);font-family:inherit;
}
.dw-form input:focus,.dw-form select:focus{outline:none;border-color:#D8C7A6;box-shadow:0 0 0 3px rgba(168,122,36,.1)}
.dw-row{display:flex;gap:10px}
.dw-row > *{flex:1;min-width:0}

/* 手写签名框 */
.dw-sig{
  position:relative;border:1px dashed #D9CBB0;border-radius:12px;background:
    repeating-linear-gradient(90deg,transparent 0 26px,rgba(168,122,36,.07) 26px 27px),
    #FFFDF8;
  height:150px;touch-action:none;cursor:crosshair;overflow:hidden;
}
.dw-sig canvas{display:block;width:100%;height:100%}
.dw-sig .ph{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:12.5px;color:#C0B49C;pointer-events:none;letter-spacing:.05em;
}
.dw-sig.has .ph{display:none}
.dw-sig-bar{display:flex;align-items:center;justify-content:space-between;margin-top:6px}
.dw-sig-bar button{background:none;border:none;color:var(--ink3);font-size:12px;cursor:pointer;padding:4px 2px}
.dw-sig-bar button:hover{color:var(--red)}

/* ---------- 登录态 ---------- */
.dw-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:16px 0 4px}
.dw-who{display:flex;align-items:center;gap:9px;min-width:0}
.dw-ava{
  width:38px;height:38px;border-radius:11px;flex:none;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,var(--gold-soft),#F3E3C4);color:var(--gold);
  font-family:"Songti SC",serif;font-size:17px;border:1px solid #E7D3A9;
}
.dw-who b{display:block;font-size:14px;line-height:1.3}
.dw-who span{font-size:11.5px;color:var(--ink3);display:block}

.dw-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}
.dw-tile{
  border:1px solid var(--line);border-radius:13px;background:var(--card);padding:11px 10px;
  box-shadow:0 1px 0 #fff inset;text-align:center;
}
.dw-tile .k{font-size:11px;color:var(--ink3)}
.dw-tile .v{font-size:19px;font-family:"Songti SC",serif;color:var(--ink);margin-top:3px;line-height:1.2}
.dw-tile.hot .v{color:var(--red)}
.dw-tile.ok .v{color:var(--jade)}

/* 推广码 */
.dw-code{
  display:flex;align-items:center;gap:12px;margin-top:10px;padding:12px;
  border:1px solid #EADFC8;background:linear-gradient(135deg,#FDFAF1,#FAF3E2);border-radius:13px;
}
.dw-code .big{
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:22px;letter-spacing:.16em;color:var(--lp-red-deep);
  flex:none;
}
.dw-code .lk{font-size:11.5px;color:var(--ink3);word-break:break-all;line-height:1.5}
.dw-code .btns{margin-left:auto;display:flex;flex-direction:column;gap:6px;flex:none}
/* 2026-10-25：132px → 188px。原来的尺寸屏上能扫、线下印不出来，
   而且没有「保存图片」的入口，分销员只能截图（截图会把 UI 一起截进去）。 */
.dw-qr{margin-top:14px;display:flex;gap:16px;align-items:flex-start}
.dw-qr .qr-main{flex:none;width:188px;display:flex;flex-direction:column;gap:8px}
.dw-qr .box{
  width:188px;height:188px;flex:none;border-radius:14px;background:#fff;border:1px solid var(--line);
  padding:8px;box-shadow:var(--shadow);
}
.dw-qr .box svg{display:block;width:100%;height:100%}
.qr-cap{font-size:12px;color:var(--ink2);text-align:center;letter-spacing:.02em;line-height:1.5}
.qr-hint{font-size:10.5px;color:var(--ink3);text-align:center;line-height:1.5}
.dw-qr .txt{font-size:12.5px;color:var(--ink2);line-height:1.8;min-width:0}
.dw-qr .qr-note{font-size:11px;color:var(--ink3);line-height:1.6}

/* ---------- 段控 ---------- */
.dw-tabs{display:flex;gap:6px;overflow:auto;margin-top:16px;padding-bottom:2px;-webkit-overflow-scrolling:touch}
.dw-tabs button{
  flex:none;border:1px solid var(--line);background:#FFFDF8;color:var(--ink2);
  border-radius:999px;padding:8px 14px;font-size:12.5px;cursor:pointer;font-family:inherit;
}
.dw-tabs button.on{background:var(--ink);color:#FFF9EC;border-color:var(--ink)}

/* ---------- 表格 ---------- */
.dw-tbl{width:100%;border-collapse:collapse;margin-top:10px;font-size:12.5px}
.dw-tbl th{
  text-align:left;font-weight:500;color:var(--ink3);font-size:11.5px;
  padding:7px 6px;border-bottom:1px solid var(--line2);white-space:nowrap;
}
.dw-tbl td{padding:9px 6px;border-bottom:1px solid var(--line2);color:var(--ink2);vertical-align:top}
.dw-tbl td.num{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink)}
.dw-tbl td.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11.5px;color:var(--ink3)}
.dw-tbl tr:last-child td{border-bottom:none}
.dw-empty{padding:26px 0;text-align:center;color:var(--ink3);font-size:12.5px}

/* 状态标 */
.dw-tag{display:inline-block;font-size:11px;padding:2px 7px;border-radius:6px;white-space:nowrap}
.dw-tag.settle{background:var(--gold-soft);color:var(--gold)}
.dw-tag.ready{background:var(--jade-soft);color:var(--jade)}
.dw-tag.paying{background:var(--blue-soft);color:var(--blue)}
.dw-tag.paid{background:#F1EEE7;color:var(--ink2)}
.dw-tag.void{background:var(--red-soft);color:var(--red)}

/* ---------- 合同 ---------- */
.dw-contract{
  max-height:340px;overflow:auto;border:1px solid var(--line);border-radius:12px;
  background:#FCFAF4;padding:14px;margin-top:8px;
}
.dw-contract pre{
  white-space:pre-wrap;word-break:break-word;margin:0;
  font-family:inherit;font-size:12.5px;line-height:1.85;color:var(--ink2);
}
.dw-hash{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:10.5px;color:var(--ink3);word-break:break-all;margin-top:6px}

/* ---------- 弹层 ---------- */
.dw-mask{position:fixed;inset:0;background:rgba(20,24,30,.5);z-index:60;display:flex;align-items:flex-end;justify-content:center;padding:0}
.dw-modal{
  background:var(--card);width:100%;max-width:560px;border-radius:18px 18px 0 0;
  padding:18px 16px calc(18px + env(safe-area-inset-bottom));max-height:86vh;overflow:auto;
  box-shadow:0 -20px 50px rgba(20,24,30,.3);
}
.dw-modal h3{font-family:"Songti SC",serif;font-size:16px;margin:0 0 6px}
.dw-modal .hint{font-size:12.5px;color:var(--ink3);line-height:1.7;margin:0 0 10px}

/* ---------- 页脚合规 ---------- */
.dw-foot{font-size:11.5px;color:var(--ink3);line-height:1.9;text-align:center;margin-top:22px}
.dw-foot a{color:var(--ink3);text-decoration:underline}

/* ---------- 窄屏 ---------- */
@media (max-width:560px){
  .dw-hero h1{font-size:25px}
  .dw-facts{grid-template-columns:repeat(3,1fr);gap:6px}
  .dw-fact b{font-size:17px}
  .dw-stats{grid-template-columns:repeat(2,1fr)}
  .dw-calc{grid-template-columns:repeat(3,1fr)}
  .dw-code{flex-wrap:wrap}
  .dw-code .btns{margin-left:0;flex-direction:row;width:100%}
  .dw-code .btns .btn{flex:1}
  .dw-qr{flex-direction:column;align-items:flex-start;gap:12px}
  .dw-qr .qr-main,.dw-qr .box{width:172px}
  .dw-qr .box{height:172px}
  .dw-qr .qr-main{align-items:center}
  /* 表格转卡片行：<thead> 藏掉，<td> 用 data-k 显示字段名 */
  .dw-tbl thead{display:none}
  .dw-tbl tr{display:block;padding:10px 0;border-bottom:1px solid var(--line2)}
  .dw-tbl td{display:flex;justify-content:space-between;gap:12px;border:none;padding:3px 0}
  .dw-tbl td::before{content:attr(data-k);color:var(--ink3);font-size:11.5px;flex:none}
  .dw-tbl td.num{text-align:left}
}

@media (prefers-reduced-motion:reduce){
  .dw-hero{transform:none !important}
}
