:root {
  --bg: #f4f6fa;
  --panel: #ffffff;
  --line: #e6eaf1;
  --text: #1b2432;
  --muted: #6b7688;
  --primary: #2563eb;
  --primary-soft: #eaf1ff;
  --accent: #f59e0b;
  --good: #16a34a;
  --bad: #dc2626;
  --radius: 12px;
  --shadow: 0 1px 2px rgba(16, 30, 54, .04), 0 8px 24px rgba(16, 30, 54, .06);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--text);
  font: 14px/1.6 "PingFang SC", "Microsoft YaHei", "Segoe UI", system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }

.wrap {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ---------- 顶栏 ---------- */
.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: saturate(180%) blur(10px);
  border-bottom: 1px solid var(--line);
}

.topbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 62px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
}
.brand:hover { text-decoration: none; }

.brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: linear-gradient(135deg, #2563eb, #1e40af);
  color: #fff;
  font-weight: 700;
  font-size: 17px;
}

.brand strong { display: block; font-size: 15px; letter-spacing: .3px; }
.brand small { display: block; color: var(--muted); font-size: 11px; margin-top: -2px; }

.nav { display: flex; gap: 6px; margin-left: auto; }
.nav a {
  padding: 7px 14px;
  border-radius: 8px;
  color: var(--muted);
  font-weight: 500;
}
.nav a:hover { background: #f2f5fa; color: var(--text); text-decoration: none; }
.nav a.on { background: var(--primary-soft); color: var(--primary); }

.nav-user {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: 14px;
  padding-left: 14px;
  border-left: 1px solid var(--line);
}
.nav-user form { margin: 0; }
.nav-who {
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  white-space: nowrap;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.nav-out {
  height: 30px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.nav-out:hover { background: #f2f5fa; color: var(--text); }

main.wrap { padding-top: 24px; padding-bottom: 48px; }

/* ---------- 概览卡片 ---------- */
.cards {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}
.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 14px 16px;
  box-shadow: var(--shadow);
}
.card span { display: block; color: var(--muted); font-size: 12px; }
.card strong {
  display: block;
  margin-top: 4px;
  font-size: 24px;
  font-variant-numeric: tabular-nums;
  letter-spacing: .3px;
}

/* ---------- 可折叠规模概览 ---------- */
.stat-fold {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  margin-bottom: 14px;
}
.stat-fold > summary {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  cursor: pointer;
  list-style: none;
  font-size: 13px;
  color: var(--muted);
}
.stat-fold > summary::-webkit-details-marker { display: none; }
.stat-fold > summary:hover { background: #fafbfd; border-radius: var(--radius); }
.stat-fold[open] > summary { border-bottom: 1px solid var(--line); border-radius: 0; }
.stat-fold .stat-caret { display: inline-block; transition: transform .15s; }
.stat-fold[open] .stat-caret { transform: rotate(90deg); }
.stat-fold .stat-brief {
  margin-left: auto;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.stat-fold .stat-brief b { color: var(--text); font-weight: 600; }
.stat-fold .cards { margin: 14px; }

/* ---------- 筛选条 ---------- */
.filters {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px 14px;
  margin-bottom: 14px;
  box-shadow: var(--shadow);
}
.filters label { display: flex; flex-direction: column; gap: 4px; }
.filters label > span { color: var(--muted); font-size: 12px; }
.filters .grow { flex: 1 1 220px; }

.fix-toggle { display: flex; flex-direction: column; gap: 4px; }
.fix-toggle > span { color: var(--muted); font-size: 12px; }
.filters .switch { display: inline-flex; flex-direction: row; align-items: center; gap: 8px; cursor: pointer; }
.switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.switch i {
  position: relative;
  width: 40px;
  height: 22px;
  border-radius: 999px;
  background: #d6dce7;
  transition: background .18s ease;
  flex: none;
}
.switch i::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(16, 30, 54, .25);
  transition: transform .18s ease;
}
.switch input:checked + i { background: var(--accent); }
.switch input:checked + i::after { transform: translateX(18px); }
.switch input:focus-visible + i { outline: 2px solid var(--primary); outline-offset: 2px; }
.switch em { font-style: normal; font-size: 12px; color: var(--muted); }
.switch input:checked ~ em { color: #b45309; font-weight: 600; }

select, input[type="search"] {
  height: 34px;
  min-width: 120px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  outline: none;
}
input[type="search"] { width: 100%; }
select:focus, input[type="search"]:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }

.btn {
  display: inline-flex;
  align-items: center;
  height: 34px;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  background: var(--primary);
  color: #fff;
  font: inherit;
  font-weight: 500;
  cursor: pointer;
}
.btn:hover { background: #1d4ed8; text-decoration: none; color: #fff; }

/* ---------- 组别标签 ---------- */
.tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.tabs.sub { margin-top: -4px; }
.tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--text);
  font-weight: 500;
}
.tab:hover { border-color: #c7d4ea; text-decoration: none; }
.tab.on { background: var(--primary); border-color: var(--primary); color: #fff; }
.tab em {
  font-style: normal;
  font-size: 11px;
  color: var(--muted);
  background: #f1f4f9;
  border-radius: 999px;
  padding: 0 7px;
}
.tab.on em { background: rgba(255, 255, 255, .22); color: #fff; }

.unitbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin: 4px 0 12px;
}
.unit-title h2 { margin: 0 0 2px; font-size: 18px; }
.unit-title .muted { font-size: 12px; }

.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #fff; }
.seg a, .seg button {
  padding: 6px 16px;
  color: var(--muted);
  font: inherit;
  font-size: 13px;
  background: #fff;
  border: 0;
  cursor: pointer;
}
.seg button + button, .seg a + a { border-left: 1px solid var(--line); }
.seg a:hover, .seg button:hover { background: #f4f7fc; text-decoration: none; }
.seg a.on, .seg button.on { background: var(--primary); color: #fff; }
.seg em { font-style: normal; margin-left: 4px; opacity: .65; }
.panel-head .seg { margin-bottom: 12px; }
.grid tbody tr[hidden] { display: none; }

/* ---------- 面板与表格 ---------- */
.panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  margin-bottom: 18px;
}

.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px 0;
}
.panel-head h2 { margin: 0; font-size: 16px; }
.panel-head h2 small { font-weight: 400; font-size: 12px; margin-left: 6px; }

table.grid {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}
.grid thead th {
  position: relative;
  text-align: left;
  padding: 11px 14px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  background: #fafbfd;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
.grid tbody td {
  padding: 10px 14px;
  border-bottom: 1px solid #f1f4f9;
  vertical-align: middle;
}
.grid tbody tr:last-child td { border-bottom: 0; }
.grid tbody tr:hover { background: #f8faff; }

.grid .num { text-align: right; }
.grid .center { text-align: center; }
.strong { font-weight: 600; }
.muted { color: var(--muted); }

.name { font-weight: 600; color: var(--text); }
.name:hover { color: var(--primary); }
.code {
  display: block;
  color: #9aa5b5;
  font-size: 11px;
  letter-spacing: .2px;
}

.rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 24px;
  padding: 0 8px;
  border-radius: 6px;
  background: #f2f5fa;
  color: #46536b;
  font-weight: 600;
  font-size: 12px;
}
.rank.top { background: #fff4df; color: #b45309; }

.rank-mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 17px;
  margin-left: 6px;
  padding: 0 6px;
  border-radius: 999px;
  background: #eef4ff;
  color: var(--primary);
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  vertical-align: 1px;
}
.rank-mini.gold { background: #fff4df; color: #b45309; }
.rank-mini.red { background: #fdeaea; color: #c02c2c; }
.rank-mini.violet { background: #f2eafd; color: #7c3aed; }

.chip {
  display: inline-block;
  padding: 1px 9px;
  border-radius: 999px;
  background: #f1f4f9;
  color: #46536b;
  font-size: 12px;
}

.empty { padding: 36px 18px; text-align: center; color: var(--muted); }

.up { color: var(--good); }
.down { color: var(--bad); }

/* ---------- 分页 ---------- */
.listfoot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.pager { display: flex; align-items: center; gap: 6px; }
.pager a, .pager .pg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font-size: 13px;
}
.pager a:hover { border-color: #c7d4ea; text-decoration: none; }
.pager .pg.on { background: var(--primary); border-color: var(--primary); color: #fff; }

/* ---------- 运动员档案 ---------- */
.pagehead { margin-bottom: 14px; }
.pagehead h1 { margin: 0 0 2px; font-size: 22px; }

.profile {
  display: flex;
  align-items: center;
  gap: 18px;
  background: linear-gradient(135deg, #ffffff, #f7faff);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 20px 24px;
  margin-bottom: 16px;
  box-shadow: var(--shadow);
}
.avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: linear-gradient(135deg, #3b82f6, #1e40af);
  color: #fff;
  font-size: 26px;
  font-weight: 600;
  flex: 0 0 auto;
}
.profile-main { flex: 1 1 auto; min-width: 0; }
.profile-main h1 { margin: 0 0 4px; font-size: 24px; }
.profile-main .meta { display: flex; gap: 14px; flex-wrap: wrap; color: var(--muted); font-size: 13px; }
.profile-main .code { margin-top: 2px; color: #9aa5b5; font-size: 12px; }
.profile-stats { display: flex; gap: 28px; }
.profile-stats div { text-align: right; }
.profile-stats span { display: block; color: var(--muted); font-size: 12px; }
.profile-stats strong { font-size: 24px; font-variant-numeric: tabular-nums; }
.analysis-link {
  display: inline-flex;
  align-items: center;
  margin-top: 8px;
  padding: 3px 12px;
  border-radius: 999px;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 13px;
  font-weight: 600;
}
.analysis-link:hover { background: #dfe9ff; text-decoration: none; }

.chart-panel { padding-bottom: 8px; }
.chart { width: 100%; height: 380px; }

.analysis-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 18px;
}
.analysis-grid .panel { margin-bottom: 0; }
.chart-sm { width: 100%; height: 300px; }
.chart-note { padding: 0 18px 14px; color: var(--muted); font-size: 12px; text-align: center; }
.chart-note.left { text-align: left; padding-top: 10px; }
.pagehead h1 small { font-size: 13px; font-weight: 400; }

/* ---------- VIP 打法点评 ---------- */
.vip-panel {
  position: relative;
  overflow: hidden;
  margin-bottom: 18px;
  padding: 20px 24px 14px;
  border-radius: var(--radius);
  border: 1px solid rgba(212, 175, 55, .4);
  background:
    radial-gradient(120% 160% at 100% 0%, rgba(212, 175, 55, .22), transparent 55%),
    linear-gradient(135deg, #101827, #1b2537 55%, #0f172a);
  box-shadow: 0 18px 40px -24px rgba(15, 23, 42, .8), inset 0 1px 0 rgba(255, 255, 255, .06);
  color: #e8edf6;
}
.vip-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .05) 47%, transparent 60%);
  pointer-events: none;
}
.vip-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.vip-title { display: flex; align-items: center; gap: 10px; }
.vip-title h2 { margin: 0; font-size: 17px; letter-spacing: 1px; color: #f7f9ff; }
.vip-crown { display: inline-flex; color: #d4af37; }
.vip-badge {
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .6px;
  color: #20180a;
  background: linear-gradient(120deg, #f7e7b0, #d4af37 55%, #b8912e);
  box-shadow: 0 0 12px rgba(212, 175, 55, .35);
}
.vip-sub { color: #93a1ba; font-size: 12px; }
.vip-lead { margin: 16px 0 12px; }
.vip-lead strong {
  display: block;
  font-size: 20px;
  letter-spacing: .5px;
  background: linear-gradient(100deg, #fdf3cf, #d4af37 70%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.vip-lead p { margin: 6px 0 0; color: #c7d2e4; font-size: 13.5px; line-height: 1.8; }
.vip-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.vip-tag {
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid rgba(212, 175, 55, .35);
  background: rgba(212, 175, 55, .08);
  color: #e8d69b;
  font-size: 12px;
}
.vip-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid rgba(255, 255, 255, .08);
}
.vip-block { padding: 14px 18px 10px; }
.vip-block + .vip-block { border-left: 1px solid rgba(255, 255, 255, .08); }
.vip-block h3 { margin: 0 0 6px; font-size: 12px; font-weight: 600; letter-spacing: 1.5px; color: #d4af37; }
.vip-block p { margin: 0; color: #c7d2e4; font-size: 13px; line-height: 1.75; }
.vip-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; }
.vip-metrics span { display: block; color: #93a1ba; font-size: 11px; }
.vip-metrics strong { font-size: 15px; color: #f7f9ff; font-variant-numeric: tabular-nums; }
.vip-foot { margin-top: 4px; padding-top: 10px; border-top: 1px solid rgba(255, 255, 255, .06); color: #7f8da6; font-size: 11px; }
@media (max-width: 1000px) {
  .vip-grid { grid-template-columns: 1fr; }
  .vip-block + .vip-block { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .08); }
}

.weekly-fold > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  cursor: pointer;
  list-style: none;
  font-weight: 600;
  font-size: 16px;
  color: var(--text);
}
.weekly-fold > summary::-webkit-details-marker { display: none; }
.weekly-fold > summary:hover { background: #fafbfd; }
.weekly-fold[open] > summary { border-bottom: 1px solid var(--line); }
.weekly-fold .trend-title { display: inline-flex; align-items: center; }
.weekly-fold .trend-title small { font-weight: 400; font-size: 12px; margin-left: 6px; }
.weekly-fold .caret {
  display: inline-block;
  margin-right: 8px;
  color: var(--muted);
  transition: transform .15s;
}
.weekly-fold[open] .caret { transform: rotate(90deg); }

/* ---------- 状态页 ---------- */
.state { padding: 56px 24px; text-align: center; }
.state-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 26px;
  font-weight: 700;
}
.state h1 { font-size: 20px; margin: 14px 0 6px; }
.codeblock {
  display: inline-block;
  margin: 8px 0;
  padding: 10px 16px;
  background: #0f172a;
  color: #e2e8f0;
  border-radius: 8px;
  font: 13px/1.5 "Cascadia Mono", Consolas, monospace;
  text-align: left;
}

/* ---------- 赛事现场明细 ---------- */
.back { display: inline-block; color: var(--muted); font-size: 13px; margin-bottom: 6px; }
.back:hover { color: var(--primary); text-decoration: none; }
.pagehead .meta {
  display: flex; gap: 10px; flex-wrap: wrap; align-items: center;
  color: var(--muted); font-size: 13px;
}
.chip.warn { background: #fff4df; color: #b45309; }
.chip.pending { margin-left: 6px; background: #eef2ff; color: #4353b5; }
.fix {
  display: inline-block;
  margin-left: 4px;
  padding: 0 6px;
  border-radius: 999px;
  background: #fff4df;
  color: #b45309;
  font-size: 11px;
  font-style: normal;
  font-weight: 600;
  vertical-align: 1px;
}
.fix-note {
  margin-top: 8px;
  max-width: 520px;
  color: #b45309;
  font-size: 12px;
  line-height: 1.6;
}
.est { color: #b45309; border-bottom: 1px dashed #e8c48a; cursor: help; }
.mini-stats {
  display: flex; gap: 28px; flex-wrap: wrap;
  padding: 14px 18px; border-bottom: 1px solid #f1f4f9;
}
.mini-stats div span { display: block; color: var(--muted); font-size: 12px; }
.mini-stats div strong { font-size: 20px; font-variant-numeric: tabular-nums; }
.split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.split-col { padding: 12px 0 6px; }
.split-col + .split-col { border-left: 1px solid #f1f4f9; }
.split-col h3 { margin: 0 18px 8px; font-size: 14px; }
.fold { border-top: 1px solid #f1f4f9; }
.fold summary {
  cursor: pointer; padding: 10px 18px;
  font-weight: 600; font-size: 13px; color: #46536b; background: #fafbfd;
}
.fold summary:hover { background: #f4f7fc; }
.fold .grid { border-top: 1px solid #f1f4f9; }
tr.hl { background: var(--primary-soft); }
tr.hl:hover { background: #e4edff; }
tr.hl.loss { background: #fdeceb; box-shadow: inset 3px 0 0 #d33a2c; }
tr.hl.loss:hover { background: #fbdcd9; }
.loss-tag {
  display: inline-block;
  margin-left: 5px;
  padding: 0 5px;
  border-radius: 4px;
  background: #d33a2c;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 16px;
  vertical-align: 1px;
}

/* ---------- 全局加载遮罩 ---------- */
.loading-mask {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(247, 250, 254, .72);
  backdrop-filter: blur(2px);
  cursor: progress;
}
body.is-loading { overflow: hidden; }
body.is-loading .loading-mask { display: flex; }
body.is-loading .wrap,
body.is-loading .topbar { pointer-events: none; }
.loading-box {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(15, 23, 42, .14);
  color: var(--text);
  font-size: 14px;
  font-weight: 600;
}
.loading-spinner {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid #d7e3fb;
  border-top-color: var(--primary);
  animation: loading-spin .7s linear infinite;
}
@keyframes loading-spin {
  to { transform: rotate(360deg); }
}

/* ---------- 页脚 ---------- */
.footer {
  border-top: 1px solid var(--line);
  padding: 18px 0 28px;
  color: #9aa5b5;
  font-size: 12px;
}

@media (max-width: 1000px) {
  .cards { grid-template-columns: repeat(2, 1fr); }
  .stat-fold > summary { flex-wrap: wrap; }
  .stat-fold .stat-brief { margin-left: 0; width: 100%; }
  .profile { flex-wrap: wrap; }
  .profile-stats { gap: 20px; }
  .split { grid-template-columns: 1fr; }
  .split-col + .split-col { border-left: 0; border-top: 1px solid #f1f4f9; }
  .analysis-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .wrap { padding: 0 14px; }
  .cards { grid-template-columns: 1fr; }
  .unitbar { flex-direction: column; align-items: flex-start; }
  .grid thead th, .grid tbody td { padding: 9px 10px; }
  .panel { overflow-x: auto; }
  .grid { min-width: 760px; }
  .nav { gap: 2px; }
  .nav a { padding: 7px 9px; font-size: 13px; }
  .nav-user { margin-left: 8px; padding-left: 8px; }
  .nav-who { display: none; }
}

/* ---------- 临近比赛 ---------- */
.flashes { margin-bottom: 14px; }
.flash {
  margin-bottom: 8px;
  padding: 10px 14px;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 13px;
}
.flash.ok { background: #ecfdf3; color: #067647; border-color: #a6f4c5; }
.flash.warn { background: #fffaeb; color: #b54708; border-color: #fedf89; }
.flash.error { background: #fef3f2; color: #b42318; border-color: #fecdca; }

.inline { display: inline; }
.btn.small { height: 28px; padding: 0 12px; font-size: 12px; }
.note { margin: -6px 0 18px; color: var(--muted); font-size: 12px; }

.diff {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 10px;
  border-radius: 999px;
  background: #f1f4f9;
  color: #46536b;
  font-size: 12px;
  font-weight: 600;
}
.diff.lv0 { background: #f1f4f9; color: #6b7688; }
.diff.lv1 { background: #ecfdf3; color: #067647; }
.diff.lv2 { background: #e6f7f1; color: #0f766e; }
.diff.lv3 { background: #eaf1ff; color: #1d4ed8; }
.diff.lv4 { background: #fff4df; color: #b45309; }
.diff.lv5 { background: #fdeaea; color: #b42318; }

.diff-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 10px;
  padding: 16px 20px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-left: 6px solid #cbd5e1;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.diff-panel.lv0 { border-left-color: #cbd5e1; }
.diff-panel.lv1 { border-left-color: #16a34a; }
.diff-panel.lv2 { border-left-color: #14b8a6; }
.diff-panel.lv3 { border-left-color: #2563eb; }
.diff-panel.lv4 { border-left-color: #f59e0b; }
.diff-panel.lv5 { border-left-color: #dc2626; }
.diff-main { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.diff-caption { color: var(--muted); font-size: 12px; }
.diff-big { font-size: 26px; font-weight: 700; }
.diff-stars { color: #f59e0b; font-size: 16px; letter-spacing: 2px; }
.diff-score { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.diff-factors {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  color: #46536b;
  font-size: 13px;
}
.diff-factors b { color: var(--text); font-variant-numeric: tabular-nums; }

.status-line {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 0 18px 12px;
}
.status-line b { color: var(--text); }
.chip.bad { background: #fdeaea; color: #b42318; }

tr.inactive { color: #9aa5b5; background: #fafbfd; }
tr.inactive .name { color: #9aa5b5; }

@media (max-width: 700px) {
  .diff-panel { align-items: flex-start; }
  .diff-factors { flex-direction: column; gap: 6px; }
}

/* ---------- 模拟分组 ---------- */
.pool-summary {
  margin-top: 4px;
  color: #5b6b86;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.pool-summary b { color: var(--text); }
.pool-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
  padding: 4px 18px 18px;
}
.pool-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fbfdff;
  overflow: hidden;
}
.pool-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  background: #f3f7fd;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.pool-head b { font-size: 14px; }
.pool-avg { margin-left: auto; color: #5b6b86; font-size: 12px; }
.pool-avg b { color: var(--primary); font-variant-numeric: tabular-nums; }
.pool-list {
  margin: 0;
  padding: 4px 12px;
  list-style: none;
}
.pool-list li {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) auto;
  grid-template-areas:
    "seed name rank"
    "seed org rank";
  column-gap: 8px;
  align-items: center;
  padding: 6px 0;
  border-bottom: 1px dashed #eef2f7;
}
.pool-list li:last-child { border-bottom: none; }
.pool-seed {
  grid-area: seed;
  color: #9aa5b5;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.pool-name {
  grid-area: name;
  color: #23324a;
  font-weight: 600;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pool-org {
  grid-area: org;
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pool-rank { grid-area: rank; }
.pool-rank .rank-mini { margin-left: 0; }
.pool-rank .muted { font-size: 11px; }
.pool-foot {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  padding: 7px 12px;
  background: #f8fafd;
  border-top: 1px solid var(--line);
  color: #7a879c;
  font-size: 11px;
}
.pool-foot b { color: #46536b; }
.pool-foot .pool-warn, .pool-foot .pool-warn b { color: #b45309; }

@media (max-width: 700px) {
  .pool-grid { grid-template-columns: 1fr; padding: 4px 12px 14px; }
}
.pool-panel > .note { margin: 8px 18px 14px; }

/* ---------- 报名群二维码 ---------- */
.qr-panel {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 18px;
  padding: 16px 18px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.qr-img {
  width: 138px;
  height: 138px;
  flex: none;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  object-fit: contain;
}
.qr-body h2 { margin: 0 0 6px; font-size: 16px; }
.qr-body p { margin: 0 0 10px; color: var(--muted); font-size: 13px; }
.qr-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 12px; }
.qr-link { font-weight: 600; color: var(--primary); }
.qr-link:hover { text-decoration: underline; }
.qr-panel.off { gap: 10px; flex-wrap: wrap; font-size: 13px; }
.qr-off { font-weight: 600; color: #b45309; }
@media (max-width: 700px) {
  .qr-panel { align-items: flex-start; gap: 14px; padding: 14px; }
  .qr-img { width: 104px; height: 104px; }
}