/* Simulateur « pipeline inversé » : un outil, dans l'esprit du tableau de bord CRM du site
   (fenêtre façon Notion, contour liquid glass, calcul en direct). Mobile d'abord. */
.sim { --ink:#292929; --navy:#1c3a6c; --sky:#E8EEF7; --sky2:#CCD9EE;
  --n-ink:#24231f; --n-txt:#37352f; --n-soft:#6d6b65; --n-mute:#9a9892; --n-line:#efefeb; --n-line2:#e8e7e2; --n-bg:#f7f7f5;
  --ff-n:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI Variable Display","Segoe UI",Helvetica,"Apple Color Emoji",Arial,sans-serif;
  background:#f5f5f5; color:var(--ink); font-family:'Inter',-apple-system,sans-serif; }
.sim *, .sim *::before, .sim *::after { box-sizing:border-box; }
.sim [hidden] { display:none !important; }
.sim p { margin:0; }
.sim-in { max-width:1180px; margin:0 auto; padding:0 12px; }

/* En-tête de page */
.sim-top { padding:104px 0 28px; text-align:center; }
.sim-top .sim-in { padding:0 20px; }
.sim-kicker { font-size:14px; font-weight:600; color:var(--navy); }
.sim h1 { margin:12px auto 0; max-width:820px; font-size:32px; line-height:1.1; font-weight:800; letter-spacing:-.04em; }
.sim-lead { margin:16px auto 0 !important; max-width:600px; font-size:16px; line-height:1.6; color:#666; }

/* Scène bleu ciel + bandes diagonales, comme le hero CRM */
.sim-stage { padding:0 0 64px; }
.sim-stage > .sim-in { position:relative; overflow:hidden; isolation:isolate; padding:18px 10px; border-radius:16px; background:var(--sky); }
.sim-stage > .sim-in::before, .sim-stage > .sim-in::after { content:''; position:absolute; top:-10%; height:120%; z-index:-1; background:rgba(255,255,255,.45); transform:skewX(-24deg); }
.sim-stage > .sim-in::before { left:22%; width:160px; }
.sim-stage > .sim-in::after { right:10%; width:80px; background:rgba(255,255,255,.3); }

/* Fenêtre : contour liquid glass */
.app { font-family:var(--ff-n); color:var(--n-txt); border:10px solid transparent; border-radius:24px; overflow:hidden;
  background:linear-gradient(#fff,#fff) padding-box,
    radial-gradient(90% 60% at 0% 0%,rgba(255,255,255,.6) 0%,rgba(255,255,255,0) 30%) border-box,
    radial-gradient(90% 60% at 100% 100%,rgba(255,255,255,.45) 0%,rgba(255,255,255,0) 28%) border-box,
    linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.02) 50%,rgba(28,58,108,.05)) border-box;
  -webkit-backdrop-filter:blur(7px) saturate(180%) brightness(1.04); backdrop-filter:blur(7px) saturate(180%) brightness(1.04);
  outline:1px solid rgba(255,255,255,.95); outline-offset:-10px;
  box-shadow:0 0 0 1px rgba(255,255,255,.85),0 0 0 2px rgba(28,58,108,.06),0 40px 80px -30px rgba(28,58,108,.4),0 14px 30px -16px rgba(28,58,108,.22); }
.app-bar { height:42px; display:flex; align-items:center; gap:10px; padding:0 14px; background:var(--n-bg); border-bottom:1px solid var(--n-line2); }
.app-logo { height:13px !important; width:auto !important; max-width:none !important; }
.app-title { flex:1; text-align:center; font-size:13px; color:#88857e; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app-live { display:inline-flex; align-items:center; gap:6px; flex:none; font-size:11px; color:#1B3A6B; background:#e8edf5; padding:4px 10px 4px 8px; border-radius:999px; }
.app-live i { width:7px; height:7px; border-radius:50%; background:#3fbf7f; box-shadow:0 0 0 3px rgba(63,191,127,.2); }
.app-shell { display:block; }
.app-side { display:none; }
.app-main { min-width:0; background:#fff; }
.app-top { min-height:44px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 14px; border-bottom:1px solid var(--n-line); }
.crumbs { display:flex; align-items:center; gap:7px; font-size:13.5px; color:var(--n-soft); white-space:nowrap; overflow:hidden; }
.crumbs b { color:#30302c; font-weight:600; }
.ava { display:inline-flex; }
.ava img { width:24px; height:24px; border-radius:50%; border:1.5px solid #fff; margin-left:-7px; object-fit:cover; max-width:none !important; }
.ava img:first-child { margin-left:0; }
.app-tabs { display:flex; gap:6px; padding:10px 14px 8px; border-bottom:1px solid var(--n-line); overflow-x:auto; scrollbar-width:none; }
.app-tabs::-webkit-scrollbar { display:none; }
.tab { flex:none; height:30px; padding:0 12px; border-radius:9px; border:1px solid transparent; background:#fff; color:#696763; font:13px var(--ff-n); cursor:pointer; }
.tab:hover { background:var(--n-bg); }
.tab.is-active { border-color:#ecebe8; background:#f6f6f4; color:#2a2925; font-weight:500; }
.view { padding:18px 14px 22px; }
.page-t { display:flex; align-items:center; gap:10px; margin:2px 0 14px; font:700 26px/1.1 var(--ff-n); letter-spacing:-.035em; color:var(--n-ink); }
.page-t span { font-size:22px; }
.page-d { margin:-6px 0 14px !important; font-size:14px; line-height:1.55; color:var(--n-soft); }

/* Propriétés façon Notion */
.props { display:grid; gap:2px; margin-bottom:14px; }
.prop { display:grid; grid-template-columns:1fr; gap:4px; padding:6px 0; }
.prop label { display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--n-soft); }
.prop label svg { width:16px; height:16px; flex:none; fill:none; stroke:var(--n-mute); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.pv { display:flex; align-items:center; gap:6px; min-height:36px; padding:0 10px; border-radius:7px; background:var(--n-bg); border:1px solid transparent; transition:border-color .15s, background .15s; }
.pv:hover { background:#f1f1ef; }
.pv:focus-within { background:#fff; border-color:#a9bfe3; box-shadow:0 0 0 3px rgba(35,131,226,.12); }
.pv input, .pv select { flex:1; min-width:0; width:100%; height:34px !important; min-height:0 !important; padding:0 !important; border:0 !important; background:transparent !important; box-shadow:none !important; font:500 15px var(--ff-n) !important; color:var(--n-ink); -webkit-appearance:none; appearance:none; border-radius:0 !important; }
.pv input:focus, .pv select:focus { outline:none; }
.pv input::placeholder { color:#b4b2ab; font-weight:400; }
.pv select { cursor:pointer; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239a9892' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") right 0 center no-repeat !important; }
.pv select:invalid { color:#b4b2ab; }
.pv select option { color:var(--n-ink); }
.pv .u { flex:none; font-size:14px; color:var(--n-mute); }
.prop.is-err .pv { border-color:#e5a49d; background:#fdf3f2; }
.sim-tip { position:relative; display:inline-grid; place-items:center; width:16px; height:16px; margin-left:2px; border-radius:50%; border:1.3px solid var(--n-mute); color:var(--n-mute); font-size:10px; font-weight:700; line-height:1; cursor:help; }
.sim-tip span { position:absolute; left:50%; bottom:calc(100% + 8px); transform:translateX(-50%); width:220px; padding:9px 11px; border-radius:8px; background:#2f2f2f; color:#fff; font-size:12px; line-height:1.45; opacity:0; pointer-events:none; transition:opacity .15s; z-index:5; }
.sim-tip:hover span, .sim-tip:focus span { opacity:1; }
.sim-errs { margin:6px 0 0; padding:0; list-style:none; }
.sim-errs li { font-size:13px; line-height:1.6; color:#c4554d; }
.sim-err { margin:2px 0 0 !important; font-size:12.5px; color:#c4554d; }
.sim-err:empty { display:none; }
.sim-info-msg { margin:2px 0 0 !important; font-size:12.5px; color:#9A6F1E; }
.sim-info-msg:empty { display:none; }
.sim-check { display:flex; gap:10px; align-items:flex-start; margin-top:10px; font-size:13px; line-height:1.55; color:var(--n-soft); cursor:pointer; }
.sim-check input { flex:none; width:16px; height:16px; margin-top:2px; accent-color:var(--navy); }
.sim-check a { color:var(--n-ink); }

/* Cartes de chiffres, comme le tableau de bord du site */
.kpis { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:6px 0 12px; }
.kpi { background:#fafaf9; border:1px solid #eae9e4; border-radius:10px; padding:12px 14px 11px; min-width:0; }
.k-l { font-size:12.5px; color:var(--n-soft); }
.k-n { margin-top:6px !important; font:600 26px/1 var(--ff-n); letter-spacing:-.035em; color:var(--n-ink); font-variant-numeric:tabular-nums; white-space:nowrap; }
.k-n.is-empty { font-size:15px; font-weight:500; letter-spacing:0; color:#b4b2ab; }
.k-s { margin-top:6px !important; font-size:12px; line-height:1.4; color:var(--n-mute); }
.kpi--hl { background:var(--navy); border-color:var(--navy); }
.kpi--hl .k-l { color:#c9d6ee; } .kpi--hl .k-n { color:#fff; } .kpi--hl .k-s { color:rgba(255,255,255,.6); } .kpi--hl .k-n.is-empty { color:rgba(255,255,255,.45); }
.kpi--ok { background:#edf8f1; border-color:#cdeedb; }
.kpi--ok .k-n { color:#1e7b4b; }

/* Encarts */
.callout { display:flex; gap:10px; align-items:flex-start; margin:4px 0 14px; padding:12px 14px; border-radius:8px; background:#f1f1ef; font-size:14px; line-height:1.55; color:var(--n-txt); }
.callout .ci { flex:none; font-size:16px; line-height:1.4; }
.callout a { color:var(--n-ink); font-weight:600; text-decoration:underline; text-decoration-color:#c5c3bc; text-underline-offset:3px; }
.callout--ok { background:#edf8f1; }

/* Tableaux façon base de données */
.db-h { display:flex; justify-content:space-between; align-items:center; margin:18px 0 6px; padding-bottom:6px; border-bottom:1px solid var(--n-line); font:600 14px var(--ff-n); color:#30302c; }
.tbl-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.tbl { width:100%; border-collapse:collapse; font-size:13.5px; }
.tbl th { text-align:left; font-weight:400; font-size:12.5px; color:var(--n-mute); padding:7px 10px; border-bottom:1px solid var(--n-line); white-space:nowrap; }
.tbl td { padding:8px 10px; border-bottom:1px solid var(--n-line); color:var(--n-txt); vertical-align:top; line-height:1.45; }
.tbl th + th, .tbl td + td { border-left:1px solid var(--n-line); }
.tbl--plan td, .tbl--plan th { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.tbl--plan td:first-child, .tbl--plan th:first-child { text-align:left; }
.tbl td.empty { text-align:left; color:var(--n-mute); }
.tbl--cost td:last-child { text-align:right; white-space:nowrap; font-weight:500; font-variant-numeric:tabular-nums; }
.tbl--cost tr.tot td { font-weight:600; color:var(--n-ink); background:var(--n-bg); }
.tbl--cmp td:first-child { color:var(--n-soft); white-space:nowrap; }
.tbl--cmp td { font-variant-numeric:tabular-nums; }
.pill { display:inline-block; padding:1px 8px; border-radius:5px; font-size:13px; line-height:1.6; white-space:nowrap; }
.pill--grey { background:#eeeeec; color:#4f4e4a; }
.pill--blue { background:#e3ecf8; color:#1B3A6B; }
.pill--red { background:#fbe6e4; color:#9c3a32; }
.pill--green { background:#e2f4ea; color:#1e7b4b; }
.foot { margin-top:10px !important; font-size:12px; line-height:1.55; color:var(--n-mute); }

/* Boutons */
.app-btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; margin-top:16px; min-height:40px; padding:0 16px; border-radius:8px; border:1px solid #e2e2dc; background:#fff; color:#2a2925 !important; font:500 14px var(--ff-n); text-decoration:none; cursor:pointer; transition:background .15s; }
.app-btn:hover { background:var(--n-bg); }
.app-btn--dark { background:#0d0d0d; border-color:#0d0d0d; color:#fff !important; }
.app-btn--dark:hover { background:#2e2e2e; }
.app-btn:disabled { opacity:.6; cursor:wait; }

/* Rapport imprimable */
.sim-doc { padding:0 0 72px; }
.rapport { max-width:880px; margin:0 auto; padding:26px 18px; background:#fff; border-radius:12px; border:1px solid #eae9e4; font-family:var(--ff-n); color:var(--n-txt); box-shadow:0 24px 50px -34px rgba(16,24,40,.35); }
.rp-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding-bottom:14px; margin-bottom:18px; border-bottom:1px solid var(--n-line); }
.rp-head img { height:20px; width:auto; }
.rp-head p { font-size:12.5px; line-height:1.5; color:var(--n-mute); text-align:right; }
.rp-actions { display:flex; flex-wrap:wrap; gap:10px; }

@media (min-width:760px) {
  .sim-top { padding:140px 0 40px; }
  .sim h1 { font-size:50px; }
  .sim-lead { font-size:18px; }
  .sim-in { padding:0 32px; }
  .sim-stage > .sim-in { padding:56px 64px; border-radius:12px; }
  .app { border-width:16px; border-radius:32px; outline-offset:-16px; }
  .app-shell { display:grid; grid-template-columns:210px minmax(0,1fr); min-height:640px; }
  .app-side { display:flex; flex-direction:column; gap:2px; padding:12px 10px; background:var(--n-bg); border-right:1px solid #ecece7; }
  .side-lab { margin:12px 8px 6px !important; font-size:12px; color:var(--n-mute); }
  .side-lab:first-child { margin-top:2px !important; }
  .side-link { display:flex; align-items:center; gap:8px; height:30px; padding:0 10px; border:0; border-radius:7px; background:none; font:13.5px var(--ff-n); color:#54524d; text-align:left; text-decoration:none; cursor:pointer; }
  .side-link:hover { background:#efefed; }
  .side-link.is-active { background:#ecebe8; color:#24231f; font-weight:500; }
  .side-link .ic { width:18px; text-align:center; }
  .app-top { padding:0 22px; }
  .app-tabs { padding:12px 22px 8px; }
  .view { padding:22px 28px 30px; }
  .page-t { font-size:32px; }
  .prop { grid-template-columns:240px minmax(0,1fr); align-items:center; gap:12px; padding:3px 0; }
  .prop .sim-err, .prop .sim-info-msg { grid-column:2; }
  .kpis { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .kpis--3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .k-n { font-size:30px; }
  .rapport { padding:40px 48px; }
  .rapport .kpis { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (min-width:1100px) { .sim-in { padding:0 110px; } }

/* Impression / PDF : seul le rapport */
@media print {
  @page { size:A4; margin:12mm; }
  body * { visibility:hidden !important; }
  #simRapport, #simRapport * { visibility:visible !important; }
  #simRapport { position:absolute; left:0; top:0; width:100%; max-width:none; margin:0; padding:0 4px; border:0; box-shadow:none; }
  #simRapport .rp-actions { display:none !important; }
  .rapport .kpis { grid-template-columns:repeat(4,1fr) !important; }
  .kpi, .kpi--hl, .kpi--ok, .pill, .tbl--cost tr.tot td { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .tbl--plan, .tbl--cmp { break-inside:avoid; }
  .db-h { break-after:avoid; }
}

/* Bloc d'appel sur l'accueil */
.sim-promo-sec { padding:24px 16px 8px; background:#f5f5f5; }
.sim-promo { position:relative; overflow:hidden; isolation:isolate; max-width:1220px; margin:0 auto; border-radius:20px; background:var(--navy,#1c3a6c); color:#fff; padding:26px 20px; display:flex; flex-direction:column; gap:16px; font-family:'Inter',-apple-system,sans-serif; }
.sim-promo::before { content:''; position:absolute; top:-10%; left:58%; width:260px; height:120%; z-index:-1; background:rgba(255,255,255,.06); transform:skewX(-24deg); }
.sim-promo p { margin:0; }
.sim-promo .sp-k { font-size:13px; font-weight:600; color:#9db6e6; }
.sim-promo .sp-t { margin-top:6px; font-size:22px; line-height:1.3; font-weight:700; letter-spacing:-.015em; }
.sim-promo .sp-s { margin-top:8px; font-size:14.5px; line-height:1.55; color:rgba(255,255,255,.72); }
.sim-promo a { flex:none; display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:50px; padding:0 24px; border-radius:12px; background:#fff; color:#0d0d0d !important; font-size:15px; font-weight:600; text-decoration:none; }
.sim-promo a:hover { background:#e9edf5; }

@media (min-width:760px) {
  .sim-promo-sec { padding:28px 110px 8px; }
  .sim-promo { flex-direction:row; align-items:center; justify-content:space-between; gap:32px; padding:34px 40px; }
}
.sim-promo, .sim-promo * { font-family:'Inter',-apple-system,sans-serif !important; }
/* Comparatif sur mobile : chaque critère, puis les deux valeurs côte à côte */
@media (max-width:759px) {
  .tbl--cmp thead { display:none; }
  .tbl--cmp, .tbl--cmp tbody, .tbl--cmp tfoot { display:block; }
  .tbl--cmp tr { display:grid; grid-template-columns:1fr 1fr; column-gap:10px; padding:9px 0; border-bottom:1px solid var(--n-line); }
  .tbl--cmp td { padding:2px 0; border:0 !important; white-space:normal; }
  .tbl--cmp td:first-child { grid-column:1 / -1; font-size:12.5px; color:var(--n-mute); }
  .tbl--cmp td[data-h]::before { content:attr(data-h); display:block; font-size:11px; color:var(--n-mute); margin-bottom:1px; }
  .tbl--cmp td.eco { grid-column:1 / -1; }
}
@media (max-width:759px) { .kpis--3 .kpi--ok { grid-column:1 / -1; } }
/* Police de Notion partout dans le simulateur, y compris dans les champs (une règle du site impose sinon system-ui) */
.sim, .sim h1, .sim .sim-lead, .sim .sim-kicker,
.sim .app input, .sim .app select, .sim .app button, .sim .app textarea,
.sim .rapport, .sim .rapport * { font-family:var(--ff-n) !important; }
.sim h1 { letter-spacing:-.03em; font-weight:700; }

/* ═══ DA Notion (couleurs, bordures, graphiques, étiquettes) ═══ */
.sim { --n-ink:#37352f; --n-txt:#37352f; --n-soft:#787774; --n-mute:#9b9a97; --n-line:#e9e9e7; --n-line2:#e9e9e7; --n-bg:#f7f7f5; }
.app-bar { height:38px; gap:12px; background:#f7f7f5; border-bottom:1px solid #e9e9e7; }
.tl { display:flex; gap:7px; flex:none; }
.tl i { width:11px; height:11px; border-radius:50%; background:#ff5f57; }
.tl i:nth-child(2) { background:#febc2e; } .tl i:nth-child(3) { background:#28c840; }
.app-tabname { display:flex; align-items:center; gap:7px; flex:1; min-width:0; font-size:13px; color:#37352f; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app-live { background:#e7f3f8; color:#0b6e99; }
.app-live i { background:#0f7b6c; box-shadow:0 0 0 3px rgba(15,123,108,.15); }
.crumbs { gap:6px; font-size:14px; color:#37352f; }
.crumbs b { font-weight:400; color:#37352f; }
.crumbs .sep { color:#c7c6c4; }
.cr-ws { display:inline-flex; align-items:center; gap:6px; }
.cr-ws img, .side-ws img { width:14px; height:auto; max-width:none !important; opacity:.85; }
.app-who { display:flex; align-items:center; gap:12px; font-size:14px; color:#9b9a97; white-space:nowrap; }
.app-who .mod, .app-who .share, .app-who .ico { display:none; }
.share { align-items:center; gap:6px; color:#37352f; }
.share svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; }
.ico { color:#37352f; font-size:16px; }
.app-side { font-size:14px; }
.side-search { display:flex; align-items:center; gap:8px; height:32px; margin-bottom:8px; padding:0 10px; border:1px solid #e9e9e7; border-radius:8px; background:#fff; color:#9b9a97; font-size:13.5px; }
.side-search svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }
.side-search kbd { margin-left:auto; font:11px var(--ff-n); color:#b4b4b0; }
.side-ws { display:flex; align-items:center; gap:8px; height:30px; padding:0 10px; font-size:14px; font-weight:500; color:#37352f; }
.side-link { font-size:14px !important; color:#5f5e5b !important; }
.side-link.is-active { background:rgba(55,53,47,.08) !important; color:#37352f !important; }
.tab { font-size:14px !important; color:#787774; }
.tab.is-active { background:rgba(55,53,47,.06); border-color:transparent; color:#37352f; }
.page-t { font-size:30px; font-weight:700; letter-spacing:-.02em; color:#37352f; }
.prop label { font-size:14px; color:#787774; }
.pv { background:transparent; border-color:transparent; border-radius:4px; }
.pv:hover { background:rgba(55,53,47,.06); }
.pv:focus-within { background:#fff; border-color:#e9e9e7; box-shadow:0 0 0 1px rgba(35,131,226,.57), 0 0 0 4px rgba(35,131,226,.25); }
.pv input, .pv select { font-weight:400 !important; font-size:14.5px !important; color:#37352f; }
.pv input::placeholder { color:#c7c6c4; }

/* En-têtes de blocs (petite horloge + titre gris, comme les graphiques Notion) */
.blk-h { display:flex; align-items:center; gap:7px; margin:20px 0 8px !important; font-size:14px; font-weight:500; color:#5f5e5b; }
.blk-h svg { width:15px; height:15px; fill:none; stroke:#9b9a97; stroke-width:1.7; stroke-linecap:round; }

/* Cartes « nombre » : blanches, bordure fine */
.kpis { gap:12px; margin:0 0 6px; }
.kpi { background:#fff; border:1px solid #e9e9e7; border-radius:10px; padding:14px 16px 13px; box-shadow:0 1px 2px rgba(15,15,15,.03); }
.k-l { font-size:13px; color:#787774; }
.k-n { font-weight:600; color:#37352f; }
.k-s { color:#9b9a97; }
.kpi--main { border-color:#d3e5ef; background:#f4f9fc; }
.kpi--main .k-n { color:#0b6e99; }
.kpi--ok { background:#f2f9f5; border-color:#d5ebde; }
.kpi--ok .k-n { color:#0f7b6c; }

/* Graphique à barres horizontales, façon Notion */
.chart { position:relative; padding:18px 18px 12px; border:1px solid #e9e9e7; border-radius:10px; background:#fff; box-shadow:0 1px 2px rgba(15,15,15,.03); }
.chart-empty { padding:36px 0; text-align:center; font-size:14px; color:#787774; }
.ch-rows { position:relative; display:grid; gap:12px; }
.ch-row { display:grid; grid-template-columns:110px minmax(0,1fr); align-items:center; gap:10px; }
.ch-lab { font-size:12.5px; color:#5f5e5b; text-align:right; line-height:1.3; }
.ch-track { position:relative; height:18px; }
.ch-bar { position:absolute; left:0; top:3px; height:12px; border-radius:2px; min-width:3px; transition:width .35s ease; }
.ch-val { position:absolute; top:0; font-size:12.5px; color:#5f5e5b; white-space:nowrap; font-variant-numeric:tabular-nums; transform:translateX(8px); }
.ch-axis { display:grid; grid-template-columns:110px minmax(0,1fr); gap:10px; margin-top:10px; }
.ch-ticks { position:relative; height:16px; border-top:1px solid #e9e9e7; }
.ch-ticks span { position:absolute; top:4px; font-size:11.5px; color:#9b9a97; transform:translateX(-50%); white-space:nowrap; font-variant-numeric:tabular-nums; }
.ch-grid { position:absolute; inset:0 0 0 120px; pointer-events:none; }
.ch-grid i { position:absolute; top:-6px; bottom:-6px; border-left:1px dashed #efefed; }
.c-purple { background:#c48edb; } .c-pink { background:#e283b1; } .c-orange { background:#e9946a; } .c-blue { background:#6ea7e6; } .c-red { background:#e7776d; } .c-brown { background:#c49a7c; } .c-green { background:#5fb59a; }

/* Étiquettes aux couleurs Notion */
.pill { border-radius:4px; font-size:13px; padding:0 7px; line-height:1.55; }
.pill--grey { background:#e3e2e0; color:#32302c; }
.pill--blue { background:#d3e5ef; color:#0b6e99; }
.pill--red { background:#ffe2dd; color:#c4554d; }
.pill--green { background:#dbeddb; color:#0f7b6c; }
.pill--purple { background:#e8deee; color:#6940a5; }

/* Tableaux base de données */
.db-h { font-size:14px; font-weight:600; color:#37352f; border-bottom:0; margin:22px 0 4px; }
.tbl { font-size:14px; border-top:1px solid #e9e9e7; }
.tbl th { font-size:13px; color:#787774; padding:8px 10px; border-bottom:1px solid #e9e9e7; }
.tbl td { padding:8px 10px; border-bottom:1px solid #e9e9e7; color:#37352f; }
.tbl th + th, .tbl td + td { border-left:1px solid #e9e9e7; }
.callout { background:#f1f1ef; border-radius:4px; color:#37352f; }
.app-btn { border-radius:6px; border-color:#e9e9e7; font-size:14px; color:#37352f !important; box-shadow:0 1px 2px rgba(15,15,15,.05); }
.app-btn--dark { background:#2383e2; border-color:#2383e2; color:#fff !important; }
.app-btn--dark:hover { background:#0077d4; }
.rapport { border-radius:10px; }

@media (min-width:760px) {
  .app-who .mod, .app-who .share, .app-who .ico { display:inline-flex; }
  .app-shell { grid-template-columns:230px minmax(0,1fr); }
  .app-side { background:#f7f7f5; border-right:1px solid #e9e9e7; padding:10px 8px; }
  .ch-row, .ch-axis { grid-template-columns:150px minmax(0,1fr); gap:12px; }
  .ch-grid { left:162px; }
}
@media (max-width:759px) {
  .app-who .ava { display:none; }
  .ch-row, .ch-axis { grid-template-columns:96px minmax(0,1fr); }
  .ch-grid { left:106px; }
  .chart { padding:14px 12px 10px; }
}
@media print { .chart, .ch-bar { -webkit-print-color-adjust:exact; print-color-adjust:exact; } .chart { break-inside:avoid; } }
.side-search { white-space:nowrap; overflow:hidden; font-size:13px; }
.chart { margin-bottom:12px; }
@media (max-width:759px) { .cr-ws, .cr-ws-sep { display:none !important; } .crumbs { font-size:13px; } }

/* ═══ Logo, séparateurs, tout sur un écran ═══ */
.app-tabname--c { justify-content:center; color:#787774; }
.app-logo { height:14px !important; }

/* Champs : lignes de base Notion, séparées par des filets */
.props { gap:0; border-top:1px solid #e9e9e7; margin-bottom:12px; }
.prop { padding:0; border-bottom:1px solid #e9e9e7; gap:0; }
.prop label { padding:8px 10px 2px; }
.prop .pv { margin:0 0 6px; border-radius:4px; }
.prop .sim-err, .prop .sim-info-msg { padding:0 10px 6px; }
.prop.is-err { background:#fdf5f4; }
.prop.is-err .pv { background:transparent; border-color:transparent; }

/* Sections repliables, comme les « toggles » Notion */
.toggle { margin-top:14px; border-top:1px solid #e9e9e7; }
.toggle summary { display:flex; align-items:center; gap:8px; padding:9px 2px; list-style:none; cursor:pointer; font-size:14px; font-weight:600; color:#37352f; border-radius:4px; }
.toggle summary::-webkit-details-marker { display:none; }
.toggle summary::before { content:''; width:0; height:0; border-left:6px solid #9b9a97; border-top:4.5px solid transparent; border-bottom:4.5px solid transparent; transition:transform .15s; }
.toggle[open] summary::before { transform:rotate(90deg); }
.toggle summary:hover { background:rgba(55,53,47,.05); }

.v-grid { display:grid; grid-template-columns:1fr; gap:6px 24px; }
.v-col { min-width:0; }
.v-col .blk-h:first-child { margin-top:0 !important; }
.view .app-btn { margin-top:10px; }

@media (min-width:760px) {
  /* En-tête de page resserré, fenêtre à la hauteur de l'écran (le contenu défile dedans, comme dans Notion) */
  .sim-top { padding:92px 0 18px; }
  .sim h1 { font-size:34px; }
  .sim-lead { margin-top:8px !important; font-size:15.5px; }
  .sim-stage > .sim-in { padding:22px 28px; }
  .app { border-width:12px; border-radius:26px; outline-offset:-12px; }
  .app-shell { height:clamp(560px, calc(100vh - 300px), 860px); min-height:0; }
  .app-main { display:flex; flex-direction:column; min-height:0; }
  .view { flex:1; min-height:0; overflow-y:auto; padding:16px 26px 20px; scrollbar-width:thin; }
  .page-t { font-size:26px; margin:0 0 12px; }
  .app-tabs { padding:8px 22px 6px; }
  .app-top { min-height:40px; }
  .prop { grid-template-columns:200px minmax(0,1fr); align-items:stretch; }
  .prop label { padding:0 12px; border-right:1px solid #e9e9e7; min-height:38px; }
  .prop .pv { margin:3px 6px; min-height:32px; }
  .prop .sim-err, .prop .sim-info-msg { grid-column:2; padding:0 12px 6px; }
  .v-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .v-grid .kpis { grid-template-columns:1fr 1fr; gap:10px; }
  .v-grid--cout { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); }
  .kpi { padding:11px 14px 10px; }
  .k-n { font-size:26px; }
  .blk-h { margin:14px 0 6px !important; }
  .chart { padding:14px 16px 10px; }
  .ch-rows { gap:9px; }
  .v-grid .ch-row, .v-grid .ch-axis { grid-template-columns:104px minmax(0,1fr); }
  .v-grid .ch-grid { left:116px; }
  #simForm3 { display:grid; grid-template-columns:1fr 1fr; column-gap:24px; align-content:start; border-top:0; }
  #simForm3 .prop { grid-template-columns:150px minmax(0,1fr); }
  #simForm3 .prop:nth-of-type(1), #simForm3 .prop:nth-of-type(2) { border-top:1px solid #e9e9e7; }
  #simForm3 .sim-check, #simForm3 > .sim-err, #simForm3 > .app-btn { grid-column:1 / -1; }
}
@media (min-width:760px) and (max-height:760px) { .sim-top { padding-top:84px; } .sim-lead { display:none; } }
/* En-tête sur une ligne, pour que l'outil tienne dans l'écran */
.sim h1 .sim-kicker { display:block; margin-bottom:8px; font-size:14px; font-weight:600; letter-spacing:0; }
@media (min-width:760px) {
  .sim-top { padding:86px 0 14px; text-align:left; }
  .sim-top .sim-in { padding:0 32px; }
  .sim h1 { margin:0; max-width:none; font-size:26px; letter-spacing:-.02em; display:flex; align-items:baseline; gap:14px; }
  .sim h1 .sim-kicker { display:inline; margin:0; font-size:14px; padding:3px 9px; border-radius:4px; background:#d3e5ef; color:#0b6e99; }
  .sim-lead { display:none; }
  .sim-stage > .sim-in { padding:16px 22px; }
  .app-shell { height:clamp(520px, calc(100vh - 196px), 860px); }
  .v-grid--cout { grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:end; }
  .v-grid--cout .kpis--3 { grid-template-columns:1fr 1fr; }
  .v-grid--cout .kpis--3 .kpi--ok { grid-column:1 / -1; }
  .k-s { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .tbl td, .tbl th { padding-top:6px; padding-bottom:6px; }
  .db-h { margin-top:14px; }
}
@media (min-width:1100px) { .sim-top .sim-in { padding:0 110px; } }
/* Juste milieu : moins d'éléments, fenêtre entière visible */
.kpi--solo { padding:16px 18px 14px; }
.kpi--solo .k-n { font-size:44px; margin-top:8px !important; }
.kpi--solo .k-s { white-space:normal; }
@media (min-width:760px) {
  .app-tabs { display:none; }
  .app-shell { height:clamp(440px, calc(100vh - 262px), 620px); grid-template-columns:200px minmax(0,1fr); }
  .app-side { padding-top:14px; }
  .view { padding:18px 28px 18px; }
  .page-t { font-size:24px; margin-bottom:14px; }
  .v-grid { gap:6px 28px; align-items:start; }
  .v-grid--cout { align-items:start; }
  .v-col > .kpi--solo:first-child { margin-top:0; }
  .v-col .kpi--solo + .blk-h { margin-top:16px !important; }
  .foot { margin-top:8px !important; }
}
#simForm3 > .app-btn { justify-self:start; }
/* Police système Apple (San Francisco) en priorité, partout dans le simulateur */
.sim { --ff-n:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",Helvetica,Arial,sans-serif; }
.sim .page-t, .sim .k-n, .sim h1 { font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Helvetica,Arial,sans-serif !important; }
/* Barre de fenêtre comme la première version : plus haute, logo plus à l'intérieur */
.app-bar { height:44px; padding:0 18px 0 22px; }
.app-logo { height:14px !important; }
/* Carte du chiffre clé : neutre, comme une carte nombre Notion */
.kpi--main { background:#fff; border-color:#e9e9e7; }
.kpi--main .k-n { color:#37352f; }
.kpi--solo .k-n.is-empty { font-size:22px; font-weight:500; letter-spacing:0; color:#c7c6c4; margin-top:12px !important; }
.cr-ws img.cr-logo { width:auto !important; height:12px !important; opacity:1; display:block; }
/* Simulateur intégré à l'accueil : titre en h2, mêmes réglages que le h1 de la page dédiée */
.sim--home { font-family:var(--ff-n); }
.sim .sim-h { margin:0; font:700 28px/1.15 -apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:-.025em; color:var(--ink); text-align:center; }
.sim .sim-h .sim-kicker { display:block; margin-bottom:8px; font-size:14px; font-weight:600; letter-spacing:0; color:var(--navy); }
.sim--home .sim-top { padding:56px 0 18px; }
@media (min-width:760px) {
  .sim .sim-h { display:flex; align-items:baseline; gap:14px; text-align:left; font-size:26px; letter-spacing:-.02em; }
  .sim .sim-h .sim-kicker { display:inline; margin:0; padding:3px 9px; border-radius:4px; background:#d3e5ef; color:#0b6e99; }
  .sim--home .sim-top { padding:64px 0 14px; }
}
.sim .prop label, .sim .k-l, .sim .k-s, .sim .foot { line-height:1.3; }
.sim--home .sim-stage { padding-bottom:40px; }
/* Sans fond bleu derrière la fenêtre */
.sim-stage > .sim-in { background:transparent; overflow:visible; }
.sim-stage > .sim-in::before, .sim-stage > .sim-in::after { display:none; }
@media (min-width:760px) { .sim-stage > .sim-in { padding:6px 32px; } }
@media (min-width:1100px) { .sim-stage > .sim-in { padding:6px 110px; } }
@media (min-width:760px) { .prop { grid-template-columns:minmax(150px,46%) minmax(0,1fr); } }
/* Proportions : fenêtre plus large, colonne des champs plus généreuse, libellés sur une ligne */
@media (min-width:760px) {
  .sim-stage > .sim-in { max-width:1300px; padding:6px 32px; }
  .app-shell { grid-template-columns:190px minmax(0,1fr); }
  .v-grid { grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:6px 32px; }
  .prop { grid-template-columns:170px minmax(0,1fr); }
  .prop label { white-space:nowrap; }
}
@media (min-width:1100px) { .sim-stage > .sim-in { padding:6px 48px; } }
@media (min-width:760px) {
  .app-shell { grid-template-columns:212px minmax(0,1fr); height:clamp(420px, calc(100vh - 250px), 540px); }
  .side-link { white-space:nowrap; }
  .sim-top .sim-in { max-width:1300px; padding:0 32px; }
  .sim .sim-h { padding-left:24px; }
}
@media (min-width:1100px) { .sim-top .sim-in { padding:0 48px; } }
@media (min-width:760px) { .sim .sim-h { padding-left:0; } }
/* Titre centré, sans étiquette */
.sim .sim-h, .sim h1 { justify-content:center; text-align:center; }
.rp-head { position:relative; padding-right:44px; }
.rp-close { position:absolute; top:-6px; right:-6px; width:34px; height:34px; border:0; border-radius:6px; background:transparent; color:#9b9a97; font:300 26px/1 var(--ff-n); cursor:pointer; }
.rp-close:hover { background:rgba(55,53,47,.08); color:#37352f; }
@media print { .rp-close { display:none !important; } }
/* Badge « Calcul en direct » : même DA que « Sync en temps réel » du tableau de bord CRM */
.app-live { gap:5px; font-size:11px; color:#1B3A6B; background:#e8edf5; padding:4px 10px 4px 8px; border-radius:999px; }
.app-live i { display:none; }
.app-live svg { width:12px; height:12px; flex:none; }
/* Icône d'information (à la place du point d'interrogation) */
.sim-tip { width:auto; height:auto; border:0; border-radius:0; color:#9b9a97; margin-left:4px; vertical-align:-2px; }
.sim-tip:hover, .sim-tip:focus { color:#37352f; outline:none; }
.sim-tip > svg { display:block; }
.sim-tip { flex:none; display:inline-flex; }
.sim-tip > svg { width:14px !important; height:14px !important; max-width:none !important; flex:none; }
@media (min-width:760px) { .prop { grid-template-columns:186px minmax(0,1fr); } }

/* ═══ Contour liquid glass, plus marqué (anneau de verre sur fond clair) ═══ */
@media (min-width:760px) {
  .app { border:14px solid transparent; border-radius:30px; outline-offset:-14px;
    background:
      linear-gradient(#fff,#fff) padding-box,
      /* reflet spéculaire en haut à gauche */
      radial-gradient(70% 55% at 6% 0%, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 55%) border-box,
      /* reflet secondaire en bas à droite */
      radial-gradient(60% 50% at 96% 100%, rgba(255,255,255,.95) 0%, rgba(255,255,255,0) 55%) border-box,
      /* liseré lumineux sur l'arête haute */
      linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,0) 12%) border-box,
      /* corps du verre : légèrement bleuté, plus dense sur les côtés */
      linear-gradient(115deg, rgba(214,226,244,.75) 0%, rgba(236,242,250,.55) 35%, rgba(205,219,240,.7) 70%, rgba(230,237,248,.6) 100%) border-box;
    -webkit-backdrop-filter:blur(14px) saturate(190%); backdrop-filter:blur(14px) saturate(190%);
    outline:1px solid rgba(255,255,255,.9);
    box-shadow:
      0 0 0 1px rgba(28,58,108,.10),            /* arête extérieure fine */
      inset 0 1px 0 rgba(255,255,255,.95),       /* lumière sur le bord haut */
      inset 0 -1px 0 rgba(28,58,108,.10),        /* ombre sur le bord bas */
      0 1px 0 rgba(255,255,255,.8),
      0 30px 70px -28px rgba(28,58,108,.45),
      0 12px 26px -14px rgba(28,58,108,.25); }
  /* fine ombre portée du verre sur la fenêtre, comme une épaisseur */
  .app-bar { box-shadow:inset 0 1px 0 rgba(255,255,255,.7); }
}
/* Liquid glass neutre : verre blanc translucide, sans teinte bleue */
@media (min-width:760px) {
  .app {
    background:
      linear-gradient(#fff,#fff) padding-box,
      radial-gradient(70% 55% at 6% 0%, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 55%) border-box,
      radial-gradient(60% 50% at 96% 100%, rgba(255,255,255,.95) 0%, rgba(255,255,255,0) 55%) border-box,
      linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,0) 12%) border-box,
      linear-gradient(115deg, rgba(232,232,230,.8) 0%, rgba(248,248,247,.6) 35%, rgba(226,226,224,.75) 70%, rgba(244,244,242,.65) 100%) border-box;
    box-shadow:
      0 0 0 1px rgba(0,0,0,.07),
      inset 0 1px 0 rgba(255,255,255,.95),
      inset 0 -1px 0 rgba(0,0,0,.06),
      0 1px 0 rgba(255,255,255,.8),
      0 30px 70px -28px rgba(15,15,15,.28),
      0 12px 26px -14px rgba(15,15,15,.16); }
}
