/* IL MODULO PESATA — lo stesso dappertutto (modulo_pesata.js). UN FILE SOLO: lo leggono i mockup con un <link>, e
   l'app lo prende dentro index.html al build (tools/build.py, i moduli CONDIVISI). Fino al 27/09 le stesse regole
   stavano anche in src/style/carico.css, per la pesata che l'app disegnava da sé: tolte, era il doppione.
   I raggi seguono la regola dei pannelli annidati dell'app (--pan-r, --pan-p, --dentro); dove quei token non ci
   sono — un mockup — il var() ricade sul raggio semplice. */
.ps-chi{font-size:var(--fs-sm);color:var(--testo-soft);margin:-6px 0 var(--sp-3)}
.ps-chi b{color:var(--testo)}
.ps-ult{--pan-r:var(--r-sm); --pan-p:var(--sp-3); --dentro:max(var(--r-dentro-min), calc(var(--pan-r) - var(--pan-p)));display:flex;align-items:center;gap:var(--sp-3);
  background:var(--incavo);border:1px solid var(--bordo);border-radius:var(--pan-r);padding:var(--sp-3);margin-bottom:var(--sp-4);font-size:var(--fs-sm);color:var(--testo-soft)}
.ps-ult b{color:var(--testo);font-size:var(--fs-corpo)}
.ps-ult .icn{width:18px;height:18px;flex:none}
.ps-metodi{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-2);margin-bottom:var(--sp-4)}
.ps-m{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:64px;border-radius:var(--dentro, var(--r-sm));
  border:1px solid var(--bordo);background:var(--incavo);color:var(--testo-soft);font:inherit;font-size:var(--fs-sm);font-weight:700;cursor:pointer}
.ps-m .icn{width:22px;height:22px}
.ps-m[aria-pressed="true"]{border-color:var(--accento);color:var(--accento);background:color-mix(in srgb, var(--accento) 10%, transparent)}
.ps-var{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);margin-bottom:14px}
.ps-var button{min-height:var(--tocco);border-radius:var(--dentro, var(--r-sm));border:1px solid var(--bordo);background:var(--incavo);color:var(--testo-soft);
  font:inherit;font-size:var(--fs-sm);font-weight:700;cursor:pointer}
.ps-var button[aria-pressed="true"]{border-color:var(--accento);color:var(--accento)}
.ps-calc{--pan-r:var(--r-sm); --pan-p:var(--sp-3); --dentro:max(var(--r-dentro-min), calc(var(--pan-r) - var(--pan-p)));display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);
  background:var(--pannello);border:1px solid var(--bordo);border-radius:var(--pan-r);padding:var(--sp-3) var(--sp-4);margin-bottom:14px}
.ps-calc span{font-size:var(--fs-sm);color:var(--testo-soft)}
.ps-calc b{font-size:var(--fs-xl);font-weight:900;font-variant-numeric:tabular-nums}
.ps-conf{font-size:var(--fs-sm);color:var(--testo-soft);line-height:1.5;margin:-4px 0 14px}
.ps-conf b{color:var(--info)}
.ps-bcs9{display:grid;grid-template-columns:repeat(9,1fr);gap:4px;margin-bottom:var(--sp-2)}
.ps-bcs9 button{--pan-r:var(--r-xs); --pan-p:0; --dentro:max(var(--r-dentro-min), calc(var(--pan-r) - var(--pan-p)));min-height:var(--tocco);border-radius:var(--pan-r);border:1px solid var(--bordo);background:var(--incavo);color:var(--testo-soft);font:inherit;font-weight:800;cursor:pointer;padding:0}
.ps-bcs9 button[aria-pressed="true"]{border-color:var(--accento);background:var(--accento);color:var(--su-accento)}
.ps-seg{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.ps-seg button{--pan-r:var(--r-xs); --pan-p:0; --dentro:max(var(--r-dentro-min), calc(var(--pan-r) - var(--pan-p)));display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:52px;border-radius:var(--pan-r);border:1px solid var(--bordo);
  background:var(--incavo);color:var(--testo-soft);font:inherit;cursor:pointer;padding:0}
.ps-seg button b{font-size:var(--fs-lg)}
.ps-seg button small{font-size:var(--fs-micro)}
.ps-seg button[aria-pressed="true"]{border-color:var(--accento);color:var(--accento)}
.ps-seg button[disabled]{opacity:.35;cursor:default}
.ps-piu{display:flex;align-items:center;gap:var(--sp-2);width:100%;min-height:var(--tocco);background:none;border:none;border-top:1px solid var(--bordo);
  color:var(--testo-soft);font:inherit;font-size:var(--fs-sm);font-weight:700;cursor:pointer;padding:0;margin-bottom:var(--sp-2)}
.ps-piu .chev{width:14px;height:14px;margin-left:auto;transition:transform .15s}
.ps-piu[aria-expanded="true"] .chev{transform:rotate(90deg)}
.ps-altri{--pan-r:var(--r-sm); --pan-p:var(--sp-2); --dentro:max(var(--r-dentro-min), calc(var(--pan-r) - var(--pan-p)));background:var(--incavo);border:1px solid var(--bordo);border-radius:var(--pan-r);padding:var(--sp-2) var(--sp-3);margin-bottom:14px}
.ps-par{display:grid;grid-template-columns:1fr 96px 44px;align-items:center;gap:var(--sp-2);padding:4px 0;border-top:1px solid var(--riga);font-size:var(--fs-sm)}
.ps-par:first-child{border-top:none}
.ps-par input{--pan-r:var(--r-xs); --pan-p:0; --dentro:max(var(--r-dentro-min), calc(var(--pan-r) - var(--pan-p)));width:100%;min-height:40px;border-radius:var(--pan-r);border:1px solid var(--bordo);background:var(--pannello);color:var(--testo);font:inherit;text-align:right;padding:0 var(--sp-2)}
.ps-par span:last-child{color:var(--testo-soft);font-size:var(--fs-xs)}
/* la ⓘ: la usa anche l'accesso (accesso_utente.js) */
.ps-i{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;border:1px solid var(--bordo);background:var(--pannello-2);
  color:var(--testo-soft);font-size:var(--fs-micro);font-weight:800;cursor:pointer;margin-left:6px;vertical-align:1px;text-transform:none;letter-spacing:0;padding:0}
.ps-nota{--pan-r:var(--r-sm); --pan-p:var(--sp-2); --dentro:max(var(--r-dentro-min), calc(var(--pan-r) - var(--pan-p)));display:none;font-size:var(--fs-xs);color:var(--testo-soft);line-height:1.55;
  background:var(--incavo);border:1px solid var(--bordo);border-radius:var(--pan-r);padding:var(--sp-2) var(--sp-3);margin:-6px 0 14px}
.ps-nota.on{display:block}
.ps-nota b{color:var(--testo)}
.ps-nota-x{display:block;margin-top:var(--sp-2);background:none;border:none;color:var(--accento);font:inherit;font-size:var(--fs-xs);font-weight:700;padding:0;cursor:pointer}

/* LE FOTO DELLA MISURAZIONE (29/09/2026, mockup_foto_misurazione v2): nella pesata una riga sola con le miniature; la pagina delle
   foto ha le quattro pose guidate, due per riga. Vuota = la sagoma da inquadrare; piena = la foto */
.ps-fotor{margin-top:var(--sp-2)}
.ps-fotoplus{--pan-r:var(--r-sm); --pan-p:var(--sp-2); --dentro:max(var(--r-dentro-min, var(--r-xs)), calc(var(--pan-r) - var(--pan-p)));display:flex;align-items:center;gap:var(--sp-3);width:100%;min-height:var(--tocco);margin-top:var(--sp-3);padding:var(--pan-p) var(--sp-3);
  border:1px dashed var(--accento-soft);border-radius:var(--pan-r);background:transparent;color:var(--accento);font:inherit;text-align:left;cursor:pointer}
.ps-fotoplus > .icn{width:22px;height:22px;flex:none}
.ps-fotoplus span{flex:1;min-width:0}
.ps-fotoplus b{display:block;font-size:var(--fs-sm);font-weight:700}
.ps-fotoplus small{display:block;font-size:var(--fs-xs);color:var(--testo-soft);margin-top:2px}
.ps-fotoplus .chev{width:14px;height:14px;flex:none}
.ps-mini i{width:28px;height:28px;border-radius:var(--r-xs);border:1px dashed var(--accento-soft);color:var(--accento);display:grid;place-items:center;font-style:normal;font-weight:700}
.ps-mini{display:flex;gap:var(--sp-1);margin-left:auto}
.ps-fotor .chev{margin-left:var(--sp-1)}
.ps-mini img{width:28px;height:28px;border-radius:var(--r-xs);object-fit:cover}
.ps-ftt{display:flex;align-items:center;gap:var(--sp-2)}
.ps-ftt h2{margin:0}
.ps-ind{width:var(--tocco);height:var(--tocco);border-radius:50%;border:1px solid var(--bordo);background:var(--pannello-2);color:var(--testo-soft);display:grid;place-items:center;cursor:pointer;flex:none}
.ps-ind .icn{width:18px;height:18px}
.ps-foto{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);margin-bottom:var(--sp-3)}
.ps-ft{--pan-r:var(--r-sm); --pan-p:var(--sp-2); --dentro:max(var(--r-dentro-min, var(--r-xs)), calc(var(--pan-r) - var(--pan-p)));
  position:relative;aspect-ratio:4/3;border:1px dashed var(--bordo);border-radius:var(--pan-r);background:var(--incavo);color:var(--testo-debole);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);padding:var(--pan-p);cursor:pointer;overflow:hidden}
.ps-ft svg{width:78%;height:auto;max-height:66%;opacity:.55}
.ps-ft span{font-size:var(--fs-xs);font-weight:700;color:var(--testo-soft)}
.ps-ft.pieno{border-style:solid;padding:0;cursor:default}
.ps-ft.pieno img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ps-ft.pieno span{position:absolute;left:0;right:0;bottom:0;padding:var(--sp-1) var(--sp-2);background:color-mix(in srgb, var(--sfondo) 72%, transparent);color:var(--testo)}
.ps-ftx{position:absolute;top:var(--sp-1);right:var(--sp-1);width:32px;height:32px;border-radius:50%;border:none;display:grid;place-items:center;
  background:color-mix(in srgb, var(--sfondo) 72%, transparent);color:var(--testo);cursor:pointer}
.ps-ftx .icn{width:16px;height:16px}
/* IL FOGLIO DI UNA PESATA, in lettura (§275, mockup_pesata_rivedi v1): ModuloPesata.foglio */
.fg-d{font-size:var(--fs-sm);color:var(--testo-soft);margin-bottom:var(--sp-3)}
.fg-d b{color:var(--testo)}
.fg-kg{display:flex;align-items:baseline;gap:var(--sp-3);padding:var(--sp-3) 0;border-top:1px solid var(--bordo)}
.fg-kg .v{font-size:calc(var(--fs-xl) * 1.6);font-weight:900;font-variant-numeric:tabular-nums}
.fg-kg .v small{font-size:var(--fs-corpo);color:var(--testo-soft);font-weight:700}
.fg-kg .q{font-size:var(--fs-sm);color:var(--testo-soft);line-height:1.45}
.fg-kg .q b{color:var(--testo)}
.fg-r{display:flex;align-items:center;gap:var(--sp-3);min-height:40px;border-top:1px solid var(--bordo);font-size:var(--fs-sm)}
.fg-r span{flex:1;color:var(--testo-soft)}
.fg-r b{font-variant-numeric:tabular-nums}
.fg-r b.acc{color:var(--accento);font-size:var(--fs-lg)}
.fg-r b.fg-nt{font-weight:600;text-align:right}
.fg-vuoto{font-size:var(--fs-sm);color:var(--testo-soft);padding:var(--sp-2) 0;border-top:1px solid var(--bordo)}
.fg-chi{font-size:var(--fs-xs);color:var(--testo-soft);line-height:1.55;border-top:1px solid var(--bordo);padding-top:var(--sp-3);margin-top:var(--sp-2)}
.fg-chi b{color:var(--testo)}
.fg-corr{--pan-r:var(--r-sm); --pan-p:var(--sp-2); --dentro:max(var(--r-dentro-min), calc(var(--pan-r) - var(--pan-p)));background:color-mix(in srgb, var(--avviso) 9%, transparent);border:1px solid color-mix(in srgb, var(--avviso) 30%, transparent);border-radius:var(--pan-r);padding:var(--sp-2) var(--sp-3);font-size:var(--fs-xs);line-height:1.55;color:var(--testo-soft);margin-top:var(--sp-2)}
.fg-corr b{color:var(--avviso)}
.fg-az{display:flex;flex-direction:column;gap:var(--sp-2);margin-top:var(--sp-4)}
.fg-az .btn{width:100%;justify-content:center;min-height:var(--tocco)}
.fg-togli{background:none;border:none;color:var(--pericolo);font:inherit;font-size:var(--fs-sm);font-weight:700;min-height:var(--tocco);cursor:pointer}
.fg-banner{--pan-r:var(--r-sm); --pan-p:var(--sp-2); --dentro:max(var(--r-dentro-min), calc(var(--pan-r) - var(--pan-p)));background:color-mix(in srgb, var(--info) 10%, transparent);border:1px solid color-mix(in srgb, var(--info) 35%, transparent);border-radius:var(--pan-r);padding:var(--sp-2) var(--sp-3);font-size:var(--fs-xs);line-height:1.5;color:var(--testo-soft);margin-bottom:var(--sp-3)}
.fg-banner b{color:var(--testo)}
/* «Hai letto solo i kg sul tuo metro? Scrivi i kg» (§296): un collegamento, non un bottone — è la strada di riserva */
.ps-link{display:block;background:none;border:none;padding:0;margin:calc(-1 * var(--sp-2)) 0 var(--sp-4);min-height:var(--tocco);
  color:var(--accento);font:inherit;font-size:var(--fs-sm);font-weight:600;text-align:left;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
/* l'ultimo BCS del nutrizionista nella pesata di chi non lo scrive (§296): chi e quando, sotto */
.ps-calc span small{display:block;font-size:var(--fs-xs);color:var(--testo-debole);margin-top:2px}
