/* Round 15: single "เมนู" button with slide-out PC menu groups (menu_build). Art = PC MainMenuBar bitmaps from GFx4_BottomBar.swf and
   PC window emblems (ui/pc/menu/SOURCES.json). Position: gameplay.css (classic) / action-experience.css (action) .game-menu rules.
   Layer: z 80 inside #gameHud (z 2) — above pc-hud windows 31..50, loot/dungeon 52 … death 77, found popup 78 and the walk pad
   editor 79, so "เมนู" never sits under a window; under the role modal 1000 (#gameHud) and the rotate prompt 1200 (body).
   Closed = the "เมนู" button only (row + lists are visibility:hidden, out of flow, not hit-testable). */
#gameHud .game-menu{position:absolute;z-index:80;display:block;gap:0;width:auto;height:auto;overflow:visible;pointer-events:none;font-family:"Microsoft Sans Serif",Tahoma,"Segoe UI",sans-serif}
#gameHud .game-menu>button:not(.game-menu-toggle){display:none}
/* "เมนู": PC group-button frame (hover square #183, open = pressed glow #166 + release bar #170), gold PC title text. */
#gameHud nav.game-menu>button.game-menu-toggle{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;min-width:0;min-height:0;margin:0;padding:0!important;border:1px solid #c2a66b66;border-radius:8px;background:#0b1219b3 url(ui/pc/menu/toggle-base.png) center/100% 100% no-repeat;box-shadow:0 2px 10px #000a,inset 0 1px #e5dbaf33;color:#eebb85;font:bold 13px/1 "Microsoft Sans Serif",Tahoma,sans-serif;letter-spacing:.5px;text-shadow:0 1px 2px #000;pointer-events:auto;transition:filter .2s}
#gameHud nav.game-menu>button.game-menu-toggle:hover:enabled{border-color:#e5dbafaa;filter:brightness(1.25)}
#gameHud nav.game-menu.open>button.game-menu-toggle{border-color:#5fc8f0aa;background-image:url(ui/pc/menu/toggle-open.png);color:#fff}
#gameHud nav.game-menu>button.game-menu-toggle::after{content:"";position:absolute;left:50%;bottom:-4px;width:31px;height:10px;margin-left:-15.5px;background:url(ui/pc/menu/toggle-bar.png);opacity:0;transition:opacity .12s}
#gameHud nav.game-menu.open>button.game-menu-toggle::after{opacity:1}
/* Horizontal row of PC group buttons, sliding out of "เมนู" to the left (PC order Character, Community, Dungeon, System). */
#gameHud .game-menu .game-menu-groups{position:absolute;right:calc(100% + 6px);bottom:-1px;display:flex;align-items:flex-end;gap:2px;padding:0 3px;visibility:hidden;pointer-events:auto;transition:visibility 0s linear .2s}
#gameHud .game-menu.open .game-menu-groups{visibility:visible;transition-delay:0s}
/* Closing: the row slides back under "เมนู" and takes no taps (buttons set pointer-events:auto in #gameHud). */
#gameHud .game-menu:not(.open) .game-menu-groups,#gameHud .game-menu:not(.open) .game-menu-groups *,#gameHud .game-menu .game-menu-group:not(.open)>.game-menu-list,#gameHud .game-menu .game-menu-group:not(.open)>.game-menu-list *{pointer-events:none}
#gameHud .game-menu .game-menu-groups::before{content:"";position:absolute;inset:4px 0 0;border:1px solid #c2a66b55;border-radius:7px;background:linear-gradient(#141a1fcc,#0a0e12e6);box-shadow:0 2px 10px #0008;clip-path:inset(0 0 0 100%);transition:clip-path .16s ease-out}
#gameHud .game-menu.open .game-menu-groups::before{clip-path:inset(-2px)}
#gameHud .game-menu .game-menu-group{position:relative;--gm-n:1}
#gameHud .game-menu .game-menu-group:nth-child(1){--gm-n:4}#gameHud .game-menu .game-menu-group:nth-child(2){--gm-n:3}#gameHud .game-menu .game-menu-group:nth-child(3){--gm-n:2}
#gameHud .game-menu .game-menu-group>.game-menu-group-button{position:relative;display:block;width:46px;height:50px;min-width:0;min-height:0;margin:0;padding:0!important;border:0;border-radius:0;background:transparent center/contain no-repeat;box-shadow:none;opacity:0;transform:translateX(calc(var(--gm-n)*48px)) scale(.55);transition:transform .16s cubic-bezier(.2,.8,.3,1) calc((var(--gm-n) - 1)*20ms),opacity .12s linear calc((var(--gm-n) - 1)*20ms)}
#gameHud .game-menu.open .game-menu-group>.game-menu-group-button{opacity:1;transform:none}
#gameHud .game-menu .game-menu-group>.game-menu-group-button:active:enabled{transform:none}
#gameHud .game-menu .game-menu-group>.game-menu-group-button:hover:enabled{border:0;box-shadow:none}
#gameHud .game-menu .game-menu-group>.game-menu-group-button:focus-visible{outline:2px solid #eed394;outline-offset:-2px}
#gameHud .game-menu .game-menu-group[data-group=character]>.game-menu-group-button{background-image:url(ui/pc/menu/group-character-normal.png)}
#gameHud .game-menu .game-menu-group[data-group=community]>.game-menu-group-button{background-image:url(ui/pc/menu/group-community-normal.png)}
#gameHud .game-menu .game-menu-group[data-group=dungeon]>.game-menu-group-button{background-image:url(ui/pc/menu/group-dungeon-normal.png)}
#gameHud .game-menu .game-menu-group[data-group=system]>.game-menu-group-button{background-image:url(ui/pc/menu/group-system-normal.png)}
@media(hover:hover){
 #gameHud .game-menu .game-menu-group[data-group=character]>.game-menu-group-button:hover{background-image:url(ui/pc/menu/group-character-hover.png)}
 #gameHud .game-menu .game-menu-group[data-group=community]>.game-menu-group-button:hover{background-image:url(ui/pc/menu/group-community-hover.png)}
 #gameHud .game-menu .game-menu-group[data-group=dungeon]>.game-menu-group-button:hover{background-image:url(ui/pc/menu/group-dungeon-hover.png)}
 #gameHud .game-menu .game-menu-group[data-group=system]>.game-menu-group-button:hover{background-image:url(ui/pc/menu/group-system-hover.png)}
 /* PC tooltip (#344 9-slice 16/6) above a group while its list is closed. */
 #gameHud .game-menu.open .game-menu-group>.game-menu-group-button:hover:not([aria-expanded=true])::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 2px);transform:translateX(-50%);padding:3px 9px 4px;border:solid transparent;border-width:6px 16px;border-image:url(ui/pc/menu/tooltip-bg.png) 6 16 fill/6px 16px;color:#fefbe0;font:13px/1.2 "Microsoft Sans Serif",Tahoma,sans-serif;letter-spacing:1px;white-space:nowrap;text-shadow:none;pointer-events:none}
}
#gameHud .game-menu .game-menu-group[data-group=character]>.game-menu-group-button:active{background-image:url(ui/pc/menu/group-character-pressed.png)}
#gameHud .game-menu .game-menu-group[data-group=community]>.game-menu-group-button:active{background-image:url(ui/pc/menu/group-community-pressed.png)}
#gameHud .game-menu .game-menu-group[data-group=dungeon]>.game-menu-group-button:active{background-image:url(ui/pc/menu/group-dungeon-pressed.png)}
#gameHud .game-menu .game-menu-group[data-group=system]>.game-menu-group-button:active{background-image:url(ui/pc/menu/group-system-pressed.png)}
#gameHud .game-menu .game-menu-group[data-group=character]>.game-menu-group-button[aria-expanded=true]{background-image:url(ui/pc/menu/group-character-selected.png)}
#gameHud .game-menu .game-menu-group[data-group=community]>.game-menu-group-button[aria-expanded=true]{background-image:url(ui/pc/menu/group-community-selected.png)}
#gameHud .game-menu .game-menu-group[data-group=dungeon]>.game-menu-group-button[aria-expanded=true]{background-image:url(ui/pc/menu/group-dungeon-selected.png)}
#gameHud .game-menu .game-menu-group[data-group=system]>.game-menu-group-button[aria-expanded=true]{background-image:url(ui/pc/menu/group-system-selected.png)}
/* Vertical list growing up from its group (PC popup #418 9-slice 40/20/38/20, pointer #426, rows #132 / #136, ~80 ms like
   SBMainMenuPopup; rows appear once the panel is open). --game-menu-shift is set by game-menu.js to stay inside the viewport. */
#gameHud .game-menu .game-menu-group::after{content:"";position:absolute;left:50%;bottom:calc(100% + 1px);width:11px;height:8px;margin-left:-5.5px;background:url(ui/pc/menu/popup-pointer.png);visibility:hidden}
#gameHud .game-menu.open .game-menu-group.open::after{visibility:visible}
#gameHud .game-menu .game-menu-list{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(calc(-50% + var(--game-menu-shift,0px)));display:flex;flex-direction:column;gap:1px;box-sizing:border-box;width:max-content;min-width:150px;max-width:calc(100vw - 16px);max-height:calc(100vh - 90px);overflow:hidden auto;overscroll-behavior:contain;padding:4px 3px 5px;border:solid transparent;border-width:0;border-image:url(ui/pc/menu/popup-bg.png) 40 20 38 20 fill/40px 20px 38px 20px;visibility:hidden;clip-path:inset(100% 0 0 0);transition:clip-path 80ms ease-out,visibility 0s linear 80ms;pointer-events:auto;scrollbar-width:thin;scrollbar-color:#715751 #1e2225}
#gameHud .game-menu.open .game-menu-group.open>.game-menu-list{visibility:visible;clip-path:inset(0);transition-delay:0s}
#gameHud .game-menu .game-menu-list>*{opacity:0}
#gameHud .game-menu.open .game-menu-group.open>.game-menu-list>*{opacity:1;transition:opacity 60ms linear 70ms}
#gameHud .game-menu .game-menu-title{display:block;padding:3px 8px 5px;color:#eebb85;font:bold 12px/1.2 "Microsoft Sans Serif",Tahoma,sans-serif;letter-spacing:.5px;text-align:center;text-shadow:0 1px 2px #000}
/* Rows = the original buttons (ids / handlers / aria kept): PC window emblem (::before) + Thai label + hotkey. */
#gameHud .game-menu .game-menu-group .game-menu-list>button{position:relative;display:flex;flex:none;flex-direction:row;align-items:center;justify-content:flex-start;gap:7px;width:100%;min-width:0;min-height:30px;margin:0;padding:2px 9px 2px 5px!important;border:solid transparent;border-width:0;border-radius:0;border-image:url(ui/pc/menu/item-up.png) 0 10 fill/0 10px;background:none;box-shadow:none;color:#fff;font:13px/1.25 "Microsoft Sans Serif",Tahoma,"Segoe UI",sans-serif;letter-spacing:.3px;text-align:left;white-space:nowrap;text-shadow:0 1px 2px #000;transform:none;cursor:pointer}
#gameHud .game-menu .game-menu-group .game-menu-list>button:hover:enabled,#gameHud .game-menu .game-menu-group .game-menu-list>button:focus-visible,#gameHud .game-menu .game-menu-group .game-menu-list>button:active:enabled{border-color:transparent;border-image-source:url(ui/pc/menu/item-over.png);background:none;color:#fff}
#gameHud .game-menu .game-menu-group .game-menu-list>button:focus-visible{outline:1px solid #eed394;outline-offset:-2px}
#gameHud .game-menu .game-menu-group .game-menu-list>button[aria-expanded=true]{border-image-source:url(ui/pc/menu/item-over.png);color:#eebb85}
#gameHud .game-menu .game-menu-group .game-menu-list>button:disabled{color:#999;filter:grayscale(1);cursor:default}
#gameHud .game-menu .game-menu-group .game-menu-list>button[hidden]{display:none}
#gameHud .game-menu .game-menu-group .game-menu-list>button>span{flex:1 1 auto;font:inherit}
#gameHud .game-menu .game-menu-group .game-menu-list kbd{flex:none;min-width:14px;margin-left:auto;padding:1px 3px;border:1px solid #b2a8a540;border-radius:2px;background:#0006;color:#b2a8a5;font:11px/1.2 "Microsoft Sans Serif",Tahoma,sans-serif;text-align:center}
#gameHud .game-menu .game-menu-group .game-menu-list>button::before{content:"";flex:none;width:26px;height:26px;background:center/contain no-repeat}
#gameHud .game-menu .game-menu-list>#characterButton::before{background-image:url(ui/pc/menu/row-character.png)}
#gameHud .game-menu .game-menu-list>#bagButton::before{background-image:url(ui/pc/menu/row-inventory.png)}
#gameHud .game-menu .game-menu-list>#skillsButton::before{background-image:url(ui/pc/menu/row-skillbuild.png)}
#gameHud .game-menu .game-menu-list>#hotbarButton::before{background-image:url(ui/pc/menu/row-slotbar.png);background-size:auto 22px}
#gameHud .game-menu .game-menu-list>#partyButton::before{background-image:url(ui/pc/menu/row-raid.png)}
#gameHud .game-menu .game-menu-list>#questLogButton::before{background-image:url(ui/pc/menu/row-questlist.png)}
#gameHud .game-menu .game-menu-list>#sMatchingButton::before{background-image:url(ui/pc/menu/row-smartmatching.png)}
#gameHud .game-menu .game-menu-list>#arenaButton::before{background-image:url(ui/pc/menu/row-pvp.png)}
#gameHud .game-menu .game-menu-list>#travelButton::before{background-image:url(ui/pc/menu/row-worldmap.png)}
#gameHud .game-menu .game-menu-list>#helpButton::before{background-image:url(ui/pc/menu/row-help.png)}
#gameHud .game-menu .game-menu-list>#actionViewButton::before{background-image:url(ui/pc/menu/row-option.png)}
/* ออโต้ has no PC counterpart (research): an on/off lamp instead of an emblem; text / aria-pressed stay hotbar-editor's. */
#gameHud .game-menu .game-menu-list>#autoSkillButton::before{background:radial-gradient(circle,#8d8a86 0 4px,#2a2826 5px 6px,transparent 7px)}
#gameHud .game-menu .game-menu-list>#autoSkillButton[aria-pressed=true]::before{background:radial-gradient(circle,#e8fbff 0 2px,#41c3f0 4px,#0d5d7a 6px,#41c3f055 7px 9px,transparent 10px)}
#gameHud .game-menu .game-menu-list>#autoSkillButton[aria-pressed=true]{color:#bdeeff}
/* Touch: ≥44 px targets. */
body.touch-controls #gameHud .game-menu .game-menu-group .game-menu-list>button{min-height:44px;font-size:13px}
body.touch-controls #gameHud .game-menu .game-menu-group .game-menu-list>button::before{width:32px;height:32px}
body.touch-controls #gameHud .game-menu .game-menu-list{min-width:170px}
@media(max-width:720px){
 #gameHud nav.game-menu>button.game-menu-toggle{width:44px;height:44px}
 #gameHud .game-menu .game-menu-group>.game-menu-group-button{width:44px;height:48px;transform:translateX(calc(var(--gm-n)*46px)) scale(.55)}
}
@media(prefers-reduced-motion:reduce){
 #gameHud .game-menu *,#gameHud .game-menu *::before,#gameHud .game-menu *::after{transition:none!important;animation:none!important}
}

/* Round 15 review F2: an incoming party invitation (party-view.js .has-invitation) must stay visible with the list closed. */
#gameHud nav.game-menu:has(#partyButton.has-invitation)>button.game-menu-toggle{box-shadow:0 0 0 2px #efce7180,0 0 12px #efce71aa,0 2px 10px #000a}
#gameHud .game-menu .game-menu-group:has(#partyButton.has-invitation)>.game-menu-group-button{filter:drop-shadow(0 0 4px #efce71)}
#gameHud .game-menu .game-menu-list>#partyButton.has-invitation{border-image-source:url(ui/pc/menu/item-over.png);color:#efce71}
