/* Menú de guías en la barra superior de la portada */
#homeScreen .topGuides{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;flex:1}
#homeScreen .topGuides a{font:700 13px/1 "Trebuchet MS",Arial,sans-serif;letter-spacing:0;color:#f6f0ff;text-decoration:none;padding:8px 11px;border-radius:999px;background:#ffffff10;white-space:nowrap}
#homeScreen .topGuides a:hover{background:#ffe348;color:#21134f}
@media(max-width:760px){
 #homeScreen .topbar{flex-wrap:wrap}
 #homeScreen .topGuides{order:3;flex:1 0 100%;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding:4px 0 2px;scrollbar-width:none}
 #homeScreen .topGuides::-webkit-scrollbar{display:none}
 #homeScreen .topGuides a{font-size:12px;padding:7px 10px}
}

/* Sección de guías bajo el juego (anula estilos genéricos de footer del juego) */
#siteLegalFooter.homeGuides{display:block;width:100%;max-width:1180px;margin:40px auto 0!important;padding:0 20px 30px;border:0;font:16px/1.65 "Trebuchet MS",Arial,Helvetica,sans-serif;letter-spacing:normal;color:#f6f0ff;box-sizing:border-box}
.homeGuides *{box-sizing:border-box;letter-spacing:normal}
.homeGuides h2{font:900 30px/1.15 "Trebuchet MS",Arial,sans-serif;color:#ffe348;margin:6px 0 12px}
.hgIntro{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;background:linear-gradient(135deg,#3d2780,#2b1a5c);border:2px solid #7b5cc4;border-radius:26px;padding:30px;box-shadow:0 10px 0 #120a2e}
.hgIntro img{display:block;width:100%;height:auto;border-radius:16px;border:3px solid #ffffff22}
.hgEyebrow{color:#87f5e0;font-weight:800;text-transform:uppercase;letter-spacing:2px!important;font-size:13px}
.hgIntro p{color:#d9cff5;font-size:17px;margin:0 0 20px}
.hgBtn{display:inline-block;background:#ffe348;color:#21134f;font-weight:900;text-decoration:none;padding:12px 22px;border-radius:12px;box-shadow:0 5px 0 #b38f00}
.hgCards{margin-top:44px}
.hgGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.hgCard{display:flex;flex-direction:column;background:#33206a;border:2px solid #7b5cc4;border-radius:18px;overflow:hidden;text-decoration:none;color:#f6f0ff;box-shadow:0 6px 0 #120a2e;transition:transform .15s}
.hgCard:hover{transform:translateY(-4px)}
.hgPic{display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;background:radial-gradient(circle,#6a46c4,#2a1760);overflow:hidden}
.hgPic img{width:100%;height:100%;object-fit:cover}
.hgPic.char img{width:auto;height:86%;object-fit:contain;filter:drop-shadow(0 8px 8px #0008)}
.hgCard strong{display:block;font-size:19px;color:#ffe348;padding:14px 16px 2px}
.hgCard small{display:block;font-size:15px;color:#cfc2f2;padding:0 16px 16px}
.hgFoot{margin-top:44px;border-top:2px solid #ffffff1a;padding-top:20px;text-align:center}
.hgFoot nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px}
.hgFoot a{color:#f6f0ff;text-decoration:none;font-size:15px}
.hgFoot a:hover{color:#87f5e0;text-decoration:underline}
.hgFoot p{color:#a99bd0;font-size:13px;margin:14px 0 0}
@media(max-width:900px){.hgIntro{grid-template-columns:1fr;padding:22px}.hgGrid{grid-template-columns:repeat(2,1fr)}.homeGuides h2{font-size:24px}}
@media(max-width:520px){.hgGrid{grid-template-columns:1fr}}

/* Menú fijo superior en la portada (igual que en las guías) */
.siteHeader{position:sticky;top:0;z-index:1000;background:#170c38ee;backdrop-filter:blur(8px);border-bottom:2px solid #ffffff1c;font:16px/1.5 "Trebuchet MS",Arial,Helvetica,sans-serif;letter-spacing:normal;box-sizing:border-box}
.siteHeader *{box-sizing:border-box;letter-spacing:normal}
.siteHeader .inner{max-width:1180px;margin:auto;display:flex;align-items:center;gap:18px;padding:10px 20px}
.siteLogo{display:flex;align-items:center;gap:8px;text-decoration:none;color:#ffe348!important;font-weight:900;font-size:22px;white-space:nowrap}
.siteLogo img{width:38px;height:38px}
.siteNav{display:flex;gap:4px;flex:1;justify-content:center;flex-wrap:wrap}
.siteNav a{color:#f6f0ff;text-decoration:none;font-weight:700;font-size:15px;padding:7px 12px;border-radius:999px;white-space:nowrap}
.siteNav a:hover{background:#ffffff14}
.siteHeader .playBtn{background:#ffe348;color:#21134f!important;text-decoration:none;font-weight:900;padding:9px 18px;border-radius:12px;box-shadow:0 4px 0 #b38f00;white-space:nowrap}
@media(max-width:900px){
 .siteHeader .inner{flex-wrap:wrap;gap:8px 12px;padding:8px 14px}
 .siteLogo{font-size:19px}.siteLogo img{width:32px;height:32px}
 .siteHeader .playBtn{margin-left:auto;padding:7px 14px}
 .siteNav{order:3;flex:1 0 100%;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding-bottom:4px;scrollbar-width:none}
 .siteNav::-webkit-scrollbar{display:none}
 .siteNav a{font-size:14px;padding:6px 11px;background:#ffffff10}
}
/* Durante la partida el menú se oculta para dejar toda la pantalla al juego */
body:has(#gameScreen.active) .siteHeader,body:has(#gameScreen.active) #siteLegalFooter{display:none}
