/* flotante.css — presentación puramente ESTRUCTURAL de flotante-core.js. El Core jamás decide estilos
   visuales (color, tipografía, sombra, borde): eso es 100% de cada Component. Lo único que hay acá es
   mecánica — posición y las clases de tamaño (sin reglas propias todavía, ver flotanteAplicarTamaño() en
   flotante-core.js: el contrato está preparado, cada Component decide qué significa cada tamaño para él). */

#coreFlotante {
    /* Sin reglas propias — es solo el contenedor raíz; cada hijo se posiciona con position: fixed. */
}

/* 🌑 Backdrop — instancia propia por flotante (nunca compartido, ver flotanteMontar()). position/inset son
   mecánica pura; el color de oscurecido es el único default visual que Core se permite, por el mismo
   motivo por el que ui-core.js ya lo hace en #pausarSitio: un fondo oscurecido genérico no es "la marca
   visual" de ningún Component en particular, es el comportamiento esperado de cualquier backdrop. */
.flotante-backdrop {
    background: rgba(15, 23, 42, .45);
    opacity: 0;
    transition: opacity .15s ease;
}

.flotante-backdrop--visible {
    opacity: 1;
}

/* 📐 Placeholders de tamaño — contrato reservado, sin implementar. Cada Component define, en su propio
   CSS, qué significa 'normal'/'grande'/'fullscreen' aplicado a su propio nodo. */
.flotante--normal { }
.flotante--grande { }
.flotante--fullscreen { }