*{margin:0;padding:0;box-sizing:border-box}body{font-family:Lucida Console,monospace;background:#fff;min-height:100vh;min-height:100dvh;color:#000;font-size:clamp(11px,1.2vw,14px)}.app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.header{display:grid;grid-template-columns:1fr auto 1fr;align-items:flex-end;padding:.5rem 1rem;min-height:50px}.header-left{justify-self:start}.header-center{justify-self:center}.header-right{justify-self:end}.header-left h1{font-size:clamp(13px,1.5vw,16px);font-weight:400;text-transform:lowercase;margin-bottom:.1rem}.header-left h1 a{color:#000;text-decoration:none}.header-left h1 a:hover{text-decoration:underline}.header-left p{font-size:clamp(11px,1.2vw,13px);color:#000;margin:0}.header-center{display:flex;align-items:center;gap:.5rem;padding:0 1rem}.header-right{display:flex;align-items:center}.artist-input{padding:.35rem .5rem .3rem;border:1px solid black;font-size:clamp(11px,1.2vw,13px);font-family:inherit;background:#fff;width:275.5px;height:calc(clamp(11px,1.2vw,13px) + 1rem + 2px);line-height:1.2}.artist-input-wrapper[data-has-action] .artist-input{padding-right:calc(clamp(11px,1.2vw,13px) + 1rem + 2px)}.artist-input:focus{outline:1px solid black;outline-offset:-1px}.swap-button{padding:.25rem .5rem;border:1px solid black;font-size:clamp(11px,1.2vw,13px);font-family:inherit;background:#fff;box-sizing:border-box;height:calc(clamp(11px,1.2vw,13px) + 1rem + 2px);width:calc(clamp(11px,1.2vw,13px) + 1rem + 2px);display:flex;align-items:center;justify-content:center}.swap-button:hover{background:#000;color:#fff}.setting{display:flex;align-items:center;gap:.25rem}.setting label{font-size:11px;white-space:nowrap;color:#000}.setting-input{width:auto;padding:0rem .125rem;border:1px solid black;font-size:11px;min-width:36px;max-width:36px;font-family:inherit;background:#fff;text-align:center;appearance:none;-webkit-appearance:none;-moz-appearance:textfield}.setting-input::-webkit-outer-spin-button,.setting-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.setting-input:focus{outline:1px solid black;outline-offset:-1px}.algorithm-toggle{padding:0rem .125rem;border:1px solid black;font-size:11px;width:59px;font-family:inherit;background:#fff;color:#000;cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none}.algorithm-toggle:hover{background:#000;color:#fff}.algorithm-toggle:focus{outline:none}.settings-overlay{position:absolute;top:0;left:50%;transform:translate(-50%);height:calc(clamp(11px,1.2vw,13px) + 1rem + 2px);width:598px;z-index:10;background:#fff;border:1px solid black;border-top:none;padding:.5rem;display:flex;gap:20px;align-items:center}.main{flex:1;padding:.5rem 1rem;display:flex}.visualization{background:#fff;border:1px solid black;flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:clamp(10px,1.1vw,12px);line-height:1.5;color:#696969;position:relative}.visualization p{max-width:90%;text-align:center;color:#000}.force-render-button{color:#c00;font-size:clamp(10px,1.1vw,12px);padding:.05rem .2rem;font-family:inherit;background:#fff;border:1px solid black;cursor:pointer}.force-render-button:hover{background:#c00;color:#fff}.mobile-break{display:none}.stats{font-size:10px;color:#000;text-align:left;line-height:1.5}.stats a{color:#000;text-decoration:none}.stats a:hover{color:#000;text-decoration:underline}.graph-stats-link{font-size:10px;color:#000;text-align:right;line-height:1.5}.graph-stats-link a{color:#000;text-decoration:none}.graph-stats-link a:hover{text-decoration:underline}.mobile-stats,.mobile-footer-container{display:none}.footer{padding:.5rem 1rem;padding-top:0;display:flex;justify-content:space-between;align-items:center}.footer-left{display:flex;align-items:center}.footer-right{display:flex;gap:20px;align-items:center}.status-info{font-size:10px;color:#000}.status-info.error{color:#c00}.loading{color:#000}.loading-dots span{visibility:hidden}.loading-dots:nth-child(1){animation-delay:0s}.loading-dots .dot-1{animation:show-dot-1 3s steps(3) infinite}.loading-dots .dot-2{animation:show-dot-2 3s steps(3) infinite}.loading-dots .dot-3{animation:show-dot-3 3s steps(3) infinite}@keyframes show-dot-1{0%,33.33%{visibility:visible}33.34%,66.66%{visibility:visible}66.67%,to{visibility:visible}}@keyframes show-dot-2{0%,33.33%{visibility:hidden}33.34%,66.66%{visibility:visible}66.67%,to{visibility:visible}}@keyframes show-dot-3{0%,33.33%{visibility:hidden}33.34%,66.66%{visibility:hidden}66.67%,to{visibility:visible}}.artist-input-wrapper{position:relative;display:inline-block;flex:1;min-width:0}.input-action-icon{position:absolute;right:0;top:0;bottom:0;width:calc(clamp(11px,1.2vw,13px) + 1rem + 2px);border:none;background:none;color:#000;cursor:pointer;font-size:14px;font-family:inherit;z-index:1;display:flex;align-items:center;justify-content:center;line-height:1}.input-action-icon:hover{color:#000}.suggestions{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid black;border-top:none;z-index:1000}.suggestion{padding:.5rem;cursor:pointer;font-size:clamp(11px,1.2vw,13px);font-family:inherit}.suggestion:hover,.suggestion.selected{background:#000;color:#fff}@media (max-width: 768px){body{font-size:14px}.header{display:flex;flex-direction:column;padding:1rem .5rem;gap:1rem;height:auto;align-items:stretch;padding:.5rem}.header-left{text-align:center;justify-self:center}.header-left h1{font-size:16px}.header-left p{font-size:12px}.header-center{display:flex;gap:.5rem;justify-self:center;width:100%;max-width:100%;padding:0}.header-right{display:none}.artist-input{font-size:14px;padding:.8rem .75rem .7rem;min-width:0;width:100%;line-height:1.2;height:2rem}.swap-button{font-size:14px;padding:.75rem;width:auto;aspect-ratio:1;height:2rem}.swap-button:hover{background:#fff;color:#000}.main{padding:.5rem;padding-top:0}.visualization{font-size:12px}.visualization p.help-message{font-size:11px}.force-render-button{font-size:12px}.mobile-break{display:inline}.footer,.footer-left{display:none}.mobile-footer-container{display:block;padding:.5rem;padding-top:0}.mobile-status-stats{display:flex;flex-direction:column}.mobile-stats{display:flex;justify-content:space-between;font-size:11px;color:#000;width:100%}.mobile-stats a{color:#000}.settings-overlay{padding:.5rem .75rem;width:100%;border:none;border-bottom:1px solid black;height:auto;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;row-gap:1rem;column-gap:3rem}.settings-overlay .setting{display:flex;justify-content:space-between;align-items:center;gap:0}.setting label{font-size:12px}.setting-input{font-size:12px;height:1.5rem;min-width:40px}.algorithm-toggle{font-size:12px;height:1.5rem;width:65px}.algorithm-toggle:hover{background:#fff;color:#000}.status-info{font-size:11px;min-height:14px;min-width:calc(100vw - 4rem)}.stats div{font-size:11px}.suggestion{padding:1rem;font-size:14px}.input-action-icon{font-size:14px}}.artist-card{position:absolute;top:calc(31px + 1rem);width:360px;max-height:calc(100% - 2rem - 31px);background:none;z-index:5;font-family:inherit;font-size:clamp(11px,1.2vw,13px);display:flex;flex-direction:column}@media (min-width: calc(6rem + 1318px)){.artist-card{top:1rem;max-height:calc(100% - 2rem)}}.artist-card.open{right:1rem}.artist-card-header{position:absolute;top:0;right:0;padding:1rem;background:transparent;z-index:10}.close-button{background:#fff;border:1px solid black;font-family:inherit;font-size:16px;padding:.25rem .5rem;cursor:pointer;line-height:1}.close-button:hover{background:#000;color:#fff}.artist-card-loading{padding:0 1rem 1rem;text-align:center;color:#000;border:1px solid black;background:#fff;height:25vh;display:flex;align-items:center;justify-content:center}.artist-loading-text{font-size:11px;margin-top:1rem}.artist-card-error{padding:0 1rem 1rem;border:1px solid black;background:#fff;height:25vh;overflow-y:auto;display:flex;flex-direction:column;justify-content:space-between;font-size:11px}.error-message{color:#c00;text-align:left;margin:0;font-size:11px}.fallback-info{text-align:center;flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center}.fallback-info h3{font-size:16px;color:#000;font-weight:400}.fallback-info a{color:#000;text-decoration:none;font-size:11px}.fallback-info a:hover{text-decoration:underline}.artist-card-content{padding:0 1rem 1rem;overflow-y:auto;border:1px solid black;background:#fff;max-height:100%}.artist-header{display:flex;gap:1rem;padding-top:1rem;padding-bottom:1rem;align-items:flex-start;position:sticky;top:0;background:#fff}.artist-info{flex:1;min-width:0}.artist-name-link{color:#000;text-decoration:none}.artist-name-link span:hover{text-decoration:underline}.artist-info h3{font-size:16px;margin-bottom:.25rem;color:#000;font-weight:400;line-height:1.3;padding-right:60px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.artist-stats-inline{display:flex;flex-direction:column;gap:.125rem;font-size:11px;color:#696969}.artist-stats{display:flex;gap:2rem;margin-bottom:1.5rem;padding:1rem;background:#fff;border:1px solid black}.stat{display:flex;flex-direction:column;align-items:center;text-align:center}.stat-label{font-size:11px;color:#000;margin-bottom:.25rem}.stat-value{font-size:12px;color:#000}.artist-tags{margin-bottom:1.5rem}.tags-label{font-size:12px;color:#000;margin-bottom:.5rem;display:block}.tags{display:flex;flex-wrap:wrap;gap:.5rem}.tag{background:#000;color:#fff;padding:.125rem .375rem;font-size:11px;border-radius:0}.artist-bio{margin-bottom:1.5rem}.bio-text{line-height:1.5;color:#000;font-size:11px;margin-bottom:.5rem}.bio-text a{color:#000;text-decoration:underline}.bio-text a:hover{background:#000;color:#fff}.bio-toggle{background:none;border:1px solid black;color:#000;font-family:inherit;font-size:11px;padding:.25rem .5rem;cursor:pointer;margin-top:.5rem}.bio-toggle:hover{background:#000;color:#fff}.top-tracks h4{font-size:12px;margin-bottom:.75rem;color:#000;font-weight:400}.tracks-list{display:flex;flex-direction:column;gap:.5rem}.track{border:1px solid black}.track:hover{border-color:#000;background:#000}.track:hover .track-name,.track:hover .track-stats{color:#fff}.track-content{display:flex;justify-content:space-between;align-items:center;padding:.75rem}.track-info{display:flex;flex-direction:column;gap:.125rem;flex:1;min-width:0}.track-name{font-size:11px;color:#000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-stats{font-size:11px;color:#696969}.track-actions{display:flex;gap:.5rem;align-items:center;flex-shrink:0}.play-button,.youtube-link{background:#fff;border:1px solid black;font-size:11px;padding:.25rem .375rem;color:#000;font-family:inherit;height:25px;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}.play-button{cursor:pointer}.youtube-link{text-decoration:none}.play-button:hover,.youtube-link:hover{background:#000;color:#fff}.artist-actions{display:flex;gap:1rem;padding:1rem 0 0;flex-shrink:0;background:transparent}.action-button{flex:1;padding:.75rem 1rem;border:1px solid black;background:#fff;color:#000;font-family:inherit;font-size:11px;cursor:pointer}.action-button:hover{background:#000;color:#fff}@media (max-width: 768px){.artist-card{right:-100%;width:100%;top:0;bottom:0;left:0;padding:.5rem;background:#fff;max-height:100%;z-index:1000}.artist-card-loading,.artist-card-error,.artist-card-content{height:100%}.artist-actions{padding:.5rem 0 0;gap:.5rem}}
