/* Rendu partage d'une mesure : rapport et apercu d'analyse. */
.rsub-head { margin:var(--s4) 0 var(--s1); font-size:var(--fs-md); font-weight:600;
  color:var(--ink-2); padding-bottom:var(--s2); border-bottom:1px solid var(--border-soft); }
.rsub-comment { font-size:var(--fs-xs); color:var(--ink-muted); margin:0 0 var(--s2); }

.rsection { padding:var(--s4) 0; scroll-margin-top:20px; }
.rsection + .rsection { border-top:1px solid var(--border-soft); }
.rsection-head { display:flex; align-items:center; gap:var(--s2); margin-bottom:var(--s3); }
.rsection-head .side { width:8px; height:8px; border-radius:50%; flex:none; }
.rsection-head .side.split { background:linear-gradient(90deg,var(--side-left) 50%,var(--side-right) 50%); }
.rsection-head .side.left { background:var(--side-left); }
.rsection-head .side.right { background:var(--side-right); }
.rsec-title { font-size:var(--fs-lg); font-weight:600; flex:1; }
.rsec-order { font-family:var(--font-mono); font-size:9px; color:var(--ink-muted); }
.rsec-live-badge { display:none; align-items:center; gap:4px; font-size:9px; font-weight:600; text-transform:uppercase;
  letter-spacing:.05em; color:var(--danger); }
.rsec-live-badge::before { content:""; width:5px; height:5px; border-radius:50%; background:var(--danger); animation:pulse 1.2s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }
.rsection.is-active .rsec-live-badge { display:inline-flex; }

.rsec-media { display:flex; gap:var(--s3); align-items:stretch; margin-bottom:var(--s3); }
.rsec-thumb-wrap { flex:none; width:188px; display:flex; align-items:stretch; }
.rsec-thumb { width:188px; height:188px; aspect-ratio:1; border-radius:var(--r-sm); border:2px solid transparent; cursor:pointer;
  background:var(--bg-sunken) center/cover no-repeat; display:flex; align-items:center; justify-content:center;
  transition:border-color var(--dur) var(--ease); overflow:hidden; padding:4px;
  font-size:9px; color:var(--ink-muted); text-align:center; }
.rsec-thumb:hover { border-color:var(--border); }
.rsection.is-active .rsec-thumb { border-color:var(--primary); }
.rsec-thumb img { width:100%; height:100%; object-fit:contain; }

.rsec-chart-wrap { position:relative; flex:1; min-width:0; border-radius:var(--r); overflow:hidden;
  border:1px solid var(--border-soft); background:var(--chart-panel); cursor:pointer;
  touch-action:pan-y; }
.rsec-chart-wrap.is-scrubbing { cursor:ew-resize; }
.rsec-chart-wrap.is-scrubbing .chart-click-hint { display:none; }
.rsec-chart-wrap svg { width:100%; height:186px; display:block; }
.chart-playhead { stroke:var(--primary); stroke-width:.5; opacity:0; }
.rsection.is-active .chart-playhead { opacity:.95; }
.chart-axis-label { position:absolute; bottom:4px; right:8px; font-size:9px;
  color:var(--ink-muted); font-family:var(--font-mono); }
.chart-hover-line { stroke:var(--ink-muted); stroke-width:1; stroke-dasharray:2 2; opacity:0; }
.rsec-chart-wrap.hovering .chart-hover-line { opacity:.8; }
.chart-tip { position:absolute; top:8px; transform:translateX(-50%); background:var(--bg-surface); color:var(--ink);
  font-family:var(--font-mono); font-size:10px; padding:3px 7px; border-radius:6px; box-shadow:var(--shadow-sm);
  border:1px solid var(--border); pointer-events:none; opacity:0; white-space:nowrap; }
.rsec-chart-wrap.hovering .chart-tip { opacity:1; }
.chart-empty { position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:var(--fs-xs); color:var(--ink-muted); }
.chart-click-hint { position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(21,30,45,0); opacity:0; transition:opacity var(--dur) var(--ease), background var(--dur) var(--ease); pointer-events:none; }
.rsec-chart-wrap:hover .chart-click-hint { opacity:1; background:rgba(21,30,45,.22); }
.rsection.is-active .chart-click-hint { display:none; }
.chart-click-hint span { background:var(--bg-surface); color:var(--ink); font-size:9px; font-weight:500; padding:4px 9px;
  border-radius:var(--r-pill); box-shadow:var(--shadow-sm); }

.rsec-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.chip { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; height:44px; border-radius:9px;
  background:var(--bg-sunken); border:1px solid var(--border-soft); }
.chip .k { font-size:9px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-muted); }
.chip .v { font-family:var(--font-mono); font-size:var(--fs-sm); font-weight:500; color:var(--ink); font-variant-numeric:tabular-nums; }
.chip--phase { min-height:54px; height:auto; padding:4px; text-align:center; }
.rsec-aqm-asymmetry { width:100%; border-collapse:collapse; margin:var(--s3) 0; font-size:var(--fs-sm); }
.rsec-aqm-asymmetry th, .rsec-aqm-asymmetry td { border:1px solid var(--border-soft); padding:6px 8px; text-align:left; }
.rsec-aqm-asymmetry td:not(:first-child) { font-family:var(--font-mono); font-variant-numeric:tabular-nums; }

.rsec-stats-split { display:grid; grid-template-columns:1fr 1fr; gap:var(--s4); }
.rsec-stats-col { border-left:3px solid var(--border); padding-left:9px; display:flex; flex-direction:column; gap:6px; }
.rsec-stats-col.col-left { border-left-color:var(--side-left); }
.rsec-stats-col.col-right { border-left-color:var(--side-right); }
.rsec-stats-col .col-label { font-size:9px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; }
.rsec-stats-col.col-left .col-label { color:var(--side-left); }
.rsec-stats-col.col-right .col-label { color:var(--side-right); }
.chip-grid2 { display:grid; grid-template-columns:repeat(2,1fr); gap:6px; }

.rsec-comment { font-size:var(--fs-sm); color:var(--ink-2); line-height:1.65; margin-top:var(--s3); padding-left:var(--s3);
  border-left:2px solid var(--border-soft); }

@media print {
  .rsec-thumb { background: transparent !important; border-color: transparent !important; }
  .rsec-live-badge { display: none !important; }
}

/* Figure du centre de masse : légende des acteurs quand ils sont plusieurs. */
.rsec-com-legend { display: flex; gap: 12px; flex-wrap: wrap; font-size: 10px; color: var(--ink-2); padding: 2px 4px; }
.rsec-com-legend i { display: inline-block; width: 10px; height: 3px; border-radius: 2px; margin-right: 4px; vertical-align: middle; }