/* Portale Coach — shell e landing. Usa i token di virtus.css (--blue, --card…). */
/* virtus.css usa body { background: var(--navy) } (è lo sfondo "fuori dal frame"
   nell'app PWA). Coach è web full-width: il contenuto poggia su --paper, così il
   titolo (--ink) è leggibile in chiaro e coerente in scuro. */
body { background: var(--paper); }
.coach-shell { min-height: 100vh; background: var(--paper); }

.coach-top {
    display: flex; align-items: center; gap: 12px;
    padding: calc(12px + env(safe-area-inset-top)) 18px 12px; background: var(--card); border-bottom: 1px solid var(--line);
    position: sticky; top: 0; z-index: 10;
}
.coach-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.coach-brand img { width: 38px; height: 38px; object-fit: contain; }
.coach-brand span { font-family: var(--font-display); font-size: 19px; letter-spacing: 1px; line-height: .95; display: flex; flex-direction: column; }
.coach-brand small { font-size: 10px; letter-spacing: 2px; color: var(--blue); font-family: var(--font-body); font-weight: 800; }
.coach-icon {
    width: 40px; height: 40px; border-radius: 11px; border: 1px solid var(--line);
    background: var(--card); color: var(--ink); font-size: 17px; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
}
.coach-icon:hover { border-color: var(--blue); }
.coach-nav { display: flex; gap: 4px; margin-left: 18px; }
.coach-nav a { padding: 7px 12px; border-radius: 10px; text-decoration: none; color: var(--ink); font-weight: 800; font-size: 13px; }
.coach-nav a:hover { background: color-mix(in srgb, var(--blue) 10%, var(--card)); color: var(--blue); }

.coach-main { max-width: 980px; margin: 0 auto; padding: 18px 18px calc(18px + env(safe-area-inset-bottom)); }
.coach-welcome { color: var(--muted); font-weight: 600; margin: 2px 0 16px; }

.coach-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.coach-card {
    background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 16px; position: relative;
}
.coach-card .coach-badge { font-size: 26px; }
.coach-card h3 { margin: 8px 0 4px; font-size: 16px; }
.coach-card p { margin: 0; font-size: 13px; color: var(--muted); }
.coach-soon {
    display: inline-block; margin-top: 10px; font-size: 10px; font-weight: 800; letter-spacing: .5px;
    text-transform: uppercase; color: var(--blue); background: color-mix(in srgb, var(--blue) 12%, var(--card));
    padding: 3px 9px; border-radius: 100px;
}
.coach-card.soon { opacity: .96; }
a.coach-card { text-decoration: none; color: var(--ink); transition: border-color .12s, box-shadow .12s, transform .08s; display: block; }
a.coach-card:hover { border-color: var(--blue); box-shadow: 0 10px 24px -16px rgba(16,26,51,.6); transform: translateY(-1px); }
.coach-go { display: inline-block; margin-top: 10px; font-size: 12px; font-weight: 800; letter-spacing: .3px; text-transform: uppercase; color: var(--blue); }

/* Esercizi: testata, filtri, card, vista */
.coach-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.eser-filtri { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; align-items: center; }
.eser-filtri .adm-input, .eser-filtri .adm-select { flex: 1 1 150px; min-width: 150px; }
/* Mobile: ricerca e pulsante a tutta larghezza; le tendine affiancate a coppie */
.eser-filtri .eser-q { flex: 1 1 100%; }
.eser-filtri .btn-ghost-sm { flex: 1 1 100%; }
@media (min-width: 760px) {
  .eser-filtri .eser-q { flex: 2 1 240px; }
  .eser-filtri .btn-ghost-sm { flex: 0 0 auto; }
}
/* Card esercizio con miniatura del diagramma in copertina */
.eser-card { display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.eser-thumb { aspect-ratio: 1000 / 640; background: #2FA85A; display: block; border-bottom: 1px solid var(--line); }
.eser-thumb svg { width: 100%; height: 100%; display: block; }
/* Anteprima ingrandita nel popup (senza aprire l'esercizio) */
.eser-preview-big { width: 100%; }
/* SVG statico di fallback: riempie la larghezza */
.eser-preview-big > svg { width: 100%; height: auto; display: block; border-radius: 12px; background: #2FA85A; }
/* Diagramma interattivo (con ▶ Anima): a tutta larghezza, niente cap a 420px */
.eser-preview-big .coach-editor.eser-diag { max-width: none; width: 100%; margin: 0; padding: 0; border: none; background: transparent; }
.eser-preview-big .ce-canvas { border-radius: 12px; }
/* Nel popup già ingrandito il pulsante "Ingrandisci" è superfluo */
.eser-preview-big .ce-diag-zoom { display: none; }
.eser-thumb-empty { width: 100%; height: 100%; display: grid; place-items: center; font-size: 40px; color: rgba(255, 255, 255, .7);
  background: repeating-linear-gradient(90deg, #2FA85A 0 34px, #2CA156 34px 68px); }
.eser-body { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px 14px; flex: 1; }
.eser-card h3 { margin: 0; font-size: 16px; line-height: 1.15; }
.eser-card p { margin: 0; font-size: 12.5px; color: var(--muted); }
.eser-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.eser-obj { display: flex; gap: 6px; flex-wrap: wrap; }
.pill-obj { font-size: 10px; font-weight: 800; letter-spacing: .2px; padding: 2px 8px; border-radius: 100px;
  background: color-mix(in srgb, var(--blue) 12%, var(--card)); color: var(--blue); }
.pill-mini.alt { background: var(--soft); color: var(--muted); }
.pill-mini.ok { background: color-mix(in srgb, var(--ok) 14%, var(--card)); color: var(--ok); }
.pill-mini.lib { background: color-mix(in srgb, var(--blue) 14%, var(--card)); color: var(--blue); }
.eser-meta { display: flex; gap: 10px; font-size: 12px; color: var(--muted); font-weight: 700; margin-top: auto; padding-top: 6px; }
.eser-meta .lvl { color: #f5a623; letter-spacing: 1px; }
.eser-meta .lvl .off { color: var(--line); }
/* La stella preferito poggia sulla miniatura: chip bianco per contrasto */
.eser-card-wrap .star-btn { background: rgba(255, 255, 255, .9); box-shadow: 0 1px 4px rgba(0, 0, 0, .18); }
.eser-card-wrap .star-btn.on { background: rgba(255, 255, 255, .95); }

/* Mini-dashboard in home */
.coach-stats { display: flex; gap: 12px; flex-wrap: wrap; margin: 6px 0 18px; }
.coach-stats .stat { flex: 1; min-width: 120px; background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 12px 16px; }
.coach-stats .stat b { display: block; font-family: var(--font-display); font-size: 30px; line-height: 1; color: var(--blue); }
.coach-stats .stat span { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--muted); font-weight: 800; }
.eser-view p { margin: 10px 0; }
.eser-view .pill-mini { margin-right: 6px; }
/* Web full/tablet largo: diagramma a sinistra, dettagli a destra (lettura comoda) */
@media (min-width: 820px) {
  .eser-view { overflow: hidden; }
  .eser-view .eser-diag { float: left; width: 420px; margin: 0 24px 12px 0; }
  .eser-view > p:first-of-type { margin-top: 0; }
}

/* Scheda esercizio (vista condiviso) — card strutturata, stile YouCoach */
.eser-sheet { background: var(--card); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; margin-top: 8px; }
.eser-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #0E1B44; color: #fff; padding: 12px 16px; }
.eser-sheet-head h2 { margin: 0; font-family: var(--font-display); font-size: 22px; letter-spacing: .5px; line-height: 1; }
.eser-lvl { flex: 0 0 auto; font-size: 11px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; background: rgba(255, 255, 255, .16); padding: 5px 10px; border-radius: 100px; }
.eser-obj-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 16px; background: var(--soft); border-bottom: 1px solid var(--line); }
.eser-obj-badge { font-size: 10px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; background: var(--red); color: #fff; padding: 4px 10px; border-radius: 6px; }
.eser-obj-val { font-weight: 800; color: var(--ink); }
.eser-sheet-tags { display: flex; gap: 6px; margin-left: auto; }
.eser-sheet .eser-view { padding: 16px; }
.eser-mat { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin: 12px 0; }
.eser-mat-head { background: var(--red); color: #fff; font-weight: 800; font-size: 11px; letter-spacing: 1px; text-transform: uppercase; padding: 7px 14px; }
.eser-mat ul { margin: 0; padding: 10px 14px 10px 32px; }
.eser-mat li { font-size: 13.5px; margin: 2px 0; }
.eser-sheet-actions { padding: 0 16px 16px; }
.eser-diag { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 8px; margin-bottom: 12px; max-width: 420px; }
/* Scheda esercizio condiviso (desktop 2 colonne): diagramma a piena larghezza
   della colonna, senza il cap 420px, mantenendo Anima/Ingrandisci. */
.eser-diag-full .coach-editor.eser-diag { max-width: none; width: 100%; }
/* Controlli sovrapposti alla miniatura (selezione/lente): le icone NON devono
   ereditare lo stiramento al 100% previsto per gli SVG del diagramma. */
.eser-pick-ctl svg { width: 1.25rem; height: 1.25rem; display: inline-block; }
/* Selettore esercizi (dialog seduta): miniature compatte, così ne entrano di più
   a schermo. Il dettaglio si guarda con la lente (anteprima ingrandita). */
.eser-pick-thumb { height: 116px; overflow: hidden; display: flex; align-items: center; justify-content: center; border-radius: 12px 12px 0 0; }
.eser-pick-thumb svg { width: 100%; height: 100%; object-fit: contain; }
.eser-pick-thumb .eser-thumb-empty { font-size: 28px; }
/* Controllo "▶ Anima" nella scheda esercizio in sola lettura (solo se multi-fase) */
.ce-ro-anim { margin-bottom: 6px; }
.eser-diag svg { width: 100%; height: auto; display: block; }

/* Editor diagramma campo */
/* L'editor riempie tutta la colonna (campo più grande). Le coordinate del
   diagramma sono nel viewBox 1000x640: ingrandire è solo visivo, non tocca gli
   esercizi salvati. La miniatura in sola lettura resta compatta. */
.coach-editor { max-width: none; width: 100%; }
.coach-editor.eser-diag { max-width: 420px; }
.ce-toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; align-items: flex-start; }
/* Gruppi di strumenti per categoria (Giocatori / Materiali / Azioni) */
.ce-group { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 10px; }
.ce-group-lbl { width: 100%; font-size: 10px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; color: var(--muted); }
.ce-mat-hint { font-size: 11.5px; color: var(--muted); font-style: italic; }
.ce-tool { padding: 6px 10px; border-radius: 9px; border: 1.5px solid var(--line); background: var(--card);
  color: var(--ink); font-weight: 800; font-size: 12px; cursor: pointer; }
.ce-tool:hover { border-color: var(--blue); }
.ce-tool.on { background: var(--blue); border-color: var(--blue); color: #fff; }
/* Azione non applicabile alla selezione corrente: spenta, non cliccabile
   (il perché è nel tooltip del pulsante). */
.ce-tool:disabled { opacity: .42; cursor: not-allowed; }
.ce-tool:disabled:hover { border-color: var(--line); }
/* Tutorial comprimibile sopra l'editor del diagramma */
.ce-tutorial { border: 1.5px solid var(--line); border-radius: 10px; background: var(--card); margin: 6px 0 10px; }
.ce-tutorial > summary { cursor: pointer; font-weight: 800; font-size: 13px; padding: 9px 12px; list-style: none; }
.ce-tutorial > summary::-webkit-details-marker { display: none; }
.ce-tutorial[open] > summary { border-bottom: 1px solid var(--line); }
.ce-tutorial ol { margin: 8px 0; padding: 0 14px 0 30px; }
.ce-tutorial li { font-size: 12.5px; line-height: 1.5; margin-bottom: 6px; }
.ce-tut-note { font-size: 11.5px; color: var(--muted); margin: 0; padding: 0 12px 10px; }

/* Contenitore icone-materiale dinamiche: i pulsanti fluiscono nella toolbar */
.ce-mattools { display: contents; }
/* Separatore verticale tra gruppi di strumenti nella toolbar */
.ce-sep { width: 1px; align-self: stretch; background: var(--line); margin: 2px 4px; }
@media (max-width: 560px) { .ce-sep { display: none; } }
.ce-canvas { width: 100%; height: auto; aspect-ratio: 1000 / 640; display: block;
  background: #2FA85A; border: 1px solid var(--line); border-radius: 12px;
  /* touch: niente scroll/zoom/selezione/evidenziazione tap durante il disegno */
  touch-action: none; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; }
.ce-hint { font-size: 11.5px; color: var(--muted); margin: 6px 2px 0; }
.ce-hint.ce-flash { color: var(--red); font-weight: 800; }
/* Barra delle fasi (animazione) */
.ce-fasi-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.ce-fasi-tit { font-size: 11px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--muted); margin-right: 4px; }
.ce-fasi { font-weight: 800; font-size: 12.5px; min-width: 74px; text-align: center; }
.ce-tool.ce-anima { background: var(--blue); border-color: var(--blue); color: #fff; }
.ce-scrub { flex: 1 1 120px; min-width: 90px; max-width: 260px; accent-color: var(--blue); cursor: pointer; }
.ce-speed { padding: 4px 6px; font-size: 12px; }
.ce-loop { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; color: var(--muted); }
.ce-loop input { accent-color: var(--blue); }
/* Barra modelli di setup campo */
.ce-modelli { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.ce-modelli .ce-mod-sel { width: auto; flex: 0 1 220px; min-width: 150px; }
.ce-drill { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.ce-drill .ce-drill-sel { width: auto; flex: 0 1 260px; min-width: 160px; }
/* Radar profilo per sezione (scheda sviluppo giocatore/portiere) */
.radar-wrap { display: flex; justify-content: center; }
.radar-svg { width: 100%; max-width: 420px; height: auto; }
.radar-ring { fill: none; stroke: var(--line); stroke-width: 1; opacity: .55; }
.radar-axis { stroke: var(--line); stroke-width: 1; opacity: .7; }
.radar-lbl { font-size: 11px; font-weight: 700; fill: var(--muted); }
.radar-poly { stroke-width: 2; stroke-linejoin: round; }
.radar-poly-ora { fill: rgba(40, 72, 159, .22); stroke: var(--blue); }
.radar-poly-prima { fill: none; stroke: #F97316; stroke-dasharray: 5 4; opacity: .85; }
.radar-dot { fill: var(--blue); }
.radar-lgd { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; color: var(--muted); }
.radar-sw { width: 14px; height: 0; border-top-width: 3px; border-top-style: solid; display: inline-block; }
.radar-sw-ora { border-top-color: var(--blue); }
.radar-sw-prima { border-top-color: #F97316; border-top-style: dashed; }
/* Editor etichetta inline (sostituisce prompt(), compatibile mobile/app) */
.coach-editor { position: relative; }
.ce-lblbox { position: absolute; top: 10px; left: 10px; z-index: 6; display: none; align-items: center; gap: 8px;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; box-shadow: 0 8px 24px rgba(0, 0, 0, .25); }
.ce-lblbox-t { font-size: 12px; font-weight: 800; color: var(--muted); }
.ce-lblin { width: 64px; font-size: 16px; padding: 6px 8px; border: 1.5px solid var(--line); border-radius: 8px; background: var(--paper); color: var(--ink); font-family: inherit; }
/* Palette maglie: campioni di colore per i giocatori selezionati */
.ce-colbox { position: absolute; top: 10px; right: 10px; z-index: 6; display: none; align-items: center; gap: 6px; flex-wrap: wrap; max-width: calc(100% - 20px);
  background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; box-shadow: 0 8px 24px rgba(0, 0, 0, .25); }
.ce-sw { width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--line); cursor: pointer; padding: 0; }
.ce-sw:hover { border-color: var(--blue); }
.ce-sw.on { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(40, 72, 159, .28); }
@media (hover: none) { .ce-sw { width: 38px; height: 38px; } }

/* Touch (telefono/tablet): strumenti comodi da toccare (≥44px), impacchettati
   a sinistra senza stiramenti; su desktop restano compatti. */
@media (hover: none) {
  .ce-toolbar { gap: 8px; }
  .ce-tool { min-height: 44px; padding: 9px 13px; font-size: 13.5px; }
}

/* Sedute: righe esercizio */
/* Riepilogo seduta: durata totale, n° esercizi, stima carico */
.seduta-sum { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 2px; }
.ss-chip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 999px;
  background: var(--card); border: 1px solid var(--line); font-size: 12.5px; color: var(--muted); }
.ss-chip b { color: var(--ink); font-weight: 800; }
.ss-chip.carico.carico-l { background: #e8f6ee; border-color: #b7e2c7; color: #1c7a43; }
.ss-chip.carico.carico-m { background: #fff5e0; border-color: #f2d79a; color: #9a6b00; }
.ss-chip.carico.carico-h { background: #fdeaec; border-color: #f3b7bd; color: #b4232f; }
.ss-chip.carico b { color: inherit; }
.fase-sub { color: var(--muted); font-size: 11.5px; font-weight: 700; margin-left: 8px; white-space: nowrap; }
.seduta-row { display: flex; align-items: center; justify-content: space-between; gap: 10px;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; margin: 6px 0; }
.seduta-row a { text-decoration: none; color: var(--ink); font-weight: 700; font-size: 13.5px; }
/* Riga esercizio arricchita: miniatura campo + tipo/durata */
.seduta-es { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; }
.seduta-thumb { flex: 0 0 auto; width: 64px; aspect-ratio: 1000 / 640; border-radius: 8px; overflow: hidden; background: #2FA85A; display: block; }
.seduta-thumb svg { width: 100%; height: 100%; display: block; }
.seduta-thumb-empty { display: grid; place-items: center; width: 100%; height: 100%; color: rgba(255, 255, 255, .7); font-size: 18px; }
.seduta-es-info { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.seduta-es-info b { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.seduta-es-info small { color: var(--muted); font-size: 11.5px; }

/* Documenti */
.doc-list { margin-top: 12px; }
.doc-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--card);
  border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; margin: 8px 0; }
.doc-info { flex: 1; min-width: 200px; }
.doc-info a { text-decoration: none; color: var(--blue); font-weight: 800; font-size: 14px; }
.doc-info small { display: block; color: var(--muted); font-size: 11.5px; }
.doc-cond { font-size: 12px; }

/* Liste/tassonomie: tabella + modale di modifica */
.tax-tbl { width: 100%; border-collapse: collapse; margin-top: 8px; }
.tax-tbl th, .tax-tbl td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--line); font-size: 14px; }
.tax-tbl th { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--muted); font-weight: 800; }
.tax-tbl td:nth-child(2) { width: 90px; color: var(--muted); }
.tax-tbl-az { text-align: right; width: 110px; white-space: nowrap; }
dialog.coach-modal { border: none; border-radius: 16px; padding: 20px; max-width: 420px; width: 92%;
  background: var(--card); color: var(--ink); box-shadow: 0 24px 60px -20px rgba(0,0,0,.5); }
dialog.coach-modal::backdrop { background: rgba(10,18,40,.45); }
dialog.coach-modal h3 { margin: 0 0 14px; font-size: 17px; }
dialog.coach-modal .adm-field { margin-bottom: 10px; }
.modal-az { display: flex; align-items: center; gap: 8px; margin-top: 16px; justify-content: flex-end; }
/* Preferiti esercizi: stella in alto a destra sulla card */
.eser-card-wrap { position: relative; }
.eser-star { position: absolute; top: 6px; right: 6px; z-index: 2; margin: 0; }
.star-btn { background: none; border: none; cursor: pointer; font-size: 22px; line-height: 1;
  color: var(--muted); padding: 2px 4px; border-radius: 8px; }
.star-btn:hover { color: #f5a623; background: color-mix(in srgb, #f5a623 12%, transparent); }
.star-btn.on { color: #f5a623; }

/* ---- Programmi: cartelle di sedute ---- */
.prog-tools { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 12px; }
.prog-tools .adm-input, .prog-tools .adm-select { width: auto; flex: 1; min-width: 130px; }
.prog-seg { display: inline-flex; border: 1.5px solid var(--line); border-radius: 11px; overflow: hidden; }
.prog-seg a { padding: 8px 13px; font-weight: 800; font-size: 13px; color: var(--muted); text-decoration: none; }
.prog-seg a.on { background: var(--blue); color: #fff; }
.prog-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); margin-top: 14px; }
.prog-folder { position: relative; border: 1px solid var(--line); border-radius: 15px; background: var(--card);
  overflow: hidden; text-decoration: none; color: inherit; display: flex; flex-direction: column;
  transition: transform .08s, box-shadow .12s; }
.prog-folder:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -20px rgba(16,26,51,.55); }
.prog-folder .tab { height: 8px; width: 100%; }
.prog-folder .bd { padding: 14px 15px 15px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.prog-folder .ic { width: 38px; height: 38px; border-radius: 11px; display: flex; align-items: center; justify-content: center; }
.prog-folder .ic svg { width: 20px; height: 20px; }
.prog-folder h3 { font-weight: 800; font-size: 17px; margin: 2px 0 0; line-height: 1.05; }
.prog-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.prog-chip { font-size: 10px; font-weight: 800; letter-spacing: .4px; text-transform: uppercase;
  padding: 3px 8px; border-radius: 100px; background: var(--soft); color: var(--blue); }
.prog-chip.cal { background: var(--card); border: 1px solid var(--line); color: var(--muted); }
.prog-foot { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 6px; }
.prog-n { font-weight: 800; font-size: 13px; }
.prog-n small { color: var(--muted); font-weight: 700; }
.prog-pill { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; padding: 3px 8px; border-radius: 100px; }
.prog-pill.att { background: color-mix(in srgb, var(--ok) 14%, var(--card)); color: #157a44; }
.prog-pill.arc { background: #eef0f5; color: #8a93ac; }
.prog-folder.arc { opacity: .72; }
.prog-folder.add { border: 1.6px dashed #c7d0e6; background: color-mix(in srgb, var(--blue) 4%, var(--card));
  align-items: center; justify-content: center; text-align: center; color: var(--blue); font-weight: 800; cursor: pointer; min-height: 150px; }
.prog-folder.add .plus { font-size: 30px; line-height: 1; margin-bottom: 6px; }
.prog-folder.senza .ic { background: #eef0f5; color: #8a93ac; }
.prog-badge { display: inline-block; font-size: 10px; font-weight: 800; letter-spacing: .3px; text-transform: uppercase;
  padding: 2px 8px; border-radius: 100px; color: #fff; margin-top: 6px; }
/* dettaglio */
.prog-head { display: flex; gap: 16px; align-items: flex-start; border: 1px solid var(--line); border-radius: 16px; padding: 16px; background: var(--card); }
.prog-head .bar { width: 6px; align-self: stretch; border-radius: 6px; flex: 0 0 auto; min-height: 56px; }
.prog-head .body { flex: 1; }
.prog-head h2 { font-size: 22px; margin: 0; line-height: 1.05; }
.prog-head .desc { margin: 8px 0 0; color: #44506a; font-size: 14px; }
.prog-head .az { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 560px) { .prog-head { flex-direction: column; } }

/* =========================================================================
   Mobile hardening — web + guscio Capacitor (dual-use) — Coach
   Safe-area della chrome su .coach-top / .coach-main (env()=0 su desktop).
   ========================================================================= */

/* iOS: evita lo zoom automatico al focus (font < 16px). Solo su mobile. */
@media (max-width: 767px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select, textarea, .adm-input, .adm-select { font-size: 16px; }
}

/* Feedback al tocco (niente :hover sul touch). */
.coach-nav a, .coach-icon, .ce-tool, .star-btn, .prog-seg a,
a.coach-card { -webkit-tap-highlight-color: transparent; }
@media (hover: none) {
  .coach-icon:active, .ce-tool:active, .star-btn:active,
  .coach-nav a:active, .prog-seg a:active, a.coach-card:active { transform: scale(.97); }
}

/* Solo nel guscio nativo (classe messa da theme.js). */
.is-native-app { -webkit-touch-callout: none; overscroll-behavior-y: none; }
.is-native-app a, .is-native-app button { -webkit-user-select: none; user-select: none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
}

/* --- Schede di valutazione --- */
.val-head { display: flex; gap: 14px; flex-wrap: wrap; }
.val-head .adm-field { flex: 1 1 180px; }
.val-tbl th:nth-child(2), .val-tbl td:nth-child(2) { width: 180px; }
.val-tbl .adm-select, .val-tbl .adm-input { width: 100%; }

/* --- Ingrandimento diagramma (esercizi condivisi): overlay a schermo intero --- */
.ce-diag-zoom { margin-top: 8px; }
.ce-zoom-ov {
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(8, 15, 30, .86);
  display: flex; align-items: center; justify-content: center;
  padding: 16px; overflow: auto;
}
.ce-zoom-box { position: relative; width: 100%; max-width: 1200px; }
.ce-zoom-close {
  position: absolute; top: -8px; right: -8px; z-index: 2;
  width: 42px; height: 42px; border-radius: 50%; border: 0;
  background: #fff; color: #16203a; font-size: 18px; font-weight: 800;
  cursor: pointer; box-shadow: 0 6px 18px rgba(0, 0, 0, .45);
}
.ce-zoom-ed { width: 100%; }
.ce-zoom-ed svg.ce-canvas { width: 100%; height: auto; max-height: 86vh; border-radius: 10px; }
.ce-zoom-ed .ce-ro-anim { margin-bottom: 8px; }

/* Mister 2 (editor): nuvoletta "FIIU!" + onde del fischietto animate. */
.cm2-bubble { transform-box: fill-box; transform-origin: center; animation: cm2-pop 2.2s ease-in-out infinite; }
.cm2-wave { transform-box: fill-box; transform-origin: left center; opacity: 0; animation: cm2-toot 2.2s ease-out infinite; }
.cm2-wave.w2 { animation-delay: .28s; }
@keyframes cm2-pop { 0%, 100% { transform: scale(.82); opacity: .5; } 45%, 65% { transform: scale(1.06); opacity: 1; } }
@keyframes cm2-toot { 0% { opacity: 0; transform: translateX(-1px); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateX(5px); } }
@media (prefers-reduced-motion: reduce) { .cm2-bubble, .cm2-wave { animation: none; } .cm2-bubble { opacity: 1; transform: none; } .cm2-wave { opacity: 1; } }