/* RetroClassic: Mapa del Mundo y fichas de mapa (fondo oscuro, como el Salón de la Fama) */
.mm { color: var(--rc-texto); font-family: var(--rc-cuerpo); }
.mm a { color: inherit; }
.mm-vacio { text-align: center; padding: 40px 10px; color: var(--rc-texto2); }
.mm-cab { text-align: center; margin-bottom: 18px; }
.mm-cifras { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 12px; }
.mm-cifras span { background: rgba(255, 255, 255, .06); border: 1px solid rgba(243, 197, 91, .25); border-radius: 999px; padding: 5px 13px; font-size: .9em; color: var(--rc-texto2); }
.mm-cifras b { color: var(--rc-oro); }

/* Escena: barra + mapa, centrada y del tamaño de la pantalla (el mapa entero cabe a la vista) */
.mm-escena { width: min(100%, calc((100vh - 200px) * 1.25)); min-width: min(100%, 560px); margin: 0 auto; }
.mm-escena .mm-barra { grid-template-columns: 1fr 1fr; }
.mm-escena .mm-capas { grid-column: 1 / -1; justify-content: center; }
.mm-aviso-zoom { position: absolute; z-index: 36; left: 50%; top: 50%; transform: translate(-50%, -50%); padding: 12px 20px; border-radius: 12px; background: rgba(14, 11, 31, .9); border: 1px solid rgba(243, 197, 91, .5); color: var(--rc-texto); pointer-events: none; white-space: nowrap; box-shadow: var(--rc-sombra); }
.mm kbd { display: inline-block; padding: 1px 6px; border-radius: 5px; border: 1px solid rgba(243, 197, 91, .5); background: rgba(255, 255, 255, .08); font: inherit; font-size: .9em; color: var(--rc-oro-claro); }

/* Barra de búsqueda y capas */
.mm-barra { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; margin-bottom: 12px; align-items: start; }
.mm-busca { position: relative; }
.mm-busca input { width: 100%; box-sizing: border-box; padding: 11px 14px 11px 40px; border-radius: 12px; border: 1px solid rgba(243, 197, 91, .35); background: rgba(14, 11, 31, .85); color: var(--rc-texto); font: inherit; outline: none; transition: border-color .2s, box-shadow .2s; }
.mm-busca input:focus { border-color: var(--rc-oro); box-shadow: 0 0 0 3px rgba(243, 197, 91, .18); }
.mm-busca input::placeholder { color: #8d84ad; }
.mm-lupa { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.mm-res { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 4px); margin: 0; padding: 4px; list-style: none; background: #17112f; border: 1px solid rgba(243, 197, 91, .35); border-radius: 12px; box-shadow: var(--rc-sombra); max-height: 340px; overflow: auto; }
.mm-res li a, .mm-res li > div { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 8px; text-decoration: none; cursor: pointer; }
.mm-res li a:hover, .mm-res li a.sel { background: rgba(243, 197, 91, .14); }
.mm-res img { width: 32px; height: 32px; object-fit: contain; image-rendering: pixelated; }
.mm-res small { color: var(--rc-texto2); margin-left: auto; white-space: nowrap; }
.mm-res .mm-r-mapas { display: block; padding: 0 10px 8px 52px; font-size: .86em; color: var(--rc-texto2); }
.mm-res .mm-r-mapas a { display: inline-block; padding: 2px 8px; margin: 2px 3px 0 0; background: rgba(255, 255, 255, .06); border-radius: 6px; color: var(--rc-oro-claro); }
.mm-res .mm-r-mapas a:hover { background: rgba(243, 197, 91, .2); }
.mm-res .mm-r-vacio { padding: 10px; color: var(--rc-texto2); }
.mm-capas { display: flex; gap: 6px; flex-wrap: wrap; }
.mm-capas label { display: flex; align-items: center; gap: 6px; padding: 9px 12px; border-radius: 12px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); cursor: pointer; white-space: nowrap; font-size: .92em; user-select: none; }
.mm-capas input { accent-color: var(--rc-oro); }

/* Lienzo con zoom */
.mm-marco { position: relative; overflow: hidden; border-radius: 18px; background: #0b1630; box-shadow: 0 30px 70px rgba(0, 0, 0, .55), 0 0 0 1px rgba(243, 197, 91, .4); aspect-ratio: 1280 / 1024; touch-action: none; cursor: grab; }
.mm-marco.arrastrando { cursor: grabbing; }
.mm-lienzo { position: absolute; inset: 0; transform-origin: 0 0; will-change: transform; }
.mm-fondo { display: block; width: 100%; height: 100%; user-select: none; -webkit-user-drag: none; pointer-events: none; }
.mm-zona { position: absolute; border-radius: 3px; transition: background .15s, box-shadow .15s; }
.mm-zonas .mm-zona { box-shadow: inset 0 0 0 1px rgba(255, 233, 168, .35); }
.mm-zona:hover, .mm-zona:focus-visible, .mm-zona.marcada { background: rgba(243, 197, 91, .28); box-shadow: inset 0 0 0 2px var(--rc-oro); outline: none; z-index: 2; }
.mm-zona.mm-ciudad:hover { background: rgba(79, 179, 255, .28); box-shadow: inset 0 0 0 2px var(--rc-azul); }
.mm-zona.marcada { animation: mm-latido 1.1s ease-in-out 4; }
@keyframes mm-latido { 50% { background: rgba(243, 197, 91, .55); box-shadow: inset 0 0 0 3px #fff, 0 0 24px var(--rc-oro); } }
.mm-dun { position: absolute; display: grid; place-items: center; padding: 0; border: 0; background: none; cursor: pointer; z-index: 3; }
.mm-dun i { font-style: normal; font-size: 12px; font-family: 'Segoe UI Symbol', 'Noto Sans Symbols 2', sans-serif; color: var(--rc-oro-claro); line-height: 1; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: rgba(120, 22, 40, .9); border: 2px solid var(--rc-oro); box-shadow: 0 0 10px rgba(243, 197, 91, .45); transition: transform .15s; }
.mm-dun:hover i, .mm-dun.abierto i, .mm-dun.marcada i { transform: scale(1.3); background: var(--rc-oro2); }
.mm-dun.marcada i { animation: mm-brillo 1.1s ease-in-out 4; }
@keyframes mm-brillo { 50% { box-shadow: 0 0 0 6px rgba(243, 197, 91, .5), 0 0 24px #fff; } }
.mm-pisos { position: absolute; z-index: 25; min-width: 230px; max-width: 280px; padding: 8px; background: #17112f; border: 1px solid rgba(243, 197, 91, .45); border-radius: 12px; box-shadow: var(--rc-sombra); transform-origin: 0 0; }
.mm-pisos b { display: block; padding: 4px 8px 6px; color: var(--rc-oro); font-family: var(--rc-titulos); }
.mm-pisos a { display: flex; justify-content: space-between; gap: 10px; padding: 6px 8px; border-radius: 8px; text-decoration: none; font-size: .9em; }
.mm-pisos a:hover { background: rgba(243, 197, 91, .14); }
.mm-pisos small, .mm-pisos-lado small { color: var(--rc-texto2); white-space: nowrap; }
.mm-jefe { position: absolute; z-index: 4; transform: translate(-50%, -88%); display: block; line-height: 0; transition: transform .15s, filter .15s; filter: drop-shadow(0 0 3px rgba(0, 0, 0, .9)); font-size: 16px; }
.mm-jefe img { max-width: 34px; max-height: 40px; image-rendering: pixelated; }
.mm-j-mvp { filter: drop-shadow(0 0 2px #000) drop-shadow(0 0 5px rgba(255, 93, 108, .9)); }
.mm-j-mini { filter: drop-shadow(0 0 2px #000) drop-shadow(0 0 4px rgba(79, 179, 255, .8)); }
.mm-j-mini img { max-width: 26px; max-height: 30px; }
.mm-jefe:hover, .mm-jefe.marcada { transform: translate(-50%, -88%) scale(1.5); z-index: 6; }
/* Iconos con tamaño fijo aunque se haga zoom */
.mm-lienzo { --s: 1; }
.mm-jefe { transform: translate(-50%, -88%) scale(calc(1 / var(--s))); transform-origin: 50% 88%; }
.mm-jefe:hover, .mm-jefe.marcada { transform: translate(-50%, -88%) scale(calc(1.5 / var(--s))); }
.mm-dun i { transform: scale(calc(1 / var(--s))); }
.mm-dun:hover i, .mm-dun.abierto i, .mm-dun.marcada i { transform: scale(calc(1.3 / var(--s))); }
.mm-sin-mvp .mm-j-mvp, .mm-sin-mini .mm-j-mini { display: none; }
.mm-tip { position: absolute; z-index: 40; pointer-events: none; padding: 7px 11px; border-radius: 10px; background: rgba(14, 11, 31, .94); border: 1px solid rgba(243, 197, 91, .5); box-shadow: 0 8px 22px rgba(0, 0, 0, .5); white-space: nowrap; }
.mm-tip b { display: block; color: var(--rc-oro-claro); }
.mm-tip small { color: var(--rc-texto2); }
.mm-zoom { position: absolute; right: 12px; top: 12px; z-index: 35; display: flex; flex-direction: column; gap: 6px; }
.mm-zoom button { width: 36px; height: 36px; border-radius: 10px; border: 1px solid rgba(243, 197, 91, .5); background: rgba(14, 11, 31, .85); color: var(--rc-oro); font-size: 18px; cursor: pointer; }
.mm-zoom button:hover { background: var(--rc-oro2); color: #fff; }
.mm-ayuda { text-align: center; color: var(--rc-texto2); font-size: .86em; margin: 8px 0 26px; }

/* Índice */
.mm-indice h3, .mm-mobs h3 { font-family: var(--rc-titulos); color: var(--rc-oro); font-size: 1.35em; margin: 0 0 10px; }
.mm-filtros { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.mm-filtros button { padding: 7px 14px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .05); color: var(--rc-texto); cursor: pointer; font: inherit; font-size: .92em; }
.mm-filtros button.activo { background: var(--rc-oro2); border-color: var(--rc-oro); color: #fff; }
.mm-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 6px; }
.mm-lista a { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; padding: 8px 12px; border-radius: 10px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .07); text-decoration: none; min-height: 52px; box-sizing: border-box; transition: background .15s, border-color .15s; }
.mm-lista a:hover { background: rgba(243, 197, 91, .1); border-color: rgba(243, 197, 91, .45); }
.mm-l-nom { font-weight: 700; flex: 1 1 100%; }
.mm-lista code, .mm-codigo code { font-size: .8em; color: #a99fd0; background: rgba(255, 255, 255, .07); padding: 1px 6px; border-radius: 5px; }
.mm-lista small { color: var(--rc-texto2); font-size: .82em; }
.mm-l-jefe { width: 22px; height: 22px; object-fit: contain; image-rendering: pixelated; margin-left: auto; }
.mm-l-jefe + .mm-l-jefe { margin-left: 0; }

/* Ficha de mapa */
.mm-volver { margin: 0 0 12px; }
.mm-volver a { color: var(--rc-oro); text-decoration: none; font-weight: 700; }
.mm-volver a:hover { text-decoration: underline; }
.mm-ficha-cab { margin-bottom: 18px; }
.mm-ficha-cab .rk-titulo { text-align: left; margin: 6px 0 4px; }
.mm-codigo { color: var(--rc-texto2); margin: 0; }
.mm-codigo b { color: var(--rc-oro-claro); }
.mm-etq { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: .82em; font-weight: 700; background: rgba(78, 224, 138, .15); color: var(--rc-verde); }
.mm-etq.mm-mazmorra { background: rgba(255, 93, 108, .15); color: var(--rc-rojo); }
.mm-etq.mm-ciudad { background: rgba(79, 179, 255, .15); color: var(--rc-azul); }
.mm-ficha-grid { display: grid; grid-template-columns: 300px 1fr; gap: 22px; align-items: start; }
.mm-ficha-lado { display: grid; gap: 14px; position: sticky; top: 90px; }
.mm-ficha-lado figure { margin: 0; }
.mm-ficha-lado figcaption { text-align: center; color: var(--rc-texto2); font-size: .84em; margin-top: 5px; }
.mm-mini img { display: block; width: 100%; border-radius: 14px; box-shadow: 0 0 0 1px rgba(243, 197, 91, .4), 0 14px 34px rgba(0, 0, 0, .5); image-rendering: pixelated; background: #000; }
.mm-situ-img { display: block; position: relative; aspect-ratio: 16 / 10; border-radius: 14px; background-size: 360% auto; background-position: var(--x) var(--y); box-shadow: 0 0 0 1px rgba(243, 197, 91, .4); overflow: hidden; }
.mm-situ-img i { position: absolute; width: 18px; height: 18px; border-radius: 50%; border: 3px solid #fff; background: var(--rc-rojo); box-shadow: 0 0 0 4px rgba(255, 93, 108, .4), 0 0 18px var(--rc-rojo); left: calc(var(--x) - 12px); top: calc(var(--y) - 12px); animation: mm-brillo 1.6s ease-in-out infinite; }
.mm-pisos-lado { display: grid; gap: 3px; padding: 10px; border-radius: 14px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08); }
.mm-pisos-lado b { color: var(--rc-oro); font-family: var(--rc-titulos); padding: 0 6px 4px; }
.mm-pisos-lado a { display: flex; justify-content: space-between; gap: 8px; padding: 6px 8px; border-radius: 8px; text-decoration: none; font-size: .92em; }
.mm-pisos-lado a:hover { background: rgba(243, 197, 91, .1); }
.mm-pisos-lado a.activo { background: rgba(243, 197, 91, .2); color: var(--rc-oro-claro); font-weight: 700; }
.mm-nota { color: var(--rc-texto2); font-size: .88em; margin: -4px 0 12px; }
.mm-mob { border-radius: 12px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08); margin-bottom: 7px; transition: border-color .15s; }
.mm-mob[open], .mm-mob:hover { border-color: rgba(243, 197, 91, .45); }
.mm-mob-mvp { border-color: rgba(255, 93, 108, .45); background: linear-gradient(90deg, rgba(255, 93, 108, .1), rgba(255, 255, 255, .03)); }
.mm-mob-mini { border-color: rgba(79, 179, 255, .4); background: linear-gradient(90deg, rgba(79, 179, 255, .08), rgba(255, 255, 255, .03)); }
.mm-mob summary { display: grid; grid-template-columns: 56px 1fr repeat(4, 86px); align-items: center; gap: 8px; padding: 8px 12px; cursor: pointer; list-style: none; }
.mm-mob summary::-webkit-details-marker { display: none; }
.mm-mob-spr { display: grid; place-items: center; height: 56px; }
.mm-mob-spr img { max-width: 56px; max-height: 56px; image-rendering: pixelated; }
.mm-mob-nom b { font-size: 1.05em; }
.mm-mob-nom em { font-style: normal; font-size: .8em; font-weight: 700; color: var(--rc-oro); margin-left: 4px; }
.mm-mob-nom small { display: block; color: var(--rc-texto2); font-size: .82em; }
.mm-dato { text-align: center; }
.mm-dato small { display: block; color: var(--rc-texto2); font-size: .74em; text-transform: uppercase; letter-spacing: .04em; }
.mm-dato b { color: var(--rc-oro-claro); font-size: .95em; }
.mm-mob-det { padding: 4px 14px 12px 76px; }
.mm-mob-det p { display: flex; flex-wrap: wrap; gap: 6px 16px; color: var(--rc-texto2); margin: 0 0 8px; font-size: .9em; }
.mm-mob-det p b { color: var(--rc-texto); }
.mm-mob-det p a { margin-left: auto; color: var(--rc-oro); font-weight: 700; text-decoration: none; }
.mm-mob-det h4 { margin: 8px 0 5px; font-size: .86em; text-transform: uppercase; letter-spacing: .06em; color: var(--rc-oro); }
.mm-drops { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 4px; }
.mm-drops li { display: flex; justify-content: space-between; gap: 8px; padding: 5px 9px; border-radius: 7px; background: rgba(0, 0, 0, .25); font-size: .88em; }
.mm-drops li b { color: var(--rc-verde); white-space: nowrap; }
.mm-drops li.mm-carta { box-shadow: inset 0 0 0 1px rgba(243, 197, 91, .45); }
.mm-drops li.mm-carta b { color: var(--rc-oro); }

@media (max-width: 600px) {
	.mm-jefe img { max-width: 18px; max-height: 22px; }
	.mm-j-mini img { max-width: 14px; max-height: 17px; }
	.mm-dun i { width: 14px; height: 14px; font-size: 8px; border-width: 1px; }
	.mm-aviso-zoom { white-space: normal; text-align: center; width: 80%; }
}
@media (max-width: 900px) {
	.mm-barra, .mm-escena .mm-barra { grid-template-columns: 1fr; }
	.mm-ficha-grid { grid-template-columns: 1fr; }
	.mm-ficha-lado { position: static; grid-template-columns: 1fr 1fr; }
	.mm-pisos-lado { grid-column: 1 / -1; }
	.mm-mob summary { grid-template-columns: 48px 1fr repeat(2, 70px); }
	.mm-mob summary .mm-dato:nth-of-type(n+3) { display: none; }
	.mm-mob-det { padding-left: 14px; }
}
@media (prefers-reduced-motion: reduce) {
	.mm-zona.marcada, .mm-dun.marcada i, .mm-situ-img i { animation: none; }
}