
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial, Helvetica, sans-serif;
}

body{
background:#060611;
color:white;
overflow-x:hidden;
}

a{
text-decoration:none;
color:white;
}

.sidebar{
width:260px;
background:#0d0d18;
min-height:100vh;
padding:30px;
position:fixed;
left:0;
top:0;
border-right:1px solid #23233b;
backdrop-filter:blur(20px);
z-index:100;
}

.logo{
font-size:38px;
font-weight:bold;
margin-bottom:40px;
}

.logo span{
color:#7b74ff;
}

.menu{
display:flex;
flex-direction:column;
gap:12px;
}

.menu a{
padding:15px;
background:#151525;
border-radius:16px;
transition:.25s;
border:1px solid transparent;
}

.menu a:hover{
background:#1d1d30;
border-color:#7b74ff55;
transform:translateY(-2px);
}

.content{
margin-left:280px;
padding:40px;
}

.page-title{
font-size:42px;
margin-bottom:12px;
}

.page-subtitle{
color:#a8a8c7;
margin-bottom:35px;
line-height:1.7;
}

.card{
background:linear-gradient(180deg,#111120,#0b0b16);
border:1px solid #252541;
border-radius:30px;
padding:28px;
margin-bottom:20px;
position:relative;
overflow:hidden;
box-shadow:0 10px 40px rgba(0,0,0,.35);
}

.card::before{
content:"";
position:absolute;
top:-100px;
right:-100px;
width:220px;
height:220px;
background:radial-gradient(circle,#7b74ff22,transparent 70%);
}

.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:24px;
}

.stats-card h1{
font-size:58px;
margin-top:10px;
}

.stats-card p{
color:#9e9eb8;
}

.glow{
color:#8f88ff;
text-shadow:0 0 20px #7b74ff;
}

.avatar{
width:140px;
height:140px;
border-radius:50%;
background:linear-gradient(135deg,#7b74ff,#ff2f92);
filter:blur(18px);
margin:auto;
margin-bottom:20px;
position:relative;
transition:.3s;
}

.reveal-25{
clip-path:inset(0 75% 0 0);
filter:blur(10px);
}

.reveal-60{
clip-path:inset(0 40% 0 0);
filter:blur(5px);
}

.level-badge{
display:inline-block;
padding:10px 16px;
background:#17172a;
border:1px solid #353560;
border-radius:100px;
font-size:13px;
margin-bottom:15px;
}

.progress-area{
margin-top:25px;
}

.progress-bar{
width:100%;
height:14px;
background:#0b0b14;
border-radius:100px;
overflow:hidden;
border:1px solid #202038;
}

.progress-fill{
height:100%;
background:linear-gradient(90deg,#7b74ff,#ff2f92);
border-radius:100px;
}

.level-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
margin-top:25px;
}

.level-card{
background:#10101d;
border:1px solid #272748;
border-radius:24px;
padding:24px;
position:relative;
overflow:hidden;
}

.level-card.locked{
opacity:.6;
}

.level-card.active{
border-color:#7b74ff;
box-shadow:0 0 30px #7b74ff25;
}

.level-card h2{
margin-bottom:10px;
}

.level-card p{
color:#b4b4cc;
line-height:1.7;
}

.lock{
position:absolute;
top:20px;
right:20px;
font-size:22px;
}

.compatibility-circle{
width:170px;
height:170px;
border-radius:50%;
margin:auto;
display:flex;
justify-content:center;
align-items:center;
font-size:42px;
font-weight:bold;
background:
conic-gradient(#7b74ff 0% 78%, #202036 78% 100%);
box-shadow:0 0 40px #7b74ff25;
}

.compatibility-info{
margin-top:25px;
display:grid;
grid-template-columns:1fr 1fr;
gap:14px;
}

.info-box{
background:#141424;
padding:18px;
border-radius:18px;
border:1px solid #252541;
}

.info-box h3{
font-size:14px;
color:#9f9fc2;
margin-bottom:8px;
}

.info-box strong{
font-size:20px;
}

.match-card{
text-align:center;
}

.question-box{
margin-top:25px;
padding:22px;
background:#0d0d18;
border-radius:22px;
border:1px solid #242441;
}

.question-box h3{
margin-bottom:15px;
}

.emoji-row{
display:flex;
gap:12px;
flex-wrap:wrap;
margin-top:12px;
}

.emoji{
padding:14px 18px;
background:#17172a;
border-radius:18px;
font-size:26px;
border:1px solid #2c2c52;
}

.blur-photo{
width:100%;
height:220px;
border-radius:24px;
background:
linear-gradient(135deg,#7b74ff,#ff2f92);
filter:blur(14px);
margin-bottom:18px;
position:relative;
overflow:hidden;
}

.blur-photo::after{
content:"DESBLOQUEA SU IDENTIDAD";
position:absolute;
bottom:15px;
left:15px;
font-size:13px;
letter-spacing:1px;
background:#00000088;
padding:10px 14px;
border-radius:100px;
backdrop-filter:blur(10px);
}

.btn{
padding:14px 24px;
border:none;
border-radius:14px;
background:linear-gradient(135deg,#7b74ff,#ff2f92);
color:white;
cursor:pointer;
font-weight:bold;
margin-top:15px;
transition:.25s;
}

.btn:hover{
transform:translateY(-2px);
box-shadow:0 10px 30px rgba(123,116,255,.35);
}

.secondary{
background:transparent;
border:1px solid #303050;
}

input,textarea{
width:100%;
padding:16px;
border:none;
border-radius:14px;
background:#080811;
color:white;
margin-top:10px;
margin-bottom:15px;
}

.auth-page{
min-height:100vh;
display:flex;
justify-content:center;
align-items:center;
padding:40px;
}

.auth-card{
width:100%;
max-width:500px;
background:#11111d;
border:1px solid #252541;
border-radius:30px;
padding:40px;
}

.auth-card h1{
font-size:56px;
margin-bottom:20px;
}

.alert{
background:#691717;
padding:14px;
border-radius:14px;
margin-bottom:20px;
}

.success{
background:#155931;
padding:14px;
border-radius:14px;
margin-bottom:20px;
}

.landing{
min-height:100vh;
display:flex;
justify-content:center;
align-items:center;
padding:60px;
background:
radial-gradient(circle at left,#7b74ff40,transparent 35%),
radial-gradient(circle at right,#ff2f9240,transparent 35%);
}

.landing-content{
max-width:900px;
text-align:center;
}

.landing h1{
font-size:82px;
line-height:1.05;
margin-bottom:25px;
}

.landing p{
font-size:24px;
line-height:1.7;
color:#d1d1d1;
margin-bottom:30px;
}

.buttons{
display:flex;
justify-content:center;
gap:15px;
}

.small-text{
font-size:13px;
color:#9c9cbc;
margin-top:10px;
}

@media(max-width:900px){

.sidebar{
position:relative;
width:100%;
min-height:auto;
}

.content{
margin-left:0;
padding:20px;
}

.landing h1{
font-size:54px;
}

.auth-card h1{
font-size:42px;
}

.compatibility-info{
grid-template-columns:1fr;
}
}


select{
width:100%;
padding:16px;
border:none;
border-radius:14px;
background:#080811;
color:white;
margin-top:10px;
margin-bottom:15px;
}


/* =========================================
FANNY.PRO V6.6 MOBILE SYSTEM
========================================= */

.mobile-topbar{
display:none;
}

.mobile-menu-btn{
background:linear-gradient(135deg,#7b74ff,#ff2f92);
border:none;
color:white;
width:50px;
height:50px;
border-radius:14px;
font-size:22px;
cursor:pointer;
box-shadow:0 10px 30px rgba(123,116,255,.3);
}

.sidebar-overlay{
display:none;
}

@media(max-width:900px){

body{
overflow-x:hidden;
}

.mobile-topbar{
display:flex;
align-items:center;
justify-content:space-between;
padding:18px;
position:sticky;
top:0;
z-index:300;
background:#070711ee;
backdrop-filter:blur(20px);
border-bottom:1px solid #202038;
}

.mobile-logo{
font-size:34px;
font-weight:bold;
}

.mobile-logo span{
color:#7b74ff;
}

.sidebar{
position:fixed;
left:-320px;
top:0;
width:290px;
height:100vh;
z-index:500;
transition:.35s;
overflow-y:auto;
box-shadow:0 0 40px rgba(0,0,0,.5);
}

.sidebar.active{
left:0;
}

.sidebar-overlay{
display:block;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:#000000aa;
backdrop-filter:blur(4px);
opacity:0;
pointer-events:none;
transition:.25s;
z-index:400;
}

.sidebar-overlay.active{
opacity:1;
pointer-events:auto;
}

.content{
margin-left:0;
padding:20px;
padding-top:30px;
}

.page-title{
font-size:54px;
line-height:1;
margin-bottom:20px;
}

.grid{
grid-template-columns:1fr;
}

.card{
padding:22px;
border-radius:24px;
}

.compatibility-info{
grid-template-columns:1fr;
}

.level-grid{
grid-template-columns:1fr;
}

.stats-card h1{
font-size:46px;
}

.blur-photo{
height:230px;
}

img{
max-width:100%;
}

.menu{
padding-bottom:40px;
}

}

/* =========================================
GUESSME V37 - VISUAL PAIR GAME MODE
========================================= */
.pair-hero{
    display:grid;
    grid-template-columns:1.35fr .65fr;
    gap:28px;
    align-items:center;
    background:
        radial-gradient(circle at 15% 10%,rgba(255,47,146,.24),transparent 28%),
        radial-gradient(circle at 85% 20%,rgba(123,116,255,.28),transparent 32%),
        linear-gradient(135deg,#131323,#090913);
    border-color:#4b3d91;
}
.mode-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 16px;
    border-radius:999px;
    background:linear-gradient(135deg,rgba(123,116,255,.35),rgba(255,47,146,.30));
    border:1px solid rgba(255,255,255,.12);
    color:#fff;
    font-size:13px;
    font-weight:800;
    letter-spacing:.8px;
    margin-bottom:18px;
    box-shadow:0 0 24px rgba(255,47,146,.20);
}
.hero-flow{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:22px;
}
.hero-flow span,.hero-flow b{
    padding:12px 14px;
    border-radius:16px;
    background:#17172a;
    border:1px solid #353560;
    font-size:14px;
}
.hero-flow b{
    background:linear-gradient(135deg,#7b74ff,#ff2f92);
    color:#fff;
}
.hero-orbit{
    min-height:250px;
    position:relative;
    border-radius:28px;
    background:rgba(9,9,20,.56);
    border:1px solid #302f57;
    overflow:hidden;
}
.hero-orbit::before{
    content:"";
    position:absolute;
    inset:35px;
    border-radius:50%;
    border:1px dashed rgba(255,255,255,.18);
    box-shadow:0 0 40px rgba(123,116,255,.16) inset;
}
.orbit-card{
    position:absolute;
    width:82px;
    height:82px;
    border-radius:24px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    font-weight:900;
    background:linear-gradient(135deg,#1d1d36,#111120);
    border:1px solid #5b55a8;
    box-shadow:0 18px 40px rgba(0,0,0,.38),0 0 24px rgba(123,116,255,.25);
}
.orbit-card.left{left:28px;top:74px;}
.orbit-card.right{right:28px;top:74px;}
.orbit-heart{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:86px;
    height:86px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:42px;
    background:linear-gradient(135deg,#7b74ff,#ff2f92);
    box-shadow:0 0 38px rgba(255,47,146,.40);
}
.orbit-lock{
    position:absolute;
    left:50%;
    bottom:22px;
    transform:translateX(-50%);
    padding:10px 15px;
    border-radius:999px;
    background:#090913cc;
    border:1px solid #3e3d72;
    font-size:13px;
    white-space:nowrap;
}
.highlight-card{
    border-color:#343060;
    background:linear-gradient(180deg,#17172b,#0b0b16);
}
.rules-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:15px;
    margin-top:22px;
}
.rule-box{
    padding:20px;
    border-radius:22px;
    background:#10101d;
    border:1px solid #29294b;
}
.rule-box strong{
    display:flex;
    width:38px;
    height:38px;
    border-radius:14px;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg,#7b74ff,#ff2f92);
    margin-bottom:14px;
}
.rule-box h3{margin-bottom:8px;}
.rule-box p{color:#aaaaca;font-size:13px;line-height:1.55;}
.pair-list{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:16px;
    margin-top:22px;
}
.pair-card{
    display:flex;
    gap:15px;
    align-items:center;
    padding:18px;
    border-radius:22px;
    background:#10101d;
    border:1px solid #2e2e55;
    transition:.25s;
}
.pair-card:hover{
    transform:translateY(-3px);
    border-color:#ff2f92;
    box-shadow:0 18px 40px rgba(255,47,146,.14);
}
.pair-avatar{
    width:58px;
    height:58px;
    border-radius:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg,#7b74ff,#ff2f92);
    font-size:28px;
    overflow:hidden;
    flex:0 0 58px;
    box-shadow:0 0 18px rgba(255,47,146,.22);
}
.pair-avatar.has-unlocked-photo{
    background:#070711;
    border:1px solid rgba(255,255,255,.14);
}
.pair-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    filter:none !important;
}
.pair-info{flex:1;}
.pair-info p{color:#aaaaca;font-size:13px;margin-top:6px;}
.pair-action{font-size:13px;color:#fff;font-weight:700;}
.mini-progress{
    width:100%;
    height:8px;
    border-radius:999px;
    overflow:hidden;
    background:#060611;
    border:1px solid #28284a;
    margin-top:10px;
}
.mini-progress span{
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,#7b74ff,#ff2f92);
}
.empty-pair-state{
    text-align:center;
    padding:32px 20px;
}
.empty-icon{font-size:58px;margin-bottom:14px;}
@media(max-width:900px){
    .pair-hero{grid-template-columns:1fr;}
    .hero-orbit{min-height:220px;}
}
.pair-private-banner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    border-color:#5a3c90;
    background:linear-gradient(135deg,#151529,#0b0b16);
}
.pair-mini-flow{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    justify-content:flex-end;
    min-width:280px;
}
.pair-mini-flow span,.pair-mini-flow b{
    padding:10px 12px;
    border-radius:14px;
    background:#10101d;
    border:1px solid #303050;
    font-size:12px;
}
.pair-mini-flow b{
    background:linear-gradient(135deg,#7b74ff,#ff2f92);
    border:0;
}
@media(max-width:900px){
    .pair-private-banner{flex-direction:column;align-items:flex-start;}
    .pair-mini-flow{justify-content:flex-start;min-width:0;}
}

/* V38 - selector de juego privado en pareja */
.selector-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    margin-bottom:24px;
    flex-wrap:wrap;
}
.game-selector-card{
    border-color:#7b5cff88;
    box-shadow:0 0 45px rgba(123,92,255,.12),0 10px 40px rgba(0,0,0,.35);
}
.player-selector-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:18px;
}
.player-option-card{
    background:linear-gradient(180deg,#111126,#0b0b18);
    border:1px solid #2b2b54;
    border-radius:24px;
    padding:18px;
    position:relative;
    overflow:hidden;
    transition:.25s ease;
}
.player-option-card:hover{
    transform:translateY(-3px);
    border-color:#ff4fd899;
    box-shadow:0 0 28px rgba(255,79,216,.14);
}
.player-option-card.has-status{
    border-color:#4b4b7a;
}
.player-topline{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:14px;
}
.player-avatar-mini{
    width:56px;
    height:56px;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    background:linear-gradient(135deg,#7b5cff,#ff4fd8);
    box-shadow:0 0 22px rgba(255,79,216,.25);
    flex-shrink:0;
}
.player-topline h3{
    margin:0 0 4px;
    font-size:20px;
}
.player-topline p,.player-bio{
    color:#b9b9d8;
    font-size:13px;
    line-height:1.5;
}
.selector-metrics{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin:16px 0;
}
.selector-metrics span{
    font-size:12px;
    padding:8px 10px;
    border-radius:999px;
    background:#17172a;
    border:1px solid #353560;
    color:#d7d7ff;
}
.full-btn{
    width:100%;
    justify-content:center;
}
button:disabled{
    opacity:.6;
    cursor:not-allowed;
}
.compact-empty{
    margin-top:10px;
}

@media(max-width:760px){
    .selector-header{display:block;}
    .selector-header .btn{margin-top:14px;width:100%;}
    .player-selector-grid{grid-template-columns:1fr;}
}

/* V39 - perfil seleccionado arriba en modo pareja */
.selected-pair-hero{
    grid-template-columns:1.15fr .85fr;
    align-items:stretch;
}
.selected-player-panel{
    display:grid;
    grid-template-columns:180px 1fr;
    gap:20px;
    align-items:center;
    background:linear-gradient(135deg,#101024,#090912);
    border:1px solid #3b3168;
    border-radius:28px;
    padding:18px;
    min-height:230px;
    box-shadow:inset 0 0 40px rgba(123,92,255,.08);
}
.selected-photo-wrap{
    position:relative;
    height:190px;
    border-radius:26px;
    overflow:hidden;
    border:1px solid #4b3f82;
    background:#111126;
    box-shadow:0 0 35px rgba(255,79,216,.13);
}
.selected-blur-photo{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:blur(10px) brightness(.86) saturate(1.18);
    transform:scale(1.08);
}
.selected-blur-placeholder{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:76px;
    background:radial-gradient(circle at center,#ff4fd866,#7b5cff33 45%,#090912 100%);
    filter:blur(.2px);
}
.selected-photo-wrap::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 20%,rgba(6,6,17,.65));
}
.selected-photo-overlay{
    position:absolute;
    left:14px;
    right:14px;
    bottom:12px;
    z-index:2;
    text-align:center;
    font-size:12px;
    font-weight:800;
    padding:9px 10px;
    border-radius:999px;
    background:rgba(10,10,22,.72);
    border:1px solid #7b74ff66;
    backdrop-filter:blur(10px);
}
.selected-player-info h2{
    font-size:30px;
    margin:10px 0 6px;
}
.selected-player-info p{
    color:#c6c6e8;
    line-height:1.55;
}
.selected-status-pill{
    display:inline-flex;
    padding:8px 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:800;
    background:linear-gradient(135deg,#1b1b36,#151525);
    border:1px solid #5550a0;
    color:#ffffff;
}
.hero-metrics{
    margin:14px 0;
}
.hero-ready-text{
    margin-bottom:14px;
}
.selected-player-card{
    border-color:#ff4fd8 !important;
    box-shadow:0 0 32px rgba(255,79,216,.20);
}
.player-option-card .btn + .btn,
.player-option-card a + a .btn,
.selected-player-info a + a .btn{
    margin-top:8px;
}
@media(max-width:1100px){
    .selected-pair-hero{grid-template-columns:1fr;}
    .selected-player-panel{grid-template-columns:160px 1fr;}
}
@media(max-width:680px){
    .selected-player-panel{grid-template-columns:1fr;}
    .selected-photo-wrap{height:240px;}
}

/* V40 - juego independiente en dashboard: preguntas + diamantes + tienda */
.pair-game-board{
    border-color:#7b5cff;
    box-shadow:0 0 45px rgba(123,92,255,.14);
}
.pair-game-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}
.diamond-wallet{
    min-width:150px;
    text-align:center;
    padding:16px;
    border-radius:22px;
    background:radial-gradient(circle at top,#7b5cff55,#111126 70%);
    border:1px solid #5b54ad;
}
.diamond-wallet strong{
    display:block;
    font-size:34px;
    color:#fff;
}
.diamond-wallet span{font-size:12px;color:#c8c8ff;}
.game-flash{
    margin:14px 0;
    padding:12px 14px;
    border-radius:16px;
    background:rgba(255,79,216,.12);
    border:1px solid rgba(255,79,216,.35);
    color:#fff;
    font-weight:700;
}
.game-layout{
    display:grid;
    grid-template-columns:1.25fr .75fr;
    gap:20px;
    align-items:start;
}
.question-chat-panel,.private-shop-panel{
    border:1px solid #302b58;
    border-radius:24px;
    padding:18px;
    background:rgba(9,9,20,.55);
}
.ask-box textarea,.inline-game-form textarea{
    width:100%;
    min-height:90px;
    margin:12px 0;
    border-radius:18px;
    border:1px solid #393369;
    background:#0c0c1a;
    color:#fff;
    padding:14px;
    resize:vertical;
}
.message-thread{
    display:flex;
    flex-direction:column;
    gap:14px;
    margin-top:18px;
    max-height:680px;
    overflow:auto;
    padding-right:5px;
}
.game-message{
    padding:16px;
    border-radius:22px;
    border:1px solid #302b58;
    background:linear-gradient(135deg,#111126,#0a0a16);
}
.mine-question{border-color:#ff4fd855;}
.partner-question{border-color:#7b5cff55;}
.message-meta{
    display:flex;
    justify-content:space-between;
    gap:10px;
    font-size:12px;
    color:#bfc0ff;
    margin-bottom:10px;
}
.status-dot{
    border-radius:999px;
    padding:4px 8px;
    background:#1b1b36;
    border:1px solid #4a4585;
    color:#fff;
}
.status-approved{background:rgba(34,197,94,.16);border-color:rgba(34,197,94,.45);}
.status-rejected{background:rgba(244,63,94,.16);border-color:rgba(244,63,94,.45);}
.status-pending_review{background:rgba(255,205,86,.16);border-color:rgba(255,205,86,.45);}
.answer-bubble{
    margin-top:12px;
    padding:13px;
    border-radius:17px;
    background:rgba(123,92,255,.12);
    border:1px solid rgba(123,92,255,.35);
    color:#e8e8ff;
}
.review-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:12px;
}
.reward-pill{
    margin-top:12px;
    display:inline-flex;
    padding:8px 12px;
    border-radius:999px;
    background:linear-gradient(135deg,#7b5cff,#ff2f9a);
    color:#fff;
    font-weight:800;
}
.shop-photo-preview{
    position:relative;
    height:210px;
    overflow:hidden;
    border-radius:24px;
    border:1px solid #473f82;
    background:#111126;
    margin:14px 0;
}
.shop-blur-photo{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:blur(13px) brightness(.78);
    transform:scale(1.08);
}
.shop-photo-preview span{
    position:absolute;
    left:14px;
    bottom:14px;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(0,0,0,.55);
    border:1px solid #ffffff33;
    font-weight:800;
}
.shop-items{display:flex;flex-direction:column;gap:12px;}
.shop-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:14px;
    border-radius:18px;
    border:1px solid #302b58;
    background:#0d0d1c;
}
.shop-item h4{margin:0 0 4px;}
.shop-item p{font-size:12px;color:#c7c7ee;line-height:1.45;}
.shop-item.unlocked{border-color:#35d07f88;background:rgba(35,208,127,.08);}
.unlocked-content{
    margin-top:8px;
    padding:9px;
    border-radius:12px;
    background:rgba(255,255,255,.06);
    font-size:12px;
    color:#fff;
}
@media(max-width:980px){
    .pair-game-header{display:block;}
    .diamond-wallet{margin-top:14px;}
    .game-layout{grid-template-columns:1fr;}
}

/* V42 - Emotes + reward per pregunta */
.ask-box{position:relative;}
.reward-corner{
    position:absolute;
    top:16px;
    right:16px;
    padding:8px 12px;
    border-radius:999px;
    background:linear-gradient(135deg,#19d7ff,#7b5cff,#ff2f9a);
    color:#fff;
    font-weight:900;
    box-shadow:0 0 22px rgba(123,92,255,.35);
    border:1px solid rgba(255,255,255,.18);
}
.emoji-picker-box{
    margin:12px 0 16px;
    padding:12px;
    border-radius:18px;
    border:1px solid #363064;
    background:rgba(123,92,255,.08);
}
.emoji-picker-title{
    font-size:12px;
    color:#d8d8ff;
    margin-bottom:10px;
    font-weight:800;
}
.emoji-picker-grid{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}
.emoji-pick-btn{
    width:42px;
    height:42px;
    border-radius:14px;
    border:1px solid #393369;
    background:#15152b;
    color:#fff;
    font-size:22px;
    cursor:pointer;
    transition:.15s ease;
}
.emoji-pick-btn:hover,.emoji-pick-btn.active{
    transform:translateY(-2px);
    border-color:#ff2f9a;
    background:linear-gradient(135deg,#7b5cff,#ff2f9a);
    box-shadow:0 0 18px rgba(255,47,154,.28);
}
.selected-emojis-line{
    margin-top:10px;
    font-size:12px;
    color:#bfc0ff;
}
.message-question-row{
    display:flex;
    gap:12px;
    align-items:flex-start;
    justify-content:space-between;
}
.message-question-row h3{margin:0;line-height:1.45;}
.message-reward-badge{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    padding:7px 10px;
    border-radius:999px;
    background:rgba(25,215,255,.12);
    border:1px solid rgba(25,215,255,.42);
    color:#fff;
    font-weight:900;
    box-shadow:0 0 18px rgba(25,215,255,.16);
}
@media(max-width:720px){
    .reward-corner{position:static;display:inline-flex;margin:8px 0 10px;}
    .message-question-row{display:block;}
    .message-reward-badge{margin-top:10px;}
}

/* V43 - consola activa por pareja y notificaciones */
.selected-player-panel{position:relative;}
.clear-selected-pair{
    position:absolute;
    top:14px;
    right:14px;
    width:30px;
    height:30px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    color:#fff;
    font-size:20px;
    font-weight:900;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.18);
    z-index:5;
    box-shadow:0 0 18px rgba(236,72,153,.25);
}
.clear-selected-pair:hover{background:linear-gradient(135deg,#8b5cf6,#ec4899);}
.game-live-stats{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin:8px 0 8px;
}
.game-live-stats span{
    padding:7px 12px;
    border-radius:999px;
    border:1px solid rgba(139,92,246,.45);
    background:rgba(139,92,246,.12);
    color:#fff;
    font-size:12px;
    font-weight:800;
}
.menu a.menu-game-link{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;}
.menu-badge{
    min-width:20px;
    height:20px;
    padding:0 6px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
    font-weight:900;
    background:linear-gradient(135deg,#8b5cf6,#ec4899);
    color:#fff;
    box-shadow:0 0 15px rgba(236,72,153,.45);
}
.hero-flow b:nth-child(2), .hero-flow b:nth-child(4){white-space:nowrap;}

/* V44 - tienda privada con fotos de galería y avisos */
.game-flash-error{
    border:1px solid rgba(255,70,110,.75)!important;
    background:linear-gradient(135deg,rgba(120,0,35,.45),rgba(255,43,112,.18))!important;
    color:#ffd7e1!important;
    box-shadow:0 0 24px rgba(255,43,112,.22);
}
.shop-gallery-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(155px,1fr));
    gap:14px;
    margin-top:14px;
}
.shop-gallery-card{
    border:1px solid rgba(142,115,255,.35);
    border-radius:22px;
    padding:12px;
    background:rgba(10,9,25,.72);
    overflow:hidden;
}
.shop-gallery-card.unlocked{
    border-color:rgba(26,255,155,.5);
    background:rgba(12,35,30,.38);
}
.shop-thumb-wrap{
    height:150px;
    border-radius:18px;
    overflow:hidden;
    position:relative;
    background:#100d22;
    margin-bottom:10px;
}
.shop-thumb{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.locked-blur{
    filter:blur(9px) brightness(.82);
    transform:scale(1.06);
}
.shop-cost-badge{
    position:absolute;
    top:10px;
    right:10px;
    padding:7px 10px;
    border-radius:999px;
    font-weight:900;
    background:linear-gradient(135deg,#22d3ff,#f030a5);
    color:white;
    box-shadow:0 0 18px rgba(240,48,165,.35);
}
.shop-lock-badge{
    position:absolute;
    left:10px;
    bottom:10px;
    padding:7px 10px;
    border-radius:999px;
    font-weight:800;
    background:rgba(0,0,0,.62);
    color:white;
    backdrop-filter:blur(8px);
}
.secret-shop-box{
    height:150px;
    border-radius:18px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:8px;
    background:radial-gradient(circle at center,rgba(240,48,165,.34),rgba(20,16,40,.95));
    border:1px solid rgba(240,48,165,.35);
    margin-bottom:10px;
}
.secret-shop-box div{font-size:40px}
.secret-shop-box strong{font-size:18px}
.secret-shop-box span{font-weight:900;color:#8ee8ff}
.photo-shop-form{
    margin-top:12px;
    padding:12px;
    border:1px solid rgba(142,115,255,.22);
    border-radius:18px;
    background:rgba(0,0,0,.18);
}
.photo-shop-form label,.shop-toggle-line{
    display:block;
    margin-top:8px;
    font-size:12px;
    color:#d8d3ff;
    font-weight:800;
}
.photo-shop-form input[type="text"],.photo-shop-form input[type="number"]{
    width:100%;
    margin-top:5px;
    padding:10px 12px;
    border-radius:12px;
    border:1px solid rgba(142,115,255,.3);
    background:#080714;
    color:#fff;
}
.shop-toggle-line input{width:auto;margin-right:6px}

/* V45: reglas del juego ocultas en botón de información para no estorbar el dashboard */
.game-info-gear{
    margin:16px 0 0;
    border-radius:22px;
    border:1px solid #312d62;
    background:linear-gradient(180deg,#121224,#090912);
    overflow:hidden;
}
.game-info-gear summary{
    list-style:none;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:12px 18px;
    margin:14px;
    border-radius:999px;
    border:1px solid #4b3f83;
    background:linear-gradient(135deg,rgba(123,116,255,.35),rgba(255,47,146,.35));
    color:#fff;
    font-weight:900;
    letter-spacing:.4px;
    width:max-content;
    box-shadow:0 0 24px rgba(255,47,146,.12);
}
.game-info-gear summary::-webkit-details-marker{display:none;}
.game-info-gear summary span{
    display:inline-flex;
    width:26px;
    height:26px;
    border-radius:50%;
    align-items:center;
    justify-content:center;
    background:#111126;
    border:1px solid #59518f;
}
.game-info-gear:not([open]){
    background:transparent;
    border:0;
}
.compact-rules-grid{
    padding:0 18px 18px;
    margin-top:0;
}
.compact-rules-grid .rule-box{
    padding:16px;
    border-radius:18px;
}
.compact-rules-grid .rule-box strong{
    width:32px;
    height:32px;
    border-radius:12px;
    margin-bottom:10px;
}

/* V46: estadísticas secundarias dentro de ajustes para limpiar el dashboard */
.dashboard-settings-panel{
    margin:18px 0 22px;
}
.settings-section-title{
    padding:0 18px 10px;
    color:#fff;
    font-weight:900;
    font-size:16px;
}
.settings-stats-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    padding:0 18px 18px;
}
.settings-stat-box{
    border:1px solid #312d62;
    background:rgba(12,12,26,.75);
    border-radius:18px;
    padding:16px;
}
.settings-stat-box p{
    color:#cfcaff;
    margin:0 0 8px;
}
.settings-stat-box h2{
    margin:0 0 8px;
    font-size:32px;
    color:#fff;
}
.settings-stat-box span{
    color:#c9c6ff;
    font-size:12px;
}
.compact-progress{margin-top:8px;margin-bottom:8px;}
@media(max-width:900px){
    .settings-stats-grid{grid-template-columns:1fr;}
}

/* V47: modal de foto desbloqueada en pantalla completa + personalización con emotes */
.unlocked-photo-open{
    display:block;
    width:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:pointer;
    border-radius:18px;
    overflow:hidden;
}
.unlocked-photo-open:focus{
    outline:2px solid #8ee8ff;
    outline-offset:3px;
}
body.modal-open{overflow:hidden;}
.photo-play-modal{
    position:fixed;
    inset:0;
    z-index:9999;
    display:none;
    align-items:center;
    justify-content:center;
    padding:22px;
}
.photo-play-modal.active{display:flex;}
.photo-play-backdrop{
    position:absolute;
    inset:0;
    background:rgba(2,2,10,.86);
    backdrop-filter:blur(10px);
}
.photo-play-box{
    position:relative;
    z-index:2;
    width:min(980px,96vw);
    max-height:94vh;
    overflow:auto;
    border:1px solid rgba(142,115,255,.55);
    border-radius:28px;
    background:linear-gradient(180deg,#15142b,#070711);
    box-shadow:0 0 50px rgba(142,115,255,.24),0 0 80px rgba(255,47,146,.16);
    padding:18px;
}
.photo-play-close{
    position:absolute;
    top:14px;
    right:14px;
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.18);
    background:linear-gradient(135deg,#8b6cff,#ff2f92);
    color:#fff;
    font-size:28px;
    line-height:38px;
    cursor:pointer;
    z-index:4;
}
.photo-play-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:0 52px 14px 0;
}
.photo-play-header h2{margin:10px 0 0;color:#fff;}
.photo-stage{
    position:relative;
    width:100%;
    min-height:360px;
    border-radius:24px;
    overflow:hidden;
    background:#05050d;
    border:1px solid rgba(142,115,255,.28);
    display:flex;
    align-items:center;
    justify-content:center;
}
.photo-stage img{
    max-width:100%;
    max-height:70vh;
    display:block;
    object-fit:contain;
}
.photo-sticker-layer{
    position:absolute;
    inset:0;
    pointer-events:none;
}
.photo-sticker{
    position:absolute;
    transform:translate(-50%,-50%);
    font-size:46px;
    filter:drop-shadow(0 8px 18px rgba(0,0,0,.65));
    cursor:grab;
    pointer-events:auto;
    user-select:none;
    touch-action:none;
}
.photo-sticker:active{cursor:grabbing;}
.photo-sticker-toolbar{
    margin-top:14px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px;
    padding:12px;
    border-radius:20px;
    border:1px solid rgba(142,115,255,.22);
    background:rgba(0,0,0,.22);
}
.photo-sticker-toolbar span{
    font-size:13px;
    color:#dcd8ff;
    font-weight:900;
    margin-right:4px;
}
.photo-sticker-toolbar button{
    width:42px;
    height:42px;
    border-radius:14px;
    border:1px solid rgba(142,115,255,.38);
    background:#15142b;
    color:#fff;
    font-size:22px;
    cursor:pointer;
}
.photo-sticker-toolbar button:hover{
    transform:translateY(-1px);
    box-shadow:0 0 16px rgba(255,47,146,.22);
}
.modal-help-text{margin:10px 2px 0;}
@media(max-width:700px){
    .photo-play-box{padding:14px;border-radius:22px;}
    .photo-stage{min-height:260px;}
    .photo-sticker{font-size:36px;}
    .photo-play-header{align-items:flex-start;flex-direction:column;padding-right:48px;}
}

/* V48: historial compacto + tienda separada por tipo */
.answered-more-box{
    margin-top:14px;
    border:1px solid rgba(142,115,255,.32);
    background:rgba(10,10,24,.62);
    border-radius:20px;
    overflow:hidden;
}
.answered-more-box summary{
    cursor:pointer;
    padding:14px 16px;
    color:#fff;
    font-weight:900;
    background:linear-gradient(135deg,rgba(123,116,255,.22),rgba(255,47,146,.16));
}
.answered-more-box summary::-webkit-details-marker{display:none;}
.archived-message{
    margin:12px;
    opacity:.95;
}
.shop-section-title{
    color:#fff;
    font-size:16px;
    margin:18px 0 10px;
    padding:8px 12px;
    border:1px solid rgba(142,115,255,.28);
    border-radius:14px;
    background:rgba(255,255,255,.04);
}
.video-thumb-wrap .shop-thumb,
.unlocked-video-open{
    width:100%;
    height:100%;
    display:block;
    border:0;
    padding:0;
    background:transparent;
    cursor:pointer;
    border-radius:18px;
    overflow:hidden;
}
.shop-video-locked{
    width:100%;
    height:140px;
    border-radius:18px;
    background:radial-gradient(circle at center,rgba(142,232,255,.28),rgba(255,47,146,.15),rgba(5,5,13,.95));
    filter:blur(.2px);
    display:flex;
    align-items:center;
    justify-content:center;
}
.shop-video-locked span{
    display:flex;
    align-items:center;
    justify-content:center;
    width:54px;
    height:54px;
    border-radius:50%;
    color:#fff;
    font-size:26px;
    background:rgba(0,0,0,.42);
    border:1px solid rgba(255,255,255,.25);
    box-shadow:0 0 30px rgba(142,232,255,.22);
}
.video-play-box video,
#video-play-el{
    width:100%;
    max-height:75vh;
    border-radius:22px;
    background:#000;
    display:block;
}
.gallery-section-title{
    margin:28px 0 14px;
    color:#fff;
}

/* V49: botones bonitos y modales para subir foto/video */
.upload-actions-card{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
    margin:24px 0 28px;
}
.upload-modal-btn{
    min-height:110px;
    border:1px solid rgba(142,115,255,.42);
    border-radius:28px;
    background:linear-gradient(135deg,rgba(139,108,255,.26),rgba(255,47,146,.16),rgba(10,10,24,.92));
    color:#fff;
    display:flex;
    align-items:center;
    gap:16px;
    text-align:left;
    padding:22px;
    cursor:pointer;
    box-shadow:0 18px 36px rgba(0,0,0,.22);
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.upload-modal-btn:hover{
    transform:translateY(-2px);
    border-color:rgba(255,47,146,.72);
    box-shadow:0 0 30px rgba(255,47,146,.18),0 18px 40px rgba(0,0,0,.32);
}
.upload-modal-icon{
    width:58px;
    height:58px;
    border-radius:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    background:linear-gradient(135deg,#8b6cff,#ff2f92);
    box-shadow:0 0 22px rgba(255,47,146,.28);
    flex:0 0 auto;
}
.upload-modal-btn strong{
    display:block;
    font-size:18px;
    margin-bottom:6px;
}
.upload-modal-btn small{
    display:block;
    color:#dcd8ff;
    line-height:1.45;
}
.gallery-upload-modal{
    position:fixed;
    inset:0;
    z-index:9999;
    display:none;
    align-items:center;
    justify-content:center;
    padding:22px;
}
.gallery-upload-modal.active{display:flex;}
.gallery-upload-backdrop{
    position:absolute;
    inset:0;
    background:rgba(2,2,10,.86);
    backdrop-filter:blur(10px);
}
.gallery-upload-box{
    position:relative;
    z-index:2;
    width:min(660px,96vw);
    max-height:92vh;
    overflow:auto;
    border:1px solid rgba(142,115,255,.55);
    border-radius:30px;
    background:linear-gradient(180deg,#17162d,#070711);
    padding:26px;
    box-shadow:0 0 50px rgba(142,115,255,.24),0 0 80px rgba(255,47,146,.16);
}
.gallery-upload-box h2{
    color:#fff;
    margin:0 48px 8px 0;
}
.gallery-upload-close{
    position:absolute;
    top:16px;
    right:16px;
    width:40px;
    height:40px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.18);
    background:linear-gradient(135deg,#8b6cff,#ff2f92);
    color:#fff;
    font-size:26px;
    line-height:36px;
    cursor:pointer;
}
.modal-upload-form{
    margin-top:18px;
}
@media(max-width:760px){
    .upload-actions-card{grid-template-columns:1fr;}
    .gallery-upload-box{padding:20px;border-radius:24px;}
}

/* V51 - notificación llamativa del juego emocional */
.menu a.menu-game-link.has-game-alert{
    border:1px solid rgba(56,189,248,.55);
    background:linear-gradient(135deg,rgba(56,189,248,.16),rgba(236,72,153,.18));
    box-shadow:0 0 22px rgba(56,189,248,.18), inset 0 0 18px rgba(236,72,153,.08);
    animation:gameMenuPulse 1.35s ease-in-out infinite;
}
.menu-bell{
    margin-left:auto;
    font-size:15px;
    filter:drop-shadow(0 0 8px rgba(255,255,255,.5));
    animation:bellRing 1.05s ease-in-out infinite;
    transform-origin:50% 0%;
}
.menu a.menu-game-link.has-game-alert .menu-badge{
    background:linear-gradient(135deg,#06b6d4,#ec4899);
    box-shadow:0 0 18px rgba(56,189,248,.65),0 0 22px rgba(236,72,153,.45);
    animation:badgePop 1s ease-in-out infinite;
}
@keyframes gameMenuPulse{
    0%,100%{transform:translateX(0);box-shadow:0 0 14px rgba(56,189,248,.14), inset 0 0 18px rgba(236,72,153,.08);}
    50%{transform:translateX(3px);box-shadow:0 0 28px rgba(56,189,248,.32), inset 0 0 24px rgba(236,72,153,.14);}
}
@keyframes bellRing{
    0%,100%{transform:rotate(0deg) scale(1);}
    15%{transform:rotate(18deg) scale(1.08);}
    30%{transform:rotate(-16deg) scale(1.08);}
    45%{transform:rotate(11deg) scale(1.04);}
    60%{transform:rotate(-8deg) scale(1.02);}
}
@keyframes badgePop{
    0%,100%{transform:scale(1);}
    50%{transform:scale(1.18);}
}

/* V52 - secretos configurables por usuario */
.secret-preview-box{
    min-height:170px;
    border-radius:24px;
    border:1px solid rgba(236,72,153,.38);
    background:radial-gradient(circle at 50% 20%,rgba(236,72,153,.34),rgba(15,13,30,.96));
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    margin-bottom:16px;
    text-align:center;
    box-shadow:inset 0 0 28px rgba(236,72,153,.08);
}
.secret-preview-icon{font-size:46px;filter:drop-shadow(0 0 12px rgba(236,72,153,.45));}
.secret-preview-box strong{font-size:18px;color:#fff;}
.secret-preview-box span{font-weight:900;color:#8ee8ff;}
.photo-shop-form textarea,
.modal-upload-form textarea{
    width:100%;
    border-radius:14px;
    border:1px solid rgba(139,108,255,.38);
    background:#080713;
    color:#fff;
    padding:12px 14px;
    outline:none;
    resize:vertical;
}
.unlocked-content{
    border:1px solid rgba(56,189,248,.35);
    background:rgba(56,189,248,.08);
    border-radius:16px;
    padding:12px;
    color:#e9f8ff;
    font-size:13px;
    line-height:1.45;
}

/* GuessMe V55 - miniaturas desbloqueadas también en Descubrir y panel superior */
.discover-card-photo{
    width:100%;
    height:260px;
    object-fit:cover;
    border-radius:24px;
    margin-bottom:15px;
    display:block;
}
.discover-card-photo.locked{
    filter:blur(18px) brightness(.82) saturate(1.18);
    transform:scale(1.01);
}
.discover-card-photo.unlocked{
    filter:none !important;
    box-shadow:0 0 28px rgba(255,47,146,.20);
}
.selected-unlocked-photo{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:none !important;
    transform:none !important;
}

/* V56 - scroll automático y foco visual de la notificación real */
.notification-card-focus{
    border-color:#38bdf8 !important;
    box-shadow:0 0 0 1px rgba(56,189,248,.55),0 0 34px rgba(56,189,248,.26),0 0 44px rgba(236,72,153,.20), inset 0 0 30px rgba(236,72,153,.08) !important;
    animation:notificationCardShake 1.15s ease-in-out infinite, notificationCardGlow 1.4s ease-in-out infinite;
}
.notification-card-focus::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    border-radius:inherit;
    background:linear-gradient(120deg,rgba(56,189,248,.16),rgba(236,72,153,.12),rgba(123,92,255,.14));
    opacity:.9;
}
.notification-main-btn,
.notification-button-hit{
    position:relative;
    z-index:2;
    box-shadow:0 0 24px rgba(236,72,153,.48),0 0 34px rgba(56,189,248,.24) !important;
    animation:notificationButtonBounce .85s ease-in-out infinite;
}
.notification-main-btn::after{
    content:"🔔";
    position:absolute;
    right:14px;
    top:50%;
    transform:translateY(-50%);
    filter:drop-shadow(0 0 8px rgba(255,255,255,.75));
    animation:bellRing 1s ease-in-out infinite;
}
.notification-scroll-hit{
    outline:2px solid rgba(56,189,248,.65);
    outline-offset:5px;
}
@keyframes notificationCardShake{
    0%,100%{transform:translateX(0) translateY(0) rotate(0deg);}
    15%{transform:translateX(2px) rotate(.25deg);}
    30%{transform:translateX(-2px) rotate(-.25deg);}
    45%{transform:translateX(1px) translateY(-1px);}
    60%{transform:translateX(-1px) translateY(1px);}
}
@keyframes notificationCardGlow{
    0%,100%{filter:brightness(1);}
    50%{filter:brightness(1.12);}
}
@keyframes notificationButtonBounce{
    0%,100%{transform:translateY(0) scale(1);}
    50%{transform:translateY(-2px) scale(1.025);}
}
@media(max-width:760px){
    .notification-card-focus{animation:notificationCardGlow 1.4s ease-in-out infinite;}
}


/* V58 - foco automático también para tarjetas de Tus juegos de pareja */
.pair-card.notification-card-focus{
    position:relative;
    overflow:hidden;
    border-color:#38bdf8 !important;
}
.pair-card.notification-card-focus .pair-avatar{
    box-shadow:0 0 0 2px rgba(56,189,248,.55),0 0 26px rgba(236,72,153,.45) !important;
    animation:notificationButtonBounce .85s ease-in-out infinite;
}
.pair-card.notification-card-focus .pair-info,
.pair-card.notification-card-focus .pair-action{
    position:relative;
    z-index:2;
}
.pair-card.notification-card-focus .mini-progress span{
    box-shadow:0 0 16px rgba(236,72,153,.65),0 0 22px rgba(56,189,248,.32);
}
.pair-notification-focus::after{
    content:"🔔 Pendiente";
    position:absolute;
    right:14px;
    top:10px;
    z-index:3;
    font-size:11px;
    font-weight:900;
    padding:6px 10px;
    border-radius:999px;
    color:#fff;
    background:linear-gradient(135deg,#38bdf8,#ff2f92);
    box-shadow:0 0 22px rgba(236,72,153,.55);
    animation:notificationButtonBounce .85s ease-in-out infinite;
}

/* V57 - barra psicológica de carga para foto/video */
.upload-progress-wrap{
    display:none;
    margin-top:16px;
    padding:14px;
    border:1px solid rgba(142,115,255,.36);
    border-radius:18px;
    background:linear-gradient(135deg,rgba(139,108,255,.16),rgba(255,47,146,.10),rgba(5,5,13,.88));
    box-shadow:0 0 24px rgba(139,108,255,.14);
}
.upload-progress-wrap.active{display:block;}
.upload-progress-info{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    color:#fff;
    font-weight:800;
    font-size:13px;
    margin-bottom:10px;
}
.upload-progress-percent{
    color:#ff5cbd;
    text-shadow:0 0 12px rgba(255,47,146,.55);
}
.upload-progress-track{
    width:100%;
    height:12px;
    overflow:hidden;
    border-radius:999px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.10);
}
.upload-progress-bar{
    width:0%;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,#8b6cff,#ff2f92,#38bdf8);
    box-shadow:0 0 18px rgba(255,47,146,.45);
    transition:width .25s ease;
    position:relative;
}
.upload-progress-bar:after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);
    animation:uploadShimmer 1.05s linear infinite;
}
.upload-progress-note{
    margin:9px 0 0;
    color:#cfc9ff;
    font-size:12px;
}
.upload-submit-btn.is-uploading,
.upload-submit-btn:disabled{
    opacity:.88;
    cursor:wait;
    filter:drop-shadow(0 0 12px rgba(255,47,146,.42));
}
.upload-error{
    border-color:rgba(255,80,120,.62);
    box-shadow:0 0 22px rgba(255,80,120,.18);
}
@keyframes uploadShimmer{
    from{transform:translateX(-100%);}
    to{transform:translateX(100%);}
}

/* V59 - Modo independiente para atender notificaciones del juego privado */
.content-game-focus-only{
  max-width:1180px;
  padding-top:34px;
}
.content-game-focus-only .pair-game-board{
  margin-top:0;
  box-shadow:0 0 0 1px rgba(0,208,255,.35),0 0 42px rgba(0,208,255,.16),0 0 58px rgba(236,42,159,.12);
}
.focus-back-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:10px 0 8px;
  color:#fff;
  font-weight:900;
  font-size:13px;
  text-decoration:none;
  padding:9px 14px;
  border-radius:999px;
  border:1px solid rgba(138,94,255,.55);
  background:linear-gradient(135deg,rgba(138,94,255,.28),rgba(236,42,159,.18));
  box-shadow:0 0 18px rgba(138,94,255,.18);
}
.focus-back-link:hover{
  transform:translateY(-1px);
  box-shadow:0 0 24px rgba(236,42,159,.28);
}
.content-game-focus-only .pair-game-header{
  border-bottom:1px solid rgba(138,94,255,.28);
  padding-bottom:16px;
  margin-bottom:18px;
}
