/*
 * Hamrah 4.7.3 — authoritative profile, private-chat information,
 * message-selection and recipient-picker surfaces.
 */

:root {
  --pc-surface: var(--surface);
  --pc-raised: var(--surface-2);
  --pc-soft: color-mix(in srgb, var(--primary) 8%, var(--surface));
  --pc-line: color-mix(in srgb, var(--text) 10%, transparent);
  --pc-muted: var(--muted);
  --pc-shadow: 0 24px 80px rgba(5, 25, 44, .22);
  --pc-radius-lg: 26px;
  --pc-radius-md: 18px;
  --pc-motion: 220ms cubic-bezier(.2, .8, .2, 1);
}

body.dark {
  --pc-surface: var(--surface);
  --pc-raised: var(--surface-2);
  --pc-soft: color-mix(in srgb, var(--primary) 13%, var(--surface));
  --pc-line: color-mix(in srgb, white 11%, transparent);
  --pc-muted: var(--muted);
}

body.amoled {
  --pc-surface: #050505;
  --pc-raised: #0c0c0c;
  --pc-soft: color-mix(in srgb, var(--primary) 15%, #050505);
  --pc-line: rgba(255, 255, 255, .12);
}

/* My profile */
.profile-view {
  --profile-max: 780px;
  padding: 0 14px calc(30px + env(safe-area-inset-bottom)) !important;
}

.profile-view > * {
  inline-size: min(100%, var(--profile-max));
  margin-inline: auto;
}

.profile-hero-v473 {
  min-block-size: 330px;
  margin-block: 12px 16px;
  padding: 54px 24px 24px;
  border: 1px solid color-mix(in srgb, white 18%, transparent);
  border-radius: 30px;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(circle at 18% 16%, rgba(255,255,255,.2), transparent 24%),
    linear-gradient(145deg, color-mix(in srgb, var(--profile-accent, var(--primary)) 88%, #102c4a), color-mix(in srgb, var(--primary-2) 72%, #14273c));
  box-shadow: 0 24px 60px color-mix(in srgb, var(--profile-accent, var(--primary)) 24%, transparent);
  color: #fff;
}

.profile-hero-v473::after {
  content: "";
  position: absolute;
  inset: auto -12% -48% -12%;
  block-size: 68%;
  border-radius: 50% 50% 0 0;
  background: linear-gradient(to top, rgba(4, 16, 28, .35), transparent);
  z-index: -1;
}

.profile-hero-v473 .profile-pattern {
  position: absolute;
  inset: 0;
  opacity: .32;
  pointer-events: none;
}

.profile-hero-v473 .profile-pattern i {
  position: absolute;
  inline-size: 150px;
  block-size: 150px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 50%;
}

.profile-hero-v473 .profile-pattern i:nth-child(1) { inset-block-start: -62px; inset-inline-start: -22px; }
.profile-hero-v473 .profile-pattern i:nth-child(2) { inset-block-start: 28px; inset-inline-end: -78px; inline-size: 210px; block-size: 210px; }
.profile-hero-v473 .profile-pattern i:nth-child(3) { inset-block-end: -100px; inset-inline-start: 28%; inline-size: 240px; block-size: 240px; }

.profile-hero-v473 .profile-avatar-wrap {
  margin-block-end: 12px;
}

.profile-hero-v473 .avatar-xl {
  inline-size: 112px;
  block-size: 112px;
  border: 4px solid rgba(255,255,255,.92);
  box-shadow: 0 16px 38px rgba(0,0,0,.24);
  font-size: 2.4rem;
  background-size: cover;
  background-position: center;
  transition: transform var(--pc-motion), box-shadow var(--pc-motion);
}

.profile-hero-v473 .avatar-xl:hover { transform: translateY(-2px) scale(1.015); }
.profile-hero-v473 .avatar-camera { border: 2px solid rgba(255,255,255,.75); }
.profile-hero-v473 h2 { margin: 5px 0 2px; max-inline-size: 100%; font-size: clamp(1.35rem, 4vw, 1.8rem); overflow-wrap: anywhere; }
.profile-hero-v473 #profileDisplayBio { margin: 8px auto 0; max-inline-size: 520px; color: rgba(255,255,255,.84); line-height: 1.8; }
.profile-username { margin: 0; direction: ltr; unicode-bidi: plaintext; color: rgba(255,255,255,.7); font-size: .78rem; }

.profile-hero-badges,
.profile-hero-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}

.profile-hero-badges { margin-block: 8px 3px; }
.profile-status,
.profile-role-badge {
  position: static;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-block-size: 29px;
  padding: 5px 10px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 999px;
  background: rgba(3,18,31,.22);
  color: #fff;
  font-size: .66rem;
  font-weight: 800;
  backdrop-filter: blur(10px);
}

.profile-role-badge svg { inline-size: 15px; block-size: 15px; }
.profile-hero-actions { margin-block-start: 18px; }
.profile-primary-action,
.profile-quiet-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-block-size: 43px;
  padding: 9px 15px;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 14px;
  font-weight: 800;
  transition: transform var(--pc-motion), background var(--pc-motion);
}

.profile-primary-action { background: #fff; color: #15334e; }
.profile-quiet-action { background: rgba(3,18,31,.18); color: #fff; }
.profile-primary-action:hover,
.profile-quiet-action:hover { transform: translateY(-1px); }
.profile-primary-action svg,
.profile-quiet-action svg { inline-size: 18px; block-size: 18px; }

.profile-overview-card,
#profileEditCard {
  margin-block: 0 14px;
  padding: 18px;
  border: 1px solid var(--pc-line);
  border-radius: var(--pc-radius-lg);
  background: var(--pc-surface);
  box-shadow: 0 12px 36px rgba(13, 43, 67, .08);
}

.profile-overview-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-block-end: 16px;
}

.profile-overview-heading h3 { margin: 0; font-size: .98rem; }
.profile-overview-heading p { margin: 3px 0 0; color: var(--pc-muted); font-size: .66rem; }
.profile-safe-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  padding: 7px 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--success) 10%, var(--pc-surface));
  color: var(--success);
  font-size: .58rem;
  font-weight: 800;
}
.profile-safe-chip svg { inline-size: 14px; block-size: 14px; }

.profile-fact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.profile-fact-grid > div {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 9px;
  min-inline-size: 0;
  padding: 12px;
  border: 1px solid var(--pc-line);
  border-radius: 16px;
  background: var(--pc-raised);
}

.profile-fact-grid > div > span {
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  inline-size: 38px;
  block-size: 38px;
  border-radius: 13px;
  background: var(--pc-soft);
  color: var(--primary);
}
.profile-fact-grid svg { inline-size: 18px; block-size: 18px; }
.profile-fact-grid small { color: var(--pc-muted); font-size: .58rem; }
.profile-fact-grid b { min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .72rem; }
.profile-privacy-row { margin-block-start: 12px; border: 1px solid var(--pc-line) !important; }
.profile-account-actions { margin-block-start: 10px; border: 1px solid var(--pc-line); border-radius: 16px; overflow: hidden; }
.profile-account-actions .plain-row { border: 0; border-radius: 0; }
.profile-account-actions .plain-row + .plain-row { border-block-start: 1px solid var(--pc-line); }
#profileEditCard:not(.hidden) { animation: pcCardIn var(--pc-motion) both; }
#cancelProfileEditButton { margin-block-start: 8px; }
.chat-mute-indicator {
  flex: 0 0 auto;
  inline-size: 28px;
  block-size: 28px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--pc-soft);
  color: var(--primary);
}
.chat-mute-indicator svg { inline-size: 15px; block-size: 15px; }

/* Profile/private-chat detail layer */
.pc-layer,
.pc-dialog-layer,
.pc-avatar-layer,
.pc-recipient-layer {
  position: fixed;
  inset: 0;
  z-index: calc(var(--g10-z-dialog, 900) + 24);
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  background: rgba(2, 10, 18, .56);
  backdrop-filter: blur(7px);
  opacity: 1;
  transition: opacity var(--pc-motion);
}

.pc-layer.hidden,
.pc-dialog-layer.hidden,
.pc-avatar-layer.hidden,
.pc-recipient-layer.hidden { display: none !important; }

.pc-panel {
  direction: rtl;
  inline-size: min(580px, 48vw);
  min-inline-size: 430px;
  block-size: 100%;
  display: flex;
  flex-direction: column;
  background: var(--pc-surface);
  box-shadow: var(--pc-shadow);
  animation: pcPanelIn 260ms cubic-bezier(.2,.8,.2,1) both;
}

.pc-panel-header {
  position: sticky;
  inset-block-start: 0;
  z-index: 4;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 42px;
  align-items: center;
  gap: 8px;
  min-block-size: 66px;
  padding: max(10px, env(safe-area-inset-top)) 12px 10px;
  border-block-end: 1px solid var(--pc-line);
  background: color-mix(in srgb, var(--pc-surface) 94%, transparent);
  backdrop-filter: blur(18px);
}

.pc-panel-header > div { min-inline-size: 0; text-align: center; }
.pc-panel-header h2 { margin: 0; font-size: .92rem; }
.pc-panel-header p { margin: 2px 0 0; overflow: hidden; color: var(--pc-muted); font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }
.pc-header-button {
  display: grid;
  place-items: center;
  inline-size: 40px;
  block-size: 40px;
  border: 0;
  border-radius: 13px;
  background: var(--pc-raised);
  color: var(--text);
}
.pc-header-button svg { inline-size: 20px; block-size: 20px; }
.pc-panel-scroll {
  flex: 1;
  min-block-size: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 14px 14px calc(28px + env(safe-area-inset-bottom));
}

.pc-skeleton { display: grid; gap: 12px; }
.pc-skeleton > i {
  display: block;
  block-size: 70px;
  border-radius: 18px;
  background: linear-gradient(100deg, var(--pc-raised) 25%, var(--pc-soft) 42%, var(--pc-raised) 60%);
  background-size: 300% 100%;
  animation: pcSkeleton 1.2s linear infinite;
}
.pc-skeleton > i:first-child { block-size: 280px; }

.pc-profile-hero {
  position: relative;
  min-block-size: 280px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding: 44px 20px 22px;
  border-radius: var(--pc-radius-lg);
  overflow: hidden;
  isolation: isolate;
  color: #fff;
  background:
    radial-gradient(circle at 22% 10%, rgba(255,255,255,.22), transparent 28%),
    linear-gradient(145deg, color-mix(in srgb, var(--pc-accent, var(--primary)) 86%, #172f48), color-mix(in srgb, var(--primary-2) 68%, #142436));
}

.pc-profile-hero::after {
  content: "";
  position: absolute;
  inset: 46% 0 0;
  z-index: -1;
  background: linear-gradient(to bottom, transparent, rgba(2,11,19,.5));
}

.pc-avatar {
  position: relative;
  inline-size: 104px;
  block-size: 104px;
  display: grid;
  place-items: center;
  margin-block-end: 12px;
  border: 4px solid rgba(255,255,255,.88);
  border-radius: 50%;
  overflow: hidden;
  background: var(--pc-accent, var(--primary));
  background-size: cover;
  background-position: center;
  box-shadow: 0 16px 38px rgba(0,0,0,.25);
  color: #fff;
  font-size: 2.2rem;
}

button.pc-avatar { cursor: zoom-in; }
.pc-online-dot {
  position: absolute;
  inset-inline-end: calc(50% - 49px);
  inset-block-end: 107px;
  inline-size: 18px;
  block-size: 18px;
  border: 3px solid rgba(255,255,255,.92);
  border-radius: 50%;
  background: var(--success);
}

.pc-profile-hero h3 { margin: 0; max-inline-size: 100%; font-size: 1.32rem; overflow-wrap: anywhere; text-align: center; }
.pc-profile-hero .pc-username { margin: 2px 0 0; direction: ltr; color: rgba(255,255,255,.72); font-size: .7rem; }
.pc-profile-hero .pc-bio { margin: 8px 0 0; max-inline-size: 430px; color: rgba(255,255,255,.86); font-size: .7rem; line-height: 1.8; text-align: center; }
.pc-badges { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-block: 9px 0; }
.pc-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 8px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(2,12,21,.24);
  font-size: .56rem;
  font-weight: 800;
}
.pc-badge svg { inline-size: 13px; block-size: 13px; }

.pc-quick-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-block: 12px;
}
.pc-quick-action {
  min-inline-size: 0;
  min-block-size: 76px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 9px 5px;
  border: 1px solid var(--pc-line);
  border-radius: 16px;
  background: var(--pc-surface);
  color: var(--text);
  font-size: .61rem;
  font-weight: 800;
  transition: transform var(--pc-motion), background var(--pc-motion);
}
.pc-quick-action:hover:not(:disabled) { transform: translateY(-2px); background: var(--pc-soft); }
.pc-quick-action:disabled { opacity: .45; cursor: not-allowed; }
.pc-quick-action > span {
  display: grid;
  place-items: center;
  inline-size: 34px;
  block-size: 34px;
  border-radius: 12px;
  background: var(--pc-soft);
  color: var(--primary);
}
.pc-quick-action svg { inline-size: 18px; block-size: 18px; }

.pc-section {
  margin-block: 10px;
  padding: 15px;
  border: 1px solid var(--pc-line);
  border-radius: var(--pc-radius-md);
  background: var(--pc-surface);
}
.pc-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-block-end: 10px;
}
.pc-section-title h3 { margin: 0; font-size: .78rem; }
.pc-section-title small { color: var(--pc-muted); font-size: .57rem; }
.pc-fact-row,
.pc-action-row,
.pc-group-row,
.pc-shared-row {
  inline-size: 100%;
  min-block-size: 55px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px;
  border: 0;
  border-radius: 13px;
  background: transparent;
  color: var(--text);
  text-align: start;
}
.pc-fact-row + .pc-fact-row,
.pc-action-row + .pc-action-row,
.pc-group-row + .pc-group-row,
.pc-shared-row + .pc-shared-row { border-block-start: 1px solid var(--pc-line); border-radius: 0; }
.pc-row-icon {
  display: grid;
  place-items: center;
  inline-size: 36px;
  block-size: 36px;
  border-radius: 12px;
  background: var(--pc-soft);
  color: var(--primary);
}
.pc-row-icon svg { inline-size: 18px; block-size: 18px; }
.pc-fact-row > span:nth-child(2),
.pc-action-row > span:nth-child(2),
.pc-group-row > span:nth-child(2),
.pc-shared-row > span:nth-child(2) { min-inline-size: 0; }
.pc-fact-row b,
.pc-action-row b,
.pc-group-row b,
.pc-shared-row b { display: block; overflow: hidden; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.pc-fact-row small,
.pc-action-row small,
.pc-group-row small,
.pc-shared-row small { display: block; margin-block-start: 2px; color: var(--pc-muted); font-size: .56rem; line-height: 1.55; }
.pc-action-row { cursor: pointer; }
.pc-action-row:hover { background: var(--pc-soft); }
.pc-action-row.danger { color: var(--danger); }
.pc-action-row.danger .pc-row-icon { background: color-mix(in srgb, var(--danger) 10%, var(--pc-surface)); color: var(--danger); }
.pc-chevron { inline-size: 17px; block-size: 17px; color: var(--pc-muted); }

.pc-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
  padding: 4px;
  border-radius: 14px;
  background: var(--pc-raised);
}
.pc-tabs button {
  min-inline-size: 0;
  min-block-size: 38px;
  padding: 6px 3px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--pc-muted);
  font-size: .57rem;
  font-weight: 800;
}
.pc-tabs button.active { background: var(--pc-surface); color: var(--primary); box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.pc-shared-content { min-block-size: 150px; padding-block-start: 10px; }
.pc-media-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.pc-media-item {
  position: relative;
  aspect-ratio: 1;
  padding: 0;
  border: 0;
  border-radius: 12px;
  overflow: hidden;
  background: var(--pc-raised);
}
.pc-media-item > button:first-child {
  inline-size: 100%;
  block-size: 100%;
  padding: 0;
  border: 0;
  background: transparent;
}
.pc-media-item img { inline-size: 100%; block-size: 100%; object-fit: cover; }
.pc-media-item > button:last-child {
  position: absolute;
  inset: auto 5px 5px;
  padding: 3px 5px;
  border: 0;
  border-radius: 7px;
  background: rgba(0,0,0,.62);
  color: #fff;
  font-size: .49rem;
}
.pc-shared-actions { display: flex; align-items: center; gap: 4px; }
.pc-shared-audio { inline-size: min(280px, 100%); block-size: 36px; margin-block-start: 7px; }
.pc-link-value { direction: ltr; unicode-bidi: plaintext; }
.pc-load-more { inline-size: 100%; min-block-size: 40px; margin-block-start: 8px; border: 1px solid var(--pc-line); border-radius: 12px; background: var(--pc-raised); color: var(--primary); font-weight: 800; }
.pc-empty {
  min-block-size: 135px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 7px;
  padding: 18px;
  border: 1px dashed var(--pc-line);
  border-radius: 16px;
  color: var(--pc-muted);
  text-align: center;
}
.pc-empty svg { inline-size: 32px; block-size: 32px; }
.pc-empty b { color: var(--text); font-size: .72rem; }
.pc-empty small { font-size: .57rem; line-height: 1.7; }
.pc-offline-note,
.pc-blocked-note {
  display: flex;
  gap: 8px;
  margin-block: 9px;
  padding: 11px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--danger) 8%, var(--pc-surface));
  color: var(--danger);
  font-size: .62rem;
  line-height: 1.7;
}
.pc-offline-note { background: color-mix(in srgb, #e6a126 10%, var(--pc-surface)); color: #b9790b; }

/* Message actions and selection */
.forwarded-from,
button.g7-forward-label,
button.author {
  inline-size: fit-content;
  max-inline-size: 100%;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-block-end: 5px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--primary);
  font-size: .58rem;
  font-weight: 800;
  text-align: start;
}
.g7-bubble button.g7-forward-label { color: color-mix(in srgb, var(--device-accent, var(--primary)) 74%, currentColor); }
.forwarded-from svg { inline-size: 13px; block-size: 13px; }
.message { position: relative; }
.message.is-selectable { cursor: pointer; }
.message.is-selected .bubble {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 34%, transparent), var(--shadow-sm) !important;
  transform: translateY(-1px);
}
.message-select-indicator {
  position: absolute;
  inset-inline-start: 7px;
  inset-block-start: 50%;
  translate: 0 -50%;
  inline-size: 24px;
  block-size: 24px;
  display: grid;
  place-items: center;
  border: 2px solid color-mix(in srgb, var(--primary) 50%, var(--pc-line));
  border-radius: 50%;
  background: var(--pc-surface);
  color: transparent;
  opacity: 0;
  transform: scale(.8);
  transition: opacity var(--pc-motion), transform var(--pc-motion), background var(--pc-motion);
}
body.pc-selection-mode .message-select-indicator { opacity: 1; transform: scale(1); }
.message.is-selected .message-select-indicator { background: var(--primary); border-color: var(--primary); color: #fff; }
.message-select-indicator svg { inline-size: 14px; block-size: 14px; }

.pc-selection-toolbar {
  z-index: calc(var(--g10-z-sticky, 80) + 4);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) repeat(4, 42px);
  align-items: center;
  gap: 6px;
  min-block-size: 62px;
  margin: 6px 9px calc(7px + env(safe-area-inset-bottom));
  padding: 7px;
  border: 1px solid var(--pc-line);
  border-radius: 20px;
  background: color-mix(in srgb, var(--pc-surface) 96%, transparent);
  box-shadow: 0 15px 42px rgba(0,0,0,.18);
  backdrop-filter: blur(18px);
  animation: pcToolbarIn var(--pc-motion) both;
}
.pc-selection-toolbar.hidden { display: none !important; }
.pc-selection-toolbar > b { min-inline-size: 0; font-size: .72rem; }
.pc-selection-count {
  display: grid;
  place-items: center;
  min-inline-size: 32px;
  block-size: 32px;
  padding-inline: 7px;
  border-radius: 11px;
  background: var(--pc-soft);
  color: var(--primary);
  font-size: .72rem;
}
.pc-selection-toolbar button {
  inline-size: 40px;
  block-size: 40px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 13px;
  background: var(--pc-raised);
  color: var(--text);
}
.pc-selection-toolbar button.danger { color: var(--danger); }
.pc-selection-toolbar svg { inline-size: 19px; block-size: 19px; }
body.pc-selection-mode .composer { display: none !important; }
body.pc-selection-mode .reply-banner,
body.pc-selection-mode .edit-banner,
body.pc-selection-mode .emoji-panel { display: none !important; }

.pc-selection-label {
  min-inline-size: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pc-selection-top-actions {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.pc-selection-more-menu {
  position: absolute;
  inset-block-start: calc(100% + 6px);
  inset-inline-end: 5px;
  z-index: 4;
  min-inline-size: 148px;
  padding: 5px;
  border: 1px solid var(--pc-line);
  border-radius: 14px;
  background: var(--pc-surface);
  box-shadow: var(--pc-shadow);
}
.pc-selection-more-menu button {
  inline-size: 100% !important;
  block-size: 38px !important;
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  padding-inline: 9px;
  border-radius: 10px !important;
}
.pc-selection-more-menu button svg { inline-size: 17px; block-size: 17px; }
.pc-selection-dock {
  z-index: calc(var(--g10-z-sticky, 80) + 4);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.pc-selection-dock.hidden { display: none !important; }
.pc-selection-dock button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}
.pc-selection-dock svg { inline-size: 18px; block-size: 18px; }

/* Recipient picker */
.pc-recipient-layer { align-items: center; justify-content: center; padding: 18px; }
.pc-recipient-panel {
  direction: rtl;
  inline-size: min(720px, 96vw);
  max-block-size: min(820px, 92vh);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--pc-line);
  border-radius: 28px;
  background: var(--pc-surface);
  box-shadow: var(--pc-shadow);
  animation: pcDialogIn var(--pc-motion) both;
}
.pc-recipient-header {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 42px;
  align-items: center;
  gap: 8px;
  padding: 13px;
  border-block-end: 1px solid var(--pc-line);
}
.pc-recipient-header h2 { margin: 0; text-align: center; font-size: .9rem; }
.pc-recipient-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 11px 13px 7px;
  padding-inline: 12px;
  border: 1px solid var(--pc-line);
  border-radius: 15px;
  background: var(--pc-raised);
}
.pc-recipient-search:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 13%, transparent); }
.pc-recipient-search input { border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent !important; }
.pc-recipient-search svg { flex: 0 0 auto; inline-size: 19px; block-size: 19px; color: var(--pc-muted); }
.pc-selected-chips {
  display: flex;
  gap: 6px;
  min-block-size: 0;
  overflow-x: auto;
  padding: 4px 13px 8px;
  scrollbar-width: thin;
}
.pc-selected-chips:empty { display: none; }
.pc-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-block-size: 30px;
  padding: 5px 9px;
  border: 1px solid var(--pc-line);
  border-radius: 999px;
  background: var(--pc-soft);
  color: var(--primary);
  font-size: .57rem;
  font-weight: 800;
}
.pc-recipient-results { flex: 1; min-block-size: 230px; overflow-y: auto; padding: 5px 13px 13px; }
.pc-recipient-section h3 { margin: 12px 5px 6px; color: var(--pc-muted); font-size: .62rem; }
.pc-recipient-row {
  inline-size: 100%;
  min-block-size: 62px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 10px;
  padding: 8px;
  border: 0;
  border-radius: 15px;
  background: transparent;
  color: var(--text);
  text-align: start;
}
.pc-recipient-row:hover:not(:disabled),
.pc-recipient-row[aria-selected=true] { background: var(--pc-soft); }
.pc-recipient-row:disabled { opacity: .48; cursor: not-allowed; }
.pc-recipient-avatar {
  inline-size: 44px;
  block-size: 44px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: var(--pc-recipient-color, var(--primary));
  background-size: cover;
  background-position: center;
  color: #fff;
  font-weight: 900;
}
.pc-recipient-row b { display: block; overflow: hidden; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.pc-recipient-row small { display: block; margin-block-start: 2px; color: var(--pc-muted); font-size: .55rem; }
.pc-recipient-check {
  inline-size: 23px;
  block-size: 23px;
  display: grid;
  place-items: center;
  border: 2px solid var(--pc-line);
  border-radius: 50%;
}
.pc-recipient-row[aria-selected=true] .pc-recipient-check { border-color: var(--primary); background: var(--primary); color: #fff; }
.pc-recipient-check svg { inline-size: 13px; block-size: 13px; }
.pc-recipient-footer {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px calc(11px + env(safe-area-inset-bottom));
  border-block-start: 1px solid var(--pc-line);
  background: var(--pc-surface);
}
.pc-recipient-footer small { flex: 1; color: var(--pc-muted); font-size: .58rem; }
.pc-recipient-submit {
  min-block-size: 44px;
  min-inline-size: 132px;
  border: 0;
  border-radius: 14px;
  background: var(--gradient);
  color: #fff;
  font-weight: 900;
}
.pc-recipient-submit:disabled { opacity: .5; }

/* Confirm, mute, report, privacy and message info dialogs */
.pc-dialog-layer { align-items: center; justify-content: center; padding: 18px; z-index: calc(var(--g10-z-dialog, 900) + 34); }
.pc-dialog {
  direction: rtl;
  inline-size: min(440px, 94vw);
  max-block-size: min(760px, 92vh);
  overflow-y: auto;
  padding: 20px;
  border: 1px solid var(--pc-line);
  border-radius: 25px;
  background: var(--pc-surface);
  box-shadow: var(--pc-shadow);
  animation: pcDialogIn var(--pc-motion) both;
}
.pc-dialog-icon {
  inline-size: 52px;
  block-size: 52px;
  display: grid;
  place-items: center;
  margin-inline: auto;
  border-radius: 18px;
  background: var(--pc-soft);
  color: var(--primary);
}
.pc-dialog-icon.danger { background: color-mix(in srgb, var(--danger) 11%, var(--pc-surface)); color: var(--danger); }
.pc-dialog-icon svg { inline-size: 25px; block-size: 25px; }
.pc-dialog h2 { margin: 12px 0 5px; font-size: 1rem; text-align: center; }
.pc-dialog > p { margin: 0; color: var(--pc-muted); font-size: .65rem; line-height: 1.9; text-align: center; }
.pc-dialog-options { display: grid; gap: 7px; margin-block: 15px; }
.pc-dialog-option {
  inline-size: 100%;
  min-block-size: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--pc-line);
  border-radius: 14px;
  background: var(--pc-raised);
  color: var(--text);
  text-align: start;
}
.pc-dialog-option.active { border-color: var(--primary); background: var(--pc-soft); color: var(--primary); }
.pc-dialog label { margin: 12px 0; }
.pc-dialog textarea,
.pc-dialog select,
.pc-dialog input { border-color: var(--pc-line); background: var(--pc-raised); }
.pc-dialog-actions { display: flex; gap: 8px; margin-block-start: 15px; }
.pc-dialog-actions button { flex: 1; min-block-size: 45px; border: 0; border-radius: 14px; font-weight: 900; }
.pc-dialog-cancel { background: var(--pc-raised); color: var(--text); }
.pc-dialog-confirm { background: var(--gradient); color: #fff; }
.pc-dialog-confirm.danger { background: var(--danger); }
.pc-report-limit { display: block; color: var(--pc-muted); font-size: .53rem; text-align: end; }
.pc-privacy-grid { display: grid; gap: 8px; margin-block: 14px; }
.pc-privacy-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 145px;
  align-items: center;
  gap: 10px;
  margin: 0 !important;
  padding: 10px;
  border: 1px solid var(--pc-line);
  border-radius: 14px;
  background: var(--pc-raised);
}
.pc-privacy-row b { display: block; font-size: .67rem; }
.pc-privacy-row small { display: block; margin-block-start: 2px; color: var(--pc-muted); font-size: .52rem; }
.pc-privacy-row select { margin: 0; min-block-size: 40px; padding: 7px; }
.pc-message-info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-block: 14px; }
.pc-message-info-grid > div { padding: 11px; border: 1px solid var(--pc-line); border-radius: 14px; background: var(--pc-raised); }
.pc-message-info-grid small { display: block; color: var(--pc-muted); font-size: .52rem; }
.pc-message-info-grid b { display: block; margin-block-start: 3px; font-size: .66rem; overflow-wrap: anywhere; }

/* Avatar viewer */
.pc-avatar-layer { z-index: calc(var(--g10-z-dialog, 900) + 44); align-items: center; justify-content: center; padding: 18px; background: rgba(0,0,0,.88); }
.pc-avatar-viewer {
  position: relative;
  inline-size: min(700px, 94vw);
  block-size: min(700px, 84vh);
  display: grid;
  place-items: center;
}
.pc-avatar-viewer img {
  max-inline-size: 100%;
  max-block-size: 100%;
  border-radius: 24px;
  object-fit: contain;
  box-shadow: 0 30px 90px rgba(0,0,0,.55);
}
.pc-avatar-viewer > .pc-empty { min-inline-size: min(360px, 88vw); border-color: rgba(255,255,255,.28); color: rgba(255,255,255,.72); }
.pc-avatar-viewer > .pc-empty b { color: #fff; }
.pc-avatar-close {
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  inline-size: 44px;
  block-size: 44px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 15px;
  background: rgba(0,0,0,.45);
  color: #fff;
}

.g104-profile-trigger,
.g104-member-identity,
.g104-candidate-identity {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: start;
}
.g104-member-identity,
.g104-candidate-identity { min-inline-size: 0; }
button.g9-history-item { inline-size: 100%; color: var(--text); font: inherit; text-align: start; cursor: pointer; }
button.g9-history-item:hover { background: var(--pc-soft); }

@keyframes pcPanelIn { from { opacity: .45; transform: translateX(-26px); } to { opacity: 1; transform: none; } }
@keyframes pcDialogIn { from { opacity: .45; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes pcCardIn { from { opacity: .55; transform: translateY(-7px); } to { opacity: 1; transform: none; } }
@keyframes pcToolbarIn { from { opacity: .5; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes pcSkeleton { from { background-position: 100% 0; } to { background-position: -100% 0; } }

@media (max-width: 1099px) {
  .pc-panel { inline-size: min(620px, 72vw); min-inline-size: 0; }
}

@media (max-width: 767px) {
  .profile-view { padding-inline: 10px !important; }
  .profile-hero-v473 { min-block-size: 310px; margin-block-start: 8px; padding-inline: 14px; border-radius: 25px; }
  .profile-hero-v473 .avatar-xl { inline-size: 100px; block-size: 100px; }
  .profile-overview-card,
  #profileEditCard { padding: 14px; border-radius: 21px; }
  .profile-overview-heading { display: block; }
  .profile-safe-chip { margin-block-start: 8px; }
  .profile-fact-grid { grid-template-columns: 1fr; }

  .pc-layer { background: var(--pc-surface); backdrop-filter: none; }
  .pc-panel {
    inline-size: 100%;
    min-inline-size: 0;
    max-inline-size: none;
    block-size: var(--g102-viewport-height, 100dvh);
    box-shadow: none;
    animation-name: pcMobilePageIn;
  }
  .pc-panel-scroll { padding-inline: 10px; }
  .pc-profile-hero { min-block-size: 270px; border-radius: 22px; }
  .pc-avatar { inline-size: 96px; block-size: 96px; }
  .pc-online-dot { inset-inline-end: calc(50% - 45px); inset-block-end: 104px; }
  .pc-quick-actions { gap: 6px; }
  .pc-quick-action { min-block-size: 72px; font-size: .56rem; }
  .pc-section { padding: 12px; }
  .pc-tabs button { font-size: .52rem; }
  .pc-media-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  .pc-selection-toolbar {
    position: relative;
    margin: 5px;
    margin-block-end: max(5px, env(safe-area-inset-bottom));
    grid-template-columns: auto minmax(0, 1fr) repeat(4, 40px);
  }

  .pc-recipient-layer { padding: 0; background: var(--pc-surface); backdrop-filter: none; }
  .pc-recipient-panel {
    inline-size: 100%;
    max-inline-size: none;
    block-size: var(--g102-viewport-height, 100dvh);
    max-block-size: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    animation-name: pcMobilePageIn;
  }
  .pc-recipient-header { padding-block-start: max(13px, env(safe-area-inset-top)); }
  .pc-recipient-results { min-block-size: 0; }
  .pc-recipient-submit { min-inline-size: 118px; }

  .pc-dialog-layer { align-items: flex-end; padding: 0; }
  .pc-dialog {
    inline-size: 100%;
    max-inline-size: none;
    max-block-size: min(88vh, 760px);
    padding: 18px 15px calc(18px + env(safe-area-inset-bottom));
    border: 0;
    border-block-start: 1px solid var(--pc-line);
    border-radius: 25px 25px 0 0;
    animation-name: pcSheetIn;
  }
  .pc-privacy-row { grid-template-columns: minmax(0, 1fr) 126px; }
}

@media (max-width: 380px) {
  .chat-header .private-badge { display: none; }
  .pc-quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-tabs { overflow-x: auto; grid-template-columns: repeat(4, minmax(76px, 1fr)); }
  .pc-selection-toolbar { grid-template-columns: auto minmax(0, 1fr) repeat(3, 38px); }
  .pc-selection-toolbar [data-pc-selection-copy] { display: none; }
}

@keyframes pcMobilePageIn { from { opacity: .6; transform: translateX(-18px); } to { opacity: 1; transform: none; } }
@keyframes pcSheetIn { from { transform: translateY(22px); opacity: .55; } to { transform: none; opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  .pc-panel,
  .pc-dialog,
  .pc-recipient-panel,
  .pc-selection-toolbar,
  .pc-skeleton > i { animation: none !important; transition: none !important; }
}

/* Group 10.4 UI polish: Persian row rhythm and explicit interactive states. */
.profile-privacy-row,
.profile-account-actions .plain-row {
  min-block-size: 68px !important;
  padding-block: 10px !important;
  padding-inline: 10px !important;
  gap: 12px;
}
.profile-privacy-row .row-label,
.profile-account-actions .row-label { min-inline-size: 0; align-items: center; }
.profile-privacy-row .row-label > span:last-child,
.profile-account-actions .row-label > span:last-child { min-inline-size: 0; }
.profile-privacy-row .row-label b,
.profile-account-actions .row-label b {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.75;
  word-spacing: .1em;
}
.profile-privacy-row .row-label small,
.profile-account-actions .row-label small {
  white-space: normal;
  line-height: 1.78;
  word-spacing: .07em;
}
.pc-action-row { min-block-size: 63px; padding-block: 10px; transition: background var(--pc-motion), border-color var(--pc-motion), transform .16s ease; }
.pc-action-row b { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.68; word-spacing: .08em; }
.pc-action-row small { line-height: 1.72; word-spacing: .05em; }
.pc-action-row:active { transform: scale(.992); }
.pc-tabs button.active,
.pc-dialog-option.active,
.pc-recipient-row[aria-selected="true"] {
  border-color: var(--interactive-active-border);
  background: var(--interactive-active-soft);
  color: var(--interactive-active-strong);
  box-shadow: var(--interactive-active-glow);
}
@media (max-width: 560px) {
  .profile-privacy-row,
  .profile-account-actions .plain-row { min-block-size: 72px !important; padding-block: 11px !important; }
}

/* Telegram Message UX R1 — destructive direct-chat controls are grouped
   separately from contact/block/report safety actions. */
.pc-conversation-danger {
  border-color: color-mix(in srgb, var(--danger) 16%, var(--pc-line)) !important;
}
.pc-conversation-danger .pc-section-title h3 {
  color: color-mix(in srgb, var(--danger) 72%, var(--text)) !important;
}
.pc-conversation-danger .pc-action-row.danger + .pc-action-row.danger {
  border-block-start: 1px solid color-mix(in srgb, var(--danger) 11%, var(--pc-line));
}

/* Information surfaces R2: keep desktop chat interactive beside a compact panel. */
.pc-tabs button { position: relative; transition: color 150ms ease, background-color 150ms ease, box-shadow 150ms ease; }
.pc-tabs button::after {
  content: "";
  position: absolute;
  inset-inline: 24%;
  inset-block-end: 2px;
  block-size: 2px;
  border-radius: 999px;
  background: var(--primary);
  opacity: 0;
  transform: scaleX(.35);
  transition: opacity 150ms ease, transform 180ms cubic-bezier(.2,.8,.2,1);
}
.pc-tabs button.active::after { opacity: 1; transform: scaleX(1); }
.pc-shared-content[data-pc-direction="forward"] > * { animation: pcSharedForward 170ms cubic-bezier(.2,.8,.2,1) both; }
.pc-shared-content[data-pc-direction="backward"] > * { animation: pcSharedBackward 170ms cubic-bezier(.2,.8,.2,1) both; }

@keyframes pcSharedForward { from { opacity: .58; transform: translateX(-7px); } to { opacity: 1; transform: none; } }
@keyframes pcSharedBackward { from { opacity: .58; transform: translateX(7px); } to { opacity: 1; transform: none; } }

@media (min-width: 900px) {
  html[data-hamrah-desktop="windows"] .pc-layer {
    pointer-events: none;
    background: transparent;
    backdrop-filter: none;
  }

  html[data-hamrah-desktop="windows"] .pc-layer > .pc-panel {
    pointer-events: auto;
    inline-size: clamp(380px, 34vw, 468px);
    min-inline-size: 380px;
    max-inline-size: 468px;
    contain: layout paint style;
    box-shadow: 16px 0 44px rgba(2, 10, 18, .22);
    animation-duration: 180ms;
  }

  html[data-hamrah-desktop="windows"] .pc-panel-header {
    background: var(--pc-surface);
    backdrop-filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pc-tabs button,
  .pc-tabs button::after { transition: none; }
  .pc-shared-content[data-pc-direction] > * { animation: none; }
}