:root{--azul: #1B5FAF;--azul-oscuro: #144a8a;--oscuro: #1a1a1a;--gris: #6b7280;--fondo: #f3f5f9;--blanco: #ffffff;--verde: #16a34a;--naranja: #ea580c;--rojo: #dc2626;--borde: #e2e8f0}*{box-sizing:border-box;margin:0;padding:0}html,body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--fondo);color:var(--oscuro);-webkit-tap-highlight-color:transparent}#root{min-height:100dvh}.app{min-height:100dvh;display:flex;flex-direction:column;max-width:640px;margin:0 auto;background:var(--fondo)}.topbar{position:sticky;top:0;z-index:10;background:var(--azul);color:#fff;padding:14px 16px;padding-top:calc(14px + env(safe-area-inset-top));display:flex;align-items:center;gap:10px}.topbar img{height:32px}.topbar h1{font-size:18px;font-weight:700;flex:1}.topbar button{background:#ffffff26;border:none;color:#fff;border-radius:8px;padding:8px 12px;font-size:13px}.content{flex:1;padding:16px;padding-bottom:calc(84px + env(safe-area-inset-bottom))}.bottomnav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:640px;background:var(--blanco);border-top:1px solid var(--borde);display:flex;padding-bottom:env(safe-area-inset-bottom);z-index:10}.bottomnav button{flex:1;background:none;border:none;padding:10px 4px 12px;font-size:11px;color:var(--gris);display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer}.bottomnav button .icon{font-size:22px;line-height:1}.bottomnav button.active{color:var(--azul);font-weight:700}.card{background:var(--blanco);border-radius:14px;padding:14px 16px;margin-bottom:10px;border:1px solid var(--borde);box-shadow:0 1px 2px #0000000a}.card h3{font-size:16px;margin-bottom:2px}.card .sub{color:var(--gris);font-size:13px}.card .row{display:flex;justify-content:space-between;align-items:center;gap:8px}.badge{display:inline-block;font-size:11px;font-weight:700;padding:4px 10px;border-radius:99px;white-space:nowrap}.badge.verde{background:#dcfce7;color:var(--verde)}.badge.azul{background:#dbeafe;color:var(--azul)}.badge.naranja{background:#ffedd5;color:var(--naranja)}.badge.rojo{background:#fee2e2;color:var(--rojo)}.badge.gris{background:#f1f5f9;color:var(--gris)}.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}.kpi{background:var(--blanco);border-radius:14px;padding:14px;border:1px solid var(--borde)}.kpi .valor{font-size:24px;font-weight:800;color:var(--azul)}.kpi .etiqueta{font-size:12px;color:var(--gris);margin-top:2px}.form label{display:block;font-size:13px;font-weight:600;color:var(--gris);margin:12px 0 4px}.form input,.form select,.form textarea{width:100%;padding:12px;font-size:16px;border:1px solid var(--borde);border-radius:10px;background:var(--blanco)}.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--azul);border-color:transparent}.btn{display:block;width:100%;padding:14px;font-size:16px;font-weight:700;border:none;border-radius:12px;background:var(--azul);color:#fff;margin-top:16px;cursor:pointer}.btn:active{background:var(--azul-oscuro)}.btn.secundario{background:#eef2f7;color:var(--azul)}.btn.peligro{background:#fee2e2;color:var(--rojo)}.fab{position:fixed;bottom:calc(76px + env(safe-area-inset-bottom));right:max(16px,calc(50% - 304px));width:56px;height:56px;border-radius:50%;background:var(--azul);color:#fff;font-size:28px;border:none;box-shadow:0 4px 12px #1b5faf66;z-index:10;cursor:pointer}.login{min-height:100dvh;display:flex;flex-direction:column;justify-content:center;padding:24px;max-width:420px;margin:0 auto}.login img{width:160px;margin:0 auto 24px}.login h2{text-align:center;margin-bottom:8px}.login .sub{text-align:center;color:var(--gris);font-size:14px;margin-bottom:16px}.error{background:#fee2e2;color:var(--rojo);padding:10px 14px;border-radius:10px;font-size:14px;margin-top:12px}.aviso{background:#fef9c3;color:#854d0e;padding:12px 14px;border-radius:10px;font-size:14px;line-height:1.5}.buscador{width:100%;padding:12px 14px;font-size:16px;border:1px solid var(--borde);border-radius:12px;margin-bottom:12px;background:var(--blanco)}.vacio{text-align:center;color:var(--gris);padding:40px 20px;font-size:14px}.modal-fondo{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;z-index:20;display:flex;align-items:flex-end;justify-content:center}.modal{background:var(--fondo);width:100%;max-width:640px;max-height:92dvh;overflow-y:auto;border-radius:20px 20px 0 0;padding:20px 16px calc(20px + env(safe-area-inset-bottom))}.modal .cabecera{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.modal .cabecera h2{font-size:18px}.modal .cerrar{background:none;border:none;font-size:26px;color:var(--gris);cursor:pointer}@media (min-width: 900px){.app{max-width:none;margin:0;padding-left:220px}.topbar{padding-left:24px;padding-right:24px}.content{max-width:1120px;width:100%;margin:0 auto;padding:24px 28px 48px}.bottomnav{top:0;bottom:0;left:0;transform:none;width:220px;max-width:220px;height:100dvh;flex-direction:column;justify-content:flex-start;gap:4px;border-top:none;border-right:1px solid var(--borde);padding:18px 10px}.bottomnav button{flex:none;flex-direction:row;justify-content:flex-start;gap:12px;padding:12px 16px;font-size:14px;border-radius:10px}.bottomnav button .icon{font-size:20px}.bottomnav button.active{background:#eef2f7}.fab{right:32px;bottom:32px}.modal-fondo{align-items:center}.modal{max-width:580px;max-height:88dvh;border-radius:18px;padding:24px}.kpis{grid-template-columns:repeat(4,1fr)}.card{transition:box-shadow .15s ease}}