:root{--bg:#0a0f16;--panel:#111925;--panel2:#0d141e;--tx:#e6edf5;--mut:#8697aa;--acc:#2fd0ff;--acc2:#ff8a4c;--ok:#3fd69a;--warn:#e0b030;--hot:#ff7a3a;--bad:#ff4d4d;--line:#1d2a3a}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.45 system-ui,Segoe UI,Roboto,sans-serif}
.hidden{display:none!important}
a{color:inherit;text-decoration:none}
.card{max-width:380px;margin:12vh auto;padding:24px 20px;background:var(--panel);border:1px solid var(--line);border-radius:14px}
h1{font-size:1.2rem;margin:0 0 14px}
label{display:block;margin:12px 0 0;color:var(--mut);font-size:.9rem}
input,select{width:100%;margin-top:4px;padding:11px;background:#0a1018;color:var(--tx);border:1px solid var(--line);border-radius:8px;font-size:1rem}
button{margin-top:14px;padding:11px 16px;border:0;border-radius:8px;background:#1e6fd6;color:#fff;font-size:.95rem;cursor:pointer;min-height:42px}
button:disabled{opacity:.4;cursor:default}
button.ghost{background:transparent;border:1px solid var(--line);color:var(--mut);margin:0}
button.icon{background:transparent;border:1px solid var(--line);color:var(--acc);margin:0;min-width:42px;padding:6px 10px}
.err{color:var(--bad);min-height:1.2em;margin:10px 0 0}

#shell{display:grid;height:100dvh;grid-template-columns:210px 1fr 310px;grid-template-rows:54px 1fr 32px;grid-template-areas:"top top top" "side center right" "status status status"}
#top{grid-area:top;display:flex;align-items:center;gap:12px;padding:0 14px;border-bottom:1px solid var(--line);background:linear-gradient(90deg,#0c1a2b,#0a0f16)}
#top .icon{display:none}
.brand{display:flex;flex-direction:column;line-height:1.1}
.brand b{letter-spacing:.12em;font-size:.95rem}
.brand span{color:var(--acc);font-size:.75rem}
#clock{margin-left:auto;color:var(--mut);font-size:.85rem}
#who{color:var(--mut);font-size:.85rem}
#side{grid-area:side;padding:12px 8px;border-right:1px solid var(--line);background:var(--panel2);overflow:auto}
.nav{display:block;padding:10px 12px;border-radius:8px;color:var(--tx);cursor:pointer;margin-bottom:2px}
.nav:hover{background:#142234}
.nav.on{background:#12304d;color:#fff;box-shadow:inset 2px 0 var(--acc)}
.grp{margin:16px 12px 6px;color:var(--mut);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
#projects .nav{color:var(--acc)}
#center{grid-area:center;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}
#viewHome{padding:14px;overflow:auto}
.vt{margin:0 0 10px;font-size:1.1rem}
#viewTerm{display:flex;flex-direction:column;flex:1;min-height:0}
#bar{display:flex;gap:8px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--line);flex-wrap:wrap}
#bar select,#bar input{margin:0;width:auto;min-height:40px}
#bar input{flex:1;min-width:110px}
#bar button{margin:0;min-height:40px}
#state{color:var(--mut);font-size:.82rem;margin-left:auto}
#chips{display:flex;gap:0;padding:0 10px;overflow-x:auto;border-bottom:1px solid var(--line);background:var(--panel2)}
.chip{white-space:nowrap;padding:9px 14px;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:var(--mut);margin:0;min-height:38px}
.chip.on{color:var(--tx);border-bottom-color:var(--acc);background:#0f1b2a}
#term{flex:1;min-height:0;padding:4px;background:#000}
#keys{display:flex;gap:6px;padding:6px;overflow-x:auto;border-top:1px solid var(--line);background:var(--panel)}
#keys button{margin:0;min-width:46px;min-height:44px;padding:8px 10px;background:#192434;border:1px solid var(--line);color:var(--tx)}
#keys button.on{background:var(--acc);color:#04202c}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.acct{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px}
.acct h2{margin:0 0 6px;font-size:1rem}
.row{margin:10px 0 0}
.row .lab{display:flex;justify-content:space-between;gap:8px;color:var(--mut);font-size:.82rem}
.bar{height:8px;background:#0a1018;border-radius:6px;overflow:hidden;margin-top:5px}
.bar i{display:block;height:100%}
.note{color:var(--mut);font-size:.8rem;margin:8px 0 0}
.stale{color:var(--warn)}
#right{grid-area:right;border-left:1px solid var(--line);background:var(--panel2);padding:10px;overflow:auto}
.rt{color:var(--mut);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;margin:6px 4px 8px}
#racc .acct{margin-bottom:10px;padding:10px}
.act{display:block;width:100%;margin:8px 0 0;background:#12304d;border:1px solid #1f4f7c}
#status{grid-area:status;display:flex;align-items:center;padding:0 14px;border-top:1px solid var(--line);background:var(--panel2);color:var(--mut);font-size:.78rem;overflow:hidden;white-space:nowrap}
#stepup{position:fixed;inset:0;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;z-index:9}
#stepup form{background:var(--panel);padding:20px;border-radius:12px;max-width:340px;border:1px solid var(--line)}

@media (max-width:900px){
  #shell{grid-template-columns:1fr;grid-template-rows:54px 1fr 28px;grid-template-areas:"top" "center" "status"}
  #top .icon{display:inline-block}
  #who{display:none}
  #side,#right{position:fixed;top:54px;bottom:28px;z-index:6;width:min(300px,86vw);transform:translateX(-105%);transition:transform .2s}
  #right{right:0;left:auto;transform:translateX(105%)}
  #side.open{transform:none}
  #right.open{transform:none}
}

#imgbox select,#imgbox textarea{width:100%;margin:0 0 6px;padding:10px;background:#0a1018;color:var(--tx);border:1px solid var(--line);border-radius:8px;font:inherit;resize:vertical}
#gallery{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.thumb{margin:0;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:6px}
.thumb img{width:100%;aspect-ratio:1;object-fit:contain;background:repeating-conic-gradient(#1b2635 0 25%,#141d2a 0 50%) 0 0/14px 14px;border-radius:6px;cursor:zoom-in}
.thumb figcaption{font-size:.7rem;color:var(--mut);margin-top:4px;word-break:break-all}
button.mini{margin:4px 0 0;min-height:30px;padding:4px 8px;font-size:.75rem;background:#192434;border:1px solid var(--line)}
#lightbox{position:fixed;inset:0;background:rgba(0,0,0,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;cursor:zoom-out}
#lightbox img{max-width:92vw;max-height:80vh;background:repeating-conic-gradient(#1b2635 0 25%,#141d2a 0 50%) 0 0/20px 20px}
#lbcap{color:var(--mut)}

#alertbar{display:flex;gap:10px;align-items:center;padding:8px 14px;font-size:.88rem;border-bottom:1px solid var(--line)}
#alertbar.warn{background:#3a2d0a;color:#ffd36b}
#alertbar.bad{background:#3b1010;color:#ff9a9a}
#alertbar button{margin:0 0 0 auto}
#hoTo{margin:8px 0 0}

/* Consola: tokens y superficies compartidas. */
:root{color-scheme:dark;--bg:#030912;--panel:#0b1727;--panel2:#06101d;--tx:#e1edf8;--mut:#a0b5ca;--acc:#39d4ff;--acc2:#80baff;--ok:#44e2bc;--warn:#ffd078;--hot:#ffd078;--bad:#ff949e;--line:#25435e;--mono:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;--radius:10px;--glow:0 0 22px #00b8ff0d}
body{background:radial-gradient(ellipse at 45% 0,#10263c 0,transparent 65%),var(--bg);font-size:14px}
button,input,select,textarea{font:inherit;min-height:44px}
button{margin-top:12px;background:linear-gradient(135deg,#086080,#114677);border:1px solid #3684aa;border-radius:6px;font-weight:600;transition:background .15s,border-color .15s}
button:hover:not(:disabled){background:#155578;border-color:var(--acc)}
button:disabled{opacity:1;background:#101b2a;border-color:#314052;color:#94a5b8;cursor:not-allowed}
input,select,textarea{border-radius:6px;background:#040c17;border-color:var(--line)}
input::placeholder,textarea::placeholder{color:#91a7bd;opacity:1}
:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--acc);outline-offset:3px}
button.icon,button.mini{min-height:44px;min-width:44px}
button.ghost{color:var(--tx)}
#shell{grid-template-columns:200px minmax(0,1fr) 320px;grid-template-rows:68px minmax(0,1fr) 36px;gap:0}
#top{padding:0 20px;gap:16px;background:linear-gradient(100deg,#0b1d31,#040b15 70%);border-bottom-color:#286286;box-shadow:0 2px 24px #00b8ff09;z-index:7}
.brand{gap:5px;min-width:0}
.brand b{font-size:13px;letter-spacing:.14em;color:#e6f5ff}
.brand span{font:11px var(--mono);color:var(--mut)}
.brand::before{content:'⌘';position:absolute;left:22px;color:var(--acc);font:30px var(--mono);text-shadow:0 0 18px #39d4ff60}
.brand{padding-left:44px}
#clock{font:13px var(--mono);color:var(--acc)}
#who{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#side{padding:20px 10px;background:linear-gradient(180deg,#081525,#040b14);border-right-color:var(--line)}
.nav{display:flex;align-items:center;gap:10px;min-height:46px;padding:10px 12px;border:1px solid transparent;border-radius:6px;font-size:13px;overflow-wrap:anywhere}
.nav:hover{background:#0d2238;border-color:#234760}
.nav.on{background:linear-gradient(90deg,#0b3653,#0a2136);border-color:#1c5173;color:var(--acc);box-shadow:inset 2px 0 var(--acc),var(--glow)}
.nav-icon{font:20px var(--mono);width:24px;text-align:center;color:var(--acc);flex-shrink:0}
.grp{display:flex;align-items:center;gap:8px;margin:28px 12px 10px;font:10px var(--mono);letter-spacing:.12em}
.grp::after{content:'';height:1px;flex:1;background:var(--line)}
#projects .nav{color:#b6d6ef;font-family:var(--mono);font-size:12px}
#logoutall{font-size:12px;color:var(--mut)}
#center{margin:12px;border:1px solid var(--line);border-radius:var(--radius);background:#040c17;box-shadow:var(--glow)}
#viewHome{padding:24px}
.eyebrow{color:var(--acc);font:11px var(--mono);letter-spacing:.12em;margin:0 0 8px;text-transform:uppercase}
.vt{font-size:24px;letter-spacing:-.03em;margin:0 0 8px;font-weight:600}
.intro{margin:0 0 24px;color:var(--mut);max-width:60ch;line-height:1.7}
.grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.acct{padding:20px;background:linear-gradient(135deg,#0d2135,#081320);border-radius:8px;border-color:#284c68;box-shadow:0 8px 24px #0002}
.acct h2{display:flex;align-items:baseline;gap:8px;font-size:14px;line-height:1.6;padding-bottom:12px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.acct h2::before{content:'◇';color:var(--acc);font-size:18px}
.row{margin-top:18px}
.row .lab{flex-wrap:wrap;align-items:baseline;font-size:12px;gap:4px 12px}
.lab>span:first-child{color:var(--tx)}
.lab>span:last-child{font:11px/1.6 var(--mono);overflow-wrap:anywhere}
.bar{height:6px;margin-top:9px;background:#020914;border:1px solid #294054;border-radius:3px}
.bar i{box-shadow:0 0 10px currentColor;border-radius:2px}
.note{font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.acct>.note{font:11px/1.7 var(--mono);margin-top:12px}
#bar{padding:12px;background:#091726;gap:8px}
#bar select{max-width:180px}
#bar input{width:120px}
#state{font:11px/1.5 var(--mono);overflow-wrap:anywhere}
#chips{padding:0 8px;background:#06101d;min-height:48px;flex-shrink:0;scrollbar-width:thin}
#chips:empty::before{content:'›_  Abre un proyecto para comenzar';color:var(--mut);font:12px var(--mono);align-self:center;padding:0 8px}
.chip{min-height:48px;font:12px var(--mono);padding:12px 16px}
.chip.on{color:var(--acc);background:linear-gradient(#10314a,#0a1929);border-bottom-color:var(--acc)}
#term{background:#030912;padding:10px;overflow:hidden}
#keys{padding:8px;flex-shrink:0;background:#081523;scrollbar-width:thin;overscroll-behavior-x:contain}
#keys:empty{display:none}
#keys button{flex-shrink:0;font:12px var(--mono);background:#0d2337;border-color:#2d506a;border-radius:5px}
#keys button.on{background:var(--acc);color:#03121e;border-color:var(--acc)}
#right{margin:12px 12px 12px 0;padding:16px;background:linear-gradient(160deg,#0a192a,#050d18);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--glow)}
.rt{display:flex;align-items:center;gap:8px;color:var(--acc);font:11px var(--mono);letter-spacing:.1em;margin:24px 0 12px}
.rt:first-child{margin-top:2px}
.rt::before{content:'◆';font-size:8px}
#racc .acct{padding:12px;margin-bottom:10px;box-shadow:none}
#racc .acct h2{font-size:12px;padding-bottom:8px;margin-bottom:0}
#racc .row{margin-top:12px}
#racc .lab{font-size:11px}
#racc .acct>.note{margin-top:8px}
#actions,#imgbox{padding-top:12px;border-top:1px solid var(--line)}
#curlabel{margin:0 0 12px;color:var(--tx)}
.act{background:#0b2840;border-color:#2c5b7d;font-size:12px;text-align:left;padding:12px}
#bImg{color:var(--acc);border-color:#297698;text-align:center}
#imgbox textarea{min-height:100px;font-size:12px;line-height:1.7}
#imgbox select{font-size:12px}
#gallery .note{grid-column:1/-1}
.thumb{min-width:0;padding:6px;background:#081727}
.thumb figcaption{word-break:break-word}
.thumb .mini{width:100%;font-size:11px;padding:6px}
#status{gap:10px;padding:0 20px;font:11px var(--mono);background:#050e19;border-top-color:#27506c;overflow-x:auto;scrollbar-width:thin}
#status::before{content:'●';color:var(--ok);text-shadow:0 0 8px #44e2bc55}
#alertbar{flex-shrink:0;flex-wrap:wrap;padding:12px;font-size:12px;line-height:1.6}
#alertbar.warn{background:#332710;color:#ffdc99;border-bottom-color:#8b682e}
#alertbar.bad{background:#351923;color:#ffb5bd;border-bottom-color:#a44c5a}
#alertbar.warn::before{content:'⚠ Aviso de cupo';font-weight:700}
#alertbar.bad::before{content:'⚠ Cupo crítico';font-weight:700}
.card{max-width:420px;margin:10vh auto;padding:28px;border-color:#285572;box-shadow:0 20px 80px #0005,var(--glow);background:linear-gradient(135deg,#0e2135,#07111f)}
.card h1{color:var(--acc);font-size:20px}
#f>button{width:100%}
#stepup{padding:20px;backdrop-filter:blur(5px)}
#stepup form{width:100%;max-width:380px;border-color:#397392}
#lbcap{padding:0 20px;overflow-wrap:anywhere;max-width:100%}
@media(min-width:901px) and (max-width:1200px){
 #shell{grid-template-columns:166px minmax(0,1fr) 280px}
 #viewHome{padding:18px}#right{padding:12px}#bar select{max-width:140px}
}
@media(max-width:900px){
 #shell{grid-template-columns:minmax(0,1fr);grid-template-rows:64px minmax(0,1fr) calc(34px + env(safe-area-inset-bottom));grid-template-areas:'top' 'center' 'status'}
 #top{padding:0 10px;gap:8px}#top .icon{display:block;flex-shrink:0}
 .brand{padding-left:0;flex:1}.brand::before{display:none}.brand b{font-size:11px;letter-spacing:.06em}.brand span{font-size:10px}
 #clock{font-size:11px;margin-left:0}#out{font-size:12px;padding:8px}
 #center{margin:8px}#viewHome{padding:20px 16px}.vt{font-size:22px}
 #side,#right{top:64px;bottom:calc(34px + env(safe-area-inset-bottom));margin:0;width:min(340px,88vw);border-radius:0;box-shadow:12px 0 48px #000a;overscroll-behavior:contain;visibility:hidden;transition:transform .2s,visibility .2s}
 #side{left:0}#right{box-shadow:-12px 0 48px #000a}#side.open,#right.open{visibility:visible}
 #bar{padding:8px;gap:6px}#bar select{width:120px;max-width:40%}#bar input{min-width:70px}#bar button{padding:8px 12px}
 #state{width:100%;min-height:0}#state:empty{display:none}
 #keys{gap:6px;padding:6px}#term{padding:4px}
 #status{padding:0 10px;padding-bottom:env(safe-area-inset-bottom)}
 .card{margin:5vh 16px;max-width:420px}
}
@media(max-width:400px){#clock{display:none}.brand b{font-size:10px}.brand span{font-size:9px}#viewHome{padding:16px 12px}.acct{padding:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* ajuste: pestañas de sesion mas visibles */
#chips{gap:4px;padding-top:6px}
.chip{border:1px solid var(--line);border-bottom:0;border-radius:8px 8px 0 0;min-height:40px;padding:8px 14px;background:#0b1727;color:var(--mut)}
.chip:hover{border-color:var(--acc);color:var(--tx)}
.chip.on{background:#10304d;color:#fff;border-color:var(--acc);box-shadow:inset 0 3px 0 var(--acc)}

/* proyectos */
.pstate{font:12px var(--mono);margin:8px 0 0}
.pstate.ok{color:var(--ok)}.pstate.warn{color:var(--warn)}.pstate.bad{color:var(--bad)}
.plink{display:inline-block;color:var(--acc);margin:8px 0 2px;text-decoration:none;font-weight:600}
.plink:hover{text-decoration:underline}
.pbtns{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.pbtns .mini{min-height:36px}
#viewProjects{padding:24px;overflow:auto}
@media(max-width:900px){#viewProjects{padding:18px}}
@media(max-width:640px){#viewProjects{padding:20px 16px}}
@media(max-width:400px){#viewProjects{padding:16px 12px}}

/* herramientas */
#viewTools{padding:24px;overflow:auto}
@media(max-width:900px){#viewTools{padding:18px}}
@media(max-width:640px){#viewTools{padding:20px 16px}}
@media(max-width:400px){#viewTools{padding:16px 12px}}
#toolsbox .grp{margin:20px 2px 10px}
.tool.off{opacity:.62}
.tool.busy{border-color:var(--acc);box-shadow:0 0 0 1px #39d4ff55,var(--glow)}
.uso{font:12px var(--mono);margin-top:8px;color:var(--mut)}
.uso.on{color:var(--acc);font-weight:600}

/* avisos */
#viewAvisos{padding:24px;overflow:auto}
@media(max-width:900px){#viewAvisos{padding:18px}}
@media(max-width:640px){#viewAvisos{padding:20px 16px}}
.sub{margin:20px 0 8px;font:12px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--acc)}
.devrow,.av{margin-bottom:8px}
.av.crit{border-color:#7a2b33}.av.warn{border-color:#7a6224}

.termtip{padding:8px 12px;background:#2a2410;color:#ffd078;font-size:.85rem;border-bottom:1px solid #5c4d1a}

/* adjuntar y redactar */
#composebar{display:flex;gap:8px;padding:6px 10px;border-bottom:1px solid var(--line);background:var(--panel2)}
#composebar .mini{margin:0;min-height:38px}
#composer{position:fixed;inset:0;background:rgba(0,0,0,.72);display:flex;align-items:flex-end;justify-content:center;z-index:9}
#composer.hidden{display:none}
.cbox{width:min(720px,100%);max-height:92dvh;overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:14px 14px 0 0;padding:16px}
.cbox h3{margin:0 0 6px}
#ctext{width:100%;min-height:160px;margin:8px 0;padding:12px;background:#0a1018;color:var(--tx);border:1px solid var(--line);border-radius:8px;font:inherit;resize:vertical}
.crow{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.crow button{margin:0;flex:1;min-width:130px}
#cimgs{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0}
#cimgs .th{position:relative;border:1px solid var(--line);border-radius:8px;padding:4px;background:#0a1018;font-size:.72rem;color:var(--mut);max-width:130px;word-break:break-all}
#cimgs .th b{display:block;color:var(--acc);cursor:pointer;margin-top:2px}
#canswer{margin-top:10px;padding:12px;background:#08121f;border:1px solid var(--line);border-radius:8px;white-space:pre-wrap;font-size:.92rem;max-height:40dvh;overflow:auto}
@media(min-width:720px){#composer{align-items:center}.cbox{border-radius:14px}}

/* chat */
#viewChat{display:flex;flex-direction:column;height:100%;min-height:0}
#chathead{display:flex;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line);background:var(--panel2);align-items:center}
#chathead select{margin:0;flex:1;min-width:0}
#chathead button{margin:0;min-width:44px}
#chatlist{flex:1;min-height:0;overflow-y:auto;padding:14px 12px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.bub{max-width:min(92%,760px);padding:10px 13px;border-radius:16px;overflow-wrap:anywhere;font-size:.97rem;line-height:1.5}
.bub.me{align-self:flex-end;background:#124a73;border:1px solid #2a6f9f;border-bottom-right-radius:4px}
.bub.ai{align-self:flex-start;background:var(--panel);border:1px solid var(--line);border-bottom-left-radius:4px}
.md .pp,.md .li{margin:2px 0}.md .li{padding-left:16px;text-indent:-12px}.md .li:before{content:"• "}
.md .mh{font-weight:700;margin:6px 0 2px}
.md pre{margin:6px 0;padding:10px;background:#040c17;border:1px solid var(--line);border-radius:8px;overflow-x:auto;font:.82rem/1.4 var(--mono);white-space:pre}
.md .ic{padding:1px 5px;background:#040c17;border-radius:4px;font:.88em var(--mono)}
.bnote{align-self:center;color:var(--mut);font-size:.8rem}
details.tool{align-self:flex-start;max-width:min(92%,760px);font-size:.82rem;color:var(--mut)}
details.tool summary{cursor:pointer;padding:5px 10px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;list-style:none}
details.tool[open] summary{white-space:normal}
.tres{margin:4px 0 0;padding:8px;background:#040c17;border:1px solid var(--line);border-radius:8px;max-height:200px;overflow:auto;white-space:pre-wrap;font:.78rem/1.4 var(--mono)}
.tres.terr{border-color:var(--bad)}
#chatinfo,#chatempty{padding:4px 12px;margin:0}
#chatwork{display:flex;align-items:center;gap:10px;padding:6px 12px;color:var(--acc)}
#chatwork button{margin:0;min-height:36px}
.dots:after{content:"";animation:dt 1.2s steps(4) infinite}
@keyframes dt{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}
#chatprompt{margin:6px 10px;padding:12px;border:1px solid var(--acc2);border-radius:12px;background:var(--panel)}
#chatprompt{max-height:42dvh;overflow-y:auto;flex-shrink:0;overscroll-behavior:contain}
#chatbar,#chathead,#chatwork,#chatimg,#chatquota{flex-shrink:0}
#chatlist{min-height:90px}
#chatprompt .pq{white-space:pre-wrap;margin-bottom:10px;font-size:1.05rem;font-weight:600;line-height:1.4}
#chatprompt .popt{display:block;width:100%;text-align:left;margin:6px 0 0;font-size:1rem}
#chatbar{display:flex;gap:8px;align-items:flex-end;padding:8px 10px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--panel2)}
#chatbar button{margin:0;min-width:46px;min-height:46px}
#chattext{flex:1;margin:0;resize:none;max-height:160px;border-radius:20px;padding:11px 14px}
#chatsend{border-radius:50%;font-size:1.1rem}

#chatquota{margin:6px 10px;padding:10px 12px;border-radius:12px;border:1px solid var(--warn);background:#2a2208}
#chatquota.bad{border-color:var(--bad);background:#2c0f13}
#chatquota .qt{font-size:.9rem;margin-bottom:4px}
#chatquota .popt{display:block;width:100%;text-align:left;margin:6px 0 0}
#chatsend[data-blocked="1"]{opacity:.45}
.bub.me.pend{opacity:.65}
.bub.me.fail{border:1px solid var(--bad);opacity:1}

/* tema Claude Code (solo en la vista Chat) */
body.cl{--bg:#262624;--panel:#30302e;--panel2:#1f1e1d;--tx:#faf9f5;--mut:#a6a39a;--acc:#d97757;--acc2:#d97757;--line:#3d3d3a;--ok:#8fb573;--warn:#e0b45c;--bad:#e5877e;background:#262624}
body.cl #top{background:#1f1e1d;border-bottom-color:#3d3d3a;box-shadow:none}
body.cl #center{background:#262624;border-color:#3d3d3a;box-shadow:none}
body.cl #side,body.cl #right{background:#1f1e1d;border-color:#3d3d3a}
body.cl #status{background:#1f1e1d;border-color:#3d3d3a}
body.cl button.icon{color:#d97757;border-color:#3d3d3a}
body.cl #chathead{background:#262624;border-bottom:1px solid #3d3d3a}
body.cl #chathead select,body.cl #chathead button,body.cl #chatmodel{background:#30302e;border:1px solid #3d3d3a;color:#faf9f5;border-radius:10px}
body.cl #chatlist{padding:16px 14px;gap:14px}
body.cl .bub.me{align-self:flex-end;background:#30302e;border:0;border-radius:18px;padding:10px 14px;max-width:86%}
body.cl .bub.ai{align-self:stretch;background:transparent;border:0;padding:0 2px;max-width:100%;font-family:Georgia,"Times New Roman",serif;font-size:1.02rem;line-height:1.6;color:#faf9f5}
body.cl .bub.ai .md pre,body.cl .bub.ai .md .ic{font-family:var(--mono)}
body.cl .md pre{background:#1f1e1d;border:1px solid #3d3d3a}
body.cl .md .ic{background:#1f1e1d}
body.cl details.tool summary{background:transparent;border:0;border-left:2px solid #d97757;border-radius:0;padding:2px 10px;font-family:var(--mono);font-size:.8rem;color:#a6a39a}
body.cl .tres{background:#1f1e1d;border-color:#3d3d3a}
body.cl #chatwork{color:#d97757}
body.cl #chatprompt,body.cl #chatquota{background:#30302e;border-color:#d97757}
body.cl #chatquota.bad{border-color:#e5877e;background:#3a2523}
body.cl #chatprompt .popt,body.cl #chatquota .popt{background:#3d3d3a;border:1px solid #4a4a46;border-radius:10px;color:#faf9f5}
body.cl #chatprompt .popt:hover{border-color:#d97757}
body.cl #chatbar{display:block;margin:8px 10px calc(8px + env(safe-area-inset-bottom));padding:10px 12px 8px;background:#30302e;border:1px solid #3d3d3a;border-radius:22px}
body.cl #chattext{width:100%;background:transparent;border:0;padding:4px 2px;color:#faf9f5;border-radius:0;min-height:40px}
body.cl #chattext:focus{outline:none}
.cbtools{display:flex;align-items:center;gap:8px;margin-top:4px}
.cbtools .grow{flex:1;min-width:0}
.cbtools{min-width:0;max-width:100%;box-sizing:border-box}
.cbtools #chatmodel{flex:0 1 auto;min-width:0;max-width:40%;text-overflow:ellipsis}
.cbtools #chatctx{flex:0 1 auto;min-width:0;margin-right:0;overflow:hidden;text-overflow:ellipsis}
.cbtools #chatattach,.cbtools #chatsend{flex:0 0 auto}
#chatbar{box-sizing:border-box;max-width:100%;overflow:hidden}
body.cl .cbtn{margin:0;min-width:38px;min-height:38px;width:38px;height:38px;border-radius:50%;background:transparent;border:1px solid #4a4a46;color:#faf9f5;font-size:1.3rem;padding:0}
body.cl #chatmodel{margin:0;width:auto;max-width:48%;min-height:38px;padding:4px 10px;font-size:.85rem;background:transparent;border:0;color:#a6a39a}
body.cl #chatsend{width:38px;height:38px;min-width:38px;min-height:38px;border-radius:50%;background:#d97757;border:0;color:#fff;font-size:1.25rem;font-weight:700;padding:0;margin:0}
body.cl #chatsend:disabled{background:#4a4a46;color:#8a877e}

.gthumbs{display:flex;gap:8px;flex-wrap:wrap;align-self:flex-start;margin:2px 0}
.gimg{max-width:min(78vw,320px);max-height:320px;border-radius:12px;border:1px solid var(--line);cursor:zoom-in;background:#1f1e1d}

#chatprompt .pdesc{display:block;font-size:.88em;opacity:.8;white-space:normal;margin-top:2px}
#chatprompt .ptabs{font-size:.8em;opacity:.7;margin-bottom:4px}
#chatprompt .popt.cur{border-color:#d97757}

#chatctx{font-size:.72rem;opacity:.75;white-space:nowrap;margin-right:8px}
#chatctx.warn{color:#e0a458;opacity:1}
#chatctx.bad{color:#e5534b;opacity:1}

#chatimg{padding:6px 12px;font-size:.82rem;color:#d97757;border-top:1px solid var(--line);max-height:9em;overflow-y:auto;overflow-wrap:anywhere;line-height:1.4}
#chatimg.bad{color:#e5534b}

#chathead #chatacct{flex:0 0 auto;width:auto;min-width:96px}
#chathead #chatproj{flex:1 1 0}