.button{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#ff6b9d;border-radius:100px;border:none;color:#fff;cursor:pointer;display:flex;font-size:1rem;justify-content:center;min-height:calc(1.5rem + 24px);padding:12px 40px;-webkit-user-select:none;user-select:none;font-weight:500}.button[disabled]{cursor:default;opacity:.65}.button:focus{outline:2px solid #FF6B9D;outline-offset:2px}.button:not([disabled]):hover{opacity:.9}.brand-connection{display:flex;align-items:center;justify-content:center;gap:20px;padding:0;max-width:600px;margin:0 auto}.brand-logo{width:80px;height:80px;flex-shrink:0;animation:pulse 2s ease-in-out infinite;border-radius:16px;overflow:hidden}.brand-logo img{width:100%;height:100%;object-fit:cover}.beatb-logo{filter:drop-shadow(0 0 20px rgba(255,107,157,.6))}.spotify-logo{filter:drop-shadow(0 0 20px rgba(29,185,84,.6))}.connection-bridge{flex:1;height:60px;position:relative;filter:drop-shadow(0 0 8px rgba(255,107,157,.5)) drop-shadow(0 0 16px rgba(29,185,84,.3))}.bridge-path{stroke-dasharray:400;stroke-dashoffset:400;animation:drawBridge 2s ease-in-out forwards}.flow-dot{opacity:0;animation:fadeInDot .5s ease-in forwards;filter:drop-shadow(0 0 4px currentColor)}.flow-dot-1{animation-delay:2s}.flow-dot-2{animation-delay:3s}.flow-dot-3{animation-delay:4s}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}@keyframes drawBridge{to{stroke-dashoffset:0}}@keyframes fadeInDot{to{opacity:1}}@media (max-width: 480px){.brand-connection{gap:10px;padding:30px 10px}.brand-logo{width:60px;height:60px}.connection-bridge{height:50px}}@media (prefers-reduced-motion: reduce){.brand-logo,.bridge-path,.flow-dot{animation:none}.bridge-path{stroke-dashoffset:0}.flow-dot{opacity:.6}}.authorize-section{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 20px 120px;min-height:100vh;overflow-y:auto}.authorize-section .brand-connection{margin-bottom:32px}.authorize-title{font-size:1.75rem;font-weight:700;text-align:center;color:#fff;margin:0 0 16px}.authorize-description{max-width:500px;text-align:center;font-size:.95rem;line-height:1.6;color:#fffc;margin:0 0 32px;padding:0 20px}.theme-dark{background-color:#000;color:#fff}.theme-dark .authorize-title{color:#fff}.theme-dark .authorize-description{color:#fffc}.theme-light{background-color:#fff;color:#000}.theme-light .authorize-title{color:#000}.theme-light .authorize-description{color:#000000b3}@media (max-width: 480px){.authorize-section{padding-top:100px;padding-left:16px;padding-right:16px}.authorize-title{font-size:1.5rem}.authorize-description{font-size:.9rem}}.heart{stroke-width:4px;margin:auto;max-width:100%;padding:10%;z-index:-1;filter:drop-shadow(0 0 4px #fff) drop-shadow(0 0 11px #fff) drop-shadow(0 0 19px #fff) drop-shadow(0 0 40px currentColor) drop-shadow(0 0 70px currentColor) drop-shadow(0 0 90px currentColor)}@media (prefers-reduced-motion: no-preference){.heart{animation:pulsate .7s infinite alternate;animation-timing-function:steps(7,jump-both)}}@keyframes pulsate{0%{opacity:.87}20%{opacity:.9}to{opacity:1}}.or{width:100%;position:relative;text-align:center;color:color-mix(in srgb,currentColor 50%,transparent);padding:16px 0;-webkit-user-select:none;user-select:none}.or:before{content:"";width:calc(50% - 2ch);height:1px;background:currentColor;display:block;position:absolute;top:50%}.or:after{content:"";width:calc(50% - 2ch);height:1px;background:currentColor;display:block;position:absolute;top:50%;right:0}.playlist-select button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;font-size:1rem;cursor:pointer;background-color:transparent;color:currentColor;padding:0;display:flex;align-items:center;justify-content:center}.playlist-select button[disabled]{cursor:default;opacity:.65}.playlist-select button:focus{outline:none}.playlist-select button:not([disabled]):hover{scale:1.05}.playlist-select .react-select__dropdown-indicator{display:none}.playlist-select .react-select-container{position:relative;flex:1}.playlist-select .react-select-container .react-select__control{min-height:unset;gap:1ch;cursor:text}.playlist-select .react-select-container .react-select__control .selected-value{display:flex;flex-direction:column}.playlist-select .react-select-container .react-select__control .selected-value .id{font-size:.9em;color:color-mix(in srgb,currentColor 40%,transparent);text-overflow:ellipsis;overflow:hidden}.playlist-select .react-select-container .react-select__control .react-select__input-container{height:1.9lh;grid-template-columns:max-content}.playlist-select .react-select-container .react-select__control .react-select__input-container input{z-index:9999}.playlist-select .help{padding-top:.5lh;font-size:.9em;color:color-mix(in srgb,currentColor 40%,transparent)}.form{color:#ffffff8f}.form:has(.react-select--is-disabled){cursor:default;opacity:.65}.form:has(:focus),.form:has(.react-select__single-value){color:#fff}.form label.label{-webkit-user-select:none;user-select:none;margin-bottom:.5lh;display:block}.form .input{display:flex;flex-direction:row;gap:1ch;align-items:center;background-color:#121212;padding:8px 16px;border-radius:100px;border:2px solid transparent}.form .input:has(:focus),.form .input:has(.react-select__single-value){border:2px solid #f6f6f6}.form .input:has(:focus){outline:2px solid #f6f6f6;outline-offset:2px}footer{margin:8px auto;font-size:.9em;color:color-mix(in srgb,currentColor 50%,transparent)}.loader-wrapper{display:flex}.generate-playlist{display:flex;flex-direction:column}.view-playlist{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;padding:24px;border-radius:12px}.view-playlist .cover{margin:5%;width:95%;aspect-ratio:1 / 1}.view-playlist .cover img{display:block;width:100%;border-radius:8px;transition:scale .2s,opacity .25s}.view-playlist .cover img:hover{scale:1.05}.view-playlist a{text-decoration:none}.view-playlist a:hover{text-decoration:underline;text-underline-offset:.2lh}*{box-sizing:border-box;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif}html{overscroll-behavior:none;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{margin:0;padding:0;width:100%;height:100%;color:#fff;background-color:#000}body{min-height:100vh}main{background-color:#000}html.theme-light,body.theme-light{color:#000;background-color:#fff}main.theme-light{background-color:#fff}::-webkit-scrollbar{width:2px;height:2px}::-webkit-scrollbar-thumb{border-radius:9999px;background:currentColor}[hidden]{opacity:0;pointer-events:none;-webkit-user-select:none;user-select:none}.icon{vertical-align:bottom}ol.toaster{margin-bottom:var(--offset)}body{margin:0;height:100svh;width:100svw;display:flex;flex-direction:column}main{align-items:center;display:flex;justify-content:center;flex-direction:column;gap:8px;padding:0 calc((100vw - min(100%,400px))/2);height:100%;overflow:auto}main:has(article){padding:0 calc((100vw - min(100%,800px))/2)}p{margin-inline-start:2em}section.section{width:100%;padding:8px;display:flex;flex-direction:column}h1,h2,h3,h4,h5,h6{margin:0}h1,h2{font-weight:700}h3,h4,h5,h6{font-weight:500}article{min-height:100%;width:100%;padding:8px}a{color:currentColor;cursor:pointer;transition-duration:.2s}a:hover,a:focus-visible{outline:none;color:#ff6b9d;transition-duration:.2s}details summary:focus-visible{outline:2px solid #FF6B9D;outline-offset:4px;border-radius:.3rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loader{animation:spin 1s linear infinite;margin:auto}