/* =============================================================================
 * abonnement.solo.scoped.css — TRANSPLANT de la maquette validee abonnement_solo
 * Source VERBATIM : _LIVRAISON_INTEGRATION_2026-06-21/maquettes/abonnement_solo.html (<style>)
 * Scope : tout est prefixe par #op-abosolo-skin (n'affecte QUE l'ecran abo solo
 * transplante dans #hubpage-abo). Aucune fuite vers le reste du HUB.
 * Les .scrim/.sheet/.toast (overlays position:fixed) sont prefixes
 * #op-abosolo-skin AUSSI : ils sont injectes a l'interieur du skin -> portee bornee.
 *
 * Palette canonique reprise telle quelle de la maquette (inviolable). On NE
 * touche PAS au :root global du HUB : on declare ces variables LOCALEMENT sur
 * #op-abosolo-skin pour ne rien ecraser ailleurs.
 * ============================================================================= */

/* ---- SHIM : le skin remplit la page abo du HUB, pas un faux telephone ---- */
#hubpage-abo.op-abosolo{padding:0!important;}
#op-abosolo-skin{position:relative;display:block;width:100%;}
#op-abosolo-skin .app{max-width:100%!important;margin:0!important;min-height:0!important;
  background:transparent!important;position:relative;padding-bottom:24px!important;}
/* la maquette a son propre header sticky + bandeau proposition : le HUB a deja
   son chrome (top bar #ophub-top). On neutralise le double chrome de la maquette. */
#op-abosolo-skin .propo{display:none!important;}
#op-abosolo-skin > .app > header{display:none!important;}
/* F05 — neutralise la collision avec .h-title{color:var(--ink)} de map.css global */
#op-abosolo-skin .h-title{color:#fff;white-space:normal}

/* ============ Palette canonique (locale au skin) ============ */
#op-abosolo-skin{
  --ink:#0f172a; --ink-soft:#334155; --muted:#475569; --line:#e2e8f0;
  --line-strong:#cbd5e1; --bg:#f1f5f9; --card:#ffffff;
  --indigo:#4f46e5; --indigo-soft:#eef2ff;
  --pro:#15803d; --pro-soft:#dcfce7; --danger:#ef4444; --danger-soft:#fee2e2;
  --or:#b8860b; --or-soft:#fef3c7;
  --shadow:0 1px 2px rgba(15,23,42,.06), 0 8px 24px rgba(15,23,42,.08);
  --radius:16px;
  --sect:#0d9488; --sect-soft:#ccfbf1; --sect-line:#5eead4;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);line-height:1.4;-webkit-font-smoothing:antialiased;
}
#op-abosolo-skin *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}

/* ============ Carte abonnement (statut) ============ */
#op-abosolo-skin .abo-card{background:var(--card);margin:14px;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
#op-abosolo-skin .abo-head{padding:15px 16px 14px;display:flex;align-items:center;gap:13px;border-bottom:1px solid var(--line)}
#op-abosolo-skin .abo-badge{width:46px;height:46px;min-width:46px;border-radius:14px;background:var(--or-soft);border:1px solid #fcd34d;display:flex;align-items:center;justify-content:center;font-size:22px}
#op-abosolo-skin .abo-main{flex:1;min-width:0}
#op-abosolo-skin .abo-plan{font-size:16px;font-weight:900;color:var(--ink);letter-spacing:-.3px;display:flex;align-items:center;gap:7px}
#op-abosolo-skin .abo-plan .live{font-size:10px;font-weight:800;color:#166534;background:var(--pro-soft);padding:2px 8px;border-radius:999px}
#op-abosolo-skin .abo-sub{font-size:12px;color:var(--muted);margin-top:2px}
#op-abosolo-skin .abo-info{width:44px;height:44px;min-width:44px;border-radius:10px;border:1px solid var(--line-strong);background:#fff;color:var(--muted);font-size:14px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center}
#op-abosolo-skin .abo-info:active{background:var(--bg)}
#op-abosolo-skin .abo-grid{display:grid;grid-template-columns:1fr 1fr 1fr}
#op-abosolo-skin .abo-cell{padding:13px 14px;text-align:center;border-right:1px solid var(--line)}
#op-abosolo-skin .abo-cell:last-child{border-right:none}
#op-abosolo-skin .abo-cell .v{font-size:17px;font-weight:900;color:var(--ink);letter-spacing:-.4px}
#op-abosolo-skin .abo-cell .v.or{color:var(--or)}
#op-abosolo-skin .abo-cell .v.in{color:var(--indigo)}
#op-abosolo-skin .abo-cell .k{font-size:10px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.3px;margin-top:3px}
#op-abosolo-skin .abo-cell .v small{font-size:11px;font-weight:800;color:var(--muted)}

#op-abosolo-skin .abo-sector{border-top:1px solid var(--line);padding:13px 16px;display:flex;align-items:center;gap:12px;cursor:pointer}
#op-abosolo-skin .abo-sector:active{background:var(--bg)}
#op-abosolo-skin .abo-sector .si{width:38px;height:38px;min-width:38px;border-radius:11px;background:var(--sect-soft);border:1px solid var(--sect-line);display:flex;align-items:center;justify-content:center;font-size:18px}
#op-abosolo-skin .abo-sector .sm{flex:1;min-width:0}
#op-abosolo-skin .abo-sector .st-lbl{font-size:13px;font-weight:800;color:var(--ink)}
#op-abosolo-skin .abo-sector .st-val{font-size:12px;color:var(--muted);margin-top:2px}
#op-abosolo-skin .abo-sector .st-mode{font-size:11px;font-weight:800;padding:5px 10px;border-radius:999px;white-space:nowrap;background:var(--sect-soft);color:#0f766e;border:1px solid var(--sect-line)}
#op-abosolo-skin .abo-sector .chev{color:var(--line-strong);font-size:20px}

/* ============ Titres de section ============ */
#op-abosolo-skin .sec-title{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin:20px 18px 8px;display:flex;align-items:center;gap:8px}
#op-abosolo-skin .sec-title .cnt{background:var(--line);color:var(--ink-soft);font-size:11px;padding:1px 8px;border-radius:999px;font-weight:800}
#op-abosolo-skin .sec-title .ti{margin-left:auto;width:30px;height:30px;border-radius:8px;border:1px solid var(--line-strong);background:#fff;color:var(--muted);font-size:13px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center}

/* ============ Carte « Ma formule » ============ */
#op-abosolo-skin .plans{display:flex;flex-direction:column;gap:10px;margin:0 14px}
#op-abosolo-skin .plan{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;display:flex;align-items:center;gap:13px;cursor:pointer;transition:transform .08s}
#op-abosolo-skin .plan:active{transform:scale(.985)}
#op-abosolo-skin .plan.on{border-color:var(--or);background:#fffdf5;box-shadow:0 0 0 3px rgba(184,134,11,.12),var(--shadow)}
#op-abosolo-skin .plan .pico{width:46px;height:46px;min-width:46px;border-radius:14px;background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:22px}
#op-abosolo-skin .plan.on .pico{background:var(--or-soft);border:1px solid #fcd34d}
#op-abosolo-skin .plan-mid{flex:1;min-width:0}
#op-abosolo-skin .plan-name{font-size:15px;font-weight:900;color:var(--ink);display:flex;align-items:center;gap:7px}
#op-abosolo-skin .plan-name .cur{font-size:10px;font-weight:800;color:#92400e;background:var(--or-soft);border:1px solid #fcd34d;padding:2px 8px;border-radius:999px}
#op-abosolo-skin .plan-feat{font-size:12px;color:var(--muted);margin-top:2px}
#op-abosolo-skin .plan-price{text-align:right;white-space:nowrap}
#op-abosolo-skin .plan-price .pp{font-size:16px;font-weight:900;color:var(--ink);letter-spacing:-.4px}
#op-abosolo-skin .plan-price .pp.or{color:var(--or)}
#op-abosolo-skin .plan-price .ppk{font-size:10px;color:var(--muted);font-weight:700}
#op-abosolo-skin .plan-cta{margin:12px 14px 0;width:calc(100% - 28px);border:1.5px solid var(--line-strong);background:#fff;border-radius:14px;padding:14px;font-size:14px;font-weight:800;color:var(--ink-soft);cursor:pointer;font-family:inherit;min-height:44px;display:flex;align-items:center;justify-content:center;gap:9px}
#op-abosolo-skin .plan-cta:active{background:var(--bg)}

/* ============ Carte « Mon secteur » ============ */
#op-abosolo-skin .card{background:var(--card);margin:0 14px;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
#op-abosolo-skin .com-row{padding:13px 16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line)}
#op-abosolo-skin .com-row:last-of-type{border-bottom:none}
#op-abosolo-skin .com-dot{width:10px;height:10px;min-width:10px;border-radius:3px;background:var(--sect)}
#op-abosolo-skin .com-mid{flex:1;min-width:0}
#op-abosolo-skin .com-name{font-size:14px;font-weight:800;color:var(--ink)}
#op-abosolo-skin .com-meta{font-size:11px;color:var(--muted);margin-top:1px}
#op-abosolo-skin .com-tag{font-size:11px;font-weight:800;color:#0f766e;background:var(--sect-soft);border:1px solid var(--sect-line);padding:4px 9px;border-radius:999px;white-space:nowrap}
#op-abosolo-skin .sec-foot{padding:13px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#f0fdfa;border-top:1px solid var(--sect-line)}
#op-abosolo-skin .sec-foot .sft{font-size:13px;font-weight:900;color:#0f766e}
#op-abosolo-skin .sec-foot .sfk{font-size:11px;color:#0f766e;opacity:.8;font-weight:700;margin-top:1px}
#op-abosolo-skin .sec-foot .sfbtn{border:1px solid var(--sect-line);background:#fff;color:#0f766e;font-weight:800;font-size:12px;padding:9px 13px;border-radius:11px;cursor:pointer;font-family:inherit;min-height:44px}
#op-abosolo-skin .sec-foot .sfbtn:active{background:var(--sect-soft)}

/* ===== Lentille stats : ligne d'etat ===== */
#op-abosolo-skin .statlens{display:flex;align-items:center;gap:11px;background:#ecfdf9;border:1px solid var(--sect-line);border-radius:13px;padding:11px 12px;margin:10px 14px 0;width:calc(100% - 28px);cursor:pointer;text-align:left;font-family:inherit;min-height:44px}
#op-abosolo-skin .statlens .sl-ico{font-size:18px;flex:none}
#op-abosolo-skin .statlens .sl-mid{flex:1;min-width:0}
#op-abosolo-skin .statlens .sl-t{font-size:13px;font-weight:800;color:#0f766e;line-height:1.15}
#op-abosolo-skin .statlens .sl-k{font-size:11px;font-weight:700;color:#0f766e;opacity:.78;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#op-abosolo-skin .statlens.tuned{background:#ccfbf1}
#op-abosolo-skin .statlens .sl-i{flex:0 0 auto;width:44px;height:44px;border:none;background:transparent;color:#0f766e;font-size:15px;font-weight:800;cursor:pointer;font-family:inherit}

/* ===== Sheet lentille stats ===== */
#op-abosolo-skin .lens-info{display:flex;align-items:center;gap:8px;width:100%;justify-content:space-between;background:var(--sect-soft);border:1px solid var(--sect-line);border-radius:11px;padding:11px 13px;margin:4px 0 12px;color:#0f766e;font-weight:800;font-size:12.5px;cursor:pointer;font-family:inherit;min-height:44px}
#op-abosolo-skin .lens-info span{font-size:14px}
#op-abosolo-skin .lens-row{border-bottom:1px solid var(--line);padding:10px 0}
#op-abosolo-skin .lens-row:last-child{border-bottom:none}
#op-abosolo-skin .lens-row-top{display:flex;align-items:center;gap:9px}
#op-abosolo-skin .lens-dot{width:8px;height:8px;border-radius:50%;background:transparent;flex:none}
#op-abosolo-skin .lens-row.tuned .lens-dot{background:var(--sect)}
#op-abosolo-skin .lens-name{flex:1;font-weight:800;font-size:13px;color:var(--ink)}
#op-abosolo-skin .lens-seg{display:flex;background:var(--bg);border-radius:9px;padding:2px;gap:2px;flex:none}
#op-abosolo-skin .lens-seg button{border:none;background:transparent;font-family:inherit;font-weight:800;font-size:11.5px;color:var(--muted);padding:0 12px;min-height:40px;border-radius:7px;cursor:pointer}
#op-abosolo-skin .lens-seg button.on{background:#fff;color:var(--sect);box-shadow:0 1px 3px rgba(15,23,42,.12)}
#op-abosolo-skin .lens-sub{display:none;align-items:center;justify-content:space-between;margin:7px 0 0 17px;font-size:11.5px;font-weight:700;color:#0f766e}
#op-abosolo-skin .lens-row.tuned .lens-sub{display:flex}
#op-abosolo-skin .lens-choose{border:1px solid var(--sect-line);background:#fff;color:#0f766e;border-radius:8px;padding:0 11px;min-height:36px;font-weight:800;font-size:11.5px;cursor:pointer;font-family:inherit}
#op-abosolo-skin .lens-priceguard{font-size:11px;color:var(--muted);text-align:center;margin:6px 0 12px}

/* ===== Mini-carte stats ===== */
#op-abosolo-skin .cell.blindstat{opacity:1}
#op-abosolo-skin .clabel.blindstat{fill:#94a3b8;stroke:#fff}
#op-abosolo-skin .blindstat-badge{font-size:13px;pointer-events:none}
#op-abosolo-skin .lens-maphint b{color:var(--sect)}

/* ============ Carte « Facturation » ============ */
#op-abosolo-skin .bill-card{background:var(--card);margin:0 14px;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
#op-abosolo-skin .bc-row{padding:14px 16px;display:flex;align-items:center;gap:13px;border-bottom:1px solid var(--line);cursor:pointer}
#op-abosolo-skin .bc-row:last-child{border-bottom:none}
#op-abosolo-skin .bc-row.static{cursor:default}
#op-abosolo-skin .bc-row:active:not(.static){background:var(--bg)}
#op-abosolo-skin .bc-ico{width:40px;height:40px;min-width:40px;border-radius:11px;background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:18px}
#op-abosolo-skin .bc-mid{flex:1;min-width:0}
#op-abosolo-skin .bc-lbl{font-size:13px;font-weight:800;color:var(--ink)}
#op-abosolo-skin .bc-val{font-size:12px;color:var(--muted);margin-top:2px}
#op-abosolo-skin .bc-right{font-size:13px;font-weight:900;color:var(--ink);white-space:nowrap}
#op-abosolo-skin .bc-right.or{color:var(--or)}
#op-abosolo-skin .bc-chev{color:var(--line-strong);font-size:20px}
#op-abosolo-skin .cb-pill{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:800;color:var(--ink)}
#op-abosolo-skin .cb-pill .brand{font-size:10px;font-weight:900;color:#1a1f71;background:#e8eaf6;border:1px solid #c5cae9;padding:2px 7px;border-radius:6px;letter-spacing:.3px}

/* ============ Carte « Passer en mode agence » ============ */
#op-abosolo-skin .agency-bridge{margin:18px 14px 0;background:linear-gradient(135deg,#1e1b4b,#312e81);color:#fff;border:none;width:calc(100% - 28px);border-radius:var(--radius);padding:16px;display:flex;align-items:center;gap:14px;cursor:pointer;box-shadow:var(--shadow);text-align:left;font-family:inherit}
#op-abosolo-skin .agency-bridge:active{filter:brightness(1.12)}
#op-abosolo-skin .ab-ico{width:46px;height:46px;min-width:46px;border-radius:13px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;font-size:24px}
#op-abosolo-skin .ab-main{flex:1}
#op-abosolo-skin .ab-title{font-size:15px;font-weight:800}
#op-abosolo-skin .ab-sub{font-size:12px;color:#c7d2fe;margin-top:2px}
#op-abosolo-skin .ab-arrow{font-size:22px;color:#c7d2fe;font-weight:700}

/* ============ Note valeur (bronze) ============ */
#op-abosolo-skin .heritage{margin:14px;background:var(--or-soft);border:1px solid #fcd34d;border-radius:14px;padding:13px 14px;display:flex;gap:11px;align-items:flex-start}
#op-abosolo-skin .heritage .ico{font-size:18px;line-height:1.2}
#op-abosolo-skin .heritage .txt{font-size:12px;color:#854d0e;font-weight:600}
#op-abosolo-skin .heritage .txt b{color:#713f12;font-weight:800}

#op-abosolo-skin .gate{text-align:center;font-size:11px;color:var(--muted);padding:18px 24px 8px;line-height:1.6}
#op-abosolo-skin .gate b{color:var(--ink-soft)}
#op-abosolo-skin .stamp{text-align:center;font-size:10px;color:#94a3b8;font-weight:700;padding:0 24px 16px;letter-spacing:.3px}

/* ============ Sheet (bottom) — bornees au skin ============ */
/* AFFICHAGE (lecon fiche) : un panneau ouvert doit passer AU-DESSUS de tous les
   controles du HUB (top bar z40, demobar z10050, overlays z10060). On monte le
   scrim a 10075 (sous le paywall plein-ecran z10080, qui est un verrou d'etat).
   Le look reste verbatim ; seul l'empilement change. */
#op-abosolo-skin .scrim{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:10075;opacity:0;pointer-events:none;transition:opacity .22s;display:flex;align-items:flex-end;justify-content:center}
#op-abosolo-skin .scrim.show{opacity:1;pointer-events:auto}
#op-abosolo-skin .sheet{width:100%;max-width:430px;background:var(--card);border-radius:22px 22px 0 0;padding:8px 18px calc(22px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .26s cubic-bezier(.22,1,.36,1);max-height:92vh;overflow-y:auto}
#op-abosolo-skin .scrim.show .sheet{transform:translateY(0)}
#op-abosolo-skin .grab{width:42px;height:5px;border-radius:99px;background:var(--line-strong);margin:6px auto 14px}
#op-abosolo-skin .sheet-head{display:flex;align-items:center;gap:13px;margin-bottom:6px}
#op-abosolo-skin .sheet-title{font-size:18px;font-weight:900;letter-spacing:-.3px;flex:1}
#op-abosolo-skin .sheet-sub{font-size:13px;color:var(--muted);margin:-2px 0 16px}

#op-abosolo-skin .bill{background:var(--bg);border-radius:14px;padding:4px 14px;margin:4px 0 14px}
#op-abosolo-skin .bill-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:13px}
#op-abosolo-skin .bill-row:last-child{border-bottom:none}
#op-abosolo-skin .bill-row .bl{color:var(--ink-soft);font-weight:600}
#op-abosolo-skin .bill-row .bl small{display:block;color:var(--muted);font-size:11px;font-weight:600;margin-top:1px}
#op-abosolo-skin .bill-row .bv{font-weight:800;color:var(--ink);white-space:nowrap}
#op-abosolo-skin .bill-row.now .bl{color:var(--ink);font-weight:800}
#op-abosolo-skin .bill-row.now .bv{color:var(--or);font-size:18px}
#op-abosolo-skin .bill-row.next .bv{color:var(--muted)}

#op-abosolo-skin .leave-note{background:var(--or-soft);border:1px solid #fcd34d;border-radius:14px;padding:14px;margin:6px 0 16px}
#op-abosolo-skin .leave-note .lt{font-size:13px;font-weight:800;color:#713f12;display:flex;align-items:center;gap:7px;margin-bottom:8px}
#op-abosolo-skin .leave-note .lp{font-size:12.5px;color:#854d0e;font-weight:600;margin:0 0 8px}
#op-abosolo-skin .leave-note .lp:last-child{margin-bottom:0}
#op-abosolo-skin .leave-note .tag{display:inline-block;background:#fff;border:1px solid #fcd34d;color:#854d0e;font-size:11px;font-weight:800;padding:3px 9px;border-radius:8px}

#op-abosolo-skin .btn{width:100%;border:none;border-radius:14px;padding:16px;font-size:15px;font-weight:800;cursor:pointer;font-family:inherit;margin-top:8px;min-height:44px}
#op-abosolo-skin .btn-primary{background:var(--indigo);color:#fff}
#op-abosolo-skin .btn-primary:active{background:#4338ca}
#op-abosolo-skin .btn-pro{background:var(--pro);color:#fff}
#op-abosolo-skin .btn-or{background:var(--or);color:#fff}
#op-abosolo-skin .btn-or:active{filter:brightness(1.08)}
#op-abosolo-skin .btn-ghost{background:var(--bg);color:var(--ink-soft)}
#op-abosolo-skin .gate-mini{font-size:11px;color:var(--muted);text-align:center;margin-top:14px;border-top:1px solid var(--line);padding-top:12px}

#op-abosolo-skin .planpick{width:100%;display:flex;align-items:flex-start;gap:13px;border:2px solid var(--line-strong);background:#fff;border-radius:16px;padding:15px 14px;cursor:pointer;text-align:left;font-family:inherit;margin-bottom:11px;min-height:44px}
#op-abosolo-skin .planpick.on{border-color:var(--or);background:#fffdf5}
#op-abosolo-skin .planpick .mradio{width:24px;height:24px;min-width:24px;border-radius:50%;border:2px solid var(--line-strong);margin-top:2px;display:flex;align-items:center;justify-content:center}
#op-abosolo-skin .planpick.on .mradio{border-color:var(--or);background:var(--or)}
#op-abosolo-skin .planpick.on .mradio::after{content:"";width:9px;height:9px;border-radius:50%;background:#fff}
#op-abosolo-skin .planpick .mc{flex:1}
#op-abosolo-skin .planpick .mct{font-size:15px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:8px}
#op-abosolo-skin .planpick .mcprice{margin-left:auto;font-size:13px;font-weight:900;color:var(--or)}
#op-abosolo-skin .planpick .mcs{font-size:12px;color:var(--muted);margin-top:3px;line-height:1.45}

#op-abosolo-skin .flow{display:flex;align-items:center;gap:8px;margin:14px 0;justify-content:center}
#op-abosolo-skin .flow .node{flex:1;text-align:center;background:var(--bg);border-radius:12px;padding:11px 6px}
#op-abosolo-skin .flow .node.before{background:#fffbeb;border:1px solid #fcd34d}
#op-abosolo-skin .flow .node.after{background:var(--indigo-soft);border:1px solid #c7d2fe}
#op-abosolo-skin .flow .node .fn{font-size:12px;font-weight:800;color:var(--ink)}
#op-abosolo-skin .flow .node .fs{font-size:10px;color:var(--muted);margin-top:2px}
#op-abosolo-skin .flow .arr{color:var(--line-strong);font-size:18px;font-weight:800}

/* ============ Carte de secteur (mock SVG) ============ */
#op-abosolo-skin .map-toolbar{display:flex;align-items:center;gap:8px;margin:2px 0 10px}
#op-abosolo-skin .map-zoom{display:flex;background:var(--bg);border-radius:11px;padding:3px;gap:3px;flex:1}
#op-abosolo-skin .map-zoom button{flex:1;border:none;background:transparent;padding:9px 6px;border-radius:8px;font-weight:800;font-size:12px;color:var(--muted);cursor:pointer;font-family:inherit;min-height:42px}
#op-abosolo-skin .map-zoom button.on{background:#fff;color:var(--sect);box-shadow:0 1px 3px rgba(15,23,42,.12)}
#op-abosolo-skin .map-zoom button .zsub{display:block;font-size:9px;font-weight:700;color:var(--muted);margin-top:1px}
#op-abosolo-skin .map-zoom button.on .zsub{color:#0f766e}
#op-abosolo-skin .secmap{background:linear-gradient(180deg,#eef2f7,#e6edf5);border:1px solid var(--line);border-radius:16px;height:300px;position:relative;overflow:hidden;box-shadow:var(--shadow)}
#op-abosolo-skin .secmap svg{width:100%;height:100%;display:block}
#op-abosolo-skin .cell{cursor:pointer;transition:fill .15s,stroke .15s,opacity .15s}
#op-abosolo-skin .clabel{font-size:9px;font-weight:800;fill:var(--ink);pointer-events:none;paint-order:stroke;stroke:#fff;stroke-width:2.2px}
#op-abosolo-skin .clabel.on{fill:#fff;stroke:rgba(15,23,42,.4)}
#op-abosolo-skin .maphint{position:absolute;left:9px;bottom:9px;right:9px;background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:10px;padding:7px 11px;font-size:11px;font-weight:700;color:var(--ink-soft);pointer-events:none;display:flex;align-items:center;gap:7px}
#op-abosolo-skin .maphint b{color:var(--sect)}
#op-abosolo-skin .seclegend{display:flex;gap:14px;flex-wrap:wrap;margin:10px 2px 4px;font-size:11px;font-weight:700;color:var(--muted)}
#op-abosolo-skin .seclegend span{display:flex;align-items:center;gap:6px}
#op-abosolo-skin .seclegend i{width:13px;height:13px;border-radius:4px;display:inline-block}
#op-abosolo-skin .lg-mine{background:var(--sect)}
#op-abosolo-skin .lg-free{background:#fff;border:2px dashed var(--line-strong)}
#op-abosolo-skin .lg-out{background:#e2e8f0}
#op-abosolo-skin .seccount{background:var(--sect-soft);border:1px solid var(--sect-line);border-radius:13px;padding:12px 14px;margin:12px 0 2px;display:flex;align-items:center;justify-content:space-between;gap:12px}
#op-abosolo-skin .seccount .scn{font-size:19px;font-weight:900;color:#0f766e;letter-spacing:-.4px}
#op-abosolo-skin .seccount .scn b{font-size:13px;font-weight:800}
#op-abosolo-skin .seccount .sck{font-size:11px;font-weight:700;color:#0f766e;opacity:.8;text-transform:uppercase;letter-spacing:.3px;margin-top:1px}
#op-abosolo-skin .seccount .scpct{font-size:13px;font-weight:800;color:#0f766e;background:#fff;border:1px solid var(--sect-line);padding:6px 11px;border-radius:999px;white-space:nowrap}

#op-abosolo-skin .prorata-note{background:var(--or-soft);border:1px solid #fcd34d;border-radius:13px;padding:11px 13px;margin:10px 0 2px;display:flex;gap:10px;align-items:flex-start}
#op-abosolo-skin .prorata-note .pi{font-size:17px;line-height:1.2}
#op-abosolo-skin .prorata-note .pt{font-size:12.5px;color:#854d0e;font-weight:600;line-height:1.45}
#op-abosolo-skin .prorata-note .pt b{color:#713f12;font-weight:800}

/* toast — borne au skin (au-dessus des sheets/controles, transitoire) */
#op-abosolo-skin .toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:13px 20px;border-radius:14px;font-size:13px;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:all .25s;z-index:10090;display:flex;align-items:center;gap:9px;max-width:380px}
#op-abosolo-skin .toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#op-abosolo-skin .toast .ti{width:8px;height:8px;border-radius:50%;background:var(--pro)}
