/* V1.128: approved two-line ADV, inset narrative grid, smaller type and reduced pure-narrative HUD. */
.wq-dialogue-readability :is(p, .dialogue-text, #dialogue, #advText, #storyText, #visitText, #interventionText, #cinematic-line) {
  line-break: strict;
  word-break: normal;
  overflow-wrap: normal;
}

.wq-dialogue-line { white-space: nowrap; }
.wq-dialogue-line-visible,
.wq-dialogue-line-reserved { white-space: pre; }
.wq-dialogue-line-reserved {
  visibility: hidden;
  pointer-events: none;
  user-select: none;
}

.wq-readability-surface,
.wq-readability-surface:is(#advBox, #adv-box, #dialogue-box, .story-dialogue-box, .adv__tap) {
  background: transparent !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* Narrative advance is an invisible behavior layer, never a pressed button. */
:is(.wq-readability-surface, [data-wq-narrative-advance-surface]):active {
  transform: none !important;
  translate: none !important;
  scale: none !important;
  rotate: none !important;
  filter: none !important;
  opacity: 1 !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.wq-readability-self {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.wq-readability-shade { background: none !important; }

/* Pure dialogue/narration keeps only exit and narrative playback controls in the top safe area. */
html.wq-pure-narrative-active :is(.topbar, .hud, #hud, .status-hud, .game-banner, .story-hud) > :not(
  [data-wq-narrative-keep],
  [data-prev],
  [aria-label^="返回"],
  [aria-label*="退出"],
  #backButton,
  #back-button,
  .back-button,
  .hud-back,
  .hud__back,
  .story-quick-actions,
  .story-tools,
  .story-actions,
  .story-controls,
  .story-hud__quick
  ,.wq-hud-layer
) {
  visibility: hidden !important;
  pointer-events: none !important;
}

html.wq-pure-narrative-active :is(.cinematic-topline, .cinematic-progress) {
  visibility: hidden !important;
  pointer-events: none !important;
}

/* The shared mask owns this pseudo-element after migration. */
.adv.wq-dialogue-readability::before,
.visit-adv.wq-dialogue-readability::before,
.intervention-adv.wq-dialogue-readability::before,
.dialogue-wrap.wq-dialogue-readability::before { display: block !important; }

/* Keep the speaker anchor and the two-line reading field stable for every ADV beat. */
.wq-dialogue-fixed-layout .wq-dialogue-fixed-speaker {
  display: block !important;
  box-sizing: border-box !important;
  height: var(--wq-dialogue-speaker-height, 1.2em) !important;
  min-height: var(--wq-dialogue-speaker-height, 1.2em) !important;
  max-height: var(--wq-dialogue-speaker-height, 1.2em) !important;
  overflow: hidden !important;
  flex: 0 0 var(--wq-dialogue-speaker-height, 1.2em) !important;
}

:is(
  #advWrap.wq-dialogue-fixed-layout,
  #adv-wrap.wq-dialogue-fixed-layout,
  #narrativePanel.wq-dialogue-fixed-layout,
  .dialogue-wrap.wq-dialogue-fixed-layout,
  #story-caption.wq-dialogue-fixed-layout,
  #advLayer .adv__tap.wq-dialogue-fixed-layout,
  #adv.wq-dialogue-fixed-layout,
  #visitAdv.wq-dialogue-fixed-layout,
  #interventionAdv.wq-dialogue-fixed-layout,
  #interactionNarrative.wq-dialogue-fixed-layout,
  [data-story-dialogue].wq-dialogue-fixed-layout
) {
  left: clamp(82px, 22vw, 430px) !important;
  right: clamp(74px, 13vw, 270px) !important;
  width: auto !important;
  max-width: none !important;
}

.wq-dialogue-fixed-layout .wq-dialogue-fixed-speaker {
  margin-bottom: 12px !important;
  color: #e4bd6e !important;
  font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", STSong, serif !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 21.6px !important;
}

.wq-dialogue-fixed-layout .wq-dialogue-fixed-speaker[data-wq-empty="true"] {
  visibility: hidden !important;
  opacity: 0 !important;
}

.wq-dialogue-fixed-layout .wq-dialogue-fixed-body {
  display: block !important;
  box-sizing: content-box !important;
  height: 76px !important;
  min-height: 76px !important;
  max-height: 76px !important;
  overflow: hidden !important;
  align-content: flex-start !important;
  appearance: none !important;
}

#advWrap.wq-dialogue-fixed-layout #advText.wq-dialogue-fixed-text,
.wq-dialogue-fixed-layout .wq-dialogue-fixed-text {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: top;
  color: #f3efe8 !important;
  font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", STSong, serif !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 38px !important;
}

/* Canonical selectors are also reserved directly, so page scripts may replace classes safely. */
:is(
  #advWrap #advName,
  #advWrap .speaker-tab,
  #adv-wrap #speaker-tab,
  #narrativePanel .speaker-tab,
  .dialogue-wrap .dialogue-name,
  #story-caption .cinematic-speaker,
  #advLayer .adv__name,
  #adv > .speaker,
  #visitAdv > .speaker,
  #interventionAdv > .speaker,
  [data-story-dialogue] .character-name
) {
  display: block !important;
  box-sizing: border-box !important;
  height: 21.6px !important;
  min-height: 21.6px !important;
  max-height: 21.6px !important;
  overflow: hidden !important;
}

@media (max-width: 1000px), (max-height: 560px) {
  /* Keep visible narrative copy away from compact-landscape screen edges. */
  :is(
    #advWrap.wq-dialogue-fixed-layout,
    #adv-wrap.wq-dialogue-fixed-layout,
    #narrativePanel.wq-dialogue-fixed-layout,
    .dialogue-wrap.wq-dialogue-fixed-layout,
    #story-caption.wq-dialogue-fixed-layout,
    #advLayer .adv__tap.wq-dialogue-fixed-layout,
    #adv.wq-dialogue-fixed-layout,
    #visitAdv.wq-dialogue-fixed-layout,
    #interventionAdv.wq-dialogue-fixed-layout,
    #interactionNarrative.wq-dialogue-fixed-layout,
    [data-story-dialogue].wq-dialogue-fixed-layout
  ) {
    right: auto !important;
    bottom: max(56px, calc(env(safe-area-inset-bottom, 0px) + 24px)) !important;
    left: max(64px, calc(env(safe-area-inset-left, 0px) + 36px), 16vw) !important;
    width: auto !important;
    max-width: none !important;
    right: max(24px, calc(env(safe-area-inset-right, 0px) + 14px), 4vw) !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  :is(
    #advWrap #advName,
    #advWrap .speaker-tab,
    #adv-wrap #speaker-tab,
    #narrativePanel .speaker-tab,
    .dialogue-wrap .dialogue-name,
    #story-caption .cinematic-speaker,
    #advLayer .adv__name,
    #adv > .speaker,
    #visitAdv > .speaker,
    #interventionAdv > .speaker,
    [data-story-dialogue] .character-name
  ) {
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    margin-bottom: 8px !important;
    font-size: 14px !important;
    line-height: 16.8px !important;
  }

  .wq-dialogue-fixed-layout .wq-dialogue-fixed-body {
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
  }

  #advWrap.wq-dialogue-fixed-layout #advText.wq-dialogue-fixed-text,
  .wq-dialogue-fixed-layout .wq-dialogue-fixed-text {
    font-size: 16px !important;
    line-height: 28px !important;
  }
}

:is(
  #advWrap #advBox,
  #advWrap .adv-box,
  #adv-wrap #adv-box,
  #narrativePanel #dialogue,
  .dialogue-wrap #dialogue-box,
  #story-caption .story-dialogue-box,
  #advLayer #advText,
  #adv > p,
  #visitAdv > p,
  #interventionAdv > p,
  #interactionNarrative button,
  [data-story-dialogue] .dialogue-text
) {
  display: block !important;
  box-sizing: content-box !important;
  height: 76px !important;
  min-height: 76px !important;
  max-height: 76px !important;
  overflow: hidden !important;
  align-content: flex-start !important;
  appearance: none !important;
}

:is(
  #advWrap.narration #advName,
  #advWrap.narration .speaker-tab,
  #adv-wrap.narration #speaker-tab,
  #narrativePanel.narration .speaker-tab,
  #adv[data-mode="narration"] > .speaker,
  #adv[data-mode="record"] > .speaker,
  #interventionAdv[data-mode="narration"] > .speaker,
  [data-story-dialogue] .character-name:empty
) {
  visibility: hidden !important;
  opacity: 0 !important;
}

@media (max-width: 1000px), (max-height: 560px) {
  :is(
    #advWrap #advBox,
    #advWrap .adv-box,
    #adv-wrap #adv-box,
    #narrativePanel #dialogue,
    .dialogue-wrap #dialogue-box,
    #story-caption .story-dialogue-box,
    #advLayer #advText,
    #adv > p,
    #visitAdv > p,
    #interventionAdv > p,
    #interactionNarrative button,
    [data-story-dialogue] .dialogue-text
  ) {
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
  }
}
