:root{--font-main:"Outfit", sans-serif;--bg-color:#0b0f19;--text-primary:#fff;--text-secondary:#94a3b8;--accent-primary:#8b5cf6;--accent-secondary:#3b82f6;--glass-bg:#ffffff0d;--glass-border:#ffffff1a;--glass-shadow:0 8px 32px 0 #0000005e;--danger:#ef4444;--success:#10b981}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-color);color:var(--text-primary);min-height:100vh;position:relative;overflow-x:hidden}.bg-orb{filter:blur(100px);z-index:-1;opacity:.6;border-radius:50%;animation:20s ease-in-out infinite alternate float;position:fixed}.orb-1{background:var(--accent-primary);width:400px;height:400px;top:-100px;left:-100px}.orb-2{background:var(--accent-secondary);width:500px;height:500px;animation-delay:-5s;bottom:-200px;right:-100px}.orb-3{opacity:.3;background:#ec4899;width:300px;height:300px;animation-delay:-10s;top:40%;left:40%}@keyframes float{0%{transform:translate(0)}to{transform:translate(50px,50px)}}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:1.5rem}.btn{font-family:var(--font-main);cursor:pointer;border:none;border-radius:.75rem;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;transition:all .3s}.btn-primary{background:linear-gradient(135deg, var(--accent-primary) 0%, var(--accent-secondary) 100%);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 15px #8b5cf666}.btn-secondary{color:#fff;border:1px solid var(--glass-border);background:#ffffff1a}.btn-secondary:hover{background:#ffffff26}.btn-sm{border-radius:.5rem;padding:.5rem 1rem;font-size:.875rem}input{font-family:var(--font-main);border:1px solid var(--glass-border);color:#fff;background:#0003;border-radius:.75rem;outline:none;width:100%;padding:.75rem 1rem;font-size:1rem;transition:all .3s}input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px #8b5cf633}input::placeholder{color:var(--text-secondary)}#app{flex-direction:column;max-width:1200px;min-height:100vh;margin:0 auto;padding:2rem;display:flex}@media (width<=640px){#app{padding:1rem}}.login-view{flex:1;justify-content:center;align-items:center;display:flex}.login-card{text-align:center;width:100%;max-width:400px;padding:2.5rem}.login-card h1{background:linear-gradient(135deg,#fff 0%,#a5b4fc 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:.5rem;font-size:2.5rem;font-weight:800}.login-card p{color:var(--text-secondary);margin-bottom:2rem}.form-group{text-align:left;margin-bottom:1.5rem}.form-group label{color:var(--text-secondary);margin-bottom:.5rem;font-size:.875rem;font-weight:600;display:block}.login-btn{width:100%;margin-top:1rem}.error-msg{color:var(--danger);margin-top:1rem;font-size:.875rem;display:none}.dashboard-view{animation:.5s fadeIn}header{justify-content:space-between;align-items:center;margin-bottom:2rem;display:flex}header h1{font-size:1.5rem;font-weight:800}.user-info{align-items:center;gap:1rem;display:flex}.tabs{border-bottom:1px solid var(--glass-border);gap:1rem;margin-bottom:2rem;padding-bottom:1rem;display:flex}.tab-btn{color:var(--text-secondary);font-size:1.125rem;font-family:var(--font-main);cursor:pointer;background:0 0;border:none;padding:.5rem 0;font-weight:600;position:relative}.tab-btn.active{color:var(--text-primary)}.tab-btn.active:after{content:"";background:var(--accent-primary);border-radius:2px 2px 0 0;width:100%;height:2px;position:absolute;bottom:-1rem;left:0}.grid-container{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:2rem;display:grid}@media (width<=640px){.grid-container{grid-template-columns:repeat(2,1fr);gap:1rem}}.record-card{flex-direction:column;gap:1rem;padding:1rem;transition:transform .3s,box-shadow .3s;display:flex}.record-card:hover{transform:translateY(-5px);box-shadow:0 10px 40px #0006}.cover-container{aspect-ratio:1;background:#0000004d;border-radius:.5rem;width:100%;position:relative;overflow:hidden}.cover-img{object-fit:cover;width:100%;height:100%;transition:transform .5s}.record-card:hover .cover-img{transform:scale(1.05)}.record-info{flex:1}.record-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:.25rem;font-size:1rem;font-weight:600;line-height:1.2;display:-webkit-box;overflow:hidden}.record-artist{color:var(--text-secondary);font-size:.875rem}.record-actions{justify-content:flex-end;margin-top:auto;display:flex}.search-bar{gap:1rem;margin-bottom:2rem;display:flex}.loader{text-align:center;color:var(--text-secondary);padding:3rem;display:none}.spinner{border:4px solid #ffffff1a;border-top-color:var(--accent-primary);border-radius:50%;width:40px;height:40px;margin-bottom:1rem;animation:1s ease-in-out infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.toast{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--glass-border);color:#fff;opacity:0;z-index:1000;box-shadow:var(--glass-shadow);border-radius:.75rem;padding:1rem 1.5rem;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);position:fixed;bottom:2rem;right:2rem;transform:translateY(100px)}.toast.show{opacity:1;transform:translateY(0)}.toast.success{border-left:4px solid var(--success)}.toast.error{border-left:4px solid var(--danger)}.modal-overlay{-webkit-backdrop-filter:blur(8px);z-index:2000;opacity:0;visibility:hidden;background:#000000b3;justify-content:center;align-items:center;transition:all .3s;display:flex;position:fixed;inset:0}.modal-overlay.show{opacity:1;visibility:visible}.modal-content{background:var(--bg-color);border:1px solid var(--glass-border);border-radius:1.5rem;width:90%;max-width:900px;max-height:85vh;transition:all .3s cubic-bezier(.34,1.56,.64,1);position:relative;overflow-y:auto;transform:translateY(20px)scale(.95);box-shadow:0 25px 50px -12px #00000080}.modal-overlay.show .modal-content{transform:translateY(0)scale(1)}.modal-header{border-bottom:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;background:#0b0f19f2;justify-content:space-between;align-items:center;padding:1.5rem 2rem;display:flex;position:sticky;top:0}.modal-close{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;font-size:2rem;line-height:1;transition:color .2s}.modal-close:hover{color:#fff}.modal-body{padding:2rem}.release-title-link{cursor:pointer;transition:color .2s;display:inline-block}.release-title-link:hover{color:var(--accent-primary);text-decoration:underline}.tracklist{margin-top:1rem;list-style:none}.tracklist li{border-bottom:1px solid #ffffff0d;justify-content:space-between;padding:.75rem 0;display:flex}.tracklist li:last-child{border-bottom:none}