:root{--bg:#050910;--bg2:#09111c;--panel:#0d1724;--panel2:#111e2e;--line:rgba(157,193,224,.15);--text:#eef5ff;--muted:#91a2b7;--gold:#d8aa53;--gold2:#ffd98b;--cyan:#43d9ff;--green:#42e599;--shadow:0 18px 50px rgba(0,0,0,.45)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 80% 10%,rgba(16,74,112,.18),transparent 28%),var(--bg);color:var(--text);font-family:Rajdhani,Arial,sans-serif;font-size:17px;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit}.wrap{width:min(1180px,calc(100% - 40px));margin:auto}.server-ticker{height:35px;background:#02050a;border-bottom:1px solid rgba(216,170,83,.25);overflow:hidden;display:flex;align-items:center;position:relative;z-index:50}.server-ticker:before,.server-ticker:after{content:"";position:absolute;top:0;width:80px;height:100%;z-index:2}.server-ticker:before{left:0;background:linear-gradient(90deg,#02050a,transparent)}.server-ticker:after{right:0;background:linear-gradient(-90deg,#02050a,transparent)}.ticker-track{display:flex;gap:48px;white-space:nowrap;min-width:max-content;animation:ticker 36s linear infinite;font-size:13px;letter-spacing:.8px;text-transform:uppercase;color:#9fb0c3}.ticker-track span{display:inline-flex;gap:6px}.ticker-track b{color:var(--gold2)}@keyframes ticker{to{transform:translateX(-50%)}}.site-header{height:82px;padding:0 max(24px,calc((100vw - 1180px)/2));display:flex;align-items:center;gap:35px;border-bottom:1px solid var(--line);background:rgba(5,9,16,.86);backdrop-filter:blur(16px);position:sticky;top:0;z-index:40}.brand{display:flex;align-items:center;gap:5px;font-family:Cinzel;font-weight:800;font-size:22px;letter-spacing:1px}.brand img{width:58px;height:58px;object-fit:contain}.brand em{font-style:normal;color:var(--gold)}.main-nav{display:flex;gap:26px;margin-left:auto}.main-nav a{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1.3px;color:#b7c5d6;transition:.2s}.main-nav a:hover{color:#fff}.nav-actions{display:flex;gap:10px}.btn{border:1px solid var(--line);padding:11px 20px;text-transform:uppercase;font-weight:700;letter-spacing:1px;font-size:13px;display:inline-flex;align-items:center;justify-content:center;transition:.25s}.btn:hover{transform:translateY(-2px)}.btn.gold{background:linear-gradient(135deg,#a8742c,var(--gold2));border-color:var(--gold2);color:#12100b;box-shadow:0 8px 28px rgba(216,170,83,.2)}.btn.ghost,.btn.glass{background:rgba(255,255,255,.035)}.btn.large{padding:15px 25px}.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:25px}.hero{min-height:780px;position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 35%,rgba(29,106,150,.25),transparent 32%),linear-gradient(180deg,#07111d 0%,#06101a 55%,#050910 100%)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,9,16,.4),transparent 30%,transparent 70%,rgba(5,9,16,.4)),repeating-linear-gradient(90deg,transparent 0 119px,rgba(255,255,255,.018) 120px),repeating-linear-gradient(0deg,transparent 0 119px,rgba(255,255,255,.018) 120px);mask-image:linear-gradient(to bottom,black,transparent 95%)}.hero-content{position:relative;z-index:4;text-align:center;max-width:780px;padding:50px 20px}.hero-logo{width:130px;height:130px;object-fit:contain;filter:drop-shadow(0 0 25px rgba(74,203,255,.25));margin-bottom:-20px}.eyebrow{display:block;color:var(--gold2);font-weight:700;letter-spacing:4px;font-size:12px;text-transform:uppercase;margin-bottom:12px}.hero h1,.section h2{font-family:Cinzel;margin:0}.hero h1{font-size:clamp(42px,6vw,82px);line-height:.98;text-shadow:0 8px 35px #000}.hero h1 strong{color:var(--gold2)}.hero-content>p{max-width:650px;margin:24px auto;color:#b7c4d2;font-size:19px;line-height:1.6}.hero-buttons{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.hero-meta{display:flex;justify-content:center;gap:28px;margin-top:28px;color:#93a5b9;font-size:14px}.online-dot{width:8px;height:8px;background:var(--green);border-radius:50%;display:inline-block;margin-right:8px;box-shadow:0 0 12px var(--green)}.hero-char{position:absolute;bottom:0;height:68%;max-width:36vw;object-fit:contain;filter:drop-shadow(0 20px 35px #000);opacity:.8;z-index:2}.hero-char-left{left:-1%;transform:scaleX(-1)}.hero-char-right{right:-1%}.hero-orb{position:absolute;border-radius:50%;filter:blur(2px);opacity:.35}.orb-one{width:320px;height:320px;background:#074b79;left:8%;top:16%;box-shadow:0 0 120px #0e7eb8}.orb-two{width:260px;height:260px;background:#7d4d11;right:9%;top:22%;box-shadow:0 0 110px #a56a1b}.scroll-cue{position:absolute;bottom:24px;z-index:5;font-size:10px;letter-spacing:2px;color:#8192a5}.section{padding:95px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:34px}.section h2{font-size:clamp(28px,4vw,44px)}.section-head>a{color:var(--gold2);font-size:14px;font-weight:700}.event-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.event-card{background:linear-gradient(135deg,var(--panel),#08111c);border:1px solid var(--line);padding:22px;display:grid;grid-template-columns:65px 1fr auto;gap:18px;align-items:center;box-shadow:var(--shadow)}.event-card.active{border-color:rgba(216,170,83,.55);background:linear-gradient(135deg,#1d1a13,#0b131c)}.event-time{font-family:Cinzel;color:var(--gold2);font-size:20px}.event-card small,.news-card small,.market-card small,.character-card small{color:var(--gold);font-size:10px;letter-spacing:1.8px;font-weight:700}.event-card h3{margin:3px 0;font-family:Cinzel;font-size:17px}.event-card p{margin:0;color:var(--muted);font-size:14px}.event-card>b{color:#d9e7f7;font-size:13px}.news-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:18px}.news-card{background:var(--panel);border:1px solid var(--line);overflow:hidden}.news-art{height:190px;display:flex;align-items:end;padding:20px;background-size:cover;position:relative}.news-card.featured .news-art{height:280px}.news-art:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#07101b,transparent)}.news-art span{position:relative;font-family:Cinzel;color:#fff;font-size:22px}.art-one{background:radial-gradient(circle at 30% 30%,#315476,#0d1725 60%,#02050a)}.art-two{background:radial-gradient(circle at 70% 30%,#6e3b2c,#17121a 60%,#02050a)}.art-three{background:radial-gradient(circle at 50% 20%,#725c25,#17160e 60%,#02050a)}.news-body{padding:22px}.news-body h3{font-family:Cinzel;margin:8px 0;font-size:20px}.news-body p{color:var(--muted);margin:0 0 14px}.news-body a{color:var(--gold2);font-weight:700}.rankings-section{background:linear-gradient(180deg,#07101a,#050910);border-block:1px solid var(--line)}.rank-tabs button,.slider-controls button{background:var(--panel);border:1px solid var(--line);color:#b9c6d5;padding:10px 16px;cursor:pointer}.rank-tabs button.active{color:#15120c;background:var(--gold2)}.ranking-layout{display:grid;grid-template-columns:1.5fr 1fr;gap:25px}.podium{display:grid;grid-template-columns:repeat(3,1fr);align-items:end;gap:12px}.podium article{height:270px;background:var(--panel);border:1px solid var(--line);text-align:center;padding:20px;position:relative}.podium article.first{height:320px;border-color:rgba(216,170,83,.5);background:linear-gradient(180deg,#1b1a17,var(--panel))}.podium span{position:absolute;top:12px;left:14px;font-family:Cinzel;color:var(--gold2);font-size:24px}.podium img{height:150px;max-width:100%;object-fit:contain}.podium h3{font-family:Cinzel;margin:4px}.podium p{color:var(--muted);margin:0}.rank-list{background:var(--panel);border:1px solid var(--line)}.rank-list div{display:grid;grid-template-columns:36px 1fr 1fr 50px;padding:20px;border-bottom:1px solid var(--line)}.rank-list em{color:var(--muted);font-style:normal}.rank-list strong{color:var(--gold2);text-align:right}.slider-controls{display:flex;gap:8px}.slider{overflow:hidden;cursor:grab;scrollbar-width:none}.slider::-webkit-scrollbar{display:none}.slider-track{display:flex;gap:18px;width:max-content}.market-card{width:270px;background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);padding:18px}.item-visual{height:180px;display:grid;place-items:center;font-size:82px;background:radial-gradient(circle,#24364a,#080e16 68%);color:var(--gold2);margin-bottom:18px}.market-card h3{font-family:Cinzel;margin:7px 0}.market-card p{color:var(--muted);margin:0 0 18px}.market-card footer,.character-card footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:14px}.market-card footer b,.character-card footer b{color:var(--gold2)}.character-card{width:500px;min-height:300px;background:linear-gradient(100deg,#0d1724,#101e2c);border:1px solid var(--line);display:grid;grid-template-columns:42% 1fr;overflow:hidden}.character-card img{width:100%;height:100%;object-fit:contain;align-self:end;background:radial-gradient(circle at 50% 70%,#213d52,transparent 60%)}.character-card>div{padding:35px 25px}.character-card h3{font-family:Cinzel;font-size:28px;margin:8px 0}.character-card p{color:var(--muted);min-height:70px}.video-section{background:#07101a;border-block:1px solid var(--line)}.video-card{width:min(650px,82vw)}.video-frame{aspect-ratio:16/9;background:#000;border:1px solid var(--line);box-shadow:var(--shadow)}.video-frame iframe{width:100%;height:100%;border:0}.video-card h3{font-family:Cinzel;font-size:23px;margin:17px 0 5px}.video-card p{color:var(--muted);margin:0}.streamer-card{width:280px;padding:28px;background:var(--panel);border:1px solid var(--line);text-align:center;position:relative}.streamer-avatar{width:90px;height:90px;margin:auto;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#1a425e,#6b4c21);font-family:Cinzel;font-size:36px;border:3px solid var(--gold)}.streamer-card h3{font-family:Cinzel;margin:15px 0 5px}.streamer-card p{color:var(--muted)}.streamer-card a{color:var(--gold2);font-weight:700}.live,.offline{position:absolute;top:13px;right:13px;font-size:9px;font-weight:700;letter-spacing:1px;padding:5px 8px}.live{background:#b62439}.offline{background:#263647}.site-footer{background:#02050a;border-top:1px solid var(--line);padding-top:65px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.3fr;gap:45px}.footer-brand{font-size:20px}.footer-grid p{color:var(--muted)}.footer-grid h4{font-family:Cinzel;color:var(--gold2)}.footer-grid>div>a:not(.brand){display:block;color:#94a4b7;margin:10px 0}.copyright{text-align:center;border-top:1px solid var(--line);margin-top:50px;padding:22px;color:#657589;font-size:13px}.reveal{opacity:0;transform:translateY(25px);transition:.7s}.reveal-visible{opacity:1;transform:none}.include-error{padding:20px;background:#38141a;color:#fff}.footer-brand img{width:54px;height:54px}

/* Hero compacto inspirado en portal clásico MU */
.hero.hero-compact{min-height:540px;height:540px;display:block;position:relative;overflow:hidden;background:#04101b;border-bottom:1px solid var(--line)}
.hero-backdrop{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,9,16,.98) 0%,rgba(3,15,27,.90) 34%,rgba(4,24,40,.42) 62%,rgba(2,8,15,.94) 100%),radial-gradient(circle at 58% 35%,rgba(28,125,205,.38),transparent 32%),linear-gradient(180deg,#07192a,#020810)}
.hero-backdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(2,6,11,.92),transparent 38%),repeating-linear-gradient(90deg,transparent 0 139px,rgba(255,255,255,.018) 140px);opacity:.8}
.hero-layout{height:100%;position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1fr) 270px;align-items:center;gap:38px}
.hero-copy{max-width:620px;padding-top:4px;position:relative;z-index:5}
.hero-copy .eyebrow{color:#56c7ff;letter-spacing:.4px;font-size:14px;margin-bottom:10px}
.hero-copy h1{font-family:Rajdhani,Arial,sans-serif;font-size:clamp(54px,5vw,78px);line-height:.84;letter-spacing:-2px;text-transform:uppercase;margin:0;text-shadow:0 8px 28px #000;font-weight:700}
.hero-copy h1 strong{color:#1788ff}
.hero-copy>p{max-width:560px;margin:22px 0 20px;color:#d1d9e4;font-size:17px;line-height:1.45}
.hero-copy .hero-buttons{justify-content:flex-start}
.btn.blue{background:linear-gradient(180deg,#1688ff,#0754b8);border-color:#2998ff;color:#fff;box-shadow:0 10px 26px rgba(0,100,255,.25)}
.hero-community{display:flex;align-items:center;gap:12px;margin-top:21px;color:#94a4b6;font-size:11px;font-weight:700;letter-spacing:.4px}
.hero-community a{width:26px;height:26px;border:1px solid rgba(255,255,255,.14);border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(4,13,23,.66)}
.hero-main-character{position:absolute;z-index:2;height:108%;max-width:48vw;object-fit:contain;bottom:-8%;left:51%;transform:translateX(-50%);filter:drop-shadow(0 22px 34px rgba(0,0,0,.8));opacity:.96}
.server-status-card{position:relative;z-index:6;background:linear-gradient(180deg,rgba(4,16,28,.96),rgba(3,12,22,.95));border:1px solid rgba(92,151,201,.35);border-radius:5px;padding:20px;box-shadow:0 20px 50px rgba(0,0,0,.45)}
.status-label{display:block;font-weight:700;font-size:13px;margin-bottom:14px}
.status-online{color:#42ef72;font-size:12px;font-weight:700;margin-bottom:3px}
.online-count{display:block;font-size:48px;line-height:1;margin-top:8px}
.server-status-card>small{font-size:10px;color:#d7e3ef;font-weight:700}
.server-status-card dl{margin:15px 0 12px;border-top:1px solid var(--line)}
.server-status-card dl div{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid var(--line);font-size:11px}
.server-status-card dt{color:#8fa4b9}.server-status-card dd{margin:0;font-weight:700;color:#fff}
.server-detail-link{display:block;border:1px solid rgba(255,255,255,.16);padding:10px 8px;text-align:center;font-size:10px;font-weight:700}
.rankings-section{padding-top:72px;padding-bottom:72px}

/* ===== V3: fondos, profundidad y efectos visuales ===== */
body{
  position:relative;
  background:
    radial-gradient(circle at 15% 18%,rgba(0,122,255,.10),transparent 24%),
    radial-gradient(circle at 84% 36%,rgba(223,153,45,.08),transparent 22%),
    linear-gradient(180deg,#030811 0%,#06111e 38%,#030913 100%);
  background-attachment:fixed;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-3;
  background:
    linear-gradient(rgba(4,10,18,.88),rgba(4,10,18,.94)),
    url('../img/classes/dark-wizard.png') left -170px center/520px auto no-repeat,
    url('../img/classes/fairy-elf.png') right -160px center/500px auto no-repeat;
  filter:saturate(.8) contrast(1.08);
  opacity:.28;
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;opacity:.28;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:90px 90px;
  mask-image:linear-gradient(to bottom,transparent 0,black 12%,black 88%,transparent 100%);
}
#ambient-particles{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.65}
.site-header{box-shadow:0 14px 40px rgba(0,0,0,.35)}
.hero.hero-compact{isolation:isolate;background:#020914}
.hero.hero-compact::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(circle at 54% 30%,rgba(30,148,255,.30),transparent 25%),
    radial-gradient(circle at 72% 65%,rgba(0,98,255,.12),transparent 24%),
    linear-gradient(90deg,rgba(1,7,13,.98) 0%,rgba(3,17,29,.68) 47%,rgba(2,8,15,.93) 100%);
}
.hero.hero-compact::after{
  content:"";position:absolute;inset:-12%;z-index:1;pointer-events:none;
  background:
    radial-gradient(circle at 50% 105%,rgba(32,149,255,.22),transparent 28%),
    repeating-radial-gradient(circle at 50% 70%,rgba(85,190,255,.04) 0 1px,transparent 2px 11px);
  mix-blend-mode:screen;animation:heroGlow 7s ease-in-out infinite alternate;
}
@keyframes heroGlow{from{opacity:.45;transform:scale(1)}to{opacity:.8;transform:scale(1.035)}}
.hero-backdrop{
  background:
    linear-gradient(90deg,rgba(2,9,16,.98) 0%,rgba(3,15,27,.84) 35%,rgba(4,24,40,.24) 63%,rgba(2,8,15,.95) 100%),
    radial-gradient(circle at 58% 35%,rgba(28,125,205,.46),transparent 31%),
    linear-gradient(180deg,#07192a,#020810);
}
.hero-backdrop::before{
  content:"";position:absolute;left:0;right:0;bottom:0;height:52%;
  background:
    linear-gradient(165deg,transparent 0 45%,rgba(5,18,30,.75) 46% 58%,transparent 59%) 0 100%/42% 100% no-repeat,
    linear-gradient(195deg,transparent 0 42%,rgba(6,21,35,.72) 43% 61%,transparent 62%) 100% 100%/48% 100% no-repeat;
  opacity:.65;filter:blur(.2px)
}
.hero-main-character{animation:floatCharacter 5s ease-in-out infinite;filter:drop-shadow(0 24px 38px rgba(0,0,0,.88)) drop-shadow(0 0 28px rgba(27,130,255,.22))}
@keyframes floatCharacter{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-7px)}}
.server-status-card,.event-card,.news-card,.podium article,.rank-list,.market-card,.character-card,.video-card,.streamer-card{
  backdrop-filter:blur(10px);
  box-shadow:0 18px 55px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.025);
}
.section{position:relative}
.section::before{
  content:"";position:absolute;left:50%;top:0;width:min(1180px,calc(100% - 40px));height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,rgba(69,151,224,.24),transparent)
}
.rankings-section{
  background:
    radial-gradient(circle at 18% 40%,rgba(26,105,171,.10),transparent 28%),
    radial-gradient(circle at 82% 35%,rgba(217,161,70,.07),transparent 24%),
    linear-gradient(180deg,rgba(7,16,26,.96),rgba(4,9,16,.98));
}
.video-section{
  background:
    linear-gradient(rgba(4,13,22,.94),rgba(4,13,22,.97)),
    radial-gradient(circle at 50% 0%,rgba(26,114,184,.18),transparent 42%);
}
.market-card:hover,.character-card:hover,.streamer-card:hover,.news-card:hover,.event-card:hover{transform:translateY(-5px);border-color:rgba(70,169,255,.42);transition:.25s ease}
.item-visual{position:relative;overflow:hidden}
.item-visual::after{content:"";position:absolute;inset:-60% -20%;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.12) 50%,transparent 65%);transform:translateX(-70%);animation:itemShine 5s linear infinite}
@keyframes itemShine{to{transform:translateX(70%)}}

/* ===== V4: composición basada en el mockup aprobado ===== */
:root{--panel:#07111e;--panel2:#0a1625;--line:rgba(100,155,205,.22);--gold:#e6b548;--blue:#1689ff;--purple:#ad4cff;--green:#00d88a}
.hero.hero-compact{height:490px;min-height:490px}
.hero-layout{min-height:490px;padding-block:45px}
.hero-main-character{height:104%;left:57%;bottom:-4%}
.hero-copy h1{font-size:58px;line-height:.86}.hero-copy{max-width:460px}.hero-copy>p{max-width:430px}
.server-status-card{right:0;max-width:260px}
.rankings-section{padding:42px 0 54px}
.compact-head{margin-bottom:22px}.compact-head h2{font-size:34px}.head-actions{display:flex;align-items:center;gap:18px}.head-actions>a{font-size:12px;color:#39a9ff;font-weight:700}
.rank-four-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.rank-panel{background:linear-gradient(180deg,rgba(11,19,31,.98),rgba(4,9,16,.98));border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 18px 45px rgba(0,0,0,.32)}
.rank-panel header{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:14px 14px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.025)}
.rank-panel header h3{margin:0;font:700 14px Rajdhani,sans-serif;text-transform:uppercase;letter-spacing:.05em}.rank-panel header a{font-size:9px;color:#5cb7ff;text-transform:uppercase}.rank-panel ol{list-style:none;padding:8px;margin:0}
.rank-panel li{display:grid;grid-template-columns:20px 28px 1fr auto;align-items:center;gap:7px;min-height:52px;padding:7px 6px;border-bottom:1px solid rgba(120,170,210,.12)}.rank-panel li:last-child{border:0}.rank-panel li.winner{border:1px solid currentColor;background:rgba(255,255,255,.025)}
.rank-panel li b{font-size:11px}.rank-panel li strong{display:block;font-size:12px}.rank-panel li small{display:block;color:#7e93a8;font-size:9px}.rank-panel li em{font-style:normal;font-weight:800;font-size:11px}.rank-avatar{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#10283a;color:#42e0c2}
.rank-panel.purple{color:#ba61ff}.rank-panel.blue{color:#3e92ff}.rank-panel.gold{color:#f0b84d}.rank-panel.green{color:#00dc8f}.rank-panel li strong,.rank-panel header h3{color:#f5f7fb}
.market-section{padding-top:48px;padding-bottom:48px}.market-slider,.character-slider{overflow:hidden}.market-slider .slider-track,.character-slider .slider-track{display:flex;gap:14px;width:max-content}
.market-card{flex:0 0 210px;min-height:300px;padding:14px;background:linear-gradient(180deg,#0a1727,#07111e);border:1px solid rgba(82,139,191,.28);border-radius:5px}.market-card .item-visual{height:145px;display:grid;place-items:center;font-size:64px;background:radial-gradient(circle at 50% 45%,rgba(61,132,205,.18),transparent 48%),linear-gradient(135deg,#0e1b2b,#07101b);border-bottom:1px solid rgba(255,255,255,.04)}.market-card h3{font-size:17px;margin:8px 0 5px}.market-card small{color:#e7b94f;letter-spacing:.14em}.market-card footer{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between}.market-card footer b{color:#ffd06b}
.character-card{flex:0 0 390px;display:grid;grid-template-columns:46% 54%;min-height:235px;background:linear-gradient(135deg,#0b1828,#07111e);border:1px solid rgba(82,139,191,.28);border-radius:5px;overflow:hidden}.character-card img{width:100%;height:100%;object-fit:contain;object-position:center bottom;background:radial-gradient(circle at 50% 40%,rgba(34,127,219,.18),transparent 52%)}.character-card>div{padding:30px 22px}.character-card small{color:#e7b94f;letter-spacing:.14em}.character-card h3{font-size:28px;margin:8px 0}.character-card footer{margin-top:26px;padding-top:14px;border-top:1px solid var(--line);display:flex;justify-content:space-between}.character-card footer b{color:#ffd06b}
.slider-controls{display:flex;gap:7px}.slider-controls button{width:40px;height:36px;border:1px solid var(--line);background:#0a1725;color:#c8d7e5;cursor:pointer}
.video-card{flex:0 0 283px;width:283px}.streamer-card{flex:0 0 230px}
@media(max-width:1100px){.rank-four-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-main-character{left:62%}.server-status-card{max-width:240px}}
@media(max-width:700px){.rank-four-grid{grid-template-columns:1fr}.hero.hero-compact{height:auto;min-height:560px}.hero-layout{min-height:560px}.hero-copy h1{font-size:48px}.market-card{flex-basis:76vw}.character-card{flex-basis:88vw;grid-template-columns:42% 58%}.compact-head h2{font-size:28px}.head-actions>a{display:none}}

/* ===== V5: noticias después del ranking + widgets flotantes ===== */
.floating-widget{position:fixed;z-index:45;background:linear-gradient(180deg,rgba(13,10,9,.96),rgba(8,7,7,.96));border:1px solid rgba(230,170,40,.62);box-shadow:0 16px 46px rgba(0,0,0,.58),0 0 24px rgba(211,137,25,.10);backdrop-filter:blur(13px)}
.floating-events{left:18px;bottom:18px;top:auto;width:260px;padding:12px;border-radius:15px;transform:none}
.floating-title{display:flex;align-items:center;justify-content:space-between;padding:0 2px 10px;color:#ffd12f;text-transform:uppercase;font-size:13px;font-weight:800;letter-spacing:.04em}
.floating-title span{display:flex;align-items:center;gap:7px}.floating-minimize{width:23px;height:23px;border:1px solid rgba(255,255,255,.12);border-radius:50%;background:rgba(255,255,255,.04);color:#aaa;cursor:pointer}
.floating-event{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:8px;margin-top:7px;padding:9px;border:1px solid rgba(255,255,255,.08);border-radius:7px;background:rgba(255,255,255,.025)}
.floating-event.active{border-color:rgba(0,224,123,.35);background:linear-gradient(90deg,rgba(0,179,100,.10),rgba(255,255,255,.02))}.floating-event .event-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:5px;background:#260512;color:#ff2f58}.floating-event b{font-size:11px}.floating-event em{font-style:normal;color:#fff}.floating-event time{font-size:11px;font-weight:800;color:#ffd132}.floating-event.active time,.floating-event.active b{color:#00ed8a}
.floating-social{right:18px;top:50%;width:170px;padding:10px;border-radius:15px;transform:translateY(-50%)}
.floating-social a{display:grid;grid-template-columns:42px 1fr;gap:9px;align-items:center;padding:8px 7px;border:1px solid rgba(220,151,35,.7);border-radius:12px;background:linear-gradient(90deg,rgba(255,255,255,.03),rgba(255,155,0,.035));margin:7px 0}
.floating-social a>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font-size:20px;font-weight:800;color:white;box-shadow:inset 0 1px 1px rgba(255,255,255,.35),0 0 13px rgba(255,255,255,.12)}
.floating-social b{display:block;font-size:11px;text-transform:uppercase}.floating-social small{display:block;color:#ffc74f;text-transform:uppercase;font-size:9px;font-weight:700}.social-fb>span{background:linear-gradient(#56a1ff,#0c57bf)}.social-discord>span{background:linear-gradient(#766cff,#4938ad)}.social-whatsapp>span{background:linear-gradient(#62f986,#17b949)}.social-youtube>span{background:linear-gradient(#ff4a4a,#c80000)}.social-tiktok>span{background:linear-gradient(#333,#050505)}
.floating-widget.collapsed>*:not(.floating-title){display:none}.floating-widget.collapsed{width:auto}.floating-widget.collapsed .floating-title{padding:0}
@media(max-width:1500px){.floating-social{right:8px;width:148px}.floating-events{left:8px;width:225px}.floating-social a{grid-template-columns:34px 1fr;padding:6px}.floating-social a>span{width:31px;height:31px;font-size:16px}}
@media(max-width:1280px){.floating-social,.floating-events{display:none}}

/* V6: widgets laterales integrados al estilo azul de HispanoMU */
.floating-widget{
  background:linear-gradient(180deg,rgba(6,22,38,.96),rgba(4,13,24,.97));
  border:1px solid rgba(44,159,255,.58);
  box-shadow:0 18px 55px rgba(0,0,0,.62),0 0 30px rgba(29,132,231,.16),inset 0 1px 0 rgba(122,198,255,.08);
}
.floating-title{color:#5ec8ff;border-bottom:1px solid rgba(60,158,230,.18)}
.floating-minimize{border-color:rgba(79,174,239,.28);background:rgba(19,79,122,.2);color:#8ed8ff}
.floating-event{border-color:rgba(66,147,209,.18);background:linear-gradient(90deg,rgba(16,61,96,.22),rgba(5,18,31,.45))}
.floating-event:hover{border-color:rgba(61,181,255,.6);transform:translateX(3px)}
.floating-event.active{border-color:rgba(38,213,255,.55);background:linear-gradient(90deg,rgba(0,149,255,.22),rgba(6,27,45,.72));box-shadow:0 0 18px rgba(0,159,255,.1)}
.floating-event .event-icon{background:linear-gradient(145deg,#0c4975,#08243d);color:#70d7ff;border:1px solid rgba(75,189,255,.25)}
.floating-event time{color:#65cfff}.floating-event.active time,.floating-event.active b{color:#66e8ff}
.floating-social a{border-color:rgba(54,159,235,.42);background:linear-gradient(90deg,rgba(10,55,88,.55),rgba(4,18,31,.8));transition:.22s}
.floating-social a:hover{border-color:#49bfff;transform:translateX(-4px);box-shadow:0 0 18px rgba(31,150,230,.18)}
.floating-social small{color:#61caff}
.floating-social a>span{box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 0 16px rgba(42,166,255,.2)}

/* Indicador visual de carrusel automático */
.market-slider,.character-slider{position:relative}
.market-slider:after,.character-slider:after{content:"AUTO";position:absolute;right:10px;bottom:8px;padding:4px 8px;border-radius:12px;background:rgba(5,22,37,.88);border:1px solid rgba(55,175,255,.35);color:#63ccff;font-size:9px;font-weight:800;letter-spacing:1.2px;pointer-events:none}
.market-card,.character-card{transition:transform .28s,border-color .28s,box-shadow .28s}
.market-card:hover,.character-card:hover{transform:translateY(-5px);border-color:rgba(60,184,255,.65);box-shadow:0 14px 35px rgba(0,0,0,.4),0 0 22px rgba(38,142,224,.11)}


/* ===== HISPANO S9 — TEMA ROJO / NEGRO ===== */
:root{
  --bg:#080304;
  --bg2:#120506;
  --panel:#140708;
  --panel2:#1d0a0c;
  --line:rgba(255,72,72,.24);
  --text:#fff4f2;
  --muted:#b99a9a;
  --gold:#e4a43a;
  --gold2:#ffd27a;
  --blue:#e21f2f;
  --cyan:#ff4a4a;
  --purple:#ff5964;
  --green:#ffb12b;
  --shadow:0 18px 50px rgba(0,0,0,.62);
}
body{
  background:
    radial-gradient(circle at 82% 8%,rgba(186,0,15,.24),transparent 28%),
    radial-gradient(circle at 15% 44%,rgba(92,0,8,.14),transparent 32%),
    linear-gradient(180deg,#090304,#050203 70%,#020101);
}
.server-ticker{background:#080203;border-bottom-color:rgba(255,63,63,.42)}
.server-ticker:before{background:linear-gradient(90deg,#080203,transparent)}
.server-ticker:after{background:linear-gradient(-90deg,#080203,transparent)}
.site-header{background:rgba(8,2,3,.92);border-bottom-color:rgba(255,69,69,.22)}
.main-nav a:hover,.head-actions>a,.rank-panel header a{color:#ff5b5b}
.btn.blue{
  background:linear-gradient(180deg,#f12b38,#8e0710);
  border-color:#ff5964;
  box-shadow:0 10px 28px rgba(218,0,20,.35),inset 0 1px 0 rgba(255,255,255,.18);
}
.btn.blue:hover{background:linear-gradient(180deg,#ff4550,#b30a16)}
.btn.gold{box-shadow:0 8px 28px rgba(230,151,25,.24)}
.hero.hero-compact{background:#090203;border-bottom-color:rgba(255,57,57,.25)}
.hero-backdrop{
  filter:none;
}
.hero.hero-compact:after{
  content:none;
  background:none;
  mix-blend-mode:normal;
}
.hero-layout{position:relative;z-index:3}
.hero-copy .eyebrow,.hero-copy h1 strong{color:#ff3947}
.hero-copy h1 strong{text-shadow:0 0 28px rgba(255,22,38,.32)}
.server-status-card{
  background:linear-gradient(180deg,rgba(20,5,7,.95),rgba(8,2,3,.97));
  border-color:rgba(255,62,62,.38);
  box-shadow:0 18px 55px rgba(0,0,0,.6),0 0 32px rgba(201,0,18,.12);
}
.server-status-card dt{color:#ba9698}
.server-status-card .btn{border-color:rgba(255,76,76,.3)}
.rankings-section{
  background:
    radial-gradient(circle at 18% 40%,rgba(158,0,14,.14),transparent 28%),
    radial-gradient(circle at 82% 35%,rgba(217,112,26,.09),transparent 24%),
    linear-gradient(180deg,rgba(17,4,6,.98),rgba(5,2,3,.99));
}
.rank-panel{
  background:linear-gradient(180deg,rgba(25,7,9,.98),rgba(7,2,3,.99));
  border-color:rgba(255,68,68,.22);
}
.rank-panel header{background:rgba(255,32,45,.035)}
.rank-panel li{border-bottom-color:rgba(255,88,88,.12)}
.rank-panel.purple,.rank-panel.blue,.rank-panel.green{color:#ff4c58}
.rank-avatar{background:#28090c;color:#ff6670}
.market-section,.news-section{background:linear-gradient(180deg,#080304,#0d0405)}
.market-card,.character-card,.news-card,.event-card,.streamer-card{
  background:linear-gradient(180deg,#1a090b,#0c0304);
  border-color:rgba(255,74,74,.24);
}
.market-card .item-visual,.item-visual{
  background:radial-gradient(circle at 50% 45%,rgba(207,16,31,.23),transparent 49%),linear-gradient(135deg,#21080b,#090304);
}
.character-card img{background:radial-gradient(circle at 50% 40%,rgba(211,17,31,.22),transparent 52%)}
.market-card:hover,.character-card:hover,.streamer-card:hover,.news-card:hover,.event-card:hover{
  border-color:rgba(255,69,79,.68);
  box-shadow:0 14px 38px rgba(0,0,0,.48),0 0 24px rgba(190,0,17,.16);
}
.slider-controls button,.rank-tabs button{background:#180608;border-color:rgba(255,75,75,.25)}
.video-section{background:linear-gradient(rgba(10,2,3,.96),rgba(5,1,2,.98)),radial-gradient(circle at 50% 0%,rgba(196,0,18,.22),transparent 42%)}
.site-footer{background:#050102;border-top-color:rgba(255,58,58,.2)}
.floating-widget{
  background:linear-gradient(180deg,rgba(28,5,8,.97),rgba(9,2,3,.98));
  border-color:rgba(255,55,65,.64);
  box-shadow:0 18px 55px rgba(0,0,0,.68),0 0 30px rgba(218,0,20,.18),inset 0 1px 0 rgba(255,145,145,.08);
}
.floating-title{color:#ff5d67;border-bottom-color:rgba(255,65,75,.2)}
.floating-minimize{border-color:rgba(255,82,90,.3);background:rgba(120,5,15,.24);color:#ff9298}
.floating-event{border-color:rgba(224,48,59,.22);background:linear-gradient(90deg,rgba(106,8,17,.25),rgba(20,3,5,.54))}
.floating-event:hover,.floating-social a:hover{border-color:#ff4b57;box-shadow:0 0 20px rgba(211,0,20,.22)}
.floating-event.active{border-color:rgba(255,92,52,.62);background:linear-gradient(90deg,rgba(190,18,28,.25),rgba(30,5,7,.76))}
.floating-event .event-icon{background:linear-gradient(145deg,#7c0a13,#2c0508);color:#ff7b83;border-color:rgba(255,91,100,.3)}
.floating-event time,.floating-event.active time,.floating-event.active b,.floating-social small{color:#ff6a73}
.floating-social a{border-color:rgba(229,49,61,.46);background:linear-gradient(90deg,rgba(88,7,14,.6),rgba(18,3,5,.84))}
.market-slider:after,.character-slider:after{background:rgba(39,4,8,.92);border-color:rgba(255,64,74,.42);color:#ff6972}
.online-dot,.status-online{color:#ffb52c}
.online-dot{background:#ffb52c;box-shadow:0 0 12px #ff9d00}
.hero-copy h1 strong{font-size:.62em;letter-spacing:-1px;white-space:nowrap}
