<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/* --- responsive.css (Completo) --- */

/* --- MÃģviles (max-width: 768px) --- */
@media (max-width: 768px) {
    /* -- Tiles --*/
    .tile-container {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap: 0.8rem;
    }
    .tile{
        padding: 1rem;
    }

    .tile i {
        font-size: 2rem;
        margin-bottom: 0.4rem;
    }

    .tile span {
        font-size: 0.9rem;
    }

    /* -- Header -- */
    header h1{
        font-size: 1.8rem;
    }
    header p{
        font-size: 1rem;
    }
    /* -- Preguntas -- */
    .back-button {
        font-size: 0.8rem;
    }

    .pregunta {
        padding: 1rem;
        /* border-left: 3px solid #d9d1c5;  &lt;- Ya no es necesario */
    }
     .preguntas-container {
        padding: 1rem;
    }
    /* -- MenÃš superior -- */
    .user-info {
        flex-direction: column;
        align-items: flex-start;
    }

    .user-info span {
        margin-right: 0;
        margin-bottom: 0.5rem;
    }

    .user-info a {
        display: block;
        width: 100%;
        text-align: center;
        margin-left: 0;
        margin-bottom: 0.3rem;
        box-sizing: border-box;
    }
     /* -- Ranking y Jugadores Activos --*/
      .ranking-tabla th, .ranking-tabla td {
          padding: 5px;
          font-size: 0.9rem;
      }
       .ranking-tabla th:nth-child(4),
      .ranking-tabla td:nth-child(4),
      .ranking-tabla th:nth-child(5),
      .ranking-tabla td:nth-child(5) {
          display: none;
      }

      .podio{
          flex-direction: row;
          width: 95%;
      }
      .segundo-tercer-lugar{
          flex-direction: column;
          width: auto;
      }
     .primer-lugar img {
          width: 75px;
          height: 75px;
          border-width: 3px;
      }
      .otro-lugar img {
          width: 50px;
          height: 50px;
          border-width: 2px;
      }
     .primer-lugar .usuario-info span,
     .otro-lugar .usuario-info span{
          width: 20px;
          height: 20px;
          line-height: 20px;
          font-size: 0.8rem;
      }
     .ranking-tabla td form button{
          padding: 3px 6px;
          font-size: 0.8rem;
      }
       .ranking-tabla th:last-child,
      .ranking-tabla td:last-child {
          display: none;
      }
}

/* --- Tablets (min-width: 769px and max-width: 1024px) --- */
@media (min-width: 769px) and (max-width: 1024px) {
    .tile-container {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        gap: 1rem;
    }
}

/* --- Escritorio Grande (min-width: 1025px) --- */
/*  No necesitas media query, los estilos por defecto ya son para escritorio */</pre></body></html>