:root{
  --bg:#eef2f6; --surface:#ffffff; --ink:#17202a; --muted:#6d7885;
  --line:#d9e0e7; --dark:#0b1118; --dark2:#151c25;
  --shadow:0 18px 48px rgba(16,24,36,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.nav{background:#0b1118;border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;z-index:20}
.navin{max-width:1240px;height:76px;margin:auto;padding:8px 24px;display:flex;align-items:center;gap:24px}
.navbrand{display:flex;align-items:center;margin-right:auto}
.navlogo{height:52px;max-width:280px;object-fit:contain}
.navlinks{display:flex;gap:17px;align-items:center;color:#dce3eb;font-size:13px;font-weight:800}
.navlinks a:hover{color:#fff}
.hero{background:
  radial-gradient(circle at 20% 20%,rgba(63,117,190,.24),transparent 32%),
  radial-gradient(circle at 80% 68%,rgba(117,74,193,.22),transparent 34%),
  linear-gradient(135deg,#151b24,#090d13);color:#fff}
.heroin{max-width:1240px;margin:auto;padding:64px 24px 58px}
.eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:900;color:#7a8592}
.hero .eyebrow{color:#c4ccd6}
.hero h1{font-size:clamp(43px,6vw,72px);line-height:.98;margin:9px 0 14px}
.hero p{max-width:760px;font-size:18px;line-height:1.55;color:#d7dee7;margin:0}
.hero-meta{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
.hero-pill{border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.07);padding:8px 11px;border-radius:999px;font-size:12px;font-weight:800}
.main{max-width:1240px;margin:auto;padding:36px 24px 72px}
.section{margin-top:34px}
.section:first-child{margin-top:0}
.sectionhead{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:18px}
.sectionhead h2{font-size:34px;line-height:1.04;margin:6px 0 0}
.sectionhead p{max-width:540px;margin:0;color:var(--muted);line-height:1.5}
.utility{display:flex;gap:10px;flex-wrap:wrap}
.utility a,.week-jump a{background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 12px;font-size:12px;font-weight:900;box-shadow:0 5px 18px rgba(20,28,40,.04)}
.utility a.active,.week-jump a.current{background:#15202c;color:#fff;border-color:#15202c}
.week-jump{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 22px}
.week-block{scroll-margin-top:96px;margin-top:20px}
.week-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.week-head h3{font-size:26px;margin:0}
.week-status{font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;padding:7px 9px;border-radius:999px;background:#e9eef4;color:#66717e}
.week-status.final{background:#dfe8e2;color:#385442}
.week-status.next{background:#e5e9f6;color:#354a7c}
.game-list{display:grid;gap:10px}
.game-card{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:20px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:19px;padding:16px 18px;box-shadow:var(--shadow)}
.game-team{display:flex;align-items:center;gap:12px;min-width:0}
.game-team.home{justify-content:flex-end;text-align:right}
.game-logo{width:54px;height:54px;padding:5px;border-radius:14px;background:#111720;flex:0 0 auto}
.game-logo img{width:100%;height:100%;object-fit:contain}
.game-team strong{display:block;font-size:16px}
.game-team span{font-size:11px;color:#7a8591;font-weight:800}
.game-center{text-align:center;min-width:92px}
.game-center strong{display:block;font-size:22px}
.game-center span{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#7d8792;font-weight:900}
.stand-card{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
.stand-row{display:grid;grid-template-columns:48px minmax(240px,1.4fr) 65px 65px 80px minmax(180px,.8fr);gap:10px;align-items:center;padding:13px 18px;border-top:1px solid #e7ebef}
.stand-row:first-child{border-top:0}
.stand-row.header{background:#f7f9fb;color:#75808c;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:900;padding-top:11px;padding-bottom:11px}
.rank{font-weight:900;color:#7a8490}
.stand-team{display:flex;align-items:center;gap:12px;min-width:0}
.stand-logo{width:46px;height:46px;padding:5px;border-radius:12px;background:#111720;flex:0 0 auto}
.stand-logo img{width:100%;height:100%;object-fit:contain}
.stand-team strong{font-size:15px}
.record-cell{font-weight:900;font-size:16px}
.streak{font-weight:900}
.next-cell{font-size:13px;color:#56616d}
.leader-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.leader-card{background:#111820;color:#fff;border-radius:22px;padding:22px;box-shadow:var(--shadow)}
.leader-card h3{font-size:26px;margin:7px 0 8px}
.leader-card p{color:#c5ced8;line-height:1.5;margin:0}
.footer{background:#0b1118;color:#8f99a6;padding:26px}
.footerin{max-width:1240px;margin:auto;display:flex;justify-content:space-between;gap:20px;align-items:center}
.footer strong{color:#edf1f5}
.footer p{margin:0}
@media(max-width:820px){
  .navlinks a:not(.home-link){display:none}
  .navlogo{height:44px;max-width:200px}
  .game-card{grid-template-columns:1fr;gap:11px;text-align:left}
  .game-team.home{justify-content:flex-start;text-align:left}
  .game-center{text-align:left;padding-left:66px}
  .stand-card{overflow-x:auto}
  .stand-row{min-width:810px}
}
@media(max-width:640px){
  .navin{padding:8px 14px}
  .navlogo{max-width:155px;height:40px}
  .navlinks{font-size:11px}
  .heroin{padding:46px 14px 42px}
  .main{padding:26px 14px 60px}
  .sectionhead{display:block}
  .sectionhead p{margin-top:9px}
  .leader-grid{grid-template-columns:1fr}
  .footerin{display:block}
  .footer p{margin-top:7px}
}

/* ---------- v4 mobile standings usability fix ---------- */
@media(max-width:820px){
  .stand-card{overflow:visible}
  .stand-row.header{display:none}
  .stand-row:not(.header){
    min-width:0;
    grid-template-columns:34px minmax(0,1fr) auto auto auto;
    gap:7px 9px;
    padding:13px 14px;
  }
  .stand-row:not(.header) .rank{grid-column:1;grid-row:1 / span 2}
  .stand-row:not(.header) .stand-team{grid-column:2;grid-row:1 / span 2}
  .stand-row:not(.header) .record-cell:nth-child(3){grid-column:3}
  .stand-row:not(.header) .record-cell:nth-child(4){grid-column:4}
  .stand-row:not(.header) .streak{grid-column:5}
  .stand-row:not(.header) .next-cell{
    grid-column:2 / -1;
    grid-row:3;
    padding-top:6px;
    border-top:1px solid #edf0f3;
    font-size:12px;
  }
  .stand-row:not(.header) .record-cell:nth-child(3)::before{content:"W ";font-size:9px;color:#7b8692}
  .stand-row:not(.header) .record-cell:nth-child(4)::before{content:"L ";font-size:9px;color:#7b8692}
  .stand-row:not(.header) .streak::before{content:"STK ";font-size:9px;color:#7b8692}
}
@media(max-width:460px){
  .stand-logo{width:42px;height:42px}
  .stand-team strong{font-size:14px}
  .stand-row:not(.header){grid-template-columns:28px minmax(0,1fr) auto auto auto}
}


/* ---------- V8 UNIFIED MOBILE GLOBAL NAV ---------- */
@media(max-width:760px){
  .navin{
    height:auto !important;
    min-height:76px;
    flex-wrap:wrap;
    gap:8px !important;
    padding:9px 14px 8px !important;
  }
  .navbrand{width:100%;margin:0 !important;display:flex;align-items:center}
  .navlogo{height:40px !important;max-width:170px !important}
  .navlinks{
    display:flex !important;
    width:100%;
    gap:7px !important;
    overflow-x:auto;
    white-space:nowrap;
    padding:1px 0 5px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .navlinks::-webkit-scrollbar{display:none}
  .navlinks a,
  .navlinks a:not(.home-link),
  .navlinks .back{
    display:inline-flex !important;
    flex:0 0 auto;
    align-items:center;
    border:1px solid rgba(255,255,255,.12);
    border-radius:999px;
    padding:7px 9px;
    font-size:11px !important;
    line-height:1;
  }
}