@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap";:root{--bg-color: #121212;--surface-color: #1db954;--text-primary: #ffffff;--text-secondary: #b3b3b3;--button-hover: #1ed760}*{box-sizing:border-box}body{margin:0;font-family:Poppins,sans-serif;background-color:var(--bg-color);color:var(--text-primary);display:flex;flex-direction:column;min-height:100vh}.centered-container{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;text-align:center;padding:2rem}.landing-container{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;text-align:center;padding:2rem;animation:fadeIn 1.5s ease-out}.landing-title{font-size:clamp(2.5rem,8vw,4rem);font-weight:700;margin-bottom:.5rem;background:linear-gradient(90deg,#1db954,#1ed760,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:slideDown 1s ease-out}.landing-subtitle{font-size:clamp(1rem,4vw,1.5rem);color:var(--text-secondary);margin-bottom:3rem;animation:slideUp 1s ease-out .5s both}.spotify-btn{background-color:var(--surface-color);color:var(--bg-color);font-family:inherit;font-weight:700;font-size:clamp(1rem,3vw,1.2rem);padding:1rem 2.5rem;border:none;border-radius:50px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;transition:all .3s ease;animation:bounceIn 1s cubic-bezier(.175,.885,.32,1.275) 1s both;width:100%;max-width:350px}.spotify-btn:hover{background-color:var(--button-hover);transform:scale(1.05);box-shadow:0 10px 20px #1db95466}.home-container{padding:2rem 1rem;max-width:800px;margin:0 auto;width:100%;animation:fadeIn 1s ease-out}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.1);flex-wrap:wrap;gap:1rem}.user-info{display:flex;align-items:center;gap:15px}.avatar{width:50px;height:50px;border-radius:50%;object-fit:cover}.logout-btn{background:transparent;border:1px solid var(--text-secondary);color:var(--text-primary);padding:.5rem 1.5rem;border-radius:20px;cursor:pointer;transition:all .3s;font-family:inherit;font-size:.9rem}.logout-btn:hover{border-color:var(--text-primary);background:#ffffff1a}.playlist-selector-container{background:#ffffff0d;border-radius:15px;padding:2rem;margin-bottom:2rem;text-align:center}.playlist-selector-container h4{margin-top:0;font-size:1.2rem;margin-bottom:1rem}.actions-container{display:grid;grid-template-columns:1fr;gap:1.5rem}@media(min-width:600px){.actions-container{grid-template-columns:1fr 1fr}}.action-card{background:#ffffff0d;border-radius:15px;padding:2rem;text-align:center;transition:all .3s ease;border:1px solid transparent;display:flex;flex-direction:column}.action-card:hover{background:#ffffff1a;border-color:var(--surface-color);transform:translateY(-5px)}.action-title{font-size:1.5rem;font-weight:600;margin-bottom:1rem;margin-top:0}.action-desc{color:var(--text-secondary);font-size:.9rem;margin-bottom:1.5rem;line-height:1.4}.action-btn{background-color:var(--surface-color);color:var(--bg-color);border:none;padding:1rem 2rem;border-radius:25px;font-weight:600;cursor:pointer;transition:transform .2s;font-family:inherit;font-size:1rem;width:100%}.action-card:hover .action-btn:not(:disabled){transform:scale(1.05)}.action-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.styled-select{width:100%;padding:1rem;border-radius:8px;background:#ffffff1a;border:1px solid var(--text-secondary);color:#fff;font-family:inherit;font-size:1rem;outline:none;cursor:pointer;appearance:none;background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23FFFFFF%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E);background-repeat:no-repeat;background-position:right 1rem top 50%;background-size:.65rem auto}.styled-select option{background:#121212;color:#fff}.styled-input{width:100%;padding:1rem;border-radius:8px;background:#ffffff1a;border:1px solid var(--text-secondary);color:#fff;font-family:inherit;font-size:1.2rem;outline:none;text-align:center;text-transform:uppercase;letter-spacing:2px}.styled-input::placeholder{color:#ffffff4d;letter-spacing:normal;text-transform:none}.styled-input:focus,.styled-select:focus{border-color:var(--surface-color);background:#ffffff26}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}@keyframes bounceIn{0%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1.05)}70%{transform:scale(.9)}to{transform:scale(1)}}