:root {
    --glossy: linear-gradient(to bottom, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.2) 100%);
    --win-blue: #0096ff;
}

/* Base */
* { box-sizing: border-box; }
body, html { margin: 0; padding: 0; height: 100%; font-family: 'Segoe UI', sans-serif; overflow: hidden; }

.desktop {
    background-image: url('wallpaper.jpg'); background-size: cover; background-position: center;
    height: 100vh; width: 100vw; display: flex; align-items: center; justify-content: center;
}

/* Janela Aero */
.aero-window {
    width: 950px; height: 680px; background: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,0.7);
    border-radius: 12px; display: flex; flex-direction: column; position: relative;
}

/* Barra de Título e Botões */
.title-bar { background: var(--glossy); padding: 5px 10px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(255,255,255,0.3); }

.window-controls { display: flex; gap: 5px; } 

.win-btn { 
    background: none; border: 1px solid transparent; padding: 2px 10px; cursor: pointer; transition: 0.2s; 
}
.win-btn:hover { background: rgba(0,0,0,0.1); border-color: rgba(0,0,0,0.1); }
.win-btn.close:hover { background: #e81123 !important; color: white; }

/* Corpo */
.window-body { flex: 1; overflow-y: auto; padding: 15px; padding-bottom: 80px; }
.main-grid { display: grid; grid-template-columns: 220px 1fr 220px; gap: 15px; }

/* Bio e Handle */
.user-handle { color: var(--win-blue); font-weight: bold; margin-top: -5px; margin-bottom: 10px; text-align: center; }
.bio-small p { margin: 2px 0; font-size: 13px; text-align: center; }

/* Cards */
.glass-card {
    background: rgba(255, 255, 255, 0.35); border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 10px; padding: 15px; margin-bottom: 15px; position: relative;
}

/* Botões Sociais */
.social-links-column { display: flex; flex-direction: column; gap: 6px; }
.rect-social-btn {
    width: 100%; background: white; border: 1px solid #ccc; border-radius: 4px;
    padding: 6px; text-decoration: none; color: #555; font-size: 12px; text-align: center;
}

/* ABA DE REDES SOCIAIS */
.redes-full-view { display: flex; flex-direction: column; gap: 12px; padding: 10px; }
.large-rect-btn { 
    background: white; border: 1px solid #ccc; border-radius: 8px; padding: 18px; 
    text-decoration: none; color: #333; font-weight: bold; text-align: center; 
    font-size: 16px; box-shadow: 0 4px 6px rgba(0,0,0,0.05); transition: 0.2s; 
}
.large-rect-btn:hover { border-color: var(--win-blue); background: #f9f9f9; transform: translateX(5px); }

/* Carinhas e Animações */
.face-sounds { display: flex; justify-content: center; gap: 8px; margin-top: 10px; }
.face-btn, .app-btn { transition: transform 0.1s; cursor: pointer; }
.face-btn { width: 40px; height: 40px; border-radius: 50%; border: 1px solid white; background: var(--glossy); }
.face-btn:active, .app-btn:active, .win-btn:active { transform: scale(0.9); }

/* Galeria */
.gallery-layout { display: flex; align-items: center; justify-content: center; gap: 20px; height: 400px; }
.photo-display { width: 450px; height: 320px; display: flex; align-items: center; justify-content: center; }
.photo-display img { max-width: 100%; max-height: 100%; border: 4px solid white; box-shadow: 0 5px 15px rgba(0,0,0,0.2); }
.arrow-btn { background: rgba(255,255,255,0.6); border: 1px solid white; padding: 15px; font-size: 24px; border-radius: 8px; cursor: pointer; }

/* Amigos */
.friends-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.friend img { width: 45px; height: 45px; border-radius: 8px; border: 2px solid white; object-fit: cover; }
.friend span { font-size: 10px; color: #333; }

/* Outros e Taskbar */
.now-playing-box { background: linear-gradient(180deg, #1a2a44 0%, #2a4a75 100%) !important; color: white; text-align: center; }
.gear-icon-btn { position: absolute; top: 8px; right: 8px; background: none; border: none; cursor: pointer; color: white; }
.album-art { width: 80px; height: 80px; border: 2px solid white; margin: 10px 0; }
.play-btn { background: var(--glossy); border: none; border-radius: 20px; padding: 5px 20px; width: 100%; font-weight: bold; }
.taskbar { position: absolute; bottom: 0; left: 0; right: 0; height: 65px; background: rgba(255,255,255,0.2); backdrop-filter: blur(15px); display: flex; justify-content: center; align-items: center; gap: 20px; }
.app-btn { width: 48px; height: 48px; border-radius: 10px; border: 1px solid white; background: var(--glossy); font-size: 24px; }
.page { display: none; }
.page.active { display: block; }
.blue-title-box { background: var(--win-blue); color: white; padding: 5px 15px; border-radius: 5px; margin-bottom: 15px; }
.pfp { width: 90px; height: 90px; border-radius: 50%; border: 3px solid white; display: block; margin: 0 auto 10px; }

/* Stats e Erro de Fechamento Corrigido */
.stats p { 
    font-size: 11px; 
    margin: 2px 0; 
    text-align: center; 
    color: #666; 
}

/* Ajuste para o Iframe do Jogo */
.game-frame {
    width: 100%;
    height: 550px;
    border: none;
    border-radius: 8px;
    background: white;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.1);
}