@import"https://fonts.googleapis.com/css2?family=Kalam:wght@300;400;700&family=Comic+Neue:wght@300;400;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{--spotify-green: #1DB954;--spotify-green-hover: #1ed760;--spotify-green-dark: #1aa34a;--spotify-black: #191414;--color-bg: #ffffff;--color-bg-alt: #fafafa;--color-text: #191414;--color-text-light: #666666;--color-border: #191414;--color-border-light: rgba(25, 20, 20, .2);--color-error: #ff6b6b;--shadow-handdrawn: 4px 4px 0px rgba(25, 20, 20, .1);--shadow-handdrawn-hover: 6px 6px 0px rgba(25, 20, 20, .15);--radius-handdrawn: 20px;--radius-big: 30px;--radius-full: 9999px;--transition-bounce: all .3s cubic-bezier(.68, -.55, .265, 1.55)}[data-theme=dark]{--color-bg: #1a1a1a;--color-bg-alt: #242424;--color-text: #ffffff;--color-text-light: #b3b3b3;--color-border: #ffffff;--color-border-light: rgba(255, 255, 255, .2);--color-error: #ff6b6b;--shadow-handdrawn: 4px 4px 0px rgba(0, 0, 0, .3);--shadow-handdrawn-hover: 6px 6px 0px rgba(0, 0, 0, .4)}[data-theme=dark] body{background:var(--color-bg)}[data-theme=dark] body:before,[data-theme=dark] body:after{color:#1db9540d}body{font-family:Kalam,Comic Neue,cursive,sans-serif;background:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:relative}body:before{content:"♪";position:fixed;font-size:120px;color:#1db95408;top:10%;right:5%;transform:rotate(15deg);z-index:0;pointer-events:none}body:after{content:"♫";position:fixed;font-size:100px;color:#1db95408;bottom:15%;left:5%;transform:rotate(-20deg);z-index:0;pointer-events:none}.container{max-width:500px;margin:0 auto;padding:2rem 1.25rem;min-height:100vh;display:flex;flex-direction:column;position:relative;z-index:1}.hero{text-align:center;margin-bottom:2rem;padding-top:.5rem;display:flex;flex-direction:column;align-items:center}.logo-container{margin-bottom:1.25rem;animation:float 3s ease-in-out infinite;display:flex;justify-content:center;align-items:center;position:relative;width:100%}@keyframes float{0%,to{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(2deg)}}.logo{width:100px;height:100px;object-fit:contain;filter:drop-shadow(3px 3px 0px rgba(29,185,84,.2));transition:var(--transition-bounce);display:block;margin:0 auto}.logo:hover{transform:scale(1.08) rotate(5deg);filter:drop-shadow(4px 4px 0px rgba(29,185,84,.3))}.headline{font-size:clamp(2rem,6vw,2.5rem);font-weight:700;margin-bottom:.5rem;letter-spacing:-.01em;line-height:1.2;color:var(--spotify-black);text-shadow:2px 2px 0px rgba(29,185,84,.2);position:relative;display:inline-block}.headline:after{content:"";position:absolute;bottom:-5px;left:0;right:0;height:3px;background:var(--spotify-green);border-radius:2px;transform:rotate(-1deg)}.subtitle{font-size:clamp(1rem,3vw,1.15rem);color:var(--color-text-light);max-width:400px;margin:.75rem auto 0;font-weight:400}.main-content{flex:1;display:flex;flex-direction:column;gap:1.5rem}.input-section{width:100%}.input-wrapper{display:flex;flex-direction:column;gap:1rem;margin-bottom:.75rem}.url-input{width:100%;padding:1.1rem 1.4rem;font-size:1rem;border:3px solid var(--color-border);border-radius:var(--radius-handdrawn);background:#fff;color:var(--color-text);transition:var(--transition-bounce);font-family:inherit;outline:none;box-shadow:var(--shadow-handdrawn);transform:rotate(-.5deg);font-weight:400}.url-input:focus{border-color:var(--spotify-green);box-shadow:var(--shadow-handdrawn-hover);transform:rotate(0) scale(1.02);border-width:4px}.url-input:disabled{opacity:.6;cursor:not-allowed}.url-input::placeholder{color:var(--color-text-light);opacity:.6}.download-btn{padding:1.1rem 2rem;font-size:1.05rem;font-weight:700;color:#fff;background:var(--spotify-green);border:3px solid var(--color-border);border-radius:var(--radius-handdrawn);cursor:pointer;transition:var(--transition-bounce);font-family:inherit;position:relative;overflow:visible;box-shadow:var(--shadow-handdrawn);letter-spacing:.01em;transform:rotate(.5deg)}.download-btn:hover:not(:disabled){background:var(--spotify-green-hover);transform:rotate(-1deg) translateY(-3px) scale(1.05);box-shadow:var(--shadow-handdrawn-hover);border-width:4px}.download-btn:active:not(:disabled){transform:rotate(0) translateY(-1px) scale(1.02)}.download-btn:disabled{opacity:.6;cursor:not-allowed;transform:rotate(0)}.btn-text{display:inline-block;position:relative;z-index:1}.btn-loader{display:none;width:22px;height:22px;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2}.btn-loader:not(.hidden){display:block}.btn-loader.hidden{display:none}.download-btn:disabled .btn-text{opacity:0}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}.input-hint{text-align:center;font-size:.85rem;color:var(--color-text-light);font-weight:400;position:relative}.input-hint:before{content:"♪";margin-right:.5rem;color:var(--spotify-green)}.result-section{width:100%;animation:bounceIn .5s cubic-bezier(.68,-.55,.265,1.55)}@keyframes bounceIn{0%{opacity:0;transform:scale(.8) rotate(-2deg)}50%{transform:scale(1.05) rotate(1deg)}to{opacity:1;transform:scale(1) rotate(0)}}.result-card{background:#fff;border:3px solid var(--color-border);border-radius:var(--radius-big);padding:1.75rem;display:flex;flex-direction:column;align-items:center;gap:1.5rem;box-shadow:var(--shadow-handdrawn);transition:var(--transition-bounce);position:relative;transform:rotate(-.5deg)}.result-card:hover{box-shadow:var(--shadow-handdrawn-hover);transform:rotate(0) translateY(-4px);border-width:4px}.track-cover-container{width:180px;height:180px;border-radius:var(--radius-handdrawn);overflow:hidden;box-shadow:var(--shadow-handdrawn);animation:wiggle .6s ease-out;border:3px solid var(--color-border);transform:rotate(-3deg);transition:var(--transition-bounce);position:relative}.track-cover-container:before{content:"♪";position:absolute;top:-10px;right:-10px;font-size:24px;color:var(--spotify-green);z-index:2;animation:float 2s ease-in-out infinite}@keyframes wiggle{0%,to{transform:rotate(-3deg)}25%{transform:rotate(3deg)}50%{transform:rotate(-2deg)}75%{transform:rotate(2deg)}}.track-cover-container:hover{transform:rotate(0) scale(1.05);box-shadow:var(--shadow-handdrawn-hover)}.track-cover{width:100%;height:100%;object-fit:cover}.track-info{text-align:center;width:100%}.track-title{font-size:1.5rem;font-weight:700;margin-bottom:.5rem;line-height:1.3;color:var(--spotify-black);text-shadow:1px 1px 0px rgba(29,185,84,.1)}.track-artist{font-size:1.05rem;color:var(--color-text-light);margin-bottom:1rem;font-weight:400}.quality-badge{display:inline-block;padding:.5rem 1rem;background:#1db9541a;color:var(--spotify-green-dark);border-radius:var(--radius-full);font-size:.8rem;font-weight:600;margin-bottom:1rem;border:2px solid var(--spotify-green);transform:rotate(-1deg);box-shadow:2px 2px #1914141a}.quality-badge:hover{transform:rotate(0) scale(1.05)}.download-file-btn{padding:.9rem 1.75rem;font-size:.95rem;font-weight:700;color:#fff;background:var(--spotify-green);border:3px solid var(--color-border);border-radius:var(--radius-handdrawn);cursor:pointer;transition:var(--transition-bounce);font-family:inherit;box-shadow:var(--shadow-handdrawn);width:100%;max-width:280px;letter-spacing:.01em;transform:rotate(.5deg)}.download-file-btn:hover:not(:disabled){background:var(--spotify-green-hover);transform:rotate(-1deg) translateY(-3px) scale(1.05);box-shadow:var(--shadow-handdrawn-hover);border-width:4px}.download-file-btn:active:not(:disabled){transform:rotate(0) translateY(-1px) scale(1.02)}.download-file-btn:disabled{opacity:.6;cursor:not-allowed;transform:rotate(0)}.support-widget-container{padding:2rem 1.5rem;background:var(--color-bg);border-radius:var(--radius-handdrawn);border:3px solid var(--color-border);text-align:center;animation:fadeIn .5s ease-in;width:100%;max-width:100%;box-shadow:var(--shadow-handdrawn);transform:rotate(.5deg);position:relative}.support-message{font-size:.95rem;color:var(--spotify-green-dark);margin-bottom:1rem;font-weight:600;font-family:Kalam,cursive}.kofi-widget-result{display:flex;justify-content:center;align-items:center}.kofi-badge-link{display:inline-block;transition:var(--transition-bounce);transform:rotate(.5deg)}.kofi-badge-link:hover{transform:rotate(-.5deg) translateY(-2px) scale(1.05)}.kofi-badge-link:active{transform:rotate(0) translateY(0) scale(1)}.kofi-badge-image{max-width:100%;height:auto;display:block;border-radius:var(--radius-handdrawn);box-shadow:var(--shadow-handdrawn);transition:var(--transition-bounce)}.kofi-badge-link:hover .kofi-badge-image{box-shadow:var(--shadow-handdrawn-hover)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.try-again-btn{margin-top:.75rem;padding:.75rem 1.5rem;font-size:.9rem;font-weight:600;color:var(--color-text);background:#fff;border:3px solid var(--color-border);border-radius:var(--radius-handdrawn);cursor:pointer;transition:var(--transition-bounce);font-family:inherit;width:100%;max-width:280px;margin-left:auto;margin-right:auto;display:block;box-shadow:var(--shadow-handdrawn);transform:rotate(.5deg)}.try-again-btn:hover{border-color:var(--spotify-green);color:var(--spotify-green-dark);transform:rotate(-1deg) translateY(-2px);background:#1db9540d;border-width:4px;box-shadow:var(--shadow-handdrawn-hover)}.error-section{width:100%;animation:shake .5s ease-out}@keyframes shake{0%,to{transform:translate(0) rotate(0)}10%,30%,50%,70%,90%{transform:translate(-8px) rotate(-1deg)}20%,40%,60%,80%{transform:translate(8px) rotate(1deg)}}.error-card{background:#fff;border:3px solid var(--color-error);border-radius:var(--radius-big);padding:1.75rem;text-align:center;box-shadow:var(--shadow-handdrawn);position:relative;transform:rotate(-.5deg)}.error-icon{font-size:3rem;margin-bottom:.75rem;animation:bounce 1.2s ease-in-out infinite;display:inline-block}@keyframes bounce{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(5deg)}}.error-title{font-size:1.4rem;font-weight:700;margin-bottom:.5rem;color:var(--color-error)}.error-message{color:var(--color-text-light);margin-bottom:1.25rem;line-height:1.6;font-size:.95rem}.disclaimer-text h3{font-size:clamp(1.2rem,3vw,1.5rem);color:var(--color-text);margin:1.5rem 0 1rem;font-weight:600}.disclaimer-text ol{margin-left:1.5rem;margin-bottom:1rem}.disclaimer-text li{font-size:clamp(.95rem,2.5vw,1.1rem);color:var(--color-text);line-height:1.7;margin-bottom:.5rem}.disclaimer-text strong{color:var(--spotify-green);font-weight:700}.footer{margin-top:2rem;padding-top:1.5rem;border-top:2px dashed var(--color-border-light);position:relative}.footer:before{content:"♫";position:absolute;top:-15px;left:50%;transform:translate(-50%) rotate(-15deg);font-size:24px;color:var(--spotify-green);background:var(--color-bg);padding:0 .5rem}.footer-content{text-align:center}.disclaimer{margin-bottom:0}.disclaimer p{font-size:.85rem;color:var(--color-text-light);line-height:1.6;font-weight:400}.support-note{font-size:.75rem;color:var(--color-text-light);margin-top:.5rem;opacity:.8}.footer-links{margin-top:1rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.footer-links a.footer-link-text,.footer-link-text,a.footer-link-text{font-size:.8rem;color:var(--spotify-green)!important;text-decoration:none!important;transition:var(--transition-bounce)}.footer-links a.footer-link-text:hover,.footer-link-text:hover,a.footer-link-text:hover{color:var(--spotify-green-hover)!important;text-decoration:underline!important}.footer-links a.footer-link-text:visited,.footer-link-text:visited,a.footer-link-text:visited{color:var(--spotify-green)!important}.footer-links a.footer-link-text:active,.footer-link-text:active,a.footer-link-text:active{color:var(--spotify-green-dark)!important}.footer-links a.footer-link-text:link,.footer-link-text:link,a.footer-link-text:link{color:var(--spotify-green)!important}.footer-link-separator{font-size:.8rem;color:var(--color-text-light);opacity:.5}.disclaimer-link{margin-top:1rem}.disclaimer-link-text{font-size:.8rem;color:var(--spotify-green);text-decoration:none;font-weight:600;border-bottom:2px dashed var(--spotify-green);transition:var(--transition-bounce);display:inline-block;transform:rotate(.5deg)}.disclaimer-link-text:hover{color:var(--spotify-green-hover);border-bottom-color:var(--spotify-green-hover);transform:rotate(-.5deg) scale(1.05);border-bottom-width:3px}.disclaimer-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:2000;display:flex;align-items:center;justify-content:center;padding:1rem}.disclaimer-modal-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn .3s ease}.disclaimer-modal-content{position:relative;background:var(--color-bg);border:3px solid var(--color-border);border-radius:var(--radius-big);padding:2rem;max-width:600px;max-height:80vh;overflow-y:auto;box-shadow:var(--shadow-handdrawn);transform:rotate(-1deg);animation:bounceIn .5s cubic-bezier(.68,-.55,.265,1.55);z-index:2001}.disclaimer-modal-content:hover{transform:rotate(0)}.disclaimer-close{position:absolute;top:1rem;right:1rem;width:35px;height:35px;border-radius:var(--radius-full);border:2px solid var(--color-border);background:var(--color-bg);color:var(--color-text);font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition-bounce);transform:rotate(5deg);font-weight:700}.disclaimer-close:hover{transform:rotate(-5deg) scale(1.1);background:var(--color-error);color:#fff;border-color:var(--color-error)}.disclaimer-title{font-size:1.5rem;font-weight:700;color:var(--spotify-green);margin-bottom:1.5rem;text-align:center;font-family:Kalam,cursive}.disclaimer-text{font-size:.9rem;line-height:1.8;color:var(--color-text)}.disclaimer-text p{margin-bottom:1rem}.disclaimer-text p:last-child{margin-bottom:0}[data-theme=dark] .disclaimer-modal-content{background:var(--color-bg-alt);border-color:var(--color-border)}[data-theme=dark] .disclaimer-close{background:var(--color-bg-alt);color:var(--color-text);border-color:var(--color-border)}[data-theme=dark] .disclaimer-modal-overlay{background:#000000d9}@media (max-width: 640px){.disclaimer-modal-content{padding:1.5rem;max-width:95%;transform:rotate(0)}.disclaimer-title{font-size:1.2rem}.disclaimer-text{font-size:.85rem}}.kofi-widget-container{margin-top:1rem;display:flex;justify-content:center;align-items:center}.hidden{display:none!important}@media (min-width: 640px){.container{padding:2.5rem 2rem}.input-wrapper{flex-direction:row}.url-input{flex:1}.download-btn{flex-shrink:0;min-width:150px}.result-card{flex-direction:row;text-align:left;padding:2rem}.track-info{text-align:left}.track-cover-container{width:160px;height:160px;flex-shrink:0}.try-again-btn{width:auto;margin-left:0;margin-right:0}}@media (min-width: 768px){.hero{padding-top:1rem}.logo{width:140px;height:140px}.result-card{padding:2.25rem}.track-cover-container{width:200px;height:200px}}.theme-toggle{position:fixed;top:1.5rem;right:1.5rem;width:50px;height:50px;border-radius:var(--radius-full);border:3px solid var(--color-border);background:var(--color-bg);color:var(--color-text);font-size:1.5rem;cursor:pointer;box-shadow:var(--shadow-handdrawn);transition:var(--transition-bounce);z-index:1000;display:flex;align-items:center;justify-content:center;transform:rotate(5deg);font-family:Kalam,cursive}.theme-toggle:hover{transform:rotate(-5deg) scale(1.1);box-shadow:var(--shadow-handdrawn-hover);border-width:4px}.theme-toggle:active{transform:rotate(0) scale(.95)}.theme-icon{display:inline-block;transition:transform .3s ease;animation:float 3s ease-in-out infinite}[data-theme=dark] .theme-icon{transform:rotate(180deg)}[data-theme=dark] .result-card,[data-theme=dark] .error-card,[data-theme=dark] .support-widget-container{background:var(--color-bg-alt);border-color:var(--color-border)}[data-theme=dark] .download-btn,[data-theme=dark] .download-file-btn,[data-theme=dark] .try-again-btn{background:var(--spotify-green);color:#fff;border-color:var(--color-border)}[data-theme=dark] .url-input{background:var(--color-bg-alt);color:var(--color-text);border-color:var(--color-border)}[data-theme=dark] .url-input::placeholder{color:var(--color-text-light)}[data-theme=dark] .footer{border-top-color:var(--color-border-light)}[data-theme=dark] .footer:before{background:var(--color-bg);color:var(--spotify-green)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
