/* Barra de la capa Fables en las pantallas de cuenta y en la puerta del Workbook (inc/fables-setup.php,
   moodz_cuenta_con_barra). Mismas medidas que la nav: módulo 70, pill 34 × 250, borde 1px, mayúsculas espaciadas. */
.mz-cuenta-barra {
	position: relative; z-index: 50; box-sizing: border-box;
	display: flex; align-items: center; justify-content: space-between; gap: 8px;
	width: 100%; height: 70px; padding: 0 16px;
	font-family: 'Inter', system-ui, sans-serif;
	--mzc-tinta: #F2EEE5; --mzc-borde: rgba(232, 201, 117, .42); --mzc-borde-hover: #E8C975; --mzc-oro: #E8C975;
}
.mz-cuenta-barra--claro { --mzc-tinta: #1C1814; --mzc-borde: #8A7F6E; --mzc-borde-hover: #1C1814; --mzc-oro: #A8821A; }
.mz-cuenta-barra a {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px; box-sizing: border-box;
	height: 34px; padding: 0 14px; border: 1px solid var(--mzc-borde); border-radius: 999px;
	color: var(--mzc-tinta); text-decoration: none; white-space: nowrap;
	font-size: 11.5px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase;
	transition: border-color .3s cubic-bezier(.22, .61, .36, 1), color .3s cubic-bezier(.22, .61, .36, 1);
}
.mz-cuenta-barra a:hover, .mz-cuenta-barra a:focus-visible { border-color: var(--mzc-borde-hover); }
.mz-cuenta-barra a:focus-visible { outline: 2px solid var(--mzc-oro); outline-offset: 2px; }
.mz-cuenta-barra__marca { width: 250px; justify-content: flex-start !important; }
.mz-cuenta-barra .mz-wordmark { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 15px; font-weight: 500; letter-spacing: .38em; transform: translateY(1px); }
.mz-cuenta-barra .mz-wordmark em { color: var(--mzc-oro); }
.mz-cuenta-barra .mz-wordmark i { font-style: normal; margin-right: -.38em; }
@media (max-width: 600px) {
	.mz-cuenta-barra { height: 64px; }
	.mz-cuenta-barra__marca { width: auto; }
	.mz-cuenta-barra a { height: 40px; letter-spacing: .14em; }
}
/* El wordmark pequeño de cada pantalla queda en la barra. */
.login-wordmark, .reg-wordmark, .oc-wordmark, .vf-wordmark { display: none !important; }
