/* Le sfide sulla giornata (15/10/2026, anteprima). Veste di stazione come
   il gioco rifatto (gioco2.css): linea gialla sotto la testa, colori dai
   gettoni del sito per reggere tema chiaro e scuro. */
.sf { max-width: 760px; margin: 0 auto; padding: 24px 16px 40px; display: grid; gap: 16px; color: var(--rm-ink); }
.sf .mono { font-family: 'JetBrains Mono', ui-monospace, monospace; font-variant-numeric: tabular-nums; }
.sf-testa { display: grid; gap: 8px; padding-bottom: 14px; border-bottom: 3px solid #ffd23f; }
.sf-badge {
  justify-self: start; font: 700 11px/1 'Inter', system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase;
  color: #071b33; background: #ffd23f; padding: 5px 8px; border-radius: 4px;
}
.sf h1 { margin: 0; font-size: var(--rm-h2, 1.6rem); }
.sf-sotto { margin: 0; color: var(--rm-muted); max-width: 62ch; }
.sf-h2 { margin: 12px 0 0; font-size: var(--rm-h3, 1.2rem); }
.sf-lista { display: grid; gap: 10px; }
.sf-card {
  display: grid; gap: 8px; padding: 16px; border-radius: 12px;
  background: var(--rm-surface); border: 1px solid var(--rm-line);
}
.sf-card h2 { margin: 0; font-size: 1.08rem; line-height: 1.3; text-wrap: balance; }
.sf-card.sf-fatta { border-color: rgba(var(--rm-brand-rgb, 21,123,255), .55); }
.sf-card.sf-passata { background: transparent; }
.sf-nota { margin: 0; font-size: .86rem; color: var(--rm-muted); }
.sf-mia, .sf-esito { margin: 0; }
.sf-esito b { font-size: 1.15rem; }
.sf-t-si { color: var(--rm-green, #22c55e); }
.sf-t-no { color: var(--rm-red, #f0554d); }
.sf-scelte { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; }
.sf-b {
  min-width: 88px; padding: 11px 18px; border-radius: 9px; cursor: pointer;
  font: 700 1rem/1 'Inter', system-ui, sans-serif; color: var(--rm-ink);
  background: transparent; border: 1px solid var(--rm-line); border-top: 4px solid var(--sf-c);
  transition: transform 160ms ease-out, background-color 160ms ease;
}
.sf-b:hover { background: rgba(var(--rm-ink-rgb, 232,237,244), .06); }
.sf-b:active { transform: scale(.97); }
.sf-b-si { --sf-c: var(--rm-green, #22c55e); }
.sf-b-no { --sf-c: var(--rm-red, #f0554d); }
.sf-vale { margin-left: auto; font-size: .9rem; color: #ffd23f; }
.sf-vuoto { margin: 0; padding: 20px; border: 1px dashed var(--rm-line); border-radius: 12px; color: var(--rm-muted); }
.sf-piede { margin-top: 8px; }
@media (prefers-reduced-motion: reduce) { .sf-b { transition: none; } }