web.telegram.org/k/ - dark sanitized by myfonj

/* ==UserStyle==
@name           web.telegram.org/k/ dark: sanitized
@namespace      github.com/openstyles/stylus
@version        1.2.0
@description    Just dims accent colours and fixes some annoyances.
@author         myfonj
@license        CC0
==/UserStyle== */

@-moz-document domain("web.telegram.org") {
 /* categorisation */
 /*
 Changelog
 1.2.0 (2024-01-18) - Avatars top-aligned, instead of bottom. (Still sticky, so always visible next to respective messages.)
 1.1.4 (2023-03-29) - No hover reaction bubble. Opinionated, I know, but let's use RMB, shall we?
 1.1.3 (2023-02-04) - Slammed in !importants, since it was kinda borked in Chrome without them.
 */
}

@-moz-document url-prefix("https://web.telegram.org/k/") {
 /* Feature:
  Redefine palette to dimmer variant that flattens (obliterates) gradients.
 */
 :root {
  --primary-color: darkslategray !important;
  --link-color: cyan !important;
  --message-out-background-color: var(--primary-color) !important;
  /* C/P from orig; just added opacity ...66; */
  --peer-avatar-red-top: #ff885e66 !important;
  --peer-avatar-red-bottom: #ff516a66 !important;
  --peer-avatar-orange-top: #ffcd6a66 !important;
  --peer-avatar-orange-bottom: #ffa85c66 !important;
  --peer-avatar-violet-top: #82b1ff66 !important;
  --peer-avatar-violet-bottom: #665fff66 !important;
  --peer-avatar-green-top: #a0de7e66 !important;
  --peer-avatar-green-bottom: #54cb6866 !important;
  --peer-avatar-cyan-top: #53edd666 !important;
  --peer-avatar-cyan-bottom: #28c9b766 !important;
  --peer-avatar-blue-top: #72d5fd66 !important;
  --peer-avatar-blue-bottom: #2a9ef166 !important;
  --peer-avatar-pink-top: #e0a2f366 !important;
  --peer-avatar-pink-bottom: #d669ed66 !important;
 }
 /* Feature:
  Hide the whimsical background patterns please
  (Two canvases in there.)
  (Yes, it can be set in prefs, but aint nobody have time for that.)
 */
 .chat-background-item {
  display: none !important;
 }
 /* Feature:
  Make typing caret more contrasting, instead of nearly invisible.
 */
 input, [contenteditable="true"] {
  caret-color: var(--primary-text-color) !important;
 }
 /* Feature:
  Place own messages to the left, instead of right, so the stream is more … streamlined.
 */
 .bubble.is-out {
  flex-direction: row;
 }
 .bubble.is-out > * {
  transform: scale(1) translatex(44px) !important;
  transform: scale(1) translatex(4px) !important;
 }
 /* Feature:
  Disable hover reaction "heart" bubble, since it is annoying and distracting.
  Just use the context menu like a regular human.
 */
 .bubble-hover-reaction {
  outline: #0FF6 solid; outline-offset: -2px;
  display: none;
 }
 /* Feature:
  Make avatars top-aligned in message clusters, instead of bottom, since it makes way more sense.
 */
 div.bubbles-group-avatar-container {
  flex-direction: row
 }
 /*
  Fix the notch to point towards the avatar.
 */
 .bubble.is-in.can-have-tail.is-group-first .bubble-tail {
  position: sticky;
  left: 30px;
  top: 0;
  width: 11px;
  height: 20px;
  z-index: -2;
  display: block;
  fill: var(--message-background-color);
  Xfill: red;
  transform: translateY(-1px) scale(1,-1);
  margin-inline-start: -8.4px;
 }
 .bubble.is-in.can-have-tail:not(.is-group-first) .bubble-tail {
  display: none;
 }
}