/* Studio : la photo comme toile. Repères HTML posés sur le canevas d'aperçu. */
#personalization-workspace .simulation-stage { overflow: visible; }
#personalization-workspace #internal-visualizer { cursor: grab; }
#personalization-workspace #internal-visualizer:active { cursor: grabbing; }
.ps-overlay { position: absolute; inset: 0; pointer-events: none; z-index: 3; }
.ps-overlay[hidden] { display: none; }
.ps-frame { position: absolute; border: 1.5px solid rgba(0, 113, 227, .95); box-shadow: 0 0 0 1px rgba(255, 255, 255, .75); border-radius: 2px; }
.ps-handle { position: absolute; right: -10px; bottom: -10px; width: 20px; height: 20px; padding: 0; border-radius: 50%; background: #fff; border: 2px solid #0071e3; box-shadow: 0 1px 4px rgba(0, 0, 0, .25); cursor: nwse-resize; pointer-events: auto; touch-action: none; }
.ps-handle:focus-visible { outline: 3px solid #0071e3; outline-offset: 2px; }
.ps-size { position: absolute; left: 50%; top: 100%; transform: translate(-50%, 8px); background: #1f2540; color: #fff; font: 600 11px/1 'DM Sans', sans-serif; padding: 5px 8px; border-radius: 6px; white-space: nowrap; }
.ps-hint { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); background: rgba(31, 37, 64, .86); color: #fff; font: 500 12px/1.2 'DM Sans', sans-serif; padding: 7px 12px; border-radius: 999px; white-space: nowrap; max-width: calc(100% - 20px); overflow: hidden; text-overflow: ellipsis; }
.ps-hint[hidden], .ps-approx[hidden] { display: none; }
.ps-admin { position: absolute; right: 10px; top: 10px; pointer-events: auto; background: rgba(31, 37, 64, .86); color: #fff; font: 600 11px/1.2 'DM Sans', sans-serif; padding: 5px 9px; border-radius: 999px; text-decoration: none; }
.ps-approx { position: absolute; left: 10px; top: 10px; background: #fdf1d9; color: #674513; font: 600 11px/1.2 'DM Sans', sans-serif; padding: 5px 9px; border-radius: 999px; }
/* La photo mérite la place : hauteur minimale confortable, la colonne défile si besoin. */
@media (min-width: 901px) {
 #personalization-workspace.pw-v2.pw-v3[data-step] .pw-flat .commercial-simulation { flex: 1 0 auto; min-height: min(52dvh, 600px); }
 #personalization-workspace.pw-v2.pw-v3[data-step] .simulation-stage { width: min(100cqw, calc(100cqh - 36px), 640px); }
}
/* Sous la photo : mention « aperçu indicatif / emplacement estimé ». */
#personalization-workspace.pw-v3 .commercial-simulation > span { display: block; margin: 8px auto 0; font-size: 12px; line-height: 1.45; color: #59607a; max-width: 560px; }
#personalization-workspace.pw-v3 .commercial-simulation > span:empty { display: none; }
/* La photo est déjà en grand au centre : pas de doublon en haut de la colonne de droite. */
#personalization-workspace.pw-v3[data-main-view="photo"] .pw-side > .pw-preview-top { display: none; }
@media (max-width: 700px) { .ps-hint { font-size: 11px; padding: 6px 10px; } .ps-handle { width: 26px; height: 26px; right: -13px; bottom: -13px; } }
