:root{--primary:#139cff;--accent:#22e6ff;--bg:#020814;--bg2:#071b38;--card:rgba(5,24,54,.82);--line:rgba(72,170,255,.35);--text:#f4f8ff;--muted:#a9c2e7;--gold:#f6c453;--danger:#ff4d67;--green:#35d475;--site-bg:url('../images/stadium_banner_2.webp')}
*{box-sizing:border-box}html{scroll-behavior:smooth}html,body{min-height:100%}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--text);background:#06162f;background-image:linear-gradient(180deg,rgba(2,8,20,.32),rgba(2,8,20,.62)),var(--site-bg);background-size:contain;background-attachment:fixed;background-position:center top;background-repeat:no-repeat;overflow-x:hidden}.container{width:min(1240px,calc(100% - 32px));margin:auto}.loading{padding:60px;text-align:center}.topbar{position:sticky;top:0;z-index:50;background:rgba(2,12,30,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.nav{height:76px;display:flex;align-items:center;gap:18px}.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:900;font-size:25px;line-height:1}.brand img{width:44px;height:44px;object-fit:contain}.brand b{color:var(--accent)}.menu{display:flex;align-items:center;gap:6px;margin-left:auto}.menu a{color:#e4f2ff;text-decoration:none;padding:14px 15px;border-radius:14px;font-weight:800;font-size:14px;display:flex;gap:6px;align-items:center}.menu a:hover,.menu a.active{background:linear-gradient(135deg,rgba(19,156,255,.35),rgba(34,230,255,.08));box-shadow:inset 0 -2px 0 var(--accent)}.nav-actions{display:flex;gap:8px}.icon-btn,.login-btn{border:1px solid var(--line);background:rgba(4,18,42,.8);color:#fff;border-radius:14px;min-width:44px;height:42px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:800;cursor:pointer}.login-btn{padding:0 18px}.mobile-toggle{display:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:14px;padding:14px 22px;color:#fff;background:linear-gradient(135deg,var(--primary),#0967ff);box-shadow:0 10px 30px rgba(19,156,255,.28);font-weight:900;text-decoration:none;cursor:pointer}.btn.secondary{background:rgba(5,20,48,.65);border:1px solid var(--line);box-shadow:none}.btn.small{padding:9px 12px;border-radius:10px;font-size:13px}.section{padding:34px 0}.section-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.section-title h2{margin:0;font-size:30px}.link{color:var(--accent);text-decoration:none;font-weight:900}.hero{position:relative;min-height:660px;overflow:hidden;border-bottom:1px solid var(--line)}.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.04);transition:opacity .7s ease, transform 5s linear;opacity:0}.hero-bg.active{opacity:1;transform:scale(1.09)}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,8,20,.94) 0%,rgba(2,8,20,.78) 36%,rgba(2,8,20,.28) 72%,rgba(2,8,20,.88) 100%),radial-gradient(circle at 70% 18%,rgba(34,230,255,.18),transparent 30%)}.hero-inner{position:relative;z-index:2;padding:70px 0 30px}.pill{display:inline-flex;align-items:center;gap:8px;color:var(--accent);border:1px solid var(--accent);background:rgba(34,230,255,.08);padding:10px 16px;border-radius:999px;font-weight:900;text-transform:uppercase}.hero h1{font-size:clamp(48px,7vw,86px);line-height:.98;margin:28px 0 18px;letter-spacing:-2px;text-shadow:0 14px 38px rgba(0,0,0,.4)}.hero h1 span{color:var(--accent)}.hero p{font-size:21px;color:#d9eaff;max-width:600px;line-height:1.55}.hero-features{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:660px;margin:28px 0}.feature{background:rgba(7,31,73,.72);border:1px solid var(--line);padding:16px;border-radius:14px;min-height:90px}.feature b{display:block;margin:8px 0 3px}.feature small{color:var(--muted)}.hero-actions{display:flex;gap:14px;flex-wrap:wrap}.hero-dots{display:flex;gap:8px;margin-top:22px}.hero-dots button{width:34px;height:7px;border:0;border-radius:999px;background:rgba(255,255,255,.25);cursor:pointer}.hero-dots button.active{background:var(--accent);box-shadow:0 0 18px var(--accent)}.team-strip{position:relative;z-index:2;margin-top:34px;border:1px solid var(--line);background:rgba(5,23,52,.82);border-radius:16px;overflow:hidden}.strip-track{display:flex;gap:12px;padding:14px;animation:stripMove 32s linear infinite;width:max-content}.strip-track:hover{animation-play-state:paused}@keyframes stripMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}.team-chip{display:flex;align-items:center;gap:8px;min-width:138px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);padding:10px 14px;border-radius:12px;color:#fff;text-decoration:none}.team-chip img{width:30px;height:22px;object-fit:cover;border-radius:4px}.grid{display:grid;gap:18px}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.card{position:relative;background:linear-gradient(180deg,rgba(8,35,78,.88),rgba(3,15,36,.88));border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 60px rgba(0,0,0,.22);overflow:hidden}.card.pad{padding:22px}.card:hover{border-color:rgba(34,230,255,.75);box-shadow:0 18px 60px rgba(19,156,255,.18)}.match-card{padding:18px;display:block;color:#fff;text-decoration:none}.match-meta{display:flex;justify-content:space-between;color:#b9d0ee;font-size:13px;margin-bottom:16px}.versus{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;text-align:center}.versus img{width:72px;height:54px;object-fit:contain}.vs{font-size:28px;font-weight:1000;color:#fff}.score{font-size:40px;font-weight:1000;margin:14px 0;text-align:center}.chance-bars{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}.barline{height:8px;background:rgba(255,255,255,.12);border-radius:999px;overflow:hidden;margin-top:6px}.barline i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--primary));border-radius:999px}.team-fav{padding:20px;text-align:center;color:#fff;text-decoration:none}.rank{position:absolute;top:14px;left:14px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(19,156,255,.3);border:1px solid var(--line);font-weight:1000}.team-fav img{height:108px;width:108px;object-fit:contain;margin:14px auto}.team-fav h3{margin:8px 0 4px}.percent{font-size:24px;font-weight:1000}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px;border-bottom:1px solid rgba(255,255,255,.08);text-align:left}.table th{color:#b8d2ef;font-size:13px}.table img{width:25px;height:18px;object-fit:cover;border-radius:3px;vertical-align:middle;margin-right:8px}.status-dot{width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;font-size:12px;margin-right:4px;font-weight:900}.w{background:#20d66b;color:#042}.d{background:#248cff}.l{background:#ff3b55}.donut{width:174px;height:174px;border-radius:50%;margin:10px auto;background:conic-gradient(#26d66f 0 42%,#2988ff 42% 68%,#ff4b4b 68% 100%);display:grid;place-items:center}.donut div{width:96px;height:96px;border-radius:50%;background:#061a36;display:grid;place-items:center;text-align:center;font-weight:1000}.article-card img{width:100%;height:170px;object-fit:cover}.article-card .body{padding:18px}.tag{display:inline-block;background:linear-gradient(135deg,#116dff,#12d9ff);padding:6px 10px;border-radius:8px;font-size:12px;font-weight:1000;text-transform:uppercase}.footer{border-top:1px solid var(--line);background:rgba(3,14,34,.92);padding:36px 0 18px;margin-top:40px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:24px}.footer a{color:#cfe6ff;text-decoration:none}.newsletter{display:flex;gap:8px}.newsletter input{flex:1;background:#071b38;border:1px solid var(--line);border-radius:12px;color:#fff;padding:13px}.page-head{padding:48px 0 20px}.page-head h1{font-size:52px;margin:0 0 8px}.schedule-card{display:grid;grid-template-columns:1fr auto 1fr auto;gap:18px;align-items:center;padding:18px}.schedule-card .side{display:flex;align-items:center;gap:12px}.schedule-card img{width:52px;height:52px;object-fit:contain}.tabs{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 18px}.tab{border:1px solid var(--line);background:rgba(5,24,54,.8);color:#fff;padding:10px 16px;border-radius:999px;font-weight:900;cursor:pointer}.tab.active{background:linear-gradient(135deg,var(--primary),#0b70ff)}.match-hero{position:relative;min-height:520px;background-size:cover;background-position:center;border-bottom:1px solid var(--line);overflow:hidden}.match-hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,8,20,.82),rgba(2,8,20,.30),rgba(2,8,20,.82))}.match-hero-inner{position:relative;z-index:1;padding:28px 0}.breadcrumb{font-size:14px;color:#cde6ff;margin-bottom:10px}.match-title{text-align:center;font-size:50px;font-weight:1000;margin:8px 0 10px}.duel{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:20px}.duel-team{position:relative;min-height:330px;display:flex;align-items:end}.duel-team.right{justify-content:flex-end;text-align:right}.duel-team .flag-bg{position:absolute;inset:30px 0 auto 0;height:170px;object-fit:cover;opacity:.65;border:1px solid var(--line)}.duel-team .player{position:relative;height:330px;max-width:360px;object-fit:contain;filter:drop-shadow(0 24px 40px rgba(0,0,0,.45))}.duel-name{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(90deg,#064aa6,#107dff);padding:16px 26px;border:1px solid var(--line);font-size:38px;font-weight:1000;text-transform:uppercase}.duel-team.right .duel-name{background:linear-gradient(90deg,#107dff,#064aa6)}.vs-diamond{width:118px;height:118px;display:grid;place-items:center;border:2px solid var(--accent);background:linear-gradient(135deg,#062e72,#09142e);transform:rotate(45deg);box-shadow:0 0 40px rgba(34,230,255,.4);margin-bottom:80px}.vs-diamond span{transform:rotate(-45deg);font-size:45px;font-weight:1000}.info-bar{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;padding:14px;background:rgba(3,15,34,.8);border:1px solid var(--line);border-radius:16px;margin-top:18px}.info-bar b{color:var(--gold)}.panel-title{background:linear-gradient(180deg,#0e57bc,#07316c);padding:13px 18px;font-size:20px;font-weight:1000;border-bottom:1px solid var(--line);text-align:center}.list-icon{display:grid;gap:15px}.list-icon li{list-style:none;display:grid;grid-template-columns:42px 1fr;gap:14px;align-items:start;color:#dcecff}.badge-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ff344d,#f8a830);font-weight:900}.keyplayers{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px}.player-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;text-align:center;background:rgba(255,255,255,.04)}.player-card img{width:100%;height:180px;object-fit:contain;background:linear-gradient(180deg,rgba(19,156,255,.22),rgba(0,0,0,.12))}.player-card h3{margin:10px 6px}.scorebox{padding:20px;text-align:center}.score-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}.score-row img{width:86px;height:86px;object-fit:contain}.score-big{font-size:70px;font-weight:1000}.goal-list{border-top:1px solid var(--line);padding-top:12px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.chance-wrap{display:grid;grid-template-columns:1fr 180px 1fr;align-items:center;text-align:center;padding:26px}.chance-big{font-size:42px;font-weight:1000}.stat-row{display:grid;grid-template-columns:65px 1fr 160px 1fr 65px;gap:10px;align-items:center;padding:8px 12px}.statbar{height:14px;background:rgba(255,255,255,.12);border-radius:999px;overflow:hidden}.statbar i{display:block;height:100%;background:linear-gradient(90deg,#1968d6,#28c4ff)}.statbar.away i{background:linear-gradient(90deg,#20d66b,#0d8a45)}.h2h-row{display:grid;grid-template-columns:1fr 70px 1fr;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.08);padding:11px}.mini-team{display:flex;align-items:center;gap:8px}.mini-team img{width:30px;height:22px;object-fit:cover}.pitch{background:linear-gradient(180deg,#0e6429,#0a3f1d);border:1px solid rgba(255,255,255,.3);border-radius:14px;padding:14px;min-height:360px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;position:relative;overflow:hidden}.pitch:before{content:'';position:absolute;inset:18px;border:1px solid rgba(255,255,255,.25);border-radius:8px}.puck{position:relative;z-index:1;text-align:center;font-size:12px}.puck b{display:inline-grid;place-items:center;width:30px;height:30px;background:#fff;color:#06142c;border-radius:50%;margin-bottom:4px}.tactic-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding:20px}.final-pred{display:grid;grid-template-columns:100px 1fr 260px 260px;gap:20px;align-items:center;padding:22px}.stars{font-size:36px;color:var(--gold);letter-spacing:4px}.team-page-hero{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:center}.team-page-hero img{width:100%;max-height:360px;object-fit:contain}.empty{padding:30px;text-align:center;color:var(--muted)}
@media(max-width:900px){.mobile-toggle{display:inline-flex}.menu{position:fixed;top:76px;left:12px;right:12px;display:none;flex-direction:column;background:#061632;border:1px solid var(--line);border-radius:16px;padding:12px}.menu.open{display:flex}.menu a{width:100%}.nav-actions{margin-left:auto}.hero{min-height:720px}.hero-features,.grid-4,.grid-3,.grid-2,.footer-grid{grid-template-columns:1fr}.duel,.schedule-card,.final-pred,.team-page-hero{grid-template-columns:1fr}.duel-team,.duel-team.right{justify-content:center;text-align:center}.duel-name{font-size:28px}.vs-diamond{margin:10px auto}.match-title{font-size:36px}.stat-row{grid-template-columns:50px 1fr 100px 1fr 50px}.tactic-grid,.keyplayers,.goal-list{grid-template-columns:1fr}.chance-wrap{grid-template-columns:1fr}.page-head h1{font-size:36px}}


/* === FINAL LIGHT + LAYOUT FIX === */
.loading{display:none!important}
@media(max-width:900px){body{background-attachment:scroll!important}}
img{max-width:100%}
.match-card .versus>div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-width:0}
.match-card .versus img{display:block;margin:0 auto;width:78px;height:58px;object-fit:contain;flex:0 0 auto}
.match-card .versus b{display:block;margin:0;text-align:center;line-height:1.2;white-space:normal;word-break:normal}
.match-card .score small{text-transform:uppercase;color:var(--muted);font-size:11px;letter-spacing:.5px}.match-card .score{line-height:1.05}
.schedule-card{grid-template-columns:minmax(220px,1fr) 70px minmax(220px,1fr) minmax(260px,.85fr)!important;gap:14px!important;align-items:stretch!important;padding:16px!important;text-decoration:none}.schedule-card .side{display:grid!important;grid-template-columns:72px 1fr;align-items:center;gap:14px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);border-radius:15px;padding:13px;min-height:86px}.schedule-card .side img{width:66px!important;height:66px!important;object-fit:contain;display:block;margin:auto}.schedule-card .vs{display:grid;place-items:center;height:100%;min-height:86px;background:rgba(19,156,255,.12);border:1px solid var(--line);border-radius:15px}.schedule-info{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);border-radius:15px;padding:13px;display:flex;flex-direction:column;justify-content:center;gap:7px}.schedule-info .btn{width:100%;margin-top:4px}.duel-team{padding-bottom:82px;overflow:visible}.duel-team .flag-bg{z-index:0;opacity:.38!important;filter:blur(.2px);height:150px!important;top:42px!important}.duel-team .player{z-index:2;margin-bottom:58px;height:300px!important;max-width:330px!important}.duel-name{z-index:4;bottom:0!important;pointer-events:none}.match-hero{min-height:500px}.keyplayers .player-card img{height:190px;object-fit:contain;padding:8px}.score-row img{position:relative;z-index:2;background:rgba(255,255,255,.06);border-radius:50%;padding:6px}.hero-bg{will-change:opacity;transform:scale(1.01)!important}.hero-bg.active{transform:scale(1.035)!important}.card{content-visibility:auto;contain-intrinsic-size:320px}.topbar,.hero,.match-hero,.page-head,.footer{content-visibility:visible}
@media(max-width:900px){.schedule-card{grid-template-columns:1fr!important}.schedule-card .side{grid-template-columns:64px 1fr}.schedule-card .vs{min-height:48px}.duel-team .player{height:250px!important;margin-bottom:54px}.duel-team{padding-bottom:78px}.hero{min-height:650px}.match-card .versus img{width:68px;height:50px}}

/* === FIX BACKGROUND FULL & TERANG === */
html,body{min-height:100%}
body{background-color:#06162f!important;background-image:linear-gradient(180deg,rgba(2,8,20,.32),rgba(2,8,20,.62)),var(--site-bg)!important;background-size:contain!important;background-position:center top!important;background-repeat:no-repeat!important;background-attachment:fixed!important}
body:before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(circle at 20% 0%,rgba(34,230,255,.16),transparent 32%),radial-gradient(circle at 85% 18%,rgba(19,156,255,.18),transparent 34%);pointer-events:none}
.card{background:linear-gradient(180deg,rgba(8,35,78,.82),rgba(3,15,36,.82))}
.hero:after{background:linear-gradient(90deg,rgba(2,8,20,.82) 0%,rgba(2,8,20,.62) 36%,rgba(2,8,20,.16) 72%,rgba(2,8,20,.70) 100%),radial-gradient(circle at 70% 18%,rgba(34,230,255,.22),transparent 30%)!important}
.match-hero:before{background:linear-gradient(90deg,rgba(2,8,20,.66),rgba(2,8,20,.18),rgba(2,8,20,.66))!important}


/* === HASIL PERTANDINGAN SELESAI === */
.result-summary .card b{display:block;font-size:38px;color:var(--accent);line-height:1.1}.result-summary .card small{color:var(--muted)}
.result-card{color:#fff;text-decoration:none;display:block}.result-cover{height:150px;background-size:cover;background-position:center;position:relative;padding:14px;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.result-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,8,20,.18),rgba(2,8,20,.82))}.result-cover>*{position:relative;z-index:1}.result-cover b{align-self:flex-end;text-align:right;color:#fff;text-shadow:0 5px 18px #000}.result-body{padding:18px}.result-teams{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;text-align:center}.result-teams img{width:78px;height:78px;object-fit:contain;margin:auto;display:block}.result-teams b{display:block;margin-top:8px}.result-score{display:grid;grid-template-columns:auto auto auto;gap:12px;align-items:center;font-size:42px;font-weight:1000}.result-score small{font-size:12px;color:var(--gold);border:1px solid var(--gold);border-radius:999px;padding:5px 8px}.result-body h3{margin:16px 0 8px}.result-body p{color:#cfe1f5;line-height:1.5}.result-meta{display:grid;gap:8px;color:#b7cdeb;font-size:13px}.mini-score-head{display:grid;grid-template-columns:42px 1fr auto 1fr 42px;gap:10px;align-items:center;text-align:center;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:14px;margin-bottom:12px}.mini-score-head img{width:42px;height:32px;object-fit:contain}.mini-score-head strong{font-size:30px;color:var(--gold)}.result-stat-line{display:flex;justify-content:space-between;gap:15px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.08)}.result-detail-mini ul{color:#d7e9ff;line-height:1.6}.result-detail-mini h4{margin-bottom:6px;color:var(--accent)}
@media(max-width:900px){.result-teams{grid-template-columns:1fr}.result-score{justify-content:center}.mini-score-head{grid-template-columns:1fr;}.result-cover{height:130px}}

/* GLOBAL BACKGROUND FIX: gambar upload dari admin dipakai di semua halaman, tampil penuh tanpa crop */
body.global-bg-ready, body{
  background-color:#06162f!important;
  background-size:contain!important;
  background-position:center top!important;
  background-repeat:no-repeat!important;
  background-attachment:fixed!important;
}
@media(max-width:768px){
  body.global-bg-ready, body{background-size:100% auto!important;background-position:center top!important;}
}


/* === GLOBAL BG + NAV CLEAN FIX === */
body.global-bg-ready, body{
  background-image:linear-gradient(180deg,rgba(2,8,20,.14),rgba(2,8,20,.54)),var(--site-bg)!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  background-attachment:fixed!important;
}
.topbar{background:rgba(2,12,30,.92)}
.nav-actions{display:flex;align-items:center;gap:0}
.nav-actions .login-btn{min-width:88px}
.match-hero{background-position:center center!important;background-size:cover!important}
.duel-team{justify-content:center;text-align:center}
.duel-team.right{justify-content:center;text-align:center}
.duel-team .flag-bg{left:50%!important;right:auto!important;transform:translateX(-50%);width:170px!important;height:120px!important;object-fit:contain!important;opacity:.85!important;top:54px!important;border:none!important;filter:drop-shadow(0 8px 24px rgba(0,0,0,.35));}
.duel-team .player{height:320px!important;max-width:300px!important;z-index:2;position:relative}
.duel-mini-flags{display:flex;justify-content:center;gap:18px;align-items:center;margin:8px 0 16px;position:relative;z-index:5;flex-wrap:wrap}
.flag-chip{display:flex;align-items:center;gap:10px;background:rgba(5,23,52,.80);border:1px solid var(--line);padding:10px 14px;border-radius:999px;box-shadow:0 12px 28px rgba(0,0,0,.22)}
.flag-chip img{width:58px;height:38px;object-fit:contain;border-radius:5px;background:rgba(255,255,255,.06);padding:2px}
.flag-chip b{font-size:14px;letter-spacing:.4px}
.info-bar{position:relative;z-index:5}
@media(max-width:900px){
 body.global-bg-ready, body{background-attachment:scroll!important;background-position:center top!important}
 .duel-team .flag-bg{width:126px!important;height:92px!important;top:34px!important}
 .duel-team .player{height:250px!important;max-width:220px!important}
 .duel-mini-flags{margin-top:0}
}


/* === FINAL USER FIX: global background, remove top icons, clear match flags === */
.nav-actions .icon-btn,#themeBtn{display:none!important}
.topbar .nav-actions{gap:0!important}
body.global-bg-ready, body{
  background-image:linear-gradient(180deg,rgba(2,8,20,.10),rgba(2,8,20,.48)),var(--site-bg)!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  background-attachment:fixed!important;
}
.hero:after{background:linear-gradient(90deg,rgba(2,8,20,.78) 0%,rgba(2,8,20,.58) 38%,rgba(2,8,20,.18) 72%,rgba(2,8,20,.64) 100%),radial-gradient(circle at 70% 18%,rgba(34,230,255,.18),transparent 30%)!important}
.section,.page-head,.footer,.topbar{position:relative;z-index:1}
.match-hero{background-size:cover!important;background-position:center center!important}
.duel-team .flag-bg{opacity:.22!important;filter:none!important;border:none!important;width:220px!important;height:150px!important;top:66px!important}
.duel-name{display:flex!important;align-items:center;justify-content:center;gap:12px;padding:14px 18px!important}
.duel-name-flag{width:46px!important;height:32px!important;object-fit:contain!important;border-radius:4px;background:rgba(255,255,255,.06);padding:2px;box-shadow:0 6px 16px rgba(0,0,0,.18)}
.duel-name span{display:inline-block}
.duel-mini-flags{display:none!important}
.player-card img{image-rendering:auto}
.score-row a{display:grid;place-items:center}
.score-row a img{width:82px!important;height:58px!important;object-fit:contain!important}
@media(max-width:900px){
  body.global-bg-ready, body{background-attachment:scroll!important;background-position:center top!important}
  .duel-name{font-size:22px!important;gap:8px}
  .duel-name-flag{width:34px!important;height:24px!important}
  .duel-team .flag-bg{width:150px!important;height:100px!important;top:30px!important}
}


/* === ADMIN BACKGROUND CACHE FIX - berlaku ke SEMUA PAGE === */
html{background:#06162f!important;min-height:100%}
body.global-bg-ready, body{
  background:transparent!important;
  background-image:none!important;
  background-color:transparent!important;
  isolation:isolate;
}
body.global-bg-ready::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background-image:linear-gradient(180deg,rgba(2,8,20,.10),rgba(2,8,20,.54)),var(--site-bg)!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
}
body.global-bg-ready::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(circle at 22% 0%,rgba(34,230,255,.10),transparent 34%),radial-gradient(circle at 90% 18%,rgba(19,156,255,.12),transparent 36%);
}
.section,.page-head,main,.footer{background:transparent!important}
.card{background:linear-gradient(180deg,rgba(8,35,78,.78),rgba(3,15,36,.78))!important}
.topbar{background:rgba(2,12,30,.92)!important}
.nav-actions .icon-btn,#themeBtn{display:none!important}
.nav-actions{gap:0!important}
.match-hero{background-image:var(--site-bg)!important;background-size:cover!important;background-position:center center!important}
@media(max-width:900px){
  body.global-bg-ready::before{background-attachment:scroll!important;background-position:center top!important}
}

/* background-live.css final support */
body:before{background-size:cover!important;background-position:center center!important}


/* =========================================================
   FINAL MOBILE RESPONSIVE FIX
   Fokus: HP lebih rapi, cepat, enak ditekan, tanpa ubah desktop
   ========================================================= */

@media (max-width: 768px) {
  html, body {
    width: 100%;
    overflow-x: hidden !important;
  }

  body {
    font-size: 14px;
  }

  .container {
    width: min(100% - 22px, 100%) !important;
  }

  .topbar {
    position: sticky;
    top: 0;
    z-index: 999;
    background: rgba(2, 12, 30, .96) !important;
    backdrop-filter: blur(14px);
  }

  .nav {
    height: 62px !important;
    gap: 8px !important;
  }

  .brand {
    font-size: 17px !important;
    gap: 7px !important;
    min-width: 0;
  }

  .brand img {
    width: 34px !important;
    height: 34px !important;
  }

  .brand span {
    white-space: nowrap;
  }

  .mobile-toggle {
    display: inline-flex !important;
    margin-left: auto;
    min-width: 42px;
    height: 40px;
  }

  .menu {
    position: fixed !important;
    top: 68px !important;
    left: 10px !important;
    right: 10px !important;
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    background: rgba(5, 18, 42, .98) !important;
    border: 1px solid rgba(72,170,255,.45) !important;
    border-radius: 18px !important;
    padding: 12px !important;
    box-shadow: 0 18px 50px rgba(0,0,0,.45);
  }

  .menu.open {
    display: flex !important;
  }

  .menu a {
    width: 100%;
    justify-content: flex-start;
    padding: 13px 14px !important;
    font-size: 14px !important;
    border-radius: 13px !important;
  }

  .nav-actions {
    margin-left: 0 !important;
  }

  .nav-actions .login-btn {
    height: 38px !important;
    min-width: 70px !important;
    padding: 0 12px !important;
    font-size: 13px !important;
    border-radius: 12px !important;
  }

  .hero {
    min-height: auto !important;
    padding-bottom: 16px !important;
  }

  .hero-bg {
    background-position: center top !important;
  }

  .hero:after {
    background:
      linear-gradient(180deg, rgba(2,8,20,.70) 0%, rgba(2,8,20,.72) 48%, rgba(2,8,20,.90) 100%),
      radial-gradient(circle at 60% 10%, rgba(34,230,255,.18), transparent 32%) !important;
  }

  .hero-inner {
    padding: 38px 0 18px !important;
  }

  .pill {
    font-size: 11px !important;
    padding: 8px 12px !important;
  }

  .hero h1 {
    font-size: 40px !important;
    line-height: 1.05 !important;
    letter-spacing: -1px !important;
    margin: 18px 0 12px !important;
    max-width: 94%;
  }

  .hero p {
    font-size: 15px !important;
    line-height: 1.55 !important;
    max-width: 94%;
  }

  .hero-features {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: 20px 0 !important;
  }

  .feature {
    min-height: 84px !important;
    padding: 12px !important;
    border-radius: 14px !important;
  }

  .feature b {
    font-size: 13px !important;
  }

  .feature small {
    font-size: 11px !important;
  }

  .hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    max-width: 100%;
  }

  .hero-actions .btn {
    width: 100%;
    min-height: 46px;
    font-size: 14px;
  }

  .hero-dots {
    justify-content: center;
    margin-top: 16px !important;
  }

  .team-strip {
    margin-top: 18px !important;
    border-radius: 14px !important;
  }

  .strip-track {
    padding: 10px !important;
    gap: 9px !important;
  }

  .team-chip {
    min-width: 112px !important;
    padding: 8px 10px !important;
    font-size: 12px !important;
  }

  .team-chip img {
    width: 26px !important;
    height: 18px !important;
  }

  .section {
    padding: 24px 0 !important;
  }

  .section-title {
    align-items: flex-start !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
  }

  .section-title h2 {
    font-size: 22px !important;
    line-height: 1.15 !important;
  }

  .link {
    font-size: 13px !important;
    white-space: nowrap;
  }

  .grid,
  .grid-2,
  .grid-3,
  .grid-4 {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .card {
    border-radius: 16px !important;
  }

  .card.pad {
    padding: 16px !important;
  }

  .match-card {
    padding: 15px !important;
  }

  .match-meta {
    font-size: 11px !important;
    gap: 8px !important;
  }

  .versus {
    grid-template-columns: 1fr 52px 1fr !important;
    gap: 9px !important;
  }

  .versus img {
    width: 64px !important;
    height: 48px !important;
    object-fit: contain !important;
  }

  .versus b {
    font-size: 13px !important;
  }

  .vs {
    font-size: 22px !important;
  }

  .score {
    font-size: 34px !important;
    margin: 10px 0 !important;
  }

  .chance-bars {
    gap: 5px !important;
    font-size: 12px !important;
  }

  .barline {
    height: 7px !important;
  }

  .team-fav {
    padding: 16px !important;
  }

  .team-fav img {
    height: 88px !important;
    width: 88px !important;
  }

  .rank {
    width: 29px !important;
    height: 29px !important;
    font-size: 12px !important;
  }

  .table {
    font-size: 12px !important;
  }

  .table th,
  .table td {
    padding: 9px 7px !important;
  }

  .table img {
    width: 22px !important;
    height: 16px !important;
  }

  .page-head {
    padding: 32px 0 14px !important;
  }

  .page-head h1 {
    font-size: 34px !important;
    line-height: 1.1 !important;
  }

  .page-head p {
    font-size: 15px !important;
  }

  .schedule-card {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 14px !important;
  }

  .schedule-card .side {
    grid-template-columns: 58px 1fr !important;
    min-height: 70px !important;
    padding: 10px !important;
  }

  .schedule-card .side img {
    width: 54px !important;
    height: 54px !important;
  }

  .schedule-card .vs {
    min-height: 42px !important;
    font-size: 22px !important;
  }

  .schedule-info {
    padding: 12px !important;
    font-size: 13px !important;
  }

  .match-hero {
    min-height: auto !important;
  }

  .match-hero-inner {
    padding: 18px 0 16px !important;
  }

  .breadcrumb {
    font-size: 11px !important;
    margin-bottom: 8px !important;
  }

  .match-title {
    font-size: 27px !important;
    line-height: 1.12 !important;
    margin: 10px 0 12px !important;
  }

  .duel {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .duel-team,
  .duel-team.right {
    min-height: 220px !important;
    padding-bottom: 58px !important;
    justify-content: center !important;
  }

  .duel-team .player {
    height: 210px !important;
    max-width: 210px !important;
    margin-bottom: 38px !important;
  }

  .duel-team .flag-bg {
    width: 120px !important;
    height: 78px !important;
    top: 28px !important;
    opacity: .35 !important;
  }

  .duel-name {
    font-size: 22px !important;
    padding: 11px 12px !important;
    border-radius: 12px !important;
  }

  .duel-name-flag {
    width: 32px !important;
    height: 22px !important;
  }

  .vs-diamond {
    width: 76px !important;
    height: 76px !important;
    margin: 0 auto !important;
  }

  .vs-diamond span {
    font-size: 24px !important;
  }

  .info-bar {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 10px !important;
    font-size: 12px !important;
    border-radius: 14px !important;
  }

  .panel-title {
    font-size: 16px !important;
    padding: 12px !important;
  }

  .list-icon {
    gap: 12px !important;
  }

  .list-icon li {
    grid-template-columns: 36px 1fr !important;
    gap: 10px !important;
    font-size: 13px !important;
  }

  .badge-icon {
    width: 36px !important;
    height: 36px !important;
  }

  .keyplayers {
    grid-template-columns: 1fr !important;
    padding: 14px !important;
  }

  .player-card img {
    height: 170px !important;
  }

  .score-row {
    grid-template-columns: 58px 1fr 58px !important;
    gap: 8px !important;
  }

  .score-row img {
    width: 58px !important;
    height: 42px !important;
  }

  .score-big {
    font-size: 44px !important;
  }

  .goal-list {
    grid-template-columns: 1fr !important;
    text-align: left !important;
    font-size: 13px !important;
  }

  .chance-wrap {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 18px !important;
  }

  .chance-wrap .donut {
    width: 145px !important;
    height: 145px !important;
  }

  .chance-big {
    font-size: 34px !important;
  }

  .stat-row {
    grid-template-columns: 48px 1fr !important;
    gap: 8px !important;
    padding: 8px 12px !important;
    font-size: 12px !important;
  }

  .stat-row small {
    grid-column: 1 / -1;
    text-align: center;
    color: var(--accent);
    font-weight: 800;
  }

  .h2h-row {
    grid-template-columns: 1fr 56px 1fr !important;
    padding: 9px !important;
    font-size: 12px !important;
  }

  .pitch {
    min-height: 300px !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    padding: 10px !important;
  }

  .puck {
    font-size: 10px !important;
  }

  .puck b {
    width: 25px !important;
    height: 25px !important;
    font-size: 11px !important;
  }

  .tactic-grid {
    grid-template-columns: 1fr !important;
    padding: 16px !important;
    font-size: 14px !important;
  }

  .final-pred {
    grid-template-columns: 1fr !important;
    text-align: center !important;
    padding: 18px !important;
  }

  .final-pred img {
    margin: auto;
  }

  .stars {
    font-size: 28px !important;
  }

  .result-cover {
    height: 130px !important;
  }

  .result-body {
    padding: 15px !important;
  }

  .result-teams {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .result-teams img {
    width: 62px !important;
    height: 62px !important;
  }

  .result-score {
    justify-content: center !important;
    font-size: 34px !important;
  }

  .mini-score-head {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .article-card img {
    height: 145px !important;
  }

  .article-card .body {
    padding: 15px !important;
  }

  .article-card h3 {
    font-size: 17px !important;
  }

  .footer {
    padding: 28px 0 16px !important;
  }

  .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .newsletter {
    flex-direction: column !important;
  }

  .newsletter input,
  .newsletter .btn {
    width: 100% !important;
  }
}

@media (max-width: 390px) {
  .hero h1 {
    font-size: 34px !important;
  }

  .hero-features {
    grid-template-columns: 1fr !important;
  }

  .versus {
    grid-template-columns: 1fr 42px 1fr !important;
  }

  .versus img {
    width: 56px !important;
    height: 42px !important;
  }

  .score {
    font-size: 30px !important;
  }

  .btn {
    padding: 12px 14px !important;
  }
}