/* ═══════════════════════════════════════════════════════════════════
   WORKOUTS v2 — CODIFICHE: il form del WOD del coach (griglia e testate,
   che gli editor sotto estendono) e gli editor dei WOD codificati (serie,
   RFT, Intervals, qualificatori) insieme al modificatore Scaled della
   sheet dell'atleta. Le due viste condividono .rft-line / .rft-q /
   .set-edit / .sc-* / .griglia: per questo stanno in un file solo,
   caricato da ENTRAMBE le basi dopo base.css.
   ⚠️ L'ordine dentro il file conta (.sc-box sta DOPO .rft-line e
   .rft-quals di proposito; .rft-scelte dopo .griglia): si aggiunge in
   fondo, non si riordina. Le regole marcate «13.1» sono compensazioni di
   cascata trovate con css_diff.py.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Coach: il form del WOD, riorganizzato (2026-08-24) ─────────────
   Quattro sezioni con una testata forte al posto di tre riquadri uguali,
   e una griglia di 12 colonne: ogni campo ne occupa un numero intero,
   così i bordi si allineano da una riga all'altra. Deciso con Roberta
   guardando la pagina su un monitor, non sul telefono: lì il problema non
   è lo spazio che manca ma quello che avanza — il titolo del WOD era un
   campo largo 1465px. ⚠️ Nessun campo, nessun testo e nessun aggancio JS
   è cambiato: solo dove stanno le cose. */
.griglia { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px var(--s4); }
.griglia > * { min-width: 0; }
.c2 { grid-column: span 2; } .c3 { grid-column: span 3; } .c4 { grid-column: span 4; }
.c6 { grid-column: span 6; }
.c9 { grid-column: span 9; } .c12 { grid-column: span 12; }
/* ⚠️ SOLO i campi diretti: dentro gli editor i campi hanno misure loro (il
   numero di round, le reps) e allargarli al 100% sfondava la riga */
.griglia > .field > input, .griglia > .field > select, .griglia > .field > textarea {
  width: 100%; max-width: 100%; box-sizing: border-box;
}
.sez {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  margin-bottom: var(--s3);
  overflow: hidden;
}
.sez-head {
  display: flex;
  align-items: stretch;
  gap: var(--s3);
  padding: 14px var(--s4);
  border-bottom: 1px solid var(--line);
  background: var(--vel);
}
.sez-head::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--tinta);
}
.sez-ic {
  display: grid;
  place-items: center;
  width: 38px; height: 38px;
  border-radius: 11px;
  background: var(--vel-ic);
  color: var(--tinta);
  flex: none;
  align-self: center;
}
.sez-ic .icon { width: 19px; height: 19px; }
.sez-testi { display: flex; flex-direction: column; justify-content: center; }
.sez-tit {
  font-size: 17px;
  font-weight: 700;
  color: var(--text);
  text-transform: none;
  line-height: 1.25;
  margin: 0;
}
.sez-sub { font-size: var(--fs-sm); color: var(--muted); margin-top: 2px; line-height: 1.35; }
.sez-corpo { padding: 18px var(--s4) 4px; }
/* il viola si spegne scendendo: la gerarchia si vede senza leggere */
.sez--a { --tinta: var(--brand-light); --vel: rgba(var(--accent-rgb), .13); --vel-ic: rgba(var(--brand-light-rgb), .16); }
.sez--b { --tinta: var(--tinta-sez-b); --vel: rgba(var(--accent-rgb), .10); --vel-ic: rgba(var(--accent-rgb), .18); }
.sez--c { --tinta: var(--tinta-sez-c); --vel: rgba(var(--accent-rgb), .07); --vel-ic: rgba(var(--accent-rgb), .13); }
.sez--d { --tinta: var(--tinta-sez-d); --vel: rgba(255,255,255,.035); --vel-ic: rgba(255,255,255,.07); }

/* interruttore in linea al posto della casellina di sistema: è la levetta
   del profilo atleta (.pf-sw), riusata qui.
   ⚠️ `.field > label` mette MAIUSCOLETTO, spaziatura e display:block su
   OGNI label dentro un campo: senza questo azzeramento il testo diventa
   tutto maiuscolo e la levetta si accartoccia sopra le parole. */
.field > label.sw-linea, label.sw-linea {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: max-content;
  max-width: 100%;
  margin: 0 0 var(--s2);
  padding: 0;
  text-transform: none;
  letter-spacing: 0;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--text);
  cursor: pointer;
}
.sw-linea .pf-sw { flex: none; }
.sw-linea .sw-testo { font-size: 13.5px; font-weight: 500; }
/* la spunta delle auto-maiuscole la disegna editor.js: stessa levetta */
.quill-autocap { margin-bottom: 14px; }

/* ⚠️ I CAMPI NON SI STIRANO: senza questo un campo della griglia prende
   l'altezza della RIGA, e l'editor (che è alto il 100% del suo campo, lo
   dice quill.snow.css) si incastra in un conto circolare — risultato: il
   testo di aiuto usciva dal riquadro e finiva sopra a quello del campo
   accanto (fotografato da Roberta il 2026-08-24). */
.griglia { align-items: start; }

/* l'editor come UN riquadro solo: barra degli strumenti e foglio dentro
   la stessa cornice, invece di due scatole appoggiate una sull'altra */
.field .ql-toolbar.ql-snow {
  border: 1px solid var(--line);
  border-bottom-color: rgba(255, 255, 255, .06);
  border-radius: var(--r-md) var(--r-md) 0 0;
  background: var(--surface-2);
  padding: 7px 10px;
}
.field .ql-container.ql-snow {
  border: 1px solid var(--line);
  border-top: none;
  border-radius: 0 0 var(--r-md) var(--r-md);
  background: var(--surface-2);
  height: auto;
  min-height: 190px;
}
.field .quill-holder { background: none; border-radius: 0 0 var(--r-md) var(--r-md); }
.field .ql-editor { padding: 14px 16px; }
/* il fuoco si vede sul riquadro intero, come sugli altri campi */
.field .ql-container.ql-snow:focus-within { border-color: var(--purple-line); }
.field .ql-toolbar.ql-snow:has(+ .ql-container:focus-within) { border-color: var(--purple-line); }
/* ⚠️ i bottoni della barra sono COMANDI, e stavano nel grigio dei testi
   spenti: non si leggevano (Roberta, 2026-08-24). Vanno in bianco, e il
   grigio resta al segnaposto, che è un suggerimento e non un comando. */
.field .ql-toolbar.ql-snow .ql-stroke { stroke: var(--text); }
.field .ql-toolbar.ql-snow .ql-fill { fill: var(--text); }
.field .ql-toolbar.ql-snow .ql-rest::before,
.field .ql-toolbar.ql-snow .ql-uppercase::before,
.field .ql-toolbar.ql-snow .ql-lowercase::before { color: var(--text); }
.field .ql-toolbar.ql-snow .ql-cn::before { background: var(--text); margin: 0; }
/* ⚠️ i tre bottoni delle sezioni portano anche la PAROLA: con la sola
   icona il coach deve ricordarsi a memoria quale è WOD GOAL e quale
   SCALING (Roberta, 2026-08-24). L'icona resta, il testo la spiega. */
.field .ql-toolbar.ql-snow button.ql-cn {
  width: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 9px;
}
.field .ql-toolbar.ql-snow .ql-cn::after {
  font-size: var(--fs-eyebrow);
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
}
.field .ql-toolbar.ql-snow .ql-cn[value="goal"]::after { content: 'WOD GOAL'; }
.field .ql-toolbar.ql-snow .ql-cn[value="movement"]::after { content: 'MOVEMENT GOALS'; }
.field .ql-toolbar.ql-snow .ql-cn[value="scaling"]::after { content: 'SCALING'; }
.field .ql-toolbar.ql-snow .ql-cn:hover::after,
.field .ql-toolbar.ql-snow .ql-cn.ql-active::after { color: var(--purple-hi); }
/* con tre parole in più la barra va a capo invece di tagliare */
.field .ql-toolbar.ql-snow { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; }
/* placeholder chiaro: --muted al 70% su fondo scuro faceva ~2.4:1 e si
   leggeva come una macchia nera (segnalato da Francesco, 2026-08-25) */
.field .ql-editor.ql-blank::before { color: var(--text); opacity: .8; font-style: normal; }

/* ⚠️ il campo DATA nativo è più alto degli altri: Chrome gli mette dentro
   l'icona del calendario e il conto dell'altezza non torna con quello di
   una tendina (50px contro 44). Inchiodato al bersaglio come gli altri. */
.griglia > .field > input[type="date"] { height: var(--tap); }

/* ⚠️ «es. 2:30» usciva dal riquadro: 90px non bastano per il segnaposto
   (ne servono 94 con le imbottiture) e il campo non può crescere, è
   `flex: 0 0 auto` (Roberta, 2026-08-24).
   ⚠️ selettore con .sez davanti: la regola originale sta più in basso nel
   file e a parità di forza vincerebbe lei. */
.sez .rest-row input { width: 120px; }

/* chiusura: Pubblicato e i bottoni riguardano TUTTO il WOD, quindi stanno
   fuori dalle sezioni. Il blocco è largo quanto i bottoni, così il
   riquadro di Pubblicato finisce dove finisce «Elimina WOD» anche se
   domani un bottone cambia parola. */
.chiusura { margin-top: var(--s5); padding-top: 4px; border-top: 1px solid var(--line); }
.chiusura-blocco { width: max-content; max-width: 100%; }
.chiusura .sw-linea {
  width: 100%;
  margin: var(--s4) 0 0;
  padding: 12px 14px;
  background: rgba(255, 255, 255, .03);
  border-radius: 12px;
  box-sizing: border-box;
}
.chiusura-riga { display: flex; align-items: center; gap: var(--s2); padding: 20px 0 8px; }
.chiusura-spazio { width: 1px; height: 28px; background: var(--line); margin: 0 10px; flex: none; }

/* «aggiungi una riga» = tratteggiato viola, come le tessere da riempire
   dell'atleta: si riconosce senza leggere e non compete col Salva.
   ⚠️ «Aggiungi video» invece è .btn-primary, viola come Salva: è l'unica
   azione della sua sezione e lì il tratteggio si perdeva (Roberta,
   2026-08-24). */
.btn-add { background: none; border: 1px dashed rgba(var(--accent-rgb), .55); color: var(--brand-light); }
.btn-add:hover { background: var(--btn-tint); border-color: var(--purple); color: var(--sel-fg); }

/* la variante Competitor in cima: riquadro suo, con accanto la
   spiegazione, e aria prima della prima sezione */
.variante-alto {
  display: flex;
  align-items: center;
  gap: var(--s3);
  flex-wrap: wrap;
  margin: 0 0 var(--s4);
  padding: 12px var(--s4);
  border-radius: var(--r-md);
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, .03);
}
.variante-nota { flex: 1; min-width: 260px; font-size: 12.5px; color: var(--muted); line-height: 1.45; }

/* ⚠️ «es. Every 2:30» non ci stava in 120px: il segnaposto cambia col
   tipo di recupero, e questo è il più lungo */
.sez .rest-row input { width: 156px; }
/* un bottone tiene la sua misura: la casella della griglia può essere
   larga, lui no */
.field .btn { width: max-content; max-width: 100%; }

/* il numero della serie: Anton grigio era pesante e fuori posto (Anton è
   riservato al nome del box). Inter, viola chiaro e incolonnato.
   ⚠️ selettore col contenitore: la regola originale sta più in basso nel
   file e a parità di forza vincerebbe lei */
.sets-editor .set-edit-num,
.iv-items .set-edit-num,
.iv-station-num {
  font-family: var(--font);
  font-weight: 700;
  font-size: 15px;
  color: var(--brand-light);
  width: 26px;
  min-width: 26px;
  text-align: center;
}
/* la riga dei round si stacca dal blocco che ha sotto */
#rft-field .rft-rounds-row {
  margin-bottom: var(--s4);
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
}
#rft-field .rft-rounds-row input { width: 56px; text-align: center; }

/* ══ WOD di forza: serie ═══════════════════════════════════════════── */
/* Una riga per serie nel log: la vecchia griglia auto-fill impacchettava
   2-3 caselle per riga e lasciava l'ultima orfana. Lo schema in sintesi lo
   dicono le righe auto-generate della descrizione (wod_auto_lines). */
/* log atleta: etichetta a sinistra, peso a destra */
.set-rows { display: flex; flex-direction: column; }
.set-row {
  display: flex;
  align-items: center;
  gap: var(--s3);
  min-height: var(--tap);
  padding: var(--s2) 0;
  border-bottom: 1px solid var(--line);
}
.set-row:last-child { border-bottom: none; }
.set-row-num {
  flex: 0 0 auto;
  min-width: 32px;
  margin-right: var(--s2);
  font-family: var(--font-display);
  font-size: var(--fs-sm);
  color: var(--muted);
}
.set-row-label {
  flex: 1;
  min-width: 0;
  font-size: var(--fs-sm);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--s2);
}
.set-row-pct { color: var(--purple-hi); font-weight: 700; }
.set-row input {
  flex: 0 0 auto;
  width: 92px;
  text-align: center;
}

/* ── editor serie (form coach) ─────────────────────────────────────── */
.sets-editor { display: flex; flex-direction: column; gap: var(--s2); }
.set-edit {
  display: flex;
  align-items: flex-start;
  gap: var(--s2);
  padding: var(--s2);
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
}
.set-edit-num {
  flex: 0 0 auto;
  min-width: 18px;
  padding-top: 10px;
  font-family: var(--font-display);
  color: var(--muted);
}
.set-edit-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: var(--s2); }
.set-items { display: flex; flex-direction: column; gap: var(--s2); }
/* position: relative = l'ancora della tendina dei suggerimenti, che la
   ricerca condivisa (lift_search.js) appende dentro l'item stesso */
.set-item { position: relative; display: flex; align-items: center; gap: var(--s2); flex-wrap: wrap; }
.set-item input[type=number] { width: 72px; text-align: center; }
.set-item .rft-search { flex: 1; min-width: 160px; }
/* su schermo stretto il campo del movimento resterebbe largo ~60px, cioè
   tutto ellipsis e niente testo: va a riga intera, sopra reps e cestino */
@media (max-width: 639px) {
  .set-item .rft-search { flex: 1 0 100%; order: -1; }
  /* duplica/elimina in colonna: 42px in più per il nome del movimento */
  .set-edit-tools { flex-direction: column; }
}
.set-edit-meta { display: flex; align-items: center; gap: var(--s2); flex-wrap: wrap; }
.set-pct, .set-ref {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--fs-sm);
  color: var(--muted);
}
.set-pct input { width: 76px; text-align: center; }
.set-ref select { max-width: 170px; }
.set-edit-tools { flex: 0 0 auto; display: flex; gap: 2px; }
.sets-editor-actions { margin-top: var(--s2); }
/* recupero fra le serie: select del tipo + tempo (solo every/between) */
.rest-row {
  display: flex;
  align-items: center;
  gap: var(--s2);
  margin-top: var(--s3);
}
.rest-row label { margin: 0; flex: 0 0 auto; }
.rest-row select { flex: 0 1 260px; width: auto; }
.rest-row input { flex: 0 0 auto; width: 90px; text-align: center; }
/* lo score dei track di forza non si cambia: bloccato senza `disabled`,
   che non verrebbe inviato nel POST */
select.is-locked, input.is-locked { opacity: .6; pointer-events: none; }

/* ── obbligatorietà dei qualificatori (catalogo, 0043) ─────────────── */
/* nel form matita: una riga per chip attiva, nome + select */
.qf-rows { display: flex; flex-direction: column; gap: 6px; }
.qf-row { display: flex; align-items: center; gap: var(--s2); margin: 0; }
.qf-row select { flex: 0 1 240px; width: auto; }
.qf-name { min-width: 120px; color: var(--muted); font-size: var(--fs-sm); }

/* L'header della matrice resta IN VISTA durante lo scroll (Francesco:
   senza header i pallini non si leggono). position: sticky muore dentro
   uno scroll-container, quindi il wrapper --sticky spegne l'overflow.
   ⭐ A OGNI larghezza (13.1 bis, Francesco 11/09: «l'intestazione
   sempre in alto»): fino ai 1130 c'era lo scroll orizzontale e l'header
   scorreva via; ora la tabella si stringe da sé (le azioni restano su
   una riga, va a capo il nome del movimento: coach.css) e sotto i 900
   diventa schede, quindi lo scroll non serve più. top = altezza della
   topbar sticky (min-height 60px, z-index 100: passandoci sotto l'header
   sparisce dietro di lei, mai sopra). */
.table-scroll--sticky { overflow-x: visible; }
.table-scroll--sticky .data-table thead th {
  position: sticky;
  top: 60px;
  z-index: 5;
  /* opaco: sotto ci scorrono le righe (stesso fondo della topbar) */
  background: var(--ink);
  /* con border-collapse il border-bottom non viaggia con la cella
     sticky (Chrome): il filo lo fa un'ombra, che invece la segue */
  border-bottom: 0;
  box-shadow: 0 1px 0 var(--line);
}

/* matrice in tabella (2026-08-24): sigle nell'header, un simbolo per
   stato in ogni cella — pieno = obbligatorio, anello = facoltativo,
   mezzo = alternativo, spento = disabilitato */
.movements-table .qm-head {
  width: 40px;
  text-align: center;
  font-variant-numeric: normal;
}
.movements-table .qm-cell { text-align: center; }
.qd {
  display: inline-block;
  width: 15px;
  height: 15px;
  padding: 0;
  border-radius: 50%;
  border: 2px solid var(--body-text);
  background: transparent;
  vertical-align: middle;
}
.qd--req { background: var(--body-text); }
/* metà diagonale: «una delle due» */
.qd--alt { background: linear-gradient(135deg, var(--body-text) 50%, transparent 50%); }
.qd--off { border: 1px solid var(--line); opacity: .55; }
/* la cella dell'admin è un bottone: alone all'hover, mai cambi di forma */
button.qd { cursor: pointer; }
button.qd:hover { box-shadow: 0 0 0 4px rgba(255, 255, 255, .12); }
.qm-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2) var(--s4);
  margin-bottom: var(--s2);
  color: var(--muted);
  font-size: var(--fs-sm);
}
.qm-legend > span { display: inline-flex; align-items: center; gap: 6px; }

/* modale della matrice: 4 opzioni, il tap salva subito */
.qual-options { display: flex; flex-direction: column; gap: var(--s1); }
.qual-opt {
  display: flex;
  align-items: center;
  gap: var(--s3);
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: var(--r-sm);
  background: none;
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.qual-opt:hover { background: rgba(255, 255, 255, .08); }
.qual-opt.on { border-color: var(--purple); background: var(--purple-dim); }
.qual-opt .qd { flex: 0 0 auto; }
.qual-opt-t { display: flex; flex-direction: column; }
.qual-opt-t .muted { font-size: var(--fs-sm); }

/* ── editor Rounds For Time (form coach, 0041) ─────────────────────────
   riusa il guscio .set-edit dell'editor serie; qui solo la riga dei
   round e i campi valore dei qualificatori */
.rft-rounds-row { display: flex; align-items: center; gap: var(--s2); }
.rft-rounds-row input { flex: 0 0 auto; width: 72px; text-align: center; }
.rft-rounds-caption { color: var(--muted); }
/* respiro fra la riga dei round e le righe movimento — SOLO nel form
   coach: nella score sheet il gap lo dà già il flex di .sc-editor-in */
#rft-field .rft-rounds-row { margin-bottom: var(--s2); }
/* movimento e qualificatori sulla stessa riga, come le reps nell'editor
   serie: quals compatti a sinistra, la ricerca prende lo spazio restante */
.rft-line { position: relative; display: flex; align-items: center; gap: var(--s2); flex-wrap: wrap; }
.rft-line .rft-search { flex: 1; min-width: 160px; }
/* su schermo stretto (la sheet sul telefono) il campo movimento
   schiacciato fra i valori non si legge: a riga intera sopra, come il
   select dell'editor serie */
@media (max-width: 639px) {
  .rft-line .rft-search { flex: 1 0 100%; order: -1; }
  /* ⚠️ La riga della soglia va a capo (2026-09-08): nel modificatore
     Scaled di un Intervals «A soglia» stanno in fila due caselle a
     larghezza FISSA (gli intervalli 150 + la soglia 170) con in mezzo la
     scritta della griglia, che si allarga. Su un telefono non ci
     stanno: la casella della soglia usciva di 70 punti e il numero da
     cambiare finiva fuori schermo. Le due caselle si dividono la riga —
     sono le uniche due cose che l'atleta può toccare — e la scritta
     della griglia, che si legge e basta, sta SOPRA (Roberta: prima è la
     griglia del coach, poi quello che ci metti tu). Le regole stanno
     qui e non accanto a .sc-round-campo per non aprire l'ennesima media
     query (Francesco ne vuole meno, non di più). */
  .sc-round-box:has(.sc-round-campo--tg) { flex-wrap: wrap; row-gap: 8px; }
  .sc-round-box:has(.sc-round-campo--tg) .sc-round-campo {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
  }
  .sc-round-box:has(.sc-round-campo--tg) .sc-fortime {
    order: -1;
    flex-basis: 100%;
  }
}
/* testo che non risolve nessun movimento del catalogo */
.rft-search.is-bad { border-color: var(--err-line); }
/* tendina dei suggerimenti (rft_editor.js): posizionata dal JS sotto il
   campo attivo, dentro la .rft-line (che è il position: relative) */
.rft-sugg {
  position: absolute;
  z-index: 30;
  display: flex;
  flex-direction: column;
  max-height: 320px;
  overflow-y: auto;
  padding: var(--s1);
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .45);
}
.rft-sugg-item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--s4);
  padding: 8px 10px;
  border: 0;
  border-radius: var(--r-sm);
  background: none;
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.rft-sugg-item:hover, .rft-sugg-item.is-act { background: rgba(255, 255, 255, .08); }
.rft-sugg-cat { color: var(--muted); font-size: var(--fs-sm); }
/* la voce «+ Aggiungi al catalogo» con 0 match (solo admin, 2026-08-24) */
.rft-sugg-add { color: var(--brand-light); }

/* modale «aggiungi movimento» (form WOD, solo admin): il guscio è la
   note-dialog, ma coi campi del catalogo dentro serve più respiro — e
   lo scroll interno, sennò su schermi bassi i bottoni finiscono fuori */
.lift-dialog {
  max-width: min(520px, 92vw);
  max-height: calc(100dvh - 4rem);
  overflow-y: auto;
}
.lift-dialog .field { margin-top: var(--s3); }
.lift-dialog .checkbox-field { margin-top: var(--s3); }
.lift-dialog .form-actions { margin-top: var(--s4); }

/* Ingressi e uscite MORBIDI (regola di Francesco, 2026-08-24: «gli
   effetti lato atleta sono obbligatori» — niente elementi a scatto).
   pop-in è il fratello corto di card-in; reduced-motion è coperto dal
   blocco globale in testa al file. */
@keyframes pop-in { from { opacity: 0; transform: translateY(4px); } }
@keyframes pop-out { to { opacity: 0; transform: translateY(4px); } }
/* la tendina è appesa al DOM a ogni apertura: l'animation riparte da sola */
.rft-sugg { animation: pop-in .15s ease; }
/* i campi valore ricompaiono col fade quando il movimento cambia:
   l'animation si ri-esegue a ogni display none→flex */
.rft-q:not([hidden]) { animation: pop-in .15s ease; }
/* righe dell'editor: --in la mette il JS sulle righe aggiunte, --out
   sulle eliminate (il nodo muore ad animazione finita; i name sono già
   stati tolti, la riga morente è solo scena) */
.set-edit--in { animation: pop-in .2s ease; }
.set-edit--out { animation: pop-out .15s ease both; pointer-events: none; }
.rft-quals { display: flex; align-items: center; gap: var(--s2); flex-wrap: wrap; }
.rft-q {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--muted);
}
.rft-q input { width: 84px; text-align: center; }
/* «o» fra i campi del gruppo alternativo (0043: Row per metri O calorie) */
.rft-q--or::before { content: 'o'; color: var(--muted); font-size: var(--fs-sm); }
/* modalità «Rep diverse round per round»: i valori sono sequenze
   («4-6-8-10-8-6-4»), gli 84px non bastano — la classe la mettono
   rft_editor.js (coach) e il template della score sheet (atleta) */
.rft-mode { margin-bottom: var(--s3); }
.rft--per-round .rft-q input,
.sc-editor--per-round .rft-q input { width: 150px; }
/* ── Editor Intervals/EMOM (form coach, 2026-08-25) ─────────────────
   Due livelli: la STAZIONE è una scatola numerata (S1, S2…) che
   raggruppa righe movimento identiche a quelle RFT. ⚠️ Grafica nuova
   solo lato coach (desktop): */
.iv-grid-row { display: flex; align-items: center; gap: var(--s2); flex-wrap: wrap; }
.iv-grid-row input { flex: 0 0 auto; width: 84px; text-align: center; }
.iv-grid-word { color: var(--muted); font-size: var(--fs-sm); }
.iv-stations { display: flex; flex-direction: column; gap: var(--s3); }
.iv-station {
  padding: var(--s2);
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
}
.iv-station-head {
  display: flex;
  align-items: center;
  gap: var(--s2);
  margin-bottom: var(--s2);
}
.iv-station-num {
  font-family: var(--font-display);
  color: var(--muted);
  margin-right: auto;
}
.iv-items { display: flex; flex-direction: column; gap: var(--s2); }
/* dentro la scatola stazione le righe non raddoppiano il fondo */
.iv-station .set-edit { background: transparent; border-color: var(--line); }
/* la chip MAX vive fra i campi valore: piccola come loro; la chip
   BUY-IN (2026-09-04) le sta accanto nello stesso guscio .iv-chips —
   prima stesura. */
.iv-max, .iv-buyin { font-size: var(--fs-sm); white-space: nowrap; }
.iv-chips { display: inline-flex; align-items: center; gap: var(--s2); }
/* la chip UNBROKEN (2026-09-07), terza nel guscio degli Intervals e
   sola in quello dell'RFT — prima stesura, grafica da rivedere con
   Roberta (con tre chip il guscio va a capo sotto gli 860px) */
.iv-unbroken, .rft-unbroken { font-size: var(--fs-sm); white-space: nowrap; }
/* 13.1: idem per le chip MAX / BUY-IN / UNBROKEN */
.chip.iv-max, .chip.iv-buyin, .chip.iv-unbroken, .chip.rft-unbroken { font-size: 12px; }
.iv-chips { flex-wrap: wrap; }
/* la chip PICK accanto al suo campo valore (0049): il qualificatore
   resta a scelta dell'atleta — prima stesura, grafica da rivedere con
   Roberta */
.rft-pick { font-size: var(--fs-sm); white-space: nowrap; }
/* 13.1: la chip (base.css) vinceva per ordine sulla misura del testo */
.chip.rft-pick { font-size: 12px; }
/* con gli score a tempo il MAX non esiste (lo spegne interval_editor.js,
   la classe la mette syncFlavor) */
#interval-field.iv--nomax .iv-max { display: none; }
#iv-cap-field { margin-top: var(--s2); }
#iv-cap-field input { width: 120px; }

/* modificatore del WOD codificato nella score sheet: il padding sta
   sull'INTERNO, mai su .clp-inner (i padding non collassano e una riga
   chiusa lascerebbe una striscia morta — lezione della board) */
.sc-editor-in {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--s2);
  padding-top: var(--s3);
}
.sc-editor-in .sets-editor, .sc-editor-in .rft-rounds-row { align-self: stretch; }

/* ── Modificatore Scaled: una scatola per movimento (2026-08-25) ────
   Grafica approvata da Roberta sui WOD codificati veri. Prima era una
   riga sola con scala, kg e movimento in fila: alla larghezza vera della
   sheet (420px) «4-6-8-10-8-6-4» sono 125px di testo e «Ring Muscle-up»
   122, quindi con i kg e la × qualcosa veniva sempre tagliato.
   ⚠️ Cambia solo il vestito: name, id e data-sc-* sono gli stessi, e
   `.rft-line` resta il contenitore su cui score_form.js appoggia la
   tendina dei suggerimenti.
   ⚠️ Questo blocco sta DOPO .rft-line e .rft-quals di proposito: a parità
   di forza vince l'ultima regola del file, e messo prima non attaccava
   niente (stessa trappola del form coach). */
.sc-box {
  display: block;
  background: rgba(255, 255, 255, .03);
  border-radius: 12px;
  padding: 8px;
}
.sc-box + .sc-box { margin-top: 8px; }
.sc-box-nome { display: flex; align-items: center; gap: 7px; margin-bottom: 7px; }
.sc-box-nome .rft-search { flex: 1; min-width: 0; padding-right: 34px; }
/* il guscio del campo: la freccia si appoggia al bordo DEL CAMPO, non a
   quello della riga, così sta al suo posto sia con la × accanto sia
   senza (2026-08-28) */
.sc-box-campo { position: relative; flex: 1; min-width: 0; }
.sc-box-campo .rft-search { width: 100%; flex: none; }
/* le frecce stanno DENTRO il campo del nome, a destra: dicono che quel
   campo si può cambiare, senza rubare un posto in riga */
.sc-box-swap {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 15px; height: 15px;
  color: var(--brand-light);
  pointer-events: none;
}
/* MAX, BUY-IN e UNBROKEN sono un'ETICHETTA SOPRA il campo (2026-09-08,
   Roberta), non una pastiglia in fondo alla riga: accanto al nome si
   prendevano la larghezza che volevano e il movimento usciva tagliato
   («Counter Movement Jun»), tanto peggio con la × accanto. Sopra si
   legge anche nell'ordine giusto: «questo è un buy-in» → «ed è Reverse
   Snow Angel».
   ⚠️ Senza fondo e senza filo viola: è un'informazione che arriva dal
   coach, non un comando da premere (regola del 2026-08-28, il contorno
   viola la faceva sembrare cliccabile). E senza lettere spaziate, come
   tutto il resto (2026-09-08).
   ⚠️ Il `flex-wrap` va scritto con .sc-box davanti: più in basso
   `.sc-box .rft-line` impone `nowrap` e vincerebbe.
   ⚠️ Lo `::before` è un'interlinea alta zero che manda l'etichetta su
   una riga sua. Costa DUE volte il row-gap (etichetta → riga vuota →
   campo), quindi 4px danno gli 8px sotto l'etichetta: gli stessi che
   la scatola le lascia sopra col suo padding. */
.sc-box .rft-line.sc-box-nome { flex-wrap: wrap; }
/* 13.1 (2026-09-11): nel file unico .log-tag (sheet) veniva DOPO
   .iv-max-tag e vinceva a pari forza su misura, raggio e colore; la
   sheet ora sta in base.css, caricato prima, e la vittoria si scrive per
   specificità (stessi valori di .log-tag). Le regole con contenitore qui
   sotto restano più forti come prima. */
.iv-max-tag.log-tag {
  font-size: 9px;
  padding: 4px 8px;
  border-radius: 6px;
  color: var(--grigio-66);
  background: rgba(255, 255, 255, .06);
}
.sc-box-nome:has(.iv-max-tag) { gap: 4px 10px; }
.sc-box-nome:has(.iv-max-tag)::before {
  content: '';
  flex: 0 0 100%;
  height: 0;
  order: -1;
}
.sc-box-nome .iv-max-tag {
  order: -2;
  margin-left: 0;
  align-self: auto;
  display: inline-flex;
  align-items: center;
  border: 0;
  background: transparent;
  padding: 0 2px;
  color: var(--muted);
}
/* il «N finestre» della testata di stazione parla la stessa lingua:
   nessun fondo, nessun filo (2026-09-08) */
.sc-station-head .iv-max-tag {
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--muted);
}
/* reps e kg sulla stessa fila, le reps appena più larghe (5 a 4). Con un
   qualificatore solo (o con quelli nascosti da score_form.js) chi resta si
   prende tutta la riga.
   ⚠️ Era 7 a 3, tarato su DUE campi: con tre (Double DB Box Step Over,
   reps + kg + cm) ai due campi da 3 restavano ~80px, di cui 60 di
   rientri e sigla, e «22,5» usciva tagliato (Francesco, 2026-09-02). */
.sc-box-num { display: flex; gap: 7px; }
.sc-box-num .rft-q { flex: 4 1 0; min-width: 0; margin: 0; }
.sc-box-num .rft-q[data-q="rep"] { flex: 5 1 0; }
.sc-box-num .rft-q input { width: 100%; }
/* i round: riquadro stretto come i kg, la parola dentro come unità e
   FOR TIME fuori in maiuscolo */
.sc-round-box {
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(255, 255, 255, .03);
  border-radius: 12px;
  padding: 8px;
  margin-bottom: 8px;
}
.sc-round-campo { position: relative; flex: none; width: 118px; }
.sc-round-campo input { width: 100%; text-align: left; padding-right: 52px; font-weight: 700; }
/* il numero di intervalli scalato (2026-09-02): «intervalli» è più lunga
   di «rounds», la casella si allarga e il rientro segue la parola. */
.sc-round-campo--iv { width: 150px; }
/* la soglia scalata degli Intervals «A soglia» (2026-09-07): stessa
   scatola del numero di intervalli — prima stesura, da rivedere con
   Roberta */
.sc-round-campo--tg { width: 170px; }
.sc-round-campo--tg input { padding-right: 96px; }
/* la sheet «A soglia»: tre celle (INTERVALLO, MIN, SEC) al posto delle
   due MIN/SEC del For Time — prima stesura. */
.two.tg-duo { grid-template-columns: 1.2fr 1fr 1fr; }   /* .two sta più in basso: serve la doppia classe */
.sc-round-campo--iv input { padding-right: 78px; }
.sc-round-campo--iv input[aria-invalid="true"] { border-color: rgba(var(--brand-light-rgb), .75); }
.sc-int-err {
  margin: -4px 0 8px;
  padding: 2px 4px;
  border: 0;
  background: none;
  color: var(--err);
  font-size: var(--fs-sm);
}
/* ⚠️ Niente lettere spaziate (2026-09-08, Roberta): «AMRAP 4' / Rest 1'»
   con .12em di spaziatura si leggeva a fatica e sembrava un altro font. */
.sc-fortime { font-size: var(--fs-xs); font-weight: 700; color: var(--muted); }

/* la scatola è larga quanto la sheet, non si stringe sul contenuto */
.sc-editor-in .sc-box, .sc-editor-in .sc-round-box,
.sc-editor-in .sets-editor { align-self: stretch; }
/* ...tranne quella degli intervalli, che non ha campi dentro: si stringe
   sulla scritta invece di essere una barra vuota (2026-08-28) */
.sc-editor-in .sc-round-box--griglia { align-self: flex-start; padding: 6px 12px; }
.sc-box .rft-line { flex-wrap: nowrap; }
.sc-box .rft-line .rft-search { min-width: 0; }
.sc-box .rft-quals { flex-wrap: nowrap; }
.sc-box .rft-q input, .sc-editor--per-round .sc-box .rft-q input { width: 100%; }
/* l'unità dentro il campo, a destra: fuori rubava spazio alla riga */
.sc-box .rft-q, .sc-round-campo { position: relative; }
.sc-box .rft-q-unit, .sc-round-campo .rft-q-unit {
  position: absolute;
  right: 11px;
  top: 50%;
  transform: translateY(-50%);
  font-size: var(--fs-xs);
  color: var(--muted);
  pointer-events: none;
}
/* il rientro destro segue la sigla («reps» è più lunga di «kg»), quello
   sinistro scende a 12px: coi 16px globali e i 44px fissi di prima ogni
   campo perdeva 60px, troppi per tre campi in fila (2026-09-02) */
.sc-box .rft-q input { padding-left: 12px; padding-right: 30px; text-align: left; }
.sc-box .rft-q[data-q="rep"] input { padding-right: 40px; }
/* «Aggiungi movimento»: tratteggiato viola come le tessere da riempire */
.btn-add { background: none; border: 1px dashed rgba(var(--accent-rgb), .55); color: var(--brand-light); }
.btn-add:hover { background: var(--btn-tint); border-color: var(--purple); color: var(--sel-fg); }

/* ── Modificatore Scaled degli INTERVALS (2026-08-25) ───────────────
   Le stazioni del coach come gruppi bloccati: dentro ognuna le stesse
   scatole .sc-box. ⚠️ Grafica nuova lato atleta: transizioni riusate
   (.clp, .set-edit--in/--out), */
.sc-station { align-self: stretch; }
/* ⚠️ il suggerimento dell'editor è lungo quattro righe: con l'icona
   centrata sul blocco, la matita galleggiava a metà del paragrafo. Va
   in cima, sulla prima riga (2026-08-28, Roberta) */
.sc-editor-in .hintline { align-items: flex-start; }
.sc-editor-in .hintline .icon { margin-top: 2px; }
/* il bottone «Aggiungi movimento» sotto le scatole della stazione */
.sc-station > .btn-add { margin-top: 8px; }
.sc-station + .sc-station { margin-top: 10px; }
.sc-station-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s2);
  margin-bottom: 6px;
}
.sc-station-head .iv-station-num {
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--muted);
}
/* la stazione di riposo non si tocca: resta la scritta */
.sc-rest-row {
  background: rgba(255, 255, 255, .03);
  border-radius: 12px;
  padding: 12px 8px;
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--muted);
}
/* il badge MAX al posto del campo del conteggio; il badge BUY-IN
   (2026-09-04) ha la stessa veste — prima stesura, grafica da rivedere
   con Roberta */
.iv-max-tag {
  align-self: center;
  flex: none;
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--brand-light);
  border: 1px solid rgba(var(--accent-rgb), .45);
  border-radius: var(--r-pill);
  padding: 4px 10px;
}

/* ── Dettaglio per-intervallo nella score sheet (0045) ──────────────
   Le righe riusano le mini-card .mc dei sets_load; qui solo l'aria. */
/* ⚠️ lo stacco fra le righe era scritto DUE volte — qui e nel
   margin-bottom della .mc — quindi veniva 16px invece di 8, e la lista
   dei nove round era lunga 589px. Ora lo spazio lo dà solo questo gap
   (2026-08-28, Roberta). */
.iv-detail-in { display: flex; flex-direction: column; gap: 4px; padding-top: var(--s3); }
/* le sezioni (2026-09-16): la prima riga del blocco è il selettore
   «Orologio | Di lavoro», e dal bordo della pastiglia «Per sezione |
   Totale» qui sopra deve distare quanto quella dista dal riquadro
   Rx/Scaled: 16 px, misurati bordo a bordo (chiesto da Francesco).
   La riga sopra lascia 8 di coda; il respiro del blocco (12) va via e
   la riga ne mette 8 suoi. */
.iv-detail-in--sezioni { padding-top: 0; }
.frow--sec-entry { margin: 8px 0 8px; }
.iv-detail-in .mc { margin-bottom: 0; padding: 6px 12px; }
/* il numero del round in viola e il movimento in bianco: in grigio scuro
   la riga non si leggeva. La misura resta quella di prima. */
.iv-detail-in .mc-num { color: var(--brand-light); }
.iv-detail-in .mc-mov { color: var(--text); }


/* ── I due gruppi di scelte dentro il WOD codificato ───────────────────
   ⚠️ Nel form del coach nessuno mette la classe .on: lì i radio li
   comanda editor.js (li accende, li spegne e li disabilita secondo i
   vincoli del track). Quindi la metà scelta si riconosce anche dal
   radio, non solo dalla classe. */
.seg-b:has(input:checked) { background: var(--sel-tint); color: var(--sel-fg); }
/* una scelta fuori dai vincoli del track: si vede che c'è ma non si tocca */
.seg-b:has(input:disabled) { opacity: .4; cursor: not-allowed; }
.seg-b:has(input:disabled):hover { color: var(--muted); }
/* ⚠️ i due gruppi stanno su DUE COLONNE con la loro etichetta: prima
   erano uno sotto l'altro e larghi diverso — «For Time» è corto e «Rep
   diverse round per round» è lungo — quindi i bordi non cadevano in
   colonna (Roberta, 2026-08-25: «orribili e tutte non allineate»).
   Le etichette non sono nuove: sono gli aria-label che il markup già
   dichiarava per chi naviga senza vedere. */
.seg.rft-mode { width: max-content; max-width: 100%; }
/* round e le due scelte sulla stessa riga: il riquadro dei round prende
   quello che gli serve, i due gruppi si dividono il resto in parti
   uguali (così restano larghi identici fra loro) */
/* ⚠️ larghezza col tetto, non 1fr: i due gruppi si tengono la STESSA
   misura (è la cosa che si vedeva storta) ma stanno stretti sul loro
   testo invece di spalmarsi su tutta la pagina. Il minmax li lascia
   comunque stringere quando la finestra si accorcia. */
.rft-scelte {
  grid-template-columns: max-content minmax(0, 450px) minmax(0, 450px);
  margin-bottom: var(--s3);
}
/* i tre riquadri della riga sono la stessa cosa: stesso fondo, stesso
   filo, stessa altezza (60 fuori, 44 dentro come i campi). Il fondino
   grigio del riquadro dei round resta solo nella card dello score
   dell'atleta, dove sta dentro una sheet e non in fila con altri due. */
.rft-scelte .seg.rft-mode,
.rft-scelte .sc-round-box {
  height: 60px;
  padding: 7px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-sizing: border-box;
}
.rft-scelte .seg.rft-mode { align-items: stretch; }
.rft-scelte .seg.rft-mode .seg-b { border-radius: 9px; }
.rft-scelte .sc-round-box { align-items: center; gap: 10px; }
.rft-scelte .field { margin-bottom: 0; }
/* ⚠️ coi margini azzerati qui sopra, quando i field si impilano (griglia
   a una colonna) resterebbe il solo row-gap dei 6px della .griglia —
   pensato per i campi della stessa riga logica, non per blocchi diversi:
   il riquadro every e il seg degli score finivano appiccicati
   (Francesco, 2026-08-25). A due colonne (una riga sola) non cambia nulla. */
.rft-scelte { row-gap: var(--s4); }
/* ⚠️ dentro la loro colonna i due riquadri la riempiono: così hanno la
   STESSA larghezza e i bordi cadono uguali a destra e a sinistra, che è
   la cosa che si vedeva storta */
.rft-scelte .seg.rft-mode { width: 100%; }
.rft-scelte .seg.rft-mode .seg-b { flex: 1 1 0; }
/* il riquadro dei round si stringe su di sé: nel campo largo quanto la
   pagina una striscia vuota da 1400px non ha senso */
#rft-field .sc-round-box { width: max-content; }
/* il riquadro dei round è alto 60, i due gruppi 41: i gruppi si centrano
   nello spazio del riquadro invece di restare appesi in alto */
@media (min-width: 1131px) {
  .rft-scelte { align-items: stretch; }
  /* sopra questa larghezza «Rep diverse round per round» ci sta in una
     riga sola: inchiodandolo, i due gruppi restano alti uguali */
  .rft-scelte .seg-b { white-space: nowrap; }
  .rft-scelte > .field { display: flex; flex-direction: column; }
  .rft-scelte .sc-round-box { margin-bottom: 0; }
  .rft-scelte .seg.rft-mode { margin-top: auto; margin-bottom: auto; }
}
/* sotto, la scritta più lunga andrebbe a capo e i due gruppi non
   sarebbero più alti uguali: i tre pezzi si mettono in colonna */
@media (max-width: 1130px) { .rft-scelte { grid-template-columns: 1fr; } }

/* ── Le due scelte del WOD codificato: riquadro grande, non il mini ────
   ⚠️ col .seg--mini le parole erano 10px maiuscole e strette: «REP
   DIVERSE ROUND PER ROUND» non si leggeva (Roberta, 2026-08-26: «troppo
   schiacciati, non si leggono bene»). Qui c'è spazio per il riquadro
   intero, quello alto 41px di Rx/Scaled, col testo come è scritto. */
.rft-scelte .seg { margin-top: 0; }

/* ── Le righe dei movimenti: lo spazio diviso a percentuale ────────────
   ⚠️ prima i campi dei numeri erano larghi fissi (84px, 150px in «rep
   diverse round per round») e il nome del movimento si prendeva tutto il
   resto: le rep uscivano dal campo dopo tre cifre e il nome aveva una
   riga intera quasi vuota. Ora la riga si divide in proporzione, come
   nelle card dello score. */
/* ⚠️ l'ordine è reps, movimento, kg in fondo (Roberta, 2026-08-26), ma
   nel markup i campi dei numeri stanno tutti insieme PRIMA del nome (li
   rinumera rft_editor.js e la stessa forma serve alla sheet dell'atleta).
   Invece di spostarli, il loro contenitore sparisce dal disegno
   (display: contents) e i campi diventano caselle della riga: le rep
   nella prima colonna, il nome nella seconda, tutto il resto in coda. */
.set-edit[data-rft-row] .rft-line {
  display: grid;
  grid-template-columns: 22% minmax(0, 1fr) 14%;
  gap: 7px;
  align-items: center;
}
.set-edit[data-rft-row] .rft-quals { display: contents; }
.set-edit[data-rft-row] .rft-line > *, .set-edit[data-rft-row] .rft-q { grid-row: 1; }
.set-edit[data-rft-row] .rft-search { grid-column: 2; }
/* ⚠️ i campi dei numeri vanno a colonne FISSE, non «quel che avanza»:
   così le rep del primo movimento e quelle del secondo cadono alla
   stessa larghezza anche quando uno ha i kg e l'altro no (Roberta:
   «i bottoni che contengono le reps devono essere allineati sempre
   fra loro»). Un campo nascosto non occupa la sua colonna, ma la
   colonna resta prenotata. */
/* quante colonne prenotare lo conta rft_editor.js sulla riga che ne ha
   di più: così le rep di un movimento cadono sotto quelle dell'altro
   anche se solo uno ha i kg, e un WOD con un campo solo non prenota
   niente e lascia respirare il nome */
/* ⚠️ le colonne dei numeri erano 22% + 14% fissi qualunque fosse il loro
   numero: con tre campi (reps + kg + cm) «22,5» non entrava nei 14%.
   Ora la quota si ridistribuisce: più campi, rep più strette e le altre
   un filo più larghe (2026-09-02). Il conteggio include il parametro. */
.rft-cols-1 .set-edit[data-rft-row] .rft-line { grid-template-columns: 22% minmax(0, 1fr); }
.rft-cols-2 .set-edit[data-rft-row] .rft-line { grid-template-columns: 20% minmax(0, 1fr) 16%; }
.rft-cols-3 .set-edit[data-rft-row] .rft-line { grid-template-columns: 18% minmax(0, 1fr) 16% 16%; }
.rft-cols-4 .set-edit[data-rft-row] .rft-line { grid-template-columns: 16% minmax(0, 1fr) 15% 15% 15%; }
/* con «rep diverse round per round» nel campo finisce una sequenza
   (4-6-8-10-8-6-4, o il doppio 24/18-21/15-18/12): la prima colonna cresce */
.rft--per-round.rft-cols-1 .set-edit[data-rft-row] .rft-line { grid-template-columns: 30% minmax(0, 1fr); }
.rft--per-round.rft-cols-2 .set-edit[data-rft-row] .rft-line { grid-template-columns: 30% minmax(0, 1fr) 16%; }
.rft--per-round.rft-cols-3 .set-edit[data-rft-row] .rft-line { grid-template-columns: 30% minmax(0, 1fr) 16% 16%; }
.rft--per-round.rft-cols-4 .set-edit[data-rft-row] .rft-line { grid-template-columns: 30% minmax(0, 1fr) 15% 15% 15%; }
.set-edit[data-rft-row] .rft-search { min-width: 0; }
.set-edit[data-rft-row] .rft-q { min-width: 0; position: relative; }
/* le rep aprono la riga: nella loro colonna ci finisce anche il 21-15-9
   e il 4-6-8-10-8-6-4 */
.set-edit[data-rft-row] .rft-q[data-q="rep"] { grid-column: 1; }
.set-edit[data-rft-row] .rft-q input,
.rft--per-round .set-edit[data-rft-row] .rft-q input {
  width: auto; flex: 1 1 0; min-width: 0;
  text-align: left; padding-left: 12px; padding-right: 30px;
}
/* il rientro destro segue la sigla: «reps» vuole più posto di «kg» */
.set-edit[data-rft-row] .rft-q[data-q="rep"] input { padding-right: 40px; }
/* l'unità entra dentro il campo, a destra, come nelle card: fuori
   rubava spazio al numero */
.set-edit[data-rft-row] .rft-q-unit {
  position: absolute;
  right: 11px;
  top: 50%;
  transform: translateY(-50%);
  font-size: var(--fs-xs);
  color: var(--muted);
  pointer-events: none;
}
/* i suggerimenti sotto le righe: larghi quanto la pagina erano una riga
   sola lunghissima, si legge meglio su una misura corta */
#rft-field .hint, #sets-field .hint { max-width: 92ch; }
/* ⚠️ sul telefono la riga torna a due piani (nome sopra, numeri sotto):
   il nowrap qui sopra glielo impediva e il campo del movimento restava
   schiacciato a 120px */
@media (max-width: 639px) {
  /* il nome del movimento sopra a riga intera e i numeri sotto, due per
     riga; con le rep round per round la sequenza vuole tutta la
     larghezza, quindi una per riga */
  .rft-cols-1 .set-edit[data-rft-row] .rft-line,
  .rft-cols-2 .set-edit[data-rft-row] .rft-line,
  .rft-cols-3 .set-edit[data-rft-row] .rft-line,
  .rft-cols-4 .set-edit[data-rft-row] .rft-line {
    grid-template-columns: 1fr 1fr;
  }
  /* ⚠️ questi vanno DOPO e con lo stesso peso dei quattro qui sopra,
     altrimenti vincono quelli e la sequenza resta in mezza riga */
  .rft--per-round.rft-cols-1 .set-edit[data-rft-row] .rft-line,
  .rft--per-round.rft-cols-2 .set-edit[data-rft-row] .rft-line,
  .rft--per-round.rft-cols-3 .set-edit[data-rft-row] .rft-line,
  .rft--per-round.rft-cols-4 .set-edit[data-rft-row] .rft-line {
    grid-template-columns: 1fr;
  }
  .set-edit[data-rft-row] .rft-line > *, .set-edit[data-rft-row] .rft-q { grid-row: auto; }
  .set-edit[data-rft-row] .rft-search { grid-column: 1 / -1; grid-row: 1; }
}

/* ⚠️ la griglia a 12 colonne era stata disegnata sul monitor: sul
   telefono le colonne restavano affiancate e i campi diventavano
   francobolli larghi 60px. Sotto gli 860 ogni campo si prende la riga. */
@media (max-width: 900px) {
  .griglia > * { grid-column: 1 / -1; }
}

/* ── Intervals/EMOM col vestito del resto del form (2026-08-26) ────────
   Francesco l'ha scritto lasciando detto «grafica da rivedere»: qui
   l'editor prende le stesse regole già decise per i round. */
/* la griglia e le cinque letture dello score sulla stessa riga */
.iv-scelte { grid-template-columns: minmax(0, 1fr); }
.iv-scelte .iv-grid-row { width: max-content; max-width: 100%; }
#iv-target-field .iv-campo input { width: 150px; }
/* «Every 1:00 × 10» dentro il riquadro dei round, stessa altezza */
.rft-scelte .iv-grid-row {
  height: 60px;
  padding: 7px 12px 7px 7px;
  gap: 10px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-sizing: border-box;
  flex-wrap: nowrap;
}
/* ⚠️ sul telefono i tre campi più la scritta non stanno in una riga: col
   nowrap e l'altezza fissa il campo «intervalli» restava tagliato e
   «EVERY 2:00 × 6» spariva fuori schermo, irraggiungibile perché il body
   ha overflow-x: clip (QA 2026-09-02). Sotto i 600px la riga va a capo
   come già fanno le righe dei movimenti. */
@media (max-width: 639px) {
  /* la cella è max-content: senza portare la griglia a una colonna il
     riquadro misura il suo contenuto e il wrap non scatta mai */
  .rft-scelte .iv-grid-row { height: auto; flex-wrap: wrap; width: auto; }
}
/* cinque scelte invece di due: la scritta più corta non deve schiacciarsi */
.iv-flavor .seg-b { padding-left: 6px; padding-right: 6px; }
/* ⭐ Lo score degli intervalli (Francesco, 11/09: «orribile a qualsiasi
   larghezza»): otto scelte spalmate in una barra alta 60, con «Round +
   reps» e «Max reps totali» spezzati su due righe. Ora ogni scelta è una
   pastiglia a misura del suo testo, su una riga; vanno a capo quando
   non ci stanno e il riquadro è alto quanto serve. */
.rft-scelte .seg.rft-mode.iv-flavor {
  height: auto;
  flex-wrap: wrap;
  gap: 6px;
  width: 100%;
}
.rft-scelte .seg.iv-flavor .seg-b {
  flex: 0 0 auto;
  white-space: nowrap;
  padding: 8px 12px;
}
/* le righe dei movimenti delle stazioni sono le stesse dei round */
.set-edit[data-iv-row] .rft-line {
  display: grid;
  /* l'ultima colonna è la spunta MAX: fissa, così cade allo stesso posto
     in tutte le stazioni anche quando i valori sono diversi */
  grid-template-columns: 22% minmax(0, 1fr) 14% max-content;
  gap: 7px;
  align-items: center;
}
/* ⚠️ Prima la griglia era fissa a UNA colonna di numeri oltre alle rep:
   il terzo qualificatore (reps + kg + cm) finiva in una colonna implicita
   e sfondava la riga. Ora le colonne le conta interval_editor.js
   (syncColonne, gemella di rft_editor) e la spunta MAX resta l'ultima
   (2026-09-02). */
.iv-cols-1 .set-edit[data-iv-row] .rft-line { grid-template-columns: 22% minmax(0, 1fr) max-content; }
.iv-cols-2 .set-edit[data-iv-row] .rft-line { grid-template-columns: 20% minmax(0, 1fr) 16% max-content; }
.iv-cols-3 .set-edit[data-iv-row] .rft-line { grid-template-columns: 18% minmax(0, 1fr) 16% 16% max-content; }
.iv-cols-4 .set-edit[data-iv-row] .rft-line { grid-template-columns: 16% minmax(0, 1fr) 15% 15% 15% max-content; }
.set-edit[data-iv-row] .rft-quals { display: contents; }
.set-edit[data-iv-row] .rft-line > *, .set-edit[data-iv-row] .rft-q { grid-row: 1; }
.set-edit[data-iv-row] .rft-search { grid-column: 2; }
.set-edit[data-iv-row] .rft-q { min-width: 0; position: relative; }
.set-edit[data-iv-row] .rft-q[data-q="rep"] { grid-column: 1; }
.set-edit[data-iv-row] .rft-q input {
  width: auto; flex: 1 1 0; min-width: 0;
  text-align: left; padding-left: 12px; padding-right: 30px;
}
.set-edit[data-iv-row] .rft-q[data-q="rep"] input { padding-right: 40px; }
.set-edit[data-iv-row] .rft-q-unit {
  position: absolute;
  right: 11px;
  top: 50%;
  transform: translateY(-50%);
  font-size: var(--fs-xs);
  color: var(--muted);
  pointer-events: none;
}
/* le spunte MAX e BUY-IN in coda alla riga, non fra i campi: «-2 / -1»
   è l'ultima colonna esplicita, qualunque sia il conteggio */
.set-edit[data-iv-row] .iv-chips { grid-row: 1; grid-column: -2 / -1; justify-self: start; }
/* i pick stanno in un guscio loro (.iv-picks, nel template): sopra i 900
   il guscio non esiste per la griglia e i pick cadono in seconda riga
   come prima; sotto diventa una riga dedicata (qui sotto) */
.iv-picks { display: contents; }
/* ⭐ Sotto i 900 la riga della stazione va a PIANI, ognuno con una cosa
   sola (13.1 bis, deciso da Francesco l'11/09 guardando la vetrina): il
   nome del movimento a riga intera, i numeri due per riga, le spunte
   MAX / BUY-IN / UNBROKEN su una riga loro e i pick su un'altra. Prima,
   a 620, BUY-IN e UNBROKEN cadevano su due righe diverse, e a 880 il
   campo del movimento restava largo 90px stretto fra numeri e spunte. */
@media (max-width: 900px) {
  .set-edit[data-iv-row] .rft-line,
  .iv-cols-1 .set-edit[data-iv-row] .rft-line,
  .iv-cols-2 .set-edit[data-iv-row] .rft-line,
  .iv-cols-3 .set-edit[data-iv-row] .rft-line,
  .iv-cols-4 .set-edit[data-iv-row] .rft-line { grid-template-columns: 1fr 1fr; }
  .set-edit[data-iv-row] .rft-line > *, .set-edit[data-iv-row] .rft-q { grid-row: auto; }
  .set-edit[data-iv-row] .rft-search { grid-column: 1 / -1; grid-row: 1; }
  /* l'ordine dei piani: numeri, spunte, pick (il nome è inchiodato alla
     riga 1 qui sopra) */
  .set-edit[data-iv-row] .rft-q { order: 1; }
  .set-edit[data-iv-row] .iv-chips,
  .set-edit[data-iv-row] .iv-picks {
    grid-row: auto;
    grid-column: 1 / -1;
    justify-self: stretch;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s2);
  }
  .set-edit[data-iv-row] .iv-chips { order: 2; }
  .set-edit[data-iv-row] .iv-picks { order: 3; }
  /* la riga senza niente dentro (Rest, o nessun pick) non prende spazio */
  .set-edit[data-iv-row] .iv-chips:not(:has(> :not([hidden]))),
  .set-edit[data-iv-row] .iv-picks:not(:has(> :not([hidden]))) { display: none; }
  /* un numero solo (le reps e basta) si prende la riga intera (Francesco,
     11/09: «a questo punto mettiamo la riga reps a tutto schermo») */
  .set-edit[data-iv-row] .rft-line:not(:has(.rft-q:not([hidden]) ~ .rft-q:not([hidden])))
    :not(:has(.rft-param:not([hidden]))) .rft-q:not([hidden]) { grid-column: 1 / -1; }
}

/* ── Il viola sul riquadro dei round (scelta di Roberta, 2026-08-26) ───
   Il campo del numero prende lo stesso fondo viola velato della metà
   accesa dei due gruppi accanto: nella riga il viola vuol dire sempre la
   stessa cosa. ⚠️ Solo nel form del coach: nella card dello score
   dell'atleta il riquadro resta grigio (il viola lì le dava fastidio). */
.rft-scelte .sc-round-campo input {
  background: var(--sel-tint);
  border-color: transparent;
  color: var(--sel-fg);
}
.rft-scelte .sc-round-campo .rft-q-unit { color: var(--sel-fg); opacity: .75; }

/* ⚠️ il numero della stazione (S1, S2…): la regola di Francesco sta più
   in basso nel file e a parità di forza vincerebbe lei, quindi qui il
   selettore porta anche il contenitore. Anton è del nome del box. */
.iv-station .iv-station-num {
  font-family: var(--font);
  font-weight: 700;
  font-size: 15px;
  color: var(--brand-light);
  width: auto;
  min-width: 26px;
}

/* ⚠️ la × della riga stava 9px più a sinistra del cestino della stazione
   (la riga è una scatola dentro la scatola, e il suo bordo interno cade
   più dentro): tirata a filo. */
.set-edit[data-iv-row] .set-edit-tools { margin-right: -9px; }
/* ⚠️ e i bottoni in coda alla riga stavano 4px più in alto del campo:
   nelle righe a un piano solo (round e intervalli) tutto si centra
   sull'altezza dei campi. Le serie no: hanno due piani e il numero
   deve restare in alto. */
.set-edit[data-rft-row], .set-edit[data-iv-row] { align-items: center; }
.set-edit[data-rft-row] .set-edit-num,
.set-edit[data-iv-row] .set-edit-num { padding-top: 0; }
.set-edit[data-rft-row] .set-edit-tools,
.set-edit[data-iv-row] .set-edit-tools { align-items: center; }

/* ── Il riquadro degli intervalli: le parole dentro i campi ────────────
   Scelta di Roberta (2026-08-26) fra tre: «every» e «intervalli» sono
   l'unità di misura dentro il campo, come «rounds» sui round, e il
   viola velato è lo stesso dei riquadri accanto. */
.iv-campo { position: relative; display: inline-flex; flex: none; }
.iv-campo input {
  width: 118px;
  padding-right: 58px;
  text-align: left;
  font-weight: 700;
  background: var(--sel-tint);
  border-color: transparent;
  color: var(--sel-fg);
}
.iv-campo--n input { width: 132px; padding-right: 76px; }
/* ⭐ Le finestre disuguali (2026-09-13): «2, 2, 2, 3». Su una riga SUA,
   sotto la griglia — quella sopra è nowrap a 60px fissi e un quarto
   campo ci starebbe come il pugno in un occhio (QA del 2026-09-02, il
   campo «intervalli» tagliato fuori schermo). Qui il campo è largo
   perché la sequenza si legge tutta, e va a capo sui telefoni. */
.iv-windows-row { display: flex; margin-top: 8px; }
.iv-campo--win { flex: 1 1 auto; max-width: 340px; }
.iv-campo--win input { width: 100%; padding-right: 118px; }
/* «every» spento mentre le finestre sono scritte: il coach vede quale
   dei due modi sta usando, invece di compilarli tutti e due */
.iv-campo--spento {
  opacity: .45;
  text-decoration: line-through;
  text-decoration-color: var(--muted);
}
/* le finestre occupate dalla stazione (span, 2026-09-06): campo corto
   nella testata della scatola, stesso vestito degli altri. Da rivedere
   con Roberta. */
.iv-campo--span input { width: 104px; padding-right: 62px; }
.iv-station-head .iv-campo--span { margin-right: auto; }
.iv-station-head .iv-station-num { margin-right: 0; }
.iv-campo .rft-q-unit {
  position: absolute;
  right: 11px;
  top: 50%;
  transform: translateY(-50%);
  font-size: var(--fs-xs);
  color: var(--sel-fg);
  opacity: .75;
  pointer-events: none;
}

/* ⚠️ anche nella sheet dell'atleta le stazioni erano Anton grigio: la
   regola qui sopra ne cambia solo la misura, non la famiglia, e Anton
   resta quello del nome del box. Stesso trattamento del form. */
.sc-station-head .iv-station-num {
  font-family: var(--font);
  font-size: 13px;
  color: var(--brand-light);
}

/* ── «For Time a sezioni» (form coach, 2026-09-14) ───────────────────
   Deciso da Francesco il 14/09 sulla vetrina (8.9 C, 8.10 B): la sezione
   è la scatola stazione degli Intervals (.sec-box) con la TESTA TINTA
   (fondo viola tenue, bordo viola) e i riquadri della testa alla stessa
   altezza; il riposo è una riga FRA una sezione e l'altra (.sec-rest-row,
   fuori dalla scatola); sotto i 900 le chip della modalità restano
   strette sulla riga. */
.sec-block + .sec-block { margin-top: var(--s2); }
/* ⛔ niente overflow hidden qui: taglierebbe la tendina della ricerca
   movimenti (.rft-sugg, assoluta dentro la scatola) — QA del 14/09 */
.sec-box { border-color: rgba(var(--accent-rgb), .45); }
.sec-box .sec-head {
  flex-wrap: wrap;
  gap: var(--s2);
  align-items: center;
  background: rgba(var(--accent-rgb), .08);
  margin: calc(-1 * var(--s2)) calc(-1 * var(--s2)) var(--s2);
  padding: var(--s2);
  border-radius: calc(var(--r-sm) - 1px) calc(var(--r-sm) - 1px) 0 0;
}
.sec-box .sec-head .iv-station-num { margin-right: 0; font-size: 20px; color: var(--brand-light); }
/* stessa altezza per i tre riquadri della testa (round, modalità, azioni):
   prima stavano «un po' su un po' giù a caso» */
.sec-box .sec-head .sc-round-box,
.sec-box .sec-head .seg.rft-mode,
.sec-box .sec-head .sec-tools {
  height: 48px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
}
.sec-box .sec-head .sc-round-box { width: max-content; gap: 8px; padding: 4px 8px; }
.sec-box .sec-head .sc-round-campo input { height: 40px; }
.sec-box .sec-head .seg.rft-mode { flex: 0 1 auto; width: auto; padding: 4px; }
.sec-box .sec-head .seg.rft-mode .seg-b { flex: 0 0 auto; padding: 6px 12px; white-space: nowrap; }
.sec-box .sec-head .sec-tools { margin-left: auto; gap: var(--s1); }
.sec-box > .sets-editor-actions { margin-top: var(--s2); }
.sec-box > .hint { margin: var(--s2) 0 0; }
/* la riga del riposo fra due sezioni: filo ai lati, campo al centro */
.sec-rest-row, .scs-rest-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: var(--s2) 0;
  color: var(--muted);
  font-size: var(--fs-xs);
  font-weight: 700;
}
.sec-rest-row::before, .sec-rest-row::after,
.scs-rest-row::before, .scs-rest-row::after {
  content: '';
  flex: 1 1 0;
  height: 1px;
  background: var(--line);
}
.sec-rest-row .sc-round-campo, .scs-rest-row .sc-round-campo { width: 128px; }
.scs-rest-label, .scs-rest-poi { white-space: nowrap; }
/* sotto i 900 le chip della modalità restano strette sulla riga
   (vetrina 8.10 B), il resto va a capo da sé */
@media (max-width: 900px) {
  .sec-box .sec-head .seg.rft-mode .seg-b { padding: 6px 10px; font-size: 12px; }
}
/* il modificatore Scaled a sezioni nella sheet dell'atleta (2.15 B): la
   testa S1/S2 tinta e in viola, il riposo come riga fra le sezioni; la
   modalità per-round è per blocco, non per editor */
#scaled-editor .scs-head {
  background: rgba(var(--accent-rgb), .10);
  border-radius: 10px;
  padding: 8px 12px;
  margin-bottom: 8px;
}
#scaled-editor .scs-head .iv-station-num { color: var(--brand-light); font-size: 14px; }
#scaled-editor .scs-rest-row { margin: 12px 0; }
#scaled-editor .scs-rest-row .sc-round-campo input { width: 100%; padding-right: 56px; }
.sc-editor-in .frow .sc-fortime { margin-left: auto; }
.scs-per-round .rft-q input { width: 100%; }