@charset "utf-8";
.cj_ar_content p:has(img) {text-align:center;}
.cj_ar_content table {margin: 0.8125rem 0 0.875rem; line-height:1.5625rem; font-size:0.9375rem; opacity: 0.8; background: #fff; color: #000;width:100%; max-width:50rem; margin:0 auto; text-align: center;}
.cj_ar_content table td {padding:0.3125rem 0.625rem; opacity: 1; border:0.0625rem solid #7a7a7a;}
.cj_ar_content table p {margin:0; font-size:0.9375rem}
.cj_ar_content a {color:#e0ffdb; text-decoration: underline;}
.cj_ar_content ol {padding:0 0 0 2em;}
.cj_ar_content ol li {margin: 0 0 1.6875rem 0.3125rem; list-style:decimal; font-size:1.25rem; color:#e7e7e7;}
.cj_ar_content ol li::marker {color: #34ffbc; font-size: 1.5625rem; font-weight: 600; font-style: oblique;}/* marker 支持的属性：color、font系列、content */
.cj_ar_content h2 {font-size:1.5625rem; font-weight:bold;}
.cj_ar_content h3,.ah2 {font-size:1.4375rem;}
.cj_ar_content h4,.ah3 {font-size:1.3125rem;}
.cj_ar_content h6,.lywz {padding:0.3125rem 0.625rem; margin:0 0.3125rem; border:0.0625rem dashed #777777; font-size:0.9375rem; color:#aaaaaa; line-height:1.5625rem;}
.cj_ar_content h2,.cj_ar_content h3,.cj_ar_content h4,.cj_ar_content h5,.cj_ar_content h6 {margin:1.5625rem 0;}
.cj_ar_content .f26 {font-size:1.625rem; color:#ff513e;}
.cj_ar_content .f30 {font-size:1.875rem;}
.cj_ar_content .f56 {font-size:3.5rem; font-weight:bold;}
.dainfo,.s_div_x{border:1px solid #5f5858; padding:0.625rem 0.625rem 0; background-color:rgb(85 85 85 / 50%); margin-bottom:0.625rem;}
.s_div_bz{border:0.0625rem solid #ff5e52; border-top:0.3125rem solid #ff5e52;}
.s_div_x,.s_div_bz{border-radius:1.25rem;}
.cj_ar_content blockquote,.s_div_blo1{border-left:0.5rem solid #757575;}
.s_div_blo1{border-left:0.5rem solid #7dbdee;}
.cj_ar_content blockquote,.dainfo,.s_div_x,.s_div_bz,.s_div_ts,.s_div_ts_red,.s_div_blo1{margin:1.5625rem 0; padding:0.0625rem 1.5rem; font-size:1.125rem; color:#dbdbdb;}
.s_h3b,.s_h3b_r,.s_h3b_g,.cj_ar_content h2{padding:0.625rem 1.25rem;}
.s_h3b,.cj_ar_content h2,.s_h3b_r {border-left:0.5rem solid #1b8f8f;}
.cj_ar_content h2 {color:#cee3e0;}
.s_h3b_r {border-left:0.5rem solid #df5781;}
.s_h3b_g {border-left:0.5rem solid #adce91;}
.s_h3b_g,
.s_h3b_r,
.s_h3b,
.cj_ar_content h2,
.cj_ar_content h3,
.cj_ar_content h4,
.s_h3b_g,
.cj_ar_content h3.s_h3b_g,.cj_ar_content h2.s_h3b_g,
.cj_ar_content h3.s_h3b,.cj_ar_content h2.s_h3b,
.cj_ar_content h5
{background:rgb(87 87 87 / 95%);}
.cj_ar_content blockquote,.s_div_blo1{background:rgb(79 79 79 / 90%);}
.s_h3b_a,.s_h3b_b,.s_h3b_c,.s_h3b_d{padding:0.625rem 1.25rem; color:#fff;}
.s_h3cb,.s_h3cb_a,.s_h2b {text-align:center;}
.s_h3cb span,.s_h3cb_a span {padding:0.5rem 1.25rem; background:#7f60df; color:#fff; border-radius:0.625rem;}
/* s_h2b 色块必须是单个盒子：inline + box-decoration-break:clone 在长标题换行时会裂成两块互相叠压（2026-09-28 移动端实测），改 inline-block 后整段只有一个底、一个圆角、左右各一根端条 */
.s_h2b span {display:inline-block; color: #e7e7e7; background: #831e55; padding: 0.9375rem 1.875rem; border-radius: 0.3125rem; border-left: 0.3125rem solid; border-right: 0.3125rem solid;font-weight: bold;}
@media (max-width:640px){.s_h2b span {padding: 0.625rem 1rem;}}
.s_h3cb_a span{background:none; border:0.0625rem solid #72bf55; color:#72bf55;}
.cb_b span{border:0.0625rem solid #ff5e52; color:#ff5e52;}
.cb_c span{border:0.0625rem solid #3890ea; color:#3890ea;}
.cb_d span{border:0.0625rem solid #adadad; color:#c7c7c7;}
.s_div_ts, .s_div_ts_red{background:#434343;}
.s_div_ts {border:0.0625rem solid #676767; border-top:0.375rem solid #7f60df; margin:0 2.5rem 1.5625rem;}
.s_div_ts_red{border:0.0625rem solid #ff5a5a; border-top:0.375rem solid #ff2727; margin:0 2.5rem 1.5625rem; color:#ff7070; background: #31252b;}
.s_div_h6 {border:0.0625rem solid #5d5d5d; background:#454545; margin:0 0 1.5625rem 0; padding:0.9375rem 1.25rem 0.0625rem; font-size:1rem; color: #b4b4b4; border-radius: var(--b-r-x5);}
div.s_div_h6 p {font-size:1rem; margin: 0 0 0.875rem 0; line-height:1.875rem;}
.s_div_yin1,.s_div_yin2,.s_div_yin3,.s_div_yin4 {margin:0 7.5rem 1.5625rem;padding:1.5rem 1.875rem 1.0625rem 5rem;color:#555;background:#c2d9c4;border-radius: 0.625rem; position:relative;}
.s_div_yin1 span,.s_div_yin3::after {left:-3.4375rem;}
.s_div_yin1 span,.s_div_yin2 span,.s_div_yin3::after,.s_div_yin4::before { color:#8697be; font-family:-webkit-body; font-size:8.125rem; position:absolute; top:3.125rem;}
.s_div_yin2,.s_div_yin4{text-align:right;background:#ead3aa;padding:1.5rem 5rem 0.0625rem 1.25rem;}
.s_div_yin2 span,.s_div_yin4::before {right:-3.4375rem;}
.s_div_yin3::after{content: "“";}
.s_div_yin4::before{content: "”";}
.s_tt{max-width:35.625rem; margin:0.9375rem auto 1.6875rem; background:#f0f0f0; padding:0.625rem 1.25rem; text-align:justify; color:#333;overflow:hidden;}
/*overflow:hidden; 可以让浮动的子元素占据父元素的高度*/
.s_tt_l,.s_tt_r {clear:both; padding:0.6875rem 0;}
.s_tt_l span,.s_tt_r span{padding:0.5rem 1.125rem 0.5625rem; display:block; border-radius:0.5rem;}
.s_tt_l span{background:#fff; float:left; margin:0 1.875rem 0 0;}
.s_tt_r span{background:#a1eb70; float:right; margin:0 0 0 1.875rem;}
p.s_tt_l,p.s_tt_r {font-size:1.375rem; line-height:2.0625rem;margin:0;}
.s_tt_date{clear:both; text-align:center; position:relative; top:1.0625rem;}
p.s_tt_date{margin:1.25rem 0;font-size:0.8125rem; color:#888; line-height:1.5625rem;}
p.s_tt_date span {display:block; margin:0 auto; width:80%; font-size:0.875rem;}
p.s_tt_date i{color:#009;}
.s_tt > p:first-child {margin-top: 0;}
.s_tt_l::after,
.s_tt_r::after {content: ""; display: table; clear: both;}
.b_b {background:#171917;}
.b_b .s_tt_l span{background:#3a3a3a; color:#e8e8e3;}
/* b_b＝微信深色模式：整块聊天区也是深底（2026-10-04 拟真重做） */
.s_tt.b_b{background:#1f1f1f;color:#e8e8e3;}
.b_b p.s_tt_date{color:#7d7d7d;}
.b_b p.s_tt_date i{color:#d3d3d3;}
.b_b2 {background:linear-gradient(to right, #284f2a, #10654d);}
/*21-1120zeng 小三角*/
.s_tt_r,.s_tt_l {position:relative;}
.s_tt i {width:0; height:0; border: 0.5rem solid transparent; position:absolute; text-indent:-624.9375rem; overflow:hidden;}
.s_tt_r span i {border-left:0.625rem solid #a1eb70; right:-1.0625rem; top:1.75rem;}
.s_tt_l span i{border-right:0.625rem solid #fff; left:-1.0625rem; top:1.75rem;}
.b_b .s_tt_r span i{border-left:0.625rem solid #2db462;}
.b_b .s_tt_l span i{border-right:0.625rem solid #3a3a3a;}
.t_t .s_tt_r span i{border-left:0.625rem solid #d75548;}
p.s_tt_date.detop {margin: 0 0 1.25rem 0; top: 0.3125rem;}
/*21-1206zeng*/
.s_s {background:#fff;}
.s_s .s_tt_l span{background:#f5f5f5; color:#333; border-radius:1.875rem; border-top-left-radius:0;}
.s_s .s_tt_r span{background:#26d4d2; color:#fff; border-radius:1.875rem; border-top-right-radius:0;}
.t_t,.tts {background:#d0c6c5; background: linear-gradient(to right,#d0c6c5,#f7e4e0);}
.t_t .s_tt_l span,.tts .s_tt_l span,.qqs .s_tt_l span{background:#fff; color:#333;}
.t_t p.s_tt_date i{color:#d3d3d3;}
.tts2 {background: #503663;}
.tts2 .s_tt_l span{background:#fdb0b0; color:#333;}
.qqs{background:#e9ecf3; border:none;}
.qqs .s_tt_r span{background:#20bbfd; color:#fff;}
.b1 {background:#38a7c2;}
.b1 .s_tt_date {color:#e5e5e5;}
.s_ard{border-bottom:0.3125rem solid #423b4d; margin-bottom:1.5625rem; background:#181818;border-radius:1.25rem;padding: 0 0 1rem 0;}
div.s_ard h3{border:none; padding:0.5rem 0.9375rem; color:#fff;border-radius:0.5rem; background:#6b6b6b;background:linear-gradient(to right, #987bb1, #5236af);}
div.s_ard p {padding:0 1.25rem;}
/* s_ard 设计上是「h3 渐变标题栏 + 下方文字」，容器 padding-top 为 0；不带 h3 直接当导语块用时首段会贴到圆角顶边（2026-09-28 实测 gapTop=0.0125rem），补首段上边距，带 h3 的老用法不受影响 */
.s_ard > p:first-child {padding-top:1rem;}
/*peise*/
div.s_ardps2 h3 {background:#333;background:linear-gradient(to left, #cd9d9d, #d96b6b);}
div.s_ardps3 h3 {background:#1D976C;background: linear-gradient(to right,#1D976C,#93F9B9);}
.s_ddtbox {border:0.1875rem solid #999;margin-bottom:1.5625rem; position:relative; border-radius:1.25rem; padding:0.9375rem 0;}
.s_ddt {height:6.25rem; margin-bottom:1.5625rem;}
.ddt_l {float:left; padding:0 0 0 2.5rem;}
.ddt_c {float:left; padding:1.5625rem 0 0 0.9375rem;}
.ddt_c b {font-size:1.25rem; margin:0 0.5rem 0 0; color:#070;}
div.ddt_c p {font-size:0.875rem; margin:0; line-height:1.875rem; color:#999;}
.ddt_ct {clear:both; position:relative; top:-1.25rem; padding:0 1.5625rem 0;}
div.ddt_ct p {margin:0;}
.cj_ar_content .s_ddx i,.s_ddtbox i {
position:absolute; top:-3.8125rem; left:30%; width:0; height:0; border:20px solid transparent; border-bottom:2.5rem solid #999;
text-indent:-624.9375rem; overflow:hidden;}
.cj_ar_content article,.s_ddx {background:#453757; margin-bottom:1.5625rem; padding:0.0625rem 1.875rem; border-radius:1.25rem;}
.cj_ar_content .s_ddx{position:relative; top:1.25rem; margin-bottom:2.8125rem; background:none; border:0.1875rem solid #999;}
.cj_ar_content article .ar_zan1 span{float:right; color:#b5b5b5;}
.cj_ar_content article .ar_zan1 i{background:#600; color:#fff; padding:0.625rem 0.9375rem; margin-right:0.3125rem;border-radius:1.5625rem;}
.cj_ar_content p.ar_zan1{line-height:1.25rem; margin:0.9375rem 0 1.5625rem; font-size:0.875rem; color:#b5b5b5; font-weight:bold;}
.cj_ar_content h3 {padding:0.375rem 0.9375rem; border-left:0.5rem solid #b1b1b1; border-radius:0.375rem;}
.cj_ar_content h4 {border-radius: 0.25rem;border:0.0625rem solid #737373;}
.cj_ar_content h4, .s_h3b_g,article p,.s_ard p,.s_h3b,.s_h3b_r {color:#c5d9ce; padding: 0.25rem 0.625rem;}
.s_h3b_g,.s_h3b,.s_h3b_r{border-left-width:0.25rem;border-radius: 0.3125rem;}
.cj_ar_content h3.s_h3b_r,.cj_ar_content h2.s_h3b_r {border-left:0.5rem solid #df5781;}
.cj_ar_content h3.s_h3b_g,.cj_ar_content h2.s_h3b_g {border-left:0.5rem solid #adce91;}
.cj_ar_content h3.s_h3b,.cj_ar_content h2.s_h3b {border-left:0.5rem solid #1f9d00;}
.cj_ar_content h5 {border:0.0625rem solid #747474; margin:0 0 1.5625rem 0; padding:0.1875rem 1.25rem; color:#b4b4b4;line-height: 2.1875rem; }
/*直接显示html标签（输出为字符串）*/
xmp {background:#000; color:#fbffd9; padding:0.625rem 0.9375rem; font-size:1rem; line-height:1.125rem; display:block;white-space: pre-wrap;}
/* 动漫五维指标进度条（甜度/车速/虐度/剧情/颜值） */
.qzbars {max-width:38.75rem; margin:0.875rem auto 1.5rem; padding:1rem 1.25rem 0.875rem; border-radius:1rem; background:linear-gradient(145deg,#241e30,#181422); border:0.0625rem solid rgba(255,255,255,.09); box-shadow:0 0.5rem 1.875rem rgba(0,0,0,.45);}
.qzbar-title {display:block; text-align:center; font-size:1.0625rem; font-weight:700; color:#ffd9a0; margin-bottom:0.625rem; letter-spacing:.18em;}
.qzbar {display:flex; align-items:center; margin:0.59375rem 0; gap:0.5625rem;}
.qzbar-label {width:2.8em; font-size:0.9375rem; font-weight:600; color:#d9d2e8; flex-shrink:0; text-align:right;}
.qzbar-track {flex:1; height:0.65625rem; border-radius:0.625rem; background:rgba(255,255,255,.09); box-shadow:inset 0 0.0625rem 0.1875rem rgba(0,0,0,.55); overflow:hidden;}
.qzbar-fill {display:block; height:100%; border-radius:0.625rem; box-shadow:0 0 0.625rem rgba(255,255,255,.25); animation:qzfill 1.1s cubic-bezier(.25,.8,.3,1);}
.qzbar-val {width:2.2em; font-size:0.875rem; font-weight:800; color:#fff; text-align:right; flex-shrink:0;}
.qf-tian {background:linear-gradient(90deg,#ff7eb3,#ff4d6d);}
.qf-che {background:linear-gradient(90deg,#ffa751,#ff6348);}
.qf-nue {background:linear-gradient(90deg,#a18cd1,#7f53ac);}
.qf-ju {background:linear-gradient(90deg,#43cea2,#185a9d);}
.qf-yan {background:linear-gradient(90deg,#f6d365,#fda085);}
.qzbar-note {display:block; text-align:center; font-size:0.78125rem; color:#9b94ad; margin-top:0.375rem;}
@keyframes qzfill {from {width:0;}}
/* 小溢可爱风签名块（新 · 定制文用）绿/黄系：自包含样式，不依赖老暗色签名块 */
.s_yi_sign.s_yi_sign_cute{position:relative; overflow:hidden; display:flex; align-items:flex-start; gap:1rem; max-width:47.5rem; margin:1.875rem auto 1rem; padding:1.25rem 1.375rem 1.125rem; border-radius:1.25rem; background:linear-gradient(145deg,#eaffed,#fff7d6); border:0.0625rem solid rgba(120,190,120,.4); box-shadow:0 0.5rem 1.5rem rgba(150,210,150,.3);}
.s_yi_sign.s_yi_sign_cute::before{content:""; position:absolute; top:-1.875rem; right:-1.875rem; width:6.25rem; height:6.25rem; border-radius:50%; background:radial-gradient(circle,rgba(255,214,102,.55),transparent 70%);}
.s_yi_sign.s_yi_sign_cute::after{content:"✦"; position:absolute; bottom:0.4375rem; right:0.8125rem; font-size:0.875rem; color:rgba(120,190,120,.6);}
.s_yi_sign.s_yi_sign_cute .s_yi_sign_av{flex-shrink:0; width:3.75rem; height:3.75rem; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.75rem; font-weight:900; color:#181422; overflow:hidden; padding:0.175rem; background:linear-gradient(135deg,#ffd966,#93f9b9); box-shadow:0 0.25rem 0.875rem rgba(147,249,185,.5);}
.s_yi_sign.s_yi_sign_cute .s_yi_sign_av img{width:100%; height:100%; object-fit:cover; display:block; border-radius:50%; border:0.125rem solid #fff;}
.s_yi_sign.s_yi_sign_cute .s_yi_sign_txt{flex:1; padding-top:0.3125rem;}
.s_yi_sign.s_yi_sign_cute .s_yi_sign_txt p{margin:0 0 0.625rem; font-size:1.25rem; line-height:2rem; color:#4a544a;}
.s_yi_sign.s_yi_sign_cute .s_yi_sign_txt p:first-of-type{position:relative; padding-left:1.0625rem;}
.s_yi_sign.s_yi_sign_cute .s_yi_sign_txt p:first-of-type::before{content:"\201C"; position:absolute; left:0.0625rem; top:-0.1875rem; font-size:1.75rem; color:rgba(147,249,185,.9); font-family:Georgia,serif;}
.s_yi_sign.s_yi_sign_cute .s_yi_sign_txt .s_yi_sign_by{margin:0.4375rem 0 0; font-size:0.875rem; color:#7a866a; text-align:right; letter-spacing:.12em; font-weight:600;}
/* ===== 2026-09-12 新增（登记于 249 样式库 / style-anchors.md §4.6）===== */
.s_tag{margin:0.375rem 0 1.375rem;text-align:center;font-size:0.8rem !important;line-height:1.625rem;}
.s_tag span{display:inline-block;margin:0.1875rem 0.25rem;padding:0.125rem 0.8125rem;border-radius:1.25rem;background:#453757;border:0.0625rem solid #6b5a86;color:#dcd0ef;}
.s_bar{display:block;height:0.625rem;border-radius:0.625rem;background:rgba(127,96,223,.18);margin:0.3125rem 0 0.75rem;}
.s_bar i{display:block;height:100%;border-radius:0.625rem;background:linear-gradient(90deg,#987bb1,#5236af);}
.s_bar.r i{background:linear-gradient(90deg,#ffa751,#ff6348);}
@media (max-width: 768px) {
.s_div_ts,.s_div_ts_red,.s_div_yin1,.s_div_yin2,.s_div_yin3,.s_div_yin4 {margin:0 0 1.5625rem;}
.s_div_yin1 span,.s_div_yin3::after {left:0.625rem;}
.s_div_yin2 span,.s_div_yin4::before {right:0.625rem;}
.s_h3cb span,.s_h3cb_a span {display:block;}
}
/* ============================================================
2026-09 样式库升级新增分区 + 关键帧
配套脚本 /static/frontend/ar_interact.js
============================================================ */
/* ===== A 全局修正（b 加粗 / code / 表格无边框 / 拼图直角 / 列表去双号） ===== */
.cj_ar_content b{font-weight:700; color:var(--bink,inherit)}
.cj_ar_content em{font-style:normal}
.cj_ar_content code{font-family:ui-monospace,Consolas,monospace; font-size:.82em; background:#12101a; border:0.0625rem solid #332e42; border-radius:0.3125rem; padding:.1em .55em; color:#8fe0b8}
.cj_ar_content u{text-decoration-color:var(--pk)}
.cj_ar_content ol.m-steps li{list-style:none}
/* ===== B 变量与调色板 ===== */
:root{--ln:#3a3543; --bg1:#241e30; --bg2:#1a1622; --sf1:#2b2440; --sf2:#352b4d; --line:#4d4270; --lav:#a78bfa; --sak:#f9a8d4; --peach:#fdba74; --mint:#6ee7b7; --sky:#7dd3fc; --cream:#fef3c7; --ink:#dedede; --dim:#a49dba; --gold:#ffd9a0; --vio:#987bb1; --vio2:#5236af; --pk:#ff5c9d; --or:#ff9a4d; --cy:#3ef7c6; --gr:#4ade80; --bl:#5aa9ff; --rd:#ff6b6b; --r:0.875rem; --gap:0.375rem}
/* ===== C 提示框 m-note（深色 6 色 / 浅色 4 色，变量继承） ===== */
.m-note.light,.m-note.lemon,.m-note.mint,.m-note.peach,.m-card.w,.m-quote.paper,table.m-table.light,.m-stat .w{--bink:#241e33; --tx:#2b2440; --cc:#5b2ea8; --cbg:#f1edfb; --cbd:#d9d0ef}
.m-note p{color:#eae6f2; margin:0; font-size:1.0625rem; line-height:1.8125rem}
.m-note.light code,.m-note.lemon code,.m-note.mint code,.m-note.peach code,table.m-table.light code,.m-card.w code,.m-quote.paper code{color:var(--cc); background:var(--cbg); border-color:var(--cbd)}
.m-note{display:grid; grid-template-columns:auto 1fr; gap:0.25rem 0.875rem; margin:1.25rem 0; padding:1.1875rem 1.3125rem; border-radius:0.75rem; background:linear-gradient(90deg,rgba(125,211,252,.16),rgba(43,36,64,.92)); border-left:0.5625rem solid var(--sky); font-size:1.0625rem; line-height:1.8125rem; color:#eee8f8}
.m-note>i{grid-column:1;grid-row:1}
.m-note p{grid-column:2}
.m-note>i{flex:0 0 auto; font-style:normal; font-size:1.25rem; line-height:1.8125rem; color:var(--bl)}
.m-note.warn{background:linear-gradient(90deg,rgba(255,138,138,.22),rgba(43,36,64,.92)); border-left-color:var(--rd)}
.m-note.warn>i{color:var(--rd)}
.m-note.ok{background:linear-gradient(90deg,rgba(110,231,183,.2),rgba(26,22,34,.9)); border-left-color:var(--gr)}
.m-note.ok>i{color:var(--gr)}
.m-note.gold{background:linear-gradient(90deg,rgba(254,243,199,.2),rgba(26,22,34,.9)); border-left-color:var(--gold)}
.m-note.gold>i{color:var(--gold)}
.m-note.pink{background:linear-gradient(90deg,rgba(249,168,212,.22),rgba(26,22,34,.9)); border-left-color:var(--pk)}
.m-note.pink>i{color:var(--pk)}
.m-note.cyan{background:linear-gradient(90deg,rgba(110,231,183,.2),rgba(26,22,34,.9)); border-left-color:var(--cy)}
.m-note.cyan>i{color:var(--cy)}
.m-note.light{background:#fcfbff; border-left-color:#6b4fd0}
.m-note.light p{color:#2b2440}
.m-note.light>i{color:#6b4fd0}
.m-note.lemon{background:#fffdf0; border-left-color:#e8a317}
.m-note.lemon p{color:#4a3c14}
.m-note.lemon>i{color:#c8860d}
.m-note.mint{background:#f4fdf8; border-left-color:#16a05f}
.m-note.mint p{color:#14402a}
.m-note.mint>i{color:#16a05f}
.m-note.peach{background:#fffaf7; border-left-color:#f26430}
.m-note.peach p{color:#5a2a17}
.m-note.peach>i{color:#f26430}
/* ===== D 卡片与徽章 ===== */
.m-grid{display:grid; gap:1rem; margin:1.25rem 0; grid-template-columns:repeat(auto-fit,minmax(13.125rem,1fr))}
.m-card{padding:1.25rem 1.125rem; border-radius:var(--r); background:linear-gradient(150deg,var(--bg1),var(--bg2)); border:0.0625rem solid #362f44; transition:transform .25s,border-color .25s,box-shadow .25s}
.m-card:hover{transform:translateY(-0.25rem); border-color:var(--vio); box-shadow:0 0.75rem 1.875rem rgba(0,0,0,.45)}
.m-card h4{margin:0 0 0.5rem; font-size:1.1875rem; color:#fff; border:0; padding:0; background:none}
.m-card p{margin:0; font-size:0.96875rem; line-height:1.625rem; color:var(--dim)}
.m-card .m-num{font-size:0.9375rem; color:var(--gold); letter-spacing:.2em}
.m-card.w{background:#fdfcff; border-color:#e8e4f6}
.m-card.w h4{color:#241e33}
.m-card.w p{color:#6b6480}
.m-card.edge{border-left:0.375rem solid var(--pk)}
.m-chip{display:inline-flex; align-items:center; gap:0.375rem; padding:0.25rem 0.75rem; border-radius:61.875rem; font-size:0.875rem; line-height:1.375rem; white-space:nowrap; background:#453757; border:0.0625rem solid #6b5a86; color:#e2dcef}
.m-chip.w{background:#fff; border-color:#dcd6ee; color:#4a3f6b}
.m-chip.g{background:linear-gradient(90deg,#7f5ac0,#e0568f); border:0; color:#fff}
.m-tag{display:flex; flex-wrap:wrap; gap:0.5rem; justify-content:center; margin:0.875rem 0 1.25rem}
/* ===== E 名次与眉题 ===== */
.m-kicker{display:block; font-size:0.8125rem; letter-spacing:.28em; color:var(--gold); margin:0 0 0.375rem}
.m-rank{display:inline-block; padding:0 0.625rem; border-radius:0.3125rem; background:linear-gradient(120deg,#78cd87,#a0a558); color:#1a1620; font-size:0.875rem; letter-spacing:.12em; font-weight:800}
.m-rank.n{background:#7f370c; color:#d8d2e6; border:0.0625rem solid #4a4356}
.m-rankline{display:flex; align-items:center; gap:0.75rem; margin:2.125rem 0 1rem; padding:0.5625rem 0.875rem; border-radius:0.625rem; background:linear-gradient(90deg,rgba(152,123,177,.22),transparent); border-left:0.3125rem solid var(--vio)}
.m-rankline .m-rank{flex:0 0 auto}
.m-rankline .nm{font-size:1.3125rem; color:#fff; font-weight:700}
.m-rankline .yr{font-size:0.9375rem; color:var(--dim)}
.m-rankline .sc{margin-left:auto; font-size:0.875rem; color:var(--gold)}
.m-badge{display:inline-flex; align-items:center; justify-content:center; width:2.625rem; height:2.625rem; border-radius:50%; background:linear-gradient(140deg,#e8c37a,#a8701f); color:#1a1620; font-size:1rem; font-weight:800; margin-right:0.5625rem; vertical-align:middle; box-shadow:0 0.1875rem 0.625rem rgba(232,195,122,.3)}
.m-badge.n{background:linear-gradient(140deg,#5b4a7a,#332a48); color:#dcd0ef; box-shadow:none}
.m-badge.sq{border-radius:0.5625rem; width:2.375rem; height:2.375rem; font-size:0.9375rem; background:linear-gradient(140deg,var(--pk),var(--vio2)); color:#fff}
/* ===== F 引用 m-quote 五式 ===== */
.m-quote{margin:1.375rem 0; padding:1.5rem 1.5rem 1.25rem; border-radius:0.875rem; background:linear-gradient(150deg,#332a4a,#241f35); border:0.0625rem solid rgba(249,168,212,.26); position:relative}
.m-quote p{margin:0; font-size:1.375rem; color:var(--gold); font-weight:700}
.m-quote p:before{content:"“"; color:rgba(255,217,160,.45); font-size:1.875rem; line-height:0; vertical-align:-0.25rem; margin-right:0.3125rem}
.m-quote cite{display:block; margin-top:0.625rem; font-style:normal; font-size:0.875rem; color:var(--dim); text-align:right; letter-spacing:.08em}
.m-quote.paper{background:#fdfcf7; border-left:0.5625rem solid var(--vio2); border-radius:0.25rem; padding:1.375rem 1.5rem}
.m-quote.paper p{color:#2f2a3d; font-weight:500; font-size:1.15625rem}
.m-quote.paper p:before{color:#c9c2e0}
.m-quote.star{background:linear-gradient(140deg,#33294d,#241f35); border:0.0625rem solid var(--line); padding:1.0625rem 1.25rem 0.6875rem}
.m-quote.star .m-hd2{display:flex; align-items:center; gap:0.5625rem; margin-bottom:0.4375rem}
.m-quote.star .m-hd2 img{width:3.25rem; height:3.25rem; border-radius:50%; object-fit:cover; border:0; margin:0; box-shadow:0 0 0 0.15625rem rgba(152,123,177,.35)}
.m-quote.star .m-who{flex:1; min-width:0}
.m-quote.star .m-who b{display:block; font-size:1.0625rem; color:#fff}
.m-quote.star .m-who span{display:block; font-size:0.78125rem; color:var(--dim); margin-top:0.0625rem; line-height:1.1875rem}
.m-quote.star .m-rate{display:inline-flex; align-items:center; color:var(--or); font-size:0.9375rem; letter-spacing:.14em; white-space:nowrap}
.m-quote.star p{color:#f2ecf9; font-size:1.0625rem; line-height:1.6875rem; font-weight:400; text-indent:0}
.m-quote.star p:before{content:""}
.m-quote.star .m-act{display:flex; gap:0.9375rem; margin-top:0.4375rem; padding-top:0.4375rem; border-top:0.0625rem solid rgba(167,139,250,.18); font-size:0.78125rem; color:#8f86a8}
.m-quote.star .m-act span:first-child{color:var(--gold)}
.m-quote.line{background:none; border:0; padding:0; margin:1.25rem 0}
.m-quote.line p{text-indent:0; font-size:1.0625rem; color:#eae4f2; font-weight:400; padding:0.25rem 0 0.25rem 0.9375rem; border-left:0.1875rem solid var(--lav); margin:0 0 0.4375rem; line-height:1.6875rem}
.m-quote.line p:before{content:""}
.m-quote.line p b{color:var(--pk); margin-right:0.5625rem}
.m-quote.line p.g{border-left-color:var(--cy)}
.m-quote.line p.g b{color:var(--cy)}
.m-quote.line p.o{border-left-color:var(--or)}
.m-quote.line p.o b{color:var(--or)}
.m-quote.line p.r{border-left-color:var(--pk)}
.m-quote.line p.r b{color:var(--pk)}
.m-quote.line p.w{border-left-color:#e8e4f5}
.m-quote.line p.w b{color:#e8e4f5}
.m-quote.big{background:none; border:0; border-top:0.0625rem solid var(--ln); border-bottom:0.0625rem solid var(--ln); border-radius:0; padding:2.25rem 0.625rem; text-align:center}
.m-quote.big p{font-size:2rem; line-height:2.75rem; font-weight:800; letter-spacing:.02em; background:linear-gradient(90deg,#3ef7c6,#ffd9a0 45%,#ff5c9d); -webkit-background-clip:text; background-clip:text; color:transparent; text-indent:0}
.m-quote.big p:before{content:"“"; font-size:2rem; color:rgba(255,217,160,.6); -webkit-text-fill-color:rgba(255,217,160,.5)}
.m-quote.big cite{text-align:center; color:#8d84a3}
/* ===== G 聊天：尖尖补色 / 系统提示 / 图片消息 / 引用回复 / 头像 ===== */
.m-chatgrid{display:grid; gap:0.875rem; grid-template-columns:repeat(auto-fit,minmax(17.5rem,1fr))}
.m-chatgrid .cap{font-size:0.8125rem; color:var(--cy); margin:0 0 0.375rem}
.s_tt_l span i,.s_tt_r span i{top:1rem}
.s_s .s_tt_l span i,.s_s .s_tt_r span i{display:none}
.s_tt.s_s.qqs .s_tt_l span{background:#fff}
.s_tt.s_s.qqs .s_tt_r span{background:#20bbfd}
.qqs .s_tt_l span i{border-right-color:#fff}
.qqs .s_tt_r span i{border-left-color:#20bbfd}
.tts .s_tt_l span i{border-right-color:#fff}
.tts .s_tt_r span i{border-left-color:#d75548}
.tts2 .s_tt_l span i{border-right-color:#fdb0b0}
.tts2 .s_tt_r span i{border-left-color:#379795}
.b_b2 .s_tt_l span i{border-right-color:#fff}
.b_b2 .s_tt_r span i{border-left-color:#a1eb70}
.b1 .s_tt_l span i{border-right-color:#fff}
.b1 .s_tt_r span i{border-left-color:#a1eb70}
.s_tt.coral{background:linear-gradient(135deg,#ffe3ec,#fff7f0)}
.coral .s_tt_l span{background:#fff; color:#3a2b33; border:0.0625rem solid #ffd3e0}
.coral .s_tt_r span{background:linear-gradient(90deg,#ff7fa8,#ff5c9d); color:#fff}
.coral .s_tt_l span i{border-right-color:#fff}
.coral .s_tt_r span i{border-left-color:#ff5c9d}
.coral p.s_tt_date span{color:#c2748f}
.s_tt.ocean{background:linear-gradient(135deg,#0f2340,#123a55)}
.ocean .s_tt_l span{background:#1c3f63; color:#dbeaff}
.ocean .s_tt_r span{background:linear-gradient(90deg,#3ef7c6,#26d4d2); color:#04232a}
.ocean .s_tt_l span i{border-right-color:#1c3f63}
.ocean .s_tt_r span i{border-left-color:#26d4d2}
.ocean p.s_tt_date span{color:#7fb0d8}
.s_tt.sand{background:#f4ecd9}
.sand .s_tt_l span{background:#fffcf3; color:#4a3c22; border:0.0625rem solid #e2d5b4}
.sand .s_tt_r span{background:#8c6239; color:#fff8ea}
.sand .s_tt_l span i{border-right-color:#fffcf3}
.sand .s_tt_r span i{border-left-color:#8c6239}
.s_tt .s_tt_l span,.s_tt .s_tt_r span{position:relative}
.s_tt.av p.s_tt_l,.s_tt.av p.s_tt_r{margin:0.875rem 0}
.s_tt.av .s_tt_l{padding-left:4.75rem}
.s_tt.av .s_tt_r{padding-right:4.75rem}
.s_tt.av .s_tt_l>span:before,.s_tt.av .s_tt_r>span:before{content:""; position:absolute; top:-0.0625rem; width:3.125rem; height:3.125rem; border-radius:50%; background-size:cover; background-position:center; border:0.1rem solid rgba(255,255,255,.8)}
.s_tt.av .s_tt_l>span:before{left:-4.375rem; box-shadow:0 0.125rem 0.4375rem rgba(0,0,0,.35); background-image:url(/uploads/ar-img/avf1.webp)}
.s_tt.av .s_tt_r>span:before{right:-4.375rem; box-shadow:0 0.125rem 0.4375rem rgba(0,0,0,.35); background-image:url(/uploads/ar-img/avm1.webp)}
.s_tt.av [data-av="1"]>span:before{background-image:url(/uploads/ar-img/avf1.webp)}
.s_tt.av [data-av="2"]>span:before{background-image:url(/uploads/ar-img/avm1.webp)}
.s_tt.av [data-av="3"]>span:before{background-image:url(/uploads/ar-img/avf2.webp)}
.s_tt.av [data-av="4"]>span:before{background-image:url(/uploads/ar-img/avm2.webp)}
/* 对谈体专用头像：两位作者各用各的（小溢在左、小妖姐在右）。
没有这两条时，data-av 落不到映射表里，会退回默认头像——右边显示成男性头像就是这么来的。 */
.s_tt.av [data-av="xiaoyi"]>span:before{background-image:url(/uploads/ar-img/xiaoyi_avatar.webp)}
.s_tt.av [data-av="xiaoao"]>span:before{background-image:url(/uploads/ar-img/xiaoao_avatar.webp)}
/* 简写别名：f1~f5＝女性头像（avf1~5）、m1~m5＝男性头像（avm1~5）。
老稿里大量 data-av="f2"/"m3" 这种写法，之前没有映射会静默退回默认头像（左边一律女、右边一律男）。 */
.s_tt.av [data-av="f1"]>span:before{background-image:url(/uploads/ar-img/avf1.webp)}
.s_tt.av [data-av="f2"]>span:before{background-image:url(/uploads/ar-img/avf2.webp)}
.s_tt.av [data-av="f3"]>span:before{background-image:url(/uploads/ar-img/avf3.webp)}
.s_tt.av [data-av="f4"]>span:before{background-image:url(/uploads/ar-img/avf4.webp)}
.s_tt.av [data-av="f5"]>span:before{background-image:url(/uploads/ar-img/avf5.webp)}
.s_tt.av [data-av="m1"]>span:before{background-image:url(/uploads/ar-img/avm1.webp)}
.s_tt.av [data-av="m2"]>span:before{background-image:url(/uploads/ar-img/avm2.webp)}
.s_tt.av [data-av="m3"]>span:before{background-image:url(/uploads/ar-img/avm3.webp)}
.s_tt.av [data-av="m4"]>span:before{background-image:url(/uploads/ar-img/avm4.webp)}
.s_tt.av [data-av="m5"]>span:before{background-image:url(/uploads/ar-img/avm5.webp)}
/* 隐晦头像（非正脸：背影/侧影/遮脸/手部/空镜）——纯聊天案例文用，一篇锁一张不换；2026-09-29 去掉粉/蓝彩色外环（用户："这个太大了，可以不要这个外边框，就靠头像就能区分男女"），只留细白边＋轻投影 */
.s_tt.av [data-av="chf1"]>span:before,.s_tt.av [data-av="chf2"]>span:before,.s_tt.av [data-av="chf3"]>span:before,.s_tt.av [data-av="chf4"]>span:before,.s_tt.av [data-av="chf5"]>span:before{background-image:url(/uploads/ar-img/chf1.webp)}
.s_tt.av [data-av="chf2"]>span:before{background-image:url(/uploads/ar-img/chf2.webp)}
.s_tt.av [data-av="chf3"]>span:before{background-image:url(/uploads/ar-img/chf3.webp)}
.s_tt.av [data-av="chf4"]>span:before{background-image:url(/uploads/ar-img/chf4.webp)}
.s_tt.av [data-av="chf5"]>span:before{background-image:url(/uploads/ar-img/chf5.webp)}
.s_tt.av [data-av="chm1"]>span:before,.s_tt.av [data-av="chm2"]>span:before,.s_tt.av [data-av="chm3"]>span:before,.s_tt.av [data-av="chm4"]>span:before,.s_tt.av [data-av="chm5"]>span:before{background-image:url(/uploads/ar-img/chm1.webp)}
.s_tt.av [data-av="chm2"]>span:before{background-image:url(/uploads/ar-img/chm2.webp)}
.s_tt.av [data-av="chm3"]>span:before{background-image:url(/uploads/ar-img/chm3.webp)}
.s_tt.av [data-av="chm4"]>span:before{background-image:url(/uploads/ar-img/chm4.webp)}
.s_tt.av [data-av="chm5"]>span:before{background-image:url(/uploads/ar-img/chm5.webp)}
/* 2026-10-20 新增 10 张（各 200×200 webp，已裁掉生成水印）：chf6~10 / chm6~10。
一篇情感稿锁一张头像（同一篇内不换），跨篇必须换，避免"每篇都长一个样"。 */
.s_tt.av [data-av="chf6"]>span:before{background-image:url(/uploads/ar-img/chf6.webp)}
.s_tt.av [data-av="chf7"]>span:before{background-image:url(/uploads/ar-img/chf7.webp)}
.s_tt.av [data-av="chf8"]>span:before{background-image:url(/uploads/ar-img/chf8.webp)}
.s_tt.av [data-av="chf9"]>span:before{background-image:url(/uploads/ar-img/chf9.webp)}
.s_tt.av [data-av="chf10"]>span:before{background-image:url(/uploads/ar-img/chf10.webp)}
.s_tt.av [data-av="chm6"]>span:before{background-image:url(/uploads/ar-img/chm6.webp)}
.s_tt.av [data-av="chm7"]>span:before{background-image:url(/uploads/ar-img/chm7.webp)}
.s_tt.av [data-av="chm8"]>span:before{background-image:url(/uploads/ar-img/chm8.webp)}
.s_tt.av [data-av="chm9"]>span:before{background-image:url(/uploads/ar-img/chm9.webp)}
.s_tt.av [data-av="chm10"]>span:before{background-image:url(/uploads/ar-img/chm10.webp)}
/* ===== 微信壳 + 消息组件（2026-10-04 重做：融入原有 .s_tt 体系，可自由组合）=====
大白话：.s_tt_wx 只是个「手机壳」，中间放的还是普通 .s_tt 聊天块（13 种皮肤、头像 av 全部照用）；
顶部状态栏 .s_tt_phone、底部输入栏 .s_tt_input 想加就加、不加也照常显示。
语音/引用/转账/红包/定位/拍一拍/拒收这些组件，直接写在普通 .s_tt 的气泡里也能用。 */
/* —— 壳：宽度/外边距与普通 .s_tt 完全一致（35.625rem），只负责圆角裁切、把三段粘成一张屏 —— */
.s_tt_wx{max-width:35.625rem;margin:0.9375rem auto 1.6875rem;border-radius:1rem;overflow:hidden}
.s_tt_wx>.s_tt{max-width:none;margin:0;border-radius:0}
/* —— 顶部状态栏：左运营商 / 中网络 / 右时间电量；电量格纯 CSS 画，低电红、充电绿 —— */
.s_tt_wx .s_tt_phone{display:flex;align-items:center;justify-content:space-between;padding:0.75rem 1.125rem 0.375rem;background:#f0f0f0;font-size:0.84375rem;line-height:1.4;font-weight:600;color:#1a1a1a}
.s_tt_wx .s_tt_phone>b{font-weight:600}
.s_tt_wx .s_tt_ph_bat{position:relative;display:inline-block;padding-right:1.6875rem;font-weight:600}
.s_tt_wx .s_tt_ph_bat:before{content:"";position:absolute;right:0.21875rem;top:50%;transform:translateY(-50%);width:1.3125rem;height:0.6875rem;box-sizing:border-box;border:0.0875rem solid currentColor;border-radius:0.175rem;background:linear-gradient(to right,currentColor 30%,transparent 30%)}
.s_tt_wx .s_tt_ph_bat:after{content:"";position:absolute;right:0;top:50%;transform:translateY(-50%);width:0.1125rem;height:0.34375rem;border-radius:0 0.09375rem 0.09375rem 0;background:currentColor}
.s_tt_wx .s_tt_ph_low{color:#fa5151}
.s_tt_wx .s_tt_ph_low:before{background:linear-gradient(to right,currentColor 12%,transparent 12%)}
.s_tt_wx .s_tt_ph_chg{color:#07c160}
.s_tt_wx .s_tt_ph_chg:before{background:linear-gradient(to right,currentColor 60%,transparent 60%)}
.s_tt_wx .s_tt_ph_bolt{display:inline-block;width:0.75rem;height:0.9375rem;margin:0 0.09375rem 0 0;vertical-align:-0.1125rem;background:#07c160;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='black'%20d='M7%202v11h3v9l7-12h-4l4-8z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='black'%20d='M7%202v11h3v9l7-12h-4l4-8z'/%3E%3C/svg%3E") center/contain no-repeat}
/* 状态栏底色跟着中间聊天块的皮肤走（顺序：组合皮肤写在后面优先） */
.s_tt_wx:has(.s_tt.s_s) .s_tt_phone{background:#fff}
.s_tt_wx:has(.s_tt.qqs) .s_tt_phone{background:#e9ecf3}
.s_tt_wx:has(.s_tt.sand) .s_tt_phone{background:#f4ecd9}
.s_tt_wx:has(.s_tt.coral) .s_tt_phone{background:linear-gradient(135deg,#ffe3ec,#fff7f0)}
.s_tt_wx:has(.s_tt.t_t),.s_tt_wx:has(.s_tt.tts) .s_tt_phone{background:linear-gradient(to right,#d0c6c5,#f7e4e0)}
.s_tt_wx:has(.s_tt.b_b) .s_tt_phone{background:#1f1f1f;color:#f2f2f2}
.s_tt_wx:has(.s_tt.b_b2) .s_tt_phone{background:#10654d;color:#f2f2f2}
.s_tt_wx:has(.s_tt.tts2) .s_tt_phone{background:#503663;color:#f2f2f2}
.s_tt_wx:has(.s_tt.b1) .s_tt_phone{background:#38a7c2;color:#fff}
.s_tt_wx:has(.s_tt.ocean) .s_tt_phone{background:linear-gradient(135deg,#0f2340,#123a55);color:#eaf2ff}
/* —— 底部输入栏：语音键 + 白输入框 + 表情键 + 加号键（图标用 SVG 蒙版画成单色线条）—— */
.s_tt_wx .s_tt_input{display:flex;align-items:center;gap:0.5625rem;padding:0.5625rem 0.875rem 0.6875rem;background:#f7f7f7;border-top:0.0625rem solid rgba(0,0,0,.06)}
.s_tt_wx .s_tt_input>b{flex:0 0 auto;width:1.625rem;height:1.625rem;padding:0;background:currentColor;color:#222;font-size:0}
.s_tt_wx .s_tt_input .s_tt_iv{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='black'%20d='M3%209v6h4l5%205V4L7%209H3zm13.5%203A4.5%204.5%200%200%200%2014%207.97v8.05A4.5%204.5%200%200%200%2016.5%2012zM14%203.23v2.06c2.89.86%205%203.54%205%206.71s-2.11%205.85-5%206.71v2.06c4.01-.91%207-4.49%207-8.77s-2.99-7.86-7-8.77z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='black'%20d='M3%209v6h4l5%205V4L7%209H3zm13.5%203A4.5%204.5%200%200%200%2014%207.97v8.05A4.5%204.5%200%200%200%2016.5%2012zM14%203.23v2.06c2.89.86%205%203.54%205%206.71s-2.11%205.85-5%206.71v2.06c4.01-.91%207-4.49%207-8.77s-2.99-7.86-7-8.77z'/%3E%3C/svg%3E") center/contain no-repeat}
.s_tt_wx .s_tt_input>i{flex:1;margin:0;padding:0.4375rem 0.6875rem;background:#fff;border-radius:0.375rem;font-style:normal;font-size:0.9375rem;line-height:1.4;color:#b5b5b5}
.s_tt_wx .s_tt_input .s_tt_if{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='black'%20d='M11.99%202C6.47%202%202%206.48%202%2012s4.47%2010%209.99%2010C17.52%2022%2022%2017.52%2022%2012S17.52%202%2011.99%202zM12%2020c-4.42%200-8-3.58-8-8s3.58-8%208-8%208%203.58%208%208-3.58%208-8%208zm3.5-9c.83%200%201.5-.67%201.5-1.5S16.33%208%2015.5%208%2014%208.67%2014%209.5s.67%201.5%201.5%201.5zm-7%200c.83%200%201.5-.67%201.5-1.5S9.33%208%208.5%208%207%208.67%207%209.5%207.67%2011%208.5%2011zm3.5%206.5c2.33%200%204.31-1.46%205.11-3.5H6.89c.8%202.04%202.78%203.5%205.11%203.5z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='black'%20d='M11.99%202C6.47%202%202%206.48%202%2012s4.47%2010%209.99%2010C17.52%2022%2022%2017.52%2022%2012S17.52%202%2011.99%202zM12%2020c-4.42%200-8-3.58-8-8s3.58-8%208-8%208%203.58%208%208-3.58%208-8%208zm3.5-9c.83%200%201.5-.67%201.5-1.5S16.33%208%2015.5%208%2014%208.67%2014%209.5s.67%201.5%201.5%201.5zm-7%200c.83%200%201.5-.67%201.5-1.5S9.33%208%208.5%208%207%208.67%207%209.5%207.67%2011%208.5%2011zm3.5%206.5c2.33%200%204.31-1.46%205.11-3.5H6.89c.8%202.04%202.78%203.5%205.11%203.5z'/%3E%3C/svg%3E") center/contain no-repeat}
.s_tt_wx .s_tt_input .s_tt_ip{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='black'%20d='M19%2013h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='black'%20d='M19%2013h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/%3E%3C/svg%3E") center/contain no-repeat}
.s_tt_wx:has(.s_tt:is(.b_b,.b_b2,.tts2,.ocean,.b1)) .s_tt_input{background:#262626;border-top-color:#333}
.s_tt_wx:has(.s_tt:is(.b_b,.b_b2,.tts2,.ocean,.b1)) .s_tt_input>b{color:#e0e0e0}
.s_tt_wx:has(.s_tt:is(.b_b,.b_b2,.tts2,.ocean,.b1)) .s_tt_input>i{background:#333;color:#888}
/* —— 消息组件（不依赖手机壳，普通 .s_tt 里直接可用）—— */
/* 引用回复：气泡内一块低透明度底色（黑底用白透、白底用黑透，任何皮肤都能看清）+ 原话 */
.s_tt .s_tt_l span .s_tt_q,.s_tt .s_tt_r span .s_tt_q{display:block;float:none;clear:both;margin:0.09375rem 0 0.3125rem;padding:0.3125rem 0.5625rem;border-radius:0.375rem;background:rgba(0,0,0,.10);font-size:0.84375rem;line-height:1.55;opacity:.92}
.s_tt.b_b .s_tt_l span .s_tt_q,.s_tt.b_b .s_tt_r span .s_tt_q,.s_tt.tts2 .s_tt_l span .s_tt_q,.s_tt.tts2 .s_tt_r span .s_tt_q,.s_tt.ocean .s_tt_l span .s_tt_q,.s_tt.ocean .s_tt_r span .s_tt_q{background:rgba(255,255,255,.16);opacity:.92}
/* 转账/定位卡所在行：脱掉气泡底（卡片自己着色），行内不要再写 三角 */
.s_tt .s_tt_l>span:has(>.s_tt_card),.s_tt .s_tt_r>span:has(>.s_tt_card),.s_tt .s_tt_l>span:has(>.s_tt_loc),.s_tt .s_tt_r>span:has(>.s_tt_loc){padding:0;background:none;border:0;border-radius:0;box-shadow:none;color:inherit}
/* 转账卡：整条红色（白圆红¥），左/右消息同款红卡；底部可选一条半透明白色留言。无留言时与红包卡等高 */
.s_tt .s_tt_l span.s_tt_card,.s_tt .s_tt_r span.s_tt_card{position:relative;float:none;display:flex;flex-wrap:wrap;align-items:center;gap:0 0.75rem;width:15.625rem;max-width:100%;margin:0;padding:1.0625rem 1rem;background:#e94f3d;border-radius:0.5625rem;box-shadow:0 0.09375rem 0.3125rem rgba(233,79,61,.25);color:#fff;text-align:left}
.s_tt .s_tt_l span.s_tt_card:before{content:"";position:absolute;right:100%;top:1.9375rem;width:0;height:0;border:0.375rem solid transparent;border-right-color:#e94f3d}
.s_tt .s_tt_r span.s_tt_card:before{content:"";position:absolute;left:100%;top:1.9375rem;width:0;height:0;border:0.375rem solid transparent;border-right-color:transparent;border-left-color:#e94f3d}
/* ci 是 标签，会继承通用尖角的 left/right/top/border，这里必须全部清零，否则红包图标会错位偏移 */
.s_tt .s_tt_card .s_tt_ci{position:static;top:auto;right:auto;bottom:auto;left:auto;float:none;flex:0 0 auto;width:2.625rem;height:2.625rem;margin:0;padding:0;border:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff;color:#e94f3d;font-style:normal;font-size:1.3125rem;font-weight:600;text-indent:0;line-height:1}
/* cw 是 span，会继承通用气泡的 float 和 1.875rem 尖角外边距，必须重置，否则右侧卡片图文会被顶开 */
.s_tt .s_tt_card .s_tt_cw{flex:1;min-width:0;float:none;margin:0;padding:0;background:none;text-align:left}
.s_tt .s_tt_card .s_tt_cw b{display:block;margin:0;padding:0;background:none;font-size:1.03125rem;line-height:1.5;font-weight:600;color:#fff}
.s_tt .s_tt_card .s_tt_cw em{display:block;margin:0.125rem 0 0;padding:0;background:none;font-style:normal;font-size:0.875rem;line-height:1.4;color:rgba(255,255,255,.88)}
.s_tt .s_tt_card small{flex:0 0 100%;display:block;margin:0.8125rem 0 0;padding:0.625rem 0 0.125rem;border-top:0.0625rem solid rgba(255,255,255,.28);font-size:0.8125rem;line-height:1.4;color:rgba(255,255,255,.92)}
/* 红包：整条橙红（和转账红区分开），深红圆里画白色红包袋（袋身+下扣半圆+小圆扣）；高度与无留言转账一致 */
.s_tt span.s_tt_card.s_tt_hong{background:#fa7247;box-shadow:0 0.09375rem 0.3125rem rgba(250,114,71,.25)}
.s_tt .s_tt_l span.s_tt_hong:before{border-right-color:#fa7247}
.s_tt .s_tt_r span.s_tt_hong:before{border-right-color:transparent;border-left-color:#fa7247}
.s_tt .s_tt_hong .s_tt_ci{position:relative;background:#d84a24;font-size:0;border:0;text-indent:0}
.s_tt .s_tt_hong .s_tt_ci:before{content:"";position:absolute;left:50%;top:50%;width:1.25rem;height:1rem;margin:-0.28125rem 0 0 -0.625rem;background:#fff;border-radius:0.1375rem}
.s_tt .s_tt_hong .s_tt_ci:after{content:"";position:absolute;left:50%;top:50%;width:0.9375rem;height:0.46875rem;margin:-0.46875rem 0 0 -0.46875rem;background:#d84a24;border-radius:0 0 0.46875rem 0.46875rem;box-shadow:0 0.1125rem 0 -0.21875rem #fff}
.s_tt .s_tt_hong .s_tt_cw b{color:#fff}
.s_tt .s_tt_hong .s_tt_cw em{color:rgba(255,255,255,.88)}
/* 定位消息：白底大卡，📍emoji + 店名加粗，下面灰字距离/状态；不画假地图 */
.s_tt .s_tt_l span.s_tt_loc,.s_tt .s_tt_r span.s_tt_loc{position:relative;float:none;display:block;width:16.875rem;max-width:100%;margin:0;padding:1rem 1.125rem;background:#fff;border-radius:0.5625rem;box-shadow:0 0.09375rem 0.3125rem rgba(0,0,0,.10);color:#1a1a1a;text-align:left}
.s_tt .s_tt_l span.s_tt_loc:before{content:"";position:absolute;right:100%;top:1.1875rem;width:0;height:0;border:0.375rem solid transparent;border-right-color:#fff}
.s_tt .s_tt_r span.s_tt_loc:before{content:"";position:absolute;left:100%;top:1.1875rem;width:0;height:0;border:0.375rem solid transparent;border-right-color:transparent;border-left-color:#fff}
.s_tt .s_tt_loc b{display:block;margin:0;padding:0;background:none;font-size:1.15625rem;line-height:1.5;font-weight:600;color:#1a1a1a}
.s_tt .s_tt_loc em{display:block;margin:0.21875rem 0 0;padding:0;background:none;font-style:normal;font-size:0.875rem;line-height:1.55;color:#9a9a9a;white-space:normal}
.s_tt.b_b span.s_tt_loc{background:#3a3a3a;color:#e8e8e3}
.s_tt.b_b .s_tt_l span.s_tt_loc:before{border-right-color:#3a3a3a}
.s_tt.b_b .s_tt_r span.s_tt_loc:before{border-right-color:transparent;border-left-color:#3a3a3a}
.s_tt.b_b .s_tt_loc b{color:#f0f0f0}
/* 所有非聊天消息的提示（撤回/拍一拍/删除/拉黑/朋友验证/拒收）统一一个样式：
居中半透明灰胶囊，只换 emoji 和文字；底色用半透明灰，浅色皮肤深色皮肤都能看清。裸文本也能居中灰字兜底 */
.s_tt p.s_tt_sys,.s_tt p.s_tt_pat,.s_tt p.s_tt_rej{clear:both;text-align:center;margin:0.6875rem 0;padding:0;font-size:0.78125rem;line-height:1.7;color:#8a8a8a}
.s_tt p.s_tt_sys>span,.s_tt p.s_tt_pat>span,.s_tt p.s_tt_rej>span{display:inline-block;max-width:88%;padding:0.28125rem 0.875rem;border-radius:61.875rem;background:rgba(128,128,128,.16);color:#8a8a8a;font-size:0.78125rem;line-height:1.7}
.s_tt.b_b p.s_tt_sys,.s_tt.b_b p.s_tt_pat,.s_tt.b_b p.s_tt_rej,.s_tt.tts2 p.s_tt_sys,.s_tt.tts2 p.s_tt_pat,.s_tt.tts2 p.s_tt_rej,.s_tt.ocean p.s_tt_sys,.s_tt.ocean p.s_tt_pat,.s_tt.ocean p.s_tt_rej,.s_tt.b1 p.s_tt_sys,.s_tt.b1 p.s_tt_pat,.s_tt.b1 p.s_tt_rej{color:#b0b0b0}
.s_tt.b_b p.s_tt_sys>span,.s_tt.b_b p.s_tt_pat>span,.s_tt.b_b p.s_tt_rej>span,.s_tt.tts2 p.s_tt_sys>span,.s_tt.tts2 p.s_tt_pat>span,.s_tt.tts2 p.s_tt_rej>span,.s_tt.ocean p.s_tt_sys>span,.s_tt.ocean p.s_tt_pat>span,.s_tt.ocean p.s_tt_rej>span,.s_tt.b1 p.s_tt_sys>span,.s_tt.b1 p.s_tt_pat>span,.s_tt.b1 p.s_tt_rej>span{background:rgba(255,255,255,.14);color:#b0b0b0}
.s_tt p.s_tt_rej{margin:0.1875rem 0 0.75rem}
/* 发送失败：气泡左边的红色感叹号圆标（拒收/拉黑场景），尺寸要醒目 */
.s_tt .s_tt_l span i.s_tt_fi,.s_tt .s_tt_r span i.s_tt_fi{display:block !important;position:absolute;right:calc(100% + 0.5rem);top:50%;transform:translateY(-50%);width:1.4375rem;height:1.4375rem;margin:0;padding:0;border:0;border-radius:50%;background:#fa5151;color:#fff;font-style:normal;font-size:1rem;font-weight:700;line-height:1.4375rem;text-align:center;text-indent:0}
/* 折叠里的代码块：xmp 深底，与 m-fold 配色一致 */
.m-fold .m-body xmp{display:block;margin:0;padding:0.75rem 0.875rem;background:rgba(0,0,0,.28);border-radius:0.5rem;font-family:ui-monospace,Consolas,monospace;font-size:0.71875rem;line-height:1.9;color:#cfc8e8;white-space:pre-wrap;word-break:break-all}
/* ===== 线下聊天样式（文章叙事用，不套手机壳）：场景卡 / 思考泡；对白 yin3-4、台词条 line 沿用原样式 ===== */
.s_off{margin:1.25rem 0 1.75rem}
/* 场景卡：左边一颗黑白斜纹场记板小方块（i），右边场景名（b）+ 一句氛围描写（em），用于开场或转场 */
.s_off .s_off_sc{display:flex;align-items:center;gap:1rem;margin:0 0 1.625rem;padding:1rem 1.375rem;border-radius:0.625rem;background:rgba(167,139,250,.1);border-left:0.375rem solid #a78bfa}
.s_off .s_off_sc>i{flex:0 0 auto;width:2.875rem;height:2.875rem;margin:0;padding:0;border:0.125rem solid rgba(255,255,255,.85);border-radius:0.5rem;background:repeating-linear-gradient(135deg,#2b2540 0 0.625rem,#f4f1ff 0.625rem 1.25rem);box-shadow:0 0.125rem 0.5rem rgba(0,0,0,.25)}
.s_off .s_off_sc p{margin:0;min-width:0}
.s_off .s_off_sc b{display:block;margin:0;padding:0;background:none;font-size:1.1875rem;line-height:1.5;font-weight:700;color:#ffd9a0}
.s_off .s_off_sc em{display:block;margin:0.15625rem 0 0;padding:0;background:none;font-style:normal;font-size:0.84375rem;line-height:1.6;color:#a79fc4}
/* 内心独白：漫画思考云泡。span 是云泡（贴边两朵鼓包靠 :before/:after），泡里两个空 i 是引向说话人的渐小圆圈；th_l 靠左、th_r 靠右 */
.s_off p.s_off_th_l,.s_off p.s_off_th_r{position:relative;margin:0 0 2rem;padding:0}
.s_off p.s_off_th_l{padding-left:2.625rem}
.s_off p.s_off_th_r{padding-right:2.625rem}
.s_off .s_off_th_l>span,.s_off .s_off_th_r>span{position:relative;display:inline-block;max-width:72%;margin:0;padding:0.875rem 1.1875rem;background:#fff;color:#433d56;font-style:italic;font-size:1.03125rem;line-height:1.625rem;border-radius:1.5rem;box-shadow:0 0.25rem 0.875rem rgba(0,0,0,.22);text-align:left}
.s_off .s_off_th_l>span:before,.s_off .s_off_th_r>span:before{content:"";position:absolute;bottom:0.5rem;width:0.9375rem;height:0.9375rem;border-radius:50%;background:#fff}
.s_off .s_off_th_l>span:after,.s_off .s_off_th_r>span:after{content:"";position:absolute;bottom:-0.0625rem;width:0.625rem;height:0.625rem;border-radius:50%;background:#fff}
.s_off .s_off_th_l>span:before{left:-0.1875rem}
.s_off .s_off_th_l>span:after{left:-0.8125rem}
.s_off .s_off_th_r>span:before{right:-0.1875rem}
.s_off .s_off_th_r>span:after{right:-0.8125rem}
.s_off .s_off_th_l i,.s_off .s_off_th_r i{position:absolute;bottom:-0.375rem;width:0.3875rem;height:0.3875rem;margin:0;padding:0;border:0;border-radius:50%;background:#fff;text-indent:0;overflow:visible}
.s_off .s_off_th_l i:nth-child(1){left:-1.5625rem}
.s_off .s_off_th_l i:nth-child(2){left:-2.1875rem;bottom:-0.6875rem;width:0.2625rem;height:0.2625rem}
.s_off .s_off_th_r{text-align:right}
.s_off .s_off_th_r i:nth-child(1){right:-1.5625rem}
.s_off .s_off_th_r i:nth-child(2){right:-2.1875rem;bottom:-0.6875rem;width:0.2625rem;height:0.2625rem}
/* 旁白/动作条：两侧渐隐细线夹一行斜体小字，写动作、神态、环境这类"镜头语言"，插在两句对白之间 */
.s_off p.s_off_nar{display:flex;align-items:center;gap:0.8125rem;max-width:86%;margin:0 auto 1.625rem;padding:0}
.s_off p.s_off_nar:before,.s_off p.s_off_nar:after{content:"";flex:1;height:0.0625rem;background:linear-gradient(90deg,transparent,rgba(167,139,250,.55))}
.s_off p.s_off_nar:after{background:linear-gradient(270deg,transparent,rgba(167,139,250,.55))}
.s_off p.s_off_nar>i{flex:0 0 auto;width:0.5625rem;height:0.5625rem;margin:0;padding:0;border:0;border-radius:50%;background:rgba(167,139,250,.95);box-shadow:0 0 0 0.21875rem rgba(167,139,250,.18);text-indent:0}
.s_off p.s_off_nar>em{display:block;flex:0 1 auto;min-width:0;margin:0;padding:0;background:none;font-style:italic;font-size:0.90625rem;line-height:1.9;letter-spacing:.12em;color:#9d94bd;text-align:center}
/* 便签对白：像钉在墙上的便利贴，一张纸一句话，角色名小字在纸顶；nt_l 米黄纸靠左、nt_r 淡绿纸靠右，顶部一条半透明胶带、纸面微歪更随手 */
.s_off p.s_off_nt_l,.s_off p.s_off_nt_r{position:relative;display:table;max-width:74%;margin:0 0 1.75rem;padding:0.875rem 1.1875rem 0.8125rem;border-radius:0.25rem;background:#fdf6d8;font-size:1.125rem;line-height:1.75rem;color:#423c2e;box-shadow:0 0.25rem 0.75rem rgba(0,0,0,.3)}
.s_off p.s_off_nt_l{margin-right:auto;transform:rotate(-1.4deg)}
.s_off p.s_off_nt_r{margin-left:auto;margin-right:0;background:#e8f4e4;transform:rotate(1.4deg)}
.s_off p.s_off_nt_l:before,.s_off p.s_off_nt_r:before{content:"";position:absolute;top:-0.5rem;left:50%;width:4.5rem;height:1.0625rem;margin-left:-2.25rem;background:rgba(255,255,255,.28);border:0.0625rem solid rgba(255,255,255,.22);box-shadow:0 0.09375rem 0.25rem rgba(0,0,0,.15);transform:rotate(-2.5deg)}
.s_off p.s_off_nt_r:before{transform:rotate(2.5deg)}
.s_off p.s_off_nt_l b,.s_off p.s_off_nt_r b{display:block;margin:0 0 0.1875rem;padding:0;background:none;font-size:0.84375rem;line-height:1.6;font-weight:700;letter-spacing:.14em}
/* 样式库用：头像清单 */
.s_tt_avlist{display:flex;flex-wrap:wrap;gap:0.875rem 1.125rem;margin:0.75rem 0;padding:0.875rem 0.75rem;border-radius:0.5rem;background:rgba(127,127,127,.08)}
.s_tt_avlist figure{width:6rem;text-align:center;margin:0}
.s_tt_avlist img{width:3.5rem;height:3.5rem;border-radius:50%;object-fit:cover;border:0.125rem solid rgba(255,255,255,.75);box-shadow:0 0.125rem 0.375rem rgba(0,0,0,.22)}
.s_tt_avlist figcaption{font-size:0.75rem;line-height:1.6;opacity:.72;margin-top:0.3125rem}
/* 样式库用：emoji 清单 */
.s_tt_emoji{display:flex;flex-wrap:wrap;gap:0.3125rem 0.4375rem;padding:0.75rem 0.875rem;border-radius:0.5rem;background:rgba(127,127,127,.08)}
.s_tt_emoji span{font-size:1.5rem;line-height:1.1}
/* 样式库用：代码片段 */
.s_tt_code{display:block;margin:0.5rem 0;padding:0.6875rem 0.8125rem;border-radius:0.375rem;background:rgba(127,127,127,.14);font-family:ui-monospace,Consolas,monospace;font-size:0.75rem;line-height:1.9;white-space:pre-wrap;word-break:break-all;opacity:.9}
/* ===== 语音喇叭图标（s_tt_voice 行通用，3058/3059/3060 在用）=====
在普通气泡里是尖角专用标签（position:absolute + width:0 + s_s 下 display:none），
这里把它救回来画成三根声波柱，颜色跟随气泡文字，里面的 emoji 藏掉。 */
.s_tt_vi{display:inline-flex !important;position:static !important;float:none !important;flex:0 0 auto !important;align-items:center !important;gap:0.125rem !important;width:auto !important;min-width:1.25rem !important;height:1rem !important;min-height:0 !important;margin:0 !important;padding:0 !important;border:0 !important;background:none !important;box-shadow:none !important;transform:none !important;clip:auto !important;left:auto !important;top:auto !important;overflow:visible !important;visibility:visible !important;font-size:0 !important;line-height:1;opacity:1 !important;color:inherit}
.s_tt_vi:before,.s_tt_vi:after{content:"";display:block;width:0.1875rem;border-radius:0.125rem;background:currentColor}
.s_tt_vi:before{height:0.4375rem;opacity:.95}
.s_tt_vi:after{height:0.8125rem;opacity:.75;box-shadow:0.3125rem 0 0 -0.04375rem currentColor}
table.native{margin:0 auto}
.s_tt p.pic>span{float:none; display:block; max-width:16.25rem; padding:0.28125rem 0.28125rem 0; background:#fff; border:0.0625rem solid rgba(0,0,0,.08); border-radius:0.625rem; box-shadow:0 0.1875rem 0.75rem rgba(0,0,0,.14)}
.s_tt .s_tt_r.pic>span{margin-left:auto}
.s_tt p.pic img{display:block; width:100%; height:auto; border-radius:0.5rem; margin:0; border:0}
.s_tt p.pic em{display:block; font-style:normal; padding:0.3125rem 0.21875rem 0.34375rem; font-size:0.78125rem; line-height:1.25rem; color:#7a7386}
.s_tt p.quote>span{float:none; background:rgba(128,128,128,.16); color:#6b6480; font-size:0.8125rem; line-height:1.375rem; padding:0.3125rem 0.6875rem; border-left:0.15625rem solid rgba(167,139,250,.8)}
.s_tt .s_tt_r.quote>span{margin-left:auto}
.s_tt.b_b p.pic>span,.s_tt.ocean p.pic>span,.s_tt.tts2 p.pic>span{background:#2a2a2a; border-color:rgba(255,255,255,.12)}
.s_tt.b_b p.pic em,.s_tt.ocean p.pic em,.s_tt.tts2 p.pic em{color:#a9a2b8}
.s_tt.b_b p.quote>span,.s_tt.ocean p.quote>span,.s_tt.tts2 p.quote>span{background:rgba(255,255,255,.09); color:#bcb3d0}
/* 连续同侧气泡：只贴紧（负 margin），圆角保持与单条完全一致。
原先这里还把上角改成 0.5rem，结果同侧第二条的角比第一条秃一块（2026-10-04 用户指出后移除）。 */
.s_tt p.s_tt_l+p.s_tt_l,.s_tt p.s_tt_r+p.s_tt_r{margin-top:-0.375rem}
/* 语音条（p.s_tt_voice，3058/3059/3060 在线上用）：
左语音＝浅色胶囊＋喇叭在左；右语音＝皮肤色胶囊＋喇叭在右（row-reverse 把图标翻到右边）。
下面跟一块浅灰底的转文字 vt，左语音靠左、右语音靠右。
写法：4"转的文字
*/
.s_tt p.s_tt_voice{margin-bottom:0.875rem;overflow:hidden}
.s_tt p.s_tt_voice>span.s_tt_vw{display:inline-flex;align-items:center;gap:0.375rem;min-width:4.375rem;padding:0.40625rem 0.9375rem;border-radius:1.875rem}
.s_tt p.s_tt_l.s_tt_voice>span.s_tt_vw{float:left;justify-content:flex-start;background:#fff;color:#333}
.s_tt p.s_tt_r.s_tt_voice>span.s_tt_vw{float:right;flex-direction:row-reverse;justify-content:flex-start;background:#a1eb70;color:#fff}
.s_tt.s_s p.s_tt_l.s_tt_voice>span.s_tt_vw{background:#f5f5f5;color:#333}
.s_tt.tts2 p.s_tt_l.s_tt_voice>span.s_tt_vw{background:#fdb0b0;color:#333}
.s_tt.b_b p.s_tt_l.s_tt_voice>span.s_tt_vw,.s_tt.b_b2 p.s_tt_l.s_tt_voice>span.s_tt_vw{background:#3a3a3a;color:#e8e8e3}
.s_tt.b_b p.s_tt_r.s_tt_voice>span.s_tt_vw,.s_tt.b_b2 p.s_tt_r.s_tt_voice>span.s_tt_vw{background:#2fa15d;color:#fff}
.s_tt.coral p.s_tt_l.s_tt_voice>span.s_tt_vw{background:#fff;color:#3a2b33}
.s_tt.coral p.s_tt_r.s_tt_voice>span.s_tt_vw{background:linear-gradient(90deg,#ff7fa8,#ff5c9d);color:#fff}
.s_tt.ocean p.s_tt_l.s_tt_voice>span.s_tt_vw{background:#1c3f63;color:#dbeaff}
.s_tt.ocean p.s_tt_r.s_tt_voice>span.s_tt_vw{background:linear-gradient(90deg,#3ef7c6,#26d4d2);color:#04232a}
.s_tt.sand p.s_tt_l.s_tt_voice>span.s_tt_vw{background:#fffcf3;color:#4a3c22}
.s_tt.sand p.s_tt_r.s_tt_voice>span.s_tt_vw{background:#8c6239;color:#fff8ea}
.s_tt p.s_tt_voice>span.s_tt_vw em{font-style:normal;font-size:0.875rem;opacity:.92;letter-spacing:0.0125rem;white-space:nowrap}
/* 语音条长度档（按时长给宽度，避免内联 style） */
.s_tt p.s_tt_voice>span.s_tt_vw.s_v2{width:4.6875rem}
.s_tt p.s_tt_voice>span.s_tt_vw.s_v3{width:5.375rem}
.s_tt p.s_tt_voice>span.s_tt_vw.s_v4{width:6rem}
.s_tt p.s_tt_voice>span.s_tt_vw.s_v6{width:7rem}
.s_tt p.s_tt_voice>span.s_tt_vw.s_v8{width:7.625rem}
.s_tt p.s_tt_voice>span.s_tt_vw.s_v9{width:8.25rem}
.s_tt p.s_tt_voice>span.s_tt_vw.s_v12{width:9.5rem}
.s_tt p.s_tt_voice>span.s_tt_vw.s_v15{width:11rem}
.s_tt p.s_tt_voice>span.s_tt_vw.s_v60{width:16.5625rem}
/* 转文字：胶囊下面一块浅灰圆角小卡，左语音靠左、右语音靠右；深色皮肤换白透底 */
.s_tt p.s_tt_voice>span.s_tt_vt{clear:both;max-width:78%;margin-top:0.375rem;padding:0.34375rem 0.625rem;background:rgba(128,128,128,.12);border-radius:0.5625rem;font-size:0.84375rem;line-height:1.65;color:#7f7f8a;white-space:normal}
.s_tt p.s_tt_l.s_tt_voice>span.s_tt_vt{float:left}
.s_tt p.s_tt_r.s_tt_voice>span.s_tt_vt{float:right}
.s_tt.av p.s_tt_voice>span.s_tt_vt:before{display:none}
.s_tt.b_b p.s_tt_voice>span.s_tt_vt,.s_tt.b_b2 p.s_tt_voice>span.s_tt_vt,.s_tt.ocean p.s_tt_voice>span.s_tt_vt,.s_tt.tts2 p.s_tt_voice>span.s_tt_vt{background:rgba(255,255,255,.10);color:#b5bcc4}
/* ===== 图片消息（p.s_tt_pic）：微信发图没有气泡底和尖角，圆角图直接贴头像侧；点图走全站灯箱放大。
头像画在 span:before 上（定位在 span 外侧），所以 span 只清气泡底色/内边距，绝不能加 overflow，否则头像被裁掉；
左右漂浮直接用基础样式的 float，各皮肤（含深色、无头像模式）都自动适配 ===== */
.s_tt p.s_tt_pic{margin-bottom:0.875rem;overflow:hidden}
.s_tt p.s_tt_pic>span{padding:0;background:none;border:0;border-radius:0;box-shadow:none}
.s_tt p.s_tt_pic>span i{display:none}
.s_tt p.s_tt_pic>span img{display:block;width:100%;max-width:13.75rem;height:auto;border-radius:0.5625rem;box-shadow:0 0.125rem 0.5rem rgba(0,0,0,.18);cursor:zoom-in}
/* ===== H 数据：数值条 / 镜像对照 / 100% 堆叠 / 表格 / 数字卡 ===== */
.m-meter{margin:1rem 0 1.25rem}
.m-meter .m-mrow{display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:0.875rem; margin:0.625rem 0; font-size:0.96875rem; color:#e2dcef}
.m-meter .m-mlab{min-width:2.875rem}
.m-meter .m-mtrack{height:0.6875rem; border-radius:0.625rem; background:rgba(255,255,255,.08); overflow:hidden}
.m-meter .m-mfill{display:block; height:100%; border-radius:0.625rem; background:linear-gradient(90deg,var(--vio),var(--vio2))}
.m-meter .m-mval{text-align:right; color:#fff; font-weight:700; min-width:1.875rem}
.m-meter .o .m-mfill{background:linear-gradient(90deg,#ffa751,#ff6348)}
.m-meter .p .m-mfill{background:linear-gradient(90deg,#ff7eb3,#ff4d6d)}
.m-meter .g .m-mfill{background:linear-gradient(90deg,#43cea2,#185a9d)}
.m-vs{margin:1.375rem 0; padding:1.25rem 1.375rem 0.75rem; border-radius:0.875rem; background:linear-gradient(160deg,var(--sf1),#241f35); border:0.0625rem solid var(--line)}
.m-vs>.t{text-align:center; font-size:1.0625rem; color:var(--gold); letter-spacing:.14em; margin:0 0 0.3125rem}
.m-vs>.sub{text-align:center; font-size:0.8125rem; color:var(--dim); margin:0 0 1.125rem}
.m-vs .row{display:grid; grid-template-columns:5.9375rem minmax(0,1fr) 5.9375rem; align-items:center; gap:0.625rem; margin:0.75rem 0; font-size:0.90625rem; color:#e2dcef}
.m-vs .row .lv{text-align:right; color:#c3a9e8}
.m-vs .row .rv{text-align:left; color:#ffc08a}
.m-vs .track{position:relative; height:1rem; border-radius:0.1875rem; background:rgba(255,255,255,.06); overflow:hidden}
.m-vs .track b{position:absolute; top:0; bottom:0; border-radius:0}
.m-vs .track b.l{right:50%; left:auto; background:linear-gradient(90deg,#5236af,#987bb1)}
.m-vs .track b.r{left:50%; right:auto; background:linear-gradient(90deg,#ff9a4d,#ff6348)}
.m-vs .cap{display:flex; justify-content:space-between; font-size:0.78125rem; color:var(--dim); margin-top:0.375rem}
.m-split{margin:1.375rem 0}
.m-split .nm{display:flex; flex-wrap:wrap; justify-content:space-between; gap:0.125rem 0.5rem; font-size:0.9375rem; color:#e2dcef; margin-bottom:0.4375rem}
.m-split .nm b:first-child{color:#c3a9e8}
.m-split .nm b:last-child{color:#ffc08a}
.m-split .bar{display:flex; height:2.125rem; border-radius:0.375rem; overflow:hidden; font-size:0.875rem; color:#fff; font-weight:700}
.m-split .bar span{display:flex; align-items:center; justify-content:center; white-space:nowrap}
.m-split .bar .l{background:linear-gradient(90deg,#5236af,#987bb1)}
.m-split .bar .r{background:linear-gradient(90deg,#ff9a4d,#e0568f)}
.m-split .lb{display:flex; flex-wrap:wrap; justify-content:space-between; gap:0.125rem 0.5rem; font-size:0.78125rem; color:var(--dim); margin-top:0.375rem}
.m-tablewrap{margin:1.375rem auto; overflow-x:auto; border-radius:0.75rem; background:linear-gradient(180deg,var(--sf1),#241f35); border:0.0625rem solid var(--line); max-width:100%}
.m-tablewrap.w{background:#fff; border-color:#e6e2f5}
table.m-table{width:100%; max-width:none; min-width:32.5rem; border-collapse:separate; border-spacing:0; background:none; opacity:1; color:#e2dcef; font-size:0.9375rem; text-align:left; margin:0 auto}
table.m-table th{background:#2a2436; color:var(--gold); font-weight:700; padding:0.8125rem 0.75rem; font-size:0.875rem; letter-spacing:.06em; white-space:nowrap; border:0; text-align:left}
table.m-table td{padding:0.71875rem 0.75rem; border:0; line-height:1.4375rem; vertical-align:top}
table.m-table tbody tr:nth-child(2n) td{background:rgba(255,255,255,.035)}
table.m-table tbody tr:hover td{background:rgba(152,123,177,.14)}
table.m-table td b{color:#fff}
table.m-table .num{color:var(--gold); font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums}
table.m-table .pct{display:inline-block; min-width:2.625rem; padding:0.0625rem 0.5rem; border-radius:0.3125rem; background:rgba(255,217,160,.14); color:var(--gold); text-align:center}
table.m-table.light{color:#3a3450; background:#fff}
table.m-table.light td{background:#fff}
table.m-table.light tbody tr:nth-child(2n) td{background:rgba(90,60,160,.05)}
table.m-table.light th{background:#efeafe; color:#4a2f8c}
table.m-table.light tbody tr:hover td{background:rgba(90,60,160,.1)}
table.m-table.light td b{color:#241e33}
.m-stat{display:grid; gap:0.75rem; grid-template-columns:repeat(auto-fit,minmax(8.125rem,1fr)); margin:1.375rem 0}
.m-stat>div{padding:1.125rem 0.875rem; border-radius:0.75rem; text-align:center; background:linear-gradient(160deg,var(--sf1),#241f35); border:0.0625rem solid var(--line); border-top:0.25rem solid var(--lav)}
.m-stat b{display:block; font-size:2.125rem; line-height:1.25; color:#fff; font-weight:800}
.m-stat span{font-size:0.875rem; color:var(--dim); letter-spacing:.06em}
.m-stat .k1{border-top-color:var(--gold)}
.m-stat .k1 b{color:var(--gold)}
.m-stat .k2{border-top-color:var(--pk)}
.m-stat .k2 b{color:var(--pk)}
.m-stat .k3{border-top-color:var(--cy)}
.m-stat .k3 b{color:var(--cy)}
.m-stat .k4{border-top-color:var(--bl)}
.m-stat .k4 b{color:var(--bl)}
.m-stat .w{background:#fdfcff; border:0.0625rem solid #eae5f8; border-top:0.25rem solid #e0568f}
.m-stat .w b{color:#3a2b5c}
.m-stat .w span{color:#8a8399}
.m-stat .w.k1{border-top-color:#e8a317}
.m-stat .w.k1 b{color:#b8791a}
.m-stat .w.k2{border-top-color:#e0568f}
.m-stat .w.k2 b{color:#c02f6c}
.m-stat .w.k3{border-top-color:#16a05f}
.m-stat .w.k3 b{color:#0f7f4b}
.m-stat .w.k4{border-top-color:#3878d0}
.m-stat .w.k4 b{color:#2a5fb0}
/* ===== I 图片排版：5 种拼图 + 图注 + 对比滑块 ===== */
.m-shot,.m-tri,.m-strip,.m-pz{--gap:0.375rem}
.m-shot{display:grid; gap:var(--gap); margin:1.375rem 0; grid-template-columns:2fr 1fr}
.m-shot figure{margin:0; position:relative; overflow:hidden; border-radius:0}
.m-shot figure:first-child{grid-row:span 2}
.m-shot img{width:100%; height:100%; object-fit:cover; display:block; border-radius:0; margin:0; border:0}
.m-tri{display:grid; grid-template-columns:1fr 1fr; gap:var(--gap); margin:1.375rem 0}
.m-tri figure{margin:0; overflow:hidden; grid-column:span 1}
.m-tri figure:first-child{grid-column:span 2}
.m-tri img{width:100%; height:100%; object-fit:cover; display:block; border-radius:0; margin:0; border:0}
.m-tri figure:first-child img{max-height:16.25rem}
.m-tri figure:not(:first-child) img{height:10rem}
.m-strip{display:flex; gap:var(--gap); margin:1.375rem 0}
.m-strip img{flex:1; min-width:0; height:11.25rem; object-fit:cover; border-radius:0; margin:0; border:0}
.m-pz{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--gap); margin:1.375rem 0}
.m-quad{display:grid; grid-template-columns:1fr 1fr; gap:var(--gap); margin:1.375rem 0}
.m-quad img{width:100%; height:10.625rem; object-fit:cover; display:block; border-radius:0; margin:0; border:0}
.m-pz img{width:100%; height:8.125rem; object-fit:cover; border-radius:0; margin:0; border:0}
.m-figure{margin:1.375rem 0; text-align:center}
.m-figure img{max-width:100%; height:auto; border-radius:0; display:inline-block; border:0; margin:0}
.m-figure figcaption{margin-top:0.5625rem; font-size:0.875rem; color:var(--dim)}
.m-figure figcaption b{color:var(--gold); margin-right:0.375rem}
.m-cmp{position:relative; margin:1.375rem 0; overflow:hidden; border-radius:0; user-select:none; --p:50%}
.m-cmp img{display:block; width:100%; border-radius:0; margin:0; border:0}
.m-cmp .top{position:absolute; inset:0; clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.m-cmp .top img{width:100%; max-width:100%; height:100%}
.m-cmp .hnd{position:absolute; top:0; bottom:0; left:var(--p); margin-left:-0.125rem; width:0.25rem; background:var(--gold); cursor:ew-resize; z-index:2}
.m-cmp .hnd:after{content:"⇄"; position:absolute; top:50%; left:-1.1875rem; transform:translateY(-50%); width:2.5rem; height:2.5rem; border-radius:50%; background:var(--gold); color:#1a1620; display:flex; align-items:center; justify-content:center; font-size:1.25rem}
.m-cmp .tagl{position:absolute; top:0.625rem; left:0.625rem; padding:0.125rem 0.625rem; border-radius:61.875rem; background:rgba(0,0,0,.6); color:#fff; font-size:0.8125rem}
.m-cmp .tagr{position:absolute; top:0.625rem; right:0.625rem; padding:0.125rem 0.625rem; border-radius:61.875rem; background:rgba(0,0,0,.6); color:#fff; font-size:0.8125rem}
/* ===== J 组件箱：步骤 / 折叠 / Tab / 片单 / CTA / 分隔符 ===== */
.m-steps{list-style:none; margin:1.375rem 0; padding:0; position:relative}
.m-steps:after{content:""; position:absolute; left:1.4375rem; top:0.625rem; bottom:1.25rem; width:0.0625rem; background:#3d3648}
.m-steps li{list-style:none; position:relative; padding:0 0 1.5rem 4rem; font-size:1.03125rem; line-height:1.6875rem; color:#e2dcef}
.m-steps li b{color:#fff}
.m-steps li em{font-style:normal; display:block; font-size:0.875rem; color:var(--dim)}
.m-steps li:nth-child(3n+1):before{background:linear-gradient(140deg,#f9a8d4,#a78bfa); color:#fff}
.m-steps li:nth-child(3n+2):before{background:linear-gradient(140deg,#7dd3fc,#6ee7b7); color:#fff}
.m-steps li:nth-child(3n):before{background:linear-gradient(140deg,#fdba74,#f9a8d4); color:#fff}
.m-steps li:before{content:attr(data-n); position:absolute; left:0; top:0; width:3rem; height:3rem; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.1875rem; font-weight:800; border:0}
.m-fold{margin:0.875rem 0; border:0.0625rem solid var(--line); border-radius:0.75rem; background:linear-gradient(150deg,var(--sf1),#241f35); overflow:hidden}
.m-fold summary{cursor:pointer; padding:0.9375rem 1.25rem; font-size:1.0625rem; color:#f3eefc; list-style:none; position:relative; font-weight:600}
.m-fold summary::-webkit-details-marker{display:none}
.m-fold summary:after{content:"+"; position:absolute; right:1.0625rem; top:1.0625rem; width:2rem; height:2rem; border-radius:50%; display:grid; place-items:center; font-size:1.375rem; line-height:1; color:var(--sak); background:rgba(249,168,212,.14); border:0.0625rem solid rgba(249,168,212,.35); transition:all .25s}
.m-fold details[open] summary:after{content:"−"; color:var(--mint); background:rgba(110,231,183,.14); border-color:rgba(110,231,183,.4)}
.m-fold .m-body{padding:0.375rem 1.25rem 1.125rem; border-top:0.0625rem solid rgba(167,139,250,.22); background:rgba(255,255,255,.035)}
.m-fold .m-body p{font-size:1.03125rem; line-height:1.8125rem; color:#e8e2f5}
.m-tabs{margin:1.375rem 0; border:0.0625rem solid var(--line); border-radius:0.875rem; overflow:hidden; background:linear-gradient(160deg,var(--sf1),#241f35)}
.m-tabs .hd{display:flex; gap:0; background:rgba(20,16,32,.45); border-bottom:0.0625rem solid rgba(167,139,250,.25)}
.m-tabs .hd button{flex:1; padding:0.875rem 0.625rem; border:0; border-right:0.0625rem solid rgba(167,139,250,.16); background:none; color:#bcb3d0; font-size:0.96875rem; cursor:pointer; transition:background .25s,color .25s; letter-spacing:.06em}
.m-tabs .hd button:last-child{border-right:0}
.m-tabs .hd button.on{background-image:linear-gradient(90deg,rgba(249,168,212,.2),rgba(167,139,250,.2)); color:#fff; font-weight:700; box-shadow:inset 0 -0.25rem 0 var(--sak)}
.m-tabs .pane{display:none; padding:1.3125rem 1.4375rem; font-size:1.0625rem; line-height:1.875rem; color:#eee8f8}
.m-tabs .pane.on{display:block; animation:mfade .35s}
.m-rail{display:flex; gap:0.75rem; overflow-x:auto; padding:0.25rem 0.125rem 0.875rem; margin:1.375rem 0; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch}
.m-rail .c{flex:0 0 12.5rem; scroll-snap-align:start; border-radius:0.625rem; overflow:hidden; background:var(--bg2); border:0.0625rem solid #33303e}
.m-rail .c img{width:100%; height:16.25rem; object-fit:cover; display:block; border-radius:0; margin:0; border:0}
.m-rail .c .t{padding:0.75rem 0.875rem; font-size:0.96875rem; color:#eae4f2; line-height:1.375rem}
.m-rail .c .t em{display:block; font-style:normal; font-size:0.8125rem; color:var(--gold); letter-spacing:.1em}
.m-railhint{font-size:0.8125rem; color:var(--dim); text-align:center; margin:-0.375rem 0 0}
.m-cta{margin:1.625rem 0; padding:1.75rem 1.5rem; border-radius:1.125rem; text-align:center; background:linear-gradient(135deg,rgba(253,186,116,.22),rgba(249,168,212,.22) 45%,rgba(167,139,250,.24)); border:0.0625rem solid rgba(254,243,199,.32)}
.m-cta p{margin:0.25rem 0; font-size:1.0625rem; line-height:1.8125rem; color:#eae4f2}
.m-cta b{color:#fff; font-size:1.1875rem; letter-spacing:.04em}
.m-btn{display:inline-block; margin-top:0.875rem; padding:0.59375rem 1.875rem; border-radius:61.875rem; background:linear-gradient(90deg,#b94173,#a3316f 55%,#8150c1); color:#fff; font-size:1rem; font-weight:700; text-decoration:none; letter-spacing:.08em}
.m-btn.ghost{background:#34852e40; border:0; color:#fff}
.m-divider{display:flex; flex-wrap:wrap; align-items:center; gap:0.625rem 1rem; margin:2.5rem 0}
.m-divider:before,.m-divider:after{content:""; flex:1; height:0.0625rem; background:linear-gradient(90deg,transparent,rgba(152,123,177,.55),transparent)}
.m-divider span{display:inline-flex; align-items:center; gap:0.5rem; font-size:0.84375rem; letter-spacing:.3em; color:#c9b6e8; white-space:normal; text-align:center; justify-content:center; max-width:100%}
.m-divider i{font-style:normal; color:var(--gold); font-size:0.9375rem; text-shadow:0 0 0.75rem rgba(255,217,160,.6)}
.m-copybtn{padding:0.375rem 1rem; border-radius:61.875rem; border:0.0625rem solid var(--vio); background:none; color:#dcd0ef; font-size:0.875rem; cursor:pointer}
.m-copybtn.ok{border-color:var(--gr); color:var(--gr)}
/* ===== K 交互件样式：进度条 / 弹幕 / 灯箱 / 环形返回顶部 / 渐入 ===== */
.m-prog{position:fixed; left:0; top:0; height:0.25rem; width:0; background:linear-gradient(90deg,var(--cy),var(--gold),var(--pk)); z-index:1005}
.m-dan{position:relative; height:var(--dh,13.75rem); overflow:hidden; border-radius:0.875rem; background:linear-gradient(160deg,#2b2440,#1d1830); border:0.0625rem solid var(--line); transition:height .42s cubic-bezier(.4,0,.2,1),border-color .3s}
.m-dan.paused span{animation-play-state:paused; opacity:.3}
.m-dan.mini{height:2.625rem; border-style:dashed; border-color:#4b4160}
.m-dan.mini span{animation-play-state:paused; opacity:0}
.m-dan.mini:after{content:"弹幕已关，世界清净了 · 想听真话就点开"; position:absolute; left:1rem; top:50%; transform:translateY(-50%); font-size:0.875rem; color:#8f86a8; letter-spacing:.05em; white-space:nowrap}
.m-danbtn.off{border-color:#ff9a4d; color:#ff9a4d}
.m-dan span{position:absolute; left:100%; top:0; white-space:nowrap; font-weight:700; text-shadow:0 0 0.125rem rgba(0,0,0,.95),0 0.0625rem 0.375rem rgba(0,0,0,.85); will-change:transform; transition:opacity .25s; animation:mrun linear infinite}
.m-dan span.hot{background:rgba(255,217,160,.16); border:0.0625rem solid rgba(255,217,160,.4); border-radius:61.875rem; padding:0.0625rem 0.75rem}
.m-dan span:hover{animation-play-state:paused}
.m-danbtn{display:block; margin:0.875rem auto 0; padding:0.46875rem 1.375rem; border-radius:61.875rem; border:0.0625rem solid var(--mint); background:rgba(110,231,183,.08); color:var(--mint); font-size:0.9375rem; cursor:pointer; letter-spacing:.06em}
.js .m-reveal{opacity:0; transform:translateY(1.5rem); transition:opacity .7s,transform .7s}
.js .m-reveal.in{opacity:1; transform:none}
.m-lb{position:fixed; inset:0; background:rgba(8,6,12,.95); display:none; align-items:center; justify-content:center; z-index:1005; padding:1.25rem}
.m-lb.on{display:flex}
.m-lb img{max-width:100%; max-height:86vh; border-radius:0}
.m-lb .x{position:absolute; top:1rem; right:1.25rem; font-size:2.25rem; color:#fff; cursor:pointer; line-height:1}
.m-lb .n{position:absolute; bottom:1.125rem; left:0; right:0; text-align:center; color:var(--dim); font-size:0.875rem}
.m-lb .pv,.m-lb .nx{position:absolute; top:50%; transform:translateY(-50%); font-size:1.875rem; color:#fff; cursor:pointer; padding:0.875rem; user-select:none}
.m-lb .pv{left:0.375rem}
.m-lb .nx{right:0.375rem}
/* ===== L 容器现代化：原浮动说明块改 flex ===== */
.s_div_yin1 p,.s_div_yin2 p,.s_div_yin3 p,.s_div_yin4 p{margin:0; font-size:1.3125rem; line-height:2.125rem}
.s_div_yin2 p,.s_div_yin4 p{padding-bottom:0.875rem}
.s_ddtbox{display:flex; flex-wrap:wrap; gap:0.25rem 1rem; padding:1.125rem 1.25rem; border:0.1875rem solid #999; border-radius:1.25rem; margin-bottom:1.5625rem}
.s_ddtbox .s_ddt{display:contents}
.s_ddtbox .ddt_l{flex:0 0 auto; float:none; padding:0; min-width:7.5rem}
.s_ddtbox .ddt_c{flex:1 1 13.75rem; float:none; padding:0}
.s_ddtbox .ddt_c b{font-size:1.125rem; color:#7de0a4}
.s_ddtbox .ddt_c p{font-size:0.9375rem; line-height:1.625rem; color:#b9b2c8; margin:0.1875rem 0 0}
.s_ddtbox .ddt_r{flex:0 0 auto; margin-left:auto; align-self:flex-start; font-size:0.9375rem; color:#b9b2c8}
.s_ddtbox .ddt_ct{flex:1 1 100%; float:none; position:static; padding:0.625rem 0 0; margin-top:0.625rem; border-top:0.0625rem dashed #5a5266}
.s_ddtbox .ddt_ct p{margin:0; font-size:0.96875rem; line-height:1.625rem; color:#cfc8da}
.s_ddtbox i{display:none}
.s_ddtbox .ddt_l b{font-size:1.1875rem; color:#fff}
/* ===== 样式库页专用（只有 249 会用到，其他页面无额外开销） ===== */
.m-sec{margin:4rem 0 1.625rem; padding:0 0 0.75rem; border-bottom:0.0625rem solid var(--ln); scroll-margin-top:8.75rem}
.m-sec h2{font-size:1.625rem; color:#fff; margin:0}
.m-demo{margin:0 0 1.875rem; padding:1.375rem 1.375rem 0.625rem; border:0.0625rem dashed #4a4356; border-radius:var(--r)}
.m-demo>.m-hd{display:flex; justify-content:space-between; gap:0.625rem; margin:0 0 0.875rem; font-size:0.875rem; color:var(--dim)}
.m-demo>.m-hd b{color:#d8d2e6}
.m-unit{margin:0 0 1.625rem; padding-bottom:0.25rem}
.m-unit>.m-t{font-size:0.875rem; color:var(--cy); letter-spacing:.04em; margin:0 0 0.75rem; font-weight:700}
.m-unit>.m-t span{color:var(--dim); font-weight:400}
.m-tip{font-size:0.9375rem; color:var(--dim); line-height:1.6875rem; margin:0 0 1.125rem}
.m-tip b{color:var(--gold)}
.m-code{margin:0.625rem 0 0; padding-top:0.4375rem; border-top:0.0625rem solid #2b2636}
.m-code summary{cursor:pointer; font-size:0.78125rem; color:#6f6883; letter-spacing:.12em; list-style:none}
.m-code summary:before{content:"▸ "; color:var(--vio)}
.m-code[open] summary:before{content:"▾ "}
.m-code xmp{font-size:0.71875rem; line-height:1.15625rem; background:#0c0a10; border:0.0625rem solid #26212f; border-radius:0.4375rem; padding:0.6875rem 0.8125rem; color:#c6d4b6; max-height:16.25rem; overflow:auto; white-space:pre-wrap; word-break:break-all; margin:0.4375rem 0 0.25rem}
.m-pair{display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-items:start}
.m-pair>div{border:0.0625rem solid #333; border-radius:0.625rem; padding:0.75rem}
.m-pair .lab{font-size:0.8125rem; color:var(--rd); letter-spacing:.1em; margin:0 0 0.625rem}
.m-pair .lab.good{color:var(--gr)}
.m-js{display:none}
/* ===== 动效关键帧 ===== */
@keyframes mfade{from{opacity:0;transform:translateY(0.5rem)}to{opacity:1}}
@keyframes mrun{from{transform:translateX(0)}to{transform:translateX(calc(-100% - var(--pw,43.75rem)))}}
@media (max-width:768px){
.m-cta{padding:1.375rem 0.875rem}
.m-cta b{font-size:1.09375rem}
.m-btn{padding:0.53125rem 1.375rem;font-size:0.9375rem}
.m-fold summary{padding:0.8125rem 0.9375rem;font-size:1rem}
.m-fold summary:after{right:0.6875rem;top:0.75rem;width:1.8125rem;height:1.8125rem;font-size:1.25rem}
.m-fold .m-body{padding:0.3125rem 0.9375rem 0.9375rem}
.m-tabs .hd button{padding:0.71875rem 0.3125rem;font-size:0.90625rem;letter-spacing:0}
.m-tabs .pane{padding:1.0625rem 0.875rem;font-size:1rem;line-height:1.75rem}
.m-dan{height:min(var(--dh,13.75rem),10.625rem)}
.m-dan.mini{height:2.25rem}
.m-dan.mini:after{font-size:0.78125rem;left:0.75rem}
.m-rail .c{flex:0 0 62vw}
.m-pz{grid-template-columns:repeat(auto-fit,minmax(5.625rem,1fr))}
.m-quote.line p{font-size:1rem;line-height:1.6875rem;padding-left:0.75rem}
.m-quote.star .m-hd2{gap:0.5625rem}
.m-quote.star .m-hd2 img{width:2.75rem;height:2.75rem}
.m-cmp .tagl,.m-cmp .tagr{font-size:0.71875rem;padding:0.09375rem 0.4375rem}
.m-split .bar{height:1.875rem;font-size:0.8125rem}
.m-stat b{font-size:1.875rem}
.m-rankline{flex-wrap:wrap;gap:0.375rem 0.625rem;padding:0.5625rem 0.6875rem}
.m-rankline .sc{margin-left:0;flex-basis:100%}
.s_tt p.pic>span{max-width:12.5rem}
.m-quote.star .m-act{gap:0.625rem;font-size:0.75rem}
.m-pair{grid-template-columns:1fr}
.m-demo{padding:1rem 0.75rem 0.5rem}
.m-vs .row{grid-template-columns:4.125rem minmax(0,1fr) 4.125rem;font-size:0.84375rem}
.m-shot{grid-template-columns:1fr 1fr}
.m-shot figure:first-child{grid-column:span 2;grid-row:auto}
.m-shot figure:first-child img{height:auto;object-fit:contain}
.m-shot figure:not(:first-child) img{height:auto}
.m-strip img{height:6.25rem}
.m-pz{grid-template-columns:1fr 1fr}
.m-grid{grid-template-columns:1fr}
.m-shot,.m-tri,.m-quad{--gap:0.25rem}
.s_tt p.s_tt_l span,.s_tt p.s_tt_r span{text-align:left;line-height:1.8125rem}
.m-quote.star{padding:1.125rem 1rem 0.75rem}
.m-ctl{right:0.5rem;bottom:0.5rem;padding:0.4375rem 0.625rem;font-size:0.78125rem;gap:0.4375rem}
.m-danbtn{margin:0.6875rem auto 0;font-size:0.875rem}
.m-quote.big p{font-size:1.5rem;line-height:2.25rem}
}
.m-code{position:relative}
.m-code .m-cp{position:absolute;right:0.75rem;top:0.375rem;background:none;border:0.0625rem solid #3a3543;color:#8f86a8}
.m-code .m-cp.ok{border-color:#4ade80;color:#4ade80}
/* 移动端兜底v14 */
@media (max-width:640px){
.m-divider{margin:2rem 0}
.m-divider span{letter-spacing:.14em; font-size:0.75rem}
.cj_ar_content .predh{padding:0.6875rem 0.625rem 0.625rem}
.predh li{padding:0.4375rem 0.53125rem; font-size:0.8125rem}
.s_tag span{margin:0.15625rem 0.1875rem; padding:0.125rem 0.5625rem; font-size:0.84375rem}
}
/* ===== 榜单名次徽章（金/银/铜/常位，2874/2871 新版式） ===== */
.s_h2b .rk{display:inline-flex; align-items:center; justify-content:center; width:1.75rem; height:1.75rem; margin-right:0.5625rem; border-radius:0.4375rem; font-style:normal; font-weight:800; font-size:1.0625rem; vertical-align:middle; transform:translateY(-0.1875rem)}
.s_h2b .rk-g{background:linear-gradient(135deg,#ffe9a6,#e8b04b); color:#241b06; box-shadow:0 0.1875rem 0.5625rem rgba(232,176,75,.5)}
.s_h2b .rk-s{background:linear-gradient(135deg,#f4f8ff,#b9c6d8); color:#1c2432; box-shadow:0 0.1875rem 0.5625rem rgba(185,198,216,.4)}
.s_h2b .rk-b{background:linear-gradient(135deg,#f6d3b0,#c98a53); color:#2b1a09; box-shadow:0 0.1875rem 0.5625rem rgba(201,138,83,.4)}
.s_h2b .rk-p{background:linear-gradient(135deg,#667186,#454f63); color:#eef1f7}
/* ===== 考据卡变体：金边「原作党才知道」 ===== */
.m-note.lore{background:linear-gradient(90deg,rgba(255,214,102,.18),rgba(43,36,64,.92)); border-left-color:#e8b04b}
.m-note.lore>i{color:#f0d089}
.m-note.lore p b{color:#f0d089}
/* ===== 聊天头像库 .av-lib（249 第 2 页专用 · 2026-10-20 新增）=====
用途：把 /uploads/ar-img/ 下的聊天头像全部摊开、标出 data-av 值，写稿时直接抄。
写法：标题说明
chf6雨夜站台背影…