/* Home — le aggiunte del sito nuovo alla master (03/10/2026): ricerca, «Come funziona», tabellino di coppa e i contenuti
   della home di oggi in coda («da collocare»). Solo gettoni del tema (--carta, --inchiostro, --grigio, --filetto, --velo,
   --verdetto): la regola madre vale da sé nei due temi. */

/* ═══ la ricerca ═══ */
.ce-esiti{ background:var(--carta); color:var(--inchiostro); border:2px solid var(--inchiostro); box-shadow:0 18px 40px rgba(0,0,0,.22); padding:6px 0; display:grid; max-height:min(70vh,640px); overflow-y:auto }
.ce-esiti[hidden]{ display:none }
.ce-testata{ position:fixed; z-index:45 }
#ce-menu,#ce-home{ box-shadow:none; margin-top:6px }
.ce-gruppo{ display:grid; padding:4px 0 6px; border-bottom:1px solid var(--filetto) }
.ce-gruppo:last-child{ border-bottom:0 }
.ce-gruppo h3{ margin:4px 14px; font:600 var(--c-etichetta) var(--f-cifre); letter-spacing:.08em; text-transform:uppercase; color:var(--grigio) }
.ce-voce{ display:grid; grid-template-columns:26px minmax(0,1fr); gap:10px; align-items:center; padding:7px 14px; text-decoration:none; color:var(--inchiostro) }
.ce-voce:hover,.ce-voce:focus-visible{ background:var(--velo) }
.ce-voce svg{ width:22px; height:22px; color:var(--grigio) }
.ce-voce b{ font:600 var(--c-testo)/1.25 var(--f-testo); display:block }
.ce-voce small{ display:block; font:var(--c-nota) var(--f-cifre); color:var(--grigio) }
.ce-voce mark{ background:none; color:inherit; font-weight:800; text-decoration:underline; text-underline-offset:3px }
.ce-tutti{ margin:2px 14px 4px; font:600 var(--c-nota) var(--f-cifre); letter-spacing:.04em; color:var(--inchiostro) }
.ce-vuoto{ margin:8px 14px; color:var(--grigio); font-size:var(--c-testo) }
/* sul telefono la testata non ha il campo e la Home non ha la barra in basso: il campo sta in cima alla pagina */
.cerca-home{ display:none }
@media (max-width:760px){
  .cerca-home{ display:block; padding-top:8px }
  .cerca-home .cerca{ display:flex; max-width:none; margin:0 }
}

/* ═══ il timone: la tessera porta all'ambiente, «Come funziona» è un tasto a parte ═══ */
.tessera-home{ position:relative }
.tessera-vai{ color:inherit; text-decoration:none }
.tessera-vai::after{ content:""; position:absolute; inset:0 }
.tessera-home .come{ grid-column:2; justify-self:start; position:relative; z-index:1; background:none; border:0; padding:4px 0; color:var(--inchiostro); cursor:pointer }
#p-guida{ top:50%; left:50%; transform:translate(-50%,-50%); width:min(560px,calc(100vw - 32px)); max-height:min(90vh,calc(100vh - 2 * env(safe-area-inset-top,0px))) }
#guida-corpo{ display:grid; gap:14px }
#p-guida p{ font-size:var(--c-evidenza); line-height:1.55 }

/* ═══ il tabellino di coppa (da arbitri/scheda.css) ═══ */
#p-tab{ top:50%; left:50%; transform:translate(-50%,-50%); width:min(820px,calc(100vw - 24px)); max-height:min(90vh,calc(100vh - 2 * env(safe-area-inset-top,0px))); padding:0 }
#p-tab .corpo-t{ padding:18px 22px 24px; display:grid; gap:12px }
#p-tab .corpo-t > header{ padding-right:56px; display:grid; gap:2px }
#p-tab h2{ font:900 var(--c-sottotitolo)/1 var(--f-titolo); text-transform:uppercase }
.tb-gamba{ display:grid; gap:10px; padding-top:12px; border-top:2px solid var(--inchiostro) }
.tb-gamba:first-of-type{ border-top:0; padding-top:0 }
.tb-ris{ display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:12px; align-items:center }
.tb-ris .sq{ display:flex; gap:8px; align-items:center; font:800 var(--c-titoletto)/1.1 var(--f-titolo); text-transform:uppercase; min-width:0 }
.tb-ris .sq.sx{ justify-content:flex-end; text-align:right } .tb-ris img{ width:32px; height:32px; object-fit:contain; flex:none }
.tb-ris .n{ font:900 var(--c-dato)/1 var(--f-titolo) }
.tb-ris .n.ora{ font:700 var(--c-testo) var(--f-cifre); color:var(--grigio); text-transform:uppercase }
.tb-info{ text-align:center; font:var(--c-nota) var(--f-cifre); color:var(--grigio) }
.tb-due{ display:grid; grid-template-columns:1fr 1fr; gap:4px 24px } .tb-due > div{ min-width:0; display:grid; gap:2px; align-content:start } .tb-due > div:first-child{ text-align:right }
.tb-due .r{ font-size:var(--c-testo) } .tb-due .m{ font:var(--c-nota) var(--f-cifre); color:var(--grigio) }
.tb-h{ margin:8px 0 0; text-align:center; font:700 var(--c-nota) var(--f-cifre); letter-spacing:.1em; text-transform:uppercase; color:var(--grigio) }
.tb-coda{ display:grid; grid-template-columns:1fr auto 1fr; gap:4px 12px; align-items:baseline; font-size:var(--c-testo) } .tb-coda > :first-child{ text-align:right }
.tb-coda .et{ font:600 var(--c-etichetta) var(--f-cifre); letter-spacing:.08em; text-transform:uppercase; color:var(--grigio) }
@media (max-width:560px){ #p-tab .corpo-t{ padding:14px } .tb-ris .sq{ font-size:var(--c-testo) } .tb-ris img{ width:24px; height:24px } .tb-ris .n{ font-size:var(--c-titolo) } .tb-due{ gap:4px 12px } .tb-due .r{ font-size:var(--c-testo) } }

/* ═══ «da collocare»: il segno che il blocco aspetta la decisione di Fabio ═══ */

/* ═══ Nella storia ═══ */
.ns-corpo{ display:grid; gap:30px; padding-top:28px }
.ns-blocco{ display:grid; gap:12px }
.ns-h{ margin:0; display:flex; gap:8px 14px; align-items:baseline; flex-wrap:wrap; font:700 var(--c-titoletto)/1.1 var(--f-titolo); text-transform:uppercase }
.ns-h .tasto{ margin-left:auto }
.ns-evidenza{ max-width:620px }
.ns-evidenza .riga-tp{ display:contents }
/* ★ 17/10/2026 (regole B.1/B.2, «Ambrosiana-Inter» a 320 px: al corpo minimo mancava 1 px): sul telefono la tessera in evidenza
     stringe lo spazio fra fascia, stemma e nome; il nome resta intero e su una riga */
@media (max-width:760px){ .ns-evidenza .lato{ gap:6px } }
.ns-nota{ margin:0; font-size:var(--c-testo) }
.ns-vetrina{ grid-template-columns:repeat(4,minmax(0,1fr)) }
@media (max-width:980px){ .ns-vetrina{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
.ns-vetrina .etichetta{ font:600 var(--c-etichetta)/1.3 var(--f-cifre); letter-spacing:.08em; text-transform:uppercase; color:var(--grigio) }
.ns-filtro{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:var(--c-testo) }
.ns-filtro select{ height:42px; font:600 var(--c-testo) var(--f-testo); border:1px solid var(--filetto); background:var(--carta); color:var(--inchiostro); padding:0 8px; max-width:100% }
.ns-risultati li small{ grid-column:1/-1 }
.ns-top tbody tr{ cursor:pointer }
.ns-top tr.podio td{ font-weight:800 }
.ns-data{ background:none; border:0; padding:0; font:700 var(--c-testo) var(--f-cifre); color:var(--inchiostro); text-decoration:underline; text-underline-offset:3px; cursor:pointer }
.scegli-data .tasto{ height:42px }

/* ═══ tabelle con lo stemma ═══ */
.tab-scorre{ overflow-x:auto; max-width:100% }
.tab-scorre table{ width:100%; border-collapse:collapse }
.sq-cl{ display:inline-flex; gap:10px; align-items:center; color:var(--inchiostro); text-decoration:none }
a.sq-cl:hover span{ text-decoration:underline }
.sq-cl img,.sq-cl .senza{ width:26px; height:26px; object-fit:contain; flex:none }
.sq-cl .stemma-svg{ width:26px; height:26px } .sq-cl .stemma-svg svg{ height:26px }
.sq-cl .senza{ display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--filetto); font:700 var(--c-nota) var(--f-titolo); color:var(--grigio) }
@media (max-width:760px){ .cl-home .largo{ display:none } .classifica td,.classifica th{ padding:7px 4px } .classifica td.sq{ font-size:var(--c-testo) } }

/* ═══ la stagione e l'archivio: una scheda per primato, il numero più grande dell'etichetta ═══ */
.vs-griglia{ display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:0 28px }
.vs-scheda{ display:grid; gap:6px; align-content:start; border-top:2px solid var(--inchiostro); padding:14px 0 20px }
.vs-riga{ display:flex; flex-wrap:wrap; gap:4px 12px; align-items:center }
.vs-riga img,.vs-riga .senza{ width:40px; height:40px; object-fit:contain; flex:none }
.vs-riga .stemma-svg{ width:40px; height:40px } .vs-riga .stemma-svg svg{ height:40px }
.vs-cifra{ font:900 clamp(var(--c-dato), 6vw, var(--c-grande))/.9 var(--f-titolo); letter-spacing:-.01em }
.vs-chi{ font:700 var(--c-titoletto)/1.2 var(--f-testo) }
.vs-scheda p{ margin:0; font-size:var(--c-testo); line-height:1.45; color:var(--grigio) }
.vs-scheda .vs-nomi{ color:var(--inchiostro); font-weight:600 }

/* ═══ la presentazione e i crediti ═══ */
.pres{ display:grid; gap:4px; max-width:66ch }
.pres p{ margin:0 0 12px; font-size:var(--c-evidenza); line-height:1.6 }
.crediti{ max-width:640px }
.crediti li{ grid-template-columns:minmax(0,1fr) }
.crediti li span{ font:600 var(--c-evidenza) var(--f-testo) }
.crediti li small{ font-weight:400 }
.contatti{ margin:0; font-size:var(--c-testo); line-height:1.7 }
/* la Top 30 sul telefono: cinque colonne in 343 px senza scorrere (si stringe il disegno, non il dato) */
@media (max-width:760px){
  .ns-top th,.ns-top th.sq{ font:600 var(--c-etichetta) var(--f-cifre); letter-spacing:.04em; text-transform:uppercase; color:var(--grigio) }
  .ns-top td.sq{ font-size:var(--c-testo) }
}

/* ═══ la composizione del 03/10/2026: le parti che si aprono col tasto ═══ */
.apri-ico{ position:relative; flex:none; width:30px; height:30px; border:2px solid var(--inchiostro); background:var(--carta) }
.apri-ico::before,.apri-ico::after{ content:""; position:absolute; left:50%; top:50%; width:14px; height:2px; margin:-1px 0 0 -7px; background:var(--inchiostro) }
.apri-ico::after{ transform:rotate(90deg) }
details[open] > summary .apri-ico::after,.apri-cl[aria-expanded="true"] .apri-ico::after{ display:none }
.ns-apri > summary{ list-style:none; display:flex; align-items:center; justify-content:space-between; gap:16px; cursor:pointer; padding:10px 0; border-bottom:1px solid var(--filetto) }
.ns-apri > summary::-webkit-details-marker{ display:none }
.ns-apri > summary .ns-h{ margin:0 }
.ns-apri > summary:hover .apri-ico,.apri-cl:hover .apri-ico{ border-color:var(--verdetto); background:var(--velo) }
.ns-apri > summary:focus-visible{ outline:2px solid var(--verdetto); outline-offset:3px }
.ns-apri[open] > summary{ margin-bottom:12px }
.cl-home.chiusa .cl-mezzo{ display:none }
.cl-home.chiusa tr:nth-child(4) td{ border-bottom:2px dashed var(--filetto) }
.apri-cl{ display:inline-flex; align-items:center; gap:12px; margin-top:12px; font:600 var(--c-nota) var(--f-testo); background:none; border:0; padding:4px 0; color:var(--inchiostro); cursor:pointer }
.va-timone{ margin:6px 0 24px }
.richiamo-chi{ display:flex; flex-wrap:wrap; gap:8px 28px; margin:8px 0 0; font:600 var(--c-testo) var(--f-testo) }
.richiamo-chi a{ color:var(--inchiostro) } .richiamo-chi a:hover{ color:var(--verdetto) }
/* l'archivio in numeri in testa al timone: una striscia di cifre, non sette schede (meno scorrimento, 03/10) */
.va-timone{ grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:0; border-top:2px solid var(--inchiostro); border-bottom:1px solid var(--filetto) }
.va-timone .vs-scheda{ padding:12px 14px 12px 0; border:0; gap:0 }
.va-timone .vs-scheda > .etichetta,.va-timone .vs-scheda > p{ display:none }
.va-timone .vs-riga{ display:grid; gap:2px }
.va-timone .vs-cifra{ font-size:var(--c-titolo) }
.va-timone .vs-chi{ font:400 var(--c-etichetta) var(--f-cifre); letter-spacing:.08em; text-transform:uppercase; color:var(--grigio) }
/* ★ 06/10 collaudo (segnalazione di chi scrive l'Aiuto): sul telefono la classifica è la lista a box con TUTTE le squadre:
     «Tutta la classifica · 20 squadre» non apriva niente di nuovo. Resta sul monitor, dove la tabella mostra le prime 4 e le ultime 3. */
@media (max-width:760px){ .apri-cl{ display:none !important } }