/* ── coquille : barre verticale + espace de travail ──────────────── */
.app { position: relative; display: flex; height: 100dvh; overflow: hidden; background: var(--bg-page); }

/* ── bandeau des panneaux repliés (30 px) ────────────────────────── */
.strip { flex: none; height: 38px; display: flex; align-items: center; gap: 5px;
         padding: 0 var(--s3); position: relative; }
.analysis-rail { top: var(--s3); }
.strip .spacer { flex: 1; }
.strip-btn {
  height: 22px; padding: 0 9px; border: none; border-radius: 7px;
  background: var(--bg-surface); color: var(--ink-2); box-shadow: var(--shadow-sm);
  font: inherit; font-size: var(--fs-xs); cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
}
.strip-btn:hover { color: var(--ink); }
.strip-btn .num { font-family: var(--font-mono); font-size: 10px; color: var(--primary-hi); }
.strip-project { background: var(--primary-soft); color: var(--primary-hi); font-weight: 600; }
.strip-divider { width: 1px; height: 20px; flex: none; margin: 0 5px;
  background: var(--border); }
.strip-closed-label { flex: none; color: var(--ink-muted); font-size: 10px;
  font-weight: 600; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.strip-closed-zone { display: flex; gap: 4px; }
.workspace-switch { display: inline-flex; align-items: center; gap: 2px; flex: none;
  padding: 2px; border: 1px solid var(--border); border-radius: 9px;
  background: var(--bg-sunken); }
.workspace-switch-btn { height: 24px; padding: 0 11px; border: 0; border-radius: 6px;
  color: var(--ink-2); background: transparent; font: inherit; font-size: var(--fs-xs);
  font-weight: 600; cursor: pointer; }
.workspace-switch-btn:hover { color: var(--ink); background: var(--bg-hover); }
.workspace-switch-btn[aria-pressed="true"] { color: var(--primary-hi); background: var(--bg-surface);
  box-shadow: var(--shadow-sm); }
.strip #stripLeft .strip-btn, .strip #stripCenter .strip-btn,
.strip #stripRight .strip-btn { color: var(--ink-muted); background: transparent;
  box-shadow: none; border: 1px solid var(--border); }
.strip #stripLeft .strip-btn:hover, .strip #stripCenter .strip-btn:hover,
.strip #stripRight .strip-btn:hover { color: var(--ink); background: var(--bg-surface); }
.app:not(.nav-closed) #navReveal { display: none; }

/* ── espace de travail ──────────────────────────────────────────── */
.wsp { position: relative; flex: 1; min-width: 0; display: flex; flex-direction: column;
       padding-left: 30px; }
.app:not(.nav-closed) .wsp { padding-left: 0; }
@media (max-width: 1599px) {
  .app > .sidebar:not(.is-closed) {
    position: absolute; left: 0; top: 0; bottom: 0; z-index: 40;
    width: 236px; box-shadow: var(--shadow-lg);
  }
  .app > .sidebar.is-closed { position: absolute; left: 0; top: 0; bottom: 0; }
}
.wk { flex: 1; min-height: 0; display: flex; flex-direction: column;
      gap: 0; padding: 0 var(--s3) var(--s3); }
.wk-top { flex: 1; min-height: 0; }
.plot-deck { display: flex; flex-direction: column; gap: 6px; min-height: 0; }
/* Ces deux conteneurs portent des cartes : leur overflow herite de .pane
   couperait les ombres sur les cotes et en haut. */
#plotDeck, #rightCol { overflow: visible; }
.plot-deck > .panel { flex: 1; min-height: 0; }
.plot-deck--double { --split: 1fr 6px 1fr; display: grid;
  grid-template-columns: var(--split); gap: 0; }
.plot-deck--double > .panel { min-width: 0; }

/* ── vue 3D : sans titre, commandes en surimpression ────────────── */
.view3d {
  position: relative; background: var(--dark-bg);
  background-image: linear-gradient(var(--vp-grid) 1px, transparent 1px),
                    linear-gradient(90deg, var(--vp-grid) 1px, transparent 1px);
  background-size: 24px 24px; display: grid; place-content: center;
  border-radius: var(--r-lg); box-shadow: var(--shadow-sm);
}
:root:not([data-theme="dark"]) .view3d { background-color: var(--chart-panel); }
.view3d #analysis-canvas { position: absolute; inset: 0; width: 100%; height: 100%;
  display: block; min-width: 0; min-height: 0; }
.view-targets { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; }
.view-target { position: absolute; width: 24px; height: 24px; transform: translate(-50%,-50%);
  border: 0; background: transparent; cursor: grab; pointer-events: auto; padding: 0; }
.view-target::before { content: ''; position: absolute; left: 50%; top: 50%;
  width: var(--target-diameter, 15px); height: var(--target-diameter, 15px);
  transform: translate(-50%,-50%) scale(.5); border: 1.5px solid #fff; border-radius: 50%;
  background: #5fa3db; box-shadow: 0 0 0 2px #20334dcc; opacity: .5; }
.view-target--marker::before { border-radius: 2px; transform: translate(-50%,-50%) rotate(45deg) scale(.5);
  background: #dfb346; }
.view-target:hover::before, .view-target[aria-selected="true"]::before { background: #e87558; }
.view3d #sceneStatus { position: absolute; z-index: 1; inset: 0; display: grid;
  place-content: center; text-align: center; color: #e0ecd8; background: rgba(21,30,45,.7); }
.view3d #sceneStatus[hidden] { display: none; }
.view-tools { position: absolute; z-index: 3; left: var(--s2); right: var(--s2);
  top: var(--s2); pointer-events: none; }
.view-tool-group { display: flex; align-items: flex-start; gap: 4px; pointer-events: auto; }
.view-tool-group--center { position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
.view-tool-group--right { position: absolute; top: 0; right: 0; }
.view-tool-dropdown { position: relative; }
.view-tools button {
  width: 26px; height: 26px; border: none; border-radius: 7px; cursor: pointer;
  background: rgba(255,255,255,.10); color: #e0ecd8; font-size: 13px;
  display: inline-flex; align-items: center; justify-content: center;
}
.view-tools button img { width: 17px; height: 17px; object-fit: contain; }
.view-tools button:hover { background: rgba(255,255,255,.22); color: #fff; }
:root:not([data-theme="dark"]) .view-tools button {
  background: rgba(255,255,255,.78); color: var(--gray-900);
}
:root:not([data-theme="dark"]) .view-tools button img { filter: brightness(0); }
:root:not([data-theme="dark"]) .view-tools button:hover {
  background: rgba(255,255,255,.95);
}
.view-tools button[aria-pressed="true"], .view-tools button[aria-expanded="true"] {
  background: var(--primary); }
:root:not([data-theme="dark"]) .view-tools button[aria-pressed="true"],
:root:not([data-theme="dark"]) .view-tools button[aria-expanded="true"] {
  background: var(--primary);
}
.view-tool-menu { position: absolute; top: 32px; left: 0; width: 218px;
  display: grid; gap: 7px; padding: 10px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--bg-surface); color: var(--ink);
  box-shadow: var(--shadow-lg); font-size: var(--fs-xs); }
.view-tool-menu[hidden] { display: none; }
.view-tool-menu strong { font-size: 10px; text-transform: uppercase; color: var(--ink-muted); }
.view-tool-menu label { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.view-tool-menu input { accent-color: var(--primary); }
.view-tool-menu select { width: 100%; font: inherit; color: var(--ink);
  background: var(--bg-surface); border: 1px solid var(--border); border-radius: 5px; }

/* ── contenus des panneaux ──────────────────────────────────────── */
.tree { font-size: var(--fs-xs); }
.tree-row {
  display: flex; align-items: center; gap: 6px; width: 100%;
  padding: 3px var(--s2); margin: 1px; border: none; background: none; font: inherit;
  color: var(--ink); text-align: left; cursor: pointer; border-radius: var(--r-sm);
}
.tree-row:hover { background: var(--bg-hover); }
.tree-row[aria-selected="true"] { background: var(--primary-soft); color: var(--primary-hi);
                                  font-weight: 600; }
.tree-row .n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis;
               white-space: nowrap; }
.tree-row .k { font-size: 10px; color: var(--ink-muted); }
/* Reduce only the icon/name gap from 6 px to 4.2 px. */
.tree-row .ic { width: 14px; text-align: center; flex: none; opacity: .75; margin-right: -1.8px; }
.tree-row[draggable="true"] { cursor: grab; }
.tree-row[draggable="true"]:active { cursor: grabbing; }

.seg-row { display: flex; align-items: center; gap: var(--s2); padding: 1px var(--s2);
           font-size: var(--fs-xs); border-radius: var(--r-sm); }
.seg-row:hover { background: var(--bg-hover); }
.seg-row[aria-selected="true"] { background: var(--primary-soft); color: var(--primary-hi); }
.seg-row input { accent-color: var(--primary); }
.seg-row .sw { width: 9px; height: 9px; border-radius: 2px; flex: none; }
.seg-row .n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis;
              white-space: nowrap; }
.seg-row.off .n { color: var(--ink-muted); text-decoration: line-through; }
.seg-row .sp { font-family: var(--font-mono); font-size: 10px; color: var(--ink-muted); }

.plot-controls { display: flex; align-items: center; gap: 6px; min-height: 34px;
                 padding: 4px 10px; }
.plot-controls--main { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; white-space: nowrap; }
/* Barre d'outils de Courbes : les trois rangées (grandeur, alignement, plan) se fondent en un seul bloc qui ne passe à la
   ligne que faute de place, pour garder la hauteur au tracé. */
.plot-toolbar { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px;
  padding: 4px 10px; min-height: 34px; }
.plot-toolbar > .plot-controls { display: contents; }
.plot-toolbar > .plot-controls[hidden] { display: none; }
.plot-toolbar [data-advanced], .plot-toolbar #plotAdvancedBtn { order: 99; margin-left: auto; }
.plot-toolbar .plot-controls--warp .plot-dtw-options, .plot-toolbar .plot-controls--warp .plot-merge-options { top: calc(100% + 2px); }
.plot-toolbar.is-drop-target { outline: 2px solid var(--primary); outline-offset: -2px; background: var(--primary-soft); }
.plot-controls--detail { flex-wrap: wrap; }
.plot-controls--warp { position: relative; flex-wrap: nowrap; border-top: 1px solid var(--border-soft);
  gap: 8px; white-space: nowrap; }
.plot-dtw-options, .plot-merge-options { position: absolute; z-index: 12; top: calc(100% + 2px);
  left: 8px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  width: min(520px, calc(100% - 16px)); padding: 10px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--bg-surface); box-shadow: 0 8px 22px #0002;
  white-space: normal; }
.plot-dtw-options[hidden], .plot-merge-options[hidden] { display: none; }
.plot-controls--warp input[type="range"] { width: 75px; vertical-align: middle; }
.plot-controls--warp button { border: 1px solid var(--border); border-radius: 5px;
  background: var(--bg-surface); color: var(--ink); font: inherit; font-size: 11px;
  padding: 3px 7px; cursor: pointer; }
.plot-axis-label, #plotDtwStatus, [data-dtw-status] { color: var(--ink-muted); font-size: 10px; }
.plot-controls--warp > .plot-axis-label { display: none; }
.plot-controls[hidden], .plot-distance-controls[hidden] { display: none; }
.plot-controls--detail select { max-width: 150px; }
.plot-controls label { color: var(--ink-muted); font-size: 10px; }
.plot-controls select { height: 24px; border: 1px solid var(--border); border-radius: 6px;
                        background: var(--bg-surface); color: var(--ink); font: inherit;
                        font-size: 11px; padding: 0 5px; }
.plot-convention-status { flex: none; max-width: 210px; overflow: hidden;
  text-overflow: ellipsis; color: var(--ink-muted); font-size: 10px; }
.plot-convention-status[hidden] { display: none; }
.plot-axes { display: flex; gap: 2px; margin-left: 4px; flex: none; }
.plot-axes[hidden] { display: none; }
.plot-axes button { border: none; border-radius: 5px; background: var(--bg-sunken);
                    color: var(--ink-2); min-width: 24px; height: 23px; cursor: pointer;
                    font: inherit; font-size: 11px; }
.plot-axes button[aria-pressed="true"] { background: var(--primary-soft);
                                       color: var(--primary-hi); font-weight: 700; }
.plot { position: relative; flex: 1; min-height: 0; background: var(--chart-panel); }
.plot svg { width: 100%; height: 100%; display: block; }
.plot.is-drop-target { outline: 2px solid var(--primary); outline-offset: -2px;
                       background: var(--primary-soft); }
.plot-empty { position: absolute; inset: 0; display: grid; place-items: center;
              color: var(--ink-muted); font-size: var(--fs-xs); pointer-events: none; }
.plot-empty[hidden] { display: none; }
.plot-sources { position: absolute; top: 5px; right: 8px; z-index: 2;
                display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 3px;
                max-width: min(55%, 380px); }
.plot-sources[hidden] { display: none; }
.plot-source { border: 1px solid var(--border-soft); border-radius: var(--r-pill);
               background: var(--bg-surface); color: var(--ink); font: inherit;
               font-size: 10px; padding: 2px 7px; cursor: pointer; }
.plot-source[aria-pressed="false"] { color: var(--ink-muted); opacity: .65; }
.plot-source:hover { border-color: var(--primary); }
.plot-distance-controls { display: flex; align-items: center; gap: 4px; flex: none; }
.plot-distance-controls select { width: 132px; }
.plot-distance-controls button { height: 24px; padding: 0 8px; border: 1px solid var(--border);
  border-radius: 6px; background: var(--bg-surface); color: var(--ink); cursor: pointer; }
.plot-distance-controls button:disabled { opacity: .45; cursor: default; }
.plot-distances { position: absolute; top: 5px; left: 8px; z-index: 3;
  display: flex; gap: 4px; flex-wrap: wrap; max-width: 40%; }
.plot-distance { border: 1px solid var(--border); border-radius: var(--r-pill);
  background: var(--bg-surface); color: var(--ink); font: inherit; font-size: 10px;
  padding: 2px 7px; cursor: pointer; }
.plot-distance[aria-selected="true"] { border-color: var(--primary); background: var(--primary-soft); }
.plot:has(.plot-distance) .plot-legend { top: 32px; }
.plot-legend { position: absolute; left: 10px; top: 8px; display: flex; flex-direction: column;
               gap: 2px; pointer-events: none; }
.plot-legend span { font-size: 10px; color: var(--ink-2); display: flex; align-items: center; gap: 5px; }
.plot-legend i { width: 10px; height: 2px; display: inline-block; }
.plot-readout { position: absolute; right: 8px; bottom: 7px; z-index: 4; max-width: calc(100% - 16px);
  padding: 3px 7px; border-radius: 5px; background: color-mix(in srgb, var(--chart-panel) 86%, transparent);
  color: var(--ink-2); font: 10px var(--font-mono); pointer-events: none; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; }
.plot-axis-meaning { position: absolute; left: 8px; bottom: 7px; z-index: 3;
  max-width: 45%; color: var(--ink-2); font-size: 10px; pointer-events: none; }
.plot-playhead { stroke: var(--primary); stroke-width: 0.5; }
.plot-selection { fill: rgba(226,165,46,.20); pointer-events: none; }
.plot-mark { stroke: #e2a52e; stroke-width: 2; vector-effect: non-scaling-stroke;
  cursor: pointer; pointer-events: stroke; }
.plot-drag-selection { position: absolute; top: 0; bottom: 0; z-index: 2;
  background: rgba(226,165,46,.20); border-inline: 1px solid #e2a52e;
  pointer-events: none; }
.menu-item--disabled { opacity: .42; pointer-events: none; }
.plot-settings { width: min(1030px, calc(100vw - 32px)); max-width: none;
  height: min(660px, calc(100vh - 32px)); max-height: none;
  border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--bg-surface);
  color: var(--ink); box-shadow: var(--shadow-lg); padding: 16px; }
.plot-settings::backdrop { background: rgba(10,20,35,.55); }
.plot-settings[open] { display: flex; flex-direction: column; overflow: hidden; }
.plot-settings-head { display: flex; justify-content: space-between; align-items: center; gap: 12px;
  border-bottom: 1px solid var(--border-soft); padding-bottom: 10px; margin-bottom: 12px; }
.plot-settings-head h2 { margin: 0; font-size: 16px; }
.plot-settings-head button { border: 0; background: transparent; color: var(--ink); font-size: 24px; cursor: pointer; }
.plot-settings-grid { display: grid; grid-template-columns: 120px minmax(0,1fr); gap: 9px 12px;
  align-items: center; font-size: 12px; }
.plot-settings-grid select { width: 100%; min-width: 0; padding: 5px;
  border: 1px solid var(--border); border-radius: 5px; background: var(--bg-surface); color: var(--ink); }
.plot-settings-grid .plot-axes { flex-wrap: wrap; margin-left: 0; }
.plot-settings-sources { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 12px; }
.plot-settings #plotAdvancedBody { flex: 1; min-height: 0; }
.plot-advanced-layout { display: grid; grid-template-columns: minmax(195px, .24fr)
  minmax(330px, .42fr) minmax(255px, .34fr); gap: 8px; height: 100%; min-height: 0; }
.plot-advanced-column { min-width: 0; min-height: 0; overflow: auto;
  border: 1px solid var(--border); border-radius: 5px; padding: 10px; }
.plot-advanced-column:first-child { display: flex; flex-direction: column; overflow: hidden; }
.plot-advanced-column h3 { font-size: 14px; margin: 0 0 4px; }
.plot-advanced-column h4 { font-size: 10px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted); margin: 16px 0 6px; }
.plot-advanced-column p { color: var(--ink-muted); font-size: 11px; margin: 0 0 10px; }
.plot-advanced-column input[type="search"], .plot-advanced-field select,
.plot-advanced-entry-controls select, .plot-advanced-marks input { width: 100%; min-width: 0;
  border: 1px solid var(--border); border-radius: 5px; background: var(--bg-surface);
  color: var(--ink); font: inherit; padding: 5px; }
.plot-advanced-source-list { margin-top: 8px; overflow: auto; flex: 1; min-height: 0; }
.plot-advanced-source { display: flex; align-items: center; gap: 6px; padding: 3px;
  font-size: 11px; cursor: pointer; }
.plot-advanced-source:hover { background: var(--bg-hover); }
.plot-advanced-source[hidden] { display: none; }
.plot-advanced-source i { width: 5px; height: 17px; border-radius: 2px; flex: none; }
.plot-advanced-source span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plot-advanced-count { margin-top: 8px !important; }
.plot-advanced-field { display: grid; gap: 3px; margin: 8px 0; font-size: 11px; }
.plot-advanced-field > label { color: var(--ink-muted); }
.plot-advanced-field input[type="range"] { width: 100%; }
.plot-advanced-group { border-top: 1px solid var(--border-soft); padding: 9px 0; opacity: .72; }
.plot-advanced-group.is-active { opacity: 1; }
.plot-advanced-group-title { display: flex; align-items: center; gap: 5px;
  font-size: 12px; font-weight: 600; cursor: pointer; }
.plot-advanced-group-title small { font-size: 10px; color: var(--ink-muted); font-weight: 400; }
.plot-advanced-char-row { display: flex; align-items: center; gap: 8px; margin-top: 5px; }
.plot-advanced-char-row > span:first-child { width: 78px; flex: none; color: var(--ink-muted);
  font-size: 11px; }
.plot-advanced-char-row .plot-axes { flex-wrap: wrap; margin: 0; }
.plot-advanced-inline { display: flex; gap: 16px; font-size: 11px; margin: 10px 0; }
.plot-advanced-entry { border-top: 1px solid var(--border-soft); padding: 7px 0; }
.plot-advanced-entry-head { display: flex; justify-content: space-between; gap: 6px;
  font-size: 11px; }
.plot-advanced-entry-head label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plot-advanced-entry-head button { border: 0; background: none; color: var(--ink-muted);
  cursor: pointer; font: inherit; }
.plot-advanced-entry-controls { display: grid; grid-template-columns: 1fr 1fr 94px;
  align-items: end; gap: 5px; margin-top: 5px; }
.plot-advanced-entry-controls label { color: var(--ink-muted); font-size: 10px; }
.plot-advanced-entry-controls input { width: 100%; }
.plot-advanced-marks label { display: block; font-size: 11px; margin: 5px 0; }
@media (max-width: 820px) {
  .plot-advanced-layout { display: block; overflow: auto; }
  .plot-advanced-column { margin-bottom: 8px; max-height: 360px; }
}

.grp + .grp { border-top: 1px solid var(--border-soft); margin-top: var(--s3);
              padding-top: var(--s3); }
.grp h4 { font-size: 9px; font-weight: 700; text-transform: uppercase;
          letter-spacing: .06em; color: var(--ink-muted); margin-bottom: var(--s2); }
.pos-row { display: flex; align-items: center; gap: var(--s2); font-size: var(--fs-xs);
           padding: 4px 0; }
.pos-row .dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.pos-row .n { flex: 1; }
.pos-row .c { font-family: var(--font-mono); font-size: 10px; color: var(--ink-muted); }

.stat-grp + .stat-grp { margin-top: var(--s3); }
.stat-grp .t { font-size: var(--fs-xs); font-weight: 600; color: var(--ink);
               display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.stat-grp .t .dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.stat-row { display: flex; align-items: center; gap: var(--s2); padding: 3px 0;
            font-size: var(--fs-xs); }
.stat-row .k { flex: 1; color: var(--ink-2); }
.stat-row .v { font-family: var(--font-mono); font-variant-numeric: tabular-nums;
               font-weight: 500; }

/* ── panneau NU : propriétés de la sélection ─────────────────────
   Sans cadre ni ombre, volontairement : ce n'est pas un outil de plus, c'est
   une légende de ce qui est sélectionné ailleurs. Lui donner une carte
   l'aurait mis au même rang que Postures ou Statistiques. */
.panel--bare { background: none; box-shadow: none; flex: none; }
.panel--bare .panel-head { padding-bottom: 4px; }
/* Un manque n'est pas une erreur : le signe reste discret, et c'est
   l'info-bulle qui porte la phrase. Un paragraphe rouge en gras dans un
   panneau de legende aurait crie plus fort que la donnee. */
.hint-warn { color: var(--danger); cursor: help; font-size: 12px; }
#measure .hint { font-size: 12px; }
.prop-row { display: flex; gap: var(--s2); font-size: var(--fs-xs); padding: 2px 0; }
.prop-row .k { width: 76px; flex: none; color: var(--ink-muted); }
.prop-row .v { flex: 1; min-width: 0; color: var(--ink); word-break: break-word; }
.prop-vector { display: grid; grid-template-columns: 120px repeat(3, minmax(0, 1fr));
  gap: 5px; align-items: center; margin: 7px 0; font-size: var(--fs-xs); }
.prop-vector .k { color: var(--ink-muted); white-space: nowrap; font-size: 10px; }
.prop-vector output { display: block; padding: 3px 2px; border: 1px solid var(--border-soft);
  border-radius: 4px; background: var(--bg-sunken); text-align: center; font-family: var(--font-mono); }

/* ── création d'un intervalle (panneau 5) ───────────────────────── */
.make { border-top: 1px solid var(--border-soft); margin-top: var(--s3);
        padding-top: var(--s3); display: flex; flex-direction: column; gap: 6px; }
.make-row { display: flex; align-items: center; gap: 6px; }
.make-row label { font-size: 10px; color: var(--ink-muted); width: 54px; flex: none; }
.make select, .make input[type=text] {
  flex: 1; min-width: 0; height: 26px; padding: 0 6px; font: inherit;
  font-size: var(--fs-xs); color: var(--ink);
  background: var(--bg-surface); border: 1px solid var(--border); border-radius: 7px;
}
.make .seg-kind { display: flex; gap: 2px; padding: 2px; background: var(--bg-sunken);
                  border-radius: var(--r-pill); flex: 1; }
.make .seg-kind button { flex: 1; border: none; background: none; font: inherit;
  font-size: 10px; color: var(--ink-2); padding: 4px 8px; border-radius: var(--r-pill);
  cursor: pointer; }
.make .seg-kind button[aria-pressed="true"] { background: var(--bg-raised); color: var(--ink);
  font-weight: 600; box-shadow: var(--shadow-sm); }
.make input[type=range] { flex: 1; min-width: 0; accent-color: var(--primary); }
.make .mono { font-family: var(--font-mono); font-size: 10px; color: var(--ink-muted);
              width: 46px; text-align: right; flex: none; }

/* La posture COURANTE : celle que les reglages et la detection visent. */
.pos-pick { width: 100%; border: none; background: none; font: inherit; text-align: left;
            border-radius: var(--r-sm); cursor: pointer; }
.pos-pick:hover { background: var(--bg-hover); }
.pos-pick.is-current { background: var(--primary-soft); }
.pos-pick.is-current .n { color: var(--primary-hi); font-weight: 600; }

/* ── statistiques sélectionnables (panneau 6) ───────────────────── */
/* Une valeur cliquée est une valeur RETENUE pour le rapport : le cadre pastel
   le dit sans mot, exactement comme la planche approuvée
   (Docs/refs/statistics-panel-design.html §2). */
.stat-row { cursor: pointer; border-radius: 7px; padding: 4px 6px; margin: 0 -6px; }
.stat-row:hover { background: var(--bg-hover); }
.stat-row.is-picked { background: var(--primary-soft); }
.stat-row.is-picked .k { color: var(--primary-hi); }
.stat-row.is-picked .v { color: var(--primary-hi); font-weight: 600; }
.send-bar { position: sticky; bottom: 0; padding-top: var(--s2); background: var(--bg-surface); }
.send-bar[hidden] { display: none; }

/* ── popup « Nouvelle mesure » ──────────────────────────────────── */
.modal { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center;
         padding: 16px; background: rgba(21,30,45,.42); }
.modal[hidden] { display: none; }
.popup-stack { width: min(1040px, 100%); max-height: calc(100vh - 32px);
  display: flex; flex-direction: column; gap: 10px; overflow-y: auto;
  scrollbar-width: none; -ms-overflow-style: none; }
.popup-stack::-webkit-scrollbar { display: none; }
.popup { width: 100%; flex: none;
         background: var(--bg-surface); border-radius: var(--r-lg);
         box-shadow: var(--shadow-xl); display: flex; flex-direction: column; overflow: hidden; }
.popup-head { display: flex; align-items: flex-start; gap: var(--s3);
              padding: var(--s4) var(--s4) var(--s3); }
.popup-head h3 { font-size: var(--fs-lg); }
.popup-body { flex: 1; min-height: 0; padding: 0 var(--s4); }
.popup-cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--s4); }
.pgroup + .pgroup { margin-top: var(--s4); }
.pgroup-label { font-size: 9px; font-weight: 700; text-transform: uppercase;
                letter-spacing: .06em; color: var(--ink-muted); margin-bottom: 6px; }
.vallist { font-size: var(--fs-xs); line-height: 1.7; color: var(--ink-2);
           background: var(--bg-sunken); border-radius: var(--r-sm); padding: var(--s2) var(--s3);
           max-height: 160px; overflow: auto; }
.pfield { margin-bottom: var(--s3); }
.pfield[hidden] { display: none; }
.pfield label { display: block; font-size: 10px; color: var(--ink-muted); margin-bottom: 3px; }
.pfield input, .pfield textarea, .pfield select {
  width: 100%; font: inherit; font-size: var(--fs-sm); color: var(--ink);
  background: var(--bg-surface); border: 1px solid var(--border);
  border-radius: 9px; padding: 7px 9px;
}
.pfield textarea { min-height: 84px; resize: vertical; }
.capture-box { aspect-ratio: 1; position: relative; overflow: hidden; border-radius: var(--r);
               background-color: #fff;
               background-image: linear-gradient(45deg,#e9eceb 25%,transparent 25%),
                 linear-gradient(-45deg,#e9eceb 25%,transparent 25%),
                 linear-gradient(45deg,transparent 75%,#e9eceb 75%),
                 linear-gradient(-45deg,transparent 75%,#e9eceb 75%);
               background-size: 20px 20px; background-position: 0 0,0 10px,10px -10px,-10px 0; }
.capture-box canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; }
.capture-box img { position: relative; display: block; width: 100%; height: 100%; object-fit: contain; }
.capture-box img:not([src]) { visibility: hidden; }
.capture-box [role=status] { position: absolute; inset: auto 8px 8px; padding: 6px;
  background: rgba(255,255,255,.9); color: #273142; border-radius: 5px; font-size: 11px; text-align: center; }
.capture-box [role=status][hidden] { display: none; }
.capture-hips-option { display: flex; align-items: center; justify-content: center; gap: 7px;
  width: 100%; margin-top: 10px;
  font-size: var(--fs-xs); color: var(--ink-2); cursor: pointer; }
.capture-hips-option input { appearance: none; width: 15px; height: 15px; flex: none;
  margin: 0; border: 1.5px solid var(--primary); border-radius: 4px;
  background: var(--primary-soft); display: grid; place-items: center; cursor: pointer; }
.capture-hips-option input:checked { background: var(--primary); }
.capture-hips-option input:checked::after { content: ''; width: 4px; height: 8px;
  border: solid var(--bg-surface); border-width: 0 2px 2px 0;
  transform: translateY(-1px) rotate(45deg); }
.capture-hips-option input:focus-visible { outline: 2px solid var(--primary);
  outline-offset: 2px; }
.popup-preview-head { padding-bottom: 0; }
.popup-preview-head h3 { font-size: var(--fs-sm); }
.report-preview { background: var(--bg-surface); padding: 0 0 var(--s3); }
.report-preview .rsub-head { margin-top: var(--s2); }
.report-preview .rsec-chart-wrap { min-height: 140px; }
@media (max-width: 720px) { .popup-cols { grid-template-columns: 1fr; }
  .capture-box { width: min(100%, 340px); } }
.camrow { display: flex; gap: 6px; margin-top: var(--s2); }
.cambtn { flex: 1; border: 1px solid var(--border); background: var(--bg-surface);
          border-radius: 9px; padding: 7px 4px; font: inherit; font-size: 10px;
          color: var(--ink-2); cursor: pointer; }
.cambtn[aria-pressed="true"] { border-color: var(--primary); color: var(--primary-hi);
                               background: var(--primary-soft); font-weight: 600; }
.popup-foot { display: flex; align-items: center; gap: var(--s2);
              padding: var(--s3) var(--s4) var(--s4); }
.popup-foot .spacer { flex: 1; }

/* ── contrôle du temps, en bas, comme dans le logiciel ──────────── */
.timebar { flex: none; margin: 0 var(--s3) calc(var(--s3) * .25); padding-inline: 5px;
           border-radius: var(--r-lg); background: transparent; box-shadow: none;
           display: flex; flex-direction: column; overflow: hidden; }
.time-row { display: flex; align-items: center; gap: var(--s2);
            padding: 0 var(--s3); }
/* Le transport est CENTRÉ : c'est le geste principal de cette barre, et il se
   trouve là où l'oeil revient, sous la scène. Les compteurs tiennent les bords,
   chacun de son côté, sans le déplacer. */
.time-row .side { flex: 1; min-width: 0; display: flex; align-items: center; gap: var(--s2); }
.time-row .side--right { justify-content: flex-end; }
.time-row .ctr { display: flex; align-items: center; gap: var(--s2); flex: none; }
.time-row .t { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--ink); }
.time-row .f { font-family: var(--font-mono); font-size: 10px; color: var(--ink-muted); }
.time-row .spacer { flex: 1; }
.tbtn {
  width: 28px; height: 28px; border: none; border-radius: 8px; cursor: pointer;
  background: var(--bg-sunken); color: var(--ink-2); font-size: 13px;
  display: inline-flex; align-items: center; justify-content: center; flex: none;
}
.tbtn:hover { background: var(--bg-hover); color: var(--ink); }
.tbtn[aria-pressed="true"] { background: var(--primary-soft); color: var(--primary-hi); }
.track { position: relative; height: 46px; cursor: pointer; touch-action: none; }
.track svg { width: 100%; height: 100%; display: block; }

/* ── adaptation à l'écran (analysis-responsive.js) ───────────────────
   Tablette : mêmes proportions, une seule colonne à droite (B ou C). Les poignées masquées sortent du placement de la
   grille : on ne compte donc que les enfants restants. */
.side-switch { display: inline-flex; gap: 4px; }
.side-switch[hidden], .phone-bar[hidden], .phone-popup[hidden] { display: none; }
.side-switch .strip-btn[aria-pressed="true"] { background: var(--primary-soft); color: var(--primary-hi); }
.layout-tablet #splitInner { grid-template-columns: 1fr 330px !important; }
.layout-tablet #handleInner { display: none !important; }
.layout-tablet #splitSide { grid-template-columns: 1fr !important; }
.layout-tablet #handleSide { display: none !important; }
.layout-tablet #splitSide.side-b > #splitRight, .layout-tablet #splitSide.side-c > #rightCol { display: none !important; }
/* Téléphone : la scène 3D et les courbes dessous ; les fenêtres s'ouvrent en fenêtre flottante depuis la barre du haut. */
.layout-phone #splitOuter, .layout-phone #splitInner { grid-template-columns: 1fr !important; }
.layout-phone #splitLeft, .layout-phone #handleOuter, .layout-phone #handleInner, .layout-phone #splitSide { display: none !important; }
.layout-phone .strip > span, .layout-phone #projectBrowserBtn .strip-label { display: none; }
.layout-phone .wk { padding: 0 var(--s2) var(--s2); }
.layout-phone .wsp { padding-left: 0; }
.layout-phone .edge-rail { top: 3px; left: 3px; z-index: 5; }
.layout-phone .strip { padding-left: 40px; overflow-x: auto; }
.layout-phone .strip-closed-label, .layout-phone .strip-divider { display: none; }
.layout-phone .workspace-switch-btn { padding: 0 7px; }
.phone-bar { flex: none; display: flex; gap: 4px; padding: 2px var(--s2) 6px; overflow-x: auto; scrollbar-width: none; }
.phone-bar::-webkit-scrollbar { display: none; }
.phone-bar .strip-btn[aria-pressed="true"] { background: var(--primary-soft); color: var(--primary-hi); }
.phone-popup { position: absolute; inset: 0; top: 96px; z-index: 60; display: flex; align-items: flex-start; justify-content: center;
  padding: var(--s2) var(--s3) var(--s3); background: rgba(21,30,45,.34); }
.phone-popup-card { width: min(100%, 520px); max-height: 100%; display: flex; flex-direction: column; min-height: 0; }
.phone-popup-card > .panel { max-height: 100%; box-shadow: var(--shadow-lg); background: var(--bg-surface); }
.phone-popup-card > .panel--bare { padding: var(--s3); border-radius: var(--r-lg); }

.plot-controls--main::-webkit-scrollbar { display: none; }
.postures-group { padding-top: 15px; }
.view-axes { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }

/* Décision 145 : quelle segmentation est affichée (une par utilisateur). */
.seg-owner { display: flex; flex-direction: column; gap: 4px; padding: 4px 10px 6px;
  border-bottom: 1px solid var(--line, rgba(0,0,0,.08)); font-size: var(--fs-xs); }
.seg-owner-row { display: flex; align-items: center; gap: 6px; }
.seg-owner-row > span:first-child { color: var(--ink-muted); }
/* Sélecteur discret : pas de cadre au repos, une fine bordure au survol, le même chevron que les autres listes. */
.seg-owner-row select { flex: 1; min-width: 0; height: 22px; padding: 0 22px 0 6px; font: inherit; color: var(--ink);
  border: 1px solid transparent; border-radius: 6px; background-color: transparent; cursor: pointer; appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--ink-muted) 50%), linear-gradient(135deg, var(--ink-muted) 50%, transparent 50%);
  background-position: calc(100% - 11px) 9px, calc(100% - 7px) 9px; background-size: 4px 4px; background-repeat: no-repeat; }
.seg-owner-row select:hover { border-color: var(--border); background-color: var(--bg-hover); }
.seg-owner-row select:focus-visible { outline: none; border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-soft); }
.seg-owner-row select option { color: var(--ink); background: var(--bg-surface); }
.seg-owner-ro { color: var(--ink-muted); font-style: italic; }
.seg-owner-conflict { color: var(--warn, #b26a00); }

/* Descripteurs : liste sous les intervalles, annotations sur la vue 3D. */
.desc-list { padding: 4px 8px 8px; border-top: 1px solid var(--line, rgba(0,0,0,.08)); }
.desc-row { display: flex; align-items: center; gap: 6px; width: 100%; padding: 3px 4px; border: 0;
  background: none; color: inherit; font: inherit; text-align: left; border-radius: 4px; cursor: pointer; }
.desc-row:hover { background: var(--hover, rgba(0,0,0,.04)); }
.desc-row[aria-selected="true"] { background: var(--selected, rgba(232,117,88,.14)); }
.desc-row[data-off="true"] { opacity: .55; }
.desc-row .sw { width: 9px; height: 9px; border-radius: 2px; flex: none; }
.desc-row .n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.desc-row .k, .desc-row .s { font-size: var(--fs-xs); color: var(--ink-muted); white-space: nowrap; }
.desc-props { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; margin: 2px 4px 6px 19px;
  font-size: var(--fs-xs); }
.desc-props dt { color: var(--ink-muted); }
.desc-props dd { margin: 0; overflow-wrap: anywhere; }
.view-desc-labels { position: absolute; inset: 0; z-index: 3; pointer-events: none; overflow: hidden; }
.view-desc-label { position: absolute; transform: translate(0, -50%); pointer-events: auto; display: flex;
  flex-direction: column; align-items: flex-start; gap: 0; padding: 2px 6px; border: 0;
  border-left: 2px solid var(--desc-color, #888); border-radius: 3px; background: rgba(20,22,26,.72);
  color: #fff; font: 11px/1.25 sans-serif; text-align: left; cursor: pointer; max-width: 220px; }
.view-desc-label .v { font-size: 13px; font-weight: 600; }
.view-desc-label .v:empty, .view-desc-label .x:empty { display: none; }
.view-desc-label .x { opacity: .85; white-space: normal; }
.tree-color-row{display:flex;align-items:center;gap:6px;padding-right:8px}
.tree-color-row>.tree-row{flex:1;min-width:0}
.root-color-dot{width:20px;height:20px;flex:none;padding:0;border:1px solid var(--border);border-radius:50%;overflow:hidden;background:transparent;cursor:pointer}
.root-color-dot::-webkit-color-swatch-wrapper{padding:0}
.root-color-dot::-webkit-color-swatch{border:0;border-radius:50%}
.root-color-dot::-moz-color-swatch{border:0;border-radius:50%}
.tree-color-row>.root-color-dot{width:14px;height:14px}
.property-editor{display:flex;flex-direction:column;gap:5px;line-height:1.2;min-width:0;border:0;margin:0;padding:0}
.property-editor legend{font-weight:600;margin-bottom:10px}
.property-editor label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:var(--fs-sm);color:var(--ink-2)}
.property-editor label>input:not([type=checkbox]):not([type=color]),.property-editor select,.property-editor textarea{min-width:0;width:60%;font:inherit;color:var(--ink);background:var(--bg-sunken);border:1px solid var(--border);border-radius:6px;padding:2px 6px}
.property-editor select[multiple]{min-height:65px}
.property-editor textarea{resize:vertical;min-height:48px}
.property-editor select:not([multiple]){height:22px;padding-top:0;padding-bottom:0}
.property-editor .span-row{display:flex;align-items:center;gap:6px;font-size:var(--fs-sm);color:var(--ink-2)}
.property-editor .vec-row .span-name{flex:0 0 110px;margin-right:0}
.property-editor .vec-row .frame-field{flex:1;width:auto;min-width:0}
.property-editor .span-name{flex:none;margin-right:auto}
.fps-overlay{position:absolute;right:8px;bottom:8px;z-index:6;padding:6px 8px;border-radius:6px;pointer-events:none;
  background:color-mix(in srgb,var(--bg-surface) 78%,transparent);color:var(--ink);font:11px/1.4 var(--font-mono);white-space:pre}
.fps-overlay[hidden]{display:none}
.frame-field{display:flex;align-items:center;width:84px;flex:none;background:var(--bg-sunken);border:1px solid var(--border);border-radius:6px}
.frame-field:focus-within{border-color:var(--primary)}
.frame-field .ff-tag{flex:none;padding:0 2px 0 6px;font-size:11px;color:var(--ink-muted);opacity:.8;cursor:ew-resize;user-select:none;touch-action:none}
.frame-field input{flex:1;min-width:0;width:100%;padding:2px 6px 2px 2px;border:0;background:transparent;color:var(--ink);font-family:var(--font-mono);font-size:var(--fs-sm);text-align:right}
.frame-field input:focus{outline:none}
.property-editor .hint{font-size:var(--fs-xs);color:var(--ink-muted);margin:0}
.descriptor-tools{position:absolute;left:10px;top:50%;display:flex;flex-direction:column;gap:5px;transform:translateY(-50%);z-index:8}
.descriptor-tools .btn{min-width:32px;min-height:32px;background:var(--bg-surface);color:var(--ink)}
.view-desc-label.is-dimmed { opacity: .35; }
.view-desc-label[aria-selected="true"] { outline: 1px solid var(--desc-color, #fff); }
/* Clés de template sur les intervalles (lot T4). */
.seg-row .seg-key { flex: none; max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 0 6px; border-radius: 8px; background: var(--primary-soft); color: var(--primary-hi);
  font-size: var(--fs-xs); font-family: var(--font-mono, monospace); }
.template-key-dialog { max-width: min(420px, calc(100vw - 32px)); padding: 20px; border: 1px solid var(--border);
  border-radius: var(--r-lg); background: var(--bg-surface); color: var(--ink); box-shadow: var(--shadow-lg); }
.template-key-dialog::backdrop { background: rgba(12,20,30,.55); }
.template-key-dialog h3 { margin: 0 0 8px; font-size: var(--fs-lg); }
.template-key-dialog p { margin: 0 0 12px; color: var(--ink-2); font-size: var(--fs-sm); line-height: 1.45; }
.template-key-dialog label { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px;
  font-size: var(--fs-sm); color: var(--ink-2); }
.template-key-dialog input { padding: 6px 8px; border: 1px solid var(--border); border-radius: var(--r-field);
  background: var(--bg-surface); color: var(--ink); font: inherit; }
.template-key-dialog input:invalid { border-color: var(--danger, #d64b4b); }
.template-key-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.template-key-actions .danger { margin-right: auto; color: var(--danger, #d64b4b); }
/* Panneau « Templates » (7). */
#p-tpl { min-height: 0; display: flex; flex-direction: column; }
/* Statistiques remplit la première colonne de droite, sous Propriétés. */
#rightCol > #p-stats { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
#rightCol > #p-stats > .panel-body { flex: 1; min-height: 0; overflow-y: auto; }
.rula-note { margin: 0 0 8px; font-size: var(--fs-xs); line-height: 1.4; color: var(--ink-2); }
.rula-measure { padding: 8px 0; border-top: 1px solid var(--border-soft); }
.rula-measure-head { display: flex; align-items: flex-start; gap: 8px; font-size: var(--fs-sm); }
.rula-measure-head strong { flex: 1; }
.rula-measure-head button { border: 0; background: transparent; color: var(--ink-muted);
  cursor: pointer; font: inherit; font-size: 18px; line-height: 1; }
.rula-measure-value { margin: 4px 0; color: var(--primary-hi); font-size: 17px; font-weight: 700;
  font-variant-numeric: tabular-nums; }
.rula-measure-meta, .rula-measure-note { margin: 2px 0; color: var(--ink-muted); font-size: var(--fs-xs); }
.rula-context { margin-top: 8px; border-top: 1px solid var(--border-soft); padding-top: 8px;
  font-size: var(--fs-xs); }
.rula-context summary { cursor: pointer; color: var(--ink-2); font-weight: 600; }
.rula-context-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center;
  gap: 5px 8px; padding: 6px 0; border-bottom: 1px solid var(--border-soft); }
.rula-context-row small { flex: none; color: var(--ink-muted); }
.rula-context-row select { max-width: 125px; font: inherit; color: var(--ink); background: var(--bg-surface);
  border: 1px solid var(--border); border-radius: 5px; }
.rula-context-row input { grid-column: 1 / -1; min-width: 0; padding: 4px 6px; font: inherit;
  color: var(--ink); background: var(--bg-surface); border: 1px solid var(--border); border-radius: 5px; }
.rula-export { margin-bottom: 7px; padding: 5px 8px; font: inherit; font-size: var(--fs-xs);
  color: var(--primary-hi); background: var(--bg-surface); border: 1px solid var(--border); border-radius: 6px;
  cursor: pointer; }
.rula-draft-fields { display: grid; gap: 6px; margin-bottom: 7px; }
.rula-draft-fields label { display: grid; gap: 3px; color: var(--ink-2); font-size: var(--fs-xs); }
.rula-draft-fields input, .rula-draft-fields select { min-width: 0; width: 100%; padding: 5px 6px;
  font: inherit; color: var(--ink); background: var(--bg-surface); border: 1px solid var(--border);
  border-radius: 5px; }
.rula-draft-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.rula-draft-actions button { padding: 5px 7px; font: inherit; font-size: var(--fs-xs);
  color: var(--primary-hi); background: var(--bg-surface); border: 1px solid var(--border);
  border-radius: 6px; cursor: pointer; }
.rula-import { position: relative; overflow: hidden; display: inline-flex; align-items: center;
  padding: 5px 7px; font-size: var(--fs-xs); color: var(--primary-hi);
  background: var(--bg-surface); border: 1px solid var(--border); border-radius: 6px; cursor: pointer; }
.rula-import input { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; }
.rula-pinned-list { margin: 3px 0 8px; padding-left: 18px; color: var(--ink-2); font-size: var(--fs-xs); }
#plotRulaMeasure { max-width: 250px; }
#plotRulaHelp { cursor: help; }

/* Espaces thématiques : Navigation/Intervalles gardent la colonne de gauche. */
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #splitInner {
  grid-template-columns: minmax(240px, 25%) minmax(0, 1fr) !important;
  column-gap: var(--s3);
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #splitOuter {
  grid-template-columns: var(--split, 194px 6px 1fr) !important;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #splitLeft {
  display: grid !important; grid-template-rows: var(--split, 1fr 6px 200px) !important;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #handleOuter,
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #handleLeft {
  display: block !important;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #p-nav,
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #p-int {
  display: flex !important;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) .strip-closed-label,
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) .strip-divider--closed {
  display: none;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #handleInner,
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #handleCenter,
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #plotDeck,
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #handleSide,
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #rightCol,
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #splitRight { display: none !important; }
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) .side-switch { display: none !important; }
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #splitLeft [data-hide] {
  display: none;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #splitCenter {
  grid-template-rows: minmax(0, 1fr) !important;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]) #splitSide {
  display: block !important; min-width: 0; min-height: 0;
}
#wsp[data-workspace="rula"] #splitInner {
  grid-template-columns: var(--split, minmax(240px, 35%) 6px minmax(0, 1fr)) !important;
  column-gap: 0;
}
#wsp[data-workspace="rula"] #handleInner { display: block !important; }
.theme-workspace[hidden], #rulaWorkspace[hidden], .rula-workspace-form[hidden] { display: none !important; }
.theme-workspace { position: relative; display: flex; flex-direction: column; height: 100%;
  min-width: 0; min-height: 0; overflow: hidden; border: 1px solid var(--border);
  border-radius: var(--r-lg); background: var(--bg-surface); box-shadow: var(--shadow-sm); }
.theme-workspace-head { display: flex; align-items: center; justify-content: space-between;
  gap: var(--s3); min-height: 56px; padding: 8px 14px;
  border-bottom: 1px solid var(--border-soft); }
.theme-workspace-head h2 { margin: 0; font-size: 18px; line-height: 1.1; color: var(--ink); }
.theme-workspace-kicker { display: block; margin-bottom: 2px; color: var(--ink-muted);
  font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.theme-workspace-head-note { color: var(--ink-muted); font-size: var(--fs-xs); }
.theme-workspace-actions { display: flex; gap: 6px; }
.theme-workspace-actions button { padding: 5px 10px; border: 1px solid var(--border);
  border-radius: 7px; color: var(--ink-2); background: var(--bg-surface);
  font: inherit; font-size: var(--fs-xs); font-weight: 600; cursor: pointer; }
.theme-workspace-actions button:hover { background: var(--bg-hover); color: var(--ink); }
.theme-workspace-actions button[aria-pressed="true"],
.theme-workspace-actions button[aria-expanded="true"] { border-color: var(--primary);
  color: var(--primary-hi); background: var(--primary-soft); }
.rula-workspace { position: relative; height: 100%; }
.rula-workspace .panel-act--label { width: auto; padding: 0 8px; font-size: var(--fs-xs); }
.rula-workspace .panel-act--label[aria-pressed="true"],
.rula-workspace .panel-act--label[aria-expanded="true"] {
  color: var(--primary-hi); background: var(--primary-soft);
}
.theme-module-deck { display: grid; grid-template-rows: minmax(0, 1fr);
  gap: 10px; flex: 1; min-height: 0; padding: 10px; }
.theme-module-slot { min-height: 0; border: 1px dashed var(--border);
  border-radius: 8px; background: var(--bg-sunken); }
.theme-module-slot[hidden] { display: none !important; }
#rulaModuleDeck { grid-template-rows: minmax(0, 1fr); gap: 0;
  padding: 0 var(--s3) var(--s3); overflow: hidden; }
#rulaModuleDeck .theme-module-slot { display: flex; flex-direction: column; min-height: 0;
  overflow: hidden; border: 0; border-radius: 0; background: transparent; }
.rula-data { flex: 1; min-height: 0; max-height: 100%; overflow-y: auto;
  padding: 8px 2px 12px; }
.rula-workspace-form { position: absolute; z-index: 5; top: 36px; right: 10px;
  bottom: 10px; width: min(390px, calc(100% - 20px)); overflow-y: auto;
  padding: 14px; border: 1px solid var(--border); border-radius: 9px;
  background: var(--bg-surface); box-shadow: var(--shadow-lg); }
.rula-workspace-form-head { display: flex; align-items: center; justify-content: space-between;
  gap: 8px; margin-bottom: 12px; }
.rula-workspace-form-head h3 { margin: 0; font-size: var(--fs-sm); }
.rula-workspace-form-head button { border: 0; background: transparent; color: var(--ink-muted);
  font: inherit; font-size: 20px; cursor: pointer; }
.rula-workspace-form .rula-context { margin-top: 14px; }

/* RULA : lecture rapide de l'image courante, puis confirmation par région. */
#rulaData { container: rula-panel / inline-size; }
.rula-ui { --rula-low: #78b84a; --rula-mid: #cf8b0c; --rula-high: #cf3b34;
  --rula-angle-low: #47742d; --rula-angle-mid: #a86f08; --rula-angle-high: #ad2f29;
  --rula-on-low: #151e2d; --rula-on-mid: #151e2d; --rula-on-high: #fff;
  color: var(--ink); font-size: var(--fs-sm); }
:root[data-theme="dark"] .rula-ui { --rula-low: #96cc6a; --rula-mid: #e2a52e;
  --rula-high: #e8615a; --rula-angle-low: #96cc6a; --rula-angle-mid: #e2a52e;
  --rula-angle-high: #e8615a; --rula-on-high: #151e2d; }
.rula-ui * { box-sizing: border-box; }
.rula-ui button { cursor: pointer; font: inherit; }
.rula-ui-box { --rula-box: var(--bg-sunken); --rula-box-ink: var(--ink-2);
  display: inline-grid; place-items: center; min-width: 30px; min-height: 28px;
  padding: 3px 7px; border-radius: 5px; background: var(--rula-box);
  color: var(--rula-box-ink); font-weight: 700; font-variant-numeric: tabular-nums; }
.rula-ui-box[data-tone="low"], .rula-ui-dot[data-tone="low"] { --rula-box: var(--rula-low); --rula-box-ink: var(--rula-on-low); }
.rula-ui-box[data-tone="mid"], .rula-ui-dot[data-tone="mid"] { --rula-box: var(--rula-mid); --rula-box-ink: var(--rula-on-mid); }
.rula-ui-box[data-tone="high"], .rula-ui-dot[data-tone="high"] { --rula-box: var(--rula-high); --rula-box-ink: var(--rula-on-high); }
.rula-ui-summary { display: flex; align-items: center; gap: 10px; padding: 8px 10px;
  border-radius: 5px; background: var(--bg-sunken); }
.rula-ui-global { min-width: 40px; min-height: 38px; font-size: 23px; }
.rula-ui-summary-text { display: grid; gap: 2px; min-width: 0; }
.rula-ui-summary-text strong { font-size: var(--fs-md); }
.rula-ui-summary-text span { color: var(--ink-2); font-size: var(--fs-xs); }
.rula-ui-summary-meta { display: grid; justify-items: end; gap: 3px; margin-left: auto;
  color: var(--ink-2); font-size: var(--fs-xs); white-space: nowrap; }
.rula-ui-summary-meta label { display: flex; align-items: center; gap: 5px; }
.rula-ui-action { white-space: nowrap; font-weight: 600; font-size: var(--fs-xs); }
.rula-ui-time { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.rula-ui-summary-meta select, .rula-ui-form select { min-width: 0; padding: 4px 5px;
  border: 1px solid var(--border); border-radius: 5px; background: var(--bg-surface);
  color: var(--ink); font: inherit; }
.rula-ui-time label { white-space: nowrap; color: var(--ink-2); }
.rula-ui-time input { flex: 1; min-width: 0; accent-color: var(--primary); }
.rula-ui-time output { min-width: 44px; text-align: right; font-variant-numeric: tabular-nums; }
.rula-ui-overview { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 12px; }
.rula-ui-map { display: grid; justify-items: center; align-content: start; min-height: 286px;
  padding: 6px; border-radius: 5px; background: var(--bg-sunken); }
.rula-ui-view { color: var(--ink-2); font-size: var(--fs-xs); }
.rula-ui-stage { --rula-angle: var(--rula-angle-low); position: relative; width: 180px; height: 258px;
  overflow: hidden; }
.rula-ui-stage[data-tone="mid"] { --rula-angle: var(--rula-angle-mid); }
.rula-ui-stage[data-tone="high"] { --rula-angle: var(--rula-angle-high); }
.rula-ui-stage[data-tone="empty"] { --rula-angle: var(--ink-muted); }
.rula-ui-stage[data-tone="measure"] { --rula-angle: var(--primary-hi); }
.rula-ui-stage svg { width: 180px; height: 258px; overflow: visible; }
.rula-ui-stage svg [hidden] { display: none; }
.rula-ui-avatar { position: absolute; left: -39px; top: 0; width: 258px; height: 258px;
  object-fit: contain; pointer-events: none; }
.rula-ui-annotation { position: absolute; inset: 0; pointer-events: none; }
.rula-ui-avatar-status { position: absolute; top: 105px; left: 14px; width: 152px;
  text-align: center; color: var(--ink-muted); font-size: var(--fs-xs); }
.rula-ui-capture { position: fixed; left: -10000px; top: -10000px; opacity: 0;
  pointer-events: none; }
.rula-ui-axis { stroke: var(--ink-muted); stroke-width: 1.5; stroke-dasharray: 4 3; }
.rula-ui-arc { fill: none; stroke: var(--rula-angle); stroke-width: 3; stroke-linecap: round; }
.rula-ui-angle { fill: var(--rula-angle); font: 700 13px var(--font); }
.rula-ui-support { stroke: var(--rula-angle); stroke-width: 5; stroke-linecap: round; }
.rula-ui-dot { position: absolute; z-index: 1; width: 28px; height: 28px; padding: 0;
  border: 1px solid color-mix(in srgb, var(--rula-box) 75%, var(--ink));
  border-radius: 5px; background: color-mix(in srgb, var(--rula-box) 78%, transparent);
  color: var(--rula-box-ink); backdrop-filter: blur(2px);
  font-size: var(--fs-sm); box-shadow: var(--shadow-sm); }
.rula-ui-dot[aria-pressed="true"] { outline: 2px solid var(--rula-box); outline-offset: 3px; }
.rula-ui-stage[data-view="profile"] .rula-ui-dot[data-rula-ui-region="cou"] { left: 77px; top: 48px; }
.rula-ui-stage[data-view="profile"] .rula-ui-dot[data-rula-ui-region="bras"] { left: 102px; top: 83px; }
.rula-ui-stage[data-view="profile"] .rula-ui-dot[data-rula-ui-region="poignet"] { left: 113px; top: 143px; }
.rula-ui-stage[data-view="profile"] .rula-ui-dot[data-rula-ui-region="tronc"] { left: 70px; top: 116px; }
.rula-ui-stage[data-view="profile"] .rula-ui-dot[data-rula-ui-region="jambes"] { left: 75px; top: 190px; }
.rula-ui-stage[data-view="front"] .rula-ui-dot[data-rula-ui-region="cou"] { left: 77px; top: 48px; }
.rula-ui-stage[data-view="front"] .rula-ui-dot[data-rula-ui-region="bras"] { left: 45px; top: 84px; }
.rula-ui-stage[data-view="front"] .rula-ui-dot[data-rula-ui-region="poignet"] { left: 30px; top: 144px; }
.rula-ui-stage[data-view="front"] .rula-ui-dot[data-rula-ui-region="tronc"] { left: 77px; top: 117px; }
.rula-ui-stage[data-view="front"] .rula-ui-dot[data-rula-ui-region="jambes"] { left: 68px; top: 190px; }
.rula-ui-list-head, .rula-ui-row { display: grid; grid-template-columns: minmax(0,1fr) 70px 52px;
  gap: 8px; align-items: center; }
.rula-ui-list-head { padding: 0 8px 5px; color: var(--ink-muted); font-size: var(--fs-xs); }
.rula-ui-list-head span:nth-child(n+2) { text-align: right; }
.rula-ui-row { width: 100%; min-height: 52px; padding: 6px 8px; border: 0;
  border-bottom: 1px solid var(--border-soft); background: transparent; color: var(--ink); text-align: left; }
.rula-ui-row[aria-pressed="true"] { background: var(--bg-active); }
.rula-ui-row > span:first-child { display: grid; gap: 2px; min-width: 0; }
.rula-ui-row strong { font-size: var(--fs-sm); }
.rula-ui-row small { overflow: hidden; color: var(--ink-muted); font-size: var(--fs-xs);
  text-overflow: ellipsis; white-space: nowrap; }
.rula-ui-row > span:nth-child(2) { text-align: right; font-variant-numeric: tabular-nums; }
.rula-ui-row .rula-ui-box { justify-self: end; min-width: 42px; font-size: var(--fs-xs); white-space: nowrap; }
.rula-ui-legend { display: flex; align-items: center; justify-content: flex-end;
  gap: 5px; flex-wrap: wrap; text-align: right;
  margin: 10px 0 12px; color: var(--ink-2); font-size: var(--fs-xs); }
.rula-ui-legend i { width: 13px; height: 13px; margin-left: 4px; border-radius: 3px; background: var(--rula-low); }
.rula-ui-legend i[data-tone="mid"] { background: var(--rula-mid); }
.rula-ui-legend i[data-tone="high"] { background: var(--rula-high); }
.rula-ui-detail { padding: 10px; border: 1px solid var(--border-soft);
  border-radius: 5px; background-color: #42495780; color: #f5f7f8; }
:root:not([data-theme="dark"]) .rula-ui-detail { background-color: #474747; }
.rula-ui-detail[hidden] { display: none; }
.rula-ui-detail-head { display: flex; align-items: center; gap: 9px; }
.rula-ui-detail-head h3 { margin: 0; font-size: var(--fs-md); }
.rula-ui-detail-head span { margin-left: auto; color: #e0e5e8; font-size: var(--fs-xs); }
.rula-ui-detail-head button { width: 26px; height: 26px; border: 0; background: transparent; color: #e0e5e8; }
.rula-ui-modes { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0; }
.rula-ui-modes button, .rula-ui-tools button, .rula-ui-tools label { padding: 5px 8px;
  border: 1px solid var(--border); border-radius: 5px; background: var(--bg-surface); color: var(--ink-2); }
.rula-ui-modes button[aria-pressed="true"] { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-hi); }
.rula-ui-detail-grid { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 16px; }
.rula-ui-metric { --rula-metric: var(--ink-2); display: grid; align-content: start; gap: 5px; min-width: 0; }
.rula-ui-metric[data-tone="low"] { --rula-metric: var(--rula-angle-low); }
.rula-ui-metric[data-tone="mid"] { --rula-metric: var(--rula-angle-mid); }
.rula-ui-metric[data-tone="high"] { --rula-metric: var(--rula-angle-high); }
.rula-ui-metric[data-tone="measure"] { --rula-metric: var(--primary-hi); }
.rula-ui-metric strong { color: var(--rula-metric); font-size: 25px; font-variant-numeric: tabular-nums; }
.rula-ui-metric span { line-height: 1.45; }
.rula-ui-metric p { margin: 2px 0; color: #e0e5e8; font-size: var(--fs-xs); }
.rula-ui-form { display: grid; align-content: start; gap: 7px; }
.rula-ui-form h4 { margin: 0; font-size: var(--fs-sm); }
.rula-ui-form label { display: grid; grid-template-columns: minmax(0,1fr) 140px;
  align-items: center; gap: 8px; margin: 5px 0; font-size: var(--fs-xs); }
.rula-ui-form label span { line-height: 1.25; }
.rula-ui-form select { width: 100%; font-size: var(--fs-xs); }
.rula-ui-tools { display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border-soft); }
.rula-ui-tools label { position: relative; overflow: hidden; cursor: pointer; }
.rula-ui-tools input { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; }
.rula-ui-tools span { color: var(--ink-muted); font-size: var(--fs-xs); }
.rula-ui-disclaimer { color: var(--ink-muted); font-size: var(--fs-xs); line-height: 1.4; }
@container rula-panel (max-width: 480px) {
  .rula-ui-overview { grid-template-columns: 1fr; }
  .rula-ui-detail-grid { grid-template-columns: 1fr; }
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]).layout-phone #splitInner {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(210px, 38%) minmax(0, 1fr) !important;
  row-gap: var(--s2);
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]).layout-phone #splitOuter {
  grid-template-columns: minmax(0, 1fr) !important;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]).layout-phone #splitLeft,
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]).layout-phone #handleOuter {
  display: none !important;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]).layout-phone #splitSide {
  display: block !important;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]).layout-phone .phone-bar {
  display: none !important;
}
#wsp:is([data-workspace="aqm"], [data-workspace="rula"]).layout-phone #splitCenter {
  min-height: 210px;
}
#wsp[data-workspace="rula"].layout-phone #handleInner { display: none !important; }
#p-tpl .panel-body { overflow-y: auto; padding: 0 var(--s3) var(--s3); font-size: var(--fs-sm); }
#p-tpl.is-flash, #p-meas.is-flash { outline: 2px solid var(--primary); outline-offset: -2px; }
.tp-choose { display: flex; flex-direction: column; gap: 4px; margin: var(--s2) 0; color: var(--ink-2); font-size: var(--fs-xs); }
.tp-choose select, .tp-choose input { padding: 5px 8px; border: 1px solid var(--border); border-radius: var(--r-field);
  background: var(--bg-surface); color: var(--ink); font: inherit; font-size: var(--fs-sm); }
.tp-lbl { margin: var(--s2) 0 4px; color: var(--ink-muted); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .07em; }
.tp-block { display: flex; gap: 8px; padding: 3px 0; border-bottom: 1px solid var(--border-soft); }
.tp-block .st { width: 14px; color: var(--primary-hi); }
.tp-block.blocked .st { color: var(--danger, #d64b4b); }
.tp-block .n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tp-block .meta, .tp-group .meta { color: var(--ink-muted); font-size: var(--fs-xs); }
.tp-key { padding: 4px 0; }
.tp-help { display: flex; flex-direction: column; gap: 4px; margin-top: 4px; padding: 6px 8px; border-left: 2px solid var(--primary);
  background: var(--primary-soft); color: var(--ink-2); font-size: var(--fs-xs); line-height: 1.4; }
.tp-help .btn { align-self: flex-start; }
.tp-group { display: flex; align-items: center; gap: 6px; }
.tp-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: var(--s2); }
.tp-measure { padding: 4px 0; border-bottom: 1px solid var(--border-soft); }
.tp-stat { padding-left: 10px; color: var(--ink-2); font-size: var(--fs-xs); }
.tp-status { margin: var(--s2) 0 0; color: var(--ink-2); font-size: var(--fs-xs); }

/* Proposition d'intervalles détectés (lot D3). */
.tp-member { padding: 4px 0; border-bottom: 1px solid var(--border-soft); }
.tp-inline { flex-direction: row; align-items: center; gap: 6px; margin: 4px 0; }
.tp-inline input { width: 80px; }
.tp-chips { display: flex; flex-wrap: wrap; gap: 3px; margin: 3px 0; }
.tp-chip { display: inline-flex; border: 1px solid var(--border); border-radius: var(--r-field); overflow: hidden; font-size: var(--fs-xs); }
.tp-chip button { padding: 1px 5px; border: 0; background: var(--bg-surface); color: var(--ink); font: inherit; cursor: pointer; }
.tp-chip button + button { border-left: 1px solid var(--border); color: var(--ink-muted); }
.tp-chip.is-out button:first-child { text-decoration: line-through; color: var(--ink-muted); }

/* Détection au départ et diagnostics (lot D4). */
.tp-auto { margin: 0 0 var(--s2); color: var(--ink-2); font-size: var(--fs-xs); }
.tp-diag { color: var(--warn, #b7791f); }
.tp-link { padding: 0; border: 0; background: none; color: var(--primary); font: inherit; text-decoration: underline; cursor: pointer; }

.prop-row input.prop-text { flex: 1; min-width: 0; height: 22px; padding: 2px 6px; border: 1px solid var(--border);
  border-radius: 6px; background: var(--bg-surface); color: var(--ink); font: inherit; font-size: var(--fs-xs); }
.plot-trajectory { position: absolute; inset: 0; }

/* Statistics by original interval: header and cells share the five columns. */
#p-stats { --stat-gap: 3px; --stat-grid: minmax(0,38fr) repeat(5,minmax(0,07.4fr)); }
#p-stats > .panel-head { display: grid; grid-template-columns: var(--stat-grid); gap: var(--stat-gap);
  padding-inline: 12px; scrollbar-gutter: stable; scrollbar-width: thin; overflow-y: hidden; }
#stats { scrollbar-gutter: stable; }
.statistic-heading { display: flex; align-items: center; gap: 3px; min-width: 0; }
#p-stats .statistic-heading .panel-badge { width: 14px; min-width: 14px; height: 16px; font-size: 8px; }
#p-stats .statistic-heading .panel-title { font-size: 10px; min-width: 0; }
#p-stats .statistic-heading .panel-act { padding: 0; width: 12px; flex: none; }
.statistic-columns { display: contents; text-align: center; }
.statistic-columns[hidden] { display: none; }
.statistic-columns span { font-family: var(--font-mono); font-size: 12px; color: var(--ink); cursor: help; }
.stat-table-row { display: grid; grid-template-columns: var(--stat-grid);
  gap: var(--stat-gap); align-items: center; margin: 5px 0; }
.stat-row-label { font-size: 10px; line-height: 1.3; min-width: 0; overflow-wrap: anywhere; }
.stat-row-label small { display: block; font-size: 8px; color: var(--ink-muted); }
.stat-cell { display: block; min-width: 0; width: 100%; min-height: 30px; padding: 4px 0;
  border: 1px solid var(--border); border-radius: 7px; background: transparent;
  color: var(--ink); font: 9.5px var(--font-mono); overflow-wrap: anywhere; cursor: pointer; }
.stat-cell:hover { border-color: var(--ink-2); }
.stat-cell.is-picked { border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); background: transparent; }
.stat-cell:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.stat-cell:disabled { cursor: default; opacity: .55; }
button.stat-row { appearance: none; border: 0; background: transparent;
  width: 100%; color: inherit; font-family: inherit; font-size: var(--fs-xs); text-align: left; }
button.stat-row:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }