/* OscuroDiamante 99B+ — etapa 1: identidad visual oficial.
   El escudo se sirve como archivo independiente sin modificar la obra original. */
:root{--bg:#0d0a0d;--surface:#171116;--surface2:#21171c;--line:#49343b;--ink:#f5eae4;--muted:#baa9ae;--gold:#f0cf9b;--violet:#a87ac9;--red:#e46751;--ok:#82c8a4}
body{background:radial-gradient(ellipse 60% 28% at 50% 1%,#44232b56,transparent),radial-gradient(ellipse 43% 25% at 95% 31%,#38223a35,transparent),#0c090d;color:#f4ebe9}
.masthead{background:#100c11f6;border-color:#693e3b}
.topline{background:#08070a;border-color:#3e2727}
.topline-inner{color:#c8aeaa}
.navrow{min-height:80px;gap:12px}
.identity{min-width:218px;gap:7px}
.brand-symbol{width:66px;height:66px;object-fit:contain;flex:none;filter:drop-shadow(0 0 6px #e3594f45)}
.identity-name{font-size:17px;letter-spacing:.025em;white-space:nowrap}
.identity-name>span{color:#ddaaab}
.identity-name small{color:#e2c69b;font-size:8px;letter-spacing:.2em}
.nav{gap:13px}
.nav a.active{color:#f9cba9}
.nav-account{border-color:#b86153;background:#3b242640}
.demo-banner{background:#201618;border-color:#60403d;color:#e7c6b4}
.demo-banner .dot{background:#dfb068}
.banner-showcase{border:1px solid #654048;border-radius:12px;background:linear-gradient(150deg,#120d12,#22141b 60%,#120b13);overflow:hidden;box-shadow:0 20px 65px #0008,0 0 0 1px #ad60491c}
.home-intro{padding-top:25px}
.banner-stage{position:relative;background:linear-gradient(90deg,#100b13,#2b1a20 45%,#1c111c);overflow:hidden}
.banner-slide:not([hidden]){display:block;animation:brand-in .27s ease-out}
.banner-slide[hidden]{display:none !important}
.banner-slide img{display:block;width:100%;height:auto;max-width:100%;aspect-ratio:1920/880;object-fit:contain}
@keyframes brand-in{from{opacity:.35}to{opacity:1}}
.banner-dots{display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 10px 3px;background:linear-gradient(180deg,#160e15,#1b1117)}
.banner-dot{border-radius:30px;width:28px;height:5px;background:#66515a;border:0;padding:0;cursor:pointer;transition:background .2s,width .2s}
.banner-dot.selected{background:#d86c55;width:49px;box-shadow:0 0 14px #d967555e}
.hero-welcome{padding:24px clamp(22px,3.2vw,40px) 30px;display:flex;justify-content:space-between;align-items:center;gap:20px;background:linear-gradient(100deg,#1c1217,#281922 62%,#1c1217)}
.hero-welcome h1{font:700 clamp(22px,2.5vw,35px)/1.18 Cinzel,Georgia,serif;margin:7px 0 9px;color:#f8dfbd}
.hero-welcome p{max-width:640px;color:#d5bcc0;font-size:13px;margin:0}
.hero-welcome .btns{margin:0;justify-content:flex-end;flex-shrink:0}
.hero-welcome .btn{padding:13px 15px;white-space:nowrap}
.btn{background:linear-gradient(160deg,#8b3e3c,#5b262f);border-color:#d57e6b;box-shadow:inset 0 1px #eaaea35e}
.btn:hover{background:linear-gradient(160deg,#ab514b,#733440)}
.btn.alt{background:linear-gradient(160deg,#29212a,#16121c);border-color:#a68767}
.btn.alt:hover{background:#3e2b36}
.start-section{padding-top:39px}
.micro{color:#ce9a97}
.section-head h2,.page-head h1{color:#f6dcbb}
.card,.panel{background:linear-gradient(145deg,#20171d,#141015 88%);border-color:#4d3740;box-shadow:0 6px 22px #0002}
.card:hover{border-color:#976157}
.card h3,.panel h3{color:#f0c69b}
.card .meta{color:#d39a95}
.link{color:#e6ac92}
.footer{background:#08070a;border-color:#51383d}
.nav-account:hover{color:#ffe3c4}
.page-head{border-color:#55353e}
/* Las cifras de juego no aparecen en la portada: solo en Información del servidor. */
@media(max-width:1120px){.nav{gap:8px}.identity{min-width:199px}.identity-name{font-size:15px}.brand-symbol{width:58px;height:58px}.navrow{gap:7px}}
@media(max-width:900px){.nav{display:none;position:absolute;top:100%;left:0;right:0;background:#130d14;padding:12px max(18px,calc((100% - 1140px)/2)) 20px;flex-direction:column;align-items:stretch;gap:0;border-bottom:1px solid #754c48;box-shadow:0 16px 26px #0009;max-height:75vh;overflow:auto}.nav.open{display:flex}.hamburger{display:block}.nav a{padding:12px;border-bottom:1px solid #473039}.nav-account{margin-top:9px}.hero-welcome{align-items:flex-start;flex-direction:column}.hero-welcome .btns{justify-content:flex-start}}
@media(max-width:660px){
 .home-intro{padding-top:13px}
 .banner-stage{background:radial-gradient(circle at 51% 48%,#3d222c 0%,#1b111b 56%,#0d0b11 100%)}
 .banner-slide picture img{max-width:540px;margin:auto;height:auto;aspect-ratio:1/1;object-fit:contain;padding:8px 8px 0}
 .banner-slide[data-banner-panel="1"]{display:none !important}
 .banner-dots{display:none}
 .hero-welcome{padding:22px 20px 25px;gap:20px}
 .hero-welcome h1{font-size:24px}
 .hero-welcome .btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
 .hero-welcome .btn{text-align:center;font-size:10px;letter-spacing:0;padding:12px 7px}
 .identity{min-width:0}
 .identity-name{font-size:15px}
 .identity-name small{font-size:8px}
 .brand-symbol{width:57px;height:57px}
 .navrow{min-height:68px}
 .topline-inner{font-size:8px}
 .demo-banner{font-size:9px;letter-spacing:0;padding:8px 10px}
 .start-section{padding-top:24px}
}
@media(max-width:375px){.identity-name{font-size:13px}.brand-symbol{width:49px;height:49px}.topline-inner span:first-child{max-width:47%}.hero-welcome h1{font-size:21px}}
@media(prefers-reduced-motion:reduce){.banner-slide:not([hidden]){animation:none}}