:root {
  --bg:#0b1020; --card:#151c31; --card2:#1b2540; --text:#eef3ff;
  --muted:#9eabc8; --accent:#67e8a5; --accent2:#72a7ff; --danger:#ff7f96;
  --border:#2a3658;
}
* { box-sizing:border-box; }
body {
  margin:0; font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;
  background:radial-gradient(circle at top,#18284a 0,#0b1020 42%);
  color:var(--text); min-height:100vh;
}
.wrap { max-width:1100px; margin:auto; padding:28px 18px 50px; }
h1 { margin:0 0 8px; font-size:clamp(28px,5vw,44px); }
h2 { margin:0 0 18px; font-size:20px; }
.sub { color:var(--muted); margin-bottom:26px; line-height:1.5; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.card {
  background:rgba(21,28,49,.94); border:1px solid var(--border);
  border-radius:18px; padding:20px; box-shadow:0 16px 50px rgba(0,0,0,.22);
}
.import-card { margin-bottom:16px; }
.import-card details > summary {
  cursor:pointer; font-size:18px; font-weight:800; list-style-position:inside;
}
.import-content { margin-top:18px; }
.players { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.player {
  padding:14px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.025);
}
.player.me { border-color:rgba(103,232,165,.55); }
label { display:block; color:var(--muted); font-size:13px; margin:0 0 7px; }
input, textarea {
  width:100%; padding:11px 12px; border-radius:10px; border:1px solid var(--border);
  background:#0e1528; color:var(--text); outline:none; font:inherit; font-size:16px;
  resize:vertical;
}
input:focus, textarea:focus { border-color:var(--accent2); }
.row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sets { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
button {
  width:100%; margin-top:16px; padding:14px 18px; border:0; border-radius:12px;
  background:linear-gradient(135deg,var(--accent),#4fd1c5); color:#07131a;
  font-weight:800; font-size:16px; cursor:pointer;
}
button:hover { filter:brightness(1.06); }
.hint { font-size:12px; color:var(--muted); margin-top:8px; line-height:1.45; }
.hidden { display:none; }
.results { margin-top:18px; }
.scoreline {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:var(--card2); border-radius:12px; padding:12px 14px; margin-bottom:8px;
}
.pill { padding:5px 9px; border-radius:999px; font-weight:800; font-size:13px; white-space:nowrap; }
.up { background:rgba(103,232,165,.14); color:var(--accent); }
.down { background:rgba(255,127,150,.14); color:var(--danger); }
.neutral { background:rgba(158,171,200,.14); color:var(--muted); }
.gps-cell { min-width:180px; }
.gps-cell strong, .gps-cell span { display:block; }
.gps-cell strong { color:var(--accent); }
.gps-cell span, .gps-meta { color:var(--muted); font-size:12px; margin-top:4px; }
table { width:100%; border-collapse:collapse; }
th,td { text-align:left; padding:11px 8px; border-bottom:1px solid var(--border); }
th { color:var(--muted); font-size:12px; text-transform:uppercase; }
.big { font-size:24px; font-weight:850; }
.bar { height:9px; background:#0d1426; border-radius:99px; overflow:hidden; margin-top:7px; }
.bar > div { height:100%; background:linear-gradient(90deg,var(--accent2),var(--accent)); border-radius:99px; }
.formula {
  color:var(--muted); font-size:12px; line-height:1.6; background:#0e1528;
  border-radius:12px; padding:12px; margin-top:12px;
}
.gps-section { margin-top:22px; }
.gps-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.gps-player {
  background:var(--card2); border:1px solid var(--border); border-radius:12px; padding:14px;
}
.gps-player-name { font-weight:800; font-size:16px; }
.gps-details { display:flex; flex-wrap:wrap; gap:12px; color:var(--muted); font-size:13px; margin-top:8px; }
.gps-range { color:var(--accent); font-size:20px; font-weight:800; margin-top:14px; }
@media(max-width:760px) {
  .grid,.players { grid-template-columns:1fr; }
  .gps-list { grid-template-columns:1fr; }
  .sets { grid-template-columns:1fr; }
}