.selecting header,.selecting #mapPanel,.selecting #character,.selecting #worldMessages{display:none!important}
html:has(body.selecting),body.selecting{background:#000;min-height:100vh}
.selecting #world{inset:0;width:100vw;height:100vh;transform:none;cursor:default;background:transparent;z-index:1}
.selecting #labels{display:none}
#welcome{display:block;position:fixed;inset:0;overflow:hidden;z-index:3;background:transparent;pointer-events:none;font:10px Tahoma,Arial,sans-serif;color:#eee}
.selectionStage{position:absolute;left:50%;top:50%;width:var(--selection-width,1280px);height:var(--selection-height,720px);transform:translate(-50%,-50%) scale(var(--selection-scale,1));transform-origin:center}
#characterSlots{position:absolute;inset:0;pointer-events:none}
#characterSlots .characterSlot{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;width:118px;height:54px;min-height:0;padding:5px 0 0;border:0;border-radius:0;background:url('https://servidor.muworld.net/api/texture?dir=Interface&file=character_ex.tga') 0 0/118px 54px no-repeat;transform:translate(-50%,-100%) scale(var(--selection-scale,1));transform-origin:bottom center;pointer-events:auto;color:#eee;text-align:center;text-shadow:1px 1px #000;box-shadow:none;font:10px/16px Tahoma}
.characterSlot strong{display:block;font:10px/16px Tahoma;white-space:nowrap;max-width:110px;overflow:hidden;text-overflow:ellipsis}.characterSlot span{font:10px/16px Tahoma}.characterSlot small{font:10px/16px Tahoma;color:#e6c85b}.characterSlot[aria-pressed=true]{filter:brightness(1.25)}.characterSlot:hover,.characterSlot:focus-visible{outline:1px solid #c8b777;outline-offset:1px}
.selectionCorners{position:absolute;inset:0;pointer-events:none}
#welcome .selectionCorners>button{position:absolute;bottom:49px;width:54px;height:30px;padding:0;border:0;border-radius:0;box-shadow:none;pointer-events:auto;background-position:0 0;background-size:54px 120px;color:transparent;font-size:0}
#welcome #newCharacter{left:22px;background-image:url('https://servidor.muworld.net/api/texture?dir=Interface&file=b_create.tga')}
#welcome #selectionMenuToggle{left:77px;background-image:url('https://servidor.muworld.net/api/texture?dir=Interface&file=server_menu_b_all.tga');background-size:54px 90px}
#welcome #enter{right:77px;background-image:url('https://servidor.muworld.net/api/texture?dir=Interface&file=b_connect.tga')}
#welcome #deleteCharacter{right:22px;background-image:url('https://servidor.muworld.net/api/texture?dir=Interface&file=b_delete.tga')}
#welcome .selectionCorners>button:hover,#welcome .selectionCorners>button:focus-visible{background-position:0 -60px;outline:none}
#welcome .selectionCorners>button:disabled{background-position:0 -90px;opacity:1;cursor:default}
.selectionDeco{position:absolute;right:0;bottom:35px;width:189px;height:103px;background:url('https://servidor.muworld.net/api/texture?dir=Interface&file=deco.tga') no-repeat;z-index:-1}
#welcome #resume{position:absolute;bottom:53px;left:135px;right:135px;height:21px;min-height:0;margin:0;padding:5px 8px;text-align:center;font:10px Tahoma;color:#c5bc86;background:#0005;text-shadow:1px 1px #000;pointer-events:none}
#welcome #undoDelete{left:140px;width:82px;font-size:10px;color:#dfcf98;background:#10160ce8;border:1px solid #807a5e}
#createDimmer,#selectionMenuDimmer{position:absolute;inset:0;background:#0006;pointer-events:auto;z-index:1}
#createPanel{position:absolute;left:50%;top:50%;width:454px;height:406px;transform:translate(-50%,-50%);padding:0;margin:0;background:transparent;border:0;box-shadow:none;overflow:visible;pointer-events:none;z-index:2}
#createPortrait{position:absolute;left:0;top:0;width:410px;height:335px;pointer-events:none}
#createStats{position:absolute;left:346px;top:24px;width:108px;min-height:80px;padding:6px 16px 6px 22px;box-sizing:border-box;background:#0008;pointer-events:auto}
#createStats>div{display:flex;justify-content:space-between;gap:12px;font:10px/17px Tahoma;white-space:nowrap}#createStats b{font-weight:normal;color:#f5c949}
#createPanel #classes{position:absolute;inset:0;pointer-events:none}
#createPanel .classCard{position:absolute;left:346px;width:108px;height:26px;min-height:0;padding:0;border:0;border-radius:0;box-shadow:none;pointer-events:auto;background:url('https://servidor.muworld.net/api/texture?dir=Interface&file=cha_bt.tga') 0 0/108px 104px no-repeat;color:#ddd;text-align:center;font:10px Tahoma;text-shadow:1px 1px #000}
.classCard[data-class='0']{top:131px}.classCard[data-class='1']{top:157px}.classCard[data-class='2']{top:183px}.classCard[data-class='5']{top:209px}.classCard[data-class='3']{top:246px}.classCard[data-class='4']{top:272px}
#createPanel .classCard:hover,#createPanel .classCard:focus-visible,#createPanel .classCard.selected{background-position:0 -78px;color:#fff;outline:none}
.createNameFrame{position:absolute;top:317px;left:0;width:346px;height:38px;background:url('https://servidor.muworld.net/api/texture?dir=Interface&file=cha_id.tga') 0 0/346px 38px no-repeat}
#createPanel #name{position:absolute;left:78px;top:335px;width:242px;height:17px;padding:0 3px;margin:0;border:0;border-radius:0;outline:none;background:transparent;color:#eee;font:11px Tahoma;pointer-events:auto}
#createPanel #name:focus{box-shadow:0 1px #a7976a}
#createPanel #confirmCreate,#createPanel #cancelCreate{position:absolute;top:325px;width:54px;height:30px;padding:0;border:0;border-radius:0;box-shadow:none;background-position:0 0;background-size:54px 90px;font-size:0;color:transparent;pointer-events:auto}
#createPanel #confirmCreate{left:346px;background-image:url('https://servidor.muworld.net/api/texture?dir=Interface&file=message_ok_b_all.tga')}
#createPanel #cancelCreate{left:400px;background-image:url('https://servidor.muworld.net/api/texture?dir=Interface&file=loding_cancel_b_all.tga')}
#createPanel #confirmCreate:hover,#createPanel #cancelCreate:hover,#createPanel #confirmCreate:focus-visible,#createPanel #cancelCreate:focus-visible{background-position:0 -60px;outline:none}
#createDescription{position:absolute;top:355px;left:0;width:454px;height:51px;margin:0;padding:9px 10px;font:10px/19px Tahoma;color:#eee;text-shadow:1px 1px #000;background:#0008}
#welcome.creating #characterSlots{pointer-events:none}#welcome.creating .characterSlot{pointer-events:none}
.classicSelectionDialog{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:213px;height:155px;padding:33px 0 22px;box-sizing:border-box;z-index:4;pointer-events:auto;text-align:center;background:url('https://servidor.muworld.net/api/texture?dir=Interface&file=op1_back1.tga') center top/213px 64px no-repeat,url('https://servidor.muworld.net/api/texture?dir=Interface&file=op1_back2.tga') center bottom/213px 43px no-repeat,url('https://servidor.muworld.net/api/texture?dir=Interface&file=op1_back3.jpg') left top/5px 8px repeat-y,url('https://servidor.muworld.net/api/texture?dir=Interface&file=op1_back4.jpg') right top/5px 8px repeat-y,url('https://servidor.muworld.net/api/texture?dir=Interface&file=op1_stone.jpg') repeat}
#welcome .classicSelectionDialog button{position:static;display:block;width:108px;height:30px;padding:0;margin:0 auto 4px;border:0;border-radius:0;box-shadow:none;background:url('https://servidor.muworld.net/api/texture?dir=Interface&file=op1_b_all.tga') 0 0/108px 120px no-repeat;font:10px Tahoma;color:#ddd;text-shadow:1px 1px #000}
#welcome .classicSelectionDialog button:hover,#welcome .classicSelectionDialog button:focus-visible{background-position:0 -60px;color:#fff;outline:none}
#deleteCharacterForm{height:245px;padding:25px 18px}#deleteCharacterForm p{margin:0 0 14px;color:#eedba8}#deleteCharacterForm label{font:10px Tahoma;display:block;margin-bottom:8px}#deleteCharacterForm input{width:100%;background:#080a08;color:#eee;border:1px solid #7a7d6d;border-radius:0;padding:5px;font:11px Tahoma;margin-bottom:12px}
.switchCharacter { display: block; width: 100%; margin-top: 18px; padding: 8px; }
.playing #menuToggle { position: fixed; left: calc(var(--u) * 549); bottom: calc(var(--v) * 10); width: calc(var(--u) * 30); height: calc(var(--v) * 41); z-index: 8; padding: 0; border: 1px ridge #7c7d6d; border-radius: 0; background: linear-gradient(#414737, #151c11, #424937); color: #c8c5a6; font: clamp(8px, .8vw, 12px) Georgia; }
.selecting #menuToggle { display: none; }

#selectionSky{display:none}.selecting #selectionSky{display:block;inset:0;width:100vw;height:100vh;transform:none;z-index:0;pointer-events:none}#createDimmer{background:transparent}#welcome.creating #characterSlots{opacity:.6}body:has(#welcome.creating) #selectionSky{filter:brightness(.6)}

.selectionLetterbox{display:none;position:absolute;left:0;right:0;height:5.2%;background:#000;pointer-events:none}.selectionLetterbox.top{top:0}.selectionLetterbox.bottom{bottom:0}
#welcome.creating #undoDelete{visibility:hidden}

/* Original ZzzInterface cursor: 24 logical pixels, hotspot (2,2). */
body,body *{cursor:none!important}
#muCursor{position:fixed;z-index:10000;pointer-events:none;width:48px;height:48px;transform:translate(-4px,-4px);image-rendering:auto}
@media(pointer:coarse){#muCursor{display:none}}
