OBSYouTubeLiveComment4K.css

@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP");

/* Background colors*/
body {
  overflow: hidden;
  background-color: rgba(0,0,0,0);
}
/* Transparent background.*/ 
yt-live-chat-renderer {
  background-color: transparent !important;
  /* padding: 24px 24px !important;*/
}
yt-live-chat-text-message-renderer {
  background-image: linear-gradient(to right, rgba(204,204,204,0.05), rgba(204,204,204,0.3));
  margin: 16px 24px !important;
}

yt-live-chat-author-chip #author-name {
  background-color: transparent !important;
}
/* Outlines */
yt-live-chat-renderer * {
  font-family: "Noto Sans JP";
  font-size: 20px !important;
  line-height: 20px !important;
}

yt-live-chat-text-message-renderer #content,
yt-live-chat-legacy-paid-message-renderer #content {
  overflow: initial !important;
}

/* Hide scrollbar. */
yt-live-chat-item-list-renderer #items{
  overflow: hidden !important;
}

yt-live-chat-item-list-renderer #item-scroller{
  overflow: hidden !important;
}

/* Hide header and input. */
yt-live-chat-header-renderer,
yt-live-chat-message-input-renderer {
  display: none !important;
}

/* Reduce side padding. */
yt-live-chat-text-message-renderer,
yt-live-chat-legacy-paid-message-renderer {
  padding: 16px 24px !important;
}

yt-live-chat-paid-message-renderer #header {
  padding: 16px 24px !important;
}

/* Avatars. */
yt-live-chat-text-message-renderer #author-photo,
/*yt-live-chat-paid-message-renderer #author-photo,*/
yt-live-chat-legacy-paid-message-renderer #author-photo {
  width: 48px !important;
  height: 48px !important;
  border-radius: 48px !important;
  margin-right: 24px !important;
}

/* アイコン画像自体も引き伸ばす */
yt-live-chat-text-message-renderer #author-photo img.style-scope.yt-img-shadow {
    zoom: 2.0;
}
yt-live-chat-paid-message-renderer #author-photo img.style-scope.yt-img-shadow {
    zoom: 2.0;
}

/* Hide badges. */
yt-live-chat-text-message-renderer #author-badges {
  display: none !important;
  vertical-align: text-top !important;
}

/* Badges. */
yt-live-chat-text-message-renderer #author-name[type="owner"],
yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="owner"] {
  color: #ffd600 !important;
  zoom: 1.5;
}

yt-live-chat-text-message-renderer #author-name[type="moderator"],
yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="moderator"] {
  display: block;
  color: #5e84f1 !important;
  zoom: 1.5;
}

yt-live-chat-text-message-renderer #author-name[type="member"],
yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="member"] {
  color: #0f9d58 !important;
  zoom: 1.5;
}


/* Channel names. */
yt-live-chat-text-message-renderer #author-name {
  color: #eeeeee !important;
  font-family: "Noto Sans JP";
  font-size: 28px !important;
  line-height: 48px !important;
}

/*モデレータの色*/
yt-live-chat-text-message-renderer #author-name.moderator.style-scope.yt-live-chat-author-chip {
    color: #5e84f1 !important;
}

/* Messages. */
yt-live-chat-text-message-renderer #message,
yt-live-chat-text-message-renderer #message * {
  color: #cccccc !important;
  font-family: "Noto Sans JP";
  font-size: 36px !important;
  line-height: 48px !important;
  display: block; /*Messages Appear Under Author Name Instead Of Beside It*/
  /*padding: 12px 2px !important;*/
}

/* SuperChat/Fan Funding Messages. */
yt-live-chat-paid-message-renderer #author-name,
yt-live-chat-paid-message-renderer #author-name *,
yt-live-chat-legacy-paid-message-renderer #event-text,
yt-live-chat-legacy-paid-message-renderer #event-text * {
  color: #ffffff !important;
  font-family: "Noto Sans JP";
  font-size: 32px !important;
  line-height: 36px !important;
}

yt-live-chat-paid-message-renderer #purchase-amount,
yt-live-chat-paid-message-renderer #purchase-amount *,
yt-live-chat-legacy-paid-message-renderer #detail-text,
yt-live-chat-legacy-paid-message-renderer #detail-text * {
  color: #ffffff !important;
  font-family: "Noto Sans JP";
  font-size: 28px !important;
  line-height: 32px !important;
}

yt-live-chat-paid-message-renderer #content,
yt-live-chat-paid-message-renderer #content * {
  color: #ffffff !important;
  font-family: "Noto Sans JP";
  font-size: 28px !important;
  line-height: 32px !important;
}

yt-live-chat-paid-message-renderer {
  margin: 8px 0 !important;
}

yt-live-chat-legacy-paid-message-renderer {
  background-color: #0f9d58 !important;
  margin: 8px 0 !important;
}

yt-live-chat-text-message-renderer a,
yt-live-chat-legacy-paid-message-renderer a {
  text-decoration: none !important;
}

yt-live-chat-text-message-renderer[is-deleted],
yt-live-chat-legacy-paid-message-renderer[is-deleted] {
  display: none !important;
}

yt-live-chat-ticker-renderer {
  background-color: transparent !important;
  box-shadow: none !important;
}
yt-live-chat-ticker-renderer {
  display: none !important;
}


yt-live-chat-ticker-paid-message-item-renderer,
yt-live-chat-ticker-paid-message-item-renderer *,
yt-live-chat-ticker-sponsor-item-renderer,
yt-live-chat-ticker-sponsor-item-renderer * {
  color: #ffffff !important;
  font-family: "Noto Sans JP";
}

yt-live-chat-mode-change-message-renderer, 
yt-live-chat-viewer-engagement-message-renderer, 
yt-live-chat-restricted-participation-renderer {
  display: none !important;
}

@keyframes anim {
0% { opacity: 0; }
0.6578947368421052% { opacity: 1; transform: none;}
99.3421052631579% { opacity: 1; transform: none;}
100% { opacity: 0; }
}

yt-live-chat-text-message-renderer,
yt-live-chat-legacy-paid-message-renderer {
  animation: anim 41600ms;
  animation-fill-mode: both;
}