/* ETICHETTE — i cartellini. Compagno di `etichette.js`.

   🔴 I due colori stanno FUORI dalla tavolozza di qualunque progetto, e non è
   un vezzo: un cartellino che si può scambiare per una decisione di disegno
   brucia in chiarimenti il tempo che doveva far risparmiare. Rosso segnale e
   verde acido non compaiono in nessuna palette di marca, quindi non c'è modo
   di confonderli.

   🔴 Qui non c'è NESSUNA regola che tocchi la pagina. I cartellini sono
   elementi di uno strato che `etichette.js` appende a `<html>` e posa dove
   dicono i riquadri misurati. Fino al 2/10/2026 erano il `::before` del pezzo,
   reso `position: relative` per reggerlo: rubavano lo pseudo-elemento a chi ne
   aveva uno suo, non comparivano su `svg`, `img`, `canvas` e `input`, che non
   ne hanno, e spostavano i figli assoluti. Una regola delle etichette sopra un
   pezzo della pagina è il modo in cui il provino smette di essere fedele.

   Spente le etichette lo strato non esiste: di questo foglio non resta un pixel. */

/* Largo zero e alto zero: non occupa niente e non intercetta niente. `all`
   azzera quello che il foglio del sito direbbe a un `div` e a un `i` qualsiasi. */
.etichette-strato {
  all: initial;
  position: absolute; top: 0; left: 0; width: 0; height: 0;
  z-index: 2147483000; pointer-events: none;
}
.etichette-strato i {
  all: initial;
  position: absolute; top: 0; left: 0; pointer-events: none;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 700; font-size: 10px; line-height: 1; letter-spacing: 0.04em;
  padding: 3px 5px; border-radius: 4px; white-space: nowrap;
  background: #00C2A8; color: #06231F;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}
/* La sezione porta anche il NOME accanto al numero, e non è ridondanza: se la
   schermata cambia, una sezione compare o sparisce e i numeri slittano tutti.
   Col nome, «1.4 · recupero» resta lo stesso indirizzo anche domani. */
/* E sta sopra i cartellini dei pezzi: dove i due si toccano (uno spigolo in
   comune, una testata fitta) è l'indirizzo della sezione quello che non si può
   perdere, perché gli altri cominciano tutti con lui. */
.etichette-strato i.sezione { background: #FF1F4B; color: #FFFFFF; z-index: 1; }
/* Livello 2 — ogni dettaglio. A questa densità i cartellini si rimpiccioliscono
   e (lo fa `posa`) si appoggiano allo spigolo invece di sporgere. */
.etichette-strato--fitto i:not(.sezione) {
  font-size: 8px; padding: 2px 3px; border-radius: 3px;
  box-shadow: none; opacity: 0.94;
}
.etichette-strato--fitto i.sezione { font-size: 9px; }

@media print { .etichette-strato { display: none; } }
