:root{
  --safe-top:env(safe-area-inset-top,0px);
  --safe-bottom:env(safe-area-inset-bottom,0px);
}
.side-actions{display:flex;align-items:center;gap:5px}
.mobile-hint{display:none}
.push-card{background:#f5f0fa;border:1px solid #e5dbf3;border-radius:16px;padding:16px;margin:0 0 16px}
.push-heading{display:flex;align-items:center;gap:11px}
.push-bell{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;color:#7160b4;background:#e8e0f4;font-size:21px;flex-shrink:0}
.push-heading div{display:flex;flex-direction:column;gap:3px}
.push-heading strong{font-size:13px;color:#342d42}
.push-heading small{font-size:11px;color:#91879e}
.push-state{margin:14px 0!important;font-size:12px!important;color:#685e73!important}
.push-button{width:100%;min-height:46px}
.push-privacy{display:block;color:#9f95a6;margin-top:12px;font-size:11px;line-height:1.55}
.push-help{border-radius:13px;background:#fffdfb;margin-top:16px;padding:12px 14px;font-size:12px;line-height:1.7;color:#736884}
.push-help strong{display:block;color:#443854;margin-bottom:3px}
@media(max-width:700px){
  html,body{height:100%;max-width:100%;overflow:hidden;-webkit-text-size-adjust:100%}
  body{background:#faf8f5}
  .app{height:var(--ryadom-vh,100dvh);min-height:0;padding:0;overflow:hidden}
  .workspace{height:100%;min-height:0;width:100%;border-radius:0;display:block;overflow:hidden;box-shadow:none}
  .sidebar,.main{position:absolute;inset:0;width:100%;height:100%;min-height:0;overflow:hidden}
  .sidebar{display:flex;flex-direction:column;z-index:2;background:#faf8f6;padding-top:var(--safe-top)}
  .main{display:none;flex-direction:column;z-index:3;background:#fffcf9;padding-top:var(--safe-top)}
  .workspace.room-open .main{display:flex}
  .workspace.room-open .sidebar{display:none}
  .side-head{padding:16px 18px 7px;min-height:65px}
  .brand{font-size:30px;letter-spacing:-1.65px}
  .brand-logo{height:41px;width:41px}
  .side-actions{gap:6px}
  .side-actions .icon-btn{height:43px;width:43px;color:#73677e;background:#f1ecef}
  .side-caption{padding:9px 20px 4px;font-size:10px;letter-spacing:.15em}
  .search-wrap{margin:14px 17px 9px;min-height:47px;height:47px;border-radius:16px;background:#fff}
  .search-wrap input{font-size:16px}
  .section-label{padding:18px 20px 10px;font-size:10px}
  .people{padding:8px 19px 8px;gap:15px;flex-shrink:0;overscroll-behavior-x:contain}
  .person{min-width:60px;gap:7px}
  .person .avatar{height:55px;width:55px;border-radius:19px}
  .person-name{font-size:11px}
  .chats{min-height:0;flex:1;padding:0 9px 6px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .chat-item{min-height:78px;margin:1px 0;padding:12px 12px;border-radius:17px;gap:13px}
  .chat-item .avatar{width:55px;height:55px;border-radius:19px}
  .chat-main{min-width:0}
  .chat-name{font-size:15px;line-height:1.35;letter-spacing:-.2px}
  .chat-last{font-size:13px;max-width:min(60vw,340px);line-height:1.45}
  .chat-time{font-size:11px}
  .unread{min-width:21px;height:21px;font-size:11px}
  .side-bottom{flex-shrink:0;margin:8px 12px max(12px,var(--safe-bottom));border-radius:18px;padding:12px;background:#f0ebe9}
  .side-bottom .avatar{height:42px;width:42px}
  .profile-name{font-size:13px}
  .profile-sub{font-size:10px}
  .main-header{flex-shrink:0;height:66px;min-height:66px;padding:0 14px;background:#fffdfb;border-bottom:1px solid #ede8e5;gap:11px}
  .main-header .back-btn{display:flex;flex-shrink:0;height:42px;width:38px}
  .main-header .avatar{height:43px;width:43px;flex-shrink:0}
  .main-header>div:nth-of-type(1){min-width:0}
  .header-title{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42vw}
  .header-sub{font-size:11px;margin-top:4px}
  .header-actions .icon-btn{width:38px;height:38px}
  .chat-wall{flex:1;min-height:0;overflow-y:auto;padding:21px 13px 19px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .chat-wall-inner{min-height:100%;max-width:100%;justify-content:flex-start}
  .chat-intro{margin:5px auto 21px}
  .chat-intro .intro-icon{width:59px;height:59px;margin-bottom:11px}
  .chat-intro h2{font-size:20px}
  .chat-intro p{font-size:12px}
  .date-label{margin:10px 0 19px}
  .msg-row{max-width:94%;gap:7px;margin-bottom:11px}
  .msg-row .avatar{width:27px;height:27px}
  .bubble{font-size:14px;line-height:1.47;border-radius:17px 17px 17px 5px;padding:10px 13px 7px}
  .mine .bubble{border-radius:17px 17px 5px 17px}
  .bubble img{max-width:min(64vw,300px);max-height:40vh}
  .composer-area{flex-shrink:0;padding:9px 10px max(11px,var(--safe-bottom));background:#fffdfb}
  .composer-inner{width:100%}
  .composer{border-radius:19px;align-items:flex-end;padding:7px;gap:7px;background:#f5f1ef}
  .composer textarea{font-size:16px;line-height:1.4;min-height:34px;max-height:136px;padding:9px 2px 6px}
  .composer .icon-btn{height:42px;width:38px}
  .send-btn{height:42px;width:42px;border-radius:14px}
  .composer-hint{padding:6px 5px 0;min-height:18px}
  .desktop-hint{display:none}
  .mobile-hint{display:inline;font-size:10px}
  .privacy-mark{font-size:9px;white-space:nowrap}
  .auth-layout{min-height:0;height:100%;overflow:auto;overscroll-behavior:contain;align-items:safe center;padding:calc(16px + var(--safe-top)) 16px calc(22px + var(--safe-bottom))}
  .auth-card{width:100%;max-width:430px;padding:29px 23px;border-radius:24px}
  .auth-card .brand{margin-bottom:33px}
  .auth-card h1{font-size:clamp(30px,9vw,39px);letter-spacing:-1.3px}
  .auth-card .lead{margin-bottom:23px}
  .field-input{font-size:16px;min-height:50px}
  .modal-cover{display:flex;align-items:flex-end;justify-content:center;padding:0;z-index:50}
  .modal{width:100%;max-width:100%;border-radius:25px 25px 0 0;max-height:calc(var(--ryadom-vh,100dvh) - var(--safe-top) - 20px);padding:24px 21px calc(26px + var(--safe-bottom));overflow-y:auto}
  .modal-head{margin-bottom:18px}
  .modal h2{font-size:21px}
  .toast{bottom:calc(22px + var(--safe-bottom));max-width:calc(100vw - 28px);width:max-content;font-size:12px}
  .empty{padding:22px}
  .empty h1{font-size:28px}
  .mobile-only{display:flex}
}
@media(max-width:380px){
  .side-head{padding-left:14px;padding-right:14px}
  .main-header{gap:7px;padding:0 9px}
  .header-title{max-width:39vw}
  .chat-wall{padding:14px 8px}
  .composer-area{padding-left:8px;padding-right:8px}
  .privacy-mark{display:none}
}
@media(max-width:700px) and (orientation:landscape) and (max-height:490px){
  .people,.section-label:first-of-type,.side-caption{display:none}
  .side-head{min-height:55px;padding-top:6px}
  .main-header{height:54px;min-height:54px}
  .composer-hint{display:none}
  .composer-area{padding-top:6px;padding-bottom:6px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

.push-onboarding{width:calc(100% - 34px);margin:11px 17px 3px;display:flex;gap:10px;align-items:center;text-align:left;padding:13px 15px;border-radius:15px;border:1px solid #e5d9f3;background:#f2ebfc;color:#403355}
.push-onboarding[hidden]{display:none!important}
.push-onboarding-dot{width:24px;height:24px;border-radius:50%;background:#7156b8;box-shadow:inset 0 0 0 7px #bca8e6;flex-shrink:0}
.push-onboarding span:last-child{display:flex;flex-direction:column;gap:3px}
.push-onboarding strong{font-size:12px;font-weight:800}
.push-onboarding small{font-size:11px;color:#856e9d}
@media(min-width:701px){.push-onboarding{margin:8px 18px;width:calc(100% - 36px)}}