/* Cửa sổ PC "Bảng nhiệm vụ" (F4) — game/js/pcwin/quest.js. Bố cục theo \ui\001a\window\taskpanel.ini (526×463):
   lòng xám 103,103,103 · ô danh sách 185 rộng (OutLookTask) · ô nội dung 317 rộng (ScrollTaskInfo) · nút đáy btn_2ch 51×19.
   Ảnh: game/assets/ui/pc/quest/*.webp (tools/build_pcwin_quest.py). Màn hẹp (< 440 px, cửa sổ thành tấm phủ màn): xếp dọc. */
.qw{container-type:inline-size;display:flex;flex-direction:column;gap:6px;height:100%;min-height:min(400px,100%);padding:4px 2px 2px;
  background:rgb(103,103,103);color:#fff;font-size:13px;line-height:1.45}
.qw-top{display:flex;align-items:center;gap:6px;min-height:22px;flex-wrap:wrap}
.qw-num{color:#fff;text-shadow:0 0 2px #000,0 0 2px #000;font-size:13px}
.qw-sp{flex:1}
.qw-pg{min-width:63px}
.qw-body{flex:1;min-height:0;display:flex;gap:4px}
/* ô lõm PC: border-image 14 (mảnh pane cắt từ bg_main, lòng 36,36,36 α 230 trên nền xám) */
.qw-pane{border:3px solid transparent;border-image:url(../../assets/ui/pc/quest/pane.webp) 14 fill / 14px;background:rgb(43,43,43) content-box;
  overflow:auto;overscroll-behavior:contain;padding:5px 6px;min-height:0}
.qw-list{flex:0 0 185px}
.qw-info{flex:1;min-width:0}

/* ---- cây nhóm (OutLookTask: tiêu đề nhóm + nút +/−, mục chữ 148,174,165, mục chọn chữ vàng nền 200,0,0) */
.qw-g{display:flex;align-items:center;gap:5px;min-height:24px;padding:1px 2px;color:#b4dc8c;cursor:pointer;user-select:none;font-size:13px}
.qw-g i{flex:none;width:15px;height:15px;background:url(../../assets/ui/pc/quest/minus.webp) 0 0/60px 15px}
.qw-g:hover i{background-position:-15px 0}
.qw-g.fold i{background-image:url(../../assets/ui/pc/quest/plus.webp)}
.qw-g.empty{color:#94aea5}
.qw-g small{color:#94aea5}
.qw-g:focus-visible,.qw-it:focus-visible,.qw-slot:focus-visible{outline:1px solid #ecdf9c;outline-offset:-1px}
.qw-it{display:flex;align-items:center;gap:4px;min-height:24px;padding:2px 4px 2px 22px;color:#94aea5;cursor:pointer;text-shadow:0 0 2px #090909}
.qw-it span{flex:1;min-width:0;overflow-wrap:anywhere}
.qw-it small{flex:none;color:#ecdf9c}
.qw-it:hover{color:#dfe9e4}
.qw-it.idle span{color:#8f9d98}
.qw-it.on{background:rgb(200,0,0);color:#ff0}
.qw-it.on span,.qw-it.on small{color:#ff0}
.qw-it em{flex:none;width:7px;height:7px;border-radius:50%;background:#66c25a;box-shadow:0 0 3px #66c25a}

/* ---- nội dung (TaskText: chữ trắng 14, <color=Gold> tiêu đề mục) */
.qw-info p{margin:0 0 6px}
.qw-tn{color:#ecdf9c;font-size:14px;font-weight:600;margin:0 0 4px}
.qw-h{color:#e8c860;margin:8px 0 3px}
.qw-y{color:#ff0;font-weight:normal}
.qw-dim{color:#94aea5}
.qw-warn{color:#f47c6e}
.qw-say{color:#c8d4ce;font-style:italic;white-space:pre-line}
.qw-stat{color:#c8d4ce;font-size:12px}
.qw-stat b{color:#ecdf9c}
.qw-obj{margin:0 0 4px}
.qw .sys-quest-rw{color:#c8d4ce}
.qw .sys-quest-rw b{color:#9ad3ff}
.qw .sys-quest-row{margin-top:5px}
.qw .sys-quest-ms{color:#f0a050;font-size:12px;margin-top:6px}
.qw-steps{margin:2px 0 6px 22px;padding:0;font-size:12px;color:#c8d4ce}
.qw-steps li.ok{color:#8a958f;text-decoration:line-through}
.qw-steps li.on{color:#ff0}
.qw-follow{display:block;margin-top:8px;font-size:12px;color:#c8d4ce}

/* ---- ô thưởng (WndFixAward: "Cố định" + 5 ô bg_award 46×46, vật phẩm 38×38 ở 4,4) */
.qw-aw{margin:6px 0 4px}
.qw-awt{color:#fff;margin-bottom:3px}
.qw-awr{display:flex;flex-wrap:wrap;gap:12px;padding-left:10px}
.qw-slot{position:relative;flex:none;width:46px;height:46px;background:url(../../assets/ui/pc/quest/award.webp) 0 0/46px 46px;cursor:pointer}
.qw-slot .ic{position:absolute;left:4px;top:4px}
.qw-slot b{position:absolute;right:4px;bottom:3px;font-size:11px;font-weight:600;color:#fff;text-shadow:0 0 2px #000,0 0 2px #000,0 0 2px #000}
.qw-slot:hover{filter:brightness(1.25)}
/* trang con Đổi Danh Bổ Lệnh */
.qw-exl{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.qw-exr{display:flex;align-items:center;gap:8px}
.qw-exr>div:nth-child(2){flex:1;min-width:0;font-size:12px}
.qw-exr small{color:#c8d4ce}
.qw .sys-quest-ex>div{background:rgba(0,0,0,.25);border-color:#4d524c}

/* ---- hàng nút đáy (btn_2ch 51×19: thường / rê / nhấn / mờ) */
.qw-foot{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;min-height:22px;padding:0 6px 2px}
.qw-b{min-width:51px;height:21px;padding:0 9px;border:1px solid transparent;border-image:url(../../assets/ui/pc/quest/btn2.webp) 5 fill / 5px;
  background:rgb(22,52,44) content-box;color:#fff;font-size:12px;text-shadow:0 1px 0 #000,0 0 2px #000;white-space:nowrap}
.qw-b:hover:not(:disabled){border-image-source:url(../../assets/ui/pc/quest/btn2h.webp)}
.qw-b:active:not(:disabled){border-image-source:url(../../assets/ui/pc/quest/btn2d.webp)}
.qw-b.on{border-image-source:url(../../assets/ui/pc/quest/btn2h.webp);color:#ecdf9c}
.qw-b:disabled{border-image-source:url(../../assets/ui/pc/quest/btn2x.webp);background-color:rgb(110,110,110);color:#e8e8e8;cursor:default}

/* ---- màn hẹp: danh sách trên, nội dung dưới; vùng chạm ≥ 28 px */
@container (max-width:440px){
  .qw-body{flex-direction:column}
  .qw-list{flex:0 0 auto;max-height:34%}
  .qw-info{flex:1 1 auto}
  .qw-g,.qw-it{min-height:28px}
  .qw-b{height:30px;flex:1 1 auto}
  .qw-pg{min-height:28px}
}
@media (pointer:coarse){ .qw-b{height:30px} .qw-g,.qw-it{min-height:28px} }
