/* Circle geometry. act2-circle-open.css owns travel. */
@media (min-width: 861px) {
  .counters { padding-bottom: var(--circle-list-space, 0px); }
  .counter[data-circle-ready] { position: relative; }
  .counter[data-circle-ready] .counter-list {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
  }
  .counter[data-circle-ready][aria-expanded='true'] .counter-face {
    position: absolute;
    left: 50%;
    top: 50%;
    width: min(260px, 60%);
    text-align: center;
    transform: translate(-50%, -50%);
  }
  .counter[data-circle-ready][aria-expanded='true'] .counter-cue { display: none; }
  .counter[data-circle-ready][aria-expanded='true'] .counter-preview {
    grid-template-rows: 1fr;
    opacity: 1;
  }
  .counter[data-circle-moving] .counter-preview > div { overflow: visible; }
  .counter[data-circle-moving] .counter-preview { position: relative; z-index: 1; }
  .circle-transfer, .circle-turn, .circle-seat, .circle-upright { display: block; }
  .counter[data-circle-ready]::after {
    content: '';
    position: absolute;
    pointer-events: none;
    left: 50%;
    top: 50%;
    width: calc(var(--circle-radius) * 2);
    height: calc(var(--circle-radius) * 2);
    border: 1px solid var(--resurs-hairline);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: opacity var(--resurs-slow) var(--resurs-ease);
  }
  .counter[data-circle-ready][aria-expanded='true']::after { opacity: 1; }
  .circle-transfer, .circle-seat {
    transform: none;
  }
  .counter[aria-expanded='true'] .circle-transfer {
    transform: translate(var(--circle-center-x), var(--circle-center-y));
  }
  .counter[aria-expanded='true'] .circle-seat {
    transform: translate(var(--circle-seat-x), var(--circle-seat-y));
  }
}

@media (min-width: 861px) and (prefers-reduced-motion: reduce) {
  html.circle-open .counter[data-circle-ready]::after,
  html.circle-open .counter .circle-transfer,
  html.circle-open .counter .circle-turn,
  html.circle-open .counter .circle-seat,
  html.circle-open .counter .circle-upright { transition: none; }
}
