/**
 * Portal de funcionarios — app densa (58.51).
 *
 * Rediseño a pantalla completa: el dato va primero, el cromo al mínimo.
 * Hospital interno: grillas apretadas, tipo legible (system-ui / iOS),
 * sin cajas vacías ni “ver más” que esconda hechos. Todo el campo sigue
 * visible; solo cambia el empaque.
 *
 * 58.60 — Inicio: llena el viewport y la composición va al centro
 * (no columna 1120px pegada a la izquierda). Pie de crédito centrado.
 * 58.61 — Cromo fijo: html/body de la app no scrollean; cabecera y menú
 * quedan quietos. Solo tablas y el recuadro de listado (.fp-list-scroll)
 * tienen overflow. Ingreso/alta siguen pudiendo desplazarse (teclado).
 * 58.59 — Acceso: Puertas en tarjetas y Movimientos en bitácora por día
 * (se dejó la tabla de columnas fijas, que partía el texto).
 * 58.54 — Acceso: pestañas Puertas | Movimientos (seccion=). Movimientos
 * muestra eventos de barrera del titular por ID de usuario, aunque la
 * tarjeta no coincida. Puertas sigue sin columna origen.
 * 58.52 — Sistema: PIN y Auditoría son subpaneles (seccion=). Auditoría
 * agrupada por accion real; chips filtran grupos, no esconden columnas.
 * Cabecera fija; documento scrollea en vertical; tablas sin overflow-x.
 * Safari/Chrome/Firefox: 100vh luego 100dvh / --ms-app-height; overlays
 * top/right/bottom/left antes de inset; color sólido antes de color-mix;
 * inputs 16 px (iOS no hace zoom).
 *
 * 58.57 — Alta (/portal/registro.php): mismo diseño que el ingreso,
 * a todo el alto y el ancho, 100% responsive.
 * 58.56 — Ingreso (/portal/login.php): tarjeta centrada sobre fondo
 * institucional (no grilla partida). Registro sigue en .fp-page--registro.
 * 58.43 — minisys-btn-square.css aplica width:max-content a [class*="-btn"].
 * Los CTA del portal (.fp-btn, .fp-step-btn, .lg-btn-*) se excluyen allí
 * y se refuerzan aquí con !important para que se vean botones de verdad
 * (navy, ≥44 px), no cuadrados de 20 px.
 * 58.95 — Login y app en celular: membrete compacto, Restablecer ≥44 px,
 * menú debajo de la barra (no tapa Inicio), Actas con un solo scroller.
 */
/*
 * 58.61 — App autenticada: un viewport recortado. html/body overflow
 * hidden; cabecera fixed. El listado/tablas scrollean por dentro.
 * Ingreso y alta (guest) siguen con overflow-y auto por el teclado.
 */
html.fp-html {
    margin: 0;
    min-height: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    min-height: var(--ms-app-height, 100vh);
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

html.fp-html:not(.fp-html--login) {
    height: 100%;
    height: 100vh;
    height: 100dvh;
    height: var(--ms-app-height, 100vh);
    max-height: 100%;
    overflow: hidden;
}

body.fp-page {
    margin: 0;
    min-height: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    min-height: var(--ms-app-height, 100vh);
    height: auto;
    overflow: visible;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
    background: #003d66;
    color: #0b1c2c;
}

body.fp-page:not(.fp-page--guest) {
    height: 100%;
    max-height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

body.fp-page--guest {
    overflow-x: hidden;
    overflow-y: auto;
}

/* Ingreso: el html/body ocupan el alto útil para poder centrar la tarjeta.
 * Si el teclado recorta, el documento scrollea (no overflow:hidden). */
html.fp-html--login {
    height: 100%;
    min-height: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    min-height: var(--ms-app-height, 100vh);
}

body.fp-page--login {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    min-height: var(--ms-app-height, 100vh);
    background: #002848;
    color: #0b1c2c;
}

.fp-page {
    --fp-brand: #00609c;
    --fp-brand-deep: #003d66;
    --fp-brand-mid: #004d7d;
    --fp-gold: #c9a227;
    --fp-paper: #eef3f8;
    --fp-ink: #0b1c2c;
    --fp-muted: #5a6f82;
    --fp-line: #d5e3ee;
    --fp-danger: #c62828;
    --fp-ok: #0f7b4c;
    --fp-pad: 8px;
}

/* =====================================================================
 * Ingreso centrado (body.fp-page--login)
 * Membrete + tarjeta al centro. Navy/oro del hospital. Inputs 16 px
 * (Safari iOS no hace zoom). Overlay: top/right/bottom/left antes de inset.
 * Color sólido antes de cualquier mezcla. Sin color-mix / :has / dvh solo.
 * ===================================================================== */
.fp-login {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    min-height: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    min-height: var(--ms-app-height, 100vh);
}

.fp-login-bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 80% 50% at 50% -10%, rgba(201, 162, 39, 0.18), transparent 52%),
        radial-gradient(ellipse 70% 55% at 100% 100%, rgba(0, 96, 156, 0.45), transparent 58%),
        linear-gradient(165deg, #001a2e 0%, #003d66 48%, #002040 100%);
}

.fp-login-bg::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 40px 40px;
    opacity: 0.7;
}

.fp-login-ribbon {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 2;
    height: 4px;
    background: #c9a227;
    box-shadow: 0 0 18px rgba(201, 162, 39, 0.45);
}

.fp-login-stage {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    width: 100%;
    max-width: 28rem;
    margin: 0 auto;
    padding:
        max(28px, calc(16px + env(safe-area-inset-top, 0px)))
        max(18px, env(safe-area-inset-right, 0px))
        max(22px, calc(14px + env(safe-area-inset-bottom, 0px)))
        max(18px, env(safe-area-inset-left, 0px));
    min-width: 0;
    gap: 18px;
}

.fp-login-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
    min-width: 0;
    color: #fff;
}

.fp-login-logo {
    width: 96px;
    height: 96px;
    object-fit: contain;
    display: block;
    margin: 0 0 12px;
    filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.35));
}

.fp-login-brand-txt {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    min-width: 0;
    width: 100%;
}

.fp-login-eyebrow {
    margin: 0 0 8px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #e8d48a;
}

.fp-login-hospital {
    margin: 0;
    max-width: 22rem;
    font-size: 1.28rem;
    font-weight: 600;
    line-height: 1.28;
    letter-spacing: -0.01em;
    color: #fff;
    overflow-wrap: anywhere;
}

.fp-login-rule {
    display: block;
    width: 48px;
    height: 2px;
    margin: 12px auto 10px;
    background: #c9a227;
    border-radius: 2px;
}

.fp-login-system {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #fff;
}

.fp-login-tag {
    margin: 4px 0 0;
    font-size: 0.8rem;
    font-weight: 500;
    color: rgba(220, 236, 248, 0.78);
}

.fp-login-card {
    position: relative;
    width: 100%;
    min-width: 0;
    padding: 22px 20px 20px;
    background: #fff;
    border: 1px solid #d5e3ee;
    border-radius: 16px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28);
}

.fp-login-card::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: #c9a227;
    border-radius: 16px 16px 0 0;
}

.fp-login-title {
    margin: 0;
    font-size: 1.22rem;
    font-weight: 600;
    letter-spacing: -0.03em;
    color: #0b1c2c;
    line-height: 1.2;
}

.fp-login-lead {
    margin: 6px 0 16px;
    font-size: 0.86rem;
    line-height: 1.4;
    color: #5a6f82;
}

body.fp-page--login .fp-login-form {
    margin: 0;
}

body.fp-page--login .lg-msg {
    display: none;
    margin: 0 0 14px;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 0.84rem;
    line-height: 1.4;
}

body.fp-page--login .lg-msg.is-visible {
    display: block;
}

body.fp-page--login .lg-msg.is-ok {
    background: #e8f7ef;
    color: #0f7b4c;
    border: 1px solid #b7e0c8;
}

body.fp-page--login .lg-msg.is-error {
    background: #fdecea;
    color: #c62828;
    border: 1px solid #f5c2c0;
}

body.fp-page--login .lg-msg.is-info {
    background: #e8f4fb;
    color: #00609c;
    border: 1px solid #c5dff0;
}

body.fp-page--login .lg-field {
    margin: 0 0 14px;
    min-width: 0;
}

body.fp-page--login .lg-label {
    display: block;
    margin: 0 0 6px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #5a6f82;
}

body.fp-page--login .lg-input-wrap {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

body.fp-page--login .lg-input-wrap .icon-left {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #5a6f82;
    font-size: 0.9rem;
    pointer-events: none;
}

body.fp-page--login .lg-input {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 48px;
    padding: 12px 14px;
    border: 1.5px solid #c5d5e3;
    border-radius: 12px;
    background: #fff;
    color: #0b1c2c;
    font-family: inherit;
    font-size: 16px;
    line-height: 1.3;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    max-width: 100%;
}

body.fp-page--login .lg-input-wrap .lg-input {
    padding-left: 42px;
    padding-right: 50px;
}

body.fp-page--login .lg-input::placeholder {
    color: #5a6f82;
    opacity: 0.7;
}

body.fp-page--login .lg-input:focus {
    border-color: #00609c;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(0, 96, 156, 0.16);
}

body.fp-page--login .lg-input-wrap:focus-within .icon-left {
    color: #00609c;
}

body.fp-page--login .lg-toggle {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #5a6f82;
    cursor: pointer;
}

body.fp-page--login .lg-toggle:hover,
body.fp-page--login .lg-toggle:focus {
    color: #0b1c2c;
    background: #e8f4fb;
}

body.fp-page--login .lg-actions {
    margin: 4px 0 0;
}

body.fp-page--login .lg-btn-primary {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100% !important;
    min-height: 48px !important;
    height: auto !important;
    flex: 0 0 auto !important;
    padding: 12px 18px;
    border: 0;
    border-radius: 12px;
    background: #00609c;
    color: #fff;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 10px 22px rgba(0, 96, 156, 0.28);
}

body.fp-page--login .lg-btn-primary:hover,
body.fp-page--login .lg-btn-primary:focus {
    background: #004d7d;
}

body.fp-page--login .lg-btn-ghost {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px !important;
    height: auto !important;
    padding: 12px 18px;
    border: 1.5px solid #d5e3ee;
    border-radius: 12px;
    background: #fff;
    color: #5a6f82;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
}

body.fp-page--login .lg-btn-ghost:hover,
body.fp-page--login .lg-btn-ghost:focus {
    color: #0b1c2c;
    border-color: #00609c;
    background: #e8f4fb;
}

/* El atributo hidden pierde contra display:inline-flex del CTA. */
body.fp-page--login .lg-btn-primary[hidden],
body.fp-page--login .lg-btn-ghost[hidden],
body.fp-page--login .fp-btn[hidden],
body.fp-page--login .fp-step-btn[hidden] {
    display: none !important;
}

.fp-login-alt {
    margin: 16px 0 0;
    text-align: center;
    font-size: 0.86rem;
    line-height: 1.4;
    color: #5a6f82;
}

.fp-login-alt a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 4px 6px;
    color: #00609c;
    font-weight: 700;
    text-decoration: none;
    border-radius: 8px;
}

.fp-login-alt a:hover,
.fp-login-alt a:focus {
    background: #e8f4fb;
    text-decoration: underline;
}

.fp-login-foot {
    width: 100%;
    text-align: center;
    min-width: 0;
}

.fp-login-ver {
    display: block;
    font-size: 0.72rem;
    line-height: 1.4;
    color: rgba(220, 236, 248, 0.72);
    overflow-wrap: anywhere;
}

body.fp-page--login .fp-login-foot .ms-dev-mark {
    margin: 6px auto 0;
    max-width: 22rem;
    color: rgba(220, 236, 248, 0.55);
    font-size: 0.58rem;
    opacity: 1;
}

/* Teléfono: membrete compacto para que cédula/contraseña entren sin recorte. */
@media (max-width: 720px) {
    .fp-login-logo {
        width: 64px;
        height: 64px;
        margin-bottom: 8px;
    }
    .fp-login-hospital {
        font-size: 1.05rem;
        max-width: 20rem;
    }
    .fp-login-eyebrow {
        font-size: 0.62rem;
        margin-bottom: 6px;
    }
    .fp-login-rule {
        margin: 8px auto 8px;
    }
    .fp-login-stage {
        justify-content: flex-start;
        gap: 12px;
        padding:
            max(16px, calc(10px + env(safe-area-inset-top, 0px)))
            max(16px, env(safe-area-inset-right, 0px))
            max(16px, calc(12px + env(safe-area-inset-bottom, 0px)))
            max(16px, env(safe-area-inset-left, 0px));
    }
    .fp-login-card {
        padding: 18px 16px 16px;
    }
    .fp-login-tag {
        font-size: 0.76rem;
    }
}

@media (min-width: 720px) {
    .fp-login-logo {
        width: 112px;
        height: 112px;
        margin-bottom: 14px;
    }
    .fp-login-hospital {
        font-size: 1.42rem;
    }
    .fp-login-card {
        padding: 28px 28px 24px;
    }
    .fp-login-stage {
        gap: 22px;
    }
}

/* Teléfono bajo o teclado abierto: no forzar centrado vertical (el campo
 * quedaría tapado). El bloque arranca arriba y scrollea. */
@media (max-height: 700px) {
    .fp-login:not(.fp-login--fill) .fp-login-stage {
        justify-content: flex-start;
        padding-top: max(16px, calc(10px + env(safe-area-inset-top, 0px)));
    }
    .fp-login:not(.fp-login--fill) .fp-login-logo {
        width: 72px;
        height: 72px;
        margin-bottom: 8px;
    }
    .fp-login:not(.fp-login--fill) .fp-login-hospital {
        font-size: 1.08rem;
    }
}

/* =====================================================================
 * Alta a pantalla completa (.fp-login--fill)
 * Mismo navy/oro/tarjeta que el ingreso, pero el escenario usa todo el
 * alto y el ancho. La página scrollea en vertical (no caja atrapada).
 * Escritorio: membrete en fila, campos en dos columnas. Móvil: apilado.
 * ===================================================================== */
html.fp-html--registro {
    height: 100%;
}

.fp-login--fill {
    width: 100%;
}

.fp-login--fill .fp-login-stage {
    max-width: none;
    width: 100%;
    align-items: stretch;
    justify-content: flex-start;
    gap: 14px;
    padding:
        max(20px, calc(14px + env(safe-area-inset-top, 0px)))
        max(16px, env(safe-area-inset-right, 0px))
        max(16px, calc(12px + env(safe-area-inset-bottom, 0px)))
        max(16px, env(safe-area-inset-left, 0px));
}

.fp-login--fill .fp-login-brand {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    gap: 12px 16px;
    flex-shrink: 0;
}

.fp-login--fill .fp-login-logo {
    width: 64px;
    height: 64px;
    margin: 0;
}

.fp-login--fill .fp-login-brand-txt {
    align-items: flex-start;
    text-align: left;
    width: auto;
    flex: 1 1 12rem;
}

.fp-login--fill .fp-login-hospital {
    max-width: none;
    font-size: 1.15rem;
}

.fp-login--fill .fp-login-rule {
    display: none;
}

.fp-login--fill .fp-login-card {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    width: 100%;
    padding: 18px 16px 16px;
}

.fp-login--fill .fp-login-title {
    font-size: 1.28rem;
}

.fp-login--fill .fp-wizard {
    flex: 0 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    gap: 12px;
}

.fp-login--fill .fp-step-panes {
    flex: 0 1 auto;
    overflow: visible;
}

.fp-login--fill .fp-grid {
    gap: 12px 16px;
}

.fp-login--fill .fp-step-foot {
    margin-top: 12px;
    padding-top: 12px;
    gap: 10px;
}

.fp-login--fill .fp-wait-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1 1 auto;
    margin: 0;
    background: transparent;
    border: 0;
    padding: 0;
}

body.fp-page--registro .fp-lead {
    margin: 0 0 12px;
    font-size: 0.88rem;
}

@media (min-width: 720px) {
    .fp-login--fill .fp-login-card {
        padding: 22px 24px 20px;
    }
    .fp-login--fill .fp-login-logo {
        width: 72px;
        height: 72px;
    }
    .fp-login--fill .fp-login-hospital {
        font-size: 1.28rem;
    }
}

@media (min-width: 860px) {
    .fp-login--fill .fp-login-card {
        padding: 24px 32px 22px;
    }
    .fp-login--fill .fp-login-stage {
        padding-left: max(28px, env(safe-area-inset-left, 0px));
        padding-right: max(28px, env(safe-area-inset-right, 0px));
    }
    body.fp-page--registro .fp-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    body.fp-page--registro .fp-grid .lg-field:first-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 719px) {
    .fp-login--fill .fp-login-brand {
        justify-content: center;
        text-align: center;
    }
    .fp-login--fill .fp-login-brand-txt {
        align-items: center;
        text-align: center;
        flex: 1 1 100%;
        width: 100%;
    }
    body.fp-page--registro .fp-step-foot {
        flex-direction: column;
    }
    body.fp-page--registro .fp-step-foot .lg-btn-ghost,
    body.fp-page--registro .fp-step-foot .fp-step-btn,
    body.fp-page--registro .fp-step-foot .fp-btn {
        flex: 1 1 auto !important;
        width: 100% !important;
    }
}

/* =====================================================================
 * Invitado registro (grilla partida de syslogin.css)
 * syslogin.css deja un héroe de ~34 vh y panel max 420 px. Acá el portal
 * usa todo el alto/ancho: marca compacta, formulario a columna completa.
 * El ingreso NO usa esta grilla (ver .fp-page--login arriba).
 * ===================================================================== */
html.fp-html--login,
html.fp-html--login *,
html.fp-html--login *::before,
html.fp-html--login *::after {
    box-sizing: border-box;
}
body.fp-page--guest .lg-stage {
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    min-height: var(--ms-app-height, 100vh);
    grid-template-rows: auto 1fr;
}

body.fp-page--guest .lg-brand {
    padding: 10px 16px 8px;
}

body.fp-page--guest .lg-logo {
    width: 56px;
    height: 56px;
    margin: 0 auto 6px;
}

body.fp-page--guest .lg-brand-eyebrow {
    margin-bottom: 2px;
    font-size: 0.62rem;
}

body.fp-page--guest .lg-brand-title {
    font-size: 1rem;
    line-height: 1.25;
}

body.fp-page--guest .lg-brand-system {
    margin-top: 4px;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
}

body.fp-page--guest .lg-brand-tag {
    margin-top: 2px;
    font-size: 0.75rem;
}

body.fp-page--guest .lg-panel-inner,
body.fp-page--guest .lg-card {
    max-width: none;
    width: 100%;
}

body.fp-page--guest .lg-panel-inner {
    justify-content: flex-start;
    gap: 10px;
    padding-top: 12px;
    padding-bottom: 12px;
}

body.fp-page--guest .lg-panel-head {
    gap: 10px;
}

body.fp-page--guest .lg-logo-mobile {
    width: 40px;
    height: 40px;
}

body.fp-page--guest .lg-panel-title {
    font-size: 1.2rem;
}

body.fp-page--guest .lg-panel-sub {
    font-size: 0.8rem;
}

body.fp-page--guest .lg-card {
    padding: 12px 14px;
    border-radius: 12px;
}

body.fp-page--guest .lg-field {
    margin-bottom: 8px;
}

body.fp-page--registro .lg-panel-inner {
    justify-content: flex-start;
}

body.fp-page--registro .lg-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
}

.fp-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    min-height: 24px;
    padding: 2px 10px;
    margin: 0;
    border-radius: 999px;
    background: #1a6b50;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.fp-brand-note {
    margin: 8px auto 0;
    max-width: 28rem;
    font-size: 0.8rem;
    line-height: 1.35;
    color: rgba(220, 236, 248, 0.88);
}

.fp-brand-note strong {
    color: #fff;
    font-weight: 700;
}

.fp-cross-link {
    text-align: center;
    margin: 4px 0 0;
}

body.fp-page--guest .lg-msg.is-ok {
    background: #e8f7ef;
    color: #0f7b4c;
    border: 1px solid #b7e0c8;
}

body.fp-page--guest .lg-msg.is-error {
    background: #fdecea;
    color: #c62828;
    border: 1px solid #f5c2c0;
}

body.fp-page--guest .lg-msg.is-info {
    background: #e8f4fb;
    color: #00609c;
    border: 1px solid #c5dff0;
}

body.fp-page--guest .lg-msg {
    margin-bottom: 8px;
    padding: 8px 10px;
}

body.fp-page--guest .lg-loading {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.fp-links {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 8px;
    text-align: center;
}

.fp-links a {
    color: var(--fp-brand);
    font-weight: 700;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border-radius: 10px;
    padding: 8px 12px;
}

.fp-links a:hover {
    background: #e8f4fb;
}

.fp-lead {
    margin: 0 0 8px;
    color: var(--fp-muted);
    font-size: 0.82rem;
    line-height: 1.35;
}

.fp-field-hint {
    margin: 4px 2px 0;
    font-size: 0.75rem;
    color: var(--fp-muted);
    line-height: 1.35;
    min-height: 1.1em;
}

.fp-field-hint.is-ok { color: var(--fp-ok); }
.fp-field-hint.is-err { color: var(--fp-danger); }

.fp-ro {
    padding-left: 14px;
    background: #eef3f8;
    color: var(--fp-ink);
}

body.fp-page .lg-input-wrap .lg-input {
    padding-right: 48px;
}

.fp-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

/* ---------- Asistente de alta (etapas: se conservan, se compactan) ---------- */
.fp-wizard {
    flex: 1;
    min-height: 0;
    gap: 8px;
}

.fp-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-shrink: 0;
}

.fp-step {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 44px;
    padding: 6px 8px;
    border-radius: 10px;
    border: 1.5px solid var(--fp-line);
    background: #f7fafc;
    color: var(--fp-muted);
    font-size: 0.74rem;
    font-weight: 700;
    text-align: center;
    min-width: 0;
    overflow-wrap: anywhere;
}

.fp-step span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #d5e3ee;
    color: var(--fp-ink);
    font-size: 0.7rem;
    flex-shrink: 0;
}

.fp-step.is-on {
    border-color: var(--fp-brand);
    background: #e8f4fb;
    color: var(--fp-ink);
}

.fp-step.is-on span {
    background: var(--fp-brand);
    color: #fff;
}

.fp-step.is-done {
    border-color: #b7e0c8;
    background: #e8f7ef;
}

.fp-step-panes {
    flex: 1;
    min-height: 0;
    min-width: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.fp-step-pane[hidden] {
    display: none !important;
}

.fp-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px 12px;
}
.fp-col-full {
    grid-column: 1 / -1;
    min-width: 0;
}

.fp-step-foot {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex-shrink: 0;
    padding-top: 6px;
}

/*
 * CTA del portal: llenan el ancho en móvil (web-app). En escritorio el
 * pie de formulario no se estira a toda la pantalla: botones reales.
 */
body.fp-page .fp-btn,
body.fp-page .fp-btn-ghost,
body.fp-page .fp-step-btn,
body.fp-page .fp-actas-pdf,
body.fp-page .fp-acta-pdf-btn,
body.fp-page .fp-pdf-close,
body.fp-page .fp-pdf-ext,
body.fp-page .lg-btn-primary,
body.fp-page .lg-btn-ghost,
body.lg-page .lg-btn-primary,
body.lg-page .lg-btn-ghost {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 44px !important;
    height: auto !important;
    flex: 1 1 auto !important;
    white-space: normal !important;
    box-sizing: border-box;
}

body.fp-page .fp-step-foot .lg-btn-ghost,
body.fp-page .fp-step-foot .fp-step-btn#fpStepBack {
    flex: 0 1 42% !important;
}

body.fp-page .lg-toggle.fp-reveal {
    width: 44px !important;
    max-width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    flex: 0 0 44px !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

body.fp-page:not(.fp-page--guest) .lg-input-wrap {
    position: relative;
    min-width: 0;
}
body.fp-page:not(.fp-page--guest) .lg-input-wrap .fp-input,
body.fp-page:not(.fp-page--guest) .lg-input-wrap .lg-input {
    padding-right: 48px;
}
body.fp-page:not(.fp-page--guest) .lg-toggle {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    background: #fff;
    border: 0;
    color: var(--fp-muted);
    cursor: pointer;
    border-radius: 10px;
}
body.fp-page:not(.fp-page--guest) .lg-toggle:hover {
    color: var(--fp-ink);
    background: #e8f4fb;
}

.fp-btn {
    -webkit-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 44px;
    padding: 10px 14px;
    border: 0;
    border-radius: 10px;
    background: #00609c;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    font-family: inherit;
}

@media (min-width: 860px) {
    body.fp-page--guest .lg-stage {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.2fr);
        grid-template-rows: 1fr;
    }
    body.fp-page--guest .lg-brand {
        padding: 24px 20px;
        justify-content: center;
    }
    body.fp-page--guest .lg-logo {
        width: 96px;
        height: 96px;
        margin-bottom: 10px;
    }
    body.fp-page--guest .lg-brand-title {
        font-size: 1.35rem;
    }
    body.fp-page--registro .lg-panel-inner {
        padding-top: 16px;
    }
    .fp-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .fp-grid .lg-field:first-child {
        grid-column: 1 / -1;
    }
}

@media (min-width: 1100px) {
    body.fp-page--ficha .fp-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    body.fp-page--ficha .fp-grid .fp-col-full {
        grid-column: 1 / -1;
    }
}

@media (min-width: 1200px) {
    body.fp-page--guest .lg-stage {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    }
    body.fp-page--ficha .fp-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .fp-step {
        flex-direction: column;
        gap: 2px;
        font-size: 0.66rem;
        padding: 6px 4px;
    }
}

body.fp-page input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
body.fp-page select,
body.fp-page textarea {
    font-size: 16px;
    min-height: 44px;
}

body.fp-page--guest .lg-input:focus {
    box-shadow: 0 0 0 3px rgba(0, 96, 156, 0.16);
}

/* =====================================================================
 * App autenticada — cromo mínimo, contenido a todo el resto
 * Cabecera sticky de una sola fila; menú izquierdo; el documento scrollea.
 * ===================================================================== */
.fp-app {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    flex: 1 1 auto;
    background: var(--fp-paper);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    /* Hueco de la barra fija (alto medido ~54 px + safe-area). */
    padding-top: 56px;
    padding-top: calc(56px + env(safe-area-inset-top, 0px));
}

/*
 * Cabecera fija (no sticky): en este layout sticky fallaba porque body
 * o html+body formaban un segundo scroller y la barra se iba con la página.
 * position:fixed no pide overflow:hidden en html/body; el contenido scrollea
 * debajo. Spacer en .fp-app para que el título no quede tapado.
 * Móvil: nowrap, una fila menú | título | Salir. El nombre va al menú.
 */
.fp-top {
    flex-shrink: 0;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    min-height: 52px;
    padding: 4px 8px;
    padding-top: calc(4px + env(safe-area-inset-top, 0px));
    background: var(--fp-brand-deep);
    color: #fff;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
}

body.fp-page .fp-menu {
    flex: 0 0 44px;
    appearance: none;
    border: 1px solid rgba(255, 255, 255, 0.35);
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    max-width: 44px !important;
    padding: 0 !important;
    border-radius: 10px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}

.fp-top-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.fp-top-logo,
.fp-top-brand img {
    width: 28px;
    height: 28px;
    object-fit: contain;
    flex-shrink: 0;
}

.fp-top-titles {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.fp-kicker {
    margin: 0;
    font-size: 0.6rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    opacity: 0.8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fp-top-title {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 650;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fp-top-user {
    display: none;
    margin: 0;
    font-size: 0.78rem;
    opacity: 0.92;
    min-width: 0;
    max-width: 16rem;
    line-height: 1.25;
    flex: 0 1 auto;
}

.fp-top-name,
.fp-top-ci {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fp-top-ci {
    opacity: 0.8;
    font-size: 0.7rem;
    font-variant-numeric: tabular-nums;
}

/*
 * Salir: hit ≥44 px, no se aplasta (nombre sin «-btn» para no pelear
 * con minisys-btn-square). En móvil queda el texto; no se va a otra fila.
 */
.fp-top-out {
    flex: 0 0 auto;
    min-height: 44px;
    min-width: 44px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    font-size: 0.82rem;
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    white-space: nowrap;
}

.fp-nav-who {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px 10px;
    margin: 0 0 6px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    min-width: 0;
}

.fp-nav-av {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #00609c;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.04em;
}

.fp-nav-who-txt {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.fp-nav-who-txt strong {
    font-size: 0.82rem;
    font-weight: 650;
    color: #fff;
    overflow-wrap: anywhere;
    line-height: 1.25;
}

.fp-nav-who-txt span {
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.7);
    font-variant-numeric: tabular-nums;
}

.fp-id-strip {
    flex-shrink: 0;
    margin: 0;
    padding: 4px 10px;
    background: #e8f4fb;
    color: var(--fp-brand-deep);
    font-size: 0.75rem;
    line-height: 1.3;
    border-bottom: 1px solid var(--fp-line);
}

.fp-body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.fp-nav {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: min(88vw, 260px);
    flex-shrink: 0;
    padding: 10px 8px;
    padding-top: 10px;
    padding-bottom: max(10px, env(safe-area-inset-bottom, 0px));
    background: #002848;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    position: fixed;
    /* Debajo de .fp-top: si top:0, Inicio queda bajo el hamburguesa y
     * tocarlo cierra el menú (el usuario se queda preso en Actas). */
    top: 52px;
    top: calc(52px + env(safe-area-inset-top, 0px));
    right: auto;
    bottom: 0;
    left: 0;
    z-index: 96;
    transform: translateX(-105%);
    transition: transform 0.2s ease;
    /* Cerrado: iOS sigue hit-testing el panel traducido. */
    pointer-events: none;
}
body.fp-nav-open .fp-nav {
    transform: translateX(0);
    pointer-events: auto;
}

.fp-nav-label {
    margin: 0 10px 4px;
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.55);
}

.fp-nav-scrim {
    display: none;
    position: fixed;
    top: 52px;
    top: calc(52px + env(safe-area-inset-top, 0px));
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 92;
    background: rgba(8, 32, 54, 0.5);
}
body.fp-nav-open .fp-nav-scrim {
    display: block;
}

.fp-nav-a {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 10px;
    color: #e8f2ed;
    text-decoration: none;
    border-radius: 8px;
    font-size: 0.86rem;
}

.fp-nav-a.is-on,
.fp-nav-a:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

.fp-nav-a--cross,
.fp-nav-a--out {
    margin-top: auto;
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: #cfe6f6;
}

.fp-main {
    flex: 1;
    min-width: 0;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 8px 10px 16px;
    -webkit-overflow-scrolling: touch;
}

.fp-flash {
    background: #e8f7ef;
    color: var(--fp-ok);
    padding: 8px 10px;
    border-radius: 8px;
    margin: 0 0 8px;
    font-size: 0.88rem;
}

.fp-alert {
    padding: 8px 10px;
    border-radius: 8px;
    background: #fdecea;
    color: var(--fp-danger);
    font-size: 0.88rem;
    margin: 0 0 8px;
}

.fp-alert--ok {
    background: #e8f7ef;
    color: var(--fp-ok);
}

/* ---------- Inicio institucional (llena el área, composición al centro) ---------- */
.fp-home {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    margin: 0;
}

.fp-home-hero {
    background: #fff;
    border: 1px solid var(--fp-line);
    /* Franja oro arriba (no borde izquierdo): el membrete se lee centrado. */
    border-top: 4px solid var(--fp-gold);
    border-radius: 12px;
    padding: 18px 20px 16px;
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
}

.fp-home-org {
    margin: 0 0 2px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fp-brand);
}

.fp-home-title {
    margin: 0 0 6px;
    font-size: 1.35rem;
    font-weight: 750;
    color: var(--fp-brand-deep);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.fp-home-hello {
    margin: 0 0 8px;
    font-size: 1.02rem;
    line-height: 1.35;
    color: var(--fp-ink);
    overflow-wrap: anywhere;
}

.fp-home-meta {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 8px;
    color: var(--fp-muted);
    font-size: 0.82rem;
}

.fp-home-meta li {
    padding: 4px 12px;
    background: #e8f4fb;
    border-radius: 999px;
    min-width: 0;
    overflow-wrap: anywhere;
}

.fp-home-h {
    margin: 4px 0 0;
    font-size: 0.78rem;
    font-weight: 750;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--fp-muted);
    text-align: center;
}

.fp-home-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    min-width: 0;
}

.fp-home-bday {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #fff7ed;
    border: 1px solid #f5d0a6;
    border-radius: 12px;
    padding: 14px 16px;
    color: #9a3412;
    width: 100%;
    box-sizing: border-box;
    min-width: 0;
}

.fp-home-bday-icon {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff;
    color: #e11d48;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.fp-home-bday-k {
    margin: 0 0 2px;
    font-weight: 800;
    font-size: 0.82rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.fp-home-bday-t {
    margin: 0;
    font-size: 0.92rem;
    line-height: 1.4;
}

.fp-bday-chip {
    display: none;
}

.fp-kpi-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    min-width: 0;
}

.fp-kpi {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 8px;
    row-gap: 2px;
    align-items: center;
    background: #fff;
    border: 1px solid var(--fp-line);
    border-left: 3px solid var(--fp-gold);
    border-radius: 10px;
    padding: 10px 12px;
    text-decoration: none;
    color: inherit;
    min-height: 56px;
    min-width: 0;
}

.fp-kpi > i {
    grid-row: 1 / span 2;
    color: var(--fp-brand);
    font-size: 1.05rem;
    width: 1.35rem;
    text-align: center;
}

.fp-kpi em {
    grid-row: 1 / span 2;
    font-style: normal;
    font-weight: 800;
    font-size: 1.35rem;
    line-height: 1;
    color: var(--fp-brand-deep);
    font-variant-numeric: tabular-nums;
    min-width: 1.2em;
}

.fp-kpi strong {
    font-size: 0.88rem;
    font-weight: 750;
    line-height: 1.2;
    min-width: 0;
    overflow-wrap: anywhere;
}

.fp-kpi span {
    color: var(--fp-muted);
    font-size: 0.74rem;
    line-height: 1.3;
    min-width: 0;
    overflow-wrap: anywhere;
}

.fp-kpi--aux em {
    display: none;
}

.fp-kpi--aux {
    grid-template-columns: auto minmax(0, 1fr);
}

body.fp-is-birthday .fp-main {
    background-image:
        radial-gradient(circle at 8% 12%, rgba(225, 29, 72, 0.06), transparent 42%),
        radial-gradient(circle at 92% 18%, rgba(217, 119, 6, 0.07), transparent 40%);
}

body.fp-is-birthday .fp-top {
    background: #5b2c0a;
}

/*
 * 58.60 — Inicio tipo app: llena el viewport y centra la composición.
 * Cadena de alto 100vh → 100dvh → --ms-app-height (Safari viejo primero).
 * El scroller es .fp-main (cabecera .fp-top sigue position:fixed).
 * Pie al fondo del área, sin tapar las tarjetas. Sin :has().
 */
html.fp-html--inicio {
    height: 100%;
    height: 100vh;
    height: 100dvh;
    height: var(--ms-app-height, 100vh);
    max-height: 100%;
    max-height: 100vh;
    max-height: 100dvh;
    max-height: var(--ms-app-height, 100vh);
    overflow: hidden;
}

body.fp-page--inicio {
    display: flex;
    flex-direction: column;
    height: 100%;
    height: 100vh;
    height: 100dvh;
    height: var(--ms-app-height, 100vh);
    max-height: 100%;
    max-height: 100vh;
    max-height: 100dvh;
    max-height: var(--ms-app-height, 100vh);
    overflow: hidden;
}

body.fp-page--inicio .fp-app {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
}

body.fp-page--inicio .fp-body {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
    overflow: hidden;
}

body.fp-page--inicio .fp-main {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-width: none;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 8px 16px 10px;
    box-sizing: border-box;
}

/*
 * 58.64 — El centrado vertical de 58.60 dejaba una franja gris enorme
 * bajo la cabecera navy (y la línea oro del héroe quedaba a mitad de
 * pantalla). El inicio sigue llenando el alto/ancho; el héroe arranca
 * arriba, pegado al cromo fijo de 58.61.
 */
body.fp-page--inicio .fp-home {
    flex: 1 1 auto;
    justify-content: flex-start;
    align-items: stretch;
    gap: 12px;
    width: 100%;
    max-width: none;
    margin: 0;
}

body.fp-page--inicio .fp-kpi {
    min-height: 72px;
}

body.fp-page--inicio .fp-foot {
    flex-shrink: 0;
    margin-top: 12px;
    width: 100%;
}

@media (max-width: 720px) {
    /* Celular: una tarjeta por fila; no grilla apretada a la izquierda. */
    body.fp-page--inicio .fp-kpi-grid,
    body.fp-page--inicio .fp-home-actions {
        grid-template-columns: 1fr;
    }
    body.fp-page--inicio .fp-home-hero {
        padding: 16px 14px 12px;
    }
    body.fp-page--inicio .fp-main {
        padding: 10px 12px 12px;
        padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    }
    body.fp-page--inicio .fp-home-title {
        font-size: 1.18rem;
    }
    body.fp-page--inicio .fp-home-bday {
        flex-direction: column;
        align-items: center;
    }
}

@media (min-width: 721px) {
    body.fp-page--inicio .fp-main {
        padding: 18px 24px 14px;
    }
    body.fp-page--inicio .fp-kpi {
        min-height: 88px;
        padding: 16px 18px;
    }
    body.fp-page--inicio .fp-home-title {
        font-size: 1.55rem;
    }
}

@media (min-width: 1100px) {
    body.fp-page--inicio .fp-main {
        padding: 22px 32px 16px;
    }
    body.fp-page--inicio .fp-kpi {
        min-height: 96px;
    }
}

@media (min-width: 721px) {
    .fp-bday-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        margin-left: 8px;
        padding: 3px 10px;
        border-radius: 999px;
        background: #fff7ed;
        color: #9a3412;
        font-size: 0.7rem;
        font-weight: 750;
        white-space: nowrap;
    }
    .fp-top-titles {
        flex-wrap: wrap;
        align-items: center;
    }
}

@media (max-width: 520px) {
    .fp-home-actions {
        grid-template-columns: 1fr;
    }
}

/* compat: vistas viejas que aún pinten .fp-card */
.fp-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
}
.fp-card {
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 8px;
    padding: 8px 10px;
    text-decoration: none;
    color: inherit;
    min-height: 52px;
    border-left: 3px solid var(--fp-gold);
}
.fp-card strong { font-size: 0.9rem; }
.fp-card span { color: var(--fp-muted); font-size: 0.78rem; }
.fp-card em {
    font-style: normal;
    font-weight: 800;
    font-size: 1.2rem;
    color: var(--fp-brand);
}

/* Tablas: el recuadro scrollea; la página no. Móvil: tarjetas vía data-label. */
.fp-table-wrap {
    overflow: auto;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 0;
    background: #fff;
    border-radius: 8px;
    border: 1px solid var(--fp-line);
    -webkit-overflow-scrolling: touch;
}

.fp-table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}

.fp-table th,
.fp-table td {
    padding: 6px 8px;
    text-align: left;
    border-bottom: 1px solid var(--fp-line);
    overflow-wrap: break-word;
    word-break: normal;
    white-space: normal !important;
    min-width: 0;
    vertical-align: top;
    font-size: 0.84rem;
    line-height: 1.35;
}

.fp-table th {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--fp-muted);
    background: #f7fafc;
}

.fp-empty {
    background: #fff;
    border-radius: 8px;
    padding: 16px 12px;
    text-align: center;
    color: var(--fp-muted);
    font-size: 0.88rem;
}

/*
 * Pares etiqueta/valor: filas apretadas en grilla, no una tarjeta por campo.
 * Así caben 12 datos de carnet/equipo a la vista sin scroll inútil.
 */
.fp-kv,
.fp-dl {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    margin: 0;
}

.fp-kv > div,
.fp-dl > div {
    display: grid;
    grid-template-columns: minmax(7rem, 38%) minmax(0, 1fr);
    gap: 6px 10px;
    align-items: start;
    padding: 4px 0;
    border-bottom: 1px dotted var(--fp-line);
    background: transparent;
    border-radius: 0;
    min-width: 0;
}

.fp-kv dt,
.fp-dl dt {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--fp-muted);
    margin: 0;
    line-height: 1.3;
}

.fp-kv dd,
.fp-dl dd {
    margin: 0;
    font-weight: 650;
    font-size: 0.84rem;
    overflow-wrap: anywhere;
    line-height: 1.35;
}

.fp-foot {
    flex: 0 0 auto;
    margin-top: 12px;
    padding: 14px 12px 8px;
    border-top: 1px solid var(--fp-line);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    text-align: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    color: var(--fp-muted);
    font-size: 0.75rem;
}

.fp-foot-kicker,
.fp-foot > p {
    margin: 0;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 0.68rem;
    color: var(--fp-brand-deep);
}

.fp-foot a {
    color: var(--fp-brand);
    font-weight: 700;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.fp-foot-ver {
    font-size: 0.72rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
    max-width: 42rem;
}

.fp-foot .ms-dev-mark {
    background: transparent;
    border: 0;
    color: var(--fp-muted);
    font-size: 0.58rem;
    font-weight: 400;
    opacity: 0.72;
    padding: 0;
    margin: 4px auto 0;
    max-width: 42rem;
    text-align: center;
    width: 100%;
}

.fp-input,
.fp-field input,
.fp-field select {
    width: 100%;
    min-height: 44px;
    font-size: 16px;
    border: 1px solid var(--fp-line);
    border-radius: 8px;
    padding: 8px 10px;
    background: #fff;
    box-sizing: border-box;
}

.fp-field {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.fp-field label,
.fp-field .lg-label {
    font-size: 0.75rem;
    font-weight: 650;
    color: var(--fp-ink);
}

/* Texto solo para lectores de pantalla (estado del campo). */
.fp-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* 58.58 — Datos: foto del carnet a la izquierda (no se edita). Cada campo
 * muestra el valor, el estado (check verde / interrogación) y, si se puede
 * editar, el candado a la extrema derecha. */
.fp-ficha-datos {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    min-width: 0;
}

.fp-ficha-photo {
    margin: 0;
    padding: 12px;
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 12px;
    text-align: center;
    min-width: 0;
}

.fp-ficha-photo img,
.fp-ficha-photo-empty {
    display: block;
    width: 140px;
    height: 175px;
    margin: 0 auto 8px;
    object-fit: cover;
    object-position: center top;
    border-radius: 8px;
    background: #0b1c2c;
    pointer-events: none;
}

.fp-ficha-photo-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.55);
    font-size: 3rem;
}

.fp-ficha-photo p {
    margin: 0;
    font-size: 0.75rem;
    color: var(--fp-muted);
    line-height: 1.35;
}

.fp-field-ctrl {
    display: flex;
    align-items: stretch;
    gap: 6px;
    min-width: 0;
}

.fp-field-ctrl .fp-input {
    flex: 1 1 auto;
    min-width: 0;
    padding-right: 10px;
}

.fp-lock {
    flex: 0 0 44px !important;
    width: 44px !important;
    max-width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0;
    padding: 0 !important;
    border: 1px solid var(--fp-line);
    border-radius: 8px;
    background: #fff;
    color: var(--fp-muted);
    cursor: pointer;
    display: grid;
    place-items: center;
}

.fp-lock[aria-pressed="true"] {
    background: #e8f4fb;
    border-color: var(--fp-brand);
    color: var(--fp-brand);
}

.fp-lock:hover,
.fp-lock:focus {
    color: var(--fp-brand-deep);
    border-color: var(--fp-brand);
}

.fp-field--edit .fp-input[readonly] {
    background: #eef3f8;
    color: var(--fp-ink);
}

.fp-field-status {
    position: relative;
    flex: 0 0 36px;
    width: 36px;
    min-height: 44px;
    display: grid;
    place-items: center;
    font-size: 1.15rem;
}

.fp-field-status.is-ok {
    color: var(--fp-ok);
}

.fp-field-status.is-empty {
    color: #c9a227;
}

.fp-id-pack {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
}

.fp-id-block h2 {
    margin: 0 0 4px;
    font-size: 1.05rem;
}

@media (min-width: 860px) {
    .fp-ficha-datos {
        grid-template-columns: 180px minmax(0, 1fr);
    }
}

.fp-btn-ghost {
    background: transparent;
    color: var(--fp-brand);
    border: 1.5px solid var(--fp-brand);
}

@media (max-width: 720px) {
    /* Cromo: el kicker duplicaba el título y lo partía junto al logo. */
    .fp-kicker {
        display: none;
    }
    .fp-top-title {
        font-size: 0.92rem;
    }
    .fp-top {
        z-index: 100;
    }
    body.fp-nav-open,
    body.fp-pdf-open {
        overflow: hidden;
        overscroll-behavior: none;
    }
    .fp-table,
    .fp-table tbody {
        display: block;
        width: 100%;
        table-layout: auto;
    }
    .fp-table thead { display: none; }
    .fp-table tr {
        display: block;
        padding: 8px 10px;
        border-bottom: 6px solid var(--fp-paper);
        min-width: 0;
    }
    .fp-table td {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 8px;
        border: 0;
        padding: 4px 0;
        min-width: 0;
        white-space: normal;
    }
    .fp-table td::before {
        content: attr(data-label);
        font-weight: 700;
        color: var(--fp-muted);
        flex: 0 1 40%;
        min-width: 0;
        overflow-wrap: anywhere;
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }
}

@media (min-width: 721px) {
    .fp-top {
        padding: 6px 12px;
        padding-top: calc(6px + env(safe-area-inset-top, 0px));
        gap: 10px;
    }
    .fp-top-logo,
    .fp-top-brand img {
        width: 32px;
        height: 32px;
    }
    .fp-top-user {
        display: block;
        text-align: right;
    }
    .fp-nav {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        z-index: 1;
        transform: none;
        width: 0;
        min-width: 0;
        padding: 0;
        overflow: hidden;
        visibility: hidden;
        align-self: stretch;
        max-height: none;
        transition: none;
        pointer-events: auto;
    }
    body.fp-nav-open .fp-nav {
        width: 200px;
        min-width: 200px;
        padding: 8px 6px;
        overflow-x: hidden;
        overflow-y: auto;
        visibility: visible;
        max-height: none;
    }
    .fp-nav-scrim,
    body.fp-nav-open .fp-nav-scrim {
        display: none !important;
    }
    .fp-main { padding: 10px 14px 16px; }
    .fp-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .fp-kpi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .fp-kv,
    .fp-dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 16px;
    }
    body.fp-page .fp-form > .fp-btn,
    body.fp-page .fp-panel > .fp-form > .fp-btn {
        width: auto !important;
        min-width: 200px !important;
        max-width: 320px !important;
        align-self: flex-start;
        flex: 0 0 auto !important;
    }
}

@media (min-width: 1100px) {
    .fp-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .fp-kpi-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .fp-kv,
    .fp-dl {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1400px) {
    .fp-kpi-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
    .fp-kv,
    .fp-dl {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (prefers-reduced-motion: reduce) {
    .fp-step,
    .fp-btn,
    .lg-btn-primary {
        transition: none;
    }
}

.fp-field-stamp {
    margin: 4px 0 0;
    font-size: 0.75rem;
    color: var(--fp-brand-deep);
    line-height: 1.35;
    font-weight: 650;
}
.fp-field-stamp--empty {
    color: var(--fp-muted);
    font-weight: 500;
}

.fp-wait,
.fp-wait-box {
    background: #e8f4fb;
    border: 1px solid #c5dff0;
    border-radius: 8px;
    padding: 10px 12px;
    margin: 0 0 8px;
}

.fp-pin-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 120;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background: rgba(11, 28, 44, 0.45);
    padding: 12px;
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
}

.fp-pin-overlay[hidden] {
    display: none !important;
}

.fp-pin-sheet {
    width: min(400px, 100%);
    background: #fff;
    border-radius: 16px;
    padding: 18px 16px 16px;
    box-shadow: 0 18px 48px rgba(0, 61, 102, 0.22);
}

.fp-pin-sheet h2 {
    margin: 0 0 4px;
    font-size: 1.05rem;
}

.fp-pin-sheet p {
    margin: 0 0 8px;
    color: var(--fp-muted);
    font-size: 0.84rem;
}

.fp-pin-err {
    color: var(--fp-danger);
    font-size: 0.82rem;
    margin: 6px 0 0;
}

/*
 * 59.12 — Recuadro de PIN en todo el portal: cifras grandes y centradas,
 * ojo a la derecha sin tapar, toque ≥44 px, 16 px (Safari no hace zoom).
 * Color sólido primero; overlay ya usa top/right/bottom/left.
 */
.fp-pin-box {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.fp-pin-box .icon-left {
    display: none;
}

body.fp-page .fp-pin-input,
body.fp-page input.fp-pin-input {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 56px !important;
    height: 56px;
    box-sizing: border-box;
    margin: 0;
    padding: 10px 52px 10px 16px;
    border: 1.5px solid #c5d5e3;
    border-radius: 14px;
    background: #f4f8fc;
    color: var(--fp-ink, #0f172a);
    font-family: inherit;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.55em;
    text-align: center;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    caret-color: #00609c;
}

body.fp-page .fp-pin-input::placeholder {
    color: #8aa0b3;
    letter-spacing: 0.55em;
    font-weight: 700;
}

body.fp-page .fp-pin-input:focus {
    outline: none;
    border-color: #00609c;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(0, 96, 156, 0.18);
}

body.fp-page .fp-pin-toggle,
body.fp-page .fp-pin-box .fp-pin-toggle {
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #5a6f82;
    cursor: pointer;
    display: grid;
    place-items: center;
    z-index: 1;
}

body.fp-page .fp-pin-toggle:hover,
body.fp-page .fp-pin-toggle:focus {
    color: #003d66;
    background: #e8f4fb;
}

body.fp-page .fp-pin-toggle:focus-visible {
    outline: 2px solid #00609c;
    outline-offset: 2px;
}

.fp-pin-sheet .fp-pin-box {
    margin: 4px 0 12px;
}

.fp-pin-sheet > .lg-label {
    display: block;
    margin: 0 0 6px;
}

@media (max-width: 720px) {
    body.fp-page .fp-pin-input,
    body.fp-page input.fp-pin-input {
        min-height: 56px;
        height: 56px;
        font-size: 16px;
    }
}

@media (min-width: 721px) {
    .fp-pin-overlay {
        align-items: center;
    }
    .fp-pin-sheet {
        border-radius: 12px;
    }
}

/* ---------- Expedientes (tickets / carnet / HIS / equipos) ---------- */
.fp-rec-list,
.fp-tkt-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fp-rec,
.fp-tkt-card,
.fp-rec-card {
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 8px;
    padding: 8px 10px 10px;
    border-left: 3px solid var(--fp-gold);
    min-width: 0;
}

.fp-rec-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
    margin: 0 0 6px;
    min-width: 0;
}

.fp-rec-id,
.fp-rec-bar .fp-kicker {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fp-brand);
    margin: 0;
}

.fp-rec-bar h2,
.fp-rec h2,
.fp-tkt-card h2,
.fp-rec-card h2 {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.25;
    flex: 1 1 12rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.fp-pill {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #e8f4fb;
    color: var(--fp-brand-deep);
    font-size: 0.72rem;
    font-weight: 700;
    flex-shrink: 0;
}

.fp-tkt-card h3,
.fp-rec h3 {
    margin: 8px 0 4px;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--fp-muted);
}

.fp-tkt-desc {
    overflow-wrap: anywhere;
    margin: 8px 0 0;
    line-height: 1.45;
    font-size: 0.88rem;
}

.fp-tkt-board {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

/* 58.58 — Tickets: encabezado (número, asunto, estado), datos en ficha,
 * descripción en recuadro y actividades con línea de tiempo. */
body.fp-page--tickets .fp-tkt-card {
    padding: 16px 16px 14px;
    border-left: 0;
    border-radius: 12px;
    box-shadow: 0 1px 0 rgba(11, 28, 44, 0.04);
}

.fp-tkt-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    margin: 0 0 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--fp-line);
}

.fp-tkt-num {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fp-brand);
    font-variant-numeric: tabular-nums;
}

.fp-tkt-head h2,
.fp-tkt-card > h2 {
    margin: 0;
    flex: 1 1 12rem;
    font-size: 1.08rem;
    font-weight: 650;
    line-height: 1.3;
    min-width: 0;
    overflow-wrap: anywhere;
}

.fp-tkt-meta {
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: 8px 16px;
    min-width: 0;
}
.fp-tkt-meta li,
.fp-tkt-meta > div {
    margin: 0;
    font-size: 0.88rem;
    overflow-wrap: anywhere;
}
.fp-tkt-meta span,
.fp-tkt-meta dt {
    display: block;
    margin: 0 0 2px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fp-muted);
}
.fp-tkt-meta dd {
    margin: 0;
}

.fp-tkt-desc {
    overflow-wrap: anywhere;
    margin: 0 0 12px;
    padding: 10px 12px;
    line-height: 1.45;
    font-size: 0.9rem;
    background: #f7fafc;
    border-radius: 8px;
}

.fp-tkt-tl h3,
.fp-tkt-card h3 {
    margin: 0 0 8px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--fp-muted);
}

.fp-tkt-acts {
    margin: 0;
    padding: 0;
    list-style: none;
}

.fp-tkt-acts li {
    position: relative;
    display: flex;
    gap: 10px;
    margin: 0 0 10px;
    overflow-wrap: anywhere;
    font-size: 0.86rem;
}

.fp-tkt-acts li:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 14px;
    bottom: -10px;
    width: 2px;
    background: var(--fp-line);
}

.fp-tkt-dot {
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    margin-top: 6px;
    border-radius: 50%;
    background: var(--fp-brand);
    position: relative;
    z-index: 1;
}

.fp-tkt-acts time,
.fp-tkt-who {
    display: inline;
    color: var(--fp-muted);
    font-weight: 650;
    font-size: 0.78rem;
}
.fp-tkt-who::before {
    content: " · ";
}
.fp-tkt-act-txt {
    display: block;
    color: var(--fp-ink);
    margin-top: 1px;
}

.fp-tkt-board {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.fp-pill--is-open { background: #e8f4fb; color: var(--fp-brand-deep); }
.fp-pill--is-work { background: #fff4d6; color: #7a5a00; }
.fp-pill--is-done { background: #e7f6ec; color: #1b6b38; }

.fp-live-bar {
    margin: 4px 0 0;
    font-size: 0.78rem;
    color: var(--fp-muted);
    font-weight: 600;
}

/* 58.58 — Actas: tablero de tarjetas (número, rol, fecha, asunto y ficha). */
.fp-actas-board {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    min-width: 0;
}

.fp-acta-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 12px;
    padding: 16px;
    min-width: 0;
}

.fp-acta-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    margin: 0;
}

.fp-acta-card .fp-actas-asunto {
    margin: 0;
    font-size: 1.08rem;
    font-weight: 650;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.fp-acta-meta {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: 8px 16px;
}
.fp-acta-meta li,
.fp-acta-meta > div {
    margin: 0;
    font-size: 0.88rem;
    overflow-wrap: anywhere;
}
.fp-acta-meta span,
.fp-acta-meta dt {
    display: block;
    margin: 0 0 2px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fp-muted);
}
.fp-acta-meta dd {
    margin: 0;
}

.fp-acta-doc {
    margin-top: 4px;
}

@media (min-width: 860px) {
    .fp-actas-board {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.fp-table--pin td,
.fp-table--pin th {
    overflow-wrap: anywhere;
}

@media (max-width: 720px) {
    .fp-table--pin thead {
        display: none;
    }
    .fp-table--pin,
    .fp-table--pin tbody,
    .fp-table--pin tr,
    .fp-table--pin td {
        display: block;
        width: 100%;
    }
    .fp-table--pin tr {
        background: #fff;
        border: 1px solid var(--fp-line);
        border-radius: 8px;
        padding: 8px 10px;
        margin: 0 0 8px;
    }
    .fp-table--pin td {
        padding: 4px 0;
    }
    .fp-table--pin td::before {
        content: attr(data-label);
        display: block;
        font-size: 0.68rem;
        font-weight: 700;
        text-transform: uppercase;
        color: var(--fp-muted);
        letter-spacing: 0.04em;
    }
}

.fp-tkt-none {
    color: var(--fp-muted);
    margin: 0;
    font-size: 0.82rem;
}

body.fp-page .fp-pin-btn {
    width: 100% !important;
    min-height: 44px !important;
    flex: 1 1 auto !important;
}

/*
 * 59.12 — Pie del recuadro de PIN: Cancelar y Confirmar en la misma fila,
 * navy / gris claro (no el botón nativo gris de color-scheme: dark).
 * Va después de .fp-pin-btn para ganar el flex 100 %.
 */
body.fp-page .fp-pin-sheet .fp-step-foot {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 10px;
    margin-top: 8px;
}

body.fp-page .fp-pin-sheet .fp-step-foot .fp-pin-btn,
body.fp-page .fp-pin-sheet .fp-step-foot .lg-btn-primary,
body.fp-page .fp-pin-sheet .fp-step-foot .lg-btn-ghost {
    -webkit-appearance: none;
    appearance: none;
    flex: 1 1 calc(50% - 8px) !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 44px !important;
}

body.fp-page .fp-pin-sheet .lg-btn-primary,
body.fp-page .fp-pin-sheet .fp-pin-btn.lg-btn-primary {
    background: #00609c !important;
    color: #fff !important;
    border: 1px solid #00609c !important;
}

body.fp-page .fp-pin-sheet .lg-btn-ghost,
body.fp-page .fp-pin-sheet .fp-pin-btn.lg-btn-ghost {
    background: #e8eef4 !important;
    color: #0f172a !important;
    border: 1px solid #c5d7e8 !important;
}

/* Ficha: pestañas compactas (Datos | Sistema) y subpaneles de Sistema. */
.fp-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 8px;
}
.fp-tab {
    min-height: 44px;
    min-width: 0;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 650;
    font-size: 0.88rem;
    color: var(--fp-brand-deep);
    background: #fff;
    border: 1px solid var(--fp-line);
}
.fp-tab.is-on {
    background: var(--fp-brand);
    color: #fff;
    border-color: var(--fp-brand);
}
/* Segunda fila: PIN y seguridad | Auditoría (sigue vista=sistema). */
.fp-subtabs {
    margin-top: -2px;
    padding-top: 6px;
    border-top: 1px solid var(--fp-line);
}
body.fp-page--list .fp-subtabs {
    margin: 0 0 8px;
    padding-top: 0;
    border-top: 0;
}
.fp-panel {
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 8px;
    padding: 10px 12px;
    margin: 0 0 8px;
    min-width: 0;
}
.fp-panel h2,
.fp-aud-h {
    margin: 0 0 6px;
    font-size: 0.95rem;
}

/*
 * Auditoría (seccion=auditoria): ancho completo, grupos por accion,
 * chips ≥44 px. Anclas respetan la cabecera fija. Un grupo oculto
 * por filtro no recorta campos de las filas que siguen visibles.
 */
.fp-aud-app {
    min-width: 0;
    width: 100%;
    max-width: 100%;
}
.fp-aud-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 10px;
    min-width: 0;
}
.fp-aud-chip {
    min-height: 44px;
    min-width: 0;
    width: auto;
    max-width: 100%;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 650;
    font-size: 0.82rem;
    color: var(--fp-brand-deep);
    background: #fff;
    border: 1px solid var(--fp-line);
    overflow-wrap: anywhere;
    box-sizing: border-box;
    flex: 0 1 auto;
}
.fp-aud-chip.is-on {
    background: var(--fp-brand);
    color: #fff;
    border-color: var(--fp-brand);
}
.fp-aud-group {
    min-width: 0;
    scroll-margin-top: 64px;
    scroll-margin-top: calc(64px + env(safe-area-inset-top, 0px));
}
.fp-aud-group.is-off {
    display: none;
}
.fp-aud-h {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 8px;
}
.fp-aud-n {
    font-weight: 650;
    font-size: 0.75rem;
    color: var(--fp-muted);
    font-variant-numeric: tabular-nums;
}
.fp-aud-chip.is-on .fp-aud-n,
.fp-aud-h .fp-aud-n {
    color: inherit;
    opacity: 0.8;
}
.fp-aud-group .fp-table-wrap {
    border: 0;
    border-radius: 0;
}

body.fp-page--list .fp-main {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
}
.fp-list-app {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.fp-list-head {
    flex: 0 0 auto;
    padding: 8px 10px 4px;
}
.fp-list-head .fp-lead {
    margin: 0;
}
.fp-list-scroll {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 4px 10px 10px;
}
body.fp-page--list .fp-foot {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 6px 10px 16px;
}

/* 58.59 — Acceso: tarjetas de puertas y bitácora de movimientos por día.
 * Nada de table-layout:fixed (partía columnas y se veía desencuadrado). */
.fp-acc-board {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    min-width: 0;
}

.fp-acc-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 12px;
    padding: 16px;
    min-width: 0;
}

.fp-acc-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    margin: 0;
    min-width: 0;
}

.fp-acc-ico {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #e8f4fb;
    color: var(--fp-brand);
    font-size: 0.95rem;
}

.fp-acc-card h2 {
    margin: 0;
    flex: 1 1 10rem;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
    min-width: 0;
    overflow-wrap: anywhere;
}

.fp-acc-meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px 16px;
    margin: 0;
    min-width: 0;
}

.fp-acc-meta > div {
    margin: 0;
    min-width: 0;
}

.fp-acc-meta dt {
    display: block;
    margin: 0 0 2px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fp-muted);
}

.fp-acc-meta dd {
    margin: 0;
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

.fp-acc-obs {
    margin: 0;
    padding: 8px 10px;
    background: #f7fafc;
    border-radius: 8px;
    color: var(--fp-muted);
    font-size: 0.84rem;
    overflow-wrap: anywhere;
}

.fp-pill--acc-on { background: #e7f6ec; color: #1b6b38; }
.fp-pill--acc-off { background: #eef3f8; color: var(--fp-muted); }
.fp-pill--acc-in { background: #e7f6ec; color: #1b6b38; }
.fp-pill--acc-out { background: #fff4d6; color: #7a5a00; }
.fp-pill--acc-other { background: #e8f4fb; color: var(--fp-brand-deep); }

.fp-acc-log {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.fp-acc-day {
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 12px;
    overflow: hidden;
    min-width: 0;
}

.fp-acc-day > h2 {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 4px 12px;
    margin: 0;
    padding: 10px 14px;
    background: var(--fp-brand-deep);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.fp-acc-day-n {
    font-weight: 600;
    font-size: 0.72rem;
    letter-spacing: 0;
    text-transform: none;
    opacity: 0.85;
    font-variant-numeric: tabular-nums;
}

.fp-acc-evs {
    list-style: none;
    margin: 0;
    padding: 0;
}

.fp-acc-ev {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 8px 12px;
    margin: 0;
    padding: 12px 14px;
    border-bottom: 1px solid var(--fp-line);
    min-width: 0;
}

.fp-acc-ev:last-child {
    border-bottom: 0;
}

.fp-acc-ev time {
    flex: 0 0 5.6rem;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    font-size: 0.88rem;
    color: var(--fp-brand-deep);
    padding-top: 2px;
}

.fp-acc-ev .fp-pill {
    flex: 0 0 auto;
    margin-top: 1px;
}

.fp-acc-ev-body {
    flex: 1 1 12rem;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.fp-acc-ev-body strong {
    font-size: 0.95rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.fp-acc-ev-txt,
.fp-acc-ev-card {
    display: block;
    color: var(--fp-muted);
    font-size: 0.8rem;
    overflow-wrap: anywhere;
}

@media (min-width: 860px) {
    .fp-acc-board {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .fp-acc-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .fp-acc-ev time {
        flex: 0 0 100%;
        font-size: 0.82rem;
    }
    .fp-table--insumos td {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
    }
}

@media (min-width: 721px) {
    body.fp-page--list .fp-list-head,
    body.fp-page--list .fp-list-scroll {
        padding-left: 14px;
        padding-right: 14px;
    }
    body.fp-page--list .fp-list-scroll {
        padding-bottom: 14px;
    }
    body.fp-page--list .fp-foot {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 6px 14px 12px;
    }
}

/*
 * Actas: cromo fijo. Un solo scroller (.fp-list-scroll). Alto 100vh →
 * 100dvh → --ms-app-height. height:100% solo rompía iOS (contenido
 * recortado y el menú no dejaba salir).
 */
html.fp-html--actas {
    height: 100%;
    height: 100vh;
    height: 100dvh;
    height: var(--ms-app-height, 100vh);
    max-height: 100%;
    max-height: 100vh;
    max-height: 100dvh;
    max-height: var(--ms-app-height, 100vh);
    overflow: hidden;
}

body.fp-page--actas {
    height: 100%;
    height: 100vh;
    height: 100dvh;
    height: var(--ms-app-height, 100vh);
    max-height: 100%;
    max-height: 100vh;
    max-height: 100dvh;
    max-height: var(--ms-app-height, 100vh);
    overflow: hidden;
}

body.fp-page--actas .fp-app,
body.fp-page--actas .fp-body {
    height: 100%;
    max-height: 100%;
    min-height: 0;
    overflow: hidden;
}

body.fp-page--actas.fp-page--list .fp-main {
    overflow: hidden;
    min-height: 0;
}

body.fp-page--actas .fp-list-scroll {
    overflow: auto;
    min-height: 0;
    -webkit-overflow-scrolling: touch;
}

body.fp-page--actas .fp-actas-wrap {
    overflow: visible;
}

.fp-actas,
.fp-actas-wrap {
    min-width: 0;
    width: 100%;
    max-width: 100%;
}

body.fp-page--actas .fp-actas-wrap {
    overflow-x: hidden;
    overflow-y: visible;
}

body.fp-page--actas .fp-table--actas {
    table-layout: auto;
}

body.fp-page--actas .fp-table--actas th,
body.fp-page--actas .fp-table--actas td {
    min-width: 0;
    vertical-align: top;
    overflow-wrap: break-word;
    word-break: normal;
}
body.fp-page--actas .fp-table--actas th:first-child,
body.fp-page--actas .fp-table--actas td:first-child {
    width: 4.5rem;
    white-space: nowrap !important;
}

body.fp-page--actas .fp-table--actas th:last-child,
body.fp-page--actas .fp-table--actas td:last-child {
    width: 11rem;
}

.fp-actas-num {
    font-weight: 800;
    color: var(--fp-brand-deep);
    font-variant-numeric: tabular-nums;
}

.fp-actas-asunto {
    display: block;
    font-weight: 650;
}

.fp-actas-when,
.fp-actas-sub {
    display: block;
    overflow-wrap: anywhere;
}

.fp-actas-sub {
    color: var(--fp-muted);
    font-size: 0.78rem;
    font-weight: 500;
    margin-top: 2px;
}

body.fp-page--actas a.fp-actas-pdf {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 44px !important;
    height: auto !important;
    padding: 8px 12px !important;
    white-space: normal !important;
    text-align: center;
}

.fp-actas-nopdf {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 6px 10px;
    border-radius: 10px;
    background: #eef3f8;
    color: var(--fp-muted);
    font-weight: 650;
    font-size: 0.82rem;
}

@media (max-width: 960px) {
    body.fp-page--actas .fp-actas-wrap {
        background: transparent;
        border: 0;
        border-radius: 0;
    }
    body.fp-page--actas .fp-table--actas,
    body.fp-page--actas .fp-table--actas tbody {
        display: block;
        width: 100%;
        table-layout: auto;
    }
    body.fp-page--actas .fp-table--actas thead {
        display: none;
    }
    body.fp-page--actas .fp-table--actas tr {
        display: block;
        background: #fff;
        border: 1px solid var(--fp-line);
        border-left: 3px solid var(--fp-gold);
        border-radius: 8px;
        padding: 10px;
        margin: 0 0 8px;
    }
    body.fp-page--actas .fp-table--actas td {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        gap: 2px;
        border: 0;
        padding: 5px 0;
        width: auto;
    }
    body.fp-page--actas .fp-table--actas td::before {
        content: attr(data-label);
        font-weight: 700;
        color: var(--fp-muted);
        font-size: 0.7rem;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        flex: none;
    }
    body.fp-page--actas .fp-table--actas td[data-label="Documento"] {
        padding-top: 8px;
    }
}

/*
 * 58.62 — Ficha (Datos / Carnet / Sistema) y acceso del portal.
 * Se apoya en el cromo fijo de 58.61 (html/body recortados, .fp-top fijo,
 * tablas con scroll propio). No se toca overflow de html/body ni la barra.
 */
.fp-toast {
    position: fixed;
    top: 12px;
    right: 12px;
    left: 12px;
    z-index: 140;
    max-width: 32rem;
    margin: 0 auto;
    padding: 12px 14px;
    border-radius: 12px;
    font-size: 0.9rem;
    line-height: 1.4;
    font-weight: 650;
    box-shadow: 0 10px 28px rgba(11, 28, 44, 0.28);
    pointer-events: none;
}

.fp-toast--error {
    background: #c62828;
    color: #fff;
    border: 1px solid #9b1c1c;
}

/* btn-square achicaba este botón a ~28 px (no estaba en la exclusión). */
body.fp-page .fp-login-reset {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 44px !important;
    height: auto !important;
    margin: 8px 0 0;
    padding: 10px 14px !important;
    border: 1.5px solid var(--fp-brand, #00609c);
    border-radius: 10px;
    background: #fff;
    color: var(--fp-brand, #00609c);
    font: inherit;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    flex: 0 0 auto !important;
    white-space: normal !important;
    box-sizing: border-box;
    cursor: pointer;
}

.fp-ro-text {
    min-height: 44px;
    min-width: 0;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--fp-line);
    border-radius: 8px;
    background: #eef3f8;
    color: var(--fp-ink);
    font-size: 16px;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    box-sizing: border-box;
}

.fp-field--wrap .fp-input {
    white-space: normal;
    overflow-wrap: anywhere;
}

.fp-ficha-card {
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 12px;
    padding: 14px 14px 12px;
    min-width: 0;
    margin: 0 0 12px;
}

.fp-ficha-card h2 {
    margin: 0 0 10px;
    font-size: 1.02rem;
}

.fp-svc-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
}

.fp-svc-head h2 {
    margin: 0;
}

.fp-svc-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    margin: 0 0 8px;
    padding: 0;
    min-width: 0;
}

.fp-svc-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    min-width: 0;
    padding: 8px 10px;
    border-radius: 999px;
    background: #e8f4fb;
    border: 1px solid #c5dff0;
    font-size: 0.82rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.fp-svc-x {
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border: 0;
    background: transparent;
    cursor: pointer;
    font-size: 1.1rem;
    line-height: 1;
}

.fp-ac-list {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    z-index: 8;
    max-height: 220px;
    overflow: auto;
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(11, 28, 44, 0.12);
}

.fp-field { position: relative; }

.fp-ac-list button {
    display: block;
    width: 100%;
    text-align: left;
    min-height: 44px;
    padding: 8px 12px;
    border: 0;
    background: #fff;
    font: inherit;
    font-size: 16px;
    cursor: pointer;
    overflow-wrap: anywhere;
}

.fp-ac-list button:hover,
.fp-ac-list button:focus {
    background: #e8f4fb;
}

.fp-mail-badge {
    margin: 6px 0 0;
    font-size: 0.8rem;
    color: var(--fp-muted);
}

.fp-mail-badge.is-ok {
    color: var(--fp-ok);
    font-weight: 650;
}

.fp-mail-verify {
    margin: 8px 0 0;
}

.fp-ip {
    display: block;
    font-variant-numeric: tabular-nums;
}

.fp-ip-geo {
    display: block;
    margin-top: 2px;
    font-size: 0.75rem;
    color: var(--fp-muted);
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.fp-id-hero {
    background: #0b1c2c;
    color: #fff;
    border-radius: 12px;
    padding: 16px 16px 14px;
    min-width: 0;
}

.fp-id-org {
    margin: 0 0 4px;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #e8d48a;
}

.fp-id-hero h2 {
    margin: 0 0 6px;
    font-size: 1.2rem;
}

.fp-id-hero p {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.82);
}

.fp-id-cards {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.fp-id-card {
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 12px;
    padding: 14px;
    min-width: 0;
    border-left: 3px solid #c9a227;
}

.fp-id-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
}

.fp-id-card-k {
    margin: 0;
    font-weight: 700;
}

.fp-id-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.fp-id-pill {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 4px 10px;
    border-radius: 999px;
    background: #eef3f8;
    font-size: 0.75rem;
}

.fp-id-pill.is-on {
    background: #e8f7ef;
    color: #0f7b4c;
}

.fp-id-card-svc,
.fp-id-card-code {
    margin: 8px 0 0;
    overflow-wrap: anywhere;
}

.fp-id-timeline {
    margin: 12px 0 0;
    padding: 0 0 0 18px;
}

.fp-id-timeline li {
    margin: 0 0 8px;
}

.fp-id-timeline strong {
    display: block;
    font-size: 0.78rem;
}

.fp-id-timeline span {
    display: block;
    color: var(--fp-muted);
    font-size: 0.86rem;
    overflow-wrap: anywhere;
}

.fp-id-card-upd {
    margin: 8px 0 0;
    font-size: 0.75rem;
    color: var(--fp-muted);
}

.fp-pwd-last {
    margin: 0 0 10px;
    font-size: 0.88rem;
    line-height: 1.4;
    color: var(--fp-muted);
    overflow-wrap: anywhere;
}

.fp-sec-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.fp-sec-sheet {
    width: min(440px, 100%);
}

@media (min-width: 860px) {
    .fp-sec-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    body.fp-page--ficha .fp-ficha-card .fp-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

#fpServiciosWrap:not(.is-unlocked) .fp-svc-edit {
    display: none !important;
}

#fpServiciosWrap.is-unlocked .fp-ro-text {
    display: none;
}

#fpServiciosWrap.is-unlocked .fp-svc-x {
    display: inline-flex;
}

body.fp-page--guest .fp-pin-overlay {
    z-index: 150;
}

.fp-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.fp-top-bell {
    position: relative;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: #fff;
    text-decoration: none;
    border-radius: 10px;
}

.fp-top-bell.is-on,
.fp-top-bell:hover {
    background: rgba(255, 255, 255, 0.12);
}

.fp-bell-n,
.fp-nav-n {
    position: absolute;
    top: 4px;
    right: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: #c9a227;
    color: #0b1c2c;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
}

.fp-nav-a {
    position: relative;
}

.fp-nav-n {
    position: static;
    margin-left: auto;
}

.fp-nav-av--foto {
    overflow: hidden;
    padding: 0;
    background: #001a2e;
}

.fp-nav-av--foto img {
    width: 40px;
    height: 40px;
    object-fit: cover;
    object-position: center top;
    display: block;
}

.fp-aviso-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.fp-aviso-item {
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 12px;
    padding: 12px 14px;
    min-width: 0;
}

.fp-aviso-item.is-new {
    border-color: var(--fp-gold);
}

.fp-aviso-k {
    margin: 0 0 4px;
    font-weight: 700;
    color: var(--fp-brand-deep);
}

.fp-aviso-item p {
    margin: 0 0 6px;
    overflow-wrap: anywhere;
}

.fp-aviso-item time {
    color: var(--fp-muted);
    font-size: 0.78rem;
}

.fp-cruzado-box {
    background: #fff;
    border: 1px solid var(--fp-line);
    border-top: 4px solid var(--fp-gold);
    border-radius: 12px;
    padding: 16px 16px 14px;
    min-width: 0;
}

.fp-cruzado-box h2 {
    margin: 0 0 8px;
    font-size: 1.05rem;
}

.fp-cruzado-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
    min-width: 0;
}

.fp-cruzado-actions .fp-btn,
.fp-cruzado-actions .fp-step-btn {
    width: 100%;
}

/*
 * Equipos a cargo: dos listas (pendiente / firmado), app a pantalla completa.
 * 100vh luego 100dvh. Tarjetas institucionales; toques 44px; letra 16px.
 */
html.fp-html--equipos {
    height: 100%;
    height: 100vh;
    height: 100dvh;
    height: var(--ms-app-height, 100vh);
    overflow: hidden;
}
body.fp-page--equipos {
    height: 100%;
    height: 100vh;
    height: 100dvh;
    height: var(--ms-app-height, 100vh);
    overflow: hidden;
}
body.fp-page--equipos .fp-app,
body.fp-page--equipos .fp-body {
    height: 100%;
    min-height: 0;
}
body.fp-page--equipos.fp-page--list .fp-main {
    min-height: 0;
    overflow: hidden;
}
body.fp-page--equipos .fp-list-scroll {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.fp-eq-board {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
}
@media (min-width: 900px) {
    .fp-eq-board {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
        align-items: start;
    }
}
.fp-eq-col {
    min-width: 0;
    background: #fff;
    border: 1px solid var(--fp-line);
    border-radius: 12px;
    padding: 12px;
}
.fp-eq-col-head h2 {
    margin: 0;
    font-size: 1.05rem;
    color: var(--fp-brand-deep);
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.fp-eq-n {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    min-height: 28px;
    padding: 0 8px;
    border-radius: 999px;
    background: var(--fp-paper);
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--fp-muted);
}
.fp-eq-col-head p {
    margin: 6px 0 12px;
    color: var(--fp-muted);
    font-size: 0.88rem;
}
.fp-eq-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.fp-eq-card {
    background: #fff;
    border: 1px solid var(--fp-line);
    border-left: 4px solid var(--fp-gold);
    border-radius: 10px;
    padding: 12px;
    min-width: 0;
}
.fp-eq-card-head h3 {
    margin: 4px 0 8px;
    font-size: 1.05rem;
    color: var(--fp-ink);
    /* break-word: parte solo si no entra; anywhere partía «DIRECCION» a mitad. */
    overflow-wrap: break-word;
}
.fp-eq-k {
    margin: 0;
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fp-muted);
    font-weight: 700;
}
.fp-eq-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 999px;
    max-width: 100%;
    overflow-wrap: break-word;
}
.fp-eq-status.is-wait {
    background: #fff6e5;
    color: #9a6700;
}
.fp-eq-status.is-ok {
    background: #e7f6ee;
    color: var(--fp-ok);
}
.fp-eq-meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 12px;
    margin: 10px 0 0;
    min-width: 0;
}
.fp-eq-meta div { min-width: 0; }
/* Ubicación (primer dato) es un servicio largo: fila completa, sin partir sílabas. */
.fp-eq-meta div:first-child { grid-column: 1 / -1; }
.fp-eq-meta dt {
    font-size: 0.72rem;
    color: var(--fp-muted);
    font-weight: 600;
}
.fp-eq-meta dd {
    margin: 0;
    font-size: 0.9rem;
    color: var(--fp-ink);
    overflow-wrap: break-word;
}
.fp-eq-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}
.fp-eq-sign,
.fp-eq-pdf {
    min-height: 44px;
    min-width: 44px;
    padding: 8px 14px;
    font-size: 16px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
}
.fp-eq-sign {
    background: var(--fp-brand);
    color: #fff;
    border-color: var(--fp-brand);
}
.fp-eq-pdf {
    background: #fff;
    color: var(--fp-brand-deep);
    border-color: var(--fp-line);
}
.fp-eq-empty { margin: 0; }
@media (max-width: 640px) {
    .fp-eq-meta { grid-template-columns: 1fr; }
}

/*
 * 58.97 — Modo oscuro del portal autenticado.
 *
 * 58.64 invertía tokens y unas pocas tarjetas. El resto de superficies
 * sigue con background:#fff (paneles PIN, tickets, actas, acceso, vacíos,
 * tablas, candados, pestañas). El cuerpo ya tenía ink claro, así que el
 * texto heredado sobre blanco se veía lavado. Además --fp-brand-deep
 * pasaba a cian y pintaba la barra/pie (cromo institucional) de claro.
 *
 * Acá: el cromo (--fp-brand-deep) se queda navy. Lienzo y papel oscuros.
 * Toda tarjeta/input/vacío del app autenticado toma --fp-card / --fp-ink.
 * El ingreso (guest) no se toca: ya es membrete navy con tarjeta blanca.
 * Color sólido primero; sin color-mix. El dispositivo en claro no entra.
 */
@media (prefers-color-scheme: dark) {
    .fp-page {
        --fp-brand: #4aa3d8;
        --fp-brand-deep: #003d66;
        --fp-brand-mid: #3d7eaa;
        --fp-gold: #d4b44a;
        --fp-paper: #0f161d;
        --fp-ink: #e8eef4;
        --fp-muted: #9eb0c0;
        --fp-line: #2f3d4a;
        --fp-danger: #ef9a9a;
        --fp-ok: #81c784;
        --fp-card: #1a232c;
        --fp-field: #121a22;
        --fp-heading: #8ec8ea;
        --fp-soft: #24303a;
    }

    /* Lienzo de la app. color-scheme: controles nativos (select, autofill). */
    body.fp-page:not(.fp-page--guest) {
        background: #0b1218;
        color: #e8eef4;
        color-scheme: dark;
    }
    .fp-app,
    .fp-main,
    .fp-list-app,
    .fp-list-scroll,
    .fp-list-head {
        background: var(--fp-paper);
        color: var(--fp-ink);
    }

    /*
     * Papel: cualquier caja que en claro es blanca. Un selector amplio
     * evita que una vista nueva (equipos, insumos, PIN) quede otra vez
     * blanca con tinta clara. El cromo (barra, menú, botones navy) no
     * entra: no usa #fff de fondo.
     */
    .fp-home-hero,
    .fp-ficha-card,
    .fp-ficha-photo,
    .fp-aviso-item,
    .fp-id-card,
    .fp-kpi,
    .fp-card,
    .lg-card,
    .fp-cruzado-box,
    .fp-panel,
    .fp-empty,
    .fp-table-wrap,
    .fp-rec,
    .fp-tkt-card,
    .fp-rec-card,
    .fp-acta-card,
    .fp-acc-card,
    .fp-acc-day,
    .fp-eq-col,
    .fp-eq-card,
    .fp-pin-sheet,
    .fp-ac-list {
        background: var(--fp-card);
        color: var(--fp-ink);
        border-color: var(--fp-line);
    }

    /* Títulos sobre papel oscuro: cian legible, no navy del cromo. */
    .fp-home-title,
    .fp-aviso-k,
    .fp-ficha-card h2,
    .fp-id-block h2,
    .fp-panel h2,
    .fp-aud-h,
    .fp-cruzado-box h2,
    .fp-rec-bar h2,
    .fp-rec h2,
    .fp-tkt-card h2,
    .fp-rec-card h2,
    .fp-tkt-head h2,
    .fp-acta-card .fp-actas-asunto,
    .fp-acc-card h2,
    .fp-eq-col-head h2,
    .fp-eq-card-head h3,
    .fp-id-card-k,
    .fp-pin-sheet h2,
    .fp-svc-head h2 {
        color: var(--fp-heading);
    }

    .fp-lead,
    .fp-home-hello,
    .fp-field-stamp,
    .fp-field-hint,
    .fp-field label,
    .fp-field .lg-label,
    .fp-ficha-photo p,
    .fp-kv dt,
    .fp-dl dt,
    .fp-tkt-meta span,
    .fp-tkt-meta dt,
    .fp-acc-meta dt,
    .fp-eq-meta dt,
    .fp-eq-k,
    .fp-eq-col-head p,
    .fp-tkt-acts time,
    .fp-tkt-who,
    .fp-tkt-tl h3,
    .fp-tkt-card h3,
    .fp-rec h3,
    .fp-live-bar,
    .fp-mail-badge,
    .fp-card span {
        color: var(--fp-muted);
    }
    .fp-field-stamp:not(.fp-field-stamp--empty) {
        color: var(--fp-heading);
    }
    .fp-field-hint.is-ok,
    .fp-mail-badge.is-ok,
    .fp-field-status.is-ok {
        color: var(--fp-ok);
    }
    .fp-field-hint.is-err {
        color: var(--fp-danger);
    }

    .fp-tkt-act-txt,
    .fp-acc-meta dd,
    .fp-eq-meta dd,
    .fp-kv dd,
    .fp-dl dd,
    .fp-acta-card,
    .fp-tkt-meta dd,
    .fp-tkt-meta li {
        color: var(--fp-ink);
    }
    .fp-eq-status.is-wait {
        background: #3a3018;
        color: #e6c86a;
    }
    .fp-eq-status.is-ok {
        background: #1b3d2a;
        color: #9be7b4;
    }
    .fp-eq-pdf {
        background: var(--fp-field);
        color: var(--fp-heading);
        border-color: var(--fp-line);
    }
    .fp-eq-n {
        background: var(--fp-soft);
        color: var(--fp-heading);
    }

    /* Inputs: .fp-field input gana a .fp-input (por eso 58.64 no los oscurecía). */
    .fp-input,
    .fp-field input,
    .fp-field select,
    .fp-field textarea,
    .lg-input,
    select.fp-input,
    .fp-ro,
    .fp-ro-text {
        background: var(--fp-field);
        color: var(--fp-ink);
        border-color: var(--fp-line);
        caret-color: var(--fp-heading);
    }
    .fp-input::placeholder,
    .fp-field input::placeholder,
    .lg-input::placeholder {
        color: #7e92a6;
    }
    body.fp-page:not(.fp-page--guest) .fp-pin-input,
    body.fp-page:not(.fp-page--guest) input.fp-pin-input {
        background: #17232e;
        color: var(--fp-ink);
        border-color: var(--fp-line);
        caret-color: var(--fp-brand);
    }
    body.fp-page:not(.fp-page--guest) .fp-pin-input::placeholder {
        color: #7e92a6;
    }
    body.fp-page:not(.fp-page--guest) .fp-pin-input:focus {
        background: #1b2a38;
        border-color: var(--fp-brand);
        box-shadow: 0 0 0 3px rgba(74, 163, 216, 0.22);
    }
    body.fp-page:not(.fp-page--guest) .fp-pin-toggle {
        color: var(--fp-muted);
        background: transparent;
    }
    body.fp-page:not(.fp-page--guest) .fp-pin-toggle:hover,
    body.fp-page:not(.fp-page--guest) .fp-pin-toggle:focus {
        color: var(--fp-heading, var(--fp-ink));
        background: #1a3344;
    }
    body.fp-page:not(.fp-page--guest) .fp-pin-sheet .lg-btn-ghost {
        background: #243444 !important;
        color: var(--fp-ink) !important;
        border-color: var(--fp-line) !important;
    }
    body.fp-page:not(.fp-page--guest) .fp-pin-sheet .lg-btn-primary {
        background: #00609c !important;
        color: #fff !important;
        border-color: #4aa3d8 !important;
    }
    .fp-field--edit .fp-input[readonly] {
        background: var(--fp-soft);
        color: var(--fp-ink);
    }

    .fp-lock {
        background: var(--fp-field);
        color: var(--fp-muted);
        border-color: var(--fp-line);
    }
    .fp-lock[aria-pressed="true"] {
        background: #1a3344;
        border-color: var(--fp-brand);
        color: var(--fp-heading);
    }
    .fp-lock:hover,
    .fp-lock:focus {
        color: var(--fp-heading);
        border-color: var(--fp-brand);
    }

    /* Pestañas inactivas: papel, no blanco. Activa sigue navy/brand. */
    .fp-tab,
    .fp-aud-chip {
        background: var(--fp-card);
        color: var(--fp-heading);
        border-color: var(--fp-line);
    }
    .fp-tab.is-on,
    .fp-aud-chip.is-on {
        background: var(--fp-brand);
        color: #fff;
        border-color: var(--fp-brand);
    }

    .fp-table th {
        background: var(--fp-soft);
        color: var(--fp-muted);
    }
    .fp-table th,
    .fp-table td {
        border-bottom-color: var(--fp-line);
        color: var(--fp-ink);
    }
    .fp-table th {
        color: var(--fp-muted);
    }

    /* Recuadros internos (descripción de ticket, observación de puerta). */
    .fp-tkt-desc,
    .fp-acc-obs {
        background: var(--fp-soft);
        color: var(--fp-ink);
    }
    .fp-acc-obs {
        color: var(--fp-muted);
    }
    .fp-acc-ico {
        background: #1a3344;
        color: var(--fp-heading);
    }

    /* Chips de estado: fondo oscuro y tinta clara (el pastel sobre card oscura queda sucio). */
    .fp-pill {
        background: #1a3344;
        color: var(--fp-heading);
    }
    .fp-pill--is-open,
    .fp-pill--acc-other {
        background: #1a3344;
        color: var(--fp-heading);
    }
    .fp-pill--is-work,
    .fp-pill--acc-out {
        background: #3a3018;
        color: #e6c86a;
    }
    .fp-pill--is-done,
    .fp-pill--acc-on,
    .fp-pill--acc-in {
        background: #1b3d2a;
        color: #9be7b4;
    }
    .fp-pill--acc-off {
        background: var(--fp-soft);
        color: var(--fp-muted);
    }

    .fp-home-meta li,
    .fp-svc-chip,
    .fp-wait,
    .fp-wait-box {
        background: #1a3344;
        border-color: #2a4a60;
        color: var(--fp-ink);
    }

    .fp-ac-list button {
        background: var(--fp-card);
        color: var(--fp-ink);
    }
    .fp-ac-list button:hover,
    .fp-ac-list button:focus {
        background: #1a3344;
        color: var(--fp-heading);
    }

    /* Pie: kicker navy sobre lienzo oscuro no se leía; pasa a heading. */
    .fp-foot {
        color: var(--fp-muted);
        border-top-color: var(--fp-line);
    }
    .fp-foot-kicker,
    .fp-foot > p {
        color: var(--fp-heading);
    }
    .fp-foot .ms-dev-mark {
        color: var(--fp-muted);
    }

    .fp-empty {
        color: var(--fp-muted);
    }

    .fp-alert {
        background: #3a2218;
        color: #f0c4b8;
        border-color: #6b3a2e;
    }
    .fp-alert--ok {
        background: #1b3d2a;
        color: #9be7b4;
        border-color: #2e6b48;
    }

    /* Actas en celular: cada fila era una tarjeta blanca. */
    body.fp-page--actas .fp-table--actas tr {
        background: var(--fp-card);
        border-color: var(--fp-line);
        color: var(--fp-ink);
    }

    /* Día de bitácora: encabezado navy (cromo) con texto blanco, cuerpo oscuro. */
    .fp-acc-day > h2 {
        background: var(--fp-brand-deep);
        color: #fff;
    }

    /* Cumpleaños: el naranja pastel sobre lienzo oscuro queda sucio. */
    .fp-home-bday {
        background: #3a3018;
        border-color: #6b5420;
        color: #f3d7a0;
    }
    .fp-home-bday-icon {
        background: var(--fp-card);
        color: #f0a0b0;
    }

    .fp-kpi > i {
        color: var(--fp-heading);
    }
}