/* ------------------------------------------------------------------
   Estilos de la página anfitriona en modo standalone.

   Este archivo es lo ÚNICO que toca html/body y sólo lo carga index.html.
   Cuando Cycling Trivia se inserte en otra página, esta hoja no se carga:
   basta con tokens.css, app.css y scene.css, que viven dentro de
   #cycling-trivia y no se escapan.
   ------------------------------------------------------------------ */

html,
body {
    height: 100%;
}

body {
    margin: 0;
    background: #0E1726;
    color: #F2F4F8;
    font-family: 'Segoe UI Variable Text', 'Segoe UI', Inter, system-ui, sans-serif;
    overflow-x: hidden;
}

/*
   En standalone la aplicación ocupa exactamente la ventana: así el marcador,
   el escenario y el perfil se quedan fijos y sólo se desplaza el panel de la
   pregunta. Un anfitrión que la incruste decide su propia altura aquí.
*/
#cycling-trivia {
    height: 100vh;
    height: 100dvh;
}