/* =========================================================
   METIN2 DREAM — Tema noche azul / plata / oro
   Se carga DESPUÉS de style.min.css y bootstrap.css
   ========================================================= */

@font-face {
	font-family: 'VZTrajan';
	src: url('../fonts/TrajanProBold.ttf') format('truetype');
	font-weight: 400 900;
	font-display: swap;
}

:root {
	--vz-black: #03060f;
	--vz-obsidian: #070d22;
	--vz-ember: #0a1430;
	--vz-panel: rgba(8, 14, 36, .92);
	--vz-panel-2: rgba(12, 22, 52, .94);
	--vz-blood: #123a99;
	--vz-crimson: #2f6fe0;
	--vz-red: #ff4d5e;
	--vz-gold: #f0b440;
	--vz-gold-light: #e3eeff;
	--vz-gold-dark: #b07a1e;
	--vz-text: #d6e2f5;
	--vz-muted: #8597b8;
	--vz-line: rgba(110, 170, 255, .25);
	--vz-line-strong: rgba(120, 180, 255, .6);
	--vz-radius: 3px;
	--vz-display: 'VZTrajan', 'Cinzel', 'Trajan Pro', Georgia, serif;
	--vz-body: 'Open Sans', Arial, sans-serif;
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
body.vz {
	background: var(--vz-black) !important;
	color: var(--vz-text);
	font-family: var(--vz-body);
	font-size: 14px;
	min-width: 0;
	overflow-x: hidden;
}
body.vz a { color: var(--vz-gold); transition: color .2s; }
body.vz a:hover { color: var(--vz-gold-light); text-decoration: none; }
::selection { background: var(--vz-crimson); color: #fff; }
::-webkit-scrollbar { width: 9px; height: 9px; background: var(--vz-black); }
::-webkit-scrollbar-thumb { background: linear-gradient(var(--vz-blood), var(--vz-crimson)); border-radius: 6px; }

/* ---------- Botones ---------- */
.vz-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 34px;
	height: 50px;
	font-family: var(--vz-display);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: 2px;
	text-transform: uppercase;
	clip-path: polygon(14px 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 14px 100%, 0 50%);
	overflow: hidden;
	cursor: pointer;
	border: 0;
	transition: transform .25s, filter .25s;
}
.vz-btn span { position: relative; z-index: 2; display: flex; align-items: center; gap: 10px; }
.vz-btn::after {
	content: '';
	position: absolute; top: 0; left: -80%;
	width: 50%; height: 100%;
	background: linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent);
	transform: skewX(-20deg);
	transition: left .6s;
	z-index: 1;
}
.vz-btn:hover::after { left: 130%; }
.vz-btn:hover { transform: translateY(-2px); filter: brightness(1.12); }
.vz-btn-gold {
	color: #2a0f05 !important;
	background: linear-gradient(180deg, #fff4d6 0%, #f6c35a 35%, #d98b22 70%, #a8661a 100%);
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.4);
	text-shadow: 0 1px 0 rgba(255,240,200,.6);
}
.vz-btn-blood {
	color: var(--vz-gold-light) !important;
	background: linear-gradient(180deg, #e8323c 0%, #a3121d 45%, #5c0710 100%);
	text-shadow: 0 1px 2px rgba(0,0,0,.7);
}
.vz-btn-block { width: 100%; height: 46px; font-size: 14px; }

/* ---------- NAV ---------- */
.vz-nav {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: 1000;
	transition: background .35s, box-shadow .35s, backdrop-filter .35s;
	background: linear-gradient(180deg, rgba(3,6,15,.85), rgba(3,6,15,0));
}
.vz-nav.scrolled {
	background: rgba(3,6,16, .92);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	box-shadow: 0 1px 0 var(--vz-line), 0 10px 30px rgba(0,0,0,.5);
}
.vz-nav-inner {
	max-width: 1260px;
	margin: 0 auto;
	padding: 0 20px;
	height: 72px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.vz-nav-logo img {
	height: 52px; width: auto;
	filter: drop-shadow(0 0 10px rgba(60,140,255,.5));
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity .4s, transform .4s;
}
.vz-nav.scrolled .vz-nav-logo img { opacity: 1; transform: none; }
.vz-menu {
	display: flex !important;
	align-items: center;
	gap: 4px;
	margin: 0 !important;
	padding: 0 !important;
}
.vz-menu > li > a, .vz-lang-btn {
	display: flex;
	align-items: center;
	gap: 7px;
	padding: 10px 16px;
	font-family: var(--vz-display);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--vz-text) !important;
	position: relative;
	background: none; border: 0; cursor: pointer;
}
.vz-menu > li > a i { color: var(--vz-gold); font-size: 13px; opacity: .8; }
.vz-menu > li > a::after {
	content: '';
	position: absolute; left: 50%; bottom: 2px;
	width: 0; height: 2px;
	background: linear-gradient(90deg, transparent, var(--vz-gold), transparent);
	transition: width .3s, left .3s;
}
.vz-menu > li > a:hover { color: var(--vz-gold-light) !important; text-shadow: 0 0 12px rgba(110,170,255,.6); }
.vz-menu > li > a:hover::after { width: 80%; left: 10%; }

.vz-lang { position: relative; }
.vz-lang-btn img, .vz-lang-list img { width: 20px; height: auto; border-radius: 2px; }
.vz-lang-list {
	position: absolute; right: 0; top: 100%;
	min-width: 130px;
	background: rgba(4,8,22,.97);
	border: 1px solid var(--vz-line);
	border-radius: var(--vz-radius);
	padding: 6px;
	display: grid; grid-template-columns: 1fr 1fr; gap: 2px;
	opacity: 0; visibility: hidden; transform: translateY(6px);
	transition: .2s;
	box-shadow: 0 15px 40px rgba(0,0,0,.6);
}
.vz-lang:hover .vz-lang-list, .vz-lang.open .vz-lang-list { opacity: 1; visibility: visible; transform: none; }
.vz-lang-list a { display: flex; align-items: center; gap: 6px; padding: 6px 8px; font-size: 12px; color: var(--vz-text) !important; border-radius: 4px; }
.vz-lang-list a:hover { background: rgba(40,95,210,.25); }

.vz-burger { display: none; background: none; border: 0; width: 40px; height: 40px; flex-direction: column; justify-content: center; gap: 6px; cursor: pointer; }
.vz-burger span { display: block; height: 2px; background: var(--vz-gold); border-radius: 2px; transition: .3s; }

/* ---------- HERO (fondo con viento + logo) ---------- */
.m2-hero {
	position: relative;
	height: 100vh;
	min-height: 640px;
	max-height: 1000px;
	overflow: hidden;
	background: #050a1c;
}
.m2-hero-scene {
	position: absolute; inset: -2%;
	background-size: cover;
	background-position: 30% center;
	animation: m2Breath 20s ease-in-out infinite alternate;
	will-change: transform;
	transition: translate .6s ease-out;
}
@keyframes m2Breath {
	from { transform: scale(1); }
	to   { transform: scale(1.045); }
}
.m2-wind { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; transition: opacity 1s; }
.m2-wind.ready { opacity: 1; }
.m2-sun {
	position: absolute; z-index: 2; pointer-events: none;
	top: -35vh; right: 18vw;
	width: 70vh; height: 70vh; border-radius: 50%;
	background: radial-gradient(circle, rgba(255,240,205,.55) 0%, rgba(255,215,150,.22) 35%, transparent 70%);
	mix-blend-mode: screen;
	animation: m2Sun 7s ease-in-out infinite alternate;
}
@keyframes m2Sun { from { opacity: .55; transform: scale(.95); } to { opacity: 1; transform: scale(1.08); } }
.m2-dust { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none; }
.m2-hero-shade {
	position: absolute; inset: 0; z-index: 4; pointer-events: none;
	background:
		radial-gradient(ellipse 38% 45% at 74% 47%, rgba(2,5,18,.62), rgba(2,5,18,.25) 60%, transparent 75%),
		linear-gradient(180deg, rgba(3,6,18,.55) 0%, transparent 18%, transparent 70%, var(--vz-black) 100%),
		linear-gradient(90deg, transparent 50%, rgba(3,6,18,.25) 100%);
}
.m2-hero-content {
	position: absolute; z-index: 6;
	right: 5vw; top: 50%;
	transform: translateY(-46%);
	width: min(660px, 45vw);
	display: flex; flex-direction: column; align-items: center;
}

/* logo */
.m2-logo { display: block; width: 100%; animation: m2LogoIn 1.5s cubic-bezier(.2,.8,.2,1) both; transition: translate .5s ease-out; }
@keyframes m2LogoIn {
	0%   { opacity: 0; transform: translateY(-30px) scale(.9); filter: blur(10px); }
	100% { opacity: 1; transform: none; filter: blur(0); }
}
.m2-logo-float {
	position: relative; display: block;
	transform-origin: 50% 70%;
	animation: m2Float 7s ease-in-out 1.5s infinite;
}
@keyframes m2Float {
	0%, 100% { transform: translateY(0) rotate(-.5deg); }
	50%      { transform: translateY(-10px) rotate(.5deg); }
}
.m2-logo-img {
	display: block; width: 100%; height: auto;
	filter: drop-shadow(0 14px 28px rgba(0,0,0,.65)) drop-shadow(0 0 2px rgba(0,0,0,.5));
	-webkit-user-drag: none; user-select: none;
}
.m2-logo-red {
	position: absolute; inset: 0; width: 100%; height: auto;
	pointer-events: none;
	mix-blend-mode: screen;
	filter: blur(7px) brightness(1.7) saturate(1.3);
	opacity: 0;
	animation: m2Ember 3.6s ease-in-out 1.5s infinite;
}
@keyframes m2Ember { 0%, 100% { opacity: .15; } 50% { opacity: .85; } }
.m2-logo-shine {
	position: absolute; inset: 0;
	pointer-events: none;
	-webkit-mask-size: 100% 100%; mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	background: linear-gradient(105deg, transparent 40%, rgba(255,245,215,.85) 50%, transparent 60%);
	background-size: 260% 100%;
	background-repeat: no-repeat;
	mix-blend-mode: overlay;
	animation: m2Shine 7s ease-in-out 2.2s infinite;
}
@keyframes m2Shine { 0% { background-position: 130% 0; } 40%, 100% { background-position: -30% 0; } }
.m2-glint {
	position: absolute; width: 40px; height: 40px; margin: -20px 0 0 -20px;
	pointer-events: none; opacity: 0; mix-blend-mode: screen;
	background:
		radial-gradient(circle, #fff 0%, rgba(255,235,180,.9) 9%, rgba(255,190,90,.25) 28%, transparent 55%),
		linear-gradient(90deg, transparent, rgba(255,245,215,.95), transparent) center / 100% 2px no-repeat,
		linear-gradient(0deg, transparent, rgba(255,245,215,.95), transparent) center / 2px 100% no-repeat;
	animation: m2Glint 6s ease-in-out infinite;
}
.m2-glint.g1 { left: 91.5%; top: 70%; animation-delay: 3s; }
.m2-glint.g2 { left: 32%; top: 10.5%; animation-delay: 5.5s; }
@keyframes m2Glint {
	0%, 82%, 100% { opacity: 0; transform: scale(.3) rotate(0); }
	88% { opacity: 1; transform: scale(1.15) rotate(45deg); }
	94% { opacity: .3; transform: scale(.6) rotate(90deg); }
}

/* estado + CTA */
.m2-status {
	margin-top: 4px;
	display: inline-flex; align-items: center; gap: 10px;
	padding: 6px 18px;
	font-family: var(--vz-display); font-size: 12px; letter-spacing: 2px; text-transform: uppercase;
	color: var(--vz-gold-light);
	background: linear-gradient(180deg, rgba(14,24,56,.9), rgba(6,10,26,.9));
	border: 1px solid #000;
	box-shadow: inset 0 0 0 1px rgba(110,170,255,.45), 0 4px 14px rgba(0,0,0,.5);
	border-radius: 2px;
	animation: vzFadeUp 1s 1s both;
}
.m2-status .dot { width: 9px; height: 9px; border-radius: 50%; background: #5bd36a; box-shadow: 0 0 10px #5bd36a; animation: vzPulse 1.6s infinite; }
.m2-status.off .dot { background: var(--vz-red); box-shadow: 0 0 10px var(--vz-red); }
.m2-cta { display: flex; gap: 16px; margin-top: 22px; flex-wrap: wrap; justify-content: center; animation: vzFadeUp 1s 1.2s both; }
@keyframes vzFadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes vzPulse { 50% { opacity: .35; } }

.m2-scroll {
	position: absolute; z-index: 7; bottom: 22px; left: 50%;
	transform: translateX(-50%);
	font-size: 26px; color: var(--vz-gold-light) !important;
	text-shadow: 0 2px 8px #000;
	animation: m2Bob 2s ease-in-out infinite;
}
@keyframes m2Bob { 50% { transform: translate(-50%, 8px); } }


/* ---------- CUERPO ---------- */
body.vz .make-body {
	position: relative;
	min-width: 0 !important;
	padding: 20px 0 70px;
	background:
		radial-gradient(ellipse 80% 40% at 50% 0%, rgba(20,45,115,.35), transparent 70%),
		linear-gradient(180deg, var(--vz-black), var(--vz-obsidian) 30%, var(--vz-black)) !important;
}
body.vz .make-body::before {
	content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
	background: url(../img/dream/hero-bg.jpg) center bottom / cover no-repeat;
	mix-blend-mode: screen;
}
body.vz .make-body .make-container.main {
	position: relative; z-index: 2;
	width: auto !important;
	max-width: 1300px;
	padding: 0 20px;
	gap: 24px;
	align-items: flex-start;
}
body.vz .make-body .make-container .left-col,
body.vz .make-body .make-container .right-col {
	width: 300px !important; min-width: 300px !important; max-width: 300px !important;
	left: auto !important; right: auto !important;
	margin-top: 0 !important;
}
body.vz .make-body .make-container .center-col {
	flex: 1 1 auto;
	width: auto !important; min-width: 0 !important; max-width: none !important;
	margin-top: 0 !important;
}

/* ---------- CAJAS LATERALES ---------- */
body.vz .box-sm-v1 {
	position: relative;
	margin-bottom: 24px;
	background: var(--vz-panel);
	border: 1px solid var(--vz-line);
	border-radius: var(--vz-radius);
	box-shadow: 0 20px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(200,225,255,.06);
	overflow: hidden;
}
body.vz .box-sm-v1::before, body.vz .box-sm-v1::after {
	content: ''; position: absolute; width: 14px; height: 14px; pointer-events: none; z-index: 4;
	border-color: var(--vz-gold); border-style: solid; opacity: .8;
}
body.vz .box-sm-v1::before { top: 4px; left: 4px; border-width: 2px 0 0 2px; }
body.vz .box-sm-v1::after  { bottom: 4px; right: 4px; border-width: 0 2px 2px 0; }

body.vz .make-body .make-container .box-sm-v1 .heading {
	height: 50px;
	margin: 0 !important;
	padding: 0 20px;
	align-items: center;
	background: linear-gradient(90deg, rgba(20,45,115,.85), rgba(10,20,52,.6) 60%, rgba(5,10,26,.2)) !important;
	border-bottom: 1px solid var(--vz-line-strong);
	overflow: visible;
}
body.vz .make-body .make-container .box-sm-v1 .heading::after { display: none; }
body.vz .make-body .make-container .box-sm-v1 .heading h2 {
	font-family: var(--vz-display);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1.5px;
	color: var(--vz-gold-light);
	text-shadow: 0 0 10px rgba(110,170,255,.35);
}
body.vz .box-sm-v1 .heading h2 i { color: var(--vz-gold); margin-right: 6px; }
body.vz .make-body .make-container .box-sm-v1 .heading>div>.p-w-l {
	font-size: 11px; text-transform: uppercase; letter-spacing: 1px;
	color: var(--vz-gold) !important;
	padding: 3px 10px; border: 1px solid var(--vz-line); border-radius: 20px;
}
body.vz .make-body .make-container .box-sm-v1 .heading>div>.p-w-l:hover { background: rgba(110,170,255,.12); text-decoration: none; }

body.vz .make-body .make-container .box-sm-v1 .inner,
body.vz .make-body .make-container .box-sm-v1 .inner.login-box,
body.vz .make-body .make-container .box-sm-v1 .inner.rank,
body.vz .make-body .make-container .box-sm-v1 .inner.stats-box {
	background: none !important;
	margin: 0 !important;
	height: auto !important;
}

/* login */
body.vz .make-body .make-container .box-sm-v1 .inner.login-box form { padding: 22px 20px 10px; gap: 10px; }
body.vz .make-body .make-container .box-sm-v1 .inner.login-box form>label.username,
body.vz .make-body .make-container .box-sm-v1 .inner.login-box form>label.password {
	width: 100%; height: 44px; min-height: 44px; margin: 0;
	background: rgba(0,0,0,.45) !important;
	border: 1px solid rgba(110,170,255,.18);
	border-radius: var(--vz-radius);
	align-items: center;
	transition: border-color .2s, box-shadow .2s;
}
body.vz .inner.login-box form>label:focus-within { border-color: var(--vz-gold) !important; box-shadow: 0 0 0 3px rgba(110,170,255,.12), 0 0 18px rgba(60,140,255,.25); }
body.vz .inner.login-box form>label::before { display: none !important; }
body.vz .inner.login-box form>label > i { position: absolute; left: 15px; color: var(--vz-gold); opacity: .75; }
body.vz .make-body .make-container .box-sm-v1 .inner.login-box form>label input {
	background: transparent !important;
	padding: 0 14px 0 42px !important;
	height: 100%;
	font-size: 13px !important;
	color: var(--vz-text) !important;
}
body.vz .inner.login-box input::placeholder { color: #6f7f9f; }
body.vz .vz-captcha { width: 100%; display: flex; justify-content: center; overflow: hidden; }
body.vz .vz-captcha .g-recaptcha { transform: scale(.85); transform-origin: center; margin: -6px 0; }
body.vz .make-body .make-container .box-sm-v1 .inner.login-box .login-add { padding: 6px 20px 20px; font-size: 12px; text-align: center; color: var(--vz-muted); }
body.vz .inner.login-box .login-add .lane { margin-top: 6px; }
body.vz .inner.login-box .login-add .c-golden { color: var(--vz-gold) !important; }
body.vz .inner.login-box .login-add .c-white { color: #fff !important; font-weight: 600; }

/* menú de usuario */
body.vz .vz-usermenu { padding: 10px !important; margin: 0 !important; }
body.vz .vz-usermenu .user-menu {
	width: 100% !important; left: 0 !important; height: auto !important;
	display: block !important;
	margin-bottom: 3px;
}
body.vz .vz-usermenu .user-menu a {
	display: flex; align-items: center; gap: 10px;
	padding: 10px 14px;
	font-size: 13px;
	color: var(--vz-text) !important;
	border-radius: 4px;
	border-left: 2px solid transparent;
	transition: .2s;
}
body.vz .vz-usermenu .user-menu a i { width: 16px; color: var(--vz-gold); opacity: .8; text-align: center; }
body.vz .vz-usermenu .user-menu a:hover { background: linear-gradient(90deg, rgba(40,95,210,.3), transparent); border-left-color: var(--vz-gold); padding-left: 18px; }
body.vz .vz-usermenu .user-menu a.logout, body.vz .vz-usermenu .user-menu a.logout i { color: #ff6b73 !important; }
body.vz .vz-usermenu .user-menu:hover { transform: none; }

/* rankings laterales */
body.vz .make-body .make-container .box-sm-v1 .inner.rank { padding: 8px 10px 12px; }
body.vz .make-body .make-container .box-sm-v1 .inner.rank .p-thead {
	display: flex; padding: 8px 10px;
	font-size: 10px; text-transform: uppercase; letter-spacing: 1px;
	color: var(--vz-muted);
	border-bottom: 1px solid rgba(110,170,255,.1);
}
body.vz .make-body .make-container .box-sm-v1 .inner.rank .p-thead > * { font-size: 10px !important; }
body.vz .make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane {
	width: 100% !important; left: 0 !important;
	height: 34px;
	padding: 0 10px;
	justify-content: flex-start;
	border-radius: 4px;
	margin-top: 2px;
	color: var(--vz-text);
}
body.vz .make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:nth-child(odd) { background: rgba(255,255,255,.025); }
body.vz .make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:hover { background: linear-gradient(90deg, rgba(40,95,210,.25), transparent); transform: translateX(3px); }
body.vz .inner.rank .pix-tab .order { width: 34px !important; flex: 0 0 34px; }
body.vz .inner.rank .pix-tab .username { flex: 1 1 auto; width: auto !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px !important; }
body.vz .inner.rank .pix-tab .kingdom { width: 70px !important; flex: 0 0 70px; font-size: 11px !important; }
body.vz .inner.rank .pix-tab .level { width: auto !important; flex: 0 0 auto; min-width: 34px; text-align: right; color: var(--vz-gold-light) !important; font-weight: 700; }
body.vz .inner.rank .p-tbody .lane .order span {
	display: inline-flex; align-items: center; justify-content: center;
	width: 22px; height: 22px; border-radius: 50%;
	font-size: 11px; font-weight: 700; color: var(--vz-muted);
	background: rgba(255,255,255,.05);
}
body.vz .inner.rank .p-tbody .lane.pos-1 .order span { color: #2a1405; background: radial-gradient(circle at 35% 30%, #fff3c4, #f2b84b 50%, #a8661a); box-shadow: 0 0 12px rgba(110,170,255,.7); }
body.vz .inner.rank .p-tbody .lane.pos-2 .order span { color: #1b1b1b; background: radial-gradient(circle at 35% 30%, #fff, #c9ced6 50%, #7d838c); }
body.vz .inner.rank .p-tbody .lane.pos-3 .order span { color: #2a1405; background: radial-gradient(circle at 35% 30%, #ffd2a8, #cd7f32 50%, #7a4519); }
body.vz .inner.rank .p-tbody .lane.pos-1 .username { color: var(--vz-gold-light); font-weight: 700; }

/* estadísticas */
body.vz .inner.stats-box { padding: 10px 12px 14px; }
body.vz .inner.stats-box .table { margin: 0; background: transparent; }
body.vz .inner.stats-box .table th,
body.vz .inner.stats-box .table td {
	background: none !important;
	border: 0 !important;
	border-bottom: 1px solid rgba(110,170,255,.08) !important;
	padding: 10px 8px !important;
	font-size: 13px;
	color: var(--vz-muted);
	font-weight: 400;
}
body.vz .inner.stats-box .table td { text-align: right; color: var(--vz-gold-light) !important; font-family: var(--vz-display); font-weight: 700; font-size: 15px; }
body.vz .inner.stats-box .table tr:hover th, body.vz .inner.stats-box .table tr:hover td { background: rgba(40,95,210,.12) !important; }
body.vz .vz-offline { padding: 30px; text-align: center; color: #ff6b73; font-family: var(--vz-display); letter-spacing: 1px; }

/* tarjeta descarga */
.vz-dl-card {
	display: flex; align-items: center; gap: 16px;
	padding: 20px 22px;
	border-radius: var(--vz-radius);
	border: 1px solid var(--vz-line-strong);
	background: linear-gradient(135deg, rgba(40,95,210,.6), rgba(10,20,52,.9));
	box-shadow: 0 15px 35px rgba(0,0,0,.45);
	position: relative; overflow: hidden;
	transition: transform .25s, box-shadow .25s;
}
.vz-dl-card::after { content: ''; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.25), transparent); transform: skewX(-20deg); transition: left .7s; }
.vz-dl-card:hover::after { left: 130%; }
.vz-dl-card:hover { transform: translateY(-3px); box-shadow: 0 20px 40px rgba(40,95,210,.35); }
.vz-dl-card > i { font-size: 30px; color: var(--vz-gold-light); text-shadow: 0 0 15px rgba(110,170,255,.7); }
.vz-dl-card strong { display: block; font-family: var(--vz-display); font-size: 17px; letter-spacing: 2px; text-transform: uppercase; color: #fff; }
.vz-dl-card span { font-size: 12px; color: var(--vz-gold-light); opacity: .8; }

/* ---------- COLUMNA CENTRAL ---------- */
body.vz .center-col .banner-main { padding: 0; margin-bottom: 24px; }
body.vz .slider {
	width: 100% !important; margin: 0 !important;
	position: relative;
	border-radius: var(--vz-radius);
	overflow: hidden;
	border: 1px solid var(--vz-line-strong);
	box-shadow: 0 25px 50px rgba(0,0,0,.55), 0 0 40px rgba(40,95,210,.15);
}
body.vz .slider-wrapper { height: auto !important; aspect-ratio: 16 / 7; margin: 0 !important; }
body.vz .slide { margin: 0 !important; object-fit: cover; transition: opacity 1.2s ease, transform 7s linear !important; transform: scale(1.06); }
body.vz .slide.active { transform: scale(1); }
body.vz .slider::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(3,6,15,.8)); pointer-events: none; }
body.vz .slider-dots { position: absolute; z-index: 3; bottom: 14px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; }
body.vz .slider-dots button { width: 28px; height: 4px; border: 0; border-radius: 2px; background: rgba(255,255,255,.3); cursor: pointer; transition: .3s; padding: 0; }
body.vz .slider-dots button.active { background: var(--vz-gold); width: 44px; box-shadow: 0 0 10px var(--vz-gold); }

body.vz .center-col .newsfeed {
	margin: 0;
	padding: 6px 28px 28px;
	min-height: 400px;
	background: var(--vz-panel) !important;
	border: 1px solid var(--vz-line);
	border-radius: var(--vz-radius);
	box-shadow: 0 20px 40px rgba(0,0,0,.45);
	position: relative;
}
body.vz .center-col .newsfeed::before {
	content: ''; position: absolute; top: -1px; left: 10%; right: 10%; height: 2px;
	background: linear-gradient(90deg, transparent, var(--vz-gold), transparent);
}

/* títulos de página */
body.vz .center-col .heading-main { align-items: flex-end; margin-bottom: 18px; position: relative; flex-wrap: wrap; }
body.vz .center-col .heading-main strong,
body.vz .pre-social {
	display: block;
	margin-top: 22px;
	padding-bottom: 0 !important;
	font-family: var(--vz-display) !important;
	font-size: 24px !important;
	font-weight: 900 !important;
	letter-spacing: 2px;
	background: linear-gradient(180deg, #fff4d6, #f2b84b 55%, #b8731f);
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent;
	filter: drop-shadow(0 2px 6px rgba(40,95,210,.45));
}
body.vz .center-col .heading-main .horizontal-line { width: 100%; }
body.vz .center-col .heading-main .horizontal-line img { display: none; }
body.vz .center-col .heading-main .horizontal-line,
body.vz .page-hd::after {
	height: 1px; margin-top: 12px;
	background: linear-gradient(90deg, var(--vz-gold), rgba(40,95,210,.6) 40%, transparent);
}
body.vz .page-hd { position: relative; display: block; margin-bottom: 20px; padding-bottom: 12px; background: none !important; }
body.vz .page-hd::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; }
body.vz .center-col .heading-main .switch { margin-top: 0; gap: 8px; }
body.vz .center-col .heading-main .switch .option { padding: 6px 12px !important; border: 1px solid var(--vz-line); border-radius: 20px; margin: 0 !important; }
body.vz .center-col .heading-main .switch .option span { padding: 0 !important; display: flex; align-items: center; gap: 6px; font-size: 12px; }
body.vz .center-col .heading-main .switch .option span img { height: 16px; }
body.vz .center-col .heading-main .switch .option.active,
body.vz .center-col .heading-main .switch .option:hover { background: rgba(40,95,210,.3); border-color: var(--vz-gold); }
body.vz .center-col .heading-main .switch .option::after { display: none !important; }

/* noticias */
body.vz .center-col .newsfeed .news-single {
	margin: 0 0 22px;
	padding-bottom: 22px;
	border-bottom: 1px solid rgba(110,170,255,.1);
	overflow: hidden;
}
body.vz .center-col .newsfeed .news-single .titlebar {
	width: auto !important;
	height: auto; min-height: 44px;
	margin: 0 0 16px !important;
	padding: 10px 16px;
	gap: 10px; flex-wrap: wrap;
	border-radius: 4px;
	border-left: 3px solid var(--vz-gold);
	background: linear-gradient(90deg, rgba(40,95,210,.55), rgba(10,20,52,.35) 60%, transparent) !important;
}
body.vz .center-col .newsfeed .news-single .titlebar > span:first-child,
body.vz .center-col .newsfeed .news-single .titlebar > span:first-child a {
	font-family: var(--vz-display); font-size: 16px !important; font-weight: 700; color: #fff !important; letter-spacing: .5px;
}
body.vz .center-col .newsfeed .news-single .titlebar > span:first-child a:hover { color: var(--vz-gold-light) !important; }
body.vz .center-col .newsfeed .news-single .titlebar > span:last-child { margin-left: auto !important; font-size: 11px; color: var(--vz-muted); }
body.vz .center-col .newsfeed .news-single .titlebar > span:last-child a { color: var(--vz-gold) !important; }
body.vz .center-col .newsfeed .news-single .innertext,
body.vz .center-col .newsfeed .news-single .innertext p { font-size: 14px; line-height: 1.7; color: var(--vz-text); }
body.vz .news-profile-img { max-width: 180px; border-radius: var(--vz-radius); border: 1px solid var(--vz-line); margin: 0 18px 10px 0; padding: 0 !important; }

/* paginación */
body.vz .center-col .pagination, body.vz .pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin-top: 20px; }
body.vz .pagination li a, body.vz .pagination li span, body.vz .page-link,
body.vz .center-col .pagination .buttons a, body.vz .center-col .pagination .buttons span {
	min-width: 36px; height: 36px; padding: 0 10px !important;
	display: inline-flex !important; align-items: center; justify-content: center;
	background: rgba(0,0,0,.4) !important; color: var(--vz-text) !important;
	border: 1px solid var(--vz-line) !important; border-radius: 4px !important;
	font-size: 13px;
}
body.vz .pagination li a:hover, body.vz .page-link:hover { border-color: var(--vz-gold) !important; color: var(--vz-gold-light) !important; }
body.vz .pagination .active a, body.vz .pagination .active span, body.vz .page-item.active .page-link,
body.vz .center-col .pagination .buttons span.active {
	background: linear-gradient(180deg, var(--vz-crimson), var(--vz-blood)) !important;
	border-color: var(--vz-gold) !important; color: #fff !important;
}

/* ---------- BOOTSTRAP (tablas, formularios, alertas) ---------- */
body.vz .table { color: var(--vz-text); background: transparent; }
body.vz .newsfeed .table { border-radius: var(--vz-radius); overflow: hidden; }
body.vz .table thead th, body.vz .thead-inverse th, body.vz .thead-default th, body.vz .thead-dark th {
	background: linear-gradient(180deg, rgba(20,45,115,.9), rgba(15,35,90,.9)) !important;
	color: var(--vz-gold-light) !important;
	border: 0 !important;
	font-family: var(--vz-display); font-size: 12px; letter-spacing: 1px; text-transform: uppercase;
}
body.vz .table td, body.vz .table th { border-top: 1px solid rgba(110,170,255,.08) !important; vertical-align: middle; }
body.vz .table-striped tbody tr:nth-of-type(odd) { background: rgba(255,255,255,.025) !important; }
body.vz .table-hover tbody tr:hover { background: rgba(40,95,210,.15) !important; }
body.vz .table a { color: var(--vz-gold-light); }

body.vz .form-control, body.vz .newsfeed input[type=text], body.vz .newsfeed input[type=password], body.vz .newsfeed input[type=email], body.vz .newsfeed input[type=number], body.vz .newsfeed select, body.vz .newsfeed textarea,
body.vz .center-col .formbox .default input, body.vz .center-col .scroll-form .inside form .default input {
	background: rgba(0,0,0,.45) !important;
	background-image: none !important;
	border: 1px solid rgba(110,170,255,.22) !important;
	border-radius: var(--vz-radius) !important;
	color: var(--vz-text) !important;
	min-height: 42px;
	padding: 8px 14px;
	transition: border-color .2s, box-shadow .2s;
}
body.vz .form-control:focus, body.vz .newsfeed input:focus, body.vz .newsfeed select:focus, body.vz .newsfeed textarea:focus {
	border-color: var(--vz-gold) !important;
	box-shadow: 0 0 0 3px rgba(110,170,255,.12), 0 0 18px rgba(60,140,255,.2) !important;
	outline: 0;
}
body.vz .form-control::placeholder { color: #6f7f9f; }
body.vz label, body.vz .col-form-label { color: var(--vz-text); }

body.vz .btn { border-radius: 4px; font-family: var(--vz-display); font-weight: 700; letter-spacing: 1px; text-transform: uppercase; font-size: 13px; padding: 9px 20px; border: 0; transition: .2s; }
body.vz .btn-primary, body.vz .btn-success, body.vz .btn-info,
body.vz .center-col .formbox .submit button, body.vz .center-col .scroll-form .inside form .submit button, body.vz .center-col .buttons-vote a {
	background: linear-gradient(180deg, #fff4d6 0%, #f6c35a 35%, #d98b22 70%, #a8661a 100%) !important;
	background-image: linear-gradient(180deg, #fff4d6 0%, #f6c35a 35%, #d98b22 70%, #a8661a 100%) !important;
	color: #2a0f05 !important;
	box-shadow: 0 6px 18px rgba(110,170,255,.2);
	border-radius: 4px;
	width: auto; min-width: 140px; height: 44px; padding: 0 24px;
}
body.vz .center-col .formbox .submit button b, body.vz .center-col .scroll-form .inside form .submit button b, body.vz .center-col .buttons-vote a b { color: #2a0f05 !important; text-shadow: none !important; font-family: var(--vz-display); }
body.vz .btn-primary:hover, body.vz .btn-success:hover, body.vz .btn-info:hover { filter: brightness(1.1); transform: translateY(-1px); }
body.vz .btn-danger, body.vz .btn-warning { background: linear-gradient(180deg, #e8323c, #7a0d16) !important; color: #fff !important; }
body.vz .btn-secondary, body.vz .btn-default { background: rgba(255,255,255,.08) !important; color: var(--vz-text) !important; border: 1px solid var(--vz-line) !important; }

body.vz .jumbotron { background: rgba(0,0,0,.3) !important; border: 1px solid var(--vz-line); border-radius: var(--vz-radius); }
body.vz .card, body.vz .panel, body.vz .list-group-item, body.vz .modal-content {
	background: var(--vz-panel-2) !important; border: 1px solid var(--vz-line) !important; color: var(--vz-text);
}
body.vz .card-header, body.vz .panel-heading, body.vz .modal-header { background: rgba(20,45,115,.6) !important; border-color: var(--vz-line) !important; color: var(--vz-gold-light); font-family: var(--vz-display); }
body.vz .modal-footer { border-color: var(--vz-line) !important; }
body.vz .close { color: var(--vz-gold-light); text-shadow: none; opacity: .8; }

body.vz .alert { border-radius: var(--vz-radius); border-width: 1px; border-left-width: 4px; }
body.vz .alert-success { background: rgba(34,90,50,.35); border-color: #4ade80; color: #c8f7d6; }
body.vz .alert-danger, body.vz .alert-red { background: rgba(20,45,115,.4); border-color: var(--vz-red); color: #ffd0d3; }
body.vz .alert-info { background: rgba(110,170,255,.1); border-color: var(--vz-gold); color: var(--vz-gold-light); }
body.vz .alert-warning { background: rgba(217,139,34,.15); border-color: #d98b22; color: #ffe1b0; }
body.vz .tag, body.vz .badge { background: var(--vz-crimson); color: #fff; }

/* bloques de usuario / ranking grande */
body.vz .center-col .user-details>.lane { height: auto; padding: 10px 14px; border-radius: 4px; background-image: none !important; }
body.vz .center-col .user-details>.lane:nth-child(odd) { background: rgba(255,255,255,.03) !important; }
body.vz .center-col .ranking-big .lane { height: 36px; border-radius: 4px; }
body.vz .center-col .ranking-big .lane:nth-child(odd) { background: rgba(255,255,255,.03) !important; }
body.vz .center-col .ranking-big .lane:hover { background: rgba(40,95,210,.18) !important; }
body.vz .center-col .scroll-form .heading-sf {
	width: auto !important; margin-left: 0 !important;
	background: linear-gradient(90deg, rgba(40,95,210,.5), rgba(10,20,52,.3)) !important;
	border-left: 3px solid var(--vz-gold); border-radius: 4px;
}
body.vz .center-col .scroll-form .heading-sf .icon { background: none !important; position: relative; }
body.vz .center-col .scroll-form .heading-sf .icon::before { content: '+'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--vz-gold); font-size: 20px; font-weight: 700; }
body.vz .download-button { background-color: var(--vz-blood) !important; border: 1px solid var(--vz-line-strong); width: 100%; max-width: 340px; }
body.vz .download-button:hover { filter: brightness(1.2); }
body.vz .notification { border-radius: var(--vz-radius); }

/* reino (colores de imperio) */
body.vz .kingdom.red, body.vz span.red { color: #ff5a63 !important; }
body.vz .kingdom.yellow, body.vz span.yellow { color: #f2c94c !important; }
body.vz .kingdom.blue, body.vz span.blue { color: #6aa8ff !important; }

/* ---------- FOOTER ---------- */
.vz-footer {
	position: relative;
	background: linear-gradient(180deg, var(--vz-black), #120507);
	border-top: 1px solid var(--vz-line);
	padding: 50px 20px 30px;
	text-align: center;
	overflow: hidden;
}
.vz-footer::before {
	content: ''; position: absolute; left: 50%; top: 0; transform: translateX(-50%);
	width: 600px; height: 200px;
	background: radial-gradient(ellipse at top, rgba(40,95,210,.35), transparent 70%);
	pointer-events: none;
}
.vz-footer-inner { position: relative; max-width: 1260px; margin: 0 auto; }
.vz-footer-logo img { height: 80px; width: auto; filter: drop-shadow(0 0 14px rgba(60,140,255,.5)); transition: transform .3s, filter .3s; }
.vz-footer-logo:hover img { transform: scale(1.05); filter: drop-shadow(0 0 22px rgba(80,150,255,.8)); }
.vz-footer-menu { display: flex !important; justify-content: center; flex-wrap: wrap; gap: 6px 26px; margin: 22px 0 !important; padding: 0 !important; }
.vz-footer-menu a { font-family: var(--vz-display); font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--vz-text) !important; }
.vz-footer-menu a:hover { color: var(--vz-gold-light) !important; }
.vz-footer-copy { font-size: 12px; color: var(--vz-muted); padding-top: 20px; border-top: 1px solid rgba(110,170,255,.1); }
.vz-gotop {
	position: fixed; right: 22px; bottom: 22px; z-index: 900;
	width: 44px; height: 44px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-size: 22px; color: #2a0f05 !important;
	background: linear-gradient(180deg, #fff4d6, #f2b84b 50%, #a8661a);
	box-shadow: 0 6px 20px rgba(0,0,0,.5), 0 0 16px rgba(110,170,255,.4);
	opacity: 0; transform: translateY(20px); transition: .3s; pointer-events: none;
}
.vz-gotop.show { opacity: 1; transform: none; pointer-events: auto; }

/* ocultar restos del tema anterior */
body.vz .make-footer, body.vz .flags-container, body.vz .make-header { display: none !important; }

/* animación de aparición al hacer scroll */
.vz-reveal { opacity: 0; transform: translateY(30px); transition: opacity .8s ease, transform .8s ease; }
.vz-reveal.in { opacity: 1; transform: none; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1180px) {
	body.vz .make-body .make-container.main { flex-wrap: wrap; }
	body.vz .make-body .make-container .center-col { order: 1 !important; flex: 1 1 100% !important; }
	body.vz .make-body .make-container .left-col { order: 2 !important; }
	body.vz .make-body .make-container .right-col { order: 3 !important; }
	body.vz .make-body .make-container .left-col,
	body.vz .make-body .make-container .right-col { flex: 1 1 300px; width: auto !important; max-width: none !important; }
}
@media (max-width: 900px) {
	.vz-burger { display: flex; }
	.vz-nav-logo img { opacity: 1; transform: none; }
	.vz-menu {
		position: absolute; top: 72px; left: 0; right: 0;
		flex-direction: column; align-items: stretch !important;
		background: rgba(3,6,16,.97);
		border-bottom: 1px solid var(--vz-line);
		max-height: 0; overflow: hidden; transition: max-height .4s;
	}
	.vz-menu.open { max-height: 600px; }
	.vz-menu > li > a, .vz-lang-btn { padding: 14px 24px; }
	.vz-lang-list { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; grid-template-columns: repeat(5, 1fr); padding: 0 16px 14px; }
	.vz-burger.open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
	.vz-burger.open span:nth-child(2) { opacity: 0; }
	.vz-burger.open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
	.vz-hero { height: 78vh; min-height: 520px; }
	.vz-logo-ring { display: none; }
	body.vz .center-col .newsfeed { padding: 4px 16px 20px; }
	.vz-btn { height: 46px; padding: 0 26px; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.vz-reveal { opacity: 1; transform: none; }
}

/* ---------- Ajustes de compatibilidad con el tema anterior ---------- */
body.vz, body.vz p, body.vz span, body.vz td { font-weight: 400; }
body.vz .center-col .heading-main .horizontal-line { margin: 12px 0 0 !important; flex-basis: 100%; }
body.vz .make-body .make-container .box-sm-v1 .inner.login-box form button.vz-btn {
	margin: 4px 0 0 !important;
	width: 100% !important;
	height: 46px !important;
	transform: none;
	background-size: auto !important;
}
body.vz .make-body .make-container .box-sm-v1 .inner.login-box form button.vz-btn:hover { transform: translateY(-2px); }
body.vz .make-body .make-container .box-sm-v1 .inner.login-box .login-add { display: block; padding: 6px 20px 20px; }
body.vz .make-body .make-container .box-sm-v1 .inner.login-box .login-add .lane { font-size: 12px; color: var(--vz-muted); min-width: 0; }
body.vz .make-body .make-container .box-sm-v1 .heading h2 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; letter-spacing: 1px; }
body.vz .make-body .make-container .box-sm-v1 .heading > div { flex: 0 0 auto; margin-left: 8px; }
body.vz .make-body .make-container .box-sm-v1 .heading > div > .p-w-l { white-space: nowrap; }
body.vz .make-body .make-container .box-sm-v1 .inner.login-box form button.vz-btn {
	background-image: linear-gradient(180deg, #fff4d6 0%, #f6c35a 35%, #d98b22 70%, #a8661a 100%) !important;
	color: #2a0f05 !important;
}

/* =========================================================
   ESTILO OLD SCHOOL (marcos de bronce, madera, pergamino)
   ========================================================= */
body.m2 { background: var(--vz-black) !important; }
body.m2 .make-body {
	background:
		radial-gradient(ellipse 80% 35% at 50% 0%, rgba(30,70,160,.22), transparent 70%),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
		linear-gradient(180deg, var(--vz-black), var(--vz-obsidian) 35%, var(--vz-black)) !important;
}
body.m2 .make-body::before { opacity: .07; mix-blend-mode: luminosity; filter: blur(2px); }

/* ---------- Botones estilo Metin2 ---------- */
.m2-btn {
	position: relative;
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	height: 46px; padding: 0 30px;
	font-family: var(--vz-display); font-weight: 700; font-size: 14px;
	letter-spacing: 1.5px; text-transform: uppercase;
	color: var(--vz-gold-light) !important;
	text-shadow: 0 1px 0 #000, 0 0 8px rgba(0,0,0,.7);
	background: linear-gradient(180deg, #1d2f63 0%, #0f1a3d 52%, #0a1230 53%, #0e1838 100%);
	border: 1px solid #000;
	border-radius: 3px;
	box-shadow:
		inset 0 0 0 1px #5f9dff,
		inset 0 0 0 2px #0b1534,
		inset 0 2px 0 2px rgba(200,225,255,.18),
		0 5px 14px rgba(0,0,0,.6);
	cursor: pointer;
	transition: filter .2s, transform .15s, box-shadow .2s;
	overflow: hidden;
	white-space: nowrap;
}
.m2-btn i { color: var(--vz-gold); font-size: 1.05em; }
.m2-btn::before, .m2-btn::after {
	content: ''; position: absolute; top: 50%;
	width: 7px; height: 7px; margin-top: -3.5px;
	transform: rotate(45deg);
	background: linear-gradient(135deg, #e6f1ff, #5f9dff 50%, #2b4f9c);
	box-shadow: 0 0 0 1px #000;
}
.m2-btn::before { left: 9px; }
.m2-btn::after  { right: 9px; }
.m2-btn:hover {
	filter: brightness(1.18);
	box-shadow:
		inset 0 0 0 1px #9cc9ff,
		inset 0 0 0 2px #0b1534,
		inset 0 2px 0 2px rgba(200,225,255,.25),
		0 0 18px rgba(90,160,255,.35),
		0 5px 14px rgba(0,0,0,.6);
	text-decoration: none;
}
.m2-btn:active { transform: translateY(1px); filter: brightness(.95); }
.m2-btn-red { background: linear-gradient(180deg, #4a95ff 0%, #1f5bd0 52%, #1442a8 53%, #1a4cb8 100%); }
.m2-btn-red i { color: var(--vz-gold-light); }
.m2-btn-lg { height: 56px; padding: 0 44px; font-size: 16px; letter-spacing: 2px; }
.m2-btn-block { width: 100%; }
body.vz .make-body .make-container .box-sm-v1 .inner.login-box form button.m2-btn {
	margin: 4px 0 0 !important; width: 100% !important; height: 46px !important;
	transform: none;
	background-size: auto !important;
	background-image: linear-gradient(180deg, #4a95ff 0%, #1f5bd0 52%, #1442a8 53%, #1a4cb8 100%) !important;
	color: var(--vz-gold-light) !important;
}

/* botones bootstrap / del CMS con el mismo estilo */
body.m2 .btn-primary, body.m2 .btn-success, body.m2 .btn-info,
body.m2 .center-col .formbox .submit button, body.m2 .center-col .scroll-form .inside form .submit button, body.m2 .center-col .buttons-vote a {
	background: linear-gradient(180deg, #4a95ff 0%, #1f5bd0 52%, #1442a8 53%, #1a4cb8 100%) !important;
	background-image: linear-gradient(180deg, #4a95ff 0%, #1f5bd0 52%, #1442a8 53%, #1a4cb8 100%) !important;
	color: var(--vz-gold-light) !important;
	border: 1px solid #000 !important;
	box-shadow: inset 0 0 0 1px #5f9dff, inset 0 0 0 2px #0b1534, 0 4px 12px rgba(0,0,0,.5) !important;
	text-shadow: 0 1px 0 #000;
	border-radius: 3px !important;
}
body.m2 .center-col .formbox .submit button b, body.m2 .center-col .scroll-form .inside form .submit button b, body.m2 .center-col .buttons-vote a b { color: var(--vz-gold-light) !important; }
body.m2 .btn-secondary, body.m2 .btn-default {
	background: linear-gradient(180deg, #1d2f63, #0e1838) !important;
	color: var(--vz-gold-light) !important; border: 1px solid #000 !important;
	box-shadow: inset 0 0 0 1px #5f9dff !important;
}

/* ---------- Paneles con marco de bronce ---------- */
body.m2 .box-sm-v1, body.m2 .center-col .newsfeed {
	background:
		linear-gradient(180deg, rgba(12,20,48,.97), rgba(6,10,28,.97)) !important;
	border: 1px solid #000;
	border-radius: 3px;
	box-shadow:
		inset 0 0 0 1px #34548f,
		inset 0 0 0 3px #070d22,
		inset 0 0 0 4px rgba(110,170,255,.28),
		inset 0 0 40px rgba(0,0,0,.5),
		0 14px 34px rgba(0,0,0,.6);
}
body.m2 .center-col .newsfeed::before { display: none; }
body.m2 .box-sm-v1::before, body.m2 .box-sm-v1::after {
	width: 10px; height: 10px; border: 0;
	background: linear-gradient(135deg, #e6f1ff, #5f9dff 50%, #2b4f9c);
	transform: rotate(45deg);
	box-shadow: 0 0 0 1px #000, 0 0 6px rgba(110,170,255,.5);
	opacity: 1;
}
body.m2 .box-sm-v1::before { top: -5px; left: 50%; margin-left: -5px; }
body.m2 .box-sm-v1::after  { bottom: -5px; right: auto; left: 50%; margin-left: -5px; }
body.m2 .box-sm-v1 { overflow: visible; }

body.m2 .make-body .make-container .box-sm-v1 .heading {
	margin: 4px 4px 0 !important;
	background: linear-gradient(180deg, #22397a 0%, #142553 50%, #0d1838 100%) !important;
	border-bottom: 1px solid #000;
	box-shadow: inset 0 1px 0 rgba(200,225,255,.22), 0 1px 0 rgba(110,170,255,.35);
	justify-content: center;
	position: relative;
}
body.m2 .make-body .make-container .box-sm-v1 .heading h2 {
	color: var(--vz-gold-light);
	text-shadow: 0 1px 0 #000, 0 0 10px rgba(110,170,255,.3);
	flex: 1 1 auto; text-align: center;
}
body.m2 .make-body .make-container .box-sm-v1 .heading>div>.p-w-l {
	background: rgba(0,0,0,.3); border-color: rgba(110,170,255,.4); border-radius: 2px;
}

body.m2 .make-body .make-container .box-sm-v1 .inner.login-box form>label.username,
body.m2 .make-body .make-container .box-sm-v1 .inner.login-box form>label.password,
body.m2 .form-control, body.m2 .newsfeed input[type=text], body.m2 .newsfeed input[type=password], body.m2 .newsfeed input[type=email], body.m2 .newsfeed select, body.m2 .newsfeed textarea {
	background: linear-gradient(180deg, #040817, #0a1230) !important;
	border: 1px solid #000 !important;
	box-shadow: inset 0 0 0 1px rgba(110,170,255,.25), inset 0 2px 6px rgba(0,0,0,.7) !important;
	border-radius: 2px !important;
}
body.m2 .inner.login-box form>label:focus-within, body.m2 .form-control:focus, body.m2 .newsfeed input:focus {
	box-shadow: inset 0 0 0 1px var(--vz-gold), 0 0 12px rgba(110,170,255,.3) !important;
}

/* filas tipo pergamino oscuro */
body.m2 .make-body .make-container .box-sm-v1 .inner.rank .p-tbody .lane:hover { background: linear-gradient(90deg, rgba(110,170,255,.18), transparent); }
body.m2 .inner.rank .p-tbody .lane.pos-1 .order span { background: radial-gradient(circle at 35% 30%, #fff4d6, #d9a441 50%, #2b4f9c); }

/* títulos de página */
body.m2 .center-col .heading-main strong, body.m2 .pre-social {
	background: linear-gradient(180deg, #ffffff, #a9cfff 55%, #4d86e0);
	-webkit-background-clip: text; background-clip: text;
	filter: drop-shadow(0 2px 0 #000);
	margin-left: 0 !important;
}
body.m2 .center-col .heading-main .horizontal-line, body.m2 .page-hd::after {
	height: 2px;
	background: linear-gradient(90deg, #5f9dff, rgba(60,120,240,.7) 45%, transparent);
}

/* noticias */
body.m2 .center-col .newsfeed .news-single .titlebar {
	border-left: 0;
	border: 1px solid #000;
	border-radius: 2px;
	background: linear-gradient(180deg, #22397a, #0d1838) !important;
	box-shadow: inset 0 1px 0 rgba(200,225,255,.2), inset 0 0 0 1px rgba(110,170,255,.3);
}
body.m2 .center-col .newsfeed .news-single .titlebar > span:first-child a { color: var(--vz-gold-light) !important; text-shadow: 0 1px 0 #000; }

/* tarjeta de descarga */
body.m2 .vz-dl-card {
	border: 1px solid #000; border-radius: 3px;
	background: linear-gradient(180deg, #2a62d6, #0e2266);
	box-shadow: inset 0 0 0 1px #5f9dff, inset 0 0 0 3px #081538, inset 0 0 0 4px rgba(110,170,255,.35), 0 14px 30px rgba(0,0,0,.6);
}

/* slider */
body.m2 .slider { border: 1px solid #000; border-radius: 3px; box-shadow: inset 0 0 0 1px #34548f, 0 0 0 3px #070d22, 0 0 0 4px rgba(110,170,255,.35), 0 18px 40px rgba(0,0,0,.6); }
body.m2 .slider::after { background: linear-gradient(180deg, transparent 60%, rgba(3,6,18,.75)); }
body.m2 .slider-dots button.active { background: var(--vz-gold); box-shadow: 0 0 8px var(--vz-gold); }

/* nav */
body.m2 .vz-nav { background: linear-gradient(180deg, rgba(3,6,18,.8), rgba(3,6,18,0)); }
body.m2 .vz-nav.scrolled {
	background: linear-gradient(180deg, #0d1838, #070d22);
	box-shadow: 0 1px 0 #000, 0 2px 0 rgba(110,170,255,.45), 0 10px 30px rgba(0,0,0,.55);
}
body.m2 .vz-nav-logo img { height: 56px; filter: drop-shadow(0 2px 6px rgba(0,0,0,.7)); }
body.m2 .vz-menu > li > a { text-shadow: 0 1px 3px #000; }
body.m2 .vz-menu > li > a:hover { color: var(--vz-gold-light) !important; text-shadow: 0 0 10px rgba(110,170,255,.6), 0 1px 3px #000; }
body.m2 .vz-lang-list { background: #08102a; border: 1px solid #000; box-shadow: inset 0 0 0 1px rgba(110,170,255,.35), 0 15px 40px rgba(0,0,0,.6); }

/* footer */
body.m2 .vz-footer { background: linear-gradient(180deg, var(--vz-black), #050a1c); border-top: 1px solid #000; box-shadow: inset 0 1px 0 rgba(110,170,255,.3); }
body.m2 .vz-footer::before { background: radial-gradient(ellipse at top, rgba(60,120,255,.18), transparent 70%); }
body.m2 .vz-footer-logo img { height: 110px; filter: drop-shadow(0 6px 14px rgba(0,0,0,.7)); }
body.m2 .vz-footer-logo:hover img { filter: drop-shadow(0 6px 14px rgba(0,0,0,.7)) drop-shadow(0 0 14px rgba(110,170,255,.4)); }
.m2-footer-ornament {
	position: absolute; top: -6px; left: 50%; margin-left: -6px;
	width: 12px; height: 12px; transform: rotate(45deg);
	background: linear-gradient(135deg, #e6f1ff, #5f9dff 50%, #2b4f9c);
	box-shadow: 0 0 0 1px #000, 0 0 10px rgba(110,170,255,.6);
}
.m2-credit { opacity: .6; font-size: 11px; }
body.m2 .vz-gotop {
	border-radius: 3px; color: var(--vz-gold-light) !important;
	background: linear-gradient(180deg, #1d2f63, #0a1230);
	border: 1px solid #000;
	box-shadow: inset 0 0 0 1px #5f9dff, 0 6px 18px rgba(0,0,0,.6);
}

/* ---------- Responsive del hero ---------- */
@media (max-width: 1100px) {
	.m2-hero-content { width: min(560px, 50vw); right: 3vw; }
}
@media (max-width: 900px) {
	.m2-hero { height: 88vh; min-height: 560px; }
	.m2-hero-scene { background-position: 22% center; }
	.m2-hero-content { left: 50%; right: auto; top: auto; bottom: 9%; transform: translateX(-50%); width: min(520px, 90vw); }
	.m2-hero-shade {
		background:
			linear-gradient(180deg, rgba(3,6,18,.5) 0%, transparent 20%, rgba(3,6,18,.35) 50%, rgba(3,6,18,.85) 80%, var(--vz-black) 100%);
	}
	.m2-sun { right: -10vw; }
	.m2-btn-lg { height: 50px; padding: 0 30px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
	.m2-wind, .m2-dust { display: none; }
}

/* ---------- Descargas PC / Android ---------- */
.m2-cta-dl { margin-top: 12px; animation-delay: 1.35s; }
.m2-dl span b { color: #fff; }
.m2-dl[data-platform="android"] i, .m2-dl-android i.fa-android { color: #8fd16a !important; }
.m2-dl[data-platform="pc"] i { color: #7cc4ff !important; }
.m2-recommended { box-shadow: inset 0 0 0 1px #9cc9ff, inset 0 0 0 2px #0b1534, 0 0 22px rgba(120,180,255,.45), 0 5px 14px rgba(0,0,0,.6) !important; }

body.m2 .vz-dl-card + .vz-dl-card { margin-top: 14px; }
body.m2 .vz-dl-card.m2-dl-android { background: linear-gradient(180deg, #3e5a26, #1f3112); box-shadow: inset 0 0 0 1px #5f9dff, inset 0 0 0 3px #13200a, inset 0 0 0 4px rgba(110,170,255,.35), 0 14px 30px rgba(0,0,0,.6); }
body.m2 .vz-dl-card > i.fa-windows { color: #9fd3ff; text-shadow: 0 0 14px rgba(120,190,255,.6); }
body.m2 .vz-dl-card > i.fa-android { color: #b6f08c; text-shadow: 0 0 14px rgba(150,230,100,.6); }

.m2-dl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 10px 0 18px; }
.m2-dl-big {
	position: relative;
	display: flex; flex-direction: column; align-items: center; text-align: center;
	padding: 30px 20px 26px;
	border: 1px solid #000; border-radius: 3px;
	background: linear-gradient(180deg, rgba(18,32,72,.9), rgba(7,12,30,.95));
	box-shadow: inset 0 0 0 1px #34548f, inset 0 0 0 3px #070d22, inset 0 0 0 4px rgba(110,170,255,.3), 0 12px 28px rgba(0,0,0,.55);
	color: var(--vz-text) !important;
	transition: transform .2s, box-shadow .2s;
}
.m2-dl-big:hover { transform: translateY(-4px); box-shadow: inset 0 0 0 1px #9cc9ff, inset 0 0 0 3px #070d22, inset 0 0 0 4px rgba(110,170,255,.45), 0 0 26px rgba(110,170,255,.25), 0 16px 32px rgba(0,0,0,.6); text-decoration: none; }
.m2-dl-ico {
	width: 84px; height: 84px; margin-bottom: 14px;
	display: flex; align-items: center; justify-content: center;
	font-size: 44px; border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #1d2f63, #050a1c);
	box-shadow: 0 0 0 2px #000, 0 0 0 4px #5f9dff, 0 8px 20px rgba(0,0,0,.6);
}
.m2-dl-big .fa-windows { color: #8fcaff; text-shadow: 0 0 16px rgba(120,190,255,.6); }
.m2-dl-big .fa-android { color: #a8e87c; text-shadow: 0 0 16px rgba(150,230,100,.6); }
.m2-dl-big strong { font-family: var(--vz-display); font-size: 22px; letter-spacing: 2px; color: var(--vz-gold-light); text-shadow: 0 2px 0 #000; }
.m2-dl-big small { display: block; margin: 4px 0 18px; color: var(--vz-muted); font-size: 12px; }
.m2-dl-big .m2-btn { pointer-events: none; }
.m2-dl-soon { margin-top: 10px; font-size: 11px; color: #ff9aa5; font-style: normal; }
.m2-dl-big.m2-recommended::before {
	content: 'Recomendado para ti'; position: absolute; top: -11px; left: 50%; transform: translateX(-50%);
	padding: 3px 12px; font-size: 10px; letter-spacing: 1px; text-transform: uppercase; white-space: nowrap;
	color: #2a1405; background: linear-gradient(180deg, #e6f1ff, #5f9dff); border: 1px solid #000; border-radius: 2px;
}
.m2-dl-note { font-size: 12px; color: var(--vz-muted); margin-bottom: 20px; }
.m2-dl-note i { color: var(--vz-gold); }
.m2-dl-sub { font-family: var(--vz-display); font-size: 15px; letter-spacing: 1.5px; color: var(--vz-gold-light); margin: 10px 0 12px; }
@media (max-width: 600px) {
	.m2-dl-grid { grid-template-columns: 1fr; }
	.m2-cta-dl .m2-btn-lg { padding: 0 22px; font-size: 13px; }
}
/* ajustes */
.m2-dl-grid { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
.m2-dl-big .m2-btn { padding: 0 22px; font-size: 12px; letter-spacing: 1px; white-space: normal; text-align: center; max-width: 100%; }
.m2-cta-dl .m2-btn-lg { height: 48px; padding: 0 30px; font-size: 14px; letter-spacing: 1.5px; }
body.m2 .btn { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
body.m2 .btn-sm, body.m2 .table .btn { height: 34px !important; min-width: 0 !important; padding: 0 16px !important; font-size: 11px; }

/* =========================================================
   METIN2 DREAM — portada nocturna
   ========================================================= */
.dr-hero { background: #030715; }
.dr-hero .m2-hero-scene { background-position: center center; animation: drBreath 24s ease-in-out infinite alternate; }
@keyframes drBreath { from { transform: scale(1.01); } to { transform: scale(1.05); } }
.dr-fx { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 5; pointer-events: none; }
.dr-flash { position: absolute; inset: 0; z-index: 3; pointer-events: none; background: radial-gradient(ellipse 45% 70% at 72% 45%, rgba(110,180,255,.28), transparent 70%); opacity: 0; transition: opacity .25s; mix-blend-mode: screen; }
.dr-flash.on { opacity: 1; transition: opacity .04s; }
.dr-hero .m2-hero-shade {
	background:
		radial-gradient(ellipse 34% 40% at 25% 60%, rgba(2,5,18,.62), rgba(2,5,18,.25) 60%, transparent 78%),
		linear-gradient(180deg, rgba(3,6,18,.55) 0%, transparent 16%, transparent 72%, var(--vz-black) 100%),
		linear-gradient(90deg, rgba(3,6,18,.35) 0%, transparent 40%);
}
.dr-hero .m2-hero-content { left: 4vw; right: auto; top: 58%; transform: translateY(-50%); width: min(640px, 44vw); }

/* logo con brillo */
.dr-logo-layer { position: absolute; inset: 0; width: 100%; height: auto; pointer-events: none; }
.dr-logo-blue { mix-blend-mode: screen; filter: blur(8px) brightness(1.8) saturate(1.4); opacity: 0; animation: drPulse 3.2s ease-in-out 1.5s infinite; }
.dr-logo-gold { mix-blend-mode: screen; filter: blur(7px) brightness(1.5); opacity: 0; animation: drPulse 3.2s ease-in-out 3.1s infinite; }
@keyframes drPulse { 0%, 100% { opacity: .1; } 50% { opacity: .9; } }
.dr-hero .m2-logo-img { filter: drop-shadow(0 0 18px rgba(80,160,255,.45)) drop-shadow(0 14px 26px rgba(0,0,0,.7)); }
.dr-hero .m2-logo-float { animation: drFloat 6.5s ease-in-out 1.5s infinite; }
@keyframes drFloat {
	0%, 100% { transform: translateY(0) rotate(-.6deg); }
	50%      { transform: translateY(-12px) rotate(.6deg); }
}
.dr-hero .m2-logo-shine { animation: m2Shine 6s ease-in-out 2s infinite; background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,.9) 50%, transparent 60%); background-size: 260% 100%; background-repeat: no-repeat; }
.dr-hero .m2-glint.g1 { left: 44%; top: 12%; animation-delay: 2.5s; }
.dr-hero .m2-glint.g2 { left: 57%; top: 84%; animation-delay: 4.6s; }
.dr-hero .m2-glint.g3 { left: 23%; top: 10%; animation-delay: 6.2s; }
.dr-hero .m2-glint { background:
		radial-gradient(circle, #fff 0%, rgba(200,230,255,.9) 9%, rgba(90,160,255,.3) 28%, transparent 55%),
		linear-gradient(90deg, transparent, rgba(220,240,255,.95), transparent) center / 100% 2px no-repeat,
		linear-gradient(0deg, transparent, rgba(220,240,255,.95), transparent) center / 2px 100% no-repeat; }

/* estado */
.dr-hero .m2-status { background: linear-gradient(180deg, rgba(14,26,64,.85), rgba(5,10,28,.9)); color: #e3eeff; box-shadow: inset 0 0 0 1px rgba(110,170,255,.5), 0 0 18px rgba(60,140,255,.25); }

/* botón dorado (Registro) */
.m2-btn-gold {
	color: #2a1405 !important; text-shadow: 0 1px 0 rgba(255,240,200,.6);
	background: linear-gradient(180deg, #fff1c4 0%, #f6c35a 40%, #d98b22 52%, #b8731f 100%);
	box-shadow: inset 0 0 0 1px #fff0c0, inset 0 0 0 2px #8a5a1c, inset 0 2px 0 2px rgba(255,255,255,.3), 0 0 20px rgba(240,180,64,.3), 0 5px 14px rgba(0,0,0,.6);
}
.m2-btn-gold i { color: #2a1405 !important; }
.m2-btn-gold::before, .m2-btn-gold::after { background: linear-gradient(135deg, #fff, #8a5a1c); }
.m2-btn-gold:hover { box-shadow: inset 0 0 0 1px #fff, inset 0 0 0 2px #8a5a1c, 0 0 28px rgba(240,180,64,.55), 0 5px 14px rgba(0,0,0,.6); }

/* toques de cristal azul */
body.m2 .box-sm-v1, body.m2 .center-col .newsfeed {
	background: linear-gradient(180deg, rgba(12,22,54,.94), rgba(5,10,28,.96)) !important;
	backdrop-filter: blur(4px);
}
body.m2 .make-body {
	background:
		radial-gradient(ellipse 70% 35% at 70% 0%, rgba(40,100,230,.22), transparent 70%),
		radial-gradient(ellipse 50% 30% at 10% 30%, rgba(80,60,200,.12), transparent 70%),
		linear-gradient(180deg, var(--vz-black), var(--vz-obsidian) 35%, var(--vz-black)) !important;
}
body.m2 .make-body::before { opacity: .1; mix-blend-mode: screen; filter: blur(3px); }
body.m2 .center-col .heading-main strong, body.m2 .pre-social { filter: drop-shadow(0 0 10px rgba(80,150,255,.45)); }
body.m2 .vz-dl-card > i.fa-windows { color: #cfe6ff; }
body.m2 .inner.rank .p-tbody .lane.pos-1 .order span { background: radial-gradient(circle at 35% 30%, #fff1c4, #f0b440 50%, #8a5a1c); }

/* responsive */
@media (max-width: 1100px) {
	.dr-hero .m2-hero-content { width: min(540px, 48vw); left: 3vw; }
}
@media (max-width: 900px) {
	.dr-hero .m2-hero-scene { background-position: 74% center; }
	.dr-hero .m2-hero-content { left: 50%; right: auto; top: auto; bottom: 7%; transform: translateX(-50%); width: min(520px, 92vw); }
	.dr-hero .m2-hero-shade { background: linear-gradient(180deg, rgba(3,6,18,.5) 0%, transparent 20%, rgba(3,6,18,.3) 45%, rgba(3,6,18,.88) 78%, var(--vz-black) 100%); }
}
body.m2 .vz-dl-card.m2-dl-android { background: linear-gradient(180deg, #1b6c74, #0a2a3a); box-shadow: inset 0 0 0 1px #5f9dff, inset 0 0 0 3px #04141c, inset 0 0 0 4px rgba(110,170,255,.35), 0 14px 30px rgba(0,0,0,.6); }

/* brillo del logo: copia del logo iluminada que se revela con una franja diagonal (sin máscaras por URL) */
.dr-logo-shine {
	filter: brightness(2.4) saturate(.6);
	-webkit-mask-image: linear-gradient(105deg, transparent 42%, #000 50%, transparent 58%);
	mask-image: linear-gradient(105deg, transparent 42%, #000 50%, transparent 58%);
	-webkit-mask-size: 300% 100%; mask-size: 300% 100%;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: 120% 0; mask-position: 120% 0;
	opacity: .85;
	animation: drShine 6s ease-in-out 2s infinite;
}
@keyframes drShine {
	0%        { -webkit-mask-position: 120% 0; mask-position: 120% 0; }
	45%, 100% { -webkit-mask-position: -20% 0; mask-position: -20% 0; }
}

/* sin franja de brillo que recorre el logo: solo queda el brillo de las letras */
.dr-logo-shine, .dr-hero .m2-logo-shine { display: none !important; }