:root{
  /* Charte graphique Life Support Distribution */
  --brand:#29327a; --brand-2:#2778bd; --brand-grey:#c6c6c6;
  --bg:#F3F4F8; --surface:#FFFFFF; --surface-2:#F4F6FB; --ink:#29327a; --muted:#6B7099;
  --line:#E0E1E8; --line-strong:#C6C6C6;
  --accent:#29327a; --accent-ink:#FFFFFF; --accent-soft:#E6EFF8;
  --ok:#1F7F55; --warn:#A96B06; --warn-soft:#FBF0DA; --bad:#B3312A; --bad-soft:#F8E1DF;
  --cell:#E0E1E8; --dock-bg:#29327a; --dock-ink:#FFFFFF;
  --r-s:18px; --r-l:36px;
  --font:"Barlow Semi Condensed", "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-c:"DIN Condensed", "DINCondensed-Bold", "Barlow Condensed", "Barlow Semi Condensed", system-ui, sans-serif;
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 64px);-webkit-text-size-adjust:100%}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.45;padding-bottom:96px}
img{max-width:100%}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* En-tête */
.top{background:var(--surface);border-bottom:1px solid var(--line)}
.top-in{max-width:980px;margin:0 auto;padding:18px 20px 14px;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:flex-end;justify-content:space-between}
.brand h1{margin:0;font-family:var(--font-c);font-weight:700;font-size:1.8rem;line-height:1.1;letter-spacing:-.01em}
.brand p{margin:4px 0 0;color:var(--muted);font-size:.95rem}
.top-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.btn{font:inherit;font-weight:600;font-size:.95rem;border-radius:6px;border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);padding:8px 14px;min-height:40px;cursor:pointer;text-decoration:none}
.btn:hover{border-color:var(--ink)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent}
.btn.small{padding:5px 10px;min-height:34px;font-size:.88rem}
.btn.danger{color:var(--bad)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.switch{display:inline-flex;gap:8px;align-items:center;font-weight:600;font-size:.95rem;padding:0 8px;min-height:40px;cursor:pointer;border:1px solid var(--line-strong);border-radius:6px}
.switch input{width:18px;height:18px;margin:0;accent-color:var(--accent)}

/* Étapes */
.steps{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg);border-bottom:1px solid var(--line)}
.steps-in{max-width:980px;margin:0 auto;padding:0 10px;display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.steps-in::-webkit-scrollbar{display:none}
.steps button{font:inherit;font-family:var(--font-c);font-weight:600;font-size:1.02rem;background:none;border:0;border-bottom:3px solid transparent;padding:13px 12px 10px;color:var(--muted);white-space:nowrap;cursor:pointer;display:flex;gap:8px;align-items:center}
.steps button .n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1.5px solid currentColor;font-size:.8rem;line-height:1}
.steps button[aria-current="step"]{color:var(--ink);border-bottom-color:var(--accent)}
.steps button[aria-current="step"] .n{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.steps button.tar{margin-left:auto}

/* Contenu */
main{max-width:980px;margin:0 auto;padding:22px 20px 40px}
.zf-banner{display:none;margin-bottom:18px;padding:12px 16px;border-radius:6px;background:var(--accent-soft);border-left:4px solid var(--accent);font-size:.93rem}
body.zf-on .zf-banner{display:block}
.sec-h h2{font-family:var(--font-c);font-size:1.55rem;margin:0 0 4px;font-weight:700;line-height:1.15}
.sec-h p{margin:0 0 18px;color:var(--muted);max-width:68ch}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:20px}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 22px}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field.wide{grid-column:1/-1}
.field[hidden]{display:none}
.fhead{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.lbl{font-weight:600;font-size:.95rem}
.req{color:var(--bad)}
.help{margin:0;color:var(--muted);font-size:.85rem}
.help.sugg{color:var(--accent);font-weight:600}
.zf{display:none;font-size:.72rem;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:4px;padding:2px 6px;white-space:nowrap}
body.zf-on .zf{display:inline-block}
.zf-note{display:none;margin:0 0 14px;font-size:.9rem;color:var(--accent);font-weight:600}
body.zf-on .zf-note{display:block}

input[type=text],input[type=email],input[type=tel],input[type=date],input[type=number],select,textarea{
  font:inherit;font-size:1rem;color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:6px;padding:9px 11px;min-height:44px;width:100%;min-width:0}
textarea{resize:vertical;min-height:84px}
input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px var(--accent-soft)}
.unitwrap{display:flex;align-items:stretch}
.unitwrap input:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.unit{display:grid;place-items:center;padding:0 12px;border:1px solid var(--line-strong);border-left:0;border-radius:0 6px 6px 0;background:var(--surface-2);color:var(--muted);font-size:.9rem;white-space:nowrap}
.stepper{display:flex;align-items:stretch;max-width:210px}
.stepper input{text-align:center;border-radius:0;-moz-appearance:textfield;appearance:textfield;font-family:var(--font-c);font-weight:700;font-size:1.2rem}
.stepper input::-webkit-inner-spin-button,.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.st{font:inherit;font-size:1.35rem;line-height:1;width:50px;min-height:44px;border:1px solid var(--line-strong);background:var(--surface-2);color:var(--ink);cursor:pointer}
.st:first-child{border-radius:6px 0 0 6px;border-right:0}
.st:last-child{border-radius:0 6px 6px 0;border-left:0}
.st:active{background:var(--accent-soft)}
.seg{display:inline-flex;flex-wrap:wrap;border:1px solid var(--line-strong);border-radius:6px;overflow:hidden;align-self:flex-start;max-width:100%}
.seg button{font:inherit;font-size:.95rem;font-weight:500;background:var(--surface);color:var(--ink);border:0;border-right:1px solid var(--line-strong);padding:9px 14px;min-height:44px;cursor:pointer}
.seg button:last-child{border-right:0}
.seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);font-weight:600}
.photo{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.pcount{color:var(--muted);font-size:.9rem}
.formula{display:block;background:var(--surface-2);border:1px dashed var(--line-strong);border-radius:6px;padding:10px 12px;font-size:.93rem;min-height:44px}
.sec-nav{display:flex;justify-content:space-between;gap:10px;margin-top:18px;flex-wrap:wrap}
.sec-nav .btn{min-height:44px}

/* Salles */
.room{background:var(--surface);border:1px solid var(--line);border-radius:10px;margin-bottom:18px;overflow:hidden}
.room-h{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:12px 18px;background:var(--surface-2);border-bottom:1px solid var(--line)}
.room-n{font-family:var(--font-c);font-weight:700;font-size:1.1rem;min-width:34px;height:34px;display:grid;place-items:center;border-radius:6px;background:var(--ink);color:var(--surface)}
.room-h h3{margin:0;font-family:var(--font-c);font-size:1.25rem;font-weight:700;flex:1 1 160px;min-width:0;overflow-wrap:anywhere}
.room-chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{font-size:.85rem;font-weight:600;padding:3px 8px;border-radius:4px;background:var(--surface);border:1px solid var(--line);font-variant-numeric:tabular-nums;white-space:nowrap}
.chip.strong{border-color:var(--accent);color:var(--accent)}
.room-act{display:flex;gap:6px}
.rgroup{padding:16px 18px;border-bottom:1px solid var(--line)}
.rgroup:last-child{border-bottom:0}
.rgroup h4{margin:0 0 12px;font-size:1rem;font-weight:600;color:var(--muted)}
.btn.add{width:100%;border-style:dashed;min-height:56px;font-size:1rem}

/* Synthèse */
.verdict{display:grid;grid-template-columns:1.35fr 1fr;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface)}
.v-main{padding:20px 22px;border-left:6px solid var(--accent)}
.tier-analog .v-main{border-left-color:var(--ok)}
.tier-hors .v-main{border-left-color:var(--bad)}
.v-price{padding:20px 22px;background:var(--surface-2);border-left:1px solid var(--line)}
.v-label{margin:0 0 4px;color:var(--muted);font-size:.9rem;font-weight:500}
.v-tier{margin:0;font-family:var(--font-c);font-size:2.1rem;font-weight:700;line-height:1.08}
.v-reason{margin:10px 0 0;max-width:62ch}
.v-range{margin:0;font-family:var(--font-c);font-size:1.95rem;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.12}
.v-range span{font-size:1rem;color:var(--muted);font-weight:600}
.v-sub{margin:6px 0 0;color:var(--muted);font-size:.88rem}
.v-sub.miss{color:var(--bad);font-weight:600}
.block{margin-top:18px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:18px 20px}
.block h3{margin:0 0 4px;font-family:var(--font-c);font-size:1.2rem;font-weight:700}
.block > p.lead{margin:0 0 14px;color:var(--muted);font-size:.9rem;max-width:70ch}
.lrow,.marks{display:grid;grid-template-columns:70px minmax(0,1fr) 70px;align-items:center;gap:10px}
.lrow{margin-bottom:8px}
.lname{font-weight:600;font-size:.9rem}
.cells,.mk{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:2px}
.cells{height:20px}
.cells i{background:var(--cell);border-radius:1px;position:relative}
.cells i.on{background:var(--accent)}
.cells i.res{background:repeating-linear-gradient(135deg,var(--accent) 0 2px,transparent 2px 5px);opacity:.7}
.cells i.an::after{content:"";position:absolute;right:-2px;top:-5px;bottom:-5px;width:2px;background:var(--ok)}
.lval{font-family:var(--font-c);font-weight:700;font-size:1.1rem;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.lval small{color:var(--muted);font-weight:600;font-size:.85rem}
.mk span{border-top:2px solid var(--line-strong);padding-top:4px;font-size:.8rem;font-weight:600;color:var(--muted);text-align:center;margin:0 1px;white-space:nowrap;overflow:hidden}
.mk span.act{border-top-color:var(--accent);color:var(--accent)}
.legend{margin:12px 0 0;color:var(--muted);font-size:.85rem}
.over{color:var(--bad);font-weight:700}
.alerts{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.alerts li{padding:10px 14px;border-radius:6px;background:var(--warn-soft);border-left:4px solid var(--warn);font-size:.95rem}
.alerts li.miss{background:var(--bad-soft);border-left-color:var(--bad)}
.none{margin:0;color:var(--ok);font-weight:600}
.alerts li.reco{background:var(--accent-soft);border-left-color:var(--accent)}
.block.first{margin-top:0;margin-bottom:18px}
.block.ok h3{color:var(--ok)}
.chip.warn{border-color:var(--bad);color:var(--bad)}
.chip.ok{border-color:var(--ok);color:var(--ok)}
.dock .d-miss.todo strong{color:#FFB4A8}
.split{margin-top:18px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:10px;background:var(--surface);overflow:hidden}
.split > div{padding:14px 16px;border-right:1px solid var(--line);min-width:0}
.split > div:last-child{border-right:0}
.split .k{color:var(--muted);font-size:.88rem;margin:0}
.split .v{font-family:var(--font-c);font-weight:700;font-size:1.4rem;margin:2px 0 0;font-variant-numeric:tabular-nums}
.split .s{color:var(--muted);font-size:.82rem;margin:2px 0 0}
details.bom{margin-top:18px;background:var(--surface);border:1px solid var(--line);border-radius:10px}
details.bom summary{padding:14px 20px;font-weight:600;cursor:pointer}
.tblwrap{overflow-x:auto;padding:0 20px 16px}
table{width:100%;border-collapse:collapse;font-size:.92rem;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--muted);font-weight:600}
td.n,th.n{text-align:right;white-space:nowrap}
tr.cat td{font-weight:700;background:var(--surface-2)}
tr.tot td{font-weight:700;border-bottom:0}
.fiche h4{margin:18px 0 8px;font-size:1rem;font-weight:700}
.fiche h4:first-of-type{margin-top:8px}
.fiche dl{display:grid;grid-template-columns:minmax(140px,36%) minmax(0,1fr);gap:4px 16px;margin:0;font-size:.93rem}
.fiche dt{color:var(--muted)}
.fiche dd{margin:0;overflow-wrap:anywhere;white-space:pre-line}
.syn-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}

/* Tarifs */
.banner{background:var(--warn-soft);border-left:4px solid var(--warn);padding:12px 16px;border-radius:6px;margin-bottom:20px;font-size:.95rem}
.tgroup{margin-bottom:24px}
.tgroup h3{font-family:var(--font-c);font-size:1.2rem;margin:0 0 10px}
.tgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}
.trow{display:grid;grid-template-columns:minmax(0,1fr) 160px;align-items:center;gap:10px}
.trow label{font-size:.92rem}

/* Barre d'estimation */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--dock-bg);color:var(--dock-ink);padding-bottom:env(safe-area-inset-bottom,0px)}
.dock-in{max-width:980px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:24px}
.dock .d-k{display:block;font-size:.78rem;opacity:.72}
.dock strong{font-family:var(--font-c);font-size:1.18rem;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.dock .d-price{margin-left:auto;text-align:right}
.dock .btn{border-color:transparent}
.dock .btn.primary{background:var(--dock-ink);color:var(--dock-bg)}

.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--dock-bg);color:var(--dock-ink);padding:10px 16px;border-radius:8px;display:flex;gap:14px;align-items:center;z-index:40;opacity:0;pointer-events:none;transition:opacity .18s;max-width:calc(100% - 24px)}
.toast.show{opacity:1;pointer-events:auto}
.toast button{font:inherit;font-weight:700;background:none;border:0;color:inherit;text-decoration:underline;cursor:pointer;padding:4px}


/* Choix fixe ou mobile */
.q-big{font-family:var(--font-c);font-size:1.3rem;font-weight:700;margin:0 0 12px}
.choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:26px}
.choice{font:inherit;text-align:left;background:var(--surface);border:2px solid var(--line);border-radius:10px;padding:14px;cursor:pointer;color:var(--ink);display:flex;flex-direction:column;gap:6px}
.choice:hover{border-color:var(--line-strong)}
.choice .pic{width:100%;aspect-ratio:16/10;border-radius:6px;overflow:hidden;background:var(--surface-2);display:grid;place-items:center;color:var(--muted);margin-bottom:6px}
.choice .pic img{width:100%;height:100%;object-fit:cover;display:block}
.choice .pic svg{width:72%;height:auto}
.choice strong{font-family:var(--font-c);font-size:1.35rem;line-height:1.15}
.choice span.d{color:var(--muted);font-size:.95rem}
.choice[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
.choice[aria-pressed="true"] strong::after{content:" ✓";color:var(--accent)}
.h-sub{font-family:var(--font-c);font-size:1.2rem;font-weight:700;margin:0 0 12px}

/* Contenu de la valise */
.kit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px;align-items:start;margin-bottom:18px}
.kit img{width:100%;border-radius:8px;display:block}
.kit h3{margin:0 0 8px;font-family:var(--font-c);font-size:1.2rem}
.kit ul{margin:0;padding-left:1.1em}
.kit li{margin-bottom:4px}
.kit p{margin:10px 0 0;color:var(--muted);font-size:.92rem}

/* Jauge de taille */
.gauge{position:relative;height:22px;border-radius:4px;background:var(--cell);overflow:hidden}
.gfill{position:absolute;left:0;top:0;bottom:0;background:var(--accent);border-radius:4px 0 0 4px}
.gfill.over{background:var(--bad)}
.gsep{position:absolute;top:0;bottom:0;width:2px;background:var(--surface)}
.glabels{display:flex;margin-top:6px}
.glabels span{font-size:.85rem;font-weight:600;color:var(--muted);text-align:center;border-top:2px solid var(--line-strong);padding-top:4px;margin-right:2px}
.glabels span.act{color:var(--accent);border-top-color:var(--accent)}
.v-ref{margin:6px 0 0;font-size:.9rem;color:var(--muted)}
.v-ref strong{color:var(--ink);font-weight:600}
.compo{margin:0;padding-left:1.1em}
.compo li{margin-bottom:4px}
.compo li.opt{color:var(--accent);font-weight:600}
.empty{padding:28px 20px;text-align:center;color:var(--muted);background:var(--surface);border:1px dashed var(--line-strong);border-radius:10px}
@media (max-width:640px){
  .choices{grid-template-columns:minmax(0,1fr)}
  .choice .pic{aspect-ratio:16/9}
  .kit{grid-template-columns:minmax(0,1fr)}
}


/* ---------- Connexion ---------- */
.boot{min-height:100vh;display:grid;place-items:center;color:var(--muted)}
.auth{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px 16px}
.auth[hidden],#app[hidden],.boot[hidden]{display:none}
.auth-card{width:100%;max-width:420px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:28px 26px}
.auth-brand{display:flex;gap:14px;align-items:center;margin-bottom:26px}
.auth-brand img{width:52px;height:52px;border-radius:12px;flex:none}
.auth-card h1{margin:0;font-family:var(--font-c);font-size:1.65rem;line-height:1.1}
.auth-brand p{margin:3px 0 0;color:var(--muted);font-size:.92rem}
.auth-card .field{margin-bottom:16px}
.auth-card .field[hidden]{display:none}
input.pin{font-family:var(--font-c);font-size:1.7rem;font-weight:600;letter-spacing:.55em;text-align:center;padding-left:.55em;min-height:56px}
input.pin::placeholder{color:var(--line-strong);letter-spacing:.3em}
.auth-err{min-height:1.4em;margin:0 0 12px;color:var(--bad);font-weight:600;font-size:.93rem}
.btn.big{width:100%;min-height:52px;font-size:1.05rem}
.auth-help{margin:20px 0 0;color:var(--muted);font-size:.88rem}
.auth-intro{margin:8px 0 22px;color:var(--muted)}
.auth-actions{display:flex;flex-direction:column;gap:10px}
.auth-actions .btn[hidden]{display:none}

/* ---------- En-tête : utilisateur, réseau, envois en attente ---------- */
.menu-wrap{position:relative}
.menu{position:absolute;right:0;top:calc(100% + 6px);z-index:50;min-width:270px;background:var(--surface);border:1px solid var(--line-strong);border-radius:8px;padding:6px;box-shadow:0 10px 30px rgba(15,20,26,.18)}
.menu[hidden]{display:none}
.menu button{display:block;width:100%;text-align:left;font:inherit;font-size:.95rem;background:none;border:0;border-radius:6px;padding:11px 12px;color:var(--ink);cursor:pointer}
.menu button:hover,.menu button:focus-visible{background:var(--surface-2)}
.menu hr{border:0;border-top:1px solid var(--line);margin:6px 4px}
.menu .be-only{display:none}
body.role-be .menu .be-only{display:block}
.netchip{font-weight:600;font-size:.88rem;padding:7px 10px;border-radius:6px;background:var(--warn-soft);color:var(--warn)}
.netchip[hidden],#queueChip[hidden],#backToForm[hidden]{display:none}
#queueChip{border-color:var(--warn);color:var(--warn)}
.userbtn{display:inline-flex;align-items:center;gap:8px}
.userbtn .ini{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--surface);font-size:.78rem;font-weight:700}
.steps[hidden],.dock[hidden]{display:none}

/* ---------- Photos ---------- */
.thumbs{display:flex;flex-wrap:wrap;gap:8px;width:100%}
.thumbs:empty{display:none}
.thumb{position:relative;width:150px;margin:0;display:flex;flex-direction:column;gap:4px}
.thumb-img{position:relative;display:block;width:150px;height:112px;border-radius:6px;overflow:hidden;border:1px solid var(--line);background:var(--surface-2)}
.thumb-img img{width:100%;height:100%;object-fit:cover;display:block}
.thumbs input.thumb-cap{font-size:.85rem;min-height:34px;padding:5px 8px;width:150px}
.thumb-x{position:absolute;top:4px;right:4px;width:28px;height:28px;border-radius:50%;border:0;background:rgba(22,32,42,.82);color:#fff;font-size:1.05rem;line-height:1;cursor:pointer}

/* ---------- Listes, détail, utilisateurs ---------- */
.list td,.list th{vertical-align:middle}
.list tr[data-id]{cursor:pointer}
.list tr[data-id]:hover td{background:var(--surface-2)}
.tag{display:inline-block;font-size:.8rem;font-weight:600;padding:2px 8px;border-radius:4px;border:1px solid var(--line-strong);white-space:nowrap}
.tag.nouveau{border-color:var(--accent);color:var(--accent)}
.tag.en_etude{border-color:var(--warn);color:var(--warn)}
.tag.traite{border-color:var(--ok);color:var(--ok)}
.tag.bad{border-color:var(--bad);color:var(--bad)}
.tag.muted{color:var(--muted)}
.plain{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px}
.detail-head{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:flex-end;justify-content:space-between;margin-bottom:18px}
.detail-head h2{margin:0;font-family:var(--font-c);font-size:1.6rem;line-height:1.15}
.detail-head p{margin:4px 0 0;color:var(--muted)}
.status-pick{display:flex;flex-direction:column;gap:6px;min-width:220px}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.gallery figure{margin:0}
.gallery a{display:block}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;display:block;border:1px solid var(--line)}
.gallery figcaption{font-size:.82rem;color:var(--muted);margin-top:4px}
.adduser{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin-top:14px}
.adduser .field{flex:1 1 220px}
.adduser .btn{min-height:44px}
.row-actions{display:flex;gap:6px;flex-wrap:wrap}
.modal{position:fixed;inset:0;z-index:60;background:rgba(15,20,26,.55);display:grid;place-items:center;padding:16px}
.modal[hidden]{display:none}
.modal-card{background:var(--surface);border-radius:12px;padding:24px;max-width:440px;width:100%}
.modal-card h3{margin:0 0 8px;font-family:var(--font-c);font-size:1.35rem}
.modal-card p{margin:0 0 18px;color:var(--muted)}
.modal-card .syn-actions{margin-top:0}
@media (max-width:640px){
  .top-actions .btn.ghost.hide-sm{display:none}
  .detail-head{align-items:flex-start}
}


/* ---------- Articles illustrés (valise mobile) ---------- */
.field.has-img{flex-direction:row;gap:14px;align-items:flex-start}
.fimgs{flex:none;display:flex;flex-direction:column;gap:6px}
.fimgs:empty{display:none}
.fimgs img{width:104px;height:78px;object-fit:cover;border-radius:6px;border:1px solid var(--line);background:#fff;display:block}
.fbody{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.articles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.art{display:flex;gap:10px;align-items:center;min-width:0}
.art img{width:84px;height:63px;object-fit:cover;border-radius:6px;border:1px solid var(--line);background:#fff;flex:none}
.art strong{display:block;font-size:.92rem;line-height:1.25}
.art span{display:block;font-size:.84rem;color:var(--muted)}
.compo{list-style:none;padding-left:0}
.compo li{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.cimg{width:64px;height:48px;object-fit:cover;border-radius:5px;border:1px solid var(--line);background:#fff;flex:none}
span.cimg{border:0;background:none}
@media (max-width:640px){
  .articles{grid-template-columns:minmax(0,1fr)}
  .fimgs img{width:84px;height:63px}
}


/* ---------- Remplissage de la valise ---------- */
.rack{margin-top:14px;border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--surface-2)}
.rack-h{display:flex;justify-content:space-between;gap:10px;margin:0 0 8px!important;font-size:.9rem;color:var(--ink)!important}
.rack-h span{color:var(--muted);font-variant-numeric:tabular-nums}
.slot{display:flex;align-items:center;gap:10px;min-height:34px;padding:4px 10px;margin-bottom:4px;border-radius:4px;background:var(--dock-bg);color:var(--dock-ink);font-size:.86rem;font-weight:600;line-height:1.2}
.slot .u{font-family:var(--font-c);opacity:.55;font-size:.78rem;min-width:14px}
.slot.free{background:transparent;border:1px dashed var(--line-strong);color:var(--muted);font-weight:500}
.slot.over{background:var(--bad);color:#fff}


/* ---------- Plans d’architecte ---------- */
.files{display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%}
.files > .btn{align-self:flex-start}
.filelist{list-style:none;margin:0;padding:0;display:grid;gap:8px;width:100%}
.filelist:empty{display:none}
.filelist li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:8px 10px;background:var(--surface-2);border:1px solid var(--line);border-radius:0 0 10px 0}
.filelist .ext{font-family:var(--font-c);font-weight:700;font-size:.8rem;letter-spacing:.03em;color:#fff;background:var(--brand-2);padding:3px 7px;border-radius:0 0 6px 0;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.filelist .fname{font-weight:600;overflow-wrap:anywhere}
.filelist .fname a{color:var(--brand)}
.filelist .fsize{color:var(--muted);font-weight:400;font-size:.85rem;white-space:nowrap}
.filelist .fcap{display:block;color:var(--muted);font-weight:400;font-size:.88rem}
.filelist .fdel{width:32px;height:32px;border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);border-radius:0 0 6px 0;font-size:1.1rem;cursor:pointer}
.filelist input.thumb-cap{grid-column:2 / 4;width:100%;min-height:34px;padding:5px 8px;font-size:.88rem}
.filelist.dl li{grid-template-columns:auto minmax(0,1fr)}


/* ---------- Projets étudiés (installation fixe) ---------- */
.modules{margin:6px 0 26px}
.modules[hidden]{display:none}
.mods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.mod{font:inherit;text-align:left;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:14px 16px;background:var(--surface);color:var(--ink);border:2px solid var(--line);border-radius:0 0 var(--r-s) 0;cursor:pointer}
.mod svg{grid-row:1 / 3;width:40px;height:40px;color:var(--muted)}
.mod strong{font-family:var(--font-c);font-size:1.15rem}
.mod span{font-size:.88rem;color:var(--muted)}
.mod[aria-pressed="true"]{border-color:var(--brand-2);background:#EEF5FB}
.mod[aria-pressed="true"] svg{color:var(--brand-2)}
.mod[aria-pressed="true"] strong::after{content:" ✓";color:var(--brand-2)}
.mod-hint{margin:12px 0 0;padding:10px 14px;background:#EEF5FB;border-left:4px solid var(--brand-2);border-radius:0 0 8px 0;color:var(--ink)}
.mod-hint[hidden]{display:none}
.part-h{font-family:var(--font-c);font-size:1.3rem;color:var(--brand-2);margin:26px 0 10px}
@media (max-width:640px){ .mods{grid-template-columns:minmax(0,1fr)} }


/* ---------- Conseil caméras (vidéodébriefing) ---------- */
.cam-ok{display:inline-block;color:var(--ok);font-weight:600}
.cam-free{color:var(--muted)}
output.formula .btn.small{margin-left:6px;vertical-align:middle}

/* responsive */
@media (max-width:720px){
  .verdict{grid-template-columns:1fr}
  .v-price{border-left:0;border-top:1px solid var(--line)}
  .split{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split>div:nth-child(2){border-right:0}
  .split>div:nth-child(-n+2){border-bottom:1px solid var(--line)}
}
@media (max-width:640px){
  main{padding:16px 12px 40px}
  .top-in{padding:14px 14px 12px}
  .brand h1{font-size:1.5rem}
  .panel{padding:14px}
  .grid,.tgrid{grid-template-columns:minmax(0,1fr)}
  .rgroup{padding:14px}
  .room-h{padding:12px 14px}
  .lrow,.marks{grid-template-columns:52px minmax(0,1fr) 48px;gap:6px}
  .cells,.mk{gap:1px}
  .mk span{font-size:.68rem}
  .dock .d-tier{display:none}
  .dock-in{gap:12px;padding:8px 12px}
  .dock .btn{padding:8px 10px;font-size:.88rem}
  .fiche dl{grid-template-columns:minmax(0,1fr)}
  .fiche dd{margin-bottom:6px}
  .trow{grid-template-columns:minmax(0,1fr) 130px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{
  body{background:#fff;color:#000;padding:0}
  .top-actions,.steps,.dock,.toast,.syn-actions,.zf-banner,.sec-nav{display:none!important}
  main > section{display:none!important}
  body:not(.print-detail) main > #sec-resume{display:block!important}
  body.print-detail main > #sec-detail{display:block!important}
  .top,.menu,.detail-head .status-pick{display:none!important}
  .verdict,.split{break-inside:avoid}
  .block{break-inside:auto}
  .alerts li,.compo li,.gallery figure,.fiche dt,.fiche dd{break-inside:avoid}
  .block h3,.fiche h4,.gallery + h4,.block h4{break-after:avoid}
  .gallery{grid-template-columns:repeat(4,minmax(0,1fr))}
}


/* =====================================================================
   Charte graphique Life Support Distribution
   Bleu foncé #29327a, bleu clair #2778bd, gris #c6c6c6, blanc.
   Titres en DIN Condensed Bold (Barlow Condensed si la DIN n'est pas installée).
   Formes rectangulaires avec un seul coin arrondi, en bas à droite.
   ===================================================================== */
h1,h2,h3,h4,.v-tier,.v-range,.lval,.split .v,.dock strong,.q-big,.h-sub,.room-h h3,.choice strong,.detail-head h2{font-family:var(--font-c);letter-spacing:.01em}
:focus-visible{outline-color:var(--brand-2)}

/* En-tête : bandeau bleu, logo en version inversée */
.top{background:var(--brand);border-bottom:0;color:#fff;border-radius:0 0 var(--r-l) 0}
.top-in{align-items:center;padding:16px 20px 18px}
.brand{display:flex;align-items:center;gap:18px;min-width:0}
.brand-logo{height:48px;width:auto;display:block;flex:none}
.brand-sep{width:1px;align-self:stretch;background:rgba(255,255,255,.3);flex:none}
.brand h1{color:#fff;font-size:1.75rem;font-weight:700}
.brand p{color:rgba(255,255,255,.78);margin-top:2px}
.top .btn{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.top .btn:hover{border-color:#fff}
.top .userbtn .ini{background:#fff;color:var(--brand)}
.top .netchip{background:#FBF0DA}
.top #queueChip{color:#FFD58A;border-color:#FFD58A}

/* Boutons et commandes : coin inférieur droit arrondi */
.btn{border-radius:0 0 10px 0}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{background:#222a68;filter:none}
.btn:hover{border-color:var(--brand)}
.seg{border-radius:0 0 10px 0;border-color:var(--line-strong)}
.seg button[aria-pressed="true"]{background:var(--brand-2);color:#fff}
.st:first-child{border-radius:0}
.st:last-child{border-radius:0 0 10px 0}
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=number],select,textarea{border-radius:3px}
.unitwrap input:not(:last-child){border-radius:3px 0 0 3px}
.unit{border-radius:0 3px 3px 0}
input:focus,select:focus,textarea:focus{border-color:var(--brand-2);box-shadow:0 0 0 3px rgba(39,120,189,.18)}

/* Étapes */
.steps{background:var(--bg);border-bottom:0}
.steps button[aria-current="step"]{color:var(--brand);border-bottom-color:var(--brand-2)}
.steps button[aria-current="step"] .n{background:var(--brand);border-color:var(--brand);color:#fff}

/* Titres de section en onglet, comme « 01 Logotype » dans la charte */
.sec-h h2{display:inline-flex;align-items:baseline;gap:10px;background:var(--brand);color:#fff;padding:9px 22px 8px;border-radius:0 0 var(--r-s) 0;font-size:1.6rem;margin:0 0 10px}
.sec-h h2 .num{color:var(--brand-2)}
.sec-h h2 .num:empty{display:none}

/* Cartes : un seul coin arrondi, en bas à droite */
.panel,.block,.room,.split,details.bom,.empty,.rack,.modal-card,.menu,.formula{border-radius:0 0 var(--r-s) 0}
.choice{border-radius:0 0 var(--r-s) 0}
.choice .pic,.kit img{border-radius:0 0 12px 0}
.choice[aria-pressed="true"]{border-color:var(--brand-2);background:#EEF5FB}
.choice[aria-pressed="true"] strong::after{color:var(--brand-2)}
.room-h{background:var(--surface-2)}
.room-n{background:var(--brand);color:#fff;border-radius:0 0 8px 0}
.rgroup h4{color:var(--brand-2);font-family:var(--font-c);font-size:1.15rem;font-weight:700}
.block h3,.detail-head h2,.v-tier,.h-sub,.q-big{color:var(--brand)}
.alerts li{border-radius:0 0 8px 0}
.alerts li.reco{background:#E6EFF8;border-left-color:var(--brand-2)}
.tag{border-radius:0 0 6px 0}
.chip{border-radius:0 0 6px 0}
.slot{border-radius:0 0 6px 0}

/* Piste envisagée : l’ordre de grandeur dans un bloc bleu */
.verdict{border:0;border-radius:0 0 var(--r-l) 0}
.v-main{border-left:6px solid var(--brand-2)}
.v-price{background:var(--brand);color:#fff;border-left:0}
.v-price .v-label{color:rgba(255,255,255,.75)}
.v-price .v-range{color:#fff}
.v-price .v-range span,.v-price .v-sub{color:rgba(255,255,255,.78)}
.v-price .v-sub.miss{color:#FFB4A8}

/* Barre du bas et messages */
.dock{background:var(--brand)}
.dock .btn.primary{background:#fff;color:var(--brand);border-color:#fff}
.toast{background:var(--brand)}

/* Connexion : fond bleu et logo inversé, carte blanche */
.boot{background:var(--brand);color:#fff}
.auth{background:var(--brand)}
.auth-wrap{width:100%;max-width:420px;display:flex;flex-direction:column;align-items:stretch}
.auth-logo{display:block;width:min(300px,78%);height:auto;margin:0 auto 28px}
.auth-card{border:0;border-radius:0 0 var(--r-l) 0}
.auth-card h1{color:var(--brand)}
.auth-sub{margin:4px 0 24px;color:var(--brand-2);font-size:1.05rem}

@media (max-width:640px){
  .brand-logo{height:34px}
  .brand-sep,.brand p{display:none}
  .brand h1{font-size:1.35rem}
  .top{border-radius:0 0 var(--r-s) 0}
  .sec-h h2{font-size:1.35rem;padding:8px 16px 7px}
}

/* Impression et PDF : en-tête avec le logo couleur */
.print-brand{display:none}
@media print{
  body{background:#fff}
  .print-brand{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 12px;margin:0 0 18px;border-bottom:3px solid var(--brand-2)}
  .print-brand img{height:46px;width:auto}
  .print-brand div{text-align:right}
  .print-brand strong{display:block;font-family:var(--font-c);font-size:1.45rem;color:var(--brand)}
  .print-brand span{color:var(--brand-2);font-size:.95rem}
  .verdict,.v-price,.v-main,.sec-h h2,.room-n,.alerts li,.tag,.slot{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}