:root{--bg:#090b12;--panel:#10131d;--panel-2:#151925;--line:#252a39;--muted:#8e94a8;--text:#f6f7fb;--purple:#7c5cfc;--purple-2:#9e87ff;--lime:#b9ff66;--danger:#ff667a;--shadow:0 24px 80px rgba(0,0,0,.38)}
*{box-sizing:border-box}html{font-size:16px}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',system-ui,sans-serif;overflow:hidden}button,input,textarea,select{font:inherit}button{color:inherit}.hidden{display:none!important}.eyebrow{margin:0 0 .6rem;color:var(--purple-2);font-size:.72rem;font-weight:700;letter-spacing:.16em}.brand,.mobile-brand{display:flex;align-items:center;gap:.75rem;color:#fff;text-decoration:none;font:800 1.22rem 'Manrope',sans-serif}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,var(--purple-2),var(--purple));font:800 1.2rem 'Manrope';box-shadow:0 10px 30px rgba(124,92,252,.3)}
.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)}.auth-art{position:relative;padding:2.5rem 3.2rem;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(circle at 80% 20%,rgba(124,92,252,.2),transparent 30%),radial-gradient(circle at 10% 85%,rgba(185,255,102,.08),transparent 30%),#0d1018}.auth-art:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,transparent,#000 30%,#000 70%,transparent)}.art-copy{position:relative;z-index:1;margin:auto 0;max-width:630px}.art-copy h1{font:800 clamp(3rem,5.4vw,5.8rem)/.98 'Manrope';letter-spacing:-.065em;margin:0 0 1.6rem}.art-copy h1 em{font-style:normal;color:var(--lime)}.art-copy>p:last-child{max-width:480px;color:#aeb4c5;font-size:1.18rem;line-height:1.65}.trust{font-size:.8rem;color:#848b9d;position:relative;z-index:1}.trust::first-letter{color:var(--lime)}.orbit{position:absolute;width:300px;height:300px;right:-20px;top:-90px;border:1px solid rgba(158,135,255,.18);border-radius:50%;animation:float 8s ease-in-out infinite}.orbit:before,.orbit:after{content:"";position:absolute;border:1px solid rgba(158,135,255,.12);border-radius:50%}.orbit:before{inset:35px}.orbit:after{inset:75px}.orb,.orb-center{position:absolute;display:grid;place-items:center;border-radius:50%;font-weight:700;box-shadow:var(--shadow)}.orb{width:50px;height:50px}.orb-a{background:#ff6b8a;left:-10px;top:112px}.orb-b{background:#15b89a;right:15px;top:25px}.orb-c{background:#f0a23a;right:5px;bottom:40px}.orb-center{width:74px;height:74px;left:113px;top:113px;background:var(--purple);font-size:1.5rem}.auth-panel{display:grid;place-items:center;background:#0a0c13;padding:2.5rem}.auth-box{width:min(100%,430px)}.mobile-brand{display:none}.auth-box h2{font:800 2.4rem/1.1 'Manrope';letter-spacing:-.04em;margin:.2rem 0 .8rem}.auth-box>p:nth-child(3){color:var(--muted);line-height:1.55;margin-bottom:2rem}.auth-box label,.modal-card form>label:not(.setting-row):not(.switch-row){display:grid;gap:.5rem;margin:1rem 0;color:#c8ccda;font-size:.85rem;font-weight:600}input,textarea,select{width:100%;border:1px solid var(--line);background:#11151f;color:#fff;border-radius:12px;padding:.9rem 1rem;outline:none;transition:.2s}input:focus,textarea:focus,select:focus{border-color:var(--purple);box-shadow:0 0 0 3px rgba(124,92,252,.14)}textarea{resize:none}.primary{border:0;border-radius:12px;background:linear-gradient(135deg,var(--purple),#6848e8);padding:.95rem 1.1rem;font-weight:700;cursor:pointer;box-shadow:0 12px 30px rgba(124,92,252,.22)}.wide{width:100%;display:flex;justify-content:center;gap:.7rem;margin-top:1.3rem}.auth-form .wide{justify-content:space-between}.divider{display:flex;align-items:center;gap:1rem;color:#666d80;font-size:.76rem;margin:1.4rem 0}.divider:before,.divider:after{content:"";height:1px;flex:1;background:var(--line)}.demo-button{width:100%;padding:.75rem;border:1px solid var(--line);background:#121620;border-radius:14px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;text-align:left;gap:1rem;cursor:pointer}.demo-button:hover{border-color:#40475b;background:#161b28}.demo-button span:nth-child(2){display:grid;gap:.15rem}.demo-button small{color:var(--muted)}.mini-faces{display:flex}.mini-faces i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:.7rem;font-weight:700;margin-right:-8px;border:2px solid #121620}.mini-faces i:nth-child(1){background:#ff6b8a}.mini-faces i:nth-child(2){background:#15b89a}.mini-faces i:nth-child(3){background:#f0a23a}.auth-switch{text-align:center;color:var(--muted);font-size:.9rem;margin:1.6rem 0}.auth-switch button{background:none;border:0;color:var(--purple-2);font-weight:700;cursor:pointer}.legal{text-align:center!important;font-size:.7rem!important;color:#5f6576!important;margin:0!important}
.app-shell{height:100vh;display:grid;grid-template-columns:76px minmax(285px,340px) minmax(400px,1fr) minmax(240px,300px);background:var(--bg)}.rail{border-right:1px solid var(--line);padding:1.15rem 0;display:flex;flex-direction:column;align-items:center}.rail-logo{border:0;cursor:pointer}.rail nav{display:grid;gap:.7rem;margin:auto 0}.rail-btn,.avatar-button{position:relative;width:44px;height:44px;border-radius:13px;border:0;background:transparent;display:grid;place-items:center;color:#777f94;cursor:pointer;font-size:1.25rem}.rail-btn:hover,.rail-btn.active{background:#1a1e2b;color:#fff}.rail-btn.active:before{content:"";position:absolute;left:-16px;width:3px;height:22px;border-radius:2px;background:var(--purple)}.rail-btn i{position:absolute;right:5px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--danger);display:none}.rail-btn i.show{display:block}.avatar-button{padding:0;overflow:hidden;background:#202534}.sidebar{border-right:1px solid var(--line);background:#0d1018;display:flex;flex-direction:column;min-width:0}.sidebar-head{height:92px;padding:1.25rem 1.3rem .8rem;display:flex;align-items:center;justify-content:space-between}.sidebar-head h2{font:700 1.55rem 'Manrope';margin:0;letter-spacing:-.04em}.icon-button{width:38px;height:38px;border:1px solid var(--line);border-radius:11px;background:#151925;cursor:pointer;font-size:1.05rem}.icon-button:hover{border-color:#42495e}.search{margin:.5rem 1.2rem 1rem;display:flex;align-items:center;background:#151925;border:1px solid #1f2432;border-radius:12px;padding:0 .8rem;color:#687085}.search input{border:0!important;box-shadow:none!important;background:transparent;padding:.72rem .6rem}.friend-list,.people-list{overflow:auto;padding:0 .7rem 1rem}.friend-item{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;border:0;background:transparent;border-radius:14px;padding:.75rem;color:#fff;text-align:left;cursor:pointer;margin:.16rem 0}.friend-item:hover,.friend-item.active{background:#181c28}.friend-item.active{box-shadow:inset 3px 0 var(--purple)}.avatar{position:relative;width:46px;height:46px;border-radius:15px;display:grid;place-items:center;flex:0 0 auto;font-weight:800;overflow:hidden;background:var(--avatar,#333a50)}.avatar img{width:100%;height:100%;object-fit:cover}.avatar .online-dot{position:absolute;width:11px;height:11px;right:1px;bottom:1px;border-radius:50%;background:var(--lime);border:2px solid #0d1018}.friend-copy{min-width:0;display:grid;gap:.22rem}.friend-copy strong{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.friend-copy span{color:var(--muted);font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.friend-meta{display:grid;justify-items:end;gap:.35rem;color:#737b8f;font-size:.68rem}.unread{min-width:19px;height:19px;padding:0 5px;display:grid;place-items:center;border-radius:20px;background:var(--purple);color:#fff;font-weight:700}.people-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;padding:.8rem;border-bottom:1px solid #1b1f2b}.people-card .friend-copy span{color:#747c90}.small-action{border:1px solid #343a4d;background:#181c28;border-radius:9px;padding:.5rem .65rem;cursor:pointer;font-size:.75rem;font-weight:700}.small-action.accent{background:var(--purple);border-color:var(--purple)}
.chat-panel{position:relative;min-width:0;background:radial-gradient(circle at 50% 100%,rgba(124,92,252,.07),transparent 45%),#0b0e15}.empty-chat{height:100%;display:grid;place-content:center;justify-items:center;text-align:center;color:var(--muted)}.empty-symbol{width:74px;height:74px;display:grid;place-items:center;border:1px solid #2b3040;border-radius:25px;background:#151925;color:var(--lime);font-size:1.8rem;transform:rotate(-5deg)}.empty-chat h2{font:700 1.5rem 'Manrope';color:#dce0eb;margin:1.5rem 0 .5rem}.empty-chat p{margin:0}.active-chat{height:100%;display:grid;grid-template-rows:78px 1fr auto auto}.chat-head{position:relative;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:.8rem;padding:0 1.35rem;background:rgba(11,14,21,.88);backdrop-filter:blur(14px)}.chat-head .avatar{width:42px;height:42px;border-radius:13px}.chat-person{display:grid;gap:.18rem}.chat-person strong{font-size:.96rem}.chat-person span{font-size:.75rem;color:var(--muted)}.chat-actions{margin-left:auto;position:relative}.popover{position:absolute;z-index:5;right:0;top:46px;width:190px;border:1px solid var(--line);border-radius:12px;background:#171b27;padding:.4rem;box-shadow:var(--shadow)}.popover button{display:block;width:100%;border:0;background:transparent;text-align:left;padding:.7rem;border-radius:8px;cursor:pointer;font-size:.8rem}.popover button:hover{background:#202534}.popover .danger{color:var(--danger)}.messages{overflow:auto;padding:1.5rem clamp(1rem,4vw,3.5rem);display:flex;flex-direction:column;gap:.6rem}.day-divider{text-align:center;color:#697185;font-size:.7rem;margin:.5rem 0 1rem}.bubble-row{display:flex;gap:.6rem;align-items:flex-end;max-width:78%}.bubble-row.mine{align-self:flex-end;flex-direction:row-reverse}.bubble{padding:.75rem .95rem;border-radius:7px 17px 17px 17px;background:#1b202d;color:#eef0f5;line-height:1.45;font-size:.9rem;word-break:break-word}.mine .bubble{background:linear-gradient(135deg,#7656ef,#6747d8);border-radius:17px 7px 17px 17px}.bubble-time{font-size:.62rem;color:#697185;white-space:nowrap}.receipt{color:var(--purple-2)}.typing-line{height:26px;padding:0 clamp(1rem,4vw,3.5rem);font-size:.72rem;color:var(--purple-2)}.composer{margin:.2rem 1.3rem 1.3rem;display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:.6rem;border:1px solid #282e3e;border-radius:17px;background:#151925;padding:.55rem}.composer textarea{border:0;box-shadow:none;background:transparent;min-height:39px;max-height:110px;padding:.58rem;line-height:1.35}.composer-add,.send-button{width:39px;height:39px;border-radius:12px;border:0;cursor:pointer}.composer-add{background:transparent;color:#7e8597;font-size:1.2rem}.send-button{background:var(--purple);font-weight:800;font-size:1.1rem}.profile-pane{border-left:1px solid var(--line);background:#0d1018;padding:1.5rem;overflow:auto}.profile-card{text-align:center;padding-top:2.5rem}.profile-card>.avatar{width:92px;height:92px;border-radius:28px;margin:0 auto 1.2rem;font-size:1.5rem}.profile-card h3{font:700 1.2rem 'Manrope';margin:0}.handle{color:#777f93;font-size:.8rem;margin:.35rem 0 1.2rem}.status-quote{margin:0 auto 1.8rem;color:#bbc0ce;font-size:.88rem;line-height:1.5;max-width:230px}.profile-stats{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1rem 0;margin:0 0 1rem}.profile-stats div{display:grid;gap:.2rem}.profile-stats div+div{border-left:1px solid var(--line)}.profile-stats b{font-size:.83rem}.profile-stats span{font-size:.7rem;color:var(--muted)}.profile-note{text-align:left;background:#151925;border-radius:13px;padding:.9rem;color:#9299ac;font-size:.76rem;line-height:1.45}.profile-note b{display:block;color:#dfe2eb;margin-bottom:.25rem}.mobile-only{display:none}
.modal{position:fixed;z-index:20;inset:0;background:rgba(3,4,8,.76);backdrop-filter:blur(7px);display:grid;place-items:center;padding:1.5rem;overflow:auto}.modal-card{width:min(100%,590px);max-height:92vh;overflow:auto;background:#11151f;border:1px solid #2b3040;border-radius:24px;box-shadow:var(--shadow);padding:1.5rem 1.7rem}.modal-card>header{display:flex;justify-content:space-between;align-items:center}.modal-card h2{font:700 1.5rem 'Manrope';margin:0}.avatar-editor{display:flex;align-items:center;gap:1rem;margin:1.5rem 0}.avatar-editor .avatar{width:68px;height:68px;border-radius:20px}.upload-button{cursor:pointer;border:1px solid var(--line);border-radius:10px;padding:.65rem .8rem;font-size:.8rem;font-weight:700}.upload-button input{display:none}.modal-card h3{font-size:.82rem;color:#888fa1;text-transform:uppercase;letter-spacing:.1em;margin:1.6rem 0 .6rem}.setting-row,.switch-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 0;border-bottom:1px solid #222735}.setting-row span,.switch-row span{display:grid;gap:.2rem}.setting-row b,.switch-row b{font-size:.86rem}.setting-row small,.switch-row small{font-size:.72rem;color:var(--muted)}.setting-row select{width:135px;padding:.55rem .7rem;font-size:.78rem}.switch-row{position:relative;cursor:pointer}.switch-row input{position:absolute;opacity:0}.switch-row i{width:43px;height:24px;border-radius:20px;background:#2d3342;position:relative;transition:.2s}.switch-row i:after{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}.switch-row input:checked+i{background:var(--purple)}.switch-row input:checked+i:after{transform:translateX(19px)}.blocked-person{display:flex;align-items:center;justify-content:space-between;padding:.7rem 0;color:#cfd3dd;font-size:.84rem}.logout-button{width:100%;border:0;background:transparent;color:var(--danger);padding:.9rem;margin-top:.4rem;cursor:pointer}.toast{position:fixed;z-index:50;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;background:#f3f5fb;color:#11131a;padding:.75rem 1rem;border-radius:12px;box-shadow:var(--shadow);font-weight:700;font-size:.82rem;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes float{50%{transform:translateY(12px) rotate(3deg)}}
@media(max-width:1100px){.app-shell{grid-template-columns:70px 300px 1fr}.profile-pane{display:none}.auth-art{padding:2rem}.orbit{opacity:.6}.art-copy h1{font-size:4rem}}
@media(max-width:760px){body{overflow:auto}.auth-shell{display:block;min-height:100vh}.auth-art{display:none}.auth-panel{min-height:100vh;padding:1.4rem}.mobile-brand{display:flex;position:absolute;left:1.4rem;top:1.4rem}.auth-box{margin-top:4.5rem}.app-shell{height:100dvh;grid-template-columns:1fr;grid-template-rows:1fr 67px}.rail{grid-row:2;grid-column:1;border-right:0;border-top:1px solid var(--line);padding:.5rem 1.2rem;flex-direction:row;z-index:10;background:#0c0f17}.rail-logo{display:none}.rail nav{display:flex;margin:0;justify-content:space-around;flex:1}.rail-btn.active:before{left:50%;top:-9px;width:22px;height:3px;transform:translateX(-50%)}.sidebar{grid-row:1;grid-column:1;border:0}.chat-panel{grid-row:1;grid-column:1;display:none}.app-shell.chat-open .sidebar{display:none}.app-shell.chat-open .chat-panel{display:block}.app-shell.chat-open .active-chat{height:100%}.app-shell.chat-open .rail{display:none}.mobile-only{display:grid}.chat-head{height:72px;padding:0 .8rem}.messages{padding:1.2rem .9rem}.bubble-row{max-width:88%}.composer{margin:.2rem .7rem .7rem}.profile-pane{display:none}.modal{padding:.6rem}.modal-card{max-height:96vh;padding:1.25rem;border-radius:18px}.setting-row select{width:118px}.sidebar-head{height:82px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* 2026 visual refinement */
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;background:radial-gradient(circle at 12% 10%,rgba(124,92,252,.18),transparent 24%),radial-gradient(circle at 86% 88%,rgba(185,255,102,.07),transparent 22%)}
.brand-mark{position:relative;border-radius:50%;background:#7c5cfc;box-shadow:0 0 0 1px rgba(255,255,255,.12) inset,0 12px 38px rgba(124,92,252,.32)}
.brand-mark:after{content:"";position:absolute;inset:7px;border:2px solid rgba(255,255,255,.48);border-right-color:transparent;border-radius:50%}
.auth-shell{grid-template-columns:minmax(0,1.16fr) minmax(430px,.84fr);background:#07090f}
.auth-art{padding:2.4rem 3.5rem;background:radial-gradient(circle at 76% 27%,rgba(124,92,252,.26),transparent 27%),radial-gradient(circle at 20% 88%,rgba(185,255,102,.09),transparent 28%),linear-gradient(145deg,#111622,#090b12 72%)}
.auth-art:before{content:"";position:absolute;width:540px;height:540px;border:1px solid rgba(255,255,255,.05);border-radius:50%;right:-220px;bottom:-300px;box-shadow:0 0 0 80px rgba(255,255,255,.012),0 0 0 160px rgba(255,255,255,.008)}
.auth-panel{background:radial-gradient(circle at 50% 0,rgba(124,92,252,.1),transparent 34%),#080a10}
.auth-box{padding:2.1rem;border:1px solid rgba(255,255,255,.075);border-radius:28px;background:rgba(17,20,30,.74);box-shadow:0 30px 90px rgba(0,0,0,.36),0 1px 0 rgba(255,255,255,.05) inset;backdrop-filter:blur(20px)}
.auth-box h2{font-size:2.55rem}.art-copy h1{max-width:720px}.feature-pills{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:2rem}.feature-pills span{padding:.5rem .7rem;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(255,255,255,.035);color:#aeb4c5;font-size:.72rem}.remember-row{display:flex!important;grid-template-columns:auto auto 1fr!important;align-items:center;gap:.65rem!important;cursor:pointer;margin:.9rem 0!important}.remember-row input{position:absolute;opacity:0;width:1px}.remember-row i{width:20px;height:20px;border-radius:6px;border:1px solid #3a4053;background:#11151f;display:grid;place-items:center}.remember-row input:checked+i{border-color:var(--purple);background:var(--purple)}.remember-row input:checked+i:after{content:"✓";font-size:.72rem;font-weight:800}.remember-row span{color:#9ca3b6;font-size:.8rem;font-weight:500}.twofactor-login{text-align:left}.twofactor-login h3{font:700 1.2rem 'Manrope';text-align:center;margin:.8rem 0 .4rem}.twofactor-login>p{text-align:center;color:var(--muted);font-size:.85rem;line-height:1.5}.security-icon{width:58px;height:58px;margin:0 auto;display:grid;place-items:center;border-radius:19px;background:rgba(124,92,252,.14);border:1px solid rgba(158,135,255,.3);color:var(--purple-2);font-size:1.6rem}.text-button{display:block;margin:.9rem auto 0;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:.8rem}
.app-shell{background:#080a10}.rail{background:#090c13;border-color:#202533}.rail-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.rail-btn.active{background:linear-gradient(145deg,rgba(124,92,252,.23),rgba(124,92,252,.08));color:#b9abff;box-shadow:0 0 0 1px rgba(124,92,252,.15) inset}.sidebar{background:linear-gradient(180deg,#0f121b,#0b0e15)}.sidebar-head{padding-top:1.45rem}.sidebar-head h2{font-size:1.65rem}.search{background:#131722;border-color:#242938;box-shadow:0 1px 0 rgba(255,255,255,.025) inset}.friend-list{flex:1}.friend-item{border:1px solid transparent;transition:background .18s,border-color .18s,transform .18s}.friend-item:hover{background:#171c28;border-color:#222838;transform:translateX(2px)}.friend-item.active{background:linear-gradient(110deg,rgba(124,92,252,.18),rgba(124,92,252,.035));border-color:rgba(124,92,252,.2);box-shadow:none}.avatar{box-shadow:0 0 0 1px rgba(255,255,255,.12) inset,0 7px 18px rgba(0,0,0,.2)}.online-strip{padding:0 1.2rem 1rem;border-bottom:1px solid #1d2230;margin-bottom:.35rem}.online-label{display:block;color:#697185;font-size:.62rem;font-weight:800;letter-spacing:.13em;margin-bottom:.65rem}.online-strip>div{display:flex;gap:.85rem;overflow-x:auto;padding:0 1px 4px;scrollbar-width:none}.online-strip button{border:0;background:transparent;padding:0;display:grid;justify-items:center;gap:.35rem;cursor:pointer;min-width:44px}.online-strip .avatar{width:42px;height:42px;border-radius:14px;font-size:.75rem}.online-strip small{max-width:52px;color:#8d94a7;font-size:.64rem;overflow:hidden;text-overflow:ellipsis}.chat-panel{background:radial-gradient(circle at 48% 105%,rgba(124,92,252,.11),transparent 38%),linear-gradient(180deg,#0b0e15,#090c12)}.chat-panel:before{content:"";position:absolute;inset:78px 0 0;pointer-events:none;opacity:.22;background-image:radial-gradient(rgba(255,255,255,.12) .7px,transparent .7px);background-size:24px 24px;mask-image:linear-gradient(to bottom,transparent,#000 20%,transparent 95%)}.chat-head{z-index:2;background:rgba(10,13,20,.82)}.messages{position:relative;z-index:1}.bubble{box-shadow:0 8px 28px rgba(0,0,0,.12);border:1px solid rgba(255,255,255,.035)}.mine .bubble{background:linear-gradient(145deg,#8264ff,#6949dd);box-shadow:0 8px 28px rgba(90,59,210,.18)}.composer{position:relative;z-index:2;background:rgba(20,24,36,.94);box-shadow:0 18px 46px rgba(0,0,0,.28),0 1px 0 rgba(255,255,255,.035) inset}.send-button{background:linear-gradient(145deg,#8b70ff,#6b4ce5);box-shadow:0 7px 20px rgba(124,92,252,.32)}.profile-pane{background:linear-gradient(180deg,#0f121b,#0b0e15)}
.security-card{border:1px solid #282e3e;border-radius:15px;background:linear-gradient(145deg,#171b27,#121620);padding:.9rem;margin:.7rem 0}.security-card-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.75rem}.security-card-head>span:nth-child(2),.device-row>span{display:grid;gap:.2rem}.security-card-head b,.device-row b{font-size:.86rem}.security-card-head small,.device-row small{color:var(--muted);font-size:.72rem}.security-card-head small.secure{color:var(--lime)}.shield{width:35px;height:35px;border-radius:11px;display:grid!important;place-items:center;background:rgba(124,92,252,.15);color:var(--purple-2);font-weight:800}.twofactor-setup{border-top:1px solid #292e3e;margin-top:.9rem;padding-top:.9rem}.twofactor-setup p,.recovery-box p{color:var(--muted);font-size:.76rem;line-height:1.5}.twofactor-setup label{display:grid;gap:.4rem;color:#b9becb;font-size:.76rem;margin-top:.8rem}.secret-box{display:flex;align-items:center;justify-content:space-between;gap:.6rem;background:#090c12;border:1px solid #2a3040;border-radius:11px;padding:.65rem}.secret-box code{color:var(--lime);font-size:.72rem;word-break:break-all;letter-spacing:.08em}.secret-box button,.authenticator-link{border:0;background:transparent;color:var(--purple-2);font-size:.72rem;cursor:pointer;white-space:nowrap}.authenticator-link{display:inline-block;margin-top:.65rem;text-decoration:none}.recovery-box{margin-top:.9rem;padding:.9rem;border-radius:12px;background:rgba(185,255,102,.055);border:1px solid rgba(185,255,102,.18)}#recovery-codes{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;margin:.75rem 0}#recovery-codes code{padding:.45rem;border-radius:7px;background:#0c100f;color:var(--lime);font-size:.72rem;text-align:center}.password-card{display:grid;gap:.8rem}.password-grid{display:grid;grid-template-columns:1fr 1fr auto;gap:.5rem}.password-grid input{padding:.65rem .75rem;font-size:.76rem}.device-row{display:flex;justify-content:space-between;align-items:center;padding:.9rem .1rem;border-bottom:1px solid #242938}.small-action.danger{color:var(--danger);border-color:rgba(255,102,122,.28)}
@media(max-width:760px){.auth-panel{background:radial-gradient(circle at 50% 0,rgba(124,92,252,.15),transparent 36%),#080a10}.auth-box{padding:1.4rem;border-radius:22px;margin-top:4.8rem}.auth-box h2{font-size:2rem}.mobile-brand{font-size:1.1rem}.online-strip{padding-left:1rem;padding-right:1rem}.password-grid{grid-template-columns:1fr}.security-card-head{grid-template-columns:auto 1fr}.security-card-head button{grid-column:2;justify-self:start}.device-row{align-items:flex-start;gap:.8rem}.device-row button{white-space:nowrap}.chat-panel:before{inset:72px 0 0}.feature-pills{display:none}}
.notification-toggle.connected{color:var(--lime)}.rail-btn .live-dot.show{display:block;background:var(--lime);box-shadow:0 0 0 3px rgba(185,255,102,.12),0 0 12px rgba(185,255,102,.65)}
.friend-copy .friend-state.typing{color:#b8a9ff;font-weight:700}.friend-copy .friend-state.in-chat{color:var(--lime)}.friend-copy .friend-state.unread-state{color:#d9dce7;font-weight:600}
.push-card{width:min(100%,510px)}.push-hero{display:flex;align-items:center;gap:1rem;padding:1.15rem;margin:1.4rem 0 1rem;border:1px solid rgba(124,92,252,.22);border-radius:17px;background:linear-gradient(135deg,rgba(124,92,252,.16),rgba(185,255,102,.035))}.push-phone{width:52px;height:52px;display:grid;place-items:center;flex:0 0 auto;border-radius:16px;background:var(--purple);box-shadow:0 12px 28px rgba(124,92,252,.3);font-size:1.25rem}.push-hero div{display:grid;gap:.3rem}.push-hero b{font:700 .98rem 'Manrope'}.push-hero p{margin:0;color:#9aa1b4;font-size:.78rem;line-height:1.5}.install-guide{border:1px solid #282e3e;border-radius:15px;background:#121620;padding:1rem;margin:.8rem 0}.install-guide>b{font-size:.85rem}.install-guide p,.install-guide ol{margin:.55rem 0 0;color:#9ca3b5;font-size:.78rem;line-height:1.65}.install-guide ol{padding-left:1.15rem}.secondary-action{border:1px solid #343a4c;border-radius:12px;background:#171b27;color:#fff;padding:.9rem 1rem;font-weight:700;cursor:pointer}.push-status{text-align:center;color:#838b9e;font-size:.76rem;line-height:1.5;margin:.85rem 0 0}.push-status.warning{color:#f0b45d}.push-status.success{color:var(--lime)}.push-card .primary:disabled{opacity:.52;cursor:not-allowed;box-shadow:none}

/* Personal profiles */
#chat-avatar{cursor:pointer}.profile-pane{padding:0}.profile-card{position:relative;padding:0;min-height:100%;--profile-accent:#7c5cfc}.profile-banner{height:126px;background-color:#171b28;background-image:radial-gradient(circle at 20% 15%,rgba(255,255,255,.22),transparent 24%),linear-gradient(135deg,var(--profile-accent),#171b28 88%);background-size:cover;background-position:center}.profile-banner:after{content:"";display:block;height:100%;background:linear-gradient(to bottom,transparent 50%,rgba(11,14,21,.34))}.profile-main{padding:0 1.35rem 1.5rem}.profile-main>.avatar{width:92px;height:92px;border-radius:29px;margin:-47px auto 1.05rem;font-size:1.5rem;border:4px solid #0e1119;box-shadow:0 0 0 2px var(--profile-accent),0 14px 28px rgba(0,0,0,.3)}.profile-card h3{font:750 1.2rem 'Manrope';margin:0}.profile-card .handle{color:var(--profile-accent)}.profile-card .profile-stats{margin-top:1.1rem}.profile-card .profile-stats b:first-child{color:#f4f5fa}.social-links{display:grid;grid-template-columns:1fr 1fr;gap:.45rem;margin:.2rem 0 1.1rem}.social-links a{min-width:0;display:flex;align-items:center;justify-content:center;gap:.42rem;padding:.57rem .5rem;border:1px solid #2a3040;border-radius:10px;background:#151925;color:#dce0ea;text-decoration:none;font-size:.7rem;font-weight:700;transition:.18s}.social-links a:hover{border-color:var(--profile-accent);background:#1a1f2d;transform:translateY(-1px)}.social-links a span{color:var(--profile-accent);font-size:.9rem}.profile-note{border:1px solid color-mix(in srgb,var(--profile-accent) 18%,#252a39);background:linear-gradient(135deg,color-mix(in srgb,var(--profile-accent) 9%,#151925),#151925)}.profile-close{display:none;position:absolute;z-index:3;right:.8rem;top:.8rem;background:rgba(8,10,16,.72);backdrop-filter:blur(10px)}
.settings-profile-preview{position:relative;margin:1.35rem 0 1rem;border:1px solid #2a3040;border-radius:18px;background:#0b0e15;overflow:hidden;--profile-accent:#7c5cfc}.settings-banner-preview{height:126px;background-color:#171b28;background-image:radial-gradient(circle at 20% 15%,rgba(255,255,255,.22),transparent 24%),linear-gradient(135deg,var(--profile-accent),#171b28 88%);background-size:cover;background-position:center;position:relative}.banner-upload{position:absolute;right:.75rem;top:.75rem;padding:.52rem .68rem;border:1px solid rgba(255,255,255,.18);border-radius:9px;background:rgba(8,10,16,.68);backdrop-filter:blur(10px);cursor:pointer;font-size:.72rem;font-weight:700}.banner-upload input,.upload-button input{display:none}.settings-avatar-row{display:flex;align-items:flex-end;gap:1rem;padding:0 1rem 1rem}.settings-avatar-row #settings-avatar{margin-top:-33px;position:relative}.settings-avatar-row .avatar{width:70px;height:70px;border-radius:22px;border:3px solid #0b0e15;box-shadow:0 0 0 2px var(--profile-accent)}.settings-avatar-row .upload-button{margin-bottom:.1rem}.color-picker-row{display:flex;align-items:center;gap:.9rem}.color-picker-row>input[type=color]{width:54px;height:42px;padding:.25rem;border-radius:11px;cursor:pointer}.color-swatches{display:flex;gap:.48rem}.color-swatches button{width:27px;height:27px;border:2px solid rgba(255,255,255,.18);border-radius:50%;background:var(--swatch);cursor:pointer;box-shadow:0 5px 14px rgba(0,0,0,.22)}.color-swatches button:hover{transform:scale(1.1);border-color:#fff}.social-editor{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}.social-editor label{display:grid;gap:.38rem;color:#aeb4c5;font-size:.75rem}.social-editor input{padding:.72rem .8rem;font-size:.78rem}
@media(max-width:1100px){.profile-pane.mobile-open{display:block;position:fixed;z-index:18;inset:0 0 0 auto;width:min(100%,390px);background:#0b0e15;box-shadow:-25px 0 70px rgba(0,0,0,.52)}.profile-pane.mobile-open .profile-close{display:grid}}
@media(max-width:760px){.profile-pane.mobile-open{inset:0;width:100%;z-index:19}.profile-banner{height:170px}.profile-main{padding-left:1.5rem;padding-right:1.5rem}.profile-main>.avatar{width:102px;height:102px;margin-top:-52px}.social-editor{grid-template-columns:1fr}.color-picker-row{align-items:flex-start;flex-direction:column}.settings-profile-preview{margin-top:1rem}}

/* Circle Nova — complete interface redesign */
:root{--bg:#06070b;--panel:#0d0f15;--panel-2:#141720;--line:rgba(255,255,255,.075);--muted:#8b92a3;--text:#f8f9fc;--purple:#7567ff;--purple-2:#aaa2ff;--lime:#8ff0df;--danger:#ff6b82;--shadow:0 28px 80px rgba(0,0,0,.44)}
html{color-scheme:dark}body{background:#06070b;-webkit-font-smoothing:antialiased}body:before{opacity:1;background:radial-gradient(circle at 9% -8%,rgba(117,103,255,.2),transparent 32%),radial-gradient(circle at 94% 106%,rgba(100,232,214,.09),transparent 28%)}
.eyebrow{font-size:.65rem;letter-spacing:.18em}.brand-mark{width:42px;height:42px;border-radius:14px;background:linear-gradient(145deg,#aaa2ff,#6554ed);box-shadow:0 14px 34px rgba(117,103,255,.3),inset 0 1px rgba(255,255,255,.25)}
.auth-shell{grid-template-columns:minmax(0,1.16fr) minmax(430px,.84fr);background:#07080d}.auth-art{padding:2.7rem 3.6rem;background:radial-gradient(circle at 72% 26%,rgba(117,103,255,.36),transparent 28%),radial-gradient(circle at 16% 87%,rgba(100,232,214,.12),transparent 26%),linear-gradient(150deg,#151928,#0b0d14 58%,#08090e)}.auth-art:after{background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;opacity:.45}.auth-art:before{width:620px;height:620px;right:-265px;bottom:-335px;border-color:rgba(255,255,255,.09);box-shadow:0 0 0 85px rgba(255,255,255,.017),0 0 0 170px rgba(255,255,255,.01)}.art-copy{max-width:740px}.art-copy h1{font-size:clamp(3.5rem,5.7vw,6.5rem);line-height:.94;letter-spacing:-.07em}.art-copy h1 em{background:linear-gradient(90deg,#64e8d6,#b3ff7c);background-clip:text;color:transparent}.art-copy>p:not(.eyebrow){max-width:540px;color:#adb4c4;font-size:1.08rem}.feature-pills span{padding:.55rem .8rem;background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.11);backdrop-filter:blur(12px)}.auth-panel{background:radial-gradient(circle at 50% 0,rgba(117,103,255,.14),transparent 31%),#090a0f}.auth-box{width:min(100%,445px);padding:2.35rem;border-radius:30px;background:rgba(15,17,25,.84);border-color:rgba(255,255,255,.08);box-shadow:0 35px 100px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.05)}.auth-box h2{font-size:2.6rem;letter-spacing:-.055em}input,textarea,select{border-color:rgba(255,255,255,.1);background:#0c0f16;border-radius:14px}input:focus,textarea:focus,select:focus{border-color:rgba(117,103,255,.75);background:#10131c;box-shadow:0 0 0 4px rgba(117,103,255,.12)}.primary{border-radius:14px;background:linear-gradient(135deg,#897bff,#6655e7);box-shadow:0 14px 30px rgba(105,88,237,.25);transition:.18s}.primary:hover{filter:brightness(1.08);transform:translateY(-1px)}
.app-shell{height:100vh;grid-template-columns:76px minmax(285px,330px) minmax(410px,1fr) minmax(245px,300px);gap:10px;padding:10px;background:transparent}.rail,.sidebar,.chat-panel,.profile-pane{border:1px solid rgba(255,255,255,.075);box-shadow:0 14px 38px rgba(0,0,0,.22)}.rail{border-radius:24px;padding:1rem 0;background:rgba(12,14,20,.9);backdrop-filter:blur(20px)}.rail nav{gap:.65rem}.rail-btn,.avatar-button{width:46px;height:46px;border-radius:15px}.rail-btn:hover{background:#171a23;color:#d9dce5}.rail-btn.active{background:linear-gradient(145deg,rgba(117,103,255,.27),rgba(117,103,255,.09));color:#bbb4ff;box-shadow:inset 0 0 0 1px rgba(167,158,255,.17)}.rail-btn.active:before{left:-15px;width:4px;height:20px;border-radius:8px;background:linear-gradient(#64e8d6,#7567ff);box-shadow:0 0 16px rgba(100,232,214,.3)}.avatar-button{box-shadow:0 0 0 1px rgba(255,255,255,.13)}
.sidebar{border-radius:24px;overflow:hidden;background:linear-gradient(180deg,rgba(16,19,27,.97),rgba(9,11,16,.97));backdrop-filter:blur(20px)}.sidebar-head{height:100px;padding:1.35rem 1.35rem .75rem}.sidebar-head h2{font-size:1.67rem;font-weight:800}.icon-button{border-color:rgba(255,255,255,.1);border-radius:13px;background:#151821;color:#abb2c0}.icon-button:hover{border-color:rgba(167,158,255,.4);background:#1a1e29}.search{margin:.4rem 1.15rem 1rem;border-color:rgba(255,255,255,.075);border-radius:14px;background:#0c0f16}.search:focus-within{border-color:rgba(117,103,255,.52);box-shadow:0 0 0 3px rgba(117,103,255,.08)}.friend-list,.people-list{padding:0 .7rem 1rem;scrollbar-width:thin;scrollbar-color:#252a37 transparent}.friend-item{padding:.78rem;border:1px solid transparent;border-radius:17px;transition:.18s}.friend-item:hover{background:#151923;border-color:rgba(255,255,255,.075);transform:translateX(2px)}.friend-item.active{background:linear-gradient(105deg,rgba(117,103,255,.19),rgba(117,103,255,.035));border-color:rgba(142,128,255,.24);box-shadow:inset 3px 0 #8c7eff}.avatar{border-radius:16px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 8px 20px rgba(0,0,0,.22)}.avatar .online-dot{background:#a8ff78;box-shadow:0 0 10px rgba(168,255,120,.35)}.unread{background:linear-gradient(145deg,#8d7fff,#6c5bf0);box-shadow:0 5px 14px rgba(117,103,255,.25)}.online-strip{border-color:rgba(255,255,255,.075)}
.chat-panel{border-radius:24px;overflow:hidden;background:radial-gradient(circle at 50% 115%,rgba(117,103,255,.14),transparent 44%),linear-gradient(180deg,#0c0e14,#080a0f)}.chat-panel:before{inset:80px 0 0;opacity:.18;background-size:28px 28px}.empty-symbol{width:82px;height:82px;border-color:rgba(117,103,255,.25);border-radius:28px;background:linear-gradient(145deg,rgba(117,103,255,.18),rgba(100,232,214,.05));color:#64e8d6;transform:none;box-shadow:0 18px 50px rgba(0,0,0,.28)}.empty-chat h2{font-size:1.66rem;font-weight:800}.active-chat{grid-template-rows:80px 1fr auto auto}.chat-head{padding:0 1.35rem;background:rgba(11,13,19,.76);backdrop-filter:blur(22px)}.chat-head .avatar{width:44px;height:44px}.popover{border-color:rgba(255,255,255,.11);border-radius:14px;background:#151821}.messages{padding:1.7rem clamp(1rem,4vw,3.8rem);scrollbar-width:thin;scrollbar-color:#252a37 transparent}.day-divider{align-self:center;padding:.4rem .7rem;border:1px solid rgba(255,255,255,.075);border-radius:999px;background:rgba(14,16,23,.72)}.bubble{border-color:rgba(255,255,255,.045);border-radius:8px 18px 18px 18px;background:#171b25;box-shadow:0 9px 28px rgba(0,0,0,.14)}.mine .bubble{border-radius:18px 8px 18px 18px;background:linear-gradient(145deg,#8375ff,#6453e2);box-shadow:0 10px 30px rgba(86,69,202,.21)}.receipt{color:#64e8d6}.composer{border-color:rgba(255,255,255,.11);border-radius:19px;background:rgba(19,22,31,.93);box-shadow:0 18px 45px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.035);backdrop-filter:blur(20px)}.send-button{border-radius:13px;background:linear-gradient(145deg,#8a7cff,#6857e8);box-shadow:0 8px 22px rgba(117,103,255,.3)}
.profile-pane{border-radius:24px;overflow:auto;background:linear-gradient(180deg,rgba(16,19,27,.97),rgba(9,11,16,.97));scrollbar-width:thin}.profile-banner{height:142px}.profile-main>.avatar{width:96px;height:96px;margin-top:-49px;border:5px solid #0e1118;border-radius:31px}.profile-card h3{font-size:1.22rem;font-weight:800}.social-links a{border-color:rgba(255,255,255,.075);border-radius:11px;background:#141822}.profile-note{border-radius:14px}
.modal{background:rgba(2,3,6,.74);backdrop-filter:blur(16px)}.modal-card{width:min(100%,610px);padding:1.65rem 1.8rem;border-color:rgba(255,255,255,.11);border-radius:27px;background:linear-gradient(180deg,#12151e,#0d1017);box-shadow:0 35px 100px rgba(0,0,0,.58);scrollbar-width:thin}.modal-card h2{font-weight:800}.settings-profile-preview{border-color:rgba(255,255,255,.11);border-radius:19px}.security-card{border-color:rgba(255,255,255,.075);border-radius:16px;background:linear-gradient(145deg,#161a24,#11141c)}.toast{border:1px solid rgba(255,255,255,.12);border-radius:13px}
@media(max-width:1180px){.app-shell{grid-template-columns:72px 310px 1fr}.profile-pane{display:none}.profile-pane.mobile-open{display:block;position:fixed;z-index:18;inset:10px 10px 10px auto;width:min(calc(100% - 20px),390px);border-radius:24px;box-shadow:-30px 0 80px rgba(0,0,0,.55)}.profile-pane.mobile-open .profile-close{display:grid}}
@media(max-width:760px){.auth-box{padding:1.45rem;border-radius:24px}.auth-box h2{font-size:2.1rem}.app-shell{height:100dvh;gap:0;padding:0;background:#080a0f}.rail{padding:.55rem 1rem;border:0;border-top:1px solid rgba(255,255,255,.075);border-radius:0;background:rgba(10,12,18,.95);box-shadow:0 -10px 35px rgba(0,0,0,.22);backdrop-filter:blur(22px)}.rail-btn.active:before{top:-9px}.sidebar,.chat-panel{border:0;border-radius:0}.sidebar-head{height:88px;padding:1.15rem 1rem .65rem}.search{margin-left:1rem;margin-right:1rem}.friend-item{padding:.78rem .65rem}.chat-head{height:72px}.profile-pane.mobile-open{inset:0;width:100%;border:0;border-radius:0}.profile-banner{height:180px}.modal-card{border-radius:20px}}
.forgot-button{display:block;margin:-.45rem 0 .2rem auto;padding:.2rem 0;border:0;background:transparent;color:#8f87ed;font-size:.72rem;font-weight:700;cursor:pointer}.forgot-button:hover{color:#bbb4ff}

/* Rich friend profile */
.app-shell{grid-template-columns:76px minmax(285px,330px) minmax(410px,1fr) minmax(285px,320px)}
.profile-card-new{isolation:isolate;background:radial-gradient(circle at 50% 34%,color-mix(in srgb,var(--profile-accent) 8%,transparent),transparent 27%)}
.profile-card-new:after{content:"";position:absolute;z-index:-1;left:15%;right:15%;bottom:3rem;height:180px;border-radius:50%;background:color-mix(in srgb,var(--profile-accent) 5%,transparent);filter:blur(55px);pointer-events:none}
.profile-card-new .profile-banner{position:relative;height:155px}
.profile-cover-label{position:absolute;left:1rem;top:1rem;z-index:2;padding:.35rem .52rem;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:rgba(7,9,14,.5);color:rgba(255,255,255,.78);font-size:.55rem;font-weight:850;letter-spacing:.16em;backdrop-filter:blur(10px)}
.profile-card-new .profile-main{padding:0 1.15rem 1.2rem}
.profile-identity{position:relative;display:grid;justify-items:center;margin-top:-51px;margin-bottom:.85rem}
.profile-identity>.avatar{width:100px;height:100px;border:5px solid #0d1017;border-radius:32px;font-size:1.55rem;box-shadow:0 0 0 2px var(--profile-accent),0 18px 38px rgba(0,0,0,.35)}
.profile-presence{display:flex;align-items:center;gap:.38rem;margin-top:-9px;padding:.34rem .58rem;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:#11151d;color:#9ea5b3;font-size:.61rem;font-weight:750;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.profile-presence i{width:6px;height:6px;border-radius:50%;background:#687080}.profile-presence.is-online{color:#d8fbd0}.profile-presence.is-online i{background:#9dff76;box-shadow:0 0 8px rgba(157,255,118,.65)}
.profile-card-new h3{font-size:1.28rem;letter-spacing:-.035em}.profile-card-new .handle{margin:.28rem 0 1rem;font-size:.73rem}
.profile-actions{display:grid;grid-template-columns:1fr 43px;gap:.5rem;margin-bottom:1.15rem}.profile-actions button{height:42px;border-radius:13px;font-size:.72rem;font-weight:850;cursor:pointer;transition:.18s}.profile-primary-action{display:flex;align-items:center;justify-content:center;gap:.46rem;border:0;background:linear-gradient(135deg,var(--profile-accent),color-mix(in srgb,var(--profile-accent) 70%,#4b3dba));color:#fff;box-shadow:0 10px 24px color-mix(in srgb,var(--profile-accent) 24%,transparent)}.profile-primary-action:hover{filter:brightness(1.09);transform:translateY(-1px)}.profile-primary-action span{font-size:.9rem}.profile-secondary-action{border:1px solid rgba(255,255,255,.1);background:#151923;color:#b5bac6}.profile-secondary-action:hover{border-color:var(--profile-accent);background:#1a1f2b}
.profile-section-label{display:block;margin-bottom:.55rem;color:#747c8e;font-size:.55rem;font-weight:900;letter-spacing:.16em}.profile-status-card,.profile-social-section{margin-bottom:.8rem;padding:.85rem .9rem;border:1px solid rgba(255,255,255,.075);border-radius:15px;background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012));text-align:left}.profile-status-card{position:relative;overflow:hidden}.profile-status-card:before{content:"";position:absolute;left:0;top:.75rem;bottom:.75rem;width:2px;border-radius:4px;background:var(--profile-accent)}.profile-status-card p{margin:0;color:#d9dde6;font-size:.78rem;line-height:1.5}.profile-social-section .social-links{margin:0}.profile-social-section .social-links a{background:rgba(8,10,15,.45)}
.profile-facts{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:.8rem}.profile-facts>div{min-width:0;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:.5rem;padding:.75rem;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:#11141c;text-align:left}.fact-icon{grid-row:1/3;align-self:center;width:27px;height:27px;display:grid;place-items:center;border-radius:9px;background:color-mix(in srgb,var(--profile-accent) 14%,#151923);color:var(--profile-accent);font-size:.72rem}.profile-facts small{overflow:hidden;color:#757d8e;font-size:.56rem;white-space:nowrap;text-overflow:ellipsis}.profile-facts b{overflow:hidden;color:#d9dde6;font-size:.65rem;white-space:nowrap;text-overflow:ellipsis}
.profile-room{display:flex;align-items:center;gap:.7rem;padding:.82rem .85rem;border:1px solid color-mix(in srgb,var(--profile-accent) 18%,rgba(255,255,255,.07));border-radius:15px;background:linear-gradient(135deg,color-mix(in srgb,var(--profile-accent) 8%,#121620),#11141c);text-align:left}.room-lock{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:11px;background:color-mix(in srgb,var(--profile-accent) 15%,#151923);color:var(--profile-accent);font-weight:900}.profile-room>span:last-child{display:grid;gap:.18rem}.profile-room b{font-size:.72rem}.profile-room small{color:#858d9e;font-size:.62rem;line-height:1.4}
@media(max-width:1180px){.app-shell{grid-template-columns:72px 310px 1fr}}
@media(max-width:760px){.profile-card-new .profile-banner{height:190px}.profile-card-new .profile-main{padding-left:1.2rem;padding-right:1.2rem}.profile-identity{margin-top:-55px}.profile-identity>.avatar{width:108px;height:108px}.profile-facts b{font-size:.7rem}}
.desktop-close-chat{flex:0 0 auto;color:#777f90;background:transparent;border-color:transparent;font-size:1.2rem}.desktop-close-chat:hover{color:#fff;background:#181c26;border-color:rgba(255,255,255,.08)}
@media(max-width:760px){.desktop-close-chat{display:none}}
.chat-profile-trigger{min-width:0;display:flex;align-items:center;gap:.85rem;padding:.35rem .45rem;border:0;border-radius:14px;background:transparent;color:inherit;text-align:left;cursor:pointer;transition:.18s}.chat-profile-trigger:hover{background:rgba(255,255,255,.045)}.chat-profile-trigger:after{content:"Profil ansehen";margin-left:.25rem;color:#666e7f;font-size:.6rem;opacity:0;transform:translateX(-5px);transition:.18s}.chat-profile-trigger:hover:after{opacity:1;transform:translateX(0)}.chat-profile-trigger .chat-person{min-width:0}.chat-profile-trigger #chat-avatar{display:block;flex:0 0 auto}
.profile-presence{min-height:25px;padding:.38rem .65rem;color:#a9b0bd;font-size:.67rem}
.profile-facts{grid-template-columns:1fr;gap:.48rem}.profile-facts>div{display:flex;align-items:center;gap:.7rem;padding:.78rem .82rem}.profile-facts .fact-icon{grid-row:auto;width:32px;height:32px;flex:0 0 auto}.fact-copy{min-width:0;display:grid;gap:.13rem}.profile-facts .fact-copy small{overflow:visible;color:#858d9e;font-size:.63rem;white-space:normal}.profile-facts .fact-copy b{overflow:visible;color:#eef0f5;font-size:.74rem;line-height:1.35;white-space:normal;text-overflow:clip}
.profile-pane.profile-highlight{animation:profileFocus .65s ease}@keyframes profileFocus{0%,100%{box-shadow:0 14px 38px rgba(0,0,0,.22)}45%{box-shadow:0 0 0 2px rgba(167,158,255,.55),0 18px 55px rgba(117,103,255,.22)}}
@media(max-width:760px){.chat-profile-trigger{gap:.65rem;padding:.28rem}.chat-profile-trigger:after{display:none}.profile-presence{font-size:.7rem}}

/* Reports, admin and staff panel */
.modal-intro{margin:1.2rem 0;color:#929aaa;font-size:.8rem;line-height:1.6}.report-card{width:min(100%,520px)}
.panel-card{width:min(96vw,1080px);height:min(92vh,850px);display:flex;flex-direction:column;overflow:hidden}.panel-overview{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;margin:1.25rem 0 1rem;padding:1rem;border:1px solid rgba(117,103,255,.2);border-radius:17px;background:linear-gradient(135deg,rgba(117,103,255,.13),rgba(100,232,214,.035))}.panel-shield{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:rgba(117,103,255,.18);color:#aaa2ff;font-size:1.1rem}.panel-overview>span:nth-child(2){display:grid;gap:.2rem}.panel-overview b{font-size:.83rem}.panel-overview small{color:#8991a1;font-size:.69rem}.panel-overview strong{padding:.4rem .62rem;border-radius:999px;background:rgba(255,107,130,.11);color:#ff91a3;font-size:.68rem}
.panel-tabs{display:flex;gap:.35rem;padding:.3rem;border:1px solid rgba(255,255,255,.075);border-radius:13px;background:#0a0c12}.panel-tabs button{flex:1;padding:.7rem;border:0;border-radius:10px;background:transparent;color:#777f90;font-size:.75rem;font-weight:800;cursor:pointer}.panel-tabs button.active{background:#191d28;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}.panel-view{overflow:auto;padding:.9rem .15rem .5rem;scrollbar-width:thin;scrollbar-color:#2b3040 transparent}
.report-item{margin-bottom:.7rem;padding:1rem;border:1px solid rgba(255,255,255,.08);border-radius:17px;background:#11141c}.report-item.open{border-color:rgba(255,107,130,.19)}.report-item>header,.report-item>footer{display:flex;align-items:center;justify-content:space-between;gap:.6rem}.report-item>header time{color:#697183;font-size:.63rem}.report-state{padding:.28rem .45rem;border-radius:7px;background:rgba(143,240,223,.09);color:#8ff0df;font-size:.54rem;font-weight:900;letter-spacing:.12em}.report-item.open .report-state{background:rgba(255,107,130,.1);color:#ff879b}.report-route{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.75rem;margin:.85rem 0;padding:.8rem;border-radius:13px;background:#0b0e14}.report-route>span{min-width:0;display:grid;gap:.15rem}.report-route>span:last-child{text-align:right}.report-route small{color:#6f7788;font-size:.58rem}.report-route b{overflow:hidden;font-size:.77rem;text-overflow:ellipsis;white-space:nowrap}.report-route em{overflow:hidden;color:#8f97a8;font-size:.62rem;font-style:normal;text-overflow:ellipsis;white-space:nowrap}.report-route i{color:#6962b6;font-style:normal}.report-reason{padding:.1rem .15rem .85rem}.report-reason>b{font-size:.76rem}.report-reason p{margin:.4rem 0 0;color:#a2a9b7;font-size:.72rem;line-height:1.5}.report-item>footer{justify-content:flex-end;border-top:1px solid rgba(255,255,255,.065);padding-top:.75rem}
.panel-search{display:grid;gap:.42rem;margin:.15rem 0 .8rem;color:#8f97a8;font-size:.69rem}.panel-search input{padding:.7rem .8rem}.panel-user{display:grid;grid-template-columns:auto minmax(170px,1fr) 130px auto;align-items:center;gap:.75rem;padding:.75rem;border-bottom:1px solid rgba(255,255,255,.07)}.panel-user.is-suspended{background:rgba(255,107,130,.035)}.panel-user-avatar{width:39px;height:39px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,#7567ff,#5144bb);font-size:.72rem;font-weight:900}.panel-user-copy{min-width:0;display:grid;gap:.12rem}.panel-user-copy b{font-size:.78rem}.panel-user-copy small{overflow:hidden;color:#8d95a5;font-size:.64rem;text-overflow:ellipsis;white-space:nowrap}.panel-user-copy em{color:#777f90;font-size:.59rem;font-style:normal}.panel-user.is-suspended .panel-user-copy em{color:#ff879b}.panel-user select{padding:.55rem .62rem;border-radius:10px;font-size:.68rem}.panel-user button:disabled,.panel-user select:disabled{opacity:.45;cursor:not-allowed}.panel-card h3{margin:1.25rem 0 .5rem;color:#7f8798;font-size:.65rem;letter-spacing:.13em;text-transform:uppercase}.audit-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.62rem .3rem;border-bottom:1px solid rgba(255,255,255,.055);color:#9ba2b1;font-size:.65rem}.audit-row b{color:#d7dbe4}.audit-row time{color:#686f7f;white-space:nowrap}
.panel-empty{display:grid;place-items:center;gap:.35rem;padding:2.4rem;text-align:center;color:#777f90}.panel-empty>span{width:46px;height:46px;display:grid;place-items:center;border-radius:15px;background:rgba(143,240,223,.09);color:#8ff0df;font-size:1.2rem}.panel-empty b{color:#cdd1da;font-size:.82rem}.panel-empty p{margin:0;font-size:.7rem}.panel-conversation{position:absolute;z-index:3;inset:5.5rem 1.5rem 1.5rem;overflow:auto;padding:1.1rem;border:1px solid rgba(255,255,255,.11);border-radius:18px;background:#0c0f16;box-shadow:0 25px 80px rgba(0,0,0,.55)}.panel-card{position:relative}.panel-conversation>header{display:flex;align-items:center;justify-content:space-between}.panel-conversation h3{margin:0;color:#f1f2f6;font-size:1rem;letter-spacing:0;text-transform:none}.panel-conversation>p{color:#858d9d;font-size:.68rem}.panel-message{max-width:78%;margin:.5rem 0;padding:.72rem .82rem;border:1px solid rgba(255,255,255,.07);border-radius:8px 15px 15px 15px;background:#171b25}.panel-message:nth-child(even){margin-left:auto;border-radius:15px 8px 15px 15px;background:#1a1930}.panel-message header{display:flex;justify-content:space-between;gap:1rem}.panel-message header b{font-size:.67rem}.panel-message header time{color:#6e7687;font-size:.58rem}.panel-message p{margin:.35rem 0 0;color:#d7dae2;font-size:.72rem;line-height:1.45}
@media(max-width:760px){.panel-card{width:100%;height:97vh}.panel-overview{grid-template-columns:auto 1fr}.panel-overview strong{grid-column:2;justify-self:start}.panel-user{grid-template-columns:auto 1fr}.panel-user select,.panel-user>button{grid-column:2}.report-route{grid-template-columns:1fr}.report-route>span:last-child{text-align:left}.report-route i{transform:rotate(90deg);justify-self:center}.report-item>footer{align-items:stretch;flex-direction:column}.panel-conversation{inset:4.8rem .55rem .55rem}.panel-message{max-width:92%}}
@media(max-width:760px){.rail nav{min-width:0}.rail-btn{width:42px;height:46px}.rail .avatar-button{width:38px;height:38px}.panel-card{padding-left:1rem;padding-right:1rem}}

/* Stable mobile layout — final overrides */
@media(max-width:760px){
  html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{position:fixed;inset:0}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}input,textarea,select{font-size:16px}
  .auth-shell{display:block;width:100%;height:100dvh;min-height:0;overflow-y:auto;overscroll-behavior-y:contain}.auth-panel{min-height:100dvh;padding:5.8rem 1rem max(1.2rem,env(safe-area-inset-bottom));display:block}.mobile-brand{position:absolute;top:max(1.2rem,env(safe-area-inset-top));left:1.15rem}.mobile-brand .brand-mark{width:38px;height:38px}.auth-box{width:100%;margin:0;padding:1.35rem;border-radius:23px}.auth-box h2{font-size:clamp(1.9rem,9vw,2.25rem)}.auth-box>p:nth-child(3){margin-bottom:1.35rem}.auth-box label{margin:.82rem 0}.legal{padding-bottom:.25rem}
  .app-shell{position:fixed;inset:0;width:100%;height:100dvh;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) calc(64px + env(safe-area-inset-bottom));gap:0;padding:0;overflow:hidden}.app-shell.chat-open{grid-template-rows:minmax(0,1fr)}
  .rail{grid-row:2;grid-column:1;width:100%;min-width:0;height:auto;display:flex;flex-direction:row;align-items:center;gap:.25rem;padding:.42rem .55rem max(.42rem,env(safe-area-inset-bottom));border:0;border-top:1px solid rgba(255,255,255,.08);border-radius:0;background:rgba(9,11,17,.97);box-shadow:0 -12px 35px rgba(0,0,0,.28);backdrop-filter:blur(24px)}.rail-logo{display:none}.rail nav{min-width:0;display:flex;flex:1;align-items:center;justify-content:space-evenly;gap:0;margin:0}.rail-btn{flex:1;width:auto;max-width:48px;height:46px;border-radius:14px}.rail-btn.active:before{left:50%;top:-7px;width:22px;height:3px;transform:translateX(-50%)}.rail .avatar-button{width:39px;height:39px;flex:0 0 auto;margin-left:.2rem;border-radius:13px}
  .sidebar{grid-row:1;grid-column:1;min-width:0;min-height:0;height:100%;display:flex;overflow:hidden;border:0;border-radius:0;background:linear-gradient(180deg,#10131c,#090b10)}.sidebar-head{height:79px;min-height:79px;padding:max(.9rem,env(safe-area-inset-top)) 1rem .55rem}.sidebar-head h2{font-size:1.48rem}.sidebar-head .eyebrow{margin-bottom:.32rem}.search{min-height:45px;margin:.2rem .85rem .75rem;padding:0 .72rem;border-radius:14px}.search input{padding:.68rem .5rem}.online-strip{padding:0 .9rem .75rem;margin-bottom:.25rem}.friend-list,.people-list{min-height:0;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 .45rem calc(.8rem + env(safe-area-inset-bottom))}.friend-item{min-height:67px;margin:.1rem 0;padding:.62rem;border-radius:16px}.friend-item .avatar{width:45px;height:45px}.friend-copy strong{font-size:.88rem}.friend-copy span{font-size:.73rem}.people-card{grid-template-columns:auto minmax(0,1fr) auto;padding:.7rem .55rem}.people-card .small-action{white-space:nowrap}
  .chat-panel{grid-row:1;grid-column:1;min-width:0;min-height:0;width:100%;height:100dvh;display:none;overflow:hidden;border:0;border-radius:0}.app-shell.chat-open .chat-panel{display:block}.app-shell.chat-open .sidebar,.app-shell.chat-open .rail{display:none}.active-chat{width:100%;height:100dvh!important;min-height:0;grid-template-rows:68px minmax(0,1fr) 24px auto}.chat-head{width:100%;height:68px;padding:max(.35rem,env(safe-area-inset-top)) .6rem .35rem;gap:.35rem;border-bottom-color:rgba(255,255,255,.075)}.mobile-only{display:grid}.chat-head>.icon-button{width:38px;height:38px;flex:0 0 auto}.chat-profile-trigger{min-width:0;flex:1;gap:.58rem;padding:.25rem;border-radius:12px}.chat-profile-trigger .avatar{width:39px;height:39px;border-radius:13px}.chat-profile-trigger .chat-person{min-width:0}.chat-person strong,.chat-person span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-person strong{font-size:.85rem}.chat-person span{font-size:.66rem}.chat-actions{margin-left:0;flex:0 0 auto}.chat-actions>.icon-button{width:38px;height:38px}.popover{position:fixed;top:64px;right:.6rem;width:min(220px,calc(100vw - 1.2rem));z-index:12}
  .messages{min-width:0;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;padding:1rem .72rem .7rem;gap:.52rem}.bubble-row{max-width:88%;gap:.38rem}.bubble{padding:.68rem .82rem;font-size:.84rem;line-height:1.43}.bubble-time{font-size:.56rem}.day-divider{margin:.15rem auto .7rem}.typing-line{height:24px;padding:0 .82rem;font-size:.66rem}.composer{width:auto;min-width:0;margin:.1rem .55rem max(.55rem,env(safe-area-inset-bottom));grid-template-columns:36px minmax(0,1fr) 39px;gap:.3rem;padding:.42rem;border-radius:17px}.composer textarea{width:100%;min-width:0;min-height:38px;max-height:92px;padding:.55rem .35rem;font-size:16px}.composer-add{width:36px;height:38px}.send-button{width:39px;height:39px}
  .profile-pane,.profile-pane.mobile-open{position:fixed;z-index:30;inset:0;width:100%;height:100dvh;display:none;overflow-y:auto;-webkit-overflow-scrolling:touch;border:0;border-radius:0;background:#0a0c12;box-shadow:none}.profile-pane.mobile-open{display:block}.profile-card-new{min-height:100dvh}.profile-card-new .profile-banner{height:165px}.profile-card-new .profile-main{padding:0 1rem max(1.4rem,env(safe-area-inset-bottom))}.profile-identity{margin-top:-51px}.profile-identity>.avatar{width:101px;height:101px}.profile-close{position:fixed;z-index:32;display:grid;right:.75rem;top:max(.75rem,env(safe-area-inset-top));background:rgba(8,10,16,.76)}.profile-actions{margin-left:auto;margin-right:auto;max-width:440px}.profile-status-card,.profile-social-section,.profile-facts,.profile-room{max-width:440px;margin-left:auto;margin-right:auto}.profile-card-new h3{font-size:1.24rem}.social-links{grid-template-columns:1fr 1fr}
  .modal{position:fixed;z-index:40;inset:0;width:100%;height:100dvh;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;padding:0;background:rgba(2,3,6,.78);backdrop-filter:blur(12px)}.modal-card{width:100%;max-width:none;max-height:92dvh;margin:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:1.15rem 1rem max(1.2rem,env(safe-area-inset-bottom));border-width:1px 0 0;border-radius:24px 24px 0 0;box-shadow:0 -25px 70px rgba(0,0,0,.55)}.modal-card>header{position:sticky;z-index:2;top:-1.15rem;margin:-1.15rem -1rem .5rem;padding:1.1rem 1rem .7rem;background:linear-gradient(#12151e 78%,transparent)}.modal-card h2{font-size:1.3rem}.modal-intro{margin:.8rem 0}.settings-profile-preview{margin-top:.9rem}.settings-banner-preview{height:112px}.settings-avatar-row{gap:.7rem;padding:0 .75rem .8rem}.settings-avatar-row .avatar{width:64px;height:64px}.upload-button{font-size:.68rem}.color-picker-row{flex-direction:row;align-items:center;overflow-x:auto}.color-swatches{min-width:max-content}.social-editor{grid-template-columns:1fr}.setting-row,.switch-row{gap:.7rem}.setting-row>span,.switch-row>span{min-width:0}.setting-row select{width:116px;flex:0 0 116px;padding:.52rem}.security-card{padding:.8rem}.security-card-head{grid-template-columns:auto minmax(0,1fr);gap:.65rem}.security-card-head>button{grid-column:2;justify-self:start}.password-grid{grid-template-columns:1fr}.device-row{align-items:flex-start}.device-row button{white-space:nowrap}#recovery-codes{grid-template-columns:1fr 1fr}
  .panel-card{height:100dvh;max-height:100dvh;padding:0 1rem max(1rem,env(safe-area-inset-bottom));border:0;border-radius:0}.panel-card>header{top:0;margin:0 -1rem;padding:max(.8rem,env(safe-area-inset-top)) 1rem .65rem}.panel-overview{grid-template-columns:auto minmax(0,1fr);margin:.65rem 0;padding:.75rem}.panel-overview strong{grid-column:2;justify-self:start}.panel-tabs{flex:0 0 auto}.panel-view{min-height:0;flex:1;padding-top:.65rem}.panel-user{grid-template-columns:40px minmax(0,1fr);gap:.55rem;padding:.7rem .15rem}.panel-user select,.panel-user>button{grid-column:2;width:100%}.report-item{padding:.82rem}.report-route{grid-template-columns:1fr;gap:.35rem}.report-route>span:last-child{text-align:left}.report-route i{justify-self:center;transform:rotate(90deg)}.report-item>footer{align-items:stretch;flex-direction:column}.report-item>footer button{min-height:40px}.panel-conversation{position:fixed;z-index:45;inset:0;overflow-y:auto;padding:max(1rem,env(safe-area-inset-top)) .8rem max(1rem,env(safe-area-inset-bottom));border:0;border-radius:0}.panel-message{max-width:92%}
  .push-hero{padding:.9rem}.toast{bottom:calc(76px + env(safe-area-inset-bottom));width:calc(100% - 1.4rem);max-width:none;text-align:center}.app-shell.chat-open~.toast{bottom:1rem}
}
@media(max-width:380px){.rail{padding-left:.3rem;padding-right:.3rem}.rail-btn{max-width:43px}.rail .avatar-button{width:36px;height:36px}.sidebar-head{padding-left:.85rem;padding-right:.85rem}.chat-head{padding-left:.4rem;padding-right:.4rem}.chat-profile-trigger .avatar{width:36px;height:36px}.messages{padding-left:.55rem;padding-right:.55rem}.bubble-row{max-width:91%}.profile-card-new .profile-banner{height:150px}.panel-overview small{display:none}}
@media(max-width:760px) and (max-height:520px) and (orientation:landscape){.auth-panel{padding-top:1rem}.mobile-brand{display:none}.modal-card{max-height:100dvh;border-radius:0}.profile-card-new .profile-banner{height:120px}.profile-identity{margin-top:-42px}.profile-identity>.avatar{width:82px;height:82px}.panel-card{height:100dvh}}
@media(max-width:760px){.app-shell,.chat-panel,.active-chat,.profile-pane,.profile-pane.mobile-open,.modal{height:var(--app-height,100dvh)}.panel-card{height:var(--app-height,100dvh);max-height:var(--app-height,100dvh)}}

/* Native-like mode for touch devices, even with desktop viewport enabled */
html,body{max-width:100%;overflow-x:clip;touch-action:pan-x pan-y}
body.mobile-app{position:fixed;inset:0;width:100%;height:var(--app-height,100dvh);overflow:hidden;overscroll-behavior:none}body.mobile-app button,body.mobile-app a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}body.mobile-app input,body.mobile-app textarea,body.mobile-app select{font-size:16px}
body.mobile-app .auth-shell{display:block;width:100%;height:var(--app-height,100dvh);min-height:0;overflow-y:auto;overflow-x:hidden}body.mobile-app .auth-art{display:none}body.mobile-app .auth-panel{width:100%;min-height:var(--app-height,100dvh);display:block;padding:5.8rem 1rem max(1.2rem,env(safe-area-inset-bottom))}body.mobile-app .mobile-brand{display:flex;position:absolute;top:max(1.15rem,env(safe-area-inset-top));left:1.1rem}body.mobile-app .auth-box{width:100%;max-width:500px;margin:0 auto;padding:1.35rem;border-radius:23px}
body.mobile-app .app-shell{position:fixed;inset:0;width:100%;height:var(--app-height,100dvh);min-width:0;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) calc(64px + env(safe-area-inset-bottom));gap:0;padding:0;overflow:hidden}body.mobile-app .app-shell.chat-open{grid-template-rows:minmax(0,1fr)}body.mobile-app .app-shell>*{min-width:0;max-width:100%}
body.mobile-app .rail{grid-row:2;grid-column:1;width:100%;height:auto;display:flex;flex-direction:row;align-items:center;gap:.2rem;padding:.42rem .55rem max(.42rem,env(safe-area-inset-bottom));border:0;border-top:1px solid rgba(255,255,255,.08);border-radius:0;background:rgba(9,11,17,.97);box-shadow:0 -12px 35px rgba(0,0,0,.28)}body.mobile-app .rail-logo{display:none}body.mobile-app .rail nav{min-width:0;display:flex;flex:1;align-items:center;justify-content:space-evenly;gap:0;margin:0}body.mobile-app .rail-btn{flex:1;width:auto;max-width:50px;height:46px;border-radius:14px}body.mobile-app .rail-btn.active:before{left:50%;top:-7px;width:22px;height:3px;transform:translateX(-50%)}body.mobile-app .rail .avatar-button{width:39px;height:39px;flex:0 0 auto;margin-left:.15rem;border-radius:13px}
body.mobile-app .sidebar{grid-row:1;grid-column:1;width:100%;height:100%;min-height:0;display:flex;overflow:hidden;border:0;border-radius:0}body.mobile-app .sidebar-head{height:79px;min-height:79px;padding:max(.9rem,env(safe-area-inset-top)) 1rem .55rem}body.mobile-app .sidebar-head h2{font-size:1.48rem}body.mobile-app .search{min-height:45px;margin:.2rem .85rem .75rem;padding:0 .72rem}body.mobile-app .online-strip{padding:0 .9rem .7rem;margin-bottom:.2rem;overflow:hidden}body.mobile-app .online-strip>div{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.35rem;overflow:hidden}body.mobile-app .online-strip button{min-width:0;width:100%}body.mobile-app .online-strip small{max-width:100%}body.mobile-app .friend-list,body.mobile-app .people-list{width:100%;min-height:0;flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:0 .45rem calc(.8rem + env(safe-area-inset-bottom))}body.mobile-app .friend-item{width:100%;min-width:0;grid-template-columns:auto minmax(0,1fr) auto;min-height:67px;margin:.1rem 0;padding:.62rem}body.mobile-app .people-card{width:100%;min-width:0;grid-template-columns:auto minmax(0,1fr) auto;padding:.7rem .55rem}
body.mobile-app .chat-panel{grid-row:1;grid-column:1;width:100%;height:var(--app-height,100dvh);min-width:0;min-height:0;display:none;overflow:hidden;border:0;border-radius:0}body.mobile-app .app-shell.chat-open .chat-panel{display:block}body.mobile-app .app-shell.chat-open .sidebar,body.mobile-app .app-shell.chat-open .rail{display:none}body.mobile-app .active-chat{width:100%;height:var(--app-height,100dvh)!important;min-height:0;grid-template-rows:68px minmax(0,1fr) 24px auto}body.mobile-app .chat-head{width:100%;height:68px;padding:max(.35rem,env(safe-area-inset-top)) .6rem .35rem;gap:.35rem}body.mobile-app .mobile-only{display:grid}body.mobile-app .desktop-close-chat{display:none}body.mobile-app .chat-head>.icon-button,body.mobile-app .chat-actions>.icon-button{width:38px;height:38px;flex:0 0 auto}body.mobile-app .chat-profile-trigger{min-width:0;flex:1;gap:.55rem;padding:.23rem}body.mobile-app .chat-profile-trigger:after{display:none}body.mobile-app .chat-profile-trigger .avatar{width:39px;height:39px}body.mobile-app .chat-person{min-width:0}body.mobile-app .chat-person strong,body.mobile-app .chat-person span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}body.mobile-app .chat-actions{margin-left:0;flex:0 0 auto}body.mobile-app .popover{position:fixed;z-index:35;top:64px;right:.55rem;width:min(220px,calc(100% - 1.1rem))}
body.mobile-app .messages{width:100%;min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;padding:1rem .72rem .7rem}body.mobile-app .bubble-row{max-width:88%}body.mobile-app .bubble{font-size:.84rem}body.mobile-app .typing-line{height:24px;padding:0 .82rem}body.mobile-app .composer{width:auto;min-width:0;margin:.1rem .55rem max(.55rem,env(safe-area-inset-bottom));grid-template-columns:36px minmax(0,1fr) 39px;gap:.3rem;padding:.42rem}body.mobile-app .composer textarea{width:100%;min-width:0;max-height:92px;padding:.55rem .35rem}body.mobile-app .composer-add{width:36px}body.mobile-app .send-button{width:39px}
body.mobile-app .profile-pane,body.mobile-app .profile-pane.mobile-open{position:fixed;z-index:30;inset:0;width:100%;height:var(--app-height,100dvh);display:none;overflow-y:auto;overflow-x:hidden;border:0;border-radius:0}body.mobile-app .profile-pane.mobile-open{display:block}body.mobile-app .profile-card-new{min-height:var(--app-height,100dvh)}body.mobile-app .profile-card-new .profile-banner{height:165px}body.mobile-app .profile-card-new .profile-main{padding:0 1rem max(1.4rem,env(safe-area-inset-bottom))}body.mobile-app .profile-close{position:fixed;z-index:32;display:grid;right:.75rem;top:max(.75rem,env(safe-area-inset-top))}body.mobile-app .profile-actions,body.mobile-app .profile-status-card,body.mobile-app .profile-social-section,body.mobile-app .profile-facts,body.mobile-app .profile-room{width:100%;max-width:460px;margin-left:auto;margin-right:auto}
body.mobile-app .modal{position:fixed;z-index:40;inset:0;width:100%;height:var(--app-height,100dvh);display:flex;align-items:flex-end;justify-content:center;overflow:hidden;padding:0}body.mobile-app .modal-card{width:100%;max-width:none;max-height:92%;margin:0;overflow-y:auto;overflow-x:hidden;padding:1.15rem 1rem max(1.2rem,env(safe-area-inset-bottom));border-width:1px 0 0;border-radius:24px 24px 0 0}body.mobile-app .modal-card>header{position:sticky;z-index:2;top:-1.15rem;margin:-1.15rem -1rem .5rem;padding:1.1rem 1rem .7rem;background:linear-gradient(#12151e 78%,transparent)}body.mobile-app .social-editor,body.mobile-app .password-grid{grid-template-columns:1fr}body.mobile-app .setting-row>span,body.mobile-app .switch-row>span{min-width:0}body.mobile-app .setting-row select{width:116px;flex:0 0 116px}body.mobile-app .security-card-head{grid-template-columns:auto minmax(0,1fr)}body.mobile-app .security-card-head>button{grid-column:2;justify-self:start}
body.mobile-app .panel-card{height:var(--app-height,100dvh);max-height:var(--app-height,100dvh);padding:0 1rem max(1rem,env(safe-area-inset-bottom));border:0;border-radius:0}body.mobile-app .panel-card>header{top:0;margin:0 -1rem;padding:max(.8rem,env(safe-area-inset-top)) 1rem .65rem}body.mobile-app .panel-view{min-height:0;flex:1;overflow-x:hidden}body.mobile-app .panel-user{grid-template-columns:40px minmax(0,1fr)}body.mobile-app .panel-user select,body.mobile-app .panel-user>button{grid-column:2;width:100%}body.mobile-app .report-route{grid-template-columns:1fr}body.mobile-app .report-route>span:last-child{text-align:left}body.mobile-app .report-route i{justify-self:center;transform:rotate(90deg)}body.mobile-app .report-item>footer{align-items:stretch;flex-direction:column}body.mobile-app .panel-conversation{position:fixed;z-index:45;inset:0;overflow-y:auto;overflow-x:hidden;padding:max(1rem,env(safe-area-inset-top)) .8rem max(1rem,env(safe-area-inset-bottom));border:0;border-radius:0}body.mobile-app .toast{bottom:calc(72px + env(safe-area-inset-bottom));width:calc(100% - 1.2rem);max-width:none;text-align:center}

/* Compact app navigation and settings */
.settings-tabs{position:sticky;z-index:3;top:64px;display:grid;grid-template-columns:repeat(3,1fr);gap:.3rem;margin:.8rem 0;padding:.3rem;border:1px solid rgba(255,255,255,.075);border-radius:14px;background:#0a0c12}.settings-tabs button{min-width:0;padding:.66rem .35rem;border:0;border-radius:10px;background:transparent;color:#7d8596;font-size:.72rem;font-weight:800;cursor:pointer}.settings-tabs button.active{background:#1a1e2a;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}.settings-pane{min-width:0}.settings-savebar{position:sticky;z-index:4;bottom:-1.2rem;margin:1rem -1rem -1.2rem;padding:.55rem 1rem max(.8rem,env(safe-area-inset-bottom));background:linear-gradient(transparent,#11151f 20%)}.settings-savebar .wide{margin:.45rem 0 0}
.legal a{color:#9285ff;text-decoration:none}.legal a:hover{text-decoration:underline}.account-legal-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.45rem;margin:1rem 0}.account-legal-links a{padding:.45rem .6rem;border:1px solid rgba(255,255,255,.08);border-radius:9px;color:#8d95a6;text-decoration:none;font-size:.65rem;font-weight:700}.account-legal-links a:hover{color:#fff;border-color:rgba(142,128,255,.35)}
.security-detail{margin:.8rem 0 0;color:#8f97a8;font-size:.72rem;line-height:1.55}

@media(max-width:900px),(hover:none) and (pointer:coarse){
  html,body{width:100%!important;max-width:100%!important;height:100%;overflow:hidden!important}body{overscroll-behavior:none}
  body.mobile-app *,body.mobile-app *:before,body.mobile-app *:after{max-width:100%;min-width:0}
  body.mobile-app .app-shell,body.mobile-app .sidebar,body.mobile-app .chat-panel,body.mobile-app .active-chat,body.mobile-app .profile-pane,body.mobile-app .modal{left:0;right:0;width:100%;max-width:100vw;overflow-x:hidden}
  body.mobile-app .sidebar-head{height:64px;min-height:64px;padding:max(.55rem,env(safe-area-inset-top)) .8rem .35rem}body.mobile-app .sidebar-head .eyebrow{display:none}body.mobile-app .sidebar-head h2{font-size:1.28rem}
  body.mobile-app .search{min-height:40px;margin:.25rem .7rem .55rem}body.mobile-app .search input{padding:.48rem .4rem}
  body.mobile-app .online-strip{padding:0 .7rem .5rem;margin:0}body.mobile-app .online-label{margin-bottom:.4rem}body.mobile-app .online-strip>div{grid-template-columns:repeat(auto-fit,minmax(42px,1fr));gap:.3rem}body.mobile-app .online-strip .avatar{width:38px;height:38px}body.mobile-app .online-strip small{font-size:.57rem;white-space:nowrap}
  body.mobile-app .friend-item{min-height:58px;padding:.45rem .55rem}body.mobile-app .friend-item .avatar{width:41px;height:41px}body.mobile-app .people-card{padding:.52rem}body.mobile-app .friend-meta{font-size:.6rem}
  body.mobile-app .rail{height:calc(58px + env(safe-area-inset-bottom));padding:.25rem .35rem max(.25rem,env(safe-area-inset-bottom))}body.mobile-app .rail nav{justify-content:space-around}body.mobile-app .rail-btn{height:42px;max-width:46px}body.mobile-app .rail .avatar-button{width:36px;height:36px}
  body.mobile-app .active-chat{grid-template-rows:60px minmax(0,1fr) 20px auto}body.mobile-app .chat-head{height:60px;padding:max(.25rem,env(safe-area-inset-top)) .4rem .25rem}body.mobile-app .chat-head>.icon-button,body.mobile-app .chat-actions>.icon-button{width:35px;height:35px}body.mobile-app .chat-profile-trigger .avatar{width:36px;height:36px}body.mobile-app .messages{padding:.65rem .55rem .45rem}body.mobile-app .bubble-row{max-width:92%}body.mobile-app .composer{margin:.1rem .4rem max(.35rem,env(safe-area-inset-bottom))}
  body.mobile-app .profile-card-new .profile-banner{height:125px}body.mobile-app .profile-card-new .profile-main{padding:0 .75rem max(.8rem,env(safe-area-inset-bottom))}body.mobile-app .profile-identity{margin-top:-42px;margin-bottom:.45rem}body.mobile-app .profile-identity>.avatar{width:82px;height:82px;border-radius:26px}body.mobile-app .profile-card-new .handle{margin-bottom:.65rem}body.mobile-app .profile-actions{margin-bottom:.65rem}body.mobile-app .profile-status-card,body.mobile-app .profile-social-section,body.mobile-app .profile-facts{margin-bottom:.5rem}body.mobile-app .profile-facts{grid-template-columns:1fr 1fr}body.mobile-app .profile-facts>div{padding:.58rem}
  body.mobile-app .modal-card{height:100%;max-height:100%;border-radius:0;border:0;padding:.7rem .75rem max(.8rem,env(safe-area-inset-bottom))}body.mobile-app .modal-card>header{top:-.7rem;margin:-.7rem -.75rem 0;padding:max(.65rem,env(safe-area-inset-top)) .75rem .5rem;background:#11151f}body.mobile-app .modal-card h2{font-size:1.15rem}body.mobile-app .modal-card .eyebrow{display:none}
  body.mobile-app .settings-tabs{top:52px;margin:.35rem 0 .55rem}body.mobile-app .settings-profile-preview{margin-top:.4rem}body.mobile-app .settings-banner-preview{height:82px}body.mobile-app .settings-avatar-row{padding:0 .6rem .5rem}body.mobile-app #settings-form>label,body.mobile-app .settings-pane>label{margin:.58rem 0}body.mobile-app .modal-card h3{margin:.85rem 0 .4rem}body.mobile-app .social-editor{gap:.25rem}body.mobile-app .social-editor label{margin:.45rem 0}body.mobile-app .color-picker-row{overflow:visible;flex-wrap:wrap}body.mobile-app .color-swatches{min-width:0;display:flex;flex-wrap:wrap}body.mobile-app .setting-row,body.mobile-app .switch-row{padding:.68rem 0}body.mobile-app .device-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem}body.mobile-app .device-row button{white-space:normal}body.mobile-app .settings-savebar{bottom:-.8rem;margin:.7rem -.75rem -.8rem;padding:.4rem .75rem max(.6rem,env(safe-area-inset-bottom))}
  body.mobile-app .panel-card{padding-left:.65rem;padding-right:.65rem}body.mobile-app .panel-card>header{margin:0 -.65rem;padding-left:.65rem;padding-right:.65rem}body.mobile-app .panel-overview{margin:.4rem 0;padding:.55rem}body.mobile-app .panel-user select,body.mobile-app .panel-user>button{grid-column:1/3}
  body.mobile-app img,body.mobile-app svg,body.mobile-app input,body.mobile-app textarea,body.mobile-app select{max-width:100%}body.mobile-app p,body.mobile-app b,body.mobile-app small,body.mobile-app span{overflow-wrap:anywhere}
}

@media(max-width:350px){body.mobile-app .notification-toggle{display:none}body.mobile-app .rail-btn{max-width:42px}body.mobile-app .profile-facts{grid-template-columns:1fr}body.mobile-app .settings-tabs button{font-size:.66rem;padding:.6rem .2rem}}

/* Circle visual refresh */
:root{--bg:#070910;--surface:#10131c;--surface-2:#151925;--line:rgba(255,255,255,.075);--text:#f5f6fa;--muted:#8d95a7;--purple:#8172ff;--purple-2:#ada4ff;--lime:#80f0d5;--danger:#ff7087;--shadow:0 24px 70px rgba(0,0,0,.34)}
body{background:radial-gradient(circle at 8% 8%,rgba(104,86,238,.12),transparent 24%),radial-gradient(circle at 94% 92%,rgba(41,200,174,.07),transparent 25%),#070910;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.nav-label{display:none}.nav-user-picture{width:100%;height:100%;display:grid;place-items:center;overflow:hidden;border-radius:inherit}.nav-user-picture img{width:100%;height:100%;object-fit:cover}
.brand-mark{background:linear-gradient(145deg,#a292ff 0%,#755ff2 52%,#5d49d5 100%);box-shadow:0 10px 28px rgba(117,95,242,.34),inset 0 1px rgba(255,255,255,.28)}
.app-shell{background:transparent}.rail,.sidebar,.chat-panel,.profile-pane{border-color:rgba(255,255,255,.07);box-shadow:0 18px 55px rgba(0,0,0,.24)}.rail{background:linear-gradient(180deg,rgba(17,20,30,.96),rgba(9,11,17,.97))}.sidebar{background:linear-gradient(180deg,rgba(18,21,31,.98),rgba(10,12,18,.99))}.chat-panel{background:radial-gradient(circle at 50% 100%,rgba(121,101,255,.1),transparent 40%),linear-gradient(180deg,#0d1018,#090b11)}.profile-pane{background:linear-gradient(180deg,#111520,#0b0e15)}
.rail-btn{transition:transform .18s ease,background .18s ease,color .18s ease}.rail-btn:hover{transform:translateY(-2px)}.rail-btn.active{color:#c6bfff;background:linear-gradient(145deg,rgba(129,114,255,.28),rgba(129,114,255,.08));box-shadow:inset 0 0 0 1px rgba(173,164,255,.17),0 10px 28px rgba(63,49,157,.12)}
.sidebar-head h2{background:linear-gradient(90deg,#fff,#c8cbd5);background-clip:text;-webkit-background-clip:text;color:transparent}.search{background:rgba(7,9,15,.72);border-color:rgba(255,255,255,.075)}.search:focus-within{border-color:rgba(129,114,255,.55);box-shadow:0 0 0 4px rgba(129,114,255,.09)}
.friend-item{position:relative}.friend-item:hover{transform:none;background:rgba(255,255,255,.035)}.friend-item.active{background:linear-gradient(100deg,rgba(129,114,255,.2),rgba(129,114,255,.04));border-color:rgba(150,137,255,.28);box-shadow:inset 3px 0 #9485ff,0 12px 32px rgba(0,0,0,.12)}.friend-item.active:after{content:"";position:absolute;right:10px;top:10px;width:5px;height:5px;border-radius:50%;background:#80f0d5;box-shadow:0 0 10px #80f0d5}.friend-state.typing{color:#80f0d5}.friend-state.in-chat{color:#ada4ff}.unread{background:linear-gradient(145deg,#9e8fff,#705cef);box-shadow:0 5px 16px rgba(112,92,239,.3)}
.avatar{background:linear-gradient(145deg,color-mix(in srgb,var(--avatar) 82%,#fff),color-mix(in srgb,var(--avatar) 78%,#000));box-shadow:inset 0 0 0 1px rgba(255,255,255,.17),0 8px 24px rgba(0,0,0,.24)}.avatar .online-dot{background:#8df96b;border-color:#10131c;box-shadow:0 0 0 3px rgba(141,249,107,.08),0 0 13px rgba(141,249,107,.6)}
.chat-head{border-bottom-color:rgba(255,255,255,.065);background:linear-gradient(180deg,rgba(15,18,27,.96),rgba(11,14,21,.86))}.chat-profile-trigger:hover{background:rgba(255,255,255,.04)}.messages{scrollbar-width:thin;scrollbar-color:#292e3c transparent}.bubble{border-color:rgba(255,255,255,.05);border-radius:8px 19px 19px 19px;background:linear-gradient(145deg,#1b202d,#171b26);box-shadow:0 10px 30px rgba(0,0,0,.17)}.mine .bubble{border-color:rgba(255,255,255,.08);border-radius:19px 8px 19px 19px;background:linear-gradient(145deg,#8b79ff,#6652df);box-shadow:0 10px 30px rgba(84,65,197,.23)}.composer{border-color:rgba(255,255,255,.09);background:rgba(20,24,35,.94);box-shadow:0 18px 55px rgba(0,0,0,.36),inset 0 1px rgba(255,255,255,.045);backdrop-filter:blur(18px)}.send-button{background:linear-gradient(145deg,#a08fff,#6d58e9);box-shadow:0 8px 24px rgba(109,88,233,.35);transition:.18s}.send-button:hover{filter:brightness(1.1);transform:translateY(-1px)}
.empty-symbol{border-color:rgba(129,114,255,.25);background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.08),transparent 30%),linear-gradient(145deg,rgba(129,114,255,.22),rgba(29,34,48,.8));color:#a99fff;box-shadow:0 22px 60px rgba(70,54,171,.18)}
.profile-card-new .profile-banner{background-color:#171b29;background-image:radial-gradient(circle at 30% 20%,rgba(255,255,255,.16),transparent 25%),linear-gradient(135deg,var(--profile-accent),#252039 75%)}.profile-identity>.avatar{box-shadow:0 0 0 3px #0e1119,0 0 0 5px var(--profile-accent),0 20px 48px rgba(0,0,0,.38)}.profile-status-card,.profile-social-section,.profile-facts>div,.profile-room{border-color:rgba(255,255,255,.085);background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.014))}
.modal{background:rgba(3,4,8,.78);backdrop-filter:blur(16px)}.modal-card{border-color:rgba(255,255,255,.1);background:linear-gradient(155deg,#151923,#0e1118 80%);box-shadow:0 35px 110px rgba(0,0,0,.58)}.primary{background:linear-gradient(135deg,#9585ff,#6955e5);box-shadow:0 12px 32px rgba(105,85,229,.28)}.small-action.accent{background:linear-gradient(135deg,#8e7eff,#6956df);border-color:transparent}
.auth-shell{background:#070910}.auth-art{background:radial-gradient(circle at 76% 20%,rgba(129,114,255,.22),transparent 27%),radial-gradient(circle at 10% 88%,rgba(128,240,213,.09),transparent 29%),#0b0e16}.auth-panel{background:radial-gradient(circle at 50% 0,rgba(129,114,255,.13),transparent 34%),#080a10}.auth-box{border:1px solid rgba(255,255,255,.08);background:linear-gradient(155deg,rgba(21,25,36,.94),rgba(12,15,22,.96));box-shadow:0 40px 110px rgba(0,0,0,.4),inset 0 1px rgba(255,255,255,.05)}.auth-box h2{background:linear-gradient(100deg,#fff,#bdb8df);background-clip:text;-webkit-background-clip:text;color:transparent}.remember-row i{box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.suspend-card{width:min(100%,500px)}.suspend-person{display:flex;align-items:center;gap:.75rem;margin:.35rem 0 1rem;padding:.8rem;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:rgba(255,255,255,.025)}.suspend-person>span:last-child{min-width:0;display:grid;gap:.15rem}.suspend-person b{font-size:.85rem}.suspend-person small{overflow:hidden;color:var(--muted);font-size:.68rem;text-overflow:ellipsis;white-space:nowrap}.suspend-card form{display:grid;gap:.2rem}.suspend-card label{display:grid;gap:.4rem;margin:.45rem 0;color:#aeb4c2;font-size:.7rem;font-weight:700}.suspend-card textarea{resize:vertical;min-height:82px}.suspend-hint{margin:.65rem 0 1rem;padding:.7rem .8rem;border-left:2px solid var(--purple);border-radius:0 12px 12px 0;background:rgba(129,114,255,.07);color:#9199aa;font-size:.68rem;line-height:1.55}

@media(max-width:900px),(hover:none) and (pointer:coarse){
  body.mobile-app{background:#090b12}
  body.mobile-app .app-shell{grid-template-rows:minmax(0,1fr) calc(66px + env(safe-area-inset-bottom))}
  body.mobile-app .rail{height:calc(66px + env(safe-area-inset-bottom));padding:.25rem .2rem max(.22rem,env(safe-area-inset-bottom));overflow:visible;background:rgba(10,12,19,.96);box-shadow:0 -18px 45px rgba(0,0,0,.38);backdrop-filter:blur(22px)}
  body.mobile-app .rail nav{height:100%;align-items:stretch;overflow:visible}
  body.mobile-app .rail-btn,body.mobile-app .rail .avatar-button{position:relative;width:auto;max-width:none;height:54px;display:flex;flex:1 1 0;flex-direction:column;align-items:center;justify-content:center;gap:.18rem;margin:0;padding:.25rem .12rem;overflow:visible;border-radius:14px;background:transparent;box-shadow:none}
  body.mobile-app .rail-btn svg{width:19px;height:19px}body.mobile-app .nav-label{display:block;max-width:100%;overflow:hidden;color:#6f778a;font-size:.52rem;font-weight:750;line-height:1;text-overflow:ellipsis;white-space:nowrap}body.mobile-app .rail-btn.active .nav-label{color:#c9c3ff}body.mobile-app .rail-btn.active{color:#b9afff;background:linear-gradient(180deg,rgba(129,114,255,.16),rgba(129,114,255,.035));transform:none}body.mobile-app .rail-btn.active:before{top:auto;bottom:-.25rem;width:18px;height:2px;background:#9183ff;box-shadow:0 0 12px rgba(145,131,255,.7)}
  body.mobile-app .rail .avatar-button{flex:0 1 54px;margin:0}body.mobile-app .nav-user-picture{width:24px;height:24px;flex:0 0 24px;border-radius:9px;background:linear-gradient(145deg,#8f80ff,#5e4ad2);color:#fff;font-size:.58rem;font-weight:850;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
  body.mobile-app .sidebar{background:radial-gradient(circle at 90% 0,rgba(129,114,255,.11),transparent 28%),linear-gradient(180deg,#121620,#090b11)}body.mobile-app .sidebar-head{background:linear-gradient(180deg,rgba(18,22,32,.96),rgba(18,22,32,.72));backdrop-filter:blur(14px)}body.mobile-app .sidebar-head h2{font-size:1.35rem}body.mobile-app .search{background:rgba(7,9,15,.7);box-shadow:inset 0 1px rgba(255,255,255,.025)}
  body.mobile-app .friend-item{margin:.16rem 0;border-radius:17px}body.mobile-app .friend-item.active{box-shadow:inset 3px 0 #9284ff,0 12px 28px rgba(0,0,0,.12)}body.mobile-app .online-strip{border-color:rgba(255,255,255,.055)}
  body.mobile-app .chat-head{background:rgba(13,16,24,.94);backdrop-filter:blur(18px)}body.mobile-app .composer{border-radius:20px;background:rgba(21,25,37,.97)}body.mobile-app .bubble{font-size:.86rem}
  body.mobile-app .modal-card{background:linear-gradient(180deg,#151923,#0c0f16)}body.mobile-app .modal-card>header{background:rgba(18,22,32,.97);backdrop-filter:blur(16px)}body.mobile-app .settings-tabs{background:#090b11;border-color:rgba(255,255,255,.08)}body.mobile-app .settings-tabs button.active{background:linear-gradient(145deg,rgba(129,114,255,.28),rgba(129,114,255,.1));color:#fff}
  body.mobile-app .auth-panel{background:radial-gradient(circle at 50% 0,rgba(129,114,255,.2),transparent 29%),#080a10}body.mobile-app .auth-box{border-radius:26px;padding:1.25rem;box-shadow:0 28px 80px rgba(0,0,0,.36),inset 0 1px rgba(255,255,255,.055)}
}

@media(max-width:350px){body.mobile-app .rail-btn,body.mobile-app .rail .avatar-button{min-width:0;padding-left:.04rem;padding-right:.04rem}body.mobile-app .nav-label{font-size:.47rem}}
