:root{
  --brand:#0EA47A; --brand-d:#0B8666; --brand-l:#E7F6F1;
  --ink:#10151A; --ink2:#5E6A75; --ink3:#98A2AB; --ink4:#C6CCD2;
  --line:#E4E7EA; --line2:#F0F2F4;
  --bg:#F2F3F5; --chrome:#F7F8F9; --surf:#fff;
  --chat:#EDEEF0; --out:#A6E9D0;
  --red:#FA5151; --amber:#FF9A2E; --blue:#3E7BFA; --purple:#7C5CFF;
  --ui:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Noto Sans SC","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono","Roboto Mono",Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--ui); color:var(--ink); background:#DBDDE0;
  background-image:radial-gradient(circle at 1px 1px, rgba(16,21,26,.10) 1px, transparent 0);
  background-size:16px 16px;
  padding-bottom:72px;
}
.ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none;display:block}
.ic.s{width:17px;height:17px}
.ic.xs{width:14px;height:14px;stroke-width:2}
.ic.l{width:26px;height:26px}

/* ---------- 页面外壳 ---------- */
.top{position:sticky;top:0;z-index:50;background:rgba(24,29,35,.93);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.09)}
.top-in{max-width:1560px;margin:0 auto;padding:14px 22px 0}
.top h1{font-size:15px;font-weight:650;color:#fff;letter-spacing:.2px}
.top h1 b{color:var(--brand);font-weight:650}
.top p{font-family:var(--mono);font-size:10.5px;color:#8A939C;margin-top:5px;letter-spacing:.3px}
.chips{display:flex;gap:7px;overflow-x:auto;padding:13px 0 12px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{font-family:var(--mono);font-size:11px;letter-spacing:.3px;color:#A7B0B8;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.10);padding:6px 12px;border-radius:99px;white-space:nowrap;cursor:pointer;text-decoration:none;transition:.15s}
.chip:hover{color:#fff;background:rgba(255,255,255,.14)}
.chip.on{color:#04140F;background:var(--brand);border-color:var(--brand);font-weight:600}
.wrap{max-width:1560px;margin:0 auto;padding:0 22px}

.sec{padding:52px 0 8px}
.sec-h{display:flex;align-items:baseline;gap:14px;padding-bottom:26px;border-bottom:1px solid rgba(16,21,26,.14);margin-bottom:38px}
.sec-n{font-family:var(--mono);font-size:11px;color:#fff;background:var(--acc);padding:4px 9px;border-radius:5px;letter-spacing:.5px;font-weight:600}
.sec-h h2{font-size:20px;font-weight:680;letter-spacing:-.2px}
.sec-h span{font-family:var(--mono);font-size:11px;color:#7E878F;margin-left:auto;letter-spacing:.3px}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(392px,100%),1fr));gap:60px 30px;justify-items:center}
.art{width:100%;max-width:400px}
.lbl{display:flex;align-items:center;gap:8px;margin-bottom:11px;padding-left:3px}
.lbl i{width:7px;height:7px;border-radius:2px;background:var(--acc);flex:none}
.lbl b{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.2px;color:#1E252C}
.lbl em{font-family:var(--mono);font-size:10.5px;font-style:normal;color:#7B848C;letter-spacing:.2px}
.note{font-family:var(--mono);font-size:10.5px;line-height:1.65;color:#5F686F;margin-top:12px;padding-left:3px;letter-spacing:.1px}
.note b{color:var(--acc);font-weight:600}

/* ---------- 设备 ---------- */
.bez{background:#171C22;border-radius:52px;padding:9px;box-shadow:0 22px 44px -14px rgba(10,15,20,.42),0 3px 10px rgba(10,15,20,.22),inset 0 0 0 1px rgba(255,255,255,.07)}
.dev{position:relative;height:790px;background:var(--surf);border-radius:44px;overflow:hidden;display:flex;flex-direction:column;font-size:15px;line-height:1.35}
/* 状态栏 */
.sb{height:46px;flex:none;display:flex;align-items:flex-end;justify-content:space-between;padding:0 24px 7px;position:relative;z-index:6;font-size:14px;font-weight:640;letter-spacing:.2px}
.sb .island{position:absolute;top:9px;left:50%;transform:translateX(-50%);width:88px;height:24px;background:#0B0F13;border-radius:99px}
.sb .r{display:flex;align-items:center;gap:5px}
.sb .bars{display:flex;align-items:flex-end;gap:1.6px;height:10px}
.sb .bars i{width:3px;background:currentColor;border-radius:1px}
.sb .bars i:nth-child(1){height:4px}.sb .bars i:nth-child(2){height:6px}
.sb .bars i:nth-child(3){height:8px}.sb .bars i:nth-child(4){height:10px}
.sb .bat{width:23px;height:11.5px;border:1.4px solid currentColor;border-radius:3.5px;padding:1.5px;opacity:.9;position:relative}
.sb .bat::after{content:"";position:absolute;right:-3.5px;top:3.5px;width:2px;height:4px;background:currentColor;border-radius:0 1px 1px 0;opacity:.55}
.sb .bat i{display:block;height:100%;width:72%;background:currentColor;border-radius:1.5px}
/* 内容区 */
.scr{flex:1;overflow-y:auto;overflow-x:hidden;background:var(--bg);position:relative}
.scr::-webkit-scrollbar{width:0}
.home{height:26px;flex:none;display:flex;align-items:center;justify-content:center;background:inherit;position:relative;z-index:6}
.home::after{content:"";width:132px;height:5px;border-radius:99px;background:#10151A;opacity:.86}
.dev.dark{background:#101418;color:#F2F4F6}
.dev.dark .home::after{background:#fff;opacity:.5}

/* ---------- 导航栏 ---------- */
.nav{flex:none;height:46px;display:flex;align-items:center;gap:10px;padding:0 14px;background:var(--chrome);
  border-bottom:.5px solid var(--line);position:relative;z-index:5}
.nav .t{position:absolute;left:0;right:0;text-align:center;font-size:16.5px;font-weight:640;pointer-events:none;letter-spacing:.2px}
.nav .t small{display:block;font-size:11px;font-weight:500;color:var(--brand);margin-top:1px;letter-spacing:.2px}
.nav .a{display:flex;align-items:center;gap:16px;position:relative;z-index:2;color:var(--ink)}
.nav .a.r{margin-left:auto}
.nav .txt{font-size:15px;color:var(--ink2)}
.nav .btn{background:var(--brand);color:#fff;font-size:13.5px;font-weight:600;padding:5.5px 14px;border-radius:6px}
.nav .btn.off{background:#DDE1E4;color:#9AA3AB}

/* ---------- 底部 Tab ---------- */
.tabs{flex:none;display:flex;background:var(--chrome);border-top:.5px solid var(--line);padding:7px 0 2px}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--ink3);position:relative}
.tab span{font-size:10.5px;letter-spacing:.3px}
.tab.on{color:var(--brand)}
.tab .d{position:absolute;top:-2px;left:calc(50% + 7px);min-width:17px;height:17px;padding:0 5px;border-radius:99px;
  background:var(--red);color:#fff;font-size:10.5px;font-weight:600;display:flex;align-items:center;justify-content:center;
  border:1.6px solid var(--chrome);letter-spacing:0}
.tab .dot{position:absolute;top:0;left:calc(50% + 9px);width:9px;height:9px;border-radius:99px;background:var(--red);border:1.6px solid var(--chrome)}

/* ---------- 列表 ---------- */
.grp{background:var(--surf);margin-top:9px}
.grp:first-child{margin-top:0}
.gh{font-size:11.5px;color:var(--ink3);padding:15px 16px 7px;letter-spacing:.4px;background:var(--bg)}
.r{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--surf);position:relative}
.r+.r::before{content:"";position:absolute;top:0;left:16px;right:0;height:.5px;background:var(--line2)}
.r.ind+.r::before{left:56px}
.r .ri{width:27px;height:27px;border-radius:7px;display:flex;align-items:center;justify-content:center;color:#fff;flex:none}
.r .m{flex:1;min-width:0}
.r .n{font-size:15.5px;letter-spacing:.1px}
.r .s{font-size:12.5px;color:var(--ink3);margin-top:2px}
.r .v{font-size:13.5px;color:var(--ink3);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.r .cv{color:var(--ink4);flex:none}
.r.tapd{background:#EDEFF1}
.r.red .n{color:var(--red)}
.r.ctr{justify-content:center}
.r.ctr .n{color:var(--brand)}

/* 开关 */
.sw{width:47px;height:28px;border-radius:99px;background:#E2E5E8;flex:none;position:relative;transition:.2s}
.sw::after{content:"";position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:99px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:.2s}
.sw.on{background:var(--brand)}
.sw.on::after{left:21px}

/* 头像 */
.av{border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;font-weight:600;
  width:46px;height:46px;letter-spacing:.5px;overflow:hidden;position:relative}
.av.sm{width:36px;height:36px;border-radius:9px;font-size:13px}
.av.xs{width:26px;height:26px;border-radius:7px;font-size:10.5px}
.av.lg{width:62px;height:62px;border-radius:14px;font-size:22px}
.av.xl{width:74px;height:74px;border-radius:16px;font-size:26px}
.c1{background:linear-gradient(140deg,#2FBF8F,#0E8F72)}
.c2{background:linear-gradient(140deg,#5C8DF6,#3457C9)}
.c3{background:linear-gradient(140deg,#FF9B4A,#F0692F)}
.c4{background:linear-gradient(140deg,#A57BF5,#6F45D6)}
.c5{background:linear-gradient(140deg,#F2678E,#D33A66)}
.c6{background:linear-gradient(140deg,#4BC3D6,#2189B0)}
.c7{background:linear-gradient(140deg,#8D97A3,#5B6672)}
.c8{background:linear-gradient(140deg,#F5C34B,#E09415)}
/* 群头像九宫格 */
.gav{width:46px;height:46px;border-radius:12px;background:#D9DDE1;padding:2.5px;display:grid;grid-template-columns:1fr 1fr;gap:2px;flex:none}
.gav i{border-radius:3px;display:block}

/* 徽标 */
.bd{min-width:19px;height:19px;padding:0 6px;border-radius:99px;background:var(--red);color:#fff;font-size:11.5px;font-weight:600;
  display:flex;align-items:center;justify-content:center;flex:none;letter-spacing:0}
.bd.dot{min-width:9px;width:9px;height:9px;padding:0}
.bd.mute{background:#C4CAD0}
.pill{font-size:10.5px;padding:2px 7px;border-radius:5px;background:var(--brand-l);color:var(--brand-d);font-weight:600;letter-spacing:.2px}
.pill.g{background:#EEF0F2;color:var(--ink2)}
.pill.r{background:#FFEBEB;color:#D83A3A}

/* 搜索 */
.sfield{background:var(--bg);padding:8px 12px}
.sinput{background:#E7EAED;border-radius:9px;height:36px;display:flex;align-items:center;justify-content:center;gap:6px;
  color:var(--ink3);font-size:14.5px}
.sinput.act{justify-content:flex-start;padding:0 11px;background:#E7EAED;color:var(--ink)}
.cur{width:1.6px;height:17px;background:var(--brand);border-radius:1px;animation:bl 1.1s steps(1,end) infinite}
@keyframes bl{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.cur{animation:none}}
.fchips{display:flex;gap:7px;padding:2px 12px 10px;overflow:hidden}
.fchip{font-size:12.5px;padding:5px 11px;border-radius:99px;background:#E7EAED;color:var(--ink2);white-space:nowrap}
.fchip.on{background:var(--brand);color:#fff;font-weight:600}
.hl{color:var(--brand);font-weight:600}

/* ---------- 聊天 ---------- */
.chatbg{background:var(--chat);padding:10px 0 14px;min-height:100%}
.sysline{text-align:center;font-size:11.5px;color:#9AA3AB;margin:10px 0}
.syspill{display:inline-block;background:rgba(16,21,26,.07);color:#6E777F;font-size:11.5px;padding:4px 10px;border-radius:6px;max-width:78%;line-height:1.5}
.e2e{display:flex;align-items:center;justify-content:center;gap:5px;margin:2px 22px 12px;background:#FFF6E2;color:#9A7220;
  font-size:11.5px;padding:7px 11px;border-radius:8px;line-height:1.5;text-align:left}
.msg{display:flex;gap:9px;padding:5px 13px;align-items:flex-start}
.msg.me{flex-direction:row-reverse}
.mb{max-width:236px;position:relative}
.who{font-size:11.5px;color:#8B949C;margin:0 0 4px 3px}
.bub{position:relative;background:#fff;padding:9px 12px;border-radius:5px;font-size:15.5px;line-height:1.46;
  box-shadow:0 1px 1px rgba(16,21,26,.05);word-break:break-word}
.msg.me .bub{background:var(--out)}
/* 气泡尾巴：微信最好认的一个特征。用 border 画三角，跟着气泡底色走 */
.bub::before{content:'';position:absolute;top:11px;left:-5px;border:5px solid transparent;
  border-right-color:#fff;border-left:0}
.msg.me .bub::before{left:auto;right:-5px;border-right:0;border-left:5px solid var(--out)}
.bub .at{color:#2E7CD6}
.meta{display:flex;align-items:center;gap:5px;font-size:10.5px;color:#9AA3AB;margin-top:4px;justify-content:flex-end}
.msg:not(.me) .meta{justify-content:flex-start;margin-left:3px}
/* 纯表情消息：放大、不套气泡 */
.bigemo{font-size:44px;line-height:1.12;padding:2px 0}
.bigemo.n2{font-size:38px}
.bigemo.n3{font-size:32px}
/* 语音气泡：宽度由 JS 按时长给，喇叭朝气泡外侧 */
.voice{display:flex;align-items:center;gap:8px;cursor:pointer}
.voice .vico{display:flex;align-items:center;color:var(--ink2);transform:scaleX(-1)}
.msg.me .voice{flex-direction:row-reverse}
.msg.me .voice .vico{transform:none}
.voice .vsec{flex:none;font-size:12.5px;color:#5C6570;margin-left:auto}
.msg.me .voice .vsec{margin-left:0;margin-right:auto}
/* 未听过的红点，听过就消失 —— 群里几十条语音时靠它认哪条还没听 */
.voice .vdot{position:absolute;top:-2px;right:-9px;width:7px;height:7px;border-radius:99px;background:#FA5151}
.msg.me .voice .vdot{display:none}
.voice.played .vdot{display:none}
/* 播放时喇叭一格格亮，和微信一样 */
.voice.playing .vico{animation:vhorn .9s steps(1) infinite}
@keyframes vhorn{0%{opacity:.35}33%{opacity:.65}66%{opacity:1}}
/* 图片气泡 */
.imgb{border-radius:9px;overflow:hidden;width:172px;height:128px;position:relative}
.ph{width:100%;height:100%;display:block}
.g1{background:linear-gradient(150deg,#7FB2E8,#3E68B8 60%,#26406F)}
.g2{background:linear-gradient(150deg,#FFCE8A,#F08A4B 55%,#C7563C)}
.g3{background:linear-gradient(150deg,#9CE0C4,#3FA98A 60%,#1E6B5C)}
.g4{background:linear-gradient(150deg,#C6B2F2,#7A5BD0 60%,#4A2F94)}
.g5{background:linear-gradient(150deg,#F5A3B8,#D2536F 60%,#8C2B47)}
.g6{background:linear-gradient(150deg,#A8C0D0,#5E7A8C 60%,#33475A)}
/* 文件/链接卡片 */
.card{background:#fff;border-radius:9px;padding:11px;width:228px;box-shadow:0 1px 1px rgba(16,21,26,.05)}
.msg.me .card{background:var(--out)}
.fcard{display:flex;gap:10px;align-items:center}
.fcard .fi{width:38px;height:44px;border-radius:5px;background:#EDF0F3;display:flex;align-items:center;justify-content:center;
  color:#5E7A9E;font-family:var(--mono);font-size:9.5px;font-weight:700;flex:none;letter-spacing:.3px}
.fcard .fn{font-size:14px;line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.fcard .fs{font-size:11.5px;color:var(--ink3);margin-top:3px}
.lcard{display:flex;gap:10px}
.lcard .lt{font-size:14px;line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lcard .ld{font-size:11.5px;color:var(--ink3);margin-top:4px}
.lcard .li{width:44px;height:44px;border-radius:6px;flex:none}
/* 输入栏 */
.inbar{flex:none;background:var(--chrome);border-top:.5px solid var(--line);padding:8px 11px;display:flex;align-items:center;gap:10px;color:var(--ink2)}
.tf{flex:1;height:36px;background:#fff;border-radius:8px;display:flex;align-items:center;padding:0 11px;font-size:15px;color:var(--ink3);gap:1px}
.tf.hold{justify-content:center;background:#fff;color:var(--ink);font-size:14.5px}
.sendb{background:var(--brand);color:#fff;font-size:14px;font-weight:600;padding:7px 15px;border-radius:7px}

/* ---------- 朋友圈 ---------- */
.cover{height:264px;position:relative;background:linear-gradient(155deg,#3C6E8F,#1E3A52 65%,#132638)}
.cover .cn{position:absolute;right:88px;bottom:20px;text-align:right;color:#fff;font-size:16.5px;font-weight:600;text-shadow:0 1px 4px rgba(0,0,0,.4)}
.cover .ca{position:absolute;right:16px;bottom:-22px;border:3px solid #fff;border-radius:14px;box-shadow:0 2px 6px rgba(0,0,0,.15)}
.post{background:#fff;padding:14px 16px 10px;display:flex;gap:11px}
.post+.post{border-top:.5px solid var(--line2)}
.post .pm{flex:1;min-width:0}
.pn{color:#3E5C8C;font-size:15px;font-weight:600}
.pt{font-size:15px;line-height:1.5;margin-top:5px;word-break:break-word}
.pimgs{display:grid;gap:4px;margin-top:9px}
.pimgs.n1{grid-template-columns:150px}
.pimgs.n3{grid-template-columns:repeat(3,1fr)}
.pimgs.n2{grid-template-columns:repeat(2,86px)}
.pimgs i{aspect-ratio:1;border-radius:4px;display:block}
.pimgs.n1 i{aspect-ratio:4/3}
.ploc{font-size:12px;color:#5E7BA8;margin-top:8px;display:flex;align-items:center;gap:3px}
.pbar{display:flex;align-items:center;margin-top:8px;font-size:12px;color:var(--ink3)}
.pbar .ac{margin-left:auto;background:#F0F2F4;border-radius:5px;padding:4px 9px;display:flex;gap:11px;color:#5E6A75}
.likes{background:#F5F6F8;border-radius:5px;padding:8px 10px;margin-top:9px;font-size:13.5px;line-height:1.6;color:#3E5C8C}
.likes .cm{color:var(--ink);display:block;margin-top:3px}
.likes .cm b{color:#3E5C8C;font-weight:600}
.likes .hr{height:.5px;background:#E4E7EA;margin:7px 0}

/* WebView */
.wv-bar{height:3px;background:#E4E7EA;position:relative;flex:none}
.wv-bar i{position:absolute;inset:0 auto 0 0;width:62%;background:var(--brand);border-radius:0 2px 2px 0}
.wv-sec{background:#F0F2F4;color:var(--ink3);font-size:11.5px;padding:6px 16px;display:flex;align-items:center;gap:5px;justify-content:center}
.sk{background:#fff;padding:16px}
.skl{height:13px;border-radius:4px;background:linear-gradient(90deg,#EDEFF2 25%,#F6F7F9 50%,#EDEFF2 75%);background-size:200% 100%;animation:sh 1.4s linear infinite;margin-bottom:10px}
@keyframes sh{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.skl{animation:none}}
.wv-nav{flex:none;height:44px;background:var(--chrome);border-top:.5px solid var(--line);display:flex;align-items:center;
  justify-content:space-around;color:var(--ink2)}
.dbg{background:#101418;color:#7FE3C0;font-family:var(--mono);font-size:10px;line-height:1.75;padding:10px 12px;margin:10px;border-radius:8px;letter-spacing:.2px}
.dbg b{color:#5E6A75;font-weight:400}
.dbg u{color:#FFC46B;text-decoration:none}

/* 通讯录索引 */
.idx{position:absolute;right:3px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:1px;
  font-size:10px;color:var(--ink3);font-weight:600;align-items:center;z-index:4}
.idx b{color:var(--brand)}

/* 通用小件 */
.hero{padding:22px 16px;background:#fff;display:flex;align-items:center;gap:14px}
.hero .hn{font-size:21px;font-weight:640;letter-spacing:.2px}
.hero .hid{font-size:12.5px;color:var(--ink3);margin-top:5px;font-family:var(--mono);letter-spacing:.2px}
.field{background:#fff;padding:13px 16px;display:flex;align-items:center;gap:12px;position:relative}
.field+.field::before{content:"";position:absolute;top:0;left:16px;right:0;height:.5px;background:var(--line2)}
.field .fl{width:76px;font-size:15px;color:var(--ink2);flex:none}
.field .fv{flex:1;font-size:15.5px}
.field .fv.ph{color:var(--ink4)}
.tip{font-size:11.5px;color:var(--ink3);padding:9px 16px;line-height:1.65}
.cta{margin:20px 16px 0;height:46px;border-radius:10px;background:var(--brand);color:#fff;font-size:16px;font-weight:600;
  display:flex;align-items:center;justify-content:center;letter-spacing:.3px}
.cta.off{background:#DDE1E4;color:#A6AEB5}
.cta.gh{background:transparent;color:var(--brand);border:1px solid var(--brand)}
.mark{width:66px;height:66px;border-radius:19px;background:linear-gradient(145deg,#18C69A,#0B7D5D);display:flex;align-items:center;
  justify-content:center;color:#fff;box-shadow:0 8px 20px -8px rgba(11,125,93,.7)}
.bars-seg{display:flex;height:11px;border-radius:99px;overflow:hidden;background:#E7EAED}
.bars-seg i{display:block;height:100%}
.lg{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink2)}
.lg i{width:9px;height:9px;border-radius:3px}

@media (max-width:760px){
  body{overflow-x:hidden}
  .top-in,.wrap{padding-left:14px;padding-right:14px}
  .sec{padding-top:36px}
  .sec-h{margin-bottom:26px;padding-bottom:18px}
  .sec-h h2{font-size:17px}
  .sec-h span:last-child{display:none}
  .grid{gap:42px 0}
  .bez{padding:7px;border-radius:44px}
  .dev{border-radius:38px}
}
a:focus-visible,.chip:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:6px}

/* ══ v1.1 精修层 ══════════════════════════ */
body{background:#D8DBDE;background-image:radial-gradient(1100px 480px at 50% -140px,rgba(255,255,255,.75),rgba(255,255,255,0) 70%),radial-gradient(circle at 1px 1px,rgba(16,21,26,.09) 1px,transparent 0);background-size:auto,16px 16px}
/* 机身与屏幕质感 */
.bez{position:relative;background:linear-gradient(155deg,#252C35,#12161C 55%,#1B2129);box-shadow:0 36px 64px -22px rgba(8,12,18,.5),0 14px 30px -14px rgba(8,12,18,.3),0 2px 6px rgba(8,12,18,.22),inset 0 0 0 1px rgba(255,255,255,.10),inset 0 1.5px 1px rgba(255,255,255,.16)}
.bez::before{content:"";position:absolute;left:-2.5px;top:150px;width:3px;height:28px;border-radius:2px 0 0 2px;background:linear-gradient(90deg,#2E3540,#171C22);box-shadow:0 42px 0 0 #1E242C}
.bez::after{content:"";position:absolute;right:-2.5px;top:196px;width:3px;height:56px;border-radius:0 2px 2px 0;background:linear-gradient(270deg,#2E3540,#171C22)}
.dev::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:70;background:linear-gradient(112deg,rgba(255,255,255,.14),rgba(255,255,255,.05) 13%,rgba(255,255,255,0) 26%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.22),inset 0 0 10px rgba(0,0,0,.14)}
.sb .island{box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.sb .island::after{content:"";position:absolute;right:6px;top:50%;transform:translateY(-50%);width:9px;height:9px;border-radius:99px;background:radial-gradient(circle at 34% 32%,#3E5066,#0A0E12 62%)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .bez{transition:transform .45s cubic-bezier(.2,.85,.25,1)}
  .art:hover .bez{transform:translateY(-7px)}
}
/* 导航与 Tab */
.nav{background:linear-gradient(180deg,#FCFCFD,#F3F5F6);border-bottom-color:rgba(16,21,26,.09)}
.tabs{background:linear-gradient(180deg,#FCFCFD,#F5F6F7);border-top-color:rgba(16,21,26,.09);box-shadow:0 -8px 18px -14px rgba(16,21,26,.22)}
.tab.on svg{filter:drop-shadow(0 3px 6px rgba(14,164,122,.4))}
.grp{box-shadow:0 -.5px 0 rgba(16,21,26,.05),0 .5px 0 rgba(16,21,26,.05)}
/* 头像 / 图标位立体感 */
.av,.ri,.mark{position:relative}
.av:not([style*=dashed]){box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),inset 0 -7px 10px rgba(0,0,0,.12)}
.av:not([style*=dashed])::after,.ri::after,.mark::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(130% 85% at 28% 0%,rgba(255,255,255,.32),rgba(255,255,255,0) 48%);pointer-events:none}
.ri{box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),inset 0 -4px 6px rgba(0,0,0,.12)}
.bd{background:linear-gradient(180deg,#FF6B6B,#F03B3B);box-shadow:0 2px 6px -1px rgba(240,59,59,.55)}
.bd.mute{background:linear-gradient(180deg,#CBD1D7,#B4BCC3);box-shadow:0 2px 5px -1px rgba(120,130,140,.4)}
/* 气泡：小尾巴 + 层次阴影 */
.bub{position:relative;box-shadow:0 1px 1.5px rgba(16,21,26,.07),0 4px 12px -6px rgba(16,21,26,.12)}
.msg:not(.me) .mb>.bub::before{content:"";position:absolute;left:-5px;top:7px;width:8px;height:11px;background:#fff;clip-path:polygon(100% 0,0 42%,100% 100%)}
.msg.me .mb>.bub::before{content:"";position:absolute;right:-5px;top:7px;width:8px;height:11px;background:var(--out);clip-path:polygon(0 0,100% 42%,0 100%)}
.card{box-shadow:0 1px 1.5px rgba(16,21,26,.07),0 5px 14px -7px rgba(16,21,26,.14)}
.imgb{border-radius:10px;box-shadow:inset 0 0 0 .5px rgba(16,21,26,.12),0 3px 10px -5px rgba(16,21,26,.2)}
.imgb>svg{width:100%;height:100%;display:block}
.pimgs>*{aspect-ratio:1;border-radius:6px;display:block;width:100%;overflow:hidden;box-shadow:inset 0 0 0 .5px rgba(16,21,26,.08)}
.pimgs.n1>*{aspect-ratio:4/3}
.lcard .li{display:block;overflow:hidden;box-shadow:inset 0 0 0 .5px rgba(16,21,26,.1)}
/* 正在输入 */
.tdots{display:flex;gap:4px;align-items:center;padding:12px 13px}
.tdots i{width:6px;height:6px;border-radius:99px;background:#AAB3BB;animation:tp 1.15s ease-in-out infinite}
.tdots i:nth-child(2){animation-delay:.15s}.tdots i:nth-child(3){animation-delay:.3s}
@keyframes tp{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-3.5px);opacity:1}}
@media (prefers-reduced-motion:reduce){.tdots i{animation:none}}
/* 控件质感 */
.cta:not(.gh):not(.off){background:linear-gradient(180deg,#15BC8F,#0B8E6B);box-shadow:0 12px 22px -11px rgba(11,142,107,.7),inset 0 1px 0 rgba(255,255,255,.25)}
.sendb{background:linear-gradient(180deg,#15BC8F,#0B8E6B);box-shadow:0 4px 10px -4px rgba(11,142,107,.6)}
.nav .btn:not(.off){background:linear-gradient(180deg,#15BC8F,#0B8E6B);box-shadow:0 4px 10px -4px rgba(11,142,107,.55)}
.sw{box-shadow:inset 0 1px 3px rgba(16,21,26,.12)}
.sw.on{background:linear-gradient(180deg,#16BA8D,#0C9C76);box-shadow:inset 0 1px 2px rgba(6,70,54,.35)}
.sinput{box-shadow:inset 0 1px 2.5px rgba(16,21,26,.06)}
/* 朋友圈封面插画层 */
.coversc{position:absolute;inset:0;width:100%;height:100%;display:block}
/* 个人中心品牌卡片 */
.heroX{margin:12px 12px 0;padding:22px 18px;border-radius:20px;overflow:hidden;background:radial-gradient(130% 150% at 100% 0%,rgba(38,196,150,.30),rgba(38,196,150,0) 52%),linear-gradient(140deg,#153F34,#0A2721);box-shadow:0 18px 32px -18px rgba(6,40,32,.65),inset 0 1px 0 rgba(255,255,255,.09)}
.heroX::before,.heroX::after{content:"";position:absolute;border-radius:99px;border:1.5px solid rgba(255,255,255,.09);z-index:0}
.heroX::before{right:-52px;top:-52px;width:180px;height:180px}
.heroX::after{right:-16px;top:-16px;width:110px;height:110px;border-color:rgba(255,255,255,.07)}
.heroX>*{position:relative;z-index:1}
.heroX .hn{color:#fff}
.heroX .hid{color:#8FD2BC}
.heroX .pill{background:rgba(126,236,197,.16);color:#A6F2D8}
.heroX>svg{color:#BFE6D6}
.heroX .cv{color:rgba(255,255,255,.4)}
.heroX .av{box-shadow:0 12px 24px -12px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.25)}

/* ══ v1.2 文档对齐层 ══════════════════════ */
/* 引用回复 / 转发标记（Telegram 功能位） */
.quo{border-left:3px solid var(--brand);background:rgba(14,164,122,.09);border-radius:4px;padding:5px 9px 6px;margin-bottom:6px;font-size:12.5px;line-height:1.45}
.quo b{display:block;color:var(--brand-d);font-weight:600;font-size:12px;margin-bottom:1px}
.quo span{color:var(--ink2);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg.me .quo{background:rgba(11,134,102,.12);border-left-color:#0B8666}
.fwd{font-size:11.5px;color:var(--brand-d);font-weight:600;margin-bottom:4px;display:flex;align-items:center;gap:4px}
/* M-1 管理端 */
.browser{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 30px 60px -24px rgba(10,15,20,.35),0 4px 14px rgba(10,15,20,.12);border:1px solid rgba(16,21,26,.06)}
.bwbar{height:42px;background:linear-gradient(#F7F8F9,#EEF0F2);display:flex;align-items:center;gap:14px;padding:0 14px;border-bottom:1px solid var(--line)}
.bwdots{display:flex;gap:7px}.bwdots i{width:11px;height:11px;border-radius:99px}
.bwurl{flex:1;max-width:460px;margin:0 auto;height:26px;background:#fff;border:1px solid var(--line);border-radius:7px;display:flex;align-items:center;justify-content:center;gap:6px;padding:0 10px;font-family:var(--mono);font-size:11px;color:var(--ink2)}
.adm{display:flex;min-height:620px;background:#F5F6F8}
.adm-side{width:196px;flex:none;background:#0F241E;color:#B9CFC6;display:flex;flex-direction:column;padding:16px 10px 12px}
.adm-logo{display:flex;gap:9px;align-items:center;padding:4px 8px 16px;color:#fff;font-weight:650;font-size:13.5px}
.adm-mi{display:flex;gap:9px;align-items:center;padding:9px 10px;border-radius:8px;font-size:13px;margin-bottom:2px;white-space:nowrap}
.adm-mi.on{background:rgba(20,185,143,.18);color:#7FE8C6;font-weight:600}
.adm-user{margin-top:auto;display:flex;gap:9px;align-items:center;padding:10px 8px 2px;font-size:12px;color:#8FB8AA;white-space:nowrap}
.adm-main{flex:1;padding:20px 22px 26px;min-width:0}
.adm-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.adm-h h3{font-size:17px;font-weight:650}
.envtabs{display:flex;background:#E9ECEF;border-radius:8px;padding:3px;font-size:12.5px}
.envtabs span{padding:5px 13px;border-radius:6px;color:var(--ink2)}
.envtabs .on{background:#fff;color:var(--ink);font-weight:600;box-shadow:0 1px 3px rgba(16,21,26,.12)}
.acard{background:#fff;border-radius:12px;border:1px solid rgba(16,21,26,.06);padding:16px;box-shadow:0 1px 2px rgba(16,21,26,.04)}
.acard h4{font-size:13px;font-weight:650;margin-bottom:10px;display:flex;align-items:center;gap:7px}
.acard .hmeta{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--ink3);font-weight:400}
.frow{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line2);font-size:13px}
.frow:first-of-type{border-top:0}
.frow .fk{width:126px;flex:none;color:var(--ink);font-family:var(--mono);font-size:12px}
.frow .sw{flex:none;margin-left:auto}
.fdesc{font-size:11.5px;color:var(--ink3);flex:1;min-width:0}
.tsm{margin-left:auto;font-size:10.5px;color:var(--ink4);font-family:var(--mono);flex:none}
.finput{flex:1;height:32px;border:1px solid var(--line);border-radius:7px;display:flex;align-items:center;padding:0 10px;font-family:var(--mono);font-size:11.5px;background:#FBFCFC;color:var(--ink);min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.finput.lock{background:#F2F4F6;color:var(--ink3)}
.abtn{height:34px;padding:0 16px;border-radius:8px;font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:6px}
.abtn.p{background:linear-gradient(180deg,#15BC8F,#0B8E6B);color:#fff;box-shadow:0 6px 14px -6px rgba(11,142,107,.6)}
.abtn.g{background:#fff;border:1px solid var(--line);color:var(--ink2)}
.gslider{position:relative;height:6px;background:#E7EAED;border-radius:9px;margin:14px 8px 8px}
.gslider>i{position:absolute;left:0;top:0;bottom:0;width:20%;background:linear-gradient(90deg,#15BC8F,#0B8E6B);border-radius:9px}
.gslider>b{position:absolute;left:20%;top:50%;transform:translate(-50%,-50%);width:18px;height:18px;border-radius:99px;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.25)}
.tbl{width:100%;font-size:12.5px;border-collapse:collapse}
.tbl th{text-align:left;color:var(--ink3);font-weight:500;font-size:11.5px;padding:7px 8px;border-bottom:1px solid var(--line)}
.tbl td{padding:8px;border-bottom:1px solid var(--line2)}
.tbl tr:last-child td{border-bottom:0}
.agrid{display:grid;grid-template-columns:1.35fr 1fr;gap:16px;margin-top:16px}
@media (max-width:940px){
  .agrid{grid-template-columns:1fr}
  .adm{flex-direction:column}
  .adm-side{width:100%;flex-direction:row;align-items:center;overflow-x:auto;padding:10px;gap:2px}
  .adm-logo{padding:0 10px 0 4px}
  .adm-user{margin:0 4px 0 auto;padding:0 6px}
}
/* 文档对照清单 */
.cov{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:18px}
.ckrow{display:flex;gap:9px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--line2);font-size:13px;line-height:1.5}
.ckrow:first-of-type{border-top:0}
.ck{width:17px;height:17px;border-radius:6px;flex:none;display:flex;align-items:center;justify-content:center;margin-top:1px}
.ck.y{background:var(--brand);color:#fff}
.ck.n{background:#EDEFF1;color:var(--ink3)}
.ckrow .to{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--ink3);text-align:right;flex:none;padding-left:10px;white-space:nowrap}

/* ══ v1.3 服务功能层 ══════════════════════ */
/* 视频消息 */
.vplay{position:absolute;inset:0;margin:auto;width:40px;height:40px;border-radius:99px;background:rgba(10,14,18,.5);display:flex;align-items:center;justify-content:center}
.vdur{position:absolute;right:6px;bottom:6px;background:rgba(10,14,18,.62);color:#fff;font-size:10.5px;padding:2px 6px;border-radius:5px;font-family:var(--mono)}
/* 失败态 / 大表情 */
.failb{width:22px;height:22px;border-radius:99px;background:var(--red);color:#fff;font-weight:700;font-size:13.5px;display:flex;align-items:center;justify-content:center;flex:none;margin-top:6px;box-shadow:0 3px 7px -2px rgba(240,60,60,.6)}
.stk{font-size:52px;line-height:1.15;padding:2px;filter:drop-shadow(0 4px 8px rgba(16,21,26,.2))}
/* 长按菜单 */
.dim{position:absolute;inset:0;background:rgba(16,21,26,.42);backdrop-filter:blur(2.5px);z-index:3}
.float{position:absolute;z-index:4;left:0;right:0;padding:0 13px;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.menu{background:#fff;border-radius:14px;box-shadow:0 18px 40px -14px rgba(10,15,20,.42);overflow:hidden;width:208px}
.menu .mi{display:flex;align-items:center;gap:11px;padding:10.5px 14px;font-size:14.5px}
.menu .mi+.mi{border-top:.5px solid var(--line2)}
/* 密聊 */
.burn{border:1.2px dashed var(--ink4);color:var(--ink3);background:#FAFBFB;font-size:13px;padding:8px 12px;border-radius:10px;display:flex;gap:6px;align-items:center}
.tmr{display:inline-flex;align-items:center;gap:3px;background:rgba(14,164,122,.12);color:var(--brand-d);font-size:10px;padding:1.5px 6px;border-radius:99px;font-family:var(--mono)}
.blurwrap{position:relative}
.blurwrap>svg{filter:blur(7px) saturate(.9)}
.blurwrap .tapview{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:#fff;font-size:11.5px;line-height:1.5;text-align:center;text-shadow:0 1px 3px rgba(0,0,0,.55)}
/* 多选联系人 */
.pickc{width:22px;height:22px;border-radius:99px;border:1.6px solid var(--ink4);flex:none}
.pickc.on{background:var(--brand);border-color:var(--brand);display:flex;align-items:center;justify-content:center;color:#fff}
.chsel{display:inline-flex;align-items:center;gap:6px;background:#EAF6F1;border-radius:99px;padding:3px 9px 3px 4px;font-size:12.5px;color:var(--brand-d);font-weight:600}

/* ══ v1.5 桌面端与控制台 ══════════════════ */
.win{background:#fff;border-radius:14px;overflow:hidden;border:1px solid rgba(16,21,26,.06);box-shadow:0 30px 60px -24px rgba(10,15,20,.35),0 4px 14px rgba(10,15,20,.12)}
.winbar{height:38px;background:linear-gradient(#F7F8F9,#EDEFF1);display:flex;align-items:center;padding:0 14px;border-bottom:1px solid var(--line);position:relative}
.winbar .t{position:absolute;left:0;right:0;text-align:center;font-size:12.5px;color:var(--ink2);font-weight:600;pointer-events:none}
.rail{width:64px;flex:none;background:#10241E;display:flex;flex-direction:column;align-items:center;padding:14px 0 12px;gap:8px}
.rail .ri2{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;color:#7FA79A;position:relative}
.rail .ri2.on{background:rgba(20,185,143,.18);color:#7FE8C6}
.rail .ri2 .bd{position:absolute;top:-3px;right:-5px;border:1.6px solid #10241E}
.rail .ri2 .dot2{position:absolute;top:1px;right:1px;width:8px;height:8px;border-radius:99px;background:var(--red);border:1.6px solid #10241E}
.dlist{width:262px;flex:none;background:#F3F5F6;border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
.dlist .r{padding:10px 12px;background:transparent}
.dlist .r+.r::before{left:12px}
.dlist .r.act{background:#DFE8E3}
.dchat{flex:1;display:flex;flex-direction:column;background:#F5F6F7;min-width:0}
.dhead{height:54px;flex:none;display:flex;align-items:center;gap:14px;padding:0 18px;border-bottom:1px solid var(--line);background:#F7F8F9}
.dmsgs{flex:1;padding:16px 6px;overflow:hidden}
.dmsgs .mb{max-width:460px}
.dinput{flex:none;border-top:1px solid var(--line);background:#F7F8F9;padding:8px 14px 12px}
.dtools{display:flex;gap:16px;color:var(--ink2);padding:2px 2px 9px}
.dtxt{min-height:78px;font-size:14.5px;line-height:1.6}
.qrbox{width:196px;height:196px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;position:relative;box-shadow:0 10px 24px -14px rgba(16,21,26,.25)}
.qrbox svg{width:100%;height:100%;display:block}
.qrlogo{position:absolute;inset:0;margin:auto;width:40px;height:40px;border-radius:11px;background:linear-gradient(145deg,#18C69A,#0B7D5D);display:flex;align-items:center;justify-content:center;color:#fff;border:3px solid #fff}
.kgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:16px}
.kpi .kl{font-size:11.5px;color:var(--ink3)}
.kpi .kv{font-size:23px;font-weight:680;margin-top:6px;letter-spacing:-.5px}
.kpi .kd{margin-top:8px}
@media (max-width:940px){.kgrid{grid-template-columns:repeat(2,1fr)}}

/* ══ v1.6 Telegram Desktop 版式 ══════════ */
.tg{--tgb:#40A7E3;--tglink:#168ACD;--tgout:#EFFDDE;--tgtick:#4FAE4E;--tggreen:#4DCD5E;
  display:flex;height:640px;background:#fff;font-size:14px}
.tg .av{border-radius:50%!important}
.tg .gav{border-radius:50%!important;overflow:hidden}
/* 文件夹栏 */
.tgf{width:66px;flex:none;background:#F5F6F7;border-right:1px solid #E7E7E7;display:flex;flex-direction:column;align-items:center;padding:8px 0;gap:2px}
.tgf .fi2{width:58px;padding:8px 0 6px;border-radius:12px;display:flex;flex-direction:column;align-items:center;gap:3px;color:#7E868D;position:relative}
.tgf .fi2 span{font-size:10.5px}
.tgf .fi2.on{color:var(--tglink);background:#E7F3FB}
.tgf .fbd{position:absolute;top:3px;right:6px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--tggreen);color:#fff;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center}
/* 会话列表 */
.tgl{width:288px;flex:none;border-right:1px solid #E7E7E7;display:flex;flex-direction:column;background:#fff;min-height:0}
.tgl-top{display:flex;align-items:center;gap:10px;padding:9px 10px}
.tgl-top .sinput{flex:1;height:34px;border-radius:17px;background:#F1F1F1;box-shadow:none;font-size:13.5px;justify-content:flex-start;padding:0 13px;gap:8px}
.tgr{display:flex;gap:11px;padding:8px 10px;align-items:center;position:relative}
.tgr .tname{font-size:14px;font-weight:600;display:flex;align-items:center;gap:5px}
.tgr .tprev{font-size:13px;color:#8E9398;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tgr .ttime{font-size:11.5px;color:#8E9398}
.tgbd{min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--tggreen);color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center}
.tgbd.mute{background:#C6CBCE}
.tgr .odot{position:absolute;left:44px;bottom:8px;width:11px;height:11px;border-radius:99px;background:#33C15C;border:2px solid #fff}
.tgr.act{background:var(--tgb)}
.tgr.act .tname,.tgr.act .ttime{color:#fff}
.tgr.act .tprev{color:rgba(255,255,255,.85)}
.tgr.act .tgbd{background:#fff;color:var(--tglink)}
/* 聊天区 */
.tgc{flex:1;display:flex;flex-direction:column;min-width:0}
.tgh{height:52px;flex:none;background:#fff;border-bottom:1px solid #E7E7E7;display:flex;align-items:center;gap:12px;padding:0 16px}
.tgh .st{font-size:12.5px;color:var(--tglink)}
.tgpin{height:40px;flex:none;background:#fff;border-bottom:1px solid #E7E7E7;display:flex;align-items:center;gap:10px;padding:0 14px}
.tgpin i{width:2.5px;height:22px;background:var(--tgb);border-radius:2px;flex:none}
.tgwall{flex:1;padding:10px 0;overflow:hidden;background:linear-gradient(165deg,#DAE6ED,#C8D8E2);background-image:radial-gradient(rgba(255,255,255,.4) 1.3px,transparent 0),linear-gradient(165deg,#DAE6ED,#C8D8E2);background-size:24px 24px,auto}
.tgdate{text-align:center;margin:6px 0 10px}
.tgdate span{background:rgba(74,89,101,.42);color:#fff;font-size:12px;padding:3px 11px;border-radius:99px}
.tgm{display:flex;gap:8px;padding:2.5px 16px;align-items:flex-end}
.tgm.me{flex-direction:row-reverse}
.tgbub{max-width:420px;background:#fff;border-radius:13px 13px 13px 4px;padding:7px 11px 6px;font-size:13.8px;line-height:1.45;box-shadow:0 1px 1.5px rgba(16,21,26,.12);position:relative}
.tgm.me .tgbub{background:var(--tgout);border-radius:13px 13px 4px 13px}
.tgwho{font-size:13px;font-weight:600;margin-bottom:2px}
.tgmeta{float:right;margin:8px -3px -2px 10px;font-size:11px;color:#8E9398;display:inline-flex;align-items:center;gap:3px}
.tgtk{color:var(--tgtick);letter-spacing:-3.5px;margin-right:2px;font-weight:600}
.tgquo{border-left:2.5px solid var(--tgb);padding:2px 8px 3px;margin:2px 0 5px;border-radius:2px;background:rgba(64,167,227,.06)}
.tgquo b{display:block;font-size:12.5px;color:var(--tglink);font-weight:600}
.tgquo span{font-size:12.5px;color:#6B7278;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:330px}
.tgfwd{font-size:12.5px;color:var(--tglink);font-weight:600;margin-bottom:3px}
.tgfwd em{font-style:normal;font-weight:400;color:#8E9398}
.tgreact{display:inline-flex;align-items:center;gap:5px;background:rgba(64,167,227,.14);color:var(--tglink);border-radius:99px;padding:2.5px 9px;font-size:12.5px;font-weight:600;margin-top:6px}
.tgimg{border-radius:10px;overflow:hidden;width:262px;height:158px;position:relative;display:block;margin:2px 0}
.tgimg .ot{position:absolute;right:6px;bottom:6px;background:rgba(0,0,0,.45);color:#fff;font-size:10.5px;padding:2px 7px;border-radius:99px}
.tgi{flex:none;background:#fff;border-top:1px solid #E7E7E7;display:flex;align-items:center;gap:13px;padding:11px 15px;color:#8E9398}
.tgi .fld{flex:1;font-size:14px;color:#9AA0A6}
/* 右侧资料栏 */
.tgp{width:296px;flex:none;border-left:1px solid #E7E7E7;background:#fff;display:flex;flex-direction:column;min-height:0}
.tgp-h{height:52px;flex:none;display:flex;align-items:center;padding:0 14px;gap:12px;border-bottom:1px solid #E7E7E7;font-weight:640;font-size:14.5px}
.tgtabs{display:flex;border-bottom:1px solid #E7E7E7}
.tgtabs span{flex:1;text-align:center;padding:11px 0;font-size:13px;color:#8E9398;position:relative}
.tgtabs .on{color:var(--tglink);font-weight:600}
.tgtabs .on::after{content:"";position:absolute;left:18%;right:18%;bottom:0;height:2.5px;background:var(--tglink);border-radius:2px}
.tggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:2px}
.tggrid svg{aspect-ratio:1;width:100%;display:block}
/* 抽屉与设置弹窗 */
.tgdim{position:absolute;inset:0;background:rgba(16,21,26,.35);z-index:5}
.tgdraw{position:absolute;left:0;top:0;bottom:0;width:294px;background:#fff;z-index:6;box-shadow:0 0 30px rgba(10,15,20,.35);display:flex;flex-direction:column}
.tgdr{display:flex;align-items:center;gap:15px;padding:11px 18px;font-size:14px;color:#2B2F33}
.tgdr svg{color:#8E9398}
.tgmodal{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center}
.tgbox{width:392px;max-height:560px;background:#fff;border-radius:13px;box-shadow:0 22px 60px -18px rgba(10,15,20,.5);overflow:hidden;display:flex;flex-direction:column}

/* v1.7 总控台 */
.hchip{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:9px;padding:8px 10px;font-size:12px}
.hchip b{font-weight:600}
.hchip .lat{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--ink3)}
.hdot{width:8px;height:8px;border-radius:99px;background:#33C15C;flex:none}
.hdot.w{background:#E8A23F}

/* v1.8 多账号 */
.tgacc{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:11px;padding:11px 0 5px;border-top:1px solid #E7E7E7;width:100%}
.tgacc .acc{position:relative;width:40px;height:40px;border-radius:50%}
.tgacc .acc.on::after{content:"";position:absolute;inset:-4px;border:2px solid var(--tgb);border-radius:50%}
.tgacc .abd{position:absolute;top:-5px;right:-7px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--tggreen);color:#fff;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;border:2px solid #F5F6F7}
.tgacc .acc.add{border:1.5px dashed #B7BEC4;display:flex;align-items:center;justify-content:center;color:#8E9398}
.tgar{display:flex;align-items:center;gap:12px;padding:7px 18px}
.tgar.on{background:#F0F7FC}
