/* core/gs7-core.css */
/* ==========================================================================
   GS7 Blocks – CORE: token + primitive comuni a tutti i blocchi
   --------------------------------------------------------------------------
   REGOLA: i blocchi (gs7-blocks/blocks/<nome>/block.css) contengono SOLO
   layout (griglie, colonne, spaziature). Tipografia, colori, linee, badge,
   card e testate vivono QUI e solo qui. Se una cosa grafica va cambiata
   ovunque, si cambia in questo file.

   Prefisso classi: gsb-  (GameSource Blocks)
   Prefisso variabili: --gsb-

   Scala tipografica (6 gradini, nessun altro valore ammesso nei blocchi):
     display  hero della home / del blocco di apertura
     lead     articolo principale di una fascia (recensione, guida, video)
     title    card standard
     row      righe di lista e card piccole
     meta     data, autore, "vedi tutte", chip
     kicker   etichetta di categoria in maiuscoletto
   ========================================================================== */

/* .gsb = token + reset + font; .gsb-tokens = SOLO i token (per pagine intere, es. body.gs7-article, senza toccare il resto) */
.gsb, .gsb-tokens {
	/* ---- colori: dalla Global Palette di Kadence (chiaro/scuro automatici) ---- */
	--gsb-accent: var(--gs7-accent, var(--global-palette-highlight, #f04737));
	--gsb-text: var(--global-palette3, #1a202c);
	--gsb-text-2: var(--global-palette4, #2d3748);
	--gsb-muted: var(--global-palette5, #4a5568);
	--gsb-faint: var(--global-palette6, #718096);
	--gsb-bg: var(--global-palette9, #ffffff);
	--gsb-line: color-mix(in srgb, var(--gsb-text) 14%, transparent);
	--gsb-line-strong: color-mix(in srgb, var(--gsb-text) 28%, transparent);
	--gsb-panel: color-mix(in srgb, var(--gsb-text) 5%, transparent);
	--gsb-panel-2: color-mix(in srgb, var(--gsb-text) 9%, transparent);

	/* colori di sezione (stessi nomi dell'header gs7) */
	--gsb-sec-videogiochi: var(--gs7-sec-videogiochi, var(--gsb-accent));
	--gsb-sec-tech: var(--gs7-sec-tech, #27a364);
	--gsb-sec-movies: var(--gs7-sec-movies, #f5333f);
	--gsb-sec-nerd: var(--gs7-sec-nerd, #0876a7);
	--gsb-sec: var(--gsb-accent);

	/* semafori voto e live */
	--gsb-good: #27a364;
	--gsb-mid: #e8a317;
	--gsb-bad: #de004a;
	--gsb-live: #de004a;

	/* ---- tipografia ---- */
	--gsb-font-head: var(--global-heading-font-family, Poppins, sans-serif);
	--gsb-font-body: var(--global-body-font-family, Roboto, sans-serif);
	--gsb-fs-display: 1.6rem;
	--gsb-fs-lead: 1.3rem;
	--gsb-fs-title: 1.05rem;
	--gsb-fs-row: 0.95rem;
	--gsb-fs-meta: 0.78rem;
	--gsb-fs-kicker: 0.7rem;
	--gsb-lh-tight: 1.2;
	--gsb-lh-title: 1.3;
	--gsb-lh-body: 1.5;

	/* ---- misure ---- */
	--gsb-radius: 0.5rem;
	--gsb-gap: 1.25rem;
	--gsb-gap-l: 2rem;
	--gsb-block-space: 2.75rem;
	--gsb-motion: 200ms;
}
.gsb {
	font-family: var(--gsb-font-body);
	color: var(--gsb-text);
	line-height: var(--gsb-lh-body);
}
@media (min-width: 1024px) {
	.gsb, .gsb-tokens { --gsb-fs-display: 1.9rem; }
}
@media (min-width: 1200px) {
	.gsb, .gsb-tokens { --gsb-fs-display: 2.1rem; --gsb-fs-lead: 1.4rem; }
}
@supports not (color: color-mix(in srgb, red 10%, blue)) {
	.gsb, .gsb-tokens {
		--gsb-line: var(--global-palette7, #e6e6e6);
		--gsb-line-strong: var(--global-palette6, #767676);
		--gsb-panel: var(--global-palette8, #f4f4f4);
		--gsb-panel-2: var(--global-palette7, #e6e6e6);
	}
}

/* reset locale: dentro .entry-content-wrap Kadence e il child stilano p, h2, h3, ul */
.gsb *, .gsb *::before, .gsb *::after { box-sizing: border-box; }
.gsb h2, .gsb h3, .gsb h4, .gsb p, .gsb ul, .gsb ol, .gsb figure { margin: 0; padding: 0; }
.gsb ul, .gsb ol { list-style: none; }
.gsb a { color: inherit; text-decoration: none; }
.gsb img { display: block; max-width: 100%; height: auto; }
.gsb button { font: inherit; }

/* colore di sezione: classe gsb-sec-<sezione> sul blocco, sul singolo articolo o sul body (pagina articolo) */
.gsb .gsb-sec-videogiochi, .gsb-tokens.gsb-sec-videogiochi { --gsb-sec: var(--gsb-sec-videogiochi); }
.gsb .gsb-sec-tech,        .gsb-tokens.gsb-sec-tech        { --gsb-sec: var(--gsb-sec-tech); }
.gsb .gsb-sec-movies,      .gsb-tokens.gsb-sec-movies      { --gsb-sec: var(--gsb-sec-movies); }
.gsb .gsb-sec-nerd,        .gsb-tokens.gsb-sec-nerd        { --gsb-sec: var(--gsb-sec-nerd); }

/* --------------------------------------------------------------------------
   1. TESTO: i 6 gradini. Ogni titolo di card usa una di queste classi.
   -------------------------------------------------------------------------- */
.gsb-t-display, .gsb-t-lead, .gsb-t-title, .gsb-t-row {
	font-family: var(--gsb-font-head);
	color: var(--gsb-text);
	overflow-wrap: anywhere;
}
.gsb-t-display { font-size: var(--gsb-fs-display); font-weight: 800; line-height: var(--gsb-lh-tight); letter-spacing: -0.015em; }
.gsb-t-lead    { font-size: var(--gsb-fs-lead);    font-weight: 800; line-height: var(--gsb-lh-tight); letter-spacing: -0.01em; }
.gsb-t-title   { font-size: var(--gsb-fs-title);   font-weight: 700; line-height: var(--gsb-lh-title); }
.gsb-t-title--lg { font-size: calc(var(--gsb-fs-title) * 1.12); } /* stesso gradino, un filo più grande (fiume principale) */
.gsb-t-row     { font-size: var(--gsb-fs-row);     font-weight: 600; line-height: var(--gsb-lh-title); }
.gsb-t-meta    { font-family: var(--gsb-font-body); font-size: var(--gsb-fs-meta); font-weight: 500; line-height: 1.35; color: var(--gsb-muted); }
.gsb-t-kicker  { font-family: var(--gsb-font-head); font-size: var(--gsb-fs-kicker); font-weight: 800; line-height: 1.2; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gsb-sec); }

/* link nei titoli: MAI sottolineati, al passaggio prendono il colore di sezione */
.gsb-t-display a, .gsb-t-lead a, .gsb-t-title a, .gsb-t-row a { transition: color var(--gsb-motion) ease; }
.gsb-t-display a:hover, .gsb-t-lead a:hover, .gsb-t-title a:hover, .gsb-t-row a:hover { color: var(--gsb-sec); }

/* sommario: sempre corpo, mai Poppins; clamp a 2 o 3 righe */
.gsb-excerpt { font-size: 0.95rem; line-height: var(--gsb-lh-body); color: var(--gsb-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.gsb-excerpt--2 { -webkit-line-clamp: 2; }
.gsb-t-display + .gsb-excerpt { font-size: 1.02rem; }

/* clamp titoli */
.gsb-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gsb-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* --------------------------------------------------------------------------
   2. TESTATA DI BLOCCO (una sola; variante --side per la colonna laterale)
   -------------------------------------------------------------------------- */
.gsb-head {
	position: relative;
	display: flex;
	align-items: baseline;
	gap: 0.75rem;
	padding-bottom: 0.6rem;
	margin-bottom: var(--gsb-gap);
	border-bottom: 2px solid var(--gsb-line);
}
.gsb-head::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 3.5rem; height: 2px; background: var(--gsb-sec); }
.gsb-head__title { font-family: var(--gsb-font-head); font-size: var(--gsb-fs-lead); font-weight: 800; letter-spacing: -0.01em; line-height: 1.2; color: var(--gsb-text); }
.gsb-head__sub { font-size: var(--gsb-fs-meta); color: var(--gsb-faint); }
.gsb-head__more { margin-left: auto; font-size: var(--gsb-fs-meta); font-weight: 700; color: var(--gsb-sec); white-space: nowrap; }
.gsb-head__more:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.gsb-head--side { padding-bottom: 0.55rem; margin-bottom: 0.5rem; }
.gsb-head--side .gsb-head__title { font-size: var(--gsb-fs-kicker); letter-spacing: 0.12em; text-transform: uppercase; }
.gsb-head--sec .gsb-head__title { color: var(--gsb-sec); }
.gsb-head--live .gsb-head__title::before { content: ""; display: inline-block; width: 0.55rem; height: 0.55rem; margin: 0 0.5rem 0.1rem 0; border-radius: 50%; background: var(--gsb-live); animation: gsb-pulse 1.6s infinite; }

/* --------------------------------------------------------------------------
   3. MEDIA: immagine con proporzione fissa, angoli, zoom leggero al passaggio
   -------------------------------------------------------------------------- */
.gsb-media { display: block; position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--gsb-radius); background: var(--gsb-panel); }
.gsb-media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--gsb-motion) ease; }
.gsb-media--4x3 { aspect-ratio: 4 / 3; }
.gsb-media--3x4 { aspect-ratio: 3 / 4; }
.gsb-media--1x1 { aspect-ratio: 1; }
.gsb-media--3x2 { aspect-ratio: 3 / 2; }
.gsb-media--21x9 { aspect-ratio: 21 / 9; }
.gsb-card:hover .gsb-media img, .gsb-media:hover img { transform: scale(1.03); }
.gsb-media__ph { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--gsb-font-head); font-weight: 800; font-size: 1.4rem; color: var(--gsb-faint); background: var(--gsb-panel-2); }

/* --------------------------------------------------------------------------
   4. CARD: UNA sola card, 4 varianti. Struttura: [media] + body(kicker, titolo, excerpt, meta)
      hero   foto grande, titolo display, sommario 2 righe
      card   foto 16:9, titolo title
      row    testo a sinistra, miniatura a destra (fiume)   / --thumb-left
      mini   senza foto: numero o voto + titolo row
   -------------------------------------------------------------------------- */
.gsb-card { position: relative; display: flex; flex-direction: column; gap: 0.7rem; min-width: 0; }
li > .gsb-card { height: 100%; } /* nelle griglie (ul > li) la card riempie la cella */
.gsb-card__body { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; flex: 1; }
/* riga in cima al corpo: kicker + firma (elementi a altezza fissa stanno sopra il titolo, così le griglie restano allineate) */
.gsb-card__top { display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem 0.6rem; min-height: 1.6rem; }
.gsb-card__top .gsb-byline { gap: 0.4rem; }
.gsb-card__top .gsb-t-kicker + .gsb-byline::before { content: "·"; color: var(--gsb-faint); margin-right: 0.2rem; }
/* piede della card: usato solo dove serve allineare (schede); resta in basso nella cella */
.gsb-card__foot { margin-top: auto; padding-top: 0.2rem; display: flex; flex-direction: column; gap: 0.4rem; }
/* slot titolo: riserva N righe al titolo così ciò che segue è allineato tra le card della stessa fila */
.gsb-t-slot-2 { min-height: calc(2 * var(--gsb-lh-title) * 1em); }
.gsb-t-slot-3 { min-height: calc(3 * var(--gsb-lh-title) * 1em); }
/* tutta la card è cliccabile: il link del titolo si "estende" sull'intera card; kicker e link secondari restano sopra */
.gsb-card__body .gsb-t-display > a::after, .gsb-card__body .gsb-t-lead > a::after, .gsb-card__body .gsb-t-title > a::after, .gsb-card__body .gsb-t-row > a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.gsb-card .gsb-t-kicker, .gsb-card__foot a, .gsb-card__top a { position: relative; z-index: 2; }
.gsb-card .gsb-meta a, .gsb-card .gsb-byline a { position: relative; z-index: 2; } /* la firma porta alla pagina autore */
.gsb-meta__author:hover, .gsb-byline__name:hover { color: var(--gsb-sec); text-decoration: underline; text-underline-offset: 0.2em; }
.gsb-card:hover .gsb-t-display a, .gsb-card:hover .gsb-t-lead a, .gsb-card:hover .gsb-t-title a, .gsb-card:hover .gsb-t-row a { color: var(--gsb-sec); }
.gsb-card--hero { gap: 0.9rem; }
.gsb-card--hero .gsb-card__body { gap: 0.5rem; }
.gsb-card--row { display: grid; grid-template-columns: minmax(0, 1fr) 9.5rem; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--gsb-line); }
.gsb-card--row .gsb-media { align-self: start; order: 2; } /* markup: media prima del body; nella riga la foto sta a destra */
.gsb-card--row.gsb-card--thumb-left { grid-template-columns: 6.5rem minmax(0, 1fr); }
.gsb-card--row.gsb-card--thumb-left .gsb-media { order: -1; }
.gsb-card--mini { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.7rem; align-items: center; padding: 0.6rem 0; border-bottom: 1px solid var(--gsb-line); }
.gsb-card--mini .gsb-card__body { gap: 0.2rem; }
.gsb-card--mini.gsb-card--plain { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 560px) {
	.gsb-card--row { grid-template-columns: minmax(0, 1fr) 6.5rem; padding: 0.8rem 0; }
	.gsb-card--row.gsb-card--thumb-left { grid-template-columns: 5.5rem minmax(0, 1fr); }
}
/* griglie allineate riga per riga (subgrid): media, kicker, titolo, meta… di ogni card stanno sulle stesse righe
   della griglia, quindi i piedi sono allineati e i "buchi" compaiono solo se un titolo vicino va a capo */
@media (min-width: 560px) {
	.gsb-grid-align { row-gap: 0.4rem; }
	.gsb-grid-align > li { display: contents; }
	.gsb-grid-align > li > .gsb-card { display: grid; grid-template-rows: subgrid; grid-row: span var(--gsb-rows, 4); gap: 0; }
	.gsb-grid-align > li > .gsb-card > .gsb-media { margin-bottom: 0.3rem; }
	.gsb-grid-align > li > .gsb-card > .gsb-card__body { display: contents; }
	.gsb-grid-align > li > .gsb-card > .gsb-card__body > :last-child { margin-bottom: 1rem; }
	.gsb-grid-align > li > .gsb-card > .gsb-card__body > .gsb-card__foot { margin-top: 0; }
}
/* due card a riga affiancate (blocchi con pochi elementi: pezzi scelti, poche recensioni); su telefono una sotto l'altra */
.gsb-rows2 { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--gsb-gap-l); }
@media (min-width: 900px) { .gsb-rows2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* card in lista sui telefoni (le griglie di card) */
@media (max-width: 559.98px) {
	.gsb-card--list-sm { display: grid; grid-template-columns: 38% minmax(0, 1fr); gap: 0.85rem; align-items: start; }
	.gsb-card--list-sm .gsb-t-slot-2, .gsb-card--list-sm .gsb-t-slot-3 { min-height: 0; }
}

/* --------------------------------------------------------------------------
   5. META: riga data · autore · piattaforme; byline con avatar
   -------------------------------------------------------------------------- */
.gsb-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem 0.5rem; font-size: var(--gsb-fs-meta); font-weight: 500; color: var(--gsb-faint); }
.gsb-meta > * + *::before { content: "·"; margin-right: 0.5rem; color: var(--gsb-faint); }
.gsb-meta time { font-variant-numeric: tabular-nums; }
.gsb-meta strong { font-weight: 600; color: var(--gsb-muted); }
.gsb-byline { display: flex; align-items: center; gap: 0.5rem; font-size: var(--gsb-fs-meta); font-weight: 600; color: var(--gsb-muted); }
.gsb-avatar { width: 1.6rem; height: 1.6rem; border-radius: 50%; object-fit: cover; }
/* avatar senza foto (gs7-author): iniziali su un fondo di tinta fissa per persona; dimensione da --gs7-av o dalla classe */
.gs7-avatar--initials { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: var(--gs7-av, 2.5rem); height: var(--gs7-av, 2.5rem); border-radius: 50%; background: hsl(var(--gs7-av-h, 210) 38% 42%); color: #fff; font-family: var(--gsb-font-head, sans-serif); font-size: calc(var(--gs7-av, 2.5rem) * 0.38); font-weight: 800; line-height: 1; letter-spacing: 0.02em; text-transform: uppercase; user-select: none; }
.gsb-avatar.gs7-avatar--initials { width: 1.6rem; height: 1.6rem; font-size: 0.62rem; }

/* numero d'ordine (classifiche) */
.gsb-num { font-family: var(--gsb-font-head); font-size: 1.5rem; font-weight: 800; line-height: 1; color: var(--gsb-sec); min-width: 1.6rem; text-align: center; font-variant-numeric: tabular-nums; }

/* --------------------------------------------------------------------------
   6. BADGE: voto, video, live, piattaforme, chip filtro, tag "Aggiornato"
   -------------------------------------------------------------------------- */
.gsb-score { display: inline-grid; place-items: center; min-width: 2.4rem; height: 2.4rem; padding: 0 0.3rem; border-radius: 50%; font-family: var(--gsb-font-head); font-weight: 800; font-size: 1rem; line-height: 1; color: #fff; background: var(--gsb-good); font-variant-numeric: tabular-nums; }
.gsb-score--mid { background: var(--gsb-mid); }
.gsb-score--bad { background: var(--gsb-bad); }
.gsb-score--l { min-width: 3.4rem; height: 3.4rem; font-size: 1.4rem; }
.gsb-score--s { min-width: 1.9rem; height: 1.9rem; font-size: 0.8rem; }
.gsb-media .gsb-score { position: absolute; right: 0.6rem; bottom: 0.6rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35); }

.gsb-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 3.2rem; height: 3.2rem; border-radius: 50%; display: grid; place-items: center; background: rgba(0, 0, 0, 0.62); color: #fff; }
.gsb-play::before { content: ""; width: 0; height: 0; border-style: solid; border-width: 0.55rem 0 0.55rem 0.95rem; border-color: transparent transparent transparent #fff; margin-left: 0.2rem; }
.gsb-play--s { width: 1.8rem; height: 1.8rem; }
.gsb-play--s::before { border-width: 0.32rem 0 0.32rem 0.55rem; margin-left: 0.1rem; }

.gsb-badge { display: inline-flex; align-items: center; gap: 0.35rem; height: 1.45rem; padding: 0 0.55rem; border-radius: 0.3rem; font-family: var(--gsb-font-head); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #fff; background: var(--gsb-sec); }
.gsb-badge--live { background: var(--gsb-live); }
.gsb-badge--live::before { content: ""; width: 0.45rem; height: 0.45rem; border-radius: 50%; background: #fff; animation: gsb-pulse-w 1.6s infinite; }
.gsb-badge--ghost { color: var(--gsb-sec); background: color-mix(in srgb, var(--gsb-sec) 12%, transparent); }
.gsb-media .gsb-badge { position: absolute; left: 0.6rem; top: 0.6rem; }

.gsb-plats { display: flex; flex-wrap: wrap; gap: 0.25rem; }
.gsb-plat { display: inline-block; padding: 0.15rem 0.45rem; border-radius: 0.3rem; font-family: var(--gsb-font-head); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.04em; color: var(--gsb-muted); background: var(--gsb-panel-2); }

/* la linea è un'ombra interna (non un bordo): così la sottolineatura della linguetta attiva, disegnata dentro il suo
   riquadro, la copre esattamente anche se il contenitore scorre in orizzontale sui telefoni */
.gsb-chips { display: flex; align-items: stretch; gap: 0 1.35rem; margin: calc(-1 * var(--gsb-gap)) 0 var(--gsb-gap); box-shadow: inset 0 -2px 0 var(--gsb-line); overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.gsb-chips::-webkit-scrollbar { display: none; }
.gsb-chip { position: relative; flex-shrink: 0; display: inline-flex; align-items: center; height: 2.4rem; padding: 0; border: 0; background: transparent; color: var(--gsb-muted); font-family: var(--gsb-font-head); font-size: 0.9rem; font-weight: 700; letter-spacing: 0; cursor: pointer; transition: color var(--gsb-motion); }
.gsb-chip::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: transparent; transition: background var(--gsb-motion); }
.gsb-chip:hover { color: var(--gsb-text); }
.gsb-chip.is-on { color: var(--gsb-text); }
.gsb-chip.is-on::after { background: var(--gsb-sec); }
.gsb-chip:focus-visible { outline: 2px solid var(--gsb-sec); outline-offset: -2px; }
/* i filtri rapidi proseguono la linea della testata: stessa linea (2px), stesso colore, stessa famiglia dei titoli */
.gsb-head:has(+ .gsb-chips) { border-bottom-color: transparent; }
.gsb-head:has(+ .gsb-chips)::after { display: none; }

/* --------------------------------------------------------------------------
   7. PULSANTI, PANNELLI, SPAZI PUBBLICITARI, PRO/CONTRO
   -------------------------------------------------------------------------- */
.gsb-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; height: 2.6rem; padding: 0 1.4rem; border-radius: 999px; border: 2px solid var(--gsb-accent); background: transparent; color: var(--gsb-accent); font-family: var(--gsb-font-head); font-weight: 700; font-size: 0.9rem; cursor: pointer; transition: background var(--gsb-motion), color var(--gsb-motion); }
.gsb-btn:hover { background: var(--gsb-accent); color: #fff; }
.gsb-btn--solid { background: var(--gsb-accent); color: #fff; }
.gsb-btn--solid:hover { filter: brightness(1.08); }
.gsb-btn[disabled] { opacity: 0.6; cursor: wait; }
.gsb-btn--ghost { width: 100%; height: 2.9rem; border-radius: var(--gsb-radius); border: 1px solid var(--gsb-line-strong); color: var(--gsb-text); font-size: 0.85rem; letter-spacing: 0.02em; }
.gsb-btn--ghost::after { content: ""; width: 0.5rem; height: 0.5rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.gsb-btn--ghost:hover { background: var(--gsb-panel); color: var(--gsb-text); border-color: var(--gsb-line-strong); }
.gsb-more { margin-top: 1rem; }

.gsb-panel { padding: 1.25rem; border-radius: var(--gsb-radius); background: var(--gsb-panel); }
.gsb-panel__title { font-family: var(--gsb-font-head); font-size: var(--gsb-fs-title); font-weight: 800; }
.gsb-panel p { font-size: 0.9rem; color: var(--gsb-muted); margin: 0.35rem 0 0.8rem; }

.gsb-ad { display: grid; place-items: center; min-height: 6rem; border-radius: var(--gsb-radius); border: 1px dashed var(--gsb-line-strong); color: var(--gsb-faint); font-size: var(--gsb-fs-meta); }
.gsb-ad:empty { display: none; }

.gsb-procon { display: flex; flex-direction: column; gap: 0.3rem; margin: 0; padding: 0; list-style: none; font-size: 0.88rem; color: var(--gsb-muted); }
.gsb-procon li { padding-left: 1.1rem; position: relative; }
.gsb-procon li::before { position: absolute; left: 0; font-weight: 800; }
.gsb-procon__pro::before { content: "+"; color: var(--gsb-good); }
.gsb-procon__con::before { content: "−"; color: var(--gsb-bad); }

/* prosa: testo scorrevole dentro un blocco (es. la descrizione della scheda gioco); corpo, mai Poppins */
.gsb-prose { font-family: var(--gsb-font-body); font-size: 1.0625rem; line-height: 1.7; color: var(--gsb-text); }
.gsb-prose > * + * { margin-top: 1em; }
.gsb-prose p { margin: 0; text-align: left; text-wrap: pretty; }
.gsb-prose h3, .gsb-prose h4 { font-family: var(--gsb-font-head); font-size: 1.15rem; font-weight: 700; line-height: 1.3; margin: 1.5em 0 0; }
.gsb-prose h3 + *, .gsb-prose h4 + * { margin-top: 0.5em; }
.gsb-prose ul, .gsb-prose ol { padding-left: 1.4em; }
.gsb-prose ul { list-style: disc; }
.gsb-prose ol { list-style: decimal; }
.gsb-prose li + li { margin-top: 0.4em; }
.gsb-prose a { color: var(--gsb-sec); text-decoration: underline; text-underline-offset: 0.15em; text-decoration-thickness: 1px; }
.gsb-prose a:hover { text-decoration-thickness: 2px; }
.gsb-prose img { border-radius: var(--gsb-radius); }
.gsb-prose blockquote { margin: 1.5em 0 0; padding: 0.25rem 0 0.25rem 1.25rem; border-left: 4px solid var(--gsb-sec); font-family: var(--gsb-font-head); font-size: 1.15rem; font-weight: 600; line-height: 1.4; }

/* --------------------------------------------------------------------------
   8. REGIONI (sopra · centrale | laterale · sotto), INVOLUCRO DI BLOCCO, LINEE
   Desktop: griglia a due colonne. Mobile: tutti i blocchi in un'unica colonna
   nell'ORDINE DI LETTURA deciso dal motore (--gsb-order sul blocco).
   -------------------------------------------------------------------------- */
.gsb-region { min-width: 0; }
.gsb-region + .gsb-cols, .gsb-cols + .gsb-region, .gsb-region + .gsb-region { margin-top: var(--gsb-block-space); }
.gsb-cols { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--gsb-gap-l); align-items: start; }
.gsb-block { margin-top: var(--gsb-block-space); min-width: 0; }
.gsb-block:first-child { margin-top: 0; }
.gsb-region--main .gsb-block--hero + .gsb-block--cards { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--gsb-line); }
.gsb-region--main .gsb-block--ad { margin-top: 1.5rem; }
.gsb-region--main .gsb-block--ad + .gsb-block { margin-top: 1.5rem; }
.gsb-region--side .gsb-block { margin-top: var(--gsb-gap-l); }
.gsb-region--side .gsb-block:first-child { margin-top: 0; }
@media (min-width: 1024px) {
	.gsb-cols { grid-template-columns: minmax(0, 1fr) 320px; }
	.gsb-cols--single { grid-template-columns: minmax(0, 1fr); }
	.gsb-region--side { align-self: stretch; border-left: 1px solid var(--gsb-line); padding-left: var(--gsb-gap-l); display: flex; flex-direction: column; }
	/* opzione "fisso da qui" del pannello: il contenitore resta visibile mentre si scorre il resto della colonna centrale */
	.gsb-region--side .gsb-sticky { position: sticky; top: var(--gsb-sticky-top, 5.5rem); display: flex; flex-direction: column; gap: var(--gsb-gap-l); }
	.gsb-region--side .gsb-sticky .gsb-block { margin-top: 0; }
}
@media (min-width: 1024px) and (max-width: 1199.98px) { .gsb-cols { grid-template-columns: minmax(0, 1fr) 280px; gap: 1.5rem; } }
@media (max-width: 1023.98px) {
	.gsb-scope { display: flex; flex-direction: column; gap: var(--gsb-block-space); }
	.gsb-scope .gsb-region, .gsb-scope .gsb-cols, .gsb-scope .gsb-sticky { display: contents; }
	.gsb-scope .gsb-block, .gsb-scope .gsb-region--side .gsb-block, .gsb-scope .gsb-region--main .gsb-block--hero + .gsb-block--cards, .gsb-scope .gsb-region--main .gsb-block--ad { margin-top: 0; order: var(--gsb-order, 0); }
	.gsb-scope .gsb-region--main .gsb-block--hero + .gsb-block--cards { padding-top: 0; border-top: 0; }
}
/* copia "su mobile prima" di un blocco di colonna: la copia (.gsb-early) si vede solo su schermi stretti,
   l'originale nella colonna (.gsb-block--early) solo su schermi larghi. Nessun contenuto doppio visibile.
   La classe gsb-block--early la mette il motore SOLO se la copia è stata stampata (gsb_render_early): in home e nelle aree,
   dove la copia non c'è, l'originale resta visibile e su mobile prende il posto dato dall'ordine di lettura. */
.gsb-early { display: none; }
@media (max-width: 1024.98px) {
	.gsb-early { display: flex; flex-direction: column; gap: var(--gsb-gap); }
	.gsb-early .gsb-block { margin-top: 0; }
	.gsb-region--side .gsb-block--early { display: none; }
}
/* regione stampata da sola (es. laterale e fasce di un articolo): nessuna colonna, nessun bordo */
.gsb-region--solo { display: flex; flex-direction: column; gap: var(--gsb-gap-l); }
.gsb-region--solo .gsb-block { margin-top: 0; }
.gsb-region--solo.gsb-region--bottom { gap: var(--gsb-block-space); }
.gsb-region--solo.gsb-region--rail { gap: 1.25rem; }
.gsb-region--rail .gsb-sticky { position: sticky; top: var(--gsb-sticky-top, 6rem); display: flex; flex-direction: column; gap: 1.25rem; }
.gsb-region--rail .gsb-sticky .gsb-block { margin-top: 0; }
@media (min-width: 1024px) { .gsb-region--solo.gsb-region--side { border-left: 0; padding-left: 0; height: 100%; } }
.gsb-rule { border: 0; border-top: 1px solid var(--gsb-line); margin: 0; }
.gsb-list { margin: 0; padding: 0; list-style: none; }
.gsb-list > li { border-bottom: 1px solid var(--gsb-line); }
.gsb-list > li:last-child { border-bottom: 0; }

@keyframes gsb-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--gsb-live) 55%, transparent); } 70% { box-shadow: 0 0 0 0.45rem transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
@keyframes gsb-pulse-w { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
@media (prefers-reduced-motion: reduce) { .gsb * { transition: none !important; animation: none !important; } }

/* gioco/block.css */
/* scheda gioco: colonna laterale */
.gsb-gioco__top { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 1rem; align-items: start; }
.gsb-gioco__body { display: flex; flex-direction: column; gap: 0.45rem; min-width: 0; }
.gsb-gioco__score { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.15rem; }
.gsb-gioco__facts { display: grid; grid-template-columns: auto 1fr; gap: 0.3rem 0.75rem; margin: 1rem 0 0; padding-top: 0.75rem; border-top: 1px solid var(--gsb-line); font-size: var(--gsb-fs-meta); }
.gsb-gioco__facts dt { color: var(--gsb-faint); }
.gsb-gioco__facts dd { margin: 0; color: var(--gsb-text); font-weight: 600; }
.gsb-gioco__links { margin: 0.9rem 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 0.4rem; font-family: var(--gsb-font-head); font-size: var(--gsb-fs-meta); font-weight: 700; }
.gsb-gioco__links a { color: var(--gsb-sec); text-decoration: none; }
.gsb-gioco__links a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
/* striscia compatta (copia "su mobile prima", visibile solo su schermi stretti) */
/* il contenitore è un div (non un link): il link sta sul titolo e si estende a tutta la striscia con ::after, contenuto da position:relative */
.gsb-gioco-strip { position: relative; display: grid; grid-template-columns: 3.25rem minmax(0, 1fr) auto; gap: 0.85rem; align-items: center; padding: 0.7rem 0.85rem; border: 1px solid var(--gsb-line); border-radius: var(--gsb-radius); color: inherit; background: var(--gsb-panel); }
.gsb-gioco-strip__link { color: inherit; text-decoration: none; }
.gsb-gioco-strip__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.gsb-gioco-strip__cover { display: block; aspect-ratio: 3 / 4; border-radius: 0.3rem; overflow: hidden; background: var(--gsb-panel-2); }
.gsb-gioco-strip__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gsb-gioco-strip__body { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }

/* ultime/block.css */
.gsb-ultime .gsb-card--row { padding: 0.6rem 0; border-bottom: 0; }

/* correlati/block.css */
.gsb-correlati__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gsb-gap); }
@media (min-width: 1024px) { .gsb-correlati__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .gsb-correlati__grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 559.98px) { .gsb-correlati__grid { grid-template-columns: 1fr; } }

/* fiume/block.css */
.gsb-river { min-width: 0; }
.gsb-river__list { display: flex; flex-direction: column; }
.gsb-river.is-loading .gsb-river__list { opacity: 0.55; }
.gsb-river__ad .gsb-ad { margin: 0.75rem 0; }
.gsb-river__empty { padding: 1rem 0; }

/* gs7-article/gs7-article.css */
/* ==========================================================================
   GS7 – Pagina articolo v2 (prefisso gs7a-). Entra nel CSS unico di gs7-blocks e usa
   i token/le primitive di gs7-blocks/core/gs7-core.css (gsb-*).

   Principi (vedi prove/articolo/STUDIO-UX.md):
   - niente scatole: la pagina è la superficie, gli spazi e le linee separano
   - testata centrata a tutta larghezza → colonne sotto la testata → fasce sotto
   - griglia dell'articolo: binario sinistro (condivisione, voto, indice) + testo che riempie la colonna
   - una scala di spazi: 0.75 · 1.25 · 2 · 3 · 4rem
   ========================================================================== */
/* offset sotto l'header FISSO durante lo scorrimento = eventuale barra admin/avviso (--gs7-top-offset, dal JS dell'header)
   + altezza dell'header compatto (--gs7-header-compact-h, dal CSS dell'header) + respiro. Nessuna misura in JS:
   quando l'header è esteso si è in cima alla pagina e nulla è ancora "fisso". */
body.gs7-article { --gs7a-sticky-top: calc(var(--gs7-top-offset, 0px) + var(--gs7-header-compact-h, 59px) + 1.5rem); }
html:has(body.gs7-article) { scroll-behavior: smooth; } /* i link dell'indice scorrono in modo morbido fino ai titoli (scroll-margin-top) */
@media (prefers-reduced-motion: reduce) { html:has(body.gs7-article) { scroll-behavior: auto; } }
body.gs7-article { --gs7a-side: 320px; --gs7a-rail: 8.5rem; --gs7a-body-size: 1.125rem; --gs7a-body-lh: 1.7; --gs7a-s1: 0.75rem; --gs7a-s2: 1.25rem; --gs7a-s3: 2rem; --gs7a-s4: 3rem; --gs7a-s5: 4rem; }

/* ---- niente scatole: la pagina è la superficie. Superficie = sfondo della pagina (default) oppure colore dell'header (filtro gs7_article_surface) ---- */
body.gs7-article--surface-header, body.gs7-article--surface-header #inner-wrap, body.gs7-article--surface-header #wrapper { background-color: var(--global-palette9); }
body.gs7-article .content-area { margin-top: 0; }
body.gs7-article .content-container.site-container { background: transparent; } /* il padding laterale resta quello di Kadence: sotto la larghezza massima è l'unico margine dal bordo dello schermo */
/* Kadence su schermi stretti fa sbordare il box dell'articolo con margini negativi (per portarlo a filo schermo):
   senza box non ha senso e taglia il testo → margini a zero a ogni larghezza */
body.gs7-article .single-entry.content-bg { background: transparent; box-shadow: none; border: 0; border-radius: 0; margin-left: 0; margin-right: 0; }
body.gs7-article .single-entry .entry-content-wrap { padding: 0; }
/* tutta la pagina eredita i token (body.gsb-tokens); le parti proprie del modulo hanno anche i reset (.gsb) */
body.gs7-article .gs7a-tail, body.gs7-article .gs7a-rail, body.gs7-article .gs7a-verdict { font-family: var(--gsb-font-body); line-height: var(--gsb-lh-body); }
@media screen and (min-width: 1025px) {
	body.gs7-article.has-sidebar .content-container { grid-template-columns: minmax(0, 1fr) var(--gs7a-side); grid-gap: var(--gs7a-s4); }
}

/* ---- barra di avanzamento della lettura ---- */
/* dentro l'header (caso normale): assoluta sul suo bordo inferiore, lo segue mentre cambia altezza */
.gs7-header .gs7a-progress { position: absolute; left: 0; right: 0; top: auto; bottom: -4px; width: auto; height: 4px; z-index: 1; pointer-events: none; background: color-mix(in srgb, var(--gsb-text, #888) 12%, transparent); }
/* fallback senza header gs7 (o header vecchio): fissa in cima alla finestra */
body > .gs7a-progress { position: fixed; left: 0; top: var(--gs7-top-offset, 0px); width: 100%; height: 4px; z-index: 99990; pointer-events: none; background: color-mix(in srgb, var(--gsb-text, #888) 12%, transparent); }
.gs7a-progress span { display: block; height: 100%; width: 0; background: var(--gsb-sec, var(--gsb-accent, #f04737)); box-shadow: 0 0 8px color-mix(in srgb, var(--gsb-sec, var(--gsb-accent, #f04737)) 60%, transparent); transition: width 80ms linear; }
@media (prefers-reduced-motion: reduce) { .gs7a-progress span { transition: none; } }

/* ---- testata ---- */
.gs7a-head-wrap { padding-top: var(--gs7a-s4); }
.gs7a-ad-top { margin-bottom: var(--gs7a-s3); }
.gs7a-ad-top .gsb-ad:empty { display: none; }
.gs7a-head { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--gs7a-s2); padding-bottom: var(--gs7a-s3); margin-bottom: var(--gs7a-s4); border-bottom: 1px solid var(--gsb-line); }
.gs7a-head > * { max-width: 60rem; }
.gs7a-crumbs { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.35rem; font-size: var(--gsb-fs-meta); color: var(--gsb-faint); margin: 0; }
.gs7a-crumbs a { color: inherit; text-decoration: none; }
.gs7a-crumbs a:hover { color: var(--gsb-text); }
.gs7a-crumbs__sep { opacity: 0.6; }
.gs7a-head__kicker { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.35rem 1rem; margin-top: -0.25rem; }
.gs7a-head__kicker .gsb-t-kicker { font-size: 0.8rem; }
.gs7a-head__kicker .gsb-t-kicker--muted { color: var(--gsb-faint); }
.gs7a-title.entry-title { font-family: var(--gsb-font-head); font-size: clamp(1.9rem, 1.1rem + 2.6vw, 3.1rem); font-weight: 800; line-height: 1.08; letter-spacing: -0.025em; margin: 0; color: var(--gsb-text); overflow-wrap: anywhere; text-wrap: balance; }
.gs7a-sub { font-family: var(--gsb-font-body); font-size: clamp(1.1rem, 1rem + 0.5vw, 1.35rem); line-height: 1.5; color: var(--gsb-muted); max-width: 48rem; margin: 0; text-wrap: pretty; }
.gs7a-byline { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.5rem 0.9rem; font-size: var(--gsb-fs-meta); color: var(--gsb-muted); }
.gs7a-byline__author { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 600; color: var(--gsb-text); text-decoration: none; }
.gs7a-byline__author img { width: 2.1rem; height: 2.1rem; border-radius: 50%; }
.gs7a-byline__sep { color: var(--gsb-faint); }
/* condivisione: un solo componente in tre posti (firma, binario, fine articolo).
   Sul binario (desktop) cerchi sobri; sotto 1200px, dove il binario non c'è, i pulsanti della firma prendono i colori dei servizi
   e una misura comoda per il dito; in fondo all'articolo pillole con etichetta su ogni schermo. */
.gs7a-share { display: inline-flex; flex-wrap: wrap; gap: 0.45rem; align-items: center; }
.gs7a-share__btn { display: inline-grid; grid-auto-flow: column; align-items: center; justify-content: center; gap: 0.45rem; width: 2.25rem; height: 2.25rem; padding: 0; border-radius: 50%; border: 1px solid var(--gsb-line-strong); background: transparent; color: var(--gsb-text); font: inherit; cursor: pointer; text-decoration: none; transition: background var(--gsb-motion), border-color var(--gsb-motion), color var(--gsb-motion), opacity var(--gsb-motion); -webkit-tap-highlight-color: transparent; }
.gs7a-share__btn:hover { background: var(--gsb-text); border-color: var(--gsb-text); color: var(--gsb-bg); }
.gs7a-share__btn.is-done { background: var(--gsb-good); border-color: var(--gsb-good); color: #fff; }
.gs7a-share__ico { display: contents; }
.gs7a-share__ico--share, .gs7a-share__btn--native .gs7a-share__ico--link { display: none; }
.gs7a-share__btn--native .gs7a-share__ico--share { display: contents; }
.gs7a-share__txt { display: none; }
/* colori dei servizi (riconoscibili a colpo d'occhio): sempre in fondo all'articolo, nella firma solo sotto 1200px */
.gs7a-share--end .gs7a-share__btn--x { background: var(--gsb-text); border-color: var(--gsb-text); color: var(--gsb-bg); }
.gs7a-share--end .gs7a-share__btn--facebook { background: #1877f2; border-color: #1877f2; color: #fff; }
.gs7a-share--end .gs7a-share__btn--whatsapp { background: #25d366; border-color: #25d366; color: #fff; }
.gs7a-share--end .gs7a-share__btn:not(.gs7a-share__btn--copy):hover { opacity: 0.85; }
/* fine articolo: pillole con etichetta */
.gs7a-share-end { display: flex; flex-direction: column; gap: 0.75rem; margin-top: var(--gs7a-s4); padding-top: var(--gs7a-s3); border-top: 1px solid var(--gsb-line); }
.gs7a-share--end { gap: 0.6rem; }
.gs7a-share--end .gs7a-share__btn { width: auto; height: 2.75rem; padding: 0 1.1rem 0 0.9rem; border-radius: 999px; font-family: var(--gsb-font-head); font-size: 0.86rem; font-weight: 700; letter-spacing: 0.01em; }
.gs7a-share--end .gs7a-share__txt { display: inline; white-space: nowrap; }
.gs7a-byline .gs7a-share { margin-left: 0.5rem; }
@media (max-width: 1199.98px) {
	/* niente binario: la firma è l'unico punto di condivisione in alto → pulsanti da 44px (misura minima per il dito) e colori dei servizi */
	.gs7a-byline .gs7a-share { flex-basis: 100%; justify-content: center; margin-left: 0; margin-top: 0.15rem; gap: 0.6rem; }
	.gs7a-byline .gs7a-share__btn { width: 2.75rem; height: 2.75rem; }
	.gs7a-byline .gs7a-share__btn svg { width: 20px; height: 20px; }
	.gs7a-byline .gs7a-share__btn--x { background: var(--gsb-text); border-color: var(--gsb-text); color: var(--gsb-bg); }
	.gs7a-byline .gs7a-share__btn--facebook { background: #1877f2; border-color: #1877f2; color: #fff; }
	.gs7a-byline .gs7a-share__btn--whatsapp { background: #25d366; border-color: #25d366; color: #fff; }
	.gs7a-byline .gs7a-share__btn:not(.gs7a-share__btn--copy):hover { opacity: 0.85; }
}
.gs7a-head__extra { width: 100%; max-width: 48rem; font-size: var(--gsb-fs-meta); color: var(--gsb-muted); text-align: left; }
.gs7a-head__extra .gs-review-disclosure { margin: 0 !important; padding: 0.6rem 0.9rem !important; font-size: inherit !important; line-height: 1.45; }
.gs7a-head__extra .gs-review-disclosure p { margin: 0; }

/* ---- immagine principale: a tutta colonna ---- */
.gs7a-hero { margin: 0 0 var(--gs7a-s3); }
.gs7a-hero img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--gsb-radius, 0.5rem); display: block; }
.gs7a-hero figcaption { font-size: var(--gsb-fs-meta); color: var(--gsb-faint); margin-top: var(--gs7a-s1); }

/* ---- griglia dell'articolo: binario + testo ---- */
.gs7a-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--gs7a-s3); align-items: stretch; }
.gs7a-grid > * { min-width: 0; }
.gs7a-rail { display: none; }
@media (min-width: 1200px) {
	.gs7a-grid { grid-template-columns: var(--gs7a-rail) minmax(0, 1fr); }
	.gs7a-grid--no-rail { grid-template-columns: minmax(0, 1fr); }
	.gs7a-rail { display: block; min-width: 0; --gsb-sticky-top: var(--gs7a-sticky-top); }
	/* su desktop largo condivisione e voto stanno nel binario: la firma non li ripete SOLO se il pannello ha quei blocchi (classi body) */
	body.gs7-article--rail-condividi .gs7a-byline .gs7a-share { display: none; }
	body.gs7-article--rail-voto .gs7a-byline__score { display: none; }
}
/* binario: i blocchi del pannello (regione "rail") */
/* la regione riempie tutta l'altezza della colonna (la griglia allunga .gs7a-rail): senza questo il contenitore
   sticky è alto quanto il suo contenuto e non ha spazio in cui "restare fermo" */
.gs7a-rail .gsb-region--rail { gap: var(--gs7a-s2); height: 100%; }
.gs7a-rail .gsb-block + .gsb-block .gs7a-rail__block, .gs7a-rail .gsb-block + .gsb-block .gs7a-toc { padding-top: var(--gs7a-s2); border-top: 1px solid var(--gsb-line); }
.gs7a-rail .gsb-block:first-child .gs7a-rail__block { padding-top: 0; border-top: 0; }
/* voto nella firma (solo sotto 1200px): pillola tinta per fascia che porta al verdetto */
.gs7a-byline__score { --gs7a-band: var(--gsb-good); display: inline-flex; align-items: center; gap: 0.35rem; height: 1.7rem; padding: 0 0.7rem; border-radius: 999px; background: color-mix(in srgb, var(--gs7a-band) 14%, transparent); border: 1px solid color-mix(in srgb, var(--gs7a-band) 40%, transparent); color: var(--gsb-text); font-family: var(--gsb-font-head); font-weight: 800; text-decoration: none; }
.gs7a-byline__score span { font-size: 0.68rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--gs7a-band); }
.gs7a-byline__score--mid { --gs7a-band: var(--gsb-mid); }
.gs7a-byline__score--bad { --gs7a-band: var(--gsb-bad); }
/* copia anticipata per mobile (scheda gioco) e indice richiudibile: solo su schermi stretti */
.gs7a-early-wrap { display: none; }
.gs7a-toc-mobile { display: none; }
@media (max-width: 1024.98px) { .gs7a-early-wrap { display: block; margin: 0 0 var(--gs7a-s2); } }
@media (max-width: 1199.98px) {
	.gs7a-toc-mobile { display: block; margin: 0 0 var(--gs7a-s2); border: 1px solid var(--gsb-line); border-radius: var(--gsb-radius, 0.5rem); padding: 0 1rem; }
	.gs7a-toc-mobile summary { cursor: pointer; padding: 0.75rem 0; font-family: var(--gsb-font-head); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gsb-muted); list-style: none; display: flex; justify-content: space-between; align-items: center; }
	.gs7a-toc-mobile summary::-webkit-details-marker { display: none; }
	.gs7a-toc-mobile summary::after { content: ""; width: 0.5rem; height: 0.5rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform var(--gsb-motion); }
	.gs7a-toc-mobile[open] summary::after { transform: rotate(-135deg); }
	.gs7a-toc-mobile ol { margin: 0; padding: 0 0 0.9rem 1.2rem; display: flex; flex-direction: column; gap: 0.45rem; font-size: 0.95rem; }
	.gs7a-toc-mobile a { color: var(--gsb-text); text-decoration: none; }
}
/* binario: blocchi con etichetta, separati da una linea */
.gs7a-rail__label { display: block; font-family: var(--gsb-font-head); font-size: 0.64rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gsb-faint); margin-bottom: 0.55rem; }
.gs7a-rail__block { padding-top: var(--gs7a-s2); border-top: 1px solid var(--gsb-line); }
.gs7a-rail__block:first-child { padding-top: 0; border-top: 0; }
.gs7a-rail__score { display: flex; flex-direction: column; align-items: flex-start; gap: 0.35rem; padding: var(--gs7a-s2); margin: 0 0 0.25rem; border-radius: var(--gsb-radius, 0.5rem); text-decoration: none; color: var(--gsb-text); background: color-mix(in srgb, var(--gs7a-band, var(--gsb-good)) 12%, transparent); border: 1px solid color-mix(in srgb, var(--gs7a-band, var(--gsb-good)) 35%, transparent); transition: background var(--gsb-motion); }
.gs7a-rail__score:hover { background: color-mix(in srgb, var(--gs7a-band, var(--gsb-good)) 20%, transparent); }
.gs7a-rail__score .gs7a-rail__label { margin-bottom: 0; }
.gs7a-rail__score .gsb-score { min-width: 3.4rem; height: 3.4rem; font-size: 1.45rem; }
.gs7a-rail__word { font-family: var(--gsb-font-head); font-size: 0.78rem; font-weight: 800; color: var(--gs7a-band, var(--gsb-good)); }
.gs7a-rail__score--good { --gs7a-band: var(--gsb-good); }
.gs7a-rail__score--mid { --gs7a-band: var(--gsb-mid); }
.gs7a-rail__score--bad { --gs7a-band: var(--gsb-bad); }
.gs7a-share--rail { gap: 0.4rem; }
.gs7a-toc ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.45rem; }
.gs7a-toc a { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: 0.78rem; line-height: 1.35; color: var(--gsb-muted); text-decoration: none; padding-left: 0.6rem; border-left: 2px solid transparent; }
.gs7a-toc a:hover, .gs7a-toc a.is-current { color: var(--gsb-text); border-left-color: var(--gsb-sec, var(--gsb-accent)); }

/* ---- corpo: riempie la colonna, allineato a sinistra ---- */
.gs7a-body { min-width: 0; }
.gs7a-body .entry-content { font-family: var(--gsb-font-body); font-size: var(--gs7a-body-size); line-height: var(--gs7a-body-lh); color: var(--gsb-text); text-align: left; }
.gs7a-body .entry-content p, .gs7a-body .entry-content li, .gs7a-body p { text-align: left !important; text-wrap: pretty; } /* !important: il vecchio style.css giustifica ogni p dentro .entry-content-wrap */
.gs7a-body .entry-content > * + * { margin-top: 1.15em; }
.gs7a-body .entry-content p { margin: 0; }
.gs7a-body .entry-content h2 { font-family: var(--gsb-font-head); font-size: 1.5rem; font-weight: 800; line-height: 1.25; letter-spacing: -0.015em; margin: 1.8em 0 0; scroll-margin-top: var(--gs7a-sticky-top); text-wrap: balance; }
.gs7a-body .entry-content h2 + * { margin-top: 0.6em; }
.gs7a-body .entry-content h3 { font-family: var(--gsb-font-head); font-size: 1.2rem; font-weight: 700; line-height: 1.3; margin: 1.5em 0 0; scroll-margin-top: var(--gs7a-sticky-top); }
.gs7a-body .entry-content h3 + * { margin-top: 0.5em; }
.gs7a-body .entry-content a { color: var(--gsb-sec, var(--gsb-accent)); text-decoration: underline; text-underline-offset: 0.15em; text-decoration-thickness: 1px; }
.gs7a-body .entry-content a:hover { text-decoration-thickness: 2px; }
.gs7a-body .entry-content ul, .gs7a-body .entry-content ol { padding-left: 1.4em; margin-bottom: 0; }
.gs7a-body .entry-content li + li { margin-top: 0.4em; }
.gs7a-body .entry-content blockquote { margin: 1.75em 0 0; padding: 0.25rem 0 0.25rem 1.25rem; border-left: 4px solid var(--gsb-sec, var(--gsb-accent)); font-family: var(--gsb-font-head); font-size: 1.3rem; font-weight: 600; line-height: 1.4; color: var(--gsb-text); }
.gs7a-body .entry-content img { height: auto; max-width: 100%; border-radius: var(--gsb-radius, 0.5rem); }
.gs7a-body .entry-content > figure, .gs7a-body .entry-content > .wp-caption, .gs7a-body .entry-content > .wp-block-image { margin-top: 1.75em; }
.gs7a-body .entry-content > figure + *, .gs7a-body .entry-content > .wp-caption + *, .gs7a-body .entry-content > .wp-block-image + * { margin-top: 1.75em; }
.gs7a-body .entry-content .wp-caption { width: 100% !important; max-width: 100%; margin-bottom: 0; }
.gs7a-body .entry-content .wp-caption img { width: 100%; margin: 0; }
.gs7a-body .entry-content .wp-caption-text, .gs7a-body .entry-content figcaption, .gs7a-body .entry-content .wp-caption p, .gs7a-body .entry-content figure > p:last-child, .gs7a-body .entry-content .wp-element-caption { font-family: var(--gsb-font-body) !important; font-size: 0.8rem !important; font-weight: 400 !important; font-style: normal !important; line-height: 1.45 !important; color: var(--gsb-faint) !important; margin: 0.55rem 0 0 !important; padding: 0 !important; text-align: left !important; }
.gs7a-body .entry-content figure { margin-left: 0; margin-right: 0; }
.gs7a-body .entry-content .gs-seconda-opinione { margin-top: 2em; border-radius: var(--gsb-radius, 0.5rem); }
.gs7a-body .entry-content .gs-review-disclosure, .gs7a-body .entry-content .addendoBox:empty { display: none; }
/* blocco video del plugin: niente riquadro arancione né logo animato, solo il video 16:9 a tutta colonna */
.gs7a-body .entry-content .blocco_youtube_container { display: block; height: auto; max-height: none; background: #000; background-image: none; border-radius: var(--gsb-radius, 0.5rem); overflow: hidden; aspect-ratio: 16 / 9; padding: 0; }
.gs7a-body .entry-content .blocco_youtube_left { display: none; }
.gs7a-body .entry-content .blocco_youtube_right, .gs7a-body .entry-content .blocco_youtube_video, .gs7a-body .entry-content .blocco_youtube_iframe { display: block; width: 100%; height: 100%; }
.gs7a-body .entry-content .blocco_youtube_container iframe, .gs7a-body .entry-content .entry-content-asset iframe { width: 100%; height: 100%; aspect-ratio: 16 / 9; display: block; border: 0; }
.gs7a-body .entry-content .entry-content-asset { border-radius: var(--gsb-radius, 0.5rem); overflow: hidden; }
/* figura video generica (anteprima 16:9 con play: usata dal prototipo e pronta per una "facade" YouTube) */
.gs7a-body .entry-content .gs7a-video { margin: 2em 0 0; max-width: none; }
.gs7a-video__frame { position: relative; aspect-ratio: 16 / 9; border-radius: var(--gsb-radius, 0.5rem); overflow: hidden; background: #000; }
.gs7a-video__frame img { width: 100%; height: 100%; object-fit: cover; opacity: 0.85; border-radius: 0; }
.gs7a-video__frame .gsb-play { width: 4rem; height: 4rem; }
.gs7a-body .entry-content .gs7a-ad-inline { margin: 2em 0 0; }

/* ---- verdetto (in fondo alla recensione) ---- */
.gs7a-verdict { --gs7a-band: var(--gsb-good); margin-top: var(--gs7a-s4); padding: var(--gs7a-s3); border-radius: var(--gsb-radius, 0.5rem); background: color-mix(in srgb, var(--gs7a-band) 12%, transparent); border: 1px solid color-mix(in srgb, var(--gs7a-band) 40%, transparent); border-left: 6px solid var(--gs7a-band); display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--gs7a-s2) var(--gs7a-s3); align-items: start; scroll-margin-top: var(--gs7a-sticky-top); }
.gs7a-verdict--mid { --gs7a-band: var(--gsb-mid); }
.gs7a-verdict--bad { --gs7a-band: var(--gsb-bad); }
.gs7a-verdict__score { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; }
.gs7a-verdict .gsb-score--xl { min-width: 5rem; height: 5rem; font-size: 2.2rem; box-shadow: 0 6px 18px color-mix(in srgb, var(--gs7a-band) 45%, transparent); }
.gs7a-verdict__word { font-family: var(--gsb-font-head); font-size: 0.8rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: var(--gs7a-band); }
.gs7a-verdict__body { display: flex; flex-direction: column; gap: 0.9rem; min-width: 0; }
.gs7a-verdict__label { font-family: var(--gsb-font-head); font-size: var(--gsb-fs-kicker); font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gsb-faint); }
.gs7a-verdict__quote { font-family: var(--gsb-font-head); font-size: 1.35rem; font-weight: 700; line-height: 1.3; margin: 0; text-align: left !important; text-wrap: pretty; }
.gs7a-verdict__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gs7a-s2); }
.gs7a-verdict__cols .gsb-t-kicker { display: block; margin-bottom: 0.35rem; }
.gs7a-verdict__cols ul { padding-left: 0; margin: 0; }
.gs7a-verdict__facts { border-top: 1px solid color-mix(in srgb, var(--gs7a-band) 30%, transparent); padding-top: var(--gs7a-s1); }
.gs7a-verdict__facts a { color: var(--gsb-sec, var(--gsb-accent)); font-weight: 600; }
@media (max-width: 600px) { .gs7a-verdict { grid-template-columns: 1fr; padding: var(--gs7a-s2); } .gs7a-verdict__cols { grid-template-columns: 1fr; } .gs7a-verdict__score { flex-direction: row; } }

/* ---- coda dell'articolo ---- */
.gs7a-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: var(--gs7a-s4); }
.gs7a-tag { display: inline-flex; align-items: center; height: 2rem; padding: 0 0.85rem; border-radius: 999px; background: var(--gsb-panel); font-family: var(--gsb-font-head); font-size: var(--gsb-fs-meta); font-weight: 600; color: var(--gsb-text-2); text-decoration: none; }
.gs7a-tag:hover { background: var(--gsb-panel-2); color: var(--gsb-text); }
.gs7a-game { margin-top: var(--gs7a-s3); display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: var(--gs7a-s2); padding: var(--gs7a-s2); border: 1px solid var(--gsb-line); border-radius: var(--gsb-radius, 0.5rem); align-items: center; }
.gs7a-game__cover { display: block; aspect-ratio: 3 / 4; border-radius: 0.35rem; overflow: hidden; background: var(--gsb-panel); }
.gs7a-game__cover img { width: 100%; height: 100%; object-fit: cover; }
.gs7a-game__body { display: flex; flex-direction: column; gap: 0.3rem; min-width: 0; }
.gs7a-game__links { display: flex; flex-wrap: wrap; gap: 0.3rem 1rem; font-family: var(--gsb-font-head); font-size: var(--gsb-fs-meta); font-weight: 700; }
.gs7a-game__links a { color: var(--gsb-sec, var(--gsb-accent)); text-decoration: none; }
.gs7a-author { margin-top: var(--gs7a-s4); display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: var(--gs7a-s2); padding-top: var(--gs7a-s3); border-top: 1px solid var(--gsb-line); }
.gs7a-author img { width: 4rem; height: 4rem; border-radius: 50%; }
.gs7a-author .gs7-avatar--initials { width: 4rem; height: 4rem; font-size: 1.4rem; } /* senza foto: iniziali (gs7-author) */
.gs7a-byline .gs7-avatar--initials { width: 2.5rem; height: 2.5rem; font-size: 0.9rem; }
.gs7a-author__name { font-family: var(--gsb-font-head); font-weight: 800; font-size: 1.05rem; }
.gs7a-author__name a { color: inherit; text-decoration: none; }
.gs7a-author__bio { font-size: 0.95rem; color: var(--gsb-muted); margin: 0.2rem 0 0; }
.gs7a-next { margin-top: var(--gs7a-s4); padding: var(--gs7a-s2); border-radius: var(--gsb-radius, 0.5rem); background: var(--gsb-panel); display: grid; grid-template-columns: minmax(0, 1fr) 7rem; gap: var(--gs7a-s2); align-items: center; color: inherit; text-decoration: none; }
.gs7a-next .gsb-media { aspect-ratio: 16 / 9; }
.gs7a-next:hover .gsb-t-title { color: var(--gsb-sec, var(--gsb-accent)); }

/* ---- laterale (separata da una linea) ---- */
.gs7a-sidebar { min-width: 0; }
@media screen and (min-width: 1025px) {
	.gs7a-sidebar { align-self: stretch; border-left: 1px solid var(--gsb-line); padding-left: var(--gs7a-s3); --gsb-sticky-top: var(--gs7a-sticky-top); }
}

/* ---- fasce sotto le colonne ---- */
.gs7a-below { padding-top: var(--gs7a-s5); }

/* ---- niente tagli su schermi stretti ---- */
body.gs7-article .gs7a-head, body.gs7-article .gs7a-body, body.gs7-article .gs7a-verdict, body.gs7-article .gs7a-sidebar { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.gs7a-body .entry-content iframe, .gs7a-body .entry-content video, .gs7a-body .entry-content embed { max-width: 100%; }
.gs7a-body .entry-content table { display: block; max-width: 100%; overflow-x: auto; }
.gs7a-body .entry-content pre { max-width: 100%; overflow-x: auto; }
.gs7a-head > * { max-width: min(60rem, 100%); }

/* ---- mobile e tablet ---- */
@media (max-width: 1024.98px) {
	.gs7a-head-wrap { padding-top: var(--gs7a-s2); }
	.gs7a-head { gap: var(--gs7a-s1); padding-bottom: var(--gs7a-s2); margin-bottom: var(--gs7a-s3); }
	.gs7a-sidebar { margin-top: var(--gs7a-s4); }
	body.gs7-article { --gs7a-body-size: 1.0625rem; }
}

