:root{--hov:#F7F4EF;--sel:#EDE7DE;--wash:#F7F4EF;--bg:#EFEBE4;--card:#fff;--ink:#1E2322;--ink2:#5B6563;--ink3:#8E9794;--line:#DFD8CE;
 --atelier:#db8c65;--design:var(--acc,#3a7c88);--maison:#345c72;--crayon:#bf6d62;--acc:#3a7c88}
*{box-sizing:border-box;margin:0}
body{background:var(--bg);color:var(--ink);font:14px/1.5 "IBM Plex Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
header{display:flex;align-items:center;gap:12px;position:relative;padding:14px 22px;border-bottom:1px solid var(--line);background:var(--card);position:sticky;top:0;z-index:5}
.wordmark{font-weight:700;font-size:18px;letter-spacing:-.02em}
.wordmark small{font-weight:500;color:var(--ink3);font-size:12px;margin-left:8px}
.avbtn{width:30px;height:30px;border-radius:50%;overflow:hidden;border:1px solid var(--line);padding:0;background:var(--card);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink)}
.spacer{flex:1}
.who{font-size:12.5px;color:var(--ink2)}
main{max-width:1020px;margin:0 auto;padding:20px 18px 60px;display:grid;grid-template-columns:minmax(300px,380px) 1fr;gap:18px}
@media(max-width:760px){main{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:18px;overflow:hidden}
.hd{display:flex;align-items:baseline;gap:10px;padding:13px 16px;border-bottom:1px solid var(--line)}
.hd h2{font-size:13.5px;font-weight:600}
.hd .sub{font-size:11.5px;color:var(--ink3)}
.pad{padding:14px 16px}
.btn{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:8px;padding:7px 13px;font:inherit;font-size:13px;cursor:pointer}
.btn:hover{border-color:#cfc9c0}
.btn.pri{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn.sm{padding:4px 9px;font-size:12px}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:baseline}
label{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);margin:12px 0 4px}
input,select,textarea{width:100%;font:inherit;font-size:13.5px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink)}
select,::picker(select){appearance:base-select}
select{white-space:nowrap}
::picker(select){border-radius:10px;border:1px solid var(--line);background:var(--card);box-shadow:0 14px 40px rgba(0,0,0,.14);padding:4px;margin-top:4px}
select option{padding:6px 10px;border-radius:6px;cursor:pointer}
select option{background:var(--card);color:var(--ink)}
select option:hover,select option:focus{background:var(--hov)}
select option:checked{background:var(--sel);font-weight:600}
input:focus,select:focus,textarea:focus{outline:2px solid #d8d2c8;border-color:#cfc9c0}
.entrow{display:flex;gap:8px;flex-wrap:wrap}
.entbtn{flex:1;min-width:100px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:9px;padding:9px 6px;font:inherit;font-size:12.5px;cursor:pointer;text-align:center}
.entbtn.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);font-weight:600}
.qrow{display:flex;gap:8px}
.qbtn{flex:1;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:9px;padding:8px 4px;font:inherit;cursor:pointer;text-align:center}
.qbtn b{display:block;font-size:14px}
.qbtn small{color:var(--ink3);font-size:11px}
.qbtn.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.cal{width:100%;border-collapse:collapse;table-layout:fixed}
.cal th{font-size:10.5px;color:var(--ink3);font-weight:500;padding:4px 0;text-transform:uppercase}
.cal td{text-align:center;padding:2px;height:52px;vertical-align:top}
.day{width:100%;height:100%;border:1px solid transparent;border-radius:9px;background:none;font:inherit;color:var(--ink);cursor:pointer;padding:4px 2px}
.day:hover{border-color:var(--line)}
.day.sel{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.day.today .num{font-weight:700;text-decoration:underline}
.day .num{font-size:12.5px}
.day .hh{display:block;font-size:10.5px;color:var(--bg);background:var(--ink);border-radius:6px;margin-top:3px;padding:0 2px}
.day.off{opacity:.45}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 16px}
.stat{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.stat .l{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3)}
.stat .v{font-size:19px;font-weight:700;margin-top:2px}
.stat .s{font-size:11.5px;color:var(--ink3)}
table.hist{width:100%;border-collapse:collapse}
table.hist td{padding:8px 16px;border-top:1px solid var(--line);font-size:13px}
table.hist td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.empty{padding:22px 16px;color:var(--ink3);font-size:13px;text-align:center}
.chips{display:flex;gap:8px;flex-wrap:wrap;padding:0 16px 14px}
.chip{font-size:12px;border:1px solid var(--line);border-radius:99px;padding:3px 10px;color:var(--ink2)}
#login{position:fixed;inset:0;background:var(--bg);display:flex;align-items:center;justify-content:center;z-index:50}
#login .box{width:min(360px,92vw);background:var(--card);border:1px solid var(--line);border-radius:14px;padding:26px}
#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:9px;font-size:13px;opacity:0;transition:opacity .25s;pointer-events:none;z-index:60}
.mnav{display:flex;align-items:center;gap:8px}
.mnav b{font-size:13.5px;min-width:130px;text-align:center;text-transform:capitalize}
.menuwrap{position:relative}
.menu{position:absolute;top:calc(100% + 6px);right:0;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 40px rgba(0,0,0,.12);display:none;min-width:210px;z-index:45;overflow:hidden}
#appmenu{min-width:274px}
#appmenu a{white-space:nowrap}
.menu .grp,.chmenu .grp{margin-top:11px}
.menu a{display:block;padding:10px 14px;color:var(--ink);text-decoration:none;font-size:13px}
.menu a:hover{background:var(--hov)}
.menu a.here{font-weight:600;background:var(--sel)}
.menu .grp{padding:8px 14px 2px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink3)}

.del{color:#9c3f3f;cursor:pointer;font-size:12px;background:none;border:none;font-family:inherit}

/* ===== Style « Aethos », même charte que le Hub, bascule partagée ===== */
body.aethos{--bg:#EFEBE4;--card:#ffffff;--ink:#1E2322;--ink2:#5B6563;--ink3:#8E9794;--line:#DFD8CE}
body.aethos header{background:#1E2322;border-bottom:none;color:#fff}
body.aethos .wordmark{color:#fff}
/* En Classique l'en-tete est noir, le petit nom s'ecrit donc en blanc. Epure et
   Studio portent aussi la classe « aethos » mais ont un en-tete clair : la regle
   y rendait le nom de l'application blanc sur blanc, donc invisible. */
body.aethos:not(.t-epure):not(.t-studio) .wordmark small{color:rgba(255,255,255,.55)}
body.aethos .who{color:rgba(255,255,255,.7)}
body.aethos header .btn{background:transparent;border-color:rgba(255,255,255,.4);color:#fff}
body.aethos header .btn:hover{background:rgba(255,255,255,.12)}
body.aethos header .avbtn{border-color:rgba(255,255,255,.45);background:transparent;color:#fff}
body.aethos .card{border:none;border-radius:18px;box-shadow:0 2px 12px rgba(42,46,48,.08)}
body.aethos .btn{border-radius:999px}
body.aethos .btn:hover{border-color:var(--acc,#3a7c88);background:#fdefe8}
body.aethos .btn.pri{background:var(--acc,#3a7c88);border-color:var(--acc,#3a7c88);color:#fff;font-weight:600}
body.aethos .btn.pri:hover{background:#e05a28}
body.aethos .entbtn,body.aethos .qbtn{border-radius:12px}
body.aethos .entbtn.on,body.aethos .qbtn.on{border-color:var(--acc,#3a7c88);box-shadow:inset 0 0 0 1px var(--acc,#3a7c88)}
body.aethos .day{border-radius:11px}
body.aethos .day.sel{border-color:var(--acc,#3a7c88);box-shadow:inset 0 0 0 1px var(--acc,#3a7c88)}
body.aethos .day .hh{background:var(--acc,#3a7c88)}


/* ===== Thèmes supplémentaires ===== */
body.t-nuit{--hov:#2c2f31;--sel:#3a3f43;--wash:#26292c;--bg:#191b1d;--card:#232628;--ink:#eceae5;--ink2:#c2bfb8;--ink3:#9b988f;--line:#34383b;--line2:#2c2f31;--ok:#5abf8a;--okbg:#1e3228;--warn:#d9a75a;--warnbg:#372e1c;--neut:#9a958d;--neutbg:#2c2f31}
body.t-nuit header{background:#101214}
body.t-nuit input,body.t-nuit select{background:#2b2e31;color:var(--ink);border-color:#3d4144}
body.t-nuit .card{box-shadow:0 2px 14px rgba(0,0,0,.5)}
body.t-nuit .btn.pri{background:var(--acc,#3a7c88);border-color:var(--acc,#3a7c88);color:#fff}
body.t-nuit label{color:var(--ink2)}
body.t-nuit ::placeholder{color:#918e86}
body.t-nuit .qbtn small{color:var(--ink2)}
body.t-nuit .qbtn{border-color:#41454a}
body.t-nuit .entbtn{border-color:#41454a}
body.t-nuit .qbtn:hover,body.t-nuit .entbtn:hover{background:var(--hov)}
body.t-nuit input::-webkit-calendar-picker-indicator{filter:invert(.8)}

/* ---------- Épuré : la clarté des sites Apple et Pixel. Beaucoup de blanc, des angles très arrondis,
   pas de traits durs, une seule couleur d'action, une typographie serrée et sombre. ---------- */
body.t-epure{--bg:#f5f5f7;--card:#ffffff;--ink:#1d1d1f;--ink2:#424245;--ink3:#86868b;
 --line:#e5e5ea;--line2:#f1f1f4;--acc:#3a7c88;--hov:#f0f0f3;--wash:#fafafb;--sel:#E4EEF0;--rad:14px;
 font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI Variable Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
 letter-spacing:-.011em}

/* ---------- Studio : l'entre-deux. Ni le noir de Classique, ni le blanc froid d'Épuré.
   Un gris chaud de papier, des encres profondes mais pas noires, des traits doux.
   Il reprend les formes d'Épuré (angles arrondis, chrome léger) et n'en change
   que la palette : le corps porte donc les deux classes. ---------- */
body.t-studio{--bg:#F1F0EC;--card:#FFFFFF;--ink:#262A2C;--ink2:#565E61;--ink3:#8D9499;
 --line:#E1DFD9;--line2:#EDEBE5;--acc:#3a7c88;--hov:#EDEBE6;--wash:#FAF9F6;--sel:#E4EEF0;--rad:12px;
 letter-spacing:-.005em}
body.t-studio .card{box-shadow:0 1px 2px rgba(38,42,44,.04),0 8px 22px -18px rgba(38,42,44,.30)}

body.t-epure h1,body.t-epure h2,body.t-epure h3,body.t-epure h4{letter-spacing:-.022em;font-weight:600}
body.t-epure .card,body.t-epure .hcard,body.t-epure .gc{border:0;border-radius:18px;box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.05)}
body.t-epure .kpi{border:0;border-radius:16px;box-shadow:0 1px 2px rgba(0,0,0,.04),0 6px 18px rgba(0,0,0,.045)}
body.t-epure .modal{border:0;border-radius:20px;box-shadow:0 24px 64px rgba(0,0,0,.18)}
body.t-epure .btn,body.t-epure .rbtn{border-radius:980px;border-color:var(--line);font-weight:500}
body.t-epure .btn:hover,body.t-epure .rbtn:hover{background:var(--hov);border-color:#dcdce1}
body.t-epure .btn.pri{background:var(--acc);border-color:var(--acc);color:#fff;font-weight:500}
body.t-epure .btn.pri:hover{background:#2f6a76;border-color:#2f6a76}
body.t-epure input,body.t-epure select,body.t-epure textarea{border-radius:12px;border-color:var(--line);background:var(--card)}
body.t-epure input:focus,body.t-epure select:focus,body.t-epure textarea:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(65,123,116,.18);outline:0}
body.t-epure .seg{border-radius:980px;background:var(--hov);border:0;padding:2px}
body.t-epure .seg button{border-radius:980px;border:0;font-weight:500}
body.t-epure .seg button.on{background:var(--acc);color:#fff;font-weight:600;box-shadow:none}
body.t-epure .pill,body.t-epure .tag,body.t-epure .oc-tag,body.t-epure .chip,body.t-epure .st,body.t-epure .ct{border-radius:980px}
body.t-epure table th{background:transparent;border-bottom:1px solid var(--line);color:var(--ink3);font-weight:500;text-transform:none;letter-spacing:0}
body.t-epure table tr.tot td,body.t-epure table tr.tot th{background:transparent;border-top:1px solid var(--line)}
body.t-epure .hd{border-bottom:1px solid var(--line2)}
body.t-epure .sub{color:var(--ink3)}
body.t-epure .ico{border-radius:980px}
body.t-epure .swrow .sw i,body.t-epure .sw i{border-radius:980px}
body.t-epure table td{border-bottom:1px solid var(--line2)}
body.t-epure table td,body.t-epure table th{border-left:0;border-right:0}
body.t-epure .hint,body.t-epure .empty{border-radius:12px;color:var(--ink3)}
body.t-epure .menu,body.t-epure .ctx,body.t-epure .chmenu,body.t-epure .pjmenu{border-radius:14px;border:0;box-shadow:0 12px 40px rgba(0,0,0,.16)}
body.t-epure a{color:var(--ink)}
body.t-epure .rowlink{color:var(--ink)}
body.t-epure a:hover{color:var(--ink)}
body.t-epure header{background:rgba(255,255,255,.82);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line);color:var(--ink)}
body.t-epure .wordmark,body.t-epure .who,body.t-epure .logo{color:var(--ink);font-weight:600;letter-spacing:-.022em}
body.t-epure header .btn,body.t-epure header .avbtn,body.t-epure header select{color:var(--ink);border-color:var(--line);background:var(--card)}
body.t-epure header .btn:hover{background:var(--hov)}

body.t-calque{--bg:#f7f5f0;--card:#fdfcf9;--ink:#26241f;--ink2:#565248;--ink3:#8f8a7f;--line:#d8d2c4;--line2:#eae5da}
body.t-calque header{background:var(--bg);border-bottom:1px solid var(--ink);color:var(--ink)}
body.t-calque .wordmark,body.t-calque .who{color:var(--ink)}
body.t-calque header .btn,body.t-calque header .avbtn{color:var(--ink);border-color:rgba(38,36,31,.35);background:transparent}
body.t-calque .card{border:1px solid var(--line);border-radius:4px;box-shadow:none}
body.t-calque .btn{border-radius:3px}
body.t-calque .btn.pri{background:#35635E;border-color:#35635E;color:#fff}
body.t-beton{--bg:#e6e6e3;--card:#f2f2ef;--ink:#141414;--ink2:#3b3b39;--ink3:#6f6f6c;--line:#bdbdb7;--line2:#d8d8d3}
body.t-beton header{background:#141414}
body.t-beton .card{border:1.5px solid #141414;border-radius:0;box-shadow:5px 5px 0 rgba(20,20,20,.85)}
body.t-beton .btn,body.t-beton input,body.t-beton select{border-radius:0}
body.t-beton .btn.pri{background:#ff4f00;border-color:#141414;color:#141414;font-weight:700}
body.t-riviera{--bg:#f6f2e8;--card:#fffdf8;--ink:#2c3226;--ink2:#535a48;--ink3:#8b9080;--line:#e0dac6;--line2:#eee9da}
body.t-riviera header{background:#3d4a33}
body.t-riviera .btn.pri{background:#c4562e;border-color:#c4562e;color:#fff}

/* ===== Thème Affiche ===== */
body.t-affiche{--bg:#efede7;--card:#ffffff;--ink:#101010;--ink2:#33322e;--ink3:#6f6d66;--line:#101010;--line2:#e2dfd6}
body.t-affiche header{background:#101010}
body.t-affiche .card{border:2px solid #101010;border-radius:14px;box-shadow:6px 6px 0 #101010}
body.t-affiche .btn{border:2px solid #101010;color:#101010;font-weight:700}
body.t-affiche header .btn{background:transparent;border-color:rgba(255,255,255,.45);color:#fff}
body.t-affiche .btn.pri{background:#e8262d;border-color:#101010;color:#fff}
body.t-affiche input,body.t-affiche select{border:1.5px solid #101010;background:#fff}
body.aethos header select{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff;border-radius:8px;padding:6px 9px;font-size:12.5px}
body.t-calque header select{color:var(--ink);border-color:rgba(38,36,31,.35);background:transparent;border-radius:3px}


/* ---------- maquette ---------- */
main{max-width:none;margin:0;padding:14px 18px 40px;display:block}
.mqwrap{display:grid;grid-template-columns:320px minmax(0,1fr);gap:14px;align-items:start}
@media(max-width:900px){.mqwrap{grid-template-columns:1fr}}
.side .card{margin-bottom:12px}
.mlist{list-style:none;padding:0;margin:0}
.mlist li{display:flex;align-items:center;gap:8px;padding:9px 14px;border-top:1px solid var(--line);cursor:pointer;font-size:13px}
.mlist li:hover{background:var(--hov)}
.mlist li.on{background:var(--sel);font-weight:600}
.mlist li .sz{margin-left:auto;font-size:11px;color:var(--ink3);white-space:nowrap}
.viewwrap{position:relative;background:#e9e7e2;border-radius:12px;overflow:hidden;height:calc(100vh - 190px);min-height:420px}
body.aethos .viewwrap{border-radius:18px}
.viewwrap canvas{display:block;width:100%;height:100%;outline:none;touch-action:none}
.vtools{position:absolute;top:10px;left:10px;display:flex;gap:6px;flex-wrap:wrap;z-index:3}
.vtools .btn{background:rgba(255,255,255,.92);color:#1E2322;border-color:rgba(0,0,0,.1);backdrop-filter:blur(6px)}
.vtools .btn.on{background:#1E2322;color:#fff;border-color:#1E2322}
.vprog{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:rgba(233,231,226,.85);z-index:4;font-size:13.5px;color:#1E2322;flex-direction:column;gap:10px}
.vprog .bar{width:240px;height:6px;background:rgba(0,0,0,.1);border-radius:3px;overflow:hidden}
.vprog .bar i{display:block;height:100%;background:var(--acc,#3a7c88);width:0;transition:width .2s}
.vhint{position:absolute;bottom:10px;left:10px;font-size:11.5px;color:rgba(28,27,25,.65);background:rgba(255,255,255,.7);padding:3px 8px;border-radius:6px;z-index:3}
.props{position:absolute;top:10px;right:10px;width:300px;max-height:calc(100% - 20px);overflow:auto;background:rgba(255,255,255,.96);color:#1E2322;border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.18);z-index:3;font-size:12.5px;display:none}
.props .ph{padding:10px 12px;border-bottom:1px solid #DFD8CE;display:flex;align-items:flex-start;gap:8px}
.props .ph b{font-size:13px;flex:1;word-break:break-word}
.props .ph button{border:0;background:none;cursor:pointer;font-size:16px;line-height:1;color:#8E9794}
.props .pg{padding:6px 12px 2px;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:#8E9794;font-weight:600}
.props table{width:100%;border-collapse:collapse}
.props td{padding:3px 12px;vertical-align:top;border-top:1px solid #f1eee8;word-break:break-word}
.props td:first-child{color:#5B6563;width:44%}
.tree{font-size:13px}
.tree .lvl{display:flex;align-items:center;gap:8px;padding:6px 14px;border-top:1px solid var(--line)}
.tree .lvl input{width:auto;margin:0}
.tree .lvl .n{margin-left:auto;font-size:11px;color:var(--ink3)}
.tree .lvl.sub{padding-left:32px}
.tabs{display:flex;gap:4px;margin-bottom:12px;flex-wrap:wrap;align-items:center}
.tabs button{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:6px 14px;font:inherit;font-size:13px;cursor:pointer}
.tabs button.on{background:var(--ink);color:var(--card);border-color:var(--ink);font-weight:600}
body.aethos .tabs button.on{background:var(--acc,#3a7c88);border-color:var(--acc,#3a7c88);color:#fff}
table.rep{width:100%;border-collapse:collapse;font-size:13px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:var(--card);padding:2px;flex-wrap:wrap}
.seg button{border:0;background:transparent;font:inherit;font-size:12.5px;padding:6px 12px;border-radius:999px;cursor:pointer;color:var(--ink)}
.seg button.on{background:var(--ink);color:var(--card);font-weight:600}
.tree label.lvl{text-transform:none;letter-spacing:0;font-size:13px;color:var(--ink);margin:0}
table.rep th{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);font-weight:600;text-align:left;padding:8px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
table.rep td{padding:7px 12px;border-top:1px solid var(--line);vertical-align:top}
table.rep td.num,table.rep th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
table.rep tr.tot td{font-weight:700;border-top:2px solid var(--ink)}
table.rep tr.grp td{font-weight:600;background:var(--wash);cursor:pointer}
table.rep tr.grp td .arr{display:inline-block;width:14px;color:var(--ink3);transition:transform .15s}
table.rep tr.grp.open td .arr{transform:rotate(90deg)}
table.rep tr.det td{color:var(--ink2);font-size:12.5px}
table.rep tr.det td:first-child{padding-left:30px}
table.rep tr.clk{cursor:pointer}
table.rep tr.clk:hover td{background:var(--hov)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;padding:14px 16px}
.kpi{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.kpi .l{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3)}
.kpi .v{font-size:20px;font-weight:700;margin-top:2px}
.kpi .s{font-size:11.5px;color:var(--ink3)}
.filt{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px 16px;border-bottom:1px solid var(--line)}
.filt select,.filt input{width:auto;padding:5px 9px;font-size:12.5px}
.filt .sp{flex:1}
.drop{border:2px dashed var(--line);border-radius:10px;padding:16px;text-align:center;font-size:12.5px;color:var(--ink3);cursor:pointer;margin:12px 14px}
.drop:hover,.drop.over{border-color:var(--acc,#3a7c88);color:var(--ink)}
.hint{font-size:12px;color:var(--ink3)}
.empty{padding:26px;text-align:center;color:var(--ink3);font-size:13px}
.del{color:#9c3f3f;cursor:pointer;font-size:12px;background:none;border:none;font-family:inherit}
#modal .mbg{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:70;display:flex;align-items:center;justify-content:center;padding:16px}
#modal .mbox{background:var(--card);color:var(--ink);border-radius:14px;width:min(520px,96vw);max-height:92vh;overflow:auto;padding:20px 22px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.repwrap{overflow-x:auto}
@media print{header,.side,.tabs,.filt,.vtools,#toast{display:none!important}main{padding:0}.mqwrap{display:block}.card{box-shadow:none;border:none}}

/* ---------- les commentaires posés dans la maquette ----------
   Une remarque se dit devant l'élément concerné : on la pose d'un clic, elle reste
   accrochée au point visé, et rouvrir la remarque remet la vue où elle était. */
#mnov{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}
.mnpin{position:absolute;transform:translate(-50%,-100%);pointer-events:auto;cursor:pointer;
 width:24px;height:24px;border-radius:50% 50% 50% 2px;background:var(--acc,#3a7c88);border:2px solid #fff;
 box-shadow:0 3px 10px rgba(0,0,0,.32);color:#fff;font:600 11px/20px Inter,system-ui,sans-serif;text-align:center;
 transform-origin:bottom center;rotate:-45deg}
.mnpin span{display:block;rotate:45deg}
.mnpin.fait{background:#2e7d5b}
.mnpin.on{outline:3px solid rgba(244,101,48,.35);outline-offset:2px}
.mnbub{position:absolute;z-index:6;pointer-events:auto;width:270px;background:#fff;color:#1E2322;border-radius:12px;
 box-shadow:0 12px 38px rgba(0,0,0,.26);padding:11px 12px;font-size:12.5px;transform:translate(-50%,calc(-100% - 30px))}
.mnbub .qui{color:#8E9794;font-size:11px;margin-top:5px}
.mnbub .rep{margin-top:6px;padding-top:6px;border-top:1px solid #eceae5;color:#5B6563}
.mnbub .act{display:flex;gap:5px;flex-wrap:wrap;margin-top:9px}
.mnbub textarea{width:100%;min-height:64px;font:inherit;border:1px solid #ded9d0;border-radius:8px;padding:7px;resize:vertical}
.mnpan{position:absolute;top:10px;right:10px;width:320px;max-height:calc(100% - 20px);z-index:5;display:none;flex-direction:column;
 background:rgba(255,255,255,.97);color:#1E2322;border-radius:12px;box-shadow:0 10px 34px rgba(0,0,0,.2);overflow:hidden}
.mnpan.on{display:flex}
.mnpan .h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;border-bottom:1px solid #eceae5}
.mnpan .h b{font-size:13px}
.mnpan .f{display:flex;gap:5px;width:100%}
.mnpan .f button{font:inherit;font-size:11.5px;border:1px solid #ded9d0;background:#fff;color:#5B6563;border-radius:999px;padding:3px 9px;cursor:pointer}
.mnpan .f button.on{background:#1E2322;color:#fff;border-color:#1E2322}
.mnpan .b{flex:1;overflow:auto}
.mnpan .r{display:grid;grid-template-columns:18px 1fr auto;gap:8px;align-items:start;padding:9px 12px;border-bottom:1px solid #f2f0ec;cursor:pointer}
.mnpan .r:hover{background:#f7f5f1}
.mnpan .r.on{background:#fdefe8}
.mnpan .r.fait .t{opacity:.55;text-decoration:line-through}
.mnpan .r.fait .t small{text-decoration:none}
.mnpan .r i.n{display:block;width:18px;height:18px;border-radius:50%;background:var(--acc,#3a7c88);color:#fff;font:600 10px/18px Inter,system-ui;text-align:center;font-style:normal}
.mnpan .r.fait i.n{background:#2e7d5b}
.mnpan .r .t{font-size:12.5px;line-height:1.35;min-width:0;overflow-wrap:anywhere}
.mnpan .r .t small{display:block;color:#8E9794;font-size:11px;margin-top:2px}
.mnpan .r .st{font:inherit;font-size:11px;border:1px solid #ded9d0;background:#fff;color:#8E9794;border-radius:999px;padding:2px 8px;cursor:pointer;white-space:nowrap}
.mnpan .r .st.ok{background:#e2f2e8;border-color:#bcdcc9;color:#1e6f48;font-weight:600}
.mnpan .z{padding:9px 12px;border-top:1px solid #eceae5;display:flex;gap:6px;flex-wrap:wrap}
.mnpan .vide{padding:22px 14px;color:#8E9794;font-size:12.5px;text-align:center}
body.mncur #cv{cursor:crosshair}

/* signalétique de chantier pour les titres, chasse fixe pour ce qui se compte */
h1,h2,h3,h4,.hd h2,.sgroup,.seg button{font-family:"Barlow Semi Condensed","Arial Narrow",Arial,system-ui,sans-serif;letter-spacing:.005em}
h1,h2,h3,h4{font-weight:600}
.kpi .v,.num,.ct,td.num,.su-num{font-family:"Chivo Mono",ui-monospace,Menlo,Consolas,monospace;font-variant-numeric:tabular-nums}
/* ---------- le menu latéral, repliable, le même dans toutes les applications ---------- */
.shell{display:flex;align-items:stretch;min-height:calc(100vh - 57px)}
.shell>main{flex:1;min-width:0}
nav.side{width:212px;flex:none;align-self:flex-start;position:sticky;top:57px;max-height:calc(100vh - 57px);min-height:calc(100vh - 57px);overflow-y:auto;background:var(--card);border-right:1px solid var(--line);padding:12px 10px 14px;display:flex;flex-direction:column;gap:1px;box-sizing:border-box}
nav.side .sh{padding:12px 11px 5px;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink3)}
nav.side .sh:first-child{padding-top:2px}
nav.side button.nv{display:flex;align-items:center;gap:9px;padding:8px 11px;border-radius:9px;font:inherit;font-size:13.5px;font-weight:600;color:var(--ink2);cursor:pointer;text-decoration:none;background:none;border:0;text-align:left;width:100%;box-sizing:border-box}
nav.side a{display:flex;align-items:center;gap:9px;padding:6px 11px;border-radius:9px;font-size:13px;font-weight:500;color:var(--ink2);cursor:pointer;text-decoration:none;white-space:nowrap;overflow:hidden}
nav.side a .lb{overflow:hidden;text-overflow:ellipsis}
nav.side a .ic{flex:0 0 18px;width:18px;height:18px;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:11px;font-weight:700;opacity:.85}
nav.side a .ic svg{width:18px;height:18px;display:block}
nav.side a:hover,nav.side button.nv:hover{background:var(--hov,#EDE7DE)}
nav.side a.on,nav.side button.nv.on{background:#1E2322;color:#fff}
nav.side .ct{margin-left:auto;font-size:11.5px;font-weight:700;opacity:.65}
nav.side .sp{flex:1;min-height:10px}
nav.side .act{margin:8px 1px 2px}
nav.side .act .btn{width:100%;justify-content:center}
.sidefold{position:fixed;left:212px;top:50%;transform:translateY(-50%);z-index:21;width:16px;height:44px;border:1px solid var(--line);border-left:0;border-radius:0 8px 8px 0;background:var(--card);color:var(--ink3);font-size:9px;cursor:pointer;padding:0;display:none;align-items:center;justify-content:center;box-shadow:2px 0 8px rgba(0,0,0,.06);transition:left .2s}
.sidefold:hover{color:var(--ink);background:var(--hov,#EDE7DE)}
.sidebg{display:none}
/* Replié, le menu ne disparaissait plus : il ne laissait rien derrière lui, et
   pour changer d'application il fallait le rouvrir ou passer par le ☰. Il se
   réduit maintenant à une colonne d'icônes, large comme un doigt : on garde la
   place et on garde l'accès. Le nom complet reste en infobulle. */
@media(min-width:901px){
 .sidefold{display:flex}
 body.sidefolded nav.side{width:54px;padding-left:7px;padding-right:7px}
 body.sidefolded nav.side a{justify-content:center;padding:9px 0}
 body.sidefolded nav.side a .lb,body.sidefolded nav.side .ct,body.sidefolded nav.side .act{display:none}
 body.sidefolded nav.side button.nv{justify-content:center;padding:9px 0}
 body.sidefolded nav.side button.nv .lb{display:none}
 /* les intitulés de section deviennent un simple filet */
 body.sidefolded nav.side .sh{height:1px;padding:0;margin:9px 5px 8px;background:var(--line);text-indent:-9999px;overflow:hidden}
 body.sidefolded .sidefold{left:54px}
}
@media(max-width:900px){
 nav.side{position:fixed;left:0;top:0;height:100vh;z-index:60;overflow-y:auto;transform:translateX(-105%);transition:transform .22s;box-shadow:0 0 30px rgba(0,0,0,.2);padding-top:16px}
 body.sideopen nav.side{transform:none}
 body.sideopen .sidebg{display:block;position:fixed;inset:0;background:rgba(0,0,0,.28);z-index:59}
 .burger{display:block;position:fixed;left:0;top:118px;z-index:61;border:none;border-radius:0 10px 10px 0;background:#1E2322;color:#fff;padding:12px 10px 12px 7px;font-size:15px;font-weight:700;line-height:1;box-shadow:2px 2px 12px rgba(0,0,0,.28);opacity:.92;cursor:pointer}
}
@media(min-width:901px){.burger{display:none}}
body.nosidebar nav.side,body.nosidebar .sidefold,body.nosidebar .burger,body.nosidebar .sidebg{display:none!important}
body.t-nuit nav.side a.on,body.t-nuit nav.side button.nv.on{background:#ece8e0;color:#1c1f22}
/* Le sélecteur de style de l'en-tête suivait la règle sombre même en thème clair : blanc sur blanc.
   Cette règle passe en dernier, donc elle gagne quel que soit l'ordre des blocs au-dessus. */
body.t-epure header select,body.t-epure header .btn,body.t-epure header .avbtn,
body.t-epure .top select,body.t-epure .top .btn,body.t-epure .top .avbtn{color:var(--ink);border-color:var(--line);background:var(--card)}
body.t-epure header select:hover,body.t-epure .top select:hover{background:var(--hov,#EDE7DE)}

/* Sur un téléphone, l'en-tête doit garder son menu : les sélecteurs cèdent la place. */
@media(max-width:700px){
 header{padding:10px 12px;gap:8px}
 header .wordmark small{display:none}
 header select{min-width:0}
 header #projsel{flex:1 1 70px;max-width:150px;min-width:0;text-overflow:ellipsis}
 header .spacer{flex:1 1 auto;min-width:0}
 header .menuwrap{flex:none}
}
@media(max-width:520px){
 header #thbtn{display:none}
 header #projsel{max-width:120px}
}