@media(max-width:1000px){.layout-image{bottom:-150px}}.profile{flex:0 0 40%;max-width:40vw;display:flex;flex-direction:column;border-radius:0;gap:10px;z-index:1;position:sticky;overflow:hidden;min-width:600px}@media(max-width:1400px){.profile{max-width:100%;min-width:600px}}@media(max-width:800px){.profile{min-width:auto}}.role-badge{background-color:#1c1b21;width:100%;border-radius:10px;padding:10px 10px 0;display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start;flex-wrap:wrap}#profile-img{image-rendering:pixelated;image-rendering:crisp-edges;-ms-interpolation-mode:nearest-neighbor;-webkit-image-rendering:pixelated}.role{background-color:#232228;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 15px;margin-right:10px;margin-bottom:10px}.role span{color:#fff;font-size:16px}.role div{width:10px;height:10px;background:#672b35;border-radius:50%}.profile-info{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:10px}.profile-image-layout{width:210px;height:210px;padding:15px;border-radius:10px;background-color:#1c1b21;display:flex;flex-direction:row;justify-content:center;align-items:center}@media(max-width:520px){.profile-image-layout{width:150px;height:150px}}.profile-image{width:100%;height:100%;border-radius:10px;background-color:#232228;display:flex;justify-content:center;align-items:center}.profile-image img{width:auto;height:150px}@media(max-width:520px){.profile-image img{height:90px}}.info{border-radius:10px;flex:1;height:210px;background-color:#1c1b21;padding:10px}@media(max-width:520px){.info{height:150px}}.info h1{color:#fff;font-size:32px;font-weight:600}@media(max-width:500px){.info h1{font-size:24px}}textarea{background-color:transparent;color:#ffffff80;width:90%;resize:none}@media(max-width:500px){textarea{font-size:13px}}textarea:hover{outline:none}textarea:focus{outline:none}.profile-settings{gap:10px;width:100%;display:flex;flex-direction:column}.profile-form-row{height:50px;display:flex;flex-direction:row;gap:10px}.profile-form-row button{flex:1;background-color:#1c1b21;color:#fff;font-size:20px;height:100%;border-radius:10px}@media(max-width:1000px){.profile-form-row button{font-size:16px}}.edit-btn-layout{display:flex;align-items:center;justify-content:flex-end}.edit-btn{width:40px;height:40px;background-color:#232228;display:flex;align-items:center;justify-content:center;border-radius:10px;opacity:1}@media(max-width:523px){.edit-btn{opacity:0}}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:9999;background-color:#00000080;visibility:hidden}.new-input form input{width:100%;height:40px;padding:0 35px 0 10px;font-size:15px;background-color:#28272c;color:#fff;transition:border .5s;outline:none;border-radius:5px;margin-bottom:20px}.new-input form input:hover{outline:none}.new-input form input:focus{outline:none}.new-input form label{color:#fff}.dropzone-overlay{width:600px;padding:10px;display:flex;justify-content:center;align-items:center;background-color:#1c1b21;border-radius:10px;flex-direction:column}.dropzone-overlay span{color:#fff}.dropzone{background-color:#28272c;width:300px;height:300px;border-radius:10px;padding:10px;display:flex;justify-content:center;align-items:center}.dropzone-overlay h1{color:#fff;font-size:30px;margin:10px}.dropzone p{color:#fff;font-size:50px}.dropzone form{display:flex;justify-content:center;align-items:center;flex-direction:row}.dropzone-form div{margin-top:10px;margin-bottom:10px;display:flex;flex-direction:column}.dropzone-form button{height:50px;color:#fff;width:100%;font-size:15px;border-radius:5px;background-color:#f3485a;font-weight:500;transition:border-color .3s,color .3s,background-color .3s}.dropzone:hover{background-color:#3498db33;border-color:#2980b9}.dropzone.active{background-color:#3498db4d;border-color:#1abc9c}input[type=file]{display:none}.preview{margin-top:10px;width:280px;display:none}.preview img{width:100%;border-radius:10px;-o-object-fit:cover;object-fit:cover;image-rendering:pixelated;image-rendering:crisp-edges;-ms-interpolation-mode:nearest-neighbor;-webkit-image-rendering:pixelated}#song-layout{position:fixed;bottom:0;left:50%;transform:translate(-50%);opacity:0;visibility:hidden;transition:opacity 1s ease,transform 1s ease,visibility 1s}#song-layout.show{opacity:1;visibility:visible;transform:translate(-50%) translateY(0)}#song-layout div{padding:20px;color:#fff;background-color:#cd3f50;border-radius:10px 10px 0 0}.profile-layout{display:flex;flex-direction:row;gap:40px}@media(max-width:1400px){.profile-layout{padding:10px;align-items:center;flex-direction:column;gap:20px}}.user-posts{flex:1;display:flex;gap:20px;flex-direction:column}.textarea-wrapper{position:relative}.textarea-wrapper textarea{width:100%;border-radius:10px;background-color:#1c1b21;border:2px solid #302f39;padding:10px 50px 10px 10px;resize:none;overflow-y:hidden}.textarea-wrapper .icons{position:absolute;bottom:10px;right:10px;display:flex;gap:5px}.textarea-wrapper .icons img{width:30px;height:30px;cursor:pointer}#post-image-preview{margin-top:10px;display:flex;justify-content:center}#post-image-preview img{max-width:80%;border:1px solid #302f39;border-radius:5px}#profile-info{color:#ffffff80;width:90%;word-break:break-word}#ban-overlay button{height:50px;width:100%;font-size:15px}.ban-badge{background-color:#f3485a33;color:#fff;display:flex;padding:15px 10px;border-radius:10px;flex-direction:column}
