.rank-page{min-height:calc(100vh - 200px);padding-bottom:3rem}@media screen and (max-width:768px){.rank-page{padding-bottom:2rem}}.page-header{margin-bottom:2rem;padding:2rem 0 3rem;text-align:center}@media screen and (max-width:768px){.page-header{margin-bottom:1.5rem;padding:1.5rem 0 2rem}}.page-title{background:linear-gradient(135deg,#6366f1,#8b5cf6);-webkit-background-clip:text;font-size:2.25rem;font-weight:700;margin-bottom:.75rem;-webkit-text-fill-color:transparent;background-clip:text}@media screen and (max-width:768px){.page-title{font-size:1.75rem;margin-bottom:.5rem}}.page-desc{color:#94a3b8;font-size:1rem}@media screen and (max-width:768px){.page-desc{font-size:.875rem}}.rank-section{margin-bottom:3rem}@media screen and (max-width:768px){.rank-section{margin-bottom:2rem}}.section-header{align-items:center;border-bottom:2px solid rgba(148,163,184,.2);display:flex;justify-content:space-between;margin-bottom:2rem;padding-bottom:1rem}@media screen and (max-width:768px){.section-header{flex-wrap:wrap;gap:.75rem;margin-bottom:1.5rem;padding-bottom:.75rem}}.section-title-wrapper{align-items:center;display:flex;gap:.75rem}.section-icon{align-items:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:8px;display:flex;flex-shrink:0;height:32px;justify-content:center;width:32px}.section-icon svg{height:18px;stroke:#fff;width:18px}@media screen and (max-width:768px){.section-icon{height:28px;width:28px}.section-icon svg{height:16px;width:16px}}.section-title{color:#f1f5f9;font-size:1.5rem;font-weight:600;margin:0}@media screen and (max-width:768px){.section-title{font-size:1.25rem}}.rank-section .video-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}@media screen and (max-width:1200px){.rank-section .video-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}@media screen and (max-width:1024px){.rank-section .video-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}@media screen and (max-width:768px){.rank-section .video-grid{gap:1rem;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}}@media screen and (max-width:480px){.rank-section .video-grid{gap:.75rem;grid-template-columns:repeat(3,1fr)}}.rank-badge{align-items:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:50%;box-shadow:0 4px 12px rgba(0,0,0,.3);display:flex;height:36px;justify-content:center;left:-8px;position:absolute;top:-8px;transition:all .15s ease-in-out;width:36px;z-index:2}@media screen and (max-width:768px){.rank-badge{height:32px;left:-6px;top:-6px;width:32px}}.rank-badge .rank-number{color:#fff;font-size:1rem;font-weight:700;line-height:1}@media screen and (max-width:768px){.rank-badge .rank-number{font-size:.875rem}}.rank-badge.rank-1{background:linear-gradient(135deg,#fbbf24,#f59e0b);box-shadow:0 4px 16px rgba(251,191,36,.5)}.rank-badge.rank-2{background:linear-gradient(135deg,#94a3b8,#64748b);box-shadow:0 4px 16px rgba(148,163,184,.5)}.rank-badge.rank-3{background:linear-gradient(135deg,#fb923c,#f97316);box-shadow:0 4px 16px rgba(251,146,60,.5)}.rank-section .video-card:hover .rank-badge{transform:scale(1.1) rotate(5deg)}.meta-score{align-items:center;color:#f59e0b;display:inline-flex;font-size:.875rem;font-weight:600;gap:.25rem}.meta-score svg{fill:currentColor;height:14px;width:14px}@media screen and (max-width:768px){.meta-score{font-size:.8125rem}.meta-score svg{height:12px;width:12px}}.meta-year{color:#94a3b8;font-size:.8125rem;margin-left:.5rem}@media screen and (max-width:768px){.meta-year{font-size:.75rem}}@media screen and (max-width:480px){.rank-section .video-card .video-title{font-size:.8125rem}.rank-section .video-card .video-meta{font-size:.75rem}}.video-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));padding:0 var(--container-padding)}.video-card{animation:fadeIn .5s ease;backdrop-filter:blur(10px);background:var(--bg-card);border:1px solid var(--border-color-light);border-radius:12px;overflow:hidden;position:relative;transition:all var(--transition-normal)}.video-card:hover{background:var(--bg-card-hover);border-color:var(--border-color);box-shadow:var(--shadow-xl);transform:translateY(-8px)}.video-poster{background:var(--bg-tertiary);overflow:hidden;padding-top:150%;position:relative;width:100%}.video-poster-image{height:100%;left:0;-o-object-fit:cover;object-fit:cover;position:absolute;top:0;transition:transform var(--transition-slow);width:100%}.video-card:hover .video-poster-image{transform:scale(1.1)}.video-poster-overlay{background:var(--gradient-overlay);inset:0;opacity:0;position:absolute;transition:opacity var(--transition-normal)}.video-card:hover .video-poster-overlay{opacity:1}.video-badge{background:var(--gradient-primary);box-shadow:var(--shadow-md);font-weight:600;left:.5rem}.video-badge,.video-status{border-radius:6px;color:#fff;font-size:.75rem;padding:.25rem .75rem;position:absolute;top:.5rem}.video-status{backdrop-filter:blur(10px);background:rgba(0,0,0,.7);font-weight:500;right:.5rem}.video-play-icon{align-items:center;backdrop-filter:blur(10px);background:rgba(99,102,241,.9);border-radius:50%;box-shadow:var(--shadow-glow);display:flex;height:60px;justify-content:center;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all var(--transition-normal);width:60px}.video-card:hover .video-play-icon{opacity:1;transform:translate(-50%,-50%) scale(1.1)}.play-icon{color:#fff;height:30px;width:30px}.video-info{padding:1rem}.video-title{color:var(--text-primary);font-size:.95rem;font-weight:600;line-height:1.4;margin-bottom:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.video-meta{color:var(--text-tertiary);font-size:.8rem;justify-content:space-between}.video-meta,.video-score{align-items:center;display:flex}.video-score{color:#fbbf24;gap:.25rem}.star-icon{height:14px;width:14px}@media(max-width:1024px){.video-grid{gap:1.25rem;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}