.community-card[data-state="loading"] { min-height: 350px; }
.review-loading { display: block; padding: 10px 8px; }
.review-status { display: block; color: var(--sub); font-size: 14px; margin: 14px 0; }
.review-skeleton { display: block; height: 14px; width: 85%; margin: 13px 0; background: #e8dfd1; border-radius: 7px; animation: review-pulse 1.5s ease-in-out infinite; }
.review-skeleton:first-child { width: 55%; height: 38px; border-radius: 20px; margin-bottom: 26px; }
.review-skeleton:nth-child(3) { width: 65%; }
.review-skeleton:last-child { width: 100%; height: 160px; margin-top: 24px; }
.community-card .review-loading { display: none; }
.community-card[data-state="loading"] .review-loading,
.community-card[data-state="failed"] .review-loading { display: block; }
.community-card[data-state="loading"] blockquote { display: none; }
.community-card[data-state="loading"] iframe,
.community-card[data-state="failed"] iframe { visibility: hidden; position: absolute !important; pointer-events: none; }
.community-card[data-state="failed"] .review-skeleton { display: none; }
.community-card[data-state="ready"] .review-loading { display: none; }
@keyframes review-pulse { 50% { opacity: .45; } }
@media (prefers-reduced-motion: reduce) { .review-skeleton { animation: none; } }

.review-fallback { display: none; color: var(--green); text-underline-offset: 4px; }
.community-card[data-state="failed"] .review-fallback { display: inline-block; }
.community-card[data-state="failed"] blockquote { display: none; }
#reviews-more { padding: 13px 24px; border: 1px solid var(--green); border-radius: 999px; color: var(--green); font: inherit; font-weight: 700; background: transparent; cursor: pointer; }
#reviews-more[hidden], #reviews-end[hidden] { display: none; }

/* Independent columns keep short posts from leaving empty grid rows. */
.community-grid { display: block; columns: 3; column-gap: 24px; }
.community-card { display: inline-block; vertical-align: top; width: 100%; box-sizing: border-box; break-inside: avoid; margin: 0 0 24px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.community-card[data-state="loading"] { min-height: 330px; position: relative; }
.community-card[data-state="loading"] blockquote { display: block; opacity: 0; height: 1px; overflow: hidden; padding: 0; }
.review-loading { box-sizing: border-box; padding: 20px; border-radius: 16px; background: rgba(255,255,255,.52); overflow: hidden; }
.review-skeleton { position: relative; overflow: hidden; background: #e9e4da; animation: none; }
.review-skeleton::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 15%, rgba(255,255,255,.8) 50%, transparent 85%); transform: translateX(-100%); animation: review-shimmer 1.8s ease-in-out infinite; }
.community-card[data-state="ready"] { animation: review-reveal .35s ease-out both; }
@keyframes review-shimmer { to { transform: translateX(100%); } }
@keyframes review-reveal { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 1100px) and (min-width: 701px) { .community-grid { columns: 2; max-width: none; } }
@media (max-width: 700px) { .community-grid { columns: 1; max-width: 550px; margin-inline: auto; } }
@media (prefers-reduced-motion: reduce) { .review-skeleton::after, .community-card[data-state="ready"] { animation: none; } }
/* Keep reading order left to right while packing each column independently. */
.community-grid { display: grid; columns: auto; grid-template-columns: repeat(3,minmax(0,1fr)); grid-auto-rows: 8px; gap: 24px; align-items: start; }
.community-card { display: block; margin: 0; align-self: start; }
@media (max-width: 1100px) and (min-width: 701px) { .community-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 700px) { .community-grid { display: block; } .community-card { margin-bottom: 24px; } }