:root{
  --bg:#f6f2e9;--panel:#fff;--panel2:#fbf8f2;--text:#17212a;--muted:#76808a;--line:#e8dfcf;
  --brand:#d6a33e;--brand2:#f2c867;--ink:#101920;--soft:#fff6df;--danger:#b83e42;--ok:#2d8a64;
  --shadow:0 14px 38px rgba(23,33,42,.08);--radius:22px;--navh:76px
}
html[data-theme="dark"]{
  --bg:#0b1116;--panel:#111a21;--panel2:#172129;--text:#f5f1e8;--muted:#9ca8b1;--line:#24313b;
  --brand:#e1b454;--brand2:#f2cf7e;--ink:#080d11;--soft:#211d14;--shadow:0 18px 45px rgba(0,0,0,.3)
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Tahoma,"Segoe UI",sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}
body{min-height:100dvh;background:radial-gradient(circle at 85% 0,rgba(214,163,62,.12),transparent 28%),var(--bg)}
#app{min-height:100dvh;padding-bottom:calc(var(--navh) + env(safe-area-inset-bottom))}
#toast{position:fixed;left:50%;bottom:calc(var(--navh) + 18px);transform:translateX(-50%);z-index:99;max-width:min(92vw,460px);background:var(--text);color:var(--panel);padding:12px 18px;border-radius:999px;box-shadow:var(--shadow);font-size:13px}#toast[hidden]{display:none}
.shell{width:min(1160px,100%);margin:0 auto}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:14px 18px calc(12px + env(safe-area-inset-top));background:color-mix(in srgb,var(--panel) 92%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;min-width:0}.brand img{width:42px;height:42px;border-radius:14px}.brand strong{display:block;font-size:17px}.brand small{display:block;color:var(--muted);margin-top:2px}.spacer{flex:1}.iconbtn{width:42px;height:42px;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--text);display:grid;place-items:center}.avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;background:var(--soft);border:2px solid var(--brand);display:grid;place-items:center;font-weight:700;color:var(--brand)}
.content{padding:18px}.hero{background:linear-gradient(135deg,#101920,#25313b);color:white;padding:20px;border-radius:26px;box-shadow:var(--shadow);display:flex;align-items:center;gap:16px;border:1px solid rgba(255,255,255,.08)}.hero .logo{width:64px;height:64px;border-radius:20px;background:#0c1217}.hero h1{margin:0 0 7px;font-size:23px}.hero p{margin:0;color:#d8dce0;line-height:1.8;font-size:13px}.hero-badge{margin-right:auto;background:var(--brand);color:#14120d;border-radius:18px;padding:10px 13px;text-align:center;min-width:76px}.hero-badge strong{display:block;font-size:20px}.hero-badge small{font-size:10px}
.section{margin-top:20px}.sectionhead{display:flex;align-items:center;gap:10px;margin:0 2px 10px}.sectionhead h2{font-size:16px;margin:0}.sectionhead small{color:var(--muted)}.surface{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.tabs{display:flex;gap:6px;padding:6px;background:var(--panel2);border:1px solid var(--line);border-radius:17px;overflow:auto}.tabs button{border:0;background:transparent;color:var(--muted);padding:9px 14px;border-radius:12px;white-space:nowrap}.tabs button.active{background:var(--brand);color:#17120a;font-weight:700}
.storyrow{display:flex;gap:13px;overflow:auto;padding:4px 2px 8px}.story{border:0;background:transparent;color:var(--text);width:68px;padding:0}.story .ring{width:58px;height:58px;margin:auto;border-radius:50%;padding:3px;background:linear-gradient(135deg,var(--brand2),var(--brand),#7a5a1c)}.story .ring>*{width:100%;height:100%;border:3px solid var(--panel);border-radius:50%}.story span{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:5px}
.chatlist{overflow:hidden}.chatrow{width:100%;display:flex;align-items:center;gap:12px;padding:13px 15px;border:0;border-bottom:1px solid var(--line);background:var(--panel);color:var(--text);text-align:right}.chatrow:last-child{border-bottom:0}.chatrow:hover{background:var(--panel2)}.chatbody{min-width:0;flex:1}.chatline{display:flex;align-items:center;gap:8px}.chatline strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chatline time{margin-right:auto;color:var(--muted);font-size:10px}.preview{display:flex;align-items:center;gap:8px;margin-top:6px}.preview p{margin:0;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.badge{min-width:22px;height:22px;border-radius:999px;background:var(--brand);color:#17120a;font-weight:700;font-size:11px;display:grid;place-items:center;padding:0 6px}.official{background:linear-gradient(180deg,var(--panel),color-mix(in srgb,var(--soft) 55%,var(--panel)))}
.search{display:flex;gap:8px}.search input{flex:1;min-width:0;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:16px;padding:12px 14px;outline:none}.search input:focus{border-color:var(--brand)}.btn{border:0;border-radius:15px;padding:11px 16px;background:var(--brand);color:#18120a;font-weight:700}.btn.secondary{background:var(--panel);border:1px solid var(--line);color:var(--text)}.btn.danger{background:transparent;border:1px solid color-mix(in srgb,var(--danger) 45%,var(--line));color:var(--danger)}
.contacts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.contact{display:flex;gap:10px;align-items:center;padding:12px;background:var(--panel);border:1px solid var(--line);border-radius:18px;color:var(--text);text-align:right}.contact span{min-width:0;flex:1}.contact strong,.contact small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.contact small{color:var(--muted);margin-top:4px;font-size:11px}
.services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.service{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px;background:var(--panel);border:1px solid var(--line);border-radius:19px;text-align:center}.service i{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:var(--soft);color:var(--brand);font-style:normal;font-size:21px}.service strong{font-size:12px}.service small{color:var(--muted);font-size:10px}
.bottomnav{position:fixed;z-index:30;bottom:0;left:50%;transform:translateX(-50%);width:min(760px,100%);height:calc(var(--navh) + env(safe-area-inset-bottom));padding:8px 7px env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(5,1fr);background:color-mix(in srgb,var(--panel) 95%,transparent);backdrop-filter:blur(20px);border:1px solid var(--line);border-bottom:0;border-radius:22px 22px 0 0;box-shadow:0 -12px 35px rgba(0,0,0,.08)}.bottomnav button{border:0;background:transparent;color:var(--muted);border-radius:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:10px}.bottomnav button b{font-size:20px;font-weight:400}.bottomnav button.active{color:var(--brand);background:var(--soft);font-weight:700}
.empty{padding:25px;text-align:center;color:var(--muted);line-height:1.9}.loading{padding:40px;text-align:center;color:var(--muted)}
.conversation-wrap{height:calc(100dvh - 146px);display:flex;flex-direction:column}.convhead{display:flex;align-items:center;gap:10px;padding:12px 15px;border-bottom:1px solid var(--line);background:var(--panel)}.back{border:0;background:transparent;color:var(--text);font-size:20px}.messages{flex:1;overflow:auto;padding:16px;background:linear-gradient(rgba(214,163,62,.035),rgba(214,163,62,.035)),var(--bg);display:flex;flex-direction:column;gap:8px}.bubble{max-width:min(78%,550px);padding:10px 12px;border-radius:18px;background:var(--panel);border:1px solid var(--line);box-shadow:0 4px 14px rgba(0,0,0,.04);line-height:1.8;font-size:13px}.bubble.mine{margin-right:auto;background:var(--soft);border-color:color-mix(in srgb,var(--brand) 35%,var(--line))}.bubble small{display:block;color:var(--muted);font-size:9px;margin-top:4px}.composer{display:flex;gap:8px;padding:10px;background:var(--panel);border-top:1px solid var(--line);padding-bottom:calc(10px + env(safe-area-inset-bottom))}.composer textarea{flex:1;resize:none;min-height:46px;max-height:120px;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:17px;padding:11px 13px;outline:none}.send{width:48px;border:0;border-radius:16px;background:var(--brand);font-size:20px}
.post{padding:14px;margin-bottom:10px}.posthead{display:flex;gap:9px;align-items:center}.posthead small{display:block;color:var(--muted);margin-top:2px}.post p{line-height:1.9;font-size:13px}.post img,.post video{width:100%;max-height:420px;object-fit:cover;border-radius:15px}.postactions{display:flex;gap:8px;margin-top:10px}.postactions button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:12px;padding:8px 12px}.postactions button.active{color:var(--brand);border-color:var(--brand)}
.profilecard{padding:18px;display:flex;align-items:center;gap:13px}.profilecard .avatar{width:64px;height:64px}.profilecard h2{margin:0 0 5px;font-size:18px}.profilecard p{margin:0;color:var(--muted);font-size:12px}.settings{padding:15px}.settingrow{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}.settingrow:last-child{border:0}.settingrow span{flex:1}.themechoice{display:flex;gap:5px}.themechoice button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:11px;padding:7px 9px;font-size:10px}.themechoice button.active{border-color:var(--brand);color:var(--brand)}
.loginpage{min-height:100dvh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% -20%,rgba(224,178,80,.27),transparent 40%),#0c141a;color:white}.loginbox{width:min(430px,100%);background:#111c24;border:1px solid #2a3741;border-radius:30px;padding:28px;box-shadow:0 24px 70px rgba(0,0,0,.35)}.loginbrand{text-align:center}.loginbrand img{width:82px;height:82px;border-radius:24px}.loginbrand h1{margin:12px 0 4px}.loginbrand p{color:#aeb8bf;font-size:12px;line-height:1.8}.authtabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:#0b1217;border-radius:14px;padding:5px;margin:18px 0}.authtabs button{border:0;background:transparent;color:#9eaab2;border-radius:10px;padding:10px}.authtabs button.active{background:#d8aa4a;color:#18120b;font-weight:700}.field{display:block;margin:12px 0}.field span{display:block;font-size:11px;color:#aeb8bf;margin-bottom:6px}.field input{width:100%;border:1px solid #35444f;background:#0c151b;color:white;border-radius:14px;padding:12px 13px;outline:none}.remember{display:flex;gap:8px;align-items:center;color:#c7cfd4;font-size:11px;margin:12px 0}.loginbox .btn{width:100%;padding:13px}.loginmsg{background:#23181b;border:1px solid #5e3438;color:#f0c4c7;border-radius:13px;padding:10px 12px;font-size:11px;line-height:1.8}.debug{margin-top:10px;color:#f2cf7e;font-size:11px;text-align:center}.installhint{margin-top:16px;color:#92a0a9;font-size:10px;line-height:1.8;text-align:center}
.desktoprail{display:none}
@media(min-width:900px){#app{padding-bottom:0}.shell{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100dvh;gap:0}.desktoprail{display:flex;position:sticky;top:0;height:100dvh;flex-direction:column;padding:24px 16px;background:#101920;color:#fff;border-left:1px solid #27343e}.railbrand{display:flex;gap:10px;align-items:center;margin-bottom:22px}.railbrand img{width:45px;height:45px;border-radius:15px}.railbrand small{display:block;color:#9eabb4;margin-top:3px}.railnav{display:flex;flex-direction:column;gap:6px}.railnav button{display:flex;align-items:center;gap:10px;border:0;background:transparent;color:#b9c3c9;border-radius:14px;padding:12px;text-align:right}.railnav button.active{background:#212d35;color:#f1c76c}.railnav i{font-style:normal;width:26px;text-align:center}.railfoot{margin-top:auto;color:#8e9aa2;font-size:10px;line-height:1.8}.maincol{min-width:0}.bottomnav{display:none}.content{padding:24px 28px}.topbar{padding-left:28px;padding-right:28px}.hero{padding:24px}.contacts{grid-template-columns:repeat(3,minmax(0,1fr))}.services{grid-template-columns:repeat(6,minmax(0,1fr))}.conversation-wrap{height:calc(100dvh - 82px)}}
@media(max-width:520px){.hero{align-items:flex-start}.hero-badge{display:none}.contacts{grid-template-columns:1fr}.services{grid-template-columns:repeat(3,1fr)}.content{padding:13px}.chatrow{padding:12px}.topbar{padding-right:13px;padding-left:13px}.brand small{display:none}}

/* Messenger core V18.9 */
.avatar.sm{width:38px;height:38px;flex:0 0 38px}.room-avatar{border:0;background:var(--soft);font-size:21px}.hero.compact{padding:15px 18px}.hero.compact h1{font-size:20px}
.room-create{padding:16px}.field.plain span{color:var(--muted)}.field.plain input,.field.plain textarea,.field.plain select{width:100%;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:14px;padding:11px 12px;outline:none}.field.plain input:focus,.field.plain textarea:focus,.field.plain select:focus{border-color:var(--brand)}.room-create h3{font-size:13px;margin:18px 0 10px}.member-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:310px;overflow:auto;margin-bottom:15px}.member-pick{display:flex;align-items:center;gap:8px;padding:9px;border:1px solid var(--line);border-radius:14px;background:var(--panel2)}.member-pick>span{min-width:0;flex:1}.member-pick b,.member-pick small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.member-pick small{color:var(--muted);font-size:10px;margin-top:3px}.member-pick input{width:18px;height:18px;accent-color:var(--brand)}
.conversation-wrap{height:100dvh;max-width:980px;margin:0 auto;background:var(--bg);box-shadow:var(--shadow)}.convhead{padding-top:calc(12px + env(safe-area-inset-top));position:relative;z-index:10}.conv-title{border:0;background:transparent;color:var(--text);padding:0;text-align:right;min-width:0}.conv-title strong,.conv-title small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:50vw}.conv-title small{color:var(--muted);font-size:10px;margin-top:4px}.message-line{display:flex;width:100%;justify-content:flex-start}.message-line.mine{justify-content:flex-end}.message-line .bubble{position:relative;margin:0;min-width:90px;max-width:min(78%,620px);padding-bottom:8px}.message-line .bubble.mine{margin:0;background:color-mix(in srgb,var(--brand) 16%,var(--panel));border-color:color-mix(in srgb,var(--brand) 40%,var(--line))}.sendername{font-size:10px;color:var(--brand);font-weight:700;margin-bottom:3px}.msgtext{overflow-wrap:anywhere}.deleted{color:var(--muted)}.seen{font-weight:700;color:var(--brand);padding-right:4px}.forwarded{font-size:10px;color:var(--brand);border-right:2px solid var(--brand);padding-right:7px;margin-bottom:7px}.replybox{background:color-mix(in srgb,var(--brand) 8%,var(--panel2));border-right:3px solid var(--brand);padding:7px 9px;border-radius:8px;margin-bottom:7px}.replybox b,.replybox span{display:block}.replybox b{font-size:10px;color:var(--brand)}.replybox span{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}
.msg-image,.msg-video{display:block;width:min(100%,360px);max-height:360px;object-fit:cover;border-radius:13px;margin:5px 0}.voice{display:flex;align-items:center;gap:7px;min-width:230px}.voice audio{width:230px;max-width:100%}.file-card{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:9px 10px;background:var(--panel2);margin:4px 0}.file-card b{font-size:11px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-card small{margin-right:auto;white-space:nowrap}
.msg-actions{display:flex;gap:2px;opacity:0;max-height:0;overflow:hidden;transition:.15s;margin-top:2px}.bubble:hover .msg-actions,.bubble:focus-within .msg-actions{opacity:1;max-height:30px}.msg-actions button{border:0;background:transparent;color:var(--muted);padding:3px 5px;border-radius:7px;font-size:11px}.msg-actions button:hover{background:var(--panel2);color:var(--brand)}.reactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}.reactions button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:999px;padding:2px 7px;font-size:10px}.reactions button.mine{border-color:var(--brand);background:var(--soft)}.reaction-pop{position:absolute;bottom:100%;right:0;z-index:20;display:flex;gap:2px;padding:5px;background:var(--panel);border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow)}.reaction-pop button{border:0;background:transparent;font-size:18px;padding:4px}
.pinnedbar{display:flex;align-items:center;gap:8px;width:100%;border:0;border-bottom:1px solid var(--line);background:var(--panel2);color:var(--text);padding:8px 14px;text-align:right}.pinnedbar b{font-size:10px;color:var(--brand)}.pinnedbar span{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.composer-wrap{background:var(--panel);border-top:1px solid var(--line)}.composer{border-top:0;padding:8px 10px calc(8px + env(safe-area-inset-bottom))}.composer-context{display:flex;align-items:center;gap:8px;padding:7px 12px;background:var(--panel2);border-right:3px solid var(--brand)}.composer-context span{min-width:0;flex:1}.composer-context b,.composer-context small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.composer-context b{font-size:10px;color:var(--brand)}.composer-context small{font-size:9px;color:var(--muted)}.composer-context button{border:0;background:transparent;color:var(--muted);font-size:20px}.attach-btn,.mic{width:44px;height:44px;flex:0 0 44px;border:1px solid var(--line);border-radius:15px;background:var(--panel2);display:grid;place-items:center;color:var(--text);font-size:20px}.mic{cursor:pointer}.recording{padding:6px 12px;color:var(--danger);font-size:10px;background:var(--panel2)}.channel-readonly{padding:14px;text-align:center;color:var(--muted);background:var(--panel);border-top:1px solid var(--line);padding-bottom:calc(14px + env(safe-area-inset-bottom))}
.room-info{text-align:center;padding:22px}.room-info>.avatar{margin:0 auto 10px;width:72px;height:72px;font-size:28px}.room-info h2{margin:5px 0}.room-info p{color:var(--muted);line-height:1.9}.room-stats{display:flex;justify-content:center;gap:8px}.room-stats span{background:var(--panel2);border:1px solid var(--line);padding:6px 10px;border-radius:999px;font-size:10px}.member-list{overflow:hidden}.member-row{display:flex;align-items:center;gap:9px;padding:10px 12px;border-bottom:1px solid var(--line)}.member-row:last-child{border:0}.member-row>span{min-width:0}.member-row b,.member-row small{display:block}.member-row small{color:var(--muted);font-size:10px;margin-top:3px}
.search-head{display:flex;align-items:center;gap:10px}.search-head h2{font-size:18px}.search-results{overflow:hidden}.search-result{display:flex;flex-direction:column;gap:4px;width:100%;border:0;border-bottom:1px solid var(--line);background:var(--panel);color:var(--text);padding:11px 13px;text-align:right}.search-result:last-child{border:0}.search-result b{font-size:11px;color:var(--brand)}.search-result span{font-size:12px}.search-result small{font-size:9px;color:var(--muted)}
.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.48);display:grid;place-items:end center;padding:20px}.modal{width:min(520px,100%);max-height:75dvh;overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}.modal-head{display:flex;align-items:center;padding:13px 15px;border-bottom:1px solid var(--line)}.modal-head h3{margin:0;font-size:15px}.modal-head button{margin-right:auto;border:0;background:transparent;color:var(--text);font-size:23px}.forward-list{max-height:60dvh;overflow:auto}.forward-list button{display:flex;align-items:center;gap:10px;width:100%;border:0;border-bottom:1px solid var(--line);background:var(--panel);color:var(--text);padding:10px 13px;text-align:right}.forward-list button:last-child{border:0}.flash{animation:msgflash 1.6s ease}@keyframes msgflash{0%,100%{box-shadow:0 4px 14px rgba(0,0,0,.04)}35%{box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 35%,transparent)}}
@media(hover:none){.msg-actions{opacity:1;max-height:30px}.msg-actions button{font-size:10px}}
@media(max-width:520px){.member-grid{grid-template-columns:1fr}.message-line .bubble{max-width:86%}.msg-actions{opacity:1;max-height:30px}.conv-title strong,.conv-title small{max-width:42vw}.voice{min-width:190px}.voice audio{width:190px}}
.member-actions{margin-right:auto;display:flex;gap:5px}.member-actions button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:9px;padding:5px 7px;font-size:9px}.member-actions .danger-text{color:var(--danger)}.forward-list button>span{min-width:0}.forward-list button>span>small{display:block;color:var(--muted);font-size:9px;margin-top:3px}

/* V18.9.2 — mobile keyboard, smoother chat and visual polish */
#app.chat-open{height:var(--nasim-vh,100dvh);min-height:0;padding-bottom:0;overflow:hidden}
#app.chat-open .conversation-wrap{height:var(--nasim-vh,100dvh);max-height:var(--nasim-vh,100dvh);overflow:hidden}
.conversation-wrap{background:var(--bg)}
.convhead{flex:0 0 auto;min-height:68px;background:color-mix(in srgb,var(--panel) 96%,transparent);backdrop-filter:blur(18px);box-shadow:0 5px 18px rgba(0,0,0,.035)}
.convhead>.avatar{width:46px;height:46px;flex:0 0 46px}.convhead .iconbtn{width:39px;height:39px;border-radius:13px}
#typing-status.is-typing{color:var(--ok);font-weight:800}
.messages{min-height:0;overscroll-behavior-y:contain;scroll-behavior:smooth;padding:18px 16px 12px;background-color:var(--bg);background-image:radial-gradient(circle at 1px 1px,color-mix(in srgb,var(--brand) 11%,transparent) 1px,transparent 0);background-size:22px 22px;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--brand) 38%,transparent) transparent}
.message-line{padding:1px 0}.message-line .bubble{border-radius:18px 18px 6px 18px;box-shadow:0 4px 15px rgba(0,0,0,.045)}.message-line.mine .bubble{border-radius:18px 18px 18px 6px}
.msgtext{font-size:13.5px;line-height:1.9}.bubble small{margin-top:6px;opacity:.88}
.composer-wrap{position:relative;z-index:12;flex:0 0 auto;background:color-mix(in srgb,var(--panel) 97%,transparent);backdrop-filter:blur(18px);box-shadow:0 -7px 24px rgba(0,0,0,.06)}
.composer{align-items:flex-end;gap:7px;padding:8px 9px calc(8px + env(safe-area-inset-bottom));background:transparent}
.composer textarea{height:44px;min-height:44px;max-height:132px;overflow-y:auto;line-height:1.7;border-radius:21px;padding:10px 14px;border-color:color-mix(in srgb,var(--line) 82%,var(--brand));box-shadow:inset 0 1px 2px rgba(0,0,0,.025);transition:border-color .15s,box-shadow .15s,height .08s}
.composer textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 14%,transparent)}
.attach-btn,.mic,.send{height:44px;width:44px;flex:0 0 44px;border-radius:50%;transition:transform .12s,background .12s}.attach-btn:active,.mic:active,.send:active{transform:scale(.94)}
.send{display:grid;place-items:center;color:#17120a;box-shadow:0 5px 14px color-mix(in srgb,var(--brand) 25%,transparent)}
.chatrow{transition:background .13s,transform .13s}.chatrow:active{background:var(--soft);transform:scale(.997)}
.chatrow .avatar{width:52px;height:52px;flex:0 0 52px}.chatline strong{font-size:14.5px}.preview p{font-size:11.5px;line-height:1.6}.badge{box-shadow:0 3px 9px color-mix(in srgb,var(--brand) 25%,transparent)}
.tabs{scrollbar-width:none}.tabs::-webkit-scrollbar,.storyrow::-webkit-scrollbar{display:none}.storyrow{scrollbar-width:none}
.surface{box-shadow:0 8px 28px rgba(23,33,42,.055)}
@media(max-width:520px){
  body{overscroll-behavior-y:none}.conversation-wrap{width:100%;box-shadow:none}.convhead{padding-right:10px;padding-left:8px}.convhead>.avatar{width:43px;height:43px;flex-basis:43px}.conv-title strong{font-size:13.5px}.conv-title small{font-size:9.5px}.messages{padding:13px 9px 9px;gap:6px}.message-line .bubble{max-width:88%;padding:9px 11px}.msgtext{font-size:13px}.composer{gap:6px;padding-right:7px;padding-left:7px}.attach-btn,.mic,.send{width:42px;height:42px;flex-basis:42px}.composer textarea{min-height:42px;height:42px;padding:9px 12px}.chatrow{padding:12px 10px}.chatrow .avatar{width:50px;height:50px;flex-basis:50px}.section{margin-top:16px}.surface{border-radius:18px}
}

/* V18.10.0 — Saba assistant + messenger polish */
.saba-row{background:linear-gradient(135deg,color-mix(in srgb,var(--brand) 10%,var(--panel)),var(--panel));border-bottom:1px solid color-mix(in srgb,var(--brand) 32%,var(--line))}
.saba-row:hover{background:color-mix(in srgb,var(--brand) 13%,var(--panel))}.saba-avatar{background:linear-gradient(135deg,#131d25,#2c3740)!important;color:var(--brand2)!important;border:2px solid var(--brand)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 11%,transparent);font-weight:900}.bot-badge{display:inline-flex;align-items:center;margin-right:5px;padding:2px 6px;border-radius:999px;background:color-mix(in srgb,var(--brand) 15%,transparent);color:var(--brand);font-size:8px;font-weight:800;vertical-align:middle}.online-dot{width:9px;height:9px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 14%,transparent);flex:0 0 9px}.conv-title.static{border:0;background:transparent;text-align:right;padding:0;min-width:0}.conv-title.static strong,.conv-title.static small{display:block}.saba-bubble{border-color:color-mix(in srgb,var(--brand) 30%,var(--line));background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--brand) 5%,var(--panel)))}.saba-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.saba-actions a{display:inline-flex;align-items:center;justify-content:center;border:1px solid color-mix(in srgb,var(--brand) 45%,var(--line));background:var(--soft);color:var(--text);border-radius:999px;padding:6px 10px;font-size:10px;font-weight:700}.saba-suggestions{display:flex;gap:6px;padding:7px 9px 0;overflow:auto;scrollbar-width:none}.saba-suggestions::-webkit-scrollbar{display:none}.saba-suggestions button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:999px;padding:6px 10px;white-space:nowrap;font-size:10px}.saba-thinking{display:flex;align-items:center;gap:4px;width:max-content;min-width:54px}.saba-thinking span{width:6px;height:6px;border-radius:50%;background:var(--brand);animation:saba-dot 1.05s infinite ease-in-out}.saba-thinking span:nth-child(2){animation-delay:.14s}.saba-thinking span:nth-child(3){animation-delay:.28s}@keyframes saba-dot{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-5px);opacity:1}}
#saba-form{padding-top:7px}#saba-form textarea{height:44px;min-height:44px;max-height:132px;overflow-y:auto;line-height:1.7;border-radius:21px;padding:10px 14px;border-color:color-mix(in srgb,var(--line) 82%,var(--brand));box-shadow:inset 0 1px 2px rgba(0,0,0,.025);transition:border-color .15s,box-shadow .15s,height .08s}#saba-form textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 14%,transparent)}
@media(max-width:520px){.saba-suggestions{padding-right:7px;padding-left:7px}.saba-suggestions button{font-size:9px;padding:6px 9px}#saba-form{padding-right:7px;padding-left:7px}#saba-form textarea{min-height:42px;height:42px;padding:9px 12px}.bot-badge{display:none}}

/* V18.10.1 — mobile composer lock + reliable media upload/voice states */
[hidden]{display:none!important}
body.nasim-chat-mode{position:fixed;inset:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:var(--bg)}
body.nasim-chat-mode #app.chat-open{position:fixed;top:var(--nasim-vv-top,0px);right:0;left:0;height:var(--nasim-vh,100dvh);min-height:0;max-height:var(--nasim-vh,100dvh);padding:0;overflow:hidden;background:var(--bg)}
body.nasim-chat-mode #app.chat-open .conversation-wrap{height:100%;max-height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden}
body.nasim-chat-mode .convhead{position:relative;z-index:3;flex:0 0 auto}
body.nasim-chat-mode .messages{position:relative;z-index:1;flex:1 1 0;min-height:0;overflow-y:auto;overflow-x:hidden;padding-bottom:12px}
body.nasim-chat-mode .composer-wrap{position:relative!important;inset:auto!important;bottom:auto!important;z-index:4;flex:0 0 auto;max-height:min(46vh,360px);overflow:visible;background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -8px 22px rgba(0,0,0,.07)}
body.nasim-keyboard-open .composer{padding-bottom:7px}
body.nasim-keyboard-open .composer-wrap{box-shadow:0 -4px 14px rgba(0,0,0,.06)}
body.nasim-keyboard-open .saba-suggestions{display:none}
.media-draft{display:flex;align-items:center;gap:10px;margin:8px 9px 0;padding:8px 10px;border:1px solid color-mix(in srgb,var(--brand) 28%,var(--line));border-radius:16px;background:var(--panel2)}
.media-draft img{width:54px;height:54px;object-fit:cover;border-radius:12px;border:1px solid var(--line);flex:0 0 54px}.draft-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:12px;background:var(--soft);font-size:24px;flex:0 0 48px}.draft-meta{min-width:0;flex:1}.draft-meta b,.draft-meta small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.draft-meta b{font-size:11.5px}.draft-meta small{margin-top:4px;color:var(--muted);font-size:9.5px}.media-draft>button{width:30px;height:30px;border:0;border-radius:50%;background:var(--panel);color:var(--muted);font-size:20px}
.upload-panel{display:flex;align-items:center;gap:9px;margin:8px 9px 0;padding:9px 10px;border-radius:15px;background:linear-gradient(135deg,color-mix(in srgb,var(--brand) 10%,var(--panel2)),var(--panel2));border:1px solid color-mix(in srgb,var(--brand) 30%,var(--line))}.upload-spinner{width:18px;height:18px;border-radius:50%;border:2px solid color-mix(in srgb,var(--brand) 28%,transparent);border-top-color:var(--brand);animation:ns-spin .8s linear infinite;flex:0 0 18px}@keyframes ns-spin{to{transform:rotate(360deg)}}.upload-copy{min-width:0;flex:1}.upload-copy b{display:block;font-size:10.5px;margin-bottom:5px}.upload-progress{display:block;height:5px;border-radius:99px;overflow:hidden;background:color-mix(in srgb,var(--line) 75%,transparent)}.upload-progress>i{display:block;width:0;height:100%;background:var(--brand);border-radius:99px;transition:width .12s linear}.upload-percent{font-size:10px;color:var(--brand);min-width:34px;text-align:center}.upload-panel>button{border:0;background:transparent;color:var(--danger);font-size:10px;font-weight:800;padding:6px}
.recording-panel{display:flex;align-items:center;gap:9px;margin:8px 9px 0;padding:9px 10px;border-radius:16px;background:color-mix(in srgb,var(--danger) 7%,var(--panel2));border:1px solid color-mix(in srgb,var(--danger) 30%,var(--line))}.record-pulse{width:11px;height:11px;border-radius:50%;background:var(--danger);box-shadow:0 0 0 0 color-mix(in srgb,var(--danger) 35%,transparent);animation:record-pulse 1.25s infinite;flex:0 0 11px}@keyframes record-pulse{70%{box-shadow:0 0 0 8px transparent}}.recording-panel>span:nth-child(2) b,.recording-panel>span:nth-child(2) small{display:block}.recording-panel>span:nth-child(2) b{font-size:10.5px}.recording-panel>span:nth-child(2) small{margin-top:3px;color:var(--danger);font-size:10px}.recording-panel button{border:0;border-radius:11px;padding:8px 10px;font-size:10px;font-weight:800}.record-cancel{background:var(--panel);color:var(--muted)}.record-send{background:var(--brand);color:#17120a}
.msg-image{background:linear-gradient(110deg,var(--panel2) 8%,color-mix(in srgb,var(--brand) 8%,var(--panel2)) 18%,var(--panel2) 33%);min-height:90px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--line) 75%,transparent)}
.voice{padding:5px 0}.voice audio{height:40px}
@media(max-width:520px){body.nasim-chat-mode .convhead{min-height:60px}.media-draft,.upload-panel,.recording-panel{margin-right:7px;margin-left:7px}.media-draft img{width:48px;height:48px;flex-basis:48px}.composer{padding-top:6px}.composer-wrap{max-height:52vh}.recording-panel{gap:7px}.recording-panel button{padding:7px 8px}.upload-panel{gap:7px}}

/* V18.10.2 — iPhone tap reliability, Bale-like chat styling, wallpapers, circular upload */
:root{
  --chat-wallpaper:
    radial-gradient(circle at 18% 22%,color-mix(in srgb,var(--brand) 7%,transparent) 0 1px,transparent 1.6px),
    radial-gradient(circle at 82% 70%,color-mix(in srgb,var(--brand) 6%,transparent) 0 1px,transparent 1.7px),
    linear-gradient(180deg,color-mix(in srgb,var(--bg) 95%,var(--panel)),var(--bg));
}
html[data-chat-wallpaper="plain"]{--chat-wallpaper:var(--bg)}
html[data-chat-wallpaper="warm"]{--chat-wallpaper:radial-gradient(circle at 10% 10%,rgba(214,163,62,.10),transparent 28%),radial-gradient(circle at 90% 80%,rgba(186,113,62,.08),transparent 32%),linear-gradient(180deg,#fbf3e6,var(--bg))}
html[data-theme="dark"][data-chat-wallpaper="warm"]{--chat-wallpaper:radial-gradient(circle at 10% 10%,rgba(225,180,84,.10),transparent 28%),radial-gradient(circle at 90% 80%,rgba(153,91,45,.09),transparent 32%),linear-gradient(180deg,#16130f,var(--bg))}
html[data-chat-wallpaper="night"]{--chat-wallpaper:radial-gradient(circle at 15% 18%,rgba(242,200,103,.12) 0 1px,transparent 1.8px),radial-gradient(circle at 72% 32%,rgba(255,255,255,.09) 0 1px,transparent 1.7px),linear-gradient(155deg,#0c151c,#101c25 55%,#0c141a)}
html[data-chat-wallpaper="music"]{--chat-wallpaper:radial-gradient(ellipse at 20% 22%,color-mix(in srgb,var(--brand) 8%,transparent) 0 2px,transparent 2.5px),repeating-linear-gradient(0deg,transparent 0 31px,color-mix(in srgb,var(--brand) 5%,transparent) 32px 33px),linear-gradient(180deg,color-mix(in srgb,var(--panel2) 36%,var(--bg)),var(--bg))}
body.nasim-chat-mode .messages{background:var(--chat-wallpaper);background-attachment:local}
html[data-chat-wallpaper="night"] body.nasim-chat-mode .messages{color:#f5f1e8}
html[data-chat-wallpaper="night"] body.nasim-chat-mode .bubble:not(.mine){background:rgba(18,29,38,.92);border-color:rgba(255,255,255,.09);color:#f5f1e8}
html[data-chat-wallpaper="night"] body.nasim-chat-mode .bubble.mine{background:rgba(48,42,24,.94);color:#f8f2e5;border-color:rgba(225,180,84,.32)}

/* Keep the top controls below Dynamic Island/notch in standalone iOS. */
body.nasim-chat-mode .convhead{
  padding-top:calc(8px + env(safe-area-inset-top));
  padding-right:10px;
  padding-left:9px;
  padding-bottom:8px;
  min-height:calc(56px + env(safe-area-inset-top));
  background:color-mix(in srgb,var(--panel) 96%,transparent);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
body.nasim-chat-mode .convhead .back,body.nasim-chat-mode .convhead .iconbtn{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

/* One-tap send on iPhone/Android: large stable hit target above all composer layers. */
.composer{position:relative;isolation:isolate}
.send{
  position:relative;z-index:20;min-width:48px;width:48px;height:48px;flex:0 0 48px;
  border-radius:50%;touch-action:manipulation;-webkit-tap-highlight-color:transparent;
  user-select:none;-webkit-user-select:none;pointer-events:auto;
  display:grid;place-items:center;font-size:21px;font-weight:900;
}
.send::after{content:"";position:absolute;inset:-6px;border-radius:50%}
.composer.is-sending .send{opacity:.72}
.composer.is-sending .send::before{content:"";width:16px;height:16px;border:2px solid rgba(23,18,10,.28);border-top-color:#17120a;border-radius:50%;animation:ns-spin .7s linear infinite}
.composer.is-sending .send{font-size:0}
.attach-btn,.mic{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

/* Circular progress sits directly on the selected image/file preview. */
.draft-thumb{position:relative;width:58px;height:58px;flex:0 0 58px;border-radius:14px;overflow:hidden;display:grid;place-items:center;background:var(--soft);border:1px solid var(--line)}
.draft-thumb img{width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;border:0!important;border-radius:0!important;flex:none!important}
.draft-thumb .draft-icon{width:100%;height:100%;border-radius:0;border:0}
.draft-progress{--p:0;position:absolute;inset:0;display:grid;place-items:center;background:rgba(8,13,17,.40);backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px)}
.draft-progress::before{content:"";position:absolute;width:40px;height:40px;border-radius:50%;background:conic-gradient(var(--brand) calc(var(--p)*1%),rgba(255,255,255,.25) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 0);mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 0)}
.draft-progress b{position:relative;z-index:1;color:#fff;font-size:9px;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.draft-upload-label{display:block;min-height:14px;margin-top:3px;color:var(--brand);font-size:9px;font-style:normal;font-weight:700}
.media-draft{min-height:74px}

/* Delivery state for optimistic messages. */
.delivery{display:inline-grid;place-items:center;min-width:13px;margin-right:3px;font-weight:900}
.delivery.pending{color:var(--muted)}
.delivery.failed{width:14px;height:14px;border-radius:50%;background:var(--danger);color:#fff;font-size:9px}

/* Appearance controls like a real messenger. */
.wall-setting{align-items:flex-start;flex-direction:column}
.wall-setting>span{font-weight:700}
.wallchoice{width:100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.wallchoice button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:12px;padding:8px 5px;font-size:9px}
.wallchoice button.active{border-color:var(--brand);background:var(--soft);color:var(--brand);font-weight:800}

/* Closer to the approved mockup: cleaner header/bubbles/composer. */
.conv-title strong{font-weight:850;letter-spacing:-.15px}.conv-title small{line-height:1.45}
.message-line .bubble{border-radius:18px 18px 6px 18px;box-shadow:0 3px 12px rgba(0,0,0,.045)}
.message-line.mine .bubble{border-radius:18px 18px 18px 6px}
.composer-wrap{background:color-mix(in srgb,var(--panel) 98%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.composer textarea{background:var(--panel2);border-radius:24px}

@media(max-width:520px){
  body.nasim-chat-mode .convhead{padding-top:calc(7px + env(safe-area-inset-top));min-height:calc(54px + env(safe-area-inset-top));gap:8px}
  body.nasim-chat-mode .convhead>.avatar{width:40px;height:40px;flex-basis:40px}
  body.nasim-chat-mode .convhead .iconbtn{width:38px;height:38px;border-radius:13px}
  .send{width:48px!important;height:48px!important;flex-basis:48px!important;min-width:48px!important}
  .attach-btn,.mic{width:44px;height:44px;flex-basis:44px}
  .composer{padding-right:7px;padding-left:7px;gap:6px}
  .composer textarea{min-height:44px;height:44px}
  .draft-thumb{width:54px;height:54px;flex-basis:54px}
  .wallchoice{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* V18.11.0 — Bale/Telegram/WhatsApp interaction model */
html[data-theme="dark"]{--bg:#171819;--panel:#1c1e1f;--panel2:#252728;--line:#303334;--text:#f2f2f2;--muted:#8e9397;--soft:#28251d}
body{background:var(--bg)}

/* Home: closer to the supplied Bale reference */
.bale-topbar{justify-content:space-between;min-height:76px;padding-top:calc(env(safe-area-inset-top) + 9px)!important;padding-bottom:8px!important;background:var(--panel);border-bottom:0}
.bale-topbar .brand.centered{position:absolute;left:50%;transform:translateX(-50%);text-align:center;gap:7px}
.bale-topbar .brand.centered img{width:34px;height:34px;border-radius:10px}
.bale-topbar .brand.centered strong{font-size:18px;line-height:1.1}
.bale-topbar .brand.centered small{display:none}
.bale-topbar .iconbtn{border:0;background:transparent;border-radius:50%;font-size:22px}
.messenger-home{margin:-18px;padding:0 0 92px}
.bale-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:0;padding:0;border:0;border-radius:0;background:var(--panel);border-bottom:1px solid var(--line);overflow:visible}
.bale-tabs button{padding:14px 4px 13px;border-radius:0;font-size:12px;position:relative}
.bale-tabs button.active{background:transparent;color:var(--text);font-weight:800}
.bale-tabs button.active::after{content:"";position:absolute;right:14%;left:14%;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:var(--brand)}
.compact-stories{padding:9px 10px 7px;background:var(--panel);border-bottom:1px solid var(--line)}
.bale-chatlist{border:0!important;border-radius:0!important;box-shadow:none!important;background:var(--panel)}
.bale-chatlist .chatrow{min-height:78px;padding:10px 13px;background:var(--panel);gap:12px}
.bale-chatlist .chatrow .avatar{width:56px;height:56px;flex-basis:56px;border-width:0;background:color-mix(in srgb,var(--brand) 18%,var(--panel2))}
.bale-chatlist .chatline strong{font-size:15px;font-weight:800}
.bale-chatlist .chatline time{margin-right:auto;color:var(--muted);font-size:10px}
.bale-chatlist .preview p{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:3px 0 0}
.verified{display:inline-grid;place-items:center;width:16px;height:16px;margin-right:3px;border-radius:50%;background:#2d82f6;color:#fff;font-size:9px;vertical-align:middle}
.bale-bottomnav{position:fixed;z-index:41;right:20px;left:auto;bottom:calc(10px + env(safe-area-inset-bottom));width:210px;height:60px;padding:4px;display:grid;grid-template-columns:1fr 1fr;gap:2px;border:1px solid color-mix(in srgb,var(--line) 80%,transparent);border-radius:32px;background:color-mix(in srgb,var(--panel) 95%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 10px 30px rgba(0,0,0,.22)}
.bale-bottomnav button{border:0;border-radius:28px;background:transparent;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px}
.bale-bottomnav button b{font-size:19px;line-height:1}
.bale-bottomnav button.active{background:color-mix(in srgb,var(--brand) 16%,var(--panel2));color:var(--brand)}
.floating-search{position:fixed;z-index:42;left:18px;bottom:calc(10px + env(safe-area-inset-bottom));width:60px;height:60px;border-radius:50%;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 96%,transparent);color:var(--text);font-size:28px;box-shadow:0 10px 30px rgba(0,0,0,.24);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}

/* Conversation header: compact and reachable below iPhone status/Dynamic Island. */
body.nasim-chat-mode .bale-convhead{padding-top:calc(env(safe-area-inset-top) + 7px)!important;min-height:calc(env(safe-area-inset-top) + 58px)!important;padding-bottom:7px!important;background:var(--panel);box-shadow:none;border-bottom:1px solid var(--line)}
.bale-convhead .back{width:38px;height:38px;border:0;background:transparent;color:var(--text);font-size:24px}
.bale-convhead>.avatar{width:43px!important;height:43px!important;flex-basis:43px!important;border-width:0}
.bale-convhead .conv-title strong{font-size:15px}.bale-convhead .conv-title small{font-size:10px;color:var(--muted)}
.bale-convhead .iconbtn{border:0!important;background:transparent!important;font-size:21px}

/* Message geometry and swipe-to-reply */
.message-line{position:relative;display:flex;align-items:flex-end;min-height:36px;padding:2px 9px 3px}
.message-line.mine{justify-content:flex-start}
.message-line:not(.mine){justify-content:flex-end}
.message-line .bubble{position:relative;max-width:min(78%,650px);padding:9px 12px 7px;border:0!important;border-radius:18px 18px 5px 18px;background:#303233;box-shadow:none;touch-action:pan-y;will-change:transform;transition:transform .16s cubic-bezier(.2,.8,.2,1),filter .15s}
html[data-theme="light"] .message-line .bubble{background:#fff;border:1px solid var(--line)!important}
.message-line.mine .bubble{background:#72571f;color:#fff;border-radius:18px 18px 18px 5px}
html[data-theme="light"] .message-line.mine .bubble{background:#f2d58c;color:#211b10;border-color:#e2bd5f!important}
.message-line .bubble.pressed{filter:brightness(.9)}
.message-line .bubble.swiping{transition:none}
.swipe-reply-hint{position:absolute;right:10px;top:50%;transform:translateY(-50%) scale(.8);width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--brand) 18%,var(--panel));color:var(--brand);opacity:0;transition:opacity .12s,transform .12s}
.message-line:has(.bubble.swiping) .swipe-reply-hint{opacity:1;transform:translateY(-50%) scale(1)}
.sendername{font-size:10px;color:var(--brand2);font-weight:800;margin-bottom:4px}
.msgtext{font-size:14px;line-height:1.85}.msgtext.caption{padding:8px 3px 2px}
.bubble>small{display:flex;align-items:center;gap:3px;justify-content:flex-start;margin-top:4px;color:color-mix(in srgb,currentColor 68%,transparent);font-size:9px}
.seen{color:#31c7a4;font-weight:900}.forwarded{font-size:10px;color:var(--brand2);margin-bottom:5px}.replybox{border-right:3px solid #27b8e6;background:rgba(255,255,255,.055);padding:6px 8px;margin-bottom:7px;border-radius:6px}.replybox b,.replybox span{display:block}.replybox b{color:#39bde9;font-size:10px}.replybox span{font-size:10px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.media-frame{display:block;margin:-4px -7px 2px}.msg-image{display:block;width:min(68vw,420px);max-height:54vh;object-fit:cover;border-radius:15px;min-height:0;box-shadow:none}.msg-video{width:min(68vw,420px);border-radius:15px}
.msg-actions,.reaction-pop{display:none!important}

/* Reactions live on the message/media, not in a toolbar row. */
.reaction-badges{position:absolute;right:11px;bottom:-12px;z-index:3;display:flex;gap:3px;max-width:86%;direction:ltr}
.message-line.mine .reaction-badges{right:auto;left:11px}
.bubble:has(.reaction-badges){margin-bottom:12px}
.reaction-badges button{height:25px;min-width:28px;padding:2px 7px;border-radius:14px;border:2px solid var(--bg);background:var(--panel2);color:var(--text);box-shadow:0 2px 7px rgba(0,0,0,.25);font-size:14px;line-height:1;display:flex;align-items:center;gap:3px}
.reaction-badges button.mine{outline:1px solid var(--brand);background:color-mix(in srgb,var(--brand) 14%,var(--panel2))}.reaction-badges span{font-size:8px;color:var(--muted)}

/* Long-press action sheet, inspired by current mobile messengers. */
.message-action-backdrop,.attach-sheet-backdrop{position:fixed;inset:0;z-index:130;background:rgba(0,0,0,.38);display:flex;align-items:flex-end;justify-content:center;padding:0 10px calc(8px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.message-action-sheet{width:min(520px,100%);border-radius:24px;background:var(--panel);border:1px solid var(--line);box-shadow:0 18px 60px rgba(0,0,0,.36);overflow:hidden;animation:sheetUp .18s ease-out}
@keyframes sheetUp{from{transform:translateY(28px);opacity:.5}to{transform:none;opacity:1}}
.quick-reactions{display:grid;grid-template-columns:repeat(6,1fr);padding:10px 9px;border-bottom:1px solid var(--line)}.quick-reactions button{height:46px;border:0;background:transparent;font-size:26px;border-radius:15px}.quick-reactions button:active{background:var(--panel2);transform:scale(.9)}
.action-grid{display:grid;grid-template-columns:repeat(3,1fr);padding:8px}.action-grid button{border:0;background:transparent;color:var(--text);border-radius:15px;padding:10px 5px;display:grid;gap:4px;place-items:center}.action-grid button:active{background:var(--panel2)}.action-grid b{font-size:20px}.action-grid span{font-size:10px}.action-grid .danger{color:var(--danger)}

/* Composer matches the reference: plus, emoji, input, mic/send. */
.bale-composer{min-height:58px;padding:7px 8px calc(7px + env(safe-area-inset-bottom));gap:5px;background:var(--panel)}
.bale-composer .attach-btn,.bale-composer .emoji-btn,.bale-composer .mic{width:39px;height:39px;flex:0 0 39px;border:0;background:transparent;color:var(--muted);font-size:22px;border-radius:50%;display:grid;place-items:center}
.bale-composer .attach-btn{border:2px solid var(--muted);font-size:23px}.bale-composer .emoji-btn{font-size:24px}
.bale-composer textarea{height:42px;min-height:42px;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;padding:9px 5px;font-size:14px;color:var(--text)}
.bale-composer textarea::placeholder{color:var(--muted)}
.bale-composer .send{width:42px!important;height:42px!important;flex-basis:42px!important;min-width:42px!important;box-shadow:none;background:var(--brand)}
.emoji-pop{position:absolute;right:52px;left:52px;bottom:calc(58px + env(safe-area-inset-bottom));z-index:40;display:grid;grid-template-columns:repeat(6,1fr);gap:2px;padding:8px;border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:0 12px 35px rgba(0,0,0,.28)}.emoji-pop button{height:42px;border:0;border-radius:11px;background:transparent;font-size:23px}.emoji-pop button:active{background:var(--panel2)}
.attach-sheet{width:min(520px,100%);display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px;border-radius:24px;background:var(--panel);border:1px solid var(--line);box-shadow:0 18px 60px rgba(0,0,0,.36)}.attach-sheet button{border:0;background:var(--panel2);color:var(--text);border-radius:17px;min-height:90px;display:grid;place-items:center;align-content:center;gap:6px}.attach-sheet b{font-size:27px}.attach-sheet span{font-size:10px}

/* Polls */
.poll-card{min-width:min(70vw,320px);padding:3px 1px}.poll-title{font-size:14px;font-weight:900;line-height:1.7;margin-bottom:2px}.poll-card>small{display:block;color:var(--muted);font-size:9px;margin-bottom:8px}.poll-options{display:grid;gap:6px}.poll-option{position:relative;isolation:isolate;overflow:hidden;width:100%;min-height:39px;border:1px solid color-mix(in srgb,var(--brand) 30%,var(--line));border-radius:11px;background:rgba(255,255,255,.04);color:inherit;display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:6px;text-align:right;padding:7px 8px}.poll-option i{position:absolute;z-index:-1;right:0;bottom:0;top:0;width:var(--w);background:color-mix(in srgb,var(--brand) 12%,transparent)}.poll-option.selected{border-color:var(--brand)}.poll-check{width:19px;height:19px;border:1px solid var(--brand);border-radius:50%;display:grid;place-items:center;color:var(--brand);font-size:9px}.poll-option[data-multi="1"] .poll-check{border-radius:5px}.poll-label{font-size:11px}.poll-option strong{font-size:10px;color:var(--brand2)}.poll-submit{width:100%;margin-top:8px;border:0;border-radius:10px;padding:8px;background:var(--brand);color:#17120a;font-weight:800;font-size:10px}.poll-meta{font-size:9px;color:var(--muted);margin-top:7px;text-align:left}
.poll-form{padding:14px;display:grid;gap:10px}.poll-form label>span{display:block;margin-bottom:5px;font-size:10px;color:var(--muted)}.poll-form textarea,.poll-form input[type="text"],.poll-form input:not([type]){width:100%;border:1px solid var(--line);border-radius:12px;background:var(--panel2);color:var(--text);padding:10px}.poll-option-fields{display:grid;gap:8px}.checkline{display:flex!important;align-items:center;gap:8px;font-size:11px}.checkline span{display:inline!important;margin:0!important}

.compact-menu{max-width:390px;margin-bottom:70px}.main-menu-modal{padding-bottom:calc(8px + env(safe-area-inset-bottom))}

@media(min-width:821px){.bale-bottomnav,.floating-search{display:none}.messenger-home{margin:0;padding-bottom:0}.bale-topbar .brand.centered{position:static;transform:none}.bale-topbar .brand.centered small{display:block}.bale-tabs{border-radius:16px;border:1px solid var(--line);overflow:hidden}.bale-chatlist{border:1px solid var(--line)!important;border-radius:20px!important;margin-top:10px}}
@media(max-width:520px){.content{padding:18px}.message-line .bubble{max-width:82%;padding:9px 10px 7px}.msg-image,.msg-video{width:min(72vw,390px)}.voice{min-width:205px}.voice audio{width:205px}.poll-card{min-width:66vw}.top-search{visibility:hidden}.bale-topbar .brand.centered img{display:none}.bale-topbar .brand.centered strong{font-size:20px}.compact-stories{display:flex;padding:8px 10px 6px;min-height:78px}}


/* V18.11.1 — bubble geometry + iOS long-press selection hotfix */
.message-line .bubble{
  width:fit-content;
  max-width:min(68%,720px);
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  -webkit-tap-highlight-color:transparent;
}
.message-line .bubble *:not(input):not(textarea):not(select){
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
.message-line .bubble img,.message-line .bubble video{
  -webkit-user-drag:none;
  user-drag:none;
}
.message-line .msgtext{
  white-space:pre-wrap;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:none;
  min-width:0;
}
.message-line .replybox{min-width:min(250px,52vw);max-width:100%}
.message-line .bubble:has(.poll-card){min-width:min(340px,56vw);max-width:min(62%,680px)}
.message-line .bubble:has(.media-frame){max-width:min(72%,720px)}
.message-action-backdrop,.attach-sheet-backdrop{
  z-index:2147483000;
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
.message-action-sheet,.message-action-sheet *{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
body.message-sheet-open{overflow:hidden!important}
@media (max-width:820px){
  .message-line .bubble{max-width:82%}
  .message-line .bubble:has(.poll-card){min-width:min(330px,76vw);max-width:84%}
  .message-line .replybox{min-width:min(240px,68vw)}
}
@media (max-width:520px){
  .message-line{padding-right:7px;padding-left:7px}
  .message-line .bubble{max-width:87%;padding:9px 11px 7px}
  .message-line .bubble:has(.poll-card){min-width:min(310px,82vw);max-width:88%}
  .message-line .bubble:has(.media-frame){max-width:88%}
  .message-line .replybox{min-width:min(220px,72vw)}
}

/* V18.11.3 — message flow/media sizing + composer autogrow + iOS viewport hotfix */
body.nasim-chat-mode .messages{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:8px!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
.message-line{
  position:relative!important;
  flex:0 0 auto!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  clear:both!important;
}
.message-line .bubble{
  display:flow-root!important;
  width:auto!important;
  min-width:0!important;
  max-width:min(68%,680px)!important;
  height:auto!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  contain:none!important;
}
.message-line:has(.reaction-badges){padding-bottom:16px!important}
.message-line .bubble:has(.reaction-badges){margin-bottom:0!important}
.message-line .bubble:has(.media-frame),
.message-line .bubble:has(.msg-video){
  width:min(420px,66vw)!important;
  max-width:min(72%,720px)!important;
  padding:9px 9px 7px!important;
}
.message-line .media-frame{
  display:block!important;
  position:relative!important;
  float:none!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  margin:0 0 5px!important;
  overflow:hidden!important;
  border-radius:15px!important;
}
.message-line .msg-image,
.message-line .msg-video{
  position:static!important;
  display:block!important;
  float:none!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  max-height:min(430px,54vh)!important;
  margin:0!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:15px!important;
}
.message-line .bubble:has(.poll-card){
  width:min(390px,58vw)!important;
  min-width:min(330px,54vw)!important;
  max-width:min(62%,680px)!important;
}
.message-line .replybox{
  width:auto!important;
  min-width:min(250px,52vw)!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
/* Textarea grows like native messengers; scrollbar only after the max height. */
.bale-composer textarea,
#saba-form textarea{
  height:auto!important;
  min-height:42px!important;
  max-height:132px!important;
  overflow-y:hidden;
  resize:none!important;
  line-height:1.65!important;
  box-sizing:border-box!important;
}
body.nasim-keyboard-open #app.chat-open{
  top:var(--nasim-vv-top,0px)!important;
  height:var(--nasim-vh,100dvh)!important;
  max-height:var(--nasim-vh,100dvh)!important;
}
body.nasim-keyboard-open .composer-wrap{
  margin:0!important;
  transform:none!important;
}
@media(max-width:820px){
  .message-line .bubble{max-width:82%!important}
  .message-line .bubble:has(.media-frame),.message-line .bubble:has(.msg-video){width:min(430px,76vw)!important;max-width:84%!important}
  .message-line .bubble:has(.poll-card){width:min(360px,78vw)!important;min-width:min(320px,72vw)!important;max-width:85%!important}
}
@media(max-width:520px){
  .message-line{padding-right:7px!important;padding-left:7px!important}
  .message-line .bubble{max-width:87%!important}
  .message-line .bubble:has(.media-frame),.message-line .bubble:has(.msg-video){width:min(390px,80vw)!important;max-width:88%!important}
  .message-line .msg-image,.message-line .msg-video{max-height:46vh!important}
  .message-line .bubble:has(.poll-card){width:min(350px,82vw)!important;min-width:min(300px,78vw)!important;max-width:89%!important}
}

/* V18.12.0 — native messenger composer, notification center, official stories, online entry */
.bale-composer textarea,#saba-form textarea{
  max-height:none!important;
  overflow-y:hidden!important;
  scrollbar-width:none!important;
}
.bale-composer textarea::-webkit-scrollbar,#saba-form textarea::-webkit-scrollbar{display:none!important}
body.nasim-chat-mode .composer-wrap{max-height:none!important;overflow:visible!important}
.notification-bell{position:relative}.notification-bell>b{position:absolute;top:-4px;left:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#d94747;color:#fff;font-size:9px;display:grid;place-items:center;border:2px solid var(--panel)}
.notification-list{overflow:hidden}.notification-row{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px;text-align:right}.notification-row:last-child{border-bottom:0}.notification-row.unread{background:color-mix(in srgb,var(--brand) 8%,var(--panel))}.notification-row>i{font-style:normal;font-size:20px}.notification-row span{min-width:0}.notification-row strong,.notification-row small{display:block}.notification-row small{color:var(--muted);margin-top:4px;line-height:1.7}.notification-row time{font-size:9px;color:var(--muted);white-space:nowrap}
.official-story .ring{border-color:var(--brand)}.official-story-modal{max-width:480px}.official-story-modal p{line-height:1.9}.official-story-media{display:block;width:100%;max-height:62vh;object-fit:contain;border-radius:16px;background:#000;margin-bottom:10px}
.online-room-btn{color:var(--brand)!important}.online-schedule-list{display:grid;gap:8px}.online-schedule-row{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:14px;padding:11px;display:flex;align-items:center;gap:12px;text-align:right}.online-schedule-row span{flex:1;min-width:0}.online-schedule-row strong,.online-schedule-row small{display:block}.online-schedule-row small{color:var(--muted);margin-top:4px}.online-schedule-row>b{color:var(--brand);font-size:11px}
@media(max-width:520px){.notification-row{grid-template-columns:32px minmax(0,1fr);}.notification-row time{grid-column:2}.official-story-modal{width:calc(100vw - 22px)}}

/* V18.13.3 — privacy, in-app media, live badges, hashtags, room settings */
.nav-badge{position:absolute;top:-7px;right:-10px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#d94747;color:#fff;font:800 9px/17px system-ui;border:2px solid var(--panel)}
.bale-bottomnav button>b{position:relative}
.hashtag{display:inline!important;border:0!important;padding:0!important;margin:0!important;background:transparent!important;color:#4eb5e8!important;font:inherit!important;vertical-align:baseline;cursor:pointer;user-select:none!important;-webkit-user-select:none!important}
.hashtag-results{overflow:hidden}.hashtag-result{width:100%;display:grid;gap:5px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);padding:12px;text-align:right}.hashtag-result:last-child{border-bottom:0}.hashtag-result strong{color:var(--brand2)}.hashtag-result span{line-height:1.8}.hashtag-result small{color:var(--muted)}
.media-frame,.file-card{border:0;color:inherit;text-align:inherit;cursor:pointer}
.video-frame{position:relative}.video-play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.62);color:#fff;font-size:22px;padding-left:3px;pointer-events:none}
.media-viewer-backdrop{position:fixed;inset:0;z-index:2147483500;background:rgba(3,7,10,.92);display:flex;align-items:stretch;justify-content:center;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.media-viewer{width:100%;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);background:transparent}.media-viewer>header{height:54px;display:flex;align-items:center;gap:10px;padding:0 14px;color:#fff;background:rgba(10,15,18,.76);border-bottom:1px solid rgba(255,255,255,.12)}.media-viewer>header strong{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.media-viewer>header button{width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font-size:25px}.media-viewer-body{min-height:0;display:grid;place-items:center;overflow:hidden;padding:10px}.media-viewer-body>img,.media-viewer-body>video{display:block;max-width:100%;max-height:100%;object-fit:contain}.media-viewer-body>iframe{width:100%;height:100%;border:0;border-radius:12px;background:#fff}.file-preview-card{width:min(420px,92vw);padding:28px;text-align:center;border:1px solid rgba(255,255,255,.14);border-radius:22px;background:var(--panel);color:var(--text)}.file-big-icon{font-size:54px}.file-preview-card h3{overflow-wrap:anywhere}.file-preview-card p{color:var(--muted)}
.room-info-card{padding:16px!important;display:grid!important;gap:14px!important;overflow:hidden!important}.room-info-identity{display:grid;grid-template-columns:58px minmax(0,1fr);gap:12px;align-items:center}.room-info-identity .avatar{width:58px;height:58px}.room-info-identity h2,.room-info-identity p{margin:0;overflow-wrap:break-word}.room-info-identity p{margin-top:5px;color:var(--muted);line-height:1.7}.room-stats{display:flex!important;flex-wrap:wrap!important;gap:7px!important}.room-stats span{padding:6px 9px;border-radius:999px;background:var(--panel2);font-size:10px;color:var(--muted)}
.room-settings-grid{padding:14px!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important;align-items:center!important}.room-settings-grid>div{min-width:0}.room-settings-grid b,.room-settings-grid small{display:block}.room-settings-grid small{margin-top:4px;color:var(--muted);line-height:1.6}.member-list{overflow:hidden!important}.member-row{display:grid!important;grid-template-columns:42px minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important;padding:10px 12px!important;border-bottom:1px solid var(--line)!important;min-width:0!important}.member-row:last-child{border-bottom:0!important}.member-copy{min-width:0!important}.member-copy b,.member-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-copy small{color:var(--muted);margin-top:3px}.member-actions{display:flex!important;flex-wrap:wrap!important;justify-content:flex-end!important;gap:5px!important;position:static!important}.member-actions button{white-space:nowrap!important}.room-info-back{margin:14px 0 92px}
.privacy-settings input[type=text],.privacy-settings input:not([type]),.privacy-settings select{min-width:180px;max-width:320px;width:100%;border:1px solid var(--line);border-radius:11px;background:var(--panel2);color:var(--text);padding:9px}.privacy-settings .settingrow>span{min-width:0}.privacy-settings .settingrow>span b,.privacy-settings .settingrow>span small{display:block}.privacy-settings .settingrow>span small{color:var(--muted);margin-top:3px}.privacy-toggle input{width:22px;height:22px}
/* User explicitly prefers no textarea inner scrollbar: grow with content. */
.bale-composer textarea,#saba-form textarea{height:auto!important;max-height:none!important;overflow:hidden!important;overflow-y:hidden!important;resize:none!important;scrollbar-width:none!important}
@media(max-width:620px){.room-settings-grid{grid-template-columns:1fr!important}.room-settings-grid .btn{width:100%}.member-row{grid-template-columns:40px minmax(0,1fr)!important}.member-actions{grid-column:1/-1!important;justify-content:stretch!important;padding-right:50px!important}.member-actions button{flex:1 1 120px!important}.privacy-settings .settingrow{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;align-items:start!important}.privacy-settings input,.privacy-settings select{max-width:none!important}.media-viewer-body{padding:4px}.media-viewer>header{height:50px}.room-info-back{margin-bottom:105px}}


/* V18.13.4 — header/tabs/attachment/viewer/privacy/channel UX hotfix */
.bale-topbar{display:flex!important;align-items:center!important;gap:6px!important;position:relative!important}
.bale-topbar .brand.centered{position:static!important;left:auto!important;transform:none!important;flex:1 1 auto!important;min-width:0!important;justify-content:center!important;text-align:center!important;overflow:hidden!important}
.bale-topbar .brand.centered>div{min-width:0!important}.bale-topbar .brand.centered strong{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.bale-topbar .iconbtn{flex:0 0 42px!important;position:relative!important;z-index:2!important}.notification-bell{margin-inline:0!important}
.privacy-settings{display:grid!important;gap:14px!important;padding-bottom:16px!important}.privacy-settings>.btn[type=submit]{margin-top:8px!important;min-height:44px!important;width:100%!important}
.attach-sheet-backdrop{position:fixed;inset:0;z-index:2147483200;background:rgba(0,0,0,.36);display:flex;align-items:flex-end;justify-content:center;padding:12px 12px calc(12px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.attach-sheet{width:min(520px,100%);background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:8px;box-shadow:0 24px 70px rgba(0,0,0,.34);display:grid;gap:5px}.attach-grabber{width:42px;height:4px;border-radius:99px;background:var(--line);margin:2px auto 5px}.attach-sheet button{border:0;background:transparent;color:var(--text);min-height:54px;border-radius:15px;padding:8px 12px;display:flex;align-items:center;gap:12px;text-align:right;font:inherit}.attach-sheet button:active{background:var(--panel2)}.attach-sheet button b{width:38px;height:38px;border-radius:12px;background:var(--panel2);display:grid;place-items:center;font-size:20px}.attach-sheet button span{font-weight:750}.attach-sheet .attach-cancel{justify-content:center;color:var(--muted);border-top:1px solid var(--line);border-radius:0;margin-top:3px}.attach-sheet .attach-cancel span{font-weight:700}
.media-viewer-backdrop{touch-action:none!important;transition:opacity .16s ease}.media-viewer{transition:transform .12s ease;will-change:transform}.media-viewer>header{padding-top:max(0px,env(safe-area-inset-top))!important;box-sizing:content-box!important}.media-viewer>header .media-back{font-size:32px!important;line-height:1!important}.media-viewer-open{overflow:hidden!important;overscroll-behavior:none!important}
.message-action-sheet.reaction-only .quick-reactions{border-bottom:0!important}.message-action-sheet.reaction-only{padding-bottom:8px!important}
@media(max-width:520px){.bale-topbar{padding-inline:8px!important;gap:2px!important}.bale-topbar .top-search{display:none!important}.bale-topbar .brand.centered img{display:none!important}.bale-topbar .brand.centered strong{font-size:18px!important}.bale-topbar .notification-bell,.bale-topbar>.iconbtn:last-child{flex-basis:40px!important;width:40px!important}.privacy-settings{gap:16px!important}.privacy-settings>.btn[type=submit]{margin-top:10px!important}.bale-tabs button{touch-action:manipulation}}

/* V18.13.5 — voice/media actions, full settings pages, profile editor, polished attachment sheet */
.full-menu-page{overflow:hidden;padding:0!important}
.menu-page-row{width:100%;min-height:72px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);display:grid;grid-template-columns:48px minmax(0,1fr) 24px;align-items:center;gap:11px;padding:10px 14px;text-align:right}
.menu-page-row:last-child{border-bottom:0}.menu-page-row>i{width:44px;height:44px;border-radius:14px;background:var(--panel2);display:grid;place-items:center;font-style:normal;font-size:21px;color:var(--brand2)}.menu-page-row span{min-width:0}.menu-page-row b,.menu-page-row small{display:block}.menu-page-row small{color:var(--muted);margin-top:4px;line-height:1.6}.menu-page-row em{font-style:normal;color:var(--muted);font-size:24px}.menu-page-row:active{background:var(--panel2)}
.page-title-card{display:flex;align-items:center;gap:12px;margin:2px 0 18px}.page-title-card h1,.page-title-card p{margin:0}.page-title-card h1{font-size:19px}.page-title-card p{color:var(--muted);margin-top:4px;font-size:11px}.back-page{width:42px;height:42px;border:1px solid var(--line);border-radius:13px;background:var(--panel);color:var(--text);font-size:20px;display:grid;place-items:center}
.profile-editor{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;gap:16px!important;padding:16px!important}.profile-avatar-wrap{display:grid;justify-items:center;gap:7px}.avatar.profile-lg{width:82px;height:82px;font-size:28px}.profile-avatar-wrap form{margin:0}.avatar-pick{cursor:pointer;font-size:10px;padding:7px 10px!important}.profile-avatar-wrap .ghost{font-size:9px;padding:4px 7px!important;background:transparent!important;border:0!important}.privacy-save-row{padding-top:8px;margin-top:2px;border-top:1px solid var(--line)}.privacy-save-row .btn{width:100%;min-height:44px}.push-setting>span{display:grid;gap:4px}.push-hint{display:block;max-width:540px;line-height:1.65}.push-hint.warn{color:#d9a554}.push-hint.ok{color:#43b994}
.voice{display:flex!important;align-items:center!important;gap:8px!important;min-width:min(290px,64vw)!important;padding:7px 4px!important}.voice>span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--brand) 14%,var(--panel2));flex:0 0 34px}.voice audio{display:block!important;width:min(260px,55vw)!important;height:34px!important;max-width:100%!important}
/* Phone: true bottom sheet. Desktop: compact anchored popover above composer. */
.attach-sheet{grid-template-columns:1fr!important}.attach-sheet button{min-height:58px!important}.attach-sheet button b{flex:0 0 40px!important}
@media(min-width:821px){.attach-sheet-backdrop{background:transparent!important;align-items:flex-end!important;justify-content:flex-start!important;pointer-events:none!important;padding:0 0 84px 330px!important}.attach-sheet{width:330px!important;pointer-events:auto!important;border-radius:18px!important;box-shadow:0 18px 55px rgba(0,0,0,.3)!important}.attach-sheet .attach-grabber{display:none!important}.attach-sheet button{min-height:52px!important}}
@media(max-width:620px){.profile-editor{grid-template-columns:1fr!important;text-align:center!important}.profile-editor>div:last-child p{line-height:1.8}.page-title-card{padding-inline:2px}}

/* V18.13.6 media/story polish */
.media-viewer-actions{display:flex;align-items:center;gap:8px}.media-viewer .media-delete{color:#ff6b6b;border-color:rgba(255,107,107,.35)}.viewer-audio{display:flex;align-items:center;gap:12px;padding:18px;border-radius:18px;background:var(--panel);min-width:min(420px,88vw)}.viewer-audio audio{width:100%}.official-story{flex:0 0 68px}.compact-stories:has(.official-story){display:flex!important}

/* V18.14.0 cumulative — forward payload + centered attach button */
.bale-composer .attach-btn{padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important}
.bale-composer .attach-btn>span{display:block!important;width:100%;text-align:center;font:700 27px/1 Arial,sans-serif;transform:translateY(-1px)}
.forwarded-content{border-right:3px solid var(--brand);padding:6px 9px 7px;margin:0 0 6px;border-radius:9px;background:color-mix(in srgb,var(--panel2) 82%,transparent);overflow:hidden}
.forwarded-content .forwarded{margin:0 0 5px;padding:0;border:0;background:transparent;color:var(--brand);font-size:10px;font-weight:800}
.forwarded-content .media-frame,.forwarded-content .file-card{margin-top:5px;max-width:100%}
.forward-body{margin-top:5px}.forward-empty{font-size:10px;color:var(--muted);padding:4px 0}
.forward-poll{display:grid;gap:5px}.forward-poll>strong{font-size:11px}.forward-poll-option{display:flex;align-items:center;gap:8px;font-size:10px}.forward-poll-option span{flex:1}.forward-poll-option b{color:var(--muted)}

/* V18.15.2 — first-entry Push onboarding */
.push-onboarding{z-index:180;background:rgba(3,8,12,.68);backdrop-filter:blur(5px)}
.push-onboarding-modal{width:min(460px,100%)}
.push-onboarding-body{padding:24px 20px 20px;text-align:center}
.push-onboarding-icon{width:72px;height:72px;margin:0 auto 12px;display:grid;place-items:center;border-radius:24px;background:color-mix(in srgb,var(--brand) 18%,var(--panel2));font-size:34px;border:1px solid color-mix(in srgb,var(--brand) 38%,var(--line))}
.push-onboarding-body h2{margin:0 0 8px;font-size:18px}
.push-onboarding-body p{margin:0 auto 18px;max-width:370px;color:var(--muted);font-size:12px;line-height:1.95}
.push-onboarding-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.push-onboarding-actions .btn{min-height:46px}
.push-onboarding-body>small{display:block;margin-top:12px;color:var(--muted);font-size:9.5px;line-height:1.75}
@media(max-width:460px){.push-onboarding{padding:10px}.push-onboarding-actions{grid-template-columns:1fr}.push-onboarding-modal{border-radius:22px}}


/* V18.15.19 — composer readability/autogrow + dismissible emoji picker */
.bale-composer textarea,#saba-form textarea{
  height:44px;
  min-height:44px!important;
  max-height:min(240px,34dvh)!important;
  overflow-y:hidden!important;
  resize:none!important;
  line-height:1.65!important;
  box-sizing:border-box!important;
  transition:height .09s ease,border-color .15s,box-shadow .15s!important;
}
.emoji-pop{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
@media(max-width:620px){
  .bale-composer textarea,#saba-form textarea{font-size:16px!important;min-height:44px!important;max-height:min(220px,32dvh)!important}
}

/* V18.15.22 — voice playback reliability */
.voice-known-duration{font-size:9px;color:var(--muted);white-space:nowrap;min-width:34px;text-align:center}


/* V18.15.23 — messenger-style voice notes */
.voice.voice-player{display:flex!important;align-items:center!important;gap:9px!important;width:min(330px,72vw)!important;min-width:min(270px,66vw)!important;padding:7px 2px!important;direction:ltr}
.voice-player .nasim-voice-audio{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important}
.voice-play{width:42px;height:42px;flex:0 0 42px;border:0;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#17120a;font-size:17px;font-weight:900;box-shadow:0 4px 16px color-mix(in srgb,var(--brand) 24%,transparent);transition:transform .12s,filter .18s}
.voice-play:active{transform:scale(.92)}
.voice-player.is-loading .voice-play{animation:voice-spin-glow 1s infinite alternate}@keyframes voice-spin-glow{to{filter:brightness(1.3);box-shadow:0 0 0 5px color-mix(in srgb,var(--brand) 14%,transparent)}}
.voice-body{min-width:0;flex:1;display:flex;flex-direction:column;gap:5px;direction:rtl}
.voice-wave{height:31px;display:flex;align-items:center;gap:2px;cursor:pointer;touch-action:none;direction:ltr;padding:2px 0;outline:0}
.voice-wave i{display:block;flex:1;min-width:2px;max-width:4px;height:var(--vh,55%);border-radius:999px;background:color-mix(in srgb,var(--muted) 58%,transparent);transition:background .08s,transform .08s}
.voice-wave i.played,.voice-player.is-playing .voice-wave i.played{background:var(--brand)}
.voice-wave:focus-visible{outline:2px solid color-mix(in srgb,var(--brand) 60%,transparent);outline-offset:3px;border-radius:6px}
.voice-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:18px;color:var(--muted);font-size:9px;direction:ltr}
.voice-time{font-variant-numeric:tabular-nums;min-width:34px;text-align:left}
.voice-speed{border:0;background:color-mix(in srgb,var(--brand) 12%,var(--panel2));color:var(--text);height:20px;min-width:31px;padding:0 6px;border-radius:999px;font-size:9px;font-weight:800;direction:ltr}
.voice-mic-badge{width:34px;height:34px;flex:0 0 34px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--brand) 14%,var(--panel2));font-size:17px;direction:ltr}
.message-line.mine .voice-play{background:color-mix(in srgb,var(--brand) 90%,#fff 10%)}

.composer-wrap.recording-active .bale-composer{display:none!important}
.recording-panel.messenger-recorder{min-height:58px;margin:6px 8px;padding:7px 8px;border-radius:20px;display:flex;align-items:center;gap:8px;background:var(--panel2);border:1px solid color-mix(in srgb,var(--danger) 30%,var(--line));box-shadow:0 8px 28px rgba(0,0,0,.12);direction:ltr}
.recording-panel.messenger-recorder[hidden]{display:none!important}
.messenger-recorder .record-cancel,.messenger-recorder .record-send{width:42px;height:42px;flex:0 0 42px;padding:0!important;border-radius:50%!important;display:grid;place-items:center;font-size:20px!important;font-weight:900!important}
.messenger-recorder .record-cancel{background:transparent!important;color:var(--danger)!important;border:1px solid color-mix(in srgb,var(--danger) 35%,var(--line))!important}
.messenger-recorder .record-send{background:var(--brand)!important;color:#17120a!important;border:0!important;transform:rotate(180deg)}
.messenger-recorder .record-pulse{width:9px;height:9px;flex:0 0 9px}
.messenger-recorder .record-time{color:var(--danger);font-size:12px;min-width:38px;font-variant-numeric:tabular-nums;text-align:center}
.record-live-wave{height:34px;min-width:0;flex:1;display:flex;align-items:center;gap:2px;overflow:hidden}
.record-live-wave i{display:block;flex:1;min-width:2px;max-width:5px;height:76%;border-radius:999px;background:color-mix(in srgb,var(--danger) 70%,var(--muted));transform:scaleY(.24);transform-origin:center;transition:transform .08s linear}
@media(max-width:520px){.voice.voice-player{width:min(300px,73vw)!important;min-width:min(245px,66vw)!important}.voice-wave{gap:1.6px}.voice-play{width:40px;height:40px;flex-basis:40px}.voice-mic-badge{width:31px;height:31px;flex-basis:31px}.recording-panel.messenger-recorder{margin:5px 6px}.messenger-recorder .record-cancel,.messenger-recorder .record-send{width:40px;height:40px;flex-basis:40px}}


/* V18.15.24 — WhatsApp-inspired voice note visual redesign */
:root{
  --wa-voice-green:#00a884;
  --wa-voice-green-2:#25d366;
  --wa-voice-blue:#53bdeb;
  --wa-voice-in:#ffffff;
  --wa-voice-out:#d9fdd3;
  --wa-voice-muted:#667781;
  --wa-voice-bars:#8696a0;
}
html[data-theme="dark"]{
  --wa-voice-in:#202c33;
  --wa-voice-out:#005c4b;
  --wa-voice-muted:#8696a0;
  --wa-voice-bars:#667781;
}

/* voice messages get the compact WhatsApp bubble treatment */
.message-line .bubble:has(.wa-voice){
  padding:7px 8px 5px!important;
  min-width:0!important;
  width:auto!important;
  max-width:min(365px,88vw)!important;
  background:var(--wa-voice-in)!important;
  color:var(--text)!important;
  border:0!important;
  box-shadow:0 1px 2px rgba(0,0,0,.12)!important;
}
.message-line.mine .bubble:has(.wa-voice){
  background:var(--wa-voice-out)!important;
}
html[data-theme="dark"] .message-line .bubble:has(.wa-voice){
  color:#e9edef!important;
}
html[data-theme="light"] .message-line.mine .bubble:has(.wa-voice){
  color:#111b21!important;
}

/* main row */
.voice.voice-player.wa-voice{
  position:relative;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  width:min(335px,80vw)!important;
  min-width:min(285px,74vw)!important;
  margin:0!important;
  padding:1px 0 0!important;
  direction:ltr;
  background:transparent!important;
}
.wa-voice .nasim-voice-audio{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
}

/* WhatsApp-like play / pause */
.wa-voice .voice-play{
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:transparent!important;
  color:var(--wa-voice-muted)!important;
  box-shadow:none!important;
  transition:transform .1s ease,color .12s ease,opacity .12s ease!important;
}
.wa-voice .voice-play svg{width:29px;height:29px;display:block;fill:currentColor}
.wa-voice .voice-play:active{transform:scale(.9)!important}
.wa-voice.is-playing .voice-play{color:var(--wa-voice-green)!important}
.wa-voice.is-loading .voice-play{opacity:.62;animation:wa-voice-pulse .8s ease-in-out infinite alternate}
@keyframes wa-voice-pulse{to{opacity:1}}

/* waveform + draggable WhatsApp-like progress dot */
.wa-voice .voice-body{
  min-width:0!important;
  flex:1 1 auto!important;
  display:flex!important;
  flex-direction:column!important;
  gap:1px!important;
  direction:ltr!important;
}
.wa-voice .voice-wave{
  position:relative!important;
  height:31px!important;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  gap:1.35px!important;
  padding:4px 4px 3px 0!important;
  cursor:pointer!important;
  touch-action:none!important;
  direction:ltr!important;
  overflow:visible!important;
}
.wa-voice .voice-wave i{
  position:relative;
  z-index:1;
  display:block!important;
  flex:1 1 2px!important;
  min-width:1.6px!important;
  max-width:3px!important;
  height:var(--vh,52%)!important;
  border-radius:3px!important;
  background:var(--wa-voice-bars)!important;
  opacity:.66!important;
  transition:background .06s linear,opacity .06s linear!important;
}
.wa-voice .voice-wave i.played{
  background:var(--wa-voice-green)!important;
  opacity:1!important;
}
.wa-voice .voice-progress-dot{
  position:absolute;
  z-index:3;
  left:0;
  top:50%;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--wa-voice-green);
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--wa-voice-green) 85%,#fff 15%);
  pointer-events:none;
}
.wa-voice .voice-wave:focus-visible{
  outline:2px solid color-mix(in srgb,var(--wa-voice-green) 58%,transparent)!important;
  outline-offset:2px!important;
  border-radius:5px!important;
}

/* duration under waveform */
.wa-voice .voice-meta{
  min-height:14px!important;
  height:14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:4px!important;
  padding-left:1px!important;
  direction:ltr!important;
  color:var(--wa-voice-muted)!important;
  font-size:10px!important;
  line-height:1!important;
}
.wa-voice .voice-time{
  min-width:34px!important;
  text-align:left!important;
  font-size:10px!important;
  line-height:1!important;
  font-variant-numeric:tabular-nums!important;
  color:inherit!important;
}

/* playback speed: small unobtrusive chip, like WhatsApp */
.wa-voice .voice-speed{
  align-self:flex-start!important;
  width:34px!important;
  min-width:34px!important;
  height:22px!important;
  margin-top:4px!important;
  padding:0!important;
  border:0!important;
  border-radius:11px!important;
  display:grid!important;
  place-items:center!important;
  background:color-mix(in srgb,var(--wa-voice-muted) 18%,transparent)!important;
  color:var(--wa-voice-muted)!important;
  font-size:9.5px!important;
  line-height:1!important;
  font-weight:700!important;
  direction:ltr!important;
  box-shadow:none!important;
}
.wa-voice .voice-speed:active{transform:scale(.92)}
.wa-voice.is-playing .voice-speed{
  background:color-mix(in srgb,var(--wa-voice-green) 16%,transparent)!important;
  color:var(--wa-voice-green)!important;
}

/* sender avatar with the little microphone badge used by WhatsApp */
.wa-voice .voice-avatar{
  position:relative!important;
  width:40px!important;
  height:40px!important;
  flex:0 0 40px!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
  background:#667781!important;
  color:#fff!important;
  font-size:16px!important;
  font-weight:700!important;
  direction:rtl!important;
}
.wa-voice .voice-avatar>img,
.wa-voice .voice-avatar-initial{
  width:40px!important;
  height:40px!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  object-fit:cover!important;
  overflow:hidden!important;
}
.wa-voice .voice-avatar-mic{
  position:absolute!important;
  left:-2px!important;
  bottom:-2px!important;
  width:17px!important;
  height:17px!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:var(--wa-voice-in)!important;
  color:var(--wa-voice-blue)!important;
  box-shadow:0 0 0 1.5px var(--wa-voice-in)!important;
}
.message-line.mine .wa-voice .voice-avatar-mic{
  background:var(--wa-voice-out)!important;
  box-shadow:0 0 0 1.5px var(--wa-voice-out)!important;
}
.wa-voice .voice-avatar-mic svg{width:12px;height:12px;fill:currentColor}

/* let the normal bubble timestamp sit tightly under the voice row */
.message-line .bubble:has(.wa-voice)>small{
  margin-top:1px!important;
  min-height:11px!important;
  font-size:9px!important;
  opacity:.76!important;
}

/* WhatsApp-like recording strip */
.recording-panel.messenger-recorder{
  min-height:58px!important;
  margin:6px 7px!important;
  padding:6px 7px!important;
  border:0!important;
  border-radius:28px!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  background:var(--wa-voice-in)!important;
  box-shadow:0 1px 3px rgba(0,0,0,.14)!important;
  direction:ltr!important;
}
.recording-panel.messenger-recorder[hidden]{display:none!important}
.messenger-recorder .record-cancel,
.messenger-recorder .record-send{
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  box-shadow:none!important;
  transform:none!important;
}
.messenger-recorder .record-cancel{
  background:transparent!important;
  color:#ea0038!important;
}
.messenger-recorder .record-send{
  background:var(--wa-voice-green)!important;
  color:#fff!important;
}
.messenger-recorder .record-cancel svg{width:23px;height:23px;fill:currentColor}
.messenger-recorder .record-send svg{width:23px;height:23px;fill:currentColor}
.messenger-recorder .record-pulse{
  width:9px!important;
  height:9px!important;
  flex:0 0 9px!important;
  margin-left:1px!important;
  background:#ea0038!important;
  box-shadow:none!important;
  animation:wa-rec-dot 1s ease-in-out infinite!important;
}
@keyframes wa-rec-dot{50%{opacity:.35}}
.messenger-recorder .record-time{
  min-width:39px!important;
  color:#ea0038!important;
  font-size:12px!important;
  font-weight:500!important;
  font-variant-numeric:tabular-nums!important;
  text-align:center!important;
}
.messenger-recorder .record-live-wave{
  height:34px!important;
  min-width:0!important;
  flex:1 1 auto!important;
  display:flex!important;
  align-items:center!important;
  gap:1.4px!important;
  overflow:hidden!important;
}
.messenger-recorder .record-live-wave i{
  display:block!important;
  flex:1 1 2px!important;
  min-width:1.5px!important;
  max-width:3px!important;
  height:72%!important;
  border-radius:3px!important;
  background:var(--wa-voice-bars)!important;
  opacity:.8!important;
  transform:scaleY(.24);
  transform-origin:center;
  transition:transform .07s linear!important;
}

/* iPhone / narrow widths */
@media(max-width:520px){
  .message-line .bubble:has(.wa-voice){
    max-width:90vw!important;
    padding:6px 7px 5px!important;
  }
  .voice.voice-player.wa-voice{
    width:min(326px,84vw)!important;
    min-width:min(272px,76vw)!important;
    gap:6px!important;
  }
  .wa-voice .voice-play{width:39px!important;height:39px!important;flex-basis:39px!important}
  .wa-voice .voice-play svg{width:27px;height:27px}
  .wa-voice .voice-avatar,.wa-voice .voice-avatar>img,.wa-voice .voice-avatar-initial{width:38px!important;height:38px!important}
  .wa-voice .voice-avatar{flex-basis:38px!important}
  .wa-voice .voice-speed{width:31px!important;min-width:31px!important;height:21px!important;font-size:9px!important}
  .wa-voice .voice-wave{gap:1.15px!important}
  .recording-panel.messenger-recorder{margin:5px 6px!important}
  .messenger-recorder .record-cancel,.messenger-recorder .record-send{width:40px!important;height:40px!important;flex-basis:40px!important}
}


/* V18.15.25 — WhatsApp structure, Nasim Saba colors */
:root{
  --ns-voice-in:#303233;
  --ns-voice-out:#72571f;
  --ns-voice-text:#f5f5f5;
  --ns-voice-muted:#a5a8aa;
  --ns-voice-wave:#7a7d7f;
  --ns-voice-accent:#d6a33e;
}
html[data-theme="light"]{
  --ns-voice-in:#ffffff;
  --ns-voice-out:#f2d58c;
  --ns-voice-text:#211b10;
  --ns-voice-muted:#6f6a60;
  --ns-voice-wave:#9d9a92;
  --ns-voice-accent:#b78320;
}

/* Keep the messenger's own palette. Only the voice-note geometry follows WhatsApp. */
.message-line .bubble:has(.wa-voice){
  width:min(640px,82vw)!important;
  max-width:min(640px,88vw)!important;
  min-width:min(300px,68vw)!important;
  padding:10px 11px 7px!important;
  background:var(--ns-voice-in)!important;
  color:var(--ns-voice-text)!important;
  border:0!important;
  border-radius:18px 18px 6px 18px!important;
  box-shadow:none!important;
}
.message-line.mine .bubble:has(.wa-voice){
  background:var(--ns-voice-out)!important;
  color:var(--ns-voice-text)!important;
  border-radius:18px 18px 18px 6px!important;
}

/* WhatsApp geometry: incoming = Play | Wave | Avatar ; outgoing = Avatar | Play | Wave */
.voice.voice-player.wa-voice{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:0!important;
  margin:0!important;
  direction:ltr!important;
  background:transparent!important;
}
.wa-voice .voice-play{order:1!important}
.wa-voice .voice-body{order:2!important}
.wa-voice .voice-avatar{order:3!important}
.message-line.mine .wa-voice .voice-avatar{order:1!important}
.message-line.mine .wa-voice .voice-play{order:2!important}
.message-line.mine .wa-voice .voice-body{order:3!important}

/* WhatsApp screenshot does not expose the speed chip in the idle voice row. */
.wa-voice .voice-speed{display:none!important}

.wa-voice .voice-play{
  width:40px!important;
  height:40px!important;
  flex:0 0 40px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  color:var(--ns-voice-muted)!important;
  box-shadow:none!important;
}
.wa-voice .voice-play svg{width:30px!important;height:30px!important;fill:currentColor!important}
.wa-voice.is-playing .voice-play{color:var(--ns-voice-accent)!important}

.wa-voice .voice-avatar{
  width:48px!important;
  height:48px!important;
  flex:0 0 48px!important;
  border-radius:50%!important;
  overflow:visible!important;
  background:#555!important;
}
.wa-voice .voice-avatar>img,
.wa-voice .voice-avatar-initial{
  width:48px!important;
  height:48px!important;
  border-radius:50%!important;
  object-fit:cover!important;
}
.wa-voice .voice-avatar-mic{
  left:-2px!important;
  right:auto!important;
  bottom:-2px!important;
  width:18px!important;
  height:18px!important;
  background:var(--ns-voice-in)!important;
  color:var(--ns-voice-accent)!important;
  box-shadow:0 0 0 2px var(--ns-voice-in)!important;
}
.message-line.mine .wa-voice .voice-avatar-mic{
  left:auto!important;
  right:-2px!important;
  background:var(--ns-voice-out)!important;
  box-shadow:0 0 0 2px var(--ns-voice-out)!important;
}
.wa-voice .voice-avatar-mic svg{width:13px!important;height:13px!important}

.wa-voice .voice-body{
  min-width:0!important;
  flex:1 1 auto!important;
  gap:0!important;
  padding-top:2px!important;
  direction:ltr!important;
}
.wa-voice .voice-wave{
  position:relative!important;
  height:32px!important;
  min-width:0!important;
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  gap:1.2px!important;
  padding:3px 4px 2px!important;
  overflow:visible!important;
}
.wa-voice .voice-wave i{
  flex:1 1 2px!important;
  min-width:1.4px!important;
  max-width:3px!important;
  border-radius:3px!important;
  background:var(--ns-voice-wave)!important;
  opacity:.72!important;
}
.message-line.mine .wa-voice .voice-wave i{background:color-mix(in srgb,#fff 48%,var(--ns-voice-out))!important;opacity:.62!important}
.wa-voice .voice-wave i.played,
.message-line.mine .wa-voice .voice-wave i.played{
  background:var(--ns-voice-accent)!important;
  opacity:1!important;
}
.wa-voice .voice-progress-dot{
  width:11px!important;
  height:11px!important;
  background:var(--ns-voice-accent)!important;
  box-shadow:none!important;
}

/* Duration is below the waveform; sent time/read state remain in the bubble footer. */
.wa-voice .voice-meta{
  height:15px!important;
  min-height:15px!important;
  padding:0 4px!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  color:var(--ns-voice-muted)!important;
  font-size:10px!important;
  line-height:1!important;
}
.message-line.mine .wa-voice .voice-meta{color:color-mix(in srgb,#fff 58%,var(--ns-voice-out))!important}
.wa-voice .voice-time{font-size:10px!important;min-width:34px!important;color:inherit!important}
.message-line .bubble:has(.wa-voice)>small{
  margin-top:0!important;
  padding:0!important;
  min-height:12px!important;
  font-size:9px!important;
  line-height:1.15!important;
  text-align:right!important;
  color:var(--ns-voice-muted)!important;
  opacity:.9!important;
}
.message-line.mine .bubble:has(.wa-voice)>small{color:color-mix(in srgb,#fff 62%,var(--ns-voice-out))!important}

/* Recorder keeps Nasim Saba colors while retaining the clean WhatsApp-like layout. */
.recording-panel.messenger-recorder{
  background:var(--panel2)!important;
  border:1px solid var(--line)!important;
  box-shadow:none!important;
}
.messenger-recorder .record-send{background:var(--brand)!important;color:#17120a!important}
.messenger-recorder .record-live-wave i{background:color-mix(in srgb,var(--brand) 58%,var(--muted))!important}

@media(max-width:520px){
  .message-line .bubble:has(.wa-voice){
    width:min(620px,84vw)!important;
    max-width:88vw!important;
    min-width:min(295px,72vw)!important;
    padding:9px 10px 6px!important;
  }
  .voice.voice-player.wa-voice{gap:6px!important}
  .wa-voice .voice-avatar,.wa-voice .voice-avatar>img,.wa-voice .voice-avatar-initial{width:44px!important;height:44px!important}
  .wa-voice .voice-avatar{flex-basis:44px!important}
  .wa-voice .voice-play{width:38px!important;height:38px!important;flex-basis:38px!important}
  .wa-voice .voice-play svg{width:28px!important;height:28px!important}
  .wa-voice .voice-wave{height:30px!important;gap:1px!important;padding-right:2px!important;padding-left:2px!important}
}


/* V18.15.26 — WhatsApp-like waveform + scrubber sync */
.wa-voice .voice-wave{
  position:relative!important;
  height:30px!important;
  width:100%!important;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  gap:1.5px!important;
  padding:3px 7px 2px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  touch-action:none!important;
}
.wa-voice .voice-wave i{
  flex:1 1 0!important;
  min-width:1.5px!important;
  max-width:2.8px!important;
  height:var(--voice-bar,7px)!important;
  border-radius:999px!important;
  transform:none!important;
  transform-origin:center!important;
  background:var(--ns-voice-wave)!important;
  opacity:.72!important;
  transition:background .045s linear,opacity .045s linear!important;
}
.message-line.mine .wa-voice .voice-wave i{
  background:color-mix(in srgb,#fff 46%,var(--ns-voice-out))!important;
  opacity:.62!important;
}
.wa-voice .voice-wave i.played,
.message-line.mine .wa-voice .voice-wave i.played{
  background:var(--ns-voice-accent)!important;
  opacity:1!important;
}
.wa-voice .voice-progress-dot{
  position:absolute!important;
  z-index:4!important;
  top:50%!important;
  left:7px;
  width:11px!important;
  height:11px!important;
  border-radius:50%!important;
  transform:translate(-50%,-50%)!important;
  background:var(--ns-voice-accent)!important;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--ns-voice-accent) 78%,transparent)!important;
  pointer-events:none!important;
  will-change:left!important;
  transition:none!important;
}
.wa-voice.is-playing .voice-progress-dot{box-shadow:0 0 0 2px color-mix(in srgb,var(--ns-voice-accent) 22%,transparent)!important}
@media(max-width:520px){
  .wa-voice .voice-wave{height:29px!important;gap:1.25px!important;padding-left:7px!important;padding-right:7px!important}
  .wa-voice .voice-wave i{min-width:1.35px!important;max-width:2.5px!important}
}


/* V18.15.27 — WhatsApp-style composer + camera + refined voice geometry, Nasim palette */
.wa-composer{direction:ltr!important;display:flex!important;align-items:flex-end!important;gap:7px!important;padding:7px 9px calc(7px + env(safe-area-inset-bottom))!important;background:var(--panel)!important;min-height:58px!important}
.wa-composer .attach-btn,.wa-composer .camera-btn,.wa-composer .mic,.wa-composer .send{width:42px!important;height:42px!important;flex:0 0 42px!important;border:0!important;background:transparent!important;color:var(--text)!important;border-radius:50%!important;box-shadow:none!important;padding:0!important;display:grid!important;place-items:center!important;-webkit-tap-highlight-color:transparent!important}
.wa-composer .attach-btn>svg{width:31px;height:31px;fill:currentColor}.wa-composer .camera-btn svg{width:27px;height:27px;fill:currentColor}.wa-composer .mic svg{width:27px;height:27px;fill:currentColor}.wa-composer .send svg{width:25px;height:25px;fill:currentColor}
.wa-composer .wa-input-shell{direction:rtl!important;flex:1 1 auto!important;min-width:0!important;display:flex!important;align-items:flex-end!important;gap:3px!important;min-height:42px!important;border:1px solid color-mix(in srgb,var(--line) 92%,transparent)!important;background:var(--panel2)!important;border-radius:23px!important;padding:0 5px 0 7px!important;overflow:hidden!important}
.wa-composer .wa-input-shell .emoji-btn{width:36px!important;height:42px!important;flex:0 0 36px!important;border:0!important;background:transparent!important;color:var(--muted)!important;padding:0!important;display:grid!important;place-items:center!important}.wa-composer .wa-input-shell .emoji-btn svg{width:24px;height:24px;fill:currentColor}
.wa-composer .wa-input-shell textarea{flex:1 1 auto!important;min-width:0!important;width:100%!important;border:0!important;background:transparent!important;color:var(--text)!important;box-shadow:none!important;border-radius:0!important;padding:10px 5px!important;min-height:42px!important;font-size:16px!important;line-height:1.45!important}.wa-composer .wa-input-shell textarea::placeholder{color:var(--muted)!important;opacity:.92}
.wa-composer .send{display:none!important;background:var(--brand)!important;color:#17120a!important}.wa-composer.has-content .send{display:grid!important}.wa-composer.has-content .mic{display:none!important}
.wa-composer .camera-btn:active,.wa-composer .mic:active,.wa-composer .attach-btn:active,.wa-composer .send:active{transform:scale(.91)!important}
.voice.voice-player.wa-voice{gap:9px!important;align-items:center!important}.wa-voice .voice-body{min-width:0!important;flex:1 1 auto!important}.wa-voice .voice-wave{height:30px!important;min-height:30px!important;display:flex!important;align-items:center!important;gap:2px!important;padding:0 9px!important;overflow:visible!important;position:relative!important}.wa-voice .voice-wave i{width:3px!important;min-width:3px!important;max-width:3px!important;flex:0 0 3px!important;height:var(--voice-bar,8px)!important;border-radius:999px!important;transform:none!important}.wa-voice .voice-progress-dot{width:18px!important;height:18px!important;border-radius:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;z-index:4!important;pointer-events:none!important}.wa-voice .voice-meta{padding:0 9px!important;margin-top:-1px!important}.wa-voice .voice-avatar{width:44px!important;height:44px!important;flex:0 0 44px!important}.wa-voice .voice-avatar>img,.wa-voice .voice-avatar-initial{width:44px!important;height:44px!important}.wa-voice .voice-play{width:40px!important;height:40px!important;flex:0 0 40px!important}
@media(max-width:520px){.wa-composer{gap:4px!important;padding-left:6px!important;padding-right:6px!important}.wa-composer .attach-btn,.wa-composer .camera-btn,.wa-composer .mic,.wa-composer .send{width:39px!important;height:39px!important;flex-basis:39px!important}.wa-composer .attach-btn>svg{width:29px;height:29px}.wa-composer .camera-btn svg,.wa-composer .mic svg{width:25px;height:25px}.wa-composer .wa-input-shell{min-height:40px!important;border-radius:21px!important}.wa-composer .wa-input-shell textarea{min-height:40px!important;padding-top:9px!important;padding-bottom:9px!important}.voice.voice-player.wa-voice{width:min(330px,78vw)!important;min-width:min(270px,68vw)!important}.wa-voice .voice-wave{gap:1.7px!important;padding-left:7px!important;padding-right:7px!important}.wa-voice .voice-wave i{width:2.7px!important;min-width:2.7px!important;max-width:2.7px!important;flex-basis:2.7px!important}}

/* V18.15.28 — compact WhatsApp-like composer polish, anchored attachments, dates/meta */
body.nasim-chat-mode .messages{
  padding-bottom:8px!important;
}
/* When a conversation is short, keep the newest messages close to the composer like WhatsApp. */
body.nasim-chat-mode .messages > :first-child{
  margin-top:auto;
}
body.nasim-chat-mode .composer-wrap{
  margin:0!important;
  padding:0!important;
}
.wa-composer{
  padding-bottom:max(7px,env(safe-area-inset-bottom))!important;
}

/* Attachment menu stays beside the + button instead of opening as a centered/full sheet. */
.wa-attach-popover-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:2147483200!important;
  background:transparent!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  padding:0!important;
  display:block!important;
}
.wa-attach-popover{
  position:absolute!important;
  left:8px!important;
  right:auto!important;
  bottom:calc(64px + env(safe-area-inset-bottom))!important;
  width:min(238px,calc(100vw - 16px))!important;
  padding:7px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:3px!important;
  border-radius:18px!important;
  background:color-mix(in srgb,var(--panel) 98%,transparent)!important;
  border:1px solid var(--line)!important;
  box-shadow:0 18px 48px rgba(0,0,0,.30)!important;
  -webkit-backdrop-filter:blur(20px)!important;
  backdrop-filter:blur(20px)!important;
  transform-origin:bottom left!important;
  animation:ns-attach-pop .13s ease-out!important;
}
@keyframes ns-attach-pop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.wa-attach-popover .attach-grabber,.wa-attach-popover .attach-cancel{display:none!important}
.wa-attach-popover button{
  min-height:48px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  padding:6px 9px!important;
  border-radius:13px!important;
  background:transparent!important;
  text-align:right!important;
}
.wa-attach-popover button:active{background:var(--panel2)!important}
.wa-attach-popover button b{
  width:34px!important;height:34px!important;flex:0 0 34px!important;
  border-radius:11px!important;background:var(--panel2)!important;
  display:grid!important;place-items:center!important;font-size:18px!important;
}
.wa-attach-popover button span{font-size:12px!important;font-weight:750!important}

/* WhatsApp-like day separators. */
.chat-day-separator{
  width:100%!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  margin:8px 0 6px!important;
  pointer-events:none!important;
}
.chat-day-separator span{
  display:inline-flex!important;
  align-items:center!important;
  min-height:28px!important;
  padding:5px 11px!important;
  border-radius:9px!important;
  background:color-mix(in srgb,var(--panel) 90%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--line) 82%,transparent)!important;
  color:var(--muted)!important;
  box-shadow:0 2px 8px rgba(0,0,0,.08)!important;
  font-size:10px!important;
  font-weight:750!important;
  -webkit-backdrop-filter:blur(10px)!important;
  backdrop-filter:blur(10px)!important;
}

/* Stable message footer: time + delivery/read state, always visible inside the bubble. */
.message-meta{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:3px!important;
  min-height:14px!important;
  margin-top:4px!important;
  padding:0!important;
  direction:ltr!important;
  white-space:nowrap!important;
  color:var(--muted)!important;
  font-size:9px!important;
  line-height:1.2!important;
  opacity:.95!important;
}
.message-meta .msg-time{display:inline!important;color:inherit!important}
.message-meta .msg-edited{display:inline!important;color:inherit!important;font-size:8px!important;opacity:.82!important}
.message-meta .delivery,.message-meta .seen{display:inline-grid!important;margin:0!important;padding:0!important;line-height:1!important}
.message-meta .seen{color:var(--brand)!important;font-size:11px!important}
.sendername{
  display:flex!important;
  align-items:center!important;
  gap:3px!important;
  margin-bottom:4px!important;
}
.sender-role{font-size:8px!important;font-weight:500!important;color:var(--muted)!important}

/* Voice bubbles use the same clean footer instead of detached time text. */
.message-line .bubble:has(.wa-voice)>.message-meta{
  margin-top:0!important;
  min-height:13px!important;
  padding-inline:2px!important;
}

@media(max-width:520px){
  .wa-attach-popover{
    left:6px!important;
    bottom:calc(60px + env(safe-area-inset-bottom))!important;
    width:min(224px,calc(100vw - 12px))!important;
  }
  .wa-attach-popover button{min-height:46px!important}
  .wa-composer{padding-bottom:max(5px,env(safe-area-inset-bottom))!important}
  body.nasim-chat-mode .messages{padding-bottom:5px!important}
  .chat-day-separator{margin:6px 0 5px!important}
}
/* Keep the V18.15.26 scrubber constraints after the composer restyle. */
.wa-voice .voice-wave{
  overflow:hidden!important;
  gap:1.25px!important;
  padding:3px 7px 2px!important;
  box-sizing:border-box!important;
}
.wa-voice .voice-wave i{
  width:auto!important;
  min-width:1.35px!important;
  max-width:2.5px!important;
  flex:1 1 0!important;
  height:var(--voice-bar,7px)!important;
}
.wa-voice .voice-progress-dot{
  width:11px!important;
  height:11px!important;
}

/* V18.15.30 — iOS keyboard anchoring: composer sits directly on visual viewport bottom. */
body.nasim-keyboard-open #app.chat-open{
  top:var(--nasim-vv-top,0px)!important;
  height:var(--nasim-vh,100dvh)!important;
  max-height:var(--nasim-vh,100dvh)!important;
}
body.nasim-keyboard-open .composer-wrap{
  margin:0!important;
  padding:0!important;
  transform:none!important;
}
body.nasim-keyboard-open .wa-composer{
  padding-bottom:4px!important;
}


/* V18.15.31 — definitive iOS composer geometry: keep chat full-height and move only Composer by the true keyboard inset. */
:root{--nasim-layout-vh:100dvh;--nasim-keyboard-inset:0px}
body.nasim-chat-mode{position:fixed!important;inset:0!important;width:100%!important;height:var(--nasim-layout-vh,100dvh)!important;min-height:0!important;max-height:var(--nasim-layout-vh,100dvh)!important;overflow:hidden!important;overscroll-behavior:none!important}
body.nasim-chat-mode #app.chat-open{position:fixed!important;inset:0!important;top:0!important;right:0!important;bottom:auto!important;left:0!important;width:100%!important;height:var(--nasim-layout-vh,100dvh)!important;min-height:0!important;max-height:var(--nasim-layout-vh,100dvh)!important;padding:0!important;overflow:hidden!important}
body.nasim-chat-mode #app.chat-open .conversation-wrap{position:relative!important;height:100%!important;min-height:0!important;max-height:100%!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
body.nasim-chat-mode .composer-wrap{position:relative!important;inset:auto!important;bottom:auto!important;flex:0 0 auto!important;margin:0!important;padding:0!important;transform:translate3d(0,calc(-1 * var(--nasim-keyboard-inset,0px)),0)!important;will-change:transform!important;transition:none!important;z-index:50!important}
body.nasim-chat-mode .messages{flex:1 1 0!important;min-height:0!important;padding-bottom:calc(8px + var(--nasim-keyboard-inset,0px))!important;scroll-padding-bottom:calc(72px + var(--nasim-keyboard-inset,0px))!important}
body.nasim-keyboard-open #app.chat-open{top:0!important;height:var(--nasim-layout-vh,100dvh)!important;max-height:var(--nasim-layout-vh,100dvh)!important}
body.nasim-keyboard-open .composer-wrap{transform:translate3d(0,calc(-1 * var(--nasim-keyboard-inset,0px)),0)!important}
body.nasim-keyboard-open .wa-composer{padding-bottom:4px!important}
@media(max-width:520px){body.nasim-chat-mode .messages{padding-bottom:calc(5px + var(--nasim-keyboard-inset,0px))!important}body:not(.nasim-keyboard-open).nasim-chat-mode .wa-composer{padding-bottom:max(5px,env(safe-area-inset-bottom))!important}}

/* V18.15.32 — remove duplicated iOS safe-area/bottom gaps and anchor composer flush to the viewport. */
@media (max-width:820px){
  html{height:100%!important;min-height:100%!important;background:var(--bg)!important}
  body.nasim-chat-mode{
    position:fixed!important;
    inset:0!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:var(--bg)!important;
  }
  body.nasim-chat-mode #app.chat-open{
    position:fixed!important;
    inset:0!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:var(--bg)!important;
  }
  body.nasim-chat-mode #app.chat-open .conversation-wrap{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    margin:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }

  /* Closed keyboard: composer is the final flex row and touches the real bottom edge. */
  body.nasim-chat-mode:not(.nasim-keyboard-open) .composer-wrap{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:100%!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
  }
  body.nasim-chat-mode:not(.nasim-keyboard-open) .messages{
    flex:1 1 0!important;
    min-height:0!important;
    padding-bottom:5px!important;
    scroll-padding-bottom:8px!important;
  }

  /* The row itself must not count iOS safe-area a second time. */
  body.nasim-chat-mode .wa-composer{
    min-height:52px!important;
    padding-top:5px!important;
    padding-right:6px!important;
    padding-bottom:5px!important;
    padding-left:6px!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  /* Open keyboard: take only the composer out of flow and pin it to the keyboard edge. */
  body.nasim-keyboard-open .composer-wrap{
    position:fixed!important;
    top:auto!important;
    left:0!important;
    right:0!important;
    bottom:var(--nasim-keyboard-inset,0px)!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    z-index:2147482000!important;
  }
  body.nasim-keyboard-open .wa-composer{
    padding-bottom:5px!important;
  }
  body.nasim-keyboard-open .messages{
    flex:1 1 0!important;
    min-height:0!important;
    padding-bottom:calc(62px + var(--nasim-keyboard-inset,0px))!important;
    scroll-padding-bottom:calc(68px + var(--nasim-keyboard-inset,0px))!important;
  }
}

/* V18.15.33 — stable media-send button: keep WhatsApp geometry while uploading. */
.wa-composer .send{
  position:relative!important;
  align-self:flex-end!important;
  overflow:visible!important;
  line-height:1!important;
}
.wa-composer .send svg{
  position:relative!important;
  inset:auto!important;
  display:block!important;
  margin:auto!important;
  transform:none!important;
  z-index:2!important;
  flex:none!important;
}
/* The old upload spinner was a second grid item, which pushed the send arrow down.
   Overlay it absolutely instead, so the button never changes rows/size/position. */
.wa-composer.is-sending .send,
.composer.is-sending.wa-composer .send{
  font-size:inherit!important;
  opacity:.82!important;
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  flex:0 0 42px!important;
  margin:0!important;
  transform:none!important;
}
.wa-composer.is-sending .send::before,
.composer.is-sending.wa-composer .send::before{
  content:""!important;
  position:absolute!important;
  inset:3px!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  border:2px solid color-mix(in srgb,var(--text) 18%,transparent)!important;
  border-top-color:var(--brand)!important;
  border-radius:50%!important;
  animation:ns-spin .75s linear infinite!important;
  pointer-events:none!important;
  z-index:1!important;
  box-sizing:border-box!important;
}
.wa-composer.is-sending .send::after,
.composer.is-sending.wa-composer .send::after{
  inset:-4px!important;
}
@media(max-width:520px){
  .wa-composer.is-sending .send,
  .composer.is-sending.wa-composer .send{
    width:39px!important;
    height:39px!important;
    min-width:39px!important;
    flex-basis:39px!important;
  }
  .wa-composer.is-sending .send::before,
  .composer.is-sending.wa-composer .send::before{inset:2px!important}
  .wa-composer .send svg{width:24px!important;height:24px!important}
}

/* V18.15.34 — definitive mobile composer floor: remove stale safe-area padding and pin composer to the true viewport bottom. */
@media (max-width:820px){
  /* This exact selector intentionally matches the older V18.15.31 rule's specificity. */
  body:not(.nasim-keyboard-open).nasim-chat-mode .wa-composer{
    padding-top:5px!important;
    padding-right:6px!important;
    padding-bottom:5px!important;
    padding-left:6px!important;
    min-height:52px!important;
    margin:0!important;
  }

  /* Closed keyboard: do not let a stale app/layout height leave body background below the composer. */
  body.nasim-chat-mode:not(.nasim-keyboard-open) .composer-wrap{
    position:fixed!important;
    top:auto!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    z-index:2147482000!important;
    box-sizing:border-box!important;
    background:var(--panel)!important;
  }

  /* Reserve only the real compact composer height in the scroll area. */
  body.nasim-chat-mode:not(.nasim-keyboard-open) .messages{
    padding-bottom:62px!important;
    scroll-padding-bottom:66px!important;
  }

  /* Open keyboard: same compact row, pinned to the keyboard edge by the existing inset. */
  body.nasim-chat-mode.nasim-keyboard-open .composer-wrap{
    position:fixed!important;
    top:auto!important;
    left:0!important;
    right:0!important;
    bottom:var(--nasim-keyboard-inset,0px)!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    z-index:2147482000!important;
  }
  body.nasim-chat-mode.nasim-keyboard-open .wa-composer{
    padding-top:5px!important;
    padding-right:6px!important;
    padding-bottom:5px!important;
    padding-left:6px!important;
    min-height:52px!important;
    margin:0!important;
  }
}

/* V18.15.35 — iOS safe-area floor: visually extend the composer panel to the physical screen edge without moving its controls. */
@media (max-width:820px){
  /* Closed keyboard only: the controls stay exactly where V18.15.34 fixed them,
     while the wrapper's panel background continues through the iPhone home-indicator safe area. */
  body.nasim-chat-mode:not(.nasim-keyboard-open) .composer-wrap{
    bottom:calc(-1 * env(safe-area-inset-bottom))!important;
    padding-bottom:env(safe-area-inset-bottom)!important;
    background:var(--panel)!important;
    box-sizing:border-box!important;
  }
  body.nasim-chat-mode:not(.nasim-keyboard-open) .wa-composer{
    padding-bottom:5px!important;
    margin:0!important;
    background:var(--panel)!important;
  }
  /* Fallback paint for iOS builds that expose the lower device area outside the dynamic viewport. */
  body.nasim-chat-mode:not(.nasim-keyboard-open){
    background:var(--panel)!important;
  }
  body.nasim-chat-mode:not(.nasim-keyboard-open) .messages{
    background:linear-gradient(rgba(214,163,62,.035),rgba(214,163,62,.035)),var(--bg)!important;
  }
  /* When the keyboard is open there is no bottom device-safe-area gap to paint. */
  body.nasim-chat-mode.nasim-keyboard-open .composer-wrap{
    padding-bottom:0!important;
    background:var(--panel)!important;
  }
}


/* V18.15.37 — clearer WhatsApp-like day grouping */
.chat-day-separator{margin:10px 0 7px!important;position:relative!important;z-index:2!important}
.chat-day-separator span{min-height:30px!important;padding:5px 12px!important;font-size:11px!important;font-weight:800!important;letter-spacing:0!important;white-space:nowrap!important}
@media (max-width:640px){.chat-day-separator{margin:8px 0 6px!important}.chat-day-separator span{font-size:11px!important;min-height:29px!important}}
