/* android.css: lo PROPIO de la pantalla Android (MAQUETA-EIE-SAFE-android.html): lo que no es igual en la maqueta del
   iPhone. El molde común va en eie-producto.css (00-base/pantallas-comun). */
/* ===== producto Android: componentes (solo acomodo; colores FoxUI y de la marca) ===== */
/* ===== pantalla de bloqueo Android (vista previa; colores de la marca EIE SAFE) ===== */
.mq-android-previa { display: flex; justify-content: center; margin: 6px 0 10px; }
.mq-android-previa .pantalla { width: 220px; aspect-ratio: 9 / 18; border-radius: 22px; border: 6px solid #1f2430; background: var(--fox-bg-raised); color: var(--fox-text); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 16px 14px 12px; text-align: center; }
.mq-android-previa .pantalla > span svg { width: 32px; height: 32px; color: var(--mq-verde); }
.mq-android-previa b { font-size: 14px; line-height: 1.3; } .mq-android-previa p { margin: 0; font-size: 12.5px; color: var(--fox-text-secondary); line-height: 1.4; overflow-wrap: anywhere; } .mq-android-previa small { font-size: 12.5px; color: var(--mq-verde); font-weight: 600; }
.mq-android-previa .pie { margin-top: auto; display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; } .mq-android-previa .pie span { display: inline-flex; gap: 4px; align-items: center; font-size: 10.5px; padding: 4px 7px; border-radius: 999px; border: 1px solid var(--fox-border); } .mq-android-previa .pie svg { width: 12px; height: 12px; }
@media (max-width: 640px) { .mq-android-previa .pantalla { width: 180px; } }


/* el QR de inscribir lo dibuja qrcode-generator como SVG (librería común eie-qrcode-v1) */
.mq-qr svg { display: block; width: 240px; height: 240px; }