:root{--bg:#f4f5f7;--carte:#fff;--txt:#1b1f24;--discret:#6b7280;--bord:#e2e5e9;--accent:#1f6feb}
@media (prefers-color-scheme:dark){:root{--bg:#14171a;--carte:#1f2327;--txt:#e8eaed;--discret:#9aa0a6;--bord:#2e3338;--accent:#58a6ff}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--txt);font:15px/1.45 system-ui,Segoe UI,Arial,sans-serif}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
header{display:flex;align-items:center;gap:20px;padding:10px 20px;background:var(--carte);border-bottom:1px solid var(--bord)}
header nav{display:flex;gap:16px}.logo{font-weight:700;font-size:18px;color:var(--txt)}.spacer{flex:1}
main{max-width:1200px;margin:20px auto;padding:0 16px}
.carte{background:var(--carte);border:1px solid var(--bord);border-radius:12px;padding:16px 20px}
.carte h2{margin:0 0 12px;font-size:18px}.etroite{max-width:380px;margin:40px auto}
.grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px}.large{grid-column:1/-1}
.discret{color:var(--discret)}.petit{font-size:12px}.erreur{color:#d9534f}
.donut-bloc{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.donut{width:190px;height:190px;border-radius:50%;display:grid;place-items:center}
.trou{width:120px;height:120px;border-radius:50%;background:var(--carte);display:flex;flex-direction:column;align-items:center;justify-content:center}
.trou strong{font-size:30px}
.legende{list-style:none;margin:0;padding:0;flex:1;min-width:200px}
.legende a{display:flex;align-items:center;gap:8px;padding:3px 0;color:var(--txt)}.legende b{margin-left:auto}
.legende i,.pastille{width:11px;height:11px;border-radius:50%;display:inline-block;margin-right:6px}
.ligne{display:flex;align-items:center;gap:10px;padding:7px 10px;margin:4px 0;border-radius:8px;background:var(--bg);color:var(--txt)}
a.ligne:hover{text-decoration:none;outline:1px solid var(--accent)}.nb{font-size:20px;font-weight:700;width:44px;text-align:center}
table{width:100%;border-collapse:collapse}th,td{padding:7px 10px;border-bottom:1px solid var(--bord);text-align:left}
th{color:var(--discret);font-size:12px;text-transform:uppercase}.num{text-align:right}
.kv th{width:240px;text-transform:none;font-size:14px}
.defil{overflow-x:auto;background:var(--carte);border:1px solid var(--bord);border-radius:12px}
.filtres{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
input,select,button{font:inherit;padding:7px 10px;border-radius:8px;border:1px solid var(--bord);background:var(--carte);color:var(--txt)}
button{background:var(--accent);color:#fff;border:0;cursor:pointer}
button.lien{background:none;color:var(--accent);padding:0}
form label{display:block;margin:10px 0}form label input{display:block;width:100%;margin-top:4px}