/* CSS GERAL */
        body { margin: 0; padding: 0; font-family: 'Lato', sans-serif; overflow-x: hidden; background-color: #0f1012; transition: none; }
        #fixed-background-container { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -10; }
        .bg-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; opacity: 0; transition: opacity 3s; }
        .bg-slide.active { opacity: 1; animation: slowZoom 25s infinite alternate; }
        .bg-vignette-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle at center, transparent 30%, #000 100%); pointer-events: none; z-index: 1; }
        @keyframes slowZoom { from { transform: scale(1); } to { transform: scale(1.1); } }

        /* NAVBAR */
        .navbar { position: fixed; top: 0; left: 0; width: 100%; height: 80px; z-index: 5000; background: rgba(8, 4, 2, 0.95); border-bottom: 1px solid #d4af37; box-shadow: 0 5px 20px #000; display: flex; justify-content: space-between; align-items: center; padding: 0 30px; backdrop-filter: blur(5px); }
        .nav-left { display: flex; align-items: center; gap: 30px; }
        .nav-logo img { height: 50px; transition: 0.3s; filter: drop-shadow(0 0 2px #000); }
        .nav-logo img:hover { transform: scale(1.05); }
        .nav-links { list-style: none; display: flex; gap: 20px; margin: 0; padding: 0; }
        .nav-links a { text-decoration: none; color: #bbb; font-family: 'Cinzel'; font-weight: bold; cursor: pointer; transition: 0.3s; text-transform: uppercase; font-size: 0.9rem; }
        .nav-links a:hover, .nav-links a.active { color: #d4af37; text-shadow: 0 0 10px rgba(212,175,55,0.5); }
        .nav-right { display: flex; align-items: center; gap: 20px; }
          
        /* ESTATÍSTICAS */
        .server-stats { display: flex; gap: 15px; font-family: 'Cinzel'; font-size: 0.8rem; color: #d4af37; border-right: 1px solid #444; padding-right: 20px; }
        .stat-item { display: flex; flex-direction: column; align-items: center; line-height: 1.1; }
        .online-dot { width: 8px; height: 8px; background: <?php echo $server_status_color; ?>; border-radius: 50%; display: inline-block; box-shadow: 0 0 8px <?php echo $server_status_color; ?>; animation: blink 2s infinite; }
        @keyframes blink { 50% { opacity: 0.5; } }
          
        /* IDIOMA E SOCIAL */
        .lang-switch { display: flex; gap: 5px; border-right: 1px solid #444; padding-right: 20px; }
        .lang-btn { cursor: pointer; opacity: 0.4; width: 22px; transition: 0.3s; filter: grayscale(100%); }
        .lang-btn:hover, .lang-btn.active { opacity: 1; transform: scale(1.1); filter: grayscale(0%); }
        .social-mini a { color: #888; font-size: 1.2rem; margin: 0 5px; transition: 0.3s; }
        .social-mini a:hover { color: #d4af37; transform: translateY(-2px); }
        .mini-player { display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,0.1); padding: 5px 10px; border-radius: 20px; border: 1px solid #333; }
        .player-btn { background: none; border: none; color: #d4af37; cursor: pointer; font-size: 1rem; }

        /* LOADING & EFEITOS */
        #start-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.8)), url('img/bg_landing.jpg'); background-size: cover; background-position: center; z-index: 20000; display: flex; flex-direction: column; justify-content: center; align-items: center; transition: opacity 1s ease, background 0.3s ease; overflow: hidden; }
        .brighten-overlay { background: url('img/bg_landing.jpg') !important; background-size: cover !important; background-position: center !important; }
        #dragon-container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 5; }
        .dragon-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: none; }
        .show-frame { opacity: 1 !important; }
        .breathing { animation: dragonBreath 2s infinite ease-in-out; transform-origin: center; }
        @keyframes dragonBreath { 0% { transform: scale(1); } 50% { transform: scale(1.01); } 100% { transform: scale(1); } }
        .loading-content-wrapper { position: relative; z-index: 10; display: flex; flex-direction: column; align-items: center; transition: 0.15s ease-out; margin-top: 80px; }
        .logo-eaten { transform: scale(1.1, 0.05) rotate(10deg) !important; opacity: 0 !important; filter: blur(3px); transition: all 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19) !important; }
        .loading-logo { width: 400px; max-width: 90%; margin-bottom: 30px; -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%); mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%); animation: pulse 3s infinite; transition: all 0.1s ease-out; }
        @keyframes pulse { 0%, 100% { opacity: 0.6; } 50% { opacity: 1; } }
        .stop-pulse { animation: none !important; opacity: 1 !important; }
        .start-btn { position: relative; z-index: 6; background: transparent; border: 2px solid #d4af37; color: #d4af37; padding: 15px 40px; font-family: 'Cinzel'; font-size: 1.5rem; cursor: pointer; transition: 0.2s; text-transform: uppercase; letter-spacing: 2px; }
        .start-btn:not(:disabled):hover { background: #d4af37; color: #000; box-shadow: 0 0 25px #d4af37; transform: translateY(-2px); }
        .start-btn:disabled { border-color: #555; color: #888; cursor: wait; opacity: 0.8; font-size: 1.2rem; }
        #bite-explosion { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); width: 100vw; height: 100vh; pointer-events: none; z-index: 15; opacity: 0; background: conic-gradient(from 0deg, transparent 0deg, transparent 10deg, rgba(212, 175, 55, 0.8) 12deg, transparent 15deg, rgba(100, 100, 100, 0.6) 25deg, transparent 30deg, rgba(212, 175, 55, 0.6) 45deg, transparent 50deg, transparent 80deg, rgba(150, 150, 150, 0.8) 85deg, transparent 90deg, transparent 140deg, rgba(212, 175, 55, 0.9) 145deg, transparent 150deg, transparent 200deg, rgba(255, 255, 255, 0.4) 210deg, transparent 220deg, transparent 300deg, rgba(100, 100, 100, 0.7) 310deg, transparent 320deg); border-radius: 50%; }
        .explode-now { animation: explosionAnim 0.6s ease-out forwards; }
        @keyframes explosionAnim { 0% { transform: translate(-50%, -50%) scale(0) rotate(0deg); opacity: 1; } 50% { opacity: 0.8; } 100% { transform: translate(-50%, -50%) scale(2) rotate(45deg); opacity: 0; } }
        #black-flash { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: 0; z-index: 20; pointer-events: none; transition: opacity 1s ease-in; }
        .shake-screen { animation: shake 0.4s ease-in-out both; }
        @keyframes shake { 0% { transform: translate(0, 0); } 25% { transform: translate(-10px, 8px) rotate(-0.5deg); } 75% { transform: translate(10px, -8px) rotate(0.5deg); } 100% { transform: translate(0, 0); } }

        /* CONTEÚDO */
        #main-paper-wrapper { position: relative; z-index: 1; max-width: 900px; margin: 120px auto 40px auto; padding-bottom: 40px; min-height: 80vh; background-image: url('img/pergaminho.png'); background-repeat: repeat-y; background-size: 100% auto; background-color: #e3dac2; box-shadow: 0 0 60px #000; border-radius: 5px; overflow: hidden; }
        .hero { text-align: center; padding-top: 40px; }
        
        /* --- ESTILO DO QUADRO DE AVISOS (NEWS) --- */
        .news-board {
            width: 85%;
            margin: 40px auto;
            background-color: #2e2010; /* Madeira escura */
            background-image: repeating-linear-gradient(45deg, #3d2b1f 0, #3d2b1f 1px, #2e2010 0, #2e2010 50%);
            border: 8px solid #1a120b;
            border-radius: 10px;
            box-shadow: 0 10px 20px rgba(0,0,0,0.8), inset 0 0 20px #000;
            padding: 20px;
            position: relative;
        }
        /* Pregos nos cantos */
        .news-board::before, .news-board::after {
            content: ''; position: absolute; top: 10px; width: 15px; height: 15px; border-radius: 50%; background: radial-gradient(circle, #888 30%, #333 100%); box-shadow: 1px 1px 2px #000;
        }
        .news-board::before { left: 10px; }
        .news-board::after { right: 10px; }

        .news-title {
            text-align: center; font-family: 'MedievalSharp', serif; font-size: 2rem; color: #d4af37; 
            text-shadow: 2px 2px 0 #000; margin-bottom: 20px; border-bottom: 2px solid #5d4037; padding-bottom: 10px;
        }

        /* Papel de Notícia (Pinned Paper) */
        .news-item {
            background: #fdf5e6;
            color: #222;
            padding: 15px 20px;
            margin-bottom: 20px;
            box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
            font-family: 'Lato', sans-serif;
            position: relative;
            transform: rotate(-1deg);
            transition: 0.3s;
        }
        .news-item:nth-child(even) { transform: rotate(1deg); }
        .news-item:hover { transform: scale(1.02) rotate(0deg); z-index: 5; box-shadow: 5px 5px 15px rgba(0,0,0,0.5); }
        
        /* Pin (Alfinete) */
        .news-pin {
            position: absolute; top: -8px; left: 50%; transform: translateX(-50%);
            width: 12px; height: 12px; background: radial-gradient(circle, #a00 30%, #500 100%);
            border-radius: 50%; box-shadow: 1px 1px 3px rgba(0,0,0,0.6);
        }

        .news-date { font-size: 0.8rem; color: #666; font-weight: bold; border-bottom: 1px solid #ccc; padding-bottom: 2px; margin-bottom: 5px; display: block;}
        .news-body { font-size: 1rem; line-height: 1.5; }

        /* Estilos Padrão */
        .section { background: rgba(0,0,0,0.6); margin: 20px; padding: 20px; border-radius: 5px; color: #ddd; border: 1px solid #d4af37; }
        .btn-download { display: inline-block; background: #800000; color: #fff; padding: 15px 30px; text-decoration: none; font-weight: bold; border: 1px solid #d4af37; transition: 0.3s; }
        .btn-download:hover { background: #a00000; box-shadow: 0 0 15px #ff0000; }
        input { width: 90%; padding: 10px; margin-bottom: 10px; background: rgba(255,255,255,0.9); border: 1px solid #555; }
        button[type="submit"] { width: 95%; padding: 12px; background: #222; color: #d4af37; border: 1px solid #d4af37; font-family: 'Cinzel'; font-weight: bold; cursor: pointer; }
        button[type="submit"]:hover { background: #d4af37; color: #000; }
        @media (max-width: 1100px) { .navbar { height: auto; flex-wrap: wrap; padding: 10px; justify-content: center; } .nav-left, .nav-right { width: 100%; justify-content: center; margin: 5px 0; gap: 15px; } .server-stats { border: none; } #main-paper-wrapper { margin-top: 220px; } }