@import url("https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;700&display=swap");
/* L2Aldemar — hoja de estilos base */

@font-face {
	font-family: "Cinzel";
	font-style: normal;
	font-weight: 400;
	src: url("../fonts/cinzel-400.woff2") format("woff2");
	font-display: swap;
}
@font-face {
	font-family: "Cinzel";
	font-style: normal;
	font-weight: 700;
	src: url("../fonts/cinzel-700.woff2") format("woff2");
	font-display: swap;
}
@font-face {
	font-family: "Cinzel";
	font-style: normal;
	font-weight: 900;
	src: url("../fonts/cinzel-900.woff2") format("woff2");
	font-display: swap;
}

:root {
	--bg: #0E1013;
	--bg-alt: #0E1013;
	--bg-card: #171A1F;
	--border: #2E333B;
	--text: #EEF0F2;
	--text-dim: #AAB1BA;
	--gold: #C9A45C;
	--gold-light: #D8B672;
	--violet: #7A828C;
	--violet-light: #C9CED4;
	--font-display: "Cinzel", serif;
	--font-body: "Hanken Grotesk", "Segoe UI", sans-serif;
	--wide: 1440px;
}

* { box-sizing: border-box; }

html, body {
	margin: 0;
	padding: 0;
	background: var(--bg);
	color: var(--text);
	font-family: var(--font-body);
	scroll-behavior: smooth;
}

a { color: var(--gold-light); text-decoration: none; }
a:hover { color: var(--gold); }

h1, h2, h3, .display {
	font-family: var(--font-display);
	letter-spacing: 0.03em;
	color: var(--text);
	margin: 0 0 0.5em;
}

.gold { color: var(--gold); }
.violet-text { color: var(--violet-light); }

.container {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 24px;
}

/* ---------- Header (menu con desplegables) ---------- */
.site-topbar { position: sticky; top: 0; z-index: 50; }
.site-topbar .site-header { position: static; }
.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: rgba(8, 8, 11, 0.9);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--border);
}
.site-header::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: -1px;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(212, 175, 106, 0.55), transparent);
}
.hb-inner {
	display: flex;
	align-items: center;
	gap: 28px;
	max-width: var(--wide);
	margin: 0 auto;
	padding: 0 20px;
	height: 66px;
}
.wordmark {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.25rem;
	letter-spacing: 0.14em;
	white-space: nowrap;
	background: linear-gradient(180deg, #ffffff, #c9c8d6);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent !important;
}
.hb-menu { display: flex; align-items: center; flex: 1; gap: 20px; }
.nav-main { display: flex; align-items: center; height: 66px; }
.nav-item { position: relative; height: 100%; display: flex; align-items: center; }
.nav-link {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0 16px;
	height: 100%;
	color: var(--text-dim);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	background: none;
	border: none;
	cursor: pointer;
	font-family: var(--font-body);
}
.nav-link svg { width: 17px; height: 17px; flex: none; }
.nav-link .caret { width: 10px; height: 10px; opacity: 0.6; }
.nav-item:hover > .nav-link, .nav-item.active > .nav-link { color: var(--gold-light); }
.nav-item.active > .nav-link { box-shadow: inset 0 -2px 0 var(--gold); }
.nav-sep { width: 1px; height: 18px; background: var(--border); }
.drop {
	position: absolute;
	top: 100%;
	left: 6px;
	min-width: 210px;
	padding: 8px;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-top: 2px solid var(--gold);
	border-radius: 0 0 10px 10px;
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}
.nav-item:hover .drop, .nav-item:focus-within .drop { opacity: 1; visibility: visible; transform: none; }
.drop a {
	display: block;
	padding: 9px 12px;
	border-radius: 6px;
	color: var(--text-dim);
	font-size: 0.88rem;
	font-weight: 600;
}
.drop a:hover, .drop a.current { background: rgba(201, 206, 212, 0.12); color: var(--gold-light); }
.hb-right { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.hb-icon {
	width: 38px; height: 38px;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid var(--border);
	border-radius: 8px;
	color: var(--text-dim);
}
.hb-icon:hover { color: #fff; border-color: #5865f2; background: rgba(88, 101, 242, 0.18); }
.hb-icon svg { width: 18px; height: 18px; fill: currentColor; }
.hb-download {
	padding: 10px 20px;
	border-radius: 8px;
	font-size: 0.8rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	background: linear-gradient(135deg, var(--gold-light), var(--gold) 60%, #9a6d2c);
	color: #1a1206 !important;
	box-shadow: 0 0 24px rgba(212, 175, 106, 0.25);
}
.hb-download:hover { filter: brightness(1.08); }
.hb-burger { display: none; margin-left: auto; background: none; border: 1px solid var(--border); border-radius: 8px; width: 42px; height: 40px; cursor: pointer; flex-direction: column; justify-content: center; align-items: center; gap: 5px; }
.hb-burger span { display: block; width: 20px; height: 2px; background: var(--text); border-radius: 2px; }

@media (max-width: 960px) {
	.hb-burger { display: flex; }
	.hb-menu {
		display: none;
		position: absolute;
		top: 66px; left: 0; right: 0;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		background: var(--bg-alt);
		border-bottom: 1px solid var(--border);
		max-height: calc(100vh - 66px);
		overflow-y: auto;
		padding: 8px 16px 18px;
	}
	.hb-menu.open { display: flex; }
	.nav-main { flex-direction: column; align-items: stretch; height: auto; }
	.nav-item { flex-direction: column; align-items: stretch; height: auto; }
	.nav-link { height: 48px; padding: 0 4px; }
	.nav-item.active > .nav-link { box-shadow: none; }
	.nav-sep { display: none; }
	.drop { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: none; background: none; padding: 0 0 8px 28px; min-width: 0; }
	.hb-right { margin: 10px 0 0; }
	.hb-download { flex: 1; text-align: center; }
}

/* ---------- Buttons ---------- */
.btn {
	display: inline-block;
	padding: 12px 28px;
	border-radius: 6px;
	font-weight: 700;
	font-size: 0.95rem;
	cursor: pointer;
	border: none;
	text-align: center;
}
.btn-gold {
	background: linear-gradient(135deg, var(--gold-light), var(--gold) 60%, #9a6d2c);
	color: #1a1206 !important;
}
.btn-gold:hover { filter: brightness(1.08); }
.btn-outline {
	background: transparent;
	border: 1px solid var(--border);
	color: var(--text) !important;
}
.btn-outline:hover { border-color: var(--gold); color: var(--gold) !important; }

/* ---------- Page hero (encabezado de paginas internas) ---------- */
.page-hero {
	position: relative;
	padding: 64px 20px 44px;
	text-align: center;
	overflow: hidden;
	border-bottom: 1px solid var(--border);
}
.page-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url("../img/slides/gw02.jpg") center 35% / cover no-repeat;
	filter: blur(6px) grayscale(0.4) brightness(0.35);
	transform: scale(1.08);
}
.page-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at 50% 0%, rgba(201, 206, 212, 0.22), transparent 65%), linear-gradient(to bottom, transparent 40%, var(--bg));
}
.page-hero > * { position: relative; z-index: 1; }
.page-hero h1 { font-size: clamp(1.8rem, 4.2vw, 2.8rem); margin: 10px 0 8px; }
.page-hero p { color: var(--text-dim); max-width: 620px; margin: 0 auto; }
.eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--font-display);
	font-size: 0.72rem;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--gold);
}
.eyebrow::before, .eyebrow::after { content: ""; width: 26px; height: 1px; background: currentColor; opacity: 0.6; }

/* ---------- Sections / cards ---------- */
section { padding: 70px 0; }
section.alt { background: var(--bg-alt); }
.section-title { text-align: center; margin-bottom: 12px; }
.section-sub { text-align: center; color: var(--text-dim); max-width: 600px; margin: 0 auto 46px; }

.grid {
	display: grid;
	gap: 22px;
}
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.grid-2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }

.card {
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 10px;
	padding: 26px;
}
.card h3 { color: var(--gold); font-size: 1.05rem; }
.card p { color: var(--text-dim); font-size: 0.92rem; line-height: 1.55; }

table.info-table { width: 100%; border-collapse: collapse; }
table.info-table th, table.info-table td {
	text-align: left;
	padding: 10px 12px;
	border-bottom: 1px solid var(--border);
	font-size: 0.92rem;
}
table.info-table th { color: var(--gold); font-weight: 700; }
table.info-table td { color: var(--text-dim); }
table.info-table td.v { color: var(--text); font-weight: 600; }

.tag {
	display: inline-block;
	font-size: 0.72rem;
	padding: 2px 8px;
	border-radius: 4px;
	background: rgba(201, 206, 212, 0.18);
	color: var(--violet-light);
	border: 1px solid rgba(201, 206, 212, 0.4);
	margin-left: 6px;
	vertical-align: middle;
}

/* ---------- Accordion (info page) ---------- */
.accordion { display: flex; flex-direction: column; gap: 10px; }
.acc-item {
	scroll-margin-top: 90px;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 10px;
	overflow: hidden;
	transition: border-color 0.2s ease;
}
.acc-item.open { border-color: var(--gold); }
.acc-header {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 18px 22px;
	background: none;
	border: none;
	cursor: pointer;
	text-align: left;
	font-family: var(--font-display);
	font-size: 1.02rem;
	font-weight: 700;
	color: var(--text);
}
.acc-header .icon { color: var(--text-dim); font-size: 1.3rem; }
.acc-header:hover .icon { color: var(--gold); }
.acc-item.open .acc-header { color: var(--gold); }
.acc-item.open .acc-header .icon { color: var(--gold); transform: rotate(45deg); }
.acc-header .icon { transition: transform 0.2s ease, color 0.2s ease; }
.acc-body {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.32s ease;
}
.acc-body-inner { padding: 0 22px 22px; color: var(--text-dim); font-size: 0.92rem; line-height: 1.65; }
.acc-body-inner ul { margin: 0; padding-left: 20px; }
.acc-body-inner li { margin-bottom: 8px; }
.acc-body-inner li strong { color: var(--text); }
.acc-body-inner .mini-table { width: 100%; border-collapse: collapse; margin-top: 6px; }
.acc-body-inner .mini-table td { padding: 6px 8px; border-bottom: 1px solid var(--border); }
.acc-body-inner .mini-table td:first-child { color: var(--text); font-weight: 600; }
.acc-body-inner .mini-table td:last-child { color: var(--gold); text-align: right; }
.acc-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 30px;
}
.acc-nav button, .acc-nav .sub-tab {
	background: var(--bg-card);
	border: 1px solid var(--border);
	color: var(--text-dim);
	padding: 7px 14px;
	border-radius: 20px;
	font-size: 0.8rem;
	font-weight: 600;
	cursor: pointer;
}
.acc-nav button:hover { color: var(--gold); border-color: var(--gold); }
.acc-nav button.active { color: #1a1206; background: var(--gold); border-color: var(--gold); }

/* ---------- Roadmap (Pre-Beta / Beta / Apertura) ---------- */
.roadmap {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
	max-width: 900px;
	margin: 0 auto;
	position: relative;
}
.roadmap::before {
	content: "";
	position: absolute;
	top: 53px;
	left: calc(16.66% + 10px);
	right: calc(16.66% + 10px);
	height: 2px;
	background: linear-gradient(90deg, var(--gold), var(--border) 50%, var(--border));
	z-index: 0;
}
.road-step { position: relative; z-index: 1; text-align: center; padding: 0 12px; }
.road-dot {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	margin: 0 auto 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-display);
	font-weight: 700;
	border: 2px solid var(--border);
	background: var(--bg-card);
	color: var(--text-dim);
}
.road-step.active .road-dot {
	border-color: var(--gold);
	background: linear-gradient(135deg, var(--gold-light), var(--gold));
	color: #1a1206;
	box-shadow: 0 0 22px rgba(212, 175, 106, 0.45);
}
.road-step h4 { font-size: 0.95rem; margin-bottom: 6px; color: var(--text); }
.road-step.active h4 { color: var(--gold); }
.road-step p { font-size: 0.82rem; color: var(--text-dim); margin: 0; }
.road-badge {
	display: inline-block;
	font-size: 0.68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 3px 10px;
	border-radius: 12px;
	margin-bottom: 10px;
	background: rgba(212, 175, 106, 0.15);
	color: var(--gold);
	border: 1px solid rgba(212, 175, 106, 0.4);
}
.road-step:not(.active) .road-badge { background: rgba(168, 163, 184, 0.1); color: var(--text-dim); border-color: var(--border); }

@media (max-width: 700px) {
	.roadmap { grid-template-columns: 1fr; gap: 28px; }
	.roadmap::before { display: none; }
}

/* ---------- Discord CTA ---------- */
.discord-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	background: linear-gradient(135deg, rgba(88, 101, 242, 0.14), rgba(201, 206, 212, 0.1));
	border: 1px solid rgba(88, 101, 242, 0.35);
	border-radius: 14px;
	padding: 32px 36px;
}
.discord-cta .btn-discord {
	background: #5865f2;
	color: #fff !important;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 26px;
	border-radius: 8px;
	font-weight: 700;
	white-space: nowrap;
}
.discord-cta .btn-discord:hover { filter: brightness(1.1); }
.discord-cta svg { width: 22px; height: 22px; fill: #fff; }

/* ---------- Footer (4 columnas) ---------- */
.site-footer {
	margin-top: 60px;
	border-top: 1px solid var(--border);
	background: linear-gradient(to bottom, var(--bg-alt), var(--bg));
	color: var(--text-dim);
	font-size: 0.88rem;
}
.ft-inner {
	max-width: var(--wide);
	margin: 0 auto;
	padding: 48px 20px 30px;
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr;
	gap: 36px;
}
.ft-brand p { line-height: 1.6; max-width: 320px; margin: 12px 0 0; }
.ft-head {
	font-family: var(--font-display);
	color: var(--gold);
	font-size: 0.78rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	margin-bottom: 14px;
}
.ft-col a { display: block; color: var(--text-dim); padding: 4px 0; }
.ft-col a:hover { color: var(--gold-light); }
.ft-bottom {
	border-top: 1px solid var(--border);
	text-align: center;
	padding: 18px 20px;
	font-size: 0.8rem;
}
@media (max-width: 760px) {
	.ft-inner { grid-template-columns: 1fr 1fr; }
	.ft-brand { grid-column: 1 / -1; }
}

/* ---------- Discord FAB ---------- */
.discord-fab {
	position: fixed;
	bottom: 24px;
	right: 24px;
	z-index: 60;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #5865f2;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 20px rgba(88, 101, 242, 0.5);
	transition: transform 0.2s ease;
}
.discord-fab:hover { transform: scale(1.08); }
.discord-fab svg { width: 28px; height: 28px; fill: #fff; }

/* ---------- Forms ---------- */
.form-box {
	max-width: 420px;
	margin: 0 auto;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 36px;
}
.form-box label { display: block; font-size: 0.85rem; color: var(--text-dim); margin: 16px 0 6px; }
.form-box input {
	width: 100%;
	padding: 11px 14px;
	background: var(--bg);
	border: 1px solid var(--border);
	border-radius: 6px;
	color: var(--text);
	font-size: 0.95rem;
}
.form-box input:focus { outline: none; border-color: var(--violet); }
.form-box .btn { width: 100%; margin-top: 22px; }
.form-note { text-align: center; font-size: 0.85rem; color: var(--text-dim); margin-top: 18px; }

/* ---------- Panel (account) ---------- */
.panel-layout { display: grid; grid-template-columns: 220px 1fr; gap: 0; min-height: 70vh; }
.panel-sidebar {
	background: var(--bg-alt);
	border-right: 1px solid var(--border);
	padding: 28px 0;
}
.panel-sidebar a {
	display: block;
	padding: 12px 26px;
	color: var(--text-dim);
	font-weight: 600;
	font-size: 0.92rem;
}
.panel-sidebar a:hover, .panel-sidebar a.active { color: var(--gold); background: rgba(201, 206, 212, 0.08); border-left: 3px solid var(--gold); padding-left: 23px; }
.panel-main { padding: 36px; }
.panel-view { display: none; }
.panel-view.active { display: block; }

@media (max-width: 780px) {
	.panel-layout { grid-template-columns: 1fr; }
	.panel-sidebar { display: flex; overflow-x: auto; border-right: none; border-bottom: 1px solid var(--border); padding: 10px 12px; }
	.panel-sidebar a { padding: 8px 14px; white-space: nowrap; }
	.panel-sidebar a.active { border-left: none; border-bottom: 2px solid var(--gold); padding-left: 14px; }
}

/* ---------- Fondo de particulas ---------- */
#embers { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: -1; }
body { position: relative; z-index: 0; }

/* ---------- Slider (home) ---------- */
.slider-wrap { max-width: var(--wide); margin: 24px auto 0; padding: 0 20px; }
.slider {
	position: relative;
	height: 400px;
	border-radius: 14px;
	overflow: hidden;
	border: 1px solid var(--border);
	background: var(--bg-card);
}
.slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.8s ease, visibility 0.8s;
}
.slide.active { opacity: 1; visibility: visible; }
.slide-media {
	position: absolute;
	inset: -20px;
	background-size: cover;
	background-position: center 30%;
	filter: blur(3px) grayscale(0.35) brightness(0.5);
	transform: scale(1.04);
	transition: transform 7s ease;
}
.slide.active .slide-media { transform: scale(1.12); }
.slide::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(8, 8, 11, 0.92) 0%, rgba(8, 8, 11, 0.55) 45%, rgba(8, 8, 11, 0.1) 100%);
}
.slide-panel {
	position: absolute;
	z-index: 2;
	left: 56px;
	top: 50%;
	transform: translateY(-50%);
	max-width: 480px;
}
.slide-tag {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--gold);
	border: 1px solid rgba(212, 175, 106, 0.5);
	padding: 5px 12px;
	border-radius: 3px;
}
.slide-title {
	font-size: clamp(1.9rem, 4.5vw, 3rem);
	margin: 16px 0 8px;
	background: linear-gradient(180deg, #ffffff, #c9c8d6);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.slide-sub { color: #cfcbe0; font-size: 1.02rem; line-height: 1.55; margin: 0 0 24px; }
.slider-dots {
	position: absolute;
	z-index: 3;
	bottom: 22px;
	left: 56px;
	display: flex;
	gap: 8px;
}
.slider-dots button {
	width: 28px; height: 4px;
	border: none;
	border-radius: 2px;
	background: rgba(255, 255, 255, 0.25);
	cursor: pointer;
	padding: 0;
	transition: background 0.2s, width 0.2s;
}
.slider-dots button.active { background: var(--gold); width: 44px; }
.slider-arrow {
	position: absolute;
	z-index: 3;
	bottom: 14px;
	width: 40px; height: 40px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: rgba(8, 8, 11, 0.5);
	color: #fff;
	font-size: 1.1rem;
	cursor: pointer;
}
.slider-arrow:hover { border-color: var(--gold); color: var(--gold); }
.slider-arrow.prev { right: 68px; }
.slider-arrow.next { right: 20px; }
@media (max-width: 700px) {
	.slider { height: 380px; }
	.slide-panel { left: 22px; right: 22px; top: 42%; }
	.slider-dots { left: 22px; }
	.slide::after { background: linear-gradient(0deg, rgba(8, 8, 11, 0.95) 10%, rgba(8, 8, 11, 0.5)); }
}

/* ---------- Layouts de columnas ---------- */
.layout-3 {
	max-width: var(--wide);
	margin: 24px auto 0;
	padding: 0 20px;
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr) 260px;
	gap: 22px;
	align-items: start;
}
.layout-2 {
	max-width: var(--wide);
	margin: 30px auto 0;
	padding: 0 20px;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 280px;
	gap: 22px;
	align-items: start;
}
.aside { display: flex; flex-direction: column; gap: 18px; }
.main-col { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
@media (max-width: 1100px) {
	.layout-3 { grid-template-columns: minmax(0, 1fr) 280px; }
	.layout-3 .main-col { grid-column: 1; grid-row: 1 / span 2; }
	.layout-3 .aside-left { grid-column: 2; grid-row: 1; }
	.layout-3 .aside-right { grid-column: 2; grid-row: 2; }
}
@media (max-width: 820px) {
	.layout-3, .layout-2 { grid-template-columns: 1fr; }
	.layout-3 .aside-left, .layout-3 .aside-right, .layout-3 .main-col { grid-column: auto; grid-row: auto; }
	.layout-3 .main-col { order: -1; }
}

/* ---------- Boxes laterales ---------- */
.box {
	background: linear-gradient(180deg, rgba(20, 16, 34, 0.92), rgba(14, 11, 26, 0.92));
	border: 1px solid var(--border);
	border-radius: 12px;
	overflow: hidden;
}
.box-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 13px 16px;
	border-bottom: 1px solid var(--border);
	background: linear-gradient(90deg, rgba(212, 175, 106, 0.1), transparent);
	font-family: var(--font-display);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--gold);
}
.box-title a { font-family: var(--font-body); font-size: 0.72rem; letter-spacing: 0.04em; text-transform: none; color: var(--text-dim); }
.box-title a:hover { color: var(--gold-light); }
.box-body { padding: 16px; }
.box-body p { color: var(--text-dim); font-size: 0.86rem; line-height: 1.55; margin: 0 0 14px; }

.mini-login input {
	width: 100%;
	padding: 10px 12px;
	margin-bottom: 10px;
	background: var(--bg);
	border: 1px solid var(--border);
	border-radius: 6px;
	color: var(--text);
	font-size: 0.9rem;
	font-family: var(--font-body);
}
.mini-login input:focus { outline: none; border-color: var(--violet); }
.mini-login .btn { width: 100%; padding: 10px; }
.mini-login .links { display: flex; justify-content: space-between; margin-top: 12px; font-size: 0.8rem; }
.mini-login .links a { color: var(--text-dim); }
.mini-login .links a:hover { color: var(--gold-light); }

.quick-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.quick-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 16px 8px;
	border-radius: 12px;
	border: 1px solid var(--border);
	background: linear-gradient(180deg, rgba(201, 206, 212, 0.14), rgba(14, 11, 26, 0.9));
	color: var(--text) !important;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-align: center;
}
.quick-btn svg { width: 26px; height: 26px; color: var(--gold); }
.quick-btn:hover { border-color: var(--gold); }

.rank-list { list-style: none; margin: 0; padding: 0; }
.rank-list li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 0;
	border-bottom: 1px dashed var(--border);
	font-size: 0.86rem;
	color: var(--text-dim);
}
.rank-list li:last-child { border-bottom: none; }
.rank-pos {
	width: 22px; height: 22px;
	flex: none;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-size: 0.7rem;
	font-weight: 800;
	background: var(--bg);
	border: 1px solid var(--border);
	color: var(--text-dim);
}
.rank-list li:nth-child(1) .rank-pos { border-color: var(--gold); color: var(--gold); }
.rank-list .val { margin-left: auto; font-size: 0.78rem; }
.rank-empty { font-size: 0.78rem; color: var(--text-dim); text-align: center; margin: 10px 0 0; font-style: italic; }

.status-list div {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	padding: 9px 0;
	border-bottom: 1px dashed var(--border);
	font-size: 0.86rem;
	color: var(--text-dim);
}
.status-list div:last-child { border-bottom: none; }
.status-list b { color: var(--text); font-weight: 700; text-align: right; }
.st-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; background: var(--gold); box-shadow: 0 0 10px var(--gold); animation: pulse 2s infinite; }
@keyframes pulse { 50% { opacity: 0.35; } }

.cta-card { text-align: center; }
.cta-card .cta-icon {
	width: 52px; height: 52px;
	margin: 2px auto 12px;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: rgba(212, 175, 106, 0.12);
	border: 1px solid rgba(212, 175, 106, 0.4);
	color: var(--gold);
}
.cta-card .cta-icon svg { width: 24px; height: 24px; }
.cta-card .btn { width: 100%; padding: 10px; font-size: 0.8rem; letter-spacing: 0.1em; }
.btn-discord-sm { background: #5865f2; color: #fff !important; }
.btn-discord-sm:hover { filter: brightness(1.1); }

.vote-list div {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	margin-bottom: 8px;
	border: 1px dashed var(--border);
	border-radius: 8px;
	color: var(--text-dim);
	font-size: 0.84rem;
}
.vote-list div:last-child { margin-bottom: 0; }
.vote-list span { margin-left: auto; font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--violet-light); }

.vote-banners { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; gap: 14px; }
.vote-banner-hopzone, .vote-banner-l2votes {
	width: 150px; height: 110px; flex-shrink: 0;
	display: flex; align-items: center; justify-content: center;
	border-radius: 10px; text-decoration: none;
	transition: border-color 0.2s, box-shadow 0.2s;
}
.vote-banner-hopzone { overflow: hidden; border: 1px solid var(--border); background: #000; }
.vote-banner-hopzone:hover { border-color: var(--gold); box-shadow: 0 0 14px rgba(212, 175, 106, 0.2); }
.vote-banner-hopzone img { display: block; width: 100%; height: 100%; object-fit: contain; }
.vote-banner-l2votes {
	flex-direction: column; gap: 10px; padding: 12px;
	background: #111; border: 1px solid rgba(255, 198, 64, 0.3);
}
.vote-banner-l2votes:hover { border-color: #ffc640; box-shadow: 0 0 18px rgba(255, 198, 64, 0.15); }
.vote-banner-l2votes img { display: block; }
.l2votes-text { display: flex; flex-direction: column; align-items: center; gap: 1px; }
.l2votes-title { font-family: var(--font-display); font-weight: 900; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; color: #ffc640; line-height: 1.2; }
.l2votes-sub { font-weight: 700; font-size: 0.56rem; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(255, 255, 255, 0.4); line-height: 1.2; }

/* ---------- Cuenta regresiva de apertura ---------- */
.countdown-block { text-align: center; position: relative; overflow: hidden; }
.countdown-block::before {
	content: ""; position: absolute; left: 50%; top: -40%; width: 480px; height: 280px;
	transform: translateX(-50%);
	background: radial-gradient(ellipse at center, rgba(230, 196, 130, 0.16), transparent 70%);
	mix-blend-mode: screen; pointer-events: none;
}
.countdown-block > * { position: relative; z-index: 1; }
.countdown-date {
	font-family: var(--font-display); font-weight: 700; font-size: clamp(1.3rem, 2.6vw, 1.8rem);
	letter-spacing: 0.04em; margin: 14px 0 22px;
	background: linear-gradient(180deg, #ffffff 0%, #f4ecd8 45%, #cbb98c 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.countdown-timer { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; }
.countdown-unit { display: flex; flex-direction: column; align-items: center; min-width: 58px; }
.countdown-num {
	font-family: var(--font-display); font-weight: 700; font-size: clamp(1.8rem, 4vw, 2.6rem);
	color: var(--gold-light); line-height: 1; font-variant-numeric: tabular-nums;
	text-shadow: 0 0 24px rgba(230, 196, 130, 0.3);
}
.countdown-label { font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--text-dim); margin-top: 6px; }
.countdown-sep { font-family: var(--font-display); font-size: 1.8rem; color: var(--border); margin-top: -18px; }
.countdown-note { color: var(--text-dim); font-size: 0.8rem; margin-top: 22px; max-width: 480px; margin-left: auto; margin-right: auto; }
.countdown-timer.countdown-live .countdown-num { color: var(--gold); }

/* ---------- Bloques del centro ---------- */
.panel-block {
	background: linear-gradient(180deg, rgba(20, 16, 34, 0.85), rgba(14, 11, 26, 0.85));
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 26px;
}
.block-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 18px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--border);
}
.block-head h2 { font-size: 1.2rem; margin: 0; }
.block-head a { font-size: 0.8rem; color: var(--text-dim); white-space: nowrap; }
.block-head a:hover { color: var(--gold-light); }
.panel-block > p { color: var(--text-dim); line-height: 1.65; font-size: 0.93rem; }

.welcome { text-align: center; padding: 34px 26px; }
.welcome h1 { font-size: clamp(1.6rem, 3.4vw, 2.2rem); margin: 12px 0; }
.welcome p { color: var(--text-dim); max-width: 560px; margin: 0 auto 22px; line-height: 1.6; }
.btn-big { padding: 15px 38px; font-size: 0.86rem; letter-spacing: 0.14em; text-transform: uppercase; }

.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
.feature {
	padding: 18px;
	border: 1px solid var(--border);
	border-radius: 10px;
	background: rgba(8, 8, 11, 0.4);
}
.feature h3 { font-size: 0.95rem; color: var(--gold); margin-bottom: 6px; }
.feature p { margin: 0; color: var(--text-dim); font-size: 0.86rem; line-height: 1.55; }

/* ---------- Noticias ---------- */
.news-featured {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	border: 1px solid var(--border);
	border-radius: 10px;
	overflow: hidden;
	background: rgba(8, 8, 11, 0.45);
	color: var(--text) !important;
	margin-bottom: 14px;
}
.news-featured:hover, .news-card:hover { border-color: rgba(212, 175, 106, 0.6); }
.news-img {
	position: relative;
	min-height: 190px;
	overflow: hidden;
}
.news-img i {
	content: "";
	position: absolute;
	inset: -10px;
	background-position: center 30%;
	background-size: cover;
	filter: blur(2px) grayscale(0.4) brightness(0.5);
}
.news-img span {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 10px;
	font-family: var(--font-display);
	font-size: 1.3rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: #fff;
	text-shadow: 0 2px 18px rgba(0, 0, 0, 0.8);
}
.news-body { padding: 20px; display: flex; flex-direction: column; }
.news-title { font-family: var(--font-display); font-weight: 700; font-size: 1rem; margin-bottom: 8px; }
.news-text { color: var(--text-dim); font-size: 0.86rem; line-height: 1.55; flex: 1; }
.news-meta { display: flex; justify-content: space-between; margin-top: 14px; font-size: 0.76rem; color: var(--text-dim); }
.news-meta .more { color: var(--gold); }
.news-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.news-card {
	border: 1px solid var(--border);
	border-radius: 10px;
	overflow: hidden;
	background: rgba(8, 8, 11, 0.45);
	color: var(--text) !important;
	display: flex;
	flex-direction: column;
}
.news-card .news-img { min-height: 100px; }
.news-card .news-img span { font-size: 1rem; }
.news-card .news-body { padding: 16px; flex: 1; }
@media (max-width: 640px) {
	.news-featured, .news-grid { grid-template-columns: 1fr; }
}

/* Changelog */
.changelog-entry { position: relative; padding: 0 0 28px 26px; margin-left: 6px; border-left: 1px solid var(--border); scroll-margin-top: 90px; }
.changelog-entry::before {
	content: "";
	position: absolute;
	left: -7px; top: 3px;
	width: 11px; height: 11px;
	border-radius: 50%;
	background: var(--bg);
	border: 2px solid var(--gold);
}
.changelog-entry:last-child { padding-bottom: 0; }
.changelog-date { font-size: 0.72rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); }
.changelog-entry h3 { font-size: 1.05rem; margin: 6px 0 8px; }
.changelog-entry p, .changelog-entry li { color: var(--text-dim); font-size: 0.9rem; line-height: 1.6; }
.changelog-entry p { margin: 0 0 8px; }
.changelog-entry ul { margin: 0; padding-left: 18px; }

/* Social card */
.social-card {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	padding: 22px;
	border-radius: 12px;
	border: 1px solid rgba(88, 101, 242, 0.4);
	background: linear-gradient(135deg, rgba(88, 101, 242, 0.16), rgba(201, 206, 212, 0.08));
}
.social-card .logo {
	width: 54px; height: 54px;
	border-radius: 14px;
	background: #5865f2;
	display: flex; align-items: center; justify-content: center;
	flex: none;
}
.social-card .logo svg { width: 30px; height: 30px; fill: #fff; }
.social-card .info { flex: 1; min-width: 180px; }
.social-card .name { font-family: var(--font-display); font-weight: 700; font-size: 1.05rem; }
.social-card .meta { color: var(--text-dim); font-size: 0.86rem; margin-top: 2px; }
.social-card .btn { background: #5865f2; color: #fff !important; }

/* ---------- Tablas de datos (rankings, bosses, castillos) ---------- */
.data-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.data-table th {
	text-align: left;
	font-size: 0.7rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--gold);
	padding: 10px 12px;
	border-bottom: 1px solid rgba(212, 175, 106, 0.5);
	white-space: nowrap;
}
.data-table td { padding: 12px; border-bottom: 1px solid var(--border); color: var(--text-dim); }
.data-table td:first-child { color: var(--text); font-weight: 700; }
.data-table tbody tr:hover td { background: rgba(201, 206, 212, 0.06); }
.data-table .empty td { text-align: center; font-style: italic; padding: 34px 12px; font-weight: 400; color: var(--text-dim); }
.table-scroll { overflow-x: auto; }
.pill {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 12px;
	font-size: 0.72rem;
	font-weight: 700;
	border: 1px solid var(--border);
	color: var(--text-dim);
	white-space: nowrap;
}
.pill.gold { border-color: rgba(212, 175, 106, 0.5); color: var(--gold); background: rgba(212, 175, 106, 0.08); }
.pill.violet { border-color: rgba(201, 206, 212, 0.5); color: var(--violet-light); background: rgba(201, 206, 212, 0.1); }

.tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.tabs button {
	background: var(--bg-card);
	border: 1px solid var(--border);
	color: var(--text-dim);
	padding: 8px 16px;
	border-radius: 20px;
	font-size: 0.82rem;
	font-weight: 700;
	cursor: pointer;
	font-family: var(--font-body);
}
.tabs button:hover { color: var(--gold); border-color: var(--gold); }
.tabs button.active { color: #1a1206; background: var(--gold); border-color: var(--gold); }
.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* ---------- Reglas / notas / precios ---------- */
.rule-list { counter-reset: rule; list-style: none; margin: 0; padding: 0; }
.rule-list li {
	counter-increment: rule;
	position: relative;
	padding: 12px 0 12px 44px;
	border-bottom: 1px dashed var(--border);
	color: var(--text-dim);
	font-size: 0.92rem;
	line-height: 1.6;
}
.rule-list li:last-child { border-bottom: none; }
.rule-list li::before {
	content: counter(rule);
	position: absolute;
	left: 0; top: 12px;
	width: 28px; height: 28px;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-size: 0.78rem;
	font-weight: 800;
	color: var(--gold);
	border: 1px solid rgba(212, 175, 106, 0.45);
}
.rule-list strong { color: var(--text); }
.note {
	border-left: 3px solid var(--gold);
	background: rgba(212, 175, 106, 0.07);
	padding: 14px 18px;
	border-radius: 0 8px 8px 0;
	color: var(--text-dim);
	font-size: 0.9rem;
	line-height: 1.6;
}
.note strong { color: var(--text); }
.price-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.price {
	text-align: center;
	padding: 22px 16px;
	border: 1px solid var(--border);
	border-radius: 10px;
	background: rgba(8, 8, 11, 0.45);
}
.price .method { font-size: 0.72rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-dim); }
.price .amount { font-family: var(--font-display); font-size: 1.5rem; color: var(--gold); margin: 10px 0 4px; }
.price .per { font-size: 0.8rem; color: var(--text-dim); }
.check-list { list-style: none; margin: 0; padding: 0; }
.check-list li { position: relative; padding: 7px 0 7px 26px; color: var(--text-dim); font-size: 0.92rem; line-height: 1.55; }
.check-list li::before { content: "\25C6"; position: absolute; left: 2px; top: 7px; color: var(--gold); font-size: 0.75rem; }
.check-list.no li::before { content: "\2715"; color: #d86a6a; }
.check-list strong { color: var(--text); }

.page-hero + section { padding-top: 40px; }
.salir-link { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.1em; color: var(--text-dim); padding: 10px 6px; }
.salir-link:hover { color: var(--gold-light); }

/* ---------- Informacion: tarjetas de rates + filas con iconos del juego ---------- */
.info-group-label {
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--gold);
	margin: 30px 0 12px;
	scroll-margin-top: 90px;
}
.info-block > .info-group-label:first-child { margin-top: 0; }
.rate-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 640px) { .rate-grid { grid-template-columns: repeat(2, 1fr); } }

.rate-card {
	text-align: center;
	padding: 16px 10px 14px;
	border: 1px solid var(--border);
	border-radius: 10px;
	background: linear-gradient(180deg, rgba(201, 206, 212, 0.08), rgba(8, 8, 11, 0.5));
	transition: border-color 0.2s, transform 0.2s;
}
.rate-card:hover { border-color: rgba(212, 175, 106, 0.6); transform: translateY(-2px); }
.rate-card img, .feat-row img, .acc-title img, .info-table-ico img, .buff img {
	width: 32px;
	height: 32px;
	border-radius: 4px;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.6), 0 0 0 2px rgba(212, 175, 106, 0.25);
	flex: none;
}
.rate-card img { display: block; margin: 0 auto 10px; }
.rc-label { font-size: 0.68rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-dim); }
.rc-val { white-space: nowrap; font-family: var(--font-body); font-size: clamp(1.15rem, 2.1vw, 1.6rem); font-weight: 800; color: var(--gold-light); margin-top: 4px; }
.rc-val small { font-size: 0.9rem; color: var(--gold); }
.rc-sub { font-size: 0.72rem; color: var(--text-dim); margin-top: 2px; }
.rate-grid.mini .rc-val { font-size: 1.2rem; }

.info-acc .acc-header { padding: 14px 18px; }
.acc-title { display: flex; align-items: center; gap: 12px; }
.acc-title img { width: 28px; height: 28px; }
.feat-list { display: flex; flex-direction: column; }
.feat-row {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px 0;
	border-bottom: 1px dashed var(--border);
	color: var(--text-dim);
	font-size: 0.92rem;
	line-height: 1.5;
}
.feat-row:last-of-type { border-bottom: none; }
.feat-row strong { color: var(--text); }

.info-table-ico { width: 100%; border-collapse: collapse; }
.info-table-ico td { padding: 8px 6px; border-bottom: 1px dashed var(--border); font-size: 0.92rem; }
.info-table-ico td:first-child { display: flex; align-items: center; gap: 12px; color: var(--text); font-weight: 700; }
.info-table-ico td:last-child { text-align: right; color: var(--gold); font-weight: 700; white-space: nowrap; }
.info-table-ico tr:last-child td { border-bottom: none; }

.buff-line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 0; border-bottom: 1px dashed var(--border); }
.buff-line:last-child { border-bottom: none; }
.buff-who { width: 100%; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); }
.buff {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 4px 10px 4px 4px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: rgba(8, 8, 11, 0.5);
	font-size: 0.82rem;
	color: var(--text);
}
.buff img { width: 24px; height: 24px; }

/* Opciones lado a lado (ej. "Como se consigue" del Premium) */
.option-head { margin: 18px 0 10px; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); }
.option-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 640px) { .option-grid { grid-template-columns: 1fr; } }
.option { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--border); border-radius: 10px; background: rgba(8, 8, 11, 0.45); }
.option img { width: 32px; height: 32px; border-radius: 4px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.6), 0 0 0 2px rgba(212, 175, 106, 0.25); flex: none; }
.option-title { font-weight: 800; color: var(--text); font-size: 0.9rem; margin-bottom: 4px; }
.option-text { color: var(--text-dim); font-size: 0.86rem; line-height: 1.5; }
.option-text strong { color: var(--gold-light); }

/* Tabla de datos genérica, varias columnas (Clan, Soul Crystal, etc.) */
.data-table { width: 100%; border-collapse: collapse; font-size: 0.86rem; }
.data-table th {
	text-align: left;
	padding: 8px 10px;
	font-size: 0.68rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--text-dim);
	border-bottom: 1px solid var(--border);
	white-space: nowrap;
}
.data-table td { padding: 9px 10px; border-bottom: 1px dashed var(--border); color: var(--text-dim); vertical-align: top; }
.data-table tr:last-child td { border-bottom: none; }
.data-table td:first-child, .data-table th:first-child { color: var(--text); font-weight: 700; }
.data-table .gold-cell { color: var(--gold); font-weight: 700; white-space: nowrap; }
.data-table-wrap { overflow-x: auto; }
.table-note { margin: 12px 0 0; font-size: 0.82rem; color: var(--text-dim); line-height: 1.5; }

/* ---------- Registro / ingreso ---------- */
.field-hint { font-size: 0.76rem; color: var(--text-dim); margin: 6px 0 0; }
.optional { color: var(--text-dim); font-weight: 400; }
.form-error { margin: 16px 0 0; padding: 10px 12px; border-radius: 6px; border: 1px solid rgba(216, 106, 106, 0.5); background: rgba(216, 106, 106, 0.1); color: #f0a3a3; font-size: 0.86rem; }
.verify-note {
	margin-top: 22px;
	padding: 14px 16px;
	border-left: 3px solid var(--gold);
	border-radius: 0 8px 8px 0;
	background: rgba(212, 175, 106, 0.08);
	color: var(--text-dim);
	font-size: 0.85rem;
	line-height: 1.6;
}
.verify-note strong { color: var(--text); }
.form-done { text-align: center; padding: 10px 0; }
.form-done .done-icon { font-size: 2.2rem; color: var(--gold); }
.form-done h3 { margin: 8px 0; color: var(--gold); }
.form-done p { color: var(--text-dim); font-size: 0.9rem; line-height: 1.6; margin: 0; }
.mini-login .hint { font-size: 0.74rem; color: var(--text-dim); margin: 10px 0 0; line-height: 1.5; }

[hidden] { display: none !important; }
.closed-box { text-align: center; }
.closed-box .done-icon { font-size: 2rem; color: var(--gold); }
.closed-box h3 { color: var(--gold); margin: 8px 0 10px; }
.closed-box p { color: var(--text-dim); font-size: 0.92rem; line-height: 1.6; margin: 0 0 18px; }
.closed-box .btn { width: 100%; }
.mini-closed p { font-size: 0.84rem; margin-bottom: 14px; }

/* Banner con la foto espejada (personaje a la derecha, lejos del texto) */
.slide-media.flip { transform: scaleX(-1) scale(1.04); }
.slide.active .slide-media.flip { transform: scaleX(-1) scale(1.12); }

/* Cuentas (2026-10-12): captcha invisible y mensajes de exito */
.captcha-box { margin: 16px 0 0; }
.captcha-box:empty { margin: 0; }
.form-ok { margin: 16px 0 0; padding: 10px 12px; border-radius: 6px; border: 1px solid rgba(212, 175, 106, 0.5); background: rgba(212, 175, 106, 0.08); color: var(--gold-2, #f3d58e); font-size: 0.86rem; }
.form-box button[disabled] { opacity: 0.6; cursor: wait; }

/* Panel de usuario con datos reales (2026-10-12) */
.panel-main .card input[type=number],
.panel-main select,
.form-box select { width: 100%; padding: 12px 14px; margin-top: 6px; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font: inherit; }
.panel-main select:focus, .panel-main .card input[type=number]:focus { outline: none; border-color: var(--violet); }
.table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-wrap .info-table { min-width: 520px; }
.info-table td.empty { text-align: center; color: var(--text-dim); padding: 22px 10px; }
.info-table td.gold { color: var(--gold); font-weight: 700; }
.ref-code { background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 10px 16px; font-size: 1.1rem; color: var(--gold); font-weight: 700; letter-spacing: 2px; }
.btn.btn-sm { padding: 6px 14px; font-size: 0.8rem; }
.sub-panel[hidden] { display: none; }

/* Votos: progreso hacia el premio general (2026-10-12) */
.vote-progress { margin: 12px 0 14px; }
.vote-bar { height: 10px; background: var(--bg); border: 1px solid var(--border); border-radius: 999px; overflow: hidden; }
.vote-bar span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--violet), var(--gold)); transition: width 0.6s ease; }

/* Donaciones (2026-10-13) */
.copy-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ref-code.addr { font-size: 0.85rem; letter-spacing: 0; word-break: break-all; }
.usdt-rules { margin: 16px 0 0; padding-left: 18px; color: var(--text-dim); font-size: 0.86rem; line-height: 1.6; }
.usdt-rules strong { color: var(--text); }

/* Marketplace (2026-10-13) */
.mk-filters { display: flex; gap: 10px; flex-wrap: wrap; }
.mk-filters input, .mk-filters select { flex: 1 1 220px; padding: 11px 14px; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font: inherit; }
.mk-filters input:focus, .mk-filters select:focus { outline: none; border-color: var(--violet); }
#mkVitrina td.v a { color: var(--text); text-decoration: none; }
#mkVitrina td.v a:hover { color: var(--gold); }
.tfa-qr { background: #fff; padding: 10px; border-radius: 8px; display: inline-block; margin: 6px 0 10px; }

/* Panel de admin (2026-10-13) */
.adm-status { display: flex; gap: 10px; flex-wrap: wrap; margin: 10px 0 18px; }
.adm-pill { padding: 6px 12px; border-radius: 999px; font-size: 0.8rem; font-weight: 700; }
.adm-pill.ok { background: rgba(34, 204, 85, 0.12); color: #6be38f; border: 1px solid rgba(34, 204, 85, 0.4); }
.adm-pill.bad { background: rgba(216, 106, 106, 0.14); color: #f0a3a3; border: 1px solid rgba(216, 106, 106, 0.5); }
.adm-panic { display: flex; gap: 18px; align-items: center; justify-content: space-between; flex-wrap: wrap; border-color: rgba(216, 106, 106, 0.5); }
.btn.adm-btn-red { background: #c0392b; color: #fff; border: 0; font-weight: 800; padding: 14px 26px; }
.btn.adm-btn-red:hover { background: #e74c3c; }
.card.adm-warn { border-color: rgba(240, 180, 60, 0.7); box-shadow: 0 0 0 1px rgba(240, 180, 60, 0.25) inset; }
#admMain input { width: 100%; padding: 10px 12px; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font: inherit; }
.tfa-secret { display: block; width: 100%; box-sizing: border-box; margin: 0 0 14px; padding: 10px 12px; font-size: 0.9rem; letter-spacing: 1px; word-break: break-all; text-align: center; }
#tfaBox label { display: block; margin-top: 4px; }

/* Marketplace: cartel del modo demo (market.html?demo=1) */
.demo-banner { max-width: 1100px; margin: 0 auto 8px; padding: 12px 18px; border: 1px dashed var(--gold); border-radius: 10px; background: rgba(212, 175, 106, 0.08); color: var(--gold-light); text-align: center; font-weight: 700; }

/* Marketplace: iconos de items (assets/img/items, extraidos del cliente) */
.mk-item { display: inline-flex; align-items: center; gap: 10px; }
.mk-icon { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 4px; border: 1px solid rgba(212, 175, 106, 0.25); background: #0b0914; image-rendering: auto; }
.mk-icon-lg { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 6px; border: 1px solid rgba(212, 175, 106, 0.35); background: #0b0914; }
.mk-icon-none { visibility: hidden; }
#mkVitrina td.v { padding-top: 6px; padding-bottom: 6px; }

/* ============ Barra de anuncio con cinta en movimiento (todas las paginas) ============ */
.announce-bar {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(120% 180% at 50% -40%, rgba(212, 175, 106, 0.12), transparent 60%),
		linear-gradient(90deg, #100c1c, #1b1430 50%, #100c1c);
	border-bottom: 1px solid rgba(212, 175, 106, 0.4);
	box-shadow: 0 1px 0 rgba(212, 175, 106, 0.08) inset;
}
.announce-bar::before,
.announce-bar::after {
	content: "";
	position: absolute; top: 0; bottom: 0; width: 90px; z-index: 2;
	pointer-events: none;
}
.announce-bar::before { left: 0; background: linear-gradient(90deg, #130e22, transparent); }
.announce-bar::after { right: 0; background: linear-gradient(270deg, #130e22, transparent); }
.ab-viewport { display: flex; align-items: center; }
.ab-track {
	display: flex; flex-shrink: 0; align-items: center;
	white-space: nowrap;
	padding: 8px 0;
	animation: ab-scroll 34s linear infinite;
}
.announce-bar:hover .ab-track { animation-play-state: paused; }
@keyframes ab-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.ab-item {
	display: inline-flex; align-items: center; gap: 9px;
	padding: 0 26px;
	font-size: 12.5px; letter-spacing: 0.04em;
	color: var(--text-dim);
}
.ab-item b { color: #f6e4b8; font-weight: 700; }
.ab-item .ab-dot { color: var(--gold); font-size: 12px; transform: rotate(45deg); display: inline-block; opacity: 0.7; }
.ab-item.ab-live b { color: #ffe9b0; }
.ab-item .ab-tag {
	font-size: 10px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase;
	color: #0c0a14; background: linear-gradient(180deg, #f3d58e, #d4af6a);
	border-radius: 999px; padding: 3px 10px;
}
.ab-item .ab-cta {
	font-weight: 800; text-transform: uppercase;
	font-size: 11px; letter-spacing: 0.1em; color: #f6e4b8;
	border: 1px solid rgba(212, 175, 106, 0.6); border-radius: 999px;
	padding: 4px 14px;
}
.announce-bar:hover .ab-cta { background: rgba(212, 175, 106, 0.16); }

/* ============ Caja Pre-Registro premium (home) ============ */
.prereg {
	position: relative;
	overflow: hidden;
	text-align: center;
	padding: 32px 30px 30px;
	border: 1px solid rgba(212, 175, 106, 0.5);
	border-radius: 16px;
	background:
		radial-gradient(130% 90% at 50% -10%, rgba(212, 175, 106, 0.16), transparent 55%),
		linear-gradient(180deg, #171025, #0f0b1c);
	box-shadow: 0 0 0 1px rgba(212, 175, 106, 0.08) inset, 0 24px 60px -30px rgba(0, 0, 0, 0.9);
}
.prereg::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: radial-gradient(60% 50% at 50% 120%, rgba(201, 206, 212, 0.14), transparent 70%);
}
.prereg > * { position: relative; }
.prereg .eyebrow {
	display: inline-flex; align-items: center; gap: 14px;
	color: var(--gold); font-size: 12px; font-weight: 700;
	letter-spacing: 0.34em; text-indent: 0.34em; text-transform: uppercase;
	margin-bottom: 14px;
}
.prereg .eyebrow::before, .prereg .eyebrow::after {
	content: ""; width: 34px; height: 1px;
	background: linear-gradient(90deg, transparent, var(--gold));
}
.prereg .eyebrow::after { background: linear-gradient(90deg, var(--gold), transparent); }
.prereg h2 {
	font-family: var(--font-display);
	font-size: 42px; font-weight: 800; line-height: 1.05;
	letter-spacing: 0.01em;
	margin: 0 0 12px;
	background: linear-gradient(180deg, #fbf1d6 10%, #ecd199 55%, #c49a52 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
	filter: drop-shadow(0 4px 18px rgba(0, 0, 0, 0.6));
}
.prereg .prereg-lead { color: var(--text-dim); margin: 0 auto 26px; max-width: 540px; font-size: 15px; }
.prereg-steps {
	display: grid; grid-template-columns: repeat(3, 1fr);
	gap: 16px; margin: 0 0 26px; text-align: left;
}
.prereg-step {
	position: relative;
	border: 1px solid rgba(212, 175, 106, 0.28);
	border-radius: 12px;
	background: linear-gradient(180deg, rgba(212, 175, 106, 0.07), rgba(212, 175, 106, 0.015));
	padding: 26px 18px 20px;
	transition: border-color 0.2s, transform 0.2s;
}
.prereg-step:hover { border-color: rgba(212, 175, 106, 0.6); transform: translateY(-3px); }
.prereg-step .n {
	position: absolute; top: -18px; left: 50%; transform: translateX(-50%);
	display: inline-flex; align-items: center; justify-content: center;
	width: 38px; height: 38px; border-radius: 50%;
	background: radial-gradient(circle at 50% 30%, #2a2140, #140f24);
	border: 1px solid rgba(212, 175, 106, 0.7);
	color: #f6e4b8; font-family: var(--font-display); font-weight: 700; font-size: 18px;
	box-shadow: 0 6px 16px -6px rgba(0, 0, 0, 0.8);
}
.prereg-step h4 { margin: 10px 0 7px; font-size: 16px; color: var(--text); text-align: center; }
.prereg-step p { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--text-dim); text-align: center; }
.prereg-step p strong { color: var(--gold-light); }
.prereg-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.prereg .hint {
	margin: 20px 0 0; font-size: 12.5px; color: var(--text-dim);
	padding-top: 16px; border-top: 1px solid rgba(212, 175, 106, 0.14);
}
.prereg .hint b { color: var(--gold-light); }
@media (max-width: 760px) {
	.prereg { padding: 26px 18px 24px; }
	.prereg h2 { font-size: 32px; }
	.prereg-steps { grid-template-columns: 1fr; gap: 24px; }
}

/* ============ Tarjeta decorativa de marca (columna izquierda home) ============ */
.brand-card {
	position: relative; overflow: hidden;
	border: 1px solid rgba(212, 175, 106, 0.35);
	border-radius: 12px;
	aspect-ratio: 4 / 5;
	display: flex; align-items: flex-end;
	background-size: cover; background-position: center 20%;
}
.brand-card::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(10, 8, 16, 0.1) 30%, rgba(10, 8, 16, 0.92) 100%);
}
.brand-card .bc-inner { position: relative; z-index: 1; padding: 18px; width: 100%; text-align: center; }
.brand-card .bc-mark {
	font-family: var(--font-display); font-weight: 700;
	font-size: 22px; letter-spacing: 0.2em; color: #f6e4b8;
}
.brand-card .bc-sub {
	margin-top: 6px; font-size: 10.5px; font-weight: 700;
	letter-spacing: 0.26em; text-transform: uppercase; color: var(--text-dim);
}

/* Marketplace: detalle del item en 2 columnas (ficha + compra) */
.mk-back { margin: 0 0 14px; }
.mk-back a { color: var(--text-dim); font-size: 0.9rem; }
.mk-back a:hover { color: var(--gold-light); }
.mk-detail { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.mk-detail > .card { margin: 0; display: flex; flex-direction: column; }
.mk-buy #mkdBuy { display: flex; flex-direction: column; flex: 1; }
.mk-buy #mkdBuy[hidden] { display: none; }
.mk-buy .mk-total { margin-top: auto; }
@media (max-width: 820px) { .mk-detail { grid-template-columns: 1fr; } }
.mk-ficha-head { display: flex; align-items: center; gap: 16px; }
.mk-ficha-head h3 { margin: 0 0 8px; font-size: 1.35rem; }
.mk-icon-xl { width: 64px; height: 64px; flex: 0 0 64px; border-radius: 8px; border: 1px solid rgba(212, 175, 106, 0.45); background: #0b0914; box-shadow: 0 0 18px rgba(212, 175, 106, 0.12); image-rendering: auto; }
.mk-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.mk-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; border: 1px solid var(--border); color: var(--text-dim); background: rgba(255, 255, 255, 0.03); }
.mk-grade-s { color: #f3d58e; border-color: rgba(243, 213, 142, 0.5); }
.mk-grade-a { color: #e88bff; border-color: rgba(232, 139, 255, 0.45); }
.mk-grade-b { color: #7fb8ff; border-color: rgba(127, 184, 255, 0.45); }
.mk-grade-c { color: #7fe0a8; border-color: rgba(127, 224, 168, 0.45); }
.mk-grade-d { color: #c9c4b8; border-color: rgba(201, 196, 184, 0.4); }
.mk-price { margin: 20px 0 6px; padding: 14px 16px; border-radius: 10px; background: rgba(212, 175, 106, 0.07); border: 1px solid rgba(212, 175, 106, 0.2); }
.mk-price-big { font-size: 1.9rem; font-weight: 800; color: var(--gold-light); }
.mk-price-unit { margin-left: 6px; color: var(--text-dim); }
.mk-facts { display: grid; grid-template-columns: auto 1fr; gap: 8px 18px; margin: 16px 0 0; }
.mk-facts dt { color: var(--text-dim); font-size: 0.9rem; }
.mk-facts dd { margin: 0; font-weight: 600; }
.mk-buy h3 { margin-top: 0; }
.mk-buy label { display: block; font-size: 0.85rem; color: var(--text-dim); margin: 14px 0 6px; }
.mk-buy select, .mk-buy input[type="number"] { width: 100%; box-sizing: border-box; padding: 11px 14px; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font: inherit; }
.mk-total { display: flex; justify-content: space-between; align-items: baseline; margin: 18px 0 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.mk-total span { color: var(--text-dim); }
.mk-total strong { font-size: 1.4rem; }
.mk-buy-btn { display: block; width: 100%; text-align: center; box-sizing: border-box; }
.mk-buy-note { margin-top: 10px; }
#mkDetail .usdt-box { margin-top: 20px; }

/* Marketplace: paginador numerado de la vitrina (25 por pagina) */
.mk-pager { margin-top: 18px; text-align: center; }
.mk-pager-nav { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px; }
.mk-page { min-width: 38px; padding: 8px 12px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font: inherit; font-weight: 700; cursor: pointer; transition: border-color 0.15s, color 0.15s; }
.mk-page:hover:not(:disabled) { border-color: var(--gold); color: var(--gold-light); }
.mk-page.active { background: linear-gradient(135deg, var(--gold-light), var(--gold)); border-color: var(--gold); color: #1a1408; cursor: default; }
.mk-page:disabled:not(.active) { opacity: 0.35; cursor: default; }
.mk-page-dots { color: var(--text-dim); padding: 0 4px; }
.mk-pager-info { margin: 10px 0 0; color: var(--text-dim); font-size: 0.85rem; }

/* Marketplace: ficha del item estilo Lineage II (hover / toque en el icono) */
.has-tip { cursor: help; }
.l2-tip { position: fixed; z-index: 9999; max-width: 300px; padding: 8px 10px; background: rgba(6, 6, 10, 0.94); border: 1px solid #5b4a2c; border-radius: 3px; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.6); font-family: Tahoma, Verdana, Arial, sans-serif; font-size: 12px; line-height: 1.45; color: #d8d8d8; pointer-events: none; }
.l2-tip[hidden] { display: none; }
.l2-tip-name { color: #ffffff; font-weight: 700; margin-bottom: 2px; }
.l2-tip-grade { display: inline-block; margin-left: 6px; padding: 0 5px; border: 1px solid currentColor; border-radius: 3px; font-size: 10px; line-height: 14px; vertical-align: 1px; }
.l2-tip-type { color: #a29e9e; }
.l2-tip-stat { color: #a29e9e; }
.l2-tip-val { color: #ffffff; }
.l2-tip-desc { margin-top: 6px; color: #b09979; white-space: pre-line; }
.l2-tip-set { margin-top: 6px; padding-top: 6px; border-top: 1px solid rgba(91, 74, 44, 0.6); }
.l2-tip-piece { color: #8a8a8a; }
.l2-tip-bonus { color: #d8d8d8; margin-bottom: 2px; }

/* ============ Panel: seccion Votos (pre-lanzamiento) ============ */
.vote-hero {
	display: flex; flex-direction: column; gap: 6px;
	background: radial-gradient(120% 110% at 50% -20%, rgba(212, 175, 106, 0.14), transparent 60%), var(--bg-card);
	border: 1px solid rgba(212, 175, 106, 0.4);
}
.vote-count { display: flex; align-items: baseline; gap: 12px; }
.vote-count-num { font-family: var(--font-display); font-size: 3rem; line-height: 1; font-weight: 800; }
.vote-count-lbl { color: var(--text-dim); font-size: 0.9rem; letter-spacing: 0.04em; }
.vote-track { position: relative; height: 12px; border-radius: 999px; background: var(--bg); border: 1px solid var(--border); margin: 18px 0 22px; }
.vote-track-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--violet), var(--gold)); transition: width 0.7s ease; }
.vote-track-marks { position: absolute; inset: 0; }
.vote-mark { position: absolute; top: 50%; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; background: var(--bg-card); border: 2px solid var(--border); }
.vote-mark.done { border-color: var(--gold); background: var(--gold); box-shadow: 0 0 10px rgba(212, 175, 106, 0.6); }
.vote-next { margin: 0; color: var(--text); font-weight: 600; }
.vote-sites { display: flex; gap: 12px; flex-wrap: wrap; }
.vote-site { min-width: 190px; text-align: center; }
.vote-site-off { opacity: 0.55; cursor: default; }
.vote-prizes { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.vote-prize { display: flex; align-items: center; gap: 14px; padding: 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); }
.vote-prize.unlocked { border-color: rgba(212, 175, 106, 0.6); background: linear-gradient(180deg, rgba(212, 175, 106, 0.09), rgba(212, 175, 106, 0.02)); }
.vote-prize-ic { flex: none; width: 42px; height: 42px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-weight: 800; font-size: 1.05rem; color: var(--text-dim); background: var(--bg); border: 1px solid var(--border); }
.vote-prize.unlocked .vote-prize-ic { color: #0e0b1a; background: linear-gradient(180deg, var(--gold-light), var(--gold)); border-color: transparent; }
.vote-prize-name { font-weight: 700; color: var(--text); }
.vote-prize-sub { font-size: 0.82rem; color: var(--text-dim); margin-top: 2px; }
.vote-prize.unlocked .vote-prize-sub { color: var(--gold-light); }

/* Marketplace: carrito (2026-10-14) */
.mk-cartbar { display: flex; justify-content: flex-end; margin: 0 0 14px; }
.mk-cartbtn { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 999px; color: var(--text); font: inherit; font-weight: 700; cursor: pointer; transition: border-color 0.15s, color 0.15s; }
.mk-cartbtn:hover, .mk-cartbtn.has-items { border-color: var(--gold); color: var(--gold-light); }
.mk-cart-count { display: inline-block; min-width: 22px; padding: 1px 7px; border-radius: 999px; background: rgba(212, 175, 106, 0.18); text-align: center; font-size: 0.85rem; }
.mk-cartbtn.has-items .mk-cart-count { background: linear-gradient(135deg, var(--gold-light), var(--gold)); color: #1a1408; }
.mk-cart-sum { color: var(--text-dim); font-weight: 600; }
.mk-toast { text-align: right; margin: -6px 0 12px; }
.mk-add-cell { text-align: right; white-space: nowrap; }
.mk-add { padding: 5px 10px; background: transparent; border: 1px solid var(--border); border-radius: 6px; color: var(--gold-light); font: inherit; font-size: 0.8rem; font-weight: 700; cursor: pointer; }
.mk-add:hover { border-color: var(--gold); background: rgba(212, 175, 106, 0.08); }
.mk-cart-list h3 { margin-top: 0; }
.mk-cart-row { display: grid; grid-template-columns: minmax(0, 1fr) 110px 110px 32px; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--border); }
.mk-cart-name a { color: var(--text); font-weight: 700; }
.mk-cart-name a:hover { color: var(--gold-light); }
.mk-cart-sub { color: var(--text-dim); font-size: 0.8rem; }
.mk-cart-qty input { width: 100%; box-sizing: border-box; padding: 7px 9px; background: var(--bg); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font: inherit; }
.mk-cart-tot { text-align: right; font-weight: 800; }
.mk-cart-low { color: #e07a6a; }
.mk-cart-rm { width: 30px; height: 30px; background: transparent; border: 1px solid var(--border); border-radius: 6px; color: var(--text-dim); cursor: pointer; }
.mk-cart-rm:hover { border-color: #e07a6a; color: #e07a6a; }
.mk-cart-empty { color: var(--text-dim); padding: 12px 0; }
.mk-buy-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 560px) { .mk-cart-row { grid-template-columns: minmax(0, 1fr) 80px 32px; } .mk-cart-tot { grid-column: 2; grid-row: 2; } .mk-buy-actions { grid-template-columns: 1fr; } }
.mk-pay-lines { margin: 10px 0 4px; }
.mk-pay-line { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px dashed var(--border); font-size: 0.9rem; }
.mk-pay-state { color: var(--text-dim); text-align: right; }

.mk-paybox { margin-top: 20px; }
.mk-paybox h3 { margin-top: 0; }
.mk-detail[hidden] { display: none; }
#mkCart .mk-cart-row { grid-template-columns: minmax(0, 1fr) 90px 100px 32px; }

/* Marketplace: filtros por categoria y grado (botones) */
.mk-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.mk-chip { padding: 7px 14px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 999px; color: var(--text-dim); font: inherit; font-size: 0.88rem; font-weight: 700; cursor: pointer; transition: border-color 0.15s, color 0.15s, background 0.15s; }
.mk-chip:hover { border-color: var(--gold); color: var(--gold-light); }
.mk-chip.active { background: linear-gradient(135deg, var(--gold-light), var(--gold)); border-color: var(--gold); color: #1a1408; }
.mk-chips-grade .mk-chip[data-v]:not([data-v=""]) { min-width: 44px; }
.mk-chips-grade .mk-chip.mk-grade-s:not(.active) { color: #f3d58e; border-color: rgba(243, 213, 142, 0.5); }
.mk-chips-grade .mk-chip.mk-grade-a:not(.active) { color: #e88bff; border-color: rgba(232, 139, 255, 0.45); }
.mk-chips-grade .mk-chip.mk-grade-b:not(.active) { color: #7fb8ff; border-color: rgba(127, 184, 255, 0.45); }
.mk-chips-grade .mk-chip.mk-grade-c:not(.active) { color: #7fe0a8; border-color: rgba(127, 224, 168, 0.45); }
.mk-chips-grade .mk-chip.mk-grade-d:not(.active) { color: #c9c4b8; border-color: rgba(201, 196, 184, 0.4); }

/* Panel > Donaciones: medio de pago en pestanas (elegir no crea ninguna orden; el boton de cada medio si) */
.pay-step-title { margin: 18px 0 8px; font-size: 0.85rem; color: var(--text-dim); }
.pay-methods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 640px) { .pay-methods { grid-template-columns: 1fr; } }
.pay-method { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 14px; background: var(--bg); border: 1px solid var(--border); border-radius: 10px; color: var(--text); font: inherit; text-align: left; cursor: pointer; transition: border-color 0.15s, background 0.15s; }
.pay-method small { color: var(--text-dim); font-size: 0.8rem; }
.pay-method:hover { border-color: var(--gold); }
.pay-method.active { border-color: var(--gold); background: rgba(212, 175, 106, 0.08); box-shadow: 0 0 0 1px var(--gold) inset; }
.pay-method.active strong { color: var(--gold-light); }
.pay-panel { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.pay-panel[hidden] { display: none; }
.pay-total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.pay-total span { color: var(--text-dim); }
.pay-total strong { font-size: 1.4rem; }
.pay-how { margin: 12px 0 16px; padding-left: 18px; color: var(--text-dim); line-height: 1.6; }
.pay-go { display: block; width: 100%; text-align: center; box-sizing: border-box; }
.pay-usdt-box { margin-top: 18px; }

/* Panel > Donaciones: "Pagar con el celular (QR)" en Mercado Pago y PayPal */
.pay-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 640px) { .pay-actions { grid-template-columns: 1fr; } }
.pay-qr { display: flex; gap: 18px; align-items: center; margin-top: 16px; padding: 16px; border: 1px dashed var(--gold); border-radius: 10px; background: rgba(212, 175, 106, 0.05); }
.pay-qr[hidden] { display: none; }
.pay-qr p { margin: 0 0 8px; }
.pay-qr-img { flex: 0 0 auto; padding: 10px; background: #ffffff; border-radius: 8px; line-height: 0; }
.pay-qr-img img, .pay-qr-img canvas { width: 200px; height: 200px; }
@media (max-width: 560px) { .pay-qr { flex-direction: column; text-align: center; } }

/* Panel > MarketPlace: campos de la billetera de cobro con el estilo del sitio */
#bilCard label { display: block; font-size: 0.85rem; color: var(--text-dim); margin: 14px 0 6px; }
#bilCard input { width: 100%; max-width: 460px; box-sizing: border-box; padding: 11px 14px; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font: inherit; }
#bilCard input:focus { outline: none; border-color: var(--gold); }
#bilCard #bilBtn { margin-top: 12px; }

/* Panel > MarketPlace: aviso de 2FA dentro de la billetera de cobro */
.tfa-need { margin: 6px 0 0; padding: 16px 18px; border: 1px solid rgba(212, 175, 106, 0.5); border-radius: 10px; background: rgba(212, 175, 106, 0.06); }
.tfa-need[hidden] { display: none; }
.tfa-need p { margin: 0 0 10px; color: var(--text-dim); line-height: 1.55; }
.tfa-need .tfa-need-title { color: var(--gold-light); font-weight: 800; font-size: 1.05rem; }
.tfa-need .btn { display: inline-block; }

/* Panel > Donaciones: promo por cantidad, bloqueo hasta la Beta y opciones de donacion (2026-10-15) */
.beta-lock { margin: 0 0 18px; }
.promo-card { margin-bottom: 18px; }
.promo-card h3 { margin: 0 0 6px; }
.promo-tiers { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 12px; }
@media (max-width: 760px) { .promo-tiers { grid-template-columns: repeat(2, 1fr); } }
.promo-tier { display: flex; flex-direction: column; gap: 4px; padding: 12px; border: 1px solid rgba(212, 175, 106, 0.3); border-radius: 10px; background: rgba(212, 175, 106, 0.04); text-align: center; }
.promo-tier span { color: var(--text-dim); font-size: 0.85rem; }
.promo-tier strong { color: var(--gold-light); font-size: 1.05rem; }
.promo-tier.active { border-color: var(--gold); background: rgba(212, 175, 106, 0.14); box-shadow: 0 0 0 1px var(--gold) inset; }
.promo-get { margin: 10px 0 0; color: var(--text-dim); }
.promo-get strong { color: var(--gold-light); font-size: 1.15rem; }
.pay-go:disabled { opacity: 0.45; cursor: not-allowed; filter: grayscale(0.4); }
.dona-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 760px) { .dona-opts { grid-template-columns: 1fr; } }
.dona-opt p { color: var(--text-dim); line-height: 1.55; }
.dona-opt-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.dona-opt-head h3 { margin: 0; }
.dona-price { color: var(--text-dim); font-size: 0.9rem; white-space: nowrap; }
.dona-price strong { color: var(--gold-light); font-size: 1.3rem; }

/* Panel > Votos: premios Fundador (vista previa hasta el lanzamiento, eleccion desde el 27/11) */
.pz-aviso { margin: 0 0 14px; color: var(--text-dim); }
.pz-list { display: grid; gap: 14px; }
.pz-card { opacity: 0.75; }
.pz-card.won { opacity: 1; border-color: rgba(212, 175, 106, 0.55); }
.pz-head { display: flex; align-items: center; gap: 14px; }
.pz-tit { flex: 1; min-width: 0; }
.pz-tit h3 { margin: 0; }
.pz-tit p { margin: 2px 0 0; }
.pz-num { flex: none; width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-weight: 800; color: #0e0b1a; background: linear-gradient(180deg, var(--gold-light), var(--gold)); }
.pz-badge { flex: none; padding: 4px 12px; border-radius: 999px; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-dim); border: 1px solid var(--border); }
.pz-card.won .pz-badge { color: #0e0b1a; background: var(--gold-light); border-color: transparent; }
.pz-colors { display: flex; gap: 18px; flex-wrap: wrap; margin: 16px 0 12px; }
.pz-sw { display: flex; flex-direction: column; align-items: center; gap: 6px; background: none; border: 0; padding: 0; cursor: pointer; color: var(--text-dim); }
.pz-dot { width: 42px; height: 42px; border-radius: 50%; border: 3px solid transparent; box-shadow: 0 0 0 1px var(--border); }
.pz-sw.active .pz-dot { border-color: var(--gold-light); }
.pz-sw.active small { color: var(--gold-light); font-weight: 700; }
.pz-preview { padding: 12px 16px; border-radius: 10px; background: var(--bg); border: 1px solid var(--border); }
.pz-preview strong { font-family: var(--font-display); font-size: 1.2rem; margin-left: 6px; }
.pz-skins { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 16px; }
@media (max-width: 760px) { .pz-skins { grid-template-columns: repeat(2, 1fr); } }
.pz-skin { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 12px 8px; border-radius: 10px; border: 1px solid var(--border); background: var(--bg); color: var(--text); font-size: 0.82rem; text-align: center; cursor: pointer; }
.pz-skin img { width: 32px; height: 32px; image-rendering: pixelated; }
.pz-skin:disabled { cursor: default; }
.pz-skin.active { border-color: var(--gold); background: rgba(212, 175, 106, 0.12); box-shadow: 0 0 0 1px var(--gold) inset; }
.pz-entrega { margin-top: 14px; }
.pz-entrega[hidden] { display: none; }

/* Panel > Billetera: activa + "Cambiar billetera" con aviso de 48 h (2026-10-15) */
.bil-activa { padding: 14px 16px; border: 1px solid rgba(212, 175, 106, 0.45); border-radius: 10px; background: rgba(212, 175, 106, 0.05); margin-bottom: 14px; }
.bil-activa[hidden] { display: none; }
.bil-activa-dir { margin: 0 0 6px; word-break: break-all; }
.bil-cambiar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 10px; }
.bil-aviso48 { flex: 1; min-width: 240px; margin: 0; font-size: 0.88rem; color: var(--text-dim); }
.bil-aviso48 strong { color: var(--gold-light); }
.mk-cart-disp { margin-top: 5px; font-size: 0.78rem; color: var(--text-dim); white-space: nowrap; }
.mk-cart-all { background: none; border: 0; padding: 0; color: var(--gold-light); font: inherit; font-weight: 700; cursor: pointer; text-decoration: underline; }

/* Panel admin: pestañas + Cuentas y votos (2026-10-15) */
.adm-tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--border); margin: 6px 0 22px; flex-wrap: wrap; }
.adm-tab { background: none; border: 0; border-bottom: 2px solid transparent; padding: 10px 16px; color: var(--text-dim); font: inherit; font-weight: 700; cursor: pointer; }
.adm-tab.active { color: var(--gold-light); border-bottom-color: var(--gold); }
.adm-pane[hidden] { display: none; }
.adm-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 16px; }
@media (max-width: 760px) { .adm-kpis { grid-template-columns: 1fr; } }
.adm-toolbar { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.adm-toolbar input { flex: 1; min-width: 220px; }
.adm-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.adm-chip { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--border); background: var(--bg-card); color: var(--text-dim); font: inherit; font-size: 0.85rem; font-weight: 700; cursor: pointer; }
.adm-chip.active { background: var(--gold-light); color: #0e0b1a; border-color: transparent; }
.adm-clickable tbody tr { cursor: pointer; }
.adm-clickable tbody tr:hover td { background: rgba(212, 175, 106, 0.07); }
.adm-strong { font-weight: 700; color: var(--text); }
.adm-sos td { background: rgba(216, 106, 106, 0.08); }
.adm-al-bad { color: #f0a3a3; font-weight: 800; }
.adm-al-ok { color: #6be38f; }
.adm-dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 0 0 12px; }
.adm-dl dt { color: var(--text-dim); }
.adm-dl dd { margin: 0; color: var(--text); word-break: break-all; }
.adm-alertbox { margin: 0; padding: 12px 14px; border-radius: 8px; border: 1px solid rgba(216, 106, 106, 0.5); background: rgba(216, 106, 106, 0.1); color: #f0a3a3; line-height: 1.5; }
.adm-okbox { margin: 0; padding: 12px 14px; border-radius: 8px; border: 1px solid rgba(34, 204, 85, 0.4); background: rgba(34, 204, 85, 0.08); color: #6be38f; }
.adm-ficha-grid { display: grid; grid-template-columns: 1fr 2fr; gap: 18px; margin-top: 8px; }
@media (max-width: 900px) { .adm-ficha-grid { grid-template-columns: 1fr; } }
.adm-rev td { background: rgba(230, 190, 80, 0.07); }
.adm-tag { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 0.74rem; font-weight: 800; letter-spacing: 0.04em; white-space: nowrap; }
.adm-tag-rojo { background: rgba(216, 106, 106, 0.2); color: #f0a3a3; border: 1px solid rgba(216, 106, 106, 0.6); }
.adm-tag-amar { background: rgba(230, 190, 80, 0.16); color: #f1d27a; border: 1px solid rgba(230, 190, 80, 0.55); }
.adm-tag-ok { background: rgba(34, 204, 85, 0.1); color: #6be38f; border: 1px solid rgba(34, 204, 85, 0.4); }
.adm-leyenda { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 4px; font-size: 0.85rem; color: var(--text-dim); }
.adm-leyenda .adm-tag { margin-right: 8px; }
.adm-revbox { margin: 10px 0 0; padding: 12px 14px; border-radius: 8px; border: 1px solid rgba(230, 190, 80, 0.5); background: rgba(230, 190, 80, 0.08); color: #f1d27a; line-height: 1.5; }
#fAlertas .adm-alertbox + .adm-revbox { margin-top: 10px; }

/* Login rapido del home (2026-10-15): el captcha de Cloudflare mide 300 px fijos y la columna ~226 px: se achica proporcional. */
@media (min-width: 821px) {
	.mini-login .captcha-box { width: 225px; height: 49px; margin-bottom: 10px; overflow: visible; }
	.mini-login .captcha-box > div { transform: scale(0.75); transform-origin: 0 0; }
}

/* Home: tarjeta-imagen del evento de votos (2026-10-15) */
.box-img { display: block; padding: 0; overflow: hidden; line-height: 0; transition: transform 0.2s, box-shadow 0.2s; }
.box-img img { display: block; width: 100%; height: auto; }
.box-img:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(124, 77, 255, 0.25); }

/* Home: emblemas de las tarjetas laterales (Donaciones / Votá y ganá / Soporte), 2026-10-15 */
.cta-emblema { display: block; width: 120px; height: 120px; margin: 0 auto 6px; filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.45)); }

/* Donaciones: promo por cantidad, 5 escalones en una fila (2026-10-15) */
.price-grid-5 { grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }
.price-grid-5 .price { padding: 16px 10px; }
.acc-soon { margin-left: 10px; padding: 2px 9px; border-radius: 999px; border: 1px solid rgba(212, 175, 106, 0.45); color: var(--gold-light); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; vertical-align: middle; }

/* Foro de la comunidad (2026-10-15) */
.fo-cats { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; }
.fo-cat { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg); color: var(--text); transition: border-color 0.15s, transform 0.15s; }
.fo-cat:hover { border-color: var(--gold); transform: translateY(-2px); }
.fo-cat strong { color: var(--gold-light); font-size: 1rem; }
.fo-cat-n { font-size: 0.85rem; color: var(--text); }
.fo-cat-u { font-size: 0.78rem; color: var(--text-dim); }
.block-head .btn-sm { padding: 7px 14px; font-size: 0.78rem; }
.fo-back { margin: 0 0 12px; font-size: 0.85rem; }
.fo-back a { color: var(--text-dim); }
.fo-back a:hover { color: var(--gold-light); }
.fo-topics { display: flex; flex-direction: column; }
.fo-topic { display: grid; grid-template-columns: minmax(0, 1fr) 90px 170px; gap: 14px; align-items: center; padding: 14px 6px; border-bottom: 1px solid var(--border); color: var(--text); }
.fo-topic:hover { background: rgba(212, 175, 106, 0.05); }
.fo-topic-tit { font-weight: 700; color: var(--text); overflow-wrap: anywhere; }
.fo-topic-sub { font-size: 0.8rem; color: var(--text-dim); margin-top: 3px; }
.fo-topic-stats { text-align: center; line-height: 1.2; }
.fo-topic-stats strong { display: block; color: var(--gold-light); font-size: 1.05rem; }
.fo-topic-stats span { font-size: 0.74rem; color: var(--text-dim); }
.fo-topic-last { font-size: 0.78rem; color: var(--text-dim); text-align: right; }
@media (max-width: 640px) { .fo-topic { grid-template-columns: minmax(0, 1fr) 70px; } .fo-topic-last { display: none; } }
.fo-empty { color: var(--text-dim); text-align: center; padding: 24px 0; margin: 0; }
.fo-tag { display: inline-block; margin-right: 8px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--border); color: var(--text-dim); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; vertical-align: middle; }
.fo-tag-pin { border-color: rgba(212, 175, 106, 0.55); color: var(--gold-light); }
.fo-tag-op { margin: 0 0 0 4px; border-color: rgba(124, 77, 255, 0.5); color: #b9a3ff; }
.fo-topic-head h2 { margin: 0; font-size: 1.35rem; overflow-wrap: anywhere; }
.fo-topic-meta { margin-top: 6px; font-size: 0.82rem; color: var(--text-dim); }
.fo-mod { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.fo-mod[hidden] { display: none; }
.fo-danger { border-color: rgba(216, 106, 106, 0.6); color: #f0a3a3; }
.fo-posts { display: flex; flex-direction: column; gap: 12px; margin-top: 18px; }
.fo-post { border: 1px solid var(--border); border-radius: 10px; background: var(--bg); overflow: hidden; }
.fo-post-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; border-bottom: 1px solid var(--border); background: rgba(255, 255, 255, 0.02); }
.fo-post-author { color: var(--gold-light); }
.fo-post-date { font-size: 0.78rem; color: var(--text-dim); }
.fo-del { margin-left: auto; background: none; border: 0; color: #f0a3a3; font: inherit; font-size: 0.78rem; cursor: pointer; }
.fo-post-body { padding: 14px; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.6; color: var(--text); }
.fo-cerrado { text-align: center; color: var(--text-dim); margin: 0; }
.fo-cerrado[hidden] { display: none; }
#fNuevo select, #fNuevo input, #fNuevo textarea, #ftResp textarea, #faAlias { width: 100%; box-sizing: border-box; }
#fNuevo textarea, #ftResp textarea { padding: 12px; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font: inherit; resize: vertical; }
.fo-side-text { font-size: 0.86rem; color: var(--text-dim); line-height: 1.55; margin: 0 0 12px; }
.fo-rules { margin: 0; padding-left: 18px; font-size: 0.85rem; color: var(--text-dim); line-height: 1.6; }
#fNuevo select, #fNuevo input, #faAlias { padding: 11px 14px; background: var(--bg); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font: inherit; }
#fNuevo select:focus, #fNuevo input:focus, #fNuevo textarea:focus, #ftResp textarea:focus, #faAlias:focus { outline: none; border-color: var(--violet); }
#fNuevo label { color: var(--text-dim); font-size: 0.88rem; }

/* ---------- Instagram FAB (a la izquierda del de Discord) ---------- */
.instagram-fab {
	position: fixed;
	bottom: 24px;
	right: 92px;
	z-index: 60;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 20px rgba(214, 36, 159, 0.45);
	transition: transform 0.2s ease;
}
.instagram-fab:hover { transform: scale(1.08); }
.instagram-fab svg { width: 26px; height: 26px; fill: #fff; }

/* ---------- Facebook FAB (a la izquierda del de Instagram) ---------- */
.facebook-fab {
	position: fixed;
	bottom: 24px;
	right: 160px;
	z-index: 60;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #1877f2;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 20px rgba(24, 119, 242, 0.45);
	transition: transform 0.2s ease;
}
.facebook-fab:hover { transform: scale(1.08); }
.facebook-fab svg { width: 30px; height: 30px; fill: #fff; }

/* ===== Marca nueva (2026-10-30): cabecera, pie y cabecera interior. Ver GUIA_DE_MARCA.md ===== */
.btn-gold { background: var(--gold); color: #15110A; border-radius: 2px; box-shadow: none; }
.btn-gold:hover { background: var(--gold-light); filter: none; transform: none; }
.btn-discord-sm { background: var(--gold); color: #15110A; border-radius: 2px; box-shadow: none; }
.btn-discord-sm:hover { background: var(--gold-light); filter: none; transform: none; }

.sx-top { position: sticky; top: 0; z-index: 50; background: var(--bg); border-bottom: 1px solid var(--border); }
.sx-top-in { display: flex; align-items: center; gap: 40px; height: 72px; max-width: 1440px; margin: 0 auto; padding: 0 56px; }
.sx-logo { flex: none; display: block; }
.sx-logo img { display: block; width: auto; height: 52px; }
.sx-nav { display: flex; gap: 28px; flex: 1; }
.sx-nav a { padding: 6px 0; border-bottom: 2px solid transparent; color: var(--text-dim); font-size: 15px; font-weight: 700; text-decoration: none; }
.sx-nav a:hover { color: var(--text); }
.sx-nav a[aria-current] { color: var(--text); border-color: var(--gold); }
.sx-right { display: flex; align-items: center; gap: 18px; }
.sx-out { color: var(--text-dim); font-size: 14px; font-weight: 700; text-decoration: none; }
.sx-out:hover { color: var(--text); }
.sx-panel { display: inline-flex; align-items: center; min-height: 42px; padding: 0 18px; border: 1px solid var(--violet-light); border-radius: 2px; color: var(--text); font-size: 14px; font-weight: 700; white-space: nowrap; text-decoration: none; }
.sx-panel:hover { background: var(--violet-light); color: var(--bg); }
.sx-burger { display: none; width: 44px; height: 44px; margin-left: auto; padding: 0; background: none; border: 1px solid var(--border); border-radius: 2px; color: var(--violet-light); font-size: 20px; cursor: pointer; }

.page-hero { padding: 72px max(56px, calc((100% - 1328px) / 2)) 48px; text-align: left; }
.page-hero::before, .page-hero::after { display: none; }
.page-hero h1 { margin: 10px 0 0; font-size: 40px; line-height: 1.15; font-weight: 600; }
.page-hero p { max-width: 640px; margin: 14px 0 0; font-size: 17px; }
.page-hero .eyebrow { color: var(--violet-light); font-family: var(--font-body); font-size: 13px; font-weight: 700; letter-spacing: .14em; }
.page-hero .eyebrow::before, .page-hero .eyebrow::after { display: none; }
.layout-1, .layout-2, .layout-3 { padding-left: 56px; padding-right: 56px; }

.sx-foot { margin-top: 96px; padding: 56px 0 32px; border-top: 1px solid var(--border); color: var(--text-dim); font-size: 15px; }
.sx-foot-in { max-width: 1440px; margin: 0 auto; padding: 0 56px; }
.sx-foot-g { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 48px; }
.sx-foot p { max-width: 420px; margin: 12px 0 0; }
.sx-foot h3 { margin: 0; font: 700 13px var(--font-body); letter-spacing: .1em; text-transform: uppercase; color: var(--violet-light); }
.sx-foot ul { margin: 12px 0 0; padding: 0; list-style: none; }
.sx-foot li a { display: inline-block; padding: 4px 0; color: var(--text-dim); text-decoration: none; }
.sx-foot li a:hover { color: var(--text); text-decoration: underline; }
.sx-foot .sx-legal { max-width: none; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--border); font-size: 14px; }

@media (max-width: 1080px) {
	.sx-top-in { gap: 24px; padding: 0 32px; }
	.sx-nav { gap: 18px; }
	.page-hero { padding-left: 32px; padding-right: 32px; }
	.layout-1, .layout-2, .layout-3 { padding-left: 32px; padding-right: 32px; }
	.sx-foot-in { padding: 0 32px; }
}
@media (max-width: 960px) {
	.sx-burger { display: block; }
	.sx-top-in { flex-wrap: wrap; height: auto; min-height: 60px; gap: 0; padding: 8px 20px; }
	.sx-logo img { height: 42px; }
	.sx-nav, .sx-right { display: none; }
	.sx-top.open .sx-nav { display: flex; flex: 0 0 100%; flex-direction: column; gap: 0; padding-top: 8px; }
	.sx-top.open .sx-nav a { padding: 12px 0; border: 0; }
	.sx-top.open .sx-right { display: flex; flex: 0 0 100%; flex-wrap: wrap; margin: 8px 0; }
	.sx-top.open .sx-panel { flex: 1; justify-content: center; }
	.page-hero { padding: 48px 24px 32px; }
	.page-hero h1 { font-size: 32px; }
	.layout-1, .layout-2, .layout-3 { padding-left: 24px; padding-right: 24px; }
	.sx-foot { margin-top: 64px; }
	.sx-foot-in { padding: 0 24px; }
	.sx-foot-g { grid-template-columns: 1fr 1fr; }
	.sx-foot-g > :first-child { grid-column: 1 / -1; }
}

/* Paneles sin el tinte violeta anterior */
.panel-block, .box, .form-box { background: var(--bg-card); border-color: var(--border); border-radius: 2px; }
.box-title { background: none; }
.price, .rate-card { background: var(--bg); border-color: var(--border); border-radius: 2px; }
.btn.btn-discord-sm, .btn.btn-discord-sm:hover { color: #15110A !important; }
.price .amount { font-family: var(--font-body); font-weight: 700; }

.don-items { margin: 0; padding: 0; list-style: none; }
.don-items li { display: grid; grid-template-columns: 32px 1fr; gap: 18px; align-items: start; padding: 18px 0; border-top: 1px solid var(--border); }
.don-items li:first-child { border-top: 0; padding-top: 4px; }
.don-items li:last-child { padding-bottom: 0; }
.don-items img { display: block; width: 32px; height: 32px; }
.don-items strong { color: var(--text); font-size: 16px; }
.don-items p { margin: 4px 0 0; color: var(--text-dim); font-size: 15px; line-height: 1.5; }
@media (max-width: 560px) {
	.don-items li { grid-template-columns: 32px 1fr; }
}

/* Cabecera con imagen: Donaciones */
.page-hero-don { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; min-height: 440px; background: var(--bg) url(../img/aldemar-donaciones-cabecera-20261030.webp) center top / cover no-repeat; border-bottom: 0; }
.page-hero-don::after { display: block; background: linear-gradient(transparent 72%, var(--bg)); }
@media (max-width: 960px) {
	.page-hero-don { min-height: 0; padding-top: 62vw; background-size: auto 72vw; background-position: 80% top; }
	.page-hero-don::after { background: linear-gradient(transparent calc(72vw * .5), var(--bg) 72vw); }
}

/* Tarjeta Donar */
.don-side { position: sticky; top: 96px; }
.don-card { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 440px; padding: 24px; overflow: hidden; border-radius: 2px; background: var(--bg) url(../img/aldemar-donaciones-moneda-20261030.webp) center top / 100% auto no-repeat; }
.don-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 44%, var(--bg) 66%); }
.don-card > * { position: relative; }
.don-card h2 { margin: 0; font-size: 24px; }
.don-card p { margin: 8px 0 0; color: var(--text-dim); font-size: 15px; line-height: 1.5; }
.don-card .btn { width: 100%; margin-top: 16px; }
@media (max-width: 1100px) {
	.don-side { position: static; }
	.don-card { min-height: 0; padding-top: 86%; }
	.don-card::before { background: linear-gradient(transparent 40%, var(--bg) 62%); }
}

.pay-logo { display: block; width: 44px; height: 44px; margin: 0 auto 14px; }