/* single-rumor.css — GlitchZone · esclusivi del single RUMOR (Step 5.3)
   ------------------------------------------------------------------------
   Solo ciò che NON è condiviso (lo shared — hero, .poll-*, .two-column-layout,
   .sidebar, .anti-pollo-box, .cursor base — sta in single-base.css; .disclaimer → base.css).
   Estratto byte-fedele da rumors_v13.html (CSS ~righe 226-448; timer = 5.3b).
   Caricato SOLO su is_singular('gz_rumor') (dep gz-single-base).
   La sezione Rumors è viola → i `var(--cat-*)` rendono lilla.
   5.3a: hero-extra (score-fuffa) + momento-verità + favola + leak(+dado) + dizionario
   + precedente + verdetto. */

/* Correlati "altre favole" — full-width in fondo (era sidebar; single-column dal 29 giu).
   Mirror della pollata (.correlati-readnext in single-pollata.css): qui copiato perché
   quel file non si carica sul rumor (si copia non si linka). Dedup candidata a fine step. */
.correlati-readnext { margin-top: 52px; }
.correlati-readnext .correlati-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }

/* ── Hero: riga-top (tag + score-fuffa) ── */
.header-top-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; flex-wrap: wrap; gap: 12px; }
.score-fuffa-compact { display: flex; align-items: center; gap: 12px; }
.score-fuffa-label { font-family: 'Space Mono', monospace; font-size: 0.7rem; color: var(--text-muted); text-transform: uppercase; }
.score-fuffa-value { font-family: 'Space Mono', monospace; font-size: 1.4rem; font-weight: 700; color: var(--error); text-shadow: 0 0 10px var(--error-glow); }
.score-fuffa-bar { width: 80px; height: 6px; background: var(--surface-light); border-radius: 3px; overflow: hidden; }
.score-fuffa-fill { height: 100%; background: linear-gradient(90deg, var(--yellow), var(--error)); transition: width 1.5s cubic-bezier(0.22, 1, 0.36, 1); }

/* ── Cursori (base .cursor + .verdict-cursor del poll vivono in single-base; qui la variante verde) ── */
.cursor.verde { color: var(--primary); }

/* ── Momento Verità — de-box (29 giu): callout VERDE (--primary = "la verità", scelta proprietario);
   barra-accento + velo minimo + spigoli vivi, allineato a sinistra. "Adeguato, non troppo compatto":
   padding comodo, testo pieno. (.banner-box rimosso: lo usava solo questo blocco.) ── */
.momento-verita {
    border-left: 3px solid var(--primary);
    background: color-mix(in srgb, var(--primary) 5%, transparent);
    border-radius: 0;
    padding: 20px 24px; margin-bottom: 56px;
    position: relative;
    animation: fadeInUp 0.6s ease forwards 0.2s; opacity: 0;
}
.momento-verita-label { font-family: 'Space Mono', monospace; font-size: 0.7rem; color: var(--primary); text-transform: uppercase; letter-spacing: 2px; margin-bottom: 10px; }
.momento-verita-text { font-family: 'Space Mono', monospace; font-size: 1.05rem; font-weight: 600; color: var(--text-primary); line-height: 1.6; }

/* ── La Favola che ci Raccontano (lilla) ── */
/* La Favola = PROSA della pagina (scelta proprietario). 29 giu: portata a PROSA PIATTA come le
   altre pagine (pollata) → via la barra neon a sinistra; le "traduzioni" (decifratura) vanno
   INLINE nel testo (vedi .decifratura). Versioni precedenti (cornice piena / barra neon) = git. */
.favola-box {
    background: transparent; border: 0; border-radius: 0;
    padding: 0; margin-bottom: 24px;
    animation: fadeInUp 0.6s ease forwards 0.3s; opacity: 0;
}
/* Traduzione "Decifratura" — STESSO stile delle traduzioni della pollata (.translation): callout a
   blocco con barra-accento 3px + velo 4% + spigoli vivi + monospace lilla + cursore. (La "linea a
   sinistra" tolta era la cornice della Favola, non questa barretta.) Copiato dalla pollata, non linkato. */
.favola-box .decifratura {
    display: block;
    background: color-mix(in srgb, var(--cat-color) 4%, transparent);
    border-left: 3px solid var(--cat-color);
    border-radius: 0;
    padding: 8px 14px 8px 16px; margin: 8px 0 20px 0;
    font-size: 0.95rem; color: var(--cat-color); font-family: 'Space Mono', monospace;
}
/* (pallino/badge della Favola RIMOSSO 29 giu, scelta proprietario: la barra neon + il titolo
   fanno già da firma → niente cerchietto, look più de-boxato e coerente col Momento Verità.
   L'icona 'sparkles', aggiunta solo per il badge, è stata tolta da icons.php.) */
.favola-title { font-family: 'Space Mono', monospace; color: var(--cat-color); margin-bottom: 16px; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1px; text-shadow: 0 0 10px var(--cat-glow); }
.favola-box p { color: var(--text-secondary); margin-bottom: 16px; font-size: 1.1rem; line-height: 1.75; }
.favola-box p:last-of-type { margin-bottom: 0; }
.favola-box strong { color: var(--text-primary); }
/* (.favola-punchline RIMOSSA 29 giu, scelta proprietario: la Favola chiude sull'ultima Decifratura;
   le traduzioni fanno già da stoccata. Campo ACF 'favola_punchline' ora orfano → pulizia a fine step.) */

/* ── Leak Alert (fonte + dado animato) ── */
/* Fonte/Leak — de-box CENTRALE (29 giu, scelta proprietario): niente box né barra → il DADO
   diventa un "momento" centrato (= la fonte è una scommessa), label+testo centrati sotto. Aria
   generosa sopra/sotto. (Rompe di proposito il pattern a-barra: è l'unico blocco con un elemento-hero.) */
.leak-alert {
    border: 0; background: transparent; border-radius: 0;
    padding: 8px 0; margin: 80px 0;
    display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center;
    animation: fadeInUp 0.6s ease forwards 0.4s; opacity: 0;
}

/* ── INCERTEZZA affiancata (PROTOTIPO idea-2, 29 giu): dado | Timer in 2 colonne = "le due incognite".
   L'aria sta sul wrapper; i due centrati dentro perdono il margine proprio (è del duo). ── */
/* ── INCERTEZZA AFFIANCATA — rifinita (29 giu): dado | Timer PARALLELI (figure→label→dettaglio),
   con i "figure" alla STESSA altezza → le label cadono sulla stessa linea. Dado un filo più piccolo,
   numero più grande → "si somigliano" come grandezza. Scritte uniformi. ── */
/* Full-width (il proprietario preferiva così). Il disallineamento col verdetto (altra 2-col) è gestito
   mettendo il Dizionario IN MEZZO (1-col) → i due blocchi 2-col non sono più adiacenti. */
.uncertainty-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; margin: 80px 0; }
.uncertainty-duo .leak-alert, .uncertainty-duo .timer-box { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.uncertainty-duo .leak-alert-content { display: flex; flex-direction: column; gap: 12px; }
/* figure (dado / numero) alla stessa altezza */
.uncertainty-duo .leak-alert-icon, .uncertainty-duo .timer-figure { height: 64px; display: flex; align-items: center; justify-content: center; }
.uncertainty-duo .dice-svg { width: 60px; height: 60px; }
.uncertainty-duo .timer-value { font-size: 3.5rem; }
.uncertainty-duo .timer-unit { font-size: 1rem; margin-left: 6px; }
/* label uniformi (entrambe icona + uppercase muted) */
.uncertainty-duo .leak-alert-label, .uncertainty-duo .timer-label { font-size: 0.66rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; margin: 0; }
/* dettaglio uniforme (fonte / evento) */
.uncertainty-duo .leak-alert-text, .uncertainty-duo .timer-event { font-size: 0.9rem; color: var(--text-secondary); margin: 0; }
.leak-alert-icon { font-size: 1.8rem; flex-shrink: 0; }
.leak-alert-content { flex: 1; }
.leak-alert-label { font-family: 'Space Mono', monospace; font-size: 0.65rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; }
.leak-alert-text { font-size: 0.9rem; color: var(--text-secondary); line-height: 1.5; }
.leak-alert-text strong { color: var(--text-primary); }
.dice-svg { width: 80px; height: 80px; flex-shrink: 0; animation: diceGlitch 4s ease-in-out infinite; }
/* Dado: glitch periodico (CSS) + crossfade casuale delle facce (JS 5.4 cicla .dice-face).
   Estratto byte-fedele dallo statico (877-892); reduced-motion-safe via guard globale base.css. */
@keyframes diceGlitch {
    0%, 88%   { filter: none; transform: none; opacity: 1; }
    89% { filter: hue-rotate(60deg) brightness(1.5); transform: translate(-2px, 1px); opacity: 0.7; }
    90% { filter: hue-rotate(-90deg) brightness(2); transform: translate(2px, -2px) scale(1.08); opacity: 0.4; }
    91% { filter: hue-rotate(180deg) brightness(2.5); transform: translate(-1px, 2px) scale(0.92); opacity: 0.2; }
    92% { filter: hue-rotate(-60deg) brightness(2); transform: translate(1px, -1px) scale(1.05); opacity: 0.4; }
    93% { filter: hue-rotate(30deg) brightness(1.5); transform: translate(-1px, 0); opacity: 0.7; }
    95%, 100% { filter: none; transform: none; opacity: 1; }
}
.dice-face { transition: opacity 0.08s ease; }

/* ── Vocabolario dei Leaker — REDESIGN «Glossario» (30 giu): voce di dizionario a 2 colonne
   (termine «leaker» ‖ significato), righe a hairline. NIENTE velo/barra (= firma della decifratura
   della Favola) → identità distinta: la Favola decodifica i claim, il Vocabolario il linguaggio.
   Termine = lilla mono (il lemma) · significato = Outfit grigio (la prosa). Virgolette «» via CSS. ── */
.dizionario-box { margin-bottom: 28px; animation: fadeInUp 0.6s ease forwards 0.5s; opacity: 0; }
.dizionario-title { font-family: 'Space Mono', monospace; font-size: 0.85rem; color: var(--text-primary); margin-bottom: 18px; display: flex; align-items: center; gap: 10px; }
.dizionario-title span { font-size: 1.1rem; }
.dizionario-glossario { margin: 0; }
.dizionario-voce {
    display: grid; grid-template-columns: minmax(0, 38%) minmax(0, 1fr); gap: 20px; align-items: baseline;
    padding: 12px 2px; border-top: 1px solid var(--border);
}
.dizionario-voce:last-child { border-bottom: 1px solid var(--border); }
.dizionario-termine { margin: 0; font-family: 'Space Mono', monospace; font-size: 0.9rem; font-weight: 600; color: var(--cat-color); }
.dizionario-termine::before { content: '\00AB'; }
.dizionario-termine::after  { content: '\00BB'; }
.dizionario-significato { margin: 0; font-family: 'Outfit', sans-serif; font-size: 0.95rem; color: var(--text-secondary); line-height: 1.55; }

/* ── Verdetto (Sognatori / Realisti) = i "pro e contro" del rumor → STESSO stile della pollata
   (de-box: barra-accento sx verde/rosso + titolo colorato 1.2rem + lista, niente box) + header
   «IL VERDETTO» (2° picco della pagina, chiude il salto heading). 29 giu. Copiato dalla pollata. ── */
.verdict-head {
    font-family: 'Space Mono', monospace; font-weight: 700; font-size: 1.875rem;
    line-height: 1.1; color: var(--text-primary); text-transform: uppercase;
    letter-spacing: 1px; margin: 80px 0 72px; position: relative;
}
.verdict-head::after { content: ''; position: absolute; left: 0; bottom: -12px; width: 54px; height: 3px; background: var(--cat-color); }
.verdetto-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin: 24px 0; animation: fadeInUp 0.6s ease forwards 0.6s; opacity: 0; }
.verdetto-box { padding: 2px 0 2px 16px; }
.verdetto-box.sognatori { border-left: 3px solid var(--primary); }
.verdetto-box.realisti { border-left: 3px solid var(--error); }
.verdetto-title { font-family: 'Space Mono', monospace; font-weight: 700; margin-bottom: 16px; font-size: 1.2rem; text-transform: uppercase; }
.sognatori .verdetto-title { color: var(--primary); text-shadow: 0 0 10px var(--primary-glow); }
.realisti .verdetto-title { color: var(--error); text-shadow: 0 0 10px rgba(255,68,68,0.4); }
.verdetto-list { list-style: none; padding: 0; }
.verdetto-list li { padding: 6px 0; font-size: 0.9rem; color: var(--text-secondary); display: flex; align-items: flex-start; gap: 10px; }
.verdetto-list li .icon-svg { margin-top: 5px; } /* ✓/✗ sulla PRIMA riga (scelta proprietario 3 lug), non centrata sul blocco */
.verdetto-list li .icon-svg svg { width: 12px; height: 12px; flex-shrink: 0; display: block; }
/* Icone ✓/✗ = verde/rosso semantico */
.verdetto-box.sognatori .icon-svg { color: var(--primary); }
.verdetto-box.realisti .icon-svg { color: var(--error); }

/* ── Poll — de-box come la pollata (29 giu): contenitore trasparente + opzioni a callout (barra-accento
   + velo), label-sx/emoji-dx, callout-compatto (% rivelata al voto). Scopato a .single-gz_rumor (il poll
   è condiviso in single-base; la pollata fa lo stesso su .verdict-block — si copia, non si linka). ── */
.single-gz_rumor .poll-box { background: transparent; border: 0; border-radius: 0; padding: 0; margin: 56px 0; }
.single-gz_rumor .poll-header, .single-gz_rumor .poll-question { padding-left: 19px; }
.single-gz_rumor .poll-question { margin-bottom: 28px; font-size: 1.25rem; }
.single-gz_rumor .poll-options { gap: 14px; margin-bottom: 16px; }
.single-gz_rumor .poll-option {
    flex-direction: row; flex-wrap: wrap; align-items: center; align-content: center; text-align: left; /* align-content:center = icona a dx sempre al centro verticale, a prescindere dalle righe dell'etichetta (fix 9 lug) */
    column-gap: 8px; row-gap: 0;
    background: color-mix(in srgb, var(--cat-color) 4%, transparent);
    border: 0; border-left: 3px solid var(--cat-color); border-radius: 0;
    padding: 12px 16px;
}
.single-gz_rumor .poll-option:hover { background: color-mix(in srgb, var(--cat-color) 9%, transparent); }
.single-gz_rumor .poll-label { order: 1; font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.5px; color: var(--cat-color); }
.single-gz_rumor .poll-emoji { order: 2; margin-left: auto; display: inline-flex; align-items: center; font-size: 1.3rem; color: var(--cat-color); } /* color = le SVG arco-del-pollo usano currentColor: senza, restavano NERE (9 lug); parità con pollata/news */
.single-gz_rumor .poll-percent { order: 3; flex-basis: 100%; font-size: 1.15rem; max-height: 0; overflow: hidden; opacity: 0; margin-top: 0; transition: max-height 0.35s ease, opacity 0.3s ease, margin-top 0.35s ease; }
.single-gz_rumor .poll-box.revealed .poll-percent { max-height: 2em; opacity: 1; margin-top: 4px; }
.single-gz_rumor .poll-option.voted { background: color-mix(in srgb, var(--cat-color) 16%, transparent); color: inherit; box-shadow: 0 0 18px var(--cat-glow); }
.single-gz_rumor .poll-option.voted .poll-label,
.single-gz_rumor .poll-option.voted .poll-percent { color: var(--cat-color); }
/* Fix icona v2 (9 lug): icona ancorata in ASSOLUTO al centro verticale del box (align-content non
   bastava). + dimensiono l'SVG a 26px come la pollata (prima ereditava il default → poteva variare). */
.single-gz_rumor .poll-emoji .icon-svg svg { width: 26px; height: 26px; }
.single-gz_rumor .poll-option { position: relative; }
.single-gz_rumor .poll-emoji { position: absolute; top: 50%; right: 16px; transform: translateY(-50%); margin-left: 0; }
.single-gz_rumor .poll-option:hover .poll-emoji { transform: translateY(-50%) scale(1.1); }
.single-gz_rumor .poll-label { padding-right: 34px; }

/* ── Sizing icone-label del corpo (byte-fedele allo statico 935-976) ──
   Senza questo le icone .icon-svg collassano (la primitiva base ora dà 1em di floor,
   ma qui servono le taglie esatte dello statico). */
.momento-verita-label .icon-svg { vertical-align: -2px; margin-right: 4px; }
.momento-verita-label .icon-svg svg { width: 15px; height: 15px; }
.leak-alert-label .icon-svg { vertical-align: -2px; margin-right: 3px; }
.leak-alert-label .icon-svg svg { width: 13px; height: 13px; }
.dizionario-title .icon-svg { vertical-align: -2px; }
.dizionario-title .icon-svg svg { width: 16px; height: 16px; }
.verdetto-title .icon-svg { vertical-align: -2px; margin-right: 3px; }
.verdetto-title .icon-svg svg { width: 20px; height: 20px; }

/* ════════════ TIMER VERITÀ (era nella sidebar 5.3b; single-column dal 29 giu) ════════════
   La sidebar è stata rimossa: resta qui l'esclusivo del rumor ancora vivo (timer-box).
   I correlati (.correlati-*) e .sidebar-title vivono in single-base.css; il loro contenitore
   "read next" (.correlati-readnext) è in cima a questo file. Timer = parcheggiato full-width,
   de-box + posizione definitiva da decidere quando si studia il blocco. */

/* ── Timer Verità — de-box CENTRALE (29 giu, scelta proprietario): come il Fonte/dado è un "momento
   di sospensione" CENTRATO (il countdown alla verità), PRIMA del poll. Niente box/barra/pulse; il
   numero è il fuoco. Centrato + Fonte = i due beat di incertezza del rumor (chi lo dice / quando lo sapremo). ── */
.timer-box {
    border: 0; background: transparent; border-radius: 0;
    padding: 8px 0; margin: 80px 0; text-align: center;
    animation: fadeInUp 0.6s ease forwards 0.55s; opacity: 0;
}
.timer-label { font-family: 'Space Mono', monospace; font-size: 0.65rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 6px; }
.timer-value { font-family: 'Space Mono', monospace; font-size: 2.6rem; font-weight: 700; color: var(--cat-color); text-shadow: 0 0 15px var(--cat-glow); line-height: 1.1; display: inline-block; }
.timer-unit { font-family: 'Space Mono', monospace; font-size: 0.8rem; color: var(--text-secondary); display: inline-block; margin-left: 6px; }
.timer-event { font-size: 0.75rem; color: var(--cat-color); margin-top: 8px; }
/* Clessidra: flip periodico (statico 894-906); reduced-motion-safe via guard globale base.css. */
@keyframes hourglassFlip { 0%, 85% { transform: rotate(0deg); } 90% { transform: rotate(180deg); } 95%, 100% { transform: rotate(180deg); } }
.hourglass-flip { display: inline-flex; animation: hourglassFlip 8s ease-in-out infinite; }
.hourglass-flip svg { stroke: var(--cat-color); }
.timer-label .icon-svg { vertical-align: -2px; margin-right: 3px; }
.timer-label .icon-svg svg { width: 14px; height: 14px; stroke: var(--cat-color); }

/* (override .sidebar-section RIMOSSO 29 giu: la sidebar non esiste più, single-column.)
   .sidebar-title (// header) + "Altre Favole" (.correlati-*) = stile condiviso in single-base.css. */

/* (newsletter-mini "Fuffa Alert" RIMOSSA 29 giu: tolta dal corpo del rumor — la newsletter
   resta nel footer e in home; si rivaluterà a fine di tutte le pagine.) */

/* ── "La Mossa Anti-Pollo" — DE-BOX 30 giu (parità con la pollata): callout giallo + mascot
   gallina a sx, spigoli vivi. Scopato a .single-gz_rumor (la pollata lo scopa a .single-gz_pollata;
   .anti-pollo-box base = single-base.css). Giallo brand-wide ("non fate i polli"), non lilla. ── */
.single-gz_rumor .anti-pollo-box {
    display: flex; align-items: center; gap: 26px; text-align: left;
    max-width: none; margin: 88px auto 0;                              /* de-box → stacco a sola aria (come pollata) + full-width */
    background: color-mix(in srgb, var(--yellow) 5%, transparent);     /* velo giallo tenue */
    border: 0; border-left: 3px solid var(--yellow); border-radius: 0; /* barra-accento + spigoli vivi */
    padding: 22px 26px; box-shadow: none;
}
.single-gz_rumor .anti-pollo-box::before { display: none; }   /* via il gradiente del box pieno */
.single-gz_rumor .anti-pollo-box:hover { transform: none; }   /* niente lift: callout statico */
.single-gz_rumor .anti-pollo-mascot {
    height: 96px; width: auto; flex-shrink: 0; align-self: center;
    filter: drop-shadow(0 0 5px var(--yellow-glow)) drop-shadow(0 0 16px var(--yellow-glow)); /* glow giallo */
}
.single-gz_rumor .anti-pollo-body { text-align: left; }
.single-gz_rumor .anti-pollo-title { margin-bottom: 8px; }    /* compatta nel callout */
.single-gz_rumor .anti-pollo-box p { margin-bottom: 16px; }
.single-gz_rumor .anti-pollo-cta { animation: none; }         /* via il pulse su callout raw */

/* ── Responsive ── */
@media (max-width: 768px) {
    .header-top-row { flex-direction: column; align-items: flex-start; }
    .verdetto-grid { grid-template-columns: 1fr; }
    .dizionario-voce { grid-template-columns: 1fr; gap: 4px; }   /* glossario → stack: termine sopra, significato sotto */
}
