/* ==========================================================================
   GoodluckSports — clean, compact, Flashscore-inspired design system.
   Light background, dense list rows, a single brand green for structure,
   red reserved strictly for "live" so it stays meaningful.
   ========================================================================== */
:root{
  --bg: #F4F5F7;
  --panel: #FFFFFF;
  --line: #E4E7EB;
  --text: #171A1F;
  --muted: #6B7480;
  --muted-2: #9AA2AC;

  --brand: #0E8A46;
  --brand-dark: #0B6E38;
  --live: #E0242F;

  --radius: 8px;
  --maxw: 960px;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Inter', sans-serif;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
h1,h2,h3{font-family:'Barlow Condensed', sans-serif; font-weight:700; margin:0;}
::selection{background:var(--brand); color:#fff;}

.page-wrap{max-width:var(--maxw); margin:0 auto; padding:0 16px 70px;}

/* ---------- header / nav ---------- */
#site-header{
  position:sticky; top:0; z-index:60;
  background:var(--panel);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:var(--maxw); margin:0 auto; padding:12px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.logo{display:flex; align-items:center; gap:9px;}
.logo-mark{
  width:22px; height:22px; border-radius:6px; flex:none;
  background:linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
}
.logo-text{font-family:'Barlow Condensed', sans-serif; font-size:19px; letter-spacing:0.2px; color:var(--text);}
.logo-text strong{font-weight:700; color:var(--brand);}
.main-nav{display:flex; gap:4px;}
.main-nav a{
  padding:7px 14px; border-radius:6px; font-size:14px; color:var(--muted); font-weight:500;
  transition:color 0.15s ease, background 0.15s ease;
}
.main-nav a:hover{color:var(--text); background:var(--bg);}
.main-nav a.active{color:var(--brand); background:rgba(14,138,70,0.08);}
.nav-toggle{display:none; flex-direction:column; gap:4px; background:none; border:none; cursor:pointer; padding:8px;}
.nav-toggle span{width:20px; height:2px; background:var(--text); border-radius:2px;}

@media (max-width:640px){
  .nav-toggle{display:flex;}
  .main-nav{
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; background:var(--panel);
    border-bottom:1px solid var(--line);
    max-height:0; overflow:hidden; padding:0 16px;
    transition:max-height 0.2s ease;
  }
  .main-nav.open{max-height:200px; padding:8px 16px;}
  .main-nav a{padding:12px 6px; border-radius:0; border-bottom:1px solid var(--line);}
}

/* ---------- scores topbar (sport tabs + status) ---------- */
.scores-topbar{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  flex-wrap:wrap; padding:18px 0 14px;
}
.sport-tabs{display:flex; gap:6px; flex-wrap:wrap;}
.sport-tab{
  border:1px solid var(--line); background:var(--panel); color:var(--muted);
  font-size:13.5px; font-weight:600; padding:8px 16px; border-radius:999px;
  cursor:pointer; transition:all 0.15s ease; font-family:'Inter', sans-serif;
}
.sport-tab:hover{border-color:var(--brand);}
.sport-tab.active{background:var(--brand); border-color:var(--brand); color:#fff;}

.status-pill{
  display:inline-flex; align-items:center; gap:7px; font-family:'JetBrains Mono', monospace; font-size:11.5px;
  color:var(--muted); background:var(--panel); border:1px solid var(--line); padding:6px 12px; border-radius:999px;
}
.status-dot{width:6px; height:6px; border-radius:50%; background:var(--brand);}
.status-dot.stale{background:var(--muted-2);}

/* ---------- league blocks ---------- */
.league-block{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  margin-bottom:14px; overflow:hidden;
}
.league-header{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:12px 16px; border-bottom:1px solid var(--line); background:#FAFBFC;
  flex-wrap:wrap;
}
.league-header h3{font-size:17px; color:var(--text); font-weight:700;}
.league-header-right{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.freshness{
  font-family:'JetBrains Mono', monospace; font-size:10.5px; color:var(--muted);
  padding:3px 9px; border:1px solid var(--line); border-radius:999px; white-space:nowrap;
}
.freshness.live-dot::before{content:'● '; color:var(--live);}
.schedule-link{
  background:none; border:1px solid var(--line); color:var(--brand); font-weight:600;
  font-size:12px; padding:4px 10px; border-radius:999px; cursor:pointer; white-space:nowrap;
  transition:all 0.15s ease; font-family:'Inter', sans-serif;
}
.schedule-link:hover{background:var(--brand); color:#fff; border-color:var(--brand);}

/* ---------- schedule drill-down view ---------- */
.back-link{
  background:none; border:none; color:var(--muted); font-size:13px; font-weight:600;
  cursor:pointer; padding:0 0 12px; font-family:'Inter', sans-serif;
}
.back-link:hover{color:var(--brand);}
.sched-tabs{display:flex; gap:6px; margin-bottom:12px;}
.sched-tab{
  border:1px solid var(--line); background:var(--panel); color:var(--muted);
  font-size:13px; font-weight:600; padding:7px 14px; border-radius:999px;
  cursor:pointer; transition:all 0.15s ease; font-family:'Inter', sans-serif;
}
.sched-tab:hover{border-color:var(--brand);}
.sched-tab.active{background:var(--brand); border-color:var(--brand); color:#fff;}

.sub-group-label{
  font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--muted);
  padding:9px 16px 4px; text-transform:uppercase; letter-spacing:0.5px;
}

/* ---------- match rows ---------- */
.match-row{
  display:flex; align-items:stretch; gap:12px; padding:10px 16px;
  border-bottom:1px solid var(--line); transition:background 0.12s ease;
}
.match-row:last-child{border-bottom:none;}
.match-row:hover{background:#FAFBFC;}
.match-row.is-live{background:rgba(224,36,47,0.035);}

.m-status{
  flex:none; width:56px; display:flex; align-items:center; justify-content:flex-start;
  font-family:'JetBrains Mono', monospace; font-size:11.5px; color:var(--muted); padding-top:2px;
}
.m-time{color:var(--muted-2);}
.m-final{color:var(--muted); font-weight:600;}
.m-live{color:var(--live); font-weight:700; display:flex; align-items:center; gap:5px; line-height:1.15;}
.m-blip{width:6px; height:6px; border-radius:50%; background:var(--live); flex:none; animation:pulse 1.3s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(224,36,47,0.5);} 70%{box-shadow:0 0 0 5px rgba(224,36,47,0);} 100%{box-shadow:0 0 0 0 rgba(224,36,47,0);}}

.m-sides{flex:1; min-width:0; display:flex; flex-direction:column; gap:5px;}
.m-side{display:flex; align-items:center; gap:8px; min-width:0;}
.m-logo{width:18px; height:18px; object-fit:contain; flex:none;}
.m-flag{border-radius:2px;}
.m-name{
  flex:1; min-width:0; font-size:14.5px; color:var(--text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.m-side.lose .m-name, .m-side.lose .m-score{color:var(--muted);}
.m-side.win .m-name{font-weight:700;}
.m-score{
  flex:none; font-family:'JetBrains Mono', monospace; font-size:14.5px; font-weight:700;
  min-width:22px; text-align:right; color:var(--text);
}
.m-sets{flex:none; display:flex; gap:8px; font-family:'JetBrains Mono', monospace; font-size:13px; color:var(--text);}
.set{min-width:14px; text-align:center; color:var(--muted);}
.set.set-win{color:var(--text); font-weight:700;}
.set sup{font-size:9px; color:var(--muted-2);}

/* ---------- empty / error states ---------- */
.empty{
  text-align:center; padding:44px 20px; color:var(--muted);
  background:var(--panel); border:1px dashed var(--line); border-radius:var(--radius);
}
.empty.small{padding:20px 16px; text-align:left; font-size:13px; border:none; border-radius:0;}
.empty h2{color:var(--text); font-size:20px; margin-bottom:6px;}

/* ---------- news ---------- */
.hero{padding:32px 0 20px;}
.hero h1{font-size:clamp(28px,5vw,40px); line-height:1;}
.hero .accent-turf{color:var(--brand);}
.hero p{color:var(--muted); font-size:14.5px; max-width:520px; margin:10px 0 0;}

.news-grid{display:grid; gap:14px; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); margin-top:20px;}
.news-card{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; display:flex; flex-direction:column; transition:border-color 0.15s ease, transform 0.15s ease;
}
.news-card:hover{border-color:var(--brand); transform:translateY(-1px);}
.news-card img, .news-fallback{width:100%; height:130px; object-fit:cover; background:var(--bg);}
.news-body{padding:13px 15px; display:flex; flex-direction:column; gap:5px;}
.news-tag{
  font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:0.8px; text-transform:uppercase;
  color:var(--brand); width:fit-content; font-weight:600;
}
.news-body h3{font-size:16px; line-height:1.25; font-weight:600; font-family:'Inter', sans-serif; color:var(--text);}
.news-body p{font-size:12.5px; color:var(--muted); margin:0; line-height:1.4;}
.news-date{font-size:10.5px; color:var(--muted-2); font-family:'JetBrains Mono', monospace; margin-top:auto;}

/* ---------- footer ---------- */
#site-footer{border-top:1px solid var(--line); margin-top:44px;}
.footer-inner{
  max-width:var(--maxw); margin:0 auto; padding:20px 16px; display:flex; justify-content:space-between;
  gap:10px; flex-wrap:wrap; color:var(--muted-2); font-size:11.5px; font-family:'JetBrains Mono', monospace;
}

@media (prefers-reduced-motion: reduce){
  .m-blip{animation:none;}
}
