/* ===== Nhiệm vụ & cốt truyện (js/quests.js): hội thoại có chân dung, sổ nhiệm vụ (J), bảng theo dõi trên HUD ===== */

/* hội thoại cốt truyện (nền kem, chữ mực — css/ui2.css) */
.win-story { top: auto; bottom: 150px; left: calc(50% - 290px); width: 580px; }
.qd-wrap { display: flex; gap: 12px; align-items: flex-start; }
.qd-por { flex: none; width: 96px; height: 96px; image-rendering: pixelated; background: radial-gradient(circle at 50% 40%, #6a4a3a, #2a2236 75%); border: 3px solid var(--ink, #2a2435); border-radius: 10px; }
.qd-main { flex: 1; min-width: 0; }
.qd-who { color: #2a5a9a; font-size: 14px; font-weight: 900; }
.qd-text { margin: 4px 0 10px; line-height: 1.55; font-size: 14px; min-height: 44px; color: var(--ink, #2a2435); }
.qd-wrap.narr .qd-text { font-style: italic; color: var(--ink-soft, #6a5a48); }
.qd-opts { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: flex-end; }
.qd-opts small { margin-right: auto; color: var(--ink-soft, #6a5a48); }
.qd-sys { margin: 6px 0; padding: 6px 8px; font-size: 12px; color: var(--ink, #2a2435); background: rgba(116, 182, 236, .18); border-left: 4px solid var(--sky-d, #4a8ac8); border-radius: 4px; }
.qd-card { margin: 6px 0 10px; padding: 8px 10px; font-size: 13px; color: var(--ink, #2a2435); background: var(--cream-2, #ecdfc2); border: 2px solid var(--ink, #2a2435); border-radius: 10px; }
.qd-card > b { color: #a8620c; font-size: 14px; }
.qd-card > small { color: var(--ink-soft, #6a5a48); }
.qd-card p { margin: 4px 0 6px; }
.qd-objs { margin: 4px 0; padding-left: 4px; list-style: none; }
.qd-objs li { padding: 2px 0; }
.qd-objs li.done { color: #2a8a3a; }
.qd-objs li b { color: #a8620c; }
.qd-objs li i, .qd-objs li small { color: var(--ink-soft, #6a5a48); }
.qd-rew { margin-top: 6px; font-size: 12px; }
.qd-rew .pxi, .qd-sys .pxi { vertical-align: middle; }

/* sổ nhiệm vụ */
.win-quest { width: 520px; left: calc(50% - 260px); }
.ql-ch { padding: 6px 9px; color: var(--ink, #2a2435); background: #e4d8f4; border: 2px solid var(--ink, #2a2435); border-radius: 10px; }
.ql-ch b { color: #5a3a9a; }
.ql-ch p { margin: 4px 0 0; font-size: 12px; font-style: italic; color: var(--ink-soft, #6a5a48); }
.ql-st { margin: 8px 0 2px; font-size: 13px; }
.ql h4 { margin: 10px 0 4px; font-size: 13px; }
.ql-keys, .ql-done { margin: 0; padding-left: 4px; list-style: none; font-size: 12px; max-height: 140px; overflow-y: auto; }
.ql-keys li, .ql-done li { padding: 2px 0; }
.ql-keys small, .ql-done small { color: var(--ink-soft, #6a5a48); }

/* bảng theo dõi dưới minimap */
#quest-track { top: 238px; right: 12px; width: 230px; padding: 6px 9px; font-size: 12px; cursor: pointer; pointer-events: auto; }
#quest-track > b { display: block; color: var(--gold); margin-bottom: 2px; }
#quest-track .qt-o { padding: 1px 0; text-shadow: 1px 1px 0 #000; }
#quest-track .qt-o.done { color: #8adf8a; }
#quest-track .qt-o.go { color: #ffe7a6; }
@media (max-width: 900px), (max-height: 640px) { #quest-track { top: 182px; transform: scale(.85); transform-origin: top right; } }

/* ===== việc hằng ngày · lịch · danh vọng (js/ext_daily.js) — thẻ trong sổ J ===== */
.dq-tabs { display: flex; align-items: center; gap: 4px; margin-bottom: 8px; }
.dq-tok { margin-left: auto; font-size: 13px; font-weight: 800; color: #a8620c; }
.dq-sub { margin: 2px 0 8px; font-size: 12px; color: var(--ink-soft, #6a5a48); }
.dq-list { display: flex; flex-direction: column; gap: 5px; max-height: 46vh; overflow-y: auto; }
.dq-row { display: flex; align-items: center; gap: 8px; padding: 6px 9px; color: var(--ink, #2a2435); background: var(--cream-2, #ecdfc2); border: 2px solid var(--ink, #2a2435); border-radius: 9px; }
.dq-row.on { background: #fff1c2; box-shadow: inset 4px 0 0 #e0a020; }
.dq-row.done { opacity: .6; }
.dq-t { flex: 1; min-width: 0; font-size: 13px; }
.dq-t small { display: block; color: var(--ink-soft, #6a5a48); }
.dq-row button { flex: none; padding: 3px 10px; font-size: 12px; }
.dq-row button[disabled] { opacity: .45; cursor: var(--cur-normal); }
.dq-ok { flex: none; font-weight: 900; color: #2a8a3a; }
.dq-bar { height: 6px; margin-top: 4px; background: rgba(42, 36, 53, .18); border-radius: 3px; overflow: hidden; }
.dq-bar i { display: block; height: 100%; background: linear-gradient(90deg, #e0a020, #ffd56a); }
.dq-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.dq-cell { position: relative; min-height: 58px; padding: 4px; font-size: 11px; line-height: 1.25; text-align: center; color: var(--ink, #2a2435); background: var(--cream-2, #ecdfc2); border: 2px solid var(--ink, #2a2435); border-radius: 8px; }
.dq-cell b { display: block; font-size: 11px; color: #2a5a9a; }
.dq-cell.got { background: #cfe8c0; }
.dq-cell.got i { position: absolute; right: 3px; top: 1px; font-style: normal; font-weight: 900; color: #2a8a3a; }
.dq-cell.next { box-shadow: 0 0 0 2px #ffd56a, 0 0 8px #ffb020; }
.dq-title { margin: 2px 0 6px; font-size: 12px; font-style: italic; font-weight: 700; color: #8a4ab8; }
#quest-track .qt-dq { margin-top: 3px; padding-top: 3px; border-top: 1px solid rgba(255, 255, 255, .15); font-size: 11px; }