.font-poppins { font-family: 'Poppins', sans-serif; }
.font-orbitron { font-family: 'Orbitron', sans-serif; }
.font-handwriting { font-family: 'Shadows Into Light', cursive; }

.hover-lift { transition: transform .2s ease, box-shadow .2s ease; }
.hover-lift:hover { transform: translateY(-4px); }

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #1c1917; }
::-webkit-scrollbar-thumb { background: #44403c; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #f97316; }

@keyframes ticker {
  0% { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}
.animate-ticker { animation: ticker 28s linear infinite; }
.ticker-container:hover .animate-ticker { animation-play-state: paused; }

.page-glow::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 10%, rgba(249,115,22,.06), transparent 28rem),
    radial-gradient(circle at 85% 35%, rgba(249,115,22,.035), transparent 30rem);
}

.card-soft {
  background: rgba(28,25,23,.72);
  border: 1px solid rgba(68,64,60,.85);
  backdrop-filter: blur(10px);
}

.section-air { padding-top: 5.5rem; padding-bottom: 4.5rem; }
@media (max-width: 768px) {
  .section-air { padding-top: 4rem; padding-bottom: 3rem; }
}

/* V6.2 */
.section-heading{margin-bottom:1.75rem}.section-heading .eyebrow{display:inline-flex;align-items:center;gap:.5rem;color:#f97316;font-size:.7rem;text-transform:uppercase;letter-spacing:.16em;font-family:'Orbitron',sans-serif;font-weight:800}.section-heading h1::after,.section-heading h2::after{content:"";display:block;width:4rem;height:2px;margin-top:.7rem;border-radius:999px;background:linear-gradient(90deg,#f97316,transparent)}
.fx-card{position:relative;overflow:hidden;isolation:isolate;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}.fx-card::before{content:"";position:absolute;width:12rem;height:12rem;border-radius:999px;top:-8rem;right:-8rem;background:radial-gradient(circle,rgba(249,115,22,.14),transparent 68%);opacity:0;transition:.35s;z-index:-1}.fx-card:hover{transform:translateY(-5px);border-color:rgba(249,115,22,.42);box-shadow:0 18px 42px rgba(0,0,0,.28),0 0 26px rgba(249,115,22,.055)}.fx-card:hover::before{opacity:1;transform:translate(-1rem,1rem) scale(1.08)}
.fx-icon{transition:transform .28s ease,box-shadow .28s ease}.fx-card:hover .fx-icon{transform:translateY(-2px) rotate(-4deg) scale(1.08);box-shadow:0 0 24px rgba(249,115,22,.14)}.fx-arrow{transition:.25s}.fx-card:hover .fx-arrow{transform:translateX(4px);color:#f97316}
.glow-title{text-shadow:0 0 26px rgba(249,115,22,.12)}.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}.reveal.is-visible{opacity:1;transform:translateY(0)}
.float-soft{animation:floatSoft 5s ease-in-out infinite}@keyframes floatSoft{50%{transform:translateY(-5px)}}.pulse-ring{position:relative}.pulse-ring::after{content:"";position:absolute;inset:-5px;border:1px solid rgba(249,115,22,.28);border-radius:inherit;animation:pulseRing 2.4s ease-out infinite}@keyframes pulseRing{0%{transform:scale(.96);opacity:0}30%{opacity:.65}100%{transform:scale(1.14);opacity:0}}
.avatar-orbit{position:relative}.avatar-orbit::before{content:"";position:absolute;inset:-5px;border-radius:999px;border:1px dashed rgba(249,115,22,.34);animation:orbitSpin 12s linear infinite}@keyframes orbitSpin{to{transform:rotate(360deg)}}
.shimmer-line{position:relative;overflow:hidden}.shimmer-line::after{content:"";position:absolute;inset:0;transform:translateX(-120%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);animation:shimmerSweep 4.5s ease-in-out infinite}@keyframes shimmerSweep{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@media(prefers-reduced-motion:reduce){.fx-card,.fx-icon,.fx-arrow,.reveal,.float-soft,.pulse-ring::after,.avatar-orbit::before,.shimmer-line::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}


/* ===== V6.3 compact polish ===== */
.section-heading{
  text-align:center;
  max-width:52rem;
  margin-left:auto;
  margin-right:auto;
  margin-bottom:1.75rem;
}
.section-heading .eyebrow{
  justify-content:center;
}
.section-heading h1,
.section-heading h2{
  display:block;
}
.section-heading h1::after,
.section-heading h2::after{
  margin-left:auto;
  margin-right:auto;
}

.card-soft,
.fx-card{
  box-shadow:
    0 10px 28px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.015);
}

.fx-card:hover{
  box-shadow:
    0 18px 42px rgba(0,0,0,.34),
    0 0 28px rgba(249,115,22,.075),
    inset 0 1px 0 rgba(255,255,255,.03);
}

.compact-card{
  padding:1rem!important;
}
.compact-card .compact-icon{
  width:2.75rem;
  height:2.75rem;
  border-radius:.9rem;
}
.compact-card h3{
  font-size:.95rem;
  line-height:1.25rem;
}
.compact-card p{
  font-size:.75rem;
  line-height:1.15rem;
}

.news-ticker{
  display:flex;
  align-items:center;
}
.news-label{
  position:relative;
  z-index:2;
  height:2rem;
  display:flex;
  align-items:center;
  gap:.4rem;
  padding:0 .8rem;
  background:#0c0a09;
  color:#f97316;
  border-right:1px solid rgba(249,115,22,.35);
  font-family:'Orbitron',sans-serif;
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  flex-shrink:0;
  box-shadow:8px 0 18px rgba(12,10,9,.55);
}
.news-track{
  min-width:0;
  flex:1;
  overflow:hidden;
}


/* =========================================================
   V6.5 — DARK PREMIUM IRC
   Solo presentación visual. No modifica APIs ni datos.
   ========================================================= */

:root {
  --brand: #f97316;
  --brand-soft: rgba(249,115,22,.16);
  --brand-line: rgba(249,115,22,.30);
  --community: #22d3ee;
  --community-soft: rgba(34,211,238,.12);
  --compadre: #fbbf24;
  --compadre-soft: rgba(251,191,36,.12);
  --music: #c084fc;
  --music-soft: rgba(192,132,252,.12);
  --security: #f87171;
  --security-soft: rgba(248,113,113,.12);
  --surface: rgba(28,25,23,.74);
  --surface-deep: rgba(12,10,9,.82);
}

body {
  background:
    radial-gradient(circle at 50% -10%, rgba(249,115,22,.075), transparent 32rem),
    linear-gradient(180deg, #0c0a09 0%, #0f0d0c 38%, #0c0a09 100%);
}

.page-glow::before {
  position: fixed;
  background:
    radial-gradient(circle at 15% 12%, rgba(249,115,22,.08), transparent 27rem),
    radial-gradient(circle at 82% 22%, rgba(34,211,238,.045), transparent 25rem),
    radial-gradient(circle at 76% 72%, rgba(192,132,252,.035), transparent 28rem);
  filter: saturate(1.15);
}

/* Navbar premium */
nav {
  box-shadow:
    0 1px 0 rgba(255,255,255,.02),
    0 10px 30px rgba(0,0,0,.26);
}
nav::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(249,115,22,.42), transparent);
}
nav a {
  position: relative;
}
nav a:not(:first-child)::after {
  content: "";
  position: absolute;
  left: 50%; right: 50%; bottom: -.45rem;
  height: 1px;
  background: var(--brand);
  transition: left .25s ease, right .25s ease, opacity .25s ease;
  opacity: 0;
}
nav a:not(:first-child):hover::after {
  left: 0; right: 0; opacity: .75;
}

/* Hero */
main > header {
  position: relative;
  isolation: isolate;
}
main > header::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 46%;
  width: min(46rem, 90vw);
  height: 20rem;
  transform: translate(-50%,-50%);
  background: radial-gradient(ellipse, rgba(249,115,22,.095), transparent 68%);
  filter: blur(8px);
  pointer-events: none;
}
main > header h1 {
  text-shadow:
    0 0 28px rgba(249,115,22,.13),
    0 12px 36px rgba(0,0,0,.32);
}

/* Section divider: luminous instead of flat border */
.section-air {
  position: relative;
}
.section-air.border-t {
  border-color: transparent !important;
}
.section-air.border-t::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: min(72rem, 88%);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(120,113,108,.20) 15%, rgba(249,115,22,.24) 50%, rgba(120,113,108,.20) 85%, transparent);
}
.section-air.border-t::after {
  content: "";
  position: absolute;
  top: -1px;
  left: 50%;
  width: 8rem;
  height: 3px;
  transform: translateX(-50%);
  background: radial-gradient(ellipse, rgba(249,115,22,.30), transparent 70%);
  filter: blur(3px);
  opacity: .5;
}

/* Section titles */
.section-heading .eyebrow {
  padding: .38rem .68rem;
  border: 1px solid rgba(249,115,22,.16);
  border-radius: 999px;
  background: rgba(249,115,22,.055);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.section-heading h1,
.section-heading h2 {
  letter-spacing: .01em;
}
.section-heading h1::after,
.section-heading h2::after {
  width: 5rem;
  height: 2px;
  box-shadow: 0 0 12px rgba(249,115,22,.20);
}

/* Glass cards */
.card-soft,
.fx-card {
  background:
    linear-gradient(145deg, rgba(41,37,36,.72), rgba(17,15,14,.72));
  border-color: rgba(87,83,78,.62);
  box-shadow:
    0 14px 34px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.025),
    inset 0 -1px 0 rgba(0,0,0,.20);
}
.fx-card::before {
  background: radial-gradient(circle, rgba(249,115,22,.16), transparent 68%);
}
.fx-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(120deg, rgba(255,255,255,.025), transparent 30%, transparent 70%, rgba(249,115,22,.025));
  opacity: .7;
}
.fx-card:hover {
  transform: translateY(-5px) scale(1.008);
  border-color: rgba(249,115,22,.38);
  box-shadow:
    0 22px 52px rgba(0,0,0,.34),
    0 0 30px rgba(249,115,22,.07),
    inset 0 1px 0 rgba(255,255,255,.04);
}

/* Buttons */
button,
a[class*="bg-brand"],
a[class*="bg-amber"],
a[class*="bg-purple"] {
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    filter .2s ease,
    border-color .2s ease,
    background-color .2s ease;
}
button:hover,
a[class*="bg-brand"]:hover,
a[class*="bg-amber"]:hover,
a[class*="bg-purple"]:hover {
  filter: brightness(1.05);
}
button:active,
a[class*="bg-brand"]:active,
a[class*="bg-amber"]:active,
a[class*="bg-purple"]:active {
  transform: translateY(1px) scale(.985);
}
.bg-brand {
  box-shadow:
    0 8px 24px rgba(249,115,22,.16),
    inset 0 1px 0 rgba(255,255,255,.18);
}

/* Room cards get semantic accents */
#salas .fx-card:nth-child(1):hover {
  border-color: rgba(52,211,153,.42);
  box-shadow: 0 22px 48px rgba(0,0,0,.32), 0 0 28px rgba(52,211,153,.07);
}
#salas .fx-card:nth-child(2):hover {
  border-color: rgba(96,165,250,.42);
  box-shadow: 0 22px 48px rgba(0,0,0,.32), 0 0 28px rgba(96,165,250,.07);
}
#salas .fx-card:nth-child(3):hover {
  border-color: rgba(251,191,36,.44);
  box-shadow: 0 22px 48px rgba(0,0,0,.32), 0 0 28px rgba(251,191,36,.075);
}
#salas .fx-card:nth-child(4):hover {
  border-color: rgba(192,132,252,.44);
  box-shadow: 0 22px 48px rgba(0,0,0,.32), 0 0 28px rgba(192,132,252,.075);
}

/* Community page visual identity */
body.theme-community {
  background:
    radial-gradient(circle at 50% -8%, rgba(34,211,238,.065), transparent 31rem),
    linear-gradient(180deg, #0c0a09 0%, #0d1011 42%, #0c0a09 100%);
}
body.theme-community .section-heading .eyebrow,
body.theme-community main > header .eyebrow {
  color: var(--community);
  border-color: rgba(34,211,238,.16);
  background: rgba(34,211,238,.05);
}
body.theme-community .section-heading h1::after,
body.theme-community .section-heading h2::after {
  background: linear-gradient(90deg, var(--community), transparent);
  box-shadow: 0 0 12px rgba(34,211,238,.18);
}
body.theme-community main > header::before {
  background: radial-gradient(ellipse, rgba(34,211,238,.085), transparent 68%);
}
body.theme-community .fx-card:hover {
  border-color: rgba(34,211,238,.32);
  box-shadow: 0 22px 52px rgba(0,0,0,.34), 0 0 28px rgba(34,211,238,.055);
}

/* Compadre page identity */
body.theme-compadre {
  background:
    radial-gradient(circle at 50% -8%, rgba(251,191,36,.075), transparent 31rem),
    linear-gradient(180deg, #0c0a09 0%, #110f0a 42%, #0c0a09 100%);
}
body.theme-compadre .section-heading .eyebrow,
body.theme-compadre main > header .eyebrow {
  color: var(--compadre);
  border-color: rgba(251,191,36,.17);
  background: rgba(251,191,36,.055);
}
body.theme-compadre .section-heading h1::after,
body.theme-compadre .section-heading h2::after {
  background: linear-gradient(90deg, var(--compadre), transparent);
  box-shadow: 0 0 14px rgba(251,191,36,.18);
}
body.theme-compadre main > header::before {
  background: radial-gradient(ellipse, rgba(251,191,36,.10), transparent 68%);
}
body.theme-compadre .fx-card:hover {
  border-color: rgba(251,191,36,.34);
  box-shadow: 0 22px 52px rgba(0,0,0,.34), 0 0 30px rgba(251,191,36,.065);
}

/* Community live metrics */
#pulse-total-users,
#pulse-active-rooms,
#usuarios-online-total {
  text-shadow: 0 0 20px rgba(34,211,238,.14);
}
#pulse-top-channel {
  text-shadow: 0 0 18px rgba(249,115,22,.16);
}

/* Compadre metrics & season */
#compadre-jugadores,
#compadre-trivias,
#compadre-mensajes {
  text-shadow: 0 0 18px rgba(251,191,36,.12);
}
#season-ranking,
#compadre-ranking-list {
  position: relative;
}
#season-ranking::before,
#compadre-ranking-list::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 1px 0 rgba(251,191,36,.035);
}

/* Zodiac */
#horoscopo button {
  min-height: 4.15rem;
}
#horoscopo button i {
  transition: transform .25s ease, filter .25s ease;
}
#horoscopo button:hover i {
  transform: translateY(-2px) scale(1.12);
  filter: drop-shadow(0 0 7px rgba(249,115,22,.28));
}

/* Staff */
#staff-grid .fx-card {
  background:
    linear-gradient(145deg, rgba(35,31,29,.76), rgba(15,13,12,.78));
}
#staff-grid .fx-card:hover .avatar-orbit {
  filter: brightness(1.08);
}

/* IRC command cards */
#ayuda code {
  display: inline-flex;
  align-items: center;
  margin-top: .35rem;
  padding: .22rem .45rem;
  border-radius: .45rem;
  background: rgba(12,10,9,.65);
  border: 1px solid rgba(120,113,108,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
#ayuda article:hover code {
  border-color: rgba(249,115,22,.26);
}

/* NEWS ticker */
.news-label {
  background:
    linear-gradient(180deg, rgba(20,17,15,.98), rgba(12,10,9,.98));
  text-shadow: 0 0 10px rgba(249,115,22,.20);
}
.news-label i {
  animation: newsPulse 2.6s ease-in-out infinite;
}
@keyframes newsPulse {
  0%,100% { transform: scale(1); opacity: .75; }
  50% { transform: scale(1.12); opacity: 1; }
}
.news-track {
  position: relative;
}
.news-track::before,
.news-track::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 2.5rem;
  z-index: 1;
  pointer-events: none;
}
.news-track::before {
  left: 0;
  background: linear-gradient(90deg, #f97316, transparent);
  opacity: .24;
}
.news-track::after {
  right: 0;
  background: linear-gradient(270deg, #f97316, transparent);
  opacity: .18;
}

/* Floating radio */
.fixed.bottom-4.right-4 {
  box-shadow:
    0 16px 42px rgba(0,0,0,.38),
    0 0 24px rgba(249,115,22,.065),
    inset 0 1px 0 rgba(255,255,255,.03);
}
#radio-toggle-btn {
  box-shadow:
    0 0 0 0 rgba(249,115,22,.22),
    0 8px 20px rgba(249,115,22,.20);
}
#radio-status.bg-emerald-500 {
  box-shadow: 0 0 12px rgba(16,185,129,.55);
}

/* Modal polish */
#modal-chat > div,
#modal-znc > div {
  box-shadow:
    0 30px 90px rgba(0,0,0,.55),
    0 0 35px rgba(249,115,22,.06);
}

/* Smooth selection */
::selection {
  background: rgba(249,115,22,.88);
  color: #fff;
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .news-label i { animation: none !important; }
}


/* =========================================================
   V6.6 — COLORFUL NIGHT
   Paleta visual. APIs y lógica permanecen intactas.
   ========================================================= */
:root {
  --cn-bg: #0B1026;
  --cn-bg-2: #101735;
  --cn-surface: #141B3D;
  --cn-surface-2: #1B2452;
  --cn-text: #F8FAFC;
  --cn-muted: #A5B4D4;
  --cn-coral: #FF6B6B;
  --cn-turquoise: #22D3C5;
  --cn-sky: #38BDF8;
  --cn-mango: #FBBF24;
  --cn-violet: #A78BFA;
  --cn-pink: #F472B6;
  --cn-blue: #60A5FA;
  --cn-mint: #34D399;
  --cn-security: #FB7185;
}

html { background: var(--cn-bg); }
body,
body.theme-home,
body.theme-community,
body.theme-compadre {
  color: var(--cn-text);
  background:
    radial-gradient(circle at 10% 8%, rgba(255,107,107,.17), transparent 24rem),
    radial-gradient(circle at 88% 14%, rgba(56,189,248,.14), transparent 26rem),
    radial-gradient(circle at 14% 72%, rgba(34,211,197,.10), transparent 28rem),
    radial-gradient(circle at 86% 70%, rgba(167,139,250,.12), transparent 27rem),
    linear-gradient(180deg, var(--cn-bg) 0%, #0D1430 45%, #0A1028 100%) !important;
  background-attachment: fixed !important;
}

/* Reinterpret Tailwind stone palette as indigo-night surfaces. */
.bg-stone-950 { background-color: var(--cn-bg) !important; }
.bg-stone-900 { background-color: var(--cn-surface) !important; }
.bg-stone-800 { background-color: var(--cn-surface-2) !important; }
[class*="bg-stone-950/"] { background-color: rgba(11,16,38,.78) !important; }
[class*="bg-stone-900/"] { background-color: rgba(20,27,61,.82) !important; }
[class*="bg-stone-800/"] { background-color: rgba(27,36,82,.76) !important; }
.text-stone-300 { color: #DCE5FF !important; }
.text-stone-400 { color: #B7C5E7 !important; }
.text-stone-500 { color: var(--cn-muted) !important; }
.text-stone-600 { color: #7887B2 !important; }
.border-stone-800 { border-color: rgba(105,120,176,.22) !important; }
.border-stone-700 { border-color: rgba(121,137,196,.28) !important; }

/* Ambient aurora layer */
.page-glow::before {
  position: fixed !important;
  background:
    radial-gradient(circle at 18% 12%, rgba(255,107,107,.14), transparent 25rem),
    radial-gradient(circle at 80% 20%, rgba(56,189,248,.11), transparent 27rem),
    radial-gradient(circle at 24% 78%, rgba(34,211,197,.07), transparent 28rem),
    radial-gradient(circle at 78% 74%, rgba(167,139,250,.09), transparent 28rem) !important;
  filter: saturate(1.28) blur(1px);
}

/* Navbar */
nav {
  background: rgba(11,16,38,.82) !important;
  border-color: rgba(96,165,250,.14) !important;
  box-shadow: 0 14px 34px rgba(4,7,22,.34), inset 0 -1px 0 rgba(255,255,255,.025) !important;
}
nav::after {
  background: linear-gradient(90deg, transparent, var(--cn-coral), var(--cn-pink), var(--cn-violet), var(--cn-sky), transparent) !important;
  opacity: .38;
}
nav a:not(:first-child)::after {
  background: linear-gradient(90deg,var(--cn-coral),var(--cn-pink),var(--cn-violet)) !important;
}
nav .text-brand { color: var(--cn-coral) !important; }

/* Hero colorful aurora */
main > header::before {
  width: min(58rem,94vw) !important;
  height: 25rem !important;
  background:
    radial-gradient(circle at 30% 48%, rgba(255,107,107,.16), transparent 34%),
    radial-gradient(circle at 58% 45%, rgba(244,114,182,.11), transparent 34%),
    radial-gradient(circle at 76% 48%, rgba(56,189,248,.10), transparent 32%) !important;
  filter: blur(12px) !important;
}
main > header h1 {
  text-shadow: 0 0 28px rgba(244,114,182,.11), 0 18px 42px rgba(4,7,22,.40) !important;
}

/* Section headings: white title + section-specific eyebrow/underline */
.section-heading h1,
.section-heading h2 { color: var(--cn-text) !important; }
.section-heading .eyebrow {
  color: var(--cn-coral) !important;
  border-color: rgba(255,107,107,.22) !important;
  background: rgba(255,107,107,.075) !important;
}
.section-heading h1::after,
.section-heading h2::after {
  background: linear-gradient(90deg,var(--cn-coral),var(--cn-pink),var(--cn-violet),transparent) !important;
  box-shadow: 0 0 14px rgba(244,114,182,.22) !important;
}

/* Section color signatures */
#salas .section-heading .eyebrow { color: var(--cn-turquoise)!important; border-color:rgba(34,211,197,.22)!important; background:rgba(34,211,197,.07)!important; }
#salas .section-heading h2::after { background:linear-gradient(90deg,var(--cn-turquoise),var(--cn-sky),transparent)!important; }
#eventos .section-heading .eyebrow { color:var(--cn-pink)!important; border-color:rgba(244,114,182,.23)!important; background:rgba(244,114,182,.07)!important; }
#eventos .section-heading h2::after { background:linear-gradient(90deg,var(--cn-pink),var(--cn-violet),transparent)!important; }
#horoscopo .section-heading .eyebrow { color:var(--cn-violet)!important; border-color:rgba(167,139,250,.24)!important; background:rgba(167,139,250,.075)!important; }
#horoscopo .section-heading h2::after { background:linear-gradient(90deg,var(--cn-violet),var(--cn-pink),transparent)!important; }
#colaboradores .section-heading .eyebrow { color:var(--cn-blue)!important; border-color:rgba(96,165,250,.24)!important; background:rgba(96,165,250,.07)!important; }
#colaboradores .section-heading h2::after { background:linear-gradient(90deg,var(--cn-blue),var(--cn-sky),transparent)!important; }
#ayuda .section-heading .eyebrow { color:var(--cn-mint)!important; border-color:rgba(52,211,153,.24)!important; background:rgba(52,211,153,.07)!important; }
#ayuda .section-heading h2::after { background:linear-gradient(90deg,var(--cn-mint),var(--cn-turquoise),transparent)!important; }

/* Luminous section separators */
.section-air.border-t::before {
  background: linear-gradient(90deg,transparent,rgba(56,189,248,.15),rgba(244,114,182,.26),rgba(167,139,250,.20),transparent) !important;
}
.section-air.border-t::after {
  background: radial-gradient(ellipse,rgba(244,114,182,.34),transparent 70%) !important;
}

/* Core cards */
.card-soft,
.fx-card {
  background:
    linear-gradient(145deg, rgba(27,36,82,.82), rgba(16,23,53,.86)) !important;
  border-color: rgba(123,139,201,.22) !important;
  box-shadow: 0 16px 38px rgba(3,6,24,.30), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.fx-card::after {
  background: linear-gradient(120deg,rgba(255,255,255,.035),transparent 30%,transparent 68%,rgba(167,139,250,.035)) !important;
}
.fx-card:hover {
  border-color: rgba(244,114,182,.38) !important;
  box-shadow: 0 24px 54px rgba(3,6,24,.38), 0 0 30px rgba(167,139,250,.09), inset 0 1px 0 rgba(255,255,255,.055) !important;
}

/* Home feature cards */
a[href="comunidad.html"].fx-card {
  background: linear-gradient(145deg,rgba(34,211,197,.12),rgba(20,27,61,.90) 42%,rgba(16,23,53,.94)) !important;
  border-color: rgba(34,211,197,.21) !important;
}
a[href="comunidad.html"].fx-card:hover { border-color:rgba(34,211,197,.46)!important; box-shadow:0 24px 54px rgba(3,6,24,.38),0 0 34px rgba(34,211,197,.11)!important; }
a[href="compadre.html"].fx-card {
  background: linear-gradient(145deg,rgba(251,191,36,.13),rgba(20,27,61,.90) 42%,rgba(16,23,53,.94)) !important;
  border-color: rgba(251,191,36,.22) !important;
}
a[href="compadre.html"].fx-card:hover { border-color:rgba(251,191,36,.48)!important; box-shadow:0 24px 54px rgba(3,6,24,.38),0 0 34px rgba(251,191,36,.10)!important; }

/* Room cards: colorful tint is visible even before hover */
#salas .fx-card:nth-child(1) { background:linear-gradient(145deg,rgba(52,211,153,.13),rgba(20,27,61,.90) 44%,rgba(16,23,53,.94))!important; border-color:rgba(52,211,153,.22)!important; }
#salas .fx-card:nth-child(2) { background:linear-gradient(145deg,rgba(56,189,248,.14),rgba(20,27,61,.90) 44%,rgba(16,23,53,.94))!important; border-color:rgba(56,189,248,.23)!important; }
#salas .fx-card:nth-child(3) { background:linear-gradient(145deg,rgba(251,191,36,.14),rgba(20,27,61,.90) 44%,rgba(16,23,53,.94))!important; border-color:rgba(251,191,36,.23)!important; }
#salas .fx-card:nth-child(4) { background:linear-gradient(145deg,rgba(167,139,250,.15),rgba(20,27,61,.90) 44%,rgba(16,23,53,.94))!important; border-color:rgba(167,139,250,.24)!important; }

/* Events */
#eventos article:nth-child(1) { background:linear-gradient(145deg,rgba(251,191,36,.12),rgba(20,27,61,.91))!important; }
#eventos article:nth-child(2) { background:linear-gradient(145deg,rgba(192,132,252,.13),rgba(20,27,61,.91))!important; }

/* Horoscope rainbow sequence */
#horoscopo button:nth-child(6n+1) { border-color:rgba(255,107,107,.24)!important; background:linear-gradient(145deg,rgba(255,107,107,.10),rgba(20,27,61,.90))!important; }
#horoscopo button:nth-child(6n+2) { border-color:rgba(34,211,197,.24)!important; background:linear-gradient(145deg,rgba(34,211,197,.10),rgba(20,27,61,.90))!important; }
#horoscopo button:nth-child(6n+3) { border-color:rgba(56,189,248,.24)!important; background:linear-gradient(145deg,rgba(56,189,248,.10),rgba(20,27,61,.90))!important; }
#horoscopo button:nth-child(6n+4) { border-color:rgba(251,191,36,.24)!important; background:linear-gradient(145deg,rgba(251,191,36,.10),rgba(20,27,61,.90))!important; }
#horoscopo button:nth-child(6n+5) { border-color:rgba(167,139,250,.24)!important; background:linear-gradient(145deg,rgba(167,139,250,.10),rgba(20,27,61,.90))!important; }
#horoscopo button:nth-child(6n) { border-color:rgba(244,114,182,.24)!important; background:linear-gradient(145deg,rgba(244,114,182,.10),rgba(20,27,61,.90))!important; }

/* Staff role colors, by position: Founder / Operador / Security Bot */
#staff-grid .fx-card:nth-child(1) { background:linear-gradient(145deg,rgba(255,107,107,.12),rgba(20,27,61,.91))!important; border-color:rgba(255,107,107,.24)!important; }
#staff-grid .fx-card:nth-child(2) { background:linear-gradient(145deg,rgba(96,165,250,.12),rgba(20,27,61,.91))!important; border-color:rgba(96,165,250,.24)!important; }
#staff-grid .fx-card:nth-child(3) { background:linear-gradient(145deg,rgba(251,113,133,.12),rgba(20,27,61,.91))!important; border-color:rgba(251,113,133,.24)!important; }

/* IRC help cards */
#ayuda article { background:linear-gradient(145deg,rgba(52,211,153,.07),rgba(20,27,61,.91))!important; }
#ayuda code { background:rgba(7,12,34,.72)!important; border-color:rgba(96,165,250,.20)!important; color:#E8F2FF; }

/* Colorful Night Community page */
body.theme-community {
  background:
    radial-gradient(circle at 12% 10%,rgba(34,211,197,.17),transparent 25rem),
    radial-gradient(circle at 88% 16%,rgba(56,189,248,.16),transparent 26rem),
    radial-gradient(circle at 80% 76%,rgba(96,165,250,.09),transparent 29rem),
    linear-gradient(180deg,var(--cn-bg),#0B1830 48%,var(--cn-bg)) !important;
}
body.theme-community .section-heading .eyebrow,
body.theme-community main > header .eyebrow { color:var(--cn-turquoise)!important; border-color:rgba(34,211,197,.24)!important; background:rgba(34,211,197,.07)!important; }
body.theme-community .section-heading h1::after,
body.theme-community .section-heading h2::after { background:linear-gradient(90deg,var(--cn-turquoise),var(--cn-sky),transparent)!important; }
body.theme-community .card-soft,
body.theme-community .fx-card { background:linear-gradient(145deg,rgba(21,57,78,.46),rgba(20,27,61,.90))!important; border-color:rgba(34,211,197,.18)!important; }
body.theme-community .fx-card:hover { border-color:rgba(34,211,197,.42)!important; box-shadow:0 24px 54px rgba(3,6,24,.38),0 0 34px rgba(34,211,197,.09)!important; }

/* Colorful Night Compadre page */
body.theme-compadre {
  background:
    radial-gradient(circle at 12% 10%,rgba(251,191,36,.16),transparent 25rem),
    radial-gradient(circle at 86% 16%,rgba(255,107,107,.12),transparent 27rem),
    radial-gradient(circle at 78% 78%,rgba(244,114,182,.08),transparent 29rem),
    linear-gradient(180deg,var(--cn-bg),#15162E 48%,var(--cn-bg)) !important;
}
body.theme-compadre .section-heading .eyebrow,
body.theme-compadre main > header .eyebrow { color:var(--cn-mango)!important; border-color:rgba(251,191,36,.24)!important; background:rgba(251,191,36,.07)!important; }
body.theme-compadre .section-heading h1::after,
body.theme-compadre .section-heading h2::after { background:linear-gradient(90deg,var(--cn-mango),var(--cn-coral),var(--cn-pink),transparent)!important; }
body.theme-compadre .card-soft,
body.theme-compadre .fx-card { background:linear-gradient(145deg,rgba(65,48,36,.38),rgba(20,27,61,.91))!important; border-color:rgba(251,191,36,.18)!important; }
body.theme-compadre .fx-card:hover { border-color:rgba(251,191,36,.43)!important; box-shadow:0 24px 54px rgba(3,6,24,.38),0 0 34px rgba(251,191,36,.09)!important; }

/* Stats and bars gain a little more luminous contrast */
#pulse-total-users,#pulse-active-rooms,#usuarios-online-total { color:#D8FFFA!important; text-shadow:0 0 18px rgba(34,211,197,.18)!important; }
#pulse-top-channel { color:#8BE8FF!important; text-shadow:0 0 16px rgba(56,189,248,.20)!important; }
#compadre-jugadores,#compadre-trivias,#compadre-mensajes { color:#FFF0A8!important; text-shadow:0 0 18px rgba(251,191,36,.18)!important; }

/* NEWS: animated coral → pink → violet → sky gradient */
.news-ticker {
  background: linear-gradient(90deg,var(--cn-coral),var(--cn-pink),var(--cn-violet),var(--cn-sky),var(--cn-turquoise),var(--cn-coral)) !important;
  background-size: 250% 100% !important;
  animation: colorfulNews 14s linear infinite;
  color: #081028 !important;
  box-shadow:0 6px 22px rgba(3,6,24,.24);
}
@keyframes colorfulNews { to { background-position:250% 0; } }
.news-label {
  background:rgba(11,16,38,.96)!important;
  color:#FF8A8A!important;
  border-right-color:rgba(255,255,255,.12)!important;
  box-shadow:8px 0 22px rgba(3,6,24,.42)!important;
}
.news-track::before { background:linear-gradient(90deg,rgba(255,107,107,.88),transparent)!important; opacity:.22!important; }
.news-track::after { background:linear-gradient(270deg,rgba(34,211,197,.80),transparent)!important; opacity:.18!important; }

/* Radio */
.fixed.bottom-4.right-4 {
  background:linear-gradient(145deg,rgba(27,36,82,.94),rgba(11,16,38,.96))!important;
  border-color:rgba(244,114,182,.21)!important;
  box-shadow:0 18px 46px rgba(3,6,24,.44),0 0 26px rgba(167,139,250,.10),inset 0 1px 0 rgba(255,255,255,.04)!important;
}
#radio-toggle-btn {
  background:linear-gradient(135deg,var(--cn-coral),var(--cn-pink))!important;
  box-shadow:0 8px 22px rgba(244,114,182,.24),0 0 18px rgba(255,107,107,.16)!important;
}

/* Modal surfaces */
#modal-chat > div,#modal-znc > div {
  background:linear-gradient(145deg,rgba(27,36,82,.97),rgba(11,16,38,.98))!important;
  border-color:rgba(96,165,250,.24)!important;
  box-shadow:0 32px 96px rgba(3,6,24,.62),0 0 40px rgba(167,139,250,.08)!important;
}

/* Scrollbar follows palette */
::-webkit-scrollbar-track { background:var(--cn-bg)!important; }
::-webkit-scrollbar-thumb { background:#46558D!important; }
::-webkit-scrollbar-thumb:hover { background:linear-gradient(var(--cn-coral),var(--cn-violet))!important; }
::selection { background:var(--cn-pink)!important; color:#071027!important; }

@media (prefers-reduced-motion: reduce) {
  .news-ticker { animation:none!important; }
}


/* V6.6.1 — Podio: permitir que el badge LÍDER sobresalga sin recortarse */
.podium-card {
  overflow: visible !important;
}
.podium-card::before,
.podium-card::after {
  border-radius: inherit;
}
.podium-card > span.absolute {
  z-index: 5;
  box-shadow:
    0 6px 16px rgba(0,0,0,.30),
    0 0 14px rgba(251,191,36,.18);
  white-space: nowrap;
}


/* ===== V6.7 — Radio page ===== */
body.theme-radio {
  background:
    radial-gradient(circle at 50% -8%, rgba(192,132,252,.085), transparent 31rem),
    radial-gradient(circle at 18% 45%, rgba(244,114,182,.045), transparent 25rem),
    linear-gradient(180deg, #0b1026 0%, #130f24 45%, #0b1026 100%);
}
body.theme-radio main > header::before {
  background: radial-gradient(ellipse, rgba(192,132,252,.11), transparent 68%);
}
body.theme-radio .section-heading .eyebrow {
  color: #c084fc;
  border-color: rgba(192,132,252,.18);
  background: rgba(192,132,252,.055);
}
body.theme-radio .section-heading h1::after,
body.theme-radio .section-heading h2::after {
  background: linear-gradient(90deg, #c084fc, #f472b6, transparent);
  box-shadow: 0 0 14px rgba(192,132,252,.20);
}
.radio-hero-card {
  background:
    linear-gradient(145deg, rgba(126,34,206,.18), rgba(17,24,39,.84) 52%, rgba(236,72,153,.10));
  border: 1px solid rgba(192,132,252,.25);
  box-shadow:
    0 24px 60px rgba(0,0,0,.34),
    0 0 36px rgba(192,132,252,.08),
    inset 0 1px 0 rgba(255,255,255,.035);
}
.radio-disc {
  position: relative;
  width: 7rem;
  height: 7rem;
  border-radius: 999px;
  background:
    radial-gradient(circle at center, #0f172a 0 13%, #c084fc 14% 17%, #111827 18% 25%, #1f2937 26% 100%);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04),
    0 18px 36px rgba(0,0,0,.35),
    0 0 28px rgba(192,132,252,.14);
}
.radio-disc.is-playing {
  animation: radioSpin 5.5s linear infinite;
}
.radio-disc::after {
  content:"";
  position:absolute;
  inset:1rem;
  border-radius:inherit;
  border:1px solid rgba(255,255,255,.035);
  box-shadow:0 0 0 7px rgba(255,255,255,.012),0 0 0 14px rgba(255,255,255,.01);
}
@keyframes radioSpin { to { transform: rotate(360deg); } }

.radio-main-btn {
  box-shadow:
    0 12px 30px rgba(192,132,252,.18),
    inset 0 1px 0 rgba(255,255,255,.15);
}
.radio-eq {
  display:flex;
  align-items:flex-end;
  gap:.22rem;
  height:1.4rem;
}
.radio-eq span {
  width:.22rem;
  height:.4rem;
  border-radius:999px;
  background:linear-gradient(180deg,#f472b6,#c084fc);
  animation:eqBounce .9s ease-in-out infinite alternate;
  animation-play-state:paused;
}
.radio-eq.is-playing span { animation-play-state:running; }
.radio-eq span:nth-child(2){animation-delay:.12s}
.radio-eq span:nth-child(3){animation-delay:.22s}
.radio-eq span:nth-child(4){animation-delay:.08s}
.radio-eq span:nth-child(5){animation-delay:.28s}
@keyframes eqBounce { to { height:1.35rem; } }


/* ===== V6.8 — Radio metadata, cover & history ===== */
.radio-cover-shell {
  position: relative;
  width: 11rem;
  height: 11rem;
  display: grid;
  place-items: center;
}
.radio-disc-backdrop {
  position: absolute;
  width: 9.5rem;
  height: 9.5rem;
  right: -.85rem;
  top: .75rem;
  opacity: .72;
  filter: saturate(.9);
}
.radio-cover-frame {
  position: relative;
  z-index: 2;
  width: 8.6rem;
  height: 8.6rem;
  overflow: hidden;
  border-radius: 1.5rem;
  border: 1px solid rgba(192,132,252,.28);
  background: #111827;
  box-shadow:
    0 22px 42px rgba(0,0,0,.38),
    0 0 32px rgba(192,132,252,.11),
    inset 0 1px 0 rgba(255,255,255,.05);
  transform: rotate(-2deg);
  transition: transform .3s ease, box-shadow .3s ease;
}
.radio-hero-card:hover .radio-cover-frame {
  transform: rotate(0deg) translateY(-3px);
  box-shadow:
    0 28px 52px rgba(0,0,0,.42),
    0 0 38px rgba(244,114,182,.13);
}
.radio-info-chip {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .72rem .8rem;
  border-radius: 1rem;
  border: 1px solid rgba(148,163,184,.10);
  background: rgba(15,23,42,.46);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.radio-history-item {
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.radio-history-item:hover {
  transform: translateX(4px);
  border-color: rgba(192,132,252,.28);
  box-shadow: 0 14px 34px rgba(0,0,0,.25), 0 0 20px rgba(192,132,252,.045);
}


/* ===== V6.8.1 — WebChat fullscreen / mobile-first ===== */
#modal-chat {
  padding: 0 !important;
  background: #070b18;
}
.webchat-shell {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  background: #070b18;
}
.webchat-frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}
.webchat-close {
  position: absolute;
  z-index: 5;
  top: max(.55rem, env(safe-area-inset-top));
  right: max(.55rem, env(safe-area-inset-right));
  width: 2.65rem;
  height: 2.65rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: rgba(7,11,24,.76);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 8px 24px rgba(0,0,0,.34);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .18s ease, background .18s ease, opacity .18s ease;
}
.webchat-close:hover {
  transform: scale(1.06);
  background: rgba(255,107,107,.92);
}
.webchat-close:active {
  transform: scale(.94);
}
@media (max-width: 640px) {
  .webchat-close {
    top: max(.35rem, env(safe-area-inset-top));
    right: max(.35rem, env(safe-area-inset-right));
    width: 2.35rem;
    height: 2.35rem;
    font-size: .9rem;
    opacity: .82;
  }
}


/* ===== V6.9 — Expansion pages ===== */
body.theme-events {
  background:
    radial-gradient(circle at 50% -8%, rgba(244,114,182,.085), transparent 31rem),
    linear-gradient(180deg,#0b1026 0%,#160e21 45%,#0b1026 100%);
}
body.theme-events .section-heading .eyebrow{color:#f472b6;border-color:rgba(244,114,182,.18);background:rgba(244,114,182,.055)}
body.theme-events .section-heading h1::after,body.theme-events .section-heading h2::after{background:linear-gradient(90deg,#f472b6,#c084fc,transparent)}
body.theme-events main>header::before{background:radial-gradient(ellipse,rgba(244,114,182,.10),transparent 68%)}

.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.45rem}
.calendar-head{text-align:center;font-size:.62rem;color:#78716c;font-family:'Orbitron',sans-serif;text-transform:uppercase;padding:.4rem}
.calendar-day{min-height:4.4rem;border:1px solid rgba(120,113,108,.12);background:rgba(15,23,42,.30);border-radius:.9rem;padding:.55rem;font-size:.72rem;color:#d6d3d1}
.calendar-day.muted{opacity:.28}.calendar-day.has-event{display:flex;flex-direction:column;justify-content:space-between}.calendar-day span{font-size:.55rem;text-transform:uppercase;font-family:'Orbitron',sans-serif}
.calendar-day.event-game{border-color:rgba(251,191,36,.22);background:rgba(251,191,36,.055)}.calendar-day.event-game span{color:#fbbf24}
.calendar-day.event-music{border-color:rgba(192,132,252,.22);background:rgba(192,132,252,.055)}.calendar-day.event-music span{color:#c084fc}
@media(max-width:640px){.calendar-day{min-height:3.2rem;padding:.35rem}.calendar-day span{display:none}.calendar-head{font-size:.52rem}}

body.theme-guide {
  background:
    radial-gradient(circle at 50% -8%, rgba(52,211,153,.075), transparent 31rem),
    linear-gradient(180deg,#0b1026 0%,#0b1719 45%,#0b1026 100%);
}
body.theme-guide .section-heading .eyebrow{color:#34d399;border-color:rgba(52,211,153,.18);background:rgba(52,211,153,.055)}
body.theme-guide .section-heading h1::after,body.theme-guide .section-heading h2::after{background:linear-gradient(90deg,#34d399,#22d3ee,transparent)}
body.theme-guide main>header::before{background:radial-gradient(ellipse,rgba(52,211,153,.09),transparent 68%)}
body.theme-guide code{display:inline-flex;padding:.28rem .48rem;border-radius:.5rem;background:rgba(15,23,42,.58);border:1px solid rgba(148,163,184,.12)}

body.theme-rooms {
  background:
    radial-gradient(circle at 50% -8%, rgba(255,107,107,.07), transparent 31rem),
    linear-gradient(180deg,#0b1026 0%,#0f132b 45%,#0b1026 100%);
}
.room-detail{background:linear-gradient(145deg,rgba(30,41,59,.64),rgba(15,23,42,.72));border:1px solid rgba(148,163,184,.12);box-shadow:0 18px 44px rgba(0,0,0,.26)}
.room-chateando{border-color:rgba(52,211,153,.20)}.room-latinos{border-color:rgba(96,165,250,.20)}.room-gamez{border-color:rgba(251,191,36,.20)}.room-musica{border-color:rgba(192,132,252,.20)}
.room-chip{display:inline-flex;padding:.28rem .55rem;border-radius:999px;background:rgba(15,23,42,.55);border:1px solid rgba(148,163,184,.12);font-size:.6rem;color:#a8a29e;font-family:'Orbitron',sans-serif;text-transform:uppercase}


/* ===== V6.10 compact cards ===== */
.room-card {
  min-height: 100%;
}
.room-card:hover {
  transform: translateY(-5px);
}
.guide-card {
  min-height: 10.5rem;
}
.guide-card h3 {
  font-size: .95rem;
}
.guide-card p {
  line-height: 1.35rem;
}
#staff-grid img {
  background: rgba(15,23,42,.78);
}


/* ===== V6.11 — Salas: 3-column directory + living hero ===== */
.rooms-hero {
  position: relative;
  min-height: 34rem;
  padding-top: 4.25rem;
  padding-bottom: 4.5rem;
  overflow: hidden;
  isolation: isolate;
}
.rooms-hero-content { position: relative; z-index: 3; }
.rooms-hero-grid {
  position: absolute; inset: 0; z-index: -3; opacity: .22;
  background-image:
    linear-gradient(rgba(148,163,184,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,163,184,.07) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, black 15%, transparent 92%);
}
.rooms-hero-orb {
  position: absolute; border-radius: 999px; filter: blur(70px);
  opacity: .24; z-index: -2; pointer-events: none;
  animation: roomsOrb 9s ease-in-out infinite alternate;
}
.rooms-hero-orb-a { width: 22rem; height: 22rem; background: #22d3ee; left: -7rem; top: 1rem; }
.rooms-hero-orb-b { width: 24rem; height: 24rem; background: #a855f7; right: -8rem; top: 4rem; animation-delay: -3s; }
@keyframes roomsOrb { to { transform: translate3d(2rem,1.5rem,0) scale(1.12); } }

.rooms-back-link {
  position: absolute; left: 0; top: -2.5rem;
  display: inline-flex; align-items: center; gap: .5rem;
  color: #78716c; font-size: .72rem; transition: color .2s ease;
}
.rooms-back-link:hover { color: #fff; }

.rooms-live-pill {
  width: max-content; max-width: 100%; margin: 0 auto 1.35rem;
  display: flex; align-items: center; gap: .55rem;
  padding: .48rem .75rem; border-radius: 999px;
  border: 1px solid rgba(52,211,153,.18);
  background: rgba(6,78,59,.12); color: #a7f3d0;
  font: 700 .58rem 'Orbitron',sans-serif; letter-spacing: .08em;
  box-shadow: 0 0 28px rgba(52,211,153,.06);
}
.rooms-live-dot {
  width: .45rem; height: .45rem; border-radius: 50%; background: #34d399;
  box-shadow: 0 0 0 .22rem rgba(52,211,153,.12), 0 0 14px rgba(52,211,153,.7);
  animation: livePulse 1.6s ease-in-out infinite;
}
@keyframes livePulse { 50% { opacity:.5; transform:scale(.82); } }
.rooms-live-separator { width: 1px; height: .8rem; background: rgba(167,243,208,.22); }

.rooms-hero-title {
  margin-top: .8rem; font-family: 'Shadows Into Light',cursive;
  font-size: clamp(3.25rem,8vw,6.3rem); line-height: .88;
  letter-spacing: -.025em;
  text-shadow: 0 8px 40px rgba(0,0,0,.35);
}
.rooms-hero-title span {
  display: block;
  background: linear-gradient(90deg,#34d399,#22d3ee,#c084fc,#f472b6);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.rooms-hero-copy {
  max-width: 46rem; margin: 1.4rem auto 0; color: #a8a29e;
  font-size: .95rem; line-height: 1.75;
}
.rooms-hero-badges {
  display: flex; justify-content: center; flex-wrap: wrap; gap: .55rem; margin-top: 1.4rem;
}
.rooms-hero-badges span {
  display: inline-flex; align-items: center; gap: .42rem;
  padding: .45rem .68rem; border-radius: 999px;
  border: 1px solid rgba(148,163,184,.11); background: rgba(15,23,42,.48);
  color: #a8a29e; font-size: .66rem;
}
.rooms-hero-badges i { color: #67e8f9; }
.rooms-hero-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:.75rem; margin-top:1.7rem; }
.rooms-primary-action,.rooms-secondary-action {
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  padding:.78rem 1.05rem; border-radius:.9rem; font-size:.78rem; font-weight:700;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.rooms-primary-action {
  color:#07111a; background:linear-gradient(90deg,#34d399,#22d3ee);
  box-shadow:0 12px 30px rgba(34,211,238,.12);
}
.rooms-secondary-action { color:#d6d3d1; background:rgba(15,23,42,.56); border:1px solid rgba(148,163,184,.15); }
.rooms-primary-action:hover,.rooms-secondary-action:hover { transform:translateY(-2px); }

.rooms-floating-chips span {
  position:absolute; z-index:-1; padding:.38rem .58rem; border-radius:.7rem;
  border:1px solid rgba(148,163,184,.12); background:rgba(15,23,42,.46);
  color:rgba(214,211,209,.36); font:700 .58rem 'Orbitron',sans-serif;
  animation:floatRoom 5s ease-in-out infinite;
}
.rooms-floating-chips .chip-one { left:4%; top:36%; transform:rotate(-8deg); }
.rooms-floating-chips .chip-two { right:5%; top:28%; transform:rotate(7deg); animation-delay:-1s; }
.rooms-floating-chips .chip-three { left:8%; bottom:14%; transform:rotate(5deg); animation-delay:-2s; }
.rooms-floating-chips .chip-four { right:7%; bottom:13%; transform:rotate(-5deg); animation-delay:-3s; }
@keyframes floatRoom { 50% { margin-top:-8px; } }

.room-card { display:flex; flex-direction:column; }
.room-card p { flex:1; }
.room-enter-btn {
  color:#fff; background:rgba(30,41,59,.74); border:1px solid rgba(148,163,184,.14);
  transition:background .2s ease,border-color .2s ease,transform .2s ease;
}
.room-card:hover .room-enter-btn { background:rgba(51,65,85,.82); border-color:rgba(148,163,184,.26); }
.room-enter-btn:hover { transform:translateY(-1px); }
.room-accent-chateando { border-color:rgba(52,211,153,.18); }
.room-accent-latinos { border-color:rgba(96,165,250,.18); }
.room-accent-gamez { border-color:rgba(251,191,36,.18); }
.room-accent-mexico { border-color:rgba(74,222,128,.18); }
.room-accent-argentina { border-color:rgba(56,189,248,.18); }
.room-accent-colombia { border-color:rgba(250,204,21,.18); }
.room-accent-espana { border-color:rgba(248,113,113,.18); }
.room-accent-musica { border-color:rgba(192,132,252,.18); }

@media(max-width:768px){
  .rooms-hero { min-height:auto; padding-top:4.4rem; padding-bottom:3.4rem; }
  .rooms-back-link { top:-2.6rem; left:.2rem; }
  .rooms-floating-chips { display:none; }
  .rooms-hero-copy { font-size:.84rem; }
}


/* ===== V6.12 — Unified hero system ===== */
.site-hero {
  position:relative; min-height:32rem; padding-top:4.8rem; padding-bottom:4.8rem;
  overflow:hidden; isolation:isolate;
}
.site-hero-content{position:relative;z-index:3}
.site-hero-grid{
  position:absolute;inset:0;z-index:-3;opacity:.18;
  background-image:linear-gradient(rgba(148,163,184,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.07) 1px,transparent 1px);
  background-size:44px 44px;mask-image:linear-gradient(to bottom,black 8%,transparent 92%);
}
.site-hero-orb{position:absolute;border-radius:999px;filter:blur(72px);opacity:.24;z-index:-2;animation:siteHeroOrb 10s ease-in-out infinite alternate}
.site-hero-orb-a{width:22rem;height:22rem;left:-8rem;top:1rem}.site-hero-orb-b{width:24rem;height:24rem;right:-8rem;top:3rem;animation-delay:-3s}
@keyframes siteHeroOrb{to{transform:translate3d(2rem,1rem,0) scale(1.1)}}
.site-hero-kicker{
  width:max-content;max-width:100%;margin:0 auto 1.1rem;display:flex;align-items:center;gap:.5rem;padding:.46rem .72rem;border-radius:999px;
  font:800 .6rem 'Orbitron',sans-serif;letter-spacing:.11em;background:rgba(15,23,42,.5);border:1px solid rgba(148,163,184,.13);color:#d6d3d1
}
.site-hero-title{font-family:'Shadows Into Light',cursive;font-size:clamp(3.4rem,7.5vw,6.4rem);line-height:.9;letter-spacing:-.025em;text-shadow:0 12px 42px rgba(0,0,0,.34)}
.site-hero-title span{display:block;background:linear-gradient(90deg,#ff6b6b,#f472b6,#c084fc,#22d3ee);-webkit-background-clip:text;background-clip:text;color:transparent}
.site-hero-copy{max-width:47rem;margin:1.35rem auto 0;color:#a8a29e;font-size:.94rem;line-height:1.75}
.site-hero-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:.75rem;margin-top:1.7rem}
.site-hero-primary,.site-hero-secondary{display:inline-flex;align-items:center;justify-content:center;padding:.78rem 1.08rem;border-radius:.95rem;font-size:.78rem;font-weight:800;transition:.22s}
.site-hero-primary{background:linear-gradient(90deg,#ff6b6b,#f472b6);color:white;box-shadow:0 12px 30px rgba(244,114,182,.13)}
.site-hero-secondary{background:rgba(15,23,42,.58);border:1px solid rgba(148,163,184,.14);color:#e7e5e4}
.site-hero-primary:hover,.site-hero-secondary:hover{transform:translateY(-2px)}
.site-hero-chips{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;margin-top:1.3rem}
.site-hero-chips span{padding:.38rem .6rem;border-radius:999px;background:rgba(15,23,42,.45);border:1px solid rgba(148,163,184,.11);color:#a8a29e;font-size:.62rem}

/* Per-page hero colors */
.site-hero-home .site-hero-orb-a{background:#22d3ee}.site-hero-home .site-hero-orb-b{background:#f472b6}
.site-hero-community .site-hero-orb-a{background:#22d3ee}.site-hero-community .site-hero-orb-b{background:#34d399}
.site-hero-community .site-hero-title span{background:linear-gradient(90deg,#22d3ee,#34d399,#60a5fa);-webkit-background-clip:text;background-clip:text}
.site-hero-compadre .site-hero-orb-a{background:#fbbf24}.site-hero-compadre .site-hero-orb-b{background:#fb923c}
.site-hero-compadre .site-hero-title span{background:linear-gradient(90deg,#fbbf24,#fb923c,#f97316);-webkit-background-clip:text;background-clip:text}
.site-hero-radio .site-hero-orb-a{background:#c084fc}.site-hero-radio .site-hero-orb-b{background:#f472b6}
.site-hero-radio .site-hero-title span{background:linear-gradient(90deg,#c084fc,#f472b6,#60a5fa);-webkit-background-clip:text;background-clip:text}
.site-hero-events .site-hero-orb-a{background:#f472b6}.site-hero-events .site-hero-orb-b{background:#c084fc}
.site-hero-guide .site-hero-orb-a{background:#34d399}.site-hero-guide .site-hero-orb-b{background:#22d3ee}
.site-hero-guide .site-hero-title span{background:linear-gradient(90deg,#34d399,#22d3ee,#60a5fa);-webkit-background-clip:text;background-clip:text}
.site-hero-rooms .site-hero-orb-a{background:#22d3ee}.site-hero-rooms .site-hero-orb-b{background:#a855f7}
.site-hero-contact .site-hero-orb-a{background:#fb7185}.site-hero-contact .site-hero-orb-b{background:#c084fc}

.theme-contact{background:radial-gradient(circle at 50% -8%,rgba(251,113,133,.075),transparent 31rem),linear-gradient(180deg,#0b1026 0%,#160f1c 45%,#0b1026 100%)}
.contact-field{display:block}
.contact-field span{display:block;font:700 .62rem 'Orbitron',sans-serif;text-transform:uppercase;letter-spacing:.08em;color:#a8a29e;margin-bottom:.45rem}
.contact-field input,.contact-field select,.contact-field textarea{width:100%;border-radius:.85rem;border:1px solid rgba(148,163,184,.14);background:rgba(15,23,42,.62);padding:.78rem .9rem;color:#fff;outline:none;transition:border-color .2s ease,box-shadow .2s ease}
.contact-field input:focus,.contact-field select:focus,.contact-field textarea:focus{border-color:rgba(244,114,182,.42);box-shadow:0 0 0 3px rgba(244,114,182,.07)}

@media(max-width:768px){.site-hero{min-height:auto;padding-top:4rem;padding-bottom:3.5rem}.site-hero-copy{font-size:.84rem}}


/* ===== V6.13 — Contacto Formspree ===== */
.contact-success-card {
  position: relative;
  width: min(30rem, 100%);
  padding: 2rem;
  text-align: center;
  border-radius: 1.7rem;
  border: 1px solid rgba(52,211,153,.20);
  background:
    radial-gradient(circle at 50% 0%, rgba(52,211,153,.10), transparent 16rem),
    linear-gradient(145deg, rgba(30,41,59,.96), rgba(10,15,30,.97));
  box-shadow:
    0 30px 90px rgba(0,0,0,.55),
    0 0 38px rgba(52,211,153,.08),
    inset 0 1px 0 rgba(255,255,255,.04);
}
.contact-success-icon {
  width: 4.3rem;
  height: 4.3rem;
  margin: 0 auto 1.1rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #052e2b;
  font-size: 1.5rem;
  background: linear-gradient(135deg,#34d399,#22d3ee);
  box-shadow: 0 0 34px rgba(52,211,153,.18);
}
.contact-success-close {
  position: absolute;
  top: .8rem;
  right: .8rem;
  width: 2.2rem;
  height: 2.2rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #a8a29e;
  background: rgba(15,23,42,.54);
  border: 1px solid rgba(148,163,184,.12);
}
#contact-submit:disabled {
  filter: saturate(.7);
}
