/* ALAVI official monochrome identity. The supplied artwork is always shown intact. */
:root{--brand:#181818;--brand-soft:#ededed;--ink:#191919;--muted:#777;--paper:#fff;--surface:#f6f6f6;--line:#e5e5e5;--canvas:#f0f0f0;--shadow:0 18px 60px #0000000d;--glass:rgba(255,255,255,.72);--glass-line:rgba(255,255,255,.95);--glass-shadow:0 12px 40px #0000000c,inset 0 1px 0 #ffffffd9;--dock-hover:#00000007}
html[data-theme=dark]{--brand:#f2f2f2;--brand-soft:#2d2d2d;--ink:#f0f0f0;--muted:#a2a2a2;--paper:#191919;--surface:#141414;--line:#303030;--canvas:#101010;--glass:rgba(28,28,28,.72);--glass-line:rgba(255,255,255,.13);--glass-shadow:0 16px 45px #00000040,inset 0 1px 0 #ffffff0d;--dock-hover:#ffffff0a;color-scheme:dark}
html[data-theme=dark] .primary,html[data-theme=dark] .send-btn{color:#101010}
.brand-lockup{display:inline-flex;align-items:center;gap:13px;min-width:0;flex-shrink:0}
.brand-type{display:flex;flex-direction:column;gap:3px;line-height:1.4;text-align:start}
.brand-type b{font-size:21px;letter-spacing:3px;font-weight:750}
.brand-type small{font-size:11px;letter-spacing:0;color:inherit;opacity:.65}
.logo,.brand-mark{object-fit:contain;object-position:center;background:#fff;border:1px solid #e8e8e8;border-radius:13px;padding:5px;flex-shrink:0}
.logo{width:64px;height:64px}
.brand-mark{width:50px;height:50px}
.auth-top .logo{width:88px;height:88px;padding:7px;border-radius:19px}
.auth-top{align-items:center;margin-bottom:30px}
.auth-story{background:#111;color:#fff;background-image:radial-gradient(ellipse at 15% 20%,#ffffff0a,transparent 55%)}
.auth-story .logo{width:90px;height:90px;border-radius:20px;padding:7px}
.auth-story .eyebrow{color:#bbb}.auth-story h1 em{color:#fff}.auth-story p{color:#b8b8b8}.auth-story footer{color:#a0a0a0}
.auth-orbit svg{color:#e6e6e6}.auth-orbit div{background:#ffffff07;border-color:#ffffff18;backdrop-filter:blur(14px)}
.auth-card>.notice{margin-top:25px}
.approval-shell{min-height:var(--app-height,100dvh);padding:32px 18px;background:var(--canvas);display:grid;place-items:center;overflow:auto}
.approval-card{width:100%;max-width:580px;padding:30px;gap:19px}.approval-card h1{font-size:27px}.approval-card .brand-lockup{margin-bottom:3px}.approval-card .badge{justify-self:start}.approval-card .codebox{font-size:13px;line-height:2.1;white-space:pre-wrap;overflow-wrap:anywhere}
.approval-step{display:flex;align-items:flex-start;gap:12px}.approval-step h3{font-size:14px}.approval-step p{margin-top:5px}.step-number{width:28px;height:28px;border:1px solid var(--line);border-radius:50%;display:flex;justify-content:center;align-items:center;flex-shrink:0;font-size:12px;background:var(--surface)}
.approval-card input[name=code]{font-size:25px;text-align:center;letter-spacing:10px;font-family:Vazirmatn,sans-serif;min-height:60px}
input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--paper) inset;-webkit-text-fill-color:var(--ink);caret-color:var(--ink)}
.shell{grid-template-columns:96px 350px minmax(0,1fr);background:var(--surface)}
.rail{margin:12px 10px;height:calc(var(--app-height,100dvh) - 24px);min-height:0;padding:14px 6px 12px;gap:10px;border:1px solid var(--glass-line);border-radius:25px;background:var(--glass);box-shadow:var(--glass-shadow);backdrop-filter:blur(24px) saturate(0);-webkit-backdrop-filter:blur(24px) saturate(0);overflow:hidden}
.rail-brand{height:61px;width:54px;flex-shrink:0;letter-spacing:0}
.rail-brand .logo{width:52px;height:52px;padding:4px;border-radius:14px}
.rail nav{flex:1;min-height:0;width:100%;margin-top:8px;gap:8px;padding:3px 0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#90909050 transparent;scrollbar-gutter:stable;align-items:center}
.rail .nav-btn{width:52px;min-height:61px;flex-shrink:0;color:var(--muted);border:1px solid transparent;border-radius:15px;transition:background .15s,border-color .15s}
.rail .nav-btn:hover{background:var(--dock-hover);color:var(--ink)}
.rail .nav-btn.active{background:var(--paper);color:var(--ink);border-color:var(--line);box-shadow:0 3px 10px #00000007}
.rail-bottom{flex-shrink:0;margin-top:0;padding-top:8px;border-top:1px solid var(--line);width:100%}
.sidebar{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;background:var(--paper)}
.sidebar-head,.chat-filters,.sidebar-foot{flex-shrink:0}
.sidebar-head{padding-top:22px}
.inbox-heading{display:flex;gap:12px;align-items:center;min-width:0}
.inbox-heading h2{font-size:22px}.inbox-heading small{display:block;font-size:9px;letter-spacing:2px;color:var(--muted);margin-top:1px}
.chat-list{min-height:90px;flex:1 1 0;scrollbar-gutter:stable;overscroll-behavior:contain}
.chat-row.selected{background:var(--brand-soft)}
.chat-row .badge svg{width:14px;height:14px}
.avatar,.avatar.c0,.avatar.c1,.avatar.c2,.avatar.c3,.avatar.c4,.avatar.c5{background:#e9e9e9;color:#555;border:1px solid #00000005}
.avatar.c1,.avatar.c3{background:#dedede;color:#444}.avatar.c2,.avatar.c5{background:#f0f0f0;color:#777}
html[data-theme=dark] .avatar{filter:none;background:#303030;color:#ddd;border-color:#ffffff08}
html[data-theme=dark] .avatar.c1,html[data-theme=dark] .avatar.c3{background:#3b3b3b;color:#eee}
.dot{background:var(--ink);opacity:.7}.dot.offline{background:#a2a2a2}
.main{background:var(--canvas)}.main:before{opacity:.14}
.welcome{align-items:safe center;justify-content:safe center}.welcome-card{flex-shrink:0}
.rail,.composer,.admin-nav{background-image:linear-gradient(145deg,#ffffff12,transparent 55%)}
.welcome-emblem{width:140px;height:140px;background:#fff;border:1px solid #dedede;border-radius:29px;box-shadow:0 12px 40px #00000009}
.welcome-emblem .logo{width:122px;height:122px;padding:3px;border:0;border-radius:0}
.welcome-emblem:after{inset:-10px;border-color:#88888830;border-radius:37px;transform:rotate(-5deg)}
.feature-card:nth-child(n) .feature-icon{color:var(--ink);background:var(--brand-soft)}
.bubble{border-color:var(--line);box-shadow:0 2px 5px #00000004}
.mine .bubble{background:var(--brand-soft);border-color:var(--line)}
.reply-preview{background:var(--dock-hover)}
.composer{background:var(--glass);border:1px solid var(--glass-line);box-shadow:var(--glass-shadow);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.composer:focus-within{border-color:var(--muted)}
.layout-glass .bubble{background:var(--glass);border-color:var(--glass-line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.layout-glass .mine .bubble{background:var(--brand-soft);border-color:var(--line)}
.layout-glass .composer{background:var(--glass)}
html[data-theme=dark] .layout-glass .bubble,html[data-theme=dark] .layout-glass .composer{background:var(--glass)}
html[data-theme=dark] .layout-glass .mine .bubble{background:var(--brand-soft)}
.date-pill,html[data-theme=dark] .date-pill{background:var(--glass);border-color:var(--glass-line)}
dialog::backdrop{background:#00000066;backdrop-filter:blur(5px)}
.admin-nav{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;background:var(--glass);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-inline-end-color:var(--glass-line)}
.admin-nav>*{flex-shrink:0}.admin-nav .brand-lockup{margin:0 3px 22px;gap:10px}.admin-nav .logo{width:58px;height:58px}.admin-nav .brand-type b{font-size:17px}
.admin-nav button.active{background:var(--brand-soft);color:var(--ink)}
*{scrollbar-width:thin;scrollbar-color:#8d8d8d60 transparent}
::-webkit-scrollbar{width:7px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#8d8d8d60;border-radius:8px}::-webkit-scrollbar-thumb:hover{background:#8d8d8d99}
@media(min-width:1500px){.shell{grid-template-columns:100px 390px minmax(0,1fr)}}
@media(min-width:761px) and (max-height:620px){.rail{margin-block:8px;height:calc(var(--app-height,100dvh) - 16px);padding-block:8px;gap:5px}.rail-brand{height:54px}.rail nav{margin-top:0}.rail-bottom{gap:3px;padding-top:4px}.sidebar-head{padding:16px 18px 10px}.sidebar-head .searchbox{margin-top:13px}.workspace-switch{margin-top:10px}.admin-nav{padding-block:14px}.admin-nav .brand-lockup{margin-bottom:12px}}
@media(max-width:1100px) and (min-width:761px){.shell{grid-template-columns:90px 305px minmax(0,1fr)}.rail{margin-inline:8px}.rail .nav-btn{width:49px}}
@media(max-width:760px){
 .shell{display:block}.rail{position:absolute;inset-inline:8px;bottom:calc(8px + env(safe-area-inset-bottom));height:70px;margin:0;padding:4px 5px;gap:0;border-radius:23px;border:1px solid var(--glass-line);background:var(--glass);flex-direction:row;overflow:hidden}
 .rail nav{margin:0;padding:0;min-height:58px;width:100%;height:60px;flex-direction:row;gap:2px;justify-content:space-around;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scrollbar-gutter:auto}
 .rail nav::-webkit-scrollbar{display:none}.rail .nav-btn{height:58px;min-height:58px;min-width:43px;width:auto;flex:1 0 43px;font-size:8px;padding:0 3px;border-radius:16px;gap:5px}
 .rail .nav-btn.active{background:var(--paper);border-color:var(--line)}.rail .nav-btn svg{width:20px;height:20px}
 .rail-brand,.rail-bottom{display:none}.sidebar{height:calc(var(--app-height,100dvh) - 92px - env(safe-area-inset-bottom));overflow-y:auto}
 .sidebar-head{padding-top:calc(16px + env(safe-area-inset-top))}.inbox-heading{gap:12px}.inbox-heading h2{font-size:24px}.brand-mark{width:55px;height:55px;border-radius:15px}
 .main{height:calc(var(--app-height,100dvh) - 92px - env(safe-area-inset-bottom))}.shell.in-chat .main{height:var(--app-height,100dvh)}
 .auth-top .logo{width:84px;height:84px}.brand-type b{font-size:20px}.auth-top{margin-bottom:30px}
 .welcome-emblem{width:118px;height:118px}.welcome-emblem .logo{width:104px;height:104px}
 .admin-nav{overflow-y:hidden;overflow-x:auto;scrollbar-gutter:auto}.admin-nav .brand-lockup{margin:0 5px;gap:8px}.admin-nav .brand-type{display:none}.admin-nav .logo{width:43px;height:43px;padding:3px;border-radius:10px}
 #toasts{inset-block-end:calc(94px + env(safe-area-inset-bottom))}
}
@supports not (backdrop-filter:blur(1px)){.rail,.admin-nav,.composer,.layout-glass .bubble{background:var(--paper)}}
@media(prefers-reduced-motion:reduce){.rail,.admin-nav,.composer,.layout-glass .bubble,.auth-orbit div{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--paper)}.auth-orbit div{background:#202020}}
html[data-low=true] .rail,html[data-low=true] .admin-nav,html[data-low=true] .composer,html[data-low=true] .layout-glass .bubble{background:var(--paper);backdrop-filter:none;-webkit-backdrop-filter:none}