.pf-workspace{max-width:760px;margin:auto;background:var(--panel,#111);border:1px solid var(--line,#222);border-radius:22px;overflow:hidden;color:var(--text,#eee)}.pf-header{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--line,#252525);min-height:78px}.pf-header h2{font-size:21px;margin:0;flex:1}.pf-header:has(.pf-identity) h2{display:none}.pf-header>.pf-identity{flex:1}.pf-icon{background:none;border:0;color:inherit;cursor:pointer;font-size:25px;min-width:40px;min-height:40px;border-radius:50%}.pf-icon:hover{background:#8882}.pf-tabs{display:flex;border-bottom:1px solid var(--line,#252525)}.pf-tabs button{flex:1;border:0;background:none;color:var(--muted,#8e949d);padding:18px;font:inherit;cursor:pointer;position:relative}.pf-tabs button.active{color:#2998f2;font-weight:700}.pf-tabs button.active:after{content:'';position:absolute;bottom:0;height:3px;left:30%;right:30%;background:#2998f2;border-radius:3px}.pf-list{margin:12px;border-radius:16px;background:var(--bg,#151515);overflow:hidden}.pf-person{display:flex;align-items:center;gap:14px;padding:17px 18px;min-height:84px;border-bottom:1px solid #8881}.pf-person:last-child{border-bottom:0}.pf-person[role=button]{cursor:pointer}.pf-person[role=button]:hover{background:#8881}.pf-person-info{flex:1;min-width:0}.pf-identity{display:flex;align-items:center;gap:3px;min-width:0}.pf-identity strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;font-size:17px}.pf-badge{display:inline-flex;width:24px;height:24px;flex-shrink:0}.pf-badge img{width:100%;height:100%;object-fit:contain}.pf-avatar{width:50px;height:50px;flex-shrink:0;border-radius:50%;position:relative;display:inline-flex}.pf-avatar img{height:100%;width:100%;border-radius:50%;object-fit:cover}.pf-avatar.is-online:after{content:'';position:absolute;bottom:0;right:0;width:10px;height:10px;border:2px solid var(--panel,#111);background:#79b638;border-radius:50%}.pf-person small{display:block;margin-top:7px;color:var(--muted,#999);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:480px}.pf-row-tail{display:flex;gap:8px;align-items:center;color:#999}.pf-count{background:#1689e9;color:#fff;min-width:23px;height:23px;text-align:center;border-radius:20px;font-size:12px;padding:4px}.pf-tools button{display:block;width:100%;border:0;border-bottom:1px solid #8881;background:none;color:inherit;text-align:right;padding:18px 20px;font:inherit;cursor:pointer}.pf-tools button:hover{background:#8881}.pf-section-label{font-size:12px;color:var(--muted,#999);padding:4px 26px;margin:10px 0}.pf-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:260px;text-align:center;padding:30px;color:var(--muted,#9399a5)}.pf-empty-icon{font-size:72px;color:#6d778a;font-weight:300}.pf-empty h3{font-size:19px;margin:10px 0}.pf-empty p{font-size:14px;margin:0;max-width:290px;line-height:1.8}.pf-request-actions{display:flex;gap:8px}.pf-accept,.pf-reject{border:0;border-radius:22px;color:white;font-size:20px;cursor:pointer;width:44px;height:30px;background:#77af31}.pf-reject{background:#dd343b}.pf-messages{height:min(58dvh,540px);min-height:280px;overflow:auto;overscroll-behavior:contain;padding:20px;display:flex;flex-direction:column;gap:12px}.pf-messages .pf-empty{flex:1}.pf-message{align-self:flex-end;max-width:82%;padding:11px 15px;border-radius:18px 18px 5px 18px;background:var(--bg,#24252a);border:1px solid #8882;overflow-wrap:anywhere}.pf-message.own{align-self:flex-start;background:#2385dc20;border-color:#2385dc35;border-radius:18px 18px 18px 5px}.pf-message p{margin:0;line-height:1.6;white-space:pre-wrap}.pf-message time{display:block;font-size:10px;color:var(--muted,#9096a0);margin-top:7px}.pf-compose{display:flex;gap:10px;padding:15px;border-top:1px solid #8882}.pf-compose input{min-width:0;flex:1;border:0;outline:none;border-radius:24px;background:var(--bg,#26272d);color:inherit;padding:13px 17px;font:inherit}.pf-send{border:0;border-radius:50%;width:44px;height:44px;background:#2385dc;color:white;font-size:26px;cursor:pointer}.pf-button{border:1px solid #8883;border-radius:12px;background:none;color:inherit;padding:12px 18px;font:inherit;cursor:pointer}.pf-button.primary{background:#2385dc;color:white;border:0}.pf-add{padding:24px}.pf-add .pf-compose{padding:20px 0;border:0}.pf-dialog{color:var(--text,#eee);background:var(--panel,#151515);border:1px solid #8883;border-radius:24px;padding:30px;max-width:420px;width:calc(100% - 32px);text-align:center;box-shadow:0 24px 90px #0007}.pf-dialog::backdrop{background:#0009;backdrop-filter:blur(5px)}.pf-dialog p{color:var(--muted,#999);line-height:1.9;font-size:14px}.pf-dialog input{width:100%;border:0;background:#8882;color:inherit;padding:14px;border-radius:12px;margin:12px 0 20px;font-size:12px}.pf-dialog .pf-button{margin:4px}.pf-dialog-close{position:absolute;left:10px;top:10px}.pf-dialog>.pf-avatar{width:72px;height:72px;margin:10px auto}.pf-banners{position:fixed;z-index:26010;top:max(14px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:min(420px,calc(100vw - 24px));display:flex;flex-direction:column;gap:9px;pointer-events:none}.pf-banner{display:flex;align-items:center;gap:8px;border:1px solid #8884;border-radius:24px;padding:13px 14px;background:var(--panel,#202226);color:var(--text,#fff);box-shadow:0 8px 36px #0004;backdrop-filter:blur(22px);pointer-events:auto;touch-action:pan-x;animation:pf-enter .25s ease-out;transition:opacity .18s}.pf-banner.leaving{opacity:0;transform:translateY(-110%)!important}.pf-banner-content{display:flex;gap:12px;align-items:center;min-width:0;flex:1;text-align:right;background:none;border:0;color:inherit;cursor:pointer}.pf-banner-content>span:last-child{min-width:0}.pf-banner-content small{display:block;max-width:280px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:6px;font-size:13px}.pf-banner-close{background:none;border:0;color:inherit;font-size:20px;min-height:32px;min-width:28px;cursor:pointer}.desktop-tool.has-unread{color:#2385dc!important}.desktop-tool.has-unread:after{content:'';width:6px;height:6px;border-radius:50%;background:#2385dc;position:absolute;top:8px;right:8px}@keyframes pf-enter{from{opacity:0;translate:0 -70px}to{opacity:1;translate:0 0}}@media (max-width:650px){.pf-workspace{border:0;border-radius:0;min-height:65dvh}.pf-messages{height:calc(100dvh - 290px);min-height:280px}.pf-header{padding:12px 14px}.pf-person{padding:16px}.pf-person small{max-width:220px}.pf-add{padding:18px}.pf-add .pf-compose{flex-wrap:wrap}.pf-identity strong{font-size:16px}}@media (prefers-reduced-motion:reduce){.pf-banner{animation:none;transition:none}}

.pf-floating{padding:0;border:0;border-radius:24px;width:min(760px,calc(100vw - 24px));max-height:90dvh;background:var(--panel,#111);color:var(--text,#eee);box-shadow:0 20px 80px #0008}.pf-floating::backdrop{background:#0007}.pf-floating .pf-workspace{margin:0;max-width:none}.pf-floating .pf-messages{height:55dvh}
.pf-dialog textarea{width:100%;min-height:120px;background:var(--bg,#222);border:1px solid var(--line,#333);border-radius:12px;color:inherit;padding:14px;font:inherit;resize:vertical;margin-bottom:15px}

/* People, pending requests and conversations share the platform identity. */
.pf-workspace{direction:rtl;max-width:800px;border-radius:18px;background:var(--panel,#121b20)}
.pf-header{min-height:68px;box-sizing:border-box;padding:12px 18px;flex-shrink:0}
.pf-people-header{position:relative;justify-content:center}.pf-people-header h2{text-align:center;flex:none}.pf-people-header>.pf-icon{position:absolute;left:14px}
.pf-list{margin:0;border-radius:0;background:transparent}
.pf-tools{border-bottom:8px solid var(--bg,#0e151b)}
.pf-tools button{display:flex;align-items:center;gap:14px;min-height:72px;padding:12px 20px;text-align:right;font-size:16px}
.pf-tool-mark{width:42px;height:42px;display:grid;place-items:center;flex:none;border-radius:50%;background:#2699ed14;color:#2699ed;font-size:24px;font-weight:600}.pf-tool-mark:first-child{font-family:system-ui}
.pf-tools .pf-request-count{margin-right:auto;background:#d34d5d;min-width:25px;box-sizing:border-box}
.pf-section-label{margin:0;padding:12px 20px;background:var(--bg,#0d151a);font:600 12px/1.5 system-ui;color:var(--muted,#95a7ad)}
.pf-person{min-height:82px;padding:14px 20px;box-sizing:border-box;gap:12px}
.pf-avatar{width:48px;height:48px;flex:0 0 48px}.pf-avatar.is-online:after{right:auto;left:0;bottom:1px;background:#73b565}
.pf-identity{flex-wrap:nowrap;gap:5px;align-items:center}.pf-identity strong{font:650 16px/1.5 system-ui;direction:inherit}.pf-stars{color:#d3a75e;font-size:16px;white-space:nowrap;letter-spacing:0}
.pf-person-info{overflow:hidden}.pf-person small{font-size:12px;line-height:1.6;margin-top:3px;max-width:100%}
.pf-pending{font:11px/1.4 system-ui;color:var(--muted,#8b9ba4);white-space:nowrap}.pf-request-actions{margin-right:auto;flex-shrink:0;direction:ltr}
.pf-accept,.pf-reject{width:48px;height:30px;min-height:30px;font-size:22px}
.pf-workspace.pf-chat-view.active{display:flex!important;flex-direction:column;height:min(780px,calc(100dvh - 150px));min-height:400px}
.pf-chat-header{min-height:72px;gap:10px}.pf-chat-header>h2{display:none}.pf-chat-header>.pf-icon:first-child{font-size:30px;order:0}.pf-chat-header>.pf-avatar{width:42px;height:42px;flex-basis:42px}.pf-chat-peer{min-width:0;flex:1;display:flex;flex-direction:column;gap:1px}.pf-peer-status{color:var(--muted,#95a7ad);font-size:11px}.pf-chat-header>.pf-icon:last-child{margin-right:auto}
.pf-chat-view>.pf-messages{height:auto;min-height:0;flex:1;padding:18px;scrollbar-width:thin;scrollbar-color:#769394 transparent}
.pf-chat-view>.pf-compose{flex:0 0 auto;align-items:center;padding:10px 14px calc(10px + env(safe-area-inset-bottom));gap:10px;background:var(--panel,#121b20);border-top:1px solid var(--line,#2a373f)}
.pf-compose input{font-size:16px;line-height:24px;min-height:44px;padding:10px 14px;box-sizing:border-box;border-radius:14px}
.pf-chat-view>.pf-compose .pf-send{background:transparent;color:#4caaaa;width:44px;height:44px;flex:none;transform:rotate(180deg);font-size:24px}
.pf-empty{min-height:220px;gap:6px}.pf-empty-icon{font:300 88px/1.2 system-ui;color:#75878c;opacity:.75}.pf-empty h3{font-size:18px}.pf-empty p{font-size:13px}
.pf-message{font-size:15px;border-color:var(--line,#2b3941);background:var(--bg,#18252c)}.pf-message.own{background:#367f822b;border-color:#367f8244}
.pf-floating .pf-chat-view{height:min(760px,86dvh);min-height:0}.pf-floating .pf-chat-view>.pf-messages{height:auto}
@media (max-width:650px){.pf-workspace{border-radius:0;border:0;min-height:0}.pf-workspace.pf-chat-view{height:calc(100dvh - 84px - env(safe-area-inset-bottom));min-height:0}.pf-header{min-height:62px;padding:10px 12px}.pf-tools button{min-height:72px;padding:12px 16px}.pf-person{padding:13px 16px}.pf-person-info .pf-identity{gap:3px}.pf-identity strong{font-size:16px}.pf-stars{font-size:14px}.pf-pending{max-width:80px;white-space:normal;text-align:center}.pf-tabs button{padding:15px}.pf-floating .pf-chat-view{height:86dvh;min-height:0}}

.pf-empty-icon svg{display:block;width:112px;height:112px;margin:0 auto}

@media (max-width:650px){html[data-sd-native] .pf-workspace.pf-chat-view{height:calc(100dvh - 28px);min-height:0}}

/* A conversation is one viewport surface; only its message list scrolls. */
.pf-chat-header .pf-chat-peer{overflow:hidden}
.pf-chat-header .pf-chat-peer .pf-identity{width:100%}
.pf-chat-header .pf-identity strong{direction:ltr;text-align:right;font-size:16px}
.pf-chat-view .pf-messages{overflow-y:auto;overflow-x:hidden;min-height:0;flex:1 1 0;scrollbar-gutter:stable}
.pf-chat-view .pf-message{flex:0 0 auto;width:fit-content;max-width:min(82%,560px);padding:9px 13px;border-radius:16px 16px 4px 16px;box-shadow:none}
.pf-chat-view .pf-message.own{border-radius:16px 16px 16px 4px}
.pf-chat-view .pf-compose{margin:0;flex-shrink:0}
@media (max-width:650px){
 #page-friends.active.pf-chat-view{position:fixed!important;inset:0!important;z-index:15000;width:100%!important;max-width:none!important;height:var(--pf-chat-height,100dvh)!important;min-height:0!important;margin:0!important;border:0!important;border-radius:0!important;box-sizing:border-box;overflow:hidden;background:var(--panel,#111);display:flex!important}
 #page-friends.pf-chat-view>.pf-chat-header{padding:calc(8px + env(safe-area-inset-top,0px)) 10px 8px;min-height:62px;gap:7px;background:var(--panel,#111)}
 #page-friends.pf-chat-view .pf-avatar{width:38px;height:38px;flex-basis:38px}
 #page-friends.pf-chat-view .pf-header .pf-icon{flex:0 0 38px;min-width:38px;width:38px;padding:0;font-size:24px}
 #page-friends.pf-chat-view .pf-chat-peer{flex:1 1 0}
 #page-friends.pf-chat-view>.pf-messages{padding:18px 12px;gap:10px}
 #page-friends.pf-chat-view>.pf-compose{padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));min-height:60px;box-sizing:border-box}
 #page-friends.pf-chat-view .pf-compose input{background:transparent;border-radius:0;padding:8px;min-height:42px}
 .pf-floating:has(.pf-chat-view){inset:0;width:100%;max-width:none;height:var(--pf-chat-height,100dvh);max-height:none;margin:0;border-radius:0;overflow:hidden}
}

.pf-item-attachment{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--line,#2b3941)}
.pf-item-attachment img{width:88px;height:auto;flex:none;object-fit:contain}.pf-item-attachment strong,.pf-item-attachment small{display:block}.pf-item-attachment small{margin-top:4px;color:var(--muted,#95a7ad);font-size:12px}

/* People directory: one calm surface with consistent type and compact rows. */
.pf-workspace:not(.pf-chat-view){background:var(--panel,#121b20);box-sizing:border-box;font-family:system-ui,sans-serif}
.pf-workspace:not(.pf-chat-view) .pf-header{background:transparent;min-height:60px;border-bottom:0;padding:12px 18px}
.pf-people-header h2{font:700 20px/1.5 system-ui}
.pf-people-header>.pf-icon{width:38px;height:38px;min-width:38px;min-height:38px;background:var(--bg,#0d151a);border:1px solid var(--line,#26323c);border-radius:12px;font:400 26px/1 system-ui;display:grid;place-items:center;padding:0}
.pf-tabs{margin:0 16px 16px;border:1px solid var(--line,#26323c);background:var(--bg,#0d151a);border-radius:12px;padding:4px;gap:4px}
.pf-tabs button{padding:10px 12px;border-radius:9px;font:600 14px/1.5 system-ui;min-height:42px}
.pf-tabs button.active{background:var(--panel,#172530);color:var(--text,#edf2f7);box-shadow:0 1px 4px #0001}
.pf-tabs button.active:after{display:none}
.pf-tools{margin:0 16px 20px;border:1px solid var(--line,#26323c);border-radius:16px;background:transparent}
.pf-tools button{padding:12px 14px;min-height:62px;gap:12px;font:500 14px/1.6 system-ui;border-bottom:1px solid var(--line,#26323c)}
.pf-tools button:last-child{border-bottom:0}
.pf-tool-mark{width:36px;height:36px;border-radius:11px;background:#39a8b512;color:#55aeb6}
.pf-tool-mark svg{display:block;width:22px;height:22px}
.pf-section-label{background:transparent;padding:8px 20px;font:600 12px/1.6 system-ui;color:var(--muted,#95a7ad)}
.pf-workspace:not(.pf-chat-view)>.pf-list:not(.pf-tools):not(.pf-add){margin:0 16px 16px;border:1px solid var(--line,#26323c);border-radius:16px;overflow:hidden;background:transparent}
.pf-person{padding:12px 14px;min-height:72px;border-color:var(--line,#26323c)}
.pf-person .pf-avatar{width:44px;height:44px;flex-basis:44px}
.pf-person .pf-identity strong{font:600 15px/1.5 system-ui;direction:ltr}
.pf-tools button:focus-visible,.pf-person[role=button]:focus-visible,.pf-tabs button:focus-visible{outline:2px solid #55aeb6;outline-offset:-3px}
@media (max-width:650px){
 #page-friends.active:not(.pf-chat-view){width:calc(100% + 28px);max-width:none;margin:0 -14px;min-height:calc(100dvh - 160px);border-radius:0;box-shadow:none;border:0;padding:0 0 16px;background:var(--panel,#121b20)}
 #page-friends:not(.pf-chat-view) .pf-header{padding-top:8px;min-height:56px}
 .pf-tools button{min-height:60px}
}

/* Vector back arrow: right in RTL, left in LTR; unaffected by text mirroring. */
.pf-back svg{width:24px;height:24px;display:block;flex:none}
html[dir="ltr"] .pf-back svg{transform:scaleX(-1)}

/* Match Safari's visible area when its keyboard pans the layout viewport. */
@media(max-width:650px){
 #page-friends.active.pf-chat-view{inset:var(--pf-chat-top,0px) 0 auto!important;max-height:var(--pf-chat-height,100dvh);flex-direction:column}
 .pf-floating:has(.pf-chat-view){top:var(--pf-chat-top,0px);bottom:auto;height:var(--pf-chat-height,100dvh)}
 .pf-floating #page-friends.active.pf-chat-view{top:0!important;height:100%!important;max-height:100%}
 body:has(#page-friends.active.pf-chat-view) .bottom-nav,body:has(#page-friends.active.pf-chat-view) .phone-profile-topbar,body:has(#page-friends.active.pf-chat-view) .mobile-header{display:none!important}
 html:has(#page-friends.active.pf-chat-view),body:has(#page-friends.active.pf-chat-view){overflow:hidden;overscroll-behavior:none}
}

.pf-send-status{display:block;margin-top:3px;font-size:11px;opacity:.72}.pf-retry{border:0;background:transparent;color:var(--accent,#2998f2);font:inherit;font-size:12px;cursor:pointer;padding:4px 0}