body{font-family:Arial,sans-serif;background:linear-gradient(135deg,#081224,#13233f);min-height:100vh;display:flex;justify-content:center;align-items:center;color:#fff}.container{width:88%;max-width:1300px;height:82vh;padding:30px;border-radius:28px;background:#ffffff14;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 25px 60px #00000059;display:flex;flex-direction:column}h1{text-align:center;margin-bottom:25px;font-size:38px}.buttons{display:flex;gap:15px;margin-bottom:25px;background:#ffffff0f;padding:10px;border-radius:18px}.buttons button{flex:1;padding:16px;border:none;border-radius:14px;background:transparent;color:#fff;font-size:16px;cursor:pointer;transition:.3s}.buttons button:hover{background:#ffffff1a}.active{background:#2563eb!important;font-weight:700}.chat-layout{flex:1;display:flex;gap:25px;min-height:0}.left{flex:2;background:#ffffff0f;border-radius:20px;padding:25px;overflow-y:auto}.left h2{margin-bottom:20px}.right{flex:1;background:#ffffff0f;border-radius:20px;padding:25px;display:flex;flex-direction:column}.right h2{margin-bottom:20px}textarea{flex:1;width:100%;border:none;outline:none;resize:none;border-radius:15px;padding:18px;font-size:16px;margin-bottom:20px}.send-btn{padding:15px;border:none;border-radius:14px;background:#2563eb;color:#fff;font-size:16px;cursor:pointer;transition:.3s}.send-btn:hover{background:#1d4ed8}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background:#0f172a}.app{height:100vh;display:flex;justify-content:center;align-items:center}.chat-container{width:900px;height:90vh;background:#111827;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px #00000073}.header{padding:20px;background:#1f2937;border-bottom:1px solid #374151;text-align:center}.header h2{color:#fff;font-size:18px}.buttons{display:flex;gap:10px;padding:15px;background:#111827;border-bottom:1px solid #374151}.buttons button{flex:1;padding:12px;border:none;border-radius:12px;background:#1f2937;color:#fff;cursor:pointer;transition:.3s;font-size:14px;white-space:nowrap}.buttons button:hover{background:#374151}.active{background:#2563eb!important}.chat-box{flex:1;padding:25px;overflow-y:auto;display:flex;flex-direction:column;gap:18px;background:#0b1220}.empty-state{display:flex;flex-direction:column;align-items:center;gap:24px;margin-top:60px}.welcome{color:#94a3b8;text-align:center;font-size:20px}.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:640px}.chip{padding:10px 16px;background:#1e293b;border:1px solid #334155;border-radius:999px;color:#94a3b8;font-size:13px;cursor:pointer;transition:.2s;text-align:left}.chip:hover{background:#2563eb;border-color:#2563eb;color:#fff}.message{max-width:70%;padding:15px 20px;border-radius:18px;line-height:1.6;font-size:15px;word-break:break-word}.user{align-self:flex-end;background:#2563eb;color:#fff;border-bottom-right-radius:5px}.bot{align-self:flex-start;background:#1e293b;color:#fff;border-bottom-left-radius:5px}.typing{color:#64748b;font-style:italic}.input-area{display:flex;gap:15px;padding:20px;background:#111827;border-top:1px solid #374151}.input-area textarea{flex:1;height:55px;resize:none;border:none;outline:none;border-radius:14px;padding:15px;font-size:15px;background:#1e293b;color:#fff}.input-area button{width:120px;border:none;border-radius:14px;background:#2563eb;color:#fff;font-size:16px;cursor:pointer;transition:.3s;flex-shrink:0}.input-area button:hover{background:#1d4ed8}@media (max-width: 768px){.app{align-items:stretch}.chat-container{width:100%;height:100vh;border-radius:0;box-shadow:none}.chat-box{padding:16px;gap:14px}.empty-state{margin-top:40px;gap:18px}.welcome{font-size:17px}.chips{max-width:100%}.message{max-width:85%;font-size:14px;padding:12px 16px}.input-area{padding:12px;gap:10px}.input-area button{width:80px;font-size:14px}}@media (max-width: 480px){.header{padding:14px}.header h2{font-size:16px}.buttons{padding:10px;gap:8px}.buttons button{padding:10px 6px;font-size:12px;border-radius:10px}.chat-box{padding:12px;gap:12px}.empty-state{margin-top:24px;gap:14px}.welcome{font-size:15px;padding:0 10px}.chip{font-size:12px;padding:8px 14px}.message{max-width:90%;font-size:14px;padding:10px 14px}.input-area{padding:10px;gap:8px}.input-area textarea{font-size:14px;padding:12px;height:48px}.input-area button{width:64px;font-size:13px;border-radius:12px}}
