/* ==========================================================================
 * HỘP THOẠI SỰ KIỆN NGẪU NHIÊN — cùng ngôn ngữ với các popup khác của game:
 * viền mực dày, dải tiêu đề cam sọc, nút 3D theo màu, chip kết quả bo góc viền mực.
 * ========================================================================== */
.modal.lx-talk, body.portrait .modal.lx-talk { width: min(440px, 100%); padding: 0 0 16px; overflow-x: hidden; text-align: left; }
.lx-talk > * { margin-left: 14px; margin-right: 14px; }

/* Dải tiêu đề (có/không có nhân vật nói) */
.lx-talk > h2, .lx-talk > .lx-talk-head {
  margin: 0 0 12px; padding: 11px 16px 10px; color: #fff; text-shadow: 0 2px 0 rgba(0, 0, 0, .3);
  background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .14) 0 9px, transparent 9px 18px), linear-gradient(#ffa53d, #f07b12);
  border-bottom: 3px solid var(--ink);
}
.lx-talk > h2 { justify-content: center; font-size: 22px; line-height: 1.15; }
.lx-talk > h2 .pxi { height: 26px; filter: drop-shadow(0 2px 0 rgba(0, 0, 0, .35)); }
.lx-talk > .lx-talk-head { margin-bottom: 12px; gap: 12px; }
.lx-talk .lx-talk-head small { color: rgba(255, 255, 255, .9); text-shadow: 0 1px 0 rgba(0, 0, 0, .3); }
.lx-talk .lx-talk-head b { font-size: 21px; }
.lx-talk .lx-talk-head img { box-shadow: 0 2px 0 var(--ink); }

/* Lời thoại */
.lx-talk .lx-speech { margin-bottom: 12px; padding: 10px 13px; font-size: 14px; font-weight: 600; line-height: 1.5; background: #fffdf3; border: 2.5px solid var(--ink); border-radius: 14px; box-shadow: 0 3px 0 var(--ink); }

/* Đang xảy ra: nhãn tím tối + chip hiệu ứng */
.lx-talk .lx-event-context { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; padding: 6px 8px; border: 2px dashed #cfae6e; border-radius: 12px; background: var(--paper-2); }
.lx-talk .lx-event-context > small { margin: 0; padding: 2px 8px; border-radius: 999px; background: var(--bar); color: var(--bar-text); font: 800 10px var(--display); letter-spacing: .8px; }
.lx-talk .lx-event-context .lx-chips { margin: 0; }

/* Lựa chọn: nút 3D màu giống mọi nút khác của game, kết quả nằm ngay dưới nhãn */
.lx-talk .lx-choices { gap: 11px; }
.lx-talk .lx-choice { align-items: stretch; justify-content: flex-start; gap: 7px; padding: 9px 10px 10px; text-align: left; border-width: 2px; border-radius: 14px;
  box-shadow: 0 4px 0 var(--lip), 0 7px 12px rgba(42, 28, 28, .18), inset 0 1px 0 rgba(255, 255, 255, .35); }
.lx-talk .lx-choice:active:not(:disabled) { transform: translateY(3px); box-shadow: 0 1px 0 var(--lip), inset 0 1px 0 rgba(255, 255, 255, .25); }
.lx-talk .lx-choice:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
.lx-talk .lx-choice:disabled { opacity: .7; }
.lx-talk .lx-choice-label { display: flex; align-items: center; gap: 9px; width: 100%; font: 800 16px/1.2 var(--display); }
.lx-talk .lx-choice-label > span:nth-child(2) { flex: 1 1 auto; min-width: 0; }
.lx-talk .lx-choice-number { display: block; text-align: center; flex: 0 0 25px; width: 25px; height: 25px; line-height: 21px; border: 2px solid var(--ink); border-radius: 50%; background: #fff; color: var(--ink); font: 800 12px/21px var(--display); text-shadow: none; }
.lx-talk .lx-choice-label > small { margin-left: auto; flex: 0 0 auto; font: 800 11px var(--display); color: inherit; }
.lx-talk .lx-choice-arrow { margin-left: auto; flex: 0 0 auto; font-size: 26px; line-height: 20px; color: inherit; opacity: .9; }

/* Chip kết quả: nền trắng, viền mực theo màu — đọc rõ trên mọi màu nút */
.lx-talk .lx-chips { justify-content: flex-start; gap: 5px; margin: 0; }
.lx-talk .lx-chip { padding: 3px 8px; border: 1.5px solid var(--ink); border-radius: 8px; background: #fff; color: var(--ink); box-shadow: none; text-shadow: none; font: 700 12px/1.35 var(--font); font-variant-numeric: tabular-nums; }
.lx-talk .lx-chip.good { background: #e8f8de; border-color: #2f8034; color: #1d5a22; }
.lx-talk .lx-chip.bad { background: #ffe9e4; border-color: #c43a35; color: #8a1d1b; }
.lx-talk .lx-chip.neutral { background: #f4efe3; border-color: #8c7a63; color: #5a4a3a; }
.lx-talk .lx-chip.chance { flex-basis: 100%; background: #fff3d1; border-color: #d29a17; color: #6b4600; }

/* Thanh đếm ngược tự chọn */
.lx-talk .auto-cd { margin-top: 14px; }
.lx-talk .auto-cd i { height: 9px; border: 2px solid var(--ink); background: #fff; }
.lx-talk .auto-cd span { font: 800 12px var(--display); color: var(--ink-2); }
@media (max-width: 480px) { .lx-talk .lx-choice-label { font-size: 15px; } }