:root{--nav:#102442;--nav2:#183a65;--bg:#f4f7fb;--card:#fff;--text:#14213d;--muted:#667085;--line:#e4eaf2;--primary:#2563eb;--accent:#11b8a6;--danger:#c0392b;--warn:#9a6700;--radius:18px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--text);background:var(--bg)}a{color:inherit;text-decoration:none}body.app-body{overflow:hidden}.app-shell{display:grid;grid-template-columns:292px minmax(0,1fr);height:100vh}.sidebar{background:linear-gradient(180deg,var(--nav),#0c1c34);color:#e8f0ff;height:100vh;display:flex;flex-direction:column;position:sticky;top:0}.brand{display:flex;align-items:center;gap:12px;padding:26px 22px 20px}.brand-mark{width:48px;height:48px;border-radius:14px;background:#fff;display:grid;place-items:center;color:var(--nav);font-weight:900}.brand-title{font-weight:850;font-size:20px}.brand-sub{font-size:11px;color:#a8bddb;margin-top:2px}.sidebar-scroll{overflow-y:auto;overscroll-behavior:contain;padding:8px 14px 32px;flex:1;scrollbar-width:thin}.nav-label,.v013-nav-label,.v014-nav-label,.v015-nav-label,.v016-nav-label{font-size:11px;letter-spacing:.11em;text-transform:uppercase;font-weight:800;color:#88a5ce;margin:22px 10px 9px}.nav-link,.v013-nav-link,.v014-nav-link,.v015-nav-link,.v016-nav-link{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:11px;color:#dce7f8;font-size:15px;margin:2px 0}.nav-link:hover,.v013-nav-link:hover,.v014-nav-link:hover,.v015-nav-link:hover,.v016-nav-link:hover{background:#ffffff12;color:white}.main{height:100vh;overflow:auto}.topbar{position:sticky;top:0;z-index:20;height:84px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px}.top-title{font-size:20px;font-weight:800}.top-sub{font-size:12px;color:var(--muted);margin-top:3px}.top-actions{display:flex;gap:12px;align-items:center}.user-pill{background:#edf3ff;padding:10px 14px;border-radius:999px;font-weight:700}.content{padding:28px 34px 56px;max-width:1600px;margin:0 auto}.page-header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:20px}.page-header h1{font-size:30px;margin:3px 0 7px}.page-header p{margin:0;color:var(--muted);max-width:820px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.13em;font-weight:850;color:#3970d7}.page-actions,.row-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.card,.table-card,.mini-card,.example-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 8px 28px rgba(16,36,66,.05)}.card{padding:22px;margin-bottom:20px}.card h2{margin:0 0 15px;font-size:19px}.cards-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}.mini-card{padding:18px}.mini-card b{display:block;font-size:18px}.mini-card small{display:block;color:var(--muted);margin:5px 0 12px}.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:24px}.kpi{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px}.kpi strong{display:block;font-size:30px}.kpi span{color:var(--muted)}.button,button{appearance:none;border:0;background:var(--primary);color:white;border-radius:10px;padding:10px 15px;font-weight:750;cursor:pointer;font:inherit}.button.ghost,button.ghost{background:#edf3ff;color:#1e3a64}.button.danger-soft{background:#fff1f0;color:#a62b22}.button.small{padding:7px 10px;font-size:13px}.stack{display:grid;gap:12px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.form-grid .full{grid-column:1/-1}label{font-weight:650;font-size:13px;color:#344054;display:grid;gap:6px}input,select,textarea{width:100%;border:1px solid #ccd6e5;background:#fff;border-radius:10px;padding:10px 11px;font:inherit;color:#1b2b47}/* Une case a cocher n'est pas un champ de saisie. La regle ci-dessus lui donnait 100% de largeur, une bordure et 10px de remplissage : le rond se retrouvait seul au milieu d'une boite vide, loin de son libelle. Constate sur la preinscription publique. */input[type=radio],input[type=checkbox]{width:auto;min-width:0;height:auto;border:0;border-radius:0;padding:0;background:none;accent-color:#2563eb;justify-self:start;align-self:center}/* Une case suivie de son libelle se lit sur une ligne. Sans cette regle, la regle label{display:grid} plus haut posait la case AU-DESSUS du texte. */label.inline{display:flex!important;align-items:center;gap:8px;flex-wrap:wrap}[hidden]{display:none!important}/* Un bouton inactif doit se voir inactif : sinon on clique, rien ne se passe, et on croit l ecran casse. */button:disabled,.button:disabled,button[disabled]{opacity:.45;cursor:not-allowed;filter:grayscale(.35)}label.inline input[type=checkbox],label.inline input[type=radio]{flex:0 0 auto;margin:0}textarea{min-height:95px;resize:vertical}.check{display:flex;grid-auto-flow:column;justify-content:start;align-items:center;gap:8px}.check input{width:auto}.split{display:grid;grid-template-columns:1fr 1fr;gap:18px}.section-header{display:flex;justify-content:space-between;align-items:end;margin:24px 0 10px}.section-header h2{margin:0}.muted{color:var(--muted)}.notice{border:1px solid #cfe0ff;background:#f2f7ff;border-radius:14px;padding:14px 16px;margin:12px 0 20px}.notice.subtle{background:#fafcff}.table-card{overflow:hidden;margin-bottom:20px}.table-responsive{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:13px 15px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#667085;background:#fbfcfe}td small{display:block;color:var(--muted);margin-top:3px}.badge{display:inline-flex;padding:5px 8px;border-radius:999px;background:#eef2f7;font-size:11px;font-weight:800}.badge.success{background:#e8f8f3;color:#08745f}.badge.warning{background:#fff4d6;color:#8b6100}.badge.muted{background:#eef1f5;color:#667085}.empty-state{padding:35px;text-align:center;color:var(--muted)}.alert-success{padding:12px 16px;border-radius:12px;background:#e9fbf5;color:#08745f;margin-bottom:18px}.alert-error{padding:12px 16px;border-radius:12px;background:#fff1f0;color:#9d2c24;margin-bottom:18px}.public-body{background:#f4f7fb}.public-nav{height:76px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1200px)/2))}.public-brand{font-size:22px;font-weight:900;color:#102442}.public-wrap{max-width:1200px;margin:auto;padding:38px 24px 70px}.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;background:#102442;color:white;padding:38px;border-radius:28px;overflow:hidden}.hero h1{font-size:43px;line-height:1.05;margin:0 0 14px}.hero p{color:#cbd8eb;font-size:17px}.hero img{width:100%;border-radius:20px;max-height:360px;object-fit:cover}.event-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:28px}.event-card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden}.event-card .cover{height:155px;background:linear-gradient(135deg,#1d4ed8,#10b9a8);padding:20px;color:#fff;display:flex;align-items:end}.event-card .body{padding:18px}.event-card h3{margin:0 0 8px}.event-card p{color:var(--muted)}.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 20% 10%,#e0ecff 0,transparent 35%),#f4f7fb}.auth-card{width:min(440px,100%);background:#fff;padding:32px;border:1px solid var(--line);border-radius:24px;box-shadow:0 24px 70px rgba(16,36,66,.13)}.auth-card h1{margin:4px 0 6px}.print-only{display:none}@media(max-width:1050px){.app-shell{grid-template-columns:235px minmax(0,1fr)}.kpis{grid-template-columns:repeat(2,1fr)}.event-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){body.app-body{overflow:auto}.app-shell{display:block;height:auto}.sidebar{position:relative;height:auto}.sidebar-scroll{max-height:360px}.main{height:auto;overflow:visible}.topbar{position:relative;padding:0 18px}.content{padding:22px 16px}.split,.form-grid,.hero{grid-template-columns:1fr}.kpis,.event-grid{grid-template-columns:1fr}.page-header{display:block}.page-actions{margin-top:12px}.hero h1{font-size:34px}}@media print{.sidebar,.topbar,.no-print{display:none!important}.main{height:auto;overflow:visible}.content{padding:0}.card,.table-card{box-shadow:none}.print-only{display:block}}

/* v0.16.1 - groupes de navigation repliables */
.nav-group{margin:7px 0;border-radius:12px}.nav-group-summary{list-style:none;cursor:pointer;user-select:none;font-size:11px;letter-spacing:.11em;text-transform:uppercase;font-weight:800;color:#88a5ce;padding:11px 10px 8px;display:flex;align-items:center;justify-content:space-between}.nav-group-summary::-webkit-details-marker{display:none}.nav-groups.is-collapsible .nav-group-summary::after{content:'›';font-size:19px;line-height:1;transition:transform .15s ease}.nav-groups.is-collapsible .nav-group[open]>.nav-group-summary::after{transform:rotate(90deg)}.nav-group-links{padding-bottom:2px}.nav-groups.is-collapsible .nav-group:not([open]) .nav-group-links{display:none}.nav-groups.is-expanded .nav-group{margin:0}.nav-groups.is-expanded .nav-group-summary{cursor:default;pointer-events:none;margin-top:10px}.nav-groups.is-expanded .nav-group-summary::after{display:none}.nav-group[open]>.nav-group-summary{color:#b8cbed}.nav-group-summary:hover{color:#fff}.nav-groups.is-expanded .nav-group-summary:hover{color:#88a5ce}

/* v0.17.0 - tableaux de bord événementiels, grilles CRUD et mobile */
.dashboard-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0 0 26px}.summary-tile{min-height:112px;border-radius:20px;padding:20px;display:flex;align-items:center;gap:16px;color:#fff;box-shadow:0 12px 30px rgba(16,36,66,.12)}.summary-tile.blue{background:#1769e0}.summary-tile.green{background:#0d9f67}.summary-tile.orange{background:#f47a18}.summary-icon{width:48px;height:48px;border-radius:15px;background:#ffffff24;display:grid;place-items:center;font-size:22px}.summary-tile strong{display:block;font-size:32px}.summary-tile span{font-size:13px}.event-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:28px}.event-dashboard-card{--evt:#1769e0;background:#fff;border:1px solid var(--line);border-top:5px solid var(--evt);border-radius:20px;padding:20px;box-shadow:0 10px 28px rgba(16,36,66,.06)}.event-dashboard-card.green{--evt:#0d9f67}.event-dashboard-card.orange{--evt:#f47a18}.event-dashboard-card.purple{--evt:#7547c8}.event-dashboard-card.slate{--evt:#64748b}.event-dashboard-top{display:flex;justify-content:space-between;gap:14px}.event-dashboard-top h3{margin:8px 0 2px;font-size:21px}.event-dashboard-top small{color:var(--muted)}.event-status-pill{display:inline-flex;background:color-mix(in srgb,var(--evt) 12%,white);color:var(--evt);font-weight:850;font-size:10px;padding:6px 9px;border-radius:999px}.icon-action{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#f3f6fb;color:#183a65;font-weight:900}.event-dashboard-dates{display:flex;gap:20px;flex-wrap:wrap;font-size:12px;color:var(--muted);padding:14px 0}.event-metric-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:15px;overflow:hidden}.event-metric-grid>div{padding:13px 10px;border-right:1px solid var(--line)}.event-metric-grid>div:last-child{border:0}.event-metric-grid strong{display:block;font-size:21px;color:var(--evt)}.event-metric-grid span{font-size:10px;color:var(--muted)}.event-dashboard-footer{display:flex;justify-content:space-between;gap:12px;align-items:center;padding-top:14px;font-size:13px}.event-dashboard-footer a{color:var(--evt);font-weight:800}.admin-registry-panel{background:#102442;color:#fff;border-radius:22px;padding:24px;margin:30px 0}.admin-registry-head{display:flex;justify-content:space-between;gap:18px;align-items:center}.admin-registry-head h2{margin:4px 0 5px}.admin-registry-head p{margin:0;color:#b9c8db}.admin-registry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}.admin-registry-grid>div{padding:17px;border-radius:15px;background:#ffffff0d;border:1px solid #ffffff14}.admin-registry-grid strong{display:block;font-size:27px}.admin-registry-grid span{font-size:11px;color:#cbd6e5}.event-detail-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:20px}.event-detail-kpi{background:#fff;border-radius:17px;padding:18px;border:1px solid var(--line);border-bottom:4px solid #1769e0}.event-detail-kpi.green{border-bottom-color:#0d9f67}.event-detail-kpi.purple{border-bottom-color:#7547c8}.event-detail-kpi.orange{border-bottom-color:#f47a18}.event-detail-kpi.navy{border-bottom-color:#102442}.event-detail-kpi span{display:block;color:var(--muted);font-size:11px}.event-detail-kpi strong{display:block;font-size:25px;margin-top:5px}.person-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.person-filter-grid .span2{grid-column:span 2}.filter-actions{display:flex;gap:10px;align-items:end}.crud-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:14px 0}.crud-toolbar-left,.crud-toolbar-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.selection-count{background:#eaf2ff;color:#245fc2;padding:6px 9px;border-radius:999px;font-size:11px}.columns-menu{position:relative}.columns-menu summary{list-style:none;cursor:pointer}.columns-menu summary::-webkit-details-marker{display:none}.columns-popover{position:absolute;right:0;z-index:30;top:46px;width:230px;padding:13px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 16px 45px rgba(16,36,66,.16);display:grid;gap:7px}.column-option{display:flex;grid-auto-flow:column;justify-content:start;align-items:center;gap:8px;font-size:12px}.column-option input{width:auto}.people-grid th{white-space:nowrap}.people-grid td{white-space:nowrap}.matricule-code{font-weight:800;color:#134c9c}.row-icon-actions{display:flex;gap:5px}.row-icon-actions a,.copy-mini{width:31px;height:31px;border-radius:9px;background:#edf3ff;color:#184b91;display:grid;place-items:center;padding:0;border:0;font-weight:900}.copy-mini{cursor:pointer}.hidden-form{display:none}.profile-summary-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:14px;margin-bottom:18px}.profile-identity-card,.profile-stat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}.profile-identity-card{display:flex;align-items:center;gap:15px}.profile-avatar{width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,#1769e0,#0d9f67);color:#fff;display:grid;place-items:center;font-size:20px;font-weight:900}.profile-identity-card h2{margin:3px 0 7px}.profile-stat span{font-size:11px;color:var(--muted)}.profile-stat b{display:block;margin-top:8px;font-size:18px}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.detail-grid>div{background:#f8fafd;border-radius:12px;padding:12px}.detail-grid span,.detail-line span{font-size:11px;color:var(--muted);display:block}.detail-grid b{display:block;margin-top:4px}.detail-line{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.detail-line span{display:inline}.historical-card{border-left:5px solid #f1a72c}.empty-state.compact{padding:15px}.generate-card{display:flex;align-items:center;justify-content:space-between;gap:20px}.generate-card p{margin-bottom:0;color:var(--muted)}.month-code-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.month-code-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end}.recent-matricules>div{padding:8px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:12px}.recent-matricules span{font-size:12px;color:var(--muted)}
@media(max-width:1100px){.event-detail-kpis{grid-template-columns:repeat(3,1fr)}.person-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-summary-grid{grid-template-columns:repeat(2,1fr)}.profile-identity-card{grid-column:1/-1}.event-metric-grid{grid-template-columns:repeat(2,1fr)}.event-metric-grid>div:nth-child(2){border-right:0}.event-metric-grid>div:nth-child(-n+2){border-bottom:1px solid var(--line)}}
@media(max-width:760px){html,body,body.app-body{overflow-x:hidden;overflow-y:auto;touch-action:pan-y}.app-shell{display:block;height:auto;min-height:100vh}.sidebar{position:relative;top:auto;height:auto;min-height:0;touch-action:pan-y}.sidebar-scroll{overflow:visible!important;max-height:none!important;overscroll-behavior:auto!important;touch-action:pan-y;padding-bottom:14px}.main{height:auto!important;overflow:visible!important;touch-action:pan-y}.nav-groups{touch-action:pan-y}.dashboard-summary-grid,.event-dashboard-grid,.admin-registry-grid,.event-detail-kpis,.profile-summary-grid,.person-filter-grid{grid-template-columns:1fr}.person-filter-grid .span2{grid-column:auto}.admin-registry-head,.generate-card,.crud-toolbar{align-items:stretch;flex-direction:column}.event-metric-grid{grid-template-columns:repeat(2,1fr)}.event-dashboard-footer{align-items:flex-start;flex-direction:column}.detail-grid{grid-template-columns:1fr}.month-code-grid{grid-template-columns:1fr}.people-grid-card{border-radius:14px}.people-grid-card .table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}.topbar{height:auto;min-height:74px;padding-top:10px;padding-bottom:10px}.top-actions{flex-wrap:wrap;justify-content:flex-end}.user-pill{font-size:11px}.profile-identity-card{grid-column:auto}}

/* v0.18 - Badges & QR */
.badge-verify-grid{display:grid;grid-template-columns:1fr 190px;gap:24px;align-items:center}.qr-preview svg{width:180px;height:180px;max-width:100%}.badge-check-card{border-top:6px solid #0f4c81}.badge-check-card h1{margin:.25rem 0 1.25rem}
@media(max-width:700px){.badge-verify-grid{grid-template-columns:1fr}.qr-preview{order:-1}.qr-preview svg{width:150px;height:150px}}

/* UN NOM D EVENEMENT NE SE COUPE PAS TOUT SEUL. Sur un telephone de 375 px, le titre
   « RETRAITE NATIONALE 2026 (DEMONSTRATION) » debordait de sa boite de 20 px : un mot de
   quinze lettres ne tient pas sur une ligne de 281 px, et rien ne disait au navigateur
   qu il avait le droit de le couper. Les vrais noms sont plus longs encore -- « RETRAITE
   DES SECTIONS DE L INTERIEUR ». La coupure n intervient que lorsqu il n y a pas d autre
   solution : un titre qui tient reste intact. */
h1,h2,h3,.top-title,.event-card h3,.brand-title{overflow-wrap:break-word}