/* CoopMate: news, FAQ, pagine legali, notifiche (prefisso content-), RD-7f1. Si carica dal blocco page_css.
   Solo var(--ui-*), nessun colore letterale. */

.content { display: grid; gap: var(--ui-space-5); margin-block: var(--ui-space-6); align-content: start; }
.content > * { margin: 0; min-width: 0; }
.content--narrow { max-width: 46rem; }
.content-head { display: grid; gap: var(--ui-space-2); }
.content-head > * { margin: 0; }
.content-head--bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ui-space-3); }
.content-grid { display: grid; gap: var(--ui-space-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); }
.content-meta { margin: 0; color: var(--ui-ink-muted); font-size: var(--ui-text-sm); }
.content-section { display: grid; gap: var(--ui-space-3); }
.content-section > * { margin: 0; }
.content-prose { line-height: var(--ui-leading-normal); }
.content-prose h2 { margin-block: var(--ui-space-5) var(--ui-space-2); }
.content-prose :where(p, ul, ol) { margin-block: 0 var(--ui-space-3); }
.content-prose :where(ul, ol) { padding-inline-start: var(--ui-space-5); }
.content-prose code { font-family: var(--ui-font-mono, monospace); font-size: .9em; }

/* Liste di giochi e guide (RD-9a) */
.content-ranked { display: grid; gap: var(--ui-space-3); margin: 0; padding: 0; list-style: none; }
.content-ranked__item { display: grid; grid-template-columns: auto minmax(0, 10rem) minmax(0, 1fr); align-items: start; gap: var(--ui-space-3); }
.content-ranked__pos { font-size: var(--ui-text-xl, 1.5rem); font-weight: 800; color: var(--ui-ink-muted); font-variant-numeric: tabular-nums; }
.content-ranked__item img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--ui-radius-sm); }
.content-ranked__body { display: grid; gap: var(--ui-space-2); }
.content-ranked__body > * { margin: 0; }
.content-tags { display: flex; flex-wrap: wrap; gap: var(--ui-space-2); }
.content-links { display: grid; gap: var(--ui-space-2); margin: 0; padding: 0; list-style: none; }
@media (max-width: 40rem) { .content-ranked__item { grid-template-columns: auto minmax(0, 1fr); } .content-ranked__body { grid-column: 1 / -1; } }