:root{--primary-color: #6366f1;--primary-color-hover: #4f46e5;--primary-color-light: #818cf8;--primary-gradient: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);--accent-color: #f59e0b;--bg-primary: #f5f7fa;--bg-secondary: #ffffff;--bg-dark: #1e1e2e;--bg-card: #ffffff;--text-primary: #1f2937;--text-secondary: #6b7280;--text-muted: #9ca3af;--border-color: #e5e7eb;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);--shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);--radius-sm: 4px;--radius: 8px;--radius-lg: 12px;--radius-xl: 16px}.list-empty{display:flex;align-items:center;justify-content:center}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}.mod-list-header{background:linear-gradient(135deg, #1e1e2e 0%, #2d2d44 100%);padding:30px 0}@media screen and (max-width: 767px){.mod-list-header{padding:20px 0}}.mod-list-header .header-content{display:flex;align-items:center;gap:20px}@media screen and (max-width: 767px){.mod-list-header .header-content{flex-direction:column;align-items:flex-start;gap:15px}}.mod-list-header .header-title{font-size:28px;font-weight:700;color:#fff}@media screen and (max-width: 767px){.mod-list-header .header-title{font-size:22px}}.mod-list-header .header-count{font-size:14px;color:hsla(0,0%,100%,.6)}.mod-list-header .header-count span{color:var(--primary-color-light);font-weight:600}.mod-filter{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow);margin-top:-20px;position:relative;z-index:10}@media screen and (max-width: 767px){.mod-filter{margin-top:-10px;border-radius:var(--radius)}}.filter-category{padding:20px;border-bottom:1px solid var(--border-color)}@media screen and (max-width: 767px){.filter-category{padding:15px}}.filter-category .category-list{display:flex;flex-wrap:wrap;gap:10px}@media screen and (max-width: 767px){.filter-category .category-list{gap:8px}}.filter-category .category-item{padding:8px 16px;font-size:14px;color:var(--text-primary);background:var(--bg-primary);border-radius:var(--radius);transition:all .2s}@media screen and (max-width: 767px){.filter-category .category-item{padding:6px 12px;font-size:13px}}.filter-category .category-item:hover{color:var(--primary-color);background:rgba(99,102,241,.1)}.filter-category .category-item.active{color:#fff;background:var(--primary-gradient)}.filter-extend{padding:20px}@media screen and (max-width: 767px){.filter-extend{padding:15px}}.filter-extend .filter-group{display:flex;align-items:flex-start;margin-bottom:15px}.filter-extend .filter-group:last-child{margin-bottom:0}@media screen and (max-width: 767px){.filter-extend .filter-group{flex-direction:column;gap:10px}}.filter-extend .filter-label{flex-shrink:0;width:70px;padding-top:8px;font-size:14px;font-weight:500;color:var(--text-secondary)}@media screen and (max-width: 767px){.filter-extend .filter-label{width:auto;padding-top:0}}.filter-extend .filter-options{flex:1;display:flex;flex-wrap:wrap;gap:8px}.filter-extend .filter-option{padding:6px 14px;font-size:13px;color:var(--text-primary);background:var(--bg-primary);border-radius:var(--radius-sm);transition:all .2s}@media screen and (max-width: 767px){.filter-extend .filter-option{padding:5px 12px;font-size:12px}}.filter-extend .filter-option:hover{color:var(--primary-color);background:rgba(99,102,241,.1)}.filter-extend .filter-option.active{color:#fff;background:var(--primary-color)}.filter-extend .filter-toggle{display:flex;align-items:center;justify-content:center;gap:5px;padding:10px;font-size:13px;color:var(--text-secondary);border-top:1px dashed var(--border-color);margin-top:15px;cursor:pointer;transition:color .2s}.filter-extend .filter-toggle:hover{color:var(--primary-color)}.filter-extend .filter-toggle svg{width:16px;height:16px;transition:transform .3s}.filter-extend .filter-toggle.expanded svg{transform:rotate(180deg)}.filter-extend .filter-hidden{display:none}.filter-extend .filter-hidden.show{display:flex}.mod-video-list{padding:30px 0}@media screen and (max-width: 767px){.mod-video-list{padding:20px 0}}.mod-video-list .list-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}@media screen and (max-width: 767px){.mod-video-list .list-header{margin-bottom:15px}}.mod-video-list .list-info{font-size:14px;color:var(--text-secondary)}.mod-video-list .list-info span{color:var(--primary-color);font-weight:600}.mod-video-list .list-sort{display:flex;gap:10px}@media screen and (max-width: 767px){.mod-video-list .list-sort{gap:8px}}.mod-video-list .sort-item{padding:6px 14px;font-size:13px;color:var(--text-secondary);background:#fff;border:1px solid var(--border-color);border-radius:var(--radius);transition:all .2s}@media screen and (max-width: 767px){.mod-video-list .sort-item{padding:5px 10px;font-size:12px}}.mod-video-list .sort-item:hover,.mod-video-list .sort-item.active{color:var(--primary-color);border-color:var(--primary-color)}.list-empty{flex-direction:column;padding:80px 20px;background:#fff;border-radius:var(--radius-lg)}.list-empty svg{width:100px;height:100px;color:var(--text-muted);margin-bottom:20px}.list-empty .empty-title{font-size:18px;font-weight:500;color:var(--text-primary);margin-bottom:10px}.list-empty .empty-desc{font-size:14px;color:var(--text-muted)}.mod-sidebar .sidebar-section{background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden;padding:20px;margin-bottom:20px}.mod-sidebar .sidebar-section:last-child{margin-bottom:0}@media screen and (max-width: 767px){.mod-sidebar .sidebar-section{padding:15px}}.mod-sidebar .sidebar-title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:15px;padding-bottom:15px;border-bottom:1px solid var(--border-color)}.mod-sidebar .sidebar-title svg{width:20px;height:20px;color:var(--primary-color)}