/* ============================================================
   Parcel Empire — Phase 11.14
   Mint/teal purchase-success screen, mobile fit and 3D halo alignment correction.
   This file intentionally loads last so no retired navy reveal
   styling can reappear through older phase selectors.
   ============================================================ */

html body.pe-v10-purchase #rarityReveal.pe10PurchaseReveal{
  --pe-reveal-ink:#103f52;
  --pe-reveal-muted:#6a8793;
  --pe-reveal-teal:#13bca7;
  --pe-reveal-line:rgba(18,154,149,.17);
  position:fixed!important;
  inset:0!important;
  z-index:9900!important;
  inline-size:auto!important;
  block-size:auto!important;
  max-block-size:none!important;
  display:grid!important;
  place-items:center!important;
  padding:max(10px,env(safe-area-inset-top,0px)) max(8px,env(safe-area-inset-right,0px)) max(10px,env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px))!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:0!important;
  background:
    radial-gradient(circle at 50% 16%,rgba(255,255,255,.96) 0 12%,rgba(255,255,255,.42) 36%,transparent 58%),
    radial-gradient(circle at 10% 86%,rgba(70,224,126,.18),transparent 36%),
    radial-gradient(circle at 92% 74%,rgba(15,188,211,.18),transparent 38%),
    linear-gradient(155deg,#effdfb 0%,#def6f1 48%,#d8f2f4 100%)!important;
  box-shadow:none!important;
  backdrop-filter:blur(16px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.08)!important;
}

html body.pe-v10-purchase #rarityReveal.pe10PurchaseReveal[hidden]{display:none!important}
html body.pe-v10-purchase #rarityReveal.pe10PurchaseReveal::before{display:none!important;content:none!important}

html body.pe-v10-purchase #rarityReveal.pe10PurchaseReveal .revealCard{
  position:relative!important;
  isolation:isolate!important;
  inline-size:min(610px,calc(100vw - 16px))!important;
  block-size:auto!important;
  min-block-size:0!important;
  max-block-size:calc(100dvh - max(20px,env(safe-area-inset-top,0px)) - max(20px,env(safe-area-inset-bottom,0px)))!important;
  display:grid!important;
  grid-template-rows:auto clamp(160px,34dvh,305px) auto auto!important;
  gap:8px!important;
  margin:auto!important;
  padding:12px!important;
  overflow:hidden!important;
  border:1px solid rgba(16,151,148,.2)!important;
  border-radius:31px!important;
  color:var(--pe-reveal-ink)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.99) 0%,rgba(247,255,253,.99) 50%,rgba(239,251,249,.99) 100%)!important;
  box-shadow:0 24px 68px rgba(20,93,101,.2),0 0 0 5px rgba(255,255,255,.44)!important;
}

/* Compact Parcel Empire success heading. */
html body.pe-v10-purchase #rarityReveal .pe121RevealBrand{
  display:grid!important;
  justify-items:center!important;
  gap:2px!important;
  min-block-size:0!important;
  padding:0 5px 3px!important;
  color:var(--pe-reveal-ink)!important;
  background:transparent!important;
}
html body.pe-v10-purchase #rarityReveal .pe121RevealWordmark{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:6px 12px!important;
  border:1px solid rgba(23,176,158,.15)!important;
  border-radius:17px!important;
  background:rgba(240,255,251,.96)!important;
  box-shadow:0 7px 20px rgba(23,131,133,.07)!important;
}
html body.pe-v10-purchase #rarityReveal .pe121RevealWordmark>span{
  display:grid!important;
  place-items:center!important;
  inline-size:35px!important;
  block-size:35px!important;
  border-radius:12px!important;
  color:#fff!important;
  background:linear-gradient(145deg,#4be17e,#18c49f 54%,#11b9d3)!important;
  box-shadow:0 8px 18px rgba(18,176,155,.18)!important;
  font-size:22px!important;
}
html body.pe-v10-purchase #rarityReveal .pe121RevealWordmark div{display:grid!important;line-height:.88!important;text-align:left!important}
html body.pe-v10-purchase #rarityReveal .pe121RevealWordmark b{color:#0e8f74!important;font-size:18px!important;letter-spacing:-.025em!important}
html body.pe-v10-purchase #rarityReveal .pe121RevealWordmark small{color:#176d72!important;font-size:8px!important;letter-spacing:.28em!important}
html body.pe-v10-purchase #rarityReveal .pe121RevealBrand>em{font-style:normal!important;color:#159987!important;font-size:9px!important;font-weight:950!important;letter-spacing:.19em!important}
html body.pe-v10-purchase #rarityReveal .pe121RevealBrand>strong{color:#113f53!important;font-size:clamp(23px,6vw,34px)!important;line-height:1!important;letter-spacing:-.04em!important;text-align:center!important;text-shadow:none!important}
html body.pe-v10-purchase #rarityReveal .pe121RevealBrand>p{margin:0!important;color:var(--pe-reveal-muted)!important;font-size:12px!important;line-height:1.15!important;text-align:center!important}

/* Fallback styling before the runtime swaps in the branded heading. */
html body.pe-v10-purchase #rarityReveal .peRevealTopline{display:block!important;min-block-size:0!important;padding:2px!important;text-align:center!important}
html body.pe-v10-purchase #rarityReveal .revealEyebrow{color:#139b87!important;font-size:10px!important;text-align:center!important}
html body.pe-v10-purchase #rarityReveal .peRevealSequence{margin-top:2px!important;color:var(--pe-reveal-muted)!important;font-size:9px!important;text-align:center!important}

/* The live 3D parcel remains the main focus, but no longer forces scrolling. */
html body.pe-v10-purchase #rarityReveal .revealModelStage{
  position:relative!important;
  z-index:1!important;
  inline-size:100%!important;
  block-size:100%!important;
  min-block-size:0!important;
  max-block-size:none!important;
  margin:0!important;
  overflow:hidden!important;
  border:1px solid rgba(18,173,168,.16)!important;
  border-radius:24px!important;
  background:
    radial-gradient(circle at 50% 52%,rgba(255,255,255,.98) 0 23%,rgba(var(--pe10-rarity-rgb,18,188,167),.14) 50%,transparent 72%),
    linear-gradient(180deg,#ffffff 0%,#edf9f7 100%)!important;
  background-size:auto!important;
  box-shadow:inset 0 -16px 34px rgba(18,125,130,.06),0 8px 20px rgba(17,97,104,.07)!important;
}
html body.pe-v10-purchase #rarityReveal .revealModelStage canvas{
  position:absolute!important;
  inset:0!important;
  inline-size:100%!important;
  block-size:100%!important;
  max-inline-size:100%!important;
  max-block-size:100%!important;
  filter:drop-shadow(0 18px 15px rgba(23,82,82,.18))!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealHalo{
  /* Keep every halo ring centred on the live Three.js parcel canvas.
     `translate` is separate from the legacy rotation animation, so the
     halo remains centred while it slowly spins. */
  left:50%!important;
  top:50%!important;
  translate:-50% -50%!important;
  border-color:rgba(var(--pe10-rarity-rgb,18,188,167),.24)!important;
  box-shadow:0 0 55px rgba(var(--pe10-rarity-rgb,18,188,167),.17)!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealHalo::before,
html body.pe-v10-purchase #rarityReveal .peRevealHalo::after{
  border-color:rgba(var(--pe10-rarity-rgb,18,188,167),.24)!important;
}
html body.pe-v10-purchase #rarityReveal .revealModelLoading{color:#567d88!important;text-shadow:none!important;background:transparent!important}
html body.pe-v10-purchase #rarityReveal .peRevealRarityBadge,
html body.pe-v10-purchase #rarityReveal .peRevealLiveBadge,
html body.pe-v10-purchase #rarityReveal .peRevealModelLabel{display:none!important}

/* Compact details card with every value readable on mobile. */
html body.pe-v10-purchase #rarityReveal .peRevealDetails{
  position:static!important;
  inset:auto!important;
  transform:none!important;
  inline-size:100%!important;
  min-inline-size:0!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:6px!important;
  margin:0!important;
  padding:10px!important;
  overflow:hidden!important;
  border:1px solid var(--pe-reveal-line)!important;
  border-radius:20px!important;
  color:var(--pe-reveal-ink)!important;
  background:#fff!important;
  box-shadow:0 8px 22px rgba(24,89,96,.07)!important;
  text-align:center!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealTitleRow{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealTitleRow::before{content:none!important;display:none!important}
html body.pe-v10-purchase #rarityReveal .revealCard h2{
  margin:0!important;
  color:var(--pe10-rarity,#13bca7)!important;
  font-family:Inter,system-ui,sans-serif!important;
  font-size:clamp(30px,8vw,43px)!important;
  font-weight:950!important;
  line-height:.96!important;
  letter-spacing:-.045em!important;
  text-align:center!important;
  text-transform:uppercase!important;
  text-shadow:none!important;
}
html body.pe-v10-purchase #rarityReveal .revealParcelName{display:none!important}
html body.pe-v10-purchase #rarityReveal .revealParcelId{
  display:block!important;
  margin:0!important;
  color:#78a6b4!important;
  font-size:10px!important;
  font-weight:800!important;
  line-height:1.1!important;
  text-align:center!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealLocationRow{
  display:block!important;
  min-inline-size:0!important;
  margin:2px 0 0!important;
  padding:8px 10px!important;
  border:1px solid rgba(27,146,149,.12)!important;
  border-radius:14px!important;
  color:var(--pe-reveal-ink)!important;
  background:linear-gradient(180deg,#f7fcfb,#f0faf8)!important;
  text-align:center!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealLocationIcon{display:none!important}
html body.pe-v10-purchase #rarityReveal .peRevealLocationRow small{
  display:block!important;
  color:#6b96a2!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealLocationRow strong{
  display:block!important;
  margin-top:2px!important;
  color:#244e5f!important;
  font-size:11px!important;
  font-weight:850!important;
  line-height:1.15!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:center!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealMetrics{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:7px!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealMetrics>div{
  min-inline-size:0!important;
  padding:8px 7px!important;
  border:1px solid rgba(24,157,153,.13)!important;
  border-radius:13px!important;
  color:var(--pe-reveal-ink)!important;
  background:#f4fbfa!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealMetrics span{
  display:block!important;
  color:#7199a4!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealMetrics strong{
  display:block!important;
  margin-top:3px!important;
  color:#174c5d!important;
  font-size:11px!important;
  font-weight:900!important;
  line-height:1.08!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  opacity:1!important;
  text-shadow:none!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealMetrics>div:first-child strong{color:var(--pe10-rarity,#13bca7)!important;font-variant-numeric:tabular-nums!important}
html body.pe-v10-purchase #rarityReveal #peRevealOdds{color:#0e817d!important;opacity:1!important;visibility:visible!important}
html body.pe-v10-purchase #rarityReveal .peRevealPurchaseMeta{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  min-inline-size:0!important;
  color:#627f8d!important;
  font-size:9px!important;
  font-weight:850!important;
  letter-spacing:.05em!important;
  text-transform:uppercase!important;
}
html body.pe-v10-purchase #rarityReveal .peRevealPurchaseMeta span{
  min-inline-size:0!important;
  color:#627f8d!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

html body.pe-v10-purchase #rarityReveal #closeReveal{
  inline-size:100%!important;
  min-block-size:50px!important;
  block-size:50px!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  padding:7px 14px!important;
  border:2px solid rgba(255,255,255,.9)!important;
  border-radius:17px!important;
  color:#fff!important;
  background:linear-gradient(104deg,#48df78 0%,#18c5a2 50%,#11b9d2 100%)!important;
  box-shadow:0 10px 22px rgba(16,154,146,.23),inset 0 1px 0 rgba(255,255,255,.38)!important;
  text-shadow:none!important;
}
html body.pe-v10-purchase #rarityReveal #closeReveal span{
  color:#fff!important;
  font-family:Inter,system-ui,sans-serif!important;
  font-size:15px!important;
  font-weight:950!important;
  letter-spacing:.035em!important;
  text-shadow:0 1px 6px rgba(0,104,105,.12)!important;
}
html body.pe-v10-purchase #rarityReveal #closeReveal small{display:none!important;color:#fff!important}
html body.pe-v10-purchase #rarityReveal #closeReveal:active{transform:translateY(1px)!important}

@media(max-width:480px){
  html body.pe-v10-purchase #rarityReveal.pe10PurchaseReveal{
    padding:max(6px,env(safe-area-inset-top,0px)) max(6px,env(safe-area-inset-right,0px)) max(6px,env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left,0px))!important;
  }
  html body.pe-v10-purchase #rarityReveal.pe10PurchaseReveal .revealCard{
    inline-size:calc(100vw - 12px)!important;
    block-size:calc(100dvh - max(12px,env(safe-area-inset-top,0px)) - max(12px,env(safe-area-inset-bottom,0px)))!important;
    max-block-size:calc(100dvh - max(12px,env(safe-area-inset-top,0px)) - max(12px,env(safe-area-inset-bottom,0px)))!important;
    grid-template-rows:auto minmax(0,1fr) auto auto!important;
    gap:7px!important;
    padding:10px!important;
    border-radius:26px!important;
  }
  html body.pe-v10-purchase #rarityReveal .pe121RevealWordmark{padding:5px 10px!important;border-radius:15px!important}
  html body.pe-v10-purchase #rarityReveal .pe121RevealWordmark>span{inline-size:32px!important;block-size:32px!important;border-radius:11px!important;font-size:20px!important}
  html body.pe-v10-purchase #rarityReveal .pe121RevealWordmark b{font-size:17px!important}
  html body.pe-v10-purchase #rarityReveal .pe121RevealBrand>strong{font-size:clamp(22px,6.3vw,28px)!important}
  html body.pe-v10-purchase #rarityReveal .pe121RevealBrand>p{font-size:11px!important}
  html body.pe-v10-purchase #rarityReveal .revealModelStage{border-radius:21px!important}
  html body.pe-v10-purchase #rarityReveal .peRevealDetails{gap:5px!important;padding:9px!important;border-radius:18px!important}
  html body.pe-v10-purchase #rarityReveal .revealCard h2{font-size:clamp(29px,8.5vw,38px)!important}
  html body.pe-v10-purchase #rarityReveal .peRevealLocationRow{padding:7px 9px!important}
  html body.pe-v10-purchase #rarityReveal .peRevealMetrics>div{padding:7px 5px!important}
  html body.pe-v10-purchase #rarityReveal .peRevealMetrics strong{font-size:10.5px!important}
  html body.pe-v10-purchase #rarityReveal .peRevealPurchaseMeta{font-size:8.5px!important}
  html body.pe-v10-purchase #rarityReveal #closeReveal{min-block-size:48px!important;block-size:48px!important;border-radius:16px!important}
}

@media(max-height:690px){
  html body.pe-v10-purchase #rarityReveal.pe10PurchaseReveal .revealCard{
    grid-template-rows:auto minmax(0,1fr) auto auto!important;
    gap:5px!important;
    padding:8px!important;
  }
  html body.pe-v10-purchase #rarityReveal .pe121RevealBrand{gap:1px!important;padding-bottom:1px!important}
  html body.pe-v10-purchase #rarityReveal .pe121RevealBrand>p{display:none!important}
  html body.pe-v10-purchase #rarityReveal .pe121RevealWordmark{padding-block:4px!important}
  html body.pe-v10-purchase #rarityReveal .peRevealDetails{gap:4px!important;padding:7px!important}
  html body.pe-v10-purchase #rarityReveal .revealCard h2{font-size:28px!important}
  html body.pe-v10-purchase #rarityReveal .peRevealLocationRow{padding:6px 8px!important}
  html body.pe-v10-purchase #rarityReveal .peRevealMetrics>div{padding:6px 5px!important}
  html body.pe-v10-purchase #rarityReveal #closeReveal{min-block-size:44px!important;block-size:44px!important}
}

@media(prefers-reduced-motion:reduce){
  html body.pe-v10-purchase #rarityReveal *{animation:none!important;transition:none!important}
}