:root{color:#fff;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#080808;font-family:Inter,system-ui,sans-serif;font-weight:400;line-height:1.5}html,body,#root{width:100%;min-width:320px;min-height:100%;margin:0;padding:0}body{background:#080808;overflow-x:hidden}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:#050505;min-width:320px;margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input{font:inherit}button{cursor:pointer}.app{--music-primary:#8b5cf6;--music-secondary:#c084fc;--music-background:#090613;--music-glow:#a855f7;--music-text:#fff;--music-intensity:1;--music-animation-speed:1;min-height:100vh;color:var(--music-text);background:radial-gradient(circle at 50% 10%, color-mix(in srgb, var(--music-primary) 18%, transparent), transparent 35%), var(--music-background);transition:background 1s,color .7s;position:relative;overflow-x:hidden}@keyframes orbFloat1{0%,to{transform:translate(0,0)scale(1)}33%{transform:translate(100px,-60px)scale(1.18)}66%{transform:translate(-60px,80px)scale(.92)}}@keyframes orbFloat2{0%,to{transform:translate(0,0)scale(1)}33%{transform:translate(-90px,80px)scale(.85)}66%{transform:translate(70px,-50px)scale(1.15)}}.background{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.orb{filter:blur(100px);pointer-events:none;will-change:transform;border-radius:50%;width:440px;height:440px;transition:background 1s,opacity .8s;position:absolute;transform:translate(0,0)}.orb1{animation:18s ease-in-out infinite orbFloat1;top:-120px;left:-100px}.orb2{animation:22s ease-in-out infinite orbFloat2;bottom:10%;right:-120px}.background:before{content:"";z-index:2;background:radial-gradient(circle,#0000 0%,#00000026 55%,#0000008c 100%);position:absolute;inset:0}nav{z-index:10;justify-content:space-between;align-items:center;width:min(1200px,100% - 48px);margin:0 auto;padding:28px 0;display:flex;position:relative}.logo{letter-spacing:.16em;color:var(--music-primary);text-shadow:0 0 20px color-mix(in srgb, var(--music-glow) 55%, transparent);font-size:20px;font-weight:900;transition:color .8s,text-shadow .8s,transform .3s}.logo:hover{text-shadow:0 0 30px color-mix(in srgb, var(--music-glow) 75%, transparent);transform:scale(1.03)}.nav-right{color:#ffffffa6;align-items:center;gap:28px;font-size:13px;display:flex}.nav-right span{transition:color .3s,text-shadow .3s}.nav-right span:hover{color:#fff;text-shadow:0 0 15px color-mix(in srgb, var(--music-glow) 50%, transparent)}.spotify-connect{border:1px solid color-mix(in srgb, var(--music-primary) 70%, white 10%);background:color-mix(in srgb, var(--music-primary) 12%, transparent);color:#fff;letter-spacing:.08em;border-radius:999px;padding:10px 16px;font-size:11px;font-weight:800;transition:transform .25s,background .4s,box-shadow .4s}.spotify-connect:hover{background:color-mix(in srgb, var(--music-primary) 25%, transparent);box-shadow:0 0 25px color-mix(in srgb, var(--music-glow) 35%, transparent);transform:translateY(-2px)}main{z-index:3;width:min(1000px,100% - 40px);margin:0 auto;position:relative}.spotify-player-status{z-index:10;width:min(1000px,100% - 40px);margin:0 auto;position:relative}.player-status{letter-spacing:.12em;color:#ffffff73;justify-content:center;align-items:center;gap:8px;margin-bottom:5px;font-size:10px;font-weight:800;display:flex}.status-dot{background:#666;border-radius:50%;width:7px;height:7px}.status-dot.connected{background:#1ed760;box-shadow:0 0 12px #1ed760cc}.current-track{text-align:center;justify-content:center;gap:7px;font-size:11px;display:flex}.current-track strong{color:#fff}.current-track span{color:#ffffff73}.player-error{text-align:center;color:#ff6b6b;margin-top:8px;font-size:11px}.hero{text-align:center;justify-content:center;align-items:center;min-height:470px;display:flex}.hero>div{width:100%}.eyebrow{letter-spacing:.25em;color:var(--music-primary);text-shadow:0 0 18px color-mix(in srgb, var(--music-glow) 35%, transparent);margin:0 0 20px;font-size:11px;font-weight:800;transition:color .8s,text-shadow .8s}.hero h1{letter-spacing:-.07em;text-shadow:0 0 30px #ffffff0a;margin:0;font-size:clamp(58px,9vw,108px);font-weight:900;line-height:.9}.hero h1 span{color:var(--music-primary);text-shadow:0 0 18px color-mix(in srgb, var(--music-glow) 20%, transparent), 0 0 45px color-mix(in srgb, var(--music-glow) 35%, transparent);transition:color .8s,text-shadow .8s}.subtitle{color:#ffffff8c;text-shadow:0 0 15px #ffffff0a;max-width:580px;margin:30px auto 35px;font-size:15px;line-height:1.7}.search-box{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff0e;border:1px solid #ffffff17;border-radius:18px;width:min(650px,100%);margin:0 auto;padding:5px;transition:border-color .5s,box-shadow .5s,transform .3s;display:flex;box-shadow:0 15px 70px #00000059}.search-box:focus-within{border-color:color-mix(in srgb, var(--music-primary) 65%, transparent);box-shadow:0 0 40px color-mix(in srgb, var(--music-glow) 18%, transparent)}.search-box input{color:#fff;background:0 0;border:none;outline:none;flex:1;min-width:0;padding:17px 20px;font-size:14px}.search-box input::placeholder{color:#ffffff59}.search-box button{color:#fff;letter-spacing:.08em;background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));box-shadow:0 0 25px color-mix(in srgb, var(--music-glow) 25%, transparent);border:none;border-radius:14px;padding:0 28px;font-size:11px;font-weight:900;transition:transform .25s,box-shadow .4s}.search-box button:hover:not(:disabled){box-shadow:0 0 40px color-mix(in srgb, var(--music-glow) 45%, transparent);transform:translateY(-2px)}.search-box button:disabled{opacity:.55;cursor:wait}.error-message{color:#ff6b6b;margin-top:14px;font-size:12px}.visualizer{justify-content:center;align-items:center;width:100%;height:150px;margin-bottom:80px;display:flex}.wave{justify-content:center;align-items:center;gap:4px;width:100%;height:130px;display:flex}@keyframes waveBounce{0%{transform:scaleY(.2)}to{transform:scaleY(1)}}.bar{background:var(--music-primary);width:5px;height:90px;box-shadow:0 0 15px var(--music-glow);transform-origin:bottom;will-change:transform;border-radius:999px;transition:background .8s,box-shadow .8s;animation:1.1s ease-in-out infinite alternate waveBounce;transform:scaleY(.2)}.artist-card{will-change:transform, opacity;background:linear-gradient(135deg, color-mix(in srgb, var(--music-primary) 8%, #ffffff09), #ffffff05);border:1px solid color-mix(in srgb, var(--music-primary) 18%, #ffffff0f);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:30px;grid-template-columns:minmax(280px,400px) 1fr;align-items:center;gap:60px;margin-bottom:100px;padding:35px;scroll-margin-top:100px;transition:background .8s,border-color .8s,box-shadow .8s,transform .4s;display:grid;box-shadow:0 30px 100px #0000004d}.artist-card:hover{box-shadow:0 35px 110px #00000059, 0 0 45px color-mix(in srgb, var(--music-glow) 8%, transparent)}.artist-image{aspect-ratio:1;background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));box-shadow:0 20px 70px color-mix(in srgb, var(--music-glow) 25%, transparent);border-radius:24px;transition:box-shadow .8s,transform .4s;overflow:hidden}.artist-image:hover{box-shadow:0 25px 80px color-mix(in srgb, var(--music-glow) 38%, transparent);transform:translateY(-4px)}.artist-image img{object-fit:cover;width:100%;height:100%;transition:transform .8s;display:block}.artist-image:hover img{transform:scale(1.05)}.image-placeholder{text-align:center;color:#fff;width:100%;height:100%;text-shadow:0 0 25px color-mix(in srgb, var(--music-glow) 45%, transparent);justify-content:center;align-items:center;padding:30px;font-size:30px;font-weight:900;display:flex}.artist-info .label{letter-spacing:.2em;color:var(--music-primary);text-shadow:0 0 15px color-mix(in srgb, var(--music-glow) 35%, transparent);margin:0 0 15px;font-size:10px;font-weight:900;transition:color .8s,text-shadow .8s}.artist-info h2{letter-spacing:-.05em;text-shadow:0 0 20px #ffffff0a;margin:0 0 18px;font-size:clamp(42px,5vw,70px);line-height:.95;transition:text-shadow .4s,transform .4s}.artist-info h2:hover{text-shadow:0 0 22px color-mix(in srgb, var(--music-glow) 25%, transparent);transform:translate(3px)}.artist-info>p:not(.label){color:#ffffff8c;text-shadow:0 0 12px #ffffff08;max-width:500px;font-size:14px;line-height:1.7}.genre-tags{flex-wrap:wrap;gap:8px;margin:22px 0;display:flex}.genre-tags span{background:color-mix(in srgb, var(--music-primary) 12%, transparent);border:1px solid color-mix(in srgb, var(--music-primary) 25%, transparent);color:color-mix(in srgb, var(--music-primary) 80%, white);border-radius:999px;padding:7px 11px;font-size:10px;font-weight:700;transition:transform .25s,background .3s,box-shadow .3s}.genre-tags span:hover{background:color-mix(in srgb, var(--music-primary) 20%, transparent);box-shadow:0 0 18px color-mix(in srgb, var(--music-glow) 20%, transparent);transform:translateY(-2px)}.play-button{color:#fff;background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));letter-spacing:.08em;box-shadow:0 10px 35px color-mix(in srgb, var(--music-glow) 25%, transparent);border:none;border-radius:999px;margin-top:20px;padding:14px 22px;font-size:11px;font-weight:900;transition:transform .25s,box-shadow .4s}.play-button:hover:not(:disabled){box-shadow:0 15px 45px color-mix(in srgb, var(--music-glow) 40%, transparent);transform:translateY(-3px)}.play-button:disabled{opacity:.4;cursor:not-allowed}.songs{margin-bottom:180px}.section-title{letter-spacing:.15em;color:#ffffff73;border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:18px;font-size:10px;font-weight:900;display:flex}.section-title span:first-child{color:var(--music-primary);text-shadow:0 0 14px color-mix(in srgb, var(--music-glow) 30%, transparent);transition:color .8s,text-shadow .8s}.song{border-bottom:1px solid #ffffff0f;border-radius:12px;align-items:center;gap:20px;padding:18px 14px;transition:background .3s,transform .3s;display:flex}.song:hover{background:color-mix(in srgb, var(--music-primary) 7%, transparent)}.song-number{color:#ffffff40;width:30px;font-size:11px;font-weight:800}.song-details{flex-direction:column;flex:1;gap:5px;min-width:0;display:flex}.song-details strong{text-overflow:ellipsis;white-space:nowrap;font-size:14px;transition:text-shadow .3s;overflow:hidden}.song:hover .song-details strong{text-shadow:0 0 14px color-mix(in srgb, var(--music-glow) 25%, transparent)}.song-details span{color:#fff6;text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}.song>button{border:1px solid color-mix(in srgb, var(--music-primary) 35%, #ffffff1a);background:color-mix(in srgb, var(--music-primary) 10%, transparent);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;font-size:13px;transition:transform .25s,background .4s,box-shadow .4s;display:flex}.song>button:hover{background:var(--music-primary);box-shadow:0 0 25px color-mix(in srgb, var(--music-glow) 45%, transparent);transform:scale(1.1)}.empty-state{text-align:center;color:#ffffff59;padding:60px 20px;font-size:13px}.player{z-index:9999;border:1px solid color-mix(in srgb, var(--music-primary) 25%, #ffffff1a);-webkit-backdrop-filter:blur(25px);width:min(900px,100% - 30px);box-shadow:0 15px 60px #00000080, 0 0 40px color-mix(in srgb, var(--music-glow) 15%, transparent);background:#0c0c10d1;border-radius:20px;justify-content:space-between;align-items:center;gap:20px;margin:0;padding:14px 18px;transition:border-color .8s,box-shadow .8s,background .8s;display:flex;position:fixed!important;bottom:20px!important;left:50%!important;transform:translate(-50%)!important}.player>div:first-child{flex-direction:column;gap:4px;min-width:0;display:flex}.player strong{text-overflow:ellipsis;white-space:nowrap;text-shadow:0 0 12px color-mix(in srgb, var(--music-glow) 15%, transparent);font-size:13px;overflow:hidden}.player span{color:#fff6;text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.player-controls{flex-shrink:0;align-items:center;gap:20px;display:flex}.player-controls>span{color:#ffffff4d;font-size:11px}.player-controls button{color:#fff;background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));width:46px;height:46px;box-shadow:0 0 25px color-mix(in srgb, var(--music-glow) 35%, transparent);border:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;transition:transform .2s,box-shadow .4s;display:flex}.player-controls button:hover{box-shadow:0 0 40px color-mix(in srgb, var(--music-glow) 55%, transparent);transform:scale(1.08)}.loading-screen{color:#fff;text-align:center;background:#050505;justify-content:center;align-items:center;min-height:100vh;display:flex}.loading-spinner{border:3px solid #ffffff1f;border-top-color:#8b5cf6;border-radius:50%;width:40px;height:40px;margin:0 auto 20px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.kpop .orb{border-radius:42%}.pop .orb{border-radius:50%}.hiphop .orb{border-radius:20%}.rock .orb{border-radius:15%}.metal .orb{border-radius:8%}.electronic .orb{filter:blur(80px);border-radius:35%}.rnb .orb{border-radius:50%}.country .orb{border-radius:30%}.indian .orb{border-radius:45%}@media (width<=800px){nav{width:calc(100% - 30px)}.nav-right span{display:none}main,.spotify-player-status{width:calc(100% - 30px)}.hero{min-height:420px}.hero h1{font-size:clamp(52px,15vw,82px)}.artist-card{grid-template-columns:1fr;gap:30px;margin-bottom:70px;padding:20px}.artist-image{width:100%;max-width:420px;margin:0 auto}.artist-info{text-align:center}.artist-info>p:not(.label){margin-left:auto;margin-right:auto}.genre-tags{justify-content:center}.player{width:calc(100% - 30px);bottom:15px!important}}@media (width<=550px){.search-box{background:#ffffff0b;flex-direction:column;padding:7px}.search-box button{min-height:48px}.hero{min-height:450px}.visualizer{margin-bottom:40px}.wave{gap:3px}.bar{width:3px}.song{gap:12px}.song-number{width:22px}.player{width:calc(100% - 20px);padding:11px 12px;bottom:10px!important}.player-controls{gap:10px}.player-controls>span{display:none}.player-controls button{width:42px;height:42px}}.nav-center-tabs{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff0a;border:1px solid #ffffff14;border-radius:999px;align-items:center;gap:6px;padding:4px;display:flex}.nav-tab-btn{color:#fff9;letter-spacing:.04em;background:0 0;border:none;border-radius:999px;align-items:center;gap:8px;padding:8px 16px;font-size:12px;font-weight:700;transition:all .3s;display:flex}.nav-tab-btn:hover{color:#fff;background:#ffffff0f}.nav-tab-btn.active{color:#fff;background:color-mix(in srgb, var(--music-primary) 35%, #ffffff14);box-shadow:0 0 20px color-mix(in srgb, var(--music-glow) 35%, transparent);border:1px solid color-mix(in srgb, var(--music-primary) 55%, transparent)}.nav-badge{background:var(--music-primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:10px;font-weight:800;display:flex}.logo{cursor:pointer}.listening-stats-view{width:min(1000px,100%);margin:0 auto 160px;padding-top:10px}.stats-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:35px;display:flex}.stats-header-left h2{letter-spacing:-.04em;margin:0 0 10px;font-size:clamp(34px,5vw,48px);font-weight:900;line-height:1}.stats-user-badge{color:#fff9;align-items:center;gap:10px;font-size:12px;display:flex}.stats-avatar{border:2px solid var(--music-primary);border-radius:50%;width:28px;height:28px}.stats-user-badge strong{color:#fff}.time-range-picker{background:#ffffff0a;border:1px solid #ffffff14;border-radius:999px;gap:6px;padding:4px;display:flex}.range-button{color:#ffffff80;background:0 0;border:none;border-radius:999px;padding:8px 14px;font-size:11px;font-weight:700;transition:all .25s}.range-button:hover{color:#fff}.range-button.active{background:color-mix(in srgb, var(--music-primary) 30%, transparent);color:#fff;border:1px solid color-mix(in srgb, var(--music-primary) 60%, transparent);box-shadow:0 0 15px color-mix(in srgb, var(--music-glow) 30%, transparent)}.stats-loading,.stats-error-banner{text-align:center;background:#ffffff05;border:1px solid #ffffff0f;border-radius:20px;margin-bottom:40px;padding:60px 20px}.stats-error-banner p{color:#ff6b6b;margin-bottom:15px}.retry-button{background:var(--music-primary);color:#fff;border:none;border-radius:999px;padding:8px 20px;font-size:12px;font-weight:700}.stats-metrics-row{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:30px;display:grid}.stat-metric-card{border:1px solid color-mix(in srgb, var(--music-primary) 20%, #ffffff14);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(135deg,#ffffff0d,#ffffff04);border-radius:24px;align-items:center;gap:20px;padding:24px;transition:all .3s;display:flex;box-shadow:0 15px 40px #00000040}.stat-metric-card:hover{border-color:color-mix(in srgb, var(--music-primary) 50%, transparent);box-shadow:0 20px 50px #00000059, 0 0 25px color-mix(in srgb, var(--music-glow) 15%, transparent)}.metric-icon{background:color-mix(in srgb, var(--music-primary) 15%, transparent);border:1px solid color-mix(in srgb, var(--music-primary) 30%, transparent);border-radius:18px;justify-content:center;align-items:center;width:60px;height:60px;font-size:36px;display:flex}.metric-info{flex-direction:column;gap:4px;display:flex}.metric-label{letter-spacing:.12em;text-transform:uppercase;color:#ffffff73;font-size:11px;font-weight:800}.metric-value{color:#fff;text-shadow:0 0 20px color-mix(in srgb, var(--music-glow) 35%, transparent);font-size:32px;font-weight:900;line-height:1}.metric-unit{color:var(--music-primary);font-size:14px;font-weight:700}.metric-subtext{color:#ffffff80;font-size:12px}.stats-genre-pills{flex-wrap:wrap;gap:6px;margin-top:4px;display:flex}.genre-pill{background:color-mix(in srgb, var(--music-primary) 18%, transparent);border:1px solid color-mix(in srgb, var(--music-primary) 35%, transparent);color:color-mix(in srgb, var(--music-primary) 85%, white);text-transform:capitalize;border-radius:999px;padding:4px 10px;font-size:10px;font-weight:700}.top-artist-spotlight{background:linear-gradient(135deg, color-mix(in srgb, var(--music-primary) 12%, #ffffff0a), #ffffff05);border:1px solid color-mix(in srgb, var(--music-primary) 30%, #ffffff1a);-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);box-shadow:0 25px 70px #00000059, 0 0 35px color-mix(in srgb, var(--music-glow) 15%, transparent);border-radius:28px;margin-bottom:40px;padding:30px;position:relative;overflow:hidden}.spotlight-badge{background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));color:#fff;letter-spacing:.1em;box-shadow:0 0 20px color-mix(in srgb, var(--music-glow) 40%, transparent);border-radius:999px;margin-bottom:20px;padding:6px 14px;font-size:10px;font-weight:900;display:inline-block}.spotlight-body{grid-template-columns:240px 1fr;align-items:center;gap:35px;display:grid}.spotlight-image-wrapper{aspect-ratio:1;box-shadow:0 15px 40px #00000080, 0 0 25px color-mix(in srgb, var(--music-glow) 25%, transparent);border:2px solid color-mix(in srgb, var(--music-primary) 40%, transparent);border-radius:20px;overflow:hidden}.spotlight-image{object-fit:cover;width:100%;height:100%;transition:transform .6s;display:block}.top-artist-spotlight:hover .spotlight-image{transform:scale(1.05)}.spotlight-details{flex-direction:column;gap:12px;display:flex}.spotlight-label{letter-spacing:.2em;color:var(--music-primary);margin:0;font-size:10px;font-weight:900}.spotlight-details h3{letter-spacing:-.04em;margin:0;font-size:clamp(32px,4vw,44px);font-weight:900;line-height:1}.artist-popularity{flex-direction:column;gap:6px;max-width:320px;margin:8px 0;display:flex}.popularity-label{color:#ffffff80;justify-content:space-between;font-size:11px;font-weight:700;display:flex}.popularity-bar-bg{background:#ffffff1a;border-radius:999px;width:100%;height:6px;overflow:hidden}.popularity-bar-fill{background:linear-gradient(90deg, var(--music-primary), var(--music-secondary));height:100%;box-shadow:0 0 10px var(--music-glow);border-radius:999px}.explore-artist-cta{background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));color:#fff;letter-spacing:.08em;cursor:pointer;box-shadow:0 8px 25px color-mix(in srgb, var(--music-glow) 35%, transparent);border:none;border-radius:999px;align-self:flex-start;margin-top:10px;padding:12px 24px;font-size:11px;font-weight:900;transition:all .3s}.explore-artist-cta:hover{box-shadow:0 12px 35px color-mix(in srgb, var(--music-glow) 55%, transparent);transform:translateY(-2px)}.favorite-songs-section{margin-top:20px}.favorite-songs-list{flex-direction:column;gap:12px;margin-top:15px;display:flex}.favorite-song-card{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#ffffff08;border:1px solid #ffffff0f;border-radius:16px;align-items:center;gap:16px;padding:14px 18px;transition:all .25s;display:flex}.favorite-song-card:hover{background:color-mix(in srgb, var(--music-primary) 10%, #ffffff0d);border-color:color-mix(in srgb, var(--music-primary) 30%, transparent);box-shadow:0 10px 30px #0000004d, 0 0 20px color-mix(in srgb, var(--music-glow) 15%, transparent)}.favorite-song-card.current-playing{background:color-mix(in srgb, var(--music-primary) 18%, #ffffff0f);border-color:var(--music-primary);box-shadow:0 0 25px color-mix(in srgb, var(--music-glow) 30%, transparent)}.song-rank-badge{width:32px;color:var(--music-primary);text-shadow:0 0 15px color-mix(in srgb, var(--music-glow) 40%, transparent);font-size:16px;font-weight:900}.song-artwork-box{border-radius:10px;flex-shrink:0;width:48px;height:48px;position:relative;overflow:hidden;box-shadow:0 4px 12px #0006}.song-thumbnail{object-fit:cover;width:100%;height:100%}.song-thumbnail-placeholder{background:#ffffff14;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.song-play-overlay{color:#fff;opacity:0;background:#00000080;border:none;justify-content:center;align-items:center;font-size:14px;transition:opacity .2s;display:flex;position:absolute;inset:0}.favorite-song-card:hover .song-play-overlay{opacity:1}.song-meta{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.song-title{white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:800;overflow:hidden}.song-artist{color:#ffffff73;white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.song-album-name{color:#ffffff59;white-space:nowrap;text-overflow:ellipsis;max-width:220px;font-size:11px;overflow:hidden}.song-duration{color:#fff6;margin-right:8px;font-size:11px;font-weight:700}.song-action-play{border:1px solid color-mix(in srgb, var(--music-primary) 40%, #ffffff1a);background:color-mix(in srgb, var(--music-primary) 15%, transparent);color:#fff;cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:12px;transition:all .25s;display:flex}.song-action-play:hover{background:var(--music-primary);box-shadow:0 0 20px var(--music-glow);transform:scale(1.1)}.stats-connect-prompt{text-align:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff08;border:1px solid #ffffff14;border-radius:30px;max-width:500px;margin:40px auto;padding:80px 20px}.stats-lock-icon{margin-bottom:20px;font-size:48px}.stats-connect-prompt h2{margin:0 0 12px;font-size:26px}.stats-connect-prompt p{color:#ffffff8c;margin-bottom:25px;font-size:14px;line-height:1.6}.stats-cta-button{background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));color:#fff;letter-spacing:.1em;box-shadow:0 10px 30px color-mix(in srgb, var(--music-glow) 40%, transparent);cursor:pointer;border:none;border-radius:999px;padding:14px 28px;font-size:11px;font-weight:900;transition:transform .25s}.stats-cta-button:hover{transform:translateY(-2px)}.search-history-view{width:min(1000px,100%);margin:0 auto 160px;padding-top:10px}.history-header{justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:35px;display:flex}.history-header h2{letter-spacing:-.04em;margin:0 0 8px;font-size:clamp(34px,5vw,48px);font-weight:900}.history-subtitle{color:#ffffff80;max-width:580px;margin:0;font-size:14px}.clear-history-button{color:#ffffffa6;cursor:pointer;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:999px;padding:8px 16px;font-size:11px;font-weight:700;transition:all .25s}.clear-history-button:hover{color:#ff6b6b;background:#ff6b6b14;border-color:#ff6b6b66}.history-empty-state{text-align:center;background:#ffffff05;border:1px dashed #ffffff14;border-radius:24px;margin-top:20px;padding:80px 20px}.empty-icon{margin-bottom:16px;font-size:44px}.history-empty-state h3{margin:0 0 8px;font-size:20px}.history-empty-state p{color:#ffffff73;max-width:420px;margin:0 auto;font-size:13px}.history-cards-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-top:20px;display:grid}.history-artist-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(135deg,#ffffff0a,#ffffff04);border:1px solid #ffffff14;border-radius:22px;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 15px 40px #00000040}.history-artist-card:hover{border-color:color-mix(in srgb, var(--music-primary) 40%, transparent);box-shadow:0 20px 50px #0006, 0 0 25px color-mix(in srgb, var(--music-glow) 20%, transparent)}.history-order-badge{z-index:2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--music-primary);background:#000000a6;border:1px solid #ffffff26;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:900;position:absolute;top:14px;left:14px}.history-image-container{aspect-ratio:16/10;background:#111;width:100%;overflow:hidden}.history-image{object-fit:cover;width:100%;height:100%;transition:transform .6s}.history-artist-card:hover .history-image{transform:scale(1.06)}.history-image-fallback{background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));color:#fff;justify-content:center;align-items:center;width:100%;height:100%;font-size:40px;font-weight:900;display:flex}.history-card-content{flex-direction:column;gap:10px;padding:18px;display:flex}.history-meta-top{justify-content:space-between;display:flex}.history-time{color:#fff6;font-size:10px;font-weight:700}.history-artist-name{white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:18px;font-weight:800;overflow:hidden}.history-genre-tags{flex-wrap:wrap;gap:6px;display:flex}.history-genre-tags span{color:#fff9;text-transform:capitalize;background:#ffffff0f;border-radius:999px;padding:3px 8px;font-size:9px;font-weight:700}.history-card-actions{gap:8px;margin-top:6px;display:flex}.history-explore-btn{background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));color:#fff;letter-spacing:.06em;cursor:pointer;box-shadow:0 4px 15px color-mix(in srgb, var(--music-glow) 25%, transparent);border:none;border-radius:12px;flex:1;padding:10px;font-size:10px;font-weight:900;transition:all .25s}.history-explore-btn:hover{box-shadow:0 6px 20px color-mix(in srgb, var(--music-glow) 40%, transparent);transform:translateY(-2px)}.history-remove-btn{color:#fff6;cursor:pointer;background:#ffffff0a;border:1px solid #ffffff14;border-radius:12px;justify-content:center;align-items:center;width:34px;height:34px;font-size:12px;transition:all .2s;display:flex}.history-remove-btn:hover{color:#ff6b6b;border-color:#ff6b6b4d}@media (width<=800px){.nav-center-tabs{order:3;justify-content:center;width:100%;margin-top:14px}nav{flex-wrap:wrap}.stats-metrics-row{grid-template-columns:1fr}.spotlight-body{text-align:center;grid-template-columns:1fr}.spotlight-image-wrapper{max-width:220px;margin:0 auto}.artist-popularity{margin:8px auto}.explore-artist-cta{align-self:center}.song-album-name{display:none}}.vibewave-footer{z-index:10;border-top:1px solid #ffffff0d;width:100%;margin-top:140px;padding:60px 20px 220px;position:relative}.footer-content{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:14px;max-width:900px;margin:0 auto;display:flex}.footer-excellence-text{letter-spacing:.22em;text-transform:uppercase;color:#ffffff8c;background:linear-gradient(135deg, #fffc, color-mix(in srgb, var(--music-primary) 60%, #ffffff80));-webkit-text-fill-color:transparent;text-shadow:0 0 20px color-mix(in srgb, var(--music-glow) 20%, transparent);-webkit-background-clip:text;margin:0;font-size:10px;font-weight:700}.contact-benjohn-button{background:linear-gradient(135deg, color-mix(in srgb, var(--music-primary) 18%, #ffffff0a), #ffffff05);border:1px solid color-mix(in srgb, var(--music-primary) 35%, #ffffff1a);color:#ffffffd9;letter-spacing:.1em;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:0 6px 20px #00000040, 0 0 15px color-mix(in srgb, var(--music-glow) 15%, transparent);cursor:pointer;border-radius:999px;align-items:center;gap:7px;padding:7px 18px;font-size:9.5px;font-weight:700;text-decoration:none;transition:all .3s cubic-bezier(.16,1,.3,1);display:inline-flex}.contact-benjohn-button:hover{background:linear-gradient(135deg, var(--music-primary), var(--music-secondary));color:#fff;box-shadow:0 10px 30px color-mix(in srgb, var(--music-glow) 40%, transparent), 0 0 25px color-mix(in srgb, var(--music-primary) 50%, transparent);border-color:#0000;transform:translateY(-2px)scale(1.02)}.contact-benjohn-button svg{transition:transform .3s}.contact-benjohn-button:hover svg{transform:translate(2px)}