/* Original mockup styles isolated from the page. */
@scope (.f-source-mockup) {

*{box-sizing:border-box}body{margin:0;padding-bottom:100px;background:var(--fond);color:var(--encre);font-family:var(--font-corps);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-underline-offset:.18em}a:hover{color:var(--encre)}
.g{width:min(100% - 2*var(--propul-gouttiere),1296px);margin:0 auto}
.bandeau-prop{background:var(--violet-fond);border-bottom:1px solid var(--violet-filet);font-family:var(--font-mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);padding:8px 0}
.sur{font-family:var(--font-mono);font-size:var(--fs-label);font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--texte-2);margin:0 0 14px;display:flex;align-items:center;gap:10px}.sur::before{content:"";width:8px;height:8px;background:var(--accent);flex:none}
h2{font-family:var(--font-display);font-weight:700;font-size:clamp(1.75rem,3.2vw,2.5rem);line-height:1.1;letter-spacing:-.014em;margin:0 0 12px;text-wrap:balance}
.sous{color:var(--texte-2);max-width:var(--mesure);margin:0;text-wrap:pretty}
.sec{padding:clamp(3rem,6vw,5rem) 0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:15px;padding:13px 22px;border-radius:var(--r-bouton);text-decoration:none;border:1px solid transparent}
.btn-plein{background:var(--accent);color:var(--fond)}.btn-plein:hover{background:var(--accent-hover);color:var(--fond)}

/* ============ maquettes : 900 px de large, mises à l'échelle par --k ============ */
.vue{position:relative;overflow:hidden}
.vue{--l:900}
.vue>.mk{width:calc(var(--l,900) * 1px);zoom:var(--k,1)}
.mk{position:relative;border:1px solid var(--filet);border-radius:8px;overflow:hidden;background:#fff;font-size:12px;line-height:1.45;color:var(--encre)}
.mk__pts{display:flex;gap:4px}.mk__pts i{width:8px;height:8px;border-radius:50%;background:var(--filet)}

/* ---------- 1 · tableur (interface générique) ---------- */
.xl{font-family:var(--font-corps)}
.xl__titre{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#F3F2F1;border-bottom:1px solid #E1DFDD;font-size:11px;color:#605E5C}
.xl__titre b{color:#201F1E;font-weight:600;font-size:12px}
.xl__titre .dr{margin-left:auto}
.xl__menus{display:flex;gap:2px;padding:0 10px;background:#F3F2F1;border-bottom:1px solid #E1DFDD;font-size:11px;color:#484644}
.xl__menus span{padding:7px 10px;border-bottom:2px solid transparent}
.xl__menus span.on{color:#201F1E;font-weight:600;border-bottom-color:#217346;background:#fff}
.xl__outils{display:flex;align-items:center;gap:0;padding:6px 10px;background:#fff;border-bottom:1px solid #E1DFDD;font-size:11px;color:#484644}
.xl__outils .grp{display:flex;align-items:center;gap:4px;padding:0 10px;border-right:1px solid #E1DFDD}
.xl__outils .grp:last-child{border-right:0}
.xl__outils i{font-style:normal;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border:1px solid transparent;border-radius:3px;background:#F3F2F1;font-size:10.5px}
.xl__outils i.b{font-weight:700}.xl__outils i.i{font-style:italic}.xl__outils i.u{text-decoration:underline}
.xl__outils i.txt{background:transparent;border-color:#E1DFDD;min-width:auto}
.xl__formule{display:flex;align-items:center;background:#fff;border-bottom:1px solid #E1DFDD;font-family:var(--font-mono);font-size:11px}
.xl__formule .nom{width:74px;flex:none;padding:5px 8px;border-right:1px solid #E1DFDD;color:#201F1E}
.xl__formule .fx{width:30px;flex:none;text-align:center;color:#605E5C;font-style:italic;border-right:1px solid #E1DFDD;padding:5px 0}
.xl__formule .f{padding:5px 10px;color:#201F1E;white-space:nowrap;overflow:hidden}
.xl__grille{overflow:hidden}
.xl table{width:100%;border-collapse:collapse;font-family:var(--font-corps);font-size:11px;table-layout:fixed}
.xl th,.xl td{border:1px solid #D0CECE;padding:3px 6px;text-align:left;white-space:nowrap;overflow:hidden;height:21px}
.xl thead th{background:#F3F2F1;color:#605E5C;font-weight:400;text-align:center;font-size:10.5px}
.xl thead th.sel{background:#D6E9D9;color:#201F1E;font-weight:600}
.xl tbody th{background:#F3F2F1;color:#605E5C;font-weight:400;text-align:center;width:30px;font-size:10.5px}
.xl tbody th.sel{background:#D6E9D9;color:#201F1E;font-weight:600}
.xl .c1{width:138px}.xl .c2{width:92px}.xl .c3{width:86px}.xl .c4{width:82px}.xl .c5{width:62px}.xl .c6{width:150px}.xl .cx{width:52px}
.xl .n{text-align:right}
.xl .g{font-weight:700}
.xl .err{color:#A4262C;font-weight:600}
.xl .j{background:#FFF2A8}.xl .v{background:#C6EFCE;color:#006100}.xl .r{background:#FFC7CE;color:#9C0006}
.xl .note{color:#605E5C;font-style:italic;font-size:10.5px}
.xl .actif{outline:2px solid #217346;outline-offset:-2px}
.xl .hid{background:#F3F2F1;color:#605E5C;font-size:10px;text-align:center}
.xl__feuilles{display:flex;align-items:flex-end;gap:1px;padding:0 10px;background:#F3F2F1;border-top:1px solid #E1DFDD;font-size:10.5px;color:#484644}
.xl__feuilles span{padding:5px 10px;background:#EDEBE9;border:1px solid #E1DFDD;border-bottom:0}
.xl__feuilles span.on{background:#fff;color:#201F1E;font-weight:600;border-bottom:2px solid #217346}
.xl__feuilles .plus{background:transparent;border:0;color:#605E5C}
.xl__etat{display:flex;align-items:center;gap:18px;padding:5px 12px;background:#F3F2F1;border-top:1px solid #E1DFDD;font-size:10.5px;color:#605E5C}
.xl__etat .dr{margin-left:auto;display:flex;gap:14px;align-items:center}
.xl__etat .zoom{display:flex;align-items:center;gap:6px}
.xl__etat .zb{width:52px;height:3px;background:#D0CECE;position:relative}
.xl__etat .zb::after{content:"";position:absolute;left:22px;top:-3px;width:3px;height:9px;background:#605E5C}

/* ---------- 2 et 3 · tableau de bord ---------- */
.db{font-family:var(--font-corps)}
.db__top{display:flex;align-items:center;gap:14px;padding:11px 16px;border-bottom:1px solid var(--filet);background:var(--fond)}
.db__mark{font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:-.01em}
.db__mark em{font-style:normal;color:var(--accent)}
.db__fil{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--texte-2)}
.db__rech{margin-left:auto;display:flex;align-items:center;gap:7px;border:1px solid var(--filet);border-radius:6px;padding:5px 10px;width:210px;color:var(--texte-2);font-size:11px}
.db__rech i{font-style:normal;opacity:.6}
.db__bt{font-size:11px;font-weight:600;padding:6px 12px;border-radius:6px;background:var(--accent);color:#fff}
.db__av{width:26px;height:26px;border-radius:50%;background:var(--violet-fond);border:1px solid var(--violet-filet);color:var(--accent);display:grid;place-items:center;font-family:var(--font-mono);font-size:10px;font-weight:600}
.db__corps{display:grid;grid-template-columns:172px minmax(0,1fr)}
.db__rail{border-right:1px solid var(--filet);padding:12px 0;background:color-mix(in srgb,var(--grille) 20%,var(--fond))}
.db__rail .t{font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--texte-2);padding:8px 16px 5px}
.db__rail a{display:flex;align-items:center;gap:9px;padding:7px 16px;color:var(--texte-2);text-decoration:none;font-size:11.5px}
.db__rail a b{margin-left:auto;font-family:var(--font-mono);font-size:9.5px;font-weight:500;color:var(--texte-2)}
.db__rail a::before{content:"";width:6px;height:6px;flex:none;background:var(--filet)}
.db__rail a.on{color:var(--accent);font-weight:600;background:var(--fond);box-shadow:inset 2px 0 0 var(--accent)}
.db__rail a.on::before{background:var(--accent)}
.db__rail a.on b{color:var(--accent)}
.db__main{padding:16px 18px;display:grid;gap:14px;align-content:start}
.db__tete{display:flex;align-items:baseline;gap:12px}
.db__tete h4{font-family:var(--font-display);font-weight:700;font-size:17px;letter-spacing:-.01em;margin:0}
.db__tete .ch{margin-left:auto;display:flex;gap:6px}
.db__tete .ch span{border:1px solid var(--filet);border-radius:5px;padding:4px 9px;font-size:10px;color:var(--texte-2)}
.db__tete .ch span.on{border-color:var(--accent);color:var(--accent);background:var(--violet-fond);font-weight:600}
.db__kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--filet);border:1px solid var(--filet);border-radius:7px;overflow:hidden}
.db__kpi>div{background:var(--fond);padding:12px 14px;display:grid;gap:3px}
.db__kpi dt{font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--texte-2)}
.db__kpi dd{margin:0;font-family:var(--font-display);font-weight:700;font-size:22px;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.014em}
.db__kpi dd.a{color:var(--accent)}
.db__kpi .dl{font-size:10px;color:var(--texte-2)}
.db__kpi .dl b{color:#1F7A33;font-weight:600}
.db__kpi .dl b.bas{color:var(--orange-texte)}
.db__deux{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:12px}
.db__carte{border:1px solid var(--filet);border-radius:7px;padding:13px 15px;display:grid;gap:11px;align-content:start;background:var(--fond)}
.db__carte .ct{display:flex;align-items:baseline;gap:8px}
.db__carte .ct b{font-size:12px;font-weight:600}
.db__carte .ct span{margin-left:auto;font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--texte-2)}
.db__hist{display:flex;align-items:flex-end;gap:8px;height:82px}
.db__hist>div{flex:1;display:grid;gap:5px;justify-items:center;align-content:end}
.db__hist i{display:block;width:100%;background:var(--violet-filet);border-radius:2px 2px 0 0}
.db__hist>div.on i{background:var(--accent)}
.db__hist em{font-style:normal;font-family:var(--font-mono);font-size:8.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--texte-2)}
.db__barre{display:flex;height:9px;border-radius:3px;overflow:hidden}
.db__barre i{display:block}
.db__leg{display:grid;gap:5px;font-size:10.5px;color:var(--texte-2)}
.db__leg span{display:flex;align-items:center;gap:7px}
.db__leg u{width:8px;height:8px;flex:none;text-decoration:none}
.db__leg b{margin-left:auto;color:var(--encre);font-variant-numeric:tabular-nums}
.db table{width:100%;border-collapse:collapse;font-size:11px}
.db th,.db td{padding:8px 10px;border-bottom:1px solid var(--filet);text-align:left;white-space:nowrap}
.db thead th{font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--texte-2);font-weight:500;background:color-mix(in srgb,var(--grille) 30%,var(--fond))}
.db tbody tr:last-child td{border-bottom:0}
.db td.n{text-align:right;font-variant-numeric:tabular-nums}
.db td.cl{display:flex;align-items:center;gap:8px}
.db .ini{width:20px;height:20px;flex:none;border-radius:5px;background:var(--surface-2,#F4F2F8);border:1px solid var(--filet);display:grid;place-items:center;font-family:var(--font-mono);font-size:8.5px;font-weight:600;color:var(--texte-2)}
.db .pil{display:inline-block;font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:4px}
.db .pil.ok{color:#1F7A33;background:#E6F3E9}.db .pil.att{color:var(--attention);background:var(--attention-fond)}.db .pil.enc{color:var(--accent);background:var(--violet-fond)}
.db .lk{color:var(--accent);font-weight:600;font-size:10.5px}
.db__tab{border:1px solid var(--filet);border-radius:7px;overflow-x:auto}
.db__rel{display:grid;gap:0}
.db__rel>div{display:flex;align-items:center;gap:9px;padding:8px 0;border-top:1px solid var(--filet);font-size:11px}
.db__rel>div:first-child{border-top:0}
.db__rel .j{margin-left:auto;font-family:var(--font-mono);font-size:9.5px;color:var(--orange-texte)}

/* ---------- 3 · copilote flottant ---------- */
.mk--ia .db__corps{grid-template-columns:172px minmax(0,1fr)}
.db__deux--cop{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 274px !important}
.cop{align-self:end;width:274px;border:1px solid color-mix(in srgb,var(--orange-texte) 34%,var(--fond));border-radius:9px;overflow:hidden;background:#fff;display:grid;grid-template-rows:auto 1fr auto}
.cop__t{display:flex;align-items:center;gap:7px;padding:8px 11px;border-bottom:1px solid var(--filet);background:color-mix(in srgb,var(--orange-texte) 7%,var(--fond))}
.cop__av{width:19px;height:19px;border-radius:5px;background:var(--orange-texte);color:#fff;display:grid;place-items:center;font-family:var(--font-mono);font-size:9.5px;font-weight:600}
.cop__t b{font-size:11px}
.cop__t .ue{margin-left:auto;font-family:var(--font-mono);font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:var(--orange-texte);border:1px solid color-mix(in srgb,var(--orange-texte) 30%,var(--fond));border-radius:3px;padding:1px 5px}
.cop__t .x{color:var(--texte-2);font-size:11px}
.cop__fil{padding:10px 11px;display:grid;gap:8px;align-content:start}
.cop__q{justify-self:end;max-width:90%;background:color-mix(in srgb,var(--grille) 40%,var(--fond));border-radius:7px 7px 2px 7px;padding:7px 9px;font-size:10.5px;line-height:1.45}
.cop__r{max-width:96%;background:#fff;border:1px solid var(--filet);border-radius:7px 7px 7px 2px;padding:8px 9px;font-size:10.5px;line-height:1.45}
.cop__r strong{font-family:var(--font-display);font-weight:700;font-size:12px;color:var(--orange-texte)}
.cop__r ul{margin:5px 0 0;padding-left:13px;color:var(--texte-2);display:grid;gap:2px}
.cop__act{display:flex;gap:5px;margin-top:7px;flex-wrap:wrap}
.cop__act i{font-style:normal;font-size:9.5px;font-weight:600;padding:4px 8px;border-radius:5px;background:var(--orange-texte);color:#fff}
.cop__act i.sec{background:#fff;color:var(--orange-texte);border:1px solid color-mix(in srgb,var(--orange-texte) 34%,var(--fond))}
.cop__s{display:flex;align-items:center;gap:7px;padding:8px 11px;border-top:1px solid var(--filet);font-size:10px;color:var(--texte-2)}
.cop__s em{flex:1;font-style:normal;border:1px solid var(--filet);border-radius:5px;padding:5px 8px}
.cop__s i{font-style:normal;width:22px;height:22px;flex:none;border-radius:5px;background:var(--orange-texte);color:#fff;display:grid;place-items:center;font-size:11px}

}