.wpm-root {
  --wpm-accent: #2aabee;
  --wpm-bg: #eef3f7;
  --wpm-card: #ffffff;
  --wpm-panel: #ffffff;
  --wpm-text: #17212b;
  --wpm-muted: #74808b;
  --wpm-border: #dfe5ea;
  --wpm-chat-bg: #dfeaf1;
  --wpm-bubble: #ffffff;
  --wpm-mine: #d7f7c8;
  --wpm-input: #f1f4f6;
  --wpm-danger: #c62828;
  --wpm-success: #16824b;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Arial, sans-serif;
  color: var(--wpm-text);
  background: var(--wpm-bg);
  min-height: 72vh;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
  text-align: start;
}
.wpm-root[dir="rtl"] { font-family: Tahoma, "Vazirmatn", Arial, sans-serif; }
.wpm-root * { box-sizing: border-box; }
.wpm-root button, .wpm-root input, .wpm-root textarea, .wpm-root select { font: inherit; }
.wpm-root a { color: inherit; }
.wpm-theme-dark {
  --wpm-bg: #111820;
  --wpm-card: #18222d;
  --wpm-panel: #17212b;
  --wpm-text: #eaf1f6;
  --wpm-muted: #91a0ad;
  --wpm-border: #263441;
  --wpm-chat-bg: #0f171e;
  --wpm-bubble: #1d2a35;
  --wpm-mine: #214c3a;
  --wpm-input: #22303c;
}
.is-hidden { display: none !important; }
.wpm-loading { min-height: 60vh; display: grid; place-items: center; padding: 24px; }
.wpm-auth-wrap { min-height: 72vh; display: grid; place-items: center; padding: 28px; }
.wpm-card { background: var(--wpm-card); border: 1px solid var(--wpm-border); box-shadow: 0 18px 50px rgba(0,0,0,.09); border-radius: 24px; }
.wpm-auth-card, .wpm-public-card { width: min(460px,100%); padding: 30px; }
.wpm-public-card { text-align: center; }
.wpm-brand { font-weight: 900; color: var(--wpm-accent); margin-block-end: 8px; }
.wpm-auth-card h1, .wpm-public-card h1 { font-size: 25px; margin: 0 0 8px; }
.wpm-muted { color: var(--wpm-muted); line-height: 1.8; }
.wpm-auth-card label, .wpm-modal-card label { display: block; font-weight: 700; margin: 15px 0 7px; }
.wpm-root input, .wpm-root textarea, .wpm-root select {
  width: 100%; border: 1px solid var(--wpm-border); background: var(--wpm-card); color: var(--wpm-text);
  border-radius: 12px; padding: 11px 13px; outline: none; text-align: start;
}
.wpm-root input:focus, .wpm-root textarea:focus, .wpm-root select:focus { border-color: var(--wpm-accent); box-shadow: 0 0 0 3px color-mix(in srgb,var(--wpm-accent) 15%,transparent); }
.wpm-primary, .wpm-secondary { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; border: 0; border-radius: 12px; padding: 10px 15px; text-decoration: none; cursor: pointer; }
.wpm-primary { background: var(--wpm-accent); color: #fff; font-weight: 800; width: 100%; margin-block-start: 16px; }
.wpm-secondary { background: var(--wpm-input); color: var(--wpm-text); margin: 4px; }
.wpm-alert { padding: 12px 14px; border-radius: 12px; margin: 14px 0; line-height: 1.7; }
.wpm-success { background: #e7f7ed; color: #176b3a; }
.wpm-error { background: #fdecec; color: var(--wpm-danger); }
.wpm-info { background: #eaf5fb; }
.wpm-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); background: var(--wpm-input); padding: 4px; border-radius: 12px; margin: 18px 0; }
.wpm-tabs button { border: 0; background: transparent; color: var(--wpm-text); border-radius: 9px; padding: 10px; cursor: pointer; }
.wpm-tabs button.active { background: var(--wpm-card); box-shadow: 0 2px 8px rgba(0,0,0,.07); }
.wpm-username { display: flex; direction: ltr; align-items: center; border: 1px solid var(--wpm-border); border-radius: 12px; padding-inline-start: 12px; background: var(--wpm-card); transition: border-color .15s, box-shadow .15s; }
.wpm-username input { border: 0 !important; box-shadow: none !important; direction: ltr; text-align: left; }
.wpm-username:has(+ .wpm-username-status.good), .wpm-username.is-valid { border-color: var(--wpm-success); box-shadow: 0 0 0 3px color-mix(in srgb,var(--wpm-success) 12%,transparent); }
.wpm-username:has(+ .wpm-username-status.bad), .wpm-username.is-invalid { border-color: var(--wpm-danger); box-shadow: 0 0 0 3px color-mix(in srgb,var(--wpm-danger) 10%,transparent); }
.wpm-username-status { display: block; margin-block-start: 7px; line-height: 1.6; color: var(--wpm-muted); }
.wpm-username-status.good { color: var(--wpm-success); }
.wpm-username-status.bad { color: var(--wpm-danger); }
.wpm-username-status.checking { color: var(--wpm-muted); }

.wpm-shell { height: 74vh; min-height: 620px; display: grid; grid-template-columns: 320px minmax(0,1fr) 290px; background: var(--wpm-panel); }
.wpm-root[dir="rtl"] .wpm-shell { grid-template-columns: 290px minmax(0,1fr) 320px; }
.wpm-root[dir="rtl"] .wpm-sidebar { grid-column: 3; grid-row: 1; }
.wpm-root[dir="rtl"] .wpm-chat { grid-column: 2; grid-row: 1; }
.wpm-root[dir="rtl"] .wpm-right { grid-column: 1; grid-row: 1; }
.wpm-sidebar { border-inline-end: 1px solid var(--wpm-border); background: var(--wpm-panel); overflow: hidden; display: flex; flex-direction: column; min-width: 0; }
.wpm-sidebar-head { height: 64px; display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; gap: 8px; padding: 0 12px; }
.wpm-sidebar-head strong { text-align: center; }
.wpm-icon-btn { border: 0; background: transparent; color: var(--wpm-text); font-size: 21px; cursor: pointer; border-radius: 50%; width: 40px; height: 40px; display: grid; place-items: center; flex: none; }
.wpm-icon-btn:hover:not(:disabled) { background: var(--wpm-input); }
.wpm-icon-btn:disabled { opacity: .45; cursor: not-allowed; }
.wpm-global-search, .wpm-chat-search { padding: 0 12px 10px; position: relative; }
.wpm-global-search input, .wpm-chat-search input { border: 0; background: var(--wpm-input); height: 42px; }
.wpm-search-results { position: absolute; z-index: 20; inset-inline: 12px; top: 48px; background: var(--wpm-card); border: 1px solid var(--wpm-border); border-radius: 14px; box-shadow: 0 12px 32px rgba(0,0,0,.16); max-height: 360px; overflow: auto; padding: 5px; }
.wpm-search-results button, .wpm-contact-list button { width: 100%; border: 0; background: transparent; color: var(--wpm-text); display: grid; grid-template-columns: 42px 1fr auto; gap: 10px; align-items: center; text-align: start; padding: 9px; border-radius: 10px; cursor: pointer; }
.wpm-search-results button:hover, .wpm-contact-list button:hover { background: var(--wpm-input); }
.wpm-search-results span, .wpm-contact-list span { display: flex; flex-direction: column; min-width: 0; }
.wpm-search-results small, .wpm-contact-list small { color: var(--wpm-muted); direction: ltr; text-align: start; }
.wpm-search-results em { font-style: normal; color: var(--wpm-muted); font-size: 11px; }
.wpm-search-none { padding: 18px; text-align: center; color: var(--wpm-muted); }
.wpm-conversations { overflow: auto; flex: 1; }
.wpm-conv { width: 100%; border: 0; background: transparent; color: var(--wpm-text); display: grid; grid-template-columns: 52px minmax(0,1fr) auto; gap: 10px; align-items: center; text-align: start; padding: 10px 12px; cursor: pointer; }
.wpm-conv:hover, .wpm-conv.active { background: color-mix(in srgb,var(--wpm-accent) 12%,var(--wpm-panel)); }
.wpm-conv-main { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.wpm-conv-main strong, .wpm-conv-main small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wpm-conv-main small, .wpm-conv time { color: var(--wpm-muted); font-size: 11px; }
.wpm-conv-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.wpm-conv-meta b { min-width: 20px; height: 20px; border-radius: 10px; padding: 0 6px; display: grid; place-items: center; color: #fff; background: var(--wpm-accent); font-size: 11px; }
.wpm-avatar { border: 0; padding: 0; overflow: hidden; background: color-mix(in srgb,var(--wpm-accent) 18%,var(--wpm-card)); color: var(--wpm-accent); display: grid; place-items: center; border-radius: 50%; font-weight: 900; flex: none; }
.wpm-avatar img { width: 100%; height: 100%; object-fit: cover; }
.wpm-avatar.big { width: 94px; height: 94px; font-size: 34px; margin: 10px auto 16px; }
.wpm-avatar.mini { width: 40px; height: 40px; font-size: 16px; cursor: pointer; }
.wpm-avatar.small { width: 48px; height: 48px; font-size: 18px; }
.wpm-avatar.tiny { width: 36px; height: 36px; font-size: 14px; }

.wpm-chat { background: var(--wpm-chat-bg); min-width: 0; position: relative; }
.wpm-chat-placeholder { height: 100%; display: grid; place-items: center; }
.wpm-chat-bubble { background: rgba(23,33,43,.52); color: #fff; border-radius: 18px; padding: 9px 14px; font-size: 13px; }
.wpm-chat-live { height: 100%; display: grid; grid-template-rows: 64px minmax(0,1fr) auto auto; }
.wpm-chat-head { display: flex; align-items: center; justify-content: space-between; padding: 0 18px; background: var(--wpm-panel); border-block-end: 1px solid var(--wpm-border); }
.wpm-chat-person { border: 0; background: transparent; color: var(--wpm-text); display: flex; gap: 10px; align-items: center; cursor: pointer; text-align: start; min-width: 0; }
.wpm-chat-person > span { min-width: 0; display: flex; flex-direction: column; }
.wpm-chat-person strong, .wpm-chat-person small { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.wpm-chat-head small { color: var(--wpm-muted); direction: ltr; text-align: start; }
.wpm-messages { overflow: auto; padding: 18px min(4vw,42px); scroll-behavior: smooth; }
.wpm-message-row { display: flex; margin: 6px 0; }
.wpm-message-row.mine { justify-content: flex-end; }
.wpm-message-row.theirs { justify-content: flex-start; }
.wpm-message { max-width: min(76%,650px); padding: 8px 11px 5px; border-radius: 16px; background: var(--wpm-bubble); box-shadow: 0 1px 1px rgba(0,0,0,.08); overflow: hidden; }
.wpm-message-row.mine .wpm-message { background: var(--wpm-mine); }
.wpm-msg-sender { display: block; border: 0; padding: 0; background: transparent; color: var(--wpm-accent); font-weight: 700; margin-block-end: 4px; cursor: pointer; text-align: start; }
.wpm-msg-text { overflow-wrap: anywhere; }
.wpm-msg-foot { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin-block-start: 5px; }
.wpm-message time { display: block; font-size: 10px; color: var(--wpm-muted); direction: ltr; }
.wpm-msg-delete { width: 20px; height: 20px; border: 0; border-radius: 50%; background: transparent; color: var(--wpm-muted); cursor: pointer; }
.wpm-message audio { width: min(320px,100%); }
.wpm-message video { display: block; max-width: 360px; width: 100%; border-radius: 12px; }
.wpm-file-card, .wpm-location-card { display: flex; flex-direction: column; gap: 5px; color: var(--wpm-text); text-decoration: none; min-width: 180px; }
.wpm-location-card small { direction: ltr; }
.wpm-record-status { padding: 7px 14px; background: var(--wpm-panel); border-block-start: 1px solid var(--wpm-border); color: var(--wpm-muted); font-size: 12px; }
.wpm-composer { min-height: 62px; background: var(--wpm-panel); border-block-start: 1px solid var(--wpm-border); display: flex; align-items: flex-end; gap: 4px; padding: 8px 10px; }
.wpm-composer textarea { resize: none; max-height: 120px; min-height: 42px; border: 0; background: var(--wpm-input); flex: 1; }
.wpm-send { border: 0; background: var(--wpm-accent); color: white; width: 42px; height: 42px; border-radius: 50%; cursor: pointer; font-size: 18px; flex: none; }
.wpm-root[dir="rtl"] .wpm-send { transform: scaleX(-1); }
.wpm-composer #wpm-back { display: none; }
.wpm-readonly textarea, .wpm-readonly .wpm-icon-btn:not(#wpm-back), .wpm-readonly .wpm-send { opacity: .5; cursor: not-allowed; }

.wpm-right { border-inline-start: 1px solid var(--wpm-border); background: var(--wpm-panel); overflow: auto; }
.wpm-right-inner { padding: 24px; text-align: center; position: relative; }
.wpm-right-inner h3 { margin: 0 0 5px; }
.wpm-handle { color: var(--wpm-muted); direction: ltr; }
.wpm-right-inner .wpm-secondary { display: flex; width: 100%; margin: 7px 0; }
.wpm-public-link { word-break: break-all; font-size: 12px; }
.wpm-empty-list { padding: 36px 20px; text-align: center; color: var(--wpm-muted); }

.wpm-modal { position: absolute; z-index: 100; inset: 0; background: rgba(0,0,0,.42); display: grid; place-items: center; padding: 18px; }
.wpm-modal-card { width: min(540px,100%); max-height: 88%; overflow: auto; background: var(--wpm-card); color: var(--wpm-text); border-radius: 20px; padding: 24px; box-shadow: 0 24px 70px rgba(0,0,0,.28); position: relative; }
.wpm-modal-close, .wpm-panel-close { position: absolute; inset-inline-end: 14px; top: 12px; border: 0; background: transparent; color: var(--wpm-text); font-size: 28px; cursor: pointer; }
.wpm-modal-card hr { border: 0; border-block-start: 1px solid var(--wpm-border); margin: 22px 0; }
.wpm-settings-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.wpm-check { display: flex !important; align-items: center; gap: 8px; }
.wpm-check input { width: auto; }
.wpm-contact-list { display: flex; flex-direction: column; }
#wpm-video-preview { width: 100%; max-height: 60vh; border-radius: 14px; background: #000; }
.wpm-video-actions { display: flex; gap: 8px; }
.wpm-video-actions > * { flex: 1; }
.wpm-file-label { width: 100%; }
.wpm-toast { position: absolute; z-index: 200; inset-inline-end: 20px; bottom: 20px; background: #17212b; color: #fff; border-radius: 12px; padding: 12px 16px; max-width: 360px; box-shadow: 0 10px 30px rgba(0,0,0,.2); }
.wpm-toast.error { background: #b42318; }
.wpm-toast.success { background: #16794b; }
.wpm-panel-close { display: none; }

@media (max-width:1050px) {
  .wpm-shell, .wpm-root[dir="rtl"] .wpm-shell { grid-template-columns: 300px minmax(0,1fr); }
  .wpm-root[dir="rtl"] .wpm-sidebar { grid-column: 2; }
  .wpm-root[dir="rtl"] .wpm-chat { grid-column: 1; }
  .wpm-right { display: none; }
  .wpm-right.wpm-open { display: block; position: absolute; z-index: 40; inset: 0; background: var(--wpm-panel); border: 0; }
  .wpm-right.wpm-open .wpm-panel-close { display: block; }
}
@media (max-width:700px) {
  .wpm-root { border-radius: 0; min-height: 100dvh; margin-inline: calc(50% - 50vw); width: 100vw; }
  .wpm-auth-wrap { min-height: 100dvh; padding: 16px; }
  .wpm-auth-card, .wpm-public-card { padding: 22px; border-radius: 18px; }
  .wpm-shell, .wpm-root[dir="rtl"] .wpm-shell { display: block; height: 100dvh; min-height: 100dvh; }
  .wpm-sidebar { height: 100%; border: 0; }
  .wpm-chat { display: none; height: 100%; }
  .wpm-mobile-chat .wpm-sidebar { display: none; }
  .wpm-mobile-chat .wpm-chat { display: block; }
  .wpm-chat-live { height: 100dvh; }
  .wpm-composer { padding-block-end: max(8px,env(safe-area-inset-bottom)); }
  .wpm-composer #wpm-back { display: grid; }
  .wpm-message { max-width: 86%; }
  .wpm-settings-row { grid-template-columns: 1fr; }
  .wpm-modal { position: fixed; }
  .wpm-toast { position: fixed; inset-inline: 12px; bottom: 12px; max-width: none; }
}


.wpm-auth-divider { display: flex; align-items: center; gap: 10px; margin: 14px 0 8px; color: var(--wpm-muted); font-size: 12px; text-transform: uppercase; }
.wpm-auth-divider::before, .wpm-auth-divider::after { content: ''; height: 1px; flex: 1; background: var(--wpm-border); }

/* v0.3.2 presence & privacy */
.wpm-last-seen{margin:.25rem 0 .6rem;font-size:.86rem;opacity:.72;line-height:1.55}
.wpm-settings-row select{min-width:0}


/* v0.3.4 per-conversation mute & pin */
.wpm-conv-flags{display:flex;gap:3px;justify-content:flex-end;min-height:14px;font-size:11px;line-height:1}
.wpm-chat-head-actions{display:flex;align-items:center;gap:5px;flex:none}
.wpm-head-flag{font-size:13px;opacity:.75}
.wpm-pref-action{width:100%;display:flex;margin:7px 0}
.wpm-mute-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.wpm-mute-grid .wpm-secondary{width:100%;display:flex;justify-content:center}
@media (max-width:520px){.wpm-mute-grid{grid-template-columns:1fr}}

/* v0.4.0 WebRTC private voice calls */
.wpm-call-start{font-size:19px}
.wpm-call-layer{position:absolute;z-index:260;inset:0;background:color-mix(in srgb,var(--wpm-chat-bg) 88%,#000);backdrop-filter:blur(18px);display:grid;place-items:center;padding:22px}
.wpm-call-layer.is-hidden{display:none}
.wpm-call-card{width:min(420px,100%);min-height:440px;border-radius:28px;background:color-mix(in srgb,var(--wpm-panel) 92%,transparent);box-shadow:0 30px 90px rgba(0,0,0,.3);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:34px;text-align:center;color:var(--wpm-text)}
.wpm-call-avatar{width:112px!important;height:112px!important;margin:0 0 20px!important;box-shadow:0 0 0 7px color-mix(in srgb,var(--wpm-accent) 13%,transparent)}
.wpm-call-card h2{margin:0 0 5px;font-size:25px}
.wpm-call-label{margin:0;color:var(--wpm-muted)}
.wpm-call-status{min-height:28px;margin:16px 0 28px;font-size:15px;font-variant-numeric:tabular-nums;direction:ltr}
.wpm-call-actions{display:flex;align-items:center;justify-content:center;gap:34px}
.wpm-call-btn{width:84px;border:0;background:transparent;color:var(--wpm-text);display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;font:inherit}
.wpm-call-btn>span{font-size:12px;line-height:1.35}
.wpm-call-btn{font-size:14px}
.wpm-call-btn.danger,.wpm-call-btn.accept,.wpm-call-btn.neutral{padding-top:58px;position:relative}
.wpm-call-btn.danger::before,.wpm-call-btn.accept::before,.wpm-call-btn.neutral::before{position:absolute;top:0;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-size:23px;color:#fff}
.wpm-call-btn.danger::before{content:'✕';background:#e5484d}
.wpm-call-btn.accept::before{content:'☎';background:#22a559}
.wpm-call-btn.neutral::before{content:'🎙';background:color-mix(in srgb,var(--wpm-accent) 78%,#222)}
.wpm-call-history{display:flex;align-items:center;gap:8px;min-width:160px}
.wpm-call-history>span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--wpm-accent) 14%,transparent);color:var(--wpm-accent)}
.wpm-call-history strong{font-size:13px}
@media(max-width:700px){.wpm-call-layer{position:fixed;padding:0}.wpm-call-card{width:100%;height:100%;min-height:100dvh;border-radius:0;box-shadow:none;padding:max(28px,env(safe-area-inset-top)) 26px max(28px,env(safe-area-inset-bottom))}}

/* v0.4.1 capability / blacklist / sanitized images */
.wpm-message-image{display:block;max-width:min(360px,72vw);max-height:420px;width:auto;height:auto;border-radius:14px;object-fit:contain;background:rgba(0,0,0,.04)}
.wpm-block-list{display:grid;gap:8px;margin:10px 0 18px}
.wpm-block-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--wpm-border);border-radius:12px;background:var(--wpm-panel)}
.wpm-block-row span{min-width:0;display:flex;flex-direction:column}.wpm-block-row small{opacity:.65;overflow:hidden;text-overflow:ellipsis}
.wpm-danger{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%;border:1px solid color-mix(in srgb,var(--wpm-danger) 38%,transparent);background:color-mix(in srgb,var(--wpm-danger) 9%,transparent);color:var(--wpm-danger);border-radius:10px;padding:10px 12px;cursor:pointer;text-decoration:none}

/* v0.4.2 Telegram-inspired responsive shell */
.wpm-root{border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.07)}
.wpm-shell{height:min(86vh,900px);min-height:650px;grid-template-columns:360px minmax(0,1fr);background:var(--wpm-panel)}
.wpm-root[dir="rtl"] .wpm-shell{grid-template-columns:minmax(0,1fr) 360px}
.wpm-root[dir="rtl"] .wpm-sidebar{grid-column:2;grid-row:1}
.wpm-root[dir="rtl"] .wpm-chat{grid-column:1;grid-row:1}
.wpm-sidebar{background:var(--wpm-panel);box-shadow:2px 0 8px rgba(0,0,0,.02)}
.wpm-sidebar-head{height:58px;grid-template-columns:44px 1fr 44px;padding:0 10px}
.wpm-sidebar-head strong{font-size:16px;font-weight:750;letter-spacing:-.01em}
.wpm-menu-btn{font-size:22px}
.wpm-global-search{padding:7px 10px 6px}
.wpm-chat-search{padding:0 10px 7px}
.wpm-global-search input,.wpm-chat-search input{height:40px;border-radius:20px;padding-inline:16px}
.wpm-conv{padding:9px 11px;min-height:66px;border-radius:0}
.wpm-conv:hover{background:color-mix(in srgb,var(--wpm-accent) 8%,var(--wpm-panel))}
.wpm-conv.active{background:var(--wpm-accent);color:#fff}
.wpm-conv.active .wpm-conv-main small,.wpm-conv.active .wpm-conv-meta time{color:rgba(255,255,255,.78)}
.wpm-conv.active .wpm-conv-meta b{background:#fff;color:var(--wpm-accent)}
.wpm-chat{background:var(--wpm-chat-bg)}
.wpm-chat-live{grid-template-rows:58px minmax(0,1fr) auto auto}
.wpm-chat-head{height:58px;padding:0 10px 0 12px;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.wpm-chat-head-main{min-width:0;display:flex;align-items:center;gap:2px;flex:1}
.wpm-chat-back{display:none;font-size:30px;line-height:1}
.wpm-chat-person{min-width:0;max-width:min(520px,72vw)}
.wpm-chat-person strong{font-size:14px}
.wpm-chat-person small{font-size:11px}
.wpm-messages{padding:18px clamp(18px,5vw,72px) 22px}
.wpm-message{max-width:min(72%,680px);border-radius:15px;padding:8px 11px 5px}
.wpm-message-row.mine .wpm-message{border-end-end-radius:5px}
.wpm-message-row.theirs .wpm-message{border-end-start-radius:5px}
.wpm-composer{padding:8px 10px;gap:4px;background:var(--wpm-panel);border-block-start:1px solid var(--wpm-border);align-items:flex-end}
.wpm-composer textarea{min-height:42px;max-height:120px;border:0;border-radius:21px;background:var(--wpm-input);padding:10px 14px;resize:none}
.wpm-composer .wpm-icon-btn{width:42px;height:42px}
.wpm-send{width:42px;height:42px;border-radius:50%;padding:0;flex:none;display:grid;place-items:center}
.wpm-chat-placeholder{background:radial-gradient(circle at 30% 20%,color-mix(in srgb,var(--wpm-accent) 8%,transparent),transparent 26%),var(--wpm-chat-bg)}
.wpm-chat-bubble{backdrop-filter:blur(6px)}

.wpm-drawer-backdrop{position:absolute;z-index:118;inset:0;background:rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .18s ease}
.wpm-drawer-backdrop.wpm-open{opacity:1;pointer-events:auto}
.wpm-drawer{position:absolute;z-index:120;inset-block:0;inset-inline-start:0;width:min(330px,88%);background:var(--wpm-panel);box-shadow:0 12px 44px rgba(0,0,0,.24);transform:translateX(-105%);transition:transform .2s ease;overflow:auto}
.wpm-root[dir="rtl"] .wpm-drawer{transform:translateX(105%)}
.wpm-drawer.wpm-open,.wpm-root[dir="rtl"] .wpm-drawer.wpm-open{transform:translateX(0)}
.wpm-drawer-profile{padding:28px 22px 20px;background:linear-gradient(145deg,color-mix(in srgb,var(--wpm-accent) 17%,var(--wpm-panel)),var(--wpm-panel));border-block-end:1px solid var(--wpm-border);display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.wpm-drawer-profile .wpm-avatar.big{width:72px;height:72px;margin:0 0 8px;font-size:26px;cursor:pointer}
.wpm-drawer-profile strong{font-size:17px}
.wpm-drawer-profile small{color:var(--wpm-muted);direction:ltr}
.wpm-drawer-nav{padding:8px}
.wpm-drawer-nav button,.wpm-drawer-nav a{width:100%;height:48px;border:0;background:transparent;color:var(--wpm-text);display:flex;align-items:center;gap:14px;border-radius:10px;padding:0 14px;text-decoration:none;cursor:pointer;text-align:start}
.wpm-drawer-nav button:hover,.wpm-drawer-nav a:hover{background:var(--wpm-input)}
.wpm-drawer-nav button>span,.wpm-drawer-nav a>span{font-weight:650}

.wpm-right{display:block;position:absolute;z-index:115;inset-block:0;inset-inline-end:0;width:min(370px,92%);background:var(--wpm-panel);border-inline-start:1px solid var(--wpm-border);box-shadow:0 15px 50px rgba(0,0,0,.22);transform:translateX(105%);transition:transform .2s ease;overflow:auto}
.wpm-root[dir="rtl"] .wpm-right{transform:translateX(-105%)}
.wpm-right.wpm-open,.wpm-root[dir="rtl"] .wpm-right.wpm-open{transform:translateX(0)}
.wpm-right .wpm-panel-close{display:block}
.wpm-right-inner{padding:46px 22px 28px;text-align:center}

.wpm-attach-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.wpm-attach-choice{border:1px solid var(--wpm-border);background:var(--wpm-panel);color:var(--wpm-text);border-radius:16px;padding:18px 10px;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer}
.wpm-attach-choice:hover{background:var(--wpm-input)}
.wpm-attach-choice b{font-size:28px;font-weight:400}
.wpm-attach-choice span{font-size:12px}

@media(max-width:1050px){
 .wpm-shell,.wpm-root[dir="rtl"] .wpm-shell{grid-template-columns:330px minmax(0,1fr)}
 .wpm-root[dir="rtl"] .wpm-shell{grid-template-columns:minmax(0,1fr) 330px}
 .wpm-root[dir="rtl"] .wpm-sidebar{grid-column:2}.wpm-root[dir="rtl"] .wpm-chat{grid-column:1}
 .wpm-right{display:block}
}
@media(max-width:760px){
 .wpm-root{border-radius:0;min-height:100dvh;margin-inline:calc(50% - 50vw);width:100vw;box-shadow:none}
 .wpm-shell,.wpm-root[dir="rtl"] .wpm-shell{display:block;height:100dvh;min-height:100dvh}
 .wpm-sidebar{height:100%;border:0}.wpm-chat{display:none;height:100%}.wpm-mobile-chat .wpm-sidebar{display:none}.wpm-mobile-chat .wpm-chat{display:block}
 .wpm-chat-live{height:100dvh;grid-template-rows:58px minmax(0,1fr) auto auto}
 .wpm-chat-back{display:grid}
 .wpm-chat-head{padding-inline:4px 8px}
 .wpm-chat-head-actions{gap:0}
 .wpm-chat-person{max-width:calc(100vw - 150px)}
 .wpm-messages{padding:12px 8px 18px}
 .wpm-message{max-width:88%}
 .wpm-composer{padding:7px 7px max(7px,env(safe-area-inset-bottom))}
 .wpm-composer .wpm-icon-btn{width:40px;height:40px}.wpm-send{width:40px;height:40px}
 .wpm-drawer,.wpm-right{position:fixed;top:0;bottom:0}
 .wpm-drawer-backdrop{position:fixed}
 .wpm-modal{position:fixed;align-items:end;padding:0}
 .wpm-modal-card{width:100%;max-height:88dvh;border-radius:22px 22px 0 0;padding:24px 18px max(24px,env(safe-area-inset-bottom))}
 .wpm-attach-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* v0.5.0 approved desktop + mobile UI rebuild */
.wpm-root{
  --wpm-sidebar-w:360px;--wpm-details-w:330px;--wpm-radius:18px;
  background:#eef5fb;box-shadow:0 18px 55px rgba(28,69,104,.12);border:1px solid color-mix(in srgb,var(--wpm-border) 88%,transparent);
}
.wpm-root .wpm-svg{display:block;pointer-events:none}
.wpm-shell{height:min(88vh,930px);min-height:680px;display:grid;grid-template-columns:var(--wpm-sidebar-w) minmax(0,1fr);background:var(--wpm-panel);overflow:hidden}
.wpm-root[dir="rtl"] .wpm-shell{grid-template-columns:minmax(0,1fr) var(--wpm-sidebar-w)}
.wpm-root[dir="rtl"] .wpm-sidebar{grid-column:2}.wpm-root[dir="rtl"] .wpm-chat{grid-column:1}
.wpm-root.wpm-details-open .wpm-shell{grid-template-columns:var(--wpm-sidebar-w) minmax(0,1fr) var(--wpm-details-w)}
.wpm-root[dir="rtl"].wpm-details-open .wpm-shell{grid-template-columns:var(--wpm-details-w) minmax(0,1fr) var(--wpm-sidebar-w)}
.wpm-root[dir="rtl"].wpm-details-open .wpm-right{grid-column:1;grid-row:1}.wpm-root[dir="rtl"].wpm-details-open .wpm-chat{grid-column:2}.wpm-root[dir="rtl"].wpm-details-open .wpm-sidebar{grid-column:3}
.wpm-details-open:not([dir="rtl"]) .wpm-sidebar{grid-column:1}.wpm-details-open:not([dir="rtl"]) .wpm-chat{grid-column:2}.wpm-details-open:not([dir="rtl"]) .wpm-right{grid-column:3}
.wpm-sidebar{border-inline-end:1px solid var(--wpm-border);box-shadow:none;position:relative;padding-bottom:0}
.wpm-sidebar-head{height:68px;display:grid;grid-template-columns:46px 1fr 46px;align-items:center;padding:0 12px;border-block-end:1px solid color-mix(in srgb,var(--wpm-border) 70%,transparent)}
.wpm-app-title{font-size:20px!important;font-weight:850!important;letter-spacing:-.035em}
.wpm-new-btn{background:var(--wpm-accent)!important;color:#fff!important;box-shadow:0 8px 18px color-mix(in srgb,var(--wpm-accent) 25%,transparent)}
.wpm-global-search{padding:12px 13px 8px;position:relative}.wpm-global-search .wpm-search-icon{position:absolute;z-index:2;inset-inline-start:27px;top:23px;color:var(--wpm-muted);pointer-events:none}.wpm-global-search input{height:44px!important;border-radius:14px!important;padding-inline-start:43px!important;background:color-mix(in srgb,var(--wpm-input) 86%,transparent)!important;border:1px solid transparent!important}.wpm-global-search input:focus{border-color:color-mix(in srgb,var(--wpm-accent) 35%,transparent)!important;background:var(--wpm-panel)!important}
.wpm-list-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:4px 13px 10px}.wpm-list-tabs button{border:0;background:var(--wpm-input);color:var(--wpm-muted);border-radius:999px;padding:8px 5px;font-size:12px;cursor:pointer;white-space:nowrap}.wpm-list-tabs button.active{background:var(--wpm-accent);color:#fff;box-shadow:0 5px 13px color-mix(in srgb,var(--wpm-accent) 22%,transparent)}
.wpm-list-section{display:flex;align-items:center;justify-content:space-between;padding:11px 16px 6px;color:var(--wpm-text);font-size:12px;font-weight:800;background:var(--wpm-panel)}
.wpm-conversations{padding-bottom:8px}.wpm-conv{min-height:72px;padding:9px 13px;grid-template-columns:54px minmax(0,1fr) auto;border-radius:12px;margin:2px 7px;width:calc(100% - 14px);transition:background .15s,transform .15s}.wpm-conv:hover{transform:translateY(-1px)}.wpm-conv.active{background:color-mix(in srgb,var(--wpm-accent) 13%,var(--wpm-panel));color:var(--wpm-text)}.wpm-conv.active .wpm-conv-main small,.wpm-conv.active .wpm-conv-meta time{color:var(--wpm-muted)}.wpm-conv-main strong{font-size:14px}.wpm-conv-main small{font-size:11px;line-height:1.7}.wpm-conv-meta{min-width:42px}.wpm-conv-meta time{font-size:10px}.wpm-conv-meta b{font-size:10px;min-width:21px;height:21px}.wpm-conv-flags{color:var(--wpm-muted)}.wpm-pin-mark{color:var(--wpm-accent);font-size:10px}
.wpm-avatar{position:relative}.wpm-avatar.small{width:50px;height:50px}.wpm-avatar.mini{width:42px;height:42px}.wpm-online-dot{position:absolute!important;display:block!important;width:11px!important;height:11px!important;border-radius:50%!important;background:#31c36c!important;border:2px solid var(--wpm-panel)!important;right:0!important;bottom:1px!important;left:auto!important;top:auto!important;margin:0!important;z-index:2}
.wpm-chat{background-color:#edf6fc;background-image:radial-gradient(circle at 16px 16px,color-mix(in srgb,var(--wpm-accent) 7%,transparent) 1.5px,transparent 1.6px),radial-gradient(circle at 44px 44px,color-mix(in srgb,var(--wpm-accent) 5%,transparent) 1px,transparent 1.2px);background-size:58px 58px}.wpm-theme-dark .wpm-chat{background-color:#101922}
.wpm-chat-live{grid-template-rows:68px minmax(0,1fr) auto auto}.wpm-chat-head{height:68px;padding:0 14px;background:color-mix(in srgb,var(--wpm-panel) 95%,transparent);backdrop-filter:blur(16px);box-shadow:0 1px 0 var(--wpm-border)}.wpm-chat-head-main{gap:4px}.wpm-chat-person{gap:11px}.wpm-chat-person strong{font-size:15px}.wpm-chat-person small{font-size:11px;color:var(--wpm-accent)!important}.wpm-chat-head-actions .wpm-icon-btn{width:42px;height:42px}.wpm-chat-back{display:none}
.wpm-chat-placeholder{background:transparent}.wpm-chat-bubble{background:color-mix(in srgb,var(--wpm-text) 65%,transparent);backdrop-filter:blur(7px);padding:10px 16px}
.wpm-messages{padding:22px clamp(20px,5vw,76px) 26px}.wpm-message-row{margin:7px 0}.wpm-message{max-width:min(72%,640px);border-radius:17px;padding:9px 12px 6px;box-shadow:0 2px 5px rgba(26,55,82,.09)}.wpm-message-row.mine .wpm-message{background:#dff8d6;border-end-end-radius:6px}.wpm-theme-dark .wpm-message-row.mine .wpm-message{background:#214c3a}.wpm-message-row.theirs .wpm-message{border-end-start-radius:6px}.wpm-msg-text{line-height:1.75}.wpm-msg-foot{margin-top:4px}.wpm-message time{font-size:9.5px}.wpm-message-image{border-radius:14px;box-shadow:0 1px 2px rgba(0,0,0,.08)}.wpm-file-card{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;min-width:240px;padding:7px}.wpm-file-card::before{content:'PDF';width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:#f24f43;color:#fff;font-size:10px;font-weight:900;grid-row:1/3}.wpm-file-card strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wpm-file-card small{grid-column:2;color:var(--wpm-muted)}.wpm-location-card{min-width:235px;padding:7px 9px 7px 66px;position:relative}.wpm-root[dir="rtl"] .wpm-location-card{padding:7px 66px 7px 9px}.wpm-location-card::before{content:'📍';position:absolute;inset-inline-start:7px;top:7px;width:50px;height:48px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,#dff4e8,#d9edf9);font-size:25px}
.wpm-composer{min-height:64px;padding:9px 12px 10px;gap:3px;background:color-mix(in srgb,var(--wpm-panel) 96%,transparent);backdrop-filter:blur(16px)}.wpm-composer textarea{min-height:44px;border-radius:22px!important;padding:11px 15px!important;background:var(--wpm-input)!important}.wpm-composer .wpm-icon-btn{width:42px;height:42px;color:#284d6b}.wpm-theme-dark .wpm-composer .wpm-icon-btn{color:var(--wpm-text)}.wpm-location-direct{color:var(--wpm-accent)!important}.wpm-send{width:44px;height:44px;display:grid;place-items:center;box-shadow:0 8px 18px color-mix(in srgb,var(--wpm-accent) 30%,transparent)}.wpm-root[dir="rtl"] .wpm-send{transform:none}.wpm-root[dir="rtl"] .wpm-send .wpm-svg{transform:scaleX(-1)}
.wpm-right{display:none;position:relative!important;inset:auto!important;width:auto!important;transform:none!important;border-inline-start:1px solid var(--wpm-border);box-shadow:none!important;background:var(--wpm-panel);overflow:auto}.wpm-details-open .wpm-right{display:block}.wpm-right-inner{padding:26px 18px 30px;text-align:center}.wpm-right-inner .wpm-panel-close{display:block;position:sticky;top:0;margin-inline-start:auto;z-index:3;background:var(--wpm-panel);border-radius:50%}.wpm-right-inner .wpm-avatar.big{width:92px;height:92px;margin:14px auto 10px}.wpm-right-inner h3{font-size:20px;margin:2px 0}.wpm-online-text{color:#1aa45d;margin:3px 0 12px;font-size:12px}.wpm-profile-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.wpm-profile-action{min-height:70px;border:0;border-radius:14px;background:var(--wpm-input);color:var(--wpm-text);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer}.wpm-profile-action .wpm-svg{color:var(--wpm-accent)}.wpm-profile-action span{font-size:11px}.wpm-profile-action.danger{color:var(--wpm-danger)}.wpm-profile-action.danger .wpm-svg{color:var(--wpm-danger)}.wpm-profile-section{border-top:1px solid var(--wpm-border);padding:17px 0;text-align:start}.wpm-profile-section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.wpm-profile-section p{margin:0;line-height:1.8;font-size:13px}.wpm-shared-media{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.wpm-shared-media a{aspect-ratio:1;border-radius:9px;overflow:hidden;background:var(--wpm-input);display:grid;place-items:center}.wpm-shared-media img{width:100%;height:100%;object-fit:cover}.wpm-video-thumb{font-size:24px;color:var(--wpm-accent)}.wpm-shared-files{display:grid;gap:7px;margin-top:10px}.wpm-shared-files a{display:flex;align-items:center;gap:8px;padding:9px 10px;background:var(--wpm-input);border-radius:10px;text-decoration:none;min-width:0}.wpm-shared-files span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.wpm-public-link-card{display:flex!important;flex-direction:column!important;gap:4px!important;align-items:flex-start!important;text-decoration:none!important;padding:12px!important;border-radius:12px!important;background:var(--wpm-input)!important}.wpm-public-link-card small{direction:ltr;color:var(--wpm-muted);overflow-wrap:anywhere}
.wpm-drawer{width:min(335px,88%);background:var(--wpm-panel)}.wpm-drawer-profile{padding:26px 20px 20px;background:var(--wpm-panel)}.wpm-drawer-top{width:100%;display:flex;align-items:flex-start;justify-content:space-between}.wpm-drawer-profile .wpm-avatar.big{width:76px;height:76px;margin:0 0 12px}.wpm-drawer-profile strong{font-size:18px}.wpm-drawer-nav{padding:8px 10px}.wpm-drawer-nav button,.wpm-drawer-nav a{height:50px;gap:16px;border-radius:12px}.wpm-drawer-nav .wpm-svg{color:#355b78}.wpm-drawer-logout{color:#d33!important}.wpm-drawer-logout .wpm-svg{color:#d33!important}
.wpm-mobile-nav{display:none}
.wpm-emoji-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:16px}.wpm-emoji-grid button{border:0;background:var(--wpm-input);border-radius:12px;aspect-ratio:1;font-size:23px;cursor:pointer}.wpm-modal-card{border-radius:24px}.wpm-modal-card h2{margin-top:0}.wpm-modal-card h3{font-size:14px;margin-top:20px}.wpm-settings-row{gap:12px}.wpm-settings-row label{background:var(--wpm-input);padding:11px;border-radius:13px}.wpm-settings-row label select,.wpm-settings-row label input{margin-top:7px;background:var(--wpm-panel)}

@media(max-width:1179px){
 .wpm-shell,.wpm-root[dir="rtl"] .wpm-shell,.wpm-root.wpm-details-open .wpm-shell,.wpm-root[dir="rtl"].wpm-details-open .wpm-shell{grid-template-columns:330px minmax(0,1fr)}
 .wpm-root[dir="rtl"] .wpm-shell,.wpm-root[dir="rtl"].wpm-details-open .wpm-shell{grid-template-columns:minmax(0,1fr) 330px}.wpm-root[dir="rtl"] .wpm-sidebar{grid-column:2}.wpm-root[dir="rtl"] .wpm-chat{grid-column:1}
 .wpm-right,.wpm-details-open .wpm-right{display:block;position:absolute!important;z-index:130;inset-block:0!important;inset-inline-end:0!important;width:min(360px,92%)!important;transform:translateX(105%)!important;box-shadow:0 18px 52px rgba(0,0,0,.23)!important}.wpm-root[dir="rtl"] .wpm-right,.wpm-root[dir="rtl"].wpm-details-open .wpm-right{transform:translateX(-105%)!important}.wpm-right.wpm-open,.wpm-root[dir="rtl"] .wpm-right.wpm-open{transform:translateX(0)!important}.wpm-right .wpm-panel-close{display:block}
}
@media(max-width:760px){
 .wpm-root{min-height:100dvh;width:100vw;margin-inline:calc(50% - 50vw);border:0;border-radius:0;box-shadow:none;--wpm-sidebar-w:100%}
 .wpm-shell,.wpm-root[dir="rtl"] .wpm-shell,.wpm-root.wpm-details-open .wpm-shell,.wpm-root[dir="rtl"].wpm-details-open .wpm-shell{display:block;height:100dvh;min-height:100dvh}
 .wpm-sidebar{height:100%;padding-bottom:70px}.wpm-sidebar-head{height:66px;padding-top:max(0px,env(safe-area-inset-top))}.wpm-app-title{font-size:19px!important}.wpm-global-search{padding-top:7px}.wpm-list-tabs{padding-bottom:8px}.wpm-conv{min-height:70px;margin-inline:8px}.wpm-list-section{padding-inline:16px}
 .wpm-mobile-nav{display:grid;grid-template-columns:repeat(4,1fr);position:absolute;z-index:30;inset-inline:0;bottom:0;padding:5px 7px max(5px,env(safe-area-inset-bottom));background:color-mix(in srgb,var(--wpm-panel) 97%,transparent);border-block-start:1px solid var(--wpm-border);backdrop-filter:blur(14px)}.wpm-mobile-nav button{height:54px;border:0;background:transparent;color:var(--wpm-muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px}.wpm-mobile-nav button.active{color:var(--wpm-accent)}.wpm-mobile-nav .wpm-svg{width:21px;height:21px}
 .wpm-chat{display:none;height:100%}.wpm-mobile-chat .wpm-sidebar{display:none}.wpm-mobile-chat .wpm-chat{display:block}.wpm-chat-live{height:100dvh;grid-template-rows:66px minmax(0,1fr) auto auto}.wpm-chat-head{height:66px;padding-inline:4px 8px}.wpm-chat-back{display:grid}.wpm-chat-person{max-width:calc(100vw - 154px)}.wpm-chat-person .wpm-avatar{width:40px;height:40px}.wpm-chat-head-actions .wpm-icon-btn{width:38px;height:38px}.wpm-messages{padding:13px 8px 18px}.wpm-message{max-width:88%;font-size:13px}.wpm-message-image{max-width:76vw}.wpm-file-card,.wpm-location-card{min-width:min(245px,70vw)}.wpm-composer{padding:7px 6px max(7px,env(safe-area-inset-bottom));gap:0}.wpm-composer .wpm-icon-btn{width:38px;height:40px}.wpm-composer textarea{padding-inline:12px!important}.wpm-send{width:42px;height:42px}.wpm-emoji-btn{display:none}
 .wpm-right,.wpm-details-open .wpm-right{position:fixed!important;top:0!important;bottom:0!important;width:100%!important;max-width:none!important}.wpm-right-inner{padding:max(22px,env(safe-area-inset-top)) 18px max(28px,env(safe-area-inset-bottom))}.wpm-profile-actions{grid-template-columns:repeat(3,1fr)}
 .wpm-drawer{position:fixed;top:0;bottom:0}.wpm-drawer-backdrop{position:fixed}.wpm-modal{position:fixed;align-items:end;padding:0}.wpm-modal-card{width:100%;max-height:90dvh;border-radius:24px 24px 0 0;padding:24px 18px max(24px,env(safe-area-inset-bottom))}.wpm-emoji-grid{grid-template-columns:repeat(6,1fr)}
}
@media(max-width:390px){.wpm-list-tabs{gap:3px}.wpm-list-tabs button{font-size:10px}.wpm-composer .wpm-icon-btn{width:34px}.wpm-message{max-width:91%}.wpm-profile-actions{gap:5px}.wpm-profile-action span{font-size:10px}}

/* v0.5.1 UI refinements */
.wpm-shell{background:#f4f7fb!important}
.wpm-sidebar,.wpm-chat,.wpm-right{background:#fff}
.wpm-chat{border-inline:1px solid var(--wpm-border)}
.wpm-sidebar-head,.wpm-chat-head{background:#fff}
.wpm-global-search{padding:12px 14px 10px}
.wpm-global-search input{height:48px;border-radius:24px;background:#f2f5f8;border:1px solid #edf1f6}
.wpm-list-tabs{padding:6px 14px 14px;gap:8px;overflow:auto;white-space:nowrap}
.wpm-list-tabs button{border-radius:999px;padding:9px 15px;background:#f3f6fb;border:1px solid #e6edf6;font-weight:700}
.wpm-list-tabs button.active{background:var(--wpm-accent);color:#fff;border-color:var(--wpm-accent)}
.wpm-conversations{padding-top:4px}
.wpm-conv{margin:0 10px 8px;border-radius:18px;padding:10px 12px;align-items:center;box-shadow:none;border:1px solid transparent;background:transparent}
.wpm-conv:hover{background:#f7f9fc}
.wpm-conv.active{background:#eaf4ff;border-color:#cfe5ff}
.wpm-conv .wpm-avatar.small{width:52px;height:52px}
.wpm-conv-main strong{font-size:16px}
.wpm-conv-main small{font-size:13px}
.wpm-right{background:#fff}
.wpm-right-inner{padding:22px 18px}
.wpm-chat-live{background:#eaf3fb}
.wpm-messages{background:linear-gradient(180deg,#eaf3fb 0%,#edf5fc 100%)}
.wpm-message{position:relative;background:#fff;border:1px solid rgba(56,102,150,.08);padding:12px 14px 8px}
.wpm-message-row.mine .wpm-message{background:#eaf4ff}
.wpm-msg-more{position:absolute;top:8px;inset-inline-end:8px;border:0;background:transparent;color:#6b7b8d;width:24px;height:24px;border-radius:50%;cursor:pointer;opacity:.85}
.wpm-msg-more:hover{background:rgba(0,0,0,.05)}
.wpm-msg-actions-sheet{position:absolute;top:34px;inset-inline-end:8px;display:grid;min-width:130px;background:#fff;border:1px solid #e5edf5;border-radius:14px;box-shadow:0 14px 32px rgba(17,43,70,.14);overflow:hidden;z-index:5}
.wpm-msg-actions-sheet button{border:0;background:#fff;padding:11px 14px;text-align:start;cursor:pointer}
.wpm-msg-actions-sheet button:hover{background:#f5f8fc}.wpm-msg-actions-sheet button.danger{color:#cc3344}
.wpm-msg-forwarded{font-size:12px;font-weight:700;color:var(--wpm-accent);margin-bottom:4px}
.wpm-msg-caption{margin-top:8px;line-height:1.7}
.wpm-media-trigger{display:block;padding:0;border:0;background:transparent;cursor:pointer;width:100%}
.wpm-video-trigger video,.wpm-media-trigger img{display:block;max-width:100%;border-radius:16px}
.wpm-file-card{grid-template-columns:52px minmax(0,1fr)!important;border-radius:16px;background:#fff;border:1px solid #eef2f6}
.wpm-file-card .wpm-file-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#f14e42;color:#fff;font-size:22px}
.wpm-location-card{border-radius:16px;background:#fff;border:1px solid #eef2f6}
.wpm-composer{padding:12px 14px;background:#fff;border-top:1px solid var(--wpm-border);gap:10px}
.wpm-composer textarea{min-height:50px;border-radius:26px;background:#f5f7fa;border:1px solid #e9eff5;padding:13px 18px!important}
.wpm-composer .wpm-icon-btn,.wpm-send{box-shadow:none;border:1px solid #e8eef5;background:#fff}
.wpm-send{background:var(--wpm-accent);color:#fff;border-color:var(--wpm-accent)}
#wpm-voice.is-recording{background:#ff5b5b!important;color:#fff!important;border-color:#ff5b5b!important;animation:wpmPulse 1.1s infinite}
.wpm-record-status{display:flex;align-items:center;gap:10px;background:#fff3f3;color:#cb3347;border-top:1px solid #ffd4da;font-weight:700}
.wpm-record-status.is-hidden{display:none}
.wpm-record-dot{width:10px;height:10px;border-radius:50%;background:#ff334f;display:inline-block;box-shadow:0 0 0 0 rgba(255,51,79,.6);animation:wpmPulse 1.2s infinite}
@keyframes wpmPulse{0%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,51,79,.5)}70%{transform:scale(1.08);box-shadow:0 0 0 9px rgba(255,51,79,0)}100%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,51,79,0)}}
.wpm-modal-card:has(.wpm-media-viewer){width:min(920px,96vw);padding:16px;background:rgba(14,23,35,.92)}
.wpm-media-viewer{display:grid;gap:10px;justify-items:center}.wpm-media-viewer img,.wpm-media-viewer video{max-width:100%;max-height:78vh;border-radius:18px}.wpm-media-caption{color:#fff;font-size:13px}
.wpm-forward-list{display:grid;gap:10px;margin-top:16px}.wpm-forward-item{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:10px;padding:12px;border:1px solid #e6edf6;background:#fff;border-radius:16px;cursor:pointer}.wpm-forward-item:hover{background:#f5f9ff}
.wpm-send.is-editing{background:#1f8f55!important;border-color:#1f8f55!important}
@media (min-width:1180px){
  .wpm-root.wpm-theme-light{--wpm-sidebar-w:410px;--wpm-details-w:340px}
  .wpm-root:not(.wpm-details-open) .wpm-shell,.wpm-root:not(.wpm-details-open)[dir="rtl"] .wpm-shell{grid-template-columns:340px minmax(0,1fr) 410px!important}
  .wpm-root:not(.wpm-details-open):not([dir="rtl"]) .wpm-sidebar{grid-column:3}.wpm-root:not(.wpm-details-open):not([dir="rtl"]) .wpm-chat{grid-column:2}.wpm-root:not(.wpm-details-open):not([dir="rtl"]) .wpm-right{grid-column:1;display:block}
  .wpm-root:not(.wpm-details-open)[dir="rtl"] .wpm-sidebar{grid-column:1}.wpm-root:not(.wpm-details-open)[dir="rtl"] .wpm-chat{grid-column:2}.wpm-root:not(.wpm-details-open)[dir="rtl"] .wpm-right{grid-column:3;display:block}
}
@media (max-width: 880px){
 .wpm-message{max-width:90%}
 .wpm-conv{margin-inline:8px}
 .wpm-right{display:none!important}
}

/* v0.5.2 scrolling, overlays, action menus and channel media fixes */
.wpm-shell,.wpm-chat,.wpm-chat-live,.wpm-sidebar,.wpm-right{min-height:0!important;min-width:0}
.wpm-chat{overflow:hidden!important;position:relative}
.wpm-chat-live{height:100%!important;min-height:0!important;overflow:hidden!important;grid-template-rows:68px minmax(0,1fr) auto auto!important}
.wpm-messages{min-height:0!important;height:100%!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior-y:contain;scrollbar-gutter:stable;-webkit-overflow-scrolling:touch;touch-action:pan-y;position:relative;isolation:isolate}
.wpm-composer{position:relative!important;z-index:30!important;flex:0 0 auto;background:#fff!important}
.wpm-record-status{position:relative;z-index:31}
.wpm-message-row{position:relative!important;z-index:1;overflow:visible!important}
.wpm-message-row.wpm-actions-open{z-index:900!important}
.wpm-message{overflow:visible!important}
.wpm-msg-actions-sheet{z-index:950!important;top:34px!important;inset-inline-end:4px!important;box-shadow:0 18px 46px rgba(14,39,68,.22)!important}
.wpm-message-image{display:block;width:auto;max-width:min(100%,560px)!important;max-height:min(58vh,560px)!important;object-fit:contain;background:#eef3f7}
.wpm-video-trigger{position:relative;overflow:hidden;border-radius:16px}
.wpm-video-trigger video{display:block;max-width:min(100%,560px)!important;max-height:min(58vh,560px)!important;object-fit:contain;background:#101820;pointer-events:none}
.wpm-video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.55);color:#fff;font-size:21px;pointer-events:none;backdrop-filter:blur(8px)}
.wpm-media-modal{position:fixed!important;z-index:99999!important;inset:0!important;background:rgba(5,12,22,.78)!important;backdrop-filter:blur(12px);padding:24px!important;align-items:center!important}
.wpm-media-modal .wpm-modal-card{width:min(1040px,96vw)!important;max-height:94vh!important;overflow:visible!important;padding:18px!important;border-radius:24px!important;background:rgba(14,23,35,.96)!important;box-shadow:0 30px 90px rgba(0,0,0,.48)!important}
.wpm-media-modal .wpm-media-viewer{max-height:88vh;overflow:auto;overscroll-behavior:contain}
.wpm-media-modal .wpm-media-viewer img,.wpm-media-modal .wpm-media-viewer video{max-height:82vh!important;max-width:100%!important;object-fit:contain}
.wpm-media-close{position:absolute!important;top:10px!important;inset-inline-end:10px!important;z-index:100002!important;width:42px!important;height:42px!important;border-radius:50%!important;background:rgba(0,0,0,.56)!important;color:#fff!important;display:grid!important;place-items:center!important;font-size:28px!important;line-height:1!important}
.wpm-shared-media button{aspect-ratio:1;border:0;padding:0;border-radius:10px;overflow:hidden;background:var(--wpm-input);display:grid;place-items:center;cursor:pointer;position:relative}
.wpm-shared-media button:hover{outline:2px solid color-mix(in srgb,var(--wpm-accent) 35%,transparent)}
.wpm-shared-media button img{width:100%;height:100%;object-fit:cover}
.wpm-space-avatar-edit{display:flex;align-items:center;gap:14px;margin:8px 0 16px;padding:12px;border-radius:16px;background:var(--wpm-input)}
.wpm-space-avatar-edit .wpm-avatar{flex:0 0 auto}
.wpm-space-avatar-edit .wpm-file-label{margin:0!important;width:auto!important}
.wpm-right{min-height:0!important;overflow-y:auto!important;overscroll-behavior:contain}
@media (min-width:1180px){
  .wpm-shell,.wpm-root.wpm-details-open .wpm-shell{grid-template-columns:340px minmax(0,1fr) 410px!important;height:min(90vh,940px)!important;min-height:680px!important}
  .wpm-root[dir="rtl"] .wpm-shell,.wpm-root[dir="rtl"].wpm-details-open .wpm-shell{grid-template-columns:340px minmax(0,1fr) 410px!important}
  .wpm-root[dir="rtl"] .wpm-sidebar,.wpm-root[dir="rtl"].wpm-details-open .wpm-sidebar{grid-column:3!important;grid-row:1!important}
  .wpm-root[dir="rtl"] .wpm-chat,.wpm-root[dir="rtl"].wpm-details-open .wpm-chat{grid-column:2!important;grid-row:1!important}
  .wpm-root[dir="rtl"] .wpm-right,.wpm-root[dir="rtl"].wpm-details-open .wpm-right{grid-column:1!important;grid-row:1!important}
  .wpm-root:not([dir="rtl"]) .wpm-sidebar{grid-column:1!important}.wpm-root:not([dir="rtl"]) .wpm-chat{grid-column:2!important}.wpm-root:not([dir="rtl"]) .wpm-right{grid-column:3!important}
  .wpm-right{display:block!important;position:relative!important;inset:auto!important;width:auto!important;transform:none!important;box-shadow:none!important}
}
@media (max-width:1179px){
  .wpm-shell,.wpm-root[dir="rtl"] .wpm-shell{min-height:100dvh!important;height:100dvh!important}
  .wpm-chat-live{height:100dvh!important;grid-template-rows:66px minmax(0,1fr) auto auto!important}
  .wpm-messages{padding-bottom:18px!important}
  .wpm-message-image,.wpm-video-trigger video{max-width:78vw!important;max-height:52vh!important}
  .wpm-msg-actions-sheet{position:absolute!important;min-width:150px!important}
  .wpm-media-modal{padding:0!important;align-items:center!important}
  .wpm-media-modal .wpm-modal-card{width:100vw!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important;padding:max(58px,env(safe-area-inset-top)) 10px max(16px,env(safe-area-inset-bottom))!important;display:grid;place-items:center}
  .wpm-media-modal .wpm-media-viewer{max-height:calc(100dvh - 90px);width:100%;display:grid;place-items:center}
  .wpm-media-modal .wpm-media-viewer img,.wpm-media-modal .wpm-media-viewer video{max-height:calc(100dvh - 120px)!important;max-width:96vw!important}
  .wpm-media-close{top:max(10px,env(safe-area-inset-top))!important}
}

/* v0.5.3 interaction layer */
.wpm-chat-live{grid-template-rows:68px auto minmax(0,1fr) auto auto auto!important}
.wpm-selection-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 12px;background:#fff;border-bottom:1px solid var(--wpm-border);z-index:16;min-height:48px}
.wpm-selection-bar.is-hidden{display:none!important}.wpm-selection-bar>button{border:0;background:transparent;font-size:24px;cursor:pointer}.wpm-selection-bar>div{display:flex;gap:8px}.wpm-selection-bar>div button{border:0;border-radius:10px;padding:8px 12px;background:#edf5ff;color:var(--wpm-accent);font-weight:700;cursor:pointer}.wpm-selection-bar>div button.danger{background:#fff0f1;color:#d83d4d}
.wpm-reply-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 14px;background:#f8fbff;border-top:1px solid var(--wpm-border);border-inline-start:3px solid var(--wpm-accent);min-height:52px}.wpm-reply-bar.is-hidden{display:none!important}.wpm-reply-bar>div{display:grid;min-width:0}.wpm-reply-bar strong{font-size:12px;color:var(--wpm-accent)}.wpm-reply-bar span{font-size:12px;color:var(--wpm-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wpm-reply-bar button{border:0;background:transparent;font-size:22px;color:var(--wpm-muted);cursor:pointer}
.wpm-date-separator{position:sticky;top:8px;z-index:8;display:flex;justify-content:center;margin:14px 0 8px;pointer-events:none}.wpm-date-separator span{background:rgba(91,113,136,.78);backdrop-filter:blur(10px);color:#fff;border-radius:999px;padding:5px 11px;font-size:11px;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.wpm-select-dot{display:none;width:26px;height:26px;border-radius:50%;border:2px solid #aab9c8;background:#fff;color:#fff;align-self:center;cursor:pointer;flex:none}.wpm-selection-mode .wpm-select-dot,.wpm-message-row.is-selected .wpm-select-dot{display:grid;place-items:center}.wpm-message-row.is-selected .wpm-select-dot{background:var(--wpm-accent);border-color:var(--wpm-accent)}.wpm-message-row.is-selected{background:color-mix(in srgb,var(--wpm-accent) 12%,transparent);border-radius:16px;padding-block:3px}.wpm-message-row.is-selected .wpm-message{box-shadow:0 0 0 2px color-mix(in srgb,var(--wpm-accent) 45%,transparent)}
.wpm-reply-preview{display:grid;width:100%;text-align:start;border:0;border-inline-start:3px solid var(--wpm-accent);background:color-mix(in srgb,var(--wpm-accent) 8%,transparent);padding:7px 9px;border-radius:8px;margin-bottom:7px;cursor:pointer}.wpm-reply-preview strong{font-size:11px;color:var(--wpm-accent)}.wpm-reply-preview span{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--wpm-muted)}
.wpm-reactions{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.wpm-reaction{display:inline-flex;align-items:center;gap:4px;border:1px solid #dbe5ef;background:#f8fbfd;border-radius:999px;padding:3px 7px;cursor:pointer;font-size:13px}.wpm-reaction.mine{border-color:var(--wpm-accent);background:color-mix(in srgb,var(--wpm-accent) 12%,#fff)}.wpm-reaction b{font-size:10px;color:var(--wpm-muted)}
.wpm-action-react{padding:7px 10px;border-bottom:1px solid #eef2f6}.wpm-action-react>span{display:block;font-size:11px;color:var(--wpm-muted);margin-bottom:6px}.wpm-reaction-picker{display:flex;gap:3px;direction:ltr}.wpm-reaction-picker button{border:0!important;background:transparent!important;padding:4px!important;font-size:18px;line-height:1;border-radius:8px!important}.wpm-reaction-picker button:hover{background:#eef5fb!important}
.wpm-msg-actions-sheet{max-height:min(360px,70vh);overflow:auto}
.wpm-flash .wpm-message{animation:wpmFlash 1.1s ease}@keyframes wpmFlash{0%,100%{box-shadow:0 2px 5px rgba(26,55,82,.09)}40%{box-shadow:0 0 0 4px color-mix(in srgb,var(--wpm-accent) 35%,transparent)}}
.wpm-gallery-nav{display:flex;align-items:center;justify-content:center;gap:16px;color:#fff;margin-top:6px}.wpm-gallery-nav button{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.12);color:#fff;font-size:28px;cursor:pointer}.wpm-gallery-nav span{min-width:60px;text-align:center}.wpm-media-stage{display:grid;place-items:center;min-height:120px}.wpm-media-stage img,.wpm-media-stage video{max-height:76vh!important}
@media (max-width:880px){
 .wpm-chat-live{grid-template-rows:66px auto minmax(0,1fr) auto auto auto!important}
 .wpm-selection-bar{position:relative;z-index:20;padding-inline:10px}.wpm-selection-bar strong{font-size:13px}.wpm-selection-bar>div button{padding:7px 9px}
 .wpm-date-separator{top:6px;margin:10px 0 7px}.wpm-date-separator span{font-size:10px}
 .wpm-msg-actions-sheet{position:fixed!important;inset:auto 8px max(10px,env(safe-area-inset-bottom)) 8px!important;min-width:0!important;border-radius:20px!important;padding:8px;z-index:250!important;box-shadow:0 -10px 40px rgba(20,40,60,.2)}
 .wpm-msg-actions-sheet>button{border-radius:12px}.wpm-action-react{padding:8px 10px}.wpm-reaction-picker{justify-content:space-between}.wpm-reaction-picker button{font-size:22px!important}
 .wpm-select-dot{position:absolute;inset-inline-start:2px;top:50%;transform:translateY(-50%);z-index:3}.wpm-message-row{position:relative}.wpm-selection-mode .wpm-message-row{padding-inline-start:34px}
 .wpm-reply-bar{padding:7px 10px;min-height:48px}
 .wpm-gallery-nav{position:absolute;left:0;right:0;bottom:max(16px,env(safe-area-inset-bottom));pointer-events:none}.wpm-gallery-nav button{pointer-events:auto;background:rgba(10,18,28,.55)}
}

/* v0.6.0 realtime, pagination, typing and read receipts */
.wpm-delivery{display:inline-flex;align-items:center;margin-inline-start:4px;font-size:11px;letter-spacing:-2px;color:#8595a7;font-weight:800;vertical-align:middle}
.wpm-delivery.seen{color:var(--wpm-accent)}
.wpm-chat-person small{transition:color .15s ease}
.wpm-chat-person small:has(+ *){color:var(--wpm-muted)}
.wpm-messages.is-loading-older::before{content:'';position:sticky;top:48px;z-index:15;display:block;width:26px;height:26px;margin:8px auto;border:3px solid rgba(42,171,238,.18);border-top-color:var(--wpm-accent);border-radius:50%;animation:wpmSpin .7s linear infinite}
@keyframes wpmSpin{to{transform:rotate(360deg)}}
@media(max-width:880px){.wpm-delivery{font-size:10px}.wpm-msg-foot{gap:4px}}

/* v0.6.1 mobile-first stabilization */
@media (max-width: 880px){
  html:has(.wpm-root){overflow-x:hidden}
  .wpm-root{width:100%!important;max-width:none!important;margin:0!important;border-radius:0!important;min-height:100dvh!important;background:#fff!important;box-shadow:none!important;overflow:hidden!important}
  .wpm-root,.wpm-root *{box-sizing:border-box!important}
  .wpm-root button,.wpm-root input,.wpm-root textarea,.wpm-root select{-webkit-appearance:none!important;appearance:none!important;font-family:inherit!important}
  .wpm-shell,.wpm-root[dir="rtl"] .wpm-shell{height:100dvh!important;min-height:100dvh!important;width:100%!important;background:#fff!important;overflow:hidden!important}
  .wpm-sidebar{height:100dvh!important;min-height:0!important;padding:0 0 calc(74px + env(safe-area-inset-bottom))!important;position:relative!important;overflow:hidden!important;background:#fff!important;border:0!important;display:flex!important;flex-direction:column!important}
  .wpm-sidebar-head{height:64px!important;min-height:64px!important;padding:calc(env(safe-area-inset-top) * .18) 14px 0!important;display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px!important;align-items:center!important;gap:10px!important;border:0!important;background:#fff!important}
  .wpm-sidebar-head .wpm-icon-btn{width:42px!important;height:42px!important;border:0!important;background:transparent!important;border-radius:50%!important;padding:0!important;color:#1d2b39!important}
  .wpm-sidebar-head .wpm-icon-btn:active{background:#eef4f9!important}
  .wpm-app-title{font-size:20px!important;line-height:1!important;text-align:center!important;font-weight:800!important;color:#142131!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .wpm-global-search{padding:8px 16px 10px!important;position:relative!important;background:#fff!important}
  .wpm-global-search .wpm-search-icon{display:block!important;position:absolute!important;inset-inline-start:30px!important;top:21px!important;z-index:2!important;color:#7b8794!important;pointer-events:none!important}
  .wpm-global-search input{height:48px!important;min-height:48px!important;border:1px solid #edf1f5!important;border-radius:16px!important;background:#f3f6f9!important;color:#17212b!important;padding:0 45px 0 16px!important;font-size:14px!important;box-shadow:none!important;outline:none!important}
  .wpm-root[dir="rtl"] .wpm-global-search input{padding:0 45px 0 16px!important}
  .wpm-global-search input:focus{background:#fff!important;border-color:color-mix(in srgb,var(--wpm-accent) 42%,#dfe8f1)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--wpm-accent) 11%,transparent)!important}
  .wpm-list-tabs{display:flex!important;flex-wrap:nowrap!important;gap:7px!important;padding:2px 16px 12px!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none!important;background:#fff!important;border:0!important}
  .wpm-list-tabs::-webkit-scrollbar{display:none!important}
  .wpm-list-tabs button{flex:0 0 auto!important;min-width:auto!important;width:auto!important;height:36px!important;margin:0!important;padding:0 15px!important;border:1px solid #e7edf4!important;border-radius:18px!important;background:#f4f7fa!important;color:#667383!important;font-size:12px!important;line-height:34px!important;font-weight:700!important;box-shadow:none!important;outline:0!important;text-transform:none!important}
  .wpm-list-tabs button.active{background:var(--wpm-accent)!important;border-color:var(--wpm-accent)!important;color:#fff!important;box-shadow:0 5px 14px color-mix(in srgb,var(--wpm-accent) 18%,transparent)!important}
  .wpm-conversations{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important;padding:0 8px 12px!important;background:#fff!important}
  .wpm-list-section{padding:10px 12px 6px!important;color:#5c6875!important;font-size:12px!important;font-weight:800!important;background:#fff!important}
  .wpm-conv{width:100%!important;min-height:72px!important;margin:0 0 4px!important;padding:9px 10px!important;border:0!important;border-radius:16px!important;background:#fff!important;display:grid!important;grid-template-columns:54px minmax(0,1fr) auto!important;gap:11px!important;align-items:center!important;color:#17212b!important;text-align:start!important;box-shadow:none!important}
  .wpm-conv:active,.wpm-conv.active{background:#eaf4ff!important}
  .wpm-conv .wpm-avatar.small{width:54px!important;height:54px!important;border-radius:50%!important}
  .wpm-conv-main{min-width:0!important;gap:4px!important}
  .wpm-conv-main strong{font-size:15px!important;font-weight:800!important;color:#17212b!important;line-height:1.35!important}
  .wpm-conv-main small{font-size:12px!important;line-height:1.35!important;color:#74808b!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .wpm-conv-meta{min-width:54px!important;align-items:flex-end!important;gap:5px!important}
  .wpm-conv-meta time{font-size:10px!important;color:#8793a0!important;white-space:nowrap!important}
  .wpm-conv-meta b{min-width:20px!important;height:20px!important;padding:0 6px!important;border-radius:10px!important;background:var(--wpm-accent)!important;color:#fff!important;font-size:10px!important}
  .wpm-mobile-nav{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;position:absolute!important;z-index:40!important;left:0!important;right:0!important;bottom:0!important;height:calc(66px + env(safe-area-inset-bottom))!important;padding:5px 6px max(5px,env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.96)!important;border-top:1px solid #e6ecf2!important;box-shadow:0 -8px 24px rgba(32,55,77,.05)!important;backdrop-filter:blur(16px)!important}
  .wpm-mobile-nav button{height:54px!important;min-width:0!important;margin:0!important;padding:5px 2px!important;border:0!important;border-radius:12px!important;background:transparent!important;color:#7a8793!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:2px!important;font-size:10px!important;font-weight:700!important;line-height:1.15!important;box-shadow:none!important}
  .wpm-mobile-nav button.active{color:var(--wpm-accent)!important;background:color-mix(in srgb,var(--wpm-accent) 8%,transparent)!important}
  .wpm-mobile-nav .wpm-svg{width:21px!important;height:21px!important}
  .wpm-mobile-chat .wpm-sidebar{display:none!important}
  .wpm-mobile-chat .wpm-chat{display:block!important;height:100dvh!important;min-height:0!important;overflow:hidden!important;background:#eaf3fb!important}
  .wpm-chat-live{height:100dvh!important;min-height:0!important;display:grid!important;grid-template-rows:64px auto minmax(0,1fr) auto auto auto!important;overflow:hidden!important;background:#eaf3fb!important}
  .wpm-chat-head{height:64px!important;min-height:64px!important;padding:0 8px!important;background:#fff!important;border-bottom:1px solid #e5ebf1!important;position:relative!important;z-index:30!important}
  .wpm-chat-head-main{min-width:0!important;flex:1!important}
  .wpm-chat-person{min-width:0!important;max-width:calc(100vw - 150px)!important;gap:9px!important;padding:0!important}
  .wpm-chat-person strong{font-size:14px!important;font-weight:800!important}.wpm-chat-person small{font-size:10px!important;color:#788694!important}
  .wpm-chat-person .wpm-avatar{width:40px!important;height:40px!important}
  .wpm-chat-head-actions{display:flex!important;align-items:center!important;gap:2px!important}.wpm-chat-head-actions .wpm-icon-btn,.wpm-chat-back{width:38px!important;height:38px!important;border:0!important;background:transparent!important;border-radius:50%!important;padding:0!important}
  .wpm-messages{min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior-y:contain!important;-webkit-overflow-scrolling:touch!important;padding:12px 8px 18px!important;scroll-padding-bottom:18px!important;background:linear-gradient(180deg,#e8f2fb 0%,#edf5fb 100%)!important}
  .wpm-message-row{margin:6px 0!important}.wpm-message{max-width:88%!important;padding:9px 11px 6px!important;border-radius:17px!important;font-size:13px!important;line-height:1.65!important;box-shadow:0 1px 3px rgba(31,57,82,.08)!important;overflow:visible!important}
  .wpm-message-row.mine .wpm-message{background:#e3f7d8!important;border-end-end-radius:6px!important}.wpm-message-row.theirs .wpm-message{background:#fff!important;border-end-start-radius:6px!important}
  .wpm-message-image,.wpm-video-trigger video{max-width:min(76vw,420px)!important;max-height:48vh!important;border-radius:14px!important;object-fit:contain!important}
  .wpm-msg-actions-sheet{z-index:1000!important}
  .wpm-composer{position:relative!important;z-index:35!important;min-height:62px!important;padding:7px 7px max(7px,env(safe-area-inset-bottom))!important;gap:3px!important;background:#fff!important;border-top:1px solid #e5ebf1!important;display:flex!important;align-items:flex-end!important}
  .wpm-composer textarea{min-height:44px!important;max-height:120px!important;flex:1 1 auto!important;border:1px solid #e6edf3!important;border-radius:22px!important;background:#f4f7fa!important;color:#17212b!important;padding:11px 13px!important;font-size:13px!important;line-height:1.45!important;resize:none!important;box-shadow:none!important}
  .wpm-composer .wpm-icon-btn{width:38px!important;height:44px!important;min-width:38px!important;margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#314255!important;box-shadow:none!important}
  .wpm-send{width:44px!important;height:44px!important;min-width:44px!important;margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:var(--wpm-accent)!important;color:#fff!important;box-shadow:0 5px 16px color-mix(in srgb,var(--wpm-accent) 25%,transparent)!important}
  .wpm-record-status{min-height:38px!important;padding:8px 12px!important;font-size:12px!important}
  .wpm-selection-bar,.wpm-reply-bar{z-index:34!important}
  .wpm-drawer{width:min(86vw,340px)!important;max-width:340px!important;z-index:900!important}.wpm-drawer-backdrop{z-index:899!important}
  .wpm-modal{z-index:1200!important}
  .wpm-media-modal{z-index:1300!important}
  .wpm-toast{z-index:1500!important;bottom:calc(78px + env(safe-area-inset-bottom))!important;max-width:calc(100vw - 24px)!important}
}
@media (max-width:380px){
  .wpm-list-tabs button{padding-inline:12px!important;font-size:11px!important}
  .wpm-conv{grid-template-columns:50px minmax(0,1fr) auto!important}.wpm-conv .wpm-avatar.small{width:50px!important;height:50px!important}
  .wpm-conv-main strong{font-size:14px!important}.wpm-conv-main small{font-size:11px!important}
  .wpm-composer .wpm-icon-btn{width:34px!important;min-width:34px!important}.wpm-send{width:42px!important;min-width:42px!important}
}

/* v0.6.2 — hard mobile isolation and app-shell reset */
@media (max-width: 880px) {
  html:has(#wpm-app), body:has(#wpm-app) { overflow: hidden !important; overscroll-behavior: none !important; }
  #wpm-app.wpm-root {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147482000 !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
    box-shadow: none !important;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,Arial,sans-serif !important;
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
  }
  #wpm-app *, #wpm-app *::before, #wpm-app *::after { box-sizing: border-box !important; }
  #wpm-app button, #wpm-app input, #wpm-app textarea, #wpm-app select { font: inherit !important; letter-spacing: normal !important; }
  #wpm-app button { -webkit-appearance: none !important; appearance: none !important; text-transform: none !important; }

  #wpm-app .wpm-shell,
  #wpm-app[dir="rtl"] .wpm-shell,
  #wpm-app.wpm-details-open .wpm-shell,
  #wpm-app[dir="rtl"].wpm-details-open .wpm-shell {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
  }
  #wpm-app .wpm-sidebar {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 0 calc(70px + env(safe-area-inset-bottom)) !important;
    border: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
    box-shadow: none !important;
  }
  #wpm-app .wpm-sidebar-head {
    flex: 0 0 auto !important;
    height: calc(62px + env(safe-area-inset-top)) !important;
    min-height: calc(62px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 12px 0 !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0,1fr) 44px !important;
    align-items: center !important;
    gap: 8px !important;
    background: #fff !important;
    border: 0 !important;
  }
  #wpm-app .wpm-sidebar-head > button {
    all: unset !important;
    box-sizing: border-box !important;
    width: 42px !important;
    height: 42px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    color: #263746 !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
  }
  #wpm-app .wpm-sidebar-head > button:active { background: #eef4f8 !important; }
  #wpm-app .wpm-app-title {
    min-width: 0 !important;
    margin: 0 !important;
    text-align: center !important;
    color: #17212b !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  #wpm-app .wpm-global-search {
    flex: 0 0 auto !important;
    position: relative !important;
    display: block !important;
    padding: 8px 14px 9px !important;
    margin: 0 !important;
    background: #fff !important;
  }
  #wpm-app .wpm-global-search .wpm-search-icon {
    position: absolute !important;
    z-index: 2 !important;
    top: 21px !important;
    inset-inline-start: 29px !important;
    display: grid !important;
    place-items: center !important;
    color: #718090 !important;
    pointer-events: none !important;
  }
  #wpm-app .wpm-global-search input {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: block !important;
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 44px !important;
    border: 1px solid #edf1f5 !important;
    border-radius: 17px !important;
    outline: 0 !important;
    background: #f3f6f9 !important;
    color: #17212b !important;
    box-shadow: none !important;
    font-size: 14px !important;
    line-height: 46px !important;
  }
  #wpm-app .wpm-global-search input:focus {
    border-color: rgba(42,171,238,.42) !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(42,171,238,.10) !important;
  }
  #wpm-app .wpm-list-tabs {
    flex: 0 0 auto !important;
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 3px 14px 10px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    background: #fff !important;
    border: 0 !important;
    scrollbar-width: none !important;
  }
  #wpm-app .wpm-list-tabs::-webkit-scrollbar { display: none !important; }
  #wpm-app .wpm-list-tabs > button {
    all: unset !important;
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 34px !important;
    min-width: 60px !important;
    padding: 0 14px !important;
    margin: 0 !important;
    border: 1px solid #e4ebf2 !important;
    border-radius: 999px !important;
    background: #f5f7fa !important;
    color: #657383 !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
  }
  #wpm-app .wpm-list-tabs > button.active {
    border-color: var(--wpm-accent) !important;
    background: var(--wpm-accent) !important;
    color: #fff !important;
    box-shadow: 0 5px 15px rgba(42,171,238,.18) !important;
  }
  #wpm-app .wpm-conversations {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    width: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 8px 12px !important;
    background: #fff !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
  }
  #wpm-app .wpm-list-section {
    margin: 0 !important;
    padding: 8px 12px 5px !important;
    background: #fff !important;
    color: #71808e !important;
    font-size: 12px !important;
    font-weight: 800 !important;
  }
  #wpm-app .wpm-conv {
    all: unset !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 72px !important;
    margin: 0 0 3px !important;
    padding: 9px 10px !important;
    display: grid !important;
    grid-template-columns: 54px minmax(0,1fr) auto !important;
    align-items: center !important;
    gap: 11px !important;
    border-radius: 16px !important;
    background: #fff !important;
    color: #17212b !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
  }
  #wpm-app .wpm-conv.active, #wpm-app .wpm-conv:active { background: #eaf4ff !important; }
  #wpm-app .wpm-conv .wpm-avatar.small { width: 54px !important; height: 54px !important; border-radius: 50% !important; }
  #wpm-app .wpm-conv-main { min-width: 0 !important; display: flex !important; flex-direction: column !important; gap: 4px !important; }
  #wpm-app .wpm-conv-main strong { color: #17212b !important; font-size: 15px !important; font-weight: 800 !important; line-height: 1.35 !important; }
  #wpm-app .wpm-conv-main small { color: #74808b !important; font-size: 12px !important; line-height: 1.35 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  #wpm-app .wpm-conv-meta { min-width: 50px !important; display: flex !important; flex-direction: column !important; align-items: flex-end !important; gap: 5px !important; }
  #wpm-app .wpm-conv-meta time { color: #8895a1 !important; font-size: 10px !important; white-space: nowrap !important; }
  #wpm-app .wpm-conv-meta b { display: inline-grid !important; place-items: center !important; min-width: 20px !important; height: 20px !important; padding: 0 6px !important; border-radius: 10px !important; background: var(--wpm-accent) !important; color: #fff !important; font-size: 10px !important; }

  #wpm-app .wpm-mobile-nav {
    position: absolute !important;
    z-index: 80 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    width: 100% !important;
    height: calc(66px + env(safe-area-inset-bottom)) !important;
    margin: 0 !important;
    padding: 5px 7px max(5px,env(safe-area-inset-bottom)) !important;
    border: 0 !important;
    border-top: 1px solid #e5ebf1 !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: 0 -8px 24px rgba(29,51,73,.05) !important;
    backdrop-filter: blur(16px) !important;
  }
  #wpm-app .wpm-mobile-nav > button {
    all: unset !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    height: 54px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    border-radius: 13px !important;
    color: #788694 !important;
    font-size: 10px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
  }
  #wpm-app .wpm-mobile-nav > button.active { color: var(--wpm-accent) !important; background: rgba(42,171,238,.08) !important; }
  #wpm-app .wpm-mobile-nav .wpm-svg { width: 21px !important; height: 21px !important; }

  #wpm-app.wpm-mobile-chat .wpm-sidebar { display: none !important; }
  #wpm-app .wpm-chat { position: absolute !important; inset: 0 !important; display: none !important; height: 100% !important; min-height: 0 !important; overflow: hidden !important; background: #eaf3fb !important; }
  #wpm-app.wpm-mobile-chat .wpm-chat { display: block !important; }
  #wpm-app .wpm-chat-live {
    position: absolute !important;
    inset: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-rows: calc(62px + env(safe-area-inset-top)) auto minmax(0,1fr) auto auto auto !important;
    overflow: hidden !important;
    background: #eaf3fb !important;
  }
  #wpm-app .wpm-chat-head {
    height: calc(62px + env(safe-area-inset-top)) !important;
    min-height: calc(62px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 7px 0 !important;
    display: flex !important;
    align-items: center !important;
    background: #fff !important;
    border: 0 !important;
    border-bottom: 1px solid #e5ebf1 !important;
    z-index: 40 !important;
  }
  #wpm-app .wpm-chat-head button { -webkit-appearance: none !important; appearance: none !important; }
  #wpm-app .wpm-chat-back, #wpm-app .wpm-chat-head-actions .wpm-icon-btn {
    all: unset !important;
    box-sizing: border-box !important;
    width: 38px !important;
    height: 38px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    color: #263746 !important;
    cursor: pointer !important;
  }
  #wpm-app .wpm-chat-person { all: unset !important; box-sizing: border-box !important; min-width: 0 !important; flex: 1 1 auto !important; display: flex !important; align-items: center !important; gap: 9px !important; cursor: pointer !important; }
  #wpm-app .wpm-chat-person .wpm-avatar { width: 40px !important; height: 40px !important; flex: 0 0 40px !important; }
  #wpm-app .wpm-chat-person span { min-width: 0 !important; display: flex !important; flex-direction: column !important; }
  #wpm-app .wpm-chat-person strong { color:#17212b!important; font-size:14px!important; font-weight:800!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; }
  #wpm-app .wpm-chat-person small { color:#778693!important; font-size:10px!important; }
  #wpm-app .wpm-chat-head-actions { flex:0 0 auto!important; display:flex!important; align-items:center!important; gap:2px!important; }
  #wpm-app .wpm-messages { min-height:0!important; height:auto!important; overflow-y:auto!important; overflow-x:hidden!important; padding:12px 8px 20px!important; -webkit-overflow-scrolling:touch!important; overscroll-behavior-y:contain!important; background:linear-gradient(180deg,#e9f3fb,#edf5fb)!important; }
  #wpm-app .wpm-message { max-width:88%!important; font-size:13px!important; border-radius:17px!important; }
  #wpm-app .wpm-composer { flex:0 0 auto!important; min-height:62px!important; display:flex!important; align-items:flex-end!important; gap:3px!important; padding:7px 7px max(7px,env(safe-area-inset-bottom))!important; background:#fff!important; border-top:1px solid #e5ebf1!important; z-index:45!important; }
  #wpm-app .wpm-composer textarea { -webkit-appearance:none!important; appearance:none!important; flex:1 1 auto!important; min-width:0!important; min-height:44px!important; max-height:120px!important; margin:0!important; padding:11px 13px!important; border:1px solid #e6edf3!important; border-radius:22px!important; background:#f4f7fa!important; color:#17212b!important; box-shadow:none!important; resize:none!important; font-size:13px!important; }
  #wpm-app .wpm-composer .wpm-icon-btn { all:unset!important; box-sizing:border-box!important; flex:0 0 38px!important; width:38px!important; height:44px!important; display:grid!important; place-items:center!important; border-radius:50%!important; color:#314255!important; cursor:pointer!important; }
  #wpm-app .wpm-send { all:unset!important; box-sizing:border-box!important; flex:0 0 44px!important; width:44px!important; height:44px!important; display:grid!important; place-items:center!important; border-radius:50%!important; background:var(--wpm-accent)!important; color:#fff!important; box-shadow:0 5px 16px rgba(42,171,238,.25)!important; cursor:pointer!important; }

  #wpm-app .wpm-drawer-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147482100 !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    background: rgba(12,25,38,.44) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity .2s ease,visibility .2s ease !important;
  }
  #wpm-app .wpm-drawer-backdrop.wpm-open { opacity:1!important; visibility:visible!important; pointer-events:auto!important; }
  #wpm-app .wpm-drawer {
    position: fixed !important;
    z-index: 2147482200 !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: auto !important;
    width: min(86vw,340px) !important;
    max-width: 340px !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    background: #fff !important;
    color: #17212b !important;
    box-shadow: 18px 0 48px rgba(17,36,54,.22) !important;
    transform: translate3d(-105%,0,0) !important;
    transition: transform .22s ease !important;
  }
  #wpm-app[dir="rtl"] .wpm-drawer { left:auto!important; right:0!important; transform:translate3d(105%,0,0)!important; box-shadow:-18px 0 48px rgba(17,36,54,.22)!important; }
  #wpm-app .wpm-drawer.wpm-open, #wpm-app[dir="rtl"] .wpm-drawer.wpm-open { transform:translate3d(0,0,0)!important; }
  #wpm-app .wpm-drawer-profile { padding:calc(26px + env(safe-area-inset-top)) 20px 20px!important; background:linear-gradient(150deg,rgba(42,171,238,.12),#fff 58%)!important; border-bottom:1px solid #e6edf3!important; }
  #wpm-app .wpm-drawer-nav { display:grid!important; gap:2px!important; padding:9px 10px max(16px,env(safe-area-inset-bottom))!important; }
  #wpm-app .wpm-drawer-nav > button, #wpm-app .wpm-drawer-nav > a {
    all:unset!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:50px!important;
    display:flex!important;
    align-items:center!important;
    gap:14px!important;
    padding:0 14px!important;
    border-radius:13px!important;
    color:#17212b!important;
    cursor:pointer!important;
    text-decoration:none!important;
  }
  #wpm-app .wpm-drawer-nav > button:active, #wpm-app .wpm-drawer-nav > a:active { background:#f0f5f9!important; }
  #wpm-app .wpm-drawer-logout { color:#d4394d!important; }

  #wpm-app .wpm-toast { position:fixed!important; z-index:2147483000!important; bottom:calc(82px + env(safe-area-inset-bottom))!important; left:50%!important; right:auto!important; transform:translateX(-50%)!important; max-width:calc(100vw - 28px)!important; border-radius:18px!important; }
}
@media (max-width: 380px) {
  #wpm-app .wpm-list-tabs > button { min-width:54px!important; padding-inline:12px!important; font-size:11px!important; }
  #wpm-app .wpm-conv { grid-template-columns:50px minmax(0,1fr) auto!important; gap:9px!important; }
  #wpm-app .wpm-conv .wpm-avatar.small { width:50px!important; height:50px!important; }
  #wpm-app .wpm-composer .wpm-icon-btn { flex-basis:34px!important; width:34px!important; }
}
@media (max-width:880px){html.wpm-app-page,body.wpm-app-page{overflow:hidden!important;overscroll-behavior:none!important;width:100%!important;height:100%!important}}

/* v0.6.3 authentication / settings / mobile-drawer hardening */
.wpm-auth-prompt{font-size:14px;line-height:1.8;margin-bottom:18px}
.wpm-settings-item{appearance:none;-webkit-appearance:none;width:100%;display:grid;grid-template-columns:36px minmax(0,1fr) 22px;align-items:center;gap:10px;padding:13px 12px;border:1px solid var(--wpm-border);border-radius:15px;background:var(--wpm-input);color:var(--wpm-text);text-align:start;cursor:pointer;box-shadow:none}
.wpm-settings-item>span:nth-child(2){display:flex;flex-direction:column;gap:3px;min-width:0}.wpm-settings-item strong{font-size:14px}.wpm-settings-item small{color:var(--wpm-muted);font-size:11px;line-height:1.5}.wpm-settings-item>span:last-child{font-size:24px;color:var(--wpm-muted)}
.wpm-settings-panel{padding-top:8px}.wpm-inline-error{margin-top:10px;padding:10px 12px;border-radius:12px;background:#fff0f1;color:#b42336}
.wpm-drawer-close{position:absolute;z-index:3;top:calc(10px + env(safe-area-inset-top));inset-inline-end:10px;width:38px;height:38px;border:0;border-radius:50%;background:rgba(255,255,255,.86);color:#263746;font-size:25px;line-height:1;display:grid;place-items:center;cursor:pointer}
@media(max-width:880px){
  #wpm-app .wpm-sidebar-head{position:relative!important;z-index:3!important;flex:0 0 auto!important}
  #wpm-app .wpm-global-search{flex:0 0 auto!important}
  #wpm-app .wpm-list-tabs{flex:0 0 auto!important}
  #wpm-app .wpm-conversations{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;padding-bottom:12px!important}
  #wpm-app .wpm-menu-btn,#wpm-app .wpm-new-btn{appearance:none!important;-webkit-appearance:none!important;border:0!important;background:transparent!important;box-shadow:none!important}
  #wpm-app .wpm-drawer{visibility:hidden!important;pointer-events:none!important}
  #wpm-app .wpm-drawer.wpm-open{visibility:visible!important;pointer-events:auto!important}
  #wpm-app .wpm-drawer-profile{position:relative!important;padding-top:calc(64px + env(safe-area-inset-top))!important}
  #wpm-app .wpm-drawer-nav>button,#wpm-app .wpm-drawer-nav>a{font-size:14px!important;font-weight:650!important}
  #wpm-app .wpm-modal-card .wpm-settings-item{display:grid!important}
}

/* v0.6.4 channel media, voice player, mobile composer and dark-mode fixes */
.wpm-voice-player{display:flex;align-items:center;gap:10px;min-width:260px;max-width:100%;padding:4px 2px}
.wpm-voice-play{appearance:none;-webkit-appearance:none;border:0;width:44px;height:44px;flex:0 0 44px;border-radius:50%;display:grid;place-items:center;background:var(--wpm-accent);color:#fff;cursor:pointer;box-shadow:0 5px 14px rgba(42,171,238,.22)}
.wpm-voice-play .wpm-svg{width:19px;height:19px;margin-inline-start:2px}.wpm-voice-player.is-playing .wpm-voice-play .wpm-svg{margin-inline-start:0}
.wpm-voice-body{min-width:0;flex:1 1 auto;display:grid;gap:3px}.wpm-voice-wave{height:31px;position:relative;display:flex;align-items:center;overflow:hidden}.wpm-voice-bars,.wpm-voice-progress-bars{position:absolute;inset:0;display:flex;align-items:center;gap:2px;pointer-events:none}.wpm-voice-bars i,.wpm-voice-progress-bars i{display:block;flex:1 1 2px;max-width:3px;height:var(--h);min-height:4px;border-radius:3px;background:#9cafbf}.wpm-voice-progress-bars{clip-path:inset(0 100% 0 0)}.wpm-voice-progress-bars i{background:var(--wpm-accent)}.wpm-voice-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.wpm-voice-meta{display:flex;align-items:center;justify-content:space-between;color:var(--wpm-muted);font-size:10px;line-height:1}.wpm-voice-audio{display:none!important}
.wpm-video-player{position:relative;width:100%;overflow:hidden;border-radius:15px;background:#0d1117}.wpm-message-video{display:block;width:100%;max-width:100%;max-height:560px;object-fit:contain;background:#0d1117;border-radius:15px}.wpm-video-expand{position:absolute;inset-inline-end:8px;top:8px;width:34px;height:34px;border:0;border-radius:10px;background:rgba(0,0,0,.5);color:#fff;display:grid;place-items:center;cursor:pointer;z-index:2}.wpm-send-media-preview{margin:8px 0 14px;display:grid;place-items:center;background:#eef3f7;border-radius:16px;overflow:hidden}.wpm-send-media-preview img,.wpm-send-media-preview video{display:block;max-width:100%;max-height:54vh;object-fit:contain}.wpm-send-media-preview+label{margin-top:12px!important}

@media (max-width:880px){
  /* Make channel media posts behave like channel posts, not chat bubbles. */
  #wpm-app.wpm-channel-view .wpm-message-row.wpm-type-image,
  #wpm-app.wpm-channel-view .wpm-message-row.wpm-type-video{width:100%!important;justify-content:stretch!important;margin:8px 0!important;padding:0!important}
  #wpm-app.wpm-channel-view .wpm-message-row.wpm-type-image .wpm-message,
  #wpm-app.wpm-channel-view .wpm-message-row.wpm-type-video .wpm-message{width:100%!important;max-width:100%!important;padding:0 0 7px!important;border-radius:18px!important;overflow:visible!important;background:var(--wpm-bubble)!important}
  #wpm-app.wpm-channel-view .wpm-message-row.mine.wpm-type-image .wpm-message,
  #wpm-app.wpm-channel-view .wpm-message-row.mine.wpm-type-video .wpm-message{background:var(--wpm-mine)!important}
  #wpm-app.wpm-channel-view .wpm-type-image .wpm-media-trigger,
  #wpm-app.wpm-channel-view .wpm-type-video .wpm-video-player{width:100%!important;display:block!important}
  #wpm-app.wpm-channel-view .wpm-type-image .wpm-message-image,
  #wpm-app.wpm-channel-view .wpm-type-video .wpm-message-video{width:100%!important;max-width:none!important;max-height:none!important;border-radius:18px 18px 0 0!important;object-fit:cover!important}
  #wpm-app.wpm-channel-view .wpm-type-video .wpm-message-video{aspect-ratio:auto!important;object-fit:contain!important;background:#000!important}
  #wpm-app.wpm-channel-view .wpm-type-image .wpm-msg-caption,
  #wpm-app.wpm-channel-view .wpm-type-video .wpm-msg-caption{padding:10px 12px 2px!important;margin:0!important;font-size:13px!important;line-height:1.75!important}
  #wpm-app.wpm-channel-view .wpm-type-image .wpm-msg-foot,
  #wpm-app.wpm-channel-view .wpm-type-video .wpm-msg-foot{padding-inline:11px!important}
  #wpm-app.wpm-channel-view .wpm-type-image .wpm-msg-more,
  #wpm-app.wpm-channel-view .wpm-type-video .wpm-msg-more{z-index:6!important;background:rgba(255,255,255,.76)!important;backdrop-filter:blur(6px)!important}

  #wpm-app .wpm-voice-player{min-width:min(280px,72vw)!important;padding:4px 1px!important}.wpm-voice-play{width:42px;height:42px;flex-basis:42px}.wpm-voice-wave{height:29px}.wpm-voice-bars,.wpm-voice-progress-bars{gap:1.5px}

  /* Keep the composer actually visible above the Android/iOS browser navigation area. */
  #wpm-app .wpm-chat-live{display:block!important;position:absolute!important;inset:0!important;overflow:hidden!important;padding:0!important}
  #wpm-app .wpm-chat-head{position:absolute!important;left:0!important;right:0!important;top:0!important;z-index:60!important}
  #wpm-app .wpm-messages{position:absolute!important;left:0!important;right:0!important;top:calc(62px + env(safe-area-inset-top))!important;bottom:calc(62px + env(safe-area-inset-bottom))!important;height:auto!important;min-height:0!important;overflow-y:auto!important;padding-bottom:24px!important}
  #wpm-app .wpm-composer{position:absolute!important;left:0!important;right:0!important;bottom:0!important;z-index:70!important;display:flex!important;visibility:visible!important;min-height:62px!important;padding-bottom:max(7px,env(safe-area-inset-bottom))!important;background:var(--wpm-panel)!important}
  #wpm-app .wpm-composer.wpm-readonly{display:flex!important;visibility:visible!important}
  #wpm-app .wpm-selection-bar:not(.is-hidden){position:absolute!important;top:calc(62px + env(safe-area-inset-top))!important;left:0!important;right:0!important;z-index:65!important}
  #wpm-app .wpm-reply-bar:not(.is-hidden),#wpm-app .wpm-record-status:not(.is-hidden){position:absolute!important;left:0!important;right:0!important;bottom:calc(62px + env(safe-area-inset-bottom))!important;z-index:72!important}

  /* Mobile dark mode overrides: previous mobile hardening used light literals. */
  #wpm-app.wpm-theme-dark .wpm-sidebar,
  #wpm-app.wpm-theme-dark .wpm-sidebar-head,
  #wpm-app.wpm-theme-dark .wpm-conversations,
  #wpm-app.wpm-theme-dark .wpm-list-section,
  #wpm-app.wpm-theme-dark .wpm-chat-head,
  #wpm-app.wpm-theme-dark .wpm-composer,
  #wpm-app.wpm-theme-dark .wpm-mobile-nav,
  #wpm-app.wpm-theme-dark .wpm-drawer{background:var(--wpm-panel)!important;color:var(--wpm-text)!important}
  #wpm-app.wpm-theme-dark .wpm-global-search input,
  #wpm-app.wpm-theme-dark .wpm-composer textarea{background:var(--wpm-input)!important;color:var(--wpm-text)!important;border-color:var(--wpm-border)!important}
  #wpm-app.wpm-theme-dark .wpm-list-tabs>button{background:#22303c!important;border-color:#2a3a48!important;color:#cad4dd!important}
  #wpm-app.wpm-theme-dark .wpm-list-tabs>button.active{background:var(--wpm-accent)!important;color:#fff!important;border-color:var(--wpm-accent)!important}
  #wpm-app.wpm-theme-dark .wpm-conv{background:var(--wpm-panel)!important;color:var(--wpm-text)!important}
  #wpm-app.wpm-theme-dark .wpm-conv.active,#wpm-app.wpm-theme-dark .wpm-conv:active{background:#24384a!important}
  #wpm-app.wpm-theme-dark .wpm-conv-main strong,#wpm-app.wpm-theme-dark .wpm-chat-person strong,#wpm-app.wpm-theme-dark .wpm-drawer-nav>button,#wpm-app.wpm-theme-dark .wpm-drawer-nav>a{color:var(--wpm-text)!important}
  #wpm-app.wpm-theme-dark .wpm-conv-main small,#wpm-app.wpm-theme-dark .wpm-conv-meta time,#wpm-app.wpm-theme-dark .wpm-chat-person small{color:var(--wpm-muted)!important}
  #wpm-app.wpm-theme-dark .wpm-messages{background:linear-gradient(180deg,#101820,#121d26)!important}
  #wpm-app.wpm-theme-dark .wpm-drawer-profile{background:linear-gradient(150deg,rgba(42,171,238,.12),var(--wpm-panel) 58%)!important;border-color:var(--wpm-border)!important}
  #wpm-app.wpm-theme-dark .wpm-drawer-close{background:#22303c!important;color:var(--wpm-text)!important}
  #wpm-app.wpm-theme-dark .wpm-mobile-nav{border-color:var(--wpm-border)!important;box-shadow:0 -8px 24px rgba(0,0,0,.18)!important}
}

/* v0.6.5 recording draft, camera, richer attachments, desktop composer hardening */
#wpm-app #wpm-voice.is-recording{background:#ef3340!important;color:#fff!important;border-color:#ef3340!important;box-shadow:0 0 0 5px rgba(239,51,64,.12)!important}
#wpm-app #wpm-voice.is-recording .wpm-svg{stroke-width:2.2}
.wpm-voice-draft-wrap{padding:8px 12px!important;background:var(--wpm-panel)!important;color:var(--wpm-text)!important;border-top:1px solid var(--wpm-border)!important}
.wpm-voice-draft{display:flex;align-items:center;gap:10px;width:100%;max-width:760px;margin:0 auto}.wpm-voice-draft-player{flex:1 1 auto;min-width:0;background:var(--wpm-input);border:1px solid var(--wpm-border);border-radius:18px;padding:7px 10px}.wpm-voice-draft .wpm-voice-player{min-width:0!important;width:100%!important}.wpm-voice-draft-actions{display:flex;align-items:center;gap:7px;flex:0 0 auto}.wpm-voice-draft-actions button{appearance:none;-webkit-appearance:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;cursor:pointer}.wpm-voice-draft-delete{border:1px solid #ffd1d5;background:#fff1f2;color:#d62f3f}.wpm-voice-draft-send{border:1px solid var(--wpm-accent);background:var(--wpm-accent);color:#fff}.wpm-voice-draft-send:disabled{opacity:.55;cursor:wait}
.wpm-camera-btn{color:var(--wpm-accent)!important}.wpm-attach-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.wpm-attach-choice b{display:grid;place-items:center}.wpm-emoji-grid-large{max-height:min(58vh,520px);overflow-y:auto;grid-template-columns:repeat(8,1fr)!important;padding-inline-end:4px}.wpm-emoji-grid-large button{font-size:24px!important}
@media (min-width:881px){
  #wpm-app .wpm-chat{min-height:0!important;overflow:hidden!important;display:block!important}
  #wpm-app .wpm-chat-live:not(.is-hidden){display:grid!important;grid-template-rows:68px auto minmax(0,1fr) auto auto auto!important;height:100%!important;min-height:0!important;overflow:hidden!important}
  #wpm-app .wpm-composer{position:relative!important;inset:auto!important;display:flex!important;visibility:visible!important;opacity:1!important;flex:0 0 auto!important;min-height:64px!important;z-index:80!important;background:var(--wpm-panel)!important;border-top:1px solid var(--wpm-border)!important}
  #wpm-app .wpm-messages{min-height:0!important;overflow-y:auto!important}
  #wpm-app .wpm-record-status:not(.is-hidden),#wpm-app .wpm-reply-bar:not(.is-hidden){position:relative!important;inset:auto!important;z-index:81!important}
}
@media (max-width:880px){
  #wpm-app .wpm-camera-btn{display:grid!important}
  #wpm-app .wpm-voice-draft-wrap{position:absolute!important;left:0!important;right:0!important;bottom:calc(62px + env(safe-area-inset-bottom))!important;z-index:73!important;padding:7px!important}
  #wpm-app .wpm-voice-draft{gap:6px!important}.wpm-voice-draft-player{padding:5px 7px!important}.wpm-voice-draft-actions{gap:4px!important}.wpm-voice-draft-actions button{width:38px!important;height:38px!important}
  #wpm-app .wpm-voice-draft .wpm-voice-play{width:38px!important;height:38px!important;flex-basis:38px!important}.wpm-voice-draft .wpm-voice-wave{height:25px!important}
  #wpm-app .wpm-emoji-grid-large{grid-template-columns:repeat(6,1fr)!important;max-height:64dvh}.wpm-emoji-grid-large button{font-size:25px!important}
  #wpm-app .wpm-attach-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:390px){
  #wpm-app .wpm-composer .wpm-location-direct{display:none!important}
  #wpm-app .wpm-camera-btn{flex-basis:32px!important;width:32px!important}
}

/* v0.6.6 voice draft polish, desktop composer persistence and channel media width */
#wpm-app #wpm-voice.is-recording{
  position:relative!important;background:#fff!important;color:#ef3340!important;
  border:2px solid #ef3340!important;box-shadow:0 0 0 6px rgba(239,51,64,.11)!important;
  animation:wpm-record-pulse 1.25s ease-out infinite!important;
}
#wpm-app #wpm-voice.is-recording .wpm-svg{width:18px!important;height:18px!important;fill:#ef3340!important;stroke:#ef3340!important;stroke-width:1.4!important}
@keyframes wpm-record-pulse{0%{box-shadow:0 0 0 0 rgba(239,51,64,.26)}70%{box-shadow:0 0 0 10px rgba(239,51,64,0)}100%{box-shadow:0 0 0 0 rgba(239,51,64,0)}}
.wpm-voice-draft-wrap{padding:10px 12px!important;background:color-mix(in srgb,var(--wpm-panel) 96%,var(--wpm-accent) 4%)!important}
.wpm-voice-draft-card{width:min(820px,100%);margin:0 auto;padding:10px;border:1px solid var(--wpm-border);border-radius:20px;background:var(--wpm-card);box-shadow:0 8px 28px rgba(24,54,82,.08)}
.wpm-voice-draft-head{display:flex;align-items:center;gap:8px;padding:0 4px 8px;color:var(--wpm-muted);font-size:12px}.wpm-voice-draft-head strong{color:var(--wpm-text);font-size:12px}.wpm-voice-ready-dot{width:8px;height:8px;border-radius:50%;background:#22b573;box-shadow:0 0 0 4px rgba(34,181,115,.12)}
.wpm-voice-draft{display:flex!important;align-items:center!important;gap:12px!important;max-width:none!important}.wpm-voice-draft-player{background:var(--wpm-input)!important;border:1px solid var(--wpm-border)!important;border-radius:16px!important;padding:8px 10px!important}
.wpm-voice-draft-actions{display:flex!important;align-items:center!important;gap:8px!important}.wpm-voice-draft-actions button{width:auto!important;height:42px!important;min-width:42px!important;border-radius:13px!important;padding:0 13px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;font-weight:750!important;font-size:12px!important;line-height:1!important;transition:transform .15s ease,box-shadow .15s ease,background .15s ease!important}.wpm-voice-draft-actions button:active{transform:scale(.97)}
.wpm-voice-draft-delete{border:1px solid #ffd1d7!important;background:#fff6f7!important;color:#cf3142!important}.wpm-voice-draft-delete:hover{background:#ffecef!important}.wpm-voice-draft-send{border:1px solid var(--wpm-accent)!important;background:var(--wpm-accent)!important;color:#fff!important;box-shadow:0 7px 18px color-mix(in srgb,var(--wpm-accent) 28%,transparent)!important}.wpm-voice-draft-send:disabled{opacity:.5!important;box-shadow:none!important}
.wpm-theme-dark .wpm-voice-draft-delete{background:#35242a!important;border-color:#63303a!important;color:#ff94a1!important}

/* Channel image/video posts fill the available channel content width on every viewport. */
#wpm-app.wpm-channel-view .wpm-message-row.wpm-type-image,
#wpm-app.wpm-channel-view .wpm-message-row.wpm-type-video{width:100%!important;max-width:none!important;justify-content:stretch!important;margin:10px 0!important;padding:0!important}
#wpm-app.wpm-channel-view .wpm-message-row.wpm-type-image .wpm-message,
#wpm-app.wpm-channel-view .wpm-message-row.wpm-type-video .wpm-message{width:100%!important;max-width:100%!important;padding:0 0 8px!important;overflow:hidden!important;border-radius:18px!important}
#wpm-app.wpm-channel-view .wpm-type-image .wpm-media-trigger,
#wpm-app.wpm-channel-view .wpm-type-video .wpm-video-player{display:block!important;width:100%!important;max-width:none!important}
#wpm-app.wpm-channel-view .wpm-type-image .wpm-message-image,
#wpm-app.wpm-channel-view .wpm-type-video .wpm-message-video{display:block!important;width:100%!important;max-width:none!important;height:auto!important;max-height:none!important;margin:0!important;border-radius:18px 18px 0 0!important;object-fit:contain!important;background:#0b1015!important}
#wpm-app.wpm-channel-view .wpm-type-image .wpm-message-image{background:transparent!important}
#wpm-app.wpm-channel-view .wpm-type-image .wpm-msg-caption,
#wpm-app.wpm-channel-view .wpm-type-video .wpm-msg-caption{padding:10px 13px 3px!important;margin:0!important;font-size:14px!important;line-height:1.75!important}
#wpm-app.wpm-channel-view .wpm-type-image .wpm-msg-foot,
#wpm-app.wpm-channel-view .wpm-type-video .wpm-msg-foot{padding-inline:12px!important}

/* Desktop chat is a stable flex column: message list scrolls, composer never gets pushed away. */
@media (min-width:881px){
  #wpm-app .wpm-chat{position:relative!important;min-height:0!important;overflow:hidden!important}
  #wpm-app .wpm-chat-live:not(.is-hidden){display:flex!important;flex-direction:column!important;position:relative!important;height:100%!important;min-height:0!important;overflow:hidden!important}
  #wpm-app .wpm-chat-live>.wpm-chat-head{position:relative!important;inset:auto!important;flex:0 0 68px!important;z-index:20!important}
  #wpm-app .wpm-chat-live>.wpm-selection-bar:not(.is-hidden),
  #wpm-app .wpm-chat-live>.wpm-reply-bar:not(.is-hidden),
  #wpm-app .wpm-chat-live>.wpm-record-status:not(.is-hidden){position:relative!important;inset:auto!important;flex:0 0 auto!important;z-index:22!important}
  #wpm-app .wpm-chat-live>.wpm-messages{position:relative!important;inset:auto!important;flex:1 1 auto!important;height:auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important}
  #wpm-app .wpm-chat-live>.wpm-composer{position:relative!important;inset:auto!important;flex:0 0 auto!important;display:flex!important;visibility:visible!important;opacity:1!important;z-index:30!important;transform:none!important;margin:0!important}
  #wpm-app.wpm-channel-view .wpm-messages{padding-inline:18px!important}
}

@media (max-width:880px){
  .wpm-voice-draft-card{padding:8px!important;border-radius:17px!important}.wpm-voice-draft-head{padding-bottom:6px!important}
  .wpm-voice-draft{gap:7px!important}.wpm-voice-draft-actions{gap:5px!important}.wpm-voice-draft-actions button{height:38px!important;min-width:38px!important;border-radius:12px!important;padding:0 10px!important}.wpm-voice-draft-actions button span{display:none!important}
  #wpm-app.wpm-channel-view .wpm-messages{padding-inline:8px!important}
}

/* v0.6.7 UI polish: categorized emoji, modern sheets, contacts/settings, reactions */
#wpm-app .wpm-modal-card{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--wpm-accent) 45%,transparent) transparent}
#wpm-app .wpm-sheet-heading{display:flex;align-items:center;justify-content:space-between;padding:0 4px 10px}
#wpm-app .wpm-sheet-heading h2{margin:0;font-size:21px;letter-spacing:-.02em}

/* Attachment sheet */
#wpm-app .wpm-attach-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
#wpm-app .wpm-attach-choice{appearance:none;-webkit-appearance:none;display:grid!important;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:12px;min-height:70px;padding:11px 12px!important;border:1px solid var(--wpm-border)!important;border-radius:18px!important;background:var(--wpm-card)!important;color:var(--wpm-text)!important;text-align:start!important;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
#wpm-app .wpm-attach-choice:hover{border-color:color-mix(in srgb,var(--wpm-accent) 35%,var(--wpm-border))!important;box-shadow:0 8px 24px rgba(22,52,80,.08);transform:translateY(-1px)}
#wpm-app .wpm-attach-choice span{display:grid;gap:3px;min-width:0}
#wpm-app .wpm-attach-choice strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#wpm-app .wpm-attach-choice small{font-size:11px;color:var(--wpm-muted)}
#wpm-app .wpm-attach-icon{width:44px;height:44px;border-radius:14px;display:grid!important;place-items:center!important;color:#fff!important;background:var(--wpm-accent)}
#wpm-app .wpm-attach-icon.camera{background:#27ae60}.wpm-attach-icon.video{background:#7c5cff}.wpm-attach-icon.record{background:#f05a5a}.wpm-attach-icon.file{background:#f39c35}.wpm-attach-icon.location{background:#e34d7b}

/* Categorized emoji picker */
#wpm-app .wpm-emoji-head{display:grid;gap:10px;padding-bottom:8px}
#wpm-app .wpm-emoji-head h2{margin:0;font-size:21px}
#wpm-app .wpm-emoji-search{display:flex;align-items:center;gap:8px;background:var(--wpm-input);border:1px solid var(--wpm-border);border-radius:15px;padding:0 11px}
#wpm-app .wpm-emoji-search input{height:40px!important;border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;margin:0!important;min-width:0!important}
#wpm-app .wpm-emoji-cats{display:flex;gap:6px;overflow-x:auto;padding:4px 0 9px;margin-bottom:4px;scrollbar-width:none;border-bottom:1px solid var(--wpm-border)}
#wpm-app .wpm-emoji-cats::-webkit-scrollbar{display:none}
#wpm-app .wpm-emoji-cats button{appearance:none;-webkit-appearance:none;flex:0 0 44px;width:44px;height:40px;border:0;border-radius:13px;background:transparent;font-size:22px;cursor:pointer;transition:.15s}
#wpm-app .wpm-emoji-cats button.active{background:color-mix(in srgb,var(--wpm-accent) 15%,var(--wpm-card));box-shadow:inset 0 -2px 0 var(--wpm-accent)}
#wpm-app .wpm-emoji-grid-large{display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:6px!important;padding:8px 2px!important;max-height:min(55vh,500px)!important;overflow-y:auto!important}
#wpm-app .wpm-emoji-grid-large button{appearance:none!important;-webkit-appearance:none!important;aspect-ratio:1!important;min-width:0!important;border:0!important;border-radius:13px!important;background:transparent!important;font-size:29px!important;line-height:1!important;cursor:pointer!important;transition:transform .12s ease,background .12s ease!important}
#wpm-app .wpm-emoji-grid-large button:hover{background:var(--wpm-input)!important;transform:scale(1.08)}
#wpm-app .wpm-emoji-grid-large button:active{transform:scale(.92)}

/* Large standalone emoji messages */
#wpm-app .wpm-emoji-only{font-size:46px!important;line-height:1.2!important;letter-spacing:4px!important;padding:4px 2px!important;animation:wpmEmojiPop .28s ease-out}
#wpm-app .wpm-message:has(.wpm-emoji-only){background:transparent!important;border-color:transparent!important;box-shadow:none!important;padding-inline:4px!important}
@keyframes wpmEmojiPop{0%{transform:scale(.72);opacity:.35}72%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}

/* Reactions */
#wpm-app .wpm-reactions{gap:6px!important;margin-top:9px!important}
#wpm-app .wpm-reaction{min-height:31px!important;padding:4px 9px!important;border-radius:999px!important;gap:5px!important}
#wpm-app .wpm-reaction span{font-size:19px!important;line-height:1!important}
#wpm-app .wpm-reaction b{font-size:11px!important;font-weight:800!important}
#wpm-app .wpm-reaction-picker{display:flex!important;gap:5px!important;overflow-x:auto!important;padding:3px 0!important;scrollbar-width:none!important;direction:ltr!important}
#wpm-app .wpm-reaction-picker::-webkit-scrollbar{display:none}
#wpm-app .wpm-reaction-picker button{flex:0 0 36px!important;width:36px!important;height:36px!important;padding:0!important;border-radius:12px!important;font-size:21px!important;display:grid!important;place-items:center!important}

/* Modern message action sheet */
#wpm-app .wpm-msg-actions-sheet{background:var(--wpm-card)!important;color:var(--wpm-text)!important;border:1px solid var(--wpm-border)!important;border-radius:18px!important;padding:7px!important;min-width:225px!important;overflow:visible!important;box-shadow:0 22px 58px rgba(15,37,61,.24)!important}
#wpm-app .wpm-action-primary{display:grid;grid-template-columns:1fr 1fr;gap:4px}
#wpm-app .wpm-action-primary>button{appearance:none;-webkit-appearance:none;border:0!important;background:transparent!important;color:var(--wpm-text)!important;min-height:43px!important;padding:8px 10px!important;border-radius:11px!important;display:flex!important;align-items:center!important;gap:9px!important;text-align:start!important;cursor:pointer!important;font-size:13px!important;font-weight:650!important}
#wpm-app .wpm-action-primary>button:hover{background:var(--wpm-input)!important}
#wpm-app .wpm-action-primary>button.danger{color:#d43d50!important}
#wpm-app .wpm-action-icon{width:23px;height:23px;display:grid;place-items:center;border-radius:8px;background:color-mix(in srgb,var(--wpm-accent) 12%,transparent);font-size:14px;font-weight:900}
#wpm-app .wpm-action-primary>button.danger .wpm-action-icon{background:rgba(212,61,80,.1)}
#wpm-app .wpm-action-react{margin-top:6px;padding:8px 4px 2px!important;border-top:1px solid var(--wpm-border)!important;border-bottom:0!important}

/* Contacts */
#wpm-app .wpm-contact-toolbar{display:grid;gap:10px;margin:8px 0 14px}
#wpm-app .wpm-contact-search{height:46px;display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid var(--wpm-border);border-radius:15px;background:var(--wpm-input)}
#wpm-app .wpm-contact-search input{border:0!important;background:transparent!important;box-shadow:none!important;height:44px!important;padding:0!important;margin:0!important;min-width:0!important}
#wpm-app .wpm-contact-import{appearance:none;-webkit-appearance:none;border:1px solid color-mix(in srgb,var(--wpm-accent) 25%,var(--wpm-border));background:color-mix(in srgb,var(--wpm-accent) 7%,var(--wpm-card));color:var(--wpm-text);border-radius:16px;display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:center;padding:10px 12px;text-align:start;cursor:pointer}
#wpm-app .wpm-contact-import-icon{width:38px;height:38px;border-radius:12px;background:var(--wpm-accent);color:#fff;display:grid;place-items:center}
#wpm-app .wpm-contact-import span:last-child{display:grid;gap:2px}#wpm-app .wpm-contact-import strong{font-size:13px}#wpm-app .wpm-contact-import small{font-size:10px;color:var(--wpm-muted)}
#wpm-app .wpm-contact-list{display:grid;gap:5px!important}
#wpm-app .wpm-contact-row{appearance:none!important;-webkit-appearance:none!important;width:100%!important;display:grid!important;grid-template-columns:50px minmax(0,1fr) 22px!important;gap:11px!important;align-items:center!important;padding:9px 8px!important;border:0!important;border-bottom:1px solid color-mix(in srgb,var(--wpm-border) 70%,transparent)!important;background:transparent!important;color:var(--wpm-text)!important;text-align:start!important;border-radius:12px!important;cursor:pointer!important}
#wpm-app .wpm-contact-row:hover{background:var(--wpm-input)!important}
#wpm-app .wpm-contact-info{display:grid;gap:3px;min-width:0}.wpm-contact-info strong{font-size:14px}.wpm-contact-info small{font-size:11px;color:var(--wpm-muted)}
#wpm-app .wpm-contact-arrow{font-size:24px;color:var(--wpm-muted)}
#wpm-app .wpm-empty-card{padding:24px 14px;text-align:center;color:var(--wpm-muted);background:var(--wpm-input);border-radius:16px}

/* Settings rework */
#wpm-app .wpm-settings-sheet{display:grid;gap:10px}
#wpm-app .wpm-settings-hero{display:flex;align-items:center;gap:14px;padding:4px 2px 12px;border-bottom:1px solid var(--wpm-border)}
#wpm-app .wpm-settings-hero .wpm-avatar.big{width:64px;height:64px;margin:0}.wpm-settings-hero h2{margin:0 0 3px!important;font-size:20px}.wpm-settings-hero p{margin:0}
#wpm-app .wpm-settings-form-modern{display:grid;gap:9px}
#wpm-app .wpm-settings-group{border:1px solid var(--wpm-border);border-radius:17px;background:var(--wpm-card);overflow:hidden}
#wpm-app .wpm-settings-group>summary{list-style:none;display:grid;grid-template-columns:38px minmax(0,1fr) 24px;align-items:center;gap:8px;min-height:58px;padding:9px 12px;cursor:pointer;font-weight:750;color:var(--wpm-text)}
#wpm-app .wpm-settings-group>summary::-webkit-details-marker{display:none}
#wpm-app .wpm-settings-group>summary b{font-size:16px;color:var(--wpm-muted);transition:transform .18s ease}
#wpm-app .wpm-settings-group[open]>summary b{transform:rotate(180deg)}
#wpm-app .wpm-settings-summary-icon{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--wpm-accent) 11%,var(--wpm-input));color:var(--wpm-accent)}
#wpm-app .wpm-settings-panel{padding:4px 14px 15px;border-top:1px solid var(--wpm-border)}
#wpm-app .wpm-settings-panel label{font-size:12px!important;margin:11px 0 6px!important}
#wpm-app .wpm-settings-panel input:not([type=color]),#wpm-app .wpm-settings-panel select,#wpm-app .wpm-settings-panel textarea{width:100%!important;border:1px solid var(--wpm-border)!important;background:var(--wpm-input)!important;color:var(--wpm-text)!important;border-radius:13px!important;min-height:44px!important;padding:10px 12px!important;box-shadow:none!important}
#wpm-app .wpm-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#wpm-app .wpm-settings-grid label{margin:8px 0 0!important}
#wpm-app .wpm-settings-grid label:last-child:nth-child(odd){grid-column:1/-1}
#wpm-app .wpm-color-label input[type=color]{display:block;width:100%!important;height:46px!important;margin-top:6px!important;border:1px solid var(--wpm-border)!important;border-radius:13px!important;background:var(--wpm-input)!important;padding:5px!important}
#wpm-app .wpm-settings-save{width:100%;margin:2px 0 3px}
#wpm-app .wpm-settings-subcard{padding:9px 0;border-bottom:1px solid var(--wpm-border)}#wpm-app .wpm-settings-subcard:last-child{border-bottom:0}.wpm-settings-subcard h3{margin:0 0 6px!important;font-size:13px!important}
#wpm-app .wpm-inline-upload,#wpm-app .wpm-inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.wpm-inline-upload input,.wpm-inline-form input{flex:1 1 190px!important}.wpm-inline-upload button,.wpm-inline-form button{flex:0 0 auto}
#wpm-app .wpm-settings-nav-item{margin:0!important;border:1px solid var(--wpm-border)!important;border-radius:17px!important;background:var(--wpm-card)!important;min-height:62px!important;padding:10px 12px!important}
#wpm-app .wpm-settings-public-link{display:grid!important;gap:3px!important;padding:12px 14px!important;border:1px solid var(--wpm-border)!important;border-radius:15px!important;background:var(--wpm-input)!important;text-decoration:none!important;color:var(--wpm-text)!important}.wpm-settings-public-link small{color:var(--wpm-muted);direction:ltr;overflow-wrap:anywhere}

/* Dark mode icon visibility */
#wpm-app.wpm-theme-dark .wpm-menu-btn,#wpm-app.wpm-theme-dark .wpm-new-btn,#wpm-app.wpm-theme-dark .wpm-drawer-theme,#wpm-app.wpm-theme-dark .wpm-drawer-nav .wpm-svg,#wpm-app.wpm-theme-dark .wpm-sidebar-head .wpm-svg{color:#eaf4ff!important;opacity:1!important;filter:none!important}
#wpm-app.wpm-theme-dark .wpm-drawer-nav>button,#wpm-app.wpm-theme-dark .wpm-drawer-nav>a{color:#eef6ff!important}
#wpm-app.wpm-theme-dark .wpm-action-primary>button{color:var(--wpm-text)!important}

@media (max-width:880px){
  #wpm-app .wpm-modal-card{padding:18px 16px max(20px,env(safe-area-inset-bottom))!important}
  #wpm-app .wpm-attach-list{grid-template-columns:1fr!important;gap:7px!important}
  #wpm-app .wpm-attach-choice{min-height:62px!important;grid-template-columns:44px minmax(0,1fr)!important;border-radius:15px!important;padding:8px 10px!important}
  #wpm-app .wpm-attach-icon{width:40px;height:40px;border-radius:12px}
  #wpm-app .wpm-emoji-grid-large{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:4px!important;max-height:58dvh!important}
  #wpm-app .wpm-emoji-grid-large button{font-size:30px!important;border-radius:12px!important}
  #wpm-app .wpm-emoji-cats{position:sticky;top:-18px;background:var(--wpm-card);z-index:3;padding-top:6px}
  #wpm-app .wpm-msg-actions-sheet{position:fixed!important;inset:auto 8px max(10px,env(safe-area-inset-bottom)) 8px!important;min-width:0!important;border-radius:22px!important;padding:9px!important;max-height:68dvh!important;overflow:auto!important}
  #wpm-app .wpm-action-primary{grid-template-columns:1fr 1fr!important;gap:5px!important}
  #wpm-app .wpm-action-primary>button{min-height:48px!important;font-size:13px!important;border-radius:13px!important;background:var(--wpm-input)!important}
  #wpm-app .wpm-reaction-picker button{flex-basis:40px!important;width:40px!important;height:40px!important;font-size:23px!important}
  #wpm-app .wpm-settings-grid{grid-template-columns:1fr!important}
  #wpm-app .wpm-settings-grid label:last-child:nth-child(odd){grid-column:auto}
  #wpm-app .wpm-settings-group>summary{min-height:55px!important}
  #wpm-app .wpm-settings-panel{padding-inline:11px!important}
  #wpm-app .wpm-inline-upload,#wpm-app .wpm-inline-form{display:grid!important;grid-template-columns:1fr!important}.wpm-inline-upload button,.wpm-inline-form button{width:100%!important}
  #wpm-app .wpm-contact-row{grid-template-columns:48px minmax(0,1fr) 20px!important;padding:8px 5px!important}
  #wpm-app .wpm-emoji-only{font-size:50px!important}
}


/* v0.6.9 — modern authentication */
.wpm-auth-wrap{
  min-height:72vh;
  padding:clamp(22px,4vw,56px);
  background:
    radial-gradient(circle at 15% 20%, color-mix(in srgb,var(--wpm-accent) 14%,transparent) 0 0, transparent 34%),
    radial-gradient(circle at 85% 82%, color-mix(in srgb,var(--wpm-accent) 10%,transparent) 0 0, transparent 28%),
    linear-gradient(145deg,color-mix(in srgb,var(--wpm-bg) 92%,#fff),var(--wpm-bg));
}
.wpm-auth-card{
  width:min(500px,100%);
  padding:30px 32px 28px;
  border-radius:30px;
  border:1px solid color-mix(in srgb,var(--wpm-border) 70%,transparent);
  box-shadow:0 28px 70px rgba(29,49,71,.14);
  overflow:hidden;
  position:relative;
}
.wpm-auth-card::before{
  content:"";
  position:absolute;
  inset-inline-start:-90px;
  top:-100px;
  width:210px;
  height:210px;
  border-radius:50%;
  background:color-mix(in srgb,var(--wpm-accent) 9%,transparent);
  pointer-events:none;
}
.wpm-auth-top{display:flex;justify-content:flex-end;position:relative;z-index:1;margin-bottom:24px}
.wpm-lang-mini{
  display:inline-grid;
  grid-template-columns:1fr 1fr;
  gap:3px;
  padding:4px;
  background:var(--wpm-input);
  border:1px solid var(--wpm-border);
  border-radius:999px;
}
.wpm-lang-mini button{
  appearance:none!important;
  -webkit-appearance:none!important;
  border:0!important;
  background:transparent!important;
  color:var(--wpm-muted)!important;
  min-width:104px;
  height:38px;
  padding:0 12px!important;
  border-radius:999px!important;
  cursor:pointer;
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:7px;
  font-size:12px!important;
  font-weight:750!important;
  transition:.18s ease;
  box-shadow:none!important;
}
.wpm-lang-mini button.active{
  background:var(--wpm-card)!important;
  color:var(--wpm-text)!important;
  box-shadow:0 4px 12px rgba(20,39,61,.10)!important;
}
.wpm-lang-code{
  min-width:25px;height:25px;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb,var(--wpm-accent) 12%,var(--wpm-card));
  color:var(--wpm-accent);font-weight:900;font-size:10px;
}
.wpm-lang-mini button.active .wpm-lang-code{background:var(--wpm-accent);color:#fff}
.wpm-auth-identity{display:flex;align-items:center;gap:14px;margin-bottom:25px;position:relative;z-index:1}
.wpm-auth-logo{
  width:58px;height:58px;border-radius:20px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--wpm-accent),color-mix(in srgb,var(--wpm-accent) 72%,#6559ff));
  color:#fff;box-shadow:0 13px 30px color-mix(in srgb,var(--wpm-accent) 30%,transparent);
  transform:rotate(-5deg);
}
.wpm-auth-logo span{font-size:29px;font-weight:950;transform:rotate(5deg);line-height:1}
.wpm-auth-card .wpm-brand{margin:0;color:var(--wpm-text);font-size:18px;font-weight:900}
.wpm-auth-kicker{font-size:11px;color:var(--wpm-muted);margin-top:3px;letter-spacing:.04em}
.wpm-auth-copy{margin-bottom:20px}
.wpm-auth-card h1{font-size:30px;letter-spacing:-.025em;margin:0 0 9px;line-height:1.2}
.wpm-auth-card .wpm-auth-prompt{margin:0;font-size:14px;line-height:1.8}
.wpm-auth-method-tabs{border-radius:16px!important;padding:5px!important;margin:20px 0!important}
.wpm-auth-method-tabs button{border-radius:12px!important;font-weight:750!important}
.wpm-auth-form label{font-size:13px;margin:17px 0 8px;color:var(--wpm-text)}
.wpm-auth-field{position:relative;display:flex;align-items:center}
.wpm-auth-field-icon{
  position:absolute;inset-inline-start:15px;z-index:1;width:30px;height:30px;border-radius:10px;
  display:grid;place-items:center;background:var(--wpm-input);color:var(--wpm-muted);font-size:13px;font-weight:900;
  pointer-events:none;
}
.wpm-auth-field input{
  height:58px!important;border-radius:17px!important;padding-inline-start:58px!important;
  border:1px solid var(--wpm-border)!important;background:color-mix(in srgb,var(--wpm-card) 86%,var(--wpm-input))!important;
  transition:.18s ease;
}
.wpm-auth-field input:focus{
  border-color:var(--wpm-accent)!important;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--wpm-accent) 13%,transparent)!important;
  background:var(--wpm-card)!important;
}
.wpm-auth-submit{
  min-height:56px!important;border-radius:17px!important;margin-top:17px!important;
  box-shadow:0 12px 26px color-mix(in srgb,var(--wpm-accent) 25%,transparent);
  transition:transform .16s ease,box-shadow .16s ease;
}
.wpm-auth-submit:hover{transform:translateY(-1px);box-shadow:0 16px 30px color-mix(in srgb,var(--wpm-accent) 32%,transparent)}
.wpm-auth-submit:active{transform:translateY(1px)}
.wpm-auth-foot{text-align:center;color:var(--wpm-muted);font-size:10px;letter-spacing:.13em;text-transform:uppercase;margin-top:24px;opacity:.72}
.wpm-theme-dark .wpm-auth-card{box-shadow:0 28px 70px rgba(0,0,0,.35)}
@media(max-width:640px){
  .wpm-auth-wrap{min-height:100dvh;padding:18px;align-items:center}
  .wpm-auth-card{width:100%;padding:24px 20px;border-radius:26px}
  .wpm-auth-top{margin-bottom:20px}
  .wpm-lang-mini{width:100%}
  .wpm-lang-mini button{min-width:0;height:42px}
  .wpm-auth-logo{width:52px;height:52px;border-radius:18px}
  .wpm-auth-card h1{font-size:27px}
  .wpm-auth-field input{height:56px!important}
}


/* v0.6.10 Push UX: no floating notification controls */
#wpm-app #wpm-push-float,
#wpm-app .wpm-push-float,
#wpm-app .wpm-notification-fab,
#wpm-app [data-wpm-push-float]{display:none!important}
.wpm-push-onboarding{text-align:center;padding:8px 4px 2px}
.wpm-push-onboarding-icon{width:68px;height:68px;margin:2px auto 14px;border-radius:22px;display:grid;place-items:center;background:color-mix(in srgb,var(--wpm-accent) 13%,#fff);color:var(--wpm-accent)}
.wpm-push-onboarding h2{margin:0 0 8px;font-size:22px}
.wpm-push-onboarding p{max-width:390px;margin:0 auto 22px;line-height:1.8}
.wpm-push-onboarding-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:10px}
.wpm-push-onboarding-actions button{min-height:48px;border-radius:14px}
@media(max-width:600px){.wpm-push-onboarding-actions{grid-template-columns:1fr}.wpm-push-onboarding-actions .wpm-primary{order:-1}}