:root{--background: #111;--surface: #181818;--surface-hover: #2a2a2a;--border: #333;--text: white;--text-muted: #aaa}body{margin:0;font-family:sans-serif;background:var(--background);color:var(--text)}#root{height:100vh}.app{padding:2rem;height:100vh;display:flex;flex-direction:column;box-sizing:border-box}.header{padding:1rem;flex-shrink:0}.layout{flex:1;display:flex;min-height:0;gap:2rem}.main-content{flex:1;flex-direction:column;display:flex;min-height:0;overflow-y:auto;padding:1rem}.sidebar{width:250px;flex-shrink:0;overflow-y:auto}.sidebar-buttons{margin:0 1rem 0 0}.sidebar-buttons button{background-color:transparent;border:none;color:#aaa}.sidebar-buttons button:hover{color:#fff}.sidebar-header{display:flex;flex-direction:row;justify-content:space-between}.artist-item-button{background-color:transparent;color:#fff;border:none;border-radius:10px;padding:.5rem}.artist-item-button:hover{background-color:#444}.album-item{padding-left:20px}.album-item-button{background-color:transparent;color:#fff;border:none;border-radius:10px;padding:.5rem}.album-item-button:hover{background-color:#444}.track-item{padding-left:20px}.track-item-button{background-color:transparent;color:#fff;border:none;border-radius:10px;padding:.5rem}.track-item-button:hover{background-color:#444}.now-playing{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;position:relative}.track-info{position:absolute;bottom:2rem;right:2rem;padding:1rem;background:#000000b3;border-radius:12px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);max-width:300px}.album-art{width:min(70vmin,420px);aspect-ratio:1 / 1;margin:0 auto;display:flex;align-items:center;justify-content:center;border-radius:12px;overflow:hidden}.album-art img{width:100%;height:100%;object-fit:cover;display:block}.queue-view{position:absolute;top:1rem;left:1rem;padding:1rem;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:12px;overflow-y:auto;max-height:50vh}.queue-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.queue-trash{background-color:transparent;color:#fff;border-radius:12px;border:1px solid white;padding:.5rem}.queue-trash:hover{background-color:#181818}.queue-item{display:flex;align-items:center;gap:.5rem}.queue-item-title{flex:1;text-align:left}.queue-item button{flex-shrink:0}.queue-remove{background:transparent;border:none;color:#aaa;padding:.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center}.queue-remove:hover{color:#fff}.drag-handle{cursor:grab;flex-shrink:0}.player-container{flex-shrink:0;border-top:1px solid #333;padding:1rem;background:#181818;display:flex;justify-content:center}.audio-player{display:flex;flex-direction:row;gap:1rem 2rem;width:100%}.audio-player button{background:transparent;border:none;color:#aaa;display:flex;align-items:center;justify-content:center;padding:.5rem;border-radius:999px;cursor:pointer;transition:background-color .15s ease,color .15s ease,transform .1s ease}.audio-player button:hover{color:#fff;background:#2a2a2a}.audio-player button:active{transform:scale(.95)}.player-controls{display:flex;align-items:center}.play-button{width:44px;height:44px;background:#fff!important;color:#000!important}.play-button:hover{transform:scale(1.05)}.transport-controls{display:flex;align-items:center;gap:.25rem}.seek-section{display:flex;align-items:center;gap:.75rem;flex:1 1 auto;min-width:250px}.seek-section span{font-size:.85rem;color:#aaa;min-width:40px}.seek-section input[type=range]{flex:1;min-width:0}.volume-control{display:flex;align-items:center;gap:.5rem}.volume-control input{width:100px}.queue-button{background:transparent;border:none;color:#aaa}input[type=range]{appearance:none;height:4px;background:#444;border-radius:999px}input[type=range]::-webkit-slider-thumb{appearance:none;width:14px;height:14px;border-radius:50%;background:#fff}.mobile-library-button,.mobile-library-close{display:none}@media(max-width:768px){.mobile-library-button{display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--text);padding:.5rem;cursor:pointer}.mobile-library-close{display:flex;align-items:center;justify-content:center;margin-left:auto;margin-bottom:1rem;background:transparent;border:none;color:var(--text);padding:.5rem;cursor:pointer}.layout{gap:0}.sidebar{position:fixed;top:0;left:0;bottom:0;width:280px;padding:1rem;box-sizing:border-box;background:var(--background);z-index:100;overflow-y:auto;transform:translate(-100%);transition:transform .2s ease}.sidebar.sidebar-open{transform:translate(0)}.audio-player{flex-direction:column;gap:.5rem;width:100%}.player-controls{position:relative;width:100%;height:54px;display:flex;align-items:center;justify-content:center}.transport-controls{display:flex;align-items:center;gap:.25rem}.seek-section{width:100%;min-width:0}.volume-control{position:absolute;left:0}.volume-control input{display:none}.queue-button{position:absolute;right:0}}