/* Studio 3D v2, parcours guidé (docs/chantiers/studio3d-refonte-ihm).
   Chargée seulement quand `studio_v2` est vrai, APRÈS floorplan_3d.css.
   Couleurs via les tokens du site (tokens.css), jamais de valeur en dur
   hors repli. Maquettes de référence : docs/chantiers/studio3d-refonte-ihm/maquettes/. */

/* ---------- Lot 0 : couleurs du site à la place du rose ---------- */
body.fp3d-v2-body {
  --fp3d-accent: var(--vefa-primary, #3498db);
  --fp3d-accent-dark: var(--vefa-primary-darker, #1f6396);
  --fp3d-accent-soft: var(--vefa-primary-soft, rgba(52, 152, 219, 0.08));
  --fp3d-accent-rgb: var(--vefa-primary-rgb, 52, 152, 219);
  --fp3d-hero-top: var(--vefa-primary-surface, #eff6ff);
  --fp3d-hero-mid: var(--vefa-bg-soft, #f8fafc);
  --fp3d-iso-roof: var(--vefa-primary-tint, #eaf4fb);
  --fp3d-iso-wall-l: var(--vefa-primary-border, #b8d6ea);
  --fp3d-iso-wall-r: var(--vefa-primary, #3498db);
  /* Lu par floorplan_studio.js (surbrillance de sélection three.js). */
  --fp3d-select-3d: var(--vefa-primary, #3498db);

  --fp3d-v2-serif: Charter, "Bitstream Charter", "PT Serif", Georgia, serif;
  --fp3d-v2-float-shadow: var(--vefa-shadow-lg);
}

/* ---------- Lot 0 : mode concentré ---------- */
/* La barre basse mobile des connectés et la mention Bêta n'ont pas leur place
   dans un outil plein écran. */
body.fp3d-v2-focus .mobile_bottom_nav { display: none !important; }
body.fp3d-v2-body .fp3d-beta-pill { display: none; }

/* ---------- Lot 1 : page plein cadre et barre du haut ---------- */
body.fp3d-v2-focus { background: var(--vefa-bg-muted, #f1f5f9); }
body.fp3d-v2-focus main.content { padding: 0; margin: 0; }
.fp3d-v2.fp3d-studio-page {
  max-width: none;
  padding: 0;
}
.fp3d-v2 .fp3d-studio-topbar {
  position: relative;
  flex-wrap: nowrap;
  justify-content: flex-start;
  min-height: 64px;
  padding: 0 16px 0 20px;
  gap: 14px;
  background: var(--vefa-bg, #ffffff);
  border-bottom: 1px solid var(--vefa-border, #e2e8f0);
}
.fp3d-v2 .fp3d-topbar__ctx {
  display: grid;
  grid-template-columns: auto auto minmax(0, auto) auto;
  grid-template-rows: auto auto;
  column-gap: 14px;
  row-gap: 1px;
  align-items: center;
  flex-wrap: nowrap;
}
.fp3d-v2-brand {
  grid-row: 1 / 3;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 650;
  font-size: 15px;
  color: var(--vefa-text, #0f172a);
  white-space: nowrap;
}
.fp3d-v2-brand img { width: 30px; height: auto; display: block; }
.fp3d-v2-sep {
  grid-row: 1 / 3;
  width: 1px;
  height: 24px;
  background: var(--vefa-border, #e2e8f0);
}
.fp3d-v2 .fp3d-studio-crumb__trail { grid-column: 3; grid-row: 1; font-size: 14px; }
.fp3d-v2 .fp3d-studio-crumb__trail > a,
.fp3d-v2 .fp3d-studio-crumb__trail .fp3d-studio-crumb__sep { display: none; }
.fp3d-v2 .fp3d-studio-crumb__name { font-weight: 600; color: var(--vefa-text, #0f172a); max-width: 140px; }
.fp3d-v2 .fp3d-plan-status-chip {
  grid-column: 3;
  grid-row: 2;
  justify-self: start;
  padding: 0;
  border: 0;
  background: none;
  font-size: 12px;
  font-weight: 500;
  color: var(--vefa-text-muted, #475569);
}
.fp3d-v2 .fp3d-plan-status-chip.is-saved { background: none; color: var(--vefa-text-muted, #475569); }
.fp3d-v2 .fp3d-plan-status-chip i { display: none; }
.fp3d-v2 .fp3d-plan-status-chip::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--vefa-text-subtle, #94a3b8);
}
.fp3d-v2 .fp3d-plan-status-chip.is-saved::before { background: var(--vefa-success, #16a34a); }
.fp3d-v2 #fp3d-levels-bar { grid-column: 4; grid-row: 1 / 3; }

/* Fil d'étapes, centré sur la barre. */
.fp3d-v2-stepper {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  justify-content: center;
  container-type: inline-size;
  container-name: fp3d-steps;
}
.fp3d-v2-stepper__list {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.fp3d-v2-stepper__item { display: flex; align-items: center; gap: 6px; }
.fp3d-v2-stepper__item + .fp3d-v2-stepper__item::before {
  content: "";
  width: 20px;
  height: 2px;
  border-radius: 2px;
  background: var(--vefa-border, #e2e8f0);
}
/* Connecteur bleu après une étape faite. */
.fp3d-v2-stepper__item:has(.fp3d-v2-step.is-done) + .fp3d-v2-stepper__item::before { background: var(--vefa-primary, #3498db); }
.fp3d-v2-step {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px 6px 6px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  color: var(--vefa-text-muted, #475569);
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 150ms var(--vefa-ease, ease), color 150ms var(--vefa-ease, ease);
}
.fp3d-v2-step:hover:not(:disabled):not(.is-current) { background: var(--vefa-bg-muted, #f1f5f9); }
.fp3d-v2-step:disabled { cursor: default; }
.fp3d-v2-step__num {
  width: 24px;
  height: 24px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1.5px solid var(--vefa-border-strong, #cbd5e1);
  background: var(--vefa-bg, #ffffff);
  font-size: 12px;
  font-weight: 650;
}
.fp3d-v2-step__check { display: none; font-size: 11px; }
.fp3d-v2-step.is-done { color: var(--vefa-text, #0f172a); }
.fp3d-v2-step.is-done .fp3d-v2-step__num {
  background: var(--vefa-primary, #3498db);
  border-color: var(--vefa-primary, #3498db);
  color: var(--vefa-text-on-primary, #ffffff);
}
.fp3d-v2-step.is-done .fp3d-v2-step__check { display: inline; }
.fp3d-v2-step.is-done .fp3d-v2-step__digit { display: none; }
.fp3d-v2-step.is-current {
  background: var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16));
  color: var(--vefa-primary-darker, #1f6396);
  font-weight: 650;
}
.fp3d-v2-step.is-current .fp3d-v2-step__num {
  border-color: var(--vefa-primary, #3498db);
  color: var(--vefa-primary-darker, #1f6396);
  box-shadow: 0 0 0 3px var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16));
}
.fp3d-v2-step:focus-visible { outline: 2px solid var(--vefa-primary, #3498db); outline-offset: 2px; }

/* Actions à droite : Variante, Actions, Détails, Enregistrer, Aide, Quitter. */
.fp3d-v2 .fp3d-topbar__actions { flex-wrap: nowrap; gap: 6px; margin-left: 0; flex: none; }
.fp3d-v2 .fp3d-topbar__ctx { flex: none; }
.fp3d-v2 .fp3d-variant__btn {
  border-radius: 10px;
  border-color: transparent;
  background: transparent;
  font-weight: 600;
  color: var(--vefa-text-muted, #475569);
  min-height: 36px;
}
.fp3d-v2 .fp3d-variant__btn:hover { background: var(--vefa-bg-muted, #f1f5f9); border-color: transparent; color: var(--vefa-text, #0f172a); }
.fp3d-v2-iconbtn {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--vefa-text-muted, #475569);
  font-size: 18px;
  cursor: pointer;
}
.fp3d-v2-iconbtn:hover,
.fp3d-v2-iconbtn[aria-pressed="true"] { background: var(--vefa-bg-muted, #f1f5f9); color: var(--vefa-text, #0f172a); }
.fp3d-v2 .fp3d-v2-quit {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 14px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 10px;
  background: var(--vefa-bg, #ffffff);
  color: var(--vefa-text, #0f172a);
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  white-space: nowrap;
}
.fp3d-v2 .fp3d-v2-quit:hover { border-color: var(--vefa-border-strong, #cbd5e1); color: var(--vefa-text, #0f172a); }
.fp3d-v2 #fp3d-save-submit { border-radius: 10px; }

/* L'aide 2D (barre sombre) ne s'affiche que sur demande, via « Aide ». */
.fp3d-v2 #fp3d-help-2d:not(.is-v2-open) { display: none !important; }

/* Libellés des étapes repliés quand la place manque, sauf l'étape courante. */
/* Seuil = largeur mesurée des cinq libellés (recette 2026-10-06 : le fil
   repliait à 1440 px pour 3 px). */
@container fp3d-steps (max-width: 612px) {
  .fp3d-v2-step.is-done .fp3d-v2-step__label { display: none; }
  .fp3d-v2-step.is-done { padding: 5px; }
  .fp3d-v2-stepper__item + .fp3d-v2-stepper__item::before { width: 14px; }
}
@container fp3d-steps (max-width: 540px) {
  .fp3d-v2-step:not(.is-current) .fp3d-v2-step__label { display: none; }
  .fp3d-v2-step:not(.is-current) { padding: 5px; }
}
@container fp3d-steps (max-width: 360px) {
  .fp3d-v2-stepper__item + .fp3d-v2-stepper__item::before { width: 8px; }
}

/* Barre de droite allégée : Actions et Détails en icône, « Enregistrer »
   en libellé seulement tant que le plan est un brouillon (ensuite l'autosave
   suffit, le bouton reste pour « mettre à jour » nom et vignette). */
.fp3d-v2 .fp3d-topbar__actions .fp3d-share-label { display: none; }
.fp3d-v2 #fp3d-actions-btn,
.fp3d-v2 #fp3d-details-btn { width: 36px; padding: 0; justify-content: center; }
.fp3d-v2 #fp3d-save-submit {
  min-height: 36px;
  padding: 0 14px;
  border-radius: 10px;
  font-size: 14px;
  white-space: nowrap;
}
.fp3d-v2 .fp3d-topbar__ctx:has(.fp3d-plan-status-chip.is-saved) ~ .fp3d-topbar__actions #fp3d-save-submit {
  width: 36px;
  padding: 0;
  font-size: 0;
  justify-content: center;
}
.fp3d-v2 .fp3d-topbar__ctx:has(.fp3d-plan-status-chip.is-saved) ~ .fp3d-topbar__actions #fp3d-save-submit i { font-size: 15px; margin: 0; }

/* ---------- Lot 2 : corps du studio (plan + panneau de 384 px) ---------- */
.fp3d-v2 .fp3d-studio-body {
  grid-template-columns: minmax(0, 1fr) 384px;
  gap: 0;
  background: var(--vefa-bg, #ffffff);
}
.fp3d-v2 .fp3d-studio-viewport {
  border-radius: 0;
  box-shadow: none;
  background: var(--vefa-bg-muted, #f1f5f9);
}
.fp3d-v2 .fp3d-studio-panel {
  border: 0;
  border-left: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.fp3d-v2 .fp3d-viewer-disclaimer { margin: 0; padding: 6px 20px; font-size: 12px; }

/* Plan 2D : fond pointillé, couleurs des éléments de la maquette. */
.fp3d-v2 {
  /* Murs en orange du site : ils ressortent sur les traits noirs du plan
     (retour de recette de Sabri, 2026-10-05 : en encre ils se confondaient). */
  --vefa-fp3d-wall: var(--vefa-accent, #ff4000);
  --vefa-fp3d-door: var(--vefa-primary, #3498db);
  --vefa-fp3d-window: var(--vefa-viz-7, #0ea5e9);
  --vefa-fp3d-french: var(--vefa-viz-6, #8b5cf6);
}
.fp3d-v2 .fp3d-studio-stage {
  background-color: var(--vefa-bg-muted, #f1f5f9);
  background-image: radial-gradient(var(--vefa-border-strong, #cbd5e1) 1px, transparent 1.2px);
  background-size: 22px 22px;
}
.fp3d-v2 .fp3d-el--wall { opacity: 0.6; }
/* Mur à revoir : pointillé (repérable sans la couleur) sur un halo jaune. */
.fp3d-v2 .fp3d-el--wall.is-suspect { stroke-dasharray: 10 6; opacity: 0.85; }
.fp3d-v2 .fp3d-el--suspect {
  stroke: var(--vefa-warning-border, #fde68a);
  opacity: 0.9;
  stroke-linecap: round;
  pointer-events: none;
}
.fp3d-v2 .fp3d-el.is-selected { stroke: var(--vefa-primary, #3498db); }

/* Panneau de l'étape Vérifier. */
.fp3d-v2 .fp3d-panel-2d { display: flex; flex-direction: column; min-height: 100%; }
.fp3d-v2 .fp3d-panel-2d[hidden] { display: none; }
.fp3d-v2-verify { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 100%; }
.fp3d-v2-panel-head { padding: 24px 24px 16px; }
.fp3d-v2-over {
  margin: 0;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--vefa-primary-dark, #2980b9);
}
.fp3d-v2-title {
  margin: 6px 0 8px;
  font-family: var(--fp3d-v2-serif);
  font-size: 27px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--vefa-text, #0f172a);
}
.fp3d-v2-lead { margin: 0; font-size: 14px; line-height: 1.5; color: var(--vefa-text-muted, #475569); }
.fp3d-v2-forms { padding: 0 24px; }
.fp3d-v2-forms:empty { display: none; }
.fp3d-v2-forms > form:not([hidden]) { margin-bottom: 12px; }
.fp3d-v2-checks {
  list-style: none;
  margin: 0;
  padding: 0 24px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.fp3d-v2-check {
  display: flex;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 12px;
  background: var(--vefa-bg, #ffffff);
  transition: border-color 150ms var(--vefa-ease, ease), box-shadow 150ms var(--vefa-ease, ease);
}
.fp3d-v2-check.is-current {
  border-color: var(--vefa-primary, #3498db);
  box-shadow: 0 0 0 3px var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16));
}
.fp3d-v2-check__mark {
  width: 24px;
  height: 24px;
  flex: none;
  margin-top: 1px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1.5px solid var(--vefa-border-strong, #cbd5e1);
  font-size: 12px;
  font-weight: 650;
  color: var(--vefa-text-muted, #475569);
}
.fp3d-v2-check__mark i { display: none; font-size: 11px; }
.fp3d-v2-check.is-ok .fp3d-v2-check__mark {
  background: var(--vefa-success, #16a34a);
  border-color: var(--vefa-success, #16a34a);
  color: var(--vefa-text-on-primary, #ffffff);
}
.fp3d-v2-check.is-ok .fp3d-v2-check__mark i { display: inline; }
.fp3d-v2-check.is-ok .fp3d-v2-check__mark span { display: none; }
.fp3d-v2-check.is-current .fp3d-v2-check__mark {
  border-color: var(--vefa-primary, #3498db);
  color: var(--vefa-primary-darker, #1f6396);
  background: var(--vefa-primary-soft, rgba(52, 152, 219, 0.08));
}
.fp3d-v2-check__main { flex: 1; min-width: 0; }
.fp3d-v2-check__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.fp3d-v2-check__title { margin: 0; font-size: 14px; font-weight: 650; color: var(--vefa-text, #0f172a); }
.fp3d-v2-check:not(.is-current):not(.is-ok) .fp3d-v2-check__title { color: var(--vefa-text-muted, #475569); }
.fp3d-v2-check__tag {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  background: var(--vefa-warning-surface, #fffbeb);
  color: var(--vefa-warning-ink, #b45309);
  border: 1px solid var(--vefa-warning-border, #fde68a);
}
.fp3d-v2-check__text { margin: 3px 0 0; font-size: 13px; line-height: 1.45; color: var(--vefa-text-muted, #475569); }
.fp3d-v2-check__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.fp3d-v2-check__actions[hidden] { display: none; }
.fp3d-v2-check:not(.is-current) .fp3d-v2-check__actions { margin-top: 10px; }
.fp3d-v2-check__slot:empty { display: none; }
.fp3d-v2-check__slot { margin-top: 10px; }
.fp3d-v2-check__slot .fp3d-rooms { margin: 0; }

/* Boutons v2. */
.fp3d-v2-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 10px;
  background: var(--vefa-bg, #ffffff);
  color: var(--vefa-text, #0f172a);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 150ms var(--vefa-ease, ease), border-color 150ms var(--vefa-ease, ease);
}
.fp3d-v2-btn:hover { border-color: var(--vefa-border-strong, #cbd5e1); }
.fp3d-v2-btn--primary {
  background: var(--vefa-primary, #3498db);
  border-color: var(--vefa-primary, #3498db);
  color: var(--vefa-text-on-primary, #ffffff);
  box-shadow: var(--vefa-shadow-sm);
}
.fp3d-v2-btn--primary:hover { background: var(--vefa-primary-dark, #2980b9); border-color: var(--vefa-primary-dark, #2980b9); }
.fp3d-v2-btn--soft {
  background: var(--vefa-primary-soft, rgba(52, 152, 219, 0.08));
  border-color: transparent;
  color: var(--vefa-primary-darker, #1f6396);
}
.fp3d-v2-btn--soft:hover { background: var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16)); border-color: transparent; }
.fp3d-v2-btn--ghost { border-color: transparent; background: transparent; color: var(--vefa-text-muted, #475569); padding: 0 8px; }
.fp3d-v2-btn--ghost:hover { background: var(--vefa-bg-muted, #f1f5f9); border-color: transparent; }
.fp3d-v2-btn--lg { min-height: 44px; padding: 0 18px; font-size: 15px; border-radius: 12px; }
.fp3d-v2-btn:focus-visible,
.fp3d-v2-iconbtn:focus-visible { outline: 2px solid var(--vefa-primary, #3498db); outline-offset: 2px; }

/* « Plus de réglages » et pied collé. */
.fp3d-v2-more { margin: 0 24px 16px; font-size: 13px; color: var(--vefa-text-muted, #475569); }
.fp3d-v2-more > summary { cursor: pointer; font-weight: 600; padding: 6px 0; }
.fp3d-v2-more__body { display: flex; flex-direction: column; gap: 8px; padding-top: 8px; }
.fp3d-v2-panel-foot {
  position: sticky;
  bottom: 0;
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 24px;
  border-top: 1px solid var(--vefa-border, #e2e8f0);
  background: var(--vefa-bg, #ffffff);
  z-index: 2;
}
.fp3d-v2-progress { font-size: 13px; color: var(--vefa-text-muted, #475569); }
.fp3d-v2-progress b { color: var(--vefa-text, #0f172a); }

/* Alertes de surface reprises dans la carte Échelle. */
.fp3d-v2 .fp3d-v2-moved-alert { display: none; }
.fp3d-v2 #fp3d-panel-2d > .fp3d-alert { margin: 0 24px 12px; }

/* ---------- Lot 2 : barre d'outils flottante du plan ---------- */
.fp3d-v2-rail {
  position: absolute;
  left: 16px;
  top: 16px;
  z-index: 4;
  padding: 6px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 14px;
  background: var(--vefa-bg, #ffffff);
  box-shadow: var(--fp3d-v2-float-shadow);
}
.fp3d-v2-rail .fp3d-toolbar--panel {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
}
.fp3d-v2-rail .fp3d-tool {
  position: relative;
  width: 40px;
  min-height: 40px;
  height: 40px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--vefa-text-muted, #334155);
  font-size: 0;
  line-height: 0;
}
.fp3d-v2-rail .fp3d-tool i { font-size: 17px; line-height: 1; }
.fp3d-v2-rail .fp3d-tool:hover { background: var(--vefa-bg-muted, #f1f5f9); color: var(--vefa-text, #0f172a); }
.fp3d-v2-rail .fp3d-tool.is-active {
  background: var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16));
  color: var(--vefa-primary-darker, #1f6396);
  border: 0;
}
.fp3d-v2-rail .fp3d-tool[data-mode="scale"] { margin-top: 8px; }
.fp3d-v2-rail .fp3d-tool[data-mode="scale"]::before {
  content: "";
  position: absolute;
  left: 6px;
  right: 6px;
  top: -5px;
  height: 1px;
  background: var(--vefa-border, #e2e8f0);
}
.fp3d-v2-rail .fp3d-tool__lock {
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--vefa-primary, #3498db);
  font-size: 0;
}
.fp3d-v2-rail .fp3d-tool.is-locked { outline: none; }
/* Réglage « Nouveaux murs » : volet à droite de la barre quand l'outil Mur est actif. */
.fp3d-v2-rail .fp3d-wall-defaults:not([hidden]) {
  position: absolute;
  left: calc(100% + 10px);
  top: 46px;
  width: 260px;
  padding: 12px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 12px;
  background: var(--vefa-bg, #ffffff);
  box-shadow: var(--fp3d-v2-float-shadow);
  font-size: 13px;
  line-height: 1.4;
  flex-wrap: wrap;
}

/* Légende et indice flottants. */
.fp3d-v2-legend.fp3d-legend {
  position: absolute;
  right: 16px;
  top: 16px;
  z-index: 3;
  gap: 14px;
  padding: 8px 12px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 12px;
  background: var(--vefa-bg, #ffffff);
  box-shadow: var(--fp3d-v2-float-shadow);
  font-size: 12px;
  color: var(--vefa-text-muted, #475569);
}
.fp3d-v2-legend__suspect { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.fp3d-v2-legend__suspect::before {
  content: "";
  width: 16px;
  height: 8px;
  border-radius: 4px;
  background:
    repeating-linear-gradient(90deg, var(--vefa-accent, #ff4000) 0 5px, transparent 5px 8px) center / 100% 3px no-repeat,
    var(--vefa-warning-border, #fde68a);
}
/* Recette 2026-10-06 : en bas, la consigne recouvrait la zone tracée (balcon) ;
   tout en haut, la légende. Elle se place juste sous la légende. */
.fp3d-v2-hintpill.fp3d-mode-hint {
  position: absolute;
  left: 50%;
  top: 64px;
  transform: translateX(-50%);
  z-index: 3;
  max-width: min(560px, calc(100% - 160px));
  margin: 0;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--vefa-overlay-strong, rgba(15, 23, 42, 0.82));
  color: var(--vefa-text-on-dark, #ffffff);
  font-size: 13px;
  line-height: 1.35;
  text-align: center;
  pointer-events: none;
}
.fp3d-v2-hintpill.fp3d-mode-hint:empty { display: none; }

/* ---------- Lot 3 : carte de sélection flottante ---------- */
.fp3d-v2-popover {
  position: absolute;
  z-index: 5;
  width: 290px;
  padding: 12px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 12px;
  background: var(--vefa-bg, #ffffff);
  box-shadow: var(--fp3d-v2-float-shadow);
  font-size: 13px;
}
.fp3d-v2-popover[hidden] { display: none; }
.fp3d-v2-popover__body { display: flex; flex-direction: column; gap: 10px; }
.fp3d-v2-popover .fp3d-sel-card { padding: 0; border: 0; background: none; }
.fp3d-v2-popover .fp3d-thickness,
.fp3d-v2-popover .fp3d-wallkind,
.fp3d-v2-popover .fp3d-swing,
.fp3d-v2-popover .fp3d-open-dims { border-style: solid; border-color: var(--vefa-border, #e2e8f0); }
.fp3d-v2-thick-presets {
  display: flex;
  gap: 2px;
  padding: 3px;
  border-radius: 10px;
  background: var(--vefa-bg-muted, #f1f5f9);
}
.fp3d-v2-thick-presets[hidden],
.fp3d-v2-thick-hint[hidden] { display: none; }
.fp3d-v2-thick-presets button {
  flex: 1;
  height: 30px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--vefa-text-muted, #475569);
  cursor: pointer;
}
.fp3d-v2-thick-presets button.is-on {
  background: var(--vefa-bg, #ffffff);
  color: var(--vefa-text, #0f172a);
  box-shadow: var(--vefa-shadow-sm);
}
.fp3d-v2-thick-hint { margin: -4px 0 0; font-size: 12px; color: var(--vefa-text-muted, #64748b); }
.fp3d-v2-popover__foot {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--vefa-border-subtle, #f1f5f9);
}
.fp3d-v2-popover__foot .fp3d-tool {
  min-height: 32px;
  padding: 0 8px;
  border: 0;
  background: transparent;
  font-size: 13px;
}
.fp3d-v2-popover__foot .fp3d-tool:hover { background: var(--vefa-bg-muted, #f1f5f9); }
.fp3d-v2-flagnav { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.fp3d-v2-flagnav[hidden] { display: none; }
.fp3d-v2-flagnav__pos { font-size: 12px; font-weight: 600; color: var(--vefa-text-muted, #475569); padding: 0 4px; white-space: nowrap; }
.fp3d-v2-iconbtn--sm {
  width: 30px;
  height: 30px;
  font-size: 13px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  background: var(--vefa-bg, #ffffff);
}
@media (pointer: coarse) {
  .fp3d-v2-rail .fp3d-tool { width: 44px; height: 44px; min-height: 44px; }
  .fp3d-v2-iconbtn--sm { width: 44px; height: 44px; }
}
/* L'indice n'apparaît que pour un outil de pose (Sélection : pas de pastille). */
.fp3d-v2 .fp3d-studio-stage:has(.fp3d-tool.is-active[data-mode="select"]) .fp3d-v2-hintpill { display: none; }

/* ---------- Lot 4 : étapes Personnaliser (4) et Visiter et partager (5) ---------- */
.fp3d-v2:not([data-v2-step="4"]) .fp3d-v2-only-step4,
.fp3d-v2:not([data-v2-step="5"]) .fp3d-v2-only-step5 { display: none !important; }
.fp3d-v2 .fp3d-panel-3d { display: flex; flex-direction: column; min-height: 100%; }
.fp3d-v2 .fp3d-panel-3d[hidden] { display: none; }
.fp3d-v2 .fp3d-panel-3d > :not(.fp3d-v2-panel-head):not(.fp3d-v2-panel-foot):not(.fp3d-v2-share) { margin-left: 24px; margin-right: 24px; }
.fp3d-v2 .fp3d-panel-3d > .fp3d-panel-foot { display: none; }
.fp3d-v2 .fp3d-v2-over--done { color: var(--vefa-success-ink, #15803d); }

/* Étape 4 : ligne de contexte de la sélection, onglets en segmenté. */
.fp3d-v2 #fp3d-sel-title { display: none; }
.fp3d-v2 .fp3d-panel-head { padding: 0 0 12px; margin-bottom: 0; border-bottom: 0; }
.fp3d-v2 .fp3d-panel-head__sub { font-size: 13px; color: var(--vefa-text-muted, #475569); }
.fp3d-v2 .fp3d-ptabs { padding: 3px; gap: 2px; border-radius: 10px; margin-bottom: 14px; }
.fp3d-v2 .fp3d-ptab {
  min-height: 32px;
  font-size: 13px;
  font-weight: 600;
  color: var(--vefa-text-muted, #475569);
}
.fp3d-v2 .fp3d-ptab.is-active {
  background: var(--vefa-bg, #ffffff);
  color: var(--vefa-text, #0f172a);
  box-shadow: var(--vefa-shadow-sm);
}
/* Ambiances : cartes deux colonnes, échantillon mur au-dessus, sol en bande. */
.fp3d-v2 .fp3d-style-preset-grid { gap: 10px; }
.fp3d-v2 .fp3d-style-preset {
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding: 0;
  overflow: hidden;
  border-radius: 12px;
  border-color: var(--vefa-border, #e2e8f0);
  font-size: 13px;
}
.fp3d-v2 .fp3d-style-preset.is-active {
  border-color: var(--vefa-primary, #3498db);
  box-shadow: 0 0 0 3px var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16));
}
.fp3d-v2 .fp3d-style-preset__swatches {
  display: grid;
  grid-template-rows: 1fr 22px;
  height: 58px;
  border: 0;
  border-radius: 0;
}
.fp3d-v2 .fp3d-style-preset__swatch { width: auto; height: auto; }
.fp3d-v2 .fp3d-style-preset__swatch:first-child { grid-row: 2; }
.fp3d-v2 .fp3d-style-preset__swatch:last-child { grid-row: 1; }
.fp3d-v2 .fp3d-style-preset__label { padding: 8px 10px; font-weight: 600; }
.fp3d-v2 .fp3d-panel-hint--tight { font-size: 12px; font-weight: 600; color: var(--vefa-text-muted, #475569); }

/* Pied des étapes 4 et 5. */
.fp3d-v2-step-foot { gap: 8px; }
.fp3d-v2-step-foot .fp3d-v2-foot-slot { margin-right: auto; font-size: 12px; color: var(--vefa-text-muted, #64748b); }
.fp3d-v2-step-foot .fp3d-v2-foot-slot .fp3d-save-status { margin: 0; }
.fp3d-v2[data-v2-step="5"] .fp3d-v2-step-foot { justify-content: space-between; }
a.fp3d-v2-btn { text-decoration: none; }
a.fp3d-v2-btn:hover { color: var(--vefa-text, #0f172a); }

/* Étape 5 : le partage remplace les onglets de matériaux. */
.fp3d-v2[data-v2-step="5"] #fp3d-panel-3d > .fp3d-panel-head,
.fp3d-v2[data-v2-step="5"] #fp3d-panel-3d > .fp3d-ptabs,
.fp3d-v2[data-v2-step="5"] #fp3d-panel-3d > .fp3d-ptab-panel { display: none !important; }
.fp3d-v2-share { display: flex; flex-direction: column; gap: 14px; padding: 0 24px 16px; }
.fp3d-v2-share__card {
  margin: 0;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 14px;
  overflow: hidden;
}
.fp3d-v2-share__card img {
  display: block;
  width: 100%;
  height: 150px;
  object-fit: cover;
  background: var(--vefa-bg-muted, #f1f5f9);
}
.fp3d-v2-share__card figcaption { display: flex; flex-direction: column; padding: 12px 14px; font-size: 13px; color: var(--vefa-text-muted, #64748b); }
.fp3d-v2-share__card figcaption b { font-size: 14px; color: var(--vefa-text, #0f172a); }
/* Image de partage et avertissement (chantier studio3d-vue-visiteur). */
.fp3d-v2-share__cover,
.fp3d-v2-share__notice {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--vefa-text-muted, #64748b);
}
.fp3d-v2-share__cover [hidden] { display: none; }
.fp3d-v2-share__notice i { margin-right: 4px; color: var(--vefa-primary, #1e3a5f); }
.fp3d-v2-linkbtn {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: var(--vefa-link, #1d4ed8);
  text-decoration: underline;
  cursor: pointer;
}
.fp3d-v2-share__community {
  padding: 16px;
  border-radius: 14px;
  background: var(--vefa-accent-soft, rgba(255, 64, 0, 0.08));
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.fp3d-v2-share__community[hidden] { display: none; }
.fp3d-v2-share__community-head { display: flex; gap: 10px; align-items: center; font-size: 13px; color: var(--vefa-text-muted, #475569); }
.fp3d-v2-share__community-head b { display: block; font-size: 14px; color: var(--vefa-text, #0f172a); }
.fp3d-v2-share__bubble {
  width: 36px;
  height: 36px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--vefa-bg, #ffffff);
  color: var(--vefa-accent-action, #d93600);
}
.fp3d-v2-btn--accent {
  width: 100%;
  background: var(--vefa-accent-action, #d93600);
  border-color: var(--vefa-accent-action, #d93600);
  color: var(--vefa-text-on-primary, #ffffff);
}
.fp3d-v2-btn--accent:hover {
  background: var(--vefa-accent-action-hover, #b82d00);
  border-color: var(--vefa-accent-action-hover, #b82d00);
  color: var(--vefa-text-on-primary, #ffffff);
}
.fp3d-v2-share__save { padding: 14px; border-radius: 12px; background: var(--vefa-bg-soft, #f8fafc); font-size: 13px; }
.fp3d-v2-share__save p { margin: 0 0 10px; color: var(--vefa-text-muted, #475569); }
.fp3d-v2-share__save[hidden] { display: none; }
.fp3d-v2-share__rows { list-style: none; margin: 0; padding: 0; }
.fp3d-v2-share__rows li { border-top: 1px solid var(--vefa-border-subtle, #f1f5f9); }
.fp3d-v2-share__rows li[hidden] { display: none; }
.fp3d-v2-share__rows button {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border: 0;
  background: none;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.fp3d-v2-share__rows button > span:last-child { display: flex; flex-direction: column; font-size: 12.5px; color: var(--vefa-text-muted, #64748b); }
.fp3d-v2-share__rows b { font-size: 14px; color: var(--vefa-text, #0f172a); }
.fp3d-v2-share__ico {
  width: 36px;
  height: 36px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--vefa-bg-muted, #f1f5f9);
  color: var(--vefa-text-muted, #334155);
}
.fp3d-v2-share__rows button:hover .fp3d-v2-share__ico { background: var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16)); color: var(--vefa-primary-darker, #1f6396); }

/* Bascule des modes sur la vue : style de la maquette. */
.fp3d-v2 .fp3d-seg-bar .fp3d-seg__btn.is-active,
.fp3d-v2 .fp3d-seg-bar .fp3d-seg__btn[aria-pressed="true"] {
  background: var(--vefa-text, #0f172a);
  color: var(--vefa-text-on-dark, #ffffff);
}

/* Aide de navigation 3D : pastille en bas de la vue plutôt qu'une bande en
   haut (maquette A4) ; recentrer et aide restent cliquables. */
.fp3d-v2 .fp3d-help {
  top: auto;
  right: auto;
  left: 50%;
  bottom: 84px;
  transform: translateX(-50%);
  max-width: calc(100% - 32px);
  padding: 6px 6px 6px 14px;
  border-radius: 999px;
  background: var(--vefa-overlay-strong, rgba(15, 23, 42, 0.82));
  font-size: 13px;
  white-space: nowrap;
}
.fp3d-v2 .fp3d-help .fp3d-help-toggle { pointer-events: auto; }

/* ---------- Lot 5 : écrans Importer, pages, cadrage, Lecture ---------- */
/* Barre du haut hors studio (pages, cadrage, lecture). */
.fp3d-v2-appbar {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 64px;
  padding: 0 16px 0 20px;
  background: var(--vefa-bg, #ffffff);
  border-bottom: 1px solid var(--vefa-border, #e2e8f0);
}
.fp3d-v2-appbar .fp3d-v2-brand,
.fp3d-v2-appbar .fp3d-v2-sep { grid-row: auto; }
.fp3d-v2-appbar__name {
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  font-size: 14px;
  color: var(--vefa-text, #0f172a);
}
.fp3d-v2-appbar .fp3d-v2-quit {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 14px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 10px;
  background: var(--vefa-bg, #ffffff);
  color: var(--vefa-text, #0f172a);
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  white-space: nowrap;
}
body.fp3d-v2-focus .fp3d-viewer-bar { display: none; }
body.fp3d-v2-focus .vefa-sim-page-container,
body.fp3d-v2-focus .fp3d-viewer-page { background: var(--vefa-bg-soft, #f8fafc); }

/* Accueil : fil d'étapes sous le fil d'Ariane, en-tête sobre, colonne de droite. */
.fp3d-v2-entrybar {
  display: flex;
  justify-content: center;
  margin: 8px 0 24px;
  padding: 10px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 14px;
  background: var(--vefa-bg, #ffffff);
}
.fp3d-v2-entrybar .fp3d-v2-stepper { flex: 0 1 auto; }
body.fp3d-v2-body .fp3d-page { background: var(--vefa-bg-soft, #f8fafc); }
body.fp3d-v2-body .fp3d-hero { background: none; border: 0; box-shadow: none; padding: 0; margin-bottom: 24px; }
body.fp3d-v2-body .fp3d-hero__art,
body.fp3d-v2-body .fp3d-reassurance,
body.fp3d-v2-body .fp3d-how,
body.fp3d-v2-body .fp3d-benefits__art { display: none; }
body.fp3d-v2-body .fp3d-hero__title {
  margin: 8px 0 6px;
  font-family: var(--fp3d-v2-serif);
  font-size: clamp(28px, 3vw, 36px);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--vefa-text, #0f172a);
}
body.fp3d-v2-body .fp3d-hero__subtitle { font-size: 16px; color: var(--vefa-text-muted, #475569); }
body.fp3d-v2-body .fp3d-card {
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 16px;
  box-shadow: none;
}
body.fp3d-v2-body .fp3d-drop {
  min-height: 280px;
  border: 2px dashed var(--vefa-primary-border, #b8d6ea);
  border-radius: 20px;
  background: var(--vefa-bg, #ffffff);
}
body.fp3d-v2-body .fp3d-drop__icon {
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16));
  color: var(--vefa-primary-darker, #1f6396);
}
body.fp3d-v2-body .fp3d-cta-btn {
  border-radius: 12px;
  background: var(--vefa-primary, #3498db);
  box-shadow: var(--vefa-shadow-sm);
  color: var(--vefa-text-on-primary, #ffffff);
}
body.fp3d-v2-body .fp3d-cta-btn:hover { background: var(--vefa-primary-dark, #2980b9); }
.fp3d-v2-aside { display: flex; flex-direction: column; gap: 16px; }
.fp3d-v2-aside__card {
  padding: 20px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 16px;
  background: var(--vefa-bg, #ffffff);
}
.fp3d-v2-aside__title { margin: 0; font-size: 15px; font-weight: 700; color: var(--vefa-text, #0f172a); }
.fp3d-v2-aside__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.fp3d-v2-aside__head a { font-size: 13px; font-weight: 600; color: var(--vefa-primary-dark, #2980b9); text-decoration: none; }
.fp3d-v2-aside__tips { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; font-size: 13.5px; color: var(--vefa-text, #334155); }
.fp3d-v2-aside__tips li { display: flex; gap: 8px; align-items: flex-start; }
.fp3d-v2-aside__tips i { color: var(--vefa-success, #16a34a); margin-top: 3px; }
.fp3d-v2-aside__plans { list-style: none; margin: 8px 0 0; padding: 0; }
.fp3d-v2-aside__plans a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--vefa-border-subtle, #f1f5f9);
  color: var(--vefa-text, #0f172a);
  text-decoration: none;
}
.fp3d-v2-aside__plans li:first-child a { border-top: 0; }
.fp3d-v2-aside__thumb {
  width: 44px;
  height: 56px;
  flex: none;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 8px;
  background: var(--vefa-bg-muted, #f1f5f9);
  color: var(--vefa-text-subtle, #94a3b8);
}
.fp3d-v2-aside__thumb img { width: 100%; height: 100%; object-fit: cover; }
.fp3d-v2-aside__plan { display: flex; flex-direction: column; min-width: 0; font-size: 12.5px; color: var(--vefa-text-muted, #64748b); }
.fp3d-v2-aside__plan b { font-size: 14px; color: var(--vefa-text, #0f172a); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp3d-v2-aside__privacy { display: flex; gap: 10px; align-items: center; margin: 0; font-size: 13px; color: var(--vefa-text-muted, #475569); }

/* Lecture (attente) : carte sobre, bleu du site. */
body.fp3d-v2-body .fp3d-processing-card {
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 16px;
  box-shadow: none;
}
body.fp3d-v2-body .fp3d-validate-title {
  font-family: var(--fp3d-v2-serif);
  font-weight: 700;
  letter-spacing: -0.02em;
}
/* Le fil d'étapes de l'accueil prend la largeur de sa barre (container query). */
.fp3d-v2-entrybar .fp3d-v2-stepper { flex: 1 1 auto; width: 100%; }
/* L'exemple de plan dessiné (rose) laisse place aux conseils de la colonne de droite. */
body.fp3d-v2-body .fp3d-example { display: none; }
body.fp3d-v2-body .fp3d-upload-row { grid-template-columns: 1fr; }

/* ---------- Lot 6 : tablette et mobile ---------- */
/* Sous 992 px, la grille de base repasse sur une colonne (le panneau sous la
   vue, puis en feuille du bas sous 900 px) : on rend la main à ces règles. */
@media (max-width: 991px) {
  .fp3d-v2 .fp3d-studio-body { grid-template-columns: minmax(0, 1fr); }
  .fp3d-v2 .fp3d-studio-panel { border-left: 0; border-top: 1px solid var(--vefa-border, #e2e8f0); }
}
@media (max-width: 899px) {
  .fp3d-v2 .fp3d-studio-panel {
    border-top: 0;
    border-radius: 18px 18px 0 0;
    box-shadow: var(--vefa-shadow-xl);
  }
  .fp3d-v2-panel-head { padding: 8px 20px 12px; }
  .fp3d-v2-title { font-size: 22px; }
  .fp3d-v2-checks { padding: 0 16px 12px; gap: 8px; }
  .fp3d-v2-share { padding: 0 16px 12px; }
  .fp3d-v2 .fp3d-panel-3d > :not(.fp3d-v2-panel-head):not(.fp3d-v2-panel-foot):not(.fp3d-v2-share) { margin-left: 16px; margin-right: 16px; }
  .fp3d-v2-panel-foot { padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); }
  .fp3d-v2-panel-foot .fp3d-v2-btn--lg { flex: 1; min-height: 48px; }
  .fp3d-v2-progress { display: none; }

  /* Barre du haut sur deux rangées : identité et actions, puis le fil. */
  .fp3d-v2 .fp3d-studio-topbar {
    flex-wrap: wrap;
    min-height: 0;
    padding: 8px 10px 6px;
    gap: 6px 8px;
  }
  .fp3d-v2 .fp3d-topbar__ctx { flex: 1 1 0; min-width: 0; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: 10px; }
  .fp3d-v2-brand > span,
  .fp3d-v2 .fp3d-v2-sep { display: none; }
  .fp3d-v2 .fp3d-studio-crumb__trail { grid-column: 2; }
  .fp3d-v2 .fp3d-plan-status-chip { grid-column: 2; }
  .fp3d-v2 #fp3d-levels-bar { grid-column: 3; }
  .fp3d-v2 .fp3d-studio-crumb__name { max-width: none; }
  .fp3d-v2 .fp3d-topbar__actions { gap: 2px; }
  .fp3d-v2 #fp3d-details,
  .fp3d-v2 #fp3d-v2-help,
  .fp3d-v2 #fp3d-variant-name { display: none; }
  .fp3d-v2 .fp3d-v2-quit { padding: 0 10px; }
  .fp3d-v2 .fp3d-v2-stepper { order: 3; flex: 1 0 100%; }
  .fp3d-v2 .fp3d-variant__btn,
  .fp3d-v2 #fp3d-save-submit,
  .fp3d-v2 .fp3d-v2-quit { min-height: 44px; }
  .fp3d-v2-step { min-height: 40px; }

  /* Plan : barre d'outils plus grande au toucher, légende repliée. */
  .fp3d-v2-legend.fp3d-legend { display: none; }
  .fp3d-v2-rail { left: 10px; top: 10px; }
  .fp3d-v2-popover { width: min(290px, calc(100% - 80px)); }

  /* Barres hors studio et accueil. */
  .fp3d-v2-appbar { flex-wrap: wrap; padding: 8px 10px; gap: 6px 10px; min-height: 0; }
  .fp3d-v2-appbar .fp3d-v2-brand > span,
  .fp3d-v2-appbar .fp3d-v2-sep { display: none; }
  .fp3d-v2-appbar__name { flex: 1 1 0; max-width: none; }
  .fp3d-v2-appbar .fp3d-v2-stepper { order: 3; flex: 1 0 100%; }
  .fp3d-v2-entrybar { padding: 6px; }
}
@media (max-width: 899px) {
  /* Un seul niveau : la barre RDC / + Niveau cède sa place au nom du plan
     (« Ajouter un niveau » reste dans le menu Actions). */
  .fp3d-v2 #fp3d-levels-bar:not(:has(a.fp3d-levels__pill:not(.fp3d-levels__pill--add))) { display: none; }
  /* L'avertissement « maquette indicative » passerait sous la barre des modes. */
  .fp3d-v2 .fp3d-viewer-disclaimer { display: none; }
}

/* Fil d'étapes plus compact : les libellés des étapes faites restent visibles
   à 1440 px (on doit voir où cliquer pour revenir en arrière). */
.fp3d-v2-step { padding: 5px 8px 5px 5px; gap: 6px; }
.fp3d-v2-stepper__list,
.fp3d-v2-stepper__item { gap: 4px; }
.fp3d-v2-stepper__item + .fp3d-v2-stepper__item::before { width: 10px; }
.fp3d-v2 .fp3d-levels__pill-label { display: none; }
.fp3d-v2-step:not(:disabled):not(.is-current) { cursor: pointer; }
.fp3d-v2-step:not(:disabled):not(.is-current):hover .fp3d-v2-step__num { box-shadow: 0 0 0 3px var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16)); }
.fp3d-v2-step:disabled:not(.is-current) { opacity: 0.6; }

/* Menu « Vue » déplacé dans la barre des modes : il s'ouvre vers le haut. */
.fp3d-v2 .fp3d-seg-side #fp3d-camview { position: relative; pointer-events: auto; }
/* Recette 2026-10-06 : posé sur la 3D sans fond, le bouton paraissait grisé. */
.fp3d-v2 .fp3d-seg-side #fp3d-camview-btn {
  background: var(--vefa-surface-glass-strong, rgba(255, 255, 255, 0.92));
  border: 1px solid var(--vefa-border, #e2e8f0);
  box-shadow: var(--vefa-shadow-md, 0 4px 14px rgba(16, 24, 40, 0.22));
  color: var(--vefa-text, #0f172a);
}
.fp3d-v2 .fp3d-seg-side #fp3d-camview .fp3d-variant__menu { top: auto; bottom: calc(100% + 6px); left: auto; right: 0; }

/* Barre d'actions de la sélection (remplace la carte flottante, jugée trop
   envahissante en recette) : une seule ligne collée à l'élément. */
.fp3d-v2-popover {
  width: auto;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 6px 5px 12px;
  border-radius: 12px;
  white-space: nowrap;
}
.fp3d-v2-popover[hidden] { display: none; }
.fp3d-v2-popover__label { font-size: 13px; font-weight: 600; color: var(--vefa-text, #0f172a); padding-right: 4px; }
.fp3d-v2-popover .fp3d-v2-thick-presets { flex: none; }
.fp3d-v2-popover .fp3d-v2-thick-presets button { flex: none; width: 34px; height: 28px; }
.fp3d-v2-popover .fp3d-tool {
  width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 8px;
  background: transparent;
  font-size: 0;
  color: var(--vefa-text-muted, #475569);
}
.fp3d-v2-popover .fp3d-tool i { font-size: 15px; }
.fp3d-v2-popover .fp3d-tool:hover { background: var(--vefa-bg-muted, #f1f5f9); color: var(--vefa-text, #0f172a); }
.fp3d-v2-popover .fp3d-tool--danger:hover { color: var(--vefa-danger, #dc2626); }
.fp3d-v2-popover .fp3d-v2-flagnav { margin-left: 2px; padding-left: 6px; border-left: 1px solid var(--vefa-border, #e2e8f0); }
.fp3d-v2-popover .fp3d-v2-iconbtn--sm { width: 28px; height: 28px; }

/* Carte « Élément sélectionné » du panneau. */
.fp3d-v2-selection { margin: 0 24px 12px; padding: 14px; border: 1px solid var(--vefa-primary, #3498db); border-radius: 12px; background: var(--vefa-primary-surface, #eff6ff); }
.fp3d-v2-selection[hidden] { display: none; }
/* Recette 2026-10-06 : « Inverser le côté » et « Muret » sortaient du panneau. */
.fp3d-v2-selection .fp3d-swing,
.fp3d-v2-selection .fp3d-wallkind,
.fp3d-v2-selection .fp3d-wallkind-style,
.fp3d-v2-selection .fp3d-swing-side { flex-wrap: wrap; row-gap: 6px; max-width: 100%; }
.fp3d-v2-selection__body { display: flex; flex-direction: column; gap: 10px; }
.fp3d-v2-selection .fp3d-sel-card { padding: 0; border: 0; background: none; }
.fp3d-v2-selection .fp3d-wall-dims,
.fp3d-v2-selection .fp3d-thickness,
.fp3d-v2-selection .fp3d-wallkind,
.fp3d-v2-selection .fp3d-swing,
.fp3d-v2-selection .fp3d-open-dims { background: var(--vefa-bg, #ffffff); border-style: solid; border-color: var(--vefa-border, #e2e8f0); }
@media (max-width: 899px) {
  .fp3d-v2-selection { margin: 0 16px 10px; }
  .fp3d-v2-popover .fp3d-tool,
  .fp3d-v2-popover .fp3d-v2-iconbtn--sm { width: 44px; height: 44px; }
}

/* Entre 900 et 1199 px, la barre du haut ne tient pas sur une ligne : le fil
   d'étapes passe sur une seconde rangée, comme sur mobile. */
@media (max-width: 1199px) {
  .fp3d-v2 .fp3d-studio-topbar { flex-wrap: wrap; row-gap: 4px; padding-top: 8px; padding-bottom: 6px; }
  .fp3d-v2 .fp3d-topbar__ctx { flex: 1 1 0; min-width: 0; }
  .fp3d-v2 .fp3d-v2-stepper { order: 3; flex: 1 0 100%; }
  .fp3d-v2-appbar { flex-wrap: wrap; row-gap: 4px; padding-top: 8px; padding-bottom: 6px; }
  .fp3d-v2-appbar__name { flex: 1 1 0; }
  .fp3d-v2-appbar .fp3d-v2-stepper { order: 3; flex: 1 0 100%; }
}
/* Garde-fou : le fil ne déborde jamais sur ses voisins. */
.fp3d-v2-stepper { overflow: hidden; padding: 4px 4px; }
.fp3d-v2 .fp3d-topbar__ctx { justify-content: start; }

/* ---------- Meubles : catalogue façon planificateur grand public ---------- */
.fp3d-v2 .fp3d-furn-search { border-radius: 10px; padding: 0 12px; min-height: 40px; margin-bottom: 10px; }
.fp3d-v2 .fp3d-furn-search__input { font-size: 14px; }
.fp3d-v2-furn-chips {
  display: flex;
  gap: 6px;
  margin: 0 0 12px;
  padding-bottom: 2px;
  overflow-x: auto;
  scrollbar-width: none;
}
.fp3d-v2-furn-chips::-webkit-scrollbar { display: none; }
.fp3d-v2-furn-chips[hidden] { display: none; }
.fp3d-v2-furn-chip {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 999px;
  background: var(--vefa-bg, #ffffff);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--vefa-text-muted, #475569);
  cursor: pointer;
  white-space: nowrap;
}
.fp3d-v2-furn-chip span { font-weight: 500; color: var(--vefa-text-subtle, #94a3b8); }
.fp3d-v2-furn-chip:hover { border-color: var(--vefa-border-strong, #cbd5e1); }
.fp3d-v2-furn-chip.is-on {
  background: var(--vefa-text, #0f172a);
  border-color: var(--vefa-text, #0f172a);
  color: var(--vefa-text-on-dark, #ffffff);
}
.fp3d-v2-furn-chip.is-on span { color: var(--vefa-text-on-primary-muted, rgba(255, 255, 255, 0.75)); }
.fp3d-v2 .fp3d-furn-catalog { gap: 14px; }
.fp3d-v2 .fp3d-furn-cat-group[hidden] { display: none; }
.fp3d-v2 .fp3d-furn-section-title { font-size: 12px; font-weight: 650; letter-spacing: 0.06em; text-transform: uppercase; color: var(--vefa-text-muted, #475569); margin: 4px 0 0; }
.fp3d-v2 .fp3d-furn-catalog > .fp3d-furn-section-title:first-child { display: none; }
.fp3d-v2 .fp3d-furn-cat-group__title { display: none; }
.fp3d-v2 .fp3d-furn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.fp3d-v2 .fp3d-furn-thumb {
  align-items: stretch;
  gap: 0;
  padding: 0;
  overflow: hidden;
  border-color: var(--vefa-border, #e2e8f0);
  border-radius: 12px;
  background: var(--vefa-bg, #ffffff);
  text-align: left;
  font-size: 13px;
  line-height: 1.3;
  transition: border-color 150ms var(--vefa-ease, ease), box-shadow 150ms var(--vefa-ease, ease);
}
.fp3d-v2 .fp3d-furn-thumb:hover { border-color: var(--vefa-border-strong, #cbd5e1); box-shadow: var(--vefa-shadow-sm); }
.fp3d-v2 .fp3d-furn-thumb.is-placing {
  border-color: var(--vefa-primary, #3498db);
  box-shadow: 0 0 0 3px var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16));
}
.fp3d-v2 .fp3d-furn-thumb__icon {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  border-radius: 0;
  background: var(--vefa-bg-soft, #f8fafc);
  color: var(--vefa-text-subtle, #94a3b8);
  font-size: 22px;
}
.fp3d-v2 .fp3d-furn-thumb__icon img { object-fit: contain !important; border-radius: 0 !important; padding: 8px; }
.fp3d-v2 .fp3d-furn-thumb > span:not(.fp3d-furn-thumb__icon) { padding: 8px 10px 0; font-weight: 600; color: var(--vefa-text, #0f172a); }
.fp3d-v2 .fp3d-furn-thumb > .fp3d-v2-furn-dims { padding: 2px 10px 9px; font-size: 12px; font-weight: 500; color: var(--vefa-text-muted, #64748b); }
.fp3d-v2 .fp3d-furn-thumb > span:not(.fp3d-furn-thumb__icon):last-child:not(.fp3d-v2-furn-dims) { padding-bottom: 9px; }
.fp3d-v2 .fp3d-free-placement-toggle { margin-top: 12px; font-size: 13px; }
.fp3d-v2 #fp3d-furn-hint { font-size: 13px; }
.fp3d-v2 .fp3d-furn-selected {
  margin-bottom: 14px;
  border-color: var(--vefa-primary, #3498db);
  border-radius: 12px;
  background: var(--vefa-primary-surface, #eff6ff);
}

/* Rappel de pose et barre du meuble sélectionné, posés sur la vue 3D. */
.fp3d-v2-furn-placing,
.fp3d-v2-furn-bar {
  position: absolute;
  left: 50%;
  top: 16px;
  transform: translateX(-50%);
  z-index: 6;
  display: flex;
  align-items: center;
  gap: 6px;
  max-width: calc(100% - 32px);
  border-radius: 999px;
  box-shadow: var(--fp3d-v2-float-shadow);
  font-size: 13px;
  white-space: nowrap;
}
.fp3d-v2-furn-placing[hidden],
.fp3d-v2-furn-bar[hidden] { display: none; }
.fp3d-v2-furn-placing {
  padding: 6px 6px 6px 16px;
  background: var(--vefa-overlay-strong, rgba(15, 23, 42, 0.82));
  color: var(--vefa-text-on-dark, #ffffff);
}
.fp3d-v2-furn-placing__text { overflow: hidden; text-overflow: ellipsis; }
.fp3d-v2-furn-placing__cancel {
  min-height: 30px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  background: var(--vefa-bg, #ffffff);
  color: var(--vefa-text, #0f172a);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.fp3d-v2-furn-bar {
  padding: 5px 6px 5px 16px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  background: var(--vefa-bg, #ffffff);
}
.fp3d-v2-furn-bar__name { font-weight: 650; color: var(--vefa-text, #0f172a); padding-right: 6px; overflow: hidden; text-overflow: ellipsis; max-width: 220px; }
.fp3d-v2-furn-bar__btn {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--vefa-text-muted, #475569);
  cursor: pointer;
}
.fp3d-v2-furn-bar__btn:hover { background: var(--vefa-bg-muted, #f1f5f9); color: var(--vefa-text, #0f172a); }
.fp3d-v2-furn-bar__btn.is-danger:hover { color: var(--vefa-danger, #dc2626); }
.fp3d-v2-furn-bar__more {
  min-height: 34px;
  padding: 0 14px;
  border: 0;
  border-left: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 0 999px 999px 0;
  background: transparent;
  font: inherit;
  font-weight: 600;
  color: var(--vefa-primary-darker, #1f6396);
  cursor: pointer;
}
@media (pointer: coarse) {
  .fp3d-v2-furn-bar__btn { width: 44px; height: 44px; }
  .fp3d-v2-furn-chip { min-height: 40px; }
}
/* Catégories de meubles : à la ligne plutôt qu'en défilement horizontal
   (sans barre visible, on ne devinait pas les catégories de droite). */
.fp3d-v2-furn-chips { flex-wrap: wrap; overflow: visible; }

/* Muret ou garde-corps : deux boutons dans la barre d'actions d'un mur. */
.fp3d-v2-kind-toggle { display: flex; gap: 4px; }
.fp3d-v2-kind-toggle[hidden] { display: none; }
.fp3d-v2-kind-toggle button {
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 8px;
  background: var(--vefa-bg, #ffffff);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--vefa-text-muted, #475569);
  cursor: pointer;
}
.fp3d-v2-kind-toggle button:hover { border-color: var(--vefa-border-strong, #cbd5e1); color: var(--vefa-text, #0f172a); }
.fp3d-v2-kind-toggle button.is-on {
  background: var(--vefa-primary-soft-strong, rgba(52, 152, 219, 0.16));
  border-color: transparent;
  color: var(--vefa-primary-darker, #1f6396);
}
@media (pointer: coarse) { .fp3d-v2-kind-toggle button { min-height: 44px; } }
.fp3d-v2-entrance-toggle {
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 8px;
  background: var(--vefa-bg, #ffffff);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--vefa-text-muted, #475569);
  cursor: pointer;
}
.fp3d-v2-entrance-toggle[hidden] { display: none; }
.fp3d-v2-entrance-toggle.is-on {
  background: var(--vefa-text, #0f172a);
  border-color: transparent;
  color: var(--vefa-text-on-dark, #ffffff);
}
@media (pointer: coarse) { .fp3d-v2-entrance-toggle { min-height: 44px; } }
/* Triangle d'entrée sur le plan (convention des plans de vente). */
.fp3d-entrance-mark { fill: var(--vefa-text, #0f172a); stroke: var(--vefa-bg, #ffffff); stroke-width: 1.5px; vector-effect: non-scaling-stroke; }
.fp3d-wallkind-height { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; }
.fp3d-wallkind-height input {
  width: 3.5rem;
  min-height: 32px;
  padding: 0 6px;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 6px;
  font: inherit;
  text-align: center;
}

/* Plan d'un autre compte : mention à la place des étapes du propriétaire. */
.fp3d-v2-readonly {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--vefa-bg-muted, #f1f5f9);
  color: var(--vefa-text-muted, #475569);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  cursor: help;
}

/* Mode Volumes (meubles en maquette blanche) : bouton de la barre de vue,
   sans objet sur le plan 2D. */
.fp3d-v2 .fp3d-v2-volumes { display: inline-flex; align-items: center; width: auto; gap: 6px; padding: 0 10px; font-size: 13px; font-weight: 600; }
.fp3d-v2[data-v2-step="3"] .fp3d-v2-volumes { display: none; }
.fp3d-v2 .fp3d-v2-volumes.is-active {
  background: var(--vefa-primary-soft, rgba(52, 152, 219, 0.1));
  color: var(--vefa-primary, #3498db);
  border-color: var(--vefa-primary, #3498db);
}
@media (max-width: 599px) {
  .fp3d-v2 .fp3d-v2-volumes__label { display: none; }
  /* Recette 2026-10-06 : à 390 px, Volumes et plein écran sortaient de
     l'écran. Modes resserrés, plein écran retiré (sans effet sur iPhone, et
     la vue occupe déjà l'écran en mobile). */
  .fp3d-v2 .fp3d-seg__btn { padding-left: 0.6rem; padding-right: 0.6rem; }
  .fp3d-v2 .fp3d-seg-bar { padding: 0 10px; }
  .fp3d-v2 .fp3d-seg-bar .fp3d-seg-group,
  .fp3d-v2 .fp3d-seg-bar .fp3d-seg-side { gap: 6px; }
  .fp3d-v2 #fp3d-fullscreen { display: none; }
  .fp3d-v2 #fp3d-camview-btn .fp3d-share-label { display: none; }
  .fp3d-v2 .fp3d-seg__long { display: none; }
}

/* Notifications du site : en bas à droite, elles couvraient « Continuer » du
   panneau guide (recette 2026-10-06). En v2, sous la barre, à gauche du panneau. */
.fp3d-v2-body #htmx-toast-container { top: 76px; bottom: auto; right: 400px; }
@media (max-width: 991px) {
  .fp3d-v2-body #htmx-toast-container { top: 120px; right: 16px; }
}

/* Pièces sur le plan 2D (recette 2026-10-06) : nom de chaque pièce, pièces
   sans nom teintées ambre, pièce visée par « Nommer » en bleu. */
.fp3d-v2 .fp3d-room-name {
  fill: var(--vefa-text-muted, #475569);
  font-weight: 600;
  paint-order: stroke;
  stroke: var(--vefa-bg, #ffffff);
  stroke-linejoin: round;
}
.fp3d-v2 .fp3d-room-name.is-unnamed { fill: var(--vefa-warning-ink, #92400e); }
/* Nom cliquable : renommer sur place (le fond de la pièce désélectionne). */
.fp3d-v2 .fp3d-room-name[data-room-label] { cursor: text; }
.fp3d-v2 .fp3d-room-name[data-room-label]:hover { fill: var(--vefa-primary, #3498db); }
.fp3d-room-input {
  width: 11rem;
  border-color: var(--vefa-primary, #3498db);
  font-variant-numeric: normal;
}
.fp3d-v2 .fp3d-room-zone.is-unnamed { fill: var(--vefa-warning-soft, rgba(245, 158, 11, 0.16)); stroke: none; }
.fp3d-v2 .fp3d-room-zone.is-target {
  fill: var(--vefa-primary-soft, rgba(52, 152, 219, 0.14));
  stroke: var(--vefa-primary, #3498db);
  stroke-width: 2px;
  vector-effect: non-scaling-stroke;
}

/* Recette 2026-10-06 (spec Lot 6) : en mobile, la barre d'outils verticale
   masquait le côté gauche du plan ; elle passe en bande horizontale en haut,
   défilante si besoin. Pastilles du catalogue à 44 px (cible tactile). */
@media (max-width: 899px) {
  .fp3d-v2-rail { left: 10px; right: 10px; top: 10px; padding: 4px; overflow-x: auto; scrollbar-width: none; }
  .fp3d-v2-rail::-webkit-scrollbar { display: none; }
  .fp3d-v2-rail .fp3d-toolbar--panel { flex-direction: row; align-items: center; width: max-content; margin: 0 auto; }
  .fp3d-v2-rail .fp3d-tool[data-mode="scale"] { margin-top: 0; margin-left: 9px; }
  .fp3d-v2-rail .fp3d-tool[data-mode="scale"]::before { left: -5px; right: auto; top: 8px; bottom: 8px; width: 1px; height: auto; }
  .fp3d-v2 .fp3d-v2-hintpill.fp3d-mode-hint { top: 70px; }
  .fp3d-v2 .fp3d-v2-furn-chip { min-height: 44px; }
}

/* Visite au joystick (tactile, ou souris sans capture) : le joystick occupe le
   bas gauche, l'étiquette de la pièce passe en haut (recette 2026-10-06). */
.fp3d-v2:has(.fp3d-joystick.is-visible) .fp3d-room-chip-hud { top: 14px; bottom: auto; }

/* Barre d'actions de la sélection ancrée en haut au centre de la vue, sous la
   légende, et masquée pendant un glissement (retour de Sabri, 2026-10-07). */
.fp3d-v2 .fp3d-v2-popover { top: 62px; transition: opacity 0.12s ease; }
.fp3d-v2.is-v2-dragging .fp3d-v2-popover { opacity: 0; pointer-events: none; }
@media (max-width: 899px) {
  .fp3d-v2 .fp3d-v2-popover { top: auto; bottom: 76px; }
}

/* Nom de l'outil au survol de la barre d'outils (retour de Sabri, 2026-10-07). */
.fp3d-v2-rail .fp3d-tool[data-v2-tip]:hover::after,
.fp3d-v2-rail .fp3d-tool[data-v2-tip]:focus-visible::after {
  content: attr(data-v2-tip);
  position: absolute;
  left: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  padding: 5px 10px;
  border-radius: 8px;
  background: var(--vefa-overlay-strong, rgba(15, 23, 42, 0.82));
  color: var(--vefa-text-on-dark, #ffffff);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
  white-space: nowrap;
  pointer-events: none;
}
@media (max-width: 899px) {
  .fp3d-v2-rail .fp3d-tool[data-v2-tip]:hover::after,
  .fp3d-v2-rail .fp3d-tool[data-v2-tip]:focus-visible::after { display: none; }
}

/* Pastille de couleur dans les chips de finition d'une porte (2026-10-09). */
.fp3d-chip-dot {
  display: inline-block;
  width: 11px;
  height: 11px;
  margin-right: 6px;
  border-radius: 50%;
  border: 1px solid var(--vefa-border-strong, #cbd5e1);
  vertical-align: -1px;
}

/* ---------- Écran visiteur (chantier studio3d-vue-visiteur, spec §1) ----------
   Plan ouvert par quelqu'un d'autre que son auteur : le panneau visiteur
   remplace tout le panneau 3D. Les autres nœuds restent dans la page (le JS
   du Studio en dépend) mais sont masqués. */
.fp3d-v2-visitor .fp3d-panel-3d > :not(.fp3d-v2-visitor-panel) { display: none !important; }
.fp3d-v2-visitor-panel { display: flex; flex-direction: column; gap: 16px; padding-bottom: 24px; }
.fp3d-v2 .fp3d-panel-3d > .fp3d-v2-visitor-panel { margin-left: 0; margin-right: 0; }
.fp3d-v2-visitor-panel > :not(.fp3d-v2-panel-head) { margin: 0 24px; }
.fp3d-v2-visitor-panel .fp3d-v2-panel-head { padding-bottom: 0; }
.fp3d-v2-visitor-panel__author,
.fp3d-v2-visitor-panel__facts { margin: 0; font-size: 14px; color: var(--vefa-text-muted, #475569); }
.fp3d-v2-visitor-panel__author i { margin-right: 4px; }
.fp3d-v2-visitor-panel__facts { margin-top: 4px; font-weight: 600; color: var(--vefa-text, #0f172a); }
.fp3d-v2-visitor-panel__views { display: flex; flex-wrap: wrap; gap: 6px; }
.fp3d-v2-visitor-panel__discussion {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--vefa-link, #1d4ed8);
  text-decoration: none;
}
.fp3d-v2-visitor-panel__discussion:hover { text-decoration: underline; }
.fp3d-v2-visitor-panel__cta {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 4px;
  padding: 16px;
  border-radius: 14px;
  background: var(--vefa-accent-soft, rgba(255, 64, 0, 0.08));
}
.fp3d-v2-visitor-panel__cta p { margin: 0; font-size: 13px; color: var(--vefa-text-muted, #475569); text-align: center; }
/* Mobile : la feuille repliée du visiteur montre le titre et l'appel à
   l'action principal (sinon caché sous le pli). */
@media (max-width: 899px) {
  .fp3d-v2-visitor .fp3d-studio-panel:not(.is-half):not(.is-expanded) { transform: translateY(calc(100% - 178px)); }
  /* commandes flottantes recalées sur ce cran plus haut (132 px de base) */
  .fp3d-v2-visitor .fp3d-seg-bar { bottom: 188px; }
  .fp3d-sheet-half .fp3d-v2-visitor .fp3d-seg-bar,
  .fp3d-v2-visitor.fp3d-sheet-half .fp3d-seg-bar { bottom: calc(40vh + 12px); }
  .fp3d-v2-visitor-panel { gap: 12px; }
  .fp3d-v2-visitor-panel .fp3d-v2-over { display: none; }
  .fp3d-v2-visitor-panel .fp3d-v2-title {
    margin: 0;
    font-size: 19px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .fp3d-v2-visitor-panel .fp3d-v2-panel-head { padding-top: 4px; }
  .fp3d-v2-visitor-panel__cta { order: 1; padding: 0; background: none; }
  .fp3d-v2-visitor-panel__cta p { display: none; }
  .fp3d-v2-visitor-panel__views { order: 2; }
  .fp3d-v2-visitor-panel > .fp3d-v2-btn--soft { order: 3; }
  .fp3d-v2-visitor-panel__discussion { order: 4; }
}

/* ---------- Panneau Meubles façon HomeByMe (chantier studio3d-panneau-meubles) ----------
   Par pièce / Par type, tuiles puis puces de type puis grille ; bouton
   Agrandir qui élargit le panneau pendant que l'onglet Meubles est ouvert. */
.fp3d-v2 .fp3d-furn-search { gap: 8px; }
.fp3d-furn-wide-btn {
  flex: none;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  margin-right: -6px;
  border: 0;
  border-radius: var(--vefa-radius-sm, 6px);
  background: transparent;
  color: var(--vefa-text-muted, #475569);
  cursor: pointer;
}
.fp3d-furn-wide-btn:hover,
.fp3d-furn-wide-btn[aria-pressed="true"] { background: var(--vefa-bg-muted, #f1f5f9); color: var(--vefa-text, #0f172a); }
@media (min-width: 1100px) {
  .fp3d-v2.fp3d-furn-wide[data-ptab-active="meubles"] .fp3d-studio-body { grid-template-columns: minmax(0, 1fr) 600px; }
  .fp3d-v2.fp3d-furn-wide[data-ptab-active="meubles"] .fp3d-furn-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .fp3d-v2.fp3d-furn-wide[data-ptab-active="meubles"] .fp3d-cat-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1099px) { .fp3d-furn-wide-btn { display: none; } }

.fp3d-cat-nav { display: flex; flex-direction: column; gap: 12px; }
.fp3d-cat-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  border-radius: var(--vefa-radius-md, 10px);
  background: var(--vefa-bg-muted, #f1f5f9);
}
.fp3d-cat-tab {
  min-height: 34px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--vefa-text-muted, #475569);
  cursor: pointer;
}
.fp3d-cat-tab.is-on { background: var(--vefa-bg, #ffffff); color: var(--vefa-text, #0f172a); box-shadow: var(--vefa-shadow-sm); }
.fp3d-cat-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.fp3d-cat-tile {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 0 0 10px;
  overflow: hidden;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 12px;
  background: var(--vefa-bg, #ffffff);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color 150ms var(--vefa-ease, ease), box-shadow 150ms var(--vefa-ease, ease);
}
.fp3d-cat-tile:hover { border-color: var(--vefa-border-strong, #cbd5e1); box-shadow: var(--vefa-shadow-sm); }
.fp3d-cat-tile__pic {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  background: var(--vefa-bg-soft, #f8fafc);
  color: var(--vefa-text-subtle, #94a3b8);
  font-size: 26px;
}
.fp3d-cat-tile__pic img { width: 100%; height: 100%; object-fit: contain; padding: 10px; }
.fp3d-cat-tile__pic svg { max-width: 70%; max-height: 70%; }
.fp3d-cat-tile__name { padding: 8px 10px 0; font-size: 14px; font-weight: 650; color: var(--vefa-text, #0f172a); }
.fp3d-cat-tile__count { padding: 2px 10px 0; font-size: 12px; color: var(--vefa-text-muted, #64748b); }
.fp3d-cat-crumb { display: flex; align-items: center; gap: 8px; }
.fp3d-cat-crumb__back {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--vefa-border, #e2e8f0);
  border-radius: 50%;
  background: var(--vefa-bg, #ffffff);
  color: var(--vefa-text, #0f172a);
  cursor: pointer;
}
.fp3d-cat-crumb__back:hover { border-color: var(--vefa-border-strong, #cbd5e1); }
.fp3d-cat-crumb__title { font-size: 16px; font-weight: 700; color: var(--vefa-text, #0f172a); }
.fp3d-cat-nav .fp3d-cat-puces { margin: 0; }
.fp3d-cat-group-title { margin: 4px 0 -4px; font-size: 12px; font-weight: 650; letter-spacing: 0.06em; text-transform: uppercase; color: var(--vefa-text-muted, #475569); }
.fp3d-cat-replace {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 8px 8px 12px;
  border: 1px solid var(--vefa-primary, #3498db);
  border-radius: 12px;
  background: var(--vefa-primary-surface, #eff6ff);
}
.fp3d-cat-replace__title { font-size: 14px; font-weight: 650; color: var(--vefa-text, #0f172a); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Vignette sans image rendue : le dessin ou l'icône d'origine reste visible. */
.fp3d-cat-nav .fp3d-furn-thumb__icon { display: grid; place-items: center; overflow: hidden; }
.fp3d-cat-nav .fp3d-furn-thumb__icon > img { width: 100%; height: 100%; }
.fp3d-cat-nav .fp3d-furn-thumb__icon > i { font-size: 24px; }
.fp3d-cat-nav .fp3d-furn-thumb__icon > svg { max-width: 70%; max-height: 70%; }
@media (pointer: coarse), (max-width: 899px) {
  .fp3d-cat-tab, .fp3d-cat-crumb__back { min-height: 44px; }
  .fp3d-cat-crumb__back { width: 44px; height: 44px; }
}

/* Alerte des meubles qui se chevauchent ou entrent dans un mur (chantier
   studio3d-alerte-chevauchements, spec §4) : encadré discret en tête de
   l'onglet Meubles, pastille sur l'onglet. */
.fp3d-v2 .fp3d-ptab__badge {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  margin-left: 6px;
  padding: 0 5px;
  border-radius: 9px;
  background: var(--vefa-warning, #f59e0b);
  color: var(--vefa-text-on-primary, #ffffff);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  vertical-align: 1px;
}
.fp3d-v2 .fp3d-ptab__badge[hidden] { display: none; }
.fp3d-overlap-alert {
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid var(--vefa-warning-border, #fde68a);
  border-radius: 10px;
  background: var(--vefa-warning-surface, #fffbeb);
  color: var(--vefa-warning-ink, #b45309);
}
.fp3d-overlap-alert[hidden] { display: none; }
.fp3d-overlap-alert__head { display: flex; align-items: center; gap: 8px; }
.fp3d-overlap-alert__title { flex: 1; min-width: 0; font-size: 14px; font-weight: 650; }
.fp3d-overlap-alert__fold {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.fp3d-overlap-alert__fold:hover { background: var(--vefa-warning-soft, rgba(245, 158, 11, 0.1)); }
.fp3d-overlap-alert.is-folded .fp3d-overlap-alert__fold i { transform: rotate(180deg); }
.fp3d-overlap-alert.is-folded .fp3d-overlap-alert__body { display: none; }
.fp3d-overlap-alert__sub { margin: 4px 0 8px; font-size: 13px; color: var(--vefa-text-muted, #475569); }
.fp3d-overlap-alert__list { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.fp3d-overlap-alert__item,
.fp3d-overlap-alert__more {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 34px;
  padding: 6px 8px;
  border: 0;
  border-radius: 8px;
  background: var(--vefa-bg, #ffffff);
  color: var(--vefa-text, #0f172a);
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}
.fp3d-overlap-alert__item:hover,
.fp3d-overlap-alert__more:hover { box-shadow: var(--vefa-shadow-sm); }
.fp3d-overlap-alert__label { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.fp3d-overlap-alert__depth { flex: none; font-weight: 650; color: var(--vefa-warning-ink, #b45309); }
.fp3d-overlap-alert__more { justify-content: center; margin-top: 4px; background: transparent; color: var(--vefa-warning-ink, #b45309); font-weight: 600; }
@media (pointer: coarse), (max-width: 899px) {
  .fp3d-overlap-alert__item, .fp3d-overlap-alert__more, .fp3d-overlap-alert__fold { min-height: 44px; }
  .fp3d-overlap-alert__fold { width: 44px; }
}