/* ============================================================
   PINSETTER PRO — main.css (Light / Clear Mirror Theme)
   ============================================================ */
:root {
  --bg:#f5f4f0; --bg2:#eceae4; --bg3:#e3e0d8;
  --surface:#fff; --surface2:#faf9f7;
  --border:#dedad2; --border2:#ccc9c0;
  --ink1:#1a1916; --ink2:#4a4840; --ink3:#7a7870; --ink4:#a8a59e;
  --blue:#1d6fa4; --blue2:#e8f2f9; --blue3:#c2def0;
  --gold:#b07d20; --gold2:#fdf3dc; --gold3:#f5dfa0;
  --green:#256b3a; --green2:#e6f4eb;
  --red:#b52b2b; --red2:#fdeaea;
  --purple:#5a3fa0; --purp2:#eeebf9;
  --sh-sm:0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.04);
  --sh-md:0 4px 16px rgba(0,0,0,.08),0 1px 4px rgba(0,0,0,.05);
  --sh-lg:0 12px 40px rgba(0,0,0,.1),0 2px 8px rgba(0,0,0,.06);
  --fd:'Bebas Neue',sans-serif; --fc:'Barlow Condensed',sans-serif;
  --fb:'Barlow',sans-serif; --fm:'Orbitron',monospace;
  --r:10px; --rl:16px; --rxl:22px; --tr:all .18s ease;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:var(--fb); background:var(--bg); color:var(--ink1); min-height:100vh; font-size:14px; line-height:1.5; }

.bg-tx { position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    repeating-linear-gradient(0deg,transparent,transparent 39px,rgba(0,0,0,.025) 39px,rgba(0,0,0,.025) 40px),
    repeating-linear-gradient(90deg,transparent,transparent 39px,rgba(0,0,0,.015) 39px,rgba(0,0,0,.015) 40px); }

/* ---- PORTAL ---- */
.portal-wrap { position:relative;z-index:1;width:100%;max-width:420px;margin:0 auto;padding:40px 20px; }
.plogo { text-align:center; margin-bottom:32px; }
.pi { font-size:52px; margin-bottom:10px; display:block; filter:drop-shadow(0 4px 12px rgba(0,0,0,.15)); }
.wm { font-family:var(--fd); font-size:60px; letter-spacing:6px; line-height:1; color:var(--ink1); }
.tg { font-family:var(--fc); font-size:11px; letter-spacing:5px; font-weight:600; color:var(--ink3); margin-top:4px; text-transform:uppercase; }
.pcard { background:var(--surface); border:1px solid var(--border); border-radius:var(--rxl); padding:32px; box-shadow:var(--sh-lg); }
.pcard-title { font-family:var(--fc); font-size:16px; font-weight:800; letter-spacing:1px; margin-bottom:6px; }
.pcard-sub { font-size:13px; color:var(--ink3); margin-bottom:20px; }
.ptabs { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:24px; }
.ptab { border:2px solid var(--border); border-radius:var(--r); padding:14px 12px; text-align:center; cursor:pointer; transition:var(--tr); background:var(--bg); }
.ptab:hover { border-color:var(--blue3); }
.ptab.sel { border-color:var(--blue); background:var(--blue2); }
.ptab .ico { font-size:24px; margin-bottom:6px; }
.ptab .lbl { font-family:var(--fc); font-weight:700; font-size:13px; letter-spacing:1px; color:var(--ink2); }
.ptab.sel .lbl { color:var(--blue); }
.ptab .desc { font-size:11px; color:var(--ink4); margin-top:2px; }
.portal-foot { text-align:center; margin-top:14px; font-size:11px; color:var(--ink4); }

/* ---- FORMS ---- */
.fg { margin-bottom:14px; }
.fl { display:block; font-family:var(--fc); font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--ink3); margin-bottom:6px; }
.fi,.fs,.fta { width:100%; background:var(--surface2); border:1.5px solid var(--border); border-radius:var(--r); padding:10px 13px; font-family:var(--fb); font-size:14px; color:var(--ink1); outline:none; transition:var(--tr); }
.fi:focus,.fs:focus { border-color:var(--blue); background:#fff; box-shadow:0 0 0 3px rgba(29,111,164,.1); }
.fs { cursor:pointer; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath fill='%237a7870' d='M5 6L0 0h10z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 13px center; padding-right:32px; }
.fta { resize:vertical; min-height:72px; }
.frow { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.fhint { font-size:11px; color:var(--ink4); margin-top:4px; }

/* ---- BUTTONS ---- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; border:none; border-radius:var(--r); padding:10px 20px; font-family:var(--fc); font-size:14px; font-weight:700; letter-spacing:.5px; cursor:pointer; transition:var(--tr); text-decoration:none; white-space:nowrap; }
.bf { width:100%; }
.bbl { background:var(--blue); color:#fff; box-shadow:0 2px 8px rgba(29,111,164,.2); }
.bbl:hover { background:#1a5e8a; box-shadow:0 4px 16px rgba(29,111,164,.3); }
.bgo { background:var(--gold); color:#fff; }.bgo:hover { background:#9a6d1a; }
.bgr { background:var(--green); color:#fff; }.bgr:hover { background:#1e5a31; }
.bgh { background:transparent; border:1.5px solid var(--border); color:var(--ink2); }
.bgh:hover { border-color:var(--blue); color:var(--blue); background:var(--blue2); }
.bdn { background:var(--red2); border:1px solid rgba(181,43,43,.2); color:var(--red); }
.bdn:hover { background:var(--red); color:#fff; }
.bsm { padding:6px 14px; font-size:12px; } .bxs { padding:4px 10px; font-size:11px; }
.mt8 { margin-top:8px; }

/* ---- TOP HEADER ---- */
.top-hdr { background:var(--surface); border-bottom:1px solid var(--border); padding:0 24px; display:flex; align-items:center; height:58px; gap:16px; box-shadow:var(--sh-sm); position:relative; z-index:1; }
.hdr-logo { font-family:var(--fd); font-size:28px; letter-spacing:4px; color:var(--ink1); text-decoration:none; }
.hdr-logo span { color:var(--blue); }
.sp { flex:1; }

/* ---- PAGE ---- */
.pbody { max-width:1160px; margin:0 auto; padding:28px 20px 80px; position:relative; z-index:1; }
.ptitle { font-family:var(--fd); font-size:34px; letter-spacing:3px; color:var(--ink1); margin-bottom:4px; }
.psub { font-family:var(--fc); font-size:12px; letter-spacing:3px; color:var(--ink3); text-transform:uppercase; font-weight:600; }

/* ---- LEAGUE CARDS ---- */
.lg-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px; margin-top:24px; }
.lc { background:var(--surface); border:1.5px solid var(--border); border-radius:var(--rl); padding:22px; cursor:pointer; transition:var(--tr); box-shadow:var(--sh-sm); position:relative; overflow:hidden; }
.lc::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--blue),#5aafe0); }
.lc:hover { transform:translateY(-2px); box-shadow:var(--sh-md); border-color:var(--blue3); }
.lc-day { font-family:var(--fc); font-size:11px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:6px; }
.lc-name { font-family:var(--fd); font-size:22px; letter-spacing:2px; color:var(--ink1); margin-bottom:4px; }
.lc-venue { font-size:12px; color:var(--ink3); margin-bottom:14px; }
.lc-stats { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:16px; }
.lc-stat { font-size:12px; color:var(--ink3); } .lc-stat span { font-weight:700; color:var(--blue); }
.lc-acts { display:flex; gap:8px; flex-wrap:wrap; }
.add-lc { background:var(--surface2); border:2px dashed var(--border); border-radius:var(--rl); padding:22px; cursor:pointer; transition:var(--tr); display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:180px; gap:10px; }
.add-lc:hover { border-color:var(--blue); background:var(--blue2); }
.add-lc .ico { font-size:32px; opacity:.3; } .add-lc .txt { font-family:var(--fc); font-weight:700; font-size:14px; letter-spacing:1px; color:var(--ink3); }

/* ---- APP NAV ---- */
.app-nav { background:var(--surface); border-bottom:2px solid var(--blue); padding:0 20px; display:flex; align-items:center; height:54px; gap:12px; position:sticky; top:0; z-index:50; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.an-logo { font-family:var(--fd); font-size:22px; letter-spacing:3px; color:var(--ink1); text-decoration:none; flex-shrink:0; }
.an-logo span { color:var(--blue); }
.lg-pill { background:var(--gold2); border:1px solid var(--gold3); border-radius:20px; padding:4px 12px; font-family:var(--fc); font-size:12px; font-weight:700; letter-spacing:1px; color:var(--gold); white-space:nowrap; max-width:200px; overflow:hidden; text-overflow:ellipsis; }
.nav-tabs { display:flex; gap:2px; }
.ntab { padding:8px 14px; border:none; background:none; cursor:pointer; font-family:var(--fc); font-size:13px; font-weight:600; letter-spacing:.5px; color:var(--ink3); border-radius:8px; transition:var(--tr); white-space:nowrap; text-decoration:none; display:inline-flex; align-items:center; }
.ntab:hover { color:var(--ink1); background:var(--bg2); } .ntab.active { color:var(--blue); background:var(--blue2); }
.chip { font-family:var(--fc); font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:3px 10px; border-radius:20px; }
.ch-su { background:#fff3e0; color:#b04400; border:1px solid #f5c890; }
.ch-ad { background:var(--purp2); color:var(--purple); border:1px solid #d0c8f0; }
.ch-vi { background:var(--green2); color:var(--green); border:1px solid #c0e0cc; }
.pub-ban { background:var(--green2); border-bottom:2px solid var(--green); padding:8px 20px; text-align:center; font-family:var(--fc); font-size:12px; font-weight:700; letter-spacing:2px; color:var(--green); text-transform:uppercase; position:relative; z-index:1; }

/* ---- PANELS ---- */
.abody { max-width:1200px; margin:0 auto; padding:24px 20px 80px; position:relative; z-index:1; }
.phdr { display:flex; align-items:center; gap:12px; margin-bottom:20px; flex-wrap:wrap; }
.ptl { font-family:var(--fd); font-size:28px; letter-spacing:3px; color:var(--ink1); }
.bdg { font-family:var(--fc); font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:3px 10px; border-radius:20px; }
.b-bl { background:var(--blue2); color:var(--blue); border:1px solid var(--blue3); }
.b-go { background:var(--gold2); color:var(--gold); border:1px solid var(--gold3); }
.b-gr { background:var(--green2); color:var(--green); border:1px solid #b0d8bc; }
.b-rd { background:var(--red2); color:var(--red); border:1px solid #f0c0c0; }
.b-pu { background:var(--purp2); color:var(--purple); border:1px solid #c8c0f0; }

/* ---- WEEK NAV ---- */
.wnav { display:flex; align-items:center; gap:8px; }
.wnb { width:30px; height:30px; border:1.5px solid var(--border); border-radius:8px; background:var(--surface); cursor:pointer; font-size:14px; font-weight:700; color:var(--ink2); transition:var(--tr); display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
.wnb:hover { border-color:var(--blue); color:var(--blue); background:var(--blue2); }
.wlbl { font-family:var(--fm); font-size:11px; font-weight:700; letter-spacing:2px; color:var(--ink2); padding:5px 14px; background:var(--surface); border:1px solid var(--border); border-radius:8px; }

/* ---- STAT TILES ---- */
.sstrip { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; margin-bottom:22px; }
.stile { background:var(--surface); border:1.5px solid var(--border); border-radius:var(--rl); padding:16px 18px; box-shadow:var(--sh-sm); position:relative; overflow:hidden; transition:var(--tr); }
.stile:hover { box-shadow:var(--sh-md); }
.stile::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; }
.st-bl::after { background:linear-gradient(90deg,var(--blue),#5aafe0); }
.st-go::after { background:linear-gradient(90deg,var(--gold),#d4a040); }
.st-gr::after { background:linear-gradient(90deg,var(--green),#40b060); }
.st-rd::after { background:linear-gradient(90deg,var(--red),#e05050); }
.st-pu::after { background:linear-gradient(90deg,var(--purple),#8060d0); }
.snum { font-family:var(--fm); font-size:26px; font-weight:900; line-height:1; margin-bottom:5px; }
.st-bl .snum{color:var(--blue);} .st-go .snum{color:var(--gold);} .st-gr .snum{color:var(--green);} .st-rd .snum{color:var(--red);} .st-pu .snum{color:var(--purple);}
.slbl { font-family:var(--fc); font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--ink3); }

/* ---- CARDS ---- */
.card { background:var(--surface); border:1.5px solid var(--border); border-radius:var(--rl); box-shadow:var(--sh-sm); overflow:hidden; }
.chdr { padding:14px 20px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:10px; background:var(--surface2); }
.chtl { font-family:var(--fc); font-weight:800; font-size:14px; letter-spacing:2px; text-transform:uppercase; color:var(--ink2); }
.cbody { padding:18px 20px; }
.mb12{margin-bottom:12px;} .mb16{margin-bottom:16px;} .mb24{margin-bottom:24px;}
.fb2{display:flex;align-items:center;justify-content:space-between;}
.tm{color:var(--ink3);font-size:12px;}
.dv{height:1px;background:var(--border);margin:18px 0;}

/* ---- STANDINGS ---- */
.sw { overflow-x:auto; }
.stbl { width:100%; border-collapse:collapse; font-family:var(--fb); font-size:13px; }
.stbl thead tr { background:var(--ink1); color:#fff; }
.stbl thead th { padding:10px 12px; text-align:center; font-family:var(--fc); font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; white-space:nowrap; }
.stbl thead th:nth-child(2) { text-align:left; }
.stbl tbody tr { border-bottom:1px solid var(--border); }
.stbl tbody tr:hover { background:var(--bg); }
.stbl tbody tr:nth-child(even) { background:var(--surface2); }
.stbl td { padding:9px 12px; text-align:center; color:var(--ink1); }
.stbl td:nth-child(2) { text-align:left; font-weight:600; }
.spos { font-family:var(--fc); font-size:15px; font-weight:800; color:var(--ink3); }
.spos.t3 { color:var(--gold); }
.tnm { display:flex; align-items:center; gap:10px; }
.tbdg { width:28px; height:28px; border-radius:7px; display:flex; align-items:center; justify-content:center; font-size:15px; flex-shrink:0; }
.pct { font-weight:700; color:var(--blue); } .wc { color:var(--green); font-weight:700; } .lc2 { color:var(--red); }
.stbl tbody tr.r1 td{background:#fffbea!important;} .stbl tbody tr.r2 td{background:#f7f7f7!important;} .stbl tbody tr.r3 td{background:#fff4ec!important;}

/* ---- MATCHUP CARD ---- */
.mc { background:var(--surface); border:1.5px solid var(--border); border-radius:var(--rl); overflow:hidden; box-shadow:var(--sh-sm); margin-bottom:16px; transition:var(--tr); }
.mc:hover { box-shadow:var(--sh-md); }
.mhdr { background:var(--ink1); color:#fff; padding:12px 18px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; }
.mht { font-family:var(--fd); font-size:18px; letter-spacing:2px; display:flex; align-items:center; gap:10px; }
.mht.r { justify-content:flex-end; }
.mhc { display:flex; flex-direction:column; align-items:center; gap:4px; }
.vs-b { font-family:var(--fc); font-size:11px; font-weight:700; letter-spacing:3px; color:rgba(255,255,255,.5); padding:3px 10px; border:1px solid rgba(255,255,255,.2); border-radius:20px; }
.lch { font-family:var(--fm); font-size:10px; font-weight:700; letter-spacing:2px; color:var(--gold); background:rgba(255,255,255,.06); padding:2px 10px; border-radius:4px; }
.wf { font-size:11px; font-family:var(--fc); font-weight:700; letter-spacing:1px; padding:3px 10px; border-radius:20px; background:rgba(255,210,0,.15); color:#ffd200; border:1px solid rgba(255,210,0,.3); }
.mgrid { display:grid; grid-template-columns:1fr 1fr; }
.mside { border-right:1px solid var(--border); } .mside:last-child { border-right:none; }
.sct { width:100%; border-collapse:collapse; font-size:12.5px; }
.sct th { background:var(--bg2); padding:7px 10px; text-align:center; font-family:var(--fc); font-size:10px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--ink3); border-bottom:1px solid var(--border); }
.sct th:first-child { text-align:left; }
.sct td { padding:8px 10px; text-align:center; border-bottom:1px solid rgba(0,0,0,.04); font-family:var(--fb); }
.sct td:first-child { text-align:left; font-weight:600; font-size:13px; }
.sct tr:hover td { background:var(--bg2); }
.sct tr.scr td { background:var(--blue2); font-family:var(--fc); font-weight:700; color:var(--blue); font-size:12px; border-top:1px solid var(--blue3); }
.shi{color:var(--gold);font-weight:700;} .stop{color:var(--green);font-weight:800;}
.gt { font-size:9px; padding:1px 5px; border-radius:4px; font-family:var(--fc); font-weight:700; letter-spacing:.5px; vertical-align:middle; margin-left:4px; }
.gm{background:var(--blue2);color:var(--blue);} .gf{background:#fce8f3;color:#b0388a;}
.hv{color:var(--purple);font-size:11px;font-weight:600;} .nv{color:var(--green);font-weight:800;}
.mftr { background:var(--bg2); border-top:1px solid var(--border); padding:10px 18px; display:flex; align-items:center; justify-content:space-between; }
.nblk { text-align:center; }
.nlbl { font-family:var(--fc); font-size:10px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--ink3); }
.nsc { font-family:var(--fm); font-size:20px; font-weight:900; color:var(--ink1); line-height:1.2; }
.nsc.w { color:var(--green); }

/* ---- TOP PLAYERS ---- */
.tgrid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media(max-width:700px){.tgrid{grid-template-columns:1fr;}}
.plist { display:flex; flex-direction:column; gap:8px; }
.prow { display:flex; align-items:center; gap:12px; padding:12px 16px; border-radius:var(--r); border:1.5px solid var(--border); background:var(--surface); transition:var(--tr); }
.prow:hover { box-shadow:var(--sh-sm); border-color:var(--blue3); }
.prow.rk1{border-color:var(--gold);background:var(--gold2);}
.prow.rk2{border-color:#b0b0b0;background:#f8f8f8;}
.prow.rk3{border-color:#c08840;background:#fdf4e8;}
.prnk { width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-family:var(--fd); font-size:20px; flex-shrink:0; }
.r1{background:linear-gradient(135deg,#a06010,var(--gold));color:#fff;box-shadow:0 3px 10px rgba(176,125,32,.3);}
.r2{background:linear-gradient(135deg,#666,#aaa);color:#fff;}
.r3{background:linear-gradient(135deg,#804a10,#c07820);color:#fff;}
.pinfo { flex:1; min-width:0; }
.pname { font-weight:700; font-size:15px; color:var(--ink1); }
.pteam { font-size:11px; color:var(--ink3); margin-top:2px; }
.psc { font-family:var(--fm); font-size:26px; font-weight:900; color:var(--gold); line-height:1; }
.pnet { font-size:11px; color:var(--green); font-weight:700; text-align:right; margin-top:2px; }

/* ---- ADMIN ---- */
.alayout{display:grid;grid-template-columns:320px 1fr;gap:20px;align-items:start;}
@media(max-width:900px){.alayout{grid-template-columns:1fr;}}
.aside{display:flex;flex-direction:column;gap:14px;position:sticky;top:74px;}
.afc{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--rl);overflow:hidden;box-shadow:var(--sh-sm);}
.afch{background:var(--ink1);color:#fff;padding:13px 18px;font-family:var(--fc);font-size:14px;font-weight:800;letter-spacing:2px;text-transform:uppercase;}
.afcb{padding:18px;}
.itabs{display:flex;gap:4px;margin-bottom:18px;flex-wrap:wrap;}
.itab{padding:7px 16px;border:1.5px solid var(--border);border-radius:var(--r);background:var(--surface);font-family:var(--fc);font-size:12px;font-weight:700;letter-spacing:1px;color:var(--ink3);cursor:pointer;transition:var(--tr);text-decoration:none;display:inline-flex;align-items:center;}
.itab.active{background:var(--blue);border-color:var(--blue);color:#fff;}
.itab:hover:not(.active){border-color:var(--blue3);color:var(--blue);}

/* RECAP */
.rgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media(max-width:700px){.rgrid{grid-template-columns:1fr;}}
.rtbl{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--rl);overflow:hidden;}
.rthdr{background:var(--ink1);color:#fff;padding:13px 16px;font-family:var(--fd);font-size:18px;letter-spacing:2px;display:flex;align-items:center;gap:10px;}
.sinp{width:60px;background:var(--surface2);border:1.5px solid var(--border);border-radius:7px;padding:7px 8px;font-family:var(--fm);font-size:13px;font-weight:700;color:var(--blue);text-align:center;outline:none;transition:var(--tr);}
.sinp:focus{border-color:var(--blue);background:#fff;box-shadow:0 0 0 3px rgba(29,111,164,.1);}

/* TEAM LIST */
.tli{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--rl);overflow:hidden;margin-bottom:12px;box-shadow:var(--sh-sm);}
.tli-h{padding:12px 16px;display:flex;align-items:center;gap:12px;cursor:pointer;background:var(--surface2);border-bottom:1px solid var(--border);}
.tli-b{padding:14px 16px;}
.pr{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--r);border:1px solid var(--border);background:var(--bg);margin-bottom:6px;}
.pr-n{flex:1;font-weight:600;font-size:13px;}
.pr-a{font-family:var(--fm);font-size:12px;color:var(--blue);font-weight:700;}

/* COLOR SWATCHES */
.csp{display:flex;gap:6px;flex-wrap:wrap;}
.cs{width:30px;height:30px;border-radius:7px;cursor:pointer;border:3px solid transparent;transition:var(--tr);}
.cs.sel{border-color:var(--ink1);transform:scale(1.15);}
.cs1{background:#1d6fa4;} .cs2{background:#256b3a;} .cs3{background:#b07d20;} .cs4{background:#b52b2b;}
.cs5{background:#5a3fa0;} .cs6{background:#b0388a;} .cs7{background:#1a8080;} .cs8{background:#b06020;}
.cs9{background:#506080;} .cs10{background:#488020;}
/* Team color BGs */
.tc1{background:#e8f2f9;} .tc2{background:#e6f4eb;} .tc3{background:#fdf3dc;} .tc4{background:#fdeaea;}
.tc5{background:#eeebf9;} .tc6{background:#fce8f3;} .tc7{background:#e0f8f8;} .tc8{background:#fff0e0;}
.tc9{background:#f0f0f0;} .tc10{background:#eef8e0;}

/* ---- MODAL ---- */
.movl{position:fixed;inset:0;z-index:200;background:rgba(26,25,22,.5);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .22s;}
.movl.open{opacity:1;pointer-events:all;}
.modal{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--rxl);padding:30px;max-width:500px;width:100%;box-shadow:var(--sh-lg);transform:scale(.96) translateY(10px);transition:transform .22s;}
.movl.open .modal{transform:scale(1) translateY(0);}
.mtitle{font-family:var(--fd);font-size:28px;letter-spacing:3px;margin-bottom:20px;color:var(--ink1);}
.macts{display:flex;gap:10px;justify-content:flex-end;margin-top:24px;}

/* ALERTS */
.alert{padding:12px 16px;border-radius:var(--r);font-family:var(--fc);font-weight:700;font-size:13px;letter-spacing:.5px;}
.alert-ok{background:var(--green2);border:1px solid #b0d8bc;color:var(--green);}
.alert-err{background:var(--red2);border:1px solid #f0c0c0;color:var(--red);}

/* EMPTY STATE */
.es{text-align:center;padding:48px 24px;color:var(--ink4);}
.es .em{font-size:40px;opacity:.3;margin-bottom:10px;} .es p{font-size:13px;}

/* PLAYER STATS */
.pstbl{width:100%;border-collapse:collapse;font-size:12.5px;}
.pstbl thead{background:linear-gradient(to right,var(--ink1),#2d2d28);color:#fff;}
.pstbl thead th{padding:10px 12px;text-align:center;font-family:var(--fc);font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;white-space:nowrap;}
.pstbl tbody tr{border-bottom:1px solid var(--border);} .pstbl tbody tr:hover{background:var(--bg);}
.pstbl td{padding:8px 12px;text-align:center;} .pstbl td:nth-child(2){text-align:left;font-weight:600;}

/* TOAST */
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(16px);background:var(--ink1);color:#fff;padding:12px 22px;border-radius:12px;font-size:13px;font-weight:600;z-index:999;opacity:0;transition:all .28s;box-shadow:var(--sh-lg);white-space:nowrap;}

/* SCROLLBAR */
::-webkit-scrollbar{width:5px;height:5px;} ::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:10px;}

/* PRINT */
@media print {
  .app-nav,.pub-ban,.phdr .btn,.itabs,.aside,.movl,#toast,button,.bgh,.bbl,.bgr,.bgo,.bdn{display:none!important;}
  body{background:#fff!important;font-size:11px;}
  .mc{break-inside:avoid;box-shadow:none;border:1px solid #ccc;margin-bottom:10px;}
  .stble th,.sct th{background:#333!important;color:#fff!important;-webkit-print-color-adjust:exact;}
  .stbl tbody tr.r1 td,.stbl tbody tr.r2 td,.stbl tbody tr.r3 td{-webkit-print-color-adjust:exact;}
}

/* RESPONSIVE */
@media(max-width:640px){
  .frow{grid-template-columns:1fr;}
  .nav-tabs{display:none;}
  .sstrip{grid-template-columns:repeat(2,1fr);}
  .tgrid{grid-template-columns:1fr;}
  .mgrid{grid-template-columns:1fr;}
  .mside{border-right:none;border-bottom:1px solid var(--border);}
}