.user-profile{position:relative;z-index:2;transform:translateX(-.6vw)}button.user-profile-btn{padding:.5vw .5vw .5vw .8vw;background:transparent;transform:translateX(1vw)}button.user-profile-btn:hover{color:var(--primary)}button.user-profile-btn svg{width:1.1vw;margin-left:.3vw;position:relative}button.user-profile-btn svg,button.user-profile-btn svg circle,button.user-profile-btn svg ellipse{transition:all .25s ease-in-out}button.user-profile-btn:hover svg circle,button.user-profile-btn:hover svg ellipse{stroke:var(--primary)!important}button.user-profile-btn>i{font-size:.85vw;margin-right:.4vw;transition:all .25s ease-in-out}button.user-profile-btn:hover>i{color:var(--primary)}button.user-profile-btn.active>i{transform:rotate(180deg)}button.user-profile-btn>span{font-size:.88vw;font-weight:600}button.user-profile-btn>span i{margin:0 .5vw;font-size:1vw}button.user-profile-btn figure{width:1.9vw;height:1.9vw;border-radius:100%;overflow:hidden;position:relative;margin-right:.5vw;box-shadow:var(--shadow-black-500)}button.user-profile-btn figure img{width:100%;height:100%}body.dark button.user-profile-btn>i,body.dark button.user-profile-btn>span{color:var(--neutral-500)!important}body.light button.user-profile-btn i{--fa-secondary-opacity:0.3}ul.user-profile-sum-menu{width:17vw;background-color:var(--light-bg);position:absolute;top:150%;right:-2vw;transition:all .3s;opacity:0;visibility:hidden;box-shadow:0 .3vw .5vw var(--shadow-black-200);overflow:hidden;height:0;justify-content:start;border-radius:.85vw}ul.user-profile-sum-menu.active{padding:.6vw .4vw;opacity:1;visibility:visible;height:24vw}body.light ul.user-profile-sum-menu{background-color:var(--menu-dark-bg);box-shadow:var(--shadow-black-100)}ul.user-profile-sum-menu li{width:95%;text-align:center;transition:all .2s;font-weight:500;font-size:.9vw}ul.user-profile-sum-menu li:first-child{height:6.5vw;border-bottom:.1vw solid var(--neutral-100);margin-bottom:.5vw}ul.user-profile-sum-menu li:first-child a{padding:1vw;width:100%;height:100%;justify-content:start!important;transition:all .25s ease-in-out;position:relative}ul.user-profile-sum-menu li:first-child a:hover{background-color:var(--lightest-red)}ul.user-profile-sum-menu li:first-child a>div{width:100%;justify-content:space-between!important;position:relative}ul.user-profile-sum-menu li:first-child a>div h4{width:80%;gap:.4vw;font-size:.9vw;font-weight:600;justify-content:start!important;transition:all .25s ease-in-out}ul.user-profile-sum-menu li:first-child a:hover>div h4{color:var(--primary)}ul.user-profile-sum-menu li:first-child a>div h4 i{margin:0 1vw;font-size:1vw}ul.user-profile-sum-menu li:first-child a>div h4 svg{width:1.6vw;transition:all .25s ease-in-out}ul.user-profile-sum-menu li:first-child a:hover>div h4 svg path{transition:all .25s ease-in-out;stroke:var(--primary)}ul.user-profile-sum-menu li:first-child a>div i{position:relative;font-size:1.1vw;transition:all .25s ease-in-out}ul.user-profile-sum-menu li:first-child a:hover>div i{color:var(--primary)}ul.user-profile-sum-menu li:first-child a>div:last-child{width:100%;margin-top:1vw;color:var(--text-secondary);justify-content:space-between!important;position:relative}ul.user-profile-sum-menu li:first-child a>div:last-child h5{font-weight:500;font-size:.9vw;color:var(--text-secondary)}ul.user-profile-sum-menu li:first-child a>div:last-child h6{font-weight:600;font-size:.95vw;color:var(--text-primary);gap:.2vw}ul.user-profile-sum-menu li:first-child a>div:last-child h6 svg{width:1.1vw;fill:var(--text-secondary)}ul.user-profile-sum-menu li:first-child a>div:last-child h6 span{font-size:.85vw}ul.user-profile-sum-menu li:not(li:first-child){cursor:pointer;padding:.75vw 0;font-weight:400;transition:all .25s ease-in-out;padding:.5vw .7vw;height:4vw;justify-content:start!important;gap:.75vw;border-radius:.5vw;font-weight:500;transition:all .25s ease-in-out!important}ul.user-profile-sum-menu li:not(li:first-child):hover{color:var(--primary)}ul.user-profile-sum-menu li:not(li:first-child) svg{width:1.5vw;fill:var(--dark-font);transition:all .25s ease-in-out!important}ul.user-profile-sum-menu li:not(li:first-child):hover svg{width:1.5vw;fill:var(--primary)!important}ul.user-profile-sum-menu li:not(li:first-child):hover{background-color:var(--lightest-red)}ul.user-profile-sum-menu li:not(li:first-child) a{width:100%;height:100%;justify-content:start!important;gap:.75vw;font-weight:500;transition:all .25s ease-in-out}ul.user-profile-sum-menu li:not(li:first-child) a:hover{color:var(--primary)}ul.user-profile-sum-menu li:not(li:first-child) a i{font-size:1.5vw}@media screen and (max-width:450px){.user-profile{display:none}}@media screen and (max-width:992px){.user-profile{order:1;transform:translateX(-.5vw) translateY(.2vw) scale(.95)}button.user-profile-btn{box-shadow:none!important}button.user-profile-btn>i{font-size:clamp(12px,2vw,18px);margin-right:8px;position:static}button.user-profile-btn>span{font-size:clamp(11px,1.7vw,15px)}button.user-profile-btn svg{width:clamp(15px,2vw,20px);margin-left:8px}button.user-profile-btn figure{width:34px;height:34px;margin-right:8px;box-shadow:0 0 5px var(--shadow-black-500)}ul.user-profile-sum-menu{width:min(60vw,240px);right:auto;left:0;top:130%;box-shadow:0 0 10px var(--shadow-black-300);border-radius:10px}ul.user-profile-sum-menu.active{height:auto;max-height:75vh;padding:6px}ul.user-profile-sum-menu li{font-size:13px;height:auto}ul.user-profile-sum-menu li:first-child{margin-top:0;padding:0;min-height:0;border-bottom:1px dashed var(--gold-50)}ul.user-profile-sum-menu li:first-child a{padding:10px}ul.user-profile-sum-menu li:first-child a>div h4{font-size:13px;gap:6px}ul.user-profile-sum-menu li:first-child a>div h4 svg{width:18px}ul.user-profile-sum-menu li:first-child a>div i{font-size:14px}ul.user-profile-sum-menu li:first-child a>div:last-child{margin-top:6px}ul.user-profile-sum-menu li:first-child a>div:last-child h5,ul.user-profile-sum-menu li:first-child a>div:last-child h6{font-size:12px}ul.user-profile-sum-menu li:first-child a>div:last-child h6 svg{width:13px}ul.user-profile-sum-menu li:first-child a>div:last-child h6 span{font-size:11px}ul.user-profile-sum-menu li:not(li:first-child){padding:10px 8px;height:auto;gap:8px;border-radius:8px;font-size:13px}ul.user-profile-sum-menu li:not(li:first-child) svg,ul.user-profile-sum-menu li:not(li:first-child):hover svg{width:18px}ul.user-profile-sum-menu li:not(li:first-child) a{gap:8px;padding:0}ul.user-profile-sum-menu li:not(li:first-child) a i{font-size:16px}body.dark ul.user-profile-sum-menu{box-shadow:0 0 10px var(--shadow-black-400)}body.light ul.user-profile-sum-menu{box-shadow:0 4px 10px var(--shadow-black-100)}}