cyb/src/features/sense/ui/SenseViewer/SenseViewerHeader/SenseViewerHeader.module.scss

.header {
  // display: grid;
  // grid-template-areas:
  //   'avatar title'
  //   'avatar text';

  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 10px 15px;
  gap: 0 10px;
  position: relative;

  &::before {
    content: '';
    bottom: -10px;
    position: absolute;
    left: -25px;
    height: 20%;
    pointer-events: none;
    right: -10px;
    filter: blur(10px);
    background-image: linear-gradient(
      to bottom,
      rgb(0 0 0 / 48.4%),
      rgb(0 0 0 / 100%)
    );
  }

  .meta {
    > div {
      min-width: unset;
      padding: 0;

      // content type
      > :nth-child(1) {
        > :nth-child(1) {
          display: none;
        }
      }

      // moon
      > :last-child {
        > :last-child {
          display: none;
        }
      }
    }
  }

  & > :nth-child(1) {
    grid-area: avatar;
  }

  .title {
    font-size: 16px;
    text-transform: none;
    grid-area: title;
    margin-top: 15px;
    max-height: 150px;
    overflow: hidden;
    color: white;

    img {
      width: auto;
      max-height: 100px;
    }

    > div {
      display: flex;
      justify-content: center;
      overflow: hidden;
    }

    > div > div {
      // display: -webkit-box;
      // -webkit-line-clamp: 5;
      // -webkit-box-orient: vertical;
      * {
        line-height: normal;
      }

      min-height: 50px;
    }
  }

  > p {
    grid-area: text;
    font-size: 14px;

    button {
      color: rgb(255 255 255 / 50%);
    }
  }
}

.header_Neuron {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0 5px;
}