|
|
| *{box-sizing:border-box;margin:0;padding:0}
|
| :root{
|
| --bg:#040810;--bg2:#080f1a;--bg3:#0c1520;--bg4:#101c28;
|
| --border:#0f2030;--accent:#00d4cc;--purple:#7c3aed;--gold:#ffd700;
|
| --green:#00e87a;--red:#f43;--yellow:#fa0;
|
| --text:#c8e0ec;--text2:#4a6878;--text3:#1a2a38;
|
| }
|
| .vortex-shell{
|
| display:flex;flex-direction:column;height:100vh;width:100vw;
|
| background:var(--bg);color:var(--text);
|
| font-family:'SF Mono','Fira Code','Cascadia Code','Consolas',monospace;
|
| font-size:12px;overflow:hidden;
|
| }
|
| .v-bar{
|
| height:36px;background:var(--bg2);border-bottom:1px solid var(--border);
|
| display:flex;align-items:center;padding:0 10px;gap:8px;flex-shrink:0;
|
| }
|
| .v-dots{display:flex;gap:5px;align-items:center}
|
| .dot-r,.dot-y,.dot-g{width:11px;height:11px;border-radius:50%;flex-shrink:0}
|
| .dot-r{background:#ff5f57}.dot-y{background:#febc2e}.dot-g{background:#28c840}
|
| .v-title{font-size:11px;color:var(--text2);letter-spacing:1.5px;text-transform:uppercase;white-space:nowrap}
|
| .v-tabs{display:flex;gap:0;margin-left:auto}
|
| .v-tab{
|
| height:36px;padding:0 14px;background:transparent;border:none;border-bottom:2px solid transparent;
|
| color:var(--text2);font-size:11px;font-family:inherit;cursor:pointer;letter-spacing:.5px;
|
| text-transform:uppercase;transition:all .15s;
|
| }
|
| .v-tab:hover{color:var(--text);background:var(--bg3)}
|
| .v-tab.on{color:var(--accent);border-bottom-color:var(--accent);background:var(--bg3)}
|
| .v-hud{display:flex;gap:12px;margin-left:12px}
|
| .hud-item{font-size:10px;color:var(--text2)}
|
| .hud-item b{font-size:12px;margin-left:3px;font-variant-numeric:tabular-nums}
|
| .v-main{display:flex;flex:1;min-height:0;overflow:hidden}
|
| .v-center{flex:1;min-width:0;display:flex;flex-direction:column;position:relative}
|
| .v-canvas{display:block;width:100%;height:100%;cursor:crosshair;background:#020408}
|
| .v-code-panel{display:flex;flex-direction:column;height:100%;background:var(--bg)}
|
| .v-code-header{
|
| height:28px;background:var(--bg2);border-bottom:1px solid var(--border);
|
| display:flex;align-items:center;padding:0 12px;gap:8px;flex-shrink:0;
|
| }
|
| .v-code-header span:first-child{font-size:10px;color:var(--text2);text-transform:uppercase;letter-spacing:1.5px}
|
| .v-code-placeholder{
|
| flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
|
| gap:8px;color:var(--text2);
|
| }
|
| .v-quantum-metrics{
|
| height:32px;background:var(--bg2);border-top:1px solid var(--border);
|
| display:flex;align-items:center;padding:0 12px;gap:20px;flex-shrink:0;
|
| font-size:10px;color:var(--text2);
|
| }
|
| .v-quantum-metrics b{font-size:12px;font-variant-numeric:tabular-nums}
|
| .v-right{
|
| width:260px;flex-shrink:0;background:var(--bg2);border-left:1px solid var(--border);
|
| display:flex;flex-direction:column;overflow:hidden;
|
| }
|
| .v-section-hdr{
|
| height:24px;padding:0 10px;font-size:9px;color:var(--text2);
|
| text-transform:uppercase;letter-spacing:1.5px;border-bottom:1px solid var(--border);
|
| display:flex;align-items:center;flex-shrink:0;background:var(--bg3);
|
| }
|
| .v-mini{width:100%;display:block;flex-shrink:0;border-bottom:1px solid var(--border)}
|
| .v-agents{padding:6px 8px;border-bottom:1px solid var(--border);flex-shrink:0}
|
| .v-agent-row{display:flex;align-items:center;gap:6px;padding:2px 0}
|
| .v-agent-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
|
| .v-agent-name{font-size:10px;color:var(--text);font-weight:600;width:52px}
|
| .v-agent-role{font-size:9px;color:var(--text2)}
|
| .v-dialogue{
|
| height:90px;overflow-y:auto;padding:6px 8px;border-bottom:1px solid var(--border);flex-shrink:0;
|
| }
|
| .v-dialogue::-webkit-scrollbar{width:2px}
|
| .v-dialogue::-webkit-scrollbar-thumb{background:var(--border)}
|
| .v-line{font-size:10px;line-height:1.45;margin-bottom:3px;color:var(--text2);padding:2px 4px;border-radius:2px}
|
| .v-line.good{color:var(--green);background:rgba(0,232,122,.04);border-left:2px solid var(--green)}
|
| .v-line.bad{color:var(--red);background:rgba(255,68,51,.05);border-left:2px solid var(--red)}
|
| .v-api-input{
|
| width:100%;background:var(--bg3);border:none;border-bottom:1px solid var(--border);
|
| color:var(--text);padding:5px 8px;font-size:10px;font-family:inherit;outline:none;flex-shrink:0;
|
| }
|
| .v-api-input::placeholder{color:var(--text3)}
|
| .v-chat{
|
| flex:1;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:6px;
|
| background:var(--bg);min-height:0;
|
| }
|
| .v-chat::-webkit-scrollbar{width:2px}
|
| .v-chat::-webkit-scrollbar-thumb{background:var(--border)}
|
| .v-chat-msg{font-size:11px;line-height:1.55;word-break:break-word}
|
| .v-chat-msg.bot{color:var(--text)}.v-chat-msg.user{color:var(--accent)}
|
| .v-chat-prefix{flex-shrink:0;color:var(--purple)}
|
| .v-chat-input-row{
|
| display:flex;gap:4px;padding:6px;background:var(--bg2);
|
| border-top:1px solid var(--border);flex-shrink:0;
|
| }
|
| .v-chat-input{
|
| flex:1;background:var(--bg3);border:1px solid var(--border);color:var(--text);
|
| padding:5px 7px;font-size:11px;font-family:inherit;border-radius:3px;outline:none;resize:none;
|
| }
|
| .v-chat-input:focus{border-color:var(--accent)}
|
| .v-send-btn{
|
| width:32px;background:var(--accent);border:none;color:#000;font-size:15px;
|
| font-weight:900;cursor:pointer;border-radius:3px;flex-shrink:0;
|
| }
|
| .v-send-btn:hover{opacity:.85}
|
| .v-status{
|
| height:22px;background:var(--bg2);border-top:1px solid var(--border);
|
| display:flex;align-items:center;padding:0 10px;gap:12px;flex-shrink:0;
|
| font-size:9px;color:var(--text2);
|
| }
|
|
|
