@import"https://fonts.googleapis.com/css2?family=Shrikhand&display=swap";:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{margin:0;padding:0;box-sizing:border-box}html{height:-webkit-fill-available}body{min-height:100vh;min-height:-webkit-fill-available;margin:0;padding:0}.tilted-card{transition:transform .1s ease;transform-style:preserve-3d;border-radius:min(15px,3vw);width:100%;max-width:min(400px,80vw);aspect-ratio:1;margin:0 auto;perspective:1000px;transform:perspective(1000px) rotateX(0) rotateY(0);will-change:transform}.tilted-card img{width:100%;height:100%;object-fit:cover;border-radius:min(15px,3vw);-webkit-user-select:none;user-select:none;-webkit-user-drag:none;pointer-events:none}@media (max-height: 700px){.tilted-card{max-width:min(300px,70vw)}}@media (max-height: 500px){.tilted-card{max-width:min(250px,60vw)}}:root{--primary-bg: #000000;--button-color: #ffffff;--button-hover: #f0f0f0}html,body{margin:0;padding:0;height:100%}body{background-color:var(--primary-bg);font-family:Shrikhand,serif;overflow-x:hidden;position:fixed;width:100%}#root{height:100%;width:100%;display:flex;align-items:center;justify-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.app-container{width:100%;max-width:min(800px,95vw);height:min(100%,100vh);margin:0 auto;padding:min(2rem,5vh) min(1rem,2.5vw);display:flex;flex-direction:column;justify-content:center;gap:min(3rem,5vh);overflow-y:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.app-container::-webkit-scrollbar{display:none}.album-container{width:100%;padding:min(.5rem,1.5vh);display:flex;justify-content:center;align-items:center;flex-shrink:0}.streaming-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:min(2rem,4vh);padding:min(1.5rem,3vh) min(.5rem,1.5vw);width:100%;max-width:min(500px,90vw);margin:0 auto}.buttons-row{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:min(3rem,5vw);width:100%;padding:0 min(1rem,2vw)}.music-button{display:block;width:100%;padding:min(1rem,2vh) min(1.5rem,3vw);background-color:var(--button-color);color:var(--primary-bg);border:2px solid var(--button-color);border-radius:50px;text-decoration:none;text-align:center;font-size:clamp(1.1rem,3vw,1.3rem);transition:all .3s ease;text-transform:lowercase;-webkit-tap-highlight-color:transparent}.music-button:hover{background-color:transparent;color:var(--button-color);transform:scale(1.02)}.music-icon-link{display:flex;align-items:center;justify-content:center;width:min(56px,10vw);height:min(56px,10vw);padding:min(.5rem,1vw);border-radius:50%;background-color:transparent;transition:all .3s ease;-webkit-tap-highlight-color:transparent}.music-icon{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1);transition:transform .3s ease}.music-icon-link:hover{transform:scale(1.1)}.music-icon-link:hover .music-icon{filter:brightness(0) invert(.9)}@media (min-width: 768px){.app-container{gap:min(3rem,5vh);padding:min(2rem,4vh)}.streaming-container{gap:min(2rem,4vh);max-width:min(500px,90vw)}.buttons-row{gap:min(3rem,5vw)}.music-icon-link{width:min(56px,10vw);height:min(56px,10vw)}}@media (max-height: 700px){.app-container,.streaming-container{gap:min(1.5rem,3vh)}}@media (max-height: 500px){.app-container{padding:min(.5rem,1vh)}.streaming-container{gap:min(1rem,2vh)}.buttons-row{gap:min(2rem,4vw)}}@media (max-width: 480px){.streaming-container{gap:min(1.5rem,3vh);padding:min(1.5rem,3vh) min(.5rem,1.5vw);max-width:100%}.buttons-row{gap:min(2rem,4vw);padding:0 min(.5rem,1vw)}.music-button{font-size:clamp(1.2rem,4vw,1.4rem);padding:min(1.2rem,2.5vh) min(1.8rem,3.5vw)}.music-icon-link{width:min(44px,15vw);height:min(44px,15vw)}}@media (max-width: 360px){.streaming-container{gap:min(1rem,2vh)}.buttons-row{gap:min(1.5rem,3vw)}.music-icon-link{width:min(40px,16vw);height:min(40px,16vw)}}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}
