/* ============================================================
   zhibolist — 本页特有样式
   依赖 css/common.css，请保持该文件先于本文件加载
   来源：原 <style> 内联块中仅本页使用的规则
   ============================================================ */
/* 赛事快捷入口 — 移动端导航面板内 */
.mnav-league-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mnav-league-item{display:flex;align-items:center;gap:10px;padding:11px 14px;font-size:13px;font-weight:500;color:var(--t700);background:var(--bg);border:1px solid var(--bdl);border-radius:10px;cursor:pointer;transition:var(--e);text-decoration:none}
.mnav-league-item:hover,.mnav-league-item:active{background:var(--p50);border-color:var(--p200);color:var(--p700)}
.mnav-league-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.mnav-league-item span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* SUBNAV 赛事副导航 */
.subnav{
  position:relative;
  background:linear-gradient(135deg,rgba(236,253,245,.92) 0%,rgba(209,250,229,.6) 50%,rgba(167,243,208,.3) 100%);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--p200);
}
.subnav-scroll{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  max-width:1240px;
  margin:0 auto;
  padding:10px 24px;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.subnav-scroll::-webkit-scrollbar{display:none}
.sn-item{
  flex-shrink:0;
  display:flex;align-items:center;gap:6px;
  padding:9px 18px;font-size:13px;font-weight:500;
  color:var(--t700);
  background:rgba(255,255,255,.5);
  border:1px solid rgba(226,232,240,.4);
  border-radius:20px;
  cursor:pointer;transition:var(--e);white-space:nowrap;
  margin-right:6px;text-decoration:none;
}
.sn-item:last-child{margin-right:0}
.sn-item:hover{background:var(--bg);border-color:var(--p200);color:var(--p700);box-shadow:0 2px 8px rgba(5,150,105,.12);transform:translateY(-1px)}
.sn-item.on{background:var(--p);border-color:var(--p);color:#fff;font-weight:600;box-shadow:0 3px 12px rgba(5,150,105,.3)}
.sn-item.on:hover{background:var(--p700);border-color:var(--p700)}
.sn-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.breadcrumb{padding:14px 0 0}
.breadcrumb .wrap{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--t400)}
.breadcrumb a{color:var(--t500);transition:var(--e)}
.breadcrumb a:hover{color:var(--p)}
.breadcrumb .sep{color:var(--t300)}
.breadcrumb .cur{color:var(--t900);font-weight:600}
.page{padding:16px 0 40px}
.col-s{width:360px;flex-shrink:0}
.day-sep{padding:0 18px;height:36px;display:flex;align-items:center;gap:10px;background:linear-gradient(90deg,var(--p50),rgba(236,253,249,.3));border-bottom:1px solid var(--p100);border-top:1px solid var(--p100)}
.day-sep:first-of-type{border-top:none}
.day-sep .ds-icon{width:22px;height:22px;background:var(--p);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.day-sep .ds-icon svg{width:13px;height:13px;fill:#fff}
.day-sep .ds-text{font-size:12px;font-weight:700;color:var(--p800);white-space:nowrap}
.day-sep .ds-line{flex:1;height:1px;background:var(--p200)}
/* 赛事卡片 PC端 */
.match-card{display:grid;grid-template-columns:120px 1fr 88px;align-items:center;padding:0 18px;height:62px;border-bottom:1px solid var(--bdl);transition:var(--e);cursor:pointer;text-decoration:none}
.match-card:last-child{border-bottom:none}
.match-card:hover{background:var(--p50)}
.mc-left{display:flex;align-items:center;gap:8px}
.mc-time{font-family:'DM Mono',monospace;font-size:14px;font-weight:600;color:var(--t900);line-height:1.2}
.mc-league{display:flex;align-items:center}
.mc-league .tag{font-size:13px;font-weight:700;color:var(--p800);line-height:1.3;padding:2px 8px;background:var(--p50);border-radius:4px}
.mc-mid{display:flex;align-items:center;justify-content:center;gap:14px}
.mc-team{display:flex;align-items:center;gap:8px;min-width:0}
.mc-team.r{flex-direction:row-reverse;text-align:right}
.mc-team .logo{width:28px;height:28px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 1px 2px rgba(0,0,0,.06))}
.mc-team .name{font-size:13px;font-weight:600;color:var(--t900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-score{font-family:'DM Mono',monospace;font-size:20px;font-weight:700;color:var(--p700);letter-spacing:3px}
.mc-vs{font-size:11px;color:var(--t300);font-weight:700;letter-spacing:1px}
.mc-right{display:flex;align-items:center;justify-content:flex-end}
.mc-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;width:88px;height:28px;padding:0 12px;border-radius:8px;font-size:11px;font-weight:600;border:1.5px solid;cursor:pointer;font-family:inherit;transition:var(--e);text-decoration:none;flex-shrink:0}
.mc-btn.live{color:#dc2626;border-color:#fecaca;background:rgba(239,68,68,.04)}
.mc-btn.live:hover{background:rgba(239,68,68,.1)}
.mc-btn.live .sd{width:5px;height:5px;background:#dc2626;border-radius:50%;animation:blink 1.5s ease-in-out infinite;flex-shrink:0}
.mc-btn.up{color:var(--p700);border-color:var(--p200);background:rgba(5,150,105,.04)}
.mc-btn.up:hover{background:rgba(5,150,105,.1)}
.mc-btn.end{color:var(--t400);border-color:var(--bdl);background:rgba(148,163,184,.06)}
.mc-btn.end:hover{background:var(--bdl)}
.match-card.is-live{border-left:3px solid rgba(239,68,68,.25);padding-left:15px;background:linear-gradient(90deg,rgba(254,242,242,.3),transparent)}
.match-card.is-live .mc-time{color:var(--red);font-weight:700}
.match-card.is-live .mc-league .tag{color:var(--red);background:var(--r50)}
.match-card.is-done{opacity:.75}
.match-card.is-done:hover{opacity:1}
.match-card.is-done .mc-time{color:var(--t400)}
.match-card.is-done .mc-score{color:var(--t500)}
.match-card.is-done .mc-league .tag{color:var(--t400);background:var(--bdl)}
.match-card.is-upcoming .mc-score{color:var(--t300);font-weight:400}
@keyframes blink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.8)}}
.sn-list{padding:4px 0}
.sn-item-news{display:flex;align-items:flex-start;gap:8px;padding:8px 14px;border-bottom:1px solid var(--bdl);cursor:pointer;transition:background .15s}
.sn-item-news:last-child{border-bottom:none}
.sn-item-news:hover{background:var(--p50)}
.sn-item-news:hover h4{color:var(--p)}
.sn-idx{width:18px;height:18px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff;flex-shrink:0;margin-top:2px}
.si-1{background:linear-gradient(135deg,#ef4444,#dc2626)}
.si-2{background:linear-gradient(135deg,#f97316,#ea580c)}
.si-3{background:linear-gradient(135deg,#eab308,#ca8a04)}
.si-n{background:var(--bdl);color:var(--t400)}
.sn-item-news .sn-body{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:8px}
.sn-item-news .sn-body h4{font-size:12px;font-weight:500;color:var(--t900);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .15s;flex:1;min-width:0}
.sn-item-news .sn-time{font-size:11px;color:var(--t400);font-family:'DM Mono',monospace;flex-shrink:0;white-space:nowrap}
.vi-s{display:flex;align-items:center;gap:8px;padding:8px 14px;border-bottom:1px solid var(--bdl);cursor:pointer;transition:background .15s}
.vi-text{flex:1;font-size:12px;font-weight:500;color:var(--t900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mbb-item{display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px 12px;cursor:pointer;-webkit-tap-highlight-color:transparent;text-decoration:none;position:relative}
.mbb-dot{position:absolute;top:-3px;right:4px;width:8px;height:8px;background:var(--red);border-radius:50%;border:2px solid #fff}
/* ===================== 响应式 ===================== */
@media(max-width:1080px){.col-s{width:300px}}
@media(max-width:1024px){
  .page .wrap{flex-direction:column;align-items:stretch}
  .col-s{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .col-s > section:first-child{grid-column:1/-1}
  .page{padding-bottom:80px}
}
@media(max-width:768px){
  .nav>li>a{padding:16px 12px;font-size:13px}
  .nav-drop{left:0;transform:translateX(0) translateY(6px)}.nav>li:hover .nav-drop{transform:translateX(0) translateY(0)}.nav-drop::before{left:24px}
  .col-s{grid-template-columns:1fr}
  .sn-item{padding:8px 14px;font-size:12px}
  .match-card{
    display:grid;
    grid-template-columns:1fr auto;
    grid-template-rows:auto auto;
    height:auto;
    padding:14px 16px;
    gap:10px 0;
    border-radius:10px;
    border:1px solid var(--bdl);
    margin:0 0 8px;
    background:var(--bg-card);
  }
  .match-card:last-child{margin-bottom:0}
  .mc-left{grid-column:1;grid-row:1;justify-content:flex-start;align-self:center}
  .mc-right{grid-column:2;grid-row:1;justify-content:flex-end;align-self:center}
  .mc-mid{grid-column:1/-1;grid-row:2;justify-content:center}
  .mc-btn{width:auto;height:26px;padding:0 10px;font-size:11px}
  .mc-team .logo{width:26px;height:26px}.mc-team .name{font-size:12px}
  .mc-score{font-size:18px;letter-spacing:2px}
  .match-card:hover{background:var(--p50)}
  .match-card.is-live{border-color:rgba(239,68,68,.2);border-left:3px solid rgba(239,68,68,.4);background:linear-gradient(135deg,rgba(254,242,242,.5),var(--bg-card))}
  .day-sep{padding:0 16px;height:32px;background:var(--p50);border:none;margin-bottom:8px}
  .ch{padding:12px 16px 0}
  .footer{padding-bottom:calc(60px + env(safe-area-inset-bottom,16px))}
  .subnav-scroll{flex-wrap:wrap;gap:6px;padding:10px 16px;overflow-x:visible}
}
@media(max-width:640px){
  .nav{display:none}
  .menu-btn{display:flex}
  .mbb{display:block}
  .page{padding:16px 0 calc(80px + env(safe-area-inset-bottom,16px))}
  .wrap{padding:0 16px}
  .sn-item{padding:7px 12px;font-size:11px;border-radius:16px}
  .vi-s{padding:10px 12px;border-radius:8px;border-bottom:none;margin-bottom:4px;border:1px solid var(--bdl);background:var(--bg)}
  .vi-s:hover{border-color:var(--p200);background:var(--p50)}
  .vi-icon{width:28px;height:28px;border-radius:6px}
  .sn-item-news{padding:10px 14px}
  .sn-idx{width:22px;height:22px;font-size:11px}
  .sn-item-news .sn-body h4{font-size:12px}
  .sn-item-news .sn-time{font-size:11px}
}
@media(max-width:480px){
  .logo-t{font-size:17px;letter-spacing:1px}.logo-b{width:30px;height:30px;font-size:13px}
  .header .wrap{height:52px}
  .match-card{padding:12px 14px;gap:8px 0}
  .mc-team .logo{width:22px;height:22px}.mc-team .name{font-size:12px}
  .mc-score{font-size:16px;letter-spacing:2px}.mc-time{font-size:13px}
  .mc-league .tag{font-size:11px;padding:2px 6px}
  .mc-mid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;justify-items:center}
  .mc-mid .mc-team{justify-self:start}
  .mc-mid .mc-team.r{justify-self:end;flex-direction:row;text-align:right}
  .mc-mid .mc-score,.mc-mid .mc-vs{justify-self:center}
  .mnav-panel{width:280px}
  .sn-item{padding:6px 10px;font-size:11px}
}
