/* CoopMate: giochi gratis (prefisso gv-), GP-3. Si carica dal blocco page_css di giveaways/index.twig.
   Solo var(--ui-*), nessun colore letterale. Budget della pagina: 4 KB gzip (lo controlla tests/twig_smoke.php). */
.gv-top { padding-block: var(--ui-space-5); border-bottom: 1px solid var(--ui-border); background: color-mix(in srgb, var(--ui-accent) 8%, var(--ui-surface)); }
.gv-top h1 { margin-bottom: var(--ui-space-2); }
.gv-top .ui-lead { margin-bottom: var(--ui-space-4); max-width: 65ch; }
.gv-results { padding-block: var(--ui-space-4) var(--ui-space-5); }
.gv-chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ui-space-2); margin: 0 0 var(--ui-space-3); padding: 0; list-style: none; }
.gv-count { margin: 0 0 var(--ui-space-3); color: var(--ui-ink-muted); font-weight: 700; }
.gv-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ui-space-3); margin: 0 0 var(--ui-space-5); padding: 0; list-style: none; }
.gv-grid > li { display: grid; grid-template-columns: minmax(0, 1fr); }
.gv-card { display: flex; flex-direction: column; gap: var(--ui-space-2); }
.gv-card .ui-card__title { margin: 0; overflow-wrap: anywhere; }
.gv-card__platforms, .gv-card__ends { margin: 0; color: var(--ui-ink-muted); }
.gv-card__ends { font-weight: 700; }
.gv-card__ends s { font-weight: 400; }
.gv-card__how summary { cursor: pointer; min-height: 2.75rem; display: flex; align-items: center; font-weight: 700; }
.gv-card__how p { margin: 0 0 var(--ui-space-2); color: var(--ui-ink-muted); }
.gv-card__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ui-space-3); margin-top: auto; padding-top: var(--ui-space-2); }
.gv-card__game { display: inline-flex; align-items: center; min-height: 2.75rem; font-weight: 700; }
.gv-more__title { margin-bottom: var(--ui-space-3); font-size: var(--ui-text-xl); }
.gv-note { max-width: 65ch; margin: var(--ui-space-4) 0 0; color: var(--ui-ink-muted); font-size: var(--ui-text-sm); }
@media (min-width: 640px) { .gv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ui-space-4); } }
@media (min-width: 900px) { .gv-top { padding-block: var(--ui-space-6); } .gv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .gv-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.gv-grid.gv-grid--few { grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }