/* =====================================================================
   NPC windows v3 (2026-09-27)
   - Blacksmith refine  (#refine-window.nv-forge)  : Settings sky frame, 2-column "settings" layout
   - Merchant           (#merchant-window.nv-shop) : Settings sky frame, wallet bar + receipt basket
   - Market Broker      (#market-window.nv-market) : character-bag style, sky blue / white
   Remove the <link> to css/npc-ui-v3.css to revert.
   ===================================================================== */

/* ---------------------------------------------------------------- shared: settings sky frame */
html body #hud section.window.painted-window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) {
  --frame: url('/ui/settings/frame-sky.webp?v=1');
  color: #10294f !important;
}
html body #hud section.window.painted-window.nv-forge { --pw-width: 660px !important; }
html body #hud section.window.painted-window.nv-shop { --pw-width: 720px !important; }
html body #hud section.window.painted-window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild)::before {
  border-width: calc(var(--u) * 191.3) 0 calc(var(--u) * 56.4) !important;
  border-image: url('/ui/settings/frame-sky.webp?v=1') 492 0 145 0 fill / calc(var(--u) * 191.3) 0 calc(var(--u) * 56.4) stretch !important;
  filter: drop-shadow(0 12px 22px rgba(10, 30, 60, 0.4)) !important;
}
html body #hud section.window.painted-window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) > .titlebar {
  top: calc(var(--u) * 78) !important; height: calc(var(--u) * 74) !important; padding: 0 calc(var(--u) * 120) !important;
}
html body #hud section.window.painted-window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) > .titlebar > span {
  color: #ffffff !important; font-size: calc(var(--u) * 42) !important;
  text-shadow: -0.1em 0 #1b3a7a, 0.1em 0 #1b3a7a, 0 -0.08em #1b3a7a, 0 0.1em #1b3a7a, 0 0.15em 0.25em rgba(10, 30, 80, 0.6) !important;
}
html body #hud section.window.painted-window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) > .titlebar button {
  left: calc(var(--u) * 754) !important; top: calc(var(--u) * -3) !important;
  width: calc(var(--u) * 54) !important; height: calc(var(--u) * 54) !important; border-radius: 50% !important;
}
html body #hud section.window.painted-window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-body {
  margin: calc(var(--u) * 196) 0 calc(var(--u) * 50) !important;
  padding: calc(var(--u) * 4) calc(var(--u) * 36) calc(var(--u) * 12) calc(var(--u) * 40) !important;
  max-height: calc((100dvh - 16px) / var(--ui-zoom, 1) - var(--u) * 250) !important;
  scrollbar-color: #7fa9d6 transparent !important;
  font-size: calc(var(--u) * 24) !important;
}
/* small round icon used in section headers */
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .nvf-ico {
  flex: none; display: inline-grid; place-items: center;
  width: calc(var(--u) * 34); height: calc(var(--u) * 34); border-radius: 50%;
  background: linear-gradient(180deg, #ffffff, #ffe39a) !important; box-shadow: 0 0 0 calc(var(--u) * 2) #c9a24e;
  color: #6b4a0e; font-style: normal; font-size: calc(var(--u) * 19) !important; font-weight: 800; text-shadow: none !important; filter: none !important;
}
/* sky blue primary button (replaces the painted gold/blue plates) */
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-btn,
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-btn.blue {
  min-height: calc(var(--u) * 58) !important; padding: 0 calc(var(--u) * 22) !important;
  border: calc(var(--u) * 2.5) solid #dfb758 !important; border-image: none !important; border-radius: 999px !important;
  background: linear-gradient(180deg, #4f93f2, #1f5fd0 55%, #174cb0) !important;
  box-shadow: 0 calc(var(--u) * 4) 0 #0e2a66, inset 0 calc(var(--u) * 2) 0 #9cc6ff !important;
  color: #ffffff !important; text-shadow: 0 calc(var(--u) * 2) #0a1c44 !important; font-weight: 800 !important;
}
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-btn:active:enabled { transform: translateY(calc(var(--u) * 3)); box-shadow: 0 calc(var(--u) * 1) 0 #0e2a66 !important; }
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-chip {
  height: calc(var(--u) * 40) !important; border: calc(var(--u) * 1.5) solid #9ec2e6 !important; border-radius: 999px !important;
  background: linear-gradient(180deg, #ffffff, #e3effb) !important; box-shadow: none !important; color: #1d4f9a !important;
}
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-chip[aria-pressed="true"] {
  border-color: #9c7a36 !important; background: linear-gradient(180deg, #ffe39a, #e2ab33) !important; color: #3d2806 !important; text-shadow: none !important;
}
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-note { color: #1f5fd0 !important; }
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-empty { color: #5b7396 !important; }
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) input[type="number"] { border: calc(var(--u) * 1.5) solid #9ec2e6 !important; border-radius: calc(var(--u) * 8) !important; color: #10294f !important; }
/* rows: white setting rows instead of the parchment row image */
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-row {
  background: #ffffff !important; border: calc(var(--u) * 1.5) solid #cfe2f5 !important; border-radius: calc(var(--u) * 10) !important;
  box-shadow: 0 calc(var(--u) * 1.5) 0 #e3effb !important; color: #10294f !important;
}
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-row:hover:enabled { background: #f2f8ff !important; border-color: #7fa9d6 !important; filter: none !important; }
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-row span { color: #10294f !important; }
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-row small { color: #5b7396 !important; }
html body #hud section.window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-row em { color: #1f5fd0 !important; }

/* ---------------------------------------------------------------- BLACKSMITH / REFINE */
html body #hud #refine-window.nv-forge .nvf-grid {
  display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.3fr); gap: calc(var(--u) * 14); align-items: start;
}
html body #hud #refine-window.nv-forge .nvf-card {
  margin: 0 0 calc(var(--u) * 12) !important; padding: 0 !important; overflow: hidden;
  border: calc(var(--u) * 2) solid #9ec2e6 !important; border-radius: calc(var(--u) * 14) !important;
  background: linear-gradient(180deg, #ffffff, #eef6fe) !important;
  box-shadow: inset 0 0 0 calc(var(--u) * 3) #ffffff, 0 calc(var(--u) * 2) calc(var(--u) * 5) rgba(20, 60, 120, 0.15) !important;
}
html body #hud #refine-window.nv-forge .nvf-main .nvf-card:last-child { margin-bottom: 0 !important; }
html body #hud #refine-window.nv-forge .nvf-head {
  display: flex; align-items: center; gap: calc(var(--u) * 10); margin: 0; padding: calc(var(--u) * 8) calc(var(--u) * 14);
  background: linear-gradient(180deg, #3f86e0, #1d58b0); color: #ffffff; font-size: calc(var(--u) * 24) !important; font-weight: 800;
  text-shadow: 0 calc(var(--u) * 2) 0 #0b2a66; border-bottom: calc(var(--u) * 2) solid #dfb758;
}
html body #hud #refine-window.nv-forge .nvf-head small { margin-left: auto; color: #ffe39a; font-size: calc(var(--u) * 19) !important; font-weight: 700; white-space: nowrap; }
/* equipment picker = settings list on the left */
html body #hud #refine-window.nv-forge .forge-bag .pw-list {
  display: flex !important; flex-direction: column !important; gap: calc(var(--u) * 6) !important;
  max-height: calc(var(--u) * 820) !important; overflow: auto !important; padding: calc(var(--u) * 10) !important;
}
html body #hud #refine-window.nv-forge .refine-item {
  grid-template-columns: calc(var(--u) * 42) minmax(0, 1fr) !important; min-height: calc(var(--u) * 58) !important;
  padding: calc(var(--u) * 4) calc(var(--u) * 10) !important; font-size: calc(var(--u) * 20) !important;
}
html body #hud #refine-window.nv-forge .refine-item[aria-pressed="true"] {
  background: linear-gradient(180deg, #fff6d6, #ffe39a) !important; border-color: #c9a24e !important;
  box-shadow: 0 0 0 calc(var(--u) * 2) #ffe39a, inset calc(var(--u) * 5) 0 0 #e2ab33 !important;
}
html body #hud #refine-window.nv-forge .refine-item .equipped-tag { color: #1c7a3e !important; }
/* anvil stage */
html body #hud #refine-window.nv-forge .forge-stage {
  aspect-ratio: 300 / 165 !important; margin: calc(var(--u) * 10) !important;
  border: calc(var(--u) * 2) solid #9ec2e6 !important; border-radius: calc(var(--u) * 12) !important;
  background-color: #bcd7f2 !important; box-shadow: inset 0 0 0 calc(var(--u) * 3) rgba(255, 255, 255, 0.5) !important;
}
html body #hud #refine-window.nv-forge .forge-slot { border-color: #ffffff !important; border-radius: 50% !important; background: radial-gradient(circle at 40% 35%, #ffffff, #d8ebfa) !important; box-shadow: 0 0 0 calc(var(--u) * 3) #dfb758, 0 calc(var(--u) * 4) calc(var(--u) * 8) rgba(10, 30, 60, 0.4) !important; }
html body #hud #refine-window.nv-forge .forge-levels {
  display: grid !important; grid-template-columns: repeat(10, minmax(0, 1fr)) !important; gap: calc(var(--u) * 5) !important;
  padding: 0 calc(var(--u) * 10) calc(var(--u) * 12) !important;
}
html body #hud #refine-window.nv-forge .forge-levels span {
  width: auto !important; height: calc(var(--u) * 34) !important; clip-path: none !important; border-radius: calc(var(--u) * 8) !important;
  background: #e3effb !important; color: #7d93b3 !important; font-size: calc(var(--u) * 19) !important; box-shadow: inset 0 0 0 calc(var(--u) * 1.5) #cfe2f5;
}
html body #hud #refine-window.nv-forge .forge-levels span.filled { background: linear-gradient(180deg, #4f93f2, #1f5fd0) !important; color: #ffffff !important; box-shadow: none; }
html body #hud #refine-window.nv-forge .forge-levels span.next { background: linear-gradient(180deg, #ffe39a, #e2ab33) !important; color: #3d2806 !important; box-shadow: none; }
/* odds */
html body #hud #refine-window.nv-forge .forge-odds { margin: 0 !important; padding: calc(var(--u) * 10) calc(var(--u) * 10) calc(var(--u) * 6) !important; border: 0 !important; background: none !important; box-shadow: none !important; }
html body #hud #refine-window.nv-forge .forge-chance {
  border: calc(var(--u) * 1.5) solid #b9d3ec !important; border-radius: calc(var(--u) * 10) !important;
  background: #eaf4fd !important; box-shadow: none !important; color: #1d3a78 !important; font-size: calc(var(--u) * 26) !important;
}
html body #hud #refine-window.nv-forge .nvf-rates { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(var(--u) * 6); padding: 0 calc(var(--u) * 10) calc(var(--u) * 12); }
html body #hud #refine-window.nv-forge .nvf-rate {
  display: flex; flex-direction: column; align-items: center; gap: calc(var(--u) * 2); padding: calc(var(--u) * 6) calc(var(--u) * 2);
  border-radius: calc(var(--u) * 10); background: #ffffff; border: calc(var(--u) * 1.5) solid #cfe2f5; text-align: center;
}
html body #hud #refine-window.nv-forge .nvf-rate span { font-size: calc(var(--u) * 18) !important; font-weight: 700; color: #3a5680; }
html body #hud #refine-window.nv-forge .nvf-rate b { font-size: calc(var(--u) * 28) !important; font-weight: 800; color: #c0392b; line-height: 1.1; }
html body #hud #refine-window.nv-forge .nvf-rate.safe b { color: #1c7a3e; }
html body #hud #refine-window.nv-forge .nvf-rate small { font-size: calc(var(--u) * 15) !important; color: #7d93b3; }
html body #hud #refine-window.nv-forge .nvf-rate.on { background: linear-gradient(180deg, #fff6d6, #ffe39a); border-color: #c9a24e; box-shadow: 0 0 0 calc(var(--u) * 2) #ffe39a; }
/* materials */
html body #hud #refine-window.nv-forge .nvf-mats { display: grid; grid-template-columns: 1fr 1fr; gap: calc(var(--u) * 8); padding: calc(var(--u) * 10); }
html body #hud #refine-window.nv-forge .nvf-mat {
  display: grid; grid-template-columns: calc(var(--u) * 40) minmax(0, 1fr) auto; align-items: center; gap: calc(var(--u) * 8);
  padding: calc(var(--u) * 6) calc(var(--u) * 10); border-radius: calc(var(--u) * 10); background: #ffffff; border: calc(var(--u) * 1.5) solid #cfe2f5; opacity: 0.55;
}
html body #hud #refine-window.nv-forge .nvf-mat.on { opacity: 1; border-color: #c9a24e; box-shadow: 0 0 0 calc(var(--u) * 2) #ffe39a; }
html body #hud #refine-window.nv-forge .nvf-mat img { width: calc(var(--u) * 38); height: calc(var(--u) * 38); object-fit: contain; image-rendering: pixelated; }
html body #hud #refine-window.nv-forge .nvf-mat span { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
html body #hud #refine-window.nv-forge .nvf-mat b { font-size: calc(var(--u) * 20) !important; color: #10294f; }
html body #hud #refine-window.nv-forge .nvf-mat small { font-size: calc(var(--u) * 15) !important; color: #5b7396; }
html body #hud #refine-window.nv-forge .nvf-mat em { font-style: normal; font-weight: 800; font-size: calc(var(--u) * 24) !important; color: #1f5fd0; font-variant-numeric: tabular-nums; }
html body #hud #refine-window.nv-forge .forge-bar { margin: 0 calc(var(--u) * 10) calc(var(--u) * 12) !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; }
html body #hud #refine-window.nv-forge .forge-bar > span { color: #2d4c7a !important; font-size: calc(var(--u) * 19) !important; }
html body #hud #refine-window.nv-forge .refine-warning {
  margin: calc(var(--u) * 4) 0 0 !important; padding: calc(var(--u) * 8) calc(var(--u) * 14) !important;
  border: calc(var(--u) * 1.5) solid #f1c6bf; border-radius: calc(var(--u) * 10); background: #fff5f3;
  color: #a3392a !important; font-size: calc(var(--u) * 18) !important; font-weight: 600 !important;
}

/* ---------------------------------------------------------------- MERCHANT */
html body #hud #merchant-window.nv-shop .merchant-top {
  display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: calc(var(--u) * 14) !important;
  min-height: 0 !important; margin: 0 0 calc(var(--u) * 12) !important; padding: calc(var(--u) * 10) calc(var(--u) * 14) !important;
  border: calc(var(--u) * 2) solid #9ec2e6 !important; border-radius: calc(var(--u) * 14) !important;
  background: linear-gradient(120deg, #ffffff 0%, #eaf4fd 60%, #d6e9f9 100%) !important;
  box-shadow: inset 0 0 0 calc(var(--u) * 2) #ffffff, 0 calc(var(--u) * 2) calc(var(--u) * 5) rgba(20, 60, 120, 0.15) !important;
}
html body #hud #merchant-window.nv-shop .nvs-wallet { display: flex; align-items: center; gap: calc(var(--u) * 10); }
html body #hud #merchant-window.nv-shop .nvs-coin { width: calc(var(--u) * 44); height: calc(var(--u) * 44); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff6c8, #f4c542 45%, #b98311) !important; box-shadow: 0 0 0 calc(var(--u) * 2) #8a5d0b, inset 0 0 0 calc(var(--u) * 5) #f8d970; }
html body #hud #merchant-window.nv-shop .nvs-wallet > span { display: flex; flex-direction: column; line-height: 1.1; }
html body #hud #merchant-window.nv-shop .nvs-wallet small { font-size: calc(var(--u) * 16) !important; color: #5b7396; font-weight: 600; }
html body #hud #merchant-window.nv-shop .merchant-coin { font-size: calc(var(--u) * 28) !important; color: #10294f !important; }
html body #hud #merchant-window.nv-shop .merchant-coin::before { display: none !important; }
/* segmented buy / sell switch */
html body #hud #merchant-window.nv-shop .merchant-tabs {
  display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 0 !important; margin: 0 !important; justify-self: center; width: min(100%, calc(var(--u) * 330));
  padding: calc(var(--u) * 4); border-radius: 999px; background: #d6e7f7; box-shadow: inset 0 calc(var(--u) * 2) calc(var(--u) * 4) rgba(16, 41, 79, 0.18);
}
html body #hud #merchant-window.nv-shop .mc-tab {
  height: calc(var(--u) * 48) !important; border: 0 !important; border-radius: 999px !important; background: none !important; box-shadow: none !important;
  color: #3a5680 !important; font-family: inherit !important; font-size: calc(var(--u) * 23) !important; font-weight: 800 !important; text-shadow: none !important;
}
html body #hud #merchant-window.nv-shop .mc-tab[aria-pressed="true"] {
  background: linear-gradient(180deg, #4f93f2, #1f5fd0) !important; color: #ffffff !important;
  box-shadow: 0 calc(var(--u) * 2) calc(var(--u) * 4) rgba(14, 42, 102, 0.4), inset 0 0 0 calc(var(--u) * 2) #dfb758 !important; text-shadow: 0 calc(var(--u) * 2) #0a1c44 !important;
}
html body #hud #merchant-window.nv-shop .merchant-range { padding: calc(var(--u) * 5) calc(var(--u) * 12); border-radius: 999px; background: #e3f5e8; color: #1c7a3e !important; font-size: calc(var(--u) * 17) !important; font-weight: 700; white-space: nowrap; }
html body #hud #merchant-window.nv-shop .merchant-range.far { background: #fdeee4; color: #b3612b !important; }
/* two columns: catalog | receipt */
html body #hud #merchant-window.nv-shop .merchant-columns { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) !important; gap: calc(var(--u) * 14) !important; }
html body #hud #merchant-window.nv-shop .pw-panel {
  padding: 0 !important; overflow: hidden; border: calc(var(--u) * 2) solid #9ec2e6 !important; border-radius: calc(var(--u) * 14) !important;
  background: linear-gradient(180deg, #ffffff, #eef6fe) !important; box-shadow: inset 0 0 0 calc(var(--u) * 3) #ffffff, 0 calc(var(--u) * 2) calc(var(--u) * 5) rgba(20, 60, 120, 0.15) !important;
}
html body #hud #merchant-window.nv-shop .pw-ribbon {
  display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: calc(var(--u) * 10) !important;
  min-height: 0 !important; margin: 0 !important; padding: calc(var(--u) * 8) calc(var(--u) * 14) !important; border-radius: 0 !important;
  background: linear-gradient(180deg, #3f86e0, #1d58b0) !important; border-bottom: calc(var(--u) * 2) solid #dfb758 !important;
  color: #ffffff !important; font-family: inherit !important; font-size: calc(var(--u) * 23) !important; text-shadow: 0 calc(var(--u) * 2) 0 #0b2a66 !important;
}
html body #hud #merchant-window.nv-shop .pw-ribbon small { margin-left: auto; color: #ffe39a !important; text-shadow: none !important; }
html body #hud #merchant-window.nv-shop .pw-list { height: calc(var(--u) * 470) !important; padding: calc(var(--u) * 10) !important; gap: calc(var(--u) * 6) !important; scrollbar-color: #7fa9d6 transparent !important; }
html body #hud #merchant-window.nv-shop .merchant-basket .pw-list { height: calc(var(--u) * 330) !important; background: repeating-linear-gradient(180deg, transparent 0 calc(var(--u) * 63), #e3effb calc(var(--u) * 63) calc(var(--u) * 64)); }
html body #hud #merchant-window.nv-shop .merchant-item small, html body #hud #merchant-window.nv-shop .sale-row span small { color: #1f5fd0 !important; }
html body #hud #merchant-window.nv-shop .merchant-columns footer, html body #hud #merchant-window.nv-shop .merchant-filters { border-top: 0 !important; padding: calc(var(--u) * 8) calc(var(--u) * 10) !important; background: #eaf4fd; }
html body #hud #merchant-window.nv-shop .merchant-filters { background: none; padding-bottom: 0 !important; }
html body #hud #merchant-window.nv-shop .merchant-add-all span { color: #3a5680 !important; font-weight: 700; }
html body #hud #merchant-window.nv-shop .sale-row > button { border-color: #f1c6bf !important; background: #fff5f3 !important; box-shadow: none !important; }
html body #hud #merchant-window.nv-shop .merchant-basket.sale-drop-hover { outline: calc(var(--u) * 4) dashed #1f5fd0 !important; background: #eaf4fd !important; }
/* receipt checkout inside the basket */
html body #hud #merchant-window.nv-shop .merchant-checkout {
  display: grid !important; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: calc(var(--u) * 6) calc(var(--u) * 10) !important;
  margin: 0 !important; padding: calc(var(--u) * 12) calc(var(--u) * 14) calc(var(--u) * 14) !important;
  border: 0 !important; border-top: calc(var(--u) * 2) dashed #9ec2e6 !important; border-radius: 0 !important; background: #f4f9ff !important; box-shadow: none !important;
}
html body #hud #merchant-window.nv-shop .merchant-checkout > span { color: #3a5680 !important; font-weight: 700; }
html body #hud #merchant-window.nv-shop .merchant-checkout strong { margin: 0 !important; text-align: right; color: #10294f !important; font-size: calc(var(--u) * 30) !important; }
html body #hud #merchant-window.nv-shop .merchant-passive-note { grid-column: 1 / -1; color: #1c7a3e !important; font-size: calc(var(--u) * 17) !important; }
html body #hud #merchant-window.nv-shop .merchant-passive-note:empty { display: none; }
html body #hud #merchant-window.nv-shop .nvs-actions { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: calc(var(--u) * 8); }
html body #hud #merchant-window.nv-shop .nvs-actions .pw-chip { height: auto !important; padding: 0 calc(var(--u) * 18) !important; }
html body #hud #merchant-window.nv-shop .merchant-primary { min-width: 0 !important; width: 100%; }

/* ---------------------------------------------------------------- phone */
@media (max-width: 700px) {
  html body #hud section.window.painted-window.nv-forge, html body #hud section.window.painted-window.nv-shop { --pw-width: 370px !important; }
  html body #hud #refine-window.nv-forge .nvf-grid, html body #hud #merchant-window.nv-shop .merchant-columns { grid-template-columns: 1fr !important; }
  html body #hud #refine-window.nv-forge .forge-bag .pw-list { max-height: calc(var(--u) * 360) !important; }
  html body #hud #refine-window.nv-forge .nvf-rates { grid-template-columns: repeat(2, 1fr); }
  html body #hud #merchant-window.nv-shop .merchant-top { grid-template-columns: 1fr auto; }
  html body #hud #merchant-window.nv-shop .merchant-tabs { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  html body #hud #merchant-window.nv-shop .pw-list { height: auto !important; max-height: 26dvh !important; }
}

/* ---------------------------------------------------------------- MARKET BROKER (bag style, sky / white) */
html body #hud section#market-window.nv-market {
  --mk-gold: #dfb758;
  background: radial-gradient(ellipse at 50% -10%, #ffffff 0%, #f0f7ff 38%, #e1eefb 72%, #cbe3f8 100%) !important;
  border: 3px solid #dfb758 !important; border-radius: 16px !important; border-image: none !important;
  box-shadow: 0 0 0 2px #734f0d, inset 0 0 0 2px #fff4cb, 0 18px 44px rgba(10, 30, 60, 0.45) !important;
  color: #10294f !important; overflow: hidden !important; padding: 0 !important;
}
html body #hud section#market-window.nv-market::before, html body #hud section#market-window.nv-market::after { display: none !important; }
/* head like the bag header */
html body #hud section#market-window.nv-market .mk-head {
  margin: 0 !important; min-height: 56px !important; padding: 8px 12px 8px 14px !important; gap: 10px !important;
  border: 0 !important; border-bottom: 2px solid #dfb758 !important; border-image: none !important;
  background: linear-gradient(180deg, #ffffff 0%, #eaf4fd 60%, #d6e9f9 100%) !important; box-shadow: inset 0 -1px 0 #fff4cb !important; color: #10294f !important;
}
html body #hud section#market-window.nv-market .mk-title { display: flex !important; flex-direction: row !important; align-items: center; gap: 10px; text-shadow: none !important; }
html body #hud section#market-window.nv-market .mk-title > span { display: flex; flex-direction: column; line-height: 1.1; }
html body #hud section#market-window.nv-market .nvm-badge {
  display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; font-style: normal; font-size: 20px !important;
  background: linear-gradient(180deg, #ffe39a, #e2ab33); color: #5a3d0a; box-shadow: 0 0 0 2px #9c7a36, inset 0 1px 0 rgba(255, 255, 255, 0.7);
}
html body #hud section#market-window.nv-market .mk-title b { font-family: inherit !important; font-size: 20px !important; color: #10294f !important; text-shadow: 0 1px 0 #fff !important; }
html body #hud section#market-window.nv-market .mk-title small { display: block !important; font-size: 12px !important; color: #8c6a2a !important; }
html body #hud section#market-window.nv-market .mk-silver {
  margin-left: auto !important; padding: 6px 14px !important; border-radius: 999px !important;
  background: #ffffff !important; color: #10294f !important; border: 1.5px solid #b9d3ec !important; box-shadow: inset 0 1px 3px rgba(16, 41, 79, 0.08) !important; font-weight: 700;
}
html body #hud section#market-window.nv-market .mk-silver b { font-weight: 800 !important; }
html body #hud section#market-window.nv-market .mk-log-btn {
  display: inline-flex !important; align-items: center; gap: 6px; padding: 6px 12px !important; border-radius: 999px !important;
  background: linear-gradient(180deg, #ffffff, #d8ebfa) !important; color: #1d4f9a !important; border: 1.5px solid #9ec2e6 !important; box-shadow: none !important; font-size: 13px !important; font-weight: 700;
}
html body #hud section#market-window.nv-market .mk-log-btn svg { width: 16px; height: 16px; }
html body #hud section#market-window.nv-market .mk-close {
  position: static !important; width: 34px !important; height: 34px !important; padding: 0 !important; border-radius: 50% !important;
  background: radial-gradient(circle at 40% 35%, #ffffff, #d8ebfa) !important; color: #8c6a2a !important; border: 2px solid #c9a24e !important; box-shadow: none !important; font-size: 15px !important;
}
/* tabs = bag pills */
html body #hud section#market-window.nv-market .mk-tabs { display: flex !important; align-items: center !important; gap: 6px !important; margin: 0 !important; padding: 8px 12px 0 !important; background: none !important; border: 0 !important; }
html body #hud section#market-window.nv-market .mk-tab {
  flex: 0 0 auto !important; min-width: 0 !important; padding: 6px 16px !important; gap: 6px !important;
  border: 1.5px solid #b9d3ec !important; border-image: none !important; border-radius: 999px !important;
  background: linear-gradient(180deg, #ffffff, #e3effb) !important; box-shadow: none !important; color: #1d4f9a !important; font-family: inherit !important; font-size: 13px !important; text-shadow: none !important;
}
html body #hud section#market-window.nv-market .mk-tab svg { color: #3a6fb8 !important; width: 16px; height: 16px; }
html body #hud section#market-window.nv-market .mk-tab[aria-pressed="true"] { background: linear-gradient(180deg, #ffe39a, #e2ab33) !important; border: 2px solid #9c7a36 !important; color: #3d2806 !important; }
html body #hud section#market-window.nv-market .mk-tab[aria-pressed="true"] svg { color: #5a3d0a !important; }
html body #hud section#market-window.nv-market .mk-badge { background: #1f5fd0 !important; color: #fff !important; }
html body #hud section#market-window.nv-market .mk-range { margin-left: auto; color: #b3612b !important; font-size: 12px !important; font-weight: 700; }
/* body */
html body #hud section#market-window.nv-market .mk-body { background: none !important; border: 0 !important; border-image: none !important; padding: 10px 12px !important; }
html body #hud section#market-window.nv-market :is(.mk-side, .mk-table, .mk-detail, .mk-bag, .mk-log) {
  border: 1.5px solid #b9d3ec !important; border-image: none !important; border-radius: 12px !important;
  background: linear-gradient(180deg, #ffffff, #eef6fe) !important; box-shadow: 0 2px 6px rgba(20, 60, 120, 0.1) !important; color: #10294f !important;
}
/* category rail = bag side */
html body #hud section#market-window.nv-market .mk-side { background: linear-gradient(90deg, #e3effb, #eef6fd) !important; padding: 0 0 6px !important; }
html body #hud section#market-window.nv-market .mk-side h4 { margin: 0 0 4px !important; padding: 8px 12px !important; background: none !important; border: 0 !important; border-bottom: 1.5px solid #cfe2f5 !important; color: #5b7396 !important; font-family: inherit !important; font-size: 12px !important; text-shadow: none !important; letter-spacing: .04em; }
html body #hud section#market-window.nv-market .mk-side h4::before { content: none !important; }
html body #hud section#market-window.nv-market :is(.mk-cat, .mk-fav-filter) {
  margin: 1px 6px !important; padding: 7px 10px !important; border: 1px solid transparent !important; border-image: none !important; border-radius: 10px !important;
  background: none !important; box-shadow: none !important; color: #10294f !important; font-weight: 600 !important; text-shadow: none !important;
}
html body #hud section#market-window.nv-market :is(.mk-cat, .mk-fav-filter) svg { color: #3a6fb8 !important; }
html body #hud section#market-window.nv-market :is(.mk-cat, .mk-fav-filter):hover { background: rgba(255, 255, 255, 0.8) !important; }
html body #hud section#market-window.nv-market :is(.mk-cat, .mk-fav-filter)[aria-pressed="true"] {
  background: linear-gradient(180deg, #ffe39a, #e2ab33) !important; border-color: #9c7a36 !important; color: #2b1803 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 1px 4px rgba(156, 122, 54, 0.45) !important;
}
html body #hud section#market-window.nv-market :is(.mk-cat, .mk-fav-filter)[aria-pressed="true"] svg { color: #6b4a0e !important; }
/* tools */
html body #hud section#market-window.nv-market .mk-search,
html body #hud section#market-window.nv-market .mk-tools > select,
html body #hud section#market-window.nv-market .mk-sort {
  border: 1.5px solid #b9d3ec !important; border-image: none !important; border-radius: 999px !important; background: #ffffff !important;
  box-shadow: inset 0 1px 3px rgba(16, 41, 79, 0.08) !important; color: #10294f !important; padding: 0 10px !important;
}
html body #hud section#market-window.nv-market .mk-sort select { border: 0 !important; background: none !important; box-shadow: none !important; }
html body #hud section#market-window.nv-market .mk-search input { color: #10294f !important; }
html body #hud section#market-window.nv-market .mk-search svg, html body #hud section#market-window.nv-market .mk-sort svg { color: #3a5680 !important; }
/* table */
html body #hud section#market-window.nv-market .mk-row.mk-table-head,
html body #hud section#market-window.nv-market .mk-row.mk-table-head:hover {
  background: linear-gradient(180deg, #eaf4fd, #d6e9f9) !important; border: 0 !important; border-bottom: 2px solid #dfb758 !important; color: #1d3a78 !important; text-shadow: none !important;
}
html body #hud section#market-window.nv-market .mk-table-head span:nth-child(2)::before { color: #e2ab33 !important; }
html body #hud section#market-window.nv-market .mk-row { background: #ffffff !important; border-bottom: 1px solid #e3effb !important; }
html body #hud section#market-window.nv-market :is(#market-rows, #market-mine-rows) .mk-row:nth-child(2n) { background: #f4f9ff !important; }
html body #hud section#market-window.nv-market :is(#market-rows, #market-mine-rows) .mk-row:hover { background: #e8f2fd !important; }
html body #hud section#market-window.nv-market :is(#market-rows, #market-mine-rows) .mk-row.selected { background: linear-gradient(180deg, #fff6d6, #ffe9a8) !important; box-shadow: inset 4px 0 0 #e2ab33 !important; }
html body #hud section#market-window.nv-market .mk-icon, html body #hud section#market-window.nv-market .mk-row.selected .mk-icon {
  background: linear-gradient(180deg, #ffffff, #e9f3fc) !important; border: 1.5px solid #b9d3ec !important; border-radius: 10px !important; box-shadow: none !important;
}
html body #hud section#market-window.nv-market .mk-price b { color: #1f5fd0 !important; }
html body #hud section#market-window.nv-market :is(.mk-btn-buy, .mk-btn-take) { border-radius: 999px !important; border: 1.5px solid #0e2a66 !important; background: linear-gradient(180deg, #4f93f2, #1f5fd0 55%, #174cb0) !important; color: #fff !important; box-shadow: inset 0 1px 0 #9cc6ff !important; border-image: none !important; }
html body #hud section#market-window.nv-market .mk-btn-take { background: linear-gradient(180deg, #ffffff, #e3effb) !important; color: #1d4f9a !important; border-color: #9ec2e6 !important; }
html body #hud section#market-window.nv-market .mk-pager { color: #3a5680 !important; }
html body #hud section#market-window.nv-market .mk-pages :is(button, span) { border-radius: 8px !important; }
html body #hud section#market-window.nv-market .mk-pages button[aria-current] { background: linear-gradient(180deg, #ffe39a, #e2ab33) !important; color: #3d2806 !important; border-color: #9c7a36 !important; }
/* detail card */
html body #hud section#market-window.nv-market .mk-detail { background: #ffffff !important; }
html body #hud section#market-window.nv-market .mk-d-head { border-bottom: 1.5px solid #cfe2f5 !important; }
html body #hud section#market-window.nv-market .mk-d-icon { background: linear-gradient(180deg, #ffffff, #e9f3fc) !important; border: 1.5px solid #b9d3ec !important; border-radius: 12px !important; }
html body #hud section#market-window.nv-market .mk-d-tabs button, html body #hud section#market-window.nv-market .mk-ranges button { border-radius: 999px !important; border: 1.5px solid #b9d3ec !important; border-image: none !important; background: linear-gradient(180deg, #ffffff, #e3effb) !important; color: #1d4f9a !important; }
html body #hud section#market-window.nv-market .mk-d-tabs button[aria-pressed="true"], html body #hud section#market-window.nv-market .mk-ranges button[aria-pressed="true"] { background: linear-gradient(180deg, #ffe39a, #e2ab33) !important; border-color: #9c7a36 !important; color: #3d2806 !important; }
html body #hud section#market-window.nv-market .mk-d-stats > div { background: #eaf4fd !important; border: 1px solid #cfe2f5 !important; border-radius: 10px !important; }
html body #hud section#market-window.nv-market .mk-d-flavor { color: #5b7396 !important; }
html body #hud section#market-window.nv-market .mk-detail button:not(.mk-heart):not([data-detail]):not([data-range]) { border-image: none !important; }
/* footer like the bag footer */
html body #hud section#market-window.nv-market .mk-foot {
  margin: 0 !important; min-height: 34px !important; padding: 4px 14px !important; gap: 12px !important;
  border: 0 !important; border-top: 2px solid #dfb758 !important; border-image: none !important;
  background: linear-gradient(180deg, #eaf4fd, #d6e9f9) !important; color: #3a5680 !important; font-size: 12px !important;
}
html body #hud section#market-window.nv-market .mk-safe { display: inline-flex; align-items: center; gap: 6px; color: #1c7a3e !important; }
html body #hud section#market-window.nv-market .mk-safe svg { width: 16px; height: 16px; }
html body #hud section#market-window.nv-market #market-result { margin: 0 0 0 auto !important; color: #1f5fd0 !important; font-weight: 700; }

/* ---------------------------------------------------------------- fit fixes (checked in game 1280x800) */
html body #hud section.window.painted-window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) { --window-scale: 0.85; }
html body #hud section.window.painted-window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) .pw-body { max-height: calc((100dvh - 24px) / var(--ui-zoom, 1) / var(--window-scale, 1) - var(--u) * 250) !important; }
/* the frame itself may grow as tall as the body allows (the body limit above already counts --window-scale),
   otherwise the body ran past the bottom of the frame (Blacksmith list / warning outside the window) */
html body #hud section.window.painted-window:is(.nv-forge, .nv-shop, .nv-vault, .nv-guild) { max-height: calc((100dvh - 24px) / var(--ui-zoom, 1) / var(--window-scale, 1)) !important; }
/* Blacksmith: the equipment list scrolls inside its own card instead of stretching the window */
html body #hud #refine-window.nv-forge .forge-bag .pw-list { max-height: min(calc(var(--u) * 700), calc((100dvh - 24px) / var(--ui-zoom, 1) / var(--window-scale, 1) - var(--u) * 420)) !important; overscroll-behavior: contain; }
html body #hud #refine-window.nv-forge .refine-item { min-width: 0; }
html body #hud #refine-window.nv-forge .refine-item span { min-width: 0; overflow: hidden; text-overflow: ellipsis; overflow-wrap: anywhere; }
html body #hud #refine-window.nv-forge .forge-stage { aspect-ratio: 300 / 140 !important; }
html body #hud #refine-window.nv-forge .nvf-pick .nvf-head small { display: none; }
html body #hud #merchant-window.nv-shop .merchant-top { grid-template-columns: auto auto minmax(0, 1fr) !important; }
html body #hud #merchant-window.nv-shop .merchant-tabs { width: calc(var(--u) * 360) !important; }
html body #hud #merchant-window.nv-shop .mc-tab { white-space: nowrap !important; font-size: calc(var(--u) * 20) !important; padding: 0 calc(var(--u) * 12) !important; }
html body #hud #merchant-window.nv-shop .merchant-range { justify-self: end; white-space: normal; text-align: right; }

/* =====================================================================
   STORAGE KEEPER (#storage-window.nv-vault) - settings sky frame, account-wide vault
   ===================================================================== */
html body #hud section.window.painted-window.nv-vault { --pw-width: 700px !important; }
html body #hud #storage-window.nv-vault .storage-top {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: calc(var(--u) * 14) !important;
  min-height: 0 !important; margin: 0 0 calc(var(--u) * 12) !important; padding: calc(var(--u) * 10) calc(var(--u) * 14) !important;
  border: calc(var(--u) * 2) solid #9ec2e6 !important; border-radius: calc(var(--u) * 14) !important;
  background: linear-gradient(120deg, #ffffff 0%, #eaf4fd 60%, #d6e9f9 100%) !important;
  box-shadow: inset 0 0 0 calc(var(--u) * 2) #ffffff, 0 calc(var(--u) * 2) calc(var(--u) * 5) rgba(20, 60, 120, 0.15) !important;
  white-space: normal !important;
}
html body #hud #storage-window.nv-vault .nvv-badge { display: flex; align-items: center; gap: calc(var(--u) * 12); min-width: 0; }
html body #hud #storage-window.nv-vault .nvv-badge .nvf-ico { width: calc(var(--u) * 48); height: calc(var(--u) * 48); font-size: calc(var(--u) * 24) !important; }
html body #hud #storage-window.nv-vault .nvv-badge > span { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
html body #hud #storage-window.nv-vault .nvv-badge b { font-size: calc(var(--u) * 26) !important; color: #10294f; }
html body #hud #storage-window.nv-vault .nvv-badge small { font-size: calc(var(--u) * 16) !important; color: #5b7396; font-weight: 600; }
html body #hud #storage-window.nv-vault .nvv-meta { display: flex; flex-direction: column; align-items: flex-end; gap: calc(var(--u) * 4); }
html body #hud #storage-window.nv-vault #storage-count { padding: calc(var(--u) * 4) calc(var(--u) * 12); border-radius: 999px; background: #ffffff; border: calc(var(--u) * 1.5) solid #b9d3ec; color: #1d4f9a !important; font-size: calc(var(--u) * 18) !important; font-weight: 800; }
html body #hud #storage-window.nv-vault #storage-range { padding: calc(var(--u) * 3) calc(var(--u) * 12); border-radius: 999px; background: #e3f5e8; color: #1c7a3e !important; font-size: calc(var(--u) * 16) !important; font-weight: 700; }
html body #hud #storage-window.nv-vault #storage-range.far { background: #fdeee4; color: #b3612b !important; }
html body #hud #storage-window.nv-vault .storage-columns { grid-template-columns: minmax(0, 1fr) calc(var(--u) * 36) minmax(0, 1fr) !important; gap: calc(var(--u) * 8) !important; align-items: stretch; }
html body #hud #storage-window.nv-vault .nvv-arrows { display: flex; flex-direction: column; justify-content: center; gap: calc(var(--u) * 18); color: #7fa9d6; font-size: calc(var(--u) * 24); text-align: center; }
html body #hud #storage-window.nv-vault .nvv-arrows span:last-child { transform: scaleX(-1); color: #e2ab33; }
html body #hud #storage-window.nv-vault .pw-panel {
  padding: 0 !important; overflow: hidden; border: calc(var(--u) * 2) solid #9ec2e6 !important; border-radius: calc(var(--u) * 14) !important;
  background: linear-gradient(180deg, #ffffff, #eef6fe) !important; box-shadow: inset 0 0 0 calc(var(--u) * 3) #ffffff, 0 calc(var(--u) * 2) calc(var(--u) * 5) rgba(20, 60, 120, 0.15) !important;
}
html body #hud #storage-window.nv-vault .nvv-vault { border-color: #dfb758 !important; background: linear-gradient(180deg, #fffdf5, #fff4d6) !important; }
html body #hud #storage-window.nv-vault .pw-ribbon {
  display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: calc(var(--u) * 10) !important;
  min-height: 0 !important; margin: 0 !important; padding: calc(var(--u) * 8) calc(var(--u) * 14) !important; border-radius: 0 !important;
  background: linear-gradient(180deg, #3f86e0, #1d58b0) !important; border-bottom: calc(var(--u) * 2) solid #dfb758 !important;
  color: #ffffff !important; font-family: inherit !important; font-size: calc(var(--u) * 22) !important; text-shadow: 0 calc(var(--u) * 2) 0 #0b2a66 !important;
}
html body #hud #storage-window.nv-vault .nvv-vault .pw-ribbon { background: linear-gradient(180deg, #f0c552, #c98f1c) !important; text-shadow: 0 calc(var(--u) * 2) 0 #6b4a0e !important; }
html body #hud #storage-window.nv-vault .pw-ribbon small { margin-left: auto; color: #ffe39a !important; text-shadow: none !important; font-size: calc(var(--u) * 16) !important; }
html body #hud #storage-window.nv-vault .nvv-vault .pw-ribbon small { color: #fffbe8 !important; }
html body #hud #storage-window.nv-vault #storage-bag, html body #hud #storage-window.nv-vault #storage-items { height: calc(var(--u) * 560) !important; max-height: 42dvh !important; padding: calc(var(--u) * 10) !important; gap: calc(var(--u) * 6) !important; }
html body #hud #storage-window.nv-vault #withdraw-detail {
  border: calc(var(--u) * 2) solid #dfb758 !important; border-radius: calc(var(--u) * 14) !important; background: #fffdf5 !important;
  box-shadow: 0 calc(var(--u) * 2) calc(var(--u) * 5) rgba(120, 90, 20, 0.15) !important;
}
html body #hud #storage-window.nv-vault #withdraw-name { color: #10294f !important; }
@media (max-width: 700px) {
  html body #hud section.window.painted-window.nv-vault { --pw-width: 370px !important; }
  html body #hud #storage-window.nv-vault .storage-columns { grid-template-columns: 1fr !important; }
  html body #hud #storage-window.nv-vault .nvv-arrows { display: none; }
  html body #hud #storage-window.nv-vault #storage-bag, html body #hud #storage-window.nv-vault #storage-items { height: auto !important; max-height: 24dvh !important; }
}

/* =====================================================================
   PLAYER RIGHT-CLICK MENU (#player-menu.nv-pmenu) - like the character card (top-left)
   ===================================================================== */
#hud #player-menu.nv-pmenu {
  position: absolute; left: 0; top: 0; z-index: 90; width: 236px; min-width: 0 !important; max-width: 92vw;
  padding: 0; border-radius: 14px; overflow: hidden; color: #10294f;
  background: radial-gradient(ellipse at 50% -10%, #ffffff 0%, #f0f7ff 35%, #e1eefb 70%, #cbe3f8 100%);
  border: 1px solid #dfb758; box-shadow: 0 0 0 1px #734f0d, inset 0 0 0 1.5px #fff4cb, 0 10px 26px rgba(10, 30, 60, 0.45);
  font-family: 'Noto Sans Thai', 'Mali', sans-serif; animation: nvpm-in .14s ease-out;
}
@keyframes nvpm-in { from { opacity: 0; transform-origin: 0 0; scale: .94; } to { opacity: 1; scale: 1; } }
#hud #player-menu.nv-pmenu .pw-panel { display: block; padding: 0; margin: 0; border: 0; background: none; box-shadow: none; min-width: 0; }
#hud #player-menu.nv-pmenu .pw-ribbon {
  display: flex; align-items: center; gap: 10px; min-height: 0; margin: 0; padding: 10px 12px; border: 0; border-radius: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(234,244,253,.9)); border-bottom: 1.5px solid #dfb758;
  color: #10294f; text-shadow: none; font-family: inherit;
}
#hud #player-menu.nv-pmenu .nv-pm-face {
  flex: none; width: 44px; height: 44px; border-radius: 50%; background: #eaf4fd center 30% / 150% auto no-repeat; image-rendering: pixelated;
  box-shadow: 0 0 0 2px #ffffff, 0 0 0 3.5px #dfb758, 0 2px 6px rgba(10, 30, 60, 0.3);
}
#hud #player-menu.nv-pmenu .nv-pm-who { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
#hud #player-menu.nv-pmenu .nv-pm-who b { font-size: 15px !important; font-weight: 800; color: #10294f; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#hud #player-menu.nv-pmenu .nv-pm-who small { font-size: 12px !important; color: #8c6a2a; font-weight: 700; }
#hud #player-menu.nv-pmenu .pw-list { display: flex; flex-direction: column; gap: 2px; padding: 6px; max-height: none; overflow: visible; }
#hud #player-menu.nv-pmenu .player-menu-item {
  display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 10px; width: 100%; min-height: 38px;
  padding: 4px 10px; border: 0; border-radius: 10px; background: none; box-shadow: none; cursor: pointer; text-align: left; filter: none;
  color: #10294f; font: inherit; font-size: 14px !important;
}
#hud #player-menu.nv-pmenu .player-menu-item:hover { background: rgba(255, 255, 255, 0.85); box-shadow: inset 0 0 0 1px #b9d3ec; }
#hud #player-menu.nv-pmenu .player-menu-item:active { background: linear-gradient(180deg, #ffe39a, #e2ab33); }
#hud #player-menu.nv-pmenu .player-menu-item i {
  display: grid; place-items: center; width: 30px; height: 30px; border: 0; border-radius: 50%;
  background: linear-gradient(180deg, #4f93f2, #1f5fd0); color: #ffffff; box-shadow: 0 0 0 1.5px #ffffff, 0 1px 3px rgba(14, 42, 102, 0.4);
}
#hud #player-menu.nv-pmenu .player-menu-item svg { width: 17px; height: 17px; }
#hud #player-menu.nv-pmenu .player-menu-item span { font-weight: 700; color: #10294f; }
#hud #player-menu.nv-pmenu .player-menu-item + .player-menu-item { box-shadow: inset 0 1px 0 rgba(185, 211, 236, 0.55); }
#hud #player-menu.nv-pmenu .player-menu-item + .player-menu-item:hover { box-shadow: inset 0 0 0 1px #b9d3ec; }
#hud #player-menu.nv-pmenu .player-menu-item:nth-child(3) i, #hud #player-menu.nv-pmenu .player-menu-item:nth-child(4) i, #hud #player-menu.nv-pmenu .player-menu-item:nth-child(5) i { background: linear-gradient(180deg, #ffe39a, #e2ab33); color: #5a3d0a; }

/* =====================================================================
   iPhone-style status bar under the character card (#mm-status-strip.nv-ios)
   ===================================================================== */
html body #hud #mm-status-strip.nv-ios {
  position: fixed !important; height: 30px !important; padding: 0 12px 0 14px !important; box-sizing: border-box !important;
  display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important;
  border-radius: 15px !important; background: rgba(255, 255, 255, 0.78) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important; backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 0 0 1px rgba(223, 183, 88, 0.55), 0 6px 16px rgba(10, 35, 70, 0.2) !important;
  color: #0b1b33 !important; z-index: 31 !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "Noto Sans Thai", sans-serif !important;
}
html body #hud #mm-status-strip.nv-ios #mm-clock { order: 0; margin-right: auto; color: #0b1b33 !important; font-size: 15px !important; font-weight: 700 !important; letter-spacing: -0.3px !important; text-shadow: none !important; }
html body #hud #mm-status-strip.nv-ios #mm-fps { order: 1; color: #1d1d1f !important; font-size: 11px !important; font-weight: 600 !important; text-shadow: none !important; }
html body #hud #mm-status-strip.nv-ios #mm-ping { order: 2; color: #1d1d1f !important; font-size: 11px !important; font-weight: 600 !important; text-shadow: none !important; }
html body #hud #mm-status-strip.nv-ios #mm-ping::before { display: none !important; }
html body #hud #mm-status-strip.nv-ios #mm-online { order: 3; color: #1d4f9a !important; font-size: 11px !important; font-weight: 700 !important; text-shadow: none !important; }
/* cellular-style bars = FPS */
html body #hud #mm-status-strip.nv-ios .nv-sig { order: 4; display: inline-flex; align-items: flex-end; gap: 1.5px; height: 11px; }
html body #hud #mm-status-strip.nv-ios .nv-sig i { display: block; width: 3px; border-radius: 1px; background: rgba(11, 27, 51, 0.22); }
html body #hud #mm-status-strip.nv-ios .nv-sig i:nth-child(1) { height: 4px; } html body #hud #mm-status-strip.nv-ios .nv-sig i:nth-child(2) { height: 6px; }
html body #hud #mm-status-strip.nv-ios .nv-sig i:nth-child(3) { height: 8.5px; } html body #hud #mm-status-strip.nv-ios .nv-sig i:nth-child(4) { height: 11px; }
html body #hud #mm-status-strip.nv-ios[data-fps="1"] .nv-sig i:nth-child(-n+1),
html body #hud #mm-status-strip.nv-ios[data-fps="2"] .nv-sig i:nth-child(-n+2),
html body #hud #mm-status-strip.nv-ios[data-fps="3"] .nv-sig i:nth-child(-n+3),
html body #hud #mm-status-strip.nv-ios[data-fps="4"] .nv-sig i { background: #0b1b33; }
/* wifi = ping (3 bars) */
html body #hud #mm-status-strip.nv-ios .mm-wifi { order: 5; display: inline-flex !important; align-items: flex-end; gap: 1.5px; height: 11px; width: auto !important; border: 0 !important; background: none !important; }
html body #hud #mm-status-strip.nv-ios .mm-wifi i { display: block !important; position: static !important; width: 3px !important; border: 0 !important; border-radius: 1px !important; background: rgba(11, 27, 51, 0.22) !important; transform: none !important; }
html body #hud #mm-status-strip.nv-ios .mm-wifi i:nth-child(1) { height: 5px !important; } html body #hud #mm-status-strip.nv-ios .mm-wifi i:nth-child(2) { height: 8px !important; } html body #hud #mm-status-strip.nv-ios .mm-wifi i:nth-child(3) { height: 11px !important; }
html body #hud #mm-status-strip.nv-ios[data-net="1"] .mm-wifi i:nth-child(-n+1),
html body #hud #mm-status-strip.nv-ios[data-net="2"] .mm-wifi i:nth-child(-n+2),
html body #hud #mm-status-strip.nv-ios[data-net="3"] .mm-wifi i { background: #0b1b33 !important; }
/* battery */
html body #hud #mm-status-strip.nv-ios .mm-battery {
  order: 6; position: relative !important; display: inline-block !important; width: 24px !important; height: 12px !important; padding: 1.5px !important; box-sizing: border-box !important;
  border: 1px solid rgba(11, 27, 51, 0.45) !important; border-radius: 3.5px !important; background: none !important; margin-right: 3px;
}
html body #hud #mm-status-strip.nv-ios .mm-battery::after { content: '' !important; position: absolute !important; right: -3.5px !important; top: 3.5px !important; width: 2px !important; height: 3.5px !important; border-radius: 0 1px 1px 0 !important; background: rgba(11, 27, 51, 0.45) !important; border: 0 !important; }
html body #hud #mm-status-strip.nv-ios .mm-battery i { display: block !important; height: 100% !important; width: calc(var(--level, 1) * 100%) !important; border-radius: 1.5px !important; background: #0b1b33 !important; }
html body #hud #storage-window.nv-vault .storage-top { grid-template-columns: 1fr !important; }
html body #hud #storage-window.nv-vault .nvv-meta { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; }
html body #hud #storage-window.nv-vault .nvv-badge b { white-space: nowrap; }

/* =====================================================================
   ADVENTURER GUILD (#guild-window.nv-guild)
   ===================================================================== */
html body #hud section.window.painted-window.nv-guild { --pw-width: 700px !important; z-index: 40; }
#hud #guild-window .nvg-rank {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: calc(var(--u) * 14);
  padding: calc(var(--u) * 12) calc(var(--u) * 16); margin-bottom: calc(var(--u) * 10);
  border: calc(var(--u) * 2) solid #dfb758; border-radius: calc(var(--u) * 16);
  background: linear-gradient(120deg, #ffffff 0%, #fff6d6 55%, #ffe9a8 100%); box-shadow: 0 calc(var(--u) * 3) calc(var(--u) * 8) rgba(120, 90, 20, 0.2);
}
#hud #guild-window .nvg-crest { display: grid; place-items: center; width: calc(var(--u) * 78); height: calc(var(--u) * 78); border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #4f93f2, #1d58b0); box-shadow: 0 0 0 calc(var(--u) * 4) #ffffff, 0 0 0 calc(var(--u) * 7) #dfb758; color: #fff; line-height: 1; }
#hud #guild-window .nvg-crest b { font-size: calc(var(--u) * 36) !important; text-shadow: 0 calc(var(--u) * 2) #0b2a66; }
#hud #guild-window .nvg-crest small { font-size: calc(var(--u) * 13) !important; letter-spacing: .1em; color: #ffe39a; }
#hud #guild-window .nvg-rank-info { display: flex; flex-direction: column; gap: calc(var(--u) * 4); min-width: 0; }
#hud #guild-window .nvg-rank-info b { font-size: calc(var(--u) * 24) !important; color: #10294f; }
#hud #guild-window .nvg-rank-info small { font-size: calc(var(--u) * 16) !important; color: #6b4a0e; }
#hud #guild-window .nvg-bar { height: calc(var(--u) * 12); border-radius: 999px; background: #f3e3b5; overflow: hidden; box-shadow: inset 0 1px 2px rgba(0,0,0,.15); }
#hud #guild-window .nvg-bar i { display: block; height: 100%; background: linear-gradient(90deg, #4f93f2, #1f5fd0); border-radius: 999px; }
#hud #guild-window .nvg-zenbox { display: flex; flex-direction: column; align-items: center; padding: calc(var(--u) * 6) calc(var(--u) * 12); border-radius: calc(var(--u) * 12); background: #ffffff; border: calc(var(--u) * 1.5) solid #e6c77a; }
#hud #guild-window .nvg-zenbox b { font-size: calc(var(--u) * 22) !important; color: #10294f; }
#hud #guild-window .nvg-zenbox small { font-size: calc(var(--u) * 13) !important; color: #8c6a2a; }
#hud #guild-window .nvg-zen { display: inline-block; width: calc(var(--u) * 22); height: calc(var(--u) * 22); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff6c8, #f4c542 45%, #b98311); box-shadow: 0 0 0 1px #8a5d0b; vertical-align: middle; }
#hud #guild-window .nvg-mats { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: calc(var(--u) * 6); margin-bottom: calc(var(--u) * 10); }
#hud #guild-window .nvg-mat { display: flex; flex-direction: column; align-items: center; padding: calc(var(--u) * 6) 0; border-radius: calc(var(--u) * 12); background: linear-gradient(180deg, #ffffff, #eaf4fd); border: calc(var(--u) * 1.5) solid #b9d3ec; }
#hud #guild-window .nvg-mat img { width: calc(var(--u) * 40); height: calc(var(--u) * 40); image-rendering: pixelated; }
#hud #guild-window .nvg-mat b { font-size: calc(var(--u) * 16) !important; color: #1d4f9a; }
#hud #guild-window .nvg-tabs { display: grid; grid-template-columns: repeat(3, 1fr); padding: calc(var(--u) * 4); margin-bottom: calc(var(--u) * 10); border-radius: 999px; background: #d6e7f7; box-shadow: inset 0 calc(var(--u) * 2) calc(var(--u) * 4) rgba(16, 41, 79, 0.18); }
#hud #guild-window .nvg-tabs button { height: calc(var(--u) * 46); border: 0; border-radius: 999px; background: none; color: #3a5680; font: inherit; font-size: calc(var(--u) * 20) !important; font-weight: 800; cursor: pointer; }
#hud #guild-window .nvg-tabs button[aria-pressed="true"] { background: linear-gradient(180deg, #4f93f2, #1f5fd0); color: #fff; box-shadow: inset 0 0 0 calc(var(--u) * 2) #dfb758; text-shadow: 0 1px #0a1c44; }
#hud #guild-window #nvg-content { max-height: calc(var(--u) * 560); overflow: auto; scrollbar-color: #7fa9d6 transparent; }
#hud #guild-window :is(.nvg-req, .nvg-rec, .nvg-bonus, .nvg-src) {
  display: grid; grid-template-columns: calc(var(--u) * 58) minmax(0, 1fr) auto; align-items: center; gap: calc(var(--u) * 12);
  padding: calc(var(--u) * 10) calc(var(--u) * 14); margin-bottom: calc(var(--u) * 8); border-radius: calc(var(--u) * 14);
  background: #ffffff; border: calc(var(--u) * 1.5) solid #cfe2f5; box-shadow: 0 calc(var(--u) * 2) 0 #e3effb;
}
#hud #guild-window :is(.nvg-req, .nvg-rec, .nvg-bonus, .nvg-src) > img { width: calc(var(--u) * 56); height: calc(var(--u) * 56); image-rendering: pixelated; object-fit: contain; }
#hud #guild-window :is(.nvg-req-info, .nvg-rec-info, .nvg-bonus span, .nvg-src span) { display: flex; flex-direction: column; gap: calc(var(--u) * 3); min-width: 0; }
#hud #guild-window :is(.nvg-req-info, .nvg-rec-info, .nvg-bonus, .nvg-src) b { font-size: calc(var(--u) * 21) !important; color: #10294f; }
#hud #guild-window :is(.nvg-req-info, .nvg-rec-info, .nvg-bonus, .nvg-src) small { font-size: calc(var(--u) * 15) !important; color: #5b7396; }
#hud #guild-window .nvg-req.done, #hud #guild-window .nvg-bonus.done { background: linear-gradient(180deg, #f2fbf4, #e3f5e8); border-color: #9fd5ad; }
#hud #guild-window .nvg-bonus { grid-template-columns: calc(var(--u) * 58) minmax(0, 1fr); border-color: #dfb758; background: #fffdf5; }
#hud #guild-window .nvg-src { grid-template-columns: calc(var(--u) * 58) minmax(0, 1fr); }
#hud #guild-window .nvg-rec.featured { border: calc(var(--u) * 2) solid #dfb758; background: linear-gradient(120deg, #fffdf5, #fff1c7); }
#hud #guild-window .nvg-costs { display: flex; flex-wrap: wrap; gap: calc(var(--u) * 6); margin-top: calc(var(--u) * 2); }
#hud #guild-window .nvg-cost { display: inline-flex; align-items: center; gap: calc(var(--u) * 4); padding: calc(var(--u) * 2) calc(var(--u) * 10) calc(var(--u) * 2) calc(var(--u) * 4); border-radius: 999px; background: #eaf4fd; color: #1d4f9a; font-size: calc(var(--u) * 15) !important; font-weight: 800; }
#hud #guild-window .nvg-cost img { width: calc(var(--u) * 24); height: calc(var(--u) * 24); image-rendering: pixelated; }
#hud #guild-window .nvg-cost.short { background: #fdeee4; color: #b3612b; }
#hud #guild-window .nvg-left { color: #8c6a2a !important; }
#hud #guild-window .nvg-act { display: flex; align-items: center; gap: calc(var(--u) * 6); }
#hud #guild-window .nvg-act input { width: calc(var(--u) * 70); height: calc(var(--u) * 44); }
#hud #guild-window .nvg-req .pw-btn, #hud #guild-window .nvg-act .pw-btn { min-height: calc(var(--u) * 48) !important; font-size: calc(var(--u) * 19) !important; white-space: nowrap; }
#hud #guild-window .nvg-tip { padding: calc(var(--u) * 10) calc(var(--u) * 14); border-radius: calc(var(--u) * 12); background: #eaf4fd; color: #2d4c7a; font-size: calc(var(--u) * 16) !important; line-height: 1.5; }
@media (max-width: 700px) {
  html body #hud section.window.painted-window.nv-guild { --pw-width: 370px !important; }
  #hud #guild-window .nvg-mats { grid-template-columns: repeat(4, 1fr); }
  #hud #guild-window .nvg-rank { grid-template-columns: auto minmax(0, 1fr); }
  #hud #guild-window .nvg-zenbox { display: none; }
}