.friends-page[data-v-331884f8]{padding:20px;background:#161823;min-height:100vh;color:#fff}.page-header[data-v-331884f8]{margin-bottom:30px;text-align:center}.page-header h2[data-v-331884f8]{color:#fff;font-size:28px;font-weight:600;margin:0 0 8px 0}.page-header p[data-v-331884f8]{color:#8a919e;font-size:14px;margin:0}.friends-content[data-v-331884f8]{max-width:800px;margin:0 auto}.friends-list[data-v-331884f8]{background:#22242a;border-radius:12px;padding:20px;margin-bottom:24px}.friends-list .friends-title[data-v-331884f8]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px;margin-bottom:16px;color:#fff;font-size:16px;font-weight:600}.friends-list .friends-title i[data-v-331884f8]{color:#fe2c55;font-size:18px}.friends-list .friends-avatars[data-v-331884f8]{display:-webkit-box;display:-ms-flexbox;display:flex;gap:16px;overflow-x:auto;padding:8px 0}.friends-list .friends-avatars[data-v-331884f8]::-webkit-scrollbar{display:none}.friends-list .friend-avatar[data-v-331884f8]{-ms-flex-negative:0;flex-shrink:0;text-align:center;cursor:pointer;position:relative;-webkit-transition:all .3s ease;transition:all .3s ease}.friends-list .friend-avatar[data-v-331884f8]:hover{-webkit-transform:translateY(-4px);transform:translateY(-4px)}.friends-list .friend-avatar.active[data-v-331884f8]{-webkit-transform:scale(1.1);transform:scale(1.1)}.friends-list .friend-avatar.active img[data-v-331884f8]{border-color:#fe2c55;-webkit-box-shadow:0 0 12px rgba(254,44,85,.4);box-shadow:0 0 12px rgba(254,44,85,.4)}.friends-list .friend-avatar.add-friend .add-icon[data-v-331884f8]{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;color:#fff;font-size:20px;margin-bottom:8px;-webkit-transition:all .3s ease;transition:all .3s ease}.friends-list .friend-avatar.add-friend .add-icon[data-v-331884f8]:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}.friends-list .friend-avatar img[data-v-331884f8]{width:48px;height:48px;border-radius:50%;-o-object-fit:cover;object-fit:cover;border:2px solid #2f2f37;margin-bottom:8px;-webkit-transition:all .3s ease;transition:all .3s ease}.friends-list .friend-avatar .friend-name[data-v-331884f8]{display:block;color:#8a919e;font-size:12px;max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.friends-list .friend-avatar .new-badge[data-v-331884f8]{position:absolute;top:-2px;right:-2px;width:12px;height:12px;background:#fe2c55;border-radius:50%;border:2px solid #161823}.video-timeline .timeline-item[data-v-331884f8]{margin-bottom:24px;cursor:pointer}.video-timeline .timeline-item .timeline-date[data-v-331884f8]{text-align:center;margin-bottom:12px}.video-timeline .timeline-item .timeline-date span[data-v-331884f8]{background:#2f2f37;color:#8a919e;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500}.video-timeline .timeline-item .video-card[data-v-331884f8]{background:#22242a;border-radius:12px;overflow:hidden;-webkit-transition:all .3s ease;transition:all .3s ease}.video-timeline .timeline-item .video-card[data-v-331884f8]:hover{-webkit-transform:translateY(-2px);transform:translateY(-2px);-webkit-box-shadow:0 8px 24px rgba(0,0,0,.3);box-shadow:0 8px 24px rgba(0,0,0,.3)}.video-cover[data-v-331884f8]{position:relative;width:100%;height:240px;overflow:hidden}.video-cover .cover-img[data-v-331884f8]{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.video-cover .play-icon[data-v-331884f8]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:48px;height:48px;background:rgba(0,0,0,.6);border-radius:50%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;color:#fff;font-size:20px;backdrop-filter:blur(10px)}.video-cover .video-duration[data-v-331884f8]{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.7);color:#fff;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500}.video-content[data-v-331884f8]{padding:16px}.video-content .video-header[data-v-331884f8]{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:12px}.video-content .video-header .author-info[data-v-331884f8],.video-content .video-header[data-v-331884f8]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.video-content .video-header .author-info[data-v-331884f8]{gap:12px}.video-content .video-header .author-info .author-avatar[data-v-331884f8]{width:40px;height:40px;border-radius:50%;-o-object-fit:cover;object-fit:cover;border:2px solid #fe2c55}.video-content .video-header .author-info .author-details[data-v-331884f8]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:2px}.video-content .video-header .author-info .author-details .author-name[data-v-331884f8]{color:#fff;font-size:14px;font-weight:600}.video-content .video-header .author-info .author-details .publish-time[data-v-331884f8]{color:#8a919e;font-size:12px}.video-content .video-header .friendship-badge[data-v-331884f8]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:4px;background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff;padding:4px 8px;border-radius:12px;font-size:12px;font-weight:500}.video-content .video-header .friendship-badge i[data-v-331884f8]{font-size:14px}.video-content .video-title[data-v-331884f8]{color:#fff;font-size:16px;font-weight:600;line-height:1.4;margin-bottom:8px}.video-content .video-description[data-v-331884f8]{color:#8a919e;font-size:14px;line-height:1.5;margin-bottom:16px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-content .video-stats[data-v-331884f8]{display:-webkit-box;display:-ms-flexbox;display:flex;gap:20px}.video-content .video-stats .stat-item[data-v-331884f8]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:4px;color:#8a919e;font-size:12px;cursor:pointer;-webkit-transition:color .3s ease;transition:color .3s ease}.video-content .video-stats .stat-item[data-v-331884f8]:hover{color:#fe2c55}.video-content .video-stats .stat-item i[data-v-331884f8]{font-size:14px}.empty-state[data-v-331884f8]{text-align:center;padding:60px 20px;max-width:400px;margin:0 auto}.empty-state .empty-icon[data-v-331884f8]{font-size:64px;margin-bottom:20px;opacity:.6}.empty-state h3[data-v-331884f8]{color:#fff;font-size:20px;margin:0 0 12px 0}.empty-state p[data-v-331884f8]{color:#8a919e;font-size:14px;line-height:1.6;margin:0 0 24px 0}.empty-state .empty-actions[data-v-331884f8]{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.loading-state[data-v-331884f8]{padding:40px}.load-more[data-v-331884f8]{text-align:center;padding:40px 0}.load-more .load-more-btn[data-v-331884f8]{color:#fe2c55;font-size:16px}.load-more .load-more-btn[data-v-331884f8]:hover{color:#ff4569}@media (max-width:768px){.friends-page[data-v-331884f8]{padding:16px}.friends-content[data-v-331884f8]{max-width:100%}.video-cover[data-v-331884f8]{height:200px}}[data-v-331884f8] .el-button--primary{background:#fe2c55;border-color:#fe2c55}[data-v-331884f8] .el-button--primary:hover{background:#ff4569;border-color:#ff4569}[data-v-331884f8] .el-skeleton__item{background:#2f2f37}