update

assets/style.css

@@ -78,6 +78,8 @@ h2 { margin-bottom: 18px; font-size: 1.15rem; }
     font-size: 0.9rem;
 }
 
+.field[hidden] { display: none; }
+
 .field strong { color: #c62828; }
 
 select, input {
@@ -2369,6 +2371,9 @@ textarea:disabled {
     font-weight: 900;
     line-height: 1;
 }
+/* Sans cette règle, la pastille affiche « 0 » en permanence : `display: inline-flex`
+   ci-dessus l'emporte sur le `[hidden]` de la feuille du navigateur. */
+.nav-count-badge[hidden] { display: none; }
 .role-access-warning,
 .role-page-notice { margin: 0 0 16px; }
 .entry-locked {
@@ -2417,53 +2422,6 @@ textarea:disabled {
     font-size: 0.82rem;
 }
 .role-selection-form { display: grid; gap: 18px; }
-.role-choice-grid {
-    display: grid;
-    grid-template-columns: repeat(3, minmax(0, 1fr));
-    gap: 14px;
-}
-.role-choice-card { position: relative; cursor: pointer; }
-.role-choice-card input {
-    position: absolute;
-    width: 1px;
-    height: 1px;
-    opacity: 0;
-    pointer-events: none;
-}
-.role-choice-content {
-    display: grid;
-    align-content: start;
-    min-height: 150px;
-    padding: 20px;
-    border: 2px solid #dce4e8;
-    border-radius: 16px;
-    background: #fff;
-    box-shadow: 0 5px 15px rgba(25, 54, 69, 0.05);
-    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease, background 0.15s ease;
-}
-.role-choice-card:hover .role-choice-content {
-    transform: translateY(-2px);
-    border-color: #9cbccd;
-    box-shadow: 0 10px 24px rgba(25, 54, 69, 0.1);
-}
-.role-choice-card input:focus-visible + .role-choice-content {
-    outline: 3px solid rgba(25, 113, 164, 0.25);
-    outline-offset: 3px;
-}
-.role-choice-card input:checked + .role-choice-content {
-    border-color: #1971a4;
-    background: #f0f8fc;
-    box-shadow: 0 0 0 4px rgba(25, 113, 164, 0.1);
-}
-.role-choice-content strong { margin-bottom: 9px; color: #163d55; font-size: 1.03rem; }
-.role-choice-content small { color: #5e6f79; font-size: 0.82rem; line-height: 1.5; }
-.role-context-card {
-    padding: 18px;
-    border: 1px solid #d8e2e7;
-    border-radius: 14px;
-    background: #f8fafb;
-}
-.role-context-card[hidden] { display: none; }
 .role-form-actions { display: flex; justify-content: center; }
 .role-form-actions .button { min-width: 210px; }
 .role-security-note {
@@ -3162,3 +3120,102 @@ textarea:disabled {
     .template-range { grid-template-columns: 1fr 1fr auto; }
     .template-range-separator { display: none; }
 }
+
+/* ---------------------------------------------------------------------------
+   Management (V7.14) — titres de regroupement par objet
+   --------------------------------------------------------------------------- */
+.management-group-title {
+    margin: 8px 0 0;
+    padding-bottom: 8px;
+    border-bottom: 2px solid #dce4e8;
+    color: #163d55;
+    font-size: 1.25rem;
+}
+.management-group-title:not(:first-of-type) { margin-top: 18px; }
+
+/* ---------------------------------------------------------------------------
+   Connexion par jeton (V7.11) — écran role.php
+   --------------------------------------------------------------------------- */
+.role-token-form { max-width: 520px; margin: 0 auto; }
+.role-token-input {
+    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+    font-size: 1.05rem;
+    letter-spacing: 0.08em;
+    text-align: center;
+    text-transform: uppercase;
+}
+.role-resume-link { margin-left: 10px; }
+.role-step-back { margin: 0; text-align: center; }
+
+/* ---------------------------------------------------------------------------
+   Espace DSI (V7.11) — comptes d'accès et journal d'activité
+   --------------------------------------------------------------------------- */
+.dsi-page { display: grid; gap: 18px; }
+.dsi-installation-warning { margin: 0; }
+
+/* Panneau des jetons en clair : volontairement contrasté, il ne doit pas passer
+   inaperçu — son contenu n'est affiché qu'une fois. */
+.dsi-token-panel { border: 2px solid #d9911e; background: #fffdf7; }
+.dsi-token-list { display: grid; gap: 8px; margin: 14px 0; }
+.dsi-token-row {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    gap: 10px;
+    padding: 10px 12px;
+    border: 1px solid #ead9b6;
+    border-radius: 10px;
+    background: #fff;
+}
+.dsi-token-identity { display: grid; }
+.dsi-token-identity small { color: #66737d; font-size: 0.78rem; }
+.dsi-token-value {
+    padding: 6px 10px;
+    border-radius: 8px;
+    background: #f3f7f9;
+    color: #163d55;
+    font-size: 1rem;
+    letter-spacing: 0.06em;
+    user-select: all;
+}
+/* Zone technique du repli de copie : présente dans le DOM, jamais visible. */
+.dsi-clipboard-relay { position: fixed; top: -1000px; left: -1000px; opacity: 0; }
+
+.dsi-accounts-table code, .dsi-journal-table code { font-size: 0.82rem; color: #31556a; }
+.dsi-actions-cell { display: flex; flex-wrap: wrap; gap: 6px; }
+.dsi-actions-cell .button { padding: 6px 10px; font-size: 0.78rem; }
+.dsi-state {
+    display: inline-block;
+    padding: 3px 9px;
+    border-radius: 999px;
+    font-size: 0.75rem;
+    white-space: nowrap;
+}
+.dsi-state-on { background: #e6f4ec; color: #1d6b45; }
+.dsi-state-off { background: #f0f2f4; color: #66737d; }
+.dsi-state-alert { background: #fdeceb; color: #a12a20; }
+.dsi-state-wait { background: #fff4e2; color: #8a5a12; }
+
+.dsi-journal-filters { align-items: end; }
+.dsi-journal-table td { vertical-align: top; font-size: 0.85rem; }
+.dsi-journal-table small { color: #66737d; }
+.dsi-journal-context { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.72rem; }
+.dsi-journal-refus { background: #fff6f5; }
+.dsi-journal-erreur { background: #fdeceb; }
+.dsi-pagination {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 12px;
+    margin-top: 14px;
+    color: #66737d;
+    font-size: 0.85rem;
+}
+.dsi-purge-form { align-items: end; margin-top: 18px; }
+.dsi-purge-form .hint { margin: 0; }
+
+@media (max-width: 850px) {
+    .dsi-token-row { flex-direction: column; align-items: flex-start; }
+    .dsi-pagination { flex-direction: column; }
+}