@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap');
:root{font-family:'Cairo',Tahoma,sans-serif;color:#24212b;background:#faf9fc;font-synthesis:none;--bg:#faf9fc;--panel:#fff;--text:#24212b;--muted:#85808e;--line:#ebe8f0;--purple:#7652d6;--purple2:#eee8fc;--user:#f1edfa;--shadow:0 18px 60px #21143a12}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at 50% 0%,#eee7ff 0,transparent 52%),var(--bg)}.auth-card{width:min(100%,420px);background:var(--panel);border:1px solid var(--line);border-radius:26px;padding:38px;box-shadow:var(--shadow);text-align:center}.brand-mark,.welcome-logo{display:grid;place-items:center;margin:auto;width:58px;height:58px;border-radius:19px;background:linear-gradient(145deg,#9475eb,#6540c7);color:white;font-size:32px;font-weight:800;box-shadow:0 9px 24px #7652d644}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--purple);font-weight:800;margin-top:18px}.auth-card h1{font-size:25px;margin:8px 0}.auth-card h1 span{color:var(--purple)}.muted,.tiny{color:var(--muted)}.auth-card form{text-align:right;margin-top:28px}.auth-card label{display:block;font-size:13px;font-weight:700;margin:14px 0 6px}.auth-card input{width:100%;border:1px solid var(--line);border-radius:13px;padding:13px;background:var(--bg);outline:none;direction:ltr;text-align:left}.auth-card input:focus,textarea:focus{border-color:var(--purple)}.primary{border:0;background:var(--purple);color:white;border-radius:13px;padding:13px 18px;font-weight:700;margin-top:22px}.wide{width:100%}.text-button{border:0;background:none;color:var(--purple);margin-top:15px}.status-line{font-size:12px;color:#b34b56;min-height:22px;margin-top:10px}.tiny{font-size:10px;margin-top:20px}
.app{height:100dvh;display:flex;overflow:hidden}.sidebar{width:285px;flex:none;background:var(--panel);border-left:1px solid var(--line);padding:20px 15px;display:flex;flex-direction:column;z-index:5}.side-brand{display:flex;align-items:center;gap:11px;padding:0 7px 22px}.brand-mark.small{width:38px;height:38px;border-radius:12px;font-size:22px;margin:0}.side-brand b{display:block;font-size:17px;letter-spacing:1px}.side-brand small{display:block;color:var(--muted);font-size:9px;letter-spacing:2px}.new-chat{border:1px solid #ded5f3;background:var(--purple2);color:var(--purple);border-radius:12px;padding:12px;font-weight:700;text-align:right}.side-label{font-size:11px;color:var(--muted);padding:25px 9px 10px}.chat-list{overflow:auto;flex:1}.chat-item{display:flex;align-items:center;gap:8px;width:100%;border:0;background:transparent;color:var(--text);text-align:right;padding:11px 10px;border-radius:10px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-item.active,.chat-item:hover{background:var(--purple2)}.side-bottom{border-top:1px solid var(--line);padding-top:14px}.connection{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px;padding:4px 8px 14px}.connection i,.online-dot{width:8px;height:8px;border-radius:50%;background:#35b77b;display:inline-block}.connection i.offline{background:#d89b3c}.profile{display:flex;align-items:center;gap:10px;padding:8px 4px}.avatar{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:var(--purple2);color:var(--purple);font-weight:800}.profile-info{flex:1;min-width:0}.profile-info b,.profile-info small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-info b{font-size:11px}.profile-info small{font-size:10px;color:var(--muted)}.icon-btn{border:0;background:transparent;color:var(--muted);font-size:19px;width:36px;height:36px;border-radius:10px}.icon-btn:hover{background:var(--purple2);color:var(--purple)}
.main{flex:1;min-width:0;display:flex;flex-direction:column;position:relative}.topbar{height:66px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:var(--panel)}.top-title{display:flex;align-items:center;gap:9px}.top-title b{font-size:14px}.top-title small{font-size:10px;color:var(--muted);border-right:1px solid var(--line);padding-right:10px}.top-actions{display:flex;gap:6px}.messages{flex:1;overflow:auto;padding:32px 20px 22px;scroll-behavior:smooth}.welcome{max-width:720px;margin:8vh auto 0;text-align:center}.welcome-logo{width:64px;height:64px;font-size:34px;border-radius:22px}.welcome h1{font-size:27px;margin:22px 0 5px}.welcome p{color:var(--muted);font-size:14px}.suggestions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:28px}.suggestions button{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:12px 15px;color:var(--text);font-size:12px}.suggestions span{color:var(--purple);padding-right:9px}
.message{max-width:850px;margin:0 auto 22px;display:flex;gap:12px;align-items:flex-start}.message.user{flex-direction:row-reverse}.msg-avatar{width:31px;height:31px;flex:none;border-radius:11px;background:var(--purple2);color:var(--purple);display:grid;place-items:center;font-weight:800;font-size:13px}.message.user .msg-avatar{background:#e8e4ed;color:#655d70}.bubble{max-width:min(78%,720px);padding:13px 17px;border-radius:17px;background:var(--panel);border:1px solid var(--line);font-size:14px;line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere}.message.user .bubble{background:var(--user);border-color:#e8e0f7}.bubble-actions{display:flex;gap:8px;margin-top:7px}.bubble-actions button{font-size:11px;color:var(--muted);border:0;background:none;padding:3px}.typing{color:var(--muted);font-size:12px}
.composer-wrap{padding:12px 20px 17px;background:linear-gradient(transparent,var(--bg) 22%)}.composer{max-width:850px;margin:auto;background:var(--panel);border:1px solid #ded9e8;border-radius:19px;box-shadow:0 7px 25px #27164a0d;padding:12px 14px 9px}.composer textarea{width:100%;resize:none;border:0;outline:0;background:transparent;color:var(--text);padding:5px 3px;max-height:150px;min-height:34px;font-size:14px}.composer-actions{display:flex;justify-content:space-between;align-items:center}.left-actions{display:flex;align-items:center;gap:9px}.round-btn.active{background:var(--purple);color:white}.round-btn{border:0;background:var(--purple2);color:var(--purple);border-radius:10px;width:35px;height:35px}.round-btn.active{background:var(--purple);color:white}.left-actions span{font-size:10px;color:var(--muted)}.send-btn{border:0;background:var(--purple);color:white;border-radius:11px;width:37px;height:37px;font-size:22px}.send-btn:disabled{opacity:.45}.disclaimer{text-align:center;color:var(--muted);font-size:9px;margin-top:8px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:#272330;color:white;padding:10px 17px;border-radius:12px;font-size:12px;opacity:0;pointer-events:none;transition:.2s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}.mobile-only{display:none}
body.dark{--bg:#15131b;--panel:#201d28;--text:#f2eff7;--muted:#a29aaa;--line:#34303d;--purple:#a58ae9;--purple2:#302742;--user:#30283e;--shadow:0 18px 60px #0004}
@media(max-width:760px){.sidebar{position:fixed;right:0;top:0;bottom:0;transform:translateX(105%);transition:transform .22s;box-shadow:var(--shadow);width:min(84vw,310px)}.sidebar.open{transform:translateX(0)}.mobile-only{display:inline-grid;place-items:center}.topbar{height:58px;padding:0 12px}.top-title{margin-right:8px;flex:1}.top-title small{display:none}.messages{padding:24px 12px}.welcome{margin-top:9vh}.welcome h1{font-size:22px}.suggestions{gap:7px}.suggestions button{padding:10px;font-size:11px}.composer-wrap{padding:8px 10px 12px}.bubble{max-width:88%;font-size:13px}.auth-card{padding:28px 22px}}