/* unified-inbox-20260907-180616-a153e7 · Native layered proof in the shared banner slot. */
#section-inbox-conversations .inbox-composites { text-align: left; }
#section-inbox-conversations .ib-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-bottom: 28px; }
#section-inbox-conversations .ib-tab { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; text-align: left; padding: 0 2px 20px; border-bottom: 3px solid #e5e7eb; color: #646b76; cursor: pointer; }
#section-inbox-conversations .ib-tab-title { display: block; font-size: 18px; font-weight: 700; line-height: 1.4; margin-bottom: 8px; }
#section-inbox-conversations .ib-tab-desc { display: block; font-size: 15px; line-height: 1.6; }
#section-inbox-conversations .ib-tab[aria-selected="true"] { border-color: #1f5fe0; color: #334155; }
#section-inbox-conversations .ib-tab[aria-selected="true"] .ib-tab-title { color: #1f5fe0; }
#section-inbox-conversations .ib-tab:focus-visible, #section-inbox-conversations .ib-panel:focus-visible { outline: 3px solid #1f5fe0; outline-offset: 6px; border-radius: 4px; }
#section-inbox-conversations .ib-panel[hidden] { display: none; }
#section-inbox-conversations .ib-admin { isolation: isolate; inset: 4% 2% auto; display: grid; grid-template-columns: 72px minmax(0, 1fr); border: 1px solid var(--ui-line); }
#section-inbox-conversations .ib-workspace, #section-inbox-conversations .ib-columns > * { min-width: 0; }
#section-inbox-conversations .ib-heading { background: #f4f6f8; }
#section-inbox-conversations .ib-columns { display: grid; grid-template-columns: 210px minmax(0, 1fr) 278px; }
#section-inbox-conversations .ib-list { border-right: 1px solid var(--ui-line); }
#section-inbox-conversations .ib-selected { background: #edf3ff; }
#section-inbox-conversations .ib-chat { display: flex; flex-direction: column; }
#section-inbox-conversations .ib-chat-conversation > .ui-head { min-height: 64px; padding-block: 10px; }
#section-inbox-conversations .ib-thread { display: flex; flex-direction: column; gap: 10px; padding: 14px 18px; }
#section-inbox-conversations .ib-date { align-self: center; }
#section-inbox-conversations .ib-message { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; max-width: 92%; }
#section-inbox-conversations .ib-reply { align-self: flex-end; align-items: flex-end; }
#section-inbox-conversations .ib-reply .ui-bubble { background: #eef4ff; border-color: #dfe9fc; border-radius: 14px 4px 14px 14px; }
#section-inbox-conversations .ib-composer { padding: 0 18px 16px; margin-top: auto; }
#section-inbox-conversations .ib-composer .ui-row { margin-top: 12px; }
#section-inbox-conversations .ib-detail { border-left: 1px solid var(--ui-line); }
#section-inbox-conversations .ib-detail-heading { min-height: 64px; }
#section-inbox-conversations .ib-detail-group { border-top: 1px solid var(--ui-line); }
/* Dim only the admin frame; the chosen native surface paints above this layer.
   No opacity/filter is applied to ancestors, so the spotlight remains fully clear. */
#section-inbox-conversations .ib-admin::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; border-radius: inherit; background: rgba(15, 23, 42, .42); }
#section-inbox-conversations .ib-spotlight { position: relative; z-index: 2; background: var(--ui-card); border-radius: 14px; overflow: hidden; box-shadow: 0 8px 28px rgba(15, 23, 42, .18), 0 0 0 1px rgba(255, 255, 255, .35); }
#section-inbox-conversations .ib-detail .ui-val { white-space: normal; }
@media (min-width: 1024px) {
  #section-inbox-conversations .ib-columns { min-height: 522px; }
}
@media (max-width: 1199px) {
  #section-inbox-conversations .ib-composite .cmp-canvas { aspect-ratio: auto; display: flex; flex-direction: column; }
  #section-inbox-conversations .ib-composite .cmp-field { position: relative; inset: auto; width: 100%; height: 90px; flex: none; }
  #section-inbox-conversations .ib-composite .ib-admin { position: relative; inset: auto; width: auto; display: block; margin: -66px 8px 16px; }
  #section-inbox-conversations .ib-sidebar, #section-inbox-conversations .ib-list { display: none; }
  #section-inbox-conversations .ib-columns { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  #section-inbox-conversations .ib-detail { border-left: 0; border-top: 1px solid var(--ui-line); }
  #section-inbox-conversations .ib-detail-heading { min-height: 0; }
  #section-inbox-conversations .ib-followup, #section-inbox-conversations .ib-composer { display: none; }
  #section-inbox-conversations .ib-thread { gap: 12px; }
}
@media (max-width: 1023px) {
  #section-inbox-conversations .ib-tabs { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  #section-inbox-conversations .ib-tab { padding-bottom: 12px; }
  #section-inbox-conversations .ib-tab:not([aria-selected="true"]) .ib-tab-desc { display: none; }
  #section-inbox-conversations .ib-tab-title { margin: 0; }
  #section-inbox-conversations .ib-tab[aria-selected="true"] .ib-tab-desc { margin-top: 8px; }
}

@media (min-width: 1024px) and (max-width: 1199px) {
  #section-inbox-conversations .ib-columns { grid-template-columns: minmax(0, 1fr) 278px; }
  #section-inbox-conversations .ib-detail { border-top: 0; border-left: 1px solid var(--ui-line); }
}

#section-inbox-conversations .ib-heading .ui-btn { gap: 6px; font-size: 13px; }
#section-inbox-conversations .ib-tools { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px; margin-top: 8px; }
#section-inbox-conversations .ib-tool { display: flex; align-items: center; gap: 5px; font-size: 12px; color: var(--ui-ink2); }
#section-inbox-conversations .ib-detail-group > .ui-head { padding-block: 10px; }

/* Shared content across all three highlight states. */
#section-inbox-conversations .ib-composite .cmp-canvas {
  aspect-ratio: auto;
  display: block;
  padding: 24px 2%;
}
#section-inbox-conversations .ib-composite .ib-admin {
  position: relative;
  inset: auto;
  width: 100%;
  margin: 0;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .1);
}
/* Newly visible tab panels must not restart the dimming animation. */
#section-inbox-conversations .ib-panel:not([hidden]) .ib-composite .ib-admin::after {
  animation: none;
  opacity: 1;
}
#section-inbox-conversations .ib-spotlight {
  box-shadow: none;
}
/* A single content model is used in every step; only the spotlight moves. */
#section-inbox-conversations .ib-admin[data-inbox-state="shared"] .ib-list .ui-ch {
  width: 20px;
  height: 20px;
}
#section-inbox-conversations .ib-initial-avatar,
.inbox-additions .ib-initial-avatar {
  background: var(--ib-avatar-color);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}
@media (max-width: 1199px) {
  #section-inbox-conversations .ib-composite .cmp-canvas {
    padding: 0 8px 16px;
  }
  #section-inbox-conversations .ib-admin[data-inbox-state="shared"] .ib-list,
  #section-inbox-conversations .ib-admin[data-inbox-state="shared"] .ib-composer {
    display: block;
  }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  #section-inbox-conversations .ib-admin[data-inbox-state="shared"] .ib-columns {
    grid-template-columns: 210px minmax(0, 1fr) 278px;
  }
}