/* NEXORIA bundle206: style.css */
:root {
  --safe-top: max(4px, env(safe-area-inset-top));
  --safe-right: max(14px, env(safe-area-inset-right));
  --safe-bottom: max(14px, env(safe-area-inset-bottom));
  --safe-left: max(6px, env(safe-area-inset-left));
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  background: #06131f;
  touch-action: none;
  user-select: none;
}

button { font: inherit; }

#game {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: linear-gradient(#63bdf0, #bee8f4 62%, #357d49);
  isolation: isolate;
}

.parallax-track,
.world-track,
.cloud-field,
.grass-track,
#characterCanvas,
.skill2-vfx,
.sun-light,
.screen-vignette {
  position: absolute;
  inset: 0 auto 0 0;
  pointer-events: none;
}

.parallax-track,
.world-track {
  height: 100%;
  will-change: transform;
}

.sky-track { z-index: 1; }
.mountain-track { z-index: 3; }
.tree-layer-far { z-index: 4; }
.tree-layer-mid { z-index: 5; }
.tree-layer-back { z-index: 6; }
.house-track { z-index: 7; }

/* NEXORIA 1.0.3: các lớp này đã được đưa vào chung WebGL scene với nhân vật. */
.mountain-track,
.tree-layer,
.house-track,
.grass-track {
  display: none !important;
}

.sky-picture {
  width: 100%;
  height: 100%;
  background-position: center bottom;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.sky-picture { background-image: url("assets/world-3d/01-sky.png?v=1.0.86-20260910"); }

#game[data-map-id="map2"] {
  background: linear-gradient(#493b35, #725d49 60%, #302721);
}

#game[data-map-id="map2"] .sky-picture {
  filter: brightness(.48) saturate(.62) sepia(.32) hue-rotate(-8deg);
}

#game[data-map-id="map2"] .cloud-field { opacity: .26; }
#game[data-map-id="map2"] .sun-light { opacity: .34; }

/* Map3 renders its sky, layered clouds and sunlight in the scene. */
#game[data-map-id="map3"] .cloud-field,
#game[data-map-id="map3"] .sun-light,
#game[data-map-id="map3"] .sky-picture,
#game[data-map-id="map4"] .cloud-field,
#game[data-map-id="map4"] .sun-light,
#game[data-map-id="map4"] .sky-picture { display: none; }

.mountain-track {
  overflow: hidden;
}

.mountain-range {
  position: absolute;
  bottom: 7.5%;
  width: 31%;
  height: auto;
  opacity: .82;
  object-fit: contain;
  object-position: center bottom;
  filter: saturate(.74) brightness(1.04) contrast(.9);
}

.mountain-01 { left: -1%; }
.mountain-02 { left: 17%; bottom: 6.8%; opacity: .7; }
.mountain-03 { left: 35%; }
.mountain-04 { left: 53%; bottom: 6.8%; opacity: .7; }
.mountain-05 { left: 71%; }

.cloud-field {
  z-index: 2;
  width: 100%;
  height: 58%;
  overflow: hidden;
}

.cloud-sprite {
  position: absolute;
  left: 0;
  height: auto;
  opacity: .72;
  pointer-events: none;
  will-change: transform;
}

.cloud-a { top: -8%; width: clamp(560px, 72vw, 1060px); }
.cloud-b { top: 7%; width: clamp(430px, 59vw, 860px); opacity: .58; }
.cloud-c { top: 18%; width: clamp(350px, 48vw, 720px); opacity: .46; }

.world-track { overflow: visible; }

.layer-tree,
.world-house {
  position: absolute;
  pointer-events: none;
}

.layer-tree {
  height: auto;
  transform-origin: 50% 100%;
  animation: tree-sway var(--sway-time, 4s) ease-in-out var(--sway-delay, 0s) infinite alternate;
}

.tree-layer-far .layer-tree { filter: saturate(.6) brightness(1.06) contrast(.86); }
.tree-layer-mid .layer-tree { filter: saturate(.74) brightness(.99) contrast(.92); }
.tree-layer-back .layer-tree { filter: saturate(.88) brightness(.94); }

.world-house {
  bottom: 3.5%;
  width: 92.5vh;
  height: auto;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 12px 10px rgba(7,31,25,.2));
}

.house-01 { left: 1.5%; bottom: 3.5%; }
.house-02 { left: 13.7%; bottom: 2.54%; }
.house-03 { left: 27.1%; width: 70vh; bottom: 2%; }
.house-04 { left: 37%; bottom: .61%; }
.house-05 { left: 49.3%; bottom: 1.81%; }
.house-06 { left: 61.7%; bottom: 3.5%; }
.house-07 { left: 74.1%; bottom: 1.57%; }
.house-08 { left: 86.2%; bottom: 3.5%; }

.sun-light {
  z-index: 8;
  width: 100%;
  background:
    linear-gradient(112deg, rgba(255,255,255,.34) 0%, rgba(255,245,181,.12) 23%, transparent 44%),
    radial-gradient(circle at 16% 3%, rgba(255,251,205,.5), transparent 28%);
  mix-blend-mode: screen;
}

#characterCanvas {
  z-index: 7;
  width: 100%;
  height: 100%;
}

.skill2-vfx {
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  contain: layout paint style;
}

.skill2-vfx-ground { z-index: 9; }
.skill2-vfx-air { z-index: 10; }

.skill2-ring-plane,
.skill2-ice-slot,
.skill2-spark {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  will-change: transform, opacity;
}

.skill2-ring-plane {
  transform-origin: 50% 50%;
  filter: drop-shadow(0 0 9px rgba(43,196,255,.78));
}

.skill2-ring {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform-origin: 50% 50%;
  will-change: transform, opacity;
}

.skill2-ice-slot {
  width: 0;
  height: 0;
  transform-origin: 0 0;
}

.skill2-ice {
  position: absolute;
  right: auto;
  bottom: 0;
  left: 0;
  height: auto;
  transform-origin: 50% 100%;
  filter: drop-shadow(0 0 8px rgba(62,204,255,.82));
  will-change: transform, opacity;
}

.skill2-spark {
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 0 6px rgba(85,208,255,.94));
}

.grass-track {
  top: auto;
  bottom: -2px;
  z-index: 10;
  height: 13%;
  background-image: url("assets/grass-low.png"), url("assets/grass-low.png");
  background-repeat: repeat-x, repeat-x;
  background-position: left bottom, -54px calc(100% + 2px);
  background-size: auto calc(100% + 2px), auto 92%;
  filter: saturate(.92) brightness(.78);
  opacity: .96;
  animation: grass-breathe 2.8s ease-in-out infinite alternate;
  will-change: transform;
}

.screen-vignette {
  z-index: 12;
  width: 100%;
  background:
    linear-gradient(90deg, rgba(1,10,16,.25), transparent 16%, transparent 84%, rgba(1,10,16,.25)),
    linear-gradient(0deg, rgba(1,9,14,.38), transparent 19%, transparent 82%, rgba(1,9,14,.1));
}

.skill3-foreground-vfx {
  position: absolute;
  z-index: 13;
  inset: 0;
  overflow: hidden;
  contain: layout paint style;
  pointer-events: none;
}

.skill3-foreground-slash {
  position: absolute;
  left: var(--slash-left, 50%);
  top: var(--slash-top, 50%);
  width: var(--slash-width, 64vw);
  height: auto;
  opacity: 0;
  object-fit: contain;
  filter: drop-shadow(0 0 10px rgba(85, 205, 255, .92));
  mix-blend-mode: screen;
  transform-origin: 50% 50%;
  will-change: transform, opacity;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

.skill3-foreground-slash--one {
  --slash-left: 34%;
  --slash-top: 36%;
  --slash-width: min(58vw, 780px);
}

.skill3-foreground-slash--two {
  --slash-left: 67%;
  --slash-top: 63%;
  --slash-width: min(52vw, 720px);
}

.skill3-foreground-slash--three {
  --slash-left: 50%;
  --slash-top: 69%;
  --slash-width: min(84vw, 1120px);
}

.skill3-foreground-slash--final {
  --slash-left: 50%;
  --slash-top: 50%;
  --slash-width: min(122vw, 1640px);
  filter: drop-shadow(0 0 14px rgba(115, 224, 255, .98));
}

.topbar {
  position: absolute;
  z-index: 28;
  top: var(--safe-top);
  right: var(--safe-right);
  left: var(--safe-left);
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 8px;
  pointer-events: none;
}

.head-picker,
.camera-zoom-button,
.settings-button,
.auto-button,
.bag-button,
.direction-note {
  border: 1px solid rgba(157,226,255,.36);
  background: linear-gradient(180deg, rgba(4,28,45,.82), rgba(3,18,31,.72));
  box-shadow: 0 10px 26px rgba(0,10,20,.26), inset 0 1px rgba(255,255,255,.08);
  backdrop-filter: blur(8px);
}

.camera-zoom-button,
.settings-button {
  align-self: flex-start;
  display: grid;
  place-items: center;
  width: clamp(34px, 3.7vw, 42px);
  height: clamp(34px, 3.7vw, 42px);
  min-height: 0;
  padding: 0;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  pointer-events: auto;
}

.settings-button { margin-left: auto; }

.camera-zoom-button svg,
.settings-button svg {
  display: block;
  width: 55%;
  height: 55%;
  fill: currentColor;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .72));
}

.camera-zoom-button:active,
.settings-button:active {
  border-color: rgba(116,226,255,.85);
  background: linear-gradient(180deg, rgba(31,126,168,.92), rgba(10,66,96,.92));
  transform: translateY(1px);
}

.game-menu-panel {
  position: absolute;
  z-index: 90;
  top: calc(var(--safe-top) + clamp(40px, 4.6vw, 50px));
  right: var(--safe-right);
  display: grid;
  gap: 6px;
  width: min(190px, 42vw);
  padding: 8px;
  border: 1px solid rgba(157, 226, 255, .4);
  border-radius: 13px;
  background: linear-gradient(160deg, rgba(8, 38, 57, .97), rgba(3, 18, 31, .97));
  box-shadow: 0 18px 42px rgba(0, 5, 15, .55), inset 0 1px rgba(255, 255, 255, .08);
  pointer-events: auto;
  backdrop-filter: blur(10px);
}

.game-menu-panel button {
  min-height: 40px;
  border: 1px solid rgba(166, 220, 241, .28);
  border-radius: 9px;
  color: #effaff;
  background: rgba(19, 67, 91, .62);
  font-weight: 800;
  cursor: pointer;
  touch-action: manipulation;
}

.game-menu-panel button:active { background: rgba(31, 126, 168, .88); }

.player-hud {
  position: relative;
  flex: 0 0 auto;
  width: clamp(220px, 32vw, 330px);
  min-width: 0;
  aspect-ratio: 2.72 / 1;
  pointer-events: none;
  filter: drop-shadow(0 5px 8px rgba(0, 8, 20, .5));
}

.hud-avatar-frame {
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  width: 36.76%;
  aspect-ratio: 625 / 640;
  overflow: visible;
}

.hud-avatar-portrait {
  position: absolute;
  z-index: 0;
  top: 13%;
  left: 15.5%;
  width: 68%;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 34%, rgba(52, 162, 222, .88), rgba(7, 44, 84, .96) 58%, #03152d 100%);
  box-shadow:
    inset 0 0 18px rgba(0, 6, 24, .9),
    0 0 14px rgba(0, 191, 255, .52);
}

.hud-avatar-portrait::after {
  position: absolute;
  z-index: 2;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .25), transparent 23%, transparent 68%, rgba(2, 14, 44, .32)),
    radial-gradient(circle at 50% 100%, rgba(40, 191, 255, .25), transparent 58%);
  content: "";
  pointer-events: none;
}

.hud-avatar {
  position: absolute;
  z-index: 1;
  top: -7%;
  left: -10%;
  width: 120%;
  height: 120%;
  object-fit: cover;
  object-position: center top;
  filter: saturate(1.08) contrast(1.04) drop-shadow(0 3px 4px rgba(0, 0, 0, .44));
}

.hud-avatar-ornament {
  position: absolute;
  z-index: 3;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}

.hud-player-data {
  position: absolute;
  z-index: 2;
  top: .5%;
  right: 0;
  bottom: .5%;
  left: 29%;
  display: grid;
  grid-template-rows: 26% repeat(3, 1fr);
  gap: .7%;
  min-width: 0;
}

.hud-identity {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  justify-self: start;
  width: 62%;
  min-width: 0;
  padding: 1% 14% 1% 8%;
}

/* 1.0.37: tên co giãn; LEVEL và phe nằm chung một hàng, sát nhau bên phải. */
.hud-identity {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  justify-self: stretch;
  column-gap: clamp(3px, .42vw, 6px);
  width: 100%;
  padding: 1% 8%;
}

.hud-identity b {
  width: 100%;
  max-width: none;
  text-align: left;
}

.hud-identity small {
  max-width: none;
  margin-top: 0;
  text-align: right;
}

.hud-identity .hud-faction {
  color: #fff0bd;
}

.hud-identity::before {
  position: absolute;
  z-index: -1;
  inset: -5% -1% -4% -4%;
  background: url("assets/ui/hud-nameplate-fantasy-104.png?v=1.0.86-20260910") center / 100% 100% no-repeat;
  content: "";
  pointer-events: none;
}

.hud-identity b {
  overflow: hidden;
  z-index: 1;
  max-width: 86%;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(9px, 1.02vw, 14px);
  font-weight: 900;
  letter-spacing: .055em;
  line-height: 1;
  text-align: center;
  text-overflow: ellipsis;
  text-shadow: 0 2px 2px #000, 0 0 7px rgba(93, 210, 255, .34);
  white-space: nowrap;
}

.hud-identity small {
  z-index: 1;
  overflow: hidden;
  max-width: 82%;
  margin-top: 2%;
  color: #ffe8ae;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(6px, .56vw, 8px);
  font-weight: 900;
  letter-spacing: .08em;
  line-height: 1;
  text-align: center;
  text-overflow: ellipsis;
  text-shadow: 0 1px 2px #000, 0 0 5px rgba(255, 220, 139, .28);
  white-space: nowrap;
}

.hud-stat {
  position: relative;
  min-width: 0;
  isolation: isolate;
}

.hud-stat::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background: url("assets/ui/hud-stat-frame-fantasy-104.png?v=1.0.86-20260910") center / 100% 100% no-repeat;
  content: "";
  pointer-events: none;
}

.hud-stat::after {
  position: absolute;
  z-index: 4;
  top: 50%;
  right: 5.25%;
  width: clamp(5px, .72vw, 9px);
  aspect-ratio: 1;
  border: 1px solid rgba(255, 241, 241, .9);
  background: linear-gradient(135deg, #fff, #ff2941 44%, #7d0007 100%);
  box-shadow: 0 0 5px rgba(255, 23, 49, .92), inset 0 0 3px rgba(255, 255, 255, .82);
  content: "";
  transform: translateY(-50%) rotate(45deg);
  pointer-events: none;
}

.hud-stat--mana::after {
  background: linear-gradient(135deg, #fff, #17cfff 44%, #0745ba 100%);
  box-shadow: 0 0 5px rgba(13, 195, 255, .92), inset 0 0 3px rgba(255, 255, 255, .82);
}

.hud-stat--exp::after {
  background: linear-gradient(135deg, #fffbd2, #ffc31c 44%, #a45b00 100%);
  box-shadow: 0 0 5px rgba(255, 190, 24, .9), inset 0 0 3px rgba(255, 255, 255, .82);
}

.hud-stat-label {
  position: absolute;
  z-index: 5;
  top: 50%;
  left: 12.3%;
  color: #ffffff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(6px, .56vw, 8px);
  font-weight: 900;
  letter-spacing: .025em;
  line-height: 1;
  text-align: center;
  text-shadow: 0 1px 2px #000, 0 0 4px rgba(0, 0, 0, .9);
  transform: translate(-50%, -50%);
  white-space: nowrap;
}

.hud-stat-track {
  position: absolute;
  z-index: 2;
  top: 24%;
  right: 11.5%;
  bottom: 24%;
  left: 20.5%;
  display: block;
  overflow: hidden;
  border: 0;
  background: rgba(1, 8, 24, .64);
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, .8);
  clip-path: polygon(1.4% 0, 98.6% 0, 100% 50%, 98.6% 100%, 1.4% 100%, 0 50%);
}

.hud-stat-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 100%;
  background:
    radial-gradient(ellipse at 79% 42%, rgba(255, 255, 255, .36), transparent 22%),
    linear-gradient(180deg, rgba(255, 255, 255, .54), transparent 34%, rgba(70, 0, 6, .36) 100%),
    linear-gradient(90deg, #750007, #e30012 56%, #ff3344);
  box-shadow: inset 0 -2px 4px rgba(83, 0, 7, .66), 0 0 7px rgba(255, 23, 43, .78);
  transition: width .24s ease-out;
}

.hud-stat-fill::after {
  position: absolute;
  top: 13%;
  right: 2%;
  left: 2%;
  height: 17%;
  background: rgba(255, 255, 255, .48);
  border-radius: 999px;
  content: "";
}

.hud-stat--mana .hud-stat-fill {
  background:
    radial-gradient(ellipse at 79% 42%, rgba(255, 255, 255, .4), transparent 22%),
    linear-gradient(180deg, rgba(255, 255, 255, .56), transparent 34%, rgba(0, 35, 91, .34) 100%),
    linear-gradient(90deg, #084cc2, #058ee9 56%, #22d8ff);
  box-shadow: inset 0 -2px 4px rgba(0, 40, 112, .62), 0 0 7px rgba(12, 180, 255, .76);
}

.hud-stat--exp .hud-stat-fill {
  width: 0;
  background:
    radial-gradient(ellipse at 79% 42%, rgba(255, 255, 255, .42), transparent 22%),
    linear-gradient(180deg, rgba(255, 255, 255, .54), transparent 34%, rgba(99, 45, 0, .3) 100%),
    linear-gradient(90deg, #9c5800, #ec9f00 56%, #ffd52b);
  box-shadow: inset 0 -2px 4px rgba(97, 46, 0, .56), 0 0 7px rgba(255, 188, 18, .74);
}

.hud-stat output {
  position: absolute;
  z-index: 5;
  top: 50%;
  right: 11.5%;
  left: 20.5%;
  overflow: visible;
  color: #ffffff;
  font-size: clamp(6px, .52vw, 8px);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  text-align: center;
  text-shadow: 0 1px 2px #000, 0 0 3px rgba(0, 0, 0, .92);
  transform: translateY(-50%);
  white-space: nowrap;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.head-picker {
  display: flex;
  gap: 5px;
  padding: 5px;
  border-radius: 14px;
  pointer-events: auto;
}

.head-button {
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #d8f3ff;
  background: rgba(19,63,87,.46);
  cursor: pointer;
}

.head-button.is-active {
  border-color: rgba(116,226,255,.8);
  color: white;
  background: linear-gradient(180deg, #2187b4, #125677);
  box-shadow: 0 0 16px rgba(63,195,255,.35);
}

.controls {
  position: absolute;
  z-index: 22;
  right: var(--safe-right);
  bottom: var(--safe-bottom);
  left: var(--safe-left);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  pointer-events: none;
}

.portal-destination-panel {
  position: absolute;
  z-index: 26;
  top: clamp(72px, 20vh, 160px);
  right: clamp(128px, 18vw, 230px);
  width: clamp(185px, 23vw, 250px);
  padding: 8px;
  border: 1px solid rgba(190, 234, 255, .68);
  border-radius: 13px;
  color: #f2fbff;
  background:
    linear-gradient(145deg, rgba(15, 48, 72, .96), rgba(3, 15, 30, .96));
  box-shadow:
    0 12px 32px rgba(0, 5, 18, .52),
    inset 0 1px rgba(255, 255, 255, .12),
    0 0 18px rgba(61, 190, 255, .16);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px) scale(.98);
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
  backdrop-filter: blur(9px);
}

.portal-destination-panel.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.portal-destination-panel > header {
  padding: 3px 7px 8px;
  color: #eafaff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(11px, 1.35vw, 15px);
  font-weight: 800;
  letter-spacing: .04em;
  text-align: center;
  text-shadow: 0 0 10px rgba(99, 213, 255, .48);
}

.portal-destination-scroll {
  display: grid;
  gap: 5px;
  max-height: clamp(112px, 23vh, 158px);
  padding-right: 4px;
  overflow-x: hidden;
  overflow-y: scroll;
  overscroll-behavior: contain;
  scrollbar-color: rgba(111, 215, 255, .82) rgba(2, 15, 29, .65);
  scrollbar-width: thin;
  touch-action: pan-y;
}

.portal-destination-scroll::-webkit-scrollbar { width: 6px; }
.portal-destination-scroll::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(2, 15, 29, .65);
}
.portal-destination-scroll::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: linear-gradient(#b5efff, #3ba9d9);
}

.portal-destination-row {
  display: grid;
  align-content: center;
  width: 100%;
  min-height: 39px;
  padding: 6px 10px;
  border: 1px solid rgba(151, 202, 228, .2);
  border-radius: 9px;
  color: inherit;
  background: linear-gradient(180deg, rgba(22, 59, 83, .66), rgba(7, 27, 45, .7));
  font: inherit;
  text-align: left;
  touch-action: manipulation;
}

.portal-destination-row strong {
  font-size: clamp(11px, 1.35vw, 14px);
  line-height: 1.05;
}

.portal-destination-row small {
  margin-top: 3px;
  color: rgba(221, 242, 251, .74);
  font-size: clamp(8px, .95vw, 10px);
}

.portal-destination-row.is-available {
  border-color: rgba(111, 219, 255, .64);
  background: linear-gradient(180deg, rgba(26, 105, 144, .78), rgba(8, 50, 77, .8));
  box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 0 12px rgba(59, 185, 235, .13);
  cursor: pointer;
}

.portal-destination-row.is-available:focus-visible {
  outline: 2px solid rgba(183, 239, 255, .94);
  outline-offset: 1px;
}

.portal-destination-row:disabled {
  color: rgba(220, 238, 247, .44);
  cursor: not-allowed;
  opacity: .62;
}

.joystick {
  position: relative;
  width: clamp(108px, 18vh, 148px);
  aspect-ratio: 1;
  border-radius: 50%;
  pointer-events: auto;
  touch-action: none;
  margin-bottom: 19px;
}

.joystick-ring {
  position: absolute;
  inset: 0;
  border: 2px solid rgba(177,237,255,.5);
  border-radius: inherit;
  background:
    radial-gradient(circle, rgba(45,152,192,.2) 0 12%, transparent 13%),
    repeating-radial-gradient(circle, transparent 0 24%, rgba(193,242,255,.12) 25% 26%, transparent 27% 48%),
    rgba(5,36,56,.58);
  box-shadow: inset 0 0 24px rgba(89,208,255,.24), 0 8px 28px rgba(0,15,25,.38);
}

.joystick-ring::before,
.joystick-ring::after {
  content: "";
  position: absolute;
  background: rgba(196,240,255,.17);
}

.joystick-ring::before {
  top: 50%;
  right: 13%;
  left: 13%;
  height: 1px;
}

.joystick-ring::after {
  top: 13%;
  bottom: 13%;
  left: 50%;
  width: 1px;
}

.joystick-knob {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 44%;
  aspect-ratio: 1;
  border: 2px solid rgba(211,249,255,.75);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 28%, #7edfff, #1688bb 57%, #0a4a70);
  box-shadow: 0 4px 17px rgba(0,13,25,.45), inset 0 2px 8px rgba(255,255,255,.36), 0 0 20px rgba(67,204,255,.32);
  transform: translate(-50%, -50%);
  will-change: transform;
}

.axis-lock {
  position: static;
  color: rgba(224,247,255,.75);
  font-size: 10.5px;
  font-weight: 800;
  text-align: center;
  text-shadow: 0 1px 3px #00111e;
}

.auto-button {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 50px;
  padding: 0 16px;
  border-radius: 999px;
  color: #e3f8ff;
  cursor: pointer;
  pointer-events: auto;
}

.bag-button {
  display: grid;
  grid-template-columns: 30px auto;
  align-items: center;
  gap: 7px;
  min-height: 50px;
  padding: 0 15px 0 11px;
  border: 1px solid rgba(157,226,255,.46);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(5,43,66,.92), rgba(3,21,38,.88));
  box-shadow: 0 10px 26px rgba(0,10,20,.3), inset 0 1px rgba(255,255,255,.1);
  color: #e3f8ff;
  font-weight: 800;
  cursor: pointer;
  pointer-events: auto;
  backdrop-filter: blur(8px);
}
.bag-button svg { width: 30px; height: 30px; }
.bag-button:active { transform: scale(.96); }

/* NEXORIA 1.0.11: restrained modular HUD and utility controls. */
.player-hud {
  width: clamp(220px, 30vw, 310px);
  aspect-ratio: 2 / 1;
  filter: drop-shadow(0 4px 7px rgba(0, 8, 20, .44));
  transform: translateY(-8%);
}

.player-hud::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background: url("assets/ui/modular/hud-cluster-frame.png?v=1.0.86-20260910") center / 100% 100% no-repeat;
  content: "";
  pointer-events: none;
}

.hud-avatar-frame {
  top: 15.2%;
  left: .5%;
  width: 34.5%;
  aspect-ratio: 1;
}

.hud-avatar-portrait {
  top: 10.5%;
  left: 10.5%;
  width: 79%;
  box-shadow: inset 0 0 13px rgba(0, 6, 24, .72);
}

.hud-avatar-ornament { display: none; }

.hud-player-data {
  z-index: 2;
  top: 16.4%;
  right: 1.2%;
  bottom: 10.2%;
  left: 31.7%;
  grid-template-rows: 36% repeat(3, 17.3%);
  gap: 0;
}

.hud-identity {
  justify-self: stretch;
  width: auto;
  padding: 0 4%;
}

.hud-identity::before,
.hud-stat::before,
.hud-stat::after { display: none; }

.hud-identity b {
  max-width: 92%;
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: clamp(9px, .92vw, 13px);
  letter-spacing: .03em;
  text-shadow: 0 1px 2px #000;
}

.hud-identity small {
  max-width: 92%;
  margin-top: 1%;
  color: rgba(232, 245, 251, .84);
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: clamp(6px, .52vw, 8px);
  letter-spacing: .045em;
  text-shadow: 0 1px 2px #000;
}

.hud-stat-label { display: none; }

.hud-stat-track {
  top: 18%;
  right: 5.2%;
  bottom: 18%;
  left: 21.3%;
  background: rgba(2, 8, 14, .76);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, .7);
  clip-path: inset(0 round 2px);
}

.hud-stat-fill {
  background: linear-gradient(90deg, #B6281D 0%, #7C1812 58%, #65130B 100%);
  box-shadow: none;
}

.hud-stat--mana .hud-stat-fill {
  background: linear-gradient(90deg, #0786B4 0%, #046695 58%, #04517C 100%);
  box-shadow: none;
}

.hud-stat--exp .hud-stat-fill {
  background: linear-gradient(90deg, #E2982B 0%, #AE6F1C 58%, #865315 100%);
  box-shadow: none;
}

.hud-stat-fill::after {
  top: 8%;
  height: 13%;
  background: rgba(255, 255, 255, .24);
}

.hud-stat output {
  right: 5.2%;
  left: 21.3%;
  font-size: clamp(6px, .5vw, 8px);
}

.utility-controls {
  order: 2;
  align-self: flex-end;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  margin: 0 9px 3px auto;
  pointer-events: auto;
}

.utility-icon-button,
.bag-button.utility-icon-button {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  place-items: center;
  width: clamp(42px, 7vh, 52px);
  min-height: 0;
  aspect-ratio: 1;
  margin: 0;
  padding: 0;
  gap: 0;
  border: 1px solid rgba(225, 245, 251, .46);
  border-radius: 11px;
  color: #fff;
  background: rgba(4, 21, 33, .38);
  box-shadow: 0 3px 9px rgba(0, 7, 14, .2);
  cursor: pointer;
  backdrop-filter: blur(4px);
  touch-action: manipulation;
}

.utility-icon-button svg,
.bag-button.utility-icon-button svg {
  width: 61%;
  height: 61%;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: none;
}

.utility-icon-button:active { transform: scale(.95); }
.utility-icon-button:focus-visible { outline: 1px solid rgba(213, 246, 255, .92); outline-offset: 2px; }
.utility-icon-button:disabled { cursor: not-allowed; }
.target-switch-button:disabled { cursor: default; }
.utility-icon-button.is-channeling { border-color: rgba(255, 255, 255, .82); background: rgba(8, 45, 61, .5); }

.target-switch-button.is-active {
  border-color: rgba(255, 115, 115, .9);
  color: #fff;
  background: rgba(99, 19, 25, .58);
  box-shadow: 0 0 12px rgba(255, 45, 45, .28), inset 0 1px rgba(255,255,255,.12);
}

.target-ground-marker {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: clamp(38px, 5.2vw, 64px);
  height: clamp(15px, 2vw, 25px);
  border: 2px solid #f23131;
  border-radius: 50%;
  background: transparent;
  box-shadow: 0 0 5px rgba(255, 24, 24, .85), inset 0 0 4px rgba(255, 24, 24, .5);
  pointer-events: none;
  will-change: transform;
}

.world-resource-node,
.personal-bronze-chest {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  display: grid;
  place-items: center;
  min-width: 52px;
  min-height: 52px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  outline: 0;
  color: transparent;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
  transform-origin: 50% 78%;
  will-change: transform, opacity;
  -webkit-tap-highlight-color: transparent;
}

.world-resource-node img,
.personal-bronze-chest img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

.world-resource-node:focus-visible,
.personal-bronze-chest:focus-visible {
  outline: 2px solid rgba(255, 231, 139, .95);
  outline-offset: 2px;
}

.world-resource-node.is-depleted,
.world-resource-node[data-available="false"] {
  opacity: .28;
  filter: grayscale(1);
  pointer-events: none;
}

.world-resource-node[hidden],
.world-resource-node.is-hidden,
.personal-bronze-chest[hidden],
.personal-bronze-chest.is-hidden,
.personal-bronze-chest[data-visible="false"] {
  display: none !important;
  pointer-events: none;
}

.personal-bronze-chest {
  z-index: 3;
  filter: drop-shadow(0 4px 7px rgba(44, 20, 3, .72));
}

.world-npc-tap-target {
  position: absolute;
  top: 0;
  left: 0;
  width: clamp(72px, 10vw, 108px);
  height: clamp(118px, 20vh, 172px);
  padding: 0;
  border: 0;
  border-radius: 42%;
  outline: 0;
  color: transparent;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
  will-change: transform;
  -webkit-tap-highlight-color: transparent;
}

.world-npc-tap-target[hidden] { display: none !important; }
.world-npc-tap-target:focus-visible {
  outline: 2px solid rgba(218, 244, 162, .95);
  outline-offset: 2px;
}

.axis-status {
  position: absolute;
  right: -12px;
  bottom: -20px;
  left: -12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  white-space: nowrap;
  pointer-events: none;
}

.battery-status {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  color: #fff;
  font-size: 10.5px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 3px #00111e;
}

.battery-status svg {
  width: 22px;
  height: 11px;
  overflow: visible;
  fill: none;
  stroke: #fff;
  stroke-width: 1.5;
}

.battery-status .battery-fill {
  fill: #fff;
  stroke: none;
}

.same-map-teleport-countdown {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border-radius: inherit;
  color: #fff;
  background: rgba(2, 11, 20, .72);
  font-size: clamp(11px, 2.1vh, 16px);
  font-weight: 850;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 2px #000;
}

.same-map-teleport-countdown[hidden] { display: none; }

.auto-button.is-active {
  border-color: rgba(111,238,207,.8);
  background: linear-gradient(180deg, rgba(13,114,104,.9), rgba(5,67,70,.9));
}

.auto-icon { color: #71f0c7; }

.direction-note {
  position: absolute;
  z-index: 21;
  right: var(--safe-right);
  bottom: calc(var(--safe-bottom) + 63px);
  max-width: min(390px, 54vw);
  padding: 6px 10px;
  border-radius: 10px;
  color: rgba(225,244,250,.72);
  font-size: clamp(9px, 1.1vw, 12px);
  text-align: right;
}

.rotate-hint { display: none; }

@keyframes grass-breathe {
  from { background-position: left bottom; }
  to { background-position: 2px bottom; }
}

@keyframes tree-sway {
  from { transform: rotate(-.35deg); }
  to { transform: rotate(.5deg); }
}

@media (orientation: portrait) {
  .rotate-hint {
    position: absolute;
    z-index: 30;
    top: 50%;
    left: 50%;
    display: block;
    width: min(300px, 82vw);
    padding: 14px 18px;
    border: 1px solid rgba(147,225,255,.5);
    border-radius: 16px;
    color: white;
    background: rgba(2,20,34,.88);
    font-size: 14px;
    text-align: center;
    transform: translate(-50%, -50%);
    backdrop-filter: blur(10px);
  }
}

@media (max-height: 440px) {
  .head-button { min-height: 30px; padding: 0 9px; font-size: 11px; }
  .camera-zoom-button,
  .settings-button { width: 34px; height: 34px; min-height: 0; padding: 0; }
  .auto-button,
  .bag-button { min-height: 40px; padding: 0 13px; font-size: 12px; }
  .direction-note { bottom: calc(var(--safe-bottom) + 49px); }
}

[hidden] { display: none !important; }

.map-loading-screen {
  position: fixed;
  z-index: 300;
  inset: 0;
  display: grid;
  place-items: end center;
  overflow: hidden;
  padding:
    max(18px, env(safe-area-inset-top))
    max(20px, env(safe-area-inset-right))
    max(22px, env(safe-area-inset-bottom))
    max(20px, env(safe-area-inset-left));
  color: #f5fbff;
  background: #04111c;
  isolation: isolate;
  touch-action: none;
}

.map-loading-artwork,
.map-loading-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.map-loading-artwork {
  z-index: -2;
  object-fit: cover;
  object-position: center;
}

.map-loading-shade {
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(0, 5, 10, .04) 0%, rgba(0, 5, 10, .1) 60%, rgba(0, 4, 8, .76) 100%),
    linear-gradient(90deg, rgba(0, 5, 10, .22), transparent 24%, transparent 76%, rgba(0, 5, 10, .22));
}

.map-loading-controls {
  width: min(760px, 90vw);
  margin: 0 0 clamp(2px, 2.2vh, 20px);
}

.map-loading-status:not(.visually-hidden) {
  margin: 0 0 14px;
  padding: 12px 16px;
  border-radius: 10px;
  background: rgba(4, 17, 28, .92);
  color: #fff;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.map-loading-retry {
  margin-top: 14px;
  min-height: 44px;
  padding: 10px 20px;
  border: 1px solid #ffe38b;
  border-radius: 10px;
  color: #fff;
  background: #263d50;
  font: inherit;
  cursor: pointer;
  touch-action: manipulation;
}

.map-loading-progress-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 48px;
  align-items: center;
  gap: 10px;
}

.map-loading-progress {
  position: relative;
  height: clamp(16px, 2.4vh, 22px);
  overflow: hidden;
  border: 2px solid rgba(255, 235, 187, .82);
  border-radius: 999px;
  background: rgba(17, 11, 6, .88);
  box-shadow: inset 0 3px 8px rgba(0, 0, 0, .72), 0 0 13px rgba(230, 177, 72, .2);
}

.map-loading-progress-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0%;
  border-radius: inherit;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .72), transparent 34%),
    linear-gradient(90deg, #9f651f, #e4ad45 58%, #ffe38b);
  box-shadow: 0 0 14px rgba(255, 190, 76, .62);
}

.map-loading-percent {
  color: #fff;
  font-size: clamp(12px, 1.8vw, 16px);
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  text-align: right;
  text-shadow: 0 1px 3px #000;
}

.map-confirmation-modal {
  position: fixed;
  z-index: 250;
  inset: 0;
  display: grid;
  place-items: center;
  padding:
    max(20px, env(safe-area-inset-top))
    max(20px, env(safe-area-inset-right))
    max(20px, env(safe-area-inset-bottom))
    max(20px, env(safe-area-inset-left));
  background: rgba(0, 7, 17, .7);
  backdrop-filter: blur(7px);
}

.map-confirmation-dialog {
  width: min(390px, 90vw);
  padding: 22px;
  border: 1px solid rgba(157, 224, 255, .58);
  border-radius: 18px;
  color: #eefaff;
  background: linear-gradient(150deg, rgba(13, 52, 77, .98), rgba(3, 17, 33, .98));
  box-shadow: 0 24px 70px rgba(0, 3, 12, .68), inset 0 1px rgba(255, 255, 255, .11);
  text-align: center;
}

.map-confirmation-dialog h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(20px, 4vw, 27px);
}

.map-confirmation-dialog p {
  margin: 12px 0 20px;
  color: rgba(225, 243, 252, .8);
  font-size: 14px;
  line-height: 1.5;
}

.map-confirmation-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.map-confirmation-actions button {
  min-height: 44px;
  border-radius: 11px;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
  touch-action: manipulation;
}

.map-confirmation-cancel {
  border: 1px solid rgba(184, 215, 230, .36);
  background: linear-gradient(180deg, #526676, #30404e);
}

.map-confirmation-accept {
  border: 1px solid rgba(145, 232, 255, .76);
  background: linear-gradient(180deg, #188dbb, #07557c);
  box-shadow: 0 8px 20px rgba(0, 89, 137, .3), inset 0 1px rgba(255, 255, 255, .14);
}

.mapcb-mode-modal { z-index: 265; }

.mapcb-mode-dialog { width: min(430px, 92vw); }

.mapcb-mode-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.mapcb-mode-actions button {
  min-height: 46px;
  border-radius: 11px;
  color: #fff;
  font-weight: 850;
  cursor: pointer;
  touch-action: manipulation;
}

.mapcb-mode-actions #mapcbModeCancel { grid-column: 1 / -1; }

.mapcb-mode-guild {
  border: 1px solid rgba(255, 218, 127, .75);
  background: linear-gradient(180deg, #a87828, #654213);
  box-shadow: 0 8px 20px rgba(97, 61, 9, .3), inset 0 1px rgba(255, 255, 255, .15);
}

.mapcb-reentry-modal,
.unavailable-feature-modal { z-index: 270; }

.mapcb-reentry-dialog,
.unavailable-feature-dialog { width: min(390px, 92vw); }

.mapcb-reentry-dialog output {
  color: #ffe094;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.unavailable-feature-dialog p {
  color: #ffe094;
  font-size: clamp(17px, 2.1vw, 22px);
  font-weight: 900;
}

.map-notice-actions { grid-template-columns: 1fr; }
.map-notice-actions button { width: 100%; }

.portal-destination-row.is-unavailable-feature {
  border-color: rgba(255, 210, 117, .62);
  background: linear-gradient(180deg, rgba(112, 77, 20, .78), rgba(58, 35, 6, .82));
}

.settings-modal { z-index: 275; }

.settings-dialog {
  width: min(520px, 94vw);
  max-height: min(88vh, 620px);
  overflow: auto;
  text-align: left;
}

.settings-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
}

.settings-header small {
  color: rgba(190, 226, 241, .72);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
}

.settings-header h2 { margin-top: 3px; }

.settings-close-button {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(184, 215, 230, .36);
  border-radius: 50%;
  color: #fff;
  background: rgba(30, 65, 84, .8);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.settings-grid { display: grid; gap: 9px; }

.settings-grid label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(132px, 42%);
  align-items: center;
  gap: 12px;
  min-height: 46px;
  padding: 7px 9px 7px 12px;
  border: 1px solid rgba(146, 205, 230, .2);
  border-radius: 10px;
  background: rgba(4, 25, 39, .55);
}

.settings-grid label > span { color: #eefaff; font-weight: 750; }

.settings-grid select {
  width: 100%;
  min-height: 34px;
  padding: 0 28px 0 10px;
  border: 1px solid rgba(145, 232, 255, .46);
  border-radius: 8px;
  color: #fff;
  background: #123f58;
  font: inherit;
}

.settings-status {
  display: block;
  min-height: 20px;
  margin-top: 12px;
  color: #9fe3ff;
  font-size: 12px;
  text-align: center;
}

.settings-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 10px;
}

.settings-actions button {
  min-height: 42px;
  border-radius: 10px;
  color: #fff;
  font: inherit;
  font-weight: 850;
  cursor: pointer;
  touch-action: manipulation;
}

.settings-exit-button {
  border: 1px solid rgba(184, 215, 230, .38);
  background: rgba(32, 61, 78, .86);
}

.settings-apply-button {
  border: 1px solid rgba(158, 235, 255, .72);
  background: linear-gradient(180deg, #258db4, #12617f);
  box-shadow: inset 0 1px rgba(255, 255, 255, .2);
}

.settings-actions button:active { transform: translateY(1px); }

.return-to-city-modal {
  z-index: 260;
}

.return-to-city-dialog {
  width: min(88vw, 360px);
  padding: 20px 22px 22px;
  text-align: center;
}

.return-to-city-dialog h2 {
  margin-bottom: 8px;
}

.return-to-city-name {
  color: #8fe5ff !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(24px, 4vw, 34px) !important;
  font-weight: 800;
  letter-spacing: .08em;
  text-shadow: 0 0 16px rgba(73, 197, 255, .38);
}

.return-to-city-actions {
  grid-template-columns: 1fr;
}

.return-to-city-actions button {
  width: 100%;
}

.logout-countdown-modal {
  z-index: 270;
}

.logout-countdown-dialog {
  width: min(88vw, 340px);
  padding: 20px 22px 22px;
}

.logout-countdown-dialog > p {
  margin-bottom: 8px;
}

.logout-countdown-clock {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  min-height: 84px;
  color: rgba(225, 243, 252, .82);
}

.logout-countdown-clock output {
  min-width: 1.25em;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(52px, 10vw, 72px);
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  text-shadow: 0 0 18px rgba(83, 210, 255, .62), 0 2px 4px rgba(0, 0, 0, .8);
}

.logout-countdown-clock span {
  font-size: 15px;
  font-weight: 800;
}

.logout-countdown-actions {
  grid-template-columns: 1fr;
  margin-top: 12px;
}

.logout-countdown-actions button {
  width: 100%;
}

.update-gate {
  position: fixed;
  z-index: 110;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: auto;
  padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
  color: #fff8e8;
  background:
    linear-gradient(180deg, rgba(18, 12, 5, .2), rgba(18, 10, 3, .76)),
    radial-gradient(circle at 28% 18%, rgba(246, 204, 104, .16), transparent 34%),
    url("assets/login/v1060/scene-background.webp?v=1.0.86-20260910") center / cover no-repeat;
  touch-action: pan-y;
}

.update-gate[hidden] { display: none !important; background-image: none; }

.update-card {
  position: relative;
  z-index: 1;
  display: grid;
  width: min(480px, 94vw);
  gap: 12px;
  padding: clamp(20px, 4vh, 30px);
  border: 1px solid rgba(242, 202, 124, .56);
  border-radius: 20px;
  text-align: center;
  background: linear-gradient(155deg, rgba(57, 40, 21, .96), rgba(25, 18, 10, .98));
  box-shadow: 0 24px 70px rgba(16, 8, 2, .64), inset 0 1px rgba(255, 255, 255, .11), 0 0 34px rgba(226, 169, 67, .14);
  backdrop-filter: blur(10px);
}

.update-brand,
.update-card h1,
.update-notes,
.update-message { margin: 0; }
.update-brand { color: #edbd66; font-size: 10px; font-weight: 850; letter-spacing: .2em; }
.update-version { color: rgba(255, 239, 207, .72); font-size: 12px; }
.update-card h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(27px, 7vh, 40px); line-height: 1.08; }
.update-notes { color: rgba(255, 239, 213, .82); font-size: 13px; line-height: 1.45; }

.update-progress-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 48px;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
}

.update-progress-wrap[hidden] { display: none !important; }
.update-progress {
  height: 14px;
  overflow: hidden;
  border: 1px solid rgba(245, 204, 125, .52);
  border-radius: 999px;
  background: rgba(13, 8, 4, .78);
  box-shadow: inset 0 2px 7px rgba(0, 0, 0, .6);
}
.update-progress-fill {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #a96926, #ffd87e 72%, #fff1bc);
  box-shadow: 0 0 13px rgba(255, 211, 112, .52);
  transition: width 80ms linear;
}
.update-percent { color: #ffe3a2; font-size: 14px; font-weight: 900; font-variant-numeric: tabular-nums; }
.update-message { min-height: 38px; color: #f2d8aa; font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.update-message[data-kind="error"] { color: #ffb7b7; }
.update-message[data-kind="success"] { color: #78f0c8; }
.update-button {
  min-height: 46px;
  border: 1px solid rgba(255, 221, 151, .78);
  border-radius: 11px;
  color: #fff;
  font-weight: 850;
  background: linear-gradient(180deg, #b57a31, #704418);
  box-shadow: 0 10px 22px rgba(48, 26, 6, .34), inset 0 1px rgba(255, 255, 255, .18);
  cursor: pointer;
}
.update-button:disabled { opacity: .58; cursor: wait; }

/* Login scene is rendered by nexoria-login-parallax.js. */
.auth-gate {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: auto;
  padding: max(10px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
  background: #243e4a;
  touch-action: pan-y;
}

.auth-shell {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  width: min(470px, 94vw);
  min-height: calc(100dvh - max(20px, env(safe-area-inset-top) + env(safe-area-inset-bottom)));
  padding-top: clamp(4px, 4dvh, 34px);
}

.auth-scene-banner {
  position: relative;
  width: 100%;
  height: clamp(112px, 25dvh, 190px);
  overflow: hidden;
  border: 1px solid rgba(246, 205, 125, .58);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 230, 160, .04), rgba(32, 20, 9, .3)),
    url("assets/login/v1060/scene-background.webp?v=1.0.86-20260910") center / cover no-repeat;
  box-shadow: 0 18px 45px rgba(24, 12, 4, .36), inset 0 1px rgba(255, 247, 219, .22);
}

.auth-glow {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 72% 20%, rgba(58,168,255,.26), transparent 34%),
    radial-gradient(circle at 26% 85%, rgba(22,233,209,.12), transparent 32%);
}

.auth-gate .auth-glow {
  background:
    radial-gradient(circle at 72% 18%, rgba(255, 212, 111, .19), transparent 32%),
    radial-gradient(circle at 35% 82%, rgba(88, 131, 62, .12), transparent 34%);
}

.auth-card {
  position: relative;
  z-index: 1;
  width: min(430px, 100%);
  max-height: none;
  overflow: visible;
  padding: clamp(12px, 2.2vh, 19px);
  border: 1px solid rgba(242, 202, 124, .5);
  border-radius: 19px;
  color: #fff8e8;
  background: linear-gradient(155deg, rgba(57, 40, 21, .94), rgba(25, 18, 10, .96));
  box-shadow: 0 24px 70px rgba(16, 8, 2, .58), inset 0 1px rgba(255,255,255,.1), 0 0 34px rgba(226, 169, 67, .12);
  backdrop-filter: blur(10px);
}

.auth-brand {
  display: block;
  margin-bottom: clamp(8px, 1.8vh, 14px);
  text-align: center;
}

.auth-brand p,
.auth-brand h1 { margin: 0; }
.auth-brand p { color: #edbd66; font-size: 9px; font-weight: 850; letter-spacing: .24em; }
.auth-brand h1 { margin-top: 1px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(26px, 7vh, 38px); line-height: 1; letter-spacing: .08em; text-shadow: 0 0 18px rgba(240,187,88,.32), 0 2px 4px #1b0e04; }
.auth-brand span { display: block; margin-top: 4px; color: rgba(255,239,207,.66); font-size: 10px; }

.auth-credentials { display: block; }

.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: clamp(8px, 1.6vh, 12px);
  padding: 4px;
  border-radius: 12px;
  background: rgba(20,13,7,.56);
}

.auth-tab {
  min-height: clamp(32px, 7.5vh, 39px);
  border: 1px solid transparent;
  border-radius: 10px;
  color: rgba(255,239,210,.7);
  background: transparent;
  cursor: pointer;
}

.auth-tab.is-active {
  border-color: rgba(245, 204, 125, .58);
  color: white;
  background: linear-gradient(180deg, #a46b2a, #674019);
  box-shadow: 0 7px 18px rgba(20,11,4,.35), inset 0 1px rgba(255,255,255,.12);
}

.auth-form { display: grid; gap: clamp(7px, 1.45vh, 10px); }
.auth-form label { display: grid; gap: 4px; }
.auth-form label > span { color: rgba(255,239,213,.82); font-size: 10.5px; font-weight: 700; }
.auth-form input {
  width: 100%;
  min-height: clamp(38px, 8.6vh, 45px);
  padding: 0 14px;
  border: 1px solid rgba(224, 190, 127, .32);
  border-radius: 10px;
  outline: none;
  color: #fff9ec;
  background: rgba(19, 12, 6, .72);
  box-shadow: inset 0 1px 8px rgba(0,0,0,.2);
  touch-action: manipulation;
  user-select: text;
}

.auth-form input:focus { border-color: #e9b75e; box-shadow: 0 0 0 3px rgba(220,158,56,.14); }
.auth-submit {
  min-height: clamp(40px, 8.8vh, 47px);
  margin-top: 2px;
  border: 1px solid rgba(255, 221, 151, .72);
  border-radius: 11px;
  color: white;
  background: linear-gradient(180deg, #b57a31, #704418);
  box-shadow: 0 10px 22px rgba(48,26,6,.32), inset 0 1px rgba(255,255,255,.18);
  cursor: pointer;
}
.auth-submit:disabled { opacity: .58; cursor: wait; }
.auth-message { min-height: 17px; margin: 0; color: #f2d8aa; font-size: 10.5px; line-height: 1.35; text-align: center; }
.auth-message[data-kind="error"] { color: #ffb7b7; }
.auth-message[data-kind="success"] { color: #78f0c8; }
.quick-note { margin: 7px 0 0; color: rgba(239,220,187,.57); font-size: 9px; line-height: 1.35; text-align: center; }

.account-lobby {
  display: grid;
  gap: 14px;
  padding: clamp(10px, 2.5vh, 18px) 0 4px;
  text-align: center;
}

.account-lobby > p:first-child {
  margin: 0;
  color: rgba(255, 241, 216, .84);
  font-size: clamp(13px, 2.8vh, 17px);
}

.account-lobby strong { color: #ffd98b; }
.account-lobby-actions { display: grid; gap: 9px; }
.account-lobby-actions button { width: 100%; cursor: pointer; }
.account-exit {
  min-height: clamp(38px, 8.2vh, 44px);
  border: 1px solid rgba(231, 199, 144, .34);
  border-radius: 11px;
  color: rgba(255, 240, 213, .84);
  background: rgba(50, 34, 18, .8);
}
.account-exit:disabled { opacity: .56; cursor: wait; }

.black-market-prompt {
  position: fixed;
  z-index: 80;
  left: 50%;
  bottom: calc(var(--safe-bottom) + 12px);
  display: grid;
  gap: 8px;
  min-width: min(300px, 68vw);
  padding: 11px 13px;
  border: 1px solid rgba(205, 141, 255, .52);
  border-radius: 11px;
  color: #f8eaff;
  background: linear-gradient(155deg, rgba(46, 25, 57, .94), rgba(21, 13, 25, .96));
  box-shadow: 0 14px 38px rgba(12, 4, 18, .5), inset 0 1px rgba(255,255,255,.08);
  transform: translateX(-50%);
  pointer-events: auto;
}
.black-market-prompt[hidden] { display: none !important; }
.black-market-prompt strong { color: #e4b8ff; font-family: Georgia, serif; text-align: center; }
.black-market-prompt button {
  min-height: 38px;
  border: 1px solid rgba(226, 180, 255, .36);
  border-radius: 8px;
  color: #fff4dc;
  background: rgba(74, 45, 82, .86);
  cursor: pointer;
}
.black-market-prompt button span { margin-left: 8px; color: #ffd36f; font-weight: 850; }

.mining-npc-prompt {
  border-color: rgba(153, 231, 143, .58);
  color: #efffe8;
  background: linear-gradient(155deg, rgba(31, 67, 37, .96), rgba(13, 29, 21, .97));
  box-shadow: 0 14px 38px rgba(4, 23, 9, .52), inset 0 1px rgba(255, 255, 255, .09);
}

.mining-npc-prompt strong { color: #d9f4a2; }

.mining-npc-prompt small {
  color: rgba(235, 255, 222, .76);
  font-size: 11px;
  line-height: 1.35;
  text-align: center;
}

.mining-npc-prompt button {
  border-color: rgba(185, 239, 139, .42);
  color: #fffbea;
  background: linear-gradient(180deg, rgba(93, 137, 54, .96), rgba(49, 87, 30, .96));
}

.mining-npc-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(84px, .55fr);
  gap: 8px;
}

.mining-npc-prompt [data-world-npc-action-type="close"] {
  border-color: rgba(232, 222, 192, .32);
  background: linear-gradient(180deg, rgba(75, 70, 55, .96), rgba(43, 40, 31, .96));
}

.account-actions {
  display: flex;
  align-items: center;
  margin-left: auto;
  min-height: 42px;
  padding: 5px;
  border: 1px solid rgba(157,226,255,.36);
  border-radius: 13px;
  background: linear-gradient(180deg, rgba(4,28,45,.86), rgba(3,18,31,.76));
  box-shadow: 0 10px 26px rgba(0,10,20,.26), inset 0 1px rgba(255,255,255,.08);
  pointer-events: auto;
  backdrop-filter: blur(8px);
}

.account-actions button {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid rgba(166,220,241,.28);
  border-radius: 9px;
  color: rgba(230,248,255,.82);
  background: rgba(19,67,91,.54);
  cursor: pointer;
}

.combat-controls {
  --combat-skill-size: clamp(48px, 9.4vh, 68px);
  --combat-potion-size: clamp(34px, 6.4vh, 44px);
  --combat-run-size: clamp(44px, 7.4vh, 52px);
  --combat-potion-gap: 7px;
  --combat-potion-stack-gap: 6px;
  order: 3;
  position: relative;
  flex: 0 0 auto;
  width: clamp(154px, 29vh, 208px);
  height: clamp(132px, 25vh, 180px);
  pointer-events: none;
}

.potion-shortcut-row {
  position: absolute;
  z-index: 6;
  bottom: calc(100% + var(--combat-potion-stack-gap));
  right: 0;
  left: auto;
  display: flex;
  align-items: center;
  gap: var(--combat-potion-gap);
  transform: none;
  pointer-events: auto;
}

.potion-shortcut {
  position: relative;
  display: grid;
  place-items: center;
  width: var(--combat-potion-size);
  aspect-ratio: 1;
  padding: 3px;
  overflow: visible;
  border: 2px solid rgba(231, 202, 133, .72);
  border-radius: 50%;
  color: #fff3d0;
  background: radial-gradient(circle, rgba(26, 41, 53, .98), rgba(3, 10, 17, .98) 70%);
  box-shadow: inset 0 0 9px rgba(0, 0, 0, .86), 0 3px 10px rgba(0, 0, 0, .5);
  cursor: pointer;
  touch-action: manipulation;
}

.potion-shortcut--hp { border-color: rgba(235, 102, 104, .82); }
.potion-shortcut--mana { border-color: rgba(79, 172, 255, .86); }
.potion-shortcut img { width: 100%; height: 100%; object-fit: contain; pointer-events: none; }

.run-toggle {
  flex: 0 0 var(--combat-run-size);
  width: var(--combat-run-size);
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  overflow: visible;
  border-color: rgba(225, 245, 251, .68);
  color: #e8fbff;
  background: linear-gradient(180deg, rgba(5, 43, 66, .96), rgba(3, 21, 38, .94));
  box-shadow: 0 5px 14px rgba(0, 10, 20, .46), inset 0 1px rgba(255, 255, 255, .16);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.run-toggle.is-active {
  border-color: rgba(255, 226, 111, .98);
  color: #fff9cf;
  background: radial-gradient(circle at 50% 38%, rgba(42, 155, 175, .98), rgba(5, 40, 55, .99) 72%);
  box-shadow: inset 0 0 13px rgba(255, 221, 99, .16), 0 0 13px rgba(75, 224, 255, .46), 0 4px 12px rgba(0, 10, 20, .62);
}

.run-toggle[hidden],
#game[data-map-id="mappvp1"] .run-toggle { display: none !important; }

.run-toggle.is-running { transform: scale(1.04); }
.run-toggle:active { transform: scale(.94); }

.run-person-icon {
  position: relative;
  z-index: 2;
  width: 68%;
  height: 68%;
  overflow: visible;
  pointer-events: none;
}

.run-person-icon circle { fill: currentColor; }
.run-person-icon path {
  fill: none;
  stroke: currentColor;
  stroke-width: 6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.potion-shortcut-empty { font-size: .62rem; font-weight: 900; opacity: .58; pointer-events: none; }
.potion-shortcut-count {
  position: absolute;
  right: -4px;
  bottom: -4px;
  min-width: 18px;
  min-height: 18px;
  padding: 1px 4px;
  border: 1px solid rgba(255, 255, 255, .5);
  border-radius: 9px;
  color: #fff;
  background: rgba(1, 7, 13, .94);
  font-size: .65rem;
  font-weight: 900;
  line-height: 15px;
  text-align: center;
  pointer-events: none;
}
.potion-shortcut:disabled,
.potion-shortcut.is-empty { filter: grayscale(.82); opacity: .48; cursor: not-allowed; }
#game[data-map-id="mappvp1"] .potion-shortcut[data-potion-shortcut] { display: none; }

.skill-row {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.skill-three-stack {
  position: absolute;
  top: 0;
  right: 28%;
  width: var(--combat-skill-size);
  aspect-ratio: 1;
  pointer-events: none;
}

.skill-button,
.attack-button {
  position: absolute;
  isolation: isolate;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 50%;
  background: transparent;
  filter: drop-shadow(0 7px 11px rgba(0, 7, 18, .5));
  pointer-events: auto;
  cursor: pointer;
  touch-action: manipulation;
}

.skill-button {
  width: var(--combat-skill-size);
  aspect-ratio: 1;
}

.skill-button[data-action="skill1"] { left: 0; bottom: 0; }
.skill-button[data-action="skill2"] { left: 4%; top: 31%; }
.skill-three-stack > .skill-button[data-action="skill3"] { inset: 0; width: 100%; }

.skill-button img,
.attack-button img {
  position: relative;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

.skill-button::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 8%;
  border-radius: 50%;
  background: rgba(1, 5, 13, .76);
  opacity: 0;
  pointer-events: none;
  transition: opacity .12s linear;
}
.skill-button.is-cooling-down {
  cursor: not-allowed;
}
.skill-button.is-cooling-down::after {
  opacity: 1;
}
.skill-cooldown {
  position: absolute;
  z-index: 3;
  inset: 8%;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: clamp(17px, 3.7vh, 27px);
  font-weight: 950;
  line-height: 1;
  text-shadow: 0 2px 5px #000, 0 0 8px rgba(154, 224, 255, .5);
  pointer-events: none;
}
.skill-cooldown[hidden] { display: none; }
.attack-button {
  right: 0;
  bottom: 0;
  width: clamp(86px, 16.5vh, 122px);
  aspect-ratio: 1;
}

.skill-button:active,
.attack-button:active { transform: scale(.94); }

.skill-button:disabled,
.attack-button:disabled { opacity: .58; cursor: wait; }
.skill-button.is-target-required { opacity: .46; cursor: not-allowed; filter: grayscale(.35) drop-shadow(0 4px 8px rgba(0, 7, 18, .35)); }
.auto-button { order: 2; align-self: flex-end; margin: 0 8px 2px auto; }

@media (max-height: 520px) {
  .player-hud {
    width: clamp(218px, 32vw, 300px);
  }
  .hud-identity b { font-size: clamp(9px, 1vw, 13px); }
  .hud-identity small { font-size: clamp(6px, .55vw, 8px); }
  .hud-stat-label { font-size: clamp(6px, .55vw, 8px); }
  .hud-stat output { font-size: clamp(6px, .5vw, 8px); }
  .account-actions { min-height: 38px; }
  .account-actions button { min-height: 28px; padding: 0 8px; font-size: 10px; }
  .direction-note { display: none; }
  .combat-controls {
    --combat-potion-gap: 5px;
    --combat-potion-stack-gap: 4px;
  }
}

@media (max-height: 320px) {
  .topbar { gap: 6px; }
  .player-hud { width: clamp(195px, 31vw, 245px); }
  .camera-zoom-button,
  .settings-button { width: 30px; height: 30px; min-height: 0; padding: 0; }
  .combat-controls {
    --combat-potion-size: 32px;
    --combat-potion-gap: 4px;
    --combat-potion-stack-gap: 3px;
  }
}

/* NEXORIA 1.0.51: hotbar hai trang, cụm kỹ năng vòng cung và điều khiển ngồi/chạy gọn. */
#game .combat-controls {
  --combat-skill-size: clamp(50px, 9.5vh, 67px);
  --combat-potion-size: clamp(32px, 6vh, 42px);
  --combat-run-size: clamp(44px, 7.4vh, 52px);
  width: clamp(176px, 32vh, 224px);
  height: clamp(142px, 26vh, 184px);
}

#game .skill-row {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

#game .skill-row > .skill-button {
  position: absolute;
  width: var(--combat-skill-size);
  height: var(--combat-skill-size);
}

#game .skill-row > .skill-button[data-hotbar-position="0"] {
  inset: auto auto 6% 0;
}

#game .skill-row > .skill-button[data-hotbar-position="1"] {
  inset: 29% auto auto 18%;
}

#game .skill-row > .skill-button[data-hotbar-position="2"] {
  inset: 3% 24% auto auto;
}

#game .potion-shortcut-row {
  top: calc(-1 * var(--combat-run-size) - 10px);
  right: 0;
  bottom: auto;
  z-index: 8;
  align-items: center;
  gap: clamp(6px, 1.5vh, 10px);
}

#game .run-toggle,
#game .sit-toggle {
  border-color: rgba(255, 255, 255, .54);
  color: rgba(255, 255, 255, .92);
  background: rgba(8, 18, 28, .28);
  box-shadow: 0 3px 10px rgba(0, 0, 0, .3), inset 0 0 10px rgba(255, 255, 255, .04);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

#game .run-toggle.is-active,
#game .sit-toggle.is-active {
  border-color: rgba(255, 255, 255, .88);
  color: #fff;
  background: rgba(16, 34, 45, .38);
  box-shadow: 0 0 10px rgba(255, 255, 255, .25), inset 0 0 12px rgba(255, 255, 255, .07);
}

#game .sit-toggle {
  flex: 0 0 var(--combat-run-size);
  width: var(--combat-run-size);
  min-width: 44px;
  min-height: 44px;
  padding: 8px;
}

#game .sit-toggle svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#game .sit-toggle svg circle { fill: currentColor; stroke: none; }
#game .sit-toggle.is-transitioning { opacity: .72; cursor: wait; }

#game .combat-teleport-button {
  position: absolute;
  z-index: 9;
  top: calc(-1 * var(--combat-run-size) - 72px);
  right: 0;
  display: grid;
  place-items: center;
  width: clamp(38px, 6.8vh, 48px);
  aspect-ratio: 1;
  padding: 3px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 50%;
  color: #fff;
  background: rgba(7, 20, 30, .36);
  box-shadow: 0 3px 10px rgba(0,0,0,.32);
  pointer-events: auto;
}

#game .combat-teleport-button svg { width: 100%; height: 100%; overflow: visible; }
#game .combat-teleport-button svg > circle:first-child { fill: rgba(8,20,31,.26); stroke: currentColor; stroke-width: 2.5; }
#game .combat-teleport-button .teleport-person-head { fill: currentColor; stroke: none; }
#game .combat-teleport-button .teleport-person-body { fill: none; stroke: currentColor; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }

#game .skill-page-toggle-button { position: relative; }
#game .skill-page-indicator {
  position: absolute;
  right: -4px;
  bottom: -4px;
  display: grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 999px;
  color: #fff;
  background: rgba(4,10,17,.9);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}

@media (max-height: 420px) {
  #game .combat-controls { --combat-skill-size: 48px; }
  #game .potion-shortcut-row { top: -54px; gap: 6px; }
  #game .combat-teleport-button { top: -104px; }
}

@media (orientation: portrait) {
  .auth-gate { place-items: start center; }
  .auth-shell { width: min(430px, 94vw); }
  .auth-card { width: min(430px, 100%); margin: auto; }
  .player-hud { max-width: 64vw; }
}

@media (max-height: 430px) and (orientation: landscape) {
  .auth-shell { width: min(390px, 94vw); padding-top: 0; }
  .auth-card { width: min(370px, 100%); padding: 10px 14px; }
  .auth-brand { margin-bottom: 7px; }
  .auth-brand h1 { font-size: 26px; }
  .auth-brand span { margin-top: 2px; font-size: 9px; }
  .auth-tabs { margin-bottom: 7px; }
  .quick-note { display: none; }
}

@media (max-height: 320px) and (orientation: landscape) {
  .auth-shell { padding-top: 0; }
  .auth-card { padding: 6px 12px; }
  .auth-brand { margin-bottom: 4px; }
  .auth-brand h1 { font-size: 22px; }
  .auth-tabs { margin-bottom: 4px; }
  .auth-form { gap: 4px; }
  .auth-form input,
  .auth-submit,
  .account-exit { min-height: 34px; padding-top: 6px; padding-bottom: 6px; }
}

/* NEXORIA 1.0.30: giữ HUD chiến đấu, bổ sung VFX phía sau toàn bộ UI. */
#game .player-hud {
  align-self: flex-start;
  height: auto;
  aspect-ratio: 1774 / 887;
}

/* Giữ đúng tỉ lệ gốc 2:1 của ảnh khung; bản cũ nới inset theo chiều dọc làm vòng avatar hơi oval. */
#game .player-hud::before {
  z-index: 4;
  inset: 0;
  background-size: 100% 100%;
}

#game #hudAvatarButton.hud-avatar-frame {
  z-index: 2;
  top: 16.5%;
  bottom: auto;
  left: 1.23%;
  width: 34%;
  height: auto;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
}

#game #hudAvatarButton .hud-avatar-portrait {
  inset: 6.3%;
  width: auto;
  height: auto;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 50%;
}

#game #hudAvatarButton .hud-avatar {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 30%;
  transform: none;
}

/* Cho màu chạy dưới ảnh khung, nhưng số HP/Mana/EXP vẫn ở lớp trên để luôn rõ. */
#game .hud-player-data { z-index: auto; }
#game .hud-identity {
  z-index: 5;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  column-gap: clamp(3px, .42vw, 6px);
  padding-inline: 7%;
  transform: translateY(2px);
}
#game .hud-identity b {
  min-width: 0;
  max-width: 100%;
  font-size: calc(clamp(9px, .92vw, 13px) + 2px);
  text-align: left;
}
#game .hud-identity small {
  max-width: none;
  margin-top: 0;
  text-align: right;
}
#game .hud-stat { isolation: auto; }
#game .hud-stat-track {
  z-index: 2;
  top: 8%;
  right: 4.2%;
  bottom: 8%;
  left: 19.8%;
  clip-path: inset(0 round 3px);
}
#game .hud-stat output {
  z-index: 5;
  right: 4.2%;
  left: 19.8%;
}

/* NEXORIA 1.0.37: Mana lên thêm 1 px; EXP lên 2 px và thấp hơn 2 px. */
#game .hud-stat--hp .hud-stat-track {
  z-index: 3;
}

#game .hud-stat--hp output {
  z-index: 6;
}

#game .hud-stat--mana .hud-stat-track {
  z-index: 2;
  transform: translateY(-5px);
}

#game .hud-stat--mana output {
  z-index: 5;
  transform: translateY(calc(-50% - 5px));
}

#game .hud-stat--exp .hud-stat-track {
  z-index: 3;
  top: calc(8% + 1px);
  bottom: calc(8% + 1px);
  background: #000000;
  transform: translateY(-11.2px);
}

#game .hud-stat--exp output {
  z-index: 6;
  transform: translateY(calc(-50% - 11.2px));
}

#game .combat-controls {
  --combat-skill-size: clamp(50px, 10.5vh, 64px);
  --combat-potion-gap: 12px;
  --combat-potion-stack-gap: 12px;
  width: clamp(210px, 36vh, 250px);
  height: clamp(150px, 29vh, 195px);
}

/* NEXORIA 1.0.53: ba ô kỹ năng theo cung mẫu; 1 và 3 đã đảo đúng bản duyệt. */
#game .skill-row {
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

#game .skill-row > .skill-button {
  position: absolute;
  inset: auto;
  width: var(--combat-skill-size);
  height: var(--combat-skill-size);
}

/* Ô 1 nằm bên phải và hơi cao hơn nút Kho đồ. */
#game .skill-row > .skill-button[data-hotbar-position="0"] {
  right: auto;
  bottom: 0;
  left: 0;
}

/* Khoảng cách tâm 1–2 và 2–3 bằng nhau theo cùng một cung chéo. */
#game .skill-row > .skill-button[data-hotbar-position="1"] {
  top: calc(52% - var(--combat-skill-size) / 2);
  right: auto;
  bottom: auto;
  left: 25%;
}

#game .skill-row > .skill-button[data-hotbar-position="2"] {
  top: 4%;
  right: auto;
  bottom: auto;
  left: 50%;
}

/* Khung ảnh thật luôn hiện cho cả ô trống và cả hai trang hotbar. */
#game .skill-row > .skill-button::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  border: 0;
  border-radius: 50%;
  background: url("assets/ui/skills/v1053/skill-button-frame.png?v=1.0.86-20260910") center / contain no-repeat;
  box-shadow: none;
  pointer-events: none;
}

#game .skill-row > .skill-button > img {
  position: absolute;
  z-index: 1;
  inset: 17%;
  width: 66%;
  height: 66%;
  object-fit: contain;
}

#game .attack-button {
  width: clamp(88px, 16.5vh, 108px);
}

/* CD chỉ chiếm lòng nút, không tràn lên viền kỹ năng. */
#game .skill-button::after { z-index: 2; inset: 17%; }
#game .skill-cooldown {
  inset: 18%;
  overflow: hidden;
  border-radius: 50%;
  font-size: clamp(13px, 2.8vh, 20px);
  font-variant-numeric: tabular-nums;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

@media (max-height: 520px) {
  #game .combat-controls {
    --combat-potion-gap: 9px;
    --combat-potion-stack-gap: 9px;
  }
}

@media (max-height: 320px) {
  #game .combat-controls {
    --combat-potion-size: 32px;
    --combat-potion-gap: 8px;
    --combat-potion-stack-gap: 8px;
  }
}

/* NEXORIA 1.0.58: one layout in the actual visible viewport, in either rotation.
 * The event-driven helper resolves safe areas and sets one uniform CSS unit.
 * Image assets and skill action/page bindings remain unchanged.
 */
#game {
  --ui-unit: 1px;
  --hud-unit: 1px;
  --hud-width: 280px;
  --ui-top-button: 34px;
  position: fixed;
  top: var(--viewport-top, 0px);
  left: var(--viewport-left, 0px);
  width: var(--viewport-width, 100%);
  height: 100%;
  height: var(--viewport-height, 100dvh);
  min-height: 0;
}

#game .nexoria-safe-area-probe {
  position: absolute;
  width: 0;
  height: 0;
  padding: var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);
  visibility: hidden;
  pointer-events: none;
}

#game .topbar { gap: 8px; }
#game .camera-zoom-button,
#game .settings-button {
  flex: 0 0 var(--ui-top-button);
  width: var(--ui-top-button);
  height: var(--ui-top-button);
  min-width: 0;
}

#game .player-hud {
  flex: 0 0 auto;
  width: var(--hud-width);
  max-width: none;
  height: auto;
  aspect-ratio: 2 / 1;
  transform: none;
}

#game .player-hud::before {
  inset: 0;
  background-size: contain;
}

#game #hudAvatarButton.hud-avatar-frame {
  margin: 0;
  padding: 0;
  height: auto;
  min-height: 0;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
}

/* Keep the existing crop/frame coordinates; scale text and fine offsets with
 * the complete 2:1 HUD, so the bars never drift when its width changes.
 */
#game .hud-identity {
  column-gap: calc(4 * var(--hud-unit));
  transform: translateY(calc(2 * var(--hud-unit)));
}
#game .hud-identity b { font-size: calc(13 * var(--hud-unit)); }
#game .hud-identity small,
#game .hud-stat output { font-size: calc(8 * var(--hud-unit)); }
#game .hud-stat--mana .hud-stat-track {
  transform: translateY(calc(-5 * var(--hud-unit)));
}
#game .hud-stat--mana output {
  transform: translateY(calc(-50% - 5 * var(--hud-unit)));
}
#game .hud-stat--exp .hud-stat-track {
  top: calc(8% + var(--hud-unit));
  bottom: calc(8% + var(--hud-unit));
  transform: translateY(calc(-11.2 * var(--hud-unit)));
}
#game .hud-stat--exp output {
  transform: translateY(calc(-50% - 11.2 * var(--hud-unit)));
}

#game .controls {
  display: block;
  height: calc(292 * var(--ui-unit));
}

#game .joystick {
  position: absolute;
  left: 0;
  bottom: calc(38 * var(--ui-unit));
  width: calc(108 * var(--ui-unit));
  height: calc(108 * var(--ui-unit));
  margin: 0;
}

#game .axis-status {
  right: 0;
  left: 0;
  bottom: calc(-34 * var(--ui-unit));
  flex-direction: column;
  gap: calc(2 * var(--ui-unit));
}
#game .axis-lock,
#game .battery-status { font-size: calc(9 * var(--ui-unit)); }

#game .utility-controls {
  position: absolute;
  right: calc(190 * var(--ui-unit));
  bottom: 0;
  width: calc(42 * var(--ui-unit));
  gap: calc(8 * var(--ui-unit));
  margin: 0;
}
#game .utility-controls > .utility-icon-button {
  flex: 0 0 auto;
  width: calc(42 * var(--ui-unit));
  height: calc(42 * var(--ui-unit));
  min-width: 0;
  min-height: 0;
}
#game .skill-page-indicator {
  min-width: calc(18 * var(--ui-unit));
  height: calc(18 * var(--ui-unit));
  font-size: calc(10 * var(--ui-unit));
}

#game .combat-controls {
  --arc-unit: var(--ui-unit);
  --arc-attack: calc(96 * var(--arc-unit));
  --arc-skill: calc(60 * var(--arc-unit));
  --arc-radius: calc(96 * var(--arc-unit));
  --arc-center: calc(138 * var(--arc-unit));
  --combat-skill-size: var(--arc-skill);
  --combat-potion-size: calc(36 * var(--arc-unit));
  --combat-run-size: calc(44 * var(--arc-unit));
  --combat-potion-gap: calc(8 * var(--arc-unit));
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(186 * var(--arc-unit));
  height: calc(292 * var(--arc-unit));
}

#game .skill-row {
  inset: auto 0 0;
  width: calc(186 * var(--arc-unit));
  height: calc(186 * var(--arc-unit));
}

/* Common center = attack center; angles 170/130/90 degrees have equal 40°
 * steps. Both hotbar pages reuse these three position attributes. The 60-unit
 * skills now leave an 18-unit edge gap around attack, reduced from 33 units;
 * the artwork, cooldown and actual touch target share the same circle.
 */
#game .skill-row > .skill-button[data-hotbar-position] {
  inset: auto;
  width: var(--arc-skill);
  height: var(--arc-skill);
  aspect-ratio: 1 / 1;
  left: calc(var(--arc-center) + var(--arc-radius) * var(--arc-cos) - var(--arc-skill) / 2);
  top: calc(var(--arc-center) - var(--arc-radius) * var(--arc-sin) - var(--arc-skill) / 2);
}
#game .skill-row > .skill-button[data-hotbar-position="0"] {
  --arc-cos: -0.984807753;
  --arc-sin: 0.173648178;
}
#game .skill-row > .skill-button[data-hotbar-position="1"] {
  --arc-cos: -0.642787610;
  --arc-sin: 0.766044443;
}
#game .skill-row > .skill-button[data-hotbar-position="2"] {
  --arc-cos: 0;
  --arc-sin: 1;
}

#game .attack-button {
  inset: auto 0 0 auto;
  width: var(--arc-attack);
  height: var(--arc-attack);
  aspect-ratio: 1 / 1;
}
#game .skill-cooldown { font-size: calc(18 * var(--arc-unit)); }

/* Teleport and consumables have reserved space inside the measured block. */
#game .combat-teleport-button {
  top: 0;
  right: 0;
  bottom: auto;
  width: calc(40 * var(--arc-unit));
  height: calc(40 * var(--arc-unit));
}
#game .potion-shortcut-row {
  top: calc(50 * var(--arc-unit));
  right: calc(4 * var(--arc-unit));
  bottom: auto;
  left: auto;
  gap: var(--combat-potion-gap);
}
#game .potion-shortcut {
  flex: 0 0 var(--combat-potion-size);
  width: var(--combat-potion-size);
  height: var(--combat-potion-size);
}
#game .run-toggle,
#game .sit-toggle {
  flex-basis: var(--combat-run-size);
  width: var(--combat-run-size);
  height: var(--combat-run-size);
  min-width: 0;
  min-height: 0;
}
#game .sit-toggle { padding: calc(8 * var(--arc-unit)); }
#game .potion-shortcut-empty { font-size: calc(10 * var(--arc-unit)); }
#game .potion-shortcut-count {
  min-width: calc(18 * var(--arc-unit));
  min-height: calc(18 * var(--arc-unit));
  font-size: calc(10 * var(--arc-unit));
  line-height: calc(15 * var(--arc-unit));
}
#game .rotate-hint { display: none; }


/* PB2 gate selection follows the gate; nearest-gate teleport stays in the HUD. */
#game .mappb2-overview-button {
  position: absolute;
  z-index: 27;
  top: calc(var(--safe-top) + 10px);
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 98px;
  min-height: 44px;
  padding: 7px 12px;
  border: 1px solid rgba(225, 241, 249, .72);
  border-radius: 11px;
  color: #f3fcff;
  background: rgba(6, 27, 39, .82);
  box-shadow: 0 3px 12px rgba(0, 0, 0, .28);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  touch-action: manipulation;
  pointer-events: auto;
}
#game .mappb2-overview-button svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#game .mappb2-overview-button[aria-pressed="true"] {
  border-color: #aff9df;
  background: rgba(12, 74, 72, .9);
}
#game .mappb2-overview-button[hidden],
#game .is-pb2-portal-anchor[hidden] { display: none !important; }
.pb2-portal-button-label { display: none; }
#game .same-map-teleport-button.is-pb2-portal-anchor {
  position: absolute;
  z-index: 27;
  inset: var(--pb2-anchor-y, -100px) auto auto var(--pb2-anchor-x, -100px);
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 108px;
  min-height: 44px;
  height: auto;
  aspect-ratio: auto;
  padding: 6px 8px;
  border: 1px solid rgba(183, 245, 237, .9);
  border-radius: 10px;
  color: #f1fffc;
  background: rgba(5, 49, 58, .9);
  box-shadow: 0 2px 12px rgba(0, 13, 25, .5);
  font-size: 11px;
  font-weight: 800;
  pointer-events: auto;
  touch-action: manipulation;
}
#game .is-pb2-portal-anchor .pb2-portal-button-label { display: inline; }
#game .same-map-teleport-button.is-pb2-portal-anchor svg { width: 26px; height: 26px; }
#game .is-pb2-portal-anchor .same-map-teleport-countdown { z-index: 2; }
#game .portal-destination-panel.is-pb2-portal-panel {
  inset: var(--pb2-panel-y, 0px) auto auto var(--pb2-panel-x, 0px);
  width: clamp(185px, 25vw, 240px);
  transform: none;
  transition: opacity .12s ease, visibility .12s;
}
#game .is-pb2-portal-panel .portal-destination-scroll {
  max-height: min(240px, 47vh);
}
#game .is-pb2-portal-panel .portal-destination-row { min-height: 44px; }
@media (orientation: portrait) {
  #game .mappb2-overview-button {
    left: auto;
    right: calc(var(--safe-right) + 48px);
    top: calc(var(--safe-top) + 58px);
    transform: none;
  }
}
/* 1.0.95 guild boss: five visible ranking rows, independent scroll. */
#guildBossDamageBoard { position: absolute; z-index: 2; max-width: min(38vw, 430px); border: 1px solid #9e854b; border-radius: 8px; padding: 5px; color: #edf7fc; background: rgba(5, 22, 33, .86); pointer-events: auto; }
#guildBossDamageBoard > strong { display: block; padding: 3px 5px 5px; font-size: 11px; color: #ffe2a0; }
#guildBossDamageList { --guild-rank-row: 29px; list-style: none; margin: 0; padding: 0; height: calc(var(--guild-rank-row) * 5); overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y; scrollbar-width: thin; scrollbar-color: #c8a65e #112637; }
#guildBossDamageList li { box-sizing: border-box; display: grid; grid-template-columns: 16px minmax(35px, 1fr) auto 43px; align-items: center; gap: 4px; height: var(--guild-rank-row); padding: 3px 4px; border-bottom: 1px solid #ffffff15; font-size: 11px; font-variant-numeric: tabular-nums; }
#guildBossDamageList li span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#guildBossDamageList li small { text-align: right; font-size: 10px; color: #b6d7d1; }
#guildBossDamageList li.is-self { color: #ffdc85; background: #8e773324; }
#guildBossDamageList li.is-empty { display: block; padding: 8px; color: #bacbd4; }
#guildBossSkillStatus { position: absolute; bottom: max(12px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); display: grid; grid-template-columns: repeat(6, 1fr); gap: 5px; padding: 7px 10px; border: 1px solid #a88e50; border-radius: 9px; background: rgba(4, 21, 32, .88); pointer-events: none; }
#guildBossSkillStatus > div { width: 43px; display: grid; justify-items: center; gap: 2px; }
#guildBossSkillStatus img { width: 36px; height: 36px; object-fit: contain; }
#guildBossSkillStatus span { color: #bde9cc; font-size: 9px; white-space: nowrap; }
#guildBossSkillStatus .is-cooling img { opacity: .52; }
#guildBossSkillStatus .is-cooling span { color: #ffe3a1; }
#guildBossAutoResources { grid-column: 1 / -1; color: #b9e4ef; font-size: 10px; text-align: center; }
#guildBossDeathPopup { position: absolute; z-index: 3; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(300px, 76vw); padding: 18px; border: 1px solid #d4b66b; border-radius: 12px; background: rgba(7, 27, 42, .97); color: #eef7fc; text-align: center; box-shadow: 0 12px 35px #0008; pointer-events: auto; }
#guildBossDeathPopup[hidden] { display: none; }
#guildBossDeathPopup strong { color: #ffccaa; font-size: 18px; }
#guildBossDeathPopup p { margin: 12px 0; font-size: 20px; font-variant-numeric: tabular-nums; }
#guildBossDeathPopup small { display: block; line-height: 1.4; }
#guildBossDeathPopup button { display: block; margin: 14px auto 0; min-height: 38px; min-width: 100px; border: 1px solid #d2b361; border-radius: 7px; color: #fff1cb; background: #674919; font-weight: 700; }
@media (max-height: 500px) { #guildBossDamageList { --guild-rank-row: 23px; } #guildBossDamageBoard > strong { padding-bottom: 2px; font-size: 10px; } #guildBossSkillStatus img { width: 29px; height: 29px; } }

/* 1.0.96: lower all three KILL centers equally; artwork and hit circle move
 * together. The attack anchor, safe-area block and touch sizes remain intact. */
#game .skill-row > .skill-button[data-hotbar-position] {
  top: calc(var(--arc-center) - var(--arc-radius) * var(--arc-sin) - var(--arc-skill) / 2 + 6 * var(--arc-unit));
}
#game .combat-teleport-button { top: calc(12 * var(--arc-unit)); }
#game .potion-shortcut-row { top: calc(62 * var(--arc-unit)); }

/* 1.0.97 — seated resting posture, existing recovery behavior is unchanged. */
#game .sit-toggle .nx197-sit-icon { stroke:none; stroke-width:0; }
#game .sit-toggle .nx197-sit-icon path[stroke="currentColor"] { stroke:currentColor; stroke-width:5; }
#game .sit-toggle .nx197-sit-icon path[stroke="#40564c"] { stroke:#40564c; stroke-width:2.5; }

/* User choice: plain white joystick, no painted ornament. Keep geometry/input. */
#game .joystick-ring { border: 2px solid rgba(255,255,255,.72); background: rgba(255,255,255,.09); box-shadow: none; }
#game .joystick-ring::before, #game .joystick-ring::after { display: none; }
#game .joystick-knob { border: 2px solid rgba(255,255,255,.95); background: rgba(255,255,255,.64); box-shadow: none; }

/* NEXORIA bundle206: nexoria-pets-198.css */
/* Approved pet panel: warm brown/gold, reusable live text and controls. */
#game .utility-controls > #petButton {
  position: absolute;
  right: calc(100% + 8 * var(--ui-unit, 1px));
  bottom: 0;
}
#petButton svg, #petSkillButton svg { fill: currentColor; stroke: none; }
#game .utility-controls > #petSkillButton {
  position: absolute;
  right: calc(100% + 8 * var(--ui-unit, 1px));
  bottom: calc(50 * var(--ui-unit, 1px));
  border-radius: 50%;
  background: rgba(57, 43, 25, .72);
  color: #f8e4b1;
}
#petSkillButton[hidden], .nx198-pet-modal[hidden], .nx198-pet-submodal[hidden] { display: none !important; }
#petSkillButton.is-active { border-color: #f0d28b; box-shadow: 0 0 10px rgba(247, 223, 150, .35); }
#petSkillButton.is-cooling svg { opacity: .35; }
#petSkillButton output { position: absolute; font-size: calc(17 * var(--ui-unit, 1px)); color: white; font-weight: 700; }
#petSkillButton small { position: absolute; left: 50%; top: 100%; transform: translateX(-50%); white-space: nowrap; font-size: calc(9 * var(--ui-unit, 1px)); color: #fff3bd; }
.nx198-pet-modal { position: absolute; z-index: 125; inset: 0; display: grid; place-items: center; padding: clamp(8px, 2vh, 20px); background: rgba(12, 10, 6, .36); pointer-events: auto; box-sizing: border-box; }
.nx198-pet-modal *, .nx198-pet-stats * { box-sizing: border-box; }
.nx198-pet-panel { width: min(920px, 94%); max-height: 94%; display: flex; flex-direction: column; color: #f5e7c4; border: 1px solid #d2ad65; border-radius: 15px; padding: clamp(12px, 2vh, 22px); background: linear-gradient(125deg, rgba(45, 34, 22, .96), rgba(25, 21, 17, .95)); box-shadow: inset 0 0 0 4px #382b1c, inset 0 0 0 5px #8d7040, 0 12px 40px #0008; }
.nx198-pet-panel > header, .nx198-pet-submodal header { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-shrink: 0; border-bottom: 1px solid #84653b; padding-bottom: 9px; }
.nx198-pet-panel h2 { margin: 0; color: #ffe5a2; font: 700 clamp(16px, 3vh, 28px) Georgia, serif; letter-spacing: .06em; }
.nx198-pet-panel button, .nx198-pet-submodal button { color: #ffedc3; cursor: pointer; touch-action: manipulation; font: inherit; border: 1px solid #b68c4d; border-radius: 8px; padding: 9px 13px; background: linear-gradient(#876130, #50371b); box-shadow: inset 0 0 0 2px #ffffff08; }
.nx198-pet-panel button:hover:not(:disabled), .nx198-pet-submodal button:hover:not(:disabled) { border-color: #ffe7a7; background: linear-gradient(#99743e, #634726); }
.nx198-pet-panel button:focus-visible, .nx198-pet-submodal button:focus-visible, .nx198-pet-modal input:focus-visible, .nx198-pet-modal select:focus-visible { outline: 2px solid #fff1c3; outline-offset: 2px; }
.nx198-pet-panel button:disabled, .nx198-pet-submodal button:disabled { cursor: default; opacity: .42; }
.nx198-pet-panel .nx198-pet-close, .nx198-pet-submodal header button { font-size: 27px; line-height: 1; padding: 0 6px; background: none; box-shadow: none; border: 0; }
.nx198-pet-tabs { display: flex; gap: 8px; padding: 8px 0; }
.nx198-pet-tabs button { padding: 6px 17px; font-size: 13px; background: #302316; color: #c4ae85; }
.nx198-pet-tabs button.is-active { color: #fff0c3; border-color: #e2bd77; background: #735028; }
.nx198-pet-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #a88148 #2d241b; }
.nx198-pet-main { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 16px; align-items: center; }
.nx198-pet-art { height: clamp(175px, 42vh, 380px); min-height: 0; display: grid; place-items: center; background: radial-gradient(ellipse at center, #d7be7840, transparent 62%); }
.nx198-pet-art > img { max-width: 100%; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 5px 14px #e7da9e28); }
.nx198-pet-details { min-width: 0; border: 1px solid #715737; border-radius: 12px; padding: clamp(10px, 1.8vh, 17px); background: #201a1452; }
.nx198-pet-details h3 { margin: 0 0 8px; font: 700 clamp(19px, 3.3vh, 32px) Georgia, serif; }
.nx198-rank { display: inline-block; font: 700 .72em Georgia, serif; padding: 2px 8px; border: 1px solid #c29c59; border-radius: 4px; color: #f4e5ae; vertical-align: middle; }
.nx198-rank.R { background: #475148; }
.nx198-rank.SR { background: #5e366d; color: #efd0ff; }
.nx198-rank.SSR { background: #8b6224; color: #ffe6a0; }
.nx198-pet-level { font-size: 16px; margin: 6px 0; }
.nx198-pet-exp { position: relative; height: 22px; overflow: hidden; border: 1px solid #8f764e; border-radius: 7px; background: #1c1812; }
.nx198-pet-exp i { display: block; height: 100%; background: linear-gradient(90deg, #66815b, #a9c38c); }
.nx198-pet-exp span { position: absolute; inset: 0; text-align: right; padding: 1px 8px; font-size: 12px; line-height: 18px; text-shadow: 0 1px 3px #000; }
.nx198-pet-details > small { display: block; color: #c9b796; font-size: 11px; margin-top: 5px; }
.nx198-pet-details dl { display: grid; gap: 6px; margin: 12px 0; }
.nx198-pet-details dl div { display: flex; justify-content: space-between; align-items: center; gap: 10px; border: 1px solid #725635; border-radius: 6px; padding: 8px 10px; background: linear-gradient(90deg, #70523430, #120e0b30); font-size: clamp(12px, 1.9vh, 16px); }
.nx198-pet-details dd { margin: 0; white-space: nowrap; color: #ffe6ac; }
.nx198-pet-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.nx198-pet-actions button { padding: 9px 4px; font-size: clamp(11px, 1.8vh, 15px); }
.nx198-pet-actions [data-pet-action="follow"] { background: linear-gradient(#52604b, #2b3528); }
.nx198-pet-roster { display: flex; overflow-x: auto; gap: 8px; padding: 10px 1px 4px; scrollbar-width: thin; }
.nx198-pet-panel .nx198-pet-choice { flex: 0 0 162px; display: flex; align-items: center; gap: 6px; text-align: left; padding: 4px 8px; background: #2a2117; font-size: 12px; }
.nx198-pet-choice img { width: 36px; height: 54px; object-fit: contain; }
.nx198-pet-choice small { display: block; font-size: 10px; color: #cbb890; margin-top: 4px; }
.nx198-pet-panel .nx198-pet-choice.is-selected { border-color: #ffe5a2; background: #75523065; }
.nx198-pet-message { min-height: 17px; margin: 5px 0 1px; font-size: 12px; color: #e5cf9c; }
.nx198-pet-message.is-error { color: #ffb098; }
.nx198-pet-wallet { border-top: 1px solid #84653b; padding-top: 7px; font-size: 12px; color: #c9b796; }
.nx198-pet-empty, .nx198-pet-eggs { text-align: center; padding: 24px; }
.nx198-pet-empty svg { width: 65px; height: 65px; fill: #b69455; }
.nx198-pet-empty p, .nx198-pet-eggs p { color: #d3c1a0; }
.nx198-pet-merge h3 { margin: 14px 0; }
.nx198-pet-merge-pair { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.nx198-pet-merge-pair label { display: grid; gap: 8px; }
.nx198-pet-merge-pair select, .nx198-pet-modal input { width: 100%; min-width: 0; border: 1px solid #b59360; border-radius: 6px; color: #ffedc7; background: #2d2217; padding: 9px; font: inherit; }
.nx198-pet-merge > p { color: #d7bd8a; font-size: 13px; }
.nx198-pet-shop { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 15px 0 0; }
.nx198-pet-shop article { border: 1px solid #715735; border-radius: 9px; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 12px; background: #33251880; }
.nx198-pet-shop article img { width: 100%; height: clamp(110px, 22vh, 220px); object-fit: contain; }
.nx198-pet-shop h3 { margin: 10px 0 4px; font-size: 16px; }
.nx198-pet-shop p { margin: 5px 0; font-size: 12px; color: #d3bb8e; }
.nx198-pet-shop strong { margin-top: auto; padding: 7px 0; font-size: 13px; }
.nx198-pet-shop button { margin-top: 7px; font-size: 13px; width: 100%; }
.nx198-shop-symbol { display: grid; place-items: center; font: 90px Georgia, serif; color: #b9c798; height: clamp(110px, 22vh, 220px); }
.nx198-shop-egg { display: block; width: 74px; height: 94px; margin: auto; border-radius: 52% 52% 47% 47% / 65% 65% 40% 40%; border: 2px solid #d3ba7c; background: radial-gradient(ellipse at 32% 25%, #fffcde, #b2bb95 53%, #586b65); box-shadow: inset -9px -8px 14px #233c3738, 0 0 16px #d8dd9d20; }
.nx198-pet-shop-note { color: #c9b796; font-size: 12px; }
.nx198-pet-submodal { position: absolute; z-index: 1; inset: 0; display: grid; place-items: center; background: #0b0809a8; padding: 15px; }
.nx198-pet-submodal article { max-width: 430px; width: 95%; max-height: 95%; overflow-y: auto; padding: 20px; color: #f7e5bd; background: linear-gradient(125deg, #483420, #211a15); border: 1px solid #d1ae6b; border-radius: 12px; box-shadow: 0 15px 50px #0009; }
.nx198-pet-submodal h3 { margin: 0; font-size: 17px; }
.nx198-pet-submodal p { font-size: 14px; line-height: 1.55; }
.nx198-pet-quantity-label { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 12px; padding: 20px 0 10px; }
.nx198-pet-quantity-actions { display: flex; justify-content: flex-end; gap: 8px; }
.nx198-pet-food-label { display: grid; gap: 7px; font-size: 13px; }
.nx198-pet-food-label select { width: 100%; min-width: 0; padding: 10px; border: 1px solid #b59360; border-radius: 6px; color: #ffedc7; background: #2d2217; font: inherit; }
.nx198-pet-confirm-actions { display: flex; justify-content: flex-end; gap: 9px; }
.nx198-pet-panel .nx198-pet-retry { align-self: flex-start; margin: 3px 0 7px; padding: 5px 12px; font-size: 12px; }
.nx198-pet-retry[hidden] { display: none !important; }
.nx198-pet-stats { border: 1px solid #997340; border-radius: 9px; padding: 9px 11px; margin-top: 12px; background: #312416; }
.nx198-pet-stats h3 { color: #f5d693; font-size: 13px; margin: 0 0 8px; }
.nx198-pet-stats h4 { margin: 10px 0 5px; color: #d8ba80; font-size: 12px; }
.nx198-pet-stats p { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin: 7px 0; font-size: 12px; }
.nx198-pet-stats small { color: #c8b595; line-height: 1.5; display: block; font-size: 10px; }
@media (max-height: 460px) { .nx198-pet-panel { width: min(870px, 96%); padding: 11px; } .nx198-pet-art { height: 205px; } .nx198-pet-details dl { margin: 8px 0; gap: 4px; } .nx198-pet-details dl div { padding: 5px 8px; } .nx198-pet-roster { padding-top: 6px; } .nx198-pet-shop article { padding: 8px; } }
@media (max-width: 540px) and (orientation: portrait) { .nx198-pet-main { grid-template-columns: 1fr; } .nx198-pet-art { height: 220px; } .nx198-pet-shop { grid-template-columns: 1fr; } .nx198-pet-merge-pair { grid-template-columns: 1fr; } }

/* Boss Bang retains automatic combat; the approved pet buff is its one new input. */
#game.is-guild-boss-active .controls { z-index: 251; }
.is-guild-boss-active #petSkillButton { visibility: visible !important; pointer-events: auto !important; }

/* NEXORIA bundle206: nexoria-108-ui.css */
:root {
  --nx108-ink: #fff8e8;
  --nx108-muted: #c5b08d;
  --nx108-night: rgba(25, 17, 9, 0.98);
  --nx108-panel: linear-gradient(145deg, rgba(57, 40, 21, 0.98), rgba(25, 18, 10, 0.99) 58%, rgba(38, 25, 12, 0.99));
  --nx108-line: rgba(242, 202, 124, 0.58);
  /* Tên biến cũ được giữ để không đổi API CSS; từ 1.0.19 đây là màu đồng. */
  --nx108-blue: #e7b65c;
  --nx108-gold: #ffd777;
  --nx108-green: #66e58a;
  --nx108-purple: #c078ff;
  --nx108-danger: #ff7b86;
}

.nx108-root,
.nx108-root *,
.nx108-root *::before,
.nx108-root *::after {
  box-sizing: border-box;
}

.nx108-root {
  position: relative;
  z-index: 950;
  color: var(--nx108-ink);
  font-family: "Noto Sans", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.01em;
}

.nx108-root [hidden],
.overhead-layer [hidden],
.loot-flight-layer [hidden] {
  display: none !important;
}

.nx108-root button,
.nx108-root input {
  color: inherit;
  font: inherit;
}

.nx108-root button {
  -webkit-tap-highlight-color: transparent;
}

.nx108-layer,
.nx108-sub-layer {
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 3.5vh 3vw;
  background:
    radial-gradient(circle at 50% 34%, rgba(210, 151, 55, 0.2), transparent 44%),
    rgba(15, 9, 4, 0.79);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.nx108-layer { z-index: 960; }
.nx108-sub-layer { z-index: 970; }
#nexoriaConfirm { z-index: 990; }

.nx108-panel,
.nx108-flow-card,
.nx108-item-card,
.nx108-confirm-card,
.nx108-interaction {
  position: relative;
  border: 1px solid var(--nx108-line);
  border-radius: 20px 8px 20px 8px;
  background: var(--nx108-panel);
  box-shadow:
    0 25px 80px rgba(0, 0, 0, 0.68),
    inset 0 0 0 2px rgba(255, 226, 170, 0.05),
    inset 0 1px rgba(255, 255, 255, 0.12);
  overflow: hidden;
}

.nx108-panel::before,
.nx108-flow-card::before,
.nx108-item-card::before,
.nx108-confirm-card::before {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(255, 215, 119, 0.16);
  border-radius: 14px 4px 14px 4px;
  pointer-events: none;
}

.nx108-title small,
.nx108-panel-header small,
.nx108-confirm-card > small,
.nx108-item-card small {
  color: var(--nx108-blue);
  font-weight: 800;
  letter-spacing: 0.2em;
}

.nx108-title h2,
.nx108-panel-header h2,
.nx108-confirm-card h2,
.nx108-item-card h2 {
  margin: 0.18em 0;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  text-shadow: 0 2px 18px rgba(229, 176, 82, 0.3);
}

.nx108-primary,
.nx108-flow-card button,
.nx108-tabs button,
.nx108-forge-tabs button,
.nx108-pagination button,
.nx108-interaction button,
.nx108-confirm-card button {
  border: 1px solid rgba(239, 201, 128, 0.5);
  border-radius: 9px 3px 9px 3px;
  background: linear-gradient(180deg, rgba(148, 94, 37, 0.9), rgba(67, 40, 16, 0.97));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.12), 0 5px 15px rgba(0, 0, 0, 0.28);
  cursor: pointer;
  min-height: 42px;
  transition: border-color 120ms ease, filter 120ms ease, transform 120ms ease;
}

.nx108-root button:hover:not(:disabled),
.nx108-root button:focus-visible {
  border-color: var(--nx108-gold);
  filter: brightness(1.14);
  outline: none;
}

.nx108-root button:active:not(:disabled) { transform: translateY(1px) scale(0.985); }
.nx108-root button:disabled { cursor: default; filter: grayscale(0.65); opacity: 0.45; }

.nx108-primary {
  padding: 0.65rem 1.65rem;
  color: #fff8e8 !important;
  font-weight: 800 !important;
  border-color: rgba(255, 220, 151, .68) !important;
  background: linear-gradient(180deg, #b57a31, #704418 62%, #4c2c0f) !important;
}

.nx108-close {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  min-height: 0 !important;
  padding: 0;
  border: 1px solid rgba(239, 202, 132, 0.48) !important;
  border-radius: 50% !important;
  background: rgba(39, 25, 12, 0.84) !important;
  font-size: 1.8rem !important;
  line-height: 1;
}

/* Tạo/chọn đúng một nhân vật. */
.nx108-character-flow {
  background:
    linear-gradient(rgba(0, 11, 22, 0.4), rgba(0, 8, 16, 0.82)),
    radial-gradient(circle at 50% 30%, rgba(37, 171, 216, 0.24), transparent 48%),
    #061523;
}

.nx108-flow-card {
  width: min(720px, 94vw);
  max-height: 92vh;
  padding: clamp(22px, 4vw, 46px);
  overflow: auto;
}

.nx108-title { text-align: center; }
.nx108-title h2 { font-size: clamp(1.75rem, 4vw, 2.7rem); }
.nx108-title p { margin: 0.35rem 0 1.35rem; color: var(--nx108-muted); }

.nx108-flow-status {
  display: grid;
  justify-items: center;
  gap: 12px;
  max-width: 540px;
  margin: 12px auto 18px;
  padding: 15px 18px;
  border: 1px solid rgba(115, 211, 255, 0.32);
  border-radius: 12px;
  background: rgba(2, 19, 33, 0.72);
  text-align: center;
}
.nx108-flow-status p { margin: 0; color: #cfefff; }
.nx108-flow-status.is-error { border-color: rgba(255, 123, 134, 0.58); }
.nx108-flow-status.is-error p { color: var(--nx108-danger); }
.nx108-flow-status button { min-width: 150px; }

.nx108-create {
  display: grid;
  gap: 10px;
  max-width: 520px;
  margin: 0 auto;
}

.nx108-model-preview {
  position: relative;
  display: grid;
  place-items: center;
  height: clamp(180px, 34vh, 340px);
  margin: 2px 0 14px;
  border: 1px solid rgba(115, 211, 255, 0.32);
  border-radius: 50% 50% 18px 18px;
  background: radial-gradient(ellipse at center 65%, rgba(48, 187, 231, 0.25), transparent 56%);
  overflow: hidden;
}

.nx108-model-preview::after {
  content: "";
  position: absolute;
  left: 14%;
  right: 14%;
  bottom: 11%;
  height: 16px;
  border: 2px solid rgba(68, 216, 255, 0.66);
  border-radius: 50%;
  box-shadow: 0 0 24px var(--nx108-blue);
}

.nx108-model-preview img {
  width: min(78%, 280px);
  height: 90%;
  object-fit: contain;
  filter: drop-shadow(0 18px 16px rgba(0, 0, 0, 0.62));
}

.nx108-model-preview span {
  position: absolute;
  bottom: 6px;
  z-index: 1;
  color: var(--nx108-gold);
  font-family: Georgia, serif;
  font-weight: 800;
}

.nx108-create label { color: #cfefff; font-weight: 700; }
.nx108-name-row { display: grid; grid-template-columns: 1fr auto; align-items: center; }
.nx108-name-row input {
  width: 100%;
  min-height: 48px;
  padding: 0 5.6rem 0 1rem;
  border: 1px solid rgba(115, 211, 255, 0.46);
  border-radius: 10px;
  outline: none;
  background: rgba(1, 13, 25, 0.8);
}
.nx108-name-row input:focus { border-color: var(--nx108-gold); box-shadow: 0 0 0 3px rgba(255, 215, 119, 0.12); }
.nx108-name-row output { margin-left: -4.7rem; color: var(--nx108-muted); pointer-events: none; }
.nx108-message { min-height: 1.4em; margin: 0; color: #96eeb5; }
.nx108-message.is-error { color: var(--nx108-danger); }

.nx108-character-list { display: grid; gap: 12px; margin: 18px 0; }
.nx108-character-choice {
  display: grid !important;
  grid-template-columns: 92px 1fr;
  align-items: center;
  width: 100%;
  min-height: 106px !important;
  padding: 8px 18px 8px 8px;
  text-align: left;
}
.nx108-character-choice img { width: 88px; height: 88px; border-radius: 50%; object-fit: cover; border: 2px solid #58cfff; }
.nx108-character-choice span { display: grid; gap: 4px; padding-left: 14px; }
.nx108-character-choice strong { font-family: Georgia, serif; font-size: 1.45rem; }
.nx108-character-choice small { color: var(--nx108-gold); letter-spacing: 0.08em; }
.nx108-character-choice.is-selected { border-color: var(--nx108-gold); box-shadow: 0 0 22px rgba(255, 215, 119, 0.22), inset 0 0 25px rgba(41, 150, 198, 0.16); }
.nx108-flow-actions { display: flex; justify-content: center; margin-top: 16px; }

/* Legacy panel rules; the modular 1.0.11 layout below replaces this presentation. */
.nx108-panel {
  width: min(1180px, 96vw);
  max-height: 93vh;
}

.nx108-panel-header {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 76px;
  padding: 12px 18px 12px 26px;
  border-bottom: 1px solid rgba(121, 214, 255, 0.28);
  background: linear-gradient(90deg, rgba(21, 76, 111, 0.55), transparent 72%);
}
.nx108-panel-header h2 { font-size: clamp(1.35rem, 3vw, 2rem); }
.nx108-panel-header span { color: var(--nx108-gold); font-weight: 800; letter-spacing: 0.1em; }

.nx108-two-pane {
  display: grid;
  grid-template-columns: minmax(330px, 0.82fr) minmax(440px, 1.18fr);
  min-height: 540px;
  max-height: calc(93vh - 76px);
}
.nx108-two-pane.is-read-only { grid-template-columns: minmax(330px, 520px); justify-content: center; }

.nx108-paperdoll-pane,
.nx108-bag-pane { min-width: 0; padding: 16px; }
.nx108-paperdoll-pane { border-right: 1px solid rgba(121, 214, 255, 0.2); overflow: auto; }
.nx108-bag-pane { overflow: auto; }

.nx108-paperdoll {
  position: relative;
  min-height: 360px;
  border: 1px solid rgba(121, 214, 255, 0.2);
  border-radius: 50% 50% 16px 16px;
  background:
    radial-gradient(ellipse at 50% 69%, rgba(40, 188, 232, 0.22), transparent 48%),
    linear-gradient(180deg, rgba(12, 41, 65, 0.2), rgba(0, 9, 18, 0.56));
  overflow: hidden;
}

.nx108-paperdoll::after {
  content: "";
  position: absolute;
  left: 22%;
  right: 22%;
  bottom: 6%;
  height: 18px;
  border: 2px solid rgba(67, 216, 255, 0.6);
  border-radius: 50%;
  box-shadow: 0 0 22px rgba(67, 216, 255, 0.62);
}

.nx108-paperdoll > img {
  position: absolute;
  inset: 7% 21% 10%;
  z-index: 1;
  width: 58%;
  height: 83%;
  object-fit: contain;
  filter: drop-shadow(0 13px 12px rgba(0, 0, 0, 0.7));
}

.nx108-equip-slot,
.nx108-inventory-cell {
  position: relative;
  display: grid;
  place-items: center;
  padding: 4px;
  border: 1px solid rgba(137, 194, 220, 0.35);
  background:
    linear-gradient(145deg, rgba(16, 51, 75, 0.8), rgba(2, 13, 24, 0.96)),
    #071523;
  box-shadow: inset 0 0 0 2px rgba(202, 231, 244, 0.04), 0 4px 12px rgba(0, 0, 0, 0.38);
}

.nx108-equip-slot {
  position: absolute;
  z-index: 3;
  width: 68px;
  height: 68px;
  min-height: 0 !important;
  border-radius: 12px 3px 12px 3px;
}
.nx108-equip-slot img,
.nx108-inventory-cell img { width: 92%; height: 92%; object-fit: contain; filter: drop-shadow(0 3px 4px rgba(0,0,0,.7)); }
/* Weapon product art stays diagonal in UI through presentation CSS. The PNG
   itself remains untouched, so a later icon replacement needs no re-export. */
.nx108-weapon-icon {
  transform: rotate(var(--nx108-weapon-icon-rotation, -45deg)) scale(.94);
  transform-origin: center;
}
.nx108-equip-slot span { color: #7893a7; font-size: 0.68rem; }
.nx108-equip-slot b,
.nx108-equip-slot small,
.nx108-inventory-cell b,
.nx108-inventory-cell small {
  position: absolute;
  right: 4px;
  bottom: 2px;
  padding: 1px 4px;
  border-radius: 4px;
  color: #fff;
  background: rgba(0, 9, 19, 0.86);
  font-size: 0.67rem;
}
.nx108-equip-slot small,
.nx108-inventory-cell small { left: 3px; right: auto; }
.nx108-equip-slot .nx108-enhancement-badge,
.nx108-inventory-cell .nx108-enhancement-badge { right: 3px; left: auto; }

.nx108-equip-slot--weapon { left: 4%; top: 8%; }
.nx108-equip-slot--helmet { right: 4%; top: 5%; }
.nx108-equip-slot--armor { right: 3%; top: 29%; }
.nx108-equip-slot--pants { left: 3%; top: 34%; }
.nx108-equip-slot--shoes { right: 4%; top: 56%; }
.nx108-equip-slot--necklace { left: 4%; top: 61%; }
.nx108-equip-slot--ring { right: 15%; top: 77%; }

.rarity-white { --rarity: #dce8ef; }
.rarity-green { --rarity: var(--nx108-green); }
.rarity-purple { --rarity: var(--nx108-purple); }
.rarity-gold { --rarity: var(--nx108-gold); }
.nx108-equip-slot.is-equipped,
.nx108-inventory-cell.has-item { border-color: var(--rarity, rgba(137, 194, 220, 0.52)); box-shadow: inset 0 0 12px color-mix(in srgb, var(--rarity, #69cfff) 18%, transparent), 0 4px 12px rgba(0, 0, 0, 0.38); }

.nx108-character-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px 14px;
  margin-top: 12px;
}
.nx108-character-stats p { display: flex; justify-content: space-between; gap: 10px; margin: 0; padding: 7px 10px; border-bottom: 1px solid rgba(121, 214, 255, 0.16); color: var(--nx108-muted); }
.nx108-character-stats strong { color: var(--nx108-ink); }
.nx108-character-stats .nx108-set-bonus { grid-column: 1 / -1; display: block; border: 1px solid rgba(192, 120, 255, .28); border-radius: 7px; background: rgba(90, 31, 127, .16); color: #ddb8ff; font-size: .76rem; }

.nx108-bag-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.nx108-bag-heading h3,
.nx108-forge-layout h3 { margin: 0; color: var(--nx108-gold); font-family: Georgia, serif; letter-spacing: 0.1em; }
.nx108-tabs,
.nx108-forge-tabs { display: flex; gap: 5px; }
.nx108-tabs button,
.nx108-forge-tabs button { min-height: 34px; padding: 4px 12px; }
.nx108-tabs button.is-active,
.nx108-forge-tabs button.is-active { color: #fff; border-color: var(--nx108-gold); background: linear-gradient(180deg, rgba(125, 92, 28, .9), rgba(49, 33, 7, .96)); }

.nx108-inventory-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(52px, 1fr));
  gap: 8px;
}
.nx108-inventory-cell { width: 100%; aspect-ratio: 1; min-height: 0 !important; border-radius: 9px 2px 9px 2px; }
.nx108-inventory-cell.is-empty { opacity: 0.62; }
.nx108-pagination { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 12px; }
.nx108-pagination button { min-width: 40px; min-height: 34px; }
.nx108-pagination span { color: #cdeeff; font-weight: 700; }

/* Chi tiết vật phẩm. */
#nx108ItemDetail {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 10px max(10px, env(safe-area-inset-right)) 10px 10px;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  pointer-events: none;
}

.nx108-item-card {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  gap: 10px;
  width: min(390px, calc(100vw - 20px));
  max-height: calc(100vh - 20px);
  padding: 13px;
  border-radius: 12px 5px 12px 5px;
  overflow-x: hidden;
  overflow-y: auto;
  pointer-events: auto;
}
.nx108-item-card > .nx108-close { position: absolute; top: 7px; right: 7px; z-index: 2; width: 29px; height: 29px; font-size: 1.15rem !important; }
.nx108-item-visual { display: grid; align-content: start; gap: 7px; min-width: 0; margin-top: 17px; }
.nx108-item-icon-frame { display: grid; place-items: center; width: 88px; height: 88px; justify-self: center; border: 1px solid rgba(121, 214, 255, .3); border-radius: 8px; background: rgba(0, 9, 19, .72); overflow: hidden; }
.nx108-item-icon-frame > img { width: 88%; height: 88%; object-fit: contain; border: 0; border-radius: 0; background: transparent; }
.nx108-item-set-effects { display: grid; gap: 4px; min-width: 0; padding: 6px; border: 1px solid rgba(101, 194, 221, .24); border-radius: 6px; background: rgba(3, 23, 36, .64); }
.nx108-set-effect-block { display: grid; gap: 1px; min-width: 0; padding: 3px 0; color: #777; font-size: .62rem; line-height: 1.28; overflow-wrap: anywhere; }
.nx108-set-effect-block + .nx108-set-effect-block { border-top: 1px solid rgba(225, 184, 80, .14); }
.nx108-set-effect-block strong,
.nx108-set-effect-block span { display: block; min-width: 0; color: inherit; }
.nx108-set-effect-block strong { margin-bottom: 1px; font-size: .64rem; }
.nx108-set-effect-block.is-active { color: var(--nx108-green); }
.nx108-item-content { min-width: 0; }
.nx108-item-card h2 { margin: 2px 32px 3px 0; padding: 0; font-family: "Noto Sans", "Segoe UI", Arial, sans-serif; font-size: 1rem; line-height: 1.25; text-shadow: none; overflow-wrap: anywhere; }
.nx108-item-card #nx108ItemKind { font-size: 0.57rem; letter-spacing: 0.12em; }
.nx108-item-card #nx108ItemRarity { display: block; font-size: 0.7rem; }
.nx108-item-stats { margin: 8px 0; padding: 6px 0; border-block: 1px solid rgba(121, 214, 255, .18); }
.nx108-item-stats p { margin: 3px 0; color: #cceafb; font-size: 0.7rem; line-height: 1.35; }
.nx108-item-stats .nx108-enhancement-line { color: var(--nx108-gold); }
.nx108-item-stats .nx108-gem-line { color: #d8abff; }

.nx108-item-set { margin: 7px 0; padding: 7px; border: 1px solid rgba(101, 194, 221, 0.24); border-radius: 6px; background: rgba(3, 23, 36, 0.64); }
.nx108-item-set > strong { display: block; color: #d9eef5; font-size: 0.72rem; }

.nx108-item-future { margin: 7px 0; padding-top: 7px; border-top: 1px solid rgba(121, 214, 255, .16); }
.nx108-item-future p { margin: 0; color: #d6b6f2; font-size: 0.68rem; line-height: 1.35; }

.nx108-item-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; margin-top: 8px; }
.nx108-item-actions button { min-height: 31px; padding: 4px 5px; border: 1px solid rgba(94, 183, 211, 0.35); border-radius: 6px; background: rgba(4, 29, 44, 0.88); box-shadow: none; color: #dceef4; font-size: 0.68rem; cursor: pointer; }
.nx108-item-actions .nx108-primary { min-height: 31px; padding: 4px 5px; }

.nx108-socket-row { display: flex; flex-wrap: wrap; gap: 8px; min-height: 32px; margin: 10px 0 16px; }
.nx108-socket {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid #e1b850;
  border-radius: 3px;
  color: #e9c866;
  background: #020608;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, .9), 0 0 4px rgba(225, 184, 80, .2);
  font-style: normal;
}
.nx108-socket.is-filled { cursor: pointer; touch-action: manipulation; }

/* 1.0.23: mọi lỗ khảm dùng cùng một ô vuông nền đen, viền vàng. */
.nx108-socket,
.nx108-socket.is-open,
.nx108-socket.is-locked,
.nx108-socket.is-pending,
.nx108-socket.is-filled {
  border: 1px solid #e1b850;
  border-radius: 3px;
  color: #e9c866;
  background: #020608;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, .9), 0 0 4px rgba(225, 184, 80, .2);
}

#nx108ItemDetail .nx108-socket-row { gap: 5px; min-height: 0; margin: 7px 0; }
#nx108ItemDetail .nx108-socket {
  width: 29px;
  height: 29px;
  border: 1px solid #d8aa44;
  border-radius: 3px;
  background: #020608;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, .9);
}
#nx108ItemDetail .nx108-socket.is-open,
#nx108ItemDetail .nx108-socket.is-filled { border-color: #e1b850; background: #020608; box-shadow: inset 0 0 5px rgba(0, 0, 0, .9), 0 0 4px rgba(225, 184, 80, .2); }
#nx108ItemDetail .nx108-socket img { width: 23px; height: 23px; object-fit: contain; }

/* Thợ rèn: cơ chế cường hóa và khảm đá. */
.nx108-forge-panel { position: relative; width: min(980px, 95vw); }
.nx108-forge-header { min-height: 90px; padding-block: 9px; }
.nx108-forge-heading { display: grid; gap: 6px; min-width: 0; }
.nx108-forge-heading > small { color: var(--nx108-gold); }
.nx108-forge-tabs { flex-wrap: wrap; padding: 0; }
.nx108-forge-tabs button { min-width: 150px; }
.nx108-forge-layout { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(360px, 1.15fr); gap: 22px; padding: 10px 22px 18px; max-height: none; overflow: hidden; }
.nx108-forge-stage { display: flex; flex-direction: column; align-items: center; min-height: 0; padding: 16px 18px; border: 1px solid rgba(121, 214, 255, .2); border-radius: 16px; background: radial-gradient(circle at 50% 28%, rgba(139, 65, 201, .24), transparent 44%), rgba(0, 9, 18, .48); text-align: center; }
.nx108-forge-slot { display: grid; place-items: center; width: 128px; height: 128px; padding: 8px; border: 2px solid rgba(190, 124, 255, .58); border-radius: 18px 5px 18px 5px; background: rgba(5, 14, 27, .84); box-shadow: 0 0 28px rgba(163, 73, 230, .2), inset 0 0 24px rgba(45, 173, 223, .14); color: var(--nx108-muted); }
.nx108-forge-slot img { width: 96px; height: 96px; object-fit: contain; }
.nx108-forge-selected-name { display: block; width: min(240px, 100%); min-height: 1.25em; margin: 8px 0 0; color: #ead9ba; font-size: .78rem; line-height: 1.25; overflow-wrap: anywhere; }
.nx108-forge-selected-name[hidden] { display: none; }
.nx108-forge-slot.has-item { cursor: pointer; touch-action: manipulation; }
.nx108-forge-panel[aria-busy="true"] .nx108-forge-layout { opacity: .72; }
.nx108-five-sockets { justify-content: center; }
.nx108-forge-stage > .nx108-socket-row { justify-content: center; min-height: 0; margin: 10px 0 2px; }
.nx108-forge-stage > .nx108-socket-row[hidden] { display: none; }
.nx108-forge-stage .nx108-socket { overflow: hidden; }
.nx108-forge-stage .nx108-socket img { display: block; width: 88%; height: 88%; max-width: 28px; max-height: 28px; object-fit: contain; }
.nx108-forge-stage > p { width: 100%; margin: 16px 0 10px; color: #cde9f8; line-height: 1.45; }
.nx108-forge-stage > .nx108-primary { margin-top: 4px; }
.nx108-forge-stage > .nx108-message { min-height: 2.9em; margin: 10px 0 0; }
.nx108-forge-gems { display: grid; width: 100%; gap: 7px; margin: 6px 0 13px; }
.nx108-gem-choice { display: grid; grid-template-columns: 42px 1fr; align-items: center; min-height: 48px; padding: 4px 10px; border: 1px solid rgba(121, 214, 255, .3); border-radius: 9px; background: rgba(3, 19, 32, .82); text-align: left; }
.nx108-gem-choice img { width: 38px; height: 38px; object-fit: contain; }
.nx108-forge-grid { grid-template-columns: repeat(5, minmax(48px, 1fr)); grid-auto-rows: max-content; gap: 10px; margin-top: 8px; align-content: start; }
.nx108-forge-grid .nx108-inventory-cell.is-reference { cursor: default; }
.nx108-forge-item-menu {
  position: absolute;
  z-index: 12;
  top: 50%;
  left: 50%;
  display: grid;
  gap: 14px;
  width: min(340px, calc(100% - 28px));
  padding: 20px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(240, 198, 116, .62);
  border-radius: 13px 5px;
  background: linear-gradient(155deg, rgba(62, 42, 21, .99), rgba(22, 15, 8, .995));
  box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .62), 0 18px 48px rgba(0, 0, 0, .72);
  text-align: center;
}
.nx108-forge-item-menu[hidden] { display: none; }
.nx108-forge-item-menu > strong { color: #f6dfb2; font-family: Georgia, serif; font-size: 1.05rem; overflow-wrap: anywhere; }
.nx108-forge-item-menu > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.nx108-forge-item-menu button { min-width: 0; min-height: 40px; }
.nx108-forge-item-menu button[hidden] { display: none; }

/* Chỉ Kho cường hóa/khảm cuộn; khung thao tác, tab và nút chính luôn đứng yên. */
.nx108-forge-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: min(700px, calc(100dvh - 16px));
  max-height: calc(100dvh - 16px);
  overflow: hidden;
}
.nx108-forge-layout { min-height: 0; overflow: hidden; }
.nx108-forge-inventory-pane {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
.nx108-forge-grid {
  min-height: 0;
  padding-right: 4px;
  overflow-x: hidden;
  overflow-y: auto;
  overflow-y: scroll;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(214, 159, 67, .72) rgba(26, 17, 8, .76);
}

/* Cửa hàng Trang sức: catalog cố định, số vàng và kết quả mua do server trả. */
.nx108-jewelry-panel { width: min(780px, 94vw); }
.nx108-jewelry-body { padding: 18px 22px 24px; }
.nx108-jewelry-balance { margin: 0 0 14px; color: #d7edf7; text-align: right; }
.nx108-jewelry-balance strong { color: var(--nx108-gold); }
.nx108-jewelry-products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.nx108-jewelry-product { display: grid; grid-template-columns: 82px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 108px; padding: 12px; border: 1px solid rgba(255, 215, 119, .34); border-radius: 13px 4px 13px 4px; background: linear-gradient(145deg, rgba(46, 34, 18, .92), rgba(4, 20, 31, .96)); color: #eef9ff; text-align: left; }
.nx108-jewelry-product img { width: 76px; height: 76px; object-fit: contain; }
.nx108-jewelry-details { display: grid; gap: 6px; }
.nx108-jewelry-details strong { font-family: Georgia, serif; font-size: 1rem; }
.nx108-jewelry-details em { color: var(--nx108-gold); font-size: .72rem; font-style: normal; font-weight: 900; letter-spacing: .12em; }
.nx108-jewelry-details b { color: #ffe19a; }
.nx108-jewelry-product:disabled { cursor: not-allowed; filter: grayscale(.45); opacity: .55; }

/* Nhà Đá/Ghép đá: catalog và kết quả ghép đều do server quyết định. */
.nx108-gem-shop-panel { width: min(1040px, 96vw); }
.nx108-gem-shop-body { max-height: 78vh; padding: 18px 22px 24px; overflow: auto; }
.nx108-gem-shop-balance { margin: 0 0 14px; color: #d7edf7; text-align: right; }
.nx108-gem-shop-balance strong { color: var(--nx108-gold); }
.nx108-gem-shop-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr); gap: 18px; }
.nx108-gem-shop-layout > section { padding: 14px; border: 1px solid rgba(164, 105, 237, .28); border-radius: 14px; background: rgba(5, 15, 28, .76); }
.nx108-gem-shop-layout h3 { margin: 0 0 5px; color: #e4c5ff; font-family: Georgia, serif; }
.nx108-gem-shop-layout section > p { margin: 0 0 12px; color: #bcd4df; font-size: .8rem; }
.nx108-gem-shop-products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.nx108-gem-shop-product,
.nx108-gem-combine-product { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: center; gap: 9px; min-height: 62px; padding: 7px 9px; border: 1px solid rgba(168, 110, 229, .35); border-radius: 10px 4px; color: #eff8ff; background: linear-gradient(145deg, rgba(38, 20, 54, .9), rgba(4, 19, 30, .96)); text-align: left; }
.nx108-gem-shop-product img,
.nx108-gem-combine-product img { width: 44px; height: 44px; object-fit: contain; }
.nx108-gem-shop-product span,
.nx108-gem-combine-product span { display: grid; gap: 4px; }
.nx108-gem-shop-product strong,
.nx108-gem-combine-product strong { font-size: .82rem; }
.nx108-gem-shop-product b { color: #ffe19a; font-size: .76rem; }
.nx108-gem-combine-product b { color: #d5aaff; font-size: .72rem; }
.nx108-gem-combine-products { display: grid; gap: 8px; }
.nx108-gem-combine-empty { padding: 16px; border: 1px dashed rgba(190, 150, 225, .3); border-radius: 9px; color: #9cb4c1; text-align: center; }
.nx108-gem-shop-product:disabled,
.nx108-gem-combine-product:disabled { cursor: not-allowed; filter: grayscale(.5); opacity: .5; }

/* Cửa hàng Phép và Nhà Yểm phép: mọi giao dịch chỉ chạy khi người chơi bấm. */
.nx108-spell-shop-panel { width: min(760px, 94vw); }
.nx108-spell-shop-body,
.nx108-enchant-body { max-height: 78vh; padding: 18px 22px 24px; overflow: auto; }
.nx108-spell-shop-balance { margin: 0 0 14px; color: #d7edf7; text-align: right; }
.nx108-spell-shop-balance strong { color: var(--nx108-gold); }
.nx108-spell-shop-products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.nx108-spell-shop-product { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 108px; padding: 12px; border: 1px solid rgba(183, 219, 151, .34); border-radius: 13px 4px; background: linear-gradient(145deg, rgba(34, 50, 27, .92), rgba(5, 18, 31, .96)); color: #eef9ff; text-align: left; }
.nx108-spell-shop-product img { width: 70px; height: 70px; object-fit: contain; }
.nx108-spell-shop-product span { display: grid; gap: 5px; }
.nx108-spell-shop-product small { color: #bad2bd; line-height: 1.25; }
.nx108-spell-shop-product b { color: #ffe19a; }
.nx108-spell-shop-product:disabled { cursor: not-allowed; filter: grayscale(.45); opacity: .55; }

.nx108-enchant-panel { width: min(960px, 96vw); }
.nx108-enchant-rule { margin: 0 0 14px; color: #d7edf7; }
.nx108-enchant-rule strong { color: #d8adff; }
.nx108-enchant-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(250px, .75fr); gap: 16px; }
.nx108-enchant-layout > section { padding: 13px; border: 1px solid rgba(190, 129, 255, .25); border-radius: 12px; background: rgba(5, 15, 28, .72); }
.nx108-enchant-layout h3 { margin: 0 0 10px; color: #e4c5ff; font-size: .82rem; letter-spacing: .08em; }
.nx108-enchant-items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-height: 310px; overflow: auto; }
.nx108-enchant-scrolls { display: grid; gap: 9px; }
.nx108-enchant-item,
.nx108-enchant-scroll { display: grid; grid-template-columns: 52px minmax(0, 1fr); align-items: center; gap: 9px; min-height: 68px; padding: 8px; border: 1px solid rgba(156, 202, 219, .25); border-radius: 9px; color: #eff8ff; background: rgba(4, 21, 33, .9); text-align: left; }
.nx108-enchant-item img,
.nx108-enchant-scroll img { width: 48px; height: 48px; object-fit: contain; }
.nx108-enchant-item span,
.nx108-enchant-scroll span { display: grid; gap: 4px; }
.nx108-enchant-item small,
.nx108-enchant-scroll small { color: #a9c4d0; }
.nx108-enchant-item.is-selected,
.nx108-enchant-scroll.is-selected { border-color: #c67cff; box-shadow: inset 0 0 15px rgba(160, 65, 216, .24), 0 0 10px rgba(160, 65, 216, .18); }
.nx108-enchant-item:disabled,
.nx108-enchant-scroll:disabled { cursor: not-allowed; opacity: .5; }
.nx108-enchant-empty { grid-column: 1 / -1; padding: 20px; border: 1px dashed rgba(190, 150, 225, .3); border-radius: 9px; color: #9cb4c1; text-align: center; }
.nx108-enchant-summary { min-height: 22px; margin: 14px 0 10px; color: #dceff5; }
.nx108-enchant-body > .nx108-primary { width: 100%; }
.nx108-enchant-line { color: #dfb5ff !important; }

.nx108-guild-panel { width: min(760px, 94vw); }
.nx108-guild-body { display: grid; gap: 16px; max-height: 76vh; padding: 18px 22px 24px; overflow: auto; }
.nx108-guild-shop { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 13px; border: 1px solid rgba(255, 211, 111, .34); border-radius: 14px 5px; background: linear-gradient(145deg, rgba(55, 35, 18, .94), rgba(10, 24, 30, .96)); }
.nx108-guild-shop img { width: 70px; height: 70px; object-fit: contain; }
.nx108-guild-shop div { display: grid; gap: 4px; }
.nx108-guild-shop strong { color: #ffe09a; font-family: Georgia, serif; font-size: 1.05rem; }
.nx108-guild-shop span { color: #d7edf7; font-size: .84rem; }
.nx108-guild-shop b { color: var(--nx108-gold); }
.nx108-guild-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.nx108-guild-actions form { display: grid; gap: 8px; padding: 12px; border: 1px solid rgba(143, 210, 222, .23); border-radius: 10px; background: rgba(4, 19, 29, .7); }
.nx108-guild-actions label { color: #dff8ff; font-weight: 800; }
.nx108-guild-actions form div { display: flex; gap: 8px; }
.nx108-guild-actions input { min-width: 0; flex: 1; padding: 10px; border: 1px solid rgba(183, 229, 238, .28); border-radius: 8px; color: #f4fbff; background: rgba(0, 10, 16, .7); }
.nx108-guild-actions button, .nx108-guild-current > button { min-height: 40px; padding: 0 14px; border: 1px solid rgba(255, 211, 111, .3); border-radius: 8px; color: #fff3d3; background: rgba(87, 50, 28, .84); }
.nx108-guild-current { padding: 14px; border: 1px solid rgba(196, 151, 255, .3); border-radius: 12px; background: rgba(30, 16, 38, .76); }
.nx108-guild-current h3 { margin: 3px 0; color: #ebc8ff; font-family: Georgia, serif; font-size: 1.35rem; }
.nx108-guild-current p { margin: 0 0 10px; color: var(--nx108-gold); }
.nx108-guild-current ul { display: grid; gap: 6px; max-height: 190px; margin: 0 0 12px; padding: 0; overflow: auto; list-style: none; }
.nx108-guild-current li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 9px; border-radius: 7px; background: rgba(255,255,255,.055); }
.nx108-guild-current li small { color: #cbb4d6; }
.nx108-guild-panel button:disabled { cursor: not-allowed; opacity: .5; }

/* Popup người chơi và solo. */
.nx108-interaction {
  position: fixed;
  z-index: 975;
  display: grid;
  width: 210px;
  padding: 14px;
  gap: 7px;
  transform: translate(-50%, -50%);
}
.nx108-interaction strong { padding: 6px 4px 10px; color: var(--nx108-gold); text-align: center; }
.nx108-interaction button { min-height: 38px; }
.nx108-confirm-card { width: min(500px, 90vw); padding: 34px; text-align: center; }
.nx108-confirm-card > div { display: flex; justify-content: center; gap: 12px; margin-top: 20px; }
.nx108-confirm-card button { min-width: 130px; padding: 7px 18px; }

.nx108-countdown {
  position: fixed;
  inset: 0;
  z-index: 990;
  display: grid;
  place-content: center;
  pointer-events: none;
  color: #fff;
  text-align: center;
  text-shadow: 0 4px 22px #000, 0 0 32px #19c8ff;
}
.nx108-countdown small { color: var(--nx108-gold); font-weight: 900; letter-spacing: .18em; }
.nx108-countdown strong { font-family: Georgia, serif; font-size: clamp(4rem, 17vw, 10rem); animation: nx108-count-pulse 1s ease infinite; }
@keyframes nx108-count-pulse { 50% { transform: scale(.86); opacity: .78; } }

.nx108-combat-result-text {
  position: fixed;
  z-index: 995;
  top: max(calc(env(safe-area-inset-top) + 18px), 7vh);
  left: 50%;
  display: block;
  width: min(94vw, 900px);
  margin: 0;
  padding: 0;
  transform: translateX(-50%);
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #ffd777;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 7vw, 4.5rem);
  font-weight: 900;
  line-height: .94;
  letter-spacing: .075em;
  text-align: center;
  text-shadow: 0 5px 12px rgba(0, 0, 0, .96), 0 0 24px rgba(255, 210, 99, .82);
  pointer-events: none;
  user-select: none;
}

.nx108-combat-result-text.is-win {
  color: #82f5a4;
  text-shadow: 0 5px 12px rgba(0, 0, 0, .96), 0 0 28px rgba(61, 238, 116, .88);
}

.nx108-combat-result-text.is-loss {
  color: #ff8790;
  text-shadow: 0 5px 12px rgba(0, 0, 0, .96), 0 0 28px rgba(255, 63, 81, .88);
}

.nx108-combat-result-text.is-draw {
  color: #ffd777;
}

.nx108-toast {
  position: fixed;
  left: 50%;
  bottom: max(28px, env(safe-area-inset-bottom));
  z-index: 999;
  max-width: min(620px, 88vw);
  padding: 12px 22px;
  transform: translateX(-50%);
  border: 1px solid rgba(121, 214, 255, .6);
  border-radius: 12px;
  background: rgba(2, 17, 29, .94);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .55);
  color: #e9f9ff;
  text-align: center;
}

/* Các nút/overlay đã có trong index.html. */
#hudAvatarButton.hud-avatar-frame {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  touch-action: manipulation;
  pointer-events: auto;
}
#hudAvatarButton.hud-avatar-frame:focus-visible { filter: drop-shadow(0 0 9px #7de1ff); }

#bagButton.bag-button,
.nexoria-bag-button {
  cursor: pointer;
  touch-action: manipulation;
}
#bagButton.bag-button svg { fill: none; stroke: #f4fbfd; stroke-width: 2.35; stroke-linecap: round; stroke-linejoin: round; filter: none; }
#bagButton.bag-button:focus-visible { outline: 1px solid rgba(213, 246, 255, .92); outline-offset: 2px; }
.nx108-bag-glyph { color: #f4fbfd; text-shadow: none; }

/* Every MAP4 house inherits Tạp Hóa's existing .black-market-prompt:
   fixed bottom-center placement, purple title, frame and action colors. */
.map4-service-prompt { max-width: calc(100vw - 24px); }
.map4-service-prompt > div { display: flex; flex-wrap: wrap; gap: 7px; }
.map4-service-prompt > div > button { flex: 1 1 auto; }

@media (max-width: 640px) {
  .nx108-jewelry-products { grid-template-columns: 1fr; }
  .nx108-jewelry-body { max-height: 76vh; overflow: auto; }
  .nx108-gem-shop-layout { grid-template-columns: 1fr; }
  .nx108-gem-shop-products { grid-template-columns: 1fr; }
  .nx108-spell-shop-products,
  .nx108-enchant-layout,
  .nx108-enchant-items { grid-template-columns: 1fr; }
  .nx108-guild-shop { grid-template-columns: 58px minmax(0, 1fr); }
  .nx108-guild-shop img { width: 54px; height: 54px; }
  .nx108-guild-shop > button { grid-column: 1 / -1; }
  .nx108-guild-actions { grid-template-columns: 1fr; }
}

/* Tên + HP của người chơi/quái trong thế giới. */
.overhead-layer,
.loot-flight-layer {
  position: absolute;
  inset: 0;
  z-index: 22;
  overflow: hidden;
  pointer-events: none;
}
.loot-flight-layer { z-index: 24; }

.world-nameplate,
.monster-nameplate {
  position: absolute;
  left: 0;
  top: 0;
  display: grid;
  width: clamp(92px, 8.5vw, 150px);
  min-height: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  font: 700 clamp(9px, .78vw, 13px)/1.15 "Segoe UI", sans-serif;
  text-align: center;
  text-shadow: 0 2px 3px #000, 0 0 5px #000;
  pointer-events: none;
  will-change: transform;
}
.monster-nameplate,
.world-nameplate.is-interactable { pointer-events: auto; }
.world-nameplate.is-local { pointer-events: none; }
.world-nameplate.is-interactable {
  cursor: pointer;
  touch-action: none;
}
.world-nameplate.is-interactable::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: clamp(64px, 8vh, 92px);
  height: clamp(72px, 16vh, 118px);
  transform: translateX(-50%);
  background: transparent;
}
.world-nameplate-name,
.monster-nameplate > b { overflow: hidden; padding: 1px 3px 3px; white-space: nowrap; text-overflow: ellipsis; }
.world-nameplate-badge {
  display: block;
  justify-self: center;
  width: clamp(46px, 4.2vw, 72px);
  aspect-ratio: 1070 / 510;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .82));
  pointer-events: none;
}
.world-nameplate-badge[hidden] { display: none; }
.world-nameplate-hp,
.monster-nameplate > span {
  display: block;
  width: 100%;
  height: 8px;
  padding: 1px;
  border: 1px solid rgba(222, 240, 250, .7);
  border-radius: 5px;
  background: rgba(6, 10, 15, .88);
  box-shadow: 0 2px 5px rgba(0,0,0,.75);
  overflow: hidden;
}
.world-nameplate-hp i,
.monster-nameplate > span i { display: block; width: 100%; height: 100%; border-radius: 3px; background: linear-gradient(180deg, #ff6370, #bb101f); box-shadow: inset 0 1px rgba(255,255,255,.34); transition: width 160ms linear; }
.world-nameplate-value,
.monster-nameplate > small { margin-top: 1px; color: #f2f7fa; font-size: .78em; }
.world-nameplate.is-local .world-nameplate-name { color: #a7eeff; }

/* 1.0.11: compact player-only nameplate; HP is communicated by the bar, not numbers. */
.world-nameplate {
  width: clamp(84px, 7.6vw, 132px);
  gap: 1px;
  font-size: clamp(9px, 0.72vw, 12px);
  line-height: 1.05;
}
.world-nameplate-name { padding: 0 2px 1px; }
.world-nameplate-hp { height: 7px; }
.world-nameplate-value { display: none !important; }

.monster-nameplate > b { color: #ffd66c; }
.monster-nameplate.is-boss { width: clamp(124px, 11vw, 190px); font-size: clamp(10px, .88vw, 14px); }
.monster-nameplate.is-boss > b { color: #ffd86b; letter-spacing: .05em; text-shadow: 0 1px 5px #5b3100; }
.monster-nameplate.is-boss > span { height: 10px; border-color: #ffbb72; }
.monster-nameplate.is-boss > span i { background: linear-gradient(180deg, #ff5d54, #8e0928); }
.monster-nameplate.is-targeted { filter: none; }
.monster-nameplate.is-targeted::after { display: none; content: none; }
.monster-nameplate.is-defeated > span i { transition: none; }

.loot-flight-item {
  position: absolute;
  left: 0;
  top: 0;
  width: clamp(62px, 6vw, 92px);
  height: clamp(76px, 7.2vw, 108px);
  pointer-events: none;
  will-change: transform, opacity;
}

.loot-rarity-aura {
  position: absolute;
  z-index: 0;
  top: 31%;
  left: 50%;
  width: 72%;
  height: 31%;
  border-radius: 50%;
  background: var(--rarity, #dce8ef);
  filter: blur(8px);
  opacity: .52;
  transform: translate(-50%, -50%);
}

.loot-item-cutout {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 50%;
  width: 72%;
  height: 68%;
  object-fit: contain;
  filter: drop-shadow(0 4px 4px rgba(0, 0, 0, .72));
  transform: translateX(-50%);
}

.loot-item-name {
  position: absolute;
  z-index: 2;
  right: -55%;
  bottom: 0;
  left: -55%;
  overflow: hidden;
  color: var(--rarity, #dce8ef);
  font: 800 clamp(8px, .72vw, 11px)/1.1 "Segoe UI", sans-serif;
  text-align: center;
  text-overflow: ellipsis;
  text-shadow: -1px -1px 0 #02060b, 1px -1px 0 #02060b, -1px 1px 0 #02060b, 1px 1px 0 #02060b, 0 2px 4px #000;
  white-space: nowrap;
}

@media (max-width: 820px), (max-height: 560px) {
  .nx108-layer,
  .nx108-sub-layer { padding: 8px; }
  .nx108-panel { max-height: 98vh; }
  .nx108-panel-header { min-height: 58px; padding: 7px 12px 7px 18px; }
  .nx108-panel-header h2 { margin: 0; font-size: 1.25rem; }
  .nx108-panel-header small { font-size: .62rem; }
  .nx108-close { width: 34px; height: 34px; font-size: 1.35rem !important; }
  .nx108-two-pane { grid-template-columns: minmax(270px, .78fr) minmax(370px, 1.22fr); min-height: 0; max-height: calc(98vh - 58px); }
  .nx108-paperdoll-pane,
  .nx108-bag-pane { padding: 9px; }
  .nx108-paperdoll { min-height: 265px; }
  .nx108-equip-slot { width: 49px; height: 49px; }
  .nx108-character-stats { gap: 2px 8px; margin-top: 5px; font-size: .71rem; }
  .nx108-character-stats p { padding: 3px 5px; }
  .nx108-bag-heading { margin-bottom: 6px; }
  .nx108-bag-heading h3 { font-size: .9rem; }
  .nx108-tabs button { min-height: 28px; padding: 2px 7px; font-size: .68rem; }
  .nx108-inventory-grid { grid-template-columns: repeat(6, minmax(40px, 1fr)); gap: 5px; }
  .nx108-pagination { margin-top: 6px; }
  .nx108-forge-layout { grid-template-columns: minmax(230px, .8fr) minmax(320px, 1.2fr); padding: 9px 12px 14px; gap: 12px; max-height: calc(98vh - 108px); }
  .nx108-forge-stage { padding: 10px; }
  .nx108-forge-slot { width: 92px; height: 92px; }
  .nx108-forge-slot img { width: 58px; height: 58px; }
  .nx108-forge-stage > p { margin: 6px 0; font-size: .75rem; }
  .nx108-gem-choice { min-height: 40px; grid-template-columns: 34px 1fr; font-size: .7rem; }
  .nx108-gem-choice img { width: 31px; height: 31px; }
  .nx108-socket { width: 25px; height: 25px; }
  .nx108-flow-card { padding: 18px; }
  .nx108-model-preview { height: 165px; }
}

@media (orientation: portrait) and (max-width: 680px) {
  .nx108-panel { width: 96vw; overflow: auto; }
  .nx108-two-pane { grid-template-columns: 1fr; max-height: calc(94vh - 64px); overflow: auto; }
  .nx108-paperdoll-pane { border-right: 0; border-bottom: 1px solid rgba(121, 214, 255, .2); }
  .nx108-paperdoll { min-height: 330px; }
  .nx108-inventory-grid { grid-template-columns: repeat(5, minmax(48px, 1fr)); }
  .nx108-forge-layout { grid-template-columns: 1fr; }
  .nx108-item-card { grid-template-columns: 92px minmax(0, 1fr); padding: 11px; }
  .nx108-item-icon-frame { width: 64px; height: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  .nx108-root *,
  .monster-nameplate.is-targeted::after { animation: none !important; transition: none !important; }
}

/* NEXORIA 1.0.11 — character information and inventory are independent, modular panels. */
#nexoriaCharacterPanel {
  padding: min(2.2vh, 18px) min(2vw, 22px);
  background: rgba(1, 9, 17, 0.76);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.nx108-character-workspace {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 12px;
  width: min(1400px, 97vw);
  max-height: 96vh;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(70, 190, 229, 0.6) rgba(3, 15, 25, 0.72);
}

#nexoriaCharacterPanel .nx108-panel {
  width: auto;
  max-height: none;
  border: 1px solid rgba(94, 194, 226, 0.56);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(9, 31, 48, 0.985), rgba(3, 16, 27, 0.99));
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.54), inset 0 0 0 1px rgba(187, 233, 247, 0.035);
  overflow: hidden;
}

#nexoriaCharacterPanel .nx108-panel::before { display: none; }

#nexoriaCharacterPanel .nx108-panel-header {
  min-height: 64px;
  padding: 9px 12px 9px 18px;
  border-bottom: 1px solid rgba(100, 200, 231, 0.26);
  background: rgba(9, 37, 57, 0.64);
}

#nexoriaCharacterPanel .nx108-panel-header h2 {
  margin: 2px 0 0;
  font-family: "Noto Sans", "Segoe UI", Arial, sans-serif;
  font-size: clamp(1.1rem, 2vw, 1.5rem);
  font-weight: 700;
  text-shadow: none;
}

#nexoriaCharacterPanel .nx108-panel-header small,
.nx108-bag-heading small {
  color: #69cae8;
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.15em;
}

#nexoriaCharacterPanel .nx108-close {
  width: 35px;
  height: 35px;
  min-height: 35px !important;
  border: 1px solid rgba(119, 199, 225, 0.42) !important;
  border-radius: 8px !important;
  background: rgba(2, 18, 30, 0.74) !important;
  box-shadow: none !important;
  font-size: 1.35rem !important;
}

#nexoriaCharacterPanel .nx108-profile-header-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

#nexoriaCharacterPanel .nx108-profile-artwork-button {
  display: grid;
  place-items: center;
  width: 35px;
  height: 35px;
  min-height: 35px !important;
  padding: 7px;
  border: 1px solid rgba(119, 199, 225, .42) !important;
  border-radius: 8px !important;
  color: #fff0d0;
  background: rgba(43, 27, 13, .82) !important;
  box-shadow: none !important;
}

#nexoriaCharacterPanel .nx108-profile-artwork-button svg {
  width: 100%;
  height: 100%;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

#nexoriaCharacterPanel .nx108-profile-artwork-button:is(:hover, :focus-visible) {
  border-color: #f0cb72 !important;
  color: #fff8e8;
  box-shadow: 0 0 9px rgba(240, 203, 114, .25) !important;
}

.nx108-profile-panel {
  flex: 0 0 410px;
  min-width: 360px;
}

.nx108-profile-body { padding: 11px; }

#nexoriaCharacterPanel .nx108-paperdoll {
  position: relative;
  min-height: 425px;
  border: 1px solid rgba(94, 178, 206, 0.22);
  border-radius: 9px;
  background: linear-gradient(180deg, rgba(8, 30, 46, 0.72), rgba(2, 14, 24, 0.9));
  overflow: hidden;
}

#nexoriaCharacterPanel .nx108-paperdoll::after {
  left: 29%;
  right: 29%;
  bottom: 5%;
  height: 9px;
  border: 1px solid rgba(81, 180, 211, 0.32);
  box-shadow: 0 0 12px rgba(62, 175, 210, 0.18);
}

#nexoriaCharacterPanel .nx108-paperdoll > img {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 24%;
  filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.56));
}

#nexoriaCharacterPanel .nx108-equip-slot {
  position: absolute;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  min-height: 58px !important;
  padding: 6px;
  border: 0;
  border-radius: 8px;
  background-image: var(--nx108-slot-frame), linear-gradient(145deg, rgba(13, 43, 63, 0.9), rgba(2, 15, 25, 0.97));
  background-size: 100% 100%, 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.4);
}

#nexoriaCharacterPanel .nx108-equip-slot.is-equipped {
  box-shadow: inset 0 0 7px color-mix(in srgb, var(--rarity, #a9d8e8) 16%, transparent), 0 3px 9px rgba(0, 0, 0, 0.42);
}

#nexoriaCharacterPanel .nx108-equip-slot img { width: 87%; height: 87%; }
#nexoriaCharacterPanel .nx108-equip-slot span { color: #7f99a8; font-size: 0.58rem; line-height: 1.1; }
#nexoriaCharacterPanel .nx108-equip-slot--weapon { left: 3%; top: 7%; }
#nexoriaCharacterPanel .nx108-equip-slot--helmet { right: 3%; top: 7%; }
#nexoriaCharacterPanel .nx108-equip-slot--pants { left: 3%; top: 29%; }
#nexoriaCharacterPanel .nx108-equip-slot--armor { right: 3%; top: 29%; }
#nexoriaCharacterPanel .nx108-equip-slot--gloves { left: 3%; top: 51%; }
#nexoriaCharacterPanel .nx108-equip-slot--shoes { right: 3%; top: 51%; }
#nexoriaCharacterPanel .nx108-equip-slot--necklace { left: 3%; top: 73%; }
#nexoriaCharacterPanel .nx108-equip-slot--ring { right: 3%; top: 73%; }

.nx108-profile-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 126px;
  grid-template-areas: "progress actions" "achievement actions";
  gap: 10px;
  margin-top: 10px;
}

.nx108-profile-progress {
  grid-area: progress;
  display: grid;
  align-content: center;
  gap: 7px;
  margin: 0;
  padding: 9px 12px;
  border: 1px solid rgba(92, 180, 208, 0.22);
  border-radius: 8px;
  background: rgba(1, 13, 22, 0.58);
}

.nx108-profile-progress div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nx108-profile-progress dt { color: #9eb5c2; }
.nx108-profile-progress dd { margin: 0; color: #f0f8fb; font-weight: 700; }

.nx108-profile-mapct1 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  min-height: 34px;
  padding: 4px 8px;
  border: 1px solid rgba(225, 184, 106, .23);
  border-radius: 8px;
  color: #ead9b9;
  background: rgba(24, 15, 7, .64);
  font-size: .72rem;
}
.nx108-profile-lower-row {
  grid-area: achievement;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  min-width: 0;
}

.nx108-profile-lower-row .nx108-profile-mapct1 img {
  width: 48px;
  flex-basis: 48px;
}

.nx108-profile-appearance {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 4px 7px;
  border: 1px solid rgba(103, 190, 220, .3);
  border-radius: 8px;
  color: #d8edf5;
  background: rgba(4, 28, 42, .76);
  font-size: .68rem;
  white-space: nowrap;
  cursor: pointer;
}

.nx108-profile-appearance input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
}

.nx108-profile-appearance b {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid rgba(129, 207, 232, .52);
  border-radius: 5px;
  background: rgba(1, 14, 24, .8);
  color: #7ce7ff;
  font-size: .82rem;
  line-height: 1;
}

.nx108-profile-appearance input:checked + b::before { content: "V"; }
.nx108-profile-appearance:has(input:focus-visible) { outline: 2px solid #7ce7ff; outline-offset: 2px; }
.nx108-profile-appearance:has(input:disabled) { cursor: default; opacity: .62; }
.nx108-profile-mapct1 span { min-width: 0; }
.nx108-profile-mapct1 b { color: #fff5df; }
.nx108-profile-mapct1 img {
  width: 72px;
  aspect-ratio: 1070 / 510;
  height: auto;
  flex: 0 0 72px;
  object-fit: contain;
}

.nx108-profile-actions {
  grid-area: actions;
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  gap: 6px;
}

.nx108-profile-actions button {
  display: grid;
  grid-template-columns: 24px 1fr;
  align-items: center;
  min-height: 39px;
  padding: 5px 9px;
  border: 1px solid rgba(91, 180, 208, 0.35);
  border-radius: 8px;
  background: rgba(5, 27, 42, 0.78);
  box-shadow: none;
  color: #cfe5ed;
  cursor: pointer;
}

.nx108-profile-actions button i {
  color: #74cbe7;
  font-size: 1rem;
  font-style: normal;
}

.nx108-profile-actions button.is-active {
  border-color: #62caea;
  background: rgba(12, 76, 99, 0.72);
  color: #fff;
}

.nx108-profile-detail {
  flex: 0 0 292px;
  min-width: 270px;
  align-self: flex-start;
}

.nx108-detail-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 54px;
  padding: 8px 10px 8px 15px;
  border-bottom: 1px solid rgba(100, 200, 231, 0.23);
  background: rgba(9, 37, 57, 0.55);
}

.nx108-detail-header h3 { margin: 0; color: #d9edf3; font-size: 0.9rem; letter-spacing: 0.12em; }

#nexoriaCharacterPanel .nx108-character-stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 0;
  padding: 9px 12px 14px;
}

#nexoriaCharacterPanel .nx108-character-stats p {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin: 0;
  padding: 8px 3px;
  border-bottom: 1px solid rgba(100, 193, 220, 0.14);
  color: #a8bdc8;
  font-size: 0.8rem;
}

#nexoriaCharacterPanel .nx108-character-stats strong { color: #edf8fb; text-align: right; }
#nexoriaCharacterPanel .nx108-character-stats .nx108-set-bonus { display: block; margin-top: 6px; padding: 8px; border: 1px solid rgba(102, 191, 219, 0.22); border-radius: 7px; background: rgba(8, 42, 59, 0.46); color: #bddbe5; }

#nexoriaCharacterPanel .nx108-skill-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 8px;
  border-bottom: 1px solid rgba(100, 193, 220, 0.14);
}

#nexoriaCharacterPanel .nx108-skill-drag-area {
  display: grid;
  min-width: 0;
  gap: 3px;
  padding: 3px 2px;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

#nexoriaCharacterPanel .nx108-skill-drag-area:active { cursor: grabbing; }
#nexoriaCharacterPanel .nx108-skill-drag-area strong { overflow: hidden; color: #edf8fb; font-size: .8rem; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
#nexoriaCharacterPanel .nx108-skill-drag-area small { color: #88a8b6; font-size: .64rem; }
#nexoriaCharacterPanel .nx108-skill-line.is-unlearned .nx108-skill-drag-area { cursor: default; opacity: .64; touch-action: auto; }

#nexoriaCharacterPanel .nx108-skill-stat-button,
#nexoriaCharacterPanel .nx108-skill-detail-close {
  min-width: 72px;
  min-height: 34px;
  padding: 5px 9px;
  border: 1px solid rgba(100, 200, 231, .38);
  border-radius: 7px;
  color: #e4f4f8;
  background: rgba(7, 49, 69, .84);
  box-shadow: none;
  cursor: pointer;
}

#nexoriaCharacterPanel .nx108-skill-damage-detail {
  display: grid;
  gap: 9px;
  max-height: min(68vh, 540px);
  padding: 2px 1px 3px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

#nexoriaCharacterPanel .nx108-character-stats .nx108-skill-damage-summary {
  display: block;
  padding: 7px 8px 9px;
  border: 1px solid rgba(100, 193, 220, .18);
  border-radius: 7px;
  color: #bddbe5;
  background: rgba(8, 42, 59, .46);
  line-height: 1.45;
}

#nexoriaCharacterPanel .nx108-skill-damage-table {
  width: 100%;
  border-collapse: collapse;
  color: #bad0d9;
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
}

#nexoriaCharacterPanel .nx108-skill-damage-table :is(th, td) {
  padding: 6px 5px;
  border-bottom: 1px solid rgba(100, 193, 220, .13);
  text-align: right;
}

#nexoriaCharacterPanel .nx108-skill-damage-table :is(th, td):first-child { text-align: left; }
#nexoriaCharacterPanel .nx108-skill-damage-table thead th { color: #8fcbe0; font-size: .64rem; letter-spacing: .05em; text-transform: uppercase; }
#nexoriaCharacterPanel .nx108-skill-damage-table tbody th { color: #d4e7ed; font-weight: 600; }
#nexoriaCharacterPanel .nx108-skill-damage-table tr.is-current { color: #fff6d8; background: rgba(224, 174, 75, .19); }
#nexoriaCharacterPanel .nx108-skill-damage-table tr.is-current :is(th, td) { border-bottom-color: rgba(244, 203, 116, .42); }
#nexoriaCharacterPanel .nx108-skill-detail-close { position: sticky; bottom: 0; justify-self: end; min-width: 88px; border-color: rgba(239, 201, 128, .48); color: #fff2d2; background: rgba(91, 55, 21, .94); }

.nx108-skill-drag-ghost {
  position: fixed;
  z-index: 1200;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  gap: 7px;
  max-width: 190px;
  padding: 7px 9px;
  border: 1px solid rgba(108, 205, 232, .62);
  border-radius: 8px;
  color: #edf8fb;
  background: rgba(3, 30, 44, .94);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .45);
  font-size: .7rem;
  pointer-events: none;
}

.nx108-skill-drag-ghost img { width: 28px; height: 28px; object-fit: contain; }

#nexoriaCharacterPanel .nx108-bag-pane {
  flex: 0 0 520px;
  min-width: 450px;
  display: flex;
  flex-direction: column;
  padding: 14px;
  overflow: hidden;
}

#nexoriaCharacterPanel .nx108-bag-heading {
  flex: 0 0 auto;
  min-height: 46px;
  margin: 0 0 9px;
  padding: 0 2px 8px;
  border-bottom: 1px solid rgba(96, 190, 219, 0.2);
}

#nexoriaCharacterPanel .nx108-bag-heading h3 {
  margin: 2px 0 0;
  color: #eff8fb;
  font-family: "Noto Sans", "Segoe UI", Arial, sans-serif;
  font-size: 1.15rem;
  letter-spacing: 0.02em;
}

.nx108-inventory-gold {
  flex: 0 0 auto;
  color: #ffd777;
  font-size: 0.84rem;
  font-weight: 800;
  text-align: right;
  white-space: nowrap;
}

#nexoriaCharacterPanel .nx108-tabs {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 9px;
}

#nexoriaCharacterPanel .nx108-character-workspace.is-trade .nx108-tabs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* 1.0.40: Level dùng danh sách nội bộ; ba cột gọn ngang và có thanh cuộn hữu hình. */
.nx108-bulk-sale-card {
  width: min(570px, calc(100vw - 24px));
  max-height: min(500px, calc(100vh - 16px));
  max-height: min(500px, calc(100dvh - 16px));
}

.nx108-bulk-sale-body {
  display: grid;
  gap: 8px;
  min-height: 0;
  padding: 9px 14px 12px;
}

.nx108-bulk-sale-columns {
  display: grid;
  grid-template-columns: minmax(135px, 1.05fr) minmax(105px, .82fr) minmax(120px, .94fr);
  gap: 6px;
  min-height: 0;
}

.nx108-bulk-sale-level,
.nx108-bulk-sale-columns fieldset {
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 7px;
  border: 1px solid rgba(226, 187, 113, .32);
  border-radius: 9px;
  background: rgba(27, 17, 8, .78);
}

.nx108-bulk-sale-level {
  display: grid;
  align-content: start;
  gap: 6px;
}

.nx108-bulk-sale-columns legend {
  color: #f0cd8c;
  font-size: .76rem;
  font-weight: 800;
}

.nx108-bulk-sale-columns fieldset { display: grid; grid-template-rows: auto minmax(0, 1fr); }

.nx108-bulk-sale-scroll {
  display: grid;
  align-content: start;
  gap: 4px;
  max-height: 166px;
  padding-right: 4px;
  overflow-x: hidden;
  overflow-y: scroll;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(214, 159, 67, .72) rgba(26, 17, 8, .76);
}

.nx108-bulk-sale-scroll::-webkit-scrollbar { width: 8px; }
.nx108-bulk-sale-scroll::-webkit-scrollbar-track { border-radius: 999px; background: rgba(26, 17, 8, .76); }
.nx108-bulk-sale-scroll::-webkit-scrollbar-thumb { border: 2px solid rgba(26, 17, 8, .76); border-radius: 999px; background: rgba(214, 159, 67, .78); }

.nx108-bulk-sale-scroll button {
  min-height: 30px;
  padding: 3px 7px;
  border: 1px solid rgba(226, 187, 113, .25);
  border-radius: 7px;
  color: #d2c0a1;
  background: rgba(45, 28, 13, .84);
  text-align: left;
}

.nx108-bulk-sale-scroll button[data-nx-bulk-rarity].is-selected {
  border-color: var(--bulk-rarity, #e7b65c);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bulk-rarity, #e7b65c) 48%, transparent), 0 0 8px color-mix(in srgb, var(--bulk-rarity, #e7b65c) 24%, transparent);
  color: #fff;
}

.nx108-bulk-sale-level-list button { text-align: center; }
.nx108-bulk-sale-level-list button.is-selected {
  border-color: #e7b65c;
  box-shadow: inset 0 0 0 1px rgba(255, 226, 168, .22), 0 0 8px rgba(231, 182, 92, .22);
  color: #fff8e8;
  background: rgba(133, 82, 31, .82);
}

.nx108-bulk-sale-scroll button[data-nx-bulk-type].is-selected {
  border-color: #e7b65c;
  box-shadow: inset 0 0 0 1px rgba(255, 226, 168, .22), 0 0 8px rgba(231, 182, 92, .22);
  color: #fff8e8;
  background: rgba(133, 82, 31, .82);
}

.nx108-bulk-sale-preview {
  min-height: 30px;
  margin: 0;
  padding: 6px 9px;
  border-radius: 7px;
  color: #ead8b7;
  background: rgba(19, 12, 6, .7);
  text-align: center;
}

.nx108-bulk-sale-header-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.nx108-bulk-sale-header-actions > button:not(.nx108-close) {
  min-width: 56px;
  min-height: 32px;
  padding: 4px 9px;
}

.nx108-root .is-unaffordable {
  filter: grayscale(.28);
  opacity: .72;
}

@media (max-width: 640px) {
  .nx108-bulk-sale-body { padding: 8px 10px 10px; }
  .nx108-bulk-sale-columns { grid-template-columns: minmax(125px, 1fr) minmax(96px, .78fr) minmax(108px, .9fr); gap: 5px; }
  .nx108-bulk-sale-level,
  .nx108-bulk-sale-columns fieldset { padding: 7px; }
}

#nexoriaCharacterPanel .nx108-tabs button,
.nx108-page-buttons button {
  min-height: 34px;
  padding: 5px 10px;
  border: 1px solid rgba(94, 183, 211, 0.32);
  border-radius: 7px;
  background: rgba(3, 21, 34, 0.8);
  box-shadow: none;
  color: #a9c1cc;
  cursor: pointer;
}

#nexoriaCharacterPanel .nx108-tabs button.is-active,
.nx108-page-buttons button.is-active {
  border-color: #62ccea;
  background: rgba(10, 77, 102, 0.78);
  color: #f5fcff;
  box-shadow: inset 0 0 0 1px rgba(158, 229, 248, 0.1);
}

.nx108-page-bank {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
}

.nx108-page-buttons { display: grid; grid-template-columns: repeat(5, minmax(38px, 1fr)); gap: 5px; flex: 1; }
.nx108-page-buttons button { min-height: 31px; padding: 3px 5px; font-size: 0.76rem; }

#nexoriaCharacterPanel .nx108-inventory-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(48px, 1fr));
  align-content: start;
  flex: 1 1 auto;
  min-height: 0;
  gap: 6px;
  padding-right: 5px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(80, 194, 228, 0.7) rgba(2, 16, 27, 0.72);
}

#nexoriaCharacterPanel .nx108-inventory-grid::-webkit-scrollbar { width: 6px; }
#nexoriaCharacterPanel .nx108-inventory-grid::-webkit-scrollbar-track { background: rgba(2, 16, 27, 0.72); }
#nexoriaCharacterPanel .nx108-inventory-grid::-webkit-scrollbar-thumb { border-radius: 8px; background: rgba(80, 194, 228, 0.7); }

#nexoriaCharacterPanel .nx108-inventory-cell {
  width: 100%;
  aspect-ratio: 1;
  min-height: 0 !important;
  padding: 5px;
  border: 1px solid rgba(115, 176, 197, 0.28);
  border-radius: 7px;
  background: linear-gradient(145deg, rgba(11, 37, 53, 0.78), rgba(2, 15, 24, 0.96));
  box-shadow: inset 0 0 0 1px rgba(198, 231, 241, 0.025);
}

#nexoriaCharacterPanel .nx108-inventory-cell.has-item {
  border-color: color-mix(in srgb, var(--rarity, #91bbc9) 56%, #315160);
  box-shadow: inset 0 0 8px color-mix(in srgb, var(--rarity, #91bbc9) 10%, transparent);
}

#nexoriaCharacterPanel .nx108-inventory-cell.is-empty { opacity: 0.78; }
#nexoriaCharacterPanel .nx108-inventory-cell img { width: 88%; height: 88%; }
#nexoriaCharacterPanel .nx108-inventory-cell b,
#nexoriaCharacterPanel .nx108-inventory-cell small { border-radius: 4px; background: rgba(0, 8, 14, 0.82); font-size: 0.62rem; }

.nx108-page-status {
  display: block;
  flex: 0 0 auto;
  margin-top: 8px;
  color: #8eacb9;
  font-size: 0.7rem;
  text-align: right;
}

.nx108-character-workspace.is-read-only .nx108-profile-panel,
.nx108-character-workspace.is-profile-only .nx108-profile-panel { flex-basis: 420px; }

@media (max-width: 1050px), (max-height: 620px) {
  .nx108-character-workspace { justify-content: flex-start; }
  .nx108-profile-panel { flex-basis: 330px; min-width: 310px; }
  #nexoriaCharacterPanel .nx108-paperdoll { min-height: 315px; }
  #nexoriaCharacterPanel .nx108-equip-slot { width: 46px; height: 46px; min-height: 46px !important; padding: 5px; }
  .nx108-profile-footer { grid-template-columns: minmax(0, 1fr) 112px; }
  .nx108-profile-progress { padding: 6px 8px; font-size: 0.73rem; }
  .nx108-profile-actions button { min-height: 33px; padding: 3px 6px; font-size: 0.69rem; }
  .nx108-profile-detail { flex-basis: 250px; min-width: 235px; }
  #nexoriaCharacterPanel .nx108-bag-pane { flex-basis: 430px; min-width: 390px; padding: 10px; }
  #nexoriaCharacterPanel .nx108-inventory-grid { grid-template-columns: repeat(6, minmax(42px, 1fr)); gap: 5px; }
}

@media (orientation: portrait) and (max-width: 680px) {
  .nx108-character-workspace { display: grid; grid-template-columns: 1fr; width: 96vw; }
  .nx108-profile-panel,
  .nx108-profile-detail,
  #nexoriaCharacterPanel .nx108-bag-pane { width: 100%; min-width: 0; }
  #nexoriaCharacterPanel .nx108-paperdoll { min-height: 360px; }
  #nexoriaCharacterPanel .nx108-inventory-grid { grid-template-columns: repeat(6, minmax(38px, 1fr)); }
}

/* NEXORIA 1.0.17 — giữ đúng ngôn ngữ giao diện xanh xuyên mờ hiện có. */
.player-hud {
  transform: translateY(-12%);
}

.hud-player-data {
  top: 15.7%;
  bottom: 10.3%;
  grid-template-rows: 34% repeat(3, 18.66%);
}

.axis-status {
  gap: 8px;
}

.battery-status {
  flex-direction: row;
  color: #fff;
  white-space: nowrap;
}

.battery-status svg {
  flex: 0 0 auto;
  stroke: #fff;
}

.battery-status .battery-fill { fill: #fff; }

#nexoriaCharacterPanel .nx108-character-workspace {
  align-items: stretch;
  height: min(710px, 96vh);
  max-height: 96vh;
  overflow: hidden;
}

#nexoriaCharacterPanel .nx108-profile-panel,
#nexoriaCharacterPanel .nx108-bag-pane,
#nexoriaCharacterPanel .nx108-trade-pane {
  height: 100%;
}

#nexoriaCharacterPanel .nx108-profile-body {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  height: calc(100% - 64px);
  min-height: 0;
}

#nexoriaCharacterPanel .nx108-paperdoll {
  min-height: 0;
}

#nexoriaCharacterPanel .nx108-paperdoll > img {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 24%;
}

#nexoriaCharacterPanel .nx108-inventory-grid {
  grid-template-columns: repeat(6, minmax(42px, 1fr));
  overscroll-behavior: contain;
}

#nexoriaCharacterPanel .nx108-inventory-cell {
  padding: 4px;
}

#nexoriaCharacterPanel .nx108-inventory-cell.is-selected {
  border-color: #f0cb72;
  box-shadow: inset 0 0 0 1px rgba(240, 203, 114, .34), 0 0 10px rgba(240, 203, 114, .18);
}

.nx108-bind-tag {
  position: absolute;
  top: 3px;
  right: 3px;
  left: 3px;
  overflow: hidden;
  padding: 1px 2px;
  border-radius: 3px;
  background: rgba(0, 8, 14, .82);
  font-size: clamp(6px, .53vw, 8px);
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
}

.nx108-bind-tag.is-bound,
.nx108-item-binding.is-bound { color: #ffcf8a; }
.nx108-bind-tag.is-unbound,
.nx108-item-binding.is-unbound { color: #91edaa; }

.nx108-item-binding {
  display: block;
  margin-top: 3px;
  font-size: .66rem;
  font-weight: 750;
}

/* Bảng tương tác là ngoại lệ tối màu theo yêu cầu, vẫn dùng nét vàng tối của game. */
.nx108-interaction {
  z-index: 985;
  width: min(202px, 72vw);
  gap: 0;
  padding: 6px;
  border: 1px solid rgba(137, 105, 48, .82);
  border-radius: 8px;
  background: rgba(2, 4, 6, .76);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .58), inset 0 0 0 1px rgba(233, 194, 111, .05);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.nx108-interaction strong {
  padding: 6px 7px 8px;
  color: #dbc187;
  font-size: .78rem;
  text-align: left;
}

.nx108-interaction button {
  min-height: 34px;
  padding: 5px 9px;
  border: 0;
  border-top: 1px solid rgba(126, 100, 54, .34);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #fff;
  font-size: .76rem;
  text-align: left;
  touch-action: manipulation;
}

.nx108-interaction button:hover:not(:disabled),
.nx108-interaction button:focus-visible {
  border-color: rgba(198, 158, 80, .66);
  background: rgba(115, 83, 31, .24);
}

/* Giao dịch nằm sát bên trái hành trang; hành trang vẫn là bảng bên phải. */
#nexoriaCharacterPanel .nx108-trade-pane {
  flex: 0 0 348px;
  min-width: 318px;
  display: flex;
  flex-direction: column;
  padding: 12px;
  overflow: hidden;
}

.nx108-trade-heading {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 47px;
  margin-bottom: 9px;
  padding: 0 2px 8px;
  border-bottom: 1px solid rgba(96, 190, 219, .2);
}

.nx108-trade-heading small {
  color: #69cae8;
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .15em;
}

.nx108-trade-heading h3 {
  margin: 2px 0 0;
  color: #eff8fb;
  font-size: 1rem;
}

.nx108-trade-heading > span {
  max-width: 118px;
  color: #93afbb;
  font-size: .62rem;
  line-height: 1.25;
  text-align: right;
}

.nx108-trade-offer {
  flex: 0 0 auto;
  margin-bottom: 8px;
  padding: 8px;
  border: 1px solid rgba(99, 176, 200, .25);
  border-radius: 8px;
  background: rgba(2, 16, 27, .62);
  transition: border-color 120ms ease, box-shadow 120ms ease;
}

.nx108-trade-offer.is-locked {
  border-color: rgba(88, 218, 125, .82);
  box-shadow: inset 0 0 12px rgba(64, 180, 100, .11), 0 0 7px rgba(64, 180, 100, .12);
}

.nx108-trade-offer > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.nx108-trade-offer > header strong { color: #edf8fb; font-size: .75rem; }
.nx108-trade-offer > header span { color: #9cb4be; font-size: .61rem; }
.nx108-trade-offer.is-locked > header span { color: #71e297; }

.nx108-trade-slots {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 5px;
}

.nx108-trade-slot {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 0;
  aspect-ratio: 1;
  padding: 3px;
  border: 1px solid rgba(115, 176, 197, .3);
  border-radius: 5px;
  background: linear-gradient(145deg, rgba(11, 37, 53, .76), rgba(2, 13, 22, .96));
  color: #a8c9d5;
  font-size: .62rem;
}

.nx108-trade-slot img { width: 92%; height: 92%; object-fit: contain; }
.nx108-trade-slot b {
  position: absolute;
  right: 2px;
  bottom: 1px;
  padding: 0 2px;
  border-radius: 2px;
  background: rgba(0, 6, 11, .84);
  color: #fff;
  font-size: .58rem;
}
.nx108-trade-slot.is-empty { opacity: .56; }

.nx108-trade-gold {
  display: grid;
  grid-template-columns: auto minmax(66px, 1fr);
  align-items: center;
  gap: 5px 8px;
  margin-top: 7px;
  color: #b7cbd4;
  font-size: .65rem;
}

.nx108-trade-gold input,
.nx108-trade-selection input {
  min-width: 0;
  height: 29px;
  padding: 3px 6px;
  border: 1px solid rgba(225, 184, 80, .38);
  border-radius: 5px;
  outline: 0;
  background: rgba(0, 8, 14, .76);
  color: #ffe1a0;
}

.nx108-trade-gold small { grid-column: 2; color: #879eaa; font-size: .57rem; }
.nx108-trade-other-gold { margin: 7px 0 0; color: #a9c0ca; font-size: .66rem; text-align: right; }
.nx108-trade-other-gold strong { color: #ffd777; }

.nx108-trade-selection {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 62px auto;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  padding: 7px;
  border: 1px solid rgba(98, 180, 208, .2);
  border-radius: 7px;
  background: rgba(2, 14, 23, .52);
}

.nx108-trade-selection span {
  overflow: hidden;
  color: #bdd3dc;
  font-size: .63rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nx108-trade-selection button,
.nx108-trade-actions button {
  min-height: 31px;
  padding: 4px 8px;
  border: 1px solid rgba(94, 183, 211, .35);
  border-radius: 6px;
  background: rgba(4, 29, 44, .88);
  box-shadow: none;
  color: #e5f4f8;
  font-size: .66rem;
}

.nx108-trade-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-top: 8px;
}

.nx108-trade-actions .nx108-primary { min-height: 31px; padding: 4px 6px; }
.nx108-trade-pane > .nx108-message { min-height: 1.2em; margin-top: 7px; font-size: .61rem; }

/* Màu máu theo quan hệ; game.js chỉ cần gắn quan hệ qua API công khai. */
.world-nameplate.relationship-self .world-nameplate-hp i,
.world-nameplate.is-local .world-nameplate-hp i {
  background: linear-gradient(180deg, #55e67e, #168638);
}

.world-nameplate.relationship-teammate .world-nameplate-hp i {
  background: linear-gradient(180deg, #58b8ff, #1769bd);
}

.world-nameplate.relationship-enemy .world-nameplate-hp i {
  background: linear-gradient(180deg, #ff6370, #bb101f);
}

.world-nameplate.relationship-self .world-nameplate-name { color: #9cf3b4; }
.world-nameplate.relationship-teammate .world-nameplate-name { color: #9dd6ff; }
.world-nameplate.relationship-enemy .world-nameplate-name { color: #ffb3b8; }

@media (max-width: 1050px), (max-height: 620px) {
  #nexoriaCharacterPanel .nx108-character-workspace { height: min(98vh, 600px); max-height: 98vh; }
  #nexoriaCharacterPanel .nx108-profile-body { height: calc(100% - 58px); }
  #nexoriaCharacterPanel .nx108-inventory-grid { grid-template-columns: repeat(6, minmax(37px, 1fr)); gap: 4px; }
  #nexoriaCharacterPanel .nx108-trade-pane { flex-basis: 304px; min-width: 286px; padding: 9px; }
  .nx108-trade-slot { padding: 2px; }
  .nx108-trade-offer { padding: 6px; margin-bottom: 6px; }
}

@media (orientation: portrait) and (max-width: 680px) {
  #nexoriaCharacterPanel .nx108-character-workspace {
    height: 96vh;
    overflow-x: hidden;
    overflow-y: auto;
  }
  #nexoriaCharacterPanel .nx108-profile-panel,
  #nexoriaCharacterPanel .nx108-bag-pane,
  #nexoriaCharacterPanel .nx108-trade-pane { height: auto; }
  #nexoriaCharacterPanel .nx108-inventory-grid { grid-template-columns: repeat(6, minmax(38px, 1fr)); }
}

/* NEXORIA 1.0.18 — 30 ô hành trang tách biệt; chỉ khu vực ô được cuộn. */
#nexoriaCharacterPanel .nx108-bag-pane {
  min-height: 0;
  overflow: hidden;
}

#nexoriaCharacterPanel #nx108InventoryGrid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-flow: row;
  grid-auto-rows: max-content;
  align-content: start;
  align-items: start;
  justify-items: stretch;
  min-width: 0;
  min-height: 0;
  padding: 0 6px 8px 0;
  gap: 6px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  touch-action: pan-y;
}

#nexoriaCharacterPanel #nx108InventoryGrid > .nx108-inventory-cell {
  position: relative;
  isolation: isolate;
  box-sizing: border-box;
  grid-column: auto;
  grid-row: auto;
  align-self: start;
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 0 !important;
  margin: 0;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

#nexoriaCharacterPanel #nx108InventoryGrid > .nx108-inventory-cell > img {
  display: block;
  min-width: 0;
  max-width: 88%;
  max-height: 88%;
}

/* Số lượng là một huy hiệu nằm trong chính ô vật phẩm, không tạo thêm ô/chồng ô. */
#nexoriaCharacterPanel #nx108InventoryGrid > .nx108-inventory-cell > b {
  position: absolute;
  z-index: 3;
  right: 3px;
  bottom: 3px;
  left: auto;
  display: block;
  box-sizing: border-box;
  min-width: 18px;
  max-width: calc(100% - 6px);
  padding: 1px 4px;
  overflow: hidden;
  border: 1px solid rgba(208, 235, 244, 0.2);
  border-radius: 5px;
  background: rgba(0, 8, 14, 0.9);
  color: #fff;
  font-size: 0.65rem;
  line-height: 1.25;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
}

@media (max-width: 1050px), (max-height: 620px) {
  #nexoriaCharacterPanel #nx108InventoryGrid { gap: 5px; }
}

@media (orientation: portrait) and (max-width: 680px) {
  #nexoriaCharacterPanel #nx108InventoryGrid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 5px;
  }
}

/* NEXORIA 1.0.19 — cùng tông nền/viền Đăng nhập và bố cục nhân vật mới. */
.nx108-flow-card,
.nx108-panel,
.nx108-confirm-card,
.nx108-interaction {
  border-color: rgba(242, 202, 124, .5);
  color: #fff8e8;
  background: linear-gradient(155deg, rgba(57, 40, 21, .96), rgba(25, 18, 10, .98));
  box-shadow: 0 24px 70px rgba(16, 8, 2, .58), inset 0 1px rgba(255, 255, 255, .1), 0 0 34px rgba(226, 169, 67, .12);
}

.nx108-character-flow {
  background:
    linear-gradient(180deg, rgba(18, 12, 5, .22), rgba(18, 10, 3, .74)),
    url("assets/login/v1060/scene-background.webp?v=1.0.86-20260910") center 58% / cover no-repeat;
}

.nx108-flow-card { width: min(1060px, 96vw); padding: clamp(16px, 3vw, 32px); }
.nx108-create { grid-template-columns: minmax(300px, 1.15fr) minmax(250px, .85fr); gap: clamp(18px, 3vw, 34px); max-width: none; }
.nx108-model-picker,
.nx108-faction-picker,
.nx108-guild-create fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.nx108-model-picker > legend,
.nx108-faction-picker > legend,
.nx108-guild-create legend { margin-bottom: 8px; color: #f6d48d; font-weight: 850; }
.nx108-model-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.nx108-model-choice {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 128px !important;
  overflow: hidden;
  border: 1px solid rgba(226, 190, 121, .35);
  border-radius: 12px;
  color: #f6e7c9;
  background: rgba(22, 14, 7, .78);
}
.nx108-model-choice b { font-family: Georgia, serif; font-size: 3.2rem; color: rgba(246, 215, 151, .48); }
.nx108-model-choice span { min-height: 24px; padding: 4px; font-size: .72rem; }
.nx108-model-choice.is-selected { border-color: #f4c96f; box-shadow: 0 0 18px rgba(242, 185, 76, .38), inset 0 0 18px rgba(242, 185, 76, .13); }
.nx108-create-fields { display: grid; align-content: center; gap: 10px; }
.nx108-faction-picker { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.nx108-faction-picker legend { grid-column: 1 / -1; }
.nx108-faction-picker label { position: relative; display: grid; place-items: center; min-height: 62px; border: 1px solid rgba(229, 195, 130, .28); border-radius: 10px; background: rgba(20, 13, 7, .7); cursor: pointer; }
.nx108-faction-picker label.is-selected { border-color: #f0c66e; box-shadow: inset 0 0 18px rgba(225, 168, 62, .2); color: #ffe4a8; }
.nx108-faction-picker input { position: absolute; opacity: 0; }

.nx108-character-list { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: clamp(10px, 2vw, 18px); }
.nx108-character-choice {
  position: relative;
  display: grid !important;
  grid-template-columns: 1fr;
  grid-template-rows: minmax(170px, 1fr) auto;
  align-content: stretch;
  min-height: clamp(280px, 52vh, 430px) !important;
  padding: 12px;
  overflow: hidden;
  border-color: rgba(233, 201, 139, .32);
  border-radius: 14px 14px 5px 5px;
  background: linear-gradient(180deg, rgba(66, 45, 22, .72), rgba(18, 12, 7, .94));
  text-align: center;
}
.nx108-character-choice > img { align-self: stretch; width: 100%; height: 100%; min-height: 0; border: 0; border-radius: 10px; object-fit: cover; object-position: center 34%; filter: none; }
.nx108-character-choice > span { position: relative; z-index: 2; display: grid; gap: 4px; padding: 11px 4px 4px; }
.nx108-character-choice.is-empty { place-content: center; opacity: .58; }
.nx108-character-choice.is-empty > b { font-family: Georgia, serif; font-size: 4rem; color: #e7c37d; }
.nx108-character-choice.is-selected { border-color: #ffd77d; box-shadow: 0 0 28px rgba(255, 206, 102, .42), inset 0 0 30px rgba(255, 199, 78, .16); }
.nx108-selection-particles { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.nx108-selection-particle {
  --particle-index: 0;
  --particle-size: 10px;
  position: absolute;
  left: calc(8% + var(--particle-index) * 10.5%);
  bottom: -12%;
  width: var(--particle-size);
  height: var(--particle-size);
  background: url("assets/guild-1.0.19/character-select-sparkle.png") center / contain no-repeat;
  filter: drop-shadow(0 0 6px #ffe49b);
  animation: nx108-character-sparkle calc(1.9s + var(--particle-index) * .11s) linear calc(var(--particle-index) * -.23s) infinite;
}
@keyframes nx108-character-sparkle { 0% { transform: translateY(0) scale(.7); opacity: 0; } 18% { opacity: 1; } 100% { transform: translateY(-390px) scale(1.16); opacity: 0; } }

/* HUD 1.0.19: nền che kín ba thanh, HP hạ nhẹ và avatar khít khung. */
.player-hud::before { inset: -1.5% -1% -2%; background-size: 100% 100%; }
#hudAvatarButton.hud-avatar-frame { top: 16.5%; left: 1.23%; width: 34%; }
.hud-avatar-portrait { inset: 6.3%; width: auto; height: auto; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 50%; }
.hud-avatar { width: 100%; height: 100%; object-fit: contain; object-position: center; transform: none; }
.hud-player-data { top: 15.2%; right: 1%; bottom: 7.2%; left: 31.4%; grid-template-rows: 32% repeat(3, 22.66%); }
.hud-stat--hp { margin-top: 2px; }
.hud-stat-track { right: 4.2%; left: 19.8%; }
.hud-stat output { right: 4.2%; left: 19.8%; }

/* Bang hội 1.0.19. */
.nx108-guild-panel { width: min(1120px, 96vw); }
.nx108-guild-body { gap: 12px; max-height: 78vh; padding: 14px 18px 20px; }
.nx108-guild-balance { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 18px; color: #ead9b9; font-size: .78rem; }
.nx108-guild-balance b { color: #ffd77c; }
.nx108-guild-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; padding: 4px; border-radius: 11px; background: rgba(22, 14, 7, .72); }
.nx108-guild-nav button { min-height: 40px; border: 1px solid transparent; border-radius: 8px; color: #d9c7a9; background: transparent; }
.nx108-guild-nav button.is-active { border-color: rgba(244, 203, 124, .55); color: #fff4dc; background: linear-gradient(180deg, #9b6428, #5f3917); }
.nx108-guild-view { min-height: 0; }
.nx108-guild-factions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.nx108-guild-faction { min-width: 0; padding: 10px; border: 1px solid rgba(231, 196, 129, .27); border-radius: 11px; background: rgba(20, 13, 7, .58); }
.nx108-guild-faction > header { display: grid; gap: 2px; margin-bottom: 8px; }
.nx108-guild-faction > header strong { color: #f0cf88; font-family: Georgia, serif; font-size: 1.2rem; }
.nx108-guild-faction.is-umbra > header strong { color: #d5a9ff; }
.nx108-guild-faction > header small { color: #ad9d84; }
.nx108-guild-list { display: grid; gap: 6px; max-height: 240px; overflow-y: auto; scrollbar-gutter: stable; }
.nx108-guild-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 7px; padding: 6px; border-radius: 8px; background: rgba(255, 255, 255, .045); }
.nx108-guild-row-info { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 8px; min-width: 0; border: 0; color: #f6ead4; background: transparent; text-align: left; }
.nx108-guild-row-info img { width: 42px; height: 42px; object-fit: contain; }
.nx108-guild-row-info span { display: grid; min-width: 0; }
.nx108-guild-row-info strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nx108-guild-row-info small { color: #bcae96; }
.nx108-guild-apply { min-height: 34px; padding: 0 9px; border: 1px solid rgba(239, 202, 128, .35); border-radius: 7px; color: #fff1cf; background: rgba(100, 61, 24, .82); }
.nx108-guild-empty { margin: 12px 0; color: #a99c88; text-align: center; }
.nx108-guild-detail { display: grid; grid-template-columns: 70px minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-top: 10px; padding: 11px; border: 1px solid rgba(240, 202, 125, .32); border-radius: 10px; background: rgba(31, 20, 10, .85); }
.nx108-guild-detail img { width: 68px; height: 68px; object-fit: contain; }
.nx108-guild-detail h3, .nx108-guild-detail p { margin: 2px 0; }
.nx108-guild-create-open { display: block; min-height: 42px; margin: 12px auto 0; padding: 0 18px; }
.nx108-guild-create { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(0, 1.3fr) auto; align-items: end; gap: 8px 12px; margin-top: 12px; padding: 11px; border: 1px solid rgba(238, 201, 126, .28); border-radius: 10px; background: rgba(25, 16, 8, .7); }
.nx108-guild-create[hidden], .nx108-guild-create-open[hidden] { display: none; }
.nx108-guild-create header { grid-column: 1 / -1; display: grid; }
.nx108-guild-create header small { color: #baa98d; }
.nx108-guild-create > label { align-self: center; color: #ead4ad; }
.nx108-guild-create > input { min-height: 42px; padding: 0 11px; border: 1px solid rgba(230, 194, 125, .34); border-radius: 8px; color: #fff7e8; background: rgba(9, 6, 3, .72); text-transform: uppercase; }
.nx108-guild-create fieldset { grid-column: 1 / -1; }
.nx108-guild-create-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 8px; }
.nx108-guild-create-actions button { min-width: 108px; min-height: 40px; }
.nx108-guild-emblems { display: grid; grid-template-columns: repeat(8, minmax(42px, 1fr)); gap: 6px; }
.nx108-guild-emblems button { min-height: 58px; padding: 4px; border: 1px solid rgba(230, 195, 129, .25); border-radius: 7px; background: rgba(12, 8, 4, .7); }
.nx108-guild-emblems button.is-selected { border-color: #ffd77d; box-shadow: 0 0 12px rgba(255, 207, 106, .35); }
.nx108-guild-emblems img { width: 100%; height: 48px; object-fit: contain; }
.nx108-guild-current { padding: 12px; border-color: rgba(240, 202, 125, .32); background: rgba(25, 16, 8, .7); }
.nx108-guild-current-header { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.nx108-guild-current-emblem { display: grid; place-items: center; gap: 1px; width: 72px; min-height: 78px; padding: 2px; border: 1px solid rgba(239, 203, 131, .25); border-radius: 8px; color: #e8c77f; background: rgba(18, 12, 6, .7); }
.nx108-guild-current-emblem img { width: 66px; height: 62px; object-fit: contain; }
.nx108-guild-current-emblem small { font-size: .6rem; }
.nx108-guild-current-emblem:disabled small { display: none; }
.nx108-guild-name-line { display: flex; align-items: center; gap: 7px; }
.nx108-guild-name-line h3 { margin: 0; color: #ffe0a0; }
.nx108-guild-name-line button { width: 34px; min-height: 30px; border: 1px solid rgba(248, 211, 135, .35); border-radius: 6px; color: #ffe7b0; background: rgba(104, 64, 25, .75); }
.nx108-guild-level { display: grid; justify-items: end; color: #f4d18b; }
.nx108-guild-resource-line { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin: 10px 0; }
.nx108-guild-resource-line span { padding: 7px; border-radius: 7px; background: rgba(255, 255, 255, .05); text-align: center; }
.nx108-guild-contribute { display: grid; grid-template-columns: minmax(170px, 1fr) 100px 100px auto; align-items: end; gap: 7px; padding: 8px; border: 1px solid rgba(234, 198, 130, .2); border-radius: 8px; }
.nx108-guild-contribute > div, .nx108-guild-contribute label { display: grid; gap: 3px; }
.nx108-guild-contribute small { color: #ad9e87; }
.nx108-guild-contribute input { width: 100%; min-height: 36px; padding: 0 7px; border: 1px solid rgba(237, 201, 129, .28); border-radius: 6px; color: #fff3dc; background: rgba(12, 8, 4, .72); }
.nx108-guild-contribute button { min-height: 36px; border: 1px solid rgba(237, 201, 129, .32); border-radius: 6px; color: #fff0ce; background: rgba(98, 60, 23, .82); }
.nx108-guild-quests ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; margin: 0; padding: 0; list-style: none; }
.nx108-guild-quests li { display: grid; gap: 4px; padding: 7px; border-radius: 7px; color: #e9d9ba; background: rgba(255, 255, 255, .045); font-size: .7rem; }
.nx108-guild-quests li small { color: #c3af8c; }
.nx108-guild-quests li.is-complete { color: #dbf5bc; background: rgba(67, 105, 43, .24); }
.nx108-guild-join-mode { display: flex; align-items: center; gap: 14px; margin-bottom: 9px; padding: 8px; border: 1px solid rgba(234, 198, 130, .2); border-radius: 8px; }
.nx108-guild-section-title { display: flex; align-items: end; justify-content: space-between; gap: 8px; margin: 8px 0 6px; }
.nx108-guild-section-title small { color: #ad9e87; }
.nx108-guild-current ul, .nx108-guild-applications { max-height: 230px; }
.nx108-guild-member { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.nx108-guild-member-profile { display: flex; justify-content: space-between; min-width: 0; border: 0; color: #fff2d8; background: transparent; text-align: left; }
.nx108-guild-member-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.nx108-guild-member-actions button, .nx108-guild-applications button { min-height: 29px; padding: 0 7px; border: 1px solid rgba(238, 200, 126, .25); border-radius: 5px; color: #f6dfb5; background: rgba(89, 53, 22, .75); font-size: .68rem; }
.nx108-guild-applications li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px; background: rgba(255, 255, 255, .045); }
.nx108-guild-current-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.nx108-guild-current-actions button { min-height: 38px; padding: 0 12px; }
.nx108-guild-disband-vote { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 10px; margin-top: 9px; padding: 9px; border: 1px solid rgba(218, 105, 91, .35); border-radius: 8px; background: rgba(82, 25, 20, .26); }
.nx108-guild-disband-vote p { margin: 0; color: #e6b3a7; }
.nx108-guild-disband-vote button { grid-row: 1 / 3; grid-column: 2; min-height: 38px; border: 1px solid rgba(235, 126, 109, .4); border-radius: 6px; color: #ffe0d9; background: rgba(123, 43, 32, .72); }
.nx108-guild-shop-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: minmax(132px, auto); gap: 8px; max-height: 500px; padding-right: 5px; overflow-y: auto; scrollbar-gutter: stable; }
.nx108-guild-shop-slot { display: grid; place-items: center; align-content: center; gap: 4px; min-width: 0; padding: 8px; border: 1px solid rgba(235, 198, 126, .27); border-radius: 9px; background: rgba(20, 13, 7, .68); text-align: center; }
.nx108-guild-shop-slot img { width: 54px; height: 54px; object-fit: contain; }
.nx108-guild-shop-slot strong { overflow: hidden; color: #f8e8c5; font-size: .74rem; text-overflow: ellipsis; }
.nx108-guild-shop-slot small { color: #efc973; }
.nx108-guild-shop-slot button { min-height: 30px; padding: 0 12px; border: 1px solid rgba(245, 207, 129, .38); border-radius: 6px; color: #fff0cc; background: rgba(105, 64, 24, .85); }
.nx108-guild-shop-slot.is-empty { color: rgba(218, 194, 149, .38); }
.nx108-guild-shop-slot.is-empty b { font-size: 2rem; }
.nx108-guild-shop-slot.is-empty small { color: rgba(205, 187, 153, .4); }
#nexoriaGuildRename input { width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid rgba(239, 202, 128, .35); border-radius: 8px; color: #fff7e8; background: rgba(12, 8, 4, .82); text-transform: uppercase; }

@media (max-width: 760px) {
  .nx108-create { grid-template-columns: 1fr; }
  .nx108-model-choice { min-height: 105px !important; }
  .nx108-character-choice { min-height: 300px !important; }
  .nx108-guild-factions { grid-template-columns: 1fr; }
  .nx108-guild-create { grid-template-columns: 1fr; }
  .nx108-guild-create > *, .nx108-guild-create fieldset { grid-column: 1; }
  .nx108-guild-emblems { grid-template-columns: repeat(4, minmax(42px, 1fr)); }
  .nx108-guild-shop-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .nx108-guild-contribute { grid-template-columns: 1fr 1fr auto; }
  .nx108-guild-contribute > div { grid-column: 1 / -1; }
  .nx108-guild-quests ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
  .nx108-flow-card { max-height: 96vh; padding: 12px; }
  .nx108-model-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nx108-character-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
  .nx108-character-choice { min-height: 245px !important; padding: 5px; }
  .nx108-character-choice strong { font-size: .84rem; }
  .nx108-character-choice small { font-size: .58rem; }
  .nx108-guild-body { padding: 9px; }
  .nx108-guild-shop-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 125px; }
  .nx108-guild-current-header { grid-template-columns: 54px minmax(0, 1fr); }
  .nx108-guild-current-emblem { width: 54px; min-height: 58px; }
  .nx108-guild-current-emblem img { width: 50px; height: 50px; }
  .nx108-guild-level { grid-column: 1 / -1; grid-auto-flow: column; justify-content: space-between; }
  .nx108-guild-member { grid-template-columns: 1fr !important; }
}

/* 1.0.19 — hoàn thiện tông nâu đen/vàng đồng dùng chung với Đăng nhập. */
.nx108-panel-header {
  border-bottom-color: rgba(237, 199, 126, .27);
  background: linear-gradient(90deg, rgba(112, 70, 27, .52), rgba(39, 25, 12, .18) 72%);
}

.nx108-panel-header h2,
.nx108-title h2,
.nx108-confirm-card h2,
.nx108-item-card h2 { color: #fff8e8; }

.nx108-flow-status {
  border-color: rgba(237, 199, 126, .3);
  background: rgba(24, 16, 8, .76);
}

.nx108-flow-status p,
.nx108-create label { color: #ead7b6; }

.nx108-name-row input {
  border-color: rgba(231, 193, 121, .43);
  color: #fff8e8;
  background: rgba(18, 11, 5, .82);
}

/* Bảng nhân vật: chỉ đổi chất liệu/màu, không đổi bố cục hay trạng thái vật phẩm. */
#nexoriaCharacterPanel {
  background: rgba(15, 9, 4, .79);
}

.nx108-character-workspace {
  scrollbar-color: rgba(214, 159, 67, .72) rgba(26, 17, 8, .76);
}

#nexoriaCharacterPanel .nx108-panel {
  border-color: rgba(239, 201, 128, .55);
  background: linear-gradient(180deg, rgba(52, 35, 18, .99), rgba(22, 15, 8, .995));
  box-shadow: 0 16px 44px rgba(12, 6, 2, .62), inset 0 0 0 1px rgba(255, 224, 164, .04);
}

#nexoriaCharacterPanel .nx108-panel-header {
  border-bottom-color: rgba(235, 195, 119, .27);
  background: rgba(83, 51, 21, .62);
}

#nexoriaCharacterPanel .nx108-panel-header h2,
#nexoriaCharacterPanel .nx108-bag-heading h3,
.nx108-trade-heading h3 { color: #fff5df; }

#nexoriaCharacterPanel .nx108-panel-header small,
.nx108-bag-heading small,
.nx108-trade-heading small { color: #e3b45f; }

#nexoriaCharacterPanel .nx108-close {
  border-color: rgba(235, 198, 127, .43) !important;
  color: #fff0d0;
  background: rgba(43, 27, 13, .82) !important;
}

#nexoriaCharacterPanel .nx108-paperdoll {
  border-color: rgba(231, 190, 112, .25);
  background: linear-gradient(180deg, rgba(59, 39, 19, .74), rgba(20, 13, 7, .92));
}

#nexoriaCharacterPanel .nx108-paperdoll::after {
  border-color: rgba(230, 177, 79, .38);
  box-shadow: 0 0 12px rgba(223, 159, 56, .22);
}

#nexoriaCharacterPanel .nx108-equip-slot {
  background-image: var(--nx108-slot-frame), linear-gradient(145deg, rgba(67, 44, 22, .92), rgba(19, 12, 6, .98));
}

#nexoriaCharacterPanel .nx108-equip-slot span { color: #bda985; }

.nx108-profile-progress {
  border-color: rgba(225, 184, 106, .23);
  background: rgba(24, 15, 7, .64);
}

.nx108-profile-progress dt { color: #bda98a; }
.nx108-profile-progress dd { color: #fff5df; }

.nx108-profile-actions button {
  border-color: rgba(226, 187, 112, .34);
  color: #ead8b7;
  background: rgba(59, 37, 17, .82);
}

.nx108-profile-actions button i { color: #e3b45f; }
.nx108-profile-actions button.is-active {
  border-color: #e9bd66;
  color: #fff8e8;
  background: rgba(133, 82, 31, .82);
}

.nx108-detail-header {
  border-bottom-color: rgba(232, 193, 119, .24);
  background: rgba(75, 47, 20, .58);
}

.nx108-detail-header h3 { color: #f1d9ac; }

#nexoriaCharacterPanel .nx108-character-stats p {
  border-bottom-color: rgba(226, 185, 108, .16);
  color: #bea989;
}

#nexoriaCharacterPanel .nx108-character-stats strong { color: #fff5df; }
#nexoriaCharacterPanel .nx108-character-stats .nx108-set-bonus {
  border-color: rgba(229, 188, 108, .24);
  color: #e5cca0;
  background: rgba(76, 47, 19, .48);
}

#nexoriaCharacterPanel .nx108-bag-heading,
.nx108-trade-heading { border-bottom-color: rgba(229, 188, 111, .22); }

#nexoriaCharacterPanel .nx108-tabs button,
.nx108-page-buttons button,
.nx108-trade-selection button,
.nx108-trade-actions button {
  border-color: rgba(226, 187, 113, .32);
  color: #cdbb9d;
  background: rgba(45, 28, 13, .84);
}

#nexoriaCharacterPanel .nx108-tabs button.is-active,
.nx108-page-buttons button.is-active {
  border-color: #e7b65c;
  color: #fff8e8;
  background: rgba(133, 82, 31, .82);
  box-shadow: inset 0 0 0 1px rgba(255, 226, 168, .09);
}

#nexoriaCharacterPanel .nx108-inventory-grid {
  scrollbar-color: rgba(214, 159, 67, .72) rgba(26, 17, 8, .76);
}

#nexoriaCharacterPanel .nx108-inventory-grid::-webkit-scrollbar-track { background: rgba(26, 17, 8, .76); }
#nexoriaCharacterPanel .nx108-inventory-grid::-webkit-scrollbar-thumb { background: rgba(214, 159, 67, .72); }

#nexoriaCharacterPanel .nx108-inventory-cell {
  border-color: rgba(213, 175, 105, .29);
  background: linear-gradient(145deg, rgba(62, 41, 20, .82), rgba(18, 12, 6, .97));
  box-shadow: inset 0 0 0 1px rgba(255, 225, 166, .025);
}

#nexoriaCharacterPanel .nx108-inventory-cell.has-item {
  border-color: color-mix(in srgb, var(--rarity, #cfb174) 56%, #66461f);
}

.nx108-page-status { color: #ae9a7b; }

.nx108-trade-offer,
.nx108-trade-selection {
  border-color: rgba(219, 179, 104, .23);
  background: rgba(25, 16, 8, .64);
}

.nx108-trade-offer > header strong { color: #f6e6c9; }
.nx108-trade-offer > header span,
.nx108-trade-selection span { color: #b8a385; }

.nx108-trade-slot {
  border-color: rgba(213, 174, 101, .3);
  color: #c6ae85;
  background: linear-gradient(145deg, rgba(61, 40, 19, .78), rgba(18, 11, 5, .97));
}

.nx108-trade-gold,
.nx108-trade-other-gold { color: #c5b08f; }

.nx108-trade-selection {
  border-color: rgba(218, 177, 101, .22);
  background: rgba(24, 15, 7, .56);
}

/* Các khối Bang hội cũ vẫn có thể xuất hiện khi chưa gia nhập; đồng bộ cùng tông mới. */
.nx108-guild-shop {
  background: linear-gradient(145deg, rgba(55, 35, 18, .95), rgba(23, 15, 8, .97));
}

.nx108-guild-shop span,
.nx108-guild-actions label { color: #e7d5b3; }

.nx108-guild-actions form {
  border-color: rgba(230, 191, 116, .24);
  background: rgba(25, 16, 8, .72);
}

.nx108-guild-actions input {
  border-color: rgba(231, 193, 122, .3);
  color: #fff8e8;
  background: rgba(17, 10, 5, .76);
}

/* NEXORIA 1.0.51 — kỹ năng 1–8, phím tắt 1–6 và trình bày trang bị/Kho Rương. */
#nexoriaCharacterPanel .nx108-profile-detail {
  flex-basis: 370px;
  min-width: 340px;
}

#nexoriaCharacterPanel .nx108-character-stats.is-skill-list {
  display: block;
  max-height: 295px;
  padding-right: 7px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(228, 183, 96, .7) rgba(28, 19, 10, .65);
}

#nexoriaCharacterPanel .nx108-skill-line {
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 55px;
  padding: 6px 5px;
}

#nexoriaCharacterPanel .nx108-skill-identity {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
}

#nexoriaCharacterPanel .nx108-skill-row-icon {
  width: 40px;
  height: 40px;
  object-fit: contain;
  border: 1px solid rgba(234, 193, 113, .34);
  border-radius: 50%;
  background: rgba(2, 7, 13, .72);
}

#nexoriaCharacterPanel .nx108-skill-identity strong {
  overflow: hidden;
  color: #fff5df;
  font-size: .78rem;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#nexoriaCharacterPanel .nx108-skill-line.is-unlearned .nx108-skill-identity { opacity: .58; }
#nexoriaCharacterPanel .nx108-skill-row-actions { display: flex; gap: 5px; }
#nexoriaCharacterPanel .nx108-skill-stat-button,
#nexoriaCharacterPanel .nx108-skill-shortcut-button {
  min-width: 66px;
  min-height: 32px;
  padding: 4px 7px;
  border: 1px solid rgba(227, 185, 105, .38);
  border-radius: 7px;
  color: #fff2d2;
  background: rgba(72, 43, 17, .82);
}
#nexoriaCharacterPanel .nx108-skill-shortcut-button:disabled { opacity: .42; }

.nx108-skill-shortcut-card {
  width: min(350px, calc(100vw - 20px));
  padding: 16px 18px;
}
.nx108-skill-shortcut-card > small { font-size: .62rem; }
.nx108-skill-shortcut-card h2 { margin: 2px 0; font-size: 1.15rem; line-height: 1.15; }
.nx108-confirm-card > .nx108-skill-shortcut-slots {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 5px;
  margin: 8px 0 10px;
}
.nx108-skill-shortcut-card .nx108-skill-shortcut-slots > button {
  width: 100%;
  aspect-ratio: 1;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 1px solid rgba(232, 194, 119, .38);
  border-radius: 8px;
  color: #eeddbc;
  background: rgba(28, 18, 9, .88);
  font-weight: 900;
}
.nx108-skill-shortcut-card > div:last-child { gap: 8px; margin-top: 0; }
.nx108-skill-shortcut-card > div:last-child button { min-width: 100px; min-height: 36px; padding: 5px 12px; }
.nx108-skill-shortcut-slots button.is-selected {
  border-color: #ffd777;
  color: #fff;
  background: linear-gradient(180deg, #b26c21, #6e3b12);
  box-shadow: 0 0 9px rgba(255, 204, 100, .28);
}

.nx108-adventure-chest-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nx108-adventure-chest-panel .nx108-page-buttons { grid-template-columns: repeat(5, minmax(38px, 1fr)); }

.nx108-equip-slot.rarity-white .nx108-level-badge,
.nx108-inventory-cell.rarity-white .nx108-level-badge { color: #f3f7fb; }
.nx108-equip-slot.rarity-green .nx108-level-badge,
.nx108-inventory-cell.rarity-green .nx108-level-badge { color: #66e58a; }
.nx108-equip-slot.rarity-purple .nx108-level-badge,
.nx108-inventory-cell.rarity-purple .nx108-level-badge { color: #c078ff; }
.nx108-equip-slot.rarity-gold .nx108-level-badge,
.nx108-inventory-cell.rarity-gold .nx108-level-badge { color: #ffd25a; }

.nx108-weapon-icon {
  transform: rotate(var(--nx108-weapon-icon-rotation, -45deg)) scale(.88);
  transform-origin: center;
}

.nx108-item-icon-frame {
  aspect-ratio: 1;
  border-radius: 7px;
  background: #030609;
}

.nx108-item-icon-frame > img { background: transparent; }

@media (max-width: 700px) {
  #nexoriaCharacterPanel .nx108-profile-detail { min-width: min(340px, 92vw); }
  #nexoriaCharacterPanel .nx108-skill-row-actions { gap: 3px; }
  #nexoriaCharacterPanel .nx108-skill-stat-button,
  #nexoriaCharacterPanel .nx108-skill-shortcut-button { min-width: 58px; padding-inline: 5px; font-size: .67rem; }
}

.nx108-guild-current li small { color: #bda888; }

/* Popup vật phẩm/xác nhận dùng cùng vật liệu; màu hiếm, ngọc và trạng thái vẫn giữ riêng. */
.nx108-item-card,
.nx108-confirm-card {
  border-color: rgba(242, 202, 124, .5);
  background: linear-gradient(155deg, rgba(57, 40, 21, .97), rgba(25, 18, 10, .99));
}

.nx108-item-icon-frame,
.nx108-item-stats,
.nx108-item-future { border-color: rgba(229, 188, 111, .22); }

.nx108-item-stats p { color: #ead9ba; }
.nx108-item-set { border-color: rgba(222, 181, 105, .24); background: rgba(34, 21, 9, .68); }
.nx108-item-set > strong { color: #f0dfc0; }
.nx108-item-set p { color: #9f8b6c; }
.nx108-item-actions button { border-color: rgba(224, 184, 108, .34); color: #ead8b8; background: rgba(43, 27, 13, .9); }

/* 1.0.23 — khung cửa hàng gọn, phần danh sách tự cuộn và không đẩy cao popup. */
:is(
  .nx108-potion-shop-panel,
  .nx108-jewelry-panel,
  .nx108-gem-shop-panel,
  .nx108-spell-shop-panel,
  .nx108-pvp-panel,
  .nx108-pvp-shop-panel,
  .nx108-pawn-panel
) {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  width: min(980px, calc(100vw - 24px));
  height: min(720px, calc(100vh - 7vh));
  height: min(720px, calc(100dvh - 7vh));
  min-height: 0;
  max-height: calc(100vh - 16px);
  max-height: calc(100dvh - 16px);
}

.nx108-potion-shop-panel,
.nx108-jewelry-panel,
.nx108-spell-shop-panel { width: min(780px, calc(100vw - 24px)); }

:is(
  .nx108-potion-shop-panel,
  .nx108-jewelry-panel,
  .nx108-gem-shop-panel,
  .nx108-spell-shop-panel,
  .nx108-pvp-panel,
  .nx108-pvp-shop-panel,
  .nx108-pawn-panel
) > .nx108-panel-header {
  min-width: 0;
  flex: 0 0 auto;
}

:is(
  .nx108-potion-shop-body,
  .nx108-jewelry-body,
  .nx108-gem-shop-body,
  .nx108-spell-shop-body,
  .nx108-pawn-body
) {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 0;
  max-height: none;
  padding: 14px 18px 16px;
  overflow: hidden;
}

.nx108-pawn-body { grid-template-rows: auto auto auto minmax(0, 1fr) auto; gap: 8px; }

:is(
  .nx108-shop-balance,
  .nx108-jewelry-balance,
  .nx108-gem-shop-balance,
  .nx108-spell-shop-balance
) {
  position: relative;
  z-index: 1;
  min-width: 0;
  margin: 0 0 10px;
  color: #ead9b9;
  font-size: .8rem;
  text-align: right;
  white-space: nowrap;
}

:is(
  .nx108-shop-balance,
  .nx108-jewelry-balance,
  .nx108-gem-shop-balance,
  .nx108-spell-shop-balance
) strong { color: var(--nx108-gold); }

:is(
  .nx108-potion-shop-products,
  .nx108-jewelry-products,
  .nx108-spell-shop-products,
  .nx108-gem-shop-products,
  .nx108-gem-combine-products,
  .nx108-pawn-list,
  .nx108-pvp-shop-grid
) {
  min-width: 0;
  min-height: 0;
  align-content: start;
  padding-right: 5px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(214, 159, 67, .72) rgba(26, 17, 8, .76);
}

.nx108-potion-shop-products,
.nx108-jewelry-products,
.nx108-spell-shop-products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 82px;
  gap: 8px;
}

.nx108-potion-product,
.nx108-jewelry-product,
.nx108-spell-shop-product {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  width: 100%;
  height: 82px;
  min-width: 0;
  min-height: 0;
  padding: 7px 9px;
  overflow: hidden;
  border: 1px solid rgba(235, 198, 126, .3);
  border-radius: 10px 4px;
  color: #f7ecd8;
  background: linear-gradient(145deg, rgba(58, 38, 18, .9), rgba(20, 13, 7, .97));
  text-align: left;
}

:is(.nx108-potion-product, .nx108-jewelry-product, .nx108-spell-shop-product) img {
  width: 52px;
  height: 52px;
  object-fit: contain;
}

:is(.nx108-potion-product, .nx108-jewelry-product, .nx108-spell-shop-product) > span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

:is(.nx108-potion-product, .nx108-jewelry-product, .nx108-spell-shop-product) strong {
  min-width: 0;
  overflow: hidden;
  font-family: "Noto Sans", "Segoe UI", Arial, sans-serif;
  font-size: .78rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(.nx108-potion-product, .nx108-jewelry-product, .nx108-spell-shop-product) small {
  min-width: 0;
  overflow: hidden;
  color: #bda98a;
  font-size: .64rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:is(.nx108-potion-product, .nx108-jewelry-product, .nx108-spell-shop-product) b {
  color: #ffe19a;
  font-size: .7rem;
  line-height: 1.15;
}

.nx108-jewelry-details em { font-size: .62rem; }

.nx108-gem-shop-layout {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.nx108-gem-shop-layout > section {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.nx108-gem-shop-products { grid-auto-rows: 62px; }
.nx108-gem-combine-products { grid-auto-rows: minmax(62px, auto); }
.nx108-gem-shop-product,
.nx108-gem-combine-product {
  width: 100%;
  height: 62px;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

/* Nhà PvP: hai bảng hạng và 20 ô placeholder đều cuộn trong phần thân. */
.nx108-pvp-panel,
.nx108-pvp-shop-panel { width: min(940px, calc(100vw - 24px)); }
.nx108-pvp-body {
  display: grid;
  grid-template-rows: auto minmax(150px, 1fr) auto auto;
  gap: 9px;
  min-width: 0;
  min-height: 0;
  padding: 14px 18px 16px;
  overflow: hidden;
}

.nx108-pvp-self {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.nx108-pvp-self span { min-width: 0; padding: 7px; border-radius: 7px; background: rgba(255, 255, 255, .05); color: #cbb99c; text-align: center; }
.nx108-pvp-self b { display: block; margin-top: 2px; color: var(--nx108-gold); }
.nx108-pvp-leaderboards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; min-width: 0; min-height: 0; }
.nx108-pvp-leaderboards > section { display: grid; grid-template-rows: auto minmax(0, 1fr); min-width: 0; min-height: 0; padding: 9px; overflow: hidden; border: 1px solid rgba(235, 198, 126, .22); border-radius: 9px; background: rgba(22, 14, 7, .6); }
.nx108-pvp-leaderboards h3,
.nx108-pvp-shop h3,
.nx108-pawn-body h3 { margin: 0 0 6px; color: #f0cf88; font-size: .74rem; letter-spacing: .08em; }
.nx108-pvp-leaderboards ol { min-height: 0; margin: 0; padding: 0 4px 0 26px; overflow-y: auto; overscroll-behavior: contain; }
.nx108-pvp-leaderboards li { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 6px; padding: 4px 0; color: #e7d7ba; font-size: .7rem; }
.nx108-pvp-leaderboards li.nx108-pvp-empty { display: block; width: 100%; padding: 18px 2px; color: #ad9e87; text-align: center; white-space: nowrap; }
.nx108-pvp-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; }
.nx108-pvp-actions > div { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.nx108-pvp-actions button { min-width: 132px; min-height: 38px; }
.nx108-pvp-actions strong { color: var(--nx108-gold); font-size: .78rem; white-space: nowrap; }
.nx108-pvp-shop-body { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 12px; min-width: 0; min-height: 0; padding: 16px 18px 18px; overflow: hidden; }
.nx108-pvp-shop-body > header { display: flex; align-items: end; justify-content: space-between; gap: 12px; min-width: 0; }
.nx108-pvp-shop-body > header p { margin: 0; color: #d7c4a4; }
.nx108-pvp-shop-body > header strong { color: var(--nx108-gold); }
.nx108-pvp-shop-body > header small { color: #ad9e87; text-align: right; }
.nx108-pvp-shop-body > button { justify-self: start; min-width: 150px; min-height: 38px; }
.nx108-pvp-shop-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: 72px; gap: 6px; }
.nx108-pvp-shop-slot { display: grid; place-items: center; align-content: center; gap: 2px; min-width: 0; min-height: 0; padding: 5px; overflow: hidden; border: 1px solid rgba(235, 198, 126, .24); border-radius: 8px; color: rgba(234, 207, 157, .45); background: rgba(20, 13, 7, .66); text-align: center; }
.nx108-pvp-shop-slot b { font-size: 1.25rem; line-height: 1; }
.nx108-pvp-shop-slot small { font-size: .6rem; }

/* Tiệm Cầm Đồ: vàng/tab/thông báo đứng yên, chỉ các danh sách hợp đồng cuộn. */
.nx108-pawn-panel { width: min(900px, calc(100vw - 24px)); }
.nx108-pawn-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; min-width: 0; }
.nx108-pawn-tabs button { min-width: 0; min-height: 38px; padding: 5px 9px; border: 1px solid rgba(229, 191, 117, .28); border-radius: 7px; color: #cdbb9d; background: rgba(45, 28, 13, .84); }
.nx108-pawn-tabs button.is-active { border-color: #e7b65c; color: #fff8e8; background: rgba(133, 82, 31, .82); }
.nx108-pawn-notices { display: grid; grid-template-rows: auto minmax(0, 1fr); min-width: 0; min-height: 0; max-height: 92px; padding: 7px 9px; overflow: hidden; border: 1px solid rgba(232, 190, 110, .22); border-radius: 8px; background: rgba(29, 18, 8, .68); }
.nx108-pawn-notices h3 { margin-bottom: 4px; }
.nx108-pawn-notices > div { min-height: 0; padding-right: 4px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.nx108-pawn-notices :is(p, li) { margin: 0 0 3px; color: #d7c4a4; font-size: .66rem; line-height: 1.3; overflow-wrap: anywhere; }
.nx108-pawn-body > section:not(.nx108-pawn-notices) { min-width: 0; min-height: 0; overflow: hidden; }
.nx108-pawn-body > section:not(.nx108-pawn-notices):not([hidden]) { display: grid; }
#nx108PawnMine:not([hidden]) { grid-template-rows: auto minmax(64px, 1fr) auto minmax(64px, 1fr); }
#nx108PawnPublic:not([hidden]) { grid-template-rows: auto minmax(0, 1fr); }
.nx108-pawn-list { display: grid; grid-auto-rows: minmax(66px, auto); gap: 6px; }
.nx108-pawn-row { display: grid; grid-template-columns: 50px minmax(0, 1fr) minmax(142px, auto); align-items: center; gap: 8px; min-width: 0; min-height: 66px; padding: 7px; overflow: hidden; border: 1px solid rgba(231, 195, 126, .25); border-radius: 8px; background: rgba(25, 16, 8, .72); }
.nx108-pawn-row img { width: 46px; height: 46px; object-fit: contain; }
.nx108-pawn-row > div { display: grid; min-width: 0; gap: 3px; }
.nx108-pawn-row strong,
.nx108-pawn-row small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nx108-pawn-row strong { color: #f5e5c8; font-size: .74rem; }
.nx108-pawn-row small { color: #b9a587; font-size: .64rem; }
.nx108-pawn-row button { min-width: 0; min-height: 34px; padding: 4px 8px; border: 1px solid rgba(239, 201, 128, .36); border-radius: 6px; color: #fff0ce; background: rgba(98, 60, 23, .84); font-size: .67rem; }
.nx108-pawn-empty { margin: 0; padding: 12px; color: #ad9e87; font-size: .7rem; text-align: center; }

/* Public sale uses two compact columns; the item area opens a read-only detail. */
#nx108PawnListings { grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; }
#nx108PawnListings .nx108-pawn-row.is-public { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto; gap: 4px; padding: 6px; }
#nx108PawnListings .nx108-pawn-inspect { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 6px; width: 100%; min-width: 0; padding: 3px; border-color: transparent; background: transparent; text-align: left; }
#nx108PawnListings .nx108-pawn-inspect img { width: 38px; height: 38px; }
#nx108PawnListings .nx108-pawn-inspect > div { display: grid; gap: 3px; min-width: 0; }
#nx108PawnListings .nx108-pawn-inspect strong { white-space: normal; overflow-wrap: anywhere; }
#nx108PawnListings .nx108-pawn-inspect small { font-size: .6rem; }
#nx108PawnListings .nx108-pawn-action { width: 100%; min-height: 30px; }
#nx108PawnListings > .nx108-pawn-empty { grid-column: 1 / -1; }

/* Popup bán trang bị: nhóm hành động luôn nằm ở đáy vùng cuộn. */
#nx108ItemDetail .nx108-item-content { min-width: 0; }
#nx108ItemDetail .nx108-item-actions {
  position: sticky;
  z-index: 2;
  bottom: -13px;
  margin: 8px -4px -13px;
  padding: 7px 4px 13px;
  background: linear-gradient(180deg, rgba(25, 18, 10, 0), rgba(25, 18, 10, .98) 24%);
}
#nx108ItemDetail .nx108-item-actions button { min-width: 0; overflow-wrap: anywhere; }

@media (max-width: 640px) {
  .nx108-layer:has(> .nx108-forge-panel) { padding: 8px; }
  .nx108-forge-panel {
    width: 100%;
    height: calc(100dvh - 16px);
    max-height: calc(100dvh - 16px);
  }
  .nx108-forge-layout {
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(150px, 1fr);
    gap: 8px;
    padding: 8px 10px 10px;
  }
  .nx108-forge-stage { padding: 8px; }

  .nx108-layer:has(> :is(.nx108-potion-shop-panel, .nx108-jewelry-panel, .nx108-gem-shop-panel, .nx108-spell-shop-panel, .nx108-pvp-panel, .nx108-pvp-shop-panel, .nx108-pawn-panel)) {
    padding: 8px;
  }

  :is(
    .nx108-potion-shop-panel,
    .nx108-jewelry-panel,
    .nx108-gem-shop-panel,
    .nx108-spell-shop-panel,
    .nx108-pvp-panel,
    .nx108-pvp-shop-panel,
    .nx108-pawn-panel
  ) {
    width: 100%;
    height: calc(100vh - 16px);
    height: calc(100dvh - 16px);
    max-height: none;
    border-radius: 13px 5px;
  }

  :is(
    .nx108-potion-shop-panel,
    .nx108-jewelry-panel,
    .nx108-gem-shop-panel,
    .nx108-spell-shop-panel,
    .nx108-pvp-panel,
    .nx108-pvp-shop-panel,
    .nx108-pawn-panel
  ) > .nx108-panel-header {
    min-height: 62px;
    padding: 8px 10px 8px 14px;
  }

  :is(
    .nx108-potion-shop-panel,
    .nx108-jewelry-panel,
    .nx108-gem-shop-panel,
    .nx108-spell-shop-panel,
    .nx108-pvp-panel,
    .nx108-pvp-shop-panel,
    .nx108-pawn-panel
  ) > .nx108-panel-header h2 {
    max-width: calc(100vw - 92px);
    overflow: hidden;
    font-size: 1.05rem;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  :is(
    .nx108-potion-shop-panel,
    .nx108-jewelry-panel,
    .nx108-gem-shop-panel,
    .nx108-spell-shop-panel,
    .nx108-pvp-panel,
    .nx108-pvp-shop-panel,
    .nx108-pawn-panel
  ) > .nx108-panel-header small { font-size: .58rem; letter-spacing: .12em; }

  :is(
    .nx108-potion-shop-body,
    .nx108-jewelry-body,
    .nx108-gem-shop-body,
    .nx108-spell-shop-body,
    .nx108-pvp-body,
    .nx108-pvp-shop-body,
    .nx108-pawn-body
  ) { padding: 10px; }

  .nx108-potion-shop-products,
  .nx108-jewelry-products,
  .nx108-spell-shop-products { grid-template-columns: 1fr; grid-auto-rows: 72px; }

  .nx108-potion-product,
  .nx108-jewelry-product,
  .nx108-spell-shop-product { grid-template-columns: 48px minmax(0, 1fr); height: 72px; padding: 5px 7px; }

  :is(.nx108-potion-product, .nx108-jewelry-product, .nx108-spell-shop-product) img { width: 44px; height: 44px; }
  .nx108-gem-shop-layout { grid-template-columns: 1fr; grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .nx108-gem-shop-layout > section { padding: 9px; }
  .nx108-gem-shop-products { grid-template-columns: 1fr; }

  .nx108-pvp-body { grid-template-rows: auto minmax(150px, 1fr) auto auto; gap: 7px; }
  .nx108-pvp-self { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nx108-pvp-self span { padding: 4px; font-size: .65rem; }
  .nx108-pvp-leaderboards { gap: 6px; }
  .nx108-pvp-leaderboards > section { padding: 6px; }
  .nx108-pvp-leaderboards li { grid-template-columns: 18px minmax(0, 1fr); font-size: .62rem; }
  .nx108-pvp-leaderboards li strong { grid-column: 2; }
  .nx108-pvp-leaderboards li.nx108-pvp-empty { font-size: .56rem; }
  .nx108-pvp-actions { align-items: flex-end; }
  .nx108-pvp-actions > div { flex-wrap: nowrap; }
  .nx108-pvp-actions button { min-width: 0; padding-inline: 10px; }
  .nx108-pvp-shop-body > header { align-items: start; }
  .nx108-pvp-shop-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 62px; }

  .nx108-pawn-body { gap: 6px; }
  .nx108-pawn-tabs button { min-height: 34px; padding-inline: 4px; font-size: .68rem; }
  .nx108-pawn-notices { max-height: 76px; padding: 5px 7px; }
  .nx108-pawn-row { grid-template-columns: 42px minmax(0, 1fr); min-height: 62px; padding: 6px; }
  .nx108-pawn-row img { width: 38px; height: 38px; }
  .nx108-pawn-row > button { grid-column: 1 / -1; min-height: 30px; }

  #nx108ItemDetail .nx108-item-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #nx108ItemDetail .nx108-item-actions button { padding-inline: 2px; font-size: .62rem; }
}

/* 1.0.32 — chọn Phe trước, sau đó mới chọn hoặc tạo nhân vật. */
#nexoriaCharacterFlow .nx108-flow-card {
  width: min(1180px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  padding: clamp(14px, 2.2vw, 28px);
  overflow-x: hidden;
}

#nexoriaCharacterFlow .nx108-flow-card[data-flow-stage="faction"] {
  width: min(1120px, calc(100vw - 32px));
}

.nx108-faction-step {
  display: grid;
  justify-items: center;
  gap: clamp(12px, 2vh, 20px);
}

.nx108-faction-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 24px);
  width: 100%;
}

.nx108-faction-card {
  position: relative;
  display: block;
  aspect-ratio: 1 / .84;
  min-height: 300px !important;
  padding: 0;
  overflow: hidden;
  border: 2px solid rgba(231, 200, 140, .48) !important;
  border-radius: 18px 7px !important;
  isolation: isolate;
  background: #17110c !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .5);
}

.nx108-faction-card::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 42% 0 0;
  background: linear-gradient(180deg, transparent, rgba(6, 5, 8, .22) 25%, rgba(5, 4, 7, .88));
  pointer-events: none;
}

.nx108-faction-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 37%;
  transition: transform .22s ease, filter .22s ease;
}

.nx108-faction-card strong {
  position: absolute;
  z-index: 2;
  right: 12px;
  bottom: clamp(17px, 3.2vh, 34px);
  left: 12px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4.2vw, 3.65rem);
  font-weight: 950;
  line-height: .96;
  letter-spacing: .075em;
  text-align: center;
  text-transform: uppercase;
}

.nx108-faction-card.is-aether strong {
  color: #fff8dc;
  text-shadow: 0 2px 0 #936a1e, 0 0 7px #fff2a3, 0 0 18px #4bb7ff, 0 0 34px rgba(37, 139, 255, .95);
}

.nx108-faction-card.is-umbra strong {
  color: #eee9ff;
  text-shadow: 0 2px 0 #57396d, 0 0 7px #f4eaff, 0 0 18px #a34fff, 0 0 34px rgba(125, 48, 255, .95);
}

.nx108-faction-card:is(:hover, :focus-visible, .is-selected) img { transform: scale(1.035); }
.nx108-faction-card.is-aether:is(:hover, :focus-visible, .is-selected) { border-color: #ffe596 !important; box-shadow: 0 0 0 2px rgba(255, 241, 175, .22), 0 0 32px rgba(42, 151, 255, .7); }
.nx108-faction-card.is-umbra:is(:hover, :focus-visible, .is-selected) { border-color: #e4c7ff !important; box-shadow: 0 0 0 2px rgba(225, 195, 255, .2), 0 0 32px rgba(147, 65, 255, .72); }
.nx108-faction-card:not(.is-selected) img { filter: saturate(.78) brightness(.82); }
.nx108-faction-continue { min-width: min(260px, 72vw); min-height: 50px; font-size: 1.08rem !important; }

#nexoriaCharacterFlow .nx108-flow-card[data-flow-stage="characters"] > .nx108-title { display: none; }
#nexoriaCharacterFlow .nx108-flow-card[data-flow-stage="characters"] .nx108-create {
  grid-template-columns: minmax(470px, 1.22fr) minmax(300px, .78fr);
  align-items: stretch;
  gap: clamp(18px, 3vw, 42px);
  min-height: min(570px, calc(100dvh - 90px));
}

#nexoriaCharacterFlow .nx108-model-picker {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

#nexoriaCharacterFlow .nx108-model-picker > legend {
  padding: 0 0 10px;
  color: #fff1cd;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.25rem, 2.1vw, 1.8rem);
}

#nexoriaCharacterFlow .nx108-model-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: clamp(8px, 1.2vw, 14px);
  min-height: 0;
}

#nexoriaCharacterFlow .nx108-model-choice {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: 210px !important;
  padding: 7px 7px 5px;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(137, 87, 35, .58), rgba(28, 18, 9, .94)) !important;
}

#nexoriaCharacterFlow .nx108-model-choice > span {
  position: relative;
  z-index: 2;
  min-height: 27px;
  color: #fff0cf;
  font-size: clamp(.7rem, 1.1vw, .88rem);
}

#nexoriaCharacterFlow .nx108-model-choice[data-model-available="false"] {
  opacity: .68;
  background: linear-gradient(180deg, rgba(99, 61, 26, .38), rgba(23, 15, 8, .9)) !important;
}

#nexoriaCharacterFlow .nx108-create-fields {
  align-content: center;
  gap: 13px;
  padding: clamp(10px, 2vw, 24px) 0;
}

#nexoriaCharacterFlow .nx108-create-fields > label { font-family: Georgia, serif; font-size: clamp(1.25rem, 2.2vw, 1.8rem); }
#nexoriaCharacterFlow .nx108-name-row input { min-height: 58px; font-size: 1.05rem; }
#nexoriaCharacterFlow .nx108-create-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 5px; }
#nexoriaCharacterFlow .nx108-create-actions button,
#nexoriaCharacterFlow .nx108-flow-actions button { min-height: 48px; }

#nexoriaCharacterFlow .nx108-flow-actions { gap: 10px; }
#nexoriaCharacterFlow .nx108-flow-actions #nx108FactionBack { min-width: 150px; }
#nexoriaCharacterFlow .nx108-character-list-empty { margin: min(20vh, 160px) auto 0; color: #e4cfad; text-align: center; }

@media (max-width: 980px) and (min-height: 501px) {
  #nexoriaCharacterFlow .nx108-flow-card[data-flow-stage="characters"] .nx108-create {
    grid-template-columns: minmax(390px, 1.15fr) minmax(250px, .85fr);
    gap: 16px;
  }
  #nexoriaCharacterFlow .nx108-model-choice { min-height: 176px !important; }
}

@media (max-height: 500px) and (orientation: landscape) {
  #nexoriaCharacterFlow { padding: 5px; }
  #nexoriaCharacterFlow .nx108-flow-card,
  #nexoriaCharacterFlow .nx108-flow-card[data-flow-stage="faction"] {
    width: min(100%, 1040px);
    height: calc(100dvh - 10px);
    max-height: calc(100dvh - 10px);
    padding: 7px 12px;
  }
  #nexoriaCharacterFlow .nx108-title > small { font-size: .57rem; }
  #nexoriaCharacterFlow .nx108-title h2 { margin-top: 1px; font-size: 1.2rem; }
  #nexoriaCharacterFlow .nx108-faction-step { grid-template-rows: minmax(0, 1fr) auto; gap: 6px; height: calc(100% - 39px); }
  #nexoriaCharacterFlow .nx108-faction-cards { min-height: 0; gap: 9px; }
  #nexoriaCharacterFlow .nx108-faction-card { aspect-ratio: auto; min-height: 0 !important; height: 100%; border-radius: 11px 4px !important; }
  #nexoriaCharacterFlow .nx108-faction-card strong { bottom: 10px; font-size: clamp(1.2rem, 4vw, 1.8rem); }
  #nexoriaCharacterFlow .nx108-faction-continue { min-height: 38px; height: 38px; padding-block: 0; font-size: .82rem !important; }

  #nexoriaCharacterFlow .nx108-flow-card[data-flow-stage="characters"] { overflow-y: auto; }
  #nexoriaCharacterFlow .nx108-flow-card[data-flow-stage="characters"] .nx108-create {
    grid-template-columns: minmax(430px, 1.25fr) minmax(245px, .75fr);
    gap: 11px;
    min-height: 100%;
    height: 100%;
  }
  #nexoriaCharacterFlow .nx108-model-picker > legend { padding-bottom: 3px; font-size: .9rem; }
  #nexoriaCharacterFlow .nx108-model-grid { gap: 5px; }
  #nexoriaCharacterFlow .nx108-model-choice { min-height: 0 !important; padding: 3px; border-radius: 7px; }
  #nexoriaCharacterFlow .nx108-model-choice > span { min-height: 17px; padding: 2px; font-size: .54rem; }
  #nexoriaCharacterFlow .nx108-create-fields { gap: 6px; padding: 5px 0; }
  #nexoriaCharacterFlow .nx108-create-fields > label { font-size: 1rem; }
  #nexoriaCharacterFlow .nx108-name-row input { min-height: 41px; height: 41px; font-size: .82rem; }
  #nexoriaCharacterFlow .nx108-message { font-size: .67rem; }
  #nexoriaCharacterFlow .nx108-create-actions { gap: 5px; }
  #nexoriaCharacterFlow .nx108-create-actions button { min-height: 39px; padding: 4px 8px; font-size: .69rem; }
  #nexoriaCharacterFlow .nx108-character-list { margin: 4px 0; }
  #nexoriaCharacterFlow .nx108-character-choice { min-height: 245px !important; }
  #nexoriaCharacterFlow .nx108-flow-actions { margin-top: 5px; }
  #nexoriaCharacterFlow .nx108-flow-actions button { min-height: 38px; }
}

@media (max-width: 700px) and (orientation: portrait) {
  #nexoriaCharacterFlow .nx108-faction-cards { grid-template-columns: 1fr; }
  #nexoriaCharacterFlow .nx108-faction-card { min-height: 280px !important; }
  #nexoriaCharacterFlow .nx108-flow-card[data-flow-stage="characters"] .nx108-create { grid-template-columns: 1fr; min-height: auto; }
  #nexoriaCharacterFlow .nx108-model-choice { min-height: 140px !important; }
}

/* NEXORIA 1.0.35 — MAPTNV 20×6, ba mẫu nhân vật đứng trực tiếp trong cảnh 3D. */
#nexoriaCharacterFlow .nx108-flow-card[data-character-view="maptnv"] {
  width: 100vw;
  height: 100dvh;
  max-height: none;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, #7cccf1 0%, #d8eff4 56%, #5c9b4b 100%);
  box-shadow: none;
}

#nexoriaCharacterFlow .nx108-flow-card[data-character-view="maptnv"]::before { display: none; }

#nexoriaCharacterFlow .nx108-flow-card[data-character-view="maptnv"] .nx108-maptnv {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  isolation: isolate;
}

.nx108-maptnv-canvas {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  touch-action: none;
}

.nx108-maptnv-status {
  position: absolute;
  z-index: 5;
  top: max(12px, env(safe-area-inset-top));
  left: 50%;
  max-width: min(70vw, 520px);
  padding: 7px 14px;
  transform: translateX(-50%);
  border: 1px solid rgba(255, 238, 190, .55);
  border-radius: 999px;
  color: #fff7df;
  background: rgba(25, 17, 8, .76);
  box-shadow: 0 5px 18px rgba(0, 0, 0, .28);
  font-size: clamp(.66rem, 1.3vw, .82rem);
  text-align: center;
  pointer-events: none;
}

#nexoriaCharacterFlow .nx108-maptnv-faction-back {
  position: absolute;
  z-index: 8;
  top: max(12px, env(safe-area-inset-top));
  right: max(14px, env(safe-area-inset-right));
  min-width: clamp(88px, 11vw, 132px);
  min-height: 42px;
  padding: 0 16px;
  border-color: rgba(255, 229, 169, .68) !important;
  color: #fff5da;
  background: linear-gradient(180deg, rgba(137, 87, 35, .95), rgba(48, 29, 12, .96)) !important;
  box-shadow: 0 7px 18px rgba(0, 0, 0, .35);
  font-weight: 800;
}

#nexoriaCharacterFlow .nx108-maptnv .nx108-model-picker {
  position: absolute;
  z-index: 3;
  inset: 0;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  pointer-events: none;
}

#nexoriaCharacterFlow .nx108-maptnv .nx108-model-picker > legend {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

#nexoriaCharacterFlow .nx108-maptnv .nx108-model-grid {
  position: absolute;
  inset: 10% 7% 4%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: 1fr;
  gap: 6%;
  pointer-events: none;
}

#nexoriaCharacterFlow .nx108-maptnv .nx108-model-choice {
  position: relative;
  display: block;
  min-height: 0 !important;
  padding: 0;
  border: 1px solid transparent !important;
  border-radius: 45% 45% 12px 12px;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  outline: none !important;
  pointer-events: auto;
}

#nexoriaCharacterFlow .nx108-maptnv .nx108-model-choice[data-model-available="false"] { display: none; }

#nexoriaCharacterFlow .nx108-maptnv .nx108-model-choice > span {
  position: absolute;
  right: 8%;
  bottom: 1%;
  left: 8%;
  display: block;
  min-height: 0;
  padding: 4px 7px;
  border: 1px solid rgba(255, 227, 165, .24);
  border-radius: 999px;
  color: rgba(255, 247, 225, .88);
  background: rgba(24, 16, 8, .48);
  font-size: clamp(.58rem, 1vw, .76rem);
  text-align: center;
  text-shadow: 0 1px 3px #000;
}

#nexoriaCharacterFlow .nx108-maptnv .nx108-model-choice:is(:hover, :focus, :focus-visible, :active),
#nexoriaCharacterFlow .nx108-maptnv .nx108-model-choice.is-selected {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  outline: none !important;
}

#nexoriaCharacterFlow .nx108-maptnv .nx108-model-choice:active:not(:disabled) {
  transform: none;
}

#nexoriaCharacterFlow .nx108-maptnv[data-maptnv-view="detail"] .nx108-model-picker { display: none; }

#nexoriaCharacterFlow .nx108-maptnv .nx108-create-fields {
  position: absolute;
  z-index: 7;
  top: 50%;
  right: clamp(16px, 5vw, 74px);
  display: grid;
  align-content: center;
  width: min(360px, 34vw);
  min-width: 250px;
  gap: 9px;
  padding: clamp(14px, 2vw, 24px);
  transform: translateY(-36%);
  border: 1px solid rgba(245, 211, 145, .55);
  border-radius: 15px 5px 15px 5px;
  color: #fff7e3;
  background: linear-gradient(155deg, rgba(55, 38, 20, .94), rgba(19, 13, 7, .96));
  box-shadow: 0 16px 38px rgba(0, 0, 0, .52), inset 0 1px rgba(255, 255, 255, .08);
}

#nexoriaCharacterFlow .nx108-maptnv .nx108-create-fields > label {
  color: #fff0cc;
  font-size: clamp(1rem, 1.8vw, 1.45rem);
}

#nexoriaCharacterFlow .nx108-maptnv .nx108-name-row input { min-height: 48px; }
#nexoriaCharacterFlow .nx108-maptnv .nx108-create-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
#nexoriaCharacterFlow .nx108-maptnv .nx108-create-actions button { min-height: 43px; padding: 5px 8px; }

@media (max-height: 500px) and (orientation: landscape) {
  #nexoriaCharacterFlow .nx108-flow-card[data-character-view="maptnv"],
  #nexoriaCharacterFlow .nx108-flow-card[data-character-view="maptnv"] .nx108-maptnv {
    width: 100vw;
    height: 100dvh;
    max-height: none;
    padding: 0;
    overflow: hidden;
  }
  #nexoriaCharacterFlow .nx108-maptnv .nx108-model-grid { inset: 8% 7% 2%; }
  #nexoriaCharacterFlow .nx108-maptnv .nx108-create-fields {
    right: clamp(12px, 3vw, 40px);
    width: min(330px, 34vw);
    min-width: 225px;
    gap: 5px;
    padding: 10px 12px;
    transform: translateY(-34%);
  }
  #nexoriaCharacterFlow .nx108-maptnv .nx108-name-row input { min-height: 39px; height: 39px; }
  #nexoriaCharacterFlow .nx108-maptnv .nx108-message { font-size: .65rem; }
  #nexoriaCharacterFlow .nx108-maptnv .nx108-create-actions button { min-height: 37px; }
}

@media (max-width: 700px) and (orientation: portrait) {
  #nexoriaCharacterFlow .nx108-flow-card[data-character-view="maptnv"] .nx108-maptnv { min-height: 100%; }
  #nexoriaCharacterFlow .nx108-maptnv .nx108-model-grid { inset: 8% 2% 8%; gap: 1%; }
  #nexoriaCharacterFlow .nx108-maptnv .nx108-create-fields {
    top: auto;
    right: 4vw;
    bottom: max(12px, env(safe-area-inset-bottom));
    left: 4vw;
    width: auto;
    min-width: 0;
    transform: none;
  }
}

/* NEXORIA 1.0.50 — Kho Rương Thám hiểm tại Nhà Thám hiểm Map1. */
.nx108-adventure-chest-panel {
  display: flex;
  flex-direction: column;
  width: min(620px, 96vw);
  height: min(570px, 92vh);
  height: min(570px, 92dvh);
  padding: 0 14px 12px;
  border-color: rgba(239, 201, 128, .55);
  background: linear-gradient(180deg, rgba(52, 35, 18, .99), rgba(22, 15, 8, .995));
  overflow: hidden;
}

.nx108-adventure-chest-panel::before { display: none; }

.nx108-adventure-chest-header {
  flex: 0 0 auto;
  margin: 0 -14px 10px;
  min-height: 64px;
  padding: 9px 14px 9px 18px;
}

.nx108-adventure-chest-header > div:last-child {
  display: flex;
  align-items: center;
  gap: 9px;
}

.nx108-adventure-chest-header h2 { margin: 2px 0 0; font-size: clamp(1.1rem, 2vw, 1.5rem); }
.nx108-adventure-chest-header small { color: #e3b45f; font-size: .67rem; }
.nx108-adventure-chest-header strong { color: #ffd777; font-size: .8rem; white-space: nowrap; }
.nx108-adventure-chest-header strong.is-full { color: var(--nx108-danger); }
.nx108-adventure-chest-header .nx108-close { width: 35px; height: 35px; font-size: 1.35rem !important; }

.nx108-adventure-chest-tabs {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 9px;
}

.nx108-adventure-chest-tabs button,
.nx108-adventure-chest-panel .nx108-page-buttons button {
  min-height: 34px;
  padding: 5px 10px;
  border: 1px solid rgba(226, 187, 113, .32);
  border-radius: 7px;
  color: #cdbb9d;
  background: rgba(45, 28, 13, .84);
}

.nx108-adventure-chest-tabs button.is-active,
.nx108-adventure-chest-panel .nx108-page-buttons button.is-active {
  border-color: #e7b65c;
  color: #fff8e8;
  background: rgba(133, 82, 31, .82);
}

.nx108-adventure-chest-panel .nx108-page-bank { margin-bottom: 8px; }
.nx108-adventure-chest-panel .nx108-page-buttons { grid-template-columns: repeat(4, minmax(38px, 1fr)); }

.nx108-adventure-chest-grid {
  grid-template-columns: repeat(6, minmax(48px, 1fr));
  align-content: start;
  flex: 1 1 auto;
  min-height: 0;
  gap: 6px;
  padding-right: 5px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(214, 159, 67, .72) rgba(26, 17, 8, .76);
}

.nx108-adventure-chest-grid .nx108-inventory-cell {
  border-color: rgba(213, 175, 105, .29);
  background: linear-gradient(145deg, rgba(62, 41, 20, .82), rgba(18, 12, 6, .97));
}

.nx108-adventure-chest-footer {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 30px;
  padding-top: 7px;
}

.nx108-adventure-chest-footer .nx108-page-status { margin: 0; white-space: nowrap; }
.nx108-adventure-chest-footer .nx108-message { min-height: 1.2em; text-align: right; }

@media (max-height: 520px) and (orientation: landscape) {
  .nx108-adventure-chest-layer { padding: 6px 2vw; }
  .nx108-adventure-chest-panel { height: calc(100dvh - 12px); }
  .nx108-adventure-chest-header { min-height: 52px; padding-top: 5px; padding-bottom: 5px; }
  .nx108-adventure-chest-grid { grid-template-columns: repeat(8, minmax(42px, 1fr)); }
}
/* 1.0.95: guild lots keep their own timer; the grid contains exactly 40 slots. */
.nx195-guild-auction-rule { margin: 6px 0 10px; color: #dbc29a; font-size: 12px; line-height: 1.4; }
/* Shares Shop Bang's frame, background, icon, button and responsive columns. */
.nx195-guild-rewards-grid { grid-auto-rows: minmax(165px, auto); max-height: min(50vh, 440px); overscroll-behavior: contain; touch-action: pan-y; scrollbar-width: thin; scrollbar-color: #c8a65e #21170d; }
.nx195-guild-reward-slot strong { line-height: 1.25; white-space: normal; }
.nx195-guild-reward-slot b { color: #efc973; font-size: 13px; }
.nx195-guild-reward-slot small { font-size: 11px; overflow-wrap: anywhere; }
.nx195-guild-reward-slot time { font-size: 12px; font-variant-numeric: tabular-nums; color: #f3dcac; }
.nx195-guild-reward-slot button { width: 100%; padding: 5px 7px; font-size: 11px; }
.nx195-guild-claims { margin-top: 12px; padding: 10px; border: 1px solid #bc9d60; border-radius: 8px; }
.nx195-guild-claims p { margin: 5px 0; font-size: 12px; }
.nx195-guild-claims > div > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 5px 0; }
.nx108-guild-disband-vote button[aria-pressed="true"] { border-color: #efd190; box-shadow: inset 0 0 0 1px #efd190; }

/* 1.0.96: identity badge occupies the existing header, never the paperdoll footer. */
#nexoriaCharacterPanel .nx108-profile-identity { min-width: 0; flex: 1 1 0; overflow: hidden; }
#nexoriaCharacterPanel .nx108-profile-name-line { display: flex; align-items: center; gap: 7px; height: 30px; min-width: 0; overflow: hidden; }
#nexoriaCharacterPanel .nx108-profile-name-line #nx108ProfileName { flex: 0 1 auto; min-width: 0; max-width: 48%; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.1; }
#nexoriaCharacterPanel .nx108-profile-name-line #nx108ProfileMapct1Badge { flex: 0 1 64px; width: 64px; min-width: 28px; height: 30px; max-height: 30px; object-fit: contain; }
#nexoriaCharacterPanel .nx108-profile-name-line #nx108ProfileFaction { flex: 0 0 auto; color: #e7cb85; font-size: .65rem; font-weight: 700; letter-spacing: .03em; white-space: nowrap; }
#nexoriaCharacterPanel .nx108-profile-header-actions { flex: 0 0 auto; }
#nexoriaCharacterPanel .nx108-profile-mapct1 { min-width: 0; }
#nexoriaCharacterPanel .nx108-profile-mapct1 span { white-space: nowrap; font-size: clamp(.58rem, 1.4vw, .72rem); }
.nx196-item-stars { display: block; margin: 5px 0; color: #f3d775; }
.nx196-enchant-bonus { color: #ffcf55; font-weight: 700; }
.nx108-forge-panel.is-inherit { width: min(850px, 97vw); height: min(540px, calc(100dvh - 16px)); }
.nx196-inherit { display: grid; grid-template-columns: minmax(190px, 1.15fr) minmax(145px, 1fr) minmax(145px, 1fr); gap: 12px; padding: 10px 14px 14px; min-height: 0; overflow: hidden; }
.nxpost-inherit-stage { padding: 12px 8px; overflow-y: auto; scrollbar-width: thin; }
.nxpost-inherit-pair { display: flex; justify-content: center; gap: 8px; width: 100%; }
.nx196-inherit-selected { flex: 0 1 100px; width: 100px; height: 112px; min-width: 0; padding: 6px; font-size: .65rem; }
.nx196-inherit-selected img { width: 65px; height: 65px; object-fit: contain; }
.nx196-inherit-selected span { display: block; width: 100%; min-width: 0; max-height: 28px; overflow: hidden; line-height: 1.15; }
.nxpost-inherit-pane { display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; gap: 6px; min-width: 0; min-height: 0; overflow: hidden; }
.nxpost-inherit-pane h3 { margin: 0; color: #e9ca8a; font-size: .72rem; }
.nxpost-inherit-pane > p { margin: 0; color: var(--nx108-muted); font-size: .67rem; line-height: 1.3; }
.nx196-inherit-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: max-content; align-content: start; gap: 5px; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-gutter: stable; }
.nx196-inherit-list .nx108-inventory-cell { min-width: 0; width: 100%; aspect-ratio: 1; min-height: 0; }
.nx196-inherit-list .nx108-inventory-cell img { width: 80%; height: 80%; object-fit: contain; }
.nx196-inherit-list .nx108-bind-tag { font-size: .48rem; }
.nxpost-inherit-equipped { grid-template-rows: repeat(3, max-content); }
.nxpost-inherit-bag { overflow-y: scroll; }
.nxpost-inherit-stage > p { font-size: .7rem; line-height: 1.35; margin: 8px 0; }
.nxpost-inherit-stage > .nxpost-inherit-rule { color: var(--nx108-muted); font-size: .65rem; }
.nxpost-inherit-pages { display: flex; justify-content: center; gap: 6px; }
.nxpost-inherit-pages[hidden] { display: none; }
.nxpost-inherit-pages button { min-width: 30px; padding: 3px; }
.nx196-inherit-actions { display: flex; justify-content: center; gap: 10px; }
#nx196InheritPreview, #nx108ConfirmMessage { white-space: pre-line; }
.nx196-inherit-actions button { min-width: 70px; min-height: 34px; padding: 6px 8px; }
.nxpost-purchase-quantity { margin: 16px 0; padding: 10px; border: 1px solid #9c7948; border-radius: 8px; }
.nxpost-purchase-quantity legend { color: #efd3a1; padding: 0 6px; }
.nxpost-purchase-quantity > div { display: flex; align-items: center; justify-content: center; gap: 6px; }
.nx108-confirm-card .nxpost-purchase-quantity button { min-width: 36px; min-height: 34px; padding: 5px 8px; }
.nxpost-purchase-quantity input { width: 90px; min-width: 0; min-height: 34px; padding: 5px; color: #fff0d2; background: #17120c; border: 1px solid #c9a25d; border-radius: 5px; text-align: center; font-size: 1rem; }
.nxpost-purchase-quantity small { display: block; margin-top: 8px; color: #e1c594; }
@media (max-width: 650px) {
  .nx196-inherit { grid-template-columns: minmax(150px, 1.05fr) minmax(110px, 1fr) minmax(110px, 1fr); gap: 7px; padding: 7px; }
  .nx196-inherit-selected { height: 94px; }
  .nx196-inherit-selected img { width: 50px; height: 50px; }
  .nxpost-inherit-stage { padding: 8px 5px; }
  .nxpost-inherit-pair { gap: 5px; }
}
@media (max-width: 420px) {
  .nx196-inherit { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow-y: auto; }
  .nxpost-inherit-stage { grid-column: 1 / -1; max-height: 250px; }
  .nxpost-inherit-pane { height: 250px; }
}
#nexoriaBlacksmithPanel .nx108-forge-tabs { flex-wrap: nowrap; }
#nexoriaBlacksmithPanel .nx108-forge-tabs button { min-width: 0; padding-inline: 8px; font-size: .72rem; }
#nexoriaStarPanel .nx108-enchant-body { overflow-y: auto; min-height: 0; }
#nexoriaStarPanel .nx108-enchant-body > p { margin: 4px 0; font-size: .78rem; }
#nx196StarItems { max-height: 230px; overflow-y: auto; }
.nx108-pvp-shop-slot.nx196-star-product { color: #f3d995; cursor: pointer; }
.nx196-star-product img { width: 30px; height: 30px; object-fit: contain; }
.nx196-star-product strong { font-size: .65rem; line-height: 1; }
.nx196-star-product:disabled { cursor: default; opacity: .55; }
.nx108-pvp-shop-grid { overflow-y: auto; min-height: 0; overscroll-behavior: contain; }
/* Attribute hidden must win over panel layout displays. */
#nx196Inherit[hidden], #nexoriaBlacksmithPanel .nx108-forge-layout[hidden], #nx108ItemStars[hidden], #nx108ProfileMapct1Badge[hidden] { display: none; }

#nexoriaStarPanel .nx108-enchant-panel { display: grid; grid-template-rows: auto minmax(0, 1fr); max-height: calc(100dvh - 28px); }
#nexoriaStarPanel .nx108-enchant-body { padding: 12px 16px; }
@media (max-width: 420px) {
  #nx196StarItems { grid-template-columns: 1fr; }
  .nx196-inherit-list .nx108-enchant-item { grid-template-columns: 32px minmax(0, 1fr); padding: 5px; gap: 5px; font-size: .68rem; }
  .nx196-inherit-list .nx108-enchant-item img { width: 30px; height: 30px; }
  #nexoriaBlacksmithPanel .nx108-forge-tabs button { font-size: .62rem; padding-inline: 5px; }
}

/* 1.0.97 — guild balances and tabs remain above the independently scrolled page. */
.nx108-guild-panel { display:flex; flex-direction:column; width:min(1160px,96vw); max-height:94vh; }
.nx108-guild-panel > .nx108-guild-balance { flex:none; justify-content:flex-start; gap:8px 24px; padding:10px 18px; border-bottom:1px solid rgba(237,199,126,.18); background:rgba(17,12,7,.68); }
.nx108-guild-panel > .nx108-guild-nav { display:flex; flex:none; flex-wrap:nowrap; gap:4px; margin:8px 14px 0; overflow-x:auto; scrollbar-width:thin; }
.nx108-guild-nav button { flex:1 0 auto; padding:0 12px; white-space:nowrap; }
.nx108-guild-body { flex:1 1 auto; min-height:0; max-height:none; display:flex; flex-direction:column; gap:8px; padding:10px 14px 14px; overscroll-behavior:contain; }
.nx108-guild-body > .nx108-guild-view, .nx108-guild-body > .nx108-guild-current { flex:1 0 auto; min-height:180px; }
.nx108-guild-current-header { grid-template-columns:52px minmax(0,1fr) auto; gap:8px; }
.nx108-guild-current-emblem { width:52px; min-height:52px; }
.nx108-guild-current-emblem img { width:46px; height:42px; }
.nx108-guild-current-header p { margin:2px 0; font-size:.76rem; }
.nx197-guild-member-section { margin-top:10px; }
.nx197-guild-member-head, .nx108-guild-member-profile { display:grid; grid-template-columns:minmax(80px,1.3fr) minmax(68px,.9fr) 48px minmax(108px,1.4fr); gap:8px; align-items:center; }
.nx197-guild-member-head { padding:9px 12px; color:#f8d98f; font-size:.75rem; border-bottom:1px solid rgba(237,199,126,.28); }
.nx108-guild-current #nx108GuildMembers { display:block; max-height:clamp(180px,38vh,390px); margin:0; overflow:auto; scrollbar-gutter:stable; }
.nx108-guild-current .nx108-guild-member { display:block !important; padding:0; margin:5px 0; }
.nx108-guild-member-profile { width:100%; min-height:43px; padding:8px 12px; font-size:.78rem; }
.nx108-guild-member-profile > span { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.nx108-guild-member-profile .nx197-member-online { color:#b6e88b; }
.nx108-guild-member-profile .nx197-member-offline { color:#b8afa0; }
.nx108-guild-member-actions { padding:0 10px 7px; }
.nx108-guild-current-actions { flex-wrap:wrap; margin-top:8px; }
.nx108-guild-quests > p { color:#dbc29a; font-size:.85rem; }
#nx108GuildQuestsView ul { grid-template-columns:1fr; max-height:46vh; overflow:auto; }
#nx108GuildQuestsView li { display:flex; justify-content:space-between; gap:15px; align-items:center; min-height:54px; padding:12px; font-size:.85rem; }
#nx108GuildQuestsView li small { text-align:right; }
.nx197-guild-construction .nx108-guild-resource-line { grid-template-columns:1fr 1fr; }
.nx197-guild-construction > p { color:#e2cca7; }
#nx108GuildApplications { max-height:48vh; margin:0; padding:0; overflow:auto; list-style:none; }
.nx197-pvp-match-clock { position:fixed; z-index:840; top:max(10px,env(safe-area-inset-top)); left:50%; transform:translateX(-50%); min-width:90px; padding:7px 15px; border:1px solid rgba(236,208,145,.68); border-radius:7px; color:#fff2cf; background:rgba(18,25,29,.84); box-shadow:0 2px 12px #0006; font:700 clamp(16px,2.2vw,24px)/1.1 system-ui,sans-serif; font-variant-numeric:tabular-nums; text-align:center; pointer-events:none; }
@media(max-height:520px) {
 .nx108-guild-panel { max-height:96vh; }
 .nx108-guild-panel > .nx108-panel-header { padding-top:9px; padding-bottom:9px; }
 .nx108-guild-panel > .nx108-guild-balance { padding-top:6px; padding-bottom:6px; }
 .nx108-guild-nav button { min-height:34px; }
 .nx108-guild-current #nx108GuildMembers { max-height:33vh; }
 .nx108-guild-current-header small { font-size:.62rem; }
}
@media(max-width:600px) {
 .nx108-guild-panel > .nx108-guild-balance { gap:6px 13px; padding:8px 12px; font-size:.7rem; }
 .nx108-guild-nav button { padding:0 10px; font-size:.76rem; }
 .nx108-guild-current-header { grid-template-columns:42px minmax(0,1fr) auto; }
 .nx108-guild-current-emblem { width:42px; min-height:46px; }
 .nx108-guild-current-emblem img { width:38px; height:36px; }
 .nx108-guild-level { grid-column:auto; grid-auto-flow:row; justify-content:end; font-size:.75rem; }
 .nx197-guild-member-head, .nx108-guild-member-profile { grid-template-columns:minmax(60px,1fr) minmax(52px,.8fr) 34px minmax(95px,1.2fr); gap:5px; font-size:.68rem; padding-left:6px; padding-right:6px; }
}

/* 1.0.97 — native 340px square crops at measured object positions; original item IDs, effects and SVG fallback remain. */
html.nx197-items-ready img[src*="warrior_skill_book_1.svg"],
html.nx197-items-ready img[src*="warrior_skill_book_2.svg"],
html.nx197-items-ready img[src*="warrior_skill_book_3.svg"],
html.nx197-items-ready img[src*="warrior_skill_book_4.svg"],
html.nx197-items-ready img[src*="warrior_skill_book_5.svg"],
html.nx197-items-ready img[src*="warrior_skill_book_6.svg"],
html.nx197-items-ready img[src*="warrior_skill_book_7.svg"],
html.nx197-items-ready img[src*="warrior_skill_book_8.svg"],
html.nx197-items-ready img[src*="enchant_scroll_"][src*=".svg"],
html.nx197-items-ready img[src*="nx197-guild-flag-card"],
html.nx197-items-ready img[src*="nx197-guild-rename-card"] {
 content:url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
 background-image:url("assets/ui-197/items-atlas.png");
 background-repeat:no-repeat;
 background-size:425.882352941% 319.411764706%;
 object-fit:contain;
}
html.nx197-items-ready img[src*="warrior_skill_book_1.svg"] { background-position:0.992779783% 1.608579088%; }
html.nx197-items-ready img[src*="warrior_skill_book_2.svg"] { background-position:33.664259928% 1.608579088%; }
html.nx197-items-ready img[src*="warrior_skill_book_3.svg"] { background-position:66.335740072% 1.608579088%; }
html.nx197-items-ready img[src*="warrior_skill_book_4.svg"] { background-position:99.007220217% 1.608579088%; }
html.nx197-items-ready img[src*="warrior_skill_book_5.svg"] { background-position:0.992779783% 47.319034853%; }
html.nx197-items-ready img[src*="warrior_skill_book_6.svg"] { background-position:33.664259928% 47.319034853%; }
html.nx197-items-ready img[src*="warrior_skill_book_7.svg"] { background-position:66.335740072% 47.319034853%; }
html.nx197-items-ready img[src*="warrior_skill_book_8.svg"] { background-position:99.007220217% 47.319034853%; }
html.nx197-items-ready img[src*="enchant_scroll_"][src*=".svg"] { background-position:0.992779783% 92.895442359%; }
html.nx197-items-ready img[src*="nx197-guild-flag-card"] { background-position:33.664259928% 92.895442359%; }
html.nx197-items-ready img[src*="nx197-guild-rename-card"] { background-position:66.335740072% 92.895442359%; }
html.nx197-items-ready #game .sit-toggle .nx197-sit-icon { background-image:url("assets/ui-197/items-atlas.png"); background-size:425.882352941% 319.411764706%; background-position:99.007220217% 92.895442359%; background-repeat:no-repeat; }
html.nx197-items-ready #game .sit-toggle .nx197-sit-icon > * { visibility:hidden; }

/* NEXORIA bundle206: nexoria-damage-numbers.css */
/* Standalone presentation skin for nexoria-damage-numbers.js.
   Position, transform and opacity are updated by its single rAF loop. */

:where(.nexoria-damage-number-layer) {
  position: fixed;
  inset: 0;
  z-index: 240;
  overflow: hidden;
  overflow: clip;
  isolation: isolate;
  contain: layout style paint;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;
  font-synthesis: none;
}

.nexoria-damage-number-layer,
.nexoria-damage-number-layer * {
  box-sizing: border-box;
  pointer-events: none;
}

.nexoria-damage-number[hidden],
.nexoria-damage-number__critical[hidden] {
  display: none !important;
}

.nexoria-damage-number {
  --damage-fill-top: #fffef2;
  --damage-fill-bottom: #ffd968;
  --damage-outline: #741811;
  --damage-outline-deep: #280301;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-inline-size: 3ch;
  max-inline-size: min(16rem, calc(100vw - 1.5rem));
  translate: -50% -72%;
  color: var(--damage-fill-bottom);
  font-family: "Cinzel", "Trajan Pro", "Times New Roman", Georgia, serif;
  font-size: clamp(0.95rem, calc(0.7rem + 1.05vw), 1.25rem) !important;
  font-weight: 800;
  font-variant-numeric: tabular-nums lining-nums;
  line-height: 0.92;
  letter-spacing: 0.015em;
  text-align: center;
  white-space: nowrap;
  -webkit-text-stroke: 0.78px var(--damage-outline);
  paint-order: stroke fill;
  text-shadow:
    -1px -1px 0 var(--damage-outline),
    1px -1px 0 var(--damage-outline),
    -1px 1px 0 var(--damage-outline-deep),
    1px 1px 0 var(--damage-outline-deep),
    0 2px 0 var(--damage-outline-deep),
    0 3px 7px rgb(32 0 0 / 78%),
    0 0 6px rgb(255 97 38 / 34%);
  filter: drop-shadow(0 3px 2px rgb(0 0 0 / 52%));
  will-change: transform, opacity;
  cursor: default;
}

.nexoria-damage-number__value {
  display: block;
  direction: ltr;
  unicode-bidi: isolate;
  color: var(--damage-fill-bottom);
  background: linear-gradient(180deg, var(--damage-fill-top) 8%, #fff2af 48%, var(--damage-fill-bottom) 92%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.nexoria-damage-number.is-critical,
.nexoria-damage-number--critical {
  --damage-fill-top: #fff6a7;
  --damage-fill-bottom: #ff9d22;
  --damage-outline: #8b1909;
  --damage-outline-deep: #300300;
  font-size: clamp(1.38rem, calc(1rem + 1.52vw), 1.8rem) !important;
  font-weight: 900;
  letter-spacing: 0.025em;
  -webkit-text-stroke-width: 1px;
  text-shadow:
    -1px -1px 0 var(--damage-outline),
    1px -1px 0 var(--damage-outline),
    -1px 1px 0 var(--damage-outline-deep),
    1px 1px 0 var(--damage-outline-deep),
    0 3px 0 var(--damage-outline-deep),
    0 4px 10px rgb(69 4 0 / 88%),
    0 0 8px rgb(255 132 20 / 86%),
    0 0 18px rgb(255 185 46 / 58%);
  filter:
    drop-shadow(0 3px 2px rgb(0 0 0 / 64%))
    drop-shadow(0 0 7px rgb(255 142 25 / 70%));
}

.nexoria-damage-number__critical {
  display: block;
  margin-block-start: 0.28em;
  padding: 0.18em 0.55em 0.16em;
  border: 1px solid rgb(255 213 96 / 88%);
  border-radius: 999px;
  color: #fff0a0;
  background: linear-gradient(180deg, rgb(103 16 5 / 92%), rgb(43 3 1 / 94%));
  box-shadow:
    inset 0 1px 0 rgb(255 245 182 / 35%),
    0 0 8px rgb(255 133 18 / 55%),
    0 2px 4px rgb(0 0 0 / 62%);
  font-family: "Cinzel", "Trajan Pro", Georgia, serif;
  font-size: 0.42em;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: 0.13em;
  text-indent: 0.13em;
  text-shadow: 0 1px 0 #4b0802, 0 0 5px rgb(255 177 35 / 72%);
  -webkit-text-fill-color: currentColor;
  -webkit-text-stroke: 0;
}

.nexoria-damage-number.is-finisher,
.nexoria-damage-number--finisher {
  font-size: clamp(1.55rem, calc(1.08rem + 2vw), 2.2rem) !important;
  font-weight: 900;
  letter-spacing: 0.04em;
  filter:
    drop-shadow(0 4px 3px rgb(0 0 0 / 72%))
    drop-shadow(0 0 9px rgb(255 104 26 / 58%));
}

.nexoria-damage-number.is-finisher.is-critical,
.nexoria-damage-number--finisher.nexoria-damage-number--critical {
  font-size: clamp(1.9rem, calc(1.24rem + 2.65vw), 2.65rem) !important;
  text-shadow:
    -2px -1px 0 var(--damage-outline),
    2px -1px 0 var(--damage-outline),
    -2px 2px 0 var(--damage-outline-deep),
    2px 2px 0 var(--damage-outline-deep),
    0 4px 0 var(--damage-outline-deep),
    0 5px 13px rgb(54 2 0 / 92%),
    0 0 11px rgb(255 142 17 / 94%),
    0 0 25px rgb(255 205 69 / 68%);
}

@media (max-width: 640px) {
  .nexoria-damage-number-layer {
    padding:
      max(8px, env(safe-area-inset-top))
      max(12px, env(safe-area-inset-right))
      max(8px, env(safe-area-inset-bottom))
      max(12px, env(safe-area-inset-left));
  }

  .nexoria-damage-number {
    max-inline-size: calc(100vw - 24px);
    font-size: clamp(0.86rem, 4.2vw, 1.1rem) !important;
    -webkit-text-stroke-width: 0.7px;
  }

  .nexoria-damage-number.is-critical,
  .nexoria-damage-number--critical {
    font-size: clamp(1.18rem, 5.8vw, 1.6rem) !important;
  }

  .nexoria-damage-number.is-finisher,
  .nexoria-damage-number--finisher {
    font-size: clamp(1.4rem, 7vw, 1.85rem) !important;
  }

  .nexoria-damage-number.is-finisher.is-critical,
  .nexoria-damage-number--finisher.nexoria-damage-number--critical {
    font-size: clamp(1.65rem, 8.5vw, 2.15rem) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nexoria-damage-number {
    animation: none !important;
    transition: none !important;
    will-change: auto !important;
  }

  .nexoria-damage-number.is-reduced-motion {
    translate: -50% -58%;
    transform: none !important;
    opacity: 1 !important;
    filter: none;
  }
}

@media (prefers-contrast: more) {
  .nexoria-damage-number {
    -webkit-text-stroke-width: 1.1px;
    text-shadow:
      -2px -1px 0 #280301,
      2px -1px 0 #280301,
      -2px 2px 0 #280301,
      2px 2px 0 #280301,
      0 4px 7px #000;
  }
}

@media (forced-colors: active) {
  .nexoria-damage-number,
  .nexoria-damage-number__value {
    color: CanvasText;
    background: none;
    filter: none;
    -webkit-text-fill-color: CanvasText;
    -webkit-text-stroke: 0;
    text-shadow: none;
  }

  .nexoria-damage-number.is-critical,
  .nexoria-damage-number--critical {
    color: Highlight;
    -webkit-text-fill-color: Highlight;
  }

  .nexoria-damage-number__critical {
    border: 1px solid Highlight;
    color: HighlightText;
    background: Highlight;
    box-shadow: none;
    -webkit-text-fill-color: HighlightText;
  }
}

/* NEXORIA bundle206: nexoria-login-parallax.css */
/* NEXORIA 1.0.74: approved login art, independent from account/game logic. */
#authGate.auth-gate {
  isolation: isolate;
  place-items: center;
  background: #243e4a;
}
#authGate > .auth-glow { display: none; }
.nexoria-login-scene {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: #243e4a;
}
.nexoria-login-canvas {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.nexoria-login-layer {
  position: absolute;
  display: block;
  max-width: none;
  pointer-events: none;
  -webkit-user-drag: none;
}
.nexoria-login-fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.nexoria-login-petals {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
  contain: layout style paint;
}
.nexoria-login-petal-path {
  position: absolute;
  top: -48px;
  left: var(--petal-start);
  width: var(--petal-size);
  pointer-events: none;
  opacity: 0;
  animation: nexoria-login-petal-drift var(--petal-duration) linear infinite;
  animation-delay: var(--petal-delay);
}
.nexoria-login-petal-image {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
  -webkit-user-drag: none;
  animation: nexoria-login-petal-turn var(--petal-spin) linear infinite;
  animation-delay: var(--petal-delay);
}
.nexoria-login-petals.is-paused .nexoria-login-petal-path,
.nexoria-login-petals.is-paused .nexoria-login-petal-image {
  animation-play-state: paused;
}
@keyframes nexoria-login-petal-drift {
  0% { transform: translate3d(0, 0, 0); opacity: 0; }
  12% { transform: translate3d(-4vw, 12vh, 0); opacity: .72; }
  55% { transform: translate3d(var(--petal-middle), 48vh, 0); opacity: .66; }
  88% { transform: translate3d(var(--petal-late), 79vh, 0); opacity: .40; }
  100% { transform: translate3d(var(--petal-end), 94vh, 0); opacity: 0; }
}
@keyframes nexoria-login-petal-turn {
  0% { transform: rotate(0deg) scaleX(.85); }
  25% { transform: rotate(90deg) scaleX(.50); }
  50% { transform: rotate(180deg) scaleX(.85); }
  75% { transform: rotate(270deg) scaleX(.60); }
  100% { transform: rotate(360deg) scaleX(.85); }
}
.nexoria-login-scene::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(8,16,29,.03), transparent 55%, rgba(5,13,20,.24));
}
#authGate .auth-shell {
  z-index: 1;
  width: min(342px, 94vw);
  min-height: 0;
  padding: 0;
  margin: auto;
  pointer-events: none;
}
#authGate .auth-card {
  width: 100%;
  margin: auto;
  padding: clamp(14px, 2.2vh, 22px);
  background: rgba(10,18,27,.36);
  border-color: rgba(243,223,187,.46);
  box-shadow: 0 12px 35px rgba(5,18,29,.15), inset 0 1px rgba(255,255,255,.07);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  text-shadow: 0 1px 4px rgba(0,0,0,.6);
  pointer-events: auto;
}
#authGate .auth-brand h1 { color: #ffecbe; }
#authGate .auth-brand span,
#authGate .auth-form label > span { color: #fff3db; }
#authGate .auth-form input {
  background: rgba(6,18,28,.42);
  border-color: rgba(232,220,186,.55);
  min-height: 44px;
  color: #fff;
  font-size: 16px;
}
#authGate .auth-form input::placeholder { color: rgba(245,237,219,.78); }
#authGate .auth-form input:focus { background: rgba(6,18,28,.6); }
#authGate .auth-tab, #authGate .auth-submit, #authGate .account-exit { min-height: 44px; }
#authGate .quick-note { color: #f4e9d5; }
.nexoria-login-tilt {
  position: fixed;
  z-index: 2;
  right: max(14px, env(safe-area-inset-right));
  bottom: max(12px, env(safe-area-inset-bottom));
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid rgba(240,223,184,.42);
  border-radius: 10px;
  background: rgba(10,18,27,.48);
  color: #fff3db;
  font-size: 11px;
  cursor: pointer;
  touch-action: manipulation;
}
.nexoria-login-tilt[aria-pressed="true"] { border-color: #e9c784; }
#authGate .nexoria-login-tilt[hidden] { display: none !important; }
@media (max-height: 500px) and (orientation: landscape) {
  #authGate .auth-shell { width: min(310px, 84vw); }
  #authGate .auth-card { padding: 10px 14px; }
  #authGate .auth-brand { margin-bottom: 5px; }
  #authGate .auth-brand h1 { font-size: 26px; }
  #authGate .auth-brand p { font-size: 8px; }
  #authGate .auth-brand span { margin-top: 2px; font-size: 9px; }
  #authGate .auth-tabs { margin-bottom: 6px; padding: 2px; }
  #authGate .auth-form { gap: 5px; }
  #authGate .quick-note { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .nexoria-login-layer { transform: none !important; }
  .nexoria-login-petals { display: none; }
  .nexoria-login-petal-path, .nexoria-login-petal-image { animation: none; }
}

/* NEXORIA bundle206: nexoria-auth197.css */
/* Post-197: creation fills the screen with one aspect-preserving cover canvas.
 * Scenery, hero and sky masks share the same transform; UI uses visible bounds.
 * Cover crops outer scene edges on mismatched aspect ratios. No raster changes. */
#nexoriaCharacterFlow.nx197-auth { padding:0; display:grid; place-items:center; overflow:hidden; background:#08131b; inset:0 auto auto 0; width:var(--nx197-art-width,100vw); height:var(--nx197-art-height,100lvh); }
#nexoriaCharacterFlow.nx197-auth[hidden] { display:none !important; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card { position:relative; width:min(100vw,222.35434dvh) !important; height:auto !important; aspect-ratio:1870/841; max-width:none; max-height:none; margin:0; padding:0 !important; border:0 !important; border-radius:0 !important; overflow:hidden !important; background:#10212c !important; box-shadow:none !important; isolation:isolate; container-type:inline-size; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="create"] { width:100% !important; height:100% !important; aspect-ratio:auto; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="create"] .nx197-art { inset:auto; left:var(--nx197-cover-left,0px); top:var(--nx197-cover-top,0px); width:var(--nx197-cover-width,100%); height:var(--nx197-cover-height,100%); }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="faction"] { width:min(100vw,219.858156dvh) !important; aspect-ratio:1860/846; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card::before { display:none; }
.nx197-art,.nx197-scene,.nx197-scenery,.nx197-hero { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.nx197-art { z-index:0; overflow:hidden; }
.nx197-scene { opacity:0; transition:opacity .5s ease; background:#153848; }
.nx197-scene.is-current { opacity:1; }
.nx197-scenery,.nx197-hero { object-fit:contain; }
.nx197-hero { z-index:4; transition:translate .52s ease-out; translate:1.2% 0; }
.nx197-scene.is-current .nx197-hero { translate:0 0; }
.nx198-faction-hero,.nx198-faction-foreground { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; pointer-events:none; }
.nx198-faction-hero { z-index:1; transform:translateY(0); }
.nx198-faction-foreground { z-index:2; }
.nx197-scene[data-scene="faction"].is-faction-fallback > img { display:none; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-faction="aether"] .nx198-faction-hero.is-aether,
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-faction="umbra"] .nx198-faction-hero.is-umbra { animation:nx198-faction-breathe 4.8s ease-in-out infinite; }
#nexoriaCharacterFlow[data-auth197-paused="true"] .nx198-faction-hero { animation-play-state:paused !important; }
.nx197-logo { position:absolute; z-index:6; left:2.5%; top:2.5%; width:19%; height:auto; pointer-events:none; animation:nx197-logo-float 7s ease-in-out infinite; }
.nx197-title { position:absolute; z-index:6; left:3.4%; top:22%; margin:0; color:#ffedbf; font:500 2cqw Georgia,serif; text-shadow:0 2px 8px #09151f; pointer-events:none; }
.nx197-identity { position:absolute; left:3.4%; top:33%; z-index:6; display:grid; gap:.4cqw; color:#fff3d4; text-shadow:0 2px 9px #07101b; }
.nx197-identity strong { font:700 4cqw Georgia,serif; }
.nx197-identity span { color:#f0cc80; font:600 1.4cqw Georgia,serif; }
.nx197-cloud-window { position:absolute; z-index:2; inset:0; overflow:hidden; pointer-events:none; mask-size:100% 100%; mask-repeat:no-repeat; -webkit-mask-size:100% 100%; -webkit-mask-repeat:no-repeat; }
.nx197-cloud { position:absolute; width:62%; height:auto; top:-1%; opacity:.8; animation:nx197-cloud-drift 70s linear infinite; }
.nx197-cloud-b { left:57%; top:4%; animation-delay:-35s; opacity:.55; }
.nx197-cloud-a { left:-5%; }
.nx197-cloud-shadows { position:absolute; z-index:3; left:0; right:0; bottom:0; height:34%; overflow:hidden; pointer-events:none; mask-image:linear-gradient(transparent,#000 28%); }
.nx197-cloud-shadow { position:absolute; left:-10%; top:14%; width:66%; height:75%; background:#1b3652; opacity:.13; filter:blur(8px); mask-image:url('assets/auth-197/clouds.png'); mask-size:100% 100%; mask-repeat:no-repeat; animation:nx197-shadow-drift 70s linear infinite; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-status { position:absolute; z-index:20; inset:auto 25% 8%; border:1px solid #d8b878; color:#fff1d1; padding:12px; background:#112330ed; text-align:center; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-status[hidden] { display:none !important; }
#nexoriaCharacterFlow.nx197-auth #nx108FlowHeader { position:absolute; z-index:10; top:18%; left:30%; width:40%; color:#ffeec5; text-shadow:0 2px 10px #111; }
#nexoriaCharacterFlow.nx197-auth #nx108FlowHeader[hidden] { display:none; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card button:focus-visible { outline:2px solid #fff3bc !important; outline-offset:4px !important; }
#nexoriaCharacterFlow.nx197-auth .nx108-primary { border:2px solid #bb8c42 !important; border-radius:14px 3px !important; color:#332515 !important; background:linear-gradient(#fff9e3,#f3dfaf) !important; box-shadow:inset 0 0 0 2px #fff3cd,0 0 0 1px #64411a,0 3px 15px #10100b70 !important; font-family:Georgia,serif; font-weight:700; letter-spacing:.015em; }
#nexoriaCharacterFlow.nx197-auth .nx108-primary:disabled { opacity:.5; }
/* Three real account slots; their original click/create handlers remain attached. */
#nexoriaCharacterFlow.nx197-auth #nx108CharacterList { position:absolute; z-index:7; left:3.3%; top:50%; width:32.5%; height:32%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2.7%; padding:0; margin:0; }
#nexoriaCharacterFlow.nx197-auth #nx108CharacterList[hidden] { display:none; }
#nexoriaCharacterFlow.nx197-auth .nx108-character-choice { position:relative; display:block; width:100%; height:100%; min-height:0 !important; padding:0 !important; overflow:hidden; border:1px solid #bb9359 !important; border-radius:7px !important; background:#152a38da !important; box-shadow:inset 0 0 0 3px #0d1c25 !important; }
#nexoriaCharacterFlow.nx197-auth .nx108-character-choice.is-selected { border-color:#ffe0a2 !important; box-shadow:0 0 12px #f9d46e99,inset 0 0 0 2px #d5ac57 !important; }
#nexoriaCharacterFlow.nx197-auth .nx108-character-choice > img { position:absolute; inset:2%; width:96%; height:96%; object-fit:cover; object-position:50% 18%; }
#nexoriaCharacterFlow.nx197-auth .nx108-character-choice > span { position:absolute; inset:auto 0 0; width:100%; box-sizing:border-box; display:grid; gap:.25cqw; padding:8% 3% 7%; background:linear-gradient(transparent,#14232dec 28%); color:#ffedc5; }
#nexoriaCharacterFlow.nx197-auth .nx108-character-choice strong { font:600 1.1cqw Georgia,serif; }
#nexoriaCharacterFlow.nx197-auth .nx108-character-choice small { font-size:.7cqw; }
#nexoriaCharacterFlow.nx197-auth .nx108-character-choice.is-empty > b { position:absolute; inset:32% 0 auto; font:400 4cqw Georgia,serif; color:#e9cd93; }
#nexoriaCharacterFlow.nx197-auth .nx108-character-choice.is-empty > span { background:none; bottom:8%; }
#nexoriaCharacterFlow.nx197-auth .nx108-selection-particles { display:none; }
#nexoriaCharacterFlow.nx197-auth #nx108CharacterActions { position:absolute; z-index:8; inset:auto 2.8% 6% auto; width:22%; margin:0; display:flex; gap:10px; }
#nexoriaCharacterFlow.nx197-auth #nx108CharacterActions[hidden] { display:none; }
#nexoriaCharacterFlow.nx197-auth #nx108EnterGame { min-height:0; width:100%; padding:1.1cqw .8cqw; font-size:1.8cqw; }
/* Creation is a layered 2D banner, so MAPTNV no longer loads a second WebGL scene. */
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="create"] .nx197-title { top:3.4%; left:2.8%; font-size:2.45cqw; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="create"] .nx197-logo { left:21%; top:43%; width:25%; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-model="nv3"][data-auth197-view="create"] .nx197-logo { top:16%; width:27%; }
#nexoriaCharacterFlow.nx197-auth #nx108CreateForm { position:absolute; z-index:7; inset:auto; top:var(--nx197-visible-top,0px); left:var(--nx197-visible-left,0px); width:var(--nx197-visible-width,100%); height:var(--nx197-visible-height,100%); min-height:0; margin:0; padding:0; background:transparent; overflow:visible; isolation:auto; }
#nexoriaCharacterFlow.nx197-auth #nx108CreateForm[hidden] { display:none !important; }
#nexoriaCharacterFlow.nx197-auth #nx108MaptnvCanvas,#nexoriaCharacterFlow.nx197-auth #nx108MaptnvStatus { display:none !important; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-picker { position:absolute; z-index:7; inset:0; display:block !important; border:0; padding:0; margin:0; pointer-events:none; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-grid { position:absolute; inset:13.7% auto auto 2.1%; width:17.2%; height:50%; display:grid; grid-template-columns:1fr; grid-template-rows:repeat(3,minmax(0,1fr)); gap:4.5%; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-choice { position:relative; display:block; width:100%; height:100%; min-height:0 !important; padding:0; border:1px solid #a78242 !important; border-radius:4px !important; background:#132634 !important; overflow:visible; pointer-events:auto; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-choice[data-model-available="false"] { display:none !important; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-choice > img { position:absolute; inset:2%; width:96%; height:96%; object-fit:cover; object-position:50% 19%; border-radius:2px; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-choice > span { display:none; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-choice::before { content:attr(data-portrait-number); position:absolute; z-index:1; left:5%; bottom:4%; font:500 1.7cqw Georgia,serif; color:#ffe7ae; text-shadow:0 1px 4px #000; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-choice.is-selected { border-color:#fff0b8 !important; box-shadow:0 0 12px #f8ce7099,inset 0 0 0 1px #fce5a4 !important; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-choice.is-selected::after { content:"›"; position:absolute; left:102%; top:25%; font:700 3cqw Georgia,serif; color:#ffe29b; text-shadow:0 0 8px #daab4f; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-create-fields { position:absolute; top:auto; right:max(2%,env(safe-area-inset-right)); bottom:max(5%,env(safe-area-inset-bottom)); width:27%; max-height:calc(100% - 16px); min-width:0; padding:.65cqw .85cqw; display:grid; gap:.35cqw; transform:none; border:1px solid #c2a36d77; border-radius:6px; background:#10202eb3; box-shadow:0 3px 15px #08131b55; overflow-y:auto; overscroll-behavior:contain; touch-action:pan-y; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-create-fields > label { font:500 clamp(12px,1.3cqw,24px) Georgia,serif; }
#nexoriaCharacterFlow.nx197-auth .nx108-name-row { display:flex; gap:.3cqw; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-name-row input { box-sizing:border-box; min-height:28px; height:2.8cqw; flex:1; min-width:0; font-size:clamp(16px,1.1cqw,22px); padding:.3cqw .7cqw; background:#f9f0dbed; color:#282118; border:1px solid #d8b87a; border-radius:3px; }
#nexoriaCharacterFlow.nx197-auth #nx108NameCount { font-size:.85cqw; color:#f1d397; align-self:center; }
#nexoriaCharacterFlow.nx197-auth #nx108NameMessage { margin:0; min-height:1.1em; font-size:.8cqw; color:#f5dfb2; }
#nexoriaCharacterFlow.nx197-auth #nx108NameMessage.is-error { color:#ffb5a7; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-create-actions { display:block; }
#nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-create-actions button[type="submit"] { width:100%; min-height:0; padding:.65cqw .2cqw; font-size:1.65cqw; }
#nexoriaCharacterFlow.nx197-auth #nx108CreateCancel { display:none; }
#nexoriaCharacterFlow.nx197-auth #nx108MaptnvFactionBack { top:2%; right:2%; min-width:0; min-height:0; padding:0 .5cqw; font:400 3.2cqw Georgia,serif; color:#ffe7ac; background:none !important; border:0 !important; box-shadow:none; }
/* Post-198: both faction halves stay undimmed and clickable; selection is a
 * character-only breathing motion, with a small textual selected indicator. */
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="faction"] .nx197-logo { left:39%; top:3%; width:22%; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="faction"] .nx197-title { left:0; top:20%; width:100%; text-align:center; font-size:2cqw; }
#nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="faction"] #nx108FlowHeader { display:none; }
#nexoriaCharacterFlow.nx197-auth .nx108-faction-step { position:absolute; inset:0; z-index:5; display:block; }
#nexoriaCharacterFlow.nx197-auth .nx108-faction-step[hidden] { display:none; }
#nexoriaCharacterFlow.nx197-auth .nx108-faction-cards { position:absolute; inset:0; display:grid; grid-template-columns:1fr 1fr; gap:0; min-height:0; }
#nexoriaCharacterFlow.nx197-auth .nx108-faction-card { position:relative; width:100%; height:100%; aspect-ratio:auto; min-height:0 !important; padding:0; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; transform:none !important; }
#nexoriaCharacterFlow.nx197-auth .nx108-faction-card > img { display:none; }
#nexoriaCharacterFlow.nx197-auth .nx108-faction-card::after { content:none; }
#nexoriaCharacterFlow.nx197-auth .nx108-faction-card.is-selected { box-shadow:none !important; }
#nexoriaCharacterFlow.nx197-auth .nx108-faction-card strong { position:absolute; z-index:1; bottom:17%; left:0; right:0; color:#ffedc7 !important; font:500 4.2cqw Georgia,serif; background:none; text-shadow:0 3px 12px #080c12; }
#nexoriaCharacterFlow.nx197-auth .nx108-faction-card.is-selected::before { content:"✓  Đã chọn"; position:absolute; z-index:2; bottom:10%; left:0; right:0; color:#ffe8b3; text-shadow:0 2px 5px #050e17; font:600 1.6cqw Georgia,serif; }
#nexoriaCharacterFlow.nx197-auth #nx108FactionContinue { position:absolute; z-index:9; bottom:6%; left:38%; width:24%; min-height:0; padding:.85cqw .8cqw; font-size:1.9cqw; }
/* The login artwork keeps pre-keyboard pixel bounds. Only the form scroller
 * follows visualViewport, so opening the keyboard cannot recenter the image. */
#authGate.auth-gate { inset:0 auto auto 0; width:var(--nx197-art-width,100vw); height:var(--nx197-art-height,100lvh); padding:0; overflow:hidden; touch-action:none; }
#authGate .nexoria-login-scene { position:absolute; inset:0 auto auto 0; width:var(--nx197-art-width,100vw); height:var(--nx197-art-height,100lvh); }
#authGate .auth-shell { position:absolute; inset:auto; top:var(--nx197-visible-top,0px); left:var(--nx197-visible-left,0px); display:flex; align-items:center; justify-content:center; width:var(--nx197-visible-width,100vw); height:var(--nx197-visible-height,100dvh); min-height:0; margin:0; padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); overflow-y:auto; overscroll-behavior:contain; touch-action:pan-y; pointer-events:auto; }
#authGate .auth-card { flex:0 0 auto; width:min(342px,100%); margin:auto; }
#authGate.nx197-keyboard-open .nexoria-login-tilt { display:none; }
@media(max-height:500px) and (orientation:landscape) { #authGate .auth-card { width:min(310px,100%); } }
@media(orientation:portrait) {
  #nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="create"] .nx197-title { top:max(3%,env(safe-area-inset-top)); left:5%; font-size:clamp(20px,5cqw,32px); }
  #nexoriaCharacterFlow.nx197-auth .nx108-flow-card[data-auth197-view="create"] .nx197-logo { top:12%; left:4%; width:40%; }
  #nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-model-grid { left:max(4%,env(safe-area-inset-left)); top:25%; width:21%; height:39%; }
  #nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-create-fields { right:4%; bottom:max(4%,env(safe-area-inset-bottom)); width:92%; padding:10px 12px; gap:5px; }
  #nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-create-fields > label { font-size:16px; }
  #nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-name-row input { height:40px; }
  #nexoriaCharacterFlow.nx197-auth #nx108NameCount,#nexoriaCharacterFlow.nx197-auth #nx108NameMessage { font-size:12px; }
  #nexoriaCharacterFlow.nx197-auth .nx108-maptnv .nx108-create-actions button[type="submit"] { min-height:40px; font-size:16px; }
  #nexoriaCharacterFlow.nx197-auth #nx108MaptnvFactionBack { top:max(2%,env(safe-area-inset-top)); right:4%; min-height:36px; min-width:36px; font-size:32px; }
}
@keyframes nx197-logo-float { 0%,100% { translate:0 0; } 50% { translate:0 -2%; } }
@keyframes nx198-faction-breathe { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-.5%); } }
@keyframes nx197-cloud-drift { from { transform:translateX(-15%); } to { transform:translateX(85%); } }
@keyframes nx197-shadow-drift { from { transform:translateX(-15%) skewX(-15deg); } to { transform:translateX(85%) skewX(-15deg); } }
@media(prefers-reduced-motion:reduce) { .nx197-logo,.nx197-cloud,.nx197-cloud-shadow { animation:none; } .nx198-faction-hero { animation:none !important; } .nx197-scene,.nx197-hero { transition:none; } }

/* NEXORIA bundle206: nexoria-ui-200.css */
/* 1.0.100: existing UI layout and shared brown/gold controls. No new art. */
:root { --nx200-slot-radius: 7px; --nx200-control-radius: 8px; }

/* MAP4 labels hug their text; keep the existing position and house colours. */
#game .map4-service-prompt {
  min-width: 0;
  width: max-content;
  max-width: min(92vw, 420px);
  padding: 8px 10px;
  gap: 6px;
}
#game .map4-service-prompt > button { padding: 6px 12px; min-height: 34px; }
#game #nx200ForgeServices[hidden] { display: none !important; }
#game #nx200ForgeServices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
#game #nx200ForgeServices button { min-width: 0; min-height: 36px; padding: 5px 8px; white-space: nowrap; }
#game #sitButton { color: #fff; }
#game #sitButton .nx200-sit-icon { width: 100%; height: 100%; fill: none; filter: none; }

/* The same rounded square for bags, worn equipment and placement slots. */
.nx108-root :is(.nx108-inventory-cell, .nx108-equip-slot, .nx108-forge-slot, .nx108-trade-slot, .nx108-item-icon-frame, .nx108-skill-shortcut-slots > button),
#nexoriaCharacterPanel :is(.nx108-inventory-cell, .nx108-equip-slot) {
  border-radius: var(--nx200-slot-radius);
  overflow: hidden;
}
#nexoriaCharacterPanel .nx108-equip-slot {
  border: 1px solid color-mix(in srgb, var(--rarity, #cfb174) 56%, #66461f);
  background-image: linear-gradient(145deg, rgba(62, 41, 20, .92), rgba(18, 12, 6, .98));
}
.nx108-root .nx108-forge-slot { background: rgba(38, 24, 14, .96); box-shadow: inset 0 0 16px rgba(150, 89, 174, .13); }
.nx108-root .nx196-inherit-selected { width: 100px; height: auto; aspect-ratio: 1; display: flex; flex-direction: column; justify-content: center; gap: 3px; }
.nx108-root .nx196-inherit-selected img { width: 60%; height: 60%; object-fit: contain; }
.nx108-root .nx196-inherit-selected span { font-size: .6rem; }
.nx108-root :is(.nx108-primary, .nx108-tabs button, .nx108-forge-tabs button, .nx108-pagination button, .nx108-confirm-card button, .nx108-forge-item-menu button, .nx196-inherit-actions button, .nx108-item-actions button, .nx108-create-actions button) {
  border: 1px solid rgba(239, 201, 128, .5);
  border-radius: var(--nx200-control-radius);
  color: #fff2d5;
  background: linear-gradient(180deg, rgba(148, 94, 37, .94), rgba(67, 40, 16, .98));
  box-shadow: inset 0 1px rgba(255, 255, 255, .1);
}
.nx108-root :is(.nx108-forge-item-menu, .nx108-confirm-card) { border-radius: 12px; }
.nx108-root :is(.nx108-confirm-card, .nx108-item-card)::before { border-radius: 8px; }
.nx108-root .nx108-tabs button.is-active { border-color: #ffd777; color: #fff8e8; background: linear-gradient(#a56d2f, #604017); }
.nx108-root button:disabled { filter: none; }
#nexoriaBlacksmithPanel .nx108-forge-heading { flex: 1 1 0; min-width: 0; }
#nexoriaBlacksmithPanel .nx108-forge-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; width: 100%; }
#nexoriaBlacksmithPanel .nx108-forge-tabs button { width: 100%; min-width: 0; min-height: 36px; padding: 5px 8px; }
#nexoriaBlacksmithPanel .nx108-forge-tabs button.is-active { border-color: #ffd777; background: linear-gradient(#a56d2f, #604017); }

/* A viewport-sized workspace: headers/footers stay put, content scrolls inside. */
#nexoriaCharacterPanel {
  padding: max(6px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
}
#nexoriaCharacterPanel .nx108-character-workspace {
  position: relative;
  display: flex;
  width: min(1220px, 100%);
  height: min(710px, calc(100dvh - max(6px, env(safe-area-inset-top)) - max(6px, env(safe-area-inset-bottom))));
  max-height: 100%;
  min-height: 0;
  gap: 10px;
  overflow: hidden;
  align-items: stretch;
}
#nexoriaCharacterPanel :is(.nx108-profile-panel, .nx108-bag-pane, .nx108-trade-pane) {
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}
#nexoriaCharacterPanel .nx108-profile-panel > .nx108-panel-header { flex: 0 0 auto; }
#nexoriaCharacterPanel .nx108-profile-body { flex: 1 1 auto; height: auto; min-height: 0; grid-template-rows: minmax(0, 1fr) auto; }
#nexoriaCharacterPanel .nx108-paperdoll { container-type: size; min-height: 0; }
#nexoriaCharacterPanel .nx108-equip-slot {
  width: clamp(24px, min(18cqh, 22cqw), 58px);
  height: clamp(24px, min(18cqh, 22cqw), 58px);
  min-height: 0 !important;
  padding: 3px;
  aspect-ratio: 1;
}
#nexoriaCharacterPanel .nx108-profile-footer { grid-template-columns: minmax(0, 1fr) 82px; gap: 6px; margin-top: 6px; }
#nexoriaCharacterPanel .nx108-profile-progress { padding: 5px 8px; gap: 3px; }
#nexoriaCharacterPanel .nx108-profile-actions { gap: 5px; }
#nexoriaCharacterPanel .nx108-profile-actions button { grid-template-columns: 16px minmax(0, 1fr); min-width: 0; min-height: 30px; padding: 4px 6px; font-size: .67rem; }
#nexoriaCharacterPanel .nx108-profile-actions button i { font-size: .8rem; }
#nexoriaCharacterPanel .nx108-profile-lower-row { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; min-width: 0; }
/* 1.0.102: the score reserves five digits (10000), never an entire row. */
#nexoriaCharacterPanel .nx108-profile-mapct1 { flex: 0 0 auto; width: max-content; max-width: 100%; min-height: 30px; padding: 4px 6px; }
#nexoriaCharacterPanel .nx108-profile-mapct1 span { display: inline-flex; align-items: center; justify-content: flex-start; gap: 5px; width: auto; font-size: .68rem; white-space: nowrap; }
#nexoriaCharacterPanel .nx108-profile-mapct1 b { display: inline-block; width: 5ch; min-width: 5ch; text-align: right; font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; }
#nexoriaCharacterPanel .nx108-profile-appearance { min-height: 30px; padding: 3px 5px; font-size: .6rem; gap: 4px; }
#nexoriaCharacterPanel .nx108-profile-appearance b { width: 18px; height: 18px; }
#nexoriaCharacterPanel .nx108-bag-pane { padding: 10px; }
#nexoriaCharacterPanel .nx108-bag-heading { flex: 0 0 auto; gap: 6px; }
#nexoriaCharacterPanel .nx108-inventory-gold { font-size: .65rem; overflow-wrap: anywhere; }
#nexoriaCharacterPanel #nx108InventoryGrid { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
#nexoriaCharacterPanel .nx108-tabs { flex: 0 0 auto; }
#nexoriaCharacterPanel .nx108-page-bank { min-width: 0; }

/* Independent siblings, with a clear gap and their own complete frames. */
#nexoriaCharacterPanel .nx200-profile-details {
  flex: 0 1 340px;
  min-width: 0;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #b98f4d #24180e;
  background: transparent;
}
#nexoriaCharacterPanel .nx200-character-stat-panel { flex: 0 0 auto; min-width: 0; width: 100%; max-width: 100%; max-height: none; }
#nexoriaCharacterPanel .nx200-pet-stat-panel { flex: 0 0 auto; min-width: 0; width: 100%; }
#nexoriaCharacterPanel .nx200-pet-stat-panel .nx198-pet-stats { margin: 0; border: 1px solid rgba(242, 202, 124, .5); border-radius: 12px; padding: 12px; background: linear-gradient(180deg, #392915, #1b120a); }
#nexoriaCharacterPanel .nx200-profile-details h3 { letter-spacing: 0; font-size: .83rem; }
#nexoriaCharacterPanel .nx200-profile-details .nx108-character-stats { padding: 5px 10px 10px; }
#nexoriaCharacterPanel .nx200-profile-details .nx108-character-stats p { padding: 6px 2px; font-size: .72rem; }

/* One Roman-tab row and independent square storage cells; only the grid scrolls. */
.nx108-root .nx108-page-buttons { display: flex; gap: 5px; flex-wrap: nowrap; min-width: 0; overflow-x: auto; scrollbar-width: thin; overscroll-behavior-x: contain; }
.nx108-root .nx108-page-buttons > button { flex: 0 0 42px; min-width: 42px; white-space: nowrap; }
.nx108-adventure-chest-panel .nx108-adventure-chest-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nx108-adventure-chest-panel .nx108-adventure-chest-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: max-content; align-items: start; gap: 7px; min-height: 0; overflow-y: auto; overflow-x: hidden; }
.nx108-adventure-chest-grid > .nx108-inventory-cell { display: grid; place-items: center; position: relative; width: 100%; height: auto; min-width: 0; aspect-ratio: 1; padding: 4px; }
.nx108-adventure-chest-grid > .nx108-inventory-cell > img { position: absolute; inset: 6%; width: 88%; height: 88%; object-fit: contain; }
.nx108-adventure-chest-layer { padding: max(6px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)); }
.nx108-adventure-chest-panel { height: min(570px, calc(100dvh - max(6px, env(safe-area-inset-top)) - max(6px, env(safe-area-inset-bottom)))); max-height: 100%; max-width: 100%; }
.nx108-adventure-chest-header h2 { font-size: clamp(.85rem, 2vw, 1.3rem); }

@media (max-width: 1050px), (max-height: 620px) {
  #nexoriaCharacterPanel .nx108-character-workspace { gap: 7px; }
  #nexoriaCharacterPanel .nx108-profile-panel > .nx108-panel-header { min-height: 48px; padding: 5px 8px; }
  #nexoriaCharacterPanel .nx108-profile-body { padding: 7px; }
  #nexoriaCharacterPanel .nx108-profile-progress { font-size: .69rem; }
  #nexoriaCharacterPanel .nx108-profile-name-line { height: 25px; }
  #nexoriaCharacterPanel .nx108-profile-name-line #nx108ProfileMapct1Badge { height: 25px; }
  #nexoriaCharacterPanel .nx108-profile-footer { grid-template-columns: minmax(0, 1fr) 70px; gap: 5px; }
  #nexoriaCharacterPanel .nx108-profile-actions button { grid-template-columns: minmax(0, 1fr); padding: 3px; font-size: .64rem; }
  #nexoriaCharacterPanel .nx108-profile-actions button i { display: none; }
  #nexoriaCharacterPanel .nx108-bag-pane { padding: 7px; }
  #nexoriaCharacterPanel .nx108-page-bank { margin-bottom: 6px; }
  /* The detail pane takes the bag's column. It never sits over another frame. */
  #nexoriaCharacterPanel .nx108-character-workspace.has-detail:not(.is-trade) > .nx108-bag-pane { display: none; }
  #nexoriaCharacterPanel .nx200-profile-details { position: relative; inset: auto; z-index: auto; flex: 1 1 0; width: auto; min-width: 0; height: 100%; padding: 0; background: transparent; border-radius: 12px; }
  #nexoriaCharacterPanel .nx200-profile-details .nx108-detail-header { min-height: 38px; padding: 5px 8px; }
  #nexoriaCharacterPanel .nx200-profile-details .nx108-detail-header h3 { min-width: 0; letter-spacing: 0; }
  #nexoriaCharacterPanel .nx200-profile-details .nx108-character-stats.is-skill-list { max-height: none; overflow: visible; }
  .nx108-adventure-chest-panel .nx108-adventure-chest-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (orientation: portrait) and (max-width: 680px) {
  #nexoriaCharacterPanel .nx108-character-workspace { flex-wrap: nowrap; overflow: hidden; }
  #nexoriaCharacterPanel .nx108-profile-footer { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'progress' 'achievement' 'actions'; }
  #nexoriaCharacterPanel .nx108-profile-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; }
  #nexoriaCharacterPanel .nx108-profile-lower-row { justify-content: flex-start; }
  #nexoriaCharacterPanel .nx108-profile-appearance { justify-content: space-between; }
  #nexoriaCharacterPanel #nx108InventoryGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #nexoriaCharacterPanel .nx108-profile-header-actions { gap: 2px; }
  #nexoriaCharacterPanel .nx108-profile-artwork-button { display: none; }
  #nexoriaCharacterPanel .nx108-character-workspace.has-detail > .nx108-profile-panel { display: none; }
  #nexoriaCharacterPanel .nx200-profile-details { width: 100%; flex-basis: 100%; padding-left: 0; }
}
.nx200-adventure-menu .nx108-confirm-card { width: min(440px, 94vw); padding: 14px; }
.nx200-adventure-menu .nx108-detail-header { background: transparent; border: 0; padding: 0 0 10px; }
.nx200-adventure-menu nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.nx200-adventure-menu nav button { min-height: 46px; }
.nx108-root :is(.nx108-jewelry-product, .nx108-gem-combine-product, .nx108-spell-shop-product, .nx108-guild-shop, .nx108-item-card) { border-radius: 10px; }
#nexoriaCharacterPanel .nx108-character-workspace.is-profile-only:not(.has-detail) { width: min(480px, 100%); }
#nexoriaCharacterPanel .nx108-character-workspace.is-profile-only.has-detail { width: min(860px, 100%); }

/* NEXORIA bundle206: nexoria-pets-200.css */
/* Approved v200 pet canvases: native 1672 × 941, one uniform scale.
   Frame art stays intact; text, inventory, buttons and scrolling are live DOM. */
#nx198PetModal.nx200-pet-modal { padding: 4px; container-type: size; background: #0d0a0759; }
#nx198PetModal.nx200-pet-modal .nx198-pet-panel {
  position: relative; container-type: inline-size;
  width: min(100%, calc((100cqh - 8px) * 1672 / 941)); max-width: 1672px;
  height: auto; max-height: none; aspect-ratio: 1672 / 941;
  display: block; padding: 0; border: 0; border-radius: 0;
  background: url('assets/ui-200/pets-collection-clean.png') center / contain no-repeat;
  box-shadow: none; color: #fff0d0;
}
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx198-pet-panel { background-image: url('assets/ui-200/pets-merge-clean.png'); }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx198-pet-panel { background-image: url('assets/ui-200/pets-gacha-clean.png'); }
#nx198PetModal.nx200-pet-modal .nx198-pet-panel > header,
#nx198PetModal.nx200-pet-modal .nx198-pet-tabs,
#nx198PetModal.nx200-pet-modal .nx198-pet-body,
#nx198PetModal.nx200-pet-modal :is(.nx200-pet-collection-layout,.nx200-pet-collection,.nx200-pet-filters,.nx200-pet-filters nav,.nx200-pet-inspector,.nx198-pet-main,.nx198-pet-details,.nx198-pet-details dl,.nx200-pet-detail-footer,.nx198-pet-merge,.nx200-merge-workbench,.nx198-pet-merge-pair,.nx200-merge-summary,.nx200-merge-summary > div:not(.nx200-merge-result-preview),.nx200-merge-actions,.nx200-merge-roster,.nx200-eggs,.nx200-egg-stage,.nx200-egg-actions,.nx200-egg-catalog,.nx200-egg-species) {
  display: contents; position: static; padding: 0; margin: 0; border: 0; background: none; overflow: visible;
}
#nx198PetModal.nx200-pet-modal h2 { margin: 0; display: flex; align-items: center; color: #ffe6ad; font: 700 2.3cqw Georgia, serif; letter-spacing: .02em; white-space: nowrap; }
#nx198PetModal.nx200-pet-modal button { touch-action: manipulation; }
#nx198PetModal.nx200-pet-modal .nx198-pet-panel button:focus-visible { outline: 2px solid #fff2bd; outline-offset: 1px; }
#nx198PetModal.nx200-pet-modal .nx198-pet-panel button:disabled { opacity: .43; filter: grayscale(.4); }
#nx198PetModal.nx200-pet-modal .nx198-pet-tabs button,
#nx198PetModal.nx200-pet-modal .nx198-pet-close,
#nx198PetModal.nx200-pet-modal .nx200-pet-filters button,
#nx198PetModal.nx200-pet-modal .nx200-merge-slot {
  border: 0; padding: 0; border-radius: .6cqw; background: transparent; box-shadow: none;
}
#nx198PetModal.nx200-pet-modal .nx198-pet-tabs button { display: flex; align-items: center; justify-content: center; gap: .8cqw; min-height: 0; font: 1.8cqw Georgia, serif; color: #e9cda0; white-space: nowrap; }
#nx198PetModal.nx200-pet-modal .nx198-pet-tabs button.is-active { color: #fff2d2; text-shadow: 0 1px 3px #241205; }
#nx198PetModal.nx200-pet-modal .nx198-pet-tabs svg { width: 2.5cqw; height: 2.5cqw; fill: currentColor; }
#nx198PetModal.nx200-pet-modal .nx198-pet-close { color: transparent; font-size: 0; }
#nx198PetModal.nx200-pet-modal .nx198-pet-wallet { border: 0; padding: 0; margin: 0; font: .82cqw Georgia, serif; text-align: right; color: #dcc397; text-shadow: 0 1px 2px #000; }
#nx198PetModal.nx200-pet-modal .nx198-pet-message { min-height: 0; margin: 0; padding: 0; pointer-events: none; font: .95cqw Georgia, serif; text-shadow: 0 1px 3px #000; z-index: 2; }
#nx198PetModal.nx200-pet-modal .nx198-pet-message:not(:empty) { padding: .25cqw .5cqw; border-radius: .35cqw; background: #24150eee; }
#nx198PetModal.nx200-pet-modal .nx198-pet-retry { z-index: 3; margin: 0; padding: .25cqw .6cqw; font-size: 1cqw; }

/* Four columns scroll independently; fixed inspector keeps its native framing. */
#nx198PetModal.nx200-pet-modal .nx200-pet-collection > header,
#nx198PetModal.nx200-pet-modal .nx200-merge-roster > header { display: flex; align-items: center; justify-content: space-between; padding: 0; border: 0; }
#nx198PetModal.nx200-pet-modal .nx200-pet-collection h3,
#nx198PetModal.nx200-pet-modal .nx200-merge-roster h3 { display: flex; align-items: center; gap: .7cqw; margin: 0; font: 1.85cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-pet-collection header svg,
#nx198PetModal.nx200-pet-modal .nx200-merge-roster header svg { width: 2.4cqw; height: 2.4cqw; fill: #e3bd78; }
#nx198PetModal.nx200-pet-modal .nx200-pet-collection header > span,
#nx198PetModal.nx200-pet-modal .nx200-merge-roster header > span { color: #e2cba1; font: 1.45cqw Georgia, serif; white-space: nowrap; }
#nx198PetModal.nx200-pet-modal .nx200-pet-search { display: flex; align-items: center; gap: .5cqw; padding: 0 .8cqw; border: 0; background: transparent; }
#nx198PetModal.nx200-pet-modal .nx200-pet-search > span { color: #caaa77; font: 2.2cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-pet-search input { width: 100%; min-width: 0; border: 0; padding: 0; border-radius: 0; background: transparent; font: 1.3cqw Georgia, serif; color: #fff2d2; }
#nx198PetModal.nx200-pet-modal .nx200-pet-search input::placeholder { color: #b7a283; }
#nx198PetModal.nx200-pet-modal .nx200-pet-filters button { font: 1.4cqw Georgia, serif; color: #e7d0a7; }
#nx198PetModal.nx200-pet-modal .nx200-pet-filters button.is-active { box-shadow: inset 0 0 .45cqw #ffe6ad; color: white; }
#nx198PetModal.nx200-pet-modal :is(.nx200-pet-collection-grid,.nx200-merge-grid) { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); grid-auto-rows: max-content; align-content: start; gap: .54cqw; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #d3a65e #362311; padding: .15cqw .6cqw .5cqw .15cqw; }
#nx198PetModal.nx200-pet-modal .nx200-pet-card-wrap { min-width: 0; position: relative; }
#nx198PetModal.nx200-pet-modal .nx198-pet-choice { position: relative; display: block; width: 100%; min-width: 0; aspect-ratio: 157 / 161; padding: 0; border: 0; border-radius: .65cqw; overflow: hidden; background: radial-gradient(circle, #70583177, #24190de0); box-shadow: none; }
#nx198PetModal.nx200-pet-modal .nx198-pet-choice::after { content: ''; position: absolute; inset: 0; background: url('assets/ui-200/pets-card-frame.png') center / contain no-repeat; pointer-events: none; }
#nx198PetModal.nx200-pet-modal .nx198-pet-choice > img { position: absolute; width: 94%; height: 94%; top: 3%; left: 3%; object-fit: contain; }
#nx198PetModal.nx200-pet-modal .nx198-rank { border-radius: .3cqw; border-color: #d0b075; font-family: Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx198-rank.R { background: linear-gradient(#476482, #162b45); color: #d4efff; }
#nx198PetModal.nx200-pet-modal .nx198-rank.SR { background: linear-gradient(#684079, #371345); color: #efd5ff; }
#nx198PetModal.nx200-pet-modal .nx198-rank.SSR { background: linear-gradient(#946622, #51300a); color: #ffedb5; }
#nx198PetModal.nx200-pet-modal .nx198-pet-choice > .nx198-rank { position: absolute; left: .25cqw; top: .25cqw; z-index: 2; font-size: 1.45cqw; padding: .08cqw .42cqw; }
#nx198PetModal.nx200-pet-modal .nx198-pet-choice.is-selected { box-shadow: inset 0 0 0 .16cqw #ffde8a, 0 0 .6cqw #f5bd5c90; }
#nx198PetModal.nx200-pet-modal .nx200-pet-card-level { position: absolute; left: .25cqw; right: .25cqw; bottom: .15cqw; padding: .3cqw .45cqw; background: linear-gradient(transparent,#1c130bee); color: #fff2d4; font: 1.35cqw Georgia, serif; text-align: left; }
#nx198PetModal.nx200-pet-modal .nx200-following-dot { position: absolute; width: .6cqw; height: .6cqw; background: #b9dfa9; border: 1px solid #fff0bc; border-radius: 50%; right: .5cqw; top: .6cqw; }
#nx198PetModal.nx200-pet-modal .nx200-empty-grid { grid-column: 1/-1; font-size: 1.3cqw; color: #c7b491; }
#nx198PetModal.nx200-pet-modal .nx198-pet-art { padding: .7cqw; background: none; display: grid; place-items: center; }
#nx198PetModal.nx200-pet-modal .nx198-pet-art > img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 0 1cqw #f2d89f25); }
#nx198PetModal.nx200-pet-modal .nx198-pet-details h3 { display: flex; align-items: center; justify-content: space-between; gap: .2cqw; padding: 0; margin: 0; font: 2.1cqw Georgia, serif; text-transform: uppercase; white-space: nowrap; }
#nx198PetModal.nx200-pet-modal .nx198-pet-details h3 .nx198-rank { font-size: 1.45cqw; padding: .15cqw .5cqw; }
#nx198PetModal.nx200-pet-modal .nx198-pet-level { padding: 0; margin: 0; font: 1.6cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx198-pet-exp { border: 0; border-radius: .25cqw; background: transparent; }
#nx198PetModal.nx200-pet-modal .nx198-pet-exp i { background: linear-gradient(90deg,#66815b,#a9c38c); opacity: .9; }
#nx198PetModal.nx200-pet-modal .nx198-pet-exp span { display: flex; align-items: center; justify-content: center; padding: 0 .4cqw; font: 1.12cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx198-pet-details > small { margin: 0; font: .8cqw Georgia, serif; line-height: 1.25; }
#nx198PetModal.nx200-pet-modal .nx198-pet-details dl div { display: flex; align-items: center; justify-content: space-between; gap: .5cqw; padding: 0 .8cqw; border: 0; background: transparent; font: 1.45cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx198-pet-details dt { display: flex; align-items: center; gap: .7cqw; white-space: nowrap; }
#nx198PetModal.nx200-pet-modal .nx198-pet-details dt i { color: #dfc18b; font: normal 1.7cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-pet-food-count { display: flex; align-items: center; justify-content: center; gap: .4cqw; font: 1.25cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-pet-food-count img { width: 4cqw; height: 4.8cqw; object-fit: contain; }
#nx198PetModal.nx200-pet-modal .nx200-pet-food-count strong { display: inline-block; padding-top: .35cqw; font-size: 1.45cqw; font-weight: 400; }
#nx198PetModal.nx200-pet-modal .nx200-pet-detail-footer button { font: 1.7cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx198-pet-empty { padding: 1cqw; text-align: center; font-size: 1.7cqw; }
#nx198PetModal.nx200-pet-modal .nx198-pet-empty svg { width: 4cqw; height: 4cqw; }

/* Two material slots; a pet is never chosen merely by opening this tab. */
#nx198PetModal.nx200-pet-modal .nx200-merge-workbench > h3 { margin: 0; text-align: center; font: 2.2cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-merge-slot-wrap { padding: 0; }
#nx198PetModal.nx200-pet-modal .nx200-merge-slot-wrap h4 { position: absolute; left: 21%; top: -5.2%; width: 58%; height: 10.5%; z-index: 2; margin: 0; display: grid; place-items: center; background: none; border: 0; font: 1.4cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-merge-slot { display: block; position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; border-radius: 2.3cqw; }
#nx198PetModal.nx200-pet-modal .nx200-merge-slot.is-active { box-shadow: inset 0 0 0 .13cqw #ffe0a0, 0 0 .65cqw #eab45c80; }
#nx198PetModal.nx200-pet-modal .nx200-merge-slot img { width: 100%; height: 93%; object-fit: contain; padding: .5cqw; }
#nx198PetModal.nx200-pet-modal .nx200-merge-slot > .nx198-rank { position: absolute; top: 1cqw; right: 1cqw; font-size: 1.8cqw; }
#nx198PetModal.nx200-pet-modal .nx200-merge-slot > b:not(.nx198-rank) { display: grid; place-items: center; height: 80%; font: 4cqw Georgia, serif; color: #c19b60; }
#nx198PetModal.nx200-pet-modal .nx200-merge-slot > span { position: absolute; bottom: .6cqw; left: .7cqw; right: .7cqw; font: 1.45cqw Georgia, serif; text-align: center; padding: .25cqw; background: #352310a0; }
#nx198PetModal.nx200-pet-modal .nx200-merge-remove { position: absolute; right: .5cqw; bottom: .5cqw; z-index: 3; padding: .15cqw .35cqw; font-size: .95cqw; min-height: 0; }
#nx198PetModal.nx200-pet-modal .nx200-merge-plus { display: none; }
#nx198PetModal.nx200-pet-modal .nx200-merge-result-preview { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: .25cqw; border: 0; background: none; }
#nx198PetModal.nx200-pet-modal .nx200-merge-result-preview img { width: 78%; height: 72%; object-fit: contain; }
#nx198PetModal.nx200-pet-modal .nx200-merge-result-preview svg { width: 4cqw; height: 4cqw; fill: #edcd8b; }
#nx198PetModal.nx200-pet-modal .nx200-merge-result-preview strong { color: #e5baf7; font: 1.3cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-merge-chance { margin: 0; display: flex; align-items: center; justify-content: center; gap: .6cqw; font: 1.7cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-merge-chance b { font-size: 2.6cqw; color: #f0ca72; }
#nx198PetModal.nx200-pet-modal .nx200-merge-rule { border: 0; background: none; padding: .5cqw .65cqw; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #987544 transparent; }
#nx198PetModal.nx200-pet-modal .nx200-merge-rule p { margin: 0 0 .3cqw; color: #3e2813; font: .95cqw Georgia, serif; line-height: 1.25; }
#nx198PetModal.nx200-pet-modal .nx200-merge-workbench > small { text-align: center; font-size: .9cqw; }
#nx198PetModal.nx200-pet-modal .nx200-merge-grid .nx198-pet-choice { aspect-ratio: 149 / 154; }
#nx198PetModal.nx200-pet-modal .nx200-merge-grid .nx198-pet-choice::after { background-image: url('assets/ui-200/pets-merge-card-frame.png'); }
#nx198PetModal.nx200-pet-modal .nx200-merge-grid .nx198-pet-choice > .nx198-rank { left: auto; right: .3cqw; }
#nx198PetModal.nx200-pet-modal .nx200-placed-mark { position: absolute; right: .4cqw; bottom: 1.7cqw; width: 1.8cqw; height: 1.8cqw; border: 1px solid #ffe5ad; border-radius: 50%; background: #9a7634; color: white; font: 1.4cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx198-pet-choice.is-incompatible { opacity: .35; }
#nx198PetModal.nx200-pet-modal .nx200-merge-grid [data-pet-action="merge-place"] { width: 100%; min-height: 2.4cqw; padding: .1cqw; margin-top: .25cqw; border-radius: .4cqw; font: 1.1cqw Georgia, serif; }

/* Egg reveal uses actual pet IDs/ranks in the server receipt. */
#nx198PetModal.nx200-pet-modal .nx200-egg-stage h3 { margin: 0; display: grid; place-items: center; font: 3cqw Georgia, serif; letter-spacing: .03em; color: #fff1d0; text-shadow: 0 .1cqw .3cqw #000; }
#nx198PetModal.nx200-pet-modal .nx200-egg-stage > p { margin: 0; text-align: center; font: 1.25cqw Georgia, serif; text-shadow: 0 .1cqw .25cqw #000; }
#nx198PetModal.nx200-pet-modal .nx200-egg-hero { object-fit: contain; filter: drop-shadow(0 0 1.6cqw #ffdf9a60); }
#nx198PetModal.nx200-pet-modal .nx200-egg-hero.is-opening { animation: nx200-egg-breathe 1.2s ease-in-out infinite alternate; }
#nx198PetModal.nx200-pet-modal .nx200-egg-count { display: grid; grid-auto-flow: column; align-items: center; justify-content: center; gap: .45cqw; font: 1.5cqw Georgia, serif; color: #fff7e1; text-shadow: 0 1px 3px #000; }
#nx198PetModal.nx200-pet-modal .nx200-egg-catalog h3 { margin: 0; display: grid; place-items: center; font: 1.6cqw Georgia, serif; text-align: center; }
#nx198PetModal.nx200-pet-modal .nx200-egg-species > div { display: flex; flex-direction: column; padding: .3cqw; border: 0; background: none; }
#nx198PetModal.nx200-pet-modal .nx200-egg-species img { width: 100%; height: calc(100% - 1.25cqw); min-height: 0; object-fit: contain; }
#nx198PetModal.nx200-pet-modal .nx200-egg-species span { text-align: center; white-space: nowrap; font: .95cqw Georgia, serif; color: #f4d6a0; }
#nx198PetModal.nx200-pet-modal .nx200-egg-catalog h4 { margin: 0; display: grid; place-items: center; font: 1.45cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-egg-rates { display: flex; justify-content: space-around; align-items: center; gap: .3cqw; font: 1.25cqw Georgia, serif; }
#nx198PetModal.nx200-pet-modal .nx200-egg-rates > span { display: flex; align-items: center; gap: .35cqw; white-space: nowrap; }
#nx198PetModal.nx200-pet-modal .nx200-egg-rates .nx198-rank { padding: .15cqw .4cqw; font-size: 1.3cqw; }
#nx198PetModal.nx200-pet-modal [data-pet-action="egg-results"] { min-height: 0; padding: .15cqw .4cqw; font: .95cqw Georgia, serif; }

/* Shop remains a separate real purchase interface. No screenshot text as data. */
#nx198PetModal.nx200-pet-modal[data-pet-screen="shop"] .nx198-pet-panel { background-image: none; background-color: #302214f5; border: 1px solid #d5b475; border-radius: 1.4cqw; box-shadow: inset 0 0 0 .4cqw #24170d, inset 0 0 0 .5cqw #97723e; }
#nx198PetModal.nx200-pet-modal[data-pet-screen="shop"] .nx198-pet-panel > header { display: flex; position: absolute; inset: 5% 5% auto; height: 9%; justify-content: space-between; align-items: center; }
#nx198PetModal.nx200-pet-modal[data-pet-screen="shop"] h2 { position: static; width: auto; height: auto; }
#nx198PetModal.nx200-pet-modal[data-pet-screen="shop"] .nx198-pet-tabs { display: none; }
#nx198PetModal.nx200-pet-modal[data-pet-screen="shop"] .nx198-pet-close { position: static; width: 4cqw; height: 4cqw; color: #f6d398; font-size: 3cqw; }
#nx198PetModal.nx200-pet-modal[data-pet-screen="shop"] .nx198-pet-body { display: block; position: absolute; inset: 17% 5% 10%; min-height: 0; overflow-y: auto; }
#nx198PetModal.nx200-pet-modal .nx198-pet-shop { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); height: 87%; padding: 0; gap: 1.5cqw; }
#nx198PetModal.nx200-pet-modal .nx198-pet-shop article { padding: 1cqw; }
#nx198PetModal.nx200-pet-modal .nx198-pet-shop article img { height: 50%; min-height: 0; }
#nx198PetModal.nx200-pet-modal .nx198-pet-shop h3 { margin: .6cqw 0 .3cqw; font-size: 1.7cqw; }
#nx198PetModal.nx200-pet-modal .nx198-pet-shop :is(p,strong,button) { font-size: 1.15cqw; }
#nx198PetModal.nx200-pet-modal .nx198-pet-shop button { padding: .6cqw; }
#nx198PetModal.nx200-pet-modal .nx198-pet-shop-note { font-size: 1cqw; }
#nx198PetModal.nx200-pet-modal .nx198-pet-submodal { position: fixed; z-index: 1000; inset: 0; padding: max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); }
#nx198PetModal.nx200-pet-modal .nx198-pet-submodal article { max-height: 100%; }
.nx200-item-modal-art { display: block; width: 100px; height: 130px; object-fit: contain; margin: 10px auto; }
#nx198PetModal.nx200-pet-modal .nx198-pet-submodal .nx200-egg-results { width: min(880px,96vw,100%); max-width: none; text-align: center; }
.nx200-egg-results-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; padding: 12px 0; }
.nx200-hatch-card { min-width: 0; border: 1px solid #af9463; border-radius: 8px; background: radial-gradient(circle,#a28c5c3b,#25190c); padding: 9px; animation: nx200-hatch-reveal .35s both; animation-delay: calc(var(--reveal-order)*70ms); }
.nx200-hatch-card.SR { border-color: #c6a0d9; background: radial-gradient(circle,#9269aa4f,#2a182e); }
.nx200-hatch-card.SSR { border-color: #ffe3a2; background: radial-gradient(circle,#d7aa3c5e,#412d11); }
.nx200-hatch-card > img { width: 100%; height: min(21vh,170px); object-fit: contain; }
.nx200-hatch-card :is(h4,p) { margin: 5px 0 0; font-size: 12px; }
@keyframes nx200-egg-breathe { from { filter: drop-shadow(0 0 1cqw #ffdf9a65); } to { filter: drop-shadow(0 0 2.2cqw #ffdf9ad0); } }
@keyframes nx200-hatch-reveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (max-height: 480px) { #nx198PetModal.nx200-pet-modal .nx198-pet-submodal article { padding: 12px; } #nx198PetModal.nx200-pet-modal .nx198-pet-submodal p { margin-block: 6px; font-size: 12px; } }
@media (prefers-reduced-motion: reduce) { #nx198PetModal.nx200-pet-modal *, #nx198PetModal.nx200-pet-modal *::before { animation: none !important; } }

/* Positions below are native-canvas measurements, not independently scaled assets. */
#nx198PetModal.nx200-pet-modal h2 { position: absolute; left: 9.330144%; top: 9.139214%; width: 15.490431%; height: 7.120085%;  }
#nx198PetModal.nx200-pet-modal [data-pet-view="pets"] { position: absolute; left: 27.691388%; top: 9.245484%; width: 15.789474%; height: 7.226355%;  }
#nx198PetModal.nx200-pet-modal [data-pet-view="merge"] { position: absolute; left: 44.138756%; top: 9.245484%; width: 15.849282%; height: 7.013815%;  }
#nx198PetModal.nx200-pet-modal [data-pet-view="eggs"] { position: absolute; left: 60.526316%; top: 9.245484%; width: 15.311005%; height: 7.013815%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-close { position: absolute; left: 92.224880%; top: 8.289054%; width: 4.306220%; height: 7.438895%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-wallet { position: absolute; left: 53.827751%; top: 91.392136%; width: 40.071770%; height: 2.231668%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-message { position: absolute; left: 5.143541%; top: 90.648247%; width: 47.248804%; height: 2.975558%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-retry { position: absolute; left: 39.234450%; top: 86.503719%; width: 6.100478%; height: 3.081828%;  }
#nx198PetModal.nx200-pet-modal .nx200-pet-collection > header { position: absolute; left: 5.322967%; top: 18.916047%; width: 38.337321%; height: 5.526036%;  }
#nx198PetModal.nx200-pet-modal .nx200-pet-search { position: absolute; left: 5.143541%; top: 25.504782%; width: 18.361244%; height: 5.313496%;  }
#nx198PetModal.nx200-pet-modal [data-pet-rank="all"] { position: absolute; left: 24.461722%; top: 25.823592%; width: 5.622010%; height: 4.888417%;  }
#nx198PetModal.nx200-pet-modal [data-pet-rank="R"] { position: absolute; left: 30.741627%; top: 25.929862%; width: 4.126794%; height: 4.782147%;  }
#nx198PetModal.nx200-pet-modal [data-pet-rank="SR"] { position: absolute; left: 35.526316%; top: 25.929862%; width: 4.126794%; height: 4.782147%;  }
#nx198PetModal.nx200-pet-modal [data-pet-rank="SSR"] { position: absolute; left: 40.311005%; top: 25.929862%; width: 4.186603%; height: 4.782147%;  }
#nx198PetModal.nx200-pet-modal .nx200-pet-collection-grid { position: absolute; left: 4.844498%; top: 33.049947%; width: 40.011962%; height: 55.897981%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-art { position: absolute; left: 47.846890%; top: 19.978746%; width: 23.026316%; height: 58.129649%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-details h3 { position: absolute; left: 73.205742%; top: 25.611052%; width: 20.394737%; height: 5.100956%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-level { position: absolute; left: 73.205742%; top: 32.199787%; width: 20.035885%; height: 2.975558%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-exp { position: absolute; left: 72.906699%; top: 36.025505%; width: 20.394737%; height: 2.337938%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-details > small { position: absolute; left: 73.086124%; top: 39.426142%; width: 20.215311%; height: 2.231668%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-details dl div:nth-child(1) { position: absolute; left: 72.607656%; top: 45.696068%; width: 21.052632%; height: 5.738576%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-details dl div:nth-child(2) { position: absolute; left: 72.607656%; top: 52.284803%; width: 21.052632%; height: 5.738576%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-details dl div:nth-child(3) { position: absolute; left: 72.607656%; top: 59.086079%; width: 21.052632%; height: 5.844846%;  }
#nx198PetModal.nx200-pet-modal .nx200-pet-skills { position: absolute; left: 72.248804%; top: 67.162593%; width: 21.650718%; height: 8.607864%;  }
#nx198PetModal.nx200-pet-modal .nx200-pet-food-count { position: absolute; left: 48.564593%; top: 79.914984%; width: 13.157895%; height: 10.095643%;  }
#nx198PetModal.nx200-pet-modal [data-pet-action="feed"] { position: absolute; left: 62.858852%; top: 79.808714%; width: 15.909091%; height: 9.670563%;  }
#nx198PetModal.nx200-pet-modal [data-pet-action="follow"] { position: absolute; left: 79.724880%; top: 79.808714%; width: 15.550239%; height: 9.670563%;  }
#nx198PetModal.nx200-pet-modal .nx198-pet-empty { position: absolute; left: 48.863636%; top: 35.281615%; width: 43.779904%; height: 22.316684%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] h2 { position: absolute; left: 12.619617%; top: 7.332625%; width: 22.188995%; height: 6.482465%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] [data-pet-view="pets"] { position: absolute; left: 8.014354%; top: 14.877790%; width: 14.354067%; height: 6.376196%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] [data-pet-view="merge"] { position: absolute; left: 23.265550%; top: 14.984060%; width: 13.755981%; height: 6.482465%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] [data-pet-view="eggs"] { position: absolute; left: 37.799043%; top: 14.984060%; width: 14.533493%; height: 6.269926%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx198-pet-close { position: absolute; left: 90.849282%; top: 8.820404%; width: 3.827751%; height: 6.588735%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx200-merge-workbench > h3 { position: absolute; left: 17.643541%; top: 22.422954%; width: 25.059809%; height: 6.588735%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx200-merge-slot-wrap:nth-child(1) { position: absolute; left: 8.253589%; top: 30.924548%; width: 18.361244%; height: 30.180659%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx200-merge-slot-wrap:nth-child(3) { position: absolute; left: 33.492823%; top: 30.924548%; width: 18.301435%; height: 30.180659%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx200-merge-result-preview { position: absolute; left: 10.705742%; top: 64.505845%; width: 9.988038%; height: 16.046759%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx200-merge-chance { position: absolute; left: 22.188995%; top: 64.612115%; width: 27.332536%; height: 4.888417%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx200-merge-rule { position: absolute; left: 22.069378%; top: 70.350691%; width: 27.332536%; height: 8.182784%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] [data-pet-action="merge"] { position: absolute; left: 13.516746%; top: 81.615303%; width: 16.985646%; height: 9.032944%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] [data-pet-action="merge-reset"] { position: absolute; left: 31.339713%; top: 81.615303%; width: 15.430622%; height: 9.032944%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx200-merge-roster > header { position: absolute; left: 56.399522%; top: 23.698193%; width: 36.124402%; height: 5.100956%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx200-merge-grid { position: absolute; left: 55.861244%; top: 30.074389%; width: 36.423445%; height: 56.323061%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx200-merge-workbench > small { position: absolute; left: 22.488038%; top: 78.427205%; width: 26.614833%; height: 2.337938%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx198-pet-message { position: absolute; left: 55.382775%; top: 86.716259%; width: 33.791866%; height: 3.613177%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx198-pet-wallet { position: absolute; left: 53.887560%; top: 92.986185%; width: 40.191388%; height: 2.231668%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="merge"] .nx198-pet-retry { position: absolute; left: 89.174641%; top: 86.716259%; width: 4.306220%; height: 3.613177%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] h2 { position: absolute; left: 9.330144%; top: 4.888417%; width: 15.490431%; height: 6.907545%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] [data-pet-view="pets"] { position: absolute; left: 27.691388%; top: 4.994687%; width: 15.789474%; height: 7.226355%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] [data-pet-view="merge"] { position: absolute; left: 44.138756%; top: 4.994687%; width: 15.849282%; height: 7.013815%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] [data-pet-view="eggs"] { position: absolute; left: 60.526316%; top: 4.994687%; width: 15.311005%; height: 7.013815%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx198-pet-close { position: absolute; left: 92.224880%; top: 4.144527%; width: 4.306220%; height: 7.438895%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-info { position: absolute; left: 3.827751%; top: 17.534538%; width: 8.014354%; height: 12.221041%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-stage h3 { position: absolute; left: 26.255981%; top: 16.471838%; width: 45.813397%; height: 6.163656%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-stage > p { position: absolute; left: 26.255981%; top: 23.804463%; width: 45.813397%; height: 2.975558%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-hero { position: absolute; left: 31.698565%; top: 26.354942%; width: 34.688995%; height: 51.222104%; }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-count { position: absolute; left: 32.954545%; top: 78.746015%; width: 33.133971%; height: 3.825717%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] [data-pet-action="open-one"] { position: absolute; left: 27.811005%; top: 83.528162%; width: 21.112440%; height: 10.201913%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] [data-pet-action="open-ten"] { position: absolute; left: 50.598086%; top: 83.528162%; width: 21.531100%; height: 10.201913%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-catalog h3 { position: absolute; left: 75.418660%; top: 20.191286%; width: 17.165072%; height: 5.207226%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-species > div:nth-child(1) { position: absolute; left: 72.966507%; top: 27.311371%; width: 10.466507%; height: 17.853348%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-species > div:nth-child(2) { position: absolute; left: 84.389952%; top: 27.311371%; width: 10.406699%; height: 17.853348%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-species > div:nth-child(3) { position: absolute; left: 72.607656%; top: 47.502657%; width: 6.937799%; height: 13.283741%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-species > div:nth-child(4) { position: absolute; left: 80.382775%; top: 47.502657%; width: 6.997608%; height: 13.283741%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-species > div:nth-child(5) { position: absolute; left: 88.277512%; top: 47.502657%; width: 6.877990%; height: 13.283741%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-catalog h4 { position: absolute; left: 76.794258%; top: 62.699256%; width: 14.234450%; height: 3.719447%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx200-egg-rates { position: absolute; left: 72.906699%; top: 68.119022%; width: 22.129187%; height: 4.144527%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] [data-pet-action="egg-results"] { position: absolute; left: 76.255981%; top: 72.794899%; width: 15.251196%; height: 2.975558%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx198-pet-message { position: absolute; left: 27.571770%; top: 94.686504%; width: 44.198565%; height: 2.869288%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx198-pet-wallet { position: absolute; left: 72.248804%; top: 79.489904%; width: 23.325359%; height: 2.444208%;  }
#nx198PetModal.nx200-pet-modal[data-pet-screen="eggs"] .nx198-pet-retry { position: absolute; left: 65.011962%; top: 78.852285%; width: 6.160287%; height: 2.975558%;  }
#nx198PetModal.nx200-pet-modal .nx200-pet-skills, #nx198PetModal.nx200-pet-modal .nx200-pet-skills:hover:not(:disabled) { border: 0; padding: 0; box-shadow: none; color: transparent; text-shadow: none; font-size: 0; background: url('assets/ui-200/pets-btn-skill.png') center / contain no-repeat; }
#nx198PetModal.nx200-pet-modal [data-pet-action="feed"], #nx198PetModal.nx200-pet-modal [data-pet-action="feed"]:hover:not(:disabled) { border: 0; padding: 0; box-shadow: none; color: transparent; text-shadow: none; font-size: 0; background: url('assets/ui-200/pets-btn-feed.png') center / contain no-repeat; }
#nx198PetModal.nx200-pet-modal [data-pet-action="merge"], #nx198PetModal.nx200-pet-modal [data-pet-action="merge"]:hover:not(:disabled) { border: 0; padding: 0; box-shadow: none; color: transparent; text-shadow: none; font-size: 0; background: url('assets/ui-200/pets-btn-merge.png') center / contain no-repeat; }
#nx198PetModal.nx200-pet-modal [data-pet-action="merge-reset"], #nx198PetModal.nx200-pet-modal [data-pet-action="merge-reset"]:hover:not(:disabled) { border: 0; padding: 0; box-shadow: none; color: transparent; text-shadow: none; font-size: 0; background: url('assets/ui-200/pets-btn-cancel.png') center / contain no-repeat; }
#nx198PetModal.nx200-pet-modal [data-pet-action="open-one"], #nx198PetModal.nx200-pet-modal [data-pet-action="open-one"]:hover:not(:disabled) { border: 0; padding: 0; box-shadow: none; color: transparent; text-shadow: none; font-size: 0; background: url('assets/ui-200/pets-btn-open-one.png') center / contain no-repeat; }
#nx198PetModal.nx200-pet-modal [data-pet-action="open-ten"], #nx198PetModal.nx200-pet-modal [data-pet-action="open-ten"]:hover:not(:disabled) { border: 0; padding: 0; box-shadow: none; color: transparent; text-shadow: none; font-size: 0; background: url('assets/ui-200/pets-btn-open-ten.png') center / contain no-repeat; }
#nx198PetModal.nx200-pet-modal .nx200-egg-info, #nx198PetModal.nx200-pet-modal .nx200-egg-info:hover:not(:disabled) { border: 0; padding: 0; box-shadow: none; color: transparent; text-shadow: none; font-size: 0; background: url('assets/ui-200/pets-btn-info.png') center / contain no-repeat; }
#nx198PetModal.nx200-pet-modal .nx200-egg-info > span { font-size: 0; }
#nx198PetModal.nx200-pet-modal [data-pet-action="follow"], #nx198PetModal.nx200-pet-modal [data-pet-action="follow"]:hover:not(:disabled) { border: 0; padding: 0 .6cqw; box-shadow: none; color: #fff0cb; font: 1.7cqw Georgia, serif; background: url('assets/ui-200/pets-btn-green-empty.png') center / contain no-repeat; }
#nx198PetModal.nx200-pet-modal .nx198-pet-tabs button:hover:not(:disabled), #nx198PetModal.nx200-pet-modal .nx200-pet-filters button:hover:not(:disabled), #nx198PetModal.nx200-pet-modal .nx200-merge-slot:hover:not(:disabled), #nx198PetModal.nx200-pet-modal .nx198-pet-close:hover:not(:disabled) { background: #ffdda513; }
#nx198PetModal.nx200-pet-modal .nx198-pet-choice:hover:not(:disabled) { background: radial-gradient(circle,#876f4655,#281c11); }

#nx198PetModal.nx200-pet-modal [data-pet-action="follow"][aria-pressed="false"], #nx198PetModal.nx200-pet-modal [data-pet-action="follow"][aria-pressed="false"]:hover:not(:disabled) { color: transparent; font-size: 0; background-image: url('assets/ui-200/pets-btn-follow.png'); }
.nx200-hatch-card:only-child { grid-column: 3; }

/* 1.0.102 common painted shell — CSS positions original raster images only.
   Outer art fills side margins; the complete inner frame retains one scale.
   All three tabs have the same 212×54.606 native image box. */
#nx198PetModal.nx200-pet-modal{position:fixed;inset:0;display:block;padding:0;overflow:hidden;background:#615337 url('assets/ui-202/pet-common-scenic-left.png') left center/auto 100% repeat-x;container-type:size}
#nx198PetModal.nx200-pet-modal::before{content:'';position:absolute;inset:0;pointer-events:none;background:url('assets/ui-202/pet-common-scenic-right.png') right center/auto 100% no-repeat}
#nx198PetModal.nx200-pet-modal .nx198-pet-panel,#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-panel{position:absolute;left:50%;top:50%;width:1918px;height:820px;max-width:none;max-height:none;aspect-ratio:1918/820;transform:translate(-50%,-50%) scale(var(--pet-shell-scale,1));transform-origin:center;container-type:inline-size;display:block;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent url('assets/ui-202/pet-common-shell-wide.png') center/contain no-repeat}
#nx198PetModal.nx200-pet-modal .nx198-pet-panel>header,#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] .nx198-pet-panel>header{display:contents}
#nx198PetModal.nx200-pet-modal[data-pet-screen] h2{position:absolute;left:437px;top:103px;width:199px;height:55px;margin:0;overflow:hidden;color:transparent;font-size:0;pointer-events:none}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-tabs{display:contents}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-tabs button,#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-tabs button:hover:not(:disabled){position:absolute;top:104px;width:212px;height:54.606px;min-height:0;border:0;border-radius:0;box-shadow:none;padding:0;display:flex;align-items:center;justify-content:center;gap:10px;font:25px Georgia,serif;background:url('assets/ui-202/adventure-pets/pet-tab-inactive.png') center/contain no-repeat;color:#f5dfb7}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-tabs button.is-active{background-image:url('assets/ui-202/adventure-pets/pet-tab-active.png');color:#fff4d3}
#nx198PetModal.nx200-pet-modal[data-pet-screen] [data-pet-view='pets']{left:676px}
#nx198PetModal.nx200-pet-modal[data-pet-screen] [data-pet-view='merge']{left:906px}
#nx198PetModal.nx200-pet-modal[data-pet-screen] [data-pet-view='eggs']{left:1126px}
#nx198PetModal.nx200-pet-modal .nx198-pet-tabs svg{width:30px;height:30px;fill:currentColor}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-close,#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-close:hover:not(:disabled){position:absolute;left:1513px;top:99px;width:60px;height:60px;border:0;border-radius:0;background:none;box-shadow:none;color:transparent;font-size:0}
/* Authored body coordinates are retained inside a uniformly scaled content layer. */
#nx198PetModal.nx200-pet-modal .nx198-pet-body{position:absolute;display:block;left:353px;top:73.4px;width:1672px;height:941px;container-type:inline-size;transform:scale(.7287);transform-origin:top left;overflow:visible;background:none}
#nx198PetModal.nx200-pet-modal .nx198-pet-body::before{content:'';position:absolute;left:60px;top:167px;width:1554px;height:693px;pointer-events:none;background:url('assets/ui-202/adventure-pets/collection-body.png') center/contain no-repeat}
#nx198PetModal.nx200-pet-modal[data-pet-screen='merge'] .nx198-pet-body{left:318px;top:42px;transform:scale(.76515)}
#nx198PetModal.nx200-pet-modal[data-pet-screen='merge'] .nx198-pet-body::before{left:85px;top:200px;width:1504px;height:660px;background-image:url('assets/ui-202/adventure-pets/merge-body.png')}
#nx198PetModal.nx200-pet-modal[data-pet-screen='eggs'] .nx198-pet-body{left:417px;top:115.37px;transform:scale(.64743)}
#nx198PetModal.nx200-pet-modal[data-pet-screen='eggs'] .nx198-pet-body::before{left:32px;top:123px;width:1604px;height:780px;background-image:url('assets/ui-202/adventure-pets/eggs-body.png')}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-wallet{position:absolute;left:962px;top:704px;width:593px;height:20px;font:14px Georgia,serif;margin:0;padding:0;border:0}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-message{position:absolute;left:350px;top:704px;width:600px;height:22px;max-height:22px;font:14px Georgia,serif;margin:0;padding:0;background:none;border:0;overflow:auto}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-retry{position:absolute;left:900px;top:697px;width:85px;height:30px;font:14px Georgia,serif}
/* The shop uses the same drawn outer shell and three original portrait rims. */
#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] h2{left:437px;top:103px;width:199px;height:55px;color:#fff0cb;background:url('assets/ui-202/adventure-pets/pet-title-empty.png') center/cover no-repeat;font:23px Georgia,serif;display:flex;align-items:center;justify-content:center;text-align:center;white-space:normal}
#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] .nx198-pet-tabs{display:contents}
#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] .nx198-pet-body{left:350px;top:195px;width:1216px;height:505px;inset:auto;transform:none;position:absolute;overflow:hidden;display:block}
#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] .nx198-pet-body{left:350px;top:195px}
#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] .nx198-pet-body::before{display:none}
#nx198PetModal.nx200-pet-modal .nx198-pet-shop{position:absolute;inset:0 0 35px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;height:auto;padding:0}
#nx198PetModal.nx200-pet-modal .nx198-pet-shop article{padding:25px 55px 20px;border:0;border-radius:0;box-shadow:none;background:url('assets/ui-202/adventure-pets/pet-product-frame.png') center/contain no-repeat;display:flex;flex-direction:column;align-items:center;overflow:hidden}
#nx198PetModal.nx200-pet-modal .nx198-pet-shop article img{width:100%;height:235px;min-height:0;object-fit:contain}
#nx198PetModal.nx200-pet-modal .nx198-pet-shop h3{margin:6px 0;font:25px Georgia,serif;text-align:center;white-space:nowrap}
#nx198PetModal.nx200-pet-modal .nx198-pet-shop p{font:17px Georgia,serif;margin:3px 0;text-align:center}
#nx198PetModal.nx200-pet-modal .nx198-pet-shop strong{font:22px Georgia,serif;margin:5px 0;padding:0}
#nx198PetModal.nx200-pet-modal .nx198-pet-shop button{flex:none;width:265px;height:74px;min-height:0;margin:4px 0 0;padding:0;border:0;border-radius:0;box-shadow:none;background:url('assets/ui-200/pets-btn-gold-empty.png') center/contain no-repeat;font:20px Georgia,serif}
#nx198PetModal.nx200-pet-modal .nx198-pet-shop-note{position:absolute;left:10px;right:10px;bottom:0;height:29px;font:16px Georgia,serif;line-height:1.25;margin:0;text-align:center}
#nx198PetModal.nx200-pet-modal .nx198-pet-submodal input{font-size:16px}

/* 1.0.103: the native content canvas had a transparent rectangle over header
   buttons. Clip it to the painted content and explicitly place all real header
   hit areas above its transform stacking context. Raster art stays unchanged. */
#nx198PetModal.nx200-pet-modal .nx198-pet-body{z-index:1;clip-path:inset(167px 58px 81px 60px)}
#nx198PetModal.nx200-pet-modal[data-pet-screen='merge'] .nx198-pet-body{clip-path:inset(200px 83px 81px 85px)}
#nx198PetModal.nx200-pet-modal[data-pet-screen='eggs'] .nx198-pet-body{clip-path:inset(123px 36px 38px 32px)}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-tabs button,#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-close{z-index:4;pointer-events:auto;touch-action:manipulation}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-wallet,#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-message{z-index:2}
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-retry{z-index:4}
/* Shop is only a shop: its painted header contains no navigation tabs. */
#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] .nx198-pet-panel{background-image:url('assets/ui-203/pet-shop-shell-wide.png')}
#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] .nx198-pet-tabs,#nx198PetModal.nx200-pet-modal .nx198-pet-tabs[hidden]{display:none!important}
#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] h2{color:transparent;font-size:0;background:none;pointer-events:none}
#nx198PetModal.nx200-pet-modal[data-pet-screen='shop'] .nx198-pet-body{clip-path:none}
#nx198PetModal.nx200-pet-modal [data-pet-quantity]{cursor:pointer;caret-color:transparent;touch-action:manipulation}

/* NEXORIA bundle206: nexoria-adventure-200.css */
.nx200-adventure{position:fixed;inset:0;z-index:310;background:#160e09;overflow:hidden;color:#ebcb91;font-family:Georgia,"Times New Roman",serif;touch-action:manipulation}
.nx200-adventure[hidden],.nx200-adventure [hidden]{display:none!important}
.nx200-adventure *{box-sizing:border-box}
.nx200-adventure-stage{position:absolute;width:1672px;height:941px;left:50%;top:50%;margin:0;transform:translate(-50%,-50%) scale(var(--adventure-scale,1));transform-origin:center;background:#26180e url("assets/ui-200/adventure-board-clean.png") center/1672px 941px no-repeat;overflow:hidden;isolation:isolate}
.nx200-adventure h2,.nx200-adventure h3,.nx200-adventure h4,.nx200-adventure p{margin:0}
.nx200-adventure button{font-family:inherit;font-weight:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.nx200-adventure button:disabled{cursor:default;filter:saturate(.55) brightness(.7)}
.nx200-adventure button:focus-visible{outline:3px solid #fff0ac;outline-offset:4px}
.nx200-adventure-stage>h2{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.nx200-adventure-close{position:absolute;left:1564px;top:20px;width:82px;height:75px;border:0;background:transparent;font-size:66px;line-height:1;color:#f9e2ad!important}
.nx200-adventure-tabs{position:absolute;left:423px;top:96px;width:823px;height:63px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.nx200-adventure-tabs button{border:0;background:transparent;font-weight:700;font-size:33px;border-radius:17px}
.nx200-adventure-tabs .is-active{color:#ffe4a7;text-shadow:0 0 17px #d99a40;box-shadow:inset 0 0 14px #eac47950}
.nx200-adventure-member{position:absolute;left:63px;top:516px;width:220px;text-align:center}
.nx200-adventure-member h3{font-size:34px;line-height:45px;color:#f7ddb4;white-space:nowrap}
.nx200-adventure-member>span{display:block;font-size:23px;line-height:39px}
.nx200-adventure-exp{height:17px;width:207px;margin:9px auto 8px;border-radius:9px;overflow:hidden;background:#1a100b;border:1px solid #e9bd6a}
.nx200-adventure-exp i{display:block;height:100%;width:0;background:linear-gradient(90deg,#9b6322,#e8bb60);border-radius:inherit}
.nx200-adventure-member p{font-size:23px;line-height:31px}
.nx200-adventure-info,.nx200-adventure-dungeon{position:absolute;left:55px;width:233px;height:58px;border-radius:15px;border:1px solid #c8954e;background:linear-gradient(#624018,#281609);box-shadow:inset 0 0 0 3px #1c1009,inset 0 0 0 4px #b88749;font-size:22px;font-weight:700}
.nx200-adventure-info{left:45px;top:701px;width:246px;height:68px;background:url("assets/ui-200/adventure-btn-info.png") center/contain no-repeat;border:0;box-shadow:none;font-size:0}
.nx200-adventure-dungeon{left:45px;top:781px;width:246px;height:59px;background:url("assets/ui-200/adventure-btn-empty.png") center/contain no-repeat;border:0;box-shadow:none}
.nx200-adventure-ranks{position:absolute;left:548px;top:190px;height:57px;width:503px;display:grid;grid-template-columns:155px 155px 155px;gap:19px}
.nx200-adventure-ranks button{border:0;border-radius:11px;font-size:30px;background:url("assets/ui-200/adventure-rank-inactive.png") center/contain no-repeat}
.nx200-adventure-ranks button.is-active{color:#ffe5a7;background-image:url("assets/ui-200/adventure-rank-active.png");text-shadow:0 0 12px #e69e3b99}
.nx200-adventure-grid{position:absolute;left:395px;top:259px;width:733px;height:560px;display:grid;grid-template-columns:repeat(3,215px);grid-auto-rows:271px;align-content:start;column-gap:29px;row-gap:15px;padding:4px 13px 4px 4px;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#bb9259 #302111}
.nx200-adventure-quest,.nx200-adventure-empty{position:relative;width:215px;height:271px;min-height:271px;border:0;border-radius:9px;background:transparent}
.nx200-adventure-quest{background:url("assets/ui-200/quest-card-empty.png") center/contain no-repeat;color:#39210e!important;box-shadow:0 4px 7px #0009;transition:transform .16s ease,box-shadow .16s ease}
.nx200-adventure-quest.is-selected{transform:translateY(-3px);outline:3px solid #ffde8c;box-shadow:0 0 6px 5px #d89428b3,0 6px 12px #000a}
.nx200-adventure-quest.is-claimed{opacity:.68}
.nx200-adventure-badge{position:absolute;left:23px;top:25px;width:27px;text-align:center;font-size:22px;line-height:27px}
.nx200-adventure-quest>strong{position:absolute;left:64px;right:12px;top:25px;line-height:25px;font-size:19px;white-space:nowrap}
.nx200-adventure-quest img{position:absolute;left:16px;top:62px;width:185px;height:144px;object-fit:contain;pointer-events:none}
.nx200-adventure-quest>span{position:absolute;left:15px;right:15px;top:212px;font-size:16px;line-height:18px;font-weight:bold;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx200-adventure-quest>small{position:absolute;left:12px;right:12px;top:233px;font-size:13px;line-height:16px}
.nx200-adventure-empty{background:#190f0833;box-shadow:inset 0 0 8px #12090255}
.nx200-adventure-detail{position:absolute;left:1166px;top:216px;width:370px;height:622px;color:#382211}
.nx200-adventure-detail header{position:absolute;left:18px;top:10px;right:0;display:flex;align-items:center;gap:31px}
.nx200-adventure-detail-rank{display:flex;align-items:center;justify-content:center;width:52.5px;height:66px;flex-shrink:0;font-size:35px;color:#f4d8a3;background:url("assets/ui-200/quest-rank-badge.png") center/contain no-repeat}
.nx200-adventure-detail h3{font-size:36px;line-height:48px;white-space:nowrap}
.nx200-adventure-detail-art{position:absolute;left:22px;top:91px;width:343px;height:199px;object-fit:contain;pointer-events:none}
.nx200-adventure-objective{position:absolute;left:25px;right:8px;top:315px;max-height:128px;overflow-y:auto;scrollbar-width:thin}
.nx200-adventure-objective h4,.nx200-adventure-reward h4{font-size:24px;line-height:29px}
.nx200-adventure-objective p{font-size:19px;line-height:24px;margin-top:5px}
.nx200-adventure-objective strong{display:block;font-size:18px;line-height:25px}
.nx200-adventure-objective small{display:block;font-size:15px;line-height:19px}
.nx200-adventure-reward{position:absolute;top:440px;left:25px;right:8px}
.nx200-adventure-reward p{font-size:27px;line-height:38px;font-weight:bold}
.nx200-adventure-reward p span{color:#b27818;text-shadow:0 1px #f8d777}
.nx200-adventure-reward strong{font-size:24px;line-height:32px}
.nx200-adventure-primary,.nx200-adventure-register>button{position:absolute;left:39px;top:553px;width:310px;height:74px;border:0;border-radius:16px;font-size:26px;background:url("assets/ui-200/adventure-btn-empty.png") center/contain no-repeat;color:#f6d999!important}
.nx200-adventure-primary.is-accept{background-image:url("assets/ui-200/adventure-btn-accept.png");font-size:0}
.nx200-adventure-register{position:relative;width:100%;height:100%;padding:90px 24px 0;text-align:center}
.nx200-adventure-register-rank{display:block;font-size:98px;line-height:120px;color:#71501d}
.nx200-adventure-register h3{font-size:28px;white-space:normal;line-height:40px;margin-bottom:20px}
.nx200-adventure-register p{font-size:24px;line-height:32px;margin:13px 0}
.nx200-adventure-register>button{bottom:3px}
.nx200-adventure-message{position:absolute;left:390px;top:881px;width:741px;max-height:53px;overflow:auto;text-align:center;font-size:20px;line-height:24px;color:#dbb47b;text-shadow:0 2px #130c06}
.nx200-adventure-message.is-error{color:#ffbb91;width:635px}
.nx200-adventure-retry{position:absolute;left:1038px;top:878px;width:96px;height:43px;background:#573615;border:1px solid #c59c5a;border-radius:9px;font-size:18px}
.nx200-adventure-dialog{position:absolute;inset:0;background:#100905b8;display:grid;place-items:center;z-index:4}
.nx200-adventure-dialog>article{width:680px;max-height:820px;overflow:auto;padding:29px;border-radius:16px;border:2px solid #b58b50;box-shadow:inset 0 0 0 5px #26180e,0 16px 50px #0009;background:linear-gradient(135deg,#593c21,#281a10);font-size:23px;line-height:33px}
.nx200-adventure-dialog header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;gap:20px}
.nx200-adventure-dialog h3{font-size:32px}
.nx200-adventure-dialog h4{margin:20px 0 9px}
.nx200-adventure-dialog p{margin:12px 0}
.nx200-adventure-dialog button{min-height:48px;border-radius:11px;border:1px solid #b88b4d;background:linear-gradient(#784d24,#34200f);padding:5px 21px;font-size:23px}
.nx200-adventure-active-list{display:grid;gap:12px;max-height:420px;overflow-y:auto;margin-bottom:22px}
.nx200-adventure-active-list button{text-align:left;padding:12px 18px}
.nx200-adventure-active-list span{display:block;font-size:20px}
@media(prefers-reduced-motion:reduce){.nx200-adventure-quest{transition:none}}
/* 1.0.102: full screen means the painted hall reaches both screen edges.
   The approved 1672×941 board and every button keep their original geometry. */
.nx200-adventure{background:#382212 url('assets/ui-202/guild-backdrop.png') center/cover no-repeat}
.nx200-adventure-sr-only{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap;border:0!important;padding:0!important}
.nx200-adventure-info{font-size:0}

/* NEXORIA bundle206: dungeon200-ui.css */
#dungeonMapButton200 { position:absolute;right:calc(env(safe-area-inset-right,0px) + 78px);top:16px;width:48px;height:48px;border:1px solid #c9ab70;border-radius:50%;background:linear-gradient(#344449,#101b20);box-shadow:0 2px 7px #0008;color:#fff;z-index:44;padding:10px;touch-action:manipulation; }
#dungeonMapButton200 svg {width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;}
#dungeonMapButton200[hidden],#dungeonMapModal200[hidden] {display:none!important;}
#dungeonMapModal200 {position:fixed;inset:0;z-index:18000;display:grid;place-items:center;background:#080b0fdd;padding:max(2px,env(safe-area-inset-top)) max(2px,env(safe-area-inset-right)) max(2px,env(safe-area-inset-bottom)) max(2px,env(safe-area-inset-left));box-sizing:border-box;}
.d200-map-frame {position:relative;width:min(100%,calc(100dvh * 1672 / 941));aspect-ratio:1672/941;background:url('assets/dungeon-200/map-frame.png') center/100% 100% no-repeat;isolation:isolate;overflow:hidden;}
.d200-map-frame canvas {position:absolute;left:1.1%;top:1.7%;width:97.8%;height:85.2%;object-fit:fill;}
.d200-map-title {position:absolute;left:.54%;top:.85%;width:33.67%;height:auto;pointer-events:none;}
.d200-map-frame button {position:absolute;border:0;padding:0;cursor:pointer;background-color:transparent;background-position:center;background-size:contain;background-repeat:no-repeat;filter:none;}
.d200-map-frame button:hover {filter:brightness(1.15);}
.d200-map-close {left:93.78%;top:2.76%;width:4.72%;aspect-ratio:1;background-image:url('assets/dungeon-200/map-close.png');}
.d200-map-back {left:1.73%;top:87.25%;width:15.43%;aspect-ratio:258/86;background-image:url('assets/dungeon-200/map-back.png');}
.d200-coordinate {position:absolute;right:3.5%;bottom:4.6%;color:#efd8a7;font:600 clamp(10px,1.3vw,20px) Georgia,serif;text-shadow:0 2px #000;}
@media(max-height:450px){#dungeonMapButton200{top:10px;right:72px;width:40px;height:40px;padding:8px;}}

/* NEXORIA bundle206: nexoria-pawn-forge-200.css */
/* Native approved shop02 / forge08 chrome: 1672×941, uniform fit inside game. */
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) { container-type: size; padding: 4px; overflow: hidden; }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) [hidden] { display: none !important; }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) > .nx108-panel {
 position: relative; container-type: inline-size; width: min(100%,calc((100cqh - 8px)*1672/941)); height: auto; max-width: 1672px; max-height: none; aspect-ratio: 1672/941;
 display: block; padding: 0; border: 0; border-radius: 0; overflow: visible; box-shadow: none;
 background-image: var(--nx200-shop-chrome),url('assets/ui-shops-200/shop-panel-fill.png'); background-position: center,0 0; background-size: contain,256px 256px; background-repeat: no-repeat,repeat;
}
#nexoriaPawnPanel { --nx200-shop-chrome: url('assets/ui-shops-200/pawn-chrome.png'); }
#nexoriaBlacksmithPanel { --nx200-shop-chrome: url('assets/ui-shops-200/forge-chrome.png'); }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) .nx108-panel-header,
#nexoriaPawnPanel :is(.nx108-pawn-body,.nx108-pawn-tabs,.nx200-pawn-preview),
#nexoriaBlacksmithPanel :is(.nx108-forge-heading,.nx108-forge-tabs,.nx108-forge-layout,.nx108-forge-stage,.nx108-forge-inventory-pane,.nx200-forge-equipped-pane,.nx196-inherit,.nxpost-inherit-stage,.nxpost-inherit-pair,.nxpost-inherit-pane,.nx196-inherit-actions) { position: static; display: contents; padding: 0; margin: 0; background: none; border: 0; overflow: visible; }
#nexoriaPawnPanel .nx108-panel-header > div,
#nexoriaBlacksmithPanel .nx108-forge-heading > small { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) .nx108-close { color: transparent; font-size: 0; background: transparent; border: 0; box-shadow: none; padding: 0; }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) button { min-width: 0; min-height: 0; touch-action: manipulation; }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) button:disabled { opacity: .43; cursor: default; }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) button:focus-visible { outline: 2px solid #ffe7aa; outline-offset: 1px; }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) .nx108-message { margin: 0; padding: 0; min-height: 0; font: 1.1cqw Georgia,serif; color: #edd9b5; line-height: 1.2; overflow: auto; scrollbar-width: thin; }
#nexoriaPawnPanel .nx108-shop-balance,
#nexoriaBlacksmithPanel .nx200-forge-gold { display: flex; align-items: center; justify-content: center; gap: .45cqw; margin: 0; padding: .2cqw .5cqw; font: 1.8cqw Georgia,serif; color: #fff2d5; border: 1px solid #9c723a; border-radius: .7cqw; background: linear-gradient(110deg,#4c342088,#1e160dbb); }
#nexoriaPawnPanel .nx108-shop-balance::before,
#nexoriaBlacksmithPanel .nx200-forge-gold::before { content: '◉'; margin-right: .6cqw; color: #efc477; font: 2.4cqw Georgia,serif; }
#nexoriaPawnPanel .nx108-shop-balance strong { font-weight: 400; }

/* Pawn: three-column real listings and a fixed detail inspector. */
#nexoriaPawnPanel .nx108-pawn-tabs button { padding: 0 .6cqw; font: 1.9cqw Georgia,serif; color: #f5dfb7; border: 0; border-radius: .6cqw; background: linear-gradient(#65462866,#26180dbb); box-shadow: none; }
#nexoriaPawnPanel .nx108-pawn-tabs button::after { content: ''; position: absolute; inset: 0; background: url('assets/ui-shops-200/pawn-tab-contracts-rim.png') center/contain no-repeat; pointer-events: none; }
#nexoriaPawnPanel .nx108-pawn-tabs button.is-active { background: linear-gradient(#b98239,#5c3c1d); color: #fff7df; text-shadow: 0 1px 2px #211103; box-shadow: 0 0 .5cqw #d5a9597a; }
#nexoriaPawnPanel .nx108-pawn-tabs button [aria-hidden] { margin-right: .7cqw; }
#nexoriaPawnPanel #nx108PawnMine { display: block; padding: .45cqw .7cqw .6cqw; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #c59c5c #2e1c0c; }
#nexoriaPawnPanel #nx108PawnPublic { display: block; padding: .3cqw; overflow: hidden; }
#nexoriaPawnPanel #nx108PawnPublic > h3 { display: none; }
#nexoriaPawnPanel #nx108PawnMine > h3 { margin: .4cqw 0 .6cqw; padding-bottom: .3cqw; border-bottom: 1px solid #7d5a2b; color: #e9c992; font: 1.35cqw Georgia,serif; }
#nexoriaPawnPanel :is(#nx108PawnEligible,#nx108PawnContracts,#nx108PawnListings) { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); grid-auto-rows: max-content; align-content: start; gap: .75cqw; min-height: 0; margin: 0; padding: .25cqw .65cqw .3cqw .25cqw; overflow: visible; }
#nexoriaPawnPanel #nx108PawnListings { width: 100%; height: 100%; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #c69a58 #342110; }
#nexoriaPawnPanel .nx108-pawn-row { display: block; position: relative; width: 100%; min-height: 0; aspect-ratio: 276/298; padding: 0; border: 1px solid #92713e; border-radius: .65cqw; overflow: hidden; background: linear-gradient(135deg,#66472633,#1c140dcc); }
#nexoriaPawnPanel .nx108-pawn-row::after { content: ''; position: absolute; inset: 0; background: url('assets/ui-shops-200/pawn-card-frame.png') center/contain no-repeat; pointer-events: none; }
#nexoriaPawnPanel .nx108-pawn-row.is-selected { border-color: #ffe2a3; box-shadow: inset 0 0 .65cqw #e1a242a0,0 0 .55cqw #e9ae5066; }
#nexoriaPawnPanel .nx108-pawn-row.is-selected::after { background-image: url('assets/ui-shops-200/pawn-card-selected-frame.png'); }
#nexoriaPawnPanel .nx108-pawn-inspect { display: block; width: 100%; height: 100%; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: .65cqw; color: inherit; background: transparent; box-shadow: none; text-align: center; }
#nexoriaPawnPanel .nx108-pawn-inspect:hover { background: #ecc7850d; }
#nexoriaPawnPanel .nx108-pawn-inspect > img { position: absolute; top: 2%; left: 3%; width: 94%; height: 54%; object-fit: contain; }
#nexoriaPawnPanel .nx108-pawn-inspect > div { display: contents; }
#nexoriaPawnPanel .nx108-pawn-inspect strong { position: absolute; top: 57%; left: 4%; width: 92%; height: 12%; display: grid; place-items: center; font: 1.35cqw Georgia,serif; color: #ffedc8; white-space: normal; overflow: hidden; text-overflow: ellipsis; line-height: 1.1; }
#nexoriaPawnPanel .nx200-pawn-card-price { position: absolute; top: 71%; left: 5%; width: 90%; height: 13%; display: flex; align-items: center; justify-content: center; gap: .65cqw; border: 1px solid #825d2f; border-radius: .55cqw; color: #fff0c9; font: 1.45cqw Georgia,serif; background: #17110b80; }
#nexoriaPawnPanel .nx200-pawn-card-price::before { content: '◉'; color: #e1b368; }
#nexoriaPawnPanel .nx200-pawn-card-deadline { position: absolute; left: 5%; bottom: 3%; width: 90%; display: block; font: 1.2cqw Georgia,serif; color: #e7d6b6; text-align: center; white-space: nowrap; }
#nexoriaPawnPanel .nx108-pawn-empty { grid-column: 1/-1; padding: 1cqw; font: 1.35cqw Georgia,serif; color: #c4ad8e; }
#nexoriaPawnPanel .nx200-pawn-preview-image { padding: .7cqw; border: 0; border-radius: .6cqw; background: radial-gradient(ellipse,#9977523b,transparent 68%); box-shadow: none; }
#nexoriaPawnPanel .nx200-pawn-preview-image img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 .4cqw .65cqw #0008); }
#nexoriaPawnPanel #nx200PawnPreviewName { margin: 0; padding: 0; display: flex; align-items: center; font: 2.45cqw Georgia,serif; color: #fff2d6; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#nexoriaPawnPanel #nx200PawnPreviewStats { display: grid; grid-template-rows: repeat(3,minmax(0,1fr)); margin: 0; padding: 0; border: 1px solid #8b6434; border-radius: .6cqw; background: linear-gradient(110deg,#60452b2b,#150f0980); }
#nexoriaPawnPanel #nx200PawnPreviewStats > div { display: flex; align-items: center; justify-content: space-between; gap: .7cqw; padding: 0 1.2cqw; font: 1.65cqw Georgia,serif; border-bottom: 1px solid #7d582e; }
#nexoriaPawnPanel #nx200PawnPreviewStats > div:last-child { border: 0; }
#nexoriaPawnPanel #nx200PawnPreviewStats dd { margin: 0; text-align: right; color: #f6e2b8; }
#nexoriaPawnPanel #nx200PawnPreviewHint { margin: 0; font: 1.25cqw Georgia,serif; color: #ead2a7; }
#nexoriaPawnPanel:has(#nx108PawnMessage:not(:empty)) #nx200PawnPreviewHint { display: none; }
#nexoriaPawnPanel #nx200PawnPreviewAction { border: 0; padding: 0; background: url('assets/ui-shops-200/pawn-btn-buy-rim.png') center/contain no-repeat,linear-gradient(#a46e30,#66441f); border-radius: .7cqw; font: 2.35cqw Georgia,serif; color: #fff0c8; }
#nexoriaPawnPanel #nx200PawnPreviewExit { border: 0; padding: 0; background: url('assets/ui-shops-200/pawn-btn-exit.png') center/contain no-repeat; box-shadow: none; color: transparent; font-size: 0; }
#nexoriaPawnPanel .nx108-pawn-notices { z-index: 6; display: block; padding: 0; border: 0; background: none; max-height: none; overflow: visible; color: #e8cb94; }
#nexoriaPawnPanel .nx108-pawn-notices summary { cursor: pointer; font: 1.1cqw Georgia,serif; padding: .2cqw .4cqw; }
#nexoriaPawnPanel .nx108-pawn-notices > div { position: absolute; bottom: 100%; right: 0; width: 25cqw; max-height: 19cqw; padding: .7cqw; border: 1px solid #b78d4f; border-radius: .65cqw; background: #2c1d10f5; overflow-y: auto; }
#nexoriaPawnPanel .nx108-pawn-notices:not([open]) > div { display: none; }
#nexoriaPawnPanel .nx108-pawn-notices p { font: 1.1cqw Georgia,serif; line-height: 1.35; }

/* Forge: equipped 3×3 / working slots / same-type inventory with 3 columns. */
#nexoriaBlacksmithPanel .nx108-forge-tabs button { padding: 0 .7cqw; min-width: 0; border: 0; border-radius: .65cqw; font: 1.7cqw Georgia,serif; color: #f2dfba; background: linear-gradient(#513822,#24190f); box-shadow: none; }
#nexoriaBlacksmithPanel .nx108-forge-tabs button::after { content: ''; position: absolute; inset: 0; background: url('assets/ui-shops-200/forge-tab-enhance-rim.png') center/contain no-repeat; pointer-events: none; }
#nexoriaBlacksmithPanel .nx108-forge-tabs button.is-active { color: #fff5d7; background: linear-gradient(#a47132,#5b3a1a); box-shadow: 0 0 .45cqw #efca7959; }
#nexoriaBlacksmithPanel :is(.nxpost-inherit-pane,.nx200-forge-equipped-pane,.nx108-forge-inventory-pane) > h3 { margin: 0; padding: 0; display: flex; align-items: center; font: 2.35cqw Georgia,serif; color: #f2d59c; letter-spacing: 0; border-bottom: 1px solid #815d2e; }
#nexoriaBlacksmithPanel :is(.nx200-inherit-source-label,.nx200-inherit-target-label,.nx200-forge-source-label,.nx200-forge-result-label) { display: grid; place-items: center; font: 1.9cqw Georgia,serif; color: #f2deb6; }
#nexoriaBlacksmithPanel :is(#nx196InheritSources,#nx196InheritTargets,#nx200ForgeEquipped,#nx108ForgeInventory) { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); grid-auto-rows: max-content; gap: .75cqw; align-content: start; padding: .3cqw .5cqw .4cqw .2cqw; margin: 0; min-height: 0; overflow-x: hidden; overflow-y: auto; scrollbar-gutter: auto; scrollbar-width: thin; scrollbar-color: #d4a866 #372514; }
#nexoriaBlacksmithPanel :is(#nx196InheritSources,#nx200ForgeEquipped) { gap: .8cqw; }
#nexoriaBlacksmithPanel .nx108-inventory-cell { position: relative; display: block; width: 100%; min-width: 0; height: auto; min-height: 0; aspect-ratio: 127/152; margin: 0; padding: .2cqw; border: 0; border-radius: .85cqw; overflow: hidden; background: radial-gradient(ellipse,#794b8860,#211227cc),url('assets/ui-shops-200/equipment-slot-fill.png') center/127px 152px repeat; box-shadow: none; }
#nexoriaBlacksmithPanel .nx108-inventory-cell::after { content: ''; position: absolute; inset: 0; background: url('assets/ui-shops-200/equipment-slot-frame.png') center/contain no-repeat; pointer-events: none; }
#nexoriaBlacksmithPanel .nx108-inventory-cell::before { display: none; }
#nexoriaBlacksmithPanel .nx108-inventory-cell img { position: absolute; width: 88%; height: 78%; left: 6%; top: 6%; object-fit: contain; transform: none; }
#nexoriaBlacksmithPanel .nx108-inventory-cell--weapon img { object-fit: contain; }
#nexoriaBlacksmithPanel .nx108-inventory-cell .nx108-level-badge { position: absolute; inset: auto .2cqw .55cqw; text-align: center; font: 1.7cqw Georgia,serif; color: #fff3d9; background: none; padding: 0; line-height: 1.1; }
#nexoriaBlacksmithPanel .nx108-inventory-cell .nx108-bind-tag { position: absolute; top: .4cqw; left: .35cqw; right: auto; font: .65cqw Georgia,serif; padding: .1cqw .2cqw; border-radius: .3cqw; background: #171014b3; }
#nexoriaBlacksmithPanel .nx108-inventory-cell b { position: absolute; top: .4cqw; right: .4cqw; bottom: auto; font: 1.2cqw Georgia,serif; color: #ffdfa0; }
#nexoriaBlacksmithPanel .nx108-inventory-cell.is-empty { opacity: .3; background: #231a10; }
#nexoriaBlacksmithPanel .nx108-inventory-cell.is-selected { box-shadow: inset 0 0 0 .2cqw #ffe2a1,0 0 .65cqw #ffc76280; }
#nexoriaBlacksmithPanel .nx108-inventory-cell.is-reference { opacity: .65; }
#nexoriaBlacksmithPanel .nx108-forge-slot { min-width: 0; min-height: 0; width: auto; height: auto; padding: .7cqw; border: 0; border-radius: 1.1cqw; background: radial-gradient(ellipse,#81568355,#291632e0); box-shadow: none; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0; color: #e9d2b1; font: 1.35cqw Georgia,serif; overflow: hidden; }
#nexoriaBlacksmithPanel .nx108-forge-slot::after { content: ''; position: absolute; inset: 0; background: url('assets/ui-shops-200/equipment-slot-large-frame.png') center/contain no-repeat; pointer-events: none; }
#nexoriaBlacksmithPanel .nx108-forge-slot img { width: 92%; height: 83%; object-fit: contain; }
#nexoriaBlacksmithPanel .nx108-forge-slot span { width: 100%; max-height: none; text-align: center; font: 1.9cqw Georgia,serif; line-height: 1.1; }
#nexoriaBlacksmithPanel #nx200ForgeResultSlot span { font-size: 1.15cqw; }
#nexoriaBlacksmithPanel #nx196InheritPreview { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 6cqw; padding: 0; margin: 0; color: #fce6bc; }
#nexoriaBlacksmithPanel #nx196InheritPreview > span { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .12cqw; padding: .2cqw; border: 1px solid #8e6738; border-radius: .6cqw; background: linear-gradient(#53392066,#24190fee); }
#nexoriaBlacksmithPanel #nx196InheritPreview small { font: 1.15cqw Georgia,serif; white-space: nowrap; }
#nexoriaBlacksmithPanel #nx196InheritPreview strong { font: 1.65cqw Georgia,serif; }
#nexoriaBlacksmithPanel #nx196InheritPreview small:last-child { font-size: .75cqw; }
#nexoriaBlacksmithPanel .nxpost-inherit-rule { display: flex; flex-direction: column; justify-content: center; gap: .55cqw; margin: 0; padding: .7cqw 1cqw; border: 1px solid #72512c; border-radius: .7cqw; color: #f2ddb6; background: linear-gradient(#6a492225,#24180c80); }
#nexoriaBlacksmithPanel .nxpost-inherit-rule p { margin: 0; color: #f2ddb6; font: 1.6cqw Georgia,serif; }
#nexoriaBlacksmithPanel .nxpost-inherit-rule p::before { content: '◆'; display: inline-block; width: 2.5cqw; margin-right: .7cqw; color: #e6bd77; text-align: center; }
#nexoriaBlacksmithPanel .nxpost-inherit-rule p:nth-child(2)::before { content: '◇'; }
#nexoriaBlacksmithPanel .nxpost-inherit-rule p:nth-child(3)::before { content: '▣'; }
#nexoriaBlacksmithPanel .nxpost-inherit-rule small { font: .8cqw Georgia,serif; color: #cab18b; }
#nexoriaBlacksmithPanel .nx200-inherit-type { display: flex; align-items: center; justify-content: center; color: #e4ceb0; font: 1.55cqw Georgia,serif; border: 1px solid #a17c45; border-radius: .45cqw; background: #21170dcc; }
#nexoriaBlacksmithPanel #nx196InheritHint { margin: 0; padding: .4cqw .3cqw; font: .8cqw Georgia,serif; color: #d6bd96; background: #24170bdb; border-radius: .3cqw; }
#nexoriaBlacksmithPanel #nx196InheritPages { display: flex; align-items: center; justify-content: space-between; gap: .8cqw; }
#nexoriaBlacksmithPanel #nx196InheritPages span { font: 1.45cqw Georgia,serif; color: #fff0cd; }
#nexoriaBlacksmithPanel #nx196InheritPages button { min-width: 0; padding: 0; width: 3.2cqw; height: 2.7cqw; border: 1px solid #c79b55; border-radius: .6cqw; color: #ffe2ab; background: linear-gradient(#654721,#24190d); font: 2.6cqw Georgia,serif; line-height: .9; }
#nexoriaBlacksmithPanel :is(#nx196InheritAction,#nx108ForgeAction) { border: 0; padding: 0 .6cqw; border-radius: .8cqw; color: #fff0ce; font: 2.15cqw Georgia,serif; box-shadow: none; background: url('assets/ui-shops-200/forge-btn-inherit-rim.png') center/contain no-repeat,linear-gradient(#a66b2c,#61401d); }
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel) { border: 0; padding: 0; color: transparent; font-size: 0; box-shadow: none; background: url('assets/ui-shops-200/forge-btn-cancel.png') center/contain no-repeat; border-radius: .8cqw; }
#nexoriaBlacksmithPanel #nx108ForgeSelectedName { margin: 0; padding: .4cqw; display: grid; place-items: center; color: #f5dcae; font: 1.25cqw Georgia,serif; line-height: 1.15; text-align: center; border: 1px solid #8d6737; border-radius: .6cqw; background: #39271588; }
#nexoriaBlacksmithPanel #nx108ForgeSockets { display: flex; justify-content: center; align-items: center; gap: .2cqw; margin: 0; }
#nexoriaBlacksmithPanel #nx108ForgeSockets .nx108-socket { width: 2.25cqw; height: 2.25cqw; max-width: none; max-height: none; border-radius: .35cqw; }
#nexoriaBlacksmithPanel #nx108ForgeSockets img { max-width: none; max-height: none; }
#nexoriaBlacksmithPanel #nx108ForgeCost { margin: 0; padding: .8cqw 1cqw; border: 1px solid #8c6434; border-radius: .6cqw; color: #ecd7b0; background: #32220ee0; font: 1.35cqw Georgia,serif; line-height: 1.4; overflow-y: auto; scrollbar-width: thin; }
#nexoriaBlacksmithPanel .nx108-forge-item-menu { z-index: 9; position: absolute; left: 50%; top: 50%; bottom: auto; right: auto; transform: translate(-50%,-50%); width: 35cqw; padding: 1.2cqw; border: 1px solid #c3a06a; border-radius: 1cqw; background: linear-gradient(135deg,#624626,#26190e); box-shadow: 0 0 0 100vmax #0005; }
#nexoriaBlacksmithPanel .nx108-forge-item-menu strong { font: 1.55cqw Georgia,serif; }
#nexoriaBlacksmithPanel .nx108-forge-item-menu button { padding: .7cqw .3cqw; min-height: 0; border-radius: .6cqw; font: 1.4cqw Georgia,serif; border: 1px solid #c69753; color: #fff0cc; background: linear-gradient(#956731,#543615); }
#nexoriaPawnPanel #nx108ClosePawn { position: absolute; left: 91.866029%; top: 6.376196%; width: 4.306220%; height: 7.651435%; }
#nexoriaPawnPanel .nx108-shop-balance { position: absolute; left: 65.610048%; top: 6.057386%; width: 22.368421%; height: 7.651435%; }
#nexoriaPawnPanel [data-nx-pawn-view="mine"] { position: absolute; left: 6.818182%; top: 14.771520%; width: 25.119617%; height: 7.332625%; }
#nexoriaPawnPanel [data-nx-pawn-view="public"] { position: absolute; left: 32.595694%; top: 14.771520%; width: 25.119617%; height: 7.332625%; }
#nexoriaPawnPanel #nx108PawnMine { position: absolute; left: 5.263158%; top: 23.698193%; width: 52.631579%; height: 65.249734%; }
#nexoriaPawnPanel #nx108PawnPublic { position: absolute; left: 5.263158%; top: 23.698193%; width: 52.631579%; height: 65.249734%; }
#nexoriaPawnPanel #nx200PawnPreviewInspect { position: absolute; left: 59.808612%; top: 16.259299%; width: 35.406699%; height: 35.069075%; }
#nexoriaPawnPanel #nx200PawnPreviewName { position: absolute; left: 60.765550%; top: 52.072264%; width: 34.090909%; height: 5.207226%; }
#nexoriaPawnPanel #nx200PawnPreviewStats { position: absolute; left: 60.765550%; top: 58.023379%; width: 33.612440%; height: 17.640808%; }
#nexoriaPawnPanel #nx200PawnPreviewAction { position: absolute; left: 59.928230%; top: 78.533475%; width: 18.899522%; height: 9.883103%; }
#nexoriaPawnPanel #nx200PawnPreviewExit { position: absolute; left: 79.306220%; top: 78.639745%; width: 15.729665%; height: 9.776833%; }
#nexoriaPawnPanel #nx200PawnPreviewHint { position: absolute; left: 10.107656%; top: 90.116897%; width: 64.892344%; height: 3.188098%; }
#nexoriaPawnPanel #nx108PawnMessage { position: absolute; left: 10.107656%; top: 90.116897%; width: 64.892344%; height: 3.188098%; }
#nexoriaPawnPanel #nx108PawnNotices { position: absolute; left: 77.930622%; top: 90.116897%; width: 15.251196%; height: 3.294368%; }
#nexoriaBlacksmithPanel #nx108CloseForge { position: absolute; left: 93.002392%; top: 8.607864%; width: 4.366029%; height: 7.651435%; }
#nexoriaBlacksmithPanel #nx200ForgeGold { position: absolute; left: 77.930622%; top: 9.776833%; width: 14.772727%; height: 5.738576%; }
#nexoriaBlacksmithPanel [data-nx-forge="enhance"] { position: absolute; left: 29.545455%; top: 9.351753%; width: 14.832536%; height: 7.226355%; }
#nexoriaBlacksmithPanel [data-nx-forge="socket"] { position: absolute; left: 44.677033%; top: 9.351753%; width: 14.832536%; height: 7.226355%; }
#nexoriaBlacksmithPanel [data-nx-forge="inherit"] { position: absolute; left: 59.808612%; top: 9.351753%; width: 14.832536%; height: 7.226355%; }
#nexoriaBlacksmithPanel .nxpost-inherit-pane:nth-child(2) > h3 { position: absolute; left: 4.964115%; top: 19.766206%; width: 23.564593%; height: 5.313496%; }
#nexoriaBlacksmithPanel .nx200-forge-equipped-pane > h3 { position: absolute; left: 4.964115%; top: 19.766206%; width: 23.564593%; height: 5.313496%; }
#nexoriaBlacksmithPanel .nxpost-inherit-pane:nth-child(3) > h3 { position: absolute; left: 72.069378%; top: 19.659936%; width: 23.385167%; height: 5.526036%; }
#nexoriaBlacksmithPanel .nx108-forge-inventory-pane > h3 { position: absolute; left: 72.069378%; top: 19.659936%; width: 23.385167%; height: 5.526036%; }
#nexoriaBlacksmithPanel #nx200InheritType { position: absolute; left: 84.748804%; top: 19.659936%; width: 10.346890%; height: 4.888417%; }
#nexoriaBlacksmithPanel #nx196InheritSources { position: absolute; left: 4.665072%; top: 26.673751%; width: 24.461722%; height: 52.603613%; }
#nexoriaBlacksmithPanel #nx200ForgeEquipped { position: absolute; left: 4.665072%; top: 26.673751%; width: 24.461722%; height: 52.603613%; }
#nexoriaBlacksmithPanel #nx196InheritTargets { position: absolute; left: 71.112440%; top: 27.311371%; width: 24.521531%; height: 56.535600%; }
#nexoriaBlacksmithPanel #nx108ForgeInventory { position: absolute; left: 71.112440%; top: 27.311371%; width: 24.521531%; height: 56.535600%; }
#nexoriaBlacksmithPanel .nx200-inherit-source-label { position: absolute; left: 34.389952%; top: 21.360255%; width: 12.141148%; height: 3.931987%; }
#nexoriaBlacksmithPanel .nx200-forge-source-label { position: absolute; left: 34.389952%; top: 21.360255%; width: 12.141148%; height: 3.931987%; }
#nexoriaBlacksmithPanel .nx200-inherit-target-label { position: absolute; left: 53.588517%; top: 21.360255%; width: 12.260766%; height: 3.931987%; }
#nexoriaBlacksmithPanel .nx200-forge-result-label { position: absolute; left: 53.588517%; top: 21.360255%; width: 12.260766%; height: 3.931987%; }
#nexoriaBlacksmithPanel #nx196InheritSourceSlot { position: absolute; left: 34.210526%; top: 26.142402%; width: 12.380383%; height: 21.466525%; }
#nexoriaBlacksmithPanel #nx108ForgeSlot { position: absolute; left: 34.210526%; top: 26.142402%; width: 12.380383%; height: 21.466525%; }
#nexoriaBlacksmithPanel #nx196InheritTargetSlot { position: absolute; left: 53.588517%; top: 26.142402%; width: 12.380383%; height: 21.466525%; }
#nexoriaBlacksmithPanel #nx200ForgeResultSlot { position: absolute; left: 53.588517%; top: 26.142402%; width: 12.380383%; height: 21.466525%; }
#nexoriaBlacksmithPanel #nx196InheritPreview { position: absolute; left: 33.433014%; top: 48.884166%; width: 33.193780%; height: 8.182784%; }
#nexoriaBlacksmithPanel .nxpost-inherit-rule { position: absolute; left: 32.057416%; top: 58.129649%; width: 35.944976%; height: 17.853348%; }
#nexoriaBlacksmithPanel #nx196InheritAction { position: absolute; left: 46.889952%; top: 77.683316%; width: 21.112440%; height: 11.052072%; }
#nexoriaBlacksmithPanel #nx108ForgeAction { position: absolute; left: 46.889952%; top: 77.683316%; width: 21.112440%; height: 11.052072%; }
#nexoriaBlacksmithPanel #nx196InheritCancel { position: absolute; left: 32.057416%; top: 77.683316%; width: 14.055024%; height: 11.052072%; }
#nexoriaBlacksmithPanel #nx200ForgeCancel { position: absolute; left: 32.057416%; top: 77.683316%; width: 14.055024%; height: 11.052072%; }
#nexoriaBlacksmithPanel #nx196InheritHint { position: absolute; left: 70.933014%; top: 81.509033%; width: 24.641148%; height: 2.763018%; }
#nexoriaBlacksmithPanel #nx196InheritPages { position: absolute; left: 75.956938%; top: 85.015940%; width: 14.892344%; height: 4.569607%; }
#nexoriaBlacksmithPanel #nx196InheritMessage { position: absolute; left: 32.416268%; top: 90.541977%; width: 60.825359%; height: 2.656748%; }
#nexoriaBlacksmithPanel #nx108ForgeMessage { position: absolute; left: 32.416268%; top: 90.541977%; width: 60.825359%; height: 2.656748%; }
#nexoriaBlacksmithPanel #nx108ForgeSelectedName { position: absolute; left: 33.433014%; top: 48.884166%; width: 13.696172%; height: 8.182784%; }
#nexoriaBlacksmithPanel #nx108ForgeSockets { position: absolute; left: 52.930622%; top: 48.990436%; width: 13.696172%; height: 8.076514%; }
#nexoriaBlacksmithPanel #nx108ForgeCost { position: absolute; left: 32.296651%; top: 58.235919%; width: 35.526316%; height: 17.428268%; }

#nexoriaBlacksmithPanel .nxpost-inherit-pair::after { content: '⇄'; position: absolute; left: 47.3%; top: 33.6%; width: 5.5%; height: 9.2%; font: 4.3cqw Georgia,serif; color: #e9b967; text-align: center; text-shadow: 0 0 .8cqw #e19d3666; pointer-events: none; }
#nexoriaBlacksmithPanel .nx108-forge-tabs button[data-nx-forge="socket"]::after { background-image: url('assets/ui-shops-200/forge-tab-gems-rim.png'); }
#nexoriaBlacksmithPanel .nx108-forge-tabs button.is-active::after { background-image: url('assets/ui-shops-200/forge-tab-inherit-rim.png'); }
#nexoriaPawnPanel .nx108-pawn-tabs button.is-active::after { background-image: url('assets/ui-shops-200/pawn-tab-public-rim.png'); }
/* Additional native detail rims, with live labels over empty alpha centres. */
#nexoriaPawnPanel .nx108-pawn-row.is-selected::after { background-image: url('assets/ui-shops-200/pawn-card-selected-frame.png'); }
#nexoriaPawnPanel .nx108-shop-balance { border: 0; background: url('assets/ui-shops-200/pawn-currency-frame.png') center/contain no-repeat,linear-gradient(#372817aa,#20170eee); justify-content: flex-end; padding-right: 1.2cqw; }
#nexoriaPawnPanel .nx108-shop-balance::before { display: none; }
#nexoriaBlacksmithPanel #nx200ForgeGold { border: 0; background: url('assets/ui-shops-200/forge-currency-frame.png') center/contain no-repeat,linear-gradient(#372817aa,#20170eee); justify-content: flex-end; padding-right: .7cqw; font-size: 1.6cqw; }
#nexoriaBlacksmithPanel #nx200ForgeGold::before { display: none; }
#nexoriaBlacksmithPanel #nx196InheritPreview > span { position: relative; border: 0; }
#nexoriaBlacksmithPanel #nx196InheritPreview > span::after { content: ''; position: absolute; inset: 0; background: url('assets/ui-shops-200/forge-preview-frame.png') center/contain no-repeat; pointer-events: none; }
#nexoriaBlacksmithPanel .nxpost-inherit-rule { border: 0; background: url('assets/ui-shops-200/forge-rule-frame.png') center/contain no-repeat,linear-gradient(#6a492225,#24180c80); }
#nexoriaBlacksmithPanel .nxpost-inherit-pair::after { content: ''; left: 47.308612%; top: 33.475027%; width: 5.622010%; height: 9.245484%; background: url('assets/ui-shops-200/forge-arrows.png') center/contain no-repeat; }

/* 1.0.102: native drawn chrome with a real alpha exterior. The 200 title,
   ornaments, frames and layout stay intact; no room/anvil surrounds them. */
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) > .nx108-panel {
  clip-path: none; background-color: transparent;
  background-image: var(--nx200-shop-chrome);
  background-size: contain; background-repeat: no-repeat; background-position: center;
}
#nexoriaPawnPanel { --nx200-shop-chrome: url('assets/ui-202/pawn-chrome-alpha.png'); }
#nexoriaBlacksmithPanel { --nx200-shop-chrome: url('assets/ui-202/forge-chrome-alpha.png'); }
:is(#nexoriaPawnPanel,#nexoriaBlacksmithPanel) > .nx108-panel::before { display: none; }
#nexoriaPawnPanel .nx108-pawn-tabs { width: auto; }
#nexoriaPawnPanel .nx108-pawn-tabs button {
  box-sizing: border-box; display: flex; align-items: center; justify-content: center;
  margin: 0; white-space: nowrap; overflow: hidden; isolation: isolate;
  background: #362719 url('assets/ui-shops-200/shop-panel-fill.png') center/256px 256px repeat;
  transform: none; transition: filter .15s ease, box-shadow .15s ease;
}
#nexoriaPawnPanel .nx108-pawn-tabs button::after,
#nexoriaPawnPanel .nx108-pawn-tabs button.is-active::after {
  background-image: url('assets/ui-shops-200/pawn-tab-contracts-rim.png');
}
#nexoriaPawnPanel .nx108-pawn-tabs button.is-active { background: linear-gradient(#9b733aaa,#68401daa),url('assets/ui-shops-200/shop-panel-fill.png') center/256px 256px repeat; }
#nexoriaPawnPanel .nx108-pawn-tabs button:active:not(:disabled) { transform: none; }
#nexoriaPawnPanel .nx108-pawn-tabs button[data-nx-pawn-view] {
  min-width: 0; max-width: 25.119617%; width: 25.119617%;
  min-height: 0; height: 7.332625%; padding: 0 .6cqw;
  font: 1.85cqw/1.1 Georgia,serif;
}
#nexoriaPawnPanel .nx108-pawn-tabs button::before { display: none; }
#nexoriaPawnPanel :is(#nx108PawnMine,#nx108PawnPublic) { min-width: 0; min-height: 0; margin: 0; box-sizing: border-box; background: #271c11 url('assets/ui-shops-200/shop-panel-fill.png') repeat; }
#nexoriaPawnPanel #nx108PawnListings { box-sizing: border-box; overflow-x: hidden; }

/* A legacy width:100% rule had greater specificity than the native tab
   positions, making every tab the width of the entire forge panel. */
#nexoriaBlacksmithPanel .nx108-forge-tabs { width: auto; }
#nexoriaBlacksmithPanel .nx108-forge-tabs button[data-nx-forge] {
  width: 14.832536%; min-width: 0; max-width: 14.832536%; min-height: 0;
  height: 7.226355%; margin: 0; padding: 0 .35cqw;
  font: 1.7cqw/1.1 Georgia,serif; white-space: nowrap; overflow: hidden;
  box-sizing: border-box; display: flex; align-items: center; justify-content: center;
  transform: none; isolation: isolate;
}
#nexoriaBlacksmithPanel .nx108-forge-tabs button::before { display: none; }
#nexoriaBlacksmithPanel .nx108-forge-tabs button::after,
#nexoriaBlacksmithPanel .nx108-forge-tabs button.is-active::after {
  background-image: url('assets/ui-shops-200/forge-tab-enhance-rim.png');
}
/* All actions use the same unlabelled CANCEL artwork. Native corner slices
   preserve its carving when labels need a wider button. */
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel,#nx196InheritAction,#nx108ForgeAction) {
  height: 9.9%; top: 78.2%; padding: 0 .5cqw; border: 1cqw solid transparent; border-radius: .6cqw;
  color: #fff0ce; font: 1.65cqw/1.1 Georgia,serif; box-shadow: none;
  background: #493221 url('assets/ui-shops-200/shop-panel-fill.png') center/256px 256px repeat;
  border-image-source: url('assets/ui-shops-200/forge-btn-cancel-rim.png');
  border-image-slice: 24; border-image-width: 1.45; border-image-repeat: round;
  box-sizing: border-box; white-space: nowrap; overflow: hidden;
  transform: none; text-shadow: 0 1px 2px #20140b;
}
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel,#nx196InheritAction,#nx108ForgeAction)::before,
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel,#nx196InheritAction,#nx108ForgeAction)::after { display: none; }
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel) { left: 32.057416%; width: 17.5%; }
#nexoriaBlacksmithPanel :is(#nx196InheritAction,#nx108ForgeAction) { left: 50.502392%; width: 17.5%; }

/* 1.0.102 photo follow-up: give each working row its own measured space.
   Coordinates stay on the uniformly fitted 1672 x 941 painted canvas. */
#nexoriaBlacksmithPanel :is(#nx196InheritSourceSlot,#nx108ForgeSlot,#nx196InheritTargetSlot,#nx200ForgeResultSlot) {
  top: 25.8%; width: 11.2%; height: 19.9%; padding: .65cqw;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  gap: .2cqw; font: 1.35cqw/1.2 Georgia,serif;
}
#nexoriaBlacksmithPanel :is(#nx196InheritSourceSlot,#nx108ForgeSlot) { left: 34.9%; }
#nexoriaBlacksmithPanel :is(#nx196InheritTargetSlot,#nx200ForgeResultSlot) { left: 54.0%; }
#nexoriaBlacksmithPanel :is(#nx196InheritSourceSlot,#nx108ForgeSlot,#nx196InheritTargetSlot,#nx200ForgeResultSlot) img {
  flex: 1 1 0; min-height: 0; width: 100%; height: 0; max-height: 100%; object-fit: contain;
}
#nexoriaBlacksmithPanel :is(#nx196InheritSourceSlot,#nx108ForgeSlot,#nx196InheritTargetSlot,#nx200ForgeResultSlot) span {
  flex: 0 0 auto; max-width: 100%; margin: 0; padding: 0;
  font: 1.15cqw/1.15 Georgia,serif; overflow-wrap: anywhere; white-space: normal;
}
#nexoriaBlacksmithPanel .nxpost-inherit-pair::after { top: 31.4%; }
#nexoriaBlacksmithPanel #nx196InheritPreview {
  left: 32.2%; top: 47.2%; width: 35.6%; height: 14%;
  display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.2cqw;
  padding: 0; margin: 0; white-space: normal; overflow: visible;
}
#nexoriaBlacksmithPanel #nx196InheritPreview > .nx202-inherit-preview-card {
  display: flex; flex-direction: column; justify-content: center; align-items: stretch;
  min-width: 0; min-height: 0; gap: .25cqw; padding: .4cqw;
  background: #302317 url('assets/ui-shops-200/shop-panel-fill.png') center/256px 256px repeat;
  border: .5cqw solid transparent; border-image-source: url('assets/ui-shops-200/forge-preview-frame.png');
  border-image-slice: 18; border-image-width: 1.2; border-image-repeat: round;
}
#nexoriaBlacksmithPanel #nx196InheritPreview > .nx202-inherit-preview-card::after { display: none; }
#nexoriaBlacksmithPanel #nx196InheritPreview .nx202-inherit-preview-row {
  display: flex; justify-content: space-between; align-items: center; gap: .35cqw;
  min-width: 0; min-height: 0; margin: 0; padding: 0;
}
#nexoriaBlacksmithPanel #nx196InheritPreview .nx202-inherit-preview-row small {
  flex: 0 0 auto; font: 1.2cqw/1.2 Georgia,serif; white-space: nowrap;
}
#nexoriaBlacksmithPanel #nx196InheritPreview .nx202-inherit-preview-row strong {
  flex: 0 0 auto; font: 1.3cqw/1.2 Georgia,serif; white-space: nowrap;
  font-variant-numeric: tabular-nums; color: #ffe8b2;
}
#nexoriaBlacksmithPanel .nxpost-inherit-rule {
  top: 62.4%; height: 14.2%; left: 32.2%; width: 35.6%;
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  gap: .2cqw; padding: .3cqw 1.0cqw;
  background: #2d2116 url('assets/ui-shops-200/shop-panel-fill.png') center/256px 256px repeat;
  border: .5cqw solid transparent; border-image-source: url('assets/ui-shops-200/forge-rule-frame.png');
  border-image-slice: 22; border-image-width: 1.8; border-image-repeat: round;
}
#nexoriaBlacksmithPanel .nxpost-inherit-rule p {
  width: 100%; margin: 0; padding: 0; font: 1.18cqw/1.15 Georgia,serif; white-space: nowrap;
}
#nexoriaBlacksmithPanel .nxpost-inherit-rule p::before { display: none; }
#nexoriaBlacksmithPanel .nxpost-inherit-rule small {
  display: block; margin: 0; font: 1.04cqw/1.15 Georgia,serif;
  white-space: normal; overflow-wrap: normal; color: #dac5a2;
}
/* Enhancement/socket names and all five sockets fit above the cost area.
   Long item names/costs scroll within their row, never over the action bar. */
#nexoriaBlacksmithPanel #nx108ForgeSelectedName {
  left: 32.3%; top: 47.2%; width: 17.2%; height: 10%;
  padding: .6cqw; font: 1.2cqw/1.2 Georgia,serif; overflow-y: auto;
  overflow-wrap: anywhere; scrollbar-width: thin;
}
#nexoriaBlacksmithPanel[data-forge-mode="enhance"] #nx108ForgeSelectedName { width: 35.5%; }
#nexoriaBlacksmithPanel #nx108ForgeSockets {
  left: 50.6%; top: 47.2%; width: 17.2%; height: 10%;
  gap: .3cqw; min-width: 0; padding: .35cqw; overflow-x: auto;
}
#nexoriaBlacksmithPanel #nx108ForgeSockets .nx108-socket { flex: 0 0 2.5cqw; width: 2.5cqw; height: 2.5cqw; }
#nexoriaBlacksmithPanel #nx108ForgeCost {
  top: 58.3%; height: 17.3%; padding: .7cqw .9cqw;
  font: 1.2cqw/1.3 Georgia,serif; overflow-wrap: anywhere; overflow-y: auto;
}
#nexoriaBlacksmithPanel :is(#nx196InheritHint,#nx196InheritPages) { z-index: 1; }
#nexoriaBlacksmithPanel #nx196InheritTargets { height: 52.8%; }
#nexoriaBlacksmithPanel #nx196InheritHint { top: 81.0%; height: 3.5%; padding: .2cqw; font: 1.0cqw/1.15 Georgia,serif; }

/* NEXORIA bundle206: nexoria-pvp-guild-200.css */
/* 1.0.100 — approved PvP/Guild artwork; live content occupies alpha cut-outs.
   Both canvases use one uniform scale from the native 1672 × 941 composition. */
#nexoriaPvpPanel, #nexoriaGuildPanel { padding: 0; align-items: center; justify-content: center; }
#nexoriaPvpPanel .nx200-pvp-canvas,
#nexoriaGuildPanel .nx200-guild-canvas {
  position: relative; display: block; box-sizing: border-box; container-type: inline-size;
  width: min(1672px, calc(100vw - 12px), calc((100dvh - 12px) * 1.776833));
  height: auto; aspect-ratio: 1672 / 941; min-height: 0; max-height: none;
  margin: 0; padding: 0; border: 0; border-radius: 0; overflow: hidden;
  color: #f4e6cc; font-family: Georgia, "Times New Roman", serif;
  background-color: #241b13; background-size: 100% 100%; background-repeat: no-repeat;
  box-shadow: 0 8px 36px #0009;
}
#nexoriaPvpPanel .nx200-pvp-canvas { background-image: url("assets/ui-shops-200/pvp-chrome.png"); }
#nexoriaGuildPanel .nx200-guild-canvas { background-image: url("assets/ui-shops-200/guild-chrome.png"); }
#nexoriaPvpPanel .nx108-panel-header, #nexoriaGuildPanel .nx108-panel-header,
#nexoriaPvpPanel .nx108-pvp-body, #nexoriaPvpPanel .nx108-pvp-actions { display: contents; }
#nexoriaPvpPanel .nx108-panel-header > h2,
#nexoriaGuildPanel .nx108-panel-header > h2,
#nexoriaPvpPanel .nx108-pvp-leaderboards h3,
.nx200-visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%); white-space: nowrap; border: 0 !important; }
#nexoriaPvpPanel #nx108ClosePvp, #nexoriaGuildPanel #nx108CloseGuild {
  position: absolute; z-index: 5; left: 92.35%; top: 8.8%; width: 4.1%; height: 6.5%;
  min-width: 0; min-height: 0; border: 0; padding: 0; color: transparent;
  background: transparent; box-shadow: none; cursor: pointer;
}
#nexoriaPvpPanel button:focus-visible, #nexoriaGuildPanel button:focus-visible,
#nexoriaPvpPanel .nx108-pvp-leaderboards:focus-visible { outline: 2px solid #fff0a5; outline-offset: 1px; }
#nexoriaPvpPanel .nx108-pvp-self {
  position: absolute; left: 6.1%; top: 16.79%; width: 87.8%; height: 10.63%;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .65%; padding: .35%; box-sizing: border-box;
  background: #241b13 url("assets/ui-shops-200/shop-panel-fill.png") repeat;
}
#nexoriaPvpPanel .nx108-pvp-self > span {
  display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 0 .25em;
  border: 1px solid #a27638; border-radius: .45cqw; box-shadow: inset 0 0 .8cqw #0008;
  background: linear-gradient(110deg, #4e3924a6, #17100c80); color: #e7d8bd;
  font-size: 1.45cqw; line-height: 1.15;
}
#nexoriaPvpPanel .nx108-pvp-self b { margin: .15em 0 0; font-size: 2.05cqw; font-weight: 500; font-variant-numeric: tabular-nums; color: #fff5e4; }
#nexoriaPvpPanel .nx108-pvp-leaderboards {
  position: absolute; left: 4.36%; top: 28.37%; width: 91.1%; height: 51.66%;
  display: grid; grid-template-columns: 1fr 1fr; gap: 1.35%; padding: 0;
}
#nexoriaPvpPanel .nx108-pvp-leaderboards > section { position: relative; display: block; padding: 0; border: 0; border-radius: 0; background: none; overflow: hidden; }
#nexoriaPvpPanel .nx200-pvp-column-head {
  position: absolute; top: 18.2%; left: 2%; right: 2%; height: 8.4%; display: grid;
  grid-template-columns: 12% 48% 15% 25%; align-items: center; text-align: center;
  font-size: 1.22cqw; color: #d1be9a; background: #251c13;
}
#nexoriaPvpPanel .nx108-pvp-leaderboards ol {
  position: absolute; top: 26.6%; left: 2%; right: 2%; height: 72%; min-height: 0;
  margin: 0; padding: 0; list-style: none; background: #211912 url("assets/ui-shops-200/shop-panel-fill.png") repeat;
  overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #ae8145 #1b140d; scrollbar-gutter: stable;
}
#nexoriaPvpPanel .nx108-pvp-leaderboards li {
  display: grid; grid-template-columns: 12% 48% 15% 25%; gap: 0; align-items: center;
  box-sizing: border-box; height: 20%; min-height: 20%; padding: .3cqw 0;
  color: #f4eadb; font-size: 1.38cqw; text-align: center; border: 1px solid #87613588;
  border-radius: .4cqw; background: linear-gradient(110deg, #4a342545, #110d0960);
}
#nexoriaPvpPanel .nx108-pvp-leaderboards li.is-self { border-color: #f0d588; background: linear-gradient(110deg, #866032cc, #3d2a16cc); box-shadow: inset 0 0 .65cqw #f8d16b50; }
#nexoriaPvpPanel .nx108-pvp-leaderboards li > strong { font: inherit; font-variant-numeric: tabular-nums; }
#nexoriaPvpPanel .nx108-pvp-leaderboards li.nx108-pvp-empty { display: grid; grid-template-columns: 1fr; height: 100%; color: #bca584; padding: 1em; white-space: normal; }
#nexoriaPvpPanel .nx200-pvp-rank { display: grid; place-items: center; width: 2.55cqw; height: 2.8cqw; margin: auto; font-size: 1.9cqw; font-weight: 500; }
#nexoriaPvpPanel [class*="is-medal-"] .nx200-pvp-rank { border: 1px solid #d4a344; border-radius: 50%; color: #ffe6a5; background: radial-gradient(#745125, #281b0e); box-shadow: 0 0 .25cqw #f2c46188; }
#nexoriaPvpPanel .is-medal-2 .nx200-pvp-rank { color: #eee9e1; border-color: #aaa8a3; background: radial-gradient(#636368, #232328); }
#nexoriaPvpPanel .is-medal-3 .nx200-pvp-rank { color: #f7c699; border-color: #b57647; background: radial-gradient(#7b4e30, #2e1e15); }
#nexoriaPvpPanel .nx200-public-identity, #nexoriaGuildPanel .nx200-public-identity { display: flex; align-items: center; gap: .75cqw; min-width: 0; text-align: left; }
#nexoriaPvpPanel .nx200-public-identity > span:last-child, #nexoriaGuildPanel .nx200-public-identity > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#nexoriaPvpPanel .nx200-public-portrait, #nexoriaGuildPanel .nx200-public-portrait {
  flex: 0 0 3.2cqw; width: 3.2cqw; height: 3.2cqw; object-fit: cover; border: 1px solid #cb9e59;
  border-radius: 50%; box-sizing: border-box; background: #463629;
}
#nexoriaPvpPanel .nx200-public-portrait.is-unavailable, #nexoriaGuildPanel .nx200-public-portrait.is-unavailable { display: grid; place-items: center; color: #e4c18c; font: 600 1.35cqw Georgia, serif; }
#nexoriaPvpPanel .nx108-pvp-actions > button { position: absolute; padding: 0; min-width: 0; min-height: 0; margin: 0; color: transparent; border: 0; border-radius: 0; box-shadow: none; background: transparent center/contain no-repeat; cursor: pointer; }
#nexoriaPvpPanel #nx200PvpRulesOpen { left: 4.7847%; top: 82.5717%; width: 14.5335%; height: 8.9267%; background-image: url("assets/ui-shops-200/pvp-btn-rules.png"); }
#nexoriaPvpPanel #nx108PvpEnter { left: 38.8756%; top: 82.0404%; width: 26.4952%; height: 10.2019%; background-image: url("assets/ui-shops-200/pvp-btn-enter.png"); }
#nexoriaPvpPanel #nx108PvpShopOpen { left: 67.6435%; top: 82.4655%; width: 27.4522%; height: 9.1392%; background-image: url("assets/ui-shops-200/pvp-btn-shop.png"); }
#nexoriaPvpPanel .nx108-pvp-actions > button:hover:not(:disabled) { filter: brightness(1.14); }
#nexoriaPvpPanel .nx108-pvp-actions > button:disabled { opacity: .5; cursor: not-allowed; }
#nexoriaPvpPanel #nx108PvpMessage { position: absolute; left: 6%; right: 6%; top: 92.5%; margin: 0; min-height: 0; font-size: 1.02cqw; line-height: 1.15; color: #fff0d1; text-shadow: 0 1px 3px #000; text-align: center; }
#nexoriaPvpPanel .nx200-pvp-rules {
  position: absolute; z-index: 6; left: 21%; top: 24%; width: 58%; max-height: 60%; box-sizing: border-box;
  padding: 2cqw; border: 1px solid #d2ad65; border-radius: .75cqw; background: #2b2014fa;
  box-shadow: 0 0 0 100vmax #0007, 0 8px 30px #000b; overflow: auto; font-size: 1.45cqw;
}
#nexoriaPvpPanel .nx200-pvp-rules h3 { margin: 0 0 .7em; font-size: 1.9cqw; color: #f9d78a; }
#nexoriaPvpPanel .nx200-pvp-rules button { min-height: 0; padding: .45em 1.6em; font: inherit; border: 1px solid #cfa363; border-radius: .3cqw; color: #f4e3bc; background: #674323; }
/* Guild: resources stay in the header, navigation on the left, each pane scrolls independently. */
#nexoriaGuildPanel .nx108-guild-balance {
  position: absolute; left: 27.33%; top: 8.608%; width: 59.75%; height: 8.08%;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8%; padding: .45%; box-sizing: border-box;
  border: 0; font-size: 1.4cqw; background: #271d13 url("assets/ui-shops-200/shop-panel-fill.png") repeat;
}
#nexoriaGuildPanel .nx108-guild-balance span { display: flex; justify-content: center; align-items: center; gap: .7em; min-width: 0; padding: .25em; border: 1px solid #876239; border-radius: .35cqw; white-space: nowrap; }
#nexoriaGuildPanel .nx108-guild-balance b { color: #fff0d4; font-size: 1.55cqw; font-weight: 500; font-variant-numeric: tabular-nums; }
#nexoriaGuildPanel .nx108-guild-nav {
  position: absolute; left: 3.5885%; top: 17.9596%; width: 20.0957%; height: 63.3369%;
  display: flex; flex-direction: column; flex-wrap: nowrap; gap: 0; min-height: 0; margin: 0; padding: 0;
  border: 0; overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; background: #251b12;
}
#nexoriaGuildPanel .nx108-guild-nav > button {
  flex: 0 0 14.2857%; width: 100%; min-width: 0; min-height: 0; margin: 0; padding: .25em .45em .25em 23%;
  border: 0; border-radius: 0; box-shadow: none; color: #f6e8ce; text-align: left; white-space: nowrap;
  font: 1.63cqw/1.15 Georgia, serif; background-color: #291e14;
  background-image: url("assets/ui-shops-200/guild-menu-list-rim.png"); background-size: contain; background-position: center; background-repeat: no-repeat;
}
#nexoriaGuildPanel .nx108-guild-nav > button::before { content: ""; position: absolute; width: 3.5cqw; height: 3.5cqw; margin-left: -4.2cqw; margin-top: -.7cqw; background: center/contain no-repeat; }
#nexoriaGuildPanel [data-nx-guild-view="list"]::before { background-image: url("assets/ui-shops-200/guild-icon-list.png"); }
#nexoriaGuildPanel [data-nx-guild-view="current"]::before { background-image: url("assets/ui-shops-200/guild-icon-members.png"); }
#nexoriaGuildPanel [data-nx-guild-view="shop"]::before { background-image: url("assets/ui-shops-200/guild-icon-shop.png"); }
#nexoriaGuildPanel [data-nx-guild-view="rewards"]::before { background-image: url("assets/ui-shops-200/guild-icon-rewards.png"); }
#nexoriaGuildPanel [data-nx-guild-view="quests"]::before { background-image: url("assets/ui-shops-200/guild-icon-quests.png"); }
#nexoriaGuildPanel [data-nx-guild-view="construction"]::before { background-image: url("assets/ui-shops-200/guild-icon-buildings.png"); }
#nexoriaGuildPanel [data-nx-guild-view="applications"]::before { background-image: url("assets/ui-shops-200/guild-icon-applications.png"); }
#nexoriaGuildPanel .nx108-guild-nav > button.is-active { background-color: #74502e; color: #fff5d6; box-shadow: inset 0 0 .9cqw #efbb5490; text-shadow: 0 1px 2px #000; }
#nexoriaGuildPanel .nx108-guild-nav > button:hover:not(:disabled) { filter: brightness(1.15); }
#nexoriaGuildPanel .nx108-guild-body {
  position: absolute; left: 25.24%; top: 18.59%; width: 70.34%; height: 71.84%;
  display: block; box-sizing: border-box; margin: 0; padding: .55cqw; border: 0;
  min-width: 0; min-height: 0; max-height: none; overflow: hidden;
  background: #241b13 url("assets/ui-shops-200/shop-panel-fill.png") repeat; font-size: 1.3cqw;
}
#nexoriaGuildPanel .nx108-guild-body > .nx108-guild-view { height: 100%; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
#nexoriaGuildPanel .nx108-guild-body > .nx108-guild-current {
  position: relative; display: grid; grid-template-rows: 17% minmax(0, 1fr) 12.5%;
  height: 100%; min-height: 0; margin: 0; overflow: hidden; gap: .65cqw;
  box-sizing: border-box; padding: 0; border: 0; background: transparent;
}
#nexoriaGuildPanel .nx108-guild-current-header { display: grid; grid-template-columns: 7cqw minmax(0, 1fr) auto; height: 100%; min-height: 0; padding: 0 1cqw; border-bottom: 1px solid #8d66384d; gap: 1cqw; }
#nexoriaGuildPanel .nx108-guild-current-emblem { width: 6cqw; min-height: 0; height: 100%; padding: 0; border: 0; background: none; box-shadow: none; }
#nexoriaGuildPanel .nx108-guild-current-emblem img { width: 5.6cqw; height: 5.6cqw; object-fit: contain; }
#nexoriaGuildPanel .nx108-guild-current-emblem small, #nexoriaGuildPanel .nx108-guild-current-header > div > small, #nexoriaGuildPanel #nx108GuildMemberCount { display: none; }
#nexoriaGuildPanel .nx108-guild-name-line h3 { font-size: 2.15cqw; margin: 0; }
#nexoriaGuildPanel .nx108-guild-current-header p { font-size: 1.15cqw; margin: .25em 0; color: #cbb18b; }
#nexoriaGuildPanel .nx108-guild-level b { font-size: 1.7cqw; }
#nexoriaGuildPanel .nx197-guild-member-section { display: grid; grid-template-rows: 10% minmax(0, 1fr); min-height: 0; margin: 0; overflow: hidden; }
#nexoriaGuildPanel .nx197-guild-member-head,
#nexoriaGuildPanel .nx108-guild-member-profile { grid-template-columns: 35% 25% 12% 28%; gap: 0; }
#nexoriaGuildPanel .nx197-guild-member-head { padding: 0 .7cqw; font-size: 1.35cqw; min-height: 0; color: #ead7b2; text-align: center; border: 1px solid #8e6a4080; background: #55402b55; }
#nexoriaGuildPanel .nx108-guild-current #nx108GuildMembers { max-height: none; height: 100%; min-height: 0; padding: 0; margin: 0; scrollbar-width: thin; scrollbar-color: #ab8048 #20170d; }
#nexoriaGuildPanel .nx108-guild-current .nx108-guild-member { min-height: 16.6667%; height: 16.6667%; box-sizing: border-box; margin: 0; border: 0; border-bottom: 1px solid #92714788; background: none; border-radius: 0; }
#nexoriaGuildPanel .nx108-guild-member-profile { height: 100%; min-height: 0; padding: .25cqw .7cqw; border: 0; border-radius: 0; font: 1.38cqw/1.15 Georgia, serif; text-align: center; color: #f0e5d0; background: #372a1c55; box-shadow: none; }
#nexoriaGuildPanel .nx200-public-portrait { border-radius: .25cqw; flex-basis: 3.4cqw; width: 3.4cqw; height: 3.4cqw; }
#nexoriaGuildPanel .nx200-guild-role { justify-self: center; width: 85%; padding: .38em .15em; border: 1px solid #807c73; border-radius: .4cqw; background: linear-gradient(#58554b70, #27251f90); font-size: 1.22cqw; }
#nexoriaGuildPanel .nx200-guild-role.is-owner { border-color: #d1a55f; color: #ffdf93; background: linear-gradient(#8a5b2590, #3e271290); }
#nexoriaGuildPanel .nx200-guild-role.is-vice { border-color: #a4bfe1; color: #d2e5ff; background: linear-gradient(#49618690, #222d4790); }
#nexoriaGuildPanel .nx197-member-online, #nexoriaGuildPanel .nx197-member-offline { font-size: 1.19cqw; white-space: nowrap; }
#nexoriaGuildPanel .nx197-member-online::before, #nexoriaGuildPanel .nx197-member-offline::before { content: ""; display: inline-block; width: .8cqw; height: .8cqw; margin-right: .55cqw; border-radius: 50%; background: #908b81; }
#nexoriaGuildPanel .nx197-member-online::before { background: #70d776; box-shadow: 0 0 .4cqw #5ade5c88; }
#nexoriaGuildPanel .nx108-guild-current-actions { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; align-items: center; gap: .6cqw; margin: 0; min-height: 0; }
#nexoriaGuildPanel .nx108-guild-current-actions > span { font-size: 1.3cqw; color: #e5d1ac; }
#nexoriaGuildPanel .nx108-guild-current-actions > button { min-width: 0; min-height: 0; height: 100%; margin: 0; padding: 0 .5em; border: 0; border-radius: 0; color: #f8e8c7; font: 1.45cqw Georgia, serif; background: #5a3c21 url("assets/ui-shops-200/guild-btn-info-rim.png") center/contain no-repeat; }
#nexoriaGuildPanel #nx200GuildManageOpen { background-color: #344135; background-image: url("assets/ui-shops-200/guild-btn-manage-rim.png"); }
#nexoriaGuildPanel #nx108GuildBossEnter { background-color: #694626; }
#nexoriaGuildPanel .nx108-guild-member-actions, #nexoriaGuildPanel .nx200-guild-management, #nexoriaGuildPanel #nx108GuildRenameOpen { display: none; }
#nexoriaGuildPanel .is-managing .nx108-guild-member-actions { display: flex; flex-wrap: wrap; gap: .35cqw; padding: .25cqw .7cqw; }
#nexoriaGuildPanel .is-managing .nx108-guild-member { height: auto; }
#nexoriaGuildPanel .is-managing .nx108-guild-member-profile { height: 4.1cqw; }
#nexoriaGuildPanel .is-managing #nx108GuildRenameOpen { display: inline-block; }
#nexoriaGuildPanel .is-managing .nx200-guild-management { display: flex; position: absolute; z-index: 2; right: .8cqw; top: 4.6cqw; gap: .5cqw; padding: .35cqw; border: 1px solid #a7814c; background: #2d2216f7; }
#nexoriaGuildPanel .nx108-guild-member-actions button, #nexoriaGuildPanel .nx200-guild-management button { min-height: 0; padding: .35em .65em; font: 1.12cqw Georgia, serif; border: 1px solid #99713a; border-radius: .3cqw; color: #edd6ab; background: #5b3c22; }
#nexoriaGuildPanel .nx200-guild-info, #nexoriaGuildPanel .nx108-guild-disband-vote { position: absolute; z-index: 3; left: 8%; top: 17%; width: 84%; box-sizing: border-box; padding: 1.3cqw; border: 1px solid #b18c50; border-radius: .6cqw; color: #f0d9b5; background: #2b2014fb; box-shadow: 0 .5cqw 2cqw #0008; font-size: 1.35cqw; }
#nexoriaGuildPanel .nx200-guild-info h3 { margin: 0; font-size: 1.8cqw; }
#nexoriaGuildPanel #nx108GuildMessage { position: absolute; bottom: 0; left: 0; right: 0; pointer-events: none; margin: 0; font-size: 1.05cqw; min-height: 0; background: #21170bdd; }
#nexoriaGuildPanel #nx108GuildMessage:empty { display: none; }
#nexoriaGuildPanel .nx108-guild-body button:disabled { opacity: .5; cursor: not-allowed; }
#nexoriaGuildPanel .nx108-guild-factions { gap: .75cqw; min-height: 0; height: auto; }
#nexoriaGuildPanel .nx108-guild-faction header, #nexoriaGuildPanel .nx108-guild-section-title { padding: .7cqw; font-size: 1.4cqw; }
#nexoriaGuildPanel .nx108-guild-section-title small { font-size: 1.05cqw; }
#nexoriaGuildPanel .nx108-guild-row { padding: .5cqw; gap: .6cqw; }
#nexoriaGuildPanel .nx108-guild-row-info { font-size: 1.4cqw; gap: .7cqw; }
#nexoriaGuildPanel .nx108-guild-row-info img { width: 3.6cqw; height: 3.6cqw; }
#nexoriaGuildPanel .nx108-guild-row-info small, #nexoriaGuildPanel .nx108-guild-apply { font-size: 1.05cqw; }
#nexoriaGuildPanel .nx108-guild-shop-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6cqw; min-height: 0; padding: .4cqw; }
#nexoriaGuildPanel .nx108-guild-shop-slot { min-height: 8.3cqw; padding: .55cqw; border: 1px solid #946c38; border-radius: .5cqw; background: linear-gradient(135deg, #4b3528cc, #24180ff0); }
#nexoriaGuildPanel .nx108-guild-shop-slot img { width: 3.6cqw; height: 3.6cqw; object-fit: contain; }
#nexoriaGuildPanel .nx108-guild-shop-slot :is(strong, b, button), #nexoriaGuildPanel #nx108GuildQuestsView li { font-size: 1.14cqw; }
#nexoriaGuildPanel .nx108-guild-shop-slot small, #nexoriaGuildPanel .nx108-guild-shop-slot time, #nexoriaGuildPanel .nx195-guild-auction-rule { font-size: 1.02cqw; }
#nexoriaGuildPanel #nx108GuildQuestsView > p { font-size: 1.14cqw; }
#nexoriaGuildPanel #nx108GuildQuestsView ul { max-height: none; }
#nexoriaGuildPanel #nx108GuildQuestsView li { min-height: 4cqw; padding: .7cqw; }
#nexoriaGuildPanel .nx108-guild-contribute { font-size: 1.2cqw; gap: .6cqw; }
#nexoriaGuildPanel .nx108-guild-contribute input { width: 5cqw; min-width: 0; font-size: 1.25cqw; padding: .35em; }
#nexoriaPvpPanel [hidden], #nexoriaGuildPanel [hidden] { display: none !important; }
/* A live dissolution vote stays reachable from Quản lý/Tùy chọn without covering the roster on every open. */
#nexoriaGuildPanel .nx108-guild-disband-vote { display: none; }
#nexoriaGuildPanel .is-managing .nx108-guild-disband-vote:not([hidden]) { display: block; }
/* 1.0.102: full screen applies to the scenery BEHIND the approved panel.
   Keep the original 1672×941 painted panel and one uniform fit for all controls.
   Independent scenery covers phone side margins; the panel never stretches. */
#nexoriaPvpPanel, #nexoriaGuildPanel {
  padding: 0; overflow: hidden; backdrop-filter: none; -webkit-backdrop-filter: none;
  background-color: #241b13; background-position: center; background-size: cover; background-repeat: no-repeat;
}
#nexoriaPvpPanel { background-image: url("assets/ui-202/pvp-backdrop.png"); }
#nexoriaGuildPanel { background-image: url("assets/ui-202/guild-backdrop.png"); }
#nexoriaPvpPanel .nx200-pvp-canvas,
#nexoriaGuildPanel .nx200-guild-canvas {
  width: min(100vw, calc(100dvh * 1.776833));
  height: auto; aspect-ratio: 1672 / 941; max-width: none; max-height: none;
  border: 0; border-radius: 0; box-shadow: none;
}
/* The complete original painted buttons include their own filled face.
   A second CSS fill used to leak a mismatched strip above the rim. */
#nexoriaGuildPanel .nx108-guild-current-actions {
  position: relative; grid-template-columns: minmax(0, 1fr) repeat(3, minmax(0, 1.2fr));
}
#nexoriaGuildPanel .nx108-guild-current-actions > button {
  position: relative; width: 100%; height: 100%; min-height: 0; padding: 0; border: 0; border-radius: 0;
  color: transparent; text-shadow: none; box-shadow: none; overflow: hidden;
  background: transparent url("assets/ui-shops-200/guild-btn-info.png") center/contain no-repeat;
}
#nexoriaGuildPanel .nx108-guild-current-actions > button::before { display: none; }
#nexoriaGuildPanel #nx200GuildManageOpen { background: transparent url("assets/ui-shops-200/guild-btn-manage.png") center/contain no-repeat; }
#nexoriaGuildPanel #nx108GuildBossEnter { background: transparent url("assets/ui-202/guild-boss-button.png") center/contain no-repeat; }
#nexoriaGuildPanel .nx201-guild-boss-status {
  position: absolute; z-index: 2; left: 22%; bottom: 94%; width: 25%; padding: .15cqw .3cqw;
  font: 1.05cqw/1.2 Georgia, serif; color: #ffe4a9; text-align: center;
  background: #2b1c10; border-radius: .25cqw;
}
#nexoriaGuildPanel .nx108-guild-current-header { grid-template-columns: 7cqw minmax(0, 1fr); align-items: center; }
#nexoriaGuildPanel .nx108-guild-current-header > div { min-width: 0; }
#nexoriaGuildPanel .nx108-guild-name-line { gap: .7cqw; min-width: 0; flex-wrap: nowrap; }
#nexoriaGuildPanel .nx108-guild-name-line h3 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#nexoriaGuildPanel .nx201-guild-level { flex: 0 0 auto; font: 1.7cqw Georgia, serif; color: #ebce91; white-space: nowrap; }
#nexoriaGuildPanel .nx201-guild-level::before { content: "·"; margin-right: .65cqw; }
#nexoriaGuildPanel .is-managing .nx200-guild-management { top: 3.15cqw; right: .8cqw; }

/* Only the exterior scenery was removed from these native alpha copies. */
#nexoriaPvpPanel .nx200-pvp-canvas { background-color: transparent; background-image: url("assets/ui-202/pvp-chrome-alpha.png"); }
#nexoriaGuildPanel .nx200-guild-canvas { background-color: transparent; background-image: url("assets/ui-202/guild-chrome-alpha.png"); }
#nexoriaPvpPanel .nx200-pvp-canvas::before, #nexoriaGuildPanel .nx200-guild-canvas::before { display: none; }

/* 1.0.105 — keep the three painted Guild actions clear of the lower rim.
   The button face and its hitbox share the same, uniformly scaled bounds. */
#nexoriaGuildPanel .nx108-guild-current-actions {
  grid-template-columns: minmax(0, 1.25fr) repeat(3, minmax(0, 1fr));
  align-items: start;
}
#nexoriaGuildPanel .nx108-guild-current-actions > button:not(.nx200-visually-hidden) {
  width: 90%; height: 84%; justify-self: center; align-self: start;
  transform: translateY(-8%); background-size: contain;
}
#nexoriaGuildPanel #nx108GuildBossEnter {
  color: #fff0d2; font: 1.8cqw/1 Georgia, "Times New Roman", serif;
  text-shadow: 0 1px 2px #180e07;
  background: transparent url("assets/ui-205/guild-action-empty.png") center/contain no-repeat !important;
}
#nexoriaGuildPanel .nx201-guild-boss-status {
  left: 29%; width: 22%; bottom: 112%; background: transparent;
}
#nexoriaPvpPanel .nx205-pvp-guidance,
#nexoriaPvpPanel #nx108PvpMessage {
  position: absolute; left: 6%; right: 6%; top: 92.25%; margin: 0;
  min-height: 0; font: 1.35cqw/1.35 Georgia, "Times New Roman", serif;
  color: #fff0d1; text-shadow: 0 1px 3px #000; text-align: center;
}
#nexoriaPvpPanel .nx205-pvp-guidance {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 0 1.3cqw;
}
#nexoriaPvpPanel #nx108PvpMessage:empty { display: none; }
#nexoriaPvpPanel #nx108PvpMessage:not(:empty) + .nx205-pvp-guidance { display: none; }

/* PvP Shop: reuse the text-free painted shop frame at its native ratio.
   Its list, detail and return hitbox all use that same coordinate space. */
#nexoriaPvpShopPanel {
  padding: 0; align-items: center; justify-content: center; overflow: hidden;
  background: rgba(0, 0, 0, .68);
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
#nexoriaPvpShopPanel .nx108-pvp-shop-panel {
  position: relative; display: block; container-type: inline-size;
  width: min(100vw, calc(100dvh * 1.776833)); height: auto;
  aspect-ratio: 1672 / 941; max-width: none; max-height: none; min-height: 0;
  margin: 0; padding: 0; border: 0; border-radius: 0; overflow: hidden;
  background: transparent url("assets/ui-205/supply-shop-frame-alpha.png") center/contain no-repeat;
  box-shadow: none; color: #fff0d2; font: 1.65cqw/1.2 Georgia, "Times New Roman", serif;
}
#nexoriaPvpShopPanel .nx108-pvp-shop-panel::before { display: none; }
#nexoriaPvpShopPanel .nx108-panel-header,
#nexoriaPvpShopPanel .nx108-pvp-shop-body,
#nexoriaPvpShopPanel .nx108-pvp-shop-body > header { display: contents; }
#nexoriaPvpShopPanel #nx108PvpShopTitle {
  position: absolute; left: 4.8%; top: 4.6%; width: 27.5%; height: 7%;
  display: flex; align-items: center; margin: 0; font-size: 2.55cqw;
}
#nexoriaPvpShopPanel #nx108ClosePvpShop {
  position: absolute; left: 93.2%; top: 3.8%; width: 5%; height: 8.8%;
  min-width: 0; min-height: 0; margin: 0; padding: 0; color: transparent;
  background: transparent; border: 0; border-radius: 0; box-shadow: none;
}
#nexoriaPvpShopPanel .nx108-pvp-shop-body > header > p {
  position: absolute; left: 33.65%; top: 4.1%; width: 33.8%; height: 8.1%;
  display: grid; grid-template-columns: 1fr 1fr; gap: 3.3%; align-items: center;
  margin: 0; padding: 0; text-align: center; font-size: 1.65cqw;
}
#nexoriaPvpShopPanel #nx108PvpShopBalance { font-size: 2.4cqw; color: #ffe7ab; }
#nexoriaPvpShopPanel .nx205-pvp-shop-category {
  position: absolute; left: 74.3%; top: 5.1%; width: 16.6%; height: 6%;
  display: flex; align-items: center; justify-content: center; font-size: 1.9cqw;
}
#nexoriaPvpShopPanel .nx108-pvp-shop-grid {
  position: absolute; left: 3.5%; top: 16.4%; width: 48.8%; height: 75.9%;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: max-content; align-content: start; align-items: start; gap: .9cqw;
  min-height: 0; margin: 0; padding: .2cqw .4cqw .2cqw .2cqw; box-sizing: border-box;
  overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; touch-action: pan-y;
  scrollbar-width: thin; scrollbar-color: #b99750 transparent; scrollbar-gutter: stable;
}
#nexoriaPvpShopPanel .nx108-pvp-shop-slot {
  width: 100%; height: auto; aspect-ratio: 1; min-width: 0; min-height: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .3cqw; padding: .7cqw; margin: 0; box-sizing: border-box; overflow: hidden;
  border: .7cqw solid transparent; border-radius: 0;
  /* Painted alpha corners and face form the entire square; no CSS underlay. */
  border-image: url("assets/ui-205/guild-action-empty.png") 140 fill / .7cqw / 0 stretch;
  background: transparent !important;
  box-shadow: none; color: #fff0d2; text-align: center; font: 1.45cqw/1.15 Georgia, serif;
}
#nexoriaPvpShopPanel .nx108-pvp-shop-slot.is-empty { color: #ae9777; }
#nexoriaPvpShopPanel .nx108-pvp-shop-slot img {
  width: 58%; height: 58%; max-width: none; max-height: none; flex: 0 1 58%; object-fit: contain;
}
#nexoriaPvpShopPanel .nx108-pvp-shop-slot strong { max-width: 100%; font: inherit; }
#nexoriaPvpShopPanel .nx108-pvp-shop-slot small { font-size: 1.15cqw; line-height: 1.1; }
#nexoriaPvpShopPanel .nx108-pvp-shop-slot b { font-size: 2.4cqw; }
#nexoriaPvpShopPanel .nx205-pvp-shop-detail {
  position: absolute; left: 57.8%; top: 17%; width: 37%; height: 63%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 1cqw; overflow: auto; min-height: 0; text-align: center;
  scrollbar-width: thin; overscroll-behavior: contain;
}
#nexoriaPvpShopPanel .nx205-pvp-shop-detail > img {
  width: 75%; height: 52%; min-height: 0; flex: 0 1 52%; object-fit: contain;
}
#nexoriaPvpShopPanel .nx205-pvp-shop-detail h3 { margin: 0; font-size: 2.35cqw; }
#nexoriaPvpShopPanel .nx205-pvp-shop-detail p { margin: 0; font-size: 1.5cqw; }
#nexoriaPvpShopPanel #nx108PvpShopStatus { color: #ffe5ab; line-height: 1.25; }
#nexoriaPvpShopPanel #nx108PvpShopStatus:empty { display: none; }
#nexoriaPvpShopPanel #nx108PvpShopBack {
  position: absolute; left: 57%; top: 83%; width: 38.2%; height: 9.7%;
  min-width: 0; min-height: 0; margin: 0; padding: 0;
  border: 0; border-radius: 0; box-shadow: none; background: transparent !important;
  color: #fff0d2; font: 2.5cqw/1.1 Georgia, "Times New Roman", serif;
  text-shadow: 0 1px 2px #180e07; cursor: pointer;
}
#nexoriaPvpShopPanel button:focus-visible { outline: 2px solid #fff6c9; outline-offset: -3px; }
#nexoriaPvpShopPanel button:disabled { opacity: .6; cursor: not-allowed; }
#nexoriaPvpShopPanel [hidden] { display: none !important; }

/* NEXORIA bundle206: nexoria-quantity-203.css */
/* Same native gold/brown artwork and numeric flow approved in Shop Dược 102. */
.nx203-quantity-field { cursor: pointer; caret-color: transparent; touch-action: manipulation; }
.nx203-quantity-layer { position: fixed; inset: 0; z-index: 2147483000; display: block; background: #08050344; touch-action: manipulation; }
.nx203-quantity-layer.is-in-host { position: absolute; z-index: 40; background: transparent; display: block; }
.nx203-quantity-pad { position: absolute; left: 50%; top: 50%; width: 505px; box-sizing: border-box; padding: 24px 27px; border: 17px solid transparent; border-image: url("assets/ui-shops-200/forge-rule-frame.png") 20 fill stretch; background: url("assets/ui-shops-200/shop-panel-fill.png") repeat; box-shadow: 0 10px 30px #100900aa; color: #f9e9c5; text-align: center; font-family: Georgia, "Times New Roman", serif; transform: translate(-50%,-50%) scale(var(--quantity-scale,.5)); transform-origin: center; }
.is-in-host > .nx203-quantity-pad { position: absolute; left: var(--quantity-left); top: var(--quantity-top); transform: none; }
.nx203-quantity-pad * { box-sizing: border-box; }
.nx203-quantity-pad h3 { margin: 0 0 14px; max-height: 73.6px; overflow: auto; overflow-wrap: anywhere; font: 32px/1.15 Georgia,serif; }
.nx203-quantity-pad output { display: block; padding: 13px; border: 1px solid #ae8449; border-radius: 10px; background: #1c1209; color: #ffe4a0; font-size: 38px; line-height: 1; font-variant-numeric: tabular-nums; }
.nx203-quantity-pad p { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 11px 0 14px; font-size: 22px; line-height: 1.15; }
.nx203-quantity-digits { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; }
.nx203-quantity-layer .nx203-quantity-pad button { cursor: pointer; min-height: 68px; margin: 0; padding: 0; border: 10px solid transparent; border-image: url("assets/ui-shops-200/gems-btn-max-rim.png") 17 fill stretch; border-radius: 10px; background: url("assets/ui-shops-200/shop-panel-fill.png") repeat; box-shadow: none; color: #f9e9c5; font: 31px/1 Georgia,serif; text-shadow: 0 2px 3px #000; touch-action: manipulation; }
.nx203-quantity-layer .nx203-quantity-pad button:hover { filter: brightness(1.15); }
.nx203-quantity-layer .nx203-quantity-pad button:focus-visible { outline: 3px solid #ffe39a; outline-offset: 2px; }
.nx203-quantity-layer .nx203-quantity-pad [data-quantity-key="clear"] { font-size: 24px; }
.nx203-quantity-layer .nx203-quantity-pad [data-quantity-key="max"] { min-height: 37px; margin-left: auto; font-size: 19px; border-width: 6px; padding: 2px 4px; }
.nx203-quantity-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
.nx203-quantity-layer .nx203-quantity-actions button { font-size: 27px; }
/* Prompt proximity remains controlled by game.js. The matching service panel
   merely suppresses its label; closing only reveals labels still in range. */
body:has(:is(#nexoriaBlacksmithPanel,#nexoriaEnchantPanel,#nexoriaStarPanel):not([hidden])) #blacksmithPrompt,
body:has(#nexoriaPotionShopPanel:not([hidden])) #potionShopPrompt,
body:has(#nexoriaJewelryShopPanel:not([hidden])) #jewelryShopPrompt,
body:has(#nexoriaGemShopPanel:not([hidden])) #gemShopPrompt,
body:has(:is(#nexoriaPvpPanel,#nexoriaPvpShopPanel):not([hidden])) #pvpHousePrompt,
body:has(#nexoriaPawnPanel:not([hidden])) #pawnShopPrompt,
body:has(#nexoriaSpellShopPanel:not([hidden])) #spellShopPrompt,
body:has(#nexoriaGuildPanel:not([hidden])) #guildHousePrompt,
body:has(:is(#nx200AdventureBoard,#nexoriaAdventureChest):not([hidden])) #adventureChestPrompt,
body:has(#nx198PetModal:not([hidden])) #petHousePrompt,
body:has(#nexoriaHouse203Panel:not([hidden])) #playerHousePrompt { visibility: hidden !important; pointer-events: none !important; }

.is-in-host .nx203-quantity-pad p { display: block; }
.nx203-quantity-layer.is-in-host .nx203-quantity-pad [data-quantity-key="max"] { display: none; }

/* NEXORIA bundle206: house-203.css */
#nexoriaHouse203Panel{position:fixed;inset:0;z-index:9500;overflow:hidden;background:#1c1415;color:#faedd5;font-family:Georgia,"Times New Roman",serif;isolation:isolate;touch-action:none}
#nexoriaHouse203Panel[hidden],#nexoriaHouse203Panel [hidden]{display:none!important}
#nexoriaHouse203Panel *{box-sizing:border-box}
.house203-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;filter:brightness(.68)}
.house203-stage{position:absolute;width:min(100vw,177.6833vh);aspect-ratio:1672/941;left:50%;top:50%;transform:translate(-50%,-50%)}
.house203-room{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.house203-wall-picture{position:absolute;left:85.5263%;top:10.627%;width:9.5694%;height:40.8077%;object-fit:contain;pointer-events:none}
#nexoriaHouse203Panel .house203-chest-hotspot,#nexoriaHouse203Panel .house203-gallery-hotspot{position:absolute;background:none;border:0;box-shadow:none;padding:0;cursor:pointer}
.house203-chest-hotspot{left:0;top:58.4485%;width:21.8301%;height:35.6004%}
.house203-gallery-hotspot{left:81.9378%;top:2.1254%;width:15.5502%;height:53.6663%}
#nexoriaHouse203Panel button:focus-visible{outline:2px solid #fff1b8;outline-offset:2px}
.house203-toolbar{position:absolute;right:max(12px,env(safe-area-inset-right));top:max(10px,env(safe-area-inset-top));display:flex;gap:6px;z-index:2}
#nexoriaHouse203Panel .house203-button{border:0;border-radius:0;background:transparent url('assets/ui-200/adventure-btn-empty.png') center/100% 100% no-repeat;color:#fff2ce;min-height:32px;padding:7px 18px;line-height:1.2;font:700 14px Georgia,"Times New Roman",serif;cursor:pointer;box-shadow:none;white-space:nowrap}
#nexoriaHouse203Panel .house203-button:disabled{opacity:.45;cursor:default}
.house203-content{position:absolute;inset:42px max(12px,env(safe-area-inset-right)) 30px max(12px,env(safe-area-inset-left));z-index:3;display:grid;place-items:center;background:#120c0c77}
.house203-sheet{width:min(950px,100%);max-height:100%;height:100%;min-height:0;padding:14px 18px;display:flex;flex-direction:column;gap:8px;background:#271d18;border:14px solid transparent;border-image:url('assets/ui-200/pets-card-frame.png') 18 fill / 14px / 0 stretch;color:#fff0d0;overflow:hidden}
.house203-sheet header{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none}
.house203-sheet h2{font-size:clamp(14px,2.2vw,23px);margin:0;line-height:1.2}
.house203-sheet h3{margin:0 0 6px;font-size:clamp(13px,1.8vw,18px)}
.house203-sheet p{margin:0}.house203-note{font:12px/1.3 Georgia,serif;display:block;flex:none}
.house203-vault-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px;flex:1;min-height:0}
.house203-vault-columns>section{min-width:0;min-height:0;display:flex;flex-direction:column}
.house203-item-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:min-content;gap:5px;overflow:auto;min-height:0;flex:1;touch-action:pan-y;overscroll-behavior:contain;padding:2px}
#nexoriaHouse203Panel .house203-item{min-width:0;padding:7px 5px;border:8px solid transparent;border-image:url('assets/ui-200/pets-card-frame.png') 18 fill / 8px / 0 stretch;background:#251b1e;color:#fff0d0;display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;font-family:inherit;border-radius:0}
.house203-item img{width:100%;height:48px;object-fit:contain}.house203-item span{font-size:12px;line-height:1.1;overflow-wrap:anywhere}.house203-item small{font-size:10px}
.house203-item.is-selected{filter:brightness(1.35);outline:1px solid #ffdb84;outline-offset:-4px}
.house203-vault-columns footer{display:flex;align-items:center;justify-content:space-between;gap:6px;padding-top:5px;font-size:13px;flex:none}
.house203-vault-pages{display:flex;justify-content:flex-end;gap:6px;min-height:28px;flex:none}
#nexoriaHouse203Panel .house203-vault-pages button{min-height:25px;font-size:12px;padding:4px 12px}
.house203-transfer{display:flex;gap:8px;align-items:center;flex:none;min-height:33px}.house203-transfer>span{flex:1;min-width:0;font-size:13px;overflow-wrap:anywhere}
.house203-status{position:absolute;bottom:3px;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));z-index:4;text-align:center;font:13px/1.2 Georgia,serif;margin:0;color:#fff1c5;text-shadow:0 1px 3px #000;pointer-events:none}
.house203-gallery{width:min(750px,100%);text-align:center}
.house203-gallery-row{display:flex;align-items:center;justify-content:center;gap:10px;flex:1;min-height:0}
.house203-floating-picture{height:100%;max-width:65%;aspect-ratio:3/4;margin:0;display:grid;place-items:center;min-height:0;touch-action:pan-y;animation:house203-float 5s ease-in-out infinite}
.house203-floating-picture img{width:100%;height:100%;min-height:0;object-fit:contain;filter:drop-shadow(0 10px 10px #0008);pointer-events:none}
.house203-gallery footer{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;flex:none}
@keyframes house203-float{0%,100%{transform:translateY(2px)}50%{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.house203-floating-picture{animation:none}}
@media(max-height:450px){.house203-content{inset:38px 10px 23px}.house203-sheet{padding:5px 7px;border-width:9px;border-image-width:9px;gap:4px}.house203-sheet header .house203-button{min-height:25px;padding:4px 12px}.house203-sheet h2{font-size:15px}.house203-sheet h3{font-size:13px;margin-bottom:3px}.house203-vault-columns{gap:10px}.house203-item-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.house203-item img{height:34px}.house203-note{font-size:10px}.house203-vault-columns footer{padding-top:3px}.house203-transfer{min-height:27px}.house203-toolbar .house203-button,#nexoriaHouse203Panel .house203-sheet .house203-button{font-size:12px;min-height:27px;padding:5px 13px}.house203-status{font-size:11px}.house203-gallery-row{gap:6px}}
@media(max-width:600px) and (orientation:portrait){.house203-vault-columns{grid-template-columns:1fr;gap:6px}.house203-item-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.house203-toolbar{left:8px;right:8px;justify-content:center}.house203-note{font-size:10px}.house203-vault-columns footer{font-size:12px}.house203-sheet{padding:5px 7px;border-width:9px;border-image-width:9px}.house203-gallery footer .house203-button{font-size:11px;padding:5px 12px}}

/* NEXORIA bundle206: timed-activities.css */
/* Controls use the approved painted button image. CSS only positions artwork/text. */
#nexoriaActivitiesPanel{position:fixed;inset:0;z-index:9600;isolation:isolate;overflow:hidden;touch-action:none;background:#101415;color:#fff6df;font-family:Georgia,"Times New Roman",serif}
#nexoriaActivitiesPanel[hidden],#nexoriaActivitiesPanel [hidden]{display:none!important}
#nexoriaActivitiesPanel *{box-sizing:border-box}
#nexoriaActivitiesPanel .nx-activity-scene{position:absolute;inset:0;width:100%;height:100%;display:block}
#nexoriaActivitiesPanel .nx-activity-header{position:absolute;top:max(10px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));display:flex;justify-content:space-between;align-items:flex-start;gap:10px;pointer-events:none}
#nexoriaActivitiesPanel nav{display:flex;gap:7px;pointer-events:auto}
#nexoriaActivitiesPanel .nx-activity-button,#gameMenuPanel .nx-activity-entry{border:0;border-radius:0;box-shadow:none;background:transparent url('assets/activities-fps/adventure-btn-empty.png') center/contain no-repeat;color:#fff4d8;font:700 13px/1.15 Georgia,"Times New Roman",serif;text-align:center;text-shadow:0 1px 2px #1b1007;width:160px;aspect-ratio:310/74;min-height:38px;padding:6px 13px;white-space:nowrap;cursor:pointer;pointer-events:auto;flex:none}
#nexoriaActivitiesPanel .nx-activity-button[aria-pressed="false"]{filter:brightness(.73)}
#nexoriaActivitiesPanel .nx-activity-button:disabled{opacity:.55;cursor:default}
#nexoriaActivitiesPanel .nx-activity-button:focus-visible,#gameMenuPanel .nx-activity-entry:focus-visible{outline:2px solid white;outline-offset:2px}
#nexoriaActivitiesPanel .nx-activity-information{position:absolute;left:max(16px,env(safe-area-inset-left));top:max(64px,calc(env(safe-area-inset-top) + 54px));right:12px;pointer-events:none;text-shadow:0 1px 3px #000,0 2px 7px #000}
#nexoriaActivitiesPanel h2{font-size:21px;line-height:1.2;margin:0 0 5px;font-weight:700}
#nexoriaActivitiesPanel .nx-activity-information p{font-size:14px;line-height:1.4;margin:2px 0}
#nexoriaActivitiesPanel .nx-activity-footer{position:absolute;bottom:max(10px,env(safe-area-inset-bottom));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));display:flex;flex-direction:column;align-items:center;gap:5px;pointer-events:none}
#nexoriaActivitiesPanel .nx-activity-message{font-size:13px;line-height:1.3;min-height:17px;margin:0;text-align:center;text-shadow:0 1px 3px #000,0 2px 7px #000;max-width:720px}
#nexoriaActivitiesPanel .nx-activity-actions{display:flex;gap:7px;align-items:center;justify-content:center;flex-wrap:wrap;pointer-events:auto}
#nexoriaActivitiesPanel .nx-activity-actions .nx-activity-button{width:184px;min-height:44px}
#gameMenuPanel .nx-activity-entry{width:160px;display:block;margin:5px auto;min-height:38px}
@media(max-height:450px){#nexoriaActivitiesPanel .nx-activity-header{top:max(6px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right))}#nexoriaActivitiesPanel .nx-activity-button{width:140px;min-height:33px;font-size:12px;padding:5px 11px}#nexoriaActivitiesPanel .nx-activity-information{top:max(46px,calc(env(safe-area-inset-top) + 40px));left:max(12px,env(safe-area-inset-left))}#nexoriaActivitiesPanel h2{font-size:17px;margin-bottom:2px}#nexoriaActivitiesPanel .nx-activity-information p{font-size:12px;line-height:1.25}#nexoriaActivitiesPanel .nx-activity-actions .nx-activity-button{width:160px;min-height:38px}#nexoriaActivitiesPanel .nx-activity-footer{bottom:max(5px,env(safe-area-inset-bottom));gap:3px}#nexoriaActivitiesPanel .nx-activity-message{font-size:11px;min-height:14px}}
@media(max-width:520px){#nexoriaActivitiesPanel .nx-activity-header{gap:4px}#nexoriaActivitiesPanel nav{gap:3px}#nexoriaActivitiesPanel .nx-activity-button{width:116px;min-height:28px;font-size:11px;padding:4px 7px}#nexoriaActivitiesPanel .nx-activity-actions{gap:4px}#nexoriaActivitiesPanel .nx-activity-actions .nx-activity-button{width:151px;min-height:36px;font-size:11px}#nexoriaActivitiesPanel .nx-activity-information{top:max(51px,calc(env(safe-area-inset-top) + 42px))}}

/* NEXORIA bundle206: nexoria-shops-200.css */
/* Approved shop canvases are 1672 × 941. Only the entire stage scales uniformly. */
/* The approved painted frame stays at its native ratio. Only the exterior
   room illustration is clipped; the brown panel texture fills alpha holes. */
.nx108-layer.nx200-shop-layer { padding: 0 !important; overflow: hidden; background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
.nx200-shop-layer[hidden] { display: none !important; }
.nx200-shop-layer > .nx108-panel { display: none !important; }
.nx200-shop-stage { position: absolute; left: var(--shop-center-x, 50%); top: var(--shop-center-y, 50%); width: 1672px; height: 941px; margin: 0; color: #f9e9c5; font-family: Georgia, "Times New Roman", serif; transform: translate(-50%, -50%) scale(var(--shop-scale, 1)); transform-origin: center; background: none; isolation: isolate; }
.nx200-shop-stage::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-repeat: no-repeat, repeat; background-size: 1672px 941px, 256px 256px; }
.nx200-shop-gems::before { background-image: url("assets/ui-shops-200/gems-chrome.png"), url("assets/ui-shops-200/shop-panel-fill.png"); clip-path: inset(58px 29px 75px 29px round 20px); }
.nx200-shop-potions::before { background-image: url("assets/ui-shops-200/potions-chrome.png"), url("assets/ui-shops-200/shop-panel-fill.png"); clip-path: inset(62px 46px 81px 45px round 20px); }
.nx200-shop-general::before { background-image: url("assets/ui-shops-200/general-chrome.png"), url("assets/ui-shops-200/shop-panel-fill.png"); clip-path: inset(58px 28px 49px 28px round 20px); }
.nx200-shop-jewelry::before { background-image: url("assets/ui-shops-200/jewelry-chrome.png"), url("assets/ui-shops-200/shop-panel-fill.png"); clip-path: inset(56px 33px 59px 33px round 20px); }
.nx200-shop-stage *, .nx200-shop-stage *::before, .nx200-shop-stage *::after { box-sizing: border-box; }
.nx200-shop-stage button, .nx200-shop-stage input { font-family: inherit; color: inherit; border: 1px solid #ad8349; border-radius: 12px; background: linear-gradient(#604321, #2d1d10); box-shadow: inset 0 0 0 2px #1e150ca6; padding: 0; margin: 0; line-height: 1.15; text-shadow: 0 2px 3px #000; touch-action: manipulation; }
.nx200-shop-stage button { cursor: pointer; }
.nx200-shop-stage button:hover:not(:disabled) { filter: brightness(1.15); }
.nx200-shop-stage button:focus-visible, .nx200-shop-stage input:focus-visible { outline: 3px solid #ffe39a; outline-offset: 2px; }
.nx200-shop-stage button:disabled { cursor: default; opacity: .5; }
.nx200-shop-heading { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.nx200-shop-stage .nx200-shop-close { position: absolute; left: 1537px; top: 78px; width: 80px; height: 77px; font-size: 0; background: none; border: none; box-shadow: none; }
.nx200-shop-gold { position: absolute; display: flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid #967344; border-radius: 12px; background: #20170eee; font-size: 28px; height: 62px; top: 88px; left: 1241px; width: 273px; white-space: nowrap; }
.nx200-shop-gold > span { font-size: 21px; order: 3; }
.nx200-shop-gold b { font-weight: 400; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.nx200-shop-gold i, .nx200-shop-card b i { font-style: normal; color: #ffd76b; text-shadow: 0 0 3px #6f3d0f; }
.nx200-shop-gold i { order: -1; }
.nx200-shop-tabs { position: absolute; inset: 0; pointer-events: none; }
.nx200-shop-tabs button { position: absolute; pointer-events: auto; font-size: 0; background-repeat: no-repeat; background-position: center; background-size: contain; border: none; box-shadow: none; filter: brightness(.8); }
.nx200-shop-tabs button.is-active { filter: brightness(1.13); box-shadow: 0 0 16px #dca53666; }
.nx200-shop-products { position: absolute; display: grid; gap: 14px; align-content: start; padding: 8px; overflow: auto; scrollbar-color: #c29a5c #2b1c0f; scrollbar-width: thin; overscroll-behavior: contain; }
.nx200-shop-products::-webkit-scrollbar { width: 10px; }
.nx200-shop-products::-webkit-scrollbar-thumb { background: #ad8953; border-radius: 10px; }
.nx200-shop-products::-webkit-scrollbar-track { background: #322012; border-radius: 10px; }
.nx200-shop-stage .nx200-shop-card { display: flex; flex-direction: column; align-items: center; justify-content: start; gap: 8px; overflow: hidden; min-width: 0; border: 2px solid #a98650; border-radius: 12px; background: linear-gradient(135deg, #3d2917, #170f08 75%); box-shadow: inset 0 0 0 3px #21140b, inset 0 0 0 4px #70512c; padding: 5px 5px 10px; text-align: center; }
.nx200-shop-stage .nx200-shop-card.is-selected { border-color: #ffdd8c; box-shadow: 0 0 14px #e8b75980, inset 0 0 0 3px #392710, inset 0 0 0 4px #f2ca75; }
.nx200-shop-card-picture { display: flex; width: 100%; align-items: center; justify-content: center; overflow: hidden; border-radius: 9px; background: radial-gradient(ellipse at center, #8d673533, #120d0990); }
.nx200-shop-card img { display: block; width: 100%; height: 100%; object-fit: contain; }
.nx200-shop-card strong { display: flex; align-items: center; justify-content: center; min-height: 48px; font-size: 25px; line-height: 1.1; font-weight: 400; padding: 0 6px; }
.nx200-shop-card small { font-size: 20px; color: #d6ba81; }
.nx200-shop-card b { margin-top: auto; width: 94%; border-top: 1px solid #7a5c31; padding-top: 8px; font-weight: 400; font-size: 27px; }
.nx200-shop-card b span { font-size: 19px; }
.nx200-shop-detail { position: absolute; inset: 0; pointer-events: none; }
.nx200-shop-detail button, .nx200-shop-detail input { pointer-events: auto; }
.nx200-shop-preview { position: absolute; display: grid; place-items: center; overflow: hidden; border-radius: 15px; background: radial-gradient(ellipse at 50% 46%, #d29b414a, #170e0866 70%); }
.nx200-shop-preview img { position: relative; display: block; min-width: 0; min-height: 0; width: 88%; height: 88%; max-width: 100%; max-height: 100%; object-fit: contain; filter: drop-shadow(0 12px 14px #100902); }
.nx200-shop-pedestal { position: absolute; left: 10%; bottom: 8%; width: 80%; height: 16%; border-radius: 50%; background: radial-gradient(ellipse, #ac7440 0%, #603a20 45%, #35200f 55%, #9c713a 62%, #25160e 68%); box-shadow: 0 11px 15px #130b08; }
.nx200-shop-copy { position: absolute; text-align: center; pointer-events: auto; }
.nx200-shop-copy h3 { font-size: 34px; line-height: 1.15; margin: 0 0 10px; color: #ffecc0; font-weight: 400; }
.nx200-shop-copy p { font-size: 23px; line-height: 1.25; margin: 0; color: #e0cba3; }
.nx200-shop-unit-price { position: absolute; text-align: center; font-size: 28px; }
.nx200-shop-unit-price b { color: #ffdb82; font-weight: 400; }
.nx200-shop-quantity { position: absolute; display: flex; align-items: center; gap: 10px; height: 64px; }
.nx200-shop-quantity > span { display: none; }
.nx200-shop-quantity > button { height: 64px; min-width: 68px; font-size: 41px; }
.nx200-shop-quantity > .nx200-shop-quantity-input { width: 120px; min-width: 120px; height: 64px; text-align: center; font-size: 32px; background: #1c1209; }
.nx200-shop-quantity input::-webkit-inner-spin-button, .nx200-shop-quantity input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.nx200-shop-quantity [data-shop-action="maximum"] { font-size: 23px; min-width: 140px; }
.nx200-shop-quantity small { display: none; }
.nx200-shop-quantity.is-single { justify-content: center; }
.nx200-shop-quantity.is-single button:not(.nx200-shop-quantity-input) { display: none; }
.nx200-shop-quantity.is-single > span { display: block; font-size: 24px; }
.nx200-shop-quantity.is-single small { display: block; font-size: 22px; color: #ccb78e; }
.nx200-shop-total { position: absolute; font-size: 23px; text-align: center; color: #e5c88c; }
.nx200-shop-total b { font-weight: 400; color: #ffe09a; }
.nx200-shop-stage .nx200-shop-buy { position: absolute; font-size: 0; background-color: transparent; background-repeat: no-repeat; background-position: center; background-size: contain; box-shadow: none; border: 0; border-radius: 12px; }
.nx200-shop-stage .nx200-shop-buy.is-combine { background-image: url("assets/ui-shops-200/gems-btn-buy-rim.png"); font-size: 34px; }
.nx200-shop-message { position: absolute; margin: 0; left: 88px; top: 889px; width: 1488px; height: 35px; text-align: center; overflow: hidden; font-family: system-ui, sans-serif; font-size: 20px; line-height: 30px; text-shadow: 0 1px 5px #000, 0 0 8px #000; }
.nx200-shop-empty, .nx200-shop-empty-detail { color: #e2cb9f; font-size: 29px; line-height: 1.4; text-align: center; padding: 50px 25px; }
.nx200-shop-empty { grid-column: 1 / -1; }
.nx200-shop-empty-detail { position: absolute; left: 1110px; top: 290px; width: 480px; }

.nx200-shop-gems .nx200-shop-tabs [data-shop-tab="buy"] { left: 543px; top: 86px; width: 316px; height: 72px; background-image: url("assets/ui-shops-200/gems-tab-buy.png"); }
.nx200-shop-gems .nx200-shop-tabs [data-shop-tab="combine"] { left: 868px; top: 86px; width: 294px; height: 71px; background-image: url("assets/ui-shops-200/gems-tab-merge.png"); }
.nx200-shop-gems .nx200-shop-products { left: 68px; top: 186px; width: 1010px; height: 641px; grid-template-columns: repeat(5, 1fr); grid-auto-rows: 276px; }
.nx200-shop-gems .nx200-shop-card-picture { height: 143px; flex: 0 0 143px; padding: 9px; }
.nx200-shop-gems .nx200-shop-card strong { font-size: 24px; }
.nx200-shop-gems .nx200-shop-card small { font-size: 18px; }
.nx200-shop-gems[data-shop-mode="combine"] .nx200-shop-card-picture { height: 116px; flex-basis: 116px; }
.nx200-shop-gems .nx200-shop-preview { left: 1112px; top: 186px; width: 480px; height: 310px; background: radial-gradient(ellipse, #8d67351a, transparent 72%); }
.nx200-shop-gems .nx200-shop-preview img { width: 82%; height: 90%; filter: none; }
.nx200-shop-gems .nx200-shop-pedestal { display: none; }
.nx200-shop-gems .nx200-shop-copy { left: 1120px; top: 506px; width: 465px; max-height: 96px; overflow: auto; }
.nx200-shop-gems .nx200-shop-copy h3 { font-size: 33px; }
.nx200-shop-gems .nx200-shop-copy p { font-size: 20px; }
.nx200-shop-gems .nx200-shop-unit-price { left: 1125px; top: 611px; width: 456px; font-size: 25px; }
.nx200-shop-gems .nx200-shop-quantity { left: 1133px; top: 648px; width: 444px; }
.nx200-shop-gems .nx200-shop-total { left: 1125px; top: 832px; width: 456px; font-size: 19px; }
.nx200-shop-gems .nx200-shop-buy { left: 1121px; top: 723px; width: 461px; height: 102px; background-image: url("assets/ui-shops-200/gems-btn-buy.png"); }
.nx200-shop-gems[data-shop-mode="combine"] .nx200-shop-copy { max-height: 158px; }
.nx200-shop-gems[data-shop-mode="combine"] .nx200-shop-unit-price { top: 672px; }
.nx200-shop-gems[data-shop-mode="combine"] .nx200-shop-total { display: none; }
.nx200-shop-stage:is(.nx200-shop-gems, .nx200-shop-potions) .nx200-shop-message { top: 865px; padding: 0 10px; border-radius: 8px; background: #1c130bdb; }

.nx200-shop-general .nx200-shop-gold { left: 1301px; top: 88px; width: 242px; font-size: 26px; }
.nx200-shop-general .nx200-shop-tabs [data-shop-tab="skill-book"] { left: 492px; top: 85px; width: 249px; height: 72px; background-image: url("assets/ui-shops-200/general-tab-skill.png"); }
.nx200-shop-general .nx200-shop-tabs [data-shop-tab="enchant-scroll"] { left: 752px; top: 85px; width: 248px; height: 72px; background-image: url("assets/ui-shops-200/general-tab-enchant.png"); }
.nx200-shop-general .nx200-shop-tabs [data-shop-tab="extraction"] { left: 1011px; top: 85px; width: 258px; height: 72px; background-image: url("assets/ui-shops-200/general-tab-unsocket.png"); }
.nx200-shop-general .nx200-shop-products { left: 76px; top: 180px; width: 845px; height: 680px; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 324px; }
.nx200-shop-general .nx200-shop-card-picture { height: 198px; flex: 0 0 198px; }
.nx200-shop-general .nx200-shop-card strong { font-size: 25px; min-height: 46px; }
.nx200-shop-general .nx200-shop-preview { left: 962px; top: 182px; width: 634px; height: 355px; }
.nx200-shop-general .nx200-shop-preview img { max-width: 410px; }
.nx200-shop-general .nx200-shop-copy { left: 982px; top: 540px; width: 595px; max-height: 86px; overflow: auto; }
.nx200-shop-general .nx200-shop-copy h3 { font-size: 32px; }
.nx200-shop-general .nx200-shop-copy p { font-size: 20px; }
.nx200-shop-general .nx200-shop-unit-price { left: 1009px; top: 637px; width: 548px; }
.nx200-shop-general .nx200-shop-quantity { left: 1011px; top: 692px; width: 544px; justify-content: center; }
.nx200-shop-general .nx200-shop-total { left: 982px; top: 865px; width: 595px; font-size: 18px; }
.nx200-shop-general .nx200-shop-buy { left: 1004px; top: 770px; width: 555px; height: 93px; background-image: url("assets/ui-shops-200/general-btn-buy.png"); }

.nx200-shop-potions .nx200-shop-gold { left: 1114px; top: 85px; width: 362px; font-size: 28px; }
.nx200-shop-potions .nx200-shop-products { left: 79px; top: 170px; width: 716px; height: 656px; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 309px; gap: 20px; }
.nx200-shop-potions .nx200-shop-card-picture { height: 181px; flex: 0 0 181px; }
.nx200-shop-potions .nx200-shop-card strong { font-size: 29px; min-height: 44px; }
.nx200-shop-potions .nx200-shop-preview { left: 823px; top: 184px; width: 393px; height: 627px; }
.nx200-shop-potions .nx200-shop-preview img { width: 86%; height: 86%; max-height: 86%; object-fit: contain; }
.nx200-shop-potions .nx200-shop-copy { left: 1231px; top: 219px; width: 346px; max-height: 180px; overflow: auto; }
.nx200-shop-potions .nx200-shop-copy h3 { font-size: 36px; }
.nx200-shop-potions .nx200-shop-copy p { font-size: 25px; }
.nx200-shop-potions .nx200-shop-unit-price { left: 1230px; top: 419px; width: 350px; font-size: 31px; }
.nx200-shop-potions .nx200-shop-quantity { left: 1228px; top: 509px; width: 353px; gap: 5px; }
.nx200-shop-potions .nx200-shop-quantity button { min-width: 54px; height: 62px; }
.nx200-shop-potions .nx200-shop-quantity .nx200-shop-quantity-input { width: 100px; min-width: 100px; height: 62px; }
.nx200-shop-potions .nx200-shop-quantity [data-shop-action="maximum"] { min-width: 120px; font-size: 24px; }
.nx200-shop-potions .nx200-shop-total { left: 1228px; top: 602px; width: 351px; font-size: 28px; padding: 15px 0; border-top: 1px solid #ae8349; border-bottom: 1px solid #ae8349; }
.nx200-shop-potions .nx200-shop-buy { left: 1224px; top: 686px; width: 361px; height: 116px; background-image: url("assets/ui-shops-200/potions-btn-buy.png"); }

.nx200-shop-jewelry .nx200-shop-gold { left: 1182px; top: 81px; width: 307px; font-size: 29px; }
.nx200-shop-jewelry .nx200-shop-tabs [data-shop-tab="all"] { left: 79px; top: 167px; width: 242px; height: 70px; background-image: url("assets/ui-shops-200/jewelry-tab-all.png"); }
.nx200-shop-jewelry .nx200-shop-tabs [data-shop-tab="necklace"] { left: 340px; top: 167px; width: 240px; height: 70px; background-image: url("assets/ui-shops-200/jewelry-tab-necklace.png"); }
.nx200-shop-jewelry .nx200-shop-tabs [data-shop-tab="ring"] { left: 600px; top: 167px; width: 230px; height: 70px; background-image: url("assets/ui-shops-200/jewelry-tab-ring.png"); }
.nx200-shop-jewelry .nx200-shop-products { left: 83px; top: 245px; width: 748px; height: 601px; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 281px; gap: 17px; }
.nx200-shop-jewelry .nx200-shop-card-picture { height: 145px; flex: 0 0 145px; }
.nx200-shop-jewelry .nx200-shop-card strong { min-height: 33px; font-size: 29px; }
.nx200-shop-jewelry .nx200-shop-card small { font-size: 20px; }
.nx200-shop-jewelry .nx200-shop-card b { padding-top: 4px; }
.nx200-shop-jewelry .nx200-shop-preview { left: 874px; top: 174px; width: 716px; height: 449px; }
.nx200-shop-jewelry .nx200-shop-preview img { width: 84%; height: 89%; }
.nx200-shop-jewelry .nx200-shop-copy { left: 888px; top: 662px; width: 336px; max-height: 159px; overflow: auto; text-align: left; }
.nx200-shop-jewelry .nx200-shop-copy h3 { font-size: 30px; margin-bottom: 6px; }
.nx200-shop-jewelry .nx200-shop-copy p { font-size: 22px; margin-top: 0; }
.nx200-shop-jewelry .nx200-shop-stats { display: grid; gap: 3px; margin-top: 7px; font-size: 21px; line-height: 1.2; color: #eddaa9; }
.nx200-shop-jewelry .nx200-shop-unit-price { left: 888px; top: 828px; width: 336px; text-align: left; font-size: 25px; }
.nx200-shop-jewelry .nx200-shop-total { display: none; }
.nx200-shop-jewelry .nx200-shop-buy { left: 1230px; top: 696px; width: 350px; height: 122px; background-image: url("assets/ui-shops-200/jewelry-btn-buy.png"); }
@media (prefers-reduced-motion: reduce) { .nx200-shop-stage * { transition: none !important; animation: none !important; } }

/* Native gilded card borders replace synthetic double-stroke boxes. The four
   corners are fixed; only the straight border runs repeat/extend. */
.nx200-shop-stage .nx200-shop-card { border: 2px solid transparent; border-image: url("assets/ui-shops-200/pawn-card-frame.png") 24 fill stretch; border-image-width: 12px; background: url("assets/ui-shops-200/shop-panel-fill.png") repeat; box-shadow: none; padding: 5px 8px 8px; }
.nx200-shop-stage .nx200-shop-card.is-selected { border-image-source: url("assets/ui-shops-200/pawn-card-selected-frame.png"); box-shadow: 0 0 12px #e8b75955; }
.nx200-shop-quantity > button { flex: 0 0 auto; }
.nx200-shop-preview { contain: layout paint; }
.nx200-shop-copy { overflow-wrap: anywhere; }
/* No native input is used here: tapping the quantity opens this local editor,
   preserving the panel, artwork, page scroll and viewport on mobile. */
.nx202-shop-keypad { position: absolute; z-index: 20; top: 223px; left: 1092px; width: 505px; padding: 24px 27px; border: 17px solid transparent; border-image: url("assets/ui-shops-200/forge-rule-frame.png") 20 fill stretch; background: url("assets/ui-shops-200/shop-panel-fill.png") repeat; box-shadow: 0 10px 30px #100900aa; color: #f9e9c5; text-align: center; }
.nx200-shop-potions .nx202-shop-keypad { left: 1043px; }
.nx200-shop-general .nx202-shop-keypad { left: 1017px; }
.nx202-shop-keypad h3 { margin: 0 0 14px; font: 32px Georgia, serif; }
.nx202-shop-keypad-value { display: block; padding: 13px; border: 1px solid #ae8449; border-radius: 10px; background: #1c1209; color: #ffe4a0; font-size: 38px; line-height: 1; font-variant-numeric: tabular-nums; }
.nx202-shop-keypad p { margin: 11px 0 14px; font-size: 22px; }
.nx202-shop-keypad-digits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.nx200-shop-stage .nx202-shop-keypad button { min-height: 68px; border: 10px solid transparent; border-image: url("assets/ui-shops-200/gems-btn-max-rim.png") 17 fill stretch; border-radius: 10px; background: url("assets/ui-shops-200/shop-panel-fill.png") repeat; box-shadow: none; font-size: 31px; line-height: 1; }
.nx200-shop-stage .nx202-shop-keypad [data-shop-key="clear"] { font-size: 24px; }
.nx202-shop-keypad-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
.nx200-shop-stage .nx202-shop-keypad-actions button { font-size: 27px; }

.nx200-shop-jewelry .nx200-shop-card { gap: 5px; }

/* Quantity actions use the same painted gold/brown rim as the local keypad.
   State changes only alter brightness/opacity; border geometry never changes. */
.nx200-shop-stage .nx200-shop-quantity > button { display: grid; place-items: center; border: 8px solid transparent; border-image: url("assets/ui-shops-200/gems-btn-max-rim.png") 17 fill stretch; background: url("assets/ui-shops-200/shop-panel-fill.png") repeat; box-shadow: none; line-height: 1; white-space: nowrap; }

/* NEXORIA bundle206: inline-admin.css */

      #accountNexoriaAdmin[hidden], #gameNexoriaAdmin[hidden], #nexoriaAdminPanel[hidden] { display: none !important; }
      #nexoriaAdminPanel { box-sizing: border-box; width: min(38rem, calc(100vw - 24px)); max-width: none; max-height: calc(100dvh - 24px); margin: auto; overflow: auto; color: #edf4ff; background: #0b1e30; border: 1px solid #526a81; border-radius: 18px; padding: 24px; }
      #nexoriaAdminPanel::backdrop { background: rgb(3 10 20 / 78%); }
      .nexoria-admin-heading, .nexoria-admin-actions, .nexoria-admin-row { display: flex; align-items: center; gap: 12px; justify-content: space-between; }
      .nexoria-admin-heading h2 { margin: 0; font-size: 1.2rem; }
      .nexoria-admin-scope { font-size: .9rem; line-height: 1.5; color: #c6d7e8; }
      #nexoriaAdminList { list-style: none; margin: 16px 0; padding: 0; }
      .nexoria-admin-row { padding: 14px 0; border-top: 1px solid #35495c; }
      .nexoria-admin-identity { display: grid; gap: 5px; min-width: 0; overflow-wrap: anywhere; }
      .nexoria-admin-identity small { color: #c6d7e8; white-space: pre-wrap; }
      #nexoriaAdminPanel button { cursor: pointer; }
      #nexoriaAdminPanel button:disabled { cursor: wait; opacity: .55; }
      #nexoriaAdminPanel .account-exit { flex-shrink: 0; }
      #nexoriaAdminPanel .auth-form { margin-top: 16px; }
    
/* NEXORIA bundle206: farm-204.css */
/* All decorative frames below are existing painted assets. CSS only arranges
   image fragments, text and hit areas; the world canvas uses native pixel art. */
#nexoriaFarm204{position:fixed;inset:0;z-index:9200;isolation:isolate;overflow:hidden;touch-action:none;color:#fff2d6;font-family:Georgia,"Times New Roman",serif;background:#273f2c}
#nexoriaFarm204[hidden],#nexoriaFarm204 [hidden]{display:none!important}
#nexoriaFarm204 *{box-sizing:border-box}
.farm204-scene{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
.farm204-scene:active{cursor:grabbing}
.farm204-header{position:absolute;left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));top:max(8px,env(safe-area-inset-top));display:flex;align-items:flex-start;justify-content:space-between;gap:8px;pointer-events:none}
.farm204-header>*{pointer-events:auto}
.farm204-heading{display:flex;flex-direction:column;gap:2px;padding:9px 18px 12px;border:12px solid transparent;border-image:url('assets/ui-200/pets-card-frame.png') 18 fill / 12px / 0 stretch;max-width:65%;font-size:12px;text-shadow:0 1px 2px #000}
.farm204-heading strong{font-size:21px}.farm204-summary{line-height:1.3}
#nexoriaFarm204 .farm204-button{border:0;border-radius:0;box-shadow:none;background:transparent url('assets/ui-200/adventure-btn-empty.png') center/100% 100% no-repeat;color:#fff0ce;padding:8px 16px;min-height:35px;min-width:65px;font:700 13px/1.2 Georgia,"Times New Roman",serif;cursor:pointer;white-space:nowrap}
#nexoriaFarm204 button:disabled{opacity:.5;cursor:default}
#nexoriaFarm204 button:focus-visible,.farm204-scene:focus-visible{outline:2px solid #fff1b8;outline-offset:2px}
.farm204-footer{position:absolute;left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));bottom:max(7px,env(safe-area-inset-bottom));pointer-events:none;display:flex;flex-direction:column;gap:3px;align-items:center}
.farm204-footer nav{display:flex;justify-content:center;gap:4px;max-width:100%;flex-wrap:wrap;pointer-events:auto}
.farm204-status{margin:0;text-align:center;min-height:16px;max-width:96%;font-size:13px;line-height:1.3;text-shadow:0 1px 3px #000,0 2px 4px #000}
.farm204-detail{position:absolute;right:max(14px,env(safe-area-inset-right));top:max(62px,15%);bottom:max(65px,env(safe-area-inset-bottom));width:min(420px,58%);display:flex;align-items:center;pointer-events:none}
.farm204-sheet{width:100%;max-height:100%;display:flex;flex-direction:column;gap:7px;border:16px solid transparent;border-image:url('assets/ui-200/pets-card-frame.png') 18 fill / 16px / 0 stretch;padding:9px 12px 12px;pointer-events:auto;min-height:0;overflow:hidden}
.farm204-sheet header{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none}
.farm204-sheet h2{margin:0;font-size:20px;line-height:1.2}.farm204-sheet header .farm204-button{min-width:36px;padding:5px 12px;font-size:20px}
.farm204-sheet-body{overflow:auto;min-height:0;touch-action:pan-y;overscroll-behavior:contain;font-size:14px;line-height:1.4;display:flex;flex-direction:column;gap:9px}
.farm204-sheet-body p{margin:0}.farm204-materials{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px}
.farm204-actions{display:flex;gap:7px;justify-content:center;flex-wrap:wrap}
.farm204-seeds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.farm204-seeds:has(>:last-child:nth-child(2)){grid-template-columns:repeat(2,minmax(0,1fr))}
#nexoriaFarm204 .farm204-seed{display:flex;min-width:0;flex-direction:column;align-items:center;gap:2px;padding:5px;border:9px solid transparent;border-radius:0;border-image:url('assets/ui-200/pets-card-frame.png') 18 fill / 9px / 0 stretch;background:none;color:#fff0ce;font-family:inherit;cursor:pointer}
.farm204-seed img{width:100%;height:75px;object-fit:contain}.farm204-seed span{font-size:13px;line-height:1.1}.farm204-seed small{font-size:11px}
@media(max-height:450px){.farm204-heading{padding:5px 12px 8px;border-width:8px;border-image-width:8px;font-size:11px}.farm204-heading strong{font-size:17px}.farm204-header{top:5px}.farm204-detail{top:56px;bottom:59px}.farm204-sheet{padding:3px 6px 7px;border-width:11px;border-image-width:11px;gap:3px}.farm204-sheet h2{font-size:16px}.farm204-sheet-body{font-size:12px;gap:6px}#nexoriaFarm204 .farm204-button{font-size:12px;min-height:30px;padding:6px 12px}.farm204-sheet header .farm204-button{min-height:27px;min-width:30px;padding:3px 10px;font-size:17px}.farm204-seed img{height:49px}.farm204-status{font-size:11px;min-height:13px}.farm204-footer{bottom:4px}.farm204-seed span{font-size:11px}}
@media(max-width:640px){.farm204-heading{max-width:59%}.farm204-detail{width:calc(100% - 24px);right:12px;top:75px;bottom:94px}.farm204-footer nav{gap:2px}#nexoriaFarm204 .farm204-footer .farm204-button{font-size:11px;padding:6px 9px}.farm204-header>.farm204-button{font-size:11px;min-width:0}}

/* NEXORIA bundle206: supply-204.css */
/* Every visible rim is a painted image. CSS positions art, live text and hitboxes. */
#nexoriaSupply204Panel{position:fixed;inset:0;z-index:9800;display:grid;place-items:center;overflow:hidden;isolation:isolate;color:#fff0d2;font-family:Georgia,"Times New Roman",serif;background:rgba(0,0,0,.66);touch-action:none;--supply-unit:min(1vw,1.776833vh)}
#nexoriaSupply204Panel[hidden],#nexoriaSupply204Panel [hidden]{display:none!important}
#nexoriaSupply204Panel *{box-sizing:border-box}
#nexoriaSupply204Panel button{border:0;border-radius:0;box-shadow:none;background:none;color:inherit;font:inherit;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
#nexoriaSupply204Panel button:disabled{cursor:default;color:#b3a58d}
#nexoriaSupply204Panel button:focus-visible{outline:2px solid #fff6c9;outline-offset:-3px}
.supply204-stage{position:relative;width:min(100vw,177.6833vh);aspect-ratio:1672/941;max-height:100vh;flex:none;font-size:calc(var(--supply-unit)*1.65);line-height:1.2}
.supply204-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.supply204-title{position:absolute;left:4.8%;top:4.6%;width:27.5%;height:7%;margin:0;display:flex;align-items:center;font-size:calc(var(--supply-unit)*2.55);font-weight:700;line-height:1.05;white-space:normal}
.supply204-tabs{position:absolute;left:33.65%;top:4.1%;width:33.8%;height:8.1%;display:grid;grid-template-columns:1fr 1fr;gap:3.3%}
.supply204-tabs button{position:relative;isolation:isolate;font-size:calc(var(--supply-unit)*2.4)!important;font-weight:700!important}
.supply204-tabs canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.supply204-tabs button:disabled canvas{filter:brightness(.7)}
.supply204-wallet{position:absolute;left:74.3%;top:5.1%;width:16.6%;height:6%;display:flex;justify-content:center;align-items:center;font-size:calc(var(--supply-unit)*2.05);white-space:nowrap;overflow:hidden}
.supply204-close{position:absolute;left:93.2%;top:3.8%;width:5%;height:8.8%}
.supply204-list{position:absolute;left:3.5%;top:16.4%;width:48.8%;height:75.9%;display:flex;flex-direction:column;gap:calc(var(--supply-unit)*1.2);overflow:auto;overscroll-behavior:contain;touch-action:pan-y;padding:2px 4px 2px 2px;scrollbar-width:thin;scrollbar-color:#b99750 transparent}
#nexoriaSupply204Panel .supply204-card{position:relative;isolation:isolate;display:grid;grid-template-columns:50% 50%;flex:none;width:100%;height:calc(var(--supply-unit)*19.1);min-height:calc(var(--supply-unit)*16);text-align:left;padding:calc(var(--supply-unit)*1.1);gap:calc(var(--supply-unit)*.45)}
.supply204-card-frame{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.supply204-card.is-selected .supply204-card-frame{filter:brightness(1.65)}
.supply204-card-icon{min-height:0;min-width:0;display:grid;place-items:center;pointer-events:none;padding:calc(var(--supply-unit)*.3)}
.supply204-card-icon img{width:100%;height:100%;object-fit:contain;min-height:0;pointer-events:none}
.supply204-card-copy{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:calc(var(--supply-unit)*1.05);padding-right:calc(var(--supply-unit)*1)}
.supply204-card-copy strong{font-weight:700;font-size:calc(var(--supply-unit)*2.08);line-height:1.1}
.supply204-card-copy>span{font-size:calc(var(--supply-unit)*2.05);color:#ffe7a5}
.supply204-card-copy small{font-size:calc(var(--supply-unit)*1.5);line-height:1.1}
.supply204-empty{margin:auto;text-align:center}
.supply204-detail{position:absolute;left:57.8%;top:16.2%;width:37%;height:65.3%;display:flex;flex-direction:column;align-items:stretch;min-height:0;overflow:hidden;text-align:center;gap:calc(var(--supply-unit)*.45)}
.supply204-product-image{flex:1;min-height:0;display:grid;place-items:center}
.supply204-product-image img{height:100%;width:100%;object-fit:contain;min-height:0;max-height:100%;pointer-events:none}
.supply204-detail h3{margin:0;flex:none;font-size:calc(var(--supply-unit)*2.35);line-height:1.1;font-weight:700}
.supply204-benefit{margin:0;font-size:calc(var(--supply-unit)*1.55);line-height:1.2;flex:none}
.supply204-recipe{margin:0;font-size:calc(var(--supply-unit)*1.4);line-height:1.15;flex:none;color:#ffe1a0}
.supply204-ingredients{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(var(--supply-unit)*.3) calc(var(--supply-unit)*.65);font-size:calc(var(--supply-unit)*1.26);line-height:1.1;flex:none}
.supply204-ingredients span{white-space:nowrap}
.supply204-details-bottom{flex:none;margin-top:calc(var(--supply-unit)*.4);text-align:left}
.supply204-stock{margin:0 0 calc(var(--supply-unit)*.4);font-size:calc(var(--supply-unit)*1.45);line-height:1.15}
.supply204-price,.supply204-total{display:flex;align-items:center;justify-content:space-between;margin:0;font-size:calc(var(--supply-unit)*1.75);line-height:1.2;min-height:calc(var(--supply-unit)*2.55)}
.supply204-price b,.supply204-total b{font-weight:400;color:#ffe6a6}
.supply204-quantity{display:flex;align-items:center;gap:calc(var(--supply-unit)*.45);min-height:calc(var(--supply-unit)*4.1);white-space:nowrap}
.supply204-quantity>span{font-size:calc(var(--supply-unit)*1.55);margin-right:auto}
#nexoriaSupply204Panel .supply204-small-button{position:relative;display:grid;place-items:center;min-width:calc(var(--supply-unit)*3.4);height:calc(var(--supply-unit)*3.65);font-size:calc(var(--supply-unit)*1.8);padding:0 calc(var(--supply-unit)*.6);isolation:isolate}
.supply204-small-button canvas{position:absolute;inset:0;height:100%;width:100%;pointer-events:none;z-index:-1}
.supply204-small-button:disabled canvas{filter:brightness(.55)}
#nexoriaSupply204Panel [data-supply-action="quantity"]{min-width:calc(var(--supply-unit)*5.6)}
#nexoriaSupply204Panel [data-supply-action="max"]{min-width:calc(var(--supply-unit)*7.2);font-size:calc(var(--supply-unit)*1.4)}
#nexoriaSupply204Panel .supply204-action{position:absolute;left:57%;top:83%;width:38.2%;height:9.7%;font-size:calc(var(--supply-unit)*2.7);font-weight:700;line-height:1.1}
.supply204-status{position:absolute;left:4%;right:4%;bottom:.3%;height:2.8%;margin:0;display:flex;align-items:center;justify-content:center;text-align:center;font-size:calc(var(--supply-unit)*1.15);line-height:1.05;color:#f4e0b9;pointer-events:none}
#nexoriaSupply204Panel[data-view="forge"] .supply204-tabs button{font-size:calc(var(--supply-unit)*1.65)!important}
#nexoriaSupply204Panel[data-view="forge"] .supply204-detail{justify-content:center}
@media(orientation:portrait){#nexoriaSupply204Panel{--supply-unit:1vw}.supply204-stage{width:100vw}.supply204-title{font-size:2.4vw}}

/* NEXORIA bundle206: energy-204.css */
/* Reuses the painted blank button asset; no CSS-drawn decorative frame. */
#playerVitals205{position:relative;display:flex;align-items:center;align-self:flex-start;gap:calc(5 * var(--ui-unit,1px));width:max-content;white-space:nowrap}
#nexoriaEnergy204{position:relative;display:flex;align-items:center;gap:calc(5 * var(--ui-unit,1px));z-index:2;color:#fff1ca;pointer-events:none;font-family:Georgia,"Times New Roman",serif;font-size:calc(8 * var(--ui-unit,1px));line-height:1.15}
#nexoriaEnergy204[hidden],#nexoriaEnergy204 [hidden]{display:none!important}
.energy204-meter{position:relative;flex:none;box-sizing:border-box;width:calc(var(--hud-width,280px) * .343);height:calc(var(--hud-width,280px) * .0819);display:flex;align-items:center;justify-content:space-between;gap:3px;padding:0 7px;isolation:isolate}
.energy204-track,.energy204-fill{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:-1;pointer-events:none}
.energy204-track{filter:brightness(.38)}.energy204-fill{clip-path:inset(0 0 0 0)}
.energy204-meter span,.energy204-meter output{text-shadow:0 1px 2px #000;font-weight:700;white-space:nowrap}
.energy204-reserve{display:block;text-align:left;font-size:inherit;padding:0;text-shadow:0 1px 3px #000}
.energy204-message{position:absolute;bottom:100%;left:0;width:100%;font-size:inherit;text-align:center;text-shadow:0 1px 3px #000;white-space:normal;overflow-wrap:anywhere}
.energy204-message:empty{display:none}
#nexoriaEnergy204 .energy204-retry{display:block;pointer-events:auto;margin:3px auto 0;border:0;border-radius:0;box-shadow:none;background:transparent url('assets/ui-205/adventure-btn-empty.png') center/100% 100% no-repeat;color:#fff1cc;min-width:70px;min-height:28px;padding:5px 12px;font:700 11px Georgia,"Times New Roman",serif;cursor:pointer}
.energy204-retry{position:absolute;bottom:calc(100% + 28px);left:0}
.energy204-retry:disabled{opacity:.5}.energy204-retry:focus-visible{outline:2px solid #fff1b8;outline-offset:2px}

/* The bottom utility column begins 232 UI units from the right edge.
   On a narrow portrait viewport, finish the battery/energy row eight units
   before it. Reserve stays to the right; its full value remains in meter ARIA. */
@media (orientation: portrait) and (max-width: 480px) {
  #playerVitals205 {
    width: max(0px,calc(var(--viewport-width,100vw) - var(--safe-left,0px) - var(--safe-right,0px) - 240 * var(--ui-unit,1px)));
    gap: calc(3 * var(--ui-unit,1px));
  }
  #playerVitals205 > .battery-status { flex: 0 0 auto; }
  #playerVitals205 #nexoriaEnergy204 {
    flex: 1 1 0; width: 0; min-width: 0; gap: calc(2 * var(--ui-unit,1px));
    font-size: calc(6.5 * var(--ui-unit,1px));
  }
  #playerVitals205 .energy204-meter {
    flex: 0 0 auto; min-width: 0; width: min(calc(66 * var(--ui-unit,1px)),65%);
    height: auto; aspect-ratio: 310/74; gap: calc(1 * var(--ui-unit,1px));
    padding: 0 calc(3 * var(--ui-unit,1px));
  }
  #playerVitals205 .energy204-meter span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  #playerVitals205 .energy204-meter output { flex: 0 0 auto; }
  #playerVitals205 .energy204-reserve {
    flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; font-size: calc(7 * var(--ui-unit,1px));
  }
}

/* NEXORIA bundle206: world-supply-204.css */
/* Native painted buttons only; all world coordinates come from Map5 stalls. */
#nexoriaSupply204WorldPrompt{position:fixed;left:50%;bottom:calc(var(--safe-bottom,0px) + 12px);transform:translateX(-50%);z-index:160;display:flex;flex-direction:column;gap:3px;pointer-events:auto;touch-action:manipulation;width:clamp(176px,24vw,290px);margin:0;padding:0}
#nexoriaSupply204WorldPrompt[hidden]{display:none!important}
#nexoriaSupply204WorldPrompt button{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:310/74;border:0;border-radius:0;padding:0;background:none;box-shadow:none;color:#fff1ce;font:700 clamp(12px,1.55vw,18px) Georgia,serif;cursor:pointer;isolation:isolate}
#nexoriaSupply204WorldPrompt button img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;z-index:-1}
#nexoriaSupply204WorldPrompt button span{padding:0 10px;text-align:center;line-height:1.1;pointer-events:none}
#nexoriaSupply204WorldPrompt button:focus-visible{outline:2px solid #ffe8af;outline-offset:-4px}
#nexoriaBlacksmithPanel .nx204-forge-credit-entry{position:absolute;left:4.7%;top:79.9%;width:24.5%;height:10.6%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.2cqw;z-index:2;margin:0;padding:0;pointer-events:auto}
#nexoriaBlacksmithPanel .nx204-forge-credit-entry output{flex:none;width:100%;min-height:1.7cqw;text-align:center;font:1.25cqw/1.15 Georgia,serif;color:#f2d69f;white-space:nowrap;margin:0;padding:0;overflow:hidden}
#nexoriaBlacksmithPanel .nx204-forge-credit-entry button{position:relative;display:grid;place-items:center;flex:1;min-height:0;max-height:4.65cqw;width:100%;padding:0;border:0;border-radius:0;background:none;box-shadow:none;isolation:isolate;color:#fff0c9;font:1.5cqw/1.15 Georgia,serif;cursor:pointer}
#nexoriaBlacksmithPanel .nx204-forge-credit-entry button img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;z-index:-1}
#nexoriaBlacksmithPanel .nx204-forge-credit-entry button span{pointer-events:none}
#nexoriaBlacksmithPanel .nx204-forge-credit-entry button:disabled{opacity:.43;cursor:default}
body:has(#nexoriaSupply204Panel:not([hidden])) #blacksmithPrompt{visibility:hidden!important;pointer-events:none!important}

#nexoriaBlacksmithPanel .nx204-forge-credit-entry button::before,#nexoriaBlacksmithPanel .nx204-forge-credit-entry button::after{display:none}

/* NEXORIA bundle206: farm-entry-204.css */
/* Same existing utility button artwork and dimensions; only the white icon differs. */
#game .utility-controls > #farmButton { position:absolute; right:calc(200% + 16 * var(--ui-unit,1px)); bottom:0; }
#farmButton svg { fill:currentColor; stroke:none; }
#farmButton:disabled { opacity:.55; }

/* NEXORIA bundle206: forge-gem-205.css */
/* 1.0.105: same painted button and live label, with no rectangular fill.
   Backgrounds stay contain-scaled; hitboxes share the forge canvas coordinates. */
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel,#nx196InheritAction,#nx108ForgeAction) {
  top: 78.2%; height: 9.9%; margin: 0; padding: 0 .8cqw;
  border: 0 !important; border-image: none; border-radius: 0;
  background: transparent url('assets/ui-205/adventure-btn-empty.png') center/contain no-repeat !important;
  box-shadow: none; color: #fff0ce; font: 1.65cqw/1.1 Georgia,serif;
  display: grid; place-items: center; text-align: center;
  transform: none; isolation: isolate; overflow: visible;
}
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel) { left: 32.057416%; width: 17.5%; }
#nexoriaBlacksmithPanel :is(#nx196InheritAction,#nx108ForgeAction) { left: 50.502392%; width: 17.5%; }
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel,#nx196InheritAction,#nx108ForgeAction)::before,
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel,#nx196InheritAction,#nx108ForgeAction)::after { display: none; }
#nexoriaBlacksmithPanel :is(#nx196InheritCancel,#nx200ForgeCancel,#nx196InheritAction,#nx108ForgeAction):active:not(:disabled) { transform: none; }

/* Both gem categories have identical native art and dimensions. Selection
   brightens that single painted layer, so the highlight moves with the tab. */
.nx200-shop-gems .nx200-shop-tabs button[data-shop-tab] {
  top: 85px; width: 310px; height: 74px; margin: 0; padding: 0 16px;
  border: 0; border-image: none; border-radius: 0;
  background: transparent url('assets/ui-205/adventure-btn-empty.png') center/contain no-repeat;
  box-shadow: none; color: #f7e6c5; font: 28px/1.15 Georgia,serif;
  display: grid; place-items: center; filter: brightness(.76); transform: none;
}
.nx200-shop-gems .nx200-shop-tabs button[data-shop-tab].is-active { filter: brightness(1.22); color: #fff5d7; box-shadow: none; }
.nx200-shop-gems .nx200-shop-tabs button[data-shop-tab]:hover:not(:disabled) { filter: brightness(1.04); }
.nx200-shop-gems .nx200-shop-tabs button[data-shop-tab].is-active:hover:not(:disabled) { filter: brightness(1.3); }
.nx200-shop-gems .nx200-shop-tabs button[data-shop-tab]::before,
.nx200-shop-gems .nx200-shop-tabs button[data-shop-tab]::after { display: none; }

/* NEXORIA bundle206: ui-layout-205.css */
/* Empty explanatory footers have no visible strip. Live transaction feedback
   remains available in the existing frame without a rectangular backdrop. */
.nx200-shop-stage .nx200-shop-message:empty{display:none!important}
.nx200-shop-stage .nx200-shop-message,
.nx200-shop-stage:is(.nx200-shop-gems,.nx200-shop-potions) .nx200-shop-message{
  background:none!important;border:0!important;border-radius:0;box-shadow:none!important;
}

/* NEXORIA bundle206: ui-buttons-205.css */
/* 1.0.105 — painted controls own their visible contour.
 * Load after the screen sheets. This list intentionally excludes the combat
 * HUD, movement pad, white utility controls, text inputs and status messages.
 * State feedback changes the painted pixels, never adds a rectangular layer.
 */
:root {
  --nx205-action-art: url('assets/ui-205/adventure-btn-empty.png');
  --nx205-guild-action-art: url('assets/ui-205/guild-action-empty.png');
}

/* Complete art controls: eliminate the browser/CSS rectangle under the PNG.
 * Keep each screen's image, coordinates, font, disabled opacity and sizing. */
.nx200-shop-stage :is(.nx200-shop-tabs button, .nx200-shop-buy),
#nexoriaBlacksmithPanel :is(.nx108-forge-tabs button, #nx196InheritAction, #nx108ForgeAction, #nx196InheritCancel, #nx200ForgeCancel),
#nexoriaPawnPanel :is(.nx108-pawn-tabs button, #nx200PawnPreviewAction, #nx200PawnPreviewExit),
#nexoriaGuildPanel :is(.nx108-guild-nav > button, .nx108-guild-current-actions > button),
#nexoriaPvpPanel .nx108-pvp-actions > button,
#nx198PetModal.nx200-pet-modal :is(.nx198-pet-tabs button, .nx198-pet-shop button, .nx200-pet-skills, .nx200-egg-info, [data-pet-action='feed'], [data-pet-action='follow'], [data-pet-action='merge'], [data-pet-action='merge-reset'], [data-pet-action='open-one'], [data-pet-action='open-ten']),
.nx200-adventure :is(.nx200-adventure-tabs button, .nx200-adventure-ranks button, .nx200-adventure-info, .nx200-adventure-dungeon, .nx200-adventure-primary, .nx200-adventure-register > button),
.nx205-painted-button {
  background-color: transparent !important;
  border: 0 !important;
  border-image: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent;
}

/* Keep the full original art and baked captions, changing alpha alone. */
#nexoriaGuildPanel #nx200GuildInfoOpen { background-image: url('assets/ui-205/guild-btn-info.png') !important; }
#nexoriaGuildPanel #nx200GuildManageOpen { background-image: url('assets/ui-205/guild-btn-manage.png') !important; }
#nexoriaPvpPanel #nx200PvpRulesOpen { background-image: url('assets/ui-205/pvp-btn-rules.png') !important; }
#nexoriaPvpPanel #nx108PvpEnter { background-image: url('assets/ui-205/pvp-btn-enter.png') !important; }
#nexoriaPvpPanel #nx108PvpShopOpen { background-image: url('assets/ui-205/pvp-btn-shop.png') !important; }
#nexoriaPawnPanel #nx200PawnPreviewExit { background-image: url('assets/ui-205/pawn-btn-exit.png') !important; }
.nx200-shop-general .nx200-shop-buy { background-image: url('assets/ui-205/general-btn-buy.png') !important; }
.nx200-shop-potions .nx200-shop-buy { background-image: url('assets/ui-205/potions-btn-buy.png') !important; }
.nx200-shop-jewelry .nx200-shop-buy { background-image: url('assets/ui-205/jewelry-btn-buy.png') !important; }
.nx200-shop-general .nx200-shop-tabs [data-shop-tab='skill-book'] { background-image: url('assets/ui-205/general-tab-skill.png') !important; }
.nx200-shop-general .nx200-shop-tabs [data-shop-tab='enchant-scroll'] { background-image: url('assets/ui-205/general-tab-enchant.png') !important; }
.nx200-shop-general .nx200-shop-tabs [data-shop-tab='extraction'] { background-image: url('assets/ui-205/general-tab-unsocket.png') !important; }
.nx200-shop-jewelry .nx200-shop-tabs [data-shop-tab='all'] { background-image: url('assets/ui-205/jewelry-tab-all.png') !important; }
.nx200-shop-jewelry .nx200-shop-tabs [data-shop-tab='necklace'] { background-image: url('assets/ui-205/jewelry-tab-necklace.png') !important; }
.nx200-shop-jewelry .nx200-shop-tabs [data-shop-tab='ring'] { background-image: url('assets/ui-205/jewelry-tab-ring.png') !important; }

/* These controls have live captions: use one complete painted face instead of
 * a hollow rim laid over a colored rectangle. Sidebar icon pseudos stay. */
#nexoriaGuildPanel .nx108-guild-nav > button {
  background-image: var(--nx205-guild-action-art) !important;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  filter: brightness(.82);
}
#nexoriaGuildPanel .nx108-guild-nav > button.is-active {
  filter: brightness(1.24);
  color: #fff4d3;
}
#nexoriaPawnPanel .nx108-pawn-tabs button,
#nexoriaPawnPanel .nx108-pawn-tabs button.is-active,
#nexoriaPawnPanel #nx200PawnPreviewAction {
  background: transparent var(--nx205-action-art) center/contain no-repeat !important;
}
#nexoriaPawnPanel .nx108-pawn-tabs button::after { display: none; }
#nexoriaPawnPanel .nx108-pawn-tabs button.is-active { filter: brightness(1.24); }

.nx200-adventure-tabs button { background: transparent url('assets/ui-205/adventure-tab-inactive.png') center/contain no-repeat !important; }
.nx200-adventure-tabs button.is-active { background-image: url('assets/ui-205/adventure-tab-active.png') !important; }
.nx200-adventure-ranks button { background-image: url('assets/ui-205/adventure-rank-inactive.png') !important; }
.nx200-adventure-ranks button.is-active { background-image: url('assets/ui-205/adventure-rank-active.png') !important; }
.nx200-adventure-info { background-image: url('assets/ui-205/adventure-btn-info.png') !important; }
.nx200-adventure-dungeon,
.nx200-adventure-primary,
.nx200-adventure-register > button { background-image: var(--nx205-action-art) !important; }
.nx200-adventure-primary.is-accept { background-image: url('assets/ui-205/adventure-btn-accept.png') !important; }
.nx200-adventure-quest,
.nx200-adventure-quest.is-selected { box-shadow: none; outline: none; }
.nx200-adventure-quest.is-selected { filter: brightness(1.12); }

#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-tabs button,
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-tabs button:hover:not(:disabled) { background-image: url('assets/ui-205/pet-tab-inactive.png') !important; }
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-tabs button.is-active,
#nx198PetModal.nx200-pet-modal[data-pet-screen] .nx198-pet-tabs button.is-active:hover:not(:disabled) { background-image: url('assets/ui-205/pet-tab-active.png') !important; }
#nx198PetModal.nx200-pet-modal .nx198-pet-shop button { background-image: url('assets/ui-205/pets-btn-gold-empty.png') !important; }
#nx198PetModal.nx200-pet-modal .nx200-pet-skills,
#nx198PetModal.nx200-pet-modal .nx200-pet-skills:hover:not(:disabled) { background-image: url('assets/ui-205/pets-btn-skill.png') !important; }
#nx198PetModal.nx200-pet-modal [data-pet-action='feed'],
#nx198PetModal.nx200-pet-modal [data-pet-action='feed']:hover:not(:disabled) { background-image: url('assets/ui-205/pets-btn-feed.png') !important; }
#nx198PetModal.nx200-pet-modal [data-pet-action='merge'],
#nx198PetModal.nx200-pet-modal [data-pet-action='merge']:hover:not(:disabled) { background-image: url('assets/ui-205/pets-btn-merge.png') !important; }
#nx198PetModal.nx200-pet-modal [data-pet-action='merge-reset'],
#nx198PetModal.nx200-pet-modal [data-pet-action='merge-reset']:hover:not(:disabled) { background-image: url('assets/ui-205/pets-btn-cancel.png') !important; }
#nx198PetModal.nx200-pet-modal [data-pet-action='open-one'],
#nx198PetModal.nx200-pet-modal [data-pet-action='open-one']:hover:not(:disabled) { background-image: url('assets/ui-205/pets-btn-open-one.png') !important; }
#nx198PetModal.nx200-pet-modal [data-pet-action='open-ten'],
#nx198PetModal.nx200-pet-modal [data-pet-action='open-ten']:hover:not(:disabled) { background-image: url('assets/ui-205/pets-btn-open-ten.png') !important; }
#nx198PetModal.nx200-pet-modal .nx200-egg-info,
#nx198PetModal.nx200-pet-modal .nx200-egg-info:hover:not(:disabled) { background-image: url('assets/ui-205/pets-btn-info.png') !important; }
#nx198PetModal.nx200-pet-modal [data-pet-action='follow'],
#nx198PetModal.nx200-pet-modal [data-pet-action='follow']:hover:not(:disabled) { background-image: url('assets/ui-205/pets-btn-green-empty.png') !important; }
#nx198PetModal.nx200-pet-modal [data-pet-action='follow'][aria-pressed='false'],
#nx198PetModal.nx200-pet-modal [data-pet-action='follow'][aria-pressed='false']:hover:not(:disabled) { background-image: url('assets/ui-205/pets-btn-follow.png') !important; }

/* Variable-width quantity, keypad and dialog buttons retain their content and
 * geometry. Nine-slicing keeps the actual painted corners; the complete image
 * supplies the interior, so no colored underlay can leak outside its alpha. */
.nx200-shop-stage :is(.nx200-shop-quantity > button, .nx202-shop-keypad button),
#nx198PetModal.nx200-pet-modal .nx200-pet-filters button,
.nx108-root :is(.nx108-pagination button, .nx108-confirm-card button, .nx108-forge-item-menu button, .nx108-item-actions button),
#nexoriaGuildPanel :is(.nx108-guild-member-actions button, .nx200-guild-management button),
#nexoriaPvpPanel .nx200-pvp-rules button,
.nx200-adventure :is(.nx200-adventure-retry, .nx200-adventure-dialog button) {
  border-color: transparent !important;
  border-style: solid;
  border-radius: 0 !important;
  border-image: var(--nx205-action-art) 24 fill / 10px / 0 stretch !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent;
}

/* Forge tabs formerly drew a rectangular gradient behind a hollow rim. */
#nexoriaBlacksmithPanel .nx108-forge-tabs button,
#nexoriaBlacksmithPanel .nx108-forge-tabs button.is-active {
  background: transparent var(--nx205-action-art) center/contain no-repeat !important;
}
#nexoriaBlacksmithPanel .nx108-forge-tabs button::after { display: none !important; }
#nexoriaBlacksmithPanel .nx108-forge-tabs button.is-active { filter: brightness(1.24); }
#nx198PetModal.nx200-pet-modal .nx198-pet-close:hover:not(:disabled) { background: transparent !important; box-shadow: none !important; }

/* Keyboard focus remains visible within the artwork. Do not replace disabled
 * opacity/cursor or a screen's active/hover brightness (notably forge/gems). */
.nx200-shop-stage :is(.nx200-shop-tabs button, .nx200-shop-buy, .nx200-shop-quantity > button, .nx202-shop-keypad button):focus-visible,
#nexoriaGuildPanel :is(.nx108-guild-nav > button, .nx108-guild-current-actions > button):focus-visible,
#nexoriaPvpPanel .nx108-pvp-actions > button:focus-visible,
#nexoriaPawnPanel :is(.nx108-pawn-tabs button, #nx200PawnPreviewAction, #nx200PawnPreviewExit):focus-visible,
#nexoriaBlacksmithPanel :is(.nx108-forge-tabs button, #nx196InheritAction, #nx108ForgeAction, #nx196InheritCancel, #nx200ForgeCancel):focus-visible,
#nx198PetModal.nx200-pet-modal :is(.nx198-pet-tabs button, .nx198-pet-shop button, .nx200-pet-skills, .nx200-egg-info, [data-pet-action]):focus-visible,
.nx200-adventure :is(.nx200-adventure-tabs button, .nx200-adventure-ranks button, .nx200-adventure-info, .nx200-adventure-dungeon, .nx200-adventure-primary, .nx200-adventure-register > button, .nx200-adventure-quest):focus-visible,
.nx205-painted-button:focus-visible {
  outline: none !important;
  filter: brightness(1.4) contrast(1.08) !important;
  text-decoration: underline;
  text-underline-offset: .15em;
}

@media (forced-colors: active) {
  .nx205-painted-button:focus-visible,
  .nx200-shop-stage button:focus-visible,
  #nexoriaGuildPanel button:focus-visible,
  #nexoriaPvpPanel button:focus-visible,
  #nexoriaPawnPanel button:focus-visible,
  #nexoriaBlacksmithPanel button:focus-visible,
  #nx198PetModal.nx200-pet-modal button:focus-visible,
  .nx200-adventure button:focus-visible { outline: 2px solid Highlight !important; outline-offset: -4px; }
}

