#friendSystem{position:fixed;right:8px;bottom:calc(var(--hud-height) + 3px);width:min(620px,calc(100vw - 16px));height:315px;min-width:min(420px,calc(100vw - 16px));min-height:200px;max-width:calc(100vw - 16px);max-height:calc(100vh - var(--hud-height) - 12px);resize:both;overflow:hidden;z-index:24;border:4px ridge #928679;box-shadow:inset 0 0 0 2px #252525;background:#000a;color:#e6dcc8;font:11px Arial}
.friendTitle{height:28px;background:#53555d url('https://servidor.muworld.net/api/texture?dir=Interface&file=win_titlebar.jpg') center/100% 100%;border-bottom:2px ridge #6a6158;display:flex;align-items:center;justify-content:space-between;padding:0 6px;cursor:move}.friendTitle strong{font-size:11px}.friendTitle div{display:flex;gap:4px}
#friendSystem button,.friendDialog button,.friendConversation button{font:11px Arial;color:#e6dcc8;border:2px outset #928679;border-radius:0;background:#353130;box-shadow:none;padding:2px 8px;filter:none}#friendSystem button:hover,.friendDialog button:hover,.friendConversation button:hover{background-color:#53555d}#friendSystem button:active,.friendDialog button:active,.friendConversation button:active{border-style:inset}#friendSystem button:disabled{color:#827c71;cursor:default}.friendTitle button{width:20px;height:17px;padding:0!important;font-size:12px!important;line-height:10px}
.friendContent{height:calc(100% - 28px);display:flex;flex-direction:column;padding:4px 5px;background:url('https://servidor.muworld.net/api/texture?dir=Interface&file=win_resize.tga') right bottom/12px 12px no-repeat}.friendTabs{display:flex;height:33px;flex-shrink:0}.friendTabs button{width:23%;background:#1a1615!important;border:2px solid #6a6158!important}.friendTabs button.selected{background:#353130!important;border-bottom-color:#353130!important}.friendTabs label{margin-left:auto;display:flex;align-items:center;white-space:nowrap;gap:4px;padding:0 2px}.friendTabs input{appearance:auto;width:18px;height:16px;accent-color:#928679;background:#000}.friendRequests{flex-shrink:0;max-height:70px;overflow:auto;background:#353130}.friendRequests button{margin:2px;font-size:10px!important}
.friendTableHead,.friendRow{display:grid;grid-template-columns:25% 75%;text-align:left;align-items:center}.friendTableHead{height:30px;background:#353130;flex-shrink:0;border:1px solid #6a6158}.friendTableHead span{padding:0 8px;border-right:2px solid #928679}.friendRows{flex:1;overflow:auto;min-height:30px;border:2px inset #928679;scrollbar-color:#928679 #353130;scrollbar-width:auto;background:#0005}.friendRows .friendRow{width:100%;border:0!important;border-radius:0;background:transparent!important;min-height:25px;padding:0!important}.friendRow span{padding:4px 7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.friendRow span:first-child{border-right:2px solid #6a6158}.friendRows .friendRow.selected{background:#53555dcc!important}.friendRows .friendRow:hover{background:#353130bb!important}.friendRow .online{color:#8ad584}.friendRow .offline{color:#a59c8d}.friendTableHead[data-tab=mail],.friendRows[data-tab=mail] .friendRow{grid-template-columns:7% 25% 23% 45%}.friendTableHead[data-tab=chats],.friendRows[data-tab=chats] .friendRow{grid-template-columns:1fr}.friendRow.unread{font-weight:bold;color:#ffe39b!important}.mailIcon{color:#ffe98a}
.friendActions{height:30px;display:flex;gap:4px;align-items:end;flex-shrink:0}.friendActions button{width:21%;height:24px;padding:0!important;background:#53555d url('https://servidor.muworld.net/api/texture?dir=Interface&file=win_button.tga') center/100% 100%!important}.minimized#friendSystem{height:36px!important;min-height:36px;resize:none}.minimized .friendContent{display:none}#friendSystem.maximized{left:8px!important;top:8px!important;right:auto!important;bottom:auto!important;width:calc(100vw - 16px);height:calc(100vh - var(--hud-height) - 16px)}
.playing #hudFriend{position:fixed;left:calc(var(--u)*589);bottom:calc(var(--v)*10);width:calc(var(--u)*30);height:calc(var(--v)*41);padding:0;border:0;border-radius:0;font-size:0;background:transparent url('https://servidor.muworld.net/api/texture?dir=Interface%2FpartCharge1&file=newui_menu_Bt03.jpg') 0 0/100% 400% no-repeat;z-index:6;box-shadow:none;filter:none}.playing #hudFriend:hover{background-position:0 33.333%}.playing #hudFriend:active{background-position:0 66.666%}.playing #hudFriend.unread{animation:friendBlink 1s steps(2) infinite}@keyframes friendBlink{50%{filter:brightness(1.8)}}
.friendDialog,.friendConversation{position:fixed;z-index:45;left:50%;top:50%;transform:translate(-50%,-50%);width:min(450px,90vw);border:4px ridge #928679;background:#1a1615f2;color:#e6dcc8;font:12px Arial;box-shadow:0 4px 15px #0009}.friendDialog header,.friendConversation header{padding:7px;background:#53555d url('https://servidor.muworld.net/api/texture?dir=Interface&file=win_titlebar.jpg') center/100% 100%;font-weight:bold}.friendDialogBody{padding:15px}.friendDialog label{display:block;margin:0 0 12px}.friendDialog input,.friendDialog textarea,.friendConversation input{display:block;width:100%;background:#000b;color:#fff;border:2px inset #928679;border-radius:0;padding:5px;font:12px Arial;margin-top:5px}.friendDialog textarea{height:150px;resize:vertical}.friendDialog pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:300px;overflow:auto;font:12px/1.5 Arial}.friendDialog footer{display:flex;justify-content:space-around;padding:10px}.friendDialog footer button{min-width:90px}.friendConversation{width:360px;left:30%;top:45%}.friendConversation header{display:flex;justify-content:space-between;align-items:center;cursor:move}.friendMessages{height:200px;overflow:auto;background:#0009;padding:6px;overflow-wrap:anywhere}.friendMessages p{margin:4px 0}.friendConversation form{display:flex;gap:5px;padding:6px}.friendConversation input{margin:0;flex:1;min-width:0}.friendConversation button{flex-shrink:0}

#friendSystem .friendTitle,.playing .friendDialog header,.playing .friendConversation header{position:relative;inset:auto;width:100%;height:28px;min-height:28px;margin:0;padding:0 6px;border-radius:0;pointer-events:auto;z-index:auto;gap:0;background:#53555d url('https://servidor.muworld.net/api/texture?dir=Interface&file=win_titlebar.jpg') center/100% 100%;color:#e6dcc8}
.playing .friendDialog header{display:flex;align-items:center;padding:6px;height:auto;min-height:28px}