/* ---------- skeleton shimmer loaders ---------- */
.skel-wrap { display: flex; flex-direction: column; gap: 12px; }
.skel-card {
  border-radius: var(--radius, 18px);
  background: var(--card, #121217);
  border: 1px solid var(--line, rgba(255, 255, 255, 0.09));
  padding: 18px;
  overflow: hidden;
  position: relative;
}
.skel-line {
  height: 13px;
  border-radius: 7px;
  margin-bottom: 12px;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.05) 25%,
    rgba(255, 255, 255, 0.11) 50%,
    rgba(255, 255, 255, 0.05) 75%
  );
  background-size: 200% 100%;
  animation: skelShimmer 1.4s infinite ease-in-out;
}
.skel-line:last-child { margin-bottom: 0; }
.skel-w40 { width: 40%; }
.skel-w70 { width: 70%; }
.skel-w90 { width: 90%; }
@keyframes skelShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .skel-line { animation: none; }
}