/* 愈见塔罗 · 咨询师版（夜幕黑） — B 端工作台 */
body.wb {
  --n0:#0E0C09; --n1:#151210; --n2:#1D1915; --line:#332C22;
  --gld:#C9A75C; --gld2:#8A7442; --txt:#EFE9DB; --dim:#9C9170;
  background:var(--n0); color:var(--txt);
}
body.wb a { color:inherit; }

.wb-top { border-bottom:1px solid var(--line); background:rgba(14,12,9,.96); position:sticky; top:0; z-index:50; backdrop-filter:blur(6px); }
.wb-top .in { max-width:1200px; margin:0 auto; padding:0 24px; display:flex; align-items:center; gap:24px; }
.wb-top .brand { font-family:Georgia,"Songti SC",SimSun,serif; font-size:15px; letter-spacing:.3em; padding:14px 0; }
.wb-top .brand small { display:block; font-size:9px; letter-spacing:.3em; color:var(--dim); margin-top:3px; }
.wb-top .who { margin-left:auto; font-size:11px; letter-spacing:.2em; color:var(--dim); }
.wb-top .acts { display:flex; gap:12px; }

.wbtn {
  font-family:inherit; font-size:12px; letter-spacing:.22em; cursor:pointer; transition:.2s;
  border:1px solid var(--line); background:transparent; color:var(--txt); padding:11px 22px;
}
.wbtn:hover { border-color:var(--gld); color:var(--gld); }
.wbtn.solid { background:var(--gld); border-color:var(--gld); color:#14100A; }
.wbtn.solid:hover { background:#D9BC77; }
.wbtn:disabled { opacity:.45; cursor:default; }
body.wb a.wbtn { text-decoration:none; display:inline-block; }
.wb-top .acts .back { border-color:transparent; color:var(--dim); }
.wb-top .acts .back:hover { border-color:var(--gld); color:var(--gld); }

.wframe { max-width:1200px; margin:0 auto; padding:0 24px; }

/* 门槛页 */
.gate { padding:70px 0 50px; max-width:860px; margin:0 auto; text-align:center; }
.gate .over { font-size:10px; letter-spacing:.5em; color:var(--dim); }
.gate h1 { font-family:Georgia,"Songti SC",SimSun,serif; font-size:clamp(38px,6vw,64px); letter-spacing:.16em; margin:22px 0 10px; }
.gate h1 em { font-style:normal; color:var(--gld); }
.gate .sub { font-size:11px; color:var(--dim); letter-spacing:.3em; margin-top:10px; }
.gate-feats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin:44px 0 36px; }
.gate-feats .f { background:var(--n1); padding:26px 22px; }
.gate-feats .f .t { font-family:Georgia,"Songti SC",SimSun,serif; font-size:15px; letter-spacing:.28em; color:var(--gld); }
.gate-feats .f .d { font-size:11px; color:var(--dim); letter-spacing:.1em; line-height:2; margin-top:12px; }
.gate .price { font-family:Georgia,serif; font-size:40px; color:var(--txt); }
.gate .price small { font-size:12px; color:var(--dim); letter-spacing:.3em; margin-left:8px; }
.gate .price em { font-style:normal; color:var(--gld); }
.gate .note { font-size:10px; color:var(--dim); letter-spacing:.2em; line-height:2.2; margin-top:22px; }
@media (max-width:720px){ .gate-feats { grid-template-columns:1fr; } }

/* 弹层 */
.wmask { position:fixed; inset:0; background:rgba(8,7,5,.72); z-index:100; display:flex; align-items:center; justify-content:center; padding:20px; }
.wmodal { background:var(--n1); border:1px solid var(--line); max-width:400px; width:100%; padding:34px 32px; }
.wmodal .h { font-family:Georgia,"Songti SC",SimSun,serif; font-size:17px; letter-spacing:.3em; margin-bottom:22px; }
.wmodal .field { margin-bottom:16px; }
.wmodal label { display:block; font-size:9.5px; letter-spacing:.26em; color:var(--dim); margin-bottom:8px; }
.wmodal input {
  width:100%; font-family:inherit; font-size:13px; letter-spacing:.06em; color:var(--txt);
  background:var(--n0); border:1px solid var(--line); padding:12px 14px; outline:none;
}
.wmodal input:focus { border-color:var(--gld); }
.wmodal .row { display:flex; gap:12px; justify-content:flex-end; margin-top:24px; }
.wmodal .tip { font-size:10px; color:var(--dim); letter-spacing:.14em; line-height:2; margin-top:14px; }

/* 看牌讲解：侧边悬浮窗（牌桌保持可见，边看牌边读讲解） */
.tfloat { position:fixed; top:76px; right:22px; bottom:22px; width:min(480px, 42vw); z-index:90; }
@media (max-width:960px){ .tfloat { left:12px; right:12px; width:auto; top:64px; bottom:12px; } }
.tmodal { background:var(--n1); border:1px solid var(--gld2); max-width:760px; width:100%; max-height:86vh; display:flex; flex-direction:column; padding:26px 30px; }
.tfloat .tmodal { max-width:none; max-height:none; height:100%; box-shadow:0 18px 60px rgba(0,0,0,.6); background:rgba(21,18,16,.97); }
.tmodal .th { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.tmodal .th span { font-family:Georgia,"Songti SC",SimSun,serif; font-size:16px; letter-spacing:.28em; color:var(--gld); }
.tmodal .tsub { font-size:10.5px; color:var(--dim); letter-spacing:.2em; margin:10px 0 16px; padding-bottom:14px; border-bottom:1px solid var(--line); }
.tmodal .tbody { overflow-y:auto; padding-right:10px; }
.tmodal .tbody::-webkit-scrollbar { width:8px; }
.tmodal .tbody::-webkit-scrollbar-thumb { background:var(--gld2); }
.tmodal .tbody::-webkit-scrollbar-track { background:var(--n0); }
.tmodal .tload { text-align:center; color:var(--dim); font-size:12px; letter-spacing:.24em; padding:56px 0; animation:pulse 1.6s infinite; }
@keyframes pulse { 50% { opacity:.35; } }
.tcontent { font-size:14px; line-height:2.25; letter-spacing:.04em; white-space:pre-wrap; color:#F3EDDE; }
.tcontent .thl {
  display:block; font-family:Georgia,"Songti SC",SimSun,serif; font-size:15px; letter-spacing:.14em;
  color:var(--gld); border-bottom:1px solid var(--line); padding-bottom:8px; margin:26px 0 10px;
}
.tcontent .thl:first-child { margin-top:2px; }
.tcontent .tsl { display:block; font-weight:bold; color:var(--gld); margin-top:10px; letter-spacing:.1em; }
.terr { color:#C96F4A; font-size:12.5px; letter-spacing:.1em; line-height:2.2; padding:20px 0; }

/* 牌卡上的单张讲解入口 */
body.wb .dcard .tch {
  margin-top:9px; padding-top:8px; border-top:1px dashed var(--line);
  font-size:10.5px; letter-spacing:.16em; color:var(--gld2); cursor:pointer; transition:.2s;
}
body.wb .dcard .tch:hover { color:var(--gld); }

/* 工作台 */
.wb-grid { display:grid; grid-template-columns:1.45fr 1.18fr; gap:26px; padding:28px 0 60px; align-items:start; }
@media (max-width:960px){ .wb-grid { grid-template-columns:1fr; } }

.wpanel { background:var(--n1); border:1px solid var(--line); padding:24px 26px; }
.wpanel .ph { display:flex; align-items:baseline; gap:14px; margin-bottom:20px; }
.wpanel .ph .t { font-family:Georgia,"Songti SC",SimSun,serif; font-size:16.5px; letter-spacing:.3em; color:var(--gld); }
.wpanel .ph .l { flex:1; height:1px; background:var(--line); }
.wpanel .ph .s { font-size:10.5px; letter-spacing:.2em; color:var(--dim); }

.wsel {
  font-family:inherit; font-size:13.5px; letter-spacing:.1em; color:var(--txt);
  background:var(--n0); border:1px solid var(--line); padding:12px 14px; outline:none; min-width:180px;
}
.wsel:focus { border-color:var(--gld); }

.opsbar { display:flex; gap:12px; align-items:center; margin-top:22px; flex-wrap:wrap; position:relative; }
.opsbar .hint { font-size:11px; color:var(--dim); letter-spacing:.16em; }

.pop { position:absolute; top:calc(100% + 10px); left:0; background:var(--n1); border:1px solid var(--line); padding:18px 20px; z-index:40; min-width:260px; }
.pop .row { display:flex; gap:10px; margin-bottom:14px; }
.pop label { display:block; font-size:10.5px; letter-spacing:.2em; color:var(--dim); margin-bottom:8px; }
.pop input {
  width:76px; font-family:inherit; font-size:13.5px; color:var(--txt); text-align:center;
  background:var(--n0); border:1px solid var(--line); padding:8px 6px; outline:none;
}
.pop input.wide { width:100%; text-align:left; }

/* 暗色牌卡（复用 main.css 的 .dcard 结构） */
body.wb .dcard .face { border-color:var(--line); }
body.wb .dcard .front { background:var(--n0); }
body.wb .dcard .meta .nm { color:var(--txt); }
body.wb .dcard .meta .tag { border-color:var(--line); color:var(--dim); }
body.wb .dcard .meta .tag.rev { border-color:var(--dim); color:var(--txt); }
body.wb .dcard .meta .mn { color:var(--dim); font-size:11.5px; }
body.wb .draw-grid { margin-top:20px; }

/* 单牌详情浮窗：点牌即看（不遮牌桌，靠右停靠） */
.tfloat.cardpop { top:110px; bottom:auto; width:min(330px, 90vw); }
.cardpop .cp-pos { font-size:11px; letter-spacing:.2em; color:var(--gld); border-bottom:1px solid var(--line); padding-bottom:10px; margin-bottom:14px; }
.cardpop .cp-img { text-align:center; }
.cardpop .cp-img img { width:150px; border:1px solid var(--line); }
.cardpop .cp-img img.rev { transform:rotate(180deg); }
.cardpop .cp-elem { text-align:center; font-size:13px; color:var(--txt); letter-spacing:.14em; margin:12px 0 16px; }
.cardpop .cp-elem small { display:block; font-size:10px; color:var(--dim); letter-spacing:.1em; margin-top:4px; }
.cardpop .cp-row { border:1px solid var(--line); padding:10px 12px; margin-bottom:8px; opacity:.55; }
.cardpop .cp-row.act { opacity:1; border-color:var(--gld2); background:rgba(201,167,92,.06); }
.cardpop .cp-lab { font-size:9.5px; letter-spacing:.24em; color:var(--dim); margin-bottom:8px; }
.cardpop .cp-kw { display:inline-block; font-size:11.5px; color:#E9DFC6; border:1px solid var(--line); padding:3px 9px; margin:0 6px 6px 0; letter-spacing:.08em; }
.cardpop .cp-note { font-size:11.5px; color:var(--dim); line-height:2; letter-spacing:.06em; margin-top:6px; }

/* 牌桌：按阵型摆（与牌阵研习共用 spread-kit 坐标；小卡规格同牌阵研习，防重叠） */
.wtbl.form { position:relative; margin-top:22px; overflow:hidden; border:1px solid var(--line); background:var(--n0); }
.wtbl.form .dcard { position:absolute; transform:translate(-50%,-50%); width:clamp(56px, 17%, 96px); }
.wtbl.form.dense .dcard { width:clamp(46px, 13%, 82px); }
.wtbl.form .dcard .meta { padding-top:6px; }
.wtbl.form .dcard .meta .pos { font-size:9px; letter-spacing:.12em; }
.wtbl.form .dcard .meta .nm { font-size:11px; }
.wtbl.form .dcard .meta .nm .el { display:none; }
.wtbl.form .dcard .meta .tag { font-size:8.5px; padding:1px 5px; }
.wtbl.form .dcard .meta .tch { font-size:9px; margin-top:5px; padding-top:5px; }
.wtbl.flat { display:flex; flex-wrap:wrap; gap:18px; margin-top:22px; }
.wtbl.flat .dcard { width:158px; }
.wtbl .dcard .meta { text-align:center; }

/* 补问牌区：单独成排，不进主阵阵型 */
.addedG { margin-top:18px; padding-top:14px; border-top:1px dashed var(--line); }
.addedG .ag-t { font-size:11px; color:var(--dim); letter-spacing:.16em; margin-bottom:12px; }
.addedG .ag-c { display:flex; flex-wrap:wrap; gap:16px; }
.addedG .ag-c .dcard { width:138px; }

/* 导师浮动窗（跟练旁观席）：比看牌讲解窗窄，带输入框；标题栏可拖动 */
.tfloat.tutor { top:96px; bottom:auto; width:min(400px, 92vw); }
.tfloat.tutor .th { cursor:move; user-select:none; }
.tfloat.tutor .tmodal { padding:20px 20px 18px; }
.tutor-msgs { display:flex; flex-direction:column; gap:10px; min-height:120px; max-height:46vh; overflow-y:auto; border:1px solid var(--line); background:var(--n0); padding:12px; }
.tutor-msgs .pv-empty { margin:auto; text-align:center; font-size:11px; color:var(--dim); letter-spacing:.12em; line-height:2.2; }
.tutor-msgs .pv-m .pv-b { font-size:13.5px; padding:10px 13px; }

/* 导师悬浮钮（浮动窗收起后显示） */
.tutor-fab {
  position:fixed; right:22px; bottom:26px; z-index:95; cursor:pointer;
  width:58px; height:58px; border-radius:50%; border:1px solid var(--gld2);
  background:rgba(21,18,16,.96); color:var(--gld); font-family:Georgia,"Songti SC",SimSun,serif;
  font-size:19px; line-height:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  box-shadow:0 10px 34px rgba(0,0,0,.55); transition:.2s;
}
.tutor-fab span { font-size:9px; letter-spacing:.3em; margin-right:-.3em; }
.tutor-fab:hover { border-color:var(--gld); background:var(--n2); }

/* 导师陪同按钮：有新插话时亮提醒点（窗关着也不弹窗） */
#btnPvCoach.has-msg { border-color:var(--gld); color:var(--gld); }
#btnPvCoach.has-msg::after { content:'● 有话说'; font-size:9px; letter-spacing:.14em; margin-left:8px; }

/* 本阵怎么看（默认收起） */
.howto { margin-top:18px; border:1px solid var(--line); }
.howto .ht-head {
  width:100%; display:flex; justify-content:space-between; align-items:center; cursor:pointer;
  font-family:inherit; font-size:12px; letter-spacing:.22em; color:var(--gld);
  background:transparent; border:none; padding:12px 16px;
}
.howto .ht-head:hover { background:rgba(201,167,92,.06); }
.howto .ht-body { padding:4px 20px 16px; }
.howto .ht-body ol { margin:0; padding-left:20px; }
.howto .ht-body li { font-size:12.5px; color:#CFC6AE; line-height:2.1; letter-spacing:.04em; margin-bottom:6px; }
.howto .ht-body .fine { font-size:11.5px; color:var(--dim); letter-spacing:.08em; line-height:2; border-top:1px solid var(--line); padding-top:10px; margin:8px 0 0; }

/* AI 面板（高度尽量占满视口，长回复不用来回滚） */
.chat { display:flex; flex-direction:column; height:clamp(560px, calc(100vh - 215px), 1300px); }
.chat .msgs { flex:1; overflow-y:auto; padding-right:6px; }
.chat .msg { margin-bottom:18px; max-width:100%; }
.chat .msg .bub {
  font-size:15px; line-height:2.2; letter-spacing:.045em; white-space:pre-wrap;
  border:1px solid var(--line); background:var(--n0); padding:16px 20px;
}
.chat .msg.me { margin-left:auto; max-width:88%; }
.chat .msg.me .bub { background:var(--n2); border-color:var(--gld2); }
.chat .msg .who { font-size:10.5px; letter-spacing:.26em; color:var(--dim); margin-bottom:7px; }
.chat .msg.me .who { text-align:right; }
.quick { display:flex; gap:10px; margin:14px 0 10px; }
.inrow { display:flex; gap:10px; }
.inrow input {
  flex:1; min-width:0; font-family:inherit; font-size:13.5px; letter-spacing:.05em; color:var(--txt);
  background:var(--n0); border:1px solid var(--line); padding:13px 15px; outline:none;
}
.inrow input:focus { border-color:var(--gld); }
.keydot { display:inline-block; width:6px; height:6px; border-radius:50%; background:#6B5F49; margin-right:6px; vertical-align:1px; }
.keydot.on { background:var(--gld); }
.empty { text-align:center; padding:60px 10px; }
.empty .e1 { font-family:Georgia,"Songti SC",SimSun,serif; font-size:15px; letter-spacing:.3em; color:var(--dim); }
.empty .e2 { font-size:11.5px; color:var(--dim); letter-spacing:.18em; margin-top:12px; line-height:2.2; }

/* 跟练对话区：客户 ↔ 学员，导师提点穿插（高度占满剩余视口） */
.pv-chat { display:flex; flex-direction:column; gap:12px; height:clamp(400px, calc(100vh - 440px), 980px); overflow-y:auto; border:1px solid var(--line); background:var(--n0); padding:14px; }
.pv-chat .pv-empty { margin:auto; text-align:center; font-size:11.5px; color:var(--dim); letter-spacing:.14em; line-height:2.4; }
.pv-m { max-width:100%; }
.pv-m .pv-w { font-size:10.5px; letter-spacing:.24em; color:var(--dim); margin-bottom:5px; }
.pv-m .pv-b { font-size:14.5px; line-height:2.15; letter-spacing:.04em; white-space:pre-wrap; border:1px solid var(--line); background:var(--n2); padding:12px 16px; }
.pv-m.cl { align-self:flex-start; }
.pv-m.cl .pv-b { border-left:2px solid var(--gld2); }
.pv-m.me { align-self:flex-end; max-width:88%; }
.pv-m.me .pv-w { text-align:right; }
.pv-m.me .pv-b { background:var(--n1); border-color:var(--gld2); }
.pv-m.coach { align-self:stretch; max-width:100%; }
.pv-m.coach .pv-w { color:var(--gld); }
.pv-m.coach .pv-b { background:rgba(201,167,92,.07); border-color:var(--gld2); border-left:2px solid var(--gld); color:#E9DFC6; }
.pv-m.sys { align-self:center; max-width:100%; }
.pv-m.sys .pv-w { display:none; }
.pv-m.sys .pv-b { border:none; background:none; color:var(--dim); font-size:11px; letter-spacing:.1em; padding:2px 0; text-align:center; }
::-webkit-scrollbar { width:5px; } ::-webkit-scrollbar-thumb { background:var(--line); }

/* ---------- 手机端（跟练/工作台） ---------- */
@media (max-width: 720px) {
  .wb-top .in { flex-wrap: wrap; gap: 8px 10px; padding: 0 14px; }
  .wb-top .brand { font-size: 13px; letter-spacing: .18em; padding: 10px 0 2px; }
  .wb-top .brand small { display: none; }
  .wb-top .acts { margin-left: 0; width: 100%; justify-content: flex-start; }
  .wb-top .acts .wbtn { padding: 9px 12px; font-size: 11px; letter-spacing: .1em; }
  .mtabs .wbtn, .mtabs button { padding: 9px 12px; font-size: 11px; }
  .wframe { padding: 0 14px; }
  .wpanel { padding: 16px 14px; }
  .wsel { min-width: 0; width: 100%; }
  .chat { height: clamp(380px, calc(100vh - 260px), 640px); }
  .pv-chat { height: clamp(320px, calc(100vh - 420px), 560px); }
  .gate-feats { grid-template-columns: 1fr; }
  .gate h1 { font-size: clamp(30px, 10vw, 44px); }
  .tmodal { padding: 18px 16px; }
  .howto .ht-body { padding: 2px 14px 12px; }
}

/* 手机端：工作台吸顶栏同样全不透明，防微信浏览器滚动透叠 */
@media (max-width: 720px) {
  .wb-top { background:#0E0C09; backdrop-filter:none; -webkit-backdrop-filter:none; }
}
