+
-/* ── Sidebar ───────────────────────────────────────────── */
-#sidebar{
- width:260px;min-width:260px;
- background:var(--bg-sidebar);
- border-right:1px solid var(--border);
- display:flex;flex-direction:column;
- overflow:hidden;
-}
-.sidebar-head{
- padding:12px;
- border-bottom:1px solid var(--border-faint);
-}
-#new-chat-btn{
- width:100%;
- background:var(--accent);
- color:#fff;
- border:none;
- border-radius:var(--radius);
- padding:8px 12px;
- font-size:13px;
- font-weight:600;
- cursor:pointer;
- transition:background var(--trans);
-}
-#new-chat-btn:hover{background:var(--accent-dim);}
-#chat-list{
- flex:1;overflow-y:auto;padding:6px;
-}
-#chat-list::-webkit-scrollbar{width:4px;}
-#chat-list::-webkit-scrollbar-track{background:transparent;}
-#chat-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px;}
-.chat-item{
- display:flex;align-items:center;gap:8px;
- padding:8px 10px;border-radius:var(--radius);
- cursor:pointer;transition:background var(--trans);
- font-size:13px;color:var(--text-m);
- white-space:nowrap;overflow:hidden;
-}
-.chat-item:hover{background:var(--bg-hover);}
-.chat-item.active{background:var(--bg-input);color:var(--text);}
-.chat-icon{font-size:12px;flex-shrink:0;}
-.chat-title{flex:1;overflow:hidden;text-overflow:ellipsis;}
-.chat-del{
- background:none;border:none;color:var(--text-d);
- font-size:13px;cursor:pointer;padding:0 2px;
- opacity:0;transition:opacity var(--trans),color var(--trans);
- flex-shrink:0;
-}
-.chat-item:hover .chat-del{opacity:1;}
-.chat-del:hover{color:var(--red);}
-.sidebar-footer{
- padding:10px 12px;
- border-top:1px solid var(--border-faint);
-}
-.status-row{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-d);}
-#status-dot{width:7px;height:7px;border-radius:50%;background:var(--red);flex-shrink:0;}
-#status-dot.online{background:var(--green);}
-
-/* ── Main area ─────────────────────────────────────────── */
-#main{
- flex:1;display:flex;flex-direction:column;overflow:hidden;
- position:relative;
-}
+
+
+
+
+
+
+
+
+
+
+
+
+
-/* System prompt panel */
-#sys-panel{
- border-bottom:1px solid var(--border);
- background:var(--bg-panel);
- padding:10px 16px;
- display:none;
- flex-direction:column;
- gap:7px;
-}
-#sys-panel.open{display:flex;}
-#sys-panel .sys-row{
- display:flex;align-items:flex-start;gap:10px;
-}
-#sys-panel label{font-size:12px;color:var(--text-d);padding-top:6px;white-space:nowrap;}
-#sys-ta{
- flex:1;background:var(--bg-input);
- border:1px solid var(--border);
- color:var(--text);font-size:13px;
- border-radius:var(--radius);padding:6px 10px;
- resize:none;height:54px;font-family:inherit;
- line-height:1.5;
+
+
+
+
+
+
+
+
+
+
+
+
+ Hello
+ What can I help you with today?
+
+
+
+
+
+
+
Help me write a professional email to reschedule a meeting
+
+
+
+
Explain quantum computing in simple terms
+
+
+
+
Write a Python function to find prime numbers
+
+
+
+
Plan a 7-day trip to Tokyo, Japan
+
+
+
+
+
+
+
+ is text-only. It cannot process images. Try a vision model like
+
+
+ llava.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Responses are generated locally. May contain inaccuracies.
+