:root{--ink: #17324d;--ink-soft: #24496b;--teal: #0f7c74;--teal-dark: #0a5e58;--saffron: #c98a12;--saffron-bg: #fdf3dc;--red: #b8392a;--red-bg: #fbe9e6;--green: #2e7d4f;--green-bg: #e3f3e8;--bg: #eef1f4;--surface: #ffffff;--line: #d6dce3;--text: #1c2430;--muted: #5b6675;--radius-s: 4px;--radius-m: 8px;--font: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font);font-size:14px;line-height:1.45;color:var(--text);background:var(--bg);font-variant-numeric:tabular-nums}h1{font-size:22px;font-weight:600;color:var(--ink);margin:0;letter-spacing:-.01em}h2{font-size:16px;font-weight:600;color:var(--ink);margin:0 0 12px}h3{font-size:14px;font-weight:600;margin:0 0 8px}p{margin:0 0 8px}a{color:var(--teal-dark)}:focus-visible{outline:2px solid var(--teal);outline-offset:2px}.shell{display:grid;grid-template-columns:232px 1fr;min-height:100%}.sidebar{background:var(--ink);color:#dbe5ee;display:flex;flex-direction:column;padding:18px 0 12px;position:sticky;top:0;height:100vh}.brand{padding:0 20px 18px;border-bottom:1px solid rgba(255,255,255,.08)}.brand strong{display:block;color:#fff;font-size:16px}.brand span{font-size:12px;color:#9fb3c6}.nav{flex:1;overflow-y:auto;padding:10px 0}.nav a{display:block;padding:8px 20px;color:#c9d6e2;text-decoration:none;border-left:3px solid transparent}.nav a:hover{background:#ffffff0d;color:#fff}.nav a.active{background:#ffffff14;color:#fff;border-left-color:#5fc3b8;font-weight:600}.nav .group{margin:14px 20px 4px;font-size:12px;color:#8199b0}.who{padding:12px 20px 0;border-top:1px solid rgba(255,255,255,.08);font-size:13px}.who b{color:#fff;display:block}.who button{margin-top:8px;background:none;border:1px solid rgba(255,255,255,.25);color:#dbe5ee;border-radius:var(--radius-s);padding:4px 10px;cursor:pointer}.main{padding:24px 32px 48px;max-width:1360px;width:100%}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}.page-head p{color:var(--muted);margin:4px 0 0}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);padding:18px 20px;margin-bottom:18px}.panel.flush{padding:0;overflow:hidden}.panel.flush>h2{padding:16px 20px 0}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.spacer{flex:1}.muted{color:var(--muted)}.small{font-size:12px}.right{text-align:right}.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-m);overflow:hidden;margin-bottom:18px}.kpi{background:var(--surface);padding:14px 18px;text-decoration:none;color:inherit}.kpi .v{font-size:28px;font-weight:600;color:var(--ink);line-height:1.1}.kpi .l{color:var(--muted);font-size:13px}.kpi.warn .v{color:var(--saffron)}.kpi.bad .v{color:var(--red)}a.kpi:hover{background:#f6f8fa}.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px 18px}.field{display:flex;flex-direction:column;gap:4px}.field.wide{grid-column:1 / -1}.field label{font-weight:600;font-size:13px;color:var(--ink)}.field .hint{font-size:12px;color:var(--muted)}input,select,textarea{font:inherit;border:1px solid #b9c3ce;border-radius:var(--radius-s);padding:7px 9px;background:#fff;color:var(--text);min-width:0}input:focus,select:focus,textarea:focus{border-color:var(--teal);outline:2px solid rgba(15,124,116,.18)}input[type=checkbox]{width:16px;height:16px;accent-color:var(--teal)}.check{display:flex;gap:8px;align-items:flex-start;font-weight:400!important}fieldset{border:1px solid var(--line);border-radius:var(--radius-m);padding:12px 16px 16px;margin:0 0 16px}legend{font-weight:600;color:var(--ink);padding:0 6px}.btn{font:inherit;font-weight:600;border-radius:var(--radius-s);border:1px solid var(--teal);background:var(--teal);color:#fff;padding:7px 14px;cursor:pointer;white-space:nowrap}.btn:hover{background:var(--teal-dark)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.secondary{background:#fff;color:var(--ink);border-color:#b9c3ce}.btn.secondary:hover{background:#f3f6f8}.btn.danger{background:var(--red);border-color:var(--red)}.btn.link{background:none;border:none;color:var(--teal-dark);padding:2px 4px;font-weight:600}.btn.small{padding:3px 9px;font-size:13px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse}th{text-align:left;font-weight:600;font-size:12px;color:var(--muted);padding:9px 12px;border-bottom:1px solid var(--line);background:#f7f9fb;white-space:nowrap}td{padding:8px 12px;border-bottom:1px solid #e8ecf0;vertical-align:top}tr:last-child td{border-bottom:none}tbody tr:hover td{background:#fafbfc}td.num,th.num{text-align:right}tfoot td{font-weight:600;background:#f7f9fb;border-top:1px solid var(--line)}.empty{padding:28px;text-align:center;color:var(--muted)}.badge{display:inline-block;padding:1px 8px;border-radius:10px;font-size:12px;font-weight:600;background:#e8edf2;color:var(--ink-soft);white-space:nowrap}.badge.ok{background:var(--green-bg);color:var(--green)}.badge.warn{background:var(--saffron-bg);color:#8a5d00}.badge.bad{background:var(--red-bg);color:var(--red)}.badge.off{background:#eceff2;color:#7a8592}.alert{border-radius:var(--radius-m);padding:10px 14px;margin-bottom:14px;border:1px solid}.alert.error{background:var(--red-bg);border-color:#efc2bb;color:#7d2116}.alert.warn{background:var(--saffron-bg);border-color:#efd496;color:#6b4a00}.alert.ok{background:var(--green-bg);border-color:#b9dfc6;color:#1d5434}.alert.info{background:#e7f0f7;border-color:#c3d6e6;color:var(--ink)}.alert ul{margin:4px 0 0;padding-left:18px}.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:18px;flex-wrap:wrap}.tabs button{font:inherit;background:none;border:none;border-bottom:2px solid transparent;padding:8px 14px;color:var(--muted);cursor:pointer;margin-bottom:-1px}.tabs button.on{color:var(--ink);border-bottom-color:var(--teal);font-weight:600}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f1e2d73;display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px;z-index:50;overflow-y:auto}.modal{background:#fff;border-radius:var(--radius-m);width:min(720px,100%);box-shadow:0 20px 50px #0a19284d}.modal.wide{width:min(980px,100%)}.modal header{padding:16px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.modal header h2{margin:0}.modal .body{padding:18px 20px}.modal footer{padding:12px 20px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:10px;background:#f7f9fb;border-radius:0 0 var(--radius-m) var(--radius-m)}.close{background:none;border:none;font-size:22px;line-height:1;cursor:pointer;color:var(--muted)}.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.cal .h{font-size:12px;color:var(--muted);text-align:center;padding:4px 0}.day{min-height:74px;border:1px solid var(--line);border-radius:var(--radius-s);padding:5px 7px;background:#fff;font-size:12px}.day .n{font-weight:600;color:var(--ink)}.day.travaille{background:#eef8f2;border-color:#c4e3cf}.day.partiel{background:#f5f8ea;border-color:#dbe5b5}.day.a_verifier{background:var(--red-bg);border-color:#efc2bb}.day.absence_non_justifiee{background:#fff4f2;border-color:#f2cdc7}.day.conge_paye,.day.absence_justifiee,.day.conge_sans_solde{background:#eef3fa;border-color:#c9d8ec}.day.ferie{background:var(--saffron-bg);border-color:#efd496}.day.non_travaille,.day.hors_contrat{background:#f4f5f7;color:#8a94a0}.day.a_venir{background:#fff;color:#8a94a0}.day.en_cours{background:#e6f4f2;border-color:#a9d7d1}.day .s{display:block;margin-top:3px}.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:10px}.legend i{display:inline-block;width:11px;height:11px;border-radius:2px;margin-right:5px;vertical-align:-1px;border:1px solid var(--line)}.login-page{min-height:100%;display:grid;place-items:center;background:var(--ink);padding:16px}.login-card{background:#fff;border-radius:var(--radius-m);padding:28px 30px;width:min(380px,100%)}.login-card h1{margin-bottom:4px}.login-card form{display:grid;gap:14px;margin-top:20px}.kiosk{min-height:100vh;background:#0e1f30;color:#e6edf3;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,1fr)}.kiosk-cam{position:relative;display:flex;align-items:center;justify-content:center;padding:28px}.kiosk-cam video{width:100%;max-height:80vh;border-radius:12px;background:#000;transform:scaleX(-1);object-fit:cover;aspect-ratio:4 / 3}.guide{position:absolute;left:50%;top:50%;width:34%;aspect-ratio:3 / 4;transform:translate(-50%,-50%);border:4px solid rgba(255,255,255,.55);border-radius:50%;transition:border-color .25s;pointer-events:none}.guide.ok{border-color:#4fd1a5}.guide.bad{border-color:#f3b33d}.guide.busy{border-color:#6fb7ff}.cam-state{position:absolute;top:40px;left:44px;font-size:13px;background:#00000073;padding:4px 10px;border-radius:12px}.kiosk-side{padding:36px 36px 28px;display:flex;flex-direction:column;gap:22px;border-left:1px solid rgba(255,255,255,.08)}.clock{font-size:76px;font-weight:300;letter-spacing:-.02em;line-height:1;color:#fff}.clock-date{font-size:18px;color:#9fb3c6}.clock-date:first-letter{text-transform:uppercase}.instr{font-size:20px;line-height:1.35;min-height:56px}.kiosk .big-btn{font:inherit;font-size:20px;font-weight:600;padding:18px;border-radius:10px;border:none;background:#0f7c74;color:#fff;cursor:pointer}.kiosk .big-btn:disabled{background:#2b4157;color:#8ea4b8;cursor:wait}.result{border-radius:12px;padding:22px 24px}.result.in{background:#0f5f47}.result.out{background:#24496b}.result.no{background:#6b2a21}.result.dup{background:#5c4a14}.result .kind{font-size:15px;opacity:.85}.result .name{font-size:30px;font-weight:600;margin:4px 0;color:#fff}.result .when{font-size:20px}.kiosk-center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:32px;text-align:center}.kiosk-alert{background:#6b2a21;color:#fff;border-radius:10px;padding:12px 16px;font-size:16px}.kiosk-company{font-size:18px;font-weight:600;color:#cfe0ee}.kiosk-help{color:#8199b0;font-size:14px;margin:0}.cam-state.on{background:#0f5f47bf}.cam-state.off{background:#6b2a21d9}.enroll{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}.enroll .cam{position:relative}.enroll video{width:100%;border-radius:var(--radius-m);background:#000;transform:scaleX(-1);aspect-ratio:4 / 3;object-fit:cover}.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.thumbs div{aspect-ratio:1;border-radius:var(--radius-s);background:#eef1f4;border:1px dashed #b9c3ce;display:grid;place-items:center;font-size:12px;color:var(--muted)}.thumbs div.done{background:var(--green-bg);border:1px solid #b9dfc6;color:var(--green);font-weight:600}@media(max-width:1000px){.shell{grid-template-columns:1fr}.sidebar{position:static;height:auto}.main{padding:18px 16px 40px}.grid-2,.grid-3,.enroll,.kiosk{grid-template-columns:1fr}.kiosk-side{border-left:none}.clock{font-size:52px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}@media print{.sidebar,.no-print{display:none!important}.shell{display:block}body{background:#fff}}.clock-preview{display:grid;grid-template-columns:1fr 1fr;gap:18px}.big-time{font-size:34px;font-weight:300;color:var(--ink);line-height:1.1;margin:4px 0}@media(max-width:1000px){.clock-preview{grid-template-columns:1fr}}.face-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.dropzone{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:14px;border:1px dashed #b9c3ce;border-radius:var(--radius-s);background:#f7f9fb}.dropzone.disabled{opacity:.6}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:12px}.photo{margin:0;border:1px solid #d5dce3;border-radius:var(--radius-s);overflow:hidden;background:#fff;display:flex;flex-direction:column}.photo img{width:100%;aspect-ratio:1;object-fit:cover;background:#eef1f4;display:block}.photo figcaption{padding:6px 8px;display:flex;flex-direction:column;gap:3px;align-items:flex-start}.photo.ok{border-color:#b9dfc6}.photo.refusee,.photo.suspecte{border-color:#f0b4b4}.photo.refusee img,.photo.suspecte img{opacity:.55}.tag{font-size:11px;font-weight:700;padding:1px 7px;border-radius:9px;background:#e8edf2;color:var(--ink-soft)}.tag.ok{background:var(--green-bg);color:var(--green)}.tag.refusee,.tag.suspecte{background:var(--red-bg);color:var(--red)}.sound-btn{align-self:flex-end;background:transparent;color:inherit;border:1px solid currentColor;border-radius:16px;padding:4px 12px;font-size:13px;opacity:.8;cursor:pointer}.sound-btn:hover{opacity:1}
