/* Cửa sổ PC "Kỹ năng võ công" (F3) — game/js/pcwin/skill.js. Bố cục theo \ui\001a\window\fightskill.ini (383×500; web bỏ dải
   tiêu đề 30 px vì KT.WIN có dải riêng → lòng 383×470, mọi toạ độ dưới đây = toạ độ ini − 30 theo trục dọc):
   PageSetMain (5,0) · tab btn_ladder_page.spr 31 cao · BgFactionImage (22,47) 339×344 · ô kỹ năng 37 px tại (13 + 163·cột,
   12 + 56·hàng) · tên (63, 9) · "Cấp:" (63, 34) · BtnLvup (39, 37) 13×13 · BtnPageUp/Down (31 / 119, 398) 55×19 · TxtPointLable
   (68, 430) · BtnAccept / BtnCancel (210 / 290, 429) 75×21. Ảnh: game/assets/ui/pc/skill/*.webp (tools/build_pcwin_skill.py).
   Màn gọn (cửa sổ thành tấm phủ màn): xếp theo dòng, nút ≥ 28 px. */
.skw{position:relative;width:383px;height:470px;background:url(../../assets/ui/pc/skill/main.webp) 0 -30px no-repeat;color:#fff;font-size:12px;
  user-select:none;-webkit-user-select:none}
.skw button{font:inherit;cursor:pointer}
.skw button:disabled{cursor:default}

/* tab trang: btn_ladder_page.spr (thường · rê · đang chọn), chữ Color=gold / SelectColor=yellow */
.skw-tabs{position:absolute;left:6px;top:1px;display:flex;gap:1px}
.skw-tab{width:90px;height:31px;padding:7px 2px 0;border:0;background:url(../../assets/ui/pc/skill/page.webp) 0 0/300% 100%;color:#e2c870;
  font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 1px #000}
.skw-tab:hover{background-position:50% 0}
.skw-tab.on{background-position:100% 0;color:#ffef5a}

/* trang hệ phái: ảnh nền phái có sẵn 12 ô */
.skw-page{position:absolute;left:22px;top:47px;width:339px;height:344px;background:no-repeat 0 0/339px 344px}
.skw-cell{position:absolute;left:calc(var(--c) * 163px);top:calc(var(--r) * 56px);width:163px;height:56px}
.skw-ic{position:absolute;left:13px;top:12px;width:37px;height:37px;background-size:cover;cursor:pointer}
/* tên dài («Thiếu Lâm Đao Pháp» ~110 px > ô 100 px): xuống 2 dòng trong cùng khung 30 px thay vì cắt «…» */
.skw-nm{position:absolute;left:63px;top:4px;width:100px;height:30px;line-height:13px;display:flex;align-items:center;color:rgb(230,230,160);font-weight:400;
  text-shadow:0 0 2px #000,0 0 2px #000}
.skw-lv{position:absolute;left:63px;top:34px;width:100px;height:18px;line-height:18px;color:rgb(230,230,160);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;text-shadow:0 0 2px #000,0 0 2px #000}
.skw-lv small{font-size:11px;color:#c9c9b0}
.skw-pd{font-style:normal;color:#5ff}
.skw-tag{display:inline-block;padding:0 3px;border-radius:2px;background:rgba(0,0,0,.6);color:var(--gold,#ecdf9c);font-size:10px;line-height:14px}
.skw-tag.g{color:#7fe07a}
.skw-add{position:absolute;left:39px;top:37px;width:13px;height:13px;padding:0;border:0;background:url(../../assets/ui/pc/skill/add.webp) 0 0/400% 100%}
.skw-add:hover{background-position:33.333% 0}
.skw-add:active{background-position:66.667% 0}
.skw-cell.off .skw-ic{filter:grayscale(1) brightness(.55)}
.skw-cell.off .skw-nm{color:#a8a890}
.skw-cell.main .skw-ic{box-shadow:0 0 0 2px #ecdf9c,0 0 6px #ecdf9c}
.skw-cell.aura .skw-ic{box-shadow:0 0 0 2px #6fd06a,0 0 6px #6fd06a}
.skw-cell.sel .skw-ic{outline:2px solid #fff;outline-offset:1px}
.skw-cell.drag{opacity:.5}

/* Trước · 1/1 · Sau (btn_small_4ch.spr) + thao tác ô đang chọn + Tự cộng */
.skw-pager{position:absolute;left:31px;top:398px;width:334px;height:22px;display:flex;align-items:center;gap:3px}
.skw-pager .sp{flex:1}
.skw-sb{width:55px;height:19px;padding:0;border:0;background:url(../../assets/ui/pc/skill/small.webp) 0 0/400% 100%;color:rgb(160,200,180);font-size:12px}
.skw-sb:hover:not(:disabled){background-position:33.333% 0}
.skw-sb:active:not(:disabled){background-position:66.667% 0}
.skw-sb:disabled{background-position:100% 0;color:#8a8f8a}
.skw-pn{width:30px;text-align:center;color:rgb(170,230,130);font-size:13px}
.skw-pager .btn.sm{min-height:20px;padding:0 6px;font-size:12px}
.skw-auto{display:flex;align-items:center;gap:3px;color:#ddd;white-space:nowrap;cursor:pointer}
.skw-auto input{margin:0}

/* Điểm còn + Cộng điểm / Hủy (btn_Fightskill.spr) */
.skw-foot .sp{display:none}
.skw-pl{position:absolute;left:68px;top:430px;height:20px;line-height:20px;color:rgb(254,234,165)}
.skw-pt{position:absolute;left:130px;top:430px;width:34px;height:20px;line-height:20px;text-align:center;color:rgb(254,234,165);font-weight:400}
.skw-ab{position:absolute;top:429px;width:75px;height:21px;padding:0;border:0;background:url(../../assets/ui/pc/skill/accept.webp) 0 0/400% 100%;
  color:rgb(160,200,180);font-size:12px}
.skw-ab[data-skok="1"]{left:210px}
.skw-ab[data-skok="0"]{left:290px}
.skw-ab:hover:not(:disabled){background-position:33.333% 0}
.skw-ab:active:not(:disabled){background-position:66.667% 0}
.skw-ab:disabled{background-position:100% 0;color:#8a8f8a}

/* trang Tu luyện: Ngũ Hành, hướng tu luyện, kỹ năng 110 (nền tooltip PC DescBgColor 0,30,19) */
.skw-info{position:absolute;left:22px;top:47px;width:339px;height:374px;box-sizing:border-box;overflow:auto;overscroll-behavior:contain;padding:6px 8px;
  background:rgba(0,30,19,.94);border:1px solid rgb(110,114,109);line-height:1.5}
.skw-info h4{margin:8px 0 3px;color:rgb(170,230,130);font-size:13px}
.skw-info p{margin:3px 0}
.skw-info .muted{color:rgb(148,174,165)}
.skw-info .kv{display:grid;grid-template-columns:auto 1fr;gap:1px 10px}
.skw-info .kv span{color:rgb(148,174,165)}
.skw-info .kv b{font-weight:400}
.skw-fh{display:flex;gap:8px;align-items:center}
.skw-fi{flex:none;width:40px;height:40px}
.skw-routes{margin:2px 0;padding-left:16px}
.skw-routes li.on b{color:#ffef5a}
.skw-routes small{display:block;color:rgb(148,174,165)}
.skw-info .sk110{background:rgba(0,0,0,.35);border-color:rgb(110,114,109)}

.skw-hint{margin:4px 2px 0;font-size:11px;color:rgb(148,174,165);max-width:383px}

/* tooltip kỹ năng kiểu PC (GetFightSkillTip) trong #tip */
.itip.skt{max-width:290px}
.skt .skt-nm{color:rgb(170,230,130)}
.skt .skt-pd{color:#5ff}
.skt .skt-desc{color:#e6dcb4;margin:3px 0}
.skt .skt-next{color:#b9c4bd}
.skt .skt-bad{color:#ff6a4a}

/* màn gọn: tấm phủ cả màn (KT.WIN) → xếp dòng, nút cộng 28 px */
@media (max-width:820px),(max-height:500px){
  .skw{position:static;width:auto;height:auto;background:#1d201d;display:flex;flex-direction:column;gap:6px;padding:4px}
  .skw-tabs{position:static;flex-wrap:wrap;gap:2px}
  .skw-tab{flex:1 1 23%;min-width:80px;width:auto;height:34px;padding-top:8px}
  .skw-page{position:relative;left:auto;top:auto;width:auto;height:auto;display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:6px;
    background-size:cover;background-position:center;border:1px solid rgb(110,114,109)}
  .skw-cell{position:relative;left:auto;top:auto;width:auto;height:58px;background:rgba(0,0,0,.45);border-radius:2px}
  .skw-ic{left:6px;top:8px;width:40px;height:40px}
  .skw-cell{height:auto;min-height:58px;padding:6px 36px 6px 54px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;gap:2px}
  .skw-nm,.skw-lv{position:static;width:auto;height:auto;line-height:15px;display:block;white-space:normal;overflow:visible}
  .skw-add{left:auto;right:4px;top:15px;width:28px;height:28px}
  .skw-pager{position:static;width:auto;height:auto;flex-wrap:wrap;gap:6px}
  .skw-sb{width:64px;height:28px}
  .skw-pager .btn.sm{min-height:30px}
  .skw-auto{min-height:28px}
  .skw-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
  .skw-foot .sp{display:block;flex:1}
  .skw-pl,.skw-pt,.skw-ab{position:static}
  .skw-pt{font-size:14px}
  .skw-ab{width:90px;height:30px}
  .skw-info{position:static;width:auto;height:auto;max-height:none}
  .skw-hint{max-width:none}
}
