@font-face {
  font-family: 'Univers';
  src: url(../webfonts/Univers/univers-condensed-57-regular.otf);
}

@font-face {
  font-family: 'Univers Condensed';
  src: url(../webfonts/Univers/univers-57-condensed.otf);
}

@font-face {
  font-family: 'Univers Light';
  src: url(../webfonts/Univers/Univers-Light.otf);
}

body,
h1,
h2,
h3 {
    font-family: Roboto, sans-serif;
}

html {
	position:relative;
	min-height:100%;
	width:100%;
	margin:0;
	padding:0;
}

body {
	background:url('../image/bg.jpg') no-repeat, #000000;
	background-position:center top;
	background-size:100%;
	margin-bottom: 60px;
	margin-left:0;
	margin-right:0;
	padding:0;
}

.main-wrapper {
	position:relative;
	width:90%;
	margin:0 auto 150px auto;
	margin-top:40px;
}

.main-wrapper::after {
	display: block;
    content: "";
    clear: both;
}

.left-wrapper {
	float:left;
	width:30%;
}

.left-wrapper .community .item {
	display:block;
	margin:10px 0;
}

.left-wrapper .community .item:first-child {
	margin-top:0px;
}

.left-wrapper .community .content {
	background:#24004c;
	padding:10px 10px;
	line-height:60px;
	border-radius:4px;
	-webkit-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
          transition: all .3s ease-in-out;
}

.left-wrapper .community .item:hover .content {
	opacity:0.7;
}

.left-wrapper .community .content::after {
	display: block;
    content: "";
    clear: both;
}

.left-wrapper .community .discord .content {
	background:#24004c;
}

.left-wrapper .community .forum .content {
	background:#228B22;
}

.left-wrapper .community .insta .content {
	background:#853CB0;
}

.left-wrapper .community .content .icon {
	width:20%;
	float:left;
	text-align:center;
	font-size:40px;
	color:#fff;
}

.left-wrapper .community .content .desc {
	width:74%;
	margin-left:1%;
	float:left;
	font-family:'Univers';
	color:#fff;
	font-size:25px;
	text-transform:uppercase;
}

.left-wrapper .community .content .caret {
	float:right;
	color:#fff;
	width:4%;
	text-align:center;
	margin-right:1%;
}

.right-wrapper {
	float:right;
	width:65%;
}

.right-wrapper .servers {
	position:relative;
}

.right-wrapper .servers .item {
	float:left;
	width:44%;
	background:#363f6b;
	margin:0 2%;
	text-decoration:none;
	/*padding:15px;*/
	border-radius:4px;
}

.right-wrapper .servers .item:first-child {
	margin-left:0;
}

.right-wrapper .servers .item:last-child {
	margin-right:0;
}

.right-wrapper .servers .item .head {
	color:#ffffff;
	text-transform:uppercase;
	font-family:'Univers';
	padding:15px;
}

.right-wrapper .servers .item .head h2 {
	letter-spacing:2px;
	font-weight:bold;
	font-size:20px;
	padding:0;
	margin:0;
}

.right-wrapper .servers .item .head p {
	padding:0;
	margin:0;
	color:#ffffff;
}

.right-wrapper .servers .item .video {
	padding:0 10px;
}

.right-wrapper .servers .item .video iframe {
	width:100% !important;
	height:210px;
	border:1px solid #e1e2e3;
}

.right-wrapper .servers .item .footer-wrapper {
	position:relative;
	background:#24004c;
	padding:15px 15px 20px 15px;
	margin-top:15px;
	border-bottom-left-radius:4px;
	border-bottom-right-radius:4px;
}

.right-wrapper .servers .item .footer-wrapper::after {
	position:absolute;
	z-index:1001 !important;
	top:-10px;
	right:0;
	display: block;
    content: "";
    clear: both;
	width:55%;
	background:transparent;
	border-bottom: 20px solid #24004c;
    border-left: 20px solid transparent;
}

.right-wrapper .servers .item .footer-wrapper .link {
	position:relative;
	z-index:1002 !important;
	margin-top:-10px;
	font-family:'Univers';
	text-transform:uppercase;
	text-align:right;
	font-weight:bold;
	letter-spacing:2px;
	color:#fff;
	font-size:18px;
	line-height:20px;
}

.right-wrapper .servers .item .footer-wrapper .link i {
	color:#fff;
	text-shadow: none;
	font-size:20px;
	margin-left:5px;
}

.right-wrapper .servers .item:hover .footer-wrapper .link i {
	animation: linkZoomIn 3.1s infinite;
}

#footer {
    background:#24004c;
	position: absolute;
	bottom: 0;
	margin:0 auto 0 auto;
	height: 60px;
	width:99.8%;
}

#footer .copyright {
	text-align:center;
	margin:25px 0 0px 0;
	font-size:12px;
	z-index:1002;
}

#footer .copyright p {
	padding:0;
	margin:0;
	font-family:'Roboto';
	text-transform:uppercase;
	color:#ffffff;
}

#footer .copyright img {
	width:150px;
	margin-top:10px;
}

#footer .copyright a {
	color:#ffffff;
	text-decoration:none;
	transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
       -o-transition: all .2s ease-in-out;
          transition: all .2s ease-in-out;
}

#footer .copyright a:hover {
	color:#ffffff;
}

.invisible {
	visibility:hidden;
}

.mt-5 {
	margin-top:5px !important;
}

@keyframes linkZoomIn {
    0% {
        transform: scale(1,1);
    }
    50% {
		transform: scale(1.4,1.4);
    }
    100% {
		transform: scale(1.1,1.1);
    }
}

/* =========================================================
   FIX MENU SIN TOCAR RANKINGS - STARLESS RO - By Ness
   =========================================================

   Este bloque solo:
   - Pone el menú debajo del status.
   - Oculta/elimina visualmente las cards grandes si quedan.
   - Fuerza de nuevo el estilo visual de los rankings.

========================================================= */

* {
	box-sizing: border-box !important;
}

html,
body {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow-x: hidden !important;
}

body {
	background: url('../image/bg.jpg') no-repeat center top, #000000 !important;
	background-size: cover !important;
	min-height: 100vh !important;
}

.main-wrapper {
	width: min(94vw, 1500px) !important;
	max-width: 1500px !important;
	margin: clamp(18px, 2.4vw, 42px) auto 110px auto !important;
	padding: 0 !important;

	position: relative !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;

	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: clamp(20px, 2.5vw, 34px) !important;
	clear: both !important;
}

.main-wrapper::after {
	display: none !important;
}

/* LOGO */
.full-wrapper {
	order: 1 !important;
	width: 100% !important;
	height: auto !important;
	min-height: 0 !important;
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	position: relative !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	margin: 0 auto !important;
	padding: 0 !important;
	z-index: 10 !important;
}

#logo {
	position: static !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	transform: none !important;
	display: block !important;
	width: clamp(220px, 24vw, 390px) !important;
	max-width: 86vw !important;
	height: auto !important;
	margin: 0 auto !important;
	object-fit: contain !important;
}

/* STATUS */
.server-status-wrapper {
	order: 2 !important;
	position: relative !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	transform: none !important;
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	width: min(100%, 860px) !important;
	max-width: 860px !important;
	margin: 0 auto !important;
	clear: none !important;
	z-index: 20 !important;
}

.server-status-box {
	width: 100% !important;
	background: rgba(10, 7, 20, 0.80) !important;
	border: 1px solid rgba(255, 202, 88, 0.55) !important;
	box-shadow: 0 0 28px rgba(0,0,0,0.70), inset 0 0 24px rgba(255,202,88,0.06) !important;
	border-radius: 6px !important;
	overflow: hidden !important;
	font-family: 'Univers', Roboto, sans-serif !important;
}

.server-status-line {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px 18px !important;
	padding: clamp(9px, 1vw, 13px) clamp(10px, 1.2vw, 16px) !important;
	text-align: center !important;
	background: linear-gradient(90deg, #24004c 0%, #363f6b 60%, #24004c 100%) !important;
	border-bottom: 1px solid rgba(255,255,255,0.12) !important;
}

.server-status-item {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	min-width: auto !important;
	font-size: clamp(10px, 0.8vw, 14px) !important;
	letter-spacing: 1px !important;
	text-transform: uppercase !important;
	color: #ffffff !important;
	white-space: nowrap !important;
}

.server-status-item .status-label {
	color: #ffd16a !important;
	font-weight: bold !important;
}

.server-status-item strong {
	font-size: clamp(10px, 0.8vw, 13px) !important;
	letter-spacing: 1px !important;
}

.status-dot {
	width: 10px !important;
	height: 10px !important;
	border-radius: 50% !important;
	display: inline-block !important;
	box-shadow: 0 0 10px rgba(255,255,255,0.35) !important;
}

.server-status-item.is-online .status-dot {
	background: #38ff65 !important;
	box-shadow: 0 0 12px rgba(56,255,101,0.85) !important;
}

.server-status-item.is-online strong {
	color: #38ff65 !important;
}

.server-status-item.is-offline .status-dot {
	background: #ff3333 !important;
	box-shadow: 0 0 12px rgba(255,51,51,0.85) !important;
}

.server-status-item.is-offline strong {
	color: #ff7777 !important;
}

.server-status-time {
	width: auto !important;
	margin-left: 0 !important;
	font-size: clamp(10px, 0.8vw, 14px) !important;
	letter-spacing: 1px !important;
	text-transform: uppercase !important;
	color: #ffffff !important;
	white-space: nowrap !important;
	text-align: center !important;
}

.server-status-time span {
	color: #ffd16a !important;
	font-weight: bold !important;
}

.server-status-time strong {
	color: #ffffff !important;
	font-size: clamp(11px, 0.9vw, 15px) !important;
	margin-left: 5px !important;
}

.server-online-users {
	padding: clamp(8px, 0.9vw, 12px) 14px !important;
	text-align: center !important;
	background: rgba(255,255,255,0.045) !important;
	font-family: 'Univers', Roboto, sans-serif !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
}

.server-online-users span {
	color: #ffffff !important;
	font-size: clamp(10px, 0.85vw, 14px) !important;
}

.server-online-users strong {
	display: inline-block !important;
	margin-left: 8px !important;
	color: #38ff65 !important;
	font-size: clamp(14px, 1vw, 18px) !important;
	text-shadow: 0 0 10px rgba(56,255,101,0.65) !important;
}

/* MENU HORIZONTAL */
.left-wrapper {
	order: 3 !important;
	float: none !important;
	width: min(100%, 980px) !important;
	max-width: 980px !important;
	position: relative !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	margin: -4px auto 0 auto !important;
	clear: none !important;
	z-index: 18 !important;
}

.left-wrapper .community {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: 8px !important;
	width: 100% !important;
	background: rgba(10, 7, 20, 0.82) !important;
	border: 1px solid rgba(255, 202, 88, 0.45) !important;
	box-shadow: 0 0 24px rgba(0,0,0,0.62), inset 0 0 18px rgba(255,202,88,0.05) !important;
	border-radius: 6px !important;
	padding: 8px !important;
}

.left-wrapper .community .item {
	display: block !important;
	width: 100% !important;
	margin: 0 !important;
	text-decoration: none !important;
}

.left-wrapper .community .content {
	height: 46px !important;
	line-height: 46px !important;
	padding: 0 9px !important;
	border-radius: 4px !important;
	background: linear-gradient(90deg, #24004c 0%, #363f6b 70%, #24004c 100%) !important;
	border: 1px solid rgba(255,255,255,0.10) !important;
	overflow: hidden !important;
	position: relative !important;
}

.left-wrapper .community .download .content {
	background: linear-gradient(90deg, #137c20 0%, #22942f 70%, #126d1c 100%) !important;
}

.left-wrapper .community .content .icon {
	width: 24px !important;
	float: left !important;
	text-align: center !important;
	font-size: 18px !important;
	color: #ffffff !important;
	line-height: 46px !important;
}

.left-wrapper .community .content .desc {
	width: calc(100% - 40px) !important;
	margin-left: 8px !important;
	float: left !important;
	font-family: 'Univers', Roboto, sans-serif !important;
	color: #ffffff !important;
	font-size: clamp(12px, 0.9vw, 15px) !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.left-wrapper .community .content .caret {
	display: none !important;
}

/* RANKINGS: RESTAURADOS */
.top-rankings-row {
	order: 4 !important;
	width: 100% !important;
	max-width: 1400px !important;
	margin: 0 auto !important;
	clear: none !important;
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 560px), 1fr)) !important;
	gap: clamp(22px, 2.8vw, 42px) !important;
	position: relative !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	z-index: 5 !important;
}

.top-rankings-row .mvp-ranking-wrapper,
.pvp-ranking-wrapper {
	position: relative !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	clear: none !important;
	display: block !important;
}

.top-rankings-row + br,
.top-rankings-row + br + br {
	display: none !important;
}

.pvp-ranking-box,
.mvp-ranking-box {
	background: rgba(10, 7, 20, 0.90) !important;
	border: 1px solid rgba(255, 202, 88, 0.45) !important;
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.72), inset 0 0 30px rgba(255, 202, 88, 0.06) !important;
	border-radius: 6px !important;
	overflow: hidden !important;
}

.pvp-ranking-header,
.mvp-ranking-header {
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	padding: clamp(12px, 1.1vw, 17px) clamp(14px, 1.35vw, 20px) !important;
	gap: 12px !important;
	background: linear-gradient(90deg, #24004c 0%, #363f6b 60%, #24004c 100%) !important;
	border-bottom: 1px solid rgba(255,255,255,0.12) !important;
}

.pvp-ranking-header h2,
.mvp-ranking-header h2 {
	font-family: 'Univers', Roboto, sans-serif !important;
	font-size: clamp(16px, 1.3vw, 22px) !important;
	line-height: 1.18 !important;
	letter-spacing: clamp(1px, 0.13vw, 2px) !important;
	color: #ffd16a !important;
	padding: 0 !important;
	margin: 0 !important;
	text-transform: uppercase !important;
}

.pvp-ranking-header p,
.mvp-ranking-header p {
	padding: 0 !important;
	margin: 3px 0 0 0 !important;
	color: #ffffff !important;
	font-size: clamp(10px, 0.75vw, 13px) !important;
	line-height: 1.2 !important;
	text-transform: uppercase !important;
	opacity: 0.85 !important;
}

.pvp-ranking-badge {
	background: #8B0000 !important;
	color: #fff !important;
	font-family: 'Univers', Roboto, sans-serif !important;
	font-size: clamp(11px, 0.85vw, 15px) !important;
	letter-spacing: 1px !important;
	padding: 7px 10px !important;
	border-radius: 4px !important;
	box-shadow: 0 0 12px rgba(139,0,0,0.55) !important;
	white-space: nowrap !important;
}

.mvp-ranking-badge {
	background: #228B22 !important;
	color: #fff !important;
	font-family: 'Univers', Roboto, sans-serif !important;
	font-size: clamp(11px, 0.85vw, 15px) !important;
	letter-spacing: 1px !important;
	padding: 7px 10px !important;
	border-radius: 4px !important;
	box-shadow: 0 0 12px rgba(34,139,34,0.45) !important;
	white-space: nowrap !important;
}

.pvp-ranking-list,
.mvp-ranking-list {
	padding: 11px 14px 15px 14px !important;
}

.pvp-ranking-row,
.mvp-ranking-row {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	padding: clamp(10px, 1vw, 13px) clamp(11px, 1.1vw, 15px) !important;
	margin: 10px 0 !important;
	background: rgba(255,255,255,0.055) !important;
	border: 1px solid rgba(255,255,255,0.08) !important;
	border-radius: 4px !important;
	transition: all .25s ease-in-out !important;
}

.pvp-ranking-row.rank-gold,
.mvp-ranking-row.rank-gold {
	background: linear-gradient(90deg, rgba(255, 197, 69, 0.25), rgba(255,255,255,0.06)) !important;
	border-color: rgba(255, 209, 106, 0.55) !important;
}

.pvp-ranking-row.rank-silver,
.mvp-ranking-row.rank-silver {
	background: linear-gradient(90deg, rgba(200, 210, 225, 0.18), rgba(255,255,255,0.055)) !important;
}

.pvp-ranking-row.rank-bronze,
.mvp-ranking-row.rank-bronze {
	background: linear-gradient(90deg, rgba(191, 120, 55, 0.20), rgba(255,255,255,0.055)) !important;
}

.pvp-rank-number,
.mvp-rank-number {
	width: clamp(135px, 13vw, 210px) !important;
	text-align: left !important;
	font-family: 'Univers', Roboto, sans-serif !important;
	font-size: clamp(11px, 0.9vw, 15px) !important;
	line-height: 1.15 !important;
	letter-spacing: 1px !important;
	text-transform: uppercase !important;
	font-weight: bold !important;
	color: #ffd16a !important;
}

.pvp-rank-player,
.mvp-rank-player {
	flex: 1 !important;
	min-width: 0 !important;
}

.pvp-rank-player strong,
.mvp-rank-player strong {
	display: block !important;
	font-family: 'Univers', Roboto, sans-serif !important;
	font-size: clamp(17px, 1.3vw, 22px) !important;
	line-height: 1.1 !important;
	color: #ffffff !important;
	letter-spacing: 1px !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.pvp-rank-player span,
.mvp-rank-player span {
	display: block !important;
	font-size: clamp(10px, 0.8vw, 12px) !important;
	color: #d8d8d8 !important;
	margin-top: 2px !important;
}

.pvp-rank-points,
.mvp-rank-points {
	min-width: clamp(72px, 6vw, 105px) !important;
	text-align: right !important;
	font-family: 'Univers', Roboto, sans-serif !important;
	font-size: clamp(17px, 1.3vw, 22px) !important;
	font-weight: bold !important;
	color: #ffd16a !important;
}

.pvp-rank-points small,
.mvp-rank-points small {
	display: block !important;
	font-size: 10px !important;
	color: #ffffff !important;
	letter-spacing: 2px !important;
	margin-top: -2px !important;
}

/* Oculta cards grandes si queda algún residuo */
.right-wrapper {
	display: none !important;
}

#footer {
	position: relative !important;
	width: 100% !important;
	margin-top: 45px !important;
}

@media (max-width: 900px) {
	.left-wrapper .community {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.left-wrapper .community .content .desc {
		font-size: 14px !important;
	}
}

@media (max-width: 760px) {
	.main-wrapper {
		width: 94vw !important;
		gap: 22px !important;
		margin-top: 16px !important;
	}

	#logo {
		width: clamp(200px, 78vw, 320px) !important;
		max-width: 92vw !important;
	}

	.left-wrapper .community {
		grid-template-columns: 1fr !important;
		gap: 8px !important;
	}

	.left-wrapper .community .content {
		height: 44px !important;
		line-height: 44px !important;
	}

	.left-wrapper .community .content .icon {
		line-height: 44px !important;
	}

	.pvp-ranking-row,
	.mvp-ranking-row {
		flex-wrap: wrap !important;
		align-items: flex-start !important;
	}

	.pvp-rank-number,
	.mvp-rank-number {
		width: 100% !important;
		font-size: 13px !important;
		margin-bottom: 3px !important;
	}

	.pvp-rank-player,
	.mvp-rank-player {
		width: calc(100% - 82px) !important;
	}

	.pvp-rank-points,
	.mvp-rank-points {
		min-width: 72px !important;
	}

	.server-status-time {
		width: 100% !important;
	}
}

@media (max-width: 480px) {
	.main-wrapper {
		width: 95vw !important;
		gap: 20px !important;
	}

	#logo {
		width: clamp(190px, 82vw, 290px) !important;
	}

	.server-status-line {
		gap: 8px !important;
		padding: 9px 10px !important;
	}

	.server-status-item,
	.server-status-item strong,
	.server-status-time {
		font-size: 10px !important;
	}

	.left-wrapper .community {
		padding: 7px !important;
	}

	.left-wrapper .community .content .desc {
		font-size: 15px !important;
	}
}

/* =========================================================
   FOOTER FINAL AJUSTADO - STARLESS RO - By Ness
   =========================================================

   OBJETIVO:
   Que el copyright quede como cierre real de la página,
   bien centrado, con altura correcta y sin verse flotando.

========================================================= */

#footer {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 100% !important;
	min-height: 62px !important;
	height: auto !important;

	margin: 55px auto 0 auto !important;
	padding: 18px 15px !important;

	background: linear-gradient(90deg, #180030 0%, #24004c 50%, #180030 100%) !important;
	border-top: 1px solid rgba(255, 202, 88, 0.28) !important;
	box-shadow: 0 -10px 28px rgba(0,0,0,0.45) !important;

	clear: both !important;
	z-index: 30 !important;
}

#footer .copyright {
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	text-align: center !important;
	display: block !important;
}

#footer .copyright .container,
#footer .copyright .row,
#footer .copyright .col-12 {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 auto !important;
	padding: 0 !important;
	display: block !important;
}

#footer .copyright p {
	margin: 0 !important;
	padding: 0 !important;

	font-family: 'Univers', Roboto, sans-serif !important;
	font-size: clamp(11px, 0.85vw, 13px) !important;
	line-height: 1.45 !important;
	letter-spacing: 1px !important;
	text-transform: uppercase !important;

	color: rgba(255,255,255,0.88) !important;
	text-align: center !important;
}

#footer .copyright a {
	color: #ffd16a !important;
	text-decoration: none !important;
	font-weight: bold !important;
}

#footer .copyright a:hover {
	color: #ffffff !important;
}

@media (max-width: 760px) {
	#footer {
		margin-top: 38px !important;
		padding: 16px 12px !important;
		min-height: 58px !important;
	}

	#footer .copyright p {
		font-size: 11px !important;
		line-height: 1.5 !important;
	}
}



/* GOLD ELEGANT THEME - By Ness */
.server-status-box,
.left-wrapper .community,
.pvp-ranking-box,
.mvp-ranking-box{
    border-color: rgba(255,215,120,.55) !important;
    box-shadow: 0 0 30px rgba(0,0,0,.72), inset 0 0 30px rgba(255,215,120,.08) !important;
}
.server-status-line,
.pvp-ranking-header,
.mvp-ranking-header{
    background: linear-gradient(90deg,#1a1026 0%, #2b183c 35%, #3d2412 65%, #1a1026 100%) !important;
}
.left-wrapper .community{
    background: linear-gradient(180deg,rgba(20,12,26,.92),rgba(38,22,28,.92)) !important;
}
.left-wrapper .community .content{
    background: linear-gradient(180deg,#2b1b26 0%, #4b2d1d 100%) !important;
    border: 1px solid rgba(255,215,120,.28) !important;
    box-shadow: inset 0 0 12px rgba(255,215,120,.08), 0 0 10px rgba(0,0,0,.3) !important;
}
.left-wrapper .community .download .content{
    background: linear-gradient(180deg,#3a2616 0%, #6f451d 100%) !important;
}
.left-wrapper .community .item:hover .content{
    box-shadow: inset 0 0 18px rgba(255,215,120,.18), 0 0 18px rgba(255,190,90,.18) !important;
}
.left-wrapper .community .content .icon,
.left-wrapper .community .content .desc{
    color:#ffe2a0 !important;
}
#footer{
    background: linear-gradient(90deg,#140d1d 0%, #2b183c 50%, #140d1d 100%) !important;
    border-top:1px solid rgba(255,215,120,.35) !important;
}

/* =========================================================
   MENU ULTIMO AJUSTE - STARLESS RO - By Ness
   =========================================================

   Ajuste final solicitado:
   - Mantiene tamaño de letras.
   - Abre la división central para que respiren los adornos del menubar.
   - Ajusta mejor el marco del botón Info. del Server.
   - Conserva responsive.
   - No toca status, rankings ni footer.

========================================================= */

.left-wrapper {
	width: min(100%, 1080px) !important;
	max-width: 1080px !important;
	margin: -2px auto 0 auto !important;
	position: relative !important;
	z-index: 18 !important;
}

.left-wrapper .community {
	position: relative !important;

	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;

	/* separación base elegante */
	gap: 16px !important;

	width: 100% !important;
	min-height: 104px !important;

	padding: 26px 60px 26px 60px !important;

	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	overflow: visible !important;
}

/* Fondo oscuro continuo */
.left-wrapper .community::after {
	content: "" !important;
	position: absolute !important;

	left: 46px !important;
	right: 46px !important;
	top: 22px !important;
	bottom: 22px !important;

	background:
		linear-gradient(90deg,
			rgba(9, 6, 11, 0.99) 0%,
			rgba(18, 11, 16, 0.99) 36%,
			rgba(31, 18, 14, 0.99) 66%,
			rgba(9, 6, 11, 0.99) 100%
		) !important;

	border-radius: 8px !important;
	box-shadow:
		inset 0 0 34px rgba(0,0,0,0.92),
		inset 0 0 18px rgba(255,190,75,0.10),
		0 0 16px rgba(0,0,0,0.38) !important;

	z-index: 1 !important;
	pointer-events: none !important;
}

/* Marco render frontal */
.left-wrapper .community::before {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;

	background-image: url('../image/menub.ar.png') !important;
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-size: 100% 100% !important;

	z-index: 6 !important;
	pointer-events: none !important;
}

.left-wrapper .community .item {
	position: relative !important;
	z-index: 3 !important;

	display: block !important;
	width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	text-decoration: none !important;
}

/* Abrimos SOLO el centro: entre Descarga e Info. del Server */
.left-wrapper .community .item:nth-child(2) {
	margin-right: 14px !important;
}

.left-wrapper .community .item:nth-child(3) {
	margin-left: 14px !important;
}

/* Separadores laterales discretos */
.left-wrapper .community .item:not(:last-child)::after {
	content: "" !important;
	position: absolute !important;
	right: -9px !important;
	top: 50% !important;
	width: 7px !important;
	height: 7px !important;
	transform: translate(50%, -50%) rotate(45deg) !important;

	background: linear-gradient(135deg, #fff4c8 0%, #ffbc42 48%, #7a3f07 100%) !important;
	border: 1px solid rgba(255, 232, 160, 0.70) !important;
	box-shadow:
		0 0 8px rgba(255, 185, 65, 0.78),
		inset 0 0 4px rgba(255,255,255,0.40) !important;

	z-index: 7 !important;
	pointer-events: none !important;
}

/* Separador central más dominante, donde están los adornos del menubar */
.left-wrapper .community .item:nth-child(2)::after {
	right: -24px !important;
	width: 8px !important;
	height: 8px !important;
	opacity: 1 !important;
}

/* Botones */
.left-wrapper .community .content {
	height: 52px !important;
	line-height: 52px !important;
	padding: 0 14px !important;

	background:
		linear-gradient(180deg,
			rgba(42, 27, 25, 0.97) 0%,
			rgba(8, 6, 10, 0.99) 52%,
			rgba(24, 14, 13, 0.98) 100%
		) !important;

	border: 1px solid rgba(255, 190, 82, 0.48) !important;
	border-radius: 7px !important;

	box-shadow:
		inset 0 1px 0 rgba(255, 238, 180, 0.16),
		inset 0 0 17px rgba(255, 190, 85, 0.09),
		0 0 10px rgba(0,0,0,0.52) !important;

	overflow: hidden !important;
	position: relative !important;
	transition: all .22s ease-in-out !important;
}

/* borde interno fino */
.left-wrapper .community .content::before {
	content: "" !important;
	position: absolute !important;
	left: 8px !important;
	right: 8px !important;
	top: 8px !important;
	bottom: 8px !important;

	border: 1px solid rgba(255, 214, 125, 0.17) !important;
	border-radius: 6px !important;
	pointer-events: none !important;
}

/* Info. del Server: marco mejor centrado y ligeramente más limpio */
.left-wrapper .community .item:nth-child(3) .content {
	padding-left: 13px !important;
	padding-right: 13px !important;
	border-color: rgba(255, 205, 105, 0.52) !important;
	box-shadow:
		inset 0 1px 0 rgba(255, 238, 180, 0.16),
		inset 0 0 18px rgba(255, 190, 85, 0.10),
		0 0 10px rgba(0,0,0,0.55) !important;
}

/* Descarga en tono dorado oscuro */
.left-wrapper .community .download .content {
	background:
		linear-gradient(180deg,
			rgba(54, 34, 18, 0.97) 0%,
			rgba(10, 7, 8, 0.99) 52%,
			rgba(34, 20, 11, 0.98) 100%
		) !important;

	border-color: rgba(255, 204, 95, 0.52) !important;
}

.left-wrapper .community .item:hover .content {
	border-color: rgba(255, 232, 160, 0.86) !important;
	box-shadow:
		0 0 17px rgba(255, 182, 70, 0.30),
		inset 0 0 20px rgba(255, 205, 100, 0.16) !important;
	transform: translateY(-1px) !important;
	opacity: 1 !important;
}

.left-wrapper .community .content .icon {
	width: 30px !important;
	float: left !important;
	text-align: center !important;

	font-size: 21px !important;
	color: #ffe7ad !important;
	line-height: 52px !important;

	text-shadow:
		0 0 10px rgba(255, 210, 110, 0.82),
		0 1px 2px rgba(0,0,0,0.92) !important;
}

.left-wrapper .community .content .desc {
	width: calc(100% - 40px) !important;
	margin-left: 9px !important;
	float: left !important;

	font-family: 'Univers', Roboto, sans-serif !important;

	/* tamaño conservado */
	font-size: clamp(13px, 0.92vw, 15px) !important;

	line-height: 52px !important;
	letter-spacing: 1px !important;
	text-transform: uppercase !important;
	font-weight: bold !important;

	color: #fff1c9 !important;
	text-shadow:
		0 1px 2px rgba(0,0,0,0.96),
		0 0 8px rgba(255, 195, 78, 0.26) !important;

	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.left-wrapper .community .content .caret {
	display: none !important;
}

/* Responsive: no forzar la división especial para no romper móvil/tablet */
@media (max-width: 900px) {
	.left-wrapper {
		width: min(100%, 820px) !important;
	}

	.left-wrapper .community {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		min-height: 156px !important;
		padding: 34px 56px !important;
		gap: 12px !important;
	}

	.left-wrapper .community::after {
		left: 38px !important;
		right: 38px !important;
		top: 28px !important;
		bottom: 28px !important;
	}

	.left-wrapper .community .item:nth-child(2),
	.left-wrapper .community .item:nth-child(3) {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.left-wrapper .community .item:not(:last-child)::after {
		display: none !important;
	}

	.left-wrapper .community .content {
		height: 44px !important;
		line-height: 44px !important;
	}

	.left-wrapper .community .content .icon,
	.left-wrapper .community .content .desc {
		line-height: 44px !important;
	}

	.left-wrapper .community .content .icon {
		font-size: 20px !important;
		width: 28px !important;
	}

	.left-wrapper .community .content .desc {
		width: calc(100% - 38px) !important;
		font-size: 13px !important;
	}
}

@media (max-width: 560px) {
	.left-wrapper .community {
		grid-template-columns: 1fr !important;
		min-height: 252px !important;
		padding: 36px 44px !important;
		gap: 10px !important;
	}

	.left-wrapper .community::after {
		left: 30px !important;
		right: 30px !important;
		top: 30px !important;
		bottom: 30px !important;
	}

	.left-wrapper .community .content {
		height: 40px !important;
		line-height: 40px !important;
	}

	.left-wrapper .community .content .icon,
	.left-wrapper .community .content .desc {
		line-height: 40px !important;
	}

	.left-wrapper .community .content .desc {
		font-size: 13px !important;
	}
}

/* =========================================================
   FIX INFO VOTACION GAP - STARLESS RO - By Ness
   =========================================================

   Corrección exacta:
   - Separa Info. del Server de Votación.
   - Mantiene el tamaño de letras.
   - Mantiene iconos.
   - Mantiene responsive.
   - No toca status, rankings ni footer.

========================================================= */

/* Regla base: el centro mantiene aire, pero sin empujar Info contra Votación */
.left-wrapper .community .item:nth-child(2) {
	margin-right: 12px !important;
}

.left-wrapper .community .item:nth-child(3) {
	margin-left: 18px !important;
	margin-right: 22px !important; /* ESTE corrige el pegado con Votación */
}

/* Abrimos un poco el botón Info hacia dentro, sin cambiar letras */
.left-wrapper .community .item:nth-child(3) .content {
	padding-left: 14px !important;
	padding-right: 14px !important;
}

/* Separador entre Info y Votación vuelve a respirar */
.left-wrapper .community .item:nth-child(3)::after {
	right: -13px !important;
	width: 7px !important;
	height: 7px !important;
	display: block !important;
	opacity: 0.92 !important;
}

/* El separador central sigue visible, pero no empuja demasiado */
.left-wrapper .community .item:nth-child(2)::after {
	right: -18px !important;
	width: 8px !important;
	height: 8px !important;
	display: block !important;
	opacity: 1 !important;
}

/* Asegura que Votación no se pegue hacia la izquierda */
.left-wrapper .community .item:nth-child(4) {
	margin-left: 4px !important;
}

/* Responsive: no aplicar micro-márgenes para no romper tablet/móvil */
@media (max-width: 900px) {
	.left-wrapper .community .item:nth-child(2),
	.left-wrapper .community .item:nth-child(3),
	.left-wrapper .community .item:nth-child(4) {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.left-wrapper .community .item:not(:last-child)::after {
		display: none !important;
	}
}

/* =========================================================
   MENU ITEMS CUSTOMS UNA LINEA - STARLESS RO - By Ness
   =========================================================

   Corrección:
   - 5 botones en UNA SOLA LINEA en desktop.
   - Votación NO baja.
   - Mantiene el estilo actual del menú.
   - Mantiene responsive en pantallas pequeñas.
   - No toca status, rankings ni footer.

========================================================= */

/* Más ancho para que 5 botones quepan en una sola línea */
.left-wrapper {
	width: min(96vw, 1320px) !important;
	max-width: 1320px !important;
}

/* Desktop: 5 columnas, una sola fila */
.left-wrapper .community {
	grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
	gap: 10px !important;

	/* reducimos un poco padding lateral para que no salte a segunda fila */
	padding-left: 52px !important;
	padding-right: 52px !important;

	/* una sola línea mantiene altura normal */
	min-height: 104px !important;
}

/* Quita márgenes especiales anteriores que empujaban botones */
.left-wrapper .community .item:nth-child(2),
.left-wrapper .community .item:nth-child(3),
.left-wrapper .community .item:nth-child(4),
.left-wrapper .community .item:nth-child(5) {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Botones compactos, sin cambiar el look */
.left-wrapper .community .content {
	padding-left: 10px !important;
	padding-right: 10px !important;
}

/* Icono un poco compacto para que el texto entre */
.left-wrapper .community .content .icon {
	width: 25px !important;
	font-size: 19px !important;
}

/* Texto ajustado para 5 botones en una línea */
.left-wrapper .community .content .desc {
	width: calc(100% - 34px) !important;
	margin-left: 8px !important;
	font-size: clamp(11px, 0.72vw, 13px) !important;
	letter-spacing: 0.75px !important;
}

/* Items Customs integrado al mismo estilo */
.left-wrapper .community .items-customs .content {
	background:
		linear-gradient(180deg,
			rgba(48, 31, 24, 0.97) 0%,
			rgba(8, 6, 10, 0.99) 52%,
			rgba(27, 16, 13, 0.98) 100%
		) !important;

	border-color: rgba(255, 204, 95, 0.52) !important;
}

/* Separadores balanceados para 5 botones */
.left-wrapper .community .item:not(:last-child)::after {
	right: -6px !important;
	width: 6px !important;
	height: 6px !important;
	display: block !important;
	opacity: 0.85 !important;
}

/* Para pantallas medianas: todavía intenta una sola fila si hay espacio */
@media (max-width: 1200px) {
	.left-wrapper {
		width: min(98vw, 1180px) !important;
	}

	.left-wrapper .community {
		padding-left: 42px !important;
		padding-right: 42px !important;
		gap: 8px !important;
	}

	.left-wrapper .community .content .desc {
		font-size: clamp(10px, 0.85vw, 12px) !important;
		letter-spacing: 0.5px !important;
	}
}

/* Tablet: aquí sí se permite adaptar para no romper */
@media (max-width: 900px) {
	.left-wrapper {
		width: min(100%, 820px) !important;
	}

	.left-wrapper .community {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		min-height: 190px !important;
		padding-left: 56px !important;
		padding-right: 56px !important;
		gap: 12px !important;
	}

	.left-wrapper .community .item:not(:last-child)::after {
		display: none !important;
	}

	.left-wrapper .community .content .desc {
		font-size: 13px !important;
	}
}

/* Móvil: 1 columna */
@media (max-width: 560px) {
	.left-wrapper .community {
		grid-template-columns: 1fr !important;
		min-height: 300px !important;
		padding-left: 44px !important;
		padding-right: 44px !important;
		gap: 9px !important;
	}
}

