*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#f5f5f4;color:#1c1917;}
.container{max-width:1150px;margin:0 auto;padding:2rem 1.5rem;}
header{margin-bottom:2rem;display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
header h1{font-size:22px;font-weight:600;}
header p{font-size:13px;color:#78716c;margin-top:4px;}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:1.5rem;}
.kpi{background:#fff;border:1px solid #e7e5e4;border-radius:12px;padding:1.1rem 1.3rem;}
.kpi-label{font-size:12px;color:#78716c;margin-bottom:6px;font-weight:500;}
.kpi-value{font-size:24px;font-weight:600;}
.kpi-sub{font-size:12px;color:#a8a29e;margin-top:4px;}
.green{color:#0F6E56;} .amber{color:#92400e;} .red{color:#b91c1c;}
.alert{background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:.9rem 1.2rem;margin-bottom:1.5rem;font-size:13px;color:#78350f;}
.alert b{font-weight:600;}
.alert--error{background:#fef2f2;border-color:#fecaca;color:#991b1b;}
.tabs{display:flex;gap:8px;margin-bottom:1.5rem;flex-wrap:wrap;}
.tab{padding:7px 16px;font-size:13px;font-weight:500;border:1px solid #e7e5e4;border-radius:8px;cursor:pointer;background:#fff;color:#78716c;transition:.15s;}
.tab:hover{border-color:#a8a29e;color:#1c1917;}
.tab.active{background:#1c1917;color:#fff;border-color:#1c1917;}
.card{background:#fff;border:1px solid #e7e5e4;border-radius:12px;padding:1.4rem;margin-bottom:1.5rem;}
.grid2{display:grid;grid-template-columns:3fr 2fr;gap:1.5rem;margin-bottom:1.5rem;}
.card h3{font-size:11px;font-weight:600;color:#78716c;text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px;}
.legend{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:12px;font-size:12px;color:#57534e;}
.ldot{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:5px;vertical-align:middle;}
.pbar{width:100%;height:7px;background:#f5f5f4;border-radius:4px;overflow:hidden;margin:8px 0 4px;}
.pfill{height:100%;border-radius:4px;}
.table-wrap{background:#fff;border:1px solid #e7e5e4;border-radius:12px;overflow:hidden;}
.table-hdr{padding:1rem 1.4rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #f5f5f4;flex-wrap:wrap;gap:8px;}
.table-hdr h2{font-size:15px;font-weight:600;}
.filters{display:flex;gap:8px;flex-wrap:wrap;}
.search,select{padding:7px 12px;font-size:13px;border:1px solid #e7e5e4;border-radius:8px;background:#fafaf9;color:#1c1917;outline:none;}
.search{width:200px;}
.search:focus,select:focus{border-color:#a8a29e;}
table{width:100%;border-collapse:collapse;font-size:13px;}
th{padding:9px 14px;text-align:left;font-weight:600;font-size:11px;color:#78716c;background:#fafaf9;border-bottom:1px solid #e7e5e4;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;user-select:none;white-space:nowrap;}
th:hover{color:#1c1917;}
td{padding:10px 14px;border-bottom:1px solid #f5f5f4;}
tr:last-child td{border-bottom:none;}
tr:hover td{background:#fafaf9;}
.badge{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap;}
.b-enc{background:#dcfce7;color:#166534;}
.b-att{background:#fef9c3;color:#854d0e;}
.b-ret{background:#fee2e2;color:#991b1b;}
.b-cat{background:#f5f5f4;color:#57534e;}
.num{font-variant-numeric:tabular-nums;}

/* --- Barre utilisateur / fraîcheur des données ------------------------- */
.userbar{display:flex;align-items:center;gap:12px;font-size:12px;color:#78716c;}
.userbar a,.userbar button{font-size:12px;color:#57534e;text-decoration:none;background:none;border:1px solid #e7e5e4;border-radius:8px;padding:5px 11px;cursor:pointer;font-family:inherit;}
.userbar a:hover,.userbar button:hover{border-color:#a8a29e;color:#1c1917;}
.freshness{display:inline-flex;align-items:center;gap:6px;}
.freshness .dot{width:7px;height:7px;border-radius:50%;background:#1D9E75;display:inline-block;}
.freshness.is-stale .dot{background:#D85A30;}
.freshness.is-stale{color:#b91c1c;font-weight:500;}

/* --- Écran de connexion ------------------------------------------------ */
.login{max-width:360px;margin:12vh auto;padding:2rem;background:#fff;border:1px solid #e7e5e4;border-radius:12px;}
.login h1{font-size:18px;font-weight:600;margin-bottom:1.4rem;}
.login__form{display:flex;flex-direction:column;gap:6px;}
.login__form label{font-size:12px;color:#78716c;font-weight:500;margin-top:8px;}
.login__form input[type=email],.login__form input[type=password]{padding:9px 12px;font-size:14px;border:1px solid #e7e5e4;border-radius:8px;background:#fafaf9;outline:none;}
.login__form input[type=email]:focus,.login__form input[type=password]:focus{border-color:#a8a29e;}
.login__remember{display:flex;align-items:center;gap:7px;font-size:12px;color:#78716c;margin-top:12px;}
.login__form button{margin-top:16px;padding:10px;font-size:14px;font-weight:500;color:#fff;background:#1c1917;border:none;border-radius:8px;cursor:pointer;font-family:inherit;}
.login__form button:hover{background:#44403c;}
.login__separator{display:flex;align-items:center;gap:10px;margin:1.4rem 0;color:#a8a29e;font-size:12px;}
.login__separator::before,.login__separator::after{content:'';flex:1;height:1px;background:#e7e5e4;}
.login__google{display:block;text-align:center;padding:10px;font-size:14px;color:#1c1917;border:1px solid #e7e5e4;border-radius:8px;text-decoration:none;}
.login__google:hover{border-color:#a8a29e;background:#fafaf9;}

@media(max-width:750px){.kpis{grid-template-columns:repeat(2,1fr);}.grid2{grid-template-columns:1fr;}}
