/* 언어 선택 단추(한국어 / English / 日本語). 44px 이상 눌림 영역. */
.lang-picker{display:inline-flex;align-items:center;gap:2px;min-height:44px;min-width:44px;padding:0 6px 0 10px;border-radius:22px;background:rgba(255,255,255,.72);border:1px solid rgba(127,143,204,.35);color:inherit;box-sizing:border-box;flex:0 0 auto}
.lang-picker:focus-within{outline:3px solid #7f8fcc;outline-offset:2px}
.lang-picker .lang-globe{font-size:16px;line-height:1}
.lang-picker select{min-height:42px;max-width:112px;border:0;background:transparent;font:inherit;font-size:14px;color:inherit;padding:0 4px;cursor:pointer;appearance:auto;outline:none}
/* 첫 화면(3D 공간)에서는 상단 막대가 꽉 차 있어 오른쪽 단추 열 아래에 띄운다. */
.lang-float{position:absolute;z-index:5;right:12px;top:164px}
.lang-float .lang-picker{box-shadow:0 1px 6px rgba(47,61,122,.18)}
body.panel-open .lang-float,body.app-loading .lang-float,body[data-petting=true] .lang-float,body[data-tribute-ceremony=true] .lang-float,body[data-scene=grove] .lang-float{display:none}
[data-lang-slot]{display:flex;justify-content:flex-end;padding:8px 12px}
html[data-lang=ja]{--ui-font:'Zen Maru Gothic','M PLUS Rounded 1c','Hiragino Maru Gothic ProN','Hiragino Sans','Yu Gothic','Meiryo',Jua,sans-serif;--read-font:'Zen Maru Gothic','M PLUS Rounded 1c','Hiragino Maru Gothic ProN','Hiragino Sans','Yu Gothic','Meiryo',sans-serif}
html[data-lang=en]{--ui-font:Jua,'Nunito','Segoe UI',system-ui,sans-serif;--read-font:'Nunito',Jua,'Segoe UI',system-ui,sans-serif}
html[data-lang=en] body,html[data-lang=ja] body{overflow-wrap:break-word;word-break:normal;line-break:auto}
html:is([data-lang=en],[data-lang=ja]) .family-caption{font-size:9px;line-height:1.15;min-width:0;max-width:64px;overflow-wrap:normal}
html:is([data-lang=en],[data-lang=ja]) #family-invite span,html:is([data-lang=en],[data-lang=ja]) #family-invite{font-size:8px;line-height:1.05;overflow-wrap:normal}
@media (max-width:480px){.lang-picker{padding:0 2px 0 8px}.lang-picker select{max-width:92px;font-size:13px}}

/* 영어·일본어는 문구가 길어서 좁은 화면의 상단 막대·아래 메뉴 글자를 작게 하고 줄바꿈을 허용한다. */
@media (max-width:480px){
  html:is([data-lang=en],[data-lang=ja]) body .topbar{gap:1px;padding:2px 2px}
  html:is([data-lang=en],[data-lang=ja]) body .topbar :is(.presence-button,.quiet-button,.music-controls button){font-size:9.5px;padding:4px 3px;white-space:nowrap}
  html:is([data-lang=en],[data-lang=ja]) body .topbar .brand{font-size:13px;margin:0 2px;gap:2px}html:is([data-lang=en],[data-lang=ja]) body .topbar .brand svg{width:19px}html:is([data-lang=en],[data-lang=ja]) body .topbar .presence-button{min-width:0;max-width:74px}html:is([data-lang=en],[data-lang=ja]) body .topbar #presence-status{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60px;display:block}
  html:is([data-lang=en],[data-lang=ja]) body .dock button>span:last-child{white-space:normal;line-height:1.08;text-align:center;font-size:9px;overflow-wrap:anywhere}
}





/* 정원에서는 오른쪽 위 '놀이' 단추가 같은 자리라 언어 단추를 한 칸 아래로 */
body[data-scene=garden] .lang-float{top:216px}

/* 아주 좁은 화면(320px)에서는 아래 메뉴 글자를 더 작게 해 낱말이 중간에서 끊기지 않게 한다 */
@media (max-width:340px){html:is([data-lang=en],[data-lang=ja]) body .dock button>span:last-child{font-size:8px;letter-spacing:-.02em;overflow-wrap:normal;word-break:keep-all}}