/* Radiología, «El laboratorio», según el Manual de Uso y Estilo
   CUI.DATE v2.0:
   - El cuarto de noche es del morado de marca: la pared (el fondo del login,
     con una penumbra que sube desde el piso), el zócalo, el piso y lo de
     adelante (el mesón, la bobina, el atril) son sombras de #4E1581, cada
     plano más oscuro que el de atrás. La noche que se ve por el ventanal es
     el mismo morado, más azulado y más oscuro. Sus degradados están en
     doodle.js.
   - Tokens del manual (§08): #E3D2F5 para las estrellas, los brillos del
     vidrio de los frascos, los rótulos y el mensaje; #B6A6C9 para los filos
     que toman luz (cubierta del mesón, alféizar, repisas, zócalo), el
     bobinado y las barras de zinc; #FFFFFF para la chispa y el mensaje.
   - La paleta de la física del descubrimiento (§15, ya usada): el verde
     manzana #B8F7A8 del vidrio del tubo, que se escapa por el cartón, y el
     amarillo verdoso #EAF7A0 de la pantalla de platinocianuro de bario, con
     sus tintes (#F7FFC8) y su sombra (#CFE38A); la mano va en morado oscuro.
   - Excepción nueva (§15): el latón apagado del descargador de la bobina
     (#D2C08F a #8C7752), solo en esas piezas chicas. Necesita visto bueno de
     diseño.
     El color no lleva solo el significado: la pantalla es la única cosa
     clara del cuarto, la más grande, con halo, y muestra la mano.
   - Riqueza sin costo: la luz son degradados de SVG (halos radiales, la luz
     en la pared y el reflejo en el piso), sin filtros; nada se desenfoca
     cuadro a cuadro.
   El estado final de cada elemento es el de este CSS: doodle.js solo anima la
   entrada, así que sin JS de animación (o con prefers-reduced-motion) se ve
   la escena completa y quieta. */
body.doodle-dia-radiologia-laboratorio .doodle-capa {
    opacity: 1;
}

/* Los filos que toman un poco de luz: una línea de 1 px a cualquier escala. */
body.doodle-dia-radiologia-laboratorio .rxa-filo {
    fill: none;
    stroke: #B6A6C9;
    stroke-opacity: 0.22;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-filo-piso {
    stroke-opacity: 0.12;
}

/* La pared: el zócalo de madera, sus paneles y el rodapié. */
body.doodle-dia-radiologia-laboratorio .rxa-moldura {
    fill: #2E0A55;
}

body.doodle-dia-radiologia-laboratorio .rxa-panel {
    fill: none;
    stroke: #B6A6C9;
    stroke-opacity: 0.07;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-rodapie {
    fill: #22073D;
}

/* Las tablas del piso, apenas. */
body.doodle-dia-radiologia-laboratorio .rxa-tablas {
    fill: none;
    stroke: #B6A6C9;
    stroke-opacity: 0.05;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

/* El ventanal: el marco y los junquillos en contraluz, la noche afuera. */
body.doodle-dia-radiologia-laboratorio .rxa-marco {
    fill: #2A0A4D;
}

body.doodle-dia-radiologia-laboratorio .rxa-junquillo {
    fill: none;
    stroke: #22073F;
    stroke-width: 2.2;
}

body.doodle-dia-radiologia-laboratorio .rxa-parteluz {
    fill: none;
    stroke: #2A0A4D;
    stroke-width: 4;
}

body.doodle-dia-radiologia-laboratorio .rxa-alfeizar {
    fill: #2E0B55;
}

body.doodle-dia-radiologia-laboratorio .rxa-estrella {
    fill: #E3D2F5;
    fill-opacity: 0.55;
}

body.doodle-dia-radiologia-laboratorio .rxa-cerro {
    fill: #2B135F;
}

body.doodle-dia-radiologia-laboratorio .rxa-ciudad {
    fill: #170431;
}

/* Las repisas y sus frascos, en silueta, con un brillo lila en el vidrio. */
body.doodle-dia-radiologia-laboratorio .rxa-repisa {
    fill: #2A0A4D;
}

body.doodle-dia-radiologia-laboratorio .rxa-frasco {
    fill: #2B0B50;
    fill-opacity: 0.92;
}

body.doodle-dia-radiologia-laboratorio .rxa-rotulo {
    fill: #E3D2F5;
    fill-opacity: 0.1;
}

body.doodle-dia-radiologia-laboratorio .rxa-brillo-vidrio {
    fill: none;
    stroke: #E3D2F5;
    stroke-opacity: 0.2;
    stroke-width: 1;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

/* El mesón: más oscuro que la pared, con la cubierta un poco más clara. */
body.doodle-dia-radiologia-laboratorio .rxa-banco-tapa {
    fill: #3A1266;
}

body.doodle-dia-radiologia-laboratorio .rxa-banco {
    fill: #26083F;
}

body.doodle-dia-radiologia-laboratorio .rxa-banco-faldon {
    fill: #1D0536;
}

body.doodle-dia-radiologia-laboratorio .rxa-banco-pata {
    fill: #19042F;
}

body.doodle-dia-radiologia-laboratorio .rxa-banco-cajon {
    fill: none;
    stroke: #B6A6C9;
    stroke-opacity: 0.08;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-banco-tirador {
    fill: #B6A6C9;
    fill-opacity: 0.25;
}

/* Las pilas bajo el mesón. */
body.doodle-dia-radiologia-laboratorio .rxa-pila {
    fill: #2A0B4C;
    stroke: #B6A6C9;
    stroke-opacity: 0.12;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-zinc {
    fill: #B6A6C9;
    fill-opacity: 0.3;
}

/* Los cables, oscuros contra la pared. */
body.doodle-dia-radiologia-laboratorio .rxa-cable {
    fill: none;
    stroke: #13022A;
    stroke-width: 1.6;
    stroke-linecap: round;
}

body.doodle-dia-radiologia-laboratorio .rxa-cable-fino {
    stroke-width: 1.2;
}

/* La bobina de inducción. */
body.doodle-dia-radiologia-laboratorio .rxa-madera {
    fill: #24073F;
}

body.doodle-dia-radiologia-laboratorio .rxa-interruptor {
    fill: #2E0D55;
}

body.doodle-dia-radiologia-laboratorio .rxa-vueltas {
    fill: none;
    stroke: #B6A6C9;
    stroke-opacity: 0.16;
    stroke-width: 0.8;
}

body.doodle-dia-radiologia-laboratorio .rxa-brida {
    fill: #2E0D55;
    stroke: #B6A6C9;
    stroke-opacity: 0.18;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-columna {
    fill: #1A0532;
}

body.doodle-dia-radiologia-laboratorio .rxa-varilla {
    fill: none;
    stroke: #A8936A;
    stroke-width: 1.8;
    stroke-linecap: round;
}

/* El tubo: el soporte, el forro de cartón negro y las puntas de vidrio, que
   apagadas apenas se ven verdes. */
body.doodle-dia-radiologia-laboratorio .rxa-soporte {
    fill: #2E0D55;
}

body.doodle-dia-radiologia-laboratorio .rxa-abrazadera {
    fill: #2A0A4D;
}

body.doodle-dia-radiologia-laboratorio .rxa-carton {
    fill: #110320;
}

body.doodle-dia-radiologia-laboratorio .rxa-carton-borde {
    fill: none;
    stroke: #B6A6C9;
    stroke-opacity: 0.12;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-boca {
    fill: #07010F;
}

body.doodle-dia-radiologia-laboratorio .rxa-vidrio {
    fill: #B8F7A8;
    fill-opacity: 0.14;
    stroke: #B8F7A8;
    stroke-opacity: 0.4;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-metal {
    fill: #B6A6C9;
    fill-opacity: 0.5;
}

/* La chispa: un hilo blanco con su halo lila. */
body.doodle-dia-radiologia-laboratorio .rxa-chispa {
    fill: none;
    stroke: #FFFFFF;
    stroke-width: 1.1;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* El verde que se escapa del cartón. */
body.doodle-dia-radiologia-laboratorio .rxa-fuga-chica {
    opacity: 0.6;
}

body.doodle-dia-radiologia-laboratorio .rxa-fuga-mesa {
    opacity: 0.55;
}

body.doodle-dia-radiologia-laboratorio .rxa-vidrio-luz {
    fill: #B8F7A8;
    fill-opacity: 0.5;
}

body.doodle-dia-radiologia-laboratorio .rxa-fuga-borde {
    fill: none;
    stroke: #B8F7A8;
    stroke-opacity: 0.85;
    stroke-width: 1.2;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-fuga-tenue {
    stroke-opacity: 0.45;
}

/* El atril de la pantalla y su marco de madera. */
body.doodle-dia-radiologia-laboratorio .rxa-atril-atras {
    fill: #18042D;
}

body.doodle-dia-radiologia-laboratorio .rxa-atril {
    fill: #22073D;
}

body.doodle-dia-radiologia-laboratorio .rxa-marco-placa {
    fill: #2C0B51;
}

body.doodle-dia-radiologia-laboratorio .rxa-repisa-atril {
    fill: #26083F;
}

body.doodle-dia-radiologia-laboratorio .rxa-placa-apagada {
    fill: #2A0B4C;
}

/* La luz de la pantalla: crece desde su centro. */
body.doodle-dia-radiologia-laboratorio .rxa-luz {
    transform-box: fill-box;
    transform-origin: center;
}

/* Lo que devuelve la luz de la pantalla: los filos cercanos de la pared y
   las repisas (con un degradado que se apaga hacia los lados), el canto de
   los frascos cercanos (en tres niveles, según la distancia), el borde del
   marco y la repisa del atril. */
body.doodle-dia-radiologia-laboratorio .rxa-luz-frasco {
    fill: none;
    stroke: #EAF7A0;
    stroke-width: 1.2;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-l1 {
    stroke-opacity: 0.2;
}

body.doodle-dia-radiologia-laboratorio .rxa-l2 {
    stroke-opacity: 0.38;
}

body.doodle-dia-radiologia-laboratorio .rxa-l3 {
    stroke-opacity: 0.6;
}

body.doodle-dia-radiologia-laboratorio .rxa-luz-canto {
    fill: none;
    stroke-width: 1.4;
    vector-effect: non-scaling-stroke;
}

body.doodle-dia-radiologia-laboratorio .rxa-luz-canto-lejos {
    stroke-opacity: 0.5;
}

body.doodle-dia-radiologia-laboratorio .rxa-luz-marco {
    fill: none;
    stroke: #EAF7A0;
    stroke-opacity: 0.5;
    stroke-width: 2;
}

body.doodle-dia-radiologia-laboratorio .rxa-luz-repisa {
    fill: none;
    stroke: #EAF7A0;
    stroke-opacity: 0.35;
    stroke-width: 1.5;
}

/* La mano en la placa: la piel es una sombra tenue (la opacidad va en el
   grupo, para que los dedos y la palma no se sumen donde se cruzan), los
   huesos más densos con su cortical marcada, y el anillo, de metal, lo más
   oscuro. */
body.doodle-dia-radiologia-laboratorio .rxa-piel {
    opacity: 0.26;
    fill: #3B0F66;
}

body.doodle-dia-radiologia-laboratorio .rxa-piel path:first-child {
    stroke: #3B0F66;
    stroke-width: 7;
    stroke-linejoin: round;
}

body.doodle-dia-radiologia-laboratorio .rxa-dedo {
    fill: none;
    stroke: #3B0F66;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body.doodle-dia-radiologia-laboratorio .rxa-hueso {
    fill: #3B0F66;
    fill-opacity: 0.5;
    stroke: #2A0850;
    stroke-opacity: 0.75;
    stroke-width: 0.7;
    stroke-linejoin: round;
}

body.doodle-dia-radiologia-laboratorio .rxa-anillo {
    fill: none;
    stroke: #1F0538;
    stroke-opacity: 0.92;
    stroke-width: 3.2;
    stroke-linecap: round;
}

/* Las motas de polvo: quedan tenues después de su ola. */
body.doodle-dia-radiologia-laboratorio .rxa-banda {
    opacity: 0.5;
}

body.doodle-dia-radiologia-laboratorio .rxa-mota {
    fill: #EAF7A0;
    fill-opacity: 0.45;
}

body.doodle-dia-radiologia-laboratorio .rxa-mota-verde {
    fill: #B8F7A8;
}

body.doodle-dia-radiologia-laboratorio .rxa-mota-clara {
    fill-opacity: 0.85;
}

/* El mensaje va DEBAJO del formulario, fuera de él (es un hermano en el body),
   así que el flex del body lo acomoda solo en cualquier pantalla. */
body.doodle-dia-radiologia-laboratorio .doodle-rxa-mensaje {
    position: relative;
    z-index: 1;
    margin-top: 2.4rem;
    text-align: center;
    pointer-events: none;
}

body.doodle-dia-radiologia-laboratorio .doodle-rxa-mensaje strong {
    display: block;
    color: #FFFFFF;
    font-size: clamp(1.8rem, 2.6vw, 2.4rem);
}

body.doodle-dia-radiologia-laboratorio .doodle-rxa-mensaje span {
    display: block;
    margin-top: 0.4rem;
    color: #E3D2F5;
    font-size: clamp(1.4rem, 1.8vw, 1.7rem);
}