/* HappyGram V60 — complete soft-lavender UI inspired by the supplied reference screens.
   Только визуальный слой: существующий PHP/API и БД не меняются. */
:root{
  --v60-accent:#6858e8;
  --v60-accent-2:#8c7bff;
  --v60-accent-soft:#eeeaff;
  --v60-accent-softer:#f6f4ff;
  --v60-bg:#f4f5fa;
  --v60-surface:#ffffff;
  --v60-surface-2:#fafaff;
  --v60-line:#e4e5ee;
  --v60-text:#202235;
  --v60-muted:#79809a;
  --v60-green:#28b988;
  --v60-red:#ea5966;
  --v60-shadow:0 14px 40px rgba(49,47,91,.08);
  --v60-shadow-strong:0 28px 80px rgba(52,48,96,.16);
  --v60-radius:22px;
  --v60-radius-sm:16px;
  --v60-font:Inter,Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

/* global reset / typography */
html,body{margin:0!important;width:100%;min-width:0;overflow-x:hidden;background:var(--v60-bg)!important;color:var(--v60-text)!important;font-family:var(--v60-font)!important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{background:radial-gradient(1000px 540px at 70% -180px,rgba(113,92,232,.10),transparent 65%),var(--v60-bg)!important}
*,*:before,*:after{box-sizing:border-box}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
::selection{background:rgba(104,88,232,.18)}

/* hide decorative legacy background from the neon versions */
body>.aurora,body>.grain{display:none!important}

/* shared controls */
.btn,.icon-btn,.tab,.bn-item,.rail-btn,.settings-nav-item,.choice-card,.wallpaper-choice,.android-feature-grid button,.landing-ios,.story-add,.chat-item,.me,.call-round,.checkout-method,.payment-methods button,.stars-pack-grid button,.gift-grid-premium button{
  -webkit-tap-highlight-color:transparent;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,background .22s ease,border-color .22s ease,color .22s ease;
}
.btn:active,.icon-btn:active,.rail-btn:active,.bn-item:active,.settings-nav-item:active,.landing-ios:active{transform:scale(.97)}
.btn:focus-visible,.icon-btn:focus-visible,.rail-btn:focus-visible,.bn-item:focus-visible,.settings-nav-item:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid rgba(104,88,232,.18)!important;outline-offset:2px}

.btn{min-height:46px!important;border-radius:14px!important;border:1px solid var(--v60-line)!important;background:#fff!important;color:var(--v60-text)!important;font-weight:650!important;box-shadow:none!important}
.btn:hover{border-color:#d4d1ff!important;background:#fcfbff!important}
.btn.btn-primary{background:linear-gradient(135deg,#6f5bf0,#624fe0)!important;border-color:transparent!important;color:#fff!important;box-shadow:0 9px 22px rgba(104,88,232,.22)!important}
.btn.btn-primary:hover{filter:brightness(1.03);box-shadow:0 12px 28px rgba(104,88,232,.28)!important}
.btn.btn-ghost{background:#f8f8fc!important;color:#616780!important}
.btn.btn-small{min-height:38px!important;padding:0 13px!important;border-radius:12px!important;font-size:12px!important}
.icon-btn{width:44px!important;height:44px!important;border-radius:14px!important;border:1px solid transparent!important;background:#f7f7fc!important;color:#717995!important;display:grid!important;place-items:center!important;padding:0!important;box-shadow:none!important}
.icon-btn:hover{background:#efeefe!important;color:var(--v60-accent)!important;border-color:#dfd9ff!important}

/* main screen */
#screen-app{position:fixed!important;inset:0!important;padding:0!important;background:var(--v60-bg)!important;display:none!important}
#screen-app[data-active="true"],#screen-app.is-active{display:block!important}
#screen-app>.app-shell{
  width:100%!important;height:100dvh!important;max-width:none!important;margin:0!important;padding:0!important;
  display:grid!important;grid-template-columns:88px 365px minmax(0,1fr)!important;
  background:var(--v60-surface)!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:hidden!important;
}

/* rail */
#screen-app .rail{width:88px!important;border-right:1px solid var(--v60-line)!important;background:#fff!important;display:flex!important;flex-direction:column!important;align-items:center!important;padding:24px 0 18px!important;gap:10px!important;z-index:4}
#screen-app .rail-brand{width:38px!important;height:38px!important;border-radius:12px!important;object-fit:cover!important;display:block!important;margin:0 0 15px!important;box-shadow:0 9px 25px rgba(104,88,232,.22)!important}
#screen-app .rail-btn{width:48px!important;height:48px!important;border:0!important;border-radius:15px!important;background:transparent!important;color:#7d839b!important;display:grid!important;place-items:center!important;font-size:19px!important}
#screen-app .rail-btn:hover{background:#f5f3ff!important;color:var(--v60-accent)!important}
#screen-app .rail-btn.is-active{background:var(--v60-accent-soft)!important;color:var(--v60-accent)!important;box-shadow:inset 0 0 0 1px rgba(104,88,232,.04)!important}
#screen-app .rail-btn:last-child{margin-top:auto}

/* sidebar */
#screen-app .sidebar{width:365px!important;min-width:0!important;background:#fff!important;border-right:1px solid var(--v60-line)!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
#screen-app .sidebar-top{height:92px!important;padding:21px 18px 12px!important;display:flex!important;align-items:center!important;gap:8px!important}
#screen-app .me{display:flex!important;align-items:center!important;gap:11px!important;flex:1;min-width:0;padding:8px 10px!important;border-radius:15px!important;background:#fbfaff!important}
#screen-app .me:hover{background:#f4f1ff!important}
#screen-app .me .avatar-wrap{flex:0 0 42px!important}
#screen-app .me .avatar{width:42px!important;height:42px!important;border-radius:50%!important;overflow:hidden!important}
#screen-app .me .avatar img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;display:block!important}
#screen-app .me-nickname{font-size:14px!important;font-weight:750!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#screen-app .me-username{font-size:11px!important;color:var(--v60-muted)!important;margin-top:2px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#screen-app .search-new{position:relative!important;padding:0 18px 13px!important}
#screen-app .search-new input{width:100%!important;height:46px!important;border:1px solid transparent!important;background:#f6f6fb!important;border-radius:14px!important;padding:0 15px 0 42px!important;color:var(--v60-text)!important;box-shadow:none!important}
#screen-app .search-new:before{content:"";position:absolute;left:32px;top:14px;width:15px;height:15px;border:1.8px solid #8b91a8;border-radius:50%;pointer-events:none;z-index:2}
#screen-app .search-new:after{content:"";position:absolute;left:45px;top:27px;width:7px;height:1.8px;background:#8b91a8;transform:rotate(45deg);transform-origin:left center;pointer-events:none;z-index:2}
#screen-app .search-results{position:absolute;left:18px;right:18px;top:52px;background:#fff;border:1px solid var(--v60-line);border-radius:16px;box-shadow:var(--v60-shadow-strong);z-index:20;overflow:hidden}
#screen-app .search-results:empty{display:none!important}

/* stories */
#screen-app .story-strip{padding:0 18px 8px!important;display:flex!important;min-height:58px!important}
#screen-app .story-add{width:100%!important;background:#fbfaff!important;border:1px solid #eceaf6!important;border-radius:15px!important;padding:9px 11px!important;display:flex!important;align-items:center!important;gap:10px!important;text-align:left!important;color:var(--v60-text)!important}
#screen-app .story-add:hover{background:#f7f4ff!important;border-color:#ded9ff!important}
#screen-app .story-add-avatar{width:38px!important;height:38px!important;border-radius:50%!important;background:#ebe7ff!important;color:var(--v60-accent)!important;display:grid!important;place-items:center!important;font-weight:800!important;flex:0 0 38px!important}
#screen-app .story-add b{font-size:12px!important;display:block}
#screen-app .story-add small{font-size:10px!important;color:var(--v60-muted)!important;display:block;margin-top:2px!important}

/* chats list */
#screen-app .chat-list{padding:3px 10px 18px!important;overflow:auto!important;flex:1!important;background:#fff!important}
#screen-app .chat-item{margin:2px 0!important;padding:10px 10px!important;border-radius:15px!important;border:1px solid transparent!important;background:transparent!important}
#screen-app .chat-item:hover{background:#faf9fd!important}
#screen-app .chat-item.is-active ,#screen-app .chat-item.active{background:#edeaff!important;border-color:#e5e1ff!important}
#screen-app .chat-item .avatar{width:50px!important;height:50px!important;min-width:50px!important;min-height:50px!important;border-radius:50%!important;overflow:hidden!important}
#screen-app .chat-item .avatar img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important}
#screen-app .chat-item .chat-name{font-size:14px!important;font-weight:700!important;color:var(--v60-text)!important}
#screen-app .chat-item .chat-preview{font-size:12px!important;color:var(--v60-muted)!important;margin-top:3px!important}
#screen-app .chat-item .chat-time{font-size:10px!important;color:#a9aec0!important}
#screen-app .empty-hint{padding:30px 24px!important;text-align:center!important;color:#9da2b4!important;font-size:12px!important;line-height:1.55!important}

/* conversation */
#screen-app .conversation{min-width:0!important;background:#f5f6fb!important;position:relative!important;overflow:hidden!important}
#screen-app .conversation-empty{height:100%!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;padding:40px!important;color:var(--v60-muted)!important}
#screen-app .conversation-empty .brand-mark{width:132px!important;height:132px!important;object-fit:contain!important;border-radius:34px!important;opacity:.96!important;margin-bottom:24px!important;filter:drop-shadow(0 18px 28px rgba(104,88,232,.13))}
#screen-app .conversation-empty p{max-width:470px!important;font-size:14px!important;line-height:1.65!important;margin:0!important}
#screen-app .conversation-empty:after{content:"⌘ K  —  быстрый поиск";margin-top:22px;padding:8px 12px;border:1px solid #e1e2ec;background:#fff;border-radius:99px;color:#9da2b4;font-size:11px}
#screen-app .conversation-active{height:100%!important;position:relative!important;background:#f5f6fb!important}
#screen-app .conv-header{height:76px!important;background:#fff!important;border-bottom:1px solid var(--v60-line)!important;box-shadow:none!important;border-radius:0!important;padding:0 22px!important;display:flex!important;align-items:center!important;justify-content:space-between!important}
#screen-app .conv-header-left{display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important}
#screen-app .header-back{display:none!important}
#screen-app .header-avatar-wrap{position:relative!important;flex:0 0 42px!important}
#screen-app #peer-avatar{width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;border-radius:50%!important;overflow:hidden!important}
#screen-app #peer-avatar img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important}
#screen-app .online-dot{width:9px!important;height:9px!important;border-radius:50%!important;background:var(--v60-green)!important;border:2px solid #fff!important;position:absolute!important;right:-1px!important;bottom:0!important;z-index:2!important}
#screen-app .peer-nickname{font-size:14px!important;font-weight:800!important}
#screen-app .peer-meta{display:flex!important;align-items:center!important;gap:6px!important;margin-top:3px!important}
#screen-app .peer-username,#screen-app .peer-presence{font-size:11px!important;color:#8a90a6!important}
#screen-app .peer-presence{color:var(--v60-green)!important}
#screen-app .conv-header-actions{display:flex!important;align-items:center!important;gap:7px!important}
#screen-app .messages{position:absolute!important;inset:76px 0 84px!important;overflow:auto!important;padding:28px 40px 26px!important;background:#f5f6fb!important;scroll-behavior:smooth!important}
#screen-app .messages .msg{border-radius:20px!important;box-shadow:0 9px 26px rgba(50,48,80,.07)!important;border:1px solid rgba(218,219,231,.65)!important}
#screen-app .messages .msg.incoming{background:#fff!important;color:var(--v60-text)!important}
#screen-app .messages .msg.outgoing{background:linear-gradient(135deg,#6c58e9,#6850de)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 11px 26px rgba(104,88,232,.20)!important}
#screen-app .messages .msg .msg-meta{opacity:.78!important;font-size:10px!important}
#screen-app .composer{position:absolute!important;left:30px!important;right:30px!important;bottom:18px!important;height:58px!important;padding:7px 8px!important;display:flex!important;align-items:center!important;gap:5px!important;background:#fff!important;border:1px solid #e2e3ec!important;border-radius:19px!important;box-shadow:0 12px 32px rgba(40,42,75,.09)!important;z-index:8!important}
#screen-app .composer .icon-btn{width:42px!important;height:42px!important;background:#f7f7fc!important;border:0!important}
#screen-app #composer-input{height:44px!important;border:0!important;outline:none!important;background:transparent!important;flex:1!important;min-width:0!important;padding:0 8px!important;color:var(--v60-text)!important;font-size:13px!important}
#screen-app #composer-input::placeholder{color:#a9aec1!important}
#screen-app .btn-send{width:44px!important;height:44px!important;border:0!important;border-radius:14px!important;background:linear-gradient(135deg,#6c58e9,#634cdf)!important;color:#fff!important;display:grid!important;place-items:center!important;box-shadow:0 7px 20px rgba(104,88,232,.22)!important}
#screen-app .btn-send svg{transform:rotate(45deg)!important}

/* mobile nav */
#screen-app .bottom-nav{display:none!important}

/* settings overlay */
#settings-overlay{position:fixed!important;inset:0!important;z-index:9990!important;padding:0!important;background:rgba(39,36,64,.22)!important;backdrop-filter:blur(5px)!important}
#settings-overlay:not([hidden]){display:block!important}
#settings-overlay .settings-panel{width:calc(100vw - 40px)!important;height:calc(100dvh - 40px)!important;margin:20px!important;max-width:none!important;background:#f7f8fb!important;border:0!important;border-radius:24px!important;box-shadow:var(--v60-shadow-strong)!important;padding:0!important;overflow:hidden!important;color:var(--v60-text)!important}
#settings-overlay .panel-header{height:74px!important;padding:0 24px!important;background:#fff!important;border-bottom:1px solid var(--v60-line)!important}
#settings-overlay .panel-kicker{color:var(--v60-accent)!important;letter-spacing:.06em!important;font-weight:800!important;font-size:10px!important}
#settings-overlay .panel-header h2{font-size:19px!important;color:var(--v60-text)!important;margin:0!important}
#settings-overlay .panel-header p{font-size:11px!important;color:var(--v60-muted)!important}
#settings-overlay .settings-layout{display:grid!important;grid-template-columns:250px minmax(0,1fr)!important;height:calc(100% - 74px)!important;padding:0!important}
#settings-overlay .settings-nav{background:#fff!important;border-right:1px solid var(--v60-line)!important;padding:18px 14px!important;display:flex!important;flex-direction:column!important;gap:4px!important;overflow:auto!important}
#settings-overlay .settings-nav-item{min-height:46px!important;width:100%!important;text-align:left!important;border:0!important;border-radius:13px!important;background:transparent!important;color:#41465d!important;font-size:12px!important;font-weight:650!important;padding:0 13px!important;display:flex!important;align-items:center!important;gap:9px!important}
#settings-overlay .settings-nav-item:hover{background:#f6f4ff!important;color:var(--v60-accent)!important}
#settings-overlay .settings-nav-item.is-active{background:#ece9ff!important;color:var(--v60-accent)!important;font-weight:750!important}
#settings-overlay .settings-content{padding:26px 32px 36px!important;overflow:auto!important;background:#f6f7fb!important}
#settings-overlay .settings-section{max-width:960px!important;margin:0 auto 18px!important;background:#fff!important;border:1px solid #e6e7ef!important;border-radius:20px!important;padding:22px!important;box-shadow:0 9px 24px rgba(48,46,78,.045)!important}
#settings-overlay .settings-section-title{font-size:14px!important;font-weight:800!important;margin-bottom:16px!important}
#settings-overlay .settings-section-title + .settings-note,#settings-overlay .settings-note{font-size:11px!important;color:var(--v60-muted)!important;line-height:1.55!important}
#settings-overlay .setting-row{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;padding:16px 0!important;border-top:1px solid #ececf3!important}
#settings-overlay .setting-row:first-of-type{border-top:0!important}
#settings-overlay .setting-row strong{font-size:12px!important;font-weight:720!important}
#settings-overlay .setting-row span{display:block!important;color:#858ba0!important;font-size:10px!important;margin-top:4px!important}
#settings-overlay .status-chip{padding:7px 10px!important;border-radius:999px!important;background:#e8faf3!important;color:#23a47d!important;font-size:10px!important;white-space:nowrap!important}
#settings-overlay .switch{width:42px!important;height:25px!important;position:relative!important;display:block!important;flex:0 0 42px!important}
#settings-overlay .switch input{opacity:0!important;position:absolute!important}
#settings-overlay .switch span{position:absolute!important;inset:0!important;border-radius:99px!important;background:#dfe1e8!important;transition:.2s!important}
#settings-overlay .switch span:after{content:"";position:absolute;top:3px;left:3px;width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.12);transition:.2s!important}
#settings-overlay .switch input:checked + span{background:var(--v60-accent)!important}
#settings-overlay .switch input:checked + span:after{transform:translateX(17px)!important}
#settings-overlay .choice-card{display:flex!important;align-items:center!important;gap:12px!important;padding:13px!important;border:1px solid #e5e6ef!important;border-radius:14px!important;background:#fff!important;margin:7px 0!important}
#settings-overlay .choice-card:has(input:checked){border-color:#cfc8ff!important;background:#f5f2ff!important}
#settings-overlay input[type=radio],#settings-overlay input[type=checkbox]{accent-color:var(--v60-accent)!important}
#settings-overlay .field{margin:10px 0!important}
#settings-overlay .field>span{display:block!important;font-size:11px!important;font-weight:700!important;color:#5b6176!important;margin-bottom:7px!important}
#settings-overlay .field input,#settings-overlay .field textarea,#settings-overlay .field select,#settings-overlay .feature-textarea,#settings-overlay .translation-grid input{width:100%!important;min-height:42px!important;border:1px solid #e2e3eb!important;border-radius:13px!important;background:#fbfbfe!important;color:var(--v60-text)!important;padding:0 12px!important;box-shadow:none!important}
#settings-overlay .field textarea,#settings-overlay .feature-textarea{padding:11px 12px!important;min-height:90px!important;resize:vertical!important}
#settings-overlay .field select{appearance:none!important;-webkit-appearance:none!important}
#settings-overlay .feature-grid{gap:12px!important}
#settings-overlay .android-feature-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;gap:9px!important}
#settings-overlay .android-feature-grid button{min-height:44px!important;border:1px solid #e5e6ef!important;border-radius:13px!important;background:#fff!important;color:#484d63!important;text-align:left!important}
#settings-overlay .android-feature-grid button:hover{border-color:#d2ccff!important;background:#f7f5ff!important;color:var(--v60-accent)!important}
#settings-overlay .cloud-password-manager,.cloud-password-manager{background:#fbfaff!important;border:1px solid #e4e1f7!important;border-radius:16px!important;padding:14px!important}

/* auth / onboarding — reference split layout */
#screen-auth,#screen-username,#screen-avatar{position:fixed!important;inset:0!important;padding:24px!important;background:#f1f2f8!important;display:none!important}
#screen-auth[data-active="true"],#screen-username[data-active="true"],#screen-avatar[data-active="true"],#screen-auth.is-active,#screen-username.is-active,#screen-avatar.is-active{display:flex!important;align-items:center!important;justify-content:center!important}
#screen-auth>.card-auth,#screen-username>.card-step,#screen-avatar>.card-step{width:min(1390px,calc(100vw - 48px))!important;min-height:min(850px,calc(100dvh - 48px))!important;background:#fff!important;border:0!important;border-radius:0!important;box-shadow:0 20px 70px rgba(47,44,85,.10)!important;padding:0!important;overflow:hidden!important;position:relative!important}
#screen-auth .card-auth{display:grid!important;grid-template-columns:40% 60%!important}
#screen-auth .card-auth:before{content:"";grid-column:1;grid-row:1 / span 30;background:linear-gradient(160deg,#29224f 0%,#4a3d9d 48%,#6d5ced 100%)!important}
#screen-auth .brand{position:absolute!important;z-index:3!important;left:44px!important;top:42px!important;color:#fff!important;display:flex!important;align-items:center!important;gap:11px!important}
#screen-auth .brand-mark{width:40px!important;height:40px!important;border-radius:12px!important;box-shadow:0 10px 24px rgba(0,0,0,.20)!important}
#screen-auth .brand-name{font-size:18px!important;font-weight:700!important;letter-spacing:.01em!important}
#screen-auth .brand:after{content:"Ваше пространство для важных разговоров";position:absolute;left:0;top:450px;width:360px;color:rgba(255,255,255,.96);font-size:31px;font-weight:400;line-height:1.16}
#screen-auth .tabs{grid-column:2!important;grid-row:1!important;margin:72px 95px 0!important;display:flex!important;gap:9px!important;border-bottom:1px solid #ececf2!important;padding-bottom:10px!important;align-self:start!important}
#screen-auth .tabs .tab{background:transparent!important;border:0!important;color:#8e93a7!important;padding:8px 4px!important;font-size:14px!important;font-weight:650!important}
#screen-auth .tabs .tab.is-active{color:var(--v60-accent)!important;box-shadow:inset 0 -2px 0 var(--v60-accent)!important}
#screen-auth #form-auth{grid-column:2!important;grid-row:1!important;align-self:start!important;margin:130px 95px 0!important;max-width:560px!important}
#screen-auth #form-auth .field{margin:0 0 16px!important}
#screen-auth #form-auth .field>span{display:block!important;font-size:11px!important;color:#40445a!important;font-weight:750!important;margin:0 0 8px!important}
#screen-auth #form-auth .field input{width:100%!important;height:54px!important;background:#fff!important;border:1px solid #dfe1eb!important;border-radius:14px!important;padding:0 16px!important;color:var(--v60-text)!important;font-size:13px!important;box-shadow:none!important}
#screen-auth #form-auth .field input:focus{border-color:#aaa1ff!important;box-shadow:0 0 0 4px rgba(104,88,232,.08)!important}
#screen-auth #auth-submit{width:100%!important;margin-top:10px!important;height:52px!important}
#screen-auth .cloud-password-step{grid-column:2!important;grid-row:1!important;align-self:start!important;margin:130px 95px 0!important;max-width:560px!important;background:#fff!important;z-index:4!important}
#screen-auth .cloud-lock-icon{width:58px;height:58px;border-radius:17px;background:#eeeaff;color:var(--v60-accent);display:grid;place-items:center;margin-bottom:16px}
#screen-auth .cloud-password-step h2{font-size:28px!important;margin:0 0 7px!important}
#screen-auth .cloud-password-step>p{font-size:12px;color:var(--v60-muted);line-height:1.6;margin:0 0 18px}
#screen-auth #toggle-password{background:transparent!important;border:0!important;color:#787e95!important;position:absolute!important;right:8px!important;top:5px!important}
#screen-auth .input-with-icon{position:relative!important}
#screen-auth #toggle-password{top:5px!important}

/* username/avatar onboarding */
#screen-username>.card-step,#screen-avatar>.card-step{width:760px!important;min-height:auto!important;border-radius:24px!important;padding:48px!important;box-shadow:var(--v60-shadow-strong)!important}
#screen-username .step-eyebrow,#screen-avatar .step-eyebrow{color:var(--v60-accent)!important;font-size:11px!important;font-weight:800!important;letter-spacing:.08em!important;text-transform:uppercase!important}
#screen-username h1,#screen-avatar h1{font-size:34px!important;margin:8px 0!important}
#screen-username .step-hint,#screen-avatar .step-hint{font-size:13px!important;color:var(--v60-muted)!important;line-height:1.65!important}
#screen-username .field>span,#screen-avatar .field>span{font-size:11px!important;font-weight:750!important;margin-bottom:7px!important;display:block}
#screen-username .field input,#screen-avatar .field input{height:50px!important;border:1px solid #dfe1eb!important;border-radius:14px!important;background:#fbfbfe!important;padding:0 14px!important}
#screen-username .btn-primary,#screen-avatar .btn-primary{height:52px!important;width:100%!important}

/* landing */
#screen-landing{position:fixed!important;inset:0!important;overflow:auto!important;padding:24px!important;background:#f1f2f8!important;color:var(--v60-text)!important}
#screen-landing[data-active="true"]{display:block!important}
#screen-landing .landing-topbar{width:min(1390px,calc(100% - 20px))!important;margin:0 auto 16px!important;display:flex!important;align-items:center!important;justify-content:space-between!important}
#screen-landing .landing-brand{display:flex!important;align-items:center!important;gap:10px!important;font-weight:800!important;color:#292b42!important}
#screen-landing .landing-brand img{width:42px!important;height:42px!important;border-radius:12px!important;object-fit:cover!important}
#screen-landing .landing-brand span{font-size:18px!important}
#screen-landing .landing-brand b{color:var(--v60-accent)!important}
#screen-landing .landing-lang{height:42px!important;padding:0 38px 0 12px!important;border:1px solid #e0e2eb!important;border-radius:12px!important;background:#fff!important;color:#585e76!important;font-size:12px!important}
#screen-landing .landing-hero{width:min(1390px,calc(100% - 20px))!important;margin:0 auto!important;min-height:560px!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fff!important;display:grid!important;grid-template-columns:1.05fr .95fr!important;overflow:hidden!important}
#screen-landing .landing-copy{padding:80px 78px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;position:relative!important}
#screen-landing .landing-kicker{font-size:11px!important;font-weight:800!important;letter-spacing:.14em!important;color:var(--v60-accent)!important}
#screen-landing h1{font-size:clamp(44px,5vw,74px)!important;line-height:1.02!important;letter-spacing:-.055em!important;margin:18px 0!important;font-weight:760!important;color:#23263b!important}
#screen-landing h1 span{color:var(--v60-accent)!important}
#screen-landing .landing-copy>p{max-width:610px!important;font-size:15px!important;line-height:1.65!important;color:var(--v60-muted)!important;margin:0 0 28px!important}
#screen-landing .landing-actions{display:flex!important;gap:10px!important;flex-wrap:wrap!important}
#screen-landing .landing-main-btn,#screen-landing .landing-apk-btn{min-width:190px!important;justify-content:center!important;text-decoration:none!important;display:inline-flex!important;align-items:center!important}
#screen-landing .landing-ios{margin-top:14px!important;border:0!important;background:transparent!important;color:#70758b!important;text-align:left!important;padding:0!important;font-size:12px!important}
#screen-landing .landing-ios small{display:block!important;font-size:10px!important;opacity:.75!important;margin-top:3px!important;max-width:440px!important}
#screen-landing .landing-orbit{position:relative!important;min-height:560px!important;background:linear-gradient(135deg,#f7f5ff,#e7e2ff 65%,#d8d1ff)!important;overflow:hidden!important;display:grid!important;place-items:center!important}
#screen-landing .landing-orbit:before,#screen-landing .landing-orbit:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(104,88,232,.15)!important}
#screen-landing .landing-orbit:before{width:400px;height:400px}
#screen-landing .landing-orbit:after{width:570px;height:570px}
#screen-landing .landing-logo-glow{width:190px!important;height:190px!important;border-radius:48px!important;padding:16px!important;background:rgba(255,255,255,.65)!important;box-shadow:0 35px 80px rgba(104,88,232,.18)!important;position:relative!important;z-index:2!important}
#screen-landing .landing-logo-glow img{width:100%!important;height:100%!important;border-radius:32px!important;object-fit:cover!important}
#screen-landing .orbit-pill{position:absolute!important;padding:10px 15px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.8)!important;background:rgba(255,255,255,.76)!important;backdrop-filter:blur(12px)!important;color:#5a5f77!important;font-size:11px!important;box-shadow:0 14px 28px rgba(62,53,113,.10)!important}
#screen-landing .p1{left:13%;top:24%}.p2{right:11%;top:32%}.p3{left:17%;bottom:24%}.p4{right:14%;bottom:17%}
#screen-landing .landing-labs{width:min(1390px,calc(100% - 20px))!important;margin:18px auto 0!important;background:#fff!important;padding:34px!important}
#screen-landing .landing-section-head{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:30px!important;margin-bottom:18px!important}
#screen-landing .landing-section-head span{font-size:10px!important;color:var(--v60-accent)!important;font-weight:800!important;letter-spacing:.1em!important}
#screen-landing .landing-section-head h2{font-size:28px!important;margin:4px 0 0!important}
#screen-landing .landing-section-head p{font-size:11px!important;color:var(--v60-muted)!important}
#screen-landing .landing-feature-grid{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:12px!important}
#screen-landing .landing-feature-grid article{padding:19px!important;border:1px solid #e8e9f1!important;border-radius:16px!important;background:#fbfbfd!important;display:flex!important;flex-direction:column!important;gap:8px!important}
#screen-landing .landing-feature-grid article b{width:38px!important;height:38px!important;border-radius:12px!important;background:#efecff!important;color:var(--v60-accent)!important;display:grid!important;place-items:center!important}
#screen-landing .landing-feature-grid article strong{font-size:13px!important}
#screen-landing .landing-feature-grid article span{font-size:11px!important;line-height:1.55!important;color:var(--v60-muted)!important}
#screen-landing .landing-footer{width:min(1390px,calc(100% - 20px))!important;margin:18px auto 30px!important;display:flex!important;justify-content:space-between!important;color:#8b90a4!important;font-size:11px!important}

/* overlays / search / generic */
.panel-overlay,.qr-overlay,.call-overlay{z-index:9900!important}
.panel-card,.qr-card,.panel,.glass{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.panel-card,.qr-card{background:#fff!important;border:1px solid #e2e3eb!important;border-radius:20px!important;box-shadow:var(--v60-shadow-strong)!important;color:var(--v60-text)!important}
.panel-header{border-bottom:1px solid #e9e9f0!important}

/* call screen */
#call-overlay{background:linear-gradient(145deg,#131326,#26213e)!important}
#call-overlay:not([hidden]){display:block!important}
#call-overlay .call-card{width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;border:0!important;border-radius:0!important;padding:30px!important;background:radial-gradient(700px 500px at 50% 10%,rgba(129,103,238,.18),transparent 70%),#10111d!important;box-shadow:none!important;color:#fff!important}
#call-overlay .call-card .call-name{font-size:38px!important;font-weight:800!important}
#call-overlay .call-card .call-status{color:#adb0c2!important}
#call-overlay .call-card>.avatar.big{width:150px!important;height:150px!important;border-radius:50%!important;overflow:hidden!important;border:3px solid rgba(255,255,255,.23)!important;box-shadow:0 0 0 7px rgba(115,93,237,.15)!important}
#call-overlay .call-card>.avatar.big img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important}
#call-overlay .call-round{width:58px!important;height:58px!important;border-radius:50%!important;border:0!important;background:#292b3a!important;color:#fff!important}
#call-overlay .call-round.accept{background:#25b88c!important}#call-overlay .call-round.decline{background:#e75b68!important}
#call-overlay .call-round:hover{transform:translateY(-2px)}

/* compact / photo rules */
.hg-ui-icon{display:inline-grid!important;place-items:center!important;vertical-align:middle!important}
.hg-ui-icon svg{width:18px!important;height:18px!important}
img.avatar,img.msg-image,.avatar img{max-width:none!important}
.avatar,.avatar-wrap,.chat-avatar,.profile-avatar,.msg-avatar{border-radius:50%!important;overflow:hidden!important}
.avatar img,.chat-avatar img,.profile-avatar img,.msg-avatar img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important;display:block!important}

/* remove browser tooltip title look; keep native accessibility via aria */
[title]{position:relative}

/* mobile */
@media(max-width:980px){
  #screen-app>.app-shell{grid-template-columns:72px minmax(0,1fr)!important}
  #screen-app .rail{width:72px!important}
  #screen-app .sidebar{position:relative!important;width:auto!important;border-right:0!important}
  #screen-app .conversation{position:fixed!important;inset:0!important;z-index:70!important;display:none!important}
  #screen-app .conversation.is-mobile-open,#screen-app .conversation:has(.conversation-active:not([hidden])){display:block!important}
  #screen-app .header-back{display:grid!important}
  #screen-app .bottom-nav{display:flex!important;position:fixed!important;left:10px!important;right:10px!important;bottom:10px!important;height:64px!important;background:rgba(255,255,255,.96)!important;border:1px solid #e4e5ed!important;border-radius:18px!important;box-shadow:0 14px 34px rgba(38,37,67,.12)!important;z-index:120!important;align-items:center!important;justify-content:space-around!important}
  #screen-app .bn-item{border:0!important;background:transparent!important;color:#82879c!important;display:flex!important;flex-direction:column!important;gap:4px!important;align-items:center!important;justify-content:center!important;font-size:9px!important}
  #screen-app .bn-item.is-active{color:var(--v60-accent)!important}
  #screen-app .messages{padding:20px 14px 96px!important}
  #screen-app .composer{left:10px!important;right:10px!important;bottom:83px!important}
  #settings-overlay .settings-panel{width:100vw!important;height:100dvh!important;margin:0!important;border-radius:0!important}
  #settings-overlay .settings-layout{display:block!important;height:calc(100% - 74px)!important}
  #settings-overlay .settings-nav{display:flex!important;flex-direction:row!important;gap:6px!important;overflow:auto!important;border-right:0!important;border-bottom:1px solid var(--v60-line)!important;padding:10px!important}
  #settings-overlay .settings-nav-item{width:auto!important;flex:0 0 auto!important;white-space:nowrap!important}
  #settings-overlay .settings-content{padding:16px!important}
}
@media(max-width:720px){
  #screen-app>.app-shell{display:block!important}
  #screen-app .rail{display:none!important}
  #screen-app .sidebar{width:100%!important;height:100dvh!important}
  #screen-auth,#screen-username,#screen-avatar{padding:0!important}
  #screen-auth>.card-auth{width:100vw!important;min-height:100dvh!important;display:flex!important;flex-direction:column!important;border-radius:0!important}
  #screen-auth .card-auth:before{content:"";display:block!important;flex:0 0 260px!important;background:linear-gradient(155deg,#2d2654,#6f5ceb)!important}
  #screen-auth .brand{left:24px!important;top:24px!important}
  #screen-auth .brand:after{display:none!important}
  #screen-auth .tabs{margin:0!important;padding:18px 22px 10px!important}
  #screen-auth #form-auth{margin:18px 22px 32px!important;max-width:none!important}
  #screen-auth .cloud-password-step{margin:22px!important;max-width:none!important}
  #screen-username>.card-step,#screen-avatar>.card-step{width:100vw!important;min-height:100dvh!important;border-radius:0!important;padding:28px 22px!important;box-shadow:none!important}
  #screen-landing{padding:10px!important}
  #screen-landing .landing-topbar,#screen-landing .landing-hero,#screen-landing .landing-labs,#screen-landing .landing-footer{width:100%!important}
  #screen-landing .landing-hero{grid-template-columns:1fr!important}
  #screen-landing .landing-copy{padding:48px 28px!important}
  #screen-landing .landing-orbit{min-height:360px!important}
  #screen-landing .landing-feature-grid{grid-template-columns:1fr!important}
  #screen-landing .landing-section-head{display:block!important}
  #screen-landing .landing-footer{gap:8px!important;flex-wrap:wrap!important}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}