/* ============================================================
   CT·BRAIN — aba Cérebro (mecanismo Obsidian fundido)
   Tema combinando com o CT (claro, teal→violeta)
   ============================================================ */
[hidden]{ display:none !important; }

/* -------- cabeçalho / busca / modos -------- */
.bhead{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:14px; }
.bsearch{ position:relative; flex:1; min-width:240px; }
#brainSearch{ width:100%; padding:11px 14px; border-radius:12px; border:1px solid var(--line);
  background:var(--card2); color:var(--txt); font-size:14px; outline:none; box-shadow:0 2px 8px rgba(30,50,90,.05); }
#brainSearch:focus{ border-color:var(--cy); box-shadow:0 0 0 3px rgba(10,157,136,.14); }
.bresults{ position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:30; max-height:320px; overflow:auto;
  background:var(--card); border:1px solid var(--line); border-radius:12px; box-shadow:0 14px 34px rgba(30,50,90,.18); }
.bresult{ display:block; width:100%; text-align:left; border:0; background:transparent; cursor:pointer;
  padding:10px 14px; border-bottom:1px solid var(--line); color:var(--txt); }
.bresult:last-child{ border-bottom:0; }
.bresult:hover{ background:var(--bg2); }
.bresult b{ color:var(--cy); font-weight:700; }
.bresult small{ display:block; color:var(--dim); font-size:11.5px; margin-top:3px; line-height:1.4; }
.bresult .frag{ font-size:12.5px; color:var(--mut); line-height:1.4; }
.bcount{ font-size:12.5px; color:var(--mut); background:var(--card); border:1px solid var(--line);
  padding:7px 12px; border-radius:20px; white-space:nowrap; font-weight:600; }
.bcount b{ color:var(--cy); }
.bmode{ display:flex; gap:5px; background:var(--bg2); border:1px solid var(--line); border-radius:12px; padding:4px; }

/* -------- grade (árvore + leitor) -------- */
.bgrid{ display:grid; grid-template-columns:300px minmax(0,1fr); gap:14px; height:calc(100vh - 320px); min-height:430px; }
.bcard{ background:linear-gradient(180deg,var(--card),var(--card2)); border:1px solid var(--line);
  border-radius:16px; box-shadow:var(--shadow); overflow:hidden; display:flex; flex-direction:column; }
.btree h4{ font-size:11px; letter-spacing:1.2px; color:var(--dim); padding:12px 16px; border-bottom:1px solid var(--line); margin:0; font-weight:700; }
.tree{ flex:1; overflow:auto; padding:8px; }
.flabel{ display:flex; align-items:center; gap:7px; width:100%; text-align:left; cursor:pointer; border:0;
  background:transparent; color:var(--mut); font-size:13px; font-weight:600; padding:6px 8px; border-radius:8px; }
.flabel:hover{ background:var(--bg2); }
.flabel .ic{ font-size:12px; width:14px; text-align:center; }
.caret{ transition:transform .15s; display:inline-block; font-size:10px; color:var(--dim); width:12px; }
.folder.open > .fchildren{ display:block; }
.fchildren{ display:none; padding-left:13px; }
.folder.open > .flabel .caret{ transform:rotate(90deg); }
.file{ display:flex; align-items:center; gap:7px; width:100%; text-align:left; cursor:pointer; border:0;
  background:transparent; color:var(--txt); font-size:13px; padding:6px 8px; border-radius:8px; }
.file:hover{ background:var(--bg2); }
.file.on{ background:rgba(122,92,248,.12); color:var(--cy); font-weight:600; }
.file .ic{ font-size:12px; }
.tree .leaf{ margin-left:2px; }

.bmain{ position:relative; }
.bnote{ overflow-y:auto; padding:22px 26px; flex:1; height:100%; }
.bnote h1.rv-h,.bnote h2.rv-h,.bnote h3.rv-h,.bnote h4.rv-h,.bnote h5.rv-h,.bnote h6.rv-h{ margin:14px 0 8px; line-height:1.25; }
.bnote h1.rv-h{ font-size:23px; color:var(--txt); }
.bnote h2.rv-h{ font-size:19px; color:var(--txt); border-bottom:1px solid var(--line); padding-bottom:5px; }
.bnote h3.rv-h{ font-size:16.5px; color:var(--cy); }
.bnote h4.rv-h{ font-size:14.5px; color:var(--mut); }
.bnote p{ margin:8px 0; line-height:1.7; font-size:14.5px; color:var(--txt); }
.bnote ul,.bnote ol{ margin:8px 0 8px 20px; }
.bnote li{ line-height:1.7; font-size:14.5px; margin:3px 0; }
.bnote blockquote{ border-left:3px solid var(--cy); background:rgba(10,157,136,.07); padding:8px 13px;
  border-radius:0 10px 10px 0; color:var(--mut); margin:10px 0; font-size:14px; }
.bnote code{ background:var(--bg2); border:1px solid var(--line); padding:1px 5px; border-radius:6px;
  font-family:'JetBrains Mono',Consolas,monospace; font-size:12.5px; color:var(--cy); }
.bnote pre{ background:#101c31; color:#dfe9fb; padding:13px 15px; border-radius:10px; overflow:auto;
  font-family:'JetBrains Mono',Consolas,monospace; font-size:12.5px; margin:10px 0; line-height:1.55; }
.bnote pre code{ background:transparent; border:0; padding:0; color:inherit; }
.bnote hr{ border:0; border-top:1px solid var(--line); margin:16px 0; }
.bnote table{ border-collapse:collapse; width:100%; margin:10px 0; font-size:13px; }
.bnote th,.bnote td{ border:1px solid var(--line); padding:7px 10px; text-align:left; }
.bnote th{ background:var(--bg2); color:var(--mut); font-weight:700; }
.wl{ color:var(--cy); font-weight:600; cursor:pointer; border-bottom:1px dashed rgba(10,157,136,.5); }
.wl:hover{ background:rgba(10,157,136,.12); border-radius:4px; }
.bnote a{ color:var(--cy); text-decoration:underline; }
.note-head{ padding-bottom:13px; border-bottom:1px solid var(--line); margin-bottom:4px; }
.note-head .nut{ font-size:11px; letter-spacing:1px; color:var(--dim); text-transform:uppercase; font-weight:600; }
.note-head h1{ margin:5px 0 8px; font-size:25px; color:var(--txt); letter-spacing:-.2px; }
.note-head p.ntx{ color:var(--mut); font-size:13px; margin:0; }
.note-tags{ display:flex; gap:6px; flex-wrap:wrap; margin-top:12px; }
.note-tags span{ font-size:11px; padding:3px 10px; border-radius:999px; border:1px solid rgba(122,92,248,.32);
  color:#5a3fd4; background:rgba(122,92,248,.08); font-weight:600; }
.note-blk{ margin-top:20px; padding-top:13px; border-top:1px solid var(--line); }
.note-blk h5{ font-size:11px; letter-spacing:1px; color:var(--dim); margin-bottom:9px; font-weight:700; text-transform:uppercase; }
.note-back{ display:flex; gap:8px; flex-wrap:wrap; }
.note-back button{ cursor:pointer; background:var(--card2); border:1px solid var(--line); color:var(--cy);
  font-size:12.5px; padding:6px 12px; border-radius:9px; font-weight:600; }
.note-back button:hover{ border-color:var(--cy); background:rgba(10,157,136,.07); }
.bempty-note{ display:flex; align-items:center; justify-content:center; height:100%; color:var(--dim);
  padding:40px; text-align:center; font-size:14.5px; line-height:1.7; }

/* -------- grafo -------- */
.bgraphwrap{ position:relative; height:calc(100vh - 300px); min-height:430px; background:
  radial-gradient(600px 340px at 30% 20%, rgba(122,92,248,.08), transparent 60%),
  var(--card); border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:var(--shadow); }
#brainGraph{ position:absolute; inset:0; width:100%; height:100%; cursor:grab; }
#brainGraph.dragging{ cursor:grabbing; }
.bempty{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--dim); }
.bhint{ font-size:12px; color:var(--dim); text-align:center; margin-top:9px; }

@media (max-width:760px){
  .bgrid{ grid-template-columns:1fr; height:auto; }
  .btree{ max-height:240px; }
  .bmain{ min-height:380px; }
  .bnote{ padding:16px 16px 40px; }
  .bgraphwrap{ height:320px; }
}