/* 首页第二屏动画 + 首屏聊天框（只在首页加载）
   10-19 王朋友：首页动画参考星盒星盒！内页，做得精炼——窗口、卡片、微信私聊都直接用内页的 xhxh.css（.xa / .xo / .xa-card），
   这里只放首页独有的部分（标签栏、优势标签、驾驶舱小卡、GEO 环形循环）。前缀 hd-。 */
.hd{margin-top:64px;position:relative}
.hd-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.hd-tab{font:inherit;cursor:pointer;border:0;display:flex;align-items:baseline;gap:8px;padding:9px 16px;border-radius:999px;background:var(--s1);color:var(--k2);position:relative;overflow:hidden}
.hd-tab b{font-size:14.5px;font-weight:600}.hd-tab span{font-size:12.5px;color:var(--k4)}
.hd-tab.on{background:var(--k);color:#fff}.hd-tab.on span{color:rgba(255,255,255,.6)}
.hd-tab i{position:absolute;left:0;bottom:0;height:2px;width:0;background:#5BC14A;transition:width .3s}
.hd-adv{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap}
.hd-adv[hidden]{display:none}
.hd-adv li{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--k3);padding:6px 12px 6px 6px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--ln);transition:background .3s,color .3s,box-shadow .3s}
.hd-adv li b{font-size:10.5px;font-weight:700;border-radius:999px;padding:1px 6px;background:var(--s2);color:var(--k3);transition:background .3s,color .3s}
.hd-adv li.on{background:#F3FBF0;color:#1C1C1E;box-shadow:inset 0 0 0 1.5px #5BC14A}.hd-adv li.on b{background:#5BC14A;color:#fff} /* 10-19 王朋友：子标签选中用绿框，不用黑块 */
.hd-pp{flex:none;font:inherit;cursor:pointer;border:0;width:34px;height:34px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--ln);display:flex;align-items:center;justify-content:center;color:var(--k)}
.hd-sc{display:none}.hd-sc.on{display:block;animation:hdin .4s ease both}
@keyframes hdin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.hd-n{font-size:12px;color:var(--k4);margin-top:12px;text-align:right}

/* 第一幕：和内页「微信里一句话调用」同一套界面 */
.hd .xa-body{min-height:0}
.hd .wx .xo-chat{height:560px}
.hd .xo-in input{background:#fff}
.hd .xo-side{gap:12px}
.hd-task{margin-left:auto;font-weight:600;font-size:11px;color:#2E7D22;background:#EAF6E6;border-radius:6px;padding:1px 7px}
.hd-task:empty{display:none}
.hd-kbn{margin-left:auto;font-size:15px;color:#1C1C1E;font-variant-numeric:tabular-nums}
.hd-dots{display:inline-flex;gap:3px}.hd-dots i{width:5px;height:5px;border-radius:50%;background:#B5B5B5;animation:hdtp 1s infinite}
.hd-dots i:nth-child(2){animation-delay:.15s}.hd-dots i:nth-child(3){animation-delay:.3s}
@keyframes hdtp{0%,60%,100%{opacity:.3}30%{opacity:1}}
.hd-k3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.hd-k3 div{background:#F7F7F9;border-radius:10px;padding:8px 10px}
.hd-k3 small{display:block;font-size:11px;color:#8E8E93}
.hd-k3 b{display:block;font-size:20px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.3;border-radius:6px;transition:background .3s}
.hd-k3 b.hd-hit{animation:hdhit 1.2s ease}
@keyframes hdhit{0%{color:#2E7D22}100%{color:inherit}}
.hd-feed{margin-top:8px;display:flex;flex-direction:column}
.hd-feed li{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:6px;font-size:12px;padding:5px 0;border-top:1px solid #F0F0F3;align-items:baseline}
.hd-feed li:first-child{border-top:0}
.hd-feed li span:first-child{color:#C7C7CC;font-variant-numeric:tabular-nums}
.hd-feed li span:nth-child(2){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-feed li em{font-style:normal;color:#2E7D22;font-weight:700}
.hd-feed li.nw{animation:hdin .4s ease both}

/* 第二幕：GEO 环形全自动循环 */
.hd-geo{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:14px;align-items:center}
.hd-ring{background:#fff;border-radius:16px;padding:10px}
.hd-ring svg{width:100%;height:auto;display:block}
.hd-track{fill:none;stroke:#EDEDF0;stroke-width:6}
.hd-arc{fill:none;stroke:#5BC14A;stroke-width:6;stroke-linecap:round}
.hd-nd circle{fill:#fff;stroke:#DCDCE0;stroke-width:2;transition:fill .3s,stroke .3s}
.hd-nd text{font-size:13px;font-weight:700;fill:#8E8E93;font-family:inherit}
.hd-nd text.lb{font-size:13.5px;font-weight:600;fill:#1C1C1E}
.hd-nd.ok circle{fill:#EAF6E6;stroke:#5BC14A}.hd-nd.ok text{fill:#2E7D22}.hd-nd.ok text.lb{fill:#1C1C1E}
.hd-nd.on circle{fill:#5BC14A;stroke:#5BC14A}.hd-nd.on text{fill:#fff}.hd-nd.on text.lb{fill:#1C1C1E}
.hd-dot{fill:#1C1C1E;stroke:#fff;stroke-width:3}
.hd-c1{font-size:14px;fill:#8E8E93;font-weight:600}
.hd-c2{font-size:46px;font-weight:800;fill:#1C1C1E;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.hd-c3{font-size:12px;fill:#8E8E93}
.hd-gside{display:flex;flex-direction:column;gap:12px}
.hd-gt{font-size:20px;font-weight:700;margin-top:2px}
.hd-gd{font-size:14px;color:#48484A;margin-top:4px}
.hd-gm{font-size:13px;color:#2E7D22;background:#EAF6E6;border-radius:10px;padding:8px 11px;margin-top:10px}
.hd-note{font-size:12px;color:#8E8E93;margin-top:10px}
.hd-trend{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-items:end;height:120px}
.hd-trend div{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px;transition:opacity .4s}
.hd-trend div.dim{opacity:.25}
.hd-trend b{font-size:13px;font-weight:700}
.hd-trend i{display:block;width:60%;border-radius:6px 6px 2px 2px;background:#5BC14A}
.hd-trend div:first-child i{background:#C7C7CC}
.hd-trend span{font-size:11px;color:#8E8E93}
.hd-rounds{margin-top:10px;display:flex;flex-direction:column;gap:4px}
.hd-rounds li{font-size:12.5px;display:flex;gap:8px;align-items:baseline}
.hd-rounds li b{font-weight:600;width:52px}
.hd-rounds li em{margin-left:auto;font-style:normal;color:#2E7D22;font-weight:700}
.hd-rounds li.hd-done{color:#2E7D22;font-weight:600}

@media (max-width:900px){.hd-geo{grid-template-columns:1fr}.hd-adv{margin-left:0;width:100%}}
@media (max-width:640px){.hd-tab span{display:none}.hd-adv li{font-size:12px}.hd .wx .xo-chat{height:520px}}

/* ---------- 首屏聊天框：更宽、深色，像聊天入口而不是卡片（10-19 王朋友） ---------- */
.hero #hero-chat{max-width:880px;background:#111214;color:#F2F2F2;border-radius:22px;box-shadow:0 34px 80px -28px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.04)}
#hero-chat .chat-hd b{color:#fff}
#hero-chat .chat-av img{content:url(/static/img/icon-green.png)}
#hero-chat .chat-rt{color:#8E8E93}
#hero-chat .chat-clr{color:#8E8E93}#hero-chat .chat-clr:hover{background:#26272B;color:#fff}
#hero-chat .chat-exp{background:#26272B;color:#B0B0B5}#hero-chat .chat-exp:hover{background:#34353A;color:#fff}
#hero-chat .chat-st{color:#5BD07A!important}
#hero-chat .bub.a{background:#232428;color:#EDEDED}
#hero-chat .bub.u{background:#fff;color:#111}
#hero-chat .bub.md a{color:#fff}
#hero-chat .bub.t i{background:#77777C}#hero-chat .bub-s{color:#8E8E93}
#hero-chat .ctime,#hero-chat .cnote{color:#6E6E73}
#hero-chat .chat-log .sugg button{background:#1C1D20;color:#DADADA;box-shadow:inset 0 0 0 1px #34353A}
#hero-chat .chat-log .sugg button:hover{box-shadow:inset 0 0 0 1px #fff;color:#fff}
#hero-chat .leadc{background:#fff;color:#111}
#hero-chat .chat-cmp{background:#fff;color:#111;border-radius:16px;margin:6px 12px 10px;padding:6px 8px 8px 16px;transition:box-shadow .2s}
#hero-chat .chat-cmp:focus-within{box-shadow:0 0 0 3px rgba(255,255,255,.22)}
#hero-chat textarea{color:#111}
#hero-chat .chat-disc{color:#6E6E73}
#hero-chat .chat-log::-webkit-scrollbar{width:6px}#hero-chat .chat-log::-webkit-scrollbar-thumb{background:#3A3A3E;border-radius:3px}
@media (max-width:640px){.hero #hero-chat{border-radius:18px}#hero-chat .chat-cmp{margin:6px 8px 8px}}
