#wrekt-chat-lattice {
  display: none;
  position: absolute;
  inset: 86px 0 150px 0;
  z-index: 0;
  width: 100%;
  height: auto;
  pointer-events: none;
  opacity: .42;
}

body[data-layout-mode^="phone-"][data-mobile-pane="chat"] #wrekt-chat-lattice { display: block; }
body[data-layout-mode="phone-landscape"][data-mobile-pane="chat"] #wrekt-chat-lattice { display: block; inset: 38px 0 48px 0; }

body[data-layout-mode^="phone-"] .chat-tabs,
body[data-layout-mode^="phone-"] .room-header,
body[data-layout-mode^="phone-"] #room-list,
body[data-layout-mode^="phone-"] .message-list,
body[data-layout-mode^="phone-"] .symbol-strip,
body[data-layout-mode^="phone-"] .composer { position: relative; z-index: 1; }
body[data-layout-mode^="phone-"] .rooms-drawer-scrim { z-index: 78 !important; }
body[data-layout-mode^="phone-"] .rooms-drawer { z-index: 79 !important; }
body[data-layout-mode^="phone-"] .message-list,
body[data-layout-mode^="phone-"] .composer { background-color: rgba(15, 21, 28, .82); backdrop-filter: blur(1.5px); }

body[data-layout-mode^="phone-"] .chat-panel.chat-lattice-fallback .message-list {
  background-image:
    radial-gradient(circle at 18% 22%, rgba(47, 207, 208, .10) 0 1px, transparent 1.5px),
    radial-gradient(circle at 76% 63%, rgba(58, 211, 128, .08) 0 1px, transparent 1.5px),
    linear-gradient(rgba(47, 207, 208, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47, 207, 208, .035) 1px, transparent 1px);
  background-size: 92px 92px, 128px 128px, 36px 36px, 36px 36px;
}

@media (prefers-reduced-motion: reduce) {
  #wrekt-chat-lattice { display: none !important; }
}