:root{
  --bg:#121212;
  --panel:#1c1c1c;
  --header:#1f7a34;
  --grid:#3d3d3d;
  --text:#f4f4f4;
  --green:#2e9f47;
  --yellow:#c99a06;
  --red:#b03030;
  --gray:#555;
}

*{box-sizing:border-box}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Arial,Helvetica,sans-serif;
}

.header{
  background:var(--header);
  padding:18px;
  text-align:center;
  font-size:18px;
  font-weight:bold;
  box-shadow:0 2px 10px rgba(0,0,0,.4);
}

.ranking-panel,.matches,.statistics{
  width:min(98%,1700px);
  margin:20px auto;
}

.countdown-panel{
  width:min(98%,1700px);
  margin:20px auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.countdown-card{
  background:var(--panel);
  border:1px solid var(--grid);
  border-radius:10px;
  padding:15px;
  text-align:center;
}

.countdown-card h3{
  margin:0 0 10px;
  color:#7df18f;
}

#next1Timer,#next2Timer,#next3Timer{
  margin-top:10px;
  font-size:28px;
  font-weight:bold;
  color:#ffd44f;
}

table{
  width:100%;
  border-collapse:collapse;
  background:#181818;
  table-layout:fixed;
}

th,td{
  border:2px solid var(--grid);
  padding:7px;
  text-align:center;
}

th{
  background:var(--header);
  position:sticky;
  top:0;
  z-index:2;
}

td:nth-child(3),th:nth-child(3){
  text-align:left;
  min-width:210px;
}

/* Równe szerokości kolumn graczy */
#matchesTable th:nth-child(n+5):nth-child(-n+13),
#matchesTable td:nth-child(n+5):nth-child(-n+13){
  width:72px;
  min-width:72px;
  max-width:72px;
}

/* Kolumna Σ */
#matchesTable th:last-child,
#matchesTable td:last-child{
  width:45px;
}

tfoot th{
  background:#2a2a2a;
}

.score3{background:var(--green);font-weight:bold}
.score1{background:var(--yellow);font-weight:bold}
.score0{background:var(--gray)}
.scorem1{background:var(--red);font-weight:bold}

#rankingCards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  gap:10px;
}

.rank-card{
  background:var(--panel);
  border:1px solid var(--grid);
  border-radius:5px;
  padding:10px;
  text-align:center;
}

footer{
  text-align:center;
  padding:20px;
  color:#aaa;
}

@media(max-width:900px){
  .countdown-panel{grid-template-columns:1fr}
  table{font-size:13px}
}