:root {
  color-scheme: dark;
  --bg:#050301;
  --panel:#120d09;
  --panel2:#1f1710;
  --panel3:#2a1c10;
  --text:#fff7ec;
  --muted:#d2b69a;
  --accent:#ff6a00;
  --accent2:#ff2f00;
  --accent3:#ffc15a;
  --line:#4a2b16;
  --ok:#35c46b;
}
* { box-sizing: border-box; }
body {
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at 22% -10%, rgba(255,106,0,.35), transparent 27rem),
    radial-gradient(circle at 90% 4%, rgba(255,47,0,.22), transparent 28rem),
    linear-gradient(180deg,#080402 0%,#050301 48%,#0c0704 100%);
  color:var(--text);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body::before {
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(120deg, transparent 0 35%, rgba(255,106,0,.045) 36%, transparent 48%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.018) 0 1px, transparent 1px 5px);
  opacity:.75;
}
h1,h2,h3,p { margin-top:0; }
h1 {
  font-size:clamp(2.2rem,4.8vw,4.6rem);
  line-height:.92;
  margin-bottom:.45rem;
  letter-spacing:.01em;
  text-transform:none;
  color:var(--accent3);
  text-shadow:0 0 18px rgba(255,193,90,.65), 0 0 42px rgba(255,106,0,.42);
}
h2 { margin-bottom:1rem; }
.kicker { color:var(--accent3); text-transform:uppercase; letter-spacing:.16em; font-weight:900; font-size:.78rem; margin-bottom:.35rem; }
.hero {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.25rem;
  padding:1.15rem clamp(1rem,4vw,3rem);
  border-bottom:1px solid rgba(255,106,0,.42);
  background:linear-gradient(90deg,rgba(3,2,1,.92),rgba(26,12,4,.78));
  position:sticky;
  top:0;
  z-index:3;
  backdrop-filter:blur(14px);
  box-shadow:0 14px 50px rgba(0,0,0,.48), 0 0 36px rgba(255,106,0,.18);
}
.brand { display:flex; align-items:center; gap:1.15rem; min-width:0; }
.brand-copy p { color:var(--muted); margin-bottom:0; }
.brand-logo {
  width:clamp(110px,16vw,210px);
  height:auto;
  object-fit:contain;
  object-position:center;
  border:0;
  border-radius:0;
  box-shadow:none;
  background:transparent;
  filter:drop-shadow(0 0 18px rgba(255,106,0,.55)) drop-shadow(0 0 34px rgba(255,47,0,.28));
}
.portal, button {
  border:0;
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#120600;
  padding:.78rem 1rem;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
  white-space:nowrap;
  box-shadow:0 0 20px rgba(255,106,0,.34), inset 0 1px 0 rgba(255,255,255,.24);
}
button:hover,.portal:hover { filter:brightness(1.11); transform:translateY(-1px); }
.layout { display:grid; grid-template-columns:1fr; gap:1rem; padding:1rem; position:relative; z-index:1; }
.panel {
  background:linear-gradient(180deg,rgba(31,23,16,.96),rgba(14,9,5,.96));
  border:1px solid rgba(255,106,0,.28);
  border-radius:24px;
  padding:1rem;
  box-shadow:0 18px 50px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.04);
}
.top-picker { position:sticky; top:8.6rem; z-index:2; backdrop-filter:blur(14px); }
.picker-head { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.filter-grid { display:grid; grid-template-columns:repeat(6,minmax(120px,1fr)); gap:.75rem; }
.select-row { display:grid; grid-template-columns:1fr auto; gap:.75rem; align-items:end; margin-top:.75rem; }
.three-step-select { grid-template-columns:minmax(160px,.7fr) minmax(200px,1fr) minmax(240px,1.25fr) minmax(220px,1fr); }
.league-select-label { margin:0; }
label { display:grid; gap:.35rem; margin:.2rem 0; color:var(--muted); font-weight:800; }
input, select {
  width:100%;
  border:1px solid rgba(255,106,0,.34);
  border-radius:14px;
  background:#090604;
  color:var(--text);
  padding:.8rem;
  font:inherit;
  box-shadow:inset 0 0 18px rgba(0,0,0,.35);
}
input:focus, select:focus { outline:2px solid rgba(255,106,0,.5); border-color:var(--accent); }
select { min-height:3rem; }
.status { color:var(--muted); min-height:1.2rem; margin:0; text-align:right; }
.hidden { display:none !important; }
.content { display:grid; gap:1rem; min-width:0; }
.section-head { display:flex; align-items:start; justify-content:space-between; gap:1rem; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:.8rem; }
.card { background:linear-gradient(180deg,var(--panel2),#120b06); border:1px solid rgba(255,106,0,.25); border-radius:18px; padding:1rem; }
.card strong { display:block; font-size:1.8rem; color:#fff; text-shadow:0 0 16px rgba(255,106,0,.36); }
.card span { color:var(--muted); }
.split { display:grid; grid-template-columns:minmax(360px,.95fr) minmax(360px,1.05fr); gap:1rem; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; min-width:760px; }
th,td { text-align:left; padding:.6rem; border-bottom:1px solid rgba(255,106,0,.18); }
th { color:var(--accent3); font-size:.82rem; text-transform:uppercase; letter-spacing:.06em; }
.matches { display:grid; gap:.5rem; max-height:680px; overflow:auto; }
.match-row { display:grid; grid-template-columns:5.5rem 1fr auto; gap:.75rem; align-items:center; padding:.75rem; border:1px solid rgba(255,106,0,.24); border-radius:16px; background:var(--panel2); cursor:pointer; }
.match-row:hover { border-color:var(--accent); box-shadow:0 0 18px rgba(255,106,0,.18); }
.score { font-weight:900; font-size:1.15rem; color:#fff; }
.meta { color:var(--muted); font-size:.88rem; }
.match-details { display:grid; gap:1rem; }
.detail-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:.7rem; }
.report-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1rem; }
.payment { display:flex; justify-content:space-between; gap:.8rem; padding:.55rem 0; border-bottom:1px solid rgba(255,106,0,.18); }
.empty { color:var(--muted); }
.player-heading { margin-top:1.4rem; }
.view-menu { display:flex; gap:.5rem; padding:.6rem; position:sticky; top:20rem; z-index:1; }
.view-tab { flex:1; background:var(--panel2); border:1px solid rgba(255,106,0,.26); color:var(--text); }
.view-tab.active { background:linear-gradient(135deg,var(--accent),var(--accent2)); border-color:var(--accent3); color:#130600; box-shadow:0 0 0 2px rgba(255,106,0,.2), 0 0 22px rgba(255,106,0,.25); }
.view-panel { display:none; }
.view-panel.active { display:block; }
#playerStats { max-height:680px; overflow:auto; border-top:1px solid rgba(255,106,0,.18); }
.team-total { background:rgba(255,106,0,.11); border:1px solid rgba(255,106,0,.34); border-radius:14px; padding:.75rem; margin-bottom:.5rem; }
@media (max-width: 1200px) { .filter-grid,.three-step-select { grid-template-columns:repeat(2,1fr); } .split { grid-template-columns:1fr; } .top-picker { top:0; } .view-menu { top:13rem; } }
@media (max-width: 720px) { .hero { position:static; flex-direction:column; align-items:flex-start; } .brand { flex-direction:column; align-items:flex-start; } .brand-logo { width:min(100%,260px); } .top-picker { position:static; } .filter-grid,.select-row { grid-template-columns:1fr; } .status { text-align:left; } .view-menu { position:static; flex-wrap:wrap; } .view-tab { flex-basis:calc(50% - .5rem); } }
