:root {
  color-scheme: light;
  --surface-0:#f4f3f0; --surface-1:#fcfcfb; --surface-2:#eceae5; --surface-3:#e3e0d9;
  --border:#dddad2; --text-1:#0b0b0b; --text-2:#52514e; --text-3:#86847d;
  --good:#0ca30c; --critical:#d03b3b; --good-bg:#e7f6e7; --crit-bg:#fbeaea;
  --warning:#fab219; --warn-bg:#fdf3dd; --neutral:#9b9890;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --surface-0:#121211; --surface-1:#1a1a19; --surface-2:#242422; --surface-3:#2c2c29;
    --border:#34342f; --text-1:#fff; --text-2:#c3c2b7; --text-3:#8a887e;
    --good-bg:#12301a; --crit-bg:#351a1a; --warn-bg:#33280d; --neutral:#6d6b64;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --surface-0:#121211; --surface-1:#1a1a19; --surface-2:#242422; --surface-3:#2c2c29;
  --border:#34342f; --text-1:#fff; --text-2:#c3c2b7; --text-3:#8a887e;
  --good-bg:#12301a; --crit-bg:#351a1a; --warn-bg:#33280d; --neutral:#6d6b64;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--surface-0); color:var(--text-1);
  font:14px/1.5 ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased; }
.wrap { max-width:1600px; margin:0 auto; padding:22px 18px 70px; }

header.top { display:flex; flex-wrap:wrap; gap:14px; align-items:flex-end;
  justify-content:space-between; margin-bottom:16px; }
h1 { font-size:23px; margin:0; letter-spacing:-.02em; font-weight:650; }
h1 a { color:inherit; text-decoration:none; }
h1 .d1 { color:var(--good); } h1 .d2 { color:var(--critical); }
.sub { color:var(--text-2); font-size:13px; margin-top:3px; }
nav { display:flex; gap:4px; margin-top:8px; }
nav a { font-size:12.5px; color:var(--text-2); text-decoration:none; padding:4px 10px;
  border-radius:7px; border:1px solid transparent; }
nav a:hover { background:var(--surface-2); }
nav a.on { background:var(--surface-1); border-color:var(--border); color:var(--text-1); font-weight:600; }

.controls { display:flex; gap:7px; align-items:center; flex-wrap:wrap; }
input, button, select { font:inherit; font-size:13px; color:var(--text-1);
  background:var(--surface-1); border:1px solid var(--border); border-radius:8px; padding:7px 10px; }
button { cursor:pointer; } button:hover:not(:disabled) { background:var(--surface-2); }
button:disabled { opacity:.45; cursor:default; }
button.primary { background:var(--good-bg); border-color:var(--good); color:var(--good); font-weight:640; }
button.on { background:var(--good-bg); border-color:var(--good); color:var(--good); font-weight:600; }
button.danger:hover { background:var(--crit-bg); border-color:var(--critical); color:var(--critical); }
select { max-width:420px; }
input[type=search] { min-width:190px; }

.legend { display:flex; flex-wrap:wrap; gap:8px 18px; align-items:center;
  background:var(--surface-1); border:1px solid var(--border); border-radius:10px;
  padding:10px 14px; margin-bottom:14px; font-size:12.5px; color:var(--text-2); }
.legend b { color:var(--text-1); }
.sw { display:inline-flex; align-items:center; gap:5px; font-weight:600; }
.sw.g { color:var(--good); } .sw.r { color:var(--critical); }

.scroll { overflow-x:auto; background:var(--surface-1); border:1px solid var(--border);
  border-radius:12px; }
table { width:100%; border-collapse:collapse; }
thead th { position:sticky; top:0; z-index:2; background:var(--surface-3); text-align:left;
  font-size:10px; text-transform:uppercase; letter-spacing:.07em; color:var(--text-2);
  font-weight:700; padding:9px 10px; white-space:nowrap; border-bottom:1px solid var(--border); }
tbody td { padding:9px 10px; border-bottom:1px solid var(--border); vertical-align:top; }
tbody tr.inns { cursor:pointer; }
tbody tr.inns:hover { background:var(--surface-2); }
tbody tr.first td { border-top:2px solid var(--border); }
.mno { font-weight:700; color:var(--text-3); font-variant-numeric:tabular-nums; white-space:nowrap; }
.fix { font-weight:620; white-space:nowrap; }
.fixdate { color:var(--text-3); font-size:11px; font-weight:400; }
.team { font-weight:700; white-space:nowrap; }
.base { font-variant-numeric:tabular-nums; font-weight:650; white-space:nowrap; }
.basesub { color:var(--text-3); font-size:11px; font-weight:400; }
.list { min-width:290px; line-height:1.85; }
.chip { display:inline-block; background:var(--good-bg); color:var(--good); border-radius:6px;
  padding:1px 7px; margin:0 5px 3px 0; font-size:12.5px; font-weight:560; white-space:nowrap; }
.chip u { text-decoration:none; font-variant-numeric:tabular-nums; opacity:.85; font-weight:640; }
.none { color:var(--text-3); font-style:italic; font-size:12.5px; }
.cnt { font-size:10.5px; color:var(--text-3); font-weight:700; margin-left:2px;
  font-variant-numeric:tabular-nums; }

tr.detail > td { background:var(--surface-2); padding:0; }
.dwrap { padding:12px 14px; display:grid; gap:16px;
  grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); }
.dcol h4 { margin:0 0 7px; font-size:10.5px; text-transform:uppercase; letter-spacing:.07em;
  color:var(--text-3); font-weight:700; }
table.d { width:100%; }
table.d td { padding:3px 7px; border:0; font-size:12.5px; font-variant-numeric:tabular-nums; }
table.d td.n { font-variant-numeric:normal; }
table.d tr.green td.v { color:var(--good); font-weight:640; }
table.d tr.red td.v { color:var(--critical); font-weight:640; }
table.d tr.unrated td, table.d tr.even td { color:var(--text-3); }
table.d td.v { white-space:nowrap; }

/* competitions page */
.grid { display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(380px,1fr)); }
.card { background:var(--surface-1); border:1px solid var(--border); border-radius:12px;
  padding:16px 18px; }
.card h2 { margin:0 0 4px; font-size:15px; font-weight:640; }
.card p.hint { margin:0 0 12px; color:var(--text-2); font-size:12.5px; }
.pill { display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:700;
  padding:2px 8px; border-radius:999px; text-transform:uppercase; letter-spacing:.05em; }
.pill.live { background:var(--good-bg); color:var(--good); }
.pill.completed { background:var(--surface-2); color:var(--text-2); }
.pill.upcoming { background:var(--warn-bg); color:#8a6100; }
:root[data-theme="dark"] .pill.upcoming,
  :root:not([data-theme="light"]) .pill.upcoming { color:var(--warning); }
.pill.mt { background:var(--surface-2); color:var(--text-2); }
.trow { display:flex; align-items:center; gap:12px; padding:11px 0;
  border-bottom:1px solid var(--border); }
.trow:last-child { border-bottom:0; }
.trow .nm { font-weight:600; }
.trow .meta { color:var(--text-3); font-size:11.5px; margin-top:2px; }
.trow .right { margin-left:auto; display:flex; gap:6px; align-items:center; }
.status { font-size:12px; color:var(--text-2); margin-top:8px; min-height:18px; }
.status.err { color:var(--critical); }
.status.ok { color:var(--good); }
.spin { display:inline-block; width:11px; height:11px; border:2px solid var(--border);
  border-top-color:var(--good); border-radius:50%; animation:sp .7s linear infinite;
  vertical-align:-1px; margin-right:5px; }
@keyframes sp { to { transform:rotate(360deg); } }
.empty { padding:26px; text-align:center; color:var(--text-3); }
footer { color:var(--text-3); font-size:12px; margin-top:20px; line-height:1.7; }
footer code { background:var(--surface-2); padding:1px 5px; border-radius:4px; font-size:11px; }