/* ==========================================================================
   Minds.Training · Capa de componentes
   --------------------------------------------------------------------------
   Esta hoja concentra los componentes reutilizables y sus ajustes finales.
   Se carga después de main.css para mantener una única capa de override
   intencional y evitar seguir acumulando parches al final del CSS base.
   ========================================================================== */

/* ========================================================================== 
   V219 · Sistema unificado de botones contextuales
   CTA tipo píldora con icono interior. Las flechas decorativas desaparecen:
   la acción se comunica mediante un SVG contextual y una etiqueta limpia.
   ========================================================================== */

/* Base visual para acciones textuales. El JS añade .ui-context-btn y el SVG
   apropiado según el texto; estas reglas también modernizan el fallback. */
.btn-volumetrico,
.home-hero-start,
.home-soft-cta,
.cta-secondary,
.shop-admin-sandbox-action,
.admin-action-btn,
.admin-text-button,
.btn-secondary,
.btn-danger,
.account-soft-button,
.account-clean-button,
.invite-copy-btn,
.game-finish-active-btn,
.game-boost-shop-link,
.game-share-btn,
.dashboard-paused-game-resume,
.daily-play-button,
.dashboard-coupon-control button,
.pwa-install-primary,
.pwa-install-secondary,
.demo-hint-btn,
.demo-restart,
.game-demo-login,
.auth-resend-link,
.admin-panel-link,
.hangman-hint-btn,
.wordle-hint-btn,
.sudoku-erase {
    box-sizing:border-box;
}

.ui-context-btn{
    --ui-btn-bg:#fffdf9;
    --ui-btn-bg-hover:#fff8ec;
    --ui-btn-border:rgba(245,158,11,.48);
    --ui-btn-border-hover:rgba(245,158,11,.76);
    --ui-btn-text:#8a4c00;
    --ui-btn-icon-from:#ffb83f;
    --ui-btn-icon-mid:#ff9228;
    --ui-btn-icon-to:#f97316;
    --ui-btn-icon-shadow:rgba(249,115,22,.27);
    position:relative;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:10px!important;
    min-height:48px;
    padding:5px 18px 5px 6px!important;
    border:1px solid var(--ui-btn-border)!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,#fff 0%,var(--ui-btn-bg) 100%)!important;
    color:var(--ui-btn-text)!important;
    text-decoration:none!important;
    font-weight:800!important;
    line-height:1.1!important;
    box-shadow:0 9px 22px rgba(249,115,22,.12),inset 0 1px 0 rgba(255,255,255,.96)!important;
    cursor:pointer;
    overflow:visible;
    isolation:isolate;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease!important;
}

.ui-context-btn__icon{
    position:relative;
    width:36px;
    height:36px;
    flex:0 0 36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    color:#fff;
    background:linear-gradient(145deg,var(--ui-btn-icon-from) 0%,var(--ui-btn-icon-mid) 50%,var(--ui-btn-icon-to) 100%);
    border:1px solid rgba(255,255,255,.74);
    box-shadow:0 6px 14px var(--ui-btn-icon-shadow),inset 0 1px 0 rgba(255,255,255,.76),inset 0 -2px 5px rgba(153,61,0,.12);
    transition:transform .18s ease,box-shadow .18s ease;
}
.ui-context-btn__icon::after{
    content:"";
    position:absolute;
    inset:3px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:inherit;
    pointer-events:none;
}
.ui-context-btn__icon svg{
    display:block;
    width:17px;
    height:17px;
    overflow:visible;
}
.ui-context-btn__icon svg *{
    vector-effect:non-scaling-stroke;
}
.ui-context-btn__label{
    min-width:0;
    white-space:nowrap;
    text-align:center;
}

/* El play necesita una compensación óptica mínima para quedar visualmente
   centrado dentro del círculo, aunque matemáticamente ya lo esté. */
.ui-context-btn[data-ui-icon="play"] .ui-context-btn__icon svg{
    transform:translateX(1px);
}

.ui-context-btn--compact{
    min-height:40px!important;
    gap:8px!important;
    padding:4px 13px 4px 5px!important;
    font-size:10px!important;
}
.ui-context-btn--compact .ui-context-btn__icon{
    width:30px;
    height:30px;
    flex-basis:30px;
}
.ui-context-btn--compact .ui-context-btn__icon svg{
    width:14px;
    height:14px;
}

.ui-context-btn--danger{
    --ui-btn-bg:#fffafa;
    --ui-btn-bg-hover:#fff2f2;
    --ui-btn-border:rgba(220,38,38,.30);
    --ui-btn-border-hover:rgba(220,38,38,.55);
    --ui-btn-text:#a52b2b;
    --ui-btn-icon-from:#ff7b72;
    --ui-btn-icon-mid:#ef4444;
    --ui-btn-icon-to:#c92525;
    --ui-btn-icon-shadow:rgba(220,38,38,.22);
}
.ui-context-btn--success{
    --ui-btn-bg:#fbfffc;
    --ui-btn-bg-hover:#f2fbf5;
    --ui-btn-border:rgba(34,197,94,.26);
    --ui-btn-border-hover:rgba(34,197,94,.48);
    --ui-btn-text:#236f42;
    --ui-btn-icon-from:#66d68c;
    --ui-btn-icon-mid:#36b86b;
    --ui-btn-icon-to:#239653;
    --ui-btn-icon-shadow:rgba(34,197,94,.20);
}
.ui-context-btn--secondary{
    --ui-btn-bg:#fffefa;
    --ui-btn-bg-hover:#fff9ef;
    box-shadow:0 7px 17px rgba(17,19,24,.06),inset 0 1px 0 rgba(255,255,255,.96)!important;
}

@media(hover:hover) and (pointer:fine){
    .ui-context-btn:hover:not(:disabled):not([aria-disabled="true"]){
        transform:translateY(-1px)!important;
        border-color:var(--ui-btn-border-hover)!important;
        background:linear-gradient(180deg,#fff 0%,var(--ui-btn-bg-hover) 100%)!important;
        box-shadow:0 12px 26px rgba(249,115,22,.17),inset 0 1px 0 #fff!important;
    }
    .ui-context-btn--danger:hover:not(:disabled):not([aria-disabled="true"]){
        box-shadow:0 12px 25px rgba(220,38,38,.13),inset 0 1px 0 #fff!important;
    }
    .ui-context-btn--success:hover:not(:disabled):not([aria-disabled="true"]){
        box-shadow:0 12px 25px rgba(34,197,94,.12),inset 0 1px 0 #fff!important;
    }
    .ui-context-btn:hover:not(:disabled):not([aria-disabled="true"]) .ui-context-btn__icon{
        transform:scale(1.04);
        box-shadow:0 8px 17px var(--ui-btn-icon-shadow),inset 0 1px 0 rgba(255,255,255,.8),inset 0 -2px 5px rgba(153,61,0,.12);
    }
    .ui-context-btn[data-ui-icon="play"]:hover:not(:disabled):not([aria-disabled="true"]) .ui-context-btn__icon svg{
        transform:translateX(1px);
    }
}
.ui-context-btn:focus-visible{
    outline:3px solid rgba(245,158,11,.23)!important;
    outline-offset:3px!important;
}
.ui-context-btn--danger:focus-visible{outline-color:rgba(220,38,38,.20)!important}
.ui-context-btn--success:focus-visible{outline-color:rgba(34,197,94,.20)!important}
.ui-context-btn:active:not(:disabled){transform:translateY(0)!important}
.ui-context-btn:disabled,
.ui-context-btn[aria-disabled="true"]{
    --ui-btn-bg:#f4f6f8;
    --ui-btn-border:rgba(17,19,24,.08);
    --ui-btn-text:#9199a4;
    --ui-btn-icon-from:#e4e8ec;
    --ui-btn-icon-mid:#d8dde2;
    --ui-btn-icon-to:#cdd3da;
    --ui-btn-icon-shadow:rgba(17,19,24,.06);
    cursor:not-allowed!important;
    box-shadow:none!important;
    opacity:1!important;
}
.ui-context-btn:disabled .ui-context-btn__icon,
.ui-context-btn[aria-disabled="true"] .ui-context-btn__icon{
    color:#8d96a1;
    border-color:rgba(255,255,255,.8);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}

/* Primarios históricos: misma silueta compacta del nuevo lenguaje visual. */
.btn-volumetrico.ui-context-btn,
.home-hero-start.ui-context-btn,
.home-soft-cta.ui-context-btn,
.daily-play-button.ui-context-btn,
.dashboard-coupon-control button.ui-context-btn{
    min-height:50px;
    font-size:12px!important;
}
.auth-submit.ui-context-btn{
    justify-content:flex-start!important;
}
.btn-small.ui-context-btn{
    min-height:40px!important;
    font-size:10px!important;
}

/* Acciones pequeñas del admin/cuenta mantienen densidad sin perder el icono. */
.admin-action-btn.ui-context-btn,
.admin-text-button.ui-context-btn,
.account-soft-button.ui-context-btn,
.account-clean-button.ui-context-btn,
.invite-copy-btn.ui-context-btn,
.pwa-install-primary.ui-context-btn,
.pwa-install-secondary.ui-context-btn,
.demo-hint-btn.ui-context-btn,
.demo-restart.ui-context-btn,
.auth-resend-link.ui-context-btn{
    min-width:0;
}

/* Quita cualquier flecha decorativa residual de las versiones antiguas. */
.ui-context-btn > span:not(.ui-context-btn__icon):not(.ui-context-btn__label),
.shop-redeem-btn__arrow,
.home-soft-cta-arrow{
    display:none!important;
}

/* Tienda: icono de regalo / laboratorio más limpio y sin flecha final. */
.shop-buy-form .shop-redeem-btn{
    min-width:132px;
    padding-right:17px;
    gap:10px;
}
.shop-buy-form .shop-redeem-btn__icon svg{
    width:16px;
    height:16px;
    overflow:visible;
}
.shop-buy-form .shop-redeem-btn__icon svg *{
    vector-effect:non-scaling-stroke;
}
.shop-buy-form .shop-redeem-btn__arrow{display:none!important}

/* Los botones que ya son controles de navegación, filtros, cierres, teclas o
   casillas de juego se mantienen intactos: son controles, no CTA textuales. */
@media(max-width:520px){
    .ui-context-btn{
        min-height:46px;
        padding:5px 15px 5px 6px!important;
        gap:9px!important;
    }
    .ui-context-btn__icon{
        width:34px;
        height:34px;
        flex-basis:34px;
    }
    .ui-context-btn__icon svg{width:16px;height:16px}
    .ui-context-btn--compact{
        min-height:39px!important;
        padding:4px 12px 4px 5px!important;
    }
    .ui-context-btn--compact .ui-context-btn__icon{
        width:29px;
        height:29px;
        flex-basis:29px;
    }
    .ui-context-btn__label{white-space:normal}
}

@media(prefers-reduced-motion:reduce){
    .ui-context-btn,
    .ui-context-btn__icon{transition:none!important}
}

/* Refuerzo de especificidad: algunas vistas antiguas tienen selectores por
   ruta (p. ej. .route-home ...) y no deben recuperar el estilo anterior. */
body .ui-context-btn.ui-context-btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:10px!important;
    padding:5px 18px 5px 6px!important;
    border:1px solid var(--ui-btn-border)!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,#fff 0%,var(--ui-btn-bg) 100%)!important;
    color:var(--ui-btn-text)!important;
    text-decoration:none!important;
    box-shadow:0 9px 22px rgba(249,115,22,.12),inset 0 1px 0 rgba(255,255,255,.96)!important;
}
body .ui-context-btn.ui-context-btn.ui-context-btn--compact{
    gap:8px!important;
    padding:4px 13px 4px 5px!important;
}
@media(hover:hover) and (pointer:fine){
    body .ui-context-btn.ui-context-btn:hover:not(:disabled):not([aria-disabled="true"]){
        transform:translateY(-1px)!important;
        border-color:var(--ui-btn-border-hover)!important;
        background:linear-gradient(180deg,#fff 0%,var(--ui-btn-bg-hover) 100%)!important;
        color:var(--ui-btn-text)!important;
        box-shadow:0 12px 26px rgba(249,115,22,.17),inset 0 1px 0 #fff!important;
    }
}
@media(max-width:520px){
    body .ui-context-btn.ui-context-btn{padding:5px 15px 5px 6px!important}
    body .ui-context-btn.ui-context-btn.ui-context-btn--compact{padding:4px 12px 4px 5px!important}
}

/* V220 · Ajustes finos de CTAs: logout neutro, play único y SVG limpio */
.route-home .home-hero-start-icon svg{
    width:15px;
    height:15px;
    display:block;
    overflow:visible;
    transform:translateX(.6px);
    filter:drop-shadow(0 1px 1px rgba(121,48,0,.14));
}
@media(max-width:520px){
    .route-home .home-hero-start-icon svg{width:14px;height:14px}
}


/* ========================================================================== 
   V221 · Refinado de CTA del panel
   - Invitaciones: texto e iconos con contraste alto, sin apariencia desactivada.
   - Partidas guardadas: evita cualquier play legado duplicado.
   - Reto diario: la píldora se ajusta al contenido en lugar de estirarse.
   ========================================================================== */
.dashboard-section-dark .invite-copy-btn.ui-context-btn,
body .dashboard-section-dark .invite-copy-btn.ui-context-btn{
    --ui-btn-text:#8a4c00;
    --ui-btn-bg:#fffdf9;
    --ui-btn-bg-hover:#fff7e9;
    --ui-btn-border:rgba(245,158,11,.56);
    --ui-btn-border-hover:rgba(245,158,11,.82);
    color:#8a4c00!important;
    background:linear-gradient(180deg,#fff 0%,#fffaf1 100%)!important;
    border-color:rgba(245,158,11,.56)!important;
    opacity:1!important;
    font-size:10.5px!important;
    text-shadow:none!important;
}
.dashboard-section-dark .invite-copy-btn.ui-context-btn .ui-context-btn__label{
    color:#8a4c00!important;
    opacity:1!important;
}
.dashboard-section-dark .invite-copy-btn.ui-context-btn .ui-context-btn__icon{
    color:#fff!important;
    opacity:1!important;
    filter:none!important;
}
.dashboard-section-dark .invite-copy-btn.ui-context-btn.is-copied{
    --ui-btn-text:#236f42;
    --ui-btn-bg:#fbfffc;
    --ui-btn-border:rgba(34,197,94,.32);
    color:#236f42!important;
}
.dashboard-section-dark .invite-copy-btn.ui-context-btn.is-copied .ui-context-btn__label{
    color:#236f42!important;
}

/* El enlace ya contiene un único SVG generado por el sistema contextual. */
.dashboard-paused-game-resume.ui-context-btn .dashboard-paused-game-resume-icon,
.dashboard-paused-game-resume.ui-context-btn > span[aria-hidden="true"]:not(.ui-context-btn__icon){
    display:none!important;
}

/* Reto diario: CTA principal ancho, más visual y con el texto centrado de verdad. */
.daily-game-card .daily-play-button.ui-context-btn,
body .daily-game-card .daily-play-button.ui-context-btn{
    --ui-btn-border:rgba(255,179,52,.30);
    --ui-btn-border-hover:rgba(255,205,116,.48);
    position:relative!important;
    align-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    min-height:66px!important;
    margin-top:20px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:8px 64px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,182,58,.34)!important;
    border-radius:18px!important;
    background:
        radial-gradient(circle at 8% 25%,rgba(255,255,255,.30),transparent 24%),
        linear-gradient(115deg,#ffc34e 0%,#ff9c2a 48%,#ff7518 100%)!important;
    color:#fff!important;
    font-size:15px!important;
    font-weight:850!important;
    letter-spacing:.005em!important;
    text-shadow:0 1px 1px rgba(112,48,0,.16)!important;
    box-shadow:
        0 18px 34px rgba(249,115,22,.24),
        0 7px 18px rgba(255,174,44,.16),
        inset 0 1px 0 rgba(255,255,255,.48),
        inset 0 -1px 0 rgba(174,66,0,.08)!important;
}
.daily-game-card .daily-play-button.ui-context-btn::before{
    content:"";
    position:absolute;
    z-index:0;
    inset:1px;
    border-radius:16px;
    background:linear-gradient(180deg,rgba(255,255,255,.20),rgba(255,255,255,0) 42%);
    pointer-events:none;
}
.daily-game-card .daily-play-button.ui-context-btn::after{
    content:"";
    position:absolute;
    z-index:0;
    top:-55%;
    left:-20%;
    width:34%;
    height:210%;
    transform:rotate(18deg);
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);
    pointer-events:none;
    opacity:.72;
}
.daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__icon{
    position:absolute!important;
    z-index:1;
    left:9px;
    top:50%;
    transform:translateY(-50%)!important;
    width:48px;
    height:48px;
    flex:0 0 48px;
    color:#fff!important;
    background:linear-gradient(145deg,rgba(255,255,255,.25) 0%,rgba(255,255,255,.09) 100%)!important;
    border:1px solid rgba(255,255,255,.58)!important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.38),
        inset 0 -2px 7px rgba(173,64,0,.09),
        0 9px 20px rgba(158,61,0,.18)!important;
    backdrop-filter:blur(3px);
}
.daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__icon::after{
    inset:4px;
    border-color:rgba(255,255,255,.26);
}
.daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__icon svg{
    width:21px;
    height:21px;
    transform:none!important;
}
.daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__icon svg *{
    stroke:#fff;
    stroke-width:1.9;
}
.daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__label{
    position:relative;
    z-index:1;
    width:100%;
    min-width:0;
    white-space:nowrap!important;
    color:#fff!important;
    text-align:center!important;
    font-size:15px!important;
    line-height:1!important;
}
@media(hover:hover) and (pointer:fine){
    .daily-game-card .daily-play-button.ui-context-btn:hover:not(:disabled):not([aria-disabled="true"]),
    body .daily-game-card .daily-play-button.ui-context-btn:hover:not(:disabled):not([aria-disabled="true"]){
        transform:translateY(-2px)!important;
        border-color:rgba(255,221,153,.52)!important;
        background:
            radial-gradient(circle at 8% 25%,rgba(255,255,255,.34),transparent 25%),
            linear-gradient(115deg,#ffca5d 0%,#ffa434 48%,#ff7d20 100%)!important;
        box-shadow:
            0 22px 38px rgba(249,115,22,.27),
            0 10px 20px rgba(255,174,44,.18),
            inset 0 1px 0 rgba(255,255,255,.52)!important;
    }
    .daily-game-card .daily-play-button.ui-context-btn:hover:not(:disabled):not([aria-disabled="true"]) .ui-context-btn__icon,
    body .daily-game-card .daily-play-button.ui-context-btn:hover:not(:disabled):not([aria-disabled="true"]) .ui-context-btn__icon{
        transform:translateY(-50%) scale(1.035)!important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.42),
            0 11px 22px rgba(158,61,0,.22)!important;
    }
}

@media(max-width:520px){
    .dashboard-section-dark .invite-copy-btn.ui-context-btn,
    body .dashboard-section-dark .invite-copy-btn.ui-context-btn{
        font-size:10px!important;
    }
    .daily-game-card .daily-play-button.ui-context-btn,
    body .daily-game-card .daily-play-button.ui-context-btn{
        min-height:60px!important;
        padding:7px 54px!important;
        border-radius:17px!important;
    }
    .daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__icon{
        left:8px;
        width:44px;
        height:44px;
        flex-basis:44px;
    }
    .daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__icon svg{
        width:19px;
        height:19px;
    }
    .daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__label{
        font-size:14px!important;
    }
}

/* ========================================================================== 
   V222 · Panel — acciones de sesión, invitaciones e historial MC
   ========================================================================== */

/* Cerrar sesión vuelve a ser un CTA real y comparte proporciones con
   Administración, sin recuperar el antiguo enlace gris. */
.dashboard-logout .dashboard-logout-button.ui-context-btn,
body .dashboard-logout .dashboard-logout-button.ui-context-btn{
    min-height:46px!important;
    padding:5px 17px 5px 6px!important;
    font-size:11px!important;
}
.dashboard-logout .dashboard-logout-button.ui-context-btn .ui-context-btn__icon{
    width:34px;
    height:34px;
    flex-basis:34px;
}
.dashboard-logout .dashboard-logout-button.ui-context-btn .ui-context-btn__icon svg{
    width:16px;
    height:16px;
}

/* Invitaciones: son acciones de texto, no píldoras. Conservan semántica de
   button para copiar al portapapeles, pero visualmente solo muestran SVG + texto. */
.dashboard-invite-tools .invite-copy-action{
    appearance:none;
    -webkit-appearance:none;
    justify-self:start;
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-width:0;
    min-height:30px;
    padding:4px 2px;
    border:0;
    border-radius:6px;
    background:transparent;
    color:#f7a326;
    font:800 10.5px/1.1 var(--font-display);
    cursor:pointer;
    text-decoration:none;
    box-shadow:none;
    transition:color .18s ease,transform .18s ease,opacity .18s ease;
}
.dashboard-invite-tools .invite-copy-action__icon{
    width:18px;
    height:18px;
    flex:0 0 18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:inherit;
}
.dashboard-invite-tools .invite-copy-action__icon svg{
    display:block;
    width:18px;
    height:18px;
    overflow:visible;
}
.dashboard-invite-tools .invite-copy-action__icon svg *{
    vector-effect:non-scaling-stroke;
}
.dashboard-invite-tools .invite-copy-action__label{
    color:inherit;
    white-space:nowrap;
}
.dashboard-section-dark .invite-copy-action,
.dashboard-section-dark .invite-copy-action span{
    color:#ffad32!important;
}
.dashboard-invite-tools .invite-copy-action:focus-visible{
    outline:2px solid rgba(255,173,50,.45);
    outline-offset:3px;
}
@media(hover:hover) and (pointer:fine){
    .dashboard-invite-tools .invite-copy-action:hover{
        color:#ffc05a;
        transform:translateY(-1px);
    }
    .dashboard-section-dark .invite-copy-action:hover,
    .dashboard-section-dark .invite-copy-action:hover span{
        color:#ffc05a!important;
    }
}
.dashboard-invite-tools .invite-copy-action.is-copied,
.dashboard-invite-tools .invite-copy-action.is-copied span{
    color:#ffbd54!important;
}

/* Historial MC: los símbolos +/− se sustituyen por pictogramas contextuales.
   La especificidad evita que el tema oscuro apague el SVG. */
.mc-movement-kind{
    width:32px;
    height:32px;
    flex:0 0 32px;
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#fff!important;
    background:linear-gradient(145deg,#ffb33c,#f27b19);
    border:1px solid rgba(255,255,255,.16);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 5px 12px rgba(0,0,0,.12);
}
.mc-movement-kind svg{
    display:block;
    width:18px;
    height:18px;
    overflow:visible;
    color:inherit!important;
}
.mc-movement-kind svg *{vector-effect:non-scaling-stroke}
.dashboard-section-dark .mc-movement-kind,
.dashboard-section-dark .mc-movement-kind svg,
.dashboard-section-dark .mc-movement-kind svg *{
    color:#fff!important;
}
.mc-movement-kind.mc-kind--ranking{background:linear-gradient(145deg,#f6c34b,#d99312)}
.mc-movement-kind.mc-kind--partida{background:linear-gradient(145deg,#ffad38,#f47718)}
.mc-movement-kind.mc-kind--cupon{background:linear-gradient(145deg,#a98af5,#7555d9)}
.mc-movement-kind.mc-kind--referido{background:linear-gradient(145deg,#59cdb7,#2d9b88)}
.mc-movement-kind.mc-kind--regalo{background:linear-gradient(145deg,#f17da3,#d94d7b)}
.mc-movement-kind.mc-kind--racha{background:linear-gradient(145deg,#69b7f1,#3f7fc9)}
.mc-movement-kind.mc-kind--tienda,
.mc-movement-kind.mc-kind--gasto{background:linear-gradient(145deg,#e47f72,#b94d45)}
.mc-movement-kind.mc-kind--mc{background:linear-gradient(145deg,#ffbd49,#e88d13)}
.dashboard-mc-history-table td:nth-child(2){gap:11px}

@media(max-width:700px){
    .dashboard-invite-tools{grid-template-columns:max-content max-content;column-gap:18px;row-gap:5px}
    .dashboard-invite-tools .invite-code-box{width:100%}
    .dashboard-invite-tools .invite-copy-action{font-size:10px}
}
@media(max-width:430px){
    .dashboard-invite-tools{grid-template-columns:1fr}
    .dashboard-invite-tools .invite-copy-action{grid-column:1}
    .dashboard-invite-tools .invite-total{grid-column:1}
}


/* ========================================================================== 
   V223 · Refinado visual — nivel, canje y CTAs de autenticación/sesión
   ========================================================================== */

/* Tienda: la píldora de nivel deja de parecer un aviso verde pesado. Separa
   el nivel del beneficio y usa un verde únicamente como señal de estado. */
.shop-status-pill{
    display:inline-flex!important;
    align-items:center!important;
    gap:7px!important;
    margin-top:24px!important;
    padding:9px 13px!important;
    border:1px solid rgba(34,197,94,.18)!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,252,249,.96))!important;
    color:#46534b!important;
    font:500 10.5px/1.2 var(--font-display)!important;
    letter-spacing:0!important;
    box-shadow:0 8px 20px rgba(17,19,24,.025),inset 0 1px 0 rgba(255,255,255,.95)!important;
}
.shop-status-pill .status-dot{
    width:8px!important;
    height:8px!important;
    flex:0 0 8px!important;
    background:#2fc66d!important;
    box-shadow:0 0 0 5px rgba(47,198,109,.10)!important;
}
.shop-status-pill__level{
    color:#46534b;
    font-weight:700;
}
.shop-status-pill__sep{
    color:#a2aea6;
    font-weight:500;
}
.shop-status-pill__benefit{
    color:#69756e;
    font-weight:500;
}
.shop-level-next{
    color:#776e61!important;
    font-weight:500!important;
}

/* Tienda: centra realmente el conjunto icono + etiqueta dentro del botón.
   El padding es simétrico para evitar el desplazamiento óptico a la izquierda. */
.shop-buy-form .shop-redeem-btn{
    justify-content:center!important;
    gap:9px!important;
    padding-left:10px!important;
    padding-right:10px!important;
}
.shop-buy-form .shop-redeem-btn__icon,
.shop-buy-form .shop-redeem-btn__label{
    margin:0!important;
}

/* Cierre de sesión y autenticación: el CTA ocupa solo lo que necesita el
   contenido. Se elimina el min-width histórico de 220px y el width:100% de
   auth-submit. El contenido queda centrado con padding equilibrado. */
.logout-form .btn-volumetrico.ui-context-btn,
.logout-actions .btn-volumetrico.ui-context-btn,
.auth-card .auth-submit.ui-context-btn{
    width:max-content!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:48px!important;
    justify-content:center!important;
    gap:10px!important;
    padding:5px 13px 5px 7px!important;
    font-size:12.5px!important;
    line-height:1!important;
}
.auth-card .auth-submit.ui-context-btn{
    display:inline-flex!important;
    margin-top:4px!important;
}
.logout-form .btn-volumetrico.ui-context-btn .ui-context-btn__icon,
.logout-actions .btn-volumetrico.ui-context-btn .ui-context-btn__icon,
.auth-card .auth-submit.ui-context-btn .ui-context-btn__icon{
    width:36px!important;
    height:36px!important;
    flex:0 0 36px!important;
}
.logout-form .btn-volumetrico.ui-context-btn .ui-context-btn__label,
.logout-actions .btn-volumetrico.ui-context-btn .ui-context-btn__label,
.auth-card .auth-submit.ui-context-btn .ui-context-btn__label{
    margin:0!important;
    white-space:nowrap!important;
}

/* Los glifos de entrar/salir tienen peso visual asimétrico. Esta corrección
   óptica mínima los coloca en el centro aparente del círculo. */
.ui-context-btn[data-ui-icon="login"] .ui-context-btn__icon svg,
.ui-context-btn[data-ui-icon="logout"] .ui-context-btn__icon svg{
    transform:translateX(.65px);
}
@media(hover:hover) and (pointer:fine){
    .ui-context-btn[data-ui-icon="login"]:hover:not(:disabled):not([aria-disabled="true"]) .ui-context-btn__icon svg,
    .ui-context-btn[data-ui-icon="logout"]:hover:not(:disabled):not([aria-disabled="true"]) .ui-context-btn__icon svg{
        transform:translateX(.65px);
    }
}

@media(max-width:520px){
    .shop-status-pill{
        white-space:normal!important;
        flex-wrap:wrap!important;
        border-radius:18px!important;
    }
    .logout-form .btn-volumetrico.ui-context-btn,
    .logout-actions .btn-volumetrico.ui-context-btn,
    .auth-card .auth-submit.ui-context-btn{
        width:max-content!important;
        min-height:46px!important;
        padding:5px 12px 5px 6px!important;
        font-size:12px!important;
    }
}

/* V216 · Historial MC: paginación AJAX sin recarga completa. */
.dashboard-mc-history.is-loading .dashboard-mc-history-table-wrap {
    opacity: .56;
    transition: opacity .16s ease;
}
.dashboard-mc-history.is-loading .dashboard-mc-history-pagination {
    pointer-events: none;
}
.dashboard-mc-history.is-loading .mc-history-page-btn {
    opacity: .62;
}

/* ========================================================================== 
   V225 · Reto diario — tarjeta más expresiva y con mejor ocupación visual
   ========================================================================== */
.daily-game-card{
    min-height:0!important;
    padding:22px!important;
    border-radius:28px!important;
    background:
        radial-gradient(circle at 92% 8%,rgba(255,190,67,.16),transparent 29%),
        linear-gradient(155deg,#fff 0%,#fffdfa 58%,#fff8ea 100%)!important;
    border-color:rgba(202,159,72,.16)!important;
    box-shadow:0 22px 48px rgba(37,30,18,.075),inset 0 1px 0 rgba(255,255,255,.9)!important;
    overflow:hidden;
}
.daily-game-card::before{
    content:"";
    position:absolute;
    width:130px;
    height:130px;
    right:-48px;
    top:-54px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(255,173,39,.18),rgba(255,173,39,0) 70%);
    pointer-events:none;
}
.daily-game-card-top{
    position:relative;
    z-index:1;
    align-items:center!important;
    font-size:9px!important;
}
.daily-game-today{
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#747e8c;
}
.daily-game-today i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#22c55e;
    box-shadow:0 0 0 5px rgba(34,197,94,.10);
}
.daily-game-category{
    display:inline-flex;
    align-items:center;
    min-height:26px;
    padding:0 9px;
    border:1px solid rgba(245,158,11,.13);
    border-radius:999px;
    background:rgba(255,248,229,.82);
    color:#9a650d!important;
}
.daily-game-hero{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:92px minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin-top:25px;
    padding:0 2px;
}
.daily-game-icon{
    width:92px!important;
    height:92px!important;
    margin:0!important;
    border-radius:27px!important;
    background:linear-gradient(145deg,#fff7dc,#ffe39a)!important;
    box-shadow:0 14px 28px rgba(203,145,30,.13),inset 0 1px 0 rgba(255,255,255,.95)!important;
}
.daily-game-icon .emoji-3d{
    font-size:48px!important;
    filter:drop-shadow(0 6px 6px rgba(39,45,58,.14));
}
.daily-game-copy{
    min-width:0;
    margin:0!important;
}
.daily-game-copy small{
    display:block;
    margin-bottom:7px;
    color:#9ca5b3!important;
    font-size:9px!important;
    letter-spacing:.12em!important;
}
.daily-game-copy h3{
    margin:0!important;
    font-size:30px!important;
    line-height:1!important;
    letter-spacing:-.035em;
}
.daily-game-copy p{
    margin-top:8px!important;
    color:#788391!important;
    font-size:11px!important;
    line-height:1.45!important;
}
.daily-game-perks{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:22px;
    overflow:hidden;
    border:1px solid rgba(17,19,24,.07);
    border-radius:17px;
    background:rgba(255,255,255,.72);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.88);
}
.daily-game-perks>div{
    min-width:0;
    padding:12px 10px 11px;
    text-align:center;
}
.daily-game-perks>div+div{
    border-left:1px solid rgba(17,19,24,.065);
}
.daily-game-perks span{
    display:block;
    color:#a0a8b4;
    font:700 7.5px var(--font-display);
    letter-spacing:.105em;
}
.daily-game-perks strong{
    display:block;
    margin-top:4px;
    color:#25282e;
    font:800 11px var(--font-display);
    white-space:nowrap;
}
.daily-game-card .daily-play-button.ui-context-btn,
body .daily-game-card .daily-play-button.ui-context-btn{
    margin-top:18px!important;
}
.daily-game-card .completed-state{
    margin-top:18px!important;
}

@media(max-width:520px){
    .daily-game-card{padding:18px!important;border-radius:24px!important}
    .daily-game-hero{grid-template-columns:76px minmax(0,1fr);gap:14px;margin-top:20px}
    .daily-game-icon{width:76px!important;height:76px!important;border-radius:23px!important}
    .daily-game-icon .emoji-3d{font-size:40px!important}
    .daily-game-copy h3{font-size:26px!important}
    .daily-game-perks{margin-top:18px;border-radius:15px}
    .daily-game-perks>div{padding:10px 5px}
    .daily-game-perks span{font-size:6.8px}
    .daily-game-perks strong{font-size:9.5px}
}

/* ========================================================================== 
   V225 · Reto diario — perks con icono/color + CTA algo más compacto
   ========================================================================== */
.daily-game-card .daily-game-perks{
    display:flex!important;
    grid-template-columns:none!important;
    gap:8px!important;
    margin-top:20px!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
}
.daily-game-card .daily-game-perks>div,
.daily-game-card .daily-game-perks>div+div{
    border:0!important;
}
.daily-game-card .daily-game-perk{
    min-width:0!important;
    flex:1 1 0;
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    padding:9px 10px!important;
    border:1px solid rgba(17,19,24,.065)!important;
    border-radius:14px!important;
    text-align:left!important;
    box-shadow:0 7px 18px rgba(17,19,24,.035),inset 0 1px 0 rgba(255,255,255,.86)!important;
}
.daily-game-perk--lives{
    background:linear-gradient(135deg,rgba(255,245,248,.96),rgba(255,250,252,.90))!important;
    border-color:rgba(244,114,143,.16)!important;
}
.daily-game-perk--bonus{
    background:linear-gradient(135deg,rgba(255,249,231,.98),rgba(255,253,245,.92))!important;
    border-color:rgba(245,158,11,.17)!important;
}
.daily-game-perk--frequency{
    background:linear-gradient(135deg,rgba(243,248,255,.98),rgba(249,251,255,.94))!important;
    border-color:rgba(76,130,220,.14)!important;
}
.daily-game-perk__icon{
    width:30px;
    height:30px;
    flex:0 0 30px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 5px 12px rgba(17,19,24,.055);
}
.daily-game-perk__icon svg{
    display:block;
    width:15px;
    height:15px;
}
.daily-game-perk--lives .daily-game-perk__icon{
    color:#e94d78;
    background:linear-gradient(145deg,#ffe4ec,#fff2f6);
}
.daily-game-perk--bonus .daily-game-perk__icon{
    color:#e89108;
    background:linear-gradient(145deg,#ffedbd,#fff7df);
}
.daily-game-perk--frequency .daily-game-perk__icon{
    color:#4f79cf;
    background:linear-gradient(145deg,#e4edff,#f2f6ff);
}
.daily-game-card .daily-game-perk__copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:2px;
}
.daily-game-card .daily-game-perk__copy small{
    display:block!important;
    margin:0!important;
    color:#9aa3b0!important;
    font:700 6.8px var(--font-display)!important;
    letter-spacing:.10em!important;
    line-height:1.1!important;
}
.daily-game-card .daily-game-perk__copy strong{
    display:block!important;
    margin:0!important;
    color:#2a2e34!important;
    font:800 10.5px var(--font-display)!important;
    line-height:1.1!important;
    white-space:nowrap!important;
}
.daily-game-card .daily-play-button.ui-context-btn,
body .daily-game-card .daily-play-button.ui-context-btn{
    min-height:58px!important;
    margin-top:16px!important;
    padding:7px 58px!important;
    border-radius:17px!important;
}
.daily-game-card .daily-play-button.ui-context-btn::before{
    border-radius:15px!important;
}
.daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__icon{
    left:8px!important;
    width:42px!important;
    height:42px!important;
    flex-basis:42px!important;
}
.daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__icon svg{
    width:18px!important;
    height:18px!important;
}
.daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__label{
    font-size:14px!important;
}

@media(max-width:520px){
    .daily-game-card .daily-game-perks{
        gap:6px!important;
    }
    .daily-game-card .daily-game-perk{
        gap:6px!important;
        padding:8px 7px!important;
        border-radius:12px!important;
    }
    .daily-game-perk__icon{
        width:26px;
        height:26px;
        flex-basis:26px;
        border-radius:9px;
    }
    .daily-game-perk__icon svg{width:13px;height:13px}
    .daily-game-card .daily-game-perk__copy small{font-size:5.8px!important}
    .daily-game-card .daily-game-perk__copy strong{font-size:8.8px!important}
    .daily-game-card .daily-play-button.ui-context-btn,
    body .daily-game-card .daily-play-button.ui-context-btn{
        min-height:54px!important;
        padding:6px 50px!important;
    }
    .daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__icon{
        width:40px!important;
        height:40px!important;
        flex-basis:40px!important;
    }
    .daily-game-card .daily-play-button.ui-context-btn .ui-context-btn__label{
        font-size:13.5px!important;
    }
}


/* ========================================================================== 
   V227 · Ajustes visuales del reto diario
   - Perks con iconos mejor centrados
   - Píldoras informativas izquierdas rediseñadas
   ========================================================================== */
.daily-challenge-copy .daily-rule-row{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    flex-wrap:wrap!important;
    margin-top:28px!important;
}
.daily-challenge-copy .daily-rule-pill{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    min-height:42px!important;
    padding:8px 15px 8px 11px!important;
    border:1px solid rgba(17,19,24,.06)!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,247,244,.96))!important;
    box-shadow:0 8px 18px rgba(17,19,24,.04), inset 0 1px 0 rgba(255,255,255,.9)!important;
    color:#4c5562!important;
}
.daily-challenge-copy .daily-rule-pill i{
    width:24px;
    height:24px;
    flex:0 0 24px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 4px 10px rgba(17,19,24,.05);
}
.daily-challenge-copy .daily-rule-pill i svg{
    display:block;
    width:12px;
    height:12px;
    overflow:visible;
}
.daily-challenge-copy .daily-rule-pill i svg *{
    vector-effect:non-scaling-stroke;
}
.daily-challenge-copy .daily-rule-pill b{
    color:#374151!important;
    font:800 12px/1 var(--font-display)!important;
    letter-spacing:-.01em!important;
}
.daily-challenge-copy .daily-rule-pill--free{
    background:linear-gradient(180deg,#ffffff 0%,#f7fbf8 100%)!important;
    border-color:rgba(34,197,94,.16)!important;
}
.daily-challenge-copy .daily-rule-pill--free i{
    color:#1f9f57;
    background:linear-gradient(145deg,#dcfce7,#f3fff7);
}
.daily-challenge-copy .daily-rule-pill--bonus{
    background:linear-gradient(180deg,#fffef9 0%,#fff8ea 100%)!important;
    border-color:rgba(245,158,11,.16)!important;
}
.daily-challenge-copy .daily-rule-pill--bonus i{
    color:#df8b05;
    background:linear-gradient(145deg,#fff0c3,#fff8e1);
}
.daily-challenge-copy .daily-rule-pill--daily{
    background:linear-gradient(180deg,#fbfcff 0%,#f2f6ff 100%)!important;
    border-color:rgba(76,130,220,.15)!important;
}
.daily-challenge-copy .daily-rule-pill--daily i{
    color:#416ecc;
    background:linear-gradient(145deg,#e6eeff,#f4f7ff);
}

.daily-game-card .daily-game-perk{
    min-height:58px!important;
    align-items:center!important;
}
.daily-game-card .daily-game-perk__icon{
    width:34px!important;
    height:34px!important;
    flex:0 0 34px!important;
    border-radius:11px!important;
}
.daily-game-card .daily-game-perk__icon svg{
    width:16px!important;
    height:16px!important;
    overflow:visible;
}
.daily-game-card .daily-game-perk--lives .daily-game-perk__icon svg{
    transform:translateY(.5px);
}
.daily-game-card .daily-game-perk--bonus .daily-game-perk__icon svg{
    transform:translate(.3px,.3px);
}
.daily-game-card .daily-game-perk--frequency .daily-game-perk__icon svg{
    transform:translateY(.4px);
}
.daily-game-card .daily-game-perk__copy{
    justify-content:center;
}

@media(max-width:520px){
    .daily-challenge-copy .daily-rule-row{
        gap:8px!important;
    }
    .daily-challenge-copy .daily-rule-pill{
        min-height:38px!important;
        padding:7px 12px 7px 9px!important;
        gap:7px!important;
    }
    .daily-challenge-copy .daily-rule-pill i{
        width:22px;
        height:22px;
        flex-basis:22px;
    }
    .daily-challenge-copy .daily-rule-pill i svg{
        width:11px;
        height:11px;
    }
    .daily-challenge-copy .daily-rule-pill b{
        font-size:11px!important;
    }
    .daily-game-card .daily-game-perk{
        min-height:54px!important;
    }
    .daily-game-card .daily-game-perk__icon{
        width:30px!important;
        height:30px!important;
        flex-basis:30px!important;
    }
    .daily-game-card .daily-game-perk__icon svg{
        width:14px!important;
        height:14px!important;
    }
}

/* ========================================================================== 
   V228 · Corrección definitiva del centrado de iconos del reto diario
   Evita que las reglas antiguas de .daily-game-perks span anulen el flex del
   contenedor del SVG. El centrado se fuerza en los tres ejes visuales.
   ========================================================================== */
.daily-game-card .daily-game-perks .daily-game-perk__icon{
    box-sizing:border-box!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    place-items:center!important;
    padding:0!important;
    margin:0!important;
    line-height:0!important;
    text-align:center!important;
    letter-spacing:0!important;
    font-size:0!important;
    vertical-align:middle!important;
}
.daily-game-card .daily-game-perks .daily-game-perk__icon svg{
    position:static!important;
    display:block!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    transform-origin:50% 50%!important;
}
.daily-game-card .daily-game-perks .daily-game-perk--lives .daily-game-perk__icon svg,
.daily-game-card .daily-game-perks .daily-game-perk--bonus .daily-game-perk__icon svg,
.daily-game-card .daily-game-perks .daily-game-perk--frequency .daily-game-perk__icon svg{
    transform:none!important;
}
.daily-game-card .daily-game-perks .daily-game-perk__copy{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:flex-start!important;
    align-self:center!important;
    margin:0!important;
    padding:0!important;
    line-height:1!important;
}
.daily-game-card .daily-game-perks .daily-game-perk__copy small,
.daily-game-card .daily-game-perks .daily-game-perk__copy strong{
    width:auto!important;
    margin-left:0!important;
    margin-right:0!important;
    text-align:left!important;
}

/* ========================================================================== 
   Tienda · feedback y transición de canje AJAX
   ========================================================================== */
.shop-live-feedback{
    position:sticky;
    top:86px;
    z-index:30;
    width:min(620px,calc(100% - 24px));
    margin:0 auto 18px;
    padding:12px 16px;
    border:1px solid rgba(17,19,24,.08);
    border-radius:14px;
    background:rgba(255,255,255,.94);
    color:#4b5563;
    font-size:12px;
    font-weight:700;
    line-height:1.45;
    text-align:center;
    box-shadow:0 14px 32px rgba(17,19,24,.09);
    backdrop-filter:blur(12px);
    transition:opacity .18s ease,transform .18s ease;
}
.shop-live-feedback[hidden]{display:none!important}
.shop-live-feedback.is-success{
    border-color:rgba(34,197,94,.18);
    background:rgba(247,255,249,.96);
    color:#287247;
}
.shop-live-feedback.is-error{
    border-color:rgba(220,38,38,.16);
    background:rgba(255,249,249,.97);
    color:#a33a3a;
}
.shop-live-feedback.is-leaving{opacity:0;transform:translateY(-4px)}
.shop-product.is-purchasing{
    opacity:.74;
    pointer-events:none;
}
.shop-product.is-purchasing .shop-redeem-btn__icon{
    animation:shop-redeem-pulse .8s ease-in-out infinite alternate;
}
.shop-product.is-shop-updated{
    animation:shop-card-updated .5s ease both;
}
@keyframes shop-redeem-pulse{
    from{transform:scale(.94);opacity:.78}
    to{transform:scale(1.02);opacity:1}
}
@keyframes shop-card-updated{
    0%{box-shadow:0 18px 42px rgba(17,19,24,.06)}
    45%{box-shadow:0 20px 46px rgba(249,115,22,.16)}
    100%{box-shadow:0 18px 42px rgba(17,19,24,.06)}
}
@media(prefers-reduced-motion:reduce){
    .shop-product.is-purchasing .shop-redeem-btn__icon,
    .shop-product.is-shop-updated{animation:none!important}
}


/* ========================================================================== 
   V229 · QA final responsive + accesibilidad
   Comprobado para 320 / 375 / 430 / 768 / 1024 / 1440 / 1920 px.
   ========================================================================== */

/* El texto deshabilitado sigue comunicando claramente el estado sin parecer
   contenido inexistente. Mantiene contraste suficiente sobre la superficie gris. */
.ui-context-btn:disabled,
.ui-context-btn[aria-disabled="true"]{
    --ui-btn-text:#65707e;
}
.ui-context-btn:disabled .ui-context-btn__icon,
.ui-context-btn[aria-disabled="true"] .ui-context-btn__icon{
    color:#65707e;
}

/* Textos largos: nunca deben ampliar el viewport ni cortar palabras críticas. */
.ui-context-btn__label,
.shop-redeem-btn__label,
.mobile-session-copy,
.account-card,
.shop-product-copy,
.ranking-row-user,
.notification-copy{
    min-width:0;
    overflow-wrap:anywhere;
}


/* Microtexto funcional del reto diario: mantiene el estilo secundario, pero
   con contraste legible en el modo normal. */
.daily-game-copy small,
.daily-game-copy p,
.daily-game-card .daily-game-perk__copy small{
    color:#66717f!important;
}
.daily-game-card .daily-game-perk__copy small{
    font-size:8px!important;
    letter-spacing:.07em!important;
}

/* Regiones con scroll horizontal: visibles al teclado y con un foco coherente. */
.admin-table-wrap[role="region"],
.dashboard-mc-history-table-wrap[role="region"]{
    outline:none;
    scroll-behavior:smooth;
    scrollbar-gutter:stable;
}
.admin-table-wrap[role="region"]:focus-visible,
.dashboard-mc-history-table-wrap[role="region"]:focus-visible{
    outline:3px solid rgba(249,115,22,.30);
    outline-offset:3px;
}

/* Alturas dinámicas: evita que la barra del navegador móvil tape contenido o
   botones de cierre en modales. */
.legal-modal-dialog{
    max-height:min(82dvh,780px);
}
.support-modal-dialog{
    max-height:min(88dvh,860px);
}
.support-modal-body{
    max-height:calc(min(88dvh,860px) - 82px);
    overscroll-behavior:contain;
}
.legal-modal-content,
.accessibility-modal-dialog,
.problem-modal-dialog{
    overscroll-behavior:contain;
}
.support-modal-close,
.legal-modal-close,
.accessibility-modal-close,
.problem-modal-close{
    min-width:44px;
    min-height:44px;
}

/* 320–430 px: las tres ventajas del reto diario conservan sus tres columnas,
   pero pasan a una composición vertical. Evita el recorte que producía el
   icono + texto en horizontal en tarjetas estrechas. */
@media(max-width:430px){
    .daily-game-card .daily-game-perks{
        display:grid!important;
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:6px!important;
        width:100%!important;
    }
    .daily-game-card .daily-game-perk{
        width:auto!important;
        min-width:0!important;
        min-height:78px!important;
        display:flex!important;
        flex-direction:column!important;
        align-items:center!important;
        justify-content:center!important;
        gap:6px!important;
        padding:8px 4px!important;
        text-align:center!important;
        overflow:hidden!important;
    }
    .daily-game-card .daily-game-perk__icon{
        width:30px!important;
        height:30px!important;
        flex:0 0 30px!important;
    }
    .daily-game-card .daily-game-perk__copy{
        width:100%!important;
        min-width:0!important;
        align-items:center!important;
        justify-content:center!important;
        gap:2px!important;
    }
    .daily-game-card .daily-game-perk__copy small,
    .daily-game-card .daily-game-perk__copy strong{
        width:100%!important;
        white-space:normal!important;
        overflow-wrap:anywhere!important;
        text-align:center!important;
    }
    .daily-game-card .daily-game-perk__copy small{
        font-size:7.5px!important;
        letter-spacing:.04em!important;
    }
    .daily-game-card .daily-game-perk__copy strong{
        font-size:9px!important;
    }

    .legal-modal,
    .support-modal,
    .accessibility-modal,
    .problem-modal{
        padding-left:max(8px,env(safe-area-inset-left))!important;
        padding-right:max(8px,env(safe-area-inset-right))!important;
        padding-bottom:max(8px,env(safe-area-inset-bottom))!important;
    }
    .legal-modal-dialog,
    .support-modal-dialog{
        max-height:calc(100dvh - max(16px,env(safe-area-inset-top) + env(safe-area-inset-bottom)))!important;
    }
}

/* 320 px: reduce únicamente el espacio periférico, nunca el objetivo táctil. */
@media(max-width:360px){
    .daily-challenge-panel{
        padding:16px!important;
    }
    .daily-game-card{
        padding:16px!important;
    }
    .daily-game-hero{
        grid-template-columns:70px minmax(0,1fr)!important;
        gap:12px!important;
    }
    .daily-game-icon{
        width:70px!important;
        height:70px!important;
        border-radius:21px!important;
    }
    .daily-game-icon .emoji-3d{
        font-size:37px!important;
    }
    .daily-game-copy h3{
        font-size:24px!important;
    }
    .daily-game-card .daily-play-button.ui-context-btn,
    body .daily-game-card .daily-play-button.ui-context-btn{
        min-height:52px!important;
        padding-inline:48px!important;
    }
}

@media(max-width:800px){
    .legal-modal-dialog{
        max-height:calc(100dvh - 20px);
    }
    .legal-modal-content{
        max-height:calc(100dvh - 97px);
    }
    .support-modal-dialog{
        max-height:calc(100dvh - 24px);
    }
    .support-modal-body{
        max-height:calc(100dvh - 106px);
    }
}

@media(prefers-reduced-motion:reduce){
    .admin-table-wrap[role="region"],
    .dashboard-mc-history-table-wrap[role="region"]{
        scroll-behavior:auto;
    }
}


/* ========================================================================== 
   V232 · Onboarding de primera sesión
   Tour de 4 pasos: economía, reto diario, tienda y ranking.
   ========================================================================== */
body.onboarding-tour-open{overflow:hidden!important}
.onboarding-tour__sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.onboarding-tour[hidden]{display:none!important}
.onboarding-tour{
    position:fixed;inset:0;z-index:12000;display:grid;place-items:center;
    padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));
    opacity:0;transition:opacity .2s ease;
}
.onboarding-tour.is-open{opacity:1}
.onboarding-tour__backdrop{position:absolute;inset:0;background:rgba(10,12,16,.72);backdrop-filter:blur(15px) saturate(.9)}
.onboarding-tour__dialog{
    position:relative;width:min(940px,100%);max-height:min(88dvh,820px);overflow:auto;overscroll-behavior:contain;
    border:1px solid rgba(255,255,255,.65);border-radius:34px;
    background:linear-gradient(145deg,rgba(255,255,255,.985),rgba(255,249,238,.985));
    box-shadow:0 34px 90px rgba(0,0,0,.34),inset 0 1px 0 #fff;
    transform:translateY(14px) scale(.985);transition:transform .25s cubic-bezier(.2,.8,.2,1);outline:none;
}
.onboarding-tour.is-open .onboarding-tour__dialog{transform:none}
.onboarding-tour__dialog::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at 92% 5%,rgba(255,177,42,.16),transparent 31%),radial-gradient(circle at 8% 98%,rgba(249,115,22,.07),transparent 28%)}
.onboarding-tour__header,.onboarding-tour__progress,.onboarding-tour__slides,.onboarding-tour__footer{position:relative;z-index:1}
.onboarding-tour__header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 26px 16px}
.onboarding-tour__brand{display:inline-flex;align-items:center;gap:10px;color:#17191f;text-decoration:none;font:800 14px var(--font-display)}
.onboarding-tour__brand-mark{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:linear-gradient(145deg,#fff1c9,#ffd56d);font-size:20px;box-shadow:0 7px 16px rgba(206,132,20,.14)}
.onboarding-tour__skip{min-height:40px;padding:0 14px;border:0;border-radius:999px;background:rgba(17,19,24,.045);color:#707987;font:700 11px var(--font-display);cursor:pointer;transition:background .18s ease,color .18s ease}
.onboarding-tour__skip:hover{background:rgba(17,19,24,.075);color:#2d333b}
.onboarding-tour__progress{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 28px 17px;color:#9aa3af;font:800 9px var(--font-display);letter-spacing:.11em;text-transform:uppercase}
.onboarding-tour__dots{display:flex;align-items:center;gap:6px}
.onboarding-tour__dots i{display:block;width:24px;height:4px;border-radius:999px;background:#e5e8ec;transition:background .2s ease,width .2s ease}
.onboarding-tour__dots i.is-active{width:32px;background:linear-gradient(90deg,#ffb83f,#f97316)}
.onboarding-tour__slides{padding:0 26px}
.onboarding-tour__slide{display:grid;grid-template-columns:minmax(290px,.9fr) minmax(0,1.08fr);gap:42px;align-items:center;min-height:430px;padding:22px 16px 30px}
.onboarding-tour__slide[hidden]{display:none!important}
.onboarding-tour__visual{position:relative;min-height:340px;display:grid;place-items:center;border:1px solid rgba(17,19,24,.065);border-radius:28px;overflow:hidden;background:linear-gradient(145deg,#111318,#1d2027);box-shadow:0 20px 44px rgba(17,19,24,.12)}
.onboarding-tour__visual::before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(255,159,38,.35),rgba(255,159,38,0) 67%);filter:blur(3px)}
.onboarding-tour__hero-icon{position:relative;z-index:2;width:94px;height:94px;display:grid;place-items:center;border-radius:30px;background:linear-gradient(145deg,#ffd870,#ffad31);font-size:48px;box-shadow:0 20px 38px rgba(249,115,22,.25),inset 0 1px 0 rgba(255,255,255,.7)}
.onboarding-tour__visual-orbit{position:absolute;width:210px;height:210px;border:1px solid rgba(255,255,255,.12);border-radius:50%}
.onboarding-tour__visual-orbit::before,.onboarding-tour__visual-orbit::after{content:"";position:absolute;width:12px;height:12px;border-radius:50%;background:#ffbd43;box-shadow:0 0 0 7px rgba(255,189,67,.09)}
.onboarding-tour__visual-orbit::before{left:-6px;top:47%}.onboarding-tour__visual-orbit::after{right:15px;top:16%;background:#ff6d86;box-shadow:0 0 0 7px rgba(255,109,134,.09)}
.onboarding-tour__mini-card{position:absolute;z-index:3;min-width:122px;padding:11px 13px;border:1px solid rgba(255,255,255,.13);border-radius:15px;background:rgba(255,255,255,.09);backdrop-filter:blur(10px);color:#fff;box-shadow:0 10px 24px rgba(0,0,0,.14)}
.onboarding-tour__mini-card small{display:block;color:#aeb5c1;font:700 7px var(--font-display);letter-spacing:.1em}.onboarding-tour__mini-card strong{display:block;margin-top:3px;font:800 17px var(--font-display)}.onboarding-tour__mini-card span{display:block;margin-top:3px;color:#cbd0d7;font-size:8px}
.onboarding-tour__mini-card--lives{left:22px;bottom:26px}.onboarding-tour__mini-card--mc{right:22px;top:28px}
.onboarding-tour__copy{min-width:0;padding-right:10px}
.onboarding-tour__kicker{display:block;margin-bottom:14px;color:#ad6800;font:800 10px var(--font-display);letter-spacing:.16em}
.onboarding-tour__copy h2{margin:0;color:#111318;font-size:clamp(38px,4.1vw,56px);line-height:.98;letter-spacing:-.052em}
.onboarding-tour__copy h2 em{color:#f58213;font-style:normal}
.onboarding-tour__copy p{max-width:520px;margin:20px 0 0;color:#6f7988;font-size:14px;line-height:1.72}
.onboarding-tour__copy p strong{color:#333841}
.onboarding-tour__facts{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.onboarding-tour__facts>span{display:inline-flex;align-items:center;gap:7px;min-height:35px;padding:5px 11px 5px 6px;border:1px solid rgba(17,19,24,.065);border-radius:999px;background:rgba(255,255,255,.78);color:#727c89;font-size:10px;box-shadow:0 6px 16px rgba(17,19,24,.035)}
.onboarding-tour__facts b{color:#2c323a;font-weight:800}
.onboarding-tour__fact-icon{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;font-style:normal;font-weight:900}
.onboarding-tour__fact-icon--pink{background:#ffe7ee;color:#e94d78}.onboarding-tour__fact-icon--gold{background:#fff0c8;color:#dc8a06}.onboarding-tour__fact-icon--green{background:#e0f9e9;color:#25a65e}.onboarding-tour__fact-icon--orange{background:#ffead5;color:#e9720e}.onboarding-tour__fact-icon--blue{background:#e6efff;color:#4c77ca}.onboarding-tour__fact-icon--purple{background:#eee7ff;color:#7959cf}
.onboarding-tour__daily-card{position:relative;z-index:2;width:min(270px,78%);padding:20px;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.055));color:#fff;box-shadow:0 22px 42px rgba(0,0,0,.2);backdrop-filter:blur(8px)}
.onboarding-tour__daily-status{display:flex;align-items:center;gap:7px;color:#c4cad2;font:800 8px var(--font-display);letter-spacing:.1em}.onboarding-tour__daily-status i{width:7px;height:7px;border-radius:50%;background:#35ce74;box-shadow:0 0 0 5px rgba(53,206,116,.12)}
.onboarding-tour__daily-icon{width:68px;height:68px;display:grid;place-items:center;margin:28px 0 18px;border-radius:21px;background:linear-gradient(145deg,#fff1c2,#ffc951);font-size:34px;box-shadow:0 14px 26px rgba(228,145,13,.18)}
.onboarding-tour__daily-card>small{display:block;color:#9ea6b2;font:700 7px var(--font-display);letter-spacing:.11em}.onboarding-tour__daily-card>strong{display:block;margin-top:7px;font:800 21px var(--font-display)}
.onboarding-tour__daily-card>div{display:flex;gap:6px;margin-top:18px}.onboarding-tour__daily-card>div span{padding:7px 9px;border-radius:999px;background:rgba(255,255,255,.08);color:#e7e9ed;font:700 8px var(--font-display)}
.onboarding-tour__visual--shop{perspective:800px}
.onboarding-tour__shop-card{position:absolute;z-index:2;width:220px;min-height:178px;padding:20px;border-radius:24px;border:1px solid rgba(17,19,24,.08);background:linear-gradient(145deg,#fff,#fff9ee);box-shadow:0 22px 38px rgba(0,0,0,.2);color:#17191f}
.onboarding-tour__shop-card>span{width:54px;height:54px;display:grid;place-items:center;border-radius:17px;background:#fff0c7;font-size:28px}.onboarding-tour__shop-card small{display:block;margin-top:20px;color:#aa6a05;font:800 7px var(--font-display);letter-spacing:.11em}.onboarding-tour__shop-card strong{display:block;margin-top:6px;font:800 20px var(--font-display)}.onboarding-tour__shop-card b{display:inline-block;margin-top:16px;padding:8px 12px;border-radius:999px;background:linear-gradient(135deg,#ffb640,#f97316);color:#fff;font:800 8px var(--font-display)}
.onboarding-tour__shop-card--front{transform:translate(-20px,18px) rotate(-3deg)}.onboarding-tour__shop-card--back{transform:translate(72px,-62px) rotate(6deg);opacity:.58;filter:saturate(.8)}
.onboarding-tour__podium{position:relative;z-index:2;height:150px;display:flex;align-items:flex-end;gap:9px}.onboarding-tour__podium>span{width:72px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.12);border-radius:16px 16px 8px 8px;background:rgba(255,255,255,.08);color:#fff;font:800 25px var(--font-display)}.onboarding-tour__podium .is-first{height:132px;background:linear-gradient(180deg,rgba(255,191,64,.35),rgba(255,191,64,.1));position:relative}.onboarding-tour__podium .is-first i{position:absolute;top:18px;font-style:normal;font-size:24px}.onboarding-tour__podium .is-second{height:95px}.onboarding-tour__podium .is-third{height:72px}
.onboarding-tour__ranking-line{position:absolute;z-index:3;left:22px;right:22px;bottom:22px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:11px 13px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.09);backdrop-filter:blur(8px);color:#fff}.onboarding-tour__ranking-line b{color:#ffbf43}.onboarding-tour__ranking-line span{color:#c4cad3;font-size:8px}.onboarding-tour__ranking-line strong{font-size:10px}
.onboarding-tour__footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;padding:18px 26px 24px;border-top:1px solid rgba(17,19,24,.065)}
.onboarding-tour__back{justify-self:start;min-height:44px;padding:0 15px;border:0;border-radius:999px;background:transparent;color:#737d8a;font:800 11px var(--font-display);cursor:pointer}
.onboarding-tour__back:hover{background:rgba(17,19,24,.045);color:#2e343d}
.onboarding-tour__status{min-width:130px;color:#7d8794;font-size:9px;text-align:center}
.onboarding-tour__next{justify-self:end;min-width:154px;min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:5px 7px 5px 19px;border:1px solid rgba(245,158,11,.35);border-radius:999px;background:linear-gradient(135deg,#ffb83f,#f97316);color:#fff;font:800 12px var(--font-display);box-shadow:0 12px 25px rgba(249,115,22,.22);cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.onboarding-tour__next-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3)}.onboarding-tour__next-icon svg{width:17px;height:17px}.onboarding-tour__next:hover{transform:translateY(-1px);box-shadow:0 16px 30px rgba(249,115,22,.27)}
.onboarding-tour__next:disabled,.onboarding-tour__skip:disabled,.onboarding-tour__back:disabled{cursor:wait;opacity:.62}
.onboarding-tour :focus-visible{outline:3px solid rgba(249,115,22,.24);outline-offset:3px}

@media(max-width:760px){
    .onboarding-tour{padding:10px max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
    .onboarding-tour__dialog{max-height:94dvh;border-radius:26px}
    .onboarding-tour__header{padding:16px 17px 12px}.onboarding-tour__progress{padding:0 18px 12px}.onboarding-tour__slides{padding:0 14px}
    .onboarding-tour__slide{grid-template-columns:1fr;gap:20px;min-height:0;padding:10px 5px 22px}.onboarding-tour__visual{min-height:210px;border-radius:22px}.onboarding-tour__visual-orbit{width:145px;height:145px}.onboarding-tour__hero-icon{width:70px;height:70px;border-radius:22px;font-size:36px}.onboarding-tour__mini-card{min-width:100px;padding:8px 10px}.onboarding-tour__mini-card--lives{left:12px;bottom:13px}.onboarding-tour__mini-card--mc{right:12px;top:14px}
    .onboarding-tour__copy{padding:0 4px}.onboarding-tour__kicker{margin-bottom:9px}.onboarding-tour__copy h2{font-size:34px}.onboarding-tour__copy p{margin-top:13px;font-size:12.5px;line-height:1.6}.onboarding-tour__facts{margin-top:16px}
    .onboarding-tour__daily-card{width:min(310px,86%);padding:15px}.onboarding-tour__daily-icon{width:52px;height:52px;margin:15px 0 12px;font-size:28px}.onboarding-tour__daily-card>strong{font-size:18px}.onboarding-tour__shop-card{width:175px;min-height:135px;padding:14px}.onboarding-tour__shop-card>span{width:43px;height:43px;font-size:23px}.onboarding-tour__shop-card small{margin-top:12px}.onboarding-tour__shop-card strong{font-size:16px}.onboarding-tour__shop-card b{margin-top:10px}.onboarding-tour__shop-card--front{transform:translate(-24px,15px) rotate(-3deg)}.onboarding-tour__shop-card--back{transform:translate(58px,-42px) rotate(6deg)}
    .onboarding-tour__podium{height:112px}.onboarding-tour__podium>span{width:58px}.onboarding-tour__podium .is-first{height:104px}.onboarding-tour__podium .is-second{height:76px}.onboarding-tour__podium .is-third{height:58px}.onboarding-tour__ranking-line{bottom:12px;left:12px;right:12px}
    .onboarding-tour__footer{grid-template-columns:auto 1fr auto;padding:13px 17px 17px}.onboarding-tour__status{min-width:0}.onboarding-tour__next{min-width:142px;min-height:48px;padding-left:16px}.onboarding-tour__next-icon{width:34px;height:34px}
}
@media(max-width:430px){
    .onboarding-tour__brand span:last-child{display:none}.onboarding-tour__skip{font-size:10px}.onboarding-tour__dots i{width:17px}.onboarding-tour__dots i.is-active{width:24px}
    .onboarding-tour__visual{min-height:190px}.onboarding-tour__copy h2{font-size:30px}.onboarding-tour__facts>span{font-size:9px}.onboarding-tour__footer{grid-template-columns:auto 1fr}.onboarding-tour__status{grid-column:1/-1;grid-row:1;text-align:left}.onboarding-tour__back{grid-column:1;grid-row:2;padding:0 10px}.onboarding-tour__next{grid-column:2;grid-row:2;min-width:138px}
}
@media(prefers-reduced-motion:reduce){.onboarding-tour,.onboarding-tour__dialog,.onboarding-tour__dots i,.onboarding-tour__next{transition:none!important}}

/* ========================================================================== 
   V234 · Tienda — Escudo de racha
   ========================================================================== */
.shop-product[data-shop-product="escudo_racha"]{
    background:linear-gradient(145deg,#fff 0%,#fffaf2 72%,#fff6e5 100%);
    border-color:rgba(245,158,11,.13);
}
.shop-product[data-shop-product="escudo_racha"] .shop-product-tag{
    color:#9f5b08;
    background:linear-gradient(180deg,#fff7e5,#fff0c8);
    border:1px solid rgba(245,158,11,.13);
}


/* ========================================================================== 
   V235 · Racha semanal — estado del Escudo de racha
   ========================================================================== */
.weekly-check-meta .weekly-shield-available{
    border-color:rgba(96,165,250,.20)!important;
    background:linear-gradient(135deg,rgba(59,130,246,.13),rgba(255,255,255,.055))!important;
    color:#c9d8ee!important;
}
.weekly-check-meta .weekly-shield-available i{
    display:inline-grid;
    place-items:center;
    width:22px;
    height:22px;
    flex:0 0 22px;
    border-radius:8px;
    background:rgba(255,255,255,.08);
    font-style:normal;
    font-size:14px;
    line-height:1;
    filter:drop-shadow(0 3px 5px rgba(0,0,0,.18));
}
.weekly-check-meta .weekly-shield-available strong{
    color:#f4f8ff!important;
}
.weekly-day.is-protected{
    border-color:rgba(96,165,250,.44)!important;
    background:linear-gradient(145deg,rgba(59,130,246,.24),rgba(245,158,11,.10))!important;
    color:#dbeafe!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 8px 18px rgba(20,65,130,.12)!important;
}
.weekly-day.is-protected small{
    color:#bfd4f5!important;
}
.weekly-day.is-protected b{
    display:block;
    font-size:23px!important;
    line-height:1!important;
    filter:drop-shadow(0 4px 6px rgba(0,0,0,.22));
}
@media(max-width:560px){
    .weekly-check-meta .weekly-shield-available{
        grid-column:1/-1;
    }
    .weekly-day.is-protected b{
        font-size:19px!important;
    }
}


/* ========================================================================== 
   V236 · Escudo de racha — icono emoji consistente con el catálogo
   ========================================================================== */
.shop-product[data-shop-product="escudo_racha"] .shop-product-icon{
    font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",emoji,sans-serif!important;
    font-size:26px!important;
    line-height:1!important;
    font-weight:400!important;
}
.weekly-check-meta .weekly-shield-available i,
.weekly-day.is-protected b{
    font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",emoji,sans-serif!important;
    font-weight:400!important;
}


/* ========================================================================== 
   V237 · Tienda — disclosure patrocinado no intrusivo
   ========================================================================== */
.shop-sponsored-disclosure{
    max-width:760px!important;
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:10px!important;
    color:#7b8491!important;
    font-size:10.5px!important;
    line-height:1.55!important;
}
.shop-sponsored-disclosure>span{
    flex:0 0 auto;
    display:inline-grid;
    place-items:center;
    min-width:25px;
    height:18px;
    padding:0 5px;
    border:1px solid rgba(245,158,11,.2);
    border-radius:999px;
    background:#fff7e8;
    color:#a86600;
    font:800 7.5px/1 var(--font-display);
    letter-spacing:.08em;
}
@media(max-width:520px){
    .shop-sponsored-disclosure{font-size:10px!important}
}


/* ========================================================================== 
   V238 · Escudo de racha — icono de catálogo y estado semanal
   ========================================================================== */
.shop-product[data-shop-product="escudo_racha"] .shop-product-icon{
    font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",emoji,sans-serif!important;
    font-size:27px!important;
    line-height:1!important;
    font-weight:400!important;
    text-align:center!important;
}
.weekly-check-meta .weekly-shield-available i,
.weekly-day.is-protected b{
    font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",emoji,sans-serif!important;
    font-weight:400!important;
    font-style:normal!important;
}

.shop-sponsored-disclosure--catalog-end{
    max-width:none!important;
    margin:18px 2px 0!important;
    padding-top:13px;
    border-top:1px solid rgba(17,19,24,.06);
}


/* ========================================================================== 
   V239 · Escudo de racha — feedback de consumo y stock explícito
   ========================================================================== */
.weekly-shield-activation{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:16px;
    margin:24px 0 -4px;
    padding:16px 18px;
    border:1px solid rgba(59,130,246,.18);
    border-radius:22px;
    background:linear-gradient(135deg,rgba(239,246,255,.98),rgba(255,250,238,.98));
    box-shadow:0 14px 34px rgba(37,50,74,.07),inset 0 1px 0 rgba(255,255,255,.92);
}
.weekly-shield-activation__icon{
    width:50px;
    height:50px;
    display:grid;
    place-items:center;
    border-radius:16px;
    background:linear-gradient(145deg,#dbeafe,#fff1c7);
    font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
    font-size:26px;
    line-height:1;
    box-shadow:0 8px 18px rgba(59,130,246,.12),inset 0 1px 0 rgba(255,255,255,.9);
}
.weekly-shield-activation__copy{min-width:0}
.weekly-shield-activation__copy>span{
    display:block;
    margin-bottom:3px;
    color:#5275aa;
    font:800 9px/1.2 var(--font-display);
    letter-spacing:.12em;
}
.weekly-shield-activation__copy>strong{
    display:block;
    color:#172033;
    font:800 16px/1.2 var(--font-display);
}
.weekly-shield-activation__copy>p{
    margin:5px 0 0;
    color:#687589;
    font-size:11.5px;
    line-height:1.5;
}
.weekly-shield-activation__stock{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:0 12px;
    border:1px solid rgba(59,130,246,.15);
    border-radius:999px;
    background:#fff;
    color:#426594;
    font:800 10px/1 var(--font-display);
    white-space:nowrap;
}
.weekly-shield-activation__stock.is-empty{
    border-color:rgba(107,114,128,.12);
    background:#f6f7f9;
    color:#7b8491;
}
.weekly-check-meta .weekly-shield-available.is-empty{
    border-color:rgba(255,255,255,.075)!important;
    background:rgba(255,255,255,.045)!important;
    color:#8993a1!important;
}
.weekly-check-meta .weekly-shield-available.is-empty i{
    filter:grayscale(.35) opacity(.72)!important;
}
.weekly-check-meta .weekly-shield-available.is-empty strong{
    color:#9ca5b2!important;
}
@media(max-width:700px){
    .weekly-shield-activation{
        grid-template-columns:auto minmax(0,1fr);
        gap:12px;
        padding:14px;
        border-radius:19px;
    }
    .weekly-shield-activation__stock{
        grid-column:1/-1;
        justify-self:start;
        margin-left:62px;
    }
}
@media(max-width:430px){
    .weekly-shield-activation{
        grid-template-columns:1fr;
        text-align:center;
    }
    .weekly-shield-activation__icon,
    .weekly-shield-activation__stock{
        justify-self:center;
        margin-left:0;
    }
}

/* ========================================================================== 
   V240 · ADMIN · Telemetría interna de producto
   ========================================================================== */
.admin-telemetry-overview{
    margin-top:22px;
    padding:26px;
    border:1px solid rgba(17,19,24,.08);
    border-radius:28px;
    background:
        radial-gradient(circle at 94% 0%,rgba(255,184,63,.20),transparent 32%),
        linear-gradient(145deg,rgba(255,255,255,.98),rgba(255,250,241,.94));
    box-shadow:0 20px 52px rgba(17,19,24,.055);
}
.admin-telemetry-overview-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:24px;
}
.admin-telemetry-overview-head h2{
    margin-top:7px;
    font-size:clamp(27px,3vw,39px);
    letter-spacing:-.045em;
}
.admin-telemetry-overview-head p{
    max-width:760px;
    margin-top:8px;
    color:#778191;
    font-size:12px;
    line-height:1.65;
}
.admin-telemetry-overview-actions{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    justify-content:flex-end;
}
.admin-telemetry-period,
.admin-telemetry-restore,
.admin-telemetry-hide{
    min-height:35px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:0 12px;
    border:1px solid rgba(17,19,24,.075);
    border-radius:999px;
    background:rgba(255,255,255,.88);
    color:#687382;
    font:800 9px var(--font-display);
    letter-spacing:.02em;
}
.admin-telemetry-restore,
.admin-telemetry-hide{cursor:pointer}
.admin-telemetry-restore:hover,
.admin-telemetry-hide:hover{
    border-color:rgba(245,158,11,.28);
    background:#fff8e9;
    color:#995c04;
}
.admin-telemetry-restore b{
    min-width:20px;
    height:20px;
    display:inline-grid;
    place-items:center;
    padding:0 5px;
    border-radius:999px;
    background:#fff0cc;
    color:#a96704;
    font-size:9px;
}
.admin-telemetry-kpis{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:10px;
    margin-top:22px;
}
.admin-telemetry-kpis article{
    min-width:0;
    padding:16px;
    border:1px solid rgba(17,19,24,.07);
    border-radius:18px;
    background:rgba(255,255,255,.78);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}
.admin-telemetry-kpis span,
.admin-telemetry-mini-grid small,
.admin-telemetry-feature-grid span{
    display:block;
    color:#9ba4b1;
    font:800 8px var(--font-display);
    letter-spacing:.1em;
}
.admin-telemetry-kpis strong{
    display:block;
    margin-top:7px;
    color:#16191e;
    font:800 24px/1 var(--font-display);
    letter-spacing:-.035em;
}
.admin-telemetry-kpis small{
    display:block;
    margin-top:7px;
    color:#7c8694;
    font-size:9px;
    line-height:1.35;
}
.admin-telemetry-warning{
    margin-top:12px;
    padding:11px 13px;
    border:1px solid rgba(245,158,11,.22);
    border-radius:14px;
    background:#fff9eb;
    color:#87580a;
    font-size:10px;
    line-height:1.45;
}
.admin-telemetry-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
    margin-top:18px;
}
.admin-telemetry-card{
    min-width:0;
    margin:0!important;
}
.admin-telemetry-card--wide{grid-column:1/-1}
.admin-telemetry-card .admin-card-head{
    gap:16px;
}
.admin-telemetry-head-actions{
    display:flex;
    align-items:center;
    gap:7px;
    flex-wrap:wrap;
    margin-left:auto;
}
.admin-telemetry-card .admin-collapse-toggle{
    margin-left:0!important;
}
.admin-telemetry-hide{
    min-height:34px;
    background:#fbfbfa;
    color:#8a929e;
}
.admin-telemetry-mini-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
    margin-top:19px;
}
.admin-telemetry-mini-grid>div{
    min-width:0;
    padding:14px;
    border:1px solid rgba(17,19,24,.065);
    border-radius:16px;
    background:#fbfbfa;
}
.admin-telemetry-mini-grid strong{
    display:block;
    margin-top:6px;
    color:#15181d;
    font:800 22px/1 var(--font-display);
}
.admin-telemetry-mini-grid span{
    display:block;
    margin-top:6px;
    color:#7c8694;
    font-size:9px;
}
.admin-telemetry-mini-grid--shop{
    grid-template-columns:repeat(5,minmax(0,1fr));
}
.admin-telemetry-mini-grid--shop .is-shield{
    background:linear-gradient(145deg,#fffaf0,#fffdf8);
    border-color:rgba(245,158,11,.13);
}
.admin-telemetry-subhead,
.admin-telemetry-table-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin:22px 0 10px;
}
.admin-telemetry-subhead strong,
.admin-telemetry-table-head strong{
    color:#2c3037;
    font:800 12px var(--font-display);
}
.admin-telemetry-subhead span,
.admin-telemetry-table-head span{
    color:#9aa3af;
    font-size:9px;
}
.admin-telemetry-bars{
    display:grid;
    gap:9px;
}
.admin-telemetry-bar-row{
    display:grid;
    grid-template-columns:minmax(130px,.8fr) minmax(100px,1.3fr) 34px;
    align-items:center;
    gap:10px;
}
.admin-telemetry-bar-label{
    min-width:0;
    display:flex;
    align-items:center;
    gap:8px;
    color:#5f6875;
    font-size:10px;
}
.admin-telemetry-bar-label b{
    width:24px;
    height:24px;
    flex:0 0 24px;
    display:grid;
    place-items:center;
    border-radius:8px;
    background:#fff2d4;
    color:#a76600;
    font:800 9px var(--font-display);
}
.admin-telemetry-bar-track,
.admin-retention-track{
    display:block;
    height:7px;
    overflow:hidden;
    border-radius:999px;
    background:#edf0f3;
}
.admin-telemetry-bar-track i,
.admin-retention-track i{
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,#ffba3d,#f97316);
}
.admin-telemetry-bar-row>strong{
    color:#343940;
    font:800 11px var(--font-display);
    text-align:right;
}
.admin-telemetry-note{
    margin-top:15px;
    color:#8b94a1;
    font-size:9.5px;
    line-height:1.55;
}
.admin-retention-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:20px;
}
.admin-retention-grid article{
    padding:17px;
    border:1px solid rgba(17,19,24,.065);
    border-radius:18px;
    background:linear-gradient(145deg,#fff,#fbfaf6);
}
.admin-retention-grid article>span{
    display:inline-flex;
    min-width:34px;
    min-height:25px;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:#fff1d0;
    color:#a46400;
    font:800 9px var(--font-display);
}
.admin-retention-grid article>strong{
    display:block;
    margin:11px 0 10px;
    color:#171a1f;
    font:800 25px/1 var(--font-display);
}
.admin-retention-grid small{
    display:block;
    margin-top:8px;
    color:#89929e;
    font-size:8.5px;
    line-height:1.35;
}
.admin-retention-track i{background:linear-gradient(90deg,#63cf8d,#22a861)}
.admin-telemetry-feature-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-top:20px;
}
.admin-telemetry-feature-grid article{
    min-width:0;
    padding:16px;
    border:1px solid rgba(17,19,24,.065);
    border-radius:17px;
    background:#fbfbfa;
}
.admin-telemetry-feature-grid strong{
    display:block;
    margin-top:8px;
    color:#15181d;
    font:800 24px/1 var(--font-display);
}
.admin-telemetry-feature-grid small{
    display:block;
    margin-top:8px;
    color:#89929e;
    font-size:9px;
    line-height:1.4;
}
.admin-telemetry-table td{vertical-align:middle}
.admin-telemetry-product{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-width:0;
}
.admin-telemetry-product>i{
    width:34px;
    height:34px;
    flex:0 0 34px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:linear-gradient(145deg,#fff5d9,#ffe8af);
    font-style:normal;
    font-size:17px;
}
.admin-telemetry-product>span{min-width:0}
.admin-telemetry-product strong{
    display:block;
    color:#2b2f35;
    font-size:10px;
}
.admin-telemetry-product small{
    display:block;
    margin-top:3px;
    color:#9aa3ae;
    font-size:8px;
    text-transform:capitalize;
}
.admin-telemetry-rate{
    display:inline-flex;
    min-height:27px;
    align-items:center;
    padding:0 9px;
    border-radius:999px;
    background:#edf8f1;
    color:#277247;
    font:800 9px var(--font-display);
}
.admin-telemetry-rate.is-mid{background:#fff7e7;color:#96610c}
.admin-telemetry-rate.is-high{background:#fff0f0;color:#a43d3d}
[data-admin-hideable][hidden]{display:none!important}

@media(max-width:1050px){
    .admin-telemetry-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
    .admin-telemetry-mini-grid--shop{grid-template-columns:repeat(3,minmax(0,1fr))}
    .admin-telemetry-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
    .admin-telemetry-overview{padding:20px;border-radius:23px}
    .admin-telemetry-overview-head{flex-direction:column}
    .admin-telemetry-overview-actions{width:100%;justify-content:flex-start}
    .admin-telemetry-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
    .admin-telemetry-grid{grid-template-columns:1fr}
    .admin-telemetry-card--wide{grid-column:auto}
    .admin-telemetry-mini-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .admin-telemetry-mini-grid--shop{grid-template-columns:repeat(2,minmax(0,1fr))}
    .admin-retention-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
    .admin-telemetry-kpis{grid-template-columns:1fr}
    .admin-telemetry-mini-grid,
    .admin-telemetry-mini-grid--shop,
    .admin-telemetry-feature-grid{grid-template-columns:1fr 1fr}
    .admin-telemetry-bar-row{grid-template-columns:1fr 32px}
    .admin-telemetry-bar-track{grid-column:1/-1;grid-row:2}
    .admin-telemetry-head-actions{width:100%;margin-left:0}
    .admin-telemetry-hide{flex:1}
}
@media(max-width:370px){
    .admin-telemetry-mini-grid,
    .admin-telemetry-mini-grid--shop,
    .admin-telemetry-feature-grid{grid-template-columns:1fr}
}

/* ========================================================================== 
   V241 · ADMIN — armonía visual, acciones y señales de atención
   --------------------------------------------------------------------------
   Ajuste final de densidad, alineación e iconografía del panel de gestión.
   Las incidencias relevantes se hacen visibles sin añadir ruido permanente.
   ========================================================================== */

/* Cabeceras y grupos de acciones: una sola línea visual y sin saltos raros. */
.admin-page .admin-card-head{
    align-items:center;
}
.admin-page .admin-card-head>*,
.admin-page .admin-card-head>div:first-child{
    min-width:0;
}
.admin-head-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:9px;
    flex:0 0 auto;
}

/* Resumen superior de cosas que requieren revisión. */
.admin-attention-overview{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:18px;
    margin:0 0 22px;
    padding:14px 16px;
    border:1px solid rgba(220,38,38,.13);
    border-radius:20px;
    background:linear-gradient(135deg,rgba(255,250,250,.98),rgba(255,247,244,.94));
    box-shadow:0 12px 30px rgba(17,19,24,.04),inset 0 1px 0 rgba(255,255,255,.9);
}
.admin-attention-overview.is-warning{
    border-color:rgba(245,158,11,.16);
    background:linear-gradient(135deg,#fffdf8,#fff9ed);
}
.admin-attention-overview__title{
    display:flex;
    align-items:center;
    gap:11px;
    min-width:185px;
}
.admin-attention-overview__title>div{min-width:0}
.admin-attention-overview__title strong{
    display:block;
    color:#30343a;
    font:800 12px/1.15 var(--font-display);
}
.admin-attention-overview__title small{
    display:block;
    margin-top:3px;
    color:#8b93a0;
    font-size:9px;
}
.admin-attention-links{
    min-width:0;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
    flex-wrap:wrap;
}
.admin-attention-links a{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:34px;
    max-width:250px;
    padding:0 11px;
    border:1px solid rgba(17,19,24,.07);
    border-radius:999px;
    background:rgba(255,255,255,.86);
    color:#59616d;
    text-decoration:none;
    font:800 9px/1 var(--font-display);
    box-shadow:0 5px 14px rgba(17,19,24,.035);
}
.admin-attention-links a>i{
    width:7px;
    height:7px;
    flex:0 0 7px;
    border-radius:50%;
    background:#e04343;
    box-shadow:0 0 0 4px rgba(224,67,67,.08);
}
.admin-attention-links a.is-warning>i{
    background:#e99a12;
    box-shadow:0 0 0 4px rgba(233,154,18,.09);
}
.admin-attention-links a>b{display:none}
.admin-attention-links a:hover{
    border-color:rgba(245,158,11,.24);
    background:#fff;
    color:#252a31;
}
.admin-attention-links a:focus-visible{
    outline:3px solid rgba(245,158,11,.22);
    outline-offset:2px;
}

.admin-attention-pulse{
    position:relative;
    width:12px;
    height:12px;
    flex:0 0 12px;
    display:inline-grid;
    place-items:center;
}
.admin-attention-pulse>i{
    width:8px;
    height:8px;
    display:block;
    border-radius:50%;
    background:#dc3f3f;
    box-shadow:0 0 0 0 rgba(220,63,63,.30);
    animation:adminAttentionPulse 1.8s ease-out infinite;
}
.admin-attention-pulse.is-warning>i{
    background:#f59e0b;
    box-shadow:0 0 0 0 rgba(245,158,11,.25);
    animation-name:adminAttentionPulseWarning;
}
@keyframes adminAttentionPulse{
    0%{box-shadow:0 0 0 0 rgba(220,63,63,.30)}
    70%{box-shadow:0 0 0 8px rgba(220,63,63,0)}
    100%{box-shadow:0 0 0 0 rgba(220,63,63,0)}
}
@keyframes adminAttentionPulseWarning{
    0%{box-shadow:0 0 0 0 rgba(245,158,11,.25)}
    70%{box-shadow:0 0 0 8px rgba(245,158,11,0)}
    100%{box-shadow:0 0 0 0 rgba(245,158,11,0)}
}
.admin-card.has-admin-attention,
.admin-telemetry-overview.has-admin-attention{
    border-color:rgba(220,63,63,.16)!important;
    box-shadow:0 18px 55px rgba(17,19,24,.05),0 0 0 1px rgba(220,63,63,.025)!important;
}
.admin-card.has-admin-warning,
.admin-control-card.has-admin-warning{
    border-color:rgba(245,158,11,.19)!important;
}

/* Píldora Mostrar/Ocultar: chevron SVG geométrico y centrado. */
.admin-collapse-toggle{
    min-height:38px!important;
    padding:4px 5px 4px 13px!important;
    gap:9px!important;
    border-color:rgba(17,19,24,.085)!important;
    background:linear-gradient(180deg,#fff,#fbfbfa)!important;
    color:#6f7784!important;
    font:800 9.5px/1 var(--font-display)!important;
    box-shadow:0 5px 14px rgba(17,19,24,.035)!important;
}
.admin-collapse-chevron{
    width:28px;
    height:28px;
    flex:0 0 28px;
    display:inline-grid;
    place-items:center;
    margin:0!important;
    border-radius:50%;
    background:#f3f4f6;
    color:#697281;
    transition:transform .18s ease,background .18s ease,color .18s ease;
}
.admin-collapse-chevron svg{
    display:block;
    width:16px;
    height:16px;
}
.admin-collapse-toggle[aria-expanded="true"] .admin-collapse-chevron{
    transform:rotate(180deg);
    background:#fff3d8;
    color:#a86600;
}
.admin-collapse-toggle:hover .admin-collapse-chevron{
    background:#fff1d0;
    color:#9a6508;
}
.admin-collapse-attention{
    position:relative;
    width:10px;
    height:10px;
    flex:0 0 10px;
    display:inline-grid;
    place-items:center;
    margin-right:-2px;
}
.admin-collapse-attention>i{
    width:7px!important;
    height:7px!important;
    display:block!important;
    margin:0!important;
    border-radius:50%;
    background:#dc3f3f;
    font-size:0!important;
    line-height:0!important;
    transform:none!important;
    animation:adminAttentionPulse 1.8s ease-out infinite!important;
}
.admin-collapse-attention.is-warning>i{
    background:#f59e0b;
    animation-name:adminAttentionPulseWarning!important;
}
.admin-collapse-toggle[aria-expanded="true"] .admin-collapse-attention>i{
    transform:none!important;
}

/* Un único sistema de proporciones para acciones administrativas. */
.admin-page .admin-action-btn.ui-context-btn,
.admin-page .admin-text-button.ui-context-btn{
    min-height:40px!important;
    padding:4px 13px 4px 5px!important;
    gap:8px!important;
    border-radius:999px!important;
    font-size:10px!important;
    white-space:nowrap;
}
.admin-page .admin-action-btn.ui-context-btn .ui-context-btn__icon,
.admin-page .admin-text-button.ui-context-btn .ui-context-btn__icon{
    width:30px!important;
    height:30px!important;
    flex:0 0 30px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    padding:0!important;
    color:#fff!important;
    line-height:0!important;
}
.admin-page .admin-action-btn.ui-context-btn .ui-context-btn__icon svg,
.admin-page .admin-text-button.ui-context-btn .ui-context-btn__icon svg{
    display:block!important;
    width:14px!important;
    height:14px!important;
    margin:0!important;
}
.admin-page .admin-action-btn.ui-context-btn .ui-context-btn__label,
.admin-page .admin-text-button.ui-context-btn .ui-context-btn__label{
    display:inline-flex!important;
    align-items:center!important;
    margin:0!important;
    padding:0!important;
    line-height:1!important;
}
.admin-page .ui-context-btn[data-ui-icon="pause"] .ui-context-btn__icon svg{
    width:13px!important;
    height:13px!important;
    transform:none!important;
}

/* Cupones: Pausar/Eliminar con la misma anchura visual y sin desplazamientos. */
.admin-coupon-actions{
    align-items:center!important;
    gap:8px!important;
}
.admin-coupon-actions form{
    display:flex;
    align-items:center;
}
.admin-coupon-actions .admin-action-btn.ui-context-btn{
    min-width:108px!important;
    justify-content:flex-start!important;
}

/* Salud de plataforma: las reglas antiguas de .admin-system-grid span no deben
   modificar los spans internos de los botones contextuales. */
.admin-system-grid>div{
    position:relative;
    display:flex;
    flex-direction:column;
    min-height:112px;
}
.admin-system-grid>div>span{
    line-height:1.45;
}
.admin-system-grid form{
    margin-top:12px!important;
}
body .admin-system-grid .admin-text-button.ui-context-btn{
    width:max-content!important;
    max-width:100%;
    min-height:40px!important;
    margin:0!important;
    text-decoration:none!important;
    justify-content:flex-start!important;
}
body .admin-system-grid .ui-context-btn__icon{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:30px!important;
    height:30px!important;
    flex:0 0 30px!important;
    margin:0!important;
    padding:0!important;
    color:#fff!important;
    font-size:0!important;
    line-height:0!important;
}
body .admin-system-grid .ui-context-btn__icon::after{display:block!important}
body .admin-system-grid .ui-context-btn__icon svg{
    display:block!important;
    width:14px!important;
    height:14px!important;
    margin:0!important;
    color:#fff!important;
}
body .admin-system-grid .ui-context-btn__icon svg *{
    stroke:currentColor;
    vector-effect:non-scaling-stroke;
}
body .admin-system-grid .ui-context-btn[data-ui-icon="check"] .ui-context-btn__icon svg *,
body .admin-system-grid .ui-context-btn[data-ui-icon="plus"] .ui-context-btn__icon svg *,
body .admin-system-grid .ui-context-btn[data-ui-icon="download"] .ui-context-btn__icon svg *{
    fill:none;
}
body .admin-system-grid .ui-context-btn__label{
    display:inline-flex!important;
    align-items:center!important;
    margin:0!important;
    color:#8a4c00!important;
    font:800 10px/1 var(--font-display)!important;
    letter-spacing:0!important;
    text-transform:none!important;
}

/* Estado de salud: punto visible en la propia tarjeta además del resumen. */
.admin-system-grid>div.is-health-bad::after,
.admin-system-grid>div.is-health-warning::after{
    content:"";
    position:absolute;
    top:12px;
    right:12px;
    width:8px;
    height:8px;
    border-radius:50%;
}
.admin-system-grid>div.is-health-bad::after{
    background:#dc3f3f;
    animation:adminAttentionPulse 1.8s ease-out infinite;
}
.admin-system-grid>div.is-health-warning::after{
    background:#f59e0b;
    box-shadow:0 0 0 4px rgba(245,158,11,.09);
}
.admin-health-check.is-bad .admin-health-dot{
    animation:adminAttentionPulse 1.8s ease-out infinite;
}

/* Telemetría y controles secundarios: controles alineados, discretos y táctiles. */
.admin-telemetry-head-actions,
.admin-telemetry-overview-actions{
    align-items:center!important;
}
.admin-telemetry-hide,
.admin-telemetry-restore{
    min-height:36px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    line-height:1!important;
}
.admin-telemetry-hide{
    padding-inline:12px!important;
}

/* Formularios/acciones dentro de tablas y tarjetas mantienen su eje central. */
.admin-user-actions,
.admin-game-admin-actions,
.admin-maintenance-actions,
.admin-maintenance-off,
.admin-inline-security-form,
.admin-mail-test-form{
    align-items:center;
}
.admin-page form>.admin-action-btn.ui-context-btn,
.admin-page form>.admin-text-button.ui-context-btn{
    vertical-align:middle;
}

/* Focus consistente en el ADMIN. */
.admin-collapse-toggle:focus-visible,
.admin-telemetry-hide:focus-visible,
.admin-telemetry-restore:focus-visible{
    outline:3px solid rgba(245,158,11,.22)!important;
    outline-offset:2px!important;
}

@media(max-width:900px){
    .admin-attention-overview{
        grid-template-columns:1fr;
        gap:11px;
    }
    .admin-attention-links{justify-content:flex-start}
}
@media(max-width:700px){
    .admin-page .admin-card-head{
        align-items:flex-start;
    }
    .admin-head-actions{width:100%;justify-content:flex-start;flex-wrap:wrap}
    .admin-collapse-toggle{margin-left:0!important}
    .admin-attention-links a{max-width:100%}
    .admin-coupon-actions .admin-action-btn.ui-context-btn{min-width:102px!important}
}
@media(max-width:440px){
    .admin-attention-overview{padding:13px;border-radius:17px}
    .admin-attention-links{display:grid;grid-template-columns:1fr;width:100%}
    .admin-attention-links a{width:100%;justify-content:flex-start}
    .admin-collapse-toggle{min-height:36px!important}
    .admin-collapse-chevron{width:26px;height:26px;flex-basis:26px}
    .admin-coupon-actions{width:100%}
    .admin-coupon-actions form{flex:1 1 0}
    .admin-coupon-actions .admin-action-btn.ui-context-btn{width:100%!important;min-width:0!important}
}
@media(prefers-reduced-motion:reduce){
    .admin-attention-pulse>i,
    .admin-collapse-attention>i,
    .admin-system-grid>div.is-health-bad::after,
    .admin-health-check.is-bad .admin-health-dot{
        animation:none!important;
    }
}

/* ========================================================================== 
   V242 · ADMIN observabilidad — triage y respiración visual
   ========================================================================== */
.admin-observability-card{
    padding-bottom:24px;
}
.admin-observability-card > .admin-card-head{
    padding-left:32px;
    padding-right:32px;
}
.admin-observability-card .admin-observability-stats,
.admin-observability-card .admin-observability-list,
.admin-observability-card .admin-observability-note{
    margin-left:28px;
    margin-right:28px;
}
.admin-observability-card .admin-observability-note{
    margin-bottom:0;
}
.admin-observability-event{
    padding:16px 18px;
    transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,opacity .18s ease;
}
.admin-observability-event.is-pending{
    border-color:rgba(245,158,11,.30);
    box-shadow:0 8px 22px rgba(166,105,0,.045);
}
.admin-observability-event.is-reviewed{
    border-color:rgba(34,197,94,.18);
    background:linear-gradient(180deg,#fff 0%,#fbfefc 100%);
}
.admin-observability-event.is-reviewed .admin-observability-event-head strong,
.admin-observability-event.is-reviewed .admin-observability-meta{
    opacity:.78;
}
.admin-observability-review-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-top:13px;
    padding-top:12px;
    border-top:1px solid rgba(17,19,24,.06);
}
.admin-observability-review-state{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    font-size:10px;
    font-weight:850;
    letter-spacing:.02em;
    white-space:nowrap;
}
.admin-observability-review-state i{
    width:7px;
    height:7px;
    flex:0 0 7px;
    border-radius:50%;
}
.admin-observability-review-state.is-pending{
    color:#9a6200;
    background:#fff5d9;
    border:1px solid rgba(245,158,11,.20);
}
.admin-observability-review-state.is-pending i{
    background:#f59e0b;
    box-shadow:0 0 0 4px rgba(245,158,11,.10);
}
.admin-observability-review-state.is-reviewed{
    color:#237445;
    background:#eefaf2;
    border:1px solid rgba(34,197,94,.18);
}
.admin-observability-review-state.is-reviewed i{
    background:#22c55e;
    box-shadow:0 0 0 4px rgba(34,197,94,.09);
}
.admin-observability-review-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex-wrap:wrap;
}
.admin-observability-review-actions form{
    margin:0;
}
.admin-observability-review-btn{
    min-height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 12px;
    border:1px solid rgba(17,19,24,.09);
    border-radius:999px;
    background:#fff;
    color:#555e6a;
    font:800 10px/1 var(--font-display);
    cursor:pointer;
    box-shadow:0 5px 13px rgba(17,19,24,.045);
    transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease;
}
.admin-observability-review-btn.is-reviewed{
    border-color:rgba(34,197,94,.22);
    background:#f5fcf7;
    color:#237445;
}
.admin-observability-review-btn.is-pending{
    border-color:rgba(245,158,11,.22);
    background:#fffaf0;
    color:#986000;
}
.admin-observability-review-btn.is-delete{
    border-color:rgba(220,38,38,.16);
    background:#fffafa;
    color:#b33434;
}
.admin-observability-review-btn:focus-visible{
    outline:3px solid rgba(245,158,11,.18);
    outline-offset:2px;
}
@media(hover:hover) and (pointer:fine){
    .admin-observability-review-btn:hover{
        transform:translateY(-1px);
        box-shadow:0 8px 18px rgba(17,19,24,.07);
    }
    .admin-observability-review-btn.is-reviewed:hover{border-color:rgba(34,197,94,.40);background:#effaf3}
    .admin-observability-review-btn.is-pending:hover{border-color:rgba(245,158,11,.40);background:#fff5e1}
    .admin-observability-review-btn.is-delete:hover{border-color:rgba(220,38,38,.34);background:#fff1f1}
}
@media(max-width:700px){
    .admin-observability-card{
        padding-bottom:18px;
    }
    .admin-observability-card > .admin-card-head{
        padding-left:20px;
        padding-right:20px;
    }
    .admin-observability-card .admin-observability-stats,
    .admin-observability-card .admin-observability-list,
    .admin-observability-card .admin-observability-note{
        margin-left:16px;
        margin-right:16px;
    }
    .admin-observability-event{
        padding:14px;
    }
    .admin-observability-review-row{
        align-items:stretch;
        flex-direction:column;
    }
    .admin-observability-review-state{
        align-self:flex-start;
    }
    .admin-observability-review-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
        width:100%;
    }
    .admin-observability-review-btn{
        width:100%;
        min-height:40px;
    }
}
@media(prefers-reduced-motion:reduce){
    .admin-observability-event,
    .admin-observability-review-btn{transition:none!important}
}


/* ========================================================================== 
   V243 · ADMIN — respiración interior y cuentas a ancho completo
   --------------------------------------------------------------------------
   Unifica el gutter visual de los paneles de gestión y separa Usuarios de
   Posibles multicuentas para evitar composiciones apretadas en escritorio.
   ========================================================================== */
.admin-page{
    --admin-panel-gutter:30px;
    --admin-panel-gutter-mobile:18px;
}

/* Cabeceras: mismo eje horizontal en todas las tarjetas del administrador. */
.admin-page .admin-card > .admin-card-head{
    padding-left:var(--admin-panel-gutter)!important;
    padding-right:var(--admin-panel-gutter)!important;
}

/* Tarjetas que históricamente no tenían contenedor interior propio. */
.admin-page .admin-telemetry-card > .admin-telemetry-mini-grid,
.admin-page .admin-telemetry-card > .admin-telemetry-feature-grid,
.admin-page .admin-telemetry-card > .admin-telemetry-subhead,
.admin-page .admin-telemetry-card > .admin-telemetry-bars,
.admin-page .admin-telemetry-card > .admin-telemetry-note,
.admin-page .admin-telemetry-card > .admin-telemetry-table-head,
.admin-page .admin-telemetry-card > .admin-pagination,
.admin-page .admin-catalog-card > .admin-catalog-list,
.admin-page .admin-catalog-card > .admin-game-admin-list,
.admin-page .admin-users > .admin-pagination,
.admin-page .admin-activity > .admin-pagination,
.admin-page .admin-contact-card > .admin-pagination{
    margin-left:var(--admin-panel-gutter)!important;
    margin-right:var(--admin-panel-gutter)!important;
}

/* Las tablas conservan scroll local pero dejan de tocar el marco del panel. */
.admin-page .admin-users > .admin-table-wrap,
.admin-page .admin-activity > .admin-table-wrap,
.admin-page .admin-contact-card > .admin-table-wrap,
.admin-page .admin-telemetry-card > .admin-table-wrap{
    width:auto!important;
    margin-left:var(--admin-panel-gutter)!important;
    margin-right:var(--admin-panel-gutter)!important;
    margin-bottom:24px!important;
    border:1px solid rgba(17,19,24,.065);
    border-radius:18px;
    background:rgba(255,255,255,.52);
    scrollbar-gutter:stable;
}
.admin-page .admin-users > .admin-table-wrap .admin-table th:first-child,
.admin-page .admin-users > .admin-table-wrap .admin-table td:first-child,
.admin-page .admin-activity > .admin-table-wrap .admin-table th:first-child,
.admin-page .admin-activity > .admin-table-wrap .admin-table td:first-child,
.admin-page .admin-contact-card > .admin-table-wrap .admin-table th:first-child,
.admin-page .admin-contact-card > .admin-table-wrap .admin-table td:first-child,
.admin-page .admin-telemetry-card > .admin-table-wrap .admin-table th:first-child,
.admin-page .admin-telemetry-card > .admin-table-wrap .admin-table td:first-child{
    padding-left:20px;
}
.admin-page .admin-users > .admin-table-wrap .admin-table th:last-child,
.admin-page .admin-users > .admin-table-wrap .admin-table td:last-child,
.admin-page .admin-activity > .admin-table-wrap .admin-table th:last-child,
.admin-page .admin-activity > .admin-table-wrap .admin-table td:last-child,
.admin-page .admin-contact-card > .admin-table-wrap .admin-table th:last-child,
.admin-page .admin-contact-card > .admin-table-wrap .admin-table td:last-child,
.admin-page .admin-telemetry-card > .admin-table-wrap .admin-table th:last-child,
.admin-page .admin-telemetry-card > .admin-table-wrap .admin-table td:last-child{
    padding-right:20px;
}

/* Productos y juegos: más aire entre el marco de la tarjeta y las filas. */
.admin-page .admin-catalog-card > .admin-catalog-list,
.admin-page .admin-catalog-card > .admin-game-admin-list{
    margin-top:10px!important;
    margin-bottom:28px!important;
}

/* Telemetría: evita que KPIs, barras y paginación queden pegados al borde. */
.admin-page .admin-telemetry-card > .admin-telemetry-mini-grid,
.admin-page .admin-telemetry-card > .admin-telemetry-feature-grid{
    margin-top:4px!important;
}
.admin-page .admin-telemetry-card > .admin-telemetry-subhead,
.admin-page .admin-telemetry-card > .admin-telemetry-table-head{
    margin-top:24px!important;
}
.admin-page .admin-telemetry-card > .admin-telemetry-note{
    margin-bottom:24px!important;
}
.admin-page .admin-telemetry-card > .admin-pagination,
.admin-page .admin-users > .admin-pagination,
.admin-page .admin-activity > .admin-pagination,
.admin-page .admin-contact-card > .admin-pagination{
    margin-bottom:24px!important;
}

/* Usuarios y señales de multicuenta son dos paneles independientes, ambos a
   todo el ancho. Esto elimina el scroll innecesario provocado por la columna
   lateral estrecha y da más espacio a las acciones de cuenta. */
.admin-page .admin-accounts-layout{
    grid-template-columns:minmax(0,1fr)!important;
    gap:22px!important;
}
.admin-page .admin-accounts-layout > .admin-users,
.admin-page .admin-accounts-layout > .admin-multiaccounts-card{
    width:100%;
    min-width:0;
}
.admin-page .admin-multiaccounts-card{
    padding:28px var(--admin-panel-gutter)!important;
}
.admin-page .admin-multiaccounts-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:24px;
}
.admin-page .admin-multiaccounts-head > div{
    min-width:0;
}
.admin-page .admin-multiaccounts-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    flex:0 0 auto;
    padding:0 12px;
    border:1px solid rgba(17,19,24,.07);
    border-radius:999px;
    background:#f7f8fa;
    color:#7d8694;
    font-size:10px;
    font-weight:800;
    white-space:nowrap;
}
.admin-page .admin-multiaccounts-card .admin-multi-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:22px;
    padding-top:0;
    border-top:0;
}
.admin-page .admin-multiaccounts-card .admin-multi-item{
    min-width:0;
    padding:14px 16px;
    border:1px solid rgba(17,19,24,.065);
    border-radius:16px;
    background:#fafbfc;
}
.admin-page .admin-multiaccounts-card .admin-multi-item:last-child{
    border-bottom:1px solid rgba(17,19,24,.065);
}
.admin-page .admin-multiaccounts-card .admin-empty{
    grid-column:1/-1;
    margin:0;
    padding:18px;
    border:1px dashed rgba(17,19,24,.08);
    border-radius:15px;
    background:#fafbfc;
}

/* El contenido de salud y tarjetas ya acolchadas mantiene su padding propio;
   solo sincronizamos el eje de cabecera para evitar dobles gutters. */
.admin-page .admin-system-card > .admin-card-head,
.admin-page .admin-real-chart > .admin-card-head,
.admin-page .admin-security-center > .admin-card-head,
.admin-page .admin-rate-card > .admin-card-head,
.admin-page .admin-user-detail > .admin-card-head{
    padding-left:0!important;
    padding-right:0!important;
}

@media(max-width:900px){
    .admin-page .admin-multiaccounts-card .admin-multi-list{
        grid-template-columns:1fr;
    }
}
@media(max-width:700px){
    .admin-page{
        --admin-panel-gutter:var(--admin-panel-gutter-mobile);
    }
    .admin-page .admin-card > .admin-card-head{
        padding-left:var(--admin-panel-gutter)!important;
        padding-right:var(--admin-panel-gutter)!important;
    }
    .admin-page .admin-system-card > .admin-card-head,
    .admin-page .admin-real-chart > .admin-card-head,
    .admin-page .admin-security-center > .admin-card-head,
    .admin-page .admin-rate-card > .admin-card-head,
    .admin-page .admin-user-detail > .admin-card-head{
        padding-left:0!important;
        padding-right:0!important;
    }
    .admin-page .admin-users > .admin-table-wrap,
    .admin-page .admin-activity > .admin-table-wrap,
    .admin-page .admin-contact-card > .admin-table-wrap,
    .admin-page .admin-telemetry-card > .admin-table-wrap{
        margin-bottom:18px!important;
        border-radius:15px;
    }
    .admin-page .admin-multiaccounts-card{
        padding:22px var(--admin-panel-gutter)!important;
    }
    .admin-page .admin-multiaccounts-head{
        flex-direction:column;
        gap:12px;
    }
}

/* ========================================================================== 
   V244 · ADMIN — Salud económica + paginación en directo
   ========================================================================== */
.admin-telemetry-kpis{
    grid-template-columns:repeat(6,minmax(0,1fr));
}
.admin-economy-kpis{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
}
.admin-economy-kpis .is-ratio{
    background:linear-gradient(145deg,#fffaf0,#fffdf8);
    border-color:rgba(245,158,11,.16);
}
.admin-economy-health-status{
    min-height:34px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:0 12px;
    border:1px solid rgba(17,19,24,.08);
    border-radius:999px;
    background:#f7f8fa;
    color:#6f7885;
    font:800 9px var(--font-display);
    white-space:nowrap;
}
.admin-economy-health-status i,
.admin-economy-health-callout>i{
    width:8px;
    height:8px;
    flex:0 0 8px;
    border-radius:50%;
    background:#a6afba;
}
.admin-economy-health-status.is-healthy{
    border-color:rgba(34,197,94,.18);
    background:#f0fbf4;
    color:#28734a;
}
.admin-economy-health-status.is-healthy i,
.admin-economy-health-callout.is-healthy>i{background:#22c55e}
.admin-economy-health-status.is-warning{
    border-color:rgba(245,158,11,.22);
    background:#fff8e8;
    color:#96610c;
}
.admin-economy-health-status.is-warning i,
.admin-economy-health-callout.is-warning>i{background:#f59e0b}
.admin-economy-health-callout{
    display:flex;
    align-items:flex-start;
    gap:11px;
    margin:16px var(--admin-panel-gutter,30px) 0;
    padding:13px 15px;
    border:1px solid rgba(17,19,24,.07);
    border-radius:16px;
    background:#f8f9fa;
}
.admin-economy-health-callout>i{margin-top:4px}
.admin-economy-health-callout strong{
    display:block;
    color:#282d34;
    font:800 11px var(--font-display);
}
.admin-economy-health-callout p{
    margin:4px 0 0;
    color:#747f8d;
    font-size:10px;
    line-height:1.5;
}
.admin-economy-health-callout.is-healthy{
    border-color:rgba(34,197,94,.14);
    background:#f5fcf7;
}
.admin-economy-health-callout.is-warning{
    border-color:rgba(245,158,11,.18);
    background:#fffaf0;
}
.admin-economy-shield-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.admin-economy-balance-bars{
    padding-bottom:2px;
}
.admin-pagination.is-loading{
    opacity:.55;
    pointer-events:none;
}
.admin-pagination-target-loading{
    position:relative;
}
.admin-pagination-target-loading::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:15;
    border-radius:inherit;
    background:rgba(255,255,255,.45);
    pointer-events:none;
}
@media(max-width:1180px){
    .admin-telemetry-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
    .admin-economy-kpis{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:760px){
    .admin-economy-kpis,
    .admin-economy-shield-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .admin-economy-health-callout{margin-left:var(--admin-panel-gutter-mobile,18px);margin-right:var(--admin-panel-gutter-mobile,18px)}
}
@media(max-width:430px){
    .admin-economy-kpis,
    .admin-economy-shield-grid{grid-template-columns:1fr!important}
    .admin-economy-health-status{white-space:normal;text-align:left}
}

/* ========================================================================== 
   V256 · Menú móvil público — misma profundidad visual que la sesión
   ========================================================================== */
@media (max-width:1050px) {
    .mobile-guest-actions{
        display:grid;
        gap:10px;
    }

    .mobile-navigation .mobile-guest-actions .mobile-session-action{
        display:grid;
        grid-template-columns:44px minmax(0,1fr) 28px;
        align-items:center;
        gap:12px;
        min-height:70px;
        padding:10px 12px;
        border:1px solid rgba(17,19,24,.07);
        border-radius:18px;
        background:rgba(255,255,255,.84);
        color:#111318;
        box-shadow:0 8px 24px rgba(17,19,24,.04),inset 0 1px 0 rgba(255,255,255,.9);
        transform:none;
    }
    .mobile-navigation .mobile-guest-actions .mobile-session-action:hover{
        background:#fff;
        color:#111318;
        transform:none;
        border-color:rgba(245,158,11,.20);
        box-shadow:0 10px 26px rgba(17,19,24,.055);
    }
    .mobile-navigation .mobile-guest-actions .mobile-session-action.is-active{
        background:linear-gradient(135deg,#fffaf0,#fff5df);
        border-color:rgba(245,158,11,.26);
    }

    .mobile-guest-games .mobile-session-icon{
        background:linear-gradient(145deg,#fff0d3,#ffd99d);
        color:#f08a0c;
    }
    .mobile-guest-demo .mobile-session-icon{
        background:linear-gradient(145deg,#fff6d5,#ffe39b);
        color:#c98500;
    }
    .mobile-guest-method .mobile-session-icon{
        background:linear-gradient(145deg,#e3f9ee,#c9f0dd);
        color:#15975b;
    }
    .mobile-guest-progress .mobile-session-icon{
        background:linear-gradient(145deg,#efe6ff,#dfcffd);
        color:#7b4bd4;
    }
    .mobile-guest-blog .mobile-session-icon{
        background:linear-gradient(145deg,#fff1cd,#ffe09a);
        color:#b87100;
    }

    .mobile-navigation .mobile-guest-login{
        display:grid;
        grid-template-columns:40px minmax(0,1fr) 28px;
        align-items:center;
        gap:11px;
        min-height:62px;
        padding:8px 11px;
        border:1px solid rgba(17,19,24,.07);
        border-radius:17px;
        background:rgba(255,255,255,.94);
        color:#111318;
        box-shadow:0 9px 22px rgba(17,19,24,.055);
        transform:none;
    }
    .mobile-navigation .mobile-guest-login:hover{
        background:#fff;
        color:#111318;
        transform:none;
        border-color:rgba(75,121,207,.20);
    }
    .mobile-guest-login-icon{
        width:40px;
        height:40px;
        display:grid;
        place-items:center;
        border-radius:13px;
        background:linear-gradient(145deg,#e6efff,#d7e5ff);
        color:#4171ce;
    }
    .mobile-guest-login-icon svg{
        width:19px;
        height:19px;
        fill:none;
        stroke:currentColor;
        stroke-width:1.8;
        stroke-linecap:round;
        stroke-linejoin:round;
    }
    .mobile-guest-login-copy{
        display:grid;
        gap:2px;
        min-width:0;
    }
    .mobile-navigation .mobile-guest-login-copy strong{
        color:#1e2229;
        font:700 13.5px var(--font-display);
        letter-spacing:-.02em;
    }
    .mobile-navigation .mobile-guest-login-copy small{
        color:#758090;
        font:500 10px/1.35 var(--font-body);
        letter-spacing:0;
    }

    .mobile-navigation .mobile-navigation-cta.mobile-guest-register{
        display:grid;
        grid-template-columns:40px minmax(0,1fr);
        align-items:center;
        justify-content:stretch;
        gap:11px;
        min-height:62px;
        margin-top:9px;
        padding:8px 14px 8px 9px;
        border:1px solid rgba(255,255,255,.44);
        border-radius:17px;
        background:linear-gradient(135deg,#ffb842 0%,#ff8b24 54%,#f97316 100%);
        color:#fff;
        box-shadow:0 13px 27px rgba(249,115,22,.22),inset 0 1px 0 rgba(255,255,255,.42);
    }
    .mobile-navigation .mobile-navigation-cta.mobile-guest-register:hover{
        transform:none;
        color:#fff;
        background:linear-gradient(135deg,#ffc04c 0%,#ff9630 54%,#ff7b19 100%);
    }
    .mobile-guest-register-icon{
        width:40px;
        height:40px;
        display:grid;
        place-items:center;
        border-radius:13px;
        background:rgba(255,255,255,.17);
        color:#fff;
        border:1px solid rgba(255,255,255,.35);
        box-shadow:inset 0 1px 0 rgba(255,255,255,.24);
    }
    .mobile-guest-register-icon svg{
        width:19px;
        height:19px;
        fill:none;
        stroke:currentColor;
        stroke-width:1.8;
        stroke-linecap:round;
        stroke-linejoin:round;
    }
    .mobile-guest-register-copy{
        display:grid;
        gap:2px;
        min-width:0;
        text-align:left;
    }
    .mobile-navigation .mobile-guest-register-copy strong{
        color:#fff;
        font:800 13.5px var(--font-display);
        letter-spacing:-.02em;
    }
    .mobile-navigation .mobile-guest-register-copy small{
        color:rgba(255,255,255,.86);
        font:600 9.5px/1.35 var(--font-body);
        letter-spacing:0;
    }
}

@media (max-width:520px) {
    .mobile-navigation .mobile-guest-actions .mobile-session-action{
        grid-template-columns:42px minmax(0,1fr) 26px;
        min-height:66px;
        padding:9px 10px;
        gap:10px;
        border-radius:16px;
    }
    .mobile-navigation .mobile-guest-login,
    .mobile-navigation .mobile-navigation-cta.mobile-guest-register{
        min-height:58px;
        border-radius:16px;
    }
}


/* ========================================================================== 
   V257 · Navegación pública de escritorio
   Acciones de acceso y registro con la misma jerarquía visual del producto.
   ========================================================================== */
@media (min-width:1051px){
    .nav-actions-guest{
        margin-left:auto;
        gap:8px!important;
        flex:none;
    }
    .nav-guest-btn{
        min-height:46px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        gap:9px;
        padding:5px 15px 5px 6px;
        border:1px solid rgba(17,19,24,.09);
        border-radius:999px;
        background:rgba(255,255,255,.9);
        color:#555f6e;
        text-decoration:none;
        font:800 12px/1 var(--font-display);
        box-shadow:0 8px 20px rgba(17,19,24,.055),inset 0 1px 0 rgba(255,255,255,.95);
        transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease;
        white-space:nowrap;
    }
    .nav-guest-icon{
        width:34px;
        height:34px;
        flex:0 0 34px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        border-radius:50%;
        color:#647084;
        background:linear-gradient(145deg,#f5f7fa,#fff);
        border:1px solid rgba(17,19,24,.07);
        box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 4px 10px rgba(17,19,24,.055);
    }
    .nav-guest-icon svg{
        width:16px;
        height:16px;
        display:block;
        fill:none;
        stroke:currentColor;
        stroke-width:1.8;
        stroke-linecap:round;
        stroke-linejoin:round;
    }
    .nav-guest-register{
        padding-right:17px;
        border-color:rgba(245,158,11,.42);
        background:linear-gradient(180deg,#fff 0%,#fffaf1 100%);
        color:#8a4c00;
        box-shadow:0 9px 22px rgba(249,115,22,.11),inset 0 1px 0 rgba(255,255,255,.98);
    }
    .nav-guest-register .nav-guest-icon{
        color:#fff;
        border-color:rgba(255,255,255,.68);
        background:linear-gradient(145deg,#ffb83f 0%,#ff9228 52%,#f97316 100%);
        box-shadow:0 6px 13px rgba(249,115,22,.24),inset 0 1px 0 rgba(255,255,255,.65);
    }
    .nav-guest-register .nav-guest-icon svg{
        width:15px;
        height:15px;
        transform:translateX(.6px);
    }
    @media (hover:hover) and (pointer:fine){
        .nav-guest-btn:hover{
            transform:translateY(-1px);
            color:#111318;
            border-color:rgba(17,19,24,.15);
            background:#fff;
            box-shadow:0 12px 25px rgba(17,19,24,.08),inset 0 1px 0 #fff;
        }
        .nav-guest-register:hover{
            color:#7c4300;
            border-color:rgba(245,158,11,.68);
            background:linear-gradient(180deg,#fff 0%,#fff6e7 100%);
            box-shadow:0 13px 27px rgba(249,115,22,.16),inset 0 1px 0 #fff;
        }
    }
    .nav-guest-btn:focus-visible{
        outline:3px solid rgba(249,115,22,.28);
        outline-offset:3px;
    }
}

@media (max-width:1180px) and (min-width:1051px){
    .nav-actions-guest{gap:6px!important}
    .nav-guest-btn{padding-right:12px;gap:7px;font-size:11px}
    .nav-guest-register{padding-right:13px}
    .nav-guest-icon{width:32px;height:32px;flex-basis:32px}
}
