/* Native CSS carousel markers for .strip (Chrome 135+). Served statically:
   Lightning CSS in the bundler rejects these pseudo-elements. */
@supports (scroll-marker-group: after) {
  .strip {
    scroll-marker-group: after;
  }

  .strip::scroll-marker-group {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    padding-block: 1rem;
  }

  .strip > *::scroll-marker {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--color-paper-faint);
    transition: background-color 0.2s, scale 0.2s;
  }

  .strip > *::scroll-marker:target-current {
    background: var(--color-phosphor);
    scale: 1.3;
  }
}
