;

        animation:      fadeIn      0.3s      ease;

        }

        @keyframes      fadeIn      {

        from      {      opacity:      0;      transform:      translateY(10px);      }

        to      {      opacity:      1;      transform:      translateY(0);      }

        }

        .chat-left      {

        background:      f1f1f1;

        align-self:      flex-start;

        border-bottom-left-radius:      4px;

        }

        .chat-right      {

        background:      000;

        color:      white;

        align-self:      flex-end;

        border-bottom-right-radius:      4px;

        }

        .chat-container      {

        display:      flex;

        flex-direction:      column;

        padding:      16px;

        height:      calc(100%      -      140px);

        overflow-y:      auto;

        }

        .photo-item      {

        width:      100%;

        height:      110px;

        object-fit:      cover;

        border-radius:      12px;

        cursor:      pointer;

        transition:      all      0.3s      ease;

        }

        .photo-item:hover      {

        transform:      scale(1.03);

        box-shadow:      0      4px      12px      rgba(0,      0,      0,      0.15);

        }

        .photo-grid      {

        display:      grid;

        grid-template-columns:      repeat(3,      1fr);

        gap:      8px;

        padding:      16px;

        }

        .memo-item      {

        display:      flex;

        align-items:      center;

        padding:      12px      0;

        border-bottom:      1px      solid      rgba(0,      0,      0,      0.05);

        transition:      all      0.2s      ease;