/* Conversation layout is independent of the preserved parchment PNG.
   Text and rewards live in normal flow so authored dialogue can grow safely. */
#npcDialogue,
#npcInteractionMenu {
  box-sizing:border-box;
  position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:190;
  width:min(900px,calc(100vw - 32px));min-height:0;
  max-height:calc(100dvh - 40px);
  border:1px solid var(--ui-border,#71634e);
  border-radius:var(--ui-radius,16px);
  background:linear-gradient(135deg,#1b283bee,#0d1422fc 70%);
  color:var(--ui-text,#f1eee7);
  box-shadow:0 22px 64px #000b,inset 0 1px #ead09a20;
  font-family:var(--ui-font,system-ui,sans-serif);
  overflow:hidden;
}
#npcDialogue {display:flex;flex-direction:column;}
#npcDialogue.hidden,#npcInteractionMenu.hidden {display:none;}
#npcDialogue .npcDialogueShell {
  display:grid;grid-template-columns:150px minmax(0,1fr);
  align-items:start;gap:24px;min-height:0;
  padding:26px;overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:#71634e #0d1422;
}
#npcDialogue.noPortrait .npcDialogueShell,
#npcDialogue .npcDialogueShell:has(> .npcDialoguePortrait.hidden) {grid-template-columns:minmax(0,1fr);}
#npcDialogue .npcDialoguePortrait {
  position:sticky;top:0;align-self:start;justify-self:center;
  width:150px;height:208px;max-width:100%;max-height:208px;
  box-sizing:border-box;padding:10px 4px 0;
  object-fit:contain;object-position:center bottom;
  border:1px solid #ead09a35;border-radius:12px;
  background:radial-gradient(ellipse at 50% 60%,#52607a40,#0b121ee6 80%);
  filter:none;
}
#npcDialogue .npcDialogueContent {position:static;display:grid;gap:16px;padding:0;min-width:0;}
#npcDialogue .npcDialogueSpeaker {
  position:static;display:block;width:auto;height:auto;max-width:none;
  padding:0 38px 0 0;color:var(--ui-gold,#ead09a);
  font:700 24px/1.2 Georgia,"Times New Roman",serif;
  white-space:normal;overflow:visible;overflow-wrap:anywhere;text-shadow:none;
}
#npcDialogue .npcDialogueSpeaker::before {
  content:"CONVERSATION";display:block;margin-bottom:7px;
  color:var(--ui-muted,#bec8d8);
  font:700 10px/1.4 var(--ui-font,system-ui,sans-serif);letter-spacing:.16em;
}
#npcDialogue[data-mode="quest"] .npcDialogueSpeaker::before {content:"QUEST JOURNAL";}
#npcDialogue .npcDialogueText {
  min-height:0;margin:0;padding:0;border:0;border-radius:0;
  background:none;color:var(--ui-text,#f1eee7);
  font-size:16px;font-weight:400;line-height:1.65;
  text-shadow:none;white-space:pre-wrap;overflow-wrap:anywhere;
}
#npcDialogue .npcDialogueText.questResponse {
  padding:12px 16px;border-left:2px solid var(--ui-gold,#ead09a);
  border-radius:0 8px 8px 0;background:#ead09a09;
}
#npcDialogue .npcDialogueHint {
  display:block;margin:0;padding-top:12px;border-top:1px solid #46516a80;
  color:var(--ui-muted,#bec8d8);font-size:11px;font-weight:400;line-height:1.5;opacity:1;
}
#npcDialogue .npcDialogueClose,
#npcInteractionMenu .npcInteractionClose {
  position:absolute;top:14px;right:14px;z-index:4;
  display:grid;place-items:center;width:36px;height:36px;min-height:36px;padding:0;
  border:1px solid var(--ui-divider,#46516a);border-radius:8px;
  background:var(--ui-raised,#222e44);color:var(--ui-text,#f1eee7);
  box-shadow:none;font:500 18px/1 var(--ui-font,system-ui,sans-serif);cursor:pointer;
}
#npcDialogue .npcDialogueClose:hover,
#npcInteractionMenu .npcInteractionClose:hover {transform:none;background:#30405b;border-color:var(--ui-gold,#ead09a);}
#npcDialogue button:focus-visible,
#npcInteractionMenu button:focus-visible {outline:2px solid var(--ui-focus,#9ddfff);outline-offset:3px;}
#npcDialogue .npcDialogueQuestList {
  display:grid;gap:12px;max-height:none;overflow:visible;padding:0;
}
#npcDialogue .npcDialogueQuestList.hidden {display:none;}
#npcDialogue .npcQuestCard {
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:"head head" "detail detail" "objective objective" "reward action";
  align-items:start;gap:12px 18px;min-width:0;padding:18px;
  border:1px solid var(--ui-divider,#46516a);border-radius:12px;
  background:linear-gradient(130deg,#243249aa,#17213399);box-shadow:none;
}
#npcDialogue .npcQuestHead {display:flex;align-items:start;justify-content:space-between;gap:12px;}
#npcDialogue .npcQuestHead {grid-area:head;}
#npcDialogue .npcQuestDetail {grid-area:detail;}
#npcDialogue .npcQuestObjective {grid-area:objective;}
#npcDialogue .npcQuestReward {grid-area:reward;}
#npcDialogue .npcQuestCard>button {grid-area:action;}
#npcDialogue .npcQuestHead strong {
  min-width:0;color:var(--ui-text,#f1eee7);font-size:16px;font-weight:650;line-height:1.4;
  white-space:normal;overflow:visible;overflow-wrap:anywhere;text-overflow:clip;
}
#npcDialogue .npcQuestStatus {
  padding:4px 8px;border:1px solid #8293af66;border-radius:5px;
  color:#c8d6ed;background:#33456366;font-size:10px;line-height:1.4;
  font-weight:700;letter-spacing:.07em;
}
#npcDialogue .npcQuestCard[data-status="available"] .npcQuestStatus {color:#f2daa3;background:#9b7a2020;border-color:#9b7a2077;}
#npcDialogue .npcQuestCard[data-status="ready_to_turn_in"] {border-color:#72b99d99;}
#npcDialogue .npcQuestCard[data-status="ready_to_turn_in"] .npcQuestStatus {color:#afefd2;background:#39785b33;border-color:#72b99d88;}
#npcDialogue .npcQuestCard[data-status="completed"] .npcQuestStatus {color:#bec8d8;background:#46516a33;}
#npcDialogue .npcQuestDetail {
  margin:0;color:var(--ui-muted,#bec8d8);font-size:13px;font-weight:400;line-height:1.65;
  white-space:pre-wrap;overflow-wrap:anywhere;
}
#npcDialogue .npcQuestObjective {
  padding:10px 12px 10px 27px;border:1px solid #9ddfff22;border-radius:7px;
  background:#09152266;color:#d4e8fb;font-size:13px;font-weight:500;line-height:1.6;
  overflow-wrap:anywhere;
}
#npcDialogue .npcQuestObjective::before {left:11px;top:13px;color:#9ddfff;font-size:8px;}
#npcDialogue .npcQuestReward {
  display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:8px;
  min-width:0;padding:0;border:0;
}
#npcDialogue .npcQuestRewardLabel {color:var(--ui-muted,#bec8d8);font-size:10px;line-height:1.5;letter-spacing:.1em;font-weight:600;}
#npcDialogue .npcQuestRewardItems {display:flex;flex-wrap:wrap;gap:6px;min-width:0;}
#npcDialogue .npcQuestRewardChip {
  box-sizing:border-box;max-width:100%;min-height:26px;padding:4px 8px;
  border:1px solid #ead09a33;border-radius:6px;background:#ead09a09;
  color:var(--ui-gold,#ead09a);font-size:12px;line-height:1.45;font-weight:500;
  white-space:normal;overflow-wrap:anywhere;
}
#npcDialogue .npcQuestCard button {
  align-self:end;min-width:116px;min-height:42px;padding:10px 16px;
  border:1px solid #ecd3a0;border-radius:8px;
  background:linear-gradient(180deg,#ecd3a0,#bda16b);color:#172033;
  font:700 13px/1.5 var(--ui-font,system-ui,sans-serif);box-shadow:none;
}
#npcDialogue .npcQuestCard button:hover:not(:disabled) {transform:none;background:#f5deb1;filter:none;}
#npcDialogue .npcQuestCard button:disabled {
  opacity:1;color:var(--ui-muted,#bec8d8);border-color:var(--ui-divider,#46516a);
  background:#182235;cursor:default;
}

/* The initial Talk / Quest / Shop choice uses the same visual hierarchy. */
#npcInteractionMenu {
  width:min(760px,calc(100vw - 32px));display:grid;
  grid-template-columns:132px minmax(0,1fr);gap:22px;padding:24px;
  overflow-y:auto;overscroll-behavior:contain;
}
#npcInteractionMenu::before {display:none;}
#npcInteractionMenu.noPortrait {grid-template-columns:minmax(0,1fr);}
#npcInteractionMenu .npcInteractionPortraitFrame {
  min-height:178px;border-color:#ead09a35;border-radius:12px;
  background:radial-gradient(ellipse at 50% 60%,#52607a40,#0b121ee6 80%);
}
#npcInteractionMenu .npcInteractionPortraitFrame::after {display:none;}
#npcInteractionMenu .npcInteractionPortrait {max-width:122px;max-height:178px;}
#npcInteractionMenu .npcInteractionContent {gap:10px;padding:0;min-width:0;}
#npcInteractionMenu .npcInteractionEyebrow {font-size:10px;line-height:1.5;color:var(--ui-muted,#bec8d8);letter-spacing:.16em;}
#npcInteractionMenu .npcInteractionName {padding-right:28px;font-size:24px;line-height:1.25;color:var(--ui-gold,#ead09a);text-shadow:none;overflow-wrap:anywhere;}
#npcInteractionMenu .npcInteractionGreeting {
  margin:0;color:var(--ui-text,#f1eee7);font-size:14px;font-weight:400;line-height:1.6;
  white-space:pre-wrap;overflow-wrap:anywhere;
}
#npcInteractionMenu .npcInteractionActions {grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-top:4px;}
#npcInteractionMenu .npcInteractionAction {
  grid-template-columns:30px minmax(0,1fr);gap:9px;min-height:66px;padding:10px;
  border:1px solid var(--ui-divider,#46516a);border-radius:8px;
  background:var(--ui-raised,#222e44);box-shadow:none;color:var(--ui-text,#f1eee7);
}
#npcInteractionMenu .npcInteractionAction:hover {transform:none;background:#30405b;border-color:var(--ui-gold,#ead09a);box-shadow:none;}
#npcInteractionMenu .npcInteractionActionIcon {width:30px;height:30px;border-radius:6px;color:var(--ui-gold,#ead09a);font-size:16px;}
#npcInteractionMenu .npcInteractionAction strong {font-size:13px;line-height:1.4;font-weight:650;}
#npcInteractionMenu .npcInteractionAction small {
  display:block;margin-top:3px;overflow:visible;white-space:normal;text-overflow:clip;
  color:var(--ui-muted,#bec8d8);font-size:11px;font-weight:400;line-height:1.4;
}
#npcInteractionMenu .npcInteractionHint {margin:2px 0 0;color:var(--ui-muted,#bec8d8);font-size:11px;font-weight:400;line-height:1.5;letter-spacing:0;}

/* Keep quest progress clear of the minimap in the upper-left corner. */
#questTracker {left:auto;right:16px;top:64px;width:min(300px,34%);padding:14px 16px;background:#101a2bee;border-color:#ead09a55;}
#questTracker .questTrackerHead {gap:5px;}
#questTracker .questTrackerHead span {font-size:10px;color:var(--ui-gold,#ead09a);}
#questTracker .questTrackerHead strong {font-size:14px;line-height:1.4;font-weight:650;overflow-wrap:anywhere;}
#questTracker .questTrackerTask {font-size:12px;line-height:1.55;font-weight:400;color:var(--ui-text,#f1eee7);overflow-wrap:anywhere;}
#questTracker .questTrackerProgress {font-size:12px;line-height:1.5;}
/* The tracker passes clicks through to the world, but its actions must remain
   interactive and must not inherit a native pale button face with white text. */
#questTracker > button:not([hidden]) {
  appearance:none;display:inline-flex;align-items:center;justify-content:center;
  min-height:34px;max-width:100%;margin:10px 8px 0 0;padding:7px 12px;
  border:1px solid var(--ui-border,#71634e);border-radius:7px;
  background:var(--ui-raised,#222e44);color:var(--ui-gold,#ead09a);
  font:600 12px/1.35 var(--ui-font,system-ui,sans-serif);text-align:center;text-shadow:none;
  box-shadow:inset 0 1px 0 #ffffff0a;pointer-events:auto;cursor:pointer;
  transition:background .14s,border-color .14s;
}
#questTracker > button:hover:not(:disabled) {
  background:#30405b;color:#fff0d0;border-color:var(--ui-gold,#ead09a);transform:none;filter:none;
}
#questTracker > button:active:not(:disabled) {background:#17243b;color:#fff0d0;}
#questTracker > button:focus-visible {outline:2px solid var(--ui-focus,#9ddfff);outline-offset:3px;}
#questTracker > button:disabled {
  background:#1b2537;color:#adb8c9;border-color:var(--ui-divider,#46516a);
  opacity:1;cursor:not-allowed;box-shadow:none;filter:none;
}

.gameFrame:has(:is(#npcDialogue,#npcInteractionMenu):not(.hidden)) :is(.combatAbilityDock,#exploreHudQuickDock,#runToggleButton) {visibility:hidden;}
body:has(:is(#npcDialogue,#npcInteractionMenu):not(.hidden)) #wizardAudioControls {visibility:hidden;}

@media(max-width:760px) {
  #npcDialogue,#npcInteractionMenu {bottom:12px;width:calc(100vw - 24px);max-height:calc(100dvh - 24px);}
  #npcDialogue .npcDialogueShell {grid-template-columns:88px minmax(0,1fr);gap:16px;padding:20px;}
  #npcDialogue .npcDialoguePortrait {width:88px;height:130px;max-height:130px;}
  #npcDialogue .npcDialogueSpeaker {font-size:21px;}
  #npcDialogue .npcDialogueText {font-size:14px;}
  #npcDialogue .npcQuestCard {padding:14px;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "detail" "objective" "reward" "action";}
  #npcDialogue .npcQuestCard button {width:100%;}
  #npcInteractionMenu {grid-template-columns:88px minmax(0,1fr);gap:16px;padding:20px;}
  #npcInteractionMenu .npcInteractionPortraitFrame {min-height:128px;}
  #npcInteractionMenu .npcInteractionPortrait {max-width:86px;max-height:126px;}
  #npcInteractionMenu .npcInteractionName {font-size:21px;}
  #questTracker {right:10px;top:60px;padding:10px 12px;width:min(270px,40%);}
}
@media(max-width:520px) {
  #npcDialogue .npcDialogueShell {display:block;padding:20px;}
  #npcDialogue .npcDialoguePortrait {display:none;}
  #npcDialogue .npcQuestHead {flex-wrap:wrap;gap:6px;}
  #npcInteractionMenu {grid-template-columns:minmax(0,1fr);}
  #npcInteractionMenu .npcInteractionPortraitFrame {display:none;}
  #npcInteractionMenu .npcInteractionActions {grid-template-columns:minmax(0,1fr);}
  #npcInteractionMenu .npcInteractionAction {min-height:54px;}
  #questTracker {width:min(230px,46%);padding:8px 10px;}
}
@media(max-height:480px) {
  #npcDialogue,#npcInteractionMenu {bottom:8px;max-height:calc(100dvh - 16px);}
  #npcDialogue .npcDialogueShell,#npcInteractionMenu {padding:16px;}
}
@media(prefers-reduced-motion:reduce) {
  #npcDialogue *,#npcInteractionMenu *,#questTracker > button {transition:none;scroll-behavior:auto;}
}
