.profile-dropdown-overlay{z-index:1006;pointer-events:none;opacity:0;background:#00000080;width:100vw;height:100vh;padding:32px;transition:all .4s cubic-bezier(.4,0,.2,1);position:fixed;top:0;left:0}.profile-dropdown-overlay.open{pointer-events:auto;opacity:1}.profile-dropdown{outline-offset:-1px;opacity:0;z-index:1000;background:#fff;border-radius:32px;outline:1px solid #0000001a;flex-direction:column;justify-content:space-between;align-items:flex-start;width:540px;height:95vh;padding:32px;transition:all .5s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:32px;right:32px;transform:translate(140%)}@media (max-width:768px){.profile-dropdown{border-radius:0;width:100vw;height:100vh;padding-bottom:6em;top:0;left:0}}.profile-dropdown.open{opacity:1;transform:translate(0)}.profile-dropdown .profile-content{flex-direction:column;gap:24px;width:100%;display:flex;position:relative}.profile-dropdown .close-btn{color:#000;cursor:pointer;background:0 0;border:none;padding:8px;font-size:24px;transition:all .2s cubic-bezier(.4,0,.2,1);position:absolute;top:0;right:0}.profile-dropdown .close-btn:hover{opacity:.6}.profile-dropdown .close-btn i{font-size:12px}.profile-dropdown .avatar{opacity:0;border:1px solid #0000001a;border-radius:60px;justify-content:center;align-items:center;width:56px;height:56px;animation:.6s cubic-bezier(.4,0,.2,1) .1s forwards avatarSlideIn;display:flex;transform:scale(0)}@keyframes avatarSlideIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.profile-dropdown .avatar i{color:#000;font-size:24px}.profile-dropdown .greeting{color:#000;word-wrap:break-word;opacity:0;font-size:36px;font-weight:600;line-height:40px;animation:.6s cubic-bezier(.4,0,.2,1) .2s forwards greetingSlideIn;transform:translateY(20px)}@keyframes greetingSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.profile-dropdown .notice-box{outline-offset:-1px;opacity:0;background:#f5f5f5;border-radius:32px;outline:1px solid #0000001a;align-items:flex-start;gap:24px;width:100%;padding:32px;animation:.6s cubic-bezier(.4,0,.2,1) .3s forwards noticeSlideIn;display:flex;overflow:hidden;transform:translateY(20px)}@keyframes noticeSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.profile-dropdown .notice-icon{width:32px;height:32px}.profile-dropdown .notice-texts{flex-direction:column;gap:32px;display:flex}.profile-dropdown .notice-texts .notice-text{flex-direction:column;gap:12px;display:flex}.profile-dropdown .notice-title{color:#000;font-size:18px;font-weight:600;line-height:13px}.profile-dropdown .notice-description{color:#8d8d8d;font-size:14px;font-weight:500}.profile-dropdown .menu-item{color:#000;cursor:pointer;opacity:0;justify-content:space-between;align-items:center;width:100%;font-size:16px;font-weight:500;line-height:16px;text-decoration:none;transition:all .2s cubic-bezier(.4,0,.2,1);animation:.5s cubic-bezier(.4,0,.2,1) forwards menuItemSlideIn;display:flex;transform:translate(-20px)}.profile-dropdown .menu-item:nth-child(4){animation-delay:.4s}.profile-dropdown .menu-item:nth-child(5){animation-delay:.5s}@keyframes menuItemSlideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.profile-dropdown .menu-item span{-webkit-user-select:none;user-select:none;line-height:12px}.profile-dropdown .menu-item span:hover{opacity:.6;transition:all .2s cubic-bezier(.4,0,.2,1)}.profile-dropdown .menu-item i{color:#000;transition:all .2s cubic-bezier(.4,0,.2,1);rotate:-90deg}.profile-dropdown .arrow-icon{width:16px;height:16px;position:relative;overflow:hidden}.profile-dropdown .arrow-icon div{transform-origin:0 0;background:#000;width:14.51px;height:6.61px;position:absolute;top:16.74px;left:4.64px;transform:rotate(-90deg)}.profile-dropdown .logout-button{color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none;opacity:0;background:#141414;border:none;border-radius:64px;outline:none;justify-content:center;align-items:center;width:100%;height:54px;padding:16px;font-size:14px;font-weight:500;line-height:14px;transition:all .2s cubic-bezier(.4,0,.2,1);animation:.6s cubic-bezier(.4,0,.2,1) .6s forwards logoutButtonSlideIn;display:flex;transform:translateY(20px)}@keyframes logoutButtonSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.profile-dropdown .logout-button:hover{background-color:#333;transform:translateY(-2px)}
