/* Pagina di stato delle piattaforme (status.html e traduzioni).
   Colori di stato: verde operativo, ambra degradato, rosso non raggiungibile,
   grigio senza dati. Ogni stato ha anche un testo: il colore da solo non basta. */
.st-content{padding-top:70px}
.st-app{max-width:var(--max);margin:0 auto}
.st-caricamento,.st-vuoto{color:#40546b;font-size:15px}
.st-banner{display:flex;align-items:center;gap:14px;padding:20px 24px;border-radius:10px;border:1px solid;font:500 17px/1.35 Inter,sans-serif;margin:0 0 28px}
.st-banner--ok{background:#e7f7ee;border-color:#9fd9b8;color:#0f5a33}
.st-banner--warn{background:#fff5e0;border-color:#f0cf8a;color:#7a4b00}
.st-banner--down{background:#fdebea;border-color:#f2a9a5;color:#7d1f19}
.st-banner--none{background:#eef2f6;border-color:#cbd8e5;color:#40546b}
.st-dot{width:12px;height:12px;border-radius:50%;flex:none;background:currentColor}
.st-row{background:#fff;border:1px solid #d5dfe9;border-radius:10px;padding:22px 24px;margin:0 0 14px}
.st-row-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.st-nome{font:500 18px 'Inter Tight',Inter,sans-serif;color:#081a31;text-decoration:none}
.st-nome:hover,.st-nome:focus-visible{color:var(--blue)}
.st-nome span{font:400 12px DM Mono,monospace;color:#65778c;margin-left:10px;letter-spacing:.03em}
.st-pill{display:inline-flex;align-items:center;gap:8px;font:400 11px DM Mono,monospace;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:99px;white-space:nowrap}
.st-pill .st-dot{width:8px;height:8px}
.st-pill--ok{background:#e7f7ee;color:#0f5a33}
.st-pill--lento{background:#fff5e0;color:#7a4b00}
.st-pill--giu{background:#fdebea;color:#7d1f19}
.st-pill--none{background:#eef2f6;color:#40546b}
.st-bars{display:flex;gap:2px;height:34px;margin:6px 0 8px}
.st-bar{flex:1 1 0;min-width:1px;border-radius:2px;background:#dde5ee;transition:opacity .15s}
.st-bar:hover{opacity:.7}
.st-bar--ok{background:#22a35b}
.st-bar--warn{background:#e0a020}
.st-bar--down{background:#d8443b}
.st-bar--none{background:#dde5ee}
/* Giorni dichiarati, non misurati: stesso colore ma piu' tenue, cosi' si
   distingue a colpo d'occhio quel che il monitor ha rilevato. */
.st-bar--dich{opacity:.42}
.st-bar--dich:hover{opacity:.62}
.st-durata--dich{font-style:italic;opacity:.85}
.st-legenda{display:flex;justify-content:space-between;font:400 11px DM Mono,monospace;color:#65778c;letter-spacing:.04em}
.st-stats{display:flex;gap:30px;flex-wrap:wrap;margin-top:16px;align-items:flex-end}
.st-uptime{font:500 28px/1 'Inter Tight',Inter,sans-serif;color:#081a31}
.st-uptime small{display:block;font:400 10px DM Mono,monospace;letter-spacing:.1em;text-transform:uppercase;color:#65778c;margin-top:7px}
.st-stat{font:400 13px/1.5 Inter,sans-serif;color:#40546b}
.st-stat b{color:#081a31;font-weight:500}
.st-incidenti{margin:40px 0 0}
.st-incidenti h2{font:500 22px 'Inter Tight',Inter,sans-serif;color:#081a31;margin:0 0 14px;letter-spacing:-.02em}
.st-incidenti ul{list-style:none;margin:0;padding:0;border-bottom:1px solid #d5dfe9}
.st-incidenti li{padding:12px 0;border-top:1px solid #d5dfe9;display:flex;gap:16px;flex-wrap:wrap;font-size:14px;color:#40546b;align-items:baseline}
.st-incidenti li b{color:#081a31;font-weight:500;min-width:96px}
.st-incidenti li .st-durata{font:400 12px DM Mono,monospace;color:#7d1f19;margin-left:auto}
.st-agg{margin:26px 0 0;font:400 12px/1.6 DM Mono,monospace;color:#65778c;letter-spacing:.03em}
.st-metodo{max-width:var(--max);margin:64px auto 0;padding-top:44px;border-top:1px solid #cbd8e5;display:grid;grid-template-columns:1fr 2fr;gap:40px}
.st-metodo .kicker{color:#1763cc}
.st-metodo h2{font:500 clamp(26px,3vw,34px)/1.1 'Inter Tight',Inter,sans-serif;color:#081a31;margin:10px 0 0;letter-spacing:-.03em}
.st-metodo p{color:#40546b;font-size:15px;line-height:1.75;margin:0 0 14px}
.st-metodo p:last-child{margin-bottom:0}
@media(max-width:760px){
  .st-metodo{grid-template-columns:1fr;gap:14px;margin-top:44px}
  .st-bars{gap:1px;height:28px}
  .st-bar{border-radius:1px}
  .st-uptime{font-size:24px}
  .st-row{padding:16px}
  .st-banner{font-size:15px;padding:16px 18px}
  .st-stats{gap:18px}
}