/* ===================================================================== 1.26.8 · KHUNG CỬA SỔ MỚI + BỐ CỤC MÀN HÌNH CHƠI --------------------------------------------------------------------- Mỗi cửa sổ vẽ theo MỘT cỡ thiết kế cố định (--W × --H) rồi phóng to / thu nhỏ đều theo màn hình (--fwk), nên trên điện thoại hay máy tính đều vuông vắn, cùng tỉ lệ: không bị kéo dẹt ra nửa màn hình, không to quá trên PC. Hai bộ cỡ: "rộng" (máy tính, dùng chữ cỡ thường) và "gọn" (điện thoại ngang, cùng điều kiện với các quy tắc gọn cũ). Thẻ (tab) nằm TRONG khung, cùng một khối với cửa sổ. Nạp sau cùng (sau game.css, dock.css). ===================================================================== */ :root { --fw-smax: 1.25; /* phóng to tối đa trên màn hình lớn */ --fw-h: .9; /* cửa sổ cao tối đa 90% màn hình */ --fw-line: #b8894a; --fw-line2: #5a3e22; --fw-gold: #f3cf86; --fw-gold2: #ffe9b5; --fw-text: #f1e2c6; --fw-dim: #b9a07c; --fw-bg1: #2e2016; --fw-bg2: #150d08; --fw-panel: rgba(0, 0, 0, .32); } #screen-game .window{ --W: 1000; --H: 580; --side: 150; } #screen-game .window.parch-win.small{ --W: 640; --H: 430; --side: 0; } @media (max-height: 560px), (max-width: 900px) { :root { --fw-h: .96; } /* điện thoại: cửa sổ cao gần hết màn hình cho chữ to hơn */ #screen-game .window{ --W: 660; --H: 360; --side: 104; } #screen-game .window.parch-win.small{ --W: 500; --H: 330; --side: 0; } } #screen-game .window{ --fwk: min(calc((var(--vwn, 1280) - 20) / var(--W)), calc((var(--vhn, 720) * var(--fw-h) - 6) / var(--H)), var(--fw-smax)); } /* ---------------- Cửa sổ giữa màn hình (Chợ, Phúc lợi, Xếp hạng, Hòm thư, Tổ đội, Bộ lạc, Nghề phụ, Cẩm nang, Cài đặt…) ---------------- */ #screen-game .window.parch-win{ display: block !important; padding: 0 !important; background: rgba(0, 0, 0, .22) !important; } #screen-game .window.parch-win[hidden], #screen-game .window.dock[hidden]{ display: none !important; } #screen-game .window.parch-win > .parch{ position: absolute !important; left: 50% !important; top: 50% !important; margin: 0 !important; width: calc(var(--W) * 1px) !important; height: calc(var(--H) * 1px) !important; max-width: none !important; max-height: none !important; min-height: 0 !important; transform: translate(-50%, -50%) scale(var(--fwk)) !important; transform-origin: 50% 50% !important; display: flex !important; flex-direction: column; box-sizing: border-box; padding: 50px 16px 14px calc(16px + var(--side, 0) * 1px) !important; /* da gỗ tối viền vàng (giống bảng Nhân vật) */ background: radial-gradient(110% 60% at 50% 0%, rgba(255, 196, 110, .09), transparent 60%), repeating-linear-gradient(90deg, rgba(255, 255, 255, .012) 0 2px, transparent 2px 6px), linear-gradient(180deg, var(--fw-bg1), var(--fw-bg2)) !important; border: 2px solid var(--fw-line) !important; border-radius: 10px !important; box-shadow: 0 0 0 2px #120a05, inset 0 0 0 1px rgba(255, 220, 150, .18), inset 0 0 30px rgba(0, 0, 0, .6), 0 16px 44px rgba(0, 0, 0, .6) !important; color: var(--fw-text) !important; text-shadow: 0 1px 1px #000; } #screen-game .window.parch-win > .parch:not(:has(> .side-tabs)){ padding-left: 16px !important; } #screen-game .window.parch-win.small > .parch{ padding: 50px 18px 16px !important; } /* Thanh tiêu đề vàng ở giữa, nằm trong khung */ #screen-game .window.parch-win > .parch > .parch-title{ position: absolute !important; left: 50% !important; top: 7px !important; transform: translateX(-50%) !important; display: flex !important; align-items: center; gap: 12px; height: 32px; padding: 0 64px !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; font-size: 18px !important; font-weight: 900; letter-spacing: .5px; color: var(--fw-gold2) !important; white-space: nowrap; background: linear-gradient(90deg, transparent, rgba(130, 56, 18, .65) 22%, rgba(160, 70, 24, .85) 50%, rgba(130, 56, 18, .65) 78%, transparent) !important; text-shadow: 0 1px 2px #000, 0 0 10px rgba(255, 170, 80, .35); } #screen-game .window.parch-win > .parch > .parch-title::before, #screen-game .window.parch-win > .parch > .parch-title::after{ content: ""; width: 40px; height: 1px; background: linear-gradient(90deg, transparent, var(--fw-gold)); } #screen-game .window.parch-win > .parch > .parch-title::after{ background: linear-gradient(90deg, var(--fw-gold), transparent); } /* Nút đóng đỏ ở góc */ #screen-game .window.parch-win > .parch > .parch-close{ position: absolute !important; top: -10px !important; right: -10px !important; width: 40px !important; height: 40px !important; border-radius: 7px !important; background: linear-gradient(180deg, #e0522e, #8a1f10) !important; border: 2px solid var(--fw-gold) !important; color: #fff3d6 !important; font-size: 20px !important; font-weight: 900; box-shadow: 0 2px 6px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .3) !important; z-index: 6; } /* Thẻ dọc bên trái, NẰM TRONG khung */ #screen-game .window.parch-win > .parch > .side-tabs{ position: absolute !important; left: 12px !important; top: 50px !important; bottom: 14px !important; width: calc(var(--side) * 1px - 8px) !important; transform: none !important; display: flex !important; flex-direction: column !important; gap: 7px; padding: 8px 7px; margin: 0 !important; box-sizing: border-box; border-radius: 7px; background: rgba(0, 0, 0, .34); border: 1px solid var(--fw-line2); box-shadow: inset 0 0 14px rgba(0, 0, 0, .55); overflow-y: auto; } #screen-game .window.parch-win > .parch > .side-tabs button{ flex: 0 0 auto; height: 42px; width: 100%; padding: 0 6px !important; margin: 0 !important; border-radius: 6px !important; white-space: normal; line-height: 1.15; font-size: 14px !important; font-weight: 800; color: #f4d8a0 !important; text-shadow: 0 1px 2px #000; background: linear-gradient(180deg, #7a3418, #4a1c0c) !important; border: 2px solid #9a6a36 !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12) !important; } #screen-game .window.parch-win > .parch > .side-tabs button.active, #screen-game .window.parch-win > .parch > .side-tabs button.on{ color: #fff6dc !important; background: linear-gradient(180deg, #f0a050, #b8521c 55%, #8a3410) !important; border-color: var(--fw-gold) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 0 10px rgba(255, 160, 60, .35) !important; } @media (max-height: 560px), (max-width: 900px) { #screen-game .window.parch-win > .parch{ padding: 42px 10px 10px calc(10px + var(--side, 0) * 1px) !important; } #screen-game .window.parch-win > .parch:not(:has(> .side-tabs)){ padding-left: 10px !important; } #screen-game .window.parch-win.small > .parch{ padding: 42px 12px 10px !important; } #screen-game .window.parch-win > .parch > .parch-title{ top: 5px !important; height: 26px; font-size: 15px !important; padding: 0 48px !important; } #screen-game .window.parch-win > .parch > .parch-close{ width: 34px !important; height: 34px !important; font-size: 17px !important; top: -8px !important; right: -8px !important; } #screen-game .window.parch-win > .parch > .side-tabs{ left: 8px !important; top: 42px !important; bottom: 10px !important; gap: 5px; padding: 6px 5px; } #screen-game .window.parch-win > .parch > .side-tabs button{ height: 32px; font-size: 11.5px !important; } } /* Bàn phím ảo mở: dồn cửa sổ lên mép trên */ #screen-game .window.parch-win.kb > .parch{ top: 4px !important; transform: translate(-50%, 0) scale(var(--fwk)) !important; transform-origin: 50% 0 !important; } /* ---------------- Cửa sổ "đôi" (Nhân vật | Hành trang, Cửa hàng | Hành trang, Rương đồ, Thú cưng) ---------------- */ /* Hai cửa sổ đứng cạnh nhau ở giữa màn hình, khe 10px; cùng một tỉ lệ phóng to theo tổng bề ngang của cặp. */ #screen-game .window.dock{ --W: 1010; --H: 580; --gap: 10; } @media (max-height: 560px), (max-width: 900px) { #screen-game .window.dock { --W: 690; --H: 360; --gap: 8; } } #screen-game .window.dock > .dk-wrap{ top: 50% !important; bottom: auto !important; height: calc(var(--H) * 1px) !important; margin: 0 !important; width: calc(var(--Wd, 480) * 1px) !important; font-size: var(--dk-fs); } #screen-game .window.dock.dock-l > .dk-wrap, #screen-game .window.dock.dock-both > .dk-l{ left: auto !important; right: calc(50% + var(--gap) * .5px) !important; transform: translateY(-50%) scale(var(--fwk)) !important; transform-origin: 100% 50% !important; } #screen-game .window.dock.dock-r > .dk-wrap, #screen-game .window.dock.dock-both > .dk-r{ right: auto !important; left: calc(50% + var(--gap) * .5px) !important; transform: translateY(-50%) scale(var(--fwk)) !important; transform-origin: 0 50% !important; } .dock-both > .dk-r { display: flex !important; } /* Bề ngang từng cửa sổ (đơn vị thiết kế) */ #screen-game #win-character{ --Wd: 540; } #screen-game #win-bag { --Wd: 460; } #screen-game #win-shop { --Wd: 540; } #screen-game #win-pet { --Wd: 540; } #screen-game #win-storage > .dk-l{ --Wd: 540; } #win-storage > .dk-r { --Wd: 460; } @media (max-height: 560px), (max-width: 900px) { #screen-game #win-character{ --Wd: 370; } #screen-game #win-bag { --Wd: 312; } #screen-game #win-shop { --Wd: 370; } #screen-game #win-pet { --Wd: 370; } #screen-game #win-storage > .dk-l{ --Wd: 370; } #win-storage > .dk-r { --Wd: 312; } } /* Thẻ dọc bên trái (Trang bị · Ngoại trang · Thú cưỡi · Kỹ năng) nằm trong cùng một khung với cửa sổ */ #screen-game .window.dock > .dk-wrap:has(> .dk-side){ gap: 0 !important; padding: 0; border-radius: 9px; box-sizing: border-box; background: linear-gradient(180deg, var(--fw-bg1), var(--fw-bg2)); border: 2px solid var(--fw-line); box-shadow: 0 0 0 2px #120a05, inset 0 0 0 1px rgba(255, 220, 150, .16), 0 16px 44px rgba(0, 0, 0, .6); } #screen-game .window.dock > .dk-wrap:has(> .dk-side) > .dk{ border: 0 !important; border-left: 1px solid var(--fw-line2) !important; border-radius: 0 8px 8px 0 !important; box-shadow: inset 0 0 26px rgba(0, 0, 0, .55) !important; } #screen-game .window.dock > .dk-wrap > .dk-side{ width: 104px !important; padding: 44px 8px 8px !important; gap: 7px !important; box-sizing: border-box; flex: 0 0 104px !important; } #screen-game .window.dock > .dk-wrap > .dk-side button{ width: 100%; height: 42px !important; font-size: 13.5px !important; border-radius: 6px !important; } @media (max-height: 560px), (max-width: 900px) { #screen-game .window.dock > .dk-wrap > .dk-side{ width: 78px !important; flex-basis: 78px !important; padding: 36px 5px 6px !important; gap: 5px !important; } #screen-game .window.dock > .dk-wrap > .dk-side button{ height: 32px !important; font-size: 11px !important; padding: 0 3px !important; } } /* Cửa sổ một mình nằm giữa (Nhiệm vụ) */ #screen-game #win-quest.window.dock > .dk-wrap{ left: 50% !important; right: auto !important; width: calc(var(--W) * 1px) !important; transform: translate(-50%, -50%) scale(var(--fwk)) !important; transform-origin: 50% 50% !important; } #screen-game #win-quest.window.dock{ --W: 1000; } @media (max-height: 560px), (max-width: 900px) { #screen-game #win-quest.window.dock { --W: 660; } } /* Lớp nền mờ phía sau cửa sổ đôi: bấm ra ngoài vẫn thấy game */ #screen-game .window.dock{ background: transparent !important; } /* ===================== Nền tối cho phần ruột cửa sổ ===================== Các ô / hàng giấy da sáng cũ đổi sang nền gỗ tối, chữ sáng, viền vàng mảnh — giống khung mới. */ #screen-game .parch-win .slot-box{ background: rgba(0, 0, 0, .3) !important; box-shadow: inset 0 0 0 1px rgba(184, 137, 74, .38), inset 0 2px 10px rgba(0, 0, 0, .45) !important; color: var(--fw-txt, #f1e2c4) !important; } #screen-game .parch-win .rk-list{ background: rgba(0, 0, 0, .3) !important; border-radius: 8px; padding: 4px; box-shadow: inset 0 0 0 1px rgba(184, 137, 74, .38); } #screen-game .parch-win .rk-list .rk-row, #screen-game .parch-win .wf-row{ background: linear-gradient(180deg, #3a2615, #2a1a0d) !important; border: 1px solid rgba(184, 137, 74, .45) !important; color: #f1e2c4 !important; } #screen-game .parch-win .rk-list .rk-row.top1{ background: linear-gradient(90deg, rgba(242, 193, 78, .32), #2a1a0d 70%) !important; border-color: #d9a941 !important; } #screen-game .parch-win .rk-list .rk-row.top2{ background: linear-gradient(90deg, rgba(214, 214, 214, .26), #2a1a0d 70%) !important; border-color: #b8b8b8 !important; } #screen-game .parch-win .rk-list .rk-row.top3{ background: linear-gradient(90deg, rgba(217, 146, 90, .28), #2a1a0d 70%) !important; border-color: #c07a45 !important; } #screen-game .parch-win .rk-list .rk-row.top1, #screen-game .parch-win .rk-list .rk-row.top2, #screen-game .parch-win .rk-list .rk-row.top1 .rk-v, #screen-game .parch-win .rk-list .rk-row.top2 .rk-v{ color: #fff3d6 !important; text-shadow: 0 1px 2px #000 !important; } #screen-game .parch-win .wf-row.ready{ background: linear-gradient(180deg, #5a3b16, #3a2410) !important; border-color: #ffd36a !important; } #screen-game .parch-win .wf-row.big:not(.got){ background: linear-gradient(180deg, #4a2c66, #2e1a44) !important; } #screen-game .parch-win input[type=text], #screen-game .parch-win input[type=search], #screen-game .parch-win input:not([type]), #screen-game .parch-win input[type=number], #screen-game .parch-win select, #screen-game .parch-win textarea{ background: #1c120a !important; color: #f6e7c8 !important; border: 1px solid rgba(184, 137, 74, .55) !important; box-shadow: inset 0 1px 4px rgba(0, 0, 0, .6) !important; } #screen-game .parch-win input::placeholder, #screen-game .parch-win textarea::placeholder{ color: #9c8566 !important; } #screen-game .parch-win select option{ background: #1c120a; color: #f6e7c8; } /* ===== Chữ tối cũ → chữ sáng trên nền gỗ tối (tự sinh từ game.css / dock.css bằng gencolor.py) ===== */ #screen-game .parch-win :is(.zone-card.here .zc-num){ color: #82e2dd !important; } #screen-game .parch-win :is(.dg-mem.ok b){ color: #8cd895 !important; } #screen-game .parch-win :is(#win-market .mk2-hm.in){ color: #91e084 !important; } #screen-game .parch-win :is(#sk-detail .sd-gain, .code-msg.ok, .fa-rate .ok, .ip-stats li, .sd-need.ok){ color: #92e381 !important; } #screen-game .parch-win :is(.mk2-tx .price, .pv .pv-bonus1){ color: #96e084 !important; } #screen-game .parch-win :is(#qw-main-detail .qw-line.goal .v, #qw-title-detail .qw-line.goal .v){ color: #98df85 !important; } #screen-game .parch-win :is(.dg-mem.ok small, .pv-st.hi .x){ color: #98ed77 !important; } #screen-game .parch-win :is(.pv-act){ color: #a4e77d !important; } #screen-game .parch-win :is(.qw-goal){ color: #aae381 !important; } #screen-game .parch-win :is(#win-quest .qd-prog small.ok){ color: #add58f !important; } #screen-game .parch-win :is(.ii-list li.ii-gem){ color: #ae8cd8 !important; } #screen-game .parch-win :is(#win-quest .qd-list .qw-drow.claimed .so-info b){ color: #b2d292 !important; } #screen-game .parch-win :is(#win-market .mk2-hhead, #win-quest .qd-bonus-h span, #win-quest .qd-time, #win-quest .qd-week){ color: #d2b292 !important; } #screen-game .parch-win :is(.mk2-gold small, .pf-desc, .pf-note){ color: #d4b490 !important; } #screen-game .parch-win :is(.pv-tier){ color: #d5b08f !important; } #screen-game .parch-win :is(#win-worldmap .wm-desc){ color: #d6b08e !important; } #screen-game .parch-win :is(.wm-desc){ color: #d7b18d !important; } #screen-game .parch-win :is(#qw-main-detail .qw-hint, #win-pinfo .name-scroll small, .ml-all, .ml-fee, .ml-form label, .ml-note, .qw-desc){ color: #d8af8c !important; } #screen-game .parch-win :is(#win-quest .qd-ms .qw-mschip, #win-quest .qd-mslab){ color: #d8b18c !important; } #screen-game .parch-win :is(.ii-about, .set-community > span, .set-unstuck span){ color: #d8b28c !important; } #screen-game .parch-win :is(#win-quest .qd-done span, .parch .rk-list .rk-n:not(.img), .parch-scroll > .shop-empty, .rk-head, .shop-list .shop-empty, .wf-hint, .wf-hint span){ color: #dcaf88 !important; } #screen-game .parch-win :is(.wm-why){ color: #dea386 !important; } #screen-game .parch-win :is(#qw-main-detail .qw-desc, #qw-title-detail .qw-desc, .cf-text, .dg-desc, .fa-addon, .ii-list li, .ip-confirm .qty b, .keys, .mk-guide, .mk2-gold, .pet-learn-info, .pv-chk, .pv-line, .pv-st .k, .qty-item b, .sd-desc){ color: #deb086 !important; } #screen-game .parch-win :is(#win-quest .qd-prog small, ul.wm-links li i){ color: #deb286 !important; } #screen-game .parch-win :is(.rk-me, .wm-h, .wm-legend .wl){ color: #dfac85 !important; } #screen-game .parch-win :is(#qw-main-detail, #qw-main-detail .qw-line, #qw-main-detail .qw-rw-h, #qw-title-detail, #qw-title-detail .qw-line, #sk-detail *, #sk-detail.sk-right, .acc-row span, .cf-list, .gl-about, .mk-guide, .mk2-guide, .mk2-row, .ml-all, .ml-detail, .ml-empty, .ml-fee, .ml-form label, .ml-meta, .ml-note, .pcheck, .qty-total, .qw-ach-detail, .qw-desc, .qw-detail, .qw-rw-h, .qw-title, .shop-empty, .sp-price, .wf-hint){ color: #dfaf85 !important; } #screen-game .parch-win :is(.rk-list .rk-row.top1, .rk-list .rk-row.top1 .rk-v, .rk-list .rk-row.top2, .rk-list .rk-row.top2 .rk-v){ color: #e1ab83 !important; } #screen-game .parch-win :is(#qw-main-detail .qw-hint.bad){ color: #e28b82 !important; } #screen-game .parch-win :is(.pv-panel.pf .fa-rate .warn){ color: #e49080 !important; } #screen-game .parch-win :is(#win-quest .qd-bonus, #win-quest .qd-bonus-h b, #win-quest .qd-dil, #win-quest .qd-dil-h, #win-quest .qd-done span, #win-quest .qd-sum, #win-worldmap .wm-h, .rk-list .rk-row, .rk-list .rk-row.top1, .rk-list .rk-row.top2, .rk-list .rk-row.top3, .set-community > b, .wm-stats dd, ul.wm-links li span){ color: #e4ae80 !important; } #screen-game .parch-win :is(.ii-list li.bad, .ip-req.bad, .pv-panel.pf .fa-cost span.bad, .sd-need .bad){ color: #e5887f !important; } #screen-game .parch-win :is(#win-quest .qd-list .qw-drow .so-info b){ color: #e5ad7f !important; } #screen-game .parch-win :is(.sklay-foot, .sklay-now){ color: #e5b17f !important; } #screen-game .parch-win :is(.dg-title){ color: #e68f7e !important; } #screen-game .parch-win :is(#win-quest .qd-bonus, #win-quest .qd-dil, #win-quest .qd-sum, .mk2-hd, .mk2-step b, .wf-hint){ color: #e6ad7e !important; } #screen-game .parch-win :is(.rk-list .rk-row.top3 b){ color: #e7a97d !important; } #screen-game .parch-win :is(#win-quest .qd-list .qw-drow .so-info b){ color: #e7ad7d !important; } #screen-game .parch-win :is(.ip-confirm, .pv-st.lo .x){ color: #e88a7c !important; } #screen-game .parch-win :is(#win-quest .qd-bonus-h b, #win-quest .qd-mslab, .wf-hint b){ color: #e8a77c !important; } #screen-game .parch-win :is(.ii-h){ color: #e8b07c !important; } #screen-game .parch-win :is(#win-quest .qd-bonus-h span, #win-quest .qd-list .qw-drow.claimed .so-info b, #win-quest .qd-time, #win-quest .qd-week, .cw-eq .eq, .pvd .pv-li.hold, .pvd .pv-li.none){ color: #e8d6b2 !important; } #screen-game .parch-win :is(#win-market .mk2-hm.out){ color: #e98f7b !important; } #screen-game .parch-win :is(.dg-kv.bad .v, .pv .pv-need, .pv-li small.bad, .pv-wit .k.bad){ color: #ea877a !important; } #screen-game .parch-win :is(.pf-title b, .pv-panel.pf .fa-cost span){ color: #eab07a !important; } #screen-game .parch-win :is(#sk-detail .sd-need .bad){ color: #eb7f79 !important; } #screen-game .parch-win :is(.cf-modal.danger .cf-card h3){ color: #ec8278 !important; } #screen-game .parch-win :is(.mk2-tx b){ color: #ecaa78 !important; } #screen-game .parch-win :is(#qw-main-detail .qw-line.bad .v, .code-msg.bad, .rn-form .error, .wm-stats dd.bad){ color: #ed8877 !important; } #screen-game .parch-win :is(#qw-main-detail .qw-title, #qw-title-detail .qw-title, .dg-kv .k, .dg-sec, .gem-gold, .name-scroll b, .pet-empty, .pf-arrow, .pf-plus, .pv .pv-bonus1, .pv-h, .pv-line .k, .pv-lock, .pv-row .k, .pv-sec, .pv-wit .k, .qty-card h3, .sd-title, .sec-title, .sp-price b, .sp-total b, .zone-head){ color: #edaa77 !important; } #screen-game .parch-win :is(.sp-price.bad b, .sp-total b.bad, .sp-total.bad b){ color: #ee8076 !important; } #screen-game .parch-win :is(.dg-kv .v, .pv-corner.l b, .pv-sp, .pv-step b){ color: #eea476 !important; } #screen-game .parch-win :is(.ip-lines .bound){ color: #f0a774 !important; } #screen-game .parch-win :is(#win-quest .qd-dil-h b, #win-quest .qd-done b, .rk-list .rk-row .rk-v){ color: #f2a572 !important; } #screen-game .parch-win :is(.dg-mem b, .dg-mem small){ color: #f38771 !important; } #screen-game .parch-win :is(.rc-show b){ color: #f3a371 !important; } #screen-game .parch-win :is(.wm-stats dd.gold){ color: #ffbf65 !important; } /* ===== Nền giấy da / nâu nhạt cũ → nền gỗ tối (tự sinh bằng gencolor.py) ===== */ #screen-game .parch-win :is(#win-quest .qd-chip, #win-quest .qd-track, #win-quest .qw-cat, #win-worldmap .wm-item, #win-worldmap .wm-stage, .ar-rw, .ar-tr, .bag-tabs button, .dg-kv, .fa-addon.charm button, .fa-item, .gd-card, .gd-inp, .gl-row, .gl-sel, .help-topics button, .hp-it, .mk-search, .mk-sel, .mk2-card, .mk2-h, .mk2-h.k-list .mk2-hk, .mk2-search, .mk2-sel, .ml-row, .ml-row.unread, .ml-seg, .of-card, .pet-book, .pinvite, .plot-body, .pm-item, .pv-bound, .pv-box, .pv-c, .pv-info, .pv-li, .pv-li.hold, .pv-li.none, .pv-list):not(.on):not(.active):not(.sel):not(.ready):not(.big):not(.top1):not(.top2):not(.top3){ background: linear-gradient(180deg, #34220f, #24170b) !important; box-shadow: inset 0 0 0 1px rgba(184, 137, 74, .42) !important; } #screen-game .parch-win :is(.pv-panel.pf .pv-btns, .pv-row .v, .pv-side, .pv-sk, .pv-sk.empty, .pv-sk.shut, .pv-skbox, .pv-st .v, .pv-tabs button, .qty-card, .qw-drow, .qw-row, .rc-show, .sd-actions, .seg button, .shop-row, .sk-right, .skill-row, .so-row, .vip-state, .wf-row, .wm-act, .wm-stage, .wm-zoom button, .zone-card):not(.on):not(.active):not(.sel):not(.ready):not(.big):not(.top1):not(.top2):not(.top3){ background: linear-gradient(180deg, #34220f, #24170b) !important; box-shadow: inset 0 0 0 1px rgba(184, 137, 74, .42) !important; } /* Thanh tiền (Vàng · Ngọc · ghi chú) nằm TRONG khung, dải dưới cùng */ #screen-game .window.parch-win > .parch:has(> .currency){ padding-bottom: 56px !important; } #screen-game .window.parch-win > .parch > .currency{ position: absolute !important; top: auto !important; bottom: 12px !important; transform: none !important; left: calc(16px + var(--side, 0) * 1px) !important; right: 16px !important; justify-content: flex-start !important; gap: 10px !important; } #screen-game .window.parch-win > .parch:not(:has(> .side-tabs)) > .currency{ left: 16px !important; } #screen-game .window.parch-win > .parch > .currency .cur{ width: 150px !important; height: 32px !important; } #screen-game .window.parch-win > .parch > .currency .cur-note{ max-width: none !important; flex: 1 1 auto; min-width: 0; color: #d9c49c !important; text-shadow: none !important; font-weight: 600 !important; } @media (max-height: 560px), (max-width: 900px) { #screen-game .window.parch-win > .parch:has(> .currency){ padding-bottom: 44px !important; } #screen-game .window.parch-win > .parch > .currency{ bottom: 9px !important; } #screen-game .window.parch-win > .parch > .currency .cur{ width: 116px !important; height: 26px !important; } #screen-game .window.parch-win > .parch > .currency .cur-note{ display: inline-block !important; font-size: 10.5px !important; } } /* Ô đánh dấu (Cài đặt …) */ #screen-game .parch-win .pcheck{ color: #eadbbd !important; } #screen-game .parch-win .pcheck span{ background: #1c120a !important; box-shadow: inset 0 0 0 1.5px #b8894a, inset 0 2px 5px rgba(0,0,0,.6) !important; } /* ===================== Cài đặt: gọn, thẻ dọc bên trái như các cửa sổ khác ===================== */ #screen-game .window.set-win{ --W: 860; --H: 540; --side: 140; } @media (max-height: 560px), (max-width: 900px) { #screen-game .window.set-win{ --W: 620; --H: 350; --side: 100; } } #screen-game #win-settings .set-tabs{ justify-content: flex-start !important; margin: 0 !important; } #screen-game #win-settings .set-body{ padding: 2px 4px 6px !important; } #screen-game #win-settings .set-foot{ border-top: 1px solid rgba(184, 137, 74, .3) !important; } #screen-game #win-settings .set-lang{ display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 12px; margin-bottom: 10px; border-radius: 8px; background: rgba(0, 0, 0, .28); box-shadow: inset 0 0 0 1px rgba(184, 137, 74, .38); } #screen-game #win-settings .set-lang small{ color: #b9a17a !important; } #screen-game #win-settings .check-grid.two{ display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px 14px; padding: 10px 12px; border-radius: 8px; background: rgba(0, 0, 0, .28); box-shadow: inset 0 0 0 1px rgba(184, 137, 74, .38); } #screen-game #win-settings .pcheck{ font-size: 14px !important; gap: 10px; } #screen-game #win-settings .pcheck span{ flex: 0 0 26px !important; height: 26px !important; border-radius: 5px; } #screen-game #win-settings .pcheck input:checked + span::after{ inset: 5px !important; } #screen-game #win-settings .set-unstuck{ display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 8px 12px; border-radius: 8px; background: rgba(0, 0, 0, .2); } #screen-game #win-settings .set-unstuck span{ color: #b9a17a !important; font-size: 12.5px; } #screen-game #win-settings .set-community{ margin-top: 10px; } @media (max-height: 560px), (max-width: 900px) { #screen-game #win-settings .pcheck{ font-size: 11.5px !important; } #screen-game #win-settings .pcheck span{ flex-basis: 20px !important; height: 20px !important; } #screen-game #win-settings .pcheck input:checked + span::after{ inset: 4px !important; } #screen-game #win-settings .set-lang, #screen-game #win-settings .check-grid.two{ padding: 6px 8px; gap: 5px 10px; margin-bottom: 6px; } #screen-game #win-settings .set-unstuck{ padding: 5px 8px; margin-top: 6px; } #screen-game #win-settings .set-unstuck span{ font-size: 10.5px; } } /* Cửa sổ đôi chỉ mở một bên (Cửa hàng Ngọc, Thú cưng): nằm giữa màn hình. Nhân vật luôn sát lề trái, Hành trang luôn sát lề phải (ui3.css). */ #screen-game:not(:has(#win-bag:not([hidden]))) .window.dock.dock-l:not(#win-quest):not(#win-character):not(#win-pinfo) > .dk-wrap{ left: 50% !important; right: auto !important; transform: translate(-50%, -50%) scale(var(--fwk)) !important; transform-origin: 50% 50% !important; } /* Bản đồ thế giới: khung thông tin và danh sách đường đi trên nền tối */ #screen-game #win-worldmap .wm-info{ background: rgba(0, 0, 0, .3) !important; box-shadow: inset 0 0 0 1px rgba(184, 137, 74, .4) !important; color: #eadbbd !important; } #screen-game #win-worldmap .wm-info .wm-stats{ background: rgba(255, 230, 170, .05) !important; } #screen-game #win-worldmap ul.wm-links li{ background: linear-gradient(180deg, #34220f, #24170b) !important; box-shadow: inset 0 0 0 1px rgba(184, 137, 74, .42) !important; } #screen-game:not(:has(#win-bag:not([hidden]))) #win-shop.window.dock, #screen-game:not(:has(#win-bag:not([hidden]))) #win-pet.window.dock{ --Wd: 820; } @media (max-height: 560px), (max-width: 900px) { #screen-game:not(:has(#win-bag:not([hidden]))) #win-shop.window.dock, #screen-game:not(:has(#win-bag:not([hidden]))) #win-pet.window.dock{ --Wd: 600; } }