/* 交易私教: chat tab, cards and first-time guide. Palette comes from refresh.css (--v-*). */

.onlineDot{width:7px;height:7px;border-radius:50%;background:#1fb37d;box-shadow:0 0 0 3px rgba(31,179,125,.18)}
.coachHelp{flex:none;width:30px;height:30px;border:1px solid var(--v-line,#ecebf2);border-radius:50%;background:#fff;color:var(--v-sub,#86849a);font-weight:700;cursor:pointer}
.coachHelp:hover{border-color:var(--v-accent-line,#d9d1fa);color:var(--v-accent,#6a55d8)}
.coachAvatar{display:inline-grid;flex:none;width:42px;height:42px}
.coachAvatar.s{width:32px;height:32px}
.coachFeed{flex:1;padding:4px 0 20px}
.coachDay{display:flex;justify-content:center;margin:18px 0 10px}
.coachDay span{font-size:12px;color:var(--v-sub,#86849a);background:var(--v-canvas,#f6f5fa);padding:4px 12px;border-radius:20px}
.coachMsg{display:flex;align-items:flex-start;gap:9px;margin:10px 0}
.coachMsg.user{justify-content:flex-end}
.coachBody{min-width:0;max-width:calc(100% - 41px);display:grid;gap:8px}
.coachMsg.user .coachBody{max-width:80%;justify-items:end}
.coachBody>time{font-size:11px;color:var(--v-faint,#b3b1c2)}
.coachBubble{width:fit-content;max-width:100%;padding:11px 14px;border-radius:4px 18px 18px 18px;background:var(--v-canvas,#f3f2f8);color:var(--v-ink,#1b1a24);font-size:14.5px;line-height:1.65;overflow-wrap:anywhere}
.coachMsg.user .coachBubble{border-radius:18px 4px 18px 18px;background:linear-gradient(135deg,#7b66e6,#6a55d8);color:#fff}
.coachMsg.fresh{animation:vInTurn .32s cubic-bezier(.22,.9,.28,1) both}
.coachBubble.typing{display:flex;gap:5px;padding:14px 16px}
.coachBubble.typing i{width:7px;height:7px;border-radius:50%;background:#b8b4cc;animation:coachDot 1.1s ease-in-out infinite}
.coachBubble.typing i:nth-child(2){animation-delay:.16s}.coachBubble.typing i:nth-child(3){animation-delay:.32s}
@keyframes coachDot{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}

.coachCard{border:1px solid var(--v-line,#ecebf2);border-radius:16px;background:#fff;padding:14px;box-shadow:0 1px 2px rgba(27,26,36,.04),0 12px 28px -20px rgba(27,26,36,.25);width:100%}
.ccHead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ccHead b{font-size:14px;color:var(--v-ink,#1b1a24);min-width:0}
.ccTag{flex:none;font-style:normal;font-size:12px;font-weight:650;padding:3px 9px;border-radius:8px;background:var(--v-accent-soft,#f1eefe);color:var(--v-accent-ink,#5442c0)}
.ccTag.bad{background:#fdecec;color:#d2383f}.ccTag.win{background:#e6f6ef;color:#119a6a}
.ccSub{margin-top:5px;font-size:12.5px;color:var(--v-sub,#86849a)}
.ccBig{display:flex;align-items:baseline;gap:9px;margin:10px 0 4px;font-size:26px;font-weight:700;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.ccBig small{font-size:13px;font-weight:600}
.ccBig.loss{color:#e0464f}.ccBig.win{color:#119a6a}
.ccRows{display:grid;gap:0;margin:10px 0 0}
.ccRows>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--v-line,#ecebf2);font-size:13px}
.ccRows span{color:var(--v-sub,#86849a)}
.ccRows b{color:var(--v-ink,#1b1a24);font-variant-numeric:tabular-nums;text-align:right}
.ccRows b.bad{color:#e0464f}
.ccChips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ccChips span{font-size:12px;padding:4px 9px;border-radius:8px;background:var(--v-canvas,#f6f5fa);color:var(--v-ink-2,#4a4857)}
.ccAdvice{margin-top:10px;padding:11px 12px;border-radius:12px;background:#f6f4ff}
.ccAdvice>b,.ccList>b,.ccOpts>b{display:block;font-size:13px;color:var(--v-accent-ink,#5442c0);margin-bottom:5px}
.ccAdvice p{margin:0;font-size:13px;line-height:1.65;color:var(--v-ink-2,#4a4857)}
.ccAdvice strong{color:var(--v-ink,#1b1a24);font-variant-numeric:tabular-nums}
.ccGhost{margin-top:10px;text-align:center;padding:9px;border-radius:10px;border:1px dashed var(--v-accent-line,#d9d1fa);color:var(--v-accent,#6a55d8);font-size:13px;font-weight:600}
.ccList{margin-top:10px}.ccList>b{color:var(--v-ink,#1b1a24)}
.ccList p{margin:0 0 6px;padding-left:14px;position:relative;font-size:13px;line-height:1.6;color:var(--v-ink-2,#4a4857)}
.ccList p:before{content:'';position:absolute;left:0;top:.72em;width:5px;height:5px;border-radius:50%;background:#e0464f}
.ccOpts{margin-top:10px;display:grid;gap:7px}.ccOpts>b{color:var(--v-ink,#1b1a24);margin:0}
.ccOpt{padding:10px 12px;border:1px solid var(--v-line,#ecebf2);border-radius:12px}
.ccOpt.best{border-color:var(--v-accent-line,#d9d1fa);background:#faf9ff}
.ccOpt div{display:flex;align-items:center;gap:8px}.ccOpt strong{font-size:13.5px;color:var(--v-ink,#1b1a24)}
.ccOpt em{font-style:normal;font-size:11.5px;font-weight:650;padding:2px 7px;border-radius:6px;background:var(--v-accent,#6a55d8);color:#fff}
.ccOpt small{display:block;margin-top:3px;font-size:12.5px;line-height:1.5;color:var(--v-sub,#86849a)}
.ccNote{margin-top:8px;padding:10px 12px;border-radius:12px}
.ccNote span{display:block;font-size:12px;font-weight:700;margin-bottom:3px}
.ccNote p{margin:0;font-size:13px;line-height:1.6;color:var(--v-ink-2,#4a4857)}
.ccNote.good{background:#eaf7f1}.ccNote.good span{color:#119a6a}
.ccNote.better{background:#fff4e8}.ccNote.better span{color:#c97a1e}
.ccNote.next{background:#f1eefe}.ccNote.next span{color:var(--v-accent-ink,#5442c0)}
.ccScore{display:flex;align-items:center;justify-content:space-between;margin-top:10px}
.ccScore strong{font-size:34px;letter-spacing:-1px;color:var(--v-accent,#6a55d8);font-variant-numeric:tabular-nums}
.ccScore small{display:block;font-size:12px;color:var(--v-sub,#86849a)}
.ccScore em{font-style:normal;font-size:12.5px;font-weight:650;padding:4px 10px;border-radius:20px;background:#e6f6ef;color:#119a6a}
.ccBars{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;height:82px;margin:10px 4px 4px}
.ccBars>div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px}
.ccBars i{display:block;width:100%;max-width:26px;border-radius:6px 6px 3px 3px}
.ccBars i.pos{background:#9be0c3}.ccBars i.neg{background:#f4a7ab}.ccBars i.today{outline:2px solid rgba(106,85,216,.35);outline-offset:1px}
.ccBars span{font-size:11px;color:var(--v-sub,#86849a)}
.ccChange{display:flex;align-items:center;gap:10px;margin:12px 0 6px;font-size:18px;font-variant-numeric:tabular-nums}
.ccChange span{color:var(--v-sub,#86849a);text-decoration:line-through}.ccChange strong{color:var(--v-ink,#1b1a24)}
.ccChange i{font-style:normal;color:var(--v-faint,#b3b1c2)}.ccChange .vi{width:16px;height:16px}
.ccFoot{margin:0 0 10px;font-size:13px;line-height:1.6;color:var(--v-ink-2,#4a4857)}
.ccPrimary{width:100%;height:44px;border:0;border-radius:12px;background:var(--v-ink,#1b1a24);color:#fff;font-size:14px;font-weight:650;cursor:pointer;transition:transform .15s,background-color .15s}
.ccPrimary:hover{background:#2c2a3a}.ccPrimary:active{transform:scale(.985)}
.coachCard.confirm.done{border-color:#bfe8d6;background:#f7fcfa}

.coachPills{display:grid;gap:7px;width:100%}
.coachPill{position:relative;display:block;width:100%;text-align:left;padding:11px 13px;border:1px solid var(--v-line,#ecebf2);border-radius:13px;background:#fff;color:inherit;cursor:pointer;transition:border-color .15s,background-color .15s,transform .15s}
.coachPill:hover:not(:disabled){border-color:var(--v-accent-line,#d9d1fa);background:#faf9ff}
.coachPill:active:not(:disabled){transform:scale(.99)}
.coachPill b{display:block;font-size:14px;color:var(--v-ink,#1b1a24)}
.coachPill small{display:block;margin-top:3px;font-size:12.5px;line-height:1.5;color:var(--v-sub,#86849a)}
.coachPill.best{border-color:var(--v-accent-line,#d9d1fa)}
.coachPill em{position:absolute;right:10px;top:10px;font-style:normal;font-size:11.5px;font-weight:650;padding:2px 7px;border-radius:6px;background:var(--v-accent,#6a55d8);color:#fff}
.coachPills.answered .coachPill:not(.picked){opacity:.45}
.coachPill.picked{border-color:var(--v-accent,#6a55d8);background:#f6f4ff}

.coachInput button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;height:46px;padding:0 8px 0 16px;border:1px solid var(--v-line,#ecebf2);border-radius:23px;background:#fff;color:var(--v-sub,#86849a);font-size:14px;cursor:pointer;box-shadow:0 8px 24px -14px rgba(27,26,36,.3)}
.coachInput button:hover{border-color:var(--v-accent-line,#d9d1fa)}
.coachInput i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--v-ink,#1b1a24);color:#fff;font-style:normal}
.coachInput .vi{width:16px;height:16px;stroke-width:2.2}

/* overview row + activity */
.overviewIcon.coach,.overviewActivityIcon.orange{background:#fff3e6;color:#d0802c}

/* ---------- first-time guide ---------- */
.coachGuide{border:0;padding:0;width:min(420px,calc(100vw - 24px));max-height:calc(100dvh - 32px);border-radius:26px;overflow:hidden;background:linear-gradient(#f4f1ff,#fff 46%);color:var(--v-ink,#1b1a24);box-shadow:var(--v-shadow-pop,0 30px 80px rgba(27,26,36,.3))}
.gShell{display:flex;flex-direction:column;padding:16px 0 max(18px,env(safe-area-inset-bottom))}
.gTop{display:flex;align-items:center;justify-content:space-between;padding:0 20px 12px}
.gBrand{display:flex;align-items:center;gap:8px}.gBrand b{font-size:15px}
.gSkip{border:0;background:none;color:var(--v-sub,#86849a);font-size:14px;padding:6px 4px;cursor:pointer}
.gTrack{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.gTrack::-webkit-scrollbar{display:none}
.gSlide{flex:0 0 100%;scroll-snap-align:center;padding:0 20px;box-sizing:border-box}
.gStage{position:relative;height:min(372px,50dvh);overflow:hidden;border-radius:20px;background:#ece8fb;padding:14px;display:flex;flex-direction:column;justify-content:flex-start}
.gStage:after{content:'';position:absolute;left:0;right:0;bottom:0;height:56px;background:linear-gradient(rgba(236,232,251,0),#ece8fb);pointer-events:none}
.gCard{pointer-events:none;transform-origin:top center}
.gSlide h2{margin:18px 2px 6px;font-size:21px;letter-spacing:-.4px}
.gSlide p{margin:0 2px;font-size:14px;line-height:1.65;color:var(--v-ink-2,#4a4857);min-height:3.3em}
.gDots{display:flex;justify-content:center;gap:7px;margin:14px 0 14px}
.gDots button{width:7px;height:7px;padding:0;border:0;border-radius:7px;background:#d6d3e4;cursor:pointer;transition:width .25s cubic-bezier(.22,.9,.28,1),background-color .2s}
.gDots button.on{width:22px;background:var(--v-accent,#6a55d8)}
.gNext{margin:0 20px;height:50px;border:0;border-radius:15px;background:var(--v-ink,#1b1a24);color:#fff;font-size:16px;font-weight:650;cursor:pointer;transition:transform .15s,background-color .15s}
.gNext:hover{background:#2c2a3a}.gNext:active{transform:scale(.985)}
.gLock{position:relative;height:100%;border-radius:16px;padding:34px 12px 0;text-align:center;color:#fff;background:linear-gradient(160deg,#34306b,#1e1b3d 60%,#2b2457)}
.gLock time{display:block;font-size:56px;font-weight:300;letter-spacing:-1px;font-variant-numeric:tabular-nums}
.gLock>small{display:block;margin-top:2px;font-size:14px;opacity:.75}
.gPush{display:flex;gap:10px;margin-top:34px;padding:12px;border-radius:18px;background:rgba(255,255,255,.88);color:#1b1a24;text-align:left;box-shadow:0 14px 34px -14px rgba(0,0,0,.5);animation:gPushIn .8s .25s cubic-bezier(.22,.9,.28,1) both}
@keyframes gPushIn{from{opacity:0;transform:translateY(-16px) scale(.96)}to{opacity:1;transform:none}}
.gPush>div{min-width:0}.gPush span{display:flex;justify-content:space-between;gap:8px;font-size:12px}
.gPush span b{font-size:12px;letter-spacing:.2px}.gPush em{font-style:normal;color:#77758a}
.gPush strong{display:block;margin-top:2px;font-size:14.5px}.gPush p{margin:2px 0 0;font-size:13px;line-height:1.5;color:#3d3b49;min-height:0}
@media(max-width:650px){
 .coachGuide{position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:none;border-radius:26px 26px 0 0}
 .coachGuide[open]{animation:vInSheet .42s var(--v-ease-sheet,cubic-bezier(.32,.72,0,1)) both}
 .coachGuide[data-closing]{animation:vOutSheet .26s cubic-bezier(.45,0,.9,.4) both!important}
}
@media(max-width:400px){.gSlide h2{font-size:19px}.gStage{height:min(340px,46dvh)}}
@media(prefers-reduced-motion:reduce){.coachMsg.fresh,.gPush,.coachDot,.coachBubble.typing i{animation:none!important}.gDots button{transition:none}}
.coachPills.answered .coachPill.picked{opacity:1}

/* ---------- character avatar ---------- */
.coachAvatar img{width:100%;height:100%;display:block;border-radius:50%;object-fit:cover;-webkit-user-drag:none;user-select:none}
.coachAvatar{border-radius:50%;overflow:hidden}
.coachFaceImg{width:100%;height:100%;display:block;border-radius:inherit;object-fit:cover}
.toolboxIcon:has(.coachFaceImg),.welcomeToolIcon:has(.coachFaceImg){background:none!important;padding:0;overflow:hidden;border-radius:50%!important;font-size:0}
.overviewIcon.coachImg{background:none;padding:0;overflow:hidden;border-radius:50%}
.overviewIcon.coachImg .coachAvatar{width:100%;height:100%}

/* red dot: shown while the coach has an unread message (root class set by coach.js) */
.coachDot{position:absolute;top:-1px;right:-1px;display:none;width:12px;height:12px;border-radius:50%;background:#ee4d5a;border:2px solid #fff;box-sizing:border-box;animation:coachPulse 2s ease-in-out infinite}
.coachUnread .coachDot{display:block}
@keyframes coachPulse{50%{box-shadow:0 0 0 4px rgba(238,77,90,.2)}}

/* the tab in the task-console row: small character + label + red dot */
.coachTab{display:inline-flex!important;align-items:center;gap:6px}
.tabAv{display:inline-grid;width:22px;height:22px;margin-top:-1px}
.tabAv .coachAvatar{width:22px;height:22px;box-shadow:0 0 0 1.5px #fff,0 0 0 2.5px #d9d1fa}
.coachTab .coachDot{top:-3px;right:-11px;width:9px;height:9px;border-width:1.5px}

/* ---------- full-screen coach page ---------- */
.coachPage{border:0;padding:0;margin:0 auto;inset:0;width:min(100%,760px);height:100%;max-width:none;max-height:none;background:#fff;color:var(--v-ink,#1b1a24);overflow:hidden}
.coachPage[open]{display:flex;flex-direction:column;animation:vInRight .36s var(--v-ease-sheet,cubic-bezier(.32,.72,0,1)) both}
.coachPage[data-closing]{animation:vOutRight .27s cubic-bezier(.45,0,.9,.4) both!important}
.coachPage::backdrop,.coachPage[open]::backdrop{background:#f3f1fa!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;animation:none!important}
@keyframes vOutRight{to{transform:translateX(100%)}}
@media(min-width:901px){.coachPage{box-shadow:0 0 0 1px var(--v-line,#ecebf2),0 40px 90px -40px rgba(27,26,36,.35)}}
.cpHead{display:flex;align-items:center;gap:10px;flex:none;padding:max(10px,env(safe-area-inset-top)) 12px 10px 6px;border-bottom:1px solid var(--v-line,#ecebf2);background:#fff}
.cpBack{display:grid;place-items:center;flex:none;width:40px;height:40px;border:0;border-radius:50%;background:none;color:var(--v-ink,#1b1a24);cursor:pointer;transition:background-color .15s}
.cpBack:hover{background:var(--v-canvas,#f6f5fa)}
.cpBack .vi{width:22px;height:22px}
.cpHead .coachAvatar{width:42px;height:42px}
.cpWho{flex:1;min-width:0}
.cpWho b{display:block;font-size:16px}
.cpWho small{display:flex;align-items:center;gap:6px;margin-top:3px;font-size:12px;color:var(--v-sub,#86849a)}
.cpScroll{flex:1;min-height:0;overflow-y:auto;padding:0 16px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.coachInput{flex:none;margin:0;padding:10px 16px max(14px,env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--v-line,#ecebf2)}

/* ---------- info panel on the coach tab ---------- */
.coachDash{padding:16px 0 28px}
.dashHero{padding:16px;border-radius:20px;background:linear-gradient(140deg,#f3efff,#eaf1ff);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}
.dashWho{display:flex;align-items:center;gap:13px}
.dashAv{position:relative;display:grid;flex:none;width:60px;height:60px}
.dashAv .coachAvatar{width:60px;height:60px;box-shadow:0 0 0 3px #fff,0 8px 20px -8px rgba(74,58,170,.5)}
.dashAv .onlineDot{position:absolute;right:1px;bottom:1px;width:13px;height:13px;border:2.5px solid #fff;box-shadow:none}
.dashWho b{display:block;font-size:19px;letter-spacing:-.3px}
.dashWho small{display:block;margin-top:4px;font-size:13px;color:var(--v-ink-2,#4a4857)}
.dashChat{display:block;width:100%;margin-top:14px;padding:12px 14px;border:0;border-radius:15px;background:#fff;text-align:left;color:inherit;cursor:pointer;box-shadow:0 10px 26px -18px rgba(74,58,170,.55);transition:transform .15s,box-shadow .2s}
.dashChat:hover{box-shadow:0 12px 28px -16px rgba(74,58,170,.65)}.dashChat:active{transform:scale(.99)}
.dashMsg small{display:block;font-size:12px;color:var(--v-sub,#86849a)}
.dashMsg b{display:block;margin-top:4px;font-size:14.5px;line-height:1.55;color:var(--v-ink,#1b1a24)}
.dashGo{display:flex;align-items:center;justify-content:flex-end;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid var(--v-line,#ecebf2);font-size:14px;font-weight:650;color:var(--v-accent,#6a55d8)}
.dashGo i{font-style:normal}.dashGo .vi{width:16px;height:16px}
.unreadBadge{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:#ee4d5a;color:#fff;font-size:12px;font-style:normal;font-weight:700;margin-right:2px}
.dashSection{display:flex;align-items:baseline;justify-content:space-between;margin:22px 2px 10px}
.dashSection b{font-size:16px}.dashSection span{font-size:12.5px;color:var(--v-sub,#86849a)}
.dashMetrics{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.dashMetrics>div{padding:13px 14px;border:1px solid var(--v-line,#ecebf2);border-radius:15px;background:#fff}
.dashMetrics span{display:block;font-size:12.5px;color:var(--v-sub,#86849a)}
.dashMetrics strong{display:block;margin-top:5px;font-size:25px;letter-spacing:-.6px;font-variant-numeric:tabular-nums;color:var(--v-ink,#1b1a24)}
.dashMetrics small{display:block;margin-top:3px;font-size:12px;color:var(--v-sub,#86849a)}
.dashCard{padding:14px;border:1px solid var(--v-line,#ecebf2);border-radius:16px;background:#fff}
.dashBar{display:flex;gap:3px;height:12px}
.dashBar i{display:block;border-radius:6px;min-width:6px}
.dashLegend{display:grid;grid-template-columns:1fr 1fr;gap:9px 12px;margin-top:13px}
.dashLegend span{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--v-ink-2,#4a4857)}
.dashLegend span i{flex:none;width:9px;height:9px;border-radius:50%}
.dashLegend b{margin-left:auto;font-variant-numeric:tabular-nums;color:var(--v-ink,#1b1a24)}
.dashRecent{padding:4px 14px}
.dashRecent button{display:flex;align-items:center;gap:11px;width:100%;padding:12px 0;border:0;border-bottom:1px solid var(--v-line,#ecebf2);background:none;text-align:left;color:inherit;cursor:pointer}
.dashRecent button:last-child{border-bottom:0}
.dashRecent time{flex:none;width:40px;font-size:12.5px;color:var(--v-sub,#86849a);font-variant-numeric:tabular-nums}
.dashRecent span{flex:1;min-width:0}
.dashRecent small{display:block;font-size:12px;color:var(--v-sub,#86849a)}
.dashRecent b{display:block;margin-top:2px;font-size:13.5px;line-height:1.5;color:var(--v-ink,#1b1a24);font-weight:600}
.dashTag{flex:none;font-style:normal;font-size:12px;font-weight:650;padding:3px 9px;border-radius:8px;background:var(--v-canvas,#f3f2f8);color:var(--v-sub,#86849a)}
.dashTag.win{background:#e6f6ef;color:#119a6a}.dashTag.warn{background:#fff1e0;color:#c97a1e}
.coachDash>.coachCard{margin-top:0}

/* banner on the coach tab: same size as the other tabs' banners so switching tabs doesn't jump */
.coachHero{padding-right:92px}
.coachHero .heroAv{position:absolute;right:20px;top:50%;z-index:1;width:58px;height:58px;transform:translateY(-50%)}
.coachHero .heroAv .coachAvatar{width:58px;height:58px;box-shadow:0 0 0 3px #fff,0 10px 22px -10px rgba(74,58,170,.55)}
.coachPanel .coachDash{padding-top:6px}
.coachTab .coachDot{top:2px!important;right:-11px!important}

/* quick-reply chips (first-meeting style profile) */
.coachPills.simple{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.coachPills.simple .coachPill{width:auto;padding:8px 14px;border-radius:999px}
.coachPills.simple .coachPill b{font-size:13.5px;font-weight:600}