/* Single mentor conversation, teaching hints, and narrow-screen fit. */
/* Only one active supporter speaks; the table has no duplicate advice panel. */
.dialogue-panel .coach-dialogue {
  overflow:visible;
  position:relative;
  gap:6px;
  padding-bottom:35px;
}
.coach-dialogue .spoken-line {
  position:relative;
  flex:0 0 auto;
  min-width:0;
  overflow:visible;
  white-space:normal;
  overflow-wrap:anywhere;
}
.coach-dialogue .speech-measure {
  display:block;
  visibility:hidden;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.coach-dialogue .speech-typed {
  position:absolute;
  inset:0;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.coach-dialogue .coach-waiting-tiles {
  flex:0 0 auto;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px;
  opacity:0;
  min-width:0;
  margin-top:1px;
  transition:opacity .15s ease;
}
.coach-dialogue.progress-complete .coach-waiting-tiles {opacity:1;}
.coach-dialogue .coach-waiting-tiles .discard-tile {
  width:27px;
  height:35px;
  font-size:16px;
}
.coach-dialogue .coach-waiting-tiles .discard-tile .sub {font-size:8px;}
.coach-dialogue .coach-more {
  font-size:11px;
  color:#d8e7c3;
  line-height:1.4;
}
@media (max-width:720px) and (orientation:portrait) {
  .dialogue-panel {height:clamp(215px,26dvh,245px);min-height:215px;max-height:245px;}
  .dialogue-panel .coach-dialogue {padding-bottom:7px;gap:5px;}
  .dialogue-panel .coach-dialogue .hint {padding-top:4px;}
  .coach-dialogue .coach-waiting-tiles .discard-tile {width:25px;height:32px;font-size:14px;}
  .coach-dialogue .coach-more {font-size:10px;}
}
@media (max-width:360px) and (orientation:portrait) {
  .dialogue-panel {height:clamp(211px,29dvh,230px);min-height:211px;max-height:230px;}
  .dialogue-panel .coach-dialogue {gap:3px;}
  .coach-dialogue .coach-waiting-tiles .discard-tile {width:22px;height:29px;font-size:13px;}
}
@media (max-height:480px) and (orientation:landscape) {
  .dialogue-panel .coach-hero {flex:0 1 32%;}
  .dialogue-panel .coach-dialogue {gap:3px;padding-bottom:7px;}
  .dialogue-panel .coach-dialogue .hint {padding-top:4px;}
  .coach-dialogue .coach-waiting-tiles .discard-tile {width:20px;height:27px;font-size:12px;}
  .coach-dialogue .coach-more {font-size:9px;}
}
@media (prefers-reduced-motion:reduce) {
  .coach-dialogue .coach-waiting-tiles {transition:none;}
}
/* Keep the help affordance visible beside the supporter, not over the dialogue. */
.dialogue-panel .coach-dialogue {overflow:visible;}
@media (max-width:720px) and (orientation:portrait) {
  .dialogue-panel .coach-hero .coach-nameplate {bottom:43px;}
}
@media (max-height:480px) and (orientation:landscape) {
  .dialogue-panel .mentor-help {bottom:8px;right:8px;left:auto;}
}
@media (max-width:720px) and (orientation:portrait) {
  /* Only enlarge the conversation for real ron/riichi/kan decisions. */
  .dialogue-panel:has(.turn-actions .action) {
    height:clamp(266px,36dvh,305px);
    min-height:266px;
    max-height:305px;
  }
}

/* Advice is a concrete choice with a visual tile and a stated purpose. */
.coach-dialogue .coach-recommend {
  flex:0 0 auto;display:flex;align-items:center;gap:8px;
  border:1px solid #bbaa73a0;border-radius:7px;
  background:#324934;padding:4px 7px;width:max-content;max-width:100%;
}
.coach-recommend>span {font-size:11px;font-weight:750;color:#ffdf9a;line-height:1.35;}
.coach-recommend .discard-tile {width:28px;height:36px;font-size:15px;box-shadow:0 2px 0 #bac7ae;}
.coach-waiting-tiles {position:relative;}
.coach-waiting-tiles:before {
  content:'引くと進む牌';display:block;flex:0 0 100%;
  font-size:10px;line-height:1.15;letter-spacing:.03em;color:#bcd7be;
}
@media (max-width:720px) and (orientation:portrait) {
  .dialogue-panel:has(.coach-recommend) {
    height:clamp(259px,33dvh,291px);
    min-height:259px;max-height:291px;
  }
  .dialogue-panel .coach-dialogue {gap:4px;}
  .coach-dialogue .coach-recommend {padding:3px 6px;gap:5px;}
  .coach-recommend>span {font-size:10px;}
  .coach-recommend .discard-tile {width:24px;height:31px;font-size:13px;}
}
@media (max-width:360px) and (orientation:portrait) {
  .dialogue-panel:has(.coach-recommend) {
    height:clamp(249px,40dvh,275px);
    min-height:249px;max-height:275px;
  }
  .coach-recommend .discard-tile {width:21px;height:28px;}
}
@media (max-height:480px) and (orientation:landscape) {
  .coach-dialogue .coach-recommend {padding:2px 5px;gap:5px;}
  .coach-recommend .discard-tile {width:19px;height:26px;font-size:12px;}
  .coach-recommend>span,.coach-waiting-tiles:before {font-size:9px;}
}
