:root{--bg:#0f1419;--card:#16181c;--line:#232a35;--text:#e7e9ea;--muted:#71767b;--primary:#1d9bf0;--primary-h:#1a8cd8;--success:#00ba7c;--danger:#f4212e;--warn:#ffd400}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;min-height:100vh}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
.layout{display:flex;max-width:1280px;margin:0 auto;min-height:100vh}
.sidebar{width:250px;padding:16px;border-right:1px solid var(--line);position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:4px;overflow-y:auto}
.sidebar .brand{font-size:1.3rem;font-weight:800;padding:12px;color:var(--text);display:flex;align-items:center;gap:8px;margin-bottom:12px}
.sidebar .brand:hover{text-decoration:none}
.sidebar nav a{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:999px;color:var(--text);font-size:1rem;transition:background .15s}
.sidebar nav a:hover{background:rgba(255,255,255,.06);text-decoration:none}
.sidebar nav a.active{font-weight:700;background:rgba(29,155,240,.1)}
.sidebar nav a i{font-size:1.25rem;width:24px}
.btn-new{margin:16px 0;padding:14px;border:none;border-radius:999px;background:var(--primary);color:#fff;font-weight:700;font-size:1rem;cursor:pointer;transition:background .2s;text-align:center}
.btn-new:hover{background:var(--primary-h);text-decoration:none}
.sidebar .me{margin-top:auto;padding:12px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px}
.main{flex:1;max-width:640px;border-right:1px solid var(--line);min-height:100vh;background:var(--bg)}
.topbar{position:sticky;top:0;z-index:10;backdrop-filter:blur(12px);background:rgba(15,20,25,.85);border-bottom:1px solid var(--line);padding:16px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.topbar h2{margin:0;font-size:1.2rem;font-weight:700}
.tabs{display:flex;border-bottom:1px solid var(--line);overflow-x:auto}
.tab{padding:16px 20px;color:var(--muted);font-weight:500;white-space:nowrap;border-bottom:3px solid transparent;font-size:0.92rem}
.tab:hover{background:rgba(255,255,255,.04);text-decoration:none;color:var(--text)}
.tab.active{color:var(--text);border-bottom-color:var(--primary);font-weight:700}
.post{padding:16px 20px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .15s;display:block;color:inherit}
.post:hover{background:rgba(255,255,255,.03);text-decoration:none}
.post-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:0.9rem;margin-bottom:6px;color:var(--muted)}
.post-head .username{color:var(--text);font-weight:600}
.post-title{font-size:1.08rem;font-weight:700;margin:4px 0 6px;color:var(--text);line-height:1.4}
.post-excerpt{color:var(--muted);font-size:0.9rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.post-foot{display:flex;gap:20px;margin-top:10px;color:var(--muted);font-size:0.85rem}
.post-foot span{display:flex;align-items:center;gap:5px}
.post .badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:4px;font-size:0.72rem;font-weight:600;margin-right:6px}
.b-pin{background:rgba(29,155,240,.12);color:var(--primary)}
.b-feat{background:rgba(255,212,0,.12);color:var(--warn)}
.b-cat{background:rgba(29,155,240,.1);color:var(--primary)}
.post-detail{padding:24px 20px}
.post-detail h1{margin:0 0 16px;font-size:1.6rem;line-height:1.3}
.post-author{display:flex;gap:12px;align-items:center;margin-bottom:20px}
.avatar{width:44px;height:44px;border-radius:50%;background:var(--card);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--primary);flex-shrink:0;overflow:hidden;font-size:1.1rem}
.avatar img{width:100%;height:100%;object-fit:cover}
.avatar.sm{width:36px;height:36px;font-size:0.9rem}
.avatar.lg{width:96px;height:96px;font-size:2rem}
.post-body{line-height:1.8;font-size:1rem;white-space:pre-wrap;word-break:break-word;margin:20px 0}
.post-media{max-width:100%;border-radius:12px;margin:16px 0;border:1px solid var(--line);display:block}
.post-actions{display:flex;gap:24px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--muted);font-size:0.9rem}
.post-actions button{background:none;border:none;color:inherit;cursor:pointer;display:flex;align-items:center;gap:6px;font-size:0.9rem;padding:6px 10px;border-radius:999px;transition:all .2s}
.post-actions button:hover{background:rgba(29,155,240,.1);color:var(--primary)}
.post-actions button.active{color:var(--primary);font-weight:700}
.post-actions button.dislike.active{color:var(--danger)}
.comment-form{padding:16px;background:var(--card);border-radius:12px;margin-top:20px}
.comment-form textarea,.form-input{width:100%;background:transparent;border:1px solid var(--line);border-radius:10px;padding:12px 14px;color:var(--text);font-size:0.95rem;font-family:inherit;outline:none;transition:border-color .15s}
.comment-form textarea:focus,.form-input:focus{border-color:var(--primary)}
.form-group{margin-bottom:18px}
.form-group label{display:block;margin-bottom:6px;color:var(--muted);font-size:0.88rem;font-weight:500}
.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;border-radius:999px;font-weight:600;border:none;cursor:pointer;font-size:0.95rem;transition:all .2s;text-decoration:none}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-h)}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--line)}
.btn-ghost:hover{background:rgba(255,255,255,.06)}
.btn-danger{background:var(--danger);color:#fff}
.btn-sm{padding:6px 14px;font-size:0.85rem}
.right{width:340px;padding:16px 24px;position:sticky;top:0;height:100vh;overflow-y:auto}
.card{background:var(--card);border-radius:16px;padding:16px;margin-bottom:16px;border:1px solid var(--line)}
.card h3{margin:0 0 12px;font-size:1.05rem;font-weight:800}
.card .row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:0.9rem}
.card .row .lbl{color:var(--muted)}
.card .row .val{font-weight:600}
.alert{padding:12px 16px;border-radius:10px;margin:12px 16px;font-size:0.92rem}
.alert-success{background:rgba(0,186,124,.12);color:var(--success);border:1px solid rgba(0,186,124,.3)}
.alert-danger{background:rgba(244,33,46,.12);color:var(--danger);border:1px solid rgba(244,33,46,.3)}
.alert-warning{background:rgba(255,212,0,.12);color:var(--warn);border:1px solid rgba(255,212,0,.3)}
.alert-info{background:rgba(29,155,240,.12);color:var(--primary);border:1px solid rgba(29,155,240,.3)}
.badge-v{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;color:#fff;font-size:11px;flex-shrink:0;font-weight:700;vertical-align:middle}
.v-red{background:linear-gradient(135deg,#ff4d4f,#d9363e);box-shadow:0 0 8px rgba(255,77,79,.5)}
.v-blue{background:linear-gradient(135deg,#4dabf7,#1971c2);box-shadow:0 0 8px rgba(77,171,247,.5)}
.v-yellow{background:linear-gradient(135deg,#ffd43b,#f59f00);box-shadow:0 0 8px rgba(255,212,59,.5)}
.role-tag{display:inline-flex;align-items:center;padding:2px 8px;border-radius:4px;font-size:0.7rem;font-weight:700}
.role-admin{background:linear-gradient(135deg,#ff6b6b,#c92a2a);color:#fff}
.role-mod{background:linear-gradient(135deg,#845ef7,#5f3dc4);color:#fff}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--danger);margin-left:6px}
.p-banner{height:160px;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);position:relative}
.p-avatar{position:absolute;bottom:-48px;left:20px;width:96px;height:96px;border-radius:50%;border:4px solid var(--bg);background:var(--card);display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:700;color:var(--primary);overflow:hidden}
.p-avatar img{width:100%;height:100%;object-fit:cover}
.p-info{padding:60px 20px 16px;border-bottom:1px solid var(--line)}
.media-preview{margin-top:12px;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.media-preview img,.media-preview video{display:block;max-width:100%;height:auto}
.empty{text-align:center;padding:60px 20px;color:var(--muted)}
@media(max-width:1024px){.right{display:none}}
@media(max-width:768px){.sidebar{width:72px}.sidebar .nav-text{display:none}.sidebar nav a{justify-content:center}.btn-new span{display:none}.main{max-width:100%}}
/* 封面 */
.p-banner{background-image:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);background-size:cover;background-position:center}
/* ===== 下拉选择框美化 ===== */
select {
background-color: #16181c !important;
color: #e7e9ea !important;
border: 1px solid #232a35 !important;
border-radius: 10px;
padding: 12px 14px;
font-size: 0.95rem;
outline: none;
cursor: pointer;
width: 100%;
}
select:hover { border-color: rgba(29,155,240,.5) !important; }
select:focus { border-color: #1d9bf0 !important; box-shadow: 0 0 0 3px rgba(29,155,240,.15); }
select option {
background-color: #16181c;
color: #e7e9ea;
}
/* ===== 认证徽章 v2.4 — 精致美化 ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:18px !important;
height:18px !important;
border-radius:50% !important;
color:#fff !important;
font-size:11px !important;
font-weight:800 !important;
vertical-align:middle;
position:relative;
flex-shrink:0;
transition:transform .2s, box-shadow .2s;
text-shadow:0 1px 2px rgba(0,0,0,.3);
}
.badge-v:hover{transform:scale(1.15);}
/* 红V — 个人认证（玫瑰金渐变） */
.v-red{
background:radial-gradient(circle at 30% 30%, #ff8787, #ef4444 40%, #b91c1c 100%) !important;
box-shadow:
0 0 0 1px rgba(255,255,255,.2) inset,
0 2px 8px rgba(239,68,68,.6),
0 0 12px rgba(239,68,68,.35) !important;
}
.v-red::after{
content:"";position:absolute;inset:2px;border-radius:50%;
background:linear-gradient(135deg,rgba(255,255,255,.4),transparent 60%);
pointer-events:none;
}
/* 蓝V — 企业认证（深海蓝钻石渐变） */
.v-blue{
background:radial-gradient(circle at 30% 30%, #93c5fd, #3b82f6 40%, #1e40af 100%) !important;
box-shadow:
0 0 0 1px rgba(255,255,255,.2) inset,
0 2px 8px rgba(59,130,246,.6),
0 0 12px rgba(59,130,246,.35) !important;
}
.v-blue::after{
content:"";position:absolute;inset:2px;border-radius:50%;
background:linear-gradient(135deg,rgba(255,255,255,.4),transparent 60%);
pointer-events:none;
}
/* 黄V — 官方认证（黄金渐变） */
.v-yellow{
background:radial-gradient(circle at 30% 30%, #fde68a, #f59e0b 40%, #b45309 100%) !important;
color:#000 !important;
box-shadow:
0 0 0 1px rgba(255,255,255,.3) inset,
0 2px 8px rgba(245,158,11,.6),
0 0 14px rgba(245,158,11,.45) !important;
}
.v-yellow::after{
content:"";position:absolute;inset:2px;border-radius:50%;
background:linear-gradient(135deg,rgba(255,255,255,.6),transparent 60%);
pointer-events:none;
}
/* 大号徽章（个人主页用） */
.badge-v.lg{
width:22px !important;
height:22px !important;
font-size:13px !important;
}
/* 认证说明标签（重做） */
.v-label{
display:inline-flex !important;
align-items:center;
gap:4px;
padding:2px 10px !important;
border-radius:8px !important;
font-size:0.72rem !important;
font-weight:700 !important;
letter-spacing:0.02em;
vertical-align:middle;
border:1px solid transparent;
position:relative;
overflow:hidden;
}
.v-label::before{
content:"";position:absolute;left:0;top:0;height:100%;width:3px;
background:currentColor;opacity:.9;
}
.v-label.red{
background:linear-gradient(90deg,rgba(239,68,68,.18),rgba(239,68,68,.05)) !important;
color:#ff9c9c !important;
border-color:rgba(239,68,68,.35) !important;
}
.v-label.blue{
background:linear-gradient(90deg,rgba(59,130,246,.18),rgba(59,130,246,.05)) !important;
color:#93c5fd !important;
border-color:rgba(59,130,246,.35) !important;
}
.v-label.yellow{
background:linear-gradient(90deg,rgba(245,158,11,.18),rgba(245,158,11,.05)) !important;
color:#fcd34d !important;
border-color:rgba(245,158,11,.35) !important;
}
/* ===== v2.5 认证 V 徽章 — QQ 风格 ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:18px !important;
height:18px !important;
border-radius:50% !important;
font-size:0 !important;
vertical-align:middle;
position:relative;
flex-shrink:0;
transition:transform .2s;
color:#fff;
text-shadow:0 1px 2px rgba(0,0,0,.4);
}
.badge-v::before{
content:'V';
font-size:12px;
line-height:1;
font-family:Georgia, "Times New Roman", "Songti SC", serif;
font-style:italic;
font-weight:900;
transform:scaleX(1.15);
display:block;
}
.badge-v:hover{ transform:scale(1.15); }
.badge-v.lg{
width:24px !important;
height:24px !important;
}
.badge-v.lg::before{ font-size:16px; }
/* 红 V — 个人认证 */
.v-red{
background:radial-gradient(circle at 30% 25%, #ff9d9d 0%, #ef4444 45%, #991b1b 100%) !important;
box-shadow:
inset 0 -2px 4px rgba(0,0,0,.3),
inset 0 2px 3px rgba(255,255,255,.45),
0 2px 8px rgba(239,68,68,.6),
0 0 10px rgba(239,68,68,.35) !important;
}
/* 蓝 V — 企业认证 */
.v-blue{
background:radial-gradient(circle at 30% 25%, #93c5fd 0%, #3b82f6 45%, #1e40af 100%) !important;
box-shadow:
inset 0 -2px 4px rgba(0,0,0,.3),
inset 0 2px 3px rgba(255,255,255,.45),
0 2px 8px rgba(59,130,246,.65),
0 0 10px rgba(59,130,246,.4) !important;
}
/* 黄 V — 官方认证 */
.v-yellow{
background:radial-gradient(circle at 30% 25%, #fef08a 0%, #f59e0b 45%, #92400e 100%) !important;
color:#3d2400 !important;
text-shadow:0 1px 1px rgba(255,255,255,.35) !important;
box-shadow:
inset 0 -2px 4px rgba(0,0,0,.25),
inset 0 2px 3px rgba(255,255,255,.65),
0 2px 8px rgba(245,158,11,.7),
0 0 12px rgba(245,158,11,.5) !important;
}
/* ===== v2.5 通知数字气泡 ===== */
.notif-badge{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:18px;
height:18px;
padding:0 6px;
margin-left:6px;
border-radius:10px;
background:linear-gradient(135deg,#ef4444,#dc2626);
color:#fff !important;
font-size:0.7rem !important;
font-weight:800 !important;
line-height:1;
letter-spacing:0 !important;
box-shadow:
0 0 0 2px rgba(15,20,25,.9),
0 2px 6px rgba(239,68,68,.5);
animation:notifPulse 2s ease-in-out infinite;
text-shadow:0 1px 1px rgba(0,0,0,.3);
}
@keyframes notifPulse{
0%,100%{ transform:scale(1); }
50%{
transform:scale(1.1);
box-shadow:
0 0 0 2px rgba(15,20,25,.9),
0 4px 12px rgba(239,68,68,.75);
}
}
/* ===== v2.6 认证 V 徽章 — 六边形星形盾 ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:20px !important;
height:20px !important;
flex-shrink:0;
vertical-align:middle;
position:relative;
font-size:0 !important;
transition:transform .2s;
border:none !important;
background:transparent !important;
box-shadow:none !important;
border-radius:0 !important;
}
.badge-v:hover{ transform:scale(1.18); }
/* 六边形本体 */
.badge-v::before{
content:'';
position:absolute;
inset:0;
clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
background: var(--badge-grad, #888);
filter: drop-shadow(0 2px 5px var(--badge-glow, rgba(0,0,0,.4)));
}
/* 内部白色对勾 */
.badge-v::after{
content:'✓';
position:relative;
z-index:1;
color:#fff;
font-size:11px !important;
font-weight:900;
line-height:1;
text-shadow: 0 1px 2px rgba(0,0,0,.4);
font-family: Arial, sans-serif;
}
/* 大尺寸版本（个人主页） */
.badge-v.lg{
width:28px !important;
height:28px !important;
}
.badge-v.lg::after{
font-size:17px !important;
}
/* 红 V — 个人认证 */
.v-red{
--badge-grad: linear-gradient(135deg, #ff8a8a 0%, #ef4444 45%, #b91c1c 100%);
--badge-glow: rgba(239,68,68,.7);
}
/* 蓝 V — 企业认证 */
.v-blue{
--badge-grad: linear-gradient(135deg, #7dd3fc 0%, #3b82f6 45%, #1e40af 100%);
--badge-glow: rgba(59,130,246,.75);
}
/* 黄 V — 官方认证 */
.v-yellow{
--badge-grad: linear-gradient(135deg, #fef08a 0%, #f59e0b 45%, #92400e 100%);
--badge-glow: rgba(245,158,11,.8);
}
.v-yellow::after{
color:#3d2400 !important;
text-shadow: 0 1px 1px rgba(255,255,255,.4) !important;
}
/* ===== v2.7 认证 V 徽章 — 盾牌形状 ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:20px !important;
height:22px !important;
flex-shrink:0;
vertical-align:middle;
position:relative;
font-size:0 !important;
transition:transform .2s;
border:none !important;
background:transparent !important;
box-shadow:none !important;
border-radius:0 !important;
}
.badge-v:hover{ transform:scale(1.18); }
/* 盾牌本体：顶部略圆，两侧垂直，底部尖角 */
.badge-v::before{
content:'';
position:absolute;
inset:0;
clip-path: polygon(
50% 0%,
100% 10%,
100% 65%,
50% 100%,
0% 65%,
0% 10%
);
background: var(--badge-grad, #888);
filter: drop-shadow(0 2px 5px var(--badge-glow, rgba(0,0,0,.4)));
}
/* 盾牌顶部高光条 */
.badge-v > i{
display:none;
}
/* 内部白色对勾 */
.badge-v::after{
content:'✓';
position:relative;
z-index:1;
color:#fff;
font-size:11px !important;
font-weight:900;
line-height:1;
text-shadow: 0 1px 2px rgba(0,0,0,.4);
font-family: Arial, sans-serif;
transform: translateY(-1px);
}
/* 大尺寸版本（个人主页） */
.badge-v.lg{
width:30px !important;
height:33px !important;
}
.badge-v.lg::after{
font-size:18px !important;
}
/* 红 V — 个人认证 */
.v-red{
--badge-grad: linear-gradient(160deg, #ff9a9a 0%, #ef4444 40%, #991b1b 100%);
--badge-glow: rgba(239,68,68,.7);
}
/* 蓝 V — 企业认证 */
.v-blue{
--badge-grad: linear-gradient(160deg, #93c5fd 0%, #3b82f6 40%, #1e3a8a 100%);
--badge-glow: rgba(59,130,246,.75);
}
/* 黄 V — 官方认证 */
.v-yellow{
--badge-grad: linear-gradient(160deg, #fef08a 0%, #f59e0b 40%, #78350f 100%);
--badge-glow: rgba(245,158,11,.8);
}
.v-yellow::after{
color:#3d2400 !important;
text-shadow: 0 1px 1px rgba(255,255,255,.5) !important;
}
/* ===== v2.8 认证徽章 — 简洁精致圆勾 ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:18px !important;
height:18px !important;
border-radius:50% !important;
flex-shrink:0;
vertical-align:middle;
position:relative;
font-size:0 !important;
transition: transform .2s, box-shadow .2s;
border:none !important;
background:transparent !important;
box-shadow:none !important;
}
.badge-v:hover{ transform: scale(1.15); }
/* 勾勾符号 */
.badge-v::after{
content:''; position:absolute;
width:5px; height:9px;
border:solid #fff;
border-width:0 2px 2px 0;
transform: rotate(45deg) translate(-1px, -1px);
z-index:2;
filter: drop-shadow(0 1px 1px rgba(0,0,0,.25));
}
/* 圆形底 + 立体感 */
.badge-v::before{
content:''; position:absolute; inset:0;
border-radius:50%;
background: var(--g);
box-shadow:
inset 0 -2px 3px rgba(0,0,0,.25),
inset 0 2px 3px rgba(255,255,255,.45),
0 2px 6px var(--glow),
0 0 10px var(--glow);
}
/* 大号（个人主页） */
.badge-v.lg{
width:26px !important;
height:26px !important;
}
.badge-v.lg::after{
width:7px; height:13px;
border-width:0 3px 3px 0;
transform: rotate(45deg) translate(-1px, -2px);
}
/* 红 V */
.v-red{
--g: linear-gradient(140deg, #ff8a8a 0%, #ef4444 45%, #b91c1c 100%);
--glow: rgba(239,68,68,.55);
}
/* 蓝 V */
.v-blue{
--g: linear-gradient(140deg, #7dd3fc 0%, #3b82f6 45%, #1e40af 100%);
--glow: rgba(59,130,246,.6);
}
/* 黄 V */
.v-yellow{
--g: linear-gradient(140deg, #fde68a 0%, #f59e0b 45%, #b45309 100%);
--glow: rgba(245,158,11,.65);
}
/* ===== v2.9 认证徽章 — Bootstrap patch-check-fill ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:20px !important;
height:20px !important;
flex-shrink:0;
vertical-align:middle;
position:relative;
font-size:16px !important;
line-height:1;
transition:transform .18s;
border:none !important;
background:transparent !important;
box-shadow:none !important;
}
.badge-v:hover{ transform: scale(1.15); }
/* 用 ::before 渲染 bi-patch-check-fill 图标 */
.badge-v::before{
content:''; position:absolute; inset:0;
-webkit-mask: url("data:image/svg+xml;utf8,") no-repeat center / contain;
mask: url("data:image/svg+xml;utf8,") no-repeat center / contain;
background: var(--c, #888);
filter: drop-shadow(0 1px 3px var(--glow, rgba(0,0,0,.4)));
}
/* 大号（个人主页） */
.badge-v.lg{
width:28px !important;
height:28px !important;
font-size:22px !important;
}
.badge-v.lg::before{
filter: drop-shadow(0 2px 5px var(--glow, rgba(0,0,0,.5)));
}
/* 红 V */
.v-red{
--c: linear-gradient(140deg, #ff8a8a 0%, #ef4444 50%, #b91c1c 100%);
--glow: rgba(239,68,68,.6);
}
/* 蓝 V */
.v-blue{
--c: linear-gradient(140deg, #7dd3fc 0%, #3b82f6 50%, #1e40af 100%);
--glow: rgba(59,130,246,.65);
}
/* 黄 V */
.v-yellow{
--c: linear-gradient(140deg, #fde68a 0%, #f59e0b 50%, #b45309 100%);
--glow: rgba(245,158,11,.7);
}
/* ===== 自定义角色：跟 mod 标签统一风格 ===== */
.role-tag.role-custom,
.role-custom{
display:inline-flex !important;
align-items:center;
gap:4px;
padding:2px 8px !important;
border-radius:4px !important;
font-size:0.7rem !important;
font-weight:700 !important;
letter-spacing:.03em;
line-height:1.3;
border:1px solid rgba(255,255,255,.08);
}
.role-custom i{
font-size:0.85em;
line-height:1;
}
/* ===== v3.0 认证徽章 — patch 形状 + V ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:20px !important;
height:20px !important;
flex-shrink:0;
vertical-align:middle;
position:relative;
transition:transform .18s;
border:none !important;
background:transparent !important;
box-shadow:none !important;
}
.badge-v:hover{ transform:scale(1.15); }
/* patch 外形（Bootstrap patch-check-fill 去掉内部勾的轮廓） */
.badge-v::before{
content:''; position:absolute; inset:0;
-webkit-mask: url("data:image/svg+xml;utf8,") no-repeat center / contain;
mask: url("data:image/svg+xml;utf8,") no-repeat center / contain;
background: var(--c, #888);
filter: drop-shadow(0 1px 3px var(--glow, rgba(0,0,0,.4)));
}
/* 中间的 V 字符 */
.badge-v::after{
content:'V';
position:relative;
z-index:1;
font-family: Georgia, "Times New Roman", serif;
font-style: italic;
font-weight: 900;
font-size: 11px;
line-height: 1;
color:#fff;
transform: translateY(-1px);
text-shadow: 0 1px 1px rgba(0,0,0,.35);
}
/* 大号 */
.badge-v.lg{
width:30px !important;
height:30px !important;
}
.badge-v.lg::after{
font-size:17px;
transform: translateY(-2px);
}
/* 颜色 */
.v-red{
--c: linear-gradient(140deg, #ff8a8a 0%, #ef4444 50%, #b91c1c 100%);
--glow: rgba(239,68,68,.6);
}
.v-blue{
--c: linear-gradient(140deg, #7dd3fc 0%, #3b82f6 50%, #1e40af 100%);
--glow: rgba(59,130,246,.65);
}
.v-yellow{
--c: linear-gradient(140deg, #fde68a 0%, #f59e0b 50%, #b45309 100%);
--glow: rgba(245,158,11,.7);
}
.v-yellow::after{
color:#3d2400;
text-shadow: 0 1px 1px rgba(255,255,255,.4);
}
/* ===== 称号标签（跟 MOD/ADMIN 同风格） ===== */
.role-tag,
.role-custom{
display:inline-flex !important;
align-items:center;
gap:4px;
padding:2px 8px !important;
border-radius:4px !important;
font-size:0.7rem !important;
font-weight:700 !important;
letter-spacing:.03em;
line-height:1.35;
vertical-align:middle;
border:1px solid rgba(255,255,255,.08);
}
.role-custom i{
font-size:0.85em;
line-height:1;
}
/* ===== v3.1 认证徽章 — 微博风格（V圆 + 药丸标签） ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:20px !important;
height:20px !important;
border-radius:50% !important;
flex-shrink:0;
vertical-align:middle;
position:relative;
transition:transform .18s;
border:none !important;
background:transparent !important;
box-shadow:none !important;
}
.badge-v:hover{ transform:scale(1.15); }
/* 圆形底色 */
.badge-v::before{
content:''; position:absolute; inset:0;
border-radius:50%;
background: var(--grad, #888);
box-shadow:
inset 0 -2px 3px rgba(0,0,0,.25),
inset 0 2px 2px rgba(255,255,255,.45),
0 2px 5px var(--glow, rgba(0,0,0,.3));
}
/* 白色 V */
.badge-v::after{
content:'V';
position:relative;
z-index:1;
font-family: Georgia, "Times New Roman", serif;
font-style: italic;
font-weight: 900;
font-size: 11px;
line-height: 1;
color: #fff;
transform: translateY(-1px);
text-shadow: 0 1px 1px rgba(0,0,0,.35);
}
/* 大号（个人主页） */
.badge-v.lg{
width:26px !important;
height:26px !important;
}
.badge-v.lg::after{
font-size:15px;
transform: translateY(-1px);
}
/* 认证说明标签 — 微博药丸风格 */
.v-label{
display:inline-flex !important;
align-items:center;
padding: 3px 12px !important;
border-radius: 9999px !important;
font-size: 0.75rem !important;
font-weight: 700 !important;
letter-spacing: 0 !important;
vertical-align:middle;
border: 1.5px solid var(--b) !important;
background: var(--bg) !important;
color: var(--c) !important;
margin-left: 5px;
line-height: 1.4;
text-shadow: none !important;
}
.v-label::before{
display: none !important;
}
/* 红 V */
.v-red{
--grad: linear-gradient(140deg, #ff8a8a 0%, #ef4444 50%, #b91c1c 100%);
--glow: rgba(239,68,68,.55);
}
.v-label.red{
--b: rgba(239,68,68,.65);
--bg: rgba(239,68,68,.12);
--c: #ff9c9c;
}
/* 蓝 V */
.v-blue{
--grad: linear-gradient(140deg, #7dd3fc 0%, #3b82f6 50%, #1e40af 100%);
--glow: rgba(59,130,246,.6);
}
.v-label.blue{
--b: rgba(59,130,246,.65);
--bg: rgba(59,130,246,.12);
--c: #93c5fd;
}
/* 黄 V — 跟新浪认证一致的橙色 */
.v-yellow{
--grad: linear-gradient(140deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);
--glow: rgba(245,158,11,.7);
}
.v-label.yellow{
--b: rgba(245,158,11,.7);
--bg: rgba(245,158,11,.12);
--c: #fcd34d;
}
.v-yellow::after{
color: #fff;
text-shadow: 0 1px 2px rgba(120,53,15,.6);
}
/* ===== v3.2 修复：药丸不换行、不挤压 ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:20px !important;
height:20px !important;
min-width:20px !important;
min-height:20px !important;
border-radius:50% !important;
flex: 0 0 auto !important;
flex-shrink: 0 !important;
vertical-align:middle;
position:relative;
transition:transform .18s;
border:none !important;
background:transparent !important;
box-shadow:none !important;
padding:0 !important;
margin:0 !important;
}
.badge-v:hover{ transform:scale(1.15); }
.badge-v::before{
content:''; position:absolute; inset:0;
border-radius:50%;
background: var(--grad, #888);
box-shadow:
inset 0 -2px 3px rgba(0,0,0,.25),
inset 0 2px 2px rgba(255,255,255,.45),
0 2px 5px var(--glow, rgba(0,0,0,.3));
}
.badge-v::after{
content:'V';
position:relative;
z-index:1;
font-family: Georgia, "Times New Roman", serif;
font-style: italic;
font-weight: 900;
font-size: 11px;
line-height: 1;
color: #fff;
transform: translateY(-1px);
text-shadow: 0 1px 1px rgba(0,0,0,.35);
display:block;
}
.badge-v.lg{
width:26px !important;
height:26px !important;
min-width:26px !important;
min-height:26px !important;
}
.badge-v.lg::after{
font-size:15px;
}
/* 药丸标签 — 关键修复 */
.v-label{
display:inline-flex !important;
align-items:center;
justify-content:center;
padding: 3px 12px !important;
border-radius: 9999px !important;
font-size: 0.75rem !important;
font-weight: 700 !important;
letter-spacing: 0 !important;
vertical-align:middle;
border: 1.5px solid var(--b) !important;
background: var(--bg) !important;
color: var(--c) !important;
margin-left: 6px !important;
line-height: 1.4 !important;
text-shadow: none !important;
/* ⭐关键三行：不换行、不压缩、不拆字 */
white-space: nowrap !important;
flex-shrink: 0 !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
writing-mode: horizontal-tb !important;
}
.v-label::before{ display: none !important; }
/* 红 V */
.v-red{ --grad: linear-gradient(140deg, #ff8a8a 0%, #ef4444 50%, #b91c1c 100%); --glow: rgba(239,68,68,.55); }
.v-label.red{ --b: rgba(239,68,68,.65); --bg: rgba(239,68,68,.12); --c: #ff9c9c; }
/* 蓝 V */
.v-blue{ --grad: linear-gradient(140deg, #7dd3fc 0%, #3b82f6 50%, #1e40af 100%); --glow: rgba(59,130,246,.6); }
.v-label.blue{ --b: rgba(59,130,246,.65); --bg: rgba(59,130,246,.12); --c: #93c5fd; }
/* 黄 V */
.v-yellow{ --grad: linear-gradient(140deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%); --glow: rgba(245,158,11,.7); }
.v-label.yellow{ --b: rgba(245,158,11,.7); --bg: rgba(245,158,11,.12); --c: #fcd34d; }
.v-yellow::after{ color:#fff; text-shadow: 0 1px 2px rgba(120,53,15,.6); }
/* 让 V 徽章 + 药丸 + 角色标签 一排整齐 */
.profile-name-row,
.p-info > div:first-child{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:6px;
}
/* ===== v3.3 简洁圆 V 徽章 ===== */
.badge-v{
display:inline-flex !important;
align-items:center;
justify-content:center;
width:18px !important;
height:18px !important;
min-width:18px !important;
border-radius:50% !important;
flex-shrink:0 !important;
vertical-align:middle;
position:relative;
transition:transform .15s;
border:none !important;
box-shadow:none !important;
padding:0 !important;
margin:0 !important;
background: var(--grad, #3b82f6);
}
.badge-v:hover{ transform:scale(1.15); }
/* V 字母 */
.badge-v::before{
content:'V';
color:#fff;
font-family: -apple-system, "Segoe UI", Arial, sans-serif;
font-weight: 900;
font-size: 11px;
line-height: 1;
display:block;
letter-spacing: 0;
transform: translateY(-0.5px);
}
/* 大号 */
.badge-v.lg{
width:24px !important;
height:24px !important;
min-width:24px !important;
}
.badge-v.lg::before{ font-size:15px; }
/* 红 */
.v-red{ --grad: #ef4444; }
/* 蓝 */
.v-blue{ --grad: #3b82f6; }
/* 黄 */
.v-yellow{ --grad: #f59e0b; }
.v-yellow::before{ color:#fff; }
/* ===== 极简认证文字标签 ===== */
.v-label{
display:inline-flex !important;
align-items:center;
padding: 0 !important;
border: none !important;
background: transparent !important;
font-size: 0.78rem !important;
font-weight: 600 !important;
margin-left: 6px !important;
white-space: nowrap !important;
flex-shrink: 0 !important;
vertical-align: middle;
line-height: 1.4 !important;
text-shadow: none !important;
}
.v-label::before{ display:none !important; }
.v-label.red{ color: #ff9c9c !important; }
.v-label.blue{ color: #93c5fd !important; }
.v-label.yellow{ color: #fcd34d !important; }
/* ===== v3.4 认证标签 — 单胶囊整体 ===== */
.v-badge{
display: inline-flex !important;
align-items: center !important;
gap: 6px !important;
padding: 2px 10px 2px 2px !important;
border-radius: 9999px !important;
font-size: 0.72rem !important;
font-weight: 700 !important;
white-space: nowrap !important;
flex-shrink: 0 !important;
vertical-align: middle !important;
margin-left: 6px !important;
line-height: 1.5 !important;
border: 1px solid !important;
transition: transform .15s, box-shadow .15s;
text-shadow: none !important;
}
.v-badge:hover{ transform: translateY(-1px); }
/* 内部 V 圆 */
.v-badge .v-icon{
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 18px !important;
height: 18px !important;
border-radius: 50% !important;
font-size: 11px !important;
font-weight: 900 !important;
color: #fff !important;
flex-shrink: 0 !important;
font-family: Georgia, "Times New Roman", serif !important;
font-style: italic !important;
line-height: 1 !important;
text-shadow: 0 1px 1px rgba(0,0,0,.25);
box-shadow: inset 0 -2px 3px rgba(0,0,0,.2), inset 0 2px 3px rgba(255,255,255,.35);
}
.v-badge .v-text{
display: inline-block !important;
white-space: nowrap !important;
color: inherit !important;
}
/* 红 V — 个人认证 */
.v-badge.red{
background: linear-gradient(135deg, rgba(239,68,68,.14), rgba(239,68,68,.04)) !important;
border-color: rgba(239,68,68,.4) !important;
color: #ff9c9c !important;
}
.v-badge.red .v-icon{
background: linear-gradient(135deg, #ff7070, #b91c1c) !important;
box-shadow: inset 0 -2px 3px rgba(0,0,0,.25), inset 0 2px 3px rgba(255,255,255,.4), 0 2px 5px rgba(239,68,68,.5);
}
/* 蓝 V — 企业认证 */
.v-badge.blue{
background: linear-gradient(135deg, rgba(59,130,246,.14), rgba(59,130,246,.04)) !important;
border-color: rgba(59,130,246,.4) !important;
color: #93c5fd !important;
}
.v-badge.blue .v-icon{
background: linear-gradient(135deg, #60a5fa, #1e40af) !important;
box-shadow: inset 0 -2px 3px rgba(0,0,0,.25), inset 0 2px 3px rgba(255,255,255,.4), 0 2px 5px rgba(59,130,246,.5);
}
/* 黄 V — 官方认证 */
.v-badge.yellow{
background: linear-gradient(135deg, rgba(245,158,11,.14), rgba(245,158,11,.04)) !important;
border-color: rgba(245,158,11,.4) !important;
color: #fcd34d !important;
}
.v-badge.yellow .v-icon{
background: linear-gradient(135deg, #fbbf24, #b45309) !important;
color: #3d2400 !important;
box-shadow: inset 0 -2px 3px rgba(0,0,0,.2), inset 0 2px 3px rgba(255,255,255,.5), 0 2px 5px rgba(245,158,11,.5);
}
/* 大号 */
.v-badge.lg{ font-size: 0.82rem !important; padding: 3px 12px 3px 3px !important; }
.v-badge.lg .v-icon{ width: 22px !important; height: 22px !important; font-size: 14px !important; }
/* 兼容旧 class（防止遗漏调用） */
.badge-v, .v-label{ display: none !important; }
/* ===== v3.5 认证徽章 — 小巧精致版 ===== */
.v-badge{
display:inline-flex !important;
align-items:center !important;
gap:4px !important;
padding:1px 8px 1px 1px !important;
border-radius:9999px !important;
font-size:0.68rem !important;
font-weight:700 !important;
white-space:nowrap !important;
flex-shrink:0 !important;
vertical-align:middle !important;
margin-left:4px !important;
line-height:1.5 !important;
border:1px solid !important;
transition:transform .15s;
text-shadow:none !important;
}
.v-badge:hover{ transform:translateY(-1px); }
.v-badge .v-icon{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
width:15px !important;
height:15px !important;
min-width:15px !important;
border-radius:50% !important;
font-size:9px !important;
font-weight:900 !important;
color:#fff !important;
flex-shrink:0 !important;
font-family: Georgia, "Times New Roman", serif !important;
font-style:italic !important;
line-height:1 !important;
box-shadow:
inset 0 -1px 2px rgba(0,0,0,.2),
inset 0 1px 2px rgba(255,255,255,.35);
}
.v-badge .v-text{
display:inline-block !important;
white-space:nowrap !important;
color:inherit !important;
}
/* 红 V */
.v-badge.red{
background: linear-gradient(135deg, rgba(239,68,68,.12), rgba(239,68,68,.03)) !important;
border-color: rgba(239,68,68,.35) !important;
color: #ff9c9c !important;
}
.v-badge.red .v-icon{
background: linear-gradient(135deg, #ff7070, #b91c1c) !important;
}
/* 蓝 V */
.v-badge.blue{
background: linear-gradient(135deg, rgba(59,130,246,.12), rgba(59,130,246,.03)) !important;
border-color: rgba(59,130,246,.35) !important;
color: #93c5fd !important;
}
.v-badge.blue .v-icon{
background: linear-gradient(135deg, #60a5fa, #1e40af) !important;
}
/* 黄 V */
.v-badge.yellow{
background: linear-gradient(135deg, rgba(245,158,11,.12), rgba(245,158,11,.03)) !important;
border-color: rgba(245,158,11,.35) !important;
color: #fcd34d !important;
}
.v-badge.yellow .v-icon{
background: linear-gradient(135deg, #fbbf24, #b45309) !important;
color: #3d2400 !important;
}
/* 大号（个人主页） */
.v-badge.lg{
font-size:0.75rem !important;
padding:2px 10px 2px 2px !important;
}
.v-badge.lg .v-icon{
width:18px !important;
height:18px !important;
min-width:18px !important;
font-size:11px !important;
}
/* ===== v3.5 称号胶囊 — 跟认证徽章同风格，但纯文字 ===== */
.title-badge,
.role-custom{
display:inline-flex !important;
align-items:center;
gap:3px;
padding:1px 8px !important;
border-radius:9999px !important;
font-size:0.68rem !important;
font-weight:700 !important;
white-space:nowrap !important;
flex-shrink:0 !important;
vertical-align:middle !important;
margin-left:0 !important;
line-height:1.5 !important;
border:1px solid !important;
transition:transform .15s;
letter-spacing:0 !important;
text-shadow:none !important;
}
.title-badge:hover,
.role-custom:hover{ transform:translateY(-1px); }
.title-badge i,
.role-custom i{
font-size:0.75rem;
line-height:1;
}
/* 兼容旧 ADMIN/MOD 标签 */
.role-tag{
display:inline-flex !important;
align-items:center;
padding:1px 8px !important;
border-radius:9999px !important;
font-size:0.68rem !important;
font-weight:800 !important;
white-space:nowrap !important;
letter-spacing:.03em;
line-height:1.5 !important;
vertical-align:middle;
}
.role-admin{
background:linear-gradient(135deg, #ff7070, #b91c1c) !important;
color:#fff !important;
border:1px solid rgba(255,112,112,.5) !important;
}
.role-mod{
background:linear-gradient(135deg, #a78bfa, #6d28d9) !important;
color:#fff !important;
border:1px solid rgba(167,139,250,.5) !important;
}
/* 隐藏旧徽章 */
.badge-v, .v-label{ display:none !important; }
/* ===== v3.6 强制显示 v-text ===== */
.v-badge .v-text{
display: inline-block !important;
visibility: visible !important;
opacity: 1 !important;
white-space: nowrap !important;
color: inherit !important;
font-size: inherit !important;
line-height: inherit !important;
}
.v-badge{
display: inline-flex !important;
visibility: visible !important;
opacity: 1 !important;
}
/* 称号胶囊 - 保证可见 */
.title-badge{
display: inline-flex !important;
visibility: visible !important;
opacity: 1 !important;
white-space: nowrap !important;
}
/* 隐藏旧类 */
.badge-v,
.v-label{
display: none !important;
}
/* ===== v3.8 认证徽章 — 前台统一金色 ===== */
.v-badge{
display:inline-flex !important;
align-items:center !important;
gap:4px !important;
padding:1px 8px 1px 1px !important;
border-radius:9999px !important;
font-size:0.68rem !important;
font-weight:700 !important;
white-space:nowrap !important;
flex-shrink:0 !important;
vertical-align:middle !important;
margin-left:4px !important;
line-height:1.5 !important;
/* ⭐统一金色：前台不区分类型 */
background: linear-gradient(135deg, rgba(245,158,11,.12), rgba(245,158,11,.03)) !important;
border: 1px solid rgba(245,158,11,.35) !important;
color: #fcd34d !important;
transition: transform .15s;
text-shadow:none !important;
}
.v-badge:hover{ transform:translateY(-1px); }
.v-badge .v-icon{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
width:14px !important;
height:14px !important;
min-width:14px !important;
border-radius:50% !important;
font-size:9px !important;
font-weight:900 !important;
color:#3d2400 !important;
flex-shrink:0 !important;
font-family: Georgia, "Times New Roman", serif !important;
font-style:italic !important;
line-height:1 !important;
background: linear-gradient(135deg, #fbbf24, #b45309) !important;
box-shadow:
inset 0 -1px 2px rgba(0,0,0,.2),
inset 0 1px 2px rgba(255,255,255,.35);
}
/* 只有 V 无文字：正方形 */
.v-badge:not(:has(.v-text)){
padding: 1px !important;
width: 18px !important;
justify-content: center !important;
}
.v-badge:not(:has(.v-text)) .v-icon{
width: 16px !important;
height: 16px !important;
min-width: 16px !important;
font-size: 10px !important;
}
.v-badge .v-text{
display:inline-block !important;
white-space:nowrap !important;
color:inherit !important;
}
/* 大号（个人主页） */
.v-badge.lg{
font-size:0.75rem !important;
padding:2px 10px 2px 2px !important;
}
.v-badge.lg .v-icon{
width:18px !important; height:18px !important; min-width:18px !important;
font-size:11px !important;
}
/* ===== 申请页专用：4 色 V 说明 ===== */
.v-demo{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
width:24px !important;
height:24px !important;
min-width:24px !important;
border-radius:50% !important;
font-size:13px !important;
font-weight:900 !important;
color:#fff !important;
font-family: Georgia, "Times New Roman", serif !important;
font-style:italic !important;
line-height:1 !important;
flex-shrink:0 !important;
}
.v-demo.gray{ background: linear-gradient(135deg, #9ca3af, #374151) !important; }
.v-demo.red{ background: linear-gradient(135deg, #ff7070, #b91c1c) !important; }
.v-demo.blue{ background: linear-gradient(135deg, #60a5fa, #1e40af) !important; }
.v-demo.yellow{ background: linear-gradient(135deg, #fbbf24, #b45309) !important; color:#3d2400 !important; }
/* 兼容旧类隐藏 */
.badge-v, .v-label{ display:none !important; }
/* 旧颜色类统一失效，不再区分 */
.v-badge.red, .v-badge.blue, .v-badge.green, .v-badge.yellow, .v-badge.gray{
background: linear-gradient(135deg, rgba(245,158,11,.12), rgba(245,158,11,.03)) !important;
border-color: rgba(245,158,11,.35) !important;
color: #fcd34d !important;
}
.v-badge.red .v-icon, .v-badge.blue .v-icon, .v-badge.green .v-icon,
.v-badge.yellow .v-icon, .v-badge.gray .v-icon{
background: linear-gradient(135deg, #fbbf24, #b45309) !important;
color: #3d2400 !important;
}
/* ===== v3.9 认证徽章 — 4 色区分（只显示名称） ===== */
.v-badge{
display:inline-flex !important;
align-items:center !important;
gap:4px !important;
padding:1px 8px 1px 1px !important;
border-radius:9999px !important;
font-size:0.68rem !important;
font-weight:700 !important;
white-space:nowrap !important;
flex-shrink:0 !important;
vertical-align:middle !important;
margin-left:4px !important;
line-height:1.5 !important;
border:1px solid !important;
transition:transform .15s;
text-shadow:none !important;
}
.v-badge:hover{ transform:translateY(-1px); }
.v-badge .v-icon{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
width:14px !important;
height:14px !important;
min-width:14px !important;
border-radius:50% !important;
font-size:9px !important;
font-weight:900 !important;
color:#fff !important;
flex-shrink:0 !important;
font-family: Georgia, "Times New Roman", serif !important;
font-style:italic !important;
line-height:1 !important;
box-shadow:
inset 0 -1px 2px rgba(0,0,0,.2),
inset 0 1px 2px rgba(255,255,255,.35);
}
.v-badge:not(:has(.v-text)){
padding: 1px !important;
width: 18px !important;
justify-content: center !important;
}
.v-badge:not(:has(.v-text)) .v-icon{
width: 16px !important;
height: 16px !important;
min-width: 16px !important;
font-size: 10px !important;
}
.v-badge .v-text{
display:inline-block !important;
white-space:nowrap !important;
color:inherit !important;
}
.v-badge.lg{
font-size:0.75rem !important;
padding:2px 10px 2px 2px !important;
}
.v-badge.lg .v-icon{
width:18px !important; height:18px !important; min-width:18px !important;
font-size:11px !important;
}
/* ⚪ 灰 V — 个人认证 */
.v-badge.gray{
background: linear-gradient(135deg, rgba(156,163,175,.12), rgba(156,163,175,.03)) !important;
border-color: rgba(156,163,175,.35) !important;
color: #d1d5db !important;
}
.v-badge.gray .v-icon{
background: linear-gradient(135deg, #9ca3af, #374151) !important;
color: #fff !important;
}
/* 🔴 红 V — 企业认证 */
.v-badge.red{
background: linear-gradient(135deg, rgba(239,68,68,.12), rgba(239,68,68,.03)) !important;
border-color: rgba(239,68,68,.35) !important;
color: #ff9c9c !important;
}
.v-badge.red .v-icon{
background: linear-gradient(135deg, #ff7070, #b91c1c) !important;
color: #fff !important;
}
/* 🔵 蓝 V — 机构认证 */
.v-badge.blue{
background: linear-gradient(135deg, rgba(59,130,246,.12), rgba(59,130,246,.03)) !important;
border-color: rgba(59,130,246,.35) !important;
color: #93c5fd !important;
}
.v-badge.blue .v-icon{
background: linear-gradient(135deg, #60a5fa, #1e40af) !important;
color: #fff !important;
}
/* 🟡 金 V — 管理认证 */
.v-badge.yellow{
background: linear-gradient(135deg, rgba(245,158,11,.12), rgba(245,158,11,.03)) !important;
border-color: rgba(245,158,11,.35) !important;
color: #fcd34d !important;
}
.v-badge.yellow .v-icon{
background: linear-gradient(135deg, #fbbf24, #b45309) !important;
color: #3d2400 !important;
}
/* 没有颜色 class 时（默认）也给金色 */
.v-badge:not(.gray):not(.red):not(.blue):not(.yellow){
background: linear-gradient(135deg, rgba(245,158,11,.12), rgba(245,158,11,.03)) !important;
border-color: rgba(245,158,11,.35) !important;
color: #fcd34d !important;
}
.v-badge:not(.gray):not(.red):not(.blue):not(.yellow) .v-icon{
background: linear-gradient(135deg, #fbbf24, #b45309) !important;
color: #3d2400 !important;
}
/* 申请页 4 色圆 */
.v-demo{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
width:24px !important;
height:24px !important;
min-width:24px !important;
border-radius:50% !important;
font-size:13px !important;
font-weight:900 !important;
color:#fff !important;
font-family: Georgia, "Times New Roman", serif !important;
font-style:italic !important;
line-height:1 !important;
flex-shrink:0 !important;
}
.v-demo.gray{ background: linear-gradient(135deg, #9ca3af, #374151) !important; }
.v-demo.red{ background: linear-gradient(135deg, #ff7070, #b91c1c) !important; }
.v-demo.blue{ background: linear-gradient(135deg, #60a5fa, #1e40af) !important; }
.v-demo.yellow{ background: linear-gradient(135deg, #fbbf24, #b45309) !important; color:#3d2400 !important; }
/* 隐藏旧类 */
.badge-v, .v-label{ display:none !important; }
/* ===== v4.1 头像角落 V 徽章 ===== */
.avatar { position: relative !important; }
/* 颜色 */
/* 名字后面的认证名称文字（只显示名称） */
.v-text-pill {
display: inline-flex;
align-items: center;
padding: 1px 8px;
border-radius: 9999px;
font-size: 0.68rem;
font-weight: 700;
white-space: nowrap;
flex-shrink: 0;
margin-left: 4px;
line-height: 1.5;
border: 1px solid;
}
.v-text-pill.gray { background: rgba(156,163,175,.12); border-color: rgba(156,163,175,.3); color: #d1d5db; }
.v-text-pill.red { background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.3); color: #ff9c9c; }
.v-text-pill.blue { background: rgba(59,130,246,.12); border-color: rgba(59,130,246,.3); color: #93c5fd; }
.v-text-pill.yellow { background: rgba(245,158,11,.12); border-color: rgba(245,158,11,.3); color: #fcd34d; }
/* 隐藏行内 V（已移到头像） */
.v-badge { display: none !important; }
/* ===== v4.2 头像角落 V（Bilibili 风格） ===== */
/* 头像容器：允许 V 溢出 */
.avatar,
.p-avatar{
position: relative !important;
overflow: visible !important;
}
/* 头像图片：单独做圆形裁剪 */
.avatar > img,
.p-avatar > img{
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
border-radius: 50% !important;
display: block !important;
}
/* 头像容器本身圆形（文字头像） */
.avatar,
.p-avatar{
border-radius: 50%;
}
/* V 徽章 —— 紧贴头像右下角 */
/* 尺寸适配 */
/* 颜色 */
/* 论坛列表头像放大到 36px（否则 V 看不清） */
.post .avatar.sm,
.post-head .avatar.sm{
width: 36px !important;
height: 36px !important;
font-size: 0.9rem !important;
}
/* 名字后面的认证名称文字 */
.v-text-pill{
display: inline-flex !important;
align-items: center !important;
padding: 1px 8px !important;
border-radius: 9999px !important;
font-size: 0.68rem !important;
font-weight: 700 !important;
white-space: nowrap !important;
flex-shrink: 0 !important;
margin-left: 4px !important;
line-height: 1.5 !important;
border: 1px solid !important;
}
.v-text-pill.gray { background: rgba(156,163,175,.12) !important; border-color: rgba(156,163,175,.3) !important; color: #d1d5db !important; }
.v-text-pill.red { background: rgba(239,68,68,.12) !important; border-color: rgba(239,68,68,.3) !important; color: #ff9c9c !important; }
.v-text-pill.blue { background: rgba(59,130,246,.12) !important; border-color: rgba(59,130,246,.3) !important; color: #93c5fd !important; }
.v-text-pill.yellow { background: rgba(245,158,11,.12) !important; border-color: rgba(245,158,11,.3) !important; color: #fcd34d !important; }
/* 隐藏行内旧 V（已移到头像） */
.v-badge { display: none !important; }
/* ===== v4.3 认证显示（只名称，无前缀） ===== */
.v-text-pill{
display:inline-flex !important;
align-items:center !important;
padding:1px 8px !important;
border-radius:9999px !important;
font-size:0.68rem !important;
font-weight:700 !important;
white-space:nowrap !important;
flex-shrink:0 !important;
margin-left:4px !important;
line-height:1.5 !important;
border:1px solid !important;
}
.v-text-pill.gray { background: rgba(156,163,175,.12) !important; border-color: rgba(156,163,175,.3) !important; color: #d1d5db !important; }
.v-text-pill.red { background: rgba(239,68,68,.12) !important; border-color: rgba(239,68,68,.3) !important; color: #ff9c9c !important; }
.v-text-pill.blue { background: rgba(59,130,246,.12) !important; border-color: rgba(59,130,246,.3) !important; color: #93c5fd !important; }
.v-text-pill.yellow { background: rgba(245,158,11,.12) !important; border-color: rgba(245,158,11,.3) !important; color: #fcd34d !important; }
/* 论坛列表头像放大 + V 角标 */
.post .avatar.sm,
.post-head .avatar.sm{
width: 36px !important;
height: 36px !important;
font-size: 0.9rem !important;
overflow: visible !important;
}
.avatar{
position: relative !important;
overflow: visible !important;
}
.avatar img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
border-radius:50% !important;
display:block !important;
}
/* 隐藏行内 V */
.v-badge{ display:none !important; }
/* ===== 管理后台用户管理认证列 ===== */
.admin-verify-cell{
display:inline-flex;
align-items:center;
gap:6px;
font-size:0.82rem;
}
/* 描述行里的静态 V */
/* title-badge 保底 */
.title-badge{
display:inline-flex !important;
align-items:center !important;
gap:3px !important;
padding:1px 8px !important;
border-radius:9999px !important;
font-size:0.68rem !important;
font-weight:700 !important;
white-space:nowrap !important;
vertical-align:middle !important;
line-height:1.5 !important;
flex-shrink:0 !important;
}
.title-badge i{ font-size:0.75rem; line-height:1; }
/* ===== v4.9 交互按钮 ===== */
.post-react{
display:inline-flex;
align-items:center;
gap:5px;
padding:4px 10px;
border-radius:9999px;
background:transparent;
border:none;
color:var(--muted);
font-size:0.85rem;
cursor:pointer;
transition:all .15s;
font-family:inherit;
}
.post-react:hover{
background:rgba(29,155,240,.1);
color:var(--primary);
}
.post-react.active{
color:var(--primary);
font-weight:700;
}
.post-react.active .bi-hand-thumbs-up-fill,
.post-react.active .bi-hand-thumbs-down-fill{ color:var(--primary); }
.post-react.dislike:hover{
background:rgba(244,33,46,.1);
color:var(--danger);
}
.post-react.dislike.active{
color:var(--danger);
}
.post-react.dislike.active .bi-hand-thumbs-down-fill{ color:var(--danger); }
.post-react.share:hover{
background:rgba(34,197,94,.1);
color:#4ade80;
}
/* 评论点赞按钮 */
.comment-react{
display:inline-flex;
align-items:center;
gap:4px;
padding:2px 8px;
border-radius:9999px;
background:transparent;
border:none;
color:var(--muted);
font-size:0.78rem;
cursor:pointer;
transition:all .15s;
font-family:inherit;
}
.comment-react:hover{ background:rgba(29,155,240,.1); color:var(--primary); }
.comment-react.active{ color:var(--primary); font-weight:700; }
.comment-react.dislike:hover{ background:rgba(244,33,46,.1); color:var(--danger); }
.comment-react.dislike.active{ color:var(--danger); }
/* 分享弹窗 */
.share-modal-bg{
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,.8);
z-index:9999;
align-items:center;
justify-content:center;
padding:20px;
backdrop-filter:blur(6px);
}
.share-modal-bg.show{ display:flex; }
.share-modal{
background:linear-gradient(135deg, rgba(20,30,55,.95), rgba(15,22,40,.98));
border:1px solid rgba(56,189,248,.25);
border-radius:20px;
padding:28px;
max-width:480px;
width:100%;
box-shadow:0 20px 60px rgba(0,0,0,.6), 0 0 60px rgba(56,189,248,.1);
}
.share-modal h3{
margin:0 0 8px;
font-size:1.2rem;
background:linear-gradient(90deg,#38bdf8,#a855f7);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;
}
.share-modal .sub{ color:var(--muted); font-size:0.85rem; margin-bottom:18px; }
.share-link-box{
display:flex;
gap:8px;
background:rgba(0,0,0,.35);
border:1px solid rgba(56,189,248,.2);
border-radius:10px;
padding:10px 12px;
margin-bottom:16px;
align-items:center;
}
.share-link-box input{
flex:1;
background:transparent;
border:none;
color:var(--primary);
font-size:0.85rem;
font-family:monospace;
outline:none;
min-width:0;
}
.share-link-box button{
background:linear-gradient(135deg,#38bdf8,#1d9bf0);
color:#fff;
border:none;
padding:6px 14px;
border-radius:8px;
font-size:0.82rem;
font-weight:600;
cursor:pointer;
white-space:nowrap;
}
.share-platforms{
display:grid;
grid-template-columns:repeat(4, 1fr);
gap:10px;
margin-bottom:16px;
}
.share-plat{
display:flex;
flex-direction:column;
align-items:center;
gap:6px;
padding:12px 8px;
border-radius:12px;
background:rgba(255,255,255,.03);
border:1px solid rgba(255,255,255,.08);
cursor:pointer;
transition:all .2s;
color:var(--text);
text-decoration:none;
font-size:0.75rem;
}
.share-plat:hover{
transform:translateY(-2px);
background:rgba(255,255,255,.06);
border-color:rgba(56,189,248,.4);
text-decoration:none;
color:var(--text);
}
.share-plat i{ font-size:1.4rem; }
.share-plat.qq i{ color:#12b7f5; }
.share-plat.wx i{ color:#07c160; }
.share-plat.wb i{ color:#e6162d; }
.share-plat.copy i{ color:#a855f7; }
.share-close{
width:100%;
padding:10px;
border-radius:10px;
background:transparent;
border:1px solid rgba(255,255,255,.1);
color:var(--muted);
cursor:pointer;
font-size:0.88rem;
}
.share-close:hover{ background:rgba(255,255,255,.05); color:var(--text); }
/* ===== v5.0 react-btn 统一 ===== */
.react-btn{
display:inline-flex;
align-items:center;
gap:5px;
padding:4px 10px;
border-radius:9999px;
background:transparent;
border:none;
color:var(--muted);
font-size:0.85rem;
cursor:pointer;
transition:all .15s;
font-family:inherit;
line-height:1.2;
}
.react-btn i{ font-size:1rem; }
.react-btn .cnt{ font-size:0.85rem; }
.react-btn:hover{ background:rgba(29,155,240,.12); color:var(--primary); }
.react-btn.active{ color:var(--primary); font-weight:700; }
.react-btn.active i{ color:var(--primary); }
.react-btn.dislike:hover{ background:rgba(244,33,46,.12); color:var(--danger); }
.react-btn.dislike.active{ color:var(--danger); font-weight:700; }
.react-btn.dislike.active i{ color:var(--danger); }
.react-btn.share:hover{ background:rgba(34,197,94,.12); color:#4ade80; }
.react-btn.sm{ padding:2px 8px; font-size:0.78rem; }
.react-btn.sm i{ font-size:0.85rem; }
/* 列表页统计图标 */
.post-foot .stat-icon{
display:inline-flex;
align-items:center;
gap:4px;
color:var(--muted);
font-size:0.85rem;
}
/* 评论互动区 */
/* 分享弹窗（确保生效） */
.share-modal-bg{
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,.8);
z-index:9999;
align-items:center;
justify-content:center;
padding:20px;
backdrop-filter:blur(6px);
}
.share-modal-bg.show{ display:flex; }
.share-modal{
background:linear-gradient(135deg, rgba(20,30,55,.95), rgba(15,22,40,.98));
border:1px solid rgba(56,189,248,.25);
border-radius:20px;
padding:28px;
max-width:480px;
width:100%;
box-shadow:0 20px 60px rgba(0,0,0,.6), 0 0 60px rgba(56,189,248,.1);
}
.share-modal h3{
margin:0 0 8px;
font-size:1.2rem;
background:linear-gradient(90deg,#38bdf8,#a855f7);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;
}
.share-modal .sub{ color:var(--muted); font-size:0.85rem; margin-bottom:18px; }
.share-link-box{
display:flex;
gap:8px;
background:rgba(0,0,0,.35);
border:1px solid rgba(56,189,248,.2);
border-radius:10px;
padding:10px 12px;
margin-bottom:16px;
align-items:center;
}
.share-link-box input{
flex:1;
background:transparent;
border:none;
color:var(--primary);
font-size:0.85rem;
font-family:monospace;
outline:none;
min-width:0;
}
.share-link-box button{
background:linear-gradient(135deg,#38bdf8,#1d9bf0);
color:#fff;
border:none;
padding:6px 14px;
border-radius:8px;
font-size:0.82rem;
font-weight:600;
cursor:pointer;
white-space:nowrap;
}
.share-platforms{
display:grid;
grid-template-columns:repeat(4, 1fr);
gap:10px;
margin-bottom:16px;
}
.share-plat{
display:flex;
flex-direction:column;
align-items:center;
gap:6px;
padding:12px 8px;
border-radius:12px;
background:rgba(255,255,255,.03);
border:1px solid rgba(255,255,255,.08);
cursor:pointer;
transition:all .2s;
color:var(--text);
text-decoration:none;
font-size:0.75rem;
}
.share-plat:hover{
transform:translateY(-2px);
background:rgba(255,255,255,.06);
border-color:rgba(56,189,248,.4);
text-decoration:none;
color:var(--text);
}
.share-plat i{ font-size:1.4rem; }
.share-plat.qq i{ color:#12b7f5; }
.share-plat.wx i{ color:#07c160; }
.share-plat.wb i{ color:#e6162d; }
.share-plat.copy i{ color:#a855f7; }
.share-close{
width:100%;
padding:10px;
border-radius:10px;
background:transparent;
border:1px solid rgba(255,255,255,.1);
color:var(--muted);
cursor:pointer;
font-size:0.88rem;
}
.share-close:hover{ background:rgba(255,255,255,.05); color:var(--text); }
/* 头像 V 放大到 60px */
/* 小尺寸头像里的 V 也要小 */
/* 颜色 */
/* ===== v6.1 UI 优化 ===== */
/* 滚动条美化 */
::-webkit-scrollbar{ width:8px;height:8px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{
background:rgba(148,163,184,.2);
border-radius:4px;
}
::-webkit-scrollbar-thumb:hover{ background:rgba(148,163,184,.35); }
/* 侧栏导航项过渡 */
.sidebar nav a{
transition:background .2s, color .2s, transform .2s;
}
.sidebar nav a:hover{
transform:translateX(2px);
}
/* 帖子卡片悬停更明显 */
.post{
transition:background .2s, border-color .2s;
}
.post:hover{
background:rgba(29,155,240,.03);
}
/* 按钮通用 */
.btn{
transition:all .2s;
}
.btn:active{
transform:scale(.97);
}
/* 顶栏 sticky 更清晰 */
.topbar{
box-shadow:0 2px 12px rgba(0,0,0,.15);
}
/* 卡片圆角统一 */
.card{
border-radius:14px;
}
/* 输入框焦点 */
.form-input:focus,
input:focus, textarea:focus, select:focus{
border-color:var(--primary) !important;
box-shadow:0 0 0 3px rgba(29,155,240,.1);
}
/* 移动端适配 */
@media (max-width:768px){
.sidebar{ width:64px; }
.sidebar .nav-text{ display:none; }
.sidebar nav a{ justify-content:center; padding:12px 8px; }
.right{ display:none; }
.main{ max-width:100%; }
.btn-new span{ font-size:1.2rem; }
.btn-new .nav-text{ display:none; }
}
/* 默认隐藏所有 av-v */
/* 头像容器定位基准 */
.avatar, .pf-avatar, .lb-avatar {
position: relative !important;
overflow: visible !important;
}
/* V 通用基础样式 */
/* 默认尺寸（帖子详情作者、评论、个人主页小号等）：18px */
/* 小尺寸（列表、评论）：12px */
/* 大尺寸（个人主页 pf-avatar）：60px */
/* 排行榜头像：16px */
/* 颜色（V 字体全部白色） */
/* ===== v6.7 各位置 V 尺寸 ===== */
.avatar .av-v,
.pf-avatar .av-v,
.lb-avatar .av-v {
display: flex !important;
align-items: center !important;
justify-content: center !important;
position: absolute !important;
border-radius: 50% !important;
font-family: Georgia, "Times New Roman", serif !important;
font-style: italic !important;
font-weight: 900 !important;
color: #fff !important;
text-shadow: 0 1px 2px rgba(0,0,0,.45) !important;
line-height: 1 !important;
padding: 0 !important;
margin: 0 !important;
z-index: 10 !important;
box-sizing: border-box !important;
}
/* 论坛列表小头像：V=16px ⬆ */
.avatar.sm .av-v {
width: 16px !important;
height: 16px !important;
min-width: 16px !important;
max-width: 16px !important;
font-size: 9px !important;
border: 2px solid var(--bg, #0f1419) !important;
box-shadow: 0 1px 4px rgba(0,0,0,.55) !important;
bottom: -2px !important;
right: -2px !important;
top: auto !important;
left: auto !important;
}
/* 帖子详情作者 / 评论：V=22px ⬆ */
.avatar .av-v {
width: 22px !important;
height: 22px !important;
min-width: 22px !important;
max-width: 22px !important;
font-size: 13px !important;
border: 2.5px solid var(--bg, #0f1419) !important;
box-shadow: 0 2px 8px rgba(0,0,0,.6) !important;
bottom: -2px !important;
right: -2px !important;
top: auto !important;
left: auto !important;
}
/* 排行榜头像：V=16px */
.lb-avatar .av-v {
width: 16px !important;
height: 16px !important;
min-width: 16px !important;
max-width: 16px !important;
font-size: 9px !important;
border: 2px solid var(--bg, #0f1419) !important;
box-shadow: 0 1px 4px rgba(0,0,0,.5) !important;
bottom: -2px !important;
right: -2px !important;
top: auto !important;
left: auto !important;
}
/* ⭐ 个人主页：V=50px（不动） */
.pf-avatar .av-v {
width: 50px !important;
height: 50px !important;
min-width: 50px !important;
max-width: 50px !important;
font-size: 28px !important;
border: 3.5px solid var(--bg, #0f1419) !important;
box-shadow: 0 5px 16px rgba(0,0,0,.7) !important;
bottom: -2px !important;
right: -2px !important;
top: auto !important;
left: auto !important;
}
/* 颜色 */
.av-v.gray { background: linear-gradient(135deg, #9ca3af, #374151) !important; }
.av-v.red { background: linear-gradient(135deg, #ff7070, #b91c1c) !important; }
.av-v.blue { background: linear-gradient(135deg, #60a5fa, #1e40af) !important; }
.av-v.yellow { background: linear-gradient(135deg, #fbbf24, #d97706) !important; }
.avatar, .pf-avatar, .lb-avatar { overflow: visible !important; position: relative !important; }
/* ===== v6.8 侧栏社区卡片美化 ===== */
.sidebar-menu h3{
display:flex;
align-items:center;
gap:8px;
padding:14px 16px 10px;
margin:0;
font-size:0.95rem;
font-weight:800;
color:var(--text);
letter-spacing:0.03em;
}
.sidebar-menu h3 i{
color:var(--primary);
font-size:1rem;
}
.sidebar-menu .menu-item{
display:flex;
align-items:center;
gap:10px;
padding:10px 16px;
color:var(--text);
text-decoration:none;
font-size:0.9rem;
transition:all .15s;
position:relative;
border-left:2px solid transparent;
}
.sidebar-menu .menu-item:hover{
background:rgba(29,155,240,.08);
color:var(--primary);
text-decoration:none;
border-left-color:var(--primary);
}
.sidebar-menu .menu-item:hover i{
color:var(--primary);
transform:scale(1.1);
}
.sidebar-menu .menu-item i{
color:var(--muted);
font-size:1rem;
width:18px;
text-align:center;
transition:all .15s;
flex-shrink:0;
}
.sidebar-menu .menu-item span{
flex:1;
min-width:0;
}
.sidebar-menu .menu-item .notif-badge{
flex:0 0 auto;
margin-left:6px;
}
/* ===== v6.9 侧栏底部用户信息 ===== */
.sidebar .me{
margin-top:auto;
padding:12px 14px;
border-top:1px solid var(--line);
display:flex;
align-items:center;
gap:10px;
}
.me-avatar-link{
flex-shrink:0;
text-decoration:none;
}
.me-avatar-link:hover{ text-decoration:none; }
.me-avatar-link .avatar{
width:38px;height:38px;font-size:0.95rem;
border:2px solid var(--line);
transition:border-color .15s;
}
.me-avatar-link:hover .avatar{
border-color:var(--primary);
}
.me-info{
flex:1;min-width:0;
}
.me-name{
display:block;
font-weight:700;
font-size:0.88rem;
color:var(--text);
text-decoration:none;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
line-height:1.2;
}
.me-name:hover{ color:var(--primary); text-decoration:none; }
.me-handle{
color:var(--muted);
font-size:0.75rem;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
margin-top:2px;
line-height:1.2;
}
.me-logout{
flex-shrink:0;
display:inline-flex;
}
.me-logout button{
background:transparent;
border:none;
color:var(--muted);
cursor:pointer;
padding:6px;
border-radius:6px;
transition:all .15s;
display:flex;
align-items:center;
justify-content:center;
font-size:1rem;
}
.me-logout button:hover{
color:#ff7b84;
background:rgba(244,33,46,.1);
}
/* 未登录时侧栏底部按钮堆叠 */
.sidebar .login-actions{
margin-top:auto;
padding:14px;
display:flex;
flex-direction:column;
gap:8px;
border-top:1px solid var(--line);
}
/* ===== v7.0 侧栏底部超强样式 ===== */
.sidebar .me{
margin-top: auto !important;
padding: 12px 12px !important;
border-top: 1px solid var(--line) !important;
display: flex !important;
align-items: center !important;
gap: 10px !important;
width: 100% !important;
box-sizing: border-box !important;
overflow: hidden !important;
}
.sidebar .me-avatar{
flex: 0 0 auto !important;
text-decoration: none !important;
display: block !important;
}
.sidebar .me-avatar:hover{ text-decoration: none !important; }
.sidebar .me-avatar .avatar{
width: 38px !important;
height: 38px !important;
min-width: 38px !important;
max-width: 38px !important;
font-size: 0.95rem !important;
border: 2px solid var(--line) !important;
border-radius: 50% !important;
overflow: hidden !important;
position: relative !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
background: var(--card) !important;
color: var(--primary) !important;
font-weight: 800 !important;
transition: border-color .15s !important;
}
.sidebar .me-avatar .avatar img{
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
border-radius: 50% !important;
}
.sidebar .me-avatar:hover .avatar{
border-color: var(--primary) !important;
}
/* 文字区：强制单行截断 */
.sidebar .me-text{
flex: 1 1 auto !important;
min-width: 0 !important;
overflow: hidden !important;
display: flex !important;
flex-direction: column !important;
gap: 2px !important;
}
.sidebar .me-name{
display: block !important;
font-weight: 700 !important;
font-size: 0.85rem !important;
color: var(--text) !important;
text-decoration: none !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
line-height: 1.2 !important;
max-width: 100% !important;
}
.sidebar .me-name:hover{
color: var(--primary) !important;
text-decoration: none !important;
}
.sidebar .me-handle{
display: block !important;
color: var(--muted) !important;
font-size: 0.72rem !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
line-height: 1.2 !important;
max-width: 100% !important;
}
.sidebar .me-logout{
flex: 0 0 auto !important;
display: flex !important;
margin: 0 !important;
padding: 0 !important;
}
.sidebar .me-logout button{
background: transparent !important;
border: none !important;
color: var(--muted) !important;
cursor: pointer !important;
padding: 6px 4px !important;
border-radius: 6px !important;
transition: all .15s !important;
font-size: 1rem !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.sidebar .me-logout button:hover{
color: #ff7b84 !important;
background: rgba(244,33,46,.1) !important;
}
/* 未登录底部按钮 */
.sidebar .login-actions{
margin-top: auto !important;
padding: 14px !important;
display: flex !important;
flex-direction: column !important;
gap: 8px !important;
border-top: 1px solid var(--line) !important;
}
.sidebar .login-actions .btn{
justify-content: center !important;
text-align: center !important;
}
/* ===== v7.1 只显示头像内的 V ===== */
/* 先全部隐藏 */
.av-v{ display: none !important; }
/* 再恢复头像容器内的 V */
.avatar .av-v,
.avatar > .av-v,
.pf-avatar .av-v,
.pf-avatar > .av-v,
.lb-avatar .av-v,
.lb-avatar > .av-v{
display: flex !important;
}
/* 描述行里的 V（pf-v-icon）不受影响，保留显示 */
.pf-v-icon{
display: inline-flex !important;
visibility: visible !important;
opacity: 1 !important;
}
/* ===== v7.2 顶部 tab 链接（强制可点击） ===== */
.tab-links{
display:flex;
gap:4px;
}
.tab-link{
display:inline-flex;
align-items:center;
padding:6px 14px;
border-radius:8px;
font-size:0.9rem;
font-weight:600;
color:var(--muted);
text-decoration:none !important;
transition:all .15s;
cursor:pointer !important;
pointer-events:auto !important;
z-index:100 !important;
position:relative !important;
}
.tab-link:hover{
background:rgba(29,155,240,.1);
color:var(--text);
text-decoration:none !important;
}
.tab-link.active{
background:rgba(29,155,240,.15);
color:var(--primary);
font-weight:700;
}
/* topbar 不允许子元素被遮挡 */
.topbar{
z-index:50 !important;
position:sticky !important;
}
.topbar > *{
position:relative !important;
z-index:1 !important;
}
/* ===== 加精/置顶标识 ===== */
.post-flag{
display:inline-flex;
align-items:center;
gap:4px;
padding:2px 8px;
border-radius:5px;
font-size:0.68rem;
font-weight:700;
margin-right:6px;
vertical-align:middle;
position:relative;
top:-1px;
}
.post-flag i{ font-size:0.72rem; }
/* 置顶 — 蓝色 */
.flag-pin{
background:linear-gradient(135deg, rgba(29,155,240,.2), rgba(29,155,240,.08));
border:1px solid rgba(29,155,240,.45);
color:#5eb8f0;
box-shadow:0 2px 8px rgba(29,155,240,.15);
}
/* 精华 — 金色（加发光） */
.flag-feat{
background:linear-gradient(135deg, rgba(245,158,11,.25), rgba(245,158,11,.1));
border:1px solid rgba(245,158,11,.5);
color:#fcd34d;
box-shadow:0 2px 8px rgba(245,158,11,.25);
animation:featGlow 2.5s ease-in-out infinite;
}
@keyframes featGlow{
0%,100%{ box-shadow:0 2px 8px rgba(245,158,11,.25); }
50%{ box-shadow:0 2px 16px rgba(245,158,11,.6); }
}
/* ===== 美化 ADMIN / MOD 标签 ===== */
.role-tag{
display:inline-flex !important;
align-items:center;
gap:3px;
padding:1px 7px !important;
border-radius:4px !important;
font-size:0.62rem !important;
font-weight:800 !important;
letter-spacing:0.06em !important;
line-height:1.5 !important;
vertical-align:middle !important;
text-transform:uppercase;
white-space:nowrap;
flex-shrink:0;
position:relative;
margin-left:4px;
text-shadow:none !important;
font-family:-apple-system, "Segoe UI", Roboto, sans-serif !important;
}
/* ADMIN — 深红渐变 + 微光 */
.role-tag.role-admin{
background:linear-gradient(135deg, #dc2626 0%, #991b1b 100%) !important;
color:#fff !important;
border:1px solid rgba(255,255,255,.15) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.2),
0 1px 3px rgba(220,38,38,.4) !important;
}
.role-tag.role-admin::before{
content:'';
width:4px;
height:4px;
border-radius:50%;
background:#fff;
opacity:.8;
margin-right:3px;
box-shadow:0 0 4px #fff;
}
/* MOD — 紫色渐变 */
.role-tag.role-mod{
background:linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%) !important;
color:#fff !important;
border:1px solid rgba(255,255,255,.15) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.2),
0 1px 3px rgba(139,92,246,.4) !important;
}
.role-tag.role-mod::before{
content:'';
width:4px;
height:4px;
border-radius:50%;
background:#fff;
opacity:.8;
margin-right:3px;
box-shadow:0 0 4px #fff;
}
/* 自定义称号标签也顺便美化（小一点） */
.title-badge{
padding:1px 7px !important;
font-size:0.62rem !important;
font-weight:700 !important;
border-radius:4px !important;
line-height:1.5 !important;
}
.title-badge i{
font-size:0.68rem !important;
}
/* ===== 醒目的发帖大按钮 ===== */
.sidebar .btn-new-big{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
margin:20px 14px 16px;
padding:15px 24px;
border-radius:14px;
background:linear-gradient(135deg, #1d9bf0 0%, #7c3aed 100%);
color:#fff !important;
font-weight:800;
font-size:1.05rem;
letter-spacing:0.5px;
text-decoration:none !important;
transition:all .25s cubic-bezier(.4,0,.2,1);
box-shadow:
0 6px 20px rgba(29,155,240,.4),
inset 0 1px 0 rgba(255,255,255,.25);
position:relative;
overflow:hidden;
cursor:pointer;
border:none;
}
/* 掠过光效 */
.sidebar .btn-new-big::before{
content:'';
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
background:linear-gradient(
90deg,
transparent,
rgba(255,255,255,.35),
transparent
);
transition:left .6s;
}
.sidebar .btn-new-big:hover::before{
left:100%;
}
.sidebar .btn-new-big:hover{
transform:translateY(-2px);
box-shadow:
0 10px 28px rgba(29,155,240,.55),
inset 0 1px 0 rgba(255,255,255,.3);
text-decoration:none !important;
color:#fff !important;
}
.sidebar .btn-new-big:active{
transform:translateY(0);
}
.sidebar .btn-new-big i{
font-size:1.25rem;
}
.sidebar .btn-new-big span{
font-size:1rem;
font-weight:800;
}
/* 移动端：只显示图标 */
@media (max-width:768px){
.sidebar .btn-new-big{
margin:14px 8px;
padding:16px;
}
.sidebar .btn-new-big span{ display:none; }
}
/* ===== 回复引用 ===== */
.reply-quote{
display:inline-flex;
align-items:center;
gap:4px;
padding:2px 10px;
margin:6px 0 4px;
border-radius:9999px;
background:rgba(29,155,240,.08);
border-left:3px solid var(--primary);
font-size:0.78rem;
color:var(--muted);
transition:all .15s;
user-select:none;
}
.reply-quote:hover{
background:rgba(29,155,240,.15);
color:var(--text);
}
.reply-quote .reply-to{
color:var(--muted);
}
.reply-quote .reply-name{
color:var(--primary);
font-weight:700;
}
/* 评论列表滚动 */
#commentList{
scroll-margin-top:80px;
}
/* stat-icon 可点 */
.post-foot .stat-icon{
display:inline-flex;
align-items:center;
gap:4px;
padding:4px 8px;
border-radius:9999px;
color:var(--muted);
font-size:0.85rem;
text-decoration:none;
transition:all .15s;
}
.post-foot .stat-icon:hover{
background:rgba(29,155,240,.1);
color:var(--primary);
text-decoration:none;
}
/* 回复提示中的"取消" */
#replyHint b{ color:var(--primary); }
#replyHint a{ text-decoration:none; }
/* ===== 回复缩进（子评论） ===== */
/* 空状态 */
/* 评论输入区 */
.comment-form-wrap{ margin-top:20px; }
.comment-form{
padding:16px;
background:linear-gradient(135deg, rgba(56,189,248,.03), rgba(168,85,247,.02));
border:1px solid rgba(56,189,248,.15);
border-radius:14px;
}
.comment-form textarea{
width:100%;
background:rgba(0,0,0,.2);
border:1px solid rgba(255,255,255,.08);
border-radius:10px;
padding:12px 14px;
color:#e5eaf5;
font-size:0.95rem;
font-family:inherit;
resize:vertical;
outline:none;
transition:all .15s;
min-height:70px;
box-sizing:border-box;
}
.comment-form textarea:focus{
border-color:rgba(29,155,240,.5);
background:rgba(29,155,240,.05);
box-shadow:0 0 0 3px rgba(29,155,240,.1);
}
.comment-form textarea::placeholder{
color:rgba(148,163,184,.5);
}
.comment-toolbar{
display:flex;
justify-content:space-between;
align-items:center;
margin-top:12px;
gap:10px;
flex-wrap:wrap;
}
.comment-tools{
display:flex;
align-items:center;
gap:10px;
flex-wrap:wrap;
}
.comment-tool-btn{
display:inline-flex;
align-items:center;
gap:4px;
padding:5px 12px;
border-radius:9999px;
background:rgba(29,155,240,.08);
border:1px solid rgba(29,155,240,.25);
color:#5eb8f0;
font-size:0.82rem;
font-weight:600;
cursor:pointer;
transition:all .15s;
}
.comment-tool-btn:hover{
background:rgba(29,155,240,.15);
border-color:rgba(29,155,240,.5);
}
.comment-hint{
color:rgba(148,163,184,.55);
font-size:0.72rem;
}
.btn-send{
display:inline-flex;
align-items:center;
gap:6px;
padding:8px 22px;
border-radius:9999px;
background:linear-gradient(135deg,#1d9bf0,#7c3aed);
color:#fff;
border:none;
font-weight:700;
font-size:0.9rem;
cursor:pointer;
transition:all .2s;
font-family:inherit;
box-shadow:0 4px 12px rgba(29,155,240,.35);
}
.btn-send:hover{
transform:translateY(-1px);
box-shadow:0 6px 20px rgba(29,155,240,.5);
}
.btn-send:active{ transform:translateY(0); }
/* ===== 回复区（B站风格：整体缩进，无竖线） ===== */
/* 回复头像：跟主评论一样大！ */
/* 展开/收起按钮 */
/* 空状态 */
/* ===== 页脚版权 ===== */
.forum-footer{
margin-top:auto;
padding:24px 20px;
border-top:1px solid var(--line);
background:linear-gradient(180deg, rgba(0,0,0,.2), rgba(0,0,0,.4));
}
.forum-footer-inner{
display:flex;
justify-content:center;
align-items:center;
gap:12px;
flex-wrap:wrap;
color:var(--muted);
font-size:0.82rem;
}
.forum-footer-inner b{
font-weight:700;
}
.forum-footer-inner .sep{
color:rgba(148,163,184,.3);
}
/* 管理后台页脚 */
.admin-footer{
display:flex;
justify-content:space-between;
align-items:center;
padding:16px 32px;
margin-top:20px;
border-top:1px solid var(--line);
color:var(--muted);
font-size:0.82rem;
flex-wrap:wrap;
gap:10px;
}
.admin-footer b{
color:#5eb8f0;
font-weight:700;
}
/* ===== 待受理卡片 ===== */
.pending-block{
background:linear-gradient(135deg, rgba(15,22,40,.9), rgba(20,30,55,.7));
border:1px solid rgba(56,189,248,.15);
border-radius:16px;
padding:20px;
margin-bottom:20px;
backdrop-filter:blur(10px);
}
.pending-title{
display:flex;
align-items:center;
gap:8px;
font-size:0.92rem;
font-weight:700;
color:#cbd5e1;
letter-spacing:.05em;
text-transform:uppercase;
margin-bottom:14px;
padding-left:12px;
position:relative;
}
.pending-title::before{
content:'';
position:absolute;
left:0;
top:50%;
transform:translateY(-50%);
width:3px;
height:14px;
border-radius:2px;
background:linear-gradient(180deg, #38bdf8, #a855f7);
}
.pending-title i{
color:#38bdf8;
}
.pending-grid{
display:grid;
grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
gap:14px;
}
.pending-card{
display:flex;
align-items:center;
gap:14px;
padding:16px 18px;
border-radius:12px;
background:rgba(255,255,255,.025);
border:1px solid rgba(255,255,255,.06);
text-decoration:none;
color:inherit;
transition:all .25s;
position:relative;
overflow:hidden;
}
.pending-card:hover{
transform:translateY(-2px);
background:rgba(255,255,255,.04);
border-color:rgba(56,189,248,.4);
box-shadow:0 6px 20px rgba(56,189,248,.15);
text-decoration:none;
color:inherit;
}
.pending-card.has-pending{
background:linear-gradient(135deg, rgba(239,68,68,.1), rgba(239,68,68,.02));
border-color:rgba(239,68,68,.35);
}
.pending-card.has-pending.orange{
background:linear-gradient(135deg, rgba(245,158,11,.1), rgba(245,158,11,.02));
border-color:rgba(245,158,11,.35);
}
.pending-card.has-pending:hover{
border-color:rgba(239,68,68,.7);
box-shadow:0 6px 24px rgba(239,68,68,.25);
}
.pending-card.has-pending.orange:hover{
border-color:rgba(245,158,11,.7);
box-shadow:0 6px 24px rgba(245,158,11,.25);
}
.pending-icon{
width:44px;
height:44px;
border-radius:12px;
display:flex;
align-items:center;
justify-content:center;
font-size:1.3rem;
flex-shrink:0;
background:linear-gradient(135deg, rgba(239,68,68,.2), rgba(239,68,68,.05));
color:#ff7b84;
border:1px solid rgba(239,68,68,.3);
}
.pending-icon.orange{
background:linear-gradient(135deg, rgba(245,158,11,.2), rgba(245,158,11,.05));
color:#fbbf24;
border-color:rgba(245,158,11,.3);
}
.pending-icon.gray{
background:linear-gradient(135deg, rgba(148,163,184,.15), rgba(148,163,184,.05));
color:#cbd5e1;
border-color:rgba(148,163,184,.2);
}
.pending-body{
flex:1;
min-width:0;
}
.pending-num{
font-size:1.6rem;
font-weight:900;
line-height:1;
color:#cbd5e1;
font-family:"SF Mono", "Courier New", monospace;
}
.pending-card.has-pending .pending-num{
background:linear-gradient(135deg, #ff7b84, #ef4444);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;
}
.pending-card.has-pending.orange .pending-num{
background:linear-gradient(135deg, #fbbf24, #d97706);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;
}
.pending-label{
color:var(--muted);
font-size:0.78rem;
margin-top:4px;
font-weight:600;
letter-spacing:.02em;
}
.pending-dot{
position:absolute;
top:12px;
right:12px;
width:8px;
height:8px;
border-radius:50%;
background:#ef4444;
box-shadow:0 0 8px #ef4444;
animation:badgePulse 1.5s ease-in-out infinite;
}
.pending-dot.orange{
background:#f59e0b;
box-shadow:0 0 8px #f59e0b;
}
@keyframes badgePulse{
0%,100%{ transform:scale(1); opacity:1; }
50%{ transform:scale(1.3); opacity:.7; }
}
/* ===== 评论/回复认证描述行 ===== */
.comments .cv-line,
.reply-item .reply-cv-line{
font-size:0.72rem;
color:rgba(148,163,184,.7);
margin-bottom:6px;
line-height:1.4;
display:block;
}
.comments .chead .av-v,
.reply-head .av-v{
flex-shrink:0;
}
/* ===== 新评论提示条 ===== */
.new-comments-banner{
display: none;
align-items: center;
justify-content: center;
gap: 6px;
padding: 10px 16px;
margin: 10px 0 4px;
border-radius: 10px;
background: linear-gradient(135deg, rgba(29,155,240,.15), rgba(29,155,240,.06));
border: 1px solid rgba(29,155,240,.4);
color: #5eb8f0;
font-size: 0.88rem;
font-weight: 600;
cursor: pointer;
transition: all .2s;
user-select: none;
animation: bannerPulse 2s ease-in-out infinite;
}
.new-comments-banner:hover{
background: linear-gradient(135deg, rgba(29,155,240,.25), rgba(29,155,240,.1));
transform: translateY(-1px);
box-shadow: 0 4px 14px rgba(29,155,240,.3);
}
.new-comments-banner i{
font-size: 1rem;
}
@keyframes bannerPulse{
0%, 100%{ box-shadow: 0 0 0 0 rgba(29,155,240,.4); }
50%{ box-shadow: 0 0 0 4px rgba(29,155,240,0); }
}
/* ===== 页脚右对齐美化 ===== */
.forum-footer{
margin-top:auto !important;
padding:16px 24px 14px !important;
border-top:1px solid rgba(255,255,255,.05) !important;
background:transparent !important;
display:flex !important;
justify-content:flex-end !important;
align-items:center !important;
}
.forum-footer-inner{
display:flex !important;
justify-content:flex-end !important;
align-items:center !important;
gap:8px !important;
flex-wrap:wrap !important;
color:rgba(148,163,184,.55) !important;
font-size:0.78rem !important;
letter-spacing:.02em !important;
font-family:-apple-system, "Segoe UI", Roboto, sans-serif !important;
}
.forum-footer-inner b{
color:#5eb8f0 !important;
font-weight:700 !important;
}
.forum-footer-inner .sep{
color:rgba(148,163,184,.25) !important;
font-size:0.9rem !important;
}
/* ===== 右侧栏底部版权 — 居中 ===== */
.right{
display:flex !important;
flex-direction:column !important;
}
.right-footer{
margin-top:auto !important;
padding:16px 0 8px !important;
border-top:1px solid rgba(255,255,255,.05) !important;
color:rgba(148,163,184,.5) !important;
font-size:0.7rem !important;
line-height:1.7 !important;
text-align:center !important;
letter-spacing:.02em !important;
}
.right-footer > div{
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
text-align:center !important;
}
.right-footer b{
color:#5eb8f0 !important;
font-weight:700 !important;
}
@media (max-width: 1024px){
.right-footer{ display:none !important; }
}
/* ===== 品牌名自适应 ===== */
.sidebar .brand .nav-text,
.topnav .logo span{
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
max-width:180px;
display:inline-block;
vertical-align:middle;
}
.right-footer > div{
white-space:normal !important;
overflow:visible !important;
text-overflow:clip !important;
line-height:1.5;
}
/* ===== 品牌区重做 ===== */
.sidebar .brand{
display:flex !important;
align-items:center !important;
gap:10px !important;
padding:14px 12px !important;
margin-bottom:12px !important;
border-bottom:1px solid rgba(255,255,255,.05) !important;
text-decoration:none !important;
transition:background .15s !important;
border-radius:10px !important;
}
.sidebar .brand:hover{
background:rgba(29,155,240,.06) !important;
}
.sidebar .brand-logo{
width:38px !important;
height:38px !important;
min-width:38px !important;
border-radius:10px !important;
background:linear-gradient(135deg, #1d9bf0, #7c3aed) !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
font-size:1.2rem !important;
color:#fff !important;
box-shadow:0 4px 12px rgba(29,155,240,.35) !important;
flex-shrink:0;
}
.sidebar .brand-text{
flex:1;
min-width:0;
display:flex;
flex-direction:column;
gap:1px;
}
.sidebar .brand-title{
font-size:1rem !important;
font-weight:800 !important;
color:var(--text) !important;
letter-spacing:.06em !important;
line-height:1.2 !important;
white-space:nowrap;
}
.sidebar .brand-sub{
font-size:0.68rem !important;
font-weight:500 !important;
color:rgba(148,163,184,.7) !important;
letter-spacing:.02em !important;
line-height:1.2 !important;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
/* 移动端收起只显示图标 */
@media (max-width:768px){
.sidebar .brand{
justify-content:center;
padding:12px !important;
}
.sidebar .brand-text{ display:none; }
}
/* ============================================================
v8.0 移动端适配 - 论坛
============================================================ */
/* 通用：防止 iOS 输入框自动缩放 */
@media (max-width: 768px) {
input, textarea, select {
font-size: 16px !important;
}
}
@media (max-width: 768px) {
/* ---------- 布局：侧栏变底部 Tab ---------- */
.layout {
flex-direction: column !important;
padding-bottom: 64px !important;
}
.sidebar {
position: fixed !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
top: auto !important;
width: 100% !important;
height: 62px !important;
flex-direction: row !important;
padding: 0 !important;
border-right: none !important;
border-top: 1px solid var(--line) !important;
background: rgba(15,20,25,.98) !important;
backdrop-filter: blur(12px) !important;
overflow-x: auto !important;
overflow-y: hidden !important;
z-index: 999 !important;
gap: 0 !important;
}
.sidebar::-webkit-scrollbar { display: none; }
.sidebar .brand,
.sidebar .btn-new,
.sidebar .me,
.sidebar .login-actions {
display: none !important;
}
.sidebar nav {
display: flex !important;
width: 100% !important;
flex-direction: row !important;
}
.sidebar nav a {
flex: 1 0 auto !important;
min-width: 72px !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
gap: 2px !important;
padding: 8px 4px !important;
border-radius: 0 !important;
font-size: 0.68rem !important;
background: transparent !important;
color: var(--muted) !important;
white-space: nowrap !important;
}
.sidebar nav a.active {
background: transparent !important;
color: var(--primary) !important;
}
.sidebar nav a .nav-text {
display: block !important;
font-size: 0.68rem !important;
}
.sidebar nav a i {
font-size: 1.15rem !important;
width: auto !important;
}
/* ---------- 主内容区 ---------- */
.main {
max-width: 100% !important;
border-right: none !important;
}
.right {
display: none !important;
}
.topbar {
padding: 12px 14px !important;
}
.topbar h2 {
font-size: 1.05rem !important;
}
/* ---------- 帖子列表 ---------- */
.post {
padding: 14px 14px !important;
}
.post-title {
font-size: 1rem !important;
}
.post-excerpt {
font-size: 0.85rem !important;
}
.post-foot {
gap: 10px !important;
font-size: 0.78rem !important;
flex-wrap: wrap !important;
}
.post .avatar.sm,
.post-head .avatar.sm {
width: 32px !important;
height: 32px !important;
font-size: 0.82rem !important;
}
.post-head {
font-size: 0.82rem !important;
gap: 5px !important;
}
.react-btn {
padding: 3px 8px !important;
font-size: 0.78rem !important;
}
/* ---------- 帖子详情 ---------- */
.post-detail {
padding: 14px !important;
}
.pd-title {
font-size: 1.3rem !important;
line-height: 1.35 !important;
}
.pd-body {
font-size: 0.95rem !important;
line-height: 1.75 !important;
}
.pd-author-card {
flex-direction: row !important;
gap: 12px !important;
padding: 14px !important;
}
.pd-author-card .avatar {
width: 44px !important;
height: 44px !important;
font-size: 1.1rem !important;
}
.pd-author-name {
font-size: 0.98rem !important;
}
.pd-verify-line {
font-size: 0.78rem !important;
}
.pd-badges {
gap: 6px !important;
}
.pd-badge {
font-size: 0.72rem !important;
padding: 2px 10px !important;
}
/* ---------- 操作栏 ---------- */
.pd-actions {
padding: 12px !important;
gap: 8px !important;
}
.pd-action-btn {
padding: 7px 12px !important;
font-size: 0.82rem !important;
gap: 4px !important;
}
.pd-action-btn em {
display: none !important;
}
.pd-action-btn i {
font-size: 1rem !important;
}
.pd-stat {
font-size: 0.82rem !important;
padding: 0 4px !important;
}
/* ---------- 评论区 ---------- */
.comments-head h3 {
font-size: 0.95rem !important;
}
.comments .comment {
gap: 10px !important;
padding: 14px 0 12px !important;
}
.comments .comment > .avatar.sm {
width: 36px !important;
height: 36px !important;
min-width: 36px !important;
max-width: 36px !important;
font-size: 0.85rem !important;
}
.comments .chead {
font-size: 0.82rem !important;
}
.comments .ctext {
font-size: 0.9rem !important;
}
.comments .cactions {
gap: 12px !important;
font-size: 0.75rem !important;
}
.comments .cactions .c-time {
font-size: 0.72rem !important;
}
/* 回复缩进在手机上小一点 */
.comments .replies-wrap {
margin-left: 30px !important;
}
.reply-item {
gap: 8px !important;
padding: 8px 0 !important;
}
.reply-avatar {
width: 32px !important;
height: 32px !important;
min-width: 32px !important;
max-width: 32px !important;
font-size: 0.82rem !important;
}
.reply-head .reply-name {
font-size: 0.8rem !important;
}
.reply-content {
font-size: 0.88rem !important;
}
/* ---------- 评论输入框 ---------- */
.comment-form {
padding: 12px !important;
}
.comment-form textarea {
min-height: 60px !important;
font-size: 16px !important;
}
.comment-toolbar {
gap: 8px !important;
}
.comment-hint {
display: none !important;
}
/* ---------- 顶部 Tabs ---------- */
.tabs {
overflow-x: auto !important;
-webkit-overflow-scrolling: touch !important;
}
.tab {
padding: 12px 14px !important;
font-size: 0.85rem !important;
}
.tab-links {
gap: 2px !important;
}
.tb-link {
padding: 5px 10px !important;
font-size: 0.82rem !important;
}
/* ---------- 侧栏横向滑动条 ---------- */
.sidebar nav::-webkit-scrollbar { height: 0; }
}
/* 更小屏幕 */
@media (max-width: 480px) {
.sidebar nav a {
min-width: 60px !important;
font-size: 0.62rem !important;
}
.sidebar nav a .nav-text {
font-size: 0.62rem !important;
}
.pd-title {
font-size: 1.15rem !important;
}
.comments .replies-wrap {
margin-left: 20px !important;
}
}
/* ============ V 标显示修复（评论/回复/帖子作者行） ============ */
/* 这些位置的 V 标不属于头像内嵌，需要强制显示，并且位置改成 static，避免被 absolute 定位到错地方 */
.chead > .av-v,
.chead .av-v,
.reply-head > .av-v,
.reply-head .av-v,
.cv-line .av-v,
.reply-cv-line .av-v,
.pd-verify-line .av-v,
.pd-author .av-v,
.pd-author > .av-v,
.post-head .av-v,
.post-author .av-v,
.author-line .av-v {
display: inline-flex !important;
position: static !important;
width: 14px !important;
height: 14px !important;
min-width: 14px !important;
max-width: 14px !important;
font-size: 8px !important;
border-width: 1px !important;
border-style: solid !important;
border-color: transparent !important;
border-radius: 50% !important;
align-items: center !important;
justify-content: center !important;
flex-shrink: 0 !important;
margin-left: 4px !important;
vertical-align: middle !important;
font-family: Georgia, serif !important;
font-style: italic !important;
font-weight: 900 !important;
color: #fff !important;
text-shadow: 0 1px 2px rgba(0,0,0,.4) !important;
}
/* 颜色（若原样式被覆盖，这里兜底） */
.chead .av-v.yellow, .reply-head .av-v.yellow, .cv-line .av-v.yellow,
.reply-cv-line .av-v.yellow, .pd-verify-line .av-v.yellow,
.pd-author .av-v.yellow, .author-line .av-v.yellow {
background: linear-gradient(135deg, #fbbf24, #d97706) !important;
color: #3d2400 !important;
}
.chead .av-v.gray, .reply-head .av-v.gray, .cv-line .av-v.gray,
.reply-cv-line .av-v.gray, .pd-verify-line .av-v.gray,
.pd-author .av-v.gray, .author-line .av-v.gray {
background: linear-gradient(135deg, #9ca3af, #374151) !important;
}
.chead .av-v.red, .reply-head .av-v.red, .cv-line .av-v.red,
.reply-cv-line .av-v.red, .pd-verify-line .av-v.red,
.pd-author .av-v.red, .author-line .av-v.red {
background: linear-gradient(135deg, #ff7070, #b91c1c) !important;
}
.chead .av-v.blue, .reply-head .av-v.blue, .cv-line .av-v.blue,
.reply-cv-line .av-v.blue, .pd-verify-line .av-v.blue,
.pd-author .av-v.blue, .author-line .av-v.blue {
background: linear-gradient(135deg, #60a5fa, #1e40af) !important;
}
/* V 标溢出修复 */
.avatar.sm, .avatar, .pf-avatar, .lb-avatar, .reply-avatar {
overflow: visible !important;
position: relative !important;
}
.avatar .av-v, .avatar.sm .av-v, .pf-avatar .av-v, .lb-avatar .av-v, .reply-avatar .av-v {
display: inline-flex !important;
position: absolute !important;
bottom: 0 !important;
right: 0 !important;
z-index: 9 !important;
}
/* ===== avatar+v fix ===== */
.avatar, .avatar.sm, .avatar.lg,
.reply-avatar, .pf-avatar, .lb-avatar {
position: relative !important;
overflow: visible !important;
}
/* ===== pf-avatar V fix ===== */
.pf-avatar {
position: relative !important;
overflow: visible !important;
}
.pf-avatar > .av-v,
.pf-avatar .av-v {
position: absolute !important;
bottom: 6px !important;
right: 6px !important;
top: auto !important;
left: auto !important;
width: 30px !important;
height: 30px !important;
min-width: 30px !important;
max-width: 30px !important;
font-size: 16px !important;
border: 3.5px solid var(--bg, #0f1419) !important;
display: inline-flex !important;
z-index: 9 !important;
}