*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
:root{--c1:#3b82f6;--c2:#22c55e;--line:rgba(255,255,255,.85);--txt:#0f172a;--mute:#5b6478}
body{font-family:Inter,system-ui,-apple-system,sans-serif;color:var(--txt);background:#f6f8fc;min-height:100vh;-webkit-font-smoothing:antialiased}
#bg{position:fixed;inset:0;z-index:-1;background:
 radial-gradient(60% 45% at 15% 10%,color-mix(in srgb,var(--c1) 22%,transparent),transparent 70%),
 radial-gradient(55% 45% at 90% 35%,color-mix(in srgb,var(--c2) 18%,transparent),transparent 70%),
 radial-gradient(70% 50% at 40% 100%,color-mix(in srgb,var(--c1) 14%,transparent),transparent 70%),
 linear-gradient(160deg,#ffffff,#eef2f8);transition:background .4s}
main{padding:calc(env(safe-area-inset-top) + 16px) 16px calc(env(safe-area-inset-bottom) + 28px);max-width:720px;margin:0 auto}
.glass{background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(255,255,255,.45));border:1px solid var(--line);
 box-shadow:inset 0 1px 0 #fff,0 8px 28px rgba(15,23,42,.10),0 1px 3px rgba(15,23,42,.06);backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);border-radius:22px}
header.top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}
h1{font-size:30px;font-weight:800;letter-spacing:-.02em}
.sub{color:var(--mute);font-size:13px;font-weight:500}
.conf{font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--mute);margin:22px 4px 8px}
.div{padding:12px;margin-bottom:12px}
.div h3{font-size:14px;font-weight:700;margin:2px 4px 10px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.team{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px;border-radius:16px;cursor:pointer;color:var(--txt);font:inherit;
 background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(255,255,255,.55));border:1px solid rgba(255,255,255,.95);box-shadow:inset 0 1px 0 #fff,0 4px 14px rgba(15,23,42,.08);transition:transform .15s}
.team:active{transform:scale(.95)}
.team img{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 2px 3px rgba(0,0,0,.15))}
.team span{font-size:11px;font-weight:600;text-align:center;line-height:1.2}
.btn{font:inherit;font-size:14px;font-weight:600;color:var(--txt);padding:9px 14px;border-radius:999px;cursor:pointer}
.hero{padding:18px;display:flex;gap:16px;align-items:center;margin-bottom:14px}
.logotile{width:84px;height:84px;flex:none;border-radius:22px;display:grid;place-items:center}
.logotile img{width:64px;height:64px;object-fit:contain}
.hero h2{font-size:22px;font-weight:800;letter-spacing:-.01em}
.rec{font-size:34px;font-weight:800;margin-top:2px}
.pill{display:inline-block;margin-top:6px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600;background:color-mix(in srgb,var(--c1) 14%,#fff);border:1px solid color-mix(in srgb,var(--c1) 30%,#fff)}
.card{padding:16px;margin-bottom:14px}
.card h4{font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--mute);margin-bottom:12px;text-transform:uppercase}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.stat{padding:10px;border-radius:14px;background:rgba(255,255,255,.6);border:1px solid rgba(15,23,42,.06)}
.stat b{display:block;font-size:19px;font-weight:700}
.stat small{font-size:11px;color:var(--mute);font-weight:500}
.leader{display:flex;align-items:center;gap:12px;padding:8px 0;border-top:1px solid rgba(15,23,42,.08)}
.leader:first-of-type{border-top:0}
.leader img{width:44px;height:44px;border-radius:50%;object-fit:cover;background:#eef2f8;border:1px solid #fff}
.leader .k{font-size:11px;color:var(--mute);font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.leader .n{font-weight:700;font-size:15px}.leader .v{font-size:13px;color:var(--mute)}
.game{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid rgba(15,23,42,.08);font-size:14px}
.game:first-of-type{border-top:0}
.game img{width:26px;height:26px;object-fit:contain}
.game .wk{width:38px;color:var(--mute);font-size:12px;font-weight:600}
.game .opp{flex:1;font-weight:600}
.res{font-weight:700;font-size:13px}.W{color:#15803d}.L{color:#dc2626}.T{color:#b45309}.up{color:var(--mute);font-weight:500}
.foot{text-align:center;color:var(--mute);font-size:12px;margin-top:6px}
.err{padding:16px;color:#b91c1c}
.loading{padding:40px;text-align:center;color:var(--mute)}

.brand{display:flex;align-items:center;gap:12px}.brand img{width:48px;height:48px;border-radius:12px;box-shadow:0 4px 12px rgba(15,23,42,.15)}
.wbtn{display:block;width:100%;margin:4px 0 6px;padding:16px;border-radius:20px;font:inherit;font-size:17px;font-weight:800;cursor:pointer;color:#fff;border:1px solid rgba(255,255,255,.6);
 background:linear-gradient(135deg,rgba(22,163,74,.88),rgba(11,94,42,.92));backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 24px rgba(22,163,74,.30)}
.wbtn small{display:block;font-size:12px;font-weight:600;opacity:.85;margin-top:2px}
.match{padding:14px;margin-bottom:12px}
.mrow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;text-align:center}
.mteam img{width:52px;height:52px;object-fit:contain}.mteam div{font-weight:700;font-size:14px}.mteam .pct{font-size:22px;font-weight:800}
.mteam.win .pct{color:#15803d}.at{color:var(--mute);font-size:12px;font-weight:700}
.bar{display:flex;height:8px;border-radius:99px;overflow:hidden;margin:12px 0 10px;background:#e5e9f2}
.pick{font-weight:700;font-size:14px}.why{font-size:13px;color:var(--mute);margin-top:4px;line-height:1.45}
.src{display:inline-block;margin-top:8px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:99px;background:#eef2f8;color:#334155}
.when{font-size:12px;color:var(--mute);font-weight:600;margin-bottom:8px}
/* ---- Liquid glass pass ---- */
#bg{background:
 radial-gradient(38% 28% at 12% 8%,rgba(34,197,94,.38),transparent 70%),
 radial-gradient(34% 26% at 92% 22%,rgba(59,130,246,.34),transparent 70%),
 radial-gradient(36% 26% at 8% 55%,rgba(236,72,153,.22),transparent 70%),
 radial-gradient(40% 28% at 88% 70%,rgba(250,204,21,.28),transparent 70%),
 radial-gradient(45% 30% at 40% 98%,color-mix(in srgb,var(--c1) 30%,transparent),transparent 70%),
 radial-gradient(40% 30% at 60% 40%,color-mix(in srgb,var(--c2) 18%,transparent),transparent 70%),
 #f7f9fc}
.glass{background:linear-gradient(160deg,rgba(255,255,255,.55),rgba(255,255,255,.22))}
.team,.btn,.wbtn{position:relative;overflow:hidden;
 backdrop-filter:blur(26px) saturate(190%);-webkit-backdrop-filter:blur(26px) saturate(190%);
 border:1px solid rgba(255,255,255,.75)}
.team,.btn{background:linear-gradient(165deg,rgba(255,255,255,.50),rgba(255,255,255,.16));
 box-shadow:inset 0 1.5px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(255,255,255,.35),inset 0 0 18px rgba(255,255,255,.45),0 8px 22px rgba(15,23,42,.10),0 1px 2px rgba(15,23,42,.08)}
.team::before,.btn::before,.wbtn::before{content:"";position:absolute;left:8%;right:8%;top:1px;height:45%;border-radius:999px 999px 50% 50%/100% 100% 40% 40%;
 background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0));pointer-events:none}
.team>*,.btn>*,.wbtn>*{position:relative}
.team img{filter:drop-shadow(0 3px 5px rgba(15,23,42,.18))}
.wbtn{background:linear-gradient(160deg,rgba(34,197,94,.62),rgba(11,94,42,.70));text-shadow:0 1px 2px rgba(0,40,15,.45);
 border:1px solid rgba(255,255,255,.6);
 box-shadow:inset 0 1.5px 0 rgba(255,255,255,.8),inset 0 0 22px rgba(187,247,208,.45),0 12px 28px rgba(22,163,74,.30),0 2px 4px rgba(11,94,42,.2)}
.wbtn::before{background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0))}
.btn{color:#0f172a}
.wbtn{background:linear-gradient(160deg,rgba(22,163,74,.72),rgba(11,94,42,.80))}
.wbtn::before{left:2%;right:2%;height:50%;border-radius:20px 20px 60% 60%/20px 20px 30% 30%;background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,0) 90%)}
/* crisp green button */
.wbtn{backdrop-filter:blur(4px) saturate(140%);-webkit-backdrop-filter:blur(4px) saturate(140%);
 background:linear-gradient(160deg,rgba(22,163,74,.86),rgba(13,110,50,.92));text-shadow:none;
 border:1px solid rgba(255,255,255,.85);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 0 0 1px rgba(11,94,42,.25),0 4px 10px rgba(22,163,74,.22),0 1px 2px rgba(11,94,42,.25)}
.wbtn::before{background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 60%)}
.ghead{margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid rgba(15,23,42,.08)}
.glabel{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#15803d;margin-bottom:4px}
.gtitle{font-size:16px;font-weight:800;line-height:1.3}
.gmeta{font-size:12.5px;color:var(--mute);font-weight:500;margin-top:2px}
.badge{display:inline-block;vertical-align:middle;font-size:10px;font-weight:800;letter-spacing:.08em;padding:2px 7px;border-radius:99px;margin-left:4px}
.badge.live{background:#dc2626;color:#fff}.badge.fin{background:#334155;color:#fff}
.when{display:none}
.frow{display:flex;align-items:center;gap:7px;padding:9px 12px;margin-bottom:8px;border-radius:16px;font-size:13.5px}
.frow img{width:22px;height:22px;object-fit:contain}.frow b{font-weight:600;color:var(--mute)}.frow b.w{color:var(--txt);font-weight:800}
.frow .fd{margin-left:auto;font-size:12px;color:var(--mute)}.frow .badge{margin:0 4px 0 0}
/* ---- Grass field background ---- */
body{background:#1f5a1f}
#bg{background:
 linear-gradient(180deg,rgba(6,30,10,.30),rgba(6,30,10,.12) 40%,rgba(6,30,10,.35)),
 linear-gradient(160deg,color-mix(in srgb,var(--c1) 16%,transparent),transparent 55%,color-mix(in srgb,var(--c2) 12%,transparent)),
 url(grass.webp) center/cover no-repeat,#2f6b2a}
.glass{background:linear-gradient(160deg,rgba(255,255,255,.80),rgba(255,255,255,.66));border:1px solid rgba(255,255,255,.9);
 box-shadow:inset 0 1px 0 #fff,0 10px 30px rgba(0,25,5,.30),0 1px 3px rgba(0,25,5,.2)}
.team,.btn{background:linear-gradient(165deg,rgba(255,255,255,.90),rgba(255,255,255,.70));
 box-shadow:inset 0 1.5px 0 #fff,inset 0 0 14px rgba(255,255,255,.6),0 6px 16px rgba(0,25,5,.22)}
header.top h1,body>main>h1,main>h1,.brand .sub,main>.conf,.foot,.loading{color:#fff;text-shadow:0 1px 3px rgba(0,30,8,.55)}
header.top .sub{color:rgba(255,255,255,.9)}
.wbtn{background:linear-gradient(160deg,rgba(22,163,74,.95),rgba(13,110,50,.97));border:2px solid #fff;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 6px 16px rgba(0,25,5,.35)}
/* whiter glass cards on team + Who Will Win screens */
.card.glass,.hero.glass,.match.glass,.frow.glass,.err.glass{position:relative;overflow:hidden;
 background:linear-gradient(170deg,rgba(255,255,255,.94),rgba(255,255,255,.86) 45%,rgba(255,255,255,.88));
 border:1px solid rgba(255,255,255,.95);
 box-shadow:inset 0 1.5px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.5),0 10px 28px rgba(0,25,5,.28),0 1px 3px rgba(0,25,5,.18)}
.card.glass::before,.hero.glass::before,.match.glass::before{content:"";position:absolute;left:0;right:0;top:0;height:70px;pointer-events:none;
 background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,0))}
.card.glass>*,.hero.glass>*,.match.glass>*{position:relative}
.stat{background:rgba(255,255,255,.75);border:1px solid rgba(15,23,42,.06);box-shadow:inset 0 1px 0 #fff}
.logotile.glass{background:#fff}
.card.glass,.hero.glass,.match.glass,.frow.glass,.err.glass{
 background:linear-gradient(170deg,rgba(255,255,255,.97),rgba(255,255,255,.92) 50%,rgba(255,255,255,.94));
 backdrop-filter:blur(22px) saturate(110%) brightness(1.15);-webkit-backdrop-filter:blur(22px) saturate(110%) brightness(1.15)}
.stat{background:#fff}
.lp{font-size:12px;font-weight:600;color:var(--mute)}.mteam.win .lp{color:#15803d}
.match.live{border:2px solid rgba(220,38,38,.55)}
.wA{display:flex;align-items:center;gap:14px;text-align:left;padding:12px 16px}
.wA .lg{width:52px;height:52px;border-radius:14px;background:#fff;display:grid;place-items:center;flex:none;box-shadow:0 2px 6px rgba(0,40,10,.25)}
.wA .lg img{width:40px;height:40px;object-fit:contain;border-radius:8px}
.wA .k{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;opacity:.92}
.wA .m{font-size:19px;font-weight:800;line-height:1.2}.wA .s{font-size:12px;font-weight:600;opacity:.92}
.wA .lv{display:inline-block;background:#dc2626;color:#fff;font-size:10px;font-weight:800;padding:2px 6px;border-radius:99px;margin-left:6px;vertical-align:middle;letter-spacing:.06em}
.wA .chev{margin-left:auto;flex:none;opacity:.9}
/* ---- Liquid glass v2 (local concept) ---- */
.glass,.card.glass,.hero.glass,.match.glass,.frow.glass,.err.glass,.div.glass{
 background:linear-gradient(165deg,rgba(255,255,255,.62),rgba(255,255,255,.46) 55%,rgba(255,255,255,.52));
 backdrop-filter:blur(18px) saturate(180%) brightness(1.08);-webkit-backdrop-filter:blur(18px) saturate(180%) brightness(1.08);
 border:1px solid rgba(255,255,255,.7);
 box-shadow:inset 0 1.5px 0 rgba(255,255,255,.95),inset 0 0 0 1px rgba(255,255,255,.25),inset 0 -10px 24px rgba(255,255,255,.18),0 12px 30px rgba(0,25,5,.28)}
.glass{position:relative}
.card.glass::before,.hero.glass::before,.match.glass::before,.div.glass::before{content:"";position:absolute;left:0;right:0;top:0;height:46%;border-radius:inherit;pointer-events:none;
 background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0))}
.div.glass>*{position:relative}
.team,.btn{background:linear-gradient(165deg,rgba(255,255,255,.66),rgba(255,255,255,.40));
 backdrop-filter:blur(14px) saturate(190%) brightness(1.1);-webkit-backdrop-filter:blur(14px) saturate(190%) brightness(1.1);
 border:1px solid rgba(255,255,255,.8);
 box-shadow:inset 0 1.5px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.3),inset 0 -6px 14px rgba(255,255,255,.25),0 6px 16px rgba(0,25,5,.25)}
.team::before,.btn::before{background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,0))}
.team span,.btn,.div h3,.card h4,.stat small,.hero h2,.rec{text-shadow:0 1px 0 rgba(255,255,255,.6)}
.stat{background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 #fff}
.logotile.glass{background:rgba(255,255,255,.85)}
/* Button C */
.wbtn.pillC{display:flex;align-items:center;justify-content:center;gap:8px;margin:6px auto 12px;width:78%;height:56px;padding:0;border-radius:999px;
 color:#fff;font-size:18px;font-weight:800;text-shadow:none;position:relative;overflow:hidden;backdrop-filter:none;-webkit-backdrop-filter:none;
 background:linear-gradient(180deg,rgba(34,197,94,.92),rgba(13,110,50,.95));border:1.5px solid rgba(255,255,255,.9);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 6px 16px rgba(0,30,8,.35)}
.wbtn.pillC::before{display:none}
.wbtn.pillC .sh{position:absolute;left:10%;right:10%;top:2px;height:45%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,255,255,0))}
.wbtn.pillC svg{position:relative}
:root{--mute:#3a4556}
/* Who Will Win screen: bright white */
#bg::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,0);transition:background .3s}
body.ww #bg::after{background:linear-gradient(180deg,rgba(255,255,255,.80),rgba(255,255,255,.86))}
body.ww .match.glass,body.ww .frow.glass,body.ww .err.glass{background:linear-gradient(170deg,rgba(255,255,255,.95),rgba(255,255,255,.90) 55%,rgba(255,255,255,.92));
 border:1px solid #fff;box-shadow:inset 0 1.5px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.4),0 10px 26px rgba(15,40,20,.14),0 1px 3px rgba(15,40,20,.10)}
body.ww main>h1,body.ww main>.conf,body.ww .foot,body.ww .loading{color:#0f172a;text-shadow:none}
body.ww main>.conf{color:#3a4556}
/* Home team tiles: extra glass */
.grid .team{background:linear-gradient(170deg,rgba(255,255,255,.40),rgba(255,255,255,.28) 60%,rgba(255,255,255,.34));
 backdrop-filter:blur(24px) saturate(220%) brightness(1.12);-webkit-backdrop-filter:blur(24px) saturate(220%) brightness(1.12);
 border:1px solid rgba(255,255,255,.9);
 box-shadow:inset 0 1.5px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.35),inset 0 -2px 6px rgba(255,255,255,.55),inset 0 -12px 18px -10px rgba(255,255,255,.6),0 8px 18px rgba(0,25,5,.28)}
.grid .team::before{left:6%;right:6%;top:1px;height:48%;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.15) 80%,rgba(255,255,255,0))}
.grid .team span{color:#0b1220;text-shadow:0 1px 2px rgba(255,255,255,.9),0 0 6px rgba(255,255,255,.7)}
.grid .team img{filter:drop-shadow(0 2px 4px rgba(0,20,5,.35)) drop-shadow(0 0 1px rgba(255,255,255,.8))}
/* whiter buttons (n) */
.grid .team{background:linear-gradient(170deg,rgba(255,255,255,.82),rgba(255,255,255,.70) 60%,rgba(255,255,255,.76))}
.btn{background:linear-gradient(170deg,rgba(255,255,255,.84),rgba(255,255,255,.72))}
.stat{background:linear-gradient(170deg,rgba(255,255,255,.84),rgba(255,255,255,.72));border:1px solid rgba(255,255,255,.95);box-shadow:inset 0 1.5px 0 #fff,0 2px 6px rgba(0,25,5,.10)}
/* whiter panels + header (o) */
.div.glass,.hero.glass,header.hdr.glass{background:linear-gradient(170deg,rgba(255,255,255,.86),rgba(255,255,255,.76) 60%,rgba(255,255,255,.80));border:1px solid rgba(255,255,255,.95)}
header.hdr{padding:12px 14px;border-radius:22px;margin-bottom:14px}
header.hdr::before{content:"";position:absolute;left:0;right:0;top:0;height:50%;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,0))}
header.hdr>*{position:relative}
header.hdr h1{color:#0f172a;text-shadow:none}header.hdr .sub{color:#3a4556!important;text-shadow:none}
/* schedule home/away */
.game{gap:10px;padding:10px 0}
.ha{flex:none;width:58px;text-align:center;font-size:11px;font-weight:800;letter-spacing:.08em;padding:4px 0;border-radius:999px;color:#fff}
.ha.h{background:#16a34a;box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}.ha.a{background:#334155;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
.game .opp{display:flex;flex-direction:column;font-size:15px;font-weight:700;line-height:1.2}
.game .opp small{font-size:11.5px;font-weight:500;color:var(--mute);margin-top:2px}
.game .res{text-align:right;font-size:13px}
.game .opp{flex:1;min-width:0}.game .res{flex:none;white-space:nowrap}
/* team page: white wash (q) */
body.tp #bg::after{background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(255,255,255,.90))}
body.tp .card.glass,body.tp .hero.glass,body.tp .err.glass{background:linear-gradient(170deg,rgba(255,255,255,.96),rgba(255,255,255,.91) 55%,rgba(255,255,255,.93));
 border:1px solid #fff;box-shadow:inset 0 1.5px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.4),0 10px 26px rgba(15,40,20,.14),0 1px 3px rgba(15,40,20,.10)}
body.tp .stat{background:linear-gradient(170deg,#fff,rgba(255,255,255,.92));border:1px solid rgba(15,23,42,.07)}
body.tp .foot,body.tp .loading,body.tp main>.conf{color:#3a4556;text-shadow:none}
body.tp .btn{border:1px solid rgba(15,23,42,.10)}
.game{border-top:2px solid rgba(0,0,0,.12)!important;padding:13px 0}.game:first-of-type{border-top:0!important}
/* team page: grass behind, solid white boxes (s) */
body.tp #bg::after{background:rgba(255,255,255,0)}
body.tp .card.glass,body.tp .hero.glass,body.tp .err.glass,body.tp .btn,body.tp .stat,body.tp .logotile.glass{
 background:linear-gradient(180deg,#ffffff,#f7f8fa);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid #fff;
 box-shadow:inset 0 1.5px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.9),inset 0 -2px 0 rgba(15,23,42,.04),0 10px 26px rgba(0,25,5,.30),0 1px 3px rgba(0,25,5,.2)}
body.tp .stat{box-shadow:inset 0 1.5px 0 #fff,0 0 0 1px rgba(15,23,42,.06),0 2px 6px rgba(15,23,42,.08)}
body.tp .card.glass::before,body.tp .hero.glass::before{background:linear-gradient(180deg,rgba(235,242,255,.0),rgba(255,255,255,0));}
body.tp .card.glass::after,body.tp .hero.glass::after{content:"";position:absolute;left:8%;right:8%;top:0;height:2px;border-radius:2px;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,0),#fff,rgba(255,255,255,0))}
body.tp .card.glass,body.tp .hero.glass{background:linear-gradient(180deg,#ffffff 0%,#fbfcfd 40%,#f3f5f8 100%)}
body.tp .foot,body.tp .loading,body.tp main>.conf{color:#fff;text-shadow:0 1px 3px rgba(0,30,8,.6)}
body.tp .btn{border:1px solid #fff}
/* team color tints (t) */
.grid .team{background:linear-gradient(165deg,color-mix(in srgb,var(--tc) 24%,rgba(255,255,255,.9)) 0%,color-mix(in srgb,var(--tc) 10%,rgba(255,255,255,.86)) 45%,rgba(255,255,255,.84) 100%);
 border-left:3px solid color-mix(in srgb,var(--tc) 70%,#fff)}
body.tp .hero.glass{background:linear-gradient(160deg,color-mix(in srgb,var(--c1) 22%,#fff) 0%,color-mix(in srgb,var(--c1) 8%,#fff) 55%,#f6f8fa 100%)}
body.tp .stat{position:relative;overflow:hidden}
body.tp .stat::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--c1),color-mix(in srgb,var(--c1) 55%,var(--c2)))}
/* richer team hero (t) */
body.tp .hero.glass{background:linear-gradient(135deg,color-mix(in srgb,var(--c1) 48%,#fff) 0%,color-mix(in srgb,var(--c1) 38%,#fff) 45%,color-mix(in srgb,var(--c2) 42%,#fff) 100%)}
body.tp .hero.glass::before{content:"";position:absolute;left:0;right:0;top:0;height:50%;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,255,255,0))}
body.tp .hero.dark h2,body.tp .hero.dark .rec{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.35)}
body.tp .hero .pill{background:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.95);color:#0f172a}
body.tp .hero.glass{background:
 radial-gradient(90% 120% at 100% 100%,color-mix(in srgb,var(--c2) 55%,transparent),transparent 60%),
 linear-gradient(135deg,color-mix(in srgb,var(--c1) 78%,#fff) 0%,color-mix(in srgb,var(--c1) 62%,#fff) 100%)}
body.tp .hero.dark h2,body.tp .hero.dark .rec{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.4)}
body.tp .hero:not(.dark) h2,body.tp .hero:not(.dark) .rec{color:#0f172a;text-shadow:0 1px 0 rgba(255,255,255,.5)}
/* team-tinted cards (u) */
body.tp .card.glass{background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 26%,#fff) 0%,color-mix(in srgb,var(--c1) 12%,#fff) 140px,color-mix(in srgb,var(--c1) 6%,#fff) 100%)}
body.tp .card.glass h4{color:color-mix(in srgb,var(--c1) 85%,#000);font-weight:800;padding-left:10px;border-left:4px solid var(--c1);text-shadow:none}
body.tp .stat{background:linear-gradient(180deg,#fff,color-mix(in srgb,var(--c1) 4%,#fff))}
body.tp .leader,body.tp .game{border-color:color-mix(in srgb,var(--c1) 18%,rgba(0,0,0,.10))!important}
/* single main color hero (u) */
body.tp .hero.glass{background:linear-gradient(160deg,color-mix(in srgb,var(--c1) 80%,#fff) 0%,var(--c1) 100%)}
body.tp .stat::before{background:var(--c1)}
body.tp #bg{background:linear-gradient(180deg,rgba(6,30,10,.30),rgba(6,30,10,.12) 40%,rgba(6,30,10,.35)),url(grass.webp) center/cover no-repeat,#2f6b2a}
/* ---- Heavy liquid glass buttons (v) ---- */
.grid .team{background:linear-gradient(165deg,color-mix(in srgb,var(--tc) 30%,rgba(255,255,255,.55)) 0%,color-mix(in srgb,var(--tc) 12%,rgba(255,255,255,.42)) 50%,rgba(255,255,255,.50) 100%);
 backdrop-filter:blur(28px) saturate(230%) brightness(1.12);-webkit-backdrop-filter:blur(28px) saturate(230%) brightness(1.12);
 border:1px solid rgba(255,255,255,.85);border-left:3px solid color-mix(in srgb,var(--tc) 70%,#fff);
 box-shadow:inset 0 2px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.35),inset 0 0 16px rgba(255,255,255,.55),inset 0 -3px 8px rgba(255,255,255,.45),0 12px 26px rgba(0,25,5,.38),0 2px 4px rgba(0,25,5,.25)}
.grid .team::before{left:4%;right:4%;top:1px;height:52%;border-radius:14px 14px 50% 50%/14px 14px 22% 22%;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.35) 55%,rgba(255,255,255,0))}
.team::after,.btn::after,.wbtn.pillC::after{content:"";position:absolute;top:-40%;left:-60%;width:38%;height:180%;transform:rotate(22deg);pointer-events:none;
 background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.55),rgba(255,255,255,0));opacity:.7}
.grid .team span{color:#0b1220;font-weight:700;text-shadow:0 1px 2px rgba(255,255,255,.95),0 0 8px rgba(255,255,255,.8)}
.btn,body.tp .btn{background:linear-gradient(165deg,rgba(255,255,255,.62),rgba(255,255,255,.38));
 backdrop-filter:blur(24px) saturate(220%) brightness(1.12);-webkit-backdrop-filter:blur(24px) saturate(220%) brightness(1.12);
 border:1px solid rgba(255,255,255,.9);color:#0b1220;text-shadow:0 1px 1px rgba(255,255,255,.9);
 box-shadow:inset 0 2px 0 #fff,inset 0 0 12px rgba(255,255,255,.55),inset 0 -2px 6px rgba(255,255,255,.4),0 10px 22px rgba(0,25,5,.35)}
.wbtn.pillC{background:linear-gradient(180deg,rgba(34,197,94,.78),rgba(13,110,50,.84));
 backdrop-filter:blur(20px) saturate(200%);-webkit-backdrop-filter:blur(20px) saturate(200%);
 border:1.5px solid rgba(255,255,255,.9);text-shadow:0 1px 2px rgba(0,40,12,.35);
 box-shadow:inset 0 2px 0 rgba(255,255,255,.95),inset 0 0 18px rgba(187,247,208,.55),inset 0 -4px 10px rgba(0,60,20,.25),0 14px 28px rgba(0,30,8,.42),0 2px 4px rgba(0,30,8,.3)}
.wbtn.pillC .sh{left:6%;right:6%;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.6),rgba(255,255,255,.08) 85%,rgba(255,255,255,0))}
.team::after,.btn::after,.wbtn.pillC::after{left:58%;width:22%;opacity:.55}
/* (w) whiter home tiles */
.grid .team{background:linear-gradient(165deg,color-mix(in srgb,var(--tc) 16%,rgba(255,255,255,.88)) 0%,color-mix(in srgb,var(--tc) 6%,rgba(255,255,255,.84)) 50%,rgba(255,255,255,.86) 100%)}
/* (w) translucent glass cards on team page */
body.tp .card.glass{background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 22%,rgba(255,255,255,.80)) 0%,color-mix(in srgb,var(--c1) 10%,rgba(255,255,255,.78)) 140px,color-mix(in srgb,var(--c1) 5%,rgba(255,255,255,.76)) 100%);
 backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%);border:1px solid rgba(255,255,255,.9)}
body.tp .stat{background:linear-gradient(180deg,rgba(255,255,255,.86),color-mix(in srgb,var(--c1) 4%,rgba(255,255,255,.78)));
 backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);border:1px solid rgba(255,255,255,.9);
 box-shadow:inset 0 1.5px 0 #fff,inset 0 0 10px rgba(255,255,255,.4),0 2px 8px rgba(0,25,5,.10)}
/* (x) whiter home tiles */
.grid .team{background:linear-gradient(165deg,color-mix(in srgb,var(--tc) 12%,rgba(255,255,255,.95)) 0%,color-mix(in srgb,var(--tc) 4%,rgba(255,255,255,.93)) 50%,rgba(255,255,255,.94) 100%)}
/* Bills only: lighter hero + whiter Standing (x) */
body.tp[data-team="BUF"] .hero.glass{background:linear-gradient(160deg,color-mix(in srgb,var(--c1) 62%,#fff) 0%,color-mix(in srgb,var(--c1) 80%,#fff) 100%)}
body.tp[data-team="BUF"] .wbtn + .card.glass{background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 10%,rgba(255,255,255,.88)) 0%,color-mix(in srgb,var(--c1) 4%,rgba(255,255,255,.86)) 140px,rgba(255,255,255,.86) 100%)}
body.tp[data-team="BUF"] .wbtn + .card.glass .stat{background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.90))}
/* (y) clear grass on Who Will Win */
body.ww #bg::after{background:rgba(255,255,255,0)}
body.ww main>h1,body.ww main>.conf,body.ww .foot,body.ww .loading{color:#fff;text-shadow:0 1px 3px rgba(0,30,8,.6)}
body.ww .match.glass,body.ww .frow.glass{box-shadow:inset 0 1.5px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.4),0 10px 26px rgba(0,25,5,.32),0 1px 3px rgba(0,25,5,.2)}
/* (y) clearer grass everywhere */
#bg,body.tp #bg,body.ww #bg{background:linear-gradient(180deg,rgba(6,30,10,.10),rgba(6,30,10,0) 35%,rgba(6,30,10,.12)),url(grass.webp) center/cover no-repeat,#2f6b2a}
#bg::after,body.tp #bg::after,body.ww #bg::after{background:rgba(255,255,255,0)}
#bg,body.tp #bg,body.ww #bg{background:linear-gradient(180deg,rgba(6,30,10,.06),rgba(6,30,10,0) 35%,rgba(6,30,10,.08)),url(grass.webp) center/cover no-repeat,#2f6b2a}
/* (z2) near-solid white Leaders + Schedule */
body.tp .card.glass.wcard{background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 4%,rgba(255,255,255,.97)) 0%,rgba(255,255,255,.96) 120px,rgba(255,255,255,.95) 100%);
 backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid #fff;
 box-shadow:inset 0 1.5px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.6),0 10px 26px rgba(0,25,5,.30),0 1px 3px rgba(0,25,5,.18)}
body.tp .wcard .leader .v,body.tp .wcard .game .opp small{color:#334155}
/* z3: team sections match Who Will Win cards */
body.tp main .card.glass,body.tp main .card.glass.wcard{background:linear-gradient(170deg,rgba(255,255,255,.95),rgba(255,255,255,.9) 55%,rgba(255,255,255,.92))!important;border:1px solid #fff!important;border-radius:22px!important;box-shadow:inset 0 1.5px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.4),0 10px 26px rgba(0,25,5,.32),0 1px 3px rgba(0,25,5,.2)!important;-webkit-backdrop-filter:blur(18px) saturate(1.8) brightness(1.08)!important;backdrop-filter:blur(18px) saturate(1.8) brightness(1.08)!important}
body.tp main .stat{background:rgba(255,255,255,.96)!important;border:1px solid #fff!important;box-shadow:inset 0 1px 0 #fff,0 2px 8px rgba(0,25,5,.14)!important}
/* z4 home header extras + Who Will Win section */
.hdrx{display:block}
.hdrx .sstrip{display:flex;gap:8px;overflow-x:auto;margin:12px -4px 0;padding:2px 4px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.hdrx .sstrip::-webkit-scrollbar{display:none}
.hdrx .sg{flex:0 0 auto;min-width:104px;padding:7px 9px;border-radius:14px;background:rgba(255,255,255,.92);border:1px solid #fff;box-shadow:inset 0 1px 0 #fff,0 2px 8px rgba(0,25,5,.14);font:inherit;text-align:left;color:#0f172a;cursor:pointer}
.hdrx .sg.ld{color:#64748b;font-size:12px}
.hdrx .sg.live{box-shadow:inset 0 0 0 1.5px rgba(220,38,38,.55),0 2px 8px rgba(0,25,5,.14)}
.hdrx .st{font-size:10.5px;font-weight:700;color:#475569;margin-bottom:4px;white-space:nowrap;letter-spacing:.02em}
.hdrx .sr{display:flex;align-items:center;gap:6px;font-size:13px;line-height:20px;color:#475569}
.hdrx .sr img{width:18px;height:18px}.hdrx .sr b{font-weight:700;flex:1}.hdrx .sr span{font-weight:700;font-variant-numeric:tabular-nums}
.hdrx .sr.w{color:#0f172a}.hdrx .sr.w span{font-weight:800}
.lvx{background:#dc2626;color:#fff;border-radius:5px;padding:1px 5px;font-size:9.5px;font-weight:800;letter-spacing:.05em;margin-right:3px}
.hdrx .gotw:empty{display:none}
.hdrx .gw{display:block;width:100%;margin-top:10px;padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.95);border:1px solid #fff;box-shadow:inset 0 1px 0 #fff,0 3px 10px rgba(0,25,5,.16);font:inherit;text-align:left;color:#0f172a;cursor:pointer}
.hdrx .gk{font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#15803d}
.hdrx .gm{display:flex;align-items:center;gap:8px;margin:4px 0 2px;font-size:14px;font-weight:700}
.hdrx .gm img{width:24px;height:24px}.hdrx .gm span{flex:1;text-align:center}
.hdrx .gs{font-size:12px;color:#475569;text-align:center}.hdrx .gs b{color:#15803d}
.wwsec{margin:14px 0;padding:14px;border-radius:22px;cursor:pointer;background:linear-gradient(170deg,rgba(255,255,255,.95),rgba(255,255,255,.9) 55%,rgba(255,255,255,.92))!important;border:1px solid #fff!important;box-shadow:inset 0 1.5px 0 #fff,0 10px 26px rgba(0,25,5,.32),0 1px 3px rgba(0,25,5,.2)!important}
.wwsec h3{margin:0;font-size:18px;font-weight:800;color:#0f172a}
.wwsec .wws{font-size:13px;color:#475569;margin:2px 0 10px}
.wwsec .wbtn{margin:0 auto;width:100%}
header.top.hdr.hdrx{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0}
header.hdrx .brand{width:100%}
header.hdrx .sstrip,header.hdrx .gotw{width:100%}
/* z5: scores strip never clips */
header.hdrx{overflow:visible!important;padding-left:max(14px,env(safe-area-inset-left))!important;padding-right:max(14px,env(safe-area-inset-right))!important}
header.hdrx .sstrip{display:flex;gap:8px;overflow-x:auto;overflow-y:visible;margin:12px -14px 0!important;padding:4px 14px 8px!important;scroll-padding:0 14px;scroll-snap-type:x proximity;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);width:auto!important;box-sizing:border-box}
header.hdrx .sstrip::after{content:"";flex:0 0 14px}
header.hdrx .sg{flex:0 0 auto!important;min-width:118px;width:auto;height:auto!important;min-height:72px;padding:8px 10px!important;box-sizing:border-box;scroll-snap-align:start;overflow:visible;-webkit-appearance:none;appearance:none;display:block}
header.hdrx .st{white-space:nowrap;line-height:16px;display:flex;align-items:center;gap:3px}
header.hdrx .sr{white-space:nowrap;line-height:22px}
header.hdrx .sr span{min-width:24px;text-align:right;padding-left:8px}
header.hdrx .lvx{line-height:14px;flex:0 0 auto}
@media (max-width:380px){header.hdrx .sg{min-width:110px}}
header.hdrx .gw{margin-top:12px}