Version 2.0.1 — Ajustements interface v2

viewer.css

@@ -176,10 +176,29 @@ html, body {
 }
 
 .stats {
-  padding: 10px 20px 0 20px;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  gap: 8px;
+  padding: 12px 20px 4px 20px;
+  font-size: 13px;
   color: var(--text-muted);
+}
+.global-stat b {
+  color: var(--text);
+  font-weight: 600;
+}
+.global-stat-main b {
+  font-size: 16px;
+}
+.global-stat-sub {
+  color: var(--text-faint);
   font-size: 12px;
 }
+.global-stat-sep {
+  color: var(--text-faint);
+  opacity: 0.5;
+}
 
 /* ==========================================================================
    Grille de cartes
@@ -284,19 +303,6 @@ html, body {
   background: var(--danger-soft);
 }
 
-.timeline-pompier::before {
-  content: "En pompier toute la journée";
-  position: absolute;
-  top: 2px;
-  right: 14px;
-  font-size: 10px;
-  color: var(--danger);
-  font-weight: 600;
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-  opacity: 0.7;
-}
-
 .timeline-bar {
   position: relative;
   height: 20px;
@@ -387,23 +393,43 @@ html, body {
   font-family: var(--mono);
 }
 
-/* Stats matin / après-midi / total */
+/* Stats par carte : total en gros, matin/aprem en secondaire */
 .card-stats {
   display: flex;
-  gap: 16px;
-  padding: 6px 14px 8px 14px;
+  align-items: baseline;
+  justify-content: space-between;
+  padding: 10px 14px;
+  background: var(--bg-muted);
+  border-bottom: 1px solid var(--border);
+}
+.stat-total {
+  display: flex;
+  align-items: baseline;
+  gap: 6px;
+}
+.stat-total-num {
+  font-size: 22px;
+  font-weight: 700;
+  color: var(--text);
+  line-height: 1;
+}
+.stat-total-lbl {
   font-size: 12px;
   color: var(--text-muted);
-  border-bottom: 1px solid var(--border);
-  background: var(--bg-muted);
 }
-.card-stats .stat-chunk b {
-  color: var(--text);
+.stat-split {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-size: 12px;
+  color: var(--text-faint);
+}
+.stat-split-item b {
+  color: var(--text-muted);
   font-weight: 600;
 }
-.card-stats .stat-chunk.total {
-  margin-left: auto;
-  color: var(--text);
+.stat-split-sep {
+  opacity: 0.4;
 }
 
 /* Note de statut pompier/absent en haut de carte */
@@ -482,31 +508,44 @@ html, body {
   min-width: 0;
   display: flex;
   flex-direction: column;
-  gap: 2px;
+  gap: 1px;
 }
 
-.intervention-title {
+/* La référence S260xxx_xxxxx est mise en avant */
+.intervention-refhdr {
+  font-family: var(--mono);
   font-size: 13px;
+  font-weight: 600;
   color: var(--text);
+  letter-spacing: 0.02em;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.intervention-refhdr.no-ref {
+  font-family: var(--font);
+  font-weight: normal;
+  color: var(--text-faint);
+}
+
+/* Titre type d'intervention en secondaire */
+.intervention-title {
+  font-size: 12px;
+  color: var(--text-muted);
+  font-weight: 500;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
 .intervention-meta {
-  font-size: 12px;
-  color: var(--text-muted);
+  font-size: 11px;
+  color: var(--text-faint);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
-.intervention-ref {
-  font-family: var(--mono);
-  font-size: 11px;
-  color: var(--text-faint);
-}
-
 .intervention-copy {
   flex-shrink: 0;
   padding: 4px 8px;