:root{--bg:var(--tg-theme-bg-color,#fff);--sec:var(--tg-theme-secondary-bg-color,#f2f2f7);--tx:var(--tg-theme-text-color,#111);--hint:var(--tg-theme-hint-color,#8a8a8e);
--ac:var(--tg-theme-button-color,#2f80ed);--act:var(--tg-theme-button-text-color,#fff);--dg:var(--tg-theme-destructive-text-color,#e5484d);--ok:#2fb573;
--line:color-mix(in srgb,var(--hint) 24%,transparent)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none;background:var(--sec);color:var(--tx);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;font-size:16px;line-height:1.4}
#app{height:100%;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:14px 14px calc(96px + env(safe-area-inset-bottom))}
.v{animation:in .25s ease both}@keyframes in{from{opacity:0;transform:translateY(8px)}}
.card{background:var(--bg);border-radius:18px;padding:16px;margin-bottom:12px}
.tt{font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--hint);margin:20px 6px 8px}
.row{display:flex;align-items:center;gap:12px}.g{flex:1;min-width:0}.h{color:var(--hint);font-size:13px}.b{font-weight:700}
.item{background:var(--bg);border-radius:18px;padding:14px;margin-bottom:10px;display:flex;align-items:center;gap:12px;transition:transform .12s}.item:active{transform:scale(.98)}
.ico{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;flex:none;color:var(--c,var(--ac));background:color-mix(in srgb,var(--c,var(--ac)) 14%,transparent)}
.ell{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.av{width:46px;height:46px;border-radius:50%;flex:none;object-fit:cover;display:grid;place-items:center;font-weight:700;font-size:18px;color:#fff;background:linear-gradient(135deg,var(--ac),color-mix(in srgb,var(--ac) 55%,#7c3aed))}
.pill{display:inline-flex;align-items:center;padding:3px 10px;border-radius:99px;font-size:12px;font-weight:600;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}
.hero{display:flex;align-items:center;gap:12px;margin:4px 4px 16px}.logo{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--ac),color-mix(in srgb,var(--ac) 50%,#7c3aed))}
.hero h1{margin:0;font-size:22px;letter-spacing:-.02em}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:6px}.stat{background:var(--bg);border-radius:18px;padding:14px}.stat b{display:block;font-size:26px;letter-spacing:-.02em}
.seal{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;margin-bottom:12px;font-size:13px;font-weight:600;color:var(--ok);background:linear-gradient(135deg,color-mix(in srgb,var(--ok) 16%,transparent),color-mix(in srgb,var(--ac) 10%,transparent))}
.big{font-size:36px;font-weight:800;letter-spacing:-.03em;margin:6px 0 2px}
.kv{display:flex;justify-content:space-between;padding:8px 0;border-top:1px solid var(--line);font-size:14px}.kv span:first-child{color:var(--hint)}
.steps{display:flex;gap:4px;margin:14px 0 4px}.steps i{flex:1;height:6px;border-radius:9px;background:var(--line)}.steps i.on{background:var(--ac)}.steps i.cur{animation:pl 1.4s infinite}@keyframes pl{50%{opacity:.45}}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px;margin-top:10px;border:0;border-radius:14px;font-family:inherit;font-size:16px;font-weight:600;background:var(--ac);color:var(--act);transition:transform .1s}
.btn:active{transform:scale(.97)}.btn:disabled{opacity:.4}.soft{background:color-mix(in srgb,var(--ac) 13%,transparent);color:var(--ac)}.ok{background:var(--ok);color:#fff}.dg{background:color-mix(in srgb,var(--dg) 13%,transparent);color:var(--dg)}
.sm{width:auto;padding:9px 14px;margin:0;font-size:14px;border-radius:12px}
.lb{display:block;font-size:13px;font-weight:600;color:var(--hint);margin:14px 4px 6px}
.in{width:100%;padding:13px 14px;border-radius:13px;border:1.5px solid var(--line);background:var(--bg);color:var(--tx);font:inherit;outline:0;transition:border-color .15s}.in:focus{border-color:var(--ac)}
select.in{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238a8a8e' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.seg{display:flex;background:var(--sec);border-radius:12px;padding:3px}.seg button{flex:1;border:0;padding:10px;border-radius:10px;background:none;color:var(--hint);font-weight:600;font-size:14px;font-family:inherit;}.seg button.on{background:var(--bg);color:var(--tx);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.alertc{display:flex;gap:12px;background:var(--dg);color:#fff;border-radius:16px;padding:14px;margin-bottom:10px;font-weight:600;font-size:14px;animation:sk .5s 2}@keyframes sk{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.chip{display:inline-block;font-size:11px;font-weight:600;padding:2px 8px;border-radius:8px;background:var(--sec);color:var(--hint);margin-right:4px}
.chat{display:flex;flex-direction:column;gap:6px;max-height:320px;overflow-y:auto;padding:2px}.bub{max-width:84%;padding:9px 13px;border-radius:18px 18px 18px 5px;background:var(--sec);word-break:break-word;white-space:pre-wrap;font-size:15px}
.bub.me{align-self:flex-end;background:var(--ac);color:var(--act);border-radius:18px 18px 5px 18px}.bub small{display:block;opacity:.65;font-size:11px;margin-bottom:1px}
.sysm{align-self:center;text-align:center;font-size:12px;color:var(--hint);padding:2px 8px}.sysm.warn{background:var(--dg);color:#fff;border-radius:12px;padding:10px 12px;font-weight:600;font-size:13px}
.empty{text-align:center;color:var(--hint);padding:34px 10px}.empty svg{opacity:.5;margin-bottom:8px}
.sk{height:68px;border-radius:18px;margin-bottom:10px;background:linear-gradient(90deg,var(--line),transparent 50%,var(--line));background-size:200% 100%;animation:sh 1.2s infinite}@keyframes sh{to{background-position:-200% 0}}
#toast{position:fixed;top:12px;left:50%;transform:translate(-50%,-80px);background:var(--tx);color:var(--bg);padding:10px 18px;border-radius:99px;font-size:14px;font-weight:600;transition:transform .3s;z-index:9}#toast.on{transform:translate(-50%,0)}
code{font-size:13px;word-break:break-all;background:var(--sec);padding:2px 6px;border-radius:6px}
/* metricas, graficas, descanso */
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}.kpis .stat{padding:12px}.kpis .stat b{font-size:19px}
.bars{display:flex;align-items:flex-end;gap:4px;height:90px}.bc{flex:1;height:100%;display:flex;align-items:flex-end;gap:1px}.bc i{flex:1;background:var(--ac);border-radius:3px 3px 0 0;min-height:2px}.bc i.dn{background:var(--ok)}
.lg{display:inline-block;width:8px;height:8px;border-radius:2px;background:var(--ac)}.lg.dn{background:var(--ok)}
.dr{display:flex;align-items:center;gap:8px;font-size:13px;margin:4px 0}.dr span{width:26px;color:var(--hint)}.dbar{flex:1;height:8px;border-radius:4px;background:var(--sec);overflow:hidden}.dbar i{display:block;height:100%;background:#f5a524}.dr b{width:26px;text-align:right}
.cmt{padding:8px 0;border-top:1px solid var(--line);font-size:14px}.btn.sm.fit{width:auto;margin:0;padding:10px 14px}
