/* Opaque stationary surfaces; transform for nested pages, opacity for tabs. */
.conversation { overflow:hidden; }
.navigation-moving { will-change: transform; transition:none!important; animation:none!important; }
.navigation-moving[data-navigation-direction=tab] { will-change:opacity; }
.chat-list-screen,.contacts-content { display:flex; flex-direction:column; flex:1; min-height:0; width:100%; overflow:hidden; background:inherit; }
.profile-screen { position:relative; min-height:100%; }
.profile-panel { overflow-x:hidden; }
.settings-screen { display:flex; flex-direction:column; flex:1; min-height:0; width:100%; height:100%; overflow:hidden; background:var(--bg); }
#settings-panel { overflow:hidden; }
.profile-loading { padding:24px 8px; color:var(--muted); }
.navigation-loading { padding:24px; color:var(--muted); text-align:center; }
/* Press, keyboard focus and persistent selection are independent states. */
body,body.light { --press:color-mix(in srgb,var(--accent) 9%,var(--panel)); --ux-pressed:var(--press); }
button,a,input,textarea,select,label,[role=button] { -webkit-tap-highlight-color:transparent; }
button:active:not(:disabled) { transform:none; filter:none; background:var(--press); }
button:focus:not(:focus-visible) { outline:none; }
button:focus-visible,[tabindex]:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.orbit-nav-button[aria-current=true]:active { background:var(--selected); }
.orb-bottom-nav { transform:none; transition:none; animation:none; }
@media(max-width:850px),(max-height:500px) and (pointer:coarse) {
  #app { position:relative; overflow:hidden; isolation:isolate; }
  /* Keep the real list mounted while the conversation covers it. */
  #app.chat-open > #chat-sidebar { display:flex; }
  #app > .conversation { position:absolute; inset:0; z-index:2; width:100%; height:100%; background:var(--bg); }
  #app > #chat-sidebar { background:var(--panel); }
  #app.chat-open > #chat-sidebar { padding-bottom:64px; }
  #user-profile-panel { background:var(--panel); }
  body:has(#user-profile-panel[open]) .orb-bottom-nav { display:none; }
  #chat-list .chat-card.selected { background:transparent; box-shadow:none; }
  #chat-list .chat-card:active:not(:disabled) { background:var(--press); }
}
@media(hover:none) {
  #chat-list .chat-card:not(.selected):hover { background:transparent; }
  #chat-list .chat-card:active:not(:disabled) { background:var(--press); }
}