:root {
  color-scheme: light;
  --bg: #edf4ef;
  --panel: #fffefa;
  --panel-soft: #f7fbf5;
  --line: #c6d9d0;
  --text: #193d37;
  --muted: #66827a;
  --green: #0b7b6f;
  --cyan: #179bd7;
  --red: #d95d62;
  --gold: #ba8640;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 78% 0, rgba(93, 166, 139, .18), transparent 36%),
    linear-gradient(180deg, #f4f7f0, var(--bg));
  color: var(--text);
  font: 14px/1.45 Inter, "PingFang SC", "Microsoft YaHei", sans-serif;
}

.record-shell {
  width: min(1480px, calc(100% - 28px));
  margin: 0 auto;
  padding: 18px 0 28px;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 6px 16px;
  border-bottom: 1px solid var(--line);
}

.brand {
  color: var(--green);
  font-size: 24px;
  font-weight: 900;
  text-decoration: none;
  letter-spacing: .16em;
}

.brand span {
  margin-left: 10px;
  color: var(--text);
  font-size: 18px;
  letter-spacing: .08em;
}

nav {
  display: flex;
  gap: 18px;
}

nav a {
  color: var(--muted);
  text-decoration: none;
  font-size: 13px;
}

nav a.active,
nav a:hover {
  color: var(--green);
  font-weight: 700;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 16px 0 14px;
  border: 1px solid var(--line);
  background: var(--panel);
}

.summary-grid article {
  min-height: 96px;
  padding: 16px 18px;
  border-right: 1px solid var(--line);
}

.summary-grid article:last-child { border-right: 0; }

small {
  display: block;
  color: #87a098;
  font-weight: 700;
  margin-bottom: 4px;
}

.summary-grid strong {
  display: block;
  color: var(--green);
  font-size: 30px;
  line-height: 1.1;
  letter-spacing: 0;
}

.summary-grid span,
.panel-head span,
#status-text {
  color: var(--muted);
  font-size: 12px;
}

.control-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}

.control-row button {
  height: 34px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f9fcf7;
  color: var(--muted);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.control-row button.active {
  border-color: #8dc6b8;
  background: #e6f2ec;
  color: var(--green);
}

#status-text {
  margin-left: auto;
}

.board {
  display: grid;
  grid-template-columns: minmax(440px, .82fr) minmax(620px, 1.18fr);
  gap: 14px;
}

.panel {
  border: 1px solid var(--line);
  background: var(--panel);
  min-height: 640px;
}

.panel-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid var(--line);
}

.panel-head h1 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
}

.match-list,
.ledger-list {
  display: grid;
}

.watch-row,
.ledger-row {
  display: grid;
  gap: 10px;
  padding: 14px 18px;
  border-bottom: 1px solid #d9e7df;
}

.watch-row {
  grid-template-columns: 76px minmax(0, 1fr) 92px;
  align-items: center;
}

.league {
  color: var(--muted);
  font-size: 12px;
}

.teams {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 800;
}

.teams span {
  color: var(--green);
  text-align: center;
  font-size: 12px;
}

.teams b:last-child { text-align: right; }

.score {
  color: var(--cyan);
  font-size: 22px;
  font-weight: 900;
  text-align: right;
}

.minute {
  color: var(--red);
  font-weight: 800;
}

.kickoff {
  color: var(--text);
  font-size: 16px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.state {
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
}

.ledger-row {
  grid-template-columns: 132px minmax(0, 1fr) 170px 92px;
  align-items: center;
}

.tag {
  width: fit-content;
  min-width: 64px;
  padding: 4px 8px;
  border: 1px solid #acd2c6;
  border-radius: 999px;
  background: #eef7f1;
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
}

.tag.win {
  border-color: #86c7a5;
  background: #e9f7ef;
  color: #138a55;
}

.tag.loss {
  border-color: #e3a2a7;
  background: #fff0f1;
  color: var(--red);
}
.tag.push { color: var(--muted); }

.pick strong {
  display: block;
  color: var(--green);
  font-size: 16px;
}

.pick span,
.market,
.final {
  color: var(--muted);
  font-size: 12px;
}

.amount {
  color: var(--green);
  font-size: 24px;
  font-weight: 900;
  text-align: right;
}

.empty {
  padding: 28px 18px;
  color: var(--muted);
}

@media (max-width: 980px) {
  .summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .summary-grid article:nth-child(2) { border-right: 0; }
  .summary-grid article:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
  .board { grid-template-columns: 1fr; }
  .panel { min-height: auto; }
}

@media (max-width: 680px) {
  .topbar { align-items: flex-start; flex-direction: column; }
  nav { width: 100%; justify-content: space-between; }
  .summary-grid { grid-template-columns: 1fr; }
  .summary-grid article { border-right: 0; border-bottom: 1px solid var(--line); }
  .summary-grid article:last-child { border-bottom: 0; }
  .control-row { flex-wrap: wrap; }
  #status-text { width: 100%; margin-left: 0; }
  .watch-row,
  .ledger-row { grid-template-columns: 1fr; }
  .score,
  .amount { text-align: left; }
}

.final{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.follow-result{font-size:12px;font-weight:900;white-space:nowrap}.follow-result.win{color:#148a58}.follow-result.loss{color:#d44747}.follow-result.push{color:#718078}.follow-result.waiting{color:#8c9993}
.market-secondary{margin-top:4px;color:#789087;font-size:11px}

.stats-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}.stat-card,.daily-panel{border:1px solid var(--line);background:var(--panel);padding:15px 18px}.stat-card h2,.daily-panel h2{margin:0 0 10px;font-size:15px}.stat-values{display:grid;grid-template-columns:1fr auto 1fr auto;align-items:baseline;gap:6px 12px;color:var(--muted);font-size:12px}.stat-values strong{color:var(--green);font-size:24px}.stat-card p{margin:10px 0 0;color:var(--muted);font-size:12px}.daily-panel{margin-bottom:14px}.daily-row{padding:9px 0;border-top:1px solid #d9e7df;color:var(--muted);font-size:13px}.market-line{color:var(--text);font-size:13px;font-weight:700}.leg{font-weight:900}.leg.win{color:#138a55}.leg.loss{color:var(--red)}.leg.push{color:var(--muted)}.leg.waiting{color:#8c9993}@media (max-width:680px){.stats-cards{grid-template-columns:1fr}.stat-values{grid-template-columns:1fr auto}}