/* interface/fenetres-deplacables.css — fenêtres déplaçables
   Extrait de styles.css à l'étape 8 du découpage. L'ordre de chargement (index.html) est celui
   de l'ancienne feuille : à spécificité égale, la dernière règle l'emporte (voir CARTE.md, CSS). */
/* ==== Fenêtres déplaçables (cartes, étiquettes, nouvelle liste) ====
   Poignée = barre de titre. Le décalage utilise la propriété `translate`, qui s'ajoute à la
   position centrée d'origine sans gêner les animations `transform` ni la mise en page. */
.modal.is-movable .modal-head{cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none;}
/* Petite poignée à 6 points : signale que la barre de titre se saisit. */
.modal.is-movable .modal-head h2::before{
 content:'';flex:none;width:calc(6px * var(--ui-scale-factor));height:calc(9px * var(--ui-scale-factor));margin-right:calc(6.75px * var(--ui-scale-factor));opacity:.38;transition:opacity .15s ease;
 background:radial-gradient(circle,var(--text-faint) calc(0.8625px * var(--ui-scale-factor)),transparent calc(1.125px * var(--ui-scale-factor))) 0 0/calc(3px * var(--ui-scale-factor)) calc(3px * var(--ui-scale-factor));
}
.modal.is-movable .modal-head:hover h2::before,
.modal.is-movable.is-dragging .modal-head h2::before{opacity:.85;}

/* ==== Fenêtres déplaçables — suite (rapatriée de interface/surcharges.css à l’étape 8 : sans effet sur la cascade) ==== */
@media (prefers-reduced-motion:reduce){ .modal.is-movable .modal-head h2::before{transition:none;} }
.modal.is-movable .modal-head h2{display:flex;align-items:center;}
.modal.is-movable.is-dragging .modal-head{cursor:grabbing;}