:root{--page-title-size:19px;--menu-title-size:15px;--menu-note-size:12px}
.connection-announcement{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.messages-view .list-panel{background:#f5f6f8}
.messages-view .list-heading{position:relative;top:auto;right:auto;display:grid;grid-template-columns:36px minmax(0,1fr) 36px;gap:8px;align-items:center;flex:none;height:77px;padding:0 16px}
.messages-view .list-heading>div{display:block;grid-column:2;grid-row:1;min-width:0}
.messages-view .list-heading .eyebrow,.messages-view .list-count{display:none}
.messages-view .list-title-row{justify-content:center}
.messages-view .list-title-row>h1{margin:0;font-size:var(--page-title-size);font-weight:600;color:#25282e;letter-spacing:0}
.messages-view .list-heading .add-button{grid-column:3;grid-row:1;width:36px;height:36px;background:none;border:0}
.messages-view .list-panel>.search-box{height:38px;min-height:38px;width:auto;margin:0 12px 12px;border:0;border-radius:10px;background:#e9ebef}
.messages-view .search-box input::placeholder{font-size:12px;color:#939aa5}
.messages-view .list-footer{display:none}
.messages-view .conversation-list{padding:0;background:#fff;scrollbar-gutter:auto}
.messages-view .conversation-item{position:relative;min-height:78px;margin:0;padding:14px 18px;gap:12px;border:0;border-radius:0;background:#fff;box-shadow:none}
.messages-view .conversation-item::after{content:'';position:absolute;left:76px;right:0;bottom:0;height:1px;background:#edf0f3}
.messages-view .conversation-item:hover{background:#f8f9fa}
.messages-view .conversation-item.selected,.messages-view .conversation-item.is-pinned{background:#edf0f3;box-shadow:none}
.messages-view .conversation-item>.avatar{width:46px;height:46px;flex:none;border-radius:9px;font-size:18px;filter:none;opacity:1}
.messages-view .conversation-copy>strong{font-size:var(--menu-title-size);font-weight:500;color:#2d343e}
.messages-view .conversation-copy>small{font-size:var(--menu-note-size);color:#929ba8;line-height:1.5;margin-top:5px}
.messages-view .conversation-side time{font-size:10px;color:#9ca4af}
.directory-view .list-title-row>h1,.discover-heading h1,.me-page-heading h1{font-size:var(--page-title-size);font-weight:600}
.directory-action-copy,.directory-action-copy strong,.directory-person .conversation-copy>strong,.me-menu-copy strong{font-size:var(--menu-title-size);font-weight:500;line-height:1.5}
.directory-action-copy small,.directory-person .conversation-copy>small,.me-menu-copy small,.me-account,.me-profile-more{font-size:var(--menu-note-size);line-height:1.6}
.me-bio{font-size:var(--menu-note-size);line-height:1.7}
@media(max-width:759px),(max-height:500px) and (pointer:coarse){
 :root{--page-title-size:18px}
 .messages-view .list-panel{padding-top:0}
 .messages-view .list-heading{height:62px;padding:0 16px}
 .messages-view .list-panel>.search-box{margin:0 12px 12px;width:auto;height:38px;min-height:38px}
 .messages-view .search-box input{font-size:16px}
 .messages-view .conversation-item{min-height:78px;padding:14px 18px}
 .messages-view .conversation-item>.avatar{width:46px;height:46px;border-radius:9px}
}

/* One title geometry for Messages, Contacts and Discovery, including PWA insets. */
:root{--main-heading-height:77px;--main-heading-inset:0px}
.messages-view .list-panel,.directory-view .list-panel{padding-top:0}
.messages-view .list-heading,.directory-view .list-heading,.discover-heading{height:calc(var(--main-heading-height) + var(--main-heading-inset));min-height:calc(var(--main-heading-height) + var(--main-heading-inset));padding-top:var(--main-heading-inset);box-sizing:border-box;border-bottom:0}
.messages-view .list-title-row>h1,.directory-view .list-title-row>h1,.discover-heading h1{line-height:1.35;margin:0;letter-spacing:0}
@media(max-width:759px),(max-height:500px) and (pointer:coarse){:root{--main-heading-height:62px;--main-heading-inset:env(safe-area-inset-top,0px)}}



.messages-view .list-title-row,.directory-view .list-title-row{margin:0}

/* PC search uses identical geometry in messages and contacts. */
@media(min-width:760px) and (min-height:501px),(min-width:760px) and (pointer:fine){
 .app-screen.messages-view .list-panel>.list-heading,.app-screen.directory-view .list-panel>.list-heading{height:66px;min-height:66px;padding:0}
 .app-screen.messages-view .list-panel>.search-box,.app-screen.directory-view .list-panel>.search-box{position:absolute;top:17px;left:12px;right:52px;width:auto;height:34px;min-height:34px;max-height:34px;margin:0;padding:0 10px;border:0;border-radius:7px;background:#e9ebef;box-shadow:none;z-index:2}
 .app-screen.messages-view .list-panel>.search-box input,.app-screen.directory-view .list-panel>.search-box input{font-size:12px;color:#303741}
 .app-screen.messages-view .list-panel>.search-box input::placeholder,.app-screen.directory-view .list-panel>.search-box input::placeholder{font-size:12px;color:#939aa5}
 .app-screen.messages-view .list-panel>.search-box>svg,.app-screen.directory-view .list-panel>.search-box>svg{width:16px;height:16px}
 .app-screen.messages-view .list-panel>.list-heading>.add-button,.app-screen.directory-view .list-panel>.list-heading>.add-button{position:absolute;right:10px;top:17px;width:34px;height:34px;padding:7px;margin:0;background:transparent;border:0}
 .app-screen.messages-view .list-panel>.list-heading>.add-button svg,.app-screen.directory-view .list-panel>.list-heading>.add-button svg{width:20px;height:20px}
 .app-screen.directory-view[data-tab=groups] .list-panel>.search-box{left:52px}
 .desktop-directory-sections{padding:2px 0 10px;background:#f5f6f8}.desktop-directory-toggle{display:flex;align-items:center;gap:8px;width:100%;min-height:36px;padding:8px 13px;border:0;background:transparent;color:#424955;text-align:left;font-size:13px;line-height:20px}.desktop-directory-toggle:hover{background:#e9ecf1}.desktop-directory-arrow{width:12px;height:12px;color:#89919c;transform:rotate(180deg);stroke-width:1.5}.desktop-directory-toggle[aria-expanded=true]>.desktop-directory-arrow{transform:rotate(270deg)}.desktop-directory-label{flex:1}.desktop-directory-count{font-size:11px;color:#919ba9}.desktop-directory-count.is-unread{padding:0 5px;min-width:18px;border-radius:9px;background:#d45863;color:white;text-align:center}.desktop-directory-count:empty{display:none}.desktop-directory-items{padding:3px 12px 8px 28px;background:#f5f6f8}.desktop-directory-entry{display:flex;align-items:center;gap:9px;text-align:left;width:100%;min-height:49px;padding:8px 4px;border:0;background:transparent}.desktop-directory-entry:hover{background:#eceff3}.desktop-directory-entry>.avatar{width:32px;height:32px;border-radius:7px;font-size:13px}.desktop-directory-copy{display:block;min-width:0;flex:1}.desktop-directory-copy>strong{display:block;font-size:12px;font-weight:400;color:#414b59;overflow-wrap:anywhere}.desktop-directory-copy>small{display:block;font-size:11px;color:#929dab;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:5px}.desktop-directory-more{display:block;padding:8px 4px;border:0;background:transparent;color:#71839b;font-size:11px;text-align:left}.desktop-directory-empty{margin:0;padding:10px 4px;color:#9ba3af;font-size:11px;line-height:1.8}.desktop-directory-sections button:focus-visible{outline:2px solid #9aaabc;outline-offset:-2px}
}

/* PC conversation title and presence share a compact line. */
@media(min-width:760px) and (min-height:501px),(min-width:760px) and (pointer:fine){
 .app-screen .active-chat{padding-top:0}
 .app-screen .active-chat>.chat-header{display:flex;align-items:center;gap:12px;height:56px;min-height:56px;padding:0 20px}
 .app-screen .chat-header>.chat-heading{display:flex;align-items:center;justify-content:flex-start;gap:10px;flex:1;min-width:0;text-align:left}
 .app-screen .chat-header>.chat-heading h2{display:flex;align-items:center;justify-content:flex-start;flex:0 1 auto;min-width:0;margin:0;font-size:15px;line-height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .app-screen .chat-header>.chat-heading p{display:flex;align-items:center;justify-content:flex-start;flex:0 1 auto;max-width:45%;min-width:0;margin:0;font-size:11px;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .app-screen .chat-header>.chat-details-button{flex:none;width:32px;height:32px;margin-left:auto;padding:7px}
}

.unified-group-list>.feature-row{padding:18px 20px}.unified-group-list>.group-feed-empty{margin:0;padding:26px 20px}.group-feed-messages:empty{display:none}.group-feed-messages{padding:16px 20px}.group-feed-messages>.form-error{margin:0 0 12px}.directory-page-content>.feature-more{margin:16px 20px}.group-notification-item .feature-row-footer{justify-content:flex-end}.group-notification-item .feature-row-footer>small{margin-right:auto}
@media(min-width:760px) and (min-height:501px),(min-width:760px) and (pointer:fine){
 .app-screen.desktop-directory-workflow>.list-panel{grid-column:2;grid-row:1}
 .app-screen.desktop-directory-workflow>.directory-page{grid-column:3;grid-row:1;width:auto;min-width:0}
 .app-screen.desktop-directory-workflow .directory-page-heading{height:56px;min-height:56px;display:flex;align-items:center;padding:0 24px;background:#fff;border-bottom:1px solid #e7eaef}
 .app-screen.desktop-directory-workflow .directory-page-heading h1{font-size:15px;font-weight:500;text-align:left;flex:1}
 .app-screen.desktop-directory-workflow .directory-page-heading>span{display:none}
 .app-screen.desktop-directory-workflow #directoryPageBack{display:none}
 .app-screen.desktop-directory-workflow .directory-page-body{padding:24px;scrollbar-gutter:stable}
 .desktop-directory-toggle.is-selected{background:#e7ebf0;color:#263a54}
}

@media(min-width:760px) and (min-height:501px),(min-width:760px) and (pointer:fine){
 .app-screen.desktop-directory-workflow #directoryPage[data-conversation-kind] #directoryPageBack{display:inline-flex}
 .app-screen.desktop-directory-workflow #directoryPage[data-conversation-kind] .directory-page-heading{gap:10px;padding-left:14px}
}

.desktop-directory-inbox>.desktop-directory-arrow{visibility:hidden}

/* The visitor group occupies a single row until expanded. */
.temporary-visitor-group{min-width:0;border-bottom:1px solid #edf0f3;background:#fff}
.temporary-group-header{display:flex;align-items:stretch;position:relative;min-width:0}
.messages-view .temporary-group-toggle{flex:1;min-width:0;padding-right:4px}
.messages-view .temporary-group-toggle::after{display:none}
.messages-view .temporary-group-avatar{background:#292d33;color:#fff}
.temporary-group-avatar>svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.temporary-group-count{flex:none;align-self:center;margin-left:6px;font-size:11px;font-weight:400;line-height:1.4;color:#8f99a7;background:#f0f2f5;border:1px solid #e6e9ef;border-radius:3px;padding:0 4px}
.temporary-group-chevron{flex:none;width:13px;height:13px;color:#9aa4b2;transform:rotate(-90deg);transition:transform .16s}
.temporary-group-toggle[aria-expanded=true] .temporary-group-chevron{transform:rotate(90deg)}
.temporary-group-more.icon-button{align-self:center;flex:none;width:30px;height:42px;margin:0 6px 0 0;padding:6px;color:#9aa4b2;background:transparent;border:0;border-radius:5px}
.temporary-group-more.icon-button:hover{background:#edf0f3}
.temporary-group-rows{border-top:1px solid #edf0f3;background:#f8f9fa}
.messages-view .temporary-group-rows .conversation-item{padding-left:29px;background:#f8f9fa}
.messages-view .temporary-group-rows .conversation-item:hover{background:#f1f3f6}
.messages-view .temporary-group-rows .conversation-item.selected{background:#e9edf2}
.messages-view .temporary-group-rows .conversation-item::after{left:87px}
.temporary-group-load{display:block;width:100%;min-height:44px;padding:10px 16px;border:0;border-top:1px solid #edf0f3;background:#f8f9fa;color:#586d89;font:inherit;font-size:12px;text-align:center}
.temporary-group-load:hover{background:#f0f2f5}.temporary-group-load:disabled{opacity:.5}.temporary-group-less{color:#929ba8}
.temporary-group-empty{margin:0;padding:23px 18px;text-align:center;font-size:12px;line-height:1.7;color:#929ba8}
.temporary-group-menu .group-quick-action{font-size:13px}
.temporary-group-toggle:focus-visible,.temporary-group-more:focus-visible,.temporary-group-load:focus-visible{outline:2px solid #9ca9bb;outline-offset:-3px}
@media(prefers-reduced-motion:reduce){.temporary-group-chevron{transition:none}}



/* Mobile titles, settings rows and profile metadata share the same type scale. */
@media (max-width:759px), (max-height:500px) and (pointer:coarse){
 :root{--mobile-profile-name-size:20px;--mobile-action-size:16px;--mobile-profile-meta-size:13px}
 .directory-page .directory-page-heading h1,
 .directory-page[data-conversation-kind="direct-info"] .directory-page-heading h1{
  font-size:var(--page-title-size);font-weight:600;color:#25282e;
 }
 .direct-chat-info .direct-info-name,.contact-profile .contact-profile-name,
 .modal-body .personal-info-card h3{
  font-size:var(--mobile-profile-name-size);font-weight:600;line-height:1.4;color:#25282e;
 }
 .direct-chat-info :is(.direct-info-id,.direct-info-status),.contact-profile :is(.contact-profile-meta,.contact-profile-status),
 .modal-body .personal-info-card .profile-id{
  font-size:var(--mobile-profile-meta-size);line-height:1.55;color:#65707e;
 }
 .direct-chat-info .direct-info-status.is-online,.contact-profile .contact-profile-status.is-online{color:#13785b}
 .direct-chat-info .direct-info-bio,.modal-body .personal-info-card .profile-bio{
  font-size:14px;line-height:1.7;color:#535d6b;
 }
 .direct-chat-info .direct-info-section>.menu-row,.direct-chat-info>.social-profile-entry,
 .direct-chat-info .official-contact-summary,.contact-profile>.social-profile-entry{
  font-size:var(--mobile-action-size);font-weight:400;line-height:1.55;color:#303740;
 }
 .direct-chat-info :is(.profile-source-row,.official-contact-field),.contact-profile .contact-profile-field{
  font-size:14px;line-height:1.6;
 }
 .direct-chat-info :is(.contact-profile-label,.official-contact-toggle,.official-contact-field>span:first-child),
 .contact-profile .contact-profile-label{color:#65707e}
 .direct-chat-info .official-contact-toggle{font-size:var(--mobile-profile-meta-size)}
}
