/* =============================================================================
   forum-fx.css — MaeloRO 09/10/2026. Foro: iconos del cliente RO, ficha de personaje y efectos de luz (lote 3).
   -----------------------------------------------------------------------------
   Va la ULTIMA, despues de forum-2026.css (inc/layout.php), junto con forum-fx.js (que mete los iconos en los
   textos y la barra de EXP) y /maeloro-fx.js (golpe dorado, linea de progreso, fila de personajes del pie).
   Solo aspecto: mismos colores (oro, lila, menta; azul Jedi / rojo Sith), mismos textos y enlaces.
     - cada emoji del sistema se cambia por un icono del cliente (el emoji sigue en el HTML a tamano 0, para los
       lectores de pantalla, igual que .nav-logo-icon en forum-2026.css);
     - la columna del autor del post es una ficha de personaje: anillo oro + aura, insignia con icono, rango en
       Cinzel y barra de EXP que crece con los posts;
     - filo de sable bajo la barra superior, luz dorada en las cabeceras, Poring en los huecos vacios;
     - perfil: emblema y sprite de clase en el banner (y arreglo del avatar, que flotaba fuera de la tarjeta).
   Todo lo que se mueve esta dentro de (prefers-reduced-motion: no-preference); el movimiento del raton solo con
   (hover: hover). Para desactivarla: quitar el <link> de forum-fx.css (y el <script> de forum-fx.js) en
   inc/layout.php.
   ============================================================================= */

:root {
	--ffx-oro: #c9a84c;
	--ffx-oro-claro: #e8c56e;
	--ffx-oro-vivo: #ffd700;
	--ffx-lila: rgba(91, 143, 180, .5);
	--ffx-azul: rgba(60, 160, 255, .55);
	--ffx-rojo: rgba(255, 60, 70, .55);
	--ffx-noche: #0a1014;
	--ffx-ico: center / contain no-repeat;
}

/* ---------- 1. glifos: el JS envuelve cada emoji de texto en <span class="mro-glifo" data-g="..."> ---------- */
.mro-glifo {
	display: inline-block; position: relative; width: 18px; height: 18px; font-size: 0; line-height: 1;
	vertical-align: middle; margin-top: -2px; flex: 0 0 auto;   /* middle: con font-size 0 la linea base caeria arriba y el icono colgaria bajo el texto */
	background: var(--ffx-ico); 
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .6));
}
.mro-glifo[data-g="anuncio"]  { background-image: url('/forum/img/correo.png'); }
.mro-glifo[data-g="charla"]   { background-image: url('/forum/img/charla.png'); }
.mro-glifo[data-g="stats"]    { background-image: url('/forum/img/stats.png'); }
.mro-glifo[data-g="online"]   { background-image: url('/forum/img/online.png'); }
.mro-glifo[data-g="unirse"]   { background-image: url('/forum/img/charla.png'); }
.mro-glifo[data-g="inicio"]   { background-image: url('/forum/img/inicio.png'); border-radius: 5px; }
.mro-glifo[data-g="gremio"]   { background-image: url('/forum/img/gremio.png'); }
.mro-glifo[data-g="fijado"]   { background-image: url('/forum/img/fijado.png'); }
.mro-glifo[data-g="cerrado"]  { background-image: url('/forum/img/cerrado.png'); }
.mro-glifo[data-g="abierto"]  { background-image: url('/forum/img/cerrado.png'); }
.mro-glifo[data-g="buscar"]   { background-image: url('/forum/img/buscar.png'); }
.mro-glifo[data-g="correo"]   { background-image: url('/forum/img/correo.png'); }
.mro-glifo[data-g="enviado"]  { background-image: url('/forum/img/enviado.png'); }
.mro-glifo[data-g="editar"]   { background-image: url('/forum/img/editar.png'); }
.mro-glifo[data-g="borrar"]   { background-image: url('/forum/img/borrar.png'); }
.mro-glifo[data-g="reportar"] { background-image: url('/forum/img/reportar.png'); }
/* "Who's Online": el punto verde sigue ahi, en la esquina del icono, y late */
.mro-glifo[data-g="online"]::after {
	content: ''; position: absolute; right: -3px; bottom: -2px; width: 7px; height: 7px; border-radius: 50%;
	background: var(--green); box-shadow: 0 0 0 1px var(--ffx-noche), 0 0 6px var(--green);
}
/* tamanos segun donde cae */
.btn .mro-glifo { width: 16px; height: 16px; }
.nav-link .mro-glifo { width: 20px; height: 20px; filter: drop-shadow(0 0 6px rgba(255, 215, 0, .35)); }
.footer-logo .mro-glifo { width: 22px; height: 22px; margin-right: 2px; }
.sidebar-card-title .mro-glifo, .search-section-title .mro-glifo { width: 20px; height: 20px; margin-right: 2px; }
.search-box h2 .mro-glifo, .reply-box h3 .mro-glifo, .newthread-wrap h2 .mro-glifo { width: 24px; height: 24px; margin-right: 4px; }
.auth-header h1 .mro-glifo { width: 28px; height: 28px; margin-right: 4px; }
.closed-notice .mro-glifo, .alert .mro-glifo { width: 18px; height: 18px; margin-right: 3px; }
@media (hover: hover) {
	.footer-logo:hover .mro-glifo[data-g="gremio"] { background-image: url('/forum/img/gremio.png'); }
	.btn:hover .mro-glifo[data-g="editar"] { background-image: url('/forum/img/editar.png'); }
	.btn:hover .mro-glifo[data-g="charla"] { background-image: url('/forum/img/charla.png'); }
}

/* ---------- 2. emojis que ya van en su propio elemento: se cambian solo con CSS (sin depender del JS) ---------- */
/* aviso: buzon RODEX del juego, con un halo dorado detras */
.announcement-icon {
	position: relative; isolation: isolate; font-size: 0; width: 40px; height: 40px; flex: 0 0 40px; align-self: center;
	background: url('/forum/img/correo.png') center / 36px 36px no-repeat; 
}
.announcement-icon::before {
	content: ''; position: absolute; inset: -8px; border-radius: 50%; z-index: -1; pointer-events: none;
	background: radial-gradient(circle, rgba(232, 197, 110, .32), transparent 70%);
}
/* filas del indice: el icono es un valor de la base de datos (💬); se decide por el id del foro */
.forum-icon {
	font-size: 0; width: 36px; height: 36px; margin: 0 auto;
	background: url('/forum/img/charla.png') var(--ffx-ico); 
	transition: transform .25s cubic-bezier(.2, .7, .2, 1);
}
.forum-row:has(a[href*="forum.php?id=3"]) .forum-icon { background-image: url('/forum/img/guias.png'); }
@media (hover: hover) {
	.forum-row:hover .forum-icon { background-image: url('/forum/img/charla.png'); transform: translateY(-2px) scale(1.1); }
	.forum-row:hover:has(a[href*="forum.php?id=3"]) .forum-icon { background-image: url('/forum/img/guias.png'); }
}
/* cabecera de forum.php: el JS pone data-mro-foro="<id>" en el <body> (aqui no hay enlace con el id) */
.forum-info-header .fih-icon {
	font-size: 0; width: 44px; height: 44px; flex: 0 0 44px;
	background: url('/forum/img/charla.png') var(--ffx-ico); 
	filter: drop-shadow(0 0 8px rgba(201, 168, 76, .45)) drop-shadow(0 4px 8px rgba(0, 0, 0, .6));
}
body[data-mro-foro="3"] .fih-icon { background-image: url('/forum/img/guias.png'); }
/* fijado = MVP; cerrado/bloqueado = llave de la Torre del Reloj */
.pinned-icon, .closed-icon {
	display: inline-block; font-size: 0; line-height: 1; width: 16px; height: 16px; flex: 0 0 16px; vertical-align: middle; margin-top: -2px;
	background: var(--ffx-ico); 
}
.pinned-icon { background-image: url('/forum/img/fijado.png'); filter: drop-shadow(0 0 3px rgba(255, 215, 0, .7)); }
.closed-icon { background-image: url('/forum/img/cerrado.png'); opacity: .85; }
.thread-header h1 .pinned-icon, .thread-header h1 .closed-icon { width: 20px; height: 20px; flex-basis: 20px; }
/* hilos fijados: filo dorado a la izquierda, como al pasar el raton */
.thread-row:has(.pinned-icon) td:first-child { box-shadow: inset 3px 0 0 rgba(201, 168, 76, .5); }
@media (max-width: 640px) {
	.thread-row:has(.pinned-icon) td:first-child { box-shadow: none; }
	.thread-list tr.thread-row:has(.pinned-icon) { box-shadow: inset 3px 0 0 rgba(201, 168, 76, .5); }
}
/* categoria: el triangulo ▶ (style.css) pasa a ser el Emperium */
.category-title::before {
	font-size: 0; width: 22px; height: 22px; flex: 0 0 22px;
	background: url('/forum/img/admin.png') var(--ffx-ico); 
	filter: drop-shadow(0 0 5px rgba(232, 197, 110, .55));
}
/* huecos vacios (sin hilos, sin resultados, sin mensajes): un Poring quieto, 4 fotogramas de 48 px */
.empty-state-icon {
	font-size: 0; width: 48px; height: 48px; margin: 0 auto 12px;
	background: url('/forum/img/aviso.png') center / 48px 48px no-repeat; border-radius: 6px; animation: none !important;
}
/* punto verde de "usuarios online": un anillo que se abre */
.online-dot { position: relative; box-shadow: 0 0 6px rgba(46, 204, 113, .7); }
.online-dot::after {
	content: ''; position: absolute; inset: -3px; border-radius: 50%; border: 1px solid rgba(46, 204, 113, .85); opacity: 0;
}
/* ruta (breadcrumb): el mapa del juego delante */
.breadcrumb::before {
	content: ''; width: 16px; height: 16px; flex: 0 0 16px; margin-right: 2px; opacity: .85;
	background: url('/forum/img/buscar.png') var(--ffx-ico); 
}

/* ---------- 3. barra superior: filo de sable (azul Jedi → oro → rojo Sith) que se enciende al bajar ---------- */
.nav::after {
	content: ''; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; pointer-events: none; opacity: .55;
	background: linear-gradient(90deg, transparent 0%, rgba(60, 160, 255, .9) 14%, var(--ffx-oro-claro) 50%, rgba(255, 45, 60, .9) 86%, transparent 100%);
	transition: opacity .4s ease, box-shadow .4s ease;
}
body.mro-scrolled .nav::after { opacity: 1; box-shadow: 0 0 10px rgba(232, 197, 110, .45), 0 0 20px rgba(120, 160, 255, .25); }

/* ---------- 4. cabeceras: luz dorada en el borde superior ---------- */
.category-title, .threads-header, .sidebar-card-title, .card-header, .forum-info-header, .thread-header, .auth-header, .pm-view-header { position: relative; }
.category-title::after, .threads-header::after, .sidebar-card-title::after, .card-header::after, .forum-info-header::after, .thread-header::after, .auth-header::after, .pm-view-header::after {
	content: ''; position: absolute; top: 0; left: 6%; right: 6%; height: 1px; pointer-events: none; opacity: .75;
	background: linear-gradient(90deg, transparent, rgba(232, 197, 110, .9) 25%, rgba(232, 197, 110, .9) 75%, transparent);
}
.category-title::after { left: 3%; right: 3%; }

/* ---------- 5. post: la columna del autor como ficha de personaje ---------- */
.user-sidebar { position: relative; }
/* anillo oro con hueco oscuro de 2 px y aura lila; Admin aura Sith (roja), Moderador aura Jedi (azul) */
.user-sidebar > .avatar-img, .user-sidebar > .avatar-letter, .member-mini > .avatar-img, .member-mini > .avatar-letter {
	box-shadow: 0 0 0 2px var(--ffx-noche), 0 0 0 4px var(--ffx-oro), 0 0 18px 4px var(--ffx-lila);
	transition: transform .3s cubic-bezier(.2, .7, .2, 1), box-shadow .3s ease;
}
.user-sidebar:has(.badge[style*="e74c3c"]) > .avatar-img, .user-sidebar:has(.badge[style*="e74c3c"]) > .avatar-letter { box-shadow: 0 0 0 2px var(--ffx-noche), 0 0 0 4px var(--ffx-oro), 0 0 18px 4px var(--ffx-rojo); }
.user-sidebar:has(.badge[style*="3498db"]) > .avatar-img, .user-sidebar:has(.badge[style*="3498db"]) > .avatar-letter { box-shadow: 0 0 0 2px var(--ffx-noche), 0 0 0 4px var(--ffx-oro), 0 0 18px 4px var(--ffx-azul); }
@media (hover: hover) {
	.user-sidebar:hover > .avatar-img, .user-sidebar:hover > .avatar-letter { transform: translateY(-2px) scale(1.05); box-shadow: 0 0 0 2px var(--ffx-noche), 0 0 0 4px var(--ffx-oro-claro), 0 0 24px 6px var(--ffx-lila); }
}
/* insignia del grupo con icono del juego: Admin = Emperium, Moderador = gremio, Miembro = cara del personaje */
.badge { display: inline-flex; align-items: center; gap: 5px; }
.badge[style*="e74c3c"]::before, .badge[style*="3498db"]::before, .badge[style*="2ecc71"]::before {
	content: ''; width: 16px; height: 16px; flex: 0 0 16px; margin-left: -2px;
	background: var(--ffx-ico); 
}
.badge[style*="e74c3c"]::before { background-image: url('/forum/img/admin.png'); }
.badge[style*="3498db"]::before { background-image: url('/forum/img/gremio.png'); }
.badge[style*="2ecc71"]::before { background-image: url('/forum/img/gremio.png'); border-radius: 50%; box-shadow: 0 0 0 1px rgba(0, 0, 0, .35); }
/* rango por posts (lo pone el JS): Novice < 10, Apprentice < 50, Veteran < 200, Legend */
.mro-rango {
	display: inline-flex; align-items: center; gap: 5px; font-family: var(--mro-fuente-titulo, 'Cinzel', serif);
	font-weight: 700; font-size: .66rem; letter-spacing: 1px; text-transform: uppercase; color: var(--ffx-oro-claro);
	text-shadow: 0 0 8px rgba(232, 197, 110, .35); white-space: nowrap;
}
.mro-rango::before { content: ''; width: 16px; height: 16px; flex: 0 0 16px; background: var(--ffx-ico);  }
.mro-rango[data-rango="novice"]::before { background-image: url('/forum/img/rango-novice.png'); }
.mro-rango[data-rango="apprentice"]::before { background-image: url('/forum/img/rango-apprentice.png'); }
.mro-rango[data-rango="veteran"]::before { background-image: url('/forum/img/rango-veteran.png'); }
.mro-rango[data-rango="legend"]::before { background-image: url('/forum/img/rango-legend.png'); }
.mro-rango[data-rango="legend"] { color: var(--ffx-oro-vivo); text-shadow: 0 0 10px rgba(255, 215, 0, .6); }
/* barra de EXP: 4 px, oro, se llena hasta posts/200 (el JS pone --p entre 0 y 1) */
.mro-exp {
	width: 100%; max-width: 120px; height: 4px; margin: 1px auto 2px; border-radius: 2px; overflow: hidden;
	background: rgba(0, 0, 0, .55); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .8), 0 0 0 1px rgba(201, 168, 76, .3);
}
.mro-exp > i {
	display: block; height: 100%; border-radius: 2px;
	background: linear-gradient(90deg, #a8761c, var(--ffx-oro-claro) 60%, #fff1b8);
	box-shadow: 0 0 6px rgba(232, 197, 110, .7);
	transform: scaleX(var(--p, 0)); transform-origin: 0 50%;
	transition: transform 1.2s cubic-bezier(.2, .7, .2, 1) .15s;
}
/* post enlazado (#post-N desde la busqueda): filo dorado */
.post:target { box-shadow: inset 4px 0 0 var(--ffx-oro), inset 0 1px 0 var(--f3d-edge, rgba(255, 255, 255, .07)); }

/* ---------- 6. telefono (<= 600 px, donde style.css pone la columna en fila): rejilla de ficha ---------- */
@media (max-width: 600px) {
	.user-sidebar {
		display: grid; grid-template-columns: 60px minmax(0, 1fr) auto;
		grid-template-areas: 'ava nombre insignia' 'ava posts joined' 'ava rango rango' 'exp exp exp';
		align-items: center; column-gap: 12px; row-gap: 3px; text-align: left;
	}
	.user-sidebar > .avatar-img, .user-sidebar > .avatar-letter { grid-area: ava; }
	.user-sidebar > .sidebar-username { grid-area: nombre; }
	.user-sidebar > .badge { grid-area: insignia; justify-self: end; }
	.user-sidebar > .sidebar-stat { grid-area: posts; }
	.user-sidebar > .sidebar-joined { grid-area: joined; justify-self: end; }
	.user-sidebar > .mro-rango { grid-area: rango; }
	.user-sidebar > .mro-exp { grid-area: exp; max-width: none; margin: 6px 0 0; }
}
@media (max-width: 400px) {
	.user-sidebar > .mro-rango { display: none; }
	.user-sidebar { grid-template-areas: 'ava nombre insignia' 'ava posts joined' 'exp exp exp'; }
}

/* ---------- 7. perfil (member.php): banner con emblema y sprite de clase; avatar sobre el banner ---------- */
/* arreglo: .member-avatar-wrap es absolute pero .member-card no estaba posicionada, asi que el avatar caia abajo
   a la izquierda de la ventana; ahora cuelga del banner (80 px) y pisa su borde, que es lo que pretendia style.css */
.member-card { position: relative; }
.member-avatar-wrap { top: 44px; bottom: auto; z-index: 2; }
.member-avatar-wrap > .avatar-img, .member-avatar-wrap > .avatar-letter {
	box-shadow: 0 0 0 3px var(--ffx-noche), 0 0 0 5px var(--ffx-oro), 0 0 24px 6px var(--ffx-lila);
}
.member-card[data-mro-grupo="admin"] .member-avatar-wrap > .avatar-img, .member-card[data-mro-grupo="admin"] .member-avatar-wrap > .avatar-letter { box-shadow: 0 0 0 3px var(--ffx-noche), 0 0 0 5px var(--ffx-oro), 0 0 24px 6px var(--ffx-rojo); }
.member-card[data-mro-grupo="mod"] .member-avatar-wrap > .avatar-img, .member-card[data-mro-grupo="mod"] .member-avatar-wrap > .avatar-letter { box-shadow: 0 0 0 3px var(--ffx-noche), 0 0 0 5px var(--ffx-oro), 0 0 24px 6px var(--ffx-azul); }
.member-banner { overflow: hidden; }
/* emblema de la Orden Jedi como marca de agua (azul); Admin: emblema Imperial (rojo) */
.member-banner::before {
	content: ''; position: absolute; right: 120px; top: -34px; width: 150px; height: 150px; pointer-events: none; opacity: .16;
	background: url('/forum/img/emblema-mod.png') var(--ffx-ico); filter: hue-rotate(200deg) saturate(1.4);
}
.member-card[data-mro-grupo="admin"] .member-banner::before { background-image: url('/forum/img/emblema-admin.png'); filter: none; opacity: .2; }
/* sprite de pie a la derecha: Novice → Padawan → Jedi → Jedi Master segun el rango; Admin = Yoda; Moderador = Jedi Master */
.member-banner::after {
	content: ''; position: absolute; right: 26px; bottom: 0; width: 60px; height: 74px; pointer-events: none;
	background: url('/forum/img/rango-novice.png') center bottom / auto 74px no-repeat; 
	filter: drop-shadow(0 0 7px rgba(80, 170, 255, .7)) drop-shadow(0 4px 4px rgba(0, 0, 0, .6));
}
.member-card[data-mro-rango="apprentice"] .member-banner::after { background-image: url('/forum/img/rango-apprentice.png'); }
.member-card[data-mro-rango="veteran"] .member-banner::after { background-image: url('/forum/img/rango-veteran.png'); }
.member-card[data-mro-rango="legend"] .member-banner::after { background-image: url('/forum/img/rango-legend.png'); }
.member-card[data-mro-grupo="mod"] .member-banner::after { background-image: url('/forum/img/rango-legend.png'); }
.member-card[data-mro-grupo="admin"] .member-banner::after {
	background-image: url('/forum/img/emblema-admin.png'); height: 70px; background-size: auto 70px;
	filter: drop-shadow(0 0 7px rgba(255, 215, 0, .7)) drop-shadow(0 4px 4px rgba(0, 0, 0, .6));
}
/* rango + EXP junto al contador de posts */
.member-stats .mro-ficha { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; }
.member-stats .mro-ficha .mro-rango { font-size: .72rem; }
.member-stats .mro-ficha .mro-exp { width: 120px; margin: 0; }

/* ---------- 8. pie: fila de personajes que mete maeloro-fx.js (la misma de la portada), centrada sobre la linea ---------- */
.footer-inner > .mro-pie-fila {
	flex: 1 1 100%; order: -1; display: flex; justify-content: center; align-items: flex-end; gap: 18px;
	margin: -4px 0 6px; padding: 0 8px 10px; border-bottom: 1px solid rgba(201, 168, 76, .2);
}
.mro-pie-fila img {
	display: block; height: 56px; width: auto; 
	filter: drop-shadow(0 6px 6px rgba(0, 0, 0, .65));
	transition: translate .25s ease, scale .25s ease, filter .25s ease;
}
.mro-pie-fila img.sw { filter: drop-shadow(0 0 6px var(--ffx-azul)) drop-shadow(0 6px 6px rgba(0, 0, 0, .65)); }
.mro-pie-fila img.sw.sith { filter: drop-shadow(0 0 6px var(--ffx-rojo)) drop-shadow(0 6px 6px rgba(0, 0, 0, .65)); }
@media (hover: hover) {
	.mro-pie-fila img:hover { translate: 0 -6px; scale: 1.1; filter: drop-shadow(0 0 10px rgba(255, 215, 0, .8)) drop-shadow(0 8px 8px rgba(0, 0, 0, .7)); }
}
@media (max-width: 600px) {
	.footer-inner > .mro-pie-fila { gap: 12px; }
	.mro-pie-fila img { height: 48px; }
	.mro-pie-fila img.ro { display: none; }
}

/* ---------- 9. efectos de maeloro-fx.js que en el foro no tenian estilo (en la portada viven en home-fx-2026.css) ---------- */
/* golpe dorado al pulsar un boton */
.mro-pos { position: relative; }
.btn.mro-pos, .nav-link.mro-pos, .pager-btn.mro-pos, .bb-btn.mro-pos { overflow: hidden; }
.mro-golpe {
	position: absolute; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; pointer-events: none;
	background: radial-gradient(circle, rgba(255, 244, 200, .95) 0%, rgba(255, 215, 0, .55) 45%, transparent 70%);
}
/* linea de progreso de lectura (azul Jedi → oro → rojo Sith); se ve en cuanto se baja de la cabecera */
.mro-progreso {
	position: fixed; top: 0; left: 0; width: 100%; height: 3px; z-index: 9998; pointer-events: none;
	transform-origin: 0 50%; transform: scaleX(0); opacity: 0; transition: opacity .3s ease;
	background: linear-gradient(90deg, rgba(60, 160, 255, .95), var(--ffx-oro-vivo) 50%, rgba(255, 45, 60, .95));
	box-shadow: 0 0 8px rgba(255, 215, 0, .55);
}
body.mro-scrolled .mro-progreso { opacity: 1; }
/* inclinacion 3D + destello para las tarjetas (cuando maeloro-fx.js incluya .sidebar-card, .announcement, .member-mini y .search-result) */
.mro-sheen {
	position: absolute; inset: 0; pointer-events: none; border-radius: inherit; z-index: 1;
	background: radial-gradient(140px circle at var(--mx, 50%) var(--my, 50%), rgba(255, 255, 255, .3), transparent 62%);
	mix-blend-mode: soft-light; opacity: 0; transition: opacity .25s ease;
}
.mro-tilt > .mro-sheen { opacity: 1; }
.mro-raton .sidebar-card, .mro-raton .announcement, .mro-raton .member-mini, .mro-raton .search-result { position: relative; transform-style: preserve-3d; }
.mro-raton .sidebar-card.mro-tilt, .mro-raton .announcement.mro-tilt, .mro-raton .member-mini.mro-tilt, .mro-raton .search-result.mro-tilt {
	transform: perspective(900px) rotateX(calc(var(--ty, 0) * -1 * var(--mro-max, 4deg))) rotateY(calc(var(--tx, 0) * var(--mro-max, 4deg))) translateY(-2px);
	transition: transform .12s linear, box-shadow .25s ease;
	box-shadow: var(--f3d-card-hover, 0 22px 44px -14px rgba(0, 0, 0, .95));
}

/* ---------- 10. movimiento (solo si el sistema no pide reducirlo) ---------- */
@media (prefers-reduced-motion: no-preference) {
	.empty-state-icon { animation: ffxPoring 1.2s steps(4) infinite; }
	@keyframes ffxPoring { to { background-position: -192px 0; } }
	.online-dot::after { animation: ffxPulso 2.2s ease-out infinite; }
	@keyframes ffxPulso { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(2.3); opacity: 0; } }
	.mro-glifo[data-g="online"]::after { animation: ffxLate 2.2s ease-in-out infinite; }
	@keyframes ffxLate { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
	.announcement-icon { animation: ffxFlota 3.6s ease-in-out infinite; }
	@keyframes ffxFlota { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
	.mro-golpe { animation: ffxGolpe .65s ease-out forwards; }
	@keyframes ffxGolpe { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(14); opacity: 0; } }
	.mro-pie-fila img { animation: ffxRespira 3.4s ease-in-out infinite; }
	.mro-pie-fila img:nth-child(2n) { animation-delay: -.9s; }
	.mro-pie-fila img:nth-child(3n) { animation-delay: -1.7s; }
	.mro-pie-fila img:nth-child(5n) { animation-delay: -2.6s; }
	@keyframes ffxRespira { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
	.member-banner::after { animation: ffxRespira 4s ease-in-out infinite; }
}

/* ---------- 11. sin movimiento: todo quieto y visible ---------- */
@media (prefers-reduced-motion: reduce) {
	.mro-progreso, .mro-golpe { display: none; }
	.mro-exp > i, .nav::after, .forum-icon, .user-sidebar > .avatar-img, .user-sidebar > .avatar-letter, .mro-pie-fila img { transition: none; }
	.online-dot::after { display: none; }
	.mro-sheen { display: none; }
}

/* ---------- 12. imagen de otro sitio que no se pudo traer: enlace "Open image" en lugar del icono roto (forum-fx.js) ---------- */
.mro-img-rota {
	display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 10px; font-size: .85rem; font-weight: 600;
	color: var(--ffx-oro-claro); background: rgba(201, 168, 76, .08); border: 1px dashed rgba(201, 168, 76, .45);
}
a:hover > .mro-img-rota { background: rgba(201, 168, 76, .16); }