* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: Arial, sans-serif;
  background: radial-gradient(circle at top, #13284a, #02050b 65%);
  color: white;
  overflow: hidden;
}

.stars {
  position: fixed;
  inset: 0;
  background-image:
    radial-gradient(white 1px, transparent 1px),
    radial-gradient(rgba(255,255,255,0.45) 1px, transparent 1px);
  background-size: 80px 80px, 140px 140px;
  background-position: 0 0, 40px 60px;
  opacity: 0.45;
}

.screen {
  position: relative;
  z-index: 2;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
}

.card {
  display: none;
  width: 100%;
  max-width: 430px;
  background: rgba(8, 15, 30, 0.9);
  border: 1px solid #263a63;
  border-radius: 18px;
  padding: 34px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.55);
  text-align: center;
}

.card.active {
  display: block;
}

h1 {
  font-size: 56px;
  letter-spacing: 8px;
  margin: 0 0 18px;
}

h2 {
  margin-top: 0;
}

.subtitle {
  color: #b9c8e8;
  margin-bottom: 28px;
}

.menu {
  display: grid;
  gap: 14px;
}

button {
  width: 100%;
  border: none;
  border-radius: 10px;
  padding: 13px 16px;
  background: #1f5fb7;
  color: white;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
}

button:hover {
  background: #2a6ed0;
}

button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

button.secondary,
.secondary-hud-btn {
  background: transparent;
  border: 1px solid #3b507a;
  color: #c7d3ea;
}

.back-gap {
  margin-top: 14px;
}

input {
  width: 100%;
  margin-bottom: 12px;
  padding: 13px;
  border-radius: 10px;
  border: 1px solid #34486f;
  background: #07111f;
  color: white;
  font-size: 15px;
}

input::placeholder {
  color: #7f8da8;
}

.message {
  min-height: 20px;
  margin-bottom: 0;
  color: #ffb86b;
}

/* Shared full screens */

.hub-screen,
.market-screen,
.hangar-screen,
.space-screen {
  display: none;
  width: 100%;
  max-width: 1180px;
  height: 665px;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  box-shadow: 0 24px 80px rgba(0,0,0,0.75);
  border: 1px solid #2c4f75;
}

.hub-screen.active,
.market-screen.active,
.hangar-screen.active,
.space-screen.active {
  display: block;
}

.hub-screen {
  background:
    linear-gradient(to top, rgba(2,5,11,0.78), rgba(2,5,11,0.08)),
    url("asteron-prime-space-station-hub.png");
  background-size: cover;
  background-position: center;
}

.hub-overlay {
  position: absolute;
  inset: 0;
  padding: 34px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.hub-header {
  text-align: center;
  text-shadow: 0 0 14px rgba(0,0,0,0.9);
}

.hub-header p {
  margin: 0 0 6px;
  color: #7fdfff;
  letter-spacing: 3px;
  font-weight: 900;
}

.hub-header h2 {
  margin: 0;
  font-size: 48px;
  letter-spacing: 4px;
}

.hub-actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin-top: auto;
}

.hub-actions button {
  min-height: 82px;
  font-size: 22px;
  letter-spacing: 1px;
  background: rgba(8, 18, 34, 0.86);
  border: 1px solid #3c8fc7;
  box-shadow: 0 0 22px rgba(0, 180, 255, 0.18);
}

.hub-actions button:hover {
  background: rgba(21, 77, 155, 0.9);
  transform: translateY(-2px);
}

.logout-btn {
  position: absolute;
  right: 24px;
  top: 24px;
  width: auto;
  padding: 9px 14px;
  background: rgba(0,0,0,0.45);
  border: 1px solid #526a92;
  color: #d9e6ff;
}

.save-status-indicator {
  position: fixed;
  right: 18px;
  bottom: 16px;
  z-index: 220;
  max-width: min(280px, calc(100vw - 36px));
  padding: 6px 10px;
  border: 1px solid rgba(127, 223, 255, 0.24);
  border-radius: 999px;
  background: rgba(1, 8, 18, 0.72);
  color: rgba(203, 225, 242, 0.78);
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  pointer-events: none;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24);
}

.save-status-indicator[data-state="saving"] {
  border-color: rgba(255, 220, 95, 0.38);
  color: rgba(255, 232, 163, 0.88);
}

.save-status-indicator[data-state="cloud"] {
  border-color: rgba(52, 229, 154, 0.34);
  color: rgba(159, 255, 205, 0.88);
}

.save-status-indicator[data-state="cloud-failed"] {
  border-color: rgba(255, 118, 132, 0.46);
  color: rgba(255, 198, 207, 0.92);
}

/* Marketplace */

.market-screen {
  background:
    linear-gradient(to bottom, rgba(2,5,11,0.88), rgba(2,5,11,0.96)),
    url("asteron-prime-space-station-hub.png");
  background-size: cover;
  background-position: center;
  padding: 28px;
}

.market-header,
.hangar-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 20px;
}

.market-header p,
.hangar-header p {
  margin: 0 0 6px;
  color: #7fdfff;
  letter-spacing: 3px;
  font-weight: 900;
}

.market-header h2,
.hangar-header h2 {
  margin: 0;
  font-size: 38px;
  letter-spacing: 3px;
}

.screen-back-btn {
  width: auto;
  padding: 10px 18px;
  background: rgba(8, 18, 34, 0.9);
  border: 1px solid #3c8fc7;
}

.market-summary {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  background: rgba(0,0,0,0.55);
  border: 1px solid #3c8fc7;
  border-radius: 12px;
  padding: 14px;
  margin-bottom: 18px;
  color: #d9e6ff;
}

.market-goods {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.market-item {
  background: rgba(0,0,0,0.62);
  border: 1px solid rgba(60,143,199,0.9);
  border-radius: 12px;
  padding: 16px;
}

.market-item h3 {
  margin: 0 0 8px;
}

.market-item p {
  margin: 6px 0;
  color: #c7d3ea;
}

.market-actions {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  align-items: center;
}

.market-actions button {
  min-height: 42px;
}

.qty-input {
  width: 80px;
  margin: 0;
  padding: 10px;
  text-align: center;
}

/* Hangar */

.hangar-screen {
  background:
    linear-gradient(to bottom, rgba(2,5,11,0.88), rgba(2,5,11,0.96)),
    url("asteron-prime-space-station-hub.png");
  background-size: cover;
  background-position: center;
  padding: 28px;
}

.hangar-layout {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 18px;
  height: calc(100% - 90px);
}

.hangar-ship-panel,
.attachment-panel {
  background: rgba(0,0,0,0.62);
  border: 1px solid rgba(60,143,199,0.9);
  border-radius: 14px;
  padding: 18px;
  min-height: 0;
}

.hangar-ship-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.hangar-ship-img {
  width: 100%;
  max-width: 290px;
  max-height: 280px;
  object-fit: contain;
  display: block;
  margin-bottom: 18px;
}

.ship-stats {
  width: 100%;
  display: grid;
  gap: 8px;
  color: #d9e6ff;
}

.attachment-panel {
  overflow-y: auto;
  padding-right: 12px;
}

.attachment-panel h3 {
  margin: 0 0 12px;
}

.installed-attachments,
.available-attachments,
.ship-shop {
  display: grid;
  gap: 8px;
  margin-bottom: 20px;
}

.attachment-card,
.ship-card {
  display: grid;
  grid-template-columns: 70px 1fr auto;
  gap: 10px;
  align-items: center;
  background: rgba(8, 18, 34, 0.82);
  border: 1px solid #3c8fc7;
  border-radius: 12px;
  padding: 10px;
}

.ship-card {
  grid-template-columns: 95px 1fr auto;
}

.attachment-card img {
  width: 70px;
  height: 54px;
  object-fit: contain;
  background: rgba(0,0,0,0.4);
}

.ship-card img {
  width: 95px;
  height: 70px;
  object-fit: contain;
}

.attachment-card h4,
.ship-card h4 {
  margin: 0 0 4px;
}

.attachment-card p,
.ship-card p {
  margin: 2px 0;
  color: #b9c8e8;
  font-size: 13px;
}

.attachment-card button,
.ship-card button {
  width: auto;
  min-width: 86px;
  padding: 9px 12px;
}

.empty-slot {
  color: #7f8da8;
  border: 1px dashed #3c8fc7;
  border-radius: 12px;
  padding: 14px;
}

/* Space */

.space-screen {
  background:
    linear-gradient(to top, rgba(2,5,11,0.2), rgba(2,5,11,0.02)),
    url("space-screen-background.png");
  background-size: cover;
  background-position: center;
}

.space-screen.empty-node {
  background:
    linear-gradient(to top, rgba(2,5,11,0.2), rgba(2,5,11,0.02)),
    url("space-empty.png");
  background-size: cover;
  background-position: center;
}

.clickable-planet,
.clickable-planet:hover,
.clickable-planet:focus,
.clickable-planet:active {
  position: absolute;
  top: 42px;
  right: 62px;
  width: 145px;
  height: 145px;
  border-radius: 50%;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  cursor: pointer;
  z-index: 9;
  pointer-events: auto;
}

.node-name-tag {
  position: absolute;
  top: 18px;
  left: 24px;
  z-index: 4;
  color: rgba(220, 244, 255, 0.45);
  font-weight: 900;
  letter-spacing: 1px;
}

.asteroid-target {
  position: absolute;
  top: 150px;
  right: 230px;
  width: 118px;
  height: 118px;
  display: none;
  align-items: center;
  justify-content: center;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0;
  z-index: 6;
}

.asteroid-target.visible {
  display: flex;
}

.asteroid-target img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  filter: drop-shadow(0 0 12px rgba(120, 220, 255, 0.35));
}

.asteroid-target.selected img {
  filter: drop-shadow(0 0 16px rgba(255, 210, 90, 0.9));
}

/* Sector map */

.sector-map {
  display: none;
  position: absolute;
  inset: 0;
  z-index: 10;
  background:
    linear-gradient(180deg, rgba(2, 7, 16, 0.78), rgba(2, 6, 14, 0.9)),
    radial-gradient(circle at 50% 50%, rgba(21, 77, 155, 0.10), transparent 36%),
    radial-gradient(circle at 18% 24%, rgba(80, 140, 220, 0.08), transparent 24%),
    radial-gradient(circle at 84% 72%, rgba(80, 140, 220, 0.08), transparent 24%),
    url("cosmic_nebula_in_deep_space.png");
  background-size: cover;
  background-position: center;
  border: 1px solid #3c8fc7;
  border-radius: 18px;
  box-shadow: 0 0 40px rgba(0,0,0,0.8);
  overflow: hidden;
}

.sector-map.active {
  display: block;
}

.map-title {
  position: absolute;
  top: 24px;
  left: 28px;
  z-index: 4;
  color: #7fdfff;
  font-weight: 900;
  letter-spacing: 3px;
  font-size: 18px;
}

.close-map-btn {
  position: absolute;
  right: 24px;
  top: 22px;
  z-index: 5;
  width: 46px;
  height: 46px;
  padding: 0;
  border-radius: 10px;
  background: rgba(8, 18, 34, 0.9);
  border: 1px solid #3c8fc7;
  color: #dff4ff;
  font-size: 28px;
  line-height: 1;
}

.sector-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.svg-route {
  stroke: rgba(165, 210, 230, 0.42);
  stroke-width: 0.18;
  stroke-linecap: round;
}

.svg-route.available {
  stroke: rgba(127, 223, 255, 0.95);
  stroke-width: 0.28;
  filter: drop-shadow(0 0 2px rgba(127, 223, 255, 0.8));
}

.svg-node-hit {
  fill: transparent;
  cursor: pointer;
}

.svg-space-node {
  fill: #f2fbff;
  filter: drop-shadow(0 0 2px rgba(210, 245, 255, 0.95));
}

.svg-space-node.locked {
  opacity: 0.35;
}

.svg-planet-ring {
  fill: none;
  stroke: rgba(150, 225, 255, 0.72);
  stroke-width: 0.25;
}

.svg-current-ring {
  fill: none;
  stroke: #00d084;
  stroke-width: 0.45;
  filter: drop-shadow(0 0 3px rgba(0, 208, 132, 0.95));
}

.svg-planet-label {
  fill: #e3edf8;
  font-size: 2.1px;
  text-anchor: middle;
  dominant-baseline: middle;
  paint-order: stroke;
  stroke: rgba(0, 0, 0, 0.85);
  stroke-width: 0.45px;
  stroke-linejoin: round;
}

/* Space HUD */

.space-combat-hud {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 22px;
  min-height: 170px;
  display: flex;
  gap: 10px;
  z-index: 5;
  pointer-events: auto;
}

.vertical-stats {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  background: rgba(0, 0, 0, 0.72);
  border: 1px solid #3c8fc7;
  border-radius: 12px;
  padding: 9px;
  box-shadow: 0 0 18px rgba(0, 140, 255, 0.14);
  flex: 0 0 auto;
}

.stat-col {
  width: 45px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.stat-value {
  color: #dff4ff;
  font-size: 11px;
  font-weight: 900;
  min-height: 13px;
  text-align: center;
}

.stat-meter {
  position: relative;
  width: 21px;
  height: 82px;
  border: 1px solid #4a5e7b;
  background: #08101b;
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  box-shadow: inset 0 0 10px rgba(0,0,0,0.65);
}

.stat-fill {
  width: 100%;
  height: 0%;
  transition: height 0.25s ease;
}

.jump-fill {
  background: linear-gradient(180deg, #ff6e7e, #d91c2d);
}

.hull-fill {
  background: linear-gradient(180deg, #f2e676, #ccb72c);
}

.shield-fill {
  background: linear-gradient(180deg, #67c9ff, #1e60d7);
}

.stat-btn {
  width: 45px;
  min-height: 36px;
  padding: 4px 2px;
  font-size: 8.5px;
  font-weight: 900;
  line-height: 1.05;
  text-align: center;
  border: 1px solid #2f8fcb;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(8, 28, 55, 0.96), rgba(5, 14, 28, 0.96));
  color: #ffffff;
  cursor: pointer;
}

.static-btn {
  cursor: default;
}

#jumpBtn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.ship-display-panel,
.hud-panel {
  background: rgba(0, 0, 0, 0.72);
  border: 1px solid #3c8fc7;
  border-radius: 12px;
  padding: 12px;
  box-shadow: 0 0 18px rgba(0, 140, 255, 0.14);
}

.ship-display-panel {
  flex: 0 0 165px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hud-ship-image {
  max-width: 100%;
  max-height: 145px;
  object-fit: contain;
  display: block;
}

.hud-panel {
  min-width: 150px;
  flex: 1 1 0;
}

.target-panel {
  flex: 1.25 1 0;
}

.hud-panel h3 {
  margin: 0 0 8px;
  font-size: 15px;
  color: #dff4ff;
  letter-spacing: 0.5px;
}

.hud-text {
  color: #d4e3f9;
  font-size: 13px;
  line-height: 1.45;
  min-height: 45px;
}

.hud-row {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.hud-row button,
#collectBtn {
  min-height: 38px;
  padding: 9px 10px;
  font-size: 12px;
}

@media (max-width: 900px) {
  .hub-screen,
  .space-screen,
  .market-screen,
  .hangar-screen {
    height: 90vh;
  }

  .hub-actions,
  .market-goods,
  .hangar-layout {
    grid-template-columns: 1fr;
  }

  .space-combat-hud {
    flex-wrap: wrap;
  }
}


/* ===== Target/HUD tidy-up + pulse lasers ===== */

.laser-layer {
  position: absolute;
  inset: 0;
  z-index: 7;
  pointer-events: none;
}

.explosion-layer {
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
}

.space-explosion {
  position: absolute;
  width: 76px;
  height: 76px;
  margin-left: -38px;
  margin-top: -38px;
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(255,245,180,0.95) 0%, rgba(255,180,70,0.9) 24%, rgba(255,92,24,0.75) 52%, rgba(255,92,24,0.25) 70%, rgba(255,92,24,0) 100%);
  box-shadow:
    0 0 18px rgba(255,214,92,0.95),
    0 0 36px rgba(255,120,32,0.75),
    0 0 62px rgba(255,82,20,0.4);
  transform: scale(0.2);
  opacity: 0;
  animation: explosionBloom 560ms ease-out forwards;
}

.space-explosion::before {
  content: "";
  position: absolute;
  inset: -16px;
  border-radius: 50%;
  border: 2px solid rgba(255,220,120,0.55);
  opacity: 0.7;
  animation: explosionRing 560ms ease-out forwards;
}

.laser-burst {
  position: absolute;
  left: 265px;
  bottom: 150px;
  width: 430px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(80, 255, 170, 0), rgba(80, 255, 170, 1), rgba(80, 255, 170, 0.35));
  box-shadow:
    0 0 8px rgba(80, 255, 170, 0.95),
    0 0 18px rgba(80, 255, 170, 0.55);
  transform: rotate(-18deg);
  transform-origin: left center;
  opacity: 0;
  animation: laserBurst 340ms ease-out forwards;
}

.laser-burst.secondary {
  bottom: 142px;
  transform: rotate(-14deg);
  animation-delay: 30ms;
}

@keyframes laserBurst {
  0% {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
  }
  20% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
  100% {
    opacity: 0;
    clip-path: inset(0 0 0 100%);
  }
}

.space-combat-hud {
  min-height: 178px;
}

.target-panel {
  flex: 1.05 1 0;
}

.sector-panel {
  flex: 1.7 1 0;
}

.sector-grid {
  display: grid;
  grid-template-columns: 0.9fr 1.05fr 1.05fr;
  gap: 10px;
}

.hud-label {
  display: block;
  margin-bottom: 5px;
  color: #7fdfff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.sector-panel .hud-text {
  min-height: 70px;
}

#collectBtn {
  margin-top: 8px;
}

@media (max-width: 900px) {
  .sector-grid {
    grid-template-columns: 1fr;
  }

  .laser-burst {
    left: 180px;
    width: 260px;
  }
}


/* ===== Multiple asteroids + target-centred lasers ===== */

.asteroid-field {
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
}

.asteroid-target {
  position: absolute;
  width: 92px;
  height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0;
  pointer-events: auto;
  cursor: pointer;
}

.asteroid-target.visible {
  display: flex;
}

.asteroid-target img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  filter: drop-shadow(0 0 12px rgba(120, 220, 255, 0.35));
}

.asteroid-target.selected img {
  filter: drop-shadow(0 0 16px rgba(255, 210, 90, 0.95));
}

.asteroid-hp-mini {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: -8px;
  height: 5px;
  background: rgba(255,255,255,0.16);
  border-radius: 999px;
  overflow: hidden;
}

.asteroid-hp-mini span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #ff5757, #ffd166);
  border-radius: 999px;
}

.laser-burst {
  position: absolute;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(80, 255, 170, 0), rgba(80, 255, 170, 1), rgba(80, 255, 170, 0.35));
  box-shadow:
    0 0 8px rgba(80, 255, 170, 0.95),
    0 0 18px rgba(80, 255, 170, 0.55);
  transform-origin: left center;
  opacity: 0;
  animation: laserBurst 340ms ease-out forwards;
  pointer-events: none;
}

@keyframes laserBurst {
  0% {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
  }
  20% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
  100% {
    opacity: 0;
    clip-path: inset(0 0 0 100%);
  }
}


@keyframes explosionBloom {
  0% { opacity: 0; transform: scale(0.2); }
  20% { opacity: 1; transform: scale(0.9); }
  60% { opacity: 0.95; transform: scale(1.08); }
  100% { opacity: 0; transform: scale(1.35); }
}

@keyframes explosionRing {
  0% { opacity: 0.7; transform: scale(0.5); }
  100% { opacity: 0; transform: scale(1.5); }
}


/* ===== Marketplace Overhaul ===== */

.market-screen {
  background:
    radial-gradient(circle at 20% 20%, rgba(36, 143, 220, 0.16), transparent 28%),
    linear-gradient(to bottom, rgba(2,5,11,0.9), rgba(2,5,11,0.97)),
    url("asteron-prime-space-station-hub.png");
  background-size: cover;
  background-position: center;
}

.market-terminal {
  height: calc(100% - 84px);
  display: grid;
  grid-template-columns: 310px 1fr;
  gap: 18px;
  min-height: 0;
}

.market-sidebar {
  display: grid;
  gap: 14px;
  align-content: start;
  min-height: 0;
}

.terminal-card,
.market-list-panel {
  background: rgba(0, 0, 0, 0.66);
  border: 1px solid rgba(90, 190, 255, 0.62);
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(160, 230, 255, 0.08),
    0 0 24px rgba(0, 160, 255, 0.08);
}

.terminal-card {
  padding: 16px;
}

.terminal-card h3 {
  margin: 0 0 10px;
  color: #dff4ff;
  letter-spacing: 1px;
}

.terminal-card p {
  margin: 0;
  color: #b9c8e8;
  line-height: 1.45;
}

.market-wallet {
  display: grid;
  gap: 10px;
}

.market-wallet div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(127, 223, 255, 0.18);
  padding-bottom: 8px;
}

.market-wallet div:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.market-wallet span {
  color: #7fdfff;
  font-weight: 900;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1px;
}

.market-wallet strong {
  font-size: 22px;
}

.market-cargo-summary {
  color: #d4e3f9;
  font-size: 14px;
  line-height: 1.55;
  max-height: 250px;
  overflow-y: auto;
}

.market-list-panel {
  padding: 14px;
  min-height: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr;
}

.market-list-header,
.market-row {
  display: grid;
  grid-template-columns: 1.65fr 0.65fr 0.65fr 0.65fr 0.65fr 1.6fr;
  gap: 10px;
  align-items: center;
}

.market-list-header {
  color: #7fdfff;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 0 10px 10px;
  border-bottom: 1px solid rgba(127, 223, 255, 0.2);
}

.market-goods {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  overflow-y: auto;
  padding: 12px 4px 4px 0;
}

.market-row {
  background: rgba(7, 18, 34, 0.86);
  border: 1px solid rgba(60, 143, 199, 0.72);
  border-radius: 12px;
  padding: 10px;
}

.commodity-cell {
  display: flex;
  gap: 10px;
  align-items: center;
}

.commodity-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 35% 30%, rgba(255,255,255,0.22), transparent 25%),
    linear-gradient(135deg, rgba(38, 143, 200, 0.9), rgba(12, 28, 62, 0.9));
  border: 1px solid rgba(127, 223, 255, 0.5);
  font-size: 20px;
}

.commodity-icon {
  overflow: hidden;
}

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

.commodity-name {
  margin: 0 0 3px;
  font-size: 16px;
  font-weight: 900;
}

.commodity-rarity {
  color: #9db7d8;
  font-size: 12px;
}

.price-cell,
.stock-cell,
.held-cell {
  color: #d9e6ff;
  font-weight: 800;
}

.market-action-controls {
  display: grid;
  grid-template-columns: 62px 1fr 1fr;
  gap: 6px;
}

.market-action-controls input {
  margin: 0;
  padding: 9px;
  text-align: center;
}

.market-action-controls button {
  min-height: 37px;
  padding: 8px;
  font-size: 12px;
}

.market-quick-actions {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
  margin-top: 6px;
}

.market-quick-actions button {
  min-height: 31px;
  padding: 6px;
  font-size: 11px;
  background: rgba(8, 18, 34, 0.95);
  border: 1px solid rgba(90, 190, 255, 0.55);
}

.market-quick-actions button:hover {
  background: rgba(21, 77, 155, 0.9);
}

@media (max-width: 900px) {
  .market-terminal {
    grid-template-columns: 1fr;
  }

  .market-list-header {
    display: none;
  }

  .market-row {
    grid-template-columns: 1fr;
  }

  .market-action-controls {
    grid-template-columns: 80px 1fr 1fr;
  }
}


/* ===== Marketplace tidy pass ===== */

.credit-icon {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin-right: 9px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 30%, rgba(255,255,255,0.32), transparent 25%),
    linear-gradient(135deg, #59d9ff, #154d9b 62%, #06162f);
  border: 1px solid rgba(127,223,255,0.8);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.25),
    0 0 12px rgba(89,217,255,0.35);
  color: #ffffff;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: -0.5px;
  vertical-align: middle;
}

.mini-credit {
  display: inline-block;
  margin-right: 4px;
  color: #7fdfff;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: -0.5px;
}

.market-list-header,
.market-row {
  grid-template-columns: 1.7fr 0.78fr 0.78fr 0.78fr 0.64fr 1.5fr;
}

.market-list-header {
  font-size: 11px;
}

.market-row {
  padding: 9px 10px;
}

.commodity-name {
  font-size: 15px;
}

.commodity-rarity {
  font-size: 11px;
}

.stock-cell,
.price-cell,
.held-cell {
  font-size: 15px;
}

.market-action-controls {
  grid-template-columns: 56px 1fr 1fr;
}

.market-action-controls input {
  height: 35px;
}

.market-action-controls button {
  min-height: 35px;
}

.market-quick-actions button {
  min-height: 30px;
}

.market-wallet strong {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.terminal-card {
  backdrop-filter: blur(2px);
}

.market-list-panel {
  backdrop-filter: blur(2px);
}


/* ===== Marketplace Phase 1 Final ===== */

.phase-one-market-header {
  grid-template-columns: 1fr 1.4fr !important;
}

.phase-one-market-header span:last-child {
  color: #9db7d8;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
}

.market-goods {
  gap: 10px;
}

.market-trade-card {
  background:
    radial-gradient(circle at 20% 10%, rgba(80, 180, 255, 0.08), transparent 32%),
    rgba(7, 18, 34, 0.88);
  border: 1px solid rgba(60, 143, 199, 0.78);
  border-radius: 14px;
  padding: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 0 18px rgba(0, 140, 255, 0.08);
}

.market-card-top {
  display: grid;
  grid-template-columns: 1.35fr 2fr;
  gap: 14px;
  align-items: center;
  margin-bottom: 12px;
}

.market-card-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.market-card-stats div {
  background: rgba(0, 0, 0, 0.24);
  border: 1px solid rgba(127, 223, 255, 0.13);
  border-radius: 10px;
  padding: 8px 9px;
}

.market-card-stats span {
  display: block;
  margin-bottom: 3px;
  color: #7fdfff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.market-card-stats strong {
  color: #eaf3ff;
  font-size: 15px;
}

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

.trade-control-block {
  background: rgba(0, 0, 0, 0.34);
  border: 1px solid rgba(127, 223, 255, 0.18);
  border-radius: 12px;
  padding: 10px;
}

.trade-control-header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
  margin-bottom: 8px;
}

.trade-control-header strong {
  color: #ffffff;
  font-size: 16px;
}

.trade-control-header span {
  color: #b9c8e8;
  font-size: 13px;
  white-space: nowrap;
}

.trade-range {
  width: 100%;
  margin: 2px 0 10px;
  accent-color: #59d9ff;
}

.trade-control-actions {
  display: grid;
  grid-template-columns: 70px 0.75fr 1fr;
  gap: 8px;
  align-items: center;
}

.compact-qty {
  height: 36px;
  margin: 0;
  padding: 8px;
  text-align: center;
}

.trade-control-actions button {
  min-height: 36px;
  padding: 8px 10px;
  font-size: 12px;
}

@media (max-width: 1000px) {
  .market-card-top,
  .trade-slider-area {
    grid-template-columns: 1fr;
  }

  .market-card-stats {
    grid-template-columns: repeat(2, 1fr);
  }
}



/* ===== Hangar sections update ===== */

.hangar-tabs {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}

.hangar-tabs button {
  width: auto;
  min-width: 150px;
  padding: 11px 16px;
  background: rgba(8, 18, 34, 0.9);
  border: 1px solid rgba(60, 143, 199, 0.75);
  color: #dff4ff;
}

.hangar-tabs button.active {
  background: rgba(31, 95, 183, 0.92);
  box-shadow: 0 0 16px rgba(89, 217, 255, 0.18);
}

.hangar-section {
  display: none;
  height: calc(100% - 142px);
  min-height: 0;
}

.hangar-section.active {
  display: block;
}

.hangar-section-title {
  margin-bottom: 14px;
}

.hangar-section-title h3 {
  margin: 0 0 4px;
  color: #dff4ff;
  font-size: 22px;
}

.hangar-section-title p {
  margin: 0;
  color: #b9c8e8;
}

.hangar-card-grid {
  display: grid;
  gap: 10px;
  max-height: calc(100% - 44px);
  overflow-y: auto;
  padding-right: 8px;
}

.hangar-ship-card {
  display: grid;
  grid-template-columns: 105px 1fr auto;
  gap: 16px;
  align-items: center;
  background:
    radial-gradient(circle at 12% 20%, rgba(80, 180, 255, 0.08), transparent 32%),
    rgba(7, 18, 34, 0.88);
  border: 1px solid rgba(60, 143, 199, 0.72);
  border-radius: 14px;
  padding: 14px;
}

.hangar-ship-card.selected {
  border-color: rgba(127, 223, 255, 0.95);
  box-shadow: 0 0 18px rgba(89, 217, 255, 0.16);
}

.hangar-ship-card img {
  width: 105px;
  height: 82px;
  object-fit: contain;
  background: rgba(0,0,0,0.35);
  border-radius: 10px;
}

.hangar-ship-card h4 {
  margin: 0 0 6px;
  font-size: 18px;
}

.hangar-ship-card p {
  margin: 3px 0;
  color: #b9c8e8;
  font-size: 13px;
}

.hangar-card-actions {
  display: grid;
  gap: 8px;
  min-width: 105px;
}

.hangar-card-actions button {
  min-height: 36px;
  padding: 8px 10px;
  font-size: 12px;
}

.hangar-section .hangar-layout {
  height: 100%;
}

@media (max-width: 900px) {
  .hangar-tabs {
    flex-wrap: wrap;
  }

  .hangar-ship-card {
    grid-template-columns: 1fr;
  }

  .hangar-card-actions {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* ===== Hangar equipment shops ===== */

.hangar-tabs {
  flex-wrap: wrap;
}

.hangar-tabs button {
  min-width: 140px;
}

.hangar-edit-layout {
  align-items: stretch;
}

.equipment-panel {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.editor-subtext {
  margin: 0;
  color: #9db7d8;
  font-size: 13px;
}

.editor-block h3 {
  margin-bottom: 10px;
}

.installed-guns,
.installed-attachments {
  display: grid;
  gap: 10px;
}

.equipment-shop-grid {
  display: grid;
  gap: 10px;
  max-height: calc(100% - 44px);
  overflow-y: auto;
  padding-right: 8px;
}

.equipment-card {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  gap: 16px;
  align-items: center;
  background:
    radial-gradient(circle at 12% 20%, rgba(80, 180, 255, 0.08), transparent 32%),
    rgba(7, 18, 34, 0.88);
  border: 1px solid rgba(60, 143, 199, 0.72);
  border-radius: 14px;
  padding: 14px;
}

.equipment-card img {
  width: 110px;
  height: 82px;
  object-fit: contain;
  background: rgba(0,0,0,0.35);
  border-radius: 10px;
}

.equipment-card-meta h4 {
  margin: 0 0 6px;
  font-size: 18px;
}

.equipment-card-meta p {
  margin: 4px 0;
  color: #b9c8e8;
  font-size: 13px;
}

.equipment-card-actions {
  display: grid;
  min-width: 120px;
}

.equipment-card-actions button {
  min-height: 38px;
  padding: 8px 10px;
  font-size: 12px;
}

@media (max-width: 900px) {
  .equipment-card {
    grid-template-columns: 1fr;
  }

  .equipment-card-actions {
    min-width: 0;
  }
}


/* ===== Hangar editor inventory layout ===== */

.hangar-section {
  height: calc(100% - 142px);
  overflow: hidden;
}

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

.ship-editor-layout {
  height: calc(100% - 58px);
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 18px;
  min-height: 0;
}

.ship-editor-left,
.ship-editor-right {
  min-height: 0;
  background: rgba(0,0,0,0.62);
  border: 1px solid rgba(60,143,199,0.9);
  border-radius: 14px;
  padding: 16px;
}

.ship-editor-left {
  display: grid;
  grid-template-rows: 240px 1fr;
  gap: 10px;
  overflow: hidden;
}

.ship-editor-left .hangar-ship-img {
  max-height: 230px;
  margin: 0 auto;
}

.compact-stats {
  overflow-y: auto;
  padding-right: 6px;
  font-size: 14px;
  line-height: 1.35;
}

.ship-editor-right {
  overflow-y: auto;
  display: grid;
  gap: 14px;
  align-content: start;
}

.slot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  gap: 10px;
}

.equipment-slot {
  min-height: 92px;
  padding: 10px;
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 10px;
  align-items: center;
  text-align: left;
  background: rgba(8, 18, 34, 0.82);
  border: 1px dashed rgba(90, 190, 255, 0.55);
  border-radius: 12px;
  color: #d9e6ff;
}

.equipment-slot.filled {
  border-style: solid;
  border-color: rgba(90, 190, 255, 0.9);
  cursor: pointer;
}

.equipment-slot img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  background: rgba(0,0,0,0.35);
  border-radius: 8px;
}

.equipment-slot span {
  font-weight: 900;
}

.equipment-slot small {
  display: block;
  margin-top: 4px;
  color: #9db7d8;
  font-size: 11px;
}

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

.inventory-icon-card {
  min-height: 108px;
  padding: 9px;
  display: grid;
  justify-items: center;
  gap: 5px;
  background: rgba(8, 18, 34, 0.82);
  border: 1px solid rgba(60, 143, 199, 0.72);
  border-radius: 12px;
  color: #d9e6ff;
  text-align: center;
}

.inventory-icon-card img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  background: rgba(0,0,0,0.35);
  border-radius: 8px;
}

.inventory-icon-card span {
  font-size: 11px;
  line-height: 1.15;
}

.inventory-icon-card strong {
  color: #7fdfff;
  font-size: 12px;
}

.inventory-icon-card:disabled {
  opacity: 0.4;
}

.equipment-card img,
.attachment-card img,
.hangar-ship-card img {
  object-fit: contain;
}

@media (max-width: 900px) {
  .ship-editor-layout {
    grid-template-columns: 1fr;
  }
}


/* ===== Interactive space HUD pass ===== */

.hud-overlay-panel {
  position: absolute;
  left: 374px;
  bottom: 214px;
  width: min(620px, calc(100% - 410px));
  z-index: 8;
  pointer-events: none;
}

.hud-overlay-panel .hud-panel {
  display: none;
  pointer-events: auto;
}

.hud-overlay-panel .hud-panel.active {
  display: block;
}

.hud-panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.hud-panel-header h3 {
  margin: 0 0 8px;
}

.hud-close-btn {
  width: 28px;
  min-height: 28px;
  height: 28px;
  padding: 0;
  border-radius: 8px;
  background: transparent;
  border: 1px solid rgba(127, 223, 255, 0.4);
  color: #dff4ff;
  font-size: 18px;
  line-height: 1;
}

.compact-hud.space-combat-hud {
  width: auto;
  right: auto;
  min-height: 166px;
  align-items: stretch;
}

.compact-hud .vertical-stats {
  flex: 0 0 auto;
}

.compact-hud .ship-display-panel {
  flex: 0 0 165px;
}

.hud-action-dock {
  display: grid;
  grid-template-columns: repeat(4, 86px);
  gap: 10px;
  align-self: stretch;
  background: rgba(0, 0, 0, 0.72);
  border: 1px solid #3c8fc7;
  border-radius: 12px;
  padding: 12px;
  box-shadow: 0 0 18px rgba(0, 140, 255, 0.14);
}

.hud-action-dock button {
  min-height: 74px;
  width: 86px;
  padding: 9px 8px;
  display: grid;
  align-content: center;
  gap: 5px;
  background: linear-gradient(180deg, rgba(8, 28, 55, 0.96), rgba(5, 14, 28, 0.96));
  border: 1px solid rgba(90, 190, 255, 0.62);
  border-radius: 10px;
  color: #eaf3ff;
}

.hud-action-dock button.active,
.hud-action-dock button.has-alert {
  border-color: rgba(127, 223, 255, 0.98);
  box-shadow: 0 0 14px rgba(89, 217, 255, 0.22);
}

.hud-action-dock button.has-alert strong {
  color: #7fdfff;
}

.hud-action-dock span {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #7fdfff;
  font-weight: 900;
}

.hud-action-dock strong {
  font-size: 12px;
  color: #d9e6ff;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hud-toast-feed {
  position: absolute;
  right: 26px;
  bottom: 214px;
  width: 300px;
  display: grid;
  gap: 8px;
  z-index: 9;
  pointer-events: none;
}

.hud-toast {
  padding: 10px 12px;
  background: rgba(0, 0, 0, 0.72);
  border: 1px solid rgba(90, 190, 255, 0.78);
  border-radius: 10px;
  color: #d9e6ff;
  font-size: 13px;
  box-shadow: 0 0 18px rgba(0, 140, 255, 0.14);
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.hud-toast.fade-out {
  opacity: 0;
  transform: translateY(8px);
}

.hud-overlay-panel .sector-panel,
.hud-overlay-panel .cargo-panel,
.hud-overlay-panel .target-panel,
.hud-overlay-panel .comms-panel {
  min-width: 0;
  width: 100%;
}

.hud-overlay-panel .sector-grid {
  grid-template-columns: 1fr 1fr;
}

.hud-overlay-panel .cargo-panel .hud-text {
  max-height: 180px;
  overflow-y: auto;
}

@media (max-width: 1000px) {
  .hud-overlay-panel {
    left: 22px;
    bottom: 398px;
    width: calc(100% - 44px);
  }

  .hud-toast-feed {
    right: 22px;
    bottom: 398px;
  }

  .compact-hud.space-combat-hud {
    flex-wrap: wrap;
  }

  .hud-action-dock {
    grid-template-columns: repeat(2, 86px);
  }
}


/* ===== Bottom-only interactive HUD fix ===== */

.hud-overlay-panel {
  display: none !important;
}

.bottom-only-hud.space-combat-hud {
  left: 16px;
  right: auto;
  bottom: 16px;
  width: auto;
  max-width: calc(100% - 32px);
  min-height: 166px;
  display: flex;
  align-items: stretch;
  gap: 10px;
}

.bottom-only-hud .ship-display-panel {
  flex: 0 0 165px;
}

.hud-control-stack {
  width: 420px;
  min-height: 166px;
  max-height: 166px;
  display: grid;
  grid-template-rows: 58px 1fr;
  gap: 8px;
  background: rgba(0, 0, 0, 0.72);
  border: 1px solid #3c8fc7;
  border-radius: 12px;
  padding: 10px;
  box-shadow: 0 0 18px rgba(0, 140, 255, 0.14);
}

.bottom-only-hud .hud-action-dock {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  align-self: stretch;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}

.bottom-only-hud .hud-action-dock button {
  width: auto;
  min-height: 56px;
  padding: 6px;
  gap: 3px;
}

.bottom-only-hud .hud-action-dock span {
  font-size: 10px;
}

.bottom-only-hud .hud-action-dock strong {
  font-size: 11px;
}

.hud-inline-panel {
  position: relative;
  min-height: 0;
  overflow: hidden;
}

.hud-inline-panel .hud-panel {
  display: none;
  height: 100%;
  min-width: 0;
  width: 100%;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.hud-inline-panel .hud-panel.active {
  display: block;
}

.hud-inline-panel .hud-text {
  min-height: 0;
  max-height: 70px;
  overflow-y: auto;
  font-size: 12px;
}

.hud-panel-header {
  margin-bottom: 4px;
}

.hud-panel-header h3 {
  font-size: 14px;
  margin: 0;
}

.hud-close-btn {
  width: 22px;
  min-height: 22px;
  height: 22px;
  font-size: 15px;
}

.hud-inline-panel .hud-row {
  margin-top: 7px;
}

.hud-inline-panel .hud-row button,
.hud-inline-panel #collectBtn {
  min-height: 32px;
  padding: 7px 10px;
  font-size: 11px;
}

.danger-action {
  background: linear-gradient(180deg, #9b2838, #59111c) !important;
  border: 1px solid rgba(255, 110, 126, 0.9) !important;
}

.compact-sector-grid {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 10px;
}

.hud-inline-panel .hud-label {
  font-size: 10px;
  margin-bottom: 3px;
}

.hud-inline-panel .hud-toast-feed {
  position: static;
  width: 100%;
  display: grid;
  gap: 5px;
  margin-top: 6px;
  z-index: auto;
}

.hud-inline-panel .hud-toast {
  padding: 6px 8px;
  font-size: 11px;
}

.asteroid-field {
  z-index: 6;
}

.asteroid-target {
  z-index: 7;
}

@media (max-width: 980px) {
  .bottom-only-hud.space-combat-hud {
    flex-wrap: wrap;
  }

  .hud-control-stack {
    width: min(420px, calc(100vw - 32px));
  }
}

/* ===== Player orbit HUD scale/refinement pass ===== */
.player-orbit-screen .player-hud-frame {
  inset: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.player-orbit-screen .player-hud-frame::before,
.player-orbit-screen .player-hud-frame::after {
  display: none;
}

.player-orbit-screen .bottom-hud-divider {
  display: none;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  left: 24px !important;
  right: 24px !important;
  bottom: 14px !important;
  height: 156px !important;
  min-height: 156px !important;
  max-height: 156px !important;
  grid-template-columns: 350px 260px minmax(390px, 1fr) !important;
  gap: 14px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  height: 156px !important;
  min-height: 156px !important;
  max-height: 156px !important;
  border-color: rgba(37, 171, 245, 0.72) !important;
  border-radius: 12px !important;
  background:
    linear-gradient(180deg, rgba(5, 18, 34, 0.66), rgba(1, 7, 18, 0.78)),
    radial-gradient(circle at top, rgba(39, 170, 255, 0.09), transparent 58%) !important;
  box-shadow:
    0 0 10px rgba(0, 155, 255, 0.12),
    inset 0 0 16px rgba(0, 155, 255, 0.055) !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel::before {
  display: none;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  padding: 16px 28px 12px !important;
  gap: 18px !important;
}

.player-orbit-screen .player-bottom-hud .stat-col {
  gap: 5px !important;
}

.player-orbit-screen .player-bottom-hud .stat-value {
  min-height: 15px;
  font-size: 13px !important;
  text-shadow: 0 0 6px rgba(70, 200, 255, 0.42);
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  width: 22px !important;
  height: 78px !important;
  flex: 0 0 78px !important;
  max-height: 78px !important;
  border-radius: 7px !important;
  border-color: rgba(146, 219, 255, 0.18) !important;
  background: rgba(2, 10, 22, 0.72) !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  border-radius: 7px;
  opacity: 0.78;
}

.player-orbit-screen .player-bottom-hud .jump-fill {
  background-image: linear-gradient(to top, #9f1930, #e2415d) !important;
}

.player-orbit-screen .player-bottom-hud .hull-fill {
  background-image: linear-gradient(to top, #a97912, #e7c94a) !important;
}

.player-orbit-screen .player-bottom-hud .shield-fill {
  background-image: linear-gradient(to top, #185faf, #38aee0) !important;
}

.player-orbit-screen .player-bottom-hud .stat-label {
  min-height: 18px !important;
  height: 18px !important;
  flex-basis: 18px !important;
  gap: 5px;
  font-size: 12px !important;
  color: rgba(236, 248, 255, 0.92);
}

.player-orbit-screen .player-bottom-hud .stat-label img {
  width: 12px;
  height: 12px;
  filter: drop-shadow(0 0 4px rgba(74, 207, 255, 0.46));
}

.player-orbit-screen .player-bottom-hud .ship-panel.ship-display-panel-action {
  padding: 14px 14px 12px !important;
  grid-template-columns: 1fr 58px !important;
  gap: 5px 10px !important;
}

.player-orbit-screen .ship-card-main {
  min-height: 58px;
}

.player-orbit-screen .player-bottom-hud .active-player-ship,
.player-orbit-screen .player-bottom-hud .hud-ship-image {
  max-width: 104px !important;
  max-height: 88px !important;
  filter:
    drop-shadow(0 0 6px rgba(63, 194, 255, 0.55))
    drop-shadow(0 7px 9px rgba(0, 0, 0, 0.6));
}

.player-orbit-screen .player-bottom-hud .level-badge {
  height: 54px;
  border-radius: 10px;
  background: rgba(3, 18, 35, 0.68);
}

.player-orbit-screen .player-bottom-hud .level-badge span {
  font-size: 8px;
}

.player-orbit-screen .player-bottom-hud .level-badge strong {
  font-size: 24px;
}

.player-orbit-screen .player-bottom-hud .xp-row {
  font-size: 11px;
}

.player-orbit-screen .player-bottom-hud .xp-bar {
  height: 7px;
}

.player-orbit-screen .player-bottom-hud .xp-fill {
  opacity: 0.8;
  box-shadow: 0 0 8px rgba(0, 200, 255, 0.5);
}

.player-orbit-screen .player-bottom-hud .ship-inventory-btn {
  height: 30px !important;
  min-height: 30px !important;
  border-radius: 8px !important;
  font-size: 10px !important;
  background: linear-gradient(180deg, rgba(0, 54, 96, 0.45), rgba(2, 16, 35, 0.78)) !important;
}

.player-orbit-screen .player-bottom-hud .info-panel.hud-command-console {
  grid-template-rows: 34px minmax(0, 1fr) !important;
  gap: 7px !important;
  padding: 8px 12px 10px !important;
}

.player-orbit-screen .player-bottom-hud .info-tabs {
  height: 34px !important;
  gap: 6px !important;
}

.player-orbit-screen .player-bottom-hud .info-tab {
  min-height: 30px !important;
  height: 30px !important;
  gap: 7px;
  padding: 0 8px !important;
  font-size: 11px !important;
  background: rgba(2, 16, 34, 0.38) !important;
}

.player-orbit-screen .player-bottom-hud .info-tab img {
  width: 13px;
  height: 13px;
  filter: drop-shadow(0 0 4px rgba(77, 211, 255, 0.48));
}

.player-orbit-screen .player-bottom-hud .hud-panel-header.compact-header h3,
.player-orbit-screen .player-bottom-hud .activity-objective-block h3 {
  margin-bottom: 6px;
  font-size: 15px;
}

.player-orbit-screen .player-bottom-hud .objective-hud-summary,
.player-orbit-screen .player-bottom-hud .local-chat-feed,
.player-orbit-screen .player-bottom-hud .activity-log-feed {
  min-height: 58px !important;
  border-radius: 9px;
  background:
    linear-gradient(180deg, rgba(1, 12, 27, 0.56), rgba(1, 7, 18, 0.62)),
    radial-gradient(circle at center, rgba(0, 130, 255, 0.05), transparent 60%);
}

/* ===== Player orbit HUD decisive final overrides ===== */
.player-orbit-screen .orbit-header-trim {
  display: none !important;
}

.player-orbit-screen .orbit-header {
  top: 12px !important;
  left: 38px !important;
  width: 300px !important;
  height: 34px !important;
}

.player-orbit-screen .node-name-tag.orbit-location {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  font-size: 20px !important;
  letter-spacing: 5px !important;
  text-shadow: 0 0 10px rgba(63, 190, 255, 0.82), 0 2px 6px rgba(0, 0, 0, 0.75) !important;
}

.player-orbit-screen #planetLandBtn.clickable-planet {
  top: 58px !important;
  right: 86px !important;
  width: 124px !important;
  height: 124px !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  height: 160px !important;
  min-height: 160px !important;
  max-height: 160px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  height: 160px !important;
  min-height: 160px !important;
  max-height: 160px !important;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  padding: 12px 18px 10px !important;
}

.player-orbit-screen .player-bottom-hud .stat-col {
  gap: 4px !important;
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  width: 24px !important;
  height: 92px !important;
  flex: 0 0 92px !important;
  max-height: 92px !important;
  border-radius: 7px !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  border-radius: 7px !important;
}

.player-orbit-screen .ship-storage-strip {
  grid-template-columns: 1fr !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button {
  height: 31px !important;
  min-height: 31px !important;
}

/* ===== Player orbit HUD final compact scale ===== */
.space-screen.player-orbit-screen {
  height: 665px !important;
  min-height: 0 !important;
  max-height: 665px !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  bottom: 8px !important;
  height: 128px !important;
  min-height: 128px !important;
  max-height: 128px !important;
  grid-template-columns: 250px 198px minmax(0, 1fr) !important;
  gap: 12px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  height: 128px !important;
  min-height: 128px !important;
  max-height: 128px !important;
  border-radius: 9px !important;
  box-shadow:
    0 0 8px rgba(0, 155, 255, 0.1),
    inset 0 0 12px rgba(0, 155, 255, 0.045) !important;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  padding: 10px 15px 8px !important;
  gap: 9px !important;
}

.player-orbit-screen .player-bottom-hud .stat-name {
  display: none !important;
}

.player-orbit-screen .player-bottom-hud .stat-col {
  gap: 4px !important;
}

.player-orbit-screen .player-bottom-hud .stat-value {
  min-height: 12px !important;
  font-size: 10px !important;
  line-height: 1 !important;
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  width: 20px !important;
  height: 76px !important;
  flex: 0 0 76px !important;
  max-height: 76px !important;
  border-radius: 6px !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  border-radius: 6px !important;
}

.player-orbit-screen .player-bottom-hud .stat-label {
  height: 20px !important;
  min-height: 20px !important;
  flex-basis: 20px !important;
  padding: 0 6px !important;
  gap: 4px !important;
  font-size: 9px !important;
  letter-spacing: 0.6px !important;
}

.player-orbit-screen .player-bottom-hud .stat-label img {
  width: 10px !important;
  height: 10px !important;
}

.player-orbit-screen .player-bottom-hud .ship-panel.ship-display-panel-action {
  grid-template-columns: minmax(0, 1fr) 46px !important;
  padding: 9px 10px 8px !important;
  gap: 4px 7px !important;
}

.player-orbit-screen .ship-card-main {
  min-height: 48px !important;
}

.player-orbit-screen .player-bottom-hud .active-player-ship,
.player-orbit-screen .player-bottom-hud .hud-ship-image {
  max-width: 76px !important;
  max-height: 52px !important;
}

.player-orbit-screen .player-bottom-hud .level-badge {
  height: 42px !important;
  border-radius: 8px !important;
}

.player-orbit-screen .player-bottom-hud .level-badge span {
  font-size: 7px !important;
}

.player-orbit-screen .player-bottom-hud .level-badge strong {
  font-size: 20px !important;
}

.player-orbit-screen .player-bottom-hud .xp-row {
  font-size: 9px !important;
  line-height: 1 !important;
}

.player-orbit-screen .player-bottom-hud .xp-bar {
  height: 5px !important;
}

.player-orbit-screen .ship-storage-strip {
  gap: 0 !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button {
  height: 24px !important;
  min-height: 24px !important;
  padding: 2px 7px !important;
  border-radius: 6px !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button span {
  font-size: 7px !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button strong {
  font-size: 8px !important;
}

.player-orbit-screen .player-bottom-hud .info-panel.hud-command-console {
  grid-template-rows: 27px minmax(0, 1fr) !important;
  gap: 5px !important;
  padding: 6px 10px 8px !important;
}

.player-orbit-screen .player-bottom-hud .info-tabs {
  height: 27px !important;
  gap: 5px !important;
}

.player-orbit-screen .player-bottom-hud .info-tab {
  min-height: 24px !important;
  height: 24px !important;
  gap: 6px !important;
  padding: 0 7px !important;
  font-size: 9px !important;
}

.player-orbit-screen .player-bottom-hud .info-tab img {
  width: 10px !important;
  height: 10px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel-header.compact-header h3,
.player-orbit-screen .player-bottom-hud .activity-objective-block h3 {
  margin-bottom: 4px !important;
  font-size: 12px !important;
}

.player-orbit-screen .player-bottom-hud .objective-hud-summary,
.player-orbit-screen .player-bottom-hud .local-chat-feed,
.player-orbit-screen .player-bottom-hud .activity-log-feed {
  min-height: 42px !important;
  border-radius: 7px !important;
  font-size: 11px !important;
}

.player-orbit-screen .player-bottom-hud .objective-empty,
.player-orbit-screen .player-bottom-hud .cargo-empty {
  font-size: 11px !important;
}

/* ===== Player orbit reference pass - terminal override ===== */
.screen:has(#spaceScreen.active) {
  padding: 6px !important;
  align-items: center !important;
  justify-content: center !important;
}

.space-screen.player-orbit-screen {
  width: calc(100vw - 12px) !important;
  max-width: none !important;
  height: calc(100vh - 12px) !important;
  max-height: none !important;
  min-height: 0 !important;
  border: 1px solid rgba(0, 168, 222, 0.66) !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(0, 133, 240, 0.16), transparent 13%),
    linear-gradient(180deg, rgba(0, 4, 10, 0.04), rgba(0, 3, 8, 0.12)),
    url("space-screen-background.png") center / cover no-repeat !important;
  box-shadow:
    0 0 24px rgba(0, 120, 190, 0.16),
    inset 0 0 0 1px rgba(0, 168, 222, 0.35),
    inset 0 0 28px rgba(0, 120, 190, 0.08) !important;
}

.space-screen.player-orbit-screen.empty-node {
  background:
    radial-gradient(circle at 88% 12%, rgba(0, 133, 240, 0.12), transparent 13%),
    linear-gradient(180deg, rgba(0, 4, 10, 0.04), rgba(0, 3, 8, 0.12)),
    url("space-empty.png") center / cover no-repeat !important;
}

.player-orbit-screen .player-hud-frame {
  inset: 0 !important;
  border: 0 !important;
  border-radius: 26px !important;
  box-shadow: inset 0 0 0 1px rgba(0, 168, 222, 0.42) !important;
}

.player-orbit-screen .player-hud-frame::before,
.player-orbit-screen .player-hud-frame::after {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  width: auto !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(0, 168, 222, 0.52), transparent) !important;
  box-shadow: none !important;
}

.player-orbit-screen .player-hud-frame::before {
  top: 0 !important;
}

.player-orbit-screen .player-hud-frame::after {
  bottom: 0 !important;
}

.player-orbit-screen .orbit-header {
  top: 26px !important;
  left: 48px !important;
  width: min(520px, calc(100vw - 180px)) !important;
  height: 42px !important;
}

.player-orbit-screen .orbit-header-trim {
  display: none !important;
}

.player-orbit-screen .node-name-tag.orbit-location {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: clamp(24px, 2vw, 34px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 7px !important;
  color: #eaf7ff !important;
  text-shadow:
    0 0 4px rgba(255, 255, 255, 0.92),
    0 0 12px rgba(79, 176, 255, 0.94),
    0 0 24px rgba(79, 176, 255, 0.38) !important;
}

.player-orbit-screen #planetLandBtn.clickable-planet {
  top: 45px !important;
  right: 72px !important;
  width: 150px !important;
  height: 150px !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  left: 30px !important;
  right: 24px !important;
  bottom: 31px !important;
  height: clamp(218px, 29.5vh, 278px) !important;
  min-height: clamp(218px, 29.5vh, 278px) !important;
  max-height: clamp(218px, 29.5vh, 278px) !important;
  grid-template-columns: clamp(368px, 27.4vw, 462px) clamp(350px, 25vw, 420px) minmax(520px, 1fr) !important;
  gap: 20px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  height: clamp(218px, 29.5vh, 278px) !important;
  min-height: clamp(218px, 29.5vh, 278px) !important;
  max-height: clamp(218px, 29.5vh, 278px) !important;
  border: 1px solid rgba(0, 174, 236, 0.82) !important;
  border-radius: 0 !important;
  clip-path: polygon(15px 0, calc(100% - 24px) 0, 100% 24px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 16px 100%, 0 calc(100% - 20px), 0 17px) !important;
  background:
    linear-gradient(180deg, rgba(2, 16, 30, 0.78), rgba(0, 7, 16, 0.86)),
    radial-gradient(circle at 50% 0%, rgba(0, 135, 210, 0.12), transparent 55%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 174, 236, 0.18),
    inset 0 0 28px rgba(0, 120, 190, 0.08),
    0 0 14px rgba(0, 129, 200, 0.12) !important;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding: 22px 28px 25px !important;
}

.player-orbit-screen .player-bottom-hud .stat-col {
  display: grid !important;
  grid-template-rows: 24px 22px minmax(96px, 1fr) 43px !important;
  justify-items: center !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 0 11px;
}

.player-orbit-screen .player-bottom-hud .stat-col + .stat-col {
  border-left: 1px solid rgba(92, 179, 226, 0.34);
}

.player-orbit-screen .player-bottom-hud .stat-value {
  min-height: 0 !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 18px !important;
  line-height: 1 !important;
  color: #ffffff !important;
}

.player-orbit-screen .player-bottom-hud .stat-name {
  font-size: 16px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 1px;
  color: #bfe8ff;
  text-shadow: 0 0 7px rgba(78, 178, 255, 0.7);
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  width: 61px !important;
  height: 128px !important;
  max-height: 128px !important;
  flex: none !important;
  border-radius: 3px !important;
  border: 1px solid rgba(0, 150, 225, 0.72) !important;
  background: rgba(0, 5, 12, 0.92) !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  border-radius: 2px !important;
  opacity: 1 !important;
  background-size: 100% 12px !important;
  background-position: bottom !important;
}

.player-orbit-screen .player-bottom-hud .jump-fill {
  background-image: repeating-linear-gradient(to top, #e92830 0 9px, #8e0a18 9px 12px) !important;
}

.player-orbit-screen .player-bottom-hud .hull-fill {
  background-image: repeating-linear-gradient(to top, #e0bd28 0 9px, #836b08 9px 12px) !important;
}

.player-orbit-screen .player-bottom-hud .shield-fill {
  background-image: repeating-linear-gradient(to top, #0094df 0 9px, #004a92 9px 12px) !important;
}

.player-orbit-screen .player-bottom-hud .stat-label {
  width: 124px !important;
  height: 43px !important;
  min-height: 43px !important;
  flex: none !important;
  border: 1px solid rgba(0, 180, 245, 0.95) !important;
  border-radius: 5px !important;
  background: linear-gradient(180deg, rgba(2, 27, 48, 0.72), rgba(0, 10, 23, 0.84)) !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 17px !important;
  letter-spacing: 2px !important;
}

.player-orbit-screen .player-bottom-hud .stat-label img {
  display: none !important;
}

.player-orbit-screen .player-bottom-hud .ship-panel.ship-display-panel-action {
  grid-template-columns: minmax(0, 1fr) 84px !important;
  grid-template-rows: minmax(0, 118px) 28px 16px 58px !important;
  gap: 9px 18px !important;
  padding: 28px 30px 24px !important;
}

.player-orbit-screen .ship-card-main {
  min-height: 0 !important;
}

.player-orbit-screen .player-bottom-hud .active-player-ship,
.player-orbit-screen .player-bottom-hud .hud-ship-image {
  max-width: 118px !important;
  max-height: 116px !important;
}

.player-orbit-screen .player-bottom-hud .level-badge {
  width: 84px !important;
  height: 72px !important;
  border: 1px solid rgba(0, 178, 238, 0.9) !important;
  border-radius: 5px !important;
}

.player-orbit-screen .player-bottom-hud .level-badge span {
  font-size: 14px !important;
  color: #6ae7ff !important;
}

.player-orbit-screen .player-bottom-hud .level-badge strong {
  font-size: 32px !important;
}

.player-orbit-screen .player-bottom-hud .xp-row {
  font-size: 15px !important;
  font-weight: 900 !important;
}

.player-orbit-screen .player-bottom-hud .xp-bar {
  height: 12px !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button {
  height: 58px !important;
  min-height: 58px !important;
  border-radius: 5px !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button span {
  display: none !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button strong {
  font-size: 0 !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button strong::before {
  content: "INVENTORY";
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 20px !important;
  letter-spacing: 3px !important;
}

.player-orbit-screen .player-bottom-hud .info-panel.hud-command-console {
  grid-template-rows: 54px minmax(0, 1fr) !important;
  gap: 0 !important;
  padding: 15px 22px 24px !important;
}

.player-orbit-screen .player-bottom-hud .info-tabs {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
  height: 54px !important;
  border-bottom: 1px solid rgba(130, 194, 230, 0.44) !important;
}

.player-orbit-screen .player-bottom-hud .info-tab {
  height: 45px !important;
  min-height: 45px !important;
  background: transparent !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 15px !important;
  letter-spacing: 2px !important;
}

.player-orbit-screen .player-bottom-hud .info-tab img {
  display: none !important;
}

.player-orbit-screen .player-bottom-hud .info-tab.active,
.player-orbit-screen .player-bottom-hud .info-tab:hover {
  border-color: rgba(0, 183, 255, 0.95) !important;
  background: linear-gradient(180deg, rgba(2, 43, 70, 0.66), rgba(2, 14, 29, 0.26)) !important;
}

.player-orbit-screen .player-bottom-hud .objectives-panel,
.player-orbit-screen .player-bottom-hud .activity-panel,
.player-orbit-screen .player-bottom-hud .comms-panel {
  padding-top: 22px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel-header.compact-header h3,
.player-orbit-screen .player-bottom-hud .activity-objective-block h3 {
  margin: 0 0 18px !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 19px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase;
}

.player-orbit-screen .player-bottom-hud .objective-hud-summary,
.player-orbit-screen .player-bottom-hud .local-chat-feed,
.player-orbit-screen .player-bottom-hud .activity-log-feed {
  min-height: 118px !important;
  height: 118px !important;
  border: 1px dashed rgba(111, 174, 224, 0.48) !important;
  border-radius: 10px !important;
  background: rgba(0, 7, 17, 0.34) !important;
}

.player-orbit-screen .player-bottom-hud .objective-empty,
.player-orbit-screen .player-bottom-hud .cargo-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  color: #c6e7ff !important;
  font-size: 21px !important;
  font-weight: 400 !important;
}

/* ===== Player orbit reference mockup match ===== */
.screen:has(#spaceScreen.active) {
  padding: 6px !important;
}

.space-screen.player-orbit-screen {
  --orbit-blue: #00a8de;
  --orbit-blue-soft: rgba(0, 168, 222, 0.42);
  --orbit-panel-bg: rgba(0, 10, 20, 0.78);
  --orbit-panel-inner: rgba(3, 21, 38, 0.64);
  width: calc(100vw - 12px) !important;
  max-width: none !important;
  height: calc(100vh - 12px) !important;
  height: calc(100dvh - 12px) !important;
  max-height: none !important;
  min-height: 0 !important;
  border: 1px solid rgba(0, 168, 222, 0.66) !important;
  border-radius: 26px !important;
  box-shadow:
    0 0 24px rgba(0, 120, 190, 0.16),
    inset 0 0 28px rgba(0, 120, 190, 0.08) !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(0, 133, 240, 0.16), transparent 13%),
    linear-gradient(180deg, rgba(0, 4, 10, 0.04), rgba(0, 3, 8, 0.12)),
    url("space-screen-background.png") center / cover no-repeat !important;
}

.space-screen.player-orbit-screen.empty-node {
  background:
    radial-gradient(circle at 88% 12%, rgba(0, 133, 240, 0.12), transparent 13%),
    linear-gradient(180deg, rgba(0, 4, 10, 0.04), rgba(0, 3, 8, 0.12)),
    url("space-empty.png") center / cover no-repeat !important;
}

.player-orbit-screen .player-hud-frame {
  inset: 0 !important;
  border: 0 !important;
  border-radius: 26px !important;
  box-shadow: inset 0 0 0 1px rgba(0, 168, 222, 0.42) !important;
}

.player-orbit-screen .player-hud-frame::before,
.player-orbit-screen .player-hud-frame::after {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  width: auto !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(0, 168, 222, 0.52), transparent) !important;
  box-shadow: none !important;
}

.player-orbit-screen .player-hud-frame::before {
  top: 0 !important;
}

.player-orbit-screen .player-hud-frame::after {
  bottom: 0 !important;
}

.player-orbit-screen .orbit-header-trim {
  display: none !important;
}

.player-orbit-screen .orbit-header {
  top: 26px !important;
  left: 48px !important;
  width: min(520px, calc(100vw - 180px)) !important;
  height: 42px !important;
}

.player-orbit-screen .node-name-tag.orbit-location {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: clamp(24px, 2vw, 34px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 7px !important;
  color: #eaf7ff !important;
  text-shadow:
    0 0 4px rgba(255, 255, 255, 0.92),
    0 0 12px rgba(79, 176, 255, 0.94),
    0 0 24px rgba(79, 176, 255, 0.38) !important;
}

.player-orbit-screen #planetLandBtn.clickable-planet {
  top: 45px !important;
  right: 72px !important;
  width: 150px !important;
  height: 150px !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  left: 30px !important;
  right: 24px !important;
  bottom: 31px !important;
  height: clamp(218px, 29.5vh, 278px) !important;
  min-height: clamp(218px, 29.5vh, 278px) !important;
  max-height: clamp(218px, 29.5vh, 278px) !important;
  display: grid !important;
  grid-template-columns: clamp(368px, 27.4vw, 462px) clamp(350px, 25vw, 420px) minmax(520px, 1fr) !important;
  gap: 20px !important;
  align-items: stretch !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  height: clamp(218px, 29.5vh, 278px) !important;
  min-height: clamp(218px, 29.5vh, 278px) !important;
  max-height: clamp(218px, 29.5vh, 278px) !important;
  border: 1px solid rgba(0, 174, 236, 0.82) !important;
  border-radius: 0 !important;
  clip-path: polygon(15px 0, calc(100% - 24px) 0, 100% 24px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 16px 100%, 0 calc(100% - 20px), 0 17px) !important;
  background:
    linear-gradient(180deg, rgba(2, 16, 30, 0.78), rgba(0, 7, 16, 0.86)),
    radial-gradient(circle at 50% 0%, rgba(0, 135, 210, 0.12), transparent 55%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 174, 236, 0.18),
    inset 0 0 28px rgba(0, 120, 190, 0.08),
    0 0 14px rgba(0, 129, 200, 0.12) !important;
  overflow: hidden !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel::before,
.player-orbit-screen .player-bottom-hud .ship-display-panel::before,
.player-orbit-screen .player-bottom-hud .hud-command-console::before,
.player-orbit-screen .player-bottom-hud .vertical-stats::before {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  inset: 8px !important;
  border: 1px solid rgba(0, 174, 236, 0.18) !important;
  clip-path: polygon(12px 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 14px), calc(100% - 14px) 100%, 12px 100%, 0 calc(100% - 16px), 0 12px) !important;
  pointer-events: none !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding: 22px 28px 25px !important;
}

.player-orbit-screen .player-bottom-hud .stat-col {
  display: grid !important;
  grid-template-rows: 24px 22px minmax(96px, 1fr) 43px !important;
  justify-items: center !important;
  align-items: center !important;
  gap: 0 !important;
  min-width: 0;
  padding: 0 11px;
}

.player-orbit-screen .player-bottom-hud .stat-col + .stat-col {
  border-left: 1px solid rgba(92, 179, 226, 0.34);
}

.player-orbit-screen .player-bottom-hud .stat-value {
  min-height: 0 !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 18px !important;
  line-height: 1 !important;
  color: #ffffff !important;
  text-shadow: 0 0 7px rgba(255, 255, 255, 0.48), 0 0 13px rgba(120, 201, 255, 0.34) !important;
}

.player-orbit-screen .player-bottom-hud .stat-name {
  font-size: 16px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 1px;
  color: #bfe8ff;
  text-shadow: 0 0 7px rgba(78, 178, 255, 0.7);
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  width: 61px !important;
  height: 128px !important;
  max-height: 128px !important;
  flex: none !important;
  border-radius: 3px !important;
  border: 1px solid rgba(0, 150, 225, 0.72) !important;
  background: rgba(0, 5, 12, 0.92) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 0, 0, 0.8),
    0 0 8px rgba(0, 148, 225, 0.26) !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  border-radius: 2px !important;
  opacity: 1 !important;
  background-size: 100% 12px !important;
  background-position: bottom !important;
}

.player-orbit-screen .player-bottom-hud .jump-fill {
  background-image: repeating-linear-gradient(to top, #e92830 0 9px, #8e0a18 9px 12px) !important;
}

.player-orbit-screen .player-bottom-hud .hull-fill {
  background-image: repeating-linear-gradient(to top, #e0bd28 0 9px, #836b08 9px 12px) !important;
}

.player-orbit-screen .player-bottom-hud .shield-fill {
  background-image: repeating-linear-gradient(to top, #0094df 0 9px, #004a92 9px 12px) !important;
}

.player-orbit-screen .player-bottom-hud .stat-label {
  width: 124px !important;
  height: 43px !important;
  min-height: 43px !important;
  flex: none !important;
  border: 1px solid rgba(0, 180, 245, 0.95) !important;
  border-radius: 5px !important;
  background: linear-gradient(180deg, rgba(2, 27, 48, 0.72), rgba(0, 10, 23, 0.84)) !important;
  color: #eef9ff !important;
  box-shadow: inset 0 0 14px rgba(0, 150, 225, 0.1), 0 0 8px rgba(0, 140, 215, 0.12) !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 17px !important;
  letter-spacing: 2px !important;
  text-shadow: 0 0 8px rgba(125, 205, 255, 0.58);
}

.player-orbit-screen .player-bottom-hud .stat-label img {
  display: none !important;
}

.player-orbit-screen .player-bottom-hud .stat-label:hover {
  border-color: rgba(75, 220, 255, 1) !important;
  background: linear-gradient(180deg, rgba(2, 47, 78, 0.78), rgba(0, 14, 30, 0.88)) !important;
}

.player-orbit-screen .player-bottom-hud .ship-panel.ship-display-panel-action {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 84px !important;
  grid-template-rows: minmax(0, 118px) 28px 16px 58px !important;
  gap: 9px 18px !important;
  padding: 28px 30px 24px !important;
}

.player-orbit-screen .ship-card-main {
  grid-column: 1 / 2 !important;
  grid-row: 1 / 2 !important;
  min-height: 0 !important;
  align-self: stretch;
}

.player-orbit-screen .player-bottom-hud .active-player-ship,
.player-orbit-screen .player-bottom-hud .hud-ship-image {
  max-width: 118px !important;
  max-height: 116px !important;
  filter:
    drop-shadow(0 0 8px rgba(144, 216, 255, 0.66))
    drop-shadow(0 10px 12px rgba(0, 0, 0, 0.7)) !important;
}

.player-orbit-screen .player-bottom-hud .ship-mini-progress {
  display: contents !important;
}

.player-orbit-screen .player-bottom-hud .level-badge {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 2 !important;
  align-self: start !important;
  width: 84px !important;
  height: 72px !important;
  border: 1px solid rgba(0, 178, 238, 0.9) !important;
  border-radius: 5px !important;
  background: rgba(1, 15, 28, 0.76) !important;
  box-shadow: inset 0 0 18px rgba(0, 155, 255, 0.1) !important;
}

.player-orbit-screen .player-bottom-hud .level-badge span {
  font-size: 14px !important;
  line-height: 1 !important;
  letter-spacing: 1px;
  color: #6ae7ff !important;
}

.player-orbit-screen .player-bottom-hud .level-badge strong {
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 32px !important;
  line-height: 1.05 !important;
}

.player-orbit-screen .player-bottom-hud .xp-row {
  grid-column: 1 / 3 !important;
  grid-row: 2 / 3 !important;
  align-self: center !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  color: #d4ecff !important;
}

.player-orbit-screen .player-bottom-hud .xp-row span:first-child {
  color: #00b7ff !important;
}

.player-orbit-screen .player-bottom-hud .xp-bar {
  grid-column: 1 / 3 !important;
  grid-row: 3 / 4 !important;
  height: 12px !important;
  align-self: center;
  border: 1px solid rgba(66, 141, 192, 0.5) !important;
  border-radius: 6px !important;
  background: rgba(0, 11, 22, 0.82) !important;
}

.player-orbit-screen .player-bottom-hud .xp-fill {
  background: linear-gradient(90deg, #0096ff, #16c9ff) !important;
  box-shadow: 0 0 9px rgba(0, 166, 255, 0.7) !important;
}

.player-orbit-screen .ship-storage-strip {
  grid-column: 1 / 3 !important;
  grid-row: 4 / 5 !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button {
  height: 58px !important;
  min-height: 58px !important;
  border: 1px solid rgba(0, 178, 238, 0.92) !important;
  border-radius: 5px !important;
  background: linear-gradient(180deg, rgba(2, 26, 48, 0.72), rgba(0, 10, 22, 0.88)) !important;
  box-shadow: inset 0 0 14px rgba(0, 150, 225, 0.1), 0 0 9px rgba(0, 140, 215, 0.12) !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button span {
  display: none !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button strong {
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 20px !important;
  letter-spacing: 3px !important;
  color: #eef9ff !important;
  text-transform: uppercase;
  text-shadow: 0 0 8px rgba(125, 205, 255, 0.56);
}

.player-orbit-screen .player-bottom-hud .ship-storage-button strong::before {
  content: "INVENTORY";
}

.player-orbit-screen .player-bottom-hud .ship-storage-button strong {
  font-size: 0 !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button strong::before {
  font-size: 20px !important;
}

.player-orbit-screen .player-bottom-hud .info-panel.hud-command-console {
  display: grid !important;
  grid-template-rows: 54px minmax(0, 1fr) !important;
  gap: 0 !important;
  padding: 15px 22px 24px !important;
}

.player-orbit-screen .player-bottom-hud .info-tabs {
  position: relative;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
  height: 54px !important;
  border-bottom: 1px solid rgba(130, 194, 230, 0.44) !important;
}

.player-orbit-screen .player-bottom-hud .info-tab {
  height: 45px !important;
  min-height: 45px !important;
  padding: 0 18px !important;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #9ec9eb !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 15px !important;
  letter-spacing: 2px !important;
  text-shadow: 0 0 8px rgba(104, 180, 255, 0.45);
}

.player-orbit-screen .player-bottom-hud .info-tab img {
  display: none !important;
}

.player-orbit-screen .player-bottom-hud .info-tab.active,
.player-orbit-screen .player-bottom-hud .info-tab:hover {
  color: #ffffff !important;
  border-color: rgba(0, 183, 255, 0.95) !important;
  background: linear-gradient(180deg, rgba(2, 43, 70, 0.66), rgba(2, 14, 29, 0.26)) !important;
  box-shadow:
    inset 0 -3px 0 rgba(0, 157, 255, 0.95),
    0 0 12px rgba(0, 157, 255, 0.24) !important;
}

.player-orbit-screen .player-bottom-hud .hud-inline-panel {
  min-height: 0 !important;
  overflow: hidden !important;
}

.player-orbit-screen .player-bottom-hud .hud-inline-panel .hud-panel {
  clip-path: none !important;
  background: transparent !important;
}

.player-orbit-screen .player-bottom-hud .objectives-panel,
.player-orbit-screen .player-bottom-hud .activity-panel,
.player-orbit-screen .player-bottom-hud .comms-panel {
  padding-top: 22px !important;
}

.player-orbit-screen .player-bottom-hud .objective-panel-layout,
.player-orbit-screen .player-bottom-hud .activity-objective-block {
  height: 100% !important;
  min-height: 0 !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel-header.compact-header h3,
.player-orbit-screen .player-bottom-hud .activity-objective-block h3 {
  margin: 0 0 18px !important;
  font-family: "Arial Black", Arial, sans-serif !important;
  font-size: 19px !important;
  letter-spacing: 2px !important;
  color: #b9e2ff !important;
  text-transform: uppercase;
  text-shadow: 0 0 9px rgba(90, 178, 255, 0.76);
}

.player-orbit-screen .player-bottom-hud .objective-hud-summary,
.player-orbit-screen .player-bottom-hud .local-chat-feed,
.player-orbit-screen .player-bottom-hud .activity-log-feed {
  min-height: 118px !important;
  height: 118px !important;
  border: 1px dashed rgba(111, 174, 224, 0.48) !important;
  border-radius: 10px !important;
  background: rgba(0, 7, 17, 0.34) !important;
}

.player-orbit-screen .player-bottom-hud .objective-empty,
.player-orbit-screen .player-bottom-hud .cargo-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  color: #c6e7ff !important;
  font-size: 21px !important;
  font-weight: 400 !important;
}

@media (max-width: 1280px), (max-height: 760px) {
  .player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
    left: 20px !important;
    right: 20px !important;
    bottom: 22px !important;
    grid-template-columns: 330px 330px minmax(360px, 1fr) !important;
    gap: 14px !important;
  }

  .player-orbit-screen .player-bottom-hud .stat-label {
    width: 94px !important;
    font-size: 13px !important;
  }

  .player-orbit-screen .player-bottom-hud .stat-meter {
    width: 46px !important;
  }
}

/* ===== Player orbit HUD browser-size/action clarity fix ===== */
.space-screen.player-orbit-screen {
  height: 665px !important;
  min-height: 0 !important;
  max-height: 665px !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  grid-template-columns: 270px 220px minmax(0, 1fr) !important;
}

.player-orbit-screen .player-bottom-hud .ship-panel.ship-display-panel-action {
  grid-template-columns: minmax(0, 1fr) 50px !important;
  padding-inline: 12px !important;
}

.player-orbit-screen .player-bottom-hud #jumpBtn.stat-label {
  height: 24px !important;
  min-height: 24px !important;
  flex-basis: 24px !important;
  padding: 0 7px !important;
  border: 1px solid rgba(75, 204, 255, 0.8) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(0, 74, 126, 0.58), rgba(2, 16, 35, 0.82)) !important;
  box-shadow: inset 0 -2px 0 rgba(40, 207, 255, 0.42), 0 0 9px rgba(0, 190, 255, 0.18) !important;
  cursor: pointer;
}

.player-orbit-screen .player-bottom-hud #jumpBtn.stat-label span {
  white-space: nowrap;
  font-size: 10px;
}

.player-orbit-screen .player-bottom-hud #jumpBtn.stat-label:hover {
  border-color: rgba(107, 220, 255, 0.95) !important;
  background: linear-gradient(180deg, rgba(0, 104, 168, 0.68), rgba(2, 20, 42, 0.9)) !important;
}

/* ===== Player orbit solid stat action buttons ===== */
.player-orbit-screen .player-bottom-hud .stat-label {
  height: 24px !important;
  min-height: 24px !important;
  flex-basis: 24px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  font-size: 10px !important;
  letter-spacing: 0.7px !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.72);
}

.player-orbit-screen .player-bottom-hud .stat-label img {
  width: 12px;
  height: 12px;
  filter: brightness(1.5) drop-shadow(0 0 4px rgba(255, 255, 255, 0.35));
}

.player-orbit-screen .player-bottom-hud #jumpBtn.stat-label,
.player-orbit-screen .player-bottom-hud .jump-action {
  border-color: rgba(255, 101, 126, 0.86) !important;
  background: linear-gradient(180deg, #e2415d, #9f1930) !important;
  box-shadow: 0 0 9px rgba(226, 65, 93, 0.28), inset 0 -2px 0 rgba(80, 0, 16, 0.35) !important;
  cursor: pointer;
}

.player-orbit-screen .player-bottom-hud #jumpBtn.stat-label:hover {
  border-color: rgba(255, 141, 158, 0.95) !important;
  background: linear-gradient(180deg, #f0516b, #b11e38) !important;
  box-shadow: 0 0 12px rgba(226, 65, 93, 0.42), inset 0 -2px 0 rgba(80, 0, 16, 0.35) !important;
}

.player-orbit-screen .player-bottom-hud .hull-action {
  border-color: rgba(231, 201, 74, 0.82) !important;
  background: linear-gradient(180deg, #e7c94a, #a97912) !important;
  box-shadow: 0 0 9px rgba(231, 201, 74, 0.22), inset 0 -2px 0 rgba(78, 52, 0, 0.34) !important;
}

.player-orbit-screen .player-bottom-hud .shield-action {
  border-color: rgba(56, 174, 224, 0.84) !important;
  background: linear-gradient(180deg, #38aee0, #185faf) !important;
  box-shadow: 0 0 9px rgba(56, 174, 224, 0.24), inset 0 -2px 0 rgba(0, 29, 80, 0.34) !important;
}

/* ===== Player orbit HUD final proportion polish ===== */
.player-orbit-screen .orbit-header-trim {
  display: none;
}

.player-orbit-screen .orbit-header {
  top: 12px;
  left: 38px;
  width: 300px;
  height: 34px;
}

.player-orbit-screen .orbit-location,
.player-orbit-screen .node-name-tag.orbit-location {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  font-size: 20px !important;
  letter-spacing: 5px !important;
  text-shadow: 0 0 10px rgba(63, 190, 255, 0.82), 0 2px 6px rgba(0, 0, 0, 0.75);
}

.player-orbit-screen #planetLandBtn.clickable-planet {
  top: 58px !important;
  right: 86px !important;
  width: 124px !important;
  height: 124px !important;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  padding: 12px 18px 10px !important;
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  width: 24px !important;
  height: 92px !important;
  flex: 0 0 92px !important;
  max-height: 92px !important;
  border-radius: 7px !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  border-radius: 7px;
}

.player-orbit-screen .ship-storage-strip {
  grid-template-columns: 1fr;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button {
  height: 31px !important;
  min-height: 31px !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  height: 160px !important;
  min-height: 160px !important;
  max-height: 160px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  height: 160px !important;
  min-height: 160px !important;
  max-height: 160px !important;
}

.player-orbit-screen .player-bottom-hud .stat-col {
  gap: 4px !important;
}


/* ===== Command console HUD redesign ===== */

.command-hud.space-combat-hud {
  left: 16px;
  right: auto;
  bottom: 16px;
  width: auto;
  max-width: calc(100% - 32px);
  min-height: 166px;
  display: flex;
  align-items: stretch;
  gap: 10px;
}

.hud-command-console {
  width: 455px;
  min-height: 166px;
  max-height: 166px;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 7px;
  background: rgba(0, 0, 0, 0.74);
  border: 1px solid #3c8fc7;
  border-radius: 12px;
  padding: 10px;
  box-shadow: 0 0 18px rgba(0, 140, 255, 0.14);
}

.object-action-panel {
  display: none;
  grid-template-columns: 1fr 132px;
  gap: 10px;
  align-items: center;
  min-height: 58px;
  padding: 8px;
  border: 1px solid rgba(255, 120, 70, 0.65);
  border-radius: 10px;
  background:
    radial-gradient(circle at 0% 50%, rgba(255, 105, 60, 0.16), transparent 45%),
    rgba(35, 8, 10, 0.72);
  box-shadow: 0 0 16px rgba(255, 86, 40, 0.14);
}

.object-action-panel.visible {
  display: grid;
}

.object-action-info {
  min-width: 0;
}

.object-action-info strong {
  display: block;
  margin-bottom: 5px;
  color: #ffffff;
  font-size: 14px;
  letter-spacing: 0.5px;
}

.object-action-info span {
  color: #ffc6b6;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

.object-health-track {
  width: 100%;
  height: 7px;
  background: rgba(255,255,255,0.14);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 5px;
}

.object-health-fill {
  height: 100%;
  width: 100%;
  background: linear-gradient(90deg, #ff425b, #ffd166);
  border-radius: 999px;
  box-shadow: 0 0 10px rgba(255, 95, 68, 0.55);
  transition: width 0.2s ease;
}

.engage-action {
  min-height: 42px;
  padding: 10px 12px;
  background: linear-gradient(180deg, #e35b32, #841f22) !important;
  border: 1px solid rgba(255, 170, 90, 0.95) !important;
  box-shadow: 0 0 16px rgba(255, 90, 40, 0.34);
  color: #ffffff;
  letter-spacing: 1px;
}

.engage-action.disengage-action {
  background: linear-gradient(180deg, #9b2838, #59111c) !important;
  border: 1px solid rgba(255, 110, 126, 0.95) !important;
}

.hud-command-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.hud-command-tabs button {
  width: auto;
  min-height: 34px;
  padding: 5px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, rgba(8, 28, 55, 0.96), rgba(5, 14, 28, 0.96));
  border: 1px solid rgba(90, 190, 255, 0.62);
  border-radius: 10px;
  color: #7fdfff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.hud-command-tabs button.active,
.hud-command-tabs button.has-alert {
  border-color: rgba(127, 223, 255, 0.98);
  box-shadow: 0 0 14px rgba(89, 217, 255, 0.22);
}

.command-hud .hud-inline-panel {
  min-height: 0;
  overflow: hidden;
}


.compact-tabs-panel {
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.compact-header {
  margin-bottom: 4px;
}

.compact-header h3 {
  font-size: 14px;
}

.compact-grid {
  grid-template-columns: 1.1fr 1.1fr 0.9fr auto;
  align-items: start;
  gap: 10px;
}

.compact-collect-cell {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.activity-log-feed {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  flex-direction: column;
  gap: 6px;
  max-height: none;
  overflow-y: auto;
  padding-right: 6px;
  padding-bottom: 2px;
}

.activity-log-item {
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(110, 188, 255, 0.12);
  color: #dcecff;
  font-size: 12px;
  line-height: 1.35;
}

.activity-log-item.muted {
  color: #8ba8c9;
}

.command-hud .hud-inline-panel .hud-panel {
  display: none;
  height: 100%;
  min-width: 0;
  width: 100%;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.command-hud .hud-inline-panel .hud-panel.active {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}

.command-panel-grid {
  height: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 112px;
  gap: 10px;
  align-items: start;
}

.command-hud .hud-label {
  font-size: 10px;
  margin-bottom: 3px;
}

.command-hud .hud-text {
  min-height: 0;
  max-height: 58px;
  overflow-y: auto;
  font-size: 12px;
  line-height: 1.35;
}

.collect-cell {
  align-self: end;
}

.collect-cell button {
  min-height: 34px;
  padding: 8px 10px;
  font-size: 11px;
}

.command-hud .hud-toast-feed {
  position: static;
  width: 100%;
  display: grid;
  gap: 4px;
  margin-top: 5px;
  z-index: auto;
}

.command-hud .hud-toast {
  padding: 5px 8px;
  font-size: 11px;
}

@media (max-width: 980px) {
  .command-hud.space-combat-hud {
    flex-wrap: wrap;
  }

  .hud-command-console {
    width: min(455px, calc(100vw - 32px));
  }

  .command-panel-grid {
    grid-template-columns: 1fr 1fr;
  }
}


/* ===== Central engage/disengage button ===== */

.central-engage-panel {
  position: absolute;
  left: 50%;
  bottom: 205px;
  transform: translateX(-50%);
  z-index: 12;
  display: none;
  pointer-events: auto;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.central-engage-panel.visible {
  display: block;
}

.central-engage-panel .engage-action {
  width: 190px;
  min-height: 46px;
  padding: 10px 20px;
  border-radius: 12px;
  background: linear-gradient(180deg, #ff7a35, #9b2424) !important;
  border: 1px solid rgba(255, 190, 100, 0.95) !important;
  box-shadow:
    0 0 18px rgba(255, 90, 40, 0.45),
    inset 0 1px 0 rgba(255,255,255,0.22);
  color: #ffffff;
  font-size: 15px;
  font-weight: 950;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.central-engage-panel .engage-action:hover {
  transform: translateY(-1px);
  box-shadow:
    0 0 24px rgba(255, 90, 40, 0.62),
    inset 0 1px 0 rgba(255,255,255,0.28);
}

.central-engage-panel .engage-action.disengage-action {
  background: linear-gradient(180deg, #4fd6d1, #176a83) !important;
  border: 1px solid rgba(165, 250, 255, 0.95) !important;
  box-shadow:
    0 0 18px rgba(80, 210, 235, 0.38),
    inset 0 1px 0 rgba(255,255,255,0.22);
}

.central-engage-panel .engage-action.disengage-action:hover {
  box-shadow:
    0 0 24px rgba(80, 210, 235, 0.56),
    inset 0 1px 0 rgba(255,255,255,0.28);
}

/* Disable the old in-console object action styling if any remains */
.hud-command-console > .object-action-panel {
  display: none !important;
}


/* ===== Selective salvage collection ===== */

.sector-panel-layout {
  height: 100%;
  display: grid;
  grid-template-columns: 0.9fr 1.8fr 0.9fr;
  gap: 10px;
  min-height: 0;
}

.sector-mini-block,
.sector-salvage-block {
  min-width: 0;
  min-height: 0;
}

.salvage-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}

.collect-all-btn {
  min-height: 24px;
  padding: 4px 8px;
  width: auto;
  border-radius: 8px;
  font-size: 10px;
}

.salvage-list {
  display: grid;
  gap: 6px;
  max-height: 82px;
  overflow-y: auto;
  padding-right: 4px;
}

.salvage-row {
  display: grid;
  grid-template-columns: 26px 1fr 64px;
  align-items: center;
  gap: 7px;
  padding: 5px;
  background: rgba(7, 18, 34, 0.64);
  border: 1px solid rgba(90, 190, 255, 0.22);
  border-radius: 9px;
}

.salvage-row img {
  width: 26px;
  height: 26px;
  object-fit: contain;
  border-radius: 6px;
  background: rgba(0,0,0,0.35);
}

.salvage-row-text {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.salvage-row-text strong {
  color: #eaf3ff;
  font-size: 11px;
  line-height: 1.05;
}

.salvage-row-text span {
  color: #9fb7d7;
  font-size: 10px;
  line-height: 1.05;
}

.salvage-row button {
  min-height: 25px;
  padding: 4px 6px;
  font-size: 10px;
  border-radius: 8px;
}

.salvage-empty {
  color: #9fb7d7;
  font-size: 12px;
}

@media (max-width: 900px) {
  .sector-panel-layout {
    grid-template-columns: 1fr;
  }
}


/* ===== Modern in-HUD scrollbars ===== */
.command-hud .hud-text,
.activity-log-feed,
.salvage-list {
  scrollbar-width: thin;
  scrollbar-color: rgba(116, 219, 255, 0.92) rgba(10, 22, 40, 0.45);
}

.command-hud .hud-text::-webkit-scrollbar,
.activity-log-feed::-webkit-scrollbar,
.salvage-list::-webkit-scrollbar {
  width: 8px;
}

.command-hud .hud-text::-webkit-scrollbar-track,
.activity-log-feed::-webkit-scrollbar-track,
.salvage-list::-webkit-scrollbar-track {
  background: linear-gradient(180deg, rgba(5, 14, 28, 0.78), rgba(12, 30, 52, 0.68));
  border-radius: 999px;
  border: 1px solid rgba(79, 175, 235, 0.18);
}

.command-hud .hud-text::-webkit-scrollbar-thumb,
.activity-log-feed::-webkit-scrollbar-thumb,
.salvage-list::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(120, 225, 255, 0.95), rgba(50, 110, 220, 0.92));
  border-radius: 999px;
  border: 1px solid rgba(210, 245, 255, 0.4);
  box-shadow:
    inset 0 0 6px rgba(255,255,255,0.18),
    0 0 8px rgba(76, 177, 255, 0.22);
}

.command-hud .hud-text::-webkit-scrollbar-thumb:hover,
.activity-log-feed::-webkit-scrollbar-thumb:hover,
.salvage-list::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(145, 235, 255, 0.98), rgba(67, 133, 235, 0.96));
}


/* ===== HUD width + horizontal sector salvage refinement ===== */

/* Stretch the HUD console across the available bottom width. */
.command-hud.space-combat-hud {
  left: 16px !important;
  right: 16px !important;
  width: calc(100% - 32px) !important;
  max-width: none !important;
}

.command-hud .vertical-stats,
.command-hud .ship-display-panel {
  flex: 0 0 auto;
}

.hud-command-console {
  width: auto !important;
  flex: 1 1 auto;
  min-width: 0;
}

/* Let the active content use the full console space. */
.command-hud .hud-inline-panel {
  min-width: 0;
}

.command-hud .hud-inline-panel .hud-panel.active {
  width: 100%;
}

/* Sector view: keep minerals/cargo compact and let salvage use the horizontal space. */
.sector-panel-layout {
  grid-template-columns: 170px minmax(360px, 1fr) 130px !important;
  gap: 14px !important;
}

.sector-salvage-block {
  overflow: hidden;
}

.salvage-list {
  display: flex !important;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 7px;
  max-height: 88px !important;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 4px;
}

.salvage-row {
  flex: 0 1 188px;
  min-width: 170px;
  display: grid !important;
  grid-template-columns: 26px minmax(68px, 1fr) 58px !important;
  gap: 6px !important;
  padding: 5px 6px !important;
}

.salvage-row-text strong,
.salvage-row-text span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.salvage-row button {
  min-width: 0;
}

/* Activity log: slightly tighter so more entries fit. */
.activity-log-feed {
  gap: 3px !important;
}

.activity-log-item {
  padding-bottom: 4px !important;
  margin-bottom: 0 !important;
  line-height: 1.22 !important;
}

/* With the wider HUD, keep scrollbar modern but slimmer. */
.command-hud .hud-text::-webkit-scrollbar,
.activity-log-feed::-webkit-scrollbar,
.salvage-list::-webkit-scrollbar {
  width: 7px;
}

@media (max-width: 1100px) {
  .sector-panel-layout {
    grid-template-columns: 140px minmax(250px, 1fr) 110px !important;
  }

  .salvage-row {
    flex-basis: 172px;
  }
}

/* ===== Hostile bot target ===== */
.enemy-bot-target {
  width: 118px;
  height: 118px;
}

.enemy-bot-target img {
  filter:
    drop-shadow(0 0 14px rgba(255, 110, 90, 0.42))
    drop-shadow(0 0 24px rgba(80, 210, 235, 0.28));
}

.enemy-bot-target.selected img {
  filter:
    drop-shadow(0 0 18px rgba(255, 210, 90, 0.98))
    drop-shadow(0 0 28px rgba(255, 110, 90, 0.38));
}

.enemy-bot-target .asteroid-hp-mini {
  left: 18px;
  right: 18px;
  bottom: -10px;
  height: 6px;
}

.enemy-bot-target .asteroid-hp-mini span {
  background: linear-gradient(90deg, #ff5f6d, #ffb347);
  box-shadow: 0 0 10px rgba(255, 95, 109, 0.28);
}


/* ===== Selection refinement + hostile bot combat ===== */

.asteroid-target.selected img {
  filter:
    drop-shadow(0 0 4px rgba(127, 223, 255, 0.55))
    drop-shadow(0 0 8px rgba(127, 223, 255, 0.22)) !important;
}

.asteroid-target.selected::after {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(127, 223, 255, 0.72);
  border-radius: 999px;
  pointer-events: none;
}

.asteroid-target.engaged::after {
  border-color: rgba(255, 176, 76, 0.9);
  box-shadow: 0 0 10px rgba(255, 136, 36, 0.24);
}

.enemy-bot-target {
  width: 112px;
  height: 112px;
}

.enemy-bot-target.selected img {
  filter:
    drop-shadow(0 0 5px rgba(127, 223, 255, 0.55))
    drop-shadow(0 0 10px rgba(255, 110, 90, 0.20)) !important;
}


/* ===== Enemy incoming fire + repair panel ===== */

.enemy-incoming-laser {
  height: 5px;
  background: linear-gradient(90deg, rgba(255, 66, 82, 0.05), rgba(255, 87, 66, 1), rgba(255, 202, 92, 0.85), rgba(255, 87, 66, 0.05));
  box-shadow:
    0 0 8px rgba(255, 87, 66, 0.98),
    0 0 18px rgba(255, 87, 66, 0.62),
    0 0 32px rgba(255, 170, 60, 0.32);
  transform-origin: left center;
  animation: incomingLaserBurst 520ms ease-out forwards;
}

@keyframes incomingLaserBurst {
  0% {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
  }

  18% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }

  100% {
    opacity: 0;
    clip-path: inset(0 0 0 100%);
  }
}

.incoming-hit-flash::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 13;
  background:
    radial-gradient(circle at 50% 88%, rgba(255, 96, 72, 0.28), transparent 28%),
    linear-gradient(180deg, transparent 0%, rgba(255, 72, 72, 0.10) 100%);
  animation: pilotHitFlash 360ms ease-out forwards;
}

@keyframes pilotHitFlash {
  0% { opacity: 0; }
  28% { opacity: 1; }
  100% { opacity: 0; }
}

.hud-hit-flash {
  animation: hudHitFlash 360ms ease-out forwards;
}

@keyframes hudHitFlash {
  0% {
    box-shadow: 0 0 0 rgba(255, 95, 80, 0);
  }

  25% {
    box-shadow:
      0 0 18px rgba(255, 95, 80, 0.78),
      inset 0 0 20px rgba(255, 95, 80, 0.18);
  }

  100% {
    box-shadow: 0 0 0 rgba(255, 95, 80, 0);
  }
}

.repair-panel {
  display: grid;
  gap: 5px;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid rgba(90, 190, 255, 0.5);
  border-radius: 10px;
  background:
    radial-gradient(circle at 0% 0%, rgba(90, 190, 255, 0.12), transparent 45%),
    rgba(4, 12, 24, 0.62);
}

.repair-panel strong {
  color: #7fdfff;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.repair-panel span {
  font-size: 13px;
  color: #d9e6ff;
}

.repair-panel button {
  min-height: 34px;
  margin-top: 4px;
  border-radius: 9px;
}

/* ===== Prestige Hangar Overview ===== */
.hangar-prestige {
  padding: 20px 24px 24px;
  background:
    radial-gradient(circle at 50% 42%, rgba(127, 223, 255, 0.12), transparent 30%),
    radial-gradient(circle at 15% 20%, rgba(205, 164, 92, 0.08), transparent 26%),
    linear-gradient(to bottom, rgba(2,5,11,0.88), rgba(2,5,11,0.97)),
    url("asteron-prime-space-station-hub.png");
  background-size: cover;
  background-position: center;
}

.prestige-header {
  margin-bottom: 12px;
  align-items: center;
}

.prestige-header h2 {
  font-size: 40px;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 5px;
}

.hangar-subtitle {
  display: block;
  margin-top: 6px;
  color: #b7d5e8;
  font-size: 13px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.prestige-tabs {
  gap: 8px;
  margin-bottom: 12px;
}

.prestige-tabs button {
  min-width: 0;
  flex: 1 1 0;
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 10px;
  font-size: 12px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.hangar-prestige .hangar-section {
  height: calc(100% - 118px);
}

.hangar-showcase-grid {
  height: 100%;
  display: grid;
  grid-template-columns: 260px 1fr 300px;
  gap: 14px;
  min-height: 0;
}

.hangar-info-panel,
.hangar-hero-stage {
  min-height: 0;
  background:
    linear-gradient(135deg, rgba(13, 28, 42, 0.88), rgba(2, 8, 16, 0.88)),
    rgba(0,0,0,0.65);
  border: 1px solid rgba(127, 223, 255, 0.52);
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(210, 245, 255, 0.08),
    0 0 28px rgba(0, 160, 255, 0.08);
}

.hangar-info-panel {
  padding: 16px;
  overflow: hidden;
}

.panel-kicker {
  color: #7fdfff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 9px;
}

.hangar-info-panel h3 {
  margin: 0 0 14px;
  font-size: 24px;
  letter-spacing: 1px;
}

.overview-stat-grid {
  display: grid;
  gap: 8px;
}

.overview-stat-grid div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(127, 223, 255, 0.12);
}

.overview-stat-grid span,
.overview-loadout-row span,
.repair-hero-card small {
  color: #9fb7d7;
  font-size: 12px;
}

.overview-stat-grid strong {
  color: #f2f7ff;
  text-align: right;
  font-size: 13px;
}

.hangar-hero-stage {
  position: relative;
  display: grid;
  grid-template-rows: 1fr auto;
  align-items: center;
  justify-items: center;
  overflow: hidden;
  padding: 18px;
}

.hangar-hero-stage::before {
  content: "";
  position: absolute;
  inset: 20px;
  border: 1px solid rgba(205, 164, 92, 0.18);
  border-radius: 20px;
  pointer-events: none;
}

.hero-frame {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-glow-ring {
  position: absolute;
  width: min(72%, 470px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(127, 223, 255, 0.16);
  box-shadow:
    0 0 70px rgba(127, 223, 255, 0.08),
    inset 0 0 55px rgba(127, 223, 255, 0.05);
}

.hero-frame img {
  position: relative;
  max-width: min(82%, 520px);
  max-height: 395px;
  object-fit: contain;
  filter:
    drop-shadow(0 0 18px rgba(127, 223, 255, 0.22))
    drop-shadow(0 22px 28px rgba(0,0,0,0.75));
}

.hero-nameplate {
  min-width: 270px;
  padding: 10px 28px;
  text-align: center;
  border: 1px solid rgba(205, 164, 92, 0.45);
  border-radius: 12px;
  background: rgba(2, 8, 16, 0.72);
  box-shadow: 0 0 18px rgba(205, 164, 92, 0.10);
}

.hero-nameplate span {
  display: block;
  color: #9fb7d7;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.hero-nameplate strong {
  display: block;
  color: #7fdfff;
  font-size: 25px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.hangar-systems-panel {
  display: grid;
  grid-template-rows: auto 1fr auto auto;
  gap: 10px;
}

.overview-loadout {
  min-height: 0;
  overflow-y: auto;
  padding-right: 4px;
}

.overview-block-title {
  margin: 10px 0 6px;
  color: #7fdfff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.overview-loadout-row {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 10px;
  align-items: center;
  margin-bottom: 8px;
  padding: 8px;
  border: 1px solid rgba(127, 223, 255, 0.16);
  border-radius: 10px;
  background: rgba(5, 14, 28, 0.56);
}

.overview-loadout-row img {
  width: 44px;
  height: 34px;
  object-fit: contain;
  background: rgba(0,0,0,0.36);
  border-radius: 8px;
}

.overview-loadout-row strong {
  display: block;
  color: #f2f7ff;
  font-size: 13px;
}

.overview-empty {
  color: #8ba8c9;
  padding: 8px;
  border: 1px dashed rgba(127, 223, 255, 0.22);
  border-radius: 10px;
  font-size: 12px;
}

.repair-hero-card {
  display: grid;
  grid-template-columns: 1fr 120px;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border-radius: 13px;
  border: 1px solid rgba(127, 223, 255, 0.35);
  background: rgba(5, 14, 28, 0.72);
}

.repair-hero-card.needs-repair {
  border-color: rgba(255, 176, 76, 0.65);
  box-shadow: 0 0 18px rgba(255, 136, 36, 0.08);
}

.repair-hero-card span {
  display: block;
  color: #7fdfff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.repair-hero-card strong {
  display: block;
  color: #ffffff;
  font-size: 18px;
  margin: 2px 0;
}

.repair-hero-card button {
  min-height: 38px;
  padding: 8px 10px;
}

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

.overview-actions button {
  min-height: 36px;
  padding: 8px 10px;
  font-size: 12px;
}

@media (max-width: 980px) {
  .hangar-showcase-grid {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .hero-frame img {
    max-height: 300px;
  }

  .hangar-prestige .hangar-section {
    overflow-y: auto;
  }
}


/* ===== Hangar refinement: simplified navigation + showcase cleanup ===== */

.simplified-hangar-tabs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.simplified-hangar-tabs button {
  min-width: 0;
}

.refined-hangar-grid {
  grid-template-columns: 260px minmax(420px, 1fr) 300px;
}

.hangar-repair-panel {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.hangar-repair-panel .overview-repair {
  margin-top: 6px;
}

.hangar-repair-panel .repair-hero-card {
  grid-template-columns: 1fr;
  gap: 14px;
  min-height: 190px;
  align-content: center;
}

.hangar-repair-panel .repair-hero-card button {
  min-height: 44px;
  font-size: 14px;
}

.refined-nameplate {
  position: relative;
  z-index: 2;
  margin-top: -2px;
  transform: translateY(-6px);
  min-width: 300px;
  padding: 8px 26px;
}

.refined-nameplate strong {
  font-size: 22px;
}

.hangar-hero-stage {
  grid-template-rows: minmax(0, 1fr) auto;
}

.hero-frame img {
  max-height: 365px;
}

.hangar-prestige .overview-stat-grid div:nth-last-child(-n+2) {
  border-bottom-color: rgba(127, 223, 255, 0.16);
}

/* Unified store */

.hangar-store-layout {
  height: calc(100% - 58px);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  min-height: 0;
}

.store-category-panel {
  min-height: 0;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 10px;
  padding: 14px;
  background:
    radial-gradient(circle at 12% 20%, rgba(80, 180, 255, 0.08), transparent 32%),
    rgba(0,0,0,0.62);
  border: 1px solid rgba(60,143,199,0.9);
  border-radius: 14px;
}

.store-category-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(127, 223, 255, 0.14);
}

.store-category-header span {
  color: #7fdfff;
  font-weight: 900;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.store-category-header small {
  color: #9fb7d7;
}

.store-list {
  max-height: none !important;
  overflow-y: auto;
  padding-right: 6px;
}

.hangar-store-layout .hangar-ship-card,
.hangar-store-layout .equipment-card {
  grid-template-columns: 74px 1fr;
  gap: 10px;
  padding: 10px;
}

.hangar-store-layout .hangar-ship-card img,
.hangar-store-layout .equipment-card img {
  width: 74px;
  height: 60px;
}

.hangar-store-layout .hangar-card-actions,
.hangar-store-layout .equipment-card-actions {
  grid-column: 1 / -1;
  min-width: 0;
}

.hangar-store-layout .hangar-card-actions button,
.hangar-store-layout .equipment-card-actions button {
  width: 100%;
}

.hangar-store-layout .hangar-ship-card h4,
.hangar-store-layout .equipment-card h4 {
  font-size: 15px;
}

.hangar-store-layout .hangar-ship-card p,
.hangar-store-layout .equipment-card p {
  font-size: 12px;
}

@media (max-width: 980px) {
  .refined-hangar-grid,
  .hangar-store-layout {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .simplified-hangar-tabs {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* ===== Expanded 30-node sector map polish ===== */

.svg-route.hostile-route {
  stroke: rgba(255, 121, 78, 0.34);
}

.svg-route.available.hostile-route {
  stroke: rgba(255, 135, 75, 0.95);
  filter: drop-shadow(0 0 2px rgba(255, 95, 50, 0.75));
}

.svg-space-node.safe {
  fill: #dff8ff;
  filter: drop-shadow(0 0 2px rgba(210, 245, 255, 0.95));
}

.svg-space-node.hostile {
  fill: #ff9a58;
  filter: drop-shadow(0 0 2px rgba(255, 95, 50, 0.95));
}

.svg-space-node.locked {
  opacity: 0.28;
}

.svg-planet-label {
  font-size: 1.85px;
}

.sector-svg {
  transform: scale(1.03);
}


/* ===== Epic sector map structure inspired by generated concept ===== */

.sector-map {
  background:
    linear-gradient(180deg, rgba(2, 7, 16, 0.62), rgba(2, 6, 14, 0.88)),
    radial-gradient(circle at 22% 50%, rgba(45, 145, 255, 0.16), transparent 22%),
    radial-gradient(circle at 50% 42%, rgba(120, 75, 255, 0.13), transparent 23%),
    radial-gradient(circle at 82% 50%, rgba(255, 120, 45, 0.16), transparent 23%),
    radial-gradient(circle at 84% 84%, rgba(90, 255, 150, 0.11), transparent 16%),
    url("cosmic_nebula_in_deep_space.png") !important;
  background-size: cover !important;
  background-position: center !important;
}

.sector-svg {
  transform: scale(1.02);
}

.svg-route {
  stroke-width: 0.22;
  stroke-linecap: round;
  opacity: 0.88;
}

.svg-route.safe-route {
  stroke: rgba(95, 190, 255, 0.62);
  filter: drop-shadow(0 0 1.4px rgba(90, 195, 255, 0.36));
}

.svg-route.mining-route {
  stroke: rgba(112, 255, 173, 0.46);
  filter: drop-shadow(0 0 1.4px rgba(112, 255, 173, 0.32));
}

.svg-route.loot-route {
  stroke: rgba(186, 113, 255, 0.52);
  filter: drop-shadow(0 0 1.4px rgba(186, 113, 255, 0.36));
}

.svg-route.risky-route,
.svg-route.combat-route,
.svg-route.hostile-route {
  stroke: rgba(255, 130, 61, 0.55);
  filter: drop-shadow(0 0 1.6px rgba(255, 105, 45, 0.42));
}

.svg-route.available {
  stroke-width: 0.34;
  opacity: 1;
}

.svg-route.available.safe-route {
  stroke: rgba(127, 223, 255, 1);
  filter: drop-shadow(0 0 3px rgba(127, 223, 255, 0.95));
}

.svg-route.available.mining-route {
  stroke: rgba(150, 255, 180, 1);
  filter: drop-shadow(0 0 3px rgba(105, 255, 165, 0.8));
}

.svg-route.available.loot-route {
  stroke: rgba(210, 145, 255, 1);
  filter: drop-shadow(0 0 3px rgba(190, 115, 255, 0.9));
}

.svg-route.available.risky-route,
.svg-route.available.combat-route,
.svg-route.available.hostile-route {
  stroke: rgba(255, 150, 82, 1);
  filter: drop-shadow(0 0 3px rgba(255, 105, 45, 0.92));
}

.svg-space-node {
  stroke-width: 0.18;
  stroke: rgba(255,255,255,0.72);
}

.svg-space-node.safe {
  fill: #bfeeff;
  filter: drop-shadow(0 0 2.8px rgba(90, 195, 255, 0.95));
}

.svg-space-node.mining {
  fill: #a4ffbc;
  filter: drop-shadow(0 0 2.8px rgba(112, 255, 173, 0.95));
}

.svg-space-node.loot {
  fill: #d39aff;
  filter: drop-shadow(0 0 2.8px rgba(186, 113, 255, 0.95));
}

.svg-space-node.risky,
.svg-space-node.combat,
.svg-space-node.hostile {
  fill: #ff9a58;
  filter: drop-shadow(0 0 2.8px rgba(255, 105, 45, 0.95));
}

.svg-space-node.locked {
  opacity: 0.32;
}

.svg-planet-ring {
  stroke-width: 0.34;
  filter: drop-shadow(0 0 2.4px rgba(127, 223, 255, 0.62));
}

.svg-current-ring {
  stroke-width: 0.52;
  filter: drop-shadow(0 0 4px rgba(0, 208, 132, 0.98));
}

.svg-planet-label {
  font-size: 2px;
  font-weight: 800;
  letter-spacing: 0.24px;
}

.svg-zone-label {
  pointer-events: none;
  text-anchor: middle;
  dominant-baseline: middle;
  paint-order: stroke;
  stroke: rgba(0, 0, 0, 0.9);
  stroke-width: 0.5px;
  stroke-linejoin: round;
}

.svg-zone-icon {
  font-size: 3.0px;
  font-weight: 900;
}

.svg-zone-name {
  font-size: 1.9px;
  font-weight: 900;
  letter-spacing: 0.35px;
}

.svg-zone-subtitle {
  font-size: 1.35px;
  font-weight: 800;
  letter-spacing: 0.22px;
}

.zone-mining {
  fill: #8fffc4;
}

.zone-loot {
  fill: #d196ff;
}

.zone-risky,
.zone-combat {
  fill: #ff8d4c;
}

@media (max-width: 900px) {
  .svg-zone-name { font-size: 1.55px; }
  .svg-zone-subtitle { font-size: 1.1px; }
}


/* ===== Local chat HUD ===== */

.comms-panel {
  min-height: 0;
}

.local-chat-feed {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 6px 6px 4px 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.chat-line {
  color: #dcecff;
  font-size: 12px;
  line-height: 1.25;
  padding: 3px 0;
  border-bottom: 1px solid rgba(127, 223, 255, 0.08);
}

.chat-line strong {
  color: #7fdfff;
}

.chat-line.system {
  color: #9fb7d7;
  font-style: italic;
}

.chat-line.system strong {
  color: #9fb7d7;
}

.local-chat-input-row {
  display: grid;
  grid-template-columns: 1fr 76px;
  gap: 8px;
  margin-top: 6px;
}

.local-chat-input-row input {
  min-height: 32px;
  border-radius: 9px;
  border: 1px solid rgba(90, 190, 255, 0.55);
  background: rgba(5, 14, 28, 0.82);
  color: #eaf3ff;
  padding: 0 10px;
  outline: none;
}

.local-chat-input-row input:focus {
  border-color: rgba(127, 223, 255, 0.95);
  box-shadow: 0 0 10px rgba(54, 177, 255, 0.18);
}

.local-chat-input-row button {
  min-height: 32px;
  border-radius: 9px;
  font-size: 11px;
}

.local-chat-feed::-webkit-scrollbar {
  width: 7px;
}

.local-chat-feed::-webkit-scrollbar-track {
  background: rgba(10, 22, 40, 0.45);
  border-radius: 999px;
}

.local-chat-feed::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(120, 225, 255, 0.95), rgba(50, 110, 220, 0.92));
  border-radius: 999px;
}


/* ===== Cargo / inventory foundation and salvage overflow fix ===== */

.command-hud.space-combat-hud {
  align-items: flex-end;
}

.hud-command-console {
  max-height: 166px;
  overflow: hidden;
}

.command-hud .hud-inline-panel,
.command-hud .hud-inline-panel .hud-panel.active {
  overflow: hidden;
}

.sector-panel-layout {
  grid-template-columns: minmax(145px, 0.85fr) minmax(280px, 2.1fr) minmax(120px, 0.65fr) !important;
  align-items: stretch;
}

.sector-salvage-block {
  min-height: 0;
  overflow: hidden;
}

.salvage-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 6px;
  max-height: 76px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: 5px;
  align-content: start;
}

.salvage-resource-chip {
  min-width: 0;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) 58px;
  align-items: center;
  gap: 6px;
  padding: 4px 5px;
  background:
    radial-gradient(circle at 0% 50%, rgba(80, 180, 255, 0.10), transparent 48%),
    rgba(7, 18, 34, 0.68);
  border: 1px solid rgba(90, 190, 255, 0.24);
  border-radius: 9px;
}

.salvage-resource-chip img {
  width: 26px;
  height: 26px;
  object-fit: contain;
  border-radius: 6px;
  background: rgba(0,0,0,0.35);
}

.salvage-resource-chip strong,
.salvage-resource-chip span {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.salvage-resource-chip strong {
  color: #eaf3ff;
  font-size: 11px;
  line-height: 1.05;
}

.salvage-resource-chip span {
  color: #9fb7d7;
  font-size: 10px;
  line-height: 1.05;
}

.salvage-resource-chip button {
  min-height: 24px;
  padding: 3px 5px;
  font-size: 10px;
  border-radius: 8px;
}

/* Inventory HUD */

.inventory-hud {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 6px;
}

.inventory-hud-top {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 10px;
}

.inventory-hud-top strong {
  display: block;
  color: #eaf3ff;
  font-size: 13px;
  margin-top: 2px;
}

.inventory-future-note {
  color: #9fb7d7;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.7px;
}

.cargo-inventory-grid {
  min-height: 0;
  overflow-y: auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 7px;
  padding-right: 5px;
  align-content: start;
}

.cargo-resource-card {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  padding: 5px 6px;
  border: 1px solid rgba(90, 190, 255, 0.24);
  border-radius: 10px;
  background:
    radial-gradient(circle at 0% 50%, rgba(80, 180, 255, 0.10), transparent 44%),
    rgba(7, 18, 34, 0.66);
}

.cargo-resource-card img {
  width: 30px;
  height: 30px;
  object-fit: contain;
  border-radius: 7px;
  background: rgba(0,0,0,0.36);
}

.cargo-resource-info {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.cargo-resource-info strong,
.cargo-resource-info span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cargo-resource-info strong {
  color: #eaf3ff;
  font-size: 11px;
}

.cargo-resource-info span {
  color: #9fb7d7;
  font-size: 10px;
}

.cargo-resource-actions {
  display: flex;
  gap: 4px;
  flex-wrap: nowrap;
}

.cargo-resource-actions button {
  min-height: 24px;
  padding: 3px 6px;
  font-size: 9px;
  border-radius: 8px;
  white-space: nowrap;
}

.cargo-resource-actions button:last-child {
  border-color: rgba(255, 120, 90, 0.7);
  color: #ffd5cc;
}

.cargo-empty {
  color: #9fb7d7;
  font-size: 12px;
  padding: 6px 0;
}

.cargo-inventory-grid,
.salvage-list {
  scrollbar-width: thin;
  scrollbar-color: rgba(116, 219, 255, 0.92) rgba(10, 22, 40, 0.45);
}

.cargo-inventory-grid::-webkit-scrollbar {
  width: 7px;
}

.cargo-inventory-grid::-webkit-scrollbar-track {
  background: rgba(10, 22, 40, 0.45);
  border-radius: 999px;
}

.cargo-inventory-grid::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(120, 225, 255, 0.95), rgba(50, 110, 220, 0.92));
  border-radius: 999px;
}

@media (max-width: 1100px) {
  .sector-panel-layout {
    grid-template-columns: 130px minmax(240px, 1fr) 110px !important;
  }

  .cargo-inventory-grid {
    grid-template-columns: 1fr;
  }
}


/* ===== Simplified sector HUD salvage layout ===== */

.simplified-sector-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 142px !important;
  gap: 12px !important;
  height: 100%;
  min-height: 0;
  align-items: stretch;
}

.simplified-sector-layout .sector-salvage-block {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr;
}

.simplified-sector-layout .salvage-header-row {
  margin-bottom: 5px;
}

.simplified-sector-layout .salvage-list {
  display: flex !important;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 8px;
  max-height: 82px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 0 4px 6px 0;
  align-items: stretch;
}

.simplified-sector-layout .salvage-resource-chip {
  flex: 0 0 178px;
  min-width: 178px;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 4px 7px;
  padding: 6px 7px;
}

.simplified-sector-layout .salvage-resource-chip img {
  grid-row: 1 / 3;
  width: 28px;
  height: 28px;
}

.simplified-sector-layout .salvage-resource-chip button {
  grid-column: 2;
  width: 100%;
  min-height: 24px;
  padding: 3px 6px;
}

.simplified-sector-layout .salvage-empty {
  align-self: center;
  color: #9fb7d7;
  font-size: 12px;
  padding: 6px 0;
}

.sector-cargo-block {
  min-width: 0;
  padding-left: 8px;
  border-left: 1px solid rgba(127, 223, 255, 0.15);
}

.sector-cargo-block .hud-text {
  max-height: none !important;
  overflow: hidden !important;
  font-size: 12px;
  line-height: 1.35;
}

/* horizontal sci-fi scrollbar for salvage */
.simplified-sector-layout .salvage-list::-webkit-scrollbar {
  height: 7px;
  width: 7px;
}

.simplified-sector-layout .salvage-list::-webkit-scrollbar-track {
  background: rgba(10, 22, 40, 0.45);
  border-radius: 999px;
}

.simplified-sector-layout .salvage-list::-webkit-scrollbar-thumb {
  background: linear-gradient(90deg, rgba(120, 225, 255, 0.95), rgba(50, 110, 220, 0.92));
  border-radius: 999px;
}

@media (max-width: 980px) {
  .simplified-sector-layout {
    grid-template-columns: 1fr !important;
  }

  .sector-cargo-block {
    display: none;
  }
}


/* ===== Ultra-compact sector salvage grid - no scrolling needed ===== */

.simplified-sector-layout {
  grid-template-columns: minmax(0, 1fr) 112px !important;
  gap: 10px !important;
}

.simplified-sector-layout .salvage-header-row {
  min-height: 24px;
  margin-bottom: 3px;
}

.simplified-sector-layout .hud-label {
  font-size: 10px;
  letter-spacing: 1px;
}

.simplified-sector-layout .collect-all-btn {
  min-height: 26px;
  padding: 4px 10px;
  font-size: 10px;
  border-radius: 8px;
}

.simplified-sector-layout .salvage-list {
  display: grid !important;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  grid-auto-rows: 58px;
  gap: 6px;
  max-height: 62px !important;
  min-height: 62px;
  overflow: hidden !important;
  padding: 0 !important;
  align-content: start;
}

.simplified-sector-layout .salvage-resource-chip {
  display: none !important;
}

.salvage-compact-card {
  min-width: 0;
  width: 100%;
  height: 58px;
  padding: 4px 3px;
  display: grid;
  grid-template-rows: 25px 12px 12px;
  justify-items: center;
  align-items: center;
  gap: 1px;
  border-radius: 10px;
  border: 1px solid rgba(90, 190, 255, 0.28);
  background:
    radial-gradient(circle at 50% 12%, rgba(80, 190, 255, 0.16), transparent 44%),
    linear-gradient(180deg, rgba(7, 21, 42, 0.84), rgba(4, 12, 24, 0.78));
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.025),
    0 0 10px rgba(0, 120, 255, 0.08);
  color: #eaf3ff;
  cursor: pointer;
}

.salvage-compact-card:hover {
  transform: translateY(-1px);
  border-color: rgba(127, 223, 255, 0.85);
  box-shadow:
    inset 0 0 10px rgba(127, 223, 255, 0.08),
    0 0 12px rgba(0, 150, 255, 0.20);
}

.salvage-compact-card img {
  width: 25px;
  height: 25px;
  object-fit: contain;
  border-radius: 6px;
  background: rgba(255,255,255,0.92);
}

.salvage-compact-card strong {
  max-width: 100%;
  color: #eaf3ff;
  font-size: 9px;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.salvage-compact-card span {
  color: #7fdfff;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}

.sector-cargo-block {
  padding-left: 8px;
}

.sector-cargo-block .hud-text {
  font-size: 11px;
}

@media (max-width: 1180px) {
  .simplified-sector-layout .salvage-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-auto-rows: 30px;
    max-height: 64px !important;
    min-height: 64px;
  }

  .salvage-compact-card {
    height: 30px;
    grid-template-columns: 20px minmax(0, 1fr) auto;
    grid-template-rows: 1fr;
    gap: 4px;
    padding: 3px 5px;
  }

  .salvage-compact-card img {
    width: 20px;
    height: 20px;
  }

  .salvage-compact-card strong {
    justify-self: start;
  }

  .salvage-compact-card span {
    justify-self: end;
  }
}


/* ===== Sector HUD: move Collect All under Cargo to free salvage space ===== */

.simplified-sector-layout {
  grid-template-columns: minmax(0, 1fr) 126px !important;
  gap: 10px !important;
}

.simplified-sector-layout .sector-cargo-block {
  display: grid;
  grid-template-rows: auto auto auto;
  align-content: start;
  gap: 4px;
  padding-left: 8px;
}

.simplified-sector-layout .salvage-header-row {
  display: block;
  min-height: 18px;
  margin-bottom: 4px;
}

.simplified-sector-layout .salvage-header-row .collect-all-btn {
  position: absolute;
  right: 8px;
  top: 54px;
  width: 112px;
  min-height: 28px;
  z-index: 3;
}

/* Reserve the right rail for cargo/collect-all, leaving the salvage cards cleaner. */
.simplified-sector-layout .salvage-list {
  padding-right: 0 !important;
}

@media (max-width: 980px) {
  .simplified-sector-layout .salvage-header-row .collect-all-btn {
    position: static;
    margin-top: 5px;
    width: auto;
  }
}


/* ===== Inventory overhaul: auto-looted bot items + compact resource cards ===== */
.inventory-overhaul-hud {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.inventory-top-split {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: end;
}

.inventory-subheader-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

.inventory-subtle-note {
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(178, 222, 255, 0.72);
}

.inventory-section-block {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.inventory-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  max-height: 170px;
  overflow-y: auto;
  padding-right: 4px;
}

.inventory-item-card {
  position: relative;
  min-height: 116px;
  padding: 10px 8px 8px;
  border-radius: 14px;
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
  align-content: start;
  gap: 5px;
  text-align: center;
  background: linear-gradient(180deg, rgba(8, 24, 48, 0.98), rgba(3, 13, 28, 0.98));
  border: 1px solid rgba(90, 195, 255, 0.22);
  box-shadow: inset 0 0 18px rgba(44, 110, 187, 0.12);
}

.inventory-item-frame {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 50% 35%, rgba(23, 53, 90, 0.95), rgba(7, 16, 31, 0.98));
  border: 2px solid rgba(126, 172, 219, 0.34);
  box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.42);
}

.inventory-item-image {
  width: 38px;
  height: 38px;
  object-fit: contain;
  display: block;
}

.inventory-item-name {
  width: 100%;
  min-height: 28px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.15;
  color: #f4fbff;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.inventory-item-meta {
  font-size: 10px;
  line-height: 1.2;
  color: rgba(189, 224, 248, 0.82);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.inventory-item-count {
  position: absolute;
  top: 6px;
  right: 8px;
  min-width: 28px;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  color: #dff6ff;
  background: rgba(4, 20, 38, 0.88);
  border: 1px solid rgba(112, 188, 255, 0.25);
}

.inventory-item-card.quality-standard,
.inventory-item-frame.quality-standard {
  border-color: rgba(121, 176, 217, 0.28);
}

.inventory-item-card.quality-unique,
.inventory-item-frame.quality-unique {
  border-color: rgba(80, 198, 255, 0.42);
  box-shadow: 0 0 14px rgba(80, 198, 255, 0.12), inset 0 0 18px rgba(44, 110, 187, 0.12);
}

.inventory-item-card.quality-advanced,
.inventory-item-frame.quality-advanced {
  border-color: rgba(125, 133, 255, 0.5);
  box-shadow: 0 0 14px rgba(125, 133, 255, 0.15), inset 0 0 18px rgba(44, 110, 187, 0.12);
}

.inventory-item-card.quality-elite,
.inventory-item-frame.quality-elite {
  border-color: rgba(185, 98, 255, 0.62);
  box-shadow: 0 0 16px rgba(185, 98, 255, 0.18), inset 0 0 18px rgba(44, 110, 187, 0.12);
}

.inventory-item-card.quality-legendary,
.inventory-item-frame.quality-legendary {
  border-color: rgba(255, 165, 74, 0.74);
  box-shadow: 0 0 18px rgba(255, 165, 74, 0.22), inset 0 0 18px rgba(44, 110, 187, 0.12);
}

.inventory-item-card.quality-godlike,
.inventory-item-frame.quality-godlike {
  border-color: rgba(255, 92, 150, 0.82);
  box-shadow: 0 0 20px rgba(255, 92, 150, 0.26), 0 0 28px rgba(255, 166, 61, 0.16), inset 0 0 18px rgba(44, 110, 187, 0.12);
}

.inventory-item-card.quality-godlike {
  animation: godlikeItemPulse 1.8s ease-in-out infinite;
}

@keyframes godlikeItemPulse {
  0%, 100% {
    box-shadow: 0 0 20px rgba(255, 92, 150, 0.22), 0 0 28px rgba(255, 166, 61, 0.12), inset 0 0 18px rgba(44, 110, 187, 0.12);
  }
  50% {
    box-shadow: 0 0 24px rgba(255, 92, 150, 0.34), 0 0 34px rgba(255, 166, 61, 0.2), inset 0 0 18px rgba(44, 110, 187, 0.12);
  }
}

.inventory-resource-section .cargo-inventory-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
  max-height: 132px;
  overflow-y: auto;
  padding-right: 4px;
}

.compact-resource-card {
  padding: 8px 10px;
  min-height: 66px;
  border-radius: 12px;
  display: grid;
  grid-template-columns: 42px 1fr;
  grid-template-areas:
    "icon info"
    "actions actions";
  align-items: center;
  gap: 7px 10px;
}

.compact-resource-card img {
  grid-area: icon;
  width: 38px;
  height: 38px;
}

.compact-resource-card .cargo-resource-info {
  grid-area: info;
}

.compact-resource-card .compact-actions {
  grid-area: actions;
  display: flex;
  gap: 6px;
}

.compact-resource-card .compact-actions button {
  flex: 1;
  padding: 6px 8px;
  font-size: 11px;
}

@media (max-width: 920px) {
  .inventory-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 780px) {
  .inventory-top-split {
    grid-template-columns: 1fr;
  }

  .inventory-subheader-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .inventory-card-grid,
  .inventory-resource-section .cargo-inventory-grid {
    grid-template-columns: 1fr;
  }
}


/* ===== Minimal inventory panel refinement ===== */
.inventory-panel-minimal {
  padding: 10px 10px 12px;
}

.inventory-hud-minimal {
  gap: 0;
  min-height: 100%;
}

.inventory-card-grid-minimal {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  gap: 10px;
  align-content: start;
  max-height: 156px;
  overflow-y: auto;
  padding-right: 6px;
}

.inventory-item-card-minimal {
  min-height: 92px;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(8, 24, 48, 0.98), rgba(3, 13, 28, 0.98));
}

.inventory-item-frame-minimal {
  width: 58px;
  height: 58px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.inventory-item-image-minimal {
  width: 42px;
  height: 42px;
  object-fit: contain;
  display: block;
}

.inventory-item-card-minimal .inventory-item-count {
  top: 6px;
  right: 6px;
  min-width: 26px;
  padding: 2px 6px;
  font-size: 11px;
}

.inventory-card-grid-minimal .cargo-empty {
  grid-column: 1 / -1;
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 820px) {
  .inventory-card-grid-minimal {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .inventory-card-grid-minimal {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}


/* ===== Smaller inventory icons + quality corner accents ===== */

.inventory-card-grid-minimal {
  grid-template-columns: repeat(auto-fit, minmax(66px, 1fr)) !important;
  gap: 7px !important;
  max-height: 158px !important;
  padding-right: 5px !important;
}

.inventory-item-card-minimal {
  min-height: 68px !important;
  height: 68px !important;
  padding: 6px !important;
  border-radius: 11px !important;
  overflow: hidden;
}

.inventory-item-frame-minimal {
  width: 44px !important;
  height: 44px !important;
  border-radius: 10px !important;
  border-width: 2px !important;
}

.inventory-item-image-minimal {
  width: 32px !important;
  height: 32px !important;
}

.inventory-item-card-minimal .inventory-item-count {
  top: 3px !important;
  right: 4px !important;
  min-width: 20px !important;
  padding: 1px 5px !important;
  font-size: 9px !important;
  line-height: 14px !important;
  z-index: 4;
}

/* Corner quality brackets - gives the old-school rare item frame feel without baking it into the PNG. */
.quality-corner {
  position: absolute;
  width: 15px;
  height: 15px;
  pointer-events: none;
  z-index: 3;
  opacity: 0.95;
}

.quality-corner-tl {
  top: 4px;
  left: 4px;
  border-top: 2px solid currentColor;
  border-left: 2px solid currentColor;
  border-top-left-radius: 8px;
}

.quality-corner-br {
  right: 4px;
  bottom: 4px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  border-bottom-right-radius: 8px;
}

.inventory-item-card.quality-standard .quality-corner {
  color: rgba(135, 154, 173, 0.75);
}

.inventory-item-card.quality-unique .quality-corner {
  color: rgba(50, 210, 125, 0.9);
  filter: drop-shadow(0 0 4px rgba(50, 210, 125, 0.4));
}

.inventory-item-card.quality-advanced .quality-corner {
  color: rgba(66, 165, 255, 0.95);
  filter: drop-shadow(0 0 5px rgba(66, 165, 255, 0.45));
}

.inventory-item-card.quality-elite .quality-corner {
  color: rgba(181, 108, 255, 0.98);
  filter: drop-shadow(0 0 6px rgba(181, 108, 255, 0.55));
}

.inventory-item-card.quality-legendary .quality-corner {
  color: rgba(255, 179, 71, 1);
  filter: drop-shadow(0 0 7px rgba(255, 179, 71, 0.65));
}

.inventory-item-card.quality-godlike .quality-corner {
  color: rgba(255, 77, 109, 1);
  filter:
    drop-shadow(0 0 7px rgba(255, 77, 109, 0.75))
    drop-shadow(0 0 11px rgba(255, 179, 71, 0.35));
}

.inventory-item-card.quality-legendary::after,
.inventory-item-card.quality-godlike::after {
  content: "";
  position: absolute;
  inset: -35%;
  background: linear-gradient(120deg, transparent 42%, rgba(255,255,255,0.18) 50%, transparent 58%);
  transform: translateX(-80%) rotate(12deg);
  animation: itemQualityShine 3.2s ease-in-out infinite;
  pointer-events: none;
}

.inventory-item-card.quality-godlike::after {
  animation-duration: 2.4s;
}

@keyframes itemQualityShine {
  0%, 55% {
    transform: translateX(-85%) rotate(12deg);
    opacity: 0;
  }
  68% {
    opacity: 1;
  }
  100% {
    transform: translateX(85%) rotate(12deg);
    opacity: 0;
  }
}

@media (min-width: 1100px) {
  .inventory-card-grid-minimal {
    grid-template-columns: repeat(8, minmax(58px, 1fr)) !important;
  }
}

@media (max-width: 820px) {
  .inventory-card-grid-minimal {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  .inventory-card-grid-minimal {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}


/* ===== Extra compact inventory layout for two visible rows ===== */
.inventory-panel-minimal {
  padding: 8px 8px 10px !important;
}

.inventory-card-grid-minimal {
  grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
  gap: 6px !important;
  max-height: 124px !important;
  padding-right: 4px !important;
}

.inventory-item-card-minimal {
  min-height: 58px !important;
  height: 58px !important;
  padding: 4px !important;
  border-radius: 10px !important;
}

.inventory-item-frame-minimal {
  width: 36px !important;
  height: 36px !important;
  border-radius: 9px !important;
}

.inventory-item-image-minimal {
  width: 24px !important;
  height: 24px !important;
}

.inventory-item-card-minimal .inventory-item-count {
  top: 2px !important;
  right: 3px !important;
  min-width: 18px !important;
  padding: 0 4px !important;
  font-size: 8px !important;
  line-height: 13px !important;
}

.quality-corner {
  width: 11px !important;
  height: 11px !important;
}

.quality-corner-tl {
  top: 3px !important;
  left: 3px !important;
}

.quality-corner-br {
  right: 3px !important;
  bottom: 3px !important;
}

@media (max-width: 1100px) {
  .inventory-card-grid-minimal {
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 900px) {
  .inventory-card-grid-minimal {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  .inventory-card-grid-minimal {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 540px) {
  .inventory-card-grid-minimal {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}


/* ===== NPC Loot Broker ===== */

.npc-item-broker {
  margin-bottom: 14px;
  border: 1px solid rgba(90, 190, 255, 0.34);
  border-radius: 14px;
  background:
    radial-gradient(circle at 0% 0%, rgba(80, 190, 255, 0.08), transparent 34%),
    rgba(3, 10, 20, 0.68);
  padding: 12px;
}

.broker-header {
  margin-bottom: 10px;
}

.npc-item-grid {
  display: grid;
  gap: 8px;
  max-height: 222px;
  overflow-y: auto;
  padding-right: 5px;
}

.broker-empty {
  color: #9fb7d7;
  font-size: 13px;
  padding: 12px 4px;
}

.broker-item-card {
  position: relative;
  display: grid;
  grid-template-columns: 48px minmax(140px, 1fr) 44px 82px 210px;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(90, 190, 255, 0.24);
  background: linear-gradient(180deg, rgba(8, 24, 48, 0.92), rgba(3, 13, 28, 0.92));
}

.broker-item-frame {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 50% 35%, rgba(23, 53, 90, 0.95), rgba(7, 16, 31, 0.98));
  border: 2px solid rgba(126, 172, 219, 0.34);
}

.broker-item-frame img {
  width: 30px;
  height: 30px;
  object-fit: contain;
  display: block;
}

.broker-item-info {
  min-width: 0;
}

.broker-item-info strong,
.broker-item-info span {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.broker-item-info strong {
  color: #f4fbff;
  font-size: 13px;
}

.broker-item-info span,
.broker-item-value span {
  color: #9fb7d7;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.broker-item-stack {
  color: #7fdfff;
  font-weight: 900;
  text-align: center;
}

.broker-item-value strong {
  display: block;
  color: #eaf3ff;
  font-size: 13px;
  margin-top: 2px;
}

.broker-item-actions {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 7px;
}

.broker-item-actions button {
  min-height: 32px;
  padding: 6px 8px;
  font-size: 11px;
  border-radius: 9px;
}

.broker-item-card.quality-standard,
.broker-item-frame.quality-standard { border-color: rgba(121, 176, 217, 0.35); }

.broker-item-card.quality-unique,
.broker-item-frame.quality-unique { border-color: rgba(50, 210, 125, 0.58); }

.broker-item-card.quality-advanced,
.broker-item-frame.quality-advanced { border-color: rgba(66, 165, 255, 0.62); }

.broker-item-card.quality-elite,
.broker-item-frame.quality-elite { border-color: rgba(181, 108, 255, 0.72); }

.broker-item-card.quality-legendary,
.broker-item-frame.quality-legendary {
  border-color: rgba(255, 179, 71, 0.82);
  box-shadow: 0 0 16px rgba(255, 179, 71, 0.16);
}

.broker-item-card.quality-godlike,
.broker-item-frame.quality-godlike {
  border-color: rgba(255, 77, 109, 0.88);
  box-shadow: 0 0 18px rgba(255, 77, 109, 0.18), 0 0 28px rgba(255, 179, 71, 0.10);
}

@media (max-width: 980px) {
  .broker-item-card {
    grid-template-columns: 42px minmax(100px, 1fr) 38px;
  }

  .broker-item-value {
    display: none;
  }

  .broker-item-actions {
    grid-column: 1 / -1;
  }
}


.hub-launch-btn {
  align-self: center;
  margin-top: auto;
  margin-bottom: 18px;
  min-width: 240px;
  max-width: 320px;
  min-height: 64px;
  padding: 0 24px;
  font-size: 22px;
  letter-spacing: 1px;
  background: linear-gradient(180deg, rgba(12,40,82,0.92), rgba(5,18,37,0.92));
  border: 1px solid #3c8fc7;
  box-shadow: 0 0 18px rgba(0, 180, 255, 0.18);
}

.hub-launch-btn:hover {
  background: rgba(21, 77, 155, 0.9);
  transform: translateY(-2px);
}

.store-credit-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 10px 0 18px;
  padding: 12px 16px;
  border: 1px solid rgba(90,190,255,0.28);
  border-radius: 14px;
  background: rgba(3,10,20,0.58);
}

.store-credit-note {
  color: #9fb7d7;
  font-size: 12px;
}

.store-screen-grid {
  display: grid;
  grid-template-columns: minmax(360px, 0.9fr) minmax(0, 1.1fr);
  gap: 16px;
}

.store-column {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 0;
}

.store-category-panel {
  border: 1px solid rgba(90,190,255,0.28);
  border-radius: 16px;
  background: rgba(3,10,20,0.62);
  padding: 14px;
  min-height: 0;
}

.store-list {
  max-height: 270px;
  overflow-y: auto;
  padding-right: 6px;
}

.store-category-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.store-category-header span {
  color: #7fdfff;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.store-category-header small {
  color: #9fb7d7;
}

.store-ship-sell-note {
  color: #9fb7d7;
  font-size: 13px;
  padding: 8px 4px;
}

@media (max-width: 1080px) {
  .store-screen-grid {
    grid-template-columns: 1fr;
  }
}


/* Modern store */
.modern-store-credit-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}

.store-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.store-filter-btn {
  min-width: 108px;
  padding: 10px 16px;
  border-radius: 12px;
  border: 1px solid rgba(72, 180, 255, 0.35);
  background: rgba(4, 11, 22, 0.74);
  color: #d6ecff;
  font-family: inherit;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
}

.store-filter-btn.active {
  background: linear-gradient(180deg, rgba(43, 106, 190, 0.92), rgba(16, 60, 122, 0.92));
  box-shadow: 0 0 16px rgba(74, 184, 255, 0.2);
}

.modern-store-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.78fr);
  gap: 16px;
  min-height: 0;
  height: calc(100% - 118px);
}

.modern-store-catalog-panel,
.modern-store-detail-panel {
  border: 1px solid rgba(87, 191, 255, 0.28);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(4, 10, 20, 0.82), rgba(2, 7, 15, 0.88));
  padding: 14px;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.modern-store-panel-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}

.modern-store-panel-header span {
  color: #7fdfff;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 900;
}

.modern-store-panel-header small {
  color: #95b6d8;
}

.store-catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 10px;
  overflow-y: auto;
  padding-right: 4px;
}

.store-catalog-card {
  position: relative;
  min-height: 144px;
  border-radius: 14px;
  border: 1px solid rgba(73, 160, 225, 0.28);
  background: linear-gradient(180deg, rgba(7, 17, 31, 0.95), rgba(4, 10, 20, 0.95));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 12px 10px 10px;
  color: #ebf5ff;
  cursor: pointer;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.store-catalog-card:hover {
  transform: translateY(-1px);
  border-color: rgba(112, 205, 255, 0.48);
}

.store-catalog-card.selected {
  border-color: rgba(96, 206, 255, 0.92);
  box-shadow: 0 0 18px rgba(55, 182, 255, 0.22);
}

.store-catalog-card img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  pointer-events: none;
}

.store-card-name {
  text-align: center;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.15;
  min-height: 30px;
}

.store-card-sub {
  color: #95b6d8;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.store-card-price {
  font-size: 12px;
  font-weight: 800;
  color: #fff;
}

.store-card-status {
  position: absolute;
  top: 8px;
  right: 8px;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(10, 27, 48, 0.92);
  border: 1px solid rgba(93, 183, 244, 0.3);
  color: #9fdbff;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.store-detail-panel-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 0;
  overflow-y: auto;
  padding-right: 4px;
}

.store-detail-hero {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.store-detail-visual {
  min-height: 110px;
  border-radius: 18px;
  border: 1px solid rgba(86, 177, 234, 0.32);
  background: radial-gradient(circle at center, rgba(12, 48, 88, 0.88), rgba(5, 14, 27, 0.9));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
}

.store-detail-visual img {
  width: 100%;
  max-width: 88px;
  max-height: 88px;
  object-fit: contain;
}

.store-detail-kicker {
  color: #8edfff;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.store-detail-title {
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
  margin: 2px 0 6px;
  text-transform: uppercase;
}

.store-detail-desc {
  color: #c7dbee;
  line-height: 1.4;
  font-size: 14px;
}

.store-quality-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.store-quality-pill {
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(86, 177, 234, 0.3);
  background: rgba(6, 15, 29, 0.86);
  color: #e7f6ff;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  text-transform: uppercase;
}

.store-quality-pill.active {
  box-shadow: 0 0 12px rgba(79, 194, 255, 0.24);
}

.store-quality-pill.quality-standard.active { border-color: rgba(121, 176, 217, 0.8); }
.store-quality-pill.quality-unique.active { border-color: rgba(50, 210, 125, 0.9); }
.store-quality-pill.quality-advanced.active { border-color: rgba(66, 165, 255, 0.95); }
.store-quality-pill.quality-elite.active { border-color: rgba(181, 108, 255, 0.95); }
.store-quality-pill.quality-legendary.active { border-color: rgba(255, 181, 48, 0.98); }
.store-quality-pill.quality-godlike.active { border-color: rgba(255, 84, 84, 0.98); }

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

.store-stat-card {
  border-radius: 12px;
  border: 1px solid rgba(86, 177, 234, 0.24);
  background: rgba(4, 11, 21, 0.8);
  padding: 10px 12px;
}

.store-stat-card span {
  display: block;
  color: #8badcf;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 5px;
}

.store-stat-card strong {
  font-size: 16px;
}

.store-ownership-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.store-ownership-card {
  border-radius: 12px;
  border: 1px solid rgba(86, 177, 234, 0.24);
  background: rgba(4, 11, 21, 0.8);
  padding: 10px 12px;
}

.store-ownership-card span {
  display: block;
  color: #8badcf;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 5px;
}

.store-ownership-card strong {
  font-size: 18px;
}

.store-detail-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.store-detail-actions button,
.store-detail-actions .button-like {
  min-height: 46px;
}

.store-detail-actions .store-wide-action {
  grid-column: 1 / -1;
}

.store-detail-note {
  color: #9ab5d2;
  font-size: 12px;
  line-height: 1.5;
}

.store-empty-state {
  padding: 24px;
  text-align: center;
  color: #95b6d8;
}

.store-quality-standard .store-detail-visual,
.store-catalog-card.quality-standard { border-color: rgba(121, 176, 217, 0.3); }
.store-quality-unique .store-detail-visual,
.store-catalog-card.quality-unique { border-color: rgba(50, 210, 125, 0.48); }
.store-quality-advanced .store-detail-visual,
.store-catalog-card.quality-advanced { border-color: rgba(66, 165, 255, 0.52); }
.store-quality-elite .store-detail-visual,
.store-catalog-card.quality-elite { border-color: rgba(181, 108, 255, 0.6); }
.store-quality-legendary .store-detail-visual,
.store-catalog-card.quality-legendary { border-color: rgba(255, 181, 48, 0.72); box-shadow: inset 0 0 15px rgba(255, 181, 48, 0.05); }
.store-quality-godlike .store-detail-visual,
.store-catalog-card.quality-godlike { border-color: rgba(255, 84, 84, 0.78); box-shadow: inset 0 0 18px rgba(255, 84, 84, 0.05); }

@media (max-width: 1180px) {
  .modern-store-layout {
    grid-template-columns: 1fr;
    height: auto;
  }
}

@media (max-width: 760px) {
  .store-detail-hero {
    grid-template-columns: 1fr;
  }

  .store-detail-stats,
  .store-ownership-grid,
  .store-detail-actions {
    grid-template-columns: 1fr;
  }
}


/* Store refinement pass */
.store-header-row {
  align-items: flex-start;
}

.store-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.store-credits-inline {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 14px;
  border: 1px solid rgba(80, 190, 255, 0.28);
  background: linear-gradient(180deg, rgba(5, 15, 29, 0.85), rgba(3, 10, 20, 0.92));
  box-shadow: inset 0 0 14px rgba(46, 136, 201, 0.09);
}

.store-credits-inline span {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #99c8ea;
}

.store-credits-inline strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  color: #fff;
}

.modern-store-topbar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  margin: 8px 0 14px;
}

.modern-store-credit-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}

.store-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-start;
}

.store-filter-btn {
  min-width: 0;
  padding: 8px 14px;
  min-height: 38px;
  border-radius: 11px;
  font-size: 12px;
  line-height: 1;
  border: 1px solid rgba(72, 180, 255, 0.28);
  background: linear-gradient(180deg, rgba(5, 13, 25, 0.86), rgba(3, 9, 18, 0.94));
  box-shadow: inset 0 0 10px rgba(46, 136, 201, 0.06);
}

.store-filter-btn:hover {
  border-color: rgba(96, 206, 255, 0.52);
}

.store-filter-btn.active {
  background: linear-gradient(180deg, rgba(43, 106, 190, 0.9), rgba(16, 60, 122, 0.92));
  box-shadow: 0 0 16px rgba(74, 184, 255, 0.14), inset 0 0 12px rgba(173, 221, 255, 0.08);
}

.modern-store-layout {
  height: calc(100% - 104px);
}

.store-catalog-grid,
.store-detail-panel-body {
  scrollbar-width: thin;
  scrollbar-color: #43b9ff rgba(6, 17, 32, 0.9);
}

.store-catalog-grid::-webkit-scrollbar,
.store-detail-panel-body::-webkit-scrollbar {
  width: 10px;
}

.store-catalog-grid::-webkit-scrollbar-track,
.store-detail-panel-body::-webkit-scrollbar-track {
  background: linear-gradient(180deg, rgba(4, 12, 24, 0.96), rgba(2, 8, 16, 0.96));
  border-radius: 999px;
  border: 1px solid rgba(72, 180, 255, 0.16);
}

.store-catalog-grid::-webkit-scrollbar-thumb,
.store-detail-panel-body::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(66, 190, 255, 0.95), rgba(22, 122, 199, 0.95));
  border-radius: 999px;
  border: 1px solid rgba(180, 236, 255, 0.24);
  box-shadow: 0 0 12px rgba(66, 190, 255, 0.2);
}

.store-catalog-grid::-webkit-scrollbar-thumb:hover,
.store-detail-panel-body::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(100, 208, 255, 0.98), rgba(34, 144, 225, 0.98));
}

@media (max-width: 980px) {
  .store-header-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .store-header-actions {
    width: 100%;
    justify-content: space-between;
    margin-left: 0;
  }
}

@media (max-width: 760px) {
  .store-header-actions {
    flex-wrap: wrap;
  }

  .store-credits-inline {
    order: 1;
  }

  .modern-store-topbar {
    margin-top: 4px;
  }
}


/* Store follow-up: force horizontal filters and make them fit the full row */
.modern-store-topbar {
  width: 100%;
  overflow: hidden;
  padding-bottom: 0;
}

#storeFilterBar.store-filter-bar {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center;
  justify-content: stretch !important;
  gap: 10px;
  width: 100%;
  min-width: 0;
}

#storeFilterBar .store-filter-btn {
  flex: 1 1 0 !important;
  min-width: 0;
  width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  padding: 9px 12px;
}

.store-quality-pill.quality-standard.active { border-color: rgba(121, 176, 217, 0.8); }
.store-quality-pill.quality-unique.active { border-color: rgba(50, 210, 125, 0.9); }
.store-quality-pill.quality-elite.active { border-color: rgba(181, 108, 255, 0.95); }
.store-quality-pill.quality-legendary.active { border-color: rgba(255, 181, 48, 0.98); }
.store-quality-pill.quality-godlike.active { border-color: rgba(255, 84, 84, 0.98); }


/* ===== Store detail simplification + catalog quality filters ===== */

.store-catalog-header {
  align-items: center;
}

.store-catalog-header > span {
  flex: 0 0 auto;
}

.store-quality-row-compact {
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.store-quality-row-compact .store-quality-pill {
  padding: 6px 9px;
  font-size: 10px;
  min-height: 28px;
}

.compact-store-detail {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.compact-store-detail .store-detail-visual {
  width: 100%;
  min-height: 150px;
}

.compact-store-detail .store-detail-visual img {
  max-width: 118px;
  max-height: 118px;
}

.compact-store-detail .store-detail-title {
  font-size: 26px;
}

.compact-store-detail .store-detail-desc {
  font-size: 14px;
  line-height: 1.45;
}

.store-simple-price-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.store-simple-price-row > div {
  border-radius: 12px;
  border: 1px solid rgba(86, 177, 234, 0.24);
  background: rgba(4, 11, 21, 0.82);
  padding: 10px 12px;
}

.store-simple-price-row span {
  display: block;
  color: #8badcf;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 5px;
}

.store-simple-price-row strong {
  font-size: 16px;
}

.compact-store-actions {
  grid-template-columns: 1fr;
}

.compact-store-actions:has(button + button) {
  grid-template-columns: 1fr 1fr;
}

.store-detail-stats,
.store-ownership-grid,
.store-detail-note {
  display: none !important;
}

.store-quality-pill.quality-unique.active { border-color: rgba(50, 210, 125, 0.9); }
.store-quality-unique .store-detail-visual,
.store-catalog-card.quality-unique { border-color: rgba(50, 210, 125, 0.48); }

@media (max-width: 900px) {
  .store-catalog-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .store-quality-row-compact {
    margin-left: 0;
    justify-content: flex-start;
  }
}


/* Store polish: horizontal quality filters + catalogue card fit */
.store-catalog-header {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: nowrap;
}

.store-catalog-header > span {
  flex: 0 0 auto;
}

#storeQualityBar.store-quality-row-compact {
  flex: 1 1 auto;
  margin-left: 0;
  width: 100%;
  min-width: 0;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}

#storeQualityBar.store-quality-row-compact .store-quality-pill {
  width: 100%;
  min-width: 0;
  white-space: nowrap;
  padding: 8px 8px;
  font-size: 10px;
  line-height: 1;
  min-height: 0;
}

.store-catalog-grid {
  grid-template-columns: repeat(auto-fill, minmax(122px, 1fr));
}

.store-catalog-card {
  min-height: 168px;
  padding: 12px 10px 12px;
  gap: 6px;
}

.store-card-name {
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.store-card-sub {
  line-height: 1.1;
}

.store-card-price {
  margin-top: auto;
  font-size: 11px;
  line-height: 1.1;
  text-align: center;
  max-width: 100%;
  word-break: break-word;
}

@media (max-width: 900px) {
  .store-catalog-header {
    flex-direction: column;
    align-items: flex-start;
  }

  #storeQualityBar.store-quality-row-compact {
    width: 100%;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  #storeQualityBar.store-quality-row-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* Store quality polish: stronger rarity identity and cleaner detail panel */
.modern-store-detail-panel .modern-store-panel-header small {
  display: none;
}

.store-catalog-card {
  overflow: hidden;
}

.store-card-quality-badge {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 3;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(128, 188, 235, 0.36);
  background: rgba(6, 15, 30, 0.88);
  color: #dff3ff;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  line-height: 1;
}

.store-card-art {
  position: relative;
  width: 72px;
  height: 72px;
  margin: 18px auto 2px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at center, rgba(11, 42, 78, 0.85), rgba(4, 11, 23, 0.18) 70%);
}

.store-card-art::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 14px;
  opacity: 0.55;
  filter: blur(12px);
  pointer-events: none;
}

.store-card-art img {
  position: relative;
  z-index: 1;
  max-width: 62px;
  max-height: 62px;
  object-fit: contain;
}

.store-detail-visual {
  position: relative;
  overflow: hidden;
}

.store-detail-visual::before {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 28px;
  opacity: 0.55;
  filter: blur(22px);
  pointer-events: none;
}

.store-catalog-card::after,
.store-detail-visual::after {
  content: "";
  position: absolute;
  inset: -35% auto auto -45%;
  width: 72%;
  height: 170%;
  transform: rotate(24deg);
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,0.14), rgba(255,255,255,0));
  opacity: 0;
  pointer-events: none;
}

.store-catalog-card.quality-unique .store-card-art::before,
.store-quality-unique .store-detail-visual::before {
  background: rgba(50, 210, 125, 0.42);
}

.store-catalog-card.quality-elite .store-card-art::before,
.store-quality-elite .store-detail-visual::before {
  background: rgba(171, 98, 255, 0.48);
}

.store-catalog-card.quality-legendary .store-card-art::before,
.store-quality-legendary .store-detail-visual::before {
  background: rgba(255, 179, 61, 0.52);
}

.store-catalog-card.quality-godlike .store-card-art::before,
.store-quality-godlike .store-detail-visual::before {
  background: rgba(255, 78, 88, 0.6);
}

.store-catalog-card.quality-unique .store-card-quality-badge {
  border-color: rgba(50, 210, 125, 0.55);
  box-shadow: 0 0 10px rgba(50, 210, 125, 0.25);
}

.store-catalog-card.quality-elite .store-card-quality-badge {
  border-color: rgba(181, 108, 255, 0.62);
  box-shadow: 0 0 12px rgba(181, 108, 255, 0.28);
}

.store-catalog-card.quality-legendary .store-card-quality-badge {
  border-color: rgba(255, 181, 48, 0.72);
  box-shadow: 0 0 14px rgba(255, 181, 48, 0.32);
}

.store-catalog-card.quality-godlike .store-card-quality-badge {
  border-color: rgba(255, 84, 84, 0.8);
  box-shadow: 0 0 16px rgba(255, 84, 84, 0.34);
}

.store-catalog-card.quality-elite::after,
.store-catalog-card.quality-legendary::after,
.store-catalog-card.quality-godlike::after,
.store-quality-elite .store-detail-visual::after,
.store-quality-legendary .store-detail-visual::after,
.store-quality-godlike .store-detail-visual::after {
  opacity: 0.3;
  animation: storeQualitySheen 3.8s linear infinite;
}

.store-catalog-card.quality-godlike,
.store-quality-godlike .store-detail-visual {
  box-shadow: inset 0 0 18px rgba(255, 84, 84, 0.08), 0 0 18px rgba(255, 84, 84, 0.12);
}

.store-catalog-card.quality-legendary,
.store-quality-legendary .store-detail-visual {
  box-shadow: inset 0 0 16px rgba(255, 181, 48, 0.08), 0 0 14px rgba(255, 181, 48, 0.1);
}

.store-catalog-card.quality-elite,
.store-quality-elite .store-detail-visual {
  box-shadow: inset 0 0 14px rgba(181, 108, 255, 0.06), 0 0 12px rgba(181, 108, 255, 0.08);
}

.store-detail-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 10px;
}

.store-detail-stat-card {
  border-radius: 12px;
  border: 1px solid rgba(86, 177, 234, 0.24);
  background: rgba(4, 11, 21, 0.82);
  padding: 10px 12px;
}

.store-detail-stat-card span {
  display: block;
  color: #8badcf;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 5px;
}

.store-detail-stat-card strong {
  display: block;
  font-size: 14px;
  line-height: 1.25;
  color: #eef7ff;
}

@keyframes storeQualitySheen {
  0% { transform: translateX(-150%) rotate(24deg); }
  100% { transform: translateX(240%) rotate(24deg); }
}


/* Stronger store rarity styling */
.store-catalog-card.quality-elite,
.store-quality-elite .store-detail-shell {
  border-color: rgba(175, 112, 255, 0.78);
  box-shadow: 0 0 18px rgba(153, 91, 255, 0.14), inset 0 0 18px rgba(109, 58, 181, 0.08);
}

.store-catalog-card.quality-elite .store-card-art,
.store-quality-elite .store-detail-visual {
  background:
    radial-gradient(circle at 50% 50%, rgba(143, 86, 255, 0.28), rgba(23, 11, 44, 0.05) 56%),
    radial-gradient(circle at 50% 50%, rgba(11, 42, 78, 0.85), rgba(4, 11, 23, 0.18) 70%);
  box-shadow: inset 0 0 0 1px rgba(185, 126, 255, 0.28), 0 0 24px rgba(167, 104, 255, 0.16);
  animation: eliteEnergyPulse 2.8s ease-in-out infinite;
}

.store-catalog-card.quality-elite .store-card-art img,
.store-quality-elite .store-detail-visual img {
  filter: drop-shadow(0 0 8px rgba(188, 132, 255, 0.26)) drop-shadow(0 0 18px rgba(136, 91, 255, 0.18));
}

.store-catalog-card.quality-elite .store-card-quality-badge {
  background: linear-gradient(180deg, rgba(86, 34, 148, 0.95), rgba(23, 12, 48, 0.94));
  color: #f5e9ff;
}

.store-catalog-card.quality-legendary,
.store-quality-legendary .store-detail-shell {
  border-color: rgba(255, 188, 66, 0.84);
  box-shadow: 0 0 22px rgba(255, 182, 64, 0.18), inset 0 0 18px rgba(191, 119, 8, 0.07);
}

.store-catalog-card.quality-legendary .store-card-art,
.store-quality-legendary .store-detail-visual {
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 179, 41, 0.24), rgba(92, 54, 0, 0.05) 56%),
    radial-gradient(circle at 50% 50%, rgba(11, 42, 78, 0.85), rgba(4, 11, 23, 0.18) 70%);
  box-shadow: inset 0 0 0 1px rgba(255, 198, 79, 0.34), 0 0 28px rgba(255, 181, 48, 0.2);
  animation: legendaryGlowPulse 2.4s ease-in-out infinite;
}

.store-catalog-card.quality-legendary .store-card-art img,
.store-quality-legendary .store-detail-visual img {
  filter: drop-shadow(0 0 10px rgba(255, 196, 92, 0.3)) drop-shadow(0 0 22px rgba(255, 152, 28, 0.18));
}

.store-catalog-card.quality-legendary::after,
.store-quality-legendary .store-detail-visual::after {
  opacity: 0.46;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,241,189,0.4), rgba(255,198,72,0.14), rgba(255,255,255,0));
  animation: legendaryShimmer 2.6s linear infinite;
}

.store-catalog-card.quality-legendary .store-card-quality-badge {
  background: linear-gradient(180deg, rgba(168, 105, 11, 0.96), rgba(53, 28, 2, 0.94));
  color: #fff5d6;
}

.store-catalog-card.quality-godlike,
.store-quality-godlike .store-detail-shell {
  border-color: rgba(255, 102, 102, 0.9);
  box-shadow: 0 0 24px rgba(255, 89, 116, 0.18), 0 0 38px rgba(255, 168, 74, 0.12), inset 0 0 18px rgba(255, 92, 92, 0.08);
}

.store-catalog-card.quality-godlike .store-card-art,
.store-quality-godlike .store-detail-visual {
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 88, 126, 0.22), rgba(255, 170, 63, 0.12) 34%, rgba(93, 15, 31, 0.05) 60%),
    radial-gradient(circle at 50% 50%, rgba(11, 42, 78, 0.85), rgba(4, 11, 23, 0.18) 70%);
  box-shadow: inset 0 0 0 1px rgba(255, 123, 123, 0.36), 0 0 30px rgba(255, 92, 137, 0.24), 0 0 46px rgba(255, 172, 48, 0.12);
  animation: godlikeHaloPulse 1.9s ease-in-out infinite;
}

.store-catalog-card.quality-godlike .store-card-art img,
.store-quality-godlike .store-detail-visual img {
  filter: drop-shadow(0 0 10px rgba(255, 189, 116, 0.28)) drop-shadow(0 0 20px rgba(255, 95, 143, 0.22));
}

.store-catalog-card.quality-godlike::before,
.store-quality-godlike .store-detail-shell::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(130deg, rgba(255,255,255,0), rgba(255,116,157,0.09), rgba(255,196,82,0.06), rgba(255,255,255,0));
  opacity: 0.8;
  mix-blend-mode: screen;
}

.store-catalog-card.quality-godlike::after,
.store-quality-godlike .store-detail-visual::after {
  opacity: 0.55;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,240,204,0.48), rgba(255,132,132,0.22), rgba(255,255,255,0));
  animation: godlikeMythicSheen 2.1s linear infinite;
}

.store-catalog-card.quality-godlike .store-card-quality-badge {
  background: linear-gradient(180deg, rgba(155, 23, 52, 0.96), rgba(61, 10, 16, 0.95));
  color: #fff1df;
  box-shadow: 0 0 14px rgba(255, 92, 128, 0.32), 0 0 20px rgba(255, 180, 91, 0.12);
}

.store-catalog-card.quality-elite .store-card-name,
.store-quality-elite .store-detail-title {
  text-shadow: 0 0 10px rgba(167, 104, 255, 0.22);
}

.store-catalog-card.quality-legendary .store-card-name,
.store-quality-legendary .store-detail-title {
  text-shadow: 0 0 12px rgba(255, 196, 92, 0.28);
}

.store-catalog-card.quality-godlike .store-card-name,
.store-quality-godlike .store-detail-title {
  text-shadow: 0 0 14px rgba(255, 92, 140, 0.24), 0 0 18px rgba(255, 175, 72, 0.16);
}

@keyframes eliteEnergyPulse {
  0%, 100% {
    box-shadow: inset 0 0 0 1px rgba(185, 126, 255, 0.24), 0 0 18px rgba(167, 104, 255, 0.12);
    transform: translateY(0);
  }
  50% {
    box-shadow: inset 0 0 0 1px rgba(211, 164, 255, 0.34), 0 0 28px rgba(167, 104, 255, 0.22);
    transform: translateY(-1px);
  }
}

@keyframes legendaryGlowPulse {
  0%, 100% {
    box-shadow: inset 0 0 0 1px rgba(255, 198, 79, 0.28), 0 0 22px rgba(255, 181, 48, 0.16);
  }
  50% {
    box-shadow: inset 0 0 0 1px rgba(255, 214, 122, 0.42), 0 0 32px rgba(255, 184, 67, 0.28);
  }
}

@keyframes legendaryShimmer {
  0% { transform: translateX(-160%) rotate(24deg); }
  100% { transform: translateX(250%) rotate(24deg); }
}

@keyframes godlikeHaloPulse {
  0%, 100% {
    box-shadow: inset 0 0 0 1px rgba(255, 123, 123, 0.3), 0 0 26px rgba(255, 92, 137, 0.2), 0 0 38px rgba(255, 172, 48, 0.1);
    transform: scale(1);
  }
  50% {
    box-shadow: inset 0 0 0 1px rgba(255, 169, 169, 0.42), 0 0 34px rgba(255, 92, 137, 0.32), 0 0 52px rgba(255, 172, 48, 0.16);
    transform: scale(1.015);
  }
}

@keyframes godlikeMythicSheen {
  0% { transform: translateX(-170%) rotate(24deg); }
  100% { transform: translateX(270%) rotate(24deg); }
}


/* Store tidy-up: owned filter, badge spacing, simplified detail */
.store-filter-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  justify-content: stretch;
}

.store-filter-btn {
  min-width: 0;
  width: 100%;
  padding: 10px 10px;
}

.store-catalog-grid {
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
  align-content: start;
}

.store-catalog-card {
  min-height: 150px;
  padding: 14px 10px 10px;
}

.store-card-quality-badge {
  left: 8px;
  top: 8px;
  max-width: calc(100% - 56px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.store-card-status {
  top: 8px;
  right: 8px;
  min-width: 28px;
  max-width: 44px;
  text-align: center;
  padding: 3px 6px;
  font-size: 10px;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.store-card-art {
  margin: 24px auto 2px;
}

.store-card-price {
  margin-top: auto;
  line-height: 1.1;
  text-align: center;
  word-break: break-word;
}

.store-detail-panel-body {
  overflow: hidden;
  padding-right: 0;
}

.simplified-store-detail {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.simplified-store-detail .store-detail-visual {
  min-height: 118px;
  max-height: 118px;
}

.simplified-store-detail .store-detail-visual img {
  max-width: 106px;
  max-height: 106px;
}

.simplified-store-detail .store-detail-kicker {
  font-size: 15px;
  margin-top: 2px;
}

.simplified-store-detail .store-detail-title {
  font-size: 22px;
  line-height: 1.02;
}

.simplified-store-detail .store-detail-desc {
  font-size: 13px;
  line-height: 1.4;
}

.store-detail-owned-line {
  color: #9ecbff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.compact-detail-stats {
  gap: 8px;
}

.compact-detail-stat-card {
  padding: 9px 11px;
}

.compact-detail-stat-card span {
  margin-bottom: 3px;
}

.compact-detail-stat-card strong {
  font-size: 21px;
}

.simplified-store-actions {
  margin-top: auto;
  grid-template-columns: 1fr;
}

.simplified-store-actions.two-buttons {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.simplified-store-actions button {
  min-height: 50px;
  font-size: 14px;
}

@media (max-width: 1100px) {
  .store-filter-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}


/* Store polish pass: remove text quality badge and replace icon halo with electric rarity framing */
.store-card-quality-badge {
  display: none !important;
}

.store-catalog-card {
  --store-rarity-rgb: 112, 188, 255;
}

.store-catalog-card.quality-standard {
  --store-rarity-rgb: 112, 188, 255;
}

.store-catalog-card.quality-unique {
  --store-rarity-rgb: 50, 210, 125;
}

.store-catalog-card.quality-elite {
  --store-rarity-rgb: 171, 98, 255;
}

.store-catalog-card.quality-legendary {
  --store-rarity-rgb: 255, 179, 61;
}

.store-catalog-card.quality-godlike {
  --store-rarity-rgb: 255, 92, 122;
}

.store-card-art {
  margin: 10px auto 4px;
  overflow: hidden;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(9, 19, 35, 0.96), rgba(4, 10, 20, 0.82));
  box-shadow: inset 0 0 0 1px rgba(96, 160, 219, 0.12), inset 0 8px 18px rgba(12, 34, 60, 0.18);
}

.store-card-art::before {
  content: "";
  position: absolute;
  inset: -22%;
  border-radius: inherit;
  background: linear-gradient(110deg,
    rgba(255,255,255,0) 24%,
    rgba(var(--store-rarity-rgb),0.00) 36%,
    rgba(var(--store-rarity-rgb),0.18) 46%,
    rgba(255,255,255,0.18) 50%,
    rgba(var(--store-rarity-rgb),0.26) 54%,
    rgba(var(--store-rarity-rgb),0.06) 60%,
    rgba(255,255,255,0) 72%);
  transform: translateX(-65%) skewX(-18deg);
  opacity: 0.75;
  filter: blur(1px);
  mix-blend-mode: screen;
  pointer-events: none;
  animation: storeItemEnergySweep 2.8s linear infinite;
}

.store-card-art::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(var(--store-rarity-rgb),0.95), rgba(var(--store-rarity-rgb),0)) top left / 18px 2px no-repeat,
    linear-gradient(180deg, rgba(var(--store-rarity-rgb),0.95), rgba(var(--store-rarity-rgb),0)) top left / 2px 18px no-repeat,
    linear-gradient(270deg, rgba(var(--store-rarity-rgb),0.95), rgba(var(--store-rarity-rgb),0)) top right / 18px 2px no-repeat,
    linear-gradient(180deg, rgba(var(--store-rarity-rgb),0.95), rgba(var(--store-rarity-rgb),0)) top right / 2px 18px no-repeat,
    linear-gradient(90deg, rgba(var(--store-rarity-rgb),0.95), rgba(var(--store-rarity-rgb),0)) bottom left / 18px 2px no-repeat,
    linear-gradient(0deg, rgba(var(--store-rarity-rgb),0.95), rgba(var(--store-rarity-rgb),0)) bottom left / 2px 18px no-repeat,
    linear-gradient(270deg, rgba(var(--store-rarity-rgb),0.95), rgba(var(--store-rarity-rgb),0)) bottom right / 18px 2px no-repeat,
    linear-gradient(0deg, rgba(var(--store-rarity-rgb),0.95), rgba(var(--store-rarity-rgb),0)) bottom right / 2px 18px no-repeat;
  box-shadow: inset 0 0 0 1px rgba(var(--store-rarity-rgb),0.18), 0 0 14px rgba(var(--store-rarity-rgb),0.10);
  opacity: 0.92;
  animation: storeItemArcFlicker 1.9s steps(2, end) infinite;
}

.store-card-art img {
  position: relative;
  z-index: 2;
}

.store-catalog-card.quality-standard .store-card-art::before {
  opacity: 0.55;
}

.store-catalog-card.quality-standard .store-card-art::after {
  box-shadow: inset 0 0 0 1px rgba(var(--store-rarity-rgb),0.14), 0 0 10px rgba(var(--store-rarity-rgb),0.06);
}

.store-catalog-card.quality-unique .store-card-art::after {
  box-shadow: inset 0 0 0 1px rgba(var(--store-rarity-rgb),0.20), 0 0 14px rgba(var(--store-rarity-rgb),0.12);
}

.store-catalog-card.quality-elite .store-card-art::after {
  box-shadow: inset 0 0 0 1px rgba(var(--store-rarity-rgb),0.24), 0 0 16px rgba(var(--store-rarity-rgb),0.16);
}

.store-catalog-card.quality-legendary .store-card-art::after {
  box-shadow: inset 0 0 0 1px rgba(var(--store-rarity-rgb),0.30), 0 0 18px rgba(var(--store-rarity-rgb),0.18), 0 0 24px rgba(255, 221, 143, 0.08);
}

.store-catalog-card.quality-godlike .store-card-art::after {
  box-shadow: inset 0 0 0 1px rgba(var(--store-rarity-rgb),0.34), 0 0 20px rgba(var(--store-rarity-rgb),0.20), 0 0 28px rgba(255, 188, 120, 0.10);
}

.store-catalog-card.quality-elite .store-card-art::before,
.store-catalog-card.quality-legendary .store-card-art::before,
.store-catalog-card.quality-godlike .store-card-art::before {
  opacity: 0.9;
}

.store-catalog-card.quality-legendary .store-card-art,
.store-catalog-card.quality-godlike .store-card-art {
  animation: storeRareArtFloat 2.8s ease-in-out infinite;
}

@keyframes storeItemEnergySweep {
  0% { transform: translateX(-80%) skewX(-18deg); opacity: 0.08; }
  18% { opacity: 0.72; }
  55% { opacity: 0.88; }
  100% { transform: translateX(130%) skewX(-18deg); opacity: 0.08; }
}

@keyframes storeItemArcFlicker {
  0%, 100% { opacity: 0.90; }
  35% { opacity: 0.72; }
  42% { opacity: 0.95; }
  58% { opacity: 0.76; }
  66% { opacity: 0.98; }
}

@keyframes storeRareArtFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-1px); }
}


/* Hangar Vault */
.vault-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.62fr) minmax(320px, 0.88fr);
  gap: 18px;
  align-items: stretch;
}

.save-transfer-panel {
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(127, 223, 255, 0.18);
  border-radius: 12px;
  background:
    linear-gradient(90deg, rgba(127, 223, 255, 0.08), rgba(101, 240, 160, 0.05)),
    rgba(2, 10, 22, 0.74);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.save-transfer-panel strong,
.save-transfer-panel span {
  display: block;
}

.save-transfer-panel strong {
  color: #83e9ff;
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.save-transfer-panel span {
  margin-top: 3px;
  color: #b9d7f4;
  font-size: 0.72rem;
  line-height: 1.3;
}

.save-transfer-panel span[data-tone="success"] {
  color: #65f0a0;
}

.save-transfer-panel span[data-tone="error"] {
  color: #ff8fa7;
}

.save-transfer-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.save-transfer-actions button {
  min-height: 32px;
  padding: 7px 10px;
  border-radius: 10px;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .save-transfer-panel {
    grid-template-columns: 1fr;
  }

  .save-transfer-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}

.vault-main-panel,
.vault-detail-panel {
  min-height: 500px;
  background: linear-gradient(180deg, rgba(2, 10, 24, 0.94), rgba(1, 8, 20, 0.9));
  border: 1px solid rgba(68, 170, 255, 0.26);
  box-shadow: inset 0 0 0 1px rgba(0, 210, 255, 0.06), 0 16px 40px rgba(0, 0, 0, 0.24);
  border-radius: 22px;
  overflow: hidden;
}

.vault-filter-header {
  display: block;
}

.vault-filter-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
}

.vault-filter-row .store-filter-btn {
  min-width: 0;
  width: 100%;
  padding-inline: 10px;
}

.vault-catalog-grid,
.vault-detail-panel-body {
  padding: 14px;
  overflow: auto;
  max-height: min(540px, calc(100vh - 300px));
}

.vault-catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
  gap: 10px;
  align-content: start;
}

.vault-catalog-grid::-webkit-scrollbar,
.vault-detail-panel-body::-webkit-scrollbar {
  width: 10px;
}

.vault-catalog-grid::-webkit-scrollbar-track,
.vault-detail-panel-body::-webkit-scrollbar-track {
  background: rgba(7, 18, 38, 0.9);
  border-radius: 999px;
}

.vault-catalog-grid::-webkit-scrollbar-thumb,
.vault-detail-panel-body::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(72, 165, 255, 0.95), rgba(32, 112, 255, 0.88));
  border-radius: 999px;
  border: 2px solid rgba(7, 18, 38, 0.9);
}

.vault-catalog-card {
  position: relative;
  min-height: 154px;
  padding: 10px 10px 10px;
}

.vault-catalog-card .store-card-art {
  width: 58px;
  height: 58px;
  margin: 14px auto 12px;
}

.vault-card-count,
.vault-card-equipped {
  position: absolute;
  top: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  line-height: 1;
  z-index: 2;
}

.vault-card-count {
  right: 8px;
  background: rgba(12, 28, 54, 0.9);
  border: 1px solid rgba(140, 206, 255, 0.26);
  color: #eef8ff;
}

.vault-card-equipped {
  left: 8px;
  background: rgba(10, 62, 88, 0.88);
  border: 1px solid rgba(76, 229, 255, 0.3);
  color: #7cf2ff;
}

.vault-card-meta {
  margin-top: 4px;
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(155, 208, 255, 0.76);
}

.vault-catalog-card .store-card-name {
  font-size: 0.92rem;
  line-height: 1.1;
  margin-top: 2px;
}

.vault-catalog-card .store-card-sub {
  display: none;
}

.vault-catalog-card.selected {
  transform: translateY(-1px);
}

.vault-empty-state {
  min-height: 220px;
  display: grid;
  place-items: center;
  text-align: center;
  color: rgba(180, 215, 255, 0.72);
  font-size: 0.98rem;
}

.vault-detail-shell {
  display: grid;
  gap: 10px;
}

.vault-detail-shell .store-detail-visual {
  min-height: 92px;
  padding: 8px;
}

.vault-detail-shell .store-detail-kicker {
  font-size: 0.8rem;
}

.vault-detail-shell .store-detail-title {
  font-size: 1.35rem;
  line-height: 1.02;
}

.vault-detail-shell .store-detail-desc {
  font-size: 0.88rem;
  line-height: 1.38;
  color: rgba(225, 240, 255, 0.9);
}

.vault-detail-stats {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.vault-detail-stats .compact-detail-stat-card {
  padding: 10px 11px;
  min-height: 66px;
}

.vault-detail-stats .compact-detail-stat-card span {
  font-size: 0.68rem;
}

.vault-detail-stats .compact-detail-stat-card strong {
  font-size: 1rem;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
@media (max-width: 1200px) {
  .vault-layout {
    grid-template-columns: 1fr;
  }

  .vault-main-panel,
  .vault-detail-panel {
    min-height: auto;
  }
}

@media (max-width: 760px) {
  .vault-filter-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .vault-catalog-grid {
    grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  }

  .vault-detail-stats {
    grid-template-columns: 1fr;
  }
}


/* Vault polish: center Item Detail header */
.vault-detail-panel > .modern-store-panel-header {
  justify-content: center;
  text-align: center;
}

.vault-detail-panel > .modern-store-panel-header span {
  width: 100%;
  text-align: center;
}

/* Quality equipment support in the ship editor */
.inventory-icon-card.quality-standard,
.equipment-slot.quality-standard { border-color: rgba(121, 176, 217, 0.38); }

.inventory-icon-card.quality-unique,
.equipment-slot.quality-unique {
  border-color: rgba(50, 210, 125, 0.62);
  box-shadow: inset 0 0 12px rgba(50, 210, 125, 0.08);
}

.inventory-icon-card.quality-elite,
.equipment-slot.quality-elite {
  border-color: rgba(181, 108, 255, 0.72);
  box-shadow: inset 0 0 14px rgba(181, 108, 255, 0.10), 0 0 14px rgba(181, 108, 255, 0.08);
}

.inventory-icon-card.quality-legendary,
.equipment-slot.quality-legendary {
  border-color: rgba(255, 181, 48, 0.82);
  box-shadow: inset 0 0 15px rgba(255, 181, 48, 0.10), 0 0 16px rgba(255, 181, 48, 0.10);
}

.inventory-icon-card.quality-godlike,
.equipment-slot.quality-godlike {
  border-color: rgba(255, 84, 84, 0.88);
  box-shadow: inset 0 0 16px rgba(255, 84, 84, 0.12), 0 0 18px rgba(255, 84, 84, 0.12);
}

.inventory-icon-card small,
.equipment-slot small {
  color: rgba(150, 210, 255, 0.82);
  font-size: 0.68rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}


/* ===== Trade Terminal v2 ===== */
.trade-terminal-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.trade-terminal-summary {
  display: grid;
  grid-template-columns: minmax(260px, 1.1fr) minmax(240px, 0.8fr) minmax(280px, 1.1fr);
  gap: 14px;
}

.terminal-card-wide,
.terminal-card-compact {
  min-height: unset;
}

.market-cargo-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  line-height: 1.3;
}

.market-cargo-summary span {
  display: inline-flex;
  gap: 4px;
  padding: 4px 8px;
  border: 1px solid rgba(90, 190, 255, 0.22);
  border-radius: 999px;
  background: rgba(7, 18, 36, 0.75);
}

.trade-terminal-panel {
  min-height: 0;
}

.trade-terminal-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 14px;
}

.trade-terminal-tabs button {
  min-height: 42px;
  border-radius: 12px;
  border: 1px solid rgba(90, 190, 255, 0.42);
  background: linear-gradient(180deg, rgba(4, 13, 26, 0.92), rgba(2, 8, 18, 0.92));
  color: #e7f6ff;
  font-family: inherit;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.trade-terminal-tabs button.active {
  background: linear-gradient(180deg, rgba(42, 103, 190, 0.95), rgba(18, 67, 135, 0.95));
  box-shadow: 0 0 18px rgba(72, 180, 255, 0.16), inset 0 0 14px rgba(173, 221, 255, 0.08);
}

.trade-terminal-card .market-card-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.single-trade-control {
  grid-template-columns: 1fr;
}

.terminal-empty-state {
  display: grid;
  place-items: center;
  min-height: 260px;
  border: 1px solid rgba(90, 190, 255, 0.24);
  border-radius: 16px;
  color: #a9c6e6;
  background: rgba(3, 10, 20, 0.62);
  text-align: center;
  padding: 24px;
}

.profit-good {
  color: #65f0a0 !important;
}

.profit-bad {
  color: #ff778c !important;
}

.hot-trades-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 14px;
}

.hot-trade-card {
  border: 1px solid rgba(90, 190, 255, 0.28);
  border-radius: 16px;
  padding: 14px;
  background:
    radial-gradient(circle at 20% 0%, rgba(0, 210, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(5, 14, 28, 0.94), rgba(2, 8, 18, 0.94));
}

.hot-trade-card.current-origin {
  border-color: rgba(101, 240, 160, 0.52);
  box-shadow: 0 0 18px rgba(101, 240, 160, 0.08);
}

.hot-trade-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.route-badge {
  flex: 0 0 auto;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid rgba(101, 240, 160, 0.42);
  color: #65f0a0;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

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

.hot-trade-stats div {
  border: 1px solid rgba(90, 190, 255, 0.18);
  border-radius: 11px;
  padding: 9px 10px;
  background: rgba(2, 8, 18, 0.72);
}

.hot-trade-stats span,
.hot-trade-footer span {
  display: block;
  color: #95b6d8;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 4px;
}

.hot-trade-stats strong {
  color: #f1f8ff;
  font-size: 0.94rem;
}

.hot-trade-footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  border-top: 1px solid rgba(90, 190, 255, 0.14);
  padding-top: 10px;
}

.hot-trade-footer span {
  margin: 0;
  text-transform: none;
  letter-spacing: 0;
}

@media (max-width: 900px) {
  .trade-terminal-summary {
    grid-template-columns: 1fr;
  }

  .trade-terminal-tabs {
    grid-template-columns: 1fr;
  }

  .trade-terminal-card .market-card-stats,
  .hot-trade-stats {
    grid-template-columns: 1fr;
  }
}


/* ===== Trade Terminal commodity card polish ===== */
.trade-commodity-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}

.trade-commodity-card {
  border: 1px solid rgba(90, 190, 255, 0.26);
  border-radius: 16px;
  padding: 14px;
  background:
    radial-gradient(circle at 20% 0%, rgba(0, 210, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(5, 14, 28, 0.94), rgba(2, 8, 18, 0.94));
  box-shadow: inset 0 0 0 1px rgba(0, 210, 255, 0.04);
}

.trade-commodity-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.trade-commodity-icon {
  background:
    radial-gradient(circle at 50% 40%, rgba(80, 190, 255, 0.18), transparent 62%),
    rgba(4, 16, 34, 0.84);
  border-color: rgba(92, 186, 255, 0.22);
}

.trade-compact-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-bottom: 12px;
}

.trade-compact-stats div {
  border: 1px solid rgba(90, 190, 255, 0.18);
  border-radius: 11px;
  padding: 9px 10px;
  background: rgba(2, 8, 18, 0.72);
  min-width: 0;
}

.trade-compact-stats span {
  display: block;
  color: #95b6d8;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 4px;
}

.trade-compact-stats strong {
  color: #f1f8ff;
  font-size: 0.92rem;
  overflow-wrap: anywhere;
}

.trade-compact-control {
  border-top: 1px solid rgba(90, 190, 255, 0.14);
  padding-top: 11px;
}

.compact-trade-actions {
  grid-template-columns: 72px 1fr 1fr;
}

.hot-trade-card,
.trade-commodity-card {
  position: relative;
  overflow: hidden;
}

.hot-trade-card::before,
.trade-commodity-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.38;
}

.rarity-common {
  border-color: rgba(90, 190, 255, 0.24);
}

.rarity-common::before {
  background: radial-gradient(circle at top right, rgba(90, 190, 255, 0.10), transparent 40%);
}

.rarity-industrial {
  border-color: rgba(74, 223, 154, 0.28);
}

.rarity-industrial::before {
  background: radial-gradient(circle at top right, rgba(74, 223, 154, 0.13), transparent 42%);
}

.rarity-rare {
  border-color: rgba(171, 98, 255, 0.34);
}

.rarity-rare::before {
  background: radial-gradient(circle at top right, rgba(171, 98, 255, 0.16), transparent 44%);
}

.rarity-exotic {
  border-color: rgba(255, 181, 48, 0.42);
  box-shadow: inset 0 0 0 1px rgba(255, 181, 48, 0.07), 0 0 18px rgba(255, 181, 48, 0.08);
}

.rarity-exotic::before {
  background:
    radial-gradient(circle at top right, rgba(255, 181, 48, 0.20), transparent 42%),
    radial-gradient(circle at bottom left, rgba(255, 84, 120, 0.10), transparent 48%);
}

.rarity-exotic .commodity-icon,
.rarity-rare .commodity-icon,
.rarity-industrial .commodity-icon {
  box-shadow: 0 0 14px rgba(90, 190, 255, 0.08);
}

@media (max-width: 760px) {
  .trade-compact-stats {
    grid-template-columns: 1fr;
  }

  .compact-trade-actions {
    grid-template-columns: 1fr;
  }
}

/* ===== Trade terminal compact card refinement ===== */
.trade-commodity-grid {
  grid-template-columns: repeat(auto-fill, minmax(248px, 248px));
  justify-content: start;
  align-content: start;
  gap: 12px;
}

.trade-commodity-card {
  padding: 12px;
}

.trade-commodity-top {
  margin-bottom: 10px;
}

.trade-commodity-card .commodity-cell {
  gap: 10px;
}

.trade-commodity-card .commodity-icon,
.trade-commodity-card .trade-commodity-icon {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  flex: 0 0 40px;
}

.trade-commodity-card .commodity-name {
  font-size: 14px;
  line-height: 1.1;
  margin-bottom: 2px;
}

.trade-commodity-card .commodity-rarity {
  font-size: 11px;
}

.trade-compact-stats {
  gap: 8px;
  margin-bottom: 10px;
}

.trade-compact-stats div {
  padding: 8px 9px;
  border-radius: 10px;
}

.trade-compact-stats span {
  font-size: 0.64rem;
  margin-bottom: 3px;
}

.trade-compact-stats strong {
  font-size: 0.95rem;
  line-height: 1.1;
}

.trade-compact-control {
  padding-top: 9px;
}

.trade-control-header {
  margin-bottom: 6px;
}

.trade-commodity-card .trade-control-header strong {
  font-size: 13px;
}

.trade-commodity-card .trade-control-header span {
  font-size: 12px;
}

.trade-commodity-card .trade-range {
  margin: 0 0 8px;
}

.compact-trade-actions {
  grid-template-columns: 56px 1fr 1fr;
  gap: 8px;
}

.compact-qty {
  height: 34px;
  padding: 6px;
  font-size: 14px;
}

.trade-commodity-card .trade-control-actions button {
  min-height: 34px;
  padding: 7px 9px;
  font-size: 12px;
}

@media (max-width: 1200px) {
  .trade-commodity-grid {
    grid-template-columns: repeat(auto-fill, minmax(230px, 230px));
  }
}

@media (max-width: 760px) {
  .trade-commodity-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== Premium opportunities polish ===== */
.premium-opportunities-grid {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.premium-opportunity-card {
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(120, 210, 255, 0.04), 0 8px 22px rgba(0, 0, 0, 0.18);
}

.premium-opportunity-card::after {
  content: "";
  position: absolute;
  inset: -30% auto auto -40%;
  width: 58%;
  height: 180%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.07), transparent);
  transform: rotate(18deg);
  opacity: 0.38;
  pointer-events: none;
}

.premium-opportunity-card.top-route {
  border-color: rgba(255, 211, 92, 0.62);
  box-shadow: inset 0 0 0 1px rgba(255, 211, 92, 0.08), 0 0 24px rgba(255, 211, 92, 0.10);
}

.top-route-ribbon {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 211, 92, 0.52);
  background: linear-gradient(180deg, rgba(74, 55, 9, 0.95), rgba(34, 24, 5, 0.95));
  color: #ffd35c;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  z-index: 2;
}

.opportunity-route-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  flex-wrap: wrap;
}

.trade-location-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid rgba(90, 190, 255, 0.24);
  background: rgba(6, 17, 34, 0.82);
  color: #dff4ff;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.03em;
}

.trade-location-chip.origin {
  border-color: rgba(101, 240, 160, 0.28);
  box-shadow: inset 0 0 8px rgba(101, 240, 160, 0.06);
}

.trade-location-chip.destination {
  border-color: rgba(90, 190, 255, 0.30);
}

.trade-route-arrow {
  color: rgba(130, 208, 255, 0.82);
  font-weight: 900;
  font-size: 0.9rem;
}

.opportunity-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.opportunity-metric-pill {
  border: 1px solid rgba(90, 190, 255, 0.16);
  border-radius: 11px;
  padding: 9px 10px;
  background: rgba(2, 8, 18, 0.62);
}

.opportunity-metric-pill span {
  display: block;
  color: #95b6d8;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 4px;
}

.opportunity-metric-pill strong {
  color: #f1f8ff;
  font-size: 0.94rem;
}

.opportunity-profit-bar {
  height: 8px;
  margin-top: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(90, 190, 255, 0.12);
}

.opportunity-profit-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(65, 226, 160, 0.88), rgba(101, 240, 160, 1), rgba(186, 255, 216, 0.95));
  box-shadow: 0 0 12px rgba(101, 240, 160, 0.25);
}

.hot-trade-card.rarity-common .opportunity-profit-bar span {
  background: linear-gradient(90deg, rgba(84, 180, 255, 0.82), rgba(107, 213, 255, 0.96));
  box-shadow: 0 0 12px rgba(84, 180, 255, 0.22);
}

.hot-trade-card.rarity-industrial .opportunity-profit-bar span {
  background: linear-gradient(90deg, rgba(74, 223, 154, 0.82), rgba(131, 245, 193, 0.96));
}

.hot-trade-card.rarity-rare .opportunity-profit-bar span {
  background: linear-gradient(90deg, rgba(141, 102, 255, 0.84), rgba(200, 151, 255, 0.98));
  box-shadow: 0 0 14px rgba(171, 98, 255, 0.22);
}

.hot-trade-card.rarity-exotic .opportunity-profit-bar span {
  background: linear-gradient(90deg, rgba(255, 164, 39, 0.9), rgba(255, 211, 92, 1));
  box-shadow: 0 0 15px rgba(255, 181, 48, 0.24);
}

.hot-trade-card .commodity-rarity {
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

@media (max-width: 900px) {
  .premium-opportunities-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== Compact mobile-aware opportunities ===== */
.compact-opportunities-grid {
  grid-template-columns: repeat(auto-fit, minmax(248px, 1fr));
  gap: 12px;
}

.compact-opportunity-card {
  padding: 11px;
  border-radius: 14px;
  min-height: 0;
}

.compact-opportunity-card .top-route-ribbon {
  top: 8px;
  right: 8px;
  padding: 4px 8px;
  font-size: 0.62rem;
}

.compact-hot-trade-top {
  gap: 10px;
  margin-bottom: 9px;
}

.compact-commodity-cell {
  gap: 9px;
}

.compact-opportunity-icon {
  width: 42px;
  height: 42px;
  min-width: 42px;
}

.compact-opportunity-card .commodity-name {
  font-size: 1rem;
  line-height: 1.05;
}

.compact-opportunity-card .commodity-rarity {
  font-size: 0.68rem;
}

.compact-opportunity-route-row {
  gap: 6px;
  margin: 0 0 10px;
}

.compact-opportunity-card .trade-location-chip {
  min-height: 24px;
  padding: 4px 8px;
  font-size: 0.7rem;
}

.compact-hot-trade-stats {
  gap: 8px;
}

.compact-hot-trade-stats div,
.compact-opportunity-metrics .opportunity-metric-pill {
  padding: 8px;
  border-radius: 10px;
}

.compact-hot-trade-stats span,
.compact-hot-trade-footer span,
.compact-opportunity-metrics .opportunity-metric-pill span {
  font-size: 0.66rem;
  margin-bottom: 3px;
}

.compact-hot-trade-stats strong,
.compact-opportunity-metrics .opportunity-metric-pill strong {
  font-size: 0.86rem;
}

.compact-opportunity-metrics {
  gap: 8px;
  margin-top: 8px;
}

.compact-hot-trade-footer {
  margin-top: 10px;
  padding-top: 8px;
  gap: 8px;
}

.premium-opportunity-card {
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.premium-opportunity-card.is-actionable {
  cursor: pointer;
}

.premium-opportunity-card.is-actionable:hover,
.premium-opportunity-card.is-actionable:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(101, 240, 160, 0.58);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.2), 0 0 18px rgba(101, 240, 160, 0.10);
  outline: none;
}

.premium-opportunity-card.route-preview-only {
  cursor: default;
}

.trade-card-focus {
  border-color: rgba(101, 240, 160, 0.58) !important;
  box-shadow: 0 0 0 1px rgba(101, 240, 160, 0.20), 0 0 20px rgba(101, 240, 160, 0.12);
}

@media (max-width: 900px) {
  .compact-opportunities-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }

  .compact-opportunity-card {
    padding: 10px;
  }
}

@media (max-width: 640px) {
  .compact-opportunities-grid {
    grid-template-columns: 1fr;
  }
}


/* ===== Lean Opportunities + Buy stat cleanup ===== */
.buy-compact-stats {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lean-opportunities-grid {
  grid-template-columns: repeat(auto-fill, minmax(220px, 220px));
  justify-content: start;
  gap: 10px;
}

.lean-opportunity-card {
  padding: 9px;
  border-radius: 13px;
}

.lean-hot-trade-top {
  align-items: flex-start;
  margin-bottom: 8px;
}

.lean-opportunity-icon {
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: 10px;
}

.lean-opportunity-card .commodity-name {
  font-size: 0.9rem;
  line-height: 1.05;
}

.lean-opportunity-card .commodity-rarity {
  font-size: 0.62rem;
}

.lean-route-badges {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex: 0 0 auto;
}

.inline-route-ribbon,
.lean-route-badges .route-badge {
  position: static;
  padding: 3px 7px;
  font-size: 0.58rem;
  line-height: 1;
  border-radius: 999px;
  white-space: nowrap;
}

.lean-route-row {
  gap: 5px;
  margin-bottom: 8px;
}

.lean-route-row .trade-location-chip {
  min-height: 22px;
  padding: 3px 7px;
  font-size: 0.64rem;
  max-width: 88px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lean-route-row .trade-route-arrow {
  font-size: 0.72rem;
}

.lean-hot-trade-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.lean-hot-trade-stats div {
  padding: 7px 6px;
  border-radius: 9px;
}

.lean-hot-trade-stats span {
  font-size: 0.58rem;
  margin-bottom: 2px;
}

.lean-hot-trade-stats strong {
  font-size: 0.76rem;
  line-height: 1.05;
}

.lean-hot-trade-footer {
  margin-top: 8px;
  padding-top: 7px;
}

.lean-hot-trade-footer span {
  font-size: 0.66rem;
}

.lean-opportunity-card .top-route-ribbon {
  display: inline-flex;
}

.lean-opportunity-card .opportunity-metrics,
.lean-opportunity-card .opportunity-profit-bar {
  display: none;
}

@media (max-width: 900px) {
  .lean-opportunities-grid {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  }
}

@media (max-width: 640px) {
  .lean-opportunities-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== Trade Terminal Contracts simplification ===== */
.trade-contract-terminal {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
  gap: 12px;
  min-height: 0;
  overflow: hidden;
}

.trade-contract-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
  gap: 10px;
  align-content: start;
  min-height: 0;
  overflow-y: auto;
  padding-right: 4px;
}

.trade-contract-card,
.accepted-trade-card,
.accepted-trade-empty {
  border: 1px solid rgba(90, 190, 255, 0.28);
  border-radius: 14px;
  background:
    radial-gradient(circle at 20% 0%, rgba(0, 210, 255, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(5, 14, 28, 0.94), rgba(2, 8, 18, 0.94));
  padding: 11px;
}

.trade-contract-card.active-contract,
.accepted-trade-card {
  border-color: rgba(101, 240, 160, 0.56);
  box-shadow: 0 0 20px rgba(101, 240, 160, 0.09);
}

.trade-contract-top,
.accepted-trade-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 10px;
}

.trade-contract-rank {
  color: #7fdfff;
  font-weight: 900;
  line-height: 1;
}

.trade-icon-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 10px;
}

.trade-icon-row span {
  min-height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(90, 190, 255, 0.18);
  border-radius: 9px;
  background: rgba(2, 8, 18, 0.72);
  color: #dff4ff;
  font-size: 0.68rem;
  font-weight: 900;
  white-space: nowrap;
}

.accept-trade-btn {
  min-height: 34px;
  padding: 8px 10px;
  font-size: 0.72rem;
  border-radius: 10px;
}

.accepted-trade-panel {
  min-height: 0;
  overflow-y: auto;
}

.accepted-trade-empty {
  min-height: 210px;
  display: grid;
  align-content: center;
  gap: 8px;
  color: #b9c8e8;
}

.accepted-trade-empty h3,
.accepted-trade-card h3 {
  margin: 0;
  color: #e8f7ff;
}

.accepted-trade-empty p,
.accepted-trade-card p {
  margin: 2px 0 0;
  color: #9fb8d6;
  font-size: 0.82rem;
}

.abandon-route-btn {
  width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border-radius: 10px;
  background: rgba(255, 80, 110, 0.12);
  border: 1px solid rgba(255, 120, 150, 0.32);
  color: #ffd9e1;
  font-size: 1.25rem;
}

.accepted-route-strip {
  margin: 8px 0 10px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid rgba(127, 223, 255, 0.18);
  background: rgba(2, 8, 18, 0.68);
  color: #b9d7f4;
  font-size: 0.72rem;
  line-height: 1.35;
}

.accepted-trade-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 10px;
}

.accepted-trade-stats div {
  border: 1px solid rgba(90, 190, 255, 0.18);
  border-radius: 10px;
  background: rgba(2, 8, 18, 0.72);
  padding: 8px;
}

.accepted-trade-stats span {
  display: block;
  color: #95b6d8;
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 3px;
}

.accepted-trade-stats strong {
  color: #f1f8ff;
  font-size: 0.82rem;
}

.accepted-trade-control {
  border-top: 1px solid rgba(90, 190, 255, 0.14);
  padding-top: 10px;
}

.trade-lockin-prompt {
  display: grid;
  gap: 4px;
  margin-bottom: 8px;
  padding: 9px 10px;
  border: 1px solid rgba(101, 240, 160, 0.34);
  border-radius: 10px;
  background:
    linear-gradient(90deg, rgba(101, 240, 160, 0.12), rgba(127, 223, 255, 0.06)),
    rgba(2, 10, 18, 0.82);
  color: #dfffea;
}

.trade-lockin-prompt strong {
  color: #65f0a0;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.trade-lockin-prompt span {
  color: #b9d7f4;
  font-size: 0.72rem;
  line-height: 1.35;
}

.accepted-route-note,
.accepted-profit-line {
  border: 1px solid rgba(90, 190, 255, 0.18);
  border-radius: 10px;
  background: rgba(2, 8, 18, 0.72);
  padding: 10px;
  color: #d7e9ff;
  font-size: 0.82rem;
}

.svg-route.planned-trade-route {
  stroke: rgba(101, 240, 160, 0.98);
  stroke-width: 0.42;
  filter: drop-shadow(0 0 3px rgba(101, 240, 160, 0.9));
}

.svg-planned-trade-ring {
  fill: none;
  stroke: rgba(101, 240, 160, 0.92);
  stroke-width: 0.55;
  filter: drop-shadow(0 0 3px rgba(101, 240, 160, 0.95));
}

.svg-space-node.planned-trade-node {
  fill: #65f0a0;
  filter: drop-shadow(0 0 3px rgba(101, 240, 160, 0.95));
}

.active-trade-hud-card {
  margin-top: 8px;
  padding: 8px;
  border: 1px solid rgba(101, 240, 160, 0.34);
  border-radius: 10px;
  background: rgba(2, 16, 18, 0.66);
  display: grid;
  gap: 3px;
}

.active-trade-hud-card strong {
  color: #f1f8ff;
  font-size: 0.86rem;
}

.active-trade-hud-card span,
.active-trade-hud-card em {
  color: #b9d7f4;
  font-size: 0.74rem;
  font-style: normal;
}

.active-trade-hud-card em {
  color: #65f0a0;
  font-weight: 900;
}

@media (max-width: 900px) {
  .trade-contract-terminal {
    grid-template-columns: 1fr;
  }

  .trade-contract-grid {
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  }
}

@media (max-width: 640px) {
  .trade-contract-grid,
  .trade-icon-row,
  .accepted-trade-stats {
    grid-template-columns: 1fr;
  }
}

/* ===== Trade Terminal: station-only trade cards + ROI panel ===== */
.trade-contract-terminal {
  grid-template-columns: minmax(0, 0.95fr) minmax(300px, 1.05fr);
}

.trade-contract-grid {
  grid-template-columns: 1fr;
  max-width: 430px;
}

.station-trade-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 10px;
}

.station-trade-stats div {
  border: 1px solid rgba(90, 190, 255, 0.18);
  border-radius: 10px;
  background: rgba(2, 8, 18, 0.72);
  padding: 7px;
}

.station-trade-stats span {
  display: block;
  color: #95b6d8;
  font-size: 0.58rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 3px;
}

.station-trade-stats strong {
  color: #f1f8ff;
  font-size: 0.78rem;
}

.accepted-trade-control .accepted-profit-line {
  margin-top: 8px;
  font-size: 0.76rem;
  line-height: 1.35;
}

.accepted-route-strip {
  max-height: 54px;
  overflow: hidden;
}

/* HUD tidy: stop Collect All overlapping active trade/cargo */
.simplified-sector-layout .salvage-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.simplified-sector-layout .salvage-header-row .collect-all-btn {
  position: static;
  right: auto;
  top: auto;
  width: auto;
  min-width: 86px;
  min-height: 24px;
  padding: 4px 8px;
  font-size: 9px;
}

.simplified-sector-layout .sector-cargo-block .hud-text {
  display: grid;
  gap: 5px;
}

.active-trade-hud-card {
  margin-top: 2px;
  padding: 6px;
  gap: 1px;
}

.active-trade-hud-card .active-trade-kicker {
  color: #65f0a0;
  font-size: 0.56rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.active-trade-hud-card strong {
  font-size: 0.72rem;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.active-trade-hud-card em {
  font-size: 0.68rem;
}

@media (max-width: 900px) {
  .trade-contract-terminal {
    grid-template-columns: 1fr;
  }

  .trade-contract-grid {
    max-width: none;
  }
}

/* ===== Global modern scrollbar + compact station trades ===== */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(127, 223, 255, 0.62) rgba(2, 8, 18, 0.34);
}

*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

*::-webkit-scrollbar-track {
  background: rgba(2, 8, 18, 0.34);
  border-radius: 999px;
}

*::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(127, 223, 255, 0.82), rgba(21, 77, 155, 0.82));
  border: 2px solid rgba(2, 8, 18, 0.78);
  border-radius: 999px;
}

*::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(172, 239, 255, 0.95), rgba(42, 110, 208, 0.95));
}

.trade-contract-terminal {
  grid-template-columns: minmax(0, 0.92fr) minmax(320px, 1.08fr);
  gap: 10px;
}

.trade-contract-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  max-width: none;
  overflow-y: visible;
  padding-right: 0;
}

.trade-contract-card {
  padding: 9px;
  border-radius: 12px;
}

.trade-contract-top {
  gap: 7px;
  margin-bottom: 7px;
}

.trade-contract-card .commodity-cell {
  gap: 7px;
  min-width: 0;
}

.trade-contract-card .commodity-icon {
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: 9px;
}

.trade-contract-card .commodity-name {
  font-size: 0.83rem;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.trade-contract-card .commodity-rarity {
  font-size: 0.61rem;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.trade-contract-rank {
  font-size: 0.78rem;
}

.station-trade-stats {
  gap: 5px;
  margin-bottom: 7px;
}

.station-trade-stats div {
  padding: 5px;
  border-radius: 8px;
}

.station-trade-stats span {
  font-size: 0.5rem;
  margin-bottom: 2px;
}

.station-trade-stats strong {
  font-size: 0.66rem;
}

.accept-trade-btn {
  min-height: 29px;
  padding: 6px 8px;
  font-size: 0.66rem;
  border-radius: 9px;
}

.accepted-route-strip {
  max-height: none;
  overflow: visible;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (max-width: 900px) {
  .trade-contract-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .trade-contract-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== Loose cargo sell recovery ===== */
.loose-cargo-panel {
  display: grid;
  gap: 10px;
}

.loose-cargo-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.loose-cargo-tab {
  width: auto;
  min-height: 30px;
  padding: 7px 9px;
  border-radius: 9px;
  border: 1px solid rgba(127, 223, 255, 0.22);
  background: rgba(2, 8, 18, 0.72);
  color: #dff4ff;
  font-size: 0.66rem;
  white-space: nowrap;
}

.loose-cargo-tab.active {
  border-color: rgba(101, 240, 160, 0.52);
  box-shadow: 0 0 14px rgba(101, 240, 160, 0.09);
}

.loose-cargo-tab span {
  color: #7fdfff;
  margin-left: 4px;
}

.loose-cargo-selected {
  padding: 8px;
  border-radius: 10px;
  border: 1px solid rgba(127, 223, 255, 0.16);
  background: rgba(2, 8, 18, 0.58);
}


/* ===== Active objective HUD foundation ===== */
.sector-panel-layout.simplified-sector-layout {
  grid-template-columns: minmax(280px, 1fr) 135px !important;
  gap: 12px !important;
}

.sector-objective-block,
.sector-cargo-block,
.sector-salvage-block {
  min-width: 0;
  min-height: 0;
}

.objective-hud-summary {
  min-height: 74px;
}

.objective-empty {
  height: 100%;
  min-height: 64px;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(127, 223, 255, 0.22);
  border-radius: 10px;
  color: #8fa8c7;
  font-size: 0.76rem;
  background: rgba(2, 8, 18, 0.42);
}

.objective-hud-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(101, 240, 160, 0.38);
  border-radius: 12px;
  padding: 7px;
  background:
    radial-gradient(circle at 15% 10%, rgba(101, 240, 160, 0.14), transparent 34%),
    rgba(2, 12, 20, 0.78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 0 16px rgba(0, 180, 255, 0.08);
}

.objective-hud-top,
.objective-main-row,
.objective-mini-stats {
  display: flex;
  align-items: center;
}

.objective-hud-top {
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 5px;
}

.objective-type-pill {
  color: #65f0a0;
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.objective-map-btn {
  width: auto;
  min-height: 20px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(127, 223, 255, 0.34);
  background: rgba(21, 77, 155, 0.38);
  font-size: 0.58rem;
}

.objective-main-row {
  gap: 7px;
  min-width: 0;
}

.objective-icon {
  width: 30px;
  height: 30px;
  min-width: 30px;
  border-radius: 9px;
}

.objective-copy {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.objective-copy strong {
  color: #f1f8ff;
  font-size: 0.78rem;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.objective-copy span {
  color: #a9c0da;
  font-size: 0.66rem;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.objective-mini-stats {
  gap: 5px;
  margin-top: 6px;
  flex-wrap: wrap;
}

.objective-mini-stats span {
  border: 1px solid rgba(127, 223, 255, 0.18);
  border-radius: 999px;
  padding: 3px 6px;
  color: #cfe6ff;
  background: rgba(0,0,0,0.22);
  font-size: 0.62rem;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .sector-panel-layout.simplified-sector-layout {
    grid-template-columns: minmax(220px, 1fr) 115px !important;
  }

  .objective-mini-stats span {
    font-size: 0.58rem;
    padding: 3px 5px;
  }
}

@media (max-width: 900px) {
  .sector-panel-layout.simplified-sector-layout {
    grid-template-columns: 1fr !important;
  }
}


/* ===== Activity objective placement ===== */
.activity-panel-layout {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(260px, 0.82fr) minmax(320px, 1.18fr);
  gap: 12px;
}

.activity-objective-block,
.activity-log-block {
  min-width: 0;
  min-height: 0;
}

.activity-log-block {
  display: grid;
  grid-template-rows: auto 1fr;
}

.activity-panel .objective-hud-summary {
  min-height: 94px;
}

.activity-panel .objective-hud-card {
  min-height: 94px;
}

.activity-panel .objective-hud-top {
  justify-content: flex-start;
}

.activity-panel .activity-log-feed {
  min-height: 0;
}

@media (max-width: 900px) {
  .activity-panel-layout {
    grid-template-columns: 1fr;
  }
}

/* ===== Inventory drawer overlay ===== */
.inventory-drawer {
  position: absolute;
  left: 342px;
  right: 22px;
  bottom: 206px;
  height: 255px;
  z-index: 4;
  display: none;
  background: rgba(1, 8, 18, 0.88);
  border: 1px solid rgba(90, 190, 255, 0.76);
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(160, 230, 255, 0.08),
    0 0 34px rgba(0, 160, 255, 0.12),
    0 14px 34px rgba(0, 0, 0, 0.42);
  overflow: hidden;
  backdrop-filter: blur(7px);
}

.inventory-drawer.active {
  display: grid;
  grid-template-rows: auto 1fr;
}

.inventory-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(127, 223, 255, 0.18);
}

.drawer-kicker {
  display: block;
  color: #7fdfff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  margin-bottom: 2px;
}

#inventoryDrawerCount {
  color: #eaf8ff;
  font-size: 13px;
}

.inventory-drawer-filters {
  display: flex;
  gap: 7px;
  flex-wrap: nowrap;
}

.inventory-drawer-filters button {
  width: auto;
  min-height: 30px;
  padding: 7px 11px;
  border-radius: 9px;
  font-size: 10px;
  letter-spacing: 0.8px;
  background: rgba(5, 18, 34, 0.86);
  border: 1px solid rgba(90, 190, 255, 0.42);
  color: #cfeaff;
}

.inventory-drawer-filters button.active {
  background: rgba(27, 101, 190, 0.88);
  border-color: rgba(127, 223, 255, 0.95);
  box-shadow: 0 0 14px rgba(127, 223, 255, 0.18);
}

.inventory-drawer-body {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 12px;
  padding: 12px;
}

.inventory-drawer-grid {
  min-height: 0;
  overflow-y: auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap: 9px;
  padding-right: 5px;
  align-content: start;
}

.inventory-drawer-card {
  width: 100%;
  min-height: 58px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 8px;
  text-align: left;
  border-radius: 12px;
  background: rgba(4, 15, 30, 0.9);
  border: 1px solid rgba(90, 190, 255, 0.34);
  color: #f1f8ff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}

.inventory-drawer-card:hover,
.inventory-drawer-card.selected {
  background: rgba(7, 27, 50, 0.96);
  border-color: rgba(127, 223, 255, 0.92);
  box-shadow: 0 0 14px rgba(127, 223, 255, 0.16);
}

.inventory-card-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(127, 223, 255, 0.24);
  overflow: hidden;
}

.inventory-card-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.inventory-card-main {
  min-width: 0;
}

.inventory-card-main strong {
  display: block;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.inventory-card-main small {
  display: block;
  color: #9fc4dd;
  font-size: 10px;
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.inventory-card-qty {
  color: #7fdfff;
  font-size: 12px;
  font-weight: 900;
}

.inventory-drawer-card.quality-unique { border-color: rgba(76, 201, 240, 0.55); }
.inventory-drawer-card.quality-elite { border-color: rgba(155, 92, 255, 0.68); box-shadow: 0 0 12px rgba(155, 92, 255, 0.12); }
.inventory-drawer-card.quality-legendary { border-color: rgba(255, 179, 64, 0.72); box-shadow: 0 0 14px rgba(255, 179, 64, 0.14); }
.inventory-drawer-card.quality-godlike { border-color: rgba(255, 83, 211, 0.8); box-shadow: 0 0 18px rgba(255, 83, 211, 0.18); }
.inventory-drawer-card.rarity-exotic { border-color: rgba(190, 95, 255, 0.78); box-shadow: 0 0 18px rgba(190, 95, 255, 0.14); }
.inventory-drawer-card.rarity-rare { border-color: rgba(70, 162, 255, 0.62); }
.inventory-drawer-card.rarity-industrial { border-color: rgba(90, 215, 190, 0.48); }

.inventory-drawer-detail {
  min-height: 0;
  background: rgba(0, 0, 0, 0.36);
  border: 1px solid rgba(127, 223, 255, 0.22);
  border-radius: 12px;
  padding: 12px;
  overflow-y: auto;
}

.inventory-detail-title {
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid rgba(127, 223, 255, 0.14);
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.inventory-detail-title img {
  width: 48px;
  height: 48px;
  object-fit: contain;
  border-radius: 10px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(127, 223, 255, 0.25);
}

.inventory-detail-title strong {
  display: block;
  color: #f5fbff;
  font-size: 15px;
  line-height: 1.2;
}

.inventory-detail-title span {
  display: block;
  color: #9fc4dd;
  font-size: 11px;
  margin-top: 3px;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

.inventory-detail-stats {
  display: grid;
  gap: 7px;
  color: #cfe5f6;
  font-size: 12px;
  margin-bottom: 12px;
}

.inventory-detail-stats span {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 8px;
  border-radius: 9px;
  background: rgba(5, 18, 34, 0.72);
  border: 1px solid rgba(127, 223, 255, 0.12);
}

.inventory-detail-actions {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.inventory-detail-actions button {
  min-height: 35px;
  padding: 8px 10px;
  font-size: 11px;
}

.inventory-detail-actions .danger-lite {
  background: rgba(92, 24, 40, 0.92);
  border: 1px solid rgba(255, 109, 132, 0.45);
}

.inventory-drawer-empty,
.inventory-detail-empty {
  color: #8fa8c3;
  font-size: 13px;
  padding: 14px;
  border: 1px dashed rgba(127, 223, 255, 0.24);
  border-radius: 12px;
}

.inventory-mini-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

#inventoryItemCountText {
  color: #7fdfff;
  font-size: 11px;
  font-weight: 900;
}

@media (max-width: 900px) {
  .inventory-drawer {
    left: 18px;
    right: 18px;
    bottom: 270px;
    height: 300px;
  }

  .inventory-drawer-body {
    grid-template-columns: 1fr;
  }

  .inventory-drawer-detail {
    max-height: 130px;
  }
}

/* ===== Ship panel inventory launcher + compact inventory refinement ===== */
.hud-command-tabs {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

.hud-command-tabs button {
  min-height: 32px !important;
  padding: 4px 6px !important;
  font-size: 10px !important;
  letter-spacing: 0.7px !important;
}

.command-hud.space-combat-hud {
  align-items: flex-end !important;
}

.command-hud .vertical-stats,
.command-hud .ship-display-panel,
.hud-command-console {
  height: 166px !important;
  min-height: 166px !important;
  max-height: 166px !important;
}

.ship-display-panel-action {
  position: relative;
  flex-direction: column;
  gap: 5px;
  padding: 9px !important;
}

.ship-display-panel-action .hud-ship-image {
  max-height: 112px;
}


.ship-mini-bars.single {
  grid-template-columns: 1fr;
}

.ship-mini-bars.single .ship-mini-bar {
  border-color: rgba(255, 214, 92, 0.35);
}

.ship-mini-bars.single .ship-mini-bar i {
  background: linear-gradient(180deg, rgba(255,214,92,0.98), rgba(0,208,132,0.82));
  box-shadow: 0 0 12px rgba(255,214,92,0.4);
}

.profile-single-grid {
  grid-template-columns: minmax(0, 1fr);
}

.profile-skill-card.solo {
  min-height: 145px;
}

.ship-inventory-btn {
  width: 100%;
  min-height: 28px;
  padding: 6px 8px;
  border-radius: 8px;
  font-size: 10px;
  letter-spacing: 0.9px;
  background: rgba(5, 18, 34, 0.92);
  border: 1px solid rgba(127, 223, 255, 0.5);
  color: #dff4ff;
}

.ship-inventory-btn.active,
.ship-inventory-btn:hover {
  background: rgba(27, 101, 190, 0.9);
  border-color: rgba(127, 223, 255, 0.95);
}

.inventory-drawer {
  left: 50% !important;
  right: auto !important;
  bottom: 194px !important;
  width: min(820px, calc(100% - 40px)) !important;
  height: 252px !important;
  transform: translateX(-50%);
  z-index: 9;
}

.inventory-drawer-head {
  padding: 9px 12px !important;
}

.inventory-drawer-body {
  grid-template-columns: minmax(0, 1fr) 250px !important;
  gap: 10px !important;
  padding: 10px !important;
}

.inventory-drawer-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(3, 51px);
  overflow: hidden !important;
  gap: 7px !important;
  padding-right: 0 !important;
}

.inventory-drawer-card {
  min-height: 51px !important;
  height: 51px;
  grid-template-columns: 34px minmax(0, 1fr) auto !important;
  gap: 6px !important;
  padding: 6px !important;
  border-radius: 10px !important;
}

.inventory-card-icon {
  width: 33px !important;
  height: 33px !important;
  border-radius: 8px !important;
}

.inventory-card-main strong {
  font-size: 11.5px !important;
}

.inventory-card-main small,
.inventory-card-qty {
  font-size: 9.5px !important;
}

.inventory-drawer-detail {
  padding: 10px !important;
  overflow: hidden !important;
}

.inventory-detail-title {
  gap: 8px !important;
  padding-bottom: 8px !important;
  margin-bottom: 8px !important;
}

.inventory-detail-title img {
  width: 40px !important;
  height: 40px !important;
}

.inventory-detail-title strong {
  font-size: 13px !important;
}

.inventory-detail-stats {
  gap: 5px !important;
  font-size: 11px !important;
  margin-bottom: 8px !important;
}

.inventory-detail-stats span {
  padding: 5px 7px !important;
}

.inventory-detail-actions button {
  min-height: 30px !important;
  padding: 6px 8px !important;
  font-size: 10px !important;
}

.inventory-drawer.equipped-mode .inventory-drawer-body {
  grid-template-columns: minmax(0, 1fr) 230px !important;
}

.inventory-drawer.equipped-mode .inventory-drawer-grid {
  display: block !important;
  overflow: hidden !important;
}

.equipped-loadout-stage {
  height: 100%;
  display: grid;
  place-items: center;
}

.equipped-loadout-grid {
  position: relative;
  width: 100%;
  height: 178px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  gap: 7px;
  align-items: center;
}

.equipped-ship-core {
  grid-column: 2;
  grid-row: 1 / span 3;
  align-self: stretch;
  position: relative;
  display: grid;
  place-items: center;
  text-align: center;
  background: radial-gradient(circle at 50% 42%, rgba(43, 151, 255, 0.16), rgba(2, 8, 18, 0.82) 62%);
  border: 1px solid rgba(127, 223, 255, 0.42);
  border-radius: 14px;
  overflow: hidden;
}

.equipped-ship-core img {
  max-width: 118px;
  max-height: 112px;
  object-fit: contain;
  filter: drop-shadow(0 0 14px rgba(127, 223, 255, 0.22));
}

.equipped-ship-core strong,
.equipped-ship-core span {
  position: absolute;
  left: 8px;
  right: 8px;
}

.equipped-ship-core strong {
  bottom: 25px;
  font-size: 12px;
}

.equipped-ship-core span {
  bottom: 9px;
  color: #9fc4dd;
  font-size: 9.5px;
}

.equipped-ship-ring {
  position: absolute;
  width: 122px;
  height: 122px;
  border-radius: 50%;
  border: 1px solid rgba(127, 223, 255, 0.22);
  box-shadow: 0 0 22px rgba(0, 160, 255, 0.08);
}

.equipped-orbit-slot {
  width: 100%;
  height: 52px;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  gap: 1px 6px;
  padding: 5px 7px;
  text-align: left;
  background: rgba(4, 15, 30, 0.92);
  border: 1px solid rgba(90, 190, 255, 0.35);
  border-radius: 10px;
  color: #f1f8ff;
}

.equipped-orbit-slot img {
  grid-row: 1 / span 2;
  width: 31px;
  height: 31px;
  object-fit: contain;
  background: rgba(0,0,0,0.32);
  border-radius: 7px;
}

.equipped-orbit-slot span {
  color: #7fdfff;
  font-size: 8.5px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.equipped-orbit-slot strong {
  min-width: 0;
  font-size: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.equipped-orbit-slot.empty {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-style: dashed;
  color: #7895ad;
}

.compact-loadout-title img {
  object-fit: contain;
}

@media (max-width: 900px) {
  .inventory-drawer {
    width: calc(100% - 24px) !important;
    bottom: 250px !important;
    height: 310px !important;
  }

  .inventory-drawer-body,
  .inventory-drawer.equipped-mode .inventory-drawer-body {
    grid-template-columns: 1fr !important;
  }

  .inventory-drawer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(4, 50px);
  }

  .inventory-drawer-detail {
    display: none;
  }
}

/* ===== Inventory drawer vertical refinement ===== */
.inventory-drawer {
  left: 50% !important;
  right: auto !important;
  bottom: 188px !important;
  width: min(650px, calc(100% - 40px)) !important;
  height: 388px !important;
  transform: translateX(-50%);
}

.inventory-drawer-head {
  align-items: flex-start !important;
  padding: 10px 12px !important;
}

.inventory-drawer-filters {
  gap: 7px !important;
  flex-wrap: wrap !important;
  justify-content: flex-end;
}

.inventory-drawer-filters button {
  min-height: 30px !important;
  padding: 7px 13px !important;
}

.inventory-drawer-body {
  grid-template-columns: minmax(0, 1fr) 218px !important;
  gap: 10px !important;
  padding: 10px 12px 12px !important;
}

.inventory-drawer-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(4, 56px) !important;
  gap: 8px !important;
  overflow: hidden !important;
  padding-right: 0 !important;
  align-content: start !important;
}

.inventory-drawer-card {
  min-height: 56px !important;
  height: 56px !important;
  grid-template-columns: 34px minmax(0, 1fr) auto !important;
  gap: 6px !important;
  padding: 6px !important;
}

.inventory-card-icon {
  width: 33px !important;
  height: 33px !important;
}

.inventory-card-main strong {
  font-size: 11.5px !important;
}

.inventory-card-main small,
.inventory-card-qty {
  font-size: 9.5px !important;
}

.inventory-drawer-detail {
  overflow: hidden !important;
  padding: 10px !important;
}

.inventory-detail-title img {
  width: 38px !important;
  height: 38px !important;
}

.inventory-detail-title strong {
  font-size: 13px !important;
}

.inventory-detail-stats {
  gap: 5px !important;
  font-size: 11px !important;
}

.inventory-detail-stats span {
  padding: 5px 7px !important;
}

.inventory-detail-actions {
  grid-template-columns: 1fr !important;
}

.inventory-detail-actions button {
  min-height: 30px !important;
  padding: 6px 8px !important;
  font-size: 10px !important;
}

.inventory-drawer.equipped-mode {
  width: min(700px, calc(100% - 40px)) !important;
  height: 410px !important;
}

.inventory-drawer.equipped-mode .inventory-drawer-body {
  grid-template-columns: minmax(0, 1fr) 210px !important;
}

.inventory-drawer.equipped-mode .inventory-drawer-grid {
  display: block !important;
}

.equipped-loadout-grid {
  height: 300px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
}

.equipped-ship-core img {
  max-width: 135px !important;
  max-height: 150px !important;
}

.equipped-orbit-slot {
  height: 62px !important;
}

@media (max-width: 900px) {
  .inventory-drawer,
  .inventory-drawer.equipped-mode {
    width: calc(100% - 24px) !important;
    height: 380px !important;
    bottom: 245px !important;
  }

  .inventory-drawer-body,
  .inventory-drawer.equipped-mode .inventory-drawer-body {
    grid-template-columns: 1fr !important;
  }

  .inventory-drawer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(4, 54px) !important;
  }

  .inventory-drawer-detail {
    display: none !important;
  }
}

/* ===== Inventory/loadout quality effect pass ===== */
.inventory-card-main em,
.equipped-orbit-slot em {
  display: block;
  min-width: 0;
  color: #a9d9f5;
  font-style: normal;
  font-size: 9px;
  font-weight: 900;
  line-height: 1.05;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: uppercase;
  letter-spacing: 0.35px;
}

.inventory-drawer-card,
.equipped-orbit-slot {
  position: relative;
  overflow: hidden;
}

.inventory-drawer-card::after,
.equipped-orbit-slot::after {
  content: "";
  position: absolute;
  inset: -35% -25%;
  pointer-events: none;
  opacity: 0;
  transform: translateX(-45%) rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.16), transparent);
}

.inventory-drawer-card.quality-elite,
.equipped-orbit-slot.quality-elite {
  border-color: rgba(151, 98, 255, 0.82) !important;
  box-shadow: 0 0 14px rgba(151, 98, 255, 0.14), inset 0 0 12px rgba(151, 98, 255, 0.05);
}

.inventory-drawer-card.quality-legendary,
.equipped-orbit-slot.quality-legendary {
  border-color: rgba(255, 190, 70, 0.95) !important;
  box-shadow:
    0 0 16px rgba(255, 186, 65, 0.26),
    inset 0 0 18px rgba(255, 186, 65, 0.08);
}

.inventory-drawer-card.quality-legendary::before,
.equipped-orbit-slot.quality-legendary::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(circle at 20% 10%, rgba(255, 232, 152, 0.22), transparent 34%);
}

.inventory-drawer-card.quality-legendary::after,
.equipped-orbit-slot.quality-legendary::after {
  opacity: 0.9;
  animation: inventoryQualitySheen 3.4s ease-in-out infinite;
}

.inventory-drawer-card.quality-godlike,
.equipped-orbit-slot.quality-godlike {
  border-color: rgba(255, 78, 219, 0.98) !important;
  box-shadow:
    0 0 16px rgba(255, 78, 219, 0.32),
    0 0 32px rgba(105, 224, 255, 0.16),
    inset 0 0 22px rgba(255, 78, 219, 0.10);
}

.inventory-drawer-card.quality-godlike::before,
.equipped-orbit-slot.quality-godlike::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 8%, rgba(255,255,255,0.24), transparent 18%),
    radial-gradient(circle at 82% 75%, rgba(127,223,255,0.18), transparent 28%);
  animation: godlikePulse 2.1s ease-in-out infinite;
}

.inventory-drawer-card.quality-godlike::after,
.equipped-orbit-slot.quality-godlike::after {
  opacity: 1;
  animation: inventoryQualitySheen 2.2s ease-in-out infinite;
}

.inventory-drawer-card.quality-legendary .inventory-card-main em,
.equipped-orbit-slot.quality-legendary em {
  color: #ffd36f;
}

.inventory-drawer-card.quality-godlike .inventory-card-main em,
.equipped-orbit-slot.quality-godlike em {
  color: #ff9df0;
  text-shadow: 0 0 8px rgba(255, 91, 225, 0.55);
}

@keyframes inventoryQualitySheen {
  0%, 58% { transform: translateX(-65%) rotate(18deg); opacity: 0; }
  70% { opacity: 0.7; }
  100% { transform: translateX(65%) rotate(18deg); opacity: 0; }
}

@keyframes godlikePulse {
  0%, 100% { opacity: 0.55; }
  50% { opacity: 1; }
}

/* Compact future-proof loadout modes: supports high-slot ships without scrolling. */
.equipped-loadout-stage.wide-slots .equipped-loadout-grid,
.equipped-loadout-stage.many-slots .equipped-loadout-grid {
  grid-template-columns: 1fr 1.25fr 1fr !important;
  grid-auto-rows: minmax(34px, 1fr);
  gap: 6px !important;
}

.equipped-loadout-stage.wide-slots .equipped-orbit-slot,
.equipped-loadout-stage.many-slots .equipped-orbit-slot {
  height: 42px !important;
  grid-template-columns: 25px minmax(0, 1fr);
  padding: 4px 6px;
}

.equipped-loadout-stage.wide-slots .equipped-orbit-slot img,
.equipped-loadout-stage.many-slots .equipped-orbit-slot img {
  width: 24px;
  height: 24px;
}

.equipped-loadout-stage.wide-slots .equipped-orbit-slot span,
.equipped-loadout-stage.many-slots .equipped-orbit-slot span {
  font-size: 7.5px;
}

.equipped-loadout-stage.wide-slots .equipped-orbit-slot strong,
.equipped-loadout-stage.many-slots .equipped-orbit-slot strong {
  font-size: 8.5px;
}

.equipped-loadout-stage.wide-slots .equipped-orbit-slot em,
.equipped-loadout-stage.many-slots .equipped-orbit-slot em {
  display: none;
}

.equipped-loadout-stage.many-slots .equipped-ship-core img {
  max-width: 112px !important;
  max-height: 120px !important;
}

/* ===== Loadout inspection pass: icon-only equipped slots ===== */
.icon-loadout-grid {
  grid-template-columns: minmax(52px, 0.68fr) minmax(150px, 1.15fr) minmax(52px, 0.68fr) !important;
  align-items: center !important;
  justify-items: center !important;
}

.equipped-orbit-slot.loadout-icon-slot {
  width: 50px !important;
  height: 50px !important;
  min-height: 50px !important;
  display: grid !important;
  place-items: center !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: 1fr !important;
  padding: 5px !important;
  border-radius: 12px !important;
  text-align: center !important;
}

.equipped-orbit-slot.loadout-icon-slot img {
  grid-row: auto !important;
  width: 39px !important;
  height: 39px !important;
  border-radius: 9px !important;
  object-fit: contain !important;
  background: rgba(0, 0, 0, 0.36) !important;
}

.equipped-orbit-slot.loadout-icon-slot span,
.equipped-orbit-slot.loadout-icon-slot strong,
.equipped-orbit-slot.loadout-icon-slot em {
  display: none !important;
}

.equipped-orbit-slot.loadout-icon-slot.empty span {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
  color: rgba(127, 223, 255, 0.72) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: 0.6px !important;
}

.equipped-orbit-slot.loadout-icon-slot.selected {
  border-color: rgba(127, 223, 255, 0.96) !important;
  box-shadow:
    0 0 16px rgba(127, 223, 255, 0.26),
    inset 0 0 12px rgba(127, 223, 255, 0.08) !important;
}

.empty-slot-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(127, 223, 255, 0.55);
  border-radius: 10px;
  color: #7fdfff;
  font-size: 12px;
  font-weight: 900;
  background: rgba(0, 0, 0, 0.24);
}

.equipped-loadout-stage.wide-slots .equipped-orbit-slot.loadout-icon-slot,
.equipped-loadout-stage.many-slots .equipped-orbit-slot.loadout-icon-slot {
  width: 41px !important;
  height: 41px !important;
  min-height: 41px !important;
  padding: 4px !important;
}

.equipped-loadout-stage.wide-slots .equipped-orbit-slot.loadout-icon-slot img,
.equipped-loadout-stage.many-slots .equipped-orbit-slot.loadout-icon-slot img {
  width: 32px !important;
  height: 32px !important;
}

.equipped-loadout-stage.many-slots .icon-loadout-grid {
  gap: 4px !important;
}

/* ===== Loadout compact side-bank pass ===== */
.inventory-drawer.equipped-mode {
  width: min(660px, calc(100% - 40px)) !important;
  height: 370px !important;
}

.inventory-drawer.equipped-mode .inventory-drawer-body {
  grid-template-columns: minmax(0, 1fr) 205px !important;
  gap: 9px !important;
}

.inventory-drawer.equipped-mode .inventory-drawer-grid {
  display: block !important;
  overflow: hidden !important;
}

.equipped-loadout-stage {
  align-items: center !important;
}

.equipped-loadout-grid.compact-side-loadout {
  width: 100% !important;
  height: 264px !important;
  display: grid !important;
  grid-template-columns: minmax(54px, 0.55fr) minmax(142px, 1.15fr) minmax(54px, 0.55fr) !important;
  grid-template-rows: 1fr !important;
  gap: 10px !important;
  align-items: center !important;
  justify-items: center !important;
}

.loadout-slot-bank {
  width: 100%;
  height: 100%;
  display: grid;
  align-content: center;
  justify-content: center;
  justify-items: center;
  gap: 9px;
}

.gun-slot-bank {
  grid-template-columns: repeat(auto-fit, minmax(48px, 48px));
}

.attachment-slot-bank {
  grid-template-columns: repeat(auto-fit, minmax(48px, 48px));
}

.equipped-loadout-grid.compact-side-loadout .equipped-ship-core {
  grid-column: auto !important;
  grid-row: auto !important;
  width: 100% !important;
  height: 264px !important;
  min-width: 132px;
}

.equipped-loadout-grid.compact-side-loadout .equipped-ship-core img {
  max-width: 118px !important;
  max-height: 134px !important;
}

.equipped-loadout-grid.compact-side-loadout .equipped-ship-ring {
  width: 118px !important;
  height: 118px !important;
}

.equipped-orbit-slot.loadout-icon-slot {
  width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
}

.equipped-orbit-slot.loadout-icon-slot img {
  width: 37px !important;
  height: 37px !important;
}

.empty-slot-silhouette {
  width: 35px !important;
  height: 35px !important;
  display: block !important;
  opacity: 0.72;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: drop-shadow(0 0 5px rgba(127, 223, 255, 0.28));
}

.empty-gun-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 45h31l7-10h13c3 0 5 2 5 5s-2 5-5 5h-9l-6 9h-7l3-9H29l-6 11h-8l5-11h-6c-3 0-5-2-5-5s2-5 5-5z' fill='%237fdfff' opacity='.78'/%3E%3Cpath d='M20 32h25l5 5H18z' fill='%237fdfff' opacity='.45'/%3E%3C/svg%3E");
}

.empty-attachment-icon {
  background-image: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24 16h32l8 8v32l-8 8H24l-8-8V24z' fill='none' stroke='%237fdfff' stroke-width='7' opacity='.72'/%3E%3Cpath d='M33 28h14v24H33zM28 33h24v14H28z' fill='%237fdfff' opacity='.55'/%3E%3C/svg%3E");
}

.equipped-orbit-slot.loadout-icon-slot.empty span.empty-slot-silhouette {
  display: block !important;
}

.equipped-orbit-slot.loadout-icon-slot.empty:hover .empty-slot-silhouette,
.equipped-orbit-slot.loadout-icon-slot.selected .empty-slot-silhouette {
  opacity: 1;
  filter: drop-shadow(0 0 9px rgba(127, 223, 255, 0.55));
}

.equipped-loadout-stage.wide-slots .equipped-loadout-grid.compact-side-loadout,
.equipped-loadout-stage.many-slots .equipped-loadout-grid.compact-side-loadout {
  grid-template-columns: minmax(78px, 0.72fr) minmax(120px, 1fr) minmax(78px, 0.72fr) !important;
  gap: 7px !important;
}

.equipped-loadout-stage.wide-slots .loadout-slot-bank,
.equipped-loadout-stage.many-slots .loadout-slot-bank {
  grid-template-columns: repeat(auto-fit, minmax(34px, 34px));
  gap: 5px;
}

.equipped-loadout-stage.wide-slots .equipped-orbit-slot.loadout-icon-slot,
.equipped-loadout-stage.many-slots .equipped-orbit-slot.loadout-icon-slot {
  width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 3px !important;
}

.equipped-loadout-stage.wide-slots .equipped-orbit-slot.loadout-icon-slot img,
.equipped-loadout-stage.many-slots .equipped-orbit-slot.loadout-icon-slot img,
.equipped-loadout-stage.wide-slots .empty-slot-silhouette,
.equipped-loadout-stage.many-slots .empty-slot-silhouette {
  width: 27px !important;
  height: 27px !important;
}

.equipped-loadout-stage.wide-slots .equipped-loadout-grid.compact-side-loadout .equipped-ship-core,
.equipped-loadout-stage.many-slots .equipped-loadout-grid.compact-side-loadout .equipped-ship-core {
  height: 232px !important;
}

@media (max-width: 900px) {
  .inventory-drawer.equipped-mode {
    height: 365px !important;
  }

  .equipped-loadout-grid.compact-side-loadout {
    height: 245px !important;
    grid-template-columns: minmax(44px, 0.6fr) minmax(120px, 1fr) minmax(44px, 0.6fr) !important;
  }

  .inventory-drawer.equipped-mode .inventory-drawer-detail {
    display: none !important;
  }
}

/* ===== Bounty board foundation ===== */
.hub-actions {
  grid-template-columns: repeat(4, 1fr);
}

.bounty-screen {
  background:
    radial-gradient(circle at 18% 24%, rgba(255, 70, 110, 0.10), transparent 26%),
    radial-gradient(circle at 76% 18%, rgba(36, 143, 220, 0.12), transparent 30%),
    linear-gradient(to bottom, rgba(2,5,11,0.91), rgba(2,5,11,0.98)),
    url("asteron-prime-space-station-hub.png");
  background-size: cover;
  background-position: center;
}

.bounty-board-layout {
  height: calc(100% - 84px);
  display: grid;
  grid-template-columns: 260px minmax(390px, 1fr) 300px;
  gap: 14px;
  min-height: 0;
}

.bounty-board-summary,
.bounty-contract-panel,
.bounty-detail-panel {
  min-width: 0;
  min-height: 0;
}

.bounty-board-summary {
  display: grid;
  align-content: start;
  gap: 12px;
}

.bounty-board-summary p {
  font-size: 0.82rem;
}

.bounty-board-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(90, 190, 255, 0.16);
  border-radius: 10px;
  padding: 10px;
  background: rgba(2, 8, 18, 0.64);
}

.bounty-board-meta span {
  color: #7fdfff;
  font-weight: 900;
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.bounty-board-meta strong {
  color: #f1f8ff;
}

.bounty-contract-panel,
.bounty-detail-panel {
  background: rgba(0, 0, 0, 0.66);
  border: 1px solid rgba(90, 190, 255, 0.62);
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(160, 230, 255, 0.08), 0 0 24px rgba(0, 160, 255, 0.08);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr;
}

.bounty-panel-header em {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 10px;
  border: 1px solid rgba(255, 211, 107, 0.34);
  border-radius: 999px;
  background: rgba(58, 40, 8, 0.32);
  color: #ffd36b;
  font-style: normal;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-shadow: 0 0 10px rgba(255, 190, 75, 0.34);
  text-transform: uppercase;
}

.bounty-contract-grid {
  padding: 12px;
  display: grid;
  grid-template-rows: repeat(3, minmax(82px, 1fr));
  gap: 10px;
  min-height: 0;
}

.bounty-contract-card {
  width: 100%;
  min-height: 0;
  padding: 10px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  grid-template-rows: 1fr auto;
  align-items: center;
  gap: 6px 10px;
  text-align: left;
  border: 1px solid rgba(90, 190, 255, 0.36);
  border-radius: 12px;
  background:
    radial-gradient(circle at 8% 16%, rgba(255, 83, 112, 0.16), transparent 36%),
    rgba(5, 14, 26, 0.84);
}

.bounty-contract-card:hover,
.bounty-contract-card.selected {
  border-color: rgba(127, 223, 255, 0.9);
  box-shadow: 0 0 18px rgba(0, 170, 255, 0.16);
}

.bounty-contract-card.completed {
  opacity: 0.76;
  border-color: rgba(101, 240, 160, 0.42);
  background:
    radial-gradient(circle at 8% 16%, rgba(101, 240, 160, 0.12), transparent 36%),
    rgba(5, 14, 26, 0.78);
}

.bounty-contract-card.completed .bounty-card-status {
  border-color: rgba(101, 240, 160, 0.48);
  background: rgba(18, 58, 38, 0.64);
  color: #65f0a0;
  box-shadow: 0 0 14px rgba(101, 240, 160, 0.16);
}

.bounty-card-icon,
.bounty-detail-icon,
.objective-bounty-icon {
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 90, 125, 0.55);
  background: rgba(52, 5, 18, 0.62);
  color: #ff8fa7;
  box-shadow: 0 0 14px rgba(255, 60, 100, 0.16);
}

.bounty-card-icon {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  grid-row: 1 / 3;
}

.bounty-card-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.bounty-card-copy strong {
  color: #f1f8ff;
  font-size: 0.88rem;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bounty-card-copy em {
  color: #a9c0da;
  font-style: normal;
  font-size: 0.7rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bounty-card-reward {
  color: #65f0a0;
  font-weight: 900;
  font-size: 0.82rem;
  justify-self: end;
}

.bounty-card-status {
  grid-column: 2 / 4;
  width: fit-content;
  border: 1px solid rgba(127, 223, 255, 0.18);
  border-radius: 999px;
  padding: 3px 8px;
  color: #7fdfff;
  background: rgba(0,0,0,0.22);
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.1em;
}

.bounty-detail-body {
  padding: 12px;
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: 0;
}

.bounty-detail-hero {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(90, 190, 255, 0.16);
}

.bounty-detail-icon,
.objective-bounty-icon {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 12px;
  font-weight: 900;
}

.bounty-detail-hero strong {
  display: block;
  color: #f1f8ff;
  margin-bottom: 3px;
}

.bounty-detail-hero span,
.bounty-detail-note {
  color: #a9c0da;
  font-size: 0.74rem;
  line-height: 1.35;
}

.bounty-detail-stat {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(90, 190, 255, 0.16);
  border-radius: 10px;
  padding: 9px 10px;
  background: rgba(2, 8, 18, 0.58);
}

.bounty-detail-stat span {
  color: #7fdfff;
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.bounty-detail-stat strong {
  color: #f1f8ff;
  font-size: 0.78rem;
  text-align: right;
}

.bounty-accept-btn {
  min-height: 42px;
}

.bounty-objective-card {
  border-color: rgba(255, 90, 125, 0.42);
  background:
    radial-gradient(circle at 15% 10%, rgba(255, 83, 112, 0.16), transparent 34%),
    rgba(2, 12, 20, 0.78);
}

.bounty-pill {
  color: #ff8fa7;
}

@media (max-width: 900px) {
  .hub-actions {
    grid-template-columns: 1fr;
  }

  .bounty-board-layout {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .bounty-contract-grid {
    grid-template-rows: none;
  }
}

.bounty-cancel-btn {
  margin-top: 9px;
  background: rgba(95, 22, 32, 0.86);
  border: 1px solid rgba(255, 118, 132, 0.62);
  color: #ffe5e8;
}

.bounty-cancel-btn:hover {
  background: rgba(135, 35, 48, 0.94);
}

.bounty-cancel-btn {
  margin-top: 9px;
  background: rgba(95, 22, 32, 0.86);
  border: 1px solid rgba(255, 118, 132, 0.62);
  color: #ffe5e8;
}

.bounty-cancel-btn:hover {
  background: rgba(135, 35, 48, 0.94);
}

/* ===== Objectives separated from Activity HUD tab ===== */
.objectives-panel,
.activity-panel {
  min-height: 0;
}

.objective-panel-layout {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.objectives-panel .activity-objective-block {
  min-height: 0;
  display: grid;
  grid-template-rows: auto 1fr;
}

.objectives-panel .objective-hud-summary {
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.objectives-panel .objective-hud-card {
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
  align-content: start;
  padding: 10px;
}

.objectives-panel .objective-main-row {
  align-self: center;
}

.objectives-panel .objective-bounty-icon,
.objectives-panel .objective-icon {
  width: 44px;
  height: 44px;
  min-width: 44px;
}

.objectives-panel .objective-copy strong {
  font-size: 0.92rem;
}

.objectives-panel .objective-copy span {
  font-size: 0.76rem;
}

.objectives-panel .objective-mini-stats span {
  font-size: 0.68rem;
  padding: 5px 8px;
}

.activity-log-only-block {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: auto 1fr;
}

.activity-panel .activity-log-feed {
  height: 100%;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
}

.activity-panel .activity-log-item {
  padding: 5px 0 6px;
}

/* ===== Bounty reward claim flow ===== */
.hub-actions button {
  position: relative;
  overflow: hidden;
}

.hub-action-badge {
  display: none;
  position: absolute;
  right: 10px;
  top: 8px;
  align-items: center;
  justify-content: center;
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(255, 210, 84, 0.16);
  border: 1px solid rgba(255, 210, 84, 0.78);
  color: #ffe58c;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  box-shadow: 0 0 16px rgba(255, 210, 84, 0.28);
}

.hub-actions button.reward-ready {
  border-color: rgba(255, 210, 84, 0.9);
  box-shadow: 0 0 22px rgba(255, 210, 84, 0.22), 0 0 34px rgba(0, 180, 255, 0.12);
}

.bounty-contract-card.ready-to-claim {
  border-color: rgba(255, 210, 84, 0.9);
  box-shadow: 0 0 22px rgba(255, 210, 84, 0.16), inset 0 1px 0 rgba(255, 235, 160, 0.12);
}

.bounty-detail-hero.reward-ready {
  border: 1px solid rgba(255, 210, 84, 0.62);
  background: linear-gradient(135deg, rgba(255, 210, 84, 0.1), rgba(0, 160, 255, 0.04));
  border-radius: 13px;
  padding: 12px;
}

.bounty-detail-hero.completed {
  border: 1px solid rgba(101, 240, 160, 0.34);
  background: linear-gradient(135deg, rgba(101, 240, 160, 0.08), rgba(0, 160, 255, 0.03));
}

.bounty-claim-btn {
  margin-top: 12px;
  background: linear-gradient(135deg, #d9a726, #7f4e00);
  border: 1px solid rgba(255, 232, 145, 0.78);
  box-shadow: 0 0 18px rgba(255, 210, 84, 0.22);
}

.bounty-claim-btn:hover {
  background: linear-gradient(135deg, #f0bd3a, #9b6207);
}

.reward-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(circle at center, rgba(255, 210, 84, 0.08), rgba(0, 0, 0, 0.72));
  transition: opacity 180ms ease;
}

.reward-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

.reward-modal {
  width: min(460px, calc(100vw - 32px));
  background: rgba(4, 12, 24, 0.96);
  border: 1px solid rgba(127, 223, 255, 0.72);
  border-radius: 18px;
  padding: 24px;
  text-align: center;
  box-shadow: 0 0 48px rgba(0, 160, 255, 0.24), 0 0 28px rgba(255, 210, 84, 0.16);
  transform: translateY(12px) scale(0.96);
  animation: rewardModalIn 340ms ease forwards;
}

.reward-kicker {
  color: #7fdfff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.reward-modal h2 {
  margin: 8px 0 16px;
  font-size: 24px;
}

.reward-credit-pulse {
  margin: 0 auto 18px;
  padding: 14px 18px;
  width: fit-content;
  border-radius: 999px;
  color: #ffe58c;
  font-size: 28px;
  font-weight: 1000;
  letter-spacing: 1px;
  background: rgba(255, 210, 84, 0.1);
  border: 1px solid rgba(255, 210, 84, 0.55);
  box-shadow: 0 0 26px rgba(255, 210, 84, 0.24);
  animation: rewardCreditPulse 900ms ease-in-out infinite alternate;
}

.reward-loot-list {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
}

.reward-loot-card,
.reward-no-loot {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(7, 18, 34, 0.82);
  border: 1px solid rgba(127, 223, 255, 0.32);
  color: #dff4ff;
  font-size: 13px;
  font-weight: 900;
}

.reward-loot-card img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.reward-modal button {
  max-width: 220px;
  margin: 0 auto;
}

@keyframes rewardModalIn {
  to { transform: translateY(0) scale(1); }
}

@keyframes rewardCreditPulse {
  from { transform: scale(1); filter: brightness(1); }
  to { transform: scale(1.035); filter: brightness(1.2); }
}

/* ===== Ship disabled / hangar repair consequence ===== */
.repair-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(circle at center, rgba(255, 84, 112, 0.12), rgba(0, 0, 0, 0.76));
  transition: opacity 180ms ease;
}

.repair-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

.repair-modal {
  width: min(470px, calc(100vw - 32px));
  background: rgba(4, 12, 24, 0.97);
  border: 1px solid rgba(255, 84, 112, 0.72);
  border-radius: 18px;
  padding: 24px;
  text-align: center;
  box-shadow:
    0 0 48px rgba(255, 84, 112, 0.2),
    0 0 30px rgba(0, 160, 255, 0.12);
  transform: translateY(12px) scale(0.96);
  animation: rewardModalIn 340ms ease forwards;
}

.danger-kicker {
  color: #ff8aa2;
}

.repair-modal h2 {
  margin: 8px 0 12px;
  font-size: 25px;
}

.repair-modal p {
  margin: 0 0 14px;
  color: #d5e2f5;
  line-height: 1.45;
}

.repair-modal-stat,
.repair-loss-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(7, 18, 34, 0.82);
  border: 1px solid rgba(127, 223, 255, 0.28);
  color: #dff4ff;
  font-size: 13px;
}

.repair-modal-stat {
  margin-bottom: 10px;
  border-color: rgba(255, 84, 112, 0.48);
}

.repair-modal-stat strong,
.repair-loss-row strong {
  color: #ffb6c4;
}

.repair-loss-list {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
}

.repair-loss-row.muted strong {
  color: #7fdfff;
}

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

.repair-modal-actions button {
  min-height: 42px;
}

@media (max-width: 640px) {
  .repair-modal-actions {
    grid-template-columns: 1fr;
  }
}

/* ===== Pilot / Skill XP Foundation ===== */
.hud-progress-strip {
  display: grid;
  grid-template-columns: 58px 1fr 1fr;
  gap: 7px;
  align-items: center;
  margin-bottom: 7px;
  min-height: 34px;
}

.hud-pilot-level,
.mini-xp-card {
  background: rgba(5, 14, 28, 0.86);
  border: 1px solid rgba(127, 223, 255, 0.28);
  border-radius: 9px;
  box-shadow: inset 0 1px 0 rgba(160, 230, 255, 0.08);
}

.hud-pilot-level {
  height: 34px;
  display: grid;
  place-items: center;
  line-height: 1;
}

.hud-pilot-level span {
  color: #7fdfff;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.7px;
}

.hud-pilot-level strong {
  color: #fff;
  font-size: 15px;
}

.mini-xp-card {
  padding: 5px 7px;
  display: grid;
  gap: 2px;
  min-width: 0;
}

.mini-xp-card span,
.mini-xp-card em {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mini-xp-card span {
  color: #dff4ff;
  font-size: 10px;
  font-weight: 900;
}

.mini-xp-card em {
  color: #8da7c9;
  font-size: 8.5px;
  font-style: normal;
}

.mini-xp-track,
.profile-xp-track {
  height: 5px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,0.11);
  box-shadow: inset 0 0 8px rgba(0,0,0,0.5);
}

.mini-xp-track i,
.profile-xp-track i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(127,223,255,0.9), rgba(255,214,92,0.95));
  box-shadow: 0 0 12px rgba(127,223,255,0.45);
}

.pilot-profile-body {
  height: calc(100% - 84px);
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 14px;
  min-height: 0;
}

.profile-overview-card,
.profile-skill-card,
.profile-tree-placeholder {
  background: rgba(0, 0, 0, 0.66);
  border: 1px solid rgba(90, 190, 255, 0.62);
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(160, 230, 255, 0.08), 0 0 24px rgba(0, 160, 255, 0.08);
}

.profile-overview-card {
  padding: 18px;
  display: grid;
  gap: 12px;
}

.profile-overview-card > div:first-child {
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.profile-overview-card strong {
  font-size: 44px;
  line-height: 1;
}

.profile-overview-card em,
.profile-skill-head em {
  color: #9eb5d2;
  font-style: normal;
  font-size: 12px;
}

.profile-overview-card p,
.profile-skill-card p,
.profile-tree-placeholder p {
  margin: 0;
  color: #b9c8e8;
  line-height: 1.45;
  font-size: 13px;
}

.profile-xp-track {
  height: 9px;
}

.profile-xp-track.pilot {
  height: 11px;
}

.profile-skill-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  min-height: 0;
}

.profile-skill-card {
  padding: 16px;
  display: grid;
  gap: 12px;
  align-content: start;
}

.profile-skill-head {
  display: flex;
  gap: 12px;
  align-items: center;
}

.profile-skill-head > span {
  width: 46px;
  height: 46px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  background: radial-gradient(circle at 35% 30%, rgba(255,255,255,0.18), transparent 25%), rgba(10, 28, 52, 0.92);
  border: 1px solid rgba(127, 223, 255, 0.38);
  font-weight: 900;
}

.profile-skill-head strong {
  display: block;
  color: #dff4ff;
  font-size: 18px;
}

.profile-tree-placeholder {
  padding: 16px;
}

.profile-tree-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  color: #7fdfff;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.profile-tree-head strong {
  color: #ffda79;
}

.level-up-overlay {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.22s ease;
}

.level-up-overlay.active {
  opacity: 1;
}

.level-up-modal {
  min-width: 280px;
  max-width: 420px;
  text-align: center;
  padding: 24px;
  border-radius: 18px;
  background: rgba(2, 8, 18, 0.94);
  border: 1px solid rgba(255, 214, 92, 0.75);
  box-shadow: 0 0 42px rgba(255, 214, 92, 0.22), 0 24px 80px rgba(0,0,0,0.8);
}

.level-up-modal h2 {
  margin: 8px 0;
  color: #ffda79;
  letter-spacing: 2px;
}

.level-up-modal p {
  margin: 0;
  color: #c7d3ea;
}

@media (max-width: 900px) {
  .hud-progress-strip {
    grid-template-columns: 52px 1fr 1fr;
  }

  .profile-skill-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== HUD progression + planet hub tidy ===== */
.hub-actions {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.hub-actions button {
  min-height: 72px !important;
  padding: 12px 10px !important;
  font-size: clamp(14px, 1.45vw, 18px) !important;
  letter-spacing: 0.8px !important;
}

.ship-display-panel-action {
  display: grid !important;
  grid-template-columns: 1fr 32px;
  grid-template-rows: 1fr auto;
  align-items: center;
  justify-items: center;
  column-gap: 6px;
  row-gap: 5px;
}

.ship-display-panel-action .hud-ship-image {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  max-height: 108px !important;
}

.ship-mini-progress {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
  align-self: stretch;
  width: 32px;
  display: grid;
  grid-template-rows: 34px 1fr;
  gap: 5px;
  opacity: 0.92;
}

.ship-mini-level {
  display: grid;
  place-items: center;
  background: rgba(5, 14, 28, 0.78);
  border: 1px solid rgba(127, 223, 255, 0.34);
  border-radius: 8px;
  line-height: 1;
}

.ship-mini-level span {
  color: #7fdfff;
  font-size: 5.8px;
  font-weight: 900;
  letter-spacing: 0.45px;
}

.ship-mini-level strong {
  color: #ffffff;
  font-size: 14px;
  font-weight: 900;
}

.ship-mini-bars {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  min-height: 0;
}

.ship-mini-bar {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  height: 100%;
  min-height: 58px;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(127, 223, 255, 0.22);
  box-shadow: inset 0 0 8px rgba(0,0,0,0.55);
}

.ship-mini-bar i {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  min-height: 2px;
  background: linear-gradient(180deg, rgba(127,223,255,0.95), rgba(27,101,190,0.92));
  box-shadow: 0 0 10px rgba(127,223,255,0.45);
}

.ship-mini-bar span {
  position: relative;
  z-index: 1;
  padding-bottom: 3px;
  color: #dff4ff;
  font-size: 8px;
  font-weight: 900;
  text-shadow: 0 1px 3px rgba(0,0,0,0.9);
}


.ship-mini-bars.single {
  grid-template-columns: 1fr;
}

.ship-mini-bars.single .ship-mini-bar {
  border-color: rgba(255, 214, 92, 0.35);
}

.ship-mini-bars.single .ship-mini-bar i {
  background: linear-gradient(180deg, rgba(255,214,92,0.98), rgba(0,208,132,0.82));
  box-shadow: 0 0 12px rgba(255,214,92,0.4);
}

.profile-single-grid {
  grid-template-columns: minmax(0, 1fr);
}

.profile-skill-card.solo {
  min-height: 145px;
}

.ship-inventory-btn {
  grid-column: 1 / 3;
  grid-row: 2 / 3;
}

.hud-command-console .hud-progress-strip {
  display: none !important;
}

@media (max-width: 900px) {
  .hub-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ===== Sector scan foundation ===== */
.sector-scan-panel {
  position: absolute;
  top: 16px;
  right: 86px;
  z-index: 6;
  width: min(410px, calc(100% - 170px));
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas:
    "title actions"
    "status status";
  gap: 7px 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid rgba(127, 223, 255, 0.28);
  border-radius: 14px;
  background: rgba(3, 10, 22, 0.72);
  box-shadow: 0 0 22px rgba(0, 150, 255, 0.10);
  backdrop-filter: blur(8px);
}

.sector-scan-title {
  grid-area: title;
  color: #7fdfff;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  white-space: nowrap;
}

.sector-scan-actions {
  grid-area: actions;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.sector-scan-btn {
  --scan-progress: 0;
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 32px;
  padding: 8px 8px;
  overflow: hidden;
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  border: 1px solid rgba(127, 223, 255, 0.48);
  background: linear-gradient(180deg, rgba(8, 28, 52, 0.96), rgba(4, 13, 28, 0.96));
  color: #dff4ff;
}

.sector-scan-btn::before {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 4px;
  transform-origin: left center;
  transform: scaleX(var(--scan-progress));
  opacity: 0.95;
  transition: transform 0.18s linear;
}

.sector-scan-btn span {
  position: relative;
  z-index: 1;
  display: inline-block;
  white-space: nowrap;
}

.sector-scan-btn:disabled {
  opacity: 0.78;
  cursor: wait;
  border-color: rgba(110, 135, 160, 0.55);
}

.sector-scan-btn.cooldown {
  color: #ffd36b;
  border-color: rgba(255, 211, 107, 0.42);
  background: linear-gradient(180deg, rgba(50, 34, 9, 0.96), rgba(8, 13, 24, 0.96));
  text-shadow: 0 0 8px rgba(255, 190, 75, 0.32);
}

.scan-ally-btn {
  border-color: rgba(103, 242, 160, 0.5);
}

.scan-ally-btn::before {
  background: linear-gradient(90deg, rgba(103, 242, 160, 0.95), rgba(103, 242, 160, 0.32));
  box-shadow: 0 0 10px rgba(103, 242, 160, 0.55);
}

.scan-bot-btn {
  border-color: rgba(255, 211, 107, 0.5);
}

.scan-bot-btn::before {
  background: linear-gradient(90deg, rgba(255, 211, 107, 0.95), rgba(255, 211, 107, 0.30));
  box-shadow: 0 0 10px rgba(255, 211, 107, 0.55);
}

.scan-enemy-btn {
  border-color: rgba(255, 79, 102, 0.5);
}

.scan-enemy-btn::before {
  background: linear-gradient(90deg, rgba(255, 79, 102, 0.95), rgba(255, 79, 102, 0.30));
  box-shadow: 0 0 10px rgba(255, 79, 102, 0.55);
}

.sector-scan-status {
  grid-area: status;
  color: #d8ecff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.5px;
  white-space: nowrap;
  text-align: right;
}

.sector-scan-status.active {
  color: #ffd36b;
  text-shadow: 0 0 10px rgba(255, 190, 75, 0.38);
}

.svg-scan-marker-layer,
.svg-scan-marker {
  pointer-events: none;
}

.svg-scan-marker .scan-pulse {
  fill: none;
  stroke-width: 0.5;
  opacity: 0.92;
  animation: sectorScanPulse 1.25s ease-out infinite;
}

.svg-scan-marker .scan-ring {
  fill: rgba(255,255,255,0.04);
  stroke-width: 0.42;
  opacity: 0.98;
}

.svg-scan-marker .scan-count {
  font-size: 2.1px;
  font-weight: 900;
  paint-order: stroke;
  stroke: rgba(0,0,0,0.9);
  stroke-width: 0.38px;
}

.svg-scan-marker.scan-bot .scan-pulse,
.svg-scan-marker.scan-bot .scan-ring {
  stroke: #ffd36b;
  filter: drop-shadow(0 0 3px rgba(255, 211, 107, 0.95));
}

.svg-scan-marker.scan-bot .scan-count {
  fill: #ffd36b;
}

.svg-scan-marker.scan-ally .scan-pulse,
.svg-scan-marker.scan-ally .scan-ring {
  stroke: #67f2a0;
  filter: drop-shadow(0 0 3px rgba(103, 242, 160, 0.95));
}

.svg-scan-marker.scan-ally .scan-count {
  fill: #67f2a0;
}

.svg-scan-marker.scan-enemy .scan-pulse,
.svg-scan-marker.scan-enemy .scan-ring {
  stroke: #ff4f66;
  filter: drop-shadow(0 0 3px rgba(255, 79, 102, 0.95));
}

.svg-scan-marker.scan-enemy .scan-count {
  fill: #ff4f66;
}

@keyframes sectorScanPulse {
  0% { r: 1.6; opacity: 0.95; }
  100% { r: 4.8; opacity: 0; }
}

@media (max-width: 900px) {
  .sector-scan-panel {
    top: 76px;
    right: 50%;
    transform: translateX(50%);
    width: min(92vw, 420px);
  }

  .sector-scan-status {
    white-space: normal;
    text-align: center;
  }
}

/* ===== Trade Terminal final polish pass ===== */
.market-screen {
  padding: 20px 28px 22px;
}

.market-header {
  margin-bottom: 16px;
}

.market-header h2 {
  font-size: 36px;
  line-height: 1;
}

.trade-terminal-layout {
  gap: 14px;
  height: calc(100% - 84px);
}

.trade-terminal-summary {
  grid-template-columns: 1.15fr 0.82fr 1.08fr;
  gap: 12px;
}

.trade-terminal-summary .terminal-card {
  padding: 14px 16px;
  min-height: 92px;
}

.trade-terminal-summary .terminal-card h3 {
  margin-bottom: 8px;
  font-size: 1rem;
}

.trade-terminal-summary .terminal-card p {
  font-size: 0.9rem;
  line-height: 1.35;
}

.trade-terminal-summary .market-wallet {
  gap: 8px;
}

.trade-terminal-summary .market-wallet strong {
  font-size: 1.05rem;
}

.trade-terminal-panel {
  padding: 12px 14px 14px;
}

.phase-one-market-header {
  padding-bottom: 8px;
}

.market-goods {
  padding: 10px 0 0;
  overflow: hidden;
}

.trade-contract-terminal {
  grid-template-columns: minmax(0, 0.85fr) minmax(360px, 1.15fr);
  gap: 12px;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.trade-contract-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  align-content: start;
  overflow: visible;
}

.compact-station-card {
  padding: 9px;
  min-height: 128px;
  display: grid;
  grid-template-rows: auto auto auto;
  gap: 7px;
}

.slim-contract-top {
  align-items: center;
  margin-bottom: 0;
}

.trade-margin-chip {
  flex: 0 0 auto;
  padding: 4px 7px;
  border-radius: 999px;
  border: 1px solid rgba(101, 240, 160, 0.22);
  background: rgba(2, 18, 14, 0.72);
  font-size: 0.68rem;
  font-weight: 950;
  white-space: nowrap;
}

.station-trade-line {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 8px;
  border: 1px solid rgba(90, 190, 255, 0.15);
  border-radius: 10px;
  background: rgba(2, 8, 18, 0.6);
  color: #95b6d8;
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.station-trade-line strong {
  color: #f1f8ff;
  font-size: 0.72rem;
  letter-spacing: 0;
}

.compact-station-card .accept-trade-btn {
  min-height: 30px;
  margin-top: 0;
}

.accepted-trade-panel {
  overflow: hidden;
  min-height: 0;
}

.accepted-trade-card,
.accepted-trade-empty {
  height: 100%;
  max-height: 100%;
  overflow: hidden;
}

.selected-trade-panel,
.cargo-ready-panel {
  padding: 12px;
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  gap: 10px;
}

.trade-panel-kicker {
  color: #7fdfff;
  font-size: 0.65rem;
  font-weight: 950;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.compact-accepted-header {
  margin: 0;
  align-items: center;
}

.compact-accepted-header h3 {
  font-size: 1.1rem;
  line-height: 1.05;
}

.compact-accepted-header p {
  font-size: 0.75rem;
}

.compact-stat-row {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  margin: 0;
}

.compact-stat-row div {
  padding: 7px 8px;
}

.compact-stat-row span {
  font-size: 0.55rem;
}

.compact-stat-row strong {
  font-size: 0.75rem;
}

.compact-accepted-control {
  padding-top: 8px;
  display: grid;
  gap: 8px;
  min-height: 0;
}

.trade-quantity-panel {
  display: grid;
  gap: 7px;
}

.trade-qty-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.trade-qty-row label {
  color: #e8f7ff;
  font-weight: 900;
  font-size: 0.82rem;
}

.trade-summary-pill {
  color: #b9d7f4;
  font-size: 0.72rem;
  font-weight: 800;
  white-space: nowrap;
}

.trade-stepper-row {
  display: grid;
  grid-template-columns: 32px minmax(54px, 76px) 32px repeat(3, minmax(48px, 0.62fr)) minmax(96px, 1.15fr);
  gap: 7px;
  align-items: center;
}

.trade-step-btn,
.trade-quick-btn,
.trade-primary-action {
  min-height: 34px;
  padding: 7px 9px;
  border-radius: 10px;
  font-size: 0.68rem;
}

.trade-step-btn,
.trade-quick-btn {
  background: rgba(6, 18, 34, 0.86);
  border: 1px solid rgba(90, 190, 255, 0.24);
  color: #dff4ff;
}

.trade-primary-action {
  background: linear-gradient(180deg, rgba(42, 103, 190, 0.96), rgba(22, 85, 168, 0.96));
}

.trade-qty-input {
  width: 100%;
  margin: 0;
  min-height: 34px;
  padding: 7px;
  font-size: 0.78rem;
}

.compact-return-line {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  padding: 8px 9px;
  font-size: 0.72rem;
  line-height: 1.25;
}

.compact-return-line span {
  color: #a9c6e6;
}

.compact-return-line strong {
  color: #f1f8ff;
}

.compact-cargo-tabs {
  gap: 6px;
  margin: 0;
  max-height: 38px;
  overflow: hidden;
}

.compact-cargo-tabs .loose-cargo-tab {
  min-height: 30px;
  padding: 6px 9px;
  font-size: 0.68rem;
}

.compact-trade-empty {
  min-height: 0;
  height: 100%;
}

@media (max-width: 900px) {
  .trade-terminal-summary,
  .trade-contract-terminal {
    grid-template-columns: 1fr;
  }

  .trade-contract-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .trade-stepper-row {
    grid-template-columns: 32px minmax(54px, 1fr) 32px repeat(3, 48px);
  }

  .trade-primary-action {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .trade-contract-grid,
  .compact-stat-row {
    grid-template-columns: 1fr;
  }

  .trade-stepper-row {
    grid-template-columns: 32px 1fr 32px;
  }

  .trade-quick-btn,
  .trade-primary-action {
    grid-column: auto;
  }
}


/* Trade Terminal minor polish: clean quantity input + hide empty preview */
.trade-qty-input {
  appearance: textfield;
  -moz-appearance: textfield;
  text-align: center;
}

.trade-qty-input::-webkit-outer-spin-button,
.trade-qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.accepted-profit-line.is-empty {
  display: none;
}

/* Trade Terminal overlap fix: keep compact station cards contained */
.compact-station-card,
.trade-contract-card {
  min-width: 0;
  overflow: hidden;
}

.slim-contract-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  width: 100%;
}

.slim-contract-top .commodity-cell,
.slim-contract-top .compact-commodity-cell {
  min-width: 0;
  overflow: hidden;
}

.slim-contract-top .commodity-cell > div:not(.commodity-icon),
.slim-contract-top .compact-commodity-cell > div:not(.commodity-icon) {
  min-width: 0;
  overflow: hidden;
}

.compact-station-card .commodity-name,
.compact-station-card .commodity-rarity {
  display: block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.compact-station-card .trade-margin-chip {
  max-width: 62px;
  text-align: center;
}

.compact-station-card .station-trade-line {
  min-width: 0;
  overflow: hidden;
}

.compact-station-card .station-trade-line span {
  min-width: 0;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .trade-contract-terminal {
    grid-template-columns: minmax(0, 0.78fr) minmax(360px, 1.22fr);
  }

  .compact-station-card .trade-margin-chip {
    max-width: 56px;
    padding-left: 5px;
    padding-right: 5px;
  }
}

/* ===== Trade Terminal Market foundation ===== */
.trade-terminal-summary {
  grid-template-columns: minmax(260px, 1fr) minmax(220px, 340px);
  align-items: stretch;
}

.market-list-panel.trade-terminal-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
}

.market-goods {
  min-height: 0;
  overflow: hidden;
}

.map-one-market-terminal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(308px, 350px);
  gap: 12px;
  height: 100%;
  min-height: 0;
  align-items: stretch;
}

.market-board-panel,
.market-builder-panel {
  min-width: 0;
  border: 1px solid rgba(90, 190, 255, 0.34);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(70, 205, 255, 0.08), transparent 16%, transparent 84%, rgba(70, 205, 255, 0.05)),
    linear-gradient(180deg, rgba(5, 14, 28, 0.94), rgba(2, 8, 18, 0.94));
  box-shadow: inset 0 1px 0 rgba(160, 230, 255, 0.07), 0 10px 24px rgba(0, 0, 0, 0.16);
}

.market-board-table-wrap {
  overflow: auto;
  height: 100%;
  border-radius: 8px;
}

.market-board-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 620px;
  table-layout: fixed;
}

.market-board-table th:first-child,
.market-board-table td:first-child {
  width: 34%;
}

.market-board-table th:not(:first-child),
.market-board-table td:not(:first-child) {
  width: 22%;
}

.market-board-table th,
.market-board-table td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(90, 190, 255, 0.14);
  text-align: left;
  color: #dbeeff;
  white-space: nowrap;
}

.market-board-table th {
  color: #7fdfff;
  font-size: 0.68rem;
  font-weight: 950;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: rgba(2, 8, 18, 0.82);
  position: sticky;
  top: 0;
  z-index: 1;
}

.market-board-table tbody td {
  font-size: 0.88rem;
  font-weight: 800;
}

.market-board-table tbody tr:last-child td {
  border-bottom: 0;
}

.market-board-table tbody tr {
  cursor: pointer;
  transition: background 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

.market-board-table tbody tr:nth-child(even) {
  background: rgba(20, 62, 96, 0.08);
}

.market-board-table tbody tr:hover,
.market-board-table tbody tr.selected-market-row {
  background: rgba(48, 145, 220, 0.16);
  box-shadow: inset 4px 0 0 rgba(127, 223, 255, 0.9);
}

.market-resource-cell {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.market-board-icon,
.market-builder-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 8px;
}

.current-market-planet {
  color: #f1f8ff !important;
  background: rgba(127, 223, 255, 0.08);
}

.market-builder-panel {
  display: grid;
  grid-template-rows: auto auto auto auto auto;
  gap: 8px;
  padding: 12px;
  overflow: hidden;
}

.market-builder-selected {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.market-builder-selected h3 {
  margin: 0 0 2px;
  color: #f1f8ff;
  font-size: 1rem;
  line-height: 1.05;
}

.market-builder-selected p {
  margin: 0;
  color: #9ebcda;
  font-size: 0.66rem;
}

.market-builder-controls {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.market-builder-controls label {
  display: grid;
  gap: 5px;
  color: #7fdfff;
  font-size: 0.6rem;
  font-weight: 950;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.market-builder-controls select,
.market-builder-controls input {
  width: 100%;
  min-height: 30px;
  border: 1px solid rgba(90, 190, 255, 0.28);
  border-radius: 8px;
  background: rgba(2, 8, 18, 0.86);
  color: #f1f8ff;
  font-family: inherit;
  font-size: 0.82rem;
}

.market-amount-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 62px minmax(104px, 0.9fr);
  gap: 8px;
  align-items: stretch;
}

.market-amount-control strong,
.market-amount-control button {
  min-height: 34px;
  border-radius: 8px;
  font-family: inherit;
  font-size: 0.76rem;
  font-weight: 900;
}

.market-amount-control strong {
  display: grid;
  place-items: center;
  border: 1px solid rgba(127, 223, 255, 0.32);
  color: #f1f8ff;
  background: rgba(2, 8, 18, 0.86);
}

.market-amount-control button {
  border: 1px solid rgba(90, 190, 255, 0.24);
  color: #65f0a0;
  background: rgba(2, 18, 14, 0.78);
  cursor: pointer;
}

.market-amount-control .trade-primary-action {
  color: #fff;
  background: linear-gradient(180deg, rgba(42, 103, 190, 0.96), rgba(22, 85, 168, 0.96));
  border-color: rgba(127, 223, 255, 0.34);
}

.market-amount-control button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.market-builder-summary,
.market-builder-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  align-content: start;
  overflow: visible;
}

.market-builder-summary div,
.market-builder-stats div {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(90, 190, 255, 0.16);
  border-radius: 8px;
  background: rgba(2, 8, 18, 0.62);
}

.market-builder-summary span,
.market-builder-stats span {
  display: block;
  margin-bottom: 1px;
  color: #95b6d8;
  font-size: 0.54rem;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.market-builder-summary strong,
.market-builder-stats strong {
  color: #f1f8ff;
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.market-builder-summary .profit-summary-card {
  border-color: rgba(101, 240, 160, 0.28);
  background:
    radial-gradient(circle at 90% 20%, rgba(101, 240, 160, 0.12), transparent 48%),
    rgba(2, 18, 14, 0.58);
}

.market-builder-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  align-items: stretch;
}

.market-builder-actions.no-sell {
  grid-template-columns: 1fr;
}

.market-builder-actions button {
  width: 100%;
  min-height: 36px;
  padding: 8px 10px;
}

@media (max-width: 980px) {
  .trade-terminal-summary,
  .map-one-market-terminal {
    grid-template-columns: 1fr;
    height: auto;
  }

  .market-builder-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .market-amount-control,
  .market-builder-stats,
  .market-builder-actions {
    grid-template-columns: 1fr;
  }
}

/* ===== Trade Terminal environment treatment ===== */
#marketScreen.market-screen {
  isolation: isolate;
  background-color: #020814;
  background-image:
    radial-gradient(ellipse at 50% 54%, rgba(1, 8, 18, 0.3), rgba(1, 8, 18, 0.1) 56%, rgba(1, 8, 18, 0.02) 82%),
    linear-gradient(180deg, rgba(1, 8, 18, 0.18), rgba(1, 8, 18, 0.38)),
    url("./assets/backgrounds/trade-terminal-trading-hub.png") !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

#marketScreen::before,
#marketScreen::after {
  content: none;
}

#marketScreen > * {
  position: relative;
  z-index: 1;
}

#marketScreen .market-header {
  text-shadow: 0 0 18px rgba(0, 0, 0, 0.92);
}

#marketScreen .market-terminal {
  border: 1px solid rgba(110, 220, 255, 0.16);
  border-radius: 10px;
  padding: 12px;
  background: linear-gradient(180deg, rgba(0, 6, 16, 0.1), rgba(0, 6, 16, 0.22));
  box-shadow: inset 0 1px 0 rgba(158, 230, 255, 0.05), 0 18px 42px rgba(0, 0, 0, 0.24);
}

#marketScreen .terminal-card,
#marketScreen .market-board-panel,
#marketScreen .market-builder-panel {
  background:
    linear-gradient(90deg, rgba(70, 205, 255, 0.08), transparent 18%, transparent 82%, rgba(70, 205, 255, 0.05)),
    linear-gradient(180deg, rgba(4, 13, 26, 0.78), rgba(1, 7, 17, 0.84));
  border-color: rgba(115, 221, 255, 0.34);
  box-shadow:
    inset 0 1px 0 rgba(180, 238, 255, 0.07),
    0 10px 26px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(2px);
}

/* ===== Bounty Board premium polish ===== */
.bounty-screen .market-header {
  margin-bottom: 14px;
}

.bounty-screen .market-header h2 {
  font-size: 36px;
}

.bounty-top-strip {
  display: grid;
  grid-template-columns: 170px 190px minmax(0, 1fr);
  gap: 10px;
  margin-bottom: 12px;
  min-height: 54px;
}

.bounty-strip-card,
.bounty-strip-note {
  border: 1px solid rgba(90, 190, 255, 0.46);
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.56);
  box-shadow: inset 0 1px 0 rgba(160, 230, 255, 0.06), 0 0 18px rgba(0, 160, 255, 0.06);
}

.bounty-strip-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 11px 14px;
}

.bounty-strip-card span {
  color: #7fdfff;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.bounty-strip-card strong {
  color: #f1f8ff;
  font-size: 1rem;
}

.bounty-strip-note {
  display: flex;
  align-items: center;
  padding: 11px 14px;
  color: #aebfda;
  font-size: 0.78rem;
  line-height: 1.32;
}

.bounty-board-layout-refined {
  height: calc(100% - 150px);
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 14px;
}

.bounty-board-layout-refined .bounty-contract-grid {
  grid-template-rows: repeat(3, minmax(74px, 1fr));
  gap: 9px;
  padding: 12px;
}

.bounty-board-layout-refined .bounty-contract-card {
  min-height: 0;
  padding: 10px 12px;
  grid-template-columns: 38px minmax(0, 1fr) 84px 98px;
  grid-template-rows: 1fr auto;
  gap: 5px 10px;
  align-content: center;
  overflow: hidden;
  position: relative;
}

.bounty-board-layout-refined .bounty-contract-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 12px;
  pointer-events: none;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.035) 40%, transparent 72%);
  opacity: 0;
  transition: opacity 180ms ease;
}

.bounty-board-layout-refined .bounty-contract-card:hover::after,
.bounty-board-layout-refined .bounty-contract-card.selected::after {
  opacity: 1;
}

.bounty-board-layout-refined .bounty-card-icon {
  grid-row: 1 / 3;
  width: 38px;
  height: 38px;
  border-radius: 11px;
}

.bounty-board-layout-refined .bounty-card-copy strong {
  font-size: 0.95rem;
}

.bounty-board-layout-refined .bounty-card-copy em {
  font-size: 0.68rem;
}

.bounty-card-objective {
  justify-self: end;
  color: #dbeaff;
  font-size: 0.72rem;
  font-weight: 900;
  white-space: nowrap;
}

.bounty-board-layout-refined .bounty-card-reward {
  justify-self: end;
  font-size: 0.9rem;
  white-space: nowrap;
}

.bounty-board-layout-refined .bounty-card-status {
  grid-column: 2 / 5;
  margin-top: 1px;
  padding: 3px 8px;
}

.bounty-detail-body {
  gap: 9px;
}

.bounty-detail-kicker {
  display: block;
  width: fit-content;
  margin-bottom: 4px;
  padding: 3px 7px;
  border-radius: 999px;
  color: #7fdfff !important;
  border: 1px solid rgba(127, 223, 255, 0.2);
  background: rgba(0, 0, 0, 0.22);
  font-size: 0.56rem !important;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.bounty-detail-progress-block {
  border: 1px solid rgba(90, 190, 255, 0.16);
  border-radius: 11px;
  padding: 10px;
  background: rgba(2, 8, 18, 0.58);
}

.bounty-progress-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.bounty-progress-heading span {
  color: #7fdfff;
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.bounty-progress-heading strong {
  font-size: 0.78rem;
}

.bounty-progress-bar {
  height: 8px;
  border-radius: 999px;
  background: rgba(255,255,255,0.08);
  overflow: hidden;
  border: 1px solid rgba(127, 223, 255, 0.14);
}

.bounty-progress-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(255, 93, 125, 0.92), rgba(255, 210, 84, 0.92));
  box-shadow: 0 0 12px rgba(255, 93, 125, 0.3);
}

.bounty-detail-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.bounty-detail-grid .bounty-detail-stat {
  padding: 8px 10px;
}

.bounty-detail-grid .bounty-detail-stat strong {
  max-width: 160px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bounty-board-layout-refined .bounty-accept-btn,
.bounty-board-layout-refined .bounty-claim-btn,
.bounty-board-layout-refined .bounty-cancel-btn {
  min-height: 40px;
  margin-top: 4px;
}

@media (max-width: 900px) {
  .bounty-top-strip {
    grid-template-columns: 1fr;
  }

  .bounty-board-layout-refined {
    height: auto;
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .bounty-board-layout-refined .bounty-contract-grid {
    grid-template-rows: none;
  }
}


/* ===== Bounty Board alignment tidy ===== */
.bounty-top-strip {
  align-items: stretch;
}

.bounty-strip-card {
  min-width: 0;
  gap: 12px;
}

.bounty-strip-card span {
  min-width: 0;
  line-height: 1.08;
}

.bounty-strip-card strong {
  flex: 0 0 auto;
  min-width: 48px;
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.bounty-board-layout-refined .bounty-contract-panel,
.bounty-board-layout-refined .bounty-detail-panel {
  padding: 12px;
}

.bounty-board-layout-refined .modern-store-panel-header {
  min-height: 24px;
  margin: 0 0 10px;
  align-items: center;
  line-height: 1;
}

.bounty-board-layout-refined .modern-store-panel-header span {
  line-height: 1;
}

.bounty-board-layout-refined .bounty-panel-header em {
  line-height: 1;
  align-self: center;
  min-width: 150px;
  text-align: right;
}

.bounty-complete-note {
  display: grid;
  gap: 3px;
  padding: 9px 10px;
  border: 1px solid rgba(101, 240, 160, 0.36);
  border-radius: 10px;
  background:
    linear-gradient(90deg, rgba(101, 240, 160, 0.14), rgba(127, 223, 255, 0.06)),
    rgba(2, 12, 18, 0.78);
  color: #dfffea;
}

.bounty-complete-note strong {
  color: #65f0a0;
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.bounty-complete-note span {
  color: #b9d7f4;
  font-size: 0.72rem;
  line-height: 1.3;
}

.bounty-complete-note.claimed {
  border-color: rgba(127, 223, 255, 0.22);
  background:
    linear-gradient(90deg, rgba(101, 240, 160, 0.1), rgba(2, 10, 22, 0.72)),
    rgba(2, 10, 22, 0.72);
}

.bounty-complete-note.claimed strong {
  color: #65f0a0;
}

.bounty-board-layout-refined .bounty-contract-grid {
  padding: 0;
}

.bounty-board-layout-refined .bounty-detail-body {
  min-height: 0;
}

/* ===== Store starter-zone simplification ===== */
.store-core-stock-note {
  width: 100%;
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  color: #9fb8d7;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.45px;
  text-align: right;
  opacity: 0.92;
}

.store-catalog-card .store-card-sub {
  text-transform: uppercase;
  letter-spacing: 0.75px;
}

@media (max-width: 900px) {
  .store-core-stock-note {
    justify-content: flex-start;
    text-align: left;
  }
}


/* ===== Store tidy pass ===== */
#storeQualityBar.store-quality-row.store-quality-row-compact {
  display: none;
}

.store-catalog-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-content: start;
  padding-right: 0;
}

.store-catalog-card {
  min-height: 132px;
  padding: 12px 8px 10px;
}

.store-card-art {
  width: 42px;
  height: 42px;
}

.store-card-name {
  font-size: 13px;
  line-height: 1.15;
}

.store-catalog-card .store-card-sub {
  font-size: 11px;
}

.store-card-price {
  font-size: 12px;
}

@media (max-width: 1100px) {
  .store-catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* ===== Store daily item and art polish ===== */
.store-catalog-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.store-catalog-card {
  min-height: 134px;
  padding: 10px 8px 10px;
}

.modern-store-catalog-panel .store-card-art {
  width: 62px;
  height: 62px;
  margin: 6px auto 6px;
  overflow: visible;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.modern-store-catalog-panel .store-card-art::before,
.modern-store-catalog-panel .store-card-art::after {
  display: none;
}

.modern-store-catalog-panel .store-card-art img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 0 10px rgba(70, 160, 255, 0.22));
}

.store-card-name {
  font-size: 12px;
  line-height: 1.15;
}

.store-catalog-card .store-card-sub {
  font-size: 11px;
}

.store-card-price {
  font-size: 12px;
}

.daily-stock-card {
  border-color: rgba(44, 229, 150, 0.9);
  box-shadow: inset 0 0 0 1px rgba(44, 229, 150, 0.28), 0 0 20px rgba(44, 229, 150, 0.14), 0 0 34px rgba(44, 229, 150, 0.07);
  background: linear-gradient(180deg, rgba(4, 13, 28, 0.98), rgba(4, 13, 28, 0.95)), radial-gradient(circle at top, rgba(44, 229, 150, 0.11), transparent 56%);
}

.daily-stock-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;
  pointer-events: none;
  box-shadow: inset 0 0 18px rgba(44, 229, 150, 0.12);
}

.daily-stock-card .store-card-sub {
  color: #6affbf;
  letter-spacing: 0.12em;
}

.daily-stock-card .store-card-price {
  color: #d9fff0;
}

.daily-stock-card .store-card-art img {
  filter: drop-shadow(0 0 14px rgba(44, 229, 150, 0.4)) drop-shadow(0 0 22px rgba(44, 229, 150, 0.2));
}

.store-daily-status {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  color: rgba(196, 228, 255, 0.86);
}

.store-daily-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(44, 229, 150, 0.35);
  background: rgba(18, 44, 31, 0.6);
  color: #76ffc6;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

@media (max-width: 1200px) {
  .store-catalog-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  .store-catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


#storeQualityBar.store-quality-row.store-quality-row-compact {
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
}


/* Store timer wording + softer unique detail effect */
.store-daily-status {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 5px 10px;
  border: 1px solid rgba(255, 211, 107, 0.28);
  border-radius: 999px;
  background: rgba(58, 40, 8, 0.22);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #ffd36b;
  text-shadow: 0 0 10px rgba(255, 190, 75, 0.28);
}

.store-daily-pill {
  display: none !important;
}

#marketCycleText {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 10px;
  border: 1px solid rgba(255, 211, 107, 0.28);
  border-radius: 999px;
  background: rgba(58, 40, 8, 0.22);
  color: #ffd36b;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-shadow: 0 0 10px rgba(255, 190, 75, 0.28);
  text-transform: uppercase;
}

.store-quality-unique .store-detail-visual {
  box-shadow: inset 0 0 12px rgba(50, 210, 125, 0.08), 0 0 10px rgba(50, 210, 125, 0.06);
}

.store-quality-unique .store-detail-visual::before {
  background: radial-gradient(circle at center, rgba(50, 210, 125, 0.18), rgba(50, 210, 125, 0.05) 48%, rgba(50, 210, 125, 0) 72%);
  opacity: 0.52;
  filter: blur(18px);
}

.store-quality-unique .store-detail-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(118deg, transparent 0 34%, rgba(122,255,201,0.00) 34%, rgba(122,255,201,0.28) 37%, rgba(214,255,236,0.40) 38%, rgba(122,255,201,0.24) 39%, rgba(122,255,201,0.00) 42%, transparent 42%) 0 0 / 180% 100% no-repeat,
    linear-gradient(72deg, transparent 0 58%, rgba(122,255,201,0.00) 58%, rgba(122,255,201,0.20) 60%, rgba(214,255,236,0.28) 61%, rgba(122,255,201,0.16) 62%, rgba(122,255,201,0.00) 64%, transparent 64%) 0 0 / 220% 100% no-repeat;
  opacity: 0.34;
  mix-blend-mode: screen;
  animation: storeUniqueLightningSweep 3.6s linear infinite, storeUniqueLightningFlicker 2.1s steps(2, end) infinite;
}

@keyframes storeUniqueLightningSweep {
  0% { background-position: -140% 0, -180% 0; }
  100% { background-position: 180% 0, 220% 0; }
}

@keyframes storeUniqueLightningFlicker {
  0%, 100% { opacity: 0.16; }
  8% { opacity: 0.28; }
  10% { opacity: 0.12; }
  12% { opacity: 0.34; }
  14% { opacity: 0.16; }
  52% { opacity: 0.18; }
  56% { opacity: 0.30; }
  58% { opacity: 0.14; }
  60% { opacity: 0.26; }
  62% { opacity: 0.18; }
}

/* Store stock quantities + richer unique lightning sweeps */
.store-card-stock {
  font-size: 10px;
  line-height: 1;
  color: rgba(184, 211, 236, 0.82);
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-top: -2px;
}

.daily-stock-card .store-card-stock {
  color: rgba(118, 255, 198, 0.92);
}

.store-catalog-card.sold-out {
  opacity: 0.62;
  filter: grayscale(0.25);
}

.store-catalog-card.sold-out .store-card-price {
  color: rgba(255, 150, 150, 0.92);
}

.store-quality-unique .store-detail-visual::after {
  background:
    linear-gradient(118deg, transparent 0 29%, rgba(122,255,201,0.00) 29%, rgba(122,255,201,0.22) 31%, rgba(214,255,236,0.38) 32%, rgba(122,255,201,0.20) 33%, rgba(122,255,201,0.00) 36%, transparent 36%) 0 0 / 190% 100% no-repeat,
    linear-gradient(62deg, transparent 0 56%, rgba(122,255,201,0.00) 56%, rgba(122,255,201,0.18) 58%, rgba(214,255,236,0.30) 59%, rgba(122,255,201,0.14) 60%, rgba(122,255,201,0.00) 63%, transparent 63%) 0 0 / 240% 100% no-repeat,
    linear-gradient(156deg, transparent 0 42%, rgba(122,255,201,0.00) 42%, rgba(122,255,201,0.17) 44%, rgba(214,255,236,0.28) 45%, rgba(122,255,201,0.13) 46%, rgba(122,255,201,0.00) 49%, transparent 49%) 0 0 / 210% 100% no-repeat,
    linear-gradient(24deg, transparent 0 63%, rgba(122,255,201,0.00) 63%, rgba(122,255,201,0.16) 65%, rgba(214,255,236,0.26) 66%, rgba(122,255,201,0.12) 67%, rgba(122,255,201,0.00) 70%, transparent 70%) 0 0 / 230% 100% no-repeat;
  opacity: 0.30;
  animation: storeUniqueLightningMultiSweep 4.2s linear infinite, storeUniqueLightningFlicker 2.05s steps(2, end) infinite;
}

@keyframes storeUniqueLightningMultiSweep {
  0% { background-position: -160% 0, 210% 0, -190% 0, 230% 0; }
  100% { background-position: 190% 0, -240% 0, 210% 0, -230% 0; }
}


/* ===== Hostile bot facing / warning state ===== */
.enemy-bot-target img {
  transition: transform 220ms ease, filter 220ms ease;
  transform-origin: center center;
}

.enemy-bot-target.bot-angle-front img {
  transform: rotate(0deg) scale(1);
}

.enemy-bot-target.bot-angle-front-left img {
  transform: rotate(-9deg) skewX(-2deg) scale(0.96);
}

.enemy-bot-target.bot-angle-left img {
  transform: rotate(-17deg) skewX(-5deg) scale(0.93);
}

.enemy-bot-target.bot-angle-front-right img {
  transform: rotate(9deg) skewX(2deg) scale(0.96);
}

.enemy-bot-target.bot-angle-right img {
  transform: rotate(17deg) skewX(5deg) scale(0.93);
}

.enemy-bot-target.bot-facing-player {
  z-index: 9;
}

.enemy-bot-target.bot-facing-player img {
  transform: rotate(0deg) scale(1.12) !important;
  filter:
    drop-shadow(0 0 9px rgba(255, 72, 72, 0.78))
    drop-shadow(0 0 18px rgba(255, 120, 68, 0.42))
    drop-shadow(0 0 28px rgba(84, 228, 255, 0.24)) !important;
  animation: botAttackFacePulse 680ms ease-out both;
}

.enemy-bot-target.bot-facing-player::before {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 999px;
  border: 1px solid rgba(255, 82, 82, 0.62);
  box-shadow: 0 0 16px rgba(255, 82, 82, 0.28), inset 0 0 18px rgba(255, 82, 82, 0.12);
  pointer-events: none;
  animation: botAttackRing 860ms ease-out forwards;
}

@keyframes botAttackFacePulse {
  0% { transform: rotate(0deg) scale(0.98); }
  32% { transform: rotate(0deg) scale(1.15); }
  100% { transform: rotate(0deg) scale(1.12); }
}

@keyframes botAttackRing {
  0% { opacity: 0; transform: scale(0.78); }
  24% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.28); }
}

.combat-warning-banner {
  position: absolute;
  top: 22px;
  left: 50%;
  transform: translateX(-50%) scale(0.94);
  z-index: 32;
  pointer-events: none;
  padding: 8px 22px;
  border: 1px solid rgba(255, 78, 92, 0.78);
  border-radius: 999px;
  background: rgba(42, 4, 12, 0.72);
  color: #ffd6dc;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  opacity: 0;
  box-shadow: 0 0 20px rgba(255, 52, 72, 0.22), inset 0 0 14px rgba(255, 78, 92, 0.12);
}

.combat-warning-banner.active {
  animation: combatWarningPulse 1050ms ease-out forwards;
}

@keyframes combatWarningPulse {
  0% { opacity: 0; transform: translateX(-50%) scale(0.9); }
  18% { opacity: 1; transform: translateX(-50%) scale(1); }
  34% { opacity: 0.55; }
  48% { opacity: 1; }
  100% { opacity: 0; transform: translateX(-50%) scale(1.03); }
}


/* ===== Hangar Vessel Exchange polish ===== */
.simplified-hangar-tabs {
  grid-template-columns: repeat(5, 1fr);
}

.hangar-header h2 {
  line-height: 0.95;
}

.hangar-subtitle {
  color: rgba(210, 232, 255, 0.82);
}

.shipyard-title-row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
}

.shipyard-credit-pill {
  min-width: 150px;
  padding: 10px 14px;
  border: 1px solid rgba(127, 223, 255, 0.45);
  border-radius: 12px;
  background: rgba(5, 16, 31, 0.76);
  color: #7fdfff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 1.4px;
  text-align: center;
}

.shipyard-credit-pill strong {
  color: #fff;
  margin-left: 6px;
}

.shipyard-layout {
  height: calc(100% - 58px);
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(520px, 1fr) 340px;
  gap: 14px;
}

.shipyard-catalog-panel,
.shipyard-detail-panel {
  min-height: 0;
  border: 1px solid rgba(127, 223, 255, 0.48);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(7, 18, 34, 0.88), rgba(0,0,0,0.82));
  overflow: hidden;
}

.shipyard-grid {
  height: calc(100% - 42px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 14px;
  overflow-y: auto;
}

.shipyard-card {
  position: relative;
  min-height: 190px;
  display: grid;
  grid-template-rows: 86px auto auto 1fr;
  gap: 5px;
  border: 1px solid rgba(61, 143, 199, 0.62);
  border-radius: 16px;
  background:
    radial-gradient(circle at 50% 8%, rgba(92, 194, 255, 0.10), transparent 38%),
    rgba(5, 14, 28, 0.82);
  color: #f2f7ff;
  padding: 12px;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.shipyard-card:hover,
.shipyard-card.selected {
  border-color: rgba(127, 223, 255, 0.95);
  box-shadow: 0 0 20px rgba(89, 217, 255, 0.14);
  transform: translateY(-1px);
}

.shipyard-card.equipped {
  border-color: rgba(73, 255, 172, 0.72);
}

.shipyard-card-status {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(127, 223, 255, 0.28);
  background: rgba(0, 0, 0, 0.38);
  color: #7fdfff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.shipyard-card img {
  justify-self: center;
  align-self: center;
  width: 118px;
  height: 82px;
  object-fit: contain;
  filter: drop-shadow(0 10px 14px rgba(0,0,0,0.55));
}

.shipyard-card strong {
  font-size: 18px;
  letter-spacing: 0.6px;
}

.shipyard-card small {
  color: #a9c4e5;
  font-size: 11px;
}

.shipyard-card-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 5px;
  margin-top: 5px;
}

.shipyard-card-stats span {
  padding: 5px 7px;
  border: 1px solid rgba(127, 223, 255, 0.13);
  border-radius: 8px;
  background: rgba(0,0,0,0.22);
  color: #c7dcf5;
  font-size: 11px;
}

.shipyard-detail-body {
  height: calc(100% - 42px);
  padding: 14px;
}

.shipyard-detail-shell {
  height: 100%;
  display: grid;
  grid-template-rows: 130px auto auto auto auto auto 1fr;
  gap: 10px;
}

.shipyard-detail-art {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(127, 223, 255, 0.22);
  border-radius: 14px;
  background: radial-gradient(circle at 50% 45%, rgba(42, 149, 215, 0.16), transparent 64%), rgba(2,8,16,0.5);
}

.shipyard-detail-art img {
  max-width: 82%;
  max-height: 118px;
  object-fit: contain;
  filter: drop-shadow(0 0 16px rgba(127, 223, 255, 0.20));
}

.shipyard-kicker {
  color: #7fdfff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.shipyard-detail-shell h3 {
  margin: 0;
  color: #fff;
  font-size: 28px;
  letter-spacing: 1px;
}

.shipyard-detail-shell p {
  margin: 0;
  color: #b9c8e8;
  font-size: 13px;
  line-height: 1.45;
}

.shipyard-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.shipyard-stat-grid div,
.shipyard-meta-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid rgba(127, 223, 255, 0.14);
  border-radius: 10px;
  background: rgba(2,8,16,0.42);
}

.shipyard-stat-grid span,
.shipyard-meta-row span {
  color: #7fdfff;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.shipyard-stat-grid strong,
.shipyard-meta-row strong {
  color: #fff;
  text-align: right;
  font-size: 12px;
}

.shipyard-action-row {
  align-self: end;
}

.shipyard-action-row button {
  width: 100%;
  min-height: 48px;
}

@media (max-width: 980px) {
  .simplified-hangar-tabs {
    grid-template-columns: repeat(2, 1fr);
  }

  .shipyard-layout {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .shipyard-grid {
    grid-template-columns: 1fr;
  }
}


/* ===== Integrated Hangar Bay / Loadout ===== */
.integrated-hangar-grid {
  height: 100%;
  display: grid;
  grid-template-columns: 260px minmax(420px, 1fr) 330px;
  gap: 14px;
  min-height: 0;
}

.integrated-stats-panel,
.integrated-equipment-panel,
.hangar-loadout-stage {
  min-height: 0;
}

.integrated-stats-panel {
  display: grid;
  grid-template-rows: auto auto auto 1fr;
}

.integrated-stats-panel .overview-stat-grid {
  align-content: start;
}

.compact-repair-panel {
  margin-top: 14px;
}

.compact-repair-card {
  min-height: auto;
  padding: 12px;
  gap: 10px;
}

.compact-repair-card button {
  min-height: 38px;
  font-size: 13px;
}

.hangar-loadout-stage {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 10px;
  padding: 16px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 42%, rgba(70, 180, 255, 0.10), transparent 42%),
    linear-gradient(135deg, rgba(13, 28, 42, 0.88), rgba(2, 8, 16, 0.88)),
    rgba(0,0,0,0.65);
  border: 1px solid rgba(127, 223, 255, 0.52);
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(210, 245, 255, 0.08),
    0 0 28px rgba(0, 160, 255, 0.08);
}

.hangar-loadout-stage::before {
  content: "";
  position: absolute;
  inset: 20px;
  border: 1px solid rgba(205, 164, 92, 0.15);
  border-radius: 20px;
  pointer-events: none;
}

.loadout-stage-header,
.loadout-stage-footer {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.loadout-stage-header span,
.mini-panel-title span {
  color: #7fdfff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.loadout-stage-header strong {
  color: #f5fbff;
  font-size: 20px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.loadout-stage-footer {
  color: rgba(185, 210, 235, 0.76);
  font-size: 11px;
}

.hangar-loadout-orbit {
  position: relative;
  z-index: 2;
  min-height: 0;
  display: grid;
  grid-template-columns: 82px minmax(220px, 1fr) 82px;
  gap: 12px;
  align-items: center;
}

.loadout-ship-core {
  position: relative;
  min-height: 350px;
  display: grid;
  place-items: center;
}

.loadout-ship-core .hero-glow-ring {
  width: min(78%, 420px);
}

.loadout-ship-core img {
  position: relative;
  z-index: 2;
  max-width: min(70%, 310px);
  max-height: 330px;
  object-fit: contain;
  filter: drop-shadow(0 0 22px rgba(70, 180, 255, 0.14));
}

.loadout-slot-stack {
  display: grid;
  gap: 14px;
  align-content: center;
  justify-items: center;
  min-height: 0;
}

.hangar-loadout-stage .equipment-slot.compact-loadout-slot {
  width: 64px;
  height: 64px;
  min-height: 64px;
  padding: 6px;
  display: grid;
  place-items: center;
  grid-template-columns: 1fr;
  gap: 0;
  border-radius: 14px;
  background: rgba(4, 13, 27, 0.86);
  border: 1px solid rgba(80, 170, 230, 0.72);
  box-shadow: inset 0 0 12px rgba(80, 170, 230, 0.08);
}

.hangar-loadout-stage .equipment-slot.compact-loadout-slot.filled {
  border-color: rgba(130, 225, 255, 0.92);
  box-shadow:
    inset 0 0 12px rgba(80, 170, 230, 0.12),
    0 0 14px rgba(80, 170, 230, 0.12);
}

.hangar-loadout-stage .equipment-slot.compact-loadout-slot img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  background: transparent;
  border-radius: 8px;
}

.hangar-loadout-stage .equipment-slot.compact-loadout-slot span:not(.slot-silhouette),
.hangar-loadout-stage .equipment-slot.compact-loadout-slot small:not(.slot-silhouette) {
  display: none;
}

.slot-silhouette {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: rgba(127, 223, 255, 0.7);
  border: 1px dashed rgba(127, 223, 255, 0.42);
  background: rgba(0, 0, 0, 0.22);
  font-size: 22px;
}

.gun-silhouette {
  font-size: 24px;
  transform: rotate(-12deg);
}

.attachment-silhouette {
  font-size: 22px;
}

.integrated-equipment-panel {
  display: grid;
  grid-template-rows: auto 1fr;
  overflow: hidden;
}

.available-equipment-wrap {
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 12px;
}

.available-equipment-block {
  min-height: 0;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 8px;
  overflow: hidden;
}

.mini-panel-title {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(127, 223, 255, 0.12);
}

.mini-panel-title small {
  color: rgba(170, 200, 225, 0.74);
  font-size: 11px;
}

.compact-equipment-grid {
  min-height: 0;
  overflow-y: auto;
  padding-right: 4px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
}

.compact-equipment-grid .inventory-icon-card {
  min-height: 96px;
  padding: 8px 6px;
}

.compact-equipment-grid .inventory-icon-card img {
  width: 42px;
  height: 42px;
  background: transparent;
}

.compact-equipment-grid .inventory-icon-card span {
  font-size: 11px;
  line-height: 1.15;
}

.compact-equipment-grid .inventory-icon-card small {
  font-size: 10px;
  line-height: 1.15;
}

.compact-equipment-grid .inventory-icon-card strong {
  font-size: 11px;
}

.integrated-hangar-grid .cargo-empty {
  display: grid;
  place-items: center;
  min-height: 76px;
  color: rgba(185, 210, 235, 0.72);
  border: 1px dashed rgba(127, 223, 255, 0.22);
  border-radius: 12px;
  background: rgba(0,0,0,0.18);
  font-size: 12px;
}

@media (max-width: 1100px) {
  .integrated-hangar-grid {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .hangar-loadout-orbit {
    grid-template-columns: 74px minmax(220px, 1fr) 74px;
  }

  .available-equipment-wrap {
    grid-template-rows: auto auto;
  }
}


/* ===== Hangar polish pass: less spreadsheet, more ship pride ===== */
.integrated-hangar-grid {
  grid-template-columns: 255px minmax(470px, 1fr) 330px;
  gap: 16px;
}

.integrated-stats-panel,
.integrated-equipment-panel,
.hangar-loadout-stage {
  background:
    radial-gradient(circle at 18% 14%, rgba(127, 223, 255, 0.08), transparent 28%),
    linear-gradient(145deg, rgba(8, 19, 35, 0.94), rgba(1, 7, 15, 0.92));
  border-color: rgba(105, 204, 255, 0.58);
}

.integrated-stats-panel {
  padding: 16px;
  box-shadow: inset 0 0 28px rgba(0, 150, 255, 0.05);
}

.integrated-stats-panel h3 {
  margin-bottom: 12px;
  font-size: 26px;
  letter-spacing: 0.8px;
}

.integrated-stats-panel .panel-kicker,
.integrated-equipment-panel .panel-kicker,
.loadout-stage-header span {
  color: #83e9ff;
  text-shadow: 0 0 12px rgba(80, 220, 255, 0.18);
}

.integrated-stats-panel .overview-stat-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.integrated-stats-panel .overview-stat-grid .hangar-stat-card {
  min-height: 62px;
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 10px;
  border: 1px solid rgba(127, 223, 255, 0.16);
  border-radius: 13px;
  background:
    radial-gradient(circle at 80% 16%, rgba(127, 223, 255, 0.10), transparent 38%),
    rgba(2, 12, 25, 0.72);
  box-shadow: inset 0 0 18px rgba(0, 160, 255, 0.035);
}

.integrated-stats-panel .overview-stat-grid .hangar-stat-card:nth-child(1),
.integrated-stats-panel .overview-stat-grid .hangar-stat-card:nth-child(6) {
  grid-column: 1 / -1;
}

.integrated-stats-panel .overview-stat-grid .hangar-stat-card span {
  color: rgba(160, 207, 235, 0.78);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.integrated-stats-panel .overview-stat-grid .hangar-stat-card strong {
  color: #f7fbff;
  font-size: 16px;
  text-align: left;
  letter-spacing: 0.3px;
}

.integrated-stats-panel .overview-stat-grid .evasion-stat {
  border-color: rgba(52, 229, 154, 0.27);
  background:
    radial-gradient(circle at 80% 12%, rgba(52, 229, 154, 0.16), transparent 42%),
    rgba(2, 12, 25, 0.72);
}

.integrated-stats-panel .overview-stat-grid .jump-stat {
  border-color: rgba(86, 180, 255, 0.26);
}

.integrated-stats-panel .overview-stat-grid .cargo-stat {
  border-color: rgba(255, 201, 96, 0.23);
}

.integrated-stats-panel .overview-stat-grid .shield-stat {
  border-color: rgba(100, 185, 255, 0.28);
}

.prestige-repair-strip {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  margin-top: 14px;
  padding: 12px;
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(8, 28, 50, 0.90), rgba(4, 10, 18, 0.92)),
    radial-gradient(circle at 15% 20%, rgba(127, 223, 255, 0.10), transparent 40%);
}

.prestige-repair-strip div {
  min-width: 0;
}

.prestige-repair-strip span {
  color: #83e9ff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.prestige-repair-strip strong {
  display: block;
  margin-top: 2px;
  font-size: 20px;
}

.prestige-repair-strip small {
  display: block;
  margin-top: 2px;
  line-height: 1.2;
}

.prestige-repair-strip button {
  width: 92px;
  min-height: 42px;
  border-radius: 12px;
}

.hangar-loadout-stage {
  padding: 18px;
  background:
    radial-gradient(circle at 50% 48%, rgba(80, 200, 255, 0.18), transparent 31%),
    radial-gradient(circle at 50% 48%, rgba(238, 57, 73, 0.08), transparent 20%),
    linear-gradient(145deg, rgba(7, 18, 32, 0.95), rgba(0, 6, 14, 0.96));
  box-shadow:
    inset 0 1px 0 rgba(210, 245, 255, 0.08),
    inset 0 0 70px rgba(0, 160, 255, 0.035),
    0 0 34px rgba(0, 160, 255, 0.10);
}

.hangar-loadout-stage::after {
  content: "";
  position: absolute;
  inset: 78px 34px 44px;
  border-radius: 30px;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent, rgba(127, 223, 255, 0.08), transparent),
    linear-gradient(0deg, transparent, rgba(127, 223, 255, 0.035), transparent);
  opacity: 0.8;
  mask-image: radial-gradient(circle at center, black 0 54%, transparent 75%);
}

.loadout-title-cluster {
  display: grid;
  justify-items: end;
  gap: 2px;
}

.loadout-title-cluster small {
  color: rgba(180, 205, 225, 0.62);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.loadout-title-cluster strong {
  color: #f7fbff;
  font-size: 23px;
  letter-spacing: 2.6px;
  text-transform: uppercase;
  text-shadow: 0 0 18px rgba(127, 223, 255, 0.22);
}

.loadout-ship-core {
  min-height: 390px;
}

.loadout-ship-core .hero-glow-ring {
  width: min(76%, 440px);
  border-color: rgba(127, 223, 255, 0.22);
  box-shadow:
    0 0 95px rgba(127, 223, 255, 0.13),
    inset 0 0 70px rgba(127, 223, 255, 0.06);
}

.loadout-ship-core .hero-glow-ring::after {
  content: "";
  position: absolute;
  inset: 17%;
  border-radius: 50%;
  border: 1px solid rgba(238, 57, 73, 0.12);
  box-shadow: 0 0 42px rgba(238, 57, 73, 0.10);
}

.loadout-ship-core img {
  max-width: min(76%, 345px);
  max-height: 360px;
  filter:
    drop-shadow(0 0 24px rgba(70, 180, 255, 0.18))
    drop-shadow(0 0 34px rgba(235, 45, 55, 0.08));
}

.hangar-loadout-orbit {
  grid-template-columns: 76px minmax(260px, 1fr) 76px;
  gap: 16px;
}

.hangar-loadout-stage .equipment-slot.compact-loadout-slot {
  width: 66px;
  height: 66px;
  min-height: 66px;
  border-radius: 15px;
  background:
    radial-gradient(circle at 50% 20%, rgba(127, 223, 255, 0.10), transparent 45%),
    rgba(3, 13, 28, 0.9);
}

.hangar-loadout-stage .equipment-slot.compact-loadout-slot.filled {
  transform: translateY(0);
  transition: transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease;
}

.hangar-loadout-stage .equipment-slot.compact-loadout-slot.filled:hover {
  transform: translateY(-2px);
  border-color: rgba(145, 235, 255, 1);
  box-shadow:
    inset 0 0 14px rgba(80, 170, 230, 0.16),
    0 0 18px rgba(80, 170, 230, 0.18);
}

.hangar-loadout-stage .equipment-slot.compact-loadout-slot.quality-unique,
.hangar-loadout-stage .equipment-slot.compact-loadout-slot.quality-elite {
  box-shadow:
    inset 0 0 14px rgba(52, 229, 154, 0.10),
    0 0 16px rgba(52, 229, 154, 0.12);
}

.loadout-stage-footer {
  color: rgba(175, 205, 230, 0.62);
  font-size: 10px;
  letter-spacing: 0.4px;
}

.integrated-equipment-panel {
  padding: 16px;
}

.available-equipment-wrap {
  grid-template-rows: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 14px;
}

.mini-panel-title {
  padding-bottom: 8px;
}

.mini-panel-title span {
  color: #83e9ff;
}

.compact-equipment-grid {
  gap: 8px;
}

.compact-equipment-grid .inventory-icon-card {
  min-height: 90px;
  border-radius: 13px;
  background:
    radial-gradient(circle at 50% 18%, rgba(127, 223, 255, 0.10), transparent 44%),
    rgba(4, 13, 27, 0.88);
  transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.compact-equipment-grid .inventory-icon-card:hover:not(:disabled) {
  transform: translateY(-2px);
  border-color: rgba(127, 223, 255, 0.96);
  box-shadow: 0 0 16px rgba(127, 223, 255, 0.12);
}

.compact-equipment-grid .inventory-icon-card img {
  width: 46px;
  height: 46px;
}

.compact-equipment-grid .inventory-icon-card small {
  display: none;
}

.integrated-hangar-grid .cargo-empty.compact-empty {
  min-height: 72px;
  place-items: center;
  color: rgba(170, 200, 225, 0.70);
  background:
    radial-gradient(circle at 50% 20%, rgba(127, 223, 255, 0.06), transparent 40%),
    rgba(2, 10, 20, 0.44);
  border-color: rgba(127, 223, 255, 0.20);
  text-align: center;
}

@media (max-height: 760px) {
  .loadout-ship-core {
    min-height: 330px;
  }

  .loadout-ship-core img {
    max-height: 305px;
  }

  .integrated-stats-panel .overview-stat-grid .hangar-stat-card {
    min-height: 54px;
    padding: 8px;
  }
}




/* ===== Future-proof Hangar Bay: scalable loadout and inventory drawer ===== */
.integrated-hangar-grid {
  grid-template-columns: 255px minmax(520px, 1fr) 330px;
  align-items: stretch;
}

.hangar-loadout-stage-scalable {
  display: grid;
  grid-template-rows: auto minmax(210px, 0.95fr) minmax(170px, 0.72fr) auto;
  gap: 12px;
  min-height: 0;
  overflow: hidden;
}

.hangar-ship-command {
  position: relative;
  min-height: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(127, 223, 255, 0.12);
  border-radius: 22px;
  background:
    radial-gradient(circle at 50% 50%, rgba(80, 200, 255, 0.17), transparent 33%),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.06), transparent 19%),
    rgba(1, 7, 16, 0.28);
  overflow: hidden;
}

.hangar-ship-command::before {
  content: "";
  position: absolute;
  width: min(52%, 340px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(127, 223, 255, 0.18);
  box-shadow:
    inset 0 0 60px rgba(127, 223, 255, 0.045),
    0 0 70px rgba(127, 223, 255, 0.07);
}

.hangar-ship-command::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0 48%, rgba(127, 223, 255, 0.035) 50%, transparent 52%),
    linear-gradient(0deg, transparent 0 48%, rgba(127, 223, 255, 0.025) 50%, transparent 52%);
  opacity: 0.7;
  pointer-events: none;
}

.hangar-loadout-stage-scalable .loadout-ship-core {
  min-height: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.hangar-loadout-stage-scalable .loadout-ship-core .hero-glow-ring {
  display: none;
}

.hangar-loadout-stage-scalable .loadout-ship-core img {
  max-width: min(64%, 340px);
  max-height: 245px;
  object-fit: contain;
  filter:
    drop-shadow(0 0 22px rgba(70, 180, 255, 0.20))
    drop-shadow(0 0 42px rgba(70, 180, 255, 0.09));
}

.loadout-banks {
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.loadout-bank {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(127, 223, 255, 0.16);
  border-radius: 16px;
  background:
    radial-gradient(circle at 20% 10%, rgba(127, 223, 255, 0.075), transparent 36%),
    rgba(0, 6, 14, 0.42);
  overflow: hidden;
}

.loadout-bank-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(127, 223, 255, 0.10);
}

.loadout-bank-title span {
  color: #83e9ff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.55px;
  text-transform: uppercase;
}

.loadout-bank-title small {
  color: rgba(240, 248, 255, 0.84);
  padding: 3px 8px;
  border: 1px solid rgba(127, 223, 255, 0.18);
  border-radius: 999px;
  background: rgba(5, 18, 33, 0.75);
  font-weight: 800;
  font-size: 11px;
}

.loadout-slot-grid {
  min-height: 0;
  overflow-y: auto;
  padding: 2px 4px 2px 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(54px, 1fr));
  align-content: start;
  gap: 8px;
  scrollbar-width: thin;
}

.equipment-slot.scalable-loadout-slot {
  width: 100%;
  aspect-ratio: 1;
  min-height: 0;
  padding: 5px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  border: 1px solid rgba(90, 180, 235, 0.55);
  background:
    radial-gradient(circle at 50% 20%, rgba(127, 223, 255, 0.10), transparent 48%),
    rgba(4, 13, 27, 0.86);
  transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.equipment-slot.scalable-loadout-slot.filled {
  border-color: rgba(127, 223, 255, 0.92);
  box-shadow:
    inset 0 0 12px rgba(80, 170, 230, 0.10),
    0 0 12px rgba(80, 170, 230, 0.10);
}

.equipment-slot.scalable-loadout-slot.filled:hover {
  transform: translateY(-2px);
  border-color: rgba(160, 240, 255, 1);
  box-shadow:
    inset 0 0 14px rgba(80, 170, 230, 0.15),
    0 0 18px rgba(80, 170, 230, 0.16);
}

.equipment-slot.scalable-loadout-slot.empty {
  opacity: 0.78;
}

.equipment-slot.scalable-loadout-slot img {
  width: min(46px, 82%);
  height: min(46px, 82%);
  object-fit: contain;
  background: transparent;
}

.equipment-slot.scalable-loadout-slot span:not(.slot-silhouette),
.equipment-slot.scalable-loadout-slot small {
  display: none;
}

.equipment-slot.scalable-loadout-slot .slot-silhouette {
  width: 34px;
  height: 34px;
  font-size: 18px;
  opacity: 0.72;
}

.equipment-drawer-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 12px;
  min-height: 0;
  overflow: hidden;
}

.equipment-panel-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(127, 223, 255, 0.12);
}

.equipment-panel-header small {
  display: block;
  margin-top: 4px;
  color: rgba(180, 205, 225, 0.66);
  font-size: 11px;
}

.equipment-count-chip {
  flex: 0 0 auto;
  min-width: 70px;
  text-align: center;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid rgba(127, 223, 255, 0.20);
  background: rgba(8, 28, 50, 0.72);
  color: #e8f7ff;
  font-size: 11px;
  font-weight: 900;
}

.equipment-drawer {
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) minmax(0, 1.12fr);
  gap: 12px;
  overflow: hidden;
}

.equipment-drawer .available-equipment-block {
  overflow: hidden;
}

.scalable-equipment-grid {
  min-height: 0;
  overflow-y: auto;
  grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
  align-content: start;
  padding-right: 4px;
  scrollbar-width: thin;
}

.scalable-equipment-grid .inventory-icon-card {
  min-height: 92px;
  padding: 8px 6px;
}

.scalable-equipment-grid .inventory-icon-card img {
  width: 44px;
  height: 44px;
}

.scalable-equipment-grid .inventory-icon-card span {
  font-size: 10.5px;
  line-height: 1.1;
}

.scalable-equipment-grid .inventory-icon-card strong {
  position: absolute;
  right: 7px;
  top: 6px;
  min-width: 22px;
  text-align: center;
  padding: 2px 5px;
  border-radius: 999px;
  background: rgba(10, 35, 55, 0.9);
  border: 1px solid rgba(127, 223, 255, 0.22);
}

.integrated-hangar-grid .cargo-empty.compact-empty {
  min-height: 64px;
  width: 100%;
  font-size: 12px;
}

@media (max-height: 760px) {
  .hangar-loadout-stage-scalable {
    grid-template-rows: auto minmax(170px, 0.85fr) minmax(142px, 0.72fr) auto;
  }

  .hangar-loadout-stage-scalable .loadout-ship-core img {
    max-height: 205px;
  }

  .loadout-slot-grid {
    grid-template-columns: repeat(auto-fill, minmax(48px, 1fr));
    gap: 6px;
  }

  .equipment-slot.scalable-loadout-slot .slot-silhouette {
    width: 30px;
    height: 30px;
  }
}

@media (max-width: 1120px) {
  .integrated-hangar-grid {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .equipment-drawer {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: minmax(180px, 1fr);
  }
}




/* ===== Hangar orbit loadout: ship-centred, future-effect friendly ===== */
.hangar-orbit-loadout {
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.hangar-orbit-loadout .loadout-stage-header {
  z-index: 3;
}

.orbit-loadout-arena {
  position: relative;
  z-index: 2;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(90px, 128px) minmax(250px, 1fr) minmax(90px, 128px);
  gap: 14px;
  align-items: stretch;
  padding: 8px 0 4px;
}

.orbit-loadout-arena::before {
  content: "";
  position: absolute;
  inset: 8px 9%;
  border-radius: 30px;
  border: 1px solid rgba(127, 223, 255, 0.10);
  background:
    radial-gradient(circle at 50% 44%, rgba(80, 200, 255, 0.13), transparent 38%),
    linear-gradient(90deg, transparent, rgba(127, 223, 255, 0.04), transparent);
  pointer-events: none;
}

.orbit-ship-stage {
  position: relative;
  min-height: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(127, 223, 255, 0.12);
  border-radius: 26px;
  background:
    radial-gradient(circle at 50% 48%, rgba(80, 200, 255, 0.22), transparent 35%),
    radial-gradient(circle at 50% 48%, rgba(255,255,255,0.06), transparent 19%),
    rgba(1, 7, 16, 0.22);
}

.orbit-ship-stage::before,
.orbit-ship-stage::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.orbit-ship-stage::before {
  width: min(78%, 420px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(127, 223, 255, 0.18);
  box-shadow:
    inset 0 0 80px rgba(127, 223, 255, 0.055),
    0 0 90px rgba(127, 223, 255, 0.08);
}

.orbit-ship-stage::after {
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0 49%, rgba(127, 223, 255, 0.045) 50%, transparent 51%),
    linear-gradient(0deg, transparent 0 49%, rgba(127, 223, 255, 0.035) 50%, transparent 51%);
  opacity: 0.7;
}

.orbit-ship-stage img {
  position: relative;
  z-index: 2;
  max-width: min(78%, 370px);
  max-height: min(86%, 390px);
  object-fit: contain;
  filter:
    drop-shadow(0 0 24px rgba(70, 180, 255, 0.20))
    drop-shadow(0 0 46px rgba(70, 180, 255, 0.10));
}

.orbit-halo {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.orbit-halo-outer {
  width: min(96%, 520px);
  aspect-ratio: 1;
  border: 1px solid rgba(127, 223, 255, 0.08);
  box-shadow: inset 0 0 45px rgba(127, 223, 255, 0.035);
}

.orbit-halo-inner {
  width: min(55%, 315px);
  aspect-ratio: 1;
  border: 1px solid rgba(127, 223, 255, 0.15);
  box-shadow: 0 0 65px rgba(127, 223, 255, 0.09);
}

.ship-effect-anchor {
  position: absolute;
  z-index: 3;
  width: 18%;
  max-width: 76px;
  aspect-ratio: 1;
  border-radius: 50%;
  opacity: 0.35;
  pointer-events: none;
  filter: blur(8px);
}

.ship-effect-blue {
  background: radial-gradient(circle, rgba(88, 215, 255, 0.75), transparent 64%);
}

.orbit-rail {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 8px;
  padding: 9px;
  border: 1px solid rgba(127, 223, 255, 0.16);
  border-radius: 18px;
  background:
    radial-gradient(circle at 50% 0%, rgba(127, 223, 255, 0.08), transparent 42%),
    rgba(0, 6, 14, 0.42);
  overflow: hidden;
}

.orbit-rail-left {
  box-shadow: inset -18px 0 34px rgba(127, 223, 255, 0.025);
}

.orbit-rail-right {
  box-shadow: inset 18px 0 34px rgba(127, 223, 255, 0.025);
}

.compact-bank-title {
  padding-bottom: 7px;
}

.compact-bank-title span {
  max-width: 72px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.orbit-slot-rail {
  min-height: 0;
  overflow-y: auto;
  scrollbar-width: thin;
  display: grid;
  grid-template-columns: repeat(1, minmax(54px, 1fr));
  gap: 9px;
  align-content: start;
  justify-items: center;
  padding: 1px 2px 1px 0;
}

.orbit-slot-rail.many-slots {
  grid-template-columns: repeat(2, minmax(44px, 1fr));
  gap: 7px;
}

.orbit-slot-rail.very-many-slots {
  grid-template-columns: repeat(2, minmax(38px, 1fr));
  gap: 6px;
}

.orbit-slot-rail .equipment-slot.scalable-loadout-slot {
  width: 66px;
  max-width: 100%;
}

.orbit-slot-rail.many-slots .equipment-slot.scalable-loadout-slot {
  width: 50px;
}

.orbit-slot-rail.very-many-slots .equipment-slot.scalable-loadout-slot {
  width: 44px;
}

.orbit-slot-rail .equipment-slot.scalable-loadout-slot .slot-silhouette {
  width: 32px;
  height: 32px;
}

.orbit-slot-rail.many-slots .equipment-slot.scalable-loadout-slot .slot-silhouette,
.orbit-slot-rail.very-many-slots .equipment-slot.scalable-loadout-slot .slot-silhouette {
  width: 26px;
  height: 26px;
  font-size: 15px;
}

.orbit-slot-rail .equipment-slot.scalable-loadout-slot img {
  width: min(48px, 82%);
  height: min(48px, 82%);
}

.orbit-slot-rail.many-slots .equipment-slot.scalable-loadout-slot img {
  width: 38px;
  height: 38px;
}

.orbit-slot-rail.very-many-slots .equipment-slot.scalable-loadout-slot img {
  width: 32px;
  height: 32px;
}

/* Override old scalable bank layout on this screen only */
.hangar-orbit-loadout .loadout-banks,
.hangar-orbit-loadout .hangar-ship-command {
  display: none;
}

@media (max-height: 760px) {
  .orbit-loadout-arena {
    grid-template-columns: minmax(82px, 112px) minmax(230px, 1fr) minmax(82px, 112px);
    gap: 10px;
  }

  .orbit-ship-stage img {
    max-height: 315px;
  }

  .orbit-slot-rail .equipment-slot.scalable-loadout-slot {
    width: 56px;
  }
}

@media (max-width: 1120px) {
  .orbit-loadout-arena {
    grid-template-columns: 1fr;
  }

  .orbit-rail {
    min-height: 120px;
  }

  .orbit-slot-rail {
    grid-template-columns: repeat(auto-fill, minmax(54px, 1fr));
    overflow-y: visible;
  }

  .orbit-slot-rail.many-slots,
  .orbit-slot-rail.very-many-slots {
    grid-template-columns: repeat(auto-fill, minmax(48px, 1fr));
  }
}




/* ===== Hangar icon-first tidy pass ===== */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Make the side rails read cleanly and avoid clipped labels */
.orbit-loadout-arena {
  grid-template-columns: minmax(92px, 120px) minmax(285px, 1fr) minmax(92px, 120px);
  gap: 12px;
}

.orbit-rail {
  padding: 8px;
}

.compact-bank-title {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
  align-items: center;
}

.compact-bank-title span {
  max-width: none;
  min-width: 0;
  font-size: 10px;
  letter-spacing: 1.05px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-bank-title small {
  min-width: 34px;
  padding: 4px 6px;
  font-size: 10px;
  line-height: 1;
}

/* Slots become pure icons; details live in hover title now */
.orbit-slot-rail {
  grid-template-columns: repeat(1, minmax(58px, 1fr));
  justify-items: center;
  gap: 10px;
}

.orbit-slot-rail .equipment-slot.scalable-loadout-slot {
  width: 62px;
  border-radius: 15px;
}

.orbit-slot-rail .equipment-slot.scalable-loadout-slot img {
  width: 50px;
  height: 50px;
}

.orbit-slot-rail .equipment-slot.scalable-loadout-slot.empty {
  background:
    radial-gradient(circle at 50% 20%, rgba(127, 223, 255, 0.08), transparent 48%),
    rgba(2, 10, 22, 0.70);
}

.orbit-slot-rail.many-slots {
  grid-template-columns: repeat(2, minmax(42px, 1fr));
  gap: 7px;
}

.orbit-slot-rail.very-many-slots {
  grid-template-columns: repeat(2, minmax(38px, 1fr));
  gap: 6px;
}

.orbit-slot-rail.many-slots .equipment-slot.scalable-loadout-slot {
  width: 47px;
}

.orbit-slot-rail.very-many-slots .equipment-slot.scalable-loadout-slot {
  width: 42px;
}

/* Available equipment: guns and equipment cards identical size, icon-first */
.equipment-drawer {
  grid-template-rows: minmax(0, 0.86fr) minmax(0, 1.14fr);
}

.scalable-equipment-grid,
.compact-equipment-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(74px, 1fr));
  gap: 8px;
  align-content: start;
}

.scalable-equipment-grid .inventory-icon-card,
.compact-equipment-grid .inventory-icon-card {
  position: relative;
  width: 100%;
  height: 82px;
  min-height: 82px;
  max-height: 82px;
  padding: 8px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  overflow: hidden;
}

.scalable-equipment-grid .inventory-icon-card img,
.compact-equipment-grid .inventory-icon-card img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  margin: 0;
}

.scalable-equipment-grid .inventory-icon-card span:not(.sr-only),
.compact-equipment-grid .inventory-icon-card span:not(.sr-only),
.scalable-equipment-grid .inventory-icon-card small,
.compact-equipment-grid .inventory-icon-card small {
  display: none;
}

.scalable-equipment-grid .inventory-icon-card strong,
.compact-equipment-grid .inventory-icon-card strong {
  position: absolute;
  right: 6px;
  top: 5px;
  min-width: 22px;
  height: 20px;
  display: grid;
  place-items: center;
  padding: 0 5px;
  border-radius: 999px;
  background: rgba(8, 28, 50, 0.94);
  border: 1px solid rgba(127, 223, 255, 0.24);
  color: #f6fbff;
  font-size: 10px;
  line-height: 1;
}

.scalable-equipment-grid .inventory-icon-card:hover:not(:disabled)::after,
.compact-equipment-grid .inventory-icon-card:hover:not(:disabled)::after {
  content: attr(title);
  position: fixed;
  z-index: 9999;
  max-width: 240px;
  transform: translate(-12px, -38px);
  padding: 7px 9px;
  border-radius: 9px;
  border: 1px solid rgba(127, 223, 255, 0.35);
  background: rgba(3, 12, 24, 0.96);
  color: #eaf8ff;
  font-size: 11px;
  line-height: 1.25;
  box-shadow: 0 0 20px rgba(0, 160, 255, 0.18);
  pointer-events: none;
}

/* Better visual parity between top Guns block and lower Equipment block */
.equipment-drawer .available-equipment-block {
  min-height: 0;
  border-radius: 14px;
  padding: 0;
}

.equipment-drawer .mini-panel-title {
  margin-bottom: 8px;
}

.integrated-hangar-grid .cargo-empty.compact-empty {
  width: 100%;
  height: 82px;
  min-height: 82px;
  border-radius: 14px;
  font-size: 11px;
  padding: 8px;
}

/* Slightly reduce footer clutter */
.hangar-orbit-loadout .loadout-stage-footer {
  color: rgba(175, 205, 230, 0.52);
}

@media (max-height: 760px) {
  .scalable-equipment-grid .inventory-icon-card,
  .compact-equipment-grid .inventory-icon-card,
  .integrated-hangar-grid .cargo-empty.compact-empty {
    height: 72px;
    min-height: 72px;
    max-height: 72px;
  }

  .scalable-equipment-grid .inventory-icon-card img,
  .compact-equipment-grid .inventory-icon-card img {
    width: 48px;
    height: 48px;
  }
}




/* ===== Hangar aesthetic equipment tooltip + final card tidy ===== */
.hangar-equipment-card {
  isolation: isolate;
}

/* Disable the older fixed title tooltip behaviour for these richer cards */
.hangar-equipment-card:hover::after {
  content: none !important;
}

.hangar-equipment-card::before {
  content: attr(data-tooltip);
  display: none;
}

.hangar-equipment-card:hover .sr-only {
  display: block;
}

/* Render rich HTML tooltip using an inner element generated by browser from data is not possible,
   so use a data-driven overlay with CSS-friendly text fallback hidden and JS-made HTML below. */
.hangar-equipment-card[data-tooltip]:hover::after {
  content: "";
  display: none !important;
}

/* Browser-safe rich tooltip using CSS generated layout from encoded HTML is not possible,
   so the actual visual card is injected using attr text fallback below for no-JS cases only. */
.hangar-equipment-card[data-tooltip]:hover {
  border-color: rgba(127, 223, 255, 1);
  box-shadow:
    0 0 18px rgba(127, 223, 255, 0.17),
    inset 0 0 14px rgba(127, 223, 255, 0.08);
}

/* We use a sibling/fixed tooltip inserted by JS */
#hangarTooltip {
  position: fixed;
  z-index: 99999;
  width: 248px;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%, -104%) scale(0.98);
  transition: opacity 90ms ease, transform 90ms ease;
}

#hangarTooltip.visible {
  opacity: 1;
  transform: translate(-50%, -108%) scale(1);
}

.hangar-tooltip-card {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  padding: 12px;
  background:
    radial-gradient(circle at 30% 0%, rgba(127, 223, 255, 0.14), transparent 42%),
    linear-gradient(145deg, rgba(5, 18, 34, 0.98), rgba(1, 7, 16, 0.98));
  border: 1px solid rgba(127, 223, 255, 0.38);
  box-shadow:
    0 0 24px rgba(0, 160, 255, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.hangar-tooltip-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(110deg, transparent 0 38%, rgba(127, 223, 255, 0.10) 49%, transparent 60%),
    radial-gradient(circle at 90% 10%, rgba(52, 229, 154, 0.10), transparent 35%);
  opacity: 0.8;
  pointer-events: none;
}

.hangar-tooltip-card.quality-unique {
  border-color: rgba(52, 229, 154, 0.52);
  box-shadow:
    0 0 26px rgba(52, 229, 154, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.hangar-tooltip-top {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}

.hangar-tooltip-top img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  border-radius: 12px;
  background:
    radial-gradient(circle at 50% 35%, rgba(127, 223, 255, 0.15), transparent 52%),
    rgba(0, 7, 16, 0.66);
  border: 1px solid rgba(127, 223, 255, 0.18);
  padding: 5px;
}

.hangar-tooltip-name {
  color: #f7fbff;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.4px;
  line-height: 1.08;
  text-transform: uppercase;
}

.hangar-tooltip-meta {
  margin-top: 4px;
  color: #83e9ff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.1px;
  text-transform: uppercase;
}

.hangar-tooltip-stats {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 9px;
}

.hangar-tooltip-stat {
  min-height: 48px;
  padding: 7px;
  border-radius: 11px;
  border: 1px solid rgba(127, 223, 255, 0.18);
  background: rgba(2, 10, 22, 0.72);
  display: grid;
  align-content: center;
  gap: 3px;
}

.hangar-tooltip-stat span {
  color: rgba(168, 205, 228, 0.78);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.hangar-tooltip-stat strong {
  color: #ffffff;
  font-size: 15px;
  font-weight: 900;
  line-height: 1;
}

.hangar-tooltip-note {
  position: relative;
  z-index: 1;
  color: rgba(215, 233, 245, 0.78);
  font-size: 11px;
  line-height: 1.3;
  border-top: 1px solid rgba(127, 223, 255, 0.12);
  padding-top: 8px;
}

/* Cleaner available cards: equal, icon-only, with small quantity bubble */
.scalable-equipment-grid,
.compact-equipment-grid {
  grid-template-columns: repeat(auto-fill, minmax(82px, 1fr));
  gap: 9px;
}

.scalable-equipment-grid .inventory-icon-card,
.compact-equipment-grid .inventory-icon-card {
  height: 84px;
  min-height: 84px;
  max-height: 84px;
  padding: 7px;
  background:
    radial-gradient(circle at 50% 24%, rgba(127, 223, 255, 0.11), transparent 46%),
    linear-gradient(145deg, rgba(5, 18, 34, 0.88), rgba(1, 7, 16, 0.92));
}

.scalable-equipment-grid .inventory-icon-card img,
.compact-equipment-grid .inventory-icon-card img {
  width: 60px;
  height: 60px;
  object-fit: contain;
}

.scalable-equipment-grid .inventory-icon-card strong,
.compact-equipment-grid .inventory-icon-card strong {
  font-size: 10px;
  height: 19px;
  min-width: 23px;
  padding: 0 5px;
}

/* Give sections more room and prevent cramped card columns */
.equipment-drawer {
  grid-template-rows: minmax(124px, 0.78fr) minmax(220px, 1.22fr);
}

.equipment-drawer .mini-panel-title {
  padding-bottom: 9px;
}

.equipment-drawer .mini-panel-title span {
  font-size: 11px;
}

.equipment-drawer .mini-panel-title small {
  font-size: 10px;
}

/* Slot rail title cleanup */
.compact-bank-title span {
  font-size: 9.5px;
}

.compact-bank-title small {
  min-width: 30px;
}

/* Slightly more epic, but still restrained, equipped area */
.orbit-ship-stage {
  background:
    radial-gradient(circle at 50% 48%, rgba(80, 200, 255, 0.25), transparent 35%),
    radial-gradient(circle at 50% 48%, rgba(255,255,255,0.08), transparent 18%),
    radial-gradient(circle at 50% 48%, rgba(0, 140, 255, 0.10), transparent 58%),
    rgba(1, 7, 16, 0.22);
}

.orbit-ship-stage img {
  filter:
    drop-shadow(0 0 26px rgba(70, 180, 255, 0.22))
    drop-shadow(0 0 48px rgba(70, 180, 255, 0.12));
}




/* ===== Rich tooltip support for equipped loadout slots ===== */
.equipment-slot.scalable-loadout-slot[data-tooltip]:hover {
  border-color: rgba(127, 223, 255, 1);
  box-shadow:
    0 0 18px rgba(127, 223, 255, 0.20),
    inset 0 0 15px rgba(127, 223, 255, 0.10);
}

.equipment-slot.scalable-loadout-slot[data-tooltip]:hover::after {
  content: none !important;
}

/* Slightly distinguish installed vs available hover without extra text */
.orbit-slot-rail .equipment-slot.scalable-loadout-slot.filled {
  position: relative;
}

.orbit-slot-rail .equipment-slot.scalable-loadout-slot.filled::before {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 11px;
  background: radial-gradient(circle at 50% 48%, rgba(127, 223, 255, 0.09), transparent 62%);
  pointer-events: none;
}

.orbit-slot-rail .equipment-slot.scalable-loadout-slot.filled img {
  position: relative;
  z-index: 1;
}




/* ===== Final Hangar Command polish: clearer stats, slot summary, no clipped rail labels ===== */

/* First tab now represents the command/loadout bay */
.hangar-tabs #hangarOverviewTab {
  letter-spacing: 0.8px;
}

/* Stronger stat cards without making the panel noisy */
.integrated-stats-panel .overview-stat-grid .hangar-stat-card {
  position: relative;
  overflow: hidden;
  min-height: 66px;
  border-color: rgba(127, 223, 255, 0.22);
  background:
    radial-gradient(circle at 82% 12%, rgba(127, 223, 255, 0.14), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
  box-shadow:
    inset 0 0 18px rgba(0, 160, 255, 0.045),
    0 0 12px rgba(0, 120, 255, 0.035);
}

.integrated-stats-panel .overview-stat-grid .hangar-stat-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 0 42%, rgba(255,255,255,0.045) 50%, transparent 58%);
  opacity: 0.65;
  pointer-events: none;
}

.integrated-stats-panel .overview-stat-grid .hangar-stat-card span,
.integrated-stats-panel .overview-stat-grid .hangar-stat-card strong {
  position: relative;
  z-index: 1;
}

.integrated-stats-panel .overview-stat-grid .hangar-stat-card strong {
  font-size: 17px;
}

.integrated-stats-panel .overview-stat-grid .featured-stat strong {
  font-size: 18px;
}

.integrated-stats-panel .overview-stat-grid .hull-stat {
  border-color: rgba(127, 223, 255, 0.26);
}

.integrated-stats-panel .overview-stat-grid .shield-stat {
  border-color: rgba(80, 170, 255, 0.34);
  background:
    radial-gradient(circle at 82% 12%, rgba(80, 170, 255, 0.17), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.integrated-stats-panel .overview-stat-grid .cargo-stat {
  border-color: rgba(255, 204, 94, 0.34);
  background:
    radial-gradient(circle at 82% 12%, rgba(255, 204, 94, 0.15), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.integrated-stats-panel .overview-stat-grid .jump-stat {
  border-color: rgba(115, 210, 255, 0.35);
  background:
    radial-gradient(circle at 82% 12%, rgba(115, 210, 255, 0.15), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.integrated-stats-panel .overview-stat-grid .evasion-stat {
  border-color: rgba(52, 229, 154, 0.36);
  background:
    radial-gradient(circle at 82% 12%, rgba(52, 229, 154, 0.16), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

/* Cleaner loadout capacity card */
.integrated-stats-panel .overview-stat-grid .slot-split-card {
  grid-column: 1 / -1;
  min-height: 78px;
  padding: 11px;
  border-color: rgba(127, 223, 255, 0.26);
}

.slot-mini-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 8px;
}

.slot-mini-grid div {
  min-height: 42px;
  display: grid;
  align-content: center;
  gap: 2px;
  padding: 8px;
  border-radius: 11px;
  border: 1px solid rgba(127, 223, 255, 0.18);
  background: rgba(2, 10, 22, 0.62);
}

.slot-mini-grid small {
  color: rgba(160, 207, 235, 0.72);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.slot-mini-grid strong {
  color: #f7fbff;
  font-size: 18px !important;
  line-height: 1;
}

/* Middle loadout header/rail text: stop clipping and keep it readable */
.orbit-loadout-arena {
  grid-template-columns: minmax(102px, 124px) minmax(300px, 1fr) minmax(112px, 132px);
  gap: 12px;
}

.orbit-rail {
  padding: 9px;
}

.compact-bank-title {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
}

.compact-bank-title span {
  font-size: 9px;
  letter-spacing: 0.75px;
  white-space: nowrap;
}

.compact-bank-title small {
  min-width: 32px;
  height: 26px;
  display: grid;
  place-items: center;
  padding: 0 7px;
  border-radius: 999px;
}

.orbit-rail-right .compact-bank-title span {
  font-size: 8.8px;
}

/* Keep the active vessel title away from the right slot rail */
.loadout-stage-header {
  padding-right: 8px;
}

.loadout-title-cluster strong {
  font-size: 22px;
  letter-spacing: 2.1px;
}

.loadout-title-cluster small {
  font-size: 8.5px;
  letter-spacing: 1.25px;
}

/* Slightly better footer spacing */
.hangar-orbit-loadout .loadout-stage-footer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.hangar-orbit-loadout .loadout-stage-footer span:last-child {
  text-align: right;
}

@media (max-height: 760px) {
  .integrated-stats-panel .overview-stat-grid .hangar-stat-card {
    min-height: 56px;
  }

  .integrated-stats-panel .overview-stat-grid .slot-split-card {
    min-height: 68px;
  }

  .slot-mini-grid div {
    min-height: 34px;
    padding: 6px;
  }

  .loadout-title-cluster strong {
    font-size: 20px;
  }

  .orbit-loadout-arena {
    grid-template-columns: minmax(96px, 116px) minmax(270px, 1fr) minmax(104px, 124px);
  }
}




/* ===== Hangar fit-to-screen correction ===== */
#hangarScreen {
  overflow: hidden;
}

#hangarScreen .screen-panel {
  max-height: calc(100vh - 24px);
  overflow: hidden;
  padding-bottom: 10px;
}

#hangarScreen .hangar-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

#hangarScreen .hangar-tabs button {
  min-width: 0;
  padding: 10px 8px;
}

#hangarScreen .integrated-hangar-grid {
  grid-template-columns: 250px minmax(0, 1fr) 320px;
  gap: 12px;
  min-height: 0;
  height: calc(100vh - 205px);
  max-height: 494px;
  overflow: hidden;
}

#hangarScreen .integrated-stats-panel,
#hangarScreen .hangar-orbit-loadout,
#hangarScreen .equipment-drawer-panel {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

#hangarScreen .integrated-stats-panel {
  padding: 14px;
  display: grid;
  grid-template-rows: auto auto auto;
  align-content: start;
}

#hangarScreen .integrated-stats-panel h3 {
  font-size: 25px;
  margin-bottom: 10px;
}

#hangarScreen .integrated-stats-panel .overview-stat-grid {
  gap: 7px;
}

#hangarScreen .integrated-stats-panel .overview-stat-grid .hangar-stat-card {
  min-height: 54px;
  padding: 8px 10px;
}

#hangarScreen .integrated-stats-panel .overview-stat-grid .hangar-stat-card strong {
  font-size: 16px;
}

#hangarScreen .integrated-stats-panel .overview-stat-grid .slot-split-card {
  min-height: 70px;
}

#hangarScreen .slot-mini-grid {
  margin-top: 6px;
  gap: 7px;
}

#hangarScreen .slot-mini-grid div {
  min-height: 34px;
  padding: 6px 8px;
}

#hangarScreen .slot-mini-grid strong {
  font-size: 16px !important;
}

#hangarScreen .prestige-repair-strip {
  margin-top: 10px;
  padding: 10px;
}

#hangarScreen .prestige-repair-strip strong {
  font-size: 18px;
}

#hangarScreen .prestige-repair-strip button {
  width: 82px;
  min-height: 38px;
}

#hangarScreen .hangar-orbit-loadout {
  grid-template-rows: auto minmax(0, 1fr) auto;
  padding: 14px;
}

#hangarScreen .loadout-stage-header {
  padding-right: 0;
  min-width: 0;
}

#hangarScreen .loadout-stage-header > span {
  white-space: nowrap;
}

#hangarScreen .loadout-title-cluster {
  min-width: 0;
  max-width: 52%;
  overflow: hidden;
}

#hangarScreen .loadout-title-cluster strong {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 21px;
  letter-spacing: 1.6px;
}

#hangarScreen .loadout-title-cluster small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#hangarScreen .orbit-loadout-arena {
  grid-template-columns: 92px minmax(0, 1fr) 96px;
  gap: 10px;
  min-height: 0;
  padding: 6px 0 2px;
}

#hangarScreen .orbit-ship-stage {
  min-width: 0;
  min-height: 0;
}

#hangarScreen .orbit-ship-stage img {
  max-width: min(76%, 315px);
  max-height: 290px;
}

#hangarScreen .orbit-rail {
  padding: 7px;
  border-radius: 16px;
}

#hangarScreen .compact-bank-title {
  grid-template-columns: 1fr auto;
  gap: 5px;
  min-width: 0;
}

#hangarScreen .compact-bank-title span {
  min-width: 0;
  font-size: 8.4px;
  letter-spacing: 0.45px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#hangarScreen .compact-bank-title small {
  min-width: 28px;
  height: 23px;
  padding: 0 5px;
  font-size: 9px;
}

#hangarScreen .orbit-slot-rail {
  gap: 8px;
}

#hangarScreen .orbit-slot-rail .equipment-slot.scalable-loadout-slot {
  width: 58px;
}

#hangarScreen .orbit-slot-rail .equipment-slot.scalable-loadout-slot img {
  width: 46px;
  height: 46px;
}

#hangarScreen .orbit-slot-rail .equipment-slot.scalable-loadout-slot .slot-silhouette {
  width: 30px;
  height: 30px;
}

#hangarScreen .loadout-stage-footer {
  grid-template-columns: 1fr auto;
  font-size: 9.5px;
  gap: 8px;
  overflow: hidden;
}

#hangarScreen .loadout-stage-footer span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#hangarScreen .equipment-drawer-panel {
  padding: 14px;
}

#hangarScreen .equipment-panel-header {
  padding-bottom: 8px;
}

#hangarScreen .equipment-panel-header small {
  font-size: 10px;
}

#hangarScreen .equipment-drawer {
  grid-template-rows: minmax(90px, 0.62fr) minmax(0, 1.38fr);
  gap: 10px;
}

#hangarScreen .scalable-equipment-grid,
#hangarScreen .compact-equipment-grid {
  grid-template-columns: repeat(auto-fill, minmax(76px, 1fr));
  gap: 8px;
}

#hangarScreen .scalable-equipment-grid .inventory-icon-card,
#hangarScreen .compact-equipment-grid .inventory-icon-card,
#hangarScreen .integrated-hangar-grid .cargo-empty.compact-empty {
  height: 78px;
  min-height: 78px;
  max-height: 78px;
}

#hangarScreen .scalable-equipment-grid .inventory-icon-card img,
#hangarScreen .compact-equipment-grid .inventory-icon-card img {
  width: 54px;
  height: 54px;
}

@media (max-height: 760px) {
  #hangarScreen .integrated-hangar-grid {
    height: calc(100vh - 190px);
    max-height: 460px;
  }

  #hangarScreen .screen-panel {
    padding-top: 18px;
  }

  #hangarScreen .integrated-stats-panel .overview-stat-grid .hangar-stat-card {
    min-height: 49px;
  }

  #hangarScreen .integrated-stats-panel .overview-stat-grid .slot-split-card {
    min-height: 64px;
  }

  #hangarScreen .orbit-ship-stage img {
    max-height: 250px;
  }

  #hangarScreen .scalable-equipment-grid .inventory-icon-card,
  #hangarScreen .compact-equipment-grid .inventory-icon-card,
  #hangarScreen .integrated-hangar-grid .cargo-empty.compact-empty {
    height: 70px;
    min-height: 70px;
    max-height: 70px;
  }

  #hangarScreen .scalable-equipment-grid .inventory-icon-card img,
  #hangarScreen .compact-equipment-grid .inventory-icon-card img {
    width: 48px;
    height: 48px;
  }
}

@media (max-width: 1160px) {
  #hangarScreen .integrated-hangar-grid {
    grid-template-columns: 230px minmax(0, 1fr) 290px;
  }

  #hangarScreen .orbit-loadout-arena {
    grid-template-columns: 82px minmax(0, 1fr) 86px;
  }

  #hangarScreen .orbit-slot-rail .equipment-slot.scalable-loadout-slot {
    width: 52px;
  }
}

/* ===== Scalable Hangar loadout matrix ===== */
#hangarScreen .integrated-hangar-grid {
  grid-template-columns: minmax(210px, 0.72fr) minmax(430px, 1.48fr) minmax(280px, 0.92fr);
}

#hangarScreen .hangar-orbit-loadout {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
}

#hangarScreen .scalable-loadout-arena {
  display: grid;
  grid-template-columns: minmax(180px, 0.74fr) minmax(260px, 1.26fr);
  align-items: stretch;
  gap: 12px;
  padding: 8px 0 0;
}

#hangarScreen .scalable-loadout-arena::before {
  inset: 8px 0;
  border-radius: 18px;
}

#hangarScreen .scalable-loadout-arena .orbit-ship-stage {
  min-height: 250px;
  border: 1px solid rgba(106, 214, 255, 0.16);
  border-radius: 16px;
  background:
    radial-gradient(circle at 50% 46%, rgba(72, 184, 241, 0.25), transparent 42%),
    linear-gradient(180deg, rgba(11, 32, 49, 0.76), rgba(4, 12, 22, 0.72));
  box-shadow: inset 0 0 36px rgba(82, 209, 255, 0.1);
}

#hangarScreen .scalable-loadout-arena .orbit-ship-stage img {
  max-width: min(78%, 270px);
  max-height: 230px;
}

#hangarScreen .loadout-slot-matrix {
  display: grid;
  grid-template-rows: minmax(0, 0.94fr) minmax(0, 1.06fr);
  gap: 10px;
  min-width: 0;
  min-height: 0;
}

#hangarScreen .loadout-slot-bank {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  padding: 9px;
  border: 1px solid rgba(106, 214, 255, 0.2);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(7, 22, 36, 0.88), rgba(4, 12, 21, 0.9));
}

#hangarScreen .loadout-slot-bank .compact-bank-title {
  margin-bottom: 8px;
}

#hangarScreen .loadout-slot-bank .compact-bank-title span {
  font-size: 9px;
  letter-spacing: 1px;
}

#hangarScreen .loadout-slot-bank .compact-bank-title small {
  min-width: 42px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(48px, 1fr));
  align-content: start;
  gap: 7px;
  min-height: 0;
  overflow-y: auto;
  padding: 1px 4px 1px 1px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail.many-slots {
  grid-template-columns: repeat(auto-fill, minmax(42px, 1fr));
  gap: 6px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail.very-many-slots {
  grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));
  gap: 5px;
}

#hangarScreen .loadout-slot-bank .equipment-slot.scalable-loadout-slot {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border-radius: 8px;
}

#hangarScreen .loadout-slot-bank .equipment-slot.scalable-loadout-slot::after {
  content: attr(data-slot-index);
  position: absolute;
  right: 4px;
  bottom: 3px;
  font-size: 8px;
  line-height: 1;
  color: rgba(183, 226, 255, 0.62);
  letter-spacing: 0;
}

#hangarScreen .loadout-slot-bank .equipment-slot.scalable-loadout-slot img {
  width: 76%;
  height: 76%;
  object-fit: contain;
}

#hangarScreen .loadout-slot-bank .equipment-slot.scalable-loadout-slot .slot-silhouette {
  width: 42%;
  height: 42%;
  font-size: 10px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail.very-many-slots .equipment-slot.scalable-loadout-slot::after {
  font-size: 7px;
  right: 3px;
  bottom: 2px;
}

#hangarScreen .loadout-quick-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

#hangarScreen .loadout-quick-stats div {
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(106, 214, 255, 0.17);
  border-radius: 8px;
  background: rgba(5, 18, 31, 0.72);
}

#hangarScreen .loadout-quick-stats span {
  display: block;
  overflow: hidden;
  color: #8fb4cb;
  font-size: 8.5px;
  font-weight: 800;
  letter-spacing: 0.9px;
  text-transform: uppercase;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#hangarScreen .loadout-quick-stats strong {
  display: block;
  margin-top: 2px;
  color: #f2fbff;
  font-size: 17px;
  line-height: 1;
}

#hangarScreen .equipment-drawer-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

#hangarScreen .equipment-drawer {
  display: grid;
  grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  min-height: 0;
  overflow: hidden;
}

#hangarScreen .available-equipment-block {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
}

#hangarScreen .available-equipment-block .inventory-icon-grid {
  grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
  max-height: none;
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-width: thin;
}

#hangarScreen .available-equipment-block .inventory-icon-grid::-webkit-scrollbar {
  width: 6px;
}

#hangarScreen .available-equipment-block .inventory-icon-grid::-webkit-scrollbar-track {
  background: rgba(4, 16, 28, 0.76);
  border-radius: 999px;
}

#hangarScreen .available-equipment-block .inventory-icon-grid::-webkit-scrollbar-thumb {
  background: rgba(105, 220, 255, 0.48);
  border-radius: 999px;
}

@media (max-height: 760px) {
  #hangarScreen .scalable-loadout-arena .orbit-ship-stage {
    min-height: 210px;
  }

  #hangarScreen .scalable-loadout-arena .orbit-ship-stage img {
    max-height: 190px;
  }

  #hangarScreen .loadout-quick-stats div {
    padding: 7px 8px;
  }

  #hangarScreen .loadout-quick-stats strong {
    font-size: 15px;
  }
}

@media (max-width: 1160px) {
  #hangarScreen .integrated-hangar-grid {
    grid-template-columns: minmax(200px, 0.7fr) minmax(390px, 1.35fr) minmax(260px, 0.9fr);
  }

  #hangarScreen .scalable-loadout-arena {
    grid-template-columns: minmax(150px, 0.68fr) minmax(240px, 1.32fr);
  }
}

@media (max-width: 980px) {
  #hangarScreen {
    overflow: auto;
  }

  #hangarScreen .screen-panel,
  #hangarScreen .integrated-hangar-grid {
    height: auto;
    max-height: none;
    overflow: visible;
  }

  #hangarScreen .integrated-hangar-grid {
    grid-template-columns: 1fr;
  }

  #hangarScreen .scalable-loadout-arena {
    grid-template-columns: 1fr;
  }

  #hangarScreen .loadout-slot-matrix {
    grid-template-rows: none;
    grid-template-columns: 1fr;
  }
}

/* ===== Hangar Bay rework: central statement ship with side slot banks ===== */
#hangarScreen.hangar-screen {
  background:
    linear-gradient(180deg, rgba(1, 6, 14, 0.34), rgba(0, 0, 0, 0.58)),
    radial-gradient(circle at 50% 62%, rgba(46, 180, 255, 0.18), transparent 34%),
    url("assets/backgrounds/hangar-bay-background.png") center center / cover no-repeat;
}

#hangarScreen.hangar-screen::before {
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.55), transparent 25%, transparent 75%, rgba(0, 0, 0, 0.55)),
    linear-gradient(180deg, rgba(0, 8, 18, 0.24), rgba(0, 0, 0, 0.72));
}

#hangarScreen .integrated-hangar-grid {
  grid-template-columns: minmax(220px, 0.7fr) minmax(540px, 1.72fr) minmax(280px, 0.88fr);
  height: calc(100vh - 198px);
  max-height: 520px;
}

#hangarScreen .integrated-stats-panel {
  grid-template-rows: auto auto minmax(0, auto) auto;
  overflow: hidden;
  gap: 8px;
}

#hangarScreen .integrated-stats-panel .overview-stat-grid {
  overflow: visible;
  padding-right: 2px;
  align-content: start;
}

#hangarScreen .integrated-stats-panel .overview-stat-grid .hangar-stat-card {
  min-height: 45px;
}

#hangarScreen .integrated-stats-panel .overview-stat-grid .evasion-stat {
  min-height: 48px;
}

#hangarScreen .prestige-repair-strip {
  align-self: end;
  margin-top: 6px;
  min-height: 58px;
  padding: 8px 10px;
}

#hangarScreen .prestige-repair-strip strong {
  font-size: 16px;
}

#hangarScreen .prestige-repair-strip small {
  line-height: 1.1;
}

#hangarScreen .prestige-repair-strip button {
  min-height: 36px;
}

#hangarScreen .hangar-orbit-loadout {
  grid-template-rows: auto minmax(0, 1fr) auto;
  background:
    linear-gradient(180deg, rgba(4, 18, 31, 0.78), rgba(0, 6, 15, 0.74)),
    radial-gradient(circle at 50% 58%, rgba(65, 194, 255, 0.11), transparent 48%);
}

#hangarScreen .scalable-loadout-arena {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 0;
  padding: 8px 0 4px;
}

#hangarScreen .scalable-loadout-arena::before {
  inset: 10px 7%;
  border-radius: 28px;
  background:
    radial-gradient(circle at 50% 54%, rgba(71, 190, 255, 0.14), transparent 37%),
    linear-gradient(90deg, transparent, rgba(127, 223, 255, 0.045), transparent);
}

#hangarScreen .loadout-slot-matrix {
  display: grid;
  grid-template-columns: 118px minmax(280px, 1fr) 118px;
  grid-template-rows: minmax(0, 1fr);
  align-items: stretch;
  gap: 14px;
  min-height: 0;
}

#hangarScreen .loadout-slot-bank {
  align-self: stretch;
  min-width: 0;
  min-height: 0;
  padding: 9px 8px;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(7, 24, 39, 0.84), rgba(2, 9, 18, 0.82)),
    radial-gradient(circle at 50% 0%, rgba(99, 212, 255, 0.12), transparent 42%);
}

#hangarScreen .loadout-slot-bank .compact-bank-title {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  min-height: 28px;
  padding-bottom: 6px;
  margin-bottom: 6px;
}

#hangarScreen .loadout-slot-bank .compact-bank-title span {
  min-width: 0;
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
  font-size: 8px;
  letter-spacing: 0.55px;
}

#hangarScreen .loadout-slot-bank .compact-bank-title small {
  min-width: 34px;
  height: 21px;
  padding: 0 5px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail {
  grid-template-columns: 1fr;
  grid-auto-rows: 58px;
  gap: 8px;
  align-content: start;
  justify-items: center;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  padding: 1px 4px 1px 1px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail::-webkit-scrollbar {
  width: 6px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail::-webkit-scrollbar-track {
  background: rgba(4, 16, 28, 0.76);
  border-radius: 999px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail::-webkit-scrollbar-thumb {
  background: rgba(105, 220, 255, 0.48);
  border-radius: 999px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail.many-slots {
  grid-template-columns: 1fr;
  grid-auto-rows: 52px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail.very-many-slots {
  grid-template-columns: 1fr;
  grid-auto-rows: 46px;
  gap: 6px;
}

#hangarScreen .loadout-slot-bank .equipment-slot.scalable-loadout-slot {
  width: 58px;
  max-width: 100%;
  justify-self: center;
  height: 58px;
  aspect-ratio: auto;
  border-radius: 9px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail.many-slots .equipment-slot.scalable-loadout-slot {
  width: 52px;
  height: 52px;
}

#hangarScreen .loadout-slot-bank .orbit-slot-rail.very-many-slots .equipment-slot.scalable-loadout-slot {
  width: 44px;
  height: 44px;
}

#hangarScreen .loadout-slot-bank .equipment-slot.scalable-loadout-slot img {
  width: 76%;
  height: 76%;
}

#hangarScreen .loadout-slot-bank .equipment-slot.scalable-loadout-slot::after {
  font-size: 7px;
}

#hangarScreen .loadout-slot-matrix .orbit-ship-stage {
  min-height: 0;
  height: 100%;
  border-radius: 24px;
  border-color: rgba(113, 221, 255, 0.22);
  background:
    radial-gradient(circle at 50% 58%, rgba(65, 194, 255, 0.27), transparent 35%),
    radial-gradient(circle at 50% 58%, rgba(255, 255, 255, 0.09), transparent 16%),
    linear-gradient(180deg, rgba(8, 24, 38, 0.44), rgba(0, 7, 17, 0.38));
  box-shadow:
    inset 0 0 52px rgba(83, 201, 255, 0.11),
    0 0 28px rgba(0, 0, 0, 0.26);
}

#hangarScreen .loadout-slot-matrix .orbit-ship-stage::before {
  width: min(86%, 430px);
}

#hangarScreen .loadout-slot-matrix .orbit-halo-outer {
  width: min(92%, 440px);
}

#hangarScreen .loadout-slot-matrix .orbit-halo-inner {
  width: min(58%, 270px);
}

#hangarScreen .loadout-slot-matrix .orbit-ship-stage img {
  max-width: min(78%, 365px);
  max-height: min(84%, 365px);
}

#hangarScreen .loadout-quick-stats {
  margin-top: 8px;
  gap: 8px;
}

#hangarScreen .loadout-quick-stats div {
  min-height: 54px;
  padding: 7px 10px 8px;
}

#hangarScreen .loadout-summary-pips {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 6px;
  min-height: 6px;
}

#hangarScreen .loadout-summary-pips .ship-slot-pip {
  width: 15px;
  height: 5px;
  border-radius: 999px;
}

#hangarScreen .loadout-summary-pips .ship-slot-pip.condensed {
  width: 11px;
}

#hangarScreen #attachmentSlotPipsMirror .ship-slot-pip.filled {
  background: linear-gradient(90deg, #2fe6ae, #9bffd6);
  box-shadow: 0 0 9px rgba(47, 230, 174, 0.34);
}

#hangarScreen .loadout-stage-footer {
  margin-top: 7px;
}

#hangarScreen .integrated-stats-panel h3 {
  line-height: 1.05;
}

#hangarScreen .integrated-stats-panel .overview-stat-grid .hangar-stat-card span {
  line-height: 1.15;
}

#hangarScreen .integrated-stats-panel h3 {
  font-size: 22px;
  margin-bottom: 7px;
}

@media (max-height: 760px) {
  #hangarScreen .integrated-hangar-grid {
    height: calc(100vh - 184px);
    max-height: 480px;
  }

  #hangarScreen .integrated-stats-panel .overview-stat-grid .hangar-stat-card {
    min-height: 44px;
    padding: 7px 9px;
  }

  #hangarScreen .prestige-repair-strip {
    min-height: 56px;
    padding: 8px;
  }

  #hangarScreen .loadout-slot-matrix .orbit-ship-stage img {
    max-height: min(80%, 285px);
  }
}

@media (max-width: 1160px) {
  #hangarScreen .integrated-hangar-grid {
    grid-template-columns: minmax(205px, 0.66fr) minmax(470px, 1.58fr) minmax(250px, 0.82fr);
  }

  #hangarScreen .loadout-slot-matrix {
    grid-template-columns: 104px minmax(230px, 1fr) 104px;
    gap: 10px;
  }

  #hangarScreen .loadout-slot-bank .equipment-slot.scalable-loadout-slot {
    width: 54px;
    height: 54px;
  }
}

@media (max-width: 980px) {
  #hangarScreen .integrated-hangar-grid {
    grid-template-columns: 1fr;
    height: auto;
    max-height: none;
  }

  #hangarScreen .loadout-slot-matrix {
    grid-template-columns: 1fr;
  }

  #hangarScreen .weapon-slot-bank {
    order: 2;
  }

  #hangarScreen .loadout-slot-matrix .orbit-ship-stage {
    order: 1;
    min-height: 300px;
  }

  #hangarScreen .attachment-slot-bank {
    order: 3;
  }
}




/* ===== Fleet redesign: scalable ship gallery ===== */
#hangarOwnedSection {
  min-height: 0;
  height: calc(100vh - 185px);
  max-height: 505px;
  overflow: hidden;
}

.fleet-title-row {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  margin-bottom: 12px;
}

.fleet-count-pill {
  flex: 0 0 auto;
  padding: 7px 12px;
  border: 1px solid rgba(127, 223, 255, 0.22);
  border-radius: 999px;
  background:
    radial-gradient(circle at 25% 15%, rgba(127, 223, 255, 0.12), transparent 48%),
    rgba(4, 16, 31, 0.72);
  color: rgba(210, 235, 250, 0.82);
  font-size: 12px;
  font-weight: 800;
}

.fleet-count-pill strong {
  color: #f6fbff;
}

.fleet-layout {
  height: calc(100% - 72px);
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 14px;
  overflow: hidden;
}

.fleet-gallery-panel,
.fleet-detail-panel {
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(127, 223, 255, 0.45);
  border-radius: 16px;
  background:
    radial-gradient(circle at 20% 0%, rgba(127, 223, 255, 0.08), transparent 34%),
    linear-gradient(145deg, rgba(7, 18, 32, 0.92), rgba(0, 6, 14, 0.94));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.045),
    0 0 24px rgba(0, 140, 255, 0.06);
}

.fleet-gallery-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  padding: 12px;
}

.fleet-card-grid {
  min-height: 0;
  overflow-y: auto;
  padding: 2px 6px 2px 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(165px, 1fr));
  gap: 12px;
  align-content: start;
  scrollbar-width: thin;
}

.fleet-ship-card {
  position: relative;
  min-height: 205px;
  padding: 12px;
  border: 1px solid rgba(95, 180, 235, 0.34);
  border-radius: 16px;
  background:
    radial-gradient(circle at 50% 22%, rgba(127, 223, 255, 0.12), transparent 42%),
    linear-gradient(145deg, rgba(5, 18, 34, 0.88), rgba(1, 7, 16, 0.94));
  color: #eaf8ff;
  cursor: pointer;
  text-align: left;
  overflow: hidden;
  transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.fleet-ship-card:hover {
  transform: translateY(-2px);
  border-color: rgba(127, 223, 255, 0.82);
  box-shadow: 0 0 18px rgba(127, 223, 255, 0.12);
}

.fleet-ship-card.selected {
  border-color: rgba(127, 223, 255, 1);
  box-shadow:
    0 0 22px rgba(127, 223, 255, 0.15),
    inset 0 0 18px rgba(127, 223, 255, 0.06);
}

.fleet-ship-card.active {
  border-color: rgba(52, 229, 154, 0.72);
}

.fleet-card-badge {
  position: absolute;
  top: 9px;
  right: 9px;
  z-index: 2;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(127, 223, 255, 0.26);
  background: rgba(7, 22, 39, 0.9);
  color: #83e9ff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.9px;
  text-transform: uppercase;
}

.fleet-ship-card.active .fleet-card-badge {
  color: #5cffab;
  border-color: rgba(52, 229, 154, 0.32);
}

.fleet-card-image-wrap {
  height: 88px;
  display: grid;
  place-items: center;
  margin-bottom: 8px;
}

.fleet-card-image-wrap img {
  max-width: 100%;
  max-height: 92px;
  object-fit: contain;
  filter: drop-shadow(0 0 18px rgba(70, 180, 255, 0.16));
}

.fleet-card-name {
  color: #f7fbff;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0.4px;
  margin-bottom: 4px;
}

.fleet-card-role {
  min-height: 24px;
  color: rgba(190, 215, 235, 0.72);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  line-height: 1.15;
  margin-bottom: 9px;
}

.fleet-card-mini-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  margin-bottom: 8px;
}

.fleet-card-mini-stats span {
  padding: 5px 4px;
  border-radius: 8px;
  background: rgba(3, 12, 25, 0.72);
  border: 1px solid rgba(127, 223, 255, 0.12);
  color: rgba(230, 245, 255, 0.9);
  font-size: 10px;
  font-weight: 900;
  text-align: center;
}

.fleet-card-slots {
  padding: 6px 8px;
  border-radius: 10px;
  background: rgba(4, 16, 30, 0.78);
  border: 1px solid rgba(127, 223, 255, 0.13);
  color: #83e9ff;
  font-size: 10px;
  font-weight: 900;
  text-align: center;
}

.fleet-detail-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  padding: 12px;
}

.fleet-detail-body {
  min-height: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: 150px auto auto auto auto;
  gap: 10px;
}

.fleet-detail-hero {
  position: relative;
  display: grid;
  place-items: center;
  border: 1px solid rgba(127, 223, 255, 0.15);
  border-radius: 16px;
  background:
    radial-gradient(circle at 50% 44%, rgba(80, 200, 255, 0.18), transparent 38%),
    rgba(1, 7, 16, 0.32);
  overflow: hidden;
}

.fleet-detail-ship-glow {
  position: absolute;
  width: 64%;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(127, 223, 255, 0.13);
  box-shadow:
    0 0 60px rgba(127, 223, 255, 0.08),
    inset 0 0 38px rgba(127, 223, 255, 0.05);
}

.fleet-detail-hero img {
  position: relative;
  max-width: 80%;
  max-height: 138px;
  object-fit: contain;
  filter: drop-shadow(0 0 24px rgba(70, 180, 255, 0.18));
}

.fleet-detail-title {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: start;
}

.fleet-detail-title h4 {
  margin: 0;
  color: #f7fbff;
  font-size: 21px;
  line-height: 1.05;
}

.fleet-detail-title p {
  margin: 5px 0 0;
  color: rgba(190, 215, 235, 0.72);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.7px;
  text-transform: uppercase;
}

.fleet-status-chip {
  flex: 0 0 auto;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid rgba(127, 223, 255, 0.22);
  color: #83e9ff;
  background: rgba(5, 18, 34, 0.78);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.fleet-status-chip.active {
  border-color: rgba(52, 229, 154, 0.30);
  color: #5cffab;
}

.fleet-detail-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
}

.fleet-stat-chip {
  min-height: 48px;
  padding: 7px;
  border-radius: 11px;
  border: 1px solid rgba(127, 223, 255, 0.14);
  background: rgba(3, 12, 25, 0.72);
  display: grid;
  align-content: center;
  gap: 3px;
}

.fleet-stat-chip span {
  color: rgba(160, 207, 235, 0.74);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.9px;
  text-transform: uppercase;
}

.fleet-stat-chip strong {
  color: #ffffff;
  font-size: 14px;
  line-height: 1;
}

.fleet-weapon-strip {
  padding: 10px;
  border-radius: 13px;
  border: 1px solid rgba(127, 223, 255, 0.16);
  background: rgba(3, 12, 25, 0.72);
}

.fleet-weapon-strip span {
  display: block;
  color: #83e9ff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1.1px;
  text-transform: uppercase;
}

.fleet-weapon-strip strong {
  display: block;
  margin-top: 4px;
  color: #f7fbff;
  font-size: 14px;
}

.fleet-weapon-strip small {
  display: block;
  margin-top: 3px;
  color: rgba(190, 215, 235, 0.72);
  font-size: 11px;
}

.fleet-detail-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.fleet-detail-actions button {
  min-height: 42px;
  border-radius: 12px;
}

@media (max-height: 760px) {
  #hangarOwnedSection {
    height: calc(100vh - 170px);
    max-height: 460px;
  }

  .fleet-layout {
    height: calc(100% - 62px);
  }

  .fleet-detail-body {
    grid-template-rows: 118px auto auto auto auto;
    gap: 8px;
  }

  .fleet-detail-hero img {
    max-height: 108px;
  }

  .fleet-ship-card {
    min-height: 185px;
  }

  .fleet-card-image-wrap {
    height: 76px;
  }
}

@media (max-width: 1100px) {
  .fleet-layout {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .fleet-detail-panel {
    min-height: 360px;
  }
}




/* ===== Fleet detail stat cards aligned with Command panel style ===== */
.fleet-detail-stats {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.fleet-detail-stats .fleet-stat-chip {
  position: relative;
  overflow: hidden;
  min-height: 64px;
  padding: 9px 10px;
  border-radius: 13px;
  border: 1px solid rgba(127, 223, 255, 0.22);
  background:
    radial-gradient(circle at 82% 12%, rgba(127, 223, 255, 0.14), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
  box-shadow:
    inset 0 0 18px rgba(0, 160, 255, 0.045),
    0 0 12px rgba(0, 120, 255, 0.035);
}

.fleet-detail-stats .fleet-stat-chip::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 0 42%, rgba(255,255,255,0.045) 50%, transparent 58%);
  opacity: 0.65;
  pointer-events: none;
}

.fleet-detail-stats .fleet-stat-chip span,
.fleet-detail-stats .fleet-stat-chip strong {
  position: relative;
  z-index: 1;
}

.fleet-detail-stats .fleet-stat-chip span {
  color: rgba(160, 207, 235, 0.78);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.fleet-detail-stats .fleet-stat-chip strong {
  color: #f7fbff;
  font-size: 17px;
  line-height: 1;
}

.fleet-detail-stats .fleet-stat-chip.hull-stat {
  grid-column: 1 / -1;
  border-color: rgba(127, 223, 255, 0.26);
  min-height: 62px;
}

.fleet-detail-stats .fleet-stat-chip.shield-stat {
  border-color: rgba(80, 170, 255, 0.34);
  background:
    radial-gradient(circle at 82% 12%, rgba(80, 170, 255, 0.17), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.fleet-detail-stats .fleet-stat-chip.cargo-stat {
  border-color: rgba(255, 204, 94, 0.34);
  background:
    radial-gradient(circle at 82% 12%, rgba(255, 204, 94, 0.15), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.fleet-detail-stats .fleet-stat-chip.jump-stat {
  border-color: rgba(115, 210, 255, 0.35);
  background:
    radial-gradient(circle at 82% 12%, rgba(115, 210, 255, 0.15), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.fleet-detail-stats .fleet-stat-chip.evasion-stat {
  border-color: rgba(52, 229, 154, 0.36);
  background:
    radial-gradient(circle at 82% 12%, rgba(52, 229, 154, 0.16), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.fleet-detail-stats .fleet-stat-chip.slots-stat {
  grid-column: 1 / -1;
  min-height: 56px;
  border-color: rgba(127, 223, 255, 0.26);
}

.fleet-detail-body {
  grid-template-rows: 150px auto minmax(0, auto) auto auto;
}

.fleet-weapon-strip {
  border-color: rgba(127, 223, 255, 0.20);
  background:
    radial-gradient(circle at 88% 10%, rgba(127, 223, 255, 0.09), transparent 42%),
    rgba(3, 12, 25, 0.72);
}

@media (max-height: 760px) {
  .fleet-detail-stats .fleet-stat-chip {
    min-height: 52px;
    padding: 7px 9px;
  }

  .fleet-detail-stats .fleet-stat-chip.hull-stat {
    min-height: 54px;
  }

  .fleet-detail-stats .fleet-stat-chip.slots-stat {
    min-height: 48px;
  }

  .fleet-detail-stats .fleet-stat-chip strong {
    font-size: 15px;
  }
}




/* ===== Fleet fit-to-screen correction / code-only patch ===== */
#hangarOwnedSection {
  height: calc(100vh - 178px);
  max-height: 492px;
  overflow: hidden;
}

.fleet-title-row {
  margin-bottom: 8px;
}

.fleet-title-row h3 {
  margin-bottom: 2px;
}

.fleet-title-row p {
  margin: 0;
  font-size: 13px;
  line-height: 1.25;
}

.fleet-layout {
  height: calc(100% - 56px);
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 12px;
}

.fleet-gallery-panel,
.fleet-detail-panel {
  min-height: 0;
}

.fleet-card-grid {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
}

.fleet-ship-card {
  min-height: 184px;
  padding: 10px;
}

.fleet-card-image-wrap {
  height: 72px;
  margin-bottom: 7px;
}

.fleet-card-image-wrap img {
  max-height: 74px;
}

.fleet-card-name {
  font-size: 14px;
}

.fleet-card-role {
  min-height: 22px;
  font-size: 9px;
  margin-bottom: 7px;
}

.fleet-card-mini-stats {
  gap: 4px;
  margin-bottom: 7px;
}

.fleet-card-mini-stats span {
  padding: 4px 3px;
  font-size: 9px;
}

.fleet-card-slots {
  padding: 5px 7px;
  font-size: 9px;
}

.fleet-detail-panel {
  padding: 10px;
}

.fleet-detail-body {
  grid-template-rows: 112px auto auto minmax(72px, auto);
  gap: 8px;
  overflow: hidden;
}

.fleet-detail-hero {
  min-height: 0;
}

.fleet-detail-hero img {
  max-height: 104px;
}

.fleet-detail-title h4 {
  font-size: 20px;
}

.fleet-detail-title p {
  font-size: 10px;
}

.fleet-status-chip {
  padding: 4px 8px;
  font-size: 9px;
}

.fleet-detail-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.fleet-detail-stats .fleet-stat-chip,
.fleet-detail-stats .fleet-stat-chip.hull-stat,
.fleet-detail-stats .fleet-stat-chip.slots-stat {
  grid-column: auto;
  min-height: 50px;
  padding: 7px 8px;
}

.fleet-detail-stats .fleet-stat-chip span {
  font-size: 8.5px;
  letter-spacing: 0.8px;
}

.fleet-detail-stats .fleet-stat-chip strong {
  font-size: 14px;
}

.fleet-detail-stats .fleet-stat-chip.slots-stat strong {
  font-size: 12px;
}

.fleet-weapon-action-row {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(118px, 0.95fr);
  gap: 8px;
  align-items: stretch;
}

.fleet-weapon-strip.compact {
  min-width: 0;
  padding: 8px;
  border-radius: 12px;
}

.fleet-weapon-strip.compact span {
  font-size: 8.5px;
}

.fleet-weapon-strip.compact strong {
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.15;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.fleet-weapon-strip.compact small {
  font-size: 10px;
}

.fleet-detail-actions.compact {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
}

.fleet-detail-actions.compact button {
  min-height: 34px;
  padding: 7px 8px;
  border-radius: 10px;
  font-size: 12px;
}

.fleet-swap-actions {
  grid-template-columns: 1.2fr 1fr !important;
  align-self: end;
}

.fleet-swap-actions .fleet-primary-swap {
  border-color: rgba(101, 240, 160, 0.42);
  background: linear-gradient(135deg, #1d7b5d, #0b4535);
  color: #eafff4;
  box-shadow: 0 0 18px rgba(101, 240, 160, 0.12);
}

.fleet-swap-actions .fleet-primary-swap:disabled {
  background: rgba(18, 58, 38, 0.58);
  color: #65f0a0;
  box-shadow: none;
}

/* Override earlier larger Fleet stat style when screen height is tight */
@media (max-height: 780px) {
  #hangarOwnedSection {
    height: calc(100vh - 166px);
    max-height: 458px;
  }

  .fleet-layout {
    height: calc(100% - 50px);
  }

  .fleet-detail-body {
    grid-template-rows: 92px auto auto minmax(66px, auto);
    gap: 7px;
  }

  .fleet-detail-hero img {
    max-height: 88px;
  }

  .fleet-detail-title h4 {
    font-size: 18px;
  }

  .fleet-detail-stats {
    gap: 5px;
  }

  .fleet-detail-stats .fleet-stat-chip,
  .fleet-detail-stats .fleet-stat-chip.hull-stat,
  .fleet-detail-stats .fleet-stat-chip.slots-stat {
    min-height: 43px;
    padding: 6px 7px;
  }

  .fleet-detail-stats .fleet-stat-chip strong {
    font-size: 13px;
  }

  .fleet-weapon-strip.compact {
    padding: 7px;
  }

  .fleet-detail-actions.compact button {
    min-height: 31px;
  }

  .fleet-ship-card {
    min-height: 166px;
  }

  .fleet-card-image-wrap {
    height: 60px;
  }

  .fleet-card-image-wrap img {
    max-height: 62px;
  }
}

@media (max-width: 1160px) {
  .fleet-layout {
    grid-template-columns: minmax(0, 1fr) 330px;
  }

  .fleet-detail-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}




/* ===== Fleet wording cleanup: Loadout tab + future-proof weapon summary ===== */
.fleet-weapon-strip.compact strong {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: unset;
}

.fleet-weapon-strip.compact small {
  color: rgba(190, 215, 235, 0.76);
}

.fleet-detail-actions.compact button:last-child {
  font-size: 11px;
}

/* ===== Fleet gallery hero pass: larger scrollable ship cards and stronger detail art ===== */
#hangarOwnedSection .fleet-layout {
  grid-template-columns: minmax(0, 1fr) minmax(390px, 430px);
}

#hangarOwnedSection .fleet-card-grid {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
  overflow-y: auto;
  padding: 4px 8px 4px 0;
}

#hangarOwnedSection .fleet-card-grid::-webkit-scrollbar,
#hangarOwnedSection .fleet-detail-body::-webkit-scrollbar {
  width: 6px;
}

#hangarOwnedSection .fleet-card-grid::-webkit-scrollbar-track,
#hangarOwnedSection .fleet-detail-body::-webkit-scrollbar-track {
  background: rgba(4, 16, 28, 0.76);
  border-radius: 999px;
}

#hangarOwnedSection .fleet-card-grid::-webkit-scrollbar-thumb,
#hangarOwnedSection .fleet-detail-body::-webkit-scrollbar-thumb {
  background: rgba(105, 220, 255, 0.48);
  border-radius: 999px;
}

#hangarOwnedSection .fleet-ship-card {
  min-height: 286px;
  padding: 14px;
  border-radius: 14px;
  background:
    radial-gradient(circle at 50% 26%, rgba(127, 223, 255, 0.17), transparent 46%),
    linear-gradient(145deg, rgba(6, 21, 39, 0.9), rgba(1, 7, 16, 0.95));
}

#hangarOwnedSection .fleet-card-image-wrap {
  height: 132px;
  margin-bottom: 12px;
}

#hangarOwnedSection .fleet-card-image-wrap img {
  max-height: 132px;
  transform: scale(1.12);
  filter:
    drop-shadow(0 0 24px rgba(70, 180, 255, 0.23))
    drop-shadow(0 0 42px rgba(70, 180, 255, 0.11));
}

#hangarOwnedSection .fleet-card-name {
  font-size: 17px;
}

#hangarOwnedSection .fleet-card-role {
  min-height: 26px;
  font-size: 9.5px;
}

#hangarOwnedSection .fleet-card-mini-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

#hangarOwnedSection .fleet-card-mini-stats span {
  min-height: 30px;
  display: grid;
  place-items: center;
  padding: 5px 4px;
  font-size: 9px;
  line-height: 1.05;
}

#hangarOwnedSection .compact-fleet-slots {
  padding: 7px;
  text-align: left;
}

#hangarOwnedSection .compact-fleet-slots .ship-slot-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

#hangarOwnedSection .compact-fleet-slots .ship-slot-bank {
  min-height: 38px;
  padding: 6px 7px;
}

#hangarOwnedSection .compact-fleet-slots .ship-slot-bank span {
  font-size: 8px;
}

#hangarOwnedSection .compact-fleet-slots .ship-slot-bank strong {
  font-size: 11px;
}

#hangarOwnedSection .compact-fleet-slots .ship-slot-pips {
  gap: 3px;
}

#hangarOwnedSection .compact-fleet-slots .ship-slot-pip {
  width: 13px;
  height: 5px;
}

#hangarOwnedSection .fleet-detail-body {
  grid-template-rows: 158px auto auto auto;
  gap: 8px;
  overflow: hidden;
  padding-right: 0;
}

#hangarOwnedSection .fleet-detail-hero {
  min-height: 158px;
  border-radius: 18px;
  background:
    radial-gradient(circle at 50% 50%, rgba(80, 200, 255, 0.24), transparent 42%),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,0.07), transparent 19%),
    linear-gradient(180deg, rgba(7, 24, 42, 0.62), rgba(1, 7, 16, 0.5));
}

#hangarOwnedSection .fleet-detail-hero img {
  max-width: 86%;
  max-height: 148px;
  transform: scale(1.12);
  filter:
    drop-shadow(0 0 30px rgba(70, 180, 255, 0.28))
    drop-shadow(0 0 54px rgba(70, 180, 255, 0.13));
}

#hangarOwnedSection .fleet-detail-ship-glow {
  width: min(72%, 280px);
}

#hangarOwnedSection .fleet-detail-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#hangarOwnedSection .fleet-detail-stats .fleet-stat-chip,
#hangarOwnedSection .fleet-detail-stats .fleet-stat-chip.hull-stat,
#hangarOwnedSection .fleet-detail-stats .fleet-stat-chip.slots-stat {
  min-height: 46px;
  padding: 6px 8px;
}

#hangarOwnedSection .fleet-detail-stats .fleet-stat-chip strong {
  font-size: 13px;
}

#hangarOwnedSection .fleet-capacity-panel {
  padding: 8px;
}

#hangarOwnedSection .fleet-capacity-panel .ship-slot-bank {
  min-height: 36px;
  padding: 6px 7px;
}

#hangarOwnedSection .fleet-swap-actions button {
  min-height: 34px;
}

@media (max-height: 780px) {
  #hangarOwnedSection .fleet-ship-card {
    min-height: 248px;
  }

  #hangarOwnedSection .fleet-card-image-wrap {
    height: 104px;
  }

  #hangarOwnedSection .fleet-card-image-wrap img {
    max-height: 104px;
  }

  #hangarOwnedSection .fleet-detail-body {
    grid-template-rows: 128px auto auto auto;
    gap: 7px;
  }

  #hangarOwnedSection .fleet-detail-hero {
    min-height: 128px;
  }

  #hangarOwnedSection .fleet-detail-hero img {
    max-height: 120px;
  }

  #hangarOwnedSection .fleet-detail-title h4 {
    font-size: 18px;
  }

  #hangarOwnedSection .fleet-detail-title p {
    font-size: 9px;
  }

  #hangarOwnedSection .fleet-detail-stats .fleet-stat-chip,
  #hangarOwnedSection .fleet-detail-stats .fleet-stat-chip.hull-stat,
  #hangarOwnedSection .fleet-detail-stats .fleet-stat-chip.slots-stat {
    min-height: 40px;
  }

  #hangarOwnedSection .fleet-capacity-panel {
    padding: 7px;
  }
}

@media (max-width: 1160px) {
  #hangarOwnedSection .fleet-layout {
    grid-template-columns: minmax(0, 1fr) minmax(350px, 390px);
  }

  #hangarOwnedSection .fleet-card-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  }
}

@media (max-width: 980px) {
  #hangarOwnedSection .fleet-layout {
    grid-template-columns: 1fr;
  }
}




/* ===== Vessel Exchange redesign to match Fleet gallery ===== */
#hangarShipyardSection {
  min-height: 0;
  height: calc(100% - 118px);
  max-height: none;
  overflow: hidden;
}

#hangarScreen.hangar-screen.active:has(#hangarShipyardSection.active) {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
}

#hangarScreen.hangar-screen.active:has(#hangarShipyardSection.active) #hangarShipyardSection {
  height: auto;
  max-height: none;
}

.vessel-exchange-layout {
  height: calc(100% - 56px);
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 12px;
  overflow: hidden;
}

.vessel-card-grid {
  min-height: 0;
  overflow-y: auto;
  padding: 2px 6px 2px 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
  align-content: start;
  scrollbar-width: thin;
}

.vessel-exchange-card {
  min-height: 184px;
  padding: 10px;
}

.vessel-exchange-card .fleet-card-image-wrap {
  height: 72px;
  margin-bottom: 7px;
}

.vessel-exchange-card .fleet-card-image-wrap img {
  max-height: 74px;
}

.vessel-exchange-card .fleet-card-role {
  min-height: 22px;
  font-size: 9px;
  margin-bottom: 7px;
}

.vessel-exchange-card .fleet-card-slots {
  font-size: 8.5px;
  line-height: 1.15;
  min-height: 30px;
  display: grid;
  place-items: center;
}

.vessel-exchange-card:not(.active) .fleet-card-badge {
  color: #83e9ff;
}

.vessel-exchange-card.selected:not(.active) {
  border-color: rgba(127, 223, 255, 1);
  box-shadow:
    0 0 22px rgba(127, 223, 255, 0.15),
    inset 0 0 18px rgba(127, 223, 255, 0.06);
}

/* Reuse Fleet detail style but make the exchange panel fit the shorter screen */
#hangarShipyardSection .fleet-detail-panel {
  padding: 10px;
  min-width: 0;
}

#hangarShipyardSection .fleet-detail-body {
  grid-template-rows: 112px auto auto minmax(72px, auto);
  gap: 8px;
  overflow: hidden;
}

#hangarShipyardSection .fleet-detail-hero img {
  max-height: 104px;
}

#hangarShipyardSection .fleet-detail-title h4 {
  font-size: 20px;
}

#hangarShipyardSection .fleet-detail-title p {
  font-size: 10px;
}

#hangarShipyardSection .fleet-detail-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

#hangarShipyardSection .fleet-detail-stats .fleet-stat-chip,
#hangarShipyardSection .fleet-detail-stats .fleet-stat-chip.hull-stat,
#hangarShipyardSection .fleet-detail-stats .fleet-stat-chip.slots-stat {
  grid-column: auto;
  min-height: 50px;
  padding: 7px 8px;
}

#hangarShipyardSection .fleet-detail-stats .fleet-stat-chip span {
  font-size: 8.5px;
  letter-spacing: 0.8px;
}

#hangarShipyardSection .fleet-detail-stats .fleet-stat-chip strong {
  font-size: 14px;
}

#hangarShipyardSection .fleet-detail-stats .fleet-stat-chip.slots-stat {
  grid-column: 1 / -1;
}

#hangarShipyardSection .fleet-detail-stats .fleet-stat-chip.slots-stat strong {
  font-size: 12px;
  line-height: 1.15;
}

#hangarShipyardSection .fleet-weapon-action-row {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(118px, 0.95fr);
  gap: 8px;
  align-items: stretch;
}

#hangarShipyardSection .fleet-weapon-strip.compact {
  min-width: 0;
  padding: 8px;
  border-radius: 12px;
}

#hangarShipyardSection .fleet-weapon-strip.compact strong {
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#hangarShipyardSection .fleet-weapon-strip.compact small {
  font-size: 10px;
  line-height: 1.2;
}

#hangarShipyardSection .fleet-detail-actions.compact {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
}

#hangarShipyardSection .fleet-detail-actions.compact button {
  min-height: 34px;
  padding: 7px 8px;
  border-radius: 10px;
  font-size: 12px;
}

#hangarShipyardSection .shipyard-credit-pill {
  flex: 0 0 auto;
  padding: 7px 12px;
  border: 1px solid rgba(127, 223, 255, 0.22);
  border-radius: 999px;
  background:
    radial-gradient(circle at 25% 15%, rgba(127, 223, 255, 0.12), transparent 48%),
    rgba(4, 16, 31, 0.72);
  color: rgba(210, 235, 250, 0.82);
  font-size: 12px;
  font-weight: 900;
}

@media (max-height: 780px) {
  #hangarShipyardSection {
    height: calc(100% - 118px);
    max-height: none;
  }

  .vessel-exchange-layout {
    height: calc(100% - 50px);
  }

  #hangarShipyardSection .fleet-detail-body {
    grid-template-rows: 92px auto auto minmax(66px, auto);
    gap: 7px;
  }

  #hangarShipyardSection .fleet-detail-hero img {
    max-height: 88px;
  }

  #hangarShipyardSection .fleet-detail-title h4 {
    font-size: 18px;
  }

  #hangarShipyardSection .fleet-detail-stats {
    gap: 5px;
  }

  #hangarShipyardSection .fleet-detail-stats .fleet-stat-chip,
  #hangarShipyardSection .fleet-detail-stats .fleet-stat-chip.hull-stat,
  #hangarShipyardSection .fleet-detail-stats .fleet-stat-chip.slots-stat {
    min-height: 43px;
    padding: 6px 7px;
  }

  #hangarShipyardSection .fleet-detail-stats .fleet-stat-chip strong {
    font-size: 13px;
  }

  .vessel-exchange-card {
    min-height: 166px;
  }

  .vessel-exchange-card .fleet-card-image-wrap {
    height: 60px;
  }

  .vessel-exchange-card .fleet-card-image-wrap img {
    max-height: 62px;
  }
}

@media (max-width: 1160px) {
  .vessel-exchange-layout {
    grid-template-columns: minmax(0, 1fr) 330px;
  }

  #hangarShipyardSection .fleet-detail-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}




/* ===== Vessel Exchange tidy pass ===== */
#hangarShipyardSection .shipyard-title-row {
  margin-bottom: 8px;
}

#hangarShipyardSection .shipyard-title-row h3 {
  margin-bottom: 2px;
}

#hangarShipyardSection .shipyard-title-row p {
  margin: 0;
  font-size: 13px;
  line-height: 1.25;
  color: rgba(215, 230, 245, 0.84);
}

#hangarShipyardSection .shipyard-credit-pill {
  min-width: 150px;
  justify-content: center;
  text-align: center;
}

.vessel-exchange-layout {
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 12px;
}

#hangarShipyardSection .fleet-gallery-panel,
#hangarShipyardSection .fleet-detail-panel {
  border-color: rgba(127, 223, 255, 0.42);
}

.vessel-card-grid {
  grid-template-columns: repeat(auto-fill, minmax(158px, 1fr));
  gap: 11px;
  padding: 4px 6px 4px 0;
}

.vessel-exchange-card {
  min-height: 196px;
  padding: 11px;
}

.vessel-exchange-card .fleet-card-image-wrap {
  height: 78px;
}

.vessel-exchange-card .fleet-card-image-wrap img {
  max-height: 78px;
}

.vessel-exchange-card .fleet-card-name {
  font-size: 15px;
  margin-bottom: 3px;
}

.vessel-exchange-card .fleet-card-role {
  min-height: 21px;
  line-height: 1.1;
}

.vessel-exchange-card .fleet-card-mini-stats {
  margin-top: 4px;
}

.vessel-exchange-card .fleet-card-slots {
  min-height: 28px;
  padding: 5px 6px;
  font-size: 9px;
  letter-spacing: 0.15px;
  color: #83e9ff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#hangarShipyardSection .fleet-detail-title {
  align-items: center;
}

#hangarShipyardSection .fleet-detail-title h4 {
  font-size: 21px;
  margin-bottom: 0;
}

#hangarShipyardSection .fleet-detail-title p {
  margin-top: 4px;
}

#hangarShipyardSection .fleet-status-chip {
  max-width: 108px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#hangarShipyardSection .fleet-detail-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

#hangarShipyardSection .fleet-detail-stats .fleet-stat-chip.slots-stat {
  grid-column: 1 / -1;
  min-height: 50px;
}

#hangarShipyardSection .fleet-detail-stats .fleet-stat-chip.slots-stat strong {
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#hangarShipyardSection .fleet-weapon-strip.compact strong {
  font-size: 12px;
}

#hangarShipyardSection .fleet-weapon-strip.compact small {
  color: rgba(190, 215, 235, 0.78);
}

@media (max-height: 780px) {
  .vessel-exchange-card {
    min-height: 174px;
  }

  .vessel-exchange-card .fleet-card-image-wrap {
    height: 62px;
  }

  .vessel-exchange-card .fleet-card-image-wrap img {
    max-height: 64px;
  }

  .vessel-exchange-card .fleet-card-name {
    font-size: 14px;
  }

  .vessel-exchange-card .fleet-card-role {
    min-height: 18px;
    font-size: 8.5px;
  }

  .vessel-exchange-card .fleet-card-slots {
    min-height: 25px;
    font-size: 8.4px;
  }

  #hangarShipyardSection .shipyard-title-row p {
    font-size: 12px;
  }
}

@media (max-width: 1160px) {
  .vessel-exchange-layout {
    grid-template-columns: minmax(0, 1fr) 330px;
  }

  .vessel-card-grid {
    grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
  }

  #hangarShipyardSection .shipyard-credit-pill {
    min-width: 126px;
  }
}

/* ===== Vault hover tooltip + tidy pass ===== */
#hangarVaultSection {
  min-height: 0;
  height: calc(100vh - 178px);
  max-height: 492px;
  overflow: hidden;
}

#hangarVaultSection .hangar-section-title {
  margin-bottom: 8px;
}

#hangarVaultSection .hangar-section-title h3 {
  margin-bottom: 2px;
}

#hangarVaultSection .hangar-section-title p {
  margin: 0;
  font-size: 13px;
  line-height: 1.25;
  color: rgba(215, 230, 245, 0.84);
}

.vault-layout {
  height: calc(100% - 56px);
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 390px;
  gap: 16px;
  overflow: hidden;
}

.vault-main-panel,
.vault-detail-panel {
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(127, 223, 255, 0.42);
  border-radius: 16px;
  background:
    radial-gradient(circle at 20% 0%, rgba(127, 223, 255, 0.08), transparent 34%),
    linear-gradient(145deg, rgba(7, 18, 32, 0.92), rgba(0, 6, 14, 0.94));
}

.vault-main-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  padding: 12px;
}

.vault-filter-header {
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(127, 223, 255, 0.12);
  margin-bottom: 12px;
}

.vault-filter-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.vault-filter-row .store-filter-btn {
  min-height: 38px;
  border-radius: 12px;
}

.vault-catalog-grid {
  min-height: 0;
  overflow-y: auto;
  padding: 2px 8px 4px 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(122px, 1fr));
  gap: 11px;
  align-content: start;
  scrollbar-width: thin;
}

.vault-icon-card,
.vault-catalog-card {
  position: relative;
  min-height: 154px;
  max-height: 154px;
  padding: 10px;
  display: grid;
  grid-template-rows: 70px auto auto;
  gap: 7px;
  align-items: center;
  justify-items: center;
  border-radius: 15px;
  background:
    radial-gradient(circle at 50% 22%, rgba(127, 223, 255, 0.12), transparent 42%),
    linear-gradient(145deg, rgba(5, 18, 34, 0.88), rgba(1, 7, 16, 0.94));
  border: 1px solid rgba(95, 180, 235, 0.34);
  overflow: hidden;
  transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.vault-icon-card:hover {
  transform: translateY(-2px);
  border-color: rgba(127, 223, 255, 0.82);
  box-shadow: 0 0 18px rgba(127, 223, 255, 0.12);
}

.vault-icon-card.selected,
.vault-catalog-card.selected {
  border-color: rgba(52, 229, 154, 0.72);
  box-shadow:
    0 0 22px rgba(52, 229, 154, 0.14),
    inset 0 0 18px rgba(52, 229, 154, 0.06);
}

.vault-icon-card .store-card-art,
.vault-catalog-card .store-card-art {
  width: 66px;
  height: 66px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background:
    radial-gradient(circle at 50% 35%, rgba(127, 223, 255, 0.15), transparent 52%),
    rgba(0, 7, 16, 0.66);
  border: 1px solid rgba(127, 223, 255, 0.18);
  margin: 0;
}

.vault-icon-card .store-card-art img,
.vault-catalog-card .store-card-art img {
  max-width: 54px;
  max-height: 54px;
  object-fit: contain;
}

.vault-icon-card .store-card-name,
.vault-catalog-card .store-card-name {
  color: #f7fbff;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.05;
  text-align: center;
  max-width: 100%;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.vault-card-meta {
  color: rgba(155, 205, 240, 0.86);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.1px;
  text-transform: uppercase;
}

.vault-card-count,
.vault-card-equipped {
  position: absolute;
  z-index: 2;
  top: 8px;
  min-width: 24px;
  height: 20px;
  display: grid;
  place-items: center;
  padding: 0 6px;
  border-radius: 999px;
  background: rgba(8, 28, 50, 0.94);
  border: 1px solid rgba(127, 223, 255, 0.24);
  color: #f6fbff;
  font-size: 10px;
  font-weight: 900;
}

.vault-card-count { right: 8px; }
.vault-card-equipped {
  left: 8px;
  color: #5cffab;
  border-color: rgba(52, 229, 154, 0.30);
}

/* The hover card is now the primary detail reveal, so keep the right detail clean and compact */
.vault-detail-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  padding: 12px;
}

.vault-detail-panel-body,
#vaultDetailPanel {
  min-height: 0;
  overflow: hidden;
}

.vault-detail-shell {
  height: 100%;
  display: grid;
  grid-template-rows: 128px auto auto auto minmax(0, auto);
  gap: 10px;
  padding: 0;
  background: transparent;
  border: 0;
}

.vault-detail-shell .store-detail-visual {
  min-height: 0;
  height: 128px;
  border-radius: 16px;
  border: 1px solid rgba(127, 223, 255, 0.15);
  background:
    radial-gradient(circle at 50% 44%, rgba(80, 200, 255, 0.18), transparent 38%),
    rgba(1, 7, 16, 0.32);
}

.vault-detail-shell .store-detail-visual img {
  max-width: 74%;
  max-height: 94px;
  object-fit: contain;
}

.vault-detail-shell .store-detail-kicker {
  color: #83e9ff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.25px;
  text-transform: uppercase;
}

.vault-detail-shell .store-detail-title {
  color: #f7fbff;
  font-size: 24px;
  line-height: 1.05;
  font-weight: 900;
}

.vault-detail-shell .store-detail-desc {
  color: rgba(215, 233, 245, 0.78);
  font-size: 12px;
  line-height: 1.35;
}

.vault-detail-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.vault-detail-stats .compact-detail-stat-card {
  min-height: 58px;
  padding: 8px 10px;
  border-radius: 13px;
  border: 1px solid rgba(127, 223, 255, 0.20);
  background:
    radial-gradient(circle at 82% 12%, rgba(127, 223, 255, 0.13), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.vault-detail-stats .compact-detail-stat-card span {
  color: rgba(160, 207, 235, 0.78);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.vault-detail-stats .compact-detail-stat-card strong {
  color: #f7fbff;
  font-size: 16px;
  line-height: 1.05;
}

/* Prevent old title-tooltip pseudo rules affecting vault cards */
.vault-icon-card:hover::after,
.vault-catalog-card:hover::after {
  content: none !important;
}

@media (max-height: 780px) {
  #hangarVaultSection {
    height: calc(100vh - 166px);
    max-height: 458px;
  }

  .vault-layout {
    height: calc(100% - 50px);
    grid-template-columns: minmax(0, 1fr) 350px;
    gap: 12px;
  }

  .vault-catalog-grid {
    grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
    gap: 9px;
  }

  .vault-icon-card,
  .vault-catalog-card {
    min-height: 136px;
    max-height: 136px;
    grid-template-rows: 58px auto auto;
  }

  .vault-icon-card .store-card-art,
  .vault-catalog-card .store-card-art {
    width: 56px;
    height: 56px;
  }

  .vault-icon-card .store-card-art img,
  .vault-catalog-card .store-card-art img {
    max-width: 46px;
    max-height: 46px;
  }

  .vault-detail-shell {
    grid-template-rows: 104px auto auto auto minmax(0, auto);
    gap: 8px;
  }

  .vault-detail-shell .store-detail-visual {
    height: 104px;
  }

  .vault-detail-shell .store-detail-title {
    font-size: 21px;
  }

  .vault-detail-stats .compact-detail-stat-card {
    min-height: 48px;
  }
}

@media (max-width: 1160px) {
  .vault-layout {
    grid-template-columns: minmax(0, 1fr) 330px;
  }

  .vault-filter-row {
    gap: 7px;
  }
}




/* ===== Vault small label fix + Striker balance patch ===== */
.vault-catalog-card .store-card-name,
.vault-icon-card .store-card-name {
  max-width: 100%;
  padding: 0 4px;
  line-height: 1.08;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}

.vault-catalog-card {
  min-width: 0;
}

.vault-catalog-grid {
  grid-template-columns: repeat(auto-fill, minmax(124px, 1fr));
}

.vault-detail-panel .item-detail-title,
.vault-detail-panel-body h3,
.vault-detail-panel-body .store-detail-name {
  overflow-wrap: anywhere;
}

@media (max-width: 1160px) {
  .vault-catalog-grid {
    grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  }
}




/* ===== Pilot Profile dashboard redesign ===== */
.pilot-profile-body {
  height: calc(100% - 84px);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 12px;
  min-height: 0;
  overflow: hidden;
}

.pilot-dashboard-hero,
.pilot-dashboard-grid,
.pilot-progression-card,
.pilot-future-card {
  background:
    radial-gradient(circle at 18% 0%, rgba(127, 223, 255, 0.08), transparent 34%),
    linear-gradient(145deg, rgba(7, 18, 32, 0.92), rgba(0, 6, 14, 0.94));
  border: 1px solid rgba(90, 190, 255, 0.58);
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(160, 230, 255, 0.08), 0 0 24px rgba(0, 160, 255, 0.08);
}

.pilot-dashboard-hero {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 14px;
  padding: 14px 16px;
  align-items: center;
}

.pilot-identity-block {
  min-width: 0;
}

.pilot-identity-block strong {
  display: block;
  margin-top: 4px;
  color: #f7fbff;
  font-size: 28px;
  line-height: 1;
  letter-spacing: 0.8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pilot-identity-block small,
.pilot-level-block small {
  display: block;
  margin-top: 6px;
  color: rgba(190, 215, 235, 0.74);
  font-size: 12px;
  font-weight: 800;
}

.pilot-level-block {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.pilot-level-block > div:first-child {
  display: flex;
  gap: 10px;
  align-items: baseline;
}

.pilot-level-block span {
  color: #83e9ff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.pilot-level-block strong {
  color: #f7fbff;
  font-size: 36px;
  line-height: 1;
}

.pilot-level-block p {
  margin: 0;
  color: rgba(205, 225, 240, 0.82);
  font-size: 12px;
}

.pilot-dashboard-grid {
  padding: 12px;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 9px;
}

.pilot-stat-card {
  position: relative;
  min-height: 76px;
  overflow: hidden;
  padding: 10px;
  border-radius: 13px;
  border: 1px solid rgba(127, 223, 255, 0.20);
  background:
    radial-gradient(circle at 82% 12%, rgba(127, 223, 255, 0.13), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
  display: grid;
  align-content: center;
  gap: 4px;
}

.pilot-stat-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 0 42%, rgba(255,255,255,0.045) 50%, transparent 58%);
  opacity: 0.65;
  pointer-events: none;
}

.pilot-stat-card span,
.pilot-stat-card strong,
.pilot-stat-card small {
  position: relative;
  z-index: 1;
}

.pilot-stat-card span {
  color: rgba(160, 207, 235, 0.78);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: 0.9px;
  text-transform: uppercase;
}

.pilot-stat-card strong {
  color: #f7fbff;
  font-size: 17px;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pilot-stat-card small {
  color: rgba(190, 215, 235, 0.72);
  font-size: 10px;
  line-height: 1.15;
}

.pilot-stat-card.combat-stat {
  border-color: rgba(255, 95, 125, 0.34);
  background:
    radial-gradient(circle at 82% 12%, rgba(255, 95, 125, 0.13), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.pilot-stat-card.bounty-stat {
  border-color: rgba(255, 204, 94, 0.34);
}

.pilot-stat-card.profit-stat,
.pilot-stat-card.cargo-stat {
  border-color: rgba(52, 229, 154, 0.34);
  background:
    radial-gradient(circle at 82% 12%, rgba(52, 229, 154, 0.13), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.82), rgba(1, 9, 20, 0.86));
}

.pilot-stat-card.fleet-stat,
.pilot-stat-card.ship-stat {
  border-color: rgba(115, 210, 255, 0.35);
}

.pilot-profile-lower {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 12px;
  overflow: hidden;
}

.pilot-progression-card,
.pilot-future-card {
  min-height: 0;
  padding: 14px;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 12px;
}

.pilot-progression-card .profile-skill-card {
  min-height: 0;
}

.pilot-future-card {
  overflow-y: auto;
}

.future-profile-grid {
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.future-profile-grid div {
  min-height: 84px;
  padding: 12px;
  border: 1px solid rgba(127, 223, 255, 0.16);
  border-radius: 13px;
  background: rgba(3, 12, 25, 0.70);
  display: grid;
  align-content: center;
  gap: 5px;
}

.future-profile-grid strong {
  color: #f7fbff;
  font-size: 14px;
}

.future-profile-grid small {
  color: rgba(190, 215, 235, 0.74);
  font-size: 11px;
  line-height: 1.3;
}

@media (max-height: 780px) {
  .pilot-profile-body {
    gap: 9px;
  }

  .pilot-dashboard-hero {
    padding: 11px 14px;
  }

  .pilot-identity-block strong {
    font-size: 24px;
  }

  .pilot-level-block strong {
    font-size: 30px;
  }

  .pilot-dashboard-grid {
    padding: 10px;
    gap: 7px;
  }

  .pilot-stat-card {
    min-height: 62px;
    padding: 8px;
  }

  .pilot-stat-card strong {
    font-size: 15px;
  }

  .pilot-progression-card,
  .pilot-future-card {
    padding: 11px;
  }

  .future-profile-grid div {
    min-height: 68px;
    padding: 9px;
  }
}

@media (max-width: 1120px) {
  .pilot-dashboard-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .pilot-dashboard-hero,
  .pilot-profile-lower {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

  .future-profile-grid {
    grid-template-columns: 1fr;
  }
}




/* ===== Sector map final tidy: scan panel no longer covers nodes ===== */
.sector-map .sector-scan-panel {
  top: 18px;
  right: 72px;
  width: auto;
  max-width: none;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 8px;
  border-radius: 13px;
  background: rgba(3, 10, 22, 0.66);
}

.sector-map .sector-scan-title {
  font-size: 10px;
  letter-spacing: 1.25px;
  padding: 0 5px 0 2px;
}

.sector-map .sector-scan-actions {
  display: flex;
  gap: 6px;
}

.sector-map .sector-scan-btn {
  min-width: 86px;
  height: 30px;
  padding: 0 11px;
  border-radius: 10px;
}

.sector-map .sector-scan-status {
  position: absolute;
  right: 10px;
  top: calc(100% + 4px);
  min-width: 112px;
  padding: 0;
  text-align: right;
  font-size: 9px;
  letter-spacing: 0.6px;
  opacity: 0.78;
}

/* Move labels to the edge of the map and keep them from blocking route nodes */
.sector-map .zone-label,
.sector-map .combat-zone-label,
.sector-map .upper-zone-label,
.sector-map .lower-zone-label {
  pointer-events: none;
  text-shadow: 0 0 10px rgba(0,0,0,0.9), 0 0 18px rgba(0,0,0,0.65);
  z-index: 3;
}

/* SVG text labels inside the map */
.sector-svg text,
#sectorSvg text {
  pointer-events: none;
}

/* If the combat-zone labels are SVG text, nudge their visibility down slightly by making them less dominant */
#sectorSvg .zone-label,
#sectorSvg .combat-zone-label {
  opacity: 0.88;
}

@media (max-width: 980px) {
  .sector-map .sector-scan-panel {
    right: 64px;
    gap: 5px;
  }

  .sector-map .sector-scan-btn {
    min-width: 72px;
    padding: 0 8px;
    font-size: 10px;
  }

  .sector-map .sector-scan-title {
    display: none;
  }
}




/* ===== Sector map zone-label watermark pass ===== */
#sectorSvg .svg-zone-label {
  opacity: 0.52;
  filter: drop-shadow(0 0 12px rgba(255, 120, 65, 0.18));
}

#sectorSvg .svg-zone-label.zone-combat {
  fill: rgba(255, 141, 76, 0.78);
}

#sectorSvg .svg-zone-icon {
  display: none;
}

#sectorSvg .svg-zone-name {
  font-size: 1.55px;
  letter-spacing: 0.28px;
}

#sectorSvg .svg-zone-subtitle {
  font-size: 1.05px;
  letter-spacing: 0.18px;
  opacity: 0.78;
}

/* Keep route/node information visually above the faded zone watermark */
#sectorSvg .svg-route,
#sectorSvg .svg-node,
#sectorSvg .svg-planet,
#sectorSvg .svg-current-ring,
#sectorSvg .svg-planet-label {
  opacity: 1;
}

#sectorSvg .combat-route {
  stroke-width: 0.22;
}

#sectorSvg .svg-node.combat,
#sectorSvg .svg-space-node.combat {
  opacity: 0.88;
}




/* ===== Objective HUD upgrade + safer trade abandon ===== */
.objective-hud-summary {
  min-height: 112px;
}

.objective-trade-card {
  padding: 10px;
  min-height: 112px;
  display: grid;
  gap: 8px;
  border-color: rgba(52, 229, 154, 0.42);
  background:
    radial-gradient(circle at 14% 12%, rgba(52, 229, 154, 0.16), transparent 34%),
    linear-gradient(145deg, rgba(5, 20, 28, 0.94), rgba(1, 8, 18, 0.96));
}

.objective-trade-card .objective-hud-top {
  margin-bottom: 0;
}

.objective-main-row-large {
  align-items: center;
}

.objective-icon-large {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 12px;
}

.objective-copy-large strong {
  font-size: 0.92rem;
}

.objective-copy-large span {
  font-size: 0.7rem;
}

.objective-copy-large em {
  display: block;
  margin-top: 3px;
  color: #65f0a0;
  font-size: 0.66rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.2px;
}

.objective-route-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 7px;
}

.objective-route-strip div {
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid rgba(127, 223, 255, 0.15);
  border-radius: 10px;
  background:
    radial-gradient(circle at 84% 8%, rgba(127, 223, 255, 0.08), transparent 46%),
    rgba(1, 9, 20, 0.64);
}

.objective-route-strip span {
  display: block;
  color: rgba(160, 207, 235, 0.76);
  font-size: 0.53rem;
  font-weight: 900;
  letter-spacing: 0.9px;
  text-transform: uppercase;
  margin-bottom: 3px;
}

.objective-route-strip strong {
  display: block;
  color: #f7fbff;
  font-size: 0.72rem;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.objective-footer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  border-top: 1px solid rgba(127, 223, 255, 0.12);
  padding-top: 7px;
}

.objective-footer-row span {
  color: rgba(215, 235, 248, 0.84);
  font-size: 0.68rem;
  font-weight: 800;
}

.objective-abandon-btn {
  width: auto;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 110, 126, 0.35);
  background: rgba(70, 15, 28, 0.38);
  color: rgba(255, 198, 207, 0.82);
  font-size: 0.58rem;
  letter-spacing: 0.8px;
}

.objective-abandon-btn:hover {
  border-color: rgba(255, 110, 126, 0.85);
  color: #fff;
  background: rgba(120, 26, 42, 0.72);
}

.safer-abandon-route-btn {
  width: auto;
  min-width: 82px;
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(255, 110, 126, 0.34);
  background: rgba(70, 15, 28, 0.36);
  color: rgba(255, 198, 207, 0.84);
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.safer-abandon-route-btn:hover {
  border-color: rgba(255, 110, 126, 0.88);
  background: rgba(120, 26, 42, 0.72);
  color: #ffffff;
}

@media (max-width: 1100px) {
  .objective-route-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-height: 760px) {
  .objective-trade-card {
    gap: 6px;
    padding: 8px;
  }

  .objective-route-strip {
    gap: 5px;
  }

  .objective-route-strip div {
    padding: 5px 6px;
  }
}




/* ===== Compact objective cards + larger trade contracts ===== */
.objective-hud-summary {
  min-height: 0;
  height: 100%;
  overflow-y: auto;
  padding-right: 3px;
}

.compact-objective-list {
  display: grid;
  gap: 7px;
  align-content: start;
}

.compact-objective-card {
  min-height: 0;
  padding: 8px;
  display: grid;
  gap: 7px;
  border-color: rgba(52, 229, 154, 0.42);
  background:
    radial-gradient(circle at 12% 12%, rgba(52, 229, 154, 0.15), transparent 34%),
    linear-gradient(145deg, rgba(5, 20, 28, 0.94), rgba(1, 8, 18, 0.96));
}

.compact-objective-main {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
}

.objective-title-line {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.objective-title-line .objective-type-pill {
  flex: 0 0 auto;
}

.objective-title-line strong {
  min-width: 0;
  font-size: 0.82rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.objective-copy-large em {
  display: block;
  margin-top: 2px;
  color: #65f0a0;
  font-size: 0.63rem;
  font-style: normal;
  font-weight: 900;
}

.objective-compact-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  align-items: center;
}

.objective-compact-actions .objective-map-btn,
.objective-compact-actions .objective-abandon-btn {
  min-height: 23px;
  width: 74px;
  padding: 3px 7px;
  border-radius: 999px;
  font-size: 0.55rem;
  line-height: 1;
}

.objective-compact-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
}

.objective-compact-stats div {
  min-width: 0;
  padding: 6px 7px;
  border: 1px solid rgba(127, 223, 255, 0.15);
  border-radius: 9px;
  background:
    radial-gradient(circle at 84% 8%, rgba(127, 223, 255, 0.08), transparent 46%),
    rgba(1, 9, 20, 0.64);
}

.objective-compact-stats span {
  display: block;
  margin-bottom: 2px;
  color: rgba(160, 207, 235, 0.76);
  font-size: 0.5rem;
  font-weight: 900;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.objective-compact-stats strong {
  display: block;
  color: #f7fbff;
  font-size: 0.66rem;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.objective-abandon-btn {
  border: 1px solid rgba(255, 110, 126, 0.35);
  background: rgba(70, 15, 28, 0.38);
  color: rgba(255, 198, 207, 0.82);
}

.objective-abandon-btn:hover {
  border-color: rgba(255, 110, 126, 0.85);
  color: #fff;
  background: rgba(120, 26, 42, 0.72);
}

/* Keep the objectives panel future-ready for multiple objectives */
.objectives-panel .activity-objective-block {
  min-height: 0;
  overflow: hidden;
}

.objectives-panel .objective-panel-layout {
  min-height: 0;
  height: 100%;
}

@media (max-width: 1120px) {
  .objective-compact-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .compact-objective-main {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .objective-compact-actions {
    grid-column: 1 / -1;
    grid-template-columns: 1fr 1fr;
  }

  .objective-compact-actions .objective-map-btn,
  .objective-compact-actions .objective-abandon-btn {
    width: 100%;
  }
}

@media (max-height: 760px) {
  .compact-objective-card {
    padding: 7px;
    gap: 5px;
  }

  .objective-compact-stats {
    gap: 5px;
  }

  .objective-compact-stats div {
    padding: 5px 6px;
  }
}




/* ===== Trade Terminal accept-first flow + route jump metrics ===== */
.selectable-station-card {
  cursor: default;
}

.selectable-station-card.selected-contract {
  border-color: rgba(127, 223, 255, 1);
  box-shadow:
    0 0 18px rgba(127, 223, 255, 0.14),
    inset 0 0 14px rgba(127, 223, 255, 0.06);
}

.station-trade-line-expanded {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
}

.station-trade-line-expanded span {
  min-width: 0;
  padding: 5px 6px;
  border-radius: 8px;
  background: rgba(2, 10, 22, 0.56);
  border: 1px solid rgba(127, 223, 255, 0.11);
  font-size: 9px;
}

.station-trade-line-expanded strong {
  display: block;
  margin-top: 2px;
  color: #f7fbff;
  font-size: 10px;
}

.trade-route-stat-row {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.trade-route-stat-row div {
  min-width: 0;
}

.trade-route-stat-row strong {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.trade-preview-accept-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 170px;
  gap: 12px;
  align-items: center;
  margin-top: 12px;
  padding: 12px;
  border-radius: 13px;
  border: 1px solid rgba(127, 223, 255, 0.17);
  background:
    radial-gradient(circle at 12% 12%, rgba(127, 223, 255, 0.10), transparent 34%),
    rgba(2, 10, 22, 0.62);
}

.trade-preview-note {
  color: rgba(210, 232, 248, 0.82);
  font-size: 12px;
  line-height: 1.35;
}

.accept-route-action {
  min-height: 42px;
  border-radius: 12px;
}

.accept-trade-btn {
  transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.accept-trade-btn:hover:not(:disabled) {
  transform: translateY(-1px);
}

.selected-contract .accept-trade-btn {
  border-color: rgba(127, 223, 255, 0.95);
  box-shadow: 0 0 14px rgba(127, 223, 255, 0.16);
}

@media (max-width: 1120px) {
  .trade-route-stat-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .trade-preview-accept-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-height: 760px) {
  .trade-preview-accept-panel {
    margin-top: 9px;
    padding: 9px;
  }

  .trade-preview-note {
    font-size: 11px;
  }
}




/* ===== In-space HUD chat improvement ===== */
/* Gives chat enough vertical room to show several messages while keeping the HUD compact. */
.command-hud.space-combat-hud {
  align-items: flex-end;
}

.hud-command-console {
  min-height: 196px;
  max-height: 196px;
}

.command-hud .hud-inline-panel,
.command-hud .hud-inline-panel .hud-panel.active {
  min-height: 0;
}

.comms-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
}

.chat-panel-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 5px;
}

.chat-panel-top .compact-header {
  margin-bottom: 0;
}

.chat-panel-top h3 {
  font-size: 13px;
  letter-spacing: 0.4px;
}

.chat-channel-tabs {
  display: flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
}

.chat-channel-tabs button {
  min-height: 22px;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(127, 223, 255, 0.20);
  background: rgba(4, 16, 31, 0.70);
  color: rgba(200, 225, 244, 0.72);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.65px;
  text-transform: uppercase;
}

.chat-channel-tabs button.active {
  border-color: rgba(127, 223, 255, 0.72);
  color: #83e9ff;
  background:
    radial-gradient(circle at 25% 10%, rgba(127, 223, 255, 0.16), transparent 48%),
    rgba(5, 20, 38, 0.86);
}

.chat-channel-tabs button.locked {
  opacity: 0.48;
  cursor: default;
}

.local-chat-feed {
  flex: 1 1 auto;
  min-height: 78px;
  max-height: none;
  overflow-y: auto;
  padding: 6px 7px 6px 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  border-top: 1px solid rgba(127, 223, 255, 0.08);
  border-bottom: 1px solid rgba(127, 223, 255, 0.08);
}

.chat-line {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 5px;
  align-items: baseline;
  padding: 3px 0;
  color: #dcecff;
  font-size: 11.5px;
  line-height: 1.25;
  border-bottom: 1px solid rgba(127, 223, 255, 0.055);
}

.chat-line span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.chat-line.system {
  display: block;
  font-size: 11px;
}

.local-chat-input-row {
  grid-template-columns: 1fr 78px;
  gap: 8px;
  margin-top: 7px;
}

.local-chat-input-row input {
  min-height: 31px;
}

.local-chat-input-row button {
  min-height: 31px;
}

@media (max-height: 760px) {
  .hud-command-console {
    min-height: 184px;
    max-height: 184px;
  }

  .local-chat-feed {
    min-height: 68px;
  }

  .chat-channel-tabs button {
    padding: 3px 7px;
  }
}

@media (max-width: 980px) {
  .chat-panel-top {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  .chat-channel-tabs {
    width: 100%;
  }

  .chat-channel-tabs button {
    flex: 1;
  }
}




/* ===== Local chat input fix + node-local comms layout ===== */
.command-hud .hud-inline-panel .comms-panel.active,
.comms-panel.active {
  display: grid !important;
  grid-template-rows: auto minmax(82px, 1fr) auto;
  min-height: 0;
  height: 100%;
}

.chat-panel-top {
  min-height: 25px;
  flex: 0 0 auto;
}

.local-chat-feed {
  min-height: 82px;
  max-height: none;
  overflow-y: auto;
  padding: 6px 7px 6px 0;
}

.local-chat-input-row {
  flex: 0 0 auto;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 78px;
  gap: 8px;
  margin-top: 7px;
  min-height: 32px;
}

.local-chat-input-row input {
  width: 100%;
  min-width: 0;
  min-height: 32px;
  display: block;
}

.local-chat-input-row button {
  min-height: 32px;
  display: block;
}

/* Stop the chat feed from swallowing the input row inside the compact HUD. */
#chatPanel.comms-panel {
  overflow: hidden;
}

@media (max-height: 760px) {
  .command-hud .hud-inline-panel .comms-panel.active,
  .comms-panel.active {
    grid-template-rows: auto minmax(68px, 1fr) auto;
  }

  .local-chat-feed {
    min-height: 68px;
  }
}




/* ===== Chat input visibility hard fix ===== */
/* Keep chat usable inside the compact HUD rather than letting the feed push the input off-screen. */
#chatPanel.comms-panel.active {
  display: grid !important;
  grid-template-rows: 28px minmax(48px, 1fr) 34px !important;
  gap: 5px;
  height: 100%;
  min-height: 0;
  overflow: hidden !important;
}

#chatPanel .chat-panel-top {
  min-height: 0;
  height: 28px;
  margin-bottom: 0;
  overflow: hidden;
}

#chatPanel .chat-panel-top h3 {
  font-size: 12px;
  line-height: 1;
}

#chatPanel .chat-channel-tabs button {
  min-height: 20px;
  padding: 2px 8px;
  font-size: 8.5px;
}

#chatPanel .local-chat-feed {
  min-height: 48px !important;
  max-height: none !important;
  height: auto !important;
  overflow-y: auto !important;
  padding: 4px 7px 4px 0;
  border-top: 1px solid rgba(127, 223, 255, 0.08);
  border-bottom: 1px solid rgba(127, 223, 255, 0.08);
}

#chatPanel .chat-line {
  font-size: 11px;
  line-height: 1.18;
  padding: 2px 0;
}

#chatPanel .local-chat-input-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 72px;
  gap: 7px;
  height: 34px;
  min-height: 34px;
  margin-top: 0 !important;
  flex: none !important;
  visibility: visible !important;
  opacity: 1 !important;
}

#chatPanel .local-chat-input-row input {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100%;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  padding: 0 10px;
}

#chatPanel .local-chat-input-row button {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: 34px;
  min-height: 34px;
  padding: 0 10px;
}

/* Prevent older HUD rules from clipping the input row only within chat. */
.command-hud .hud-inline-panel #chatPanel.hud-panel.active {
  overflow: hidden !important;
}

@media (max-height: 760px) {
  #chatPanel.comms-panel.active {
    grid-template-rows: 24px minmax(42px, 1fr) 32px !important;
    gap: 4px;
  }

  #chatPanel .chat-panel-top {
    height: 24px;
  }

  #chatPanel .local-chat-feed {
    min-height: 42px !important;
  }

  #chatPanel .local-chat-input-row,
  #chatPanel .local-chat-input-row input,
  #chatPanel .local-chat-input-row button {
    height: 32px;
    min-height: 32px;
  }
}




/* ===== Chat compact working input final pass ===== */
/* Prioritise usable feed + typing box. No heading/system text taking vertical space. */
#chatPanel.comms-panel.active {
  display: grid !important;
  grid-template-rows: 24px minmax(54px, 1fr) 36px !important;
  gap: 5px !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#chatPanel .chat-panel-top {
  height: 24px !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  overflow: hidden !important;
}

#chatPanel .chat-panel-top .compact-header,
#chatPanel .chat-panel-top h3 {
  display: none !important;
}

#chatPanel .chat-channel-tabs {
  height: 22px;
  display: flex;
  gap: 5px;
  align-items: center;
}

#chatPanel .chat-channel-tabs button {
  min-height: 20px !important;
  height: 20px !important;
  padding: 2px 8px !important;
  font-size: 8.5px !important;
}

#chatPanel .local-chat-feed {
  min-height: 54px !important;
  height: auto !important;
  max-height: none !important;
  overflow-y: auto !important;
  padding: 3px 7px 3px 0 !important;
  border-top: 1px solid rgba(127, 223, 255, 0.08);
  border-bottom: 1px solid rgba(127, 223, 255, 0.08);
}

#chatPanel .local-chat-feed:empty::before {
  content: "No local messages yet.";
  display: block;
  color: rgba(160, 185, 210, 0.72);
  font-size: 11px;
  font-style: italic;
  padding-top: 4px;
}

#chatPanel .local-chat-input-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 72px !important;
  gap: 7px !important;
  height: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
}

#chatPanel .local-chat-input-row input {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 36px !important;
  min-height: 36px !important;
  visibility: visible !important;
  opacity: 1 !important;
}

#chatPanel .local-chat-input-row button {
  box-sizing: border-box !important;
  display: block !important;
  width: 72px !important;
  height: 36px !important;
  min-height: 36px !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Make sure the bottom border of the console does not crop the input. */
.hud-command-console {
  min-height: 204px !important;
  max-height: 204px !important;
  padding-bottom: 10px !important;
}

.command-hud .hud-inline-panel #chatPanel.hud-panel.active {
  overflow: hidden !important;
}

@media (max-height: 760px) {
  #chatPanel.comms-panel.active {
    grid-template-rows: 22px minmax(46px, 1fr) 34px !important;
    gap: 4px !important;
  }

  #chatPanel .chat-panel-top {
    height: 22px !important;
    min-height: 22px !important;
  }

  #chatPanel .local-chat-feed {
    min-height: 46px !important;
  }

  #chatPanel .local-chat-input-row,
  #chatPanel .local-chat-input-row input,
  #chatPanel .local-chat-input-row button {
    height: 34px !important;
    min-height: 34px !important;
  }

  .hud-command-console {
    min-height: 194px !important;
    max-height: 194px !important;
  }
}




/* ===== Final bottom HUD alignment + Loadout label ===== */
/* Match the stat bars, ship/loadout card and command console to the same vertical baseline. */
.bottom-only-hud.space-combat-hud,
.command-hud.space-combat-hud {
  display: flex;
  align-items: stretch !important;
  gap: 10px;
}

.hud-bars-panel,
.ship-display-panel,
.hud-command-console {
  align-self: stretch !important;
  height: 204px !important;
  min-height: 204px !important;
  max-height: 204px !important;
  box-sizing: border-box !important;
}

/* Keep the left bars visually balanced inside the taller matched height. */
.hud-bars-panel {
  padding: 10px !important;
  display: grid !important;
  align-content: center !important;
}

/* Keep the ship card content centred vertically. */
.ship-display-panel {
  padding: 10px !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  align-items: center !important;
}

.ship-display-panel .hud-ship-image {
  align-self: center;
  justify-self: center;
}

/* Command console keeps the chat input visible without sitting above the other HUD blocks. */
.hud-command-console {
  padding: 10px !important;
  display: grid !important;
  grid-template-rows: 34px minmax(0, 1fr) !important;
  overflow: hidden !important;
}

/* Give the shorter LOADOUT label breathing room. */
.ship-display-panel button,
.ship-display-panel .ship-loadout-btn,
#shipLoadoutBtn {
  letter-spacing: 1.1px;
}

@media (max-height: 760px) {
  .hud-bars-panel,
  .ship-display-panel,
  .hud-command-console {
    height: 194px !important;
    min-height: 194px !important;
    max-height: 194px !important;
  }
}




/* ===== Bottom HUD height correction: remove wasted lower space ===== */
/* Align the left stat/loadout blocks to the command console without leaving dead space below. */
.bottom-only-hud.space-combat-hud,
.command-hud.space-combat-hud {
  align-items: flex-end !important;
}

/* The command console needs extra height for chat; the smaller left blocks should align to its bottom, not stretch. */
.hud-command-console {
  height: 204px !important;
  min-height: 204px !important;
  max-height: 204px !important;
  align-self: flex-end !important;
}

/* Return the stat/loadout blocks to their natural compact height and bottom-align them. */
.hud-bars-panel,
.ship-display-panel {
  height: 166px !important;
  min-height: 166px !important;
  max-height: 166px !important;
  align-self: flex-end !important;
  box-sizing: border-box !important;
}

/* Remove stretch/grid behaviour that was creating empty lower space. */
.hud-bars-panel {
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  padding: 10px !important;
}

.ship-display-panel {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px !important;
}

.ship-display-panel .hud-ship-image {
  max-height: 108px;
  flex: 0 1 auto;
}

.ship-display-panel button,
.ship-display-panel .ship-loadout-btn,
#shipLoadoutBtn {
  flex: 0 0 auto;
  margin-top: 6px;
}

/* Keep LOADOUT as the short in-space label. */
.ship-display-panel button {
  letter-spacing: 1.1px;
}

@media (max-height: 760px) {
  .hud-command-console {
    height: 194px !important;
    min-height: 194px !important;
    max-height: 194px !important;
  }

  .hud-bars-panel,
  .ship-display-panel {
    height: 156px !important;
    min-height: 156px !important;
    max-height: 156px !important;
  }

  .ship-display-panel .hud-ship-image {
    max-height: 98px;
  }
}




/* ===== HUD alignment proper fix: use actual left stats class ===== */
/* The left bars panel is .vertical-stats, not .hud-bars-panel. Match all three panels cleanly. */
.command-hud.space-combat-hud {
  align-items: stretch !important;
  min-height: 204px !important;
}

.command-hud .vertical-stats,
.command-hud .ship-display-panel,
.command-hud .hud-command-console {
  height: 204px !important;
  min-height: 204px !important;
  max-height: 204px !important;
  align-self: stretch !important;
  box-sizing: border-box !important;
}

/* Fill the taller stat card properly instead of leaving blank space. */
.command-hud .vertical-stats {
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 9px !important;
}

.command-hud .vertical-stats .stat-col {
  height: 100% !important;
  justify-content: space-between !important;
  gap: 5px !important;
}

.command-hud .vertical-stats .stat-value {
  flex: 0 0 14px !important;
}

.command-hud .vertical-stats .stat-meter {
  height: 120px !important;
  flex: 1 1 120px !important;
  max-height: 124px !important;
}

.command-hud .vertical-stats .stat-btn {
  flex: 0 0 36px !important;
}

/* Ship card also fills its height neatly: ship/progress above, LOADOUT below. */
.command-hud .ship-display-panel.ship-display-panel-action {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 32px !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  column-gap: 6px !important;
  row-gap: 7px !important;
  padding: 10px !important;
  align-items: stretch !important;
  justify-items: center !important;
}

.command-hud .ship-display-panel-action .hud-ship-image {
  grid-column: 1 / 2 !important;
  grid-row: 1 / 2 !important;
  align-self: center !important;
  justify-self: center !important;
  max-height: 132px !important;
  max-width: 100% !important;
}

.command-hud .ship-display-panel-action .ship-mini-progress {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 2 !important;
  align-self: stretch !important;
  height: auto !important;
}

.command-hud .ship-display-panel-action .ship-inventory-btn {
  grid-column: 1 / 3 !important;
  grid-row: 2 / 3 !important;
  width: 100% !important;
  min-height: 30px !important;
  margin: 0 !important;
}

/* Keep the command panel same height and usable. */
.command-hud .hud-command-console {
  display: grid !important;
  grid-template-rows: 34px minmax(0, 1fr) !important;
  padding: 10px !important;
  overflow: hidden !important;
}

@media (max-height: 760px) {
  .command-hud.space-combat-hud {
    min-height: 194px !important;
  }

  .command-hud .vertical-stats,
  .command-hud .ship-display-panel,
  .command-hud .hud-command-console {
    height: 194px !important;
    min-height: 194px !important;
    max-height: 194px !important;
  }

  .command-hud .vertical-stats .stat-meter {
    height: 110px !important;
    flex-basis: 110px !important;
    max-height: 114px !important;
  }

  .command-hud .ship-display-panel-action .hud-ship-image {
    max-height: 122px !important;
  }
}




/* ===== HUD proportional balance pass ===== */
/* Keep the command console taller, but make the stat/loadout blocks proportionate and bottom-aligned. */
.command-hud.space-combat-hud {
  align-items: flex-end !important;
  min-height: 204px !important;
}

/* Right console keeps the extra space needed for chat/objectives. */
.command-hud .hud-command-console {
  height: 204px !important;
  min-height: 204px !important;
  max-height: 204px !important;
  align-self: flex-end !important;
  display: grid !important;
  grid-template-rows: 34px minmax(0, 1fr) !important;
  padding: 10px !important;
  overflow: hidden !important;
}

/* Left stat/loadout cards are intentionally shorter for better visual proportion. */
.command-hud .vertical-stats,
.command-hud .ship-display-panel {
  height: 174px !important;
  min-height: 174px !important;
  max-height: 174px !important;
  align-self: flex-end !important;
  box-sizing: border-box !important;
}

/* Bars fill the shorter panel cleanly without looking oversized. */
.command-hud .vertical-stats {
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 9px !important;
}

.command-hud .vertical-stats .stat-col {
  height: 100% !important;
  justify-content: space-between !important;
  gap: 5px !important;
}

.command-hud .vertical-stats .stat-value {
  flex: 0 0 14px !important;
}

.command-hud .vertical-stats .stat-meter {
  height: 92px !important;
  flex: 0 0 92px !important;
  max-height: 92px !important;
}

.command-hud .vertical-stats .stat-btn {
  flex: 0 0 34px !important;
  min-height: 34px !important;
}

/* Ship card stays compact, readable and centred. */
.command-hud .ship-display-panel.ship-display-panel-action {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 32px !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  column-gap: 6px !important;
  row-gap: 6px !important;
  padding: 10px !important;
  align-items: stretch !important;
  justify-items: center !important;
}

.command-hud .ship-display-panel-action .hud-ship-image {
  grid-column: 1 / 2 !important;
  grid-row: 1 / 2 !important;
  align-self: center !important;
  justify-self: center !important;
  max-height: 108px !important;
  max-width: 100% !important;
}

.command-hud .ship-display-panel-action .ship-mini-progress {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 2 !important;
  align-self: stretch !important;
  height: auto !important;
}

.command-hud .ship-display-panel-action .ship-inventory-btn {
  grid-column: 1 / 3 !important;
  grid-row: 2 / 3 !important;
  width: 100% !important;
  min-height: 30px !important;
  margin: 0 !important;
}

@media (max-height: 760px) {
  .command-hud.space-combat-hud {
    min-height: 194px !important;
  }

  .command-hud .hud-command-console {
    height: 194px !important;
    min-height: 194px !important;
    max-height: 194px !important;
  }

  .command-hud .vertical-stats,
  .command-hud .ship-display-panel {
    height: 166px !important;
    min-height: 166px !important;
    max-height: 166px !important;
  }

  .command-hud .vertical-stats .stat-meter {
    height: 84px !important;
    flex-basis: 84px !important;
    max-height: 84px !important;
  }

  .command-hud .ship-display-panel-action .hud-ship-image {
    max-height: 100px !important;
  }
}




/* ===== HUD equal-height compact pass ===== */
/* Make all bottom HUD panels the same height again, but compress the command console internals. */
.command-hud.space-combat-hud {
  align-items: stretch !important;
  min-height: 184px !important;
  gap: 9px !important;
}

.command-hud .vertical-stats,
.command-hud .ship-display-panel,
.command-hud .hud-command-console {
  height: 184px !important;
  min-height: 184px !important;
  max-height: 184px !important;
  align-self: stretch !important;
  box-sizing: border-box !important;
}

/* Left stats: fill the shared height without oversized bars. */
.command-hud .vertical-stats {
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 9px !important;
}

.command-hud .vertical-stats .stat-col {
  height: 100% !important;
  justify-content: space-between !important;
  gap: 5px !important;
}

.command-hud .vertical-stats .stat-value {
  flex: 0 0 13px !important;
  font-size: 10.5px !important;
}

.command-hud .vertical-stats .stat-meter {
  height: 100px !important;
  flex: 0 0 100px !important;
  max-height: 100px !important;
}

.command-hud .vertical-stats .stat-btn {
  flex: 0 0 32px !important;
  min-height: 32px !important;
  font-size: 8px !important;
}

/* Ship/loadout: same height, tidier content. */
.command-hud .ship-display-panel.ship-display-panel-action {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 32px !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  column-gap: 6px !important;
  row-gap: 6px !important;
  padding: 9px !important;
  align-items: stretch !important;
  justify-items: center !important;
}

.command-hud .ship-display-panel-action .hud-ship-image {
  grid-column: 1 / 2 !important;
  grid-row: 1 / 2 !important;
  align-self: center !important;
  justify-self: center !important;
  max-height: 112px !important;
  max-width: 100% !important;
}

.command-hud .ship-display-panel-action .ship-mini-progress {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 2 !important;
  align-self: stretch !important;
  height: auto !important;
}

.command-hud .ship-display-panel-action .ship-inventory-btn {
  grid-column: 1 / 3 !important;
  grid-row: 2 / 3 !important;
  width: 100% !important;
  min-height: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  font-size: 9.5px !important;
}

/* Command console: same height as left panels, with less padding and shorter controls. */
.command-hud .hud-command-console {
  display: grid !important;
  grid-template-rows: 30px minmax(0, 1fr) !important;
  gap: 6px !important;
  padding: 8px !important;
  overflow: hidden !important;
}

.command-hud .hud-command-tabs {
  gap: 7px !important;
}

.command-hud .hud-command-tabs button {
  min-height: 30px !important;
  height: 30px !important;
  padding: 4px 8px !important;
  font-size: 9px !important;
  letter-spacing: 0.7px !important;
}

#chatPanel.comms-panel.active {
  grid-template-rows: 20px minmax(46px, 1fr) 32px !important;
  gap: 4px !important;
}

#chatPanel .chat-panel-top {
  height: 20px !important;
  min-height: 20px !important;
}

#chatPanel .chat-channel-tabs {
  height: 19px !important;
}

#chatPanel .chat-channel-tabs button {
  min-height: 18px !important;
  height: 18px !important;
  padding: 2px 7px !important;
  font-size: 8px !important;
}

#chatPanel .local-chat-feed {
  min-height: 46px !important;
  padding: 2px 6px 2px 0 !important;
}

#chatPanel .local-chat-input-row {
  grid-template-columns: minmax(0, 1fr) 68px !important;
  gap: 6px !important;
  height: 32px !important;
  min-height: 32px !important;
}

#chatPanel .local-chat-input-row input {
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 9px !important;
  font-size: 12px !important;
}

#chatPanel .local-chat-input-row button {
  width: 68px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 8px !important;
  font-size: 11px !important;
}

@media (max-height: 760px) {
  .command-hud.space-combat-hud {
    min-height: 176px !important;
  }

  .command-hud .vertical-stats,
  .command-hud .ship-display-panel,
  .command-hud .hud-command-console {
    height: 176px !important;
    min-height: 176px !important;
    max-height: 176px !important;
  }

  .command-hud .vertical-stats .stat-meter {
    height: 92px !important;
    flex-basis: 92px !important;
    max-height: 92px !important;
  }

  .command-hud .ship-display-panel-action .hud-ship-image {
    max-height: 104px !important;
  }

  .command-hud .hud-command-console {
    grid-template-rows: 28px minmax(0, 1fr) !important;
    padding: 7px !important;
  }

  .command-hud .hud-command-tabs button {
    height: 28px !important;
    min-height: 28px !important;
  }

  #chatPanel.comms-panel.active {
    grid-template-rows: 18px minmax(40px, 1fr) 30px !important;
  }

  #chatPanel .local-chat-input-row,
  #chatPanel .local-chat-input-row input,
  #chatPanel .local-chat-input-row button {
    height: 30px !important;
    min-height: 30px !important;
  }
}




/* ===== Inventory drawer: sit above HUD + click-away close support ===== */
/* Lift the drawer above the bottom HUD so it no longer overlaps the controls. */
.inventory-drawer {
  bottom: 300px !important;
  height: min(340px, calc(100% - 350px)) !important;
  width: min(720px, calc(100% - 44px)) !important;
  max-height: 340px !important;
  z-index: 12 !important;
}

/* Keep the compact inventory usable after reducing height. */
.inventory-drawer-head {
  padding: 8px 11px !important;
}

.inventory-drawer-body {
  min-height: 0 !important;
  grid-template-columns: minmax(0, 1fr) 220px !important;
  gap: 9px !important;
  padding: 9px 11px 10px !important;
}

.inventory-drawer-grid {
  min-height: 0 !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 54px !important;
  grid-template-rows: none !important;
  overflow-y: auto !important;
  align-content: start !important;
}

.inventory-drawer-detail {
  min-height: 0 !important;
  overflow-y: auto !important;
}

/* Make it clearer that the drawer is a temporary overlay. */
.inventory-drawer.active {
  animation: inventoryDrawerRise 120ms ease-out;
}

@keyframes inventoryDrawerRise {
  from { opacity: 0; transform: translateX(-50%) translateY(8px); }
  to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

@media (max-height: 780px) {
  .inventory-drawer {
    bottom: 292px !important;
    height: min(320px, calc(100% - 335px)) !important;
    max-height: 320px !important;
  }
}

@media (max-width: 900px) {
  .inventory-drawer {
    bottom: 292px !important;
    width: calc(100% - 28px) !important;
  }

  .inventory-drawer-body {
    grid-template-columns: 1fr !important;
  }

  .inventory-drawer-detail {
    display: none !important;
  }
}




/* ===== Space HUD: remove Sector tab, rebalance remaining tabs ===== */
.command-hud .hud-command-tabs {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.command-hud .hud-command-tabs button {
  min-width: 0;
}

/* Sector HUD is deprecated now that salvage/materials auto-deposit into inventory. */
#sectorPanel {
  display: none !important;
}




/* ===== Starter Pilot Programme tutorial ===== */
.tutorial-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  pointer-events: none;
}

.tutorial-overlay.active {
  display: block;
}

.tutorial-spotlight {
  position: fixed;
  opacity: 0;
  border: 2px solid rgba(127, 223, 255, 0.95);
  border-radius: 14px;
  box-shadow:
    0 0 0 9999px rgba(0, 4, 12, 0.42),
    0 0 28px rgba(127, 223, 255, 0.36);
  transition: all 140ms ease;
  pointer-events: none;
  z-index: 1001;
}

.tutorial-highlight-target {
  position: relative;
  z-index: 1002 !important;
  box-shadow: 0 0 22px rgba(127, 223, 255, 0.35) !important;
}

.tutorial-card {
  position: fixed;
  right: 24px;
  top: 88px;
  width: min(360px, calc(100vw - 48px));
  padding: 16px;
  border: 1px solid rgba(127, 223, 255, 0.76);
  border-radius: 16px;
  background:
    radial-gradient(circle at 16% 0%, rgba(127, 223, 255, 0.16), transparent 40%),
    linear-gradient(145deg, rgba(4, 16, 31, 0.96), rgba(0, 5, 13, 0.97));
  box-shadow:
    inset 0 1px 0 rgba(160, 230, 255, 0.10),
    0 18px 44px rgba(0, 0, 0, 0.55),
    0 0 28px rgba(0, 160, 255, 0.16);
  color: #dcecff;
  pointer-events: auto;
  z-index: 1003;
}

.tutorial-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.tutorial-card-top span {
  color: #7fdfff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}

.tutorial-card-top button {
  width: auto;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 9px;
  border: 1px solid rgba(255, 110, 126, 0.34);
  background: rgba(70, 15, 28, 0.32);
  color: rgba(255, 198, 207, 0.88);
}

.tutorial-card h3 {
  margin: 0 0 8px;
  color: #ffffff;
  font-size: 20px;
  letter-spacing: 0.4px;
}

.tutorial-card p {
  margin: 0;
  color: rgba(215, 235, 248, 0.84);
  font-size: 13px;
  line-height: 1.45;
}

.tutorial-progress {
  display: grid;
  grid-template-columns: repeat(20, 1fr);
  gap: 3px;
  margin: 14px 0;
}

.tutorial-progress i {
  height: 4px;
  border-radius: 999px;
  background: rgba(127, 223, 255, 0.16);
}

.tutorial-progress i.done {
  background: rgba(52, 229, 154, 0.70);
}

.tutorial-progress i.active {
  background: #7fdfff;
  box-shadow: 0 0 10px rgba(127, 223, 255, 0.65);
}

.tutorial-actions {
  display: grid;
  grid-template-columns: 0.7fr 1.3fr;
  gap: 8px;
}

.tutorial-actions button {
  min-height: 36px;
  border-radius: 10px;
}

#tutorialBackBtn {
  background: rgba(5, 18, 34, 0.88);
}

#tutorialBackBtn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.starter-tutorial-profile-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 12px;
  align-items: center;
  padding: 13px 14px;
  border: 1px solid rgba(127, 223, 255, 0.50);
  border-radius: 14px;
  background:
    radial-gradient(circle at 18% 0%, rgba(127, 223, 255, 0.10), transparent 36%),
    linear-gradient(145deg, rgba(7, 18, 32, 0.92), rgba(0, 6, 14, 0.94));
  box-shadow: inset 0 1px 0 rgba(160, 230, 255, 0.08), 0 0 20px rgba(0, 160, 255, 0.08);
}

.starter-tutorial-profile-card strong {
  display: block;
  color: #f7fbff;
  font-size: 20px;
  line-height: 1.05;
}

.starter-tutorial-profile-card small {
  display: block;
  margin-top: 5px;
  color: rgba(190, 215, 235, 0.74);
  font-size: 11px;
}

.starter-tutorial-profile-card button {
  min-height: 40px;
  border-radius: 12px;
}

.pilot-profile-body {
  grid-template-rows: auto auto auto minmax(0, 1fr) !important;
}

@media (max-width: 980px) {
  .tutorial-card {
    right: 14px;
    top: 64px;
  }

  .starter-tutorial-profile-card {
    grid-template-columns: 1fr;
  }
}




/* ===== Tutorial event-driven refinement ===== */
#tutorialNextBtn.waiting,
#tutorialNextBtn:disabled {
  opacity: 0.62;
  cursor: not-allowed;
  background: rgba(22, 54, 92, 0.70);
  color: rgba(215, 235, 248, 0.72);
}

.tutorial-highlight-target {
  animation: tutorialPulseTarget 1.3s ease-in-out infinite;
}

@keyframes tutorialPulseTarget {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.18); }
}




/* ===== Tutorial strict guided mode + safer placement ===== */
.tutorial-card {
  right: 14px !important;
  top: 10px !important;
  width: min(342px, calc(100vw - 28px)) !important;
  max-height: calc(100vh - 24px);
  overflow-y: auto;
}

.tutorial-overlay.active {
  pointer-events: none;
}

.tutorial-card {
  pointer-events: auto;
}

/* Blocker effect while still allowing the highlighted real button to be clicked. */
.tutorial-overlay.active::before {
  content: "";
  position: fixed;
  inset: 0;
  background: rgba(0, 4, 12, 0.18);
  pointer-events: none;
}

.tutorial-highlight-target {
  pointer-events: auto !important;
}

#tutorialNextBtn.waiting,
#tutorialNextBtn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

@media (max-width: 1100px) {
  .tutorial-card {
    left: 14px !important;
    right: 14px !important;
    top: 10px !important;
    width: auto !important;
  }
}




/* ===== Tutorial profile test reset controls ===== */
.starter-tutorial-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.starter-tutorial-actions button.secondary {
  min-height: 34px;
  background: rgba(4, 16, 31, 0.78);
  border-color: rgba(127, 223, 255, 0.34);
  color: rgba(215, 235, 248, 0.82);
}

.starter-tutorial-actions button.secondary:hover {
  border-color: rgba(127, 223, 255, 0.72);
  color: #ffffff;
}

@media (min-width: 980px) {
  .starter-tutorial-profile-card {
    grid-template-columns: minmax(0, 1fr) 190px !important;
  }
}




/* ===== Tutorial route/reset fixes ===== */
.starter-tutorial-actions button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  background: rgba(22, 54, 92, 0.45);
}

.tutorial-card {
  max-width: 360px;
}




/* ===== Tutorial landing flow + no-back control ===== */
#tutorialBackBtn {
  display: none !important;
}

.tutorial-actions {
  grid-template-columns: 1fr !important;
}

/* Keep the landing highlight over the actual clickable planet button. */
#planetLandBtn.tutorial-highlight-target {
  border: 2px solid rgba(127, 223, 255, 0.98) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.14),
    0 0 28px rgba(127, 223, 255, 0.48) !important;
  border-radius: 50% !important;
}




/* ===== Tutorial landing target correction ===== */
#planetLandBtn.tutorial-highlight-target {
  outline: none !important;
  border: 2px solid rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 4px rgba(127, 223, 255, 0.16),
    0 0 34px rgba(127, 223, 255, 0.60) !important;
  background: radial-gradient(circle, rgba(127, 223, 255, 0.05), transparent 68%) !important;
}




/* ===== Prototype login + planet landing highlight fix ===== */
/* The generic tutorial target uses position: relative; the invisible planet button must remain absolute. */
#planetLandBtn.tutorial-highlight-target {
  position: absolute !important;
  top: 42px !important;
  right: 62px !important;
  left: auto !important;
  width: 145px !important;
  height: 145px !important;
  transform: none !important;
}




/* ===== Tutorial testing refinements: create-account, jump recharge, planet hitbox ===== */
#planetLandBtn,
#planetLandBtn.clickable-planet,
#planetLandBtn.tutorial-highlight-target {
  top: 50px !important;
  right: 78px !important;
  width: 128px !important;
  height: 128px !important;
}




/* ===== New-player-only tutorial + intro card polish ===== */
/* Tutorial is now only auto-started from Create Account. Existing-player Pilot access is hidden/removed. */
.starter-tutorial-profile-card,
.starter-tutorial-actions {
  display: none !important;
}

/* Keep normal tutorial cards closer to the game frame rather than floating far outside it. */
.tutorial-card {
  right: max(18px, calc((100vw - 1180px) / 2 + 18px)) !important;
  top: 18px !important;
}

/* First tutorial card: more like a welcome transmission, less like a side note. */
.tutorial-overlay.tutorial-intro-active .tutorial-card {
  top: 118px !important;
  right: auto !important;
  left: max(28px, calc((100vw - 1180px) / 2 + 52px)) !important;
  width: min(430px, calc(100vw - 64px)) !important;
  padding: 20px !important;
  background:
    radial-gradient(circle at 20% 0%, rgba(127, 223, 255, 0.22), transparent 42%),
    radial-gradient(circle at 85% 95%, rgba(42, 99, 210, 0.18), transparent 44%),
    linear-gradient(145deg, rgba(5, 18, 34, 0.97), rgba(0, 6, 15, 0.98));
}

.tutorial-overlay.tutorial-intro-active .tutorial-card h3 {
  font-size: 26px;
  letter-spacing: 0.6px;
}

.tutorial-overlay.tutorial-intro-active .tutorial-card p {
  font-size: 14px;
  line-height: 1.55;
}

.tutorial-overlay.tutorial-intro-active .tutorial-progress {
  margin-top: 16px;
}

@media (max-width: 900px) {
  .tutorial-card,
  .tutorial-overlay.tutorial-intro-active .tutorial-card {
    left: 14px !important;
    right: 14px !important;
    top: 12px !important;
    width: auto !important;
  }
}




/* ===== First ship purchase button visibility fix ===== */
.shipyard-primary-action {
  margin: 8px 0 10px;
  display: grid;
  grid-template-columns: 1fr;
}

.shipyard-primary-action button {
  width: 100%;
  min-height: 42px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.3px;
}

.shipyard-primary-action .buy-ship-action {
  border-color: rgba(127, 223, 255, 0.88);
  box-shadow:
    0 0 0 2px rgba(127, 223, 255, 0.10),
    0 0 20px rgba(47, 151, 255, 0.18);
}

#shipyardDetailPanel .fleet-weapon-action-row {
  grid-template-columns: 1fr;
}

#shipyardDetailPanel .fleet-detail-actions.compact {
  display: none;
}

@media (max-height: 780px) {
  .shipyard-primary-action {
    margin: 6px 0 8px;
  }

  .shipyard-primary-action button {
    min-height: 38px;
  }
}




/* ===== Vessel Exchange tutorial selection + detail fit ===== */
.vessel-exchange-card[data-ship-id="lupenOrigin"].tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 30px rgba(127, 223, 255, 0.42) !important;
}

.buy-ship-action.tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 30px rgba(127, 223, 255, 0.42) !important;
}

/* Prevent the right detail panel stats/action area being cut off on shorter screens. */
#shipyardDetailPanel {
  min-height: 0 !important;
  overflow-y: auto !important;
  padding-bottom: 14px !important;
}

#shipyardDetailPanel .fleet-detail-hero {
  min-height: 108px;
}

#shipyardDetailPanel .shipyard-stat-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

#shipyardDetailPanel .fleet-stat-chip {
  min-height: 48px !important;
  padding: 7px 9px !important;
}

#shipyardDetailPanel .fleet-weapon-action-row {
  margin-top: 8px;
}

@media (max-height: 760px) {
  #shipyardDetailPanel .fleet-detail-hero {
    min-height: 88px;
  }

  #shipyardDetailPanel .fleet-detail-hero img {
    max-height: 86px;
  }

  #shipyardDetailPanel .fleet-detail-title h4 {
    font-size: 18px;
  }

  #shipyardDetailPanel .shipyard-primary-action button {
    min-height: 36px;
  }

  #shipyardDetailPanel .fleet-stat-chip {
    min-height: 42px !important;
  }
}




/* ===== Vessel Exchange compact detail no-scroll fix ===== */
#shipyardDetailPanel {
  overflow: hidden !important;
  display: block !important;
  padding: 14px !important;
}

#shipyardDetailPanel .fleet-detail-hero {
  height: 112px !important;
  min-height: 112px !important;
  max-height: 112px !important;
  margin-bottom: 8px !important;
}

#shipyardDetailPanel .fleet-detail-hero img {
  max-height: 96px !important;
}

#shipyardDetailPanel .fleet-detail-title {
  margin-bottom: 6px !important;
  gap: 8px !important;
}

#shipyardDetailPanel .fleet-detail-title h4 {
  font-size: 20px !important;
  line-height: 1.05 !important;
}

#shipyardDetailPanel .fleet-detail-title p {
  font-size: 10px !important;
  line-height: 1.1 !important;
}

#shipyardDetailPanel .shipyard-primary-action {
  margin: 6px 0 8px !important;
}

#shipyardDetailPanel .shipyard-primary-action button {
  min-height: 38px !important;
}

#shipyardDetailPanel .shipyard-stat-grid,
#shipyardDetailPanel .fleet-detail-stats.shipyard-stat-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

#shipyardDetailPanel .fleet-stat-chip,
#shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
  min-height: 43px !important;
  padding: 6px 8px !important;
  border-radius: 11px !important;
}

#shipyardDetailPanel .fleet-stat-chip span {
  font-size: 8px !important;
  letter-spacing: 0.75px !important;
}

#shipyardDetailPanel .fleet-stat-chip strong {
  font-size: 13px !important;
}

#shipyardDetailPanel .fleet-stat-chip.slots-stat {
  grid-column: 1 / -1 !important;
}

#shipyardDetailPanel .fleet-stat-chip.slots-stat strong {
  font-size: 12px !important;
}

#shipyardDetailPanel .fleet-weapon-action-row {
  display: none !important;
}

/* Tutorial step 4: visually mark LF-1 Origin while the actual click target remains the Buy button. */
.vessel-exchange-card.tutorial-required-ship {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.14),
    0 0 30px rgba(127, 223, 255, 0.40) !important;
}

.vessel-exchange-card.tutorial-required-ship::after {
  content: "Buy this ship";
  position: absolute;
  right: 10px;
  bottom: 10px;
  padding: 4px 8px;
  border: 1px solid rgba(127, 223, 255, 0.65);
  border-radius: 999px;
  background: rgba(3, 18, 34, 0.92);
  color: #7fdfff;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  pointer-events: none;
}

#shipyardDetailPanel .buy-ship-action.tutorial-highlight-target {
  transform: none !important;
}

@media (max-height: 760px) {
  #shipyardDetailPanel {
    padding: 12px !important;
  }

  #shipyardDetailPanel .fleet-detail-hero {
    height: 92px !important;
    min-height: 92px !important;
    max-height: 92px !important;
  }

  #shipyardDetailPanel .fleet-detail-hero img {
    max-height: 78px !important;
  }

  #shipyardDetailPanel .fleet-detail-title h4 {
    font-size: 18px !important;
  }

  #shipyardDetailPanel .fleet-stat-chip,
  #shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
    min-height: 38px !important;
    padding: 5px 7px !important;
  }

  #shipyardDetailPanel .shipyard-primary-action button {
    min-height: 34px !important;
  }
}




/* ===== Tutorial placement and robust target polish ===== */
.tutorial-overlay.tutorial-left-card .tutorial-card {
  left: max(18px, calc((100vw - 1180px) / 2 + 18px)) !important;
  right: auto !important;
  top: 18px !important;
}

.tutorial-overlay.tutorial-bottom-card .tutorial-card {
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: 18px !important;
  transform: translateX(-50%);
}

/* Make the required attachment/gun card clearly visible without relying on text labels. */
.hangar-equipment-card[data-item-key="cargoPod"].tutorial-highlight-target,
.hangar-equipment-card[data-item-key="jumpDrive"].tutorial-highlight-target,
.hangar-equipment-card[data-item-type="gun"].tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 28px rgba(127, 223, 255, 0.42) !important;
}

/* Step 3 should make it clear the player is clicking Vessel Exchange from Loadout. */
#hangarShipyardTab.tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.14),
    0 0 26px rgba(127, 223, 255, 0.38) !important;
}

@media (max-width: 900px) {
  .tutorial-overlay.tutorial-left-card .tutorial-card,
  .tutorial-overlay.tutorial-bottom-card .tutorial-card {
    left: 14px !important;
    right: 14px !important;
    top: 12px !important;
    bottom: auto !important;
    width: auto !important;
    transform: none !important;
  }
}




/* ===== Mandatory cinematic tutorial intro + back-step placement ===== */
/* New-player tutorial is mandatory; no skip control. */
.tutorial-card-top button,
.tutorial-card button[onclick="skipStarterTutorial()"] {
  display: none !important;
}

/* First card should feel like a welcome transmission, and only Begin should be highlighted. */
.tutorial-overlay.tutorial-intro-active .tutorial-card {
  top: 92px !important;
  left: max(34px, calc((100vw - 1180px) / 2 + 58px)) !important;
  right: auto !important;
  width: min(460px, calc(100vw - 68px)) !important;
  padding: 22px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(127, 223, 255, 0.22), transparent 42%),
    radial-gradient(circle at 88% 100%, rgba(42, 99, 210, 0.20), transparent 48%),
    linear-gradient(145deg, rgba(5, 18, 34, 0.98), rgba(0, 6, 15, 0.99));
}

.tutorial-overlay.tutorial-intro-active .tutorial-card h3 {
  font-size: 30px !important;
  letter-spacing: 0.8px;
}

.tutorial-overlay.tutorial-intro-active .tutorial-card p {
  font-size: 14.5px !important;
  line-height: 1.62 !important;
  color: rgba(224, 241, 255, 0.90);
}

.tutorial-overlay.tutorial-intro-active #tutorialNextBtn {
  min-height: 50px;
  font-size: 15px;
}

.tutorial-overlay.tutorial-intro-active #tutorialNextBtn.tutorial-highlight-target {
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 26px rgba(47, 151, 255, 0.30) !important;
}

/* When the required action is a screen Back button, move the tutorial box away from it. */
.tutorial-overlay.tutorial-left-card .tutorial-card {
  left: max(18px, calc((100vw - 1180px) / 2 + 18px)) !important;
  right: auto !important;
  top: 18px !important;
}

@media (max-width: 900px) {
  .tutorial-overlay.tutorial-intro-active .tutorial-card,
  .tutorial-overlay.tutorial-left-card .tutorial-card {
    left: 14px !important;
    right: 14px !important;
    top: 12px !important;
    width: auto !important;
  }
}




/* ===== Intro centre + store attachment tutorial fix ===== */
.tutorial-overlay.tutorial-intro-active .tutorial-card {
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  width: min(520px, calc(100vw - 72px)) !important;
  padding: 26px !important;
}

.tutorial-overlay.tutorial-intro-active .tutorial-card h3 {
  font-size: 32px !important;
}

.tutorial-overlay.tutorial-intro-active .tutorial-card p {
  font-size: 15px !important;
  line-height: 1.65 !important;
}

.store-buy-attachment-action.tutorial-highlight-target,
#attachmentInventory .hangar-equipment-card.tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 28px rgba(127, 223, 255, 0.42) !important;
}

@media (max-width: 900px) {
  .tutorial-overlay.tutorial-intro-active .tutorial-card {
    left: 14px !important;
    right: 14px !important;
    top: 12px !important;
    width: auto !important;
    transform: none !important;
  }
}




/* ===== Trade completion reward feedback ===== */
.trade-result-burst {
  position: fixed;
  left: 50%;
  top: 24%;
  transform: translate(-50%, -18px) scale(0.96);
  z-index: 1600;
  pointer-events: none;
  opacity: 0;
  transition: opacity 180ms ease, transform 220ms ease;
}

.trade-result-burst.active {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
}

.trade-result-card {
  min-width: 280px;
  text-align: center;
  border: 1px solid rgba(127, 223, 255, 0.65);
  border-radius: 18px;
  padding: 18px 22px;
  background:
    radial-gradient(circle at 50% 0%, rgba(127, 223, 255, 0.20), transparent 48%),
    linear-gradient(145deg, rgba(4, 18, 34, 0.96), rgba(0, 8, 17, 0.98));
  box-shadow:
    0 0 0 2px rgba(127, 223, 255, 0.08),
    0 18px 60px rgba(0, 0, 0, 0.45),
    0 0 34px rgba(52, 229, 154, 0.16);
}

.trade-result-kicker {
  color: #7fdfff;
  text-transform: uppercase;
  letter-spacing: 1.8px;
  font-size: 10px;
  font-weight: 900;
  margin-bottom: 8px;
}

.trade-result-amount {
  font-size: 34px;
  font-weight: 1000;
  letter-spacing: 1px;
  color: #34e59a;
  text-shadow: 0 0 22px rgba(52, 229, 154, 0.42);
}

.trade-result-burst.loss .trade-result-amount {
  color: #ff5f73;
  text-shadow: 0 0 22px rgba(255, 95, 115, 0.36);
}

.trade-result-burst.loss .trade-result-card {
  border-color: rgba(255, 95, 115, 0.55);
  box-shadow:
    0 0 0 2px rgba(255, 95, 115, 0.08),
    0 18px 60px rgba(0, 0, 0, 0.45),
    0 0 34px rgba(255, 95, 115, 0.14);
}

.trade-result-meta {
  margin-top: 8px;
  font-size: 12px;
  color: rgba(215, 235, 248, 0.78);
}

.trade-mini-float {
  position: fixed;
  left: 50%;
  bottom: 23%;
  z-index: 1601;
  transform: translate(-50%, 16px);
  opacity: 0;
  pointer-events: none;
  font-size: 18px;
  font-weight: 1000;
  letter-spacing: 0.6px;
  color: #34e59a;
  text-shadow: 0 0 18px rgba(52, 229, 154, 0.50);
  transition: opacity 160ms ease, transform 900ms cubic-bezier(.12,.82,.22,1);
}

.trade-mini-float.loss {
  color: #ff5f73;
  text-shadow: 0 0 18px rgba(255, 95, 115, 0.42);
}

.trade-mini-float.active {
  opacity: 1;
  transform: translate(-50%, -38px);
}

.store-buy-attachment-action[data-item-key="evasionMatrix"].tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 30px rgba(127, 223, 255, 0.42) !important;
}




/* ===== Evasion Matrix tutorial target + longer trade reward ===== */
.store-catalog-card[data-item-key="evasionMatrix"].tutorial-highlight-target,
.store-detail-buy-action[data-item-key="evasionMatrix"].tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 32px rgba(127, 223, 255, 0.46) !important;
}

.trade-result-burst {
  transition: opacity 220ms ease, transform 260ms ease;
}

.trade-mini-float {
  transition: opacity 200ms ease, transform 1500ms cubic-bezier(.12,.82,.22,1);
}




/* ===== Step 25 Evasion Matrix two-step target fix ===== */
.store-catalog-card[data-item-key="evasionMatrix"].tutorial-highlight-target,
.store-catalog-card[data-item-key="evasionMatrix"].selected,
.store-detail-buy-action[data-item-key="evasionMatrix"].tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 32px rgba(127, 223, 255, 0.46) !important;
}




/* ===== Step 25 selection-to-buy highlight refresh ===== */
.store-catalog-card[data-item-key="evasionMatrix"].selected,
.store-catalog-card[data-item-key="evasionMatrix"].tutorial-highlight-target,
.store-detail-buy-action[data-item-key="evasionMatrix"].tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 34px rgba(127, 223, 255, 0.48) !important;
}




/* ===== Bounty tutorial navigation + cinematic outro ===== */
#sectorScanBotsBtn.tutorial-highlight-target,
#jumpBtn.tutorial-highlight-target,
#sectorSvg.tutorial-highlight-target,
.enemy-bot-target.tutorial-highlight-target,
.object-action-panel.tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 30px rgba(127, 223, 255, 0.42) !important;
}

.tutorial-overlay.tutorial-outro-active .tutorial-card {
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  width: min(540px, calc(100vw - 72px)) !important;
  padding: 28px !important;
  text-align: left;
  background:
    radial-gradient(circle at 20% 0%, rgba(127, 223, 255, 0.22), transparent 42%),
    radial-gradient(circle at 88% 100%, rgba(52, 229, 154, 0.18), transparent 48%),
    linear-gradient(145deg, rgba(5, 18, 34, 0.98), rgba(0, 6, 15, 0.99));
}

.tutorial-overlay.tutorial-outro-active .tutorial-card h3 {
  font-size: 32px !important;
  letter-spacing: 0.8px;
}

.tutorial-overlay.tutorial-outro-active .tutorial-card p {
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: rgba(224, 241, 255, 0.92);
}

.tutorial-overlay.tutorial-outro-active #tutorialNextBtn {
  min-height: 50px;
  font-size: 15px;
}

@media (max-width: 900px) {
  .tutorial-overlay.tutorial-outro-active .tutorial-card {
    left: 14px !important;
    right: 14px !important;
    top: 12px !important;
    width: auto !important;
    transform: none !important;
  }
}




/* ===== Keep tutorial clear of sector scan controls ===== */
.tutorial-overlay.tutorial-left-card .tutorial-card {
  max-width: 360px;
}

@media (min-width: 901px) {
  .tutorial-overlay.tutorial-left-card .tutorial-card {
    top: 18px !important;
    left: max(18px, calc((100vw - 1180px) / 2 + 18px)) !important;
    right: auto !important;
  }
}




/* ===== Bounty engage tutorial fix ===== */
#objectEngageBtn.tutorial-highlight-target,
#objectActionPanel.tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 34px rgba(127, 223, 255, 0.48) !important;
}

.enemy-bot-target.tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 34px rgba(127, 223, 255, 0.48) !important;
}




/* ===== Trade burst dismissal + multi-bot bounty scan flow ===== */
#jumpBtn.tutorial-highlight-target,
#sectorScanBotsBtn.tutorial-highlight-target,
#objectEngageBtn.tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 34px rgba(127, 223, 255, 0.48) !important;
}




/* ===== Planet landing target correction + claim reward continuation ===== */
#planetLandBtn,
#planetLandBtn.clickable-planet,
#planetLandBtn.tutorial-highlight-target {
  top: 34px !important;
  right: 48px !important;
  width: 168px !important;
  height: 168px !important;
  border-radius: 50% !important;
}

#planetLandBtn.tutorial-highlight-target {
  border: 2px solid rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 4px rgba(127, 223, 255, 0.16),
    0 0 38px rgba(127, 223, 255, 0.64),
    inset 0 0 28px rgba(127, 223, 255, 0.10) !important;
}

#bountyRewardOverlay button.tutorial-highlight-target,
.reward-overlay button.tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 34px rgba(127, 223, 255, 0.48) !important;
}




/* ===== Planet alignment, clearer tutorial screen, freer bounty combat ===== */
/* Align the invisible landing hitbox/ring with the visible planet artwork. */
#planetLandBtn,
#planetLandBtn.clickable-planet,
#planetLandBtn.tutorial-highlight-target {
  top: 18px !important;
  right: 24px !important;
  width: 174px !important;
  height: 174px !important;
  border-radius: 50% !important;
}

#planetLandBtn.tutorial-highlight-target {
  border: 2px solid rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 4px rgba(127, 223, 255, 0.14),
    0 0 40px rgba(127, 223, 255, 0.62),
    inset 0 0 28px rgba(127, 223, 255, 0.10) !important;
}

/* Make the game less dim during tutorial. */
.tutorial-spotlight {
  box-shadow:
    0 0 0 9999px rgba(0, 4, 12, 0.24),
    0 0 28px rgba(127, 223, 255, 0.36) !important;
}

.tutorial-overlay.active::before {
  background: rgba(0, 4, 12, 0.10) !important;
}

/* Keep left tutorial cards readable without hiding too much of the game. */
.tutorial-overlay.tutorial-left-card .tutorial-card {
  max-width: 340px;
}




/* ===== Final planet landing ring fine tune + bounty return combat freedom ===== */
#planetLandBtn,
#planetLandBtn.clickable-planet,
#planetLandBtn.tutorial-highlight-target {
  top: 0px !important;
  right: 10px !important;
  width: 168px !important;
  height: 168px !important;
  border-radius: 50% !important;
}

#planetLandBtn.tutorial-highlight-target {
  border: 2px solid rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 4px rgba(127, 223, 255, 0.14),
    0 0 42px rgba(127, 223, 255, 0.66),
    inset 0 0 30px rgba(127, 223, 255, 0.12) !important;
}

/* Combat controls should remain fully clickable during bounty return steps. */
#objectEngageBtn,
#objectActionPanel,
.enemy-bot-target {
  pointer-events: auto;
}




/* ===== Bounty Board + Vessel Exchange final panel fit ===== */

/* Replace the placeholder-feeling bounty note with a tighter, more game-like strip. */
.bounty-strip-note {
  font-weight: 700;
  letter-spacing: 0.15px;
  color: rgba(218, 237, 255, 0.88) !important;
}

/* Keep the selected bounty panel inside the screen, including Cancel Bounty. */
.bounty-board-layout-refined {
  height: calc(100% - 74px) !important;
  min-height: 0 !important;
  grid-template-columns: minmax(0, 1fr) 330px !important;
  gap: 12px !important;
}

.bounty-board-layout-refined .bounty-detail-panel {
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 10px !important;
}

.bounty-board-layout-refined .bounty-detail-body {
  height: 100% !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-rows: auto auto auto auto auto !important;
  align-content: start !important;
  gap: 7px !important;
  padding: 0 4px 10px 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: thin;
}

.bounty-board-layout-refined .bounty-detail-hero {
  gap: 8px !important;
  padding-bottom: 7px !important;
}

.bounty-board-layout-refined .bounty-detail-icon {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  border-radius: 11px !important;
}

.bounty-board-layout-refined .bounty-detail-hero strong {
  margin-bottom: 2px !important;
  font-size: 0.92rem !important;
  line-height: 1.05 !important;
}

.bounty-board-layout-refined .bounty-detail-hero span {
  font-size: 0.68rem !important;
  line-height: 1.22 !important;
}

.bounty-board-layout-refined .bounty-detail-progress-block {
  padding: 7px 9px !important;
}

.bounty-board-layout-refined .bounty-progress-heading {
  margin-bottom: 5px !important;
}

.bounty-board-layout-refined .bounty-progress-bar {
  height: 7px !important;
}

.bounty-board-layout-refined .bounty-detail-grid {
  gap: 6px !important;
}

.bounty-board-layout-refined .bounty-detail-stat {
  min-height: 32px !important;
  padding: 6px 9px !important;
  border-radius: 9px !important;
}

.bounty-board-layout-refined .bounty-detail-stat span {
  font-size: 0.58rem !important;
}

.bounty-board-layout-refined .bounty-detail-stat strong {
  font-size: 0.72rem !important;
  max-width: 150px !important;
}

.bounty-detail-actions {
  display: grid;
  gap: 7px;
  grid-template-columns: 1fr;
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding-top: 4px;
  background: linear-gradient(180deg, rgba(1, 8, 18, 0), rgba(1, 8, 18, 0.94) 30%);
}

.bounty-board-layout-refined .bounty-accept-btn,
.bounty-board-layout-refined .bounty-claim-btn,
.bounty-board-layout-refined .bounty-cancel-btn,
.bounty-detail-actions button {
  min-height: 40px !important;
  margin-top: 0 !important;
  padding: 7px 10px !important;
  border-radius: 10px !important;
  font-size: 12px !important;
}

.bounty-board-layout-refined .bounty-detail-note.compact {
  margin: 0 !important;
  font-size: 0.62rem !important;
  line-height: 1.15 !important;
  opacity: 0.8;
}

/* Ensure the Vessel Exchange Hull Detail never clips Evasion/Capacity. */
#shipyardDetailPanel {
  overflow: hidden !important;
  padding: 11px !important;
}

#shipyardDetailPanel .fleet-detail-hero {
  height: 86px !important;
  min-height: 86px !important;
  max-height: 86px !important;
  margin-bottom: 6px !important;
}

#shipyardDetailPanel .fleet-detail-hero img {
  max-height: 74px !important;
}

#shipyardDetailPanel .fleet-detail-title {
  margin-bottom: 5px !important;
}

#shipyardDetailPanel .fleet-detail-title h4 {
  font-size: 18px !important;
  line-height: 1 !important;
}

#shipyardDetailPanel .fleet-detail-title p {
  font-size: 9px !important;
  line-height: 1 !important;
}

#shipyardDetailPanel .fleet-status-chip {
  padding: 4px 7px !important;
  font-size: 9px !important;
}

#shipyardDetailPanel .shipyard-primary-action {
  margin: 4px 0 6px !important;
}

#shipyardDetailPanel .shipyard-primary-action button {
  min-height: 34px !important;
  padding: 6px 10px !important;
}

#shipyardDetailPanel .shipyard-stat-grid,
#shipyardDetailPanel .fleet-detail-stats.shipyard-stat-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

#shipyardDetailPanel .fleet-stat-chip,
#shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
  min-height: 39px !important;
  padding: 5px 7px !important;
  border-radius: 10px !important;
}

#shipyardDetailPanel .fleet-stat-chip span {
  font-size: 7px !important;
  letter-spacing: 0.55px !important;
}

#shipyardDetailPanel .fleet-stat-chip strong {
  font-size: 12px !important;
  line-height: 1.05 !important;
}

#shipyardDetailPanel .fleet-stat-chip.slots-stat {
  grid-column: 1 / -1 !important;
  min-height: 36px !important;
}

#shipyardDetailPanel .fleet-stat-chip.slots-stat strong {
  font-size: 11px !important;
}

@media (max-height: 760px) {
  .bounty-board-layout-refined .bounty-detail-stat {
    min-height: 29px !important;
    padding: 5px 8px !important;
  }

  #shipyardDetailPanel .fleet-detail-hero {
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
  }

  #shipyardDetailPanel .fleet-detail-hero img {
    max-height: 62px !important;
  }

  #shipyardDetailPanel .fleet-stat-chip,
  #shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
    min-height: 34px !important;
  }
}

/* Keep Vessel Exchange detail content visible instead of clipping the hardpoints row. */
#hangarShipyardSection #shipyardDetailPanel.fleet-detail-body {
  grid-template-rows: 88px auto 28px minmax(0, auto) auto !important;
  gap: 4px !important;
  padding: 6px !important;
  overflow: visible !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-hero {
  height: 88px !important;
  min-height: 88px !important;
  max-height: 88px !important;
  margin-bottom: 0 !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-hero img {
  max-height: 78px !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-title h4 {
  font-size: 16px !important;
  line-height: 1 !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-title p {
  margin-top: 2px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-primary-action button {
  min-height: 28px !important;
  padding: 4px 10px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-stat-grid,
#hangarShipyardSection #shipyardDetailPanel .fleet-detail-stats.shipyard-stat-grid {
  gap: 4px !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-stat-chip,
#hangarShipyardSection #shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
  min-height: 30px !important;
  padding: 4px 7px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-capacity-panel {
  min-height: 36px !important;
  padding: 5px 6px !important;
}

/* Rebuild the Vessel Exchange catalog area so it does not reserve a dead footer strip. */
#hangarShipyardSection .shipyard-catalog-panel.fleet-gallery-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  min-height: 0 !important;
  padding: 12px !important;
  overflow: hidden !important;
}

#hangarShipyardSection #shipShop.shipyard-grid.vessel-card-grid {
  align-self: stretch !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 4px 10px 12px 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* Final pass: use the available Hull Detail space without compressing the content. */
#hangarShipyardSection #shipyardDetailPanel.fleet-detail-body {
  height: 100% !important;
  grid-template-rows: 120px auto 34px auto 44px !important;
  gap: 6px !important;
  padding: 12px !important;
  overflow: hidden !important;
  align-content: stretch !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-hero {
  height: 120px !important;
  min-height: 120px !important;
  max-height: 120px !important;
  margin-bottom: 0 !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-hero img {
  max-height: 108px !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-title h4 {
  font-size: 20px !important;
  line-height: 1 !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-title p {
  margin-top: 4px !important;
  font-size: 9px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-primary-action button {
  min-height: 34px !important;
  padding: 6px 12px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-stat-grid,
#hangarShipyardSection #shipyardDetailPanel .fleet-detail-stats.shipyard-stat-grid {
  gap: 6px !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-stat-chip,
#hangarShipyardSection #shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
  min-height: 38px !important;
  padding: 6px 8px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-capacity-panel {
  min-height: 44px !important;
  padding: 7px 8px !important;
}

/* Final pass: keep Vault Item Detail inside the Hangar frame and scroll if needed. */
#hangarScreen.hangar-screen.active:has(#hangarVaultSection.active) {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
}

#hangarScreen.hangar-screen.active:has(#hangarVaultSection.active) #hangarVaultSection {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#hangarVaultSection .save-transfer-panel {
  margin-bottom: 10px;
}

#hangarVaultSection .vault-layout {
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#hangarVaultSection .vault-main-panel,
#hangarVaultSection .vault-detail-panel {
  min-height: 0 !important;
}

#hangarVaultSection .vault-detail-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  padding: 12px !important;
}

#hangarVaultSection .vault-detail-panel-body,
#hangarVaultSection #vaultDetailPanel {
  min-height: 0 !important;
  max-height: none !important;
  padding: 14px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

#hangarVaultSection .vault-detail-shell {
  height: auto !important;
  min-height: 0 !important;
  grid-template-rows: 116px auto auto auto auto auto !important;
  gap: 9px !important;
}

#hangarVaultSection .vault-detail-shell .store-detail-visual {
  height: 116px !important;
  min-height: 0 !important;
}

#hangarVaultSection .vault-detail-shell .store-detail-visual img {
  max-height: 82px !important;
}

#hangarVaultSection .vault-detail-shell .store-detail-title {
  font-size: 1.55rem !important;
  line-height: 1 !important;
}

#hangarVaultSection .vault-detail-stats {
  gap: 8px !important;
}

#hangarVaultSection .vault-detail-stats .compact-detail-stat-card {
  min-height: 52px !important;
  padding: 8px 10px !important;
}

#hangarVaultSection .vault-upgrade-panel {
  grid-template-columns: minmax(0, 1fr) auto !important;
  margin-top: 0 !important;
}

/* Final Forge pass: direct shard/core upgrades. */
.upgrade-forge-screen .forge-top-stats {
  grid-template-columns: repeat(4, minmax(118px, 1fr)) auto !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-top-chip.shard-chip span {
  color: #70ecff !important;
  border-color: rgba(112, 236, 255, 0.72) !important;
  box-shadow: 0 0 20px rgba(0, 206, 255, 0.22) !important;
}

.upgrade-forge-screen .upgrade-forge-layout {
  grid-template-columns: minmax(260px, 0.9fr) minmax(360px, 1.35fr) minmax(280px, 0.95fr) !important;
  min-height: 0 !important;
}

.upgrade-forge-screen .forge-panel {
  min-height: 0 !important;
}

.upgrade-forge-screen .forge-selected-panel,
.upgrade-forge-screen .forge-materials-panel {
  height: auto !important;
}

.upgrade-forge-screen .forge-selected-card {
  align-content: start !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-selected-art {
  min-height: 118px !important;
}

.upgrade-forge-screen .forge-selected-art img {
  max-height: 110px !important;
}

.upgrade-forge-screen .forge-chamber-panel {
  display: grid !important;
  grid-template-rows: auto minmax(180px, 1fr) auto auto !important;
  gap: 8px !important;
}

.upgrade-forge-screen .forge-chamber {
  min-height: 180px !important;
  height: 100% !important;
}

.upgrade-forge-screen .forge-chamber img {
  max-height: 170px !important;
}

.upgrade-forge-screen .forge-state-preview {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-mode-switch {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-mode-switch button {
  min-height: 50px !important;
  text-align: left !important;
}

.upgrade-forge-screen .forge-materials-list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

.upgrade-forge-screen .forge-resource-card,
.upgrade-forge-screen .forge-mode-note {
  border: 1px solid rgba(72, 170, 222, 0.45) !important;
  border-radius: 8px !important;
  background: linear-gradient(145deg, rgba(7, 24, 38, 0.96), rgba(3, 12, 22, 0.98)) !important;
  box-shadow: inset 0 0 34px rgba(43, 168, 227, 0.09) !important;
}

.upgrade-forge-screen .forge-resource-card {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
}

.upgrade-forge-screen .forge-resource-card.ready {
  border-color: rgba(42, 229, 158, 0.7) !important;
}

.upgrade-forge-screen .forge-resource-card.blocked {
  border-color: rgba(255, 184, 74, 0.55) !important;
}

.upgrade-forge-screen .forge-resource-card.empty {
  min-height: 120px !important;
  color: #eaf7ff !important;
  text-align: left !important;
}

.upgrade-forge-screen .forge-resource-main {
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-resource-main img {
  width: 58px !important;
  height: 58px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 24px rgba(73, 219, 255, 0.4)) !important;
}

.upgrade-forge-screen .forge-resource-main span,
.upgrade-forge-screen .forge-mode-note span {
  display: block !important;
  color: #86e8ff !important;
  font: 0.72rem var(--font-title) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-resource-main strong,
.upgrade-forge-screen .forge-mode-note strong {
  display: block !important;
  margin-top: 5px !important;
  color: #fff !important;
  font: 1rem var(--font-title) !important;
  letter-spacing: 0 !important;
}

.upgrade-forge-screen .forge-resource-main small,
.upgrade-forge-screen .forge-mode-note p {
  display: block !important;
  margin-top: 7px !important;
  color: #b8cde0 !important;
  font: 0.82rem var(--font-body) !important;
  line-height: 1.35 !important;
}

.upgrade-forge-screen .forge-resource-counts {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-resource-counts div {
  min-height: 52px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(72, 170, 222, 0.42) !important;
  border-radius: 8px !important;
  background: rgba(8, 28, 44, 0.72) !important;
}

.upgrade-forge-screen .forge-resource-counts span {
  display: block !important;
  color: #8eb2c8 !important;
  font: 0.68rem var(--font-title) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

.upgrade-forge-screen .forge-resource-counts strong {
  display: block !important;
  margin-top: 6px !important;
  color: #fff !important;
  font: 1.05rem var(--font-title) !important;
}

.upgrade-forge-screen .forge-core-panel {
  margin-top: 12px !important;
}

.upgrade-forge-screen .forge-mode-note {
  padding: 16px !important;
}

.upgrade-forge-screen .forge-mode-note.blocked {
  border-color: rgba(255, 184, 74, 0.52) !important;
}

.upgrade-forge-screen .forge-summary-bar {
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 220px) !important;
  align-items: stretch !important;
}

@media (max-width: 980px) {
  .upgrade-forge-screen .forge-top-stats,
  .upgrade-forge-screen .upgrade-forge-layout,
  .upgrade-forge-screen .forge-summary-bar {
    grid-template-columns: 1fr !important;
  }
}

/* Forge clarity final override. */
.upgrade-forge-screen .forge-selected-panel,
.upgrade-forge-screen .forge-materials-panel,
.upgrade-forge-screen .forge-chamber-panel {
  padding: 14px !important;
}

.upgrade-forge-screen .forge-selected-card {
  grid-template-columns: 92px minmax(0, 1fr) !important;
  padding: 12px !important;
  overflow: visible !important;
}

.upgrade-forge-screen .forge-selected-info p {
  display: none !important;
}

.upgrade-forge-screen .forge-chamber.ready {
  border-color: rgba(96, 223, 255, 0.62) !important;
  box-shadow: inset 0 0 36px rgba(56, 196, 255, 0.13), 0 0 22px rgba(72, 202, 255, 0.13) !important;
}

.upgrade-forge-screen .forge-chamber.missing-materials {
  opacity: 0.78 !important;
  filter: saturate(0.72) brightness(0.82) !important;
}

.upgrade-forge-screen .forge-chamber.upgrading {
  border-color: rgba(126, 223, 255, 0.92) !important;
  box-shadow: inset 0 0 52px rgba(96, 223, 255, 0.18), 0 0 30px rgba(96, 223, 255, 0.22) !important;
}

.upgrade-forge-screen .forge-chamber::before {
  background: radial-gradient(circle, rgba(255,255,255,0.2), rgba(126, 223, 255, 0.16) 32%, transparent 58%) !important;
}

.upgrade-forge-screen .forge-chamber img {
  width: min(68%, 470px) !important;
  height: min(200px, 66%) !important;
  max-height: 200px !important;
  filter: drop-shadow(0 0 24px rgba(var(--quality-rgb, 127, 214, 255), 0.6)) !important;
}

.upgrade-forge-screen .forge-mode-card {
  position: relative !important;
  min-height: 58px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(90, 188, 255, 0.28) !important;
  background: linear-gradient(180deg, rgba(9, 31, 52, 0.76), rgba(2, 13, 25, 0.92)) !important;
  color: rgba(236, 248, 255, 0.82) !important;
}

.upgrade-forge-screen .forge-mode-card.active {
  border-color: rgba(126, 223, 255, 0.96) !important;
  background: linear-gradient(180deg, rgba(22, 92, 138, 0.86), rgba(6, 35, 62, 0.96)) !important;
  box-shadow: inset 0 0 24px rgba(126, 223, 255, 0.16), 0 0 22px rgba(78, 212, 255, 0.22) !important;
  color: #ffffff !important;
}

.upgrade-forge-screen .forge-mode-card.active::after {
  content: "ACTIVE";
  position: absolute;
  top: 8px;
  right: 10px;
  color: #80f0ff;
  font-size: 0.58rem;
  font-weight: 1000;
  letter-spacing: 0.1em;
}

.upgrade-forge-screen .forge-mode-card.disabled {
  opacity: 0.58 !important;
}

.upgrade-forge-screen .forge-compare-card {
  display: grid !important;
  gap: 5px !important;
  padding: 9px 10px !important;
  border: 0 !important;
  border-left: 2px solid rgba(126, 223, 255, 0.32) !important;
  background: rgba(4, 17, 30, 0.58) !important;
}

.upgrade-forge-screen .forge-compare-card.after {
  border-left-color: rgba(52, 229, 154, 0.75) !important;
  background: rgba(5, 28, 34, 0.62) !important;
}

.upgrade-forge-screen .forge-compare-card div,
.upgrade-forge-screen .forge-result-preview div {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
  color: rgba(220, 238, 250, 0.8) !important;
  font-size: 0.72rem !important;
}

.upgrade-forge-screen .forge-compare-card div strong,
.upgrade-forge-screen .forge-result-preview div strong {
  color: #f7fbff !important;
  font-size: 0.78rem !important;
}

.upgrade-forge-screen .forge-resource-counts {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.upgrade-forge-screen .forge-result-preview {
  display: grid !important;
  gap: 6px !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(126, 223, 255, 0.14) !important;
}

.upgrade-forge-screen .forge-result-preview > span {
  color: #86e8ff !important;
  font-size: 0.68rem !important;
  font-weight: 1000 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-result-preview > strong {
  color: #ffffff !important;
  font: 0.98rem var(--font-title) !important;
}

.upgrade-forge-screen .forge-summary-bar {
  grid-template-columns: minmax(0, 1fr) minmax(170px, 210px) !important;
  gap: 10px !important;
  padding: 9px 10px !important;
}

.upgrade-forge-screen .forge-summary-bar > div {
  border: 0 !important;
  border-left: 2px solid rgba(126, 223, 255, 0.42) !important;
  background: rgba(4, 17, 30, 0.66) !important;
}

.upgrade-forge-screen .forge-start-btn {
  min-height: 54px !important;
  background: linear-gradient(180deg, #218ad3, #145da4) !important;
  box-shadow: 0 0 24px rgba(70, 202, 255, 0.22), inset 0 0 16px rgba(255, 255, 255, 0.09) !important;
}

.upgrade-forge-screen .forge-start-btn:not(:disabled):hover {
  background: linear-gradient(180deg, #2ba9ef, #176bb8) !important;
  box-shadow: 0 0 30px rgba(70, 202, 255, 0.34), inset 0 0 18px rgba(255, 255, 255, 0.12) !important;
}

.upgrade-forge-screen .forge-start-btn:disabled {
  opacity: 0.56 !important;
  background: linear-gradient(180deg, rgba(87, 72, 42, 0.92), rgba(58, 42, 20, 0.96)) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* Forge viewport polish: keep the image-backed chamber bright and the center stack inside frame. */
.upgrade-forge-screen .forge-chamber-panel {
  grid-template-rows: auto 176px auto auto !important;
  gap: 7px !important;
  padding: 10px 12px !important;
}

.upgrade-forge-screen .forge-chamber-visual,
.upgrade-forge-screen .forge-chamber-visual.missing-materials {
  min-height: 0 !important;
  height: 176px !important;
  opacity: 1 !important;
  filter: none !important;
  border-color: rgba(92, 205, 255, 0.36) !important;
  box-shadow: inset 0 0 34px rgba(58, 178, 255, 0.12), 0 0 18px rgba(58, 178, 255, 0.1) !important;
}

.upgrade-forge-screen .forge-chamber-bg,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  opacity: 0.98 !important;
  filter: brightness(1.22) saturate(1.22) contrast(1.08) !important;
  background-position: center 47% !important;
}

.upgrade-forge-screen .forge-chamber-vignette {
  background:
    radial-gradient(circle at center, rgba(73, 203, 255, 0.18), transparent 46%),
    linear-gradient(180deg, rgba(2, 8, 18, 0.02), rgba(2, 8, 18, 0.28)) !important;
}

.upgrade-forge-screen .forge-chamber-item,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-item {
  top: 51% !important;
  width: clamp(170px, 38%, 285px) !important;
  max-height: 58% !important;
  opacity: 1 !important;
  filter:
    brightness(1.18)
    saturate(1.15)
    drop-shadow(0 0 24px rgba(81, 202, 255, 0.82))
    drop-shadow(0 0 30px rgba(151, 92, 255, 0.26))
    drop-shadow(0 10px 22px rgba(0, 0, 0, 0.72)) !important;
}

.upgrade-forge-screen .forge-chamber-visual .forge-ring,
.upgrade-forge-screen .forge-chamber-visual .forge-beam,
.upgrade-forge-screen .forge-chamber-visual .forge-scanline,
.upgrade-forge-screen .forge-chamber-visual .forge-particles {
  opacity: 0.38 !important;
}

.upgrade-forge-screen .forge-state-preview {
  gap: 7px !important;
  margin-top: 0 !important;
}

.upgrade-forge-screen .forge-compare-card {
  gap: 3px !important;
  padding: 7px 9px !important;
}

.upgrade-forge-screen .forge-compare-card strong {
  font-size: 0.92rem !important;
  line-height: 1.05 !important;
}

.upgrade-forge-screen .forge-compare-card div {
  min-height: 26px !important;
  padding: 4px 8px !important;
  border: 1px solid rgba(126, 223, 255, 0.22) !important;
  border-radius: 7px !important;
  background: rgba(4, 17, 30, 0.62) !important;
}

.upgrade-forge-screen .forge-mode-switch {
  gap: 7px !important;
}

.upgrade-forge-screen .forge-mode-card,
.upgrade-forge-screen .forge-mode-switch button {
  min-height: 42px !important;
  padding: 8px 10px !important;
}

.upgrade-forge-screen .forge-mode-card span {
  font-size: 0.66rem !important;
}

/* Final Forge chamber asset override. */
.upgrade-forge-screen .forge-chamber-panel {
  grid-template-rows: auto minmax(165px, 190px) auto auto !important;
}

.upgrade-forge-screen .forge-chamber-visual,
.upgrade-forge-screen .forge-chamber-visual.missing-materials {
  aspect-ratio: 12 / 4.2 !important;
  min-height: 165px !important;
  max-height: 190px !important;
  height: auto !important;
}

.upgrade-forge-screen .forge-chamber-bg,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  background-image: url("assets/ui/forge/forge-chamber.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  transform: none !important;
  opacity: 0.94 !important;
  filter: none !important;
}

.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  opacity: 0.88 !important;
}

.upgrade-forge-screen .forge-chamber-item,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-item {
  top: 47% !important;
  width: clamp(125px, 28%, 205px) !important;
  max-height: 54% !important;
  filter:
    drop-shadow(0 0 12px rgba(89, 206, 255, 0.55))
    drop-shadow(0 8px 14px rgba(0, 0, 0, 0.72)) !important;
}

.upgrade-forge-screen .forge-chamber-visual.ready .forge-chamber-item {
  filter:
    drop-shadow(0 0 16px rgba(89, 206, 255, 0.85))
    drop-shadow(0 0 24px rgba(137, 100, 255, 0.25))
    drop-shadow(0 8px 14px rgba(0, 0, 0, 0.72)) !important;
}

/* Final Forge chamber asset override. */
.upgrade-forge-screen .forge-chamber-panel {
  grid-template-rows: auto minmax(165px, 190px) auto auto !important;
}

.upgrade-forge-screen .forge-chamber-visual,
.upgrade-forge-screen .forge-chamber-visual.missing-materials {
  aspect-ratio: 12 / 4.2 !important;
  min-height: 165px !important;
  max-height: 190px !important;
  height: auto !important;
}

.upgrade-forge-screen .forge-chamber-bg,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  background-image: url("assets/ui/forge/forge-chamber.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  transform: none !important;
  opacity: 0.94 !important;
  filter: none !important;
}

.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  opacity: 0.88 !important;
}

.upgrade-forge-screen .forge-chamber-item,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-item {
  top: 47% !important;
  width: clamp(125px, 28%, 205px) !important;
  max-height: 54% !important;
  filter:
    drop-shadow(0 0 12px rgba(89, 206, 255, 0.55))
    drop-shadow(0 8px 14px rgba(0, 0, 0, 0.72)) !important;
}

.upgrade-forge-screen .forge-chamber-visual.ready .forge-chamber-item {
  filter:
    drop-shadow(0 0 16px rgba(89, 206, 255, 0.85))
    drop-shadow(0 0 24px rgba(137, 100, 255, 0.25))
    drop-shadow(0 8px 14px rgba(0, 0, 0, 0.72)) !important;
}

/* Forge Chamber dedicated panel artwork. */
.upgrade-forge-screen .forge-chamber-panel {
  grid-template-rows: auto minmax(165px, 190px) auto auto !important;
  gap: 7px !important;
}

.upgrade-forge-screen .forge-chamber-visual,
.upgrade-forge-screen .forge-chamber-visual.missing-materials {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 12 / 4.2 !important;
  min-height: 165px !important;
  max-height: 190px !important;
  height: auto !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #020b16 !important;
  border: 1px solid rgba(94, 214, 255, 0.24) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 170, 255, 0.06),
    0 8px 20px rgba(0, 0, 0, 0.28) !important;
  opacity: 1 !important;
  filter: none !important;
}

.upgrade-forge-screen .forge-chamber-bg,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background-image: url("assets/ui/forge/forge-chamber.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  transform: none !important;
  opacity: 0.94 !important;
  filter: none !important;
}

.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  opacity: 0.88 !important;
}

.upgrade-forge-screen .forge-chamber-vignette {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at center, rgba(70, 180, 255, 0.05), transparent 36%),
    linear-gradient(90deg, rgba(1, 8, 18, 0.35), transparent 24%, transparent 76%, rgba(1, 8, 18, 0.35)),
    linear-gradient(180deg, rgba(1, 8, 18, 0.08), rgba(1, 8, 18, 0.26)) !important;
}

.upgrade-forge-screen .forge-chamber-visual.quality-active .forge-chamber-vignette {
  background:
    radial-gradient(circle at center, rgba(125, 84, 255, 0.07), transparent 35%),
    linear-gradient(90deg, rgba(1, 8, 18, 0.35), transparent 24%, transparent 76%, rgba(1, 8, 18, 0.35)),
    linear-gradient(180deg, rgba(1, 8, 18, 0.08), rgba(1, 8, 18, 0.26)) !important;
}

.upgrade-forge-screen .forge-chamber-visual.level-active .forge-chamber-vignette {
  background:
    radial-gradient(circle at center, rgba(60, 180, 255, 0.06), transparent 35%),
    linear-gradient(90deg, rgba(1, 8, 18, 0.35), transparent 24%, transparent 76%, rgba(1, 8, 18, 0.35)),
    linear-gradient(180deg, rgba(1, 8, 18, 0.08), rgba(1, 8, 18, 0.26)) !important;
}

/* Selected item compact fit (earlier fallback). */
.upgrade-forge-screen .forge-selected-panel {
  gap: 8px !important;
}

.upgrade-forge-screen .forge-selected-panel .modern-store-panel-header span {
  font-size: 1rem !important;
}

.upgrade-forge-screen .forge-selected-card--stack {
  grid-template-rows: auto minmax(102px, 0.62fr) minmax(0, 1fr) !important;
  gap: 6px !important;
  padding: 14px 20px 12px !important;
}

.upgrade-forge-screen .forge-selected-heading {
  gap: 7px !important;
}

.upgrade-forge-screen .forge-selected-heading h3 {
  font-size: 0.98rem !important;
  line-height: 1.1 !important;
}

.upgrade-forge-screen .forge-selected-heading .forge-item-badges span {
  min-width: 70px !important;
  padding: 5px 10px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art {
  min-height: 102px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art::after {
  bottom: 4% !important;
  height: 17px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art img {
  max-height: 112px !important;
  transform: scale(1.04) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-row {
  grid-template-columns: 26px minmax(0, 1fr) auto !important;
  gap: 8px !important;
  min-height: 31px !important;
  padding: 3px 0 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon {
  width: 20px !important;
  height: 20px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-label {
  font-size: 0.78rem !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-row strong {
  font-size: 0.82rem !important;
}

.upgrade-forge-screen .forge-selected-card--stack > .forge-selected-info:last-child {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats {
  flex: 0 0 auto !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-change-item-btn {
  min-height: 31px !important;
  margin-top: auto !important;
  padding: 6px 10px !important;
  font-size: 0.72rem !important;
}

/* Upgrade slot clarity pass. */
.upgrade-forge-screen .forge-materials-panel {
  display: grid !important;
  grid-template-rows: auto auto auto !important;
  align-content: start !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-materials-list,
.upgrade-forge-screen .forge-core-panel {
  display: block !important;
  min-height: 0 !important;
  overflow: visible !important;
}

.upgrade-forge-screen .forge-upgrade-slot-card {
  display: grid !important;
  gap: 12px !important;
  padding: 13px !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 30% 18%, rgba(87, 218, 255, 0.12), transparent 38%),
    linear-gradient(145deg, rgba(7, 24, 38, 0.94), rgba(3, 12, 22, 0.98)) !important;
}

.upgrade-forge-screen .forge-upgrade-head {
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
}

.upgrade-forge-screen .forge-upgrade-head img {
  width: 56px !important;
  height: 64px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 22px rgba(73, 219, 255, 0.42)) !important;
}

.upgrade-forge-screen .forge-upgrade-head > div {
  min-width: 0 !important;
}

.upgrade-forge-screen .forge-upgrade-head span {
  display: block !important;
  color: #86e8ff !important;
  font: 0.84rem var(--font-title) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-upgrade-head strong {
  display: block !important;
  margin-top: 3px !important;
  color: #ffffff !important;
  font-size: 0.96rem !important;
  line-height: 1.1 !important;
}

.upgrade-forge-screen .forge-upgrade-head small {
  display: block !important;
  margin-top: 6px !important;
  color: rgba(221, 238, 250, 0.82) !important;
  font-size: 0.82rem !important;
  line-height: 1.35 !important;
}

.upgrade-forge-screen .forge-material-summary {
  display: grid !important;
  gap: 0 !important;
  padding: 2px 10px !important;
  border: 1px solid rgba(126, 223, 255, 0.18) !important;
  border-radius: 8px !important;
  background: rgba(3, 14, 26, 0.58) !important;
}

.upgrade-forge-screen .forge-material-summary div {
  display: flex !important;
  min-height: 34px !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  border-bottom: 1px solid rgba(126, 223, 255, 0.11) !important;
}

.upgrade-forge-screen .forge-material-summary div:last-child {
  border-bottom: 0 !important;
}

.upgrade-forge-screen .forge-material-summary span,
.upgrade-forge-screen .forge-upgrade-result > span,
.upgrade-forge-screen .forge-upgrade-confirm > span {
  color: #86e8ff !important;
  font-size: 0.68rem !important;
  font-weight: 1000 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-material-summary strong {
  min-width: 0 !important;
  max-width: 62% !important;
  color: #ffffff !important;
  font-size: 0.86rem !important;
  line-height: 1.15 !important;
  text-align: right !important;
}

.upgrade-forge-screen .forge-material-summary .ready strong {
  color: #55f2ad !important;
}

.upgrade-forge-screen .forge-material-summary .blocked strong {
  color: #ffbd6f !important;
}

.upgrade-forge-screen .forge-upgrade-result {
  display: grid !important;
  gap: 6px !important;
  padding-top: 2px !important;
}

.upgrade-forge-screen .forge-upgrade-result > strong {
  color: #ffffff !important;
  font-size: 0.92rem !important;
  line-height: 1.1 !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats {
  display: grid !important;
  gap: 4px !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats div {
  display: flex !important;
  min-height: 24px !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 3px 7px !important;
  border: 1px solid rgba(126, 223, 255, 0.15) !important;
  border-radius: 6px !important;
  background: rgba(4, 17, 30, 0.54) !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats span {
  color: rgba(204, 228, 244, 0.78) !important;
  font-size: 0.72rem !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats strong {
  color: #f8fbff !important;
  font-size: 0.76rem !important;
  text-align: right !important;
}

.upgrade-forge-screen .forge-upgrade-confirm {
  display: grid !important;
  gap: 8px !important;
  padding-top: 2px !important;
  align-content: start !important;
}

.upgrade-forge-screen .forge-upgrade-confirm > span {
  color: #8ff8ff !important;
}

.upgrade-forge-screen .forge-upgrade-confirm.blocked > span {
  color: #ffbd6f !important;
}

.upgrade-forge-screen .forge-upgrade-confirm .forge-start-btn {
  width: 100% !important;
  min-height: 48px !important;
  margin: 0 !important;
  border-radius: 9px !important;
}

/* Forge mode polish: keep chamber item sizing identical across upgrade modes. */
.upgrade-forge-screen #forgeChamber.forge-chamber-visual .forge-chamber-item,
.upgrade-forge-screen #forgeChamber.forge-chamber-visual.level-active .forge-chamber-item,
.upgrade-forge-screen #forgeChamber.forge-chamber-visual.quality-active .forge-chamber-item,
.upgrade-forge-screen #forgeChamber.forge-chamber-visual.missing-materials .forge-chamber-item,
.upgrade-forge-screen #forgeChamber.forge-chamber-visual.ready .forge-chamber-item {
  left: 50% !important;
  top: 47% !important;
  width: clamp(130px, 29%, 210px) !important;
  height: auto !important;
  max-width: 210px !important;
  max-height: 58% !important;
  object-fit: contain !important;
  opacity: 1 !important;
}

.upgrade-forge-screen #forgeLevelModeBtn {
  --forge-mode-accent: #7ee8ff;
  --forge-mode-soft: rgba(75, 196, 255, 0.18);
}

.upgrade-forge-screen #forgeQualityModeBtn {
  --forge-mode-accent: #c89aff;
  --forge-mode-soft: rgba(179, 104, 255, 0.2);
}

.upgrade-forge-screen #forgeLevelModeBtn,
.upgrade-forge-screen #forgeQualityModeBtn {
  border-color: rgba(126, 223, 255, 0.28) !important;
}

.upgrade-forge-screen #forgeLevelModeBtn:not(.active) {
  color: #e8fbff !important;
}

.upgrade-forge-screen #forgeQualityModeBtn:not(.active) {
  color: #eadcff !important;
}

.upgrade-forge-screen #forgeQualityModeBtn span {
  color: rgba(226, 203, 255, 0.72) !important;
}

.upgrade-forge-screen #forgeLevelModeBtn.active,
.upgrade-forge-screen #forgeQualityModeBtn.active {
  border-color: color-mix(in srgb, var(--forge-mode-accent) 82%, #ffffff 18%) !important;
  background:
    linear-gradient(180deg, var(--forge-mode-soft), rgba(6, 35, 62, 0.95)) !important;
  box-shadow:
    inset 0 0 24px var(--forge-mode-soft),
    0 0 22px var(--forge-mode-soft) !important;
}

.upgrade-forge-screen #forgeLevelModeBtn.active::after,
.upgrade-forge-screen #forgeQualityModeBtn.active::after {
  color: var(--forge-mode-accent) !important;
}

.upgrade-forge-screen #forgeQualityModeBtn.active {
  color: #f2e8ff !important;
  text-shadow: 0 0 12px rgba(190, 125, 255, 0.28) !important;
}

/* Upgrade slot clarity pass (earlier fallback). */
.upgrade-forge-screen .forge-materials-panel {
  display: grid !important;
  grid-template-rows: auto auto auto minmax(0, 1fr) !important;
  align-content: start !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-materials-list,
.upgrade-forge-screen .forge-core-panel {
  display: block !important;
  min-height: 0 !important;
  overflow: visible !important;
}

.upgrade-forge-screen .forge-upgrade-slot-card {
  display: grid !important;
  gap: 12px !important;
  padding: 13px !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 30% 18%, rgba(87, 218, 255, 0.12), transparent 38%),
    linear-gradient(145deg, rgba(7, 24, 38, 0.94), rgba(3, 12, 22, 0.98)) !important;
}

.upgrade-forge-screen .forge-upgrade-head {
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
}

.upgrade-forge-screen .forge-upgrade-head img {
  width: 56px !important;
  height: 64px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 22px rgba(73, 219, 255, 0.42)) !important;
}

.upgrade-forge-screen .forge-upgrade-head > div {
  min-width: 0 !important;
}

.upgrade-forge-screen .forge-upgrade-head span {
  display: block !important;
  color: #86e8ff !important;
  font: 0.84rem var(--font-title) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-upgrade-head strong {
  display: block !important;
  margin-top: 3px !important;
  color: #ffffff !important;
  font-size: 0.96rem !important;
  line-height: 1.1 !important;
}

.upgrade-forge-screen .forge-upgrade-head small {
  display: block !important;
  margin-top: 6px !important;
  color: rgba(221, 238, 250, 0.82) !important;
  font-size: 0.82rem !important;
  line-height: 1.35 !important;
}

.upgrade-forge-screen .forge-material-summary {
  display: grid !important;
  gap: 0 !important;
  padding: 2px 10px !important;
  border: 1px solid rgba(126, 223, 255, 0.18) !important;
  border-radius: 8px !important;
  background: rgba(3, 14, 26, 0.58) !important;
}

.upgrade-forge-screen .forge-material-summary div {
  display: flex !important;
  min-height: 34px !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  border-bottom: 1px solid rgba(126, 223, 255, 0.11) !important;
}

.upgrade-forge-screen .forge-material-summary div:last-child {
  border-bottom: 0 !important;
}

.upgrade-forge-screen .forge-material-summary span,
.upgrade-forge-screen .forge-upgrade-result > span,
.upgrade-forge-screen .forge-upgrade-confirm > span {
  color: #86e8ff !important;
  font-size: 0.68rem !important;
  font-weight: 1000 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-material-summary strong {
  min-width: 0 !important;
  max-width: 62% !important;
  color: #ffffff !important;
  font-size: 0.86rem !important;
  line-height: 1.15 !important;
  text-align: right !important;
}

.upgrade-forge-screen .forge-material-summary .ready strong {
  color: #55f2ad !important;
}

.upgrade-forge-screen .forge-material-summary .blocked strong {
  color: #ffbd6f !important;
}

.upgrade-forge-screen .forge-upgrade-result {
  display: grid !important;
  gap: 6px !important;
  padding-top: 2px !important;
}

.upgrade-forge-screen .forge-upgrade-result > strong {
  color: #ffffff !important;
  font-size: 0.92rem !important;
  line-height: 1.1 !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats {
  display: grid !important;
  gap: 4px !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats div {
  display: flex !important;
  min-height: 24px !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 3px 7px !important;
  border: 1px solid rgba(126, 223, 255, 0.15) !important;
  border-radius: 6px !important;
  background: rgba(4, 17, 30, 0.54) !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats span {
  color: rgba(204, 228, 244, 0.78) !important;
  font-size: 0.72rem !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats strong {
  color: #f8fbff !important;
  font-size: 0.76rem !important;
  text-align: right !important;
}

.upgrade-forge-screen .forge-upgrade-confirm {
  display: grid !important;
  gap: 8px !important;
  padding-top: 2px !important;
  align-content: start !important;
}

.upgrade-forge-screen .forge-upgrade-confirm > span {
  color: #8ff8ff !important;
}

.upgrade-forge-screen .forge-upgrade-confirm.blocked > span {
  color: #ffbd6f !important;
}

.upgrade-forge-screen .forge-upgrade-confirm .forge-start-btn {
  width: 100% !important;
  min-height: 48px !important;
  margin: 0 !important;
  border-radius: 9px !important;
}

/* Final Forge selected item and upgrade slot cleanup. */
.upgrade-forge-screen .forge-selected-panel,
.upgrade-forge-screen .forge-materials-panel {
  overflow: hidden !important;
}

.upgrade-forge-screen .forge-selected-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: grid !important;
}

.upgrade-forge-screen .forge-selected-card--stack {
  grid-template-rows: auto minmax(110px, 1fr) auto !important;
  gap: 8px !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 12px 14px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art {
  min-height: 108px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art img {
  max-height: 112px !important;
  transform: scale(1.12) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats div {
  min-height: 29px !important;
  padding: 3px 0 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-change-item-btn {
  min-height: 32px !important;
  margin-top: 8px !important;
}

.upgrade-forge-screen .forge-upgrade-slot-card {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid rgba(72, 170, 222, 0.45) !important;
  border-radius: 8px !important;
  background: linear-gradient(145deg, rgba(7, 24, 38, 0.96), rgba(3, 12, 22, 0.98)) !important;
  box-shadow: inset 0 0 34px rgba(43, 168, 227, 0.09) !important;
}

.upgrade-forge-screen .forge-upgrade-slot-card.ready {
  border-color: rgba(42, 229, 158, 0.7) !important;
}

.upgrade-forge-screen .forge-upgrade-slot-card.blocked {
  border-color: rgba(255, 184, 74, 0.55) !important;
}

.upgrade-forge-screen .forge-material-use {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 2px 12px !important;
  align-items: center !important;
  padding: 9px 10px !important;
  border: 1px solid rgba(126, 223, 255, 0.22) !important;
  border-radius: 8px !important;
  background: rgba(4, 17, 30, 0.62) !important;
}

.upgrade-forge-screen .forge-material-use strong {
  grid-row: span 2 !important;
  color: #ffffff !important;
  font: 1.45rem var(--font-title) !important;
}

.upgrade-forge-screen .forge-upgrade-confirm {
  display: grid !important;
  gap: 8px !important;
  align-content: end !important;
}

.upgrade-forge-screen .forge-upgrade-confirm .forge-start-btn {
  min-height: 42px !important;
}

.upgrade-forge-screen .forge-chamber-item,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-item {
  width: clamp(125px, 28%, 205px) !important;
  max-height: 54% !important;
}

/* Forge panel cleanup for tomorrow pass. */
.upgrade-forge-screen .forge-selected-panel,
.upgrade-forge-screen .forge-materials-panel {
  overflow: hidden !important;
}

.upgrade-forge-screen .forge-selected-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: grid !important;
}

.upgrade-forge-screen .forge-selected-card--stack {
  grid-template-rows: auto minmax(110px, 1fr) auto !important;
  gap: 8px !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 12px 14px !important;
}

.upgrade-forge-screen .forge-selected-heading {
  gap: 7px !important;
}

.upgrade-forge-screen .forge-selected-heading h3 {
  font-size: 0.98rem !important;
  line-height: 1.08 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art {
  min-height: 108px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art img {
  max-height: 112px !important;
  transform: scale(1.12) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats div {
  min-height: 29px !important;
  padding: 3px 0 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-change-item-btn {
  min-height: 32px !important;
  margin-top: 8px !important;
}

.upgrade-forge-screen .forge-materials-list {
  flex: 0 0 auto !important;
  gap: 8px !important;
}

.upgrade-forge-screen .forge-core-panel {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin-top: 8px !important;
  overflow: visible !important;
}

.upgrade-forge-screen .forge-upgrade-slot-card {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid rgba(72, 170, 222, 0.45) !important;
  border-radius: 8px !important;
  background: linear-gradient(145deg, rgba(7, 24, 38, 0.96), rgba(3, 12, 22, 0.98)) !important;
  box-shadow: inset 0 0 34px rgba(43, 168, 227, 0.09) !important;
}

.upgrade-forge-screen .forge-upgrade-slot-card.ready {
  border-color: rgba(42, 229, 158, 0.7) !important;
}

.upgrade-forge-screen .forge-upgrade-slot-card.blocked {
  border-color: rgba(255, 184, 74, 0.55) !important;
}

.upgrade-forge-screen .forge-upgrade-material {
  grid-template-columns: 54px minmax(0, 1fr) !important;
}

.upgrade-forge-screen .forge-upgrade-material img {
  width: 54px !important;
  height: 54px !important;
}

.upgrade-forge-screen .forge-material-use {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 2px 12px !important;
  align-items: center !important;
  padding: 9px 10px !important;
  border: 1px solid rgba(126, 223, 255, 0.22) !important;
  border-radius: 8px !important;
  background: rgba(4, 17, 30, 0.62) !important;
}

.upgrade-forge-screen .forge-material-use span,
.upgrade-forge-screen .forge-material-use small {
  color: rgba(190, 220, 238, 0.76) !important;
  font-size: 0.7rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-material-use strong {
  grid-row: span 2 !important;
  color: #ffffff !important;
  font: 1.45rem var(--font-title) !important;
}

.upgrade-forge-screen .forge-upgrade-confirm {
  display: grid !important;
  gap: 8px !important;
  align-content: end !important;
}

.upgrade-forge-screen .forge-upgrade-confirm span {
  color: #86e8ff !important;
  font-size: 0.72rem !important;
  font-weight: 1000 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-upgrade-confirm strong {
  color: #f7fbff !important;
  font-size: 0.9rem !important;
  line-height: 1.1 !important;
}

.upgrade-forge-screen .forge-upgrade-confirm .forge-start-btn {
  min-height: 42px !important;
}

.upgrade-forge-screen .forge-chamber-item,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-item {
  width: clamp(125px, 28%, 205px) !important;
  max-height: 54% !important;
}

.upgrade-forge-screen .forge-chamber-visual .forge-ring,
.upgrade-forge-screen .forge-chamber-visual .forge-beam,
.upgrade-forge-screen .forge-chamber-visual .forge-scanline,
.upgrade-forge-screen .forge-chamber-visual .forge-particles {
  opacity: 0.08 !important;
  z-index: 2 !important;
}

.upgrade-forge-screen .forge-chamber-item,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-item {
  position: absolute !important;
  z-index: 3 !important;
  left: 50% !important;
  top: 47% !important;
  width: clamp(125px, 28%, 205px) !important;
  height: auto !important;
  max-height: 54% !important;
  object-fit: contain !important;
  transform: translate(-50%, -50%) rotate(-8deg) !important;
  image-rendering: auto !important;
  opacity: 1 !important;
  filter:
    drop-shadow(0 0 12px rgba(89, 206, 255, 0.55))
    drop-shadow(0 8px 14px rgba(0, 0, 0, 0.72)) !important;
  animation: forgeFloat 4.6s ease-in-out infinite !important;
}

.upgrade-forge-screen .forge-chamber-visual.ready .forge-chamber-item {
  filter:
    drop-shadow(0 0 16px rgba(89, 206, 255, 0.85))
    drop-shadow(0 0 24px rgba(137, 100, 255, 0.25))
    drop-shadow(0 8px 14px rgba(0, 0, 0, 0.72)) !important;
}

.upgrade-forge-screen .forge-chamber-visual.upgrading .forge-chamber-item,
.upgrade-forge-screen .forge-chamber-visual.forging .forge-chamber-item {
  animation: forgeFloat 1.7s ease-in-out infinite, forgeItemTransform 2.1s ease-in-out !important;
}

/* Selected item card: stacked forge loadout style. */
.upgrade-forge-screen .forge-selected-card--stack {
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto minmax(128px, 1fr) auto !important;
  gap: 10px !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 14px 16px !important;
  border-color: rgba(var(--quality-rgb, 127, 214, 255), 0.72) !important;
  background:
    radial-gradient(circle at 50% 38%, rgba(var(--quality-rgb, 127, 214, 255), 0.18), transparent 50%),
    linear-gradient(180deg, rgba(7, 21, 36, 0.96), rgba(2, 9, 18, 0.98)) !important;
}

.upgrade-forge-screen .forge-selected-heading {
  display: grid !important;
  justify-items: center !important;
  gap: 8px !important;
  text-align: center !important;
}

.upgrade-forge-screen .forge-selected-heading h3 {
  margin: 0 !important;
  color: #f8fbff !important;
  font-size: 1.04rem !important;
  line-height: 1.12 !important;
}

.upgrade-forge-screen .forge-selected-heading .forge-item-badges {
  justify-content: center !important;
}

.upgrade-forge-screen .forge-selected-heading .forge-item-badges span {
  min-width: 76px !important;
  justify-content: center !important;
  text-align: center !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art {
  position: relative !important;
  min-height: 128px !important;
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art::after {
  content: "";
  position: absolute;
  left: 16%;
  right: 16%;
  bottom: 10%;
  height: 20px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(var(--quality-rgb, 127, 214, 255), 0.34), transparent 72%);
  filter: blur(2px);
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art img {
  position: relative !important;
  z-index: 1 !important;
  max-width: 96% !important;
  max-height: 132px !important;
  transform: scale(1.18) !important;
  filter:
    brightness(1.08)
    drop-shadow(0 0 22px rgba(var(--quality-rgb, 127, 214, 255), 0.42))
    drop-shadow(0 12px 20px rgba(0, 0, 0, 0.65)) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats {
  gap: 0 !important;
  margin-top: 0 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats div {
  min-height: 33px !important;
  align-items: center !important;
  padding: 5px 0 !important;
  border-bottom: 1px solid rgba(126, 223, 255, 0.15) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats span {
  color: rgba(186, 213, 238, 0.86) !important;
  font-size: 0.82rem !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats strong {
  color: #f7fbff !important;
  font-size: 0.84rem !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats div:first-child strong {
  color: var(--quality-accent, #7fd6ff) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-change-item-btn {
  min-height: 34px !important;
  margin-top: 10px !important;
}

/* Forge chamber image-backed visual. */
.upgrade-forge-screen .forge-chamber-visual {
  position: relative !important;
  width: 100% !important;
  min-height: 260px !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background: #03101f !important;
  border: 1px solid rgba(92, 205, 255, 0.22) !important;
  isolation: isolate !important;
}

.upgrade-forge-screen .forge-chamber-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: url("assets/ui/forge/forge-chamber.png");
  background-size: cover;
  background-position: center 47%;
  background-repeat: no-repeat;
  transform: scale(1.02);
  opacity: 0.95;
}

.upgrade-forge-screen .forge-chamber-vignette {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at center, rgba(38, 178, 255, 0.08), transparent 42%),
    linear-gradient(180deg, rgba(2, 8, 18, 0.12), rgba(2, 8, 18, 0.55));
}

.upgrade-forge-screen .forge-chamber-visual::before,
.upgrade-forge-screen .forge-chamber-visual::after {
  display: none !important;
}

.upgrade-forge-screen .forge-chamber-visual .forge-ring,
.upgrade-forge-screen .forge-chamber-visual .forge-beam,
.upgrade-forge-screen .forge-chamber-visual .forge-scanline,
.upgrade-forge-screen .forge-chamber-visual .forge-particles {
  z-index: 2;
  opacity: 0.28;
  mix-blend-mode: screen;
}

.upgrade-forge-screen .forge-chamber-visual .forge-ring {
  border-width: 1px !important;
  box-shadow: 0 0 22px rgba(126, 223, 255, 0.12), inset 0 0 10px rgba(126, 223, 255, 0.08) !important;
}

.upgrade-forge-screen .forge-chamber-item {
  position: absolute !important;
  z-index: 3 !important;
  left: 50% !important;
  top: 52% !important;
  width: clamp(150px, 32%, 260px) !important;
  height: auto !important;
  max-height: 46% !important;
  object-fit: contain !important;
  transform: translate(-50%, -50%) rotate(-8deg) !important;
  animation: forgeFloat 4.5s ease-in-out infinite !important;
  filter:
    drop-shadow(0 0 18px rgba(81, 202, 255, 0.55))
    drop-shadow(0 10px 22px rgba(0, 0, 0, 0.65)) !important;
}

.upgrade-forge-screen .forge-chamber-visual.ready .forge-chamber-item {
  filter:
    drop-shadow(0 0 24px rgba(81, 202, 255, 0.8))
    drop-shadow(0 0 34px rgba(151, 92, 255, 0.35))
    drop-shadow(0 10px 22px rgba(0, 0, 0, 0.65)) !important;
}

.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  opacity: 0.72;
}

.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-item {
  opacity: 0.88;
}

.upgrade-forge-screen .forge-chamber-visual.upgrading .forge-chamber-item,
.upgrade-forge-screen .forge-chamber-visual.forging .forge-chamber-item {
  animation: forgeFloat 1.7s ease-in-out infinite, forgeItemTransform 2.1s ease-in-out !important;
}

@keyframes forgeFloat {
  0%, 100% {
    transform: translate(-50%, -50%) rotate(-8deg);
  }
  50% {
    transform: translate(-50%, -54%) rotate(-8deg);
  }
}

/* Forge clarity pass: mode state, material result, and compact comparison UI. */
.upgrade-forge-screen .forge-selected-panel,
.upgrade-forge-screen .forge-materials-panel,
.upgrade-forge-screen .forge-chamber-panel {
  padding: 14px !important;
}

.upgrade-forge-screen .forge-selected-card {
  grid-template-columns: 92px minmax(0, 1fr) !important;
  padding: 12px !important;
  overflow: visible !important;
}

.upgrade-forge-screen .forge-selected-info p {
  display: none !important;
}

.upgrade-forge-screen .forge-core-stats {
  gap: 6px !important;
}

.upgrade-forge-screen .forge-core-stats div {
  padding: 0 0 5px !important;
  border-bottom: 1px solid rgba(126, 223, 255, 0.11) !important;
}

.upgrade-forge-screen .forge-chamber {
  transition: filter 180ms ease, border-color 180ms ease, box-shadow 180ms ease, opacity 180ms ease !important;
}

.upgrade-forge-screen .forge-chamber.ready {
  border-color: rgba(96, 223, 255, 0.62) !important;
  box-shadow: inset 0 0 36px rgba(56, 196, 255, 0.13), 0 0 22px rgba(72, 202, 255, 0.13) !important;
}

.upgrade-forge-screen .forge-chamber.missing-materials {
  opacity: 0.78 !important;
  filter: saturate(0.72) brightness(0.82) !important;
}

.upgrade-forge-screen .forge-chamber.upgrading {
  border-color: rgba(126, 223, 255, 0.92) !important;
  box-shadow: inset 0 0 52px rgba(96, 223, 255, 0.18), 0 0 30px rgba(96, 223, 255, 0.22) !important;
}

.upgrade-forge-screen .forge-chamber::before {
  background: radial-gradient(circle, rgba(255,255,255,0.2), rgba(126, 223, 255, 0.16) 32%, transparent 58%) !important;
}

.upgrade-forge-screen .forge-chamber img {
  width: min(68%, 470px) !important;
  height: min(200px, 66%) !important;
  filter: drop-shadow(0 0 24px rgba(var(--quality-rgb, 127, 214, 255), 0.6)) !important;
}

.upgrade-forge-screen .forge-mode-card {
  position: relative !important;
  min-height: 58px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(90, 188, 255, 0.28) !important;
  background: linear-gradient(180deg, rgba(9, 31, 52, 0.76), rgba(2, 13, 25, 0.92)) !important;
  color: rgba(236, 248, 255, 0.82) !important;
}

.upgrade-forge-screen .forge-mode-card.active {
  border-color: rgba(126, 223, 255, 0.96) !important;
  background: linear-gradient(180deg, rgba(22, 92, 138, 0.86), rgba(6, 35, 62, 0.96)) !important;
  box-shadow: inset 0 0 24px rgba(126, 223, 255, 0.16), 0 0 22px rgba(78, 212, 255, 0.22) !important;
  color: #ffffff !important;
}

.upgrade-forge-screen .forge-mode-card.active::after {
  content: "ACTIVE";
  position: absolute;
  top: 8px;
  right: 10px;
  color: #80f0ff;
  font-size: 0.58rem;
  font-weight: 1000;
  letter-spacing: 0.1em;
}

.upgrade-forge-screen .forge-mode-card.disabled {
  opacity: 0.58 !important;
}

.upgrade-forge-screen .forge-state-preview {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.upgrade-forge-screen .forge-compare-card {
  display: grid !important;
  gap: 5px !important;
  padding: 9px 10px !important;
  border: 0 !important;
  border-left: 2px solid rgba(126, 223, 255, 0.32) !important;
  background: rgba(4, 17, 30, 0.58) !important;
}

.upgrade-forge-screen .forge-compare-card.after {
  border-left-color: rgba(52, 229, 154, 0.75) !important;
  background: rgba(5, 28, 34, 0.62) !important;
}

.upgrade-forge-screen .forge-compare-card div,
.upgrade-forge-screen .forge-result-preview div {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
  color: rgba(220, 238, 250, 0.8) !important;
  font-size: 0.72rem !important;
}

.upgrade-forge-screen .forge-compare-card div strong,
.upgrade-forge-screen .forge-result-preview div strong {
  color: #f7fbff !important;
  font-size: 0.78rem !important;
}

.upgrade-forge-screen .forge-resource-counts {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.upgrade-forge-screen .forge-result-preview {
  display: grid !important;
  gap: 6px !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(126, 223, 255, 0.14) !important;
}

.upgrade-forge-screen .forge-result-preview > span {
  color: #86e8ff !important;
  font-size: 0.68rem !important;
  font-weight: 1000 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-result-preview > strong {
  color: #ffffff !important;
  font: 0.98rem var(--font-title) !important;
}

.upgrade-forge-screen .forge-summary-bar {
  grid-template-columns: minmax(0, 1fr) minmax(170px, 210px) !important;
  gap: 10px !important;
  padding: 9px 10px !important;
}

.upgrade-forge-screen .forge-summary-bar > div {
  border: 0 !important;
  border-left: 2px solid rgba(126, 223, 255, 0.42) !important;
  background: rgba(4, 17, 30, 0.66) !important;
}

.upgrade-forge-screen .forge-summary-bar small {
  margin-top: 3px !important;
}

.upgrade-forge-screen .forge-start-btn {
  min-height: 54px !important;
  background: linear-gradient(180deg, #218ad3, #145da4) !important;
  box-shadow: 0 0 24px rgba(70, 202, 255, 0.22), inset 0 0 16px rgba(255, 255, 255, 0.09) !important;
}

.upgrade-forge-screen .forge-start-btn:not(:disabled):hover {
  background: linear-gradient(180deg, #2ba9ef, #176bb8) !important;
  box-shadow: 0 0 30px rgba(70, 202, 255, 0.34), inset 0 0 18px rgba(255, 255, 255, 0.12) !important;
}

.upgrade-forge-screen .forge-start-btn:disabled {
  opacity: 0.56 !important;
  background: linear-gradient(180deg, rgba(87, 72, 42, 0.92), rgba(58, 42, 20, 0.96)) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* Rebuild the Vessel Exchange catalog area so it does not reserve a dead footer strip. */
#hangarShipyardSection .shipyard-catalog-panel.fleet-gallery-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  min-height: 0 !important;
  padding: 12px !important;
  overflow: hidden !important;
}

#hangarShipyardSection #shipShop.shipyard-grid.vessel-card-grid {
  align-self: stretch !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 4px 10px 12px 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}




/* ===== Final claim bounty flow + planet landing ring polish ===== */
#planetLandBtn,
#planetLandBtn.clickable-planet,
#planetLandBtn.tutorial-highlight-target {
  top: 8px !important;
  right: 4px !important;
  width: 158px !important;
  height: 158px !important;
  border-radius: 50% !important;
}

#planetLandBtn.tutorial-highlight-target {
  border: 2px solid rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 4px rgba(127, 223, 255, 0.14),
    0 0 42px rgba(127, 223, 255, 0.66),
    inset 0 0 30px rgba(127, 223, 255, 0.12) !important;
}

/* Stop the reward badge sitting over the Bounty Board button label. */
.hub-action-badge {
  top: 7px !important;
  right: 50% !important;
  transform: translateX(50%);
  padding: 2px 6px !important;
  font-size: 8px !important;
  line-height: 1 !important;
  letter-spacing: 0.45px !important;
  border-radius: 999px !important;
  white-space: nowrap;
  pointer-events: none;
}

.hub-actions button.reward-ready {
  padding-top: 20px !important;
}

#bountyBoardHubBtn.tutorial-highlight-target,
.bounty-claim-btn.tutorial-highlight-target {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 34px rgba(127, 223, 255, 0.48) !important;
}

/* ===== Vessel Exchange readable card pass ===== */
#hangarShipyardSection .shipyard-title-row {
  align-items: center;
}

#hangarShipyardSection .shipyard-title-row p {
  max-width: 540px;
}

#hangarShipyardSection .modern-store-panel-header {
  min-height: 38px;
}

.vessel-card-grid {
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)) !important;
  gap: 12px !important;
  padding: 4px 8px 6px 0 !important;
}

.vessel-exchange-card {
  min-height: 202px !important;
  padding: 11px !important;
  display: grid !important;
  grid-template-rows: 78px auto auto auto !important;
  align-content: start !important;
  gap: 6px !important;
}

.vessel-exchange-card .fleet-card-badge {
  top: 10px;
  right: 10px;
}

.vessel-exchange-card .fleet-card-image-wrap {
  height: 78px !important;
  margin: 0 !important;
}

.vessel-exchange-card .fleet-card-image-wrap img {
  max-height: 78px !important;
}

.vessel-exchange-card .fleet-card-name {
  min-height: 19px;
  margin: 0 !important;
  font-size: 15px !important;
  line-height: 1.05 !important;
}

.vessel-exchange-card .fleet-card-role {
  min-height: 22px !important;
  margin: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.vessel-exchange-card .fleet-card-mini-stats {
  margin: 0 !important;
  gap: 5px !important;
}

.vessel-exchange-card .fleet-card-mini-stats span {
  min-width: 0;
  min-height: 31px;
  padding: 4px 3px !important;
  display: grid;
  align-content: center;
  gap: 2px;
}

.vessel-exchange-card .fleet-card-mini-stats em {
  color: rgba(154, 204, 232, 0.76);
  font-size: 7px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0.6px;
  line-height: 1;
  text-transform: uppercase;
}

.vessel-exchange-card .fleet-card-mini-stats strong {
  color: #f7fbff;
  font-size: 11px;
  line-height: 1;
}

.vessel-exchange-card .fleet-card-slots {
  display: none !important;
}

.ship-slot-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  min-width: 0;
}

.ship-slot-bank {
  min-width: 0;
  min-height: 38px;
  padding: 6px;
  border: 1px solid rgba(127, 223, 255, 0.15);
  border-radius: 10px;
  background:
    radial-gradient(circle at 50% 0%, rgba(127, 223, 255, 0.08), transparent 58%),
    rgba(3, 12, 25, 0.72);
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 4px;
}

.ship-slot-bank span {
  color: rgba(154, 204, 232, 0.76);
  font-size: 7.5px;
  font-weight: 900;
  letter-spacing: 0.75px;
  line-height: 1;
  text-transform: uppercase;
}

.ship-slot-bank strong {
  color: #f7fbff;
  font-size: 11px;
  line-height: 1;
}

.ship-slot-pips {
  grid-column: 1 / -1;
  display: flex;
  gap: 3px;
  min-width: 0;
  margin-top: 1px;
}

.ship-slot-pip {
  flex: 1 1 8px;
  max-width: 14px;
  height: 7px;
  border-radius: 3px;
  border: 1px solid rgba(127, 223, 255, 0.24);
  background: rgba(2, 10, 22, 0.92);
}

.ship-slot-pip.filled {
  background: linear-gradient(180deg, #7fdfff, #1f75c7);
  border-color: rgba(127, 223, 255, 0.72);
  box-shadow: 0 0 8px rgba(127, 223, 255, 0.18);
}

.equip-bank .ship-slot-pip.filled {
  background: linear-gradient(180deg, #5cffab, #168a61);
  border-color: rgba(92, 255, 171, 0.58);
  box-shadow: 0 0 8px rgba(92, 255, 171, 0.16);
}

#shipyardDetailPanel {
  padding: 12px !important;
}

#shipyardDetailPanel .fleet-detail-hero {
  height: 94px !important;
  min-height: 94px !important;
  max-height: 94px !important;
}

#shipyardDetailPanel .fleet-detail-hero img {
  max-height: 82px !important;
}

#shipyardDetailPanel .shipyard-stat-grid,
#shipyardDetailPanel .fleet-detail-stats.shipyard-stat-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

#shipyardDetailPanel .fleet-stat-chip,
#shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
  min-height: 41px !important;
}

#shipyardDetailPanel .fleet-stat-chip.slots-stat {
  display: none !important;
}

.shipyard-capacity-panel {
  margin-top: 7px;
  padding: 9px;
  border: 1px solid rgba(127, 223, 255, 0.16);
  border-radius: 12px;
  background:
    radial-gradient(circle at 15% 0%, rgba(127, 223, 255, 0.10), transparent 50%),
    rgba(3, 12, 25, 0.72);
}

#shipyardDetailPanel .shipyard-capacity-panel {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 7px !important;
}

.shipyard-capacity-heading {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  margin-bottom: 7px;
}

#shipyardDetailPanel .shipyard-capacity-heading {
  display: grid;
  gap: 4px;
  margin: 0;
}

.shipyard-capacity-heading span {
  color: #83e9ff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.shipyard-capacity-heading strong {
  color: rgba(230, 245, 255, 0.88);
  font-size: 10px;
  line-height: 1;
  white-space: nowrap;
}

#shipyardDetailPanel .ship-slot-bank {
  min-height: 34px;
  padding: 5px;
  grid-template-columns: auto auto minmax(0, 1fr);
  grid-template-rows: 1fr;
  align-items: center;
}

#shipyardDetailPanel .ship-slot-bank span {
  font-size: 8px;
}

#shipyardDetailPanel .ship-slot-bank strong {
  font-size: 13px;
}

#shipyardDetailPanel .ship-slot-pip {
  height: 6px;
}

#shipyardDetailPanel .ship-slot-pips {
  grid-column: auto;
  margin-top: 0;
  margin-left: 3px;
}

.vessel-exchange-card[data-tutorial-target="firstShipCard"].tutorial-highlight-target,
.vessel-exchange-card.tutorial-required-ship {
  border-color: rgba(127, 223, 255, 1) !important;
  box-shadow:
    0 0 0 3px rgba(127, 223, 255, 0.16),
    0 0 30px rgba(127, 223, 255, 0.42) !important;
}

.vessel-exchange-card.tutorial-required-ship::after {
  bottom: 8px !important;
  right: 8px !important;
}

@media (max-height: 760px) {
  .vessel-exchange-card {
    min-height: 198px !important;
    grid-template-rows: 64px auto auto auto !important;
    gap: 5px !important;
  }

  .vessel-exchange-card .fleet-card-image-wrap {
    height: 64px !important;
  }

  .vessel-exchange-card .fleet-card-image-wrap img {
    max-height: 64px !important;
  }

  .vessel-exchange-card .fleet-card-role {
    min-height: 18px !important;
    -webkit-line-clamp: 1;
  }

  .ship-slot-bank {
    min-height: 42px;
    padding: 5px;
  }

  .ship-slot-pip {
    flex-basis: 7px;
    height: 6px;
  }

  #shipyardDetailPanel .fleet-detail-hero {
    height: 68px !important;
    min-height: 68px !important;
    max-height: 68px !important;
  }

  #shipyardDetailPanel .fleet-detail-hero img {
    max-height: 58px !important;
  }

  .shipyard-capacity-panel {
    margin-top: 4px;
    padding: 5px !important;
  }

  #shipyardDetailPanel .fleet-stat-chip,
  #shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
    min-height: 31px !important;
  }

  #shipyardDetailPanel .shipyard-primary-action button {
    min-height: 30px !important;
  }

  #shipyardDetailPanel .ship-slot-bank {
    min-height: 28px;
  }
}

/* ===== Fleet selector and scalable hardpoint polish ===== */
.fleet-selector-card {
  min-height: 156px !important;
  padding: 11px !important;
  display: grid !important;
  grid-template-rows: 82px auto auto !important;
  align-content: start !important;
  gap: 6px !important;
}

.fleet-selector-card .fleet-card-image-wrap {
  height: 82px !important;
  margin: 0 !important;
}

.fleet-selector-card .fleet-card-image-wrap img {
  max-height: 82px !important;
}

.fleet-selector-card .fleet-card-name {
  margin: 0 !important;
}

.fleet-selector-card .fleet-card-role {
  min-height: 24px !important;
  margin: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.fleet-selector-card .fleet-card-mini-stats,
.fleet-selector-card .fleet-card-slots {
  display: none !important;
}

.fleet-detail-body {
  grid-template-rows: 110px auto auto auto !important;
  gap: 8px !important;
}

#hangarOwnedSection .fleet-detail-hero {
  min-height: 0;
}

#hangarOwnedSection .fleet-detail-hero img {
  max-height: 100px !important;
}

#hangarOwnedSection .fleet-detail-stats {
  gap: 6px !important;
}

#hangarOwnedSection .fleet-detail-stats .fleet-stat-chip {
  min-height: 42px !important;
  padding: 6px !important;
}

#hangarOwnedSection .fleet-capacity-panel {
  padding: 7px !important;
}

.fleet-capacity-panel {
  margin-top: 0;
}

.fleet-capacity-panel .shipyard-capacity-heading strong {
  max-width: 190px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ship-slot-bank strong {
  min-width: 2ch;
  text-align: right;
}

.ship-slot-pips {
  overflow: hidden;
}

.ship-slot-pip.condensed {
  flex-basis: 6px;
  max-width: 10px;
}

.vessel-exchange-card {
  min-height: 214px !important;
  grid-template-rows: 78px auto auto minmax(46px, auto) !important;
}

.vessel-exchange-card .ship-slot-bank {
  min-height: 44px;
}

.vessel-exchange-card .ship-slot-bank span {
  font-size: 7px;
}

.vessel-exchange-card .ship-slot-bank strong {
  font-size: 12px;
}

.vessel-exchange-card .ship-slot-pips {
  gap: 2px;
}

@media (max-height: 760px) {
  .fleet-selector-card {
    min-height: 140px !important;
    grid-template-rows: 68px auto auto !important;
  }

  .fleet-selector-card .fleet-card-image-wrap {
    height: 68px !important;
  }

  .fleet-selector-card .fleet-card-image-wrap img {
    max-height: 68px !important;
  }

  .vessel-exchange-card {
    min-height: 204px !important;
    grid-template-rows: 62px auto auto minmax(44px, auto) !important;
  }

  .vessel-exchange-card .ship-slot-bank {
    min-height: 41px;
  }
}

/* ===== Vessel Exchange showcase cards: art-first hull browsing ===== */
#hangarShipyardSection .vessel-card-grid {
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 14px;
  padding: 4px 8px 4px 0;
}

#hangarShipyardSection .vessel-card-grid::-webkit-scrollbar {
  width: 6px;
}

#hangarShipyardSection .vessel-card-grid::-webkit-scrollbar-track {
  background: rgba(4, 16, 28, 0.76);
  border-radius: 999px;
}

#hangarShipyardSection .vessel-card-grid::-webkit-scrollbar-thumb {
  background: rgba(105, 220, 255, 0.48);
  border-radius: 999px;
}

#hangarShipyardSection .vessel-exchange-card {
  min-height: 250px !important;
  padding: 14px;
  border-radius: 14px;
  display: grid;
  grid-template-rows: minmax(142px, 1fr) auto auto !important;
  align-content: stretch;
  background:
    radial-gradient(circle at 50% 30%, rgba(127, 223, 255, 0.2), transparent 48%),
    linear-gradient(145deg, rgba(6, 21, 39, 0.9), rgba(1, 7, 16, 0.95));
}

#hangarShipyardSection .vessel-exchange-card .fleet-card-image-wrap {
  height: auto !important;
  min-height: 142px;
  margin: 8px 0 12px;
}

#hangarShipyardSection .vessel-exchange-card .fleet-card-image-wrap img {
  max-height: 148px !important;
  transform: scale(1.18);
  filter:
    drop-shadow(0 0 28px rgba(70, 180, 255, 0.26))
    drop-shadow(0 0 48px rgba(70, 180, 255, 0.12));
}

#hangarShipyardSection .vessel-exchange-card .fleet-card-name {
  font-size: 17px;
}

#hangarShipyardSection .vessel-exchange-card .fleet-card-role {
  min-height: 0;
  margin-bottom: 0;
  font-size: 9.5px;
}

#hangarShipyardSection .vessel-exchange-card .fleet-card-mini-stats,
#hangarShipyardSection .vessel-exchange-card .fleet-card-slots,
#hangarShipyardSection .vessel-exchange-card .ship-slot-summary {
  display: none;
}

@media (max-height: 780px) {
  #hangarShipyardSection .vessel-exchange-card {
    min-height: 220px !important;
    grid-template-rows: minmax(116px, 1fr) auto auto !important;
  }

  #hangarShipyardSection .vessel-exchange-card .fleet-card-image-wrap {
    min-height: 116px;
  }

  #hangarShipyardSection .vessel-exchange-card .fleet-card-image-wrap img {
    max-height: 120px !important;
  }
}

@media (max-width: 1160px) {
  #hangarShipyardSection .vessel-card-grid {
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  }
}

/* ===== Bounty Board contained layout ===== */
.bounty-screen.active {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 12px;
}

.bounty-screen .market-header,
.bounty-screen .bounty-top-strip {
  margin-bottom: 0 !important;
}

.bounty-board-layout-refined {
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.bounty-board-layout-refined .bounty-contract-panel,
.bounty-board-layout-refined .bounty-detail-panel {
  min-height: 0 !important;
}

.bounty-board-layout-refined .bounty-contract-grid {
  height: 100% !important;
  min-height: 0 !important;
  grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
  overflow-y: auto !important;
}

.bounty-board-layout-refined .bounty-contract-card {
  min-height: 0 !important;
}

/* ===== Bounty Board generated icon pass ===== */
.bounty-board-layout-refined .bounty-contract-card {
  grid-template-columns: 52px minmax(0, 1fr) 76px 74px 96px !important;
  gap: 6px 10px !important;
}

.bounty-card-icon,
.bounty-detail-icon {
  overflow: hidden;
  background: rgba(5, 10, 20, 0.92) !important;
}

.bounty-board-layout-refined .bounty-card-icon {
  width: 48px !important;
  height: 48px !important;
  border-radius: 12px !important;
  border-color: rgba(255, 93, 125, 0.58) !important;
}

.bounty-card-icon img,
.bounty-detail-icon img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.bounty-board-layout-refined .bounty-card-status {
  grid-column: 2 / 6 !important;
}

.bounty-card-threat {
  justify-self: end;
  padding: 4px 8px;
  border: 1px solid rgba(255, 210, 84, 0.24);
  border-radius: 999px;
  color: rgba(255, 224, 145, 0.94);
  background: rgba(80, 48, 8, 0.18);
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.bounty-board-layout-refined .bounty-card-objective {
  align-self: center;
}

.bounty-board-layout-refined .bounty-detail-icon {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  border-color: rgba(127, 223, 255, 0.56) !important;
}

/* ===== Bounty Board contract upgrade ===== */
.bounty-board-layout-refined {
  grid-template-columns: minmax(0, 1fr) minmax(330px, 390px) !important;
}

.bounty-board-layout-refined .bounty-contract-card.bounty-card {
  grid-template-columns: 58px minmax(0, 1fr) auto auto !important;
  grid-template-rows: auto auto auto;
  border-radius: 14px;
  border-color: rgba(109, 211, 255, 0.34);
  background:
    linear-gradient(135deg, rgba(0, 14, 32, 0.96), rgba(2, 8, 18, 0.9)),
    rgba(0, 0, 0, 0.72);
}

.bounty-board-layout-refined .bounty-contract-card.bounty-card--rapid {
  border-color: rgba(255, 103, 71, 0.62);
  box-shadow: inset 3px 0 0 rgba(255, 103, 71, 0.9), 0 0 22px rgba(255, 67, 43, 0.08);
}

.bounty-board-layout-refined .bounty-contract-card.bounty-card--standard {
  border-color: rgba(91, 211, 255, 0.54);
  box-shadow: inset 3px 0 0 rgba(91, 211, 255, 0.9), 0 0 22px rgba(0, 185, 255, 0.08);
}

.bounty-board-layout-refined .bounty-contract-card.bounty-card--priority {
  border-color: rgba(255, 199, 72, 0.56);
  box-shadow: inset 3px 0 0 rgba(255, 199, 72, 0.92), 0 0 22px rgba(255, 185, 45, 0.08);
}

.bounty-board-layout-refined .bounty-contract-card.selected {
  background:
    linear-gradient(135deg, rgba(5, 27, 52, 0.98), rgba(3, 12, 26, 0.94)),
    rgba(0, 0, 0, 0.72);
  border-color: rgba(169, 238, 255, 0.82);
}

.bounty-board-layout-refined .bounty-contract-card.failed {
  border-color: rgba(148, 159, 176, 0.3);
  filter: saturate(0.55);
}

.bounty-board-layout-refined .bounty-card-icon {
  grid-row: 1 / 4;
  width: 54px !important;
  height: 54px !important;
  border-radius: 12px !important;
  border-color: rgba(127, 223, 255, 0.36) !important;
}

.bounty-card-icon.missing-image::before,
.bounty-detail-icon.missing-image::before {
  content: "◇";
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: rgba(127, 223, 255, 0.9);
  font-size: 1.7rem;
  text-shadow: 0 0 14px rgba(127, 223, 255, 0.65);
}

.bounty-chip {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 20px;
  padding: 3px 8px;
  border: 1px solid rgba(127, 223, 255, 0.28);
  border-radius: 999px;
  color: #9fe9ff;
  background: rgba(7, 34, 62, 0.62);
  font-size: 0.56rem;
  font-weight: 950;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.bounty-chip--rapid {
  color: #ffd0bf;
  border-color: rgba(255, 112, 77, 0.55);
  background: rgba(92, 28, 16, 0.62);
}

.bounty-chip--standard {
  color: #9fe9ff;
  border-color: rgba(91, 211, 255, 0.52);
}

.bounty-chip--priority {
  color: #ffe39a;
  border-color: rgba(255, 199, 72, 0.55);
  background: rgba(82, 55, 10, 0.5);
}

.bounty-board-layout-refined .bounty-card-copy {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.bounty-board-layout-refined .bounty-card-copy strong {
  color: #ffffff;
  line-height: 1.06;
}

.bounty-card-objective,
.bounty-board-layout-refined .bounty-card-reward,
.bounty-timer-chip {
  align-self: center;
  border: 1px solid rgba(127, 223, 255, 0.16);
  border-radius: 999px;
  background: rgba(0, 10, 22, 0.48);
  padding: 5px 9px;
  color: #dcecff;
  font-size: 0.68rem;
  font-weight: 900;
  white-space: nowrap;
}

.bounty-board-layout-refined .bounty-card-reward {
  color: #b6f2ff;
  border-color: rgba(127, 223, 255, 0.26);
}

.bounty-timer-chip {
  grid-column: 2 / 4;
  justify-self: start;
  color: #ffd4bd;
  border-color: rgba(255, 112, 77, 0.46);
  background: rgba(82, 24, 12, 0.42);
}

.bounty-board-layout-refined .bounty-card-status {
  grid-column: 4 / 5 !important;
  justify-self: end;
  margin-top: 0;
}

.selected-bounty-panel {
  border-color: rgba(127, 223, 255, 0.42);
}

.selected-bounty-header {
  border: 1px solid rgba(127, 223, 255, 0.2);
  background:
    linear-gradient(135deg, rgba(2, 26, 50, 0.78), rgba(0, 7, 18, 0.92)),
    rgba(0, 0, 0, 0.52);
}

.selected-bounty-header.failed,
.bounty-complete-note.failed {
  border-color: rgba(255, 103, 71, 0.38);
}

.selected-bounty-timer {
  padding: 12px;
  border: 1px solid rgba(255, 112, 77, 0.45);
  border-radius: 12px;
  color: #ffe1cf;
  background: linear-gradient(135deg, rgba(95, 26, 10, 0.58), rgba(18, 8, 4, 0.72));
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-align: center;
  text-transform: uppercase;
  box-shadow: inset 0 0 18px rgba(255, 90, 44, 0.08);
}

.selected-bounty-info-row {
  display: flex !important;
  justify-content: space-between;
  gap: 12px;
}

.selected-bounty-info-row strong {
  max-width: 190px !important;
  text-align: right;
}

.bounty-board-layout-refined .bounty-accept-btn {
  color: #f7fdff;
  background: linear-gradient(180deg, rgba(52, 198, 255, 0.96), rgba(0, 92, 190, 0.94));
  border: 1px solid rgba(176, 240, 255, 0.5);
  box-shadow: 0 0 22px rgba(0, 174, 255, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.bounty-board-layout-refined .bounty-claim-btn {
  background: linear-gradient(180deg, rgba(52, 218, 134, 0.96), rgba(13, 122, 72, 0.94));
}

@media (max-width: 900px) {
  .bounty-board-layout-refined {
    grid-template-columns: 1fr !important;
  }

  .bounty-board-layout-refined .bounty-contract-card.bounty-card {
    grid-template-columns: 54px minmax(0, 1fr);
  }

  .bounty-card-objective,
  .bounty-board-layout-refined .bounty-card-reward,
  .bounty-timer-chip,
  .bounty-board-layout-refined .bounty-card-status {
    grid-column: 2 / 3 !important;
    justify-self: start;
  }
}

/* ===== Tutorial high-contrast highlight + debug tools ===== */
.tutorial-spotlight {
  border-color: rgba(255, 220, 95, 1) !important;
  box-shadow:
    0 0 0 9999px rgba(0, 4, 12, 0.26),
    0 0 0 4px rgba(255, 220, 95, 0.22),
    0 0 34px rgba(255, 220, 95, 0.62),
    0 0 58px rgba(255, 79, 178, 0.24) !important;
}

.tutorial-highlight-target,
#planetLandBtn.tutorial-highlight-target,
#jumpBtn.tutorial-highlight-target,
#sectorScanBotsBtn.tutorial-highlight-target,
#sectorScanAlliesBtn.tutorial-highlight-target,
#sectorScanEnemiesBtn.tutorial-highlight-target,
#sectorSvg.tutorial-highlight-target,
#objectEngageBtn.tutorial-highlight-target,
#objectActionPanel.tutorial-highlight-target,
.enemy-bot-target.tutorial-highlight-target,
.bounty-claim-btn.tutorial-highlight-target,
#bountyRewardOverlay button.tutorial-highlight-target,
.reward-overlay button.tutorial-highlight-target,
.buy-ship-action.tutorial-highlight-target,
.store-catalog-card.tutorial-highlight-target,
.store-detail-buy-action.tutorial-highlight-target,
.hangar-equipment-card.tutorial-highlight-target {
  border-color: rgba(255, 220, 95, 1) !important;
  outline: 2px solid rgba(255, 79, 178, 0.74) !important;
  outline-offset: 3px !important;
  box-shadow:
    0 0 0 4px rgba(255, 220, 95, 0.2),
    0 0 22px rgba(255, 220, 95, 0.82),
    0 0 42px rgba(255, 79, 178, 0.38) !important;
}

.debug-tools-panel {
  position: fixed;
  left: 14px;
  bottom: 14px;
  z-index: 2000;
  width: min(280px, calc(100vw - 28px));
  padding: 10px;
  border: 1px solid rgba(255, 220, 95, 0.42);
  border-radius: 12px;
  background:
    linear-gradient(145deg, rgba(35, 22, 6, 0.96), rgba(2, 8, 18, 0.96));
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.46), 0 0 28px rgba(255, 220, 95, 0.14);
  color: #ffe8a3;
}

.debug-tools-panel strong {
  display: block;
  margin-bottom: 8px;
  font-size: 0.68rem;
  font-weight: 950;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.debug-tools-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.debug-tools-grid button {
  min-height: 30px;
  padding: 6px 7px;
  border-radius: 8px;
  border-color: rgba(255, 220, 95, 0.34);
  background: rgba(68, 45, 10, 0.72);
  color: #fff4c6;
  font-size: 0.64rem;
}

.debug-tools-grid button:last-child {
  grid-column: 1 / -1;
}

.debug-tools-panel span {
  display: block;
  min-height: 14px;
  margin-top: 7px;
  color: rgba(255, 232, 163, 0.78);
  font-size: 0.62rem;
}

.local-save-migration-modal .reward-modal-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.local-save-migration-modal .reward-modal-actions button {
  min-height: 42px;
}

@media (max-width: 640px) {
  .local-save-migration-modal .reward-modal-actions {
    grid-template-columns: 1fr;
  }
}

/* ===== Objective readability and tutorial framing pass ===== */
.objective-bounty-icon.image {
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 45%, rgba(255, 90, 125, 0.22), transparent 64%),
    rgba(52, 5, 18, 0.62);
}

.objective-bounty-icon.image img {
  width: 86%;
  height: 86%;
  object-fit: contain;
  filter: drop-shadow(0 0 10px rgba(255, 93, 125, 0.42));
}

.tutorial-card.tutorial-card-positioned {
  width: min(342px, calc(100vw - 44px)) !important;
  max-height: calc(100vh - 44px) !important;
  overflow-y: auto;
}

.tutorial-spotlight {
  box-shadow:
    0 0 0 9999px rgba(0, 4, 12, 0.16),
    0 0 0 4px rgba(255, 220, 95, 0.18),
    0 0 34px rgba(255, 220, 95, 0.58),
    0 0 58px rgba(255, 79, 178, 0.22) !important;
}

.tutorial-overlay.active::before {
  background: rgba(0, 4, 12, 0.055) !important;
}

#sectorSvg .objective-route-step {
  stroke: #ffd65c !important;
  stroke-width: 0.56 !important;
  stroke-opacity: 0.96 !important;
  filter: drop-shadow(0 0 5px rgba(255, 214, 92, 0.78));
}

#sectorSvg .svg-current-ring {
  stroke: #7fdfff !important;
  stroke-width: 0.38 !important;
  filter: drop-shadow(0 0 7px rgba(127, 223, 255, 0.9));
}

#sectorSvg .svg-player-node .svg-current-ring {
  animation: mapPlayerPulse 1.65s ease-in-out infinite;
}

#sectorSvg .svg-objective-target-ring,
#sectorSvg .objective-target-ring {
  fill: none;
  stroke: #ff4fb2 !important;
  stroke-width: 0.34 !important;
  stroke-dasharray: 1.2 0.7;
  filter: drop-shadow(0 0 7px rgba(255, 79, 178, 0.82));
  animation: mapObjectivePulse 1.35s ease-in-out infinite;
}

#sectorSvg .objective-target-pointer {
  fill: #ff4fb2;
  filter: drop-shadow(0 0 5px rgba(255, 79, 178, 0.8));
}

#sectorSvg .objective-target-label {
  fill: #ffe8a3;
  font-size: 1.25px;
  font-weight: 900;
  letter-spacing: 0.12px;
  text-anchor: middle;
  text-transform: uppercase;
  paint-order: stroke;
  stroke: rgba(0, 5, 13, 0.92);
  stroke-width: 0.46px;
}

#sectorSvg .svg-space-node.objective-target-node {
  fill: #ffd65c !important;
  stroke: #ff4fb2 !important;
  stroke-width: 0.26 !important;
}

#sectorSvg .svg-objective-path-node .svg-space-node:not(.objective-target-node) {
  fill: #ffe8a3 !important;
  opacity: 1 !important;
}

@keyframes mapPlayerPulse {
  0%, 100% { stroke-width: 0.36; opacity: 0.82; }
  50% { stroke-width: 0.58; opacity: 1; }
}

@keyframes mapObjectivePulse {
  0%, 100% { opacity: 0.72; }
  50% { opacity: 1; }
}




/* ===== Bounty complete + item found reward bursts ===== */
.game-reward-burst {
  position: fixed;
  left: 50%;
  top: 22%;
  transform: translate(-50%, -16px) scale(0.96);
  z-index: 1602;
  pointer-events: none;
  opacity: 0;
  transition: opacity 200ms ease, transform 260ms ease;
}

.game-reward-burst.active {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
}

.game-reward-card {
  min-width: 320px;
  display: grid;
  grid-template-columns: 62px 1fr;
  gap: 14px;
  align-items: center;
  border: 1px solid rgba(127, 223, 255, 0.68);
  border-radius: 18px;
  padding: 16px 18px;
  background:
    radial-gradient(circle at 15% 0%, rgba(127, 223, 255, 0.20), transparent 44%),
    linear-gradient(145deg, rgba(4, 18, 34, 0.97), rgba(0, 8, 17, 0.99));
  box-shadow:
    0 0 0 2px rgba(127, 223, 255, 0.08),
    0 18px 60px rgba(0, 0, 0, 0.46),
    0 0 36px rgba(127, 223, 255, 0.18);
}

.game-reward-icon {
  width: 58px;
  height: 58px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  color: #7fdfff;
  font-size: 30px;
  font-weight: 1000;
  background: rgba(7, 24, 42, 0.92);
  border: 1px solid rgba(127, 223, 255, 0.52);
  box-shadow: inset 0 0 22px rgba(127, 223, 255, 0.12), 0 0 24px rgba(127, 223, 255, 0.16);
}

.game-reward-icon.image img {
  max-width: 42px;
  max-height: 42px;
  object-fit: contain;
  filter: drop-shadow(0 0 10px rgba(127, 223, 255, 0.30));
}

.game-reward-kicker {
  color: #7fdfff;
  text-transform: uppercase;
  letter-spacing: 1.7px;
  font-size: 10px;
  font-weight: 1000;
  margin-bottom: 4px;
}

.game-reward-title {
  color: #f7fbff;
  font-size: 20px;
  font-weight: 1000;
  line-height: 1.05;
}

.game-reward-meta {
  margin-top: 6px;
  color: rgba(215, 235, 248, 0.78);
  font-size: 12px;
  font-weight: 800;
}

.game-reward-burst.bounty .game-reward-card {
  border-color: rgba(255, 210, 84, 0.68);
  box-shadow:
    0 0 0 2px rgba(255, 210, 84, 0.08),
    0 18px 60px rgba(0, 0, 0, 0.46),
    0 0 40px rgba(255, 210, 84, 0.20);
}

.game-reward-burst.bounty .game-reward-icon,
.game-reward-burst.bounty .game-reward-kicker {
  color: #ffe58c;
  border-color: rgba(255, 210, 84, 0.58);
}

.game-reward-burst.loot .game-reward-card {
  border-color: rgba(52, 229, 154, 0.62);
  box-shadow:
    0 0 0 2px rgba(52, 229, 154, 0.08),
    0 18px 60px rgba(0, 0, 0, 0.46),
    0 0 40px rgba(52, 229, 154, 0.18);
}

.game-reward-burst.loot .game-reward-kicker {
  color: #34e59a;
}

.game-reward-burst.core .game-reward-card {
  border-color: rgba(178, 116, 255, 0.72);
  box-shadow:
    0 0 0 2px rgba(178, 116, 255, 0.10),
    0 18px 60px rgba(0, 0, 0, 0.46),
    0 0 44px rgba(178, 116, 255, 0.24);
}

.game-reward-burst.core .game-reward-kicker {
  color: #cda4ff;
}

@media (max-width: 700px) {
  .game-reward-burst {
    top: 16%;
    width: calc(100vw - 32px);
  }

  .game-reward-card {
    min-width: 0;
  }
}

.inventory-item-card.quality-refined,
.inventory-item-frame.quality-refined,
.broker-item-card.quality-refined,
.broker-item-frame.quality-refined,
.inventory-icon-card.quality-refined,
.equipment-slot.quality-refined,
.inventory-drawer-card.quality-refined,
.equipped-orbit-slot.quality-refined,
.hangar-tooltip-card.quality-refined,
.store-catalog-card.quality-refined,
.store-quality-refined .store-detail-visual {
  border-color: rgba(50, 210, 125, 0.58);
}

.store-quality-pill.quality-refined.active {
  border-color: rgba(50, 210, 125, 0.9);
}

.vault-upgrade-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr) auto;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid rgba(126, 216, 255, 0.28);
  background: rgba(4, 18, 31, 0.72);
  border-radius: 8px;
}

.vault-upgrade-panel.passive {
  grid-template-columns: 1fr;
}

.vault-upgrade-panel span {
  display: block;
  color: #7ed8ff;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.vault-upgrade-panel strong {
  display: block;
  margin-top: 3px;
  color: #f6fbff;
  font-size: 0.86rem;
}

.vault-upgrade-panel button {
  min-width: 96px;
  height: 38px;
}

@media (max-width: 760px) {
  .vault-upgrade-panel {
    grid-template-columns: 1fr;
  }

  .vault-upgrade-panel button {
    width: 100%;
  }
}

/* ===== Upgrade quality energy effects ===== */
.quality-refined {
  --quality-rgb: 50, 210, 125;
  --quality-accent: #32d27d;
}

.quality-advanced {
  --quality-rgb: 181, 108, 255;
  --quality-accent: #b56cff;
}

.quality-elite {
  --quality-rgb: 255, 214, 92;
  --quality-accent: #ffd65c;
}

.quality-legendary {
  --quality-rgb: 255, 138, 71;
  --quality-accent: #ff8a47;
}

.quality-godlike {
  --quality-rgb: 255, 84, 84;
  --quality-accent: #ff5454;
}

.quality-core {
  --quality-rgb: 205, 164, 255;
  --quality-accent: #cda4ff;
}

.inventory-item-card.quality-refined,
.inventory-item-card.quality-advanced,
.inventory-item-card.quality-elite,
.inventory-item-card.quality-legendary,
.inventory-item-card.quality-godlike,
.inventory-item-card.quality-core,
.inventory-drawer-card.quality-refined,
.inventory-drawer-card.quality-advanced,
.inventory-drawer-card.quality-elite,
.inventory-drawer-card.quality-legendary,
.inventory-drawer-card.quality-godlike,
.inventory-drawer-card.quality-core,
.equipped-orbit-slot.quality-refined,
.equipped-orbit-slot.quality-advanced,
.equipped-orbit-slot.quality-elite,
.equipped-orbit-slot.quality-legendary,
.equipped-orbit-slot.quality-godlike,
.equipped-orbit-slot.quality-core,
.inventory-icon-card.quality-refined,
.inventory-icon-card.quality-advanced,
.inventory-icon-card.quality-elite,
.inventory-icon-card.quality-legendary,
.inventory-icon-card.quality-godlike,
.inventory-icon-card.quality-core,
.equipment-slot.quality-refined,
.equipment-slot.quality-advanced,
.equipment-slot.quality-elite,
.equipment-slot.quality-legendary,
.equipment-slot.quality-godlike,
.equipment-slot.quality-core,
.store-catalog-card.quality-refined,
.store-catalog-card.quality-advanced,
.store-catalog-card.quality-elite,
.store-catalog-card.quality-legendary,
.store-catalog-card.quality-godlike,
.store-catalog-card.quality-core,
.store-quality-refined .store-detail-visual,
.store-quality-advanced .store-detail-visual,
.store-quality-elite .store-detail-visual,
.store-quality-legendary .store-detail-visual,
.store-quality-godlike .store-detail-visual,
.store-quality-core .store-detail-visual {
  position: relative;
  overflow: hidden;
  border-color: rgba(var(--quality-rgb), 0.72);
  box-shadow:
    inset 0 0 18px rgba(var(--quality-rgb), 0.08),
    0 0 18px rgba(var(--quality-rgb), 0.12);
}

.store-card-art.quality-refined,
.store-card-art.quality-advanced,
.store-card-art.quality-elite,
.store-card-art.quality-legendary,
.store-card-art.quality-godlike,
.store-card-art.quality-core,
.store-catalog-card.quality-refined .store-card-art,
.store-catalog-card.quality-advanced .store-card-art,
.store-catalog-card.quality-elite .store-card-art,
.store-catalog-card.quality-legendary .store-card-art,
.store-catalog-card.quality-godlike .store-card-art,
.store-catalog-card.quality-core .store-card-art,
.store-quality-refined .store-detail-visual,
.store-quality-advanced .store-detail-visual,
.store-quality-elite .store-detail-visual,
.store-quality-legendary .store-detail-visual,
.store-quality-godlike .store-detail-visual,
.store-quality-core .store-detail-visual {
  position: relative;
  overflow: hidden;
}

.store-card-art.quality-refined::after,
.store-card-art.quality-advanced::after,
.store-card-art.quality-elite::after,
.store-card-art.quality-legendary::after,
.store-card-art.quality-godlike::after,
.store-card-art.quality-core::after,
.store-catalog-card.quality-refined .store-card-art::after,
.store-catalog-card.quality-advanced .store-card-art::after,
.store-catalog-card.quality-elite .store-card-art::after,
.store-catalog-card.quality-legendary .store-card-art::after,
.store-catalog-card.quality-godlike .store-card-art::after,
.store-catalog-card.quality-core .store-card-art::after,
.store-quality-refined .store-detail-visual::after,
.store-quality-advanced .store-detail-visual::after,
.store-quality-elite .store-detail-visual::after,
.store-quality-legendary .store-detail-visual::after,
.store-quality-godlike .store-detail-visual::after,
.store-quality-core .store-detail-visual::after {
  content: "";
  position: absolute;
  inset: 12%;
  pointer-events: none;
  border-radius: 50%;
  background:
    conic-gradient(
      from 0deg,
      transparent 0deg,
      transparent 36deg,
      rgba(var(--quality-rgb), 0.92) 43deg,
      transparent 49deg,
      transparent 128deg,
      rgba(var(--quality-rgb), 0.74) 135deg,
      transparent 142deg,
      transparent 248deg,
      rgba(var(--quality-rgb), 0.62) 254deg,
      transparent 260deg,
      transparent 360deg
    );
  -webkit-mask: radial-gradient(circle, transparent 58%, #000 61%, #000 66%, transparent 70%);
  mask: radial-gradient(circle, transparent 58%, #000 61%, #000 66%, transparent 70%);
  filter: drop-shadow(0 0 8px rgba(var(--quality-rgb), 0.58));
  opacity: 0.64;
  animation: qualityOrbitSpark 5.2s linear infinite;
}

.quality-legendary .store-card-art::after,
.quality-godlike .store-card-art::after,
.quality-core .store-card-art::after,
.store-quality-legendary .store-detail-visual::after,
.store-quality-godlike .store-detail-visual::after,
.store-quality-core .store-detail-visual::after {
  animation-duration: 3.8s;
  opacity: 0.82;
}

.inventory-item-card.quality-refined::before,
.inventory-item-card.quality-advanced::before,
.inventory-item-card.quality-elite::before,
.inventory-item-card.quality-legendary::before,
.inventory-item-card.quality-godlike::before,
.inventory-item-card.quality-core::before,
.inventory-drawer-card.quality-refined::before,
.inventory-drawer-card.quality-advanced::before,
.inventory-drawer-card.quality-elite::before,
.inventory-drawer-card.quality-legendary::before,
.inventory-drawer-card.quality-godlike::before,
.inventory-drawer-card.quality-core::before,
.equipped-orbit-slot.quality-refined::before,
.equipped-orbit-slot.quality-advanced::before,
.equipped-orbit-slot.quality-elite::before,
.equipped-orbit-slot.quality-legendary::before,
.equipped-orbit-slot.quality-godlike::before,
.equipped-orbit-slot.quality-core::before,
.inventory-icon-card.quality-refined::before,
.inventory-icon-card.quality-advanced::before,
.inventory-icon-card.quality-elite::before,
.inventory-icon-card.quality-legendary::before,
.inventory-icon-card.quality-godlike::before,
.inventory-icon-card.quality-core::before,
.equipment-slot.quality-refined::before,
.equipment-slot.quality-advanced::before,
.equipment-slot.quality-elite::before,
.equipment-slot.quality-legendary::before,
.equipment-slot.quality-godlike::before,
.equipment-slot.quality-core::before {
  content: "";
  position: absolute;
  inset: -30%;
  pointer-events: none;
  background:
    linear-gradient(118deg, transparent 39%, rgba(var(--quality-rgb), 0.42) 40%, transparent 42%),
    linear-gradient(298deg, transparent 55%, rgba(var(--quality-rgb), 0.28) 56%, transparent 58%);
  opacity: 0;
  transform: translateX(-28%) rotate(0.001deg);
  animation: qualityBoltSweep 6.4s ease-in-out infinite;
}

.quality-advanced::before { animation-delay: 0.7s; }
.quality-elite::before { animation-delay: 1.1s; }
.quality-legendary::before { animation-delay: 1.7s; }
.quality-godlike::before,
.quality-core::before { animation-delay: 2.2s; }

@keyframes qualityOrbitSpark {
  0% { transform: rotate(0deg) scale(0.96); }
  50% { transform: rotate(180deg) scale(1.04); }
  100% { transform: rotate(360deg) scale(0.96); }
}

@keyframes qualityBoltSweep {
  0%, 70%, 100% {
    opacity: 0;
    transform: translateX(-32%) rotate(0.001deg);
  }

  76% {
    opacity: 0.55;
  }

  82% {
    opacity: 0.08;
    transform: translateX(36%) rotate(0.001deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .store-card-art.quality-refined::after,
  .store-card-art.quality-advanced::after,
  .store-card-art.quality-elite::after,
  .store-card-art.quality-legendary::after,
  .store-card-art.quality-godlike::after,
  .store-card-art.quality-core::after,
  .store-catalog-card .store-card-art::after,
  .store-detail-visual::after,
  .inventory-item-card::before,
  .inventory-drawer-card::before,
  .equipped-orbit-slot::before,
  .inventory-icon-card::before,
  .equipment-slot::before {
    animation: none !important;
  }
}

/* ===== Forge station screen ===== */
.quality-standard {
  --quality-rgb: 127, 214, 255;
  --quality-accent: #7fd6ff;
}

.upgrade-forge-screen {
  width: 100%;
  max-width: 1180px;
  height: 665px;
  max-height: 665px;
  min-height: 0;
  display: none;
  flex-direction: column;
  padding: 16px 20px;
  border: 1px solid rgba(90, 188, 255, 0.52);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(6, 19, 34, 0.94), rgba(1, 8, 17, 0.97)),
    radial-gradient(circle at 50% 8%, rgba(57, 158, 255, 0.17), transparent 36%);
  box-shadow: inset 0 0 46px rgba(87, 189, 255, 0.08), 0 0 42px rgba(0, 0, 0, 0.38);
  overflow: hidden;
}

.upgrade-forge-screen.active {
  display: flex;
}

.forge-topbar {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  margin-bottom: 12px;
  flex: 0 0 auto;
}

.forge-topbar p,
.forge-panel .modern-store-panel-header span,
.forge-inventory-head span {
  color: #7edfff;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 0.14em;
}

.forge-topbar h2 {
  color: #f8fbff;
  font-size: clamp(1.85rem, 3.1vw, 3.1rem);
  line-height: 0.95;
  margin: 3px 0 3px;
  letter-spacing: 0.04em;
}

.forge-topbar span {
  color: rgba(220, 239, 255, 0.78);
  font-weight: 800;
}

.forge-top-stats {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.forge-top-chip {
  min-width: 136px;
  min-height: 50px;
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 10px;
  align-items: center;
  padding: 8px 12px;
  border: 1px solid rgba(90, 188, 255, 0.36);
  border-radius: 12px;
  background: rgba(3, 14, 27, 0.86);
}

.forge-top-chip span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  grid-row: span 2;
  border-radius: 50%;
  color: #7edfff;
  border: 1px solid rgba(126, 223, 255, 0.5);
  box-shadow: inset 0 0 16px rgba(126, 223, 255, 0.12), 0 0 14px rgba(126, 223, 255, 0.14);
}

.forge-top-chip.core-chip span {
  color: #cda4ff;
  border-color: rgba(205, 164, 255, 0.65);
  box-shadow: inset 0 0 16px rgba(205, 164, 255, 0.16), 0 0 16px rgba(205, 164, 255, 0.18);
}

.forge-top-chip strong {
  color: #8fe8ff;
  font-size: 1.05rem;
  line-height: 1;
}

.forge-top-chip small {
  color: rgba(220, 235, 247, 0.64);
  text-transform: uppercase;
  font-size: 0.65rem;
  font-weight: 900;
}

.upgrade-forge-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.82fr) minmax(410px, 1.35fr) minmax(285px, 0.88fr);
  gap: 12px;
  flex: 1 1 auto;
  min-height: 0;
}

.forge-panel {
  min-height: 0;
  border: 1px solid rgba(90, 188, 255, 0.34);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(4, 17, 31, 0.88), rgba(1, 8, 16, 0.94)),
    radial-gradient(circle at 50% 0%, rgba(84, 182, 255, 0.08), transparent 46%);
  box-shadow: inset 0 0 24px rgba(87, 189, 255, 0.055);
  overflow: hidden;
}

.forge-selected-panel,
.forge-materials-panel {
  padding: 12px;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: auto;
}

.forge-selected-card,
.forge-drop-slot.empty {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 10px;
  min-height: 0;
  padding: 10px;
  border: 1px solid rgba(var(--quality-rgb, 127, 214, 255), 0.42);
  border-radius: 12px;
  background:
    radial-gradient(circle at 28% 40%, rgba(var(--quality-rgb, 127, 214, 255), 0.22), transparent 46%),
    rgba(1, 10, 20, 0.74);
}

.forge-drop-slot {
  position: relative;
}

.forge-drop-slot::after {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px dashed rgba(126, 223, 255, 0);
  border-radius: inherit;
  pointer-events: none;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.forge-drop-slot:hover::after {
  border-color: rgba(126, 223, 255, 0.34);
  box-shadow: inset 0 0 18px rgba(126, 223, 255, 0.07);
}

.forge-drop-slot.empty {
  width: 100%;
  grid-template-columns: 1fr;
  min-height: 190px;
  place-items: center;
  text-align: center;
  color: #f7fbff;
}

.forge-drop-slot.empty span {
  color: #7edfff;
  font-size: 0.75rem;
  font-weight: 1000;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.forge-drop-slot.empty strong {
  max-width: 220px;
}

.forge-selected-art {
  display: grid;
  place-items: center;
  min-height: 118px;
}

.forge-selected-art img,
.forge-chamber img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 0 18px rgba(var(--quality-rgb, 127, 214, 255), 0.45));
}

.forge-selected-info h3 {
  color: #f8fbff;
  margin: 7px 0 5px;
  font-size: 1rem;
}

.forge-selected-info p {
  color: rgba(220, 236, 250, 0.78);
  font-size: 0.75rem;
  line-height: 1.3;
  max-height: 3.9em;
  overflow: hidden;
}

.forge-item-badges {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.forge-item-badges span,
.forge-quality-pill {
  width: fit-content;
  padding: 5px 8px;
  border: 1px solid rgba(126, 223, 255, 0.34);
  border-radius: 999px;
  color: #bfeeff;
  background: rgba(4, 18, 32, 0.76);
  font-size: 0.68rem;
  font-weight: 900;
}

.forge-quality-pill {
  color: var(--quality-accent, #7fd6ff);
  border-color: rgba(var(--quality-rgb, 127, 214, 255), 0.52);
}

.forge-core-stats {
  display: grid;
  gap: 4px;
  margin-top: 8px;
}

.forge-core-stats div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(126, 223, 255, 0.12);
}

.forge-core-stats span {
  color: rgba(190, 220, 238, 0.72);
  font-size: 0.78rem;
}

.forge-core-stats strong {
  color: #f7fbff;
  font-size: 0.78rem;
  text-align: right;
}

.forge-change-item-btn {
  width: 100%;
  min-height: 34px;
  margin-top: 8px;
  font-size: 0.72rem;
}

.forge-inventory-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 10px 0 8px;
  border-top: 1px solid rgba(126, 223, 255, 0.16);
  padding-top: 12px;
}

.forge-inventory-head button {
  width: auto;
  padding: 8px 12px;
  font-size: 0.72rem;
}

.forge-inventory-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  flex: 0 0 auto;
  min-height: 0;
  max-height: 330px;
  overflow: auto;
  padding-right: 4px;
}

.forge-inventory-card {
  min-height: 72px;
  padding: 8px;
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 8px;
  align-items: center;
  text-align: left;
  border: 1px solid rgba(var(--quality-rgb, 127, 214, 255), 0.38);
  border-radius: 9px;
  background: rgba(1, 11, 22, 0.76);
}

.forge-inventory-card.selected {
  border-color: rgba(var(--quality-rgb, 127, 214, 255), 0.95);
  box-shadow: 0 0 18px rgba(var(--quality-rgb, 127, 214, 255), 0.16);
}

.forge-inventory-card img {
  width: 46px;
  height: 46px;
  object-fit: contain;
  grid-row: span 2;
}

.forge-inventory-card strong,
.forge-inventory-card span {
  min-width: 0;
}

.forge-inventory-card strong {
  color: #f7fbff;
  font-size: 0.75rem;
}

.forge-inventory-card span {
  color: var(--quality-accent, #7fd6ff);
  font-size: 0.68rem;
  font-weight: 900;
}

.forge-chamber-panel {
  padding: 12px;
  min-height: 0;
  overflow: hidden;
}

.forge-chamber-title {
  display: flex;
  justify-content: space-between;
  color: #7edfff;
  text-transform: uppercase;
  font-weight: 1000;
  letter-spacing: 0.11em;
}

.forge-chamber-title small {
  color: rgba(220, 238, 250, 0.68);
  letter-spacing: 0;
  text-transform: none;
}

.forge-chamber {
  --forge-before: #7fd6ff;
  --forge-after: #7fd6ff;
  position: relative;
  height: clamp(220px, 35vh, 300px);
  margin-top: 8px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(126, 223, 255, 0.22);
  border-radius: 12px;
  background:
    radial-gradient(circle at 50% 46%, rgba(126, 223, 255, 0.14), transparent 28%),
    radial-gradient(circle at 50% 10%, rgba(126, 223, 255, 0.24), transparent 20%),
    linear-gradient(180deg, rgba(2, 13, 26, 0.5), rgba(0, 4, 12, 0.95));
}

.forge-chamber::before,
.forge-chamber::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.forge-chamber::before {
  inset: 10% 18%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.16), transparent 34%);
  filter: blur(12px);
}

.forge-chamber::after {
  left: 18%;
  right: 18%;
  bottom: 12%;
  height: 18px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(126, 223, 255, 0.56), transparent 70%);
}

.forge-ring {
  position: absolute;
  left: 50%;
  width: 72%;
  height: 72px;
  transform: translateX(-50%);
  border: 3px solid rgba(126, 223, 255, 0.32);
  border-radius: 50%;
  box-shadow: 0 0 32px rgba(126, 223, 255, 0.16), inset 0 0 18px rgba(126, 223, 255, 0.12);
}

.ring-one { top: 10%; }
.ring-two { bottom: 10%; }

.forge-beam {
  position: absolute;
  top: 14%;
  bottom: 11%;
  width: 8px;
  border-radius: 999px;
  background: linear-gradient(180deg, transparent, #ffffff, var(--forge-after), #ffffff, transparent);
  box-shadow: 0 0 24px var(--forge-after), 0 0 58px rgba(126, 223, 255, 0.35);
  opacity: 0.34;
}

.forge-scanline {
  position: absolute;
  inset: 12% 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.1) 48%, var(--forge-after) 50%, rgba(255,255,255,0.1) 52%, transparent 100%);
  opacity: 0;
}

.forge-particles {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 36%, var(--forge-before) 0 2px, transparent 3px),
    radial-gradient(circle at 76% 42%, var(--forge-after) 0 2px, transparent 3px),
    radial-gradient(circle at 34% 72%, #ffffff 0 1px, transparent 2px),
    radial-gradient(circle at 66% 66%, var(--forge-after) 0 1px, transparent 2px);
  opacity: 0.32;
  animation: forgeIdleParticles 4s linear infinite;
}

.forge-chamber img {
  position: relative;
  z-index: 2;
  width: min(58%, 420px);
  height: min(175px, 58%);
  transform: scale(1);
  transition: filter 260ms ease, transform 260ms ease;
}

.forge-chamber.forging .forge-scanline {
  opacity: 0.86;
  animation: forgeScanPass 2.1s ease-in-out;
}

.forge-chamber.forging .forge-beam {
  opacity: 0.9;
  animation: forgeBeamPulse 2.1s ease-in-out;
}

.forge-chamber.forging img {
  animation: forgeItemTransform 2.1s ease-in-out;
}

.forge-chamber.forge-complete img {
  filter: drop-shadow(0 0 28px var(--forge-after));
}

.forge-state-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 8px;
}

.forge-state-preview div,
.forge-summary-bar > div {
  padding: 8px 10px;
  border: 1px solid rgba(126, 223, 255, 0.18);
  border-radius: 8px;
  background: rgba(4, 17, 30, 0.78);
}

.forge-state-preview span,
.forge-summary-bar span {
  display: block;
  color: #7edfff;
  font-size: 0.68rem;
  text-transform: uppercase;
  font-weight: 1000;
  letter-spacing: 0.1em;
}

.forge-state-preview strong,
.forge-summary-bar strong {
  color: #f7fbff;
  font-size: 1.02rem;
}

.forge-state-preview em {
  color: #34e59a;
  margin: 0 8px;
  font-style: normal;
}

.forge-quality-ladder {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 4px;
  margin: 8px 0;
  padding: 9px;
  border: 1px solid rgba(126, 223, 255, 0.18);
  border-radius: 10px;
  background: rgba(2, 12, 23, 0.8);
}

.forge-tier,
.forge-core-separate {
  display: grid;
  justify-items: center;
  gap: 5px;
  color: var(--quality-accent, #7fd6ff);
  font-size: 0.62rem;
  font-weight: 900;
  text-align: center;
}

.forge-tier i,
.forge-core-separate i {
  width: 18px;
  height: 18px;
  border: 2px solid var(--quality-accent, #7fd6ff);
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(var(--quality-rgb, 127, 214, 255), 0.32);
}

.forge-tier.target i {
  background: var(--quality-accent, #7fd6ff);
}

.forge-core-separate {
  grid-column: 1 / -1;
  grid-template-columns: auto 1fr;
  justify-items: start;
  align-items: center;
  padding-top: 8px;
  border-top: 1px solid rgba(205, 164, 255, 0.22);
  color: #cda4ff;
}

.forge-mode-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.forge-mode-switch button {
  min-height: 52px;
  display: grid;
  justify-items: start;
  border-radius: 10px;
  text-align: left;
}

.forge-mode-switch button.active {
  border-color: rgba(126, 223, 255, 0.88);
  box-shadow: 0 0 20px rgba(126, 223, 255, 0.14);
}

.forge-mode-switch span {
  color: rgba(220, 238, 250, 0.72);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: none;
}

.forge-materials-list {
  display: grid;
  gap: 8px;
  flex: 0 0 auto;
}

.forge-material-empty {
  display: grid;
  gap: 5px;
  min-height: 92px;
  place-items: center;
  padding: 14px;
  text-align: center;
  border: 1px dashed rgba(126, 223, 255, 0.26);
  border-radius: 10px;
  background: rgba(2, 13, 25, 0.62);
}

.forge-material-empty span {
  color: #7edfff;
  font-size: 0.7rem;
  font-weight: 1000;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.forge-material-empty strong {
  color: rgba(235, 246, 255, 0.88);
  font-size: 0.86rem;
  line-height: 1.2;
}

.forge-material-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 9px;
  border: 1px solid rgba(126, 223, 255, 0.24);
  border-radius: 10px;
  background: rgba(2, 13, 25, 0.76);
}

.forge-material-card img,
.forge-core-card img {
  width: 44px;
  height: 44px;
  object-fit: contain;
}

.forge-material-card strong,
.forge-core-card strong {
  color: #f7fbff;
  display: block;
  line-height: 1.05;
}

.forge-material-card span,
.forge-core-card p {
  color: rgba(220, 238, 250, 0.7);
  font-size: 0.66rem;
  line-height: 1.22;
}

.forge-material-count {
  display: grid;
  gap: 5px;
  justify-items: end;
}

.forge-material-count small,
.forge-core-card small {
  color: rgba(220, 238, 250, 0.64);
  text-transform: uppercase;
  font-size: 0.62rem;
  font-weight: 1000;
}

.forge-material-count b,
.forge-core-card b {
  color: #82ffc6;
}

.forge-stepper {
  display: grid;
  grid-template-columns: 30px 58px 30px;
  gap: 4px;
}

.forge-stepper button,
.forge-stepper input {
  height: 30px;
  padding: 0;
  text-align: center;
  border-radius: 7px;
}

.forge-stepper input {
  color: #f7fbff;
  background: rgba(1, 8, 16, 0.86);
  border: 1px solid rgba(126, 223, 255, 0.24);
}

.forge-load-material-btn {
  min-height: 28px;
  padding: 0 8px;
  font-size: 0.66rem;
}

.forge-core-panel {
  margin-top: 8px;
  min-height: 0;
  overflow: auto;
}

.forge-core-card {
  padding: 10px;
  border: 1px solid rgba(205, 164, 255, 0.42);
  border-radius: 12px;
  background:
    radial-gradient(circle at 18% 40%, rgba(205, 164, 255, 0.18), transparent 42%),
    rgba(14, 7, 28, 0.78);
}

.forge-core-card.required {
  border-color: rgba(205, 164, 255, 0.62);
}

.forge-core-card.active {
  border-color: rgba(205, 164, 255, 0.92);
  box-shadow: 0 0 24px rgba(205, 164, 255, 0.16);
}

.forge-core-card-top {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.forge-core-card > button {
  width: 100%;
  margin-top: 10px;
}

.forge-summary-bar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 220px);
  gap: 8px;
  align-items: center;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(126, 223, 255, 0.28);
  border-radius: 12px;
  background: rgba(2, 12, 24, 0.86);
  flex: 0 0 auto;
}

.forge-inventory-picker {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: none;
  place-items: center;
  padding: 18px;
  background: rgba(0, 5, 13, 0.62);
  backdrop-filter: blur(7px);
}

.forge-inventory-picker.active {
  display: grid;
}

.forge-picker-panel {
  width: min(1040px, calc(100% - 24px));
  max-height: min(720px, calc(100dvh - 70px));
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(126, 223, 255, 0.54);
  border-radius: 14px;
  background:
    radial-gradient(circle at 50% 0%, rgba(126, 223, 255, 0.14), transparent 42%),
    rgba(2, 12, 25, 0.98);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.62), inset 0 0 28px rgba(126, 223, 255, 0.06);
}

.forge-picker-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.forge-picker-head span {
  display: block;
  color: #7edfff;
  font-size: 0.78rem;
  font-weight: 1000;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.forge-picker-head strong {
  display: block;
  color: #f7fbff;
  font-size: 1.45rem;
  margin-top: 2px;
}

.forge-picker-head button {
  width: auto;
  min-width: 96px;
}

.forge-picker-filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.forge-picker-filters button {
  width: auto;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid rgba(126, 223, 255, 0.24);
  background: rgba(4, 18, 32, 0.74);
  font-size: 0.75rem;
}

.forge-picker-filters button.active {
  border-color: rgba(126, 223, 255, 0.88);
  box-shadow: 0 0 16px rgba(126, 223, 255, 0.12);
}

.forge-picker-filters span {
  color: rgba(190, 226, 246, 0.7);
  margin-left: 4px;
}

.forge-picker-grid {
  min-height: 0;
  overflow: auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
  padding-right: 4px;
}

.forge-picker-card {
  min-height: 118px;
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 10px;
  text-align: left;
  border: 1px solid rgba(var(--quality-rgb, 127, 214, 255), 0.4);
  border-radius: 10px;
  background:
    radial-gradient(circle at 20% 38%, rgba(var(--quality-rgb, 127, 214, 255), 0.12), transparent 48%),
    rgba(2, 12, 24, 0.88);
}

.forge-picker-card.selected {
  border-color: rgba(var(--quality-rgb, 127, 214, 255), 0.95);
  box-shadow: 0 0 18px rgba(var(--quality-rgb, 127, 214, 255), 0.16);
}

.forge-picker-card img {
  width: 64px;
  height: 64px;
  object-fit: contain;
  filter: drop-shadow(0 0 12px rgba(var(--quality-rgb, 127, 214, 255), 0.32));
}

.forge-picker-card span,
.forge-picker-card small,
.forge-picker-card em {
  display: block;
  color: rgba(210, 232, 247, 0.72);
  font-size: 0.68rem;
  font-style: normal;
  line-height: 1.25;
}

.forge-picker-card strong {
  display: block;
  color: #f7fbff;
  margin: 3px 0;
  line-height: 1.08;
}

.forge-picker-card small {
  color: var(--quality-accent, #7fd6ff);
  font-weight: 900;
}

.forge-summary-bar small {
  display: block;
  color: rgba(220, 238, 250, 0.72);
  margin-top: 3px;
}

.forge-start-btn {
  min-height: 48px;
  color: #fff5cf;
  border-color: rgba(255, 214, 92, 0.8);
  background:
    linear-gradient(135deg, rgba(99, 62, 4, 0.96), rgba(181, 119, 18, 0.92)),
    radial-gradient(circle at 18% 0%, rgba(255,255,255,0.18), transparent 38%);
  box-shadow: 0 0 26px rgba(255, 214, 92, 0.18);
}

@keyframes forgeIdleParticles {
  0% { transform: translateY(14px); opacity: 0.18; }
  50% { opacity: 0.42; }
  100% { transform: translateY(-18px); opacity: 0.18; }
}

@keyframes forgeScanPass {
  0% { transform: translateX(-52%); }
  48% { transform: translateX(0%); }
  100% { transform: translateX(52%); opacity: 0; }
}

@keyframes forgeBeamPulse {
  0%, 100% { transform: scaleY(0.85); opacity: 0.28; }
  50% { transform: scaleY(1.08); opacity: 1; }
}

@keyframes forgeItemTransform {
  0% { filter: drop-shadow(0 0 14px var(--forge-before)); transform: scale(1); }
  45% { filter: drop-shadow(0 0 36px #ffffff) brightness(1.35); transform: scale(1.08); }
  100% { filter: drop-shadow(0 0 30px var(--forge-after)); transform: scale(1.02); }
}

@media (max-width: 1180px) {
  .upgrade-forge-layout {
    grid-template-columns: 1fr;
  }

  .forge-panel {
    min-height: 0;
  }

  .forge-summary-bar {
    grid-template-columns: minmax(220px, 1fr) minmax(180px, 220px);
  }
}

@media (max-width: 720px) {
  .upgrade-forge-screen {
    width: calc(100vw - 16px);
    padding: 14px;
  }

  .forge-topbar,
  .forge-top-stats,
  .forge-selected-card,
  .forge-material-card,
  .forge-core-card-top,
  .forge-state-preview,
  .forge-mode-switch,
  .forge-summary-bar {
    grid-template-columns: 1fr;
    display: grid;
  }

  .forge-top-stats {
    justify-content: stretch;
  }

  .forge-chamber {
    height: 300px;
  }

  .forge-quality-ladder {
    grid-template-columns: repeat(2, 1fr);
  }

  .forge-inventory-strip {
    grid-template-columns: 1fr;
  }
}

@media (max-height: 820px) {
  .upgrade-forge-screen {
    padding: 12px 16px;
  }

  .forge-topbar {
    margin-bottom: 8px;
  }

  .forge-topbar h2 {
    font-size: clamp(1.65rem, 2.7vw, 2.55rem);
  }

  .forge-topbar p {
    font-size: 0.78rem;
  }

  .forge-topbar span {
    font-size: 0.8rem;
  }

  .forge-top-chip {
    min-height: 42px;
    min-width: 118px;
    padding: 6px 10px;
  }

  .forge-top-chip span {
    width: 30px;
    height: 30px;
  }

  .forge-panel,
  .forge-selected-panel,
  .forge-materials-panel,
  .forge-chamber-panel {
    border-radius: 12px;
  }

  .forge-selected-panel,
  .forge-materials-panel,
  .forge-chamber-panel {
    padding: 10px;
  }

  .forge-selected-card {
    grid-template-columns: 82px 1fr;
    padding: 8px;
  }

  .forge-selected-art {
    min-height: 92px;
  }

  .forge-inventory-head {
    margin: 8px 0 6px;
    padding-top: 9px;
  }

  .forge-inventory-strip {
    max-height: 230px;
  }

  .forge-inventory-card {
    min-height: 62px;
  }

  .forge-chamber {
    height: clamp(176px, 30vh, 245px);
  }

  .forge-state-preview {
    margin-top: 6px;
  }

  .forge-state-preview div,
  .forge-summary-bar > div {
    padding: 6px 8px;
  }

  .forge-quality-ladder {
    margin: 6px 0;
    padding: 7px;
  }

  .forge-tier,
  .forge-core-separate {
    gap: 3px;
    font-size: 0.58rem;
  }

  .forge-mode-switch button {
    min-height: 45px;
  }

  .forge-material-card {
    grid-template-columns: 42px minmax(0, 1fr) auto;
    padding: 7px;
  }

  .forge-material-card img,
  .forge-core-card img {
    width: 38px;
    height: 38px;
  }

  .forge-material-card span,
  .forge-core-card p {
    font-size: 0.66rem;
  }

  .forge-core-card {
    padding: 8px;
  }

  .forge-summary-bar {
    margin-top: 8px;
    padding: 8px;
  }

  .forge-start-btn {
    min-height: 42px;
  }

  .forge-picker-panel {
    max-height: calc(100dvh - 42px);
  }
}

/* ===== Store catalogue containment pass ===== */
.store-catalog-card {
  box-sizing: border-box;
  min-height: 144px;
  max-height: 144px;
  display: grid;
  grid-template-rows: 68px minmax(0, auto) auto auto;
  align-content: start;
  overflow: hidden;
  padding: 9px 8px 8px;
}

.modern-store-catalog-panel .store-card-art {
  width: 70px;
  height: 64px;
  margin: 0 auto 5px;
}

.modern-store-catalog-panel .store-card-art img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.store-card-name,
.store-catalog-card .store-card-sub,
.store-card-stock,
.store-card-price {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-card-name {
  align-self: end;
  font-size: 0.78rem;
  line-height: 1.05;
}

.store-catalog-card .store-card-sub,
.store-card-stock {
  font-size: 0.64rem;
  line-height: 1.08;
}

.store-card-price {
  font-size: 0.76rem;
  line-height: 1.1;
}

.daily-stock-card .store-card-art,
.store-catalog-card.quality-core .store-card-art {
  width: 84px;
  height: 70px;
  margin-top: -3px;
}

.daily-stock-card .store-card-art img,
.store-catalog-card.quality-core .store-card-art img {
  transform: scale(1.16);
}

.daily-stock-card .store-card-sub,
.store-catalog-card.quality-core .store-card-sub,
.daily-stock-card .store-card-stock {
  letter-spacing: 0.08em;
  white-space: normal;
}

.modern-store-catalog-panel {
  min-height: 0;
}

.store-catalog-grid {
  align-content: start;
  padding: 0 10px 120px 0;
  scroll-padding-bottom: 120px;
}

.store-catalog-card {
  justify-items: center;
  text-align: center;
  align-content: start;
}

.store-catalog-card .store-card-art,
.store-catalog-card .store-card-name,
.store-catalog-card .store-card-sub,
.store-catalog-card .store-card-stock,
.store-catalog-card .store-card-price {
  justify-self: center;
  text-align: center;
}

.store-card-name {
  width: 100%;
}

.store-catalog-card .store-card-sub,
.store-card-stock,
.store-card-price {
  width: 100%;
  display: block;
}

.store-card-stock {
  color: rgba(190, 223, 244, 0.76);
  font-weight: 900;
}

.daily-stock-card .store-card-stock,
.store-catalog-card.quality-core .store-card-stock {
  color: #76ffc6;
}

/* ===== Station Store refinement pass ===== */
.modern-store-detail-panel {
  overflow: hidden;
}

.modern-store-detail-panel .store-detail-panel-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.modern-store-detail-panel .store-detail-shell {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.store-detail-content {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 0 4px 12px 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.store-detail-content::-webkit-scrollbar {
  width: 8px;
}

.store-detail-content::-webkit-scrollbar-track {
  background: rgba(5, 14, 26, 0.78);
  border-radius: 999px;
}

.store-detail-content::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(98, 203, 255, 0.72), rgba(46, 107, 190, 0.62));
  border-radius: 999px;
}

.store-buy-footer {
  flex-shrink: 0;
  margin-top: 0;
  padding-top: 10px;
  border-top: 1px solid rgba(91, 187, 255, 0.18);
  background: linear-gradient(180deg, rgba(4, 10, 20, 0), rgba(4, 10, 20, 0.64));
}

.simplified-store-actions.store-buy-footer {
  margin-top: 0;
}

.store-catalog-card {
  min-height: 158px;
  max-height: 158px;
  grid-template-rows: 72px minmax(18px, auto) minmax(14px, auto) minmax(14px, auto) minmax(16px, auto);
  gap: 4px;
  padding-top: 10px;
}

.modern-store-catalog-panel .store-card-art {
  align-self: start;
  margin-top: 8px;
}

.store-card-status {
  max-width: calc(100% - 14px);
  min-width: 0;
  right: 7px;
  left: auto;
  padding: 3px 7px;
}

.store-catalog-card .store-card-sub {
  color: #a8d8ff;
  font-weight: 900;
}

.store-card-price {
  color: #ffffff;
  text-transform: uppercase;
}

.store-core-action {
  border-color: rgba(116, 255, 198, 0.5);
  box-shadow: 0 0 16px rgba(74, 255, 190, 0.14);
}

/* ===== Station Store viewport and card centering fix ===== */
#storeScreen.hangar-prestige.active {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 0;
}

#storeScreen.hangar-prestige {
  background:
    linear-gradient(180deg, rgba(0, 6, 16, 0.34), rgba(0, 6, 16, 0.64)),
    radial-gradient(circle at 45% 38%, rgba(34, 154, 255, 0.08), transparent 42%),
    url("assets/backgrounds/station-store-background.png") center / cover no-repeat;
}

#storeScreen .store-header-row {
  margin-bottom: 8px;
}

#storeScreen .modern-store-topbar {
  margin: 0 0 10px;
}

#storeScreen .modern-store-layout {
  height: auto;
  min-height: 0;
  overflow: hidden;
}

#storeScreen .modern-store-catalog-panel,
#storeScreen .modern-store-detail-panel {
  min-height: 0;
  overflow: hidden;
}

#storeScreen .modern-store-detail-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

#storeScreen .modern-store-detail-panel .modern-store-panel-header {
  margin-bottom: 10px;
}

#storeScreen .store-detail-panel-body,
#storeScreen .store-detail-shell {
  min-height: 0;
  height: 100%;
}

#storeScreen .store-detail-content {
  overflow: hidden;
}

#storeScreen .simplified-store-detail .store-detail-visual {
  min-height: 108px;
  max-height: 108px;
}

#storeScreen .store-buy-footer {
  padding-top: 8px;
}

#storeScreen .simplified-store-actions button {
  min-height: 44px;
}

#storeScreen .store-catalog-grid {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
  padding: 0 10px 20px 0;
  scroll-padding-bottom: 20px;
}

#storeScreen .store-catalog-card {
  height: 158px;
  min-height: 158px;
  max-height: 158px;
  display: grid;
  grid-template-rows: 14px 46px 26px 13px 13px 14px;
  gap: 2px;
  align-items: center;
  justify-items: center;
  align-content: start;
  justify-content: stretch;
  padding: 5px 8px 6px;
  text-align: center;
}

#storeScreen .store-card-status {
  position: static;
  grid-row: 1;
  justify-self: end;
  align-self: center;
  max-width: 76px;
  min-height: 13px;
  padding: 2px 6px;
  font-size: 0.54rem;
  line-height: 1;
}

#storeScreen .store-catalog-card:not(:has(.store-card-status))::before {
  content: "";
  grid-row: 1;
  display: block;
  width: 1px;
  height: 13px;
}

#storeScreen .modern-store-catalog-panel .store-card-art {
  width: 70px;
  height: 46px;
  margin: 0 auto;
  grid-row: 2;
  align-self: center;
  justify-self: center;
  display: grid;
  place-items: center;
}

#storeScreen .modern-store-catalog-panel .store-card-art img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  object-position: center;
}

#storeScreen .daily-stock-card .store-card-art,
#storeScreen .store-catalog-card.quality-core .store-card-art {
  width: 70px;
  height: 46px;
  margin: 0 auto;
}

#storeScreen .daily-stock-card .store-card-art img,
#storeScreen .store-catalog-card.quality-core .store-card-art img {
  transform: none;
}

#storeScreen .store-card-name,
#storeScreen .store-catalog-card .store-card-sub,
#storeScreen .store-card-stock,
#storeScreen .store-card-price {
  align-self: center;
  justify-self: center;
  width: 100%;
  text-align: center;
  white-space: normal;
  overflow: hidden;
  text-overflow: clip;
}

#storeScreen .store-card-name {
  display: grid;
  place-items: center;
  min-height: 0;
  font-size: 0.74rem;
  line-height: 1.04;
  grid-row: 3;
}

#storeScreen .store-catalog-card .store-card-sub,
#storeScreen .store-card-stock {
  font-size: 0.58rem;
  line-height: 1;
}

#storeScreen .store-catalog-card .store-card-sub {
  grid-row: 4;
}

#storeScreen .store-card-stock {
  grid-row: 5;
}

#storeScreen .store-card-price {
  align-self: end;
  font-size: 0.68rem;
  line-height: 1;
  grid-row: 6;
}

/* ===== Planet Landing Hub PNG pass ===== */
.hub-screen {
  width: min(calc(100vw - 24px), calc((100dvh - 24px) * 16 / 9), 1180px);
  max-width: 1180px;
  height: min(calc((100vw - 24px) * 9 / 16), calc(100dvh - 24px), 665px);
  max-height: 665px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
  background: transparent;
}

.hub-screen.active {
  display: grid;
  place-items: center;
}

.hub-overlay {
  position: relative;
  inset: auto;
  width: 100%;
  height: 100%;
  padding: 0;
  display: block;
  overflow: hidden;
  background: url("assets/hub/core-planet-main-screen.png") center / contain no-repeat;
}

.hub-header {
  position: absolute;
  top: 6.5%;
  left: 50%;
  width: 48%;
  transform: translateX(-50%);
  text-align: center;
  pointer-events: none;
}

.hub-header p {
  margin: 0 0 8px;
  color: #39d8ff;
  font-size: 15px;
  letter-spacing: 8px;
  line-height: 1;
  text-shadow: 0 0 12px rgba(0, 198, 255, 0.7);
}

.hub-header h2 {
  margin: 0;
  font-size: 44px;
  line-height: 0.95;
  letter-spacing: 8px;
  color: #f5f9ff;
  text-shadow: 0 0 18px rgba(95, 210, 255, 0.55), 0 4px 18px rgba(0, 0, 0, 0.9);
}

.hub-image-button {
  position: absolute;
  width: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #f3f8ff;
  overflow: visible;
}

.hub-logout-button,
.hub-launch-btn,
.hub-actions .hub-action-button {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.hub-image-button img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  transition: filter 140ms ease, transform 140ms ease;
}

.hub-image-button > span:not(.hub-action-badge) {
  position: absolute;
  z-index: 1;
  left: 50%;
  transform: translateX(-50%);
  width: 84%;
  text-align: center;
  text-transform: uppercase;
  color: #f7fbff;
  font-weight: 900;
  letter-spacing: 1.4px;
  line-height: 1.08;
  text-shadow: 0 0 14px rgba(80, 210, 255, 0.78), 0 2px 8px rgba(0, 0, 0, 0.9);
  pointer-events: none;
}

.hub-image-button:hover,
.hub-image-button:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
}

.hub-image-button:hover img,
.hub-image-button:focus-visible img {
  filter: brightness(1.12) saturate(1.08) drop-shadow(0 0 10px rgba(0, 198, 255, 0.42));
}

.hub-logout-button {
  position: absolute;
  top: 4.15%;
  right: 1.75%;
  width: 18%;
  height: 13.2%;
  min-width: 0;
  min-height: 0;
  padding: 0 !important;
  border-radius: 0;
}

.hub-logout-button:hover,
.hub-logout-button:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
}

.hub-launch-btn {
  position: absolute;
  top: 36.6%;
  left: 50%;
  width: 48%;
  height: 16.8%;
  min-width: 0;
  max-width: none;
  min-height: 0;
  padding: 0 !important;
  margin: 0;
  border-radius: 0;
  transform: translateX(-50%);
}

.hub-launch-btn:hover,
.hub-launch-btn:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
  transform: translateX(-50%) translateY(-0.7%);
}

.hub-actions {
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: 6.8%;
  height: 9.4%;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 3.4%;
  margin: 0;
}

.hub-actions .hub-action-button {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5%;
  font-size: inherit;
  border: 1px solid rgba(94, 221, 255, 0.24) !important;
  border-radius: 6px;
  background:
    linear-gradient(180deg, rgba(4, 24, 42, 0.16), rgba(1, 8, 18, 0.10)) !important;
  box-shadow:
    inset 0 0 12px rgba(0, 174, 255, 0.035),
    0 0 10px rgba(0, 185, 255, 0.045) !important;
  transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease, filter 140ms ease, transform 140ms ease;
}

.hub-actions .hub-action-button::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 5px;
  border-radius: 4px;
  background:
    linear-gradient(90deg, rgba(113, 234, 255, 0.36) 0 10px, transparent 10px calc(100% - 10px), rgba(113, 234, 255, 0.36) calc(100% - 10px)),
    linear-gradient(180deg, rgba(113, 234, 255, 0.24) 0 1px, transparent 1px calc(100% - 1px), rgba(113, 234, 255, 0.18) calc(100% - 1px));
  border: 1px solid rgba(95, 218, 255, 0);
  box-shadow: 0 0 0 rgba(0, 198, 255, 0);
  opacity: 0.38;
  pointer-events: none;
  transition: opacity 140ms ease, border-color 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

.hub-actions .hub-action-button::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 22%;
  right: 22%;
  bottom: 7px;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(113, 242, 255, 0.95), transparent);
  box-shadow: 0 0 10px rgba(0, 211, 255, 0.48);
  opacity: 0;
  pointer-events: none;
  transition: opacity 140ms ease, box-shadow 140ms ease;
}

.hub-actions .hub-action-button img {
  position: relative;
  z-index: 2;
  inset: auto;
  width: 34%;
  height: 48%;
  transform: none;
  object-fit: contain;
  filter: brightness(1.08) saturate(1.06) drop-shadow(0 0 8px rgba(0, 198, 255, 0.28));
}

.hub-actions .hub-action-button:hover,
.hub-actions .hub-action-button:focus-visible {
  border-color: rgba(139, 241, 255, 0.72) !important;
  background:
    linear-gradient(180deg, rgba(4, 24, 42, 0.16), rgba(1, 8, 18, 0.10)) !important;
  box-shadow:
    inset 0 0 12px rgba(0, 174, 255, 0.035),
    0 0 10px rgba(0, 185, 255, 0.045) !important;
}

.hub-actions .hub-action-button.reward-ready::before {
  border-color: rgba(173, 250, 255, 0.28);
  background:
    radial-gradient(circle at 50% 34%, rgba(129, 242, 255, 0.14), rgba(129, 242, 255, 0) 64%),
    linear-gradient(90deg, rgba(136, 242, 255, 0.38) 0 16px, transparent 16px calc(100% - 16px), rgba(136, 242, 255, 0.38) calc(100% - 16px));
  box-shadow:
    inset 0 0 16px rgba(0, 198, 255, 0.08),
    0 0 16px rgba(0, 198, 255, 0.14);
  opacity: 0.78;
}

.hub-actions .hub-action-button.reward-ready::after {
  opacity: 1;
}

.hub-actions .hub-action-button:hover img,
.hub-actions .hub-action-button:focus-visible img {
  filter: brightness(1.08) saturate(1.06) drop-shadow(0 0 8px rgba(0, 198, 255, 0.28));
  transform: none;
}

.hub-actions .hub-action-button > span:not(.hub-action-badge) {
  position: relative;
  z-index: 3;
  left: auto;
  bottom: auto;
  transform: none;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.05em;
  width: 100%;
  font-size: 10px;
  letter-spacing: 0.9px;
  max-width: 100%;
}

.hub-action-badge {
  z-index: 2;
  top: 10px !important;
  right: 50% !important;
  transform: translateX(50%);
}

.hub-actions button.reward-ready {
  padding-top: 0 !important;
}

@media (max-width: 900px), (max-height: 620px) {
  .hub-header p {
    margin-bottom: 5px;
    font-size: 11px;
    letter-spacing: 5px;
  }

  .hub-header h2 {
    font-size: 28px;
    letter-spacing: 5px;
  }

  .hub-actions .hub-action-button img {
    width: 32%;
    height: 45%;
  }

.hub-actions .hub-action-button > span:not(.hub-action-badge) {
    min-height: 2.3em;
    font-size: 8.5px;
    letter-spacing: 0.6px;
  }
}

/* ===== Planet Home v2 unified dock ===== */
.hub-screen.planet-home-screen {
  width: min(calc(100vw - 24px), calc((100dvh - 24px) * 16 / 9), 1180px);
  max-width: 1180px;
  height: min(calc((100vw - 24px) * 9 / 16), calc(100dvh - 24px), 665px);
  max-height: 665px;
  min-height: 0;
  position: relative;
  overflow: hidden;
  border: 1px solid #2c4f75;
  border-radius: 18px;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.75);
  background:
    linear-gradient(
      180deg,
      rgba(2, 8, 18, 0.1) 0%,
      rgba(2, 8, 18, 0.05) 42%,
      rgba(2, 8, 18, 0.72) 100%
    ),
    url("assets/backgrounds/planet-background.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #f4fbff;
}

.hub-screen.planet-home-screen.active {
  display: block;
}

.planet-home-screen .hub-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  overflow: hidden;
  padding: 0;
  background:
    radial-gradient(circle at 50% 38%, rgba(0, 184, 255, 0.12), transparent 32%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.25), transparent 30%, transparent 70%, rgba(0, 0, 0, 0.25));
}

.planet-home-screen .hub-header,
.planet-home-screen .hub-logout-button,
.planet-home-screen .hub-launch-btn,
.planet-home-screen .hub-actions {
  position: absolute;
  z-index: 2;
}

.planet-home-screen .hub-header {
  top: 3.5%;
  left: 50%;
  width: min(540px, 52%);
  min-height: 92px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  clip-path: polygon(8% 0, 92% 0, 100% 38%, 90% 100%, 10% 100%, 0 38%);
  background: linear-gradient(180deg, rgba(3, 18, 34, 0.78), rgba(2, 8, 18, 0.56));
  border: 1px solid rgba(0, 195, 255, 0.5);
  box-shadow:
    0 0 22px rgba(0, 195, 255, 0.18),
    inset 0 0 22px rgba(0, 195, 255, 0.08);
  pointer-events: none;
  text-transform: uppercase;
}

.planet-home-screen .hub-header p {
  margin: 0 0 0.25rem;
  color: #18d9ff;
  font-size: clamp(0.7rem, 1vw, 0.95rem);
  font-weight: 800;
  letter-spacing: 0.55em;
  line-height: 1;
  text-shadow: 0 0 12px rgba(0, 198, 255, 0.7);
}

.planet-home-screen .hub-header h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(2.2rem, 5vw, 4.3rem);
  line-height: 0.95;
  letter-spacing: 0.22em;
  text-shadow:
    0 0 12px rgba(0, 195, 255, 0.75),
    0 0 28px rgba(0, 90, 255, 0.38);
}

.planet-home-screen .hub-logout-button {
  top: 8%;
  right: 8%;
  width: auto;
  min-width: 104px;
  height: 40px;
  padding: 0 20px !important;
  border: 1px solid rgba(70, 215, 255, 0.75) !important;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(7, 35, 62, 0.9), rgba(3, 14, 28, 0.82)) !important;
  color: #fff;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  box-shadow:
    0 0 14px rgba(0, 200, 255, 0.28),
    inset 0 0 14px rgba(0, 200, 255, 0.12) !important;
  transition: border-color 160ms ease, filter 160ms ease, box-shadow 160ms ease;
}

.planet-home-screen .hub-logout-button:hover,
.planet-home-screen .hub-logout-button:focus-visible {
  background: linear-gradient(180deg, rgba(9, 47, 82, 0.92), rgba(4, 18, 34, 0.86)) !important;
  border-color: rgba(145, 235, 255, 0.95) !important;
  filter: brightness(1.12);
}

.planet-home-screen .hub-launch-btn {
  top: 44%;
  left: 50%;
  width: min(340px, 31%);
  min-width: 270px;
  height: 70px;
  padding: 0 28px !important;
  margin: 0;
  transform: translate(-50%, -50%);
  isolation: isolate;
  overflow: visible;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  color: #fff;
  font-size: clamp(1.25rem, 2vw, 1.9rem);
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-shadow: 0 0 12px rgba(0, 200, 255, 0.75);
  box-shadow: none !important;
  transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.planet-home-screen .hub-launch-btn::before,
.planet-home-screen .hub-launch-btn::after {
  content: "";
  position: absolute;
  clip-path: polygon(10% 0, 90% 0, 100% 28%, 100% 72%, 90% 100%, 10% 100%, 0 72%, 0 28%);
  pointer-events: none;
}

.planet-home-screen .hub-launch-btn::before {
  z-index: 0;
  inset: 0;
  background: rgba(65, 225, 255, 0.85);
  box-shadow:
    0 0 24px rgba(0, 200, 255, 0.38),
    inset 0 0 20px rgba(0, 200, 255, 0.16);
}

.planet-home-screen .hub-launch-btn::after {
  z-index: 1;
  inset: 2px;
  background: linear-gradient(180deg, rgba(10, 42, 73, 0.88), rgba(3, 13, 28, 0.82));
}

.planet-home-screen .hub-launch-btn span {
  position: relative;
  z-index: 2;
}

.planet-home-screen .hub-launch-btn:hover,
.planet-home-screen .hub-launch-btn:focus-visible {
  transform: translate(-50%, -50%) scale(1.02);
  filter: brightness(1.15);
  box-shadow: none !important;
}

.planet-home-screen .hub-launch-btn:hover::before,
.planet-home-screen .hub-launch-btn:focus-visible::before {
  box-shadow:
    0 0 34px rgba(0, 220, 255, 0.58),
    inset 0 0 30px rgba(0, 220, 255, 0.2);
}

.planet-home-screen .hub-actions {
  left: 50%;
  right: auto;
  bottom: 4.5%;
  transform: translateX(-50%);
  width: min(980px, 78%);
  height: 108px;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: stretch;
  gap: 0;
  margin: 0;
  padding: 10px 18px;
  border: 1px solid rgba(0, 195, 255, 0.42);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(4, 18, 34, 0.62), rgba(1, 8, 18, 0.86));
  box-shadow:
    0 0 28px rgba(0, 165, 255, 0.24),
    inset 0 0 32px rgba(0, 170, 255, 0.08);
  backdrop-filter: blur(8px);
}

.planet-home-screen .hub-actions::before {
  content: "";
  position: absolute;
  inset: 6px;
  border: 1px solid rgba(100, 225, 255, 0.12);
  border-radius: 14px;
  pointer-events: none;
}

.planet-home-screen .hub-actions .hub-action-button {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  min-height: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
  color: #f7fdff;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  isolation: isolate;
  transition: transform 160ms ease, color 160ms ease, filter 160ms ease;
}

.planet-home-screen .hub-actions .hub-action-button::after {
  content: none;
}

.planet-home-screen .hub-actions .hub-action-button::before {
  content: none;
}

.planet-home-screen .hub-actions .hub-action-button img {
  position: relative;
  z-index: 2;
  inset: auto;
  width: 31px;
  height: 31px;
  object-fit: contain;
  filter:
    drop-shadow(0 0 6px rgba(0, 220, 255, 0.75))
    drop-shadow(0 0 12px rgba(0, 120, 255, 0.35));
  transition: transform 160ms ease, filter 160ms ease;
}

.planet-home-screen .hub-actions .hub-action-button > span:not(.hub-action-badge) {
  position: relative;
  z-index: 3;
  left: auto;
  bottom: auto;
  width: 100%;
  min-height: 2em;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: none;
  color: inherit;
  font-size: inherit;
  letter-spacing: inherit;
  line-height: 1.05;
  text-align: center;
  text-shadow: 0 0 8px rgba(0, 180, 255, 0.65);
}

.planet-home-screen .hub-actions .hub-action-button:hover,
.planet-home-screen .hub-actions .hub-action-button:focus-visible,
.planet-home-screen .hub-actions .hub-action-button.reward-ready {
  transform: translateY(-2px);
  color: #fff;
  filter: brightness(1.15);
}

.planet-home-screen .hub-actions .hub-action-button:hover::before,
.planet-home-screen .hub-actions .hub-action-button:focus-visible::before,
.planet-home-screen .hub-actions .hub-action-button.reward-ready::before {
  content: none;
}

.planet-home-screen .hub-actions .hub-action-button:hover img,
.planet-home-screen .hub-actions .hub-action-button:focus-visible img,
.planet-home-screen .hub-actions .hub-action-button.reward-ready img {
  transform: scale(1.04);
  filter:
    drop-shadow(0 0 8px rgba(0, 235, 255, 0.95))
    drop-shadow(0 0 18px rgba(0, 130, 255, 0.55));
}

.planet-home-screen .save-status-indicator {
  position: absolute;
  right: 3%;
  bottom: calc(4.5% + 122px);
  z-index: 3;
}

.planet-home-screen .hub-action-badge {
  z-index: 4;
  top: 6px !important;
  right: 50% !important;
  width: max-content;
  max-width: 90%;
  transform: translateX(50%);
}

@media (max-width: 900px), (max-height: 620px) {
  .planet-home-screen .hub-header {
    top: 3%;
    width: 68%;
    min-height: 74px;
  }

  .planet-home-screen .hub-logout-button {
    top: 5%;
    right: 4%;
    min-width: 82px;
    height: 34px;
    padding: 0 14px !important;
    font-size: 0.72rem;
  }

  .planet-home-screen .hub-launch-btn {
    top: 43%;
    width: min(290px, 34%);
    min-width: 230px;
    height: 58px;
    font-size: clamp(1rem, 1.8vw, 1.45rem);
  }

  .planet-home-screen .hub-actions {
    bottom: 2.5%;
    width: 94%;
    height: 88px;
    padding: 8px 10px;
    border-radius: 14px;
  }

  .planet-home-screen .hub-actions .hub-action-button {
    gap: 5px;
    font-size: 0.56rem;
  }

  .planet-home-screen .hub-actions .hub-action-button img {
    width: 25px;
    height: 25px;
  }

  .planet-home-screen .save-status-indicator {
    bottom: calc(2.5% + 100px);
  }
}

@media (max-width: 620px) {
  .planet-home-screen .hub-actions {
    width: 96%;
    height: 78px;
  }

  .planet-home-screen .hub-actions .hub-action-button {
    font-size: 0.54rem;
    letter-spacing: 0.04em;
  }

  .planet-home-screen .hub-actions .hub-action-button img {
    width: 22px;
    height: 22px;
  }

  .planet-home-screen .hub-header h2 {
    letter-spacing: 0.12em;
  }
}

/* ===== Erebus sector target polish ===== */
:root {
  --sector-bot-hitbox-size: 104px;
  --sector-bot-size: 76px;
  --sector-bot-selected-size: 80px;
}

.enemy-bot-target {
  width: var(--sector-bot-hitbox-size) !important;
  height: var(--sector-bot-hitbox-size) !important;
  overflow: visible;
}

.enemy-bot-target img {
  width: var(--sector-bot-size) !important;
  height: var(--sector-bot-size) !important;
  object-fit: contain;
}

.enemy-bot-target.selected img,
.enemy-bot-target.is-selected img {
  width: var(--sector-bot-selected-size) !important;
  height: var(--sector-bot-selected-size) !important;
}

.asteroid-target.selected::after,
.asteroid-target.engaged::after,
.enemy-bot-target.bot-facing-player::before {
  border-radius: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

.enemy-bot-target.selected::after,
.enemy-bot-target.engaged::after,
.enemy-bot-target.is-selected::after {
  content: "";
  position: absolute;
  inset: 7px;
  pointer-events: none;
  border-radius: 4px;
  background:
    linear-gradient(#7fe7ff, #7fe7ff) left top / 24px 2px no-repeat,
    linear-gradient(#7fe7ff, #7fe7ff) left top / 2px 24px no-repeat,
    linear-gradient(#7fe7ff, #7fe7ff) right top / 24px 2px no-repeat,
    linear-gradient(#7fe7ff, #7fe7ff) right top / 2px 24px no-repeat,
    linear-gradient(#7fe7ff, #7fe7ff) left bottom / 24px 2px no-repeat,
    linear-gradient(#7fe7ff, #7fe7ff) left bottom / 2px 24px no-repeat,
    linear-gradient(#7fe7ff, #7fe7ff) right bottom / 24px 2px no-repeat,
    linear-gradient(#7fe7ff, #7fe7ff) right bottom / 2px 24px no-repeat;
  filter: drop-shadow(0 0 8px rgba(91, 213, 255, 0.56));
}

.enemy-bot-target.is-hostile::after,
.enemy-bot-target.bot-facing-player::after {
  background:
    linear-gradient(#ff765d, #ff765d) left top / 24px 2px no-repeat,
    linear-gradient(#ff765d, #ff765d) left top / 2px 24px no-repeat,
    linear-gradient(#ff765d, #ff765d) right top / 24px 2px no-repeat,
    linear-gradient(#ff765d, #ff765d) right top / 2px 24px no-repeat,
    linear-gradient(#ff765d, #ff765d) left bottom / 24px 2px no-repeat,
    linear-gradient(#ff765d, #ff765d) left bottom / 2px 24px no-repeat,
    linear-gradient(#ff765d, #ff765d) right bottom / 24px 2px no-repeat,
    linear-gradient(#ff765d, #ff765d) right bottom / 2px 24px no-repeat;
  filter: drop-shadow(0 0 9px rgba(255, 98, 70, 0.62));
}

.sector-bot-label {
  position: absolute;
  left: 50%;
  bottom: calc(100% - 10px);
  transform: translateX(-50%);
  min-width: 150px;
  text-align: center;
  pointer-events: none;
  z-index: 12;
}

.sector-bot-label-text {
  display: block;
  color: #ffffff;
  font-size: 0.66rem;
  line-height: 1.05;
  letter-spacing: 0.11em;
  white-space: nowrap;
  text-shadow:
    0 0 7px rgba(127, 223, 255, 0.72),
    0 1px 8px rgba(0, 0, 0, 0.85);
}

.sector-bot-nameplate,
.sector-bot-meta {
  display: none !important;
}

.enemy-bot-target .asteroid-hp-mini {
  left: 24px !important;
  right: 24px !important;
  bottom: 2px !important;
}

/* ===== Resource asteroid targets ===== */
.resource-asteroid-target {
  width: calc(92px * var(--asteroid-scale, 1)) !important;
  height: calc(92px * var(--asteroid-scale, 1)) !important;
  overflow: visible;
}

.resource-asteroid-target img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain;
  filter:
    drop-shadow(0 0 8px rgba(137, 193, 210, 0.34))
    drop-shadow(0 10px 14px rgba(0, 0, 0, 0.58)) !important;
}

.resource-asteroid-target.selected img,
.resource-asteroid-target.is-selected img {
  filter:
    drop-shadow(0 0 10px rgba(255, 210, 118, 0.72))
    drop-shadow(0 12px 16px rgba(0, 0, 0, 0.62)) !important;
}

.resource-asteroid-target.selected::after,
.resource-asteroid-target.engaged::after,
.resource-asteroid-target.is-selected::after {
  content: "";
  position: absolute;
  inset: 2px;
  pointer-events: none;
  border: 1px solid rgba(255, 220, 130, 0.82) !important;
  border-radius: 999px !important;
  box-shadow: 0 0 12px rgba(255, 190, 76, 0.32) !important;
}

.resource-asteroid-target .asteroid-hp-mini {
  left: 14px !important;
  right: 14px !important;
  bottom: -7px !important;
  height: 5px;
  background: rgba(190, 218, 225, 0.16);
}

.resource-asteroid-target .asteroid-hp-mini span {
  background: linear-gradient(90deg, #b9c7c8, #f1c56d);
  box-shadow: 0 0 8px rgba(241, 197, 109, 0.3);
}

/* ===== Bounty Board premium mockup pass ===== */
.bounty-board-screen.active {
  gap: 14px;
}

.bounty-board-screen .market-header h2 {
  font-size: clamp(34px, 4.4vw, 52px);
  letter-spacing: 0.04em;
  text-shadow: 0 0 22px rgba(0, 175, 255, 0.18);
}

.bounty-board-screen .market-header p {
  letter-spacing: 0.24em;
  color: rgba(127, 223, 255, 0.92);
}

.bounty-board-screen .screen-back-btn {
  min-width: 104px;
  border-color: rgba(127, 223, 255, 0.45);
  background: rgba(2, 13, 28, 0.78);
}

.bounty-top-strip {
  grid-template-columns: 210px 230px minmax(0, 1fr) !important;
  gap: 14px !important;
  min-height: 72px !important;
}

.bounty-strip-card,
.bounty-strip-note {
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, rgba(3, 22, 43, 0.88), rgba(0, 7, 17, 0.88)),
    rgba(0, 0, 0, 0.54) !important;
  border-color: rgba(116, 217, 255, 0.36) !important;
}

.bounty-strip-card {
  position: relative;
  padding-left: 54px !important;
}

.bounty-strip-card::before,
.bounty-strip-note::before {
  content: "i";
  position: absolute;
  left: 16px;
  top: 50%;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  transform: translateY(-50%);
  border: 1px solid rgba(127, 223, 255, 0.42);
  border-radius: 6px;
  color: #9fe9ff;
  background: rgba(0, 14, 28, 0.74);
  font-size: 0.78rem;
  font-weight: 950;
}

.bounty-strip-card:first-child::before {
  content: "3";
}

.bounty-strip-card:nth-child(2)::before {
  content: "";
  background: rgba(0, 14, 28, 0.74) url("assets/items/lupen-core.png") center / 18px 18px no-repeat;
}

.bounty-strip-card strong {
  font-size: 1.35rem !important;
}

.bounty-strip-note {
  position: relative;
  padding-left: 54px !important;
  font-size: 0.86rem !important;
}

.bounty-board-layout-refined {
  grid-template-columns: minmax(0, 1fr) minmax(370px, 430px) !important;
  gap: 18px !important;
}

.bounty-board-layout-refined .bounty-contract-grid {
  gap: 14px !important;
  padding: 15px !important;
  grid-template-rows: repeat(3, minmax(128px, 1fr)) !important;
}

.bounty-board-layout-refined .bounty-contract-card.bounty-card {
  min-height: 128px !important;
  padding: 16px !important;
  grid-template-columns: 92px minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto 1fr auto !important;
  gap: 8px 14px !important;
  border-radius: 10px;
  overflow: visible;
}

.bounty-board-layout-refined .bounty-card-icon {
  grid-row: 1 / 5 !important;
  width: 88px !important;
  height: 88px !important;
  border-radius: 10px !important;
  clip-path: polygon(12% 0, 88% 0, 100% 14%, 100% 86%, 88% 100%, 12% 100%, 0 86%, 0 14%);
  background:
    radial-gradient(circle at 50% 42%, rgba(127, 223, 255, 0.18), transparent 58%),
    rgba(2, 8, 18, 0.92) !important;
}

.bounty-board-layout-refined .bounty-card-icon img {
  object-fit: contain;
  transform: scale(1.18);
}

.bounty-board-layout-refined .bounty-card-copy {
  grid-column: 2 / 3;
  gap: 6px;
}

.bounty-board-layout-refined .bounty-card-copy strong {
  font-size: 1.12rem !important;
}

.bounty-board-layout-refined .bounty-card-copy em {
  font-size: 0.76rem !important;
  color: rgba(201, 222, 240, 0.78);
}

.bounty-board-layout-refined .bounty-card-threat {
  grid-column: 3 / 4;
  align-self: start;
  font-size: 0.66rem;
}

.bounty-board-layout-refined .bounty-card-objective {
  grid-column: 2 / 3;
  justify-self: start;
}

.bounty-board-layout-refined .bounty-card-reward {
  grid-column: 3 / 4;
  grid-row: 2 / 5;
  align-self: center;
  display: grid;
  place-items: center;
  gap: 5px;
  min-width: 112px;
  min-height: 72px;
  border-radius: 8px;
  white-space: normal;
  text-align: center;
  color: #f0fbff;
  background: linear-gradient(180deg, rgba(5, 42, 70, 0.76), rgba(0, 12, 26, 0.86));
}

.bounty-board-layout-refined .bounty-card-reward img,
.selected-bounty-reward img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  filter: drop-shadow(0 0 8px rgba(127, 223, 255, 0.42));
}

.bounty-board-layout-refined .bounty-timer-chip {
  grid-column: 2 / 3;
  display: inline-grid;
  grid-template-columns: auto auto;
  gap: 8px;
  align-items: center;
  border-radius: 6px;
}

.bounty-timer-chip small {
  color: rgba(255, 211, 190, 0.76);
  font-size: 0.54rem;
}

.bounty-timer-chip strong {
  color: #fff1df;
  font-size: 0.78rem;
}

.bounty-board-layout-refined .bounty-card-status {
  grid-column: 3 / 4 !important;
  grid-row: 1 / 2;
  align-self: start;
}

.bounty-board-layout-refined .bounty-contract-card.selected,
.bounty-board-layout-refined .bounty-contract-card.bounty-card--selected {
  border-color: rgba(174, 242, 255, 0.95) !important;
  box-shadow:
    inset 0 0 0 1px rgba(174, 242, 255, 0.18),
    inset 4px 0 0 rgba(91, 213, 255, 0.96),
    0 0 28px rgba(0, 190, 255, 0.22) !important;
}

.bounty-detail-panel.selected-bounty-panel {
  background:
    radial-gradient(circle at 50% 0%, rgba(80, 188, 255, 0.11), transparent 42%),
    linear-gradient(180deg, rgba(4, 19, 38, 0.92), rgba(0, 6, 17, 0.94)) !important;
}

.bounty-detail-body {
  padding: 15px !important;
  gap: 13px !important;
}

.selected-bounty-header {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 14px !important;
  border-radius: 10px;
}

.bounty-board-layout-refined .bounty-detail-icon {
  width: 104px !important;
  height: 104px !important;
  min-width: 104px !important;
  clip-path: polygon(12% 0, 88% 0, 100% 14%, 100% 86%, 88% 100%, 12% 100%, 0 86%, 0 14%);
}

.bounty-detail-icon img {
  object-fit: contain !important;
  transform: scale(1.18);
}

.bounty-detail-hero strong {
  margin-top: 7px;
  font-size: 1.35rem !important;
  line-height: 1.05;
}

.bounty-detail-progress-block {
  padding: 14px !important;
  border-radius: 10px !important;
}

.bounty-progress-bar {
  height: 11px !important;
}

.selected-bounty-timer {
  display: grid;
  gap: 4px;
  padding: 16px !important;
  border-radius: 10px !important;
}

.selected-bounty-timer span {
  color: rgba(255, 211, 190, 0.76);
  font-size: 0.62rem;
}

.selected-bounty-timer strong {
  color: #fff4e6;
  font-size: 1.8rem;
  letter-spacing: 0.04em;
}

.selected-bounty-info-row {
  min-height: 42px;
  align-items: center;
  border-radius: 8px !important;
}

.selected-bounty-reward {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.bounty-board-layout-refined .bounty-accept-btn,
.bounty-board-layout-refined .bounty-claim-btn,
.bounty-board-layout-refined .bounty-cancel-btn {
  min-height: 48px !important;
  border-radius: 9px;
  font-size: 0.84rem;
  letter-spacing: 0.1em;
}

@media (max-width: 900px) {
  .bounty-top-strip {
    grid-template-columns: 1fr !important;
  }

  .bounty-board-layout-refined .bounty-contract-card.bounty-card {
    grid-template-columns: 82px minmax(0, 1fr) !important;
  }

  .bounty-board-layout-refined .bounty-card-reward,
  .bounty-board-layout-refined .bounty-card-status {
    grid-column: 2 / 3 !important;
    grid-row: auto !important;
    justify-self: start;
  }
}

/* ===== Bounty Board clean rebuild ===== */
#bountyScreen.bounty-board-screen.active {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 12px !important;
  width: 100%;
  max-width: 1180px;
  height: 665px;
  max-height: 665px;
  overflow: hidden !important;
  padding: 28px;
  box-sizing: border-box;
  background:
    linear-gradient(180deg, rgba(1, 8, 18, 0.20), rgba(1, 8, 18, 0.46)),
    url("assets/backgrounds/bounty-board-background.png") center / cover no-repeat !important;
}

.bounty-board-header {
  display: flex !important;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin: 0 !important;
}

.bounty-board-header p {
  margin: 0 0 4px;
  color: rgba(127, 223, 255, 0.94);
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.24em;
}

.bounty-board-header h2,
.bounty-board-title {
  margin: 0;
  color: #f7fdff;
  font-size: clamp(36px, 4vw, 52px) !important;
  line-height: 0.95;
  letter-spacing: 0.04em;
  text-shadow: 0 0 24px rgba(0, 190, 255, 0.18);
}

.bounty-board-header .screen-back-btn {
  flex: 0 0 auto;
  min-width: 104px;
  min-height: 40px;
  border-color: rgba(127, 223, 255, 0.42);
  background: linear-gradient(180deg, rgba(4, 27, 48, 0.9), rgba(0, 8, 20, 0.92));
}

.bounty-status-strip {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 16px !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 9px 12px 9px 14px !important;
  min-width: 0;
  border: 1px solid rgba(112, 215, 255, 0.36) !important;
  border-radius: 10px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(91, 213, 255, 0.10), transparent 44%),
    linear-gradient(135deg, rgba(3, 22, 43, 0.88), rgba(0, 7, 17, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(180, 238, 255, 0.07), 0 0 20px rgba(0, 160, 255, 0.06);
}

.bounty-status-message {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: #c8dbea;
  font-size: 0.84rem;
  line-height: 1.2;
}

.bounty-status-icon {
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(127, 223, 255, 0.42);
  border-radius: 50%;
  color: #9fe9ff;
  background: rgba(0, 14, 28, 0.72);
  font-size: 0.72rem;
  font-weight: 950;
}

.bounty-main-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.7fr) minmax(360px, 0.95fr) !important;
  gap: 18px !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

.bounty-list-panel,
.selected-contract-panel {
  min-height: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(112, 215, 255, 0.32) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(70, 180, 255, 0.08), transparent 45%),
    linear-gradient(180deg, rgba(2, 17, 34, 0.92), rgba(0, 6, 16, 0.94)) !important;
  box-shadow: inset 0 1px 0 rgba(180, 238, 255, 0.06), 0 18px 38px rgba(0, 0, 0, 0.24);
}

.bounty-list-panel {
  display: grid !important;
  grid-template-rows: 48px minmax(0, 1fr);
}

.bounty-list-header,
.selected-contract-heading {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  padding: 0 16px !important;
  border-bottom: 1px solid rgba(112, 215, 255, 0.18);
  background: rgba(0, 13, 27, 0.38);
}

.bounty-list-header span,
.selected-contract-heading span {
  color: #e9f8ff !important;
  font-size: 0.78rem !important;
  font-weight: 950;
  letter-spacing: 0.16em;
}

.bounty-list-count {
  color: rgba(127, 223, 255, 0.74) !important;
  font-size: 0.62rem !important;
  letter-spacing: 0.12em !important;
}

.bounty-reset-chip {
  flex: 0 0 auto;
  padding: 7px 11px;
  border: 1px solid rgba(127, 223, 255, 0.28);
  border-radius: 999px;
  color: #9fe9ff !important;
  background: rgba(0, 16, 32, 0.7);
  font-size: 0.58rem !important;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0.08em;
  white-space: nowrap;
}

.bounty-list {
  display: grid !important;
  grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 14px !important;
  overflow: hidden !important;
}

.bounty-card {
  display: grid !important;
  grid-template-columns: 82px minmax(0, 1fr) 150px !important;
  grid-template-rows: 1fr !important;
  align-items: stretch !important;
  gap: 13px !important;
  width: 100%;
  min-width: 0;
  min-height: 0 !important;
  height: 100% !important;
  padding: 14px !important;
  border: 1px solid rgba(112, 215, 255, 0.30) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(120deg, rgba(7, 25, 47, 0.94), rgba(0, 8, 19, 0.95)),
    rgba(0, 0, 0, 0.72) !important;
  color: inherit;
  text-align: left;
  overflow: hidden !important;
  cursor: pointer;
  position: relative;
}

.bounty-card--rapid {
  border-color: rgba(255, 167, 58, 0.54) !important;
  box-shadow: inset 4px 0 0 rgba(255, 167, 58, 0.94), 0 0 18px rgba(255, 147, 28, 0.10) !important;
}

.bounty-card--standard {
  border-color: rgba(91, 213, 255, 0.48) !important;
  box-shadow: inset 4px 0 0 rgba(91, 213, 255, 0.9), 0 0 18px rgba(0, 180, 255, 0.08) !important;
}

.bounty-card--priority {
  border-color: rgba(255, 199, 72, 0.50) !important;
  box-shadow: inset 4px 0 0 rgba(255, 199, 72, 0.92), 0 0 18px rgba(255, 185, 45, 0.08) !important;
}

.bounty-card--boss {
  border-color: rgba(255, 74, 60, 0.58) !important;
  box-shadow: inset 4px 0 0 rgba(255, 74, 60, 0.96), 0 0 20px rgba(255, 54, 44, 0.12) !important;
}

.bounty-card--selected,
.bounty-card.selected {
  border-color: rgba(188, 245, 255, 0.95) !important;
  box-shadow: inset 4px 0 0 rgba(127, 223, 255, 1), 0 0 26px rgba(0, 190, 255, 0.24) !important;
}

.bounty-card--completed,
.bounty-card.ready-to-claim {
  border-color: rgba(85, 255, 172, 0.74) !important;
  box-shadow: inset 4px 0 0 rgba(69, 238, 151, 0.95), 0 0 26px rgba(43, 220, 137, 0.18) !important;
}

.bounty-card--claimed,
.bounty-card.completed {
  border-color: rgba(92, 232, 158, 0.48) !important;
  box-shadow: inset 4px 0 0 rgba(79, 213, 135, 0.72), 0 0 20px rgba(46, 185, 116, 0.12) !important;
  opacity: 0.92;
}

.bounty-card--failed,
.bounty-card.failed {
  border-color: rgba(255, 111, 124, 0.36) !important;
  box-shadow: inset 4px 0 0 rgba(166, 66, 76, 0.72) !important;
  filter: saturate(0.75);
}

.bounty-card__status-check {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(107, 255, 182, 0.78);
  border-radius: 50%;
  color: #d9ffe8;
  background: radial-gradient(circle, rgba(80, 255, 167, 0.32), rgba(10, 54, 35, 0.86));
  box-shadow: 0 0 14px rgba(66, 244, 151, 0.34);
  font-size: 0.84rem;
  font-weight: 950;
}

.bounty-card__icon-frame {
  grid-column: 1 / 2 !important;
  grid-row: 1 / 2 !important;
  align-self: center;
  justify-self: center;
  width: 74px !important;
  height: 74px !important;
  min-width: 74px !important;
  display: grid;
  place-items: center;
  border: 1px solid rgba(127, 223, 255, 0.36) !important;
  border-radius: 10px !important;
  clip-path: polygon(12% 0, 88% 0, 100% 14%, 100% 86%, 88% 100%, 12% 100%, 0 86%, 0 14%);
  background: radial-gradient(circle at 50% 38%, rgba(127, 223, 255, 0.16), transparent 58%), rgba(1, 8, 18, 0.92) !important;
  overflow: hidden;
}

.bounty-card__icon-frame img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain !important;
  transform: none;
}

.bounty-card__body {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 2 !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr);
  align-content: center;
  gap: 7px !important;
  min-width: 0;
}

.bounty-card__title {
  color: #ffffff !important;
  font-size: clamp(0.98rem, 1.25vw, 1.2rem) !important;
  line-height: 1.04;
  white-space: normal;
}

.bounty-card__subtitle {
  color: rgba(205, 225, 241, 0.78) !important;
  font-size: 0.76rem !important;
  line-height: 1.2;
  white-space: normal;
}

.bounty-card__chips {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.bounty-chip {
  min-height: 22px;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 0.55rem !important;
  line-height: 1;
  white-space: nowrap;
}

.bounty-chip--target {
  color: #dcecff;
  border-color: rgba(127, 223, 255, 0.2);
  background: rgba(0, 10, 22, 0.5);
}

.bounty-chip--boss {
  color: #ffe0dc;
  border-color: rgba(255, 90, 74, 0.46);
  background: rgba(75, 15, 14, 0.58);
}

.bounty-card-threat {
  justify-self: auto !important;
}

.bounty-timer-chip {
  display: inline-flex !important;
  gap: 6px;
  align-items: center;
  color: #ffd4bd;
  border-color: rgba(255, 112, 77, 0.46);
  background: rgba(82, 24, 12, 0.42);
}

.bounty-card--completed .bounty-timer-chip,
.bounty-card--claimed .bounty-timer-chip,
.bounty-card.ready-to-claim .bounty-timer-chip,
.bounty-card.completed .bounty-timer-chip {
  color: #d7ffe7 !important;
  border-color: rgba(97, 255, 177, 0.58) !important;
  background: rgba(12, 61, 38, 0.68) !important;
  box-shadow: 0 0 12px rgba(66, 244, 151, 0.16);
}

.bounty-timer-chip small,
.bounty-timer-chip strong {
  font-size: inherit !important;
  line-height: 1;
}

.bounty-reward-box {
  grid-column: 3 / 4 !important;
  grid-row: 1 / 2 !important;
  align-self: center !important;
  justify-self: stretch !important;
  display: grid !important;
  align-content: center;
  gap: 5px;
  width: 150px;
  min-height: 58px !important;
  min-width: 0 !important;
  padding: 8px 10px;
  border: 1px solid rgba(91, 213, 255, 0.45) !important;
  border-radius: 10px !important;
  color: #f4fcff !important;
  background: linear-gradient(180deg, rgba(18, 42, 64, 0.85), rgba(5, 12, 20, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(160, 232, 255, 0.07), 0 0 16px rgba(0, 180, 255, 0.08);
  text-align: left;
  white-space: normal !important;
}

.bounty-reward-box__label {
  color: #62dfff;
  font-size: 0.56rem;
  font-weight: 950;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.bounty-reward-box__value {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  color: #ffffff;
  font-size: 0.78rem;
  line-height: 1.12;
  font-weight: 950;
}

.bounty-reward-box__icon {
  flex: 0 0 18px;
  width: 18px !important;
  height: 18px !important;
  object-fit: contain;
}

.bounty-status-chip {
  justify-self: start;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: auto !important;
  margin: 0 !important;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(127, 223, 255, 0.20);
  color: #9fe9ff;
  background: rgba(0, 12, 24, 0.72);
  font-size: 0.54rem;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0.08em;
}

.bounty-board-layout-refined .bounty-card-reward.bounty-reward-box {
  grid-column: 3 / 4 !important;
  grid-row: 1 / 2 !important;
  align-self: center !important;
  justify-self: stretch !important;
  place-items: initial !important;
  text-align: left !important;
  width: 150px !important;
  min-height: 58px !important;
}

.bounty-board-layout-refined .bounty-card-status.bounty-status-chip {
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: auto !important;
  justify-self: start !important;
}

.bounty-status-chip--active {
  color: #b9f2ff;
  border-color: rgba(91, 213, 255, 0.42);
  background: rgba(0, 42, 72, 0.72);
}

.bounty-status-chip--completed,
.bounty-status-chip--claimed {
  color: #d8ffe8;
  border-color: rgba(97, 255, 177, 0.48);
  background: rgba(12, 61, 38, 0.72);
}

.bounty-status-chip--failed {
  color: #ffd4d8;
  border-color: rgba(255, 112, 126, 0.36);
  background: rgba(74, 18, 25, 0.72);
}

.bounty-card--completed .bounty-reward-box,
.bounty-card--claimed .bounty-reward-box {
  border-color: rgba(97, 255, 177, 0.56) !important;
  background: linear-gradient(180deg, rgba(15, 61, 43, 0.84), rgba(5, 18, 16, 0.92)) !important;
  box-shadow: inset 0 1px 0 rgba(172, 255, 214, 0.08), 0 0 18px rgba(66, 244, 151, 0.13);
}

.bounty-card--completed .bounty-status-chip,
.bounty-card--claimed .bounty-status-chip,
.bounty-card.ready-to-claim .bounty-status-chip,
.bounty-card.completed .bounty-status-chip {
  color: #8dffc1 !important;
  border-color: rgba(109, 255, 174, 0.72) !important;
  background: rgba(25, 95, 60, 0.46) !important;
}

.selected-contract-panel {
  display: grid !important;
  grid-template-rows: 48px minmax(0, 1fr);
}

.selected-contract-body {
  display: grid !important;
  grid-template-rows: auto auto auto minmax(0, 1fr) auto auto;
  gap: 8px !important;
  min-height: 0 !important;
  padding: 12px !important;
  overflow: hidden !important;
}

.selected-contract-top {
  display: grid !important;
  grid-template-columns: 94px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 108px;
  padding: 12px !important;
  border: 1px solid rgba(127, 223, 255, 0.22);
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(2, 26, 50, 0.76), rgba(0, 7, 18, 0.92));
}

.selected-contract-icon {
  width: 86px !important;
  height: 86px !important;
  min-width: 86px !important;
  display: grid;
  place-items: center;
  border: 1px solid rgba(127, 223, 255, 0.42) !important;
  clip-path: polygon(12% 0, 88% 0, 100% 14%, 100% 86%, 88% 100%, 12% 100%, 0 86%, 0 14%);
  background: rgba(2, 8, 18, 0.92) !important;
}

.selected-contract-icon img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain !important;
  transform: none;
}

.bounty-board-layout-refined .selected-contract-icon.bounty-detail-icon {
  width: 86px !important;
  height: 86px !important;
  min-width: 86px !important;
}

.bounty-board-layout-refined .selected-contract-icon.bounty-detail-icon img {
  max-width: 100% !important;
  max-height: 100% !important;
  transform: none !important;
}

.selected-contract-copy {
  position: relative;
  min-width: 0;
}

.selected-contract-check {
  position: absolute;
  top: 0;
  right: 0;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(107, 255, 182, 0.75);
  border-radius: 50%;
  color: #d9ffe8;
  background: radial-gradient(circle, rgba(80, 255, 167, 0.30), rgba(10, 54, 35, 0.86));
  box-shadow: 0 0 14px rgba(66, 244, 151, 0.30);
  font-weight: 950;
}

.selected-contract-copy strong {
  display: block;
  margin: 7px 0 5px;
  color: #ffffff;
  font-size: clamp(1.04rem, 1.4vw, 1.28rem) !important;
  line-height: 1.05;
}

.selected-contract-copy > span:last-child {
  display: block;
  color: rgba(205, 225, 241, 0.80);
  font-size: 0.75rem;
  line-height: 1.25;
}

.selected-contract-progress {
  padding: 11px !important;
  border-radius: 9px !important;
}

.selected-contract-panel--completed .selected-contract-top,
.selected-contract-panel--claimed .selected-contract-top,
.selected-contract-panel--completed .selected-contract-progress,
.selected-contract-panel--claimed .selected-contract-progress {
  border-color: rgba(97, 255, 177, 0.44) !important;
  box-shadow: 0 0 20px rgba(66, 244, 151, 0.10);
}

.selected-contract-panel--failed .selected-contract-top,
.selected-contract-panel--failed .selected-contract-progress {
  border-color: rgba(255, 112, 126, 0.34) !important;
}

.selected-contract-timer {
  display: grid;
  place-items: center;
  gap: 3px;
  min-height: 64px;
  padding: 10px !important;
  border-radius: 9px !important;
}

.selected-contract-timer span {
  font-size: 0.58rem;
}

.selected-contract-timer strong {
  font-size: 1.55rem;
}

.selected-contract-rows {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px !important;
  min-height: 0;
}

.selected-contract-row {
  min-height: 32px !important;
  padding: 6px 8px !important;
  border-radius: 8px !important;
}

.selected-contract-row span {
  color: #7fdfff !important;
  font-size: 0.56rem !important;
}

.selected-contract-row strong {
  max-width: 100% !important;
  color: #f2fbff !important;
  font-size: 0.72rem !important;
  line-height: 1.15;
  white-space: normal !important;
}

.selected-bounty-reward {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  padding: 3px 0;
  color: #ffffff;
  font-weight: 950;
}

.selected-bounty-reward img {
  width: 20px !important;
  height: 20px !important;
}

.selected-bounty-reward--completed,
.selected-bounty-reward--claimed {
  color: #d8ffe8;
}

.bounty-complete-note,
.bounty-detail-note {
  margin: 0 !important;
}

.selected-contract-actions {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 8px;
  align-self: end;
}

.selected-contract-action,
.selected-contract-actions button {
  width: 100%;
  min-height: 46px !important;
  border-radius: 9px !important;
  font-size: 0.82rem !important;
  letter-spacing: 0.1em;
}

#bountyScreen.bounty-board-screen.active .bounty-board-title,
#bountyScreen.bounty-board-screen.active .bounty-board-header h2 {
  font-size: clamp(34px, 3.4vw, 46px) !important;
}

#bountyScreen.bounty-board-screen.active .bounty-status-strip {
  min-height: 42px !important;
  padding: 7px 12px !important;
}

#bountyScreen.bounty-board-screen.active .bounty-status-message {
  font-size: 0.78rem;
}

#bountyScreen.bounty-board-screen.active .bounty-main-grid {
  gap: 12px !important;
}

#bountyScreen.bounty-board-screen.active .bounty-list-panel,
#bountyScreen.bounty-board-screen.active .selected-contract-panel {
  overflow: hidden !important;
}

#bountyScreen.bounty-board-screen.active .bounty-list-panel,
#bountyScreen.bounty-board-screen.active .selected-contract-panel {
  grid-template-rows: 42px minmax(0, 1fr) !important;
}

#bountyScreen.bounty-board-screen.active .bounty-list-header,
#bountyScreen.bounty-board-screen.active .selected-contract-heading {
  min-height: 42px !important;
  padding: 0 14px !important;
}

#bountyScreen.bounty-board-screen.active .bounty-board-layout-refined .bounty-contract-grid.bounty-list {
  grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 10px !important;
  overflow: hidden !important;
}

#bountyScreen.bounty-board-screen.active .bounty-board-layout-refined .bounty-contract-card.bounty-card {
  min-height: 0 !important;
  height: 100% !important;
  padding: 10px 12px !important;
  grid-template-columns: 76px minmax(0, 1fr) 178px !important;
  grid-template-rows: 1fr !important;
  gap: 10px !important;
  overflow: hidden !important;
}

#bountyScreen.bounty-board-screen.active .bounty-board-layout-refined .bounty-card-icon.bounty-card__icon-frame {
  width: 70px !important;
  height: 70px !important;
  min-width: 70px !important;
  grid-row: 1 / 2 !important;
}

#bountyScreen.bounty-board-screen.active .bounty-board-layout-refined .bounty-card-icon.bounty-card__icon-frame img {
  max-width: 100% !important;
  max-height: 100% !important;
  transform: none !important;
}

#bountyScreen.bounty-board-screen.active .bounty-card__title {
  font-size: clamp(0.94rem, 1.1vw, 1.12rem) !important;
}

#bountyScreen.bounty-board-screen.active .bounty-card__subtitle {
  font-size: 0.72rem !important;
}

#bountyScreen.bounty-board-screen.active .bounty-chip {
  min-height: 20px;
  padding: 3px 7px;
  font-size: 0.52rem !important;
}

#bountyScreen.bounty-board-screen.active .bounty-reward-box {
  width: 178px !important;
  min-height: 54px !important;
  padding: 7px 9px !important;
}

#bountyScreen.bounty-board-screen.active .bounty-reward-box__value {
  justify-content: flex-start;
  gap: 10px;
  font-size: 0.8rem;
}

#bountyScreen.bounty-board-screen.active .bounty-reward-box__icon {
  width: 24px !important;
  height: 24px !important;
  flex-basis: 24px;
  filter: drop-shadow(0 0 8px rgba(91, 213, 255, 0.68));
}

#bountyScreen.bounty-board-screen.active .selected-bounty-reward {
  justify-content: flex-start;
  gap: 10px;
}

#bountyScreen.bounty-board-screen.active .selected-bounty-reward img {
  width: 24px !important;
  height: 24px !important;
}

#bountyScreen.bounty-board-screen.active .selected-contract-body.bounty-detail-body {
  gap: 6px !important;
  padding: 10px !important;
  overflow: hidden !important;
}

#bountyScreen.bounty-board-screen.active .selected-bounty-header.selected-contract-top {
  min-height: 96px !important;
  padding: 10px !important;
}

#bountyScreen.bounty-board-screen.active .bounty-board-layout-refined .selected-contract-icon.bounty-detail-icon {
  width: 76px !important;
  height: 76px !important;
  min-width: 76px !important;
}

#bountyScreen.bounty-board-screen.active .selected-contract-copy strong {
  font-size: 1rem !important;
}

#bountyScreen.bounty-board-screen.active .selected-contract-copy > span:last-child {
  font-size: 0.68rem;
}

#bountyScreen.bounty-board-screen.active .selected-contract-progress {
  padding: 8px !important;
}

#bountyScreen.bounty-board-screen.active .selected-contract-timer {
  min-height: 52px !important;
  padding: 7px !important;
}

#bountyScreen.bounty-board-screen.active .selected-contract-timer strong {
  font-size: 1.25rem !important;
}

#bountyScreen.bounty-board-screen.active .selected-contract-row {
  min-height: 28px !important;
  padding: 5px 7px !important;
}

#bountyScreen.bounty-board-screen.active .selected-contract-action,
#bountyScreen.bounty-board-screen.active .selected-contract-actions button {
  min-height: 40px !important;
}

@media (max-width: 980px) {
  #bountyScreen.bounty-board-screen.active {
    height: auto;
    max-height: none;
    overflow-y: auto !important;
  }

  .bounty-main-grid {
    grid-template-columns: 1fr !important;
  }

  .bounty-status-strip {
    align-items: flex-start;
    flex-direction: column;
  }

  .selected-contract-rows {
    grid-template-columns: 1fr;
  }
}

#hangarShipyardSection .vessel-exchange-card .fleet-card-image-wrap img {
  max-height: 126px !important;
  transform: scale(1) !important;
}

#shipyardDetailPanel .fleet-detail-hero {
  min-height: 150px !important;
}

#shipyardDetailPanel .fleet-detail-hero img {
  max-height: 170px !important;
  max-width: 94% !important;
  transform: scale(1.18) !important;
}

@media (max-height: 780px) {
  #hangarShipyardSection .vessel-exchange-card .fleet-card-image-wrap img {
    max-height: 102px !important;
  }

  #shipyardDetailPanel .fleet-detail-hero {
    min-height: 132px !important;
  }

  #shipyardDetailPanel .fleet-detail-hero img {
    max-height: 148px !important;
  }
}

/* ===== Vessel Exchange detail containment pass ===== */
#hangarShipyardSection .fleet-detail-body {
  grid-template-rows: 126px auto 32px minmax(0, auto) auto !important;
  gap: 6px !important;
  overflow: hidden !important;
}

#shipyardDetailPanel {
  padding: 10px !important;
}

#shipyardDetailPanel .fleet-detail-hero {
  height: 126px !important;
  min-height: 126px !important;
  max-height: 126px !important;
  overflow: hidden !important;
}

#shipyardDetailPanel .fleet-detail-hero img {
  max-width: 88% !important;
  max-height: 114px !important;
  transform: none !important;
  object-fit: contain !important;
}

#shipyardDetailPanel .fleet-detail-title h4 {
  font-size: 18px !important;
}

#shipyardDetailPanel .fleet-detail-title p {
  margin-top: 3px !important;
  font-size: 8.5px !important;
}

#shipyardDetailPanel .shipyard-primary-action {
  margin: 0 !important;
}

#shipyardDetailPanel .shipyard-primary-action button {
  min-height: 32px !important;
  padding: 5px 10px !important;
}

#shipyardDetailPanel .shipyard-stat-grid,
#shipyardDetailPanel .fleet-detail-stats.shipyard-stat-grid {
  gap: 5px !important;
}

#shipyardDetailPanel .fleet-stat-chip,
#shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
  min-height: 36px !important;
  padding: 5px 7px !important;
}

#shipyardDetailPanel .shipyard-capacity-panel {
  margin-top: 0 !important;
  min-height: 42px;
  padding: 6px !important;
}

@media (max-height: 780px) {
  #hangarShipyardSection .fleet-detail-body {
    grid-template-rows: 108px auto 30px minmax(0, auto) auto !important;
    gap: 5px !important;
  }

  #shipyardDetailPanel .fleet-detail-hero {
    height: 108px !important;
    min-height: 108px !important;
    max-height: 108px !important;
  }

  #shipyardDetailPanel .fleet-detail-hero img {
    max-height: 98px !important;
  }

  #shipyardDetailPanel .fleet-stat-chip,
  #shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
    min-height: 34px !important;
  }
}

/* Keep Vessel Exchange detail content visible instead of clipping the hardpoints row. */
#hangarShipyardSection #shipyardDetailPanel.fleet-detail-body {
  grid-template-rows: 88px auto 28px minmax(0, auto) auto !important;
  gap: 4px !important;
  padding: 6px !important;
  overflow: visible !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-hero {
  height: 88px !important;
  min-height: 88px !important;
  max-height: 88px !important;
  margin-bottom: 0 !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-hero img {
  max-height: 78px !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-title h4 {
  font-size: 16px !important;
  line-height: 1 !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-title p {
  margin-top: 2px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-primary-action button {
  min-height: 28px !important;
  padding: 4px 10px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-stat-grid,
#hangarShipyardSection #shipyardDetailPanel .fleet-detail-stats.shipyard-stat-grid {
  gap: 4px !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-stat-chip,
#hangarShipyardSection #shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
  min-height: 30px !important;
  padding: 4px 7px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-capacity-panel {
  min-height: 36px !important;
  padding: 5px 6px !important;
}

/* Final Vessel Exchange catalog sizing: removes the unused strip below cards. */
#hangarShipyardSection .shipyard-catalog-panel.fleet-gallery-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  min-height: 0 !important;
  padding: 12px !important;
  overflow: hidden !important;
}

#hangarShipyardSection #shipShop.shipyard-grid.vessel-card-grid {
  align-self: stretch !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 4px 10px 12px 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* Final pass: use the available Hull Detail space without compressing the content. */
#hangarShipyardSection #shipyardDetailPanel.fleet-detail-body {
  height: 100% !important;
  grid-template-rows: 120px auto 34px auto 44px !important;
  gap: 6px !important;
  padding: 12px !important;
  overflow: hidden !important;
  align-content: stretch !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-hero {
  height: 120px !important;
  min-height: 120px !important;
  max-height: 120px !important;
  margin-bottom: 0 !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-hero img {
  max-height: 108px !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-title h4 {
  font-size: 20px !important;
  line-height: 1 !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-detail-title p {
  margin-top: 4px !important;
  font-size: 9px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-primary-action button {
  min-height: 34px !important;
  padding: 6px 12px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-stat-grid,
#hangarShipyardSection #shipyardDetailPanel .fleet-detail-stats.shipyard-stat-grid {
  gap: 6px !important;
}

#hangarShipyardSection #shipyardDetailPanel .fleet-stat-chip,
#hangarShipyardSection #shipyardDetailPanel .fleet-detail-stats .fleet-stat-chip {
  min-height: 38px !important;
  padding: 6px 8px !important;
}

#hangarShipyardSection #shipyardDetailPanel .shipyard-capacity-panel {
  min-height: 44px !important;
  padding: 7px 8px !important;
}

/* Final pass: keep Vault Item Detail inside the Hangar frame and scroll if needed. */
#hangarScreen.hangar-screen.active:has(#hangarVaultSection.active) {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
}

#hangarScreen.hangar-screen.active:has(#hangarVaultSection.active) #hangarVaultSection {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#hangarVaultSection .save-transfer-panel {
  margin-bottom: 10px;
}

#hangarVaultSection .vault-layout {
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#hangarVaultSection .vault-main-panel,
#hangarVaultSection .vault-detail-panel {
  min-height: 0 !important;
}

#hangarVaultSection .vault-detail-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  padding: 12px !important;
}

#hangarVaultSection .vault-detail-panel-body,
#hangarVaultSection #vaultDetailPanel {
  min-height: 0 !important;
  max-height: none !important;
  padding: 14px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

#hangarVaultSection .vault-detail-shell {
  height: auto !important;
  min-height: 0 !important;
  grid-template-rows: 116px auto auto auto auto auto !important;
  gap: 9px !important;
}

#hangarVaultSection .vault-detail-shell .store-detail-visual {
  height: 116px !important;
  min-height: 0 !important;
}

#hangarVaultSection .vault-detail-shell .store-detail-visual img {
  max-height: 82px !important;
}

#hangarVaultSection .vault-detail-shell .store-detail-title {
  font-size: 1.55rem !important;
  line-height: 1 !important;
}

#hangarVaultSection .vault-detail-stats {
  gap: 8px !important;
}

#hangarVaultSection .vault-detail-stats .compact-detail-stat-card {
  min-height: 52px !important;
  padding: 8px 10px !important;
}

#hangarVaultSection .vault-upgrade-panel {
  grid-template-columns: minmax(0, 1fr) auto !important;
  margin-top: 0 !important;
}

/* Final Forge pass: direct shard/core upgrades. */
.upgrade-forge-screen .forge-top-stats {
  grid-template-columns: repeat(4, minmax(118px, 1fr)) auto !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-top-chip.shard-chip span {
  color: #70ecff !important;
  border-color: rgba(112, 236, 255, 0.72) !important;
  box-shadow: 0 0 20px rgba(0, 206, 255, 0.22) !important;
}

.upgrade-forge-screen .upgrade-forge-layout {
  grid-template-columns: minmax(260px, 0.9fr) minmax(360px, 1.35fr) minmax(280px, 0.95fr) !important;
  min-height: 0 !important;
}

.upgrade-forge-screen .forge-panel {
  min-height: 0 !important;
}

.upgrade-forge-screen .forge-selected-panel,
.upgrade-forge-screen .forge-materials-panel {
  height: auto !important;
}

.upgrade-forge-screen .forge-selected-card {
  align-content: start !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-selected-art {
  min-height: 118px !important;
}

.upgrade-forge-screen .forge-selected-art img {
  max-height: 110px !important;
}

.upgrade-forge-screen .forge-chamber-panel {
  display: grid !important;
  grid-template-rows: auto minmax(180px, 1fr) auto auto !important;
  gap: 8px !important;
}

.upgrade-forge-screen .forge-chamber {
  min-height: 180px !important;
  height: 100% !important;
}

.upgrade-forge-screen .forge-chamber img {
  max-height: 170px !important;
}

.upgrade-forge-screen .forge-state-preview {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-mode-switch {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-mode-switch button {
  min-height: 50px !important;
  text-align: left !important;
}

.upgrade-forge-screen .forge-materials-list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

.upgrade-forge-screen .forge-resource-card,
.upgrade-forge-screen .forge-mode-note {
  border: 1px solid rgba(72, 170, 222, 0.45) !important;
  border-radius: 8px !important;
  background: linear-gradient(145deg, rgba(7, 24, 38, 0.96), rgba(3, 12, 22, 0.98)) !important;
  box-shadow: inset 0 0 34px rgba(43, 168, 227, 0.09) !important;
}

.upgrade-forge-screen .forge-resource-card {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
}

.upgrade-forge-screen .forge-resource-card.ready {
  border-color: rgba(42, 229, 158, 0.7) !important;
}

.upgrade-forge-screen .forge-resource-card.blocked {
  border-color: rgba(255, 184, 74, 0.55) !important;
}

.upgrade-forge-screen .forge-resource-card.empty {
  min-height: 120px !important;
  color: #eaf7ff !important;
  text-align: left !important;
}

.upgrade-forge-screen .forge-resource-main {
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-resource-main img {
  width: 58px !important;
  height: 58px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 24px rgba(73, 219, 255, 0.4)) !important;
}

.upgrade-forge-screen .forge-resource-main span,
.upgrade-forge-screen .forge-mode-note span {
  display: block !important;
  color: #86e8ff !important;
  font: 0.72rem var(--font-title) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-resource-main strong,
.upgrade-forge-screen .forge-mode-note strong {
  display: block !important;
  margin-top: 5px !important;
  color: #fff !important;
  font: 1rem var(--font-title) !important;
  letter-spacing: 0 !important;
}

.upgrade-forge-screen .forge-resource-main small,
.upgrade-forge-screen .forge-mode-note p {
  display: block !important;
  margin-top: 7px !important;
  color: #b8cde0 !important;
  font: 0.82rem var(--font-body) !important;
  line-height: 1.35 !important;
}

.upgrade-forge-screen .forge-resource-counts {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-resource-counts div {
  min-height: 52px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(72, 170, 222, 0.42) !important;
  border-radius: 8px !important;
  background: rgba(8, 28, 44, 0.72) !important;
}

.upgrade-forge-screen .forge-resource-counts span {
  display: block !important;
  color: #8eb2c8 !important;
  font: 0.68rem var(--font-title) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

.upgrade-forge-screen .forge-resource-counts strong {
  display: block !important;
  margin-top: 6px !important;
  color: #fff !important;
  font: 1.05rem var(--font-title) !important;
}

.upgrade-forge-screen .forge-core-panel {
  margin-top: 12px !important;
}

.upgrade-forge-screen .forge-mode-note {
  padding: 16px !important;
}

.upgrade-forge-screen .forge-mode-note.blocked {
  border-color: rgba(255, 184, 74, 0.52) !important;
}

.upgrade-forge-screen .forge-summary-bar {
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 220px) !important;
  align-items: stretch !important;
}

@media (max-width: 980px) {
  .upgrade-forge-screen .forge-top-stats,
  .upgrade-forge-screen .upgrade-forge-layout,
  .upgrade-forge-screen .forge-summary-bar {
    grid-template-columns: 1fr !important;
  }
}
/* Forge clarity final override. */
.upgrade-forge-screen .forge-selected-panel,
.upgrade-forge-screen .forge-materials-panel,
.upgrade-forge-screen .forge-chamber-panel {
  padding: 14px !important;
}

.upgrade-forge-screen .forge-selected-card {
  grid-template-columns: 92px minmax(0, 1fr) !important;
  padding: 12px !important;
  overflow: visible !important;
}

.upgrade-forge-screen .forge-selected-info p {
  display: none !important;
}

.upgrade-forge-screen .forge-chamber.ready {
  border-color: rgba(96, 223, 255, 0.62) !important;
  box-shadow: inset 0 0 36px rgba(56, 196, 255, 0.13), 0 0 22px rgba(72, 202, 255, 0.13) !important;
}

.upgrade-forge-screen .forge-chamber.missing-materials {
  opacity: 0.78 !important;
  filter: saturate(0.72) brightness(0.82) !important;
}

.upgrade-forge-screen .forge-chamber.upgrading {
  border-color: rgba(126, 223, 255, 0.92) !important;
  box-shadow: inset 0 0 52px rgba(96, 223, 255, 0.18), 0 0 30px rgba(96, 223, 255, 0.22) !important;
}

.upgrade-forge-screen .forge-chamber img {
  width: min(68%, 470px) !important;
  height: min(200px, 66%) !important;
  max-height: 200px !important;
}

.upgrade-forge-screen .forge-mode-card.active {
  border-color: rgba(126, 223, 255, 0.96) !important;
  background: linear-gradient(180deg, rgba(22, 92, 138, 0.86), rgba(6, 35, 62, 0.96)) !important;
  box-shadow: inset 0 0 24px rgba(126, 223, 255, 0.16), 0 0 22px rgba(78, 212, 255, 0.22) !important;
}

.upgrade-forge-screen .forge-mode-card.active::after {
  content: "ACTIVE";
  position: absolute;
  top: 8px;
  right: 10px;
  color: #80f0ff;
  font-size: 0.58rem;
  font-weight: 1000;
  letter-spacing: 0.1em;
}

.upgrade-forge-screen .forge-mode-card {
  position: relative !important;
  min-height: 58px !important;
}

.upgrade-forge-screen .forge-mode-card.disabled {
  opacity: 0.58 !important;
}

.upgrade-forge-screen .forge-compare-card {
  display: grid !important;
  gap: 5px !important;
  padding: 9px 10px !important;
  border: 0 !important;
  border-left: 2px solid rgba(126, 223, 255, 0.32) !important;
  background: rgba(4, 17, 30, 0.58) !important;
}

.upgrade-forge-screen .forge-compare-card.after {
  border-left-color: rgba(52, 229, 154, 0.75) !important;
  background: rgba(5, 28, 34, 0.62) !important;
}

.upgrade-forge-screen .forge-compare-card div,
.upgrade-forge-screen .forge-result-preview div {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
  color: rgba(220, 238, 250, 0.8) !important;
  font-size: 0.72rem !important;
}

.upgrade-forge-screen .forge-resource-counts {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.upgrade-forge-screen .forge-result-preview {
  display: grid !important;
  gap: 6px !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(126, 223, 255, 0.14) !important;
}

.upgrade-forge-screen .forge-result-preview > span {
  color: #86e8ff !important;
  font-size: 0.68rem !important;
  font-weight: 1000 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-result-preview > strong {
  color: #ffffff !important;
  font: 0.98rem var(--font-title) !important;
}

.upgrade-forge-screen .forge-summary-bar {
  grid-template-columns: minmax(0, 1fr) minmax(170px, 210px) !important;
  gap: 10px !important;
  padding: 9px 10px !important;
}

.upgrade-forge-screen .forge-summary-bar > div {
  border: 0 !important;
  border-left: 2px solid rgba(126, 223, 255, 0.42) !important;
  background: rgba(4, 17, 30, 0.66) !important;
}

.upgrade-forge-screen .forge-start-btn {
  min-height: 54px !important;
  background: linear-gradient(180deg, #218ad3, #145da4) !important;
  box-shadow: 0 0 24px rgba(70, 202, 255, 0.22), inset 0 0 16px rgba(255, 255, 255, 0.09) !important;
}

.upgrade-forge-screen .forge-start-btn:not(:disabled):hover {
  background: linear-gradient(180deg, #2ba9ef, #176bb8) !important;
}

.upgrade-forge-screen .forge-start-btn:disabled {
  opacity: 0.56 !important;
  background: linear-gradient(180deg, rgba(87, 72, 42, 0.92), rgba(58, 42, 20, 0.96)) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* Final Forge viewport polish: this must stay after the older Forge overrides. */
.upgrade-forge-screen {
  background-color: #020814 !important;
  background-image:
    linear-gradient(180deg, rgba(2, 8, 18, 0.52), rgba(1, 6, 14, 0.84)),
    radial-gradient(circle at 50% 22%, rgba(70, 188, 255, 0.2), transparent 42%),
    linear-gradient(90deg, rgba(1, 6, 14, 0.48), transparent 22%, transparent 78%, rgba(1, 6, 14, 0.5)),
    url("assets/ui/forge/forge-background.png") !important;
  background-size: cover, cover, cover, cover !important;
  background-position: center center, center center, center center, center center !important;
  background-repeat: no-repeat !important;
}

.upgrade-forge-screen .forge-panel {
  background:
    linear-gradient(180deg, rgba(3, 17, 31, 0.84), rgba(1, 9, 19, 0.91)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(120, 219, 255, 0.08),
    0 10px 24px rgba(0, 0, 0, 0.26) !important;
}

.upgrade-forge-screen .forge-selected-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 12px !important;
  overflow: hidden !important;
}

.upgrade-forge-screen .forge-selected-panel .modern-store-panel-header {
  padding: 0 6px !important;
}

.upgrade-forge-screen .forge-selected-panel .modern-store-panel-header span {
  color: #57dfff !important;
  font-size: 1.08rem !important;
  letter-spacing: 0.18em !important;
}

.upgrade-forge-screen .forge-selected-body {
  display: grid !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.upgrade-forge-screen .forge-selected-card--stack {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(130px, 0.85fr) minmax(0, 1fr) !important;
  gap: 9px !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 18px 20px 14px !important;
  border: 1px solid var(--quality-accent, #ff8a47) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 50% 35%, rgba(var(--quality-rgb, 255, 138, 71), 0.19), transparent 43%),
    linear-gradient(180deg, rgba(7, 21, 36, 0.96), rgba(2, 9, 18, 0.98)) !important;
  box-shadow:
    inset 0 0 28px rgba(70, 185, 255, 0.05),
    0 0 16px rgba(var(--quality-rgb, 255, 138, 71), 0.1) !important;
}

.upgrade-forge-screen .forge-selected-heading {
  display: grid !important;
  justify-items: center !important;
  gap: 9px !important;
  text-align: center !important;
}

.upgrade-forge-screen .forge-selected-heading h3 {
  max-width: 100% !important;
  margin: 0 !important;
  color: #f8fbff !important;
  font-size: 1.08rem !important;
  line-height: 1.18 !important;
  text-wrap: balance !important;
}

.upgrade-forge-screen .forge-selected-heading .forge-item-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 8px !important;
}

.upgrade-forge-screen .forge-selected-heading .forge-item-badges span {
  min-width: 74px !important;
  justify-content: center !important;
  border-radius: 999px !important;
  padding: 6px 12px !important;
  text-align: center !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  min-height: 128px !important;
  height: 100% !important;
  overflow: visible !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art::after {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  bottom: 7%;
  height: 22px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(var(--quality-rgb, 255, 138, 71), 0.34), transparent 72%);
  filter: blur(2px);
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art img {
  position: relative !important;
  z-index: 1 !important;
  width: auto !important;
  max-width: 100% !important;
  max-height: 140px !important;
  object-fit: contain !important;
  transform: scale(1.12) !important;
  filter:
    brightness(1.1)
    drop-shadow(0 0 18px rgba(var(--quality-rgb, 255, 138, 71), 0.34))
    drop-shadow(0 12px 20px rgba(0, 0, 0, 0.68)) !important;
}

.upgrade-forge-screen .forge-selected-card--stack > .forge-selected-info:last-child {
  display: flex !important;
  min-height: 0 !important;
  flex-direction: column !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats {
  display: grid !important;
  gap: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-row {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: center !important;
  min-height: 37px !important;
  padding: 5px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(126, 223, 255, 0.13) !important;
  background: transparent !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-row:last-child {
  border-bottom: 0 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon {
  position: relative !important;
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  color: rgba(171, 195, 220, 0.9) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-quality {
  width: 16px !important;
  height: 16px !important;
  margin-left: 3px !important;
  border: 2px solid currentColor !important;
  transform: rotate(45deg) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-quality::after {
  content: "";
  position: absolute;
  inset: 4px;
  border: 2px solid currentColor;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-level::before,
.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-level::after {
  content: "";
  position: absolute;
  left: 3px;
  width: 15px;
  height: 15px;
  border-top: 3px solid currentColor;
  border-left: 3px solid currentColor;
  transform: rotate(45deg);
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-level::before {
  top: 0;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-level::after {
  top: 8px;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-damage {
  border: 2px solid currentColor !important;
  border-radius: 50% !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-damage::before,
.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-damage::after {
  content: "";
  position: absolute;
  background: currentColor;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-damage::before {
  left: 50%;
  top: -5px;
  bottom: -5px;
  width: 2px;
  transform: translateX(-50%);
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-damage::after {
  left: -5px;
  right: -5px;
  top: 50%;
  height: 2px;
  transform: translateY(-50%);
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-fire-rate {
  clip-path: polygon(52% 0, 18% 52%, 44% 52%, 35% 100%, 82% 38%, 56% 38%);
  background: currentColor !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-shield,
.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-armour,
.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-armor,
.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-hull,
.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-evasion,
.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-speed,
.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon-effect {
  border: 2px solid currentColor !important;
  border-radius: 7px !important;
  transform: rotate(45deg) scale(0.82) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-label {
  color: rgba(186, 213, 238, 0.88) !important;
  font-size: 0.86rem !important;
  line-height: 1 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-row strong {
  color: #f7fbff !important;
  font-size: 0.92rem !important;
  line-height: 1 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-row-quality strong {
  color: var(--quality-accent, #ff8a47) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-change-item-btn {
  width: 100% !important;
  min-height: 34px !important;
  margin-top: auto !important;
  border-radius: 8px !important;
}

.upgrade-forge-screen .forge-chamber-panel {
  grid-template-rows: auto minmax(165px, 190px) auto auto !important;
  gap: 7px !important;
  padding: 10px 12px !important;
}

.upgrade-forge-screen .forge-chamber-visual,
.upgrade-forge-screen .forge-chamber-visual.missing-materials {
  aspect-ratio: 12 / 4.2 !important;
  min-height: 165px !important;
  max-height: 190px !important;
  height: auto !important;
  opacity: 1 !important;
  filter: none !important;
  border-color: rgba(92, 205, 255, 0.36) !important;
  box-shadow: inset 0 0 34px rgba(58, 178, 255, 0.12), 0 0 18px rgba(58, 178, 255, 0.1) !important;
}

.upgrade-forge-screen .forge-chamber-bg,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  background-image: url("assets/ui/forge/forge-chamber.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  transform: none !important;
  opacity: 0.94 !important;
  filter: none !important;
}

.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-bg {
  opacity: 0.88 !important;
}

.upgrade-forge-screen .forge-chamber-vignette {
  background:
    radial-gradient(circle at center, rgba(73, 203, 255, 0.18), transparent 46%),
    linear-gradient(180deg, rgba(2, 8, 18, 0.02), rgba(2, 8, 18, 0.28)) !important;
}

.upgrade-forge-screen .forge-chamber-item,
.upgrade-forge-screen .forge-chamber-visual.missing-materials .forge-chamber-item {
  top: 47% !important;
  width: clamp(125px, 28%, 205px) !important;
  max-height: 54% !important;
  opacity: 1 !important;
  filter:
    drop-shadow(0 0 12px rgba(89, 206, 255, 0.55))
    drop-shadow(0 8px 14px rgba(0, 0, 0, 0.72)) !important;
}

.upgrade-forge-screen .forge-chamber-visual.ready .forge-chamber-item {
  filter:
    drop-shadow(0 0 16px rgba(89, 206, 255, 0.85))
    drop-shadow(0 0 24px rgba(137, 100, 255, 0.25))
    drop-shadow(0 8px 14px rgba(0, 0, 0, 0.72)) !important;
}

.upgrade-forge-screen .forge-chamber-visual .forge-ring,
.upgrade-forge-screen .forge-chamber-visual .forge-beam,
.upgrade-forge-screen .forge-chamber-visual .forge-scanline,
.upgrade-forge-screen .forge-chamber-visual .forge-particles {
  opacity: 0.38 !important;
}

.upgrade-forge-screen .forge-state-preview {
  gap: 7px !important;
  margin-top: 0 !important;
}

.upgrade-forge-screen .forge-compare-card {
  gap: 3px !important;
  padding: 7px 9px !important;
}

.upgrade-forge-screen .forge-compare-card strong {
  font-size: 0.92rem !important;
  line-height: 1.05 !important;
}

.upgrade-forge-screen .forge-compare-card div {
  min-height: 26px !important;
  padding: 4px 8px !important;
  border: 1px solid rgba(126, 223, 255, 0.22) !important;
  border-radius: 7px !important;
  background: rgba(4, 17, 30, 0.62) !important;
}

.upgrade-forge-screen .forge-mode-switch {
  gap: 7px !important;
}

.upgrade-forge-screen .forge-mode-card,
.upgrade-forge-screen .forge-mode-switch button {
  min-height: 42px !important;
  padding: 8px 10px !important;
}

.upgrade-forge-screen .forge-mode-card span {
  font-size: 0.66rem !important;
}
.upgrade-forge-screen .forge-chamber-visual.quality-active .forge-chamber-vignette {
  background:
    radial-gradient(circle at center, rgba(125, 84, 255, 0.07), transparent 35%),
    linear-gradient(90deg, rgba(1, 8, 18, 0.35), transparent 24%, transparent 76%, rgba(1, 8, 18, 0.35)),
    linear-gradient(180deg, rgba(1, 8, 18, 0.08), rgba(1, 8, 18, 0.26)) !important;
}

.upgrade-forge-screen .forge-chamber-visual.level-active .forge-chamber-vignette {
  background:
    radial-gradient(circle at center, rgba(60, 180, 255, 0.06), transparent 35%),
    linear-gradient(90deg, rgba(1, 8, 18, 0.35), transparent 24%, transparent 76%, rgba(1, 8, 18, 0.35)),
    linear-gradient(180deg, rgba(1, 8, 18, 0.08), rgba(1, 8, 18, 0.26)) !important;
}

/* Selected item compact fit. */
.upgrade-forge-screen .forge-selected-panel {
  gap: 8px !important;
}

.upgrade-forge-screen .forge-selected-panel .modern-store-panel-header span {
  font-size: 1rem !important;
}

.upgrade-forge-screen .forge-selected-card--stack {
  grid-template-rows: auto minmax(102px, 0.62fr) minmax(0, 1fr) !important;
  gap: 6px !important;
  padding: 14px 20px 12px !important;
}

.upgrade-forge-screen .forge-selected-heading {
  gap: 7px !important;
}

.upgrade-forge-screen .forge-selected-heading h3 {
  font-size: 0.98rem !important;
  line-height: 1.1 !important;
}

.upgrade-forge-screen .forge-selected-heading .forge-item-badges span {
  min-width: 70px !important;
  padding: 5px 10px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art {
  min-height: 102px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art::after {
  bottom: 4% !important;
  height: 17px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-selected-art img {
  max-height: 112px !important;
  transform: scale(1.04) !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-row {
  grid-template-columns: 26px minmax(0, 1fr) auto !important;
  gap: 8px !important;
  min-height: 31px !important;
  padding: 3px 0 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-icon {
  width: 20px !important;
  height: 20px !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-label {
  font-size: 0.78rem !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-stat-row strong {
  font-size: 0.82rem !important;
}

.upgrade-forge-screen .forge-selected-card--stack > .forge-selected-info:last-child {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-core-stats {
  flex: 0 0 auto !important;
}

.upgrade-forge-screen .forge-selected-card--stack .forge-change-item-btn {
  min-height: 31px !important;
  margin-top: auto !important;
  padding: 6px 10px !important;
  font-size: 0.72rem !important;
}

/* Upgrade slot clarity pass. */
.upgrade-forge-screen .forge-materials-panel {
  display: grid !important;
  grid-template-rows: auto auto auto !important;
  align-content: start !important;
  gap: 10px !important;
}

.upgrade-forge-screen .forge-materials-list,
.upgrade-forge-screen .forge-core-panel {
  display: block !important;
  min-height: 0 !important;
  overflow: visible !important;
}

.upgrade-forge-screen .forge-upgrade-slot-card {
  display: grid !important;
  gap: 12px !important;
  padding: 13px !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 30% 18%, rgba(87, 218, 255, 0.12), transparent 38%),
    linear-gradient(145deg, rgba(7, 24, 38, 0.94), rgba(3, 12, 22, 0.98)) !important;
}

.upgrade-forge-screen .forge-upgrade-head {
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
}

.upgrade-forge-screen .forge-upgrade-head img {
  width: 56px !important;
  height: 64px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 22px rgba(73, 219, 255, 0.42)) !important;
}

.upgrade-forge-screen .forge-upgrade-head > div {
  min-width: 0 !important;
}

.upgrade-forge-screen .forge-upgrade-head span {
  display: block !important;
  color: #86e8ff !important;
  font: 0.84rem var(--font-title) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-upgrade-head strong {
  display: block !important;
  margin-top: 3px !important;
  color: #ffffff !important;
  font-size: 0.96rem !important;
  line-height: 1.1 !important;
}

.upgrade-forge-screen .forge-upgrade-head small {
  display: block !important;
  margin-top: 6px !important;
  color: rgba(221, 238, 250, 0.82) !important;
  font-size: 0.82rem !important;
  line-height: 1.35 !important;
}

.upgrade-forge-screen .forge-material-summary {
  display: grid !important;
  gap: 0 !important;
  padding: 2px 10px !important;
  border: 1px solid rgba(126, 223, 255, 0.18) !important;
  border-radius: 8px !important;
  background: rgba(3, 14, 26, 0.58) !important;
}

.upgrade-forge-screen .forge-material-summary div {
  display: flex !important;
  min-height: 34px !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  border-bottom: 1px solid rgba(126, 223, 255, 0.11) !important;
}

.upgrade-forge-screen .forge-material-summary div:last-child {
  border-bottom: 0 !important;
}

.upgrade-forge-screen .forge-material-summary span,
.upgrade-forge-screen .forge-upgrade-result > span,
.upgrade-forge-screen .forge-upgrade-confirm > span {
  color: #86e8ff !important;
  font-size: 0.68rem !important;
  font-weight: 1000 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

.upgrade-forge-screen .forge-material-summary strong {
  min-width: 0 !important;
  max-width: 62% !important;
  color: #ffffff !important;
  font-size: 0.86rem !important;
  line-height: 1.15 !important;
  text-align: right !important;
}

.upgrade-forge-screen .forge-material-summary .ready strong {
  color: #55f2ad !important;
}

.upgrade-forge-screen .forge-material-summary .blocked strong {
  color: #ffbd6f !important;
}

.upgrade-forge-screen .forge-upgrade-result {
  display: grid !important;
  gap: 6px !important;
  padding-top: 2px !important;
}

.upgrade-forge-screen .forge-upgrade-result > strong {
  color: #ffffff !important;
  font-size: 0.92rem !important;
  line-height: 1.1 !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats {
  display: grid !important;
  gap: 4px !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats div {
  display: flex !important;
  min-height: 24px !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 3px 7px !important;
  border: 1px solid rgba(126, 223, 255, 0.15) !important;
  border-radius: 6px !important;
  background: rgba(4, 17, 30, 0.54) !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats span {
  color: rgba(204, 228, 244, 0.78) !important;
  font-size: 0.72rem !important;
}

.upgrade-forge-screen .forge-upgrade-result-stats strong {
  color: #f8fbff !important;
  font-size: 0.76rem !important;
  text-align: right !important;
}

.upgrade-forge-screen .forge-upgrade-confirm {
  display: grid !important;
  gap: 8px !important;
  padding-top: 2px !important;
  align-content: start !important;
}

.upgrade-forge-screen .forge-upgrade-confirm > span {
  color: #8ff8ff !important;
}

.upgrade-forge-screen .forge-upgrade-confirm.blocked > span {
  color: #ffbd6f !important;
}

.upgrade-forge-screen .forge-upgrade-confirm .forge-start-btn {
  width: 100% !important;
  min-height: 48px !important;
  margin: 0 !important;
  border-radius: 9px !important;
}
/* Forge mode polish: keep chamber item sizing identical across upgrade modes. */
.upgrade-forge-screen #forgeChamber.forge-chamber-visual .forge-chamber-item,
.upgrade-forge-screen #forgeChamber.forge-chamber-visual.level-active .forge-chamber-item,
.upgrade-forge-screen #forgeChamber.forge-chamber-visual.quality-active .forge-chamber-item,
.upgrade-forge-screen #forgeChamber.forge-chamber-visual.missing-materials .forge-chamber-item,
.upgrade-forge-screen #forgeChamber.forge-chamber-visual.ready .forge-chamber-item {
  left: 50% !important;
  top: 47% !important;
  width: clamp(130px, 29%, 210px) !important;
  height: auto !important;
  max-width: 210px !important;
  max-height: 58% !important;
  object-fit: contain !important;
  opacity: 1 !important;
}

.upgrade-forge-screen #forgeLevelModeBtn {
  --forge-mode-accent: #7ee8ff;
  --forge-mode-soft: rgba(75, 196, 255, 0.18);
}

.upgrade-forge-screen #forgeQualityModeBtn {
  --forge-mode-accent: #c89aff;
  --forge-mode-soft: rgba(179, 104, 255, 0.2);
}

.upgrade-forge-screen #forgeLevelModeBtn:not(.active) {
  color: #e8fbff !important;
}

.upgrade-forge-screen #forgeQualityModeBtn:not(.active) {
  color: #eadcff !important;
}

.upgrade-forge-screen #forgeQualityModeBtn span {
  color: rgba(226, 203, 255, 0.72) !important;
}

.upgrade-forge-screen #forgeLevelModeBtn.active {
  border-color: #7ee8ff !important;
  background: linear-gradient(180deg, rgba(75, 196, 255, 0.2), rgba(6, 35, 62, 0.95)) !important;
  box-shadow: inset 0 0 24px rgba(75, 196, 255, 0.18), 0 0 22px rgba(75, 196, 255, 0.18) !important;
}

.upgrade-forge-screen #forgeQualityModeBtn.active {
  color: #f2e8ff !important;
  border-color: #c89aff !important;
  background: linear-gradient(180deg, rgba(179, 104, 255, 0.22), rgba(34, 18, 62, 0.95)) !important;
  box-shadow: inset 0 0 24px rgba(179, 104, 255, 0.2), 0 0 22px rgba(179, 104, 255, 0.18) !important;
  text-shadow: 0 0 12px rgba(190, 125, 255, 0.28) !important;
}

.upgrade-forge-screen #forgeLevelModeBtn.active::after {
  color: #7ee8ff !important;
}

.upgrade-forge-screen #forgeQualityModeBtn.active::after {
  color: #d7b3ff !important;
}

/* Final Forge label cleanup. */
.upgrade-forge-screen .forge-chamber-title {
  justify-content: flex-start !important;
}

.upgrade-forge-screen .forge-chamber-title small {
  display: none !important;
}

.upgrade-forge-screen .forge-upgrade-confirm {
  gap: 0 !important;
  padding-top: 0 !important;
}

.upgrade-forge-screen .forge-upgrade-confirm > span {
  display: none !important;
}
/* ===== Pilot Profile command deck background ===== */
#pilotProfileScreen.pilot-profile-screen {
  background-color: #020814 !important;
  background-image:
    linear-gradient(180deg, rgba(1, 8, 18, 0.26), rgba(1, 8, 18, 0.62)),
    radial-gradient(circle at 50% 42%, rgba(64, 180, 255, 0.08), transparent 46%),
    linear-gradient(90deg, rgba(1, 6, 14, 0.46), transparent 22%, transparent 78%, rgba(1, 6, 14, 0.5)),
    url("assets/backgrounds/pilot-background.png") !important;
  background-size: cover, cover, cover, cover !important;
  background-position: center center, center center, center center, center center !important;
  background-repeat: no-repeat !important;
}

#pilotProfileScreen.pilot-profile-screen .market-header {
  position: relative;
  z-index: 1;
  margin-bottom: 16px;
  text-shadow: 0 0 18px rgba(0, 0, 0, 0.72);
}

#pilotProfileScreen.pilot-profile-screen .market-header h2 {
  color: #f7fdff;
  text-shadow: 0 0 24px rgba(0, 190, 255, 0.18);
}

#pilotProfileScreen.pilot-profile-screen .screen-back-btn {
  border-color: rgba(127, 223, 255, 0.42);
  background: linear-gradient(180deg, rgba(4, 27, 48, 0.9), rgba(0, 8, 20, 0.92));
}

#pilotProfileScreen .pilot-profile-body {
  position: relative;
  z-index: 1;
}

#pilotProfileScreen .pilot-dashboard-hero,
#pilotProfileScreen .pilot-dashboard-grid,
#pilotProfileScreen .pilot-progression-card,
#pilotProfileScreen .pilot-future-card {
  background:
    radial-gradient(circle at 18% 0%, rgba(127, 223, 255, 0.10), transparent 36%),
    linear-gradient(145deg, rgba(7, 18, 32, 0.76), rgba(0, 6, 14, 0.82)) !important;
  border-color: rgba(112, 215, 255, 0.34) !important;
  box-shadow:
    inset 0 1px 0 rgba(160, 230, 255, 0.08),
    0 0 24px rgba(0, 160, 255, 0.08) !important;
  backdrop-filter: blur(3px);
}

#pilotProfileScreen .pilot-stat-card,
#pilotProfileScreen .future-profile-grid div {
  background:
    radial-gradient(circle at 82% 12%, rgba(127, 223, 255, 0.12), transparent 44%),
    linear-gradient(145deg, rgba(8, 25, 44, 0.70), rgba(1, 9, 20, 0.76)) !important;
}

/* ===== Ambitious Pilot Profile UI rebuild ===== */
#pilotProfileScreen.pilot-profile-screen.active {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 16px;
  height: 665px;
  padding: 28px 44px 30px;
  overflow: hidden !important;
}

#pilotProfileScreen.pilot-profile-screen::before {
  content: "";
  position: absolute;
  inset: 14px;
  z-index: 0;
  pointer-events: none;
  border: 1px solid rgba(104, 211, 255, 0.42);
  border-radius: 6px;
  clip-path: polygon(18px 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 18px 100%, 0 calc(100% - 18px), 0 18px);
  box-shadow:
    inset 0 0 0 1px rgba(48, 150, 220, 0.16),
    0 0 34px rgba(25, 155, 235, 0.14);
}

#pilotProfileScreen.pilot-profile-screen .market-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 22px;
  margin: 0 !important;
}

#pilotProfileScreen.pilot-profile-screen .market-header p {
  margin-bottom: 9px;
  color: #4cb7ff;
  font-size: 0.86rem;
  letter-spacing: 0.28em;
}

#pilotProfileScreen.pilot-profile-screen .market-header h2 {
  max-width: 900px;
  font-size: clamp(38px, 4.1vw, 58px);
  line-height: 0.92;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#pilotProfileScreen.pilot-profile-screen .screen-back-btn {
  width: 112px;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 6px;
  clip-path: polygon(13px 0, 100% 0, 100% calc(100% - 13px), calc(100% - 13px) 100%, 0 100%, 0 13px);
  font-size: 0.98rem;
}

#pilotProfileScreen.pilot-profile-screen .screen-back-btn::before {
  content: "<";
  margin-right: 12px;
  color: #79dbff;
  font-size: 1.4rem;
  line-height: 0;
}

#pilotProfileScreen .pilot-profile-body {
  height: auto !important;
  grid-template-rows: minmax(150px, 0.9fr) minmax(94px, auto) minmax(0, 1.45fr) !important;
  gap: 14px !important;
  overflow: hidden !important;
}

#pilotProfileScreen .pilot-dashboard-hero,
#pilotProfileScreen .pilot-dashboard-grid,
#pilotProfileScreen .pilot-progression-card,
#pilotProfileScreen .pilot-future-card {
  border-radius: 6px !important;
  clip-path: polygon(18px 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 18px 100%, 0 calc(100% - 18px), 0 18px);
}

#pilotProfileScreen .pilot-dashboard-hero {
  grid-template-columns: 156px minmax(220px, 0.72fr) minmax(0, 1.45fr) !important;
  gap: 22px !important;
  padding: 20px 28px !important;
  align-items: center;
  min-height: 0;
  border-width: 2px !important;
}

.pilot-badge-frame {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  height: 128px;
}

.pilot-badge-frame::before {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(84, 201, 255, 0.18);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(82, 203, 255, 0.16), transparent 58%),
    repeating-radial-gradient(circle, rgba(127, 223, 255, 0.10) 0 1px, transparent 1px 12px);
}

.pilot-badge-frame img {
  position: relative;
  z-index: 1;
  width: 132px;
  height: 132px;
  object-fit: contain;
  filter: drop-shadow(0 0 24px rgba(72, 203, 255, 0.28));
}

#pilotProfileScreen .pilot-identity-block {
  padding-left: 22px;
  border-left: 1px solid rgba(93, 196, 255, 0.42);
}

#pilotProfileScreen .pilot-identity-block .drawer-kicker,
#pilotProfileScreen .pilot-level-block span,
#pilotProfileScreen .profile-tree-head span,
#pilotProfileScreen .pilot-stat-card span {
  color: #4cb7ff;
  letter-spacing: 0.18em;
}

#pilotProfileScreen .pilot-identity-block strong {
  font-size: clamp(30px, 3.2vw, 44px);
  line-height: 1.02;
  text-shadow: 0 3px 18px rgba(0, 0, 0, 0.8);
}

#pilotProfileScreen .pilot-identity-block small {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #69c7ff;
  font-size: 0.95rem;
}

#pilotProfileScreen .pilot-identity-block small img {
  width: 26px;
  height: 26px;
  object-fit: contain;
}

#pilotProfileScreen .pilot-level-block {
  padding-left: 34px;
  border-left: 1px solid rgba(93, 196, 255, 0.34);
}

#pilotProfileScreen .pilot-level-block > div:first-child {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px 20px;
  align-items: end;
}

#pilotProfileScreen .pilot-level-block span {
  grid-column: 1 / -1;
}

#pilotProfileScreen .pilot-level-block strong {
  font-size: clamp(46px, 5vw, 68px);
}

#pilotProfileScreen .pilot-level-block small {
  align-self: center;
  color: rgba(232, 238, 246, 0.86);
  font-size: 1rem;
}

#pilotProfileScreen .profile-xp-track {
  height: 14px;
  border-color: rgba(225, 234, 248, 0.34);
  border-radius: 4px;
  background: rgba(0, 5, 14, 0.72);
  overflow: hidden;
}

#pilotProfileScreen .profile-xp-track i {
  background:
    linear-gradient(115deg, transparent 0 18%, rgba(255,255,255,0.18) 18% 24%, transparent 24% 38%, rgba(255,255,255,0.12) 38% 44%, transparent 44% 100%),
    linear-gradient(90deg, #ffd15c, #ffec83 62%, #c17615);
  box-shadow: 0 0 16px rgba(255, 203, 74, 0.42);
}

#pilotProfileScreen .pilot-dashboard-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  clip-path: none !important;
  backdrop-filter: none !important;
}

#pilotProfileScreen .pilot-stat-card {
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 92px;
  padding: 11px 13px;
  border-radius: 6px;
  clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%, 0 12px);
  border-color: rgba(95, 180, 235, 0.34);
  border-bottom-color: var(--pilot-accent, rgba(127, 223, 255, 0.55));
  box-shadow: inset 0 -2px 0 var(--pilot-accent-soft, rgba(127, 223, 255, 0.28));
}

#pilotProfileScreen .pilot-stat-card.combat-stat { --pilot-accent: rgba(255, 88, 82, 0.92); --pilot-accent-soft: rgba(255, 88, 82, 0.36); }
#pilotProfileScreen .pilot-stat-card.bounty-stat { --pilot-accent: rgba(255, 203, 74, 0.92); --pilot-accent-soft: rgba(255, 203, 74, 0.36); }
#pilotProfileScreen .pilot-stat-card.profit-stat { --pilot-accent: rgba(92, 255, 171, 0.92); --pilot-accent-soft: rgba(92, 255, 171, 0.36); }
#pilotProfileScreen .pilot-stat-card.cargo-stat { --pilot-accent: rgba(42, 240, 245, 0.92); --pilot-accent-soft: rgba(42, 240, 245, 0.36); }
#pilotProfileScreen .pilot-stat-card.fleet-stat { --pilot-accent: rgba(63, 171, 255, 0.92); --pilot-accent-soft: rgba(63, 171, 255, 0.36); }
#pilotProfileScreen .pilot-stat-card.ship-stat { --pilot-accent: rgba(202, 106, 255, 0.92); --pilot-accent-soft: rgba(202, 106, 255, 0.36); }

#pilotProfileScreen .pilot-stat-icon {
  width: 52px;
  height: 52px;
  object-fit: contain;
  filter: drop-shadow(0 0 12px var(--pilot-accent-soft, rgba(127, 223, 255, 0.28)));
}

#pilotProfileScreen .pilot-stat-card strong {
  margin-top: 3px;
  font-size: clamp(17px, 1.5vw, 24px);
  line-height: 1.05;
}

#pilotProfileScreen .pilot-stat-card small {
  margin-top: 5px;
  color: rgba(215, 229, 244, 0.76);
}

#pilotProfileScreen .pilot-profile-lower {
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr) !important;
  gap: 16px !important;
}

#pilotProfileScreen .pilot-progression-card,
#pilotProfileScreen .pilot-future-card {
  padding: 18px 22px !important;
  gap: 14px !important;
  border-width: 2px !important;
}

#pilotProfileScreen .profile-tree-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}

#pilotProfileScreen .profile-tree-head span {
  color: #4cb7ff;
  font-size: 1.18rem;
  font-weight: 950;
  text-transform: uppercase;
}

#pilotProfileScreen .profile-tree-head strong {
  color: #ffd36b;
  font-size: 0.95rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pilot-combat-progress-panel {
  min-height: 0;
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  padding: 16px 20px;
  border: 1px solid rgba(77, 181, 255, 0.34);
  border-radius: 6px;
  clip-path: polygon(14px 0, calc(100% - 14px) 0, 100% 14px, 100% calc(100% - 14px), calc(100% - 14px) 100%, 14px 100%, 0 calc(100% - 14px), 0 14px);
  background:
    radial-gradient(circle at 18% 30%, rgba(73, 196, 255, 0.12), transparent 38%),
    linear-gradient(145deg, rgba(2, 14, 29, 0.74), rgba(0, 6, 15, 0.84));
}

.pilot-combat-progress-panel > img {
  width: 112px;
  height: 112px;
  object-fit: contain;
  filter: drop-shadow(0 0 22px rgba(73, 196, 255, 0.32));
}

.pilot-combat-progress-panel strong {
  display: block;
  color: #f7fbff;
  font-size: 1.8rem;
  line-height: 1.05;
}

.pilot-combat-progress-panel em {
  display: block;
  margin: 5px 0 12px;
  color: rgba(226, 236, 248, 0.86);
  font-style: normal;
  font-size: 1rem;
}

.pilot-combat-progress-panel p {
  margin: 14px 0 0;
  padding-top: 11px;
  border-top: 1px solid rgba(88, 193, 255, 0.28);
  color: rgba(220, 232, 244, 0.82);
  font-size: 0.95rem;
  line-height: 1.38;
}

.pilot-combat-progress-panel b {
  color: #4cb7ff;
}

#pilotProfileScreen .future-profile-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

#pilotProfileScreen .future-profile-grid .future-pilot-card {
  min-height: 0;
  padding: 12px 14px 16px;
  justify-items: center;
  align-content: start;
  text-align: center;
  border-color: rgba(77, 181, 255, 0.30);
  clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 12px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%, 0 calc(100% - 12px), 0 12px);
}

.future-pilot-card img {
  width: 74px;
  height: 74px;
  object-fit: contain;
  margin-bottom: 4px;
  filter: drop-shadow(0 0 18px rgba(73, 196, 255, 0.22));
}

#pilotProfileScreen .future-pilot-card strong {
  color: #f7fbff;
  font-size: 1.16rem;
}

#pilotProfileScreen .future-pilot-card small {
  color: rgba(220, 232, 244, 0.78);
  font-size: 0.78rem;
  line-height: 1.28;
}

.future-pilot-card em {
  align-self: end;
  margin-top: 8px;
  padding: 4px 8px;
  border: 1px solid rgba(255, 211, 107, 0.38);
  border-radius: 999px;
  color: #ffd36b;
  background: rgba(4, 9, 16, 0.72);
  font-style: normal;
  font-size: 0.55rem;
  font-weight: 950;
  letter-spacing: 0.12em;
}

@media (max-width: 1120px) {
  #pilotProfileScreen.pilot-profile-screen.active {
    padding: 22px;
    overflow: auto !important;
  }

  #pilotProfileScreen .pilot-profile-body,
  #pilotProfileScreen .pilot-profile-lower {
    overflow: visible !important;
  }

  #pilotProfileScreen .pilot-dashboard-hero,
  #pilotProfileScreen .pilot-profile-lower {
    grid-template-columns: 1fr !important;
  }

  #pilotProfileScreen .pilot-dashboard-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* ===== Pilot Profile no-scroll fit pass ===== */
#pilotProfileScreen.pilot-profile-screen.active {
  gap: 10px !important;
  padding: 18px 32px 20px !important;
  overflow: hidden !important;
}

#pilotProfileScreen.pilot-profile-screen .market-header p {
  margin-bottom: 5px !important;
  font-size: 0.78rem !important;
}

#pilotProfileScreen.pilot-profile-screen .market-header h2 {
  font-size: clamp(34px, 3.7vw, 50px) !important;
  line-height: 0.9 !important;
}

#pilotProfileScreen.pilot-profile-screen .screen-back-btn {
  width: 106px !important;
  min-height: 38px !important;
  font-size: 0.9rem !important;
}

#pilotProfileScreen .pilot-profile-body {
  grid-template-rows: 136px 82px minmax(0, 1fr) !important;
  gap: 10px !important;
  overflow: hidden !important;
}

#pilotProfileScreen .pilot-dashboard-hero {
  grid-template-columns: 122px minmax(180px, 0.72fr) minmax(0, 1.48fr) !important;
  gap: 16px !important;
  padding: 13px 22px !important;
}

#pilotProfileScreen .pilot-badge-frame {
  height: 106px !important;
}

#pilotProfileScreen .pilot-badge-frame img {
  width: 106px !important;
  height: 106px !important;
}

#pilotProfileScreen .pilot-identity-block {
  padding-left: 16px !important;
}

#pilotProfileScreen .pilot-identity-block strong {
  font-size: clamp(28px, 2.8vw, 38px) !important;
}

#pilotProfileScreen .pilot-identity-block small {
  max-width: 100%;
  font-size: 0.86rem !important;
  line-height: 1.18;
}

#pilotProfileScreen .pilot-identity-block small img {
  width: 20px !important;
  height: 20px !important;
}

#pilotProfileScreen .pilot-level-block {
  gap: 6px !important;
  padding-left: 24px !important;
}

#pilotProfileScreen .pilot-level-block > div:first-child {
  gap: 6px 14px !important;
}

#pilotProfileScreen .pilot-level-block strong {
  font-size: clamp(40px, 4.4vw, 58px) !important;
}

#pilotProfileScreen .pilot-level-block small {
  font-size: 0.92rem !important;
}

#pilotProfileScreen .pilot-level-block p {
  font-size: 0.8rem !important;
  line-height: 1.18;
}

#pilotProfileScreen .profile-xp-track {
  height: 11px !important;
}

#pilotProfileScreen .pilot-dashboard-grid {
  gap: 7px !important;
}

#pilotProfileScreen .pilot-stat-card {
  grid-template-columns: 42px minmax(0, 1fr) !important;
  gap: 8px !important;
  min-height: 82px !important;
  height: 82px !important;
  padding: 8px 10px !important;
  align-content: center;
}

#pilotProfileScreen .pilot-stat-icon {
  width: 42px !important;
  height: 42px !important;
}

#pilotProfileScreen .pilot-stat-card span {
  display: block;
  font-size: 0.58rem !important;
  line-height: 1.16;
}

#pilotProfileScreen .pilot-stat-card strong {
  display: block;
  max-width: 100%;
  margin-top: 2px !important;
  font-size: clamp(15px, 1.25vw, 21px) !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#pilotProfileScreen .pilot-stat-card small {
  display: block;
  margin-top: 3px !important;
  font-size: 0.64rem !important;
  line-height: 1.2;
}

#pilotProfileScreen .pilot-profile-lower {
  gap: 12px !important;
  overflow: hidden !important;
}

#pilotProfileScreen .pilot-progression-card,
#pilotProfileScreen .pilot-future-card {
  gap: 10px !important;
  padding: 14px 18px !important;
  overflow: hidden !important;
}

#pilotProfileScreen .profile-tree-head span {
  font-size: 1rem !important;
}

#pilotProfileScreen .profile-tree-head strong {
  font-size: 0.82rem !important;
}

#pilotProfileScreen .pilot-combat-progress-panel {
  grid-template-columns: 86px minmax(0, 1fr) !important;
  gap: 14px !important;
  height: 100%;
  min-height: 0;
  padding: 12px 16px !important;
  align-items: center;
  align-self: stretch;
}

#pilotProfileScreen .pilot-combat-progress-panel > img {
  width: 82px !important;
  height: 82px !important;
}

#pilotProfileScreen .pilot-combat-progress-panel strong {
  font-size: 1.42rem !important;
}

#pilotProfileScreen .pilot-combat-progress-panel em {
  margin: 3px 0 8px !important;
  font-size: 0.9rem !important;
}

#pilotProfileScreen .pilot-combat-progress-panel p {
  margin-top: 8px !important;
  padding-top: 8px !important;
  font-size: 0.82rem !important;
  line-height: 1.26;
}

#pilotProfileScreen .future-profile-grid {
  gap: 8px !important;
  height: 100%;
  min-height: 0;
}

#pilotProfileScreen .future-profile-grid .future-pilot-card {
  display: grid;
  grid-template-rows: 56px auto minmax(0, auto) auto;
  height: 100%;
  min-height: 0 !important;
  padding: 9px 10px 10px !important;
  overflow: hidden;
  align-content: center;
}

#pilotProfileScreen .future-pilot-card img {
  width: 56px !important;
  height: 56px !important;
  margin-bottom: 0 !important;
}

#pilotProfileScreen .future-pilot-card strong {
  font-size: 1rem !important;
}

#pilotProfileScreen .future-pilot-card small {
  max-height: 4.6em;
  overflow: hidden;
  font-size: 0.68rem !important;
  line-height: 1.16 !important;
}

#pilotProfileScreen .future-pilot-card em {
  margin-top: 5px !important;
  padding: 3px 7px !important;
}

#pilotProfileScreen .pilot-progression-card .pilot-combat-progress-panel,
#pilotProfileScreen .pilot-future-card .future-profile-grid {
  align-self: stretch;
}

@media (max-height: 700px) {
  #pilotProfileScreen.pilot-profile-screen.active {
    padding: 14px 28px 16px !important;
  }

  #pilotProfileScreen.pilot-profile-screen .market-header h2 {
    font-size: clamp(32px, 3.4vw, 46px) !important;
  }

  #pilotProfileScreen .pilot-profile-body {
    grid-template-rows: 126px 78px minmax(0, 1fr) !important;
  }
}
/* ===== Player orbit sci-fi HUD refresh ===== */
.player-orbit-screen {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 720px;
  overflow: hidden;
  color: #eaf7ff;
}

.player-orbit-screen .player-hud-frame {
  position: absolute;
  inset: 14px;
  z-index: 4;
  border: 1px solid rgba(45, 175, 255, 0.58);
  border-radius: 14px;
  box-shadow:
    0 0 24px rgba(0, 157, 255, 0.18),
    inset 0 0 28px rgba(0, 157, 255, 0.08);
  pointer-events: none;
}

.player-orbit-screen .player-hud-frame::before,
.player-orbit-screen .player-hud-frame::after {
  content: "";
  position: absolute;
  width: 92px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(92, 213, 255, 0.95), transparent);
  box-shadow: 0 0 10px rgba(62, 196, 255, 0.75);
}

.player-orbit-screen .player-hud-frame::before {
  top: -1px;
  left: 42px;
}

.player-orbit-screen .player-hud-frame::after {
  right: 42px;
  bottom: -1px;
}

.player-orbit-screen .orbit-header {
  position: absolute;
  top: 6px;
  left: 10px;
  width: min(350px, calc(100vw - 58px));
  height: 50px;
  pointer-events: none;
}

.player-orbit-screen .orbit-header-trim {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: fill;
  opacity: 0.92;
}

.player-orbit-screen .orbit-location,
.player-orbit-screen .node-name-tag.orbit-location {
  position: absolute !important;
  left: 40px !important;
  top: 13px !important;
  right: auto !important;
  bottom: auto !important;
  width: calc(100% - 56px) !important;
  transform: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: 5px !important;
  text-transform: uppercase;
  color: #f0f8ff !important;
  text-shadow: 0 0 12px rgba(63, 190, 255, 0.9);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.player-orbit-screen .bottom-hud-divider {
  position: absolute;
  left: 74px;
  right: 74px;
  bottom: 7px;
  width: calc(100% - 148px);
  height: 28px;
  object-fit: fill;
  opacity: 0.68;
  pointer-events: none;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  position: absolute !important;
  left: 24px !important;
  right: 24px !important;
  bottom: 30px !important;
  z-index: 9;
  height: 205px !important;
  min-height: 205px !important;
  max-height: 205px !important;
  display: grid !important;
  grid-template-columns: 350px 260px minmax(420px, 1fr) !important;
  gap: 14px !important;
  align-items: stretch !important;
  pointer-events: auto;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  position: relative;
  height: 205px !important;
  min-height: 205px !important;
  max-height: 205px !important;
  border: 1px solid rgba(33, 176, 255, 0.8) !important;
  border-radius: 13px !important;
  background:
    linear-gradient(180deg, rgba(5, 20, 38, 0.78), rgba(2, 8, 20, 0.84)),
    radial-gradient(circle at top, rgba(39, 170, 255, 0.16), transparent 55%) !important;
  box-shadow:
    0 0 18px rgba(0, 155, 255, 0.18),
    inset 0 0 24px rgba(0, 155, 255, 0.08) !important;
  box-sizing: border-box !important;
  overflow: hidden;
}

.player-orbit-screen .player-bottom-hud .hud-panel::before {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(91, 204, 255, 0.18);
  border-radius: 9px;
  pointer-events: none;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px !important;
  padding: 22px 22px 16px !important;
}

.player-orbit-screen .player-bottom-hud .stat-col {
  width: auto !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: space-between !important;
  gap: 8px !important;
  min-width: 0;
}

.player-orbit-screen .player-bottom-hud .stat-value {
  flex: 0 0 auto !important;
  min-height: 18px;
  font-size: 15px !important;
  font-weight: 800;
  color: #fff;
  text-align: center;
  text-shadow: 0 0 8px rgba(70, 200, 255, 0.55);
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  position: relative;
  width: 28px !important;
  height: 112px !important;
  flex: 0 0 112px !important;
  max-height: 112px !important;
  border-radius: 8px !important;
  background: rgba(2, 10, 22, 0.9) !important;
  border: 1px solid rgba(146, 219, 255, 0.25) !important;
  overflow: hidden;
  box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.75) !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  border-radius: 8px;
  transition: height 0.25s ease;
  background-size: 100% 12px;
}

.player-orbit-screen .player-bottom-hud .jump-fill {
  background-image: linear-gradient(to top, #d91039, #ff5270) !important;
}

.player-orbit-screen .player-bottom-hud .hull-fill {
  background-image: linear-gradient(to top, #d9a314, #ffe96a) !important;
}

.player-orbit-screen .player-bottom-hud .shield-fill {
  background-image: linear-gradient(to top, #126ee8, #55d5ff) !important;
}

.player-orbit-screen .player-bottom-hud .stat-label {
  width: 100% !important;
  min-height: 24px !important;
  height: 24px !important;
  flex: 0 0 24px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #f4fbff;
  font-size: 13px !important;
  font-weight: 900;
  letter-spacing: 0.5px !important;
  line-height: 1;
  box-shadow: none !important;
}

.player-orbit-screen .player-bottom-hud #jumpBtn.stat-label {
  cursor: pointer;
}

.player-orbit-screen .player-bottom-hud #jumpBtn.stat-label:hover {
  color: #ffffff;
  text-shadow: 0 0 10px rgba(76, 211, 255, 0.85);
}

.player-orbit-screen .player-bottom-hud .stat-label img {
  width: 18px;
  height: 18px;
  object-fit: contain;
  filter: drop-shadow(0 0 6px rgba(74, 207, 255, 0.75));
}

.player-orbit-screen .player-bottom-hud .ship-panel.ship-display-panel-action {
  padding: 18px 14px 14px !important;
  display: grid !important;
  grid-template-columns: 1fr 62px !important;
  grid-template-rows: minmax(0, 1fr) auto auto auto !important;
  gap: 8px 10px !important;
  align-items: stretch !important;
  justify-items: stretch !important;
}

.player-orbit-screen .ship-card-main {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 92px;
  min-width: 0;
}

.player-orbit-screen .player-bottom-hud .active-player-ship,
.player-orbit-screen .player-bottom-hud .hud-ship-image {
  grid-column: auto !important;
  grid-row: auto !important;
  max-width: 130px !important;
  max-height: 118px !important;
  object-fit: contain;
  display: block;
  filter:
    drop-shadow(0 0 8px rgba(63, 194, 255, 0.8))
    drop-shadow(0 8px 10px rgba(0, 0, 0, 0.65));
}

.player-orbit-screen .player-bottom-hud .ship-mini-progress {
  display: contents !important;
  opacity: 1;
}

.player-orbit-screen .player-bottom-hud .level-badge {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
  align-self: start;
  height: 62px;
  border: 1px solid rgba(85, 202, 255, 0.75);
  border-radius: 12px;
  background: rgba(3, 18, 35, 0.88);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 0 16px rgba(0, 156, 255, 0.08);
}

.player-orbit-screen .player-bottom-hud .level-badge span {
  font-size: 9px;
  font-weight: 900;
  color: #78d9ff;
}

.player-orbit-screen .player-bottom-hud .level-badge strong {
  font-size: 28px;
  line-height: 1;
  color: #fff;
}

.player-orbit-screen .player-bottom-hud .xp-row {
  grid-column: 1 / 3;
  grid-row: 2 / 3;
  display: flex;
  justify-content: space-between;
  align-self: end;
  gap: 8px;
  min-width: 0;
  font-size: 13px;
  font-weight: 700;
  color: #bceaff;
}

.player-orbit-screen .player-bottom-hud .xp-row span:first-child {
  color: #25c9ff;
}

.player-orbit-screen .player-bottom-hud .xp-row span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-orbit-screen .player-bottom-hud .xp-bar {
  grid-column: 1 / 3;
  grid-row: 3 / 4;
  height: 9px;
  border-radius: 999px;
  background: rgba(7, 25, 44, 0.9);
  overflow: hidden;
  border: 1px solid rgba(74, 190, 255, 0.18);
}

.player-orbit-screen .player-bottom-hud .xp-fill {
  height: 100%;
  background: linear-gradient(90deg, #00aeff, #5ce8ff);
  box-shadow: 0 0 12px rgba(0, 200, 255, 0.8);
}

.player-orbit-screen .player-bottom-hud .ship-inventory-btn {
  grid-column: 1 / 3 !important;
  grid-row: 4 / 5 !important;
  width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  border: 1px solid rgba(75, 204, 255, 0.85) !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, rgba(0, 62, 111, 0.58), rgba(2, 16, 35, 0.95)) !important;
  color: #eaf8ff !important;
  font-size: 12px !important;
  font-weight: 900;
  letter-spacing: 1px;
  cursor: pointer;
  box-shadow: 0 0 12px rgba(0, 163, 255, 0.18) !important;
}

.player-orbit-screen .player-bottom-hud .ship-inventory-btn:hover {
  background: linear-gradient(180deg, rgba(0, 111, 178, 0.75), rgba(4, 28, 58, 0.95)) !important;
  box-shadow: 0 0 18px rgba(0, 190, 255, 0.35) !important;
}

.player-orbit-screen .player-bottom-hud .info-panel.hud-command-console {
  display: grid !important;
  grid-template-rows: 42px minmax(0, 1fr) !important;
  gap: 12px !important;
  padding: 10px 14px 14px !important;
}

.player-orbit-screen .player-bottom-hud .info-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px !important;
  height: 42px !important;
  border-bottom: 1px solid rgba(85, 191, 255, 0.28);
  margin-bottom: 0;
}

.player-orbit-screen .player-bottom-hud .info-tab {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 0;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 10px !important;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  background: rgba(2, 16, 34, 0.5) !important;
  color: #9fdfff !important;
  font-size: 13px !important;
  font-weight: 900;
  letter-spacing: 1px !important;
  cursor: pointer;
}

.player-orbit-screen .player-bottom-hud .info-tab img {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  object-fit: contain;
  filter: drop-shadow(0 0 6px rgba(77, 211, 255, 0.75));
}

.player-orbit-screen .player-bottom-hud .info-tab span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.player-orbit-screen .player-bottom-hud .info-tab:hover,
.player-orbit-screen .player-bottom-hud .info-tab.active {
  color: #ffffff !important;
  border-color: rgba(72, 204, 255, 0.85) !important;
  background: linear-gradient(180deg, rgba(0, 106, 180, 0.48), rgba(2, 17, 38, 0.7)) !important;
  box-shadow: inset 0 -3px 0 rgba(40, 207, 255, 0.85) !important;
}

.player-orbit-screen .player-bottom-hud .hud-inline-panel {
  min-height: 0;
  overflow: hidden;
}

.player-orbit-screen .player-bottom-hud .hud-inline-panel .hud-panel {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.player-orbit-screen .player-bottom-hud .hud-inline-panel .hud-panel::before {
  display: none;
}

.player-orbit-screen .player-bottom-hud .hud-panel-header.compact-header h3,
.player-orbit-screen .player-bottom-hud .activity-objective-block h3 {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 900;
  color: #f2fbff;
}

.player-orbit-screen .player-bottom-hud .objective-hud-summary,
.player-orbit-screen .player-bottom-hud .local-chat-feed,
.player-orbit-screen .player-bottom-hud .activity-log-feed {
  min-height: 86px !important;
  border: 1px solid rgba(75, 185, 255, 0.22);
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(1, 12, 27, 0.76), rgba(1, 7, 18, 0.72)),
    radial-gradient(circle at center, rgba(0, 130, 255, 0.08), transparent 60%);
}

.player-orbit-screen .player-bottom-hud .objective-empty,
.player-orbit-screen .player-bottom-hud .cargo-empty {
  color: #8db4d6;
  font-size: 16px;
}

@media (max-width: 980px) {
  .player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
    grid-template-columns: 1fr !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 48vh !important;
    overflow-y: auto;
  }

  .player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
    min-height: 170px !important;
  }

  .player-orbit-screen .player-bottom-hud .ship-panel,
  .player-orbit-screen .player-bottom-hud .info-panel,
  .player-orbit-screen .player-bottom-hud .status-panel {
    height: auto !important;
    max-height: none !important;
  }

  .player-orbit-screen .player-bottom-hud .ship-panel {
    min-height: 180px !important;
  }

  .player-orbit-screen .player-bottom-hud .info-panel {
    min-height: 190px !important;
  }
}

/* ===== Player orbit HUD final scale/refinement overrides ===== */
.player-orbit-screen .player-hud-frame {
  inset: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.player-orbit-screen .player-hud-frame::before,
.player-orbit-screen .player-hud-frame::after,
.player-orbit-screen .bottom-hud-divider,
.player-orbit-screen .player-bottom-hud .hud-panel::before {
  display: none;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  left: 24px !important;
  right: 24px !important;
  bottom: 10px !important;
  height: 146px !important;
  min-height: 146px !important;
  max-height: 146px !important;
  grid-template-columns: 270px 248px minmax(0, 1fr) !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  height: 146px !important;
  min-height: 146px !important;
  max-height: 146px !important;
  border-color: rgba(37, 171, 245, 0.72) !important;
  border-radius: 12px !important;
  background:
    linear-gradient(180deg, rgba(5, 18, 34, 0.66), rgba(1, 7, 18, 0.78)),
    radial-gradient(circle at top, rgba(39, 170, 255, 0.09), transparent 58%) !important;
  box-shadow:
    0 0 10px rgba(0, 155, 255, 0.12),
    inset 0 0 16px rgba(0, 155, 255, 0.055) !important;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  padding: 14px 18px 10px !important;
  gap: 10px !important;
}

.player-orbit-screen .player-bottom-hud .stat-value {
  min-height: 15px;
  font-size: 12px !important;
  text-shadow: 0 0 6px rgba(70, 200, 255, 0.42);
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  width: 18px !important;
  height: 62px !important;
  flex: 0 0 62px !important;
  max-height: 62px !important;
  border-radius: 6px !important;
  border-color: rgba(146, 219, 255, 0.18) !important;
  background: rgba(2, 10, 22, 0.72) !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  border-radius: 6px;
  opacity: 0.72;
}

.player-orbit-screen .player-bottom-hud .jump-fill {
  background-image: linear-gradient(to top, #9f1930, #e2415d) !important;
}

.player-orbit-screen .player-bottom-hud .hull-fill {
  background-image: linear-gradient(to top, #a97912, #e7c94a) !important;
}

.player-orbit-screen .player-bottom-hud .shield-fill {
  background-image: linear-gradient(to top, #185faf, #38aee0) !important;
}

.player-orbit-screen .player-bottom-hud .stat-label {
  min-height: 18px !important;
  height: 18px !important;
  flex-basis: 18px !important;
  gap: 4px;
  font-size: 11px !important;
}

.player-orbit-screen .player-bottom-hud .stat-label img,
.player-orbit-screen .player-bottom-hud .info-tab img {
  width: 13px;
  height: 13px;
}

.player-orbit-screen .player-bottom-hud .ship-panel.ship-display-panel-action {
  padding: 12px 13px 10px !important;
  grid-template-columns: 1fr 54px !important;
  gap: 5px 8px !important;
}

.player-orbit-screen .ship-card-main {
  min-height: 70px;
}

.player-orbit-screen .player-bottom-hud .active-player-ship,
.player-orbit-screen .player-bottom-hud .hud-ship-image {
  max-width: 96px !important;
  max-height: 70px !important;
  filter:
    drop-shadow(0 0 6px rgba(63, 194, 255, 0.55))
    drop-shadow(0 7px 9px rgba(0, 0, 0, 0.6));
}

.player-orbit-screen .player-bottom-hud .level-badge {
  height: 50px;
  border-radius: 10px;
  background: rgba(3, 18, 35, 0.68);
}

.player-orbit-screen .player-bottom-hud .level-badge strong {
  font-size: 24px;
}

.player-orbit-screen .player-bottom-hud .xp-row {
  font-size: 11px;
}

.player-orbit-screen .player-bottom-hud .xp-bar {
  height: 7px;
}

.player-orbit-screen .ship-storage-strip {
  grid-column: 1 / 3;
  grid-row: 4 / 5;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  min-width: 0;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button {
  height: 29px !important;
  min-height: 29px !important;
  display: grid;
  grid-template-columns: 1fr;
  align-content: center;
  gap: 1px;
  padding: 3px 8px !important;
  border: 1px solid rgba(75, 204, 255, 0.62) !important;
  border-radius: 8px !important;
  color: #eaf8ff !important;
  background: linear-gradient(180deg, rgba(0, 54, 96, 0.45), rgba(2, 16, 35, 0.78)) !important;
  box-shadow: inset 0 0 10px rgba(0, 155, 255, 0.05) !important;
  cursor: pointer;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button span {
  font-size: 8px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: rgba(120, 217, 255, 0.88);
}

.player-orbit-screen .player-bottom-hud .ship-storage-button strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button:hover,
.player-orbit-screen .player-bottom-hud .ship-storage-button.active {
  border-color: rgba(75, 204, 255, 0.9) !important;
  background: linear-gradient(180deg, rgba(0, 82, 135, 0.55), rgba(2, 16, 35, 0.84)) !important;
  box-shadow: inset 0 -2px 0 rgba(40, 207, 255, 0.55), 0 0 10px rgba(0, 190, 255, 0.18) !important;
}

.player-orbit-screen .player-bottom-hud .info-panel.hud-command-console {
  grid-template-rows: 34px minmax(0, 1fr) !important;
  gap: 7px !important;
  padding: 8px 12px 10px !important;
}

.player-orbit-screen .player-bottom-hud .info-tabs {
  height: 34px !important;
  gap: 6px !important;
}

.player-orbit-screen .player-bottom-hud .info-tab {
  min-height: 30px !important;
  height: 30px !important;
  gap: 7px;
  padding: 0 8px !important;
  font-size: 11px !important;
  background: rgba(2, 16, 34, 0.38) !important;
}

.player-orbit-screen .player-bottom-hud .objective-hud-summary,
.player-orbit-screen .player-bottom-hud .local-chat-feed,
.player-orbit-screen .player-bottom-hud .activity-log-feed {
  min-height: 58px !important;
  border-radius: 9px;
  background:
    linear-gradient(180deg, rgba(1, 12, 27, 0.56), rgba(1, 7, 18, 0.62)),
    radial-gradient(circle at center, rgba(0, 130, 255, 0.05), transparent 60%);
}

/* ===== Player orbit HUD decisive final overrides ===== */
.player-orbit-screen .orbit-header-trim {
  display: none !important;
}

.player-orbit-screen .orbit-header {
  top: 12px !important;
  left: 38px !important;
  width: 300px !important;
  height: 34px !important;
}

.player-orbit-screen .node-name-tag.orbit-location {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  font-size: 20px !important;
  letter-spacing: 5px !important;
  text-shadow: 0 0 10px rgba(63, 190, 255, 0.82), 0 2px 6px rgba(0, 0, 0, 0.75) !important;
}

.player-orbit-screen #planetLandBtn.clickable-planet {
  top: 58px !important;
  right: 86px !important;
  width: 124px !important;
  height: 124px !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  height: 160px !important;
  min-height: 160px !important;
  max-height: 160px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  height: 160px !important;
  min-height: 160px !important;
  max-height: 160px !important;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  padding: 12px 18px 10px !important;
}

.player-orbit-screen .player-bottom-hud .stat-col {
  gap: 4px !important;
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  width: 24px !important;
  height: 92px !important;
  flex: 0 0 92px !important;
  max-height: 92px !important;
  border-radius: 7px !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  border-radius: 7px !important;
}

.player-orbit-screen .ship-storage-strip {
  grid-template-columns: 1fr !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button {
  height: 31px !important;
  min-height: 31px !important;
}

/* ===== Player orbit HUD true final compact scale ===== */
.space-screen.player-orbit-screen {
  height: 665px !important;
  min-height: 0 !important;
  max-height: 665px !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  bottom: 8px !important;
  height: 128px !important;
  min-height: 128px !important;
  max-height: 128px !important;
  grid-template-columns: 250px 198px minmax(0, 1fr) !important;
  gap: 12px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel,
.player-orbit-screen .player-bottom-hud .ship-display-panel,
.player-orbit-screen .player-bottom-hud .hud-command-console,
.player-orbit-screen .player-bottom-hud .vertical-stats {
  height: 128px !important;
  min-height: 128px !important;
  max-height: 128px !important;
  border-radius: 9px !important;
  box-shadow:
    0 0 8px rgba(0, 155, 255, 0.1),
    inset 0 0 12px rgba(0, 155, 255, 0.045) !important;
}

.player-orbit-screen .player-bottom-hud .status-panel.vertical-stats {
  padding: 10px 15px 8px !important;
  gap: 9px !important;
}

.player-orbit-screen .player-bottom-hud .stat-col {
  gap: 4px !important;
}

.player-orbit-screen .player-bottom-hud .stat-value {
  min-height: 12px !important;
  font-size: 10px !important;
  line-height: 1 !important;
}

.player-orbit-screen .player-bottom-hud .stat-meter {
  width: 20px !important;
  height: 76px !important;
  flex: 0 0 76px !important;
  max-height: 76px !important;
  border-radius: 6px !important;
}

.player-orbit-screen .player-bottom-hud .stat-fill {
  border-radius: 6px !important;
}

.player-orbit-screen .player-bottom-hud .stat-label {
  height: 20px !important;
  min-height: 20px !important;
  flex-basis: 20px !important;
  padding: 0 6px !important;
  gap: 4px !important;
  font-size: 9px !important;
  letter-spacing: 0.6px !important;
}

.player-orbit-screen .player-bottom-hud .stat-label img {
  width: 10px !important;
  height: 10px !important;
}

.player-orbit-screen .player-bottom-hud .ship-panel.ship-display-panel-action {
  grid-template-columns: minmax(0, 1fr) 46px !important;
  padding: 9px 10px 8px !important;
  gap: 4px 7px !important;
}

.player-orbit-screen .ship-card-main {
  min-height: 48px !important;
}

.player-orbit-screen .player-bottom-hud .active-player-ship,
.player-orbit-screen .player-bottom-hud .hud-ship-image {
  max-width: 76px !important;
  max-height: 52px !important;
}

.player-orbit-screen .player-bottom-hud .level-badge {
  height: 42px !important;
  border-radius: 8px !important;
}

.player-orbit-screen .player-bottom-hud .level-badge span {
  font-size: 7px !important;
}

.player-orbit-screen .player-bottom-hud .level-badge strong {
  font-size: 20px !important;
}

.player-orbit-screen .player-bottom-hud .xp-row {
  font-size: 9px !important;
  line-height: 1 !important;
}

.player-orbit-screen .player-bottom-hud .xp-bar {
  height: 5px !important;
}

.player-orbit-screen .ship-storage-strip {
  gap: 0 !important;
  grid-template-columns: 1fr !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button {
  height: 24px !important;
  min-height: 24px !important;
  padding: 2px 7px !important;
  border-radius: 6px !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button span {
  font-size: 7px !important;
}

.player-orbit-screen .player-bottom-hud .ship-storage-button strong {
  font-size: 8px !important;
}

.player-orbit-screen .player-bottom-hud .info-panel.hud-command-console {
  grid-template-rows: 27px minmax(0, 1fr) !important;
  gap: 5px !important;
  padding: 6px 10px 8px !important;
}

.player-orbit-screen .player-bottom-hud .info-tabs {
  height: 27px !important;
  gap: 5px !important;
}

.player-orbit-screen .player-bottom-hud .info-tab {
  min-height: 24px !important;
  height: 24px !important;
  gap: 6px !important;
  padding: 0 7px !important;
  font-size: 9px !important;
}

.player-orbit-screen .player-bottom-hud .info-tab img {
  width: 10px !important;
  height: 10px !important;
}

.player-orbit-screen .player-bottom-hud .hud-panel-header.compact-header h3,
.player-orbit-screen .player-bottom-hud .activity-objective-block h3 {
  margin-bottom: 4px !important;
  font-size: 12px !important;
}

.player-orbit-screen .player-bottom-hud .objective-hud-summary,
.player-orbit-screen .player-bottom-hud .local-chat-feed,
.player-orbit-screen .player-bottom-hud .activity-log-feed {
  min-height: 42px !important;
  border-radius: 7px !important;
  font-size: 11px !important;
}

.player-orbit-screen .player-bottom-hud .objective-empty,
.player-orbit-screen .player-bottom-hud .cargo-empty {
  font-size: 11px !important;
}
/* ===== In-space UI v2: sealed HUD + compact manifest (final override) ===== */
.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud {
  gap: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(37, 171, 245, 0.82) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(180deg, rgba(5, 18, 34, 0.70), rgba(1, 7, 18, 0.84)),
    radial-gradient(circle at 62% 0%, rgba(39, 170, 255, 0.10), transparent 62%) !important;
  box-shadow:
    0 0 12px rgba(0, 155, 255, 0.14),
    inset 0 0 18px rgba(0, 155, 255, 0.055) !important;
  overflow: hidden !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud > .hud-panel,
.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud > .ship-display-panel,
.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud > .hud-command-console,
.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud > .vertical-stats {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud > .status-panel,
.player-orbit-screen .player-bottom-hud.command-hud.space-combat-hud > .ship-panel {
  border-right: 1px solid rgba(75, 185, 255, 0.34) !important;
}

.player-orbit-screen .player-bottom-hud .info-panel.hud-command-console {
  padding: 5px 9px 6px !important;
  grid-template-rows: 26px minmax(0, 1fr) !important;
  gap: 4px !important;
}

#chatPanel.comms-panel.active {
  grid-template-rows: 18px minmax(0, 1fr) 28px !important;
  gap: 3px !important;
  min-height: 0 !important;
}

#chatPanel .chat-panel-top {
  height: 18px !important;
  min-height: 18px !important;
}

#chatPanel .chat-channel-tabs,
#chatPanel .chat-channel-tabs button {
  height: 18px !important;
  min-height: 18px !important;
}

#chatPanel .local-chat-feed {
  min-height: 0 !important;
  padding: 2px 6px 2px 0 !important;
}

#chatPanel .local-chat-input-row {
  width: 100% !important;
  min-width: 0 !important;
  height: 28px !important;
  min-height: 28px !important;
  grid-template-columns: minmax(0, 1fr) 64px !important;
  gap: 5px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

#chatPanel .local-chat-input-row input,
#chatPanel .local-chat-input-row button {
  height: 28px !important;
  min-height: 28px !important;
  box-sizing: border-box !important;
}

#chatPanel .local-chat-input-row input {
  min-width: 0 !important;
  padding: 0 8px !important;
  font-size: 11px !important;
}

#chatPanel .local-chat-input-row button {
  width: 64px !important;
  min-width: 64px !important;
  padding: 0 6px !important;
  font-size: 10px !important;
  justify-self: stretch;
}

.inventory-drawer {
  height: min(312px, calc(100% - 332px)) !important;
  max-height: 312px !important;
  width: min(720px, calc(100% - 44px)) !important;
}

.inventory-drawer-body {
  grid-template-columns: minmax(0, 1fr) 208px !important;
}

.inventory-drawer-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 54px !important;
}

.inventory-drawer-detail {
  align-content: start;
}

.inventory-detail-actions {
  display: none !important;
}

/* Keep Jump, Hull and Shield label text visually matched. */
.player-orbit-screen .player-bottom-hud .stat-label span,
.player-orbit-screen .player-bottom-hud #jumpBtn.stat-label span {
  font-size: inherit !important;
  line-height: 1 !important;
}