/* The one pause / play button for autoplay blocks that run longer than 5 s (W18, Oct 26 PM; WCAG 2.2.2).
   It is the same disc the product heroes use (.hxa-pause): 32px ink disc, white icon, 44px touch area, gold focus ring.
   Created by public/v2/shared/hai-pause.js (HAIPause.after) in a right-aligned row under the block's visual.
   Used by: partials/pm-journey (stage view), pm-score, pm-graph, pm-fit and public/v2/kairos/kairos.js (rep moments).
   Brand tokens only: ink #110A33, white, gold #FFC61E, violet #341D99. */
html body .hpause-row { display: flex; justify-content: flex-end; margin: 12px auto 0; }
html body .hpause { position: relative; display: grid; place-items: center; flex: none; width: 32px; height: 32px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: #110A33; color: #fff; cursor: pointer; opacity: 1; transition: opacity 160ms cubic-bezier(.23, 1, .32, 1), background-color 160ms cubic-bezier(.23, 1, .32, 1), transform 160ms cubic-bezier(.23, 1, .32, 1); } /* ANIM-P6 Oct 27: solid ink (the .72 / .85 disc rendered about #5F5A75 and read as disabled) */
html body .hpause::after { content: ""; position: absolute; inset: -6px; } /* 44px hit area */
@media (hover: hover) and (pointer: fine) { html body .hpause:hover { background: #341D99; } } /* ANIM-P6: the base is already solid ink, so hover shifts to violet to stay visible */
html body .hpause:active { transform: scale(.96); }
html body .hpause:focus-visible { opacity: 1; outline: 2px solid #FFC61E; outline-offset: 2px; box-shadow: 0 0 0 4px #110A33; }
html body .hpause svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
html body .hpause .i-play { display: none; fill: currentColor; }
html body .hpause[aria-pressed="true"] .i-play { display: block; }
html body .hpause[aria-pressed="true"] .i-pause { display: none; }
@media (max-width: 767px) {
  html body .hpause { width: 40px; height: 40px; }
  html body .hpause::after { inset: -2px; }
}
@media (prefers-reduced-motion: reduce) { html body .hpause { transition: none; } }
