.flujo { margin: 0; width: 100%; max-width: 480px; }
.mk-ventana { background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; box-shadow: 0 28px 56px -32px rgba(21, 21, 21, .4); }
.mk-barra { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; background: var(--bone); border-bottom: 1px solid var(--line); }
.mk-barra i { width: 9px; height: 9px; border-radius: 50%; background: #D3D3CC; }
.mk-t { display: none; margin-left: 8px; font-size: 11.5px; font-weight: 600; color: var(--muted); }
.flujo[data-paso="1"] .mk-t1, .flujo[data-paso="2"] .mk-t2, .flujo[data-paso="3"] .mk-t3, .flujo[data-paso="4"] .mk-t4 { display: block; }
.mk-escenas { position: relative; height: 292px; font-size: 12px; line-height: 1.3; }
.mk-e { position: absolute; inset: 0; padding: 14px; opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility 0s linear .2s; }
.flujo[data-paso="1"] .mk-e1, .flujo[data-paso="2"] .mk-e2, .flujo[data-paso="3"] .mk-e3, .flujo[data-paso="4"] .mk-e4 { opacity: 1; visibility: visible; transition: opacity .3s ease .2s; }
.mk-a { opacity: 0; transform: translateY(6px); transition: opacity 0s .4s, transform 0s .4s; }
.mk-xls tr.mk-a { transform: none; }
.flujo[data-paso="1"] .mk-e1 .mk-a, .flujo[data-paso="2"] .mk-e2 .mk-a, .flujo[data-paso="3"] .mk-e3 .mk-a, .flujo[data-paso="4"] .mk-e4 .mk-a { opacity: 1; transform: none; transition: opacity .35s ease calc(var(--d, 0ms) + 200ms), transform .45s cubic-bezier(.2, .8, .2, 1) calc(var(--d, 0ms) + 200ms); }

.mk-xls { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 11px; }
.mk-xls th, .mk-xls td { border: 1px solid #E6E6E0; padding: 6px 6px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk-xls th { background: var(--bone); font-weight: 600; color: var(--muted); }
.mk-xls th:first-child, .mk-xls td:first-child { width: 34px; text-align: center; color: #A2A29B; background: var(--bone); }
.mk-xls th:last-child, .mk-xls td:last-child { width: 58px; text-align: right; }
.mk-xls .dup td { transition: background 0s .4s, color 0s .4s; }
@media (max-width: 520px) { .mk-xls th:nth-child(4), .mk-xls td:nth-child(4) { display: none; } }
.flujo[data-paso="1"] .mk-e1 .dup td, .flujo[data-paso="2"] .mk-e2 .dup td, .flujo[data-paso="3"] .mk-e3 .dup td, .flujo[data-paso="4"] .mk-e4 .dup td { background: #FBE6EA; color: #B3203A; transition: background .3s ease var(--r), color .3s ease var(--r); }
.flujo[data-paso="1"] .mk-e1 .dup td:first-child, .flujo[data-paso="2"] .mk-e2 .dup td:first-child, .flujo[data-paso="3"] .mk-e3 .dup td:first-child, .flujo[data-paso="4"] .mk-e4 .dup td:first-child { background: #F6CDD5; }
.mk-aviso { position: absolute; right: 14px; bottom: 52px; padding: 6px 12px; border-radius: 999px; background: #B3203A; color: #fff; font-size: 11.5px; font-weight: 600; box-shadow: 0 8px 18px -8px rgba(179, 32, 58, .6); }
.mk-hojas { position: absolute; left: 14px; right: 14px; bottom: 12px; display: flex; gap: 4px; overflow: hidden; border-top: 1px solid #E6E6E0; padding-top: 8px; }
.mk-hojas span { flex: none; padding: 3px 8px; border-radius: 4px; background: var(--bone); font-size: 10.5px; color: var(--muted); }
.mk-hojas span:first-child { background: var(--noir); color: var(--cream); }

.mk-cab { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.mk-cab b { font-size: 14px; font-weight: 600; }
.mk-chip { padding: 4px 10px; border-radius: 999px; background: var(--noir); color: var(--cream); font-size: 11px; font-weight: 600; }
.mk-crm { list-style: none; display: grid; gap: 6px; }
.mk-crm li { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 10px; padding: 6px 8px; border: 1px solid #ECECE6; border-radius: 10px; }
.mk-av { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--bone); font-size: 10.5px; font-weight: 600; }
.mk-crm b, .mk-wa b { display: block; font-size: 12px; font-weight: 600; }
.mk-crm small, .mk-wa small { display: block; font-size: 10.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk-crm em { font-style: normal; font-size: 10.5px; font-weight: 600; padding: 3px 8px; border-radius: 999px; background: #E3F4E8; color: #1F7A3E; }
.mk-crm em.tramite { background: #FFF1D6; color: #8A5A00; }

.mk-e3 h5 { font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.mk-e3 h5:not(:first-child) { margin-top: 16px; }
.mk-barras, .mk-pagos { list-style: none; display: grid; gap: 7px; }
.mk-barras li { display: grid; grid-template-columns: 92px 1fr 60px; align-items: center; gap: 10px; }
.mk-barras span { color: var(--muted); }
.mk-barras i { height: 9px; border-radius: 5px; background: var(--wine); transform: scaleX(0); transform-origin: left; transition: transform 0s .4s; }
.flujo[data-paso="1"] .mk-e1 .mk-barras i, .flujo[data-paso="2"] .mk-e2 .mk-barras i, .flujo[data-paso="3"] .mk-e3 .mk-barras i, .flujo[data-paso="4"] .mk-e4 .mk-barras i { transform: scaleX(var(--v)); transition: transform .8s cubic-bezier(.2, .8, .2, 1) var(--d); }
.mk-barras b, .mk-pagos b { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.mk-pagos li { display: flex; justify-content: space-between; padding: 6px 10px; border-radius: 8px; background: var(--bone); }

.mk-e4 { padding: 0; display: flex; flex-direction: column; }
.mk-wa { display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-bottom: 1px solid #ECECE6; }
.mk-wa .mk-av { background: var(--wine); color: var(--cream); }
.mk-chat { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 12px 14px; background: #F4F1EC; }
.mk-m { max-width: 82%; padding: 7px 10px; border-radius: 10px 10px 10px 3px; background: #fff; box-shadow: 0 1px 1px rgba(0, 0, 0, .06); }
.mk-m b { display: block; font-weight: 600; margin-bottom: 1px; }
.mk-sale { align-self: flex-end; border-radius: 10px 10px 3px 10px; background: #D9F7D0; }
.mk-sale i { font-style: normal; color: #2A8CD9; letter-spacing: -.2em; margin-left: 2px; }
.mk-doc { display: flex; align-items: center; gap: 8px; }
.mk-doc svg { width: 22px; height: 22px; flex: none; }
.mk-doc small { display: block; font-size: 10.5px; color: var(--muted); }

.mk-pasos { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 12px; }
.mk-pasos button { position: relative; overflow: hidden; width: 100%; display: flex; align-items: center; justify-content: center; gap: 6px; height: 36px; border-radius: 999px; background: var(--bone); color: var(--muted); font-size: 12.5px; font-weight: 600; }
.mk-pasos button b { font-weight: 700; color: var(--wine); }
.mk-pasos button i { position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; background: var(--wine); transform: scaleX(0); transform-origin: left; }
.flujo[data-paso="1"] [data-ir="1"], .flujo[data-paso="2"] [data-ir="2"], .flujo[data-paso="3"] [data-ir="3"], .flujo[data-paso="4"] [data-ir="4"] { background: var(--noir); color: var(--cream); }
.flujo[data-paso="1"] [data-ir="1"] b, .flujo[data-paso="2"] [data-ir="2"] b, .flujo[data-paso="3"] [data-ir="3"] b, .flujo[data-paso="4"] [data-ir="4"] b { color: var(--wine-light); }
.flujo.anda[data-paso="1"] [data-ir="1"] i, .flujo.anda[data-paso="2"] [data-ir="2"] i, .flujo.anda[data-paso="3"] [data-ir="3"] i, .flujo.anda[data-paso="4"] [data-ir="4"] i { animation: mk-llena var(--mk-ms, 3500ms) linear forwards; background: var(--wine-light); }
@keyframes mk-llena { to { transform: scaleX(1); } }
.flujo figcaption { min-height: 44px; margin-top: 10px; font-size: 14px; font-weight: 500; line-height: 1.45; }
.mk-c { display: none; }
.flujo[data-paso="1"] .mk-c1, .flujo[data-paso="2"] .mk-c2, .flujo[data-paso="3"] .mk-c3, .flujo[data-paso="4"] .mk-c4 { display: block; }
@media (prefers-reduced-motion: reduce) { .mk-pasos button i { display: none; } }