/* Rush ring (js/rush/ring.js) — values from the Walkathon commission's rushonly.css. */
@font-face {
  font-family: "Pink Chicken";
  src: local("Pink Chicken"), local("PinkChicken-Regular"), url("/rush/fonts/PinkChicken-Regular.woff2") format("woff2");
  font-display: block;
}
.rush-ring {
  --clr-white: #fff; --clr-purple: #a371e1; --clr-orange: #ffa100; --clr-yellow: #ffa100; --clr-red: #db5f5d;
  --clr-flashingRed: #ffc5c4; --clr-flashingYellow: #ffedce; --clr-ink: #000;
  --rr-scale: 1;
  position: relative; flex: none;
  width: calc(540px * var(--rr-scale)); height: calc(714px * var(--rr-scale));
  font-family: "Pink Chicken", "Arial Rounded MT Bold", system-ui, sans-serif;
  user-select: none; -webkit-user-select: none;
}
.rush-ring .rr-stage { position: absolute; left: 0; top: 0; width: 540px; height: 714px; transform: scale(var(--rr-scale)); transform-origin: 0 0; }
.rush-ring .rr-disc { position: absolute; left: 141px; top: 291px; width: 347px; height: 347px; border-radius: 50%; background: var(--clr-ink); }
.rush-ring .rr-art { position: absolute; pointer-events: none; }
.rush-ring .rr-svg { position: absolute; left: 90px; top: 163px; overflow: visible; }
.rush-ring .rr-tri { position: absolute; left: 8px; top: 10px; width: 296px; pointer-events: none; display: none; }

.rush-ring .rr-border { fill: none; stroke: var(--clr-ink); stroke-width: 38px; }
.rush-ring .rr-bg { fill: none; stroke: var(--clr-red); stroke-width: 24px; }
.rush-ring .rr-fg {
  fill: none; stroke: var(--clr-white); stroke-width: 24px; stroke-dasharray: 100 100; stroke-dashoffset: 0;
  transition: stroke-dashoffset .3s linear;
}
.rush-ring .rr-label {
  font-size: 64px; fill: var(--clr-white); stroke: var(--clr-ink); stroke-width: 12px;
  stroke-linecap: butt; stroke-linejoin: miter; paint-order: stroke;
}
.rush-ring .rr-text {
  font-size: 96px; fill: var(--clr-white); stroke: var(--clr-ink); stroke-width: 12px;
  stroke-linecap: butt; stroke-linejoin: miter; paint-order: stroke;
}
.rush-ring .rr-text.count { font-size: 128px; }
.rush-ring .rr-text.count.long { font-size: 92px; }
.rush-ring .rr-sub { font-size: 30px; fill: var(--clr-flashingYellow); stroke: var(--clr-ink); stroke-width: 8px; paint-order: stroke; }
.rush-ring .rr-pops { position: absolute; left: 0; top: 0; width: 540px; height: 714px; pointer-events: none; }
.rush-ring .rr-pop {
  position: absolute; left: 510px; top: 300px; display: flex; align-items: center; gap: 6px; white-space: nowrap;
  font-size: 64px; color: var(--clr-yellow);
  text-shadow: 4px 4px 0 var(--clr-ink), -4px 4px 0 var(--clr-ink), 4px -4px 0 var(--clr-ink), -4px -4px 0 var(--clr-ink), 0 5px 0 var(--clr-ink);
  animation: rr-pop 1.7s ease-out forwards;
}

/* MAX: waiting for the next contribution (original .isFlashing) */
.rush-ring.ph-max .rr-bg { animation: rr-flashingCircle 100ms alternate infinite; }
.rush-ring.ph-max .rr-text { animation: rr-flashingTxt 100ms alternate infinite; }
.rush-ring.ph-max .rr-label, .rush-ring.ph-rush .rr-label { animation: rr-flashingLabel 300ms alternate infinite; }
.rush-ring.ph-max .rr-tri, .rush-ring.ph-rush .rr-tri { display: block; }
/* RUSH: countdown (original .isCountingDown) */
.rush-ring.ph-rush .rr-bg { animation: rr-flashingCountdown 500ms alternate infinite; }
/* paused (new) */
.rush-ring.ph-rush.paused .rr-bg { animation: none; stroke: #a7a7b5; }
.rush-ring.ph-rush.paused .rr-label { animation: none; }
.rush-ring.ph-rush.paused .rr-text { fill: #d8d8e0; }
.rush-ring.ph-rush.paused .rr-tri { display: none; }
.rush-ring.ph-off { opacity: .35; }

/* mini (app bar) */
.rush-ring.mini { width: 38px; height: 38px; }
.rush-ring.mini svg { width: 100%; height: 100%; display: block; overflow: visible; }
.rush-ring.mini .rr-back { fill: var(--clr-ink); }
.rush-ring.mini .rr-border { stroke-width: 38px; stroke-linecap: round; }

@keyframes rr-flashingCircle { from { stroke: var(--clr-red); } to { stroke: var(--clr-flashingRed); } }
@keyframes rr-flashingCountdown { from { stroke: var(--clr-yellow); } to { stroke: var(--clr-flashingYellow); } }
@keyframes rr-flashingLabel { from { fill: var(--clr-white); } to { fill: var(--clr-yellow); } }
@keyframes rr-flashingTxt { from { filter: hue-rotate(0deg); } to { filter: hue-rotate(90deg); } }
@keyframes rr-pop {
  0% { opacity: 0; transform: translate(-50%, 30%) scale(.6); }
  14% { opacity: 1; transform: translate(-50%, 0) scale(1.15); }
  100% { opacity: 0; transform: translate(-50%, -160%) scale(1); }
}
@media (prefers-reduced-motion: reduce) { .rush-ring * { animation-duration: 1s !important; } }