/* Console della Redazione. Tema chiaro e scuro secondo il sistema: la si apre
   dal telefono la sera, e un bianco pieno al buio non aiuta a leggere un testo
   che devi giudicare. */
:root {
  color-scheme: light dark;
  --sfondo: #fbfbfa; --carta: #fff; --testo: #1c1b19; --tenue: #6b6862;
  --bordo: #e2ded7; --si: #1f7a45; --no: #a8321f; --evidenza: #2b5cb8;
}
@media (prefers-color-scheme: dark) {
  :root {
    --sfondo: #17181a; --carta: #202225; --testo: #e8e6e3; --tenue: #9a968f;
    --bordo: #33363b; --si: #4cb87a; --no: #e0705c; --evidenza: #7aa5f0;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--sfondo); color: var(--testo);
  font: 16px/1.6 -apple-system, system-ui, "Segoe UI", sans-serif; }
nav { display: flex; gap: 1.2rem; align-items: center; padding: .9rem 1.4rem;
  background: var(--carta); border-bottom: 1px solid var(--bordo); flex-wrap: wrap; }
nav .spinta { flex: 1; }
nav .chi { color: var(--tenue); font-size: .9rem; }
main { max-width: 62rem; margin: 0 auto; padding: 1.6rem 1.4rem 5rem; }
a { color: var(--evidenza); }
h1 { font-size: 1.6rem; line-height: 1.25; margin: .4rem 0 .2rem; }
h2 { font-size: 1.05rem; margin: 1.6rem 0 .5rem; }
.tenue, .meta { color: var(--tenue); font-size: .9rem; }
.guasto { color: var(--no); }
.avviso { padding: .7rem 1rem; border-radius: 8px; border: 1px solid var(--bordo); }
.avviso.errore { border-color: var(--no); color: var(--no); }
.avviso.esito { border-color: var(--si); color: var(--si); }

ul.pezzi { list-style: none; padding: 0; }
ul.pezzi li { padding: .8rem 1rem; background: var(--carta); border: 1px solid var(--bordo);
  border-radius: 8px; margin-bottom: .6rem; }
ul.pezzi a { font-weight: 600; text-decoration: none; }
.etichetta { font-size: .78rem; padding: .1rem .5rem; border-radius: 99px; border: 1px solid; }
.etichetta.si, td.si { color: var(--si); }
.etichetta.no, td.no { color: var(--no); }

/* Post e articolo affiancati, perche' sono due testi diversi e il confronto e'
   il punto: si sbaglia molto piu' spesso quello corto. Sotto gli 800px vanno
   in colonna, che e' come si legge dal telefono. */
.due { display: grid; grid-template-columns: 1fr 1fr; gap: 1.6rem; }
@media (max-width: 800px) { .due { grid-template-columns: 1fr; } }
.due section { min-width: 0; }
.anteprima { background: var(--carta); border: 1px solid var(--bordo); border-radius: 8px;
  padding: 1rem 1.2rem; max-height: 34rem; overflow-y: auto; }
.anteprima h2 { font-size: 1rem; margin-top: 1.2rem; }
textarea { width: 100%; font: inherit; padding: .7rem .8rem; border-radius: 8px;
  border: 1px solid var(--bordo); background: var(--carta); color: var(--testo); resize: vertical; }
label { display: block; margin-bottom: .8rem; }
input { width: 100%; font: inherit; padding: .6rem .7rem; border-radius: 8px;
  border: 1px solid var(--bordo); background: var(--carta); color: var(--testo); }
button { font: inherit; padding: .6rem 1.4rem; border-radius: 8px; cursor: pointer;
  border: 1px solid var(--bordo); background: var(--carta); color: var(--testo); }
button.si { border-color: var(--si); color: var(--si); font-weight: 600; }
button.no { border-color: var(--no); color: var(--no); }
.bottoni { display: flex; gap: .8rem; margin-top: .9rem; }
.deciso { padding: .8rem 1rem; border-radius: 8px; border: 1px solid var(--bordo);
  margin: 1rem 0; }
.deciso.si { border-color: var(--si); } .deciso.no { border-color: var(--no); }
.deciso form { display: inline; }
.deciso button { border: none; background: none; padding: 0; text-decoration: underline; }
.entra { max-width: 22rem; margin: 4rem auto; }
table { width: 100%; border-collapse: collapse; font-size: .92rem; }
th, td { text-align: left; padding: .5rem .6rem; border-bottom: 1px solid var(--bordo);
  vertical-align: top; word-break: break-word; }
th { color: var(--tenue); font-weight: 600; }
.fonti { font-size: .88rem; margin-top: .8rem; }

/* Le fonti archiviate. Il testo si mostra come TESTO, non riformattato: chi
   verifica deve poter cercare una frase esatta e trovarla identica. */
.fonte { background: var(--carta); border: 1px solid var(--bordo); border-radius: 8px;
  padding: 1rem 1.2rem; margin-bottom: 1.4rem; }
.fonte .meta a { font-size: .85rem; word-break: break-all; }
.fonte .riga { display: flex; gap: .9rem; flex-wrap: wrap; color: var(--tenue);
  font-size: .8rem; margin: .5rem 0 .8rem; align-items: center; }
.fonte .impronta { font-family: ui-monospace, Menlo, monospace; opacity: .7; }
.fonte .tit { font-weight: 600; margin: 0 0 .6rem; }
.fonte .testo { white-space: pre-wrap; word-break: break-word; font: .86rem/1.55 inherit;
  background: var(--sfondo); border: 1px solid var(--bordo); border-radius: 6px;
  padding: .8rem 1rem; max-height: 26rem; overflow-y: auto; margin: 0; }