*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#121212;min-height:100vh;color:#fff}.app{max-width:800px;margin:0 auto;padding:24px}.header{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid #2d2d2d;margin-bottom:24px}.header h1{font-size:24px;font-weight:600;color:#fff}.name-section{display:flex;gap:12px;align-items:center;color:#9ca3af}.btn-small{padding:6px 12px;border:1px solid #2d2d2d;border-radius:6px;cursor:pointer;background:transparent;color:#9ca3af;font-size:12px}.btn-small:hover{background:#1a1a1a}.notification{position:fixed;top:20px;right:20px;padding:12px 20px;font-weight:500;z-index:1001;font-size:14px;border-radius:6px}.notification.success{background:#22c55e;color:#fff}.notification.error{background:#f44;color:#fff}.name-prompt,.name-input-section{padding:48px;border:1px solid #2d2d2d;text-align:center;border-radius:6px;background:#1a1a1a}.name-prompt h2,.name-input-section h2{margin-bottom:8px;font-weight:500}.name-prompt p{color:#9ca3af;margin-bottom:24px}.name-input-row{display:flex;gap:8px;justify-content:center}.name-input{padding:12px 16px;border:1px solid #2d2d2d;border-radius:6px;font-size:14px;background:#1a1a1a;color:#fff;width:200px}.main{margin-top:24px}.admin-section{border:1px solid #2d2d2d;margin-bottom:24px;border-radius:6px;background:#1a1a1a}.admin-header{padding:12px 16px;border-bottom:1px solid #2d2d2d;background:#222}.admin-header h3{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#9ca3af}.admin-content{padding:16px}.admin-row{display:flex;gap:8px;margin-bottom:12px}.suggestions-list{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;max-height:200px;overflow-y:auto}.suggestion-item{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background:#222;border:1px solid #2d2d2d;font-size:14px;border-radius:6px}.suggestion-text{cursor:pointer;color:#e5e5e5}.suggestion-text:hover{color:#22c55e}.btn-remove-suggestion{background:transparent;border:none;color:#666;cursor:pointer;font-size:14px;padding:0 4px}.btn-remove-suggestion:hover{color:#fff}.suggestion-item:hover{background:#252525}.no-suggestions{color:#666;font-size:13px;padding:8px 0}.btn-danger{padding:10px 20px;border:none;background:#22c55e;color:#fff;font-weight:500;cursor:pointer;font-size:14px}.btn-danger:hover{background:#16a34a}.theme-section{margin-bottom:24px}.current-theme{display:flex;align-items:baseline;gap:12px;margin-bottom:16px}.theme-label{color:#9ca3af;font-size:13px;text-transform:lowercase}.theme-value{font-size:32px;font-weight:600;letter-spacing:-.5px;color:#22c55e}.no-theme{margin-bottom:16px}.no-theme-text{color:#9ca3af;font-size:13px}.theme-suggestion{display:flex;gap:8px}.theme-input{flex:1;padding:8px 0;border:none;border-bottom:1px solid #2d2d2d;font-size:14px;background:transparent;color:#fff}.theme-input::placeholder{color:#666}.theme-input:focus{outline:none;border-bottom-color:#22c55e}.btn-primary{padding:10px 20px;border:none;background:#22c55e;color:#fff;font-weight:500;cursor:pointer;font-size:14px}.btn-primary:hover{background:#16a34a}.btn-secondary{padding:10px 20px;border:1px solid #2d2d2d;background:transparent;color:#9ca3af;cursor:pointer;font-size:14px;border-radius:6px}.player-section{margin-bottom:24px;border:1px solid #2d2d2d;border-radius:6px;background:#1a1a1a}.video-container{width:100%;aspect-ratio:16/9;background:#0a0a0a;position:relative}.video-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#666;font-size:14px;z-index:10;background:#0a0a0a}#youtube-player{position:absolute;top:0;left:0;width:100%;height:100%}.player-controls{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid #2d2d2d}.btn-control{padding:8px 16px;border:1px solid #22c55e;background:transparent;color:#22c55e;cursor:pointer;font-size:13px;border-radius:6px}.btn-control:hover,.btn-control.active{background:#22c55e;color:#fff}.now-playing{color:#9ca3af;font-size:13px}.search-section{margin-bottom:24px}.search-section h3{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#9ca3af;margin-bottom:12px}.waiting-message{color:#9ca3af;padding:16px;border:1px solid #2d2d2d;text-align:center;border-radius:6px;background:#1a1a1a}.search-box{margin-bottom:12px}.search-input{width:100%;padding:12px 16px;border:1px solid #2d2d2d;font-size:14px;background:#1a1a1a;color:#fff;border-radius:6px}.search-input::placeholder{color:#666}.search-results,.track-list{display:flex;flex-direction:column;gap:4px}.track-item{display:flex;align-items:center;gap:12px;padding:12px;background:#1a1a1a;cursor:pointer;border-radius:6px}.track-item:hover,.track-item.active{background:#222}.track-art{width:100px;height:56px;object-fit:cover;background:#333}.track-info{flex:1;display:flex;flex-direction:column;min-width:0}.track-name{font-weight:500;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-artist{color:#666;font-size:13px}.added-by{color:#666;font-size:12px}.btn-add{width:32px;height:32px;border:1px solid #2d2d2d;background:#22c55e;color:#fff;cursor:pointer;font-size:18px;flex-shrink:0;border-radius:6px}.btn-add:hover{background:#16a34a}.btn-remove{width:28px;height:28px;border:none;background:transparent;color:#666;cursor:pointer;font-size:16px;flex-shrink:0}.btn-remove:hover{color:#fff}.no-tracks,.no-archives{color:#9ca3af;padding:24px;text-align:center;border:1px solid #2d2d2d;border-radius:6px;background:#1a1a1a}.archive-section{margin-top:24px}.archive-section h3{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#9ca3af;margin-bottom:12px}.archive-list{display:flex;flex-direction:column;gap:4px}.archive-item{display:flex;justify-content:space-between;padding:12px 16px;background:#1a1a1a;text-decoration:none;color:#fff;border-radius:6px}.archive-item:hover{background:#222}.archive-date{color:#fff;font-weight:500}.archive-name{flex:1;margin-left:16px;color:#9ca3af}.archive-count{color:#9ca3af}