/* Základ: farby, reset, typografia, tlačidlá. */
:root {
  --red: #c81b21;
  --bg: #f7f6f4;
  --text: #1c1c1c;
  --muted: #5c5c5c;
  --line: #ccc;
  --panel: #fff;
  --top: #fff;
}

html[data-theme="black"] {
  --bg: #060708;
  --text: #f4f1ed;
  --muted: rgba(244, 241, 237, .66);
  --line: rgba(255, 255, 255, .15);
  --panel: #101114;
  --top: #060708;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  height: 100%;
  background: var(--bg);
  color: var(--text);
  font: 14px/1.4 "Segoe UI", sans-serif;
}

a { color: var(--red); }
a[aria-current="page"] { font-weight: 650; text-decoration: none; }

button, input {
  font: inherit;
  color: inherit;
  background: var(--panel);
  border: 1px solid var(--line);
  padding: 4px 8px;
}

button { cursor: pointer; }
button:hover, a:hover { border-color: var(--red); }

h1 { font-size: 18px; font-weight: 650; margin: 0 0 8px; }
h2 { font-size: 14px; font-weight: 650; margin: 16px 0 4px; }