html, body {
  margin: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #10131a;
  font-family: Arial, sans-serif;
}

#game {
  width: 100vw;
  height: 100vh;
  display: block;
}

#hud {
  position: fixed;
  left: 14px;
  top: 14px;
  min-width: 300px;
  padding: 12px;
  color: #eaf0ff;
  background: rgba(10, 14, 24, 0.74);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 14px;
  backdrop-filter: blur(8px);
  user-select: none;
}

.title {
  font-size: 20px;
  font-weight: 800;
  margin-bottom: 6px;
}

#status {
  color: #ffcf7a;
  margin-bottom: 8px;
}

.row {
  display: flex;
  gap: 6px;
}

input, button {
  border: 0;
  border-radius: 8px;
  padding: 8px 10px;
  outline: none;
}

input {
  width: 150px;
  background: rgba(255,255,255,0.12);
  color: white;
}

button {
  cursor: pointer;
  background: #ffd36a;
  color: #171717;
  font-weight: 700;
}

.hint {
  margin-top: 8px;
  opacity: 0.72;
  font-size: 13px;
}

#debug {
  margin: 8px 0 0;
  font-size: 12px;
  line-height: 1.25;
  color: #b9c6ee;
  white-space: pre-wrap;
}

.hotbar {
  position: fixed;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  display: grid;
  grid-template-columns: repeat(9, 58px);
  gap: 7px;
  padding: 9px;
  background: rgba(8, 12, 20, 0.58);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 16px;
  backdrop-filter: blur(8px);
  user-select: none;
}

.hotbar-slot,
.inventory-slot {
  position: relative;
  width: 58px;
  height: 58px;
  padding: 0;
  border-radius: 11px;
  border: 1px solid rgba(255,255,255,0.18);
  background-color: rgba(20, 27, 38, 0.74);
  background-size: 78%;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.24);
  color: #eaf0ff;
  overflow: hidden;
}

.hotbar-slot:hover,
.inventory-slot:hover {
  border-color: rgba(255, 211, 106, 0.75);
}

.hotbar-slot.selected {
  border-color: #ffd36a;
  box-shadow: 0 0 0 2px rgba(255, 211, 106, 0.40), inset 0 0 0 1px rgba(0,0,0,0.35);
  background-color: rgba(58, 45, 21, 0.78);
}

.slot-hotkey {
  position: absolute;
  left: 5px;
  top: 4px;
  font-size: 11px;
  color: rgba(255,255,255,0.62);
  text-shadow: 0 1px 2px black;
}

.slot-label {
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 4px;
  padding: 1px 3px;
  border-radius: 5px;
  background: rgba(0,0,0,0.42);
  font-size: 10px;
  text-align: center;
  color: #ffffff;
  text-shadow: 0 1px 2px black;
  pointer-events: none;
}

.slot-count {
  position: absolute;
  right: 5px;
  top: 4px;
  min-width: 16px;
  padding: 1px 4px;
  border-radius: 7px;
  background: rgba(0,0,0,0.55);
  color: #fff4b0;
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  text-shadow: 0 1px 2px black;
}

.inventory {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 452px;
  padding: 16px;
  background: rgba(9, 13, 22, 0.86);
  border: 1px solid rgba(255,255,255,0.17);
  border-radius: 18px;
  backdrop-filter: blur(10px);
  box-shadow: 0 22px 80px rgba(0,0,0,0.45);
  user-select: none;
}

.inventory.hidden {
  display: none;
}

.inventory-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  color: #eaf0ff;
  font-weight: 800;
  font-size: 18px;
}

.inventory-title span {
  padding: 3px 8px;
  border-radius: 8px;
  background: rgba(255,255,255,0.12);
  color: #ffdf84;
  font-size: 13px;
}

.inventory-grid {
  display: grid;
  grid-template-columns: repeat(6, 58px);
  gap: 8px;
}

.viewport-controls {
  position: fixed;
  right: 18px;
  bottom: 24px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px;
  background: rgba(8, 12, 20, 0.62);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 16px;
  backdrop-filter: blur(8px);
  user-select: none;
}

.viewport-controls button {
  min-width: 38px;
  height: 38px;
  padding: 0 10px;
  border-radius: 11px;
  font-size: 16px;
  line-height: 1;
}

#zoomValue {
  min-width: 52px;
  color: #ffdf84;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

.login-overlay {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at center, rgba(44, 57, 91, 0.54), rgba(5, 7, 13, 0.92));
  backdrop-filter: blur(6px);
}

.login-overlay.hidden {
  display: none;
}

.login-card {
  width: 360px;
  padding: 26px;
  border-radius: 22px;
  background: rgba(9, 13, 22, 0.88);
  border: 1px solid rgba(255,255,255,0.16);
  box-shadow: 0 28px 100px rgba(0,0,0,0.55);
  color: #eaf0ff;
  text-align: center;
}

.login-logo {
  font-size: 32px;
  line-height: 1;
  font-weight: 900;
  margin-bottom: 12px;
  color: #ffd36a;
}

.login-subtitle,
.login-note {
  color: rgba(234, 240, 255, 0.72);
  font-size: 13px;
  line-height: 1.4;
}

.login-card input {
  box-sizing: border-box;
  width: 100%;
  margin-top: 18px;
  margin-bottom: 10px;
  text-align: center;
}

.primary-login,
.secondary-login {
  box-sizing: border-box;
  display: block;
  width: 100%;
  margin-top: 10px;
  padding: 12px 14px;
  font-size: 15px;
}

.primary-login {
  background: #5865f2;
  color: white;
}

.secondary-login {
  background: rgba(255,255,255,0.12);
  color: #eaf0ff;
}

.login-note {
  margin-top: 14px;
  font-size: 12px;
  opacity: 0.78;
}

.account-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  padding: 7px 8px;
  border-radius: 10px;
  background: rgba(255,255,255,0.08);
  color: #dce6ff;
  font-size: 13px;
}

#logout {
  padding: 5px 8px;
  border-radius: 7px;
  background: rgba(255,255,255,0.14);
  color: #eaf0ff;
  font-size: 12px;
}

/* v11 main menu + skin selection */
.main-menu-card {
  width: min(520px, calc(100vw - 32px));
}

.menu-section {
  margin-top: 14px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 14px;
  background: rgba(255,255,255,0.055);
}

.menu-section-title {
  color: #ffd36a;
  font-weight: 800;
  margin-bottom: 8px;
}

.menu-account {
  color: #dfe8ff;
  font-size: 13px;
  margin-bottom: 8px;
  opacity: 0.9;
}

.menu-buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 8px;
}

.skin-selected {
  font-size: 13px;
  color: #b9c6ee;
  margin-bottom: 10px;
}

.skin-choices {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
  gap: 8px;
  max-height: 210px;
  overflow-y: auto;
  padding-right: 3px;
}

.skin-choice {
  min-height: 92px;
  padding: 8px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(11, 16, 28, 0.72);
  color: #eaf0ff;
  text-align: center;
  display: grid;
  align-content: center;
  gap: 6px;
}

.skin-choice.selected {
  border-color: #ffd36a;
  box-shadow: 0 0 0 2px rgba(255, 211, 106, 0.28), 0 0 22px rgba(255, 211, 106, 0.16);
}

.skin-thumb {
  width: 52px;
  height: 52px;
  margin: 0 auto;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 5px 5px rgba(0,0,0,0.45));
}

.skin-name {
  font-size: 12px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
}

.play-button {
  width: 100%;
  margin-top: 14px;
  padding: 13px 16px;
  border-radius: 14px;
  font-size: 18px;
  background: linear-gradient(135deg, #ffd36a, #ff9f43);
}

.play-button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
  filter: grayscale(0.35);
}

body.menu-open #hud,
body.menu-open #hotbar,
body.menu-open #inventory,
body.menu-open #viewportControls,
body.menu-open #actionDock,
body.menu-open #minimap,
body.menu-open #statsPanel {
  pointer-events: none;
  opacity: 0.35;
}

/* v12 login-state fixes + modular skin previews */
.hidden {
  display: none !important;
}

.account-ready {
  background: rgba(86, 196, 120, 0.20);
  color: #bfffd0;
  border: 1px solid rgba(86, 196, 120, 0.35);
  cursor: default;
}

.skin-choice {
  min-height: 128px;
}

.skin-preview {
  position: relative;
  width: 112px;
  height: 88px;
  margin: 0 auto;
  overflow: visible;
  pointer-events: none;
  filter: drop-shadow(0 7px 7px rgba(0,0,0,0.50));
}

.skin-preview-part {
  position: absolute;
  left: 50%;
  top: 50%;
  object-fit: contain;
  transform-origin: 50% 50%;
  image-rendering: auto;
}

.skin-preview-static {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  image-rendering: auto;
}

.skin-choice.no-preview .skin-preview::after {
  content: "нет preview";
  position: absolute;
  left: 0;
  right: 0;
  top: 32px;
  color: rgba(234,240,255,0.55);
  font-size: 11px;
}

/* v15: stats / minimap / game panels */
.stats-panel {
  position: fixed;
  right: 18px;
  top: 218px;
  width: 340px;
  max-height: 52vh;
  padding: 12px;
  color: #eaf0ff;
  background: rgba(8, 12, 20, 0.78);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 16px;
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 60px rgba(0,0,0,0.35);
  user-select: none;
  z-index: 20;
  overflow: auto;
}

.stats-panel.hidden,
.game-panel.hidden,
.settings-panel.hidden,
.full-map-overlay.hidden {
  display: none;
}

.compact-title {
  margin-bottom: 8px;
}

.minimap {
  position: fixed;
  right: 18px;
  top: 18px;
  width: 188px;
  padding: 10px;
  color: #eaf0ff;
  background: rgba(8, 12, 20, 0.65);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 16px;
  backdrop-filter: blur(8px);
  box-shadow: 0 16px 50px rgba(0,0,0,0.30);
  user-select: none;
  z-index: 18;
}

.minimap-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 800;
  color: #ffdc7a;
}

.minimap-title span,
.inventory-title span {
  padding: 2px 7px;
  border-radius: 7px;
  background: rgba(255,255,255,0.12);
  color: #ffdf84;
  font-size: 12px;
}

#minimapCanvas {
  width: 168px;
  height: 168px;
  display: block;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.12);
}

.game-panel,
.settings-panel {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(760px, calc(100vw - 40px));
  max-height: min(680px, calc(100vh - 110px));
  padding: 16px;
  background: rgba(9, 13, 22, 0.90);
  border: 1px solid rgba(255,255,255,0.17);
  border-radius: 18px;
  backdrop-filter: blur(10px);
  box-shadow: 0 22px 80px rgba(0,0,0,0.45);
  user-select: none;
  z-index: 30;
  color: #eaf0ff;
  overflow: auto;
}

/* old inventory width override */
.inventory.game-panel {
  width: 452px;
}

.catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}

.catalog-card {
  display: flex;
  gap: 10px;
  min-height: 72px;
  padding: 10px;
  text-align: left;
  color: #eaf0ff;
  background: rgba(24, 31, 44, 0.84);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 13px;
}

.catalog-card:hover {
  border-color: rgba(255, 211, 106, 0.72);
  background: rgba(42, 46, 58, 0.88);
}

.catalog-icon {
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  border-radius: 11px;
  background: rgba(255,255,255,0.08);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid rgba(255,255,255,0.12);
}

.catalog-body {
  min-width: 0;
}

.catalog-title {
  font-size: 13px;
  font-weight: 900;
  color: #ffdc7a;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.catalog-meta,
.catalog-price,
.catalog-empty {
  margin-top: 5px;
  font-size: 12px;
  color: #b9c6ee;
  line-height: 1.3;
}

.catalog-price {
  color: #d9f2c0;
}

.action-dock {
  position: fixed;
  left: 18px;
  bottom: 24px;
  display: flex;
  gap: 8px;
  padding: 8px;
  background: rgba(8, 12, 20, 0.62);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 16px;
  backdrop-filter: blur(8px);
  user-select: none;
  z-index: 19;
}

.dock-button {
  position: relative;
  width: 48px;
  height: 48px;
  padding: 7px;
  background: rgba(25, 33, 46, 0.88);
  border: 1px solid rgba(255,255,255,0.16);
  color: #ffdf84;
  border-radius: 12px;
}

.dock-button.active,
.dock-button:hover {
  border-color: #ffd36a;
  background: rgba(58, 45, 21, 0.90);
}

.dock-button img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.dock-button span {
  position: absolute;
  right: 3px;
  bottom: 2px;
  min-width: 16px;
  padding: 1px 4px;
  border-radius: 6px;
  background: rgba(0,0,0,0.55);
  color: #fff4b0;
  font-size: 10px;
  font-weight: 900;
}

.text-dock {
  font-size: 22px;
  line-height: 1;
}

.setting-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border-radius: 12px;
  background: rgba(255,255,255,0.08);
  margin-bottom: 12px;
}

.setting-row input {
  width: 18px;
  height: 18px;
}

.wide-button {
  width: 100%;
}

.full-map-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.42);
  backdrop-filter: blur(5px);
  z-index: 60;
}

.full-map-card {
  width: min(650px, calc(100vw - 60px));
  padding: 16px;
  background: rgba(9, 13, 22, 0.94);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 20px;
  box-shadow: 0 24px 90px rgba(0,0,0,0.55);
  color: #eaf0ff;
}

#fullMapCanvas {
  width: min(560px, calc(100vw - 110px));
  height: min(560px, calc(100vh - 190px));
  display: block;
  margin: 0 auto 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.14);
}

@media (max-width: 900px) {
  .minimap { width: 150px; }
  #minimapCanvas { width: 130px; height: 130px; }
  .stats-panel { width: 300px; top: 180px; }
  .hotbar { bottom: 86px; }
}

/* v16: upgraded inventory + right-side crafting */
.panel-close {
  width: 42px;
  height: 42px;
  padding: 0;
  border-radius: 10px;
  background: linear-gradient(180deg, #53a6cf, #3188b7);
  color: #dff6ff;
  font-size: 28px;
  line-height: 1;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.16);
}
.panel-close:hover {
  background: linear-gradient(180deg, #66b5dc, #3b95c5);
}
.floating-close {
  position: absolute;
  right: 14px;
  top: 14px;
  z-index: 3;
}
.panel-tabs {
  position: absolute;
  left: 14px;
  top: -22px;
  display: flex;
  gap: 8px;
  z-index: 2;
}
.panel-tab {
  width: 48px;
  height: 44px;
  padding: 8px;
  border-radius: 14px 14px 0 0;
  background: rgba(95, 72, 124, 0.88);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 10px 24px rgba(0,0,0,0.20);
}
.panel-tab.active {
  background: rgba(128, 101, 164, 0.96);
}
.panel-tab img,
.craft-tab img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.inventory.game-panel.modern-panel {
  width: 560px;
  padding: 0;
  overflow: visible;
  background: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
}
.inventory-shell {
  padding: 18px 22px 22px;
  border-radius: 18px;
  background: linear-gradient(180deg, #0d688d 0%, #095776 100%);
  border: 4px solid #084e6b;
  box-shadow: 0 18px 70px rgba(0,0,0,0.42), inset 0 2px 0 rgba(255,255,255,0.10);
}
.inventory-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.large-title {
  margin: 0;
  color: #edf8ff;
  font-size: 28px;
  font-weight: 900;
  text-shadow: 0 2px 0 rgba(0,0,0,0.20);
}
.inventory-grid.fancy-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
}
.inventory-grid.fancy-grid .inventory-slot {
  width: 64px;
  height: 64px;
  border: none;
  border-radius: 12px;
  background-color: rgba(145, 207, 226, 0.38);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 1px 0 rgba(0,0,0,0.10);
}
.inventory-grid.fancy-grid .inventory-slot:hover {
  box-shadow: 0 0 0 2px rgba(255,255,255,0.12), inset 0 1px 0 rgba(255,255,255,0.18);
}
.inventory-grid.fancy-grid .slot-hotkey {
  display: none;
}
.inventory-grid.fancy-grid .slot-label {
  left: 5px;
  right: 5px;
  bottom: 5px;
  background: rgba(0,0,0,0.28);
}
.inventory-grid.fancy-grid .slot-count {
  background: rgba(255,255,255,0.16);
  color: #fff8cf;
}

.craft-panel.game-panel {
  left: auto;
  top: 74px;
  right: 18px;
  transform: none;
  width: min(660px, calc(100vw - 42px));
  height: min(540px, calc(100vh - 120px));
  padding: 12px;
  overflow: hidden;
  background: linear-gradient(180deg, #0c6f96 0%, #085877 100%);
  border: 4px solid #06465f;
  box-shadow: 0 22px 90px rgba(0,0,0,0.50);
}
.craft-top-tabs {
  display: flex;
  gap: 8px;
  padding-right: 56px;
  margin-bottom: 10px;
}
.craft-tab {
  width: 52px;
  height: 52px;
  padding: 10px;
  border-radius: 12px;
  background: rgba(6, 26, 37, 0.55);
  border: 1px solid rgba(255,255,255,0.12);
}
.craft-tab.active {
  background: rgba(96, 75, 124, 0.88);
  border-color: rgba(255,255,255,0.18);
}
.craft-shell {
  display: grid;
  grid-template-columns: 286px 1fr;
  gap: 0;
  height: calc(100% - 64px);
  overflow: hidden;
  border-radius: 14px;
  background: rgba(7, 33, 45, 0.18);
  border: 1px solid rgba(255,255,255,0.08);
}
.craft-list-wrap {
  min-width: 0;
  display: flex;
  flex-direction: column;
  border-right: 4px solid rgba(4, 43, 59, 0.80);
  background: rgba(0,0,0,0.12);
}
.craft-list-title {
  padding: 12px 14px 8px;
  color: #dff7ff;
  font-size: 18px;
  font-weight: 900;
}
.craft-list {
  overflow-y: auto;
  padding: 0 6px 10px 10px;
}
.craft-list-item {
  width: 100%;
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 10px;
  align-items: center;
  margin-bottom: 6px;
  padding: 10px 10px;
  border-radius: 12px;
  background: rgba(196, 202, 217, 0.88);
  color: #233744;
  border: 2px solid rgba(8, 57, 77, 0.35);
  text-align: left;
}
.craft-list-item.selected {
  background: rgba(228, 232, 243, 0.98);
  border-color: #2f8fc1;
  box-shadow: inset 4px 0 0 #44b2f0;
}
.craft-list-icon {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  background: rgba(255,255,255,0.45);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  border: 1px solid rgba(8,57,77,0.18);
}
.craft-list-name {
  font-weight: 900;
  font-size: 13px;
  color: #4b5057;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.craft-list-meta {
  margin-top: 4px;
  font-size: 11px;
  text-transform: capitalize;
  color: #5f7682;
}
.craft-detail {
  padding: 18px;
  overflow: auto;
  color: #eaf6ff;
}
.craft-detail-empty {
  display: grid;
  place-items: center;
  height: 100%;
  color: rgba(255,255,255,0.68);
  font-size: 18px;
}
.craft-detail-card {
  min-height: 100%;
}
.craft-detail-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}
.craft-detail-title {
  color: #f2fbff;
  font-size: 22px;
  font-weight: 900;
}
.craft-detail-stars {
  margin-top: 6px;
  color: #ffd24d;
  letter-spacing: 2px;
  font-size: 18px;
}
.craft-detail-desc {
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.45;
  color: #ddf4ff;
}
.craft-recipe-box {
  margin-top: 18px;
  padding: 16px;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(0, 89, 122, 0.60), rgba(0, 64, 89, 0.72));
  display: grid;
  grid-template-columns: 1fr 160px;
  gap: 12px;
  align-items: center;
}
.craft-ingredients {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.craft-ingredient {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  align-items: center;
}
.craft-ingredient-icon {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: rgba(255,255,255,0.12);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  border: 1px solid rgba(255,255,255,0.10);
}
.craft-ingredient-text {
  color: #ffe6dd;
  font-size: 16px;
  font-weight: 800;
}
.craft-preview-icon {
  width: 100%;
  height: 140px;
  border-radius: 14px;
  background: radial-gradient(circle at center, rgba(20, 225, 211, 0.20), rgba(0,0,0,0.0) 70%);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 10px 12px rgba(0,0,0,0.38));
}
.craft-create-button {
  display: block;
  width: 220px;
  max-width: 100%;
  margin: 20px auto 0;
  padding: 16px 18px;
  border-radius: 16px;
  background: linear-gradient(180deg, #9b1420 0%, #6f0e17 100%);
  color: #fff3f5;
  font-size: 18px;
  font-weight: 900;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.14), 0 8px 18px rgba(0,0,0,0.26);
}
.craft-create-button:hover {
  background: linear-gradient(180deg, #b51927 0%, #82111c 100%);
}

@media (max-width: 980px) {
  .craft-panel.game-panel {
    left: 50%;
    right: auto;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(680px, calc(100vw - 28px));
    height: min(620px, calc(100vh - 60px));
  }
  .craft-shell {
    grid-template-columns: 1fr;
    height: calc(100% - 64px);
  }
  .craft-list-wrap {
    border-right: none;
    border-bottom: 4px solid rgba(4, 43, 59, 0.80);
    max-height: 220px;
  }
}
@media (max-width: 700px) {
  .inventory.game-panel.modern-panel { width: min(560px, calc(100vw - 20px)); }
  .inventory-shell { padding: 16px; }
  .inventory-grid.fancy-grid { grid-template-columns: repeat(5, 1fr); }
  .inventory-grid.fancy-grid .inventory-slot { width: 100%; aspect-ratio: 1; height: auto; }
  .large-title { font-size: 24px; }
  .craft-recipe-box { grid-template-columns: 1fr; }
}

/* v17: craft categories on the left + inventory item moving */
.craft-panel.game-panel {
  left: 18px;
  right: auto;
  top: 74px;
  transform: none;
}
.craft-category-tabs {
  display: flex;
  gap: 8px;
  padding-right: 56px;
  margin-bottom: 10px;
  overflow-x: auto;
  scrollbar-width: thin;
}
.craft-category-tab {
  min-width: 74px;
  height: 56px;
  padding: 7px 8px;
  display: grid;
  grid-template-rows: 28px 1fr;
  align-items: center;
  justify-items: center;
  border-radius: 12px;
  background: rgba(6, 26, 37, 0.55);
  border: 1px solid rgba(255,255,255,0.12);
  color: #dbcfa6;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.2px;
}
.craft-category-tab.active,
.craft-category-tab:hover {
  background: rgba(96, 75, 124, 0.90);
  border-color: rgba(255, 211, 106, 0.58);
  color: #fff1bb;
}
.craft-category-icon {
  width: 28px;
  height: 28px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 2px 2px rgba(0,0,0,0.35));
}
.inventory-grid.fancy-grid .inventory-slot {
  cursor: grab;
}
.inventory-grid.fancy-grid .inventory-slot:active {
  cursor: grabbing;
}
.inventory-grid.fancy-grid .inventory-slot.picked {
  outline: 3px solid rgba(255, 211, 106, 0.95);
  box-shadow: 0 0 0 5px rgba(255, 211, 106, 0.22), inset 0 1px 0 rgba(255,255,255,0.18);
  transform: translateY(-1px);
}
.inventory-grid.fancy-grid .inventory-slot[draggable="true"] {
  user-select: none;
}

@media (max-width: 980px) {
  .craft-panel.game-panel {
    left: 50%;
    right: auto;
    top: 50%;
    transform: translate(-50%, -50%);
  }
}


/* v31 chat */
.chat-box {
  position: fixed;
  left: 16px;
  bottom: 102px;
  width: 430px;
  max-width: calc(100vw - 32px);
  pointer-events: none;
  z-index: 18;
}

.chat-messages {
  display: flex;
  flex-direction: column;
  gap: 5px;
  max-height: 190px;
  overflow: hidden;
  margin-bottom: 8px;
}

.chat-line {
  width: fit-content;
  max-width: 100%;
  padding: 6px 9px;
  border-radius: 10px;
  background: rgba(8, 12, 20, 0.68);
  border: 1px solid rgba(255,255,255,0.10);
  color: #eaf0ff;
  font-size: 13px;
  line-height: 1.25;
  text-shadow: 0 1px 2px rgba(0,0,0,0.65);
  backdrop-filter: blur(5px);
}

.chat-name {
  color: #ffd36a;
  font-weight: 800;
  margin-right: 5px;
}

.chat-input {
  pointer-events: auto;
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(8, 12, 20, 0.86);
  border: 1px solid rgba(255, 211, 106, 0.50);
  color: #fff;
  box-shadow: 0 10px 28px rgba(0,0,0,0.32);
}

.chat-input.hidden {
  display: none;
}


.pickup-hint {
  position: fixed;
  transform: translate(-50%, -100%);
  z-index: 22;
  padding: 0;
  border-radius: 0;
  background: transparent;
  border: 0;
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.2px;
  text-shadow: 0 2px 3px rgba(0,0,0,0.95), 0 0 6px rgba(0,0,0,0.55);
  pointer-events: none;
  user-select: none;
  white-space: nowrap;
  box-shadow: none;
}

.pickup-hint.hidden {
  display: none;
}


.item-toast-box {
  position: fixed;
  right: 22px;
  bottom: 92px;
  z-index: 24;
  display: flex;
  flex-direction: column-reverse;
  gap: 8px;
  pointer-events: none;
  user-select: none;
}

.item-toast {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 150px;
  max-width: 230px;
  padding: 8px 11px;
  border-radius: 12px;
  background: rgba(8, 12, 20, 0.82);
  border: 1px solid rgba(255, 211, 106, 0.38);
  color: #fff4c8;
  box-shadow: 0 10px 26px rgba(0,0,0,0.28);
  backdrop-filter: blur(7px);
  animation: itemToastIn 140ms ease-out;
}

.item-toast-icon {
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  border-radius: 8px;
  background-color: rgba(255,255,255,0.10);
  background-size: 82%;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
}

.item-toast-label {
  font-size: 13px;
  font-weight: 850;
  text-shadow: 0 1px 2px rgba(0,0,0,0.8);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cursor-item {
  position: fixed;
  z-index: 100;
  width: 58px;
  height: 58px;
  transform: translate(0, 0);
  pointer-events: none;
  border-radius: 11px;
  border: 1px solid rgba(255, 211, 106, 0.82);
  background-color: rgba(20, 27, 38, 0.86);
  background-size: 78%;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35), inset 0 0 0 1px rgba(0,0,0,0.24);
  color: #eaf0ff;
  overflow: hidden;
}

.cursor-item.hidden {
  display: none;
}

@keyframes itemToastIn {
  from { opacity: 0; transform: translateX(12px); }
  to { opacity: 1; transform: translateX(0); }
}


/* v40 craft from craft.json + scroll */
.craft-panel.game-panel {
  overflow: hidden;
}

.craft-category-tabs {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  flex-wrap: nowrap;
  scrollbar-width: thin;
  overscroll-behavior: contain;
  padding-bottom: 4px;
}

.craft-category-tab {
  flex: 0 0 auto;
  min-width: 92px;
}

.craft-shell {
  min-height: 0;
}

.craft-list-wrap {
  min-height: 0;
}

.craft-list {
  flex: 1 1 auto;
  min-height: 0;
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  padding-bottom: 16px;
}

.craft-list::-webkit-scrollbar,
.craft-detail::-webkit-scrollbar,
.craft-category-tabs::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.craft-list::-webkit-scrollbar-thumb,
.craft-detail::-webkit-scrollbar-thumb,
.craft-category-tabs::-webkit-scrollbar-thumb {
  background: rgba(255, 211, 106, 0.42);
  border-radius: 999px;
}

.craft-list::-webkit-scrollbar-track,
.craft-detail::-webkit-scrollbar-track,
.craft-category-tabs::-webkit-scrollbar-track {
  background: rgba(0,0,0,0.16);
  border-radius: 999px;
}

.craft-detail {
  min-height: 0;
  max-height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
}


/* v41 clans + trade */
.social-buttons {
  position: fixed;
  right: 18px;
  top: 96px;
  z-index: 23;
  display: flex;
  flex-direction: column;
  gap: 7px;
  pointer-events: auto;
  user-select: none;
}

.social-buttons button {
  min-width: 92px;
  padding: 9px 11px;
  border-radius: 12px;
  background: rgba(255, 211, 106, 0.92);
  box-shadow: 0 8px 24px rgba(0,0,0,0.22);
}

.social-panel {
  position: fixed;
  right: 18px;
  top: 186px;
  width: min(420px, calc(100vw - 36px));
  max-height: min(660px, calc(100vh - 220px));
  z-index: 35;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(8, 12, 20, 0.88);
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 24px 90px rgba(0,0,0,0.48);
  backdrop-filter: blur(10px);
  color: #eaf0ff;
  overflow: hidden;
}

.social-panel.hidden {
  display: none;
}

.social-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.social-title {
  font-size: 20px;
  font-weight: 900;
  color: #ffdf84;
}

.social-close {
  width: 34px;
  height: 34px;
  padding: 0;
  border-radius: 10px;
  font-size: 22px;
  line-height: 1;
  background: rgba(255,255,255,0.12);
  color: #fff;
}

.social-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.social-tabs button {
  background: rgba(255,255,255,0.10);
  color: #eaf0ff;
}

.social-tabs button.active {
  background: #ffd36a;
  color: #151515;
}

.social-body {
  overflow-y: auto;
  padding-right: 4px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overscroll-behavior: contain;
}

.social-card {
  padding: 12px;
  border-radius: 14px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.10);
}

.social-label {
  color: #ffdf84;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  margin-bottom: 8px;
}

.social-big {
  font-size: 22px;
  font-weight: 900;
  margin-bottom: 6px;
}

.social-muted {
  color: rgba(234,240,255,0.68);
  font-size: 13px;
  line-height: 1.35;
}

.social-form {
  display: grid;
  gap: 8px;
}

.social-form input {
  box-sizing: border-box;
  width: 100%;
}

.social-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 0;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.social-row:first-of-type {
  border-top: 0;
}

.social-row span {
  color: rgba(234,240,255,0.62);
  font-size: 12px;
}

.trade-row button {
  padding: 7px 9px;
  border-radius: 10px;
}

.trade-offers {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.social-subtitle {
  margin-bottom: 6px;
  color: #dff7ff;
  font-weight: 900;
}

.trade-stack-list {
  min-height: 74px;
  padding: 8px;
  border-radius: 12px;
  background: rgba(0,0,0,0.20);
  border: 1px solid rgba(255,255,255,0.08);
}

.trade-stack {
  margin-bottom: 5px;
  padding: 5px 7px;
  border-radius: 8px;
  background: rgba(255,255,255,0.10);
  color: #fff4c8;
  font-size: 13px;
  font-weight: 800;
}

.social-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.social-actions button {
  min-height: 38px;
}

.social-actions button.danger {
  background: #b51927;
  color: #fff;
}


/* v42 dock-integrated clan/trade buttons */
.social-buttons {
  display: none !important;
}

#clanButton img,
#tradeButton img {
  object-fit: contain;
}

/* Panel still opens as normal content, but buttons now live in actionDock. */
.social-panel {
  top: 140px;
}


/* v44 player nameplates */
.player-overlay {
  position: fixed;
  inset: 0;
  z-index: 17;
  pointer-events: none;
  user-select: none;
}

.player-nameplate {
  position: fixed;
  width: 122px;
  transform: translate(-50%, -100%);
  text-align: center;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,0.72));
}

.player-name {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 150px;
  margin: 0 auto 3px;
  padding: 2px 7px;
  border-radius: 9px;
  background: rgba(8, 12, 20, 0.58);
  color: #58d7ff;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 0 1px 2px rgba(0,0,0,0.88);
  border: 1px solid rgba(88, 215, 255, 0.22);
}

.player-nameplate.me .player-name {
  color: #8feeff;
  border-color: rgba(143, 238, 255, 0.42);
}

.player-clan {
  margin-right: 4px;
  color: #ffd36a;
}

.player-bar {
  position: relative;
  width: 86px;
  height: 6px;
  margin: 2px auto;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(0,0,0,0.58);
  border: 1px solid rgba(255,255,255,0.18);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.55);
}

.player-bar span {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  border-radius: inherit;
}

.player-bar.hp span {
  background: linear-gradient(90deg, #22d35f, #b8ff68);
}

.player-bar.exp {
  width: 62px;
  height: 5px;
  margin: 0;
}

.player-bar.exp span {
  background: linear-gradient(90deg, #40a7ff, #9b6dff);
}

.player-exp-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.player-level {
  min-width: 26px;
  color: #d7efff;
  font-size: 9px;
  font-weight: 900;
  text-shadow: 0 1px 2px rgba(0,0,0,0.88);
}

body.menu-open #playerOverlay { display: none; }


/* v45 level HUD above active slots */
.level-hud {
  position: fixed;
  left: 50%;
  bottom: 106px;
  transform: translateX(-50%);
  z-index: 20;
  width: 330px;
  padding: 8px 10px 10px;
  border-radius: 14px;
  background: rgba(8, 12, 20, 0.68);
  border: 1px solid rgba(120, 255, 130, 0.30);
  box-shadow: 0 10px 32px rgba(0,0,0,0.28);
  backdrop-filter: blur(8px);
  pointer-events: none;
  user-select: none;
}

.level-hud.hidden {
  display: none;
}

.level-hud-title {
  margin-bottom: 5px;
  color: #89ff91;
  font-size: 13px;
  font-weight: 950;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0,0,0,0.86);
}

.level-hud-exp {
  position: relative;
  width: 100%;
  height: 20px;
  overflow: hidden;
  border-radius: 8px;
  background: rgba(0,0,0,0.58);
  border: 1px solid rgba(255,255,255,0.18);
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.48);
}

.level-hud-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #1fbf5b, #8cff6a, #d6ff78);
  box-shadow: 0 0 18px rgba(100,255,120,0.38);
}

.level-hud-text {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #ffffff;
  font-size: 12px;
  font-weight: 950;
  text-shadow: 0 1px 3px rgba(0,0,0,0.9);
}

body.menu-open #levelHud {
  display: none;
}


/* v46 nameplate clean + green XP */
.player-name {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

.player-nameplate.me .player-name {
  border-color: transparent !important;
}


/* v47 craft-style tabs for shop/build/clan/trade */
.catalog-panel.game-panel,
.craft-social-panel.social-panel {
  left: auto;
  top: 74px;
  right: 18px;
  transform: none;
  width: min(660px, calc(100vw - 42px));
  height: min(540px, calc(100vh - 120px));
  max-height: min(540px, calc(100vh - 120px));
  padding: 12px;
  overflow: hidden;
  background: linear-gradient(180deg, #0c6f96 0%, #085877 100%);
  border: 4px solid #06465f;
  border-radius: 18px;
  box-shadow: 0 22px 90px rgba(0,0,0,0.50);
  color: #eaf6ff;
  backdrop-filter: none;
}

.catalog-panel .simple-catalog-tabs {
  margin-bottom: 10px;
}

.catalog-panel .single-catalog-shell {
  display: block;
  height: calc(100% - 64px);
}

.catalog-panel .craft-list-wrap {
  height: 100%;
  border-right: 0;
}

.catalog-panel .catalog-grid {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0 6px 10px 10px;
}

.catalog-panel .catalog-card {
  width: 100%;
  min-height: 62px;
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 10px;
  align-items: center;
  margin-bottom: 6px;
  padding: 10px;
  border-radius: 12px;
  background: rgba(196, 202, 217, 0.88);
  color: #233744;
  border: 2px solid rgba(8, 57, 77, 0.35);
  text-align: left;
}

.catalog-panel .catalog-card:hover {
  background: rgba(228, 232, 243, 0.98);
  border-color: #2f8fc1;
  box-shadow: inset 4px 0 0 #44b2f0;
}

.catalog-panel .catalog-icon {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  background-color: rgba(255,255,255,0.45);
  border: 1px solid rgba(8,57,77,0.18);
}

.catalog-panel .catalog-title {
  color: #4b5057;
  font-weight: 900;
}

.catalog-panel .catalog-meta {
  color: #5f7682;
}

.catalog-panel .catalog-price {
  color: #236c47;
  font-weight: 900;
}

.craft-social-panel .social-head {
  height: 54px;
  margin-bottom: 10px;
  padding-right: 44px;
}

.craft-social-panel .social-title {
  min-width: 120px;
  min-height: 52px;
  display: inline-grid;
  place-items: center;
  padding: 0 16px;
  border-radius: 12px;
  background: rgba(96, 75, 124, 0.88);
  border: 1px solid rgba(255,255,255,0.18);
  color: #f2fbff;
  font-size: 18px;
}

.craft-social-panel .social-close {
  position: absolute;
  right: 12px;
  top: 12px;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(6, 26, 37, 0.55);
  border: 1px solid rgba(255,255,255,0.12);
  color: #dff7ff;
}

.craft-social-panel .social-body {
  height: calc(100% - 64px);
  overflow-y: auto;
  padding: 12px;
  border-radius: 14px;
  background: rgba(7, 33, 45, 0.18);
  border: 1px solid rgba(255,255,255,0.08);
}

.craft-social-panel .social-card {
  background: rgba(196, 202, 217, 0.88);
  color: #233744;
  border: 2px solid rgba(8, 57, 77, 0.35);
  border-radius: 12px;
}

.craft-social-panel .social-label {
  color: #06465f;
}

.craft-social-panel .social-big,
.craft-social-panel .social-subtitle,
.craft-social-panel .trade-stack {
  color: #233744;
}

.craft-social-panel .social-muted,
.craft-social-panel .social-row span {
  color: #526a75;
}

.craft-social-panel input {
  background: rgba(255,255,255,0.72);
  color: #233744;
  border: 2px solid rgba(8, 57, 77, 0.28);
}

.craft-social-panel .trade-stack-list {
  background: rgba(7, 33, 45, 0.12);
  border: 1px solid rgba(8, 57, 77, 0.22);
}

.craft-social-panel .trade-stack {
  background: rgba(255,255,255,0.40);
}


/* v50 admin panel */
.admin-panel {
  position: fixed;
  right: 18px;
  top: 132px;
  width: min(720px, calc(100vw - 36px));
  max-height: min(720px, calc(100vh - 170px));
  z-index: 36;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  border-radius: 20px;
  background: rgba(8, 12, 20, 0.90);
  border: 1px solid rgba(255, 211, 106, 0.24);
  box-shadow: 0 26px 95px rgba(0,0,0,0.52);
  backdrop-filter: blur(12px);
  color: #eaf0ff;
  overflow: hidden;
}

.admin-panel.hidden {
  display: none;
}

.admin-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.admin-title {
  font-size: 20px;
  font-weight: 950;
  color: #ffd36a;
  text-shadow: 0 1px 2px rgba(0,0,0,0.7);
}

.admin-crown {
  color: #ffef9e;
  margin-right: 5px;
}

.admin-tabs {
  flex: 0 0 auto;
}

.admin-body {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
}

.admin-help,
.admin-target {
  color: rgba(234,240,255,0.70);
  font-size: 13px;
}

.admin-list,
.admin-item-list {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  display: grid;
  gap: 8px;
  padding-right: 4px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

.admin-row,
.admin-item-row {
  width: 100%;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 14px;
  background: rgba(255,255,255,0.08);
  color: #eaf0ff;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  text-align: left;
}

.admin-row:hover,
.admin-item-row:hover,
.admin-row.selected,
.admin-item-row.selected {
  background: rgba(255, 211, 106, 0.18);
  border-color: rgba(255, 211, 106, 0.45);
}

.admin-row-main {
  display: grid;
  gap: 3px;
}

.admin-row-main span,
.admin-item-label span {
  color: rgba(234,240,255,0.62);
  font-size: 12px;
}

.admin-row-side {
  color: #ffd36a;
  font-size: 20px;
}

.admin-tools {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
}

.admin-tools input {
  width: 100%;
  box-sizing: border-box;
}

.admin-item-list {
  grid-template-columns: repeat(auto-fill, minmax(185px, 1fr));
}

.admin-item-row {
  min-height: 62px;
  justify-content: flex-start;
}

.admin-item-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  border-radius: 12px;
  background-color: rgba(255,255,255,0.10);
  background-size: 82%;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
}

.admin-item-label {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.admin-item-label b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-give-controls {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: 1fr 110px 120px;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border-radius: 16px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.10);
}

.admin-selected-item {
  color: #fff4c8;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-give-controls input {
  width: 100%;
  box-sizing: border-box;
}

.admin-give-controls button {
  height: 38px;
  border-radius: 12px;
  background: linear-gradient(135deg, #ffd36a, #ff9f43);
  font-weight: 950;
}

#adminButton.hidden {
  display: none !important;
}

body.menu-open #adminPanel {
  display: none;
}


/* v51 admin panel polish */
.admin-panel {
  right: 50%;
  top: 88px;
  transform: translateX(50%);
  width: min(900px, calc(100vw - 34px));
  max-height: min(760px, calc(100vh - 132px));
  padding: 16px;
  border-radius: 24px;
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 211, 106, 0.16), transparent 32%),
    radial-gradient(circle at 95% 18%, rgba(88, 215, 255, 0.12), transparent 34%),
    rgba(7, 11, 19, 0.92);
  border: 1px solid rgba(255, 211, 106, 0.32);
}

.admin-head {
  padding: 4px 2px 2px;
}

.admin-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-title b {
  display: block;
  font-size: 22px;
  line-height: 1.05;
}

.admin-title small {
  display: block;
  margin-top: 3px;
  color: rgba(234,240,255,0.60);
  font-size: 12px;
  font-weight: 800;
}

.admin-crown {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(255,211,106,0.28), rgba(255,159,67,0.12));
  box-shadow: inset 0 0 0 1px rgba(255, 211, 106, 0.22), 0 10px 25px rgba(0,0,0,0.25);
}

.admin-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  overflow: visible;
}

.admin-tabs .craft-category-tab {
  min-height: 46px;
  justify-content: center;
  font-size: 14px;
}

.admin-body {
  gap: 12px;
}

.admin-tools {
  grid-template-columns: minmax(240px, 1fr) 220px;
  gap: 12px;
}

.admin-search-wrap,
.admin-target,
.admin-amount-box,
.admin-selected-item {
  border-radius: 16px;
  background: rgba(255,255,255,0.075);
  border: 1px solid rgba(255,255,255,0.10);
}

.admin-search-wrap {
  display: grid;
  gap: 5px;
  padding: 9px 12px;
}

.admin-search-wrap span,
.admin-target span,
.admin-amount-box span,
.admin-selected-item span {
  color: rgba(255, 211, 106, 0.80);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.admin-search-wrap input {
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  outline: none;
}

.admin-target {
  padding: 9px 12px;
  color: #fff;
  display: grid;
  gap: 4px;
  text-align: left;
}

.admin-target b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-item-list,
.admin-list {
  padding: 8px;
  border-radius: 18px;
  background: rgba(0,0,0,0.18);
  border: 1px solid rgba(255,255,255,0.08);
  scrollbar-width: thin;
  overscroll-behavior: contain;
  scroll-behavior: auto;
}

.admin-item-list::-webkit-scrollbar,
.admin-list::-webkit-scrollbar {
  width: 9px;
}

.admin-item-list::-webkit-scrollbar-thumb,
.admin-list::-webkit-scrollbar-thumb {
  background: rgba(255, 211, 106, 0.42);
  border-radius: 999px;
}

.admin-item-list::-webkit-scrollbar-track,
.admin-list::-webkit-scrollbar-track {
  background: rgba(0,0,0,0.20);
  border-radius: 999px;
}

.admin-item-row {
  min-height: 68px;
  padding: 10px;
  background: rgba(255,255,255,0.070);
  transition: transform 80ms ease, border-color 120ms ease, background 120ms ease;
}

.admin-item-row:hover {
  transform: translateY(-1px);
}

.admin-item-row.selected {
  background: linear-gradient(135deg, rgba(255,211,106,0.22), rgba(88,215,255,0.10));
  border-color: rgba(255, 211, 106, 0.62);
}

.admin-item-row.hidden {
  display: none !important;
}

.admin-item-icon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background-color: rgba(0,0,0,0.20);
}

.admin-item-label b {
  color: #fff7d6;
}

.admin-give-controls {
  grid-template-columns: minmax(180px, 1fr) 250px 132px;
  gap: 12px;
  padding: 12px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(255,211,106,0.12), rgba(255,255,255,0.065));
  border-color: rgba(255, 211, 106, 0.22);
  box-shadow: 0 -10px 32px rgba(0,0,0,0.18);
}

.admin-selected-item {
  padding: 10px 12px;
  display: grid;
  gap: 4px;
}

.admin-selected-item b {
  color: #fff4c8;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-selected-item em {
  color: #8cff6a;
  font-size: 12px;
  font-style: normal;
}

.admin-amount-box {
  padding: 8px 10px;
  display: grid;
  gap: 7px;
}

.admin-amount-box input {
  width: 100%;
  border: 0;
  background: rgba(0,0,0,0.24);
  color: #fff;
  border-radius: 10px;
  padding: 8px 10px;
  outline: none;
}

.admin-quick-amounts {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
}

.admin-quick-amounts button {
  min-height: 26px;
  padding: 3px;
  border-radius: 8px;
  background: rgba(255,255,255,0.10);
  color: rgba(234,240,255,0.86);
  font-size: 11px;
}

.admin-give-button {
  height: 100%;
  min-height: 70px;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #ffd36a, #ff9f43) !important;
  box-shadow: 0 12px 28px rgba(255,159,67,0.20);
}

.admin-give-button:disabled {
  opacity: 0.58;
  cursor: not-allowed;
  filter: grayscale(0.15);
}

@media (max-width: 680px) {
  .admin-panel {
    top: 74px;
    max-height: calc(100vh - 106px);
  }

  .admin-tools,
  .admin-give-controls {
    grid-template-columns: 1fr;
  }

  .admin-give-button {
    min-height: 44px;
  }
}


/* v59 build mode */
.catalog-card.selected {
  border-color: rgba(94, 255, 128, 0.65);
  background: linear-gradient(135deg, rgba(94,255,128,0.18), rgba(255,255,255,0.08));
  box-shadow: 0 0 0 1px rgba(94,255,128,0.22), 0 14px 34px rgba(0,0,0,0.26);
}

.catalog-action {
  margin-top: 6px;
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 900;
  color: #d7ffe1;
  background: rgba(94,255,128,0.14);
  border: 1px solid rgba(94,255,128,0.24);
}

.catalog-card.selected .catalog-action {
  color: #101914;
  background: linear-gradient(135deg, #8cff9d, #48e8ff);
  border-color: transparent;
}


/* v61 craft/build resource states */
.craft-ingredient-text.ok {
  color: #9dff9d;
}

.craft-ingredient-text.missing {
  color: #ff9a9a;
}

.craft-create-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(0.25);
}

.build-panel.game-panel {
  left: 18px;
  right: auto;
  top: 74px;
  transform: none;
}


/* v62 centered craft/build panels with vertical category tabs */
.craft-panel.game-panel:not(.hidden) {
  display: grid;
}

.craft-panel.game-panel {
  left: 54%;
  top: 53%;
  right: auto;
  transform: translate(-50%, -50%);
  width: min(860px, calc(100vw - 48px));
  height: min(620px, calc(100vh - 92px));
  grid-template-columns: 112px minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  gap: 12px;
  padding: 14px;
  overflow: visible;
}

.build-panel.game-panel {
  left: 54%;
  top: 53%;
  right: auto;
  transform: translate(-50%, -50%);
}

.craft-panel.game-panel.hidden {
  display: none;
}

.craft-panel.game-panel .floating-close {
  right: 14px;
  top: 14px;
}

.craft-panel.game-panel .craft-category-tabs {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  min-width: 0;
  padding: 10px 8px;
  margin: 0;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 14px;
  background: rgba(4, 33, 47, 0.55);
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: inset -3px 0 0 rgba(4, 43, 59, 0.55);
  scrollbar-width: thin;
}

.craft-panel.game-panel .craft-category-tab {
  width: 100%;
  min-width: 0;
  height: 64px;
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  grid-template-rows: 1fr;
  gap: 7px;
  align-items: center;
  justify-items: start;
  padding: 8px 9px;
  text-align: left;
  text-transform: none;
  line-height: 1.05;
}

.craft-panel.game-panel .craft-category-tab span {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  font-size: 10px;
}

.craft-panel.game-panel .craft-category-icon {
  width: 30px;
  height: 30px;
}

.craft-panel.game-panel .craft-shell {
  grid-column: 2;
  grid-row: 1;
  height: 100%;
  min-width: 0;
  grid-template-columns: 286px minmax(0, 1fr);
}

.craft-panel.game-panel .craft-list {
  padding-bottom: 14px;
}

@media (max-width: 980px) {
  .craft-panel.game-panel {
    left: 50%;
    top: 52%;
    transform: translate(-50%, -50%);
    width: min(760px, calc(100vw - 24px));
    height: min(640px, calc(100vh - 42px));
    grid-template-columns: 96px minmax(0, 1fr);
  }

  .craft-panel.game-panel .craft-shell {
    grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.1fr);
    height: 100%;
  }

  .craft-panel.game-panel .craft-list-wrap {
    max-height: none;
    border-right: 4px solid rgba(4, 43, 59, 0.80);
    border-bottom: none;
  }
}

@media (max-width: 720px) {
  .craft-panel.game-panel {
    grid-template-columns: 1fr;
    grid-template-rows: 92px minmax(0, 1fr);
  }

  .craft-panel.game-panel .craft-category-tabs {
    grid-column: 1;
    grid-row: 1;
    flex-direction: row;
    overflow-x: auto;
    overflow-y: hidden;
    height: auto;
  }

  .craft-panel.game-panel .craft-category-tab {
    width: 96px;
  }

  .craft-panel.game-panel .craft-shell {
    grid-column: 1;
    grid-row: 2;
    grid-template-columns: 1fr;
  }
}


/* v63 left vertical main dock + slight-right craft/build panels */
.action-dock {
  left: 16px;
  top: 96px;
  bottom: auto;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  max-height: calc(100vh - 190px);
  overflow-y: auto;
  overflow-x: hidden;
  padding: 8px;
  border-radius: 18px;
  z-index: 32;
  scrollbar-width: thin;
}

.action-dock .dock-button {
  flex: 0 0 auto;
}

.craft-panel.game-panel {
  left: 104px;
  top: 96px;
  right: auto;
  transform: none;
  width: min(860px, calc(100vw - 132px));
  height: min(620px, calc(100vh - 124px));
}

.build-panel.game-panel {
  left: 104px;
  top: 96px;
  right: auto;
  transform: none;
}

@media (max-width: 980px) {
  .action-dock {
    left: 10px;
    top: 84px;
    max-height: calc(100vh - 170px);
  }

  .dock-button {
    width: 44px;
    height: 44px;
  }

  .craft-panel.game-panel,
  .build-panel.game-panel {
    left: 70px;
    top: 78px;
    transform: none;
    width: calc(100vw - 84px);
    height: min(640px, calc(100vh - 104px));
  }
}

@media (max-width: 720px) {
  .action-dock {
    left: 8px;
    top: auto;
    bottom: 86px;
    flex-direction: row;
    max-width: calc(100vw - 16px);
    max-height: none;
    overflow-x: auto;
    overflow-y: hidden;
  }

  .craft-panel.game-panel,
  .build-panel.game-panel {
    left: 50%;
    top: 52%;
    transform: translate(-50%, -50%);
    width: min(760px, calc(100vw - 24px));
    height: min(640px, calc(100vh - 42px));
  }
}


/* v64 main dock lower + craft/build inner tabs restored to top */
.action-dock {
  top: 126px;
}

.craft-panel.game-panel:not(.hidden) {
  display: block;
}

.craft-panel.game-panel .craft-category-tabs {
  display: flex;
  flex-direction: row;
  gap: 8px;
  height: auto;
  min-width: 0;
  padding: 0 56px 0 0;
  margin: 0 0 10px 0;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  scrollbar-width: thin;
}

.craft-panel.game-panel .craft-category-tab {
  width: auto;
  min-width: 74px;
  height: 56px;
  flex: 0 0 auto;
  padding: 7px 8px;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 28px 1fr;
  gap: 0;
  align-items: center;
  justify-items: center;
  text-align: center;
  text-transform: uppercase;
  line-height: 1.05;
}

.craft-panel.game-panel .craft-category-tab span {
  display: block;
  max-width: 82px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
}

.craft-panel.game-panel .craft-category-icon {
  width: 28px;
  height: 28px;
}

.craft-panel.game-panel .craft-shell {
  height: calc(100% - 66px);
  grid-template-columns: 286px minmax(0, 1fr);
}

@media (max-width: 980px) {
  .action-dock {
    top: 112px;
  }

  .craft-panel.game-panel .craft-category-tabs {
    flex-direction: row;
    overflow-x: auto;
    overflow-y: hidden;
    height: auto;
  }

  .craft-panel.game-panel .craft-list-wrap {
    max-height: none;
    border-right: 4px solid rgba(4, 43, 59, 0.80);
    border-bottom: none;
  }
}

@media (max-width: 720px) {
  .action-dock {
    top: auto;
    bottom: 86px;
  }

  .craft-panel.game-panel:not(.hidden) {
    display: grid;
  }

  .craft-panel.game-panel .craft-category-tabs {
    grid-column: 1;
    grid-row: 1;
  }

  .craft-panel.game-panel .craft-shell {
    grid-column: 1;
    grid-row: 2;
    height: 100%;
  }
}


/* v65 compact craft/build/shop and shop balance */
.craft-panel.game-panel {
  left: 104px;
  top: 96px;
  right: auto;
  transform: none;
  width: min(645px, calc(100vw - 132px));
  height: min(465px, calc(100vh - 124px));
  padding: 12px;
}

.craft-panel.game-panel .craft-shell {
  grid-template-columns: 218px minmax(0, 1fr);
  height: calc(100% - 64px);
}

.craft-panel.game-panel .craft-list-title {
  padding: 10px 12px 6px;
  font-size: 16px;
}

.craft-panel.game-panel .craft-list-item {
  grid-template-columns: 36px 1fr;
  gap: 8px;
  padding: 8px;
}

.craft-panel.game-panel .craft-list-icon {
  width: 32px;
  height: 32px;
}

.craft-panel.game-panel .craft-detail {
  padding: 14px;
}

.craft-panel.game-panel .craft-detail-title {
  font-size: 19px;
}

.craft-panel.game-panel .craft-detail-desc {
  margin-top: 9px;
  font-size: 13px;
}

.craft-panel.game-panel .craft-recipe-box {
  margin-top: 12px;
  padding: 12px;
  grid-template-columns: 1fr 120px;
}

.craft-panel.game-panel .craft-preview-icon {
  height: 112px;
}

.craft-panel.game-panel .craft-create-button {
  width: 190px;
  padding: 13px 14px;
  font-size: 16px;
}

.panel-balance {
  position: absolute;
  top: 14px;
  right: 64px;
  z-index: 4;
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(6, 26, 37, 0.72);
  border: 1px solid rgba(255, 211, 106, 0.38);
  color: #ffdf84;
  font-size: 13px;
  font-weight: 950;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.10), 0 8px 18px rgba(0,0,0,0.20);
}

.coin-icon {
  background:
    radial-gradient(circle at 35% 30%, #fff3a6, #ffd36a 38%, #b97918 75%);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,0.20), 0 4px 10px rgba(0,0,0,0.22);
}

@media (max-width: 980px) {
  .craft-panel.game-panel,
  .build-panel.game-panel,
  .shop-panel.game-panel {
    left: 70px;
    top: 78px;
    transform: none;
    width: calc(100vw - 84px);
    height: min(520px, calc(100vh - 104px));
  }

  .craft-panel.game-panel .craft-shell {
    grid-template-columns: 210px minmax(0, 1fr);
  }
}

@media (max-width: 720px) {
  .craft-panel.game-panel,
  .build-panel.game-panel,
  .shop-panel.game-panel {
    left: 50%;
    top: 52%;
    transform: translate(-50%, -50%);
    width: min(645px, calc(100vw - 24px));
    height: min(520px, calc(100vh - 42px));
  }

  .craft-panel.game-panel .craft-shell {
    grid-template-columns: 1fr;
  }
}


/* v66 shop usability + taller panels + centered side dock */
.action-dock {
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
}

.craft-panel.game-panel,
.build-panel.game-panel,
.shop-panel.game-panel {
  height: min(558px, calc(100vh - 124px));
}

.shop-panel .craft-category-tabs {
  padding-right: 200px;
  position: relative;
  z-index: 5;
}

.shop-panel .panel-balance {
  pointer-events: none;
  z-index: 4;
}

.shop-panel .craft-shell {
  position: relative;
  z-index: 2;
}

.shop-panel .craft-list-item,
.shop-panel .craft-category-tab,
.shop-panel .craft-create-button {
  pointer-events: auto;
}

.shop-panel .craft-list {
  max-height: none;
}

@media (max-width: 980px) {
  .action-dock {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
  }

  .craft-panel.game-panel,
  .build-panel.game-panel,
  .shop-panel.game-panel {
    height: min(624px, calc(100vh - 104px));
  }

  .shop-panel .craft-category-tabs {
    padding-right: 160px;
  }
}

@media (max-width: 720px) {
  .action-dock {
    top: auto;
    bottom: 86px;
    transform: none;
  }

  .craft-panel.game-panel,
  .build-panel.game-panel,
  .shop-panel.game-panel {
    height: min(624px, calc(100vh - 42px));
  }

  .shop-panel .craft-category-tabs {
    padding-right: 56px;
  }
}


/* v67 shop interaction fix + compact zoom */
.shop-panel {
  pointer-events: auto;
}

.shop-panel .floating-close {
  z-index: 80;
  pointer-events: auto;
}

.shop-panel .craft-category-tabs {
  position: relative;
  z-index: 20;
  pointer-events: auto;
}

.shop-panel .craft-category-tab {
  pointer-events: auto;
  cursor: pointer;
}

.shop-panel .craft-shell {
  position: relative;
  z-index: 10;
  pointer-events: auto;
}

.shop-panel .craft-list,
.shop-panel .craft-list-item,
.shop-panel .craft-detail,
.shop-panel .craft-create-button {
  pointer-events: auto;
}

.shop-panel .panel-balance {
  pointer-events: none;
  z-index: 12;
}

/* Zoom controls: prettier and ~30% smaller */
.viewport-controls {
  right: 14px;
  bottom: 18px;
  gap: 5px;
  padding: 5px;
  border-radius: 13px;
  background: linear-gradient(180deg, rgba(14, 27, 44, 0.74), rgba(5, 10, 18, 0.70));
  border: 1px solid rgba(255, 211, 106, 0.24);
  box-shadow: 0 12px 34px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.10);
}

.viewport-controls button {
  min-width: 27px;
  width: 27px;
  height: 27px;
  padding: 0;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 950;
  background: linear-gradient(180deg, rgba(42, 55, 76, 0.92), rgba(22, 31, 47, 0.92));
  border: 1px solid rgba(255,255,255,0.14);
  color: #ffe18a;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12);
}

.viewport-controls button:hover {
  background: linear-gradient(180deg, rgba(71, 86, 111, 0.94), rgba(33, 45, 67, 0.94));
  border-color: rgba(255, 211, 106, 0.48);
}

#zoomValue {
  min-width: 36px;
  padding: 0 4px;
  color: #fff2b6;
  font-size: 10px;
  font-weight: 950;
  text-align: center;
  letter-spacing: 0.2px;
}

#zoomReset {
  font-size: 14px;
}


/* v74 privatechest personal chest */
.chest-panel.game-panel {
  width: min(760px, calc(100vw - 40px));
}

.chest-grid {
  grid-template-columns: repeat(10, 58px);
  max-height: min(470px, calc(100vh - 250px));
  overflow-y: auto;
  padding-right: 6px;
}

.chest-note {
  margin-top: 10px;
  color: rgba(234, 240, 255, 0.72);
  font-size: 12px;
  line-height: 1.35;
}



/* v78 main menu tabs */
.main-menu-card {
  width: min(760px, calc(100vw - 32px));
  max-height: calc(100vh - 40px);
  overflow-y: auto;
}

.main-menu-tabs {
  display: grid;
  grid-template-columns: repeat(5, minmax(96px, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.main-menu-tab {
  min-height: 118px;
  padding: 12px 8px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.14);
  background: linear-gradient(180deg, rgba(32, 45, 67, 0.92), rgba(12, 18, 31, 0.86));
  color: #eaf0ff;
  display: grid;
  place-items: center;
  gap: 8px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.10), 0 12px 34px rgba(0,0,0,0.25);
}

.main-menu-tab:hover {
  border-color: rgba(255, 211, 106, 0.46);
  transform: translateY(-1px);
}

.main-menu-tab.active {
  border-color: #ffd36a;
  background: linear-gradient(180deg, rgba(72, 56, 25, 0.96), rgba(24, 20, 14, 0.88));
  box-shadow: 0 0 0 2px rgba(255, 211, 106, 0.22), 0 16px 42px rgba(0,0,0,0.32);
}

.main-menu-tab img {
  width: 58px;
  height: 58px;
  object-fit: contain;
  image-rendering: auto;
  filter: drop-shadow(0 6px 7px rgba(0,0,0,0.48));
}

.main-menu-tab span {
  font-size: 13px;
  font-weight: 950;
  text-align: center;
  text-shadow: 0 2px 4px rgba(0,0,0,0.55);
}

.main-menu-content {
  margin-top: 10px;
  padding: 9px 12px;
  border-radius: 13px;
  background: rgba(255,255,255,0.06);
  color: rgba(234, 240, 255, 0.82);
  font-size: 13px;
  border: 1px solid rgba(255,255,255,0.10);
}

@media (max-width: 760px) {
  .main-menu-tabs {
    grid-template-columns: repeat(2, minmax(120px, 1fr));
  }

  .main-menu-tab {
    min-height: 96px;
  }
}


/* v79 Ahardice-like main menu */
.ahardice-main-menu.login-overlay {
  align-items: center;
  justify-content: center;
  background:
    linear-gradient(90deg, rgba(222, 191, 96, 0.48) 0 23%, transparent 23%),
    radial-gradient(circle at 52% 48%, rgba(113, 165, 58, 0.48), rgba(30, 55, 28, 0.72));
  backdrop-filter: blur(1.5px);
}

.ahardice-main-menu .main-account-bar {
  position: fixed;
  left: 0;
  top: 0;
  width: 470px;
  min-height: 118px;
  padding: 16px 20px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 18px;
  background: linear-gradient(180deg, rgba(18, 132, 172, 0.97), rgba(9, 104, 145, 0.97));
  border-right: 4px solid rgba(0,0,0,0.35);
  border-bottom: 4px solid rgba(0,0,0,0.35);
  border-bottom-right-radius: 18px;
  box-shadow: 0 6px 0 rgba(0,0,0,0.22), 0 20px 45px rgba(0,0,0,0.25);
  z-index: 56;
}

.main-account-shield {
  width: 84px;
  height: 84px;
  border-radius: 20px;
  display: grid;
  place-items: center;
}

.main-account-shield img {
  width: 78px;
  height: 78px;
  object-fit: contain;
  filter: drop-shadow(0 4px 4px rgba(0,0,0,0.35));
}

.main-account-info {
  flex: 1;
  text-align: left;
}

.ahardice-main-menu .menu-account {
  margin: 0 0 8px;
  color: #eaf8ff;
  font-weight: 900;
  text-shadow: 0 2px 3px rgba(0,0,0,0.32);
}

.ahardice-main-menu .menu-buttons {
  display: flex;
  gap: 8px;
  margin: 0;
}

.main-login-button,
.ahardice-main-menu .secondary-login,
.ahardice-main-menu .account-ready {
  min-width: 130px;
  width: auto;
  margin: 0;
  padding: 12px 22px;
  border-radius: 8px;
  font-size: 21px;
  color: white;
  text-shadow: 0 2px 3px rgba(0,0,0,0.42);
  background: linear-gradient(180deg, #92d0ec, #4b99c0);
  border: 1px solid rgba(255,255,255,0.45);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.45), 0 4px 0 rgba(0,0,0,0.22);
}

.main-settings-button {
  position: fixed;
  right: 24px;
  top: 22px;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  z-index: 57;
  font-size: 46px;
  line-height: 1;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.92);
  color: #132318;
  border: 3px solid rgba(0,0,0,0.26);
  box-shadow: 0 6px 0 rgba(0,0,0,0.24), 0 14px 30px rgba(0,0,0,0.25);
}

.main-settings-popup {
  position: fixed;
  right: 24px;
  top: 112px;
  width: 270px;
  padding: 14px;
  border-radius: 14px;
  z-index: 58;
  background: rgba(8, 12, 20, 0.92);
  border: 1px solid rgba(255,255,255,0.14);
  color: #eaf0ff;
  box-shadow: 0 18px 50px rgba(0,0,0,0.42);
}

.main-menu-left-tabs {
  position: fixed;
  left: 0;
  top: 150px;
  z-index: 55;
  width: 162px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  margin: 0;
}

.main-menu-left-tabs .main-menu-tab {
  width: 160px;
  min-height: 104px;
  padding: 9px 8px;
  border-radius: 0 8px 8px 0;
  border: 3px solid rgba(0,0,0,0.72);
  border-left: none;
  background: rgba(58, 56, 30, 0.94);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 5px 0 rgba(0,0,0,0.26);
  gap: 5px;
}

.main-menu-left-tabs .main-menu-tab.active,
.main-menu-left-tabs .main-menu-tab:hover {
  background: linear-gradient(180deg, #1197c6, #0874a3);
  border-color: rgba(0,0,0,0.76);
  transform: none;
}

.main-menu-left-tabs .main-menu-tab img {
  width: 54px;
  height: 54px;
}

.main-menu-left-tabs .main-menu-tab span {
  font-size: 22px;
  font-weight: 950;
}

.ahardice-center-card.login-card {
  position: fixed;
  left: 50%;
  top: 51%;
  transform: translate(-50%, -50%);
  width: min(520px, calc(100vw - 420px));
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  overflow: visible;
}

.ahardice-logo {
  font-size: 56px;
  color: #55ff7e;
  -webkit-text-stroke: 2px #063d1b;
  text-shadow: 0 5px 0 #042513, 0 8px 14px rgba(0,0,0,0.48);
  margin-bottom: 36px;
}

.center-play-form {
  width: 340px;
  margin: 0 auto;
  display: grid;
  gap: 13px;
  text-align: left;
}

.main-field-label {
  color: #fff;
  font-size: 15px;
  font-weight: 950;
  text-shadow: 0 2px 4px rgba(0,0,0,0.55);
}

.ahardice-main-menu .login-card input,
.main-server-select {
  width: 100%;
  height: 44px;
  margin: 0;
  padding: 0 12px;
  box-sizing: border-box;
  border-radius: 8px;
  border: 3px solid rgba(0,0,0,0.72);
  background: rgba(31, 55, 20, 0.94);
  color: #eaf0ff;
  font-size: 18px;
  font-weight: 900;
  text-align: left;
  outline: none;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.08);
}

.main-server-select {
  appearance: auto;
}

.main-play-button.play-button {
  height: 74px;
  margin-top: 10px;
  border-radius: 12px;
  font-size: 32px;
  color: #fff;
  background: linear-gradient(180deg, #80d446, #4ea928);
  border: 3px solid rgba(0,0,0,0.45);
  text-shadow: 0 3px 3px rgba(0,0,0,0.38);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.25), 0 6px 0 rgba(0,0,0,0.28);
}

.main-side-panel {
  position: fixed;
  left: 182px;
  top: 150px;
  width: 430px;
  max-height: calc(100vh - 190px);
  overflow-y: auto;
  padding: 16px;
  z-index: 56;
  border-radius: 16px;
  background: rgba(8, 12, 20, 0.88);
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 18px 60px rgba(0,0,0,0.42);
  color: #eaf0ff;
}

.main-menu-panel-body {
  color: rgba(234,240,255,0.82);
  font-size: 14px;
  line-height: 1.45;
  text-align: left;
}

.main-cosmetics-content .skin-choices {
  max-height: 420px;
  grid-template-columns: repeat(2, minmax(150px, 1fr));
}

.ahardice-main-menu .login-subtitle,
.ahardice-main-menu .login-note {
  text-align: center;
  color: #fff;
  text-shadow: 0 2px 4px rgba(0,0,0,0.55);
}

@media (max-width: 900px) {
  .ahardice-main-menu .main-account-bar {
    width: 360px;
  }

  .main-menu-left-tabs {
    top: 130px;
    width: 126px;
  }

  .main-menu-left-tabs .main-menu-tab {
    width: 124px;
    min-height: 82px;
  }

  .main-menu-left-tabs .main-menu-tab span {
    font-size: 15px;
  }

  .ahardice-center-card.login-card {
    width: min(420px, calc(100vw - 180px));
    left: 60%;
  }
}


/* v80 Ahardice transparent main menu */
.ahardice-main-menu.login-overlay {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Do not darken/hide the live game view behind the main menu. */
body.menu-open #hud,
body.menu-open #hotbar,
body.menu-open #inventory,
body.menu-open #viewportControls,
body.menu-open #actionDock,
body.menu-open #minimap,
body.menu-open #statsPanel {
  opacity: 1 !important;
}

/* Keep menu UI readable without a full-screen background. */
.ahardice-center-card.login-card {
  pointer-events: auto;
}

.main-menu-left-tabs,
.main-account-bar,
.main-settings-button,
.main-settings-popup,
.main-side-panel {
  pointer-events: auto;
}


/* v81 hide in-game UI while main menu is open */
/* Canvas stays visible, but gameplay UI appears only after the player enters the game. */
body.menu-open #hud,
body.menu-open #hotbar,
body.menu-open #inventory,
body.menu-open #chestPanel,
body.menu-open #craftPanel,
body.menu-open #shopPanel,
body.menu-open #buildPanel,
body.menu-open #settingsPanel,
body.menu-open #viewportControls,
body.menu-open #actionDock,
body.menu-open #minimap,
body.menu-open #statsPanel,
body.menu-open #fullMapOverlay,
body.menu-open #chatBox,
body.menu-open #levelHud,
body.menu-open #pickupHint,
body.menu-open #itemToastBox,
body.menu-open #playerOverlay,
body.menu-open #clanPanel,
body.menu-open #tradePanel,
body.menu-open #adminPanel {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}


/* v82 no menu UI flash before JS */
/* These elements are hidden by default, before JavaScript has time to add body.menu-open. */
body:not(.game-started) #hud,
body:not(.game-started) #hotbar,
body:not(.game-started) #inventory,
body:not(.game-started) #chestPanel,
body:not(.game-started) #craftPanel,
body:not(.game-started) #shopPanel,
body:not(.game-started) #buildPanel,
body:not(.game-started) #settingsPanel,
body:not(.game-started) #viewportControls,
body:not(.game-started) #actionDock,
body:not(.game-started) #minimap,
body:not(.game-started) #statsPanel,
body:not(.game-started) #fullMapOverlay,
body:not(.game-started) #chatBox,
body:not(.game-started) #levelHud,
body:not(.game-started) #pickupHint,
body:not(.game-started) #itemToastBox,
body:not(.game-started) #playerOverlay,
body:not(.game-started) #clanPanel,
body:not(.game-started) #tradePanel,
body:not(.game-started) #adminPanel {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Canvas must stay visible in the main menu. */
body:not(.game-started) #game {
  display: block !important;
}


/* v83 hide legacy debug HUD */
/* Старый блок в левом верхнем углу нужен только для внутренних JS-ссылок.
   В интерфейсе игрока он больше не показывается: нет legacy logout/connect. */
#hud {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}


/* v84 Ahardice-like minimap and full map */

/* Mini map: left side, no title/P, compact image-like frame */
.minimap {
  left: 18px !important;
  right: auto !important;
  top: 18px !important;
  width: 245px !important;
  padding: 8px !important;
  color: #eaf0ff;
  background: linear-gradient(180deg, rgba(36, 56, 32, 0.96), rgba(21, 31, 20, 0.96)) !important;
  border: 4px solid rgba(11, 26, 18, 0.92) !important;
  border-radius: 8px !important;
  box-shadow:
    0 5px 0 rgba(0,0,0,0.30),
    0 16px 34px rgba(0,0,0,0.32),
    inset 0 1px 0 rgba(255,255,255,0.10) !important;
  backdrop-filter: none !important;
  user-select: none;
  z-index: 18;
}

.minimap-title {
  display: none !important;
}

#minimapCanvas {
  width: 229px !important;
  height: 229px !important;
  display: block;
  margin: 0 !important;
  border-radius: 2px !important;
  border: 3px solid rgba(6, 16, 10, 0.95) !important;
  background: #070a08 !important;
  box-shadow:
    inset 0 0 0 2px rgba(74, 132, 77, 0.28),
    inset 0 0 18px rgba(0,0,0,0.44) !important;
}

/* Full map: big blue frame like Ahardice.io map window */
.full-map-overlay {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  z-index: 60;
}

.full-map-card {
  position: relative !important;
  width: min(720px, calc(100vw - 58px)) !important;
  height: min(720px, calc(100vh - 58px)) !important;
  padding: 10px !important;
  overflow: visible !important;
  background: linear-gradient(180deg, #1393bd 0%, #0a6e98 100%) !important;
  border: 4px solid #064b69 !important;
  border-radius: 10px !important;
  box-shadow:
    0 6px 0 rgba(0,0,0,0.30),
    0 22px 70px rgba(0,0,0,0.42),
    inset 0 2px 0 rgba(255,255,255,0.20) !important;
  color: #eaf0ff;
}

/* Hide old title "Карта P" */
.full-map-card > .inventory-title {
  display: none !important;
}

#fullMapCanvas {
  width: 100% !important;
  height: 100% !important;
  display: block;
  margin: 0 !important;
  border-radius: 4px !important;
  border: 4px solid rgba(5, 22, 15, 0.95) !important;
  background: #050705 !important;
  box-sizing: border-box;
  box-shadow:
    inset 0 0 0 2px rgba(77, 151, 91, 0.18),
    inset 0 0 24px rgba(0,0,0,0.52) !important;
}

/* Full map close: blue square in the top-right corner */
#fullMapClose {
  position: absolute !important;
  right: -54px !important;
  top: -4px !important;
  width: 54px !important;
  height: 54px !important;
  min-width: 0 !important;
  padding: 0 !important;
  border-radius: 0 8px 8px 0 !important;
  border: 4px solid #064b69 !important;
  border-left: none !important;
  background: linear-gradient(180deg, #54acd3, #2785b6) !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 1 !important;
  box-shadow:
    0 5px 0 rgba(0,0,0,0.30),
    inset 0 1px 0 rgba(255,255,255,0.22) !important;
}

#fullMapClose::before {
  content: "×";
  color: #dff7ff;
  font-size: 48px;
  font-weight: 950;
  line-height: 44px;
  text-shadow: 0 2px 0 rgba(0,0,0,0.25);
}

#fullMapClose:hover {
  filter: brightness(1.08);
}

@media (max-width: 900px) {
  .minimap {
    left: 12px !important;
    top: 12px !important;
    width: 180px !important;
    padding: 6px !important;
  }

  #minimapCanvas {
    width: 166px !important;
    height: 166px !important;
  }

  .full-map-card {
    width: min(620px, calc(100vw - 70px)) !important;
    height: min(620px, calc(100vh - 70px)) !important;
  }

  #fullMapClose {
    right: -48px !important;
    width: 48px !important;
    height: 48px !important;
  }

  #fullMapClose::before {
    font-size: 42px;
    line-height: 38px;
  }
}


/* v86 safe client leaderboard */
.leaderboard-panel {
  position: fixed;
  right: 18px;
  top: 18px;
  width: 245px;
  padding: 10px;
  z-index: 18;
  color: #fff;
  user-select: none;
  background: linear-gradient(180deg, rgba(38, 58, 33, 0.94), rgba(17, 27, 17, 0.94));
  border: 4px solid rgba(10, 24, 16, 0.94);
  border-radius: 8px;
  box-shadow:
    0 5px 0 rgba(0,0,0,0.30),
    0 16px 34px rgba(0,0,0,0.32),
    inset 0 1px 0 rgba(255,255,255,0.10);
}

.leaderboard-title {
  margin-bottom: 8px;
  color: #ffd36a;
  font-size: 16px;
  font-weight: 950;
  text-shadow: 0 2px 0 rgba(0,0,0,0.55);
}

.leaderboard-list {
  display: grid;
  gap: 5px;
}

.leaderboard-row {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  align-items: center;
  min-height: 36px;
  padding: 5px 7px;
  border-radius: 6px;
  background: rgba(4, 8, 6, 0.54);
  border: 1px solid rgba(100, 205, 95, 0.20);
}

.leaderboard-rank {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 6px;
  background: rgba(255, 211, 106, 0.18);
  color: #ffe49a;
  font-weight: 950;
  font-size: 12px;
}

.leaderboard-main {
  min-width: 0;
}

.leaderboard-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #eaffdc;
  font-size: 13px;
  font-weight: 950;
  text-shadow: 0 1px 0 rgba(0,0,0,0.55);
}

.leaderboard-meta {
  margin-top: 2px;
  color: rgba(226, 245, 210, 0.78);
  font-size: 11px;
  font-weight: 800;
}

.leaderboard-empty {
  padding: 9px;
  border-radius: 6px;
  color: rgba(226, 245, 210, 0.72);
  background: rgba(4, 8, 6, 0.44);
  font-size: 12px;
}

body.menu-open #leaderboardPanel,
body:not(.game-started) #leaderboardPanel {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 900px) {
  .leaderboard-panel {
    right: 12px;
    top: 12px;
    width: 210px;
  }
}


/* v87 leaderboard points */
.leaderboard-meta {
  color: #ffe49a !important;
  font-size: 12px !important;
}


/* v88 session leaderboard */
.leaderboard-title::after {
  content: " за сессию";
  color: rgba(255, 228, 154, 0.72);
  font-size: 11px;
  font-weight: 800;
}


/* v90 guest login and nickname fix */
.guest-login-button {
  margin-top: 6px;
  width: 100%;
  justify-content: center;
  background: rgba(20, 32, 24, 0.78) !important;
  border-color: rgba(180, 255, 170, 0.26) !important;
  color: #dfffd2 !important;
}

.guest-login-button:hover {
  background: rgba(34, 58, 38, 0.88) !important;
  border-color: rgba(210, 255, 170, 0.48) !important;
}


/* v91 direct guest login */
.guest-login-button::after {
  content: " без Discord";
  opacity: 0.75;
  font-size: 11px;
  margin-left: 4px;
}


/* v92 main menu account cleanup */
#guestLogin,
.guest-login-button {
  display: none !important;
}

#accountReady {
  display: none !important;
}

#menuAccountName:empty {
  display: none !important;
}


/* v94 compact leaderboard */
.leaderboard-panel {
  padding: 7px !important;
}

.leaderboard-title {
  display: none !important;
}

.leaderboard-title::after {
  content: none !important;
  display: none !important;
}

.leaderboard-list {
  gap: 4px !important;
}

.leaderboard-row {
  min-height: 27px !important;
  padding: 3px 6px !important;
  grid-template-columns: 22px 1fr !important;
  gap: 6px !important;
}

.leaderboard-rank {
  width: 20px !important;
  height: 20px !important;
  border-radius: 5px !important;
  font-size: 11px !important;
}

.leaderboard-name {
  font-size: 12px !important;
}

.leaderboard-meta {
  margin-top: 1px !important;
  font-size: 10.5px !important;
}

.leaderboard-empty {
  padding: 6px !important;
  font-size: 11px !important;
}


/* v95 equipment slots */
.equipment-slots {
  position: fixed;
  left: calc(50% - 455px);
  bottom: 22px;
  display: grid;
  grid-template-columns: repeat(2, 58px);
  gap: 7px;
  padding: 9px;
  background: rgba(8, 12, 20, 0.58);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 16px;
  backdrop-filter: blur(8px);
  user-select: none;
  z-index: 20;
}

.equipment-slot {
  position: relative;
}

.equipment-slot::after {
  position: absolute;
  right: 5px;
  bottom: 4px;
  font-size: 10px;
  line-height: 1;
  opacity: 0.72;
  text-shadow: 0 1px 2px black;
  pointer-events: none;
}

.equipment-hat::after {
  content: "hat";
}

.equipment-shield::after {
  content: "shield";
}

body:not(.game-started) #equipmentSlots,
body.menu-open #equipmentSlots {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 980px) {
  .equipment-slots {
    left: 14px;
    bottom: 98px;
  }
}


/* v96 equipment folders */
.equipment-slot .slot-hotkey {
  display: none !important;
}

.equipment-hat::after,
.equipment-shield::after {
  content: "" !important;
  display: none !important;
}


/* v60: heavier left dock + minimap polish + in-game logs */
.action-dock {
  left: 16px;
  bottom: 20px;
  gap: 10px;
  padding: 12px 10px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(16, 23, 34, 0.94), rgba(7, 11, 18, 0.88));
  border: 1px solid rgba(0, 0, 0, 0.72);
  box-shadow: 0 18px 40px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.10), inset 0 -1px 0 rgba(0,0,0,0.42);
  backdrop-filter: blur(10px);
}

.action-dock .dock-button {
  width: 56px;
  height: 56px;
  padding: 8px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(53, 68, 90, 0.98), rgba(21, 28, 40, 0.98));
  border: 1px solid rgba(0,0,0,0.72);
  box-shadow: 0 8px 18px rgba(0,0,0,0.30), inset 0 1px 0 rgba(255,255,255,0.16), inset 0 -2px 0 rgba(0,0,0,0.35);
  transition: transform 120ms ease, box-shadow 120ms ease, filter 120ms ease, background 120ms ease;
}

.action-dock .dock-button img {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.36));
}

.action-dock .dock-button span {
  right: 4px;
  bottom: 4px;
  min-width: 18px;
  padding: 1px 5px;
  border-radius: 999px;
  background: rgba(0,0,0,0.76);
  border: 1px solid rgba(255,255,255,0.12);
  color: #fff4b0;
  font-size: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.26);
}

.action-dock .dock-button:hover,
.action-dock .dock-button.active {
  transform: translateY(-2px) scale(1.04);
  background: linear-gradient(180deg, rgba(92, 68, 28, 1), rgba(50, 34, 14, 1));
  border-color: rgba(255, 211, 106, 0.82);
  box-shadow: 0 12px 24px rgba(0,0,0,0.38), 0 0 0 1px rgba(255, 211, 106, 0.22), inset 0 1px 0 rgba(255,255,255,0.15), inset 0 -2px 0 rgba(0,0,0,0.28);
}

.action-dock .dock-button.text-dock {
  font-size: 28px;
  font-weight: 900;
}

.minimap {
  right: 16px;
  top: 16px;
  width: 196px;
  padding: 10px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(18, 25, 35, 0.95), rgba(8, 12, 20, 0.88));
  border: 1px solid rgba(0,0,0,0.74);
  box-shadow: 0 18px 42px rgba(0,0,0,0.36), inset 0 1px 0 rgba(255,255,255,0.08);
}

#minimapCanvas {
  width: 174px;
  height: 174px;
  border-radius: 13px;
  border: 1px solid rgba(0,0,0,0.82);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
  background: rgba(0,0,0,0.14);
}

.chat-box {
  left: 16px;
  bottom: 98px;
  width: 390px;
  max-width: calc(100vw - 32px);
  pointer-events: auto;
  user-select: none;
}

.chat-box-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
  padding: 8px 10px;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(16, 23, 34, 0.94), rgba(8, 12, 20, 0.90));
  border: 1px solid rgba(0,0,0,0.72);
  color: #f1f5ff;
  font-size: 13px;
  font-weight: 900;
  box-shadow: 0 10px 24px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.08);
}

.chat-box-hint {
  color: #a9bdd8;
  font-size: 11px;
  font-weight: 700;
}

.chat-messages {
  max-height: 230px;
  overflow-y: auto;
  padding: 10px;
  border-radius: 14px;
  background: rgba(8, 12, 20, 0.72);
  border: 1px solid rgba(0,0,0,0.72);
  box-shadow: 0 14px 28px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.06);
  backdrop-filter: blur(8px);
  scrollbar-width: thin;
}

.chat-messages::-webkit-scrollbar { width: 7px; }
.chat-messages::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.18); border-radius: 999px; }
.chat-messages::-webkit-scrollbar-track { background: transparent; }

.chat-line {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(20, 27, 38, 0.72);
  border: 1px solid rgba(255,255,255,0.08);
}

.chat-meta {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 4px;
  font-size: 11px;
  font-weight: 800;
}

.chat-time {
  color: #90a4bf;
  letter-spacing: 0.02em;
}

.chat-text {
  color: #eff5ff;
  font-size: 13px;
  line-height: 1.3;
  word-break: break-word;
}

.chat-line.log-admin {
  background: rgba(58, 41, 15, 0.82);
  border-color: rgba(255, 211, 106, 0.24);
}
.chat-line.log-admin .chat-name { color: #ffd36a; }

.chat-line.log-system {
  background: rgba(15, 42, 58, 0.78);
  border-color: rgba(88, 215, 255, 0.18);
}
.chat-line.log-system .chat-name { color: #58d7ff; }

.chat-line.log-clan {
  background: rgba(29, 44, 23, 0.82);
  border-color: rgba(145, 235, 110, 0.20);
}
.chat-line.log-clan .chat-name { color: #9aef71; }

.chat-line.log-player .chat-name { color: #d8e6ff; }

.chat-input {
  margin-top: 8px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.72);
  background: rgba(12, 17, 25, 0.96);
  box-shadow: 0 10px 28px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.06);
}


/* v61: dock restyle like reference + no minimap outline + player chat bubbles */
.action-dock {
  left: 14px;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 0 2px 0 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
  border-radius: 0;
  max-height: calc(100vh - 130px);
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,0.90) rgba(17,24,35,0.72);
  z-index: 32;
}

.action-dock::-webkit-scrollbar { width: 8px; }
.action-dock::-webkit-scrollbar-track { background: rgba(12,18,27,0.72); border-radius: 999px; }
.action-dock::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.90); border-radius: 999px; }

.action-dock .dock-button {
  position: relative;
  width: 56px;
  height: 56px;
  padding: 6px;
  border-radius: 12px;
  background: linear-gradient(180deg, #2e4666 0%, #223550 46%, #162435 100%);
  border: 2px solid #0c1624;
  box-shadow: 0 5px 0 #0a111c, 0 10px 16px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.18);
  overflow: visible;
}

.action-dock .dock-button::before {
  content: '';
  position: absolute;
  inset: 2px;
  border-radius: 9px;
  border: 1px solid rgba(255,255,255,0.05);
  pointer-events: none;
}

.action-dock .dock-button img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 2px 1px rgba(0,0,0,0.28));
}

.action-dock .dock-button span {
  right: 5px;
  bottom: 2px;
  min-width: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: #ffffff;
  font-size: 23px;
  line-height: 1;
  font-weight: 900;
  text-shadow: 0 2px 0 rgba(0,0,0,0.62), 0 0 6px rgba(0,0,0,0.24);
}

.action-dock .dock-button:hover,
.action-dock .dock-button.active {
  transform: translateY(-1px);
  background: linear-gradient(180deg, #38557c 0%, #29415f 46%, #1d2f47 100%);
  border-color: #101b2c;
  box-shadow: 0 6px 0 #0a111c, 0 12px 18px rgba(0,0,0,0.30), inset 0 1px 0 rgba(255,255,255,0.18);
}

#craftButton::after,
#buildButton::after {
  content: '!';
  position: absolute;
  top: -6px;
  right: -5px;
  color: #ffb400;
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 2px 0 rgba(110,55,0,0.72), 0 0 3px rgba(0,0,0,0.35);
}

.minimap {
  right: 18px;
  top: 18px;
}

#minimapCanvas {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  background: transparent;
}

.chat-line.log-player {
  display: none !important;
}

.player-nameplate {
  width: 150px;
}

.player-chat-bubble {
  display: inline-block;
  max-width: 180px;
  margin: 0 auto 5px;
  padding: 6px 10px;
  border-radius: 12px;
  background: rgba(255,255,255,0.96);
  color: #222a35;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  text-align: center;
  word-break: break-word;
  box-shadow: 0 5px 14px rgba(0,0,0,0.20);
  border: 1px solid rgba(0,0,0,0.08);
}

.player-chat-bubble::after {
  content: '';
  display: block;
  width: 10px;
  height: 10px;
  margin: 4px auto -10px;
  background: rgba(255,255,255,0.96);
  transform: rotate(45deg);
  border-right: 1px solid rgba(0,0,0,0.06);
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

@media (max-width: 720px) {
  .action-dock {
    top: auto;
    bottom: 86px;
    transform: none;
    flex-direction: row;
    gap: 8px;
    max-width: calc(100vw - 12px);
  }
  .action-dock .dock-button {
    width: 52px;
    height: 52px;
  }
  .action-dock .dock-button span {
    font-size: 20px;
  }
}


/* v62: hide bottom-left logs, input only on chat open, dynamic dock alerts, admin gear swap */
.chat-box {
  display: none !important;
}

.chat-box.chat-open {
  display: block !important;
  left: 16px;
  bottom: 98px;
  width: 360px;
  max-width: calc(100vw - 32px);
  pointer-events: none;
  z-index: 40;
}

.chat-box.chat-open .chat-box-head,
.chat-box.chat-open .chat-messages {
  display: none !important;
}

.chat-box.chat-open .chat-input {
  display: block !important;
  pointer-events: auto;
}

.action-dock .dock-button.has-alert::after {
  content: '!';
  position: absolute;
  top: -6px;
  right: -5px;
  color: #ffb400;
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 2px 0 rgba(110,55,0,0.72), 0 0 3px rgba(0,0,0,0.35);
}

#craftButton::after,
#buildButton::after {
  content: none !important;
}

#settingsButton.hidden,
#adminButton.hidden {
  display: none !important;
}


/* v63: admin gear visibility + lower left dock + blue dock buttons */
.action-dock {
  top: 318px !important;
  bottom: auto !important;
  transform: none !important;
}

.action-dock .dock-button {
  background: linear-gradient(180deg, #7cc0ff 0%, #5ea8f2 42%, #346fc9 100%) !important;
  border: 2px solid #17386d !important;
  box-shadow: 0 5px 0 #102546, 0 10px 16px rgba(0,0,0,0.26), inset 0 1px 0 rgba(255,255,255,0.28) !important;
}

.action-dock .dock-button:hover,
.action-dock .dock-button.active {
  background: linear-gradient(180deg, #90ccff 0%, #6db5fa 42%, #427bd1 100%) !important;
  border-color: #1a427e !important;
  box-shadow: 0 6px 0 #102546, 0 12px 18px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.32) !important;
}

.action-dock .dock-button span {
  color: #ffffff !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.56), 0 0 6px rgba(0,0,0,0.22) !important;
}

@media (max-width: 980px) {
  .action-dock {
    top: 286px !important;
    transform: none !important;
  }
}

@media (max-width: 720px) {
  .action-dock {
    top: auto !important;
    bottom: 86px !important;
    transform: none !important;
  }
}


/* v64: bubble stacking fix + minimap outer frame removed + darker blue left dock */
.player-nameplate {
  width: 170px !important;
}

.player-chat-bubble {
  display: block !important;
  width: fit-content;
  max-width: 190px;
  margin: 0 auto 8px !important;
}

.player-name {
  display: flex !important;
  clear: both;
}

.minimap {
  width: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
}

#minimapCanvas {
  width: 174px;
  height: 174px;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.action-dock .dock-button {
  background: linear-gradient(180deg, #5f9ee7 0%, #4a88d7 44%, #2f60b3 100%) !important;
  border: 2px solid #16386e !important;
  box-shadow: 0 5px 0 #11294f, 0 10px 16px rgba(0,0,0,0.26), inset 0 1px 0 rgba(255,255,255,0.22) !important;
}

.action-dock .dock-button:hover,
.action-dock .dock-button.active {
  background: linear-gradient(180deg, #70acef 0%, #5795e0 44%, #3669be 100%) !important;
  border-color: #1a4482 !important;
}

.action-dock .dock-button span {
  font-size: 17px !important;
}

@media (max-width: 720px) {
  .action-dock .dock-button span {
    font-size: 15px !important;
  }
}


/* v65: miners, PvP/death window */
.miner-counter {
  position: fixed;
  transform: translate(-50%, -50%);
  z-index: 18;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-width: 72px;
  padding: 5px 8px;
  border-radius: 10px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(0,0,0,0.18);
  color: #1e2630;
  font-size: 12px;
  font-weight: 950;
  box-shadow: 0 5px 14px rgba(0,0,0,0.22);
  pointer-events: none;
  user-select: none;
}

.miner-counter-icon {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.player-nameplate.dead {
  opacity: 0.72;
  filter: grayscale(0.7) drop-shadow(0 2px 3px rgba(0,0,0,0.72));
}

.death-overlay {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.68);
  backdrop-filter: blur(3px);
  color: #fff;
  pointer-events: auto;
  user-select: none;
}

.death-overlay.hidden {
  display: none;
}

.death-card {
  width: min(420px, calc(100vw - 36px));
  padding: 28px 26px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(17, 22, 31, 0.96), rgba(8, 11, 18, 0.96));
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 30px 90px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.08);
  text-align: center;
}

.death-title {
  font-size: 36px;
  font-weight: 950;
  color: #ff5d5d;
  text-shadow: 0 3px 0 rgba(0,0,0,0.42);
  margin-bottom: 10px;
}

.death-countdown {
  color: #d8e6ff;
  font-size: 15px;
  font-weight: 850;
  margin-bottom: 18px;
}

.death-respawn-button {
  width: 100%;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(180deg, #7cc0ff, #346fc9);
  border: 2px solid #17386d;
  color: #fff;
  font-size: 17px;
  font-weight: 950;
  box-shadow: 0 5px 0 #102546, 0 12px 24px rgba(0,0,0,0.24), inset 0 1px 0 rgba(255,255,255,0.28);
}

.death-respawn-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(0.5);
}


/* v66: admin modes UI */
.admin-mode-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
  overflow-y: auto;
  padding-right: 4px;
}

.admin-mode-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px;
  border-radius: 13px;
  background: rgba(18, 28, 42, 0.86);
  border: 1px solid rgba(255,255,255,0.10);
  color: #eaf0ff;
  text-align: left;
}

.admin-mode-row.enabled {
  background: rgba(34, 75, 56, 0.88);
  border-color: rgba(117, 255, 155, 0.34);
}

.admin-mode-main b {
  display: block;
  font-size: 14px;
  font-weight: 950;
  color: #fff;
}

.admin-mode-main span {
  display: block;
  margin-top: 2px;
  color: #aebbd0;
  font-size: 12px;
  line-height: 1.25;
}

.admin-mode-toggle {
  min-width: 58px;
  padding: 8px 9px;
  border-radius: 10px;
  background: rgba(255,255,255,0.12);
  color: #fff4b0;
  font-size: 12px;
  font-weight: 950;
  text-align: center;
}

.admin-mode-row.enabled .admin-mode-toggle {
  background: rgba(114, 255, 136, 0.18);
  color: #94ff9b;
}

.admin-speed-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.admin-speed-controls input {
  width: 72px;
  padding: 8px 9px;
  border-radius: 10px;
  background: rgba(0,0,0,0.24);
  border: 1px solid rgba(255,255,255,0.12);
  color: #fff;
  font-weight: 900;
}

.admin-action-message {
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(255, 211, 106, 0.14);
  border: 1px solid rgba(255, 211, 106, 0.24);
  color: #ffdf84;
  font-size: 12px;
  font-weight: 900;
}


/* v117: speed presets */
.admin-speed-controls.preset-speeds {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.admin-speed-controls.preset-speeds .admin-mode-toggle {
  min-width: 42px;
  border: 1px solid rgba(255,255,255,0.12);
}

.admin-speed-controls.preset-speeds .admin-mode-toggle.selected {
  background: rgba(114, 255, 136, 0.24);
  border-color: rgba(114, 255, 136, 0.42);
  color: #a9ffad;
}


/* v118 leaderboard colors */
.leaderboard-row .leaderboard-name {
  color: #ffffff !important;
}

.leaderboard-row.me .leaderboard-name {
  color: #6dff7a !important;
  text-shadow: 0 0 6px rgba(109, 255, 122, 0.22);
}

/* v119 PvP/clan/trade polish */
.player-nameplate.enemy .player-bar.hp span {
  background: linear-gradient(90deg, #ff3434, #ff8a54) !important;
}

#tradeButton.has-alert::after {
  content: '!';
  position: absolute;
  top: -6px;
  right: -5px;
  color: #ffb400;
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 2px 0 rgba(110,55,0,0.72), 0 0 3px rgba(0,0,0,0.35);
}

.clan-panel #clanTagInput {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 900;
}

/* v120: modern trade UI */
.trade-modern {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.trade-modern-title {
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(22,34,50,.94), rgba(12,18,28,.94));
  border: 1px solid rgba(255,255,255,.1);
}
.trade-modern-title b { display:block; color:#fff; font-size:16px; font-weight:950; }
.trade-modern-title span { display:block; color:#aebbd0; font-size:12px; margin-top:3px; }
.trade-modern-offers {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.trade-modern-offer {
  min-height: 84px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(9, 14, 22, .74);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.trade-modern-offer.confirmed {
  border-color: rgba(111,255,136,.32);
  background: rgba(20, 54, 34, .72);
}
.trade-offer-head { font-size: 12px; font-weight: 900; color: #ffd36a; margin-bottom: 8px; }
.trade-modern-inventory {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
  border-radius: 16px;
  background: rgba(7, 11, 18, .58);
  border: 1px solid rgba(255,255,255,.08);
}
.trade-inventory-title { color:#dce7ff; font-size:12px; font-weight:950; margin-bottom:6px; }
.trade-slot-grid {
  display: grid;
  grid-template-columns: repeat(9, 42px);
  gap: 7px;
}
.trade-slot-grid.hotbar-grid { grid-template-columns: repeat(9, 42px); }
.trade-item-slot {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.1);
  background-color: rgba(21, 32, 46, .95);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 72%;
  box-shadow: 0 4px 0 rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.08);
  position: relative;
}
.trade-item-slot.filled:hover {
  transform: translateY(-1px);
  border-color: rgba(255,211,106,.65);
  box-shadow: 0 5px 0 rgba(0,0,0,.32), 0 0 0 2px rgba(255,211,106,.16), inset 0 1px 0 rgba(255,255,255,.1);
}
.trade-item-slot.selected { border-color: rgba(111,255,136,.75); }
.trade-slot-count {
  position:absolute;
  right:4px;
  bottom:2px;
  color:#fff;
  font-size:10px;
  font-weight:950;
  text-shadow:0 2px 2px rgba(0,0,0,.8);
}
.trade-modern-controls {
  display:flex;
  gap:10px;
}
.trade-modern-controls button {
  flex:1;
  padding: 12px 14px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.12);
  color:#fff;
  font-weight:950;
}
.trade-confirm-modern { background: linear-gradient(180deg, #37d46e, #168a45); }
.trade-cancel-modern { background: linear-gradient(180deg, #db5252, #922323); }
@media (max-width: 780px) {
  .trade-modern-offers { grid-template-columns: 1fr; }
  .trade-slot-grid, .trade-slot-grid.hotbar-grid { grid-template-columns: repeat(6, 42px); }
}

/* v121: restore HUD/overlays, stable drops, respawn button */
.player-overlay {
  z-index: 42 !important;
}

.player-nameplate {
  opacity: 1;
  visibility: visible;
}

.leaderboard-panel {
  z-index: 43 !important;
  display: block;
}

.leaderboard-panel.hidden {
  display: none !important;
}

.leaderboard-row {
  color: #ffffff;
}

.leaderboard-row.me .leaderboard-name {
  color: #7cff8c !important;
  text-shadow: 0 0 6px rgba(124,255,140,0.24);
}

.leaderboard-row:not(.me) .leaderboard-name {
  color: #ffffff !important;
}

.death-overlay {
  z-index: 90 !important;
  pointer-events: auto !important;
}

.death-respawn-button {
  pointer-events: auto !important;
}


/* v122 dark panel override removed in v129: panels must keep blue inventory-style colors */
.player-overlay {
  z-index: 12 !important;
}

.full-map-overlay,
.death-overlay {
  z-index: 90 !important;
}


/* v122: trade mini-inventory offer slots */
.trade-offer-grid {
  display: grid;
  grid-template-columns: repeat(4, 38px);
  gap: 7px;
}

.trade-offer-slot {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: rgba(0,0,0,0.25);
  border: 1px solid rgba(255,255,255,0.10);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
}

.trade-offer-slot.empty {
  opacity: 0.55;
}

.trade-offer-slot span {
  position: absolute;
  right: 3px;
  bottom: 2px;
  padding: 1px 4px;
  border-radius: 999px;
  background: rgba(0,0,0,0.72);
  color: #fff;
  font-size: 10px;
  font-weight: 950;
}


/* v123: trade layout + FPS safety */
body.trade-active #hotbar {
  display: none !important;
}

body.trade-active #leaderboardPanel {
  display: none !important;
}

body.trade-active #inventory {
  left: 32% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 42 !important;
}

body.trade-active #tradePanel {
  left: calc(32% + 270px) !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: min(470px, calc(100vw - 560px)) !important;
  max-height: min(720px, calc(100vh - 70px)) !important;
  z-index: 43 !important;
}

@media (max-width: 1180px) {
  body.trade-active #inventory {
    left: 28px !important;
    transform: translate(0, -50%) !important;
  }

  body.trade-active #tradePanel {
    left: 500px !important;
    width: calc(100vw - 530px) !important;
  }
}

@media (max-width: 860px) {
  body.trade-active #inventory,
  body.trade-active #tradePanel {
    left: 50% !important;
    width: min(470px, calc(100vw - 30px)) !important;
    transform: translate(-50%, -50%) !important;
  }

  body.trade-active #tradePanel {
    top: 62% !important;
  }

  body.trade-active #inventory {
    top: 34% !important;
  }
}

.trade-offer-slot.can-place {
  cursor: pointer;
  border-color: rgba(255, 211, 106, 0.48);
  background-color: rgba(255, 211, 106, 0.12);
}

.trade-offer-slot.can-place:hover {
  box-shadow: 0 0 0 2px rgba(255, 211, 106, 0.28);
}


/* v124: trade close/layout + request toast */
body.trade-active #hotbar,
body.trade-active #equipmentSlots {
  display: none !important;
}

body.trade-active #inventory {
  left: 24px !important;
  top: 50% !important;
  transform: translate(0, -50%) !important;
  height: min(640px, calc(100vh - 88px)) !important;
  max-height: min(640px, calc(100vh - 88px)) !important;
  z-index: 42 !important;
}

body.trade-active #tradePanel {
  left: calc(24px + 470px + 18px) !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: min(520px, calc(100vw - 540px)) !important;
  height: min(640px, calc(100vh - 88px)) !important;
  max-height: min(640px, calc(100vh - 88px)) !important;
  z-index: 44 !important;
  overflow: auto !important;
}

body.trade-active #tradePanel .social-body {
  height: calc(100% - 52px);
  overflow: auto;
}

body.trade-active #tradePanel .trade-modern {
  min-height: 100%;
}

body.trade-active #leaderboardPanel {
  display: none !important;
}

@media (max-width: 1080px) {
  body.trade-active #inventory {
    left: 12px !important;
    width: min(430px, calc(50vw - 18px)) !important;
  }

  body.trade-active #tradePanel {
    left: calc(50vw + 6px) !important;
    width: calc(50vw - 18px) !important;
  }
}

@media (max-width: 760px) {
  body.trade-active #inventory,
  body.trade-active #tradePanel {
    left: 50% !important;
    width: min(460px, calc(100vw - 24px)) !important;
    transform: translate(-50%, -50%) !important;
  }

  body.trade-active #inventory {
    top: 34% !important;
    height: 42vh !important;
  }

  body.trade-active #tradePanel {
    top: 72% !important;
    height: 42vh !important;
  }
}

.trade-toast {
  position: fixed;
  left: 50%;
  bottom: 108px;
  transform: translateX(-50%);
  z-index: 88;
  min-width: min(420px, calc(100vw - 30px));
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(18,27,42,.96), rgba(8,12,20,.96));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 22px 70px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08);
  color: #eaf0ff;
  pointer-events: auto;
}

.trade-toast.hidden {
  display: none !important;
}

.trade-toast-text {
  font-size: 14px;
  font-weight: 850;
}

.trade-toast-text b {
  color: #ffd36a;
}

.trade-toast-actions {
  display: flex;
  gap: 8px;
}

.trade-toast-btn {
  width: 46px;
  height: 46px;
  padding: 5px;
  border-radius: 14px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.12);
  display: grid;
  place-items: center;
}

.trade-toast-btn img {
  width: 34px;
  height: 34px;
  object-fit: contain;
  display: block;
}

.trade-toast-btn span {
  display: none;
  color: #fff;
  font-size: 12px;
  font-weight: 950;
}

.trade-toast-btn.accept {
  background: rgba(72, 206, 106, .20);
  border-color: rgba(72, 206, 106, .35);
}

.trade-toast-btn.cancel {
  background: rgba(233, 72, 72, .20);
  border-color: rgba(233, 72, 72, .35);
}

.trade-toast-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(0,0,0,.28);
}

/* v124: modern clan panel */
.clan-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(44,111,207,.24), rgba(20,31,48,.92));
  border: 1px solid rgba(128,189,255,.18);
}

.clan-tag-badge {
  min-width: 76px;
  height: 56px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(116,190,255,.92), rgba(54,112,204,.92));
  border: 2px solid rgba(18,54,108,.92);
  color: #fff;
  font-size: 22px;
  font-weight: 950;
  letter-spacing: .06em;
  text-shadow: 0 2px 0 rgba(0,0,0,.35);
}

.clan-modern-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}

.clan-modern-form input {
  width: 100%;
  min-width: 0;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 950;
}

.clan-list-grid {
  display: grid;
  gap: 8px;
}

.clan-list-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(20, 29, 43, .82);
  border: 1px solid rgba(255,255,255,.09);
}

.clan-list-row.active {
  border-color: rgba(116,190,255,.45);
  background: rgba(44,111,207,.18);
}

.clan-list-row .clan-tag-badge {
  min-width: 54px;
  height: 38px;
  font-size: 15px;
  border-radius: 12px;
}

.clan-list-row button {
  white-space: nowrap;
}


/* v125: trade not overlapping inventory + bottom HP bars */
body.trade-active #leaderboardPanel {
  display: block !important;
}

body.trade-active #inventory {
  left: 22px !important;
  top: 50% !important;
  transform: translate(0, -50%) !important;
  width: 420px !important;
  height: min(640px, calc(100vh - 88px)) !important;
  max-height: min(640px, calc(100vh - 88px)) !important;
  z-index: 42 !important;
}

body.trade-active #tradePanel {
  left: 470px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: min(430px, calc(100vw - 760px)) !important;
  height: min(640px, calc(100vh - 88px)) !important;
  max-height: min(640px, calc(100vh - 88px)) !important;
  z-index: 44 !important;
  overflow: auto !important;
}

body.trade-active #tradePanel .trade-modern-inventory {
  display: none !important;
}

body.trade-active .trade-modern-offers {
  grid-template-columns: 1fr !important;
}

body.trade-active .trade-modern-offer {
  min-height: 128px;
}

body.trade-active .trade-offer-grid {
  grid-template-columns: repeat(4, 44px);
  gap: 9px;
}

body.trade-active .trade-offer-slot {
  width: 44px;
  height: 44px;
}

@media (max-width: 1160px) {
  body.trade-active #inventory {
    width: 390px !important;
  }

  body.trade-active #tradePanel {
    left: 430px !important;
    width: min(410px, calc(100vw - 650px)) !important;
  }
}

@media (max-width: 940px) {
  body.trade-active #leaderboardPanel {
    display: none !important;
  }

  body.trade-active #inventory,
  body.trade-active #tradePanel {
    left: 50% !important;
    width: min(450px, calc(100vw - 24px)) !important;
    transform: translate(-50%, -50%) !important;
  }

  body.trade-active #inventory {
    top: 34% !important;
    height: 42vh !important;
  }

  body.trade-active #tradePanel {
    top: 72% !important;
    height: 42vh !important;
  }
}

/* request toast should sit left of leaderboard instead of covering it */
.trade-toast {
  left: auto !important;
  right: 374px !important;
  bottom: 112px !important;
  transform: none !important;
  min-width: 360px !important;
  max-width: 420px !important;
}

@media (max-width: 1120px) {
  .trade-toast {
    right: 18px !important;
    bottom: 112px !important;
    min-width: min(360px, calc(100vw - 36px)) !important;
  }
}

.player-nameplate {
  width: 170px !important;
  pointer-events: none !important;
}

.player-name {
  color: #ffffff !important;
  -webkit-text-stroke: 0.55px rgba(0,0,0,0.82);
  text-shadow:
    0 1px 0 rgba(0,0,0,0.85),
    1px 0 0 rgba(0,0,0,0.62),
    -1px 0 0 rgba(0,0,0,0.62),
    0 -1px 0 rgba(0,0,0,0.62) !important;
}

.player-bottom-hp {
  position: fixed;
  transform: translate(-50%, -50%);
  width: 96px;
  z-index: 12;
  pointer-events: none;
}

.player-bottom-hp .player-bar.hp {
  width: 78px;
  height: 8px;
  margin: 0 auto;
  border-radius: 999px;
  background: rgba(0,0,0,0.55);
  box-shadow: 0 1px 4px rgba(0,0,0,0.55);
  overflow: hidden;
}

.player-bottom-hp .player-bar.hp span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #26d86d, #b8ff6a);
}

.player-bottom-hp.enemy .player-bar.hp span {
  background: linear-gradient(90deg, #ff3434, #ff8a54) !important;
}

/* old HP above nameplate is no longer used */
.player-nameplate > .player-bar.hp {
  display: none !important;
}


/* v126: final trade layout/notification/minimap sizes */
body.trade-active #inventory {
  left: 92px !important;
  top: 50% !important;
  transform: translate(0, -50%) !important;
  width: 420px !important;
  height: min(640px, calc(100vh - 88px)) !important;
  max-height: min(640px, calc(100vh - 88px)) !important;
  z-index: 42 !important;
}

body.trade-active #tradePanel {
  left: auto !important;
  right: 342px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: min(430px, calc(100vw - 910px)) !important;
  min-width: 380px !important;
  height: min(640px, calc(100vh - 88px)) !important;
  max-height: min(640px, calc(100vh - 88px)) !important;
  z-index: 44 !important;
  overflow: auto !important;
}

body.trade-active #tradePanel .trade-modern-inventory {
  display: none !important;
}

body.trade-active #tradePanel .social-body {
  height: calc(100% - 52px) !important;
  overflow: auto !important;
}

body.trade-active .trade-modern-offers {
  grid-template-columns: 1fr !important;
}

body.trade-active .trade-modern-offer {
  min-height: 132px !important;
}

body.trade-active .trade-offer-grid {
  grid-template-columns: repeat(4, 46px) !important;
  gap: 10px !important;
}

body.trade-active .trade-offer-slot {
  width: 46px !important;
  height: 46px !important;
}

body.trade-active #leaderboardPanel {
  display: block !important;
}

.trade-toast {
  top: 92px !important;
  bottom: auto !important;
  left: auto !important;
  right: 342px !important;
  transform: none !important;
  min-width: 360px !important;
  max-width: 430px !important;
  z-index: 88 !important;
}

@media (max-width: 1320px) {
  body.trade-active #inventory {
    left: 76px !important;
    width: 390px !important;
  }

  body.trade-active #tradePanel {
    right: 260px !important;
    width: 380px !important;
    min-width: 360px !important;
  }

  .trade-toast {
    right: 260px !important;
  }
}

@media (max-width: 1120px) {
  body.trade-active #leaderboardPanel {
    display: none !important;
  }

  body.trade-active #inventory {
    left: 74px !important;
    width: min(390px, calc(50vw - 90px)) !important;
  }

  body.trade-active #tradePanel {
    right: 18px !important;
    width: min(390px, calc(50vw - 30px)) !important;
    min-width: 320px !important;
  }

  .trade-toast {
    right: 18px !important;
    top: 86px !important;
    min-width: min(360px, calc(100vw - 36px)) !important;
  }
}

@media (max-width: 820px) {
  body.trade-active #inventory,
  body.trade-active #tradePanel {
    left: 50% !important;
    right: auto !important;
    width: min(450px, calc(100vw - 24px)) !important;
    min-width: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  body.trade-active #inventory {
    top: 34% !important;
    height: 42vh !important;
  }

  body.trade-active #tradePanel {
    top: 72% !important;
    height: 42vh !important;
  }
}


/* v127: trade height equals inventory, remove top trade text, buttons clickable */
body.trade-active #inventory {
  left: 92px !important;
  top: 50% !important;
  transform: translate(0, -50%) !important;
  width: 420px !important;
  height: 462px !important;
  max-height: 462px !important;
  min-height: 0 !important;
  z-index: 42 !important;
}

body.trade-active #tradePanel {
  left: auto !important;
  right: 342px !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  width: min(430px, calc(100vw - 910px)) !important;
  min-width: 380px !important;
  height: 462px !important;
  max-height: 462px !important;
  min-height: 0 !important;
  z-index: 60 !important;
  overflow: hidden !important;
  pointer-events: auto !important;
}

body.trade-active #tradePanel .social-head {
  justify-content: flex-end !important;
  min-height: 34px !important;
  margin-bottom: 4px !important;
}

body.trade-active #tradePanel .social-title,
body.trade-active #tradePanel .trade-modern-title {
  display: none !important;
}

body.trade-active #tradePanel .social-close,
body.trade-active #tradePanel button {
  pointer-events: auto !important;
}

body.trade-active #tradePanel .social-body {
  height: calc(100% - 42px) !important;
  max-height: calc(100% - 42px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

body.trade-active #tradePanel .trade-modern {
  min-height: 0 !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

body.trade-active #tradePanel .trade-modern-offers {
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

body.trade-active #tradePanel .trade-modern-offer {
  min-height: 0 !important;
  padding: 10px !important;
}

body.trade-active #tradePanel .trade-stack-list {
  min-height: 102px !important;
}

body.trade-active #tradePanel .trade-modern-controls {
  flex: 0 0 auto !important;
  margin-top: 2px !important;
}

body.trade-active #tradePanel .trade-confirm-modern,
body.trade-active #tradePanel .trade-cancel-modern {
  pointer-events: auto !important;
  min-height: 42px !important;
}

@media (max-width: 1320px) {
  body.trade-active #tradePanel {
    right: 260px !important;
    width: 380px !important;
    min-width: 360px !important;
    height: 462px !important;
    max-height: 462px !important;
  }
}

@media (max-width: 1120px) {
  body.trade-active #inventory {
    left: 74px !important;
    width: min(390px, calc(50vw - 90px)) !important;
    height: 462px !important;
    max-height: 462px !important;
  }

  body.trade-active #tradePanel {
    right: 18px !important;
    width: min(390px, calc(50vw - 30px)) !important;
    min-width: 320px !important;
    height: 462px !important;
    max-height: 462px !important;
  }
}

@media (max-width: 820px) {
  body.trade-active #inventory,
  body.trade-active #tradePanel {
    left: 50% !important;
    right: auto !important;
    width: min(450px, calc(100vw - 24px)) !important;
    min-width: 0 !important;
    transform: translate(-50%, -50%) !important;
    height: 42vh !important;
    max-height: 42vh !important;
  }

  body.trade-active #inventory {
    top: 34% !important;
  }

  body.trade-active #tradePanel {
    top: 72% !important;
  }
}


/* v128: restore inventory size, show active slots during trade, hard-clickable trade buttons */
body.trade-active #inventory {
  left: 92px !important;
  top: 50% !important;
  transform: translate(0, -50%) !important;
  width: 560px !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  z-index: 42 !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

body.trade-active #inventory .inventory-shell {
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
}

body.trade-active #inventoryGrid.fancy-grid,
body.trade-active #inventory .inventory-grid.fancy-grid {
  grid-template-columns: repeat(7, 64px) !important;
  gap: 10px !important;
}

body.trade-active #inventory .inventory-slot {
  width: 64px !important;
  height: 64px !important;
}

/* Show active slots during trade, but move them to the left side instead of the old bottom center. */
body.trade-active #hotbar {
  display: grid !important;
  left: 92px !important;
  top: calc(50% + 258px) !important;
  bottom: auto !important;
  transform: none !important;
  z-index: 43 !important;
  pointer-events: auto !important;
  opacity: 1 !important;
}

body.trade-active #equipmentSlots {
  display: none !important;
}

body.trade-active #tradePanel {
  left: auto !important;
  right: 342px !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  width: 430px !important;
  min-width: 430px !important;
  height: 462px !important;
  max-height: 462px !important;
  min-height: 0 !important;
  z-index: 70 !important;
  overflow: hidden !important;
  pointer-events: auto !important;
}

body.trade-active #tradePanel,
body.trade-active #tradePanel * {
  pointer-events: auto !important;
}

body.trade-active #tradePanel .social-head {
  justify-content: flex-end !important;
  min-height: 34px !important;
  margin-bottom: 4px !important;
}

body.trade-active #tradePanel .social-title,
body.trade-active #tradePanel .trade-modern-title {
  display: none !important;
}

body.trade-active #tradePanel .social-close {
  position: relative !important;
  z-index: 75 !important;
  cursor: pointer !important;
}

body.trade-active #tradePanel .social-body {
  height: calc(100% - 42px) !important;
  max-height: calc(100% - 42px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

body.trade-active #tradePanel .trade-modern {
  min-height: 0 !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

body.trade-active #tradePanel .trade-modern-offers {
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

body.trade-active #tradePanel .trade-modern-offer {
  min-height: 0 !important;
  padding: 10px !important;
}

body.trade-active #tradePanel .trade-stack-list {
  min-height: 102px !important;
}

body.trade-active #tradePanel .trade-modern-controls {
  flex: 0 0 auto !important;
  margin-top: 2px !important;
  position: relative !important;
  z-index: 75 !important;
}

body.trade-active #tradePanel .trade-confirm-modern,
body.trade-active #tradePanel .trade-cancel-modern {
  pointer-events: auto !important;
  min-height: 42px !important;
  cursor: pointer !important;
  position: relative !important;
  z-index: 76 !important;
}

body.trade-active #tradePanel .trade-offer-slot {
  cursor: pointer !important;
}

@media (max-width: 1460px) {
  body.trade-active #tradePanel {
    right: 260px !important;
  }
}

@media (max-width: 1320px) {
  body.trade-active #inventory {
    left: 76px !important;
    width: 540px !important;
  }

  body.trade-active #hotbar {
    left: 76px !important;
  }

  body.trade-active #tradePanel {
    right: 220px !important;
    width: 410px !important;
    min-width: 410px !important;
  }
}

@media (max-width: 1160px) {
  body.trade-active #leaderboardPanel {
    display: none !important;
  }

  body.trade-active #tradePanel {
    right: 18px !important;
    width: 390px !important;
    min-width: 390px !important;
  }
}

@media (max-width: 980px) {
  body.trade-active #inventory,
  body.trade-active #tradePanel {
    left: 50% !important;
    right: auto !important;
    width: min(540px, calc(100vw - 24px)) !important;
    min-width: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  body.trade-active #inventory {
    top: 34% !important;
  }

  body.trade-active #tradePanel {
    top: 74% !important;
    height: 42vh !important;
    max-height: 42vh !important;
  }

  body.trade-active #hotbar {
    left: 50% !important;
    top: calc(34% + 250px) !important;
    transform: translateX(-50%) !important;
  }
}


/* v129: restore blue inventory-style panels and admin panel */
.game-panel:not(.inventory),
.settings-panel,
.social-panel,
.admin-panel,
.craft-social-panel {
  background: linear-gradient(180deg, #0d688d 0%, #095776 100%) !important;
  border: 4px solid #084e6b !important;
  box-shadow: 0 22px 90px rgba(0,0,0,0.48), inset 0 2px 0 rgba(255,255,255,0.10) !important;
  color: #edf8ff !important;
  backdrop-filter: none !important;
}

.social-panel.hidden,
.admin-panel.hidden,
.game-panel.hidden,
.settings-panel.hidden {
  display: none !important;
}

.social-card,
.admin-row,
.admin-item-row,
.admin-target,
.admin-mode-row,
.catalog-card,
.detail-panel,
.trade-modern-title,
.trade-modern-offer,
.trade-stack-list {
  background: rgba(145, 207, 226, 0.22) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  color: #edf8ff !important;
}

.social-title,
.admin-title,
.social-label,
.admin-mode-main b,
.admin-row-main b,
.admin-item-label b,
.catalog-title,
.detail-title {
  color: #ffffff !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.18) !important;
}

.social-muted,
.admin-help,
.admin-target,
.admin-row-main span,
.admin-item-label span,
.admin-mode-main span,
.catalog-desc,
.detail-desc {
  color: rgba(237,248,255,0.78) !important;
}

.social-close,
.admin-close,
.panel-close,
[data-close-panel] {
  background: rgba(92, 171, 214, 0.78) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  color: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.15), 0 6px 14px rgba(0,0,0,0.18) !important;
}

.social-tabs button,
.admin-tabs button,
.craft-category-tab,
.build-category-tab,
.shop-category-tab,
.admin-mode-toggle {
  background: rgba(6, 44, 63, 0.55) !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
  color: #eaf7ff !important;
}

.social-tabs button.active,
.admin-tabs button.active,
.craft-category-tab.active,
.build-category-tab.active,
.shop-category-tab.active,
.admin-row.selected,
.admin-item-row.selected,
.admin-mode-row.enabled {
  background: rgba(116, 190, 255, 0.34) !important;
  border-color: rgba(255, 211, 106, 0.58) !important;
  color: #ffffff !important;
}

/* Admin panel must not be affected by trade-specific positioning. */
.admin-panel {
  right: 18px !important;
  top: 132px !important;
  left: auto !important;
  transform: none !important;
  width: min(720px, calc(100vw - 36px)) !important;
  max-height: min(720px, calc(100vh - 170px)) !important;
  z-index: 82 !important;
  display: flex;
  flex-direction: column;
  overflow: hidden !important;
}

.admin-panel.hidden {
  display: none !important;
}

.admin-body {
  min-height: 0 !important;
  overflow: hidden !important;
}

.admin-list,
.admin-item-list,
.admin-mode-list {
  min-height: 0 !important;
  overflow-y: auto !important;
}

.admin-mode-row {
  cursor: pointer !important;
}

.admin-mode-toggle {
  cursor: pointer !important;
}

/* Craft/build/shop should keep blue panels, not black panels. */
.craft-panel.game-panel,
.build-panel.game-panel,
.shop-panel.game-panel,
.settings-panel.game-panel {
  background: linear-gradient(180deg, #0d688d 0%, #095776 100%) !important;
  border: 4px solid #084e6b !important;
}

/* Keep inventory original style untouched. */
.inventory.game-panel.modern-panel {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Trade remains functional but blue, not black. */
#tradePanel.social-panel {
  background: linear-gradient(180deg, #0d688d 0%, #095776 100%) !important;
  border: 4px solid #084e6b !important;
}

#tradePanel .trade-modern-offer,
#tradePanel .trade-stack-list {
  background: rgba(6, 44, 63, 0.38) !important;
}

#tradePanel .trade-confirm-modern {
  background: linear-gradient(180deg, #34d073 0%, #16a956 100%) !important;
}

#tradePanel .trade-cancel-modern {
  background: linear-gradient(180deg, #e04f4f 0%, #a92228 100%) !important;
}


/* v130: trade buttons above everything + restore normal hotbar/equipment during trade */
body.trade-active #tradePanel {
  z-index: 420 !important;
  pointer-events: auto !important;
}

body.trade-active #tradePanel,
body.trade-active #tradePanel * {
  pointer-events: auto !important;
}

body.trade-active #tradePanel .social-head,
body.trade-active #tradePanel .social-close,
body.trade-active #tradePanel .trade-modern-controls,
body.trade-active #tradePanel .trade-confirm-modern,
body.trade-active #tradePanel .trade-cancel-modern {
  position: relative !important;
  z-index: 430 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

body.trade-active #tradePanel .social-close {
  width: 34px !important;
  height: 34px !important;
}

/* Restore active slots to their normal game position during trade. */
body.trade-active #hotbar {
  display: grid !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 22px !important;
  transform: translateX(-50%) !important;
  z-index: 80 !important;
  pointer-events: auto !important;
  opacity: 1 !important;
}

body.trade-active #equipmentSlots {
  display: grid !important;
  left: calc(50% - 455px) !important;
  right: auto !important;
  top: auto !important;
  bottom: 22px !important;
  transform: none !important;
  z-index: 80 !important;
  pointer-events: auto !important;
  opacity: 1 !important;
}

/* Keep inventory away from the left dock, but don't let it break the original grid. */
body.trade-active #inventory {
  left: 92px !important;
  top: 50% !important;
  transform: translate(0, -50%) !important;
  width: 560px !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

body.trade-active #inventoryGrid.fancy-grid,
body.trade-active #inventory .inventory-grid.fancy-grid {
  grid-template-columns: repeat(7, 64px) !important;
  gap: 10px !important;
}

@media (max-width: 980px) {
  body.trade-active #hotbar {
    left: 50% !important;
    bottom: 86px !important;
    transform: translateX(-50%) !important;
  }

  body.trade-active #equipmentSlots {
    left: 14px !important;
    bottom: 98px !important;
  }
}


/* v131: clean left dock buttons, no cut/chipped edges */
.action-dock {
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  padding: 4px 8px 14px 8px !important;
  gap: 10px !important;
  contain: none !important;
}

.action-dock .dock-button {
  width: 54px !important;
  height: 54px !important;
  padding: 7px !important;
  border-radius: 13px !important;
  overflow: visible !important;
  contain: none !important;
  background: linear-gradient(180deg, #75bcff 0%, #4e92e0 52%, #2e62b9 100%) !important;
  border: 2px solid #11366c !important;
  box-shadow:
    0 5px 0 #0e2a55,
    0 10px 14px rgba(0,0,0,0.26),
    inset 0 1px 0 rgba(255,255,255,0.30),
    inset 0 -2px 0 rgba(0,0,0,0.18) !important;
  transform: none !important;
  transition: transform 120ms ease, filter 120ms ease, box-shadow 120ms ease, background 120ms ease !important;
}

.action-dock .dock-button:hover,
.action-dock .dock-button.active {
  transform: translateY(-1px) !important;
  background: linear-gradient(180deg, #8ccbff 0%, #5ca1ec 52%, #356dc9 100%) !important;
  border-color: #173f7d !important;
  box-shadow:
    0 6px 0 #0e2a55,
    0 12px 16px rgba(0,0,0,0.28),
    0 0 0 2px rgba(255,211,106,0.20),
    inset 0 1px 0 rgba(255,255,255,0.34),
    inset 0 -2px 0 rgba(0,0,0,0.16) !important;
}

.action-dock .dock-button img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  display: block !important;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.35)) !important;
}

.action-dock .dock-button span {
  right: 3px !important;
  bottom: 2px !important;
  min-width: 16px !important;
  padding: 1px 4px !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,0.68) !important;
  color: #fff4b0 !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
}

.action-dock .dock-button.text-dock {
  font-size: 24px !important;
  line-height: 1 !important;
}

/* Inner tabs in admin/trade/settings must have room for 3D bottom shadow. */
.social-tabs,
.admin-tabs,
.settings-tabs,
.panel-tabs,
.craft-category-tabs,
.build-category-tabs,
.shop-category-tabs {
  overflow: visible !important;
  padding-top: 4px !important;
  padding-bottom: 10px !important;
}

.social-tabs button,
.admin-tabs button,
.settings-tabs button,
.panel-tab,
.craft-category-tab,
.build-category-tab,
.shop-category-tab {
  overflow: visible !important;
  contain: none !important;
  margin-bottom: 4px !important;
}

/* Avoid active/hover tab being cut at the top or bottom. */
.social-tabs button:hover,
.social-tabs button.active,
.admin-tabs button:hover,
.admin-tabs button.active,
.settings-tabs button:hover,
.settings-tabs button.active,
.panel-tab:hover,
.panel-tab.active {
  transform: translateY(-1px) !important;
}


/* v132: environment indicators near minimap */
.env-indicators {
  position: fixed;
  right: 16px;
  top: 238px;
  width: 188px;
  display: grid;
  gap: 7px;
  z-index: 20;
  pointer-events: none;
  user-select: none;
}

.env-indicators.hidden {
  display: none !important;
}

.env-row {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto 8px;
  gap: 3px 8px;
  padding: 7px 9px;
  border-radius: 12px;
  background: rgba(8, 12, 20, 0.66);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 8px 18px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.08);
  opacity: 0.58;
}

.env-row.active {
  opacity: 1;
}

.env-row span,
.env-row b {
  font-size: 11px;
  font-weight: 950;
  color: #edf8ff;
  text-shadow: 0 1px 0 rgba(0,0,0,0.45);
}

.env-row b {
  text-align: right;
}

.env-row i {
  grid-column: 1 / -1;
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(0,0,0,0.45);
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.45);
}

.env-row em {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  transition: width 160ms linear;
}

.env-row.heat em {
  background: linear-gradient(90deg, #ffba45, #ff573d);
}

.env-row.cold em {
  background: linear-gradient(90deg, #78ecff, #4b8dff);
}

.env-row.radiation em {
  background: linear-gradient(90deg, #a7ff5b, #39d75c);
}

@media (max-width: 900px) {
  .env-indicators {
    right: 10px;
    top: 202px;
    width: 160px;
  }
}


/* v133: asset loading screen */
.loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 50% 35%, rgba(53, 153, 215, 0.22), transparent 32%),
    linear-gradient(180deg, rgba(7, 18, 28, 0.98), rgba(3, 8, 14, 0.98));
  color: #edf8ff;
  user-select: none;
  pointer-events: auto;
}

.loading-overlay.hidden {
  display: none !important;
}

.loading-card {
  width: min(440px, calc(100vw - 36px));
  padding: 28px 26px 24px;
  border-radius: 24px;
  background: linear-gradient(180deg, #0d688d 0%, #095776 100%);
  border: 4px solid #084e6b;
  box-shadow:
    0 22px 90px rgba(0,0,0,0.52),
    inset 0 2px 0 rgba(255,255,255,0.13),
    inset 0 -4px 0 rgba(0,0,0,0.18);
  text-align: center;
}

.loading-logo {
  font-size: 42px;
  line-height: 1;
  font-weight: 1000;
  letter-spacing: 1px;
  color: #ffffff;
  text-shadow: 0 4px 0 rgba(0,0,0,0.18), 0 0 20px rgba(117,203,255,0.25);
  margin-bottom: 16px;
}

.loading-title {
  font-size: 18px;
  font-weight: 950;
  margin-bottom: 6px;
}

.loading-status {
  min-height: 20px;
  font-size: 13px;
  font-weight: 750;
  color: rgba(237,248,255,0.78);
  margin-bottom: 14px;
}

.loading-bar {
  width: 100%;
  height: 18px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(0,0,0,0.38);
  border: 1px solid rgba(255,255,255,0.18);
  box-shadow: inset 0 2px 5px rgba(0,0,0,0.42);
}

.loading-fill {
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #7cc0ff, #5cffb0);
  transition: width 160ms linear;
  box-shadow: 0 0 18px rgba(92,255,176,0.42);
}

.loading-percent {
  margin-top: 8px;
  font-size: 13px;
  font-weight: 950;
  color: #ffffff;
}

.loading-hint {
  margin-top: 14px;
  font-size: 12px;
  line-height: 1.35;
  color: rgba(237,248,255,0.62);
}

body.assets-loading #loginOverlay,
body.assets-loading #hotbar,
body.assets-loading #equipmentSlots,
body.assets-loading #inventory,
body.assets-loading #actionDock,
body.assets-loading #minimap,
body.assets-loading #envIndicators,
body.assets-loading #leaderboardPanel {
  pointer-events: none !important;
}


/* v138: zoom moved to left, ping panel moved to right bottom */
.viewport-controls {
  left: 18px !important;
  right: auto !important;
  bottom: 24px !important;
  z-index: 95 !important;
}

.ping-panel {
  position: fixed;
  right: 18px;
  bottom: 24px;
  z-index: 96;
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 112px;
  height: 38px;
  box-sizing: border-box;
  padding: 0 12px;
  border-radius: 14px;
  background: rgba(8, 12, 20, 0.70);
  border: 1px solid rgba(255,255,255,0.16);
  box-shadow: 0 10px 24px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.08);
  backdrop-filter: blur(8px);
  color: #edf8ff;
  user-select: none;
  pointer-events: none;
  font-weight: 950;
}

.ping-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #8d99a8;
  box-shadow: 0 0 10px rgba(141,153,168,0.45);
}

.ping-label {
  font-size: 10px;
  letter-spacing: 0.7px;
  color: rgba(237,248,255,0.70);
}

#pingValue {
  margin-left: auto;
  font-size: 12px;
  color: #ffffff;
}

.ping-panel.good .ping-dot {
  background: #5cff9d;
  box-shadow: 0 0 12px rgba(92,255,157,0.58);
}

.ping-panel.warn .ping-dot {
  background: #ffd36a;
  box-shadow: 0 0 12px rgba(255,211,106,0.54);
}

.ping-panel.bad .ping-dot {
  background: #ff5b5b;
  box-shadow: 0 0 12px rgba(255,91,91,0.58);
}

.ping-panel.offline {
  opacity: 0.68;
}

.ping-panel.offline #pingValue {
  color: rgba(237,248,255,0.62);
}

@media (max-width: 760px) {
  .viewport-controls {
    left: 10px !important;
    bottom: 12px !important;
  }

  .ping-panel {
    right: 10px;
    bottom: 12px;
    min-width: 98px;
    padding: 0 9px;
  }

  .ping-label {
    display: none;
  }
}

/* v139: account profile menu with persistent statistics */
.main-profile-card-v139 {
  display: flex;
  flex-direction: column;
  gap: 14px;
  color: #edf8ff;
}

.main-profile-head-v139 {
  display: grid;
  grid-template-columns: 78px 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 14px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(31,75,104,0.88), rgba(15,40,61,0.88));
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.10);
}

.main-profile-avatar-v139 {
  width: 74px;
  height: 74px;
  border-radius: 22px;
  background: rgba(255,255,255,0.10) center/cover no-repeat;
  border: 2px solid rgba(255,255,255,0.20);
  display: grid;
  place-items: center;
  color: #fff2b6;
  font-size: 28px;
  font-weight: 1000;
  box-shadow: 0 10px 22px rgba(0,0,0,0.25);
}

.main-profile-info-v139 {
  min-width: 0;
}

.main-profile-name-v139 {
  font-size: 20px;
  font-weight: 1000;
  color: #ffffff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.main-profile-sub-v139,
.main-profile-id-v139 {
  margin-top: 3px;
  font-size: 12px;
  font-weight: 750;
  color: rgba(237,248,255,0.68);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.main-profile-refresh-v139 {
  padding: 9px 12px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 950;
}

.main-profile-summary-v139 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.main-profile-summary-tile-v139 {
  padding: 10px;
  border-radius: 14px;
  background: rgba(255,255,255,0.09);
  border: 1px solid rgba(255,255,255,0.11);
  text-align: center;
}

.main-profile-summary-tile-v139 span {
  display: block;
  font-size: 11px;
  font-weight: 850;
  color: rgba(237,248,255,0.64);
}

.main-profile-summary-tile-v139 b {
  display: block;
  margin-top: 5px;
  color: #fff2b6;
  font-size: 15px;
  font-weight: 1000;
}

.main-profile-expbar-v139 {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.12);
}

.main-profile-expbar-v139 > div {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #65b7ff, #5cff9d);
  box-shadow: 0 0 16px rgba(92,255,157,0.35);
}

.main-profile-badges-v139,
.main-profile-stat-card-v139,
.main-profile-empty {
  padding: 12px;
  border-radius: 16px;
  background: rgba(8, 12, 20, 0.43);
  border: 1px solid rgba(255,255,255,0.10);
}

.main-profile-section-title-v139,
.main-profile-stat-head-v139 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 9px;
  color: #ffd36a;
  font-size: 13px;
  font-weight: 1000;
}

.main-profile-stat-head-v139 span {
  padding: 3px 8px;
  border-radius: 9px;
  background: rgba(255,211,106,0.12);
  color: #fff2b6;
}

.main-profile-badge-grid-v139 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.main-profile-badge-v139 {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: rgba(255,255,255,0.10) center/contain no-repeat;
  border: 1px solid rgba(255,255,255,0.14);
  display: grid;
  place-items: center;
  color: #fff2b6;
  font-size: 12px;
  font-weight: 1000;
}

.main-profile-stats-grid-v139 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.main-profile-stat-row-v139 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
  border-top: 1px solid rgba(255,255,255,0.07);
  font-size: 12px;
  font-weight: 800;
  color: rgba(237,248,255,0.76);
}

.main-profile-stat-row-v139 span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-profile-stat-row-v139 b {
  color: #ffffff;
  font-weight: 1000;
}

.main-profile-empty,
.main-profile-empty-line-v139,
.main-profile-subtitle-v139 {
  color: rgba(237,248,255,0.58);
  font-size: 12px;
  line-height: 1.35;
}

.main-profile-empty {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.main-profile-subtitle-v139 {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,211,106,0.78);
  font-weight: 900;
}

@media (max-width: 760px) {
  .main-profile-head-v139 {
    grid-template-columns: 58px 1fr;
  }

  .main-profile-avatar-v139 {
    width: 56px;
    height: 56px;
    border-radius: 16px;
  }

  .main-profile-refresh-v139 {
    grid-column: 1 / -1;
  }

  .main-profile-summary-v139,
  .main-profile-stats-grid-v139 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* v140: main menu tab cleanup + leaderboard tab */
.ahardice-main-menu:not(.main-tab-play) .ahardice-center-card {
  display: none !important;
}

.ahardice-main-menu.main-tab-leaderboard .main-side-panel {
  left: 188px;
  top: 132px;
  width: min(960px, calc(100vw - 226px));
  max-height: calc(100vh - 164px);
}

.ahardice-main-menu.main-tab-profile .main-side-panel,
.ahardice-main-menu.main-tab-shop .main-side-panel,
.ahardice-main-menu.main-tab-clans .main-side-panel,
.ahardice-main-menu.main-tab-skins .main-side-panel {
  left: 188px;
  width: min(650px, calc(100vw - 226px));
}

.main-leaderboard-root-v140 {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.main-leaderboard-toolbar-v140 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(31,75,104,0.86), rgba(15,40,61,0.86));
  border: 1px solid rgba(255,255,255,0.13);
}

.main-leaderboard-toolbar-v140 b {
  display: block;
  color: #ffffff;
  font-size: 18px;
  font-weight: 1000;
}

.main-leaderboard-toolbar-v140 span {
  display: block;
  margin-top: 3px;
  color: rgba(237,248,255,0.65);
  font-size: 12px;
  font-weight: 750;
}

.main-leaderboard-refresh-v140 {
  min-width: 104px;
  padding: 9px 13px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 950;
}

.main-leaderboard-grid-v140 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.main-leaderboard-card-v140 {
  min-height: 360px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(8, 12, 20, 0.56);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

.main-leaderboard-card-title-v140 {
  margin-bottom: 10px;
  color: #fff2b6;
  font-size: 17px;
  font-weight: 1000;
  text-shadow: 0 2px 5px rgba(0,0,0,0.35);
}

.main-leaderboard-list-v140 {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.main-leaderboard-row-v140 {
  display: grid;
  grid-template-columns: 42px 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 9px;
  border-radius: 14px;
  background: rgba(255,255,255,0.075);
  border: 1px solid rgba(255,255,255,0.085);
}

.main-leaderboard-row-v140.top-1 {
  background: linear-gradient(180deg, rgba(255,211,106,0.22), rgba(255,211,106,0.08));
  border-color: rgba(255,211,106,0.34);
}

.main-leaderboard-row-v140.top-2 {
  background: linear-gradient(180deg, rgba(210,230,255,0.18), rgba(210,230,255,0.07));
  border-color: rgba(210,230,255,0.26);
}

.main-leaderboard-row-v140.top-3 {
  background: linear-gradient(180deg, rgba(224,137,73,0.19), rgba(224,137,73,0.07));
  border-color: rgba(224,137,73,0.28);
}

.main-leaderboard-rank-v140 {
  color: #ffffff;
  font-size: 16px;
  font-weight: 1000;
  text-align: center;
}

.main-leaderboard-avatar-v140 {
  width: 42px;
  height: 42px;
  border-radius: 13px;
  background: rgba(255,255,255,0.10) center/cover no-repeat;
  display: grid;
  place-items: center;
  color: #fff2b6;
  font-size: 17px;
  font-weight: 1000;
  border: 1px solid rgba(255,255,255,0.15);
}

.main-leaderboard-info-v140 {
  min-width: 0;
}

.main-leaderboard-name-v140 {
  color: #ffffff;
  font-size: 14px;
  font-weight: 1000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.main-leaderboard-sub-v140 {
  margin-top: 2px;
  color: rgba(237,248,255,0.62);
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.main-leaderboard-value-v140 {
  min-width: 76px;
  text-align: right;
}

.main-leaderboard-value-v140 b {
  display: block;
  color: #5cff9d;
  font-size: 15px;
  font-weight: 1000;
}

.main-leaderboard-value-v140 span {
  display: block;
  margin-top: 1px;
  color: rgba(237,248,255,0.58);
  font-size: 10px;
  font-weight: 850;
}

.main-leaderboard-empty-v140,
.main-leaderboard-hint-v140 {
  padding: 12px;
  border-radius: 14px;
  background: rgba(255,255,255,0.055);
  color: rgba(237,248,255,0.68);
  font-size: 12px;
  font-weight: 750;
}

.main-leaderboard-hint-v140 {
  text-align: center;
}

@media (max-width: 980px) {
  .ahardice-main-menu.main-tab-leaderboard .main-side-panel,
  .ahardice-main-menu.main-tab-profile .main-side-panel,
  .ahardice-main-menu.main-tab-shop .main-side-panel,
  .ahardice-main-menu.main-tab-clans .main-side-panel,
  .ahardice-main-menu.main-tab-skins .main-side-panel {
    left: 138px;
    width: calc(100vw - 152px);
    top: 128px;
  }

  .main-leaderboard-grid-v140 {
    grid-template-columns: 1fr;
  }
}


/* v141: leaderboard/menu polish */
.main-leaderboard-toolbar-v140,
.main-leaderboard-hint-v140 {
  display: none !important;
}

.ahardice-main-menu.main-tab-leaderboard .main-side-panel {
  left: 50% !important;
  top: 132px !important;
  transform: translateX(-50%) !important;
  width: min(960px, calc(100vw - 220px)) !important;
  max-height: calc(100vh - 164px) !important;
}

.ahardice-main-menu.main-tab-profile .main-side-panel {
  left: 50% !important;
  top: 132px !important;
  transform: translateX(-50%) !important;
  width: min(720px, calc(100vw - 220px)) !important;
  max-height: calc(100vh - 164px) !important;
}

.ahardice-main-menu.main-tab-leaderboard .main-menu-content,
.ahardice-main-menu.main-tab-profile .main-menu-content {
  text-align: left;
}

.main-menu-panel-switching-v141 {
  animation: mainMenuPanelFadeSlideV141 180ms ease-out both;
}

@keyframes mainMenuPanelFadeSlideV141 {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(10px) scale(0.985);
    filter: blur(2px);
  }
  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0) scale(1);
    filter: blur(0);
  }
}

.main-menu-content:not(.hidden) {
  transition: opacity 180ms ease, transform 180ms ease, filter 180ms ease;
}

.ahardice-main-menu.main-tab-play .main-side-panel {
  opacity: 0;
  pointer-events: none;
}

.main-leaderboard-root-v140 {
  gap: 0;
}

.main-leaderboard-grid-v140 {
  align-items: stretch;
}

.main-leaderboard-sub-v140:empty {
  display: none;
}

@media (max-width: 980px) {
  .ahardice-main-menu.main-tab-leaderboard .main-side-panel,
  .ahardice-main-menu.main-tab-profile .main-side-panel {
    left: 50% !important;
    width: calc(100vw - 150px) !important;
    top: 128px !important;
    transform: translateX(-50%) !important;
  }
}

@media (max-width: 760px) {
  .ahardice-main-menu.main-tab-leaderboard .main-side-panel,
  .ahardice-main-menu.main-tab-profile .main-side-panel {
    left: 50% !important;
    width: calc(100vw - 24px) !important;
    top: 116px !important;
    transform: translateX(-50%) !important;
  }
}


/* v142: shop/cosmetics coming soon panels */
.ahardice-main-menu.main-tab-shop .main-side-panel,
.ahardice-main-menu.main-tab-skins .main-side-panel {
  left: 50% !important;
  top: 132px !important;
  transform: translateX(-50%) !important;
  width: min(650px, calc(100vw - 220px)) !important;
  max-height: calc(100vh - 164px) !important;
}

.main-coming-soon-v142 {
  min-height: 260px;
  display: grid;
  place-items: center;
  text-align: center;
  border-radius: 20px;
  background: rgba(8, 12, 20, 0.42);
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

.main-coming-soon-v142 b {
  color: #fff2b6;
  font-size: clamp(28px, 4vw, 46px);
  font-weight: 1000;
  letter-spacing: 0.2px;
  text-shadow: 0 4px 10px rgba(0,0,0,0.42);
}

@media (max-width: 980px) {
  .ahardice-main-menu.main-tab-shop .main-side-panel,
  .ahardice-main-menu.main-tab-skins .main-side-panel {
    left: 50% !important;
    width: calc(100vw - 150px) !important;
    top: 128px !important;
    transform: translateX(-50%) !important;
  }
}

@media (max-width: 760px) {
  .ahardice-main-menu.main-tab-shop .main-side-panel,
  .ahardice-main-menu.main-tab-skins .main-side-panel {
    left: 50% !important;
    width: calc(100vw - 24px) !important;
    top: 116px !important;
    transform: translateX(-50%) !important;
  }
}


/* v143: minimap tabs + environment bars with endpoint icons */
.minimap-tools {
  position: fixed;
  right: 206px;
  top: 18px;
  width: 190px;
  z-index: 21;
  display: grid;
  gap: 8px;
  pointer-events: auto;
  user-select: none;
}

.minimap-tool-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
  padding: 7px;
  border-radius: 15px;
  background: rgba(8, 12, 20, 0.58);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 12px 28px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.08);
  backdrop-filter: blur(8px);
}

.minimap-tool-tab {
  width: 52px;
  height: 46px;
  padding: 8px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(82, 162, 226, 0.96), rgba(48, 104, 191, 0.96));
  border: 2px solid rgba(16, 48, 101, 0.92);
  box-shadow: 0 4px 0 rgba(10, 31, 65, 0.80), inset 0 1px 0 rgba(255,255,255,0.28);
  cursor: pointer;
}

.minimap-tool-tab:hover,
.minimap-tool-tab.active {
  transform: translateY(-1px);
  background: linear-gradient(180deg, rgba(104, 184, 244, 0.98), rgba(59, 125, 211, 0.98));
}

.minimap-tool-tab.danger {
  background: linear-gradient(180deg, rgba(255, 126, 103, 0.98), rgba(201, 60, 61, 0.98));
  border-color: rgba(112, 28, 36, 0.92);
  box-shadow: 0 4px 0 rgba(86, 22, 29, 0.82), inset 0 1px 0 rgba(255,255,255,0.26);
}

.minimap-tool-tab img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  pointer-events: none;
  filter: drop-shadow(0 2px 2px rgba(0,0,0,0.38));
}

.minimap-tools .env-indicators {
  position: static !important;
  width: 100% !important;
  display: grid;
  gap: 7px;
  z-index: auto;
  pointer-events: none;
}

.minimap-tools .env-indicators.hidden {
  display: none !important;
}

.minimap-tools .env-row {
  position: relative;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto 12px;
  gap: 4px 8px;
  padding: 7px 10px 9px;
  border-radius: 13px;
  background: rgba(8, 12, 20, 0.64);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 8px 18px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.08);
}

.minimap-tools .env-row i {
  position: relative;
  grid-column: 1 / -1;
  height: 12px;
  overflow: visible;
  border-radius: 999px;
  background: rgba(0,0,0,0.45);
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.48);
}

.minimap-tools .env-row em {
  height: 100%;
  min-width: 0;
  border-radius: inherit;
}

.env-progress-icon {
  position: absolute;
  top: 50%;
  left: calc(var(--env-pct, 0%) - 9px);
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  object-fit: contain;
  filter: drop-shadow(0 2px 2px rgba(0,0,0,0.58));
  pointer-events: none;
  transition: left 160ms linear;
}

.env-row:not(.active) .env-progress-icon {
  opacity: 0.46;
}

.hud-hidden-in-menu {
  display: none !important;
}

body.menu-open .minimap-tools {
  display: none !important;
}

@media (max-width: 980px) {
  .minimap-tools {
    right: 170px;
    top: 16px;
    width: 166px;
  }

  .minimap-tool-tab {
    width: 45px;
    height: 40px;
    padding: 7px;
  }
}

@media (max-width: 720px) {
  .minimap-tools {
    right: 10px;
    top: 172px;
    width: 160px;
  }
}


/* v146: exact layout - tools on the RIGHT SIDE of the minimap */
.minimap {
  position: fixed !important;
  left: 18px !important;
  right: auto !important;
  top: 18px !important;
  width: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  z-index: 24 !important;
}

#minimapCanvas {
  width: 174px !important;
  height: 174px !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  background: transparent !important;
}

.minimap-tools {
  position: fixed !important;
  left: 204px !important;
  right: auto !important;
  top: 18px !important;
  width: 188px !important;
  z-index: 25 !important;
  display: grid !important;
  gap: 8px !important;
  pointer-events: auto !important;
  user-select: none !important;
}

.minimap-tool-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 7px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.minimap-tool-tab {
  width: auto !important;
  height: 44px !important;
  padding: 8px !important;
  border-radius: 12px !important;
}

.minimap-tools .env-indicators {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: 100% !important;
  display: grid !important;
  gap: 7px !important;
  z-index: auto !important;
  pointer-events: none !important;
}

.minimap-tools .env-indicators.hidden {
  display: none !important;
}

body.menu-open .minimap,
body.menu-open .minimap-tools {
  display: none !important;
}

@media (max-width: 900px) {
  .minimap {
    left: 10px !important;
    top: 12px !important;
  }

  #minimapCanvas {
    width: 150px !important;
    height: 150px !important;
  }

  .minimap-tools {
    left: 168px !important;
    top: 12px !important;
    width: 160px !important;
  }

  .minimap-tool-tab {
    height: 40px !important;
    padding: 7px !important;
  }
}

@media (max-width: 520px) {
  .minimap-tools {
    left: 10px !important;
    top: 170px !important;
    width: 150px !important;
  }
}


/* v147: restore minimap size and add thin black outline */
.minimap {
  position: fixed !important;
  left: 18px !important;
  right: auto !important;
  top: 18px !important;
  width: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  z-index: 24 !important;
}

/* Do not force new minimap size here. These values restore the old game minimap size. */
#minimapCanvas {
  width: 228px !important;
  height: 228px !important;
  display: block !important;
  border: 1px solid rgba(0, 0, 0, 0.92) !important;
  box-sizing: border-box !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  background: transparent !important;
}

/* Buttons start after restored minimap width: 18px + 228px + 12px */
.minimap-tools {
  position: fixed !important;
  left: 258px !important;
  right: auto !important;
  top: 18px !important;
  width: 188px !important;
  z-index: 25 !important;
  display: grid !important;
  gap: 8px !important;
  pointer-events: auto !important;
  user-select: none !important;
}

@media (max-width: 900px) {
  .minimap {
    left: 10px !important;
    top: 12px !important;
  }

  #minimapCanvas {
    width: 180px !important;
    height: 180px !important;
  }

  .minimap-tools {
    left: 202px !important;
    top: 12px !important;
    width: 160px !important;
  }
}

@media (max-width: 520px) {
  .minimap-tools {
    left: 10px !important;
    top: 202px !important;
    width: 180px !important;
  }
}


/* v148: Ahardice-like panels redesign for craft/build/shop, clans and trade */
:root {
  --dyn-panel-blue: #087fa5;
  --dyn-panel-blue-2: #076f96;
  --dyn-panel-dark: #0a628c;
  --dyn-panel-border: #053244;
  --dyn-black-border: rgba(0,0,0,0.78);
  --dyn-row-grey: #666472;
  --dyn-row-selected: #b9a9b8;
  --dyn-scroll: #8fd0ee;
  --dyn-green: #83dd3e;
  --dyn-green-dark: #55aa2a;
  --dyn-yellow: #ffcb33;
  --dyn-yellow-dark: #c68a12;
}

/* Common blue frame */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel,
#clanPanel.social-panel,
#tradePanel.social-panel {
  background: linear-gradient(180deg, var(--dyn-panel-blue), var(--dyn-panel-blue-2)) !important;
  border: 3px solid var(--dyn-black-border) !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 0 rgba(0,0,0,0.55), 0 18px 48px rgba(0,0,0,0.38) !important;
  color: #f0fbff !important;
  font-family: Arial, sans-serif !important;
  text-shadow: 0 2px 1px rgba(0,0,0,0.42);
}

/* Craft / Build / Shop like first screenshot */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel {
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  width: min(640px, calc(100vw - 24px)) !important;
  height: min(384px, calc(100vh - 34px)) !important;
  padding: 10px 16px 10px 10px !important;
  overflow: hidden !important;
}

#craftPanel .floating-close,
#buildPanel .floating-close,
#shopPanel .floating-close,
#clanPanel .social-close,
#tradePanel .social-close {
  position: absolute !important;
  right: 12px !important;
  top: 12px !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  padding: 0 !important;
  border-radius: 6px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(180deg, #3ba4cf, #1780ae) !important;
  border: 1px solid rgba(0,0,0,0.55) !important;
  color: #d9f5ff !important;
  font-size: 30px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.28) !important;
  z-index: 6 !important;
}

#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs,
#shopPanel #shopBalance {
  display: none !important;
}

#craftPanel .craft-shell,
#buildPanel .craft-shell,
#shopPanel .craft-shell {
  display: grid !important;
  grid-template-columns: 288px minmax(0, 1fr) !important;
  gap: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
}

#craftPanel .craft-list-wrap,
#buildPanel .craft-list-wrap,
#shopPanel .craft-list-wrap {
  min-width: 0 !important;
  display: block !important;
  background: #0b6490 !important;
  border-right: 9px solid #062839 !important;
  border-radius: 2px 0 0 2px !important;
  overflow: hidden !important;
  height: 100% !important;
}

#craftPanel .craft-list-title,
#buildPanel .craft-list-title,
#shopPanel .craft-list-title {
  display: none !important;
}

#craftPanel .craft-list,
#buildPanel .craft-list,
#shopPanel .craft-list {
  height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 0 7px 0 0 !important;
  scrollbar-width: auto !important;
  scrollbar-color: var(--dyn-scroll) transparent !important;
}

#craftPanel .craft-list::-webkit-scrollbar,
#buildPanel .craft-list::-webkit-scrollbar,
#shopPanel .craft-list::-webkit-scrollbar,
#clanPanel .social-body::-webkit-scrollbar,
#tradePanel .social-body::-webkit-scrollbar,
#tradePanel .ahardice-trade-list-v148::-webkit-scrollbar,
#clanPanel .ahardice-clan-list-v148::-webkit-scrollbar {
  width: 18px !important;
}

#craftPanel .craft-list::-webkit-scrollbar-track,
#buildPanel .craft-list::-webkit-scrollbar-track,
#shopPanel .craft-list::-webkit-scrollbar-track,
#clanPanel .social-body::-webkit-scrollbar-track,
#tradePanel .social-body::-webkit-scrollbar-track,
#tradePanel .ahardice-trade-list-v148::-webkit-scrollbar-track,
#clanPanel .ahardice-clan-list-v148::-webkit-scrollbar-track {
  background: transparent !important;
}

#craftPanel .craft-list::-webkit-scrollbar-thumb,
#buildPanel .craft-list::-webkit-scrollbar-thumb,
#shopPanel .craft-list::-webkit-scrollbar-thumb,
#clanPanel .social-body::-webkit-scrollbar-thumb,
#tradePanel .social-body::-webkit-scrollbar-thumb,
#tradePanel .ahardice-trade-list-v148::-webkit-scrollbar-thumb,
#clanPanel .ahardice-clan-list-v148::-webkit-scrollbar-thumb {
  background: var(--dyn-scroll) !important;
  border-radius: 12px !important;
  border: 4px solid transparent !important;
  background-clip: content-box !important;
}

#craftPanel .craft-list-item,
#buildPanel .craft-list-item,
#shopPanel .craft-list-item {
  width: 100% !important;
  min-height: 39px !important;
  margin: 0 !important;
  padding: 4px 10px 4px 12px !important;
  border-radius: 0 !important;
  border: none !important;
  border-bottom: 3px solid #064b64 !important;
  display: grid !important;
  grid-template-columns: 28px 1fr !important;
  gap: 8px !important;
  align-items: center !important;
  text-align: left !important;
  background: var(--dyn-row-grey) !important;
  color: #e8e8e8 !important;
  box-shadow: none !important;
}

#craftPanel .craft-list-item.selected,
#buildPanel .craft-list-item.selected,
#shopPanel .craft-list-item.selected {
  background: var(--dyn-row-selected) !important;
  border-color: #064b64 !important;
  box-shadow: none !important;
}

#craftPanel .craft-list-icon,
#buildPanel .craft-list-icon,
#shopPanel .craft-list-icon {
  width: 28px !important;
  height: 28px !important;
  border: none !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-size: contain !important;
  filter: drop-shadow(0 2px 1px rgba(0,0,0,0.45));
}

#craftPanel .craft-list-name,
#buildPanel .craft-list-name,
#shopPanel .craft-list-name {
  font-size: 16px !important;
  font-weight: 950 !important;
  color: #e6e6e6 !important;
  text-shadow: 0 2px 1px rgba(0,0,0,0.45) !important;
}

#craftPanel .craft-list-meta,
#buildPanel .craft-list-meta,
#shopPanel .craft-list-meta {
  display: none !important;
}

#craftPanel .craft-detail,
#buildPanel .craft-detail,
#shopPanel .craft-detail {
  padding: 16px 20px 12px 28px !important;
  overflow: auto !important;
  color: #f1fbff !important;
  background: transparent !important;
}

#craftPanel .craft-detail-card,
#buildPanel .craft-detail-card,
#shopPanel .craft-detail-card {
  min-height: auto !important;
}

#craftPanel .craft-detail-head,
#buildPanel .craft-detail-head,
#shopPanel .craft-detail-head {
  display: block !important;
  text-align: center !important;
  padding-right: 30px !important;
}

#craftPanel .craft-detail-title,
#buildPanel .craft-detail-title,
#shopPanel .craft-detail-title {
  font-size: 26px !important;
  font-weight: 1000 !important;
  color: white !important;
  text-shadow: 0 3px 1px rgba(0,0,0,0.48) !important;
}

#craftPanel .craft-detail-stars,
#buildPanel .craft-detail-stars,
#shopPanel .craft-detail-stars {
  margin-top: 4px !important;
  font-size: 17px !important;
  color: #ffd43f !important;
  letter-spacing: 1px !important;
  text-align: center !important;
}

#craftPanel .craft-detail-desc,
#buildPanel .craft-detail-desc,
#shopPanel .craft-detail-desc {
  margin: 9px 0 0 !important;
  font-size: 15px !important;
  line-height: 1.22 !important;
  color: #e9faff !important;
  font-weight: 900 !important;
}

#craftPanel .craft-recipe-box,
#buildPanel .craft-recipe-box,
#shopPanel .craft-recipe-box {
  margin-top: 12px !important;
  min-height: 97px !important;
  padding: 10px 14px !important;
  border-radius: 4px !important;
  background: #06587b !important;
  display: grid !important;
  grid-template-columns: 1fr 132px !important;
  gap: 10px !important;
  align-items: center !important;
}

#craftPanel .craft-ingredient,
#buildPanel .craft-ingredient,
#shopPanel .craft-ingredient {
  grid-template-columns: 34px 1fr !important;
  gap: 8px !important;
}

#craftPanel .craft-ingredient-text,
#buildPanel .craft-ingredient-text,
#shopPanel .craft-ingredient-text {
  font-size: 18px !important;
  font-weight: 1000 !important;
  color: #77ff87 !important;
  text-shadow: 0 2px 1px rgba(0,0,0,0.48) !important;
}

#craftPanel .craft-ingredient-text.missing,
#buildPanel .craft-ingredient-text.missing,
#shopPanel .craft-ingredient-text.missing {
  color: #ff6a5f !important;
}

#craftPanel .craft-preview-icon,
#buildPanel .craft-preview-icon,
#shopPanel .craft-preview-icon {
  height: 82px !important;
  background-size: contain !important;
  filter: drop-shadow(0 8px 10px rgba(0,0,0,0.52)) !important;
}

#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button {
  width: 178px !important;
  min-height: 48px !important;
  margin: 16px auto 0 !important;
  padding: 10px 14px !important;
  border-radius: 11px !important;
  background: linear-gradient(180deg, #9fed58, #63c234) !important;
  border: 2px solid rgba(26,95,24,0.86) !important;
  color: #fff !important;
  font-size: 20px !important;
  font-weight: 1000 !important;
  text-shadow: 0 2px 1px rgba(0,0,0,0.42) !important;
  box-shadow: 0 5px 0 #357e23, 0 8px 12px rgba(0,0,0,0.30), inset 0 1px 0 rgba(255,255,255,0.24) !important;
}

#craftPanel .craft-create-button:disabled,
#buildPanel .craft-create-button:disabled {
  filter: grayscale(0.35) brightness(0.86) !important;
  opacity: 0.82 !important;
}

/* Clans like second screenshot */
#clanPanel.social-panel {
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  width: min(462px, calc(100vw - 26px)) !important;
  height: min(516px, calc(100vh - 26px)) !important;
  padding: 12px 10px 14px !important;
  overflow: hidden !important;
}

#clanPanel .social-head,
#tradePanel .social-head {
  position: relative !important;
  height: 46px !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 0 8px !important;
}

#clanPanel .social-title,
#tradePanel .social-title {
  color: #fff !important;
  font-size: 28px !important;
  font-weight: 1000 !important;
  text-align: center !important;
  text-shadow: 0 3px 1px rgba(0,0,0,0.48) !important;
}

#clanPanel .social-body {
  position: relative !important;
  height: calc(100% - 54px) !important;
  padding: 0 0 70px !important;
  overflow: hidden !important;
  display: block !important;
}

.ahardice-clan-list-v148 {
  position: absolute !important;
  left: 0 !important;
  right: 28px !important;
  top: 0 !important;
  bottom: 62px !important;
  padding: 10px 10px !important;
  overflow-y: auto !important;
  border-radius: 8px !important;
  background: #0b6391 !important;
}

.ahardice-clan-row-v148 {
  min-height: 50px !important;
  display: grid !important;
  grid-template-columns: 1fr 98px !important;
  align-items: center !important;
  gap: 8px !important;
  color: #fff !important;
}

.ahardice-clan-row-v148 b {
  font-size: 20px !important;
  font-weight: 1000 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  text-shadow: 0 3px 1px rgba(0,0,0,0.48) !important;
}

.ahardice-clan-form-v148 {
  position: absolute !important;
  left: 4px !important;
  right: 4px !important;
  bottom: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr 210px !important;
  gap: 14px !important;
  align-items: center !important;
}

.ahardice-clan-form-v148 input {
  height: 40px !important;
  box-sizing: border-box !important;
  padding: 0 12px !important;
  border-radius: 8px !important;
  border: none !important;
  background: #424043 !important;
  color: #e9e9e9 !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  font-style: italic !important;
  box-shadow: inset 0 2px 0 rgba(0,0,0,0.28) !important;
}

.ahardice-yellow-button-v148 {
  min-height: 44px !important;
  padding: 8px 14px !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #ffd744, #ffbf25) !important;
  border: 2px solid #9e6b08 !important;
  color: #8a4e0a !important;
  font-size: 15px !important;
  font-weight: 1000 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.35) !important;
  box-shadow: 0 4px 0 #9b6507, 0 6px 10px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.36) !important;
}

.ahardice-yellow-button-v148:disabled {
  opacity: 0.72 !important;
  filter: grayscale(0.25) !important;
}

.ahardice-green-button-v148 {
  min-height: 52px !important;
  padding: 8px 16px !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #9fed58, #63c234) !important;
  border: 2px solid rgba(26,95,24,0.86) !important;
  color: #fff !important;
  font-size: 21px !important;
  font-weight: 1000 !important;
  text-shadow: 0 2px 1px rgba(0,0,0,0.42) !important;
  box-shadow: 0 5px 0 #357e23, 0 8px 12px rgba(0,0,0,0.30), inset 0 1px 0 rgba(255,255,255,0.24) !important;
}

/* Trade nearby like third screenshot */
#tradePanel.social-panel {
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  width: min(462px, calc(100vw - 26px)) !important;
  height: min(516px, calc(100vh - 26px)) !important;
  padding: 12px 10px 14px !important;
  overflow: hidden !important;
}

#tradePanel .social-body {
  height: calc(100% - 54px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  display: block !important;
}

.ahardice-trade-list-v148 {
  height: 100% !important;
  padding: 12px 12px !important;
  overflow-y: auto !important;
  border-radius: 8px !important;
  background: #0b6391 !important;
}

.ahardice-trade-row-v148 {
  min-height: 52px !important;
  display: grid !important;
  grid-template-columns: 1fr 110px !important;
  align-items: center !important;
  gap: 10px !important;
}

.ahardice-trade-row-v148 b {
  color: #fff !important;
  font-size: 20px !important;
  font-weight: 1000 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  text-shadow: 0 3px 1px rgba(0,0,0,0.48) !important;
}

.ahardice-trade-row-v148 span {
  display: none !important;
}

/* Active trade keeps functional layout but uses same blue frame */
#tradePanel .trade-modern {
  height: 100% !important;
  overflow: auto !important;
}

#tradePanel .trade-modern-offer,
#tradePanel .trade-modern-inventory {
  background: #0b6391 !important;
  border-radius: 8px !important;
  border: none !important;
}

/* Mobile fallback */
@media (max-width: 760px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel,
  #shopPanel.craft-panel.game-panel,
  #clanPanel.social-panel,
  #tradePanel.social-panel {
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: calc(100vw - 16px) !important;
    height: calc(100vh - 24px) !important;
  }

  #craftPanel .craft-shell,
  #buildPanel .craft-shell,
  #shopPanel .craft-shell {
    grid-template-columns: 44% 1fr !important;
  }

  .ahardice-clan-form-v148 {
    grid-template-columns: 1fr 140px !important;
    gap: 8px !important;
  }
}


/* v149: auto-scale ingredients + top center coin balance */
.craft-panel.game-panel,
.build-panel.game-panel,
.shop-panel.game-panel {
  overflow: visible !important;
}

.craft-panel.game-panel .craft-detail {
  overflow: hidden !important;
  min-height: 0;
}

.craft-panel.game-panel .craft-detail-card {
  height: 100%;
  min-height: 0 !important;
  display: flex;
  flex-direction: column;
}

.craft-panel.game-panel .craft-detail-desc {
  flex: 0 0 auto;
  max-height: 88px;
  overflow: hidden;
}

.craft-panel.game-panel .craft-recipe-box {
  flex: 1 1 auto;
  min-height: 0;
  align-items: center;
  overflow: hidden;
}

.craft-panel.game-panel .craft-ingredients {
  min-height: 0;
  max-height: 100%;
  overflow: visible;
}

.craft-ingredient-text {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 6px;
  line-height: 1.05;
  white-space: normal;
}

.craft-ingredient-count {
  flex: 0 0 auto;
  font-weight: 1000;
}

.craft-ingredient-name {
  min-width: 0;
  overflow: visible;
  white-space: normal;
  word-break: normal;
  overflow-wrap: anywhere;
  font-weight: 1000;
}

.craft-ingredient-name.long {
  font-size: 14px;
}

.craft-ingredient-name.very-long {
  font-size: 12px;
  line-height: 1.02;
}

.craft-ingredient-name.tiny {
  font-size: 10.5px;
  line-height: 1;
}

.craft-ingredients.compact {
  gap: 7px !important;
}

.craft-ingredients.compact .craft-ingredient {
  grid-template-columns: 30px minmax(0, 1fr) !important;
  gap: 8px !important;
}

.craft-ingredients.compact .craft-ingredient-icon {
  width: 30px !important;
  height: 30px !important;
  border-radius: 8px !important;
}

.craft-ingredients.compact .craft-ingredient-text {
  font-size: 14px !important;
}

.craft-ingredients.dense {
  gap: 5px !important;
}

.craft-ingredients.dense .craft-ingredient {
  grid-template-columns: 26px minmax(0, 1fr) !important;
  gap: 7px !important;
}

.craft-ingredients.dense .craft-ingredient-icon {
  width: 26px !important;
  height: 26px !important;
  border-radius: 7px !important;
}

.craft-ingredients.dense .craft-ingredient-text {
  font-size: 12.5px !important;
}

.craft-ingredients.ultra {
  gap: 3px !important;
}

.craft-ingredients.ultra .craft-ingredient {
  grid-template-columns: 22px minmax(0, 1fr) !important;
  gap: 6px !important;
}

.craft-ingredients.ultra .craft-ingredient-icon {
  width: 22px !important;
  height: 22px !important;
  border-radius: 6px !important;
}

.craft-ingredients.ultra .craft-ingredient-text {
  font-size: 11px !important;
}

.craft-panel.game-panel .craft-ingredients.dense ~ .craft-preview-icon {
  height: 92px !important;
}

.craft-panel.game-panel .craft-ingredients.ultra ~ .craft-preview-icon {
  height: 74px !important;
}

.panel-balance.panel-coin-balance {
  position: absolute !important;
  left: 50% !important;
  top: -2px !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  z-index: 90 !important;
  min-width: 128px;
  height: 38px;
  box-sizing: border-box;
  padding: 6px 18px 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 0 0 18px 18px !important;
  background: linear-gradient(180deg, #0b5d83 0%, #0877a7 100%) !important;
  border: 3px solid #043447 !important;
  border-top: none !important;
  color: #fff2b6 !important;
  font-size: 18px !important;
  font-weight: 1000 !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.35);
  box-shadow: 0 5px 0 rgba(0,0,0,0.24), inset 0 -1px 0 rgba(255,255,255,0.14) !important;
  pointer-events: none !important;
}

.panel-coin-icon {
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  border-radius: 999px;
  background:
    radial-gradient(circle at 34% 28%, #fff7b9 0 16%, #ffd86b 17% 44%, #d68a22 45% 72%, #8b4d12 73% 100%);
  border: 2px solid #6f3b0f;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.45), 0 2px 4px rgba(0,0,0,0.35);
}

.panel-coin-value {
  line-height: 1;
}


/* v150: global in-game coin balance between minimap and leaderboard */
.craft-panel.game-panel > .panel-balance,
.build-panel.game-panel > .panel-balance,
.shop-panel.game-panel > .panel-balance {
  display: none !important;
}

.game-coin-balance {
  position: fixed;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  z-index: 38;
  min-width: 138px;
  height: 42px;
  box-sizing: border-box;
  padding: 6px 20px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 0 0 20px 20px;
  background: linear-gradient(180deg, #0b5d83 0%, #0877a7 100%);
  border: 3px solid #043447;
  border-top: none;
  color: #fff2b6;
  font-size: 20px;
  font-weight: 1000;
  text-shadow: 0 2px 0 rgba(0,0,0,0.35);
  box-shadow: 0 5px 0 rgba(0,0,0,0.24), inset 0 -1px 0 rgba(255,255,255,0.14);
  pointer-events: none;
  user-select: none;
}

.game-coin-balance.hidden,
body.menu-open .game-coin-balance {
  display: none !important;
}

.game-coin-icon {
  width: 26px;
  height: 26px;
  flex: 0 0 auto;
  border-radius: 999px;
  background:
    radial-gradient(circle at 34% 28%, #fff7b9 0 16%, #ffd86b 17% 44%, #d68a22 45% 72%, #8b4d12 73% 100%);
  border: 2px solid #6f3b0f;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.45), 0 2px 4px rgba(0,0,0,0.35);
}

#gameCoinBalanceValue {
  line-height: 1;
}

@media (max-width: 760px) {
  .game-coin-balance {
    min-width: 118px;
    height: 36px;
    font-size: 17px;
    padding: 5px 16px 7px;
  }

  .game-coin-icon {
    width: 22px;
    height: 22px;
  }
}


/* v151: quantity-only ingredients + icon-only craft categories */
.craft-ingredient-text {
  display: block !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-align: left;
}

.craft-ingredient-count,
.craft-ingredient-name {
  display: none !important;
}

.craft-ingredient-text.ok,
.craft-ingredient-text.missing {
  font-size: inherit;
}

.craft-category-tabs {
  align-items: center;
}

.craft-category-tab.icon-only {
  min-width: 54px !important;
  width: 54px !important;
  height: 50px !important;
  padding: 8px !important;
  display: grid !important;
  grid-template-rows: 1fr !important;
  place-items: center !important;
}

.craft-category-tab.icon-only span {
  display: none !important;
}

.craft-category-tab.icon-only .craft-category-icon {
  width: 34px !important;
  height: 34px !important;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.craft-panel.game-panel .craft-category-tabs {
  gap: 7px !important;
}


/* v152: visible craft category icon tabs */
.craft-panel.game-panel {
  padding-top: 52px !important;
}

.craft-panel.game-panel .craft-category-tabs {
  position: absolute !important;
  left: 16px !important;
  top: 10px !important;
  right: 64px !important;
  z-index: 70 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 7px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scrollbar-width: thin;
}

.craft-panel.game-panel .craft-category-tabs::-webkit-scrollbar {
  height: 6px;
}

.craft-panel.game-panel .craft-category-tabs::-webkit-scrollbar-thumb {
  background: rgba(150,220,255,0.70);
  border-radius: 999px;
}

.craft-panel.game-panel .craft-category-tab.icon-only {
  flex: 0 0 46px !important;
  min-width: 46px !important;
  width: 46px !important;
  height: 38px !important;
  padding: 6px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 10px 10px 0 0 !important;
  background: #5d5d6d !important;
  border: 2px solid #07384e !important;
  border-bottom: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.16), 0 3px 0 rgba(0,0,0,0.18) !important;
}

.craft-panel.game-panel .craft-category-tab.icon-only.active,
.craft-panel.game-panel .craft-category-tab.icon-only:hover {
  background: #b9adbd !important;
  transform: translateY(-1px);
}

.craft-panel.game-panel .craft-category-tab.icon-only .craft-category-icon {
  width: 28px !important;
  height: 28px !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  filter: drop-shadow(0 2px 2px rgba(0,0,0,0.35));
}

.craft-panel.game-panel .craft-category-tab.icon-only span {
  display: none !important;
}

.craft-panel.game-panel .craft-shell {
  height: calc(100% - 0px) !important;
}

.craft-list-wrap {
  min-height: 0;
}


/* v153: dark purple + gold theme for main in-game panels */
:root {
  --dyn-panel-blue: #4b2f6f;
  --dyn-panel-blue-2: #3a2459;
  --dyn-panel-dark: #32204d;
  --dyn-panel-border: #211433;
  --dyn-black-border: rgba(0,0,0,0.82);
  --dyn-row-grey: #5d536b;
  --dyn-row-selected: #b9a2c9;
  --dyn-scroll: #d7b7ff;
  --dyn-green: #87dc45;
  --dyn-green-dark: #55a72d;
  --dyn-yellow: #ffcc4d;
  --dyn-yellow-dark: #b97918;
  --dyn-gold: #ffd36a;
  --dyn-gold-light: #fff0a8;
}

/* Purple frame panels */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel,
#clanPanel.social-panel,
#tradePanel.social-panel {
  background: linear-gradient(180deg, #5a3880 0%, #4b2f6f 52%, #3a2459 100%) !important;
  border-color: rgba(0,0,0,0.84) !important;
  box-shadow:
    0 9px 0 rgba(18, 9, 29, 0.90),
    0 22px 55px rgba(0,0,0,0.42),
    inset 0 2px 0 rgba(255,255,255,0.12) !important;
}

/* Dark inner content blocks */
#craftPanel .craft-shell,
#buildPanel .craft-shell,
#shopPanel .craft-shell,
#clanPanel .social-list,
#tradePanel .social-list,
#clanPanel .social-body,
#tradePanel .social-body,
#clanPanel .clan-list,
#tradePanel .trade-list,
#clanPanel .players-list,
#tradePanel .players-list {
  background: #32204d !important;
  border-color: rgba(35, 20, 52, 0.95) !important;
}

/* Left list rows */
#craftPanel .craft-list-item,
#buildPanel .craft-list-item,
#shopPanel .craft-list-item {
  background: #5d536b !important;
  border-bottom-color: #1f1730 !important;
  color: #f5edff !important;
}

#craftPanel .craft-list-item.selected,
#buildPanel .craft-list-item.selected,
#shopPanel .craft-list-item.selected {
  background: #b9a2c9 !important;
  color: #ffffff !important;
}

#craftPanel .craft-list-name,
#buildPanel .craft-list-name,
#shopPanel .craft-list-name,
#craftPanel .craft-list-meta,
#buildPanel .craft-list-meta,
#shopPanel .craft-list-meta {
  color: #fff6c6 !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.38) !important;
}

/* Detail title and text */
#craftPanel .craft-detail-title,
#buildPanel .craft-detail-title,
#shopPanel .craft-detail-title,
#clanPanel .social-title,
#tradePanel .social-title {
  color: #fff6c6 !important;
  text-shadow: 0 3px 0 rgba(0,0,0,0.45) !important;
}

#craftPanel .craft-detail-stars,
#buildPanel .craft-detail-stars,
#shopPanel .craft-detail-stars {
  color: #ffcc4d !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.42) !important;
}

#craftPanel .craft-detail-desc,
#buildPanel .craft-detail-desc,
#shopPanel .craft-detail-desc {
  color: #f6eaff !important;
}

/* Recipe box */
#craftPanel .craft-recipe-box,
#buildPanel .craft-recipe-box,
#shopPanel .craft-recipe-box {
  background: linear-gradient(180deg, #342052 0%, #28183f 100%) !important;
}

/* Category icon tabs */
#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab {
  background: #5d536b !important;
  border-color: #211433 !important;
}

#craftPanel .craft-category-tab.active,
#craftPanel .craft-category-tab:hover,
#buildPanel .craft-category-tab.active,
#buildPanel .craft-category-tab:hover,
#shopPanel .craft-category-tab.active,
#shopPanel .craft-category-tab:hover {
  background: #ffcc4d !important;
  border-color: #7a4a12 !important;
}

/* Buttons */
#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button,
#clanPanel .social-action,
#tradePanel .social-action,
#clanPanel button:not(.social-close),
#tradePanel button:not(.social-close) {
  background: linear-gradient(180deg, #ffdc70 0%, #ffcc4d 45%, #d19122 100%) !important;
  border: 2px solid #7a4a12 !important;
  color: #4b2c08 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.28) !important;
  box-shadow:
    0 5px 0 #7a4a12,
    0 10px 18px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.35) !important;
}

#craftPanel .craft-create-button:disabled,
#buildPanel .craft-create-button:disabled,
#shopPanel .craft-create-button:disabled {
  background: linear-gradient(180deg, #7d7a85, #5f5c67) !important;
  color: #d8d4de !important;
  border-color: #3b3548 !important;
  box-shadow: 0 5px 0 #3b3548, inset 0 1px 0 rgba(255,255,255,0.12) !important;
}

/* Close buttons */
#craftPanel .panel-close,
#buildPanel .panel-close,
#shopPanel .panel-close,
#clanPanel .social-close,
#tradePanel .social-close {
  background: linear-gradient(180deg, #8c65b7, #5b3b86) !important;
  border: 2px solid #211433 !important;
  color: #fff6c6 !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.45) !important;
}

/* Scrollbar */
#craftPanel *::-webkit-scrollbar-thumb,
#buildPanel *::-webkit-scrollbar-thumb,
#shopPanel *::-webkit-scrollbar-thumb,
#clanPanel *::-webkit-scrollbar-thumb,
#tradePanel *::-webkit-scrollbar-thumb {
  background: #d7b7ff !important;
}

#craftPanel *::-webkit-scrollbar-track,
#buildPanel *::-webkit-scrollbar-track,
#shopPanel *::-webkit-scrollbar-track,
#clanPanel *::-webkit-scrollbar-track,
#tradePanel *::-webkit-scrollbar-track {
  background: rgba(0,0,0,0.22) !important;
}

/* Coin HUD also matches purple/gold */
.game-coin-balance {
  background: linear-gradient(180deg, #5a3880 0%, #4b2f6f 100%) !important;
  border-color: #211433 !important;
  color: #fff6c6 !important;
}


/* v154: show craft/build/shop category tabs ABOVE the panel like reference */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel {
  top: 82px !important;
  overflow: visible !important;
  padding-top: 14px !important;
}

/* The tab row must be outside/above the blue-purple window, not hidden inside it */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  position: absolute !important;
  left: 0 !important;
  top: -72px !important;
  right: auto !important;
  z-index: 120 !important;
  height: 70px !important;
  max-width: calc(100vw - 140px) !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  gap: 10px !important;
  padding: 0 0 4px 0 !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scrollbar-width: none !important;
  pointer-events: auto !important;
}

#craftPanel .craft-category-tabs::-webkit-scrollbar,
#buildPanel .craft-category-tabs::-webkit-scrollbar,
#shopPanel .craft-category-tabs::-webkit-scrollbar {
  display: none !important;
}

#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#buildPanel .craft-category-tab.icon-only,
#shopPanel .craft-category-tab.icon-only {
  flex: 0 0 90px !important;
  width: 90px !important;
  min-width: 90px !important;
  height: 64px !important;
  padding: 10px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 9px 9px 0 0 !important;
  background: linear-gradient(180deg, #31451f 0%, #1d3217 100%) !important;
  border: 3px solid #050906 !important;
  border-bottom-width: 2px !important;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.12),
    0 5px 0 rgba(0,0,0,0.45) !important;
  transform: none !important;
  opacity: 0.78;
}

#craftPanel .craft-category-tab.active,
#buildPanel .craft-category-tab.active,
#shopPanel .craft-category-tab.active,
#craftPanel .craft-category-tab:hover,
#buildPanel .craft-category-tab:hover,
#shopPanel .craft-category-tab:hover {
  background: linear-gradient(180deg, #8767a6 0%, #6c4a91 100%) !important;
  border-color: #050906 !important;
  opacity: 1;
  transform: translateY(-1px) !important;
}

#craftPanel .craft-category-tab .craft-category-icon,
#buildPanel .craft-category-tab .craft-category-icon,
#shopPanel .craft-category-tab .craft-category-icon,
#craftPanel .craft-category-tab.icon-only .craft-category-icon,
#buildPanel .craft-category-tab.icon-only .craft-category-icon,
#shopPanel .craft-category-tab.icon-only .craft-category-icon {
  width: 44px !important;
  height: 44px !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  filter: drop-shadow(0 3px 2px rgba(0,0,0,0.45)) !important;
}

#craftPanel .craft-category-tab span,
#buildPanel .craft-category-tab span,
#shopPanel .craft-category-tab span {
  display: none !important;
}

/* Keep the panel content from jumping under the tab row */
#craftPanel .craft-shell,
#buildPanel .craft-shell,
#shopPanel .craft-shell {
  height: 100% !important;
}

/* On smaller screens keep tabs visible but narrower */
@media (max-width: 900px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel,
  #shopPanel.craft-panel.game-panel {
    top: 78px !important;
  }

  #craftPanel .craft-category-tabs,
  #buildPanel .craft-category-tabs,
  #shopPanel .craft-category-tabs {
    top: -64px !important;
    height: 62px !important;
    max-width: calc(100vw - 36px) !important;
    gap: 8px !important;
  }

  #craftPanel .craft-category-tab,
  #buildPanel .craft-category-tab,
  #shopPanel .craft-category-tab,
  #craftPanel .craft-category-tab.icon-only,
  #buildPanel .craft-category-tab.icon-only,
  #shopPanel .craft-category-tab.icon-only {
    flex-basis: 70px !important;
    width: 70px !important;
    min-width: 70px !important;
    height: 56px !important;
  }

  #craftPanel .craft-category-tab .craft-category-icon,
  #buildPanel .craft-category-tab .craft-category-icon,
  #shopPanel .craft-category-tab .craft-category-icon {
    width: 36px !important;
    height: 36px !important;
  }
}


/* v155: move craft/build/shop panel to the LEFT under the category tabs, like reference */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel {
  position: fixed !important;
  left: 94px !important;
  right: auto !important;
  top: 330px !important;
  transform: none !important;
  margin: 0 !important;
  z-index: 70 !important;
}

/* Tabs must sit directly above the panel and align from its left edge */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: -60px !important;
  width: max-content !important;
  max-width: 640px !important;
  z-index: 120 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  gap: 10px !important;
  padding: 0 0 4px 0 !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scrollbar-width: none !important;
}

#craftPanel .craft-category-tabs::-webkit-scrollbar,
#buildPanel .craft-category-tabs::-webkit-scrollbar,
#shopPanel .craft-category-tabs::-webkit-scrollbar {
  display: none !important;
}

/* Keep panel width like reference on desktop */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel {
  width: 560px !important;
  max-width: 560px !important;
  height: 315px !important;
  max-height: 315px !important;
}

/* Smaller screens */
@media (max-width: 1200px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel,
  #shopPanel.craft-panel.game-panel {
    left: 72px !important;
    top: 300px !important;
    width: 520px !important;
    max-width: 520px !important;
  }

  #craftPanel .craft-category-tabs,
  #buildPanel .craft-category-tabs,
  #shopPanel .craft-category-tabs {
    max-width: 560px !important;
    top: -56px !important;
  }
}

@media (max-width: 900px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel,
  #shopPanel.craft-panel.game-panel {
    left: 24px !important;
    top: 240px !important;
    width: calc(100vw - 48px) !important;
    max-width: calc(100vw - 48px) !important;
    height: 300px !important;
    max-height: 300px !important;
  }

  #craftPanel .craft-category-tabs,
  #buildPanel .craft-category-tabs,
  #shopPanel .craft-category-tabs {
    max-width: calc(100vw - 72px) !important;
    gap: 8px !important;
    top: -54px !important;
  }
}


/* v156: bigger orange panels, tabs gap, no ingredient/right scrollbar */
:root {
  --dyn-panel-blue: #b85d17;
  --dyn-panel-blue-2: #8f4211;
  --dyn-panel-dark: #6f310d;
  --dyn-panel-border: #3b1b08;
  --dyn-black-border: rgba(0,0,0,0.84);
  --dyn-row-grey: #67584d;
  --dyn-row-selected: #d6a96a;
  --dyn-scroll: #ffbd62;
  --dyn-green: #87dc45;
  --dyn-green-dark: #55a72d;
  --dyn-yellow: #ffc14a;
  --dyn-yellow-dark: #a55a12;
  --dyn-gold: #ffd36a;
  --dyn-gold-light: #fff0a8;
}

/* Orange game panels */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel,
#clanPanel.social-panel,
#tradePanel.social-panel {
  background: linear-gradient(180deg, #c96b1f 0%, #a94e14 52%, #7c350d 100%) !important;
  border-color: rgba(0,0,0,0.86) !important;
  box-shadow:
    0 9px 0 rgba(50, 20, 5, 0.92),
    0 24px 58px rgba(0,0,0,0.44),
    inset 0 2px 0 rgba(255,255,255,0.14) !important;
}

/* Bigger craft/build/shop panel like reference, left under tabs */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel {
  left: 94px !important;
  top: 330px !important;
  width: 650px !important;
  max-width: 650px !important;
  height: 375px !important;
  max-height: 375px !important;
  overflow: visible !important;
}

/* Make tabs float above panel with a small gap, not glued to it */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  top: -74px !important;
  height: 64px !important;
  gap: 10px !important;
  max-width: 720px !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

/* Slightly bigger tabs, orange selected */
#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#buildPanel .craft-category-tab.icon-only,
#shopPanel .craft-category-tab.icon-only {
  flex: 0 0 82px !important;
  width: 82px !important;
  min-width: 82px !important;
  height: 58px !important;
  border-radius: 10px 10px 4px 4px !important;
  background: linear-gradient(180deg, #465c2c 0%, #293d1e 100%) !important;
  border: 3px solid #111306 !important;
  opacity: 0.82;
}

#craftPanel .craft-category-tab.active,
#buildPanel .craft-category-tab.active,
#shopPanel .craft-category-tab.active,
#craftPanel .craft-category-tab:hover,
#buildPanel .craft-category-tab:hover,
#shopPanel .craft-category-tab:hover {
  background: linear-gradient(180deg, #ffa842 0%, #d66c1a 100%) !important;
  border-color: #2c1304 !important;
  opacity: 1;
}

#craftPanel .craft-category-tab .craft-category-icon,
#buildPanel .craft-category-tab .craft-category-icon,
#shopPanel .craft-category-tab .craft-category-icon {
  width: 42px !important;
  height: 42px !important;
}

/* Inner layout scales with bigger panel */
#craftPanel .craft-shell,
#buildPanel .craft-shell,
#shopPanel .craft-shell {
  grid-template-columns: 285px minmax(0, 1fr) !important;
  height: 100% !important;
  background: #6f310d !important;
}

#craftPanel .craft-list-wrap,
#buildPanel .craft-list-wrap,
#shopPanel .craft-list-wrap {
  background: #6f310d !important;
}

#craftPanel .craft-list-item,
#buildPanel .craft-list-item,
#shopPanel .craft-list-item {
  background: #67584d !important;
  border-bottom-color: #2b1608 !important;
}

#craftPanel .craft-list-item.selected,
#buildPanel .craft-list-item.selected,
#shopPanel .craft-list-item.selected {
  background: #d6a96a !important;
}

#craftPanel .craft-detail,
#buildPanel .craft-detail,
#shopPanel .craft-detail {
  overflow: hidden !important;
  padding: 18px 20px !important;
}

#craftPanel .craft-detail-card,
#buildPanel .craft-detail-card,
#shopPanel .craft-detail-card {
  overflow: hidden !important;
}

/* No scrollbar in right ingredient/detail side */
#craftPanel .craft-detail::-webkit-scrollbar,
#buildPanel .craft-detail::-webkit-scrollbar,
#shopPanel .craft-detail::-webkit-scrollbar {
  display: none !important;
}

#craftPanel .craft-recipe-box,
#buildPanel .craft-recipe-box,
#shopPanel .craft-recipe-box {
  background: linear-gradient(180deg, #733711 0%, #552709 100%) !important;
  grid-template-columns: minmax(0, 1fr) 145px !important;
  max-height: 135px !important;
  overflow: hidden !important;
}

#craftPanel .craft-ingredients,
#buildPanel .craft-ingredients,
#shopPanel .craft-ingredients {
  overflow: hidden !important;
  max-height: 128px !important;
}

#craftPanel .craft-preview-icon,
#buildPanel .craft-preview-icon,
#shopPanel .craft-preview-icon {
  height: 120px !important;
}

/* Text colors for orange theme */
#craftPanel .craft-detail-title,
#buildPanel .craft-detail-title,
#shopPanel .craft-detail-title,
#clanPanel .social-title,
#tradePanel .social-title {
  color: #fff1bd !important;
  text-shadow: 0 3px 0 rgba(0,0,0,0.45) !important;
}

#craftPanel .craft-detail-desc,
#buildPanel .craft-detail-desc,
#shopPanel .craft-detail-desc {
  color: #fff6de !important;
}

#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button,
#clanPanel button:not(.social-close),
#tradePanel button:not(.social-close) {
  background: linear-gradient(180deg, #ffd56f 0%, #ffa92e 45%, #c76413 100%) !important;
  border-color: #683006 !important;
  color: #4b2003 !important;
  box-shadow:
    0 5px 0 #683006,
    0 10px 18px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.36) !important;
}

.game-coin-balance {
  background: linear-gradient(180deg, #c96b1f 0%, #8f4211 100%) !important;
  border-color: #3b1b08 !important;
  color: #fff1bd !important;
}

/* Responsive */
@media (max-width: 1200px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel,
  #shopPanel.craft-panel.game-panel {
    left: 72px !important;
    top: 300px !important;
    width: 610px !important;
    max-width: 610px !important;
    height: 360px !important;
    max-height: 360px !important;
  }

  #craftPanel .craft-shell,
  #buildPanel .craft-shell,
  #shopPanel .craft-shell {
    grid-template-columns: 265px minmax(0, 1fr) !important;
  }
}

@media (max-width: 900px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel,
  #shopPanel.craft-panel.game-panel {
    left: 24px !important;
    top: 240px !important;
    width: calc(100vw - 48px) !important;
    max-width: calc(100vw - 48px) !important;
    height: 340px !important;
    max-height: 340px !important;
  }

  #craftPanel .craft-category-tabs,
  #buildPanel .craft-category-tabs,
  #shopPanel .craft-category-tabs {
    top: -66px !important;
    max-width: calc(100vw - 48px) !important;
  }

  #craftPanel .craft-category-tab,
  #buildPanel .craft-category-tab,
  #shopPanel .craft-category-tab {
    flex-basis: 66px !important;
    width: 66px !important;
    min-width: 66px !important;
    height: 54px !important;
  }
}


/* v157: lime palette + aligned tabs + no tab shadow */
:root {
  --dyn-panel-blue: #65a832;
  --dyn-panel-blue-2: #4f8527;
  --dyn-panel-dark: #34641e;
  --dyn-panel-border: #1d3a12;
  --dyn-black-border: rgba(0,0,0,0.84);
  --dyn-row-grey: #5e6c4d;
  --dyn-row-selected: #b7d66a;
  --dyn-scroll: #cfff6a;
  --dyn-green: #9cff3b;
  --dyn-green-dark: #5ea821;
  --dyn-yellow: #e6ff5a;
  --dyn-yellow-dark: #83a516;
  --dyn-gold: #e6ff5a;
  --dyn-gold-light: #f4ffad;
}

/* Lime / salad-green panels */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel,
#clanPanel.social-panel,
#tradePanel.social-panel {
  background: linear-gradient(180deg, #7ac943 0%, #65a832 48%, #4f8527 100%) !important;
  border-color: rgba(0,0,0,0.86) !important;
  box-shadow:
    0 9px 0 rgba(20, 45, 10, 0.92),
    0 24px 58px rgba(0,0,0,0.40),
    inset 0 2px 0 rgba(255,255,255,0.18) !important;
}

/* Inner blocks */
#craftPanel .craft-shell,
#buildPanel .craft-shell,
#shopPanel .craft-shell,
#clanPanel .social-list,
#tradePanel .social-list,
#clanPanel .social-body,
#tradePanel .social-body,
#clanPanel .clan-list,
#tradePanel .trade-list,
#clanPanel .players-list,
#craftPanel .craft-list-wrap,
#buildPanel .craft-list-wrap,
#shopPanel .craft-list-wrap {
  background: #34641e !important;
  border-color: #1d3a12 !important;
}

/* List rows */
#craftPanel .craft-list-item,
#buildPanel .craft-list-item,
#shopPanel .craft-list-item {
  background: #5e6c4d !important;
  border-bottom-color: #233017 !important;
  color: #fffbd0 !important;
}

#craftPanel .craft-list-item.selected,
#buildPanel .craft-list-item.selected,
#shopPanel .craft-list-item.selected {
  background: #b7d66a !important;
  color: #ffffff !important;
}

/* Details */
#craftPanel .craft-detail-title,
#buildPanel .craft-detail-title,
#shopPanel .craft-detail-title,
#clanPanel .social-title,
#tradePanel .social-title {
  color: #fffbd0 !important;
  text-shadow: 0 3px 0 rgba(0,0,0,0.45) !important;
}

#craftPanel .craft-detail-desc,
#buildPanel .craft-detail-desc,
#shopPanel .craft-detail-desc {
  color: #faffdf !important;
}

#craftPanel .craft-detail-stars,
#buildPanel .craft-detail-stars,
#shopPanel .craft-detail-stars {
  color: #e6ff5a !important;
}

#craftPanel .craft-recipe-box,
#buildPanel .craft-recipe-box,
#shopPanel .craft-recipe-box {
  background: linear-gradient(180deg, #315f1c 0%, #254915 100%) !important;
}

/* Align tabs exactly with panel left edge and lift them slightly */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  left: 0 !important;
  top: -78px !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
  gap: 10px !important;
}

/* Remove tab shadow and make lime selected tab */
#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#buildPanel .craft-category-tab.icon-only,
#shopPanel .craft-category-tab.icon-only {
  background: linear-gradient(180deg, #4a672c 0%, #2e451f 100%) !important;
  border: 3px solid #111306 !important;
  box-shadow: none !important;
  opacity: 0.86 !important;
}

#craftPanel .craft-category-tab.active,
#buildPanel .craft-category-tab.active,
#shopPanel .craft-category-tab.active,
#craftPanel .craft-category-tab:hover,
#buildPanel .craft-category-tab:hover,
#shopPanel .craft-category-tab:hover {
  background: linear-gradient(180deg, #cfff6a 0%, #8cd936 100%) !important;
  border-color: #1d3a12 !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

/* Lime buttons */
#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button,
#clanPanel button:not(.social-close),
#tradePanel button:not(.social-close) {
  background: linear-gradient(180deg, #d8ff77 0%, #9cff3b 45%, #5ea821 100%) !important;
  border-color: #2a5518 !important;
  color: #183006 !important;
  box-shadow:
    0 5px 0 #2a5518,
    0 10px 18px rgba(0,0,0,0.25),
    inset 0 1px 0 rgba(255,255,255,0.40) !important;
}

#craftPanel .craft-create-button:disabled,
#buildPanel .craft-create-button:disabled,
#shopPanel .craft-create-button:disabled {
  background: linear-gradient(180deg, #8c977d, #66715c) !important;
  color: #dce8cf !important;
  border-color: #394533 !important;
  box-shadow: 0 5px 0 #394533, inset 0 1px 0 rgba(255,255,255,0.12) !important;
}

/* Close buttons */
#craftPanel .panel-close,
#buildPanel .panel-close,
#shopPanel .panel-close,
#clanPanel .social-close,
#tradePanel .social-close {
  background: linear-gradient(180deg, #97d66a, #5b9b34) !important;
  border: 2px solid #1d3a12 !important;
  color: #fffbd0 !important;
}

/* Coin HUD */
.game-coin-balance {
  background: linear-gradient(180deg, #7ac943 0%, #4f8527 100%) !important;
  border-color: #1d3a12 !important;
  color: #fffbd0 !important;
}

/* Scrollbar */
#craftPanel *::-webkit-scrollbar-thumb,
#buildPanel *::-webkit-scrollbar-thumb,
#shopPanel *::-webkit-scrollbar-thumb,
#clanPanel *::-webkit-scrollbar-thumb,
#tradePanel *::-webkit-scrollbar-thumb {
  background: #cfff6a !important;
}

/* On small screens also keep tab alignment */
@media (max-width: 900px) {
  #craftPanel .craft-category-tabs,
  #buildPanel .craft-category-tabs,
  #shopPanel .craft-category-tabs {
    left: 0 !important;
    top: -70px !important;
  }
}


/* v158: attach tabs to panel width, keep icons inside, fit more ingredients, add shop assortment */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel {
  width: 680px !important;
  max-width: 680px !important;
  height: 395px !important;
  max-height: 395px !important;
}

/* Tabs must be attached to panel and never overflow outside */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  left: 0 !important;
  right: 0 !important;
  top: -72px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  overflow: visible !important;
  justify-content: stretch !important;
  align-items: end !important;
}

#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#buildPanel .craft-category-tab.icon-only,
#shopPanel .craft-category-tab.icon-only {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: none !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* Keep icon fully inside the tab */
#craftPanel .craft-category-tab .craft-category-icon,
#buildPanel .craft-category-tab .craft-category-icon,
#shopPanel .craft-category-tab .craft-category-icon {
  width: 34px !important;
  height: 34px !important;
  max-width: 100% !important;
  max-height: 100% !important;
}

/* Better inner space for more ingredients */
#craftPanel .craft-shell,
#buildPanel .craft-shell,
#shopPanel .craft-shell {
  grid-template-columns: 285px minmax(0, 1fr) !important;
}

#craftPanel .craft-detail,
#buildPanel .craft-detail,
#shopPanel .craft-detail {
  padding: 14px 16px !important;
}

#craftPanel .craft-detail-title,
#buildPanel .craft-detail-title,
#shopPanel .craft-detail-title {
  font-size: 28px !important;
  line-height: 1.12 !important;
}

#craftPanel .craft-detail-desc,
#buildPanel .craft-detail-desc,
#shopPanel .craft-detail-desc {
  font-size: 14px !important;
  line-height: 1.15 !important;
  margin-bottom: 8px !important;
}

#craftPanel .craft-recipe-box,
#buildPanel .craft-recipe-box,
#shopPanel .craft-recipe-box {
  grid-template-columns: minmax(0, 1fr) 118px !important;
  gap: 10px !important;
  min-height: 168px !important;
  max-height: none !important;
  overflow: hidden !important;
  padding: 10px 12px !important;
}

#craftPanel .craft-ingredients,
#buildPanel .craft-ingredients,
#shopPanel .craft-ingredients {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  max-height: none !important;
  overflow: hidden !important;
}

#craftPanel .craft-ingredient,
#buildPanel .craft-ingredient,
#shopPanel .craft-ingredient {
  grid-template-columns: 28px 1fr !important;
  gap: 8px !important;
  min-height: 28px !important;
}

#craftPanel .craft-ingredient-icon,
#buildPanel .craft-ingredient-icon,
#shopPanel .craft-ingredient-icon {
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
}

#craftPanel .craft-ingredient-text,
#buildPanel .craft-ingredient-text,
#shopPanel .craft-ingredient-text {
  font-size: 11px !important;
  line-height: 1.05 !important;
}

#craftPanel .craft-preview-icon,
#buildPanel .craft-preview-icon,
#shopPanel .craft-preview-icon {
  width: 100px !important;
  height: 100px !important;
  justify-self: center !important;
  align-self: center !important;
}

#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button {
  margin-top: 10px !important;
  min-height: 58px !important;
}

/* Responsive keep everything within bounds */
@media (max-width: 900px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel,
  #shopPanel.craft-panel.game-panel {
    width: calc(100vw - 48px) !important;
    max-width: calc(100vw - 48px) !important;
    height: 360px !important;
    max-height: 360px !important;
  }
  #craftPanel .craft-category-tabs,
  #buildPanel .craft-category-tabs,
  #shopPanel .craft-category-tabs {
    gap: 6px !important;
    top: -68px !important;
  }
  #craftPanel .craft-category-tab .craft-category-icon,
  #buildPanel .craft-category-tab .craft-category-icon,
  #shopPanel .craft-category-tab .craft-category-icon {
    width: 28px !important;
    height: 28px !important;
  }
}


/* v159: attached square tabs + shop auth requirement + shop click/recipe fix */

/* Panel stays large enough */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel {
  width: 680px !important;
  max-width: 680px !important;
  height: 395px !important;
  max-height: 395px !important;
  overflow: visible !important;
}

/* Top tabs are attached to the panel top border */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: -58px !important;
  height: 58px !important;
  width: auto !important;
  max-width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  pointer-events: auto !important;
  z-index: 130 !important;
}

/* Every panel tab is square; no long stretched build/shop tabs */
#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#buildPanel .craft-category-tab.icon-only,
#shopPanel .craft-category-tab.icon-only {
  flex: 0 0 64px !important;
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  height: 58px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  border-radius: 10px 10px 0 0 !important;
  border-bottom-width: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

#craftPanel .craft-category-tab .craft-category-icon,
#buildPanel .craft-category-tab .craft-category-icon,
#shopPanel .craft-category-tab .craft-category-icon,
#craftPanel .craft-category-tab.icon-only .craft-category-icon,
#buildPanel .craft-category-tab.icon-only .craft-category-icon,
#shopPanel .craft-category-tab.icon-only .craft-category-icon {
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  overflow: hidden !important;
}

/* Keep close button above detail blocks */
#craftPanel .panel-close,
#buildPanel .panel-close,
#shopPanel .panel-close {
  z-index: 200 !important;
  position: absolute !important;
  right: 12px !important;
  top: 12px !important;
  display: grid !important;
  place-items: center !important;
}

/* Make list rows always clickable */
#craftPanel .craft-list-item,
#buildPanel .craft-list-item,
#shopPanel .craft-list-item {
  position: relative !important;
  z-index: 3 !important;
  pointer-events: auto !important;
}

#craftPanel .craft-shell,
#buildPanel .craft-shell,
#shopPanel .craft-shell {
  position: relative !important;
  z-index: 1 !important;
  grid-template-columns: 285px minmax(0, 1fr) !important;
  height: 100% !important;
}

/* Fit more ingredients in the recipe box */
#craftPanel .craft-detail,
#buildPanel .craft-detail,
#shopPanel .craft-detail {
  overflow: hidden !important;
  padding: 14px 16px !important;
}

#craftPanel .craft-detail-card,
#buildPanel .craft-detail-card,
#shopPanel .craft-detail-card {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

#craftPanel .craft-detail-desc,
#buildPanel .craft-detail-desc,
#shopPanel .craft-detail-desc {
  flex: 0 0 auto !important;
  max-height: 58px !important;
  overflow: hidden !important;
  margin-bottom: 8px !important;
}

#craftPanel .craft-recipe-box,
#buildPanel .craft-recipe-box,
#shopPanel .craft-recipe-box {
  flex: 1 1 auto !important;
  min-height: 154px !important;
  max-height: 176px !important;
  grid-template-columns: minmax(0, 1fr) 118px !important;
  gap: 10px !important;
  overflow: hidden !important;
  padding: 10px 12px !important;
}

#craftPanel .craft-ingredients,
#buildPanel .craft-ingredients,
#shopPanel .craft-ingredients {
  overflow: hidden !important;
  max-height: none !important;
  gap: 6px !important;
}

#craftPanel .craft-ingredient,
#buildPanel .craft-ingredient,
#shopPanel .craft-ingredient {
  grid-template-columns: 26px 1fr !important;
  gap: 7px !important;
  min-height: 25px !important;
}

#craftPanel .craft-ingredient-icon,
#buildPanel .craft-ingredient-icon,
#shopPanel .craft-ingredient-icon {
  width: 26px !important;
  height: 26px !important;
  border-radius: 7px !important;
}

#craftPanel .craft-ingredient-text,
#buildPanel .craft-ingredient-text,
#shopPanel .craft-ingredient-text {
  font-size: 11px !important;
  line-height: 1 !important;
}

#craftPanel .craft-preview-icon,
#buildPanel .craft-preview-icon,
#shopPanel .craft-preview-icon {
  width: 100px !important;
  height: 100px !important;
  justify-self: center !important;
  align-self: center !important;
}

#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button {
  margin-top: 10px !important;
  min-height: 56px !important;
}

/* Shop auth message */
.shop-auth-required-v159 {
  height: 100%;
  min-height: 245px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  padding: 22px;
  text-align: center;
  color: #fffbd0;
  text-shadow: 0 3px 0 rgba(0,0,0,0.45);
}

.shop-auth-required-v159 b {
  font-size: 30px;
  font-weight: 1000;
}

.shop-auth-required-v159 span {
  max-width: 360px;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.25;
}

/* On smaller screens keep square tabs */
@media (max-width: 900px) {
  #craftPanel .craft-category-tabs,
  #buildPanel .craft-category-tabs,
  #shopPanel .craft-category-tabs {
    top: -54px !important;
    height: 54px !important;
    gap: 6px !important;
  }

  #craftPanel .craft-category-tab,
  #buildPanel .craft-category-tab,
  #shopPanel .craft-category-tab,
  #craftPanel .craft-category-tab.icon-only,
  #buildPanel .craft-category-tab.icon-only,
  #shopPanel .craft-category-tab.icon-only {
    flex-basis: 54px !important;
    width: 54px !important;
    min-width: 54px !important;
    max-width: 54px !important;
    height: 54px !important;
  }

  #craftPanel .craft-category-tab .craft-category-icon,
  #buildPanel .craft-category-tab .craft-category-icon,
  #shopPanel .craft-category-tab .craft-category-icon {
    width: 30px !important;
    height: 30px !important;
  }
}


/* v160: restore craft/shop tab length, shorten only build tabs, shop works like craft */
#craftPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: -58px !important;
  height: 58px !important;
  width: auto !important;
  max-width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  overflow: visible !important;
}

#craftPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#shopPanel .craft-category-tab.icon-only {
  flex: 0 0 82px !important;
  width: 82px !important;
  min-width: 82px !important;
  max-width: 82px !important;
  height: 58px !important;
  border-radius: 10px 10px 0 0 !important;
  border-bottom-width: 0 !important;
  box-shadow: none !important;
}

/* Only build panel tabs are shortened so they don't stretch huge */
#buildPanel .craft-category-tabs {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: -58px !important;
  height: 58px !important;
  width: auto !important;
  max-width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  overflow: visible !important;
}

#buildPanel .craft-category-tab,
#buildPanel .craft-category-tab.icon-only {
  flex: 0 0 64px !important;
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  height: 58px !important;
  border-radius: 10px 10px 0 0 !important;
  border-bottom-width: 0 !important;
  box-shadow: none !important;
}

#craftPanel .craft-category-tab .craft-category-icon,
#shopPanel .craft-category-tab .craft-category-icon,
#buildPanel .craft-category-tab .craft-category-icon {
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
}

/* Shop button behaves visually like craft button */
#shopPanel .shop-buy-button:disabled {
  cursor: not-allowed !important;
  opacity: 0.78 !important;
}

#shopPanel .craft-list-item {
  pointer-events: auto !important;
  z-index: 5 !important;
}

/* Keep close button visible */
#shopPanel .panel-close,
#craftPanel .panel-close,
#buildPanel .panel-close {
  position: absolute !important;
  right: 12px !important;
  top: 12px !important;
  z-index: 250 !important;
}


/* v161: exact attached tabs + build same size + robust shop clicking */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: auto !important;
  bottom: calc(100% - 1px) !important;
  height: 58px !important;
  width: auto !important;
  max-width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  pointer-events: auto !important;
  z-index: 500 !important;
}

/* All three panels now use the same tab size */
#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#buildPanel .craft-category-tab.icon-only,
#shopPanel .craft-category-tab.icon-only {
  flex: 0 0 82px !important;
  width: 82px !important;
  min-width: 82px !important;
  max-width: 82px !important;
  height: 58px !important;
  box-sizing: border-box !important;
  border-radius: 10px 10px 0 0 !important;
  border-bottom-width: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  overflow: hidden !important;
  pointer-events: auto !important;
}

#craftPanel .craft-category-tab .craft-category-icon,
#buildPanel .craft-category-tab .craft-category-icon,
#shopPanel .craft-category-tab .craft-category-icon,
#craftPanel .craft-category-tab.icon-only .craft-category-icon,
#buildPanel .craft-category-tab.icon-only .craft-category-icon,
#shopPanel .craft-category-tab.icon-only .craft-category-icon {
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

/* Shop panel click safety: list/items/buttons must be above inner detail layer */
#shopPanel,
#shopPanel * {
  pointer-events: auto;
}

#shopPanel .craft-shell {
  position: relative !important;
  z-index: 1 !important;
}

#shopPanel .craft-list-wrap {
  position: relative !important;
  z-index: 40 !important;
  pointer-events: auto !important;
}

#shopPanel #shopGrid,
#shopPanel .craft-list,
#shopPanel .craft-list-item,
#shopPanel .craft-list-item * {
  position: relative !important;
  z-index: 45 !important;
  pointer-events: auto !important;
}

#shopPanel .craft-detail {
  position: relative !important;
  z-index: 20 !important;
  pointer-events: auto !important;
}

#shopPanel .shop-buy-button,
#shopPanel [data-shop-buy] {
  position: relative !important;
  z-index: 70 !important;
  pointer-events: auto !important;
}

#shopPanel .panel-close {
  z-index: 800 !important;
  pointer-events: auto !important;
}

/* Panel top border visually merges with tab bottom */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel {
  overflow: visible !important;
  border-top-left-radius: 0 !important;
}

/* On smaller screens keep same proportions but narrower only if needed */
@media (max-width: 900px) {
  #craftPanel .craft-category-tab,
  #buildPanel .craft-category-tab,
  #shopPanel .craft-category-tab,
  #craftPanel .craft-category-tab.icon-only,
  #buildPanel .craft-category-tab.icon-only,
  #shopPanel .craft-category-tab.icon-only {
    flex-basis: 64px !important;
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    height: 54px !important;
  }

  #craftPanel .craft-category-tabs,
  #buildPanel .craft-category-tabs,
  #shopPanel .craft-category-tabs {
    height: 54px !important;
    bottom: calc(100% - 1px) !important;
    gap: 6px !important;
  }
}


/* v164: restore old layout, lime palette only for inventory/admin/trade */
#inventory.inventory.game-panel,
#chestPanel.inventory.game-panel,
#adminPanel.admin-panel,
#tradePanel.social-panel,
#clanPanel.social-panel {
  background: linear-gradient(180deg, #7ac943 0%, #65a832 48%, #4f8527 100%) !important;
  border-color: rgba(0,0,0,0.86) !important;
  color: #fffbd0 !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.38) !important;
}

/* Внутренние блоки: только цвет, без изменения размеров */
#inventory .inventory-shell,
#chestPanel .inventory-shell,
#adminPanel .admin-body,
#tradePanel .social-body,
#clanPanel .social-body,
#tradePanel .ahardice-trade-body-v148,
#clanPanel .ahardice-clan-body-v148 {
  background: rgba(52, 100, 30, 0.96) !important;
  border-color: #1d3a12 !important;
  color: #fffbd0 !important;
}

/* Заголовки */
#inventory .inventory-title,
#chestPanel .inventory-title,
#inventory .large-title,
#chestPanel .large-title,
#adminPanel .admin-title,
#adminPanel .admin-title b,
#tradePanel .social-title,
#clanPanel .social-title {
  color: #fffbd0 !important;
  text-shadow: 0 3px 0 rgba(0,0,0,0.45) !important;
}

/* Списки и строки — только палитра */
#adminPanel .admin-list,
#adminPanel .admin-item-list,
#adminPanel .admin-mode-list,
#tradePanel .ahardice-trade-list-v148,
#clanPanel .ahardice-clan-list-v148 {
  background: rgba(37, 73, 21, 0.96) !important;
  border-color: #1d3a12 !important;
}

#adminPanel .admin-row,
#adminPanel .admin-item-row,
#adminPanel .admin-mode-row,
#tradePanel .ahardice-trade-row-v148,
#clanPanel .ahardice-clan-row-v148 {
  background: #5e6c4d !important;
  border-color: #233017 !important;
  color: #fffbd0 !important;
}

#adminPanel .admin-row:hover,
#adminPanel .admin-item-row:hover,
#adminPanel .admin-mode-row:hover,
#adminPanel .admin-row.selected,
#adminPanel .admin-item-row.selected,
#adminPanel .admin-mode-row.enabled,
#tradePanel .ahardice-trade-row-v148:hover,
#clanPanel .ahardice-clan-row-v148:hover {
  background: #b7d66a !important;
  color: #ffffff !important;
}

/* Админские вкладки: только цвет, вкладку Игроки не убираю */
#adminPanel .admin-tabs .craft-category-tab {
  background: linear-gradient(180deg, #4a672c 0%, #2e451f 100%) !important;
  border-color: #111306 !important;
  color: #fffbd0 !important;
  box-shadow: none !important;
}

#adminPanel .admin-tabs .craft-category-tab.active,
#adminPanel .admin-tabs .craft-category-tab:hover {
  background: linear-gradient(180deg, #cfff6a 0%, #8cd936 100%) !important;
  border-color: #1d3a12 !important;
  color: #183006 !important;
}

/* Кнопки */
#adminPanel button,
#tradePanel button,
#clanPanel button,
#inventory .panel-close,
#chestPanel .panel-close,
.ahardice-yellow-button-v148,
.ahardice-green-button-v148,
.trade-confirm-modern,
.trade-cancel-modern,
.admin-give-button,
.admin-mode-toggle {
  border-color: #2a5518 !important;
}

.ahardice-yellow-button-v148,
.ahardice-green-button-v148,
.trade-confirm-modern,
.trade-cancel-modern,
.admin-give-button,
.admin-mode-toggle,
.admin-speed-controls button,
#clanCreateBtn {
  background: linear-gradient(180deg, #d8ff77 0%, #9cff3b 45%, #5ea821 100%) !important;
  color: #183006 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.35) !important;
}

/* Поля ввода */
#adminPanel input,
#clanPanel input {
  background-color: #1b2417 !important;
  border-color: #0d1608 !important;
  color: #fffbd0 !important;
}

#adminPanel input:focus,
#clanPanel input:focus {
  border-color: #cfff6a !important;
  box-shadow: 0 0 0 3px rgba(207,255,106,0.22) !important;
}

/* Трейд внутри: только цвета, без изменения сетки и размеров */
.trade-modern-offer {
  background: rgba(37, 73, 21, 0.96) !important;
  border-color: #1d3a12 !important;
  color: #fffbd0 !important;
}

.trade-modern-offer.confirmed {
  border-color: #cfff6a !important;
  box-shadow: 0 0 0 3px rgba(207,255,106,0.22) !important;
}

.trade-offer-head {
  color: #fffbd0 !important;
}

/* Слоты: НЕ меняю background-image, только рамку/цвет фона */
.inventory-slot,
.hotbar-slot,
.trade-offer-slot {
  background-color: #1b2417 !important;
  border-color: #0d1608 !important;
}

.inventory-slot:hover,
.hotbar-slot:hover,
.trade-offer-slot.can-place:hover {
  border-color: #cfff6a !important;
}

.inventory-slot.selected,
.hotbar-slot.selected,
.inventory-slot.picked,
.hotbar-slot.picked {
  outline-color: #cfff6a !important;
}

/* Скроллы */
#inventory *::-webkit-scrollbar-thumb,
#chestPanel *::-webkit-scrollbar-thumb,
#adminPanel *::-webkit-scrollbar-thumb,
#tradePanel *::-webkit-scrollbar-thumb,
#clanPanel *::-webkit-scrollbar-thumb {
  background: #cfff6a !important;
}


/* v166: ONLY inventory panel lime color fix. Do not touch hotbar/equipment/chest/admin/trade. */
#inventory.inventory.game-panel {
  background: linear-gradient(180deg, #9bef4f 0%, #77cf3d 48%, #5bad2e 100%) !important;
  border-color: #16350d !important;
  color: #fffbd0 !important;
}

#inventory .inventory-shell {
  background: linear-gradient(180deg, #74bf3f 0%, #5fa832 100%) !important;
  border-color: #244f16 !important;
}

#inventory .inventory-grid {
  background: linear-gradient(180deg, #4f8d2f 0%, #3e7725 100%) !important;
  border-color: #244f16 !important;
}

/* Only slots inside inventory window */
#inventory .inventory-slot {
  background-color: #315f1f !important;
  border-color: #16350d !important;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.13),
    0 3px 0 rgba(0,0,0,0.35) !important;
}

/* Preserve item images: do not override background-image on filled slots */
#inventory .inventory-slot:not([style*="background-image"]) {
  background-image: linear-gradient(180deg, #4b7c31 0%, #315f1f 100%) !important;
}

#inventory .inventory-slot:hover {
  border-color: #cfff6a !important;
}

#inventory .inventory-slot.selected,
#inventory .inventory-slot.picked {
  outline-color: #e6ff5a !important;
  border-color: #244f16 !important;
}

#inventory .slot-label {
  background: rgba(22, 53, 13, 0.78) !important;
  color: #fffbd0 !important;
}

#inventory .slot-count {
  background: rgba(22, 53, 13, 0.88) !important;
  color: #fffbd0 !important;
  border: 1px solid rgba(207,255,106,0.35) !important;
}


/* v167: trade lime palette + visible trade item icons */
#tradePanel.social-panel {
  background: linear-gradient(180deg, #9bef4f 0%, #77cf3d 48%, #5bad2e 100%) !important;
  border-color: #16350d !important;
  color: #fffbd0 !important;
}

#tradePanel .social-body,
#tradePanel .ahardice-trade-body-v148,
#tradePanel .ahardice-trade-list-v148,
#tradePanel .trade-modern-offer,
#tradePanel .trade-stack-list {
  background: linear-gradient(180deg, #4f8d2f 0%, #3e7725 100%) !important;
  border-color: #244f16 !important;
  color: #fffbd0 !important;
}

#tradePanel .ahardice-trade-row-v148 {
  background: #5e6c4d !important;
  border-color: #233017 !important;
  color: #fffbd0 !important;
}

#tradePanel .ahardice-trade-row-v148:hover,
#tradePanel .ahardice-trade-row-v148.pending,
#tradePanel .ahardice-trade-row-v148.incoming {
  background: #b7d66a !important;
  color: #ffffff !important;
}

#tradePanel .social-title,
#tradePanel .trade-offer-head {
  color: #fffbd0 !important;
  text-shadow: 0 3px 0 rgba(0,0,0,0.45) !important;
}

#tradePanel .ahardice-yellow-button-v148,
#tradePanel .trade-confirm-modern,
#tradePanel .trade-cancel-modern {
  background: linear-gradient(180deg, #d8ff77 0%, #9cff3b 45%, #5ea821 100%) !important;
  border-color: #2a5518 !important;
  color: #183006 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.35) !important;
}

#tradePanel .trade-cancel-modern {
  background: linear-gradient(180deg, #ffd56f 0%, #ffa92e 45%, #c76413 100%) !important;
  border-color: #683006 !important;
  color: #4b2003 !important;
}

#tradePanel .trade-offer-slot {
  background-color: #315f1f !important;
  border-color: #16350d !important;
  background-size: contain, auto !important;
  background-position: center, center !important;
  background-repeat: no-repeat, no-repeat !important;
}

#tradePanel .trade-offer-slot.filled {
  background-image: var(--trade-item-image, none), linear-gradient(180deg, #4b7c31 0%, #315f1f 100%) !important;
}

#tradePanel .trade-offer-slot.empty,
#tradePanel .trade-offer-slot.can-place {
  background-image: linear-gradient(180deg, #4b7c31 0%, #315f1f 100%) !important;
}

#tradePanel .trade-offer-slot.can-place:hover {
  border-color: #cfff6a !important;
  background-image: linear-gradient(180deg, #6ca846 0%, #3f7c25 100%) !important;
}

#tradePanel .trade-offer-slot span {
  background: rgba(22, 53, 13, 0.88) !important;
  color: #fffbd0 !important;
  border: 1px solid rgba(207,255,106,0.35) !important;
}


/* v168: manual trade slots and reliable item icons */
#tradePanel .trade-offer-slot {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
}

#tradePanel .trade-offer-icon {
  position: absolute !important;
  inset: 5px !important;
  display: block !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

#tradePanel .trade-offer-slot span {
  position: absolute !important;
  right: 3px !important;
  bottom: 2px !important;
  z-index: 5 !important;
}

#tradePanel .trade-offer-slot.can-remove {
  cursor: pointer !important;
}

#tradePanel .trade-offer-slot.can-remove::after {
  content: '↩' !important;
  position: absolute !important;
  left: 3px !important;
  top: 2px !important;
  z-index: 6 !important;
  font-size: 12px !important;
  color: #e6ff5a !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.75) !important;
  opacity: 0;
}

#tradePanel .trade-offer-slot.can-remove:hover::after {
  opacity: 1;
}

#tradePanel .trade-offer-slot.empty.can-place {
  cursor: copy !important;
}

#tradePanel .trade-offer-slot.empty.can-place:hover {
  box-shadow: inset 0 0 0 3px rgba(207,255,106,0.55), 0 3px 0 rgba(0,0,0,0.35) !important;
}


/* v169: reliable clickable mini trade inventory */
#tradePanel .trade-offer-slot {
  pointer-events: auto !important;
}

#tradePanel .trade-offer-slot.empty.can-place {
  cursor: copy !important;
}

#tradePanel .trade-offer-slot.filled.can-remove {
  cursor: pointer !important;
}

#tradePanel .trade-offer-icon {
  position: absolute !important;
  inset: 5px !important;
  display: block !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  z-index: 2 !important;
  pointer-events: none !important;
}


/* v170: leave confirmation modal */
.leave-confirm-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  background: rgba(0, 0, 0, 0.44);
  backdrop-filter: blur(2px);
}

.leave-confirm-overlay.hidden {
  display: none !important;
}

.leave-confirm-card {
  width: min(420px, calc(100vw - 32px));
  box-sizing: border-box;
  padding: 24px;
  border-radius: 16px;
  background: linear-gradient(180deg, #9bef4f 0%, #77cf3d 48%, #5bad2e 100%);
  border: 4px solid #16350d;
  color: #fffbd0;
  text-align: center;
  text-shadow: 0 2px 0 rgba(0,0,0,0.42);
  box-shadow: 0 10px 0 rgba(20,45,10,0.9), 0 22px 60px rgba(0,0,0,0.42);
}

.leave-confirm-card b {
  display: block;
  font-size: 30px;
  font-weight: 1000;
  margin-bottom: 10px;
}

.leave-confirm-card p {
  margin: 0 0 20px;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.35;
}

.leave-confirm-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.leave-confirm-actions button {
  min-height: 54px;
  border-radius: 12px;
  border: 3px solid #2a5518;
  background: linear-gradient(180deg, #d8ff77 0%, #9cff3b 45%, #5ea821 100%);
  color: #183006;
  font-size: 18px;
  font-weight: 1000;
  cursor: pointer;
  text-shadow: 0 1px 0 rgba(255,255,255,0.35);
  box-shadow: 0 5px 0 #2a5518, inset 0 1px 0 rgba(255,255,255,0.4);
}

#leaveConfirmYes {
  background: linear-gradient(180deg, #ffd56f 0%, #ffa92e 45%, #c76413 100%);
  border-color: #683006;
  color: #4b2003;
}


/* v171: rectangular player HP bar and cursor above trade panel */
.player-bottom-hp .player-bar.hp,
.player-bar.hp {
  border-radius: 3px !important;
  height: 9px !important;
  overflow: hidden !important;
}

.player-bottom-hp .player-bar.hp span,
.player-bar.hp span {
  border-radius: 2px !important;
}

.cursor-item,
#cursorItem {
  z-index: 10050 !important;
  pointer-events: none !important;
}


/* v171: trade mini inventory 5x4 */
#tradePanel .trade-offer-grid {
  grid-template-columns: repeat(5, 48px) !important;
  grid-auto-rows: 48px !important;
  gap: 7px !important;
  justify-content: center !important;
}

#tradePanel .trade-offer-slot {
  width: 48px !important;
  height: 48px !important;
}

#tradePanel .trade-offer-icon {
  inset: 4px !important;
}


/* v172: fit 5x4 trade offers and keep cursor visible */
body.trade-active #tradePanel {
  height: min(760px, calc(100vh - 48px)) !important;
  max-height: min(760px, calc(100vh - 48px)) !important;
  overflow: hidden !important;
}

body.trade-active #tradePanel .social-body {
  height: calc(100% - 52px) !important;
  overflow: hidden !important;
}

body.trade-active #tradePanel .trade-modern {
  height: 100% !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

body.trade-active #tradePanel .trade-modern-offers {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  overflow: hidden !important;
}

body.trade-active #tradePanel .trade-modern-offer {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: auto 1fr !important;
}

body.trade-active #tradePanel .trade-offer-grid,
#tradePanel .trade-offer-grid {
  grid-template-columns: repeat(5, 42px) !important;
  grid-auto-rows: 42px !important;
  gap: 7px !important;
  justify-content: center !important;
  align-content: center !important;
}

body.trade-active #tradePanel .trade-offer-slot,
#tradePanel .trade-offer-slot {
  width: 42px !important;
  height: 42px !important;
}

body.trade-active #tradePanel .trade-offer-icon,
#tradePanel .trade-offer-icon {
  inset: 4px !important;
}

body.trade-active #cursorItem.cursor-item:not(.hidden),
#cursorItem.cursor-item:not(.hidden) {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  position: fixed !important;
  z-index: 2147483647 !important;
  pointer-events: none !important;
}

/* v172: rectangular HP bar */
.player-bottom-hp .player-bar.hp,
.player-bar.hp {
  border-radius: 3px !important;
}

.player-bottom-hp .player-bar.hp span,
.player-bar.hp span {
  border-radius: 2px !important;
}


/* v173: shorter trade/request windows, compact 5x4 trade slots */
body.trade-active #tradePanel,
#tradePanel.social-panel.trade-panel {
  height: auto !important;
  max-height: min(560px, calc(100vh - 70px)) !important;
  min-height: 0 !important;
}

body.trade-active #tradePanel .social-body,
#tradePanel .social-body,
#tradePanel .ahardice-trade-body-v148 {
  max-height: min(488px, calc(100vh - 142px)) !important;
  height: auto !important;
  overflow: hidden !important;
}

body.trade-active #tradePanel .trade-modern {
  height: auto !important;
  max-height: none !important;
  gap: 8px !important;
}

body.trade-active #tradePanel .trade-modern-offers,
#tradePanel .trade-modern-offers {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  overflow: visible !important;
}

body.trade-active #tradePanel .trade-modern-offer,
#tradePanel .trade-modern-offer {
  min-height: 0 !important;
  height: auto !important;
  padding: 8px !important;
  overflow: visible !important;
}

body.trade-active #tradePanel .trade-offer-head,
#tradePanel .trade-offer-head {
  margin-bottom: 5px !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

body.trade-active #tradePanel .trade-offer-grid,
#tradePanel .trade-offer-grid {
  grid-template-columns: repeat(5, 38px) !important;
  grid-auto-rows: 38px !important;
  gap: 6px !important;
  justify-content: center !important;
  align-content: center !important;
}

body.trade-active #tradePanel .trade-offer-slot,
#tradePanel .trade-offer-slot {
  width: 38px !important;
  height: 38px !important;
  border-radius: 9px !important;
}

body.trade-active #tradePanel .trade-offer-icon,
#tradePanel .trade-offer-icon {
  inset: 3px !important;
}

body.trade-active #tradePanel .trade-modern-controls,
#tradePanel .trade-modern-controls {
  gap: 10px !important;
  margin-top: 4px !important;
}

body.trade-active #tradePanel .trade-confirm-modern,
body.trade-active #tradePanel .trade-cancel-modern,
#tradePanel .trade-confirm-modern,
#tradePanel .trade-cancel-modern {
  min-height: 48px !important;
  padding: 8px 12px !important;
}

/* Request list panel is also too high: make it content-sized */
#tradePanel.social-panel.trade-panel:not(.hidden) {
  height: auto !important;
}

#tradePanel .ahardice-trade-list-v148 {
  min-height: 0 !important;
  max-height: min(420px, calc(100vh - 190px)) !important;
  overflow-y: auto !important;
}

/* Rectangular HP bar with slightly rounded corners only */
.player-bottom-hp .player-bar.hp,
.player-bar.hp {
  border-radius: 3px !important;
}

.player-bottom-hp .player-bar.hp span,
.player-bar.hp span {
  border-radius: 2px !important;
}

/* Cursor must stay above trade panel */
.cursor-item,
#cursorItem {
  z-index: 2147483647 !important;
  pointer-events: none !important;
}


/* v175: restore inventory window to the blue design only (#inventory opened by I/TAB) */
#inventory.inventory.game-panel {
  background: linear-gradient(180deg, #0b86b5 0%, #08779e 48%, #05607d 100%) !important;
  border-color: rgba(0,0,0,0.86) !important;
  color: #ffffff !important;
}

#inventory .inventory-shell {
  background: linear-gradient(180deg, #0d6f96 0%, #085a78 100%) !important;
  border-color: #06384d !important;
}

#inventory .inventory-grid {
  background: linear-gradient(180deg, #07506b 0%, #063f56 100%) !important;
  border-color: #052f41 !important;
}

#inventory .inventory-title,
#inventory .large-title {
  color: #ffffff !important;
  text-shadow: 0 3px 0 rgba(0,0,0,0.45) !important;
}

#inventory .inventory-slot {
  background-color: #1d2b31 !important;
  border-color: #071b24 !important;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.10),
    0 3px 0 rgba(0,0,0,0.36) !important;
}

#inventory .inventory-slot:not([style*="background-image"]) {
  background-image: linear-gradient(180deg, #263842 0%, #17252c 100%) !important;
}

#inventory .inventory-slot:hover {
  border-color: #74dfff !important;
}

#inventory .slot-label {
  background: rgba(5, 24, 33, 0.78) !important;
  color: #ffffff !important;
}

#inventory .slot-count {
  background: rgba(5, 24, 33, 0.88) !important;
  color: #ffffff !important;
  border: 1px solid rgba(116,223,255,0.35) !important;
}

#inventory .panel-close {
  background: linear-gradient(180deg, #58c7ff, #2381bd) !important;
  border-color: #06384d !important;
  color: #ffffff !important;
}


/* v175: trade explicit return chip and red player damage numbers */
#tradePanel .trade-return-chip {
  position: absolute !important;
  left: 2px !important;
  top: 2px !important;
  z-index: 9 !important;
  width: 17px !important;
  height: 17px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 6px !important;
  background: rgba(15, 55, 18, 0.92) !important;
  border: 1px solid rgba(207,255,106,0.75) !important;
  color: #e9ff88 !important;
  font-style: normal !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.7) !important;
  pointer-events: auto !important;
}

#tradePanel .trade-offer-slot.can-remove:hover .trade-return-chip {
  background: rgba(170, 255, 52, 0.96) !important;
  color: #16350d !important;
  text-shadow: none !important;
}

.damage-number-player {
  position: fixed;
  z-index: 80;
  transform: translate(-50%, -50%);
  pointer-events: none;
  user-select: none;
  color: #ff3434;
  font-size: 22px;
  font-weight: 1000;
  -webkit-text-stroke: 1.2px rgba(60, 0, 0, 0.92);
  text-shadow:
    0 3px 0 rgba(80,0,0,0.85),
    0 0 10px rgba(255,40,40,0.62);
  animation: damageNumberFadeV175 1s ease-out forwards;
}

@keyframes damageNumberFadeV175 {
  0% { opacity: 1; transform: translate(-50%, -50%) scale(1.05); }
  55% { opacity: 1; transform: translate(-50%, -75%) scale(1.0); }
  100% { opacity: 0; transform: translate(-50%, -115%) scale(0.92); }
}


/* v176: stricter cursor follow / startup / server-authoritative HP */
#status {
  transition: opacity .15s ease;
}

.player-bottom-hp .player-bar.hp,
.player-bar.hp {
  border-radius: 3px !important;
}

.player-bottom-hp .player-bar.hp span,
.player-bar.hp span {
  border-radius: 2px !important;
}


/* v178: death lock, clan ally colors, clan panel polish */
body.player-dead-v178 #hotbar,
body.player-dead-v178 #inventory,
body.player-dead-v178 #chestPanel,
body.player-dead-v178 #craftPanel,
body.player-dead-v178 #buildPanel,
body.player-dead-v178 #shopPanel,
body.player-dead-v178 #settingsPanel,
body.player-dead-v178 #clanPanel,
body.player-dead-v178 #tradePanel,
body.player-dead-v178 #adminPanel,
body.player-dead-v178 #fullMapOverlay {
  pointer-events: none !important;
}

body.player-dead-v178 .death-overlay {
  z-index: 2147483000 !important;
  pointer-events: auto !important;
}

body.player-dead-v178 .death-respawn-button {
  pointer-events: auto !important;
}

.player-nameplate.ally .player-name {
  color: #8eff5f !important;
  text-shadow:
    0 1px 0 rgba(0,0,0,0.9),
    0 0 10px rgba(95, 255, 95, 0.38),
    1px 0 0 rgba(0,0,0,0.62),
    -1px 0 0 rgba(0,0,0,0.62) !important;
}

.player-nameplate.enemy .player-name,
.player-nameplate.me .player-name {
  color: #ffffff !important;
}

.player-nameplate.me .player-name {
  text-shadow:
    0 1px 0 rgba(0,0,0,0.9),
    1px 0 0 rgba(0,0,0,0.62),
    -1px 0 0 rgba(0,0,0,0.62) !important;
}

.player-clan {
  margin-right: 4px !important;
  color: #ffdf60 !important;
}

.player-bottom-hp.ally .player-bar.hp span {
  background: linear-gradient(90deg, #24e86c, #baff55) !important;
}

.player-bottom-hp.me .player-bar.hp span {
  background: linear-gradient(90deg, #6fd7ff, #e9fbff) !important;
}

.ahardice-clan-row-info-v178 {
  display: block;
  max-width: 210px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(225, 246, 210, 0.72);
  font-size: 12px;
  margin-top: 3px;
}

.ahardice-red-button-v178 {
  border: 0;
  border-radius: 10px;
  padding: 10px 14px;
  font-weight: 900;
  color: #fff;
  background: linear-gradient(180deg, #db5447, #a42a25);
  box-shadow: 0 4px 0 rgba(74, 15, 15, 0.75), 0 10px 18px rgba(0,0,0,0.22);
  cursor: pointer;
}

/* v180: clan server-ack status */
.ahardice-clan-pending-v180 {
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(255, 210, 64, 0.13);
  border: 1px solid rgba(255, 220, 92, 0.34);
  color: #ffe28a;
  font-size: 12px;
  font-weight: 800;
  text-shadow: 0 1px 0 rgba(0,0,0,0.55);
}

/* v183: clan leader crown and fixed neutral HP after leaving a clan */
.player-clan-crown {
  position: relative;
  display: block;
  width: 100%;
  height: 17px;
  margin: 0 auto 1px;
  font-size: 17px;
  line-height: 17px;
  text-align: center;
  filter: drop-shadow(0 2px 2px rgba(0,0,0,0.85));
  transform: translateY(2px);
}

.player-bottom-hp.me .player-bar.hp span {
  background: linear-gradient(90deg, #24e86c, #baff55) !important;
}

#clanButton.has-alert::after {
  content: '!';
  position: absolute;
  right: -5px;
  top: -7px;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, #ffdd4b, #ff7a18);
  color: #451800;
  font-size: 14px;
  font-weight: 1000;
  border: 2px solid rgba(40, 15, 0, .85);
  box-shadow: 0 3px 8px rgba(0,0,0,.38);
}
#clanButton { position: relative; }

/* v184: strict clan panel layout and request flow */
#clanPanel .ahardice-clan-row-v184 {
  grid-template-columns: minmax(0, 1fr) 112px !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  margin-bottom: 8px !important;
}

#clanPanel .ahardice-clan-row-v184.active {
  background: rgba(124, 148, 96, 0.72) !important;
}

.ahardice-clan-titlebox-v184 {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.ahardice-clan-titlebox-v184 > b {
  display: block !important;
}

.ahardice-clan-member-row-v184,
.ahardice-clan-request-row-v184 {
  min-height: 48px !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 8px 0 !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  background: rgba(10, 42, 20, 0.55) !important;
  color: #fffbd0 !important;
}

.ahardice-clan-request-row-v184 {
  grid-template-columns: minmax(0, 1fr) 150px !important;
  background: rgba(255, 201, 45, 0.16) !important;
  border: 1px solid rgba(255, 224, 92, 0.25) !important;
}

.ahardice-clan-eye-v184 {
  width: 42px !important;
  height: 42px !important;
  border-radius: 8px !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(5, 23, 15, 0.82) !important;
  color: #fff !important;
  font-size: 20px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 2px 4px rgba(0,0,0,.35) !important;
}

.ahardice-clan-member-row-v184 b,
.ahardice-clan-request-row-v184 b {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 20px !important;
  font-weight: 1000 !important;
  text-shadow: 0 3px 1px rgba(0,0,0,0.48) !important;
}

.ahardice-clan-request-actions-v184 {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

#clanPanel .ahardice-clan-form-v184.in-clan {
  grid-template-columns: 1fr !important;
}

#clanPanel .ahardice-clan-leave-v184 {
  width: min(240px, 100%) !important;
  justify-self: center !important;
  min-height: 44px !important;
}

/* v185: 30s reconnect grace visual marker */
.player-nameplate.afk .player-name {
  opacity: 0.82;
}
.player-afk {
  color: #ffd95a;
  text-shadow: 0 2px 0 rgba(0,0,0,.55);
  margin-right: 4px;
}

/* v189: clan request status + leader kick controls */
#clanPanel .ahardice-clan-sent-v189 {
  min-width: 110px !important;
  min-height: 46px !important;
  border-radius: 10px !important;
  border: 2px solid rgba(255,255,255,.20) !important;
  background: linear-gradient(180deg, #b8d57d, #6e9449) !important;
  color: rgba(20,55,18,.86) !important;
  font-weight: 1000 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.40) !important;
  opacity: .88 !important;
  cursor: default !important;
  pointer-events: none !important;
}

#clanPanel .ahardice-clan-member-row-v184.can-kick-v189 {
  grid-template-columns: 44px minmax(0, 1fr) 110px !important;
}

#clanPanel .ahardice-clan-kick-v189 {
  min-height: 38px !important;
  padding: 6px 10px !important;
  border-radius: 10px !important;
  border: 2px solid rgba(60, 13, 13, .65) !important;
  background: linear-gradient(180deg, #ff6b4a, #b91818) !important;
  color: #fff8d4 !important;
  font-size: 14px !important;
  font-weight: 1000 !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.35) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 4px 0 rgba(63,17,13,.65) !important;
  cursor: pointer !important;
}

#clanPanel .ahardice-clan-kick-v189:hover {
  transform: translateY(-1px) !important;
}

.trade-toast,
.trade-toast * {
  pointer-events: auto !important;
}

.trade-toast .trade-toast-btn {
  cursor: pointer !important;
  touch-action: manipulation !important;
}

/* v190: cleaner clan panel layout + reliable leader kick button */
#clanPanel.social-panel {
  width: min(500px, calc(100vw - 24px)) !important;
  max-height: min(650px, calc(100vh - 80px)) !important;
}

#clanPanel .ahardice-clan-body-v184 {
  padding-bottom: 76px !important;
}

#clanPanel .ahardice-clan-list-v184 {
  right: 18px !important;
  left: 10px !important;
  top: 8px !important;
  bottom: 66px !important;
  padding: 10px !important;
  border-radius: 12px !important;
  box-sizing: border-box !important;
}

#clanPanel .ahardice-clan-browser-row-v190,
#clanPanel .ahardice-clan-row-v184:not(.active) {
  min-height: 70px !important;
  grid-template-columns: minmax(0, 1fr) 116px !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;
}

#clanPanel .ahardice-clan-titlebox-v184 {
  justify-content: center !important;
  overflow: hidden !important;
}

#clanPanel .ahardice-clan-titlebox-v184 > b {
  line-height: 1.05 !important;
}

#clanPanel .ahardice-clan-row-info-v178 {
  max-width: 100% !important;
  font-size: 13px !important;
  color: rgba(255, 255, 220, .76) !important;
}

#clanPanel .ahardice-clan-current-header-v190 {
  min-height: 78px !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 0 10px !important;
  padding: 10px 14px !important;
  border-radius: 12px !important;
  background: linear-gradient(90deg, rgba(113, 135, 85, .88), rgba(89, 111, 68, .58)) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-sizing: border-box !important;
}

#clanPanel .ahardice-clan-current-titlebox-v190 {
  width: 100% !important;
  display: grid !important;
  place-items: center !important;
  gap: 4px !important;
  text-align: center !important;
}

#clanPanel .ahardice-clan-current-titlebox-v190 > b {
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 30px !important;
  font-weight: 1000 !important;
  color: #fffbd0 !important;
  text-shadow: 0 3px 1px rgba(0,0,0,.48) !important;
}

#clanPanel .ahardice-clan-current-info-v190 {
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  color: rgba(255,255,220,.75) !important;
}

#clanPanel .ahardice-clan-member-row-v184 {
  min-height: 58px !important;
  margin: 8px 0 !important;
  padding: 8px 10px !important;
  box-sizing: border-box !important;
  pointer-events: auto !important;
}

#clanPanel .ahardice-clan-member-row-v184.can-kick-v189 {
  grid-template-columns: 44px minmax(0, 1fr) 118px !important;
}

#clanPanel .ahardice-clan-kick-v189 {
  position: relative !important;
  z-index: 2 !important;
  pointer-events: auto !important;
  min-width: 104px !important;
  min-height: 40px !important;
  touch-action: manipulation !important;
}

#clanPanel .ahardice-clan-form-v184 {
  left: 14px !important;
  right: 14px !important;
  bottom: 8px !important;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 210px) !important;
  gap: 14px !important;
}

#clanPanel .ahardice-clan-form-v184.in-clan {
  grid-template-columns: 1fr !important;
}

#clanPanel .ahardice-clan-form-v184 input {
  min-width: 0 !important;
}

#clanPanel .ahardice-clan-leave-v184 {
  width: min(250px, 100%) !important;
}


/* v191 Ahardice logo + polished main title */
.main-brand {
  display: grid;
  justify-items: center;
  gap: 8px;
  margin-bottom: 28px;
  pointer-events: none;
}

.main-brand-logo {
  width: min(260px, 42vw);
  max-height: 210px;
  object-fit: contain;
  image-rendering: auto;
  filter:
    drop-shadow(0 10px 0 rgba(0,0,0,0.24))
    drop-shadow(0 20px 22px rgba(0,0,0,0.34));
  transform-origin: center bottom;
  animation: ahardiceLogoFloat 3.2s ease-in-out infinite;
}

.main-brand-logo.logo-missing,
.loading-logo-img.logo-missing {
  display: none !important;
}

.ahardice-logo {
  margin: 0 !important;
  font-size: clamp(58px, 7.2vw, 92px) !important;
  line-height: 0.92;
  font-weight: 1000;
  letter-spacing: 1px;
  color: #fff7a6 !important;
  -webkit-text-stroke: 3px #43210b !important;
  text-shadow:
    0 4px 0 #8b4d15,
    0 8px 0 #3b1c09,
    0 13px 16px rgba(0,0,0,0.45),
    0 0 28px rgba(255, 228, 89, 0.35) !important;
}

.ahardice-logo::first-letter {
  color: #ffcf45;
}

.loading-logo-img {
  width: 138px;
  height: 138px;
  object-fit: contain;
  margin: 0 auto 10px;
  display: block;
  filter:
    drop-shadow(0 7px 0 rgba(0,0,0,0.22))
    drop-shadow(0 14px 18px rgba(0,0,0,0.35));
}

.loading-logo {
  color: #fff7a6 !important;
  -webkit-text-stroke: 1.5px #43210b;
  text-shadow:
    0 3px 0 #8b4d15,
    0 6px 0 #3b1c09,
    0 10px 18px rgba(0,0,0,0.32) !important;
}

@keyframes ahardiceLogoFloat {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-7px) scale(1.015); }
}

@media (max-height: 760px) {
  .main-brand {
    gap: 4px;
    margin-bottom: 18px;
  }
  .main-brand-logo {
    width: min(190px, 36vw);
    max-height: 150px;
  }
  .ahardice-logo {
    font-size: clamp(48px, 6vw, 70px) !important;
  }
}

/* v192: orange #FE7700 panel palette + map/trade/clan cleanup */
:root {
  --ah-orange: #FE7700;
  --ah-orange-light: #ffb14c;
  --ah-orange-mid: #df6400;
  --ah-orange-dark: #8f3c00;
  --ah-orange-deep: #3b1700;
  --ah-panel-text: #fff7d8;
}

/* Main game panels now share the Ahardice orange palette. */
#inventory.inventory.game-panel,
#chestPanel.game-panel,
#craftPanel.game-panel,
#buildPanel.game-panel,
#shopPanel.game-panel,
#settingsPanel.game-panel,
#leaderboardPanel.game-panel,
#adminPanel.game-panel,
#clanPanel.social-panel,
#tradePanel.social-panel,
#tradePanel.social-panel.trade-panel,
.full-map-card {
  background: linear-gradient(180deg, var(--ah-orange-light) 0%, var(--ah-orange) 42%, var(--ah-orange-mid) 100%) !important;
  border-color: var(--ah-orange-deep) !important;
  color: var(--ah-panel-text) !important;
  box-shadow:
    0 6px 0 rgba(56, 18, 0, .46),
    0 22px 60px rgba(0,0,0,.38),
    inset 0 2px 0 rgba(255,255,255,.25) !important;
}

#inventory .inventory-shell,
#chestPanel .inventory-shell,
#craftPanel .craft-body,
#buildPanel .craft-body,
#shopPanel .craft-body,
#settingsPanel .settings-body,
#adminPanel .admin-body,
#tradePanel .social-body,
#clanPanel .social-body,
#tradePanel .ahardice-trade-body-v148,
#clanPanel .ahardice-clan-body-v148 {
  background: linear-gradient(180deg, rgba(148, 58, 0, .96), rgba(74, 27, 0, .96)) !important;
  border-color: rgba(56, 18, 0, .95) !important;
  color: var(--ah-panel-text) !important;
}

#inventory .inventory-title,
#chestPanel .inventory-title,
#craftPanel .craft-title,
#buildPanel .craft-title,
#shopPanel .craft-title,
#settingsPanel .settings-title,
#adminPanel .admin-title,
#tradePanel .social-title,
#clanPanel .social-title,
.full-map-card > .inventory-title {
  color: #fff7d8 !important;
  text-shadow: 0 3px 0 rgba(60, 18, 0, .72), 0 0 12px rgba(255, 177, 76, .45) !important;
}

#tradePanel .ahardice-trade-list-v148,
#clanPanel .ahardice-clan-list-v148,
#adminPanel .admin-list,
#adminPanel .admin-item-list,
#adminPanel .admin-mode-list,
#craftPanel .craft-grid,
#buildPanel .craft-grid,
#shopPanel .craft-grid,
#inventory .inventory-grid,
#chestPanel .inventory-grid {
  background: linear-gradient(180deg, rgba(72, 25, 0, .98), rgba(46, 17, 0, .98)) !important;
  border-color: rgba(42, 14, 0, .98) !important;
}

#tradePanel .ahardice-trade-row-v148,
#clanPanel .ahardice-clan-row-v148,
#clanPanel .ahardice-clan-current-header-v190,
#clanPanel .ahardice-clan-member-row-v184,
#adminPanel .admin-row,
#adminPanel .admin-item-row,
#adminPanel .admin-mode-row {
  background: linear-gradient(90deg, rgba(139, 58, 0, .92), rgba(96, 39, 0, .72)) !important;
  border-color: rgba(50, 18, 0, .92) !important;
  color: #fff7d8 !important;
}

#tradePanel .ahardice-trade-row-v148:hover,
#clanPanel .ahardice-clan-row-v148:hover,
#clanPanel .ahardice-clan-member-row-v184:hover,
#adminPanel .admin-row:hover,
#adminPanel .admin-item-row:hover,
#adminPanel .admin-mode-row:hover {
  background: linear-gradient(90deg, rgba(254,119,0,.95), rgba(255,177,76,.78)) !important;
  color: #fff !important;
}

#adminPanel button,
#tradePanel button,
#clanPanel button,
#craftPanel button,
#buildPanel button,
#shopPanel button,
.ahardice-yellow-button-v148,
.ahardice-green-button-v148,
.trade-confirm-modern,
.trade-cancel-modern,
.admin-give-button,
.admin-mode-toggle,
#clanCreateBtn {
  background: linear-gradient(180deg, #ffd16f 0%, var(--ah-orange) 48%, #b44b00 100%) !important;
  border-color: rgba(65, 22, 0, .96) !important;
  color: #321100 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.38) !important;
}

#adminPanel button:hover,
#tradePanel button:hover,
#clanPanel button:hover,
#craftPanel button:hover,
#buildPanel button:hover,
#shopPanel button:hover,
.ahardice-yellow-button-v148:hover,
.ahardice-green-button-v148:hover,
#clanCreateBtn:hover {
  filter: brightness(1.08) saturate(1.05) !important;
}

#adminPanel input,
#clanPanel input,
#settingsPanel input {
  background: rgba(40, 14, 0, .96) !important;
  border-color: rgba(28, 9, 0, .98) !important;
  color: #fff7d8 !important;
}

#adminPanel input:focus,
#clanPanel input:focus,
#settingsPanel input:focus {
  border-color: var(--ah-orange-light) !important;
  box-shadow: 0 0 0 3px rgba(254,119,0,.28) !important;
}

.inventory-slot,
.hotbar-slot,
.trade-offer-slot {
  background-color: rgba(44, 15, 0, .96) !important;
  border-color: rgba(27, 8, 0, .98) !important;
}

.inventory-slot:hover,
.hotbar-slot:hover,
.trade-offer-slot.can-place:hover,
.inventory-slot.selected,
.hotbar-slot.selected,
.inventory-slot.picked,
.hotbar-slot.picked {
  border-color: var(--ah-orange-light) !important;
  outline-color: var(--ah-orange-light) !important;
}

/* Trade empty state instead of a dead-looking blank panel. */
#tradePanel .ahardice-trade-empty-v192 {
  min-height: 86px;
  display: grid;
  place-items: center;
  padding: 18px;
  color: #fff7d8;
  font-size: 22px;
  font-weight: 1000;
  text-align: center;
  text-shadow: 0 2px 0 rgba(50, 15, 0, .7);
  background: rgba(72, 25, 0, .62);
  border: 2px solid rgba(255, 177, 76, .32);
  border-radius: 14px;
}

/* Full map: orange frame, no feeling of a duplicated blue back panel. */
.full-map-card {
  background: linear-gradient(180deg, #ffab46 0%, #FE7700 48%, #b84f00 100%) !important;
  border-color: #3b1700 !important;
}

#fullMapCanvas {
  border-color: rgba(42, 14, 0, .98) !important;
  box-shadow: inset 0 0 0 2px rgba(255,177,76,.20), inset 0 0 24px rgba(0,0,0,.56) !important;
}

#fullMapClose {
  background: linear-gradient(180deg, #ffd16f 0%, #FE7700 48%, #a94500 100%) !important;
  border-color: #3b1700 !important;
}

#inventory *::-webkit-scrollbar-thumb,
#chestPanel *::-webkit-scrollbar-thumb,
#adminPanel *::-webkit-scrollbar-thumb,
#tradePanel *::-webkit-scrollbar-thumb,
#clanPanel *::-webkit-scrollbar-thumb,
#craftPanel *::-webkit-scrollbar-thumb,
#buildPanel *::-webkit-scrollbar-thumb,
#shopPanel *::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #ffd16f, #FE7700) !important;
}


/* v193: finish orange palette, restore active slots, fix main menu tabs, stronger map layer */
:root {
  --ah-orange: #FE7700;
  --ah-orange-2: #ff9b22;
  --ah-orange-3: #c85000;
  --ah-orange-dark: #3b1700;
  --ah-orange-panel: #5a2100;
  --ah-orange-panel-2: #331100;
}

/* Craft / Build / Shop had old late CSS overriding v192. Force the whole catalog shell to orange. */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel,
#craftPanel.game-panel:not(.hidden),
#buildPanel.game-panel:not(.hidden),
#shopPanel.game-panel:not(.hidden) {
  background: linear-gradient(180deg, #ffb14c 0%, #FE7700 46%, #b94b00 100%) !important;
  border-color: #3b1700 !important;
  color: #fff6d6 !important;
  box-shadow: 0 7px 0 rgba(56,18,0,.45), 0 24px 55px rgba(0,0,0,.36), inset 0 2px 0 rgba(255,255,255,.24) !important;
}

#craftPanel .craft-shell,
#buildPanel .craft-shell,
#shopPanel .craft-shell,
#craftPanel .craft-list-wrap,
#buildPanel .craft-list-wrap,
#shopPanel .craft-list-wrap,
#craftPanel .craft-detail,
#buildPanel .craft-detail,
#shopPanel .craft-detail,
#craftPanel .craft-list,
#buildPanel .craft-list,
#shopPanel .craft-list {
  background: linear-gradient(180deg, rgba(88,34,0,.96), rgba(45,15,0,.97)) !important;
  border-color: rgba(52,16,0,.98) !important;
  color: #fff6d6 !important;
}

#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs,
#craftPanel .simple-catalog-tabs,
#buildPanel .simple-catalog-tabs,
#shopPanel .simple-catalog-tabs {
  background: linear-gradient(180deg, rgba(74,26,0,.94), rgba(38,12,0,.96)) !important;
  border-color: rgba(46,14,0,.98) !important;
}

#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .catalog-tab,
#buildPanel .catalog-tab,
#shopPanel .catalog-tab,
#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button,
#craftPanel .catalog-action,
#buildPanel .catalog-action,
#shopPanel .catalog-action {
  background: linear-gradient(180deg, #ffd06a 0%, #FE7700 48%, #ae4400 100%) !important;
  border-color: #3b1700 !important;
  color: #351100 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.45) !important;
}

#craftPanel .craft-category-tab.active,
#buildPanel .craft-category-tab.active,
#shopPanel .craft-category-tab.active,
#craftPanel .catalog-tab.active,
#buildPanel .catalog-tab.active,
#shopPanel .catalog-tab.active,
#craftPanel .craft-list-item.selected,
#buildPanel .craft-list-item.selected,
#shopPanel .craft-list-item.selected,
#craftPanel .catalog-card.selected,
#buildPanel .catalog-card.selected,
#shopPanel .catalog-card.selected {
  background: linear-gradient(180deg, #ffb347 0%, #FE7700 52%, #9c3d00 100%) !important;
  border-color: #ffd46e !important;
  color: #fff9df !important;
  box-shadow: inset 0 0 0 2px rgba(255,214,110,.28), 0 5px 12px rgba(72,24,0,.25) !important;
}

#craftPanel .craft-list-item,
#buildPanel .craft-list-item,
#shopPanel .craft-list-item,
#craftPanel .catalog-card,
#buildPanel .catalog-card,
#shopPanel .catalog-card,
#craftPanel .craft-recipe-box,
#buildPanel .craft-recipe-box,
#shopPanel .craft-recipe-box {
  background: linear-gradient(90deg, rgba(132,52,0,.88), rgba(83,30,0,.82)) !important;
  border-color: rgba(55,18,0,.96) !important;
  color: #fff6d6 !important;
}

/* The user did not ask to recolor active inventory/hotbar slots. Restore the old readable highlight. */
.hotbar-slot.selected,
.inventory-slot.selected,
.hotbar-slot.picked,
.inventory-slot.picked {
  border-color: #ffe66e !important;
  outline-color: #ffe66e !important;
  box-shadow: 0 0 0 2px rgba(255,230,110,.46), inset 0 0 0 2px rgba(255,255,255,.08) !important;
}

.hotbar-slot:hover,
.inventory-slot:hover {
  border-color: rgba(255,255,255,.42) !important;
  outline-color: transparent !important;
}

/* Main menu tabs: no more blue active state; use the Ahardice orange gradient. */
.main-menu-tab.active,
.main-menu-tab:hover,
.main-menu-left-tabs .main-menu-tab.active,
.main-menu-left-tabs .main-menu-tab:hover {
  background: linear-gradient(180deg, #ffd36b 0%, #FE7700 47%, #ad4400 100%) !important;
  border-color: #3b1700 !important;
  color: #351100 !important;
  box-shadow: 0 5px 0 rgba(69,22,0,.55), 0 10px 18px rgba(0,0,0,.20), inset 0 2px 0 rgba(255,255,255,.34) !important;
}

.main-menu-tab.active span,
.main-menu-left-tabs .main-menu-tab.active span,
.main-menu-tab:hover span,
.main-menu-left-tabs .main-menu-tab:hover span {
  color: #351100 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.42) !important;
}

/* Big map object layer is back and stronger; keep frame orange and canvas clean. */
.full-map-card {
  background: linear-gradient(180deg, #ffb14c 0%, #FE7700 47%, #a74100 100%) !important;
}

#fullMapCanvas {
  background: rgba(15, 9, 4, .72) !important;
}

/* v194: catalog action buttons stay green, catalog rows clearly show available recipes/builds/items. */
#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button,
#craftPanel button.craft-create-button,
#buildPanel button.craft-create-button,
#shopPanel button.craft-create-button {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  width: 192px !important;
  min-height: 48px !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #d9ff75 0%, #75e92f 48%, #37a915 100%) !important;
  border: 2px solid #1d650d !important;
  color: #123500 !important;
  font-weight: 1000 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.45) !important;
  box-shadow:
    0 5px 0 #1e6e0b,
    0 9px 15px rgba(0,0,0,.30),
    inset 0 2px 0 rgba(255,255,255,.42) !important;
  background-clip: padding-box !important;
}

#craftPanel .craft-create-button:hover,
#buildPanel .craft-create-button:hover,
#shopPanel .craft-create-button:hover {
  filter: brightness(1.06) saturate(1.08) !important;
}

#craftPanel .craft-create-button:disabled,
#buildPanel .craft-create-button:disabled,
#shopPanel .craft-create-button:disabled {
  background: linear-gradient(180deg, #8a8375 0%, #665c52 100%) !important;
  border-color: #30241b !important;
  color: #ddd2c5 !important;
  box-shadow: 0 5px 0 #30241b, inset 0 1px 0 rgba(255,255,255,.13) !important;
  opacity: .86 !important;
}

#craftPanel .craft-list-item,
#buildPanel .craft-list-item,
#shopPanel .craft-list-item,
#craftPanel .catalog-card,
#buildPanel .catalog-card,
#shopPanel .catalog-card {
  position: relative !important;
}

#craftPanel .craft-list-item.can-afford:not(.selected),
#buildPanel .craft-list-item.can-afford:not(.selected),
#shopPanel .craft-list-item.can-afford:not(.selected),
#craftPanel .catalog-card.can-afford:not(.selected),
#buildPanel .catalog-card.can-afford:not(.selected),
#shopPanel .catalog-card.can-afford:not(.selected) {
  background: linear-gradient(90deg, rgba(79,126,34,.94), rgba(64,92,31,.88)) !important;
  box-shadow: inset 4px 0 0 #9dff45, inset 0 0 0 1px rgba(180,255,110,.20) !important;
}

#craftPanel .craft-list-item.can-afford.selected,
#buildPanel .craft-list-item.can-afford.selected,
#shopPanel .craft-list-item.can-afford.selected,
#craftPanel .catalog-card.can-afford.selected,
#buildPanel .catalog-card.can-afford.selected,
#shopPanel .catalog-card.can-afford.selected {
  background: linear-gradient(90deg, #aee86a 0%, #e2b96d 100%) !important;
  box-shadow: inset 4px 0 0 #76ff2c, inset 0 0 0 2px rgba(255,238,156,.32), 0 5px 12px rgba(72,24,0,.25) !important;
}

#craftPanel .craft-list-item.can-afford::after,
#buildPanel .craft-list-item.can-afford::after,
#shopPanel .craft-list-item.can-afford::after,
#craftPanel .catalog-card.can-afford::after,
#buildPanel .catalog-card.can-afford::after,
#shopPanel .catalog-card.can-afford::after {
  content: '✓';
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, #d9ff75, #45c91a);
  border: 2px solid #1d650d;
  color: #123500;
  font-size: 15px;
  font-weight: 1000;
  text-shadow: 0 1px 0 rgba(255,255,255,.35);
  box-shadow: 0 2px 0 rgba(20,80,8,.75), 0 4px 8px rgba(0,0,0,.25);
  pointer-events: none;
}

#craftPanel .craft-list-item.can-afford .craft-list-name,
#buildPanel .craft-list-item.can-afford .craft-list-name,
#shopPanel .craft-list-item.can-afford .craft-list-name,
#craftPanel .catalog-card.can-afford .catalog-title,
#buildPanel .catalog-card.can-afford .catalog-title,
#shopPanel .catalog-card.can-afford .catalog-title {
  color: #f4ffd5 !important;
}

#craftPanel .craft-list-item.can-afford,
#buildPanel .craft-list-item.can-afford,
#shopPanel .craft-list-item.can-afford {
  padding-right: 38px !important;
}


/* v195: panel/button polish + cleaner map/world UI */
#craftPanel .craft-list-item.can-afford::after,
#buildPanel .craft-list-item.can-afford::after,
#shopPanel .craft-list-item.can-afford::after,
#craftPanel .catalog-card.can-afford::after,
#buildPanel .catalog-card.can-afford::after,
#shopPanel .catalog-card.can-afford::after {
  content: none !important;
  display: none !important;
}

#craftPanel .craft-list-item.can-afford,
#buildPanel .craft-list-item.can-afford,
#shopPanel .craft-list-item.can-afford {
  padding-right: 14px !important;
}

#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button,
#craftPanel button.craft-create-button,
#buildPanel button.craft-create-button,
#shopPanel button.craft-create-button {
  transition: transform .06s ease, box-shadow .06s ease, filter .10s ease !important;
}

#craftPanel .craft-create-button:active,
#buildPanel .craft-create-button:active,
#shopPanel .craft-create-button:active,
#craftPanel button.craft-create-button:active,
#buildPanel button.craft-create-button:active,
#shopPanel button.craft-create-button:active {
  transform: translateY(4px) scale(0.992) !important;
  box-shadow:
    0 1px 0 #1e6e0b,
    0 3px 7px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.32) !important;
}

#buildPanel .catalog-card:active .catalog-action,
#shopPanel .catalog-card:active .catalog-action,
#craftPanel .catalog-card:active .catalog-action,
#buildPanel .catalog-card:active,
#shopPanel .catalog-card:active,
#craftPanel .catalog-card:active {
  transform: translateY(3px) scale(0.994) !important;
}

#buildPanel .catalog-card,
#shopPanel .catalog-card,
#craftPanel .catalog-card {
  transition: transform .06s ease, filter .10s ease !important;
}

.player-nameplate .player-name {
  font-size: 30px !important;
  line-height: 1.05 !important;
  font-weight: 1000 !important;
  letter-spacing: 0.15px !important;
}

.player-nameplate .player-clan {
  font-size: 30px !important;
  margin-right: 6px !important;
}

.player-clan-crown {
  height: 24px !important;
  font-size: 24px !important;
  line-height: 24px !important;
  margin-bottom: 0 !important;
  transform: translateY(-5px) scale(1.08) !important;
}


/* v196: nameplate tuning — slightly larger, not oversized */
.player-nameplate {
  width: 190px !important;
}

.player-nameplate .player-name {
  max-width: 190px !important;
  font-size: 16px !important;
  line-height: 1.08 !important;
  font-weight: 1000 !important;
  letter-spacing: 0.05px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-nameplate .player-clan {
  font-size: 16px !important;
  margin-right: 4px !important;
}

.player-clan-crown {
  height: 20px !important;
  font-size: 20px !important;
  line-height: 20px !important;
  margin-bottom: 1px !important;
  transform: translateY(-4px) scale(1.02) !important;
}

/* v197 special building panel */
.structure-panel {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(460px, calc(100vw - 30px));
  min-height: 220px;
  z-index: 92;
  padding: 18px 20px 20px;
  box-sizing: border-box;
  border-radius: 16px;
  border: 4px solid #2b1600;
  background: linear-gradient(180deg, #ff8b1f 0%, #e06000 100%);
  box-shadow: 0 8px 0 rgba(0,0,0,.35), inset 0 0 0 3px rgba(255,255,255,.18);
  color: #fff7cf;
  font-family: inherit;
}
.structure-panel.hidden { display: none !important; }
.structure-close {
  position: absolute;
  right: 10px;
  top: 8px;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  border: 3px solid #2b1600;
  background: linear-gradient(180deg, #9dff59, #50c210);
  color: #fff;
  font-size: 30px;
  font-weight: 900;
  text-shadow: 0 2px 0 rgba(0,0,0,.45);
}
.structure-title {
  text-align: center;
  font-size: 30px;
  font-weight: 1000;
  text-shadow: 0 3px 0 rgba(0,0,0,.42);
  margin: 4px 48px 16px;
}
.structure-body {
  display: grid;
  gap: 12px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(30, 14, 0, .58);
}
.structure-recipe {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255, 244, 170, .16);
  border: 2px solid rgba(255,255,255,.12);
}
.structure-recipe b { display:block; font-size: 17px; }
.structure-recipe span { display:block; font-size: 14px; color:#ffe6a5; }
.structure-recipe button,
.structure-action {
  min-width: 116px;
  min-height: 46px;
  border: 3px solid #2b1600;
  border-radius: 12px;
  background: linear-gradient(180deg, #b8ff59 0%, #5edc12 62%, #2da500 100%);
  color: #183800;
  font-weight: 1000;
  font-size: 16px;
  box-shadow: 0 5px 0 rgba(0,0,0,.32), inset 0 2px 0 rgba(255,255,255,.55);
}
.structure-recipe button:disabled,
.structure-action:disabled {
  filter: grayscale(.65) brightness(.75);
  opacity: .72;
}
.structure-recipe button:active,
.structure-action:active {
  transform: translateY(4px);
  box-shadow: 0 1px 0 rgba(0,0,0,.32), inset 0 2px 0 rgba(255,255,255,.35);
}
.structure-fuel {
  display: grid;
  gap: 10px;
}
.structure-fuel-label {
  font-weight: 900;
  font-size: 18px;
  text-shadow: 0 2px 0 rgba(0,0,0,.35);
}
.structure-fuel-bar {
  height: 24px;
  border-radius: 999px;
  border: 3px solid #2b1600;
  overflow: hidden;
  background: rgba(0,0,0,.45);
}
.structure-fuel-bar i {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #ffe15a, #9dff4d, #30d900);
}
.structure-fuel-hint { color: #ffe6a5; font-weight: 800; font-size: 14px; }

/* v198: special buildings polish */
body.chest-open-v198 #inventory.inventory.game-panel {
  display: block !important;
  left: calc(50% - 365px) !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  width: min(520px, calc(50vw - 34px)) !important;
  z-index: 91 !important;
}

body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  display: block !important;
  left: calc(50% + 365px) !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  width: min(620px, calc(50vw - 34px)) !important;
  z-index: 92 !important;
}

body.chest-open-v198 #inventory .inventory-title::after {
  content: ' — слева';
  font-size: 14px;
  opacity: .8;
}

@media (max-width: 1180px) {
  body.chest-open-v198 #inventory.inventory.game-panel,
  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    left: 50% !important;
    width: min(620px, calc(100vw - 28px)) !important;
  }
  body.chest-open-v198 #inventory.inventory.game-panel {
    top: 45% !important;
    transform: translate(-50%, -100%) scale(.86) !important;
  }
  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    top: 53% !important;
    transform: translate(-50%, 0) scale(.86) !important;
  }
}

.fuel-counter-v198 {
  position: absolute;
  transform: translate(-50%, -50%);
  display: grid;
  grid-template-columns: 22px 92px auto;
  align-items: center;
  gap: 5px;
  min-width: 154px;
  padding: 4px 6px;
  border-radius: 10px;
  border: 2px solid rgba(35, 13, 0, .92);
  background: linear-gradient(180deg, rgba(75, 26, 0, .88), rgba(28, 9, 0, .86));
  color: #fff7d8;
  font-size: 11px;
  font-weight: 1000;
  text-shadow: 0 1px 0 rgba(0,0,0,.55);
  pointer-events: none;
  z-index: 34;
  box-shadow: 0 4px 10px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.16);
}

.fuel-counter-icon {
  width: 22px;
  height: 22px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.fuel-counter-bar {
  display: block;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.14);
}

.fuel-counter-bar i {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #ffef75 0%, #86ff43 70%, #2bd700 100%);
}

.structure-panel {
  width: min(560px, calc(100vw - 30px)) !important;
  min-height: 300px !important;
}

.structure-smelter-v198 {
  display: grid;
  grid-template-columns: 1fr 48px 1fr;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 16px;
  background: rgba(51, 17, 0, .72);
  border: 2px solid rgba(43, 15, 0, .9);
}

.structure-slot-wrap {
  display: grid;
  gap: 8px;
  justify-items: center;
}

.structure-slot-title {
  font-weight: 1000;
  color: #fff7d8;
  text-shadow: 0 2px 0 rgba(0,0,0,.42);
}

.structure-slot {
  width: 92px;
  height: 92px;
  border-radius: 18px;
  border: 3px solid #2b1600;
  background: linear-gradient(180deg, rgba(35,15,0,.94), rgba(12,5,0,.96));
  display: grid;
  place-items: center;
  position: relative;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.10), 0 5px 0 rgba(0,0,0,.28);
}

.structure-slot:disabled {
  opacity: .72;
  filter: grayscale(.25);
}

.structure-slot:not(:disabled):active {
  transform: translateY(4px);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.10), 0 1px 0 rgba(0,0,0,.32);
}

.structure-slot-icon {
  width: 66px;
  height: 66px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.structure-slot-empty {
  font-size: 38px;
  font-weight: 1000;
  color: rgba(255,247,216,.72);
}

.structure-slot b {
  position: absolute;
  right: 7px;
  bottom: 5px;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.58);
  color: #fff7d8;
  font-size: 14px;
}

.structure-slot-hint {
  min-height: 34px;
  color: #ffe6a5;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  line-height: 1.25;
}

.structure-arrow {
  font-size: 38px;
  font-weight: 1000;
  color: #fff0a5;
  text-align: center;
  text-shadow: 0 3px 0 rgba(0,0,0,.42);
}

.structure-recipes-v198 {
  display: grid;
  gap: 7px;
  margin-top: 12px;
}

.structure-recipes-v198 button {
  min-height: 34px;
  border-radius: 10px;
  border: 2px solid #2b1600;
  background: linear-gradient(180deg, #d9ff75, #66d51a) !important;
  color: #173400 !important;
  font-size: 13px;
  font-weight: 1000;
}

.structure-recipes-v198 button.missing,
.structure-recipes-v198 button:disabled {
  background: linear-gradient(180deg, #7f7060, #4f4036) !important;
  color: #dfd0c4 !important;
  opacity: .75;
}

#buildPanel .craft-list-item.locked-account {
  filter: grayscale(.35) brightness(.82);
  opacity: .84;
}

#buildPanel .craft-list-item.locked-account .craft-list-meta::after {
  content: ' • нужен аккаунт';
  color: #ffd0a5;
}

/* v199: private chest + smelter rebuild and special building polish */
body.chest-open-v198 #inventory.inventory.game-panel,
body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  top: 50% !important;
  bottom: auto !important;
  max-height: min(620px, calc(100vh - 130px)) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body.chest-open-v198 #inventory.inventory.game-panel {
  left: calc(50% - 330px) !important;
  transform: translate(-50%, -50%) !important;
  width: 430px !important;
  padding: 14px !important;
}

body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  left: calc(50% + 345px) !important;
  transform: translate(-50%, -50%) !important;
  width: 590px !important;
  padding: 14px !important;
}

body.chest-open-v198 #inventory .inventory-shell,
body.chest-open-v198 #chestPanel .inventory-shell {
  max-height: calc(100vh - 190px) !important;
  overflow: hidden !important;
  border-radius: 16px !important;
}

body.chest-open-v198 #inventory .inventory-grid {
  grid-template-columns: repeat(5, 58px) !important;
  gap: 10px !important;
  max-height: calc(100vh - 285px) !important;
  overflow-y: auto !important;
  padding-right: 4px !important;
}

body.chest-open-v198 #chestPanel .chest-grid,
body.chest-open-v198 #chestPanel .inventory-grid {
  grid-template-columns: repeat(6, 58px) !important;
  gap: 10px !important;
  max-height: calc(100vh - 245px) !important;
  overflow-y: auto !important;
  padding-right: 10px !important;
}

body.chest-open-v198 #inventory .inventory-title::after {
  content: ' — инвентарь' !important;
}

body.chest-open-v198 #chestPanel .inventory-title::after {
  content: ' — только владелец' !important;
  display: inline-block;
  margin-left: 8px;
  font-size: 12px;
  opacity: .78;
}

@media (max-width: 1180px) {
  body.chest-open-v198 #inventory.inventory.game-panel,
  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    left: 50% !important;
    width: min(590px, calc(100vw - 28px)) !important;
  }
  body.chest-open-v198 #inventory.inventory.game-panel {
    top: 45% !important;
    transform: translate(-50%, -100%) scale(.84) !important;
  }
  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    top: 54% !important;
    transform: translate(-50%, 0) scale(.84) !important;
  }
}

/* Clearer fuel display under bonfire/freezer. */
.fuel-counter-v198 {
  grid-template-columns: 24px 104px auto !important;
  min-width: 176px !important;
  padding: 5px 7px !important;
}
.fuel-counter-icon { width: 24px !important; height: 24px !important; }
.fuel-counter-bar { height: 14px !important; }

/* Robust smelter panel with two obvious slots. */
#structurePanel.structure-panel {
  width: min(620px, calc(100vw - 30px)) !important;
  min-height: 360px !important;
  overflow: visible !important;
}

.smelter-panel-v199 {
  display: grid;
  gap: 14px;
  padding: 16px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(80, 28, 0, .82), rgba(38, 13, 0, .86));
  border: 3px solid rgba(42, 14, 0, .96);
  box-shadow: inset 0 2px 0 rgba(255,255,255,.14);
}

.smelter-slots-v199 {
  display: grid;
  grid-template-columns: 150px 54px 150px;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.smelter-slot-v199 {
  position: relative;
  width: 150px;
  height: 150px;
  border-radius: 20px;
  border: 4px solid #2b1600;
  background: linear-gradient(180deg, rgba(33, 14, 0, .98), rgba(12, 4, 0, .98));
  box-shadow: 0 7px 0 rgba(0,0,0,.34), inset 0 0 0 3px rgba(255,255,255,.11);
  display: grid;
  place-items: center;
  color: #fff7d8;
}

.smelter-slot-v199:disabled {
  opacity: .86;
  filter: grayscale(.08);
}

.smelter-slot-v199:not(:disabled):active {
  transform: translateY(5px);
  box-shadow: 0 2px 0 rgba(0,0,0,.34), inset 0 0 0 3px rgba(255,255,255,.11);
}

.smelter-slot-label {
  position: absolute;
  top: 8px;
  left: 10px;
  right: 10px;
  font-size: 13px;
  font-weight: 1000;
  color: #ffe9a6;
  text-shadow: 0 2px 0 rgba(0,0,0,.55);
}

.smelter-slot-icon-v199 {
  width: 88px;
  height: 88px;
  margin-top: 16px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.smelter-slot-empty-v199 {
  margin-top: 16px;
  font-size: 50px;
  line-height: 1;
  font-weight: 1000;
  color: rgba(255,247,216,.76);
}

.smelter-slot-v199 b {
  position: absolute;
  right: 10px;
  bottom: 8px;
  border-radius: 999px;
  padding: 2px 8px;
  background: rgba(0,0,0,.66);
  color: #fff7d8;
  font-size: 15px;
}

.smelter-arrow-v199 {
  font-size: 42px;
  font-weight: 1000;
  color: #fff0a5;
  text-align: center;
  text-shadow: 0 3px 0 rgba(0,0,0,.45);
}

.smelter-hint-v199 {
  color: #ffe6a5;
  font-size: 14px;
  font-weight: 900;
  text-align: center;
  line-height: 1.3;
}

.smelter-recipes-v199 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.smelter-recipes-v199 button {
  min-height: 42px;
  border-radius: 12px;
  border: 3px solid #2b1600;
  background: linear-gradient(180deg, #c9ff65, #53cb0c) !important;
  color: #173400 !important;
  font-size: 12px;
  font-weight: 1000;
  box-shadow: 0 4px 0 rgba(0,0,0,.28), inset 0 2px 0 rgba(255,255,255,.45);
}

.smelter-recipes-v199 button.missing,
.smelter-recipes-v199 button:disabled {
  background: linear-gradient(180deg, #7a6655, #4a3428) !important;
  color: #ddc6b8 !important;
  opacity: .78;
}

/* v200: private chest 30 slots + robust smelter/fuel polish */
body.chest-open-v198 #inventory.inventory.game-panel,
body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  top: 50% !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) !important;
  width: 440px !important;
  max-height: min(610px, calc(100vh - 120px)) !important;
  padding: 14px !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
body.chest-open-v198 #inventory.inventory.game-panel {
  left: calc(50% - 245px) !important;
  z-index: 94 !important;
}
body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  left: calc(50% + 245px) !important;
  z-index: 95 !important;
}
body.chest-open-v198 #inventory .inventory-shell,
body.chest-open-v198 #chestPanel .inventory-shell {
  max-height: calc(100vh - 170px) !important;
  overflow: hidden !important;
  padding: 12px !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(39, 14, 0, .94), rgba(18, 7, 0, .96)) !important;
  border: 3px solid #2b1600 !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.12) !important;
}
body.chest-open-v198 #inventory .inventory-header,
body.chest-open-v198 #chestPanel .inventory-header {
  min-height: 46px !important;
  margin-bottom: 10px !important;
}
body.chest-open-v198 #inventory .inventory-title,
body.chest-open-v198 #chestPanel .inventory-title {
  font-size: 22px !important;
  line-height: 1 !important;
}
body.chest-open-v198 #inventory .inventory-title::after,
body.chest-open-v198 #chestPanel .inventory-title::after {
  content: '' !important;
}
body.chest-open-v198 #chestPanel .inventory-title span {
  font-size: 13px !important;
  opacity: .82 !important;
  margin-left: 6px !important;
}
body.chest-open-v198 #inventory .inventory-grid,
body.chest-open-v198 #chestPanel .chest-grid,
body.chest-open-v198 #chestPanel .inventory-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 62px) !important;
  grid-auto-rows: 62px !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 9px !important;
  max-height: 445px !important;
  overflow-y: auto !important;
  padding: 4px 6px 8px !important;
  box-sizing: border-box !important;
}
body.chest-open-v198 #chestPanel .inventory-slot,
body.chest-open-v198 #inventory .inventory-slot {
  width: 62px !important;
  height: 62px !important;
}
body.chest-open-v198 #chestPanel .inventory-slot .item-icon,
body.chest-open-v198 #inventory .inventory-slot .item-icon {
  width: 46px !important;
  height: 46px !important;
}
@media (max-width: 980px) {
  body.chest-open-v198 #inventory.inventory.game-panel,
  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    left: 50% !important;
    width: min(440px, calc(100vw - 24px)) !important;
  }
  body.chest-open-v198 #inventory.inventory.game-panel {
    top: 45% !important;
    transform: translate(-50%, -100%) scale(.86) !important;
  }
  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    top: 54% !important;
    transform: translate(-50%, 0) scale(.86) !important;
  }
}

#structurePanel.structure-panel {
  width: min(560px, calc(100vw - 34px)) !important;
  min-height: 0 !important;
  padding: 18px !important;
  overflow: visible !important;
  color: #fff7cf !important;
}
#structurePanel.structure-panel .structure-title {
  display: block !important;
  color: #fff7cf !important;
  font-size: 28px !important;
  margin: 0 52px 14px !important;
}
#structurePanel.structure-panel .structure-close {
  display: grid !important;
  place-items: center !important;
}
.smelter-panel-v199 {
  display: grid !important;
  gap: 12px !important;
  min-height: 260px !important;
  box-sizing: border-box !important;
}
.smelter-slots-v199 {
  display: grid !important;
  grid-template-columns: 134px 44px 134px !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 12px !important;
}
.smelter-slot-v199 {
  display: grid !important;
  place-items: center !important;
  width: 134px !important;
  height: 134px !important;
  min-width: 134px !important;
  min-height: 134px !important;
}
.smelter-slot-icon-v199 {
  width: 78px !important;
  height: 78px !important;
}
.smelter-slot-empty-v199 {
  display: block !important;
  color: rgba(255,247,216,.82) !important;
}
.smelter-recipes-v199 {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 7px !important;
}
.smelter-recipes-v199 button {
  display: block !important;
}


/* v201: cleaner private chest, clustered map buildings, and smelter recipe side panel */
body.chest-open-v198 #inventory.inventory.game-panel,
body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  width: 452px !important;
  max-height: min(620px, calc(100vh - 120px)) !important;
  padding: 16px !important;
  border-radius: 20px !important;
  overflow: visible !important;
  background: linear-gradient(180deg, var(--ah-orange-light) 0%, var(--ah-orange) 45%, var(--ah-orange-mid) 100%) !important;
  border: 4px solid var(--ah-orange-deep) !important;
  box-shadow: 0 6px 0 rgba(56, 18, 0, .46), 0 22px 60px rgba(0,0,0,.38), inset 0 2px 0 rgba(255,255,255,.25) !important;
}
body.chest-open-v198 #inventory.inventory.game-panel {
  left: calc(50% - 250px) !important;
}
body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  left: calc(50% + 250px) !important;
}
body.chest-open-v198 #inventory .inventory-shell,
body.chest-open-v198 #chestPanel .inventory-shell {
  padding: 14px !important;
  border-radius: 17px !important;
  background: linear-gradient(180deg, rgba(148, 58, 0, .96), rgba(74, 27, 0, .97)) !important;
  border: 3px solid rgba(56, 18, 0, .98) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.15), inset 0 -4px 0 rgba(0,0,0,.24) !important;
  max-height: none !important;
  overflow: visible !important;
}
body.chest-open-v198 #inventory .inventory-header,
body.chest-open-v198 #chestPanel .inventory-header {
  min-height: 42px !important;
  margin: 0 0 12px !important;
}
body.chest-open-v198 #inventory .inventory-title,
body.chest-open-v198 #chestPanel .inventory-title {
  font-size: 24px !important;
  line-height: 1 !important;
  color: #fff7d8 !important;
  text-shadow: 0 3px 0 rgba(60,18,0,.72), 0 0 12px rgba(255,177,76,.42) !important;
}
body.chest-open-v198 #inventory .inventory-title span,
body.chest-open-v198 #chestPanel .inventory-title span {
  font-size: 12px !important;
  color: #fff0b8 !important;
  background: rgba(65, 22, 0, .55) !important;
  border: 1px solid rgba(255, 202, 110, .22) !important;
  padding: 4px 7px !important;
  border-radius: 8px !important;
}
body.chest-open-v198 #inventory .inventory-grid,
body.chest-open-v198 #chestPanel .inventory-grid,
body.chest-open-v198 #chestPanel .chest-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 58px) !important;
  grid-auto-rows: 58px !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 8px !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 8px !important;
  border-radius: 13px !important;
  background: linear-gradient(180deg, rgba(55, 19, 0, .94), rgba(30, 10, 0, .96)) !important;
  border: 2px solid rgba(42, 14, 0, .98) !important;
  box-sizing: content-box !important;
}
body.chest-open-v198 #inventory .inventory-slot,
body.chest-open-v198 #chestPanel .inventory-slot {
  width: 58px !important;
  height: 58px !important;
  border-radius: 11px !important;
  background-color: rgba(20, 27, 38, 0.74) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.24) !important;
}
body.chest-open-v198 #inventory .inventory-slot .item-icon,
body.chest-open-v198 #chestPanel .inventory-slot .item-icon {
  width: 44px !important;
  height: 44px !important;
}
body.chest-open-v198 #chestPanel .chest-note {
  display: none !important;
}
@media (max-width: 980px) {
  body.chest-open-v198 #inventory.inventory.game-panel,
  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    width: min(452px, calc(100vw - 24px)) !important;
    left: 50% !important;
  }
  body.chest-open-v198 #inventory.inventory.game-panel {
    top: 45% !important;
    transform: translate(-50%, -100%) scale(.86) !important;
  }
  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    top: 54% !important;
    transform: translate(-50%, 0) scale(.86) !important;
  }
}

#structurePanel.structure-panel {
  width: min(760px, calc(100vw - 34px)) !important;
  padding: 18px !important;
  border-radius: 20px !important;
  background: linear-gradient(180deg, var(--ah-orange-light), var(--ah-orange) 42%, var(--ah-orange-mid)) !important;
  border: 4px solid var(--ah-orange-deep) !important;
}
#structurePanel.structure-panel .structure-title {
  margin: 0 54px 14px !important;
  text-align: left !important;
  font-size: 28px !important;
}
.smelter-panel-v201 {
  display: grid !important;
  grid-template-columns: minmax(300px, 1fr) 260px !important;
  gap: 14px !important;
  min-height: 300px !important;
}
.smelter-machine-v201,
.smelter-info-v201 {
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(72,25,0,.96), rgba(36,12,0,.98)) !important;
  border: 3px solid rgba(42,14,0,.95) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.10) !important;
  padding: 14px !important;
}
.smelter-slots-v201 {
  display: grid !important;
  grid-template-columns: 128px 44px 128px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  min-height: 150px !important;
}
.smelter-slot-v201 {
  width: 128px !important;
  height: 128px !important;
  display: grid !important;
  place-items: center !important;
  position: relative !important;
  border-radius: 16px !important;
  border: 3px solid rgba(255, 180, 84, .32) !important;
  background: linear-gradient(180deg, rgba(46, 16, 0, .98), rgba(20, 7, 0, .98)) !important;
  color: #fff7d8 !important;
  box-shadow: inset 0 0 0 2px rgba(0,0,0,.25), 0 4px 0 rgba(0,0,0,.28) !important;
}
.smelter-slot-v201:not(:disabled):hover {
  border-color: rgba(158, 255, 54, .72) !important;
}
.smelter-slot-v201:disabled {
  opacity: .72 !important;
  cursor: default !important;
}
.smelter-slot-v201 b {
  position: absolute !important;
  right: 8px !important;
  top: 8px !important;
  padding: 2px 6px !important;
  border-radius: 9px !important;
  background: rgba(0,0,0,.62) !important;
  color: #fff2a8 !important;
}
.smelter-slot-label {
  position: absolute !important;
  left: 8px !important;
  top: 8px !important;
  font-size: 12px !important;
  opacity: .86 !important;
}
.smelter-slot-icon-v201 {
  width: 78px !important;
  height: 78px !important;
  display: block !important;
  background: center/contain no-repeat !important;
  filter: drop-shadow(0 4px 2px rgba(0,0,0,.35)) !important;
}
.smelter-slot-empty-v201 {
  font-size: 46px !important;
  font-weight: 900 !important;
  color: rgba(255,247,216,.72) !important;
}
.smelter-arrow-v201 {
  text-align: center !important;
  font-size: 38px !important;
  font-weight: 900 !important;
  color: #fff3a8 !important;
  text-shadow: 0 3px 0 rgba(0,0,0,.45) !important;
}
.smelter-hint-v201 {
  margin-top: 12px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: rgba(20, 7, 0, .52) !important;
  color: #fff1be !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}
.smelter-hint-v201 small {
  color: rgba(255,247,216,.72) !important;
}
.smelter-info-title-v201 {
  font-size: 18px !important;
  font-weight: 900 !important;
  margin-bottom: 10px !important;
  color: #fff7d8 !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.45) !important;
}
.smelter-recipes-v201 {
  display: grid !important;
  gap: 8px !important;
  max-height: 230px !important;
  overflow-y: auto !important;
}
.smelter-recipe-card-v201 {
  display: grid !important;
  grid-template-columns: 78px 1fr !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  gap: 2px 8px !important;
  padding: 8px !important;
  border-radius: 12px !important;
  border: 2px solid rgba(255, 190, 96, .22) !important;
  background: linear-gradient(180deg, rgba(112, 44, 0, .94), rgba(52, 18, 0, .96)) !important;
  color: #fff6cc !important;
  text-align: left !important;
}
.smelter-recipe-card-v201.ok {
  border-color: rgba(137, 255, 45, .65) !important;
}
.smelter-recipe-card-v201.missing {
  opacity: .58 !important;
}
.smelter-recipe-icons-v201 {
  grid-row: 1 / span 2 !important;
  display: grid !important;
  grid-template-columns: 28px 18px 28px !important;
  align-items: center !important;
  gap: 2px !important;
}
.smelter-recipe-icons-v201 i {
  width: 28px !important;
  height: 28px !important;
  display: block !important;
  background: center/contain no-repeat !important;
}
.smelter-recipe-icons-v201 b {
  text-align: center !important;
  color: #fff2a8 !important;
}
.smelter-recipe-card-v201 span:not(.smelter-recipe-icons-v201) {
  font-weight: 900 !important;
}
.smelter-recipe-card-v201 em {
  font-style: normal !important;
  font-size: 12px !important;
  opacity: .9 !important;
}
@media (max-width: 760px) {
  .smelter-panel-v201 {
    grid-template-columns: 1fr !important;
  }
}

/* v202: inventory/chest layout requested by user
   Inventory: 7 columns x 5 rows, closer to the left dock.
   Personal chest: 6 columns x 5 rows, shifted right so the player remains visible.
   Palette: #FEAA01 -> #F36B0F. */
:root {
  --ah-orange: #F36B0F;
  --ah-orange-light: #FEAA01;
  --ah-orange-mid: #F36B0F;
  --ah-orange-dark: #9f3b00;
  --ah-orange-deep: #3b1500;
  --ah-panel-text: #fff7d8;
}

body.chest-open-v198 #inventory.inventory.game-panel,
body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  top: 50% !important;
  max-height: min(650px, calc(100vh - 120px)) !important;
  padding: 16px !important;
  border-radius: 20px !important;
  overflow: visible !important;
  background: linear-gradient(180deg, #FEAA01 0%, #F36B0F 48%, #b94800 100%) !important;
  border: 4px solid #3b1500 !important;
  box-shadow:
    0 6px 0 rgba(56,18,0,.48),
    0 22px 60px rgba(0,0,0,.38),
    inset 0 2px 0 rgba(255,255,255,.28) !important;
}

body.chest-open-v198 #inventory.inventory.game-panel {
  left: clamp(112px, 14vw, 270px) !important;
  transform: translate(0, -50%) !important;
  width: 560px !important;
}

body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  left: min(calc(100vw - 540px), calc(50% + 120px)) !important;
  transform: translate(0, -50%) !important;
  width: 490px !important;
}

body.chest-open-v198 #inventory .inventory-shell,
body.chest-open-v198 #chestPanel .inventory-shell {
  padding: 14px !important;
  border-radius: 17px !important;
  background: linear-gradient(180deg, rgba(138,50,0,.97), rgba(62,20,0,.98)) !important;
  border: 3px solid rgba(55,17,0,.98) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.15), inset 0 -4px 0 rgba(0,0,0,.24) !important;
  max-height: none !important;
  overflow: visible !important;
}

body.chest-open-v198 #inventory .inventory-title,
body.chest-open-v198 #chestPanel .inventory-title {
  color: #fff7d8 !important;
  text-shadow: 0 3px 0 rgba(60,18,0,.72), 0 0 12px rgba(254,170,1,.42) !important;
}

body.chest-open-v198 #inventory .inventory-grid,
body.chest-open-v198 #chestPanel .inventory-grid,
body.chest-open-v198 #chestPanel .chest-grid {
  display: grid !important;
  grid-auto-rows: 58px !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 8px !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 8px !important;
  border-radius: 13px !important;
  background: linear-gradient(180deg, rgba(55,19,0,.94), rgba(30,10,0,.96)) !important;
  border: 2px solid rgba(42,14,0,.98) !important;
  box-sizing: content-box !important;
}

body.chest-open-v198 #inventory #inventoryGrid.inventory-grid,
body.chest-open-v198 #inventory .inventory-grid.fancy-grid {
  grid-template-columns: repeat(7, 58px) !important;
}

body.chest-open-v198 #chestPanel #chestGrid.inventory-grid,
body.chest-open-v198 #chestPanel .chest-grid {
  grid-template-columns: repeat(6, 58px) !important;
}

body.chest-open-v198 #inventory .inventory-slot,
body.chest-open-v198 #chestPanel .inventory-slot {
  width: 58px !important;
  height: 58px !important;
  border-radius: 11px !important;
  background-color: rgba(20,27,38,.74) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.09) !important;
}

body.chest-open-v198 #inventory .inventory-slot:hover,
body.chest-open-v198 #chestPanel .inventory-slot:hover,
body.chest-open-v198 #inventory .inventory-slot.picked,
body.chest-open-v198 #chestPanel .inventory-slot.picked {
  border-color: rgba(254,170,1,.82) !important;
  box-shadow: 0 0 0 2px rgba(254,170,1,.22), inset 0 0 0 1px rgba(0,0,0,.24) !important;
}

body.chest-open-v198 #inventory .inventory-slot .item-icon,
body.chest-open-v198 #chestPanel .inventory-slot .item-icon {
  width: 44px !important;
  height: 44px !important;
}

body.chest-open-v198 #chestPanel .chest-note {
  display: none !important;
}

@media (max-width: 1280px) {
  body.chest-open-v198 #inventory.inventory.game-panel {
    left: 86px !important;
    width: 520px !important;
  }

  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    left: calc(50% + 84px) !important;
    width: 470px !important;
  }
}

@media (max-width: 980px) {
  body.chest-open-v198 #inventory.inventory.game-panel,
  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    width: min(560px, calc(100vw - 24px)) !important;
    left: 50% !important;
  }

  body.chest-open-v198 #inventory.inventory.game-panel {
    top: 45% !important;
    transform: translate(-50%, -100%) scale(.84) !important;
  }

  body.chest-open-v198 #chestPanel.chest-panel.game-panel {
    top: 54% !important;
    transform: translate(-50%, 0) scale(.84) !important;
  }
}


/* v207: active potion effects are shown to the right of the hotbar. */
.active-potion-effects {
  position: fixed;
  left: calc(50% + 318px);
  bottom: 28px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  max-width: min(390px, calc(100vw - 24px));
  gap: 7px;
  padding: 7px;
  border-radius: 14px;
  background: rgba(8, 12, 20, 0.58);
  border: 1px solid rgba(255,255,255,0.15);
  backdrop-filter: blur(8px);
  z-index: 42;
  user-select: none;
  pointer-events: none;
}

.active-potion-effects.hidden,
body.menu-open .active-potion-effects,
body:not(.game-started) .active-potion-effects,
body.player-dead-v178 .active-potion-effects {
  display: none !important;
}

.active-potion-effect {
  position: relative;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background-color: rgba(24, 33, 46, 0.86);
  background-size: 76%;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid rgba(254, 170, 1, 0.85);
  box-shadow:
    0 4px 12px rgba(0,0,0,0.38),
    inset 0 0 0 1px rgba(0,0,0,0.35),
    0 0 10px rgba(243,107,15,0.35);
  overflow: hidden;
}

.active-potion-effect::after {
  content: '';
  position: absolute;
  left: 7px;
  right: 7px;
  bottom: 4px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, #FEAA01, #F36B0F);
  box-shadow: 0 0 7px rgba(254,170,1,0.65);
}

.active-potion-effect.negative {
  --status-color: #ff5b66;
  border-color: color-mix(in srgb, var(--status-color) 86%, white 14%);
  box-shadow:
    0 4px 12px rgba(0,0,0,0.42),
    inset 0 0 0 1px rgba(0,0,0,0.38),
    0 0 11px color-mix(in srgb, var(--status-color) 48%, transparent);
}

.active-potion-effect.negative::after {
  background: var(--status-color);
  box-shadow: 0 0 7px color-mix(in srgb, var(--status-color) 70%, transparent);
}

.active-potion-shine {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.22), rgba(255,255,255,0.02) 45%, rgba(0,0,0,0.18));
  pointer-events: none;
}

@media (max-width: 1050px) {
  .active-potion-effects {
    left: auto;
    right: 12px;
    bottom: 90px;
  }
}

.status-vision-overlay {
  --vision-x: 50vw;
  --vision-y: 50vh;
  --vision-radius: 118px;
  position: fixed;
  inset: 0;
  z-index: 18;
  pointer-events: none;
  background: radial-gradient(
    circle var(--vision-radius) at var(--vision-x) var(--vision-y),
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.04) 60%,
    rgba(0, 0, 0, 0.84) 82%,
    rgba(0, 0, 0, 0.985) 100%
  );
  transition: background 80ms linear;
}

.status-vision-overlay.hidden,
body.menu-open .status-vision-overlay,
body:not(.game-started) .status-vision-overlay,
body.player-dead-v178 .status-vision-overlay {
  display: none !important;
}

/* v210: chat input centered above the level HUD, about 4.5 hotbar slots wide */
.chat-box.chat-open {
  left: 50% !important;
  right: auto !important;
  bottom: 202px !important;
  width: 300px !important;
  max-width: calc(100vw - 32px) !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  z-index: 86 !important;
}

.chat-box.chat-open .chat-input {
  display: block !important;
  width: 100% !important;
  height: 42px !important;
  box-sizing: border-box !important;
  padding: 10px 14px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(0, 0, 0, 0.72) !important;
  background: linear-gradient(180deg, rgba(20, 28, 40, 0.97), rgba(9, 14, 22, 0.97)) !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  outline: none !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255,255,255,0.08) !important;
  pointer-events: auto !important;
}

.chat-box.chat-open .chat-input::placeholder {
  color: rgba(220, 232, 255, 0.52) !important;
}

/* v215: local admin password login + entity admin tab */
.server-password-login {
  display: flex;
  gap: 8px;
  width: min(100%, 420px);
  align-items: center;
}
.server-password-login input {
  flex: 1;
  min-width: 0;
}
.server-password-login button {
  border: 0;
  border-radius: 12px;
  padding: 10px 12px;
  font-weight: 900;
  color: #ffffff;
  background: linear-gradient(180deg, #ffb23a, #f36b0f);
  box-shadow: 0 4px 0 #8a3307, 0 7px 12px rgba(0,0,0,.25);
  cursor: pointer;
}
.admin-entity-categories {
  align-self: stretch;
  align-items: center;
}
.admin-entity-categories button.selected {
  filter: brightness(1.18);
  transform: translateY(1px);
}
.admin-spawn-controls .admin-give-button {
  min-width: 190px;
}

/* v241: Ahardice-like active slots + clean inventory/count text */
#hotbar.hotbar {
  grid-template-columns: repeat(9, 68px) !important;
  gap: 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

#hotbar .hotbar-slot {
  width: 68px !important;
  height: 68px !important;
  border-radius: 6px !important;
  border: 2px solid rgba(0,0,0,.92) !important;
  background-color: rgba(53, 82, 42, .70) !important;
  background-size: 74% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

#hotbar .hotbar-slot:hover {
  background-color: rgba(68, 103, 54, .76) !important;
  border-color: rgba(0,0,0,.96) !important;
}

#hotbar .hotbar-slot.selected,
#hotbar .hotbar-slot.picked {
  outline: none !important;
  border-color: rgba(0,0,0,1) !important;
  background-color: rgba(74, 112, 58, .84) !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.10) !important;
}

.slot-hotkey,
.slot-label,
#inventory .slot-label,
#hotbar .slot-label,
#inventory .slot-hotkey,
#hotbar .slot-hotkey {
  display: none !important;
}

.slot-count,
#inventory .slot-count,
#hotbar .slot-count,
#chestPanel .slot-count {
  left: 5px !important;
  top: 4px !important;
  right: auto !important;
  bottom: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: left !important;
  text-shadow: 0 2px 2px rgba(0,0,0,.95), 1px 0 1px rgba(0,0,0,.85) !important;
  pointer-events: none !important;
}

#inventory.inventory.game-panel {
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 560px !important;
  max-height: min(650px, calc(100vh - 120px)) !important;
  padding: 16px !important;
  border-radius: 20px !important;
  overflow: visible !important;
  background: linear-gradient(180deg, #FEAA01 0%, #F36B0F 48%, #b94800 100%) !important;
  border: 4px solid #3b1500 !important;
  box-shadow: 0 6px 0 rgba(56,18,0,.48), 0 22px 60px rgba(0,0,0,.38), inset 0 2px 0 rgba(255,255,255,.28) !important;
  color: #fff7d8 !important;
}

#inventory .inventory-shell {
  padding: 14px !important;
  border-radius: 17px !important;
  background: linear-gradient(180deg, rgba(138,50,0,.97), rgba(62,20,0,.98)) !important;
  border: 3px solid rgba(55,17,0,.98) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.15), inset 0 -4px 0 rgba(0,0,0,.24) !important;
  max-height: none !important;
  overflow: visible !important;
}

#inventory .inventory-title {
  color: #fff7d8 !important;
  font-size: 24px !important;
  line-height: 1 !important;
  text-shadow: 0 3px 0 rgba(60,18,0,.72), 0 0 12px rgba(254,170,1,.42) !important;
}

#inventory #inventoryGrid.inventory-grid,
#inventory .inventory-grid.fancy-grid {
  display: grid !important;
  grid-template-columns: repeat(7, 58px) !important;
  grid-auto-rows: 58px !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 8px !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 8px !important;
  border-radius: 13px !important;
  background: linear-gradient(180deg, rgba(55,19,0,.94), rgba(30,10,0,.96)) !important;
  border: 2px solid rgba(42,14,0,.98) !important;
  box-sizing: content-box !important;
}

#inventory .inventory-slot,
#chestPanel .inventory-slot {
  width: 58px !important;
  height: 58px !important;
  border-radius: 11px !important;
  background-color: rgba(20,27,38,.74) !important;
  background-size: 78% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.09) !important;
}

#inventory .inventory-slot:hover,
#inventory .inventory-slot.picked,
#chestPanel .inventory-slot:hover,
#chestPanel .inventory-slot.picked {
  border-color: rgba(254,170,1,.82) !important;
  box-shadow: 0 0 0 2px rgba(254,170,1,.22), inset 0 0 0 1px rgba(0,0,0,.24) !important;
}

body.chest-open-v198 #inventory.inventory.game-panel {
  left: clamp(112px, 14vw, 270px) !important;
  transform: translate(0, -50%) !important;
  width: 560px !important;
}

body.chest-open-v198 #chestPanel.chest-panel.game-panel {
  left: min(calc(100vw - 540px), calc(50% + 120px)) !important;
  transform: translate(0, -50%) !important;
  width: 490px !important;
}

body.chest-open-v198 #chestPanel #chestGrid.inventory-grid,
body.chest-open-v198 #chestPanel .chest-grid {
  grid-template-columns: repeat(6, 58px) !important;
}

body.structure-open-v241 #inventory.inventory.game-panel {
  left: clamp(96px, 10vw, 220px) !important;
  transform: translate(0, -50%) scale(.94) !important;
}

body.structure-open-v241 #structurePanel.structure-panel {
  left: min(calc(100vw - 820px), calc(50% + 40px)) !important;
  transform: translate(0, -50%) !important;
}

@media (max-width: 1180px) {
  body.structure-open-v241 #inventory.inventory.game-panel {
    left: 50% !important;
    top: 38% !important;
    transform: translate(-50%, -100%) scale(.82) !important;
  }
  body.structure-open-v241 #structurePanel.structure-panel {
    left: 50% !important;
    top: 58% !important;
    transform: translate(-50%, 0) scale(.82) !important;
  }
}

/* v242: equipment slots match active slots, smelter layout, cleaner inventory slots */
#equipmentSlots.equipment-slots {
  grid-template-columns: repeat(2, 68px) !important;
  gap: 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  left: calc(50% - 465px) !important;
  bottom: 22px !important;
  z-index: 80 !important;
}

#equipmentSlots .hotbar-slot,
#equipmentSlots .equipment-slot {
  width: 68px !important;
  height: 68px !important;
  border-radius: 6px !important;
  border: 2px solid rgba(0,0,0,.92) !important;
  background-color: rgba(53,82,42,.70) !important;
  background-size: 74% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

#equipmentSlots .hotbar-slot:hover,
#equipmentSlots .equipment-slot:hover {
  background-color: rgba(68,103,54,.76) !important;
  border-color: rgba(0,0,0,.96) !important;
}

#equipmentSlots .hotbar-slot.picked,
#equipmentSlots .equipment-slot.picked {
  outline: none !important;
  border-color: rgba(0,0,0,1) !important;
  background-color: rgba(74,112,58,.84) !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.10) !important;
}

#equipmentSlots .slot-label,
#equipmentSlots .slot-hotkey,
#equipmentSlots .equipment-hat::after,
#equipmentSlots .equipment-shield::after {
  display: none !important;
  content: "" !important;
}

/* Main inventory now uses the same dark slot feeling as the personal chest. */
#inventory #inventoryGrid.inventory-grid,
#inventory .inventory-grid.fancy-grid {
  background: linear-gradient(180deg, rgba(55,19,0,.94), rgba(30,10,0,.96)) !important;
  border: 2px solid rgba(42,14,0,.98) !important;
}

#inventory .inventory-slot,
#inventory #inventoryGrid .inventory-slot {
  background-color: #19171b !important;
  background-size: 78% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border: 1px solid rgba(255,255,255,.17) !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07) !important;
}

#inventory .inventory-slot:hover,
#inventory .inventory-slot.picked {
  border-color: rgba(254,170,1,.82) !important;
  box-shadow: 0 0 0 2px rgba(254,170,1,.22), inset 0 0 0 1px rgba(0,0,0,.30) !important;
}

/* Smelter opens like personal chest: inventory on the left, smelter panel on the right. */
body.structure-smelter-open-v242 #inventory.inventory.game-panel {
  left: calc(50% - 300px) !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 560px !important;
}

body.structure-smelter-open-v242 #structurePanel.structure-panel {
  left: calc(50% + 330px) !important;
  right: auto !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: min(560px, calc(100vw - 40px)) !important;
  max-height: min(650px, calc(100vh - 120px)) !important;
  overflow: visible !important;
}

body.structure-smelter-open-v242 #structurePanel .smelter-panel-v201 {
  grid-template-columns: 1fr !important;
  min-height: 0 !important;
}

body.structure-smelter-open-v242 #structurePanel .smelter-info-v201 {
  max-height: 220px !important;
  overflow: hidden !important;
}

body.structure-smelter-open-v242 #structurePanel .smelter-recipes-v201 {
  max-height: 148px !important;
}

@media (max-width: 1180px) {
  body.structure-smelter-open-v242 #inventory.inventory.game-panel {
    left: 50% !important;
    top: 38% !important;
    transform: translate(-50%, -100%) scale(.82) !important;
  }
  body.structure-smelter-open-v242 #structurePanel.structure-panel {
    left: 50% !important;
    top: 58% !important;
    transform: translate(-50%, 0) scale(.82) !important;
  }
  #equipmentSlots.equipment-slots {
    left: 14px !important;
    bottom: 98px !important;
  }
}

/* v243: fix equipment gap, inventory item icons, and smelter split layout */
#equipmentSlots.equipment-slots {
  left: calc(50% - 610px) !important;
  bottom: 22px !important;
  gap: 16px !important;
}

#inventory .inventory-slot,
#inventory #inventoryGrid .inventory-slot,
#chestPanel .inventory-slot,
#chestPanel #chestGrid .inventory-slot {
  background-color: #19171b !important;
  background-size: 78% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

#inventory .inventory-slot[style*="background-image"],
#inventory #inventoryGrid .inventory-slot[style*="background-image"],
#chestPanel .inventory-slot[style*="background-image"],
#chestPanel #chestGrid .inventory-slot[style*="background-image"] {
  background-color: #19171b !important;
  background-size: 78% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

body.structure-smelter-open-v242 #inventory.inventory.game-panel,
body.structure-smelter-open-v243 #inventory.inventory.game-panel {
  left: clamp(40px, 6vw, 120px) !important;
  top: 50% !important;
  transform: translate(0, -50%) scale(.92) !important;
  width: 560px !important;
  z-index: 230 !important;
}

body.structure-smelter-open-v242 #structurePanel.structure-panel,
body.structure-smelter-open-v243 #structurePanel.structure-panel {
  left: auto !important;
  right: clamp(28px, 4vw, 90px) !important;
  top: 50% !important;
  transform: translate(0, -50%) scale(.92) !important;
  width: 560px !important;
  max-width: 560px !important;
  z-index: 240 !important;
}

body.structure-smelter-open-v242 #structurePanel .smelter-panel-v201,
body.structure-smelter-open-v243 #structurePanel .smelter-panel-v201 {
  grid-template-columns: 1fr !important;
  min-height: 0 !important;
}

@media (max-width: 1320px) {
  body.structure-smelter-open-v242 #inventory.inventory.game-panel,
  body.structure-smelter-open-v243 #inventory.inventory.game-panel {
    left: 50% !important;
    top: 34% !important;
    transform: translate(-50%, -100%) scale(.78) !important;
  }
  body.structure-smelter-open-v242 #structurePanel.structure-panel,
  body.structure-smelter-open-v243 #structurePanel.structure-panel {
    left: 50% !important;
    right: auto !important;
    top: 56% !important;
    transform: translate(-50%, 0) scale(.78) !important;
  }
}

@media (max-width: 1180px) {
  #equipmentSlots.equipment-slots {
    left: 14px !important;
    bottom: 98px !important;
  }
}

/* v244: fix inventory icons hidden by background shorthand + Ahardice-like selected active slot */
#inventory .inventory-slot,
#inventory #inventoryGrid .inventory-slot,
#chestPanel .inventory-slot,
#chestPanel #chestGrid .inventory-slot {
  background-color: #19171b !important;
  background-size: 78% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* Empty slots get only a color/gradient through pseudo-layer, not background shorthand,
   so inline item background-image remains visible. */
#inventory .inventory-slot:not([style*="background-image"]),
#inventory #inventoryGrid .inventory-slot:not([style*="background-image"]),
#chestPanel .inventory-slot:not([style*="background-image"]),
#chestPanel #chestGrid .inventory-slot:not([style*="background-image"]) {
  background-image: none !important;
}

/* Active hotbar selected slot like Ahardice.io: white border + lighter transparent fill. */
#hotbar .hotbar-slot.selected {
  border-color: rgba(255,255,255,.96) !important;
  outline: none !important;
  background-color: rgba(122,150,101,.58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 0 0 1px rgba(255,255,255,.18) !important;
}

#hotbar .hotbar-slot.selected:hover {
  border-color: rgba(255,255,255,1) !important;
  background-color: rgba(132,160,110,.62) !important;
}

/* Equipment slots keep the same selected/picked visual language when interacted with. */
#equipmentSlots .equipment-slot.picked,
#equipmentSlots .hotbar-slot.picked {
  border-color: rgba(255,255,255,.96) !important;
  background-color: rgba(122,150,101,.58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 0 0 1px rgba(255,255,255,.18) !important;
}


/* v245: final inventory icon fix - never use background shorthand on item slots. */
#inventory .inventory-slot,
#inventory #inventoryGrid .inventory-slot,
#chestPanel .inventory-slot,
#chestPanel #chestGrid .inventory-slot {
  background-color: #19171b !important;
  background-size: 78% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

#inventory .inventory-slot[style*="background-image"],
#inventory #inventoryGrid .inventory-slot[style*="background-image"],
#chestPanel .inventory-slot[style*="background-image"],
#chestPanel #chestGrid .inventory-slot[style*="background-image"] {
  background-color: #19171b !important;
  background-size: 78% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

#hotbar .hotbar-slot.selected {
  border-color: rgba(255,255,255,.98) !important;
  background-color: rgba(116,145,95,.60) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 0 0 1px rgba(255,255,255,.22) !important;
}

/* v246: Ahardice-like build limits on the right side of each build row. */
#buildPanel .craft-list-item {
  grid-template-columns: 28px minmax(0, 1fr) auto !important;
  padding-right: 9px !important;
}

#buildPanel .craft-list-body {
  min-width: 0 !important;
}

#buildPanel .craft-list-name {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#buildPanel .build-limit-badge {
  justify-self: end !important;
  align-self: center !important;
  white-space: nowrap !important;
  font-size: 16px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  color: #e9e9e9 !important;
  text-shadow: 0 2px 0 rgba(0,0,0,0.45) !important;
  opacity: 0.95 !important;
  padding-left: 7px !important;
  pointer-events: none !important;
}

#buildPanel .build-limit-badge.hidden {
  display: none !important;
}

#buildPanel .build-limit-badge.limit-full {
  color: #ffd0d0 !important;
}


/* v247: Ahardice-like fuel strip for bonfire/freezer. */
.fuel-counter-v198 {
  position: absolute;
  transform: translate(-50%, -50%);
  min-width: 126px !important;
  height: 20px;
  padding: 0 10px 0 0 !important;
  border: none !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center;
  gap: 0;
  color: #f4f0d4;
  font-size: 10px;
  font-weight: 1000;
  text-shadow: 0 1px 0 rgba(0,0,0,.78);
  pointer-events: none;
  z-index: 34;
}

.fuel-counter-icon {
  position: absolute;
  left: -6px;
  top: 50%;
  transform: translateY(-50%);
  width: 24px !important;
  height: 24px !important;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.65));
  z-index: 2;
}

.fuel-counter-bar {
  position: relative;
  display: block;
  width: 118px;
  height: 14px !important;
  margin-left: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(31, 60, 23, .98), rgba(15, 31, 12, .98));
  border: 2px solid rgba(71, 96, 56, .98);
  box-shadow: inset 0 1px 0 rgba(188, 225, 160, .12), 0 1px 0 rgba(0,0,0,.42);
}

.fuel-counter-bar i {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, #617f36 0%, #4f6d2f 50%, #3f5f24 100%);
  box-shadow: inset 0 1px 0 rgba(220, 255, 182, .18);
}

.fuel-counter-v198 b {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 11px;
  line-height: 1;
  min-width: 42px;
  text-align: right;
}

/* v247: fullscreen environment effects start after 25% and expand inward up to 25% of the screen. */
.env-screen-overlay {
  position: fixed;
  inset: 0;
  z-index: 13;
  pointer-events: none;
}

.env-screen-overlay.hidden {
  display: none;
}

.env-screen-layer {
  --env-screen-fill: 0%;
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 120ms linear;
}

.env-screen-layer.heat {
  background:
    linear-gradient(to bottom, rgba(255, 128, 44, .40), transparent var(--env-screen-fill)),
    linear-gradient(to top, rgba(255, 85, 38, .34), transparent var(--env-screen-fill)),
    linear-gradient(to right, rgba(255, 121, 38, .30), transparent var(--env-screen-fill)),
    linear-gradient(to left, rgba(255, 121, 38, .30), transparent var(--env-screen-fill));
}

.env-screen-layer.cold {
  background:
    linear-gradient(to bottom, rgba(119, 228, 255, .34), transparent var(--env-screen-fill)),
    linear-gradient(to top, rgba(82, 144, 255, .30), transparent var(--env-screen-fill)),
    linear-gradient(to right, rgba(90, 173, 255, .26), transparent var(--env-screen-fill)),
    linear-gradient(to left, rgba(90, 173, 255, .26), transparent var(--env-screen-fill));
}

.env-screen-layer.radiation {
  background:
    linear-gradient(to bottom, rgba(160, 255, 92, .30), transparent var(--env-screen-fill)),
    linear-gradient(to top, rgba(69, 175, 76, .26), transparent var(--env-screen-fill)),
    linear-gradient(to right, rgba(111, 228, 80, .22), transparent var(--env-screen-fill)),
    linear-gradient(to left, rgba(111, 228, 80, .22), transparent var(--env-screen-fill));
}


/* v248: main menu server capacity state. */
.main-server-select.server-full {
  filter: saturate(.75) brightness(.82);
  opacity: .86;
}

/* v250: persistent server announcement set by /cmd server_state. */
.server-state-banner {
  position: fixed;
  top: 68px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 42;
  width: min(330px, calc(100vw - 28px));
  padding: 8px 14px;
  border: 1px solid rgba(255, 215, 104, .72);
  border-radius: 6px;
  background: rgba(15, 20, 29, .92);
  color: #fff0b8;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .34);
  font-size: 14px;
  line-height: 1.3;
  text-align: center;
  overflow-wrap: anywhere;
  pointer-events: none;
}

.server-state-banner.hidden,
body:not(.game-started) .server-state-banner {
  display: none;
}

@media (max-width: 600px) {
  .server-state-banner {
    top: 266px;
    right: 10px;
    left: auto;
    transform: none;
    width: min(162px, calc(50vw - 36px));
    max-height: 72px;
    padding: 7px 8px;
    font-size: 11px;
    line-height: 1.25;
    overflow-y: auto;
    pointer-events: auto;
  }
}


/* v252: off-screen clan ally tracking markers */
.ally-tracker-v252 {
  position: fixed;
  z-index: 79;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  gap: 5px;
  pointer-events: none;
  user-select: none;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,0.82));
}

.ally-tracker-arrow-v252 {
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 11px solid #4beb7d;
  transform-origin: 50% 50%;
  filter: drop-shadow(0 0 1px rgba(0,0,0,1));
}

.ally-tracker-label-v252 {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  max-width: 126px;
  padding: 3px 6px;
  border: 1px solid rgba(75,235,125,0.72);
  border-radius: 8px;
  background: rgba(7,28,15,0.78);
  color: #d9ffe4;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ally-tracker-label-v252 small {
  color: #7df2a0;
  font-size: 9px;
  font-weight: 800;
}

/* v253: Shift+Enter clan-chat channel indicator. */
.chat-box.clan-chat-open .chat-input {
  border-color: rgba(145, 235, 110, 0.72) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255,255,255,0.08), 0 0 0 2px rgba(145, 235, 110, 0.10) !important;
}
.chat-box.clan-chat-open .chat-input::placeholder {
  color: rgba(178, 247, 151, 0.78) !important;
}

/* v253 hotfix: clan chat history stays visible while composing a clan message. */
.chat-box.chat-open.clan-chat-open .chat-messages {
  display: flex !important;
  max-height: 170px;
  margin-bottom: 8px;
}

/* v253 hotfix: visible server-authoritative countdown on timed status effects. */
.active-potion-countdown {
  position: absolute;
  right: 3px;
  top: 2px;
  min-width: 16px;
  height: 16px;
  padding: 0 3px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(5, 12, 18, 0.88);
  border: 1px solid rgba(255,255,255,0.32);
  color: #ffffff;
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
  text-shadow: 0 1px 2px rgba(0,0,0,0.9);
  z-index: 2;
}

.player-chat-bubble.clan {
  border-color: rgba(145, 235, 110, 0.55);
  background: rgba(24, 52, 24, 0.90);
  color: #dfffd2;
}

/* v254: keep timed effects clearly separated from the 9-slot hotbar. */
.active-potion-effects {
  left: calc(50% + 390px) !important;
}

/* v254: readable effect countdown instead of a tiny ambiguous badge. */
.active-potion-countdown {
  right: 2px !important;
  top: 2px !important;
  min-width: 23px !important;
  height: 18px !important;
  padding: 0 4px !important;
  border-radius: 5px !important;
  font-size: 11px !important;
  letter-spacing: -0.2px;
}

/* Clan chat has no persistent history. Shift+Enter only changes the input channel. */
.chat-box.chat-open.clan-chat-open .chat-messages {
  display: none !important;
}

/* Clan messages are visible to every receiving clan member regardless of world distance. */
.clan-remote-toast-root {
  position: fixed;
  left: 50%;
  top: 92px;
  transform: translateX(-50%);
  z-index: 96;
  width: min(560px, calc(100vw - 28px));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  pointer-events: none;
  user-select: none;
}

.clan-remote-toast {
  max-width: 100%;
  padding: 8px 13px;
  border: 1px solid rgba(116, 238, 131, 0.72);
  border-radius: 9px;
  background: rgba(12, 39, 19, 0.90);
  color: #e1ffe5;
  box-shadow: 0 5px 18px rgba(0,0,0,0.34), 0 0 12px rgba(68,220,98,0.12);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.3;
  text-align: center;
  overflow-wrap: anywhere;
  opacity: 0;
  transform: translateY(-7px) scale(.98);
  transition: opacity .18s ease, transform .18s ease;
}

.clan-remote-toast.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}


/* v255: timed effects use a clockwise radial sweep instead of numeric seconds. */
.active-potion-countdown {
  display: none !important;
}

.active-potion-effect {
  --effect-sweep: 0deg;
}

.active-potion-cooldown {
  position: absolute;
  inset: 0;
  z-index: 3;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: conic-gradient(
    from -90deg,
    rgba(2, 5, 9, 0.66) 0deg,
    rgba(2, 5, 9, 0.66) var(--effect-sweep),
    rgba(2, 5, 9, 0.02) var(--effect-sweep),
    rgba(2, 5, 9, 0.02) 360deg
  );
  transition: opacity .12s ease;
}

.active-potion-effect.timed-effect .active-potion-cooldown {
  opacity: 1;
}

/* Keep the icon readable while the clockwise cooldown sector passes over it. */
.active-potion-effect.timed-effect .active-potion-cooldown::after {
  content: '';
  position: absolute;
  inset: 3px;
  border-radius: calc(10px - 3px);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.22);
}




/* v257: per-instance durability bars for melee weapons, shields and tools. */
.hotbar-slot,
.inventory-slot,
.equipment-slot {
  position: relative;
}
.slot-durability {
  position: absolute;
  left: 5px;
  right: 5px;
  bottom: 4px;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.58);
  border: 1px solid rgba(0, 0, 0, 0.42);
  pointer-events: none;
}
.slot-durability > span {
  display: block;
  width: 100%;
  height: 100%;
  transform-origin: left center;
  background: #63dc57;
  border-radius: inherit;
}
.slot-durability.warning > span { background: #e8bf43; }
.slot-durability.critical > span { background: #ef5350; }

/* v257: compact smelter flow — input -> process -> output, with recipes below. */
body.structure-smelter-open-v242 #structurePanel.structure-panel,
body.structure-smelter-open-v243 #structurePanel.structure-panel {
  width: 520px !important;
  max-width: 520px !important;
}
#structurePanel.structure-panel .smelter-panel-v257 {
  display: grid;
  gap: 12px;
}
.smelter-machine-v257,
.smelter-recipes-wrap-v257 {
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(72,25,0,.96), rgba(36,12,0,.98));
  border: 3px solid rgba(42,14,0,.95);
  box-shadow: inset 0 2px 0 rgba(255,255,255,.10);
}
.smelter-machine-v257 {
  padding: 14px;
}
.smelter-flow-v257 {
  display: grid;
  grid-template-columns: 112px minmax(128px, 1fr) 112px;
  align-items: center;
  gap: 12px;
}
.smelter-slot-v257 {
  width: 112px;
  height: 112px;
  position: relative;
  display: grid;
  place-items: center;
  border-radius: 15px;
  border: 3px solid rgba(255, 180, 84, .34);
  background: linear-gradient(180deg, rgba(46, 16, 0, .98), rgba(20, 7, 0, .98));
  color: #fff7d8;
  box-shadow: inset 0 0 0 2px rgba(0,0,0,.25), 0 4px 0 rgba(0,0,0,.28);
}
.smelter-slot-v257:not(:disabled):hover {
  border-color: rgba(158,255,54,.72);
  transform: translateY(-1px);
}
.smelter-slot-v257:disabled {
  opacity: .68;
  cursor: default;
}
.smelter-slot-v257 b {
  position: absolute;
  right: 7px;
  top: 7px;
  padding: 2px 6px;
  border-radius: 8px;
  background: rgba(0,0,0,.62);
  color: #fff2a8;
  font-size: 12px;
}
.smelter-slot-label-v257 {
  position: absolute;
  left: 8px;
  top: 7px;
  font-size: 11px;
  font-weight: 900;
  opacity: .86;
}
.smelter-slot-icon-v257 {
  width: 66px;
  height: 66px;
  display: block;
  background: center/contain no-repeat;
  filter: drop-shadow(0 4px 2px rgba(0,0,0,.35));
}
.smelter-slot-empty-v257 {
  font-size: 42px;
  font-weight: 900;
  color: rgba(255,247,216,.72);
}
.smelter-process-v257 {
  min-width: 0;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 6px;
  padding: 10px 8px;
  border-radius: 14px;
  background: rgba(20,7,0,.55);
  border: 2px solid rgba(255,179,78,.16);
}
.smelter-fire-v257 {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  transform: rotate(45deg);
  border-radius: 8px 14px 8px 14px;
  background: linear-gradient(135deg, #ffd54f, #ff7a00 62%, #d63b00);
  color: transparent;
  box-shadow: 0 0 18px rgba(255,116,0,.35), inset 0 2px 0 rgba(255,255,255,.32);
}
.smelter-process-title-v257 {
  color: #fff5c7;
  font-weight: 950;
  font-size: 14px;
}
.smelter-progress-v257 {
  width: 100%;
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(0,0,0,.58);
  border: 1px solid rgba(255,190,96,.22);
}
.smelter-progress-v257 > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #ff8a00, #ffd54f);
  transition: width 180ms ease;
}
.smelter-process-status-v257 {
  color: rgba(255,247,216,.78);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}
.smelter-active-v257 {
  margin-top: 12px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 8px;
  align-items: baseline;
  padding: 9px 11px;
  border-radius: 11px;
  background: rgba(20,7,0,.48);
  color: #fff1be;
}
.smelter-active-v257 > span {
  font-size: 11px;
  opacity: .72;
}
.smelter-active-v257 > b {
  font-size: 12px;
}
.smelter-active-v257 > small {
  grid-column: 1 / -1;
  color: rgba(255,247,216,.62);
  font-size: 10px;
}
.smelter-recipes-wrap-v257 {
  padding: 11px;
}
.smelter-recipes-title-v257 {
  margin: 0 2px 8px;
  color: #fff7d8;
  font-size: 15px;
  font-weight: 950;
}
.smelter-recipes-v257 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  max-height: 172px;
  overflow-y: auto;
  padding-right: 3px;
}
.smelter-recipe-v257 {
  min-width: 0;
  display: grid;
  grid-template-columns: 30px minmax(0,1fr) 16px 30px minmax(0,1fr);
  align-items: center;
  gap: 5px;
  padding: 7px;
  border-radius: 10px;
  border: 2px solid rgba(255,190,96,.22);
  background: linear-gradient(180deg, rgba(112,44,0,.94), rgba(52,18,0,.96));
  color: #fff6cc;
  text-align: left;
}
.smelter-recipe-v257.ok {
  border-color: rgba(137,255,45,.58);
}
.smelter-recipe-v257.missing {
  opacity: .48;
}
.smelter-recipe-v257 i {
  width: 30px;
  height: 30px;
  display: block;
  background: center/contain no-repeat;
}
.smelter-recipe-v257 strong {
  text-align: center;
  color: #ffe69a;
}
.smelter-recipe-v257 span {
  min-width: 0;
  display: grid;
}
.smelter-recipe-v257 span b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
}
.smelter-recipe-v257 span small {
  font-size: 9px;
  opacity: .72;
}
@media (max-width: 760px) {
  .smelter-flow-v257 { grid-template-columns: 92px minmax(100px,1fr) 92px; gap: 8px; }
  .smelter-slot-v257 { width: 92px; height: 92px; }
  .smelter-slot-icon-v257 { width: 54px; height: 54px; }
  .smelter-recipes-v257 { grid-template-columns: 1fr; }
}

/* v258: batch craft slider, larger ingredient cards, lower HUD, dual craft/build panels,
   clearer zoom control, and environment rows hidden until they reach 1%. */

/* Hotbar + equipment sit almost on the bottom edge. */
#hotbar.hotbar {
  bottom: 6px !important;
}
#equipmentSlots.equipment-slots {
  bottom: 6px !important;
}
.active-potion-effects {
  bottom: 12px !important;
}

/* Craft and Build can stay open together: Craft on the left, Build on the right. */
#craftPanel.craft-panel.game-panel {
  left: 22px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}
#buildPanel.craft-panel.game-panel {
  left: auto !important;
  right: 22px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* Ingredient rows fill their background much better. */
#craftPanel .craft-ingredients {
  gap: 7px !important;
}
#craftPanel .craft-ingredient {
  grid-template-columns: 44px minmax(0, 1fr) !important;
  gap: 9px !important;
  min-height: 46px !important;
  padding: 2px 7px 2px 3px !important;
  align-items: center !important;
  border-radius: 10px !important;
}
#craftPanel .craft-ingredient-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 8px !important;
  background-size: 92% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
#craftPanel .craft-ingredient-text {
  font-size: 13px !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
}
#craftPanel .craft-preview-icon {
  width: 108px !important;
  height: 108px !important;
}

/* Quantity selector for batch crafting. */
.craft-quantity-box {
  flex: 0 0 auto;
  display: grid;
  gap: 6px;
  margin-top: 8px;
  padding: 8px 11px 9px;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(76, 27, 0, .94), rgba(37, 12, 0, .96));
  border: 2px solid rgba(53, 17, 0, .96);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
}
.craft-quantity-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #fff2bd;
  font-size: 12px;
  font-weight: 900;
}
.craft-quantity-head b {
  color: #d9ff93;
  font-size: 12px;
}
.craft-quantity-slider {
  width: 100%;
  height: 18px;
  margin: 0;
  accent-color: #9fe74c;
  cursor: pointer;
}
.craft-quantity-slider:disabled {
  opacity: .38;
  cursor: default;
}

/* Zoom is now a direct slider instead of tiny buttons only. */
.viewport-controls {
  right: 14px !important;
  bottom: 12px !important;
  width: auto !important;
  min-width: 250px;
  height: 42px;
  box-sizing: border-box;
  display: grid !important;
  grid-template-columns: 32px minmax(112px, 1fr) 46px 32px 32px;
  align-items: center;
  gap: 6px !important;
  padding: 5px 7px !important;
  border-radius: 13px !important;
  background: rgba(12, 25, 37, .86) !important;
  border: 2px solid rgba(7, 18, 27, .92) !important;
  box-shadow: 0 5px 0 rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter: blur(8px);
}
.viewport-controls button {
  width: 32px !important;
  min-width: 32px !important;
  height: 30px !important;
  border-radius: 8px !important;
  padding: 0 !important;
  font-size: 16px !important;
  color: #ffffff !important;
  background: linear-gradient(180deg, #4f8fc1, #2d6596) !important;
  border: 1px solid #173d63 !important;
  box-shadow: 0 2px 0 rgba(8,32,56,.9), inset 0 1px 0 rgba(255,255,255,.23) !important;
}
.viewport-controls button:hover {
  filter: brightness(1.12);
}
.zoom-slider-wrap {
  min-width: 0;
  display: grid;
  grid-template-rows: 11px 14px;
  align-items: center;
  gap: 1px;
}
.zoom-slider-label {
  color: rgba(224,241,255,.74);
  font-size: 9px;
  line-height: 1;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .5px;
}
#zoomRange {
  width: 100%;
  min-width: 0;
  height: 14px;
  margin: 0;
  accent-color: #8fdaff;
  cursor: pointer;
}
#zoomValue {
  min-width: 42px !important;
  padding: 0 !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  text-align: center !important;
}
#zoomReset {
  font-size: 15px !important;
}

/* Individual environment rows stay hidden at 0%; the container appears when any reaches 1%. */
.env-row.hidden {
  display: none !important;
}

@media (max-width: 1450px) {
  #craftPanel.craft-panel.game-panel {
    left: 10px !important;
    transform: translateY(-50%) scale(.88) !important;
    transform-origin: left center !important;
  }
  #buildPanel.craft-panel.game-panel {
    right: 10px !important;
    transform: translateY(-50%) scale(.88) !important;
    transform-origin: right center !important;
  }
}

@media (max-width: 1220px) {
  #craftPanel.craft-panel.game-panel {
    left: 50% !important;
    top: 18px !important;
    transform: translateX(-50%) scale(.74) !important;
    transform-origin: top center !important;
  }
  #buildPanel.craft-panel.game-panel {
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    bottom: 94px !important;
    transform: translateX(-50%) scale(.74) !important;
    transform-origin: bottom center !important;
  }
}

/* Extra vertical room for the new batch-craft quantity control. */
#craftPanel.craft-panel.game-panel {
  height: 455px !important;
  max-height: 455px !important;
}
#craftPanel .craft-recipe-box {
  min-height: 148px !important;
  max-height: 162px !important;
}
#craftPanel .craft-create-button {
  min-height: 50px !important;
  margin-top: 8px !important;
}

/* v259: compact Ahardice-like craft/build panels, hover transparency, fixed craft slider and compact zoom. */

/* Main recipe panels stay compact so both can be open without hiding most of the world. */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel,
#shopPanel.craft-panel.game-panel {
  width: 550px !important;
  max-width: 550px !important;
  height: 330px !important;
  max-height: 330px !important;
  padding: 9px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  transition: opacity 150ms ease, filter 150ms ease !important;
  opacity: .78 !important;
}

#craftPanel.craft-panel.game-panel:not(.hidden),
#buildPanel.craft-panel.game-panel:not(.hidden),
#shopPanel.craft-panel.game-panel:not(.hidden) {
  display: block !important;
}

#craftPanel.craft-panel.game-panel:hover,
#buildPanel.craft-panel.game-panel:hover,
#shopPanel.craft-panel.game-panel:hover,
#craftPanel.craft-panel.game-panel:focus-within,
#buildPanel.craft-panel.game-panel:focus-within,
#shopPanel.craft-panel.game-panel:focus-within {
  opacity: 1 !important;
  filter: none !important;
}

/* Keep Craft left and Build right when both are open. */
#craftPanel.craft-panel.game-panel {
  left: 18px !important;
  right: auto !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  transform-origin: left center !important;
}
#buildPanel.craft-panel.game-panel {
  left: auto !important;
  right: 18px !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  transform-origin: right center !important;
}

/* Tabs are smaller and closer to Ahardice.io proportions. */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  left: 0 !important;
  right: auto !important;
  top: -55px !important;
  height: 48px !important;
  max-width: 100% !important;
  gap: 6px !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}
#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#buildPanel .craft-category-tab.icon-only,
#shopPanel .craft-category-tab.icon-only {
  flex: 0 0 58px !important;
  width: 58px !important;
  min-width: 58px !important;
  height: 46px !important;
  padding: 5px !important;
  border-width: 2px !important;
  border-radius: 8px 8px 3px 3px !important;
}
#craftPanel .craft-category-tab .craft-category-icon,
#buildPanel .craft-category-tab .craft-category-icon,
#shopPanel .craft-category-tab .craft-category-icon {
  width: 32px !important;
  height: 32px !important;
}

/* Compact two-column layout. */
#craftPanel .craft-shell,
#buildPanel .craft-shell,
#shopPanel .craft-shell {
  width: 100% !important;
  height: 100% !important;
  grid-template-columns: 222px minmax(0, 1fr) !important;
  border-radius: 10px !important;
}
#craftPanel .craft-list-title,
#buildPanel .craft-list-title,
#shopPanel .craft-list-title {
  padding: 7px 9px 5px !important;
  font-size: 13px !important;
}
#craftPanel .craft-list,
#buildPanel .craft-list,
#shopPanel .craft-list {
  padding: 0 4px 6px 6px !important;
}
#craftPanel .craft-list-item,
#buildPanel .craft-list-item,
#shopPanel .craft-list-item {
  min-height: 34px !important;
  margin-bottom: 3px !important;
  padding: 4px 6px !important;
  gap: 6px !important;
  border-radius: 5px !important;
  grid-template-columns: 30px minmax(0, 1fr) !important;
}
#buildPanel .craft-list-item {
  grid-template-columns: 30px minmax(0, 1fr) auto !important;
}
#craftPanel .craft-list-icon,
#buildPanel .craft-list-icon,
#shopPanel .craft-list-icon {
  width: 28px !important;
  height: 28px !important;
  border-radius: 5px !important;
}
#craftPanel .craft-list-name,
#buildPanel .craft-list-name,
#shopPanel .craft-list-name {
  font-size: 11.5px !important;
  line-height: 1.05 !important;
}
#craftPanel .craft-list-meta,
#buildPanel .craft-list-meta,
#shopPanel .craft-list-meta {
  display: none !important;
}
#buildPanel .build-limit-badge {
  font-size: 10.5px !important;
  padding-left: 4px !important;
}

/* Item descriptions are intentionally removed in v259; keep this CSS guard for old cached markup. */
#craftPanel .craft-detail-desc,
#buildPanel .craft-detail-desc,
#shopPanel .craft-detail-desc {
  display: none !important;
}

/* Keep details compact and action button permanently visible. */
#craftPanel .craft-detail,
#buildPanel .craft-detail,
#shopPanel .craft-detail {
  padding: 10px 12px !important;
  overflow: hidden !important;
}
#craftPanel .craft-detail-card,
#buildPanel .craft-detail-card,
#shopPanel .craft-detail-card {
  height: 100% !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  overflow: hidden !important;
}
#craftPanel .craft-detail-head,
#buildPanel .craft-detail-head,
#shopPanel .craft-detail-head {
  flex: 0 0 auto !important;
  min-height: 35px !important;
}
#craftPanel .craft-detail-title,
#buildPanel .craft-detail-title,
#shopPanel .craft-detail-title {
  font-size: 18px !important;
  line-height: 1.05 !important;
}
#craftPanel .craft-detail-stars,
#buildPanel .craft-detail-stars,
#shopPanel .craft-detail-stars {
  margin-top: 3px !important;
  font-size: 12px !important;
  letter-spacing: 1px !important;
}
#craftPanel .craft-recipe-box,
#buildPanel .craft-recipe-box,
#shopPanel .craft-recipe-box {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: 112px !important;
  margin-top: 0 !important;
  padding: 8px !important;
  grid-template-columns: minmax(0, 1fr) 92px !important;
  gap: 7px !important;
  border-radius: 8px !important;
}
#craftPanel .craft-ingredients,
#buildPanel .craft-ingredients,
#shopPanel .craft-ingredients {
  max-height: 96px !important;
  gap: 4px !important;
  overflow: hidden !important;
}
#craftPanel .craft-ingredient,
#buildPanel .craft-ingredient,
#shopPanel .craft-ingredient {
  min-height: 34px !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  gap: 6px !important;
  padding: 1px 5px 1px 2px !important;
  border-radius: 7px !important;
}
#craftPanel .craft-ingredient-icon,
#buildPanel .craft-ingredient-icon,
#shopPanel .craft-ingredient-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
  background-size: 94% !important;
}
#craftPanel .craft-ingredient-text,
#buildPanel .craft-ingredient-text,
#shopPanel .craft-ingredient-text {
  font-size: 11px !important;
}
#craftPanel .craft-preview-icon,
#buildPanel .craft-preview-icon,
#shopPanel .craft-preview-icon {
  width: 88px !important;
  height: 88px !important;
}

/* Batch craft selector never escapes the detail column. */
#craftPanel .craft-quantity-box {
  flex: 0 0 50px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin-top: 0 !important;
  padding: 5px 8px 6px !important;
  gap: 3px !important;
  border-radius: 8px !important;
  overflow: visible !important;
}
#craftPanel .craft-quantity-head {
  font-size: 10px !important;
}
#craftPanel .craft-quantity-head b {
  font-size: 10px !important;
}
#craftPanel .craft-quantity-slider {
  display: block !important;
  width: calc(100% - 6px) !important;
  max-width: calc(100% - 6px) !important;
  min-width: 0 !important;
  height: 14px !important;
  margin: 0 3px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

#craftPanel .craft-create-button,
#buildPanel .craft-create-button,
#shopPanel .craft-create-button {
  flex: 0 0 42px !important;
  min-height: 42px !important;
  height: 42px !important;
  width: min(210px, 88%) !important;
  margin: 1px auto 0 !important;
  padding: 0 14px !important;
  font-size: 15px !important;
  border-radius: 9px !important;
}

/* Compact zoom control. Explicitly reset the old left+right combination that stretched it across the screen. */
.viewport-controls {
  left: 14px !important;
  right: auto !important;
  bottom: 14px !important;
  width: 218px !important;
  min-width: 218px !important;
  max-width: 218px !important;
  height: 36px !important;
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) 38px 28px 28px !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 3px 5px !important;
  box-sizing: border-box !important;
  border-radius: 10px !important;
}
.viewport-controls button {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  border-radius: 7px !important;
  font-size: 14px !important;
}
.zoom-slider-wrap {
  min-width: 0 !important;
  display: block !important;
}
.zoom-slider-label {
  display: none !important;
}
#zoomRange {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 14px !important;
  margin: 0 !important;
}
#zoomValue {
  min-width: 38px !important;
  font-size: 10px !important;
}

/* Moderate screens: keep both panels visible but slightly smaller. */
@media (max-width: 1280px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel {
    width: 500px !important;
    max-width: 500px !important;
    height: 310px !important;
    max-height: 310px !important;
  }
  #craftPanel .craft-shell,
  #buildPanel .craft-shell {
    grid-template-columns: 200px minmax(0, 1fr) !important;
  }
}

@media (max-width: 1040px) {
  #craftPanel.craft-panel.game-panel {
    left: 10px !important;
    top: 18px !important;
    transform: scale(.82) !important;
    transform-origin: left top !important;
  }
  #buildPanel.craft-panel.game-panel {
    right: 10px !important;
    top: auto !important;
    bottom: 82px !important;
    transform: scale(.82) !important;
    transform-origin: right bottom !important;
  }
}

/* v260: craft/build panels aligned like the shop window, clear of the left action dock. */

/* Less transparent while idle; fully opaque on hover/focus. */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel {
  opacity: .90 !important;
  width: 520px !important;
  max-width: 520px !important;
  height: 340px !important;
  max-height: 340px !important;
}

#craftPanel.craft-panel.game-panel:hover,
#buildPanel.craft-panel.game-panel:hover,
#craftPanel.craft-panel.game-panel:focus-within,
#buildPanel.craft-panel.game-panel:focus-within {
  opacity: 1 !important;
}

/* Craft sits to the right of the I/C/J/B/K/R action dock instead of covering it. */
#craftPanel.craft-panel.game-panel {
  left: 82px !important;
  right: auto !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  transform-origin: left center !important;
}

/* Build mirrors the same proportions on the right side. */
#buildPanel.craft-panel.game-panel {
  left: auto !important;
  right: 22px !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  transform-origin: right center !important;
}

/* Category tabs are a compact attached row instead of an oversized floating strip. */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs {
  left: 10px !important;
  right: auto !important;
  top: -49px !important;
  width: max-content !important;
  max-width: calc(100% - 20px) !important;
  height: 47px !important;
  gap: 5px !important;
  padding: 0 !important;
  overflow: visible !important;
}

#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#buildPanel .craft-category-tab.icon-only {
  flex: 0 0 50px !important;
  width: 50px !important;
  min-width: 50px !important;
  height: 45px !important;
  padding: 4px !important;
  border-radius: 8px 8px 3px 3px !important;
}

#craftPanel .craft-category-tab .craft-category-icon,
#buildPanel .craft-category-tab .craft-category-icon {
  width: 31px !important;
  height: 31px !important;
}

/* Keep the inner split balanced after the small panel resize. */
#craftPanel .craft-shell,
#buildPanel .craft-shell {
  grid-template-columns: 210px minmax(0, 1fr) !important;
}

/* Do not let the left recipe list become cramped vertically. */
#craftPanel .craft-list-item,
#buildPanel .craft-list-item {
  min-height: 35px !important;
}

/* At medium widths keep the action dock clearance instead of jumping over it. */
@media (max-width: 1280px) and (min-width: 1041px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel {
    width: 480px !important;
    max-width: 480px !important;
    height: 320px !important;
    max-height: 320px !important;
  }
  #craftPanel.craft-panel.game-panel {
    left: 76px !important;
  }
  #buildPanel.craft-panel.game-panel {
    right: 14px !important;
  }
  #craftPanel .craft-shell,
  #buildPanel .craft-shell {
    grid-template-columns: 194px minmax(0, 1fr) !important;
  }
}

/* v261: craft/build use the same footprint and vertical placement as the closed shop panel.
   Craft keeps the shop's left placement; Build mirrors it on the right so both can stay open. */
#craftPanel.craft-panel.game-panel,
#buildPanel.craft-panel.game-panel {
  width: 550px !important;
  max-width: 550px !important;
  height: 330px !important;
  max-height: 330px !important;
  top: 330px !important;
  bottom: auto !important;
  transform: none !important;
  opacity: .90 !important;
}

#craftPanel.craft-panel.game-panel {
  left: 94px !important;
  right: auto !important;
  transform-origin: left top !important;
}

#buildPanel.craft-panel.game-panel {
  left: auto !important;
  right: 94px !important;
  transform-origin: right top !important;
}

/* Match the established shop tab attachment instead of the v260 shifted row. */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: -58px !important;
  width: max-content !important;
  max-width: 100% !important;
  height: 54px !important;
  gap: 6px !important;
  padding: 0 !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

/* Trade must never move the player's regular bottom HUD.
   These values are exactly the normal v258+ hotbar/equipment positions. */
body.trade-active #hotbar,
body.trade-active #hotbar.hotbar {
  display: grid !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 6px !important;
  transform: translateX(-50%) !important;
}

body.trade-active #equipmentSlots,
body.trade-active #equipmentSlots.equipment-slots {
  display: grid !important;
  left: calc(50% - 610px) !important;
  right: auto !important;
  top: auto !important;
  bottom: 6px !important;
  transform: none !important;
  gap: 16px !important;
}

@media (max-width: 1200px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel {
    width: 520px !important;
    max-width: 520px !important;
    top: 300px !important;
  }
  #craftPanel.craft-panel.game-panel { left: 72px !important; }
  #buildPanel.craft-panel.game-panel { right: 72px !important; }
}

@media (max-width: 900px) {
  #craftPanel.craft-panel.game-panel,
  #buildPanel.craft-panel.game-panel {
    width: calc(100vw - 48px) !important;
    max-width: calc(100vw - 48px) !important;
    height: 300px !important;
    max-height: 300px !important;
    top: 240px !important;
  }
  #craftPanel.craft-panel.game-panel { left: 24px !important; }
  #buildPanel.craft-panel.game-panel { right: 24px !important; }
}

/* v262: category tabs are attached directly to Craft / Build / Shop panels.
   The row itself has no backing plate; only the individual tabs are visible. */
#craftPanel .craft-category-tabs,
#buildPanel .craft-category-tabs,
#shopPanel .craft-category-tabs {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: auto !important;
  bottom: 100% !important;
  width: max-content !important;
  max-width: 100% !important;
  height: 62px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-end !important;
  gap: 6px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scrollbar-width: none !important;
}

#craftPanel .craft-category-tabs::-webkit-scrollbar,
#buildPanel .craft-category-tabs::-webkit-scrollbar,
#shopPanel .craft-category-tabs::-webkit-scrollbar {
  display: none !important;
}

/* Larger tabs, visually fused with the panel edge. */
#craftPanel .craft-category-tab,
#buildPanel .craft-category-tab,
#shopPanel .craft-category-tab,
#craftPanel .craft-category-tab.icon-only,
#buildPanel .craft-category-tab.icon-only,
#shopPanel .craft-category-tab.icon-only {
  flex: 0 0 66px !important;
  width: 66px !important;
  min-width: 66px !important;
  height: 58px !important;
  padding: 7px !important;
  margin: 0 !important;
  border-radius: 9px 9px 0 0 !important;
  border-bottom-width: 0 !important;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.13),
    0 -1px 0 rgba(0,0,0,0.18) !important;
  transform: none !important;
}

#craftPanel .craft-category-tab .craft-category-icon,
#buildPanel .craft-category-tab .craft-category-icon,
#shopPanel .craft-category-tab .craft-category-icon {
  width: 40px !important;
  height: 40px !important;
  background-size: contain !important;
}

#craftPanel .craft-category-tab.active,
#buildPanel .craft-category-tab.active,
#shopPanel .craft-category-tab.active {
  transform: none !important;
  position: relative !important;
  z-index: 2 !important;
}

@media (max-width: 900px) {
  #craftPanel .craft-category-tab,
  #buildPanel .craft-category-tab,
  #shopPanel .craft-category-tab,
  #craftPanel .craft-category-tab.icon-only,
  #buildPanel .craft-category-tab.icon-only,
  #shopPanel .craft-category-tab.icon-only {
    flex-basis: 58px !important;
    width: 58px !important;
    min-width: 58px !important;
    height: 52px !important;
  }

  #craftPanel .craft-category-tab .craft-category-icon,
  #buildPanel .craft-category-tab .craft-category-icon,
  #shopPanel .craft-category-tab .craft-category-icon {
    width: 36px !important;
    height: 36px !important;
  }
}

/* v267: Repair Box — one durability item, slowly repaired server-side. */
#structurePanel.structure-panel .repairbox-panel-v267 {
  display: grid;
  gap: 12px;
}
.repairbox-machine-v267 {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  padding: 16px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(72,25,0,.96), rgba(36,12,0,.98));
  border: 3px solid rgba(42,14,0,.95);
  box-shadow: inset 0 2px 0 rgba(255,255,255,.10);
}
.repairbox-slot-v267 {
  width: 132px;
  height: 132px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  border-radius: 16px;
  border: 3px solid rgba(255,180,84,.34);
  background: linear-gradient(180deg, rgba(46,16,0,.98), rgba(20,7,0,.98));
  color: #fff7d8;
  box-shadow: inset 0 0 0 2px rgba(0,0,0,.25), 0 4px 0 rgba(0,0,0,.28);
}
.repairbox-slot-v267:hover {
  border-color: rgba(158,255,54,.72);
  transform: translateY(-1px);
}
.repairbox-item-v267 {
  width: 72px;
  height: 72px;
  display: block;
  background: center/contain no-repeat;
  filter: drop-shadow(0 4px 2px rgba(0,0,0,.35));
}
.repairbox-plus-v267 {
  font-size: 46px;
  font-weight: 950;
  color: rgba(255,247,216,.76);
  line-height: .95;
}
.repairbox-slot-v267 b {
  max-width: 116px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}
.repairbox-slot-v267 small {
  font-size: 11px;
  color: rgba(255,247,216,.72);
}
.repairbox-progress-wrap-v267 {
  min-width: 0;
  display: grid;
  gap: 9px;
  padding: 16px;
  border-radius: 14px;
  background: rgba(20,7,0,.55);
  border: 2px solid rgba(255,179,78,.16);
}
.repairbox-progress-v267 {
  height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(0,0,0,.62);
  border: 1px solid rgba(255,190,96,.24);
}
.repairbox-progress-v267 > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #e45d20, #ffd54f 54%, #79e85e);
  transition: width 300ms linear;
}
.repairbox-status-v267 {
  font-size: 13px;
  font-weight: 900;
  color: #fff5c7;
}
.repairbox-help-v267 {
  display: grid;
  gap: 5px;
  padding: 11px 13px;
  border-radius: 12px;
  background: rgba(20,7,0,.52);
  border: 2px solid rgba(255,179,78,.16);
  color: #fff1be;
}
.repairbox-help-v267 b { font-size: 12px; }
.repairbox-help-v267 span { font-size: 11px; opacity: .72; }

/* v268: real timed smelting feedback. */
.smelter-fire-v257.processing {
  animation: smelterPulseV268 1s linear infinite;
  transform-origin: center;
}
.smelter-progress-v257 > span {
  transition: width 0.12s linear;
}
@keyframes smelterPulseV268 {
  0% { transform: rotate(0deg) scale(0.92); opacity: .72; }
  50% { transform: rotate(180deg) scale(1.08); opacity: 1; }
  100% { transform: rotate(360deg) scale(0.92); opacity: .72; }
}

/* v269: cleaner settings + leave dialog, compact structure machines */
#settingsPanel.settings-panel-v269 {
  width: min(420px, calc(100vw - 32px)) !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  border: 4px solid #084e6b !important;
  background: linear-gradient(180deg, #0e789f 0%, #095876 100%) !important;
  box-shadow: 0 8px 0 rgba(5, 48, 65, .95), 0 22px 54px rgba(0, 0, 0, .38) !important;
}
.settings-header-v269 {
  min-height: 78px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 58px 14px 18px;
  box-sizing: border-box;
  background: linear-gradient(180deg, rgba(24, 151, 190, .98), rgba(9, 101, 137, .98));
  border-bottom: 3px solid rgba(4, 65, 89, .95);
}
.settings-header-v269 > b {
  font-size: 27px;
  line-height: 1;
  font-weight: 1000;
  color: #fff;
  text-shadow: 0 2px 0 rgba(0, 0, 0, .28);
}
.settings-icon-v269 {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: rgba(3, 73, 100, .55);
  border: 2px solid rgba(255,255,255,.14);
}
.settings-icon-v269 img { width: 32px; height: 32px; object-fit: contain; }
.settings-close-v269 {
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 2;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 0;
  border-radius: 11px;
  background: rgba(3, 66, 91, .78);
  color: #fff;
  font-size: 30px;
  line-height: 38px;
  font-weight: 900;
  cursor: pointer;
}
.settings-close-v269:hover { background: rgba(243,107,15,.96); }
.settings-options-v269 {
  display: grid;
  gap: 10px;
  padding: 16px;
}
.settings-option-v269 {
  min-height: 58px;
  padding: 0 14px 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-radius: 13px;
  background: rgba(4, 66, 90, .55);
  border: 2px solid rgba(255,255,255,.1);
  color: #fff;
  font-size: 17px;
  font-weight: 900;
  cursor: pointer;
}
.settings-option-v269 input {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.settings-option-v269 i {
  position: relative;
  flex: 0 0 auto;
  width: 52px;
  height: 29px;
  border-radius: 999px;
  background: rgba(1, 42, 58, .8);
  border: 2px solid rgba(255,255,255,.15);
  box-shadow: inset 0 2px 5px rgba(0,0,0,.28);
}
.settings-option-v269 i::after {
  content: '';
  position: absolute;
  width: 23px;
  height: 23px;
  left: 2px;
  top: 1px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0,0,0,.32);
  transition: transform .16s ease;
}
.settings-option-v269 input:checked + i {
  background: linear-gradient(90deg, #f36b0f, #feaa01);
}
.settings-option-v269 input:checked + i::after { transform: translateX(23px); }

.leave-confirm-overlay {
  background: rgba(0, 16, 24, .58) !important;
  backdrop-filter: blur(5px) !important;
}
.leave-confirm-card.leave-confirm-card-v269 {
  width: min(390px, calc(100vw - 32px)) !important;
  padding: 24px 22px 20px !important;
  text-align: center;
  border-radius: 20px !important;
  border: 4px solid #084e6b !important;
  background: linear-gradient(180deg, #0f789f 0%, #085875 100%) !important;
  box-shadow: 0 8px 0 rgba(4, 49, 67, .96), 0 24px 60px rgba(0,0,0,.46) !important;
}
.leave-confirm-icon-v269 {
  width: 72px;
  height: 72px;
  margin: -4px auto 12px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: rgba(4, 65, 89, .62);
  border: 2px solid rgba(255,255,255,.12);
}
.leave-confirm-icon-v269 img { width: 48px; height: 48px; object-fit: contain; }
.leave-confirm-card-v269 > b {
  margin: 0 0 20px !important;
  font-size: 29px !important;
  color: #fff !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.28);
}
.leave-confirm-card-v269 .leave-confirm-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
}
.leave-confirm-card-v269 .leave-confirm-actions button {
  min-height: 52px !important;
  border-radius: 12px !important;
  border: 2px solid rgba(0,0,0,.28) !important;
  color: #fff !important;
  font-size: 17px !important;
  font-weight: 1000 !important;
  cursor: pointer;
  box-shadow: 0 4px 0 rgba(0,0,0,.22) !important;
}
.leave-stay-v269 { background: linear-gradient(180deg, #1590ba, #0a688c) !important; }
.leave-exit-v269 { background: linear-gradient(180deg, #f58a25, #d94f0c) !important; }
.leave-confirm-card-v269 .leave-confirm-actions button:active {
  transform: translateY(3px);
  box-shadow: 0 1px 0 rgba(0,0,0,.22) !important;
}

/* No tutorial text inside familiar Ahardice-like machines. */
.repairbox-help-v267,
.smelter-active-v257,
.smelter-process-status-v257 { display: none !important; }
.repairbox-panel-v267 { grid-template-columns: 1fr !important; }
.repairbox-machine-v267 { min-height: 0 !important; }
.smelter-machine-v257 { padding-bottom: 14px !important; }

/* v270: account identity, aligned machine controls, compact admin, robust recipes. */
.menu-account-id {
  margin-top: -4px;
  margin-bottom: 8px;
  color: rgba(234,248,255,.72);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .1px;
  word-break: break-all;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
}
.google-login-button {
  background: linear-gradient(180deg, #77d88a, #3ca85c) !important;
}
.discord-login-button {
  background: linear-gradient(180deg, #7ba6ff, #5865f2) !important;
}
.settings-account-v270 {
  min-height: 48px;
  padding: 9px 14px;
  display: grid;
  gap: 3px;
  border-radius: 12px;
  background: rgba(3,55,76,.58);
  border: 2px solid rgba(255,255,255,.09);
  box-sizing: border-box;
}
.settings-account-v270 span {
  font-size: 11px;
  font-weight: 850;
  color: rgba(255,255,255,.68);
}
.settings-account-v270 b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff;
  font-size: 13px;
  font-weight: 950;
}

/* Machine close button: centered X with equal padding on all sides. */
#structurePanel.structure-panel .structure-close {
  right: 12px !important;
  top: 12px !important;
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  line-height: 1 !important;
  font-family: Arial, sans-serif !important;
  font-size: 27px !important;
  border-width: 3px !important;
  box-sizing: border-box !important;
}

/* Settings toggles: keep knob perfectly centered inside the track. */
.settings-option-v269 i {
  width: 58px !important;
  height: 32px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
.settings-option-v269 i::after {
  width: 24px !important;
  height: 24px !important;
  left: 2px !important;
  top: 2px !important;
  box-sizing: border-box !important;
}
.settings-option-v269 input:checked + i::after {
  transform: translateX(26px) !important;
}

/* Craft recipes with 4+ ingredients use columns instead of overflowing vertically. */
#craftPanel .craft-ingredients.compact,
#craftPanel .craft-ingredients.dense,
#craftPanel .craft-ingredients.ultra {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-content: start !important;
  gap: 6px 8px !important;
  max-height: 150px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: 3px !important;
}
#craftPanel .craft-ingredients.compact .craft-ingredient,
#craftPanel .craft-ingredients.dense .craft-ingredient,
#craftPanel .craft-ingredients.ultra .craft-ingredient {
  min-width: 0 !important;
  min-height: 31px !important;
  grid-template-columns: 29px minmax(0, 1fr) !important;
  gap: 6px !important;
}
#craftPanel .craft-ingredients.compact .craft-ingredient-icon,
#craftPanel .craft-ingredients.dense .craft-ingredient-icon,
#craftPanel .craft-ingredients.ultra .craft-ingredient-icon {
  width: 29px !important;
  height: 29px !important;
}
#craftPanel .craft-ingredients.compact .craft-ingredient-text,
#craftPanel .craft-ingredients.dense .craft-ingredient-text,
#craftPanel .craft-ingredients.ultra .craft-ingredient-text {
  min-width: 0 !important;
  font-size: 10px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Compact admin panel in the same orange/brown visual family as Craft/Build/Shop. */
#adminPanel.admin-panel {
  left: 94px !important;
  right: auto !important;
  top: 150px !important;
  transform: none !important;
  width: min(570px, calc(100vw - 118px)) !important;
  max-height: min(520px, calc(100vh - 185px)) !important;
  padding: 10px !important;
  gap: 7px !important;
  border-radius: 14px !important;
  border: 4px solid #2b1600 !important;
  background: linear-gradient(180deg, #f58a19 0 54px, #552000 54px 100%) !important;
  box-shadow: 0 7px 0 rgba(43,22,0,.65), 0 18px 42px rgba(0,0,0,.30) !important;
  backdrop-filter: none !important;
  color: #fff7cf !important;
}
#adminPanel .admin-head {
  min-height: 38px !important;
  padding: 0 4px 4px !important;
}
#adminPanel .admin-title,
#adminPanel .admin-title b {
  color: #fff7cf !important;
  font-size: 20px !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.35) !important;
}
#adminPanel .admin-title small,
#adminPanel .admin-help { display: none !important; }
#adminPanel .social-close {
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  line-height: 1 !important;
  font-size: 24px !important;
}
#adminPanel .admin-tabs {
  display: flex !important;
  gap: 5px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}
#adminPanel .admin-tabs .craft-category-tab {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 82px !important;
  height: 34px !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
  font-size: 11px !important;
}
#adminPanel .admin-body {
  gap: 6px !important;
  padding: 7px !important;
  border-radius: 10px !important;
  background: rgba(49,16,0,.78) !important;
  border: 2px solid rgba(43,14,0,.92) !important;
}
#adminPanel .admin-list,
#adminPanel .admin-item-list {
  gap: 5px !important;
}
#adminPanel .admin-item-list {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
#adminPanel .admin-row,
#adminPanel .admin-item-row,
#adminPanel .admin-mode-row {
  min-height: 44px !important;
  padding: 6px 8px !important;
  border-radius: 8px !important;
  background: rgba(104,42,4,.78) !important;
  border: 2px solid rgba(255,180,84,.15) !important;
}
#adminPanel .admin-item-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 7px !important;
}
#adminPanel .admin-tools {
  gap: 6px !important;
}
#adminPanel .admin-give-controls {
  grid-template-columns: minmax(0,1fr) 86px 104px !important;
  gap: 6px !important;
  padding: 7px !important;
  border-radius: 9px !important;
  background: rgba(70,24,0,.8) !important;
}
#adminPanel .admin-quick-amounts { gap: 4px !important; }

@media (max-width: 760px) {
  #adminPanel.admin-panel {
    left: 12px !important;
    width: calc(100vw - 24px) !important;
    top: 92px !important;
    max-height: calc(100vh - 112px) !important;
  }
  #adminPanel .admin-item-list {
    grid-template-columns: 1fr !important;
  }
}

/* v270: Settings and leave dialog now match the compact Ahardice game panels. */
#settingsPanel.settings-panel-v269 {
  width: min(390px, calc(100vw - 28px)) !important;
  border: 4px solid #2b1600 !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #f7941c 0 62px, #562100 62px 100%) !important;
  box-shadow: 0 7px 0 rgba(43,22,0,.62), 0 20px 48px rgba(0,0,0,.34) !important;
}
.settings-header-v269 {
  min-height: 62px !important;
  padding: 9px 52px 9px 12px !important;
  gap: 10px !important;
  background: transparent !important;
  border-bottom: 0 !important;
}
.settings-header-v269 > b {
  font-size: 23px !important;
  color: #fff7cf !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.4) !important;
}
.settings-icon-v269 {
  width: 40px !important;
  height: 40px !important;
  border-radius: 9px !important;
  background: rgba(87,31,0,.48) !important;
  border: 2px solid rgba(255,221,144,.18) !important;
}
.settings-icon-v269 img { width: 28px !important; height: 28px !important; }
.settings-close-v269 {
  right: 10px !important;
  top: 10px !important;
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  line-height: 1 !important;
  border: 3px solid #2b1600 !important;
  border-radius: 9px !important;
  background: linear-gradient(180deg, #9dff59, #50c210) !important;
  color: #fff !important;
  font-size: 26px !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.4) !important;
}
.settings-options-v269 {
  gap: 8px !important;
  padding: 10px 12px 13px !important;
  background: rgba(47,14,0,.72) !important;
  border-top: 3px solid rgba(43,14,0,.95) !important;
}
.settings-option-v269,
.settings-account-v270 {
  background: linear-gradient(180deg, rgba(111,43,3,.96), rgba(72,24,0,.98)) !important;
  border: 2px solid rgba(255,184,84,.18) !important;
  border-radius: 9px !important;
  color: #fff7cf !important;
}
.settings-option-v269 {
  min-height: 52px !important;
  font-size: 15px !important;
}
.settings-option-v269 i {
  background: rgba(30,9,0,.85) !important;
  border-color: rgba(255,206,126,.2) !important;
}
.settings-option-v269 input:checked + i {
  background: linear-gradient(90deg, #57c916, #a6ef53) !important;
}

.leave-confirm-overlay {
  background: rgba(25,10,0,.58) !important;
  backdrop-filter: blur(3px) !important;
}
.leave-confirm-card.leave-confirm-card-v269 {
  width: min(360px, calc(100vw - 28px)) !important;
  padding: 16px !important;
  border-radius: 14px !important;
  border: 4px solid #2b1600 !important;
  background: linear-gradient(180deg, #f7941c 0 64px, #562100 64px 100%) !important;
  box-shadow: 0 7px 0 rgba(43,22,0,.62), 0 22px 52px rgba(0,0,0,.4) !important;
}
.leave-confirm-icon-v269 {
  width: 52px !important;
  height: 52px !important;
  margin: 0 auto 8px !important;
  border-radius: 10px !important;
  background: rgba(81,27,0,.52) !important;
  border: 2px solid rgba(255,214,137,.18) !important;
}
.leave-confirm-icon-v269 img { width: 36px !important; height: 36px !important; }
.leave-confirm-card-v269 > b {
  margin: 0 0 14px !important;
  font-size: 24px !important;
  color: #fff7cf !important;
}
.leave-confirm-card-v269 .leave-confirm-actions { gap: 9px !important; }
.leave-confirm-card-v269 .leave-confirm-actions button {
  min-height: 44px !important;
  border-radius: 9px !important;
  font-size: 15px !important;
  border: 3px solid rgba(43,22,0,.88) !important;
}
.leave-stay-v269 { background: linear-gradient(180deg, #9dff59, #50c210) !important; }
.leave-exit-v269 { background: linear-gradient(180deg, #ff754f, #d63b20) !important; }

/* v270: visible one-second smelting cycle, while the server remains authoritative. */
.smelter-progress-v257.processing > span {
  animation: smelterProgressV270 1s linear infinite !important;
}
@keyframes smelterProgressV270 {
  from { width: 0%; }
  to { width: 100%; }
}


/* v272 craft rarity/name gradients configured from game-data/recipe-catalog.json */
.craft-name-gradient {
  color: transparent !important;
  display: inline-block !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: 100% 100% !important;
}


/* v272 leaderboard: points stay on the right instead of using a second line */
.leaderboard-row {
  grid-template-columns: 22px minmax(0, 1fr) auto !important;
  align-items: center !important;
  min-height: 25px !important;
}
.leaderboard-main {
  min-width: 0 !important;
}
.leaderboard-name {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.leaderboard-meta {
  margin-top: 0 !important;
  margin-left: 6px !important;
  white-space: nowrap !important;
  text-align: right !important;
  align-self: center !important;
}


/* v275: true per-character craft name gradient. The colour tags are never
   rendered; JS derives each character colour from craft.json gradient stops. */
.craft-name-gradient-char {
  display: inline;
  -webkit-text-fill-color: currentColor;
}


/* v277: own Heartstone presence indicator under the minimap. */
.heartstone-presence {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  width: 48px;
  height: 48px;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  background: rgba(22, 18, 8, 0.88);
  border: 2px solid #ffd928;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.9), 0 0 13px rgba(255, 217, 40, 0.40);
  border-radius: 7px;
  pointer-events: none;
}

.heartstone-presence.hidden {
  display: none !important;
}

.heartstone-presence img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  image-rendering: auto;
}

@media (max-width: 900px) {
  .heartstone-presence {
    width: 42px;
    height: 42px;
  }
  .heartstone-presence img {
    width: 36px;
    height: 36px;
  }
}

/* v281: main-menu profile uses the same compact Ahardice-like frame as Craft / Build / Shop */
.ahardice-main-menu.main-tab-profile .main-side-panel {
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  width: min(720px, calc(100vw - 190px)) !important;
  height: min(500px, calc(100vh - 150px)) !important;
  max-height: none !important;
  box-sizing: border-box !important;
  padding: 10px !important;
  overflow: hidden !important;
  background: linear-gradient(180deg, var(--dyn-panel-blue), var(--dyn-panel-blue-2)) !important;
  border: 3px solid var(--dyn-black-border) !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 0 rgba(0,0,0,0.55), 0 18px 48px rgba(0,0,0,0.38) !important;
  color: #f0fbff !important;
  font-family: Arial, sans-serif !important;
  text-shadow: 0 2px 1px rgba(0,0,0,0.42) !important;
}

.ahardice-main-menu.main-tab-profile #mainMenuPanelTitle {
  height: 42px !important;
  margin: 0 44px 8px 0 !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  border: 2px solid #053244 !important;
  border-radius: 6px !important;
  background: linear-gradient(180deg, #1698c5, #0879a5) !important;
  color: #f5fcff !important;
  font-size: 21px !important;
  font-weight: 1000 !important;
  letter-spacing: 0.2px !important;
}

.ahardice-main-menu.main-tab-profile #mainMenuPanelBody {
  height: calc(100% - 50px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 0 8px 0 0 !important;
  box-sizing: border-box !important;
  scrollbar-color: var(--dyn-scroll) transparent !important;
}

.ahardice-main-menu.main-tab-profile #mainMenuPanelBody::-webkit-scrollbar {
  width: 18px !important;
}

.ahardice-main-menu.main-tab-profile #mainMenuPanelBody::-webkit-scrollbar-thumb {
  background: var(--dyn-scroll) !important;
  border: 4px solid transparent !important;
  border-radius: 12px !important;
  background-clip: content-box !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-card-v139 {
  gap: 8px !important;
  color: #f0fbff !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-head-v139 {
  grid-template-columns: 66px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  min-height: 72px !important;
  padding: 7px 9px !important;
  border-radius: 3px !important;
  background: var(--dyn-row-grey) !important;
  border: 2px solid #064b64 !important;
  box-shadow: none !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-avatar-v139 {
  width: 58px !important;
  height: 58px !important;
  border-radius: 6px !important;
  border: 2px solid rgba(0,0,0,0.62) !important;
  background-color: #b9a9b8 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.25) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-name-v139 {
  color: #ffffff !important;
  font-size: 18px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-sub-v139,
.ahardice-main-menu.main-tab-profile .main-profile-id-v139 {
  color: #e7eef2 !important;
  font-size: 11px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-refresh-v139 {
  min-width: 104px !important;
  height: 38px !important;
  padding: 0 12px !important;
  border-radius: 6px !important;
  border: 2px solid rgba(0,0,0,0.62) !important;
  background: linear-gradient(180deg, var(--dyn-green), var(--dyn-green-dark)) !important;
  color: #ffffff !important;
  font-size: 13px !important;
  text-shadow: 0 2px 1px rgba(0,0,0,0.48) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.28), 0 3px 0 rgba(0,0,0,0.35) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-summary-v139 {
  gap: 5px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-summary-tile-v139 {
  min-height: 50px !important;
  padding: 6px 8px !important;
  border-radius: 3px !important;
  background: var(--dyn-row-grey) !important;
  border: 2px solid #064b64 !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-summary-tile-v139 span {
  color: #e7eef2 !important;
  font-size: 10px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-summary-tile-v139 b {
  margin-top: 2px !important;
  color: #fff2b6 !important;
  font-size: 14px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-expbar-v139 {
  height: 10px !important;
  border-radius: 3px !important;
  background: #053244 !important;
  border: 2px solid rgba(0,0,0,0.58) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-expbar-v139 > div {
  border-radius: 1px !important;
  background: linear-gradient(90deg, #83dd3e, #c4f26c) !important;
  box-shadow: none !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-badges-v139,
.ahardice-main-menu.main-tab-profile .main-profile-stat-card-v139,
.ahardice-main-menu.main-tab-profile .main-profile-empty {
  padding: 8px !important;
  border-radius: 4px !important;
  background: #0b6490 !important;
  border: 2px solid #053244 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.10) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-section-title-v139,
.ahardice-main-menu.main-tab-profile .main-profile-stat-head-v139 {
  margin-bottom: 6px !important;
  color: #fff2b6 !important;
  font-size: 12px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-stat-head-v139 span {
  padding: 2px 7px !important;
  border-radius: 4px !important;
  background: var(--dyn-row-grey) !important;
  border: 1px solid rgba(0,0,0,0.42) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-badge-grid-v139 {
  gap: 5px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-badge-v139 {
  width: 38px !important;
  height: 38px !important;
  border-radius: 5px !important;
  background-color: var(--dyn-row-grey) !important;
  border: 2px solid #064b64 !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-stats-grid-v139 {
  gap: 7px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-stat-row-v139 {
  min-height: 22px !important;
  padding: 3px 6px !important;
  border-radius: 2px !important;
  background: rgba(102,100,114,0.82) !important;
  border-bottom: 1px solid #064b64 !important;
}

@media (max-width: 900px) {
  .ahardice-main-menu.main-tab-profile .main-side-panel {
    width: calc(100vw - 150px) !important;
    height: calc(100vh - 136px) !important;
  }
}

@media (max-width: 760px) {
  .ahardice-main-menu.main-tab-profile .main-side-panel {
    width: calc(100vw - 20px) !important;
    height: calc(100vh - 124px) !important;
  }

  .ahardice-main-menu.main-tab-profile .main-profile-head-v139 {
    grid-template-columns: 54px minmax(0, 1fr) !important;
  }

  .ahardice-main-menu.main-tab-profile .main-profile-avatar-v139 {
    width: 50px !important;
    height: 50px !important;
  }

  .ahardice-main-menu.main-tab-profile .main-profile-refresh-v139 {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
}


/* v282: profile panel now truly matches the Ahardice Craft / Build / Shop orange theme. */
.ahardice-main-menu.main-tab-profile .main-side-panel {
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  width: min(720px, calc(100vw - 190px)) !important;
  height: min(500px, calc(100vh - 150px)) !important;
  max-height: none !important;
  box-sizing: border-box !important;
  padding: 12px !important;
  overflow: visible !important;
  background: linear-gradient(180deg, #FEAA01 0%, #F36B0F 48%, #b94800 100%) !important;
  border: 4px solid #3b1500 !important;
  border-radius: 16px !important;
  box-shadow:
    0 7px 0 rgba(56,18,0,.50),
    0 24px 58px rgba(0,0,0,.40),
    inset 0 2px 0 rgba(255,255,255,.30) !important;
  color: #fff7d8 !important;
  font-family: Arial, sans-serif !important;
  text-shadow: 0 2px 1px rgba(58,18,0,.58) !important;
}

.ahardice-main-menu.main-tab-profile #mainMenuPanelTitle {
  position: absolute !important;
  left: 14px !important;
  top: -58px !important;
  width: auto !important;
  min-width: 180px !important;
  height: 58px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  border: 4px solid #3b1500 !important;
  border-bottom: 0 !important;
  border-radius: 15px 15px 0 0 !important;
  background: linear-gradient(180deg, #ffd069 0%, #FEAA01 30%, #F36B0F 100%) !important;
  color: #4a1800 !important;
  font-size: 22px !important;
  font-weight: 1000 !important;
  letter-spacing: .2px !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.55) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.34) !important;
  z-index: 4 !important;
}

.ahardice-main-menu.main-tab-profile #mainMenuPanelBody {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
  padding: 12px 10px 12px 12px !important;
  border: 3px solid rgba(55,17,0,.98) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(105,36,0,.98), rgba(48,15,0,.99)) !important;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,.12),
    inset 0 -4px 0 rgba(0,0,0,.22) !important;
  scrollbar-color: #FEAA01 rgba(45,14,0,.74) !important;
}

.ahardice-main-menu.main-tab-profile #mainMenuPanelBody::-webkit-scrollbar {
  width: 16px !important;
}

.ahardice-main-menu.main-tab-profile #mainMenuPanelBody::-webkit-scrollbar-track {
  background: rgba(45,14,0,.74) !important;
  border-radius: 10px !important;
}

.ahardice-main-menu.main-tab-profile #mainMenuPanelBody::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #ffd069, #FEAA01 48%, #F36B0F) !important;
  border: 3px solid rgba(45,14,0,.74) !important;
  border-radius: 10px !important;
  background-clip: padding-box !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-card-v139 {
  gap: 10px !important;
  color: #fff7d8 !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-head-v139 {
  grid-template-columns: 76px minmax(0, 1fr) auto !important;
  gap: 12px !important;
  min-height: 82px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  background: linear-gradient(90deg, rgba(132,52,0,.96), rgba(78,26,0,.96)) !important;
  border: 3px solid rgba(55,17,0,.98) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.12) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-avatar-v139 {
  width: 66px !important;
  height: 66px !important;
  border-radius: 10px !important;
  border: 3px solid #FEAA01 !important;
  background-color: rgba(43,16,4,.88) !important;
  color: #fff7d8 !important;
  box-shadow:
    0 0 0 2px #3b1500,
    inset 0 1px 0 rgba(255,255,255,.20) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-name-v139 {
  color: #fff7d8 !important;
  font-size: 20px !important;
  text-shadow: 0 2px 0 rgba(45,14,0,.88) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-sub-v139,
.ahardice-main-menu.main-tab-profile .main-profile-id-v139 {
  color: rgba(255,240,205,.82) !important;
  font-size: 12px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-refresh-v139 {
  min-width: 112px !important;
  height: 42px !important;
  padding: 0 14px !important;
  border-radius: 9px !important;
  border: 3px solid #3b1500 !important;
  background: linear-gradient(180deg, #ffd069 0%, #FEAA01 38%, #F36B0F 100%) !important;
  color: #4a1800 !important;
  font-size: 14px !important;
  font-weight: 1000 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.52) !important;
  box-shadow:
    0 4px 0 #7b2d00,
    inset 0 2px 0 rgba(255,255,255,.32) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-refresh-v139:hover:not(:disabled) {
  filter: brightness(1.08) !important;
  transform: translateY(-1px) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-refresh-v139:active:not(:disabled) {
  transform: translateY(3px) !important;
  box-shadow: 0 1px 0 #7b2d00, inset 0 2px 0 rgba(255,255,255,.25) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-refresh-v139:disabled {
  opacity: .72 !important;
  filter: saturate(.65) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-summary-v139 {
  gap: 7px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-summary-tile-v139 {
  min-height: 58px !important;
  padding: 8px 9px !important;
  border-radius: 9px !important;
  background: linear-gradient(180deg, rgba(126,46,0,.96), rgba(73,24,0,.96)) !important;
  border: 2px solid rgba(55,17,0,.98) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-summary-tile-v139 span {
  color: rgba(255,240,205,.78) !important;
  font-size: 11px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-summary-tile-v139 b {
  margin-top: 4px !important;
  color: #ffd76f !important;
  font-size: 16px !important;
  text-shadow: 0 2px 0 rgba(45,14,0,.88) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-expbar-v139 {
  height: 13px !important;
  border-radius: 7px !important;
  background: rgba(37,11,0,.94) !important;
  border: 2px solid #3b1500 !important;
  box-shadow: inset 0 2px 3px rgba(0,0,0,.45) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-expbar-v139 > div {
  border-radius: 5px !important;
  background: linear-gradient(90deg, #ffd069 0%, #FEAA01 48%, #F36B0F 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.36) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-badges-v139,
.ahardice-main-menu.main-tab-profile .main-profile-stat-card-v139,
.ahardice-main-menu.main-tab-profile .main-profile-empty {
  padding: 10px !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, rgba(99,33,0,.97), rgba(54,17,0,.98)) !important;
  border: 2px solid rgba(55,17,0,.98) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-section-title-v139,
.ahardice-main-menu.main-tab-profile .main-profile-stat-head-v139 {
  margin-bottom: 8px !important;
  color: #ffd76f !important;
  font-size: 13px !important;
  text-shadow: 0 2px 0 rgba(45,14,0,.90) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-stat-head-v139 span {
  padding: 3px 8px !important;
  border-radius: 6px !important;
  background: linear-gradient(180deg, #FEAA01, #F36B0F) !important;
  border: 2px solid #3b1500 !important;
  color: #4a1800 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.42) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-badge-grid-v139 {
  gap: 7px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-badge-v139 {
  width: 42px !important;
  height: 42px !important;
  border-radius: 8px !important;
  background-color: rgba(38,13,2,.88) !important;
  border: 2px solid #9f3b00 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-stats-grid-v139 {
  gap: 8px !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-stat-row-v139 {
  min-height: 25px !important;
  padding: 4px 7px !important;
  border-radius: 6px !important;
  background: linear-gradient(90deg, rgba(132,52,0,.84), rgba(83,30,0,.80)) !important;
  border: 1px solid rgba(55,17,0,.92) !important;
  color: rgba(255,240,205,.86) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-stat-row-v139 b {
  color: #fff7d8 !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-empty,
.ahardice-main-menu.main-tab-profile .main-profile-empty-line-v139,
.ahardice-main-menu.main-tab-profile .main-profile-subtitle-v139 {
  color: rgba(255,240,205,.78) !important;
}

.ahardice-main-menu.main-tab-profile .main-profile-subtitle-v139 {
  border-top-color: rgba(254,170,1,.25) !important;
  color: #ffd76f !important;
}

@media (max-width: 900px) {
  .ahardice-main-menu.main-tab-profile .main-side-panel {
    width: calc(100vw - 150px) !important;
    height: calc(100vh - 150px) !important;
  }
}

@media (max-width: 760px) {
  .ahardice-main-menu.main-tab-profile .main-side-panel {
    width: calc(100vw - 20px) !important;
    height: calc(100vh - 142px) !important;
    top: calc(50% + 12px) !important;
  }

  .ahardice-main-menu.main-tab-profile #mainMenuPanelTitle {
    left: 8px !important;
    top: -50px !important;
    height: 50px !important;
    min-width: 150px !important;
    font-size: 19px !important;
  }

  .ahardice-main-menu.main-tab-profile .main-profile-head-v139 {
    grid-template-columns: 58px minmax(0, 1fr) !important;
  }

  .ahardice-main-menu.main-tab-profile .main-profile-avatar-v139 {
    width: 52px !important;
    height: 52px !important;
  }

  .ahardice-main-menu.main-tab-profile .main-profile-refresh-v139 {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
}


/* v283: compact Repair Box panel, matching the orange construction UI. */
#structurePanel.structure-panel.repairbox-compact-v283 {
  width: min(360px, calc(100vw - 28px)) !important;
  min-height: 0 !important;
  padding: 14px !important;
}
#structurePanel.repairbox-compact-v283 .structure-title {
  font-size: 24px !important;
  margin: 0 46px 10px !important;
}
#structurePanel.repairbox-compact-v283 .structure-close {
  width: 36px !important;
  height: 36px !important;
  top: 7px !important;
  right: 8px !important;
  font-size: 25px !important;
  line-height: 30px !important;
  background: linear-gradient(180deg, #ffb32f, #ef710d) !important;
  border-color: #542000 !important;
}
.repairbox-panel-v283 {
  display: grid;
  gap: 8px;
  padding: 10px;
  border-radius: 13px;
  border: 3px solid rgba(65, 22, 0, .96);
  background: linear-gradient(180deg, rgba(102, 35, 0, .97), rgba(47, 15, 0, .98));
  box-shadow: inset 0 2px 0 rgba(255,255,255,.10);
}
.repairbox-slot-v283 {
  width: 100%;
  min-height: 72px;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  box-sizing: border-box;
  border-radius: 11px;
  border: 2px solid rgba(255, 177, 65, .35);
  background: linear-gradient(180deg, rgba(45, 15, 0, .98), rgba(22, 7, 0, .98));
  color: #fff5cf;
  text-align: left;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 3px 0 rgba(0,0,0,.22);
}
.repairbox-slot-v283:hover,
.repairbox-slot-v283.done {
  border-color: rgba(255, 181, 55, .88);
  transform: translateY(-1px);
}
.repairbox-icon-wrap-v283 {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  border: 2px solid rgba(255, 190, 88, .20);
  background: rgba(10, 4, 0, .58);
}
.repairbox-item-v283 {
  width: 46px;
  height: 46px;
  display: block;
  background: center/contain no-repeat;
  filter: drop-shadow(0 3px 2px rgba(0,0,0,.38));
}
.repairbox-plus-v283 {
  font-size: 34px;
  line-height: 1;
  font-weight: 1000;
  color: rgba(255, 241, 198, .72);
}
.repairbox-copy-v283 {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.repairbox-copy-v283 b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 15px;
  color: #fff7d8;
}
.repairbox-copy-v283 small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  color: rgba(255, 235, 183, .72);
}
.repairbox-progress-v283 {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  border: 1px solid rgba(255, 184, 70, .24);
  background: rgba(0,0,0,.62);
}
.repairbox-progress-v283 > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #f36b0f, #feaa01 62%, #ffe574);
  transition: width 260ms linear;
}
.repairbox-state-v283 {
  min-height: 15px;
  padding: 0 2px;
  font-size: 11px;
  line-height: 1.25;
  font-weight: 800;
  color: rgba(255, 238, 192, .78);
  text-align: center;
}
.repairbox-state-v283.done { color: #ffe775; }

/* v284: single-account button and centered provider chooser */
.auth-provider-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(4, 10, 18, 0.68);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.auth-provider-modal.hidden {
  display: none !important;
}

.auth-provider-card {
  position: relative;
  width: min(430px, calc(100vw - 36px));
  box-sizing: border-box;
  padding: 30px 30px 26px;
  border: 2px solid rgba(255, 255, 255, 0.18);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(18, 39, 56, 0.98), rgba(8, 20, 32, 0.98));
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.58), inset 0 1px 0 rgba(255, 255, 255, 0.13);
  color: #eef8ff;
  text-align: center;
}

.auth-provider-close {
  position: absolute;
  top: 12px;
  right: 14px;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.09);
  color: #fff;
  font-size: 30px;
  line-height: 1;
}

.auth-provider-close:hover {
  background: rgba(255, 255, 255, 0.17);
}

.auth-provider-logo {
  width: 76px;
  height: 76px;
  object-fit: contain;
  margin-bottom: 10px;
  filter: drop-shadow(0 6px 8px rgba(0, 0, 0, 0.36));
}

.auth-provider-title {
  font-size: 29px;
  font-weight: 950;
  letter-spacing: -0.4px;
}

.auth-provider-subtitle {
  margin-top: 7px;
  color: rgba(229, 241, 250, 0.7);
  font-size: 14px;
}

.auth-provider-actions {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.auth-provider-button {
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  padding: 10px 18px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 14px;
  color: #fff;
  font-size: 20px;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.11), 0 7px 18px rgba(0, 0, 0, 0.22);
}

.auth-provider-button:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 255, 255, 0.42);
  background: rgba(255, 255, 255, 0.14);
}

.auth-provider-button.discord-login-button {
  background: linear-gradient(180deg, #6879e8, #5264d2);
}

.auth-provider-button.google-login-button {
  background: linear-gradient(180deg, #ffffff, #e8edf3);
  color: #26313b;
}

.auth-provider-mark {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  border-radius: 11px;
  background: rgba(0, 0, 0, 0.18);
  color: #fff;
  font-size: 20px;
  font-weight: 950;
}

.google-mark {
  background: #fff;
  color: #4285f4;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.auth-login-status {
  min-height: 36px;
  margin-top: 18px;
  color: rgba(220, 238, 249, 0.74);
  font-size: 13px;
  line-height: 1.4;
}

.auth-login-status.error {
  color: #ff9c9c;
}