:root {--topx-bg: #0b0f17;--topx-card: rgba(22,26,40,.66);--topx-surface: rgba(16,20,32,.55);--topx-border: rgba(120,136,255,.26);--topx-accent: #7c3cff;--topx-accent-2: #00e0ff;--topx-text: #e9ecff;--topx-dim: #9aa4c7;--topx-gold: #ffd76a;--topx-silver: #cfd8ff;--topx-bronze: #ffb485;}.topx-block {position: relative;padding: 12px;background: radial-gradient(900px 420px at 12% -20%, rgba(124,60,255,.12), transparent 55%), radial-gradient(800px 380px at 110% 20%, rgba(0,224,255,.10), transparent 55%), linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01) 40%, transparent 70%), var(--topx-bg);border-radius: 16px;overflow: clip;isolation: isolate;box-shadow: 0 8px 22px rgba(0,0,0,.38) inset, 0 0 0 1px rgba(255,255,255,.03);}.topx-heading {color: var(--topx-text);font-size: clamp(12px,2.2vw,16px);display: inline-flex;gap: 8px;}.topx-sub {margin-top: 4px;color: var(--topx-dim);font-size: 13px;}.topx-list {list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: repeat(auto-fit,minmax(240px,1fr));gap: 12px;user-select: none;}.topx-link {--x: 60%;display: flex;gap: 12px;align-items: center;background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)) border-box, var(--topx-card);border: 1px solid transparent;border-radius: 14px;padding: 12px;min-height: 68px;text-decoration: none;color: var(--topx-text);cursor: pointer;backdrop-filter: blur(10px) saturate(1.08);transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, translate .22s ease;box-shadow: 0 8px 18px rgba(0,0,0,.34), 0 0 0 1px rgba(255,255,255,.03) inset;position: relative;overflow: hidden;z-index: 1;}.topx-link:hover {translate: 0 -1px;border-color: color-mix(in oklab, var(--topx-accent) 55%, transparent);box-shadow: 0 14px 24px color-mix(in oklab, var(--topx-accent) 22%, transparent), 0 0 0 1px rgba(255,255,255,.03) inset;}.topx-link::after {content: "";position: absolute;inset: -1px;background: radial-gradient(480px 160px at var(--x) -20%, color-mix(in oklab, var(--topx-accent) 30%, transparent), transparent 45%), radial-gradient(420px 140px at var(--x) 120%, color-mix(in oklab, var(--topx-accent-2) 32%, transparent), transparent 55%), linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 40%);opacity: 0;transition: opacity .22s ease;pointer-events: none;}.topx-link:hover::after {opacity: 1;}.topx-rank {min-width: 44px;height: 44px;border-radius: 12px;display: grid;place-items: center;background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.04)), conic-gradient(from 220deg, var(--topx-accent), var(--topx-accent-2));box-shadow: inset 0 0 0 2px rgba(255,255,255,.05), 0 5px 14px rgba(0,0,0,.32);}.topx-rank-num {font-weight: 800;font-size: 18px;}.topx-content {flex: 1 1 auto;min-width: 0;}.topx-title {font-size: clamp(11px,1.9vw,11px);font-weight: 800;line-height: 1.25;margin: 2px 0 4px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: var(--topx-text);width: 122%;}.topx-year {color: var(--topx-dim);font-weight: 700;}.topx-meta {display: flex;align-items: center;justify-content: space-between;gap: 8px;color: var(--topx-dim);font-size: 12px;}.topx-badge {padding: 2px 7px;border-radius: 999px;background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));border: 1px solid rgba(255,255,255,.09);}.topx-cta {font-weight: 800;letter-spacing: .2px;opacity: .9;}.topx-bar {height: 2px;margin-top: 8px;border-radius: 999px;background: linear-gradient(90deg, var(--topx-accent), var(--topx-accent-2));width: calc(var(--progress, .5) * 100%);box-shadow: 0 0 10px color-mix(in oklab, var(--topx-accent) 28%, transparent);}.topx-medal {border-radius: 50%;position: relative;display: inline-grid;place-items: center;font-size: 12px;line-height: 1;color: #111;}.topx-medal.gold::before {content: "🥇";width: 46px;margin-left: -1.7px;font-size: 35px;}.topx-medal.silver::before {content: "🥈";width: 46px;margin-left: -1.7px;font-size: 35px;}.topx-medal.bronze::before {content: "🥉";width: 46px;margin-left: -1.7px;font-size: 35px;}.topx-medal.iron::before {content: "🏅";width: 46px;margin-left: -1.7px;font-size: 35px;}.topx-item.is-gold .topx-rank {background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.04)), linear-gradient(145deg,#ffefb0,#ffd76a);}.topx-item.is-silver .topx-rank {background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.04)), linear-gradient(145deg,#f0f4ff,#cfd8ff);}.topx-item.is-bronze .topx-rank {background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.04)), linear-gradient(145deg,#ffd1b5,#ffb485);}.topx-item {opacity: 0;transform: translateY(6px);transition: opacity .32s ease, transform .32s ease;}.topx-item.is-visible {opacity: 1;transform: translateY(0);}.topx-carousel .topx-viewport {display: grid;grid-template-columns: 1fr minmax(30px, 5%);align-items: stretch;column-gap: 8px;}.topx-carousel .topx-list {display: flex;gap: 5px;margin: 0;padding: 0 8px;overflow-x: auto;overflow-y: visible;scroll-snap-type: x mandatory;-webkit-overflow-scrolling: touch;scrollbar-width: none;touch-action: pan-y;min-height: 88.94px;}.topx-carousel .topx-list::-webkit-scrollbar {display: none;}.topx-carousel .topx-item {flex: 0 0 auto;width: clamp(240px,68vw,310px);scroll-snap-align: center;}.topx-rightnav {display: flex;flex-direction: column;justify-content: center;align-items: center;gap: 10px;padding: 4px 0;}.topx-arrow {width: 35px;height: 30px;border-radius: 10px;display: grid;place-items: center;background: var(--topx-surface);color: var(--topx-text);font-size: 25px;line-height: 1;border: 1px solid var(--topx-border);box-shadow: 0 6px 14px rgba(0, 0, 0, .24);user-select: none;}.topx-arrow:hover {border-color: var(--topx-accent);}.topx-item.rank-1 {--topx-accent: #ffb800;--topx-accent-2: #ff6a00;}.topx-item.rank-2 {--topx-accent: #b6c7ff;--topx-accent-2: #6f8cff;}.topx-item.rank-3 {--topx-accent: #ffb38a;--topx-accent-2: #ff7a59;}.topx-item.rank-4 {--topx-accent: #7c3cff;--topx-accent-2: #00e0ff;}.topx-item.rank-5 {--topx-accent: #00d084;--topx-accent-2: #00bcd4;}.topx-item.rank-6 {--topx-accent: #ff4d6d;--topx-accent-2: #ff8fa3;}.topx-item.rank-7 {--topx-accent: #8bc34a;--topx-accent-2: #4caf50;}.topx-item.rank-8 {--topx-accent: #e040fb;--topx-accent-2: #7c4dff;}.topx-item.rank-9 {--topx-accent: #03a9f4;--topx-accent-2: #00bcd4;}.topx-item.rank-10 {--topx-accent: #ff9800;--topx-accent-2: #ffc107;}@media (hover:none) {.topx-rightnav {display: none;}}@media (prefers-reduced-motion: reduce) {.topx-link, .topx-item {transition: none !important;transform: none !important;}}@media (prefers-color-scheme: light) {:root {--topx-bg: #f3f6ff;--topx-card: rgba(255,255,255,.92);--topx-surface: rgba(255,255,255,.85);--topx-border: rgba(124,60,255,.22);--topx-text: #101224;--topx-dim: #58607f;}.topx-block {box-shadow: 0 8px 22px rgba(20,20,60,.08) inset, 0 0 0 1px rgba(0,0,0,.04);}}.topx-item {opacity: 1;transform: none;}