:root{--bg:#F3F7FC;--card:#fff;--az:#1F6FD1;--azo:#124A94;--na:#F28A22;--ve:#12966B;--tu:#0E9FB3;--ro:#D14B4B;--tx:#1B2A3D;--gr:#6B7C93;--bd:#E1E9F3}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
.top{position:sticky;top:0;z-index:5;background:#fff;border-bottom:3px solid transparent;border-image:linear-gradient(90deg,var(--az),var(--tu),var(--na)) 1;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;display:flex;align-items:center;gap:10px}
.top h1{margin:0;font-size:1.25rem;color:var(--azo);flex:1}
.vacio{background:none;border:0;color:var(--az);font:inherit;font-weight:600;padding:6px}
p.vacio{color:var(--gr);text-align:center;padding:24px 8px}p.chico{font-size:.85rem;padding:8px 0 0}
main{max-width:720px;margin:0 auto;padding:12px 16px}
.hero{background:linear-gradient(135deg,#E6F0FC,#E3F6F6);border-radius:18px;padding:16px;margin-bottom:12px}
.hero p{margin:0;color:var(--gr)}.hero h2{margin:2px 0 12px;font-size:1.3rem;color:var(--azo)}.hero h2::first-letter{text-transform:uppercase}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.kpis.g{margin-bottom:12px}
.kpi{background:#fff;border-radius:12px;padding:8px 4px;text-align:center;font-size:.72rem;color:var(--gr);border-top:4px solid var(--c,var(--az))}
.kpi b{display:block;font-size:1.4rem;color:var(--tx)}
.kpi.rojo{--c:var(--ro)}.kpi.azul{--c:var(--az)}.kpi.verde{--c:var(--ve)}.kpi.gris{--c:#9AA9BD}
.bloque{background:var(--card);border-radius:16px;padding:12px;margin-bottom:12px;box-shadow:0 1px 3px #1f3b6a14}
.bloque h3{margin:0 0 8px;font-size:.95rem;color:var(--azo);display:flex;justify-content:space-between;gap:8px}
.bloque h3 span{background:#E6F0FC;color:var(--az);border-radius:99px;padding:0 9px;font-size:.8rem}
.bloque.rojo h3{color:var(--ro)}
.lista{list-style:none;margin:0;padding:0}
.fila{display:flex;gap:12px;padding:10px 0;border-top:1px solid var(--bd)}.fila:first-child{border-top:0}
.chk{flex:none;width:30px;height:30px;border-radius:50%;border:2.5px solid var(--c,var(--az));background:#fff;color:#fff;font-weight:700;font-size:1rem}
.hecha .chk{background:var(--c,var(--ve))}.hecha b{text-decoration:line-through;color:var(--gr)}
.cuerpo{flex:1;min-width:0}.cuerpo b{display:block;font-weight:600}.cuerpo small{color:var(--gr);display:block}
.meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}.meta em{font-style:normal;font-size:.75rem;background:#EEF3FA;border-radius:6px;padding:1px 7px;color:var(--gr)}
.meta .rojo{background:#FBE9E9;color:var(--ro)}.meta .alta{background:#FFF0DF;color:#B8620A}
.barra{height:7px;background:#E6EDF6;border-radius:9px;overflow:hidden;margin:6px 0;position:relative}.barra i{display:block;height:100%;background:var(--c,var(--az));border-radius:9px}
.barra.gruesa{height:12px;overflow:visible}.barra.gruesa i{background:linear-gradient(90deg,var(--az),var(--tu))}
.barra s{position:absolute;top:-4px;width:3px;height:20px;background:var(--na);border-radius:2px}
.rejilla{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tarjeta{text-align:left;font:inherit;color:var(--tx);background:#fff;border:0;border-radius:16px;padding:12px;border-top:5px solid var(--c);box-shadow:0 1px 3px #1f3b6a14;display:flex;flex-direction:column;gap:3px}
.tarjeta .ic{font-size:1.6rem}.tarjeta b{font-size:.95rem;line-height:1.2}.tarjeta small{color:var(--gr);font-size:.78rem}.tarjeta u{color:var(--ro)}
.seg{display:flex;background:#E6EDF6;border-radius:12px;padding:3px;margin-bottom:12px}.seg button{flex:1;border:0;background:none;font:inherit;font-size:.9rem;padding:7px;border-radius:9px;color:var(--gr)}.seg .on{background:#fff;color:var(--az);font-weight:600;box-shadow:0 1px 2px #0002}
.meta-t{padding:8px 0;border-top:1px solid var(--bd)}.meta-t:first-of-type{border-top:0}.mt{display:flex;justify-content:space-between;align-items:center;gap:8px}
.mt span.verdeT{color:var(--ve);font-size:.8rem;font-weight:600}.mt span.rojoT{color:var(--ro);font-size:.8rem;font-weight:600}.mt small{color:var(--gr)}
.mas{display:flex;gap:6px}.mas button{width:38px;height:38px;border-radius:10px;border:1px solid var(--bd);background:#fff;font-size:1.3rem;color:var(--az)}
.barras{display:flex;gap:6px;align-items:flex-end;height:150px;padding-top:8px}.barras div{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:2px}
.barras i{display:block;width:100%;background:linear-gradient(var(--az),var(--tu));border-radius:6px 6px 0 0;min-height:3px}.barras b{font-size:.78rem}.barras small{font-size:.65rem;color:var(--gr)}
.av{display:grid;grid-template-columns:1fr 90px 40px;gap:8px;align-items:center;font-size:.85rem}.av b{text-align:right}
.nav{position:fixed;bottom:0;left:0;right:0;z-index:6;background:#fff;border-top:1px solid var(--bd);display:flex;padding-bottom:env(safe-area-inset-bottom)}
.nav button{flex:1;border:0;background:none;font:inherit;font-size:.72rem;color:var(--gr);padding:8px 0 6px;display:flex;flex-direction:column;align-items:center;gap:1px}.nav span{font-size:1.3rem}.nav .on{color:var(--az);font-weight:700}
.fab{position:fixed;right:18px;bottom:calc(88px + env(safe-area-inset-bottom));width:58px;height:58px;border-radius:50%;border:0;background:var(--na);color:#fff;font-size:2rem;line-height:1;box-shadow:0 4px 12px #f28a2266;z-index:7}
.hoja{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center}.hoja[hidden]{display:none}
.fondo{position:absolute;inset:0;background:#0b1b3366}
.panel{position:relative;background:#fff;width:100%;max-width:720px;max-height:92vh;overflow:auto;border-radius:22px 22px 0 0;padding:8px 16px calc(16px + env(safe-area-inset-bottom))}
.panel h2{margin:4px 0 10px;color:var(--azo);font-size:1.15rem}.asa{width:44px;height:5px;border-radius:9px;background:#CBD6E4;margin:4px auto 8px}
.campo{display:block;margin-bottom:10px}.campo span{display:block;font-size:.8rem;color:var(--gr);margin-bottom:3px}
.campo input,.campo select,.campo textarea{width:100%;font:inherit;padding:10px;border:1px solid #CBD6E4;border-radius:10px;background:#fff;color:var(--tx)}
.campo input[type=range]{padding:0}.campo input[type=checkbox]{width:24px;height:24px}.fila-c{display:flex;justify-content:space-between;align-items:center}.fila-c span{margin:0;font-size:1rem;color:var(--tx)}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.acciones{display:flex;gap:8px;justify-content:flex-end;margin-top:6px}
.btn{display:inline-block;border:0;background:var(--az);color:#fff;font:inherit;font-weight:600;padding:11px 18px;border-radius:12px;text-align:center}
.btn.claro{background:#E6F0FC;color:var(--az);margin:4px 6px 4px 0}.btn.rojo{background:#FBE9E9;color:var(--ro);margin-right:auto}
.nota{color:var(--gr);font-size:.88rem;margin:6px 0}
.aviso{position:fixed;left:16px;right:16px;bottom:calc(96px + env(safe-area-inset-bottom));z-index:30;background:#1B2A3D;color:#fff;border-radius:12px;padding:12px 14px;text-align:center}.aviso[hidden]{display:none}

.av.e{grid-template-columns:1fr 80px 52px;margin:6px 0}.av.e b{white-space:nowrap}
.kpi.amar{--c:#D9A400}
.sub{margin:14px 0 4px;font-size:.8rem;color:var(--gr);text-transform:uppercase;letter-spacing:.04em}
.meta em.ok{background:#E3F6EE;color:#0B7A55}

.icb{border:0;background:none;font-size:1.3rem;padding:4px 6px}
.bib{display:flex;flex-direction:column;gap:10px}
.buscador{width:100%;box-sizing:border-box;border:2px solid var(--bd);border-radius:14px;padding:12px 14px;font:inherit;font-size:1rem;background:#fff}
.buscador:focus{outline:none;border-color:var(--az)}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}.chip{flex:none;border:1px solid var(--bd);background:#fff;border-radius:999px;padding:6px 12px;font:inherit;font-size:.82rem;color:var(--gr)}.chip.on{background:var(--az);border-color:var(--az);color:#fff}
.sel{width:100%;border:1px solid var(--bd);border-radius:12px;padding:10px;font:inherit;background:#fff}
.arch{display:flex;gap:10px;align-items:flex-start;width:100%;box-sizing:border-box;text-align:left;background:#fff;border:1px solid var(--bd);border-radius:12px;padding:10px 12px;margin:0 0 8px;font:inherit;color:inherit;text-decoration:none}
.arch .ai{font-size:1.4rem;line-height:1.2}.arch .ac{display:flex;flex-direction:column;min-width:0;gap:1px}.arch b{font-size:.9rem;overflow-wrap:anywhere}.arch small{color:var(--gr);font-size:.72rem;overflow-wrap:anywhere}
.arch.car{border-left:4px solid var(--az)}
.migas{display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin:4px 0 10px;font-size:.8rem}.migas i{color:var(--gr);font-style:normal}.mig{border:0;background:#E8F0FB;color:var(--azo);border-radius:8px;padding:5px 8px;font:inherit;font-size:.78rem;text-decoration:none}
.nav button{min-width:0;font-size:.66rem}

.snip{color:var(--tx)!important;font-size:.74rem!important}

#bsalto{display:block;margin:0 0 10px;font-weight:700}#bsalto[hidden]{display:none}

.arch.car .meta{margin-top:3px}
.nav .on{color:var(--az)}
