.profile-panel{position:absolute;right:0;top:0;width:300px;height:100vh;height:100dvh;height:var(--app-height,100dvh);background:var(--bg-secondary);border-left:1px solid var(--border);z-index:1200;display:flex;flex-direction:column;box-shadow:-4px 0 20px var(--shadow);overflow:hidden}
.panel-header{display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--border)}
.panel-header h3{font-size:18px;color:var(--accent)}
.profile-content{flex:1;overflow-y:auto;padding:24px 20px;display:flex;flex-direction:column;gap:16px}
.profile-avatar-wrapper{position:relative;width:100px;height:100px;margin:0 auto 8px}
.profile-avatar{width:100px;height:100px;border-radius:50%;object-fit:cover;background:var(--bg-tertiary);border:3px solid var(--accent)}
.avatar-upload-btn{position:absolute;bottom:0;right:0;background:var(--accent);border-radius:50%;width:30px;height:30px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;box-shadow:0 2px 8px var(--shadow)}
.profile-field{display:flex;flex-direction:column;gap:6px}
.profile-field label{font-size:12px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-weight:600}
.profile-input{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:10px;padding:10px 14px;color:var(--text-primary);font-size:14px;outline:none;transition:border-color .2s;resize:none;font-family:inherit}
.profile-input:focus{border-color:var(--accent)}
.profile-username{color:var(--accent);font-size:14px;padding:4px 0}
@media(max-width:768px){.profile-panel{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;height:var(--app-height,100dvh);z-index:1400;border-left:none}.panel-header{padding-top:calc(14px + env(safe-area-inset-top))}.profile-content{padding-bottom:calc(24px + env(safe-area-inset-bottom))}}