*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,Arial;background:#f5f8fa;color:#142433}button,input,textarea,select{font:inherit}button{cursor:pointer;border:0}button:disabled{cursor:not-allowed;opacity:.6}[hidden]{display:none!important}
.login{min-height:100vh;position:relative;display:grid;place-items:center;padding:22px;overflow:hidden;background:#061f31}.login:before{content:"";position:absolute;inset:-8%;background-image:linear-gradient(180deg,rgba(3,25,40,.16),rgba(3,25,40,.78)),url('/logo.jpg');background-size:cover;background-position:center;filter:blur(3px) saturate(1.05);transform:scale(1.06);opacity:.92}.login:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 20%,rgba(255,255,255,.22),transparent 35%),linear-gradient(135deg,rgba(4,163,215,.18),rgba(17,197,119,.12));pointer-events:none}.loginWrap{position:relative;z-index:1;width:min(470px,100%)}.card{width:100%;background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.75);border-radius:30px;padding:30px 28px 25px;box-shadow:0 30px 100px rgba(0,0,0,.32);backdrop-filter:blur(18px);text-align:center}.brandImage{display:block;width:100%;height:190px;object-fit:contain;object-position:center;border-radius:22px;background:#fff;margin:0 auto 18px;box-shadow:0 15px 35px rgba(0,60,85,.12)}.loginTitle{font-size:25px;line-height:1.2;margin:6px 0 8px;font-weight:900;color:#0d2b3d}.loginSub{margin:0 0 22px;color:#647986;font-size:13px}.phoneRow{display:flex;gap:8px;direction:ltr}.countryCode{width:86px;flex:none;padding:14px 8px;border:1px solid #d9e4ea;border-radius:15px;background:#f6fafb;color:#183b4e;font-weight:800;text-align:center}.field{width:100%;padding:14px 15px;border:1px solid #d9e4ea;border-radius:15px;margin:0;outline:none;background:#fff;transition:.2s}.field:focus{border-color:#0aa8d4;box-shadow:0 0 0 4px rgba(10,168,212,.11)}.primary{width:100%;padding:14px 16px;border-radius:15px;background:linear-gradient(100deg,#078fd0,#10c878);color:#fff;font-weight:850;box-shadow:0 10px 24px rgba(8,170,130,.22);transition:.2s}.primary:hover:not(:disabled){transform:translateY(-1px);filter:saturate(1.05)}.otp{display:none}.otpHeader{display:flex;align-items:center;justify-content:space-between;margin:18px 0 9px}.otpTitle{font-weight:850;color:#183b4e}.changePhone{background:none;color:#078fca;font-size:12px;padding:5px}.otpDigits{letter-spacing:8px;text-align:center;font-size:24px;font-weight:800}.otpActions{display:flex;gap:8px;margin-top:10px}.otpActions .primary{flex:1}.secondary{flex:0 0 auto;padding:12px 13px;border-radius:13px;background:#edf6f8;color:#07506b;font-weight:800}.hint{font-size:12px;color:#81909b;margin-top:10px;line-height:1.6}.statusBox{min-height:24px;margin-top:12px;font-size:12px;font-weight:700}.statusBox.error{color:#c53030}.statusBox.success{color:#07855b}.loginFoot{margin-top:18px;font-size:11px;color:#738691}.securityPills{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin-top:13px}.pill{background:#eef8f5;color:#24745a;padding:6px 9px;border-radius:999px;font-size:10px;font-weight:750}.topGap{margin-top:10px}.topGapSmall{margin-top:10px}
.app{height:100vh;display:flex;background:#fff}.sidebar{width:250px;background:#062b43;color:#eaf8ff;padding:14px}.sidebar img{width:170px;height:60px;object-fit:contain}.nav button{width:100%;padding:12px;margin:4px 0;background:transparent;color:#d8edf6;border-radius:11px;text-align:right}.nav button.active,.nav button:hover{background:#0c4664}.badge{float:left;background:#13c97f;padding:2px 7px;border-radius:10px;font-size:11px}.content{flex:1;display:flex;min-width:0}.list{width:340px;border-left:1px solid #e1e9ee;display:flex;flex-direction:column}.listhead{padding:16px}.search{width:100%;padding:11px;border:1px solid #dce6eb;border-radius:12px;background:#f6f9fb;outline:none}.items{overflow:auto}.item{display:flex;gap:10px;padding:13px;border-bottom:1px solid #edf1f4;cursor:pointer}.item:hover{background:#f5fafc}.avatar{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#08a8d8,#62d84e);display:grid;place-items:center;color:white;font-weight:900;flex:none}.meta{flex:1;min-width:0}.desc{font-size:12px;color:#748494;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat{flex:1;display:flex;flex-direction:column;min-width:0}.top{height:70px;border-bottom:1px solid #e1e8ed;display:flex;align-items:center;gap:10px;padding:10px 15px}.info{flex:1}.online{font-size:11px;color:#08a36d}.icon{width:40px;height:40px;border-radius:11px;background:#eef5f8;color:#07506b}.messages{flex:1;overflow:auto;padding:20px;background:linear-gradient(#f8fbfd,#eef7f3);display:flex;flex-direction:column;gap:9px}.bubble{max-width:75%;padding:11px 14px;border-radius:17px;line-height:1.55;overflow-wrap:anywhere}.mine{align-self:flex-start;background:#d6f8e7}.theirs{align-self:flex-end;background:#fff;border:1px solid #e4ecef}.bubble small{display:block;color:#84929d;font-size:9px}.composer{display:flex;gap:8px;padding:10px;border-top:1px solid #e2e9ed;align-items:center}.composer input{flex:1;padding:12px;border:1px solid #dbe5ea;border-radius:13px;min-width:0}.send{background:#0ab97a;color:white;padding:11px 18px;border-radius:13px;font-weight:800}.voiceButton{width:42px;height:42px;border-radius:13px;background:#edf6f9;color:#07506b}.recordingButton{background:#ffe7e7;color:#b60000}.channel{background:white;border:1px solid #e0e8ed;border-radius:16px;padding:14px}.channelHeader{display:flex;gap:10px;align-items:center}.channelActions{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.action{background:#edf6f9;color:#07506b;padding:8px 10px;border-radius:10px}.reaction{background:#f2f7f8;border:1px solid #e2eaee;border-radius:9px;padding:5px 8px}.drawer{position:fixed;inset:0;background:#0007;z-index:20}.panel{position:absolute;right:0;top:0;height:100%;width:min(390px,92%);background:#fff;padding:20px;overflow:auto}.row{padding:14px 0;border-bottom:1px solid #edf1f4}.panel input,.panel textarea,.panel select{width:100%;padding:11px;border:1px solid #dbe5eb;border-radius:11px}.panel label{display:block;margin-top:10px;font-size:13px}.back{display:none}.toggle{display:flex;align-items:center;justify-content:space-between;gap:12px}.toggle input{width:auto}.danger{background:#ffe9e9;color:#a40000;padding:11px 12px;border-radius:11px;font-weight:800;width:100%;margin-top:8px}.wideButton{width:100%;margin-top:8px}.lockScreen{position:fixed;inset:0;background:linear-gradient(135deg,#05253a,#071b2b);color:#fff;z-index:100;place-items:center;padding:20px;text-align:center}.lockCard{width:min(420px,100%);padding:28px;border-radius:24px;background:#ffffff10;border:1px solid #ffffff22;backdrop-filter:blur(14px)}.lockIcon{font-size:56px}.lockHint{color:#cfe8f2}.note{font-size:11px;color:#7b8c98;line-height:1.6}.screenshotBlock *{visibility:hidden!important}.screenshotBlock:after{content:"🔒 حماية الخصوصية";visibility:visible;position:fixed;inset:0;display:grid;place-items:center;font-size:26px;font-weight:900;background:#062b43;color:#fff;z-index:9999}.emptyState{margin:auto;color:#71808d;text-align:center;max-width:420px}.versionTag{position:fixed;bottom:8px;left:8px;font-size:11px;opacity:.45;z-index:2}.audioMessage{display:flex;flex-direction:column;gap:6px}.audioMessage audio{max-width:min(280px,70vw);height:38px}.contactAction{margin-top:5px}
@media(max-width:760px){.sidebar{position:absolute;inset:0;width:100%;z-index:5}.sidebar.hidden{display:none}.list{display:none}.back{display:block}.bubble{max-width:88%}.top{padding-inline:8px}.top .icon{width:36px;height:36px}.composer{gap:6px}.send{padding-inline:12px}}