.hs-wrap { display: flex; justify-content: center; overflow: auto; padding: 6px; }
.hs-board { position: relative; background: #fff; border-radius: 12px; box-shadow: var(--shadow-sm); width: max-content; }
.hs-board svg { position: absolute; left: 0; top: 0; pointer-events: none; }
.hs-island {
  position: absolute; width: 38px; height: 38px; border-radius: 50%;
  background: var(--surface-2); border: 3px solid var(--ink);
  display: grid; place-items: center; font-weight: 900; font-size: 16px; color: var(--ink);
  transform: translate(-50%, -50%); cursor: pointer; z-index: 2; transition: transform .08s ease;
}
.hs-island.sel { background: var(--sun); transform: translate(-50%, -50%) scale(1.12); }
.hs-island.done { border-color: var(--mint); color: var(--mint); }
.hs-island:active { transform: translate(-50%, -50%) scale(.92); }