@font-face{font-family:EgytagCairo;src:url('/fonts/cairo-arabic-variable.woff2') format('woff2');font-style:normal;font-weight:400 900;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF}@font-face{font-family:EgytagCairo;src:url('/fonts/cairo-latin-variable.woff2') format('woff2');font-style:normal;font-weight:400 900;unicode-range:U+0000-024F}
:root{color-scheme:dark;--bg:#14171b;--base:#1c2025;--panel:#20242b;--panel-2:#262b33;--line:#343a43;--text:#f0f2f4;--muted:#929aa5;--accent:#d0ddf9;--success:#65daa9;--danger:#ff858b;font-family:EgytagCairo,'Segoe UI',Tahoma,Arial,sans-serif;font-size:14px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #a5c3ff;outline-offset:2px}button:disabled{opacity:.45;cursor:default}a{color:inherit;text-decoration:none}.muted{color:var(--muted)}.shell{display:flex;flex-direction:column;min-height:100dvh;max-height:100dvh;overflow:hidden}
.topbar{height:71px;flex:none;background:#1f2329;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:25px;padding:0 26px}.brand{display:flex;align-items:center;gap:12px;min-width:230px}.brand-icon{width:39px;height:39px;display:grid;place-items:center;border:1px solid #747e8d;border-radius:12px;font-size:27px;color:white;background:#353b45}.brand strong{font-size:19px;letter-spacing:-.55px}.brand strong em{font-style:normal;color:#b2c5df}.brand small{display:block;font-size:10px;letter-spacing:.4px;color:var(--muted);margin-top:-5px}.global-state{display:flex;align-items:center;gap:9px;color:#bdc4cd;font-size:12px}.live-dot,.small-live{width:8px;height:8px;border-radius:50%;background:var(--success);display:inline-block;box-shadow:0 0 0 4px rgba(101,218,169,.07)}.top-actions{margin-inline-start:auto;display:flex;gap:13px;align-items:center}.site-link{color:var(--muted);font-size:12px}.site-link:hover{color:white}.icon-button,.square{border:1px solid var(--line);background:var(--panel-2);color:var(--text);border-radius:10px;width:34px;height:34px;font-size:20px}.user-pill{color:#e8edf2;border:1px solid #49515e;background:#303640;padding:7px 13px;border-radius:9px;font-size:12px}.workspace{display:grid;grid-template-columns:minmax(228px,260px) minmax(0,1fr) minmax(210px,245px);flex:1;min-height:0;direction:rtl}.rooms-panel,.users-panel{background:var(--base);overflow-y:auto;min-height:0;position:relative}.rooms-panel{border-left:1px solid var(--line);padding:20px 14px;display:flex;flex-direction:column}.users-panel{border-right:1px solid var(--line);padding:20px 15px;display:flex;flex-direction:column}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}.eyebrow{letter-spacing:2px;font-size:9px;font-weight:800;color:#8793a1}.panel-head h2{font-size:15px;line-height:1.4;margin:4px 0 0;font-weight:700}.square{font-size:23px}.room-search{height:40px;border:1px solid var(--line);background:var(--panel-2);border-radius:9px;display:flex;gap:6px;align-items:center;padding:0 11px;color:#929baa;margin-bottom:22px}.room-search input{background:transparent;border:0;outline:0;color:white;width:100%;font-size:12px;min-width:0}.room-search input::placeholder{color:#77808c}.room-search span{font-size:25px;line-height:1}.category-title{display:flex;align-items:center;justify-content:space-between;padding:0 10px;margin:5px 0 9px;color:#a3abb6;font-size:11px;font-weight:700}.category-mark{font-size:8px;letter-spacing:1px;color:#859aaa;border:1px solid #44505e;padding:2px 6px;border-radius:4px}.room-list{display:grid;gap:4px;margin-bottom:22px}.room-item{border:1px solid transparent;background:transparent;color:#c6cbd3;display:flex;align-items:center;gap:10px;width:100%;text-align:right;border-radius:10px;padding:11px 10px;min-height:50px}.room-item:hover{background:#282e37}.room-item.active{background:#303842;border-color:#515e6e;color:#fff}.room-item .hash{font-size:20px;color:#8291a2;width:24px;text-align:center;line-height:1}.room-item.active .hash{color:#d7e5fa}.room-item .room-details{flex:1;min-width:0}.room-item b{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-item small{font-size:10px;color:#818c99;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.live-count{display:flex;align-items:center;gap:6px;direction:ltr;font-size:10px;color:#9eafb8}.live-count:before{content:'';width:5px;height:5px;background:#63cba3;border-radius:50%}.sidebar-bottom{margin-top:auto;border-top:1px solid var(--line);padding:17px 10px 2px;display:flex;align-items:center;gap:9px;color:#b4bdc8;font-size:11px}.side-hint{margin-inline-start:auto;color:#6cae95;font-size:10px}
.chat-area{background:var(--panel);display:flex;flex-direction:column;min-width:0;min-height:0}.room-toolbar{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:15px;padding:0 23px}.room-meta{display:flex;align-items:center;gap:12px;min-width:0}.room-hash{background:#333c47;color:#cfe0ee;font-size:24px;width:43px;height:43px;display:grid;place-items:center;border-radius:12px}.room-meta h1{font-size:17px;margin:0;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-meta p{font-size:11px;color:#919ba7;margin:2px 0}.toolbar-actions{display:flex;align-items:center;gap:9px}.room-count{font-size:11px;color:#b9c5d1;margin:0 7px;white-space:nowrap}.room-count .live-dot{width:6px;height:6px;margin-left:8px}.text-button{background:transparent;border:1px solid #454c58;color:#c8d0da;padding:7px 10px;border-radius:8px;font-size:12px;white-space:nowrap}.text-button:hover{background:#333c46}.room-tabs{display:flex;align-items:center;gap:7px;min-height:46px;padding:7px 16px;border-bottom:1px solid var(--line);overflow:auto;scrollbar-width:thin}.room-tab{display:flex;align-items:center;gap:7px;background:#292f37;border:1px solid #343c46;color:#a6b1bd;border-radius:7px;padding:7px 12px;white-space:nowrap;font-size:11px}.room-tab.active{color:#fff;background:#36414d;border-color:#617084}.tab-unread{background:#7bc9a8;color:#10241e;padding:0px 5px;border-radius:9px;font-size:10px;font-weight:800}
.conversation{flex:1;overflow:auto;min-height:0;padding:22px 24px 14px;scroll-behavior:smooth}.loading-state{text-align:center;color:#a6b0bc;margin:55px auto;font-size:13px}.day-line{display:flex;align-items:center;gap:12px;margin:6px 0 20px;color:#73818f;font-size:10px}.day-line:before,.day-line:after{content:'';height:1px;background:#353d46;flex:1}.message{display:flex;gap:11px;align-items:start;margin:0 0 12px;min-width:0}.avatar{height:30px;width:30px;flex:none;background:#384553;color:#cadced;border-radius:9px;display:grid;place-items:center;font-size:12px;font-weight:800}.message-main{min-width:0;flex:1}.message-head{display:flex;gap:10px;align-items:baseline;margin-top:0}.message-name{font-size:12px;color:#add5ec;font-weight:700}.message:nth-of-type(5n) .message-name{color:#d9c3ef}.message:nth-of-type(3n) .message-name{color:#b3e7cf}.message-time{color:#73808d;font-size:10px;direction:ltr}.message-body{font-size:13px;line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere;color:#e1e5ec;margin-top:0}.message-body img{display:block;max-height:310px;max-width:min(410px,100%);border-radius:10px;border:1px solid var(--line);margin-top:6px;object-fit:contain}.message-body video{max-height:260px;max-width:min(430px,100%);border-radius:10px;display:block}.message-body audio{max-width:min(360px,100%);display:block;margin-top:6px}.message-body a{color:#c1d8f7;text-decoration:underline}.message-system{text-align:center;font-size:11px;color:#78bb9f;margin:10px 0}.typing{min-height:18px;padding:0 24px;color:#8e9aa7;font-size:10px}.composer{margin:0 19px 16px;background:#282e36;border:1px solid #47505b;border-radius:12px;overflow:hidden;flex:none}.composer-main textarea{width:100%;max-height:130px;min-height:58px;resize:vertical;border:0;outline:none;padding:14px 16px;background:transparent;color:#f1f4f8;font-size:13px}.composer-main textarea::placeholder{color:#778491}.composer-tools{border-top:1px solid #3b444d;display:flex;align-items:center;gap:12px;padding:7px 10px}.input-tools{display:flex;align-items:center;gap:5px}.input-tools button{background:none;border:0;color:#a9b7c7;font-size:22px;width:33px;height:32px;border-radius:7px}.input-tools button:hover,.input-tools button.recording{background:#455467;color:white}.composer-tip{color:#77818e;font-size:10px;margin-inline-start:auto}.send-button{border:0;background:#d7e3f1;color:#202934;border-radius:8px;font-weight:800;font-size:12px;padding:8px 15px;white-space:nowrap}.send-button:hover{background:#fff}
.users-header{margin-bottom:3px}.online-pill{padding:2px 9px;background:#2c443e;color:#8ce4b9;border-radius:6px;font-size:12px;font-weight:800}.users-note{font-size:10px;margin:5px 0 20px;color:#818a96}.users-list{display:grid;gap:5px}.user{display:flex;align-items:center;gap:11px;padding:9px 7px;border-radius:9px;color:#cbd4de;font-size:12px}.user:hover{background:#292f36}.user .avatar{width:32px;height:32px;font-size:12px}.user-info{min-width:0}.user-info b{font-weight:600;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.user-info small{color:#62bd98;font-size:10px}.users-bottom{margin-top:auto;border-top:1px solid var(--line);padding-top:17px;color:#7f8b97;font-size:10px;line-height:1.8}.users-bottom span{color:var(--success)}
.footer{height:41px;flex:none;border-top:1px solid var(--line);background:#1b1e23;padding:0 22px;display:flex;align-items:center;gap:22px;font-size:10px;color:#909baa;letter-spacing:.1px}.footer-version{margin-right:6px;background:#343c46;border-radius:4px;padding:2px 5px;font-size:8px;color:#bcc5cf}.view-switch{display:flex;align-items:center;gap:4px;margin-inline-start:auto;direction:ltr}.view-switch button{background:transparent;border:0;border-radius:5px;color:#9ca8b6;font-size:10px;padding:5px 8px}.view-switch button.selected{background:#38434f;color:white}
.call-area{border-bottom:1px solid #4a5563;background:#262d35;padding:12px 20px}.call-head{display:flex;justify-content:space-between;align-items:center}.call-head b{display:block;font-size:12px}.call-head span{display:block;font-size:10px}.danger-button{background:#593740;border:1px solid #875a65;color:#ffd7dc;padding:7px 12px;border-radius:7px}.videos{display:flex;gap:10px;overflow:auto;padding-top:10px}.videos video{background:#10161c;border-radius:10px;object-fit:cover;width:185px;height:130px}.videos .video-tile{position:relative}.videos .video-tile label{position:absolute;bottom:5px;right:8px;font-size:10px;background:#121820ab;padding:2px 6px;border-radius:4px}
body[data-view=modern] .message{margin-bottom:17px}body[data-view=modern] .message-body{background:#303842;padding:9px 12px;border-radius:10px;display:inline-block;max-width:94%;margin-top:5px}body[data-view=media] .conversation{background:#252c34}body[data-view=media] .call-area:not([hidden]) .videos video{width:245px;height:170px}
.overlay[hidden],.call-area[hidden]{display:none}.overlay{position:fixed;inset:0;background:#080a0dbd;z-index:30;display:grid;place-items:center;padding:18px}.dialog{position:relative;width:min(480px,100%);background:#242a32;border:1px solid #535f6c;border-radius:18px;box-shadow:0 35px 90px #07090bd9;padding:30px}.close-dialog{position:absolute;top:12px;left:16px;background:transparent;border:0;color:#96a1af;font-size:28px}.dialog h2{margin:0 0 6px;font-size:23px}.dialog p{color:#a0adba;font-size:13px;line-height:1.9}.dialog form{display:grid;gap:14px;margin-top:22px}.dialog label{font-size:12px;color:#d5dce4}.dialog input,.dialog textarea{width:100%;margin-top:5px;border:1px solid #515b69;border-radius:9px;background:#1c2128;padding:11px;color:white;outline:none}.dialog input:focus,.dialog textarea:focus{border-color:#b6c9e6}.dialog button[type=submit]{border:0;background:#e1eaf4;color:#273340;padding:12px;border-radius:9px;font-weight:800}.check-row{display:flex;align-items:center;gap:9px}.dialog .check-row input{width:16px;margin:0}.toast{position:fixed;bottom:60px;right:50%;transform:translateX(50%);background:#e7f0fa;color:#1e2831;padding:10px 19px;border-radius:11px;box-shadow:0 8px 30px #0008;font-size:12px;z-index:50;opacity:0;pointer-events:none;transition:opacity .2s}.toast.visible{opacity:1}.visually-hidden{position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);overflow:hidden}
@media (max-width:1100px){.workspace{grid-template-columns:220px minmax(0,1fr) 200px}.rooms-panel,.users-panel{padding:16px 10px}.topbar{padding:0 15px}.composer-tip{display:none}.room-count{display:none}.room-toolbar{padding:0 14px}}
@media (max-width:820px){.workspace{grid-template-columns:minmax(170px,205px) minmax(0,1fr)}.users-panel{display:none}.users-panel.show{display:flex;position:absolute;left:0;top:71px;bottom:41px;width:245px;z-index:5;box-shadow:0 5px 30px #000b}.site-link{display:none}.footer>span:nth-child(2){display:none}}
@media (max-width:590px){.topbar{height:59px;padding:0 11px;gap:6px}.brand{min-width:auto;gap:7px}.brand-icon{height:32px;width:32px;font-size:22px}.brand strong{font-size:15px}.brand small{font-size:8px}.global-state{font-size:0;margin-right:auto}.global-state .live-dot{width:7px;height:7px}.top-actions{margin-inline-start:0;gap:6px}.icon-button{display:none}.user-pill{font-size:10px;padding:6px 8px}.workspace{display:flex;flex-direction:column}.rooms-panel{padding:8px;border-left:0;border-bottom:1px solid var(--line);overflow:visible;flex:none;max-height:116px}.rooms-panel .panel-head,.rooms-panel .room-search,.rooms-panel .category-title,.rooms-panel .sidebar-bottom,.rooms-panel .muted{display:none}.room-list{display:flex;overflow:auto;gap:4px;margin:0;scrollbar-width:none}.room-list .room-item{white-space:nowrap;width:auto;min-height:48px;padding:7px 11px}.room-item .room-details small,.room-item .live-count{display:none}.room-item .hash{width:auto}.room-item b{font-size:11px}.chat-area{flex:1;min-height:0}.room-toolbar{height:62px;padding:0 11px}.room-hash{width:32px;height:32px;font-size:19px}.room-meta{gap:6px}.room-meta h1{font-size:13px}.room-meta p{font-size:9px}.toolbar-actions{gap:4px}.toolbar-actions button{padding:5px;font-size:17px}.toolbar-actions button span{display:none}.room-tabs{min-height:39px;padding:5px 9px}.conversation{padding:14px 11px 8px}.composer{margin:0 8px 7px}.composer-main textarea{min-height:48px;padding:9px}.footer{height:31px;padding:0 10px;font-size:9px}.users-panel.show{top:59px;bottom:31px}.message-body{font-size:12px}.dialog{padding:22px}}