/* Registro risultati — stili specifici. La base è in ../comune/stile.css e ../comune-dati/dati.css. */

#periodo .scelte { max-width: 520px; }

.quattro {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.quattro:empty { display: none; }
.quattro div {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.12);
  border-radius: var(--raggio-piccolo);
  min-width: 0;
}
.quattro span { font-size: 13px; font-weight: 700; opacity: .9; }
.quattro strong { font-size: 24px; font-weight: 800; line-height: 1.1; overflow-wrap: anywhere; }

.tre { display: grid; gap: 14px; }
@media (min-width: 520px) {
  .tre { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
}

.righe { margin: 8px 0 0; padding-left: 20px; display: grid; gap: 6px; font-size: 15px; }

.sicuro-corpo { display: grid; gap: 8px; margin-top: 12px; }
.sicuro-corpo p { margin: 0; }
.frase-forte { font-weight: 700; font-size: 17px; line-height: 1.4; margin: 0; }
.frase-forte:empty { display: none; }

.barra-intervallo {
  position: relative;
  height: 28px;
  margin: 6px 8px 0;
}
.barra-intervallo::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 13px;
  height: 2px;
  background: var(--linea);
}
.bi-tratto {
  position: absolute;
  top: 8px;
  height: 12px;
  background: var(--accento);
  opacity: .35;
  border-radius: 6px;
}
.bi-zero {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  margin-left: -1px;
  background: var(--testo);
}
.bi-punto {
  position: absolute;
  top: 6px;
  width: 16px;
  height: 16px;
  margin-left: -8px;
  border-radius: 50%;
  background: var(--accento);
  border: 2px solid var(--fondo);
}
.bi-etichette {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 700;
  color: var(--tenue);
}

#gruppi .scelte { margin-bottom: 4px; }
#gruppi .scelte button { min-width: 0; flex: 1 1 calc(50% - 6px); }
@media (min-width: 520px) { #gruppi .scelte button { flex: 1 1 0; } }

.aggiungi [data-scelta="formula"] button { flex: 1 1 calc(33% - 6px); min-width: 0; }

.due-cifre { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
@media (max-width: 400px) { .due-cifre { grid-template-columns: minmax(0, 1fr) !important; } }

.collegamento { margin: 0; }
p.responsabile { margin: 0; color: var(--tenue); font-size: 14px; }

#gruppi .tabella th, #gruppi .tabella td { padding: 8px 4px; font-size: 13px; }

.quattro small { font-size: 12px; opacity: .85; line-height: 1.3; }
#spiega-formula { display: block; margin-top: 6px; color: var(--tenue); font-size: 13px; }

/* Riquadro "A cosa serve / Quando usarlo": sempre visibile in alto. */
.a-cosa-serve {
  display: grid;
  gap: 8px;
  padding: 14px 16px;
  background: var(--fondo-2);
  border: 1px solid var(--linea);
  border-left: 5px solid var(--accento);
  border-radius: var(--raggio-piccolo);
}
.a-cosa-serve p { margin: 0; font-size: 16px; line-height: 1.45; }
.a-cosa-serve strong { color: var(--accento-scuro); }