/* Party: in-game party panel (party-panel.js), same-room invite toasts, the
   right-click "Invite to party" menu and the lobby card's level note. */
#partyPanelHud[hidden], #partyInviteToasts[hidden], #partyContextMenu[hidden], .partyHudPanel [hidden], .partyContextMenu [hidden], .partyLevelNote[hidden] { display:none!important; }

/* Lobby card (party-ui.js) */
.partyLevelNote{flex-basis:100%;margin:0;color:#e6ca83;font-size:11px;letter-spacing:.02em}
.partyMember small{overflow-wrap:anywhere}

/* In-game panel: sits under the Menu button; the world keeps running behind it. */
#partyPanelHud{
  position:absolute;top:60px;right:12px;z-index:38;width:min(340px,calc(100% - 24px));max-height:calc(100% - 96px);
  overflow:auto;box-sizing:border-box;padding:14px;border:1px solid #a18b6377;border-radius:12px;
  background:linear-gradient(145deg,#23303c,#111b28);color:#f0e5cf;box-shadow:0 14px 48px #0009;
  font:13px/1.5 system-ui,sans-serif;overscroll-behavior:contain;
}
#partyPanelHud *{box-sizing:border-box}
.partyHudHead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.partyHudTitle{display:flex;align-items:center;gap:9px}
.partyHudTitle strong{font:700 20px/1.2 Georgia,serif}
.partyHudBadge{font-size:10px;font-weight:900;letter-spacing:.12em;border:1px solid #765a96;border-radius:999px;padding:4px 8px;color:#e8daf8;background:rgba(122,88,159,.2)}
.partyHudClose{min-height:34px;padding:5px 9px;border:1px solid #9baac331;border-radius:7px;background:transparent;color:#c6c9ce;font:700 13px system-ui;cursor:pointer}
.partyHudStatus{margin:0 0 10px;padding:8px 10px;border-radius:7px;background:#2b3747;color:#e9d4aa;font-size:12px;overflow-wrap:anywhere}
.partyHudStatus[data-kind="error"]{background:#4a2a2f;color:#f6c7c7}
.partyHudStatus[data-kind="notice"]{background:#25403a;color:#d3ecd4}
.partyHudSection{margin-top:10px;padding-top:10px;border-top:1px solid #b8ae8b26}
.partyHudSection h3{margin:0 0 7px;font:700 11px/1.4 system-ui;letter-spacing:.1em;text-transform:uppercase;color:#c4b78e}
.partyHudMembers,.partyHudNearby,.partyHudInvites{display:grid;gap:6px}
.partyHudMember,.partyHudNearbyRow,.partyHudInviteRow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid #9baac331;border-radius:7px;background:#2b3747}
.partyHudMember.offline{opacity:.55}
.partyHudMemberCopy{display:grid;gap:2px;min-width:0}
.partyHudMemberCopy strong{display:flex;align-items:center;gap:7px;min-width:0;font-size:13px;overflow-wrap:anywhere}
.partyHudMemberCopy small{font-size:11px;color:#b4c0d4;overflow-wrap:anywhere}
.partyHudLeaderMark{font-size:9px;font-weight:900;letter-spacing:.08em;padding:2px 6px;border:1px solid #cdb889aa;border-radius:999px;color:#f3dfb2;white-space:nowrap}
.partyHudActions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.partyHudButton,.partyHudKick,.partyHudInvite,.partyContextInvite{min-height:34px;padding:6px 11px;border:1px solid #9baac331;border-radius:7px;background:#344254;color:#eee9df;font:600 12px/1.35 system-ui;cursor:pointer}
.partyHudButton.primary,.partyContextInvite{border-color:#cdb889;background:#3a4a3c;color:#f3dfb2}
.partyHudKick{padding:5px 9px;font-size:11px;color:#f6c7c7}
.partyHudButton:disabled,.partyHudInvite:disabled,.partyContextInvite:disabled{opacity:.45;cursor:default}
.partyHudCode{font-size:11px;letter-spacing:.12em;color:#c4b78e}
.partyHudReason{flex-basis:100%;font-size:11px;color:#e6ca83}
.partyHudEmpty,.partyHudHint{margin:0;color:#aab7c4;font-size:11px}
.partyHudHint{margin-top:12px}
.partyHudInviteRow{flex-wrap:wrap}
.partyHudInviteText{flex:1 1 160px;font-size:12px;overflow-wrap:anywhere}
.partyHudInviteActions{display:flex;gap:6px}
#partyPanelHud button:hover:not(:disabled){background:#3f4f62;border-color:#cdb889}
#partyPanelHud button:focus-visible,#partyContextMenu button:focus-visible,.partyInviteToast button:focus-visible{outline:2px solid #f1d79b;outline-offset:2px}

/* Invitation toasts: centred under the notification lane, above HUD widgets. */
#partyInviteToasts{position:absolute;left:50%;top:96px;z-index:40;display:grid;gap:8px;width:min(400px,calc(100% - 24px));transform:translateX(-50%);pointer-events:none}
#partyInviteToasts.partyInviteToastsFixed{position:fixed}
.partyInviteToast{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;padding:10px 12px;border:1px solid #cdb889aa;border-radius:10px;background:linear-gradient(145deg,#2a3a3cf2,#14212df2);color:#f0e5cf;box-shadow:0 10px 30px #0008;font:600 12px/1.4 system-ui;pointer-events:auto}
.partyInviteToastText{flex:1 1 180px;overflow-wrap:anywhere}
.partyInviteToastActions{display:flex;gap:6px}
.partyInviteToast button{min-height:32px;padding:5px 10px;border:1px solid #9baac331;border-radius:7px;background:#344254;color:#eee9df;font:600 12px system-ui;cursor:pointer}
.partyInviteToast .partyInviteAccept{border-color:#cdb889;background:#3a4a3c;color:#f3dfb2}

/* Right-click menu on a wizard in the world. */
#partyContextMenu{position:fixed;z-index:60;display:grid;gap:4px;min-width:200px;max-width:232px;padding:9px;border:1px solid #a18b6377;border-radius:9px;background:linear-gradient(145deg,#23303c,#111b28);color:#f0e5cf;box-shadow:0 12px 36px #0009;font:12px/1.4 system-ui}
.partyContextName{font-size:13px;overflow-wrap:anywhere}
.partyContextLevel{color:#b4c0d4;font-size:11px}
.partyContextInvite{margin-top:4px;width:100%;text-align:left}
.partyContextReason{color:#e6ca83;font-size:11px}

@media(max-width:740px){
  #partyPanelHud{top:56px;right:8px;left:8px;width:auto;max-height:calc(100% - 150px);padding:10px}
  #partyInviteToasts{top:64px}
}

/* Phones: invites are a count on Menu and on its Party entry (party-panel.js),
   never a toast over the battlefield. */
body.touchDevice #partyInviteToasts{display:none!important}
body.touchDevice :is(#hudMenuButton,#explorePartyHudButton)[data-party-invites]::after{
  content:attr(data-party-invites);position:absolute;z-index:1;top:-7px;right:-7px;min-width:20px;height:20px;padding:0 5px;
  box-sizing:border-box;border-radius:10px;background:#d6b777;box-shadow:0 0 0 2px #0d1928;color:#14100a;
  font:800 11px/20px system-ui,sans-serif;text-align:center;pointer-events:none
}
body.touchDevice #explorePartyHudButton[data-party-invites]{position:relative}
/* In the Menu dialog, hud-layout.css clears every prompt button's ::after with
   !important (old focus art); the invite count on Party is the one exception.
   The focus art's inset and border never stretch the count. */
body.touchDevice #explorePartyHudButton[data-party-invites]::after{left:auto;bottom:auto;border:0}
body.touchDevice #hudMenuPanel #explorePartyHudButton[data-party-invites]::after{content:attr(data-party-invites)!important}
/* The panel keeps clear of the ability arc: a sheet on the left in landscape,
   above the thumb controls in portrait. Buttons are at least 44px tall. */
body.touchDevice.mobileMatchMode #partyPanelHud{
  top:calc(var(--mobile-safe-top,0px) + 60px);left:var(--mobile-gutter-left,24px);right:auto;
  width:min(340px,calc(100vw - var(--mobile-gutter-left,24px) - var(--mobile-gutter-right,24px)));
  max-height:calc(100dvh - var(--mobile-safe-top,0px) - 60px - var(--mobile-control-bottom,32px) - var(--mobile-actions-height,174px) - 12px);
  padding:10px
}
@media(orientation:landscape){
  body.touchDevice.mobileMatchMode #partyPanelHud{
    width:min(340px,calc(100vw - var(--mobile-gutter-left,24px) - var(--mobile-gutter-right,24px) - var(--mobile-orbit-width,210px) - 24px));
    max-height:calc(100dvh - var(--mobile-safe-top,0px) - 60px - var(--mobile-safe-bottom,0px) - 28px)
  }
}
body.touchDevice.mobileMatchMode #partyPanelHud :is(.partyHudButton,.partyHudKick,.partyHudInvite,.partyHudClose){min-height:44px;min-width:44px}
body.touchDevice.mobileMatchMode #partyPanelHud .partyHudKick{padding:6px 12px}