/* vent Live · pantalla de la app (placeholder del demo vivo). Clases con prefijo lx- para no chocar con vent.css */
.lxapp-host{--ease:cubic-bezier(.23,1,.32,1)}
.lxapp-host{container:lxapp/inline-size;width:100%;height:100%}
.lxapp{position:relative;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto;width:100%;height:100%;background:var(--perla);color:var(--negro);border-radius:14px;overflow:hidden;font-weight:300;isolation:isolate;box-shadow:0 0 0 1px var(--p-14),0 40px 120px rgba(0,0,0,.55)}
.lxapp button{cursor:pointer}
.lx-top{display:flex;align-items:center;gap:18px;background:var(--negro);color:var(--perla);height:52px;padding:0 18px}
.lx-logo{height:24px;width:auto;flex:none}
.lx-tabs{display:flex;gap:2px;margin-left:6px;overflow:auto;scrollbar-width:none}
.lx-tabs::-webkit-scrollbar{display:none}
.lx-tab{position:relative;height:32px;padding:0 13px;border-radius:8px;font-weight:700;font-size:12px;letter-spacing:.04em;color:var(--p-60);white-space:nowrap;display:inline-flex;align-items:center;gap:7px;transition:color .2s,background-color .2s}
.lx-tab:hover{color:var(--perla)}
.lx-tab[aria-selected=true]{background:var(--p-14);color:var(--perla)}
.lx-tab em{font-style:normal;min-width:18px;height:18px;border-radius:9px;background:var(--neon);color:var(--negro);font-size:11px;display:inline-grid;place-items:center;padding:0 5px}
.lx-tab em[hidden]{display:none}
.lx-ten{margin-left:auto;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--p-40);white-space:nowrap}

/* Pulse */
.lx-pulse{background:var(--negro);color:var(--perla);padding:6px 18px 18px;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;border-top:1px solid var(--p-08)}
.lx-pulse[hidden]{display:none}
.vp{position:relative;padding:12px 14px 6px 0}
.vp+.vp{padding-left:16px;border-left:1px solid var(--p-14)}
.vp-l{font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--p-60)}
.vp-r{display:flex;align-items:baseline;gap:7px;font-weight:700;font-size:clamp(17px,2.4cqw,28px);letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.25}
.vp-r small{font-weight:700;font-size:10px;letter-spacing:.1em;color:var(--p-60)}
.vp-hl .vp-r:first-of-type{color:var(--neon)}
.vp-o .vp-big{font-weight:800;font-size:clamp(28px,4cqw,46px);letter-spacing:-.05em;line-height:1.05}
.vp-o .vp-sub{font-size:11px;color:var(--p-60);font-weight:300}
.vp::after{content:"";position:absolute;inset:6px 0 0 0;background:var(--neon);opacity:0;pointer-events:none;border-radius:8px;mix-blend-mode:normal}
.vp.flash::after{animation:vpflash .9s var(--ease)}
@keyframes vpflash{0%{opacity:.28}100%{opacity:0}}

.lx-view{position:relative;overflow:auto;padding:22px 22px 16px;min-height:0;scrollbar-width:thin;scrollbar-color:var(--gris) transparent}
.lx-view:has(.vr){padding:0}
.lx-h{font-weight:800;font-size:clamp(24px,3.4cqw,40px);letter-spacing:-.045em;line-height:1;margin-bottom:6px}
.lx-sub{font-weight:300;font-size:13px;color:var(--n-60);margin-bottom:18px}
.lx-foot{background:var(--negro);color:var(--p-60);font-size:12px;padding:12px 18px;display:flex;align-items:center;gap:10px}
.lx-foot img{height:15px;width:auto}

/* tabla de cobros */
.vc{display:grid;grid-template-columns:minmax(0,1.5fr) 70px minmax(0,1fr) 108px 150px;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--n-12);font-size:13px}
.vc-h{font-weight:700;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--n-60);padding-bottom:8px;border-bottom:1.5px solid var(--negro)}
.vc b{display:block;font-weight:700;font-size:13.5px;line-height:1.25}
.vc span.q{font-size:12px;color:var(--n-60)}
.c-m{text-align:right}.vm{font-weight:700;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.vm small{font-size:10px;letter-spacing:.08em;margin-left:4px}
.chip{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:5px;font-weight:700;font-size:11.5px;white-space:nowrap}
.chip.pagado{background:var(--negro);color:var(--perla)}
.chip.pendiente{border:1.5px solid var(--negro)}
.chip.vencido{background:var(--olivo);color:var(--neon)}
.chip.por_autorizar{background:var(--neon);color:var(--negro)}
.chip.reversado{border:1.5px solid var(--gris);color:var(--n-60);text-decoration:line-through}
.chip.vigente{background:var(--negro);color:var(--perla)}
.lx-btn{height:34px;padding:0 15px;border-radius:999px;background:var(--neon);color:var(--negro);font-weight:700;font-size:12.5px;white-space:nowrap;transition:transform .18s var(--ease)}
.lx-btn:active{transform:scale(.96)}
.lx-btn.is-line{background:none;border:1.5px solid var(--negro)}
.lx-link{font-weight:700;font-size:12.5px;text-decoration:underline;text-underline-offset:3px}
.vc.nuevo{animation:rowin .7s var(--ease)}
@keyframes rowin{from{opacity:.2;transform:translateX(-10px)}to{opacity:1;transform:none}}
.lx-note{margin-top:14px;font-size:12px;color:var(--n-60)}

/* Multisig */
.vk{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1.5px solid var(--negro);border-radius:12px;overflow:hidden;margin-bottom:14px;background:var(--perla)}
.vk>div{padding:16px 18px}
.vk>div+div{border-left:1.5px solid var(--negro);background:var(--perla)}
.vk-n{font-weight:700;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--n-60);display:block;margin-bottom:8px}
.vk p{font-size:13px;line-height:1.4}
.vk p b{font-weight:700}
.vk .lx-oky{display:flex;align-items:center;gap:7px;margin-top:10px;font-size:12px;font-weight:700}
.vk .lx-oky svg{width:16px;height:16px}
.lx-hold{position:relative;display:block;width:100%;height:58px;margin-top:12px;border-radius:999px;border:1.5px solid var(--negro);overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;--p:0}
.hl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:11px;font-weight:700;font-size:13.5px;white-space:nowrap}
.hl-b{color:var(--negro)}
.hl-f{background:var(--olivo);color:var(--perla);clip-path:inset(0 calc((1 - var(--p)) * 100%) 0 0)}
.hl-f .dedo{color:var(--neon)}
.dedo{width:26px;height:26px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transform:translateY(calc(var(--p) * -2px))}
.lx-hold.hecho .hl-f{background:var(--neon);color:var(--negro);clip-path:inset(0)}
.lx-hold.hecho .hl-f .dedo{color:var(--olivo)}
.vk-hint{font-size:11.5px;color:var(--n-60);margin-top:8px}
.vk-vacio{border:1.5px dashed var(--gris);border-radius:12px;padding:30px 20px;text-align:center;font-size:13px;color:var(--n-60)}
.vk-vacio .lx-btn{margin-top:14px}

/* Historial */
.vh{display:grid;grid-template-columns:54px minmax(0,1fr) 108px 110px;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--n-12);font-size:13px}
.vh time{font-weight:700;font-variant-numeric:tabular-nums;font-size:12px;color:var(--n-60)}
.vh.rev{background:linear-gradient(90deg,rgba(0,63,51,.06),transparent)}
.vh.nuevo{animation:rowin .7s var(--ease)}
.vh b{font-weight:700}
.vh .vmm{display:block;font-size:12px;color:var(--n-60);font-weight:300}

/* Rentas: capturas reales de vent */
.vr{position:relative;height:100%;overflow:auto;background:var(--perla);scrollbar-width:thin}
.vr-in{position:relative;container:vr/inline-size;width:100%;min-width:1000px}
.vr img{width:100%;height:auto}
.vr .solo-escr{margin-top:calc(-100cqw * 48 / 1440)}
.vr-tabs{position:absolute;inset:0 auto auto 0;width:100%;height:0;pointer-events:none}
.vr-tab{position:absolute;top:calc(100cqw * 144 / 1440);height:calc(100cqw * 28 / 1440);pointer-events:auto;border-radius:4px;transition:box-shadow .2s}
.vr-tab:hover{box-shadow:0 0 0 2px var(--neon),0 0 0 3px var(--negro)}
.vr-tab[data-t=resumen]{left:calc(100cqw*96/1440);width:calc(100cqw*80/1440)}
.vr-tab[data-t=propiedades]{left:calc(100cqw*188/1440);width:calc(100cqw*98/1440)}
.vr-tab[data-t=contratos]{left:calc(100cqw*297/1440);width:calc(100cqw*99/1440)}
.vr-tab[data-t=cobros]{left:calc(100cqw*403/1440);width:calc(100cqw*76/1440)}
.vr .solo-movil{display:none}
@container lxapp (max-width:700px){
  .vr-in{min-width:0}
  .vr .solo-escr,.vr-tabs{display:none}
  .vr .solo-movil{display:block}
  .vr{background:var(--negro)}
}

/* responsive del contenido */
@container lxapp (max-width:620px){
  .lx-pulse{grid-template-columns:repeat(2,1fr);padding-bottom:10px}
  .vp:nth-child(3){padding-left:0;border-left:0}
  .vp:nth-child(n+3){border-top:1px solid var(--p-14)}
  .lx-ten{display:none}
  .vc{grid-template-columns:minmax(0,1fr) auto;gap:6px 10px}
  .vc-h{display:none}
  .vc .c-v{display:none}
  .vc .c-q{grid-column:1}
  .vc .c-m{grid-column:2;grid-row:1}
  .vc .c-e,.vc .c-a{grid-row:2}
  .vc .c-a{grid-column:2;justify-self:end}
  .vk{grid-template-columns:1fr}
  .vk>div+div{border-left:0;border-top:1.5px solid var(--negro)}
  .vh{grid-template-columns:44px minmax(0,1fr) auto;grid-template-areas:"t x e" "t x a"}
  .vh time{grid-area:t}.vh .vx{grid-area:x}.vh .ve{grid-area:e}.vh .va{grid-area:a;justify-self:end}
}
@container lxapp (max-width:480px){
  .lx-view{padding:16px 14px 12px}
  .lx-top{gap:10px;padding:0 12px}
  .lx-pulse{padding:4px 14px 8px}
  .vp{padding-top:8px}
  .vp-r{font-size:13.5px;letter-spacing:-.03em;gap:4px}
  .vp-r small{font-size:8.5px}
  .vp-l{font-size:9.5px;letter-spacing:.1em}
  .lx-pulse{grid-template-columns:repeat(3,1fr);padding-bottom:10px}
  .vp-o{display:none}
  .vp+.vp,.vp:nth-child(3){padding-left:10px;border-left:1px solid var(--p-14)}
  .vp:nth-child(n+3){border-top:0}
  .lx-foot{display:none}
}
@media (prefers-reduced-motion:reduce){.vp.flash::after,.vc.nuevo,.vh.nuevo{animation:none}}

/* Today */
.lx-tl{display:flex;flex-direction:column;gap:0}
.lx-tk{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--n-12)}
.lx-tk b{display:block;font-weight:700;font-size:14px;line-height:1.25}
.lx-pri{display:block;font-weight:700;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--n-60);margin-bottom:3px}
.lx-tk.crit .lx-pri{color:var(--olivo)}
.lx-tk .lx-r2{display:flex;gap:10px;font-size:12px;color:var(--n-60);flex-wrap:wrap;margin-top:2px}
.lx-tk .lx-r2 em{font-style:normal;font-weight:700;color:var(--negro);font-variant-numeric:tabular-nums}
.lx-ck{width:38px;height:38px;border-radius:50%;border:1.5px solid var(--negro);display:grid;place-items:center;transition:background-color .2s,transform .18s var(--ease)}
.lx-ck:active{transform:scale(.94)}
.lx-ck svg{width:18px;height:18px;opacity:.35}
.lx-tk.hecho{opacity:.5}
.lx-tk.hecho b{text-decoration:line-through}
.lx-tk.hecho .lx-ck{background:var(--negro);color:var(--neon)}
.lx-tk.hecho .lx-ck svg{opacity:1}
.lx-orden{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.lx-pill{height:28px;padding:0 12px;border-radius:999px;border:1.5px solid var(--negro);display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:300}
.lx-pill b{font-weight:800}
.lx-pill.c{background:var(--olivo);border-color:var(--olivo);color:var(--neon)}
.lx-vacio2{display:flex;align-items:center;gap:10px;margin-top:14px;font-weight:700;font-size:13px}
/* Plano */
.lx-pl{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;align-items:start}
.lx-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}
.lx-lote{aspect-ratio:1.25;border-radius:8px;border:1.5px solid var(--negro);font-weight:700;font-size:12px;display:grid;place-items:center;transition:transform .18s var(--ease),background-color .2s}
.lx-lote.disponible:hover{background:rgba(206,255,0,.35)}
.lx-lote.disponible:active{transform:scale(.95)}
.lx-lote.apartado{background:var(--neon);cursor:default}
.lx-lote.vendido{background:var(--negro);color:var(--perla);border-color:var(--negro);cursor:default}
.lx-lote.sel{background:var(--olivo);color:var(--neon);border-color:var(--olivo)}
.lx-leyenda{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px;font-size:11.5px;color:var(--n-60)}
.lx-leyenda i{display:inline-block;width:11px;height:11px;border-radius:3px;border:1.5px solid var(--negro);margin-right:6px;vertical-align:-1px}
.lx-leyenda i.a{background:var(--neon)}.lx-leyenda i.v{background:var(--negro)}
.lx-cot{border:1.5px solid var(--negro);border-radius:12px;padding:16px 18px;min-height:190px}
.lx-cot h3{font-weight:800;font-size:22px;letter-spacing:-.04em;line-height:1;margin-bottom:10px}
.lx-cot dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:12.5px}
.lx-cot dt{color:var(--n-60)}.lx-cot dd{font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.lx-cot .lx-btn{margin-top:14px;width:100%;height:42px}
.lx-cot p{font-size:13px;color:var(--n-60)}
.lx-ap{background:var(--neon);border-radius:8px;padding:10px 12px;font-weight:700;font-size:12.5px;margin-top:12px}
@container lxapp (max-width:620px){.lx-pl{grid-template-columns:1fr}}