/* =====================================================================
   影像中心 · B 站版式 + 王帝品牌色（仅作用于 .page-bili，不动全站 chrome）
   版式仿 B 站：频道横幅 + 主推 + 一大堆视频封面墙 + 点进播放页
   颜色用全站品牌：纸 #f2ede2 / 墨 #13151a / 朱红 #b3352c / 金 #a8813c
   ===================================================================== */
.page-bili{background:var(--paper);color:var(--ink)}

/* ---------- 频道横幅（品牌墨色，与全站 page-hero 一致） ---------- */
.bili-banner{position:relative;padding:112px 0 0;overflow:hidden;background:var(--ink);color:var(--paper)}
.bili-banner .bn-bg{position:absolute;inset:-20px;background:center/cover no-repeat;opacity:.32;filter:grayscale(.25)}
.bili-banner::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(19,21,26,.55),rgba(19,21,26,.86) 60%,var(--paper))}
.bili-banner .wrap{position:relative;z-index:2}
.bili-crumb{font-size:12.5px;color:rgba(242,237,226,.6);letter-spacing:1px;margin-bottom:22px}
.bili-crumb a{color:rgba(242,237,226,.72);transition:color .2s}
.bili-crumb a:hover{color:var(--gold2)}
.bili-crumb span{margin:0 9px;color:rgba(242,237,226,.3)}
.bili-chan{display:flex;align-items:center;gap:20px;padding-bottom:26px}
.bili-chan .seal{width:76px;height:76px;flex:none;border-radius:12px;background:var(--red);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  font:900 30px/1 var(--serif);color:#fff;box-shadow:0 10px 30px rgba(179,53,44,.45)}
.bili-chan h1{margin:0;font:900 34px/1.1 var(--serif);letter-spacing:6px;color:#fff}
.bili-chan .sub{margin-top:10px;font-size:12px;letter-spacing:5px;color:rgba(242,237,226,.5)}
.bili-chan .bn-act{margin-left:auto;display:flex;gap:12px;flex-wrap:wrap}
.bili-chan .bn-act .btn{height:42px}
.bili-btn-pink{color:#fff;background:linear-gradient(180deg,var(--red2),var(--red));box-shadow:0 8px 22px rgba(179,53,44,.4)}
.bili-btn-pink:hover{background:linear-gradient(180deg,var(--red),#96291f);transform:translateY(-2px)}
.bili-btn-ghost{color:var(--paper);background:rgba(255,255,255,.06);border:1px solid rgba(242,237,226,.32)}
.bili-btn-ghost:hover{background:rgba(255,255,255,.14);border-color:var(--gold2);color:var(--gold2);transform:translateY(-2px)}
.bili-banner .bn-desc{margin:0;padding-bottom:22px;font-size:14px;line-height:1.9;color:rgba(242,237,226,.72);
  max-width:760px;letter-spacing:.5px}

/* 频道数据条：三个数字轻量排开，别抢标题 */
.bn-stats{display:flex;gap:34px;padding:0 0 30px;flex-wrap:wrap}
.bn-stats span{font-size:12px;letter-spacing:2px;color:rgba(242,237,226,.55);position:relative;padding-left:14px}
.bn-stats span::before{content:"";position:absolute;left:0;top:7px;width:4px;height:4px;border-radius:50%;
  background:var(--red2)}
.bn-stats b{font:900 19px/1 var(--serif);letter-spacing:0;color:var(--paper);margin-right:7px}

/* ---------- 主体 ---------- */
.bili-body{padding:0 0 60px}
.bili-body .wrap{position:relative;z-index:1}

/* 主 Tab（官方区 / 玩家区） */
.bili-tabs{display:flex;gap:30px;border-bottom:1px solid var(--line);margin-bottom:4px}
.bili-tabs a{position:relative;padding:18px 2px;font-size:16px;font-weight:600;color:var(--ink3);letter-spacing:1px;
  transition:color .2s}
.bili-tabs a u{font-style:normal;text-decoration:none;margin-left:6px;font-size:12px;color:var(--muted);font-weight:400}
.bili-tabs a:hover{color:var(--ink)}
.bili-tabs a.on{color:var(--ink);font-weight:700}
.bili-tabs a.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:2px;background:var(--red)}
.bili-tabs a.on u{color:var(--red)}
.bili-tabs .bn-post{margin-left:auto;align-self:center}
.bili-tabs .bn-post a{padding:8px 18px;font-size:13px;border:1px solid var(--red);color:var(--red);border-radius:6px}
.bili-tabs .bn-post a:hover{background:var(--red);color:#fff}

/* 子分类 Tab */
.bili-subtabs{display:flex;gap:8px;flex-wrap:wrap;padding:18px 0 10px}
.bili-subtabs a{padding:7px 16px;border-radius:6px;font-size:13px;color:var(--ink3);background:#fff;
  border:1px solid var(--line);transition:all .18s;letter-spacing:1px}
.bili-subtabs a:hover{color:var(--red);border-color:var(--red)}
.bili-subtabs a.on{background:var(--red);border-color:var(--red);color:#fff;font-weight:600}

/* 工具条：排序 + 站内搜视频 */
.bili-toolbar{display:flex;align-items:center;gap:14px;padding:6px 0 18px;flex-wrap:wrap}
.bt-sort{display:flex;gap:6px}
.bt-sort a{padding:6px 14px;border-radius:6px;font-size:13px;color:var(--ink3);
  transition:all .18s;letter-spacing:1px}
.bt-sort a:hover{color:var(--red)}
.bt-sort a.on{background:rgba(179,53,44,.09);color:var(--red);font-weight:600}
.bt-search{margin-left:auto;display:flex;align-items:center;gap:8px;padding:0 14px;height:36px;
  background:#fff;border:1px solid var(--line);border-radius:18px;transition:border-color .2s}
.bt-search:focus-within{border-color:var(--red)}
.bt-search svg{width:15px;height:15px;color:var(--muted);flex:none}
.bt-search input{width:210px;border:0;outline:0;background:transparent;font-family:inherit;
  font-size:13px;color:var(--ink)}
.bt-search input::placeholder{color:var(--muted)}
.bili-kw{font-size:12.5px;color:var(--muted);margin:-6px 0 16px;letter-spacing:1px}
.bili-kw a{color:var(--red);margin-left:6px}

/* 主区两栏：封面墙 + 排行榜 */
.bili-mainwrap{display:grid;grid-template-columns:minmax(0,1fr) 268px;gap:24px;align-items:start}
/* 宽屏时给右下角的悬浮「下载/反馈」留一条专属车道，
   否则固定定位的悬浮钮会压在排行榜文字上 */
@media (min-width:1300px){
  .bili-mainwrap{padding-right:56px}
  .bili-rank{width:268px;justify-self:end}
}
.bili-rank{background:#fff;border:1px solid var(--line);border-radius:8px;padding:16px 14px;
  position:sticky;top:96px}
.bili-rank h5{margin:0 0 12px;font-size:14px;color:var(--ink);letter-spacing:1px;
  display:flex;align-items:center;gap:8px}
.bili-rank h5::before{content:"";width:4px;height:14px;border-radius:2px;background:var(--red)}
.bili-rank h5 em{font-style:normal;font-size:11.5px;font-weight:400;color:var(--muted);letter-spacing:1px}
.bili-rank ol{list-style:none;margin:0;padding:0;counter-reset:rk}
.bili-rank li + li{margin-top:6px}
.bili-rank li a{display:flex;gap:9px;align-items:center;padding:6px;border-radius:6px;transition:background .18s}
.bili-rank li a:hover{background:var(--paper)}
.bili-rank u{font-style:normal;text-decoration:none;flex:none;width:16px;text-align:center;
  font:700 12.5px/1 var(--serif);color:var(--muted)}
.bili-rank li.top u{color:var(--red)}
.bili-rank .rk-c{width:62px;aspect-ratio:16/9;flex:none;border-radius:4px;overflow:hidden;background:#0f141b}
.bili-rank .rk-c img{width:100%;height:100%;object-fit:cover;display:block}
.bili-rank .rk-t{min-width:0;flex:1}
.bili-rank .rk-t b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-size:12.5px;font-weight:600;line-height:1.45;color:var(--ink)}
.bili-rank li a:hover .rk-t b{color:var(--red2)}
.bili-rank .rk-t small{display:block;margin-top:2px;font-size:11px;color:var(--muted)}

/* ---------- 主推大卡 ---------- */
.bili-featured{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:0;margin-bottom:30px;
  background:#fff;border-radius:8px;overflow:hidden;border:1px solid var(--line);
  box-shadow:0 12px 30px rgba(19,21,26,.1);transition:transform .25s,box-shadow .25s}
.bili-featured:hover{transform:translateY(-4px);box-shadow:0 20px 46px rgba(19,21,26,.16)}
.bf-cover{position:relative;aspect-ratio:16/9;min-height:260px;background:#0f141b center/cover no-repeat}
.bf-cover .bf-dur{position:absolute;right:12px;bottom:12px;padding:3px 9px;border-radius:4px;
  background:rgba(19,21,26,.8);color:#fff;font-size:12px;letter-spacing:1px}
.bf-cover .bf-badge{position:absolute;left:14px;top:14px;padding:4px 11px;border-radius:4px;
  font-size:11.5px;letter-spacing:3px;color:#fff;background:linear-gradient(120deg,var(--red2),var(--red));
  box-shadow:0 6px 16px rgba(179,53,44,.45)}
.bf-cover .bf-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.bf-cover .bf-play i{width:62px;height:62px;border-radius:50%;background:rgba(179,53,44,.92);
  display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.8);transition:all .25s;
  box-shadow:0 10px 28px rgba(0,0,0,.35)}
.bf-cover .bf-play i::after{content:"";margin-left:5px;border-style:solid;border-width:11px 0 11px 18px;
  border-color:transparent transparent transparent #fff}
.bili-featured:hover .bf-play i{opacity:1;transform:scale(1)}
.bf-info{padding:30px 30px 28px;display:flex;flex-direction:column;min-width:0;justify-content:center}
.bf-tag{align-self:flex-start;padding:3px 10px;border-radius:4px;font-size:11.5px;letter-spacing:1px;
  background:rgba(179,53,44,.1);color:var(--red);font-weight:600}
.bf-info h3{margin:14px 0 0;font-size:20px;font-weight:700;line-height:1.5;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bili-featured:hover .bf-info h3{color:var(--red2)}
.bf-info p{margin:12px 0 0;font-size:13.5px;line-height:1.9;color:var(--ink3);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bf-meta{margin-top:14px;padding-top:16px;border-top:1px solid var(--line2);display:flex;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.bf-meta b{color:var(--ink3);font-weight:600}
.bf-meta .bf-cat{color:var(--red)}
/* 主推卡底部「立即观看」：不抢眼，但有指向性 */
.bf-go{margin-top:16px;display:inline-flex;align-items:center;gap:8px;align-self:flex-start;
  font-size:13px;letter-spacing:2px;color:var(--red);font-weight:600}
.bf-go svg{width:16px;height:16px;transition:transform .35s var(--ease-out,cubic-bezier(.16,1,.3,1))}
.bili-featured:hover .bf-go svg{transform:translateX(6px)}

/* ---------- 区块标题 + 视图切换 ---------- */
.bili-sechead{display:flex;align-items:center;gap:16px;margin:6px 0 18px;
  border-top:1px solid var(--line);padding-top:20px}
.bili-sechead h2{margin:0;font-size:17px;letter-spacing:3px;color:var(--ink);
  display:flex;align-items:center;gap:10px}
.bili-sechead h2::before{content:"";width:4px;height:17px;border-radius:2px;background:var(--red)}
.bili-sechead h2 em{font-style:normal;font-size:12px;font-weight:400;letter-spacing:1px;color:var(--muted)}
.bili-toggle{margin-left:auto;display:flex;gap:6px}
.bili-toggle button{width:32px;height:32px;border-radius:6px;border:1px solid var(--line);background:#fff;
  color:var(--ink3);cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:all .2s;padding:0}
.bili-toggle button svg{width:15px;height:15px}
.bili-toggle button:hover{color:var(--red);border-color:var(--red)}
.bili-toggle button.on{background:var(--red);border-color:var(--red);color:#fff}

/* ---------- 视频封面墙 ---------- */
.bili-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 16px}
/* 带排行榜时主区变窄，网格退到 3 列，避免封面被压成邮票 */
.bili-mainwrap .bili-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.bili-card{display:flex;flex-direction:column;background:transparent;border-radius:8px;transition:transform .22s}
.bili-card:hover{transform:translateY(-4px)}
.bili-cover{position:relative;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:#0f141b center/cover no-repeat;
  box-shadow:0 6px 16px rgba(19,21,26,.14)}
.bili-cover img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease-out}
.bili-card:hover .bili-cover img{transform:scale(1.06)}
.bili-cover .bc-cat{position:absolute;left:8px;top:8px;padding:2px 8px;border-radius:4px;font-size:11px;
  background:rgba(19,21,26,.66);color:#fff;letter-spacing:1px;backdrop-filter:blur(4px)}
.bili-cover .bc-dur{position:absolute;right:8px;bottom:8px;padding:2px 8px;border-radius:4px;font-size:11.5px;
  background:rgba(19,21,26,.78);color:#fff;letter-spacing:1px}
.bili-cover .bc-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;color:rgba(242,237,226,.5);font:900 30px/1 var(--serif);letter-spacing:6px}
.bili-cover .bc-ph small{font:400 10.5px/1 var(--sans);letter-spacing:2px;color:rgba(242,237,226,.34)}
.bili-cover .bc-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;
  transition:opacity .22s;background:rgba(19,21,26,.18)}
.bili-card:hover .bili-cover .bc-play{opacity:1}
.bili-cover .bc-play i{width:44px;height:44px;border-radius:50%;background:rgba(179,53,44,.94);
  display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(0,0,0,.3)}
.bili-cover .bc-play i::after{content:"";margin-left:4px;border-style:solid;border-width:8px 0 8px 13px;
  border-color:transparent transparent transparent #fff}
/* 悬停时封面上浮一层标题条（B 站那种「先看到内容」的手感） */
.bili-cover .bc-hover{position:absolute;left:0;right:0;bottom:0;padding:26px 10px 9px;
  background:linear-gradient(180deg,transparent,rgba(13,15,19,.9));
  opacity:0;transform:translateY(8px);transition:opacity .25s,transform .3s var(--ease-out,cubic-bezier(.16,1,.3,1))}
.bili-cover .bc-hover b{display:block;font-size:12.5px;font-weight:600;color:#fff;line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.bili-cover .bc-hover span{display:block;margin-top:3px;font-size:11px;color:rgba(242,237,226,.6)}
.bili-card:hover .bc-hover{opacity:1;transform:none}
.bili-card:hover .bc-dur{opacity:0}
.bili-title{margin:10px 2px 0;font-size:14.5px;font-weight:600;line-height:1.5;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:44px}
.bili-card:hover .bili-title{color:var(--red2)}
.bili-meta{margin:7px 2px 0;display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.bili-meta .up{color:var(--gold)}
.bili-meta .dot{color:var(--line)}

/* ---------- 列表视图（同一份 DOM，切一个 class 换排布） ---------- */
.bili-grid.as-row,.bili-mainwrap .bili-grid.as-row{grid-template-columns:1fr;gap:10px}
.bili-grid.as-row .bili-card{flex-direction:row;align-items:center;gap:16px;padding:10px;
  border-radius:8px;background:#fff;border:1px solid transparent;transition:all .25s}
.bili-grid.as-row .bili-card:hover{border-color:var(--line);transform:none;
  box-shadow:0 10px 24px rgba(19,21,26,.1)}
.bili-grid.as-row .bili-cover{width:216px;flex:none;box-shadow:none}
.bili-grid.as-row .bili-cover .bc-hover{display:none}
.bili-grid.as-row .bili-title{margin:0;min-height:0;flex:1;-webkit-line-clamp:2}
.bili-grid.as-row .bili-meta{margin:0;width:230px;justify-content:flex-end;flex-wrap:nowrap}
.bili-grid.as-row .bili-meta span:last-child{display:none}

/* 空态 / 规则 */
.bili-empty{background:#fff;border:1px solid var(--line);border-radius:8px;padding:56px 24px;text-align:center}
.bili-empty .ic{width:56px;height:56px;margin:0 auto 16px;border-radius:50%;background:var(--paper2);
  display:flex;align-items:center;justify-content:center;color:var(--muted)}
.bili-empty b{display:block;font-size:16px;color:var(--ink);letter-spacing:1px}
.bili-empty p{margin:10px 0 0;font-size:13px;color:var(--muted);line-height:1.9}
.bili-empty a{color:var(--red)}
.bili-empty .btn{margin-top:18px}
.bili-rules{margin-top:30px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:22px 24px}
.bili-rules h4{margin:0 0 12px;font-size:15px;color:var(--ink);letter-spacing:1px;display:flex;align-items:center;gap:8px}
.bili-rules h4::before{content:"";width:4px;height:16px;border-radius:2px;background:var(--red)}
.bili-rules li{position:relative;padding:5px 0 5px 18px;font-size:13px;line-height:1.8;color:var(--ink3)}
.bili-rules li::before{content:"";position:absolute;left:2px;top:14px;width:5px;height:5px;border-radius:50%;background:var(--paper3)}

/* =====================================================================
   播放页（B 站版式 + 品牌色）
   ===================================================================== */
.bili-wcrumb{margin:104px 0 16px;font-size:12.5px;color:var(--muted);letter-spacing:1px}
.bili-wcrumb a{color:var(--ink3);transition:color .2s}
.bili-wcrumb a:hover{color:var(--red)}
.bili-wcrumb span{margin:0 9px;color:var(--line)}
.bili-watch{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:26px;padding:0 0 56px;align-items:start}
.bili-player{position:relative;border-radius:8px;overflow:hidden;background:#000;box-shadow:0 16px 40px rgba(19,21,26,.28)}
.bili-player video{display:block;width:100%;aspect-ratio:16/9;background:#000;object-fit:contain}
.bili-vinfo{margin-top:18px}
.bili-vinfo h1{margin:0;font-size:20px;font-weight:700;line-height:1.5;color:var(--ink)}
.bili-vmeta{margin-top:10px;display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.bili-vmeta b{color:var(--ink3);font-weight:600}
.bili-vmeta .cat{color:var(--red)}
.bili-actions{margin-top:16px;display:flex;gap:12px;flex-wrap:wrap}
.bili-act{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 18px;border-radius:6px;
  border:1px solid var(--line);background:#fff;color:var(--ink3);font-size:13px;cursor:pointer;transition:all .18s;font-family:inherit}
.bili-act:hover{color:var(--red);border-color:var(--red)}
.bili-act.pink{background:var(--red);border-color:var(--red);color:#fff}
.bili-act.pink:hover{background:var(--red2);color:#fff}
.bili-act svg{width:17px;height:17px}
.bili-upcard{margin-top:20px;display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);
  border-radius:8px;padding:16px 18px}
.bili-upcard .seal{width:48px;height:48px;flex:none;border-radius:50%;background:var(--red);
  display:flex;flex-direction:column;align-items:center;justify-content:center;font:900 17px/1 var(--serif);color:#fff}
.bili-upcard .uinfo{min-width:0}
.bili-upcard .uinfo b{display:block;font-size:14.5px;color:var(--ink)}
.bili-upcard .uinfo small{display:block;margin-top:3px;font-size:12px;color:var(--muted)}
.bili-upcard .follow{margin-left:auto;flex:none}
.bili-desc{margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:16px 18px;
  font-size:13.5px;line-height:1.95;color:var(--ink3);white-space:pre-wrap}
.bili-desc .t{display:block;margin-bottom:8px;font-size:12px;letter-spacing:2px;color:var(--muted)}
/* 播放页数据条：播放/同分区/时长 */
.bili-vbar{margin-top:16px;display:flex;gap:0;background:#fff;border:1px solid var(--line);
  border-radius:8px;overflow:hidden}
.bili-vbar .vb{flex:1;padding:14px 18px;text-align:center;position:relative}
.bili-vbar .vb + .vb::before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:1px;background:var(--line)}
.bili-vbar .vb b{display:block;font:900 20px/1.2 var(--serif);color:var(--ink)}
.bili-vbar .vb i{display:block;margin-top:5px;font-style:normal;font-size:11.5px;letter-spacing:2px;color:var(--muted)}
/* 上/下篇 */
.bili-pn{margin-top:16px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bili-pn .pn{display:block;padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:8px;
  transition:all .22s;min-width:0}
.bili-pn a.pn:hover{border-color:var(--red);transform:translateY(-2px)}
.bili-pn .pn span{display:block;font-size:11.5px;letter-spacing:2px;color:var(--muted);margin-bottom:6px}
.bili-pn .pn b{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;
  font-size:13.5px;font-weight:600;color:var(--ink)}
.bili-pn a.pn:hover b{color:var(--red2)}
.bili-pn .pn.next{text-align:right}
.bili-pn .pn.dis{opacity:.5;background:transparent;border-style:dashed}
.bili-pn .pn.dis b{font-weight:400;color:var(--muted)}
.bili-rec{position:sticky;top:96px}
.bili-rec > h5{margin:0 0 14px;font-size:15px;color:var(--ink);letter-spacing:1px;display:flex;align-items:center;gap:8px}
.bili-rec > h5::before{content:"";width:4px;height:15px;border-radius:2px;background:var(--red)}
.bili-rec-row{display:flex;gap:10px;padding:8px;border-radius:8px;transition:background .18s}
.bili-rec-row:hover{background:#fff}
.bili-rec-row .rc{position:relative;width:160px;aspect-ratio:16/9;flex:none;border-radius:6px;overflow:hidden;background:#0f141b}
.bili-rec-row .rc img{width:100%;height:100%;object-fit:cover}
.bili-rec-row .rc .d{position:absolute;right:5px;bottom:5px;padding:1px 6px;border-radius:3px;font-size:11px;
  background:rgba(19,21,26,.78);color:#fff}
.bili-rec-row .rt{min-width:0;flex:1;display:flex;flex-direction:column}
.bili-rec-row .rt b{font-size:13px;font-weight:600;line-height:1.5;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bili-rec-row:hover .rt b{color:var(--red2)}
.bili-rec-row .rt small{margin-top:auto;font-size:11.5px;color:var(--muted)}
.bili-rec-none{padding:16px;font-size:12.5px;color:var(--muted);line-height:1.9;background:#fff;border:1px solid var(--line);border-radius:8px}
.bili-rec-all{display:block;margin-top:12px;padding:11px;text-align:center;font-size:12.5px;letter-spacing:1px;
  color:var(--ink3);background:#fff;border:1px solid var(--line);border-radius:8px;transition:all .22s}
.bili-rec-all:hover{color:var(--red);border-color:var(--red)}

/* 响应式 */
@media (max-width:1180px){
  .bili-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bili-mainwrap{grid-template-columns:1fr}
  .bili-rank{position:static;margin-bottom:22px}
  .bili-rank ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 14px}
}
@media (max-width:900px){
  .bili-watch{grid-template-columns:1fr}
  .bili-rec{position:static}
  .bili-featured{grid-template-columns:1fr}
  .bf-cover{min-height:200px}
  .bili-grid.as-row .bili-cover{width:170px}
  .bili-grid.as-row .bili-meta{display:none}
}
@media (max-width:760px){
  .bili-grid,.bili-mainwrap .bili-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bn-stats{gap:20px}
  .bili-rank ol{grid-template-columns:1fr}
  .bt-search{margin-left:0;width:100%}
  .bt-search input{width:100%}
}
@media (max-width:520px){
  .bili-grid,.bili-mainwrap .bili-grid{grid-template-columns:1fr}
  .bili-chan{flex-wrap:wrap}
  .bili-chan .bn-act{margin-left:0;width:100%}
  .bili-grid.as-row .bili-cover{width:132px}
  .bili-grid.as-row .bili-title{font-size:13.5px}
}
@media (prefers-reduced-motion:reduce){
  .page-bili .bili-card:hover,.page-bili .bili-featured:hover{transform:none}
  .bili-cover img{transition:none}
  .bili-cover .bc-hover{transform:none}
}