*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --rojo: #e53935;
    --rojo-dark: #b71c1c;
    --amarillo: #ffeb3b;
    --negro: #0a0a0a;
    --negro2: #111111;
    --blanco: #ffffff;
    --gris: rgba(255,255,255,0.5);
    --bebas: 'Bebas Neue', sans-serif;
    --inter: 'Inter', sans-serif;
}

html, body {
    background: var(--negro);
    color: var(--blanco);
    font-family: var(--inter);
    overflow-x: hidden;
    scroll-behavior: smooth;
}

::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: var(--negro2);
}

::-webkit-scrollbar-thumb {
    background: var(--rojo);
    border-radius: 3px;
}

.mud-typography {
    color: inherit !important;
}

.mud-button-root {
    font-family: 'Montserrat', sans-serif !important;
}

/* ═══ UTILIDADES RESPONSIVAS GLOBALES ═══ */

/* Imágenes y medios fluidos */
img, video, iframe {
    max-width: 100%;
    height: auto;
}

/* Evitar desbordamiento horizontal global */
* {
    min-width: 0;
}

/* Touch targets mínimos para móvil */
@media (max-width: 900px) {
    button, a, [role="button"] {
        min-height: 44px;
    }

    /* Tamaño de fuente base ligeramente mayor en móvil para legibilidad */
    body {
        font-size: 15px;
    }
}

/* Mejora de MudBlazor en pantallas pequeñas */
@media (max-width: 480px) {
    .mud-table-cell {
        padding: 8px !important;
        font-size: 12px !important;
    }

    .mud-dialog {
        margin: 8px !important;
        max-width: calc(100vw - 16px) !important;
    }

    .mud-dialog-content {
        padding: 16px !important;
    }
}