/* ── Composeur : une fenêtre de taille fixe, quel que soit le réseau (22/09/2026) ────────────── Repris de la fenêtre de publication de Focato (v1.1.431-432), aux couleurs de Comunicato. Avant : une colonne de 390 px dont la hauteur suivait l'aperçu du réseau actif — Instagram 555 px, Facebook/LinkedIn 455, YouTube 420, TikTok 614 (mesuré le 22/09/2026) — et des options rangées sous l'aperçu, hors de l'écran dès que le post était long. La fenêtre changeait de taille à chaque bascule de réseau. Maintenant : - Ordinateur : deux colonnes, téléphone à gauche, réglages à droite (cases réseaux en tête) ; en-tête (réseau visualisé, titre | croix), barre du type de publication et pied (IA, boutons) toujours visibles. - Le téléphone a une taille fixe en 9:16, identique pour tous les réseaux et formats. Il ne défile pas : c'est l'IMAGE qui rétrécit pour que l'en-tête, les actions et la légende tiennent, recadrée comme le ferait le réseau, jamais déformée. - Mobile : la fenêtre prend l'écran, une seule colonne. Les maquettes des réseaux gardent leurs couleurs en dur (elles imitent l'UI native, voir index.css) ; seul le cadre de la fenêtre suit le thème clair/sombre. Tout est scopé à #caption-modal : les autres .modal de l'app ne bougent pas. */ #caption-modal .modal { /* 250 px = tout ce qui n'est pas le téléphone : en-tête, barre du type de publication, pied (case IA, boutons), marges du corps et bordures — 245 px mesurés le 22/09/2026, plus une marge. */ --pub-phone-h: clamp(440px, calc(min(94dvh, 920px) - 250px), 604px); } /* En-tête : le réseau visualisé puis le titre à gauche, la croix à droite. Le titre (celui de la tâche) peut être long : il se coupe plutôt que de passer à la ligne. */ #caption-modal .modal-header { gap: 12px; justify-content: flex-start; } #caption-modal .pub-network-tabs { margin: 0; gap: 6px; flex-shrink: 0; } #caption-modal .pub-network-tab svg { width: 26px; height: 26px; display: block; } #caption-modal .modal-header h3 { flex: 1 1 auto; min-width: 0; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* Type de publication : une barre sous le titre, centrée au-dessus de l'aperçu et des réglages, avec son libellé — un sélecteur nu dans l'en-tête ne disait pas ce qu'il réglait. */ #caption-modal .pub-format-bar { display: flex; align-items: center; justify-content: center; gap: 10px; flex-shrink: 0; /* Hauteur fixe : sans sélecteur (YouTube, TikTok), elle perdait 12 px. */ box-sizing: border-box; height: 48px; padding: 0 16px; border-bottom: 1px solid rgba(var(--accent-border-rgb),0.15); } #caption-modal .pub-format-lbl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: rgba(var(--text-rgb),0.6); } #caption-modal .pub-format-wrap { display: flex; flex-shrink: 0; } /* YouTube (Short) et TikTok n'ont pas de choix de format : la barre garde sa place, vide, pour que la fenêtre ne change pas de taille en passant d'un réseau à l'autre. */ #caption-modal[data-reseau="youtube"] .pub-format-bar > *, #caption-modal[data-reseau="tiktok"] .pub-format-bar > * { visibility: hidden; } /* Un