/* ════════════════════════════════════════════════════════════════════════
   TitanMC Prison Market — atmospheric pass v3

   Art direction follows the layered language of /tworcy: calm radial fields,
   a masked grid, sparse floating symbols and particles. Prison identity comes
   from forge orange, cold inspection cyan and restrained edge bars — not from
   a photographic wallpaper or a literal 3D prop.
   ════════════════════════════════════════════════════════════════════════ */

body #marketplace .mh-hero[data-market-theme="prison"] {
  --pma-orange: #e76f2e;
  --pma-orange-hot: #ff9a53;
  --pma-cyan: #55d4e5;
  --pma-ivory: #eee9e1;
  --pma-muted: #9b958d;
  background:
    radial-gradient(ellipse 48% 54% at 50% 28%, rgba(139, 52, 18, .14), transparent 72%),
    radial-gradient(ellipse 30% 42% at 82% 18%, rgba(42, 130, 149, .055), transparent 74%),
    radial-gradient(ellipse 28% 38% at 17% 64%, rgba(175, 68, 24, .055), transparent 76%),
    linear-gradient(180deg, #07090b 0%, #050608 52%, #030406 100%) !important;
}

/* The old picture and the older hall atmosphere stay disabled even if a stale
   service-worker response includes their markup. */
body #marketplace .mh-hero[data-market-theme="prison"] > .pmw-stage,
body #marketplace .mh-hero[data-market-theme="prison"] > .mh-atmos {
  display: none !important;
  animation: none !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] > .mh-container {
  position: relative;
  z-index: 3;
}

.pma-stage {
  position: absolute;
  z-index: 0;
  inset: -18px;
  overflow: hidden;
  contain: strict;
  pointer-events: none;
  opacity: 0;
  transform: translate3d(calc(var(--mh-px, 0) * 8px), calc(var(--mh-py, 0) * 6px), 0);
  animation: pmaStageIn 1.15s cubic-bezier(.16, 1, .3, 1) .03s forwards;
}

.pma-stage::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: -8%;
  width: 1px;
  height: 82%;
  background: linear-gradient(180deg, transparent, rgba(255, 142, 70, .24) 26%, rgba(85, 212, 229, .12) 64%, transparent);
  box-shadow: 0 0 42px 8px rgba(208, 77, 23, .045);
  opacity: .54;
}

.pma-stage::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 27%;
  width: min(720px, 58vw);
  height: min(720px, 58vw);
  transform: translate(-50%, -50%);
  border: 1px solid rgba(227, 111, 46, .055);
  border-radius: 50%;
  box-shadow:
    inset 0 0 0 82px rgba(85, 212, 229, .008),
    inset 0 0 0 184px rgba(227, 111, 46, .008);
  opacity: .68;
}

.pma-grid {
  position: absolute;
  z-index: 1;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 148, 82, .032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 148, 82, .032) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 74% 72% at 50% 32%, #000 5%, transparent 76%);
  mask-image: radial-gradient(ellipse 74% 72% at 50% 32%, #000 5%, transparent 76%);
  opacity: .68;
}

.pma-aura {
  position: absolute;
  z-index: 0;
  display: block;
  border-radius: 50%;
  will-change: transform, opacity;
}

.pma-aura--ember {
  left: 50%;
  top: 22%;
  width: min(820px, 66vw);
  height: min(620px, 52vw);
  margin: min(-310px, -26vw) 0 0 min(-410px, -33vw);
  background: radial-gradient(ellipse, rgba(201, 71, 20, .15), rgba(128, 41, 13, .055) 42%, transparent 72%);
  animation: pmaAuraEmber 11s ease-in-out infinite;
}

.pma-aura--cold {
  right: -9%;
  top: 2%;
  width: min(620px, 46vw);
  height: min(620px, 46vw);
  background: radial-gradient(circle, rgba(62, 169, 187, .075), rgba(28, 84, 98, .025) 46%, transparent 72%);
  animation: pmaAuraCold 13s ease-in-out -4.5s infinite;
}

.pma-bars {
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 14%;
  width: 24%;
  opacity: .2;
  background:
    repeating-linear-gradient(90deg, rgba(77, 73, 68, .56) 0 2px, transparent 2px 46px),
    linear-gradient(180deg, rgba(255, 144, 70, .12), transparent 34% 72%, rgba(0, 0, 0, .4));
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 12% 70%, transparent 98%);
  mask-image: linear-gradient(180deg, transparent, #000 12% 70%, transparent 98%);
}

.pma-bars--left {
  left: 0;
  transform: skewX(8deg) translateX(-22%);
}

.pma-bars--right {
  right: 0;
  transform: skewX(-8deg) translateX(22%);
}

.pma-item {
  position: absolute;
  z-index: 4;
  display: grid;
  place-items: center;
  width: 76px;
  height: 76px;
  opacity: .13;
  will-change: transform, opacity;
  animation: pmaItemFloat 8s ease-in-out infinite;
}

.pma-item::before {
  content: "";
  position: absolute;
  inset: 6px;
  border: 1px solid rgba(255, 154, 83, .12);
  border-radius: 20px;
  background: rgba(8, 10, 12, .42);
}

.pma-item img {
  position: relative;
  z-index: 1;
  width: 58px;
  height: 58px;
  image-rendering: pixelated;
  filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .72));
}

.pma-item--pickaxe { left: 7%; top: 18%; }
.pma-item--ingot { right: 8%; top: 21%; animation-delay: -2s; }
.pma-item--emerald { left: 12%; top: 62%; animation-delay: -4s; }
.pma-item--beacon { right: 12%; top: 65%; animation-delay: -6s; }

.pma-particles {
  position: absolute;
  z-index: 3;
  inset: 0;
}

.pma-particles > i {
  position: absolute;
  bottom: 3%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--pma-particle, #ff9753);
  box-shadow: 0 0 9px color-mix(in srgb, var(--pma-particle, #ff9753) 70%, transparent);
  opacity: 0;
  will-change: transform, opacity;
  animation: pmaParticleRise var(--pma-dur, 8s) linear var(--pma-delay, 0s) infinite;
}

.pma-particles > i:nth-child(1) { left: 8%; --pma-dur: 9s; --pma-delay: -4s; }
.pma-particles > i:nth-child(2) { left: 19%; --pma-dur: 11s; --pma-delay: -8s; --pma-particle: #55d4e5; }
.pma-particles > i:nth-child(3) { left: 31%; --pma-dur: 7.5s; --pma-delay: -2s; }
.pma-particles > i:nth-child(4) { left: 43%; --pma-dur: 10s; --pma-delay: -6s; }
.pma-particles > i:nth-child(5) { left: 52%; --pma-dur: 8.5s; --pma-delay: -1s; --pma-particle: #55d4e5; }
.pma-particles > i:nth-child(6) { left: 61%; --pma-dur: 12s; --pma-delay: -9s; }
.pma-particles > i:nth-child(7) { left: 70%; --pma-dur: 9.5s; --pma-delay: -5s; }
.pma-particles > i:nth-child(8) { left: 79%; --pma-dur: 8s; --pma-delay: -3s; --pma-particle: #55d4e5; }
.pma-particles > i:nth-child(9) { left: 88%; --pma-dur: 10.5s; --pma-delay: -7s; }
.pma-particles > i:nth-child(10) { left: 95%; --pma-dur: 13s; --pma-delay: -10s; }

.pma-vignette {
  position: absolute;
  z-index: 9;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(2, 3, 4, .94), transparent 13% 87%, rgba(2, 3, 4, .94)),
    linear-gradient(180deg, rgba(2, 3, 4, .26), transparent 16% 70%, #030507 98%),
    radial-gradient(ellipse 92% 82% at 50% 38%, transparent 48%, rgba(2, 3, 4, .48));
}

@keyframes pmaStageIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes pmaAuraEmber {
  0%, 100% { transform: translate3d(-2%, 1%, 0) scale(.95); opacity: .64; }
  50% { transform: translate3d(3%, -2%, 0) scale(1.05); opacity: 1; }
}

@keyframes pmaAuraCold {
  0%, 100% { transform: translate3d(0, 0, 0) scale(.96); opacity: .48; }
  50% { transform: translate3d(-5%, 4%, 0) scale(1.06); opacity: .8; }
}

@keyframes pmaItemFloat {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-1deg); opacity: .1; }
  50% { transform: translate3d(0, -9px, 0) rotate(2deg); opacity: .17; }
}

@keyframes pmaParticleRise {
  0% { opacity: 0; transform: translate3d(0, 0, 0) scale(.7); }
  12%, 78% { opacity: .46; }
  100% { opacity: 0; transform: translate3d(var(--pma-drift, 22px), -640px, 0) scale(1); }
}

/* ── Wordmark: the only part retained from the rejected concept ───────── */

body #marketplace .mh-hero[data-market-theme="prison"] .mhp2-prison,
body #marketplace .mh-hero[data-market-theme="prison"] .mhp2-prison .mhp2-letter {
  color: var(--pma-ivory) !important;
  -webkit-text-fill-color: var(--pma-ivory) !important;
  -webkit-text-stroke: 0 transparent !important;
  background: none !important;
  filter: none !important;
  text-shadow: 0 1px rgba(255, 255, 255, .08), 0 13px 36px rgba(0, 0, 0, .58) !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mhp2-market,
body #marketplace .mh-hero[data-market-theme="prison"] .mhp2-market .mhp2-letter {
  color: var(--pma-orange) !important;
  -webkit-text-fill-color: var(--pma-orange) !important;
  -webkit-text-stroke: 0 transparent !important;
  background: none !important;
  filter: none !important;
  text-shadow: 0 13px 36px rgba(0, 0, 0, .6) !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mhp2-letter {
  animation: pmaGlyphIn .86s cubic-bezier(.16, 1, .3, 1) both !important;
  animation-delay: calc(80ms + var(--mhp2-i, 0) * 44ms) !important;
  transform-origin: 50% 100%;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mhp2-letter::before,
body #marketplace .mh-hero[data-market-theme="prison"] .mhp2-letter::after,
body #marketplace .mh-hero[data-market-theme="prison"] .mhp2-market::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

@keyframes pmaGlyphIn {
  from { opacity: 0; transform: translate3d(0, .55em, 0) scaleY(.78); }
  58% { opacity: 1; }
  to { opacity: 1; transform: translate3d(0, 0, 0) scaleY(1); }
}

/* ── Market telemetry rail ──────────────────────────────────────────────
   One instrument surface, one typographic hierarchy. The earlier rainbow of
   unrelated number colours made six values look like separate promo cards. */

body #marketplace .mh-hero[data-market-theme="prison"] .mh-ledger {
  counter-reset: pma-metric;
  position: relative;
  display: grid;
  grid-template-columns: 1.08fr .95fr 1.12fr 1fr 1.08fr 1.16fr;
  gap: 0;
  margin-top: 22px !important;
  padding: 6px 8px;
  overflow: hidden;
  border: 1px solid rgba(228, 220, 206, .105) !important;
  border-radius: 17px;
  background:
    linear-gradient(90deg, rgba(231, 111, 46, .025), transparent 26% 74%, rgba(85, 212, 229, .018)),
    linear-gradient(180deg, rgba(13, 16, 19, .94), rgba(6, 8, 10, .97)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025), 0 18px 48px rgba(0, 0, 0, .24);
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-ledger::before {
  content: "";
  position: absolute;
  z-index: 2;
  left: 4%;
  right: 4%;
  top: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(231, 111, 46, .5), rgba(85, 212, 229, .28), transparent);
  opacity: .7;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell {
  counter-increment: pma-metric;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 9px;
  min-width: 0;
  min-height: 82px;
  padding: 14px clamp(12px, 1.25vw, 21px) !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell:first-child {
  padding-left: clamp(12px, 1.25vw, 21px) !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell:last-child {
  padding-right: clamp(12px, 1.25vw, 21px) !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell + .mh-cell::before {
  content: "" !important;
  position: absolute;
  left: 0;
  top: 18%;
  bottom: 18%;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(226, 219, 207, .1) 30% 70%, transparent) !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell::after {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 11px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .026), transparent 66%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .24s ease;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell:hover::after { opacity: 1; }

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell dt {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #716c65 !important;
  font: 650 8.5px/1 var(--font-mono, monospace) !important;
  letter-spacing: .17em;
  text-transform: uppercase;
  white-space: nowrap;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell dt::before {
  content: "0" counter(pma-metric);
  color: rgba(231, 111, 46, .76);
  font-size: 7px;
  letter-spacing: .05em;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell dd,
body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell-num dd {
  position: relative;
  z-index: 1;
  min-height: 27px;
  margin: 0;
  color: #e9e3da !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  font: 700 clamp(19px, 1.62vw, 27px)/1 var(--font-mono, 'Rajdhani', sans-serif) !important;
  font-variant-numeric: tabular-nums lining-nums;
  letter-spacing: -.035em;
  text-shadow: none !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell-num dd::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-live {
  display: flex !important;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-live .ho-dot {
  width: 6px;
  height: 6px;
  background: #4bd58c;
  box-shadow: 0 0 10px rgba(75, 213, 140, .55);
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-live strong {
  color: #55dda0 !important;
  font: 700 clamp(20px, 1.7vw, 28px)/1 var(--font-mono, 'Rajdhani', sans-serif) !important;
  letter-spacing: -.035em;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-live .mh-live-label {
  min-height: 19px;
  display: inline-flex;
  align-items: center;
  padding: 0 7px !important;
  border: 1px solid rgba(75, 213, 140, .2) !important;
  border-radius: 999px !important;
  background: rgba(75, 213, 140, .055) !important;
  color: #62c993 !important;
  font: 700 7px/1 var(--font-mono, monospace) !important;
  letter-spacing: .12em;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell-note dd {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #a39d94 !important;
  font: 550 11px/1.35 var(--font-body, 'Rajdhani', sans-serif) !important;
  letter-spacing: .015em;
}

body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell-note dd::before {
  content: "";
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: var(--pma-orange-hot);
  box-shadow: 0 0 10px rgba(255, 154, 83, .4);
}

/* Keep the route alive while the user scrolls. It pauses only once it truly
   leaves the viewport or the document becomes hidden. */
.mh-hero.mh-offscreen .pma-stage *,
.mh-hero.mh-paused .pma-stage * {
  animation-play-state: paused !important;
}

@media (max-width: 900px) {
  .pma-grid { background-size: 52px 52px; opacity: .5; }
  .pma-bars { width: 33%; opacity: .16; }
  .pma-item { width: 62px; height: 62px; opacity: .1; }
  .pma-item img { width: 44px; height: 44px; }
  .pma-item--pickaxe { left: 1%; top: 17%; }
  .pma-item--ingot { right: 1%; top: 19%; }
  .pma-item--emerald,
  .pma-item--beacon { display: none; }
  .pma-aura--ember { width: 680px; height: 520px; margin: -260px 0 0 -340px; }
  .pma-aura--cold { right: -48%; width: 520px; height: 520px; }

  body #marketplace .mh-hero[data-market-theme="prison"] .mh-ledger {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 5px;
  }
  body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell {
    min-height: 76px;
    padding: 12px 11px !important;
  }
  body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell:nth-child(odd)::before {
    content: none !important;
  }
  body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell:nth-child(n + 3) {
    border-top: 1px solid rgba(226, 219, 207, .07);
  }
  body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell dt {
    font-size: 7.5px !important;
  }
  body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell dd,
  body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell-num dd {
    font-size: 20px !important;
  }
  body #marketplace .mh-hero[data-market-theme="prison"] .mh-cell-note dd {
    font-size: 10px !important;
  }
}

@media (max-width: 520px) {
  .pma-stage { inset: -10px; }
  .pma-stage::after { width: 430px; height: 430px; opacity: .46; }
  .pma-bars { width: 40%; opacity: .12; }
  .pma-item { opacity: .08; }
  .pma-particles > i:nth-child(even) { display: none; }
}