/* ============================================================================
   semaine.css — INC-3 « Ma semaine terrain » : cockpit réel (STAGING)
   ----------------------------------------------------------------------------
   Compagnon de js/ui/semaine.ui.js. Tout est namespacé .ops- / #opsem-root :
   AUCUNE collision possible avec map.css / menu-v8.css / flowbite.
   Référence visuelle : product/mockups/planning_v5/index.html (tokens repris).
   Mobile-first (la semaine terrain se vit sur téléphone — CDC03 §F-5) ;
   desktop = colonne centrée 430px sur fond dimé.
   ============================================================================ */

#opsem-root{
  --ops-rose:#d946ef; --ops-orange:#f59e0b; --ops-rouge:#ef4444;
  --ops-violet:#7c3aed; --ops-emeraude:#059669; --ops-vert:#10b981;
  --ops-vertpro:#15803d; /* É5 : vert PRO canonique (code_couleur.md) — PM = vert, jamais une autre couleur */
  --ops-slate:#0f172a; --ops-slate-2:#334155; --ops-slate-3:#64748b;
  --ops-line:#e2e8f0; --ops-bg:#f1f5f9; --ops-card:#ffffff;
  --ops-r:18px; --ops-shadow:0 1px 2px rgba(15,23,42,.06),0 8px 24px rgba(15,23,42,.08);

  position:fixed; inset:0; z-index:10500;
  display:flex; justify-content:center; align-items:stretch;
  background:rgba(11,18,32,.55);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ops-slate);
}
#opsem-root[hidden]{ display:none; }
#opsem-root *{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }

/* colonne « device » : plein écran mobile, centrée desktop */
.ops-device{
  width:100%; max-width:430px; height:100%;
  background:var(--ops-bg); position:relative; overflow:hidden;
  display:flex; flex-direction:column; min-height:0;
}
@media(min-width:520px){
  .ops-device{ height:calc(100% - 32px); margin:16px 0; border-radius:22px;
    box-shadow:0 30px 80px rgba(0,0,0,.5); }
}

/* ---- barre haute ---- */
.ops-mbar{ display:flex; align-items:center; gap:8px; padding:14px 12px 10px;
  background:var(--ops-card); border-bottom:1px solid var(--ops-line); flex:0 0 auto; }
.ops-mbar .ops-back{ width:40px; height:40px; border:none; background:#f1f5f9; border-radius:11px;
  font-size:20px; color:var(--ops-slate-2); cursor:pointer; flex:0 0 auto; font-family:inherit; }
.ops-mbar .ops-ttl{ flex:1; min-width:0; }
.ops-mbar .ops-ttl .t{ font-size:16px; font-weight:700; letter-spacing:-.3px; }
.ops-mbar .ops-ttl .s{ font-size:12px; color:var(--ops-slate-3); margin-top:1px; }
.ops-mbar .ops-refresh{ width:40px; height:40px; border:none; background:#f1f5f9; border-radius:11px;
  font-size:16px; color:var(--ops-slate-2); cursor:pointer; flex:0 0 auto; font-family:inherit; }

/* ---- zone scrollable (flex-column : min-height 0 OBLIGATOIRE) ---- */
.ops-scroll{ flex:1; min-height:0; overflow-y:auto; padding:0 16px 90px;
  -webkit-overflow-scrolling:touch; }

/* [PLANNINGCOSSU 2026-06-13] En-tête « Ma semaine terrain » COSSU (retour Nicolas).
   Bandeau soigné de la famille OR du planning (référence : l'or scintillant du hero %
   et du bloc « Nouveautés du jour », menupolish) — crème dégradé, filet doré #d4a017,
   médaillon or plein + icône blanche, titre brun #78350f en typo serrée. Bandeau CALME :
   aucun balayage (le scintillement reste dans le hero % juste en dessous, on ne le double pas). */
.ops-hd{ padding:16px 4px 6px; } /* fallback historique (au cas où .cossu absent) */
.ops-hd.cossu{ display:flex; align-items:center; gap:12px;
  margin:12px 0 6px; padding:14px 16px; border-radius:var(--ops-r);
  background:linear-gradient(135deg,#fffdf5 0%,#fef3c7 60%,#fde68a 100%);
  border:1px solid #e3bf57; border-left:4px solid #d4a017;
  box-shadow:0 2px 10px rgba(212,160,23,.18); }
.ops-hd.cossu .ops-hd-medal{ width:42px; height:42px; border-radius:12px; flex:0 0 auto;
  display:grid; place-items:center;
  background:linear-gradient(135deg,#d4a017,#b8860b); color:#fff;
  box-shadow:0 2px 6px rgba(184,134,11,.35); }
.ops-hd.cossu .ops-hd-medal svg{ width:22px; height:22px; }
.ops-hd.cossu .ops-hd-tx{ flex:1; min-width:0; display:flex; flex-direction:column; }
.ops-hd.cossu .hello{ font-size:12px; font-weight:700; letter-spacing:.4px; text-transform:uppercase;
  color:#92400e; }
.ops-hd.cossu h1{ margin:1px 0 0; font-size:22px; line-height:1.1; letter-spacing:-.4px;
  font-weight:800; color:#78350f; }
/* anciennes règles (gardées pour la variante sans .cossu, jamais émises désormais) */
.ops-hd:not(.cossu) .hello{ font-size:13px; color:var(--ops-slate-3); }
.ops-hd:not(.cossu) h1{ margin:2px 0 0; font-size:21px; letter-spacing:-.4px; }

/* ---- hero [COCKPIT2 2026-06-12, retour Nicolas] : bandeau ENCRE, le GROS %
   dans l'anneau, point. Option retenue « encre & émeraude » : fond ink dégradé
   (neutre design-system, aucune couleur métier volée — code_couleur.md), anneau
   vert progression qui ressort = marqueur fort sans sapin de Noël.
   Alternative challengée (capture) : .ops-hero.alt = lavis émeraude clair.
   Or/ambre REJETÉ : trop proche de l'orange « à revoir » (#f59e0b), confusion. */
/* [MENUPOLISH 2026-06-12] verdict Nicolas in vivo (12-06 soir) : l'or profond
   mat #7a5c0a est REJETÉ. La référence ADORÉE existe dans l'app : le bloc
   « Nouveautés du jour » de la Veille (actualite.ui.js .actu-gold-section) —
   or clair #fef3c7->#fde68a, bordure #d4a017, BALAYAGE lumineux 4s. Appliqué
   au bandeau % du planning : fond or scintillant, textes bruns #78350f
   (~7.4:1 sur le stop le plus clair), arc de progression OR SOMBRE #b8860b
   sur piste brune translucide, % brun sur pastille BLANCHE (~8.7:1, plein
   soleil). Distinction « À revoir » #f59e0b : l'orange relance est un APLAT
   vif ; l'or planning est CLAIR, BORDÉ #d4a017 et SCINTILLANT. */
.ops-hero{ position:relative; display:flex; flex-direction:column; align-items:center; gap:9px;
  background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%);
  border:2px solid #d4a017; overflow:hidden;
  border-radius:var(--ops-r); padding:20px 16px 15px;
  box-shadow:0 4px 14px rgba(212,160,23,.30); margin:10px 0 6px; }
.ops-hero::before{ content:""; position:absolute; inset:-50%;
  background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%);
  animation:opsGoldSweep 4s linear infinite; pointer-events:none; z-index:1; }
@keyframes opsGoldSweep{ 0%{ transform:translateX(-100%) translateY(-100%); }
  100%{ transform:translateX(100%) translateY(100%); } }
@media (prefers-reduced-motion: reduce){ .ops-hero::before{ animation:none; } }
.ops-hero > :not(.ops-ring-info){ position:relative; z-index:2; }
.ops-ring{ --p:0; width:118px; height:118px; border-radius:50%; flex:0 0 auto;
  background:conic-gradient(#b8860b calc(var(--p)*1%), rgba(120,53,15,.16) 0);
  display:grid; place-items:center; box-shadow:0 0 0 7px rgba(255,255,255,.35); }
.ops-ring.over{ background:conic-gradient(#78350f calc((var(--p) - 100)*1%), #b8860b 0); }
.ops-ring i{ width:92px; height:92px; border-radius:50%; background:#fff;
  display:grid; place-items:center; font-style:normal; font-weight:800; font-size:27px;
  letter-spacing:-.5px; color:#78350f; }
.ops-hero .cap{ font-size:11px; font-weight:700; letter-spacing:.9px; text-transform:uppercase;
  color:#92400e; }
.ops-hero .ops-ring-info{ position:absolute; top:10px; right:10px; width:28px; height:28px;
  border-radius:50%; border:1px solid rgba(120,53,15,.28); background:rgba(255,255,255,.55);
  color:#92400e; font-size:13px; font-weight:700; font-style:italic; z-index:2;
  font-family:Georgia,'Times New Roman',serif; line-height:1; cursor:pointer; padding:0; }
/* alternative challengée (NON retenue, gardée pour comparaison visuelle) */
.ops-hero.alt{ background:linear-gradient(140deg,#ecfdf5 0%,#d1fae5 55%,#a7f3d0 100%); }
.ops-hero.alt .ops-ring{ background:conic-gradient(var(--ops-vert) calc(var(--p)*1%), rgba(15,23,42,.08) 0); box-shadow:none; }
.ops-hero.alt .ops-ring i{ background:#fff; color:var(--ops-slate); }
.ops-hero.alt .cap{ color:#047857; }
.ops-hero.alt .ops-ring-info{ border-color:rgba(15,23,42,.18); background:rgba(255,255,255,.6); color:#047857; }

/* [COCKPIT2] punchline du jour — EN DESSOUS de l'anneau (retour Nicolas) */
.ops-punch{ margin:9px 6px 0; font-size:13px; font-style:italic; color:var(--ops-slate-3);
  line-height:1.5; text-align:center; }

/* ---- série ---- */
.ops-serie{ display:flex; align-items:center; gap:10px; background:var(--ops-card);
  border:1px solid var(--ops-line); border-radius:14px; padding:10px 13px; margin:8px 0 0;
  box-shadow:var(--ops-shadow); }
.ops-serie .k{ font-size:12.5px; font-weight:700; }
.ops-serie .dots{ display:flex; gap:5px; margin-left:auto; }
.ops-serie .dot{ width:9px; height:9px; border-radius:50%; background:#e2e8f0; }
.ops-serie .dot.on{ background:var(--ops-vert); }
/* [SERIE5J 2026-06-13] petit ⓘ d'explication (famille du ⓘ de l'anneau) */
.ops-serie .ops-serie-info{ flex:0 0 auto; width:20px; height:20px; border-radius:50%;
  border:1px solid rgba(120,53,15,.28); background:rgba(255,255,255,.55); color:#92400e;
  font-size:11px; font-weight:700; font-style:italic; line-height:1; cursor:pointer; padding:0;
  font-family:Georgia,'Times New Roman',serif; display:flex; align-items:center; justify-content:center; }

/* [SEMAINEJOURS 2026-06-15] BANDE SEMAINE (remplace le strip-légende .ops-serie).
   7 colonnes lundi->dimanche ; chaque jour porte des PASTILLES de couleur (couleur
   canonique du module, posée inline par tileHtml COLORS) selon les actions DATÉES
   du jour ; le JOUR COURANT (.today) ressort (anneau + fond). Mobile-first. */
.ops-week{ display:flex; align-items:center; gap:8px; background:var(--ops-card);
  border:1px solid var(--ops-line); border-radius:14px; padding:9px 11px; margin:8px 0 0;
  box-shadow:var(--ops-shadow); }
.ops-week .ops-week-info{ flex:0 0 auto; width:20px; height:20px; border-radius:50%;
  border:1px solid rgba(120,53,15,.28); background:rgba(255,255,255,.55); color:#92400e;
  font-size:11px; font-weight:700; font-style:italic; line-height:1; cursor:pointer; padding:0;
  font-family:Georgia,'Times New Roman',serif; display:flex; align-items:center; justify-content:center; }
.ops-week-row{ flex:1; min-width:0; display:flex; justify-content:space-between; gap:4px; }
.ops-week .wd{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center;
  gap:5px; padding:5px 2px 4px; border-radius:10px; border:1.5px solid transparent; }
.ops-week .wd-l{ font-size:11px; font-weight:700; color:var(--ops-slate-3); line-height:1; }
.ops-week .wd-pds{ display:flex; flex-wrap:wrap; align-content:flex-start; justify-content:center;
  gap:3px; min-height:9px; max-width:22px; }
.ops-week .wd-pds .pd{ width:7px; height:7px; border-radius:50%; flex:0 0 auto; box-sizing:border-box; }
/* [SEMAINEJOURS3] pastille PRÉVUE (planning) = creuse (contour de la couleur du module) */
.ops-week .wd-pds .pd.pp{ background:transparent !important; }
/* jour SANS pastille : un repère discret (jour passé/vide) — jamais une fausse couleur */
.ops-week .wd-pds:empty::before{ content:""; width:5px; height:5px; border-radius:50%;
  background:#e2e8f0; }
/* [SEMAINEJOURS2 2026-06-16] JOUR COURANT NETTEMENT distinct (retour Nicolas :
   l'ancien fond #eef2f7 quasi invisible). Anneau slate plein 2px + fond teinté +
   lettre OR (rappel médaille cossu) + barre d'accent sous le jour. */
.ops-week .wd.today{ border-color:#b8860b; border-width:2px;
  background:#fdf6e3;
  box-shadow:0 0 0 3px rgba(184,134,11,.18); position:relative; }
.ops-week .wd.today .wd-l{ color:#b8860b; font-weight:800; }

/* ===================== AGENDA « Proposition de la semaine » (2026-06-16) =====================
   Vue par défaut du planning. Vignettes nom+nombre+couleur métier, cercle score OR,
   jours passés grisés, 2 modes (Agenda/Liste), petite ligne météo (teinte ciel, hors palette
   métier). Scopé sous .ops-scroll pour ne rien toucher d'autre. */
.ops-scroll .ag-hello{ position:relative; display:flex; align-items:center; gap:12px; margin:2px 0 12px;
  /* [AGENDABRONZE 2026-06-16] BRONZE MÉTALLIQUE à reflets sombres (métal poli).
     Remplace le crème (régression). Palette alignée sur mon_compte (--bronze-light
     #d9ad5e / #a9802f / #8f6a26 / --bronze-deep #6e4f17) prolongée en quasi-noir
     #2a2118 / #1a140c pour les reflets sombres ; highlight blanc (inset) = éclat poli.
     Le cercle de % (.ag-ring) reste inchangé et ressort sur le bronze. */
  background:linear-gradient(135deg,#d9ad5e 0%,#a9802f 26%,#8f6a26 50%,#6e4f17 74%,#2a2118 92%,#1a140c 100%);
  border:1px solid #2a2118;
  border-left:4px solid #d9ad5e; border-radius:14px; padding:11px 12px 11px 13px; overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), inset 0 -10px 24px rgba(0,0,0,.35), 0 4px 14px rgba(26,20,12,.40); }
.ops-scroll .ag-hello .hello-tx{ flex:1; min-width:0; }
/* [AGENDABRONZE 2026-06-16] textes clairs lisibles sur le bronze sombre */
.ops-scroll .ag-hello .hi{ font-size:13px; font-weight:700; color:#f1ddc0; line-height:1.2; text-shadow:0 1px 2px rgba(0,0,0,.45); }
.ops-scroll .ag-hello .hi .nm{ font-weight:800; color:#fff8ec; }
.ops-scroll .ag-hello .ttl{ font-size:18px; font-weight:800; letter-spacing:-.4px; color:#fff8ec; line-height:1.15; margin-top:2px; text-shadow:0 1px 3px rgba(0,0,0,.50); }
.ops-scroll .ag-hello .sub{ font-size:11.5px; font-weight:600; color:#e7d3ad; margin-top:3px; text-shadow:0 1px 2px rgba(0,0,0,.40); }
.ops-scroll .ag-hello .sub b{ font-weight:800; color:#fff8ec; }
.ops-scroll .ag-ring{ flex:0 0 auto; width:96px; height:96px; position:relative; cursor:pointer; }
.ops-scroll .ag-ring .arc{ width:96px; height:96px; border-radius:50%;
  background:conic-gradient(#b8860b calc(var(--p)*1%), #ece3c8 0); }
.ops-scroll .ag-ring .hole{ position:absolute; inset:9px; border-radius:50%; background:#fffdf6;
  display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1; }
.ops-scroll .ag-ring .pct{ font-size:26px; font-weight:800; color:#0f172a; letter-spacing:-.5px; }
.ops-scroll .ag-ring .pct .u{ font-size:15px; font-weight:800; }
.ops-scroll .ag-ring .cap{ font-size:9.5px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; color:#64748b; margin-top:3px; }

.ops-scroll .ag-intro{ background:#fdf6e3; border:1px solid rgba(184,134,11,.32); border-radius:14px;
  padding:11px 12px 11px 13px; margin-bottom:12px; display:flex; align-items:flex-start; gap:9px; border-left:4px solid #b8860b; }
.ops-scroll .ag-intro .ic{ flex:0 0 auto; font-size:16px; line-height:1.2; margin-top:1px; }
.ops-scroll .ag-intro .tx{ flex:1; min-width:0; font-size:12.8px; line-height:1.5; color:#334155; font-weight:600; }
.ops-scroll .ag-intro .tx b{ font-weight:800; color:#0f172a; }
.ops-scroll .ag-more{ flex:0 0 auto; width:24px; height:24px; border-radius:50%; border:1px solid rgba(184,134,11,.4);
  background:#fff; color:#78350f; font-size:11px; font-weight:700; font-style:italic; font-family:Georgia,serif;
  display:flex; align-items:center; justify-content:center; cursor:pointer; }

/* petite ligne météo — teinte ciel, hors palette métier */
.ops-scroll .ag-meteo{ display:flex; align-items:center; gap:8px; margin-bottom:12px;
  background:#f0f9ff; border:1px solid #bae6fd; border-radius:11px; padding:7px 9px; }
.ops-scroll .ag-meteo .em{ flex:0 0 auto; font-size:16px; line-height:1; }
.ops-scroll .ag-meteo .msg{ flex:1; min-width:0; font-size:11.8px; line-height:1.35; color:#0369a1; font-weight:600; }
.ops-scroll .ag-meteo .msg b{ font-weight:800; }
.ops-scroll .ag-meteo .ag-more{ border-color:#bae6fd; color:#0369a1; width:22px; height:22px; font-size:10.5px; }
.ops-scroll .ag-meteo.loading{ opacity:.6; }

/* toggle 2 modes */
.ops-scroll .ag-toggle{ display:flex; gap:4px; background:#e8edf3; border:1px solid #e2e8f0; border-radius:12px; padding:4px; margin-bottom:12px; }
.ops-scroll .ag-toggle button{ flex:1; min-height:42px; border:0; border-radius:9px; background:transparent; cursor:pointer;
  font-size:14px; font-weight:700; color:#64748b; display:flex; align-items:center; justify-content:center; gap:7px;
  transition:background .16s ease,color .16s ease,box-shadow .16s ease; }
.ops-scroll .ag-toggle button svg{ width:17px; height:17px; stroke:currentColor; fill:none; flex:0 0 auto; }
.ops-scroll .ag-toggle button.on{ background:#fff; color:#78350f; box-shadow:0 1px 3px rgba(15,23,42,.12); }

/* en-têtes de section */
.ops-scroll .ag-sec{ margin:0 0 6px; display:flex; align-items:baseline; gap:8px; }
.ops-scroll .ag-sec.first{ margin-top:2px; }
.ops-scroll .ag-sec.next{ margin-top:18px; }
.ops-scroll .ag-sec .lab{ font-size:12px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:#334155; }
.ops-scroll .ag-sec .rng{ font-size:11.5px; font-weight:600; color:#64748b; }

.ops-scroll .ag-today-card{ background:#fff; border:1px solid #e2e8f0; border-radius:14px; padding:4px 12px 12px;
  box-shadow:0 1px 2px rgba(15,23,42,.06),0 8px 24px rgba(15,23,42,.08); border-top:3px solid #b8860b; }
.ops-scroll .ag-today-empty{ font-size:12.8px; color:#64748b; padding:14px 4px; line-height:1.5; }
.ops-scroll .ag-prio{ font-size:11px; font-weight:700; color:#64748b; margin:2px 2px 8px; line-height:1.4; }
.ops-scroll .ag-prio b{ color:#78350f; font-weight:800; }

/* VIGNETTE */
.ops-scroll .vg{ position:relative; display:flex; align-items:flex-start; gap:11px;
  /* [AGENDAPASTEL 2026-06-16] FOND PASTEL valide (meme recette que .ops-card / PLANNINGCOSSU 2026-06-13) :
     teinte douce derivee de --c (couleur canonique du module). Le liseré couleur gauche est CONSERVÉ. */
  background:linear-gradient(150deg, color-mix(in srgb,var(--c) 6%,#fff) 0%, color-mix(in srgb,var(--c) 16%,#fff) 100%);
  border:1px solid color-mix(in srgb,var(--c) 30%,#fff); border-left:5px solid var(--c); border-radius:14px; padding:12px 12px 12px 13px;
  margin-top:10px; box-shadow:0 1px 2px rgba(15,23,42,.06),0 8px 24px rgba(15,23,42,.08); cursor:pointer;
  transition:transform .12s ease,filter .12s ease,opacity .3s ease,max-height .3s ease; }
.ops-scroll .vg:active{ filter:brightness(.97); transform:scale(.995); }
.ops-scroll .vg-ic{ flex:0 0 auto; width:42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:color-mix(in srgb,var(--c) 14%,#fff); }
.ops-scroll .vg-ic svg{ width:22px; height:22px; stroke:var(--c); }
.ops-scroll .vg-tx{ flex:1; min-width:0; padding-right:22px; }
.ops-scroll .vg-ttl{ font-size:15.5px; font-weight:700; color:#0f172a; line-height:1.25; }
.ops-scroll .vg-ttl .n{ color:var(--c); font-weight:800; }
.ops-scroll .vg-ctx{ font-size:12.5px; font-weight:600; color:#334155; margin-top:3px; display:block; }
.ops-scroll .vg-when{ display:inline-block; margin-top:5px; font-size:11px; font-weight:700; color:#64748b;
  background:#f1f5f9; border:1px solid #e2e8f0; border-radius:999px; padding:2px 8px; }
.ops-scroll .vg-when.today{ background:#fdf6e3; color:#78350f; border-color:rgba(184,134,11,.4); }
.ops-scroll .vg-i{ position:absolute; top:9px; right:9px; width:24px; height:24px; border-radius:50%; border:1px solid #e2e8f0;
  background:#fff; color:var(--c); font-size:11px; font-weight:700; font-style:italic; font-family:Georgia,serif;
  display:flex; align-items:center; justify-content:center; cursor:pointer; }
.ops-scroll .vg.done{ opacity:.5; }
.ops-scroll .vg.done .vg-ttl{ text-decoration:line-through; text-decoration-color:#64748b; }
.ops-scroll .vg.done .vg-done-badge{ position:absolute; top:10px; right:40px; font-size:12px; font-weight:800; color:#16a34a; }
.ops-scroll .vg.gone{ opacity:0; max-height:0!important; margin:0; padding-top:0; padding-bottom:0; border-width:0; pointer-events:none; overflow:hidden; }

/* lignes-jours */
.ops-scroll .ag-day{ background:#fff; border:1px solid #e2e8f0; border-radius:14px; margin-bottom:10px;
  box-shadow:0 1px 2px rgba(15,23,42,.06),0 8px 24px rgba(15,23,42,.08); overflow:hidden; transition:opacity .2s ease; }
.ops-scroll .ag-day-head{ display:flex; align-items:center; gap:10px; padding:10px 12px; cursor:pointer; min-height:54px; }
.ops-scroll .ag-date{ flex:0 0 auto; width:46px; height:46px; border-radius:12px; background:#f1f5f9;
  display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1.05; }
.ops-scroll .ag-date .dw{ font-size:10px; font-weight:700; color:#64748b; text-transform:uppercase; }
.ops-scroll .ag-date .dn{ font-size:18px; font-weight:800; color:#0f172a; letter-spacing:-.5px; }
.ops-scroll .ag-date.today{ background:#fdf6e3; box-shadow:inset 0 0 0 2px #b8860b; }
.ops-scroll .ag-date.today .dw,.ops-scroll .ag-date.today .dn{ color:#78350f; }
.ops-scroll .ag-date .chk{ font-size:13px; color:#b8860b; font-weight:800; }
.ops-scroll .ag-chips{ flex:1; min-width:0; display:flex; gap:6px; overflow-x:auto; padding:2px 0; scrollbar-width:none; }
.ops-scroll .ag-chips::-webkit-scrollbar{ display:none; }
.ops-scroll .ag-chip{ flex:0 0 auto; display:flex; align-items:center; gap:6px; padding:6px 10px 6px 6px; border-radius:999px;
  background:#f1f5f9; border:1px solid #e2e8f0; font-size:12px; font-weight:700; color:#0f172a; }
.ops-scroll .ag-chip .dot{ width:9px; height:9px; border-radius:50%; flex:0 0 auto; }
.ops-scroll .ag-chip .n{ font-weight:800; }
.ops-scroll .ag-empty{ flex:1; height:3px; border-radius:2px; background:repeating-linear-gradient(90deg,#e2e8f0 0 8px,transparent 8px 14px); }
.ops-scroll .ag-caret{ flex:0 0 auto; color:#64748b; font-size:14px; font-weight:800; transition:transform .2s; }
.ops-scroll .ag-day.exp .ag-caret{ transform:rotate(90deg); }
.ops-scroll .ag-day-empty{ font-size:12.5px; color:#64748b; padding:12px 2px; }

/* JOUR PASSÉ grisé */
.ops-scroll .ag-day.past{ opacity:.62; background:#f8fafc; }
.ops-scroll .ag-day.past .ag-date{ background:#eef2f6; }
.ops-scroll .ag-day.past .ag-date .dw,.ops-scroll .ag-day.past .ag-date .dn{ color:#94a3b8; }
.ops-scroll .ag-day.past .ag-chip{ background:#eef2f6; color:#94a3b8; border-color:#e2e8f0; }
.ops-scroll .ag-day.past .ag-chip .dot{ filter:grayscale(.55); opacity:.7; }
.ops-scroll .ag-day.past .ag-caret{ color:#cbd5e1; }
.ops-scroll .ag-past-tag{ margin-left:auto; flex:0 0 auto; font-size:10px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:#94a3b8; }
.ops-scroll .ag-day.past .vg{ opacity:.7; }

.ops-scroll .ag-detail{ display:none; padding:2px 12px 12px; border-top:1px solid #e2e8f0; background:#fafbfc; }
.ops-scroll .ag-day.exp .ag-detail{ display:block; }
.ops-scroll .ag-day.past.exp .ag-detail{ background:#f4f7fa; }
/* fin AGENDA 2026-06-16 */

.ops-week .wd.today::after{ content:""; position:absolute; left:22%; right:22%; bottom:-1px;
  height:2.5px; border-radius:2px; background:linear-gradient(90deg,#d4a017,#b8860b); }

/* ---- consigne (accordéon standard de la maquette) ---- */
.ops-consigne{ background:var(--ops-card); border:1px solid var(--ops-line);
  border-left:3px solid #94a3b8; border-radius:14px; box-shadow:var(--ops-shadow);
  margin:14px 0 4px; overflow:hidden; }
.ops-consigne .cs-head{ display:flex; align-items:center; gap:9px; padding:12px 14px;
  cursor:pointer; user-select:none; -webkit-user-select:none; }
.ops-consigne .cs-head .chev{ flex:0 0 auto; color:var(--ops-slate-3); font-size:12px; line-height:1;
  transition:transform .28s cubic-bezier(.2,.8,.2,1); }
.ops-consigne.open .cs-head .chev{ transform:rotate(90deg); }
.ops-consigne .cs-head .lbl{ font-size:12px; font-weight:700; letter-spacing:.6px;
  text-transform:uppercase; color:var(--ops-slate); }
.ops-consigne .cs-body{ max-height:0; overflow:hidden; transition:max-height .38s ease; }
.ops-consigne.open .cs-body{ max-height:900px; }
.ops-consigne .cs-txt{ padding:1px 14px 13px; font-size:13px; line-height:1.62; color:var(--ops-slate-2); }
.ops-consigne .cs-txt p{ margin:0 0 10px; }
.ops-consigne .cs-txt p:last-child{ margin-bottom:0; }

/* ---- sections ---- */
.ops-sec{ display:flex; align-items:baseline; justify-content:space-between; margin:16px 4px 8px; }
.ops-sec h2{ font-size:13px; text-transform:uppercase; letter-spacing:.6px; color:var(--ops-slate-3); margin:0; }
.ops-sec span{ font-size:12px; color:var(--ops-slate-3); }

/* ---- tuile mission (fidèle maquette me-mission-card) ---- */
/* [PLANNINGCOSSU 2026-06-13] cartes de mission en FOND PASTEL de leur couleur de
   mission (cohérence menu<->planning : menupolish a posé des tuiles pastel famille
   dans le menu). Le dégradé est dérivé de --c (couleur canonique posée par
   tileHtml, ex. orange À revoir / rouge rue chaude / rose veille / violet flyers /
   vertpro SCI) via color-mix — déjà utilisé dans ce CSS (.ops-ico/.ops-badge), donc
   support garanti, et AUCUNE couleur réinventée. Mêmes opacités que menupolish
   (~.06 -> ~.16). STRUCTURE inchangée : seul le fond + la bordure changent. */
.ops-card{ position:relative;
  background:linear-gradient(150deg, color-mix(in srgb,var(--c) 6%,#fff) 0%, color-mix(in srgb,var(--c) 16%,#fff) 100%);
  border-radius:var(--ops-r);
  box-shadow:var(--ops-shadow); margin-bottom:14px; overflow:hidden;
  border:1px solid color-mix(in srgb,var(--c) 30%,#fff); }
.ops-card .stripe{ position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--c); }
.ops-card.reco{ outline:2px solid var(--c); outline-offset:0; }
.ops-top{ display:flex; gap:12px; padding:14px 14px 0 16px; }
/* [PLANNINGCOSSU 2026-06-13] le logo top-gauche : sur une carte désormais pastel,
   un médaillon pastel ne ressortait plus. On reprend EXACTEMENT le traitement de la
   pastille d'icône du menu (menupolish .op8-bicon : pastille PLEINE couleur canonique
   + icône BLANCHE) — cohérence menu<->planning maximale et contraste fort. */
.ops-ico{ width:46px; height:46px; border-radius:13px; flex:0 0 auto; display:grid; place-items:center;
  background:var(--c); color:#fff;
  box-shadow:0 2px 6px color-mix(in srgb,var(--c) 38%,transparent); }
.ops-ico svg{ width:24px; height:24px; }
.ops-head{ flex:1; min-width:0; }
.ops-badges{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:4px; }
.ops-badge{ font-size:10.5px; font-weight:700; letter-spacing:.3px; text-transform:uppercase;
  padding:3px 7px; border-radius:999px; background:color-mix(in srgb,var(--c) 12%,#fff); color:var(--c); }
.ops-badge.reco-b{ background:var(--c); color:#fff; }
.ops-badge.neutral{ background:#f1f5f9; color:var(--ops-slate-3); }
.ops-title{ font-size:16.5px; font-weight:700; letter-spacing:-.3px; line-height:1.2; margin:1px 0; }
.ops-sub{ font-size:12.5px; color:var(--ops-slate-3); line-height:1.4; margin-top:4px; }
.ops-sub.tappable{ cursor:pointer; }
.ops-sub.tappable::after{ content:" ⓘ"; color:var(--c); font-weight:700; }
.ops-stats{ display:flex; gap:10px; padding:12px 14px 0 16px; }
.ops-stat{ flex:1; background:#f8fafc; border:1px solid var(--ops-line); border-radius:12px; padding:8px 10px; }
.ops-stat .n{ font-size:18px; font-weight:800; letter-spacing:-.5px; color:var(--ops-slate); }
.ops-stat .l{ font-size:10.5px; color:var(--ops-slate-3); margin-top:1px; line-height:1.2; }
.ops-progress{ padding:12px 16px 0; }
.ops-progress .bar{ height:7px; border-radius:999px; background:#eef2f7; overflow:hidden; }
.ops-progress .bar i{ display:block; height:100%; width:var(--p,0%); background:var(--c);
  border-radius:999px; transition:width .35s; }
.ops-progress .lbl{ display:flex; justify-content:space-between; font-size:11px;
  color:var(--ops-slate-3); margin-top:5px; }
.ops-actions{ display:flex; gap:8px; padding:12px 14px 14px 16px; }
.ops-btn{ flex:1; min-height:46px; border:none; border-radius:12px; font-size:14.5px; font-weight:700;
  cursor:pointer; display:flex; align-items:center; justify-content:center; gap:6px; font-family:inherit; }
.ops-btn-go{ background:var(--c); color:#fff; }
.ops-btn-go:active{ filter:brightness(.93); }
.ops-btn-ghost{ background:#fff; border:1px solid var(--ops-line); color:var(--ops-slate-2); }

/* états du cycle de vie (mission_lifecycle_spec) */
.ops-card.done{ opacity:.62; }
.ops-card.done .ops-watermark{ position:absolute; inset:0; display:grid; place-items:center;
  pointer-events:none; z-index:2; }
.ops-card.done .ops-watermark span{ font-size:17px; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:color-mix(in srgb,var(--c) 55%,#64748b);
  border:2px solid currentColor; border-radius:10px; padding:6px 14px;
  transform:rotate(-12deg); background:rgba(255,255,255,.78); }
.ops-btn-again{ flex:0 0 auto; min-height:36px; padding:0 14px; border-radius:10px; font-size:12.5px;
  font-weight:700; border:1px solid var(--ops-line); background:#fff; color:var(--ops-slate-2);
  cursor:pointer; font-family:inherit; }
.ops-xbadge{ font-size:10.5px; font-weight:800; background:var(--c); color:#fff;
  border-radius:999px; padding:2px 7px; }
.ops-empty-pool{ font-size:12px; color:var(--ops-slate-3); padding:10px 16px 14px; line-height:1.45; }

/* ---- réflexe terrain ---- */
.ops-reflex{ background:linear-gradient(135deg,#0f172a,#1e293b); color:#e2e8f0;
  border-radius:var(--ops-r); padding:14px 16px; box-shadow:var(--ops-shadow); margin:6px 0 4px; }
.ops-reflex .k{ font-size:10.5px; text-transform:uppercase; letter-spacing:.6px; color:#94a3b8; font-weight:700; }
.ops-reflex .t{ font-size:13.5px; line-height:1.45; margin-top:5px; }

/* ---- notes honnêtes ---- */
.ops-note{ font-size:11px; color:var(--ops-slate-3); text-align:center; margin:12px 4px 4px; line-height:1.5; }
.ops-degraded{ font-size:11.5px; color:#b45309; background:#fff7ed; border:1px solid #fed7aa;
  border-radius:10px; padding:8px 11px; margin:10px 0 0; line-height:1.45; }

/* ---- écran vide honnête (scope fail-closed) ---- */
.ops-blank{ text-align:center; padding:60px 24px; }
.ops-blank .big{ font-size:17px; font-weight:700; margin-bottom:8px; }
.ops-blank p{ font-size:13px; color:var(--ops-slate-3); line-height:1.5; margin:0 0 18px; }
.ops-blank button{ min-height:46px; padding:0 18px; border:none; border-radius:12px;
  background:var(--ops-slate); color:#fff; font-weight:700; font-size:14px; cursor:pointer; font-family:inherit; }

/* ---- INC-5bis (2026-06-11) : mission Annonces SANS page intermédiaire ----
   L'écran « fournée » (.ops-ann-*) est SUPPRIMÉ : « Démarrer » ouvre l'Actualité.
   Bandeau SOBRE de mission injecté en tête d'Actualité — HORS #opsem-root,
   d'où les couleurs littérales (famille rose annonces, code couleur canonique). */
#opsem-actu-mission{ display:flex; align-items:center; gap:10px; margin:10px 12px 4px;
  padding:10px 12px; background:#fdf4ff; border:1px solid #f5d0fe; border-left:4px solid #d946ef;
  border-radius:12px; font-size:12.5px; line-height:1.45; color:#3f3f46;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
#opsem-actu-mission .oam-txt{ flex:1; min-width:0; }
#opsem-actu-mission .oam-txt b{ color:#a21caf; }
#opsem-actu-mission .oam-prog{ font-weight:800; color:#a21caf; white-space:nowrap; }
#opsem-actu-mission .oam-x{ flex:0 0 auto; border:none; background:none; color:#a1a1aa;
  font-size:14px; cursor:pointer; padding:4px 6px; line-height:1; font-family:inherit; }
#opsem-actu-mission.done{ background:#ecfdf5; border-color:#a7f3d0; border-left-color:#059669; }
#opsem-actu-mission.done .oam-txt b, #opsem-actu-mission.done .oam-prog{ color:#047857; }

.ops-toast{ position:absolute; left:50%; bottom:24px; transform:translateX(-50%); z-index:40;
  background:#111827; color:#fff; font-size:13px; font-weight:600; border-radius:9px;
  padding:10px 16px; max-width:88%; box-shadow:0 8px 24px rgba(0,0,0,.25); line-height:1.4; }
.ops-toast.warn{ background:#92400e; }

/* ---- loader ---- */
.ops-loading{ text-align:center; padding:48px 0; color:var(--ops-slate-3); font-size:13px; }
.ops-spin{ width:26px; height:26px; border:3px solid #e2e8f0; border-top-color:var(--ops-vert);
  border-radius:50%; margin:0 auto 12px; animation:ops-rot .8s linear infinite; }
@keyframes ops-rot{ to{ transform:rotate(360deg); } }

/* ---- scrim + bottom-sheet (pourquoi / stub) ---- */
.ops-scrim{ position:absolute; inset:0; background:rgba(15,23,42,.45); opacity:0;
  pointer-events:none; transition:.2s; z-index:30; }
.ops-scrim.on{ opacity:1; pointer-events:auto; }
.ops-sheet{ position:absolute; left:0; right:0; bottom:0; background:#fff;
  border-radius:22px 22px 0 0; padding:18px 18px 26px; transform:translateY(100%);
  transition:.26s cubic-bezier(.2,.8,.2,1); z-index:31; max-height:72%; overflow-y:auto; }
.ops-sheet.on{ transform:translateY(0); }
.ops-sheet .grab{ width:40px; height:4px; border-radius:2px; background:var(--ops-line); margin:0 auto 12px; }
.ops-sheet h3{ margin:0 0 8px; font-size:16px; }
.ops-sheet p{ margin:0 0 10px; font-size:13.5px; line-height:1.55; color:var(--ops-slate-2); white-space:pre-line; }
.ops-sheet .src{ font-size:11px; color:var(--ops-slate-3); background:#f8fafc; border:1px solid var(--ops-line);
  border-radius:9px; padding:7px 9px; margin-top:6px; word-break:break-all; line-height:1.45; }
.ops-sheet .close{ margin-top:16px; width:100%; min-height:46px; border:none; border-radius:12px;
  background:var(--ops-slate); color:#fff; font-weight:700; font-size:14px; font-family:inherit; cursor:pointer; }
.ops-sheet .go-existing{ margin-top:8px; width:100%; min-height:46px; border:1px solid var(--ops-line);
  border-radius:12px; background:#fff; color:var(--ops-slate-2); font-weight:700; font-size:14px;
  font-family:inherit; cursor:pointer; }

/* ============================================================================
   INC-4 — MISSION SIGNAUX QR (émeraude) — fidèle maquette planning_v5 s-qr
   ============================================================================ */
.ops-mission{ position:absolute; inset:0; z-index:20; background:var(--ops-bg);
  display:flex; flex-direction:column; min-height:0; }
.ops-mission[hidden]{ display:none; }
.ops-mission .ops-mbar{ border-bottom:3px solid var(--ops-emeraude); }
.ops-mission .ops-scroll{ padding:0 16px 90px; }
.ops-whybtn{ flex:0 0 auto; height:40px; padding:0 12px; border:none; background:#f1f5f9;
  border-radius:11px; font-size:12.5px; font-weight:700; color:var(--ops-emeraude);
  cursor:pointer; font-family:inherit; }

/* section (titre + pourquoi + badge heat) */
.ops-qrsec{ display:flex; align-items:flex-start; gap:10px; margin:18px 4px 9px; }
.ops-qrsec .qs-main{ flex:1; min-width:0; }
.ops-qrsec h2{ font-size:13.5px; text-transform:uppercase; letter-spacing:.5px;
  color:var(--ops-slate-2); margin:0; }
.ops-qrsec .qs-why{ font-size:11.5px; color:var(--ops-slate-3); margin-top:3px;
  line-height:1.35; cursor:pointer; }
.ops-qrsec .qs-why::after{ content:" ⓘ"; color:var(--ops-emeraude); font-weight:700; }
.ops-heat{ flex:0 0 auto; font-size:11px; font-weight:800; letter-spacing:.3px;
  border-radius:999px; padding:4px 9px; text-transform:uppercase; }
.ops-heat.hot{ background:#fee2e2; color:#b91c1c; }
.ops-heat.warm{ background:#ffedd5; color:#c2410c; }
.ops-heat.cold{ background:#f1f5f9; color:var(--ops-slate-3); }

/* carte signal */
.ops-qrcard{ background:var(--ops-card); border:1px solid var(--ops-line); border-radius:15px;
  box-shadow:var(--ops-shadow); padding:13px 14px; margin-bottom:12px; }
.ops-qrcard.treated{ opacity:.62; }
.ops-qrcard .qtop{ display:flex; gap:10px; align-items:flex-start; }
.ops-qprov{ width:34px; height:34px; border-radius:9px; flex:0 0 auto; display:grid;
  place-items:center; font-weight:800; font-size:15px; font-style:normal; }
.ops-qprov.est{ background:color-mix(in srgb,var(--ops-emeraude) 14%,#fff); color:var(--ops-emeraude); }
.ops-qprov.info{ background:#eef2ff; color:#4338ca; }
.ops-qprov.unk{ background:#f1f5f9; color:var(--ops-slate-3); }
.ops-qrcard .qm{ flex:1; min-width:0; }
.ops-qrcard .qa{ font-size:14.5px; font-weight:700; letter-spacing:-.2px; line-height:1.25; }
.ops-qrcard .qc{ font-size:11.5px; color:var(--ops-slate-3); margin-top:2px; }
.ops-qrcard .qsig{ font-size:13px; font-weight:700; color:var(--ops-slate-2); margin-top:9px; }
.ops-qrcard .qsig .when{ font-weight:500; color:var(--ops-slate-3); }
.ops-qrcard .qtrail{ margin-top:8px; border-left:2px solid var(--ops-line); padding-left:10px; }
.ops-qrcard .qtrail div{ font-size:11.5px; color:var(--ops-slate-3); line-height:1.5; }
.ops-qrcard .qsugg{ font-size:12.5px; color:var(--ops-slate-2); background:#f8fafc;
  border-radius:10px; padding:9px 11px; margin-top:10px; line-height:1.45; }
.ops-qrcard .qacts{ display:flex; gap:8px; margin-top:11px; }
.ops-qrcard .qacts button{ flex:1; min-height:44px; border:1px solid var(--ops-line);
  border-radius:11px; background:#fff; color:var(--ops-slate-2); font-size:13px;
  font-weight:700; cursor:pointer; font-family:inherit; }
/* [REVISITE 2026-06-13] Module Signaux = famille VIOLET QR/flyers #7c3aed
   (décision Nicolas 13-06 : les signaux sont les retours des QR/flyers → même
   famille violette que la tuile parente ; cf. menufix2 menu-v8.css P2 + code_couleur.md).
   Boutons d'action primaires + confirmation passent d'émeraude à violet. */
.ops-qrcard .qacts button.pri{ background:var(--ops-violet); border-color:var(--ops-violet); color:#fff; }
.ops-qrcard .qacts button.ghost{ flex:0 0 auto; padding:0 12px; font-size:12px; }
.ops-qrcard .qacts button.off{ opacity:.45; } /* grisé-débloquable : tap = explication */
.ops-qrcard .qnote{ font-size:11px; color:var(--ops-slate-3); margin-top:7px; line-height:1.4; }
.ops-qrcard .qdone{ font-size:12.5px; font-weight:700; color:var(--ops-violet);
  background:color-mix(in srgb,var(--ops-violet) 9%,#fff); border-radius:10px;
  padding:9px 11px; margin-top:10px; line-height:1.4; }

/* froid : compteur par rue */
.ops-qrcold{ background:#f8fafc; border:1px dashed var(--ops-line); border-radius:14px;
  padding:13px; display:flex; gap:12px; align-items:flex-start; font-size:12.5px;
  color:var(--ops-slate-2); line-height:1.5; }
.ops-qrcold .n{ font-size:21px; font-weight:800; color:var(--ops-slate-2);
  letter-spacing:-.5px; flex:0 0 auto; }
.ops-qrcold .why-i{ color:var(--ops-emeraude); font-weight:800; cursor:pointer; }

/* lien cloisonnement boîtage -> signaux */
.ops-qrxlink{ display:flex; gap:8px; align-items:flex-start; font-size:12px;
  color:var(--ops-slate-3); margin:14px 4px 0; line-height:1.45; }
.ops-qrxlink .arr{ color:var(--ops-emeraude); font-weight:800; }

/* bottom-sheet appel / SMS (sections maquette script-sheet) */
.ops-sh-section{ margin-bottom:14px; }
.ops-sh-label{ font-size:11px; font-weight:700; color:var(--ops-emeraude);
  text-transform:uppercase; letter-spacing:.4px; margin-bottom:4px; }
.ops-sh-text{ font-size:14px; line-height:1.5; color:var(--ops-slate-2); background:#f8fafc;
  border-radius:10px; padding:10px 12px; user-select:text; -webkit-user-select:text; }
.ops-sh-cta{ display:flex; align-items:center; justify-content:center; width:100%;
  min-height:50px; border:none; border-radius:13px; background:var(--ops-emeraude);
  color:#fff; font-size:15px; font-weight:800; text-decoration:none; font-family:inherit; }
.ops-sh-copy{ display:block; width:100%; text-align:center; margin-top:10px; background:none;
  border:none; color:var(--ops-slate-3); font-size:12.5px; font-weight:700;
  text-decoration:underline; cursor:pointer; font-family:inherit; }
.ops-sh-note{ font-size:11px; color:var(--ops-slate-3); margin-top:9px; text-align:center; line-height:1.4; }

/* toast (avec annuler) — namespace fusion : .ops-qr-toast (INC-4), n'écrase pas le toast INC-5 */
.ops-toast.ops-qr-toast{ position:absolute; left:14px; right:14px; bottom:18px; z-index:40;
  background:var(--ops-slate); color:#e2e8f0; border-radius:13px; padding:12px 14px;
  font-size:12.5px; line-height:1.45; box-shadow:0 10px 30px rgba(0,0,0,.35);
  display:flex; align-items:center; gap:10px; opacity:0; transform:translateY(8px);
  transition:.22s; }
.ops-toast.ops-qr-toast.on{ opacity:1; transform:translateY(0); }
.ops-toast.ops-qr-toast button{ flex:0 0 auto; margin-left:auto; background:none; border:none;
  color:#7dd3fc; font-weight:800; font-size:12.5px; cursor:pointer; font-family:inherit;
  text-decoration:underline; }

/* écran vide / retry de la mission */
.ops-mission .ops-blank button{ min-height:46px; padding:0 18px; border:none;
  border-radius:12px; background:var(--ops-emeraude); color:#fff; font-weight:700;
  font-size:14px; cursor:pointer; font-family:inherit; }

/* ============================================================================
   INC-6 — MISSION RELANCES (orange) — fidèle maquette planning_v5 volet
   relances v5.6 (tel-miss grisé-débloquable, issue grid, itinéraire réel).
   Tout namespacé .ops-rel / .rel- / #opsem-rel : zéro collision.
   ============================================================================ */
#opsem-rel .ops-mbar{ border-bottom-color:var(--ops-orange); }
.ops-whybtn.rel{ color:var(--ops-orange); }
.ops-rel .ops-qrsec .qs-why::after{ content:""; } /* pas de ⓘ sur les sous-titres de groupe */
#opsem-rel .ops-blank button{ background:var(--ops-orange); }

/* progression hebdo (écritures réelles) */
.rel-week{ background:var(--ops-card); border:1px solid var(--ops-line); border-radius:14px;
  padding:11px 13px; margin:14px 0 4px; box-shadow:var(--ops-shadow); }
.rel-week .bar{ height:7px; border-radius:999px; background:#eef2f7; overflow:hidden; }
.rel-week .bar i{ display:block; height:100%; width:var(--p,0%); background:var(--ops-orange);
  border-radius:999px; transition:width .35s; }
.rel-week .lbl{ display:flex; justify-content:space-between; font-size:11.5px;
  color:var(--ops-slate-3); margin-top:6px; }

/* carte bien à relancer */
.ops-relcard{ background:var(--ops-card); border:1px solid var(--ops-line); border-radius:15px;
  box-shadow:var(--ops-shadow); padding:13px 14px; margin-bottom:12px; }
.ops-relcard.handled{ opacity:.62; }
.ops-relcard .ra{ font-size:14.5px; font-weight:700; letter-spacing:-.2px; line-height:1.25; }
.ops-relcard .ra .approx{ font-size:11px; font-weight:600; color:var(--ops-slate-3); }
.ops-relcard .rc{ font-size:11.5px; color:var(--ops-slate-3); margin-top:2px; }
.ops-relcard .rwhy{ font-size:12.5px; font-weight:600; color:var(--ops-slate-2); margin-top:8px; }
.ops-relcard .rwhy .late{ color:#b91c1c; }
.ops-relcard .rnote{ font-size:12px; color:var(--ops-slate-3); margin-top:5px; font-style:italic; line-height:1.45; }
.ops-relcard .racts{ display:flex; gap:8px; margin-top:11px; }
.ops-relcard .racts button{ flex:1; min-height:44px; border:1px solid var(--ops-line); border-radius:11px;
  background:#fff; color:var(--ops-slate-2); font-size:13px; font-weight:700; cursor:pointer; font-family:inherit; }
.ops-relcard .racts button.pri{ background:var(--ops-orange); border-color:var(--ops-orange); color:#fff; }
.ops-relcard .racts button[disabled]{ opacity:.55; cursor:default; }
.ops-relcard .racts button.ghost{ flex:0 0 auto; padding:0 12px; font-size:12px; }
.ops-relcard .rfoot{ display:flex; gap:8px; margin-top:8px; }
.ops-relcard .rfoot button{ flex:1; min-height:38px; border:none; border-radius:10px; background:#f8fafc;
  color:var(--ops-slate-3); font-size:12px; font-weight:600; cursor:pointer; font-family:inherit; }
.ops-relcard .rdone{ font-size:12.5px; font-weight:700; color:#b45309;
  background:#fff7ed; border-radius:10px; padding:9px 11px; margin-top:10px; line-height:1.4; }
.ops-relcard .rdone.ok{ color:#047857; background:#ecfdf5; }

/* téléphone manquant — grisé-débloquable (R7-bis), nudge + unlock maquette v5.6 */
.rel-telmiss{ margin-top:10px; background:#f8fafc; border:1px dashed var(--ops-line);
  border-radius:11px; padding:9px 11px; }
.rel-telmiss .tm-row{ display:flex; gap:8px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.rel-telmiss .tm-txt{ font-size:12px; color:var(--ops-slate-3); }
.rel-telmiss .tm-add{ border:1px solid var(--ops-orange); background:#fff; color:var(--ops-orange);
  border-radius:9px; min-height:34px; padding:0 11px; font-size:12px; font-weight:700;
  cursor:pointer; font-family:inherit; }
.rel-telmiss .tm-form{ display:flex; gap:7px; margin-top:8px; }
.rel-telmiss .tm-form input{ flex:1; min-width:0; min-height:40px; border:1px solid var(--ops-line);
  border-radius:9px; padding:0 11px; font-size:14px; font-family:inherit; }
.rel-telmiss .tm-form button{ flex:0 0 auto; width:44px; min-height:40px; border:none; border-radius:9px;
  background:var(--ops-orange); color:#fff; font-size:15px; font-weight:800; cursor:pointer; font-family:inherit; }
@keyframes rel-nudge{ 0%,100%{ transform:translateX(0); } 25%{ transform:translateX(-4px); } 75%{ transform:translateX(4px); } }
.rel-telmiss.nudge{ animation:rel-nudge .3s 2; border-color:var(--ops-orange); }
@keyframes rel-unlock{ 0%{ box-shadow:0 0 0 0 rgba(245,158,11,.45); } 100%{ box-shadow:0 0 0 14px rgba(245,158,11,0); } }
.ops-relcard.unlocked{ animation:rel-unlock .9s ease-out 1; border-color:var(--ops-orange); }

/* [CAL-3 2026-06-12] mémo capture terrain « Il vous avait dit : … » (passages[] réels) */
.ops-relcard .rel-memo{ margin-top:7px; background:#fff7ed; border-left:3px solid var(--ops-orange);
  border-radius:0 9px 9px 0; padding:7px 10px; font-size:12.5px; color:#9a3412; line-height:1.45; }

/* [CAL-3 2026-06-12] étape + tronçon réel de la tournée optimisée */
.ops-relcard .rel-leg{ margin-top:7px; font-size:12px; font-weight:700; color:var(--ops-slate-2); }
.ops-relcard .rel-leg .approx{ color:#b45309; font-weight:700; font-size:11px; }

/* [CAL-3 2026-06-12] bandeau trajet de la tournée « à visiter » (1 appel groupé) */
.rel-tournee{ margin:0 0 11px; background:#f8fafc; border:1px solid var(--ops-line);
  border-radius:10px; padding:9px 11px; font-size:12.5px; font-weight:700; color:var(--ops-slate-2);
  line-height:1.5; }
.rel-tournee .approx{ color:#b45309; font-weight:700; font-size:11px; }

/* itinéraire réel (/api/route) — honnête : « approximatif » si fallback */
.rel-route{ margin-top:9px; background:#f8fafc; border:1px solid var(--ops-line); border-radius:10px;
  padding:9px 11px; font-size:12.5px; color:var(--ops-slate-2); line-height:1.5; }
.rel-route .modes{ font-size:13.5px; font-weight:700; color:var(--ops-slate); }
.rel-route .approx{ color:#b45309; font-weight:700; font-size:11px; }
.rel-route .lvl{ font-size:11px; color:var(--ops-slate-3); margin-top:3px; }
.rel-route.err{ color:#b45309; background:#fff7ed; border-color:#fed7aa; }

/* groupe vide honnête + débrief sobre */
.rel-empty{ font-size:12px; color:var(--ops-slate-3); background:#f8fafc; border:1px dashed var(--ops-line);
  border-radius:11px; padding:10px 12px; line-height:1.45; margin-bottom:12px; }
.rel-debrief{ background:linear-gradient(135deg,#fff7ed,#ffedd5); border:1px solid #fed7aa;
  border-radius:var(--ops-r); padding:14px 16px; margin:14px 0 4px; font-size:13px; line-height:1.55;
  color:var(--ops-slate-2); box-shadow:var(--ops-shadow); }
.rel-debrief button{ margin-top:10px; min-height:42px; width:100%; border:none; border-radius:11px;
  background:var(--ops-orange); color:#fff; font-weight:700; font-size:13.5px; cursor:pointer; font-family:inherit; }

/* sheet appel/SMS/issues — variante orange (partage .ops-sh-* d'INC-4) */
.ops-sh-label.rel{ color:var(--ops-orange); }
.ops-sh-cta.rel{ background:var(--ops-orange); }
.rel-issue-grid{ display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:6px; }
.rel-issue-grid button{ min-height:52px; border:1px solid var(--ops-line); border-radius:12px; background:#f8fafc;
  color:var(--ops-slate-2); font-size:13px; font-weight:700; cursor:pointer; font-family:inherit;
  line-height:1.3; padding:6px 8px; }
.rel-issue-grid button.main{ background:#fff7ed; border-color:var(--ops-orange); color:#b45309; }

/* ===========================================================================
   [REVOIR-SIMPLE 2026-06-11] version SIMPLE validée Nicolas du volet « À revoir » :
   une liste de cartes, 3 boutons (Appeler / SMS / Y aller), Appeler+SMS GRISÉS
   sans numéro (.locked), ⓘ pour la moindre explication, carte traitée grisée
   (.handled, déjà géré ci-dessus). Tout est namespacé, additif.
   =========================================================================== */
/* Appeler / SMS grisés tant qu'il n'y a pas de numéro (jamais cachés, jamais d'action) */
.ops-relcard .racts button.locked{
  background:#f1f5f9; border-color:var(--ops-line); color:#9aa6b4;
  cursor:default; box-shadow:none;
}
.ops-relcard .racts button.pri.locked{ background:#f1f5f9; color:#9aa6b4; }
/* la 3e action « Y aller » reste pleine — pas de classe ghost rétrécie en simple */
.ops-relcard .rfoot button{ flex:1; }
/* petits ⓘ : l'explication est DERRIÈRE, jamais posée dans l'écran */
.rel-week-info, .rel-src-info, .rel-telmiss .tm-info{
  background:transparent; border:none; color:var(--ops-slate-3);
  font-size:12px; cursor:pointer; padding:0 2px; font-family:inherit; line-height:1;
}
.rel-telmiss .tm-info{ font-size:14px; }
.rel-srcline{ margin-top:14px; text-align:center; }
.rel-srcline .rel-src-info{ font-size:11px; color:var(--ops-slate-3); }

/* ============================================================================
   INC-9 — MISSION RUE CHAUDE (rouge) + INC-10 — MISSION BOÎTAGE (violet)
   Fidèles à la maquette planning_v5 (volet s-rue + flux flyers v2).
   Tout reste namespacé #opsem-root / opsem-* : zéro collision app.
   ============================================================================ */

/* panneaux mission : liseré couleur de mission */
.ops-mission.ops-rue-p .ops-mbar{ border-bottom:3px solid var(--ops-rouge); }
.ops-mission.ops-bt-p .ops-mbar{ border-bottom:3px solid var(--ops-violet); }
.ops-whybtn.rue{ color:var(--ops-rouge); }
.ops-whybtn.bt{ color:var(--ops-violet); display:flex; align-items:center; gap:6px; }

/* footbar de panneau mission (patron .footbar maquette) */
.ops-mission .ops-foot{ flex:0 0 auto; background:var(--ops-card); border-top:1px solid var(--ops-line);
  padding:10px 14px calc(12px + env(safe-area-inset-bottom, 0px)); }
.ops-mission .ops-foot[hidden]{ display:none; }
.ops-mission .ops-foot .fcount{ font-size:12px; color:var(--ops-slate-3); margin-bottom:8px; }
.ops-mission .ops-foot .fcount b{ color:var(--ops-slate); }
.ops-mission .ops-foot .frow{ display:flex; gap:9px; }
.ops-mission .ops-foot .ops-btn[disabled]{ opacity:.45; cursor:default; }

/* ---- INC-9 : chips communes ---- */
.ops-cm-chips{ display:flex; gap:8px; flex-wrap:wrap; margin:2px 2px 4px; }
.ops-cm-chips button{ min-height:38px; padding:0 14px; border-radius:999px; border:1.5px solid var(--ops-line);
  background:#fff; font-size:13px; font-weight:700; color:var(--ops-slate-2); cursor:pointer; font-family:inherit; }
.ops-cm-chips button.on{ border-color:var(--ops-rouge); background:color-mix(in srgb,var(--ops-rouge) 8%,#fff); color:var(--ops-rouge); }

/* ---- INC-9 : carte de rue (sélecteur) ---- */
.ops-street-card{ display:flex; gap:11px; align-items:flex-start; background:var(--ops-card);
  border:1px solid var(--ops-line); border-radius:15px; box-shadow:var(--ops-shadow);
  padding:12px 12px 12px 14px; margin-bottom:10px; }
.ops-street-card.off{ opacity:.62; }
.ops-street-card .cb, .ops-bt-st .cb{ width:26px; height:26px; border-radius:8px; border:2px solid #cbd5e1;
  background:#fff; flex:0 0 auto; display:grid; place-items:center; cursor:pointer; color:#fff; margin-top:2px; }
.ops-street-card .cb svg, .ops-bt-st .cb svg{ width:15px; height:15px; visibility:hidden; }
.ops-street-card .cb.on{ background:var(--ops-rouge); border-color:var(--ops-rouge); }
.ops-street-card .cb.on svg{ visibility:visible; }
.ops-street-card .sc-main{ flex:1; min-width:0; cursor:pointer; }
.ops-street-card .sc-name{ font-size:14.5px; font-weight:700; letter-spacing:-.2px; }
.ops-street-card .sc-name .cm, .ops-bt-st .bt-st-name .cm{ font-size:11px; font-weight:600; color:var(--ops-slate-3); }
.ops-street-card .sc-meta{ font-size:12px; color:var(--ops-slate-2); margin-top:3px; }
.ops-street-card .sc-sig{ font-size:11px; color:var(--ops-rouge); font-weight:600; margin-top:3px; }
.ops-street-card .st-see, .ops-st-item .st-see, .ops-bt-st .st-see{ width:38px; height:38px; flex:0 0 auto;
  border:1px solid var(--ops-line); border-radius:10px; background:#f8fafc; font-size:15px; cursor:pointer; }

/* ---- module « + Ajouter une rue » (patron add-mod maquette) ---- */
.ops-add{ background:var(--ops-card); border:1.5px dashed #cbd5e1; border-radius:14px; margin:4px 0 10px; overflow:hidden; }
.ops-add .add-trig{ display:flex; align-items:center; gap:9px; padding:12px 14px; cursor:pointer;
  font-size:13px; font-weight:700; color:var(--ops-slate-2); user-select:none; -webkit-user-select:none; }
.ops-add .add-trig .plus{ width:22px; height:22px; border-radius:7px; background:#f1f5f9; display:grid;
  place-items:center; font-weight:800; color:var(--ops-slate-3); }
.ops-add .add-body{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.ops-add.open .add-body{ max-height:600px; }
.ops-sug{ display:flex; align-items:center; gap:10px; padding:9px 14px; border-top:1px solid var(--ops-line); }
.ops-sug .sm{ flex:1; min-width:0; }
.ops-sug .a{ font-size:13px; font-weight:700; }
.ops-sug .p{ font-size:11px; color:var(--ops-slate-3); margin-top:1px; }
.ops-sug .sadd{ flex:0 0 auto; min-height:34px; padding:0 12px; border-radius:9px; border:1px solid var(--ops-line);
  background:#fff; font-size:12px; font-weight:700; color:var(--ops-slate-2); cursor:pointer; font-family:inherit; }
/* [FLYER3 2026-06-12] (H) recherche libre d'une rue (module + Ajouter du boîtage) */
.ops-add .add-search{ padding:2px 14px 8px; }
.ops-add .add-search input{ width:100%; min-height:42px; padding:0 12px; border:1.5px solid var(--ops-line);
  border-radius:11px; background:#fff; font-size:14px; font-family:inherit; color:var(--ops-slate);
  outline:none; }
.ops-add .add-search input:focus{ border-color:var(--ops-violet); }
.ops-sug .a .cm{ font-size:11px; font-weight:600; color:var(--ops-slate-3); }

/* ---- INC-9 : liste des biens ---- */
.ops-pick-hint{ display:flex; gap:8px; align-items:flex-start; font-size:11.5px; color:var(--ops-slate-3);
  margin:12px 4px 10px; line-height:1.5; }
.ops-pick-hint .b{ width:8px; height:8px; border-radius:50%; background:var(--ops-rouge); flex:0 0 auto; margin-top:4px; }
.ops-rue-grp{ display:flex; justify-content:space-between; align-items:baseline; margin:16px 4px 8px;
  font-size:13px; font-weight:800; letter-spacing:-.2px; }
.ops-rue-grp .gx{ font-size:11.5px; font-weight:700; color:var(--ops-slate-3); }
.ops-st-item{ background:var(--ops-card); border:1px solid var(--ops-line); border-radius:14px;
  box-shadow:var(--ops-shadow); padding:11px 12px; margin-bottom:10px; }
.ops-st-item.done{ opacity:.66; }
.ops-st-item .st-row{ display:flex; gap:10px; align-items:flex-start; }
.ops-st-item .st-main{ flex:1; min-width:0; cursor:pointer; }
.ops-st-item .st-addr{ font-size:14px; font-weight:700; letter-spacing:-.2px; }
.ops-st-item .st-addr .chk, .ops-bt-st .bt-st-name .chk{ color:#16a34a; margin-right:4px; }
.ops-st-item .st-city{ font-size:11.5px; color:var(--ops-slate-3); margin-top:1px; }
.ops-st-item .st-why{ font-size:11px; color:var(--ops-rouge); font-weight:600; margin-top:3px; }
.ops-st-item .st-acts{ display:flex; gap:7px; margin-top:10px; flex-wrap:wrap; }
.ops-st-item .st-acts button{ flex:1; min-height:42px; border:1px solid var(--ops-line); border-radius:11px;
  background:#f8fafc; color:var(--ops-slate-2); font-size:12.5px; font-weight:700; cursor:pointer;
  font-family:inherit; min-width:30%; }
.ops-st-item .st-acts button[disabled]{ opacity:.5; cursor:default; }
.ops-st-item .st-acts .fiche-b{ flex:0 0 auto; min-width:0; padding:0 12px; background:#fff; }
.ops-st-item .st-done-line{ font-size:12px; font-weight:700; color:#047857; background:#ecfdf5;
  border:1px solid #a7f3d0; border-radius:10px; padding:8px 10px; margin-top:9px; }

/* ---- débrief sobre (rue + boîtage) ---- */
.ops-rue-debrief{ background:var(--ops-card); border:1px solid var(--ops-line); border-radius:var(--ops-r);
  box-shadow:var(--ops-shadow); text-align:center; padding:22px 18px; margin:16px 0 6px; }
.ops-rue-debrief .check{ width:46px; height:46px; border-radius:50%; background:var(--ops-rouge); color:#fff;
  display:grid; place-items:center; font-size:22px; font-weight:800; margin:0 auto 10px; }
.ops-rue-debrief h2{ margin:0 0 8px; font-size:18px; letter-spacing:-.3px; }
.ops-rue-debrief .recap-line{ font-size:13px; color:var(--ops-slate-2); line-height:1.6; }
.ops-rue-debrief .coach{ font-size:12.5px; color:var(--ops-slate-3); font-style:italic; margin-top:10px; line-height:1.5; }
.ops-rue-debrief .db-go{ margin-top:14px; width:100%; min-height:46px; border:none; border-radius:12px;
  background:var(--ops-rouge); color:#fff; font-weight:700; font-size:14px; cursor:pointer; font-family:inherit; }
.ops-rue-debrief .bt-db-logo{ margin:4px 0 8px; }

/* ---- INC-10 : écran 1 — LA question, logos officiels en GRAND ---- */
.ops-bd2-intro{ margin:20px 6px 16px; }
.ops-bd2-intro h2{ margin:0 0 6px; font-size:21px; letter-spacing:-.4px; line-height:1.2; }
.ops-bd2-intro p{ margin:0; font-size:13px; color:var(--ops-slate-3); line-height:1.5; }
.ops-bd2-card{ position:relative; background:var(--ops-card); border:1.5px solid var(--ops-line);
  border-radius:18px; box-shadow:var(--ops-shadow); padding:18px 16px 16px; margin-bottom:14px;
  text-align:center; cursor:pointer; }
.ops-bd2-card:active{ border-color:var(--ops-violet); }
.ops-qrlogo{ width:112px; height:112px; display:block; margin:0 auto; } /* >= 96 px exigés — logo OFFICIEL tel quel */
.ops-bd2-card .t{ font-size:15.5px; font-weight:800; letter-spacing:-.2px; margin-top:10px; }
.ops-bd2-card .q{ font-size:12.5px; color:var(--ops-slate-3); margin-top:3px; line-height:1.4; }
.ops-bd2-card .m{ font-size:11.5px; color:#6d28d9; font-weight:600; margin-top:8px; }
.ops-bd2-card .m.none{ color:var(--ops-slate-3); font-weight:500; font-style:italic; }
.ops-bd2-card .i-btn{ position:absolute; top:10px; right:10px; width:26px; height:26px; border-radius:50%;
  border:1px solid var(--ops-line); background:#fff; color:var(--ops-slate-3); font-size:13px;
  font-weight:800; cursor:pointer; font-family:inherit; }
/* [BT-LOOP 2026-06-12] ⓘ à étages : inline (titre écran d'entrée + sous-titre liste) */
.ops-bd2-intro .i-btn.intro{ display:inline-grid; place-items:center; width:24px; height:24px;
  border-radius:50%; border:1px solid var(--ops-line); background:#fff; color:var(--ops-slate-3);
  font-size:12px; font-weight:800; cursor:pointer; font-family:inherit; vertical-align:3px; margin-left:8px; }
.ops-mbar .s .i-btn.sub{ display:inline-grid; place-items:center; width:18px; height:18px;
  border-radius:50%; border:1px solid var(--ops-line); background:#fff; color:var(--ops-slate-3);
  font-size:10.5px; font-weight:800; cursor:pointer; font-family:inherit; vertical-align:-4px; margin-left:3px; }
/* [FLYER3 2026-06-12] (A) carte de reprise LIMPIDE : rue + restantes + Reprendre.
   Toute la carte est tappable (data-ops-bt-resume sur le conteneur). */
.ops-bt-resume{ display:flex; align-items:center; gap:11px; background:color-mix(in srgb,var(--ops-violet) 8%,#fff);
  border:1.5px solid color-mix(in srgb,var(--ops-violet) 35%,#fff); border-radius:14px; padding:12px 13px;
  margin:14px 0 0; font-size:12.5px; color:var(--ops-slate-2); line-height:1.4; cursor:pointer; }
.ops-bt-resume .ops-qrpin.rs{ width:30px; height:30px; flex:0 0 auto; vertical-align:0; }
.ops-bt-resume .rs-tx{ flex:1; min-width:0; }
.ops-bt-resume .rs-t{ font-size:13px; font-weight:800; color:var(--ops-slate); letter-spacing:-.2px; }
.ops-bt-resume .rs-s{ font-size:12px; color:var(--ops-slate-2); margin-top:2px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ops-bt-resume button{ flex:0 0 auto; margin-left:auto; min-height:40px; padding:0 14px; border:none;
  border-radius:10px; background:var(--ops-violet); color:#fff; font-size:12.5px; font-weight:800;
  cursor:pointer; font-family:inherit; }

/* ---- INC-10 : liste des rues ---- */
.ops-bt-st{ background:var(--ops-card); border:1px solid var(--ops-line); border-radius:14px;
  box-shadow:var(--ops-shadow); padding:11px 12px; margin-bottom:10px; }
.ops-bt-st.recent{ opacity:.6; background:#f8fafc; }
.ops-bt-st.done{ opacity:.66; }
.ops-bt-st .bt-st-row{ display:flex; gap:11px; align-items:flex-start; }
.ops-bt-st .cb.on{ background:var(--ops-violet); border-color:var(--ops-violet); }
.ops-bt-st .cb.on svg{ visibility:visible; }
.ops-bt-st .cb.dis{ background:#f1f5f9; border-color:#e2e8f0; cursor:not-allowed; }
.ops-bt-st .bt-st-main{ flex:1; min-width:0; cursor:pointer; }
.ops-bt-st .bt-st-name{ font-size:14.5px; font-weight:700; letter-spacing:-.2px; }
.ops-bt-st .bt-st-meta{ font-size:12px; color:var(--ops-slate-2); margin-top:3px; }
.ops-bt-sep{ font-size:11.5px; color:var(--ops-slate-3); margin:14px 4px 8px; font-style:italic; }
/* [BT-LOOP 2026-06-12] rangées TOURNÉE : rue à faire (flèche violette tappable)
   vs rue faite (grisée + état « X flyers sur Y boîtes » lisible) */
.ops-bt-sep.tour{ font-style:normal; font-weight:800; color:var(--ops-slate-2); }
.ops-bt-st.tour .cb.go{ display:grid; place-items:center; font-size:15px; font-weight:800;
  background:color-mix(in srgb,var(--ops-violet) 10%,#fff); border-color:var(--ops-violet);
  color:var(--ops-violet); cursor:pointer; }
.ops-bt-st.tour .cb.tdone{ display:grid; place-items:center; font-size:14px; font-weight:800;
  background:#f1f5f9; border-color:#e2e8f0; color:#16a34a; cursor:default; }
.ops-bt-st.tour.done .bt-st-meta{ color:#16a34a; font-weight:700; }
.ops-bt-st.tour:not(.done){ border-color:color-mix(in srgb,var(--ops-violet) 35%,#fff); }

/* ---- INC-10 : itinéraire (mode pick + lignes + recap) ---- */
.ops-mode-pick{ display:flex; gap:8px; margin:14px 0 6px; }
.ops-mode-pick button{ flex:1; background:var(--ops-card); border:1.5px solid var(--ops-line); border-radius:13px;
  padding:10px 6px; display:flex; flex-direction:column; align-items:center; gap:2px; cursor:pointer; font-family:inherit; }
.ops-mode-pick button.on{ border-color:var(--ops-violet); background:color-mix(in srgb,var(--ops-violet) 7%,#fff); }
.ops-mode-pick .ic{ font-size:17px; }
.ops-mode-pick .nm{ font-size:11.5px; font-weight:700; color:var(--ops-slate-2); }
.ops-mode-pick .tm{ font-size:11px; font-weight:800; color:var(--ops-violet); }
.ops-route-hint{ font-size:11.5px; color:var(--ops-slate-3); margin:8px 4px; line-height:1.45; }
.ops-route-row{ display:flex; align-items:center; gap:10px; background:var(--ops-card);
  border:1px solid var(--ops-line); border-radius:13px; box-shadow:var(--ops-shadow);
  padding:10px 12px; margin-bottom:8px; }
.ops-route-row .n{ width:26px; height:26px; border-radius:50%; background:var(--ops-violet); color:#fff;
  display:grid; place-items:center; font-size:12.5px; font-weight:800; flex:0 0 auto; }
.ops-route-row .rm{ flex:1; min-width:0; }
.ops-route-row .a{ font-size:13.5px; font-weight:700; }
.ops-route-row .b{ font-size:11px; color:var(--ops-slate-3); margin-top:1px; }
.ops-route-row .updown{ display:flex; gap:5px; flex:0 0 auto; }
.ops-route-row .updown button{ width:32px; height:32px; border:1px solid var(--ops-line); border-radius:9px;
  background:#f8fafc; cursor:pointer; font-size:12px; color:var(--ops-slate-2); }
.ops-route-row .updown button[disabled]{ opacity:.35; cursor:default; }
.ops-reopt{ text-align:center; margin:4px 0 8px; }
.ops-reopt button{ background:none; border:none; color:var(--ops-slate-3); font-size:12px; font-weight:700;
  text-decoration:underline; cursor:pointer; font-family:inherit; padding:8px; }
.ops-route-recap{ background:#f8fafc; border:1px solid var(--ops-line); border-radius:12px; padding:10px 12px;
  font-size:12.5px; color:var(--ops-slate-2); line-height:1.5; margin:6px 0; }

/* ---- pictos QR <use> : tailles standard (badge petit => épingle officielle) ---- */
.ops-qrpin{ width:22px; height:22px; display:inline-block; vertical-align:-5px; }
.ops-qrpin.sm{ width:17px; height:17px; vertical-align:-4px; }
.ops-qri{ width:64px; height:64px; display:inline-block; }

/* [YALLER_UNIFIE 2026-06-17] chip de retour NOIR #opsem-mapret SUPPRIMÉ (hors palette de
   mission = « bandeau noir »). Le dock canonique #opsem-rel-go (couleur de mission) est
   désormais le SEUL bandeau retour. ensureMapChip est neutralisé côté JS. */

/* ---- dock de tournée boîtage (terrain, hors overlay) ----
   [BT-LOOP 2026-06-12] EN HAUT au centre, même famille que le chip #opsem-mapret.
   RÈGLE BOITAGE1 : le bas de la carte appartient au mode boîtage NATIF (toggle
   #boitage-ui bas-gauche + #boitage-validate bas-droit) — le dock ne les recouvre
   JAMAIS. Largeur bornée pour laisser libres le HUD (haut-gauche) et la géoloc
   (haut-droit, 44px + marges).
   [FLYER3 2026-06-12] (D) le dock passe au VIOLET boîtage #7c3aed (retour
   Nicolas : violet = boîtage SEUL — le bordeaux « retour mission » ne
   s'applique pas ici, cf. product/code_couleur.md). */
#opsem-bt-dock{ position:fixed; left:50%; transform:translateX(-50%); top:calc(10px + env(safe-area-inset-top, 0px));
  z-index:10400; display:flex; flex-direction:column; align-items:center; gap:2px;
  max-width:calc(100vw - 128px); border:none; border-radius:16px; padding:9px 16px;
  /* [YALLER_UNIFIE 2026-06-17] couleur de mission via la variable posée par btEnsureDock
     (ZÉRO hex en dur) ; fallback violet identique à la table. */
  background:var(--opsem-mission-color, #7c3aed); color:#fff; box-shadow:0 10px 30px rgba(0,0,0,.35); cursor:pointer;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif; }
#opsem-bt-dock .r{ font-size:13.5px; font-weight:800; white-space:nowrap; }
/* [FLYER4 2026-06-12] (P) ligne TYPE du dock : mini-pin officiel + libellé long,
   sur fond clair pour décoller le pin du violet du dock et rester lisible plein soleil. */
#opsem-bt-dock .ty{ display:inline-flex; align-items:center; gap:6px; max-width:100%;
  margin-top:1px; padding:2px 9px 2px 6px; border-radius:999px; background:rgba(255,255,255,.16); }
#opsem-bt-dock .ty .ops-qrpin.dk{ width:18px; height:18px; flex:0 0 auto; vertical-align:0; }
#opsem-bt-dock .ty .tyl{ font-size:11.5px; font-weight:800; color:#fff; letter-spacing:.1px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#opsem-bt-dock .s{ font-size:11px; color:#ffffff; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ============================================================================
   É5 — MISSION BIENS EN PERSONNE MORALE (vert PRO #15803d)
   Fidèle au volet PM SIMPLIFIÉ de la maquette planning_v5 (pm-rue / pm-addr /
   tmode / débrief / sheet courrier). Tout est namespacé .ops-pm / #opsem-pm /
   #opsem-pm-tour : aucune collision avec map.css / menu-v8.css.
   ============================================================================ */
#opsem-pm .ops-mbar{ border-bottom:3px solid var(--ops-vertpro); }
#opsem-pm .ops-whybtn.pm{ color:var(--ops-vertpro); }
#opsem-pm .ops-blank button{ min-height:46px; padding:0 18px; border:none; border-radius:12px;
  background:var(--ops-vertpro); color:#fff; font-weight:700; font-size:14px; cursor:pointer; font-family:inherit; }

/* type de propriétaire : SCI pré-choisi, multi-léger, jamais zéro */
.ops-pm-chips{ display:flex; gap:8px; flex-wrap:wrap; margin:2px 0 4px; }
.ops-pm-chips button{ border:1px solid var(--ops-line); background:#fff; color:var(--ops-slate-2);
  border-radius:999px; font-size:12.5px; font-weight:700; padding:9px 13px; cursor:pointer; font-family:inherit; }
.ops-pm-chips button.on{ background:var(--ops-vertpro); border-color:var(--ops-vertpro); color:#fff; }
.ops-pm-hint{ font-size:11.5px; color:var(--ops-slate-3); margin:4px 4px 2px; line-height:1.4; }

/* rue cochable (coche de rue = toute la rue) */
.ops-pm-rue{ display:flex; align-items:center; gap:10px; background:rgba(22,163,74,.08);
  border:1px solid rgba(22,163,74,.22); border-radius:12px; padding:9px 11px; margin:10px 0 6px;
  cursor:pointer; user-select:none; -webkit-user-select:none; }
.ops-pm-rue .nm{ flex:1; min-width:0; font-size:13px; font-weight:800; letter-spacing:-.2px; }
.ops-pm-rue .ct{ font-size:11px; font-weight:600; color:var(--ops-slate-3); flex:0 0 auto; }

/* adresse cochable */
.ops-pm-addr{ display:flex; gap:11px; align-items:flex-start; background:var(--ops-card);
  border:1px solid var(--ops-line); border-radius:13px; padding:11px 12px; margin-bottom:8px;
  box-shadow:var(--ops-shadow); }
.ops-pm-addr.off{ opacity:.5; box-shadow:none; }
.ops-pm-addr.done{ opacity:.74; }
.ops-pm-addr .main{ flex:1; min-width:0; cursor:pointer; }
.ops-pm-addr .a{ font-size:14px; font-weight:700; letter-spacing:-.2px; line-height:1.25; }
.ops-pm-addr .a .chk{ color:var(--ops-vertpro); margin-right:4px; }
.ops-pm-addr .s{ font-size:11.5px; color:var(--ops-slate-3); margin-top:2px; line-height:1.3; }
.ops-pm-addr .st{ font-size:11px; font-weight:700; margin-top:4px; color:var(--ops-slate-3); }
.ops-pm-addr .st.q{ color:var(--ops-vertpro); }
.ops-pm-addr .st .mail{ color:#6d28d9; font-weight:700; }
.ops-pm-addr .see{ flex:0 0 auto; width:38px; height:38px; border:1px solid var(--ops-line);
  background:#f8fafc; border-radius:10px; font-size:15px; cursor:pointer; }

/* coche commune (rue + adresse) */
.ops-pm-rue .cb, .ops-pm-addr .cb{ width:22px; height:22px; flex:0 0 auto; border-radius:7px;
  border:2px solid #cbd5e1; background:#fff; color:#fff; display:grid; place-items:center; cursor:pointer; margin-top:1px; }
.ops-pm-rue .cb svg, .ops-pm-addr .cb svg{ width:13px; height:13px; }
.ops-pm-rue .cb.on, .ops-pm-addr .cb.on{ background:var(--ops-vertpro); border-color:var(--ops-vertpro); }
.ops-pm-addr .cb.lock{ opacity:.85; pointer-events:none; }

/* temps de tournée : OSRM réel, jamais de durée inventée */
.ops-pm-tmode{ background:var(--ops-card); border:1px solid var(--ops-line); border-radius:14px;
  padding:12px 13px; margin:14px 0 6px; box-shadow:var(--ops-shadow); }
.ops-pm-tmode .big{ font-size:19px; font-weight:800; letter-spacing:-.4px; }
.ops-pm-tmode .subt{ font-size:11.5px; color:var(--ops-slate-3); margin-top:2px; }
.ops-pm-tmode .row{ display:flex; gap:7px; margin-top:10px; }
.ops-pm-tmode .row button{ flex:1; min-height:40px; border:1px solid var(--ops-line); background:#fff;
  color:var(--ops-slate-2); border-radius:10px; font-size:11.5px; font-weight:700; cursor:pointer; font-family:inherit; }
.ops-pm-tmode .row button.on{ background:var(--ops-vertpro); border-color:var(--ops-vertpro); color:#fff; }
.ops-pm-tmode .note{ font-size:10.5px; color:var(--ops-slate-3); margin-top:8px; line-height:1.4; }

/* footbar « Générer l'itinéraire de la tournée » */
.ops-pm-foot{ flex:0 0 auto; background:var(--ops-card); border-top:1px solid var(--ops-line);
  padding:9px 14px calc(12px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; gap:8px; }
.ops-pm-foot[hidden]{ display:none; }
.ops-pm-foot .fc{ font-size:12px; font-weight:600; color:var(--ops-slate-3); text-align:center; }
.ops-pm-foot button{ min-height:48px; border:none; border-radius:12px; background:var(--ops-vertpro);
  color:#fff; font-weight:800; font-size:14.5px; cursor:pointer; font-family:inherit; }
.ops-pm-foot button:active{ filter:brightness(.93); }

/* débrief */
.ops-pm-db-head{ text-align:center; padding:18px 0 4px; }
.ops-pm-db-head .check{ width:54px; height:54px; border-radius:50%; background:var(--ops-vertpro);
  color:#fff; font-size:26px; display:grid; place-items:center; margin:0 auto 10px; }
.ops-pm-db-head h2{ margin:0; font-size:19px; letter-spacing:-.3px; }
.ops-pm-db-recap{ font-size:13px; color:var(--ops-slate-2); line-height:1.55; text-align:center;
  margin:8px 6px 14px; }
.ops-pm-db-tt{ font-size:12.5px; font-weight:800; color:var(--ops-slate-2); margin:14px 4px 8px; line-height:1.45; }
.ops-pm-db-tt.soft{ font-weight:600; color:var(--ops-slate-3); }
.ops-pm-db-row{ display:flex; align-items:center; gap:8px; background:#f8fafc; border:1px solid var(--ops-line);
  border-radius:12px; padding:10px 11px; margin-bottom:8px; }
.ops-pm-db-row .m{ flex:1; min-width:0; font-size:12.5px; line-height:1.35; color:var(--ops-slate-2); }
.ops-pm-db-row button{ flex:0 0 auto; border:none; border-radius:9px; padding:9px 11px; font-size:12px;
  font-weight:800; cursor:pointer; font-family:inherit; }
.ops-pm-db-row button.mail{ background:var(--ops-vertpro); color:#fff; }
.ops-pm-db-row button.ger{ background:#fff; border:1px solid var(--ops-line); color:var(--ops-slate-2); }
.ops-pm-db-row button.okd{ background:#f0fdf4; color:var(--ops-vertpro); border:1px solid #bbf7d0; cursor:default; }
.ops-pm-db-acts{ display:flex; flex-direction:column; gap:8px; margin:16px 0 6px; }
.ops-pm-db-acts button{ min-height:48px; border-radius:12px; font-weight:800; font-size:14px;
  cursor:pointer; font-family:inherit; }
.ops-pm-db-acts .end{ background:var(--ops-vertpro); border:none; color:#fff; }
.ops-pm-db-acts .cont{ background:#fff; border:1px solid var(--ops-line); color:var(--ops-slate-2); }
.ops-pm-cap{ display:inline-block; font-size:11px; font-weight:700; color:var(--ops-slate-3);
  background:#f8fafc; border:1px solid var(--ops-line); border-radius:999px; padding:4px 10px; margin:0 4px 10px; }

/* sheet courrier gérant (dans la .ops-sheet existante) */
.ops-pm-sub{ font-size:12px; color:var(--ops-slate-3); margin-bottom:10px; line-height:1.45; }
.ops-pm-gline{ font-size:12px; color:var(--ops-slate-2); background:#f0fdf4; border:1px solid #bbf7d0;
  border-radius:10px; padding:8px 10px; margin-bottom:10px; line-height:1.45; }
.ops-pm-opt{ display:flex; gap:10px; align-items:center; border:1.5px solid var(--ops-line); border-radius:12px;
  padding:9px 11px; margin-bottom:7px; cursor:pointer; }
.ops-pm-opt.on{ border-color:var(--ops-vertpro); background:#f0fdf4; }
.ops-pm-opt .n{ width:24px; height:24px; flex:0 0 auto; border-radius:50%; background:var(--ops-vertpro);
  color:#fff; font-size:12px; font-weight:800; display:grid; place-items:center; }
.ops-pm-opt .t{ font-size:12.5px; font-weight:700; line-height:1.3; }
.ops-pm-opt .t small{ display:block; font-weight:500; color:var(--ops-slate-3); font-size:11px; }
.ops-pm-lbl{ font-size:11px; font-weight:700; color:var(--ops-vertpro); text-transform:uppercase;
  letter-spacing:.4px; margin:10px 0 4px; }
.ops-pm-dest{ font-size:13px; line-height:1.5; color:var(--ops-slate-2); background:#f8fafc;
  border:1px solid var(--ops-line); border-radius:10px; padding:9px 11px; }
.ops-pm-letter{ width:100%; min-height:190px; border:1px solid var(--ops-line); border-radius:11px;
  padding:10px 11px; font-size:13px; line-height:1.5; color:var(--ops-slate); font-family:inherit; resize:vertical; }
.ops-pm-go{ width:100%; min-height:50px; border:none; border-radius:13px; background:var(--ops-vertpro);
  color:#fff; font-size:14px; font-weight:800; cursor:pointer; font-family:inherit; margin-top:10px; }
.ops-pm-note{ font-size:10.5px; color:var(--ops-slate-3); margin-top:9px; line-height:1.45; }

/* ============================================================================
   É5 — BANDEAU DE TOURNÉE (HORS overlay #opsem-root : il vit SUR la carte).
   z-index 29 : SOUS la fiche (sheet de l'app = 30) — la fiche ouverte passe
   toujours DEVANT (convention map.css « sous la fiche (sheet = 30) »).
   ============================================================================ */
#opsem-pm-tour{ position:fixed; left:12px; right:12px; bottom:14px; z-index:29; max-width:430px; margin:0 auto;
  background:#fff; border:1px solid #e2e8f0; border-left:4px solid #15803d; border-radius:16px;
  box-shadow:0 12px 32px rgba(15,23,42,.24); padding:10px 12px;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:#0f172a; }
#opsem-pm-tour[hidden]{ display:none; }
#opsem-pm-tour *{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
#opsem-pm-tour .top{ display:flex; justify-content:space-between; align-items:center; gap:8px; }
#opsem-pm-tour .top button{ border:none; background:#f0fdf4; color:#15803d; font-weight:800; font-size:12.5px;
  border-radius:9px; padding:7px 10px; cursor:pointer; font-family:inherit; }
#opsem-pm-tour .pos{ font-size:11px; font-weight:700; color:#64748b; }
#opsem-pm-tour .ta{ font-size:14.5px; font-weight:800; letter-spacing:-.2px; margin-top:7px; line-height:1.25; }
#opsem-pm-tour .tw{ font-size:11.5px; color:#64748b; margin-top:1px; }
#opsem-pm-tour .tn{ font-size:12px; color:#334155; background:#f8fafc; border-radius:9px; padding:7px 9px;
  margin-top:7px; line-height:1.45; }
#opsem-pm-tour .chips{ display:flex; gap:6px; margin-top:7px; flex-wrap:wrap; }
#opsem-pm-tour .chips button{ border:1px solid #bbf7d0; background:#f0fdf4; color:#15803d; border-radius:999px;
  font-size:11.5px; font-weight:700; padding:6px 10px; cursor:pointer; font-family:inherit; }
/* [marqueurs 2026-06-11] chip « ✉ Courrier à préparer » — neutre (pictogramme, pas de couleur nouvelle) */
#opsem-pm-tour .chips button.cc{ border:1px solid #e2e8f0; background:#fff; color:#334155; }
#opsem-pm-tour .chips button.cc.on{ border-color:#94a3b8; background:#f1f5f9; color:#0f172a; }
#opsem-pm-tour .chips button.cc.done{ border-color:#e2e8f0; background:#f8fafc; color:#94a3b8; cursor:default; }
#opsem-pm-tour .row{ display:flex; gap:8px; margin-top:9px; }
#opsem-pm-tour .row button{ flex:1; min-height:42px; border-radius:11px; font-weight:700; font-size:13px;
  cursor:pointer; font-family:inherit; }
#opsem-pm-tour .row .soft{ background:#fff; border:1px solid #e2e8f0; color:#334155; }
#opsem-pm-tour .row .next{ background:#15803d; border:none; color:#fff; }

/* [RELANCE-EPURE 2026-06-11] Bannière « Y aller » de la mission Relance :
   parcelle clignotante sur la carte + bouton « ← Revenir à la liste ».
   Même position/z-index que la bannière de tournée PM (z=29, la fiche
   sheet z=30 passe devant).
   [FIX2 2026-06-12] RÈGLE COULEUR DE MISSION (D-bis Nicolas) : tout l'habillage
   de mission sur la carte (dock retour + parcelle pulsante) prend LA COULEUR DE
   LA MISSION. Composant COMMUN paramétré par la variable --opsem-mission-color
   (posée en JS via opsemSetMissionColor()) : relance=orange #f59e0b,
   boîtage=violet #7c3aed, etc. Le bordeaux #BE123C précédent VIOLAIT le code
   couleur (= RUES CHAUDES, pas relance — cf. product/code_couleur.md). Fallback
   orange car cette bannière est celle de la mission relance. */
#opsem-rel-go{ position:fixed; left:12px; right:12px; bottom:14px; z-index:29; max-width:430px; margin:0 auto;
  --opsem-mission-color:#f59e0b;
  background:#fff; border:1px solid #e2e8f0; border-left:4px solid var(--opsem-mission-color); border-radius:16px;
  box-shadow:0 12px 32px rgba(15,23,42,.24); padding:10px 12px;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:#0f172a; }
#opsem-rel-go[hidden]{ display:none; }
/* [YALLER_UNIFIE 2026-06-17] N18 : variante EN HAUT du MÊME composant (bas occupé par les
   boutons natifs de boîtage). Même fond blanc + liseré couleur-mission, juste repositionné. */
#opsem-rel-go[data-opg-top]{ top:calc(10px + env(safe-area-inset-top, 0px)); bottom:auto; }
#opsem-rel-go *{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
#opsem-rel-go button[data-relgo="back"]{ width:100%; min-height:44px; border:none; border-radius:11px;
  background:var(--opsem-mission-color); color:#fff; font-weight:800; font-size:14px; cursor:pointer; font-family:inherit; }
#opsem-rel-go .rg-hint{ font-size:12px; color:#334155; margin-top:8px; line-height:1.4; }

/* GAM-F1 médaillon : retiré du hero (COCKPIT2 2026-06-12) — le statut secteur
   vit désormais dans la sheet ⓘ « Ta semaine en % » (pointsSheet). */

/* ============================================================================
   C2 — « Mes modèles de courriers » : badges/raccourci feuille + éditeur modal
   (courriers_workflow_spec.md §2). Vert PRO canonique. Namespacé .ops-tpl-*.
   ============================================================================ */
.ops-tpl-badge{ display:inline-block; margin-left:6px; padding:1px 7px; border-radius:999px;
  background:#dcfce7; color:var(--ops-vertpro); font-size:10px; font-weight:700; vertical-align:middle; }
.ops-tpl-hint{ color:var(--ops-slate-3); font-weight:400; font-size:11.5px; }
.ops-tpl-link{ display:block; margin:8px 0 2px; font-size:12.5px; color:var(--ops-vertpro);
  text-decoration:none; font-weight:600; }
.ops-tpl-link:active{ opacity:.7; }

#opsem-tpl-root[hidden]{ display:none; }
#opsem-tpl-root{ position:fixed; inset:0; z-index:100050; }
.ops-tpl-scrim{ position:absolute; inset:0; background:rgba(15,23,42,.5); }
.ops-tpl-card{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(560px,94vw); max-height:92vh; display:flex; flex-direction:column; min-height:0;
  background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,.32);
  font-family:inherit; }
.ops-tpl-head{ display:flex; align-items:center; gap:8px; padding:12px 14px;
  border-bottom:3px solid var(--ops-vertpro); }
.ops-tpl-back{ border:none; background:none; font-size:26px; line-height:1; color:var(--ops-slate-2);
  cursor:pointer; padding:0 4px; }
.ops-tpl-ttl{ font-size:16px; font-weight:700; color:#0f172a; }
.ops-tpl-body{ padding:14px 16px 20px; overflow:auto; min-height:0; flex:1; -webkit-overflow-scrolling:touch; }
.ops-tpl-intro{ font-size:12.5px; line-height:1.55; color:var(--ops-slate-2); margin-bottom:12px; }
.ops-tpl-tabs{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.ops-tpl-mtab{ border:1px solid var(--ops-line); background:#fff; border-radius:9px; padding:6px 10px;
  font-size:12px; font-weight:600; color:var(--ops-slate-2); cursor:pointer; font-family:inherit; }
.ops-tpl-mtab.on{ background:var(--ops-vertpro); border-color:var(--ops-vertpro); color:#fff; }
.ops-tpl-mtab .ops-tpl-badge{ background:rgba(255,255,255,.25); color:#fff; }
.ops-tpl-mtab:not(.on) .ops-tpl-badge{ background:#dcfce7; color:var(--ops-vertpro); }
.ops-tpl-mname{ font-size:13px; font-weight:700; color:#0f172a; margin:4px 0 12px; }
.ops-tpl-mname small{ display:block; font-weight:400; font-size:11.5px; color:var(--ops-slate-3); margin-top:2px; }
.ops-tpl-lbl{ display:block; font-size:11.5px; font-weight:700; color:var(--ops-slate-2);
  text-transform:uppercase; letter-spacing:.02em; margin:12px 0 5px; }
.ops-tpl-input{ width:100%; box-sizing:border-box; border:1px solid var(--ops-line); border-radius:10px;
  padding:9px 11px; font-size:13.5px; font-family:inherit; color:#0f172a; }
.ops-tpl-vars{ font-size:11.5px; color:var(--ops-slate-3); margin:10px 0 6px; }
.ops-tpl-chip{ display:inline-flex; flex-direction:column; align-items:flex-start; gap:1px;
  margin:3px 5px 3px 0; padding:4px 9px; border:1px dashed var(--ops-vertpro); border-radius:8px;
  background:#f0fdf4; color:var(--ops-vertpro); font-size:11.5px; font-weight:700; cursor:pointer; font-family:inherit; }
.ops-tpl-chip small{ font-weight:400; font-size:10px; color:var(--ops-slate-3); }
.ops-tpl-area{ width:100%; box-sizing:border-box; min-height:180px; resize:vertical;
  border:1px solid var(--ops-line); border-radius:10px; padding:11px; font-size:13.5px; line-height:1.55;
  font-family:inherit; color:#0f172a; }
.ops-tpl-msg:empty{ display:none; }
.ops-tpl-err{ margin-top:8px; padding:8px 11px; border-radius:9px; background:#fef2f2;
  border:1px solid #fecaca; color:#b91c1c; font-size:12px; line-height:1.5; }
.ops-tpl-warn{ margin-top:8px; padding:8px 11px; border-radius:9px; background:#fffbeb;
  border:1px solid #fde68a; color:#92400e; font-size:12px; line-height:1.5; }
.ops-tpl-preview{ border:1px solid var(--ops-line); border-radius:10px; padding:13px; background:#fafafa;
  font-family:Georgia,serif; font-size:13px; line-height:1.6; color:#111; }
.ops-tpl-pv-objet{ font-weight:700; margin-bottom:10px; }
.ops-tpl-mk{ background:#dcfce7; color:#065f46; border-radius:4px; padding:0 3px; }
.ops-tpl-mk.bad{ background:#fee2e2; color:#b91c1c; }
.ops-tpl-fixed{ margin-top:12px; border:1px dashed var(--ops-line); border-radius:10px; padding:10px 12px; background:#f8fafc; }
.ops-tpl-fixed-h{ font-size:11px; font-weight:700; color:var(--ops-slate-3); text-transform:uppercase; letter-spacing:.02em; margin-bottom:6px; }
.ops-tpl-fixed-b{ font-size:12px; line-height:1.55; color:var(--ops-slate-3); white-space:pre-line; }
.ops-tpl-actions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.ops-tpl-save{ flex:1; min-width:180px; min-height:46px; border:none; border-radius:12px;
  background:var(--ops-vertpro); color:#fff; font-size:14px; font-weight:700; cursor:pointer; font-family:inherit; }
.ops-tpl-save:disabled{ opacity:.45; cursor:not-allowed; }
.ops-tpl-resetb{ min-height:46px; border:1px solid var(--ops-line); border-radius:12px; background:#fff;
  color:var(--ops-slate-2); font-size:13px; font-weight:600; cursor:pointer; padding:0 14px; font-family:inherit; }

/* ===================== C3 « Courriers à envoyer » ===================== */
/* ligne passerelle (cockpit + débrief PM) */
.ops-cf-line{ display:flex; align-items:center; gap:11px; width:100%; box-sizing:border-box;
  margin:0 0 14px; padding:12px 14px; border:1px solid #fbcfe8; border-radius:13px;
  background:linear-gradient(180deg,#fdf2f8,#fff); cursor:pointer; text-align:left; font-family:inherit; }
.ops-cf-line.db{ margin:14px 0 4px; border:none; outline:1px solid #fbcfe8; }
.ops-cf-line:active{ opacity:.8; }
/* FIX 2026-06-11 : état vide découvrable (0 courrier) — grisé, toujours cliquable */
.ops-cf-line.empty{ border:1px solid var(--ops-slate-1,#e2e8f0); background:linear-gradient(180deg,#f8fafc,#fff); }
.ops-cf-line.empty .ico{ background:#eef2f6; color:#94a3b8; }
.ops-cf-line.empty .tx b{ color:var(--ops-slate-3,#64748b); font-weight:600; }
.ops-cf-line.empty .chev{ color:#94a3b8; }
.ops-cf-line .ico{ flex:0 0 auto; width:34px; height:34px; border-radius:9px; display:flex;
  align-items:center; justify-content:center; background:#fce7f3; color:#be185d; font-size:17px; }
.ops-cf-line .tx{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.ops-cf-line .tx b{ font-size:13.5px; color:#9d174d; font-weight:700; }
.ops-cf-line .tx small{ font-size:11.5px; color:var(--ops-slate-3); line-height:1.4; }
.ops-cf-line .chev{ flex:0 0 auto; color:#be185d; font-size:20px; }

/* modal file */
#opsem-cf-root[hidden]{ display:none; }
#opsem-cf-root{ position:fixed; inset:0; z-index:100051; }
.ops-cf-card .ops-tpl-head{ border-bottom-color:#be185d; }
.ops-cf-body{ padding:14px 16px 22px; }
.ops-cf-intro{ font-size:12.5px; line-height:1.55; color:var(--ops-slate-2); margin-bottom:12px; }
.ops-cf-empty{ font-size:13px; line-height:1.6; color:var(--ops-slate-2); background:#f8fafc;
  border:1px dashed var(--ops-line); border-radius:12px; padding:16px; }
/* [marqueurs 2026-06-11] sections + section « à préparer » (terrain) + mini-photo IGN */
.ops-cf-sec{ font-size:12px; font-weight:800; color:#475569; text-transform:none; margin:14px 0 8px;
  letter-spacing:.01em; }
.ops-cf-sec:first-of-type{ margin-top:4px; }
.ops-cf-item.prep{ display:flex; gap:11px; align-items:flex-start; border-color:#e2e8f0;
  background:linear-gradient(180deg,#fbfdff,#fff); }
.ops-cf-item.prep .ops-cf-meta{ flex:1; min-width:0; margin-bottom:0; }
.ops-cf-photo{ flex:0 0 auto; width:64px; height:64px; border-radius:10px; object-fit:cover;
  border:1px solid var(--ops-line); background:#eef2f6; }
.ops-cf-bien.big{ font-size:14.5px; }
.ops-cf-item.prep .ops-cf-acts{ margin-top:9px; }
.ops-cf-empty b{ color:#0f172a; }
.ops-cf-item{ border:1px solid var(--ops-line); border-radius:12px; padding:11px 13px; margin-bottom:10px; background:#fff; }
.ops-cf-meta{ margin-bottom:9px; }
.ops-cf-bien{ font-size:13.5px; font-weight:700; color:#0f172a; }
.ops-cf-sub{ font-size:11.5px; color:var(--ops-slate-3); margin-top:2px; line-height:1.4; }
.ops-cf-acts{ display:flex; flex-wrap:wrap; gap:7px; }
.ops-cf-b{ border:1px solid var(--ops-line); background:#fff; border-radius:9px; padding:7px 11px;
  font-size:12px; font-weight:600; color:var(--ops-slate-2); cursor:pointer; font-family:inherit; }
.ops-cf-b:active{ opacity:.75; }
.ops-cf-b.print{ border-color:var(--ops-vertpro); color:var(--ops-vertpro); background:#f0fdf4; }
.ops-cf-b.poste{ border-color:#16a34a; color:#fff; background:#16a34a; }
.ops-cf-b.annule{ border-color:#fecaca; color:#b91c1c; }
.ops-cf-b.reopen{ border-color:#c7d2fe; color:#4338ca; background:#eef2ff; }

/* sous-écran retouche ponctuelle (par-dessus la liste, dans la même carte) */
.ops-cf-edit[hidden]{ display:none; }
.ops-cf-edit{ position:absolute; inset:0; background:#fff; border-radius:16px; display:flex; flex-direction:column; min-height:0; }
.ops-cf-edit .ops-tpl-head{ border-bottom:3px solid var(--ops-vertpro); }
.ops-cf-edit-body{ padding:14px 16px 20px; overflow:auto; min-height:0; flex:1; -webkit-overflow-scrolling:touch; }
.ops-cf-card.ops-cf-editing > .ops-cf-body{ visibility:hidden; }

/* ============================================================================
   CAL-1 « Mon rythme de prospection » — bloc dans le panneau Mon compte.
   NON namespacé .ops- (il vit dans le drawer menu-v8, pas dans #opsem-root) :
   préfixe .op8-rythme pour cohabiter sans collision avec menu-v8.css.
   Bloc neutre slate, radio-cards empilées (cible tap >= 44px), pas de couleur mission.
   ============================================================================ */
.op8-rythme{ margin:0 0 14px; padding:12px 12px 10px; background:#f8fafc;
  border:1px solid #e2e8f0; border-radius:14px; }
.op8-rythme-head{ display:flex; align-items:center; gap:7px; font-weight:700;
  font-size:13.5px; color:#0f172a; margin-bottom:4px; }
.op8-rythme-head svg{ flex:0 0 auto; }
.op8-rythme-q{ font-size:12.5px; line-height:1.4; color:#475569; margin:0 0 10px; }
.op8-rythme-cards{ display:flex; flex-direction:column; gap:8px; }
.op8-rythme-card{ display:flex; align-items:center; gap:11px; width:100%;
  min-height:44px; padding:9px 12px; background:#fff; border:1.5px solid #e2e8f0;
  border-radius:11px; cursor:pointer; text-align:left; transition:border-color .12s, background .12s;
  font:inherit; color:inherit; -webkit-tap-highlight-color:transparent; }
.op8-rythme-card:hover{ border-color:#cbd5e1; }
.op8-rythme-card .rk-radio{ flex:0 0 auto; width:18px; height:18px; border-radius:50%;
  border:2px solid #cbd5e1; position:relative; transition:border-color .12s; }
.op8-rythme-card .rk-tx{ display:flex; flex-direction:column; min-width:0; }
.op8-rythme-card .rk-t{ font-size:13.5px; font-weight:650; color:#0f172a; line-height:1.2; }
.op8-rythme-card .rk-s{ font-size:11.5px; color:#64748b; line-height:1.3; margin-top:1px; }
.op8-rythme-card[aria-checked="true"]{ border-color:#0f172a; background:#f1f5f9; }
.op8-rythme-card[aria-checked="true"] .rk-radio{ border-color:#0f172a; }
.op8-rythme-card[aria-checked="true"] .rk-radio::after{ content:""; position:absolute;
  inset:3px; border-radius:50%; background:#0f172a; }
.op8-rythme-toast{ margin-top:9px; font-size:12px; color:#15803d; font-weight:600;
  display:flex; align-items:center; gap:6px; opacity:0; transition:opacity .2s; }
.op8-rythme-toast[hidden]{ display:none; }
.op8-rythme-toast.show{ opacity:1; }

/* « Ajuster mon rythme » : retiré du hero (COCKPIT2 2026-06-12) — l'accès vit
   dans la sheet ⓘ (bouton .go-existing injecté par pointsSheet, même réglage). */

/* ========================================================================
   [VALO-COMPTE 2026-06-11] Fiche de valorisation du compte (GAM-F2).
   Additif pur : réutilise l'overlay .ops-tpl-* (scrim/card/head/body) déjà
   défini plus haut ; ajoute uniquement le contenu .ops-valo-*. Sobre, ton
   patrimoine, jamais d'auto-promo. Couleurs = tokens design system existants.
   ====================================================================== */
#opsem-valo-root[hidden]{ display:none; }
#opsem-valo-root{ position:fixed; inset:0; z-index:100050; }
.ops-valo-card .ops-tpl-head{ border-bottom-color:var(--ops-slate); }
.ops-valo-body{ background:#f8fafc; }

/* en-tête : ancienneté + médaillon statut */
.ops-valo-hero{ background:#fff; border:1px solid var(--ops-line); border-radius:14px;
  padding:13px 14px; margin-bottom:14px; }
.ops-valo-hero-row{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.ops-valo-hero-k{ font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--ops-slate-3); font-weight:700; }
.ops-valo-hero-v{ font-size:14px; font-weight:700; color:var(--ops-slate); }
.ops-valo-medal{ margin-top:10px; display:inline-flex; align-items:center; gap:8px;
  background:var(--ops-slate); color:#fff; border-radius:11px; padding:7px 12px;
  font-size:14px; font-weight:700; }
.ops-valo-medal .sc{ font-weight:600; opacity:.82; font-size:12.5px; }
.ops-valo-medal.prep{ background:#e2e8f0; color:var(--ops-slate-2); }

/* petit ⓘ — la SEULE explication tolérée dans l'UI */
.ops-valo-i{ width:17px; height:17px; flex:0 0 auto; border-radius:50%;
  border:1px solid currentColor; background:transparent; color:inherit; font-size:10px;
  font-style:italic; font-weight:700; line-height:15px; text-align:center; cursor:pointer;
  opacity:.62; padding:0; font-family:Georgia, 'Times New Roman', serif; }
.ops-valo-medal .ops-valo-i{ border-color:rgba(255,255,255,.6); color:#fff; opacity:.85; }
.ops-valo-i:active{ opacity:1; }

/* sections */
.ops-valo-sec{ margin-bottom:16px; }
.ops-valo-sec h3{ display:flex; align-items:center; gap:6px; margin:0 0 9px;
  font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--ops-slate-3); font-weight:800; }

/* grille « ce que vaut ton fichier » (nombres bruts) */
.ops-valo-grid{ display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.ops-valo-card-stat{ background:#fff; border:1px solid var(--ops-line); border-radius:12px;
  padding:11px 12px; display:flex; flex-direction:column; gap:3px; }
.ops-valo-card-stat .n{ font-size:23px; font-weight:800; color:var(--ops-slate); line-height:1; }
.ops-valo-card-stat .l{ font-size:11.5px; line-height:1.35; color:var(--ops-slate-2); }

/* mandats — la preuve de conversion (accent emeraude sobre) */
.ops-valo-mandat{ background:#fff; border:1px solid var(--ops-line); border-left:4px solid var(--ops-emeraude);
  border-radius:12px; padding:12px 14px; display:flex; align-items:baseline; gap:10px; }
.ops-valo-mandat .big{ font-size:30px; font-weight:800; color:var(--ops-emeraude); line-height:1; }
.ops-valo-mandat .lbl{ font-size:13px; color:var(--ops-slate-2); }

/* tableau des 7 indicateurs */
.ops-valo-tbl{ background:#fff; border:1px solid var(--ops-line); border-radius:12px; overflow:hidden; }
.ops-valo-row{ padding:11px 13px; border-top:1px solid var(--ops-line); }
.ops-valo-row:first-child{ border-top:none; }
.ops-valo-row .rl{ display:flex; align-items:baseline; gap:7px; }
.ops-valo-row .nm{ font-size:13.5px; font-weight:700; color:var(--ops-slate); }
.ops-valo-row .cf{ font-size:11px; font-weight:700; color:var(--ops-slate-3);
  background:#f1f5f9; border-radius:6px; padding:1px 6px; }
.ops-valo-row .rr{ margin-top:7px; }
.ops-valo-row .bar{ height:7px; border-radius:4px; background:#eef2f7; overflow:hidden; }
.ops-valo-row .bar span{ display:block; height:100%; border-radius:4px; background:var(--ops-slate);
  min-width:3px; }
.ops-valo-row .num{ margin-top:5px; font-size:12px; color:var(--ops-slate-3); }
.ops-valo-row .num b{ color:var(--ops-slate); }
.ops-valo-row .rv{ margin-top:5px; font-size:11.5px; font-style:italic; color:var(--ops-slate-3); }
.ops-valo-row.prep{ opacity:.78; }
.ops-valo-row .prep-tag{ display:inline-block; margin-top:5px; font-size:11px; font-weight:700;
  color:var(--ops-slate-3); background:#f1f5f9; border-radius:6px; padding:2px 8px; }

/* par commune */
.ops-valo-coms{ background:#fff; border:1px solid var(--ops-line); border-radius:12px; overflow:hidden; }
.ops-valo-com{ display:flex; align-items:center; gap:8px; padding:9px 13px; border-top:1px solid var(--ops-line); }
.ops-valo-com:first-child{ border-top:none; }
.ops-valo-com .cn{ flex:1; font-size:13px; font-weight:600; color:var(--ops-slate); }
.ops-valo-com .cp{ font-size:11.5px; color:var(--ops-slate-3); }
.ops-valo-com .cs{ font-size:13px; font-weight:800; color:var(--ops-slate); min-width:34px; text-align:right; }

/* historique honnête (1 seul jour) */
.ops-valo-histo-prep{ font-size:12.5px; line-height:1.55; color:var(--ops-slate-2);
  background:#fff; border:1px dashed var(--ops-line); border-radius:12px; padding:12px 14px; }

/* info popover autonome (la pédagogie hors UI, déclenchée par un ⓘ) */
.ops-valo-info{ position:absolute; inset:0; z-index:5; }
.ops-valo-info-scrim{ position:absolute; inset:0; background:rgba(15,23,42,.4); }
.ops-valo-info-card{ position:absolute; left:0; right:0; bottom:0; background:#fff;
  border-radius:18px 18px 0 0; padding:14px 18px 18px; box-shadow:0 -8px 30px rgba(0,0,0,.18);
  transform:translateY(100%); transition:transform .22s ease; }
.ops-valo-info.on .ops-valo-info-card{ transform:translateY(0); }
.ops-valo-info-card .grab{ width:40px; height:4px; border-radius:2px; background:var(--ops-line); margin:0 auto 12px; }
.ops-valo-info-card p{ margin:0 0 14px; font-size:13.5px; line-height:1.55; color:var(--ops-slate-2); }
.ops-valo-info-card .close{ width:100%; min-height:46px; border:none; border-radius:12px;
  background:var(--ops-slate); color:#fff; font-size:14px; font-weight:700; cursor:pointer; font-family:inherit; }

/* [QW4-V6-touch-terrain 2026-06-18] accessibilité terrain (audit V6) : touch targets >=44px barre haute + label anneau lisible plein soleil */
.ops-mbar .ops-back, .ops-mbar .ops-refresh { min-width:44px; min-height:44px; }
.ops-scroll .ag-ring .cap { font-size:11px; }