.loading-screen{display:flex;justify-content:center;align-items:center;flex-grow:1}.loading-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top-color:var(--color-spotify-green);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.cover-overlay{position:absolute;width:100%;height:100%;z-index:1;pointer-events:none}.cover-overlay__gradient{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(-45deg,#ee7752,#e73c7e,#23a6d5,#23d5ab,#361fe2,#0eb71c,#0eb71c,#361fe2,#23d5ab,#23a6d5,#e73c7e,#ee7752);opacity:.6;background-size:1200% 1200%;animation:gradient-entrance 2s ease-out forwards,move-background 360s ease infinite alternate}@keyframes gradient-entrance{0%{opacity:0;transform:scale(1.15)}to{opacity:.6;transform:scale(1)}}.cover-overlay__color{position:absolute;top:0;right:0;bottom:0;left:0;transition:background 3s ease-in-out,opacity 3s ease-in-out}.cover-overlay__darken{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,#0000004d 0,#000000bf 75%,#000);animation:darken-entrance 2s ease-out forwards}@keyframes darken-entrance{0%{opacity:0}to{opacity:1}}.song-card{display:flex;position:absolute;flex-wrap:wrap;align-items:center;left:var(--spacing-overlay-inset);bottom:var(--spacing-overlay-inset);z-index:var(--z-overlay-chrome);transition:opacity .5s ease-in-out}.song-card--visible{opacity:1}.song-card--hidden{opacity:0}.song-card__cover{width:151px;height:151px;margin-right:16px;border:2px solid rgba(252,252,252,.95);background-size:cover;background-position:center;transition:background-image 1s ease-in 1s,box-shadow 3s ease-in-out;box-shadow:var(--shadow-elevation-3)}.song-card__details{display:flex;flex-direction:column;max-width:350px}.song-card__text{color:var(--color-text-primary);text-shadow:2px 2px 7px rgba(94,94,94,.44);padding:0;word-wrap:break-word;overflow-wrap:break-word}.song-card__artist{font-size:clamp(1em,3vw,1.5em);font-weight:700}.song-card__album{font-size:clamp(.85em,2.5vw,1.2em)}.song-card__title{font-size:clamp(.85em,2.5vw,1.2em);margin-top:.8em}@media(max-width:600px){.song-card{left:var(--spacing-overlay-inset-mobile);bottom:40px}.song-card__cover{width:80px;height:80px;margin-right:12px}.song-card__details{width:200px}.song-card__artist{font-size:1.1em}.song-card__album,.song-card__title{font-size:.9em}}.flippable-tile{width:100%;height:100%;position:relative;perspective:800px;opacity:0;transition:opacity .4s ease-out}.flippable-tile--entered{opacity:1}.flippable-tile__face{position:absolute;top:0;right:0;bottom:0;left:0;backface-visibility:hidden;transition:transform .8s ease-in-out}.flippable-tile__face img{width:100%;height:100%;object-fit:cover;display:block}.flippable-tile__front{transform:rotateY(0)}.flippable-tile__back{transform:rotateY(180deg)}.flippable-tile--flipped .flippable-tile__front{transform:rotateY(-180deg)}.flippable-tile--flipped .flippable-tile__back{transform:rotateY(0)}.album-grid-viewport{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}.album-grid{display:grid;animation:mosaic-drift 180s cubic-bezier(.37,0,.63,1) infinite alternate;will-change:transform;transform:translateZ(0);backface-visibility:hidden}.album-grid__tile{overflow:hidden}.album-grid__tile img{width:100%;height:100%;object-fit:cover;display:block}@keyframes mosaic-drift{0%{transform:translateZ(0)}20%{transform:translate3d(-6%,-4%,0)}40%{transform:translate3d(-12%,-1%,0)}60%{transform:translate3d(-4%,-9%,0)}80%{transform:translate3d(-10%,-6%,0)}to{transform:translate3d(-8%,-10%,0)}}.progress-bar{position:absolute;bottom:0;left:50%;transform:translate(-50%);z-index:var(--z-overlay-chrome);display:flex;align-items:center;gap:8px;padding:0 0 35px;max-width:250px;width:100%;pointer-events:none}.progress-bar__time{font-size:.7rem;color:#ffffff80;font-variant-numeric:tabular-nums;width:32px;flex-shrink:0}.progress-bar__time:first-child{text-align:right}.progress-bar__track{flex:1;height:2px;background:#ffffff26;border-radius:1px;overflow:hidden}.progress-bar__fill{height:100%;background:#fff6;border-radius:1px;transition:width .3s linear}@media(max-width:600px){.progress-bar{left:var(--spacing-overlay-inset-mobile);transform:none;bottom:var(--spacing-overlay-inset-mobile);max-width:200px;padding:0}}.visualization{display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative}.visualization__content{position:relative;z-index:var(--z-overlay-bg);display:flex;flex-direction:column;flex-grow:1;background-color:transparent}.visualization__github-icon{position:absolute;left:var(--spacing-overlay-inset);top:calc(var(--spacing-overlay-inset) + 5px);z-index:var(--z-overlay-chrome)}.visualization__user-container{position:absolute;top:var(--spacing-overlay-inset);right:var(--spacing-overlay-inset);z-index:var(--z-overlay-chrome);display:flex}.visualization__loading{z-index:var(--z-overlay-chrome);align-self:center;margin:auto 0}.visualization__empty{display:flex;flex-grow:1;justify-content:center;align-items:center;z-index:var(--z-overlay-chrome)}.visualization__error{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:var(--z-overlay-chrome);gap:16px}.visualization__error--overlay{background-color:#000000bf}.visualization__error p{color:#ffffffb3}.visualization__bottom-gradient{position:absolute;bottom:0;left:0;width:100%;height:150px;z-index:var(--z-overlay-gradient);background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.5) 30%,rgba(0,0,0,.15) 60%,transparent 100%);pointer-events:none;animation:pulse-gradient 4s ease-in-out infinite alternate}@media(max-width:600px){.visualization__github-icon{display:none}.visualization__user-container{top:var(--spacing-overlay-inset-mobile);right:var(--spacing-overlay-inset-mobile)}}@keyframes pulse-gradient{0%{height:150px;opacity:.85}50%{height:170px;opacity:1}to{height:140px;opacity:.75}}.app{display:flex;flex-direction:column;flex-grow:1}.app__content{display:flex;flex-grow:1}.app__staging-banner{position:fixed;top:0;left:0;right:0;z-index:9999;padding:4px 8px;background:#f0a;color:#fff;font-family:sans-serif;font-size:12px;font-weight:700;letter-spacing:.2em;text-align:center;pointer-events:none}:root{--color-spotify-green: #1db954;--color-spotify-green-hover: #1ed760;--color-bg-primary: #212121;--color-bg-surface: #1a1a1a;--color-text-primary: rgba(255, 255, 255, .87);--color-text-secondary: rgba(255, 255, 255, .54);--shadow-elevation-3: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12);--spacing-overlay-inset: 30px;--spacing-overlay-inset-mobile: 15px;--font-size-sm: .8rem;--radius-sm: 4px;--color-border-subtle: rgba(255, 255, 255, .1);--z-overlay-bg: 0;--z-overlay-gradient: 50;--z-overlay-chrome: 100;--z-dropdown: 200}*{box-sizing:border-box}html{width:100%;height:100%}body{display:flex;flex-direction:column;height:100%;margin:0;padding:0;font-family:Source Sans Pro,sans-serif;background-color:var(--color-bg-primary);color:#fff}#root{display:flex;flex-direction:column;flex-grow:1}.btn-primary{display:inline-flex;align-items:center;padding:10px 24px;background-color:var(--color-spotify-green);color:#fff;border:none;border-radius:var(--radius-sm);font-size:.875rem;font-weight:600;letter-spacing:.05em;cursor:pointer;transition:background-color .2s}.btn-primary:hover{background-color:var(--color-spotify-green-hover)}.icon-interactive{color:var(--color-text-primary)}.icon-interactive:hover,.icon-interactive:focus-visible{color:var(--color-text-secondary)}.focus-ring:focus-visible{outline:2px solid var(--color-spotify-green);outline-offset:2px;border-radius:var(--radius-sm)}@keyframes move-background{0%{background-position:0% 0%}to{background-position:100% 100%}}