:root{--spotify-green:#1db954;--accent-blue:#00a8ff;--primary-blue:#1e3a8a;--dark-blue:#1e40af;--glow-blue:#00a8ff66}html{font-size:16px}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0a1e3f;color:#f0f0f0;font-family:Poppins,Arial,sans-serif;line-height:1.6;min-height:100vh;overflow-x:hidden;padding-top:82px}:root{--spotifight-green-start:#1db954;--spotifight-green-end:#00d4aa;--spotifight-orange-start:#ff6b35;--spotifight-orange-mid:#f7931e;--spotifight-orange-end:#ffd23f;--primary-color:var(--spotifight-green-start);--secondary-color:var(--spotifight-orange-start);--accent-color:var(--spotifight-green-end);--highlight-color:var(--spotifight-orange-end);--primary-blue:#0a1e3f;--dark-blue:#050d1f;--background-gradient-start:#0a1e3f;--background-gradient-mid:#1a2a4f;--background-gradient-end:#121212;--light-gray:#f0f0f0;--text-muted:#b3b3b3;--text-primary:#fff;--border-color:#1db9544d;--border-color-orange:#ff6b354d;--card-bg:#10223fcc;--card-bg-hover:#1db9541a;--glow-green:#1db95466;--glow-turquoise:#00d4aa66;--glow-orange:#ff6b3566;--glow-yellow:#ffd23f66;--spotify-green:var(--primary-color);--accent-blue:var(--accent-color);--purple:var(--secondary-color);--gradient-spotifight-primary:linear-gradient(135deg,var(--spotifight-green-start),var(--spotifight-green-end));--gradient-spotifight-secondary:linear-gradient(135deg,var(--spotifight-orange-start),var(--spotifight-orange-mid),var(--spotifight-orange-end));--gradient-spotifight-mixed:linear-gradient(135deg,var(--spotifight-green-start),var(--spotifight-orange-start));--gradient-background:linear-gradient(135deg,var(--background-gradient-start) 0%,var(--background-gradient-mid) 50%,var(--background-gradient-end) 100%)}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}button,input,select,textarea{font-family:Poppins,sans-serif}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#050d1f;background:var(--dark-blue)}::-webkit-scrollbar-thumb{background:#1db954;background:var(--spotify-green);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#1ed760}.container{margin:0 auto;max-width:1200px;padding:0 20px;width:100%}.text-center{text-align:center}.flex{display:flex}.flex-center{justify-content:center}.flex-between,.flex-center{align-items:center;display:flex}.flex-between{justify-content:space-between}.grid{display:grid}@keyframes slideIn{0%{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}@keyframes pulse{0%{box-shadow:0 0 0 0 #1db95466;box-shadow:0 0 0 0 var(--glow-green)}70%{box-shadow:0 0 0 10px #1db95400}to{box-shadow:0 0 0 0 #1db95400}}:focus{outline:2px solid var(--spotify-green)}a{color:#1db954;color:var(--spotify-green);text-decoration:none;transition:color .3s ease}a:hover{color:#1ed760}@media (max-width:768px){body,html{font-size:14px}body{padding-top:74px}.container{padding:0 15px}button{font-size:1rem;min-height:44px}input,select,textarea{font-size:16px;min-height:44px}.mobile-spacing{padding:1rem .5rem}.responsive-grid{gap:1rem!important;grid-template-columns:1fr!important}.mobile-nav-item{font-size:1.1rem;padding:1rem;text-align:center}.mobile-card{border-radius:12px;margin-bottom:1rem}h1{font-size:2rem!important}h2{font-size:1.5rem!important}h3{font-size:1.2rem!important}.touch-target{min-height:44px;min-width:44px;padding:12px}}@media (max-width:480px){body,html{font-size:13px}.container{padding:0 10px}button{min-height:48px;padding:12px 16px}input,select,textarea{min-height:48px;padding:12px}.small-mobile-spacing{padding:.5rem .25rem}h1{font-size:1.8rem!important}h2{font-size:1.3rem!important}h3{font-size:1.1rem!important}.stack-mobile{flex-direction:column!important;gap:1rem!important}.full-width-mobile{max-width:100%!important;width:100%!important}}@media (max-width:768px) and (orientation:landscape){body{font-size:12px}.landscape-compact{padding:.5rem!important}}@media (min-width:1400px){.container{max-width:1400px}}.btn{border:none;border-radius:25px;cursor:pointer;display:inline-block;font-size:16px;font-weight:600;padding:12px 24px;text-align:center;text-decoration:none;transition:all .3s ease}.btn-primary{background:#1db954;color:#fff}.btn-primary:hover{background:#1ed760;transform:translateY(-2px)}.btn-secondary{background:#0000;border:2px solid #fff;color:#fff}.btn-secondary:hover{background:#fff;color:#191414}.card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:12px;padding:24px;transition:transform .3s ease}.card:hover{transform:translateY(-4px)}.input{background:#ffffff1a;border:1px solid #ffffff4d;border-radius:8px;color:#fff;font-size:16px;padding:12px 16px;transition:border-color .3s ease;width:100%}.input:focus{border-color:#1db954;box-shadow:0 0 0 2px #1db95433;outline:none}.input::placeholder{color:#fff9}.text-green{color:#1db954;color:var(--spotify-green)}.text-muted{color:#b3b3b3;color:var(--text-muted)}.bg-card{background:#10223fcc;background:var(--card-bg)}.border-green{border:1px solid #1db9544d;border:1px solid var(--border-color)}.shadow-green{box-shadow:0 4px 15px #1db95466;box-shadow:0 4px 15px var(--glow-green)}.fade-in{animation:fadeIn .6s ease-out}.slide-in{animation:slideIn .5s ease-out}@keyframes react-loading-skeleton{to{transform:translateX(100%)}}.react-loading-skeleton{--base-color:#ebebeb;--highlight-color:#f5f5f5;--animation-duration:1.5s;--animation-direction:normal;--pseudo-element-display:block;background-color:var(--base-color);border-radius:.25rem;display:inline-flex;line-height:1;overflow:hidden;position:relative;-webkit-user-select:none;user-select:none;width:100%}.react-loading-skeleton:after{animation-direction:var(--animation-direction);animation-duration:var(--animation-duration);animation-iteration-count:infinite;animation-name:react-loading-skeleton;animation-timing-function:ease-in-out;background-image:linear-gradient(90deg,var(--base-color) 0,var(--highlight-color) 50%,var(--base-color) 100%);background-image:var(
    --custom-highlight-background,linear-gradient(90deg,var(--base-color) 0,var(--highlight-color) 50%,var(--base-color) 100%)
  );background-repeat:no-repeat;content:" ";display:var(--pseudo-element-display);height:100%;left:0;position:absolute;right:0;top:0;transform:translateX(-100%)}@media (prefers-reduced-motion){.react-loading-skeleton{--pseudo-element-display:none}}*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;margin:0;padding:0}:root{--primary-color:#1db954;--primary-dark:#1aa34a;--primary-light:#3ecb6a;--secondary-color:#ff6b35;--dark-bg:#121212;--dark-bg-lighter:#181818;--dark-bg-lighter-2:#282828;--text-color:#f0f0f0;--text-secondary:#b3b3b3;--border-color:#ffffff1a;--transition-speed:0.3s;--border-radius:8px;--shadow-light:0 2px 10px #0000001a;--shadow-medium:0 4px 20px #00000026;--shadow-strong:0 8px 30px #0003}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}:focus{outline:2px solid #1db954;outline:2px solid var(--primary-color);outline-offset:2px}:focus:not(:focus-visible){outline:none}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#121212;background:var(--dark-bg)}::-webkit-scrollbar-thumb{background:#fff3;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.lazy-load-image-background{display:block!important}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn .3s ease forwards}.reduced-motion *{animation-delay:0s!important;animation-duration:.01s!important;scroll-behavior:auto!important;transition-duration:.01s!important}.optimized-image{height:auto;max-width:100%;object-fit:cover}