:root {
  color-scheme: light dark;
}

html, body {
  background-color: light-dark(var(--user-theme-light-background-colour), var(--user-theme-dark-background-colour));
  color: light-dark(var(--user-theme-light-text-colour), var(--user-theme-dark-text-colour));
}

main {
  background-color: light-dark(var(--user-theme-light-background-colour), var(--user-theme-dark-background-colour));
  color: light-dark(var(--user-theme-light-text-colour), var(--user-theme-dark-text-colour));
}

#contents, #contents header {
  background-color: light-dark(var(--user-theme-light-background-colour), var(--user-theme-dark-background-colour));
  color: light-dark(var(--user-theme-light-text-colour), var(--user-theme-dark-text-colour));
}

.top-bar, .top-bar ul.menu {
  background-color: light-dark(var(--user-theme-light-background-colour), var(--user-theme-dark-background-colour));
  color: light-dark(var(--user-theme-light-text-colour), var(--user-theme-dark-text-colour));
}

thead, tbody, label {
  background-color: light-dark(var(--user-theme-light-background-colour), var(--user-theme-dark-background-colour));
  color: light-dark(var(--user-theme-light-text-colour), var(--user-theme-dark-text-colour));
}

tbody tr:nth-child(even) {
  background-color: light-dark(#F1F1F1, #1E1E1E);
}