.loading-placeholder { min-width: 110px; padding: 14px; border-radius: 12px; background: #f5f6f8; list-style: none; }
main.is-loading { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 16px; }
.skeleton-block,.skeleton-line { display: block; border-radius: 8px; background: linear-gradient(100deg,#e2e5e9 20%,#f7f8fa 45%,#e2e5e9 70%); background-size: 220% 100%; animation: skeleton-shimmer 1.5s ease-in-out infinite; }
.skeleton-block { height: 90px; margin-bottom: 12px; }
.skeleton-line { height: 12px; margin-top: 9px; }
.skeleton-line.short { width: 58%; }
.load-error { padding: 20px; grid-column: 1 / -1; text-align: center; color: #832326; background: #fff3f3; border-radius: 12px; }
.load-error button { padding: 10px 20px; cursor: pointer; border: 1px solid #734b00; border-radius: 8px; background: #fff; color: #493000; }
button:focus-visible,[role="button"]:focus-visible { outline: 3px solid #2369c8; outline-offset: 3px; }
img[loading="lazy"] { background-color: #f0f1f3; }
[aria-busy="true"] { cursor: progress; }
@keyframes skeleton-shimmer { to { background-position: -220% 0; } }
@media (prefers-reduced-motion: reduce) { .skeleton-block,.skeleton-line { animation: none; } }
@media print { .loading-placeholder,.load-error { display: none !important; } }