*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f172a;--card:#ffffff0d;--primary:#6366f1;--primary-hover:#4f46e5;--text:#e2e8f0;--subtext:#94a3b8;--border:#ffffff1a}body{background:var(--bg);color:var(--text);justify-content:center;align-items:center;min-height:100vh;font-family:Inter,sans-serif;display:flex}.container{width:100%;max-width:500px;padding:20px}.card{background:var(--card);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:16px;padding:20px}h2{margin-bottom:15px;font-weight:600}.chat-box{height:300px;margin-bottom:15px;padding-right:5px;overflow-y:auto}.message{background:#ffffff14;border-radius:10px;margin-bottom:8px;padding:8px 12px;font-size:14px}.input-row{gap:10px;display:flex}input{border:1px solid var(--border);color:var(--text);background:0 0;border-radius:10px;outline:none;flex:1;padding:10px}input:focus{border-color:var(--primary)}button{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:10px 16px;transition:all .2s}button:hover{background:var(--primary-hover)}.chat-box::-webkit-scrollbar{width:5px}.chat-box::-webkit-scrollbar-thumb{background:var(--primary);border-radius:10px}.message{flex-direction:column;max-width:70%;display:flex}.message.self{color:#fff;background:#6366f1;align-self:flex-end}.message.other{background:#ffffff14;align-self:flex-start}.message small{opacity:.7;margin-top:4px;font-size:10px}