html,body{
    margin:0!important;
    padding:0!important;
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
    background:#2a0606;
    color:#fff;
    font-family:Arial, Helvetica, sans-serif;
}

.gxrb{
    position:fixed;
    inset:0;
    overflow:hidden;
    background:
        radial-gradient(circle at 80% 20%, rgba(255,0,50,.20), transparent 30%),
        linear-gradient(135deg, #390707, #020814 60%, #000);
    user-select:none;
}

.gxrb-bg,
.gxrb-bg-video{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    background-size:cover;
    background-position:center;
    opacity:.24;
    filter:blur(1px) brightness(.5) saturate(1.15);
    transition:opacity .3s ease;
}

.gxrb-bg-video{
    opacity:0;
}

.gxrb-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg, rgba(3,12,30,.18), rgba(0,0,0,.52)),
        radial-gradient(circle at center, transparent 35%, rgba(0,0,0,.52) 100%);
    z-index:1;
    pointer-events:none;
}

.gxrb-top{
    position:absolute;
    top:28px;
    left:42px;
    right:42px;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.gxrb-brand-title{
    font-size:34px;
    font-weight:900;
    letter-spacing:.03em;
    text-transform:uppercase;
}

.gxrb-brand-sub{
    margin-top:2px;
    font-size:13px;
    letter-spacing:.22em;
    color:#ff8a8a;
    font-weight:800;
}

.gxrb-clock{
    min-width:92px;
    padding:10px 16px;
    border-radius:999px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.12);
    text-align:center;
    font-weight:900;
    backdrop-filter:blur(10px);
}

.gxrb-view{
    position:absolute;
    inset:0;
    z-index:3;
    display:none;
}

.gxrb-view.active{
    display:block;
}

/* SYSTEMS */
.gxrb-system-main{
    position:absolute;
    top:18vh;
    left:50%;
    transform:translateX(-50%);
    width:min(900px,90vw);
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    z-index:5;
}

.gxrb-system-logo-wrap{
    width:520px;
    max-width:82vw;
    height:190px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:18px;
}

.gxrb-system-logo-wrap img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    filter:drop-shadow(0 14px 34px rgba(0,0,0,.58));
}

.gxrb-system-title{
    font-size:54px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
    text-shadow:0 8px 30px rgba(0,0,0,.55);
}

.gxrb-system-count{
    margin-top:10px;
    padding:9px 18px;
    border-radius:999px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.12);
    color:#ffd7d7;
    font-size:14px;
    font-weight:900;
    letter-spacing:.12em;
}

.gxrb-system-carousel{
    position:absolute;
    left:0;
    right:0;
    bottom:96px;
    display:flex;
    gap:34px;
    overflow-x:auto;
    padding:32px 50vw;
    scroll-behavior:smooth;
}

.gxrb-system-carousel::-webkit-scrollbar{
    display:none;
}

.gxrb-system-tile{
    flex:0 0 250px;
    height:170px;
    border:0;
    border-radius:24px;
    background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06));
    border:1px solid rgba(255,255,255,.12);
    box-shadow:0 20px 48px rgba(0,0,0,.28);
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px;
    cursor:pointer;
    opacity:.45;
    transform:scale(.84);
    transition:all .22s ease;
    backdrop-filter:blur(10px);
}

.gxrb-system-tile img{
    max-width:78%;
    max-height:92px;
    object-fit:contain;
    filter:drop-shadow(0 8px 18px rgba(0,0,0,.4));
}

.gxrb-system-tile span{
    font-weight:900;
    font-size:15px;
    text-transform:uppercase;
}

.gxrb-system-tile.near{
    opacity:.72;
    transform:scale(.94);
}

.gxrb-system-tile.active{
    opacity:1;
    transform:scale(1.16);
    background:linear-gradient(180deg, rgba(255,36,60,.38), rgba(255,255,255,.12));
    border-color:rgba(255,110,110,.78);
    box-shadow:
        0 24px 70px rgba(0,0,0,.42),
        0 0 50px rgba(255,30,55,.30);
}

/* GAMES */
.gxrb-games-view.active{
    display:grid;
    grid-template-columns:430px 1fr;
    gap:28px;
    padding:104px 42px 76px;
    box-sizing:border-box;
}

.gxrb-game-list-panel{
    min-height:0;
    border-radius:20px;
    background:rgba(0,0,0,.30);
    border:1px solid rgba(255,255,255,.10);
    backdrop-filter:blur(12px);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    box-shadow:0 20px 58px rgba(0,0,0,.35);
}

.gxrb-games-head{
    display:flex;
    align-items:center;
    gap:14px;
    padding:18px;
    border-bottom:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.045);
}

.gxrb-icon-btn{
    width:46px;
    height:46px;
    border:0;
    border-radius:12px;
    background:#ff263f;
    color:#00101e;
    font-size:24px;
    font-weight:900;
    cursor:pointer;
}

.gxrb-games-system-title{
    font-size:21px;
    font-weight:900;
}

.gxrb-games-counter{
    font-size:13px;
    color:#ffb3b3;
    margin-top:2px;
}

.gxrb-search{
    margin:14px;
    padding:14px 16px;
    border:0;
    outline:0;
    border-radius:13px;
    background:rgba(255,255,255,.10);
    color:#fff;
    font-size:15px;
}

.gxrb-game-list{
    flex:1;
    overflow:auto;
    padding:8px 12px 14px;
}

.gxrb-game-row{
    width:100%;
    min-height:62px;
    padding:12px 14px;
    margin-bottom:8px;
    border:0;
    border-radius:14px;
    background:rgba(255,255,255,.045);
    border:1px solid transparent;
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    text-align:left;
    cursor:pointer;
    transition:all .13s ease;
}

.gxrb-game-row-title{
    max-width:100%;
    font-size:16px;
    font-weight:800;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.gxrb-game-row-meta{
    margin-top:4px;
    font-size:12px;
    color:rgba(255,255,255,.52);
    text-transform:uppercase;
}

.gxrb-game-row.active{
    background:linear-gradient(90deg, #ff263f, rgba(255,38,63,.24));
    border-color:rgba(255,110,110,.72);
    color:#fff;
    transform:translateX(4px);
    box-shadow:0 10px 30px rgba(255,38,63,.20);
}

.gxrb-detail-panel{
    min-width:0;
    display:grid;
    grid-template-rows:1fr auto;
    gap:18px;
}

.gxrb-media-box{
    position:relative;
    overflow:hidden;
    border-radius:24px;
    background:rgba(0,0,0,.35);
    border:1px solid rgba(255,255,255,.10);
    box-shadow:0 20px 60px rgba(0,0,0,.32);
}

.gxrb-media-box video,
.gxrb-image{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    transition:opacity .22s ease;
}

.gxrb-media-box video{
    opacity:0;
    z-index:2;
    background:#000;
}

.gxrb-image{
    z-index:1;
}

.gxrb-no-media{
    position:absolute;
    inset:0;
    z-index:0;
    display:flex;
    align-items:center;
    justify-content:center;
    color:rgba(255,255,255,.28);
    font-size:42px;
    font-weight:900;
    letter-spacing:.12em;
}

.gxrb-game-info{
    min-height:178px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding:22px 24px;
    border-radius:22px;
    background:rgba(0,0,0,.32);
    border:1px solid rgba(255,255,255,.10);
    backdrop-filter:blur(12px);
}

.gxrb-game-title{
    font-size:36px;
    font-weight:900;
    line-height:1.05;
}

.gxrb-game-meta{
    margin-top:8px;
    color:#ff9b9b;
    font-size:13px;
    font-weight:800;
    text-transform:uppercase;
}

.gxrb-game-desc{
    margin-top:10px;
    color:rgba(255,255,255,.72);
    line-height:1.45;
}

.gxrb-actions{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.gxrb-action{
    min-width:158px;
    min-height:46px;
    border:0;
    border-radius:13px;
    background:rgba(255,255,255,.10);
    color:#fff;
    font-weight:900;
    cursor:pointer;
    border:1px solid rgba(255,255,255,.12);
}

.gxrb-action.primary{
    background:#ff263f;
    color:#00101e;
    box-shadow:0 12px 28px rgba(255,38,63,.24);
}

.gxrb-footer{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:54px;
    z-index:6;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:34px;
    background:rgba(0,0,0,.38);
    border-top:1px solid rgba(255,255,255,.10);
    color:rgba(255,255,255,.74);
    font-size:14px;
    backdrop-filter:blur(12px);
}

.gxrb-footer b{
    color:#fff;
    background:#ff263f;
    color:#00101e;
    border-radius:8px;
    padding:3px 7px;
    margin-right:5px;
}

.gxrb-loader{
    position:fixed;
    inset:0;
    z-index:80;
    display:none;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,.70);
    backdrop-filter:blur(8px);
}

.gxrb-loader.active{
    display:flex;
}

.gxrb-loader-box{
    width:min(480px,92vw);
    padding:28px;
    border-radius:22px;
    background:rgba(5,18,42,.96);
    border:1px solid rgba(255,110,110,.28);
    text-align:center;
    box-shadow:0 0 50px rgba(255,38,63,.20);
}

.gxrb-loader-title{
    font-size:32px;
    font-weight:900;
}

.gxrb-loader-game{
    margin-top:8px;
    color:#ffc4c4;
}

.gxrb-loader-bar{
    margin-top:20px;
    height:12px;
    background:rgba(255,255,255,.10);
    border-radius:999px;
    overflow:hidden;
}

.gxrb-loader-bar span{
    display:block;
    width:0;
    height:100%;
    background:#ff263f;
    transition:width .25s ease;
}

@media(max-width:900px){
    .gxrb-system-title{font-size:36px}
    .gxrb-system-tile{flex-basis:190px;height:132px}
    .gxrb-games-view.active{grid-template-columns:1fr;padding:94px 14px 62px}
    .gxrb-game-list-panel{max-height:42vh}
    .gxrb-game-info{flex-direction:column;align-items:flex-start}
    .gxrb-footer{font-size:11px;gap:10px;flex-wrap:wrap;height:auto;min-height:54px;padding:8px}
}
.gxrb-brand-logo{
    display:flex;
    align-items:center;
    justify-content:flex-start;
}

.gxrb-brand-logo img{
    height:72px; /* tamaño consola */
    max-width:220px;
    object-fit:contain;
    filter:
        drop-shadow(0 8px 18px rgba(0,0,0,.6))
        drop-shadow(0 0 12px rgba(255,40,60,.35));
    transition:transform .2s ease, filter .2s ease;
}

/* efecto vivo tipo consola */
.gxrb-brand-logo img:hover{
    transform:scale(1.05);
    filter:
        drop-shadow(0 10px 24px rgba(0,0,0,.8))
        drop-shadow(0 0 18px rgba(255,40,60,.6));
}

/* =========================================================
   GXarcade v6.30 PRO VISUAL - Responsive consola final
   ========================================================= */
html, body, .gxrb{
    min-width:0!important;
    min-height:0!important;
}

/* Oculta barras de scroll manteniendo scroll funcional */
.gxrb *{
    scrollbar-width:none;
}
.gxrb *::-webkit-scrollbar{
    width:0!important;
    height:0!important;
    display:none!important;
}

.gxrb-games-view.active{
    grid-template-columns:clamp(300px, 29vw, 460px) minmax(0, 1fr)!important;
    gap:clamp(16px, 2vw, 34px)!important;
    padding:clamp(76px, 8vh, 112px) clamp(16px, 4vw, 64px) clamp(54px, 7vh, 82px)!important;
    height:100vh!important;
    max-height:100vh!important;
    overflow:hidden!important;
}

.gxrb-game-list-panel{
    height:100%!important;
    max-height:calc(100vh - clamp(140px, 15vh, 190px))!important;
    min-height:0!important;
    overflow:hidden!important;
}

.gxrb-game-list{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-right:10px!important;
}

.gxrb-detail-panel{
    min-height:0!important;
    height:100%!important;
    display:grid!important;
    grid-template-rows:minmax(260px, 58vh) minmax(180px, 230px)!important;
    gap:clamp(12px, 2vh, 20px)!important;
    overflow:hidden!important;
}

.gxrb-media-box{
    height:100%!important;
    min-height:0!important;
    border-radius:28px!important;
    overflow:hidden!important;
    background:#000!important;
    box-shadow:0 26px 80px rgba(0,0,0,.48), 0 0 0 1px rgba(255,255,255,.08)!important;
}

.gxrb-media-box video,
.gxrb-image{
    object-fit:contain!important;
    background-color:#000!important;
}

.gxrb-game-info{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) clamp(220px, 25vw, 410px)!important;
    align-items:stretch!important;
    min-height:0!important;
    height:100%!important;
    overflow:hidden!important;
    padding:clamp(16px, 2vw, 24px)!important;
}

.gxrb-game-info > div:first-child{
    min-width:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
}

.gxrb-game-title{
    font-size:clamp(28px, 3vw, 44px)!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}

.gxrb-game-meta{
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}

.gxrb-game-desc{
    max-height:4.7em!important;
    overflow:hidden!important;
    display:-webkit-box!important;
    -webkit-line-clamp:3!important;
    -webkit-box-orient:vertical!important;
}

.gxrb-actions{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:10px!important;
    align-content:center!important;
    min-width:0!important;
    overflow:hidden!important;
}

.gxrb-action{
    min-width:0!important;
    width:100%!important;
    min-height:42px!important;
    padding:0 12px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
}

#gxrb-mute-troper[aria-pressed="true"]{
    background:rgba(255,255,255,.20)!important;
}

#gxrb-ai-pick{
    background:linear-gradient(135deg, rgba(255,38,63,.95), rgba(135,43,255,.75))!important;
    color:#fff!important;
}

#gxrb-music-toggle{
    background:rgba(38,255,160,.12)!important;
}

.gxrb-footer{
    overflow:hidden!important;
    white-space:nowrap!important;
}

@media(max-width:1100px){
    .gxrb-games-view.active{
        grid-template-columns:minmax(260px, 38vw) minmax(0, 1fr)!important;
        padding-left:16px!important;
        padding-right:16px!important;
    }
    .gxrb-game-info{
        grid-template-columns:1fr!important;
        grid-template-rows:minmax(0,1fr) auto!important;
    }
    .gxrb-actions{
        grid-template-columns:repeat(4, minmax(0,1fr))!important;
    }
}

@media(max-width:760px){
    .gxrb-top{
        top:12px!important;
        left:14px!important;
        right:14px!important;
    }
    .gxrb-brand-title{font-size:22px!important;}
    .gxrb-clock{padding:7px 10px!important;min-width:auto!important;}
    .gxrb-games-view.active{
        display:grid!important;
        grid-template-columns:1fr!important;
        grid-template-rows:30vh 30vh 1fr!important;
        gap:10px!important;
        padding:64px 10px 52px!important;
        overflow:hidden!important;
    }
    .gxrb-game-list-panel{
        max-height:30vh!important;
        height:30vh!important;
        order:2!important;
    }
    .gxrb-detail-panel{
        order:1!important;
        grid-template-rows:30vh minmax(0, 1fr)!important;
        gap:10px!important;
        height:auto!important;
    }
    .gxrb-media-box{
        height:30vh!important;
        border-radius:18px!important;
    }
    .gxrb-game-info{
        grid-template-columns:1fr!important;
        height:auto!important;
        max-height:30vh!important;
        padding:12px!important;
        border-radius:18px!important;
    }
    .gxrb-game-title{font-size:24px!important;}
    .gxrb-game-desc{
        max-height:3.1em!important;
        -webkit-line-clamp:2!important;
    }
    .gxrb-actions{
        grid-template-columns:repeat(4, minmax(0,1fr))!important;
        gap:6px!important;
    }
    .gxrb-action{
        min-height:36px!important;
        font-size:11px!important;
        padding:0 6px!important;
    }
    .gxrb-footer{
        font-size:10px!important;
        gap:6px!important;
        padding:6px!important;
    }
    .gxrb-footer span:nth-child(n+4){display:none!important;}
}

@media(min-width:1600px){
    .gxrb-games-view.active{
        grid-template-columns:520px minmax(0, 1fr)!important;
        max-width:1680px!important;
        margin:0 auto!important;
    }
    .gxrb-detail-panel{
        grid-template-rows:minmax(420px, 58vh) 240px!important;
    }
}