/* Football Stats Engine v2.2 */
:root {
  --fi:#0f1117; --fi2:#2d3142; --fi3:#5c6070; --fi4:#9499a8;
  --fr:#e4e6ec; --fb:#fff; --fb2:#f7f8fc; --fb3:#eef0f7;
  --fa:#1a56db; --fab:#eef3fd;
  --fw:#16a34a; --fwb:#dcfce7;
  --fd:#b45309; --fdb:#fef3c7;
  --fl:#dc2626; --flb:#fee2e2;
  --fr6:6px; --fr10:10px;
}

/* ── Pill nav ────────────────────────────────────────────────────────────────*/
.fbs-pill-nav { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; align-items:center; }
.fbs-pill-group { display:flex; gap:4px; background:var(--fb3); border-radius:999px; padding:4px; }
.fbs-pill { display:inline-block; padding:6px 16px; border-radius:999px; font-size:13px; font-weight:600; color:var(--fi3); text-decoration:none; transition:background .15s,color .15s; white-space:nowrap; }
.fbs-pill:hover { color:var(--fi); background:rgba(0,0,0,.05); }
.fbs-pill.fbs-pill-on { background:var(--fb); color:var(--fa); box-shadow:0 1px 3px rgba(0,0,0,.12); }

/* ── Hub nav ─────────────────────────────────────────────────────────────────*/
.fbs-hub { display:flex; flex-direction:column; gap:24px; margin-bottom:32px; }
.fbs-hub-section {}
.fbs-hub-title { font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--fi4); margin:0 0 10px; }
.fbs-hub-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:8px; }
.fbs-hub-card { display:flex; align-items:center; gap:8px; background:var(--fb); border:1px solid var(--fr); border-radius:var(--fr6); padding:12px 14px; font-size:14px; font-weight:600; color:var(--fi2); text-decoration:none; transition:border-color .15s,background .15s; }
.fbs-hub-card:hover { border-color:var(--fa); background:var(--fab); color:var(--fa); }
.fbs-hub-code { font-size:10px; font-weight:800; letter-spacing:.06em; background:var(--fb3); color:var(--fi4); padding:2px 6px; border-radius:3px; flex-shrink:0; }

/* ── Controls ────────────────────────────────────────────────────────────────*/
.fbs-ctrl { display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; padding:12px 0 14px; }
.fbs-cg { display:flex; flex-direction:column; gap:4px; }
.fbs-cl { font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--fi4); }
.fbs-cg-league { margin-left:auto; }
.fbs-tg { display:flex; gap:2px; background:var(--fb3); border-radius:999px; padding:3px; }
.fbs-tb { background:none; border:none; padding:4px 12px; border-radius:999px; font-size:12px; font-weight:600; color:var(--fi3); cursor:pointer; font-family:inherit; transition:background .15s,color .15s; }
.fbs-tb.on, .fbs-tb[aria-pressed="true"] { background:var(--fb); color:var(--fi); box-shadow:0 1px 3px rgba(0,0,0,.1); }
.fbs-sw { display:flex; border:1px solid var(--fr); border-radius:var(--fr6); overflow:hidden; }
.fbs-swb { background:var(--fb); border:none; border-right:1px solid var(--fr); padding:5px 14px; font-size:12px; font-weight:600; color:var(--fi3); cursor:pointer; font-family:inherit; transition:background .15s,color .15s; }
.fbs-swb:last-child { border-right:none; }
.fbs-swb.on { background:var(--fa); color:#fff; }
.fbs-ls { font-size:13px; padding:5px 10px; border:1px solid var(--fr); border-radius:var(--fr6); background:var(--fb); color:var(--fi); font-family:inherit; cursor:pointer; }

/* ── Table ───────────────────────────────────────────────────────────────────*/
.fbs-wrap { margin-bottom:32px; }
.fbs-tw { background:var(--fb); border:1px solid var(--fr); border-radius:var(--fr10); overflow:hidden; overflow-x:auto; box-shadow:0 1px 3px rgba(15,17,23,.08); -webkit-overflow-scrolling:touch; }
.fbs-t { width:100%; border-collapse:collapse; font-size:14px; min-width:280px; }
.fbs-t thead tr { background:var(--fi); }
.fbs-t thead th { padding:10px 14px; font-size:11px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:#fff; text-align:left; white-space:nowrap; }
.fbs-t tbody tr { border-bottom:1px solid var(--fr); transition:background .1s; }
.fbs-t tbody tr:last-child { border-bottom:none; }
.fbs-t tbody tr:nth-child(even) { background:var(--fb2); }
.fbs-t tbody tr:hover { background:var(--fab); }
.fbs-t tbody td { padding:9px 14px; color:var(--fi2); vertical-align:middle; }
.fbs-rk { width:30px; text-align:center !important; font-size:12px; color:var(--fi4) !important; font-family:monospace; }
.fbs-num { text-align:right !important; }
.fbs-bar-col { min-width:80px; }
.fbs-mo { font-family:monospace; font-size:13px; }
.fbs-bd { font-weight:600; color:var(--fi) !important; }
.fbs-mu { color:var(--fi4) !important; }
.fbs-pos { color:var(--fw) !important; }
.fbs-neg { color:var(--fl) !important; }

/* Team cell */
.fbs-tc { display:flex; align-items:center; gap:8px; }
.fbs-cr { width:20px; height:20px; object-fit:contain; flex-shrink:0; }
.fbs-crph { width:20px; height:20px; border-radius:50%; background:var(--fb3); border:1px solid var(--fr); display:inline-flex; align-items:center; justify-content:center; font-size:8px; font-weight:700; color:var(--fi4); flex-shrink:0; }
.fbs-tn { font-weight:600; color:var(--fi); font-size:14px; }

/* Pct badge */
.fbs-pct { display:inline-flex; align-items:center; justify-content:center; min-width:46px; padding:2px 7px; border-radius:999px; font-family:monospace; font-size:12px; font-weight:700; background:var(--fb3); color:var(--fi2); }
.fbs-ph { background:var(--fwb); color:var(--fw); }
.fbs-pm { background:var(--fdb); color:var(--fd); }
.fbs-pl { background:var(--flb); color:var(--fl); }

/* Bar */
.fbs-bar { height:5px; background:var(--fr); border-radius:999px; overflow:hidden; }
.fbs-bf { height:100%; border-radius:999px; background:var(--fa); transition:width .45s cubic-bezier(.4,0,.2,1); }
.fbs-bh { background:var(--fw); }
.fbs-bm { background:var(--fd); }
.fbs-bl { background:var(--fl); }

/* Streak */
.fbs-streak { display:inline-flex; align-items:center; gap:5px; font-family:monospace; font-size:13px; font-weight:700; color:var(--fi); white-space:nowrap; }
.fbs-dot { width:7px; height:7px; border-radius:50%; background:var(--fa); flex-shrink:0; }
.fbs-hot .fbs-dot { background:var(--fw); }
.fbs-badge { font-size:11px; font-weight:700; background:var(--fb3); color:var(--fi3); padding:2px 6px; border-radius:3px; }

/* Form strip */
.fbs-form { display:flex; gap:2px; }
.fbs-ft { display:inline-block; width:18px; height:18px; border-radius:3px; font-size:10px; font-weight:700; line-height:18px; text-align:center; color:#fff; }
.fbs-fW { background:var(--fw); } .fbs-fD { background:var(--fd); } .fbs-fL { background:var(--fl); }

/* States */
.fbs-empty { text-align:center; padding:40px 24px; color:var(--fi4); font-size:14px; }
.fbs-loading { opacity:.4; pointer-events:none; }
.fbs-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }

/* Pagination */
.fbs-pg { display:flex; align-items:center; justify-content:center; gap:16px; padding:16px 0 8px; flex-wrap:wrap; }
.fbs-pgb { background:var(--fb); border:1px solid var(--fr); border-radius:var(--fr6); padding:7px 16px; font-size:13px; font-weight:600; color:var(--fa); cursor:pointer; font-family:inherit; }
.fbs-pgb:hover { background:var(--fab); }
.fbs-pgi { font-size:13px; color:var(--fi4); }

/* ── Mobile ───────────────────────────────────────────────────────────────────*/
@media (max-width: 640px) {
  .fbs-bar-col, .fbs-hm { display:none !important; }
  .fbs-cg-league { margin-left:0; }
  .fbs-ctrl { gap:8px; }
  .fbs-tb { padding:4px 8px; font-size:11px; }
  .fbs-cl { font-size:9px; }
  .fbs-ls { font-size:12px; padding:4px 8px; }
  .fbs-swb { padding:4px 10px; font-size:11px; }
  .fbs-t { font-size:13px; }
  .fbs-t thead th { padding:8px 10px; font-size:10px; }
  .fbs-t tbody td { padding:8px 10px; }
  .fbs-tn { font-size:13px; }
  .fbs-cr { width:17px; height:17px; }
  .fbs-streak { font-size:12px; }
  .fbs-pill-nav { gap:6px; }
  .fbs-pill { padding:5px 12px; font-size:12px; }
  .fbs-hub-grid { grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); }
  .fbs-hub-card { padding:10px 12px; font-size:13px; }
}

@media (max-width: 400px) {
  .fbs-t { font-size:12px; }
  .fbs-tn { font-size:12px; }
  .fbs-pill-group { padding:3px; }
  .fbs-pill { padding:4px 9px; font-size:11px; }
}

/* ── Streak market nav ────────────────────────────────────────────────────── */
.fbs-streak-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

.fbs-streak-mkt {
  background: var(--fb);
  border: 1px solid var(--fr);
  border-radius: 999px;
  padding: 5px 14px;
  font-size: 12px;
  font-weight: 600;
  color: var(--fi3);
  cursor: pointer;
  font-family: inherit;
  transition: background .15s, color .15s, border-color .15s;
  white-space: nowrap;
}

.fbs-streak-mkt:hover {
  background: var(--fab);
  border-color: var(--fa);
  color: var(--fa);
}

.fbs-streak-mkt.fbs-pill-on {
  background: var(--fi);
  border-color: var(--fi);
  color: #fff;
}

@media (max-width: 640px) {
  .fbs-streak-nav { gap: 4px; }
  .fbs-streak-mkt { padding: 4px 10px; font-size: 11px; }
}

/* ── Breadcrumbs ──────────────────────────────────────────────────────────── */
.fbs-breadcrumb { margin-bottom: 20px; }
.fbs-bc-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 13px;
  color: var(--fi4);
}
.fbs-bc-item { display: flex; align-items: center; gap: 4px; }
.fbs-bc-item::after { content: '›'; color: var(--fi4); }
.fbs-bc-item:last-child::after { display: none; }
.fbs-bc-item a { color: var(--fa); text-decoration: none; }
.fbs-bc-item a:hover { text-decoration: underline; }
.fbs-bc-current { color: var(--fi3); font-weight: 500; }

/* ── League sticky pill nav ───────────────────────────────────────────────── */
.fbs-league-nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--fb);
  border-bottom: 1px solid var(--fr);
  margin: 0 0 24px;
  padding: 10px 0;
  box-shadow: 0 2px 8px rgba(15,17,23,.06);
}
.fbs-league-nav-inner {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  max-width: 900px;
}
.fbs-ln-pill {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: var(--fi3);
  text-decoration: none;
  background: var(--fb3);
  border: 1px solid var(--fr);
  transition: background .15s, color .15s, border-color .15s;
  white-space: nowrap;
}
.fbs-ln-pill:hover,
.fbs-ln-pill.active {
  background: var(--fa);
  border-color: var(--fa);
  color: #fff;
}

/* Goal streak section titles */
.fbs-gs-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--fi);
  margin: 24px 0 8px;
}
.fbs-gs-title:first-child { margin-top: 0; }

/* Section anchors — offset for sticky nav */
.fbs-anchor {
  display: block;
  position: relative;
  top: -70px;
  visibility: hidden;
}

@media (max-width: 640px) {
  .fbs-league-nav { padding: 8px 0; }
  .fbs-ln-pill { padding: 5px 10px; font-size: 12px; }
}