.brand-source:not([hidden]) {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #1d6854;
  font-size: .6rem;
  font-weight: 850;
  letter-spacing: .045em;
  line-height: 1;
  white-space: nowrap;
}

.brand-source::before {
  width: 6px;
  height: 6px;
  flex: none;
  border-radius: 50%;
  background: currentColor;
  content: "";
}

.brand-source[data-mode="local"] { color: #805014; }
body.is-night .brand-source[data-mode="online"] { color: #a8ead2; }
body.is-night .brand-source[data-mode="local"] { color: #ffd79a; }
body.is-halloween .brand-source[data-mode="online"] { color: #b8efc8; }
body.is-halloween .brand-source[data-mode="local"] { color: #ffd09a; }