.universe-page{background:#070c0d;color:#eee4cf}
.universe-page .header{border-bottom:1px solid #a78953a3;background:#050909f2}
.universe-page nav [aria-current="page"]{position:relative;color:#f1dfb7;text-shadow:0 0 20px #d9ac5b}
.universe-page nav [aria-current="page"]:after{content:'◇';position:absolute;bottom:-5px;left:50%;transform:translateX(-50%);color:#d8b474;font-size:13px}
.universe-hero{height:clamp(240px,17vw,330px);position:relative;isolation:isolate;border-bottom:1px solid #af8f4da8;overflow:visible}
.universe-panorama{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 52%;z-index:-2}
.universe-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#030909e0 2%,#03090985 28%,#0309090d 62%),linear-gradient(0deg,#050a0a88,transparent 40%);z-index:-1}
.universe-standard{position:absolute;top:0;left:2%;width:clamp(90px,10vw,175px);height:calc(100% + 16px);object-fit:contain;object-position:top;filter:drop-shadow(0 8px 10px #0009);z-index:1}
.universe-hero h1{position:absolute;left:14%;top:50%;transform:translateY(-50%);width:35%;max-width:600px;min-width:300px;margin:0;filter:drop-shadow(0 3px 6px #000)}
.universe-hero h1 img{width:100%;height:auto;display:block}
.universe-realms{position:relative;padding:30px max(6%,calc((100vw - 1400px)/2)) 22px;background:linear-gradient(#060b0b25,#060b0b10),url('assets/universo-fundo-v20.webp') center center/cover no-repeat;isolation:isolate;min-height:610px;border-bottom:1px solid #a5894d75}
.universe-intro{text-align:center;max-width:1000px;margin:0 auto 23px;padding:0 35px;color:#e3d9c4;font-size:clamp(15px,1.22vw,21px);line-height:1.7;letter-spacing:.045em;text-shadow:0 2px 4px #000}
.realms-heading{display:flex;align-items:center;justify-content:center;gap:24px;margin:0 auto 18px;max-width:1100px}
.realms-heading h2{width:43%;max-width:510px;flex-shrink:0;margin:0}
.realms-heading h2 img{display:block;width:100%;height:auto;max-height:72px;object-fit:contain}
.realms-heading>span{height:1px;width:100%;background:linear-gradient(90deg,transparent,#b29355)}
.realms-heading>span:last-child{transform:rotate(180deg)}
.realm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:1300px;margin:0 auto}
.realm-card{position:relative;border:1px solid #9b7a3d;background:linear-gradient(120deg,#0b100fed,#090d0bf2);box-shadow:0 10px 25px #0005;scroll-margin-top:24px}
.realm-card:before,.realm-card:after{content:'◇';position:absolute;top:-9px;left:-5px;color:#ba9659;font-size:19px;z-index:3;text-shadow:0 1px 3px #000}
.realm-card:after{left:auto;right:-5px}
.realm-art{position:relative;height:clamp(150px,13vw,235px);overflow:hidden;background:#0a1010}
.realm-art:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#090e0e,transparent 50%);pointer-events:none}
.realm-picture{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.oakhaven .realm-picture{width:300%;max-width:none;object-position:left center}
.realm-banner{position:absolute;left:8px;top:-2px;width:72px;height:155px;object-fit:contain;object-position:top;filter:drop-shadow(0 4px 5px #000);z-index:2}
.realm-card:hover .realm-picture{transform:scale(1.035)}
.realm-content{text-align:center;padding:0 17px 22px}
.realm-content h3{margin:-3px auto 4px;width:87%;max-width:300px;position:relative;z-index:2;display:flex;align-items:center;justify-content:center;height:58px}
.realm-content h3 img{display:block;width:100%;height:100%;object-fit:contain}
.realm-content p{font-size:clamp(14px,1.05vw,18px);line-height:1.6;letter-spacing:.035em;max-width:310px;margin:10px auto 14px;min-height:3.2em;color:#e1d8c6}
.realm-content .ornate-button{width:min(235px,95%);height:48px;letter-spacing:.16em;font-size:11px}
.universe-ending{display:flex;align-items:center;justify-content:center;gap:18px;max-width:1300px;margin:30px auto 0;color:#bc9c60;font-size:17px}
.universe-ending span{height:1px;flex:1;background:linear-gradient(90deg,transparent,#a4874e)}
.universe-ending span:last-child{transform:rotate(180deg)}
.universe-page .status:empty{display:none}
.universe-page #content-dialog .dialog-body>p:not(.eyebrow){font-size:17px;line-height:1.8}
.universe-page #content-dialog .close-content{margin-top:20px}
.universe-page footer{background:#050a0b}
.universe-page footer a{font-size:11px;letter-spacing:.12em;border-left:1px solid #a7895366;padding-left:20px}
@media(max-width:1100px){.universe-realms{padding-left:5%;padding-right:5%}.realm-grid{gap:18px}.realm-banner{width:57px;height:130px}.realm-content{padding-left:12px;padding-right:12px}.realm-content p{font-size:14px}.realm-content h3{height:49px}.realm-content .ornate-button{font-size:10px}.universe-hero h1{left:15%;width:40%}}
@media(max-width:800px){.realm-grid{gap:14px}.realm-content h3{width:100%;height:43px}.realm-content p{font-size:13px;letter-spacing:.015em}.realm-content .ornate-button{font-size:9px;letter-spacing:.12em}.realm-art{height:145px}.universe-intro{padding:0 15px}.realm-content{padding-bottom:18px}.realms-heading{gap:16px}.realms-heading h2{width:53%}}
@media(max-width:650px){
.universe-hero{height:240px}.universe-hero h1{left:20%;width:76%;min-width:0;max-width:420px}.universe-standard{left:0;width:79px;height:207px}.universe-panorama{object-position:60% center}.universe-hero:after{background:linear-gradient(90deg,#030909c0,#03090944 65%),linear-gradient(0deg,#050a0a80,transparent)}
.universe-realms{padding:29px 22px 24px;background-position:left top;background-size:auto 850px;background-color:#070c0d;background-repeat:no-repeat}
.universe-intro{font-size:15px;line-height:1.75;padding:0 3px;margin-bottom:25px}.realms-heading{gap:10px;margin-bottom:23px}.realms-heading h2{width:78%;max-width:390px}.realms-heading>span{min-width:12px}
.realm-grid{grid-template-columns:1fr;gap:25px;max-width:430px}.realm-art{height:195px}.realm-banner{width:73px;height:160px}.realm-content{padding:0 22px 23px}.realm-content h3{height:62px;max-width:280px;width:90%}.realm-content p{font-size:16px;max-width:330px;margin:10px auto 17px;min-height:0}.realm-content .ornate-button{height:49px;font-size:11px;width:230px}.universe-ending{margin-top:28px}.universe-page nav [aria-current="page"]:after{bottom:10px;left:auto;right:0;transform:none}
}
@media(prefers-reduced-motion:reduce){.realm-picture{transition:none}}