:root{--ink:#172b38;--muted:#71818a;--line:#e4eaee;--accent:#167b49;--nav:#17271d}*{box-sizing:border-box}body{margin:0;background:#f6f8f6;color:var(--ink);font-family:Inter,Arial,sans-serif;font-size:16px;line-height:1.5}button,input{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.48;cursor:not-allowed}button:focus-visible,a:focus-visible{outline:3px solid #39a865;outline-offset:3px}button{display:inline-flex;align-items:center;justify-content:center;gap:9px}a{color:inherit;text-decoration:none}.shell{display:flex;min-height:100vh}.sidebar{width:254px;background:var(--nav);color:#adc0cb;padding:34px 22px;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0}.brand{display:flex;align-items:center;gap:13px;color:white;font-size:25px;font-weight:750;letter-spacing:1px;line-height:1.1}.brand span:not(.logo){display:block;font-size:11px;letter-spacing:1.7px;font-weight:500;margin-top:8px;color:#91aab9}.logo{display:grid;place-items:center;border-radius:11px;width:45px;height:48px;background:#254f37;color:#ef7c22}.nav-label{font-size:11px;font-weight:650;letter-spacing:1.5px;color:#65828f;margin:53px 10px 17px}.nav{width:100%;justify-content:flex-start;padding:14px 13px;border:0;border-radius:7px;color:#a5bbc6;background:transparent;font-size:14px;font-weight:550;margin-bottom:7px;text-align:left}.nav span{flex:1}.nav:hover{background:#214631}.nav.active{background:#28583c;color:#fff}.nav.active svg{color:#ffac6c}.side-schedule{margin-top:48px;padding:20px 13px;border-top:1px solid #2b4551;font-size:13px}.side-schedule>svg{display:block;color:#799ca9;margin-bottom:12px}.side-schedule>strong{display:block;color:#e3edf1;font-size:14px;margin-bottom:15px}.side-schedule>div{display:flex;justify-content:space-between;gap:8px;margin-top:9px}.side-schedule b{font-weight:500;color:#d6e3e9}.side-schedule small{display:block;font-size:11px;margin-top:18px;color:#78929f}.side-bottom{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:30px;font-size:12px;color:#85a5b3}.workspace{width:calc(100% - 254px);margin-left:254px}header{height:80px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#fff;padding:0 42px}.breadcrumb{font-size:14px;font-weight:550}.breadcrumb span{color:#bbc6cb;margin:0 13px}.account{background:transparent;border:1px solid var(--line);padding:10px 14px;border-radius:7px;font-size:13px;color:#526775}main{max-width:1450px;margin:auto;padding:36px 42px 16px}.page-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;gap:24px}.eyebrow{color:var(--accent);font-size:11px;font-weight:750;letter-spacing:1.5px;margin-bottom:7px}h1{font-size:30px;letter-spacing:-.8px;margin:0 0 8px;line-height:1.3;font-weight:750}.page-title p{margin:0;font-size:14px;color:var(--muted)}.date-chip{border-left:1px solid #dce3e8;padding-left:24px;text-align:right;min-width:190px}.date-chip span{display:block;font-size:13px;color:var(--muted);text-transform:capitalize}.date-chip b{font-size:23px;font-weight:600;letter-spacing:-.4px}.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:27px;box-shadow:0 3px 8px #17314203}.status-strip{display:flex;align-items:center;justify-content:space-between;background:#f1f7ee;border:1px solid #dce9d3;border-radius:9px;padding:18px 21px;margin-bottom:25px;gap:15px}.status-strip>div{display:flex;align-items:center;gap:13px}.status-strip strong{display:block;font-size:14px;font-weight:650}.status-strip div span:not(.status-icon){display:block;font-size:13px;color:#6a8586;margin-top:3px}.status-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:50%;background:#e0efda;color:#378346;flex-shrink:0}.status-icon.warning{background:#f3e9d0;color:#aa842d}.tag{font-size:12px;font-weight:600;border:1px solid #d5e1bc;color:#467338;padding:6px 10px;border-radius:5px;white-space:nowrap}.point-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(285px,1fr);gap:25px}.section-heading{display:flex;align-items:center;gap:13px;margin-bottom:26px}.section-heading>svg{color:var(--accent)}.icon-tile{display:grid;place-items:center;width:46px;height:46px;border-radius:10px;background:#edf6ee;color:var(--accent)}h2{font-size:18px;font-weight:650;margin:0;letter-spacing:-.3px}.section-heading p{font-size:13px;color:var(--muted);margin:3px 0 0}label{display:block;font-size:14px;font-weight:550;margin-bottom:19px}.field-title{margin-bottom:11px}input{width:100%;margin-top:8px;background:#fff;color:var(--ink);border:1px solid #dbe3e9;border-radius:7px;padding:12px 13px;outline:none;font-size:14px;min-height:46px}input:focus{border-color:#4d9c65;box-shadow:0 0 0 3px #e5f2e6}input::placeholder{color:#a0aeb8}.periods{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}.periods button{flex-direction:column;align-items:flex-start;padding:17px 18px;border:1px solid var(--line);border-radius:8px;background:#fff;position:relative;gap:3px;color:#72838b;text-align:left}.periods svg{margin-bottom:7px}.periods strong{font-size:14px;font-weight:600;color:var(--ink)}.periods span{font-size:12px}.periods button.selected{border-color:#319353;background:#f2f8f1;color:var(--accent)}.periods button.selected:after{content:'';width:10px;height:10px;border:3px solid #fff;background:var(--accent);box-shadow:0 0 0 1px var(--accent);border-radius:50%;position:absolute;top:18px;right:17px}.segmented{display:flex;background:#f0f3f5;padding:4px;border-radius:7px;margin-bottom:24px}.segmented button{width:50%;padding:9px;border:0;background:transparent;color:#77858f;font-size:14px;border-radius:5px;font-weight:550}.segmented .selected{background:white;color:var(--ink);box-shadow:0 1px 4px #17271d12}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.gps-note{display:flex;gap:9px;align-items:center;color:#768791;font-size:12px;padding:2px 0 22px}.gps-note svg{color:#859b9e;flex-shrink:0}.primary{border:0;background:var(--accent);color:white;border-radius:7px;padding:13px 20px;font-weight:600;font-size:14px;min-height:46px}.primary:hover:not(:disabled){background:#116139}.wide{width:100%}.secure-caption{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;color:#8b9ba4;margin-top:13px}.right-column{display:flex;flex-direction:column;gap:22px}.time-card{background:#193526;color:#fff;border-radius:12px;padding:25px 27px}.time-label{display:flex;gap:9px;align-items:center;font-size:10px;font-weight:600;letter-spacing:1.4px;color:#9bb9c4}.big-time{font-size:56px;line-height:1.3;letter-spacing:-2px;font-weight:550;margin-top:12px;font-variant-numeric:tabular-nums}.big-time span{font-size:21px;color:#6e9fa9;margin-left:8px;letter-spacing:0}.time-card>p{color:#94b0bc;font-size:12px;margin:3px 0 0}.time-divider{height:1px;background:#32515b;margin:24px 0 20px}.work-period{display:flex;gap:13px;align-items:center;margin-top:18px}.work-period svg{color:#6babae}.work-period strong{display:block;font-size:13px;font-weight:550}.work-period span{display:block;font-size:12px;color:#93afb9;margin-top:3px}.rules-card{padding:23px 25px}h3{font-size:14px;margin:0 0 12px;font-weight:650}.rules-card h3{display:flex;align-items:center;gap:8px}.rules-card h3 svg{color:var(--accent)}.rules-card p,.rules-card ol{font-size:13px;color:#7a8991;line-height:1.8}.rules-card p{margin:0 0 16px}.rules-card ol{padding-left:20px;margin:0}.rules-card li{padding-left:3px;margin-bottom:6px}.rule-foot{border-top:1px solid var(--line);margin-top:19px;padding-top:17px;font-size:12px;color:#7c8c96;line-height:1.8}.notice{display:flex;align-items:center;gap:11px;padding:15px 19px;margin-bottom:22px;border:1px solid;border-radius:8px;font-size:14px}.notice svg{flex-shrink:0}.notice button{margin-left:auto;border:0;background:none;font-size:22px;color:inherit}.error{background:#fff3f1;color:#ac4539;border-color:#f0d4cf}.success{background:#eef8f4;color:#2b7e64;border-color:#cee9dd}.auth-card{margin-bottom:25px;max-width:650px}.auth-card p,.settings-grid>.card>p{font-size:14px;color:var(--muted)}.auth-card .section-heading{margin-bottom:8px}.auth-card form{display:flex;align-items:flex-end;gap:15px}.auth-card label{flex:1;margin:0}.empty{text-align:center;padding:55px 25px;color:var(--muted)}.empty>svg{color:#93a9b4;margin:0 auto 14px}.empty h2,.empty h3{color:var(--ink)}.empty p{font-size:14px}.small{padding:45px 20px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:24px}.stats .card{position:relative}.stats span{display:block;font-size:13px;color:var(--muted)}.stats strong{display:block;font-size:33px;margin-top:8px;font-weight:600}.stats svg{position:absolute;right:25px;top:28px;color:var(--accent)}.table-tools{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.table-tools>div{display:flex;gap:10px;align-items:center}.table-tools input{margin:0;width:auto;max-width:240px}.secondary{background:#fff;color:#506773;border:1px solid #dbe4e9;border-radius:7px;padding:11px 14px;font-size:13px;min-height:44px}.secondary:hover{background:#f1f6f7}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:13px;white-space:nowrap}th{background:#f6f8f6;color:#73818c;font-weight:500;font-size:12px;padding:12px 15px;border-bottom:1px solid var(--line)}td{padding:17px 15px;border-bottom:1px solid #edf1f4}td strong{font-weight:550}td small{display:block;color:#95a2ab;font-size:11px;margin-top:3px}.pill{display:inline-block;font-size:11px;padding:4px 9px;border-radius:5px;font-weight:550}.green{background:#ebf6f0;color:#328064}.blue{background:#eef3fa;color:#507ba8}.gray{background:#f0f2f4;color:#82919d}.mono{font-variant-numeric:tabular-nums;font-weight:550}.late{color:#bf8a33}.mt{margin-top:24px}.count{background:#eef3f5;font-size:12px;padding:3px 8px;border-radius:5px;margin-left:6px}.actions{display:flex;gap:14px}.text-btn{padding:0;border:0;background:transparent;color:var(--accent);font-size:12px}.danger{color:#ad5848}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.help{font-size:12px;color:var(--muted);line-height:1.8}.device-status{display:flex;gap:14px;align-items:center;border:1px solid var(--line);background:#f8fafb;padding:18px;border-radius:8px;margin:22px 0}.device-status svg{color:var(--accent);flex-shrink:0}.device-status strong{display:block;font-size:14px}.device-status span{display:block;font-size:12px;color:var(--muted);margin-top:5px}.device-row{display:flex;gap:10px;align-items:center;border-top:1px solid var(--line);padding:15px 0}.device-row strong{font-size:13px;display:block}.device-row span{font-size:11px;color:var(--muted);display:block}.device-row .text-btn{margin-left:auto}.reset-form{display:flex;gap:14px;align-items:flex-end;margin-top:25px}.reset-form label{margin:0}.reset-form input{width:200px}footer{display:flex;justify-content:space-between;color:#a0acb4;font-size:11px;border-top:1px solid var(--line);margin-top:35px;padding:19px 0}button, input{transition:background .15s,border-color .15s}
@media(min-width:1450px){.point-grid{grid-template-columns:minmax(0,1.7fr) minmax(320px,1fr)}.punch-card{padding:32px}.periods button{padding:20px}}
@media(max-width:1100px){.sidebar{width:215px;padding:28px 16px}.workspace{margin-left:215px;width:calc(100% - 215px)}main{padding:28px 25px 15px}header{padding:0 25px}.point-grid{grid-template-columns:minmax(0,1fr) 280px;gap:18px}.card{padding:23px}.date-chip{display:none}.status-strip .tag{display:none}.settings-grid{grid-template-columns:1fr}.form-row{gap:12px}.big-time{font-size:49px}}
@media(max-width:850px){.sidebar{position:static;width:100%;padding:18px 22px;display:block}.shell{display:block}.brand{font-size:20px}.brand .logo{width:38px;height:40px}.brand span:not(.logo){font-size:10px;margin-top:5px}.nav-label,.side-schedule,.side-bottom{display:none}.sidebar nav{display:flex;margin-top:22px;gap:5px;overflow-x:auto}.nav{width:auto;margin:0;white-space:nowrap;padding:10px 12px;font-size:12px}.nav svg:last-child:not(:first-child){display:none}.nav svg{width:17px}.workspace{width:100%;margin:0}header{height:63px}.point-grid{grid-template-columns:minmax(0,1.4fr) minmax(250px,1fr)}h1{font-size:26px}.stats{gap:12px}.table-tools{align-items:flex-start;flex-wrap:wrap}.table-tools>div{flex-wrap:wrap}}
@media(max-width:640px){main{padding:24px 18px 12px}header{padding:0 18px}.breadcrumb{font-size:12px}.breadcrumb span{margin:0 7px}.account{font-size:12px;padding:9px}.account span{display:none}.page-title{margin-bottom:22px}.page-title p{font-size:13px}.eyebrow{font-size:10px}.point-grid{grid-template-columns:1fr}.right-column{gap:18px}.time-card{order:1}.big-time{font-size:54px}.card{padding:23px 20px}.status-strip{padding:14px}.status-strip strong{font-size:13px}.status-strip div span:not(.status-icon){font-size:12px}.form-row{grid-template-columns:1fr;gap:0}.periods{gap:10px}.periods button{padding:17px}.auth-card form{display:block}.auth-card .primary{margin-top:16px;width:100%}.secure-caption{font-size:10px}.stats{grid-template-columns:1fr}.stats .card{padding:18px 20px}.stats strong{font-size:27px}.stats svg{top:24px}.table-tools>div{width:100%}.table-tools input{max-width:100%;width:100%}.table-tools>div input{width:auto}.reset-form{flex-wrap:wrap}.reset-form label{width:100%}.reset-form input{width:100%}footer{font-size:10px;gap:15px}.nav{font-size:11px;padding:10px}.nav svg{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.auth-card{max-width:950px}.auth-card form{flex-wrap:wrap}.auth-card label{min-width:220px}

/* Identité EGTB : vert, orange, noir et surfaces blanches. */
.sidebar{overflow-y:auto}.brand{flex-direction:column;gap:13px;text-align:center;letter-spacing:1px}.brand-logo{width:156px;height:170px;object-fit:contain;background:white;border-radius:8px;display:block}.brand span:not(.logo){color:#f6ad77;font-size:10px;letter-spacing:1.2px}.nav-label{margin-top:28px}.side-schedule{margin-top:25px}.nav.active{box-shadow:inset 3px 0 #ef7c22}.time-label svg,.time-card .work-period svg{color:#ef7c22}.eyebrow{color:#167b49}.time-divider{background:#3a5542}.big-time span{color:#f0a063}.tag{background:#fff3e9}.primary{background:#167b49}.primary:hover:not(:disabled){background:#116139}.periods button.selected:after{background:#167b49;box-shadow:0 0 0 1px #167b49}.account:hover{border-color:#db7837}.brand img{flex-shrink:0}
@media(max-width:850px){.brand{flex-direction:row;text-align:left;justify-content:flex-start}.brand-logo{width:75px;height:82px}.sidebar nav{margin-top:16px}.brand span:not(.logo){font-size:10px}}

/* Orange institutionnel, avec vert secondaire issu du logo. */
:root{--accent:#b95116;--nav:#202820}.primary{background:#b95116}.primary:hover:not(:disabled){background:#963e0d}.eyebrow{color:#b95116}.icon-tile{background:#fff1e7;color:#b95116}.periods button.selected{border-color:#de7f42;background:#fff5ee;color:#b95116}.periods button.selected:after{background:#b95116;box-shadow:0 0 0 1px #b95116}.status-strip{background:#fff6ee;border-color:#f1dac7}.status-icon{background:#fbe6d7;color:#a54c19}.tag{color:#945024;border-color:#ecccb3}.section-heading>svg{color:#b95116}.time-card{background:#233529}.nav.active svg{color:#ffad70}.brand span:not(.logo){color:#f6ad77}
.punch-actions{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}.punch-actions button{min-height:76px;justify-content:center;font-size:21px;font-weight:700}.punch-actions .secondary{border:2px solid #285c40;background:#edf7ef;color:#285c40}.install-banner{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff4ec;border:1px solid #edc1a3;border-radius:14px;padding:16px 20px;margin-bottom:22px}.install-banner p{margin:5px 0 0;color:#53636c;font-size:14px}.install-banner button{flex-shrink:0}.punch-card .form-row input{min-height:56px;font-size:18px}@media(max-width:600px){.install-banner{align-items:stretch;flex-direction:column;gap:12px}.punch-actions{gap:10px}.punch-actions button{font-size:19px;min-height:72px}.punch-card .form-row{grid-template-columns:1fr}.point-grid .rules-card{display:none}}

.single-pin input{min-height:64px;font-size:24px;letter-spacing:2px;text-align:center}.single-pin{display:block;margin-top:20px}

/* Navigation latérale à la demande, sur toutes les tailles d’écran. */
.shell{display:block}.workspace{width:100%;margin-left:0}.sidebar.drawer{position:fixed;inset:0 auto 0 0;width:min(300px,86vw);height:100dvh;padding:55px 22px 24px;display:flex;flex-direction:column;z-index:101;overflow-y:auto;transform:translateX(-100%);visibility:hidden;transition:transform .2s ease,visibility .2s}.sidebar.drawer.drawer-open{transform:translateX(0);visibility:visible}.drawer nav{display:block;margin-top:0;overflow:visible}.drawer .nav{display:flex;width:100%;font-size:14px;white-space:normal;margin-bottom:7px;padding:14px 13px}.drawer .nav svg{display:block;width:20px;flex-shrink:0}.drawer .nav svg:last-child:not(:first-child){display:block}.drawer .nav-label,.drawer .side-schedule,.drawer .side-bottom{display:block}.drawer .side-bottom{display:flex}.drawer .nav-label{margin:28px 10px 17px}.drawer .brand{flex-direction:column;text-align:center}.drawer .brand-logo{width:132px;height:144px}.menu-backdrop{position:fixed;inset:0;background:#10251cb3;z-index:100}.drawer-close{position:absolute;right:14px;top:12px;width:40px;height:40px;border:0;background:transparent;color:white;border-radius:8px}.drawer-close:hover{background:#ffffff1a}.header-start{display:flex;align-items:center;gap:16px;min-width:0}.menu-toggle{width:44px;height:44px;border:1px solid #e4eaee;border-radius:9px;background:#fff;color:#b95116;flex-shrink:0}.menu-toggle:hover{background:#fff1e7}.breadcrumb{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:640px){.header-start{gap:10px}.breadcrumb{max-width:calc(100vw - 140px)}header{padding:0 14px}}