﻿:root{
    --bg:#f4f5f7; --card:#ffffff; --ink:#1a2233; --muted:#6b7486;
    --line:#e3e6ec; --head:#141b2d; --accent:#2f6df6;
    --win:#1e9e5a; --draw:#e0a800; --loss:#d64545;
    --A:#2f6df6; --B:#1e9e5a; --C:#b3591e; --D:#8b4bd1; --E:#d6456b;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  body{font-family:"Segoe UI",system-ui,-apple-system,sans-serif; background:var(--bg); color:var(--ink); font-size:15px;}
  a{color:var(--accent); text-decoration:none; cursor:pointer;}

  header{background:var(--head); color:#fff; padding:0; position:sticky; top:0; z-index:50; box-shadow:0 2px 8px rgba(0,0,0,.25);}
  .hd-top{display:flex; align-items:center; gap:12px; padding:14px 20px 8px;}
  .hd-top h1{font-size:19px; font-weight:600; letter-spacing:.3px;}
  .hd-top .sub{color:#9aa5bd; font-size:13px;}
  nav{display:flex; gap:4px; padding:0 14px 0; overflow-x:auto;}
  nav button{background:none; border:none; color:#b9c2d6; font:inherit; font-weight:600; padding:10px 16px; cursor:pointer; border-bottom:3px solid transparent; white-space:nowrap;}
  nav button.active{color:#fff; border-bottom-color:var(--accent);}
  nav button:hover{color:#fff;}
  .yearnav{display:flex; gap:8px; padding:0 20px 10px; flex-wrap:wrap;}
  .yearnav a{color:#d7deef; border:1px solid #52607d; border-radius:8px; padding:5px 12px; font-size:13px; font-weight:700;}
  .yearnav a.active{background:var(--accent); border-color:var(--accent); color:#fff;}
  .yearnav a:hover{color:#fff; border-color:#7c8aaa;}

  main{max-width:1080px; margin:0 auto; padding:22px 16px 60px;}
  h2{font-size:20px; margin-bottom:14px;}
  h3{font-size:16px; margin:18px 0 10px;}

  .cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:22px;}
  .stat{background:var(--card); border:1px solid var(--line); border-radius:10px; padding:14px 16px;}
  .stat .num{font-size:26px; font-weight:700;}
  .stat .lbl{color:var(--muted); font-size:12.5px; text-transform:uppercase; letter-spacing:.5px; margin-top:2px;}

  .divgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:14px;}
  .divcard{background:var(--card); border:1px solid var(--line); border-radius:12px; overflow:hidden; cursor:pointer; transition:box-shadow .15s;}
  .divcard:hover{box-shadow:0 4px 14px rgba(20,27,45,.12);}
  .divcard .bar{padding:11px 16px; color:#fff; font-weight:700; display:flex; justify-content:space-between; align-items:center;}
  .divcard .bar .meta{font-weight:500; font-size:12.5px; opacity:.9;}
  .divcard .body{padding:12px 16px 14px;}
  .mini{width:100%; border-collapse:collapse; font-size:13.5px;}
  .mini td{padding:4px 2px; border-bottom:1px solid var(--line);}
  .mini tr:last-child td{border-bottom:none;}
  .mini .pos{color:var(--muted); width:20px;}
  .mini .pts{text-align:right; font-weight:700;}
  .divcard .foot{color:var(--muted); font-size:12.5px; padding:0 16px 13px;}

  table.data{width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--line); border-radius:10px; overflow:hidden; font-size:14px;}
  table.data th{background:#eef0f4; text-align:left; padding:9px 10px; font-size:12px; text-transform:uppercase; letter-spacing:.4px; color:var(--muted); border-bottom:1px solid var(--line);}
  table.data td{padding:8px 10px; border-bottom:1px solid var(--line);}
  table.data tr:last-child td{border-bottom:none;}
  table.data tr.click{cursor:pointer;}
  table.data tr.click:hover{background:#f6f8fc;}
  table.data th.sortable{cursor:pointer; user-select:none; white-space:nowrap;}
  table.data th.sortable:hover{color:var(--ink);}
  .r{text-align:right;} table.data th.r{text-align:right;}
  .c{text-align:center;} table.data th.c{text-align:center;}
  .b{font-weight:700;}
  .mut{color:var(--muted);}
  .title-tag{display:inline-block; font-size:10.5px; font-weight:700; color:#fff; background:#8a5a2b; border-radius:4px; padding:1px 4px; margin-right:5px; vertical-align:1px;}
  .r41{display:inline-block; font-size:10px; font-weight:700; color:#fff; background:var(--loss); border-radius:4px; padding:1px 4px; margin-left:6px; vertical-align:1px; cursor:help;}

  .subnav{display:flex; gap:8px; margin-bottom:18px; flex-wrap:wrap;}
  .subnav button, .pill{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:7px 16px; font:inherit; font-size:13.5px; font-weight:600; color:var(--muted); cursor:pointer;}
  .subnav button.active, .pill.active{background:var(--ink); color:#fff; border-color:var(--ink);}
  .pills{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:16px;}
  .pill{padding:6px 13px; border-radius:8px;}

  .match{background:var(--card); border:1px solid var(--line); border-radius:10px; margin-bottom:10px; overflow:hidden;}
  .match .head{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; padding:12px 16px; cursor:pointer;}
  .match .head:hover{background:#f6f8fc;}
  .match .t1{text-align:right; font-weight:600;}
  .match .t2{text-align:left; font-weight:600;}
  .match .score{background:var(--head); color:#fff; border-radius:8px; padding:4px 12px; font-weight:700; font-size:15px; white-space:nowrap;}
  .match .detail{border-top:1px solid var(--line); padding:6px 16px 12px; display:none;}
  .match.open .detail{display:block;}
  .boards{width:100%; border-collapse:collapse; font-size:13.5px;}
  .boards th{color:var(--muted); font-size:11px; text-transform:uppercase; text-align:left; padding:7px 6px 4px; border-bottom:1px solid var(--line);}
  .boards td{padding:6px 6px; border-bottom:1px solid #f0f2f6;}
  .boards tr:last-child td{border-bottom:none;}
  .dot{display:inline-block; width:10px; height:10px; border-radius:50%; border:1px solid #999; margin-right:6px; vertical-align:-1px;}
  .dot.w{background:#fff;} .dot.b{background:#333; border-color:#333;}
  .res{font-weight:700; text-align:center; width:56px;}
  .chip{display:inline-block; min-width:22px; text-align:center; font-size:11.5px; font-weight:700; color:#fff; border-radius:5px; padding:2px 6px;}
  .chip.W{background:var(--win);} .chip.D{background:var(--draw);} .chip.L{background:var(--loss);}

  .bo-ctl{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:14px; font-size:13.5px;}
  .bo-ctl label{cursor:pointer;}
  .sw{display:inline-block; width:13px; height:13px; border-radius:3px; margin:0 4px 0 14px; vertical-align:-2px;}
  .sw.breach{background:#fbdada; box-shadow:inset 3px 0 0 var(--loss);}
  .sw.viol{background:#fff3d6; box-shadow:inset 3px 0 0 var(--draw);}
  .sw.both{background:linear-gradient(135deg,#fbdada 0 60%,#fff3d6 60% 100%); box-shadow:inset 3px 0 0 var(--loss), inset -3px 0 0 var(--draw);}
  .bo-hint{display:none; color:var(--muted); font-size:12.5px; margin:0 0 6px;}
  .bo-wrap{overflow-x:auto; background:var(--card); border:1px solid var(--line); border-radius:10px; margin-bottom:18px;}
  .bo-table{border-collapse:collapse; font-size:12px; width:100%;}
  .bo-table th, .bo-table td{border:1px solid var(--line); padding:4px 7px; text-align:left; vertical-align:top; white-space:nowrap;}
  .bo-table th{background:#eef0f4; font-size:11px; text-transform:uppercase; color:var(--muted);}
  .bo-table td:first-child{position:sticky; left:0; z-index:1; background:var(--card);}
  .bo-table th:first-child{position:sticky; left:0; z-index:2; background:#eef0f4;}
  .bo-table td.breach{background:#fbdada; box-shadow:inset 4px 0 0 var(--loss);}
  .bo-table td.viol{background:#fff3d6; box-shadow:inset 4px 0 0 var(--draw);}
  .bo-table td.viol.breach{background:linear-gradient(135deg,#fbdada 0 60%,#fff3d6 60% 100%); box-shadow:inset 4px 0 0 var(--loss), inset -3px 0 0 var(--draw);}
  .bo-lb{background:#fbdada; border-radius:4px; padding:1px 4px; box-shadow:inset 3px 0 0 var(--loss);}
  .rtg-gap{display:block; margin-top:2px; font-size:11px; font-weight:700; color:var(--muted);}
  .rtg-gap.inline{display:inline-block; margin:0 2px 0 4px;}
  .rtg-gap.inv{color:#185fa5;}
  .rtg-gap.wide{color:var(--ink);}
  .rtg-gap.bad{color:#a32d2d;}
  .back{display:inline-block; margin-bottom:14px; font-weight:600;}
  .teamhead{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px 20px; margin-bottom:18px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; align-items:center;}
  .teamhead h2{margin:0;}
  .rec{display:flex; gap:16px; font-size:13.5px; color:var(--muted);}
  .rec b{color:var(--ink); font-size:17px; display:block;}

  #loader{max-width:640px; margin:60px auto; text-align:center;}
  #drop{border:2px dashed #b7c0d2; border-radius:14px; padding:50px 30px; background:var(--card); margin-top:18px;}
  #drop.on{border-color:var(--accent); background:#eef4ff;}
  #drop input{display:none;}
  .btn{display:inline-block; background:var(--accent); color:#fff; border:none; border-radius:8px; padding:10px 20px; font:inherit; font-weight:600; cursor:pointer;}
  .rc-form{display:flex; flex-wrap:wrap; gap:14px; align-items:flex-end; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 18px;}
  .rc-form label{display:flex; flex-direction:column; gap:4px; font-size:12.5px; color:var(--muted); font-weight:600;}
  .rc-form select, .rc-form input{font:inherit; font-size:14px; padding:7px 9px; border:1px solid var(--line); border-radius:7px; background:#fff; color:var(--ink); min-width:160px;}
  .rc-result{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px 20px;}
  .rc-verdict{font-weight:700; font-size:15px; padding:8px 12px; border-radius:8px; margin-bottom:10px;}
  .rc-verdict.ok{background:#e6f6ec; color:var(--win);}
  .rc-verdict.bad{background:#fbdada; color:var(--loss);}
  .rc-row{font-size:13.5px; padding:8px 0; border-top:1px solid var(--line);}
  .rc-row:first-of-type{border-top:none;}
  .rc-row.bad{color:var(--loss);}
  .rc-row.ok{color:var(--ink);}
  .note{color:var(--muted); font-size:13px; margin-top:12px; line-height:1.5;}
  .err{color:var(--loss); font-weight:600; margin-top:10px;}
  footer{color:var(--muted); font-size:12.5px; text-align:center; padding:20px;}
  @media (max-width:640px){ .match .head{grid-template-columns:1fr; text-align:center;} .match .t1,.match .t2{text-align:center;} .bo-hint{display:block;} }
