/* ============================================================
   J.A.R.V.I.S MARK L — UNLIMITED STYLESHEET
   Hindi + English · Offline + Online · Full Iron Man HUD
   ============================================================ */

:root {
  --bg:      #020810;
  --bg2:     #040d1a;
  --bg3:     #071428;
  --panel:   rgba(4,18,38,0.88);
  --border:  rgba(0,180,255,0.22);
  --border2: rgba(0,180,255,0.5);
  --cyan:    #00b4ff;
  --cyan2:   #00e5ff;
  --cyan3:   #7df9ff;
  --blue:    #0055cc;
  --gold:    #ffc107;
  --gold2:   #ffab00;
  --red:     #ff3b3b;
  --green:   #00ff88;
  --purple:  #9b59b6;
  --orange:  #ff6b2b;
  --text:    #c8e8ff;
  --text2:   #7ab8d8;
  --text3:   #3a6a8a;
  --glow:    0 0 20px rgba(0,180,255,.6),0 0 40px rgba(0,180,255,.3);
  --glow2:   0 0 10px rgba(0,180,255,.4);
  --glow-g:  0 0 20px rgba(255,193,7,.5);
  --font-h:  'Orbitron', monospace;
  --font-b:  'Exo 2', 'Noto Sans Devanagari', sans-serif;
  --font-m:  'Share Tech Mono', monospace;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;background:var(--bg);color:var(--text);font-family:var(--font-b);overflow:hidden}
::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:var(--bg2)}::-webkit-scrollbar-thumb{background:var(--cyan);border-radius:2px}
.hidden{display:none!important}

/* ── BOOT ── */
#boot-screen{position:fixed;inset:0;background:#000;display:flex;align-items:center;justify-content:center;z-index:9999}
.boot-wrap{display:flex;flex-direction:column;align-items:center;gap:28px}
.boot-arc{position:relative;width:140px;height:140px;display:flex;align-items:center;justify-content:center}
.boot-info{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.boot-title{font-family:var(--font-h);font-size:3.2rem;font-weight:900;color:var(--cyan2);text-shadow:var(--glow);letter-spacing:.4em;animation:pulse-txt 1.5s ease-in-out infinite}
.boot-sub{font-family:var(--font-h);font-size:.65rem;color:var(--text2);letter-spacing:.25em}
.boot-sub2{font-family:'Noto Sans Devanagari',sans-serif;font-size:.8rem;color:var(--cyan);opacity:.7}
.boot-log-wrap{min-height:1.4em}
.boot-log{font-family:var(--font-m);font-size:.75rem;color:var(--cyan);letter-spacing:.05em}
.boot-bar-wrap{width:340px;height:3px;background:rgba(0,180,255,.12);border-radius:2px;overflow:hidden;margin-top:4px}
.boot-bar{height:100%;width:0%;background:linear-gradient(90deg,var(--blue),var(--cyan2));box-shadow:var(--glow);transition:width .08s linear}
.boot-pct{font-family:var(--font-m);font-size:.65rem;color:var(--text3)}

/* ── ARC RINGS (shared) ── */
.arc-ring{position:absolute;border-radius:50%;border:2px solid var(--cyan);animation:spin 4s linear infinite}
.arc-core{border-radius:50%;background:radial-gradient(circle,#fff 0%,var(--cyan2) 40%,var(--blue) 100%);box-shadow:0 0 20px var(--cyan2),0 0 40px var(--cyan),0 0 60px rgba(0,180,255,.4);animation:core-pulse 2s ease-in-out infinite;display:flex;align-items:center;justify-content:center}
.arc-inner{border-radius:50%;background:#fff}
.arc-glow{position:absolute;inset:-12px;border-radius:50%;background:radial-gradient(circle,rgba(0,180,255,.15) 0%,transparent 70%);animation:core-pulse 2s ease-in-out infinite}

/* Boot arc sizes */
.boot-arc .r1{width:140px;height:140px;border-color:rgba(0,180,255,.2);animation-duration:10s}
.boot-arc .r2{width:108px;height:108px;border-color:rgba(0,180,255,.35);animation-duration:7s;animation-direction:reverse}
.boot-arc .r3{width:78px;height:78px;border-color:rgba(0,180,255,.55);animation-duration:4s}
.boot-arc .r4{width:50px;height:50px;border-color:var(--cyan);animation-duration:2s;animation-direction:reverse}
.boot-arc .arc-core{width:26px;height:26px}
.boot-arc .arc-inner{width:12px;height:12px}

/* ── SCANLINES & GRID ── */
.scanlines{position:fixed;inset:0;pointer-events:none;z-index:1000;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.07) 2px,rgba(0,0,0,.07) 4px)}
.grid-bg{position:fixed;inset:0;pointer-events:none;z-index:0;background-image:linear-gradient(rgba(0,180,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,180,255,.03) 1px,transparent 1px);background-size:40px 40px}

/* ── TOPBAR ── */
.topbar{position:relative;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 16px;height:54px;background:linear-gradient(180deg,rgba(0,20,50,.96) 0%,rgba(2,8,16,.92) 100%);border-bottom:1px solid var(--border2);box-shadow:0 2px 30px rgba(0,180,255,.12)}
.tb-l,.tb-r{display:flex;align-items:center;gap:14px}
.tb-c{display:flex;align-items:center;gap:16px}

/* Mini arc */
.arc-mini{position:relative;width:34px;height:34px;display:flex;align-items:center;justify-content:center}
.arc-mini .r1{width:34px;height:34px;border-color:rgba(0,180,255,.3);animation-duration:6s}
.arc-mini .r2{width:22px;height:22px;border-color:rgba(0,180,255,.6);animation-duration:3s;animation-direction:reverse}
.arc-mini .arc-core{width:10px;height:10px}

.tb-brand{display:flex;flex-direction:column}
.tb-name{font-family:var(--font-h);font-size:1rem;font-weight:800;color:var(--cyan2);text-shadow:var(--glow);letter-spacing:.2em}
.tb-ver{font-family:var(--font-m);font-size:.55rem;color:var(--text3);letter-spacing:.1em}

.conn-badge{display:flex;align-items:center;gap:6px;padding:4px 12px;border:1px solid var(--border2);border-radius:20px;background:rgba(0,180,255,.07);font-family:var(--font-h);font-size:.55rem;letter-spacing:.12em;color:var(--cyan2)}
.conn-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:blink 2s ease-in-out infinite}
.conn-dot.offline{background:var(--red);box-shadow:0 0 8px var(--red)}

.emotion-bar{display:flex;align-items:center;gap:8px}
.emo-label{font-family:var(--font-h);font-size:.5rem;color:var(--text3);letter-spacing:.15em}
.emo-display{display:flex;align-items:center;gap:6px;padding:4px 10px;border:1px solid var(--border);border-radius:3px;background:rgba(0,180,255,.06)}
.emo-icon{font-size:1rem}
.emo-text{font-family:var(--font-h);font-size:.55rem;color:var(--cyan);letter-spacing:.1em}

.lang-toggle{display:flex;gap:3px}
.lang-btn{font-family:var(--font-h);font-size:.5rem;padding:4px 8px;border:1px solid var(--border);border-radius:2px;background:transparent;color:var(--text3);cursor:pointer;letter-spacing:.1em;transition:all .2s}
.lang-btn:hover{color:var(--cyan);border-color:var(--border2)}
.lang-btn.active{color:var(--cyan2);border-color:var(--cyan);background:rgba(0,180,255,.1);box-shadow:var(--glow2)}

.tb-stat{display:flex;flex-direction:column;align-items:flex-end}
.tb-lbl{font-family:var(--font-h);font-size:.45rem;color:var(--text3);letter-spacing:.12em}
.tb-val{font-family:var(--font-m);font-size:.75rem;color:var(--cyan)}

/* ── LAYOUT ── */
#main-hud{position:relative;z-index:10;width:100vw;height:100vh;display:flex;flex-direction:column}
.hud-layout{flex:1;display:grid;grid-template-columns:255px 1fr 275px;gap:10px;padding:10px;overflow:hidden}
.panel{display:flex;flex-direction:column;gap:8px;overflow-y:auto}

/* ── PANEL BLOCKS ── */
.pblock{background:var(--panel);border:1px solid var(--border);border-radius:4px;padding:11px;position:relative;backdrop-filter:blur(10px);transition:border-color .3s}
.pblock::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);opacity:.4}
.pblock:hover{border-color:var(--border2)}
.ptitle{font-family:var(--font-h);font-size:.58rem;font-weight:700;color:var(--cyan);letter-spacing:.18em;margin-bottom:9px;padding-bottom:6px;border-bottom:1px solid var(--border)}

/* ── ARC REACTOR MAIN ── */
.arc-block{text-align:center}
.arc-main{position:relative;width:100px;height:100px;margin:8px auto;display:flex;align-items:center;justify-content:center}
.arc-main .r1{width:100px;height:100px;border-color:rgba(0,180,255,.18);animation-duration:12s}
.arc-main .r2{width:78px;height:78px;border-color:rgba(0,180,255,.32);animation-duration:8s;animation-direction:reverse}
.arc-main .r3{width:58px;height:58px;border-color:rgba(0,180,255,.52);animation-duration:5s}
.arc-main .r4{width:38px;height:38px;border-color:var(--cyan);animation-duration:2.5s;animation-direction:reverse}
.arc-main .arc-core{width:20px;height:20px;z-index:2}
.arc-main .arc-inner{width:9px;height:9px}
.power-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:6px}
.pg-item{display:flex;flex-direction:column;align-items:center;gap:1px;font-family:var(--font-h);font-size:.45rem;color:var(--text3);letter-spacing:.08em}
.pg-val{font-size:.7rem;color:var(--cyan2);font-weight:700}

/* ── SYSTEM BARS ── */
.sys-rows{display:flex;flex-direction:column;gap:6px}
.srow{display:flex;align-items:center;gap:7px}
.slbl{font-family:var(--font-h);font-size:.5rem;color:var(--text3);letter-spacing:.08em;width:28px;flex-shrink:0}
.sbar-w{flex:1;height:4px;background:rgba(0,180,255,.1);border-radius:2px;overflow:hidden}
.sbar{height:100%;background:linear-gradient(90deg,var(--blue),var(--cyan2));border-radius:2px;box-shadow:0 0 6px var(--cyan);transition:width 1s ease;width:35%}
.sbar.gpu{background:linear-gradient(90deg,#6600cc,#aa44ff)}
.sbar.net{background:linear-gradient(90deg,#0066ff,#00e5ff)}
.sbar.dsk{background:linear-gradient(90deg,#cc4400,var(--gold))}
.spct{font-family:var(--font-m);font-size:.62rem;color:var(--cyan);width:30px;text-align:right}

/* ── DEVICES ── */
.dev-list{display:flex;flex-direction:column;gap:5px;margin-bottom:7px}
.ditem{display:flex;align-items:center;gap:7px;padding:5px 7px;border:1px solid var(--border);border-radius:3px;background:rgba(0,180,255,.04);transition:all .3s;cursor:pointer}
.ditem.online{border-color:rgba(0,255,136,.3)}
.ditem.offline{border-color:rgba(255,59,59,.3);opacity:.6}
.ditem:hover{background:rgba(0,180,255,.1)}
.dico{font-size:.95rem}
.dinfo{flex:1;display:flex;flex-direction:column;gap:1px}
.dname{font-family:var(--font-h);font-size:.5rem;color:var(--text);letter-spacing:.08em}
.dstat{font-family:var(--font-m);font-size:.5rem}
.ditem.online .dstat{color:var(--green)}
.ditem.offline .dstat{color:var(--red)}
.dtog{width:26px;height:13px;border-radius:7px;background:rgba(0,180,255,.15);border:1px solid var(--border2);position:relative;cursor:pointer;transition:background .3s;flex-shrink:0}
.dtog::after{content:'';position:absolute;top:2px;left:2px;width:9px;height:9px;border-radius:50%;background:var(--text3);transition:all .3s}
.ditem.online .dtog{background:rgba(0,255,136,.25);border-color:var(--green)}
.ditem.online .dtog::after{background:var(--green);left:13px;box-shadow:0 0 5px var(--green)}

/* ── SUIT STATUS ── */
.suit-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:8px}
.suit-part{display:flex;justify-content:space-between;align-items:center;padding:4px 7px;border:1px solid var(--border);border-radius:2px;font-family:var(--font-h);font-size:.48rem;color:var(--text2);letter-spacing:.08em}
.suit-s{font-size:.48rem;font-weight:700}
.suit-s.online{color:var(--green);text-shadow:0 0 6px var(--green)}
.suit-s.offline{color:var(--text3)}
.suit-s.charging{color:var(--gold);text-shadow:0 0 6px var(--gold)}

/* ── CENTER FACE ── */
.center-panel{gap:10px}
.face-block{position:relative;background:var(--panel);border:1px solid var(--border);border-radius:4px;padding:14px;display:flex;flex-direction:column;align-items:center;gap:8px;overflow:hidden;min-height:180px}
.face-rings{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.face-ring{position:absolute;border-radius:50%;border:1px solid rgba(0,180,255,.08)}
.fr1{width:320px;height:320px;animation:spin 22s linear infinite}
.fr2{width:240px;height:240px;animation:spin 16s linear infinite reverse}
.fr3{width:160px;height:160px;animation:spin 10s linear infinite}
#wave-canvas{width:100%;max-width:600px;height:70px;position:relative;z-index:2}
.jarvis-eye{position:relative;width:56px;height:56px;display:flex;align-items:center;justify-content:center;z-index:3}
.eye-o{position:absolute;width:56px;height:56px;border-radius:50%;border:2px solid var(--cyan);box-shadow:var(--glow);animation:spin 4s linear infinite}
.eye-m{position:absolute;width:40px;height:40px;border-radius:50%;border:1px solid rgba(0,180,255,.5);animation:spin 2s linear infinite reverse}
.eye-i{position:absolute;width:28px;height:28px;border-radius:50%;background:radial-gradient(circle,rgba(0,229,255,.3) 0%,transparent 70%);border:1px solid var(--cyan2)}
.eye-p{width:13px;height:13px;border-radius:50%;background:radial-gradient(circle,#fff 0%,var(--cyan2) 50%,var(--blue) 100%);box-shadow:0 0 10px var(--cyan2),0 0 20px var(--cyan);animation:core-pulse 2s ease-in-out infinite}
.face-status{font-family:var(--font-h);font-size:.6rem;color:var(--cyan);letter-spacing:.2em;text-shadow:var(--glow2)}

/* ── TERMINAL ── */
.terminal{flex:1;background:var(--panel);border:1px solid var(--border);border-radius:4px;display:flex;flex-direction:column;overflow:hidden;min-height:0}
.term-head{display:flex;align-items:center;justify-content:space-between;padding:9px 13px;border-bottom:1px solid var(--border);background:rgba(0,20,50,.6);flex-shrink:0;flex-wrap:wrap;gap:6px}
.term-title{font-family:var(--font-h);font-size:.55rem;color:var(--cyan);letter-spacing:.15em}
.tabs{display:flex;gap:3px;flex-wrap:wrap}
.tab{font-family:var(--font-h);font-size:.5rem;padding:4px 9px;border:1px solid var(--border);border-radius:2px;color:var(--text3);cursor:pointer;letter-spacing:.08em;transition:all .2s}
.tab:hover{color:var(--cyan);border-color:var(--border2)}
.tab.active{color:var(--cyan2);border-color:var(--cyan);background:rgba(0,180,255,.1);box-shadow:var(--glow2)}
.tab-pane{display:none;flex:1;flex-direction:column;overflow:hidden}
.tab-pane.active{display:flex}

/* ── CHAT ── */
.chat-log{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:9px}
.msg{display:flex;flex-direction:column;gap:3px;max-width:88%;animation:msg-in .3s ease}
.msg.jarvis{align-self:flex-start}
.msg.user{align-self:flex-end}
.mwho{font-family:var(--font-h);font-size:.48rem;letter-spacing:.12em}
.msg.jarvis .mwho{color:var(--cyan)}
.msg.user .mwho{color:var(--gold);text-align:right}
.mtxt{font-family:var(--font-b);font-size:.8rem;line-height:1.55;padding:7px 11px;border-radius:3px}
.msg.jarvis .mtxt{background:rgba(0,180,255,.07);border:1px solid rgba(0,180,255,.18);color:var(--text);border-left:2px solid var(--cyan)}
.msg.user .mtxt{background:rgba(255,193,7,.07);border:1px solid rgba(255,193,7,.18);color:var(--text);border-right:2px solid var(--gold)}
.chat-row{display:flex;gap:7px;padding:9px 11px;border-top:1px solid var(--border);background:rgba(0,10,25,.8);flex-shrink:0}
.mic-btn{width:36px;height:36px;border-radius:50%;background:rgba(0,180,255,.1);border:1px solid var(--border2);color:var(--cyan);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}
.mic-btn svg{width:15px;height:15px}
.mic-btn:hover{background:rgba(0,180,255,.2);box-shadow:var(--glow2)}
.mic-btn.listening{background:rgba(255,59,59,.2);border-color:var(--red);color:var(--red);animation:pulse-ring 1s ease-in-out infinite}
.chat-input{flex:1;background:rgba(0,20,50,.8);border:1px solid var(--border);border-radius:3px;color:var(--text);font-family:var(--font-m);font-size:.78rem;padding:0 11px;outline:none;transition:border-color .2s}
.chat-input:focus{border-color:var(--cyan);box-shadow:var(--glow2)}
.chat-input::placeholder{color:var(--text3)}
.send-btn{font-family:var(--font-h);font-size:.55rem;padding:0 14px;background:linear-gradient(135deg,var(--blue),var(--cyan));border:none;border-radius:3px;color:#fff;cursor:pointer;letter-spacing:.1em;transition:all .2s;box-shadow:var(--glow2)}
.send-btn:hover{box-shadow:var(--glow);transform:translateY(-1px)}
.search-btn{width:36px;height:36px;border-radius:3px;background:rgba(255,193,7,.1);border:1px solid rgba(255,193,7,.3);color:var(--gold);cursor:pointer;font-size:1rem;transition:all .2s;flex-shrink:0}
.search-btn:hover{background:rgba(255,193,7,.2);box-shadow:var(--glow-g)}

/* ── COMMANDS ── */
.cmd-head{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-bottom:1px solid var(--border);font-family:var(--font-h);font-size:.55rem;color:var(--text2);letter-spacing:.1em;flex-shrink:0}
.cmd-list{flex:1;overflow-y:auto;padding:7px;display:flex;flex-direction:column;gap:5px}
.cmd-item{display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid var(--border);border-radius:3px;background:rgba(0,180,255,.04);cursor:pointer;transition:all .2s}
.cmd-item:hover{background:rgba(0,180,255,.1);border-color:var(--border2)}
.ctrig{font-family:var(--font-m);font-size:.72rem;color:var(--cyan2);flex:1}
.cbadge{font-family:var(--font-h);font-size:.42rem;padding:2px 5px;border-radius:2px;letter-spacing:.08em}
.cbadge.response{background:rgba(0,180,255,.2);color:var(--cyan)}
.cbadge.js{background:rgba(255,193,7,.2);color:var(--gold)}
.cbadge.device{background:rgba(0,255,136,.2);color:var(--green)}
.cbadge.system{background:rgba(255,59,59,.2);color:var(--red)}
.cdel{background:none;border:none;color:var(--text3);cursor:pointer;font-size:.75rem;transition:color .2s}
.cdel:hover{color:var(--red)}
.add-cmd{padding:9px 11px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:7px;flex-shrink:0}
.frow{display:flex;gap:7px;align-items:center}

/* ── UPGRADE ── */
.upg-head{font-family:var(--font-h);font-size:.65rem;color:var(--gold);letter-spacing:.18em;padding:11px;border-bottom:1px solid var(--border);flex-shrink:0}
.upg-desc{font-size:.72rem;color:var(--text2);padding:7px 11px;line-height:1.55;flex-shrink:0;font-family:var(--font-b)}
.upg-log{flex:1;overflow-y:auto;padding:7px 11px;display:flex;flex-direction:column;gap:3px}
.ulog{font-family:var(--font-m);font-size:.7rem;color:var(--text2);padding:3px 0;border-bottom:1px solid rgba(0,180,255,.05);animation:msg-in .3s ease}
.upg-row{display:flex;gap:7px;padding:9px 11px;border-top:1px solid var(--border);flex-shrink:0}
.ability-grid{display:flex;flex-wrap:wrap;gap:5px;padding:7px 11px;border-top:1px solid var(--border);flex-shrink:0;max-height:80px;overflow-y:auto}
.atag{font-family:var(--font-h);font-size:.45rem;padding:3px 7px;border-radius:2px;background:rgba(255,193,7,.1);border:1px solid rgba(255,193,7,.3);color:var(--gold);letter-spacing:.08em;animation:msg-in .3s ease}

/* ── HOME ── */
.home-title{font-family:var(--font-h);font-size:.6rem;color:var(--cyan);letter-spacing:.18em;padding:11px;border-bottom:1px solid var(--border);flex-shrink:0}
.home-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:9px;flex:1;overflow-y:auto}
.hcard{background:rgba(0,180,255,.05);border:1px solid var(--border);border-radius:4px;padding:9px;display:flex;flex-direction:column;align-items:center;gap:5px;transition:all .3s;cursor:pointer}
.hcard:hover{border-color:var(--border2);background:rgba(0,180,255,.1)}
.hci{font-size:1.4rem}
.hcn{font-family:var(--font-h);font-size:.46rem;color:var(--text2);letter-spacing:.08em}
.hcs{font-family:var(--font-m);font-size:.62rem;font-weight:700}
.hcs.on{color:var(--green);text-shadow:0 0 7px var(--green)}
.hcs.off{color:var(--red)}
.hslider{width:100%;accent-color:var(--cyan);cursor:pointer}
.hcbtn{font-family:var(--font-h);font-size:.46rem;padding:3px 9px;border-radius:2px;background:rgba(0,180,255,.1);border:1px solid var(--border2);color:var(--cyan);cursor:pointer;letter-spacing:.08em;transition:all .2s}
.hcbtn:hover{background:rgba(0,180,255,.2);box-shadow:var(--glow2)}
.fw{width:calc(100% - 18px);margin:0 9px 9px}

/* ── KNOWLEDGE ── */
.know-head{font-family:var(--font-h);font-size:.65rem;color:var(--cyan2);letter-spacing:.18em;padding:11px;border-bottom:1px solid var(--border);flex-shrink:0}
.know-cats{display:flex;flex-wrap:wrap;gap:4px;padding:8px 11px;border-bottom:1px solid var(--border);flex-shrink:0}
.kcat{font-family:var(--font-h);font-size:.48rem;padding:4px 9px;border:1px solid var(--border);border-radius:2px;background:transparent;color:var(--text3);cursor:pointer;letter-spacing:.08em;transition:all .2s}
.kcat:hover{color:var(--cyan);border-color:var(--border2)}
.kcat.active{color:var(--cyan2);border-color:var(--cyan);background:rgba(0,180,255,.1)}
.know-content{flex:1;overflow-y:auto;padding:11px;display:flex;flex-direction:column;gap:8px}
.know-item{padding:9px 11px;border:1px solid var(--border);border-radius:3px;background:rgba(0,180,255,.04);border-left:2px solid var(--cyan)}
.know-item h4{font-family:var(--font-h);font-size:.58rem;color:var(--cyan2);letter-spacing:.1em;margin-bottom:5px}
.know-item p{font-size:.75rem;color:var(--text2);line-height:1.55}
.know-search-row{display:flex;gap:7px;padding:9px 11px;border-top:1px solid var(--border);flex-shrink:0}

/* ── SECRET ── */
.secret-head{font-family:var(--font-h);font-size:.65rem;color:var(--red);letter-spacing:.18em;padding:11px;border-bottom:1px solid rgba(255,59,59,.3);flex-shrink:0;text-shadow:0 0 10px var(--red)}
.secret-unlock{display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px;flex:1;justify-content:center}
.secret-msg{font-family:var(--font-h);font-size:.6rem;color:var(--text2);letter-spacing:.12em;text-align:center}
.secret-hint{font-family:var(--font-m);font-size:.62rem;color:var(--text3);text-align:center}
.secret-panel{flex:1;overflow-y:auto;padding:11px;display:flex;flex-direction:column;gap:7px}
.secret-features{display:flex;flex-direction:column;gap:7px}
.sfeat{padding:10px 12px;border:1px solid rgba(255,59,59,.3);border-radius:3px;background:rgba(255,59,59,.05);border-left:2px solid var(--red)}
.sfeat h4{font-family:var(--font-h);font-size:.58rem;color:var(--red);letter-spacing:.1em;margin-bottom:4px}
.sfeat p{font-size:.73rem;color:var(--text2);line-height:1.5}
.sfeat button{margin-top:6px;font-family:var(--font-h);font-size:.48rem;padding:4px 10px;border:1px solid rgba(255,59,59,.4);border-radius:2px;background:rgba(255,59,59,.1);color:var(--red);cursor:pointer;letter-spacing:.08em;transition:all .2s}
.sfeat button:hover{background:rgba(255,59,59,.2)}

/* ── RIGHT PANEL ── */
.alert-list{display:flex;flex-direction:column;gap:4px}
.aitem{font-family:var(--font-m);font-size:.67rem;padding:4px 7px;border-radius:2px;border-left:2px solid;animation:msg-in .3s ease}
.aitem.info{border-color:var(--cyan);background:rgba(0,180,255,.05);color:var(--text2)}
.aitem.success{border-color:var(--green);background:rgba(0,255,136,.05);color:var(--green)}
.aitem.warning{border-color:var(--gold);background:rgba(255,193,7,.05);color:var(--gold)}
.aitem.danger{border-color:var(--red);background:rgba(255,59,59,.05);color:var(--red)}

#radar-canvas{display:block;margin:0 auto;border-radius:50%}
.radar-lbl{font-family:var(--font-h);font-size:.48rem;color:var(--text3);letter-spacing:.12em;text-align:center;margin-top:5px}

.mem-list{display:flex;flex-direction:column;gap:4px;margin-bottom:7px}
.mitem{font-family:var(--font-m);font-size:.65rem;color:var(--text2);padding:4px 6px;border-left:2px solid rgba(0,180,255,.3);background:rgba(0,180,255,.04);animation:msg-in .3s ease;cursor:pointer;transition:all .2s}
.mitem:hover{background:rgba(0,180,255,.1)}

.qa-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.qa{font-family:var(--font-h);font-size:.46rem;padding:6px 5px;background:rgba(0,180,255,.06);border:1px solid var(--border);border-radius:3px;color:var(--text2);cursor:pointer;letter-spacing:.04em;transition:all .2s;text-align:center}
.qa:hover{background:rgba(0,180,255,.15);border-color:var(--border2);color:var(--cyan);box-shadow:var(--glow2)}
.qa.danger{border-color:rgba(255,59,59,.3);color:var(--red)}
.qa.danger:hover{background:rgba(255,59,59,.15)}

.brain-list{display:flex;flex-direction:column;gap:4px;margin-bottom:7px}
.brain{display:flex;align-items:center;gap:7px;padding:5px 9px;border:1px solid var(--border);border-radius:3px;cursor:pointer;transition:all .2s;font-family:var(--font-h);font-size:.52rem;color:var(--text3);letter-spacing:.08em}
.brain:hover{border-color:var(--border2);color:var(--text)}
.brain.active{border-color:var(--cyan);color:var(--cyan2);background:rgba(0,180,255,.1);box-shadow:var(--glow2)}
.api-row{display:flex;gap:5px;align-items:center;margin-bottom:6px}
.offline-status{display:flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid var(--border);border-radius:3px;background:rgba(0,180,255,.04)}
.os-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green);animation:blink 2s ease-in-out infinite;flex-shrink:0}
#os-text{font-family:var(--font-m);font-size:.6rem;color:var(--text2)}

/* ── BOTTOM BAR ── */
.botbar{display:flex;align-items:center;justify-content:space-between;padding:0 14px;height:30px;background:linear-gradient(0deg,rgba(0,20,50,.96) 0%,rgba(2,8,16,.92) 100%);border-top:1px solid var(--border2);flex-shrink:0}
.bb-l,.bb-r{display:flex;gap:14px}
.bb-l span,.bb-r span{font-family:var(--font-m);font-size:.58rem;color:var(--text3)}
.bb-c{flex:1;overflow:hidden;padding:0 18px}
.ticker{font-family:var(--font-h);font-size:.52rem;color:var(--cyan);letter-spacing:.12em;white-space:nowrap;animation:ticker 25s linear infinite}

/* ── FORM ELEMENTS ── */
.hinput{background:rgba(0,20,50,.8);border:1px solid var(--border);border-radius:3px;color:var(--text);font-family:var(--font-m);font-size:.73rem;padding:6px 9px;outline:none;flex:1;transition:border-color .2s}
.hinput:focus{border-color:var(--cyan);box-shadow:var(--glow2)}
.hinput::placeholder{color:var(--text3)}
.hinput.sm{font-size:.62rem;padding:5px 7px}
.htextarea{background:rgba(0,20,50,.8);border:1px solid var(--border);border-radius:3px;color:var(--text);font-family:var(--font-m);font-size:.7rem;padding:6px 9px;outline:none;resize:vertical;min-height:55px;transition:border-color .2s;width:100%}
.htextarea:focus{border-color:var(--cyan)}
.hselect{background:rgba(0,20,50,.8);border:1px solid var(--border);border-radius:3px;color:var(--text);font-family:var(--font-h);font-size:.52rem;padding:5px 7px;outline:none;cursor:pointer}
.hbtn{font-family:var(--font-h);font-size:.52rem;padding:6px 13px;border-radius:3px;background:rgba(0,180,255,.1);border:1px solid var(--border2);color:var(--cyan);cursor:pointer;letter-spacing:.08em;transition:all .2s;white-space:nowrap}
.hbtn:hover{background:rgba(0,180,255,.2);box-shadow:var(--glow2)}
.hbtn.sm{padding:3px 9px;font-size:.46rem}
.hbtn.danger{border-color:rgba(255,59,59,.5);color:var(--red);background:rgba(255,59,59,.07)}
.hbtn.danger:hover{background:rgba(255,59,59,.18);box-shadow:0 0 10px rgba(255,59,59,.4)}
.hbtn.glow{border-color:var(--cyan);box-shadow:var(--glow2)}
.hbtn.glow:hover{box-shadow:var(--glow)}

/* ── MODAL ── */
.modal-ov{position:fixed;inset:0;z-index:9000;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.modal-box{background:var(--bg3);border:1px solid var(--border2);border-radius:6px;padding:22px;min-width:340px;max-width:480px;box-shadow:var(--glow);animation:modal-in .3s ease}
.modal-title{font-family:var(--font-h);font-size:.7rem;color:var(--cyan2);letter-spacing:.18em;margin-bottom:14px;padding-bottom:9px;border-bottom:1px solid var(--border)}
.modal-body{margin-bottom:14px}
.modal-foot{display:flex;gap:7px;justify-content:flex-end}

/* ── MIGRATE PANEL ── */
.migrate-panel{position:fixed;inset:0;z-index:9500;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(6px)}
.migrate-box{background:var(--bg3);border:1px solid var(--border2);border-radius:8px;padding:28px;display:flex;flex-direction:column;align-items:center;gap:14px;box-shadow:var(--glow);animation:modal-in .3s ease;max-width:320px;width:90%}
.migrate-title{font-family:var(--font-h);font-size:.7rem;color:var(--cyan2);letter-spacing:.15em;text-align:center}
.migrate-desc{font-size:.75rem;color:var(--text2);text-align:center;line-height:1.5}
#qr-canvas{border:2px solid var(--cyan);border-radius:4px;background:#fff}
.migrate-url{font-family:var(--font-m);font-size:.6rem;color:var(--cyan);word-break:break-all;text-align:center;max-width:260px}

/* ── TYPING DOTS ── */
.typing-dots{display:flex;gap:4px;padding:7px 11px;align-items:center}
.typing-dots span{width:5px;height:5px;border-radius:50%;background:var(--cyan);animation:dot-bounce 1.2s ease-in-out infinite}
.typing-dots span:nth-child(2){animation-delay:.2s}
.typing-dots span:nth-child(3){animation-delay:.4s}

/* ── ANIMATIONS ── */
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes core-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.92)}}
@keyframes pulse-txt{0%,100%{text-shadow:0 0 20px rgba(0,229,255,.6),0 0 40px rgba(0,229,255,.3)}50%{text-shadow:0 0 40px rgba(0,229,255,1),0 0 80px rgba(0,229,255,.6)}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes pulse-ring{0%,100%{box-shadow:0 0 0 0 rgba(255,59,59,.4)}50%{box-shadow:0 0 0 8px rgba(255,59,59,0)}}
@keyframes msg-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes modal-in{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
@keyframes ticker{from{transform:translateX(100%)}to{transform:translateX(-100%)}}
@keyframes hud-in{from{opacity:0;transform:scale(1.02)}to{opacity:1;transform:scale(1)}}
@keyframes dot-bounce{0%,80%,100%{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}
@keyframes emotion-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}

#main-hud{animation:hud-in .8s ease}

/* ── RESPONSIVE ── */
@media(max-width:1200px){.hud-layout{grid-template-columns:230px 1fr 250px}}
@media(max-width:960px){.hud-layout{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.left-panel,.right-panel{flex-direction:row;flex-wrap:wrap;overflow-x:auto}.pblock{min-width:190px;flex:1}}