/* Test de vitesse d'une page, Nemo Ciment
   Se charge après outils.css, dont il reprend .r-table, .pastille, .verdicts et le formulaire d'adresse. */

.source-ligne .btn { min-height: 46px; }
.strategie { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 12px 0 0; padding: 0; border: 0; }
.strategie label { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; text-transform: none; letter-spacing: 0; cursor: inherit; }
.strategie input { accent-color: var(--pink); }

.r-table tbody th[scope] { width: 40%; }
.pastille.v-bon { background: rgba(34,197,94,.16); color: #4ade80; }
.pastille.v-moyen { background: rgba(245,165,36,.16); color: #f5c264; }
.pastille.v-mauvais { background: rgba(239,68,68,.16); color: #f87171; }
.v-aide { margin-top: 2px; font-size: 13px; color: var(--muted-2); font-weight: 400; }
.lien-rapport { margin-top: 18px; }

@media (max-width: 640px) {
  .r-table tbody tr { grid-template-columns: 1fr; }
}
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Score de performance en tête du résultat (anneau construit par vitesse.js) */
.v-score { display: flex; align-items: center; gap: 24px; margin: 18px 0 8px; padding: 20px 24px; border: 1px solid currentColor; border-radius: 18px; }
.v-score.v-bon { color: #4ade80; background: rgba(34,197,94,.06); }
.v-score.v-moyen { color: #f5c264; background: rgba(245,165,36,.06); }
.v-score.v-mauvais { color: #f87171; background: rgba(239,68,68,.06); }
.v-anneau { position: relative; flex: none; width: 120px; height: 120px; }
.v-anneau svg { display: block; width: 100%; height: 100%; transform: rotate(-90deg); }
.v-piste { fill: none; stroke: rgba(255,255,255,.08); stroke-width: 10; }
.v-arc { fill: none; stroke: currentColor; stroke-width: 10; stroke-linecap: round; }
.v-nombre { position: absolute; inset: 0; display: grid; place-items: center; font: 600 42px/1 var(--font-display); color: currentColor; font-variant-numeric: tabular-nums; }
.resultats .v-legende p { margin: 0; }
.resultats .v-legende .v-titre { font-family: var(--font-display); font-size: 21px; line-height: 1.25; color: var(--ink); }
.resultats .v-legende .v-bande { margin-top: 2px; font-size: 17px; font-weight: 600; color: currentColor; }
.resultats .v-legende .v-note { margin-top: 6px; font-size: 13.5px; line-height: 1.5; color: var(--muted-2); }
@media (max-width: 500px) {
  .v-score { gap: 16px; padding: 16px; }
  .v-anneau { width: 92px; height: 92px; }
  .v-nombre { font-size: 32px; }
}
