* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: system-ui, sans-serif; background: #0f0f12; color: #e0e0e0; }
#app { display: flex; height: 100vh; }
#sidebar { width: 280px; background: #1c1c24; border-right: 1px solid #2a2a32; padding: 20px; display: flex; flex-direction: column; }
.logo { font-size: 22px; font-weight: 700; color: #5a7bff; margin-bottom: 20px; }
#chat-list { flex: 1; overflow-y: auto; }
.empty { color: #6a6a7a; }
#user-area { margin-top: 20px; border-top: 1px solid #2a2a32; padding-top: 12px; }
#user-area a { color: #5a7bff; text-decoration: none; }
#main { flex: 1; display: flex; flex-direction: column; }
#chat-header { padding: 16px 24px; border-bottom: 1px solid #2a2a32; display: flex; justify-content: space-between; }
#chat-title { font-weight: 600; }
#toggle-article { cursor: pointer; color: #6a6a7a; }
#chat-messages { flex: 1; overflow-y: auto; padding: 20px; }
#chat-input { display: flex; padding: 16px; border-top: 1px solid #2a2a32; }
#chat-input input { flex: 1; padding: 12px; border-radius: 8px; border: 1px solid #2a2a32; background: #1c1c24; color: #e0e0e0; }
#chat-input button { margin-left: 12px; padding: 12px 24px; background: #5a7bff; border: none; border-radius: 8px; color: white; font-weight: 600; cursor: pointer; }
.chat-item {
    padding: 10px 12px;
    border-radius: 8px;
    cursor: pointer;
    margin-bottom: 4px;
}
.chat-item:hover {
    background: #2a2a32;
}
#create-chat-btn {
    margin-top: 12px;
    background: transparent;
    color: #5a7bff;
    border: 1px dashed #2a2a32;
    padding: 10px;
    border-radius: 8px;
    width: 100%;
    cursor: pointer;
}