/* The gym's settings as a wall of sections («Tessera viva», wave 4b): viste/app/impostazioni.php and _sezione.php (the
   record cards of app-record.css). The state of a section says itself on a pill whose light is the only colour (green:
   done, amber: worth a look, red: something waits). Shared tokens only. Prefix ip-. */
.gx .ip-stato { justify-self: start; display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 8px; border-radius: 999px; font-size: .8rem; font-weight: 700;
  background: var(--bg); color: var(--ink-2) }
.gx .ip-stato::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--ink-3) }
.gx .ip-stato--ok { background: var(--ok-soft); color: var(--ok) }
.gx .ip-stato--ok::before { background: var(--ok) }
.gx .ip-stato--warn { background: var(--warn-soft); color: var(--warn) }
.gx .ip-stato--warn::before { background: var(--warn) }
.gx .ip-stato--ko { background: var(--ko-soft); color: var(--ko) }
.gx .ip-stato--ko::before { background: var(--ko) }
.gx .ip-perche { display: flex; gap: 6px; align-items: flex-start; font-size: .85rem; color: var(--ink-3) }
.gx .ip-perche svg { flex: none; margin-top: 2px }