/* FTV — صفحهٔ اصلی بازطراحی‌شده (۱.۳.۱) — RTL، تم تیره، سبک */
:root{
  --bg:#080c14; --bg2:#0d1421; --card:#111a2b; --card2:#152036; --line:#22304d;
  --txt:#e9eefb; --muted:#94a6c4; --acc:#25d07a; --acc2:#3ea6ff; --warn:#ffb020; --bad:#ff6b6b;
  --r:14px; --sh:0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--txt);
  font-family:Tahoma,"Segoe UI",system-ui,sans-serif;font-size:15px;line-height:1.8}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1280px;margin:0 auto;padding:0 16px}
.mut{color:var(--muted)}
.skl{background:linear-gradient(100deg,var(--card) 40%,var(--card2) 50%,var(--card) 60%);
  background-size:200% 100%;animation:sk 1.2s infinite;border-radius:10px;min-height:12px}
@keyframes sk{to{background-position:-200% 0}}

/* ─── هدر ─── */
header.top{position:sticky;top:0;z-index:50;background:rgba(8,12,20,.96);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header.top .bar{display:flex;align-items:center;gap:16px;padding:10px 16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:9px;font-weight:bold;font-size:18px;white-space:nowrap}
.brand .logo{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--acc),var(--acc2));font-size:19px}
nav.main{display:flex;gap:4px;flex-wrap:wrap;flex:1}
nav.main a{padding:7px 12px;border-radius:10px;color:var(--muted);font-size:14px}
nav.main a:hover{background:var(--card);color:var(--txt)}
nav.main a.on{background:var(--card2);color:var(--txt)}
.actions{display:flex;gap:8px}
.btn{display:inline-block;padding:8px 15px;border-radius:11px;font-size:13.5px;border:1px solid var(--line);cursor:pointer}
.btn.primary{background:var(--acc);border-color:var(--acc);color:#04220f;font-weight:bold}
.btn.primary:hover{filter:brightness(1.08)}
.btn.ghost{color:var(--txt);background:var(--card)}
.btn.ghost:hover{border-color:var(--acc2)}

/* بنر اصلی هدر */
.hbanner{margin:10px 0 12px;border-radius:var(--r);overflow:hidden;min-height:92px;
  border:1px solid var(--line);background:var(--card)}
.hbanner a{display:block}
.hbanner img{width:100%;height:112px;object-fit:cover}
.hbanner.house{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 22px;
  background:linear-gradient(105deg,#123 0%,#0d2b22 55%,#0c2338 100%)}
.hbanner.house .t{font-size:17px;font-weight:bold}
.hbanner.house .d{color:var(--muted);font-size:13px;margin-top:2px}
.hbanner.house .btn{white-space:nowrap}

/* ─── نوار نتایج زنده ─── */
.scores{background:var(--bg2);border-bottom:1px solid var(--line);overflow:hidden}
.scores-in{display:flex;align-items:center;gap:10px;padding:9px 16px;overflow-x:auto;white-space:nowrap}
.scores-in::-webkit-scrollbar{height:0}
.sc-title{color:var(--bad);font-weight:bold;font-size:13px;flex:0 0 auto;
  display:flex;align-items:center;gap:6px}
.sc-title::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--bad);
  animation:pulse 1.4s infinite}
@keyframes pulse{50%{opacity:.25}}
.chip{display:inline-flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);
  border-radius:10px;padding:5px 11px;font-size:13px;flex:0 0 auto}
.chip .lg{color:var(--muted);font-size:11.5px}
.chip .st{color:var(--acc);font-size:11.5px;min-width:34px;text-align:center}
.chip.done .st{color:var(--muted)}
.chip b{min-width:14px;text-align:center}

/* ─── چیدمان اصلی: پلیر راست، جدول پخش چپ ─── */
.hero{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:16px;margin:18px 0}
.player-box{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:10px}
.vframe{position:relative;border-radius:11px;overflow:hidden;background:#000;aspect-ratio:16/9}
.vframe video{width:100%;height:100%;display:block;object-fit:contain}
.vmask{position:absolute;inset:0;display:grid;place-items:center;background:rgba(5,8,14,.6);
  pointer-events:none;opacity:0;transition:.3s}
.vmask.show{opacity:1;pointer-events:auto}
.vmsg{background:var(--card2);border:1px solid var(--line);padding:12px 22px;border-radius:12px;font-size:14px}
.vmsg button{margin-inline-start:10px}
.pinfo{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 4px 6px;flex-wrap:wrap}
.pt{display:flex;align-items:center;gap:8px;font-size:15px}
.live-dot{width:9px;height:9px;border-radius:50%;background:var(--bad);animation:pulse 1.4s infinite}
.pr{color:var(--muted);font-size:12.5px;display:flex;gap:12px}
.och{display:flex;gap:6px;flex-wrap:wrap;padding-top:4px}
.och a{font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:9px;padding:4px 10px}
.och a:hover{color:var(--txt);border-color:var(--acc2)}

.sched{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px}
.sh{margin:0 0 10px;font-size:15px}
.sitem{display:flex;gap:11px;background:var(--bg2);border:1px solid var(--line);border-radius:12px;
  padding:9px 11px;margin-bottom:9px;cursor:pointer;align-items:center}
.sitem:hover{border-color:var(--acc2)}
.sitem .thumb{width:74px;height:46px;border-radius:8px;flex:0 0 auto;object-fit:cover;
  background:linear-gradient(135deg,#173b5e,#123b2c)}
.sitem .tt{font-size:13.5px;line-height:1.5}
.sitem .tm{font-size:11.5px;color:var(--muted);margin-top:2px}
.sitem.on{border-color:var(--acc)}
.sitem.on .tm{color:var(--acc)}
.badge-live{background:var(--bad);color:#fff;border-radius:6px;font-size:10.5px;padding:1px 7px}

/* ─── دو بنر تمام‌عرض زیر پلیر ─── */
.banners2{display:grid;gap:12px;margin:4px 0 8px}
.bslot{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--card);min-height:96px}
.bslot a{display:block}
.bslot img{width:100%;height:110px;object-fit:cover}
.bslot.house{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 22px}
.bslot.house .t{font-size:16px;font-weight:bold}
.bslot.house .d{color:var(--muted);font-size:12.5px}
.bslot.house.h1{background:linear-gradient(100deg,#0d2438 0%,#123 60%,#0e2f26 100%)}
.bslot.house.h2{background:linear-gradient(100deg,#102a1c 0%,#0d1c30 60%,#231a33 100%)}

/* ─── بخش‌ها ─── */
.sec{margin:26px 0}
.h2{font-size:18px;margin:0 0 13px;padding-inline-start:10px;border-inline-start:4px solid var(--acc)}
.vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.vcard{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;cursor:pointer}
.vcard:hover{border-color:var(--acc2)}
.vcard .cov{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,#173b5e,#3b2317)}
.vcard .cov img{width:100%;height:100%;object-fit:cover}
.vcard .dur{position:absolute;bottom:6px;inset-inline-end:6px;background:rgba(0,0,0,.75);
  border-radius:6px;font-size:11px;padding:1px 7px}
.vcard .tt{padding:9px 11px;font-size:13px;line-height:1.6;height:58px;overflow:hidden}
.vcard .vw{padding:0 11px 9px;color:var(--muted);font-size:11.5px}
.vcard.playing{border-color:var(--acc)}

.agrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.wm{position:absolute;z-index:5;pointer-events:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
.egrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ecard{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);
  aspect-ratio:16/8.2;background:linear-gradient(135deg,#12203a,#0e2b22)}
.ecard img{width:100%;height:100%;object-fit:cover;opacity:.55}
.ecard .in{position:absolute;inset:auto 0 0 0;padding:12px 14px;
  background:linear-gradient(0deg,rgba(4,7,12,.95),transparent)}
.ecard .t{font-size:14.5px;font-weight:bold}
.ecard .d{font-size:11.5px;color:#c6d2e8;margin-top:2px}
.ecard .tag{position:absolute;top:10px;inset-inline-start:10px;background:rgba(37,208,122,.9);
  color:#04220f;border-radius:7px;font-size:11px;padding:2px 9px;font-weight:bold}

.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pcard{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:11px 13px}
.pcard .row{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.pcard .ic{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:19px;flex:0 0 auto;
  background:linear-gradient(135deg,#23406b,#1c4a38)}
.pcard .t{font-size:13px;line-height:1.55;height:40px;overflow:hidden}
.pcard .m{color:var(--muted);font-size:11.5px;margin-top:2px}
.pcard audio{width:100%;height:34px}

/* ─── فوتر کامل ─── */
.foot{margin-top:40px;border-top:1px solid var(--line);background:var(--bg2)}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:26px;padding:26px 16px 18px}
.fb{display:flex;align-items:center;gap:9px;font-weight:bold;font-size:16px}
.fb .logo{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--acc),var(--acc2))}
.foot h4{font-size:14px;margin:4px 0 10px;color:var(--txt)}
.foot .fgrid a{display:block;color:var(--muted);font-size:13px;padding:3px 0}
.foot .fgrid a:hover{color:var(--acc2)}
.foot p{font-size:12.5px;line-height:1.9}
.fbar{display:flex;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);
  padding:12px 16px 26px;font-size:12.5px;color:var(--muted)}

/* ─── واکنش‌گرا ─── */
@media (max-width:1020px){
  .hero{grid-template-columns:1fr}
  .vgrid{grid-template-columns:repeat(2,1fr)}
  .agrid{grid-template-columns:repeat(2,1fr)}
  .pgrid{grid-template-columns:repeat(2,1fr)}
  .egrid{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  nav.main{order:3;width:100%}
  .vgrid,.agrid,.pgrid{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr}
  .hbanner.house,.bslot.house{flex-direction:column;align-items:flex-start;gap:8px}
}