.evan-friends .sub-text {word-break: break-all;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}.evan-friends .evan-f-left {width: 100px;min-width: 100px;display: flex;align-items: center;justify-content: center;transition: all 0.5s ease-in-out;}.evan-friends .evan-f-left .f-avatar {width: 60px;height: 60px;box-sizing: border-box;padding: 3px;border-radius: 50%;overflow: hidden;transition: all 0.5s ease-in-out;}.evan-f-left .f-avatar .avatar {width: 100%;height: 100%;border-radius: 50%;margin: 0;object-fit: cover;}.evan-friends .evan-f-right {flex-grow: 1;display: flex;flex-direction: column;align-items: center;justify-content: center;box-sizing: border-box;}.evan-friends .joe_detail__friends-item .contain {border-radius: 12px;}.evan-friends .joe_detail__friends-item .contain .title::after {display: none;}.evan-friends .title {max-width: 70%;min-width: 70%;display: flex;align-items: center;justify-content: center;font-weight: 700;font-size: 1.3em;color: var(--fcolor);}.evan-friends .title .icon {width: 1em;min-width: 1em;height: 1em;min-height: 1em;fill: currentColor;overflow: hidden;font-size: 20px;margin-left: 3px;}.evan-friends .content {margin-top: 10px !important;font-size: 0.93em;color: var(--fcolor);}.evan-friends .joe_detail__friends-item .contain .content .desc {-webkit-line-clamp: 1;}.evan-friends .contain {display: flex;align-items: center;position: relative;transition: background-color 0.1s ease-in-out, border 0.2s ease-in-out;border: 1px solid transparent;}.evan-friends .contain:hover {transform: none;background-color: var(--fcolor) !important;box-shadow: 0px 0px 20px -5px rgb(158 158 158 / 20%);border-color: var(--fcolor);}.evan-friends .contain::before {content: "";position: absolute;left: 0;top: 0;bottom: 0;right: 0;z-index: -1;background-color: var(--fcolor) !important;transform: scale(0);transition: all 0.5s ease-in-out;transform-origin: right bottom;border-bottom-left-radius: 12px;}.evan-friends .contain:hover::before {}.evan-friends .contain:hover .title, .evan-friends .contain:hover .content {color: #ffffff !important;}.evan-friends .contain:hover .title .icon {display: none;}.evan-friends .contain:hover .evan-f-left {margin-left: -200px;}.evan-friends .contain:hover .evan-f-right {padding-left: 100px;}.evan-friends .contain:hover .f-avatar {transform: rotateZ(-360deg);}@media (max-width: 768px) {.evan-friends .contain {border-color: #ebeef5;}.evan-friends .contain:hover {border-color: var(--fcolor);box-shadow: 0px 0px 20px -5px rgb(158 158 158 / 20%);}}