/* ===== Ba menu chính làm lại (js/menus.js) trên nền UI kit (ui/ui-kit.css) =====
   Màu hệ ngũ hành của nhân vật: --el (đặt trên .k-dialog). Màu độ hiếm của món đồ: --rc (đặt trên ô). */

/* ---------- Nhân vật: một màn hình, hai cột ---------- */
.cm-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
.cm-left,.cm-right{display:flex;flex-direction:column;gap:10px;min-width:0}
.cm-box{padding:12px 14px;border-radius:16px;background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.cm-box h4{margin:0 0 8px;font:600 11px/1.4 var(--font);letter-spacing:.8px;text-transform:uppercase;color:var(--k-dim)}
.cm-box h5{margin:0 0 6px;font:600 10.5px/1.4 var(--font);letter-spacing:.8px;text-transform:uppercase}

/* tên + danh hiệu + 2 nút */
.cm-name{display:flex;align-items:center;justify-content:center;gap:4px;min-height:30px}
.cm-name b{font:600 17px/1.2 var(--font);letter-spacing:.2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm-ren{width:30px;height:30px}.cm-ren svg{width:16px;height:16px}
/* danh hiệu đang đeo: huy hiệu viên thuốc vàng giữa hai đường ruy băng mờ dần */
.cm-title{display:flex;align-items:center;gap:10px;margin-top:-4px}
.cm-title::before,.cm-title::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(255,193,7,.45))}
.cm-title::after{background:linear-gradient(90deg,rgba(255,193,7,.45),transparent)}
.cm-tchip{display:inline-flex;align-items:center;gap:6px;max-width:80%;height:26px;padding:0 13px 0 9px;border:0;border-radius:999px;cursor:pointer;
  background:rgba(255,193,7,.14);box-shadow:inset 0 0 0 1px rgba(255,193,7,.45),0 2px 8px rgba(255,193,7,.12);
  color:var(--k-acc-lt);font:600 12.5px/1 var(--font);letter-spacing:.3px;transition:background-color .15s,box-shadow .15s}
.cm-tchip svg{flex:none;width:15px;height:15px;fill:currentColor}
.cm-tchip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm-tchip:hover{box-shadow:inset 0 0 0 1px rgba(255,213,79,.8),0 2px 10px rgba(255,193,7,.22)}
.cm-tchip:focus-visible{outline:2px solid var(--k-acc-lt);outline-offset:2px}
.cm-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}

/* người giấy JX: lưới 3 cột × 5 hàng, áo và vũ khí ô cao; nhân vật động mờ phía sau */
.cm-doll{position:relative;display:grid;grid-template-columns:repeat(3,58px);grid-template-rows:repeat(5,54px);gap:8px;justify-content:space-between;
  padding:14px 20px;border-radius:18px;overflow:hidden;
  background:radial-gradient(60% 50% at 50% 55%,color-mix(in srgb,var(--el,#ffc107) 16%,transparent),transparent 75%),var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.cm-hero{position:absolute;left:50%;top:50%;width:180px;height:300px;transform:translate(-50%,-50%);opacity:.32;pointer-events:none;z-index:0}
.cm-slot{position:relative;z-index:1;width:100%;height:100%;padding:0;border:0;border-radius:14px;cursor:pointer;display:grid;place-items:center;
  background:rgba(14,19,17,.78);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--rc,#fff) 55%,transparent);transition:background-color .15s,box-shadow .15s,transform .1s}
.cm-slot:hover{background:rgba(26,33,30,.92);box-shadow:inset 0 0 0 2px var(--rc,#fff)}
.cm-slot:active{transform:scale(.96)}
.cm-slot:focus-visible{outline:2px solid var(--k-acc-lt);outline-offset:2px}
.cm-slot img{max-width:42px;max-height:42px;object-fit:contain;pointer-events:none}
.cm-tall img{max-width:52px;max-height:100px}
.cm-lv{position:absolute;left:6px;bottom:4px;font:600 10px/1 var(--font);font-style:normal;color:#dfe7e2;text-shadow:0 1px 2px #000}
.cm-enh{position:absolute;right:6px;top:4px;font:700 10px/1 var(--font);color:var(--k-acc-lt);text-shadow:0 1px 2px #000}
.cm-el{position:absolute;right:6px;bottom:6px;width:7px;height:7px;border-radius:50%;box-shadow:0 0 0 1.5px rgba(14,19,17,.9)}
.cm-bad{box-shadow:inset 0 0 0 2px var(--k-danger)!important}
.cm-bad img{opacity:.45;filter:grayscale(.6)}
.cm-warn{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:16px;height:16px;border-radius:50%;display:grid;place-items:center;
  background:var(--k-danger);color:#fff;font:700 11px/1 var(--font);text-decoration:none}
.cm-empty{background:rgba(0,0,0,.22);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.08)}
.cm-empty span{font:500 10px/1.15 var(--font);color:var(--k-faint);text-align:center;padding:0 3px}
.cm-empty:hover{box-shadow:inset 0 0 0 1.5px var(--k-line2)}
.cm-alert{display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:14px;background:var(--k-danger-tone);font-size:12px;line-height:1.4;color:#f2b8b5}
.cm-alert svg{flex:none;width:18px;height:18px;fill:var(--k-danger)}
.cm-alert b{color:#ffdad6;font-weight:500}

/* kháng: 5 ô màu hệ · may mắn / phúc duyên / kinh nghiệm */
.cm-rts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.cm-rt{display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 2px;border-radius:12px;background:var(--k-input);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 40%,transparent)}
.cm-rt span{font-size:11px;color:var(--c)}
.cm-rt b{font:600 14px/1.1 var(--font);font-variant-numeric:tabular-nums}
.cm-neg{color:#ff8a80}
.cm-misc{display:flex;justify-content:space-between;gap:8px;margin-top:10px;font-size:12px;color:var(--k-dim)}
.cm-misc b{color:var(--k-text);font-weight:600;font-variant-numeric:tabular-nums}
.cm-misc .cm-pos{color:#81c784}

/* đầu cột phải: phái · hệ · cấp · EXP · lực chiến */
.cm-hl{display:flex;align-items:center;gap:8px}
.cm-fac{font:600 15px/1.2 var(--font)}
.cm-chip{display:inline-flex;align-items:center;height:22px;padding:0 10px;border-radius:999px;background:color-mix(in srgb,var(--c) 18%,transparent);color:var(--c);font:500 11.5px var(--font)}
.cm-lvl{margin-left:auto;font-size:12px;color:var(--k-dim)}
.cm-lvl b{font:600 18px var(--font);color:var(--k-text)}
.cm-exp{position:relative;height:20px;margin-top:10px;border-radius:999px;background:var(--k-input);overflow:hidden;box-shadow:inset 0 0 0 1px var(--k-line)}
.cm-exp i{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:#4caf50;transition:width .4s var(--k-ease)}
.cm-exp span{position:relative;display:block;text-align:center;font:500 11.5px/20px var(--font);font-variant-numeric:tabular-nums;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7)}
.cm-pw{display:flex;align-items:baseline;gap:8px;margin-top:8px}
.cm-pw span{font-size:12px;color:var(--k-dim)}
.cm-pw b{font:600 20px/1 var(--font);color:var(--k-acc-lt);font-variant-numeric:tabular-nums}
.cm-pw .k-btn{height:28px;padding:0 6px 0 12px;gap:2px;font-size:12px;margin-left:auto}
.cm-pw .k-btn .cm-chev{width:16px;height:16px;fill:currentColor}

/* lực tay trái / phải */
.cm-hands{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.cm-hands>.cm-box{min-width:0}
.cm-hands .cm-box{padding:10px 14px}
.cm-hands small{display:block;font-size:11.5px;color:var(--k-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cm-hands b{display:block;margin-top:3px;font:600 17px/1.2 var(--font);color:#ffd54f;font-variant-numeric:tabular-nums}

/* tiềm năng */
.cm-bh{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.cm-bh h4{flex:1;margin:0}
.cm-bh h4 b{margin-left:4px;font-size:13px;letter-spacing:0;color:var(--k-text)}
.cm-haspts{box-shadow:inset 0 0 0 1.5px rgba(255,193,7,.45)}
.cm-haspts .cm-bh h4 b{color:var(--k-acc-lt)}
.cm-bh .k-btn{height:30px;padding:0 13px;font-size:12px}
.cm-at{display:grid;grid-template-columns:1fr auto auto auto auto;align-items:center;gap:6px;padding:5px 0}   /* tên · X · giá trị · − · + */
.cm-at+.cm-at{border-top:1px solid var(--k-line)}
.cm-at span{font-size:14px}
.cm-at>b{min-width:40px;margin-right:2px;text-align:right;font:600 15px/22px var(--font);font-variant-numeric:tabular-nums}
.cm-pmb{width:22px;height:22px;margin-top:2px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;background:var(--k-input);box-shadow:inset 0 0 0 1px var(--k-line2);color:#cfd8d3;transition:background-color .15s}
.cm-pmb svg{width:13px;height:13px;fill:currentColor}
.cm-pmb.cm-clr{background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--k-line2);color:#c9d3cd}
.cm-pmb.cm-clr:hover:not(:disabled){background:var(--k-danger-tone);color:#ff8a80}
.cm-pmb.cm-clr:disabled{opacity:0}   /* chưa cộng điểm: ẩn hẳn, giữ chỗ cho thẳng cột */
.cm-pmb.cm-plus{background:var(--k-acc-tone);box-shadow:none;color:var(--k-acc-lt)}
.cm-pmb:hover:not(:disabled){background:var(--k-hover)}
.cm-pmb.cm-plus:hover:not(:disabled){background:var(--k-acc-tone2)}
.cm-pmb:disabled{opacity:.3;cursor:default}
.cm-pmb:focus-visible{outline:2px solid var(--k-acc-lt);outline-offset:2px}

/* chỉ số: sinh tồn / tấn công */
.cm-stats{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cm-stats>div:first-child h5{color:#81c784}
.cm-stats>div:last-child h5{color:#ffb74d}
.cm-kv{display:flex;align-items:baseline;gap:6px;padding:3px 0}
.cm-kv span{flex:1;min-width:0}
.cm-kv span{font-size:12.5px;color:var(--k-dim)}
.cm-kv b{font:600 13.5px var(--font);font-variant-numeric:tabular-nums;text-align:right}
.cm-kv em{font-style:normal;font-size:11px;color:#81c784;font-variant-numeric:tabular-nums}   /* hồi phục mỗi giây, ngay sau giá trị */

/* khung hẹp (bottom sheet): một cột */
.k-narrow .cm-wrap{grid-template-columns:1fr}
.k-narrow .cm-doll{padding:12px 14px}

/* ---------- Danh hiệu (js/menus.js openTitles) ---------- */
.tl-ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--k-input);color:var(--k-faint);box-shadow:inset 0 0 0 1px var(--k-line)}
.tl-ic svg{width:22px;height:22px;fill:currentColor}
/* đang đeo */
.tl-cur{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;background:var(--k-acc-tone);box-shadow:inset 0 0 0 1px rgba(255,193,7,.4)}
.tl-cur .tl-ic{width:48px;height:48px;border-radius:14px;background:rgba(255,193,7,.22);color:var(--k-acc-lt);box-shadow:none}
.tl-cur .tl-ic svg{width:26px;height:26px}
.tl-cur>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.tl-cur small{font-size:11.5px;color:var(--k-dim)}
.tl-cur b{font:600 17px/1.25 var(--font);color:var(--k-acc-lt)}
.tl-cur span{font-size:12.5px;color:#dfe7e2}
.tl-cur.tl-none{background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.tl-cur.tl-none .tl-ic{background:var(--k-input);color:var(--k-faint)}
.tl-cur.tl-none b{color:var(--k-text)}
.tl-cur.tl-none span{color:var(--k-dim)}
/* thanh: số đã mở + lọc */
.tl-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.tl-bar>span{font-size:13px;color:var(--k-dim)}
.tl-bar>span b{font-size:15px;color:var(--k-text)}
/* danh sách */
.tl-list{display:flex;flex-direction:column;gap:8px}
.tl-row{display:flex;align-items:center;gap:12px;padding:10px 12px 10px 10px;border-radius:16px;background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.tl-row:not(.tl-lock) .tl-ic{background:rgba(129,199,132,.14);color:#81c784;box-shadow:none}
.tl-wear{box-shadow:inset 0 0 0 1.5px rgba(255,193,7,.55)}
.tl-wear .tl-ic{background:var(--k-acc-tone)!important;color:var(--k-acc-lt)!important}
.tl-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.tl-t b{font:500 14px/1.3 var(--font)}
.tl-bonus{font-size:12.5px;color:#81c784}
.tl-lock .tl-bonus{color:var(--k-dim)}
.tl-t small{font-size:11.5px;line-height:1.4;color:var(--k-dim)}
.tl-t .tl-rw{color:var(--k-faint)}
.tl-lock .tl-t b{color:#c9d3cd}
.tl-prog{display:flex;align-items:center;gap:8px;margin-top:3px}
.tl-prog i{flex:1;height:6px;border-radius:999px;background:var(--k-input);overflow:hidden}
.tl-prog i b{display:block;height:100%;border-radius:999px;background:var(--k-acc)}
.tl-prog span{flex:none;font-size:11px;color:var(--k-dim);font-variant-numeric:tabular-nums}
.tl-row .k-btn{height:32px;padding:0 16px}
/* trạng thái (không bấm được): chữ + biểu tượng, không nền / viền để không bị nhầm là nút */
.tl-on{flex:none;display:inline-flex;align-items:center;gap:4px;padding:0 4px;color:var(--k-acc-lt);font:600 12.5px var(--font)}
.tl-on svg{width:16px;height:16px;fill:currentColor}
.tl-off{flex:none;display:inline-flex;align-items:center;padding:0 4px;color:var(--k-faint);font:500 12px var(--font)}

/* ---------- Hoạt động (js/menus.js openActs) ---------- */
/* nút "Hoạt động" thay 4 nút cũ ở góc trái (PC) */
.acbtn{display:none}
html.nu #jxActs #svBtn,html.nu #jxActs #actSiege,html.nu #jxActs #actTongKim,html.nu #jxActs #actTower{display:none!important}
html.nu .acbtn{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px 0 8px;border:0;border-radius:999px;cursor:pointer;pointer-events:auto;   /* chữ như nút Nhân vật; nền trong để thấy sân */
  background:rgba(20,26,24,.5);color:#eef3f0;box-shadow:0 1px 4px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.12);font:500 9px/1 var(--font);letter-spacing:.1px;text-shadow:0 1px 2px rgba(0,0,0,.6);transition:background-color .15s,color .15s}
html.nu .acbtn svg{width:15px;height:15px;fill:#ffd54f}
html.nu .acbtn:hover,html.nu .acbtn.on{background:rgba(255,193,7,.2);color:#ffd54f}
html.nu .acbtn em{display:grid;place-items:center;min-width:16px;height:16px;padding:0 4px;text-shadow:none;border-radius:999px;background:#ffc107;color:#1f1600;font:700 9.5px/1 var(--font);font-style:normal}
html.nu .acbtn em[hidden]{display:none}
html.nu .acbtn:focus-visible{outline:2px solid #ffd54f;outline-offset:2px}

/* thẻ chính của từng hoạt động */
.acmenu .ac-hero{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.ac-sv{--ac:#81c784} .ac-siege{--ac:#ffb74d} .ac-tk{--ac:#ef5350} .ac-tower{--ac:#64b5f6}
.ac-hero{background:radial-gradient(90% 120% at 0% 0%,color-mix(in srgb,var(--ac) 14%,transparent),transparent 60%),var(--k-card)!important}
.ac-ic{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:color-mix(in srgb,var(--ac) 18%,transparent);color:var(--ac)}
.ac-ic svg{width:28px;height:28px;fill:currentColor}
.ac-ht{flex:1;min-width:0}
.ac-ht>b{display:block;font:600 16px/1.3 var(--font)}
.ac-ht>p{margin:2px 0 0;font-size:12.5px;line-height:1.45;color:var(--k-dim)}
.ac-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ac-chips span{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;background:rgba(0,0,0,.22);font-size:11.5px;color:#dfe7e2;font-variant-numeric:tabular-nums}
.ac-chips .ac-live{background:color-mix(in srgb,var(--ac) 20%,transparent);color:var(--ac);box-shadow:none}
.ac-hero>.k-btn{flex:none}
.ac-note{flex:none;font-size:12.5px;color:var(--k-dim);padding:0 6px}
/* luật tuần */
.ac-week{display:flex;gap:12px;align-items:flex-start;padding:11px 14px;border-radius:14px;background:rgba(255,183,77,.08);box-shadow:inset 0 0 0 1px rgba(255,183,77,.25)}
.ac-week svg{flex:none;width:18px;height:18px;margin-top:1px;fill:#ffb74d}
.ac-week small{display:block;font:600 11px/1.4 var(--font);letter-spacing:.6px;text-transform:uppercase;color:#ffb74d}
.ac-week p{margin:2px 0 0;font-size:12.5px;line-height:1.5;color:#dfe7e2}
/* luật chi tiết (gập) */
.ac-more{border-radius:14px;background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.ac-more summary{display:flex;align-items:center;gap:8px;height:42px;padding:0 16px;cursor:pointer;list-style:none;font:600 11px var(--font);letter-spacing:.8px;text-transform:uppercase;color:var(--k-dim)}
.ac-more summary::-webkit-details-marker{display:none}
.ac-more summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2px solid var(--k-dim);border-bottom:2px solid var(--k-dim);transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.ac-more[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.ac-more>div{padding:0 16px 14px;font-size:12.5px;line-height:1.6;color:#dfe7e2}
.ac-list{margin:2px 0 0;padding-left:18px;font-size:12.5px;line-height:1.65;color:#dfe7e2}
/* thành (công thành) */
.ac-cities{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.ac-city{display:flex;flex-direction:column;gap:3px;padding:12px;border-radius:16px;background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.ac-cn{display:flex;flex-direction:column;gap:2px;margin-bottom:2px}
.ac-cn b{font:600 13.5px var(--font)}
.ac-lv{font-size:11px;letter-spacing:1px;color:#ffb74d}.ac-lv i{font-style:normal;color:var(--k-line2)}
.ac-city small{font-size:11.5px;color:var(--k-dim)}
.ac-best{display:flex;align-items:center;gap:6px;margin:4px 0 8px}
.ac-best i,.ac-tower i{flex:1;height:6px;border-radius:999px;background:var(--k-input);overflow:hidden}
.ac-best i b,.ac-tower i b{display:block;height:100%;border-radius:999px;background:#ffb74d}
.ac-best span{font-size:11px;color:var(--k-dim);font-variant-numeric:tabular-nums}
.ac-city .k-btn{width:100%;height:30px;padding:0 8px;font-size:12px}
/* tiến trình tháp */
.ac-tower{display:flex;align-items:center;gap:10px;margin-top:4px}
.ac-tower i{height:8px}.ac-tower i b{background:#64b5f6}
.ac-tower span{flex:none;font-size:12.5px;color:#dfe7e2;font-variant-numeric:tabular-nums}
/* cửa hàng đổi lệnh */
.ac-bal{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 10px;border-radius:999px;background:var(--k-acc-tone);color:var(--k-acc-lt);font-size:12px}
.ac-bal svg{width:14px;height:14px;fill:currentColor}
.ac-bal b{font-variant-numeric:tabular-nums}
.ac-shop{display:flex;flex-direction:column}
.ac-item{display:flex;align-items:center;gap:12px;padding:8px 0}
.ac-item+.ac-item{border-top:1px solid var(--k-line)}
.ac-item .t{flex:1;min-width:0;font-size:13px;line-height:1.4}
.ac-item .t small{display:block;font-size:11px;color:var(--k-faint)}
.ac-cost{flex:none;font-size:12px;color:var(--k-dim);font-variant-numeric:tabular-nums}
.ac-item .k-btn{height:30px;padding:0 14px;font-size:12px}
.k-narrow .ac-cities{grid-template-columns:1fr 1fr}
.k-narrow .ac-hero{flex-wrap:wrap}

/* ---------- Nhật ký sự kiện (js/eventlog.js): khung chat nổi góc dưới trái ---------- */
.ev-btn,.ev-box{display:none}
html.nu #jxChat{display:none!important}                         /* thay bằng khung nhật ký */
html.nu #t-log #logBox{display:none!important}                  /* ô nhật ký trùng trong bảng Giang hồ */
html.nu .acbtn[hidden]{display:none}
html.nu .ev-box:not([hidden]){position:absolute;left:10px;top:170px;z-index:30;display:flex;flex-direction:column;width:min(380px,calc(100% - 20px));height:340px;   /* left/top/height do eventlog.js đặt theo nút */
  border-radius:18px;background:rgba(27,34,32,.94);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 12px 32px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.08);
  color:#eef3f0;font-family:var(--font);color-scheme:dark;overflow:hidden;animation:evIn .18s cubic-bezier(.2,.8,.2,1)}
@keyframes evIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ev-box{animation:none!important}}
.ev-h{display:flex;align-items:center;gap:8px;padding:8px 8px 6px 10px}
.ev-tabs{flex:1;display:flex;gap:4px;padding:3px;border-radius:999px;background:rgba(0,0,0,.25);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.ev-tabs button{flex:1;height:28px;border:0;border-radius:999px;background:none;color:#9fb0a7;font:500 12.5px var(--font);cursor:pointer}
.ev-tabs button:hover{color:#eef3f0}
.ev-tabs button[aria-selected=true]{background:rgba(255,193,7,.18);color:#ffd54f;box-shadow:inset 0 0 0 1px rgba(255,193,7,.35)}
.ev-x{width:30px!important;height:30px!important}.ev-x svg{width:16px;height:16px}
.ev-body{flex:1;min-height:0;overflow-y:auto;padding:4px 12px 12px;scrollbar-width:thin;scrollbar-color:#3d4945 transparent;outline:none}
.ev-feed{display:flex;flex-direction:column;gap:2px}
.ev-line{padding:4px 8px;border-radius:8px;font-size:12.5px;line-height:1.45;color:#dfe7e2;overflow-wrap:anywhere}
.ev-line:nth-child(odd){background:rgba(255,255,255,.025)}
.ev-line:last-child{background:rgba(255,193,7,.07)}
.ev-empty{margin:16px 0;text-align:center;font-size:12.5px;color:#6f7d77}
.ev-jump{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 12px 0 8px;border:0;border-radius:999px;cursor:pointer;
  background:#ffc107;color:#1f1600;font:600 12px var(--font);box-shadow:0 4px 12px rgba(0,0,0,.45)}
.ev-jump svg{width:16px;height:16px;fill:currentColor}
.ev-jump[hidden]{display:none}
/* Sổ tay */
.ev-note{margin:2px 0 10px;font-size:11.5px;line-height:1.45;color:#9fb0a7}
.ev-day{padding:10px 12px;margin-bottom:8px;border-radius:14px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.ev-dh{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px}
.ev-dh b{font:600 13.5px var(--font)}
.ev-dh span{font-size:11.5px;color:#9fb0a7}
.ev-tiles{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.ev-tiles>div{padding:6px 10px;border-radius:10px;background:rgba(0,0,0,.22)}
.ev-tiles small{display:block;font-size:10.5px;color:#9fb0a7}
.ev-tiles b{display:block;font:600 14px/1.3 var(--font);font-variant-numeric:tabular-nums}
.ev-tiles .ev-bad{color:#ff8a80}
.ev-drops{display:flex;gap:6px;margin-top:8px}
.ev-drops span{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;font-size:11.5px;background:rgba(0,0,0,.22)}
.ev-drops .r2{color:#ffd24a}.ev-drops .r3{color:#c77bff}.ev-drops .rs{color:#ffe082}
.ev-sub{margin:12px 0 6px;font:600 11px/1.4 var(--font);letter-spacing:.8px;text-transform:uppercase;color:#9fb0a7}
.ev-deaths{display:flex;flex-direction:column;gap:4px}
.ev-death{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:10px;background:rgba(239,83,80,.07)}
.ev-death time{flex:none;width:42px;font:600 12.5px var(--font);font-variant-numeric:tabular-nums;color:#ff8a80}
.ev-death time small{display:block;font-weight:400;font-size:10.5px;color:#9fb0a7}
.ev-death span{min-width:0;display:flex;flex-direction:column}
.ev-death span b{font:500 12.5px var(--font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ev-death span small{font-size:11px;color:#9fb0a7}

/* Nhật ký > Hôm nay (thay nút + hộp thoại "Hôm nay") */
html.nu #jxToday{display:none!important}
html.nu .ev-btn.ev-has::after{content:"";position:absolute;top:2px;left:22px;width:8px;height:8px;border-radius:50%;background:#66bb6a;box-shadow:0 0 0 2px rgba(20,26,24,.9)}
html.nu .ev-btn{position:relative}
.ev-buff{margin:2px 0 8px;padding:7px 12px;border-radius:999px;background:rgba(129,199,132,.12);color:#a5d6a7;font-size:12px}
.ev-buff b{color:#c8e6c9}
.ev-today{display:flex;flex-direction:column;gap:6px}
.ev-trow{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 12px;border-radius:12px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.ev-trow .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.ev-trow .t b{font:500 13px/1.3 var(--font);color:#9fb0a7}
.ev-trow .t small{font-size:11.5px;color:#6f7d77}
.ev-trow.ev-ready{background:rgba(255,193,7,.07);box-shadow:inset 0 0 0 1px rgba(255,193,7,.25)}
.ev-trow.ev-ready .t b{color:#eef3f0}
.ev-trow.ev-ready .t small{color:#9fb0a7}
.ev-trow .k-btn{height:28px;padding:0 14px;font-size:12px}

/* ---------- Võ công: dải điểm + thang cấp (màu loại chiêu: --lc) ---------- */
/* dải điểm: một dòng */
.vc-strip{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 14px;border-radius:999px;background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.vc-left{flex:none;font-size:12px;color:var(--k-dim);white-space:nowrap}
.vc-left b{font:600 15px var(--font);color:var(--k-text);font-variant-numeric:tabular-nums}
.vc-left.on b{color:var(--k-acc-lt)}
.vc-fcs{flex:1;min-width:0;display:flex;gap:5px;overflow:hidden}
.vc-fc{flex:0 1 auto;min-width:0;display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 10px 0 8px;border:0;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--k-line2);color:var(--k-dim);font:500 12px var(--font);transition:background-color .15s,box-shadow .15s,color .15s}
.vc-fc svg{flex:none;width:15px;height:15px;fill:var(--lc)}
.vc-fc span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vc-fc b{font-weight:600;font-variant-numeric:tabular-nums;color:color-mix(in srgb,var(--lc) 60%,#fff)}
.vc-fc:hover{color:var(--k-text);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--lc) 60%,transparent)}
.vc-fc.on{background:color-mix(in srgb,var(--lc) 20%,transparent);box-shadow:inset 0 0 0 1.5px var(--lc);color:#fff}
.vc-fc:focus-visible{outline:2px solid var(--k-acc-lt);outline-offset:2px}
.vc-strip>.k-btn{flex:none;height:30px;padding:0 14px;font-size:12.5px}
.vc-reset{flex:none;width:30px;height:30px}
.vc-reset svg{width:17px;height:17px}
.vc-reset:disabled{opacity:.35;cursor:default}

/* thang cấp: rãnh dọc bên trái, mỗi bậc một mốc */
.vc-ladder{position:relative;margin-top:14px}
.vc-ladder::before{content:"";position:absolute;left:21px;top:14px;bottom:14px;width:2px;border-radius:2px;background:var(--k-line2)}
.vc-tier{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr);gap:10px;align-items:start}
.vc-tier+.vc-tier{margin-top:12px}
.vc-tm{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding-top:8px}
.vc-tm i{width:16px;height:16px;margin-left:14px;border-radius:50%;display:grid;place-items:center;background:var(--k-surface);box-shadow:inset 0 0 0 2px var(--k-line2)}
.vc-tm i svg{width:10px;height:10px;fill:var(--k-faint)}
.vc-tm b{font:600 11.5px/1.2 var(--font);color:var(--k-faint);white-space:nowrap;font-variant-numeric:tabular-nums}
.vc-tier.open .vc-tm i{background:var(--k-acc);box-shadow:0 0 0 3px var(--k-surface)}
.vc-tier.open .vc-tm b{color:var(--k-acc-lt)}
.vc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:8px 18px}

/* thẻ chiêu: biểu tượng chiêu + huy hiệu loại đứng riêng, nổi bật (không khung); bên phải là khung mềm chứa tên / loại / điểm / nút.
   đã học: biểu tượng có quầng màu loại, khung ngả nhẹ màu loại · chưa học: khung xám trung tính · chưa đủ cấp: cả thẻ xám
   học tối đa: quầng vàng kim quanh biểu tượng + dấu MAX · sai vũ khí: biểu tượng xám, chữ đỏ */
.vc-sk{position:relative;display:flex;align-items:center;gap:0;min-width:0;cursor:pointer;border-radius:12px}
.vc-sk:focus-visible{outline:2px solid var(--k-acc-lt);outline-offset:2px}
.vc-body{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:0 8px;margin-left:-21px;padding:6px 8px 6px 29px;border-radius:12px;
  background:color-mix(in srgb,var(--lc) 5%,rgba(255,255,255,.025));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--lc) 28%,transparent);transition:background-color .15s,box-shadow .15s}
.vc-sk:hover .vc-body{background:color-mix(in srgb,var(--lc) 9%,rgba(255,255,255,.04));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--lc) 50%,transparent)}
/* tên chiêu đã học: màu hệ ngũ hành của nhân vật (--el đặt trên .k-dialog) */
.vc-sk .vc-tx>b{color:color-mix(in srgb,var(--el,#f4f7f5) 85%,#fff)}
.vc-sk.vc-off .vc-body{background:rgba(255,255,255,.018);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.vc-sk.vc-off:hover .vc-body{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--lc) 40%,transparent)}
.vc-sk.vc-off .vc-tx>b{color:var(--k-dim);font-weight:500}
.vc-sk.vc-off .vc-type{color:var(--k-faint);font-weight:500}
.vc-sk.vc-off .vc-pt b{color:var(--k-faint)}
.vc-sk.vc-lock{filter:grayscale(1);opacity:.45}
.vc-sk.vc-lock:hover{opacity:.6}
.vc-sk.vc-nowp .vc-ic img{filter:grayscale(1);opacity:.5}
/* biểu tượng: không viền; đã học có quầng màu loại, học tối đa quầng vàng kim */
.vc-ic{position:relative;z-index:1;flex:none;width:42px;height:42px;display:grid;place-items:center}
.vc-ic img{width:38px;height:38px;border-radius:9px;pointer-events:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.vc-sk:not(.vc-off) .vc-ic img{filter:drop-shadow(0 0 6px color-mix(in srgb,var(--lc) 60%,transparent)) drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.vc-sk.vc-maxed .vc-ic img{filter:drop-shadow(0 0 7px rgba(255,200,60,.75)) drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.vc-ic .vc-b{position:absolute;right:-6px;bottom:-6px;width:20px;height:20px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.7))}
.vc-tx{min-width:0;display:flex;flex-direction:column;gap:3px}
.vc-tx>b{display:flex;align-items:center;gap:5px;min-width:0;font:600 12.5px/1.25 var(--font)}
.vc-tx>b>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vc-mainic{flex:none;width:14px;height:14px;display:grid;place-items:center;font-style:normal}
.vc-mainic svg{display:block;width:14px;height:14px;fill:var(--k-acc)}
/* dòng 2: loại (chữ màu loại, không viền) · DPS */
.vc-meta{display:flex;align-items:baseline;gap:8px;min-width:0;white-space:nowrap}
.vc-type{min-width:0;overflow:hidden;text-overflow:ellipsis;font:600 10.5px/1.3 var(--font);color:color-mix(in srgb,var(--lc) 75%,#fff)}
.vc-type.vc-wbad{color:#ff6e6e}
.vc-dps{flex:none;font:600 11px/1.3 var(--font);font-style:normal;color:var(--k-text);font-variant-numeric:tabular-nums}
.vc-dps small{font-size:10.5px;font-weight:500;color:var(--k-faint)}
/* điểm đã học / tối đa */
.vc-pt{display:flex;align-items:baseline;gap:1px;min-width:44px;justify-content:flex-end;font-variant-numeric:tabular-nums}
.vc-pt b{font:600 14px/1 var(--font)}
.vc-pt small{font-size:11px;color:var(--k-faint)}
.vc-pt em{margin-left:3px;font:600 10.5px var(--font);font-style:normal;color:#81c784}
/* học tối đa: dấu MAX vàng kim + viền vàng quanh biểu tượng */
.vc-max{display:flex;align-items:center;gap:3px;min-width:44px;justify-content:flex-end}
.vc-max svg{width:18px;height:18px;fill:#e9b949;fill:url(#jxGoldG);filter:drop-shadow(0 0 4px rgba(255,193,7,.45))}
.vc-max b{font:800 11px/1 var(--font);letter-spacing:.6px;background:linear-gradient(135deg,#fff3c4,#e9b949 45%,#9c6b1d);-webkit-background-clip:text;background-clip:text;color:transparent}
.vc-pm{display:flex;gap:6px}
.vc-pm .cm-pmb{width:24px;height:24px;margin:0}
.vc-pm .cm-pmb svg{width:14px;height:14px}
.vc-pm .cm-pmb:disabled{opacity:1;cursor:default;background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);color:#4f5b56}
/* dải điểm: huy hiệu loại trên viên lọc */
.vc-fc .vc-fcb{flex:none;width:17px;height:17px}

/* thanh nhỏ trong Bộ võ học */
.vc-bar{display:flex;gap:2px;height:6px;margin-top:6px;max-width:260px;border-radius:999px;overflow:hidden;background:var(--k-input)}
.vc-bar i{min-width:4px;background:rgba(255,255,255,.06)}

/* Bộ võ học */
.vc-bd{display:flex;align-items:center;gap:12px;padding:10px 0}
.vc-bd+.vc-bd{border-top:1px solid var(--k-line)}
.vc-bi{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.vc-bi b{font:600 13.5px var(--font)}
.vc-bi small{font-size:11.5px;color:var(--k-dim)}
.vc-bd .k-btns{flex-wrap:nowrap;margin:0}

.k-narrow .vc-grid{grid-template-columns:1fr}
.k-narrow .vc-tier{grid-template-columns:46px minmax(0,1fr)}

/* ---------- Hoạt động › Tài Xỉu ---------- */
.tx-table{margin-top:12px;padding:14px;border-radius:16px;background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line);display:flex;flex-direction:column;gap:12px}
.tx-res{display:flex;align-items:center;gap:14px;padding:10px 14px;border-radius:14px;background:var(--k-input)}
.tx-res p{flex:1;margin:0;font-size:12.5px;color:var(--k-dim)}
.tx-res p b{color:var(--k-text)}
.tx-res.win{box-shadow:inset 0 0 0 1px rgba(129,199,132,.55);background:rgba(129,199,132,.08)}
.tx-res.win p{color:#a5d6a7}
.tx-res.lose{box-shadow:inset 0 0 0 1px rgba(239,83,80,.35)}
.tx-res.idle .tx-die{opacity:.45}
.tx-dice{display:flex;gap:8px}
.tx-dice.roll .tx-die{animation:txRoll .6s cubic-bezier(.2,.8,.2,1)}
.tx-dice.roll .tx-die:nth-child(2){animation-delay:.06s}.tx-dice.roll .tx-die:nth-child(3){animation-delay:.12s}
@keyframes txRoll{0%{transform:rotate(-200deg) scale(.6);opacity:0}70%{transform:rotate(12deg) scale(1.05)}100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.tx-dice.roll .tx-die{animation:none}}
.tx-die{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:2px;width:38px;height:38px;padding:6px;box-sizing:border-box;border-radius:9px;background:#f4efe6;box-shadow:0 2px 4px rgba(0,0,0,.45),inset 0 -2px 0 rgba(0,0,0,.12)}
.tx-die i{border-radius:50%}
.tx-die i.on{background:#1b2220}
.tx-die.red i.on{background:#d32f2f}
.tx-sum{display:flex;flex-direction:column;align-items:center;min-width:44px}
.tx-sum b{font:700 22px/1 var(--font);font-variant-numeric:tabular-nums}
.tx-sum small{font-size:11px;color:var(--k-dim)}
.tx-bet{display:flex;align-items:center;gap:10px;justify-content:space-between}
.tx-bet>span{font-size:12px;color:var(--k-dim)}
.tx-doors{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.tx-door{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;border:0;border-radius:16px;cursor:pointer;color:var(--k-text);
  background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--k-line2);transition:background-color .15s,box-shadow .15s,transform .1s}
.tx-door b{font:700 15px/1.1 var(--font)}
.tx-door small{font-size:11px;color:var(--k-dim)}
.tx-door em{font:600 12px var(--font);font-style:normal;color:var(--k-acc-lt)}
.tx-door:hover:not(:disabled){box-shadow:inset 0 0 0 1.5px var(--k-acc);background:var(--k-acc-tone)}
.tx-door:active:not(:disabled){transform:scale(.97)}
.tx-door:disabled{opacity:.4;cursor:default}
.tx-door.tx-boba{background:rgba(239,83,80,.08);box-shadow:inset 0 0 0 1px rgba(239,83,80,.35)}
.tx-door.tx-boba em{color:#ff8a80}
.tx-door:focus-visible{outline:2px solid var(--k-acc-lt);outline-offset:2px}
.tx-log{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--k-dim)}
.tx-log .w{color:#a5d6a7}

/* ---------- Bản đồ (bấm bản đồ nhỏ) ---------- */
.mp-cur{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.mp-ct{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.mp-ct>b{font:600 16px var(--font)}
.mp-ct>span{font-size:12.5px;color:var(--k-dim)}
.mp-ct>span b{color:var(--k-text)}
.mp-boss{margin-left:6px;font-style:normal;font-weight:600;color:#ff8a80}
.mp-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:11.5px;color:var(--k-dim)}
.mp-el{font-weight:600;color:var(--c)}
.mp-nav{display:flex;gap:8px}
.mp-nav .k-iconbtn:disabled{opacity:.35;cursor:default}
.mp-zs{display:flex;flex-direction:column}
.mp-z{display:flex;align-items:center;gap:10px;min-height:40px;padding:4px 0}
.mp-z+.mp-z{border-top:1px solid var(--k-line)}
.mp-z .t{flex:1;min-width:0;display:flex;align-items:baseline;gap:8px}
.mp-z .t b{font:500 13.5px var(--font)}
.mp-z .t small{font-size:11.5px;color:var(--k-dim)}
.mp-z .k-btn{height:28px;padding:0 14px;font-size:12px}
.mp-z.here .t b{color:var(--k-acc-lt)}
.mp-here{font-size:11.5px;color:var(--k-acc-lt)}
.mp-z.lock .t b{color:var(--k-faint)}
.mp-lock{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;color:var(--k-faint)}
.mp-lock svg{width:12px;height:12px;fill:currentColor}

/* ---------- Nhật ký › Sổ tay › Việc cần làm ---------- */
.ev-sub0{margin-top:0}
.ev-todo{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.ev-tdo{display:flex;align-items:center;gap:10px;width:100%;min-height:36px;padding:4px 8px 4px 6px;border:0;border-radius:999px;cursor:pointer;text-align:left;color:#eef3f0;
  background:rgba(255,193,7,.07);box-shadow:inset 0 0 0 1px rgba(255,193,7,.28);transition:background-color .15s,box-shadow .15s}
.ev-tdo:hover{background:rgba(255,193,7,.14);box-shadow:inset 0 0 0 1px rgba(255,193,7,.6)}
.ev-tdo:focus-visible{outline:2px solid #ffd54f;outline-offset:2px}
.ev-tdo .ic{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:rgba(255,193,7,.16)}
.ev-tdo .ic svg{width:15px;height:15px;fill:#ffd54f}
.ev-tdo .t{flex:1;min-width:0;font:500 12.5px/1.3 var(--font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ev-tdo .chev{flex:none;width:18px;height:18px;fill:#9fb0a7}

/* ---------- Túi: Hành trang · Nguyên liệu · Kho chung (js/menus.js openInv) ---------- */
.iv-bar{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.iv-cap{flex:none;display:grid;grid-template-columns:auto auto;align-items:baseline;gap:0 8px;min-width:120px}
.iv-cap>span{font-size:11.5px;color:var(--k-dim)}
.iv-cap>b{justify-self:end;font:600 14px var(--font);font-variant-numeric:tabular-nums}
.iv-cap>b small{font-size:11px;font-weight:500;color:var(--k-faint)}
.iv-cap>i{grid-column:1 / -1;height:4px;margin-top:4px;border-radius:999px;background:var(--k-input);overflow:hidden}
.iv-cap>i b{display:block;height:100%;border-radius:999px;background:#81c784}
.iv-cap.warn>i b{background:var(--k-acc)}.iv-cap.full>i b{background:var(--k-danger)}
/* tìm kiếm + sắp xếp: biểu tượng đứng riêng trước ô; ô nhập chỉ một viền pill */
.iv-ico{flex:none;width:20px;height:20px;display:grid;place-items:center}
.iv-ico svg{width:19px;height:19px;fill:var(--k-dim)}
.iv-bar .iv-kw{flex:1;min-width:0;height:34px;padding:0 14px!important;border:0!important;border-image:none!important;border-radius:999px!important;
  background:var(--k-input)!important;box-shadow:inset 0 0 0 1px var(--k-line2)!important;outline:none;color:var(--k-text);font:13px var(--font)}
.iv-bar .iv-kw:focus{box-shadow:inset 0 0 0 1.5px var(--k-acc)!important}
.iv-cap+.iv-ico{margin-left:6px}
.iv-bar .k-select,.iv-bar select{flex:none;width:150px}
.iv-filt{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.iv-chip{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 13px;border:0;border-radius:999px;cursor:pointer;font:500 12px var(--font);color:var(--k-dim);
  background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--k-line2);transition:background-color .15s,box-shadow .15s,color .15s}
.iv-chip:hover{color:var(--k-text)}
.iv-chip.on{background:var(--k-acc-tone);box-shadow:inset 0 0 0 1px rgba(255,193,7,.55);color:var(--k-acc-lt)}
.iv-chip svg{width:16px;height:16px;fill:#81c784}
.iv-grid{display:grid;grid-template-columns:repeat(auto-fill,56px);grid-auto-rows:56px;justify-content:space-between;gap:12px 14px;padding:7px 7px 2px}
.iv-grid-s{grid-template-columns:repeat(auto-fill,50px);grid-auto-rows:50px;gap:12px 13px}
.iv-it{position:relative;width:100%;height:100%;padding:0;border:0;border-radius:12px;cursor:pointer;display:grid;place-items:center;
  background:rgba(14,19,17,.78);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--rc,#fff) 55%,transparent);transition:background-color .15s,box-shadow .15s,transform .1s}
.iv-it:hover{background:rgba(26,33,30,.92);box-shadow:inset 0 0 0 2px var(--rc,#fff)}
.iv-it:active{transform:scale(.96)}
.iv-it:focus-visible{outline:2px solid var(--k-acc-lt);outline-offset:2px}
.iv-it img{position:absolute;left:11%;top:11%;width:78%;height:78%;object-fit:contain;pointer-events:none}
.iv-it.bad{box-shadow:inset 0 0 0 2px var(--k-danger)}
.iv-it.bad img{opacity:.5;filter:grayscale(.6)}
.iv-enh{position:absolute;right:4px;bottom:3px;font:700 10px/1 var(--font);color:var(--k-acc-lt);text-shadow:0 1px 2px #000}
.iv-it .iv-el{position:absolute;left:-6px;top:-6px;width:21px;height:21px;z-index:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.7))}
.iv-up{position:absolute;right:-6px;top:-6px;z-index:1;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;text-decoration:none;background:#2e7d32;box-shadow:0 0 0 2px var(--k-surface),0 1px 3px rgba(0,0,0,.6)}
.iv-up svg{width:20px;height:20px;fill:#fff;transform:translateY(-1px)}
.iv-lk{position:absolute;left:4px;bottom:4px;width:12px;height:12px;text-decoration:none}
.iv-lk svg{width:12px;height:12px;fill:#cfd8d3;filter:drop-shadow(0 1px 1px #000)}
.iv-empty{margin:8px 2px;font-size:12.5px;color:var(--k-faint)}
.iv-acts{margin-top:14px;align-items:center}
.iv-sp{flex:1}
/* nguyên liệu */
.iv-mr{display:flex;align-items:center;gap:10px;min-height:36px;padding:2px 0}
.iv-mr+.iv-mr{border-top:1px solid var(--k-line)}
.iv-mr .pcico{flex:none;width:28px;height:28px;border-radius:50%;background:#151b19 center/22px 22px no-repeat}
.iv-mr .t{flex:1;min-width:0}
.iv-mr .t b{font:500 13px var(--font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.iv-n{font:600 13px var(--font);font-variant-numeric:tabular-nums;min-width:36px;text-align:right}
.iv-ns{font-size:11px;color:var(--k-faint);min-width:52px;text-align:right;font-variant-numeric:tabular-nums}
.iv-mb{display:flex;gap:4px}
.iv-mb .k-iconbtn{width:28px;height:28px}
.iv-mb .k-iconbtn svg{width:16px;height:16px}
.iv-mb .k-iconbtn:disabled{opacity:.3;cursor:default}
/* kho chung */
.iv-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.iv-col{min-width:0;padding:12px;border-radius:16px;background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.iv-ch{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:8px}
.iv-ch b{font:600 13px var(--font)}
.iv-ch span{font-size:12px;color:var(--k-dim);font-variant-numeric:tabular-nums}
.iv-col .iv-grid{max-height:320px;overflow-y:auto;scrollbar-width:thin;padding:7px 7px 2px}
.iv-hint{display:block;margin-top:8px;font-size:11px;color:var(--k-faint)}
.iv-gold{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.iv-gold>span{font-size:12px;color:var(--k-dim)}
.iv-gold>span b{color:var(--k-text);font-variant-numeric:tabular-nums}
.iv-gold input{flex:1;min-width:110px;height:34px;padding:0 14px!important;border:0!important;border-image:none!important;border-radius:999px;background:var(--k-input)!important;box-shadow:inset 0 0 0 1px var(--k-line2);color:var(--k-text);font:13px var(--font)}
.k-narrow .iv-cols{grid-template-columns:1fr}
/* hộp chi tiết món đồ */
.iv-det{display:flex;gap:12px;align-items:flex-start}
.iv-big{flex:none;width:64px;height:64px;border-radius:14px;display:grid;place-items:center;background:rgba(14,19,17,.8);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--rc) 70%,transparent),0 0 12px color-mix(in srgb,var(--rc) 25%,transparent)}
.iv-big img{max-width:48px;max-height:48px}
.iv-lines{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:12px;line-height:1.45}
.iv-l.b{color:#dfe7e2}
.iv-l.m,.iv-l.on{color:#8fb4ff}
.iv-l.h{color:var(--k-faint)}   /* dòng ẩn chưa kích hoạt: xám, không tác dụng */
.iv-l.h.on{color:#8fb4ff}
.iv-l.off,.iv-l.dim{color:var(--k-faint)}
.iv-l.g{color:#a5d6a7}
.iv-cmp{margin-top:12px;padding:10px 12px;border-radius:14px;background:var(--k-input)}
.iv-cmph{font-size:11.5px;color:var(--k-dim);margin-bottom:8px}
.iv-cmph span{color:var(--k-faint)}
.iv-cs{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.iv-c{display:flex;flex-direction:column;align-items:center;gap:1px;padding:5px 2px;border-radius:10px;background:rgba(255,255,255,.03)}
.iv-c small{font-size:10px;color:var(--k-faint)}
.iv-c b{font:600 12px var(--font);font-variant-numeric:tabular-nums}
.iv-c.up b{color:#81c784}.iv-c.dn b{color:#ff8a80}.iv-c.eq b{color:var(--k-dim)}
.ivitem .cm-alert{margin-top:10px}
.ivitem .k-foot{flex-wrap:wrap}

/* Túi: ngân lượng trên phụ đề (biểu tượng money2.png như HUD) */
.iv-gsub{display:inline-flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums;color:#ffe082}
.iv-gsub img{width:15px;height:15px;object-fit:contain;transform:translateY(1px)}

/* Túi › Kho nguyên liệu (STG 2) */
.iv-msub{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}

/* Túi › Hành trang: Bộ lọc nhặt / Lò rèn — nút nhỏ có biểu tượng, cuối hàng lọc loại */
.iv-filt{align-items:center}
.iv-tool{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 12px 0 9px;border:0;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--k-line2);color:#cfd8d3;font:500 11.5px var(--font);transition:background-color .15s,box-shadow .15s,color .15s}
.iv-tool svg{width:15px;height:15px;fill:var(--k-acc-lt)}
.iv-tool:hover{color:#fff;box-shadow:inset 0 0 0 1px rgba(255,213,79,.55)}
.iv-tool:focus-visible{outline:2px solid var(--k-acc-lt);outline-offset:2px}

/* Hộp chi tiết món: huy hiệu hệ, tiêu đề nhỏ + cấp yêu cầu, chip yêu cầu dưới ảnh */
.ivitem .k-badge.iv-elb{background:none;padding:0}
.ivitem .k-badge.iv-elb svg{width:30px;height:30px}
.ivitem .k-titles h2{font-size:13.5px}
.iv-hlv{display:inline-block;margin-right:8px;color:#dfe7e2;font-weight:600}
.iv-hlv.bad{color:#ff6e6e}
.iv-side{flex:none;width:64px;display:flex;flex-direction:column;gap:5px}
.iv-rq{display:flex;align-items:center;gap:5px;font-size:11.5px;color:#dfe7e2;white-space:nowrap;overflow:hidden}
.iv-rq svg{flex:none;width:14px;height:14px;fill:var(--qc)}
.iv-rq b{font-weight:600;overflow:hidden;text-overflow:ellipsis}
.iv-rq.bad b{color:#ff6e6e}
.iv-side .iv-big{margin-bottom:3px}

/* Nhân vật: biểu tượng hệ đè góc trên trái ô trang bị (giống ô Túi); không hiện cấp món */
.cm-slot .iv-el{position:absolute;left:-5px;top:-5px;width:19px;height:19px;z-index:2;filter:drop-shadow(0 1px 2px rgba(0,0,0,.7))}

/* Hộp chi tiết món: chip thao tác phụ nhỏ hơn, mỗi chip một màu; cảnh báo sát hàng nút */
.ivitem .k-foot{padding-top:6px}
.ivitem .cm-alert{margin-top:10px;margin-bottom:0}
.ivitem .k-foot .k-ico{width:30px;height:30px}
.ivitem .k-foot .k-ico svg{width:15px;height:15px}
.ivitem .k-foot .k-ico.ic-box{color:#64b5f6;box-shadow:inset 0 0 0 1px rgba(100,181,246,.45)}
.ivitem .k-foot .k-ico.ic-forge{color:#ffb74d;box-shadow:inset 0 0 0 1px rgba(255,183,77,.45)}
.ivitem .k-foot .k-ico.ic-lock{color:#b0bec5;box-shadow:inset 0 0 0 1px rgba(176,190,197,.4)}
.ivitem .k-foot .k-ico.ic-lock.k-on{color:#ffd54f;background:rgba(255,213,79,.14);box-shadow:inset 0 0 0 1px rgba(255,213,79,.55)}
.ivitem .k-foot .k-ico.ic-keep{color:#ce93d8;box-shadow:inset 0 0 0 1px rgba(206,147,216,.4)}
.ivitem .k-foot .k-ico.ic-keep.k-on{background:rgba(206,147,216,.14)}

/* ===== Nhiệm vụ (PC): nút dưới dải ải + hộp thoại ===== */
html.nu .pcquest{position:absolute;z-index:5;height:30px;display:flex;align-items:center;justify-content:center;gap:6px;padding:0 10px;box-sizing:border-box;
  border:0;border-radius:999px;cursor:pointer;pointer-events:auto;background:rgba(20,26,24,.88);color:#eef3f0;font:600 11.5px var(--font);
  box-shadow:0 2px 8px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.12);transition:box-shadow .15s}
html.nu .pcquest svg{flex:none;width:15px;height:15px;fill:#ffd54f}
html.nu .pcquest:hover,html.nu .pcquest.on{box-shadow:0 2px 8px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,213,79,.55)}
html.nu .pcquest:focus-visible{outline:2px solid #ffd54f;outline-offset:2px}
html.nu .pcquest em{position:absolute;right:-4px;top:-6px;min-width:16px;height:16px;padding:0 4px;box-sizing:border-box;border-radius:999px;background:#43a047;color:#fff;
  font:700 10px/16px var(--font);font-style:normal;text-align:center;box-shadow:0 0 0 2px rgba(14,19,17,.9)}
.pcquest[hidden],.pcquest em[hidden],html:not(.nu) .pcquest{display:none!important}

.qs-bar{display:block;height:5px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.qs-bar i{display:block;height:100%;border-radius:inherit;background:#ffd54f;transition:width .3s}
.qs-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.qs-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:var(--k-input)}
.qs-row.ready{box-shadow:inset 0 0 0 1px rgba(129,199,132,.55)}
.qs-row.ready .qs-bar i{background:#81c784}
.qs-row.done{opacity:.6}
.qs-row.lock{opacity:.5}
.qs-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.qs-t b{font:500 12.5px/1.35 var(--font);color:#eef3f0}
.qs-t small{font-size:11px;line-height:1.35;color:var(--k-dim)}
.qs-n{flex:none;font:600 11.5px var(--font);color:var(--k-dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.qs-ok,.qs-lock{flex:none;display:inline-flex;align-items:center;gap:4px;font-size:11.5px;color:#81c784;white-space:nowrap}
.qs-lock{color:var(--k-faint)}
.qs-ok svg,.qs-lock svg{width:14px;height:14px;fill:currentColor}
.qs-lv{flex:none;width:34px;height:34px;border-radius:999px;display:grid;place-items:center;background:var(--k-acc-tone);color:var(--k-acc-lt);font:700 12px var(--font)}
.qs-row.lock .qs-lv{background:rgba(255,255,255,.06);color:var(--k-faint)}
.qs-days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.qs-day{position:relative;display:flex;flex-direction:column;gap:4px;padding:8px 6px;border-radius:12px;background:var(--k-input);text-align:center;min-height:72px}
.qs-day b{font:600 11px var(--font);color:var(--k-dim)}
.qs-day small{font-size:10.5px;line-height:1.3;color:#dfe7e2}
.qs-day.cur{box-shadow:inset 0 0 0 1.5px #ffd54f}
.qs-day.cur b{color:#ffd54f}
.qs-day.got{opacity:.55}
.qs-day svg{position:absolute;right:5px;top:5px;width:13px;height:13px;fill:#81c784}
.qs-ms{display:flex;flex-direction:column;gap:9px}
.qs-mrow{display:grid;grid-template-columns:60px 1fr 90px 60px;align-items:center;gap:10px;font-size:11.5px}
.qs-mrow b{color:#eef3f0;font-weight:600}
.qs-mrow small{color:var(--k-dim)}
.qs-mrow>span:last-child{text-align:right;color:var(--k-dim);font-variant-numeric:tabular-nums}
.qs-mrow.got>span:last-child{color:#81c784}
.qs-odds{display:flex;flex-direction:column;gap:8px}
.qs-odd{display:grid;grid-template-columns:1fr 110px 38px;align-items:center;gap:10px;font-size:12px;color:#dfe7e2}
.qs-odd b{text-align:right;font-weight:600;color:var(--k-dim);font-variant-numeric:tabular-nums}
.k-narrow .qs-days{grid-template-columns:repeat(4,1fr)}
.k-narrow .qs-mrow{grid-template-columns:52px 1fr 52px}
.k-narrow .qs-mrow .qs-bar{display:none}
.ac-login{--ac:#81c784} .ac-quest{--ac:#ffd54f} .ac-yt{--ac:#a1887f} .ac-lvms{--ac:#64b5f6} .ac-chest{--ac:#f06292} .ac-event{--ac:#ffb74d}
/* số trên nút Nhiệm vụ: nằm trong viên thuốc (nút sát mép phải màn hình, góc ngoài sẽ bị cắt) */
html.nu .pcquest em{position:static;margin-left:2px;box-shadow:none}

/* ===== Thông báo (PC): cùng kiểu đỏ nổi bật với .k-dot / .k-cnt (ui-kit.css) ===== */
html.nu .acbtn em,html.nu .pcquest em{background:var(--k-noti);color:#fff;box-shadow:var(--k-noti-ring)}
html.nu .ev-btn em{background:rgba(255,255,255,.14);color:#dfe7e2;box-shadow:none}   /* số dòng nhật ký chưa đọc: chỉ thông tin, không cần làm gì */
html.nu .ev-btn.ev-has::after{width:9px;height:9px;background:var(--k-noti);box-shadow:var(--k-noti-ring);animation:kNoti 2.4s ease-in-out infinite}
html.nu #giftBtn.on::after,html.nu #jxToday.on::after{width:9px;height:9px;border:0;background:var(--k-noti);box-shadow:var(--k-noti-ring);animation:kNoti 2.4s ease-in-out infinite}
html.nu #giftTabs .gdot{width:8px;height:8px;border:0;background:var(--k-noti);box-shadow:var(--k-noti-ring)}
html.nu #tabs .tray .dot{width:9px;height:9px;border:0;background:var(--k-noti);box-shadow:var(--k-noti-ring)}
.ev-tabs .k-cnt{margin-left:5px}
@media (prefers-reduced-motion:reduce){html.nu .ev-btn.ev-has::after,html.nu #giftBtn.on::after,html.nu #jxToday.on::after{animation:none}}
.k-md.qsmenu{width:min(630px,100%)}   /* 6 thẻ + chấm thông báo vừa một hàng, không phải cuộn */
/* Ô món: ảnh giữ kích thước gốc, chỉ thu nhỏ khi lớn hơn ô (không phóng to: nhẫn / ám khí 24px bị nhòe khi kéo lên ~44px).
   Căn giữa bằng grid (không dùng translate -50% để tránh nửa điểm ảnh làm mờ). */
.iv-it{display:grid;place-items:center}
.iv-it img{position:static;left:auto;top:auto;width:auto;height:auto;max-width:78%;max-height:78%;object-fit:contain}
.iv-it{grid-template:100% / 100%;overflow:hidden}   /* hàng/cột xác định để max-height 78% có hiệu lực (vũ khí dài ~100px không tràn ô) */
.iv-it img{min-width:0;min-height:0}
/* Biểu tượng hệ / ▲ nâng cấp nằm gọn TRONG ô (ô cắt phần tràn), nhỏ hơn; viền độ hiếm dịu hơn */
.iv-it{box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--rc,#fff) 38%,transparent)}
.iv-it:hover{box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--rc,#fff) 75%,transparent)}
.iv-it.bad{box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--k-danger) 70%,transparent)}
.iv-it .iv-el{left:3px;top:3px;width:14px;height:14px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.8))}
.iv-up{right:3px;top:3px;width:14px;height:14px;box-shadow:0 1px 2px rgba(0,0,0,.6)}
.iv-up svg{width:14px;height:14px}
.cm-slot .iv-el{left:3px;top:3px;width:14px;height:14px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.8))}

.iv-why{margin-top:6px;font-size:11px;color:var(--k-faint)}   /* lý do hệ thống tự xử lý giữ món ở hành trang */

/* Hàng thao tác cuối thẻ (Nguyên liệu, Đồ rác): cùng kiểu .iv-tool với Bộ lọc nhặt / Lò rèn, dồn phải */
.iv-tools{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-top:14px}
.iv-tool img{width:16px;height:16px;object-fit:contain}
.iv-tool:disabled{opacity:.42;cursor:default;box-shadow:inset 0 0 0 1px var(--k-line2);color:#cfd8d3}
.iv-tool.danger{color:#ff8a80}
.iv-tool.danger:hover:not(:disabled){color:#ffb4ab;box-shadow:inset 0 0 0 1px rgba(255,138,128,.6)}

/* Đồ Tím: ô dòng trống; nút gửi Kho nguyên liệu; hộp Luyện Tím */
.iv-l.iv-slot{color:#b388ff;opacity:.75}
.ivitem .k-foot .k-ico.ic-mat{color:#b388ff;box-shadow:inset 0 0 0 1px rgba(179,136,255,.45)}
.vm-lead{margin:0 0 12px;font-size:12px;line-height:1.5;color:var(--k-dim)}
.vm-lead b{color:#eef3f0}
.vm-res{display:flex;gap:10px;margin:12px 0}
.vm-res span{flex:1;display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:12px;background:var(--k-input)}
.vm-res small{font-size:11px;color:var(--k-faint)}
.vm-res b{font:600 15px var(--font);color:#b388ff}

/* ===== Nguyên liệu dạng ô: biểu tượng, cấp góc trên trái, số lượng góc dưới phải ===== */
.mt-sec+.mt-sec{margin-top:14px}
.mt-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 2px 2px;font:600 11px var(--font);letter-spacing:.6px;text-transform:uppercase;color:var(--k-dim)}
.mt-h small{font:400 11px var(--font);letter-spacing:0;text-transform:none;color:var(--k-faint)}
.mt-it .mt-ic{width:36px;height:36px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.mt-it.mt-pot{cursor:default}
.mt-it.mt-pot img{max-width:60%;max-height:60%}
.mt-it.off .mt-ic{opacity:.45}
.mt-lv{position:absolute;left:4px;top:3px;min-width:14px;height:14px;padding:0 3px;box-sizing:border-box;border-radius:999px;background:rgba(14,19,17,.85);
  font:700 9.5px/14px var(--font);text-align:center;color:var(--rc);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rc) 55%,transparent)}
.mt-n{position:absolute;right:4px;bottom:3px;font:700 10.5px/1 var(--font);color:#eef3f0;text-shadow:0 1px 2px #000,0 0 2px #000}
.mt-st{position:absolute;left:5px;bottom:5px;width:6px;height:6px;border-radius:50%;background:#90a4ae;box-shadow:0 0 0 1.5px rgba(14,19,17,.9)}
.mt-det{display:flex;gap:14px;align-items:center}
.mt-big{flex:none;width:64px;height:64px;border-radius:14px;display:grid;place-items:center;background:rgba(14,19,17,.8);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--rc) 55%,transparent)}
.mt-big .mt-ic{width:46px;height:46px}
.mt-det p{margin:0 0 6px;font-size:12px;line-height:1.45;color:#dfe7e2}
.mt-det .mt-cnt{color:var(--k-dim)}
.mt-det .mt-cnt b{color:#eef3f0}

.mt-it .mt-el,.mt-big .mt-el{position:absolute;left:4px;bottom:4px;width:13px;height:13px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.8))}
.mt-big{position:relative}
.mt-big .mt-el{width:18px;height:18px}
.mt-st{left:auto;right:5px;bottom:auto;top:5px}

.mt-det .mt-attr{font-weight:600;font-size:12.5px}
.mt-det .mt-note{font-size:11px;color:var(--k-faint)}

/* ===== Túi gọn hơn: điều khiển 30px, khoảng cách nhỏ, thanh công cụ trên cùng mỗi thẻ ===== */
.ivmenu .iv-bar{margin-bottom:8px;gap:8px}
.ivmenu .iv-bar .iv-kw{height:30px;font-size:12.5px}
.ivmenu .iv-bar .k-select,.ivmenu .iv-bar select{width:136px}
.ivmenu .iv-bar .k-sel-btn,.ivmenu .iv-bar .k-selbtn{height:30px}
.ivmenu .iv-cap{min-width:104px}
.ivmenu .iv-filt{margin-bottom:8px;gap:5px}
.ivmenu .iv-chip{height:28px;padding:0 11px;font-size:11.5px}
.ivmenu .iv-tool{height:28px;font-size:11px}
.ivmenu .iv-grid{gap:10px 12px;padding:5px 5px 2px}
.ivmenu .iv-msub{margin-bottom:8px;gap:8px}
.ivmenu .iv-msub .k-seg{height:30px}
.ivmenu .iv-msub .k-seg button{height:24px;font-size:12px}
.ivmenu .iv-cols{gap:10px;margin-bottom:10px}
.ivmenu .iv-col{padding:10px 10px 8px;border-radius:14px}
.ivmenu .iv-ch{margin-bottom:4px}
.ivmenu .iv-gold{gap:8px;padding:8px 10px;border-radius:14px;background:var(--k-card);box-shadow:inset 0 0 0 1px var(--k-line)}
.ivmenu .iv-gold input{height:28px;min-width:90px;max-width:160px;font-size:12px}
.iv-gl{display:inline-flex;align-items:center;gap:5px;font-weight:600;color:var(--k-text)!important}
.iv-gl svg{width:15px;height:15px;fill:#ffd54f}
.ivmenu .mt-sec+.mt-sec{margin-top:10px}
.ivmenu .mt-h{margin-bottom:0}
.ivmenu .iv-empty{margin:6px 2px}
.ivmenu .iv-bar button.k-select{height:30px!important;font-size:12.5px}

.cm-slot .iv-lk{left:5px;bottom:5px;z-index:2}   /* khóa ở ô trang bị Nhân vật, như ô Túi */

/* ===== Xã hội / Đồng hành / Chuyển sinh (PC) ===== */
html.nu #giftBtn{display:none!important}   /* hộp Quà cũ bỏ ở PC: nội dung chuyển sang Nhiệm vụ, Xã hội, Đồng hành, Chuyển sinh */
.pcsoc{display:none!important}
html.nu .pcsoc{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:2px}
html.nu .pcsoc>svg{width:22px;height:22px;fill:#ffd54f;filter:drop-shadow(0 1px 2px rgba(0,0,0,.7))}
html:not(.nu) #tabs .tray[data-t="pet"]{display:none!important}
#dotPet{display:none}#dotPet.on{display:block}
.ac-guild{--ac:#64b5f6} .ac-clan{--ac:#ffb74d} .ac-pet{--ac:#81c784} .ac-reborn{--ac:#ce93d8}
.so-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.so-kv{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:8px 12px;border-radius:12px;background:var(--k-input);font-size:12px;color:var(--k-dim)}
.so-kv b{font:600 13px var(--font);color:#eef3f0}
.so-prog{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.so-prog small{font-size:11.5px;color:var(--k-dim)}
.so-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.so-slot{display:flex;flex-direction:column;gap:2px;padding:9px 12px;border-radius:12px;background:var(--k-input)}
.so-slot small{font-size:10.5px;color:var(--k-faint)} .so-slot b{font:600 12.5px var(--font);color:#eef3f0} .so-slot span{font-size:11px;color:var(--k-dim)}
.so-slot.off b{color:var(--k-faint);font-weight:500}
.so-list{margin-top:0}
.pet-big{width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.pet-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.pet-c{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 6px;border:0;border-radius:12px;cursor:pointer;background:var(--k-input);box-shadow:inset 0 0 0 1px var(--k-line);color:#dfe7e2;font:500 11.5px var(--font)}
.pet-c img{width:52px;height:52px;object-fit:contain}
.pet-c:hover{box-shadow:inset 0 0 0 1px rgba(255,213,79,.5)}
.pet-c.on{background:var(--k-acc-tone);box-shadow:inset 0 0 0 1.5px rgba(255,193,7,.6);color:var(--k-acc-lt)}

/* Góp ý trong Xã hội; nút Góp ý ở menu ⋯ ẩn ở PC */
html.nu #jxFb{display:none!important}
.ac-fb{--ac:#4fc3f7}
.fb-ta{display:block;width:100%;box-sizing:border-box;margin:10px 0 4px;padding:10px 14px!important;border:0!important;border-image:none!important;border-radius:12px!important;resize:vertical;min-height:110px;
  background:var(--k-input)!important;box-shadow:inset 0 0 0 1px var(--k-line2);color:#eef3f0;font:13px/1.5 var(--font)}
.fb-ta:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--k-acc)}
.fb-cnt{display:block;margin-bottom:6px;font-size:11px;color:var(--k-faint);text-align:right}
.fb-in{width:min(320px,100%);height:30px;padding:0 14px!important;border:0!important;border-image:none!important;border-radius:999px!important;background:var(--k-input)!important;box-shadow:inset 0 0 0 1px var(--k-line2);color:#eef3f0;font:12.5px var(--font)}
.fb-in:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--k-acc)}
.fb-act{display:flex;align-items:center;gap:12px;margin-top:12px}
.fb-act small{flex:1;font-size:11px;color:var(--k-faint)}
.fb-ok{display:flex;gap:10px;align-items:center;margin-top:12px;padding:9px 12px;border-radius:14px;background:rgba(129,199,132,.14);font-size:12px;color:#a5d6a7}
.fb-ok svg{width:16px;height:16px;fill:currentColor;flex:none}

/* Cột tray PC: Xã hội, Đồng hành, Nhân vật, Võ công, Túi (44px). Tray data-pc không có ở Mobile. */
html:not(.nu) #tabs .tray[data-pc]{display:none!important}
html.nu #tabs .tray{border-radius:13px}
html.nu #tabs .tray .pctray-ic{width:19px;height:19px}
#jxSocial{display:none!important}

/* ===== Nhân vật gọn hơn; đáy hai cột thẳng hàng (thẻ cuối mỗi cột giãn hết chiều cao còn lại) ===== */
.cm-wrap{gap:12px;align-items:stretch}
.cm-left,.cm-right{gap:8px}
.cm-left>.cm-box:last-child,.cm-right>.cm-box:last-child{flex:1}
.cm-box{padding:10px 12px;border-radius:14px}
.cm-box h4{margin-bottom:6px}
.cm-acts{display:flex;justify-content:center;gap:8px}
.cm-name{min-height:28px}
.cm-name b{font-size:16px}
.cm-doll{grid-template-columns:repeat(3,54px);grid-template-rows:repeat(5,50px);gap:6px}
.cm-tall img{max-height:92px}
.cm-rt{padding:5px 2px}
.cm-misc{margin-top:8px}
.cm-exp{margin-top:8px}
.cm-pw{margin-top:6px}
.cm-pw b{font-size:18px}
.cm-hands .cm-box{padding:8px 12px}
.cm-hands b{font-size:16px}
.cm-at{padding:3px 0}
.cm-bh .k-btn{height:28px}
.cm-stats{gap:14px}
.cm-kv{padding:2px 0}
.cm-left>*,.cm-right>*{flex-shrink:0}   /* chỉ thẻ cuối giãn; không ô nào bị co (người giấy cắt mất ô Ngựa) */

.ac-ic.pet-ic{overflow:hidden}
.ac-ic.pet-ic img{width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.ac-ic.pet-ic.empty{background:none;box-shadow:inset 0 0 0 1.5px var(--k-line2);border:0}

.ac-ic.pet-ic{width:72px;height:72px;background:none;box-shadow:none}
.ac-ic.pet-ic img{width:72px;height:72px}

/* ===== Hệ thống (PC) ===== */
.sy-sub{margin:6px 0 0;font-size:11.5px;line-height:1.45;color:var(--k-dim)}
.sy-sub code{padding:1px 6px;border-radius:6px;background:var(--k-input);color:#eef3f0;word-break:break-all}
.sy-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.sy-grow{flex:1;margin:0}
.sy-code{min-height:64px;font:11.5px/1.4 ui-monospace,Consolas,monospace}
.sy-range{-webkit-appearance:none;appearance:none;width:min(240px,100%);height:6px;border-radius:999px;cursor:pointer;
  background:linear-gradient(90deg,var(--k-acc) var(--v,50%),var(--k-input) var(--v,50%));box-shadow:inset 0 0 0 1px var(--k-line)}
.sy-range::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#ffd54f;box-shadow:0 1px 3px rgba(0,0,0,.5)}
.sy-range::-moz-range-thumb{width:16px;height:16px;border:0;border-radius:50%;background:#ffd54f}

/* ===== Màn hẹp (Mobile dọc) ===== */
.k-narrow .ac-hero{flex-wrap:wrap}
.k-narrow .ac-hero .ac-ht{flex:1 1 180px;min-width:0}
.k-narrow .ac-hero>.k-btn,.k-narrow .ac-hero>.ac-note,.k-narrow .ac-hero>.qs-ok{flex:1 1 100%;justify-content:center}
.k-narrow .iv-cap>span{display:none}
.k-narrow .iv-cap{min-width:56px}
.k-narrow .iv-bar .k-select,.k-narrow .iv-bar select{width:112px}
.k-narrow .iv-bar .iv-ico+.iv-ico,.k-narrow .iv-bar .iv-ico[title]{display:none}
html.nu.nu-narrow #evBox{width:auto!important;right:64px!important}   /* chừa cột ô bên phải */

html.nu .pcquest span{white-space:nowrap}
html.nu.nu-narrow .pcquest{font-size:11px;padding:0 8px}
.sy-sub code.sy-rc{font:700 14px ui-monospace,Consolas,monospace;letter-spacing:1px;color:var(--k-acc-lt);user-select:all}
.sy-pw{width:100%;box-sizing:border-box;margin-bottom:10px}
.sy-err{margin:0;color:var(--k-danger);font-size:12px}