* { margin:0; padding:0; box-sizing:border-box; }
:root { --g:#00ff41; --gd:#009922; --gg:rgba(0,255,65,0.3); --bg:#000; --bp:rgba(0,0,0,0.85); --bc:rgba(0,12,0,0.9); --bd:rgba(0,255,65,0.3); --f:'Courier New',monospace; }
html,body { height:100%; background:var(--bg); color:var(--g); font-family:var(--f); overflow-x:hidden; }
a { color:var(--g); text-decoration:none; } a:hover { color:#fff; text-shadow:0 0 8px var(--g); }
::selection { background:var(--g); color:#000; }
::-webkit-scrollbar { width:6px; } ::-webkit-scrollbar-track { background:#000; } ::-webkit-scrollbar-thumb { background:var(--gd); border-radius:3px; }
#matrixCanvas { position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; opacity:0.4; }
#app { position:relative; z-index:1; min-height:100vh; display:flex; flex-direction:column; }
header { display:flex; justify-content:space-between; align-items:center; padding:12px 24px; background:var(--bp); border-bottom:1px solid var(--bd); position:sticky; top:0; z-index:50; }
.logo { font-size:20px; font-weight:bold; letter-spacing:3px; cursor:pointer; text-shadow:0 0 10px var(--g); text-transform:uppercase; } .logo:hover { color:#fff; }
.header-sep { margin:0 12px; opacity:0.4; } .breadcrumb { opacity:0.7; font-size:14px; } .breadcrumb span { cursor:pointer; } .breadcrumb span:hover { color:#fff; }
.header-stats { font-size:12px; opacity:0.5; }
main { flex:1; padding:24px; max-width:1200px; width:100%; margin:0 auto; }
footer { padding:16px 24px; border-top:1px solid var(--bd); background:var(--bp); text-align:center; font-size:12px; opacity:0.5; } .footer-sep { margin:0 8px; }
.loading { text-align:center; padding:60px; font-size:18px; animation:pulse 1.5s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.3} }
.repo-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:16px; }
.repo-card { background:var(--bc); border:1px solid var(--bd); border-radius:4px; padding:20px; cursor:pointer; transition:all 0.2s; }
.repo-card:hover { border-color:var(--g); box-shadow:0 0 20px var(--gg); transform:translateY(-2px); }
.repo-name { font-size:16px; font-weight:bold; margin-bottom:8px; } .repo-desc { font-size:12px; opacity:0.6; margin-bottom:12px; line-height:1.5; max-height:36px; overflow:hidden; }
.repo-meta { display:flex; gap:16px; font-size:11px; opacity:0.5; flex-wrap:wrap; }
.repo-lang { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:4px; vertical-align:middle; }
.repo-topics { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.repo-topic { font-size:10px; padding:2px 8px; border:1px solid var(--bd); border-radius:12px; opacity:0.6; }
.explorer { display:grid; grid-template-columns:280px 1fr; gap:0; min-height:70vh; border:1px solid var(--bd); border-radius:4px; overflow:hidden; }
.tree-panel { background:var(--bc); border-right:1px solid var(--bd); overflow-y:auto; padding:8px 0; max-height:80vh; }
.tree-item { padding:4px 12px; cursor:pointer; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:flex; align-items:center; gap:6px; }
.tree-item:hover { background:rgba(0,255,65,0.1); } .tree-item.active { background:rgba(0,255,65,0.15); color:#fff; }
.tree-item .icon { opacity:0.5; font-size:12px; } .tree-dir { font-weight:bold; }
.tree-indent { display:inline-block; width:16px; }
.viewer-panel { background:rgba(0,0,0,0.9); overflow:auto; max-height:80vh; }
.viewer-header { padding:12px 16px; border-bottom:1px solid var(--bd); font-size:13px; display:flex; justify-content:space-between; align-items:center; }
.viewer-content { padding:16px; font-size:13px; line-height:1.7; white-space:pre-wrap; word-break:break-word; }
.viewer-content code { color:var(--g); }
.viewer-empty { padding:60px; text-align:center; opacity:0.4; }
.repo-header { margin-bottom:24px; padding:20px; background:var(--bc); border:1px solid var(--bd); border-radius:4px; }
.repo-header h1 { font-size:22px; margin-bottom:8px; text-shadow:0 0 8px var(--gg); }
.repo-header p { font-size:13px; opacity:0.6; margin-bottom:12px; }
.repo-actions { display:flex; gap:12px; flex-wrap:wrap; }
.btn { padding:6px 16px; border:1px solid var(--g); background:transparent; color:var(--g); font-family:var(--f); font-size:12px; cursor:pointer; border-radius:4px; }
.btn:hover { background:var(--g); color:#000; }
.search-box { width:100%; padding:10px 16px; background:rgba(0,255,65,0.05); border:1px solid var(--bd); color:var(--g); font-family:var(--f); font-size:14px; margin-bottom:20px; border-radius:4px; outline:none; }
.search-box:focus { border-color:var(--g); box-shadow:0 0 10px var(--gg); }
.md-rendered { line-height:1.8; white-space:normal; }
.md-rendered h1,.md-rendered h2,.md-rendered h3,.md-rendered h4,.md-rendered h5,.md-rendered h6 { color:#fff; margin:20px 0 10px; text-shadow:0 0 6px var(--gg); }
.md-rendered h1 { font-size:1.8em; border-bottom:1px solid var(--bd); padding-bottom:8px; }
.md-rendered h2 { font-size:1.4em; border-bottom:1px solid var(--bd); padding-bottom:6px; }
.md-rendered h3 { font-size:1.2em; }
.md-rendered p { margin:8px 0; }
.md-rendered pre { background:rgba(0,255,65,0.05); padding:12px; border:1px solid var(--bd); border-radius:4px; overflow-x:auto; margin:12px 0; white-space:pre-wrap; word-break:break-word; }
.md-rendered code { color:var(--g); background:rgba(0,255,65,0.08); padding:2px 5px; border-radius:3px; font-size:0.9em; }
.md-rendered pre code { background:none; padding:0; border-radius:0; font-size:1em; }
.md-rendered a { text-decoration:underline; }
.md-rendered img { max-width:100%; border:1px solid var(--bd); margin:8px 0; border-radius:4px; }
.md-rendered table { border-collapse:collapse; width:100%; margin:12px 0; }
.md-rendered th { border:1px solid var(--bd); padding:8px 12px; font-size:12px; background:rgba(0,255,65,0.08); color:#fff; text-align:left; }
.md-rendered td { border:1px solid var(--bd); padding:6px 12px; font-size:12px; }
.md-rendered ul,.md-rendered ol { margin:8px 0; padding-left:24px; }
.md-rendered li { margin:4px 0; }
.md-rendered blockquote { border-left:3px solid var(--g); margin:12px 0; padding:8px 16px; background:rgba(0,255,65,0.03); opacity:0.85; }
.md-rendered hr { border:none; border-top:1px solid var(--bd); margin:16px 0; }
.md-rendered input[type="checkbox"] { margin-right:6px; accent-color:var(--g); }
.md-rendered del { opacity:0.5; }
/* Terminal */
.chat-bar { background:var(--bp); border-bottom:1px solid var(--bd); position:sticky; top:44px; z-index:49; }
.chat-toggle { display:flex; align-items:center; gap:10px; padding:8px 24px; cursor:pointer; font-size:13px; }
.chat-toggle:hover { background:rgba(0,255,65,0.05); }
.chat-toggle-icon { font-size:10px; opacity:0.6; }
.chat-toggle-hint { opacity:0.3; font-size:11px; margin-left:auto; }
.chat-panel { display:none; flex-direction:column; max-height:55vh; border-top:1px solid var(--bd); background:#000; }
.term-output { flex:1; overflow-y:auto; padding:12px 16px; min-height:120px; max-height:42vh; font-size:13px; line-height:1.7; }
.term-line { white-space:pre-wrap; word-break:break-word; animation:termIn .15s ease; }
@keyframes termIn { from{opacity:0} to{opacity:1} }
.term-system { color:var(--g); opacity:0.7; }
.term-green { color:var(--g); }
.term-dim { color:#888; opacity:0.6; }
.term-input { color:#0f0; opacity:0.8; }
.term-red { color:#f44; }
.term-yellow { color:#ffcc00; }
.term-default { color:var(--g); }
.term-input-row { display:flex; align-items:center; gap:8px; padding:8px 16px; border-top:1px solid var(--bd); background:rgba(0,12,0,0.95); }
.term-prompt { color:var(--g); font-size:13px; white-space:nowrap; opacity:0.8; }
.term-input { flex:1; background:transparent; border:none; color:var(--g); font-family:var(--f); font-size:13px; outline:none; caret-color:var(--g); }
.term-input::placeholder { color:rgba(0,255,65,0.2); }
@media(max-width:768px) { .explorer { grid-template-columns:1fr; } .tree-panel { max-height:30vh; } .repo-grid { grid-template-columns:1fr; } main { padding:12px; } .term-output { padding:8px 10px; } .term-input-row { padding:6px 10px; } }