:root {
  --bg: #111214;
  --dot-off: #24262b;
  --dot-on: #ff7a1a;
  --gap: 0.35vmin;
}

html, body {
  height: 100%;
  margin: 0;
  background: var(--bg);
}

main {
  display: grid;
  place-items: center;
  height: 100%;
}

#board {
  display: grid;
  grid-template-columns: repeat(var(--cols, 1), 1fr);
  gap: var(--gap);
  width: min(92vw, 900px);
}

#board i {
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--dot-off);
}

#board i.on {
  background: var(--dot-on);
  box-shadow: 0 0 1.2vmin var(--dot-on);
}