/* activite.css — vue Activité (#/activite).
   Bandeau santé L8, stat-cards K14/L15, funnel vertical, notes A→E,
   mouvements, santé des sources. Couleurs = variables (thème nuit unique),
   transitions d'interaction ≤ 200 ms uniquement (ambiant → anim.css). */

/* ---------- Bandeau santé (verre frost pleine largeur — MISSION3 6) ---------- */
/* Plus de lentille ici (fantômes de bord au scroll) : blur fort + reflet
   spéculaire = classe PARTAGÉE `.glass-frost` (app.css §14) posée par
   activite.js — ne rester ici que le spécifique vue (marge, hover). */
.act-health{margin:0 0 20px;transition:transform .18s,box-shadow .18s}
/* Hover subtil (MISSION2 10) : lift + ombre douce, SANS réfraction supplémentaire. */
.act-health:hover{transform:translateY(-1px);
  box-shadow:0 10px 28px rgba(0,0,0,.3),inset 0 1px 0 var(--rim)}
.act-health-in{display:flex;align-items:center;gap:16px;padding:20px 24px}
.act-health-orb{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb, var(--ok) 16%, transparent);color:var(--ok)}
.act-health[data-status="warn"] .act-health-orb{
  background:color-mix(in srgb, var(--warn) 16%, transparent);color:var(--warn)}
.act-health[data-status="danger"] .act-health-orb{
  background:color-mix(in srgb, var(--danger) 16%, transparent);color:var(--danger)}
.act-health-txt{min-width:0}
.act-health-title{margin:0;font-size:17px;display:flex;align-items:center;gap:8px}
.act-health-title strong{font-weight:760;letter-spacing:-.01em}
.act-health-title .ic{color:var(--ok)}
.act-health-sub{margin:3px 0 0;font-size:13.5px;color:var(--muted);line-height:1.5}

/* ---------- Stat-cards K14 (lentilles L15) ---------- */
.act-stats{margin:0 0 20px}
/* Dosage homogène du lens-hover (MISSION2 10) : ~180 ms partout
   (surcharge le .35s du kit — activite.css est chargé après kit.css). */
.act-stat,.act-card-lens{transition:box-shadow .18s,transform .18s}
.act-stat{min-height:118px}
.act-stat .lg-content{width:100%;height:100%}
.act-stat-in{display:flex;flex-direction:column;justify-content:center;gap:3px;text-align:left}
.act-stat-in b{font-size:28px}
.act-stat-lbl{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:640;color:var(--txt)}
.act-stat-lbl .ic{color:var(--accent-ink)}
.act-stat-sub{font-size:12px;color:var(--muted)}
.act-clickable{cursor:pointer}
.act-clickable:focus-visible{outline:2px solid var(--accent-ink);outline-offset:2px}
.act-ok{color:var(--ok)}
.act-warn{color:var(--warn)}
.act-danger{color:var(--danger)}
.act-stat-in b.act-ok{color:var(--ok)}
.act-stat-in b.act-warn{color:var(--warn)}
.act-stat-in b.act-danger{color:var(--danger)}
/* Relances en retard — sémantique tâches --task (MISSION4 2-3) : chiffre et
   sous-titre teintés, carte au liseré lumineux tant qu'un retard existe.
   La lumière s'éteint (classes retirées par activite.js) quand tout est à jour. */
.act-task{color:var(--task)}
.act-stat-in b.act-task{color:var(--task)}
.act-stat-late{
  box-shadow:0 0 24px color-mix(in srgb, var(--task) 18%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--task) 38%, transparent),
    inset 0 1px 0 rgba(255,255,255,.35)}
/* Préserve le liseré --task sous le lift du kit (.lens-hover:hover). */
.act-stat-late.lens-hover:hover{
  box-shadow:0 14px 36px rgba(0,0,0,.42),
    0 0 24px color-mix(in srgb, var(--task) 24%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--task) 42%, transparent)}
/* Tâche 5 — tant qu'un retard subsiste, le sous-titre pulse doucement : le
   voyant ne s'éteint QUE quand la relance est cochée. sfaPulse vit dans
   anim.css (non modifié) et n'est défini qu'en mouvement non réduit. */
@media (prefers-reduced-motion: no-preference){
  .act-stat-late .act-stat-sub{border-radius:999px;animation:sfaPulse 2.6s ease-in-out infinite}
}

/* ---------- Grille 2 colonnes ---------- */
.act-grid{align-items:start}
.act-card{display:flex;flex-direction:column;gap:14px;min-width:0}
/* Panneaux Parcours/Notes en lentille L15 légère (MISSION2 10) :
   le contenu vit dans .lg-content.card.act-card, la section porte la lentille. */
.act-card-lens{display:block}
.act-card-lens>.lg-content.act-card{width:100%}
.act-card-head{display:flex;align-items:center;gap:9px}
.act-card-head .ic{color:var(--accent-ink)}
.act-card-head h2{font-size:16px;font-weight:720;letter-spacing:-.01em}
.act-empty-line{margin:0;font-size:13.5px}

/* ---------- Le parcours (funnel vertical) ---------- */
.act-funnel{display:flex;flex-direction:column;gap:8px}
.act-fstage{display:flex;flex-direction:column;gap:5px}
.act-flbl{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  font-size:13px;font-weight:620}
.act-ftrack{height:14px;border-radius:7px;background:rgba(255,255,255,.08);overflow:hidden}
.act-fbar{height:100%;border-radius:7px;min-width:0;
  background:linear-gradient(90deg, var(--accent), var(--accent2))}
.act-fconv{display:flex;align-items:center;gap:7px;padding:2px 2px 2px 6px;
  font-size:12.5px;color:var(--muted)}
.act-fconv .ic{flex:none;color:var(--dim)}

/* ---------- Les notes (barre segmentée + légende) ---------- */
.act-dist{display:flex;gap:3px;height:14px;border-radius:7px;overflow:hidden}
.act-seg{display:block;height:100%;min-width:8px;border-radius:3px}
.act-seg.has-tip{cursor:help}
.act-legend{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.act-legend-item{display:inline-flex;align-items:center;gap:7px}
.act-total{margin:0}

/* ---------- Derniers mouvements ---------- */
.act-mvts{display:flex;flex-direction:column;gap:4px}
.act-mvt{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;
  border:none;border-radius:11px;background:none;color:var(--txt);font:inherit;
  text-align:left;cursor:pointer;transition:background .16s}
.act-mvt:hover{background:rgba(255,255,255,.08)}
.act-mvt:focus-visible{outline:2px solid var(--accent-ink);outline-offset:1px}
.act-mvt-den{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:13.5px;font-weight:620}
.act-mvt-stage{flex:none;white-space:nowrap}
.act-mvt-date{flex:none}

/* ---------- Santé des sources ---------- */
.act-src-agg{margin:-6px 0 0}
.act-card .acc{background:rgba(255,255,255,.04);box-shadow:none}
.act-srcs{display:flex;flex-direction:column;gap:2px}
.act-src{display:flex;align-items:center;gap:12px;padding:8px 2px}
.act-src + .act-src{border-top:1px solid var(--line)}
.act-src-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.act-src-name{font-size:13.5px;font-weight:620;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.act-src-name.has-tip{align-self:flex-start}
.act-src-chip{flex:none}
/* Tâche 3 — fraîcheur : une source dont le dernier relevé a dépassé le seuil
   serveur (`is_stale`) est marquée « à rafraîchir », même sans erreur. */
.act-src-rythme{margin:2px 0 0;font-size:12px}
.act-src-stale{background:color-mix(in srgb, var(--warn) 8%, transparent);
  border-radius:9px;padding-left:6px;padding-right:6px}
.act-src-stale .act-src-name{color:var(--warn)}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .act-grid.g2{grid-template-columns:1fr}
}
@media (max-width:820px){
  .act-health-in{padding:16px 18px}
}

/* ---------- Mouvement réduit (MISSION2 : toute animation ajoutée) ---------- */
@media (prefers-reduced-motion:reduce){
  .act-health,.act-stat,.act-card-lens{transition:none}
  .act-health:hover,.act-stat:hover,.act-card-lens:hover{transform:none}
}