.rank-page{min-height:calc(100vh - 200px);padding-bottom:3rem}@media screen and (max-width: 799px){.rank-page{padding-bottom:2rem}}.page-header{text-align:center;padding:2rem 0 3rem;margin-bottom:2rem}@media screen and (max-width: 799px){.page-header{padding:1.5rem 0 2rem;margin-bottom:1.5rem}}.page-title{font-size:2.25rem;font-weight:700;margin-bottom:.75rem;background:linear-gradient(135deg, #00C9FF 0%, #92FE9D 100%);-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);background-clip:text}@media screen and (max-width: 799px){.page-title{font-size:1.75rem;margin-bottom:.5rem}}.page-desc{font-size:1rem;color:#999}@media screen and (max-width: 799px){.page-desc{font-size:.875rem}}.rank-section{margin-bottom:3rem}@media screen and (max-width: 799px){.rank-section{margin-bottom:2rem}}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #e5e7eb}@media screen and (max-width: 799px){.section-header{margin-bottom:1.5rem;padding-bottom:.75rem;flex-wrap:wrap;gap:.75rem}}.section-title-wrapper{display:flex;align-items:center;gap:.75rem}.section-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, #00C9FF 0%, #92FE9D 100%);border-radius:.5rem;flex-shrink:0}.section-icon svg{width:18px;height:18px;stroke:#fff}@media screen and (max-width: 799px){.section-icon{width:28px;height:28px}.section-icon svg{width:16px;height:16px}}.section-title{font-size:1.5rem;font-weight:600;color:#333;margin:0}@media screen and (max-width: 799px){.section-title{font-size:1.25rem}}.video-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));gap:1.5rem}@media screen and (min-width: 800px)and (max-width: 1599px){.video-grid{grid-template-columns:repeat(auto-fill, minmax(160px, 1fr));gap:1.25rem}}@media screen and (max-width: 799px){.video-grid{grid-template-columns:repeat(3, 1fr);gap:.75rem}}@media screen and (max-width: 359px){.video-grid{grid-template-columns:repeat(2, 1fr);gap:.5rem}}.rank-section .video-grid{grid-template-columns:repeat(auto-fill, minmax(180px, 1fr))}@media screen and (min-width: 800px)and (max-width: 1599px){.rank-section .video-grid{grid-template-columns:repeat(auto-fill, minmax(160px, 1fr))}}@media screen and (max-width: 799px){.rank-section .video-grid{grid-template-columns:repeat(3, 1fr);gap:.75rem}}@media screen and (max-width: 359px){.rank-section .video-grid{grid-template-columns:repeat(2, 1fr);gap:.5rem}}.video-card{position:relative;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.08);transition:all .3s ease;cursor:pointer}.video-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px rgba(0,0,0,.12)}.video-card:hover .cover-image{transform:scale(1.05)}.video-card:hover .card-gradient{opacity:.9}.video-card:hover .video-overlay{opacity:1}.video-card:hover .video-overlay .play-btn{transform:scale(1)}.card-cover{position:relative;width:100%;aspect-ratio:3/4;overflow:hidden;background:#f3f4f6}.card-cover .cover-image{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}.card-cover .card-gradient{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 60%, rgba(0, 0, 0, 0.7) 100%);z-index:2;opacity:.6;transition:opacity .3s ease}.card-cover .video-overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:3;display:flex;align-items:center;justify-content:center;opacity:0;transition:all .3s ease;background:rgba(0,0,0,.3)}.card-cover .video-overlay .play-btn{width:48px;height:48px;border-radius:50%;background:hsla(0,0%,100%,.95);display:flex;align-items:center;justify-content:center;transform:scale(0.8);transition:all .3s ease;box-shadow:0 4px 12px rgba(0,0,0,.2)}.card-cover .video-overlay .play-btn .play-icon{width:24px;height:24px;color:#00c9ff;margin-left:2px}.card-cover .card-badge{position:absolute;left:.75rem;top:.75rem;z-index:4;padding:2px 8px;background:linear-gradient(135deg, #00C9FF 0%, #92FE9D 100%);color:#fff;font-size:12px;font-weight:500;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.2)}.card-cover .card-status{position:absolute;right:.75rem;top:.75rem;z-index:4;padding:2px 8px;background:rgba(0,0,0,.7);color:#fff;font-size:12px;font-weight:500;border-radius:4px;backdrop-filter:blur(10px)}.card-info{padding:12px;background:#fff}.card-info .video-title{font-size:14px;font-weight:600;color:#333;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.card-info .video-title a{color:inherit;text-decoration:none;display:block;transition:color .3s ease}.card-info .video-title a:hover{color:#00c9ff}.card-info .video-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:#999;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-info .video-meta .meta-score{display:inline-flex;align-items:center;gap:4px;color:#f59e0b;font-weight:600}.card-info .video-meta .meta-score svg{width:14px;height:14px;fill:currentColor}.card-info .video-meta .meta-year{color:#999}.rank-badge{position:absolute;top:-8px;left:-8px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, #00C9FF 0%, #92FE9D 100%);border-radius:50%;z-index:5;box-shadow:0 4px 12px rgba(0,0,0,.3);transition:all .3s ease}@media screen and (max-width: 799px){.rank-badge{width:32px;height:32px;top:-6px;left:-6px}}@media screen and (max-width: 359px){.rank-badge{width:28px;height:28px;top:-4px;left:-4px}}.rank-badge .rank-number{font-size:1rem;font-weight:700;color:#fff;line-height:1}@media screen and (max-width: 799px){.rank-badge .rank-number{font-size:.875rem}}@media screen and (max-width: 359px){.rank-badge .rank-number{font-size:.75rem}}.rank-badge.rank-1{background:linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);box-shadow:0 4px 16px rgba(251,191,36,.5)}.rank-badge.rank-2{background:linear-gradient(135deg, #94a3b8 0%, #64748b 100%);box-shadow:0 4px 16px rgba(148,163,184,.5)}.rank-badge.rank-3{background:linear-gradient(135deg, #fb923c 0%, #f97316 100%);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{display:inline-flex;align-items:center;gap:.25rem;color:#f59e0b;font-weight:600;font-size:.875rem}.meta-score svg{width:14px;height:14px;fill:currentColor}@media screen and (max-width: 799px){.meta-score{font-size:.8125rem}.meta-score svg{width:12px;height:12px}}.meta-year{color:#999;font-size:.8125rem;margin-left:.5rem}@media screen and (max-width: 799px){.meta-year{font-size:.75rem}}@media screen and (max-width: 799px){.rank-section .video-card .video-title{font-size:.8125rem}.rank-section .video-card .video-meta{font-size:.75rem}.card-info{padding:8px}}@media screen and (max-width: 359px){.rank-section .video-card .video-title{font-size:.75rem}.rank-section .video-card .video-meta{font-size:.6875rem}.card-info{padding:6px}}