/* ForgeERP — feuille de style.
   Direction : luxe éditorial sobre. Ivoire chaud, encre presque noire, un seul accent champagne pour les repères,
   titres en Instrument Serif, texte et chiffres en Geist (polices et icônes servies localement depuis /vendor). */

@font-face{font-family:"Geist";src:url("/vendor/fonts/Geist-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("/vendor/fonts/GeistMono-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("/vendor/fonts/GeistMono-Medium.woff2") format("woff2");font-weight:500 700;font-display:swap}

:root{
  /* palette de TraceForge : les deux applications partagent la même identité */
  --bg:#f7f8f5;--panel:#ffffff;--panel-2:#fafcf9;--ink:#17211f;--ink-2:#2b3935;--muted:#677370;--faint:#9aa8a3;
  --line:#e6ece9;--line-2:#dbe2df;--soft:#eef3f0;
  --forest:#174a3f;--forest-2:#0e3d33;--lime:#c8ec69;--amber:#e7a842;--coral:#ef6a54;--blue:#526f9d;
  --gold:#174a3f;--gold-soft:#e6f1d6;--mint:#e7a842;
  /* états (mêmes teintes que les pastilles de TraceForge) */
  --ok:#237252;--ok-bg:#e3f1e8;--warn:#95661a;--warn-bg:#fbefd8;--bad:#ad3c2c;--bad-bg:#fce4df;--info:#406c86;--info-bg:#e3edf3;
  --shadow-1:0 1px 2px rgba(16,45,40,.04);
  --shadow-2:0 10px 30px rgba(16,45,40,.18);
  --radius:16px;--radius-s:10px;
  --ease:cubic-bezier(.32,.72,0,1);
  --sans:"Geist","Segoe UI",system-ui,sans-serif;--serif:Georgia,"Times New Roman",serif;--mono:"Geist Mono",Consolas,monospace;
  --side-w:254px;
  font-family:var(--sans);font-size:14px;color:var(--ink);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--gold-soft)}
.icon{width:18px;height:18px;flex:none;fill:currentColor}

/* ---------- structure ---------- */
.shell{display:grid;grid-template-columns:var(--side-w) 1fr;min-height:100dvh;transition:grid-template-columns .3s var(--ease)}
.side{background:#102d28;color:#e6efe9;padding:18px 12px 12px;display:flex;flex-direction:column;gap:1px;position:sticky;top:0;height:100dvh;overflow:auto;z-index:2;scrollbar-width:thin;scrollbar-color:#41625a transparent}
.brand{display:flex;gap:11px;align-items:center;padding:2px 8px 16px}
.brand strong{display:block;color:#ffffff;font:800 21px/1 var(--sans);letter-spacing:-.05em}
.brand small{color:#94aaa4;font-size:11.5px;display:block;margin-top:3px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.logo{width:34px;height:34px;border-radius:10px;background:var(--lime);color:#102d28;display:grid;place-items:center;font:400 21px/1 var(--serif)}
.search-btn{display:flex;align-items:center;gap:9px;margin:0 2px 12px;padding:8px 10px;border-radius:10px;background:#163a33;border:1px solid #2a5047;color:#94aaa4;font:13px var(--sans);cursor:pointer;transition:background .2s var(--ease);box-shadow:none}
.search-btn:hover{background:#235247;border-color:#2a5047}.search-btn kbd{margin-left:auto;font:11px var(--mono);color:#94aaa4;border:1px solid #41625a;border-radius:5px;padding:1px 5px}
.side a{position:relative;color:#afc1bb;text-decoration:none;padding:7px 10px;border-radius:9px;font-weight:450;display:flex;align-items:center;gap:10px;transition:background .2s var(--ease),color .2s var(--ease)}
.side a .icon{color:#7f9b93;transition:color .2s var(--ease)}
.side a:hover{background:#1b4239;color:#fff}.side a:hover .icon{color:#c8ec69}
.side a.on{background:#235247;color:#fff}.side a.on .icon{color:#c8ec69}
.side a.on::before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:3px;background:var(--lime)}
.side a:focus-visible{outline:1.5px solid var(--lime);outline-offset:1px}
.group{display:flex;align-items:center;justify-content:space-between;width:100%;font:500 10.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#7f9b93;padding:14px 10px 5px;background:none;border:0;cursor:pointer;border-radius:6px;box-shadow:none}
.group:hover{color:#d3dfda;background:none}.group .icon{width:12px;height:12px;transition:transform .25s var(--ease)}
.group:active{transform:none}
.group.closed .icon{transform:rotate(-90deg)}
.nav-items{display:grid;gap:1px}
.side > *{flex-shrink:0}  /* le menu défile plutôt que de rogner ses entrées */
.nav-items.closed{display:none}
.rail-btn{margin:6px 2px 0;align-self:flex-start;background:none;border:0;color:#7f9b93;padding:6px;border-radius:8px;cursor:pointer;box-shadow:none}
.rail-btn:hover{color:#c8ec69;background:#1b4239}
/* barre réduite aux icônes */
body.rail{--side-w:68px}
body.rail .side{padding-inline:10px}
body.rail .brand div,body.rail .side a span,body.rail .group span,body.rail .search-btn span,body.rail .search-btn kbd,body.rail #side-footer .who span,body.rail #side-footer .tf-label{display:none}
body.rail .side a,body.rail .search-btn{justify-content:center;padding-inline:0}
body.rail .group{justify-content:center;padding:10px 0 4px}body.rail .group .icon{display:none}
body.rail .group::after{content:"";display:block;width:18px;height:1px;background:#41625a}
body.rail .nav-items.closed{display:grid}
main{padding:30px 40px 72px;min-width:0;outline:none;position:relative;z-index:2;max-width:1560px}
main > div{animation:enter .45s var(--ease) both}
@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){main > div{animation:none}.shell{transition:none}}

/* ---------- typographie ---------- */
h1{font:700 32px/1.15 var(--sans);letter-spacing:-.045em;margin:0;color:var(--ink);text-wrap:balance}
h1 .num{font:500 15px var(--mono);letter-spacing:0;color:var(--muted);vertical-align:middle}
h2{font:600 15px/1.3 var(--sans);letter-spacing:-.005em;margin:0 0 12px;color:var(--ink)}
h3{font:600 13px var(--sans);margin:0 0 6px}
p{text-wrap:pretty}
.head{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.head .spacer{flex:1}
.head .sub{color:var(--muted);margin:8px 0 0;font-size:13.5px}
.sub{color:var(--muted)}
.sub .chip{vertical-align:1px}
.muted{color:var(--muted)}.small{font-size:12.5px}
.num{font:12.5px var(--mono);letter-spacing:-.01em}
a{color:var(--ink);text-decoration-color:rgba(23,74,63,.55);text-underline-offset:3px}
a:hover{text-decoration-color:var(--gold)}

/* ---------- panneaux et indicateurs ---------- */
.panel{background:var(--panel);border:0;border-radius:var(--radius);padding:20px 22px;margin-bottom:18px;min-width:0;box-shadow:var(--shadow-1),inset 0 0 0 1px var(--line)}
.grid{display:grid;gap:18px;align-items:start}
.cols-2{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}
.grid > .panel{margin-bottom:0}.grid{margin-bottom:18px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:22px}
/* double bord : coque claire + cœur, comme une plaque posée dans un écrin */
.kpi{background:#f0f4ed;border-radius:var(--radius);padding:4px;box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column}
.kpi span,.kpi strong,.kpi small{display:block;padding-inline:13px}
.kpi span{color:#697875;font:500 10px var(--mono);letter-spacing:.06em;text-transform:uppercase;padding-top:11px;background:var(--panel);border-radius:calc(var(--radius) - 4px) calc(var(--radius) - 4px) 0 0}
.kpi strong{font:500 23px/1.25 var(--sans);letter-spacing:-.02em;font-variant-numeric:tabular-nums;background:var(--panel);padding-top:4px;padding-bottom:12px;border-radius:0 0 calc(var(--radius) - 4px) calc(var(--radius) - 4px);box-shadow:0 2px 3px -2px rgba(16,45,40,.08)}
.kpi small{color:var(--muted);font-size:11.5px;padding:7px 13px 5px;line-height:1.35}
.kpi.bad strong{color:var(--bad)}.kpi.ok strong{color:var(--ok)}
.progress{height:4px;border-radius:99px;background:var(--soft);overflow:hidden;min-width:60px}.progress i{display:block;height:100%;background:var(--forest);border-radius:99px}

/* ---------- boutons ---------- */
button,.btn{font:500 13px var(--sans);border-radius:999px;border:1px solid var(--forest);background:var(--forest);color:#ffffff;padding:7px 15px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  transition:background .2s var(--ease),border-color .2s var(--ease),transform .15s var(--ease),box-shadow .2s var(--ease);box-shadow:0 1px 2px rgba(31,43,39,.18)}
button:hover,.btn:hover{background:var(--forest-2);border-color:var(--forest-2)}
button:active,.btn:active{transform:scale(.97)}
button.secondary,.btn.secondary{background:transparent;color:var(--ink);border-color:var(--line-2);box-shadow:none}
button.secondary:hover,.btn.secondary:hover{background:var(--panel);border-color:rgba(23,33,31,.28)}
button.danger{background:transparent;color:var(--bad);border-color:rgba(162,70,59,.3);box-shadow:none}
button.danger:hover{background:var(--bad-bg);border-color:rgba(162,70,59,.4)}
button.link{background:none;border:0;color:var(--ink-2);padding:2px 4px;text-decoration:underline;text-decoration-color:rgba(23,74,63,.6);text-underline-offset:3px;box-shadow:none;border-radius:4px}
button.link:hover{color:var(--ink);background:none}
button:disabled{opacity:.45;cursor:not-allowed}
button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ---------- tableaux ---------- */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
th{font:500 10px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#71807b;text-align:left;padding:8px 10px;border-bottom:1px solid var(--line-2);white-space:nowrap;background:transparent}
td{padding:10px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
tr.click{cursor:pointer;transition:background .15s var(--ease)}tr.click:hover td{background:var(--panel-2)}
.r{text-align:right;white-space:nowrap}
td .actions button,td > button{padding:5px 12px;font-size:12.5px}

/* ---------- étiquettes et messages ---------- */
.chip{display:inline-flex;align-items:center;gap:5px;font:500 11.5px var(--sans);padding:2px 9px;border-radius:6px;background:var(--soft);color:var(--ink-2);white-space:nowrap}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.75}
.chip.warn{background:var(--warn-bg);color:var(--warn)}.chip.bad{background:var(--bad-bg);color:var(--bad)}
.chip.ok{background:var(--ok-bg);color:var(--ok)}.chip.info{background:var(--info-bg);color:var(--info)}
.chip.grey{background:#ecefed;color:#66736f}
.notice{border:0;background:var(--warn-bg);color:#7a5410;padding:11px 16px;border-radius:var(--radius-s);margin-bottom:16px;box-shadow:inset 3px 0 0 var(--warn)}
.notice.bad{background:var(--bad-bg);color:#8a2a1f;box-shadow:inset 3px 0 0 var(--bad)}.notice.info{background:var(--info-bg);color:#2f5466;box-shadow:inset 3px 0 0 var(--info)}
.notice ul{margin:6px 0 0;padding-left:18px}
.demo-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);margin:-12px 0 20px}
.demo-bar b{font-weight:600;color:var(--forest);background:var(--lime);padding:1px 7px;border-radius:5px}
.empty{padding:26px;text-align:center;color:var(--muted)}
.mono-hash{font:11.5px var(--mono);word-break:break-all;color:var(--muted)}

/* ---------- formulaires ---------- */
label{display:grid;gap:5px;font-weight:500;font-size:12.5px;color:var(--ink-2)}
label.check{display:flex;align-items:center;gap:8px;font-weight:450}
input,select,textarea{font:13.5px var(--sans);border:1px solid var(--line-2);border-radius:9px;padding:7px 10px;background:var(--panel);color:var(--ink);min-width:0;width:100%;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
input:hover,select:hover,textarea:hover{border-color:rgba(23,33,31,.3)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(23,74,63,.15)}
input:disabled,select:disabled,textarea:disabled{background:var(--panel-2);color:var(--ink-2);border-color:var(--line)}
input[type=checkbox]{width:auto;accent-color:var(--forest)}
input[type=file]{padding:5px}
textarea{min-height:68px;resize:vertical}
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.form .wide{grid-column:1/-1}
fieldset{border:0;border-radius:var(--radius-s);padding:16px;margin:0 0 14px;background:var(--panel-2);box-shadow:inset 0 0 0 1px var(--line)}
legend{font:700 15px var(--sans);letter-spacing:-.02em;padding:0;color:var(--ink);float:left;width:100%;margin-bottom:12px}
legend + *{clear:both}
.lines input,.lines select{padding:5px 7px;font-size:13px;border-radius:7px}
.lines td{padding:4px 4px;border-bottom:1px solid var(--line)}
.lines .w-phase{width:130px}.lines .w-qty{width:74px}.lines .w-unit{width:86px}.lines .w-price{width:104px}.lines .w-vat{width:76px}.lines .w-kind{width:140px}
.totals{margin-left:auto;width:min(340px,100%);margin-top:12px}
.totals td{padding:5px 10px;border-bottom:0}.totals tr:last-child td{font:500 17px var(--sans);border-top:1px solid var(--ink);padding-top:9px}

/* ---------- graphiques simples ---------- */
.bars{display:grid;grid-template-columns:repeat(12,1fr);gap:8px;align-items:end;height:160px;padding-top:6px}
.bar{display:flex;gap:3px;align-items:end;height:100%}
.bar i{display:block;flex:1;border-radius:4px 4px 1px 1px;min-height:1px;transition:opacity .2s var(--ease)}
.bar i.s{background:var(--forest)}.bar i.e{background:var(--mint)}
.bar:hover i{opacity:.8}
.bar-labels{display:grid;grid-template-columns:repeat(12,1fr);gap:8px;font-size:11px;color:var(--muted);text-align:center;margin-top:6px}
.legend{display:flex;gap:16px;font-size:12px;color:var(--muted)}.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}

/* ---------- feuille de temps ---------- */
.week input{width:60px;text-align:right;padding:5px 7px}
.week input:disabled{background:var(--soft);color:var(--ink-2)}
.week td,.week th{text-align:center}.week td:first-child,.week th:first-child{text-align:left}
.week .today{background:rgba(23,74,63,.07)}
.week select[data-k=project]{min-width:210px}.week select[data-k=phase]{min-width:130px}

/* ---------- boîtes de dialogue et notifications ---------- */
dialog{border:0;border-radius:18px;padding:0;width:min(740px,94vw);background:var(--panel);color:var(--ink);box-shadow:0 30px 80px -20px rgba(16,45,40,.35),0 0 0 1px var(--line)}
dialog[open]{animation:pop .3s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
dialog::backdrop{background:rgba(11,36,30,.38);backdrop-filter:blur(3px)}
dialog form{padding:24px 26px;display:grid;gap:16px}
dialog form > h2:first-child{font:700 21px var(--sans);letter-spacing:-.03em;margin:0}
dialog .actions{justify-content:flex-end;padding-top:6px}
#toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,8px);background:#102d28;color:#ffffff;padding:11px 18px;border-radius:12px;font-weight:500;opacity:0;pointer-events:none;
  transition:opacity .25s var(--ease),transform .25s var(--ease);max-width:min(680px,92vw);z-index:20;box-shadow:var(--shadow-2)}
#toast.show{opacity:1;transform:translate(-50%,0)}#toast.bad{background:#8b2626}

/* ---------- pied de la barre latérale ---------- */
#side-footer{margin-top:auto;padding:12px 2px 2px;border-top:1px solid #235247;display:grid;gap:6px;font-size:12.5px;color:#94aaa4}
#side-footer a{color:#afc1bb}
#side-footer .tf-open{padding:8px 10px;border-radius:9px;background:#163a33;text-decoration:none;display:flex;align-items:center;gap:9px}
#side-footer .tf-open:hover{background:#235247}
#side-footer .who{display:flex;justify-content:space-between;gap:6px;align-items:center;padding:4px 6px}#side-footer .link{color:#c8ec69}
body.locked .side{display:none}body.locked .shell{grid-template-columns:1fr}
.login{max-width:400px;margin:14vh auto;background:var(--panel);border-radius:22px;padding:30px;display:grid;gap:18px;box-shadow:var(--shadow-2),inset 0 0 0 1px var(--line)}
.login .brand{padding:0}.login .brand strong{color:var(--ink);font-size:26px}.login .brand small{color:var(--muted)}
.login button[type=submit]{justify-content:center;padding:10px}

/* ---------- recherche rapide (Ctrl+K) ---------- */
.palette{position:fixed;inset:0;z-index:30;display:grid;place-items:start center;padding-top:12vh;background:rgba(11,36,30,.32);backdrop-filter:blur(4px)}
.palette-box{width:min(620px,92vw);background:var(--panel);border-radius:18px;box-shadow:0 30px 80px -20px rgba(16,45,40,.4),0 0 0 1px var(--line);overflow:hidden;animation:pop .25s var(--ease)}
.palette-box input{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:16px 20px;font-size:16px;box-shadow:none}
.palette-box input:focus{box-shadow:none}
.palette-box input::-webkit-search-cancel-button{display:none}
.palette-list{max-height:52vh;overflow:auto;padding:6px}
.palette-item{display:flex;align-items:center;gap:12px;padding:9px 14px;border-radius:10px;cursor:pointer;color:var(--ink)}
.palette-item small{margin-left:auto;color:var(--muted);font-size:11.5px}
.palette-item .icon{color:var(--muted)}
.palette-item.on{background:var(--soft)}.palette-item.on .icon{color:var(--gold)}
.palette-group{font:500 10.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);padding:10px 14px 4px}
.palette-foot{display:flex;gap:14px;padding:9px 18px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted)}
.palette-foot kbd{font:11px var(--mono);border:1px solid var(--line-2);border-radius:5px;padding:0 5px}

/* ---------- tableau de bord : à faire ---------- */
.qr-code{width:220px;margin:4px auto 10px;padding:0;background:#fff;border-radius:12px}.qr-code svg{display:block;width:100%;height:auto}
.todo{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.todo li{display:flex;align-items:center;gap:14px;padding:10px 12px;border-radius:11px;transition:background .15s var(--ease)}
.todo li:hover{background:var(--panel-2)}
.todo .count{min-width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font:500 15px var(--sans);background:var(--soft);color:var(--ink)}
.todo .count.bad{background:var(--bad-bg);color:var(--bad)}.todo .count.warn{background:var(--warn-bg);color:var(--warn)}.todo .count.ok{background:var(--ok-bg);color:var(--ok)}
.todo .what{flex:1;min-width:0}.todo .what b{font-weight:500;display:block}.todo .what small{color:var(--muted)}
.todo-done{display:flex;align-items:center;gap:10px;color:var(--ok);padding:14px 12px}
.stats-line{display:flex;flex-wrap:wrap;gap:6px 26px;font-size:13px;color:var(--muted);margin:-8px 0 22px}
.stats-line b{color:var(--ink);font-weight:500;font-variant-numeric:tabular-nums}

/* ---------- onglets (fiche d'affaire) ---------- */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line-2);margin:0 0 20px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.tabs button{background:none;border:0;border-radius:0;color:var(--muted);padding:10px 14px;box-shadow:none;position:relative;font-weight:500}
.tabs button:hover{background:none;color:var(--ink)}
.tabs button.on{color:var(--ink)}
.tabs button.on::after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:2px;background:var(--gold);border-radius:2px}
.tabs button:active{transform:none}
.tabs .badge{font:500 10.5px var(--sans);background:var(--bad-bg);color:var(--bad);border-radius:5px;padding:0 5px;margin-left:3px}

/* ---------- diagramme de Gantt ---------- */
:root{--g-label:250px;--g-weekend:rgba(23,33,31,.035)}
.gantt{overflow:auto;max-height:72vh;border-radius:12px;background:var(--panel);position:relative;box-shadow:inset 0 0 0 1px var(--line)}
.g-row{display:flex;min-height:36px;border-bottom:1px solid var(--line)}
.g-label{position:sticky;left:0;z-index:3;flex:0 0 var(--g-label);width:var(--g-label);background:var(--panel);border-right:1px solid var(--line);padding:6px 12px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.g-label a,.g-label span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
.g-label small{color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.g-l0 .g-label{background:var(--panel-2)}.g-l0 .g-label a{font-weight:600}.g-l0{background:var(--panel-2)}
.g-l1 .g-label{padding-left:20px}.g-l2 .g-label{padding-left:32px}.g-l2{min-height:28px}.g-l2 .g-label span{font-size:12px;color:var(--ink-2)}
[data-phase-row] .g-label,[data-assignment-row] .g-label{cursor:pointer}[data-phase-row] .g-label:hover,[data-assignment-row] .g-label:hover{background:var(--soft)}
.g-track{position:relative;flex:0 0 auto;background:var(--g-bg)}
.g-head{position:sticky;top:0;z-index:4;min-height:40px;background:var(--panel-2);border-bottom:1px solid var(--line-2)}
.g-head .g-label{background:var(--panel-2);z-index:5}.g-head .g-track{background:var(--panel-2)}
.g-month{position:absolute;top:4px;font:500 11px var(--sans);color:var(--ink);padding-left:5px;border-left:1px solid var(--line-2);white-space:nowrap}
.g-week{position:absolute;bottom:4px;font:10px var(--mono);color:var(--faint);padding-left:4px;border-left:1px solid var(--line)}
.g-body{position:relative}
.g-today{position:absolute;top:0;bottom:0;width:1.5px;background:var(--bad);z-index:2;pointer-events:none;opacity:.8}
.g-bar{position:absolute;top:8px;height:20px;border-radius:6px;background:#cfe3d6;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(23,33,31,.08)}
.g-bar i{position:absolute;inset:0 auto 0 0;background:rgba(16,45,40,.18)}
.g-bar span{position:relative;font:500 11px var(--sans);color:var(--ink);padding:0 7px;line-height:20px;white-space:nowrap;display:block;overflow:hidden;text-overflow:ellipsis}
.g-bar.ok{background:#a9d8b8}.g-bar.late{background:#f2b3a8}.g-bar.future{background:#c9d6e8}.g-bar.done{background:#dde3e0}.g-bar.none{display:none}
.g-bar.project{top:11px;height:14px;background:#174a3f}.g-bar.project.late{background:#ad3c2c}.g-bar.project span{color:#ffffff;line-height:14px;font-size:10.5px}
.g-bar.project i{background:rgba(255,255,255,.18)}
.g-bar.assign{top:6px;height:16px;background:var(--gold-soft);box-shadow:inset 0 0 0 1px #cfe5b4}.g-bar.assign span{line-height:16px;font-size:10.5px;color:#35655b}
.g-mark{position:absolute;top:11px;width:12px;height:12px;margin-left:-6px;background:var(--amber);transform:rotate(45deg);border-radius:2px;z-index:1;box-shadow:0 0 0 2px var(--panel)}
.g-mark.done{background:var(--ok)}
.legend-g{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;margin-top:10px}
.g-key{display:inline-block;width:18px;height:10px;border-radius:3px;margin-right:5px;vertical-align:middle}
.g-key.ok{background:#a9d8b8}.g-key.late{background:#f2b3a8}.g-key.future{background:#c9d6e8}.g-key.done{background:#dde3e0}.g-key.assign{background:var(--gold-soft);box-shadow:inset 0 0 0 1px rgba(23,74,63,.35)}
.g-key-mark{display:inline-block;width:9px;height:9px;background:var(--amber);transform:rotate(45deg);margin:0 5px 0 6px;border-radius:1px}
.late-txt{color:var(--bad);font-weight:500}
table.load th,table.load td{text-align:center;padding:6px 4px;font-size:12px;min-width:40px;border-bottom:1px solid var(--line)}table.load td:first-child,table.load th:first-child{text-align:left;min-width:130px}
table.load td.ok{background:#e3f1e8}table.load td.warn{background:var(--warn-bg);color:var(--warn);font-weight:600}table.load td.bad{background:var(--bad-bg);color:var(--bad);font-weight:700}
table.load .now{box-shadow:inset 0 0 0 1.5px var(--gold)}

/* ---------- guide ---------- */
.guide{list-style:none;margin:0;padding:0;display:grid;gap:14px;max-width:1000px}
.guide li{display:grid;grid-template-columns:52px 1fr;gap:16px;margin:0}
.guide-n{width:40px;height:40px;border-radius:12px;background:var(--soft);color:var(--forest);display:grid;place-items:center;font:700 16px/1 var(--mono);box-shadow:inset 0 0 0 1px #cfe5b4;background:var(--gold-soft)}
.guide h2{margin:6px 0 8px;font:700 17px var(--sans);letter-spacing:-.03em}.guide p{margin:0 0 10px;max-width:76ch;line-height:1.6}
.guide-example{background:var(--panel-2);border-radius:10px;padding:10px 14px;box-shadow:inset 2px 0 0 var(--gold)}

/* ---------- petits écrans ---------- */
.head select,.head label select{width:auto;min-width:150px}
.menu-btn{display:none}
@media(max-width:900px){
  .shell,body.rail .shell{grid-template-columns:1fr}
  .side{position:sticky;top:0;height:auto;max-height:100dvh;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px;padding:10px 14px}
  .brand{padding:0;flex:1}.brand small{display:none}
  .search-btn{order:3;width:100%;margin:8px 0 2px}.search-btn kbd{display:none}
  .menu-btn{display:inline-flex;background:#235247;border-color:#41625a;color:#e6efe9;box-shadow:none}
  .side > a,.group,.nav-items,.rail-btn,#side-footer{display:none}
  body.menu-open .side{overflow:auto}
  body.menu-open .side > a,body.menu-open .nav-items,body.menu-open .nav-items.closed{display:grid;width:100%;order:4}
  body.menu-open .group{display:flex;order:4}body.menu-open #side-footer{display:grid;width:100%;order:5}
  .side a.on::before{display:none}
  main{padding:20px 16px 56px}
  h1{font-size:30px}
  :root{--g-label:150px}
}

/* pièces justificatives */
.pieces{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:2px}
.piece{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:var(--panel-2);flex-wrap:wrap}
.piece .icon{color:var(--forest)}.piece a{font-weight:500}.piece small{color:var(--muted)}
.piece .hash{margin-left:auto;font:11px var(--mono);color:var(--faint)}
.file-btn{cursor:pointer}.file-btn input{display:none}
.icon.tiny{width:13px;height:13px;vertical-align:-2px}
.dialog-pieces{border-top:1px solid var(--line);padding-top:14px}.dialog-pieces h2{font-size:14px!important;margin:0 0 10px!important}
.ik-row,.asset-row{background:var(--panel-2);border-radius:10px;padding:10px 12px}
.quick{display:grid;gap:10px}.quick .btn,.quick button{justify-content:flex-start;border-radius:12px;padding:11px 14px}
.members{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.member{padding:9px 12px;border-radius:10px;background:var(--panel-2);box-shadow:inset 0 0 0 1px var(--line);align-items:flex-start}
.member.on{background:var(--gold-soft);box-shadow:inset 0 0 0 1px #cfe5b4}.member span{display:grid;gap:1px}.member small{color:var(--muted);font-size:11.5px}