/* Loading placeholders (skeleton.js). Neutral tones that sit on white cards and soft boxes. */
.sk { display: block; border-radius: 6px; background: linear-gradient(90deg, #ecebe6 0%, #f6f5f1 45%, #ecebe6 90%); background-size: 240% 100%; animation: sk-shimmer 1.4s ease-in-out infinite; }
.sk-line { height: 12px; margin-top: 6px; }
.sk-line.is-small { height: 10px; }
.sk-title { width: min(360px, 70%); height: 22px; margin: 6px 0 18px; }
.sk-number { width: 52%; height: 28px; margin-top: 6px; }
.sk-value { width: 46%; height: 18px; margin-top: 6px; }
.sk-avatar { width: 42px; height: 42px; border-radius: 50%; flex: none; }
.sk-badge { width: 56px; height: 20px; border-radius: 999px; margin-left: auto; flex: none; }
.sk-block { background: #f6f5f1; border-radius: 10px; padding: 6px 12px 12px; }
.sk-block .sk { background: linear-gradient(90deg, #e6e5e0 0%, #f1f0eb 45%, #e6e5e0 90%); background-size: 240% 100%; }
.sk-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@keyframes sk-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
@media (prefers-reduced-motion: reduce) { .sk { animation: none; } }