body {
  font-family: Verdana, Geneva, sans-serif;
  font-size: 13px;
  background: #ffffff;
  color: #000000;
  margin: 12px;
  max-width: 1100px;
}
h1 { font-size: 18px; margin: 0 0 2px 0; }
h2 { font-size: 14px; margin: 18px 0 4px 0; }
hr { border: 0; border-top: 1px solid #999; margin: 8px 0; }
a { color: #0000ee; }
a:visited { color: #551a8b; }

.nav { font-size: 12px; margin-bottom: 8px; }
.sub { color: #555; font-size: 11px; margin: 0 0 8px 0; }

table { border-collapse: collapse; font-size: 12px; margin-top: 6px; }
th, td { border: 1px solid #999; padding: 2px 6px; text-align: left; }
th { background: #dddddd; font-weight: bold; cursor: pointer; white-space: nowrap; }
th.nosort { cursor: default; }
tr:nth-child(even) td { background: #f4f4f4; }
td.num, th.num { text-align: right; font-family: "Courier New", monospace; }

.state { padding: 6px 0; font-size: 12px; }
.err { color: #aa0000; }
.err code { font-size: 11px; color: #555; word-break: break-all; }
.stale { color: #555; font-size: 11px; }

.live { color: #aa0000; font-weight: bold; }
.jeopardy { color: #b36b00; }
.muted { color: #777; }
.controls { margin: 8px 0; font-size: 12px; }
.controls label { margin-right: 10px; }

svg.dist { display: block; margin: 6px 0 2px 0; max-width: 100%; }
svg.dist .axis, svg.dist .tick { stroke: #999; stroke-width: 1; }
svg.dist .tlab { font-family: Verdana, sans-serif; font-size: 9px; fill: #555; }
svg.dist polyline { fill: none; stroke-width: 1.5; }
.legend { font-size: 11px; color: #555; margin: 2px 0 4px 0; }

.c0, svg.dist .c0 { color: #0000cc; stroke: #0000cc; }
.c1, svg.dist .c1 { color: #cc0000; stroke: #cc0000; }
.c2, svg.dist .c2 { color: #007700; stroke: #007700; }
.c3, svg.dist .c3 { color: #b36b00; stroke: #b36b00; }
.c4, svg.dist .c4 { color: #7700aa; stroke: #7700aa; }
.c5, svg.dist .c5 { color: #008899; stroke: #008899; }
.c6, svg.dist .c6 { color: #aa0077; stroke: #aa0077; }
.c7, svg.dist .c7 { color: #555555; stroke: #555555; }
td.best { background: #eef6ee; }
.h2h { font-size: 13px; margin: 4px 0; }
details { margin: 6px 0; font-size: 12px; }
details summary { cursor: pointer; color: #0000ee; }

tr.grp th { background: #cccccc; font-size: 11px; }
td.stat { color: #444; }
/* Shrink to the text instead of spanning the column, but never past the page rule above
   it — inline-block sizes to content, max-width caps it at the container, which is the
   same 1100px content box the <hr> spans. A long list of players wraps there. */
.warn-box {
  display: inline-block;
  max-width: 100%;
  border: 1px solid #b36b00;
  background: #fff8e8;
  padding: 5px 8px;
  font-size: 12px;
  margin: 6px 0;
}
