/* Version ordinateur : l'application garde sa présentation mobile, centrée dans une colonne entre deux bandes neutres.
   Rien ne change sur téléphone ni dans l'administration (qui n'utilise pas ce gabarit). Les éléments en position fixe (navigation,
   bouton et fenêtre du chat, carte) sont recalés sur la colonne : la position fixe se calcule sinon sur la fenêtre du navigateur. */
:root { --pb-frame: 430px; --pb-bands: #d9d3cb; }

@media (min-width: 768px) {
    html { background: var(--pb-bands); }
    body { max-width: var(--pb-frame); margin-inline: auto; min-height: 100dvh; position: relative; box-shadow: 0 0 0 1px rgba(51, 51, 51, 0.08), 0 0 48px rgba(51, 51, 51, 0.16); }

    /* Bloc fixe de la largeur de la colonne (barre de navigation, carte plein écran, bandeau de déplacement) */
    .pb-frame-fixed { left: 50%; right: auto; width: 100%; max-width: var(--pb-frame); translate: -50% 0; }

    /* Chat : bouton et fenêtre ancrés au bord de la colonne */
    #chat-toggle { right: max(0.5rem, calc(50% - var(--pb-frame) / 2 + 0.5rem)); }
    #chat-window { left: max(1rem, calc(50% - var(--pb-frame) / 2 + 1rem)); right: max(1rem, calc(50% - var(--pb-frame) / 2 + 1rem)); width: auto; }

    /* Fenêtres : jamais plus larges que la colonne, y compris les feuilles du bas */
    .modal-box { max-width: min(var(--pb-frame), 100%); }
    .modal-bottom .modal-box { width: 100%; }
}