/* ============================================================
   Qaksez 影视站 — 全端框架样式
   手机 / 平板 / 电脑 / 电视 四种形态
   ============================================================ */

/* ---------- 字体 ---------- */
@font-face{
  font-family:'UyghurFont';
  src:url('/fonts/uyghur.woff2') format('woff2');
  font-display:swap;
  font-weight:400; font-style:normal;
}
@font-face{
  font-family:'KaiFont';
  src:url('/fonts/kai.woff2') format('woff2');
  font-display:swap;
  font-weight:400; font-style:normal;
}

:root{
  --green:#7ed957; --green-d:#4caf50;
  --blue:#3b9dff;  --blue-d:#2b7fe0;
  --purple:#7c4dff; --orange:#ff7043; --gold:#f5a623;
  --ink:#1f2430; --ink2:#414756; --muted:#8b90a3;
  --line:#e8eaee; --card:#fff;
  --safe-t:env(safe-area-inset-top,0px);
  --safe-b:env(safe-area-inset-bottom,0px);

  /* 字号随视口缩放，手机到电视自动放大 */
  --fs-xs:12px; --fs-sm:13px; --fs-md:15px; --fs-lg:18px; --fs-xl:23px;
  --gap:10px;
  --tabh:56px;
  --maxw:520px;
  --radius:14px;
  --shadow:0 2px 10px rgba(0,0,0,.08);
}
html[lang="zh-CN"]{
  --font-cn:'KaiFont','KaiTi','STKaiti','楷体',serif;
  --font-ug:'KaiFont','KaiTi','STKaiti','楷体',serif;
}
html[lang="ug"]{
  --font-cn:'KaiFont','KaiTi','STKaiti','楷体',serif;
  --font-ug:'UyghurFont','ALKATIPTalik','Noto Naskh Arabic','Tahoma',sans-serif;
}
html[lang="ug"] body.ug{font-family:'UyghurFont','ALKATIPTalik',var(--font-cn);}
html[lang="zh-CN"] body{font-family:'KaiFont','KaiTi','STKaiti','楷体',serif;}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;width:100%;}
body{
  font-family:var(--font-cn);
  color:var(--ink);
  background:linear-gradient(180deg,#e9f8ea 0%,#eef7fb 26%,#f4f0fb 55%,#fdf3ef 100%);
  background-attachment:fixed;
  min-height:100vh; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
/* 大屏时给 body 一个浅灰底，凸显中间的内容区 */
@media (min-width:1100px){
  body{background:#dfe3ea;}
}

/* ============================================================
   设备适配：手机（基准）/ 平板 / 电脑 / 电视
   ============================================================ */

/* --- 手机：基准样式已在上面，这里只做小屏微调 --- */
@media (max-width:360px){
  :root{--gap:8px;--tabh:52px;}
  .cats{gap:6px;}
  .cat .cir{width:46px;height:46px;font-size:20px;}
  .banner{margin:8px 8px 0;}
  .notice{margin:10px 8px;padding:8px 10px;}
  .grid3,.rows{padding:0 8px;}
  .hscroll{padding-left:8px;padding-right:8px;}
  .sect{margin-left:8px;margin-right:8px;}
  .eps{padding:0 8px;gap:6px;}
  .topbar{padding-left:10px;padding-right:10px;}
}

/* --- 小平板竖屏：两列更舒服 --- */
@media (min-width:480px) and (max-width:699px){
  .grid3{grid-template-columns:repeat(3,1fr);}
  .vgrid{grid-template-columns:repeat(3,1fr);}
  .rewgrid{grid-template-columns:repeat(3,1fr);}
  .eps{grid-template-columns:repeat(6,1fr);}
}

/* --- 平板：>= 700px，网格变 4 列，卡片变大 --- */
@media (min-width:700px){
  :root{
    --fs-xs:13px; --fs-sm:14px; --fs-md:16px; --fs-lg:20px; --fs-xl:26px;
    --gap:14px; --tabh:64px; --maxw:900px; --radius:16px;
  }
  .grid3{grid-template-columns:repeat(4,1fr) !important;}
  .hcard{flex-basis:150px !important;}
  .hcard .pv{width:150px !important;height:214px !important;}
  .cats{grid-template-columns:repeat(4,1fr) !important;gap:16px !important;}
  .cat .cir{width:70px !important;height:70px !important;font-size:32px !important;}
  .cat .nm{font-size:var(--fs-sm) !important;}
  .big{height:340px !important;}
  .big .bitem{width:236px !important;height:326px !important;}
}

/* --- 电脑：>= 1100px，6 列 + 鼠标悬停态 --- */
@media (min-width:1100px){
  :root{
    --fs-xs:14px; --fs-sm:15px; --fs-md:17px; --fs-lg:22px; --fs-xl:30px;
    --gap:16px; --tabh:66px; --maxw:1280px; --radius:18px;
  }
  .grid3{grid-template-columns:repeat(6,1fr) !important;}
  .hcard{flex-basis:170px !important;}
  .hcard .pv{width:170px !important;height:242px !important;}
  .big{height:400px !important;}
  .big .bitem{width:276px !important;height:380px !important;}
  .cats{grid-template-columns:repeat(8,1fr) !important;}

  /* 桌面端：内容区居中，卡片浮起+悬停效果 */
  .gcard:hover .pv,.hcard:hover .pv{transform:translateY(-4px);
    box-shadow:0 10px 24px rgba(0,0,0,.16);}
  .gcard .pv,.hcard .pv{transition:transform .2s ease,box-shadow .2s ease;}
  .row:hover{background:#fff;box-shadow:var(--shadow);}
  .tab{transition:color .15s;}
  .tab:hover{color:var(--blue-d);}
  /* 桌面端键盘可达 */
  .tab:focus-visible,.chip:focus-visible,.gcard:focus-visible{
    outline:2px solid var(--blue);outline-offset:2px;}
}

/* --- 电视：>= 1600px，超大字号 + 遥控器焦点框 --- */
@media (min-width:1600px){
  :root{
    --fs-xs:20px; --fs-sm:22px; --fs-md:26px; --fs-lg:32px; --fs-xl:42px;
    --gap:24px; --tabh:92px; --maxw:1800px; --radius:22px;
  }
  .grid3{grid-template-columns:repeat(8,1fr) !important;}
  .hcard{flex-basis:230px !important;}
  .hcard .pv{width:230px !important;height:328px !important;}
  .big{height:520px !important;}
  .big .bitem{width:358px !important;height:492px !important;}
  .cats{grid-template-columns:repeat(8,1fr) !important;gap:30px !important;}
  .cat .cir{width:110px !important;height:110px !important;font-size:52px !important;}
  .sect .txt .u{font-size:30px !important;}
  .sect .txt .b{font-size:24px !important;}

  /* 电视：焦点必须非常明显（遥控器方向键） */
  .tab:focus-visible,.chip:focus-visible,.gcard:focus-visible,
  .vcard:focus-visible,.actcard:focus-visible,.ep:focus-visible,
  .hcard:focus-visible,.quick:focus-visible{
    outline:4px solid var(--gold);
    outline-offset:4px;
    transform:scale(1.06);
    box-shadow:0 0 0 10px rgba(245,166,35,.25);
  }
  .gcard .pv,.hcard .pv{transition:transform .2s,box-shadow .2s;}
  .ep{min-height:96px;font-size:var(--fs-lg);}
  .badge-r{font-size:var(--fs-sm);}
  .badge-d{font-size:var(--fs-xs);}
}

/* --- 横屏矮屏（手机横放）：压缩纵向占用 --- */
@media (max-height:520px) and (orientation:landscape){
  :root{--tabh:48px;}
  .big{height:200px !important;}
  .big .bitem{height:180px !important;width:128px !important;}
  .hero{padding:14px !important;}
}

/* --- 低端设备/省流：关掉动画 --- */
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;}
}

/* ============================================================
   通用组件
   ============================================================ */
.app{
  max-width:var(--maxw);margin:0 auto;min-height:100vh;
  position:relative;
  background:linear-gradient(180deg,#e9f8ea 0%,#eef7fb 26%,#f4f0fb 55%,#fdf3ef 100%);
  background-attachment:fixed;
  padding-bottom:calc(var(--tabh) + var(--safe-b) + 16px);
}

/* 顶栏 */
.topbar{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;gap:10px;
  padding:calc(8px + var(--safe-t)) 14px 8px;
  background:rgba(255,255,255,.82);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid rgba(0,0,0,.05);
}
.iconbtn{
  width:34px;height:34px;border:0;background:transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;flex:0 0 auto;
  border-radius:8px;
}
.iconbtn:focus-visible{outline:2px solid var(--blue);}
.iconbtn svg{width:21px;height:21px;stroke:var(--ink);fill:none;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.sitebrand{
  flex:1;text-align:center;font-size:var(--fs-lg);font-weight:700;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;
}
.langsw{display:flex;background:#eef0f4;border-radius:16px;padding:2px;flex:0 0 auto;}
.langsw button{
  border:0;background:transparent;font-size:var(--fs-xs);font-weight:700;
  color:var(--muted);padding:5px 11px;border-radius:14px;cursor:pointer;
  font-family:inherit;
}
.langsw button.on{background:var(--blue);color:#fff;}

/* Banner 轮播 */
.banner{
  margin:10px 12px 0;border-radius:var(--radius);overflow:hidden;
  position:relative;aspect-ratio:16/10;background:#dfe3ea;
  box-shadow:0 4px 16px rgba(0,0,0,.08);
}
.banner .track{display:flex;height:100%;
  transition:transform .45s cubic-bezier(.4,0,.2,1);}
.banner .slide{min-width:100%;height:100%;position:relative;cursor:pointer;}
.banner .slide img{width:100%;height:100%;object-fit:cover;display:block;}
.banner .slide .ph,.actcard .thumb,.gcard .pv .ph,.hcard .pv .ph,
.rewcard .thumb,.vcard .cover .ph,.row .pv .ph{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  font-size:2em;color:#fff;background:linear-gradient(135deg,#5a6b8c,#2f3a52);
}
.banner .cap{
  position:absolute;left:0;right:0;bottom:0;padding:24px 14px 10px;color:#fff;
  font-size:var(--fs-md);font-weight:700;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.72));
}
.banner .dots{position:absolute;bottom:6px;left:0;right:0;
  display:flex;justify-content:center;gap:5px;}
.banner .dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5);}
.banner .dots i.on{width:18px;border-radius:3px;background:#fff;}

/* 通知条 */
.notice{display:flex;align-items:center;gap:8px;margin:12px;padding:9px 12px;
  background:rgba(255,255,255,.9);border-radius:12px;font-size:var(--fs-sm);
  border:1px solid rgba(0,0,0,.05);}
.notice .bell{flex:0 0 auto;font-size:1.15em;}
.notice .tx{flex:1;overflow:hidden;white-space:nowrap;position:relative;height:1.6em;}
.notice .tx span{position:absolute;white-space:nowrap;display:block;
  line-height:1.6;animation:mv 18s linear infinite;}
@keyframes mv{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}

/* 圆形分类 */
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);
  padding:6px 12px 4px;}
.cat{display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;
  border:0;background:transparent;padding:0;font-family:inherit;}
.cat .cir{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;font-size:24px;color:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,.14);transition:transform .15s;}
.cat:active .cir{transform:scale(.9);}
.cat .nm{font-size:var(--fs-xs);text-align:center;line-height:1.3;}

/* //装饰分区标题 */
.sect{margin:22px 12px 10px;display:flex;align-items:center;gap:8px;}
.sect .ln{flex:1;height:3px;border-radius:2px;
  background:linear-gradient(90deg,var(--blue),#7ec8ff);}
.sect .ln.r{background:linear-gradient(270deg,var(--blue),#7ec8ff);}
.sect .sl{color:var(--blue);font-size:1.4em;font-weight:900;
  letter-spacing:-3px;line-height:1;flex:0 0 auto;}
.sect .txt{flex:0 0 auto;text-align:center;min-width:110px;}
.sect .txt .u{display:block;font-size:var(--fs-lg);font-weight:700;line-height:1.25;}
.sect .txt .b{display:block;font-size:var(--fs-md);font-weight:700;
  color:var(--blue);font-family:Arial,sans-serif;line-height:1.3;}

/* 横向海报卡 */
.hscroll{display:flex;gap:var(--gap);overflow-x:auto;padding:2px 12px 6px;
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;}
.hscroll::-webkit-scrollbar{display:none;}
.hcard{flex:0 0 116px;scroll-snap-align:start;cursor:pointer;}
.hcard .pv{width:116px;height:168px;border-radius:10px;overflow:hidden;
  position:relative;background:#dfe3ea;box-shadow:0 2px 8px rgba(0,0,0,.1);}
.hcard .pv img,.gcard .pv img,.vcard .cover img,.row .pv img,
.rewcard .thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.hcard .tt{margin-top:6px;font-size:var(--fs-xs);font-weight:600;text-align:center;
  line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden;}
.hcard .st{margin-top:2px;font-size:calc(var(--fs-xs) - 2px);color:var(--muted);
  text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* 角标 */
.badge-r{position:absolute;top:0;left:0;background:var(--green-d);color:#fff;
  font-size:var(--fs-xs);font-weight:700;padding:2px 6px;
  border-radius:0 0 8px 0;line-height:1.4;font-family:Arial,sans-serif;}
.badge-d{position:absolute;top:0;right:0;background:var(--blue);color:#fff;
  font-size:calc(var(--fs-xs) - 2px);font-weight:700;padding:2px 6px;
  border-radius:0 0 0 8px;line-height:1.5;}

/* 大图轮播 */
.bigwrap{position:relative;padding:8px 0 4px;overflow:hidden;}
.big{display:flex;align-items:center;justify-content:center;height:250px;position:relative;}
.big .bitem{position:absolute;width:172px;height:238px;border-radius:12px;
  overflow:hidden;cursor:pointer;
  transition:transform .5s cubic-bezier(.4,0,.2,1),opacity .5s;
  box-shadow:0 6px 20px rgba(0,0,0,.22);background:#dfe3ea;}
.big .bitem img{width:100%;height:100%;object-fit:cover;display:block;}
.big .bitem .no{position:absolute;top:6px;left:8px;font-size:22px;font-weight:800;
  color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.6);font-family:Arial,sans-serif;}
.big .bitem .nm{position:absolute;left:0;right:0;bottom:0;padding:16px 6px 6px;
  color:#fff;font-size:var(--fs-xs);font-weight:600;text-align:center;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.78));}

/* 三列网格 */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);padding:0 12px;}
.gcard{cursor:pointer;}
.gcard .pv{position:relative;width:100%;aspect-ratio:3/4.2;border-radius:9px;
  overflow:hidden;background:#dfe3ea;box-shadow:0 2px 8px rgba(0,0,0,.12);}
.gcard .tt{margin-top:5px;font-size:var(--fs-xs);font-weight:600;line-height:1.3;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gcard .st{font-size:calc(var(--fs-xs) - 2px);color:var(--muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* 活动卡 */
.actgrid{display:grid;grid-template-columns:1fr;gap:var(--gap);}
.actcard{background:var(--card);border-radius:var(--radius);padding:12px;
  display:flex;gap:12px;align-items:center;cursor:pointer;}
.actcard .thumb{width:80px;height:80px;border-radius:10px;flex:0 0 auto;
  font-size:22px;}
.actcard .body{flex:1;min-width:0;}
.actcard h4{margin:0 0 4px;font-size:var(--fs-md);}
.actcard p{margin:0;font-size:var(--fs-xs);color:var(--muted);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.actcard .reward{font-size:var(--fs-xs);color:var(--orange);margin-top:4px;}

/* 奖励卡 */
.rewgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--gap);}
.rewcard{background:var(--card);border-radius:var(--radius);overflow:hidden;text-align:center;}
.rewcard .thumb{height:90px;font-size:26px;}
.rewcard h4{margin:8px 6px 4px;font-size:var(--fs-sm);}
.rewcard p{margin:0 6px 8px;font-size:var(--fs-xs);color:var(--muted);}
.rewcard .pts{font-size:var(--fs-xs);color:var(--blue);font-weight:700;padding-bottom:8px;}
@media (min-width:700px){ .rewgrid{grid-template-columns:repeat(4,1fr);} }

/* 视频卡 */
.vgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--gap);}
@media (min-width:700px){ .vgrid{grid-template-columns:repeat(4,1fr);} }
@media (min-width:1100px){ .vgrid{grid-template-columns:repeat(6,1fr);} }
.vcard{background:var(--card);border-radius:var(--radius);overflow:hidden;cursor:pointer;}
.vcard .cover{height:110px;position:relative;font-size:30px;
  background:linear-gradient(135deg,#ff9a6c,#ff6a88);background-size:cover;
  background-position:center;}
.vcard .cover .play{position:absolute;inset:0;margin:auto;width:38px;height:38px;
  border-radius:50%;background:rgba(0,0,0,.35);display:flex;align-items:center;
  justify-content:center;color:#fff;font-size:16px;}
.vcard .vt{padding:8px 10px;font-size:var(--fs-xs);line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* 列表行 */
.rows{padding:0 12px;}
.row{display:flex;gap:11px;align-items:center;background:rgba(255,255,255,.94);
  border-radius:12px;padding:10px;margin-bottom:9px;cursor:pointer;}
.row .pv{position:relative;width:62px;height:86px;border-radius:8px;
  overflow:hidden;flex:0 0 auto;background:#dfe3ea;}
.row .info{flex:1;min-width:0;}
.row .info h3{margin:0 0 4px;font-size:var(--fs-md);line-height:1.35;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;}
.row .info p{margin:0;font-size:var(--fs-xs);color:var(--muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.row .go{color:var(--muted);font-size:1.2em;flex:0 0 auto;}
@media (min-width:700px){ .rows{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;} }

/* 选集 */
.eps{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:0 12px;}
@media (min-width:700px){ .eps{grid-template-columns:repeat(8,1fr);} }
@media (min-width:1100px){ .eps{grid-template-columns:repeat(12,1fr);} }
@media (min-width:1600px){ .eps{grid-template-columns:repeat(16,1fr);} }
.ep{aspect-ratio:1/.78;border:1px solid var(--line);border-radius:9px;background:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;font-size:var(--fs-sm);cursor:pointer;font-family:inherit;
  color:var(--ink);padding:0;overflow:hidden;}
.ep small{font-size:.65em;color:var(--muted);max-width:100%;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;padding:0 3px;}
.ep.on{background:linear-gradient(135deg,var(--blue),var(--blue-d));color:#fff;
  border-color:transparent;font-weight:700;}
.ep.on small{color:rgba(255,255,255,.85);}
/* 续播进度红点 */
.ep .rdot{position:absolute;top:5px;inset-inline-start:5px;width:7px;height:7px;
  border-radius:50%;background:var(--nv-red,#e8383d);box-shadow:0 0 0 2px rgba(255,255,255,.7);}
.ep{position:relative;}

/* 按钮 */
.btn{display:inline-block;border:0;border-radius:24px;padding:11px 22px;
  font-size:var(--fs-md);font-weight:700;cursor:pointer;font-family:inherit;
  transition:transform .15s,opacity .15s;}
.btn:active{transform:scale(.97);}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--blue-d));
  color:#fff;width:100%;text-align:center;}
.btn-light{background:#fff;color:var(--orange);}
.btn-sm{padding:7px 16px;font-size:var(--fs-sm);}

/* 芯片/筛选 */
.filters,.sorts,.tabs{display:flex;gap:7px;overflow-x:auto;padding:6px 12px 12px;}
.filters::-webkit-scrollbar,.sorts::-webkit-scrollbar,.tabs::-webkit-scrollbar{display:none;}
.chip,.sorts button,.tabs button{
  border:1px solid rgba(0,0,0,.06);background:rgba(255,255,255,.92);color:var(--ink2);
  border-radius:20px;padding:7px 14px;font-size:var(--fs-sm);white-space:nowrap;
  cursor:pointer;font-family:inherit;flex:0 0 auto;
}
.chip.on,.sorts button.on,.tabs button.on{
  background:linear-gradient(135deg,var(--blue),var(--blue-d));color:#fff;
  border-color:transparent;font-weight:700;}
.sorts button{border:0;background:transparent;border-radius:8px;
  color:var(--muted);padding:3px 8px;}
.sorts button.on{background:rgba(255,255,255,.92);}
.tabs button{flex:1;}

/* 表单 */
label{display:block;font-size:var(--fs-xs);color:var(--muted);margin:12px 0 5px;}
input,textarea,select{width:100%;padding:11px 13px;border:1px solid var(--line);
  border-radius:10px;font-size:var(--fs-md);font-family:inherit;background:#fff;
  color:var(--ink);}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--blue);}
textarea{min-height:70px;resize:vertical;}
.hint{font-size:var(--fs-xs);color:var(--muted);line-height:1.7;
  background:#f7f8fc;border-radius:8px;padding:9px 11px;margin:8px 0;}

/* 底部导航 —— 5 项：首页 / 电视剧 / 活动 / 类型 / 我的
   注意：html[dir=ltr] 时按 LTR 从左到右排列；RTL 语种镜像成从右到左 */
/* 底部导航
   用 inset-inline + margin:auto 居中，避免 left:50%+translateX
   在 RTL 环境下参照系错乱（曾导致桌面上缩成右下角一小块） */
.tabbar{
  position:fixed;bottom:0;left:0;right:0;
  margin:0 auto;
  width:100%;max-width:var(--maxw);
  z-index:60;
  height:calc(var(--tabh) + var(--safe-b));padding-bottom:var(--safe-b);
  display:flex;align-items:center;justify-content:space-around;
  background:rgba(255,255,255,.95);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-top:1px solid rgba(0,0,0,.06);
  box-shadow:0 -2px 14px rgba(0,0,0,.06);
}
html[dir="rtl"] .tabbar{flex-direction:row-reverse;}
.tab{
  flex:1;height:100%;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:3px;cursor:pointer;border:0;background:transparent;
  color:var(--muted);font-size:calc(var(--fs-xs) - 1px);
  font-family:inherit;padding:0;position:relative;
}
.tab svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;}
.tab.on{color:var(--blue);font-weight:700;}
.tab.on svg{stroke-width:2.4;}
.tab .lbl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;
  padding:0 2px;}
@media (min-width:1600px){ .tab svg{width:34px;height:34px;} }

/* 详情页遮罩 */
.overlay{position:fixed;inset:0;background:#fff;z-index:70;display:none;
  flex-direction:column;}
.overlay.show{display:flex;}
.overlay .obar{display:flex;align-items:center;gap:10px;
  padding:calc(10px + var(--safe-t)) 14px 10px;border-bottom:1px solid var(--line);}
.overlay .obody{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px;}
.overlay h2{margin:0 0 10px;font-size:var(--fs-xl);line-height:1.4;}
.overlay .cover-img{width:100%;border-radius:var(--radius);margin-bottom:14px;
  max-height:40vh;object-fit:cover;}
.article-body{font-size:var(--fs-md);line-height:1.85;}
.article-body p{margin:0 0 12px;}

/* 空态 / 加载 */
.empty{text-align:center;color:var(--muted);font-size:var(--fs-sm);padding:34px 12px;}
.empty .ic{font-size:2.4em;display:block;margin-bottom:8px;opacity:.5;}
.loadmore{margin:18px 12px 8px;text-align:center;}
.loadmore button{border:1px solid var(--line);background:rgba(255,255,255,.92);
  color:var(--muted);border-radius:22px;padding:9px 26px;font-size:var(--fs-sm);
  cursor:pointer;font-family:inherit;}

.toast{position:fixed;left:50%;top:40%;transform:translate(-50%,-50%);
  background:rgba(0,0,0,.82);color:#fff;padding:10px 18px;border-radius:10px;
  font-size:var(--fs-sm);z-index:99;opacity:0;pointer-events:none;
  transition:.2s;max-width:80%;text-align:center;}
.toast.show{opacity:1;}

/* TV 端：模拟遥控器方向键的焦点提示条 */
.tv-hint{display:none;}
@media (min-width:1600px){
  .tv-hint{display:flex;align-items:center;justify-content:center;gap:18px;
    padding:8px;font-size:var(--fs-xs);color:var(--muted);
    background:rgba(0,0,0,.04);}
  .tv-hint kbd{background:#fff;border:1px solid var(--line);border-radius:5px;
    padding:2px 8px;font-family:Arial,sans-serif;margin:0 2px;
    box-shadow:0 1px 2px rgba(0,0,0,.08);}
}