:root{--bg:#f3efe6;--sf:#fffdf8;--ink:#1b2a2c;--mu:#667679;--ac:#0b7a75;--ac2:#0f9d96;--acink:#fff;--ln:#ded8ca;--me:#dff1ee;--er:#b3392e;--sh:0 1px 2px rgba(20,40,40,.08),0 8px 24px rgba(20,40,40,.07)}
@media(prefers-color-scheme:dark){:root{--bg:#0d1f22;--sf:#142a2e;--ink:#e8f1ef;--mu:#8fa6a7;--ac:#2cc4b8;--ac2:#4fd9ce;--acink:#04201e;--ln:#244045;--me:#17383a;--er:#ff8a7a;--sh:0 1px 2px rgba(0,0,0,.3)}}
*{box-sizing:border-box;margin:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden;overscroll-behavior:none}
body{background:var(--bg);color:var(--ink);font:16px/1.5 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,sans-serif;-webkit-text-size-adjust:100%;touch-action:manipulation}
[hidden]{display:none!important}
svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#app{display:flex;flex-direction:column;position:relative}
.bar{display:flex;align-items:center;gap:8px;padding:calc(env(safe-area-inset-top) + 8px) 12px 8px;border-bottom:1px solid var(--ln);background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:3}
.tt{flex:1;display:flex;flex-direction:column;align-items:center;line-height:1.1}.tt b{font-size:17px;letter-spacing:-.01em}.tt span{font-size:12px;color:var(--mu)}
.ib{width:44px;height:44px;border:0;border-radius:12px;background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer}.ib:active{background:var(--me)}
#msgs{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:14px 14px 8px;scroll-behavior:smooth}
#vacio{text-align:center;padding:6vh 6px 0}
.logo{width:76px;height:76px;margin:0 auto 14px;border-radius:22px;background:linear-gradient(145deg,var(--ac2),var(--ac));display:grid;place-items:center;box-shadow:var(--sh)}
.logo svg{width:46px;height:46px;stroke:none;fill:var(--acink);opacity:.95}.logo .pulso{fill:none;stroke:var(--ac);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round}
#vacio h1{font-size:25px;letter-spacing:-.02em;margin-bottom:6px}#vacio p{color:var(--mu);max-width:34ch;margin:0 auto 18px;font-size:15px}
.sugs{display:grid;gap:9px;text-align:left;max-width:420px;margin:0 auto}
.sug{border:1px solid var(--ln);background:var(--sf);border-radius:16px;padding:12px 14px;font:inherit;color:var(--ink);text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:2px;box-shadow:var(--sh)}.sug b{font-size:15px}.sug span{font-size:13px;color:var(--mu)}.sug:active{transform:scale(.99);background:var(--me)}
.m{display:flex;margin:10px 0}.m.u{justify-content:flex-end}
.bub{max-width:88%;border-radius:20px;padding:10px 14px;word-wrap:break-word;overflow-wrap:anywhere}
.u .bub{background:var(--ac);color:var(--acink);border-bottom-right-radius:6px;white-space:pre-wrap}
.a .bub{background:var(--sf);border:1px solid var(--ln);border-bottom-left-radius:6px;box-shadow:var(--sh);max-width:96%}
.bub img.f{display:block;max-width:100%;max-height:220px;border-radius:12px;margin-bottom:6px}
.bub>*:first-child{margin-top:0}.bub>*:last-child{margin-bottom:0}
.bub h2,.bub h3,.bub h4{font-size:16px;margin:12px 0 4px;letter-spacing:-.01em}.bub h2{font-size:17px;color:var(--ac)}
.bub p{margin:6px 0}.bub ul,.bub ol{margin:6px 0;padding-left:22px}.bub li{margin:2px 0}
.bub code{font:.88em ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--me);padding:1px 5px;border-radius:6px}
.bub pre{background:var(--me);padding:10px;border-radius:12px;overflow-x:auto;margin:8px 0}.bub pre code{background:none;padding:0}
.bub blockquote{border-left:3px solid var(--ac);padding:2px 0 2px 10px;color:var(--mu);margin:8px 0}
.bub .tw{overflow-x:auto;margin:8px 0;-webkit-overflow-scrolling:touch}.bub table{border-collapse:collapse;font-size:14px;min-width:100%}.bub th,.bub td{border:1px solid var(--ln);padding:5px 8px;text-align:left;vertical-align:top;overflow-wrap:normal;word-break:normal;hyphens:manual;min-width:9ch}.bub th{background:var(--me)}
.acc{display:flex;gap:6px;margin:4px 4px 0}.acc button{border:0;background:transparent;color:var(--mu);font:inherit;font-size:13px;padding:6px 8px;border-radius:10px;cursor:pointer}.acc button:active{background:var(--me)}
.pens{display:flex;gap:5px;padding:6px 4px}.pens i{width:8px;height:8px;border-radius:50%;background:var(--mu);animation:p 1.1s infinite ease-in-out}.pens i:nth-child(2){animation-delay:.15s}.pens i:nth-child(3){animation-delay:.3s}
@keyframes p{0%,80%,100%{opacity:.25;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}
.errm{background:color-mix(in srgb,var(--er) 12%,var(--sf));border:1px solid var(--er);color:var(--ink);border-radius:16px;padding:10px 14px;font-size:14px}.errm button{margin-top:6px;border:1px solid var(--er);background:transparent;color:var(--er);border-radius:10px;padding:5px 10px;font:inherit;font-size:13px}
.comp{padding:6px 12px calc(env(safe-area-inset-bottom) + 6px);border-top:1px solid var(--ln);background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.modos{display:flex;gap:6px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:none}.modos::-webkit-scrollbar{display:none}
.modo{flex:none;border:1px solid var(--ln);background:var(--sf);color:var(--ink);border-radius:99px;padding:6px 13px;font:inherit;font-size:14px;cursor:pointer}.modo[aria-selected=true]{background:var(--ac);border-color:var(--ac);color:var(--acink);font-weight:600}
.adj{position:relative;display:inline-block;margin:0 0 8px 4px}.adj img{height:64px;border-radius:12px;border:1px solid var(--ln);display:block}.adj button{position:absolute;top:-8px;right:-8px;width:24px;height:24px;border-radius:50%;border:0;background:var(--ink);color:var(--bg);font-size:16px;line-height:1}
#form{display:flex;align-items:flex-end;gap:4px;background:var(--sf);border:1px solid var(--ln);border-radius:26px;padding:3px 5px 3px 3px;box-shadow:var(--sh)}
#txt{flex:1;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:16px;resize:none;max-height:140px;padding:11px 4px;line-height:1.35}
.env{width:40px;height:40px;margin:2px;border:0;border-radius:50%;background:var(--ac);color:var(--acink);display:grid;place-items:center;flex:none;cursor:pointer}.env:disabled{opacity:.4}.env svg{stroke-width:2.6}
.pie{font-size:11px;color:var(--mu);text-align:center;margin-top:5px;line-height:1.3}
#shell{display:flex;height:100dvh;height:var(--vh,100dvh);max-width:1180px;margin:0 auto}
#app{flex:1;min-width:0;height:100%;max-width:820px;margin:0 auto}
#cajon{position:fixed;top:0;bottom:0;left:0;width:min(88vw,350px);background:var(--sf);border-right:1px solid var(--ln);transform:translateX(-102%);transition:transform .28s cubic-bezier(.2,.8,.2,1);z-index:10;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top);box-shadow:var(--sh)}
#cajon.on{transform:none}.cj-h{display:flex;justify-content:space-between;align-items:center;padding:10px 8px 4px 16px;font-size:18px}
.cj-s{flex:1;overflow-y:auto;padding:4px 12px 12px;-webkit-overflow-scrolling:touch}
.cj-s h3{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mu);margin:16px 4px 6px;display:flex;justify-content:space-between}
.nota{font-size:12.5px;color:var(--mu);margin:0 4px 8px;line-height:1.4}.mini{font-weight:400;text-transform:none;letter-spacing:0}
.pri-b,.sec-b{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;font:inherit;font-weight:600;padding:11px;cursor:pointer;margin-top:4px}
.pri-b{border:0;background:var(--ac);color:var(--acink)}.pri-b svg{width:18px;height:18px;stroke-width:2.6}
.sec-b{border:1px dashed var(--ac);background:transparent;color:var(--ac);margin-top:8px}
#lista{display:flex;flex-direction:column;gap:2px}.it{display:flex;align-items:center;gap:4px;border-radius:12px}.it.on{background:var(--me)}.it button.t{flex:1;text-align:left;border:0;background:none;color:var(--ink);font:inherit;padding:10px;cursor:pointer;min-width:0}.it .t b{display:block;font-weight:600;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.it .t span{font-size:12px;color:var(--mu)}.it .x{border:0;background:none;color:var(--mu);width:38px;height:38px;font-size:20px;border-radius:10px;cursor:pointer}
.doc{display:flex;align-items:center;gap:8px;padding:8px 6px;border-radius:12px}.doc input{width:20px;height:20px;accent-color:var(--ac);flex:none}.doc .d{flex:1;min-width:0}.doc .d b{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.doc .d span{font-size:12px;color:var(--mu)}.doc .x{border:0;background:none;color:var(--mu);width:34px;height:34px;font-size:18px;border-radius:10px;cursor:pointer}
#perfil{width:100%;font:inherit;font-size:15px;padding:10px;border-radius:12px;border:1px solid var(--ln);background:var(--bg);color:var(--ink);resize:vertical}
.cj-f{padding:10px 14px calc(env(safe-area-inset-bottom) + 10px);border-top:1px solid var(--ln);display:flex;align-items:center;justify-content:space-between;gap:8px}.cj-f button{border:0;background:none;color:var(--mu);font:inherit;font-size:13px;text-decoration:underline;cursor:pointer}
.yo{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px}.yo img{width:30px;height:30px;border-radius:50%}.yo span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#vel{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:9}
.estado{font-size:13px;color:var(--ac);background:var(--me);border-radius:12px;padding:6px 12px;margin:0 0 8px;display:flex;align-items:center;gap:8px}.estado.mal{color:var(--er);background:color-mix(in srgb,var(--er) 12%,var(--sf))}
.estado .sp{width:14px;height:14px;border:2px solid var(--ac);border-top-color:transparent;border-radius:50%;animation:g .8s linear infinite;flex:none}@keyframes g{to{transform:rotate(360deg)}}
.fuentes{font-size:12px;color:var(--mu);margin:6px 4px 0}
dialog{border:1px solid var(--ln);background:var(--sf);color:var(--ink);border-radius:22px;padding:24px;width:min(90vw,380px);margin:auto;box-shadow:var(--sh);text-align:center}dialog::backdrop{background:rgba(0,0,0,.55)}
dialog h2{font-size:21px;margin-bottom:6px}dialog p{color:var(--mu);font-size:14px;margin-bottom:14px}#gbtn{display:flex;justify-content:center;min-height:44px;margin-bottom:6px}
dialog input{width:100%;font:inherit;font-size:16px;padding:12px;border-radius:12px;border:1px solid var(--ln);background:var(--bg);color:var(--ink);margin-bottom:10px}
.pri{width:100%;border:0;border-radius:12px;background:var(--ac);color:var(--acink);font:inherit;font-weight:600;padding:12px;cursor:pointer}.err{color:var(--er)!important}
@media(min-width:900px){
  #app{max-width:none;margin:0}
  #cajon{position:static;transform:none;width:320px;flex:none;box-shadow:none;padding-top:0;height:100%}
  .solo-movil,#vel{display:none!important}
  .bar{padding-top:10px}.tt{align-items:flex-start;margin-left:6px}
  #app{border-right:1px solid var(--ln)}
  #msgs{padding:18px 28px 8px}.comp{padding:8px 24px 14px}
  .bub{max-width:80%}.a .bub{max-width:90%}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.cj-s details{margin:0}.cj-s summary{list-style:none;cursor:pointer;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mu);margin:16px 4px 6px;display:flex;justify-content:space-between;align-items:center;font-weight:600}.cj-s summary::-webkit-details-marker{display:none}.cj-s summary::after{content:'▾';font-size:13px;transition:transform .15s}.cj-s details:not([open]) summary::after{transform:rotate(-90deg)}

#recorrido{display:flex;flex-direction:column;gap:6px;margin:0 0 6px}.rec{border-left:3px solid var(--ac,#0f766e);padding:2px 0 2px 9px;font-size:12.5px;line-height:1.35}.rec b{display:block;font-size:13px}.rec span{color:var(--mu)}.rec i{display:block;color:var(--mu);font-style:normal}
