/* ============================================================
   伍空 V2.5 · 二级页观星美学皮肤（deep.css）
   总纲：信息扁平化，视觉不贫乏（规则 §24）
   —— 该阅读像纸：纸面底、墨字、发丝线；去渐变、去卡片框、去阴影
   用法：页面自身 <style> 之后引入；head 内先载 wk-theme.js（自动换肤）
   令牌：--t-pri/--t-bg/--t-ink… 由 wk-theme.js 注入，老师换肤全站生效
   ============================================================ */

/* ---- 字阶 V2.0 + 旧变量名映射（与 chart.html 同一套） ---- */
:root{
  --fs-hero:32px; --fs-page:28px; --fs-module:24px; --fs-card:19px;
  --fs-body:17px; --fs-body2:16px; --fs-aux:14px; --fs-micro:13px; --fs-btn:17px;
  --lh-hero:1.25; --lh-page:1.3; --lh-module:1.35; --lh-card:1.4;
  --lh-body:1.7; --lh-aux:1.5; --lh-micro:1.4;

  --primary:var(--t-pri,#6C53C9); --primary2:var(--t-pri2,#8F6FE8);
  --brand:var(--t-pri,#4b3a8f); --brand2:var(--t-pri2,#6c53c9);
  --soft:var(--t-soft,rgba(108,83,201,.09)); --tint:var(--t-soft);
  --onpri:var(--t-onpri,#fff);
  --gold:var(--t-gold,#B99755); --goldsoft:transparent;
  --ink:var(--t-ink,#22202A); --ink2:var(--t-ink2,#4A4655); --ink3:var(--t-ink3,#8A8694);
  --bg:var(--t-bg,#F6F3EE); --card:transparent; --line:rgba(0,0,0,.085);
  --ok:#3D8B5F; --warn:#C46A2E; --danger:#C24E4E;
}

/* ---- 基础 ---- */
body{
  background:var(--bg); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  font-size:var(--fs-body2); line-height:var(--lh-body);
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:none;font-size:inherit;color:inherit}
input,select,textarea{font-family:inherit;outline:none;color:var(--ink)}

/* ---- 顶栏：纸面，无渐变无阴影（§22.2；返回箭头化 + 标题居中，同 chart v71） ---- */
.hd{
  position:sticky;top:0;z-index:20;color:var(--ink);
  padding:calc(10px + env(safe-area-inset-top)) 20px 10px;
  background:var(--bg);border-bottom:none;box-shadow:none;
}
.hd .row{position:relative;display:flex;align-items:center;min-height:34px}
.hd .back{font-size:0;color:var(--ink);padding:0 18px 4px 0;background:none;border:none;border-radius:0;line-height:1.1}
.hd .back::before{content:'‹';font-size:30px;font-weight:400}
.hd h1{
  position:absolute;left:96px;right:96px;text-align:center;
  font-size:var(--fs-aux);font-weight:500;letter-spacing:2.5px;color:var(--ink2);
  pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.hd .sub{display:none}
.hd .who{font-size:var(--fs-micro);color:var(--ink3);margin-top:2px;text-align:right}
.hd *{text-shadow:none;opacity:1}
.hd .back *,.hd h1 *{opacity:1}

/* ---- 区块标题：直接落在纸上，不用盒子 ---- */
.card{background:none;border:none;border-radius:0;box-shadow:none;margin:0 20px 6px;padding:0}
.card h2{
  font-size:var(--fs-module);font-weight:600;letter-spacing:.2px;color:var(--ink);
  margin:30px 0 6px;display:flex;align-items:baseline;gap:8px;
}
.card h2::before{content:none}
.card h2 .tag{margin-left:auto;font-size:var(--fs-micro);font-weight:400;color:var(--ink3);
  background:none;padding:0;border-radius:0;letter-spacing:1px}

/* ---- 表单：下划线式 ---- */
.field{margin:0 0 18px}
.field label{display:block;font-size:var(--fs-micro);color:var(--ink3);letter-spacing:1px;margin-bottom:0}
.field input,.field select{
  border:none;border-bottom:1px solid var(--line);border-radius:0;
  padding:11px 2px;background:transparent;color:var(--ink);
  font-size:var(--fs-body2);appearance:none;-webkit-appearance:none;width:100%;
}
.field input:focus,.field select:focus{border-bottom-color:var(--ink);background:transparent;box-shadow:none}
.field input::placeholder,.field select::placeholder{color:var(--ink3)}

/* ---- 按钮：一屏一个重色（墨色）；次级 = 发丝线；金色只给成长/成交 ---- */
.btn{
  display:block;width:100%;text-align:center;padding:14px;border-radius:14px;
  font-weight:600;font-size:var(--fs-btn);letter-spacing:.5px;
  background:var(--ink);color:#fff;border:none;box-shadow:none;transition:.15s;
}
.btn:active{transform:scale(.985);opacity:.9}
html[data-theme-dark="1"] .btn{background:var(--t-pri);color:var(--t-onpri,#fff)}
.btn.gold{background:#B99755;color:#fff;box-shadow:none}
.btn.ghost{background:transparent;color:var(--ink2);border:1px solid var(--line);box-shadow:none}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn.sm{display:inline-block;width:auto;padding:9px 18px;font-size:var(--fs-aux);border-radius:10px}

/* ---- 提示：注文化，无框 ---- */
.tip{font-size:var(--fs-aux);color:var(--ink2);background:none;border:none;border-radius:0;
  box-shadow:none;padding:14px 20px 0;margin:0;line-height:var(--lh-aux)}
.tip b{color:var(--ink);font-weight:600}
.tip.warn{background:none;border:none;color:#8a6320}
html[data-theme-dark="1"] .tip.warn{color:#C9A86A}

/* ---- 状态词：全部文字化，不再彩色胶囊 ---- */
.pill{font-size:var(--fs-micro);font-weight:500;padding:0;background:none;border-radius:0;white-space:nowrap}
.pill.free{color:var(--ok);background:none}
.pill.own{color:var(--gold);background:none}
.pill.lock{color:var(--ink3);background:none}
.pill.price{color:var(--ink2);background:none}

/* ---- 弹层 / 遮罩 / 轻提示 ---- */
.mask{background:rgba(24,23,29,.5);box-shadow:none}
.mask .box{background:var(--t-card,#fff);border-radius:18px;box-shadow:0 18px 48px rgba(24,23,29,.18)}
.spin{border:3px solid var(--t-soft,rgba(108,83,201,.12));border-top-color:var(--ink)}
html[data-theme-dark="1"] .spin{border-top-color:var(--t-pri)}
.sheet{background:rgba(24,23,29,.5)}
.sheet .panel{background:var(--t-card,#fff);border-radius:18px 18px 0 0;box-shadow:none}
html[data-theme-dark="1"] .sheet .panel{background:#24222C}
.toast{background:rgba(24,23,29,.92)}

/* ---- 页脚注 ---- */
.foot{text-align:center;font-size:var(--fs-micro);color:var(--ink3);padding:26px 20px 14px;line-height:var(--lh-aux)}

/* ---- 深色主题兜底 ---- */
html[data-theme-dark="1"] body{background:var(--t-bg);color:var(--t-ink)}
html[data-theme-dark="1"] .hd{background:var(--t-bg)}
html[data-theme-dark="1"] .field input,html[data-theme-dark="1"] .field select{color:var(--t-ink)}
html[data-theme-dark="1"] .mask .box{background:#24222C}
