/* Aetherix component skeletons v9.00 — page remains interactive while data loads */
:root {
  --ax-skeleton-base: rgba(255, 255, 255, 0.065);
  --ax-skeleton-edge: rgba(255, 255, 255, 0.035);
  --ax-skeleton-shine: rgba(241, 255, 0, 0.11);
}

.is-skeleton-loading [data-skeleton],
.skeleton-block,
.skeleton-line,
.skeleton-circle {
  position: relative;
  overflow: hidden;
  color: transparent !important;
  background:
    linear-gradient(110deg, var(--ax-skeleton-edge), var(--ax-skeleton-base) 42%, var(--ax-skeleton-edge)) !important;
  border-color: transparent !important;
  box-shadow: none !important;
  user-select: none;
}

.is-skeleton-loading [data-skeleton]::after,
.skeleton-block::after,
.skeleton-line::after,
.skeleton-circle::after,
.async-skeleton-card::after,
.async-skeleton-row::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(100deg, transparent 22%, var(--ax-skeleton-shine) 48%, transparent 74%);
  transform: translateX(-115%);
  animation: ax-skeleton-shimmer 1.35s ease-in-out infinite;
}

.is-skeleton-loading [data-skeleton] > * {
  visibility: hidden !important;
}

.is-skeleton-loading [data-skeleton="value"] {
  display: inline-block !important;
  min-width: 72px;
  min-height: 1em;
  border-radius: 9px;
}

.is-skeleton-loading [data-skeleton="text"] {
  display: inline-block !important;
  min-width: 112px;
  min-height: 0.9em;
  border-radius: 7px;
}

.is-skeleton-loading [data-skeleton="pill"] {
  min-width: 88px;
  min-height: 30px;
  border-radius: 999px;
}

.is-skeleton-loading [data-skeleton="avatar"] {
  border-radius: 18px;
  filter: grayscale(1) brightness(0.45);
}

.is-skeleton-loading [data-skeleton="chart"] {
  min-height: 120px;
  border-radius: 18px;
}

.skeleton-line {
  display: block;
  width: 100%;
  height: 12px;
  border-radius: 999px;
}

.skeleton-line.is-short { width: 42%; }
.skeleton-line.is-medium { width: 68%; }
.skeleton-line.is-large { height: 24px; width: 56%; }
.skeleton-line + .skeleton-line { margin-top: 10px; }

.skeleton-circle {
  display: block;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border-radius: 14px;
}

.async-skeleton-card,
.async-skeleton-row {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.075);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.018));
}

.async-skeleton-card {
  min-height: 116px;
  padding: 20px;
  border-radius: 20px;
}

.async-skeleton-row {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 76px;
  padding: 15px 17px;
  border-radius: 16px;
}

.async-skeleton-copy {
  min-width: 0;
  flex: 1;
}

/* Live network components */
.is-skeleton-loading .spark-bars,
.is-skeleton-loading .registration-bars,
.is-skeleton-loading .economy-chart svg,
.is-skeleton-loading .rankings-chart svg {
  opacity: 0.14;
}

.is-skeleton-loading .capacity-row div i,
.is-skeleton-loading .rankings-share i,
.is-skeleton-loading .rd-progress i {
  width: 58% !important;
  background: linear-gradient(90deg, rgba(241, 255, 0, 0.16), rgba(255, 103, 0, 0.14)) !important;
  animation: ax-skeleton-pulse 1.25s ease-in-out infinite;
}

.is-skeleton-loading .leaderboard-row,
.is-skeleton-loading .rankings-table-row {
  opacity: 0.74;
}

.is-skeleton-loading .leaderboard-row .player-avatar,
.is-skeleton-loading .rankings-table-avatar {
  color: transparent;
  background: var(--ax-skeleton-base);
}

.is-skeleton-loading .team-directory-avatar,
.team-online.is-loading,
.is-skeleton-loading .team-review-avatar {
  overflow: hidden;
  background: var(--ax-skeleton-base) !important;
}

.team-online.is-loading {
  color: transparent !important;
  min-width: 84px;
}

.team-online.is-loading::after,
.is-skeleton-loading .team-directory-avatar::after,
.is-skeleton-loading .team-review-avatar::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent, var(--ax-skeleton-shine), transparent);
  transform: translateX(-110%);
  animation: ax-skeleton-shimmer 1.35s ease-in-out infinite;
}

.team-card-meta > div:last-child strong:where(:not([data-loaded])),
.team-latest-reviews.is-skeleton-loading {
  position: relative;
}

@keyframes ax-skeleton-shimmer {
  to { transform: translateX(115%); }
}

@keyframes ax-skeleton-pulse {
  0%, 100% { opacity: 0.34; }
  50% { opacity: 0.9; }
}

@media (prefers-reduced-motion: reduce) {
  .is-skeleton-loading [data-skeleton]::after,
  .skeleton-block::after,
  .skeleton-line::after,
  .skeleton-circle::after,
  .async-skeleton-card::after,
  .async-skeleton-row::after {
    animation: ax-skeleton-pulse 2s ease-in-out infinite;
    transform: none;
  }
}
