/* Single authority for the Seal Exchange trench surface. */
.view-exchange .exchange-surface-markets {
  height: calc(100dvh - var(--machine-header-h));
  min-height: 680px;
  padding: 10px 10px 0 !important;
  overflow: hidden;
}

.view-exchange .exchange-surface-markets .market-discovery {
  height: 100%;
  min-height: 0 !important;
  margin: 0;
  display: grid !important;
  grid-template-rows: 58px 54px minmax(0, 1fr) !important;
  gap: 8px;
  padding: 0 !important;
}

.view-exchange .market-category-bar {
  min-height: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
  align-items: center;
  gap: 8px;
}

.view-exchange .market-category-bar > div {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  overflow-x: auto;
  scrollbar-width: none;
}

.view-exchange .market-category-bar > div::-webkit-scrollbar {
  display: none;
}

.view-exchange .market-category-bar button {
  min-height: 38px;
  padding-inline: 14px;
  border-radius: 7px;
  background: transparent;
}

.view-exchange .market-category-bar button.active {
  background: rgba(255, 255, 255, .07);
  color: #f3f1e9;
}

.view-exchange .market-toolbar {
  min-width: 0;
  min-height: 54px;
  margin: 0;
  padding: 8px;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 44px !important;
  align-items: stretch;
  gap: 8px;
  border-radius: 9px;
  background: rgba(255, 255, 255, .025);
}

.view-exchange .market-sort-chips {
  align-items: stretch;
}

.view-exchange .market-sort-chips button {
  min-height: 44px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: #a3adaa !important;
  white-space: nowrap;
}

.view-exchange .market-sort-chips button.active {
  background: rgba(89, 220, 232, .08) !important;
  color: #dffcff !important;
  box-shadow: none !important;
}

.view-exchange .market-search {
  min-height: 48px !important;
  border-radius: 9px !important;
}

.view-exchange .market-stage-jumps {
  display: none !important;
}

.view-exchange .market-board {
  height: 100% !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch;
  gap: 8px;
  overflow: hidden;
}

.view-exchange .market-trench {
  height: 100%;
  min-height: 0 !important;
  padding: 8px;
  display: grid !important;
  grid-template-rows: 54px minmax(0, 1fr) !important;
  overflow: hidden;
  border-radius: 20px;
}

.view-exchange .market-trench > header {
  min-height: 54px !important;
  padding: 6px 8px 8px !important;
  grid-template-columns: 34px minmax(0, 1fr) 30px;
  align-items: center;
  gap: 9px;
}

.view-exchange .market-trench > header > span {
  width: 34px;
  height: 34px;
}

.view-exchange .market-trench > header h2 {
  font-size: clamp(17px, 1.25vw, 23px) !important;
  line-height: 1;
}

.view-exchange .market-trench > header small {
  display: block;
  margin-top: 5px;
  color: #697672;
  font-size: 8px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.view-exchange .market-trench > header > em {
  min-width: 30px;
  width: 30px;
  height: 30px;
}

.view-exchange .market-trench-list {
  min-height: 0;
  padding-right: 3px;
  display: flex !important;
  flex-direction: column;
  gap: 8px !important;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(89, 220, 232, .24) transparent;
}

.view-exchange .market-trench-list::-webkit-scrollbar {
  width: 4px;
}

.view-exchange .market-trench-list::-webkit-scrollbar-thumb {
  border-radius: 99px;
  background: rgba(89, 220, 232, .24);
}

.view-exchange .market-row {
  min-height: 126px !important;
  height: 126px;
  flex: 0 0 126px;
  padding: 14px 15px !important;
  grid-template-columns: 70px minmax(0, 1fr) 88px !important;
  gap: 14px !important;
  border-radius: 18px !important;
}

.view-exchange .market-row:hover {
  transform: none;
  background: rgba(89, 220, 232, .075);
}

.view-exchange .market-row-image {
  width: 70px !important;
  height: 70px !important;
}

.view-exchange .market-row-main > span:first-child {
  gap: 6px;
}

.view-exchange .market-row-main b {
  font-size: 15px !important;
}

.view-exchange .market-row-main em {
  font-size: 9px !important;
}

.view-exchange .market-row-main > small {
  margin-top: 6px !important;
  font-size: 10px !important;
}

.view-exchange .market-row-meta {
  margin-top: 10px !important;
  gap: 5px !important;
  flex-wrap: nowrap;
  overflow: hidden;
}

.view-exchange .market-row-meta i {
  padding: 5px 7px !important;
  font-size: 8px !important;
  white-space: nowrap;
}

.view-exchange .feed-new {
  padding: 3px 5px;
  border-radius: 5px;
  background: #b8ff25;
  color: #07100f;
  font-size: 7px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.view-exchange .market-row-value b {
  font-size: 21px !important;
}

.view-exchange .market-row-value small {
  margin-top: 5px !important;
  font-size: 9px !important;
  white-space: nowrap;
}

.view-exchange .market-row-value > span {
  height: 4px !important;
  margin-top: 12px !important;
}

@media (max-width: 900px) {
  .view-exchange .exchange-surface-markets {
    height: auto;
    min-height: calc(100dvh - var(--machine-header-h));
    overflow: visible;
  }

  .view-exchange .exchange-surface-markets .market-discovery {
    height: auto;
    display: block !important;
  }

  .view-exchange .market-category-bar {
    margin-bottom: 8px;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 300px);
  }

  .view-exchange .market-toolbar {
    min-height: 54px;
    margin-bottom: 8px;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 44px !important;
  }

  .view-exchange .market-sort-chips {
    grid-column: 1;
  }

  .view-exchange .market-stage-jumps {
    margin-bottom: 8px;
    display: grid !important;
  }

  .view-exchange .market-board {
    height: calc(100dvh - var(--machine-header-h) - 238px) !important;
    min-height: 610px !important;
    display: block !important;
    overflow: hidden;
  }

  .view-exchange .market-trench {
    height: 100%;
  }

  .view-exchange .market-trench:not(.active) {
    display: none !important;
  }
}

@media (max-width: 560px) {
  .view-exchange .market-category-bar {
    grid-template-columns: 1fr;
    grid-template-rows: 40px 48px;
    gap: 7px;
  }

  .view-exchange .market-toolbar {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 44px !important;
  }

  .view-exchange .market-sort-chips {
    grid-row: 1;
  }

  .view-exchange .market-search {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .view-exchange .market-board {
    height: 680px !important;
  }

  .view-exchange .market-row {
    min-height: 116px !important;
    height: 116px;
    flex-basis: 116px;
    grid-template-columns: 58px minmax(0, 1fr) 74px !important;
  }

  .view-exchange .market-row-image {
    width: 58px !important;
    height: 58px !important;
  }

  .view-exchange .market-row-meta i:nth-child(3) {
    display: none;
  }
}

/* Artifact detail composition */
.view-exchange .exchange-surface-detail .market-detail-header {
  min-height: clamp(360px, 46vh, 540px) !important;
}

.view-exchange .market-detail-back {
  display: none !important;
}

.view-exchange .market-detail-native .market-backing-ticket {
  min-height: 0 !important;
}

.view-exchange .market-backing-ticket > small {
  margin-top: auto;
  padding-top: 30px;
}

.view-exchange .sealed-market-story {
  margin-top: 18px;
  padding: clamp(30px, 4vw, 64px);
  border-radius: 28px;
  background:
    radial-gradient(circle at 88% 12%, rgba(89, 220, 232, .08), transparent 31%),
    linear-gradient(145deg, #101c1b, #071011 74%);
}

.view-exchange .sealed-market-story > header {
  display: grid;
  grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
  align-items: end;
  gap: clamp(34px, 6vw, 100px);
}

.view-exchange .sealed-market-story > header h2 {
  max-width: 650px;
  margin-top: 14px;
  font-size: clamp(46px, 5vw, 76px);
  line-height: .95;
  letter-spacing: -.06em;
}

.view-exchange .sealed-market-story > header p {
  max-width: 760px;
  color: #a7b2ae;
  font-size: clamp(17px, 1.35vw, 22px);
  line-height: 1.55;
}

.view-exchange .sealed-market-story-gallery {
  min-height: clamp(430px, 56vw, 720px);
  margin-top: clamp(28px, 4vw, 54px);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  gap: 10px;
}

.view-exchange .sealed-market-story-gallery figure,
.view-exchange .sealed-market-story-gallery figure.primary,
.view-exchange .sealed-market-story-gallery figure:only-child {
  grid-column: auto;
  grid-row: auto;
  border-radius: 22px;
}

.view-exchange .sealed-market-story-gallery.count-2,
.view-exchange .sealed-market-story-gallery.count-3 {
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, .75fr);
  grid-template-rows: repeat(2, minmax(0, 1fr));
}

.view-exchange .sealed-market-story-gallery.count-2 figure.primary,
.view-exchange .sealed-market-story-gallery.count-3 figure.primary {
  grid-row: 1 / 3;
}

.view-exchange .sealed-market-story-copy {
  margin-top: clamp(30px, 4vw, 52px);
}

.view-exchange .detail-action-dock .dock-back {
  transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}

.view-exchange .detail-action-dock .dock-back:hover,
.view-exchange .detail-action-dock .dock-back:focus-visible {
  background: #b8ff25 !important;
  color: #07100f !important;
  box-shadow: 0 0 0 7px rgba(184, 255, 37, .1);
}

@media (max-width: 760px) {
  .view-exchange .sealed-market-story {
    padding: 26px 18px;
    border-radius: 22px;
  }

  .view-exchange .sealed-market-story > header {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .view-exchange .sealed-market-story > header h2 {
    font-size: clamp(42px, 13vw, 62px);
  }

  .view-exchange .sealed-market-story-gallery,
  .view-exchange .sealed-market-story-gallery.count-2,
  .view-exchange .sealed-market-story-gallery.count-3 {
    min-height: 440px;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
  }

  .view-exchange .sealed-market-story-gallery figure:not(:first-child) {
    display: none;
  }
}

/* Artifact completion retains the artifact identity. */
.view-exchange .exchange-complete-artifact {
  width: max-content;
  margin: 0 auto clamp(28px, 4vh, 42px);
  display: grid;
  justify-items: center;
  gap: 12px;
}

.view-exchange .exchange-complete-artifact > span {
  position: relative;
  width: clamp(150px, 13vw, 190px);
  height: clamp(150px, 13vw, 190px);
  display: block;
  overflow: visible;
  border-radius: 30%;
  background: #07100f;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .34);
}

.view-exchange .exchange-complete-artifact > span > img {
  border-radius: 30%;
  object-fit: cover;
}

.view-exchange .exchange-complete-artifact > span > i {
  position: absolute;
  right: -13px;
  bottom: -13px;
  width: 58px;
  height: 58px;
  overflow: hidden;
  border-radius: 50%;
  padding: 4px;
  background: linear-gradient(90deg, #f3b94d, #b9d5bc 55%, #59dce8);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .38);
}

.view-exchange .exchange-complete-artifact > span > i img {
  border-radius: 50%;
  object-fit: cover;
}

.view-exchange .exchange-complete-artifact > small {
  color: var(--cyan);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.view-exchange .exchange-complete > code {
  font-family: var(--mono);
  font-size: clamp(11px, 1vw, 14px) !important;
  letter-spacing: .08em !important;
}

/* One aligned workflow language: gradient rings, no numbered badges. */
.view-exchange .dock-progress button {
  display: grid !important;
  grid-template-rows: 28px 12px !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 6px !important;
}

.view-exchange .dock-progress {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.view-exchange .dock-progress button i {
  position: relative !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: conic-gradient(from -90deg, rgba(243, 185, 77, .16), rgba(89, 220, 232, .2), rgba(255, 255, 255, .06)) !important;
  color: transparent !important;
}

.view-exchange .dock-progress button i::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  background: #0a1515;
}

.view-exchange .dock-progress button.done i {
  background: conic-gradient(from -90deg, #f3b94d, #b9d5bc 55%, #59dce8) !important;
}

.view-exchange .dock-progress button.active i {
  background: conic-gradient(from -90deg, #f3b94d 0 28%, #acd6c2 52%, #59dce8 72%, rgba(89, 220, 232, .12) 72% 100%) !important;
  animation: seal-ring-progress 1.8s cubic-bezier(.45, 0, .2, 1) infinite;
}

.view-exchange .dock-progress button span {
  min-height: 12px;
  display: block;
  line-height: 12px !important;
  text-align: center;
}

.view-exchange .exchange-complete {
  justify-items: center !important;
}

.view-exchange .exchange-complete > .eyebrow,
.view-exchange .exchange-complete > h2,
.view-exchange .exchange-complete > p,
.view-exchange .exchange-complete > code {
  justify-self: center;
  text-align: center;
}

@keyframes seal-ring-progress {
  0% { transform: rotate(0deg); }
  65% { transform: rotate(310deg); }
  100% { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .view-exchange .dock-progress button.active i {
    animation: none;
  }
}

.view-exchange .exchange-execute-artifact {
  position: relative;
  width: 178px;
  height: 178px;
  margin: 0 auto 34px;
  display: grid;
  place-items: center;
}

.view-exchange .exchange-execute-artifact > span {
  position: relative;
  z-index: 1;
  width: 142px;
  height: 142px;
  overflow: hidden;
  border-radius: 50%;
  background: #07100f;
}

.view-exchange .exchange-execute-artifact > span img {
  object-fit: cover;
}

.view-exchange .exchange-execute-artifact > i {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(from -90deg, #f3b94d, #b9d5bc 48%, #59dce8 72%, rgba(89, 220, 232, .08) 72% 100%);
  animation: seal-ring-progress 1.5s linear infinite;
}

.view-exchange .exchange-execute-artifact > i::after {
  content: "";
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  background: #081315;
}

.view-exchange .exchange-executing > div:last-child span {
  min-height: 34px;
  padding: 0 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: rgba(255, 255, 255, .035);
}

.view-exchange .exchange-executing > div:last-child span.active {
  background: linear-gradient(90deg, rgba(243, 185, 77, .1), rgba(89, 220, 232, .1));
}

.view-exchange .exchange-executing > div:last-child span.done {
  color: #a9d7c2;
}
