/* ════════════════════════════════════════════════════════════════════════════
   VISTA ASIATICA (.as-*) — stili PRIMA nel <style> inline di asiatica.html,
   spostati qui per la regola Dav 25/07 (niente CSS dentro le pagine).
   FIX Dav 25/07 (.pg rompe il layout): la pagina NON usa più la classe .pg —
   senza .pg-side la sua griglia a 2 colonne (248px + contenuto) lasciava una
   colonna VUOTA a sinistra. Scelta l'opzione «rimuovi la classe» (il flex nella
   media query globale avrebbe messo in riga le card delle pagine conto).
   .as-page riporta il solo guscio che serviva di .pg (padding e testo).
   ──────────────────────────────────────────────────────────────────────────── */
.as-page{padding:14px 12px 44px;color:#22303f;font-variant-numeric:tabular-nums}
.as-page a{color:#276aa6}
.as-card-b{padding:12px 14px}
.as-wrap{--gold:#f5b301;--dim:#93a6bd;--line:rgba(128,128,128,.16);max-width:1080px;margin:0 auto}
  .as-top{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:12px}
  .as-toggle{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
  .as-toggle a{padding:7px 16px;text-decoration:none;color:inherit;font-weight:800;font-size:.85rem}
  .as-toggle a.on{background:#8DC63F;color:#0b2038}
  .as-hint{font-size:.78rem;opacity:.7}
  .as-scr{overflow-x:auto}
  /* GRIGLIA coerente (Angelo 24/07): stesse colonne su header e righe; le 3 colonne mercato hanno
     larghezza uguale, l'evento è la colonna elastica. `align-items:stretch` + min-height uniforme
     tengono celle piene e «—» della stessa altezza, senza collassi. */
  .as-head,.as-row{display:grid;grid-template-columns:minmax(150px,1.7fr) 1.15fr 1.15fr 1.15fr;
    gap:8px;min-width:680px}
  .as-head{padding:4px 10px;color:var(--dim);font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;align-items:center}
  .as-head .c{text-align:center}
  .as-row{padding:7px 10px;margin-bottom:5px;border:1px solid var(--line);border-radius:10px;
    background:rgba(128,128,128,.05);align-items:stretch}
  .as-teams{min-width:0;display:flex;flex-direction:column;gap:1px;justify-content:center}
  .as-teams b{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .as-teams .t2{opacity:.7}
  .as-when{font-size:.7rem;opacity:.55;margin-top:1px}
  .as-when .lv{color:#e0261a;font-weight:800}
  /* ogni colonna-mercato è SEMPRE una griglia interna a larghezze uguali: 3 celle (1X2) o 2 (AH/OU);
     un «—» a mercato assente OCCUPA l'intera colonna (grid-column:1/-1), stesso spazio della piena. */
  .as-pair{display:grid;gap:4px}
  .as-pair.p3{grid-template-columns:1fr 1fr 1fr}.as-pair.p2{grid-template-columns:1fr 1fr}
  .as-cell{display:flex}
  .as-cell form{display:flex;width:100%}
  /* Dav 26/07 («fallo come gli altri, non con sfondo nero»): fondo, testo, bordo, hover e
     stato attivo li dà la classe del TEMA `qt-btn` (la stessa della vista classica) — qui
     restano SOLO le misure di layout della griglia asiatica. Niente copie di grafica. */
  .as-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:1px;min-width:0;min-height:40px}
  .as-btn .lab{font-size:.64rem;opacity:.6;white-space:nowrap}
  /* il numero BLU della vista classica è il token del tema (--qt-color-b, lo stesso che
     template_c dà ai .qt-btn della lista): si riusa la VARIABILE, mai il valore copiato */
  .as-btn .od{font-variant-numeric:tabular-nums;color:var(--qt-color-b,inherit)}
  .as-btn[disabled]{opacity:.45;cursor:not-allowed}   /* sospeso: velo, come le celle bloccate */
  .as-mt{grid-column:1 / -1;display:flex;align-items:center;justify-content:center;min-height:40px;
    opacity:.3;border:1px dashed var(--line);border-radius:8px}
  .as-lg{margin:14px 0 6px;font-weight:800;color:var(--gold);font-size:.88rem}
  .as-none{padding:26px 10px;text-align:center;opacity:.7}