:root{
  --green: #0a7b3b;
  --green-dark:#066a31;
  --panel: #f2f4f5;
  --line: #d9dde1;
  --text:#1f2a30;
  --muted:#6b7780;
  --radius: 10px;
}

*{ box-sizing:border-box; }

html, body{
  margin:0;
  padding:0;
}

body{
  font-family: Arial, Helvetica, sans-serif;
  color:var(--text);
  background:transparent;
}

/* ===================== TRYBY ===================== */

/* embed: wycinamy marginesy i poziome overflow (częsty powód paska) */
.mode-embed,
.mode-embed body{
  margin:0 !important;
  padding:0 !important;
  overflow-x:hidden !important;
}

.mode-embed .head,
.mode-embed .wrap-iframebox{
  display:none !important;
}

/* iframe: ligi jedna pod drugą */
.mode-embed .leagues{
  grid-template-columns:1fr !important;
}

.mode-embed .export-wrap{ padding:0; }
.mode-embed .table-center{ padding:0; }

/* iframe: delikatne rozdzielenie lig + cień zostaje */
.mode-embed .league-card{
  border:0 !important;
  background:transparent !important;
  padding:0 0 24px 0;
  margin-bottom:24px;
  border-bottom:1px solid var(--line);
}

.mode-embed .card{
  border:0;
  background:transparent;
  padding:0;
}

/* ===================== NAGŁÓWEK PUBLICZNY ===================== */

.embed{ background:transparent; }
.embed-wrap{ padding:0 0 12px 0; background:transparent; }

.head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  margin:0 0 12px 0;
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
}

.kicker{
  font-size:12px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.4px;
}

.title{
  font-size:22px;
  font-weight:700;
  color:#000;
}

.head-actions{
  display:flex;
  gap:8px;
  align-items:center;
}

/* ===================== PRZYCISKI ===================== */

button,.btn,.btn-outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:8px;
  text-decoration:none;
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  border:1px solid transparent;
  line-height:1;
}

.btn, button{
  background:var(--green);
  color:#fff;
  border-color:var(--green);
}

.btn:hover, button:hover{
  background:var(--green-dark);
  border-color:var(--green-dark);
}

.btn:disabled, button:disabled{
  opacity:.65;
  cursor:not-allowed;
}

.btn-outline{
  background:#fff;
  color:var(--green);
  border:1px solid var(--green);
}

.btn-outline:hover{
  background:#f0faf4;
}

/* ===================== UKŁAD LIG ===================== */

.export-wrap{
  padding:0;
  background:transparent;
}

.leagues{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

@media (max-width: 980px){
  .leagues{
    grid-template-columns:1fr;
  }
}

.table-center{
  display:flex;
  justify-content:center;
  padding:12px;
}

/* ===================== BOX (nagłówek + tabela) ===================== */

.export-target{
  display:inline-block;
  background:#fff;
  border-radius:8px;
}

/* cień w podglądzie */
.export-target.nice{
  box-shadow:0 6px 18px rgba(0,0,0,.12);
}

/* przy generowaniu JPG wyłącz cień */
body.exporting .export-target.nice{
  box-shadow:none !important;
}

.league-cap{
  background:var(--green);
  color:#fff;
  font-weight:900;
  font-size:24px;
  letter-spacing:1px;
  text-align:center;
  padding:14px 14px;
  border-radius:8px 8px 0 0;
}

/* ===================== TABELA PUBLICZNA ===================== */

.pub-table{
  width:auto;
  max-width:100%;
  border-collapse:collapse;
  background:#fff;
  border:1px solid var(--line);
  overflow:hidden;
}

.pub-table th,
.pub-table td{
  border:1px solid var(--line);
  padding:10px 10px;
  font-size:13px;
  vertical-align:middle;
  text-align:center;
}

.pub-table th{
  background:var(--panel);
  color:#000;
  font-weight:800;
  border-bottom:2px solid #cfd5da;
  white-space:nowrap;
}

/* nazwisko elastyczne */
.pub-table th:nth-child(2),
.pub-table td:nth-child(2){
  text-align:left;
  min-width:240px;
  max-width:420px;
  white-space:normal;
  overflow-wrap:anywhere;
}

/* stałe kolumny */
.pub-table th:first-child,
.pub-table td:first-child{ width:110px; white-space:nowrap; }
.pub-table th:nth-child(3),
.pub-table td:nth-child(3){ width:90px; white-space:nowrap; }
.pub-table th:nth-child(4),
.pub-table td:nth-child(4){ width:150px; white-space:nowrap; }
.pub-table th:nth-child(5),
.pub-table td:nth-child(5){ width:150px; white-space:nowrap; }

.name{ font-weight:700; }
.center{ text-align:center; }

.mono{
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:12.5px;
}

/* miejsce: medal nie przesuwa numeru */
.place{ font-weight:800; color:#000; }

.place-cell{
  position:relative;
  width:100%;
  min-height:20px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.place-cell .medal{
  position:absolute;
  left:10px;
  top:50%;
  transform:translateY(-50%);
}

.place-num{
  min-width:18px;
  text-align:center;
}

/* medale */
.medal{
  width:18px;
  height:18px;
  border-radius:50%;
  display:inline-block;
  border:1px solid rgba(0,0,0,.18);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.35);
}

.m-gold{
  background: radial-gradient(circle at 30% 30%, #fff3b0 0%, #f7c948 45%, #d89b00 100%);
}
.m-silver{
  background: radial-gradient(circle at 30% 30%, #ffffff 0%, #d9dde1 45%, #9aa3ad 100%);
}
.m-bronze{
  background: radial-gradient(circle at 30% 30%, #ffd2b0 0%, #d97745 45%, #8a4b2d 100%);
}

.podium-1 td{ background:#fff9e6; }
.podium-2 td{ background:#f7f8fa; }
.podium-3 td{ background:#fff3ed; }

.empty{ color:var(--muted); }

/* ===================== OKIENKO “KOD IFRAME” ===================== */

.wrap-iframebox{ margin-top:14px; }

.iframebox{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:14px;
}

.iframebox-title{
  font-weight:900;
  font-size:14px;
  margin-bottom:10px;
}

.iframebox-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

@media (max-width:980px){
  .iframebox-grid{ grid-template-columns:1fr; }
}

.iframebox-item{
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px;
  background:#fafbfc;
}

.iframebox-label{
  font-weight:800;
  font-size:13px;
  margin-bottom:8px;
}

.iframebox-code{
  width:100%;
  min-height:92px;
  resize:vertical;
  padding:10px;
  border-radius:10px;
  border:1px solid var(--line);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:12px;
  background:#fff;
}

.iframebox-row{
  display:flex;
  gap:8px;
  align-items:center;
  margin-bottom:8px;
}

.iframebox-select{
  flex:1;
  padding:10px;
  border-radius:10px;
  border:1px solid var(--line);
  background:#fff;
  font-weight:700;
}

.iframebox-hint{
  margin-top:6px;
  font-size:12px;
  color:var(--muted);
}

/* ===================== ADMIN PANEL ===================== */

.page{
  background:#f7f8fa;
}

.wrap{
  max-width:1200px;
  margin:20px auto;
  padding:0 20px;
}

.head-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}

h1{
  margin:0;
  font-size:28px;
  font-weight:900;
  color:#000;
}

.admin-credit{
  margin:0 0 12px 0;
  font-size:12px;
  color:var(--muted);
  text-align:right;
}

.hint{
  margin:0 0 12px 0;
  font-size:13px;
  color:var(--text);
}

.toast{
  margin:10px 0;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid #bfe6cf;
  background:#eefaf2;
  color:#1f6b3a;
  font-weight:800;
}

.admin-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:16px;
  margin-bottom:16px;
}

.card-title{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:10px;
  margin-bottom:10px;
}

.title-admin{
  font-size:18px;
  font-weight:900;
  color:#000;
}

.muted-admin{
  font-size:12px;
  color:var(--muted);
}

.table-wrap{
  overflow:auto;
}

.admin-table{
  width:100%;
  border-collapse:collapse;
  min-width:1050px;
  background:#fff;
}

.admin-table th{
  background:var(--panel);
  font-weight:900;
  padding:10px;
  border:1px solid var(--line);
  border-bottom:2px solid #cfd5da;
  white-space:nowrap;
}

.admin-table td{
  padding:8px;
  border:1px solid #e6e8ea;
  vertical-align:middle;
}

.admin-table .place{
  text-align:center;
  width:80px;
  font-weight:900;
}

/* inputy (admin) */
input[type="text"], input[type="number"]{
  width:100%;
  padding:9px 10px;
  border-radius:10px;
  border:1px solid #cfd5da;
  background:#fff;
  color:var(--text);
  font-size:13px;
}

input[type="text"]:focus, input[type="number"]:focus{
  outline:none;
  border-color:#9bd4b3;
  box-shadow:0 0 0 3px rgba(10,123,59,.12);
}

/* 3 pola obok siebie (Razem/W/P) */
.triple{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:6px;
}

.triple input[type="number"]{
  text-align:center;
  padding:9px 6px;
}

/* checkbox */
.admin-table input[type="checkbox"]{
  transform:scale(1.15);
}

.actions{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
  margin-top:12px;
}

.sticky-actions{
  position:sticky;
  bottom:10px;
  padding:10px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}