twip-chat-dc.css

/*
 * author: kuriyama hibiya <kuriyama hibiya moe>
 * license: MIT
 */

* {
  box-sizing: border-box;
}
html {
  font-size: 16px !important;
}
body {
  position: absolute;
  bottom: 0;
  margin: 0;
  width: 100%;
  -webkit-mask-image: none;

  font-size: 0.875rem;
  font-family: 'Nanum Gothic';
}
#log {
  font-size: 1rem !important;
  padding: 0;
  width: 100%;
  text-shadow: none;
  color: #000 !important;
  line-height: 1.25rem;
}
#log > div {
  position: relative;
  margin: 0;
  padding: 0.375rem 0.6375rem 0.375rem 0.6375rem;
  width: 100%;
  letter-spacing: -0.0625rem;
  background: #fff;
  /* overflow: hidden; */
  border-top: 0.0625rem solid #d3d3d3;
}
.meta {
  display: flex;
  text-shadow: none;
  color: #000 !important;

  position: relative;
  padding: 0 0 0.25rem 0;
  font-size: 0.875rem;
  line-height: 1.25rem;
  z-index: 10;
}
.meta > img {
  display: none;
}
.meta > .name {
  display: inline-flex;
  font-weight: inherit !important;
}
.meta > .colon {
  display: none;
}
.name::before {
  content: '[';
}
.meta::after {
  content: ']';
}

.meta > .name::after {
  display: none;
  content: '';
  width: 1.125rem;
  height: 1.125rem;

  background-position: 0.25rem center;
  background-size: 0.75rem;
  background-repeat: no-repeat;
}


.broadcaster .meta > .name::after { /* 노딱 */
  display: inline-block;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAVUExURUxpcf///11EGvWJH/+uAP/sAXBgO0jmNiUAAAABdFJOUwBA5thmAAAASElEQVQY02NgwA2UYACdo+QCA0pYOIIggI0DZAARKRxjsHZjY2NMDhDg4EBVIXPM0tLSIMqAwCw0NAyVA/OcGiYHCthQOEDTAH7LKKU2BDTMAAAAAElFTkSuQmCC') !important;
}
.moderator .meta > .name::after { /* 파딱 */
  display: inline-block;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAVUExURUxpcVCf5P///x5LrSV1wv/sAXBgO/Nfa5gAAAABdFJOUwBA5thmAAAASElEQVQY02NgwA2MYQCdYywIA8ZYOEoggI0DZAARKRwXsHYXFxdMDhDg4EBVIXPc0tLSIMqAwC00NAyVA/OcGSYHCthQOEDTALb3KfTU8hHeAAAAAElFTkSuQmCC');
}
.subscriber .meta > .name::after { /* 고닉 */
  display: inline-block;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAVUExURUxpcf///2tra6SkpMnJyf/sAXBgOxhpRPYAAAABdFJOUwBA5thmAAAASElEQVQY02NgwA2UYACdo+QCA0pYOIIggI0DZAARKRxjsHZjY2NMDhDg4EBVIXPM0tLSIMqAwCw0NAyVA/OcGiYHCthQOEDTAH7LKKU2BDTMAAAAAElFTkSuQmCC');
}
.bits .meta > .name::after { /* 유동 */
  display: inline-block;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAPUExURUxpcf///2tra6SkpMnJyTFXMQwAAAABdFJOUwBA5thmAAAAN0lEQVQY02NgwA2UYACdo+QCA0pYOIIggI0DZAARKRxjsHZjY2NMDhDg4EBVYeHAADoHt09xAgCYciJngBtGwAAAAABJRU5ErkJggg==');
}

.message {
  display: block;
  padding: 0;
  max-height: 14rem;
  font-size: 0.875rem;
}

.meta::before {
  display: inline-block;
  color: #989898;
  font-size: 0.75rem;
  order: 10;
  flex-grow: 10;
  text-align: right;
}

#log > div[data-from^="a"][class=""] .meta::before,
#log > div[data-from^="a"].premium   .meta::before { content: '121.190.*.*' }
#log > div[data-from^="b"][class=""] .meta::before,
#log > div[data-from^="b"].premium   .meta::before { content: '39.7.*.*' }
#log > div[data-from^="c"][class=""] .meta::before,
#log > div[data-from^="c"].premium   .meta::before { content: '211.234.*.*' }
#log > div[data-from^="d"][class=""] .meta::before,
#log > div[data-from^="d"].premium   .meta::before { content: '122.202.*.*' }
#log > div[data-from^="e"][class=""] .meta::before,
#log > div[data-from^="e"].premium   .meta::before { content: '210.125.*.*' }
#log > div[data-from^="f"][class=""] .meta::before,
#log > div[data-from^="f"].premium   .meta::before { content: '106.102.*.*' }
#log > div[data-from^="g"][class=""] .meta::before,
#log > div[data-from^="g"].premium   .meta::before { content: '175.202.*.*' }
#log > div[data-from^="h"][class=""] .meta::before,
#log > div[data-from^="h"].premium   .meta::before { content: '223.38.*.*' }
#log > div[data-from^="i"][class=""] .meta::before,
#log > div[data-from^="i"].premium   .meta::before { content: '61.43.*.*' }
#log > div[data-from^="j"][class=""] .meta::before,
#log > div[data-from^="j"].premium   .meta::before { content: '175.252.*.*' }
#log > div[data-from^="k"][class=""] .meta::before,
#log > div[data-from^="k"].premium   .meta::before { content: '39.7.*.*' }
#log > div[data-from^="l"][class=""] .meta::before,
#log > div[data-from^="l"].premium   .meta::before { content: '211.36.*.*' }
#log > div[data-from^="m"][class=""] .meta::before,
#log > div[data-from^="m"].premium   .meta::before { content: '203.226.*.*' }
#log > div[data-from^="n"][class=""] .meta::before,
#log > div[data-from^="n"].premium   .meta::before { content: '223.62.*.*' }
#log > div[data-from^="o"][class=""] .meta::before,
#log > div[data-from^="o"].premium   .meta::before { content: '223.39.*.*' }
#log > div[data-from^="p"][class=""] .meta::before,
#log > div[data-from^="p"].premium   .meta::before { content: '223.38.*.*' }
#log > div[data-from^="q"][class=""] .meta::before,
#log > div[data-from^="q"].premium   .meta::before { content: '115.161.*.*' }
#log > div[data-from^="r"][class=""] .meta::before,
#log > div[data-from^="r"].premium   .meta::before { content: '117.111.*.*' }
#log > div[data-from^="s"][class=""] .meta::before,
#log > div[data-from^="s"].premium   .meta::before { content: '175.223.*.*' }
#log > div[data-from^="t"][class=""] .meta::before,
#log > div[data-from^="t"].premium   .meta::before { content: '223.62.*.*' }
#log > div[data-from^="u"][class=""] .meta::before,
#log > div[data-from^="u"].premium   .meta::before { content: '223.57.*.*' }
#log > div[data-from^="v"][class=""] .meta::before,
#log > div[data-from^="v"].premium   .meta::before { content: '223.32.*.*' }
#log > div[data-from^="w"][class=""] .meta::before,
#log > div[data-from^="w"].premium   .meta::before { content: '223.39.*.*' }
#log > div[data-from^="x"][class=""] .meta::before,
#log > div[data-from^="x"].premium   .meta::before { content: '110.70.*.*' }
#log > div[data-from^="y"][class=""] .meta::before,
#log > div[data-from^="y"].premium   .meta::before { content: '223.33.*.*' }
#log > div[data-from^="z"][class=""] .meta::before,
#log > div[data-from^="z"].premium   .meta::before { content: '122.32.*.*' }
#log > div[data-from^="_"][class=""] .meta::before,
#log > div[data-from^="_"].premium   .meta::before { content: '2001:2d8.*.*' }
#log > div[data-from^="1"][class=""] .meta::before,
#log > div[data-from^="1"].premium   .meta::before { content: '223.38.*.*' }
#log > div[data-from^="2"][class=""] .meta::before,
#log > div[data-from^="2"].premium   .meta::before { content: '114.200.*.*' }
#log > div[data-from^="3"][class=""] .meta::before,
#log > div[data-from^="3"].premium   .meta::before { content: '106.10.*.*' }
#log > div[data-from^="4"][class=""] .meta::before,
#log > div[data-from^="4"].premium   .meta::before { content: '117.111.*.*' }
#log > div[data-from^="5"][class=""] .meta::before,
#log > div[data-from^="5"].premium   .meta::before { content: '121.190.*.*' }
#log > div[data-from^="6"][class=""] .meta::before,
#log > div[data-from^="6"].premium   .meta::before { content: '122.202.*.*' }
#log > div[data-from^="7"][class=""] .meta::before,
#log > div[data-from^="7"].premium   .meta::before { content: '175.202.*.*' }
#log > div[data-from^="8"][class=""] .meta::before,
#log > div[data-from^="8"].premium   .meta::before { content: '223.38.*.*' }
#log > div[data-from^="9"][class=""] .meta::before,
#log > div[data-from^="9"].premium   .meta::before { content: '210.125.*.*' }
#log > div[data-from^="0"][class=""] .meta::before,
#log > div[data-from^="0"].premium   .meta::before { content: '211.36.*.*' }