* { box-sizing: border-box; }
body { margin: 0; font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
       background: #f2f4f8; color: #1c2733; font-size: 15px; }
a { color: #0b62c4; text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 16px; }

.topbar { background: #12263f; color: #fff; }
.topbar .wrap { display: flex; align-items: center; gap: 24px; height: 54px; }
.brand { color: #fff; font-weight: 700; font-size: 18px; }
.topbar nav { display: flex; gap: 4px; }
.topbar nav a { color: #c8d4e4; padding: 6px 12px; border-radius: 6px; }
.topbar nav a.active, .topbar nav a:hover { background: #1f3a5f; color: #fff; text-decoration: none; }

main { padding: 20px 16px 40px; }
h1 { font-size: 22px; margin: 14px 0; }
h2 { font-size: 17px; margin: 22px 0 10px; }
.foot { color: #8194a8; padding: 18px 16px 30px; font-size: 13px; }

.card { background: #fff; border: 1px solid #dde4ee; border-radius: 10px;
        padding: 16px 18px; margin-bottom: 16px; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.stat { background: #fff; border: 1px solid #dde4ee; border-radius: 10px; padding: 14px 16px; }
.stat .n { font-size: 26px; font-weight: 700; color: #12263f; }
.stat .l { color: #66788e; font-size: 13px; }

.tbl { width: 100%; border-collapse: collapse; background: #fff;
       border: 1px solid #dde4ee; border-radius: 10px; overflow: hidden; }
.tbl th, .tbl td { padding: 7px 10px; text-align: left; border-bottom: 1px solid #edf1f7; }
.tbl th { background: #f7f9fc; font-size: 13px; color: #52657c; white-space: nowrap; }
.tbl tr:hover td { background: #f8fafd; }
.tbl .num, .tbl .score { text-align: right; font-variant-numeric: tabular-nums; }
.tbl small { color: #93a2b5; }
.dim { color: #7c8da1; font-size: 13px; }

.matches td.red, .matches th.red { background: rgba(220, 60, 60, .06); }
.matches td.blue, .matches th.blue { background: rgba(40, 90, 220, .06); }
.matches .score { font-weight: 700; }
.matches tr.red-win td.red { background: rgba(220, 60, 60, .16); }
.matches tr.blue-win td.blue { background: rgba(40, 90, 220, .16); }
.matches a.me { font-weight: 700; text-decoration: underline; }

.searchbar { display: flex; gap: 8px; flex-wrap: wrap; margin: 14px 0; }
.searchbar input[type=text], .searchbar select {
  padding: 8px 10px; border: 1px solid #c5d0de; border-radius: 8px; font-size: 15px; }
.searchbar input[type=text] { min-width: 240px; }
button, .btn { background: #0b62c4; border: 0; color: #fff; padding: 8px 16px;
  border-radius: 8px; font-size: 14px; cursor: pointer; display: inline-block; }
button:hover, .btn:hover { background: #0a55aa; text-decoration: none; }
.btn.gray { background: #64748b; } .btn.gray:hover { background: #556072; }
.btn.red { background: #c43b2f; } .btn.red:hover { background: #a93227; }
.btn.sm { padding: 4px 10px; font-size: 13px; }

.badge { display: inline-block; padding: 2px 8px; border-radius: 20px;
  font-size: 12px; background: #e8eef7; color: #33465e; margin-right: 4px; }
.badge.live { background: #d9231f; color: #fff; animation: pulse 1.6s infinite; }
.badge.green { background: #d9efdd; color: #1c6b2f; }
.badge.award { background: #fdf3d1; color: #7a5b00; }
@keyframes pulse { 50% { opacity: .55; } }

.pager { margin: 16px 0; display: flex; gap: 6px; flex-wrap: wrap; }
.pager a, .pager span { padding: 5px 11px; border: 1px solid #c9d4e2;
  border-radius: 6px; background: #fff; }
.pager a.cur { background: #0b62c4; color: #fff; border-color: #0b62c4; }

.kv { display: grid; grid-template-columns: 110px 1fr; gap: 4px 14px; }
.kv dt { color: #66788e; } .kv dd { margin: 0; }

.tabs { display: flex; gap: 6px; margin: 12px 0; flex-wrap: wrap; }
.tabs a { padding: 6px 14px; border: 1px solid #c9d4e2; border-radius: 20px; background: #fff; }
.tabs a.cur { background: #12263f; color: #fff; border-color: #12263f; }

.flash { padding: 10px 14px; border-radius: 8px; margin: 10px 0; }
.flash.ok { background: #ddf3e1; color: #185c2a; }
.flash.err { background: #fbe0dd; color: #8c2318; }

.admin-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 8px 0; }
.admin-form label { color: #52657c; font-size: 14px; }
.admin-form input, .admin-form select { padding: 7px 9px; border: 1px solid #c5d0de; border-radius: 7px; }
.seasons-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 4px; margin: 8px 0; }
.seasons-pick label { font-size: 13px; color: #33465e; }

.progress { height: 10px; background: #e4eaf2; border-radius: 6px; overflow: hidden; width: 100%; }
.progress i { display: block; height: 100%; background: #0b62c4; transition: width .5s; }

table.compact td, table.compact th { padding: 5px 8px; font-size: 13px; }
.mt0 { margin-top: 0; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 800px) { .grid2 { grid-template-columns: 1fr; } }

/* 多行自适应收纳: 宽屏尽量完整显示, 超过两行才省略 */
.clamp2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
          overflow: hidden; word-break: break-all; }
