:root{
  --bg: #0b0f0d;
  --panel: #0f1512;
  --panel-2: #121a16;
  --line: #1e2b24;
  --text: #c9e8d4;
  --text-dim: #6f8c7c;
  --accent: #35d68a;
  --accent-2: #ffb454;
  --error: #ff6b6b;
  --mono: "JetBrains Mono","Fira Code",Menlo,Consolas,"Courier New",monospace;
}
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--mono); font-size:14px;
  display:flex; flex-direction:column; height:100vh; overflow:hidden;
}
header{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 16px; border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,#101815,#0c1210);
  flex-shrink:0;
}
.brand{display:flex; align-items:center; gap:10px;}
.brand .dot{width:9px;height:9px;border-radius:50%;background:var(--accent); box-shadow:0 0 8px var(--accent);}
.brand h1{font-size:13px; margin:0; letter-spacing:.04em; color:var(--text); font-weight:600;}
.brand small{display:block; color:var(--text-dim); font-size:11px; margin-top:1px;}
.badges{display:flex; gap:8px; font-size:11px; color:var(--text-dim);}
.badges span{border:1px solid var(--line); padding:3px 8px; border-radius:20px;}
.badges b{color:var(--accent-2);}

.layout{flex:1; display:flex; min-height:0;}

/* Sidebar */
aside{
  width:320px; min-width:320px; border-right:1px solid var(--line);
  background:var(--panel); display:flex; flex-direction:column; min-height:0;
}
.side-tabs{display:flex; border-bottom:1px solid var(--line);}
.side-tabs button{
  flex:1; background:none; border:none; color:var(--text-dim); font-family:var(--mono);
  padding:10px 6px; cursor:pointer; font-size:11.5px; letter-spacing:.03em; border-bottom:2px solid transparent;
}
.side-tabs button.active{color:var(--accent); border-bottom-color:var(--accent);}
.side-search{padding:10px; border-bottom:1px solid var(--line);}
.side-search input{
  width:100%; background:var(--bg); border:1px solid var(--line); color:var(--text);
  padding:8px 10px; font-family:var(--mono); font-size:12.5px; border-radius:6px; outline:none;
}
.side-search input:focus{border-color:var(--accent);}
.side-list{flex:1; overflow-y:auto; padding:6px;}
.side-item{
  padding:7px 10px; border-radius:5px; cursor:pointer; font-size:12.5px; color:var(--text);
  display:flex; justify-content:space-between; gap:6px;
}
.side-item:hover{background:var(--panel-2);}
.side-item .tag{color:var(--text-dim); font-size:10px; border:1px solid var(--line); padding:0 5px; border-radius:8px; align-self:center;}
.side-tree{padding:4px 2px;}
.tnode{margin-left:14px;}
.tnode-label{
  padding:5px 6px; cursor:pointer; border-radius:4px; font-size:12.5px; display:flex; align-items:center; gap:6px;
}
.tnode-label:hover{background:var(--panel-2);}
.tnode-label.leaf{color:var(--accent-2);}
.tnode-label .arrow{width:10px; display:inline-block; color:var(--text-dim); transition:transform .12s;}
.tnode-label .arrow.open{transform:rotate(90deg);}
.tnode-children{display:none; border-left:1px dashed var(--line); margin-left:4px;}
.tnode-children.open{display:block;}

.side-footer{padding:8px 12px; border-top:1px solid var(--line); font-size:10.5px; color:var(--text-dim); line-height:1.5;}

/* Terminal */
main{flex:1; display:flex; flex-direction:column; min-width:0;}
#screen{
  flex:1; overflow-y:auto; padding:16px 18px; white-space:pre-wrap; word-break:break-word;
  line-height:1.55;
}
.line{margin:0 0 2px 0;}
.prompt-echo{color:var(--text);}
.prompt-tag{color:var(--accent);}
.out-dim{color:var(--text-dim);}
.out-accent{color:var(--accent-2);}
.out-error{color:var(--error);}
.out-heading{color:#eaf7ef; font-weight:700;}
.kv{color:var(--text);}
.kv b{color:#eaf7ef;}
.rule{color:var(--line);}

#inputline{
  display:flex; align-items:center; gap:8px; padding:10px 18px 16px 18px; border-top:1px solid var(--line);
  flex-shrink:0; background:linear-gradient(0deg,#0d1310,transparent);
}
#promptLabel{color:var(--accent); white-space:pre; font-weight:600;}
#cmdInput{
  flex:1; background:none; border:none; outline:none; color:var(--text); font-family:var(--mono); font-size:14px;
}
#cmdInput::placeholder{color:var(--text-dim);}
.caret-hint{color:var(--text-dim); font-size:11px;}

::-webkit-scrollbar{width:10px; height:10px;}
::-webkit-scrollbar-thumb{background:#1c2a22; border-radius:6px;}
::-webkit-scrollbar-track{background:transparent;}

.doc-card{border:1px solid var(--line); border-radius:8px; padding:10px 12px; margin:6px 0 10px; background:var(--panel-2);}
.doc-card h3{margin:0 0 6px; font-size:13px; color:var(--accent-2);}
.param-row{margin:5px 0; padding-left:2px;}
.param-name{color:var(--accent); font-weight:700;}
.param-meta{color:var(--text-dim); font-size:11.5px;}

@media (max-width: 860px){
  aside{position:fixed; left:0; top:49px; bottom:0; z-index:5; transform:translateX(-100%); transition:transform .15s;}
  aside.open{transform:translateX(0);}
  #menuBtn{display:inline-block;}
}
#menuBtn{display:none; background:none; border:1px solid var(--line); color:var(--text); border-radius:6px; padding:4px 8px; cursor:pointer;}

.toolbtn{
  font-family:var(--mono); font-size:11px; background:var(--panel-2); color:var(--text);
  border:1px solid var(--line); border-radius:6px; padding:5px 10px; cursor:pointer;
  text-decoration:none; display:inline-flex; align-items:center; gap:4px; white-space:nowrap;
}
.toolbtn:hover{border-color:var(--accent); color:var(--accent);}
.toolbtn-danger:hover{border-color:var(--error); color:var(--error);}
.toolbtn-link{background:var(--accent); color:#04140c; border-color:var(--accent); font-weight:700;}
.toolbtn-link:hover{opacity:.85; color:#04140c;}
