/* ZWORLD_CLASSIC_COMPOSER_V8_START */

    /*
     * Compositeur Classic commun :
     * trombone · champ · micro · émoticône · envoi dynamique.
     */

    .composer-box {
      position: relative;
    }

    .classic-emoji-wrap-v8 {
      position: relative;

      display: flex;
      align-items: center;
      justify-content: center;

      flex: 0 0 auto;
    }

    .classic-emoji-button-v8,
    .classic-send-v8 {
      width: 34px;
      height: 34px;

      padding: 0;

      display: grid !important;
      place-items: center;

      flex: 0 0 auto;

      border: 0;
      border-radius: 10px;

      color: #92929a;
      background: transparent;

      font: inherit;
      font-size: 17px;
      line-height: 1;

      cursor: pointer;

      transition:
        color .14s ease,
        background .14s ease,
        transform .14s ease,
        opacity .14s ease;
    }

    .classic-emoji-button-v8:hover,
    .classic-emoji-button-v8:focus-visible {
      color: #f4f4f5;

      background:
        rgba(255, 255, 255, .055);

      outline: none;
    }

    .classic-send-v8 {
      color: #f4f4f5;

      border:
        1px solid
        rgba(255, 255, 255, .12);

      background:
        linear-gradient(
          145deg,
          #29292f,
          #141417
        );

      box-shadow:
        inset 0 1px
        rgba(255, 255, 255, .075);

      font-size: 16px;
      font-weight: 800;
    }

    .classic-send-v8:hover,
    .classic-send-v8:focus-visible {
      color: #ffffff;

      background:
        linear-gradient(
          145deg,
          #36363d,
          #1b1b1f
        );

      transform: translateY(-1px);

      outline: none;
    }

    .classic-send-v8:active {
      transform: scale(.95);
    }

    .classic-send-v8[hidden] {
      display: none !important;
    }

    .classic-emoji-menu-v8 {
      position: absolute;
      right: 0;
      bottom: calc(100% + 10px);
      z-index: 80;

      width: min(
        252px,
        calc(100vw - 32px)
      );

      padding: 10px;

      display: none;
      grid-template-columns:
        repeat(6, minmax(32px, 1fr));

      gap: 5px;

      border:
        1px solid
        rgba(255, 255, 255, .11);

      border-radius: 14px;

      background:
        linear-gradient(
          155deg,
          rgba(22, 22, 26, .99),
          rgba(7, 7, 9, .995)
        );

      box-shadow:
        0 20px 55px
        rgba(0, 0, 0, .58);

      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
    }

    .classic-emoji-menu-v8.is-open {
      display: grid;
    }

    .classic-emoji-choice-v8 {
      min-width: 32px;
      height: 34px;

      padding: 0;

      display: grid;
      place-items: center;

      border: 0;
      border-radius: 9px;

      color: #f4f4f5;
      background: transparent;

      font-size: 19px;
      line-height: 1;

      cursor: pointer;

      transition:
        background .12s ease,
        transform .12s ease;
    }

    .classic-emoji-choice-v8:hover,
    .classic-emoji-choice-v8:focus-visible {
      background:
        rgba(255, 255, 255, .075);

      transform: scale(1.12);

      outline: none;
    }

    @media (max-width: 760px) {
      .classic-emoji-button-v8,
      .classic-send-v8 {
        width: 36px;
        height: 36px;
      }

      .classic-emoji-menu-v8 {
        right: -42px;

        width: min(
          246px,
          calc(100vw - 24px)
        );
      }
    }

    /* ZWORLD_CLASSIC_COMPOSER_V8_END */