/* Touch accessibility overrides kept separate for easy rollback. */
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

#coverage-nodes > .coverage-node {
  --coverage-marker-color: #85806f;
  --coverage-marker-ring: rgba(255, 255, 255, 0.08);
  --coverage-marker-size: 15px;
  width: 44px;
  height: 44px;
  box-sizing: border-box;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  touch-action: manipulation;
}

#coverage-nodes > .coverage-node[data-tier="pilot"] {
  --coverage-marker-color: #f6b13c;
  --coverage-marker-ring: rgba(246, 177, 60, 0.18);
}

#coverage-nodes > .coverage-node[data-tier="priority"] {
  --coverage-marker-color: #d95d45;
}

#coverage-nodes > .coverage-node::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--coverage-marker-size);
  height: var(--coverage-marker-size);
  box-sizing: border-box;
  border: 3px solid rgba(255, 255, 255, 0.82);
  border-radius: 50%;
  background: var(--coverage-marker-color);
  box-shadow: 0 0 0 5px var(--coverage-marker-ring);
  transform: translate(-50%, -50%);
}

#coverage-nodes > .coverage-node:hover,
#coverage-nodes > .coverage-node:focus-visible,
#coverage-nodes > .coverage-node.is-active {
  --coverage-marker-size: 23px;
}

#coverage-nodes > .coverage-node:focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 2px;
}

#coverage-nodes > .coverage-node:hover::before,
#coverage-nodes > .coverage-node:focus-visible::before,
#coverage-nodes > .coverage-node.is-active::before {
  box-shadow: 0 0 0 8px var(--coverage-marker-ring);
}

#coverage-nodes > .coverage-node span {
  top: calc(50% + 11px);
  left: 50%;
}