/* Piston variant remains available through loading(..., variant='pistons'). */
@import url('/static/css/loading-pistons.css?v=20261028-engine3d-4');

.lmk-loader--ring {
  --lmk-loader-stroke: clamp(2px, calc(var(--lmk-loader-size, 32px) * .085), 4px);
  --lmk-loader-track: #862e871f;
  display: inline-block;
  width: var(--lmk-loader-size, 32px);
  height: var(--lmk-loader-size, 32px);
  aspect-ratio: 1;
}
.lmk-loader--ring.lmk-loader--center { display: block; }
.lmk-loader__ring { display: block; position: absolute; inset: 0; }
.lmk-loader__ring::before,
.lmk-loader__ring::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - var(--lmk-loader-stroke)), #000 calc(100% - var(--lmk-loader-stroke) + .5px));
  mask: radial-gradient(farthest-side, transparent calc(100% - var(--lmk-loader-stroke)), #000 calc(100% - var(--lmk-loader-stroke) + .5px));
}
.lmk-loader__ring::before { background: var(--lmk-loader-track); }
.lmk-loader__ring::after {
  background: conic-gradient(from -40deg, transparent 0deg 35deg, var(--sl-button-start, #602c85) 115deg, var(--sl-button-berry, #862e87) 205deg, var(--sl-button-rose, #a22d62) 275deg, var(--sl-button-end, #aa4937) 325deg, transparent 326deg 360deg);
  animation: lmk-plum-turn .95s linear infinite;
}
html[data-color-scheme="dark"] .lmk-loader--ring { --lmk-loader-track: #dba8e22b; }
.lmk-loader--ring:is(.lmk-loader--inherit, .lmk-loader--on-dark) { --lmk-loader-track: #ffffff38; }
.lmk-loader--ring:is(.lmk-loader--inherit, .lmk-loader--on-dark) .lmk-loader__ring::after {
  background: conic-gradient(from -40deg, transparent 0deg 35deg, currentColor 150deg 325deg, transparent 326deg 360deg);
}
@keyframes lmk-plum-turn { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .lmk-loader__ring::after { animation: none; transform: rotate(-35deg); }
}
@media (forced-colors: active) {
  .lmk-loader__ring::before, .lmk-loader__ring::after { -webkit-mask: none; mask: none; background: none; box-sizing: border-box; }
  .lmk-loader__ring::before { border: 2px solid GrayText; }
  .lmk-loader__ring::after { border: 2px solid transparent; border-top-color: Highlight; border-right-color: Highlight; }
}
