:root{--blue-dark:#173a82;--blue:#2457d6;--blue-light:#6383f2;--white:#fff;--gray-light:#f8f9fa;--gray:#e9ecef;--border:#dee2e6;--text-dark:#212529;--text-muted:#6c757d;--shadow:0 4px 12px #00000014;--gold:gold;--silver:silver;--bronze:#cd7f32}body{background:var(--gray-light);color:var(--text-dark);margin:0;padding:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.main-content{max-width:1200px;margin:0 auto;padding:40px 24px}.header{text-align:center;color:var(--white);background:linear-gradient(135deg,#173a82 0%,#2457d6 55%,#6383f2 100%);padding:60px 24px}.header-content h1{margin:0 0 12px;font-size:2.5rem;font-weight:700}.header-description{opacity:.9;margin:0;font-size:1.1rem}.leaderboard-container{background:var(--white);box-shadow:var(--shadow);border-radius:24px;margin-bottom:32px;padding:32px}.tab-navigation{border-bottom:2px solid var(--border);gap:12px;margin-bottom:32px;padding-bottom:16px;display:flex}.tab-button{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:12px;padding:12px 24px;font-size:.95rem;font-weight:600;transition:all .2s}.tab-button:hover{background:var(--gray-light);color:var(--blue-dark)}.tab-button.active{background:var(--blue);color:var(--white)}.tab-content{display:none}.tab-content.active{display:block}.leaderboard-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.leaderboard-header h2{color:var(--blue-dark);margin:0;font-size:1.5rem;font-weight:700}.filter-dropdown select{border:1px solid var(--border);background:var(--white);color:var(--text-dark);cursor:pointer;border-radius:8px;padding:10px 16px;font-size:.9rem;font-weight:600;transition:border-color .2s}.filter-dropdown select:hover{border-color:var(--blue)}.leaderboard-list{flex-direction:column;gap:12px;display:flex}.school-leaderboard-item{background:var(--gray-light);border-radius:16px;align-items:center;gap:16px;padding:20px 24px;transition:all .2s;display:flex}.school-leaderboard-item:hover{background:var(--gray);transform:translateY(-2px)}.school-leaderboard-item.rank-1{border:2px solid var(--gold);background:linear-gradient(135deg,#ffd70026 0%,#ffd7000d 100%)}.school-leaderboard-item.rank-2{border:2px solid var(--silver);background:linear-gradient(135deg,#c0c0c026 0%,#c0c0c00d 100%)}.school-leaderboard-item.rank-3{border:2px solid var(--bronze);background:linear-gradient(135deg,#cd7f3226 0%,#cd7f320d 100%)}.school-rank-badge{text-transform:uppercase;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:1rem;font-weight:700;display:flex}.school-rank-badge.gold{background:var(--gold);color:var(--text-dark);box-shadow:0 4px 12px #ffd70066}.school-rank-badge.silver{background:var(--silver);color:var(--text-dark);box-shadow:0 4px 12px #c0c0c066}.school-rank-badge.bronze{background:var(--bronze);color:var(--white);box-shadow:0 4px 12px #cd7f3266}.school-rank{background:var(--blue);width:48px;height:48px;color:var(--white);border-radius:50%;justify-content:center;align-items:center;font-size:1rem;font-weight:700;display:flex}.school-info{flex:1;min-width:0}.school-name{color:var(--text-dark);margin:0 0 6px;font-size:1.1rem;font-weight:700}.school-stats{color:var(--text-muted);margin:0;font-size:.9rem}.school-stats .hours{color:var(--blue);font-weight:700}.school-stats .student-count{color:var(--blue-light);font-weight:600}.school-progress-bar{background:var(--white);border-radius:4px;flex-shrink:0;width:120px;height:8px;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--blue) 0%, var(--blue-light) 100%);border-radius:4px;height:100%;transition:width .3s}.school-leaderboard-item.rank-1 .progress-fill{background:linear-gradient(90deg, var(--gold) 0%, gold 100%)}.school-leaderboard-item.rank-2 .progress-fill{background:linear-gradient(90deg, var(--silver) 0%, silver 100%)}.school-leaderboard-item.rank-3 .progress-fill{background:linear-gradient(90deg, var(--bronze) 0%, #cd7f32 100%)}.leaderboard-item{background:var(--gray-light);border-radius:16px;justify-content:space-between;align-items:center;padding:20px 24px;transition:all .2s;display:flex}.leaderboard-item:hover{background:var(--gray);transform:translateY(-2px)}.leaderboard-item.rank-1{border:2px solid var(--gold);background:linear-gradient(135deg,#ffd7001a 0%,#ffd7000d 100%)}.leaderboard-item.rank-2{border:2px solid var(--silver);background:linear-gradient(135deg,#c0c0c01a 0%,#c0c0c00d 100%)}.leaderboard-item.rank-3{border:2px solid var(--bronze);background:linear-gradient(135deg,#cd7f321a 0%,#cd7f320d 100%)}.leaderboard-info{flex:1;align-items:center;gap:16px;display:flex}.rank-number{background:var(--blue);width:48px;height:48px;color:var(--white);border-radius:50%;justify-content:center;align-items:center;font-size:1.2rem;font-weight:700;display:flex}.leaderboard-item.rank-1 .rank-number{background:var(--gold);color:var(--text-dark)}.leaderboard-item.rank-2 .rank-number{background:var(--silver);color:var(--text-dark)}.leaderboard-item.rank-3 .rank-number{background:var(--bronze);color:var(--white)}.leaderboard-avatar{object-fit:cover;border:3px solid var(--white);border-radius:50%;width:56px;height:56px;box-shadow:0 2px 8px #0000001a}.leaderboard-details{flex:1}.leaderboard-name{color:var(--text-dark);margin:0 0 4px;font-size:1rem;font-weight:700}.leaderboard-school{color:var(--text-muted);margin:0;font-size:.85rem}.leaderboard-stats{align-items:center;gap:24px;display:flex}.stat-display{text-align:center}.stat-value{color:var(--blue);font-size:1.2rem;font-weight:700;display:block}.stat-label{color:var(--text-muted);text-transform:uppercase;margin:0;font-size:.75rem;font-weight:600}.top-performers-section{background:var(--white);box-shadow:var(--shadow);border-radius:24px;padding:32px}.section-title{color:var(--blue-dark);margin:0 0 24px;font-size:1.5rem;font-weight:700}.top-performers-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;display:grid}.top-performer-card{background:var(--gray-light);text-align:center;border-radius:20px;padding:32px 24px;transition:all .3s;position:relative}.top-performer-card:hover{transform:translateY(-8px);box-shadow:0 8px 24px #0000001f}.top-performer-card.gold{border:2px solid var(--gold);background:linear-gradient(135deg,#ffd70026 0%,#ffd7000d 100%)}.top-performer-card.silver{border:2px solid var(--silver);background:linear-gradient(135deg,#c0c0c026 0%,#c0c0c00d 100%)}.top-performer-card.bronze{border:2px solid var(--bronze);background:linear-gradient(135deg,#cd7f3226 0%,#cd7f320d 100%)}.rank-badge{background:var(--blue-dark);color:var(--white);text-transform:uppercase;border-radius:20px;padding:8px 20px;font-size:.85rem;font-weight:700;position:absolute;top:-12px;left:50%;transform:translate(-50%)}.top-performer-card.gold .rank-badge{background:var(--gold);color:var(--text-dark)}.top-performer-card.silver .rank-badge{background:var(--silver);color:var(--text-dark)}.top-performer-card.bronze .rank-badge{background:var(--bronze);color:var(--white)}.performer-avatar{border:4px solid var(--white);border-radius:50%;width:100px;height:100px;margin:16px auto;overflow:hidden;box-shadow:0 4px 12px #00000026}.performer-avatar img{object-fit:cover;width:100%;height:100%}.performer-name{color:var(--text-dark);margin:16px 0 8px;font-size:1.2rem;font-weight:700}.performer-school{color:var(--text-muted);margin:0 0 16px;font-size:.9rem}.performer-stats{justify-content:center;gap:24px;display:flex}.stat-item{color:var(--text-dark);margin:0;font-size:.9rem}.stat-item .stat-value{color:var(--blue);font-size:1.4rem;font-weight:700;display:block}.pagination-controls{border-top:1px solid var(--border);justify-content:center;align-items:center;gap:12px;margin-top:32px;padding-top:24px;display:flex}.pagination-button{background:var(--white);border:1px solid var(--border);color:var(--text-dark);cursor:pointer;border-radius:8px;align-items:center;gap:6px;padding:10px 20px;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}.pagination-button:hover:not(:disabled){background:var(--blue-light);border-color:var(--blue);color:var(--white)}.pagination-button:disabled{opacity:.4;cursor:not-allowed;background:var(--gray-light)}.pagination-numbers{gap:8px;display:flex}.pagination-number{background:var(--white);border:1px solid var(--border);width:40px;height:40px;color:var(--text-dark);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}.pagination-number:hover{background:var(--gray-light);border-color:var(--blue)}.pagination-number.active{background:var(--blue);color:var(--white);border-color:var(--blue)}@media (width<=768px){.main-content,.leaderboard-container,.top-performers-section{padding:24px 16px}.leaderboard-header,.leaderboard-item{flex-direction:column;align-items:flex-start;gap:16px}.leaderboard-info{width:100%}.leaderboard-stats{justify-content:space-between;width:100%}.top-performers-grid{grid-template-columns:1fr}.tab-navigation{flex-direction:column}.tab-button{width:100%}.pagination-controls{flex-wrap:wrap}.pagination-button{padding:8px 16px;font-size:.85rem}.pagination-number{width:36px;height:36px;font-size:.85rem}}body{background:0 0}.header{min-height:285px;padding:72px 24px 104px}.leaderboard-hero-copy{max-width:760px}.leaderboard-kicker,.ranking-kicker{color:#f5d27e;letter-spacing:.16em;text-transform:uppercase;margin-bottom:9px;font-size:.72rem;font-weight:900;display:inline-block}.leaderboard-hero-copy h1{letter-spacing:-.055em;text-shadow:0 12px 36px #01122633;font-size:clamp(2.7rem,6vw,4.9rem);line-height:.98}.leaderboard-hero-copy .header-description{max-width:560px;margin-top:16px;font-size:1rem}.leaderboard-hero-rule{justify-content:center;margin-top:21px;display:flex}.leaderboard-hero-rule span{background:linear-gradient(90deg,#0000,#f2ca6b 28% 72%,#0000);border-radius:999px;width:74px;height:3px;box-shadow:0 0 15px #f2ca6b4d}.main-content{margin-top:-38px;padding-top:0;padding-bottom:38px}.leaderboard-container,.top-performers-section{border:1px solid #d2e1f0eb;border-radius:26px;position:relative;overflow:hidden;box-shadow:0 22px 54px #071f3c1f}.tab-navigation{background:#f4f8fc;border:1px solid #dce7f2;border-radius:15px;gap:8px;margin-bottom:30px;padding:5px}.tab-button{border-radius:11px;padding:11px 18px;font-weight:750}.tab-button.active{background:linear-gradient(135deg,#2457b4,#376dcf);box-shadow:0 8px 20px #2457b433}.leaderboard-header{border-bottom:1px solid #e4ebf3;padding-bottom:18px}.leaderboard-header h2,.section-title{color:#0b2748;letter-spacing:-.025em;margin:0;font-size:clamp(1.55rem,3vw,2rem);font-weight:850}.leaderboard-header .ranking-kicker,.section-heading-block .ranking-kicker{color:#3569bd;margin-bottom:5px}.section-heading-block{margin-bottom:24px}.section-heading-block p{color:#718096;margin:7px 0 0;font-size:.92rem}.school-leaderboard-item,.leaderboard-item,.top-performer-card{border:1px solid #d8e2edf2}.school-leaderboard-item:hover,.leaderboard-item:hover,.top-performer-card:hover{box-shadow:0 14px 30px #0e2a4d1a}@media (width<=768px){.header{min-height:245px;padding:58px 18px 82px}.main-content{margin-top:-26px}.tab-navigation{flex-direction:row;overflow-x:auto}.tab-button{flex:none;width:auto}}