/* connexion */
.login{min-height:calc(100vh - 140px);display:grid;place-items:center;padding-block:32px}
.login .box{width:100%;max-width:420px;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:26px 22px;display:grid;gap:16px}
.login h1{font-family:var(--f-display);font-size:34px;line-height:1.05;margin:0}
.login p{margin:0;color:var(--muted)}
.fld{display:grid;gap:5px}
.fld label{font-weight:600;font-size:14.5px}
.fld input,.fld textarea,.fld select{width:100%;font:15px var(--f-body);color:var(--ink);background:var(--field);border:1px solid var(--rule);border-radius:4px;padding:10px 11px}
.fld .e{font-size:13px;color:var(--primer)}
.sent{background:var(--ok-soft);border-radius:4px;padding:12px;display:grid;gap:8px}
.sep{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}
.sep::before,.sep::after{content:"";flex:1;border-top:1px solid var(--rule)}
.alt{display:grid;gap:8px}

/* espace client */
.switch{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.switch button{font:600 14px var(--f-body);border:1px solid var(--rule);background:var(--surface);color:var(--muted);border-radius:99px;padding:6px 14px;cursor:pointer}
.switch button[aria-pressed="true"]{border-color:var(--ink);color:var(--ink)}
.hero{margin-top:18px;display:grid;gap:6px}
.ref{font:12.5px var(--f-mono);letter-spacing:.05em;color:var(--muted);text-transform:uppercase}
.hero h1{font-family:var(--f-display);font-weight:700;font-size:clamp(2rem,5.5vw,3rem);line-height:1.02;margin:0;text-wrap:balance}
.hero .state{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;font-size:15.5px}
.pill{display:inline-flex;align-items:center;gap:6px;font:700 13px var(--f-body);padding:3px 10px;border-radius:99px;background:var(--primer-soft);color:var(--primer)}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.warn{background:var(--warn-soft);color:var(--warn)}
.pill.mute{background:var(--field);color:var(--muted);border:1px solid var(--rule)}

/* frise */
.track{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0}
.track li{position:relative;padding:22px 8px 0 0;min-width:0}
.track li::before{content:"";position:absolute;top:7px;left:0;right:0;height:3px;background:var(--rule)}
.track li.done::before{background:var(--steel)}
.track li.cur::before{background:linear-gradient(90deg,var(--primer) 50%,var(--rule) 50%)}
.track .dot{position:absolute;top:0;left:0;width:17px;height:17px;border-radius:50%;background:var(--surface);border:3px solid var(--rule)}
.track li.done .dot{background:var(--steel);border-color:var(--steel)}
.track li.cur .dot{border-color:var(--primer);background:var(--primer)}
.track b{display:block;font-size:14.5px;line-height:1.25}
.track span{display:block;font:12.5px var(--f-mono);color:var(--muted);margin-top:3px}
.track li.cur b{color:var(--primer)}
@media (max-width:700px){
  .track{grid-template-columns:1fr;gap:0}
  .track li{padding:0 0 16px 30px}
  .track li::before{top:0;bottom:0;left:7px;right:auto;width:3px;height:auto}
  .track li:last-child::before{display:none}
  .track li.cur::before{background:linear-gradient(180deg,var(--primer) 50%,var(--rule) 50%)}
  .track .dot{top:2px}
}

.cols{display:grid;gap:16px;margin-top:24px}
@media (min-width:860px){.cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:16px 18px;display:grid;gap:12px;align-content:start;min-width:0}
.card h2{font-family:var(--f-display);font-weight:600;font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--steel);margin:0;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.card h2 small{font:500 12px var(--f-mono);letter-spacing:0;text-transform:none;color:var(--muted)}
.span2{grid-column:1/-1}

.docs{list-style:none;margin:0;padding:0;display:grid}
.docs li{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule)}
.docs li:last-child{border-bottom:0}
.ico{flex:none;width:34px;height:40px;border:1.5px solid var(--steel);border-radius:3px;display:grid;place-items:end center;font:600 9.5px var(--f-mono);color:var(--steel);padding-bottom:4px;position:relative}
.ico::after{content:"";position:absolute;top:-1.5px;right:-1.5px;width:10px;height:10px;background:var(--surface);border-left:1.5px solid var(--steel);border-bottom:1.5px solid var(--steel)}
.docs li.wait .ico{border-style:dashed;opacity:.55}
.docs .t{flex:1;min-width:0}
.docs .t b{display:block;font-size:15px;overflow-wrap:anywhere}
.docs .t span{font-size:13px;color:var(--muted)}

.todo{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.todo li{display:flex;gap:10px;align-items:flex-start;font-size:15px}
.todo .box{flex:none;width:18px;height:18px;border:1.5px solid var(--muted);border-radius:3px;margin-top:2px;display:grid;place-items:center}
.todo li.ok .box{background:var(--ok);border-color:var(--ok)}
.todo li.ok .box::after{content:"";width:5px;height:9px;border:solid var(--surface);border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.todo li.ok span{color:var(--muted)}
.upl{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.upl input[type=file]{font-size:13.5px;max-width:100%}
.upl .msg{font-size:13.5px;color:var(--ok)}

.thread{display:grid;gap:10px;max-height:340px;overflow-y:auto;padding-right:4px}
.bub{max-width:88%;padding:9px 12px;border-radius:8px;font-size:15px;display:grid;gap:3px}
.bub .m{font:12px var(--f-mono);color:var(--muted)}
.bub.bet{background:var(--field);border:1px solid var(--rule);justify-self:start}
.bub.cli{background:var(--primer-soft);justify-self:end}
.send{display:flex;gap:8px}
.send textarea{flex:1;min-width:0;font:15px var(--f-body);color:var(--ink);background:var(--field);border:1px solid var(--rule);border-radius:4px;padding:9px 11px;min-height:44px;resize:vertical}

.pay{display:grid;gap:8px}
.payrow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--rule);flex-wrap:wrap}
.payrow:last-child{border-bottom:0}
.amt{font:500 16px var(--f-mono);font-variant-numeric:tabular-nums}
.contact{font-size:14.5px;color:var(--muted)}
.contact span{font-family:var(--f-mono);color:var(--ink);user-select:all}

/* vue ingénieur */
.adm{display:grid;gap:16px;margin-top:20px}
@media (min-width:920px){.adm{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:start}}
.tbl{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14.5px}
th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--rule);white-space:nowrap}
th{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:600}
tbody tr{cursor:pointer}
tbody tr:hover td{background:var(--field)}
tr.sel td{background:var(--primer-soft)}
td.mono{font-family:var(--f-mono);font-size:13.5px}
.ctl{display:grid;gap:12px}
.ctl .row{display:flex;gap:8px;flex-wrap:wrap;align-items:end}
.ctl .row .fld{flex:1;min-width:150px}
.toast{font-size:13.5px;color:var(--ok);min-height:1.2em}
.h{font-family:var(--f-display);font-weight:700;font-size:30px;line-height:1.05;margin:20px 0 0}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ajouts application */
.tabs2{display:flex;gap:4px;border-bottom:1px solid var(--rule);margin-top:18px;overflow-x:auto}
.tabs2 button{font:600 15px var(--f-body);color:var(--muted);background:none;border:0;border-bottom:3px solid transparent;padding:10px 14px;cursor:pointer;white-space:nowrap}
.tabs2 button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--primer)}
.tabs2 .count{font:500 12px var(--f-mono);background:var(--primer);color:var(--on-primer);border-radius:99px;padding:1px 7px;margin-left:6px}
.kv{display:grid;grid-template-columns:minmax(110px,max-content) minmax(0,1fr);gap:4px 14px;font-size:14.5px;margin:0}
.kv dt{color:var(--muted)}
.kv dd{margin:0;overflow-wrap:anywhere}
.mini{list-style:none;margin:0;padding:0;display:grid}
.mini li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--rule);font-size:14.5px}
.mini li:last-child{border-bottom:0}
.mini li .grow{flex:1;min-width:0;overflow-wrap:anywhere}
.mini li .meta{font:12.5px var(--f-mono);color:var(--muted)}
.loading{color:var(--muted);padding:40px 0}
.empty{color:var(--muted);font-size:14.5px;margin:0}
.chk{display:inline-flex;gap:8px;align-items:center;cursor:pointer}
.chk input{width:18px;height:18px;accent-color:var(--primer)}
code{font-family:var(--f-mono);font-size:.92em}
.contactline{font-family:var(--f-mono);font-size:14px;color:var(--ink);user-select:all}
.mini a{color:var(--primer);font-weight:600}
