/* ============================================================================
   YONETIX 视觉精修层 (polish.css)
   ---------------------------------------------------------------------------
   定位: 在 app.css 之后加载, 只做「观感」增强 —— 层次、留白、动效、光感。
         不改任何布局结构与类名, 业务逻辑零依赖, 出问题直接删这一行即可回滚。
   内容: 1 全局质感  2 侧栏  3 顶栏/搜索  4 发帖框  5 帖子与媒体
         6 右栏卡片  7 钱包/SVIP  8 按钮与表单  9 表格徽章
        10 视频播放器与弹幕  11 后台  12 移动端
   ============================================================================ */

:root{
  --sh-1: 0 1px 2px rgba(0,0,0,.35);
  --sh-2: 0 1px 2px rgba(0,0,0,.28), 0 10px 30px -14px rgba(0,0,0,.65);
  --sh-3: 0 2px 6px rgba(0,0,0,.3), 0 22px 48px -22px rgba(0,0,0,.75);
  --glow-accent: 0 6px 20px -8px rgba(251,114,153,.75);
  --grad-accent: linear-gradient(135deg,#ff9ab8 0%,#fb7299 48%,#ee5a86 100%);
  --grad-gold:   linear-gradient(135deg,#ffd89b 0%,#ffc46b 46%,#e8a13c 100%);
  --ring: 0 0 0 3px rgba(251,114,153,.22);
  --hairline: rgba(255,255,255,.07);
}
:root[data-theme="light"]{
  --sh-1: 0 1px 2px rgba(15,20,25,.06);
  --sh-2: 0 1px 2px rgba(15,20,25,.05), 0 12px 28px -16px rgba(15,20,25,.22);
  --sh-3: 0 2px 6px rgba(15,20,25,.07), 0 22px 44px -24px rgba(15,20,25,.3);
  --glow-accent: 0 6px 18px -8px rgba(242,84,125,.55);
  --grad-accent: linear-gradient(135deg,#ff8fae 0%,#f2547d 50%,#e0416c 100%);
  --grad-gold:   linear-gradient(135deg,#f7cf8b 0%,#e2a94a 50%,#c88c25 100%);
  --ring: 0 0 0 3px rgba(242,84,125,.18);
  --hairline: rgba(15,20,25,.06);
}

/* ---------------------------------------------------------------------------
   1. 全局质感: 选中色 / 滚动条 / 按压反馈 / 焦点可见性
   --------------------------------------------------------------------------- */
::selection{background:rgba(251,114,153,.32);color:var(--text)}
:root[data-theme="light"] ::selection{background:rgba(242,84,125,.22)}

/* 桌面端细滚动条(原来完全隐藏, 长页面无法感知可滚动) */
@media (min-width:701px){
  .main,.right,.app{scrollbar-width:thin;scrollbar-color:rgba(120,130,140,.45) transparent}
  .main::-webkit-scrollbar,.right::-webkit-scrollbar,.tscroll::-webkit-scrollbar{width:9px;height:9px}
  .main::-webkit-scrollbar-track,.right::-webkit-scrollbar-track,.tscroll::-webkit-scrollbar-track{background:transparent}
  .main::-webkit-scrollbar-thumb,.right::-webkit-scrollbar-thumb,.tscroll::-webkit-scrollbar-thumb{
    background:rgba(120,130,140,.38);border-radius:99px;
    border:2px solid transparent;background-clip:content-box;
  }
  .main::-webkit-scrollbar-thumb:hover,.right::-webkit-scrollbar-thumb:hover,
  .tscroll::-webkit-scrollbar-thumb:hover{background:rgba(150,160,170,.6);background-clip:content-box}
}

/* 可点击元素统一按压感(键盘 Tab 也有明确焦点框) */
a,button,[role="button"],.chip,.segbtn,.act,.tool,.nav-item,.post-btn,.btn{ -webkit-tap-highlight-color:transparent }
a:active,button:active,.chip:active,.segbtn:active,.btn:active,.post-btn:active{transform:translateY(.5px) scale(.995)}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:10px}

/* ---------------------------------------------------------------------------
   2. 侧栏: 更紧凑的节奏 + 明确的选中指示条 + 有质感的发帖按钮
   --------------------------------------------------------------------------- */
@media (min-width:701px){
  .side{padding:10px 14px 18px}

  .brand{min-height:56px;padding:6px 10px}
  .brand .wordmark{
    font-size:20px;letter-spacing:.4px;
    background:linear-gradient(135deg,#63c8ff,#a48bff 52%,#ff8ac6);
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
    filter:saturate(1.05);
  }

  .nav{gap:3px}
  .nav-item{
    position:relative;
    gap:14px;padding:10px 14px;
    font-size:17px;font-weight:600;letter-spacing:.1px;
    border-radius:14px;
    transition:background .18s var(--ease),color .18s var(--ease),transform .18s var(--ease);
  }
  .nav-item svg{transition:transform .18s var(--ease),color .18s var(--ease)}
  .nav-item:hover{background:var(--bg-hover);transform:translateX(2px)}
  .nav-item:hover svg{color:var(--accent);transform:scale(1.06)}
  .nav-item.on{
    color:var(--accent);font-weight:750;
    background:var(--accent-h);
  }
  /* 选中态左侧指示条 */
  .nav-item.on::before{
    content:"";position:absolute;left:-4px;top:50%;
    width:4px;height:24px;border-radius:3px;
    transform:translateY(-50%);
    background:var(--grad-accent);
    box-shadow:var(--glow-accent);
  }
  .nav-item.on:hover{transform:none}
  .nav-item.on:hover svg{transform:none}
  .nav-item .badge{
    box-shadow:0 2px 8px -2px rgba(251,114,153,.9);
    font-variant-numeric:tabular-nums;
  }

  .post-btn{
    margin-top:14px;padding:14px 0;
    font-size:16px;letter-spacing:.3px;
    background:var(--grad-accent);
    box-shadow:var(--glow-accent);
    transition:transform .18s var(--ease),box-shadow .18s var(--ease),filter .18s var(--ease);
  }
  .post-btn svg{display:block}
  .post-btn:hover{filter:brightness(1.06);transform:translateY(-1px);
    box-shadow:0 10px 26px -8px rgba(251,114,153,.85)}
  .post-btn:active{transform:translateY(0) scale(.99)}

  .side-foot{border-top:1px solid var(--hairline);padding-top:10px;margin-top:auto}
  .side-foot .nav-item{
    font-size:14.5px;font-weight:500;padding:9px 12px;border-radius:12px;gap:12px;color:var(--text-dim);
  }
  .side-foot .nav-item:hover{color:var(--text);transform:translateX(1px)}
  .side-foot .nav-item.on{color:var(--accent);background:var(--accent-h)}
  .side-foot .nav-item.on::before{display:none}
  .side-foot .nav-item .avatar{box-shadow:0 0 0 1px var(--hairline)}
}

/* ---------------------------------------------------------------------------
   3. 顶栏 / 搜索: 玻璃感更干练, 底部分隔线带品牌渐变
   --------------------------------------------------------------------------- */
.topbar{
  padding:11px 16px;
  background:var(--bg-blur);
  border-bottom:1px solid var(--border);
  box-shadow:0 1px 0 rgba(255,255,255,.03), 0 8px 24px -22px rgba(0,0,0,.9);
}
.topbar h1{font-size:20px;letter-spacing:-.2px}
.back-btn{
  width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;color:var(--text);
  transition:background .16s var(--ease),transform .16s var(--ease);
}
.back-btn:hover{background:var(--bg-hover);transform:translateX(-1px)}

.search input{
  border-color:var(--border);
  background:var(--bg-elev);
  transition:border-color .2s var(--ease),background .2s var(--ease),box-shadow .2s var(--ease);
}
.search input:hover{border-color:rgba(120,130,140,.45)}
.search input:focus{border-color:var(--accent);box-shadow:var(--ring);background:var(--bg)}

/* ---------------------------------------------------------------------------
   4. 发帖框: 输入区留白呼吸感, 发表按钮有分量
   --------------------------------------------------------------------------- */
.composer{padding:14px 16px 6px}
.composer textarea{font-size:19px;line-height:1.45}
.composer textarea::placeholder{color:var(--text-dim);transition:opacity .2s var(--ease)}
.composer textarea:focus::placeholder{opacity:.55}
.composer-bar{border-top:1px solid var(--hairline);margin-top:8px;padding:10px 0 12px}
.tool{width:34px;height:34px;color:var(--accent);opacity:.92}
.tool:hover{opacity:1;background:var(--accent-h);transform:translateY(-1px)}
.send{
  padding:8px 22px;letter-spacing:.4px;
  background:var(--grad-accent);box-shadow:var(--glow-accent);
  transition:filter .16s var(--ease),transform .16s var(--ease),opacity .16s var(--ease);
}
.send:not(:disabled):hover{filter:brightness(1.07);transform:translateY(-1px)}
.send:disabled{background:var(--bg-elev);color:var(--text-mute);box-shadow:none;opacity:.75}

/* 分段选择(原创/转载/二创): 选中项用渐变+细阴影, 更像实体开关 */
.seg{border-color:var(--border);background:var(--bg-elev);box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.segbtn{border-radius:var(--pill)}
.segbtn.on{background:var(--grad-accent);color:#fff;
  box-shadow:0 2px 10px -4px rgba(251,114,153,.9)}
.segbtn.on:hover{filter:brightness(1.05)}

/* ---------------------------------------------------------------------------
   5. 帖子与媒体: 悬停有回应, 图片/视频统一圆角
   --------------------------------------------------------------------------- */
.post{
  position:relative;
  padding:14px 16px;
  transition:background .18s var(--ease);
}
.post:hover{
  background:
    linear-gradient(90deg,var(--accent) 0 2px,transparent 2px) left top/100% 100% no-repeat,
    rgba(255,255,255,.025);
}
:root[data-theme="light"] .post:hover{
  background:
    linear-gradient(90deg,var(--accent) 0 2px,transparent 2px) left top/100% 100% no-repeat,
    rgba(15,20,25,.022);
}
.post .head{gap:5px}
.post .nick{letter-spacing:.1px}
.post .text{margin-top:4px;line-height:1.5}
.post .acts{margin-top:10px}
.post .act>svg{padding:7px}
.post .act .n{font-size:12.5px}

/* 图片宫格: 细描边 + 悬停轻微放大, 避免死板 */
.grid2,.grid3,.grid4,.grid6,.grid8{
  border:1px solid var(--hairline);
  box-shadow:var(--sh-1);
}
.grid2>*,.grid3>*,.grid4>*,.grid6>*,.grid8>*{border:0;overflow:hidden}
.grid2>img,.grid3>img,.grid4>img,.grid6>img,.grid8>img,.grid2>a>img{
  transition:transform .35s var(--ease);
}
.grid2>img:hover,.grid3>img:hover,.grid4>img:hover,
.grid6>img:hover,.grid8>img:hover{transform:scale(1.02)}

/* 单图/视频容器统一圆角与描边 */
.vcard,.vplayer-box,.vlong-post,.vshort-post{
  border-radius:16px;
}

/* ---------------------------------------------------------------------------
   6. 右栏卡片: 描边 + 阴影 + 标题渐变竖条, 与中栏拉开层次
   --------------------------------------------------------------------------- */
@media (min-width:1061px){
  .card{
    position:relative;
    padding:14px 16px;
    border:1px solid var(--hairline);
    box-shadow:var(--sh-2);
    transition:border-color .2s var(--ease),box-shadow .2s var(--ease),transform .2s var(--ease);
  }
  .card:hover{border-color:rgba(251,114,153,.28);box-shadow:var(--sh-3)}
  .card>h2{
    font-size:17px;letter-spacing:-.1px;
    display:flex;align-items:center;gap:8px;
  }
  .card>h2::before{
    content:"";width:3px;height:15px;border-radius:2px;
    background:var(--grad-accent);flex:0 0 auto;
  }
  .card.tip{border-style:dashed;box-shadow:none}
  .card.tip:hover{transform:none}
  /* 金色主题(SVIP)下, 后续卡片的标题竖条也跟着变金 */
  .hero.gold ~ .card>h2::before{background:var(--grad-gold)}
  .trend{padding:9px 8px;margin:0 -8px;border-radius:10px;transition:background .16s var(--ease)}
  .trend:hover{background:var(--bg-hover);opacity:1}
  .follow{padding:10px 0}
  .follow-btn{background:var(--accent);color:#fff;box-shadow:var(--sh-1)}
  .follow-btn:hover{background:var(--accent-btn-h);filter:brightness(1.04)}
  /* 右栏数据卡: 350px 宽度里塞三列统计, 避免第三项换行留白 */
  .right .card .hstats{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .right .card .hstat{padding:8px 9px}
  .right .card .hstat .k{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .right .card .hstat .v{font-size:14.5px;white-space:nowrap}
  /* 右栏「标签 + 值」元信息行(帖子/主页/设置): 两端对齐, 数值右置加粗 */
  .right .card .trend:has(.t2){
    display:flex;align-items:baseline;justify-content:space-between;gap:10px;
    padding:9px 0;border-bottom:1px solid var(--hairline);
  }
  .right .card .trend:has(.t2):last-child{border-bottom:0}
  .right .card .trend:has(.t2) .t1{font-size:12.5px;color:var(--text-dim);line-height:1.45;flex:0 0 auto}
  .right .card .trend:has(.t2) .t2{
    font-size:14.5px;font-weight:750;text-align:right;
    font-variant-numeric:tabular-nums;letter-spacing:-.1px;
  }
}

/* ---------------------------------------------------------------------------
   7. 钱包 / SVIP hero: 光斑 + 数字渐变 + 统计块
   --------------------------------------------------------------------------- */
.hero{
  padding:20px 18px 16px;
  border-radius:18px;
  box-shadow:var(--sh-2);
  background-image:
    radial-gradient(130% 150% at 100% 0%, rgba(251,114,153,.28) 0%, rgba(251,114,153,0) 58%),
    radial-gradient(90% 120% at 0% 100%, rgba(120,140,255,.10) 0%, rgba(120,140,255,0) 60%),
    linear-gradient(160deg,#1e2126 0%,#111315 100%);
}
:root[data-theme="light"] .hero{
  background-image:
    radial-gradient(130% 150% at 100% 0%, rgba(242,84,125,.20) 0%, rgba(242,84,125,0) 58%),
    radial-gradient(90% 120% at 0% 100%, rgba(90,120,255,.08) 0%, rgba(90,120,255,0) 60%),
    linear-gradient(160deg,#ffffff 0%,#f4f6f8 100%);
}
.hero.gold{box-shadow:0 1px 2px rgba(0,0,0,.3),0 14px 34px -18px rgba(255,196,107,.55)}
.hero .hv{
  font-size:40px;letter-spacing:-1px;
  background:linear-gradient(180deg,#ffffff 0%,#d6dae0 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
:root[data-theme="light"] .hero .hv{
  background:linear-gradient(180deg,#0f1419 0%,#3a444f 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.hero.gold .hv{
  background:var(--grad-gold);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.hero-ico{
  border-radius:15px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 6px 16px -10px rgba(251,114,153,.9);
}
.hstat{
  border-color:var(--hairline);
  transition:border-color .18s var(--ease),background .18s var(--ease),transform .18s var(--ease);
}
.hstat:hover{border-color:rgba(251,114,153,.3);transform:translateY(-1px)}
.hstat .v{letter-spacing:-.2px}
.bene-i{transition:border-color .18s var(--ease),transform .18s var(--ease),box-shadow .18s var(--ease)}
.bene-i:hover{border-color:rgba(251,114,153,.3);transform:translateY(-1px);box-shadow:var(--sh-1)}

/* ---------------------------------------------------------------------------
   8. 按钮与表单: 主按钮渐变, 次按钮玻璃, 输入框聚焦光圈
   --------------------------------------------------------------------------- */
.btn{
  border-radius:var(--pill);
  background:var(--grad-accent);color:#fff;
  box-shadow:var(--glow-accent);
  font-weight:700;letter-spacing:.3px;
  transition:filter .16s var(--ease),transform .16s var(--ease),box-shadow .16s var(--ease);
}
.btn:hover{filter:brightness(1.06);transform:translateY(-1px);
  box-shadow:0 10px 24px -10px rgba(251,114,153,.9)}
.btn.ghost,.btn.sm.ghost{
  background:rgba(255,255,255,.06);color:var(--text);
  border:1px solid var(--border);box-shadow:none;
}
:root[data-theme="light"] .btn.ghost{background:rgba(15,20,25,.04)}
.btn.ghost:hover{background:var(--bg-hover);border-color:var(--accent);color:var(--accent)}
.btn.danger{background:linear-gradient(135deg,#ff8080,#e5484d);box-shadow:0 6px 18px -8px rgba(229,72,77,.8)}

.field input[type=number],.field input[type=text],
.field input[type=password],.field textarea,.field select{
  border-radius:12px;
  /* 暗色下 --panel 与卡片同色, 输入框像"黑洞"; 提亮背景+描边让边界清楚 */
  background:rgba(255,255,255,.045);
  border-color:rgba(255,255,255,.12);
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease);
}
:root[data-theme="light"] .field input[type=number],
:root[data-theme="light"] .field input[type=text],
:root[data-theme="light"] .field input[type=password],
:root[data-theme="light"] .field textarea,
:root[data-theme="light"] .field select{
  background:#fff;border-color:#dfe4ea;
}
.field input:hover,.field textarea:hover,.field select:hover{border-color:rgba(150,160,170,.5)}
:root[data-theme="light"] .field input:hover,
:root[data-theme="light"] .field textarea:hover,
:root[data-theme="light"] .field select:hover{border-color:#c6cdd4}
.field input:focus,.field textarea:focus,.field select:focus{box-shadow:var(--ring)}
.chip{padding:8px 16px;transition:all .18s var(--ease)}
.chip:hover{transform:translateY(-1px);box-shadow:var(--sh-1)}
.chip.on{background:var(--accent-h);box-shadow:inset 0 0 0 1px rgba(251,114,153,.45)}
.paynote{border-radius:14px;border-color:var(--border)}

/* ---------------------------------------------------------------------------
   9. 表格 / 徽章: 表头沉底, 行悬停, 数字等宽
   --------------------------------------------------------------------------- */
.dtable{border-collapse:separate;border-spacing:0}
.dtable th{
  font-size:12.5px;font-weight:700;letter-spacing:.4px;
  color:var(--text-dim);text-transform:none;
}
.dtable tr.thr th{
  border-bottom:1px solid var(--border);
  padding-bottom:9px;
}
.dtable td{padding:10px 8px;border-bottom:1px solid var(--hairline);font-variant-numeric:tabular-nums}
.dtable tr:last-child td{border-bottom:0}
.dtable tbody tr,.dtable tr:not(.thr){transition:background .14s var(--ease)}
.dtable tr:not(.thr):hover{background:var(--bg-hover)}
.pill{
  padding:2px 10px;border-radius:var(--pill);
  font-size:12px;font-weight:700;letter-spacing:.2px;
  border:1px solid transparent;
}
.pill.ok{background:rgba(0,186,124,.14);border-color:rgba(0,186,124,.35)}
.pill.wait{background:rgba(255,176,46,.14)}
.pill.bad{background:rgba(229,72,77,.14);border-color:rgba(229,72,77,.35)}
.empty{
  padding:26px 10px;text-align:center;color:var(--text-dim);font-size:14px;
  border:1px dashed var(--border);border-radius:14px;background:var(--bg-hover);
}

/* ---------------------------------------------------------------------------
   10. 视频播放器 / 弹幕: 玻璃控制条 + 渐变进度
   --------------------------------------------------------------------------- */
.vplayer-box{
  box-shadow:var(--sh-3);
  border:1px solid var(--hairline);
}
.vp-bar{
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.78));
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.vp-play{
  background:var(--grad-accent);
  box-shadow:0 4px 14px -6px rgba(251,114,153,.95);
  transition:transform .16s var(--ease),filter .16s var(--ease);
}
.vp-play:hover{transform:scale(1.06);filter:brightness(1.08)}
.vp-prog{height:5px;border-radius:99px;background:rgba(255,255,255,.18);transition:height .16s var(--ease)}
.vp-prog:hover{height:7px}
.vp-fill{background:var(--grad-accent);border-radius:99px}
.vp-knob{
  width:13px;height:13px;background:#fff;
  box-shadow:0 0 0 3px rgba(251,114,153,.35),0 2px 8px rgba(0,0,0,.5);
  transition:transform .16s var(--ease);
}
.vp-prog:hover .vp-knob{transform:scale(1.15)}
.vp-time,.vp-speed,.vp-vol{font-variant-numeric:tabular-nums}
.vp-btn{border-radius:9px;transition:background .16s var(--ease),color .16s var(--ease)}
.vp-btn:hover{background:rgba(255,255,255,.14);color:#fff}

/* 大播放按钮: 中心光晕 */
.vbigplay,.vp-bigplay{
  border-radius:50%;
  background:rgba(0,0,0,.52);
  border:1.5px solid rgba(255,255,255,.35);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  box-shadow:0 10px 30px -10px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.25);
  transition:transform .2s var(--ease),background .2s var(--ease),border-color .2s var(--ease);
}
.vbigplay:hover,.vp-bigplay:hover{
  transform:scale(1.08);background:rgba(251,114,153,.82);border-color:rgba(255,255,255,.6);
}

/* 弹幕输入区 */
.dm-bar,.bili-send{border-radius:14px}
.dm-input,.bili-send input{
  border-radius:var(--pill);
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease);
}
.dm-input:focus,.bili-send input:focus{box-shadow:var(--ring);border-color:var(--accent)}
.bili-sendbtn{
  background:var(--grad-accent);color:#fff;
  box-shadow:var(--glow-accent);
  transition:filter .16s var(--ease),transform .16s var(--ease);
}
.bili-sendbtn:hover{filter:brightness(1.07);transform:translateY(-1px)}
.dmrow{padding:7px 9px;border-radius:10px;transition:background .14s var(--ease)}
.dmrow:hover{background:var(--bg-hover)}
.dm-switchwrap,.dm-set{border-radius:12px}

/* 视频信息区 */
.vtitle{letter-spacing:-.2px}
.vmeta{font-variant-numeric:tabular-nums}
.vtag{
  border-radius:8px;font-size:11.5px;font-weight:700;
  background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}

/* ---------------------------------------------------------------------------
   11. 后台: 顶栏玻璃 + 标签胶囊 + 内容居中留白
   --------------------------------------------------------------------------- */
.adm-shell{background:
  radial-gradient(1200px 400px at 50% -160px,rgba(251,114,153,.10),transparent 70%),
  var(--bg);
}
.adm-top{
  position:sticky;top:0;z-index:30;
  background:var(--bg-blur);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
  box-shadow:0 8px 26px -24px rgba(0,0,0,.9);
}
.adm-logo{
  background:linear-gradient(135deg,#63c8ff,#a48bff 52%,#ff8ac6);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.adm-tabs{gap:4px}
.adm-tab{
  border-radius:11px;font-weight:600;
  transition:background .16s var(--ease),color .16s var(--ease);
}
.adm-tab:hover{background:var(--bg-hover);color:var(--text)}
.adm-tab.on{
  background:var(--accent-h);color:var(--accent);font-weight:750;
  box-shadow:inset 0 0 0 1px rgba(251,114,153,.3);
}
.adm-tab .tbadge{box-shadow:0 2px 8px -2px rgba(251,114,153,.9)}
.adm-ic{
  border-radius:10px;
  transition:background .16s var(--ease),color .16s var(--ease);
}
.adm-ic:hover{background:var(--accent-h);color:var(--accent)}
.adm-user em{color:var(--text-dim);font-style:normal;font-size:12px}
.adm-main{padding:20px 22px 40px;max-width:1560px;margin:0 auto}
.adm-title h1{letter-spacing:-.3px}
.adm-title{margin-bottom:14px}
.adm-main .card,.adm-main .tbl-card{
  border:1px solid var(--hairline);box-shadow:var(--sh-2);border-radius:16px;
}
.adm-main .card>h2{font-size:16.5px}
.adm-main table.dtable{width:100%}
.adm-main .dtable th{background:var(--bg-hover)}

/* ---------------------------------------------------------------------------
   13. 播放器: 控制条自动隐藏(播放中鼠标静止 2 秒收起) + 全屏按钮图标对齐
   --------------------------------------------------------------------------- */
/* bili 皮肤的控制条原来是常显的(skin-bili .vp-bar 是 absolute 但没隐藏机制),
   这里补上过渡与隐藏态; 老皮肤(is-long 非 bili)是 position:static, 保持常显不动 */
.vplayer-box.skin-bili .vp-bar{
  transition:opacity .24s var(--ease),transform .24s var(--ease);
}
.vplayer-box.skin-bili.playing:not(.ui-on) .vp-bar{
  opacity:0;transform:translateY(8px);pointer-events:none;
}
/* 暂停/播完/刚进页面: 控制条一定可见 */
.vplayer-box.skin-bili:not(.playing) .vp-bar,
.vplayer-box.skin-bili.ui-on .vp-bar{opacity:1;transform:none;pointer-events:auto}

/* 隐藏时大播放按钮/中间提示的过渡跟控制条一致 */
.vplayer-box.skin-bili:not(.playing) .vp-bar{opacity:1}

/* 网页全屏 / 全屏 / 退出 按钮: 图标居中、点击热区一致, 不再出现「两个三点」的错图 */
.vplayer-box .vp-webfs,.vplayer-box .vp-fs{
  display:inline-flex;align-items:center;justify-content:center;
}
.vplayer-box .vp-webfs svg,.vplayer-box .vp-fs svg{
  width:19px;height:19px;display:block;
  stroke-width:2;                 /* 网页全屏图标线条较密, 加粗一点在小尺寸才不糊 */
}
.vplayer-box.skin-bili .vp-webfs svg,
.vplayer-box.skin-bili .vp-fs svg{width:20px;height:20px;stroke-width:2.1}
/* 触摸设备没有 hover: 网页全屏按钮点击后保持高亮提示当前状态 */
.vplayer-box.webfs .vp-webfs{color:var(--bili,#FB7299)}
.vplayer-box:fullscreen .vp-fs{color:var(--bili,#FB7299)}

/* 网页全屏时控制条的 bottom 是按「有弹幕发送栏」预留的(70/118px)。
   没有发送栏(.has-send 缺失)时那段就是一片空的, 把控制条拉回贴底。 */
.vplayer-box.skin-bili.webfs:not(.has-send) .vp-bar{bottom:16px}
.vplayer-box.skin-bili.webfs:not(.has-send) .dm-set{bottom:60px}
/* 网页全屏时视频按视口高度撑满(object-fit 内部留边), 不再用 calc(100vh-46px) 猜发送栏高度 */
.vplayer-box.skin-bili.webfs .vp-video{
  height:100vh;max-height:100vh;width:100%;object-fit:contain;
}

/* ---- 手机端控制条: 390px 下原本塞不下, 全屏按钮被挤出屏幕外 ----
   处理: 去掉音量键(手机用实体键) + 整体收紧 + 进度条留最小宽度,
   让「播放/时间/进度/弹幕/设置/倍速/网页全屏/全屏」全部落在屏幕内。 */
@media (max-width:700px){
  .vplayer-box .vp-vol,.vplayer-box .vp-volr{display:none}   /* 手机用实体键调音量 */
  .vplayer-box.skin-bili .vp-bar{gap:2px;padding:7px 6px}
  .vplayer-box.skin-bili .vp-btn{width:28px;height:28px}
  .vplayer-box.skin-bili .vp-webfs,.vplayer-box.skin-bili .vp-fs{width:28px;height:28px}
  .vplayer-box.skin-bili .bili-dm{width:26px;height:26px;border-width:1.2px;border-radius:4px}
  .vplayer-box.skin-bili .bili-dm b{font-size:12px}
  .vplayer-box.skin-bili .vp-speed{min-width:26px;padding:0 3px;font-size:11px;font-weight:600}
  .vplayer-box.skin-bili .vp-time{font-size:10.5px;gap:1px}
  .vplayer-box.skin-bili .vp-prog{min-width:24px}
  .vplayer-box.skin-bili .vp-webfs svg,.vplayer-box.skin-bili .vp-fs svg{width:17px;height:17px}
}

/* ---------------------------------------------------------------------------
   15. 运营号(官方账号): 前台「官方」标识 / 代管横幅 / 后台批量操作面板
   --------------------------------------------------------------------------- */
/* 前台「官方」标识 —— 与蓝勾并列, 但更醒目的品牌色小胶囊 */
.ops-tag{
  display:inline-flex;align-items:center;
  margin-left:4px;padding:1px 7px;border-radius:6px;
  font-size:11px;font-weight:800;letter-spacing:.3px;line-height:17px;
  color:#fff;white-space:nowrap;
  background:var(--grad-accent,linear-gradient(135deg,#ff9ab8,#FB7299 48%,#ee5a86));
  box-shadow:0 2px 8px -3px rgba(251,114,153,.9);
  vertical-align:middle;
}
:root[data-theme="light"] .ops-tag{
  background:linear-gradient(135deg,#f2547d,#e0416c);box-shadow:0 2px 8px -4px rgba(242,84,125,.7)
}
/* 个人主页名字后面那颗大一点 */
.pf-name .ops-tag{font-size:12px;padding:2px 9px;line-height:19px;border-radius:7px}

/* 代管横幅: 固定在页面顶部, 不可能忽略; 有它时把内容整体下移 */
.ops-bar{
  position:sticky;top:0;z-index:900;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:10px 16px;
  color:#fff;font-size:13.5px;line-height:1.5;
  background:linear-gradient(100deg,#b0284f 0%,#FB7299 55%,#ff8fae 100%);
  box-shadow:0 6px 20px -12px rgba(0,0,0,.8);
}
.ops-bar b{font-weight:800}
.ops-bar-ico{display:inline-flex;opacity:.95}
.ops-bar-btn{
  margin-left:auto;
  padding:6px 14px;border-radius:999px;
  background:rgba(0,0,0,.28);color:#fff;
  border:1px solid rgba(255,255,255,.4);
  font-size:12.5px;font-weight:700;cursor:pointer;
  transition:background .16s var(--ease),transform .16s var(--ease);
}
.ops-bar-btn:hover{background:rgba(0,0,0,.45);transform:translateY(-1px)}
.ops-bar-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
/* 代管时侧栏/主区顶部对齐 sticky 条 */
.ops-bar ~ .app .side,.ops-bar ~ .app .right{top:0}

/* 后台: 批量操作面板 */
.ops-batch{
  display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;
  margin-top:12px;padding:12px 14px;border-radius:14px;
  border:1px solid var(--border);background:var(--bg-hover);
}
.ops-batch .ops-pid{margin:0;min-width:220px;flex:0 1 260px}
.ops-batch .ops-pid>span{font-size:12px;color:var(--text-dim);margin-bottom:5px}
.ops-batch-acts{display:flex;gap:8px;flex-wrap:wrap}
.ops-batch .hint{font-size:12.5px;color:var(--text-dim)}

/* 后台: 列表里的勾选列 */
.ops-table .ops-chk{width:36px;text-align:center;padding-right:0}
.ops-table .ops-chk input{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}
.ops-table tr:hover .ops-chk{opacity:1}

@media (max-width:700px){
  .ops-bar{font-size:12.5px;padding:9px 12px}
  .ops-bar-btn{margin-left:0;width:100%;text-align:center}
  .ops-batch{padding:10px}
  .ops-batch .ops-pid{flex:1 1 100%}
}

/* ---------------------------------------------------------------------------
   16. 移动端: 底部标签栏毛玻璃 + 选中指示 + 内容留白
   --------------------------------------------------------------------------- */
@media (max-width:700px){
  .topbar{
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    box-shadow:0 6px 18px -16px rgba(0,0,0,.9);
  }
  /* 发帖工具行在窄屏会挤掉「发布」按钮: 全能发帖只留 + 图标 */
  .composer-bar a.tool.wide{width:38px;padding:0;justify-content:center}
  .composer-bar a.tool.wide span{display:none}
  .composer-bar{gap:2px}
  /* grid 的 1fr 有 min-content 下限, 发帖框会把整栏顶宽 53px 导致横向溢出 */
  .app{grid-template-columns:minmax(0,1fr)}
  /* 动作栏在 390px 会顶出去(分享按钮被裁): 收紧内边距让 6 个动作同排 */
  .acts{flex-wrap:nowrap;gap:0;margin-left:-4px}
  .act>svg{padding:5px}
  .act .n{font-size:11.5px;padding-right:4px}
  .acts .act{padding:0 2px}
  .acts-right{margin-left:auto}
  .post{padding:13px 14px}
  .composer{padding:12px 14px 4px}
  .card{box-shadow:var(--sh-1)}
  .segbtn{padding:7px 13px}
  .chip{padding:7px 13px}
  .hero{padding:16px 15px 14px;border-radius:16px}
  .hero .hv{font-size:32px}
  .hstats{grid-template-columns:repeat(3,1fr);gap:6px}
  .hstat{padding:8px 9px}
  .hstat .v{font-size:14.5px}
  .bene{grid-template-columns:1fr}
  .dtable td{padding:9px 6px}
  .adm-main{padding:14px 12px 32px}
  .adm-tabs{scrollbar-width:none}
  .adm-tabs::-webkit-scrollbar{display:none}
}

/* 减少动效偏好: 关掉位移与缩放, 只保留颜色变化 */
@media (prefers-reduced-motion:reduce){
  .nav-item,.nav-item svg,.post-btn,.btn,.chip,.send,.follow-btn,
  .hstat,.bene-i,.card,.trend,.post,.vp-play,.vbigplay,.vp-bigplay{
    transition:color .12s linear,background-color .12s linear,border-color .12s linear !important;
  }
  .nav-item:hover,.post-btn:hover,.btn:hover,.chip:hover,.send:not(:disabled):hover,
  .hstat:hover,.bene-i:hover,.trend:hover{transform:none !important}
  .grid2>img:hover,.grid3>img:hover,.grid4>img:hover,
  .grid6>img:hover,.grid8>img:hover{transform:none !important}
}