:root{--bg:#12161d;--card:#1c222c;--line:#2a2f3a;--txt:#ece9e2;--mut:#9aa0aa;--gold:#c9a227;--green:#1e9e5a;--blue:#2d7dd2;--red:#c0392b;--r:12px}
*{box-sizing:border-box;margin:0;padding:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--txt);min-height:100vh;font-size:15px;line-height:1.45}
.center-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.spinner{width:34px;height:34px;border:4px solid var(--line);border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.box{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px;width:100%;max-width:400px;text-align:center}
.box h1{color:var(--gold);font-size:1.3rem;margin-bottom:4px}
.box p{color:var(--mut);font-size:.9rem;margin:6px 0 10px}
.box img.qr{width:200px;height:200px;background:#fff;border-radius:10px;padding:8px;margin:8px auto;display:block}
.box code{display:block;word-break:break-all;background:#0d1015;padding:8px;border-radius:8px;font-size:.8rem;color:var(--gold);margin:6px 0}
.top{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:5}
.brand{display:flex;gap:10px;align-items:center}.brand small{display:block;color:var(--mut);font-size:.72rem}
.logo{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#a8520a,var(--gold));color:#111;font-weight:800;display:flex;align-items:center;justify-content:center}
.who{display:flex;gap:8px;align-items:center;font-size:.82rem;color:var(--mut)}
.nav{display:flex;gap:6px;overflow-x:auto;padding:10px 12px;border-bottom:1px solid var(--line);scrollbar-width:none}
.nav button{flex:none;background:var(--card);color:var(--txt);border:1px solid var(--line);border-radius:10px;padding:9px 13px;cursor:pointer;font-size:.88rem;white-space:nowrap}
.nav button.on{background:var(--gold);color:#12161d;font-weight:700;border-color:var(--gold)}
.view{max-width:1200px;margin:0 auto;padding:14px 12px 80px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px;margin-bottom:14px}
.card h2,.card h3{color:var(--gold);font-size:1.02rem;margin-bottom:10px}
.grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.kpis{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.kpi{background:var(--card);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:var(--r);padding:12px}
.kpi b{font-size:1.6rem;color:var(--gold);display:block}.kpi small{color:var(--mut)}
progress{width:100%;height:7px;margin-top:6px;accent-color:var(--gold)}
label{display:block;font-size:.8rem;color:var(--mut);margin:6px 0 3px}
input,select,textarea{width:100%;padding:11px;border-radius:9px;border:1px solid #333b49;background:#0d1015;color:var(--txt);font-size:.95rem}
textarea{min-height:130px;resize:vertical}
.btn{border:0;border-radius:9px;padding:11px 16px;font-weight:700;cursor:pointer;color:#fff;background:var(--blue);font-size:.92rem}
.btn.gold{background:var(--gold);color:#12161d}.btn.green{background:var(--green)}.btn.red{background:var(--red)}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--txt)}.btn.sm{padding:6px 10px;font-size:.8rem}
.btn.block{width:100%;margin-top:10px}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.row .grow{flex:1;width:auto;min-width:140px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:flex;align-items:center;gap:6px;background:#0d1015;border:1px solid var(--line);border-radius:20px;padding:7px 11px;font-size:.82rem;cursor:pointer}
.chip input{width:auto}
.score{font-size:1.5rem;font-weight:800;color:var(--gold)}
.badge{display:inline-block;padding:2px 9px;border-radius:10px;font-size:.72rem;font-weight:700;background:#2a2f3a}
.badge.p1{background:var(--red)}.badge.p2{background:var(--gold);color:#12161d}.badge.ok{background:var(--green)}.badge.mut{background:#3a404c;color:#bbb}
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,1fr);gap:10px;overflow-x:auto;padding-bottom:10px}
.col{background:#171c25;border:1px solid var(--line);border-radius:var(--r);padding:8px;min-height:120px}
.col h3{font-size:.85rem;color:var(--mut);margin:2px 4px 8px;display:flex;justify-content:space-between}
.pc{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--line);border-radius:10px;padding:10px;margin-bottom:8px}
.pc.p1{border-left-color:var(--red)}.pc.p2{border-left-color:var(--gold)}
.pc b{display:block}.pc small{color:var(--mut)}
.pc .row{margin-top:7px}
.thread{max-height:46vh;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:6px}
.msg{max-width:88%;padding:9px 12px;border-radius:12px;font-size:.9rem;white-space:pre-wrap;word-break:break-word}
.msg.envoye{align-self:flex-end;background:#26323f}.msg.recu{align-self:flex-start;background:#223d2f}
.msg small{display:block;color:var(--mut);font-size:.7rem;margin-top:3px}
.list-item{display:flex;justify-content:space-between;gap:10px;padding:10px 4px;border-bottom:1px solid var(--line);cursor:pointer;align-items:center}
.list-item:last-child{border-bottom:0}
.hint{background:#1f2a1f;border:1px solid #2f4a2f;border-radius:10px;padding:10px;font-size:.88rem;margin-top:8px}
.warn{background:#2c2216;border:1px solid #5a4420;border-radius:10px;padding:10px;font-size:.88rem;margin:8px 0}
table{width:100%;border-collapse:collapse;font-size:.88rem}
th{text-align:left;color:var(--gold);padding:7px;border-bottom:2px solid var(--gold)}
td{padding:7px;border-bottom:1px solid var(--line);vertical-align:top}
.muted{color:var(--mut)}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:#0d1015;border:1px solid var(--gold);padding:11px 18px;border-radius:10px;z-index:50;max-width:90vw}
@media(max-width:600px){.who span{display:none}.view{padding-bottom:40px}}
.hint .spinner{display:inline-block;width:16px;height:16px;border-width:3px;vertical-align:middle;margin-right:6px}
.list-item .chips{margin-top:6px}