:root{
  --green:#16A34A; --green-d:#15803d; --green-l:#22c55e; --pitch:#1e7a35;
  --black:#101820; --ink:#111; --paper:#fff; --line:#e4e8e4; --muted:#6b736b; --panel:#F4F7F5;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--paper);color:var(--ink);line-height:1.45}
a{color:inherit;text-decoration:none}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:24px;padding:0 20px;height:56px;background:var(--black);color:#fff;border-bottom:3px solid var(--green)}
.brand{font-size:20px;letter-spacing:-.5px;display:flex;align-items:center;gap:8px}
.brand b{color:var(--green-l)}
.ball{width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:inset -3px -3px 0 var(--green)}
nav{display:flex;gap:4px;flex:1}
nav a{padding:6px 12px;border-radius:6px;font-size:14px;opacity:.75}
nav a.on{opacity:1;background:rgba(255,255,255,.1);color:var(--green-l)}
.lang button{background:none;border:1px solid #444;color:#ccc;padding:4px 8px;border-radius:4px;font-size:12px;cursor:pointer;margin-left:4px}
.lang button.on{background:var(--green);border-color:var(--green);color:#fff}
main{max-width:1100px;margin:0 auto;padding:24px 16px 60px}
.view{display:none}.view.on{display:block}
h1{margin:0 0 4px;font-size:28px}
.sub{margin:0 0 20px;color:var(--muted)}
.filters{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px;align-items:center}
.seg{display:inline-flex;background:var(--panel);border-radius:8px;padding:3px;gap:2px;flex-wrap:wrap}
.seg button{border:0;background:none;padding:6px 12px;border-radius:6px;cursor:pointer;font-size:13px;color:var(--ink)}
.seg button.on{background:var(--black);color:#fff}
#search{flex:1;min-width:180px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;font-size:14px}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:10px 12px;text-align:left;white-space:nowrap;border-bottom:1px solid var(--line)}
th{background:var(--panel);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.4px;cursor:pointer;user-select:none}
th.sorted::after{content:" ▾";color:var(--green)}
tbody tr:hover{background:#f8fbf8}
td.num{text-align:right;font-variant-numeric:tabular-nums}
.tag{display:inline-block;font-size:11px;padding:2px 7px;border-radius:4px;background:var(--panel);color:var(--muted);margin-left:6px}
.tag.pro{background:#e3f4e8;color:var(--green-d)}.tag.youth{background:#fff4d6;color:#8a5a00}
.ovr{display:inline-block;min-width:32px;text-align:center;padding:2px 6px;border-radius:6px;font-weight:700;color:#fff;background:var(--green)}
.ovr.hi{background:var(--green-d)}.ovr.lo{background:#8a9a8a}
.cmp{width:18px;height:18px;accent-color:var(--green)}
.compare-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.card{border:1px solid var(--line);border-radius:12px;padding:16px;background:#fff}
.card h3{margin:0;font-size:18px}
.card .meta{color:var(--muted);font-size:13px;margin:2px 0 12px}
.stat{display:grid;grid-template-columns:70px 1fr 32px;gap:8px;align-items:center;font-size:13px;margin:6px 0}
.bar{height:8px;background:var(--panel);border-radius:4px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--green)}
.stat.best .bar i{background:var(--black)}
.stat.best b{color:var(--green-d)}
.card .rm{margin-top:12px;background:none;border:1px solid var(--line);padding:6px 10px;border-radius:6px;cursor:pointer;font-size:12px}
.empty{color:var(--muted)}
.tactic-layout{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:24px;margin-top:16px}
.pitch{position:relative;aspect-ratio:68/105;background:
  repeating-linear-gradient(0deg,var(--pitch) 0 12.5%,#217f39 12.5% 25%);
  border:3px solid #fff;outline:3px solid var(--black);border-radius:4px;overflow:hidden}
.pitch::before,.pitch::after{content:"";position:absolute;left:50%;transform:translateX(-50%);border:2px solid rgba(255,255,255,.85)}
.pitch::before{top:-2px;width:60%;height:16%;border-top:0}
.pitch::after{bottom:-2px;width:60%;height:16%;border-bottom:0}
.pitch .mid{position:absolute;top:50%;left:0;right:0;border-top:2px solid rgba(255,255,255,.85)}
.pitch .circle{position:absolute;top:50%;left:50%;width:30%;aspect-ratio:1;border:2px solid rgba(255,255,255,.85);border-radius:50%;transform:translate(-50%,-50%)}
.pitch .p{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:var(--black);color:#fff;border:2px solid #fff;font-size:10px;font-weight:700;display:grid;place-items:center;transition:top .4s,left .4s}
.pitch .p.gk{background:var(--green-l);color:var(--black)}
.tactic-info h2{margin:0 0 4px;font-size:24px}
.tactic-info .style{color:var(--green-d);font-weight:600;margin-bottom:12px}
.tactic-info ul{padding-left:18px;margin:6px 0 14px}
.tactic-info h4{margin:14px 0 2px;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
footer{text-align:center;color:var(--muted);font-size:12px;padding:20px;border-top:1px solid var(--line)}
@media (max-width:700px){
  .top{gap:12px;padding:0 12px}nav a{padding:6px 8px;font-size:13px}
  .tactic-layout{grid-template-columns:1fr}
  th,td{padding:8px}
}
nav a.myclub{margin-left:auto;background:var(--green);color:#fff;opacity:1}
nav a.myclub.on{background:var(--green-l);color:var(--black)}
.login{max-width:420px}
.login form{display:flex;flex-direction:column;gap:6px}
.login label{font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-top:8px}
.login select,.login input{padding:10px;border:1px solid var(--line);border-radius:8px;font-size:15px}
.hint{font-size:12px;color:var(--muted);margin:6px 0 0}
.err{color:#b00020;font-size:13px;margin:6px 0 0}
.btn{margin-top:14px;padding:10px 16px;border:0;border-radius:8px;background:var(--green);color:#fff;font-size:15px;font-weight:600;cursor:pointer}
.btn.ghost{background:none;border:1px solid var(--line);color:var(--ink);font-weight:500;margin:0;font-size:13px}
.dash-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
#dash h2{font-size:16px;margin:28px 0 10px;padding-bottom:6px;border-bottom:2px solid var(--green)}
.squad-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.pos-card{border:1px solid var(--line);border-radius:12px;padding:14px}
.pos-card h3{margin:0 0 2px;font-size:20px;display:flex;justify-content:space-between}
.pos-card h3 small{font-size:12px;color:var(--muted);font-weight:500}
.pos-card .vs{display:grid;grid-template-columns:52px 1fr 30px;gap:6px;font-size:12px;align-items:center;margin-top:6px}
.pos-card .vs .bar{height:8px}.pos-card .vs.b .bar i{background:#b9c4b9}
.pos-card .weak{font-size:12px;color:#8a5a00;margin-top:8px}
.pos-card.short{border-color:#f0b400;background:#fffaf0}
.needs{padding-left:20px;margin:0}
.needs li{margin:6px 0}
.needs b{color:var(--green-d)}
.reason{font-size:12px;color:var(--ink);margin:3px 0;padding-left:14px;position:relative}
.reason::before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:50%;background:var(--green)}
.kpis{display:flex;gap:10px;margin:10px 0;font-size:12px;color:var(--muted)}
.kpis b{display:block;font-size:16px;color:var(--ink)}
.kpis .edge b{color:var(--green-d)}
.badge{font-size:11px;padding:2px 7px;border-radius:4px;background:var(--black);color:#fff;margin-left:6px}
.shortlist{list-style:none;padding:0;margin:0}
.shortlist li{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}

/* v3: club area */
.ovr.none{background:#d5dcd5;color:#555}
.tag.amateur{background:#e8eef8;color:#1e3a8a}
.club-card .crest{width:48px;height:48px;border-radius:50%;background:var(--black);color:var(--green-l);display:grid;place-items:center;font-weight:700;margin-bottom:10px;border:3px solid var(--green)}
.dash-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.dash-tools select,#adminClub{padding:6px 8px;border:1px solid var(--line);border-radius:6px;font-size:13px}
.kpis-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:16px}
.kpi{background:var(--black);color:#fff;border-radius:10px;padding:12px 14px;border-left:4px solid var(--green)}
.kpi span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.4px;opacity:.7}
.kpi b{display:block;font-size:24px;margin-top:2px}
.kpi small{display:block;font-size:11px;opacity:.6;margin-top:2px}
.pos-card.st-green{border-left:4px solid var(--green)}
.pos-card.st-yellow{border-left:4px solid #f0b400;background:#fffaf0}
.pos-card.st-red{border-left:4px solid #dc2626;background:#fff5f5}
.pos-card .st{font-weight:600}.st-green .st{color:var(--green-d)}.st-yellow .st{color:#8a5a00}.st-red .st{color:#b91c1c}
.needs li.st-red b{color:#b91c1c}.needs li.st-yellow b{color:#8a5a00}
.parts{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin:8px 0;font-size:10px;color:var(--muted)}
.parts span{display:block}.parts i{display:block;height:4px;background:var(--green);border-radius:2px;margin:2px 0}.parts b{color:var(--ink)}
.settings{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:end}
.settings label,.addform label{display:flex;flex-direction:column;font-size:12px;color:var(--muted);gap:4px}
.settings select,.settings input,.addform select,.addform input{padding:8px;border:1px solid var(--line);border-radius:6px;font-size:14px;color:var(--ink)}
.settings fieldset{border:1px solid var(--line);border-radius:6px;padding:6px 10px;display:flex;gap:12px;font-size:13px}
.settings legend{font-size:12px;color:var(--muted)}
.settings .chk{flex-direction:row;align-items:center;color:var(--ink);font-size:13px}
.settings .btn{margin:0}
.addform{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;align-items:end;margin-top:10px}
.addform .btn{margin:0;grid-column:1/-1;justify-self:start}
.h3{font-size:14px;margin:18px 0 0}
.roster input{width:60px;padding:4px;border:1px solid var(--line);border-radius:4px}
.roster .acts{white-space:nowrap}
tr.editing{background:#fffaf0}
