CT/dist/index.css

/* src/styles.css */
[unread] {
  border-left: 10px solid var(--text-warning);
}
:root {
  --split-thread-height: 8rem;
  --split-thread-width: 20rem;
}
.object-entry-wide {
  width: 320px;
  min-width: 320px;
}
#message-tab {
  flex-direction: column;
}
.chat-object-view {
  display: none;
}
[showingobjects] header {
  border-bottom: 1px solid var(--border);
}
[showingobjects] footer {
  display: none;
}
[showingobjects] .chat-object-view {
  display: flex;
  top: var(--header-height);
}
[showingobjects] .thread-view {
  display: none;
}
[showingobjects][chatvisible] .chat-object-view {
  right: var(--split-thread-width);
  border-right: 1px solid var(--border);
}
[showingobjects][chatvisible] .thread-view {
  top: var(--header-height);
  padding-top: var(--content-padding);
}
[showingobjects][chatvisible] :is(.thread-view, footer) {
  display: flex;
  right: 0px;
  left: unset;
  width: var(--split-thread-width);
}
@media (max-width: 1300px) {
  main:has([showingobjects][chatopen]) {
    display: flex;
  }
  main:has([showingobjects][chatopen]) #settings-tab {
    display: none;
  }
}
@media (max-width: 640px) {
  [showingobjects][chatvisible][chatopen] .chat-object-view {
    width: 100%;
    bottom: calc(var(--split-thread-height) + var(--control-height));
    border-right: none;
    border-bottom: 1px solid var(--border);
  }
  [showingobjects][chatvisible][chatopen] .thread-view {
    top: unset;
    bottom: calc(var(--control-height) + var(--safe-area-bottom));
    width: 100%;
    height: var(--split-thread-height);
    padding: 0px;
  }
  [showingobjects][chatvisible][chatopen] footer {
    width: 100%;
  }
}