/* Cửa sổ PC nhóm "shop" (game/js/pcwin/shop.js, docs/ui.md §9). Ảnh: game/assets/ui/pc/shop/ (tools/build_pcwin_shop.py).
   Màu chữ theo ini PC: tiêu đề 170,230,130; chữ list 220,220,220; nút cửa tiệm 140,180,160; số tiền 255,255,232. */
.pws-shop,.pws-ib,.pws-au{position:relative;color:#e1e1e1;font-size:12px;line-height:1.35;box-sizing:border-box}
.pws-shop *,.pws-ib *,.pws-au *{box-sizing:border-box}
.pws-shop .muted,.pws-ib .muted,.pws-au .muted{color:#94aea5}
.pws-shop .bad,.pws-ib .bad,.pws-au .bad,.pws-sub .bad{color:#ff8a7a}
.pws-shop .good,.pws-sub .good{color:#9be07a}
.pws-sel,.pws-in{max-width:100%;min-height:24px;background:#000;border:1px solid #6e726d;color:#fff;font:inherit;padding:1px 4px;border-radius:0}
.pws-note{color:#94aea5;font-size:11px;margin:4px 0}
.pws-shop button,.pws-ib button,.pws-au button,.pws-sub button{font:inherit;cursor:pointer}
.pws-shop button:disabled,.pws-ib button:disabled,.pws-au button:disabled,.pws-sub button:disabled{cursor:default}
/* ô vật phẩm 37×37 (ObjWidth=37) */
.pws-cell{position:relative;display:inline-flex;align-items:center;justify-content:center;width:37px;height:37px;flex:none;padding:0;
  border:0;background:url(../../assets/ui/pc/shop/shopcell.webp) 0 0/38px 38px no-repeat;color:#fff}
.pws-cell .ic{display:block}
.pws-cell em{position:absolute;right:1px;bottom:0;font-style:normal;font-size:10px;color:#fff;text-shadow:0 0 2px #000,0 0 2px #000}
.pws-cell s{position:absolute;left:2px;top:0;text-decoration:none;font-size:10px;line-height:1;color:#ffe08a;text-shadow:0 0 2px #000}
button.pws-cell:hover:not(.dis){outline:1px solid #aae682;outline-offset:-1px}
.pws-cell.dis::after{content:"";position:absolute;inset:1px;background:rgba(160,0,0,.38);pointer-events:none}   /* PC: hàng không mua được tô đỏ */
.pws-cell.sel{outline:2px solid #ffe08a;outline-offset:-2px}
.pws-cell.q1{box-shadow:inset 0 0 0 1px #6fa8ff}.pws-cell.q2{box-shadow:inset 0 0 0 1px #c77dff}.pws-cell.q3{box-shadow:inset 0 0 0 1px #ffb347}.pws-cell.q4{box-shadow:inset 0 0 0 1px #ff6b6b}
.pws-cell.empty{opacity:1}
/* nút nhỏ 2 chữ (common btn_2ch → dùng btn_shop_small_2ch 45×19: thường / rê / nhấn / khoá) */
.pws-b,.pws-b2,.pws-sb{min-height:19px;min-width:45px;padding:1px 6px;border:0;color:#8cb4a0;
  background:url(../../assets/ui/pc/shop/sbtn.webp) 0 0/180px 100% no-repeat;border-radius:0}
.pws-b:hover:not(:disabled),.pws-b2:hover:not(:disabled),.pws-sb:hover:not(:disabled){background-position:-45px 0;color:#fff}
.pws-b:active:not(:disabled),.pws-b2:active:not(:disabled),.pws-sb:active:not(:disabled),.pws-sb.on{background-position:-90px 0;color:#00ff00}
.pws-b:disabled,.pws-b2:disabled,.pws-sb:disabled{background-position:-135px 0;color:#3c403e}
.pws-b2{background-size:auto 100%;background-image:none;background-color:#2b4a40;border:1px solid #5d8a78;color:#e1f0e8}
.pws-b2:hover:not(:disabled){background-color:#376154}
.pws-b2:disabled{background-color:#3a3d3b;border-color:#555;color:#8a8f8c}

/* ================= hộp nhỏ Mua / Bán (shopbuy.ini 205×140, buy_sell_sub_win_bg) ================= */
.pws-subwrap{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.35)}
.pws-sub{width:min(240px,100%);max-height:100%;overflow:auto;padding:24px 10px 10px;color:#e1e1e1;font-size:12px;
  border:solid transparent;border-width:24px 8px 10px;border-image:url(../../assets/ui/pc/shop/subwin.webp) 24 8 10 8 stretch;background:#1d3330 padding-box;padding:0 4px 4px}
.pws-subt{display:block;margin:-20px 0 6px;text-align:center;color:#aae682;font-weight:400}
.pws-subi{display:flex;gap:8px;align-items:flex-start;margin-bottom:6px}
.pws-subi .nm{color:#fff;margin-bottom:2px;overflow-wrap:anywhere}
.pws-subi small{display:block;color:#c8d2cd}
.pws-subq{display:flex;align-items:center;gap:6px;margin:4px 0;flex-wrap:wrap}
.pws-subq input{width:70px;background:#000;border:1px solid #6e726d;color:#fff;min-height:24px;padding:1px 4px}
.pws-subtot{color:#ffffe8}
.pws-subb{display:flex;justify-content:flex-end;gap:6px;margin-top:6px}
.pws-subb button{min-height:24px}
.pws-tipx{margin-top:-4px}

/* ================= Cửa tiệm (shop.ini 210×442) ================= */
.pws-shop{width:100%;max-width:210px;margin:0 auto;display:flex;flex-direction:column;gap:4px}
.pws-hd{display:flex;flex-direction:column;gap:3px}
.pws-hd .pws-sel{width:100%}
.pws-go{display:flex;align-items:center;gap:4px;font-size:11px;color:#94aea5}
.pws-go span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pws-ptabs{display:flex;flex-wrap:wrap;align-items:flex-end;gap:2px;min-height:28px}
.pws-ptab{width:55px;height:28px;border:0;padding:8px 0 0;color:#dcdcdc;background:url(../../assets/ui/pc/shop/ptab.webp) 0 0/165px 28px no-repeat}
.pws-ptab:hover{background-position:-55px 0}
.pws-ptab.on{background-position:-110px 0;color:#aae682}
/* tên tiệm: một dòng riêng trên 2 thẻ Mua / Mua lại (tên dài «Tiệm Phi Phong Hồn Thạch-Kim · bạc» không cắt «…») */
.pws-tn{order:-1;flex:1 1 100%;min-width:0;font-size:11px;line-height:14px;color:#aae682;padding:0 2px;overflow-wrap:anywhere}
.pws-grid{display:grid;grid-template-columns:repeat(5,38px);grid-auto-rows:38px;width:191px;padding:1px 0 0 1px;align-self:center;
  background:#002526 url(../../assets/ui/pc/shop/shopgrid.webp) 0 0 no-repeat}
.pws-grid .pws-cell{width:37px;height:37px;background:none}
.pws-pg{display:flex;justify-content:center;align-items:center;gap:4px;height:18px}
.pws-pg span{min-width:34px;height:14px;line-height:14px;text-align:center;background:#000;color:#ffffe8;font-size:11px}
.pws-arr{width:15px;height:16px;border:0;padding:0;background:url(../../assets/ui/pc/shop/larr.webp) 0 0/45px 16px no-repeat}
.pws-arr.r{background-image:url(../../assets/ui/pc/shop/rarr.webp)}
.pws-arr:hover:not(:disabled){background-position:-15px 0}.pws-arr:active:not(:disabled){background-position:-30px 0}
.pws-arr:disabled{opacity:.4}
.pws-btns{display:grid;grid-template-columns:repeat(3,62px);gap:4px;justify-content:center}   /* 6 nút 3×2: «Sửa kỹ hết» đủ chỗ (45 px cắt chữ) */
.pws-btns .pws-sb{padding:0;font-size:11px;white-space:nowrap;background-size:400% 100%}
.pws-btns .pws-sb:hover:not(:disabled){background-position:33.33% 0}
.pws-btns .pws-sb:active:not(:disabled),.pws-btns .pws-sb.on{background-position:66.66% 0}
.pws-btns .pws-sb:disabled{background-position:100% 0}
.pws-wal{display:flex;align-items:center;justify-content:center;gap:4px;color:#ecdf9c;font-size:12px}
.pws-wal b{margin-right:8px;color:#ffffe8}

/* ================= Kỳ Trân Các (ibshop.ini 800×600) ================= */
.pws-ib{display:grid;grid-template-columns:160px 1fr;gap:7px;min-height:500px}
.pws-ibside{display:flex;flex-direction:column;gap:8px;padding:8px;border:solid transparent;border-width:3px;
  border-image:url(../../assets/ui/pc/shop/ibside.webp) 3 fill stretch}
.pws-zones{display:flex;gap:4px}
.pws-zone{flex:1;min-width:0;height:30px;border:0;padding:0;color:#fff;font-size:12px;white-space:nowrap;
  background:url(../../assets/ui/pc/shop/ibzone.webp) 0 0/400% 100% no-repeat}
.pws-zone:hover{background-position:33.33% 0}.pws-zone.on{background-position:66.66% 0;color:#ffe08a}
.pws-wall{display:flex;flex-direction:column;gap:6px}
.pws-wl{display:flex;flex-direction:column;gap:1px}
.pws-wl span{color:#aae682}
.pws-wl b{display:block;height:17px;line-height:17px;padding:0 4px;text-align:right;color:#ffffe8;font-weight:400;background:url(../../assets/ui/pc/shop/black9.webp) 0 0/100% 100%}
.pws-cp{display:flex;flex-direction:column;gap:2px;color:#aae682}
.pws-ibact{display:flex;flex-direction:column;gap:6px;align-items:center;margin-top:auto}
.pws-zh{width:73px;height:26px;border:0;padding:0;color:#fff;background:url(../../assets/ui/pc/shop/ib4zh.webp) 0 0/292px 26px no-repeat;white-space:nowrap}
.pws-zh:hover:not(:disabled){background-position:-73px 0}.pws-zh:active:not(:disabled){background-position:-146px 0}
.pws-zh:disabled{background-position:-219px 0;color:#999}
.pws-ibmain{display:flex;flex-direction:column;gap:6px;padding:6px 10px;min-width:0;border:solid transparent;border-width:3px;
  border-image:url(../../assets/ui/pc/shop/ibmain.webp) 3 fill stretch}
.pws-tags{display:flex;gap:4px;overflow-x:auto;scrollbar-width:thin}
.pws-tag{flex:none;width:74px;height:33px;border:0;padding:0 3px;color:#dcdcdc;font-size:11px;line-height:1.1;overflow:hidden;
  background:url(../../assets/ui/pc/shop/ibtag.webp) 0 0/222px 33px no-repeat}
.pws-tag:hover{background-position:-74px 0}.pws-tag.on{background-position:-148px 0;color:#ffe08a}
.pws-strip{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:28px;padding:0 10px;color:#ffffe8;flex-wrap:wrap;
  background:url(../../assets/ui/pc/shop/ibstrip.webp) 0 0/100% 100% no-repeat}
.pws-pgr{display:flex;align-items:center;gap:6px}
.pws-pgr b{color:#ffffe8;font-weight:400;min-width:30px;text-align:center}
.pws-sm{width:50px;height:26px;border:0;padding:0;color:#fff;background:url(../../assets/ui/pc/shop/ibsmall.webp) 0 0/200px 26px no-repeat}
.pws-sm:hover:not(:disabled){background-position:-50px 0}.pws-sm:active:not(:disabled){background-position:-100px 0}
.pws-sm:disabled{background-position:-150px 0;color:#999}
.pws-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-auto-rows:86px;gap:0;align-content:start;flex:1}
.pws-card{position:relative;min-width:0;height:86px;padding:1px 8px;background:url(../../assets/ui/pc/shop/ibgoods.webp) 0 0/100% 100% no-repeat;
  display:grid;grid-template-columns:44px 1fr;grid-template-rows:18px 42px 22px;column-gap:6px}
.pws-card .nm{grid-column:1/3;color:#ffe08a;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pws-card .pws-cell{grid-row:2;align-self:center;width:36px;height:36px;background:url(../../assets/ui/pc/shop/auslot.webp) 0 0 no-repeat}
.pws-card small{grid-row:2;font-size:11px;color:#dcdcdc;line-height:14px;overflow:hidden}
.pws-card small b{color:#ffffe8;font-weight:400}
.pws-card.dis small b{color:#ff8a7a}
.pws-cb{grid-column:1/3;display:flex;gap:4px;justify-content:flex-end}
.pws-buy{width:61px;height:21px;border:0;padding:0;color:#fff;background:url(../../assets/ui/pc/shop/ibbuy.webp) 0 0/244px 21px no-repeat}
.pws-buy:hover:not(:disabled){background-position:-61px 0}.pws-buy:active:not(:disabled){background-position:-122px 0}
.pws-buy:disabled{background-position:-183px 0;color:#999}
.pws-car{width:154px;height:38px;flex:none;border:0;padding:0 0 0 30px;color:#fff;background:url(../../assets/ui/pc/shop/ibcar.webp) 0 0/616px 38px no-repeat}
.pws-car:hover{background-position:-154px 0}.pws-car:active{background-position:-308px 0}
.pws-cart{width:min(380px,100%)}
.pws-crows{display:flex;flex-direction:column;gap:4px;max-height:260px;overflow:auto}
.pws-crow{display:flex;align-items:center;gap:6px}
.pws-crow .nm{flex:1;min-width:0;overflow-wrap:anywhere}
.pws-crow .nm small{display:block;color:#c8d2cd}
.pws-crow input{width:56px;background:#000;border:1px solid #6e726d;color:#fff;min-height:24px}
.pws-ctot{margin-top:6px;color:#ffffe8}

/* ================= Chợ (auctionroom.ini 800×600) ================= */
.pws-au{display:flex;flex-direction:column;gap:4px;min-height:520px}
.pws-auw{display:flex;gap:18px;justify-content:center;color:#ffffe8}
.pws-auw b{color:#ecdf9c}
.pws-aupage{flex:1;min-height:0;padding:8px 10px;background:#283432;border:1px solid #6e726d;box-shadow:inset 0 0 0 1px #1a2221}
.pws-ausl{background:#3e4a48;border:1px solid #6e726d}
.pws-aulist .pws-aurows,.pws-ausr .pws-aurows{background:#1f2a29;border:1px solid #4a5a55;padding:4px}
.pws-aub{display:grid;grid-template-columns:120px 1fr;gap:8px;height:100%}
.pws-aucat{display:flex;flex-direction:column;gap:2px;padding-top:30px}
.pws-aucat button{text-align:left;min-height:24px;padding:2px 8px;border:0;color:#dcdcdc;background:rgba(0,0,0,.25)}
.pws-aucat button:hover{background:rgba(200,200,200,.25)}
.pws-aucat button.on{color:#ffe08a;background:rgba(200,200,200,.3)}   /* .35 chỉ 4,44:1 với chữ vàng */
.pws-aulist{display:flex;flex-direction:column;gap:4px;min-width:0}
.pws-auf{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-height:28px}
.pws-auf .pws-in{width:180px}
.pws-aus{color:#94aea5}
.pws-auhd{display:grid;grid-template-columns:minmax(0,1fr) 120px 140px 110px;gap:0;min-height:22px}
.pws-auhd>span{color:#aae682;padding:3px 6px}
.pws-auh{height:22px;border:0;padding:0 6px;color:#e1e1e1;font-size:12px;text-align:center;background:url(../../assets/ui/pc/shop/auhsell.webp) 0 0/400% 100% no-repeat}
.pws-auh.n{background-image:url(../../assets/ui/pc/shop/auhname.webp)}
.pws-auh.p{background-image:url(../../assets/ui/pc/shop/auhprice.webp)}
.pws-auh:hover:not(:disabled){background-position:33.33% 0}.pws-auh.on{background-position:66.66% 0;color:#ffe08a}
.pws-auh:disabled{cursor:default}
.pws-aurows{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:4px;padding-right:2px}
.pws-aurow{display:grid;grid-template-columns:44px minmax(0,1fr) 120px 140px 110px;align-items:center;min-height:46px;padding:0 6px 0 4px;
  background:url(../../assets/ui/pc/shop/aubar.webp) 0 0/300% 100% no-repeat}
.pws-aurow:hover{background-position:50% 0}
.pws-aurow .n{overflow-wrap:anywhere;padding-right:6px}
.pws-aurow .n b{font-weight:400}
.pws-aurow .s,.pws-aurow .p{display:flex;flex-direction:column;align-items:center;text-align:center}
.pws-aurow small{color:#94aea5;font-size:11px}
.pws-aurow .p b{color:#ffffe8;font-weight:400}
.pws-aurow .t{color:#c8d2cd;text-align:center;font-size:11px}
.pws-aurow .b{grid-column:5;display:flex;justify-content:center}
.pws-aurow .t+.b{margin-top:-2px}
.pws-aurow .lnk{background:none;border:0;padding:0;color:#7fd3ff;text-decoration:underline;min-height:20px}
.pws-aupg{display:flex;align-items:center;justify-content:flex-end;gap:8px;color:#ffffe8}
.pws-aupg span{margin-right:auto;color:#94aea5}
.pws-autabs{display:flex;gap:14px;padding-left:20px}
.pws-aut{width:74px;height:33px;border:0;padding:0;color:#dcdcdc;background:url(../../assets/ui/pc/shop/aupage.webp) 0 0/222px 33px no-repeat}
.pws-aut:hover{background-position:-74px 0}.pws-aut.on{background-position:-148px 0;color:#ffe08a}
/* bán: khung trái 223 (SellItemPanel), khung phải hàng đang bày */
.pws-aus2{display:grid;grid-template-columns:230px 1fr;gap:14px;height:100%}
.pws-ausl{display:flex;flex-direction:column;gap:6px;padding:8px 10px;min-width:0}
.pws-ausl label{display:flex;flex-direction:column;gap:2px;color:#aae682}
.pws-aupick{display:flex;align-items:center;gap:8px;min-height:42px}
.pws-aupick .pws-cell{width:40px;height:40px;background:url(../../assets/ui/pc/shop/auslot.webp) 0 0/40px 40px no-repeat}
.pws-aubag{display:flex;flex-wrap:wrap;gap:2px;max-height:160px;overflow:auto;padding:2px;background:#002526}
.pws-ausr{display:flex;flex-direction:column;gap:4px;min-width:0;padding:6px 8px 6px 4px}
.pws-ausr .pws-aurow{grid-template-columns:44px minmax(0,1fr) 120px 110px 60px}
.pws-ausr .pws-aurow .b{grid-column:auto}
.pws-ausr .pws-auhd{grid-template-columns:1fr}

/* ================= Hộp thoại NPC = saypanel.ini (300×350, chân dung ImgHeadPic Top=-110 nhô trên khung) =================
   Phần tử #dialog của KT.Q.dialog (quest.js) giữ nguyên; chỉ màn rộng (màn gọn: style.css xếp hộp đáy, ẩn chân dung). */
@media (min-width:821px) and (min-height:501px){
  #battle #dialog{left:56px;right:auto;top:auto;bottom:70px;transform:none;width:300px;height:350px;max-height:calc(100% - 190px);
    display:block;padding:0;gap:0;border:solid transparent;border-width:14px 14px 14px 12px;border-radius:0;box-shadow:none;
    border-image:url(../../assets/ui/pc/shop/say.webp) 14 14 14 12 fill stretch;background:rgba(28,40,40,.92) padding-box;overflow:visible}
  #battle #dialog .dnpc{position:absolute;left:-4px;top:-150px;width:120px;height:146px;display:block;text-align:left;pointer-events:none}
  #battle #dialog .dnpc canvas{width:120px;height:140px}
  #battle #dialog .dnpc b{position:absolute;left:118px;bottom:6px;width:max-content;max-width:170px;line-height:1.15;color:#aae682;font-size:14px;text-shadow:0 1px 2px #000,0 0 3px #000}
  #battle #dialog .dtxt{height:100%;overflow:auto;padding:6px 8px 6px 10px;gap:8px;display:flex;flex-direction:column}
  #battle #dialog #dlgTitle{color:#aae682;font-size:14px;margin-right:22px}
  #battle #dialog #dlgText{font-size:14px;color:#e1e1e1;flex:0 0 auto;max-height:none;overflow:visible}
  #battle #dialog #dlgOpts{margin:0;gap:0;overflow:visible}
  #battle #dialog #dlgOpts .btn{border:0;border-image:none;background:none;min-height:24px;padding:3px 4px 3px 18px;color:#dcdcdc;font-size:12px;
    text-align:left;position:relative;border-radius:0;box-shadow:none;filter:none}
  #battle #dialog #dlgOpts .btn::before{content:"";position:absolute;left:5px;top:50%;margin-top:-4px;border:4px solid transparent;border-left:6px solid #ecdf9c}
  #battle #dialog #dlgOpts .btn:hover{background:rgba(200,200,200,.35);color:#fff}
  #battle #dialog #dlgOpts .btn:active{background:rgba(200,200,200,.2);color:#dcb4c8}
  #battle #dialog #dlgOk{align-self:flex-end;margin:auto 0 0}
  #battle #dialog .mx{right:-8px;top:-10px}
}

/* ================= màn gọn: cửa sổ thành tấm phủ cả màn (Phase A) — bố cục xếp dọc, không cuộn ngang ================= */
@media (max-width:820px),(max-height:500px){
  .pws-shop{max-width:100%}
  .pws-grid{width:100%;align-self:stretch;grid-template-columns:repeat(auto-fill,38px);justify-content:center;background:#002526 url(../../assets/ui/pc/shop/shopcell.webp) 0 0/38px 38px repeat}
  .pws-btns{grid-template-columns:repeat(auto-fill,minmax(64px,1fr))}
  .pws-btns .pws-sb{min-height:28px;background-size:400% 100%;font-size:12px}
  .pws-pg{height:auto;gap:10px;margin:2px 0}
  .pws-arr{width:28px;height:30px;background-size:84px 30px}
  .pws-arr:hover:not(:disabled){background-position:-28px 0}.pws-arr:active:not(:disabled){background-position:-56px 0}
  .pws-pg span{height:20px;line-height:20px;font-size:12px}
  .pws-btns .pws-sb:hover:not(:disabled){background-position:33.33% 0}
  .pws-btns .pws-sb:active:not(:disabled),.pws-btns .pws-sb.on{background-position:66.66% 0}
  .pws-btns .pws-sb:disabled{background-position:100% 0}
  .pws-ib{grid-template-columns:1fr;min-height:0}
  .pws-wall{flex-direction:row;flex-wrap:wrap}
  .pws-wl{flex:1 1 90px}
  .pws-ibact{flex-direction:row;flex-wrap:wrap;justify-content:center;margin-top:0}
  .pws-cards{grid-template-columns:repeat(auto-fill,minmax(196px,1fr))}
  .pws-card{width:auto;background-size:100% 100%}
  .pws-au{min-height:0}
  .pws-aub,.pws-aus2{grid-template-columns:1fr}
  .pws-aucat{flex-direction:row;flex-wrap:wrap;padding-top:0}
  .pws-auhd{grid-template-columns:repeat(4,minmax(0,1fr))}
  .pws-auh{font-size:11px;padding:0 2px}
  .pws-aurow,.pws-ausr .pws-aurow{grid-template-columns:44px minmax(0,1fr) auto;grid-auto-rows:auto;row-gap:2px;padding:4px;background:rgba(0,0,0,.3);border:1px solid #4a5a55}
  .pws-aurow .s,.pws-aurow .t{grid-column:2;align-items:flex-start;text-align:left;flex-direction:row;gap:6px}
  .pws-aurow .p{grid-column:3;grid-row:1}
  .pws-aurow .b,.pws-ausr .pws-aurow .b{grid-column:3;grid-row:2/4}
  .pws-auf .pws-in{flex:1;width:auto}
  .pws-aubag{max-height:120px}
  .pws-b2,.pws-zh,.pws-sm,.pws-buy{min-height:28px}
  .pws-aucat button{min-height:28px}
}