:root{--color-bg-base:#080811;--color-bg-surface:#0e0e1a;--color-bg-card:rgba(255,255,255,0.03);--color-bg-card-hover:rgba(255,255,255,0.055);--color-border:rgba(255,255,255,0.07);--color-border-focus:rgba(143,67,255,0.6);--color-text-primary:#ffffff;--color-text-secondary:rgba(255,255,255,0.6);--color-text-muted:rgba(255,255,255,0.35);--color-text-disabled:rgba(255,255,255,0.2);--color-pink:#ff2a85;--color-pink-dim:rgba(255,42,133,0.15);--color-purple:#8f43ff;--color-purple-dim:rgba(143,67,255,0.15);--color-cyan:#00f0ff;--color-cyan-dim:rgba(0,240,255,0.12);--color-green:#00e676;--color-orange:#ff8c00;--color-rank-up:#00e676;--color-rank-down:#ff4757;--color-rank-new:#ffca28;--color-rank-same:rgba(255,255,255,0.25);--gradient-brand:linear-gradient(135deg,#8f43ff,#ff2a85);--gradient-heading:linear-gradient(90deg,#ffffff 0%,#cfa8ff);--gradient-glow-purple:radial-gradient(circle,rgba(143,67,255,0.25) 0%,transparent 70%);--gradient-glow-pink:radial-gradient(circle,rgba(255,42,133,0.2) 0%,transparent 70%);--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:40px;--space-2xl:64px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-full:999px;--font-heading:"Outfit","Noto Sans KR",system-ui,sans-serif;--font-body:"Noto Sans KR","Outfit",system-ui,sans-serif;--font-mono:"JetBrains Mono","Consolas",monospace;--font-numeric:"Outfit",system-ui,sans-serif;--shadow-card:0 8px 32px rgba(0,0,0,0.35);--shadow-glow-purple:0 0 20px rgba(143,67,255,0.3);--shadow-glow-pink:0 0 20px rgba(255,42,133,0.3);--transition-fast:0.15s ease;--transition-base:0.25s ease;--transition-slow:0.4s ease}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background-color:var(--color-bg-base);color:var(--color-text-primary);font-family:var(--font-body);min-height:100vh;line-height:1.6}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);line-height:1.2;font-weight:700}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer}img,video{max-width:100%;display:block}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.22)}.spinner{width:36px;height:36px;border:2.5px solid rgba(143,67,255,.15);border-top:2.5px solid var(--color-purple);border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.page-empty-state,.page-loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:40vh;gap:var(--space-md);color:var(--color-text-muted);font-size:15px}.badge-live{display:inline-flex;align-items:center;gap:6px;background:rgba(255,42,133,.15);border:1px solid rgba(255,42,133,.35);color:var(--color-pink);font-size:11px;font-weight:800;letter-spacing:1.5px;padding:3px 10px;border-radius:var(--radius-full);font-family:var(--font-heading)}.badge-live-dot{width:6px;height:6px;background:var(--color-pink);border-radius:50%;animation:pulse-dot 1.4s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}.num-tabular{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-family:var(--font-numeric)}.rank-badge{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;font-family:var(--font-heading)}.rank-badge-first{background:linear-gradient(135deg,#ffd700,#ffb300);box-shadow:0 0 12px rgba(255,215,0,.4);color:#0d0614}.rank-badge-second{background:linear-gradient(135deg,#e2e8f0,#94a3b8);box-shadow:0 0 12px rgba(226,232,240,.3);color:#0d0614}.rank-badge-third{background:linear-gradient(135deg,#d97706,#b45309);box-shadow:0 0 12px rgba(217,119,6,.3);color:#ffffff}.rank-badge-normal{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.7)}.ranking-table tr.rank-row-top td{padding-top:20px;padding-bottom:20px;transition:all .3s var(--transition-base)}.ranking-table tr.rank-row-top1 td{background:linear-gradient(180deg,rgba(255,42,133,.06),rgba(143,67,255,.04));border-top:1.5px solid rgba(255,42,133,.3);border-bottom:1.5px solid rgba(255,42,133,.3)}.ranking-table tr.rank-row-top1 td:first-child{border-left:1.5px solid rgba(255,42,133,.3);border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.ranking-table tr.rank-row-top1 td:last-child{border-right:1.5px solid rgba(255,42,133,.3);border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.ranking-table tr.rank-row-top2 td{background:linear-gradient(180deg,rgba(0,240,255,.04),rgba(143,67,255,.03));border-top:1px solid rgba(0,240,255,.2);border-bottom:1px solid rgba(0,240,255,.2)}.ranking-table tr.rank-row-top2 td:first-child{border-left:1px solid rgba(0,240,255,.2);border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.ranking-table tr.rank-row-top2 td:last-child{border-right:1px solid rgba(0,240,255,.2);border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.ranking-table tr.rank-row-top3 td{background:rgba(255,255,255,.012);border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}.ranking-table tr.rank-row-top3 td:first-child{border-left:1px solid rgba(255,255,255,.08);border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.ranking-table tr.rank-row-top3 td:last-child{border-right:1px solid rgba(255,255,255,.08);border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}div.rank-row-top{padding-top:20px!important;padding-bottom:20px!important;border-radius:var(--radius-md)!important;margin-bottom:10px!important;transition:all .3s var(--transition-base)}div.rank-row-top1{background:linear-gradient(135deg,rgba(255,42,133,.06),rgba(143,67,255,.04) 50%,rgba(0,240,255,.03))!important;border:1.5px solid rgba(255,42,133,.3)!important;box-shadow:0 8px 30px rgba(255,42,133,.12)}div.rank-row-top1:hover{transform:translateY(-2px) scale(1.005);box-shadow:0 12px 40px rgba(255,42,133,.2);border-color:rgba(255,42,133,.45)!important}div.rank-row-top2{background:linear-gradient(135deg,rgba(255,255,255,.02),rgba(0,240,255,.03))!important;border:1px solid rgba(0,240,255,.2)!important;box-shadow:0 4px 20px rgba(0,240,255,.04)}div.rank-row-top2:hover{transform:translateY(-2px);border-color:rgba(0,240,255,.35)!important;box-shadow:0 8px 25px rgba(0,240,255,.1)}div.rank-row-top3{background:rgba(255,255,255,.012)!important;border:1px solid rgba(255,255,255,.08)!important}div.rank-row-top3:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.15)!important}.rank-row-top1 .daily-title,.rank-row-top1 .live-row-title,.rank-row-top1 .monthly-title,.rank-row-top1 .song-name{font-size:19px!important;font-weight:800!important;background:linear-gradient(90deg,#ffd700,#ff8da1 50%,#d5a6ff)!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;text-shadow:0 0 15px rgba(255,42,133,.25)}.rank-row-top1 .daily-info:before,.rank-row-top1 .live-row-info:before,.rank-row-top1 .monthly-info:before,.rank-row-top1 .song-title-meta:before{content:"👑 CHAMPION";display:inline-block;font-size:9px;font-weight:900;color:#ffd700;letter-spacing:1.5px;background:rgba(255,215,0,.12);border:1px solid rgba(255,215,0,.35);padding:1px 6px;border-radius:4px;width:-moz-fit-content;width:fit-content;margin-bottom:5px;text-shadow:0 0 5px rgba(255,215,0,.3)}.rank-row-top .daily-title,.rank-row-top .live-row-title,.rank-row-top .monthly-title,.rank-row-top .song-name{font-size:17px}.rank-row-top .artist-name-txt,.rank-row-top .daily-artist,.rank-row-top .live-row-artist,.rank-row-top .monthly-artist{font-size:13px;color:rgba(255,255,255,.6)}