@import url("./glass-tokens?v=202607141559");

:root {
  --mt-gap-xs: 0.618rem;
  --mt-gap-sm: 1rem;
  --mt-gap-md: 1.618rem;
  --mt-gap-lg: 2.618rem;
  --mt-radius: 1.15rem;
  --mt-radius-sm: 0.9rem;
  --mt-panel: rgba(7, 10, 15, 0.86);
  --mt-panel-strong: rgba(4, 7, 10, 0.94);
  --mt-panel-soft: rgba(10, 14, 18, 0.72);
  --mt-line: rgba(255, 255, 255, 0.08);
  --mt-line-strong: rgba(142, 184, 234, 0.16);
  --mt-text: rgba(238, 242, 247, 0.96);
  --mt-muted: rgba(154, 168, 187, 0.78);
  --mt-dim: rgba(122, 136, 154, 0.68);
  --mt-blue: rgba(142, 184, 234, 0.94);
  --mt-blue-soft: rgba(142, 184, 234, 0.12);
  --mt-ok: rgba(109, 205, 168, 0.94);
  --mt-ok-soft: rgba(109, 205, 168, 0.14);
  --mt-warn: rgba(232, 176, 96, 0.94);
  --mt-warn-soft: rgba(232, 176, 96, 0.14);
  --mt-danger: rgba(224, 112, 112, 0.94);
  --mt-danger-soft: rgba(224, 112, 112, 0.14);
}

body.hg-markets {
  --font-display: "Inter", "Sora", sans-serif;
  --font-body: "Inter", "Sora", "Noto Sans JP", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", "Cascadia Code", monospace;
  color: var(--mt-text);
  font-family: var(--font-body);
  font-variant-numeric: tabular-nums;
  line-height: 1.5;
  background: #0b0f14;
}

.mt-root {
  position: relative;
  z-index: 2;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0;
  padding: 1.15rem 12px 1.5rem;
  display: flex;
  flex-direction: column;
  gap: var(--mt-gap-md);
}

.mt-header,
.mt-pane,
.mt-feed,
.mt-sidepanel,
.mt-product-row,
.mt-ticker {
  position: relative;
  overflow: hidden;
  background: var(--mt-panel);
  border: 1px solid var(--mt-line);
  border-radius: var(--mt-radius);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(16px);
}

.mt-header::before,
.mt-pane::before,
.mt-feed::before,
.mt-sidepanel::before,
.mt-product-row::before,
.mt-ticker::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(142, 184, 234, 0.1) 0%, transparent 14%),
    radial-gradient(circle at 0% 0%, rgba(142, 184, 234, 0.06) 0%, transparent 42%);
  mix-blend-mode: screen;
}

.mt-header {
  padding: 1.25rem 1.25rem 1rem;
}

.mt-header::after {
  content: "[ pm ] [ hl ] [ coupling ] [ tape ]";
  position: absolute;
  inset: 1rem 1.1rem auto auto;
  font-family: var(--font-mono);
  font-size: 0.58rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(142, 184, 234, 0.36);
  pointer-events: none;
}

.mt-header-top {
  display: flex;
  justify-content: space-between;
  gap: var(--mt-gap-md);
  align-items: flex-start;
}

.mt-heading {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
}

.mt-kicker,
.mt-pane-h,
.mt-feed-h,
.mt-product-label {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.mt-kicker {
  color: var(--mt-blue);
}

.mt-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 1vw + 1.15rem, 2rem);
  line-height: 1.05;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.mt-tagline {
  margin: 0;
  max-width: 70ch;
  color: var(--mt-muted);
  font-size: 0.92rem;
}

.mt-shortcuts {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.65rem 0.9rem;
  align-items: center;
  color: var(--mt-muted);
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mt-shortcuts a {
  color: var(--mt-muted);
}

.mt-shortcuts a:hover,
.mt-shortcuts a:focus-visible {
  color: var(--mt-text);
  outline: none;
}

.mt-shortcuts kbd {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  padding: 0.2rem 0.38rem;
  border-radius: 0.45rem;
  border: 1px solid var(--mt-line);
  background: rgba(255, 255, 255, 0.03);
  color: var(--mt-text);
}

.mt-stream-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.5rem 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--mt-line);
  background: rgba(255, 255, 255, 0.025);
  color: var(--mt-muted);
}

.mt-stream-pill::before {
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: rgba(154, 168, 187, 0.72);
  box-shadow: 0 0 0 0 rgba(154, 168, 187, 0.12);
}

.mt-stream-pill.is-live {
  color: var(--mt-text);
  border-color: rgba(109, 205, 168, 0.24);
  background: rgba(109, 205, 168, 0.08);
}

.mt-stream-pill.is-live::before {
  background: var(--mt-ok);
  box-shadow: 0 0 0 0.35rem rgba(109, 205, 168, 0.12);
}

.mt-stream-pill.is-poll {
  color: var(--mt-warn);
  border-color: rgba(232, 176, 96, 0.24);
  background: rgba(232, 176, 96, 0.08);
}

.mt-stream-pill.is-poll::before {
  background: var(--mt-warn);
  box-shadow: 0 0 0 0.35rem rgba(232, 176, 96, 0.1);
}

.mt-stream-pill.is-error {
  color: rgba(255, 208, 208, 0.95);
  border-color: rgba(224, 112, 112, 0.26);
  background: rgba(224, 112, 112, 0.08);
}

.mt-stream-pill.is-error::before {
  background: var(--mt-danger);
  box-shadow: 0 0 0 0.35rem rgba(224, 112, 112, 0.1);
}

.mt-tablist {
  display: flex;
  gap: 0.75rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--mt-line);
}

.mt-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8rem 1rem;
  border: 1px solid var(--mt-line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.02);
  color: var(--mt-muted);
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transition:
    transform 160ms ease,
    background-color 160ms ease,
    border-color 160ms ease,
    color 160ms ease;
}

.mt-tab:hover,
.mt-tab:focus-visible {
  color: var(--mt-text);
  border-color: rgba(142, 184, 234, 0.22);
  background: rgba(142, 184, 234, 0.06);
  transform: translateY(-1px);
  outline: none;
}

.mt-tab.is-active {
  color: var(--mt-text);
  border-color: rgba(142, 184, 234, 0.28);
  background: linear-gradient(135deg, rgba(142, 184, 234, 0.16) 0%, rgba(142, 184, 234, 0.05) 100%);
}

.mt-ticker-slot {
  display: block;
}

.mt-ticker {
  border-radius: var(--mt-radius-sm);
  background: rgba(4, 6, 10, 0.9);
}

.mt-ticker-inner {
  display: inline-flex;
  align-items: center;
  gap: 2.2rem;
  min-width: 100%;
  padding: 0.75rem 0;
  padding-left: 100%;
  white-space: nowrap;
  font-family: var(--font-mono);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mt-text);
  animation: mt-marquee 62s linear infinite;
}

.mt-ticker .mt-tick-item {
  color: var(--mt-text);
}

.mt-ticker .mt-tick-item em {
  color: var(--mt-blue);
  font-style: normal;
}

.mt-ticker .is-negative {
  color: rgba(255, 198, 208, 0.92);
}

.mt-ticker .is-positive {
  color: rgba(182, 240, 217, 0.95);
}

@keyframes mt-marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

.is-hidden {
  display: none !important;
}

.mt-root > .hg-ascii-shell {
  margin: 0;
  background: var(--mt-panel-strong);
}

.mt-signal-row {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(22rem, 0.92fr);
  gap: var(--mt-gap-sm);
  align-items: stretch;
}

.mt-signal-main,
.mt-coupling-slot,
.mt-signal-side {
  min-height: 0;
}

.mt-signal-main > .hg-ascii-shell,
.mt-coupling-slot > .hg-ascii-shell {
  height: 100%;
}

.mt-signal-side {
  display: grid;
  grid-template-rows: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: var(--mt-gap-sm);
}

.mt-main {
  display: grid;
  grid-template-columns: minmax(18rem, 1fr) minmax(24rem, 1.618fr) minmax(17rem, 0.92fr);
  gap: var(--mt-gap-sm);
  min-height: clamp(28rem, 48vh, 46rem);
}

.mt-view.is-hidden {
  display: none !important;
}

.mt-pane,
.mt-feed,
.mt-sidepanel {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.mt-pane-h,
.mt-feed-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid var(--mt-line);
  color: var(--mt-blue);
  background: rgba(255, 255, 255, 0.015);
}

.mt-pane-h::after,
.mt-feed-h::after {
  content: "+ + +";
  font-size: 0.54rem;
  letter-spacing: 0.16em;
  color: rgba(142, 184, 234, 0.34);
}

.mt-scroll,
.mt-feed-body {
  min-height: 0;
  flex: 1;
  overflow: auto;
}

.mt-scroll {
  scrollbar-width: thin;
}

.mt-markets-table {
  width: 100%;
  border-collapse: collapse;
}

.mt-markets-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 0.7rem 0.8rem;
  background: rgba(7, 10, 15, 0.96);
  border-bottom: 1px solid var(--mt-line);
  color: var(--mt-dim);
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mt-markets-table tbody tr {
  cursor: pointer;
  transition:
    background-color 140ms ease,
    color 140ms ease;
}

.mt-markets-table tbody tr:hover,
.mt-markets-table tbody tr:focus-visible {
  background: rgba(142, 184, 234, 0.06);
  outline: none;
}

.mt-markets-table tbody tr.is-selected {
  background: rgba(142, 184, 234, 0.12);
}

.mt-markets-table tbody tr.is-hovered {
  background: rgba(196, 154, 88, 0.09);
}

.mt-markets-table tbody tr.is-coupled {
  box-shadow: inset 0 0 0 1px rgba(196, 154, 88, 0.16);
}

.mt-markets-table td {
  padding: 0.82rem 0.8rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  vertical-align: top;
}

.mt-market-cell {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
}

.mt-market-label {
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--mt-text);
}

.mt-market-meta {
  color: var(--mt-dim);
  font-family: var(--font-mono);
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mt-market-meta strong {
  color: var(--mt-blue);
  font-weight: 500;
}

.mt-value {
  text-align: right;
  font-family: var(--font-mono);
  font-size: 0.8rem;
  white-space: nowrap;
}

.mt-value.mt-yes,
.mt-yes {
  color: rgba(182, 240, 217, 0.94);
}

.mt-value.mt-no,
.mt-no {
  color: rgba(255, 198, 208, 0.94);
}

.mt-spark {
  display: block;
  width: 100%;
  min-width: 5rem;
  height: 1.4rem;
  color: var(--mt-blue);
}

.mt-spark.is-positive {
  color: var(--mt-ok);
}

.mt-spark.is-negative {
  color: var(--mt-danger);
}

.mt-vol {
  text-align: right;
  color: var(--mt-text);
  font-family: var(--font-mono);
  font-size: 0.78rem;
}

.mt-note {
  margin: 0;
  padding: 0.95rem 1rem;
  border-top: 1px solid var(--mt-line);
  color: var(--mt-muted);
  font-size: 0.8rem;
  line-height: 1.6;
}

.mt-books {
  min-height: 0;
  overflow: auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
  gap: var(--mt-gap-sm);
  padding: var(--mt-gap-sm);
}

.mt-book-block {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  padding: 1rem;
  border-radius: var(--mt-radius-sm);
  border: 1px solid rgba(255, 255, 255, 0.06);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0.01) 100%);
  cursor: pointer;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background-color 160ms ease;
}

.mt-book-block:hover,
.mt-book-block:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(142, 184, 234, 0.18);
  background: rgba(142, 184, 234, 0.05);
  outline: none;
}

.mt-book-block.is-selected {
  border-color: rgba(142, 184, 234, 0.28);
  background:
    linear-gradient(135deg, rgba(142, 184, 234, 0.12) 0%, rgba(142, 184, 234, 0.04) 100%);
}

.mt-book-block.is-unavailable {
  border-color: rgba(224, 112, 112, 0.16);
  background: rgba(224, 112, 112, 0.04);
}

.mt-book-head {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  align-items: flex-start;
}

.mt-book-q {
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.45;
}

.mt-book-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.38rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  font-family: var(--font-mono);
  font-size: 0.58rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--mt-muted);
}

.mt-book-chip.is-live {
  color: var(--mt-ok);
  border-color: rgba(109, 205, 168, 0.22);
  background: rgba(109, 205, 168, 0.08);
}

.mt-book-chip.is-poll {
  color: var(--mt-warn);
  border-color: rgba(232, 176, 96, 0.22);
  background: rgba(232, 176, 96, 0.08);
}

.mt-book-chip.is-error {
  color: rgba(255, 208, 208, 0.95);
  border-color: rgba(224, 112, 112, 0.22);
  background: rgba(224, 112, 112, 0.08);
}

.mt-book-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
}

.mt-book-metric {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}

.mt-book-metric-label,
.mt-detail-label {
  color: var(--mt-dim);
  font-family: var(--font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mt-book-metric-value,
.mt-detail-value {
  color: var(--mt-text);
  font-family: var(--font-mono);
  font-size: 0.76rem;
}

.mt-depth {
  display: grid;
  grid-template-columns: repeat(10, minmax(0, 1fr));
  align-items: end;
  gap: 0.28rem;
  min-height: 4.6rem;
  padding: 0.4rem 0;
}

.mt-depth-bar {
  display: grid;
  grid-template-rows: 1fr 1fr;
  gap: 0.18rem;
  min-height: 4.2rem;
}

.mt-depth-bid,
.mt-depth-ask {
  align-self: end;
  border-radius: 999px;
  min-height: 0.3rem;
}

.mt-depth-bid {
  background: linear-gradient(180deg, rgba(109, 205, 168, 0.18) 0%, rgba(109, 205, 168, 0.94) 100%);
}

.mt-depth-ask {
  background: linear-gradient(180deg, rgba(232, 176, 96, 0.18) 0%, rgba(232, 176, 96, 0.94) 100%);
}

.mt-book-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.mt-book-side {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-height: 0;
}

.mt-book-level {
  display: flex;
  justify-content: space-between;
  gap: 0.45rem;
  color: var(--mt-muted);
  font-family: var(--font-mono);
  font-size: 0.68rem;
}

.mt-book-level strong {
  color: var(--mt-text);
  font-weight: 500;
}

.mt-book-note {
  margin: 0;
  color: var(--mt-muted);
  font-size: 0.74rem;
  line-height: 1.5;
}

.mt-book-empty,
.mt-empty {
  padding: 1rem;
  border-radius: var(--mt-radius-sm);
  border: 1px dashed rgba(255, 255, 255, 0.08);
  color: var(--mt-muted);
  font-size: 0.82rem;
}

.mt-hl-detail {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--mt-gap-sm);
  padding: var(--mt-gap-sm);
  border-bottom: 1px solid var(--mt-line);
}

.mt-detail-card {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.9rem;
  border-radius: var(--mt-radius-sm);
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(255, 255, 255, 0.02);
}

.mt-feed-body {
  display: flex;
  flex-direction: column;
  padding: 0.85rem 1rem 1rem;
  gap: 0.45rem;
}

.mt-feed-line {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.55rem 0.65rem;
  border-radius: 0.72rem;
  background: rgba(255, 255, 255, 0.02);
  color: var(--mt-muted);
  font-family: var(--font-mono);
  font-size: 0.68rem;
  line-height: 1.5;
}

.mt-feed-line.is-fresh {
  background: rgba(142, 184, 234, 0.08);
  color: var(--mt-text);
}

.mt-feed-time {
  color: var(--mt-dim);
  white-space: nowrap;
}

.mt-leader-inner {
  gap: 0.55rem;
}

.mt-product-row {
  padding: 1rem 1.1rem;
}

.mt-product-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8rem 1rem;
}

.mt-product-inner a {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 0.72rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(255, 255, 255, 0.02);
  color: var(--mt-text);
  font-family: var(--font-mono);
  font-size: 0.64rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mt-product-note {
  padding: 0;
  border: none;
  background: transparent;
  font-size: 0.78rem;
}

.mt-product-note code {
  font-family: var(--font-mono);
  font-size: 0.74em;
  color: var(--mt-blue);
}

.mt-footer {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--mt-gap-sm);
  min-height: 14rem;
}

.mt-sidepanel .mt-feed-body {
  padding-top: 1rem;
}

@media (max-width: 1240px) {
  .mt-signal-row {
    grid-template-columns: 1fr;
  }

  .mt-signal-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
  }

  .mt-main {
    grid-template-columns: minmax(18rem, 1fr) minmax(20rem, 1.25fr);
  }

  .mt-main > :last-child {
    grid-column: 1 / -1;
  }

  .mt-footer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 920px) {
  .mt-root {
    width: 100%;
    padding: 0.7rem 12px 1rem;
  }

  .mt-header,
  .mt-pane,
  .mt-feed,
  .mt-sidepanel,
  .mt-product-row,
  .mt-ticker,
  .mt-root > .hg-ascii-shell {
    border-radius: 1rem;
  }

  .mt-header-top {
    flex-direction: column;
  }

  .mt-header::after {
    display: none;
  }

  .mt-shortcuts {
    justify-content: flex-start;
  }

  .mt-main,
  .mt-footer {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .mt-signal-side {
    grid-template-columns: 1fr;
  }

  .mt-book-meta,
  .mt-hl-detail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .mt-root {
    width: 100%;
    gap: 0.85rem;
    padding: 0.7rem 10px 1rem;
  }

  .mt-header {
    padding: 0.95rem;
  }

  .mt-tablist {
    gap: 0.5rem;
  }

  .mt-tab {
    flex: 1 1 0;
    padding-inline: 0.6rem;
  }

  .mt-markets-table thead th,
  .mt-markets-table td {
    padding-inline: 0.55rem;
  }

  .mt-market-label {
    font-size: 0.82rem;
  }

  .mt-book-meta,
  .mt-hl-detail,
  .mt-book-grid {
    grid-template-columns: 1fr;
  }

  .mt-books {
    grid-template-columns: 1fr;
    padding: 0.85rem;
  }

  .mt-feed-line {
    flex-direction: column;
    gap: 0.2rem;
  }

  .mt-product-inner {
    align-items: flex-start;
  }
}

/* Light brand palette for markets terminal */

body.hg-markets {
  --mt-panel: rgba(255, 255, 255, 0.84);
  --mt-panel-strong: rgba(255, 255, 255, 0.94);
  --mt-panel-soft: rgba(255, 255, 255, 0.74);
  --mt-line: rgba(33, 79, 184, 0.12);
  --mt-line-strong: rgba(30, 102, 255, 0.22);
  --mt-text: #1e2f67;
  --mt-muted: rgba(56, 79, 139, 0.74);
  --mt-dim: rgba(56, 79, 139, 0.58);
  --mt-blue: #1e66ff;
  --mt-blue-soft: rgba(30, 102, 255, 0.1);
}

body.hg-markets .mt-header,
body.hg-markets .mt-pane,
body.hg-markets .mt-feed,
body.hg-markets .mt-sidepanel,
body.hg-markets .mt-product-row,
body.hg-markets .mt-ticker,
body.hg-markets .mt-root > .hg-ascii-shell {
  border-color: var(--mt-line);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.88) 0%, rgba(241, 246, 255, 0.84) 100%);
  box-shadow: 0 18px 44px rgba(95, 131, 218, 0.14);
}

body.hg-markets .mt-header::before,
body.hg-markets .mt-pane::before,
body.hg-markets .mt-feed::before,
body.hg-markets .mt-sidepanel::before,
body.hg-markets .mt-product-row::before,
body.hg-markets .mt-ticker::before {
  background:
    linear-gradient(180deg, rgba(30, 102, 255, 0.08) 0%, transparent 14%),
    radial-gradient(circle at 0% 0%, rgba(30, 102, 255, 0.06) 0%, transparent 42%);
  mix-blend-mode: normal;
}

body.hg-markets .mt-shortcuts kbd,
body.hg-markets .mt-stream-pill,
body.hg-markets .mt-tab,
body.hg-markets .mt-book-chip,
body.hg-markets .mt-detail-card,
body.hg-markets .mt-feed-line,
body.hg-markets .mt-product-inner a,
body.hg-markets .mt-book-block,
body.hg-markets .mt-empty,
body.hg-markets .mt-book-empty {
  border-color: rgba(33, 79, 184, 0.12);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 10px 24px rgba(122, 146, 214, 0.06);
}

body.hg-markets .mt-tab:hover,
body.hg-markets .mt-tab:focus-visible,
body.hg-markets .mt-book-block:hover,
body.hg-markets .mt-book-block:focus-visible {
  background: rgba(30, 102, 255, 0.08);
  border-color: rgba(30, 102, 255, 0.22);
}

body.hg-markets .mt-tab.is-active,
body.hg-markets .mt-book-block.is-selected,
body.hg-markets .mt-feed-line.is-fresh,
body.hg-markets .mt-markets-table tbody tr.is-selected {
  background: rgba(30, 102, 255, 0.1);
}

body.hg-markets .mt-ticker {
  background: rgba(255, 255, 255, 0.76);
}

body.hg-markets .mt-pane-h,
body.hg-markets .mt-feed-h {
  border-bottom-color: var(--mt-line);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.66), rgba(241, 246, 255, 0.3));
}

body.hg-markets .mt-markets-table thead th {
  background: rgba(245, 248, 255, 0.96);
  border-bottom-color: var(--mt-line);
}

body.hg-markets .mt-markets-table td {
  border-bottom-color: rgba(33, 79, 184, 0.08);
}

body.hg-markets .mt-markets-table tbody tr:hover,
body.hg-markets .mt-markets-table tbody tr:focus-visible {
  background: rgba(30, 102, 255, 0.06);
}

.mt-predict-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.5rem;
  border: 1px solid rgba(109, 205, 168, 0.3);
  border-radius: 0.35rem;
  background: rgba(109, 205, 168, 0.1);
  color: rgba(182, 240, 217, 0.9);
  font-family: var(--font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 140ms ease;
}

.mt-predict-btn:hover,
.mt-predict-btn:focus-visible {
  background: rgba(109, 205, 168, 0.2);
  outline: none;
}

.mt-predict-form {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(7, 10, 15, 0.78);
}

.mt-predict-form-inner {
  width: min(22rem, calc(100% - 2rem));
  padding: 1.25rem;
  border: 1px solid var(--mt-line);
  border-radius: var(--mt-radius-sm);
  background: var(--mt-panel-strong);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.mt-predict-form-inner h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 0.92rem;
  color: var(--mt-text);
}

.mt-predict-form-inner label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.78rem;
  color: var(--mt-muted);
}

.mt-predict-form-inner input {
  flex: 1;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--mt-line);
  border-radius: 0.3rem;
  background: rgba(255, 255, 255, 0.04);
  color: var(--mt-text);
  font-family: var(--font-mono);
  font-size: 0.78rem;
}

.mt-predict-actions {
  display: flex;
  gap: 0.5rem;
  justify-content: flex-end;
}

.mt-predict-actions button {
  padding: 0.4rem 0.8rem;
  border: 1px solid var(--mt-line);
  border-radius: 0.3rem;
  background: rgba(255, 255, 255, 0.06);
  color: var(--mt-text);
  font-family: var(--font-mono);
  font-size: 0.72rem;
  cursor: pointer;
}

.mt-predict-actions button:first-child {
  background: rgba(109, 205, 168, 0.14);
  border-color: rgba(109, 205, 168, 0.3);
  color: rgba(182, 240, 217, 0.95);
}

.mt-predict-status {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  color: var(--mt-muted);
  min-height: 1.2rem;
 }

 .hg-predict-market-page {
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0;
  background: #0b0e11;
  color: rgba(248, 250, 252, 0.96);
  font-family: "Inter", "IBM Plex Sans", "Noto Sans JP", sans-serif;
 }

 .pm-root {
  width: 100%;
  margin: 0;
  padding: 6px 8px 16px;
 }

 .pm-topbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 40px;
  padding: 0 6px 4px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
 }

 .pm-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
  text-decoration: none;
 }

 .pm-brand-mark {
  width: 22px;
  height: 28px;
  display: inline-grid;
  place-items: center;
 }

 .pm-brand-mark img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
 }

 .pm-brand-wordmark {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: rgba(245, 248, 255, 0.96);
 }

 .pm-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-width: 0;
 }

 .pm-nav-link {
  position: relative;
  padding: 6px 0 8px;
  border: 0;
  background: transparent;
  color: rgba(164, 174, 192, 0.82);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
 }

 .pm-nav-link::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: 2px;
  border-radius: 999px;
  background: #3b82f6;
  opacity: 0;
  transform: scaleX(0.4);
  transition: opacity 160ms ease, transform 160ms ease;
 }

 .pm-nav-link:hover,
 .pm-nav-link:focus-visible,
 .pm-nav-link.is-active {
  color: #ffffff;
  outline: none;
 }

 .pm-nav-link:hover::after,
 .pm-nav-link:focus-visible::after,
 .pm-nav-link.is-active::after {
  opacity: 1;
  transform: scaleX(1);
 }

 .pm-nav-link-button {
  font: inherit;
 }

 .pm-topbar-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
 }

 .pm-primary-button,
 .pm-ghost-button,
 .pm-wallet-chip,
 .pm-icon-button,
 .pm-wallet-setup-button,
 .pm-modal-close {
  min-height: 32px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: #11151b;
  color: #f8fafc;
  font: inherit;
 }

 .pm-primary-button,
 .pm-ghost-button,
 .pm-wallet-chip,
 .pm-wallet-setup-button,
 .pm-modal-close {
  padding: 0 12px;
  font-size: 12px;
  font-weight: 600;
 }

 .pm-primary-button {
  border-color: transparent;
  background: linear-gradient(135deg, #2370ff 0%, #3a82ff 100%);
  box-shadow: 0 10px 20px rgba(35, 112, 255, 0.24);
 }

 .pm-ghost-button,
 .pm-wallet-chip,
 .pm-wallet-setup-button,
 .pm-modal-close {
  background: #0f1319;
  color: rgba(235, 240, 248, 0.92);
 }

 .pm-ghost-button-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
 }

 .pm-icon-button {
  width: 32px;
  padding: 0;
  display: inline-grid;
  place-items: center;
  cursor: pointer;
 }

 .pm-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 292px;
  gap: 10px;
  align-items: start;
  padding-top: 10px;
 }

 .pm-main-column {
  min-width: 0;
 }

 .pm-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 12px;
  align-items: start;
  margin-bottom: 12px;
 }

 .pm-hero-copy h1 {
  margin: 0;
  font-size: 32px;
  line-height: 1.06;
  letter-spacing: -0.04em;
  color: #ffffff;
 }

 .pm-hero-copy p {
  margin: 10px 0 0;
  color: rgba(151, 161, 178, 0.82);
  font-size: 14px;
  line-height: 1.5;
 }

 .pm-wallet-panel,
 .pm-sidebar-card,
 .pm-market-card,
 .pm-market-modal__card {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  background: #101419;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
 }

 .pm-wallet-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
 }

 .pm-panel-kicker {
  color: rgba(118, 136, 166, 0.9);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
 }

 .pm-controls {
  display: grid;
  gap: 6px;
  margin-bottom: 6px;
 }

 .pm-search-row {
  display: flex;
  align-items: center;
  gap: 6px;
 }

 .pm-search-field {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: #0f1318;
  color: rgba(151, 161, 178, 0.78);
 }

 .pm-search-field svg {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
 }

 .pm-search-field input {
  width: 100%;
  border: 0;
  background: transparent;
  color: #ffffff;
  font: inherit;
 }

 .pm-search-field input:focus {
  outline: none;
 }

 .pm-search-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
 }

 .pm-category-row {
  display: flex;
  align-items: center;
  gap: 10px;
  overflow-x: auto;
  scrollbar-width: none;
 }

 .pm-category-row::-webkit-scrollbar {
  display: none;
 }

 .pm-category-chip {
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(151, 161, 178, 0.76);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
 }

 .pm-category-chip.is-active {
  color: #ffffff;
 }

.pm-market-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: auto;
  gap: 10px;
  align-items: start;
}

.pm-market-notice {
  grid-column: 1 / -1;
  padding: 10px 12px;
  border: 1px solid rgba(245, 158, 11, 0.34);
  border-radius: 8px;
  background: rgba(120, 63, 4, 0.18);
  color: #f8d08b;
  font-size: 12px;
  line-height: 1.45;
}

.pm-market-card {
  position: relative;
  display: grid;
  gap: 10px;
  padding: 12px;
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
 }

 .pm-market-card:hover,
 .pm-market-card:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(59, 130, 246, 0.34);
  box-shadow: 0 16px 36px rgba(25, 32, 44, 0.42);
  outline: none;
 }

 .pm-market-card-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: start;
 }

 .pm-market-icon {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
  background: linear-gradient(135deg, rgba(35, 112, 255, 0.3) 0%, rgba(35, 112, 255, 0.1) 100%);
  color: #cfe1ff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
 }

 .pm-market-title {
  margin: 0;
  color: #f8fafc;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
 }

 .pm-market-subtitle {
  margin: 4px 0 0;
  color: rgba(151, 161, 178, 0.74);
  font-size: 11px;
  line-height: 1.4;
 }

 .pm-market-outcomes {
  display: grid;
  gap: 8px;
 }

 .pm-outcome-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  gap: 8px;
  align-items: center;
  min-height: 34px;
  padding: 8px 10px;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(53, 31, 22, 0.38) 0%, rgba(28, 20, 18, 0.6) 100%);
 }

 .pm-outcome-label {
  color: #f8fafc;
  font-size: 12px;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
 }

 .pm-outcome-probability {
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
 }

 .pm-side-button {
  min-width: 32px;
  height: 22px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
 }

 .pm-side-button--yes {
  background: rgba(19, 214, 139, 0.18);
  color: #77f0bf;
 }

 .pm-side-button--no {
  background: rgba(255, 83, 104, 0.14);
  color: #ff9baa;
 }

 .pm-market-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: rgba(131, 145, 167, 0.8);
  font-size: 11px;
 }

 .pm-market-volume {
  white-space: nowrap;
 }

 .pm-market-star {
  color: rgba(164, 174, 192, 0.74);
  font-size: 14px;
 }

 .pm-sidebar {
  min-width: 0;
 }

 .pm-sidebar-card {
  overflow: hidden;
 }

 .pm-sidebar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
 }

 .pm-sidebar-head h2 {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  color: #f8fafc;
 }

 .pm-sidebar-meta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(151, 161, 178, 0.74);
  font-size: 11px;
 }

 .pm-sidebar-meta .is-live {
  color: #42d392;
 }

 .pm-trade-feed {
  display: grid;
  gap: 6px;
  padding: 8px;
 }

 .pm-trade-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  background: #0f1318;
 }

 .pm-trade-item-icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: inline-grid;
  place-items: center;
  background: linear-gradient(135deg, #f59e0b 0%, #f97316 100%);
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
 }

 .pm-trade-item-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
 }

 .pm-trade-item-copy strong {
  color: rgba(231, 236, 245, 0.86);
  font-size: 11px;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
 }

 .pm-trade-item-copy span,
 .pm-trade-item-time {
  color: rgba(131, 145, 167, 0.74);
  font-size: 10px;
 }

 .pm-empty-state {
  padding: 22px 14px;
  border: 1px dashed rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  background: rgba(15, 19, 24, 0.72);
  color: rgba(151, 161, 178, 0.82);
  font-size: 13px;
  text-align: center;
 }

 .pm-market-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  padding: 16px;
 }

 .pm-market-modal[hidden] {
  display: none !important;
 }

 .pm-market-modal__scrim {
  position: absolute;
  inset: 0;
  background: rgba(5, 8, 12, 0.74);
 }

 .pm-market-modal__card {
  position: relative;
  z-index: 1;
  width: min(520px, calc(100% - 24px));
  padding: 12px;
 }

 .pm-market-modal__head,
 .pm-market-modal__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
 }

 .pm-market-modal__head h2 {
  margin: 4px 0 0;
  color: #ffffff;
  font-size: 18px;
  line-height: 1.2;
 }

 .pm-market-modal__body {
  display: grid;
  gap: 10px;
  padding: 12px 0;
 }

 .pm-modal-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
 }

 .pm-modal-stat {
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  background: #0d1116;
 }

 .pm-modal-stat span {
  display: block;
  margin-bottom: 6px;
  color: rgba(131, 145, 167, 0.76);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
 }

 .pm-modal-stat strong {
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
 }

 .pm-modal-description {
  margin: 0;
  color: rgba(151, 161, 178, 0.82);
  font-size: 13px;
  line-height: 1.6;
 }

 @media (max-width: 1240px) {
  .pm-market-grid {
   grid-template-columns: repeat(2, minmax(0, 1fr));
  }
 }

 @media (max-width: 1080px) {
  .pm-topbar {
   grid-template-columns: 1fr;
  }

  .pm-nav {
   justify-content: flex-start;
   overflow-x: auto;
   scrollbar-width: none;
  }

  .pm-nav::-webkit-scrollbar {
   display: none;
  }

  .pm-topbar-actions {
   justify-content: flex-end;
  }

  .pm-shell {
   grid-template-columns: 1fr;
  }

  .pm-sidebar {
   order: 2;
  }
 }

 @media (max-width: 780px) {
  .pm-root {
   width: calc(100% - 10px);
  }

  .pm-hero {
   grid-template-columns: 1fr;
  }

  .pm-market-grid,
  .pm-modal-stat-grid {
   grid-template-columns: 1fr;
  }

  .pm-search-row,
  .pm-market-modal__actions {
   flex-direction: column;
   align-items: stretch;
  }

  .pm-search-actions,
  .pm-topbar-actions {
   width: 100%;
  }

  .pm-topbar-actions {
   justify-content: stretch;
  }

  .pm-primary-button,
  .pm-ghost-button,
  .pm-wallet-chip,
  .pm-wallet-setup-button {
   width: 100%;
   justify-content: center;
  }
 }

@media (max-width: 560px) {
  .pm-market-card {
    padding: 12px;
  }

  .pm-outcome-row {
   grid-template-columns: minmax(0, 1fr) auto auto;
  }

 .pm-outcome-row .pm-side-button--no {
   grid-column: 2 / 4;
   justify-self: end;
   }
  }

.pm-auth-gate,
.pm-builder-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(92, 142, 214, 0.26);
  border-radius: 8px;
  background: rgba(6, 10, 17, 0.82);
}

.pm-auth-gate {
  margin: 10px 0;
}

.pm-auth-gate.is-ok {
  border-color: rgba(109, 205, 168, 0.34);
  background: rgba(8, 24, 21, 0.74);
}

.pm-auth-gate strong,
.pm-builder-panel strong {
  display: block;
  color: #f8fafc;
  font-size: 13px;
}

.pm-auth-gate span,
.pm-builder-panel span,
.pm-builder-panel p {
  color: rgba(183, 194, 211, 0.86);
  font-size: 12px;
  line-height: 1.45;
}

.pm-auth-actions,
.pm-builder-panel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pm-builder-panel {
  margin: 10px 0 12px;
}

.pm-builder-panel__grid {
  display: grid;
  gap: 8px;
}

.pm-builder-panel__grid div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: 8px;
  align-items: center;
}

.pm-builder-panel pre {
  max-height: 220px;
  margin: 0;
  padding: 10px;
  overflow: auto;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(0, 0, 0, 0.34);
  color: rgba(224, 232, 244, 0.92);
  font: 11px/1.45 var(--font-mono);
}

.pm-signin-modal[hidden] {
  display: none;
}

.pm-safety-modal[hidden],
.pm-deposit-modal[hidden] {
  display: none;
}

.pm-signin-modal,
.pm-safety-modal,
.pm-deposit-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(2, 5, 10, 0.78);
  backdrop-filter: blur(18px);
}

.pm-safety-modal,
.pm-deposit-modal {
  z-index: 110;
}

.pm-signin-shell {
  position: relative;
  width: min(1080px, 100%);
  max-height: min(92vh, 900px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 0.9fr);
  gap: 26px;
  overflow: auto;
  padding: 18px;
  border: 1px solid rgba(105, 137, 180, 0.32);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(3, 6, 12, 0.98), rgba(4, 12, 24, 0.96)),
    radial-gradient(circle at 18% 0%, rgba(38, 99, 235, 0.24), transparent 34%);
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.54);
}

.pm-safety-shell,
.pm-deposit-shell {
  position: relative;
  width: min(760px, 100%);
  max-height: min(90vh, 760px);
  display: grid;
  gap: 16px;
  overflow: auto;
  padding: 24px;
  border: 1px solid rgba(105, 137, 180, 0.32);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(3, 6, 12, 0.98), rgba(5, 14, 27, 0.98));
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.54);
}

.pm-safety-shell > header,
.pm-deposit-shell > header {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.pm-safety-shell h2,
.pm-safety-shell p,
.pm-deposit-shell h2,
.pm-deposit-shell p {
  margin: 0;
}

.pm-safety-shell h2,
.pm-deposit-shell h2 {
  color: #ffffff;
  font-size: 24px;
}

.pm-safety-shell p,
.pm-deposit-shell p {
  color: rgba(183, 194, 211, 0.84);
  font-size: 13px;
  line-height: 1.45;
}

.pm-safety-body,
.pm-agent-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(100, 116, 139, 0.24);
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.62);
}

.pm-safety-list {
  display: grid;
  gap: 8px;
  margin: 0;
}

.pm-safety-list div {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 12px;
  align-items: center;
}

.pm-safety-list dt {
  color: rgba(148, 163, 184, 0.9);
  font-size: 12px;
}

.pm-safety-list dd {
  margin: 0;
  color: #f8fafc;
  overflow-wrap: anywhere;
  font: 600 12px/1.4 var(--font-mono);
}

.pm-safety-copy {
  color: rgba(223, 231, 243, 0.9);
}

.pm-deposit-warning {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid rgba(245, 158, 11, 0.28);
  border-radius: 8px;
  background: rgba(120, 53, 15, 0.22);
  color: #fbd38d;
}

.pm-deposit-warning strong {
  color: #ffffff;
}

.pm-deposit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.pm-deposit-grid div {
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(100, 116, 139, 0.24);
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.62);
}

.pm-deposit-grid dt {
  color: rgba(148, 163, 184, 0.9);
  font-size: 12px;
}

.pm-deposit-grid dd {
  margin: 4px 0 0;
  color: #f8fafc;
  overflow-wrap: anywhere;
  font: 600 12px/1.4 var(--font-mono);
}

.pm-agent-panel strong {
  color: #ffffff;
}

.pm-agent-panel pre {
  max-height: 220px;
  margin: 0;
  padding: 10px;
  overflow: auto;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(0, 0, 0, 0.34);
  color: rgba(224, 232, 244, 0.92);
  font: 11px/1.45 var(--font-mono);
}

.pm-signin-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 50%;
  background: rgba(5, 8, 13, 0.82);
  color: #ffffff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.pm-signin-left,
.pm-signin-right {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 14px;
}

.pm-signin-left {
  padding: 20px 26px;
}

.pm-signin-logo {
  width: 92px;
  justify-self: center;
}

.pm-signin-left h2 {
  margin: 0;
  text-align: center;
  color: #ffffff;
  font-size: 34px;
  line-height: 1.1;
  letter-spacing: 0;
}

.pm-signin-kicker,
.pm-signin-foot,
.pm-signin-status {
  margin: 0;
  text-align: center;
  color: rgba(172, 184, 202, 0.86);
}

.pm-signin-kicker {
  color: #68a7ff;
  font: 600 14px/1.2 var(--font-mono);
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.pm-signin-wallet,
.pm-signin-submit {
  width: 100%;
  min-height: 56px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  background: rgba(13, 18, 27, 0.88);
  color: #f8fafc;
  text-align: left;
  cursor: pointer;
}

.pm-signin-wallet.is-primary,
.pm-signin-submit {
  border-color: rgba(67, 137, 255, 0.9);
  background: linear-gradient(135deg, rgba(15, 70, 180, 0.92), rgba(11, 32, 96, 0.96));
  box-shadow: inset 0 0 22px rgba(42, 123, 255, 0.22), 0 12px 34px rgba(0, 42, 130, 0.28);
}

.pm-signin-wallet strong,
.pm-signin-wallet em {
  display: block;
}

.pm-signin-wallet em {
  color: rgba(203, 213, 225, 0.72);
  font-style: normal;
  font-size: 12px;
}

.pm-signin-wallet.is-detected {
  border-color: rgba(109, 205, 168, 0.34);
}

.pm-signin-wallet.is-detected em {
  color: #8ee7bb;
}

.pm-wallet-provider-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.pm-wallet-provider-grid .pm-signin-wallet {
  min-height: 68px;
  grid-template-columns: 34px minmax(0, 1fr) 12px;
  gap: 8px;
  padding: 10px;
}

.pm-wallet-provider-grid .pm-wallet-mark {
  width: 32px;
  height: 32px;
}

.pm-wallet-provider-grid .pm-signin-wallet strong {
  font-size: 12px;
}

.pm-wallet-mark {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(96, 165, 250, 0.18);
  color: #8ab9ff;
  font-weight: 800;
}

.pm-signin-warning,
.pm-connected-address {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid rgba(100, 116, 139, 0.24);
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.62);
}

.pm-signin-warning {
  grid-template-columns: 34px minmax(0, 1fr);
}

.pm-signin-warning p {
  grid-column: 2;
  margin: 0;
  color: rgba(223, 231, 243, 0.9);
  font-size: 13px;
}

.pm-connected-address span {
  color: rgba(148, 163, 184, 0.8);
  font-size: 12px;
}

.pm-connected-address strong {
  color: #f8fafc;
  font-family: var(--font-mono);
}

.pm-consent-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  color: rgba(223, 231, 243, 0.9);
  font-size: 13px;
}

.pm-consent-row input {
  width: 18px;
  height: 18px;
  margin-top: 1px;
}

.pm-consent-row a {
  color: #5aa4ff;
}

.pm-signin-submit {
  grid-template-columns: 1fr;
  justify-items: center;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
}

.pm-signin-submit:disabled {
  cursor: not-allowed;
  opacity: 0.52;
}

.pm-signin-right {
  min-height: 560px;
  justify-items: center;
  padding: 54px 30px;
  border: 1px solid rgba(82, 120, 180, 0.22);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 30%, rgba(29, 94, 214, 0.34), transparent 38%),
    linear-gradient(150deg, rgba(2, 8, 18, 0.94), rgba(4, 12, 26, 0.96));
}

.pm-signin-right img {
  width: min(260px, 70%);
  filter: drop-shadow(0 0 22px rgba(56, 132, 255, 0.48));
}

.pm-signin-right h3 {
  margin: 0;
  color: #ffffff;
  font-size: 40px;
  line-height: 1.05;
}

.pm-signin-right p {
  margin: 0;
  color: #78adff;
  font: 600 16px/1.2 var(--font-mono);
  letter-spacing: 0.18em;
}

.pm-signin-right dl {
  width: min(340px, 100%);
  display: grid;
  gap: 18px;
  margin: 20px 0 0;
}

.pm-signin-right div {
  display: grid;
  gap: 4px;
}

.pm-signin-right dt {
  color: #ffffff;
  font-weight: 700;
}

.pm-signin-right dd {
  margin: 0;
  color: rgba(183, 194, 211, 0.82);
}

@media (max-width: 860px) {
  .pm-signin-shell {
    grid-template-columns: 1fr;
  }

  .pm-signin-right {
    display: none;
  }

  .pm-signin-left {
    padding: 18px 8px;
  }

  .pm-wallet-provider-grid,
  .pm-safety-list div {
    grid-template-columns: 1fr;
  }

  .pm-builder-panel__grid div {
    grid-template-columns: 1fr;
  }
}

/* Sign-in artboard interaction overlay */
.pm-signin-modal {
  padding: clamp(10px, 2vw, 24px);
  background: rgba(8, 10, 14, 0.62);
  backdrop-filter: blur(10px);
}

.pm-signin-shell {
  --signin-ratio: 1.6;
  --signin-pad: clamp(14px, 1.45vw, 20px);
  --signin-gap: 0px;
  box-sizing: border-box;
  position: relative;
  width: min(960px, calc(100vw - 32px), calc((100dvh - 32px) * var(--signin-ratio)));
  max-width: min(960px, calc((100dvh - 32px) * var(--signin-ratio)));
  max-height: calc(100dvh - 32px);
  aspect-ratio: var(--signin-ratio) / 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--signin-gap);
  overflow: hidden;
  padding: var(--signin-pad);
  border: 0;
  border-radius: clamp(18px, 1.8vw, 28px);
  background: #f8f5ef;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.22);
}

.pm-signin-art-pane {
  box-sizing: border-box;
  position: relative;
  grid-column: 2;
  grid-row: 1;
  align-self: stretch;
  height: 100%;
  width: calc(100% + 1px);
  margin-left: -1px;
  min-width: 0;
  min-height: 0;
  z-index: 0;
  overflow: hidden;
  border-radius: 0 clamp(13px, 1.35vw, 20px) clamp(13px, 1.35vw, 20px) 0;
  background: #f3ebdf;
  pointer-events: none;
}

.pm-signin-art-image {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  display: block;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
  user-select: none;
}

.pm-signin-left {
  box-sizing: border-box;
  position: relative;
  grid-column: 1;
  grid-row: 1;
  align-self: stretch;
  z-index: 2;
  width: 100%;
  height: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-content: initial;
  justify-content: center;
  gap: clamp(7px, 0.72vw, 11px);
  overflow: hidden;
  padding: clamp(14px, 1.55vw, 24px) clamp(18px, 2.15vw, 34px);
  border-radius: clamp(16px, 1.5vw, 22px) 0 0 clamp(16px, 1.5vw, 22px);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.93));
  backdrop-filter: blur(3px);
  color: #151922;
}

.pm-signin-left > * {
  width: min(100%, 392px);
  align-self: center;
}

.pm-signin-left::before {
  content: none;
}

.pm-signin-shell.has-missing-wallet .pm-signin-left {
  justify-content: flex-start;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
}

.pm-signin-shell.has-missing-wallet .pm-signin-left::-webkit-scrollbar {
  display: none;
}

.pm-signin-logo-button {
  width: clamp(40px, 4vw, 52px);
  height: clamp(40px, 4vw, 52px);
  display: grid;
  place-items: center;
  align-self: center;
  margin: 0 0 clamp(1px, 0.25vw, 4px);
  border-radius: 999px;
  text-decoration: none;
}

.pm-signin-logo-mark {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.pm-signin-left h2 {
  margin: 0;
  color: #141922;
  text-align: center;
  font-size: clamp(22px, 2.05vw, 30px);
  line-height: 1.06;
  font-weight: 760;
  letter-spacing: 0;
}

.pm-signin-kicker {
  margin: 0 0 clamp(5px, 0.6vw, 9px);
  color: #8b93a7;
  text-align: center;
  font: 600 clamp(12px, 0.95vw, 16px)/1.2 var(--font-body);
  letter-spacing: 0;
  text-transform: none;
}

.pm-signin-action,
.pm-email-form,
.pm-another-wallet-button,
.pm-signin-submit {
  width: 100%;
  border: 1px solid rgba(151, 159, 176, 0.32);
  border-radius: clamp(13px, 1.1vw, 18px);
  background: rgba(255, 255, 255, 0.64);
  box-shadow: 0 10px 34px rgba(15, 23, 42, 0.04);
}

.pm-signin-action,
.pm-another-wallet-button,
.pm-signin-submit {
  min-height: clamp(40px, 3.2vw, 52px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 0.8vw, 13px);
  padding: 0 clamp(14px, 1.35vw, 22px);
  color: #171b24;
  font: 650 clamp(13px, 1vw, 16px)/1.1 var(--font-body);
  text-align: center;
  cursor: pointer;
  transition: border-color 140ms ease, background-color 140ms ease, opacity 140ms ease, transform 100ms ease;
}

.pm-signin-action:hover,
.pm-another-wallet-button:hover,
.pm-icon-auth-button:hover,
.pm-email-submit:hover,
.pm-signin-submit:hover,
.pm-wallet-choice-button:hover {
  border-color: rgba(30, 41, 59, 0.34);
  background: rgba(255, 255, 255, 0.84);
}

.pm-signin-action:active,
.pm-another-wallet-button:active,
.pm-icon-auth-button:active,
.pm-signin-submit:active,
.pm-wallet-choice-button:active {
  opacity: 0.92;
}

.pm-signin-shell button:focus-visible,
.pm-signin-shell input:focus-visible,
.pm-signin-shell a:focus-visible {
  outline: 2px solid rgba(15, 82, 186, 0.72);
  outline-offset: 3px;
}

.pm-signin-left h2,
.pm-signin-kicker,
.pm-signin-shell button,
.pm-signin-art-pane,
.pm-connected-address span,
.pm-connected-address strong {
  user-select: none;
}

.pm-email-form input,
.pm-email-otp-panel input {
  user-select: text;
}

.pm-provider-icon {
  width: clamp(22px, 2vw, 31px);
  height: clamp(22px, 2vw, 31px);
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  color: #111827;
  font-weight: 800;
  line-height: 1;
}

.pm-provider-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

.pm-provider-icon img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  pointer-events: none;
}

.pm-provider-icon[data-wallet-icon-id=""] {
  display: none;
}

.pm-provider-icon--google {
  color: #1a73e8;
  font-weight: 900;
}

.pm-provider-icon--discord {
  color: #6374f5;
}

.pm-provider-icon--x {
  color: #0f172a;
}

.pm-provider-icon--metamask {
  color: #d97706;
}

.pm-provider-icon--trust,
.pm-provider-icon--coinbase,
.pm-provider-icon--rabby {
  color: #6577f3;
}

.pm-provider-icon--another-wallet {
  color: #111827;
}

.pm-provider-icon--wallet {
  position: relative;
  width: clamp(22px, 1.9vw, 28px);
  height: clamp(18px, 1.55vw, 24px);
  border: 1.6px solid currentColor;
  border-radius: 4px;
}

.pm-provider-icon--walletconnect {
  width: clamp(25px, 2.2vw, 34px);
  height: clamp(25px, 2.2vw, 34px);
}

.pm-provider-icon--wallet::before {
  content: "";
  position: absolute;
  right: 4px;
  top: 50%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
  transform: translateY(-50%);
}

.pm-signin-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: clamp(12px, 1.35vw, 22px);
  align-items: center;
  color: #969dac;
  font-weight: 700;
  font-size: clamp(10px, 0.82vw, 14px);
}

.pm-signin-divider::before,
.pm-signin-divider::after {
  content: "";
  height: 1px;
  background: rgba(148, 151, 160, 0.28);
}

.pm-email-form {
  position: relative;
  min-height: clamp(40px, 3.2vw, 52px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(34px, 2.8vw, 44px);
  align-items: center;
  overflow: visible;
}

.pm-email-form input {
  width: 100%;
  min-width: 0;
  height: 100%;
  border: 0;
  border-radius: inherit;
  background: transparent;
  color: #171b24;
  padding: 0 clamp(14px, 1.35vw, 22px);
  font: 600 clamp(13px, 1.05vw, 17px)/1.2 var(--font-body);
}

.pm-email-form input::placeholder {
  color: #8d95a8;
  opacity: 1;
}

.pm-email-submit {
  display: inline-grid;
  place-items: center;
  width: clamp(34px, 2.8vw, 44px);
  height: clamp(34px, 2.8vw, 44px);
  justify-self: end;
  align-self: center;
  margin-right: clamp(6px, 0.6vw, 10px);
  border: 1px solid transparent;
  border-radius: 13px;
  background: rgba(244, 245, 247, 0.92);
  color: #6b7280;
  font-size: clamp(17px, 1.45vw, 23px);
  cursor: pointer;
  transition: border-color 140ms ease, background-color 140ms ease, opacity 140ms ease;
}

.pm-signin-shell.is-email-otp #signInTitle,
.pm-signin-shell.is-email-otp .pm-signin-kicker,
.pm-signin-shell.is-email-otp .pm-reconnect-button,
.pm-signin-shell.is-email-otp .pm-signin-action:not(.pm-otp-resend-button),
.pm-signin-shell.is-email-otp .pm-email-form,
.pm-signin-shell.is-email-otp .pm-signin-divider,
.pm-signin-shell.is-email-otp .pm-wallet-provider-grid,
.pm-signin-shell.is-email-otp .pm-another-wallet-button,
.pm-signin-shell.is-email-otp .pm-connected-address,
.pm-signin-shell.is-email-otp .pm-legal-acknowledgement,
.pm-signin-shell.is-email-otp #walletAuthMessage,
.pm-signin-shell.is-email-otp #emailAuthMessage {
  display: none !important;
}

.pm-email-otp-panel {
  position: relative;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: clamp(10px, 1vw, 15px);
  text-align: center;
  color: #151922;
}

.pm-email-otp-panel[hidden] {
  display: none !important;
}

.pm-otp-back-button {
  position: absolute;
  top: 2px;
  left: 0;
  width: clamp(34px, 3.1vw, 44px);
  height: clamp(34px, 3.1vw, 44px);
  display: grid;
  place-items: center;
  border: 1px solid rgba(151, 159, 176, 0.26);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.58);
  color: #111827;
  font-size: clamp(18px, 1.7vw, 24px);
  line-height: 1;
  cursor: pointer;
}

.pm-email-otp-panel h3 {
  margin: 0;
  color: #141922;
  font-size: clamp(23px, 2vw, 30px);
  line-height: 1.08;
  font-weight: 760;
  letter-spacing: 0;
}

.pm-otp-helper {
  margin: 0 auto;
  max-width: 26ch;
  color: #7c8495;
  font: 600 clamp(10px, 0.82vw, 13px)/1.35 var(--font-body);
}

.pm-otp-helper strong {
  display: block;
  color: #1f2937;
  font-weight: 760;
  overflow-wrap: anywhere;
}

.pm-otp-code-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(5px, 0.55vw, 9px);
  width: 100%;
}

.pm-otp-digit {
  width: 100%;
  aspect-ratio: 1 / 1.12;
  min-width: 0;
  border: 1px solid rgba(151, 159, 176, 0.38);
  border-radius: clamp(10px, 0.85vw, 13px);
  background: rgba(255, 255, 255, 0.74);
  color: #141922;
  text-align: center;
  font: 760 clamp(17px, 1.75vw, 25px)/1 var(--font-body);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.pm-otp-digit.is-error {
  border-color: rgba(185, 28, 28, 0.62);
  background: rgba(254, 242, 242, 0.76);
  color: #991b1b;
}

.pm-otp-status {
  min-height: 18px;
  margin: -2px 0 0;
  color: #667085;
  font: 700 clamp(11px, 0.9vw, 13px)/1.3 var(--font-body);
}

.pm-otp-status[data-tone="error"] {
  color: #991b1b;
}

.pm-otp-status[data-tone="success"] {
  color: #166534;
}

.pm-otp-resend-button {
  min-height: clamp(40px, 3.25vw, 48px);
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(151, 159, 176, 0.28);
  border-radius: clamp(12px, 1vw, 16px);
  background: rgba(255, 255, 255, 0.58);
  color: #1f2937;
  font: 680 clamp(12px, 1vw, 15px)/1.1 var(--font-body);
  cursor: pointer;
}

.pm-otp-resend-button:disabled {
  cursor: not-allowed;
  opacity: 0.56;
}

.pm-field-message {
  position: absolute;
  left: clamp(16px, 1.4vw, 24px);
  right: clamp(16px, 1.4vw, 24px);
  bottom: calc(clamp(17px, 1.45vw, 24px) * -1);
  min-height: 16px;
  margin: 0;
  color: #9a3412;
  font-size: clamp(10px, 0.82vw, 12px);
  line-height: 1.25;
}

.pm-field-message[data-tone="success"] {
  color: #166534;
}

.pm-wallet-provider-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(8px, 0.85vw, 13px);
  margin-top: clamp(8px, 0.9vw, 13px);
}

.pm-icon-auth-button {
  position: relative;
  min-width: 44px;
  min-height: clamp(42px, 3.35vw, 54px);
  display: grid;
  place-items: center;
  border: 1px solid rgba(151, 159, 176, 0.26);
  border-radius: clamp(13px, 1vw, 17px);
  background: rgba(255, 255, 255, 0.56);
  cursor: pointer;
  transition: border-color 140ms ease, background-color 140ms ease, opacity 140ms ease, transform 100ms ease;
}

.pm-icon-auth-button .pm-provider-icon {
  opacity: 1;
  width: clamp(23px, 2.15vw, 34px);
  height: clamp(23px, 2.15vw, 34px);
}

.pm-icon-auth-button:hover .pm-provider-icon {
  opacity: 1;
}

.pm-another-wallet-button {
  min-height: clamp(34px, 2.65vw, 42px);
  width: min(61.8%, 300px);
  align-self: center;
  margin-top: clamp(5px, 0.65vw, 9px);
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  font-size: clamp(12px, 0.9vw, 14px);
  font-weight: 580;
}

.pm-connected-address {
  min-height: clamp(36px, 3.1vw, 48px);
  max-height: clamp(36px, 3.1vw, 48px);
  display: grid;
  justify-items: center;
  gap: 4px;
  overflow: hidden;
  padding: 6px 10px;
  border: 1px solid rgba(15, 82, 186, 0.16);
  border-radius: 12px;
  background: rgba(239, 246, 255, 0.62);
  color: #475569;
  font-size: clamp(9px, 0.74vw, 11px);
  line-height: 1.25;
  text-align: center;
  opacity: 1;
}

.pm-signin-shell.has-wallet .pm-connected-address {
  border-color: rgba(15, 82, 186, 0.28);
}

.pm-connected-address strong {
  color: #172033;
  font-family: var(--font-body);
  font-size: clamp(10px, 0.82vw, 12px);
  line-height: 1.25;
}

.pm-legal-acknowledgement {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  margin-top: clamp(4px, 0.55vw, 8px);
  color: #8c94a7;
  font-size: clamp(8.8px, 0.72vw, 10.5px);
  line-height: 1.25;
  text-align: center;
}

.pm-legal-acknowledgement input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.pm-legal-check {
  width: 16px;
  height: 16px;
  margin-top: 2px;
  border: 1px solid rgba(70, 79, 97, 0.42);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.72);
}

.pm-legal-acknowledgement input:checked + .pm-legal-check {
  background: #0f52ba;
  border-color: #0f52ba;
  box-shadow: inset 0 0 0 3px #ffffff;
}

.pm-legal-acknowledgement a {
  color: #003ecf;
  text-decoration: none;
}

.pm-legal-acknowledgement a:hover {
  text-decoration: underline;
}

.pm-consent-hidden {
  display: none;
}

.pm-signin-submit {
  min-height: clamp(36px, 2.85vw, 44px);
  border-color: rgba(15, 82, 186, 0.3);
  background: rgba(15, 82, 186, 0.08);
  color: #0f172a;
  font-size: clamp(12px, 0.9vw, 14px);
  font-weight: 700;
}

.pm-signin-submit[hidden] {
  display: none;
}

.pm-signin-submit:disabled,
.pm-signin-action:disabled,
.pm-another-wallet-button:disabled,
.pm-email-submit:disabled,
.pm-signin-shell[data-signin-busy="true"] .pm-signin-action:not(.is-loading),
.pm-signin-shell[data-signin-busy="true"] .pm-icon-auth-button:not(.is-loading),
.pm-signin-shell[data-signin-busy="true"] .pm-another-wallet-button:not(.is-loading),
.pm-signin-shell[data-signin-busy="true"] .pm-email-submit:not(.is-loading) {
  cursor: not-allowed;
  opacity: 0.48;
}

.pm-signin-status {
  min-height: 18px;
  margin: 0;
  color: #64748b;
  text-align: center;
  font-size: clamp(9.5px, 0.78vw, 12px);
  line-height: 1.35;
}

.pm-signin-status[data-tone="error"] {
  color: #9a3412;
}

.pm-signin-status[data-tone="success"] {
  color: #166534;
}

.pm-action-spinner {
  display: none;
  width: 14px;
  height: 14px;
  border: 2px solid rgba(51, 65, 85, 0.22);
  border-top-color: rgba(15, 82, 186, 0.78);
  border-radius: 50%;
  animation: pmSpin 800ms linear infinite;
}

.is-loading .pm-action-spinner {
  display: inline-block;
}

.pm-icon-auth-button.is-loading .pm-provider-icon,
.pm-email-submit.is-loading > span:first-child {
  display: none;
}

.pm-signin-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 4;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(17, 24, 39, 0.12);
  border-radius: 999px;
  background: rgba(248, 245, 239, 0.88);
  backdrop-filter: blur(2px);
  color: #111827;
  opacity: 0.88;
  font-size: 22px;
  line-height: 1;
  padding: 0;
  cursor: pointer;
  transition: opacity 140ms ease, border-color 140ms ease, background-color 140ms ease;
}

.pm-signin-close:hover {
  opacity: 1;
  border-color: rgba(17, 24, 39, 0.22);
  background: rgba(248, 245, 239, 0.98);
}

.pm-signin-modal .pm-signin-close {
  top: calc(var(--signin-pad, 18px) + 8px);
  right: calc(var(--signin-pad, 18px) + 16px);
  width: 32px;
  height: 32px;
  border-color: rgba(17, 24, 39, 0.16);
  background: rgba(248, 245, 239, 0.46);
  box-shadow: none;
  backdrop-filter: blur(1px);
  color: transparent;
  opacity: 1;
  font-size: 0;
}

.pm-signin-modal .pm-signin-close:hover {
  border-color: rgba(17, 24, 39, 0.28);
  background: rgba(248, 245, 239, 0.74);
}

.pm-signin-modal .pm-signin-close::before,
.pm-signin-modal .pm-signin-close::after {
  content: "";
  position: absolute;
  width: 13px;
  height: 1.5px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.58);
}

.pm-signin-modal .pm-signin-close::before {
  transform: rotate(45deg);
}

.pm-signin-modal .pm-signin-close::after {
  transform: rotate(-45deg);
}

.pm-signin-modal .pm-signin-close:hover::before,
.pm-signin-modal .pm-signin-close:hover::after {
  background: rgba(17, 24, 39, 0.8);
}

.pm-wallet-choice-modal[hidden] {
  display: none;
}

.pm-wallet-choice-modal {
  position: fixed;
  inset: 0;
  z-index: 140;
  display: grid;
  place-items: center;
  padding: 24px;
}

.pm-wallet-choice-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(246, 244, 238, 0.45);
  backdrop-filter: blur(8px);
}

.pm-wallet-choice-shell {
  position: relative;
  z-index: 1;
  width: min(380px, 100%);
  max-height: calc(100dvh - 48px);
  display: grid;
  gap: 10px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 22px;
  border: 1px solid rgba(148, 151, 160, 0.3);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.18);
}

.pm-wallet-choice-reconnect {
  width: 100%;
  min-height: 48px;
  border-radius: 12px;
  font-size: 14px;
}

.pm-wallet-choice-shell h3 {
  margin: 0 36px 8px 0;
  color: #111827;
  font-size: 20px;
  line-height: 1.2;
}

.pm-wallet-choice-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  padding: 0 0 2px;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: #111827;
  font-size: 24px;
  font-family: Arial, sans-serif;
  line-height: 1;
  cursor: pointer;
  transition: border-color 140ms ease, background-color 140ms ease;
}

.pm-wallet-choice-close:hover,
.pm-wallet-choice-close:focus-visible {
  border-color: rgba(17, 24, 39, 0.18);
  background: rgba(15, 23, 42, 0.06);
}

.pm-wallet-choice-button {
  min-height: 48px;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(148, 151, 160, 0.32);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.7);
  color: #111827;
  font: 650 15px/1 var(--font-body);
  text-align: left;
  padding: 9px 12px;
  cursor: pointer;
  transition: border-color 140ms ease, background-color 140ms ease, transform 100ms ease;
}

.pm-wallet-choice-button .pm-provider-icon {
  width: 26px;
  height: 26px;
}

.pm-wallet-choice-button--walletconnect {
  border-color: rgba(51, 150, 255, 0.34);
  background: rgba(239, 248, 255, 0.86);
}

.pm-wallet-choice-button em {
  color: #64748b;
  font-style: normal;
  font-size: 11px;
  line-height: 1.2;
  text-align: right;
}

.pm-wallet-choice-button.is-detected em {
  color: #047857;
}

.pm-another-wallet-button:disabled,
.pm-wallet-choice-button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
  transform: none;
}

.pm-icon-auth-button:disabled {
  cursor: not-allowed;
  opacity: 1;
  transform: none;
}

.pm-icon-auth-button:disabled .pm-provider-icon {
  opacity: 1;
  filter: none;
}

.pm-wallet-choice-button:disabled .pm-provider-icon {
  filter: grayscale(0.35);
}

.pm-wallet-provider-list {
  display: grid;
  gap: 8px;
}

.pm-detected-wallets {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(15, 82, 186, 0.18);
  border-radius: 14px;
  background: rgba(239, 248, 255, 0.62);
}

.pm-detected-wallets[hidden] {
  display: none !important;
}

.pm-detected-wallets__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #172033;
  font-size: 12px;
}

.pm-detected-wallets__heading button {
  border: 0;
  background: transparent;
  color: #0f52ba;
  font: 700 11px/1 var(--font-body);
  cursor: pointer;
}

.pm-wallet-choice-button--inline {
  min-height: 44px;
  background: #ffffff;
}

.pm-wallet-provider-list:empty {
  display: none;
}

.pm-wallet-unavailable[hidden] {
  display: none !important;
}

.pm-signin-action[hidden],
.pm-email-form[hidden],
.pm-signin-divider[hidden],
.pm-wallet-provider-grid[hidden],
.pm-another-wallet-button[hidden],
.pm-legal-acknowledgement[hidden] {
  display: none !important;
}

.pm-wallet-unavailable {
  display: grid;
  gap: 7px;
  padding: 14px 16px;
  border: 1px solid rgba(71, 85, 105, 0.16);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(248, 250, 252, 0.9), rgba(241, 245, 249, 0.68));
  color: #475569;
  text-align: left;
}

.pm-wallet-unavailable strong {
  color: #172033;
  font-size: 13px;
}

.pm-wallet-unavailable span {
  font-size: 11px;
  line-height: 1.45;
}

.pm-wallet-unavailable button,
.pm-wallet-unavailable a {
  width: fit-content;
  min-height: 34px;
  margin-top: 2px;
  padding: 0 13px;
  border: 1px solid rgba(15, 82, 186, 0.24);
  border-radius: 999px;
  background: #ffffff;
  color: #0f52ba;
  font: 700 11px/1 var(--font-body);
  cursor: pointer;
  text-decoration: none;
}

.pm-wallet-unavailable button:hover,
.pm-wallet-unavailable button:focus-visible,
.pm-wallet-unavailable a:hover,
.pm-wallet-unavailable a:focus-visible {
  border-color: rgba(15, 82, 186, 0.5);
  background: #f8fbff;
}

.pm-wallet-provider-note {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
  text-align: center;
}

.pm-wallet-choice-button .pm-provider-icon img {
  width: 100%;
  height: 100%;
  margin: 0;
  vertical-align: initial;
  border-radius: inherit;
}

@keyframes pmSpin {
  to {
    transform: rotate(360deg);
  }
}

@media (min-width: 861px) {
  .pm-signin-shell {
    --signin-ratio: 1.5;
    --signin-pad: 12px;
  }

  .pm-signin-left {
    gap: 6px;
    padding: 10px 24px;
  }

  .pm-signin-logo-button {
    width: 38px;
    height: 38px;
    margin-bottom: 0;
  }

  .pm-signin-left h2 {
    font-size: 24px;
  }

  .pm-signin-kicker {
    margin-bottom: 4px;
    font-size: 13px;
  }

  .pm-signin-action,
  .pm-email-form {
    min-height: 40px;
  }

  .pm-icon-auth-button {
    min-height: 40px;
  }

  .pm-another-wallet-button {
    min-height: 30px;
    margin-top: 0;
  }

  .pm-connected-address {
    min-height: 44px;
    max-height: 44px;
    padding: 4px 10px;
  }

  .pm-legal-acknowledgement {
    margin-top: 2px;
    font-size: 9px;
    line-height: 1.18;
  }

  .pm-signin-submit {
    min-height: 34px;
  }

  .pm-signin-status {
    min-height: 14px;
    font-size: 9px;
    line-height: 1.2;
  }
}

@media (min-width: 861px) and (max-height: 620px) {
  .pm-signin-left {
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
  }

  .pm-signin-left::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
  }
}

@media (max-width: 860px) {
  .pm-signin-modal {
    padding: 10px;
  }

  .pm-signin-shell {
    width: min(520px, calc(100vw - 20px));
    max-width: none;
    max-height: calc(100dvh - 20px);
    min-height: 0;
    aspect-ratio: auto;
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: 22px;
  }

  .pm-signin-art-pane {
    display: none;
  }

  .pm-signin-left {
    position: relative;
    width: auto;
    height: auto;
    min-height: calc(100dvh - 44px);
    overflow: visible;
    padding: 26px 18px 22px;
    gap: 10px;
  }

  .pm-signin-logo-button {
    width: 58px;
    height: 58px;
  }

  .pm-signin-left h2 {
    font-size: 34px;
  }

  .pm-signin-kicker {
    font-size: 17px;
    margin-bottom: 14px;
  }

  .pm-signin-action,
  .pm-email-form {
    min-height: 50px;
  }

  .pm-wallet-provider-grid {
    gap: 8px;
    margin-top: 10px;
  }

  .pm-icon-auth-button {
    min-height: 48px;
  }

  .pm-legal-acknowledgement {
    margin-top: 12px;
    font-size: 12px;
    text-align: left;
  }

  .pm-signin-close {
    top: 12px;
    right: 12px;
  }
}

/* Hyperliquid orderbook market view */
.hg-predict-market-page {
  --hl-bg: #0b0e11;
  --hl-bg-raised: #14161c;
  --hl-bg-panel: #111318;
  --hl-bg-input: #0e1117;
  --hl-bg-chip: #10141c;
  --hl-border: #2b2f36;
  --hl-border-subtle: #1d2028;
  --hl-text: #ffffff;
  --hl-text-muted: #848e9c;
  --hl-text-dim: #6b7894;
  --hl-accent: #63d9c1;
  --hl-accent-soft: rgba(99, 217, 193, 0.14);
  --hl-accent-border: rgba(99, 217, 193, 0.42);
  --hl-accent-bg: rgba(99, 217, 193, 0.12);
  --hl-accent-ink: #0b0e11;
  --hl-red: #f23645;
  --hl-red-soft: rgba(242, 54, 69, 0.14);
  --hl-red-border: rgba(242, 54, 69, 0.42);
  --hl-red-bg: rgba(242, 54, 69, 0.12);
  --hl-focus: rgba(99, 217, 193, 0.4);

  background: var(--hl-bg);
  color: var(--hl-text);
  font-family: "Inter", "IBM Plex Mono", system-ui, sans-serif;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.pm-root {
  width: 100%;
  min-height: 100vh;
  padding: 0;
  background: var(--hl-bg, #0b0e11);
}

.pm-category-tabs {
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 68px;
  padding: 0 22px;
  border-bottom: 1px solid var(--hl-border, #2b2f36);
  overflow-x: auto;
}

.pm-category-tabs .pm-category-chip {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--hl-text-muted, #848e9c);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.pm-category-tabs .pm-category-chip.is-active {
  color: var(--hl-accent, #63d9c1);
}

.pm-list-view {
  padding: 16px 22px 48px;
}

.pm-chip-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}

.pm-live-chip,
.pm-filter-chip,
.pm-refresh-inline {
  min-height: 30px;
  border-radius: 999px;
  border: 1px solid var(--hl-border, #2b2f36);
  background: var(--hl-bg-chip, #10141c);
  color: var(--hl-text-muted, #848e9c);
  padding: 0 12px;
  font: inherit;
  font-weight: 700;
}

.pm-live-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-color: var(--hl-accent-border, rgba(99, 217, 193, 0.42));
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.14));
  color: var(--hl-accent, #63d9c1);
}

.pm-live-chip i,
.pm-live-dot i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--hl-accent, #63d9c1);
  display: inline-block;
}

.pm-filter-chip,
.pm-refresh-inline {
  cursor: pointer;
}

.pm-search-inline {
  margin-left: auto;
  min-width: min(260px, 100%);
}

.pm-search-inline input {
  width: 100%;
  height: 32px;
  border: 1px solid var(--hl-border, #2b2f36);
  border-radius: 8px;
  background: var(--hl-bg-input, #0e1117);
  color: var(--hl-text, #ffffff);
  padding: 0 10px;
  font: inherit;
}

.pm-search-inline input:focus {
  outline: 2px solid var(--hl-focus, rgba(99, 217, 193, 0.4));
  outline-offset: 1px;
}

.pm-market-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: auto;
  gap: 10px;
  align-items: start;
}

.pm-market-card {
  border: 1px solid var(--hl-border-subtle, #1d2028);
  border-radius: 10px;
  background: var(--hl-bg-raised, #14161c);
  padding: 16px 16px 14px;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 14px;
  cursor: pointer;
  box-shadow: none;
  height: auto;
  align-self: start;
  min-height: 0;
}

.pm-market-card:hover,
.pm-market-card:focus-visible {
  transform: none;
  outline: none;
  border-color: var(--hl-border, #2b2f36);
  box-shadow: 0 0 0 1px var(--hl-accent-border, rgba(99, 217, 193, 0.24));
}

.pm-market-card.is-selected {
  border-color: var(--hl-accent, #63d9c1);
  box-shadow: 0 0 0 1px var(--hl-accent-border, rgba(99, 217, 193, 0.42));
}

.pm-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.pm-card-head__brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1 1 auto;
}

.pm-card-head h2 {
  margin: 0;
  color: #ffffff;
  font-size: 14px;
  line-height: 1.3;
  letter-spacing: 0;
  font-weight: 700;
}

.pm-card-spark {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.14));
  color: var(--hl-accent, #63d9c1);
  cursor: pointer;
  padding: 0;
}

.pm-card-spark__icon {
  width: 14px;
  height: 14px;
  display: block;
}

.pm-card-head__brand .pm-market-icon,
.pm-card-head__brand .pm-crypto-icon--md,
.pm-card-head__brand .pm-wc-trophy-icon--md,
.pm-card-head__brand .pm-match-split-flag--md {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
}

.pm-card-head__brand .pm-team-flag--sm {
  width: 100%;
  height: 100%;
}

.pm-market-icon {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  display: inline-grid;
  place-items: center;
  background: #f7931a;
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
  border: 1px solid rgba(255, 255, 255, 0.18);
}

.pm-crypto-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 8px;
  overflow: hidden;
  background: transparent;
  border: 0;
  padding: 0;
}

.pm-crypto-icon--sm {
  width: 40px;
  height: 40px;
}

.pm-crypto-icon--md {
  width: 44px;
  height: 44px;
}

.pm-crypto-icon--lg {
  width: 56px;
  height: 56px;
}

.pm-crypto-icon__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.pm-card-head .pm-crypto-icon--md {
  width: 44px;
  height: 44px;
}

.pm-detail-header .pm-crypto-icon,
.pm-ticket-panel .pm-crypto-icon {
  margin-right: 4px;
}

.pm-wc-trophy-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 8px;
  overflow: hidden;
  background: transparent;
  border: 0;
  padding: 0;
}

.pm-wc-trophy-icon--sm {
  width: 40px;
  height: 40px;
}

.pm-wc-trophy-icon--md {
  width: 44px;
  height: 44px;
}

.pm-wc-trophy-icon--lg {
  width: 56px;
  height: 56px;
}

.pm-wc-trophy-icon__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.pm-card-head .pm-wc-trophy-icon--md {
  width: 44px;
  height: 44px;
}

.pm-detail-header .pm-wc-trophy-icon,
.pm-ticket-panel .pm-wc-trophy-icon {
  margin-right: 4px;
}

.pm-card-assets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: #7482a3;
  font-size: 12px;
  font-weight: 700;
}

.pm-card-assets span {
  padding: 4px 7px;
  border-radius: 6px;
  background: #151923;
}

.pm-card-outcomes {
  display: grid;
  gap: 6px;
  align-self: start;
}

.pm-card-outcome-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 32px;
  padding: 4px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #ffffff;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.pm-card-outcome-row:hover {
  background: rgba(255, 255, 255, 0.03);
}

.pm-card-outcome-row__label {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 13px;
  font-weight: 500;
}

.pm-card-outcome-row__pct {
  flex: 0 0 auto;
  min-width: 48px;
  padding: 4px 8px;
  border: 1px solid var(--hl-border, #2b2f36);
  border-radius: 6px;
  background: var(--hl-bg-input, #0e1117);
  color: var(--hl-text, #ffffff);
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  line-height: 1.2;
}

.pm-card-binary-sides {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-self: start;
}

.pm-card-binary-side {
  min-height: 74px;
  border-radius: 8px;
  border: 1px solid;
  background: transparent;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  font: inherit;
  padding: 10px 8px;
}

.pm-card-binary-side__label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.15;
}

.pm-card-binary-side__direction {
  font-size: 13px;
}

.pm-card-binary-side__multiplier {
  font-size: 12px;
  font-weight: 700;
  opacity: 0.92;
}

.pm-card-binary-side__payout {
  color: #8b96ad;
  font-size: 11px;
  font-weight: 600;
}

.pm-card-binary-side--up {
  border-color: var(--hl-accent-border, rgba(99, 217, 193, 0.42));
  color: var(--hl-accent, #63d9c1);
}

.pm-card-binary-side--down {
  border-color: var(--hl-red-border, rgba(242, 54, 69, 0.42));
  color: var(--hl-red, #f23645);
}

.pm-card-binary-side.is-unavailable,
.pm-card-outcome-row.is-unavailable {
  cursor: not-allowed;
  opacity: 0.48;
}

.pm-card-sides {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-self: start;
}

.pm-card-sides--stack {
  grid-template-columns: 1fr;
}

.pm-card-side {
  min-height: 66px;
  border-radius: 8px;
  border: 1px solid #2f3b4e;
  background: #151922;
  color: #ffffff;
  display: grid;
  place-items: center;
  gap: 4px;
  cursor: pointer;
  font: inherit;
}

.pm-card-side strong {
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
}

.pm-card-side__chance {
  color: var(--hl-accent, #63d9c1);
  font-size: 13px;
  font-weight: 800;
}

.pm-card-side__quote .pm-side-meta,
.pm-card-side__quote {
  color: #8fa1ca;
  font-size: 11px;
  font-weight: 700;
}

.pm-card-side__status {
  color: #6f82a8;
  font-size: 10px;
  font-weight: 600;
  font-style: normal;
}

.pm-card-head-flag,
.pm-match-split-flag {
  flex: 0 0 auto;
}

.pm-match-split-flag {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 8px;
  overflow: hidden;
  background: #12151c;
}

.pm-match-split-flag--sm {
  width: 32px;
  height: 32px;
  border-radius: 6px;
}

.pm-match-split-flag--md {
  width: 44px;
  height: 44px;
}

.pm-match-split-flag__img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.pm-match-split-flag__img--tl {
  clip-path: polygon(0 0, 100% 0, 0 100%);
}

.pm-match-split-flag__img--br {
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
}

.pm-market-icon--wc {
  background: linear-gradient(135deg, #1f4b99, #2f7a57);
  color: #ffffff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.pm-card-side span {
  color: var(--hl-accent, #63d9c1);
  font-size: 13px;
  font-weight: 800;
}

.pm-card-side .pm-side-meta {
  color: #8fa1ca;
  font-size: 11px;
  font-weight: 700;
}

.pm-card-side em {
  color: #8da0ce;
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
}

.pm-card-side--yes {
  border-color: var(--hl-accent-border, rgba(99, 217, 193, 0.42));
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.08));
}

.pm-card-side--no {
  border-color: var(--hl-red-border, rgba(242, 54, 69, 0.42));
  background: var(--hl-red-soft, rgba(242, 54, 69, 0.08));
}

.pm-card-side--no span {
  color: var(--hl-red, #f23645);
}

.pm-card-side:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

.pm-market-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
  color: #6b7894;
  font-size: 12px;
  margin-top: 2px;
}

.pm-market-footer__left {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.pm-market-volume {
  color: #6b7894;
  font-weight: 600;
  white-space: nowrap;
}

.pm-market-deadline {
  color: #6b7894;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.pm-live-dot {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--hl-accent, #63d9c1);
  font-weight: 800;
}

.is-up {
  color: var(--hl-accent, #63d9c1);
}

.is-down {
  color: var(--hl-red, #f23645);
}

.pm-detail-view {
  padding: 4px 20px 32px;
}

.pm-detail-view[hidden],
.pm-list-view[hidden],
.pm-builder-panel[hidden],
.pm-signing-panel[hidden] {
  display: none !important;
}

.pm-detail-shell {
  width: 100%;
}

.pm-detail-view.is-open {
  border-top: 1px solid #171b24;
}

.pm-detail-header {
  min-height: 64px;
  border: 0;
  border-radius: 0;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 4px 4px 18px;
  margin-bottom: 4px;
}

.pm-detail-title-block {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.pm-detail-title-block .pm-market-icon,
.pm-detail-title-block .pm-crypto-icon--md,
.pm-detail-title-block .pm-wc-trophy-icon--md {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
}

.pm-detail-title-block .pm-match-split-flag--sm {
  width: 32px;
  height: 32px;
}

.pm-wallet-provider-list--inline:empty {
  display: none;
}

.pm-back-button {
  border: 0;
  background: transparent;
  color: #6f82a8;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
}

.pm-back-button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid #2b303b;
  border-radius: 999px;
  background: #171a21;
}

.pm-back-button:hover,
.pm-back-button:focus-visible {
  border-color: #586173;
  color: #ffffff;
  outline: none;
}

.pm-detail-stats {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 28px;
  margin-left: auto;
}

.pm-market-grid .pm-card-assets {
  display: none;
}

.pm-panel-tabs {
  display: flex;
}

.pm-empty-position {
  display: grid;
}

.pm-market-meta-panel[hidden] {
  display: none !important;
}

.pm-market-meta-panel {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid #202532;
  border-radius: 8px;
  background: rgba(12, 15, 20, 0.86);
}

.pm-detail-title-block h1 {
  margin: 0;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: 0;
}

.pm-detail-title-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-top: 4px;
}

.pm-detail-meta {
  margin: 0;
  color: #8a96b4;
  font-size: 13px;
  font-weight: 500;
}

.pm-detail-freshness,
.pm-book-spread {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid rgba(118, 134, 173, 0.28);
  border-radius: 999px;
  background: rgba(13, 17, 24, 0.72);
  color: #d7dfef;
  font: 700 11px/1 "IBM Plex Mono", monospace;
  white-space: nowrap;
}

.pm-detail-freshness[hidden] {
  display: none;
}

.pm-detail-freshness.is-live,
.pm-book-spread.is-live {
  border-color: rgba(99, 217, 193, 0.38);
  background: rgba(99, 217, 193, 0.12);
  color: #8df2dc;
}

.pm-detail-freshness.is-warn,
.pm-book-spread.is-warn {
  border-color: rgba(241, 202, 130, 0.38);
  background: rgba(241, 202, 130, 0.1);
  color: #f1ca82;
}

.pm-detail-freshness.is-stale,
.pm-book-spread.is-stale {
  border-color: rgba(242, 54, 69, 0.34);
  background: rgba(242, 54, 69, 0.1);
  color: #ff8a94;
}

.pm-detail-title-block p {
  margin: 4px 0 0;
  color: #8a96b4;
  font-size: 13px;
  font-weight: 700;
}

.pm-detail-stats {
  display: flex;
  align-items: flex-end;
  gap: 28px;
}

.pm-detail-stats div {
  display: grid;
  gap: 2px;
  text-align: right;
}

.pm-detail-stats span {
  color: #6b7894;
  font-size: 12px;
  font-weight: 600;
}

.pm-detail-stats strong {
  color: #ffffff;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.pm-detail-grid {
  display: grid;
  grid-template-columns: minmax(500px, 1fr) minmax(300px, 336px) minmax(300px, 336px) minmax(360px, 446px);
  grid-template-areas:
    "chart book outcomes ticket";
  gap: 12px;
  align-items: stretch;
}

.pm-chart-panel,
.pm-book-panel,
.pm-ticket-panel,
.pm-order-info,
.pm-signing-panel {
  border: 1px solid #1d2028;
  border-radius: 8px;
  background: #111318;
}

.pm-chart-panel {
  grid-area: chart;
  min-height: 0;
  overflow: hidden;
}

.pm-chart-hero {
  padding: 18px 22px 0;
}

.pm-chart-hero__match {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  min-height: 88px;
}

.pm-chart-hero__team {
  display: grid;
  justify-items: center;
  gap: 8px;
  text-align: center;
}

.pm-chart-hero__team strong {
  color: #f8fafc;
  font-size: 14px;
  font-weight: 700;
}

.pm-chart-hero__center {
  display: grid;
  justify-items: center;
  gap: 4px;
  min-width: 92px;
}

.pm-chart-hero__vs {
  color: #6f7f9f;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.pm-chart-hero__status {
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
}

.pm-chart-hero__countdown {
  color: #8fa1ca;
  font-family: "IBM Plex Mono", monospace;
  font-size: 12px;
  font-weight: 600;
}

.pm-chart-hero__crypto {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 72px;
}

.pm-chart-hero__crypto-copy {
  display: grid;
  gap: 4px;
}

.pm-chart-hero__crypto-copy strong {
  color: #ffffff;
  font-size: 18px;
}

.pm-chart-hero__crypto-copy span {
  color: #8fa1ca;
  font-size: 13px;
  font-weight: 600;
}

.pm-chart-wrap {
  position: relative;
  flex: 1 1 auto;
  min-height: 410px;
  height: auto;
  padding: 16px 22px 10px;
}

.pm-price-chart {
  width: 100%;
  height: 100%;
  display: block;
}

.pm-chart-grid {
  stroke: #232832;
  stroke-width: 1;
}

.pm-chart-path {
  fill: none;
  stroke: var(--pm-chart-series-color, #63d9c1);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pm-chart-path--series-0,
.pm-chart-marker--series-0 {
  --pm-chart-series-color: #63d9c1;
}

.pm-chart-path--series-1,
.pm-chart-marker--series-1 {
  --pm-chart-series-color: #f1ca82;
}

.pm-chart-path--series-2,
.pm-chart-marker--series-2 {
  --pm-chart-series-color: #8fa1ca;
}

.pm-chart-path--series-3,
.pm-chart-marker--series-3 {
  --pm-chart-series-color: #ef8da8;
}

.pm-chart-path--series-4,
.pm-chart-marker--series-4 {
  --pm-chart-series-color: #9bd37b;
}

.pm-chart-path--series-5,
.pm-chart-marker--series-5 {
  --pm-chart-series-color: #b89cff;
}

.pm-chart-label {
  fill: #64708f;
  font-size: 13px;
  font-family: "IBM Plex Mono", monospace;
}

.pm-chart-source-label {
  fill: rgba(205, 197, 176, 0.68);
  font: 12px/1 "IBM Plex Mono", monospace;
}

.pm-chart-marker {
  fill: var(--pm-chart-series-color, var(--hl-accent, #63d9c1));
  stroke: rgba(2, 8, 10, 0.92);
  stroke-width: 2;
}

.pm-chart-hit-area {
  fill: transparent;
  cursor: crosshair;
}

.pm-chart-tooltip {
  position: absolute;
  z-index: 3;
  min-width: 154px;
  max-width: min(230px, calc(100% - 20px));
  display: grid;
  gap: 3px;
  padding: 9px 11px;
  border: 1px solid rgba(241, 202, 130, 0.36);
  border-radius: 8px;
  background: rgba(5, 10, 12, 0.9);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.46);
  color: rgba(242, 232, 207, 0.94);
  font: 12px/1.3 var(--font-body);
  pointer-events: none;
}

.pm-chart-tooltip[hidden] {
  display: none;
}

.pm-chart-tooltip strong {
  color: var(--hl-accent, #63d9c1);
  font-size: 14px;
}

.pm-chart-tooltip span,
.pm-chart-tooltip small {
  color: rgba(205, 197, 176, 0.72);
}

.pm-panel-tabs {
  min-height: 56px;
  border-top: 1px solid #1d2028;
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 0 14px;
}

.pm-panel-tabs button {
  border: 0;
  background: transparent;
  color: #52617f;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.pm-panel-tabs button.is-active {
  color: var(--hl-accent, #63d9c1);
}

.pm-market-meta-panel {
  display: grid;
}

.pm-market-meta-panel h2 {
  margin: 0;
  color: #ffffff;
  font-size: 14px;
}

.pm-market-meta-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.pm-market-meta-grid div {
  border: 1px solid #202532;
  border-radius: 8px;
  background: #0c0f14;
  padding: 8px;
  min-width: 0;
}

.pm-market-meta-grid span {
  display: block;
  color: #52617f;
  font-size: 11px;
  font-weight: 800;
}

.pm-market-meta-grid strong {
  display: block;
  margin-top: 2px;
  color: #ffffff;
  overflow-wrap: anywhere;
}

.pm-market-raw {
  margin: 0;
  color: #7582a1;
  font: 11px/1.45 "IBM Plex Mono", monospace;
  overflow-wrap: anywhere;
}

.pm-market-raw strong {
  color: #dfe7f7;
}

.pm-empty-position {
  min-height: 104px;
  display: grid;
  place-items: center;
  color: #53607d;
  font-size: 13px;
  padding: 14px;
  text-align: center;
}

.pm-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 16px 10px;
}

.pm-panel-head h2 {
  margin: 0;
  font-size: 16px;
  color: #ffffff;
}

.pm-panel-head span {
  color: #ffffff;
  font-family: "IBM Plex Mono", monospace;
  font-weight: 800;
}

.pm-book-panel {
  grid-area: book;
  min-height: 0;
}

.pm-book-table {
  flex: 1 1 auto;
  padding: 8px 12px 14px;
}

.pm-book-body {
  display: grid;
  gap: 1px;
}

.pm-book-head,
.pm-book-row,
.pm-book-mid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  align-items: center;
  min-height: 28px;
}

.pm-book-head {
  color: #7686ad;
  font-size: 11px;
  font-weight: 800;
}

.pm-book-row {
  position: relative;
  color: #f7f8fb;
  font-size: 12px;
  font-family: "IBM Plex Mono", monospace;
  overflow: hidden;
}

.pm-book-row span:first-child {
  position: relative;
  z-index: 1;
  padding-left: 7px;
  font-weight: 800;
}

.pm-book-row span:first-child::before {
  content: "";
  position: absolute;
  inset: 3px auto 3px 0;
  width: var(--bar);
  z-index: -1;
  border-radius: 3px;
  opacity: 0.42;
}

.pm-book-row--ask span:first-child {
  color: var(--hl-red, #f23645);
}

.pm-book-row--ask span:first-child::before {
  background: var(--hl-red-soft, rgba(242, 54, 69, 0.28));
}

.pm-book-row--bid span:first-child {
  color: var(--hl-accent, #63d9c1);
}

.pm-book-row--bid span:first-child::before {
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.22));
}

.pm-book-row strong {
  text-align: right;
  font-size: 12px;
}

.pm-book-mid {
  margin: 8px 0;
  min-height: 32px;
  padding: 0 10px;
  border-radius: 4px;
  background: #272b35;
  color: #ffffff;
  font-family: "IBM Plex Mono", monospace;
  font-size: 12px;
  font-weight: 700;
}

.pm-book-mid strong {
  text-align: right;
}

.pm-book-meta {
  display: grid;
  gap: 4px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #202532;
  color: #667493;
  font: 11px/1.45 "IBM Plex Mono", monospace;
}

.pm-recent-trades {
  display: none !important;
}

.pm-recent-trades h3 {
  margin: 0;
  color: #ffffff;
  font-size: 13px;
}

.pm-trade-row {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 8px;
  color: #8fa1ca;
  font: 11px/1.35 "IBM Plex Mono", monospace;
}

.pm-trade-row strong {
  color: #ffffff;
  text-align: right;
}

.pm-ticket-panel {
  padding: 24px 22px;
  min-height: 498px;
}

.pm-ticket-tabs {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  margin-bottom: 36px;
}

.pm-ticket-tabs button {
  border: 0;
  border-bottom: 1px solid transparent;
  background: transparent;
  color: #68758f;
  padding: 8px 0 12px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.pm-ticket-tabs button.is-active {
  color: var(--hl-accent, #63d9c1);
  border-color: var(--hl-accent, #63d9c1);
}

.pm-ticket-tabs button:disabled {
  cursor: not-allowed;
  opacity: 0.38;
}

.pm-ticket-tabs span {
  justify-self: end;
  color: #ffffff;
  font-weight: 800;
}

.pm-selected-outcome {
  display: grid;
  gap: 3px;
  margin-bottom: 16px;
  padding: 12px 14px;
  border: 1px solid #202532;
  border-radius: 8px;
  background: #0b0d12;
}

.pm-selected-outcome span,
.pm-selected-outcome small {
  color: #7180a3;
  font-size: 12px;
  font-weight: 800;
}

.pm-selected-outcome strong {
  color: #ffffff;
  font-size: 15px;
  overflow-wrap: anywhere;
}

.pm-order-type-toggle {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(72px, auto));
  gap: 4px;
  padding: 3px;
  border: 1px solid #232a38;
  border-radius: 8px;
  background: #0b0d12;
}

.pm-order-type-toggle button {
  min-height: 32px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #8fa1ca;
  font-size: 12px;
}

.pm-order-type-toggle button.is-active {
  background: var(--hl-accent, #63d9c1);
  color: var(--hl-accent-ink, #0b0e11);
}

.pm-outcome-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 20px;
}

.pm-outcome-pair button {
  min-height: 56px;
  border-radius: 8px;
  border: 1px solid #2d3444;
  background: #171a22;
  color: #ffffff;
  display: grid;
  place-items: center;
  gap: 3px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.pm-outcome-pair button.is-active:first-child {
  border-color: var(--hl-accent, #63d9c1);
  color: var(--hl-accent, #63d9c1);
}

.pm-outcome-pair button.is-active:last-child {
  border-color: var(--hl-red, #f23645);
  color: var(--hl-red, #f23645);
}

.pm-outcome-pair span {
  color: #8fa1ca;
  font-size: 12px;
}

.pm-order-form {
  display: grid;
  gap: 10px;
}

.pm-order-field {
  display: grid;
  gap: 6px;
}

.pm-order-field span,
.pm-signing-panel label span {
  color: #52617f;
  font-size: 13px;
  font-weight: 800;
}

.pm-order-field input {
  height: 40px;
  border-radius: 8px;
  border: 1px solid #202532;
  background: #0b0d12;
  color: #ffffff;
  padding: 0 12px;
  font: inherit;
  font-size: 18px;
  font-weight: 800;
}

.pm-order-field select {
  height: 40px;
  border-radius: 8px;
  border: 1px solid #202532;
  background: #0b0d12;
  color: #ffffff;
  padding: 0 12px;
  font: inherit;
  font-weight: 800;
}

.pm-order-field input:focus {
  outline: 2px solid var(--hl-focus, rgba(99, 217, 193, 0.35));
  outline-offset: 1px;
}

.pm-order-field select:focus {
  outline: 2px solid var(--hl-focus, rgba(99, 217, 193, 0.35));
  outline-offset: 1px;
}

#userAddress {
  font: 13px/1.3 "IBM Plex Mono", monospace;
  font-weight: 700;
}

.pm-quick-amounts {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.pm-quick-amounts button {
  height: 36px;
  border: 0;
  border-radius: 8px;
  background: #171b23;
  color: #dfe8fb;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.pm-return-box {
  min-height: 58px;
  border: 1px solid var(--hl-accent-border, rgba(99, 217, 193, 0.42));
  border-radius: 8px;
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.08));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2px 12px;
  padding: 10px 16px;
  color: var(--hl-accent, #63d9c1);
  font-weight: 800;
}

.pm-return-box strong {
  justify-self: end;
  color: inherit;
}

.pm-return-box small {
  grid-column: 1 / -1;
  color: #6f7d9e;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
}

.pm-builder-notice {
  border: 1px solid #2a243b;
  border-radius: 8px;
  background: #13111d;
  color: #b5a3ff;
  padding: 12px;
  margin-bottom: 14px;
  font-size: 12px;
  line-height: 1.45;
}

.pm-builder-notice strong {
  color: #ffffff;
}

.pm-builder-notice.is-blocked {
  border-color: var(--hl-red-border, rgba(242, 54, 69, 0.42));
  background: var(--hl-red-soft, rgba(242, 54, 69, 0.08));
  color: var(--hl-red, #f23645);
}

.pm-builder-notice.is-ok {
  border-color: var(--hl-accent-border, rgba(99, 217, 193, 0.42));
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.08));
  color: var(--hl-accent, #63d9c1);
}

.pm-builder-panel p:nth-of-type(n + 2) {
  display: none;
}

.pm-sign-button {
  min-height: 50px;
  border: 0;
  border-radius: 8px;
  background: var(--hl-accent, #63d9c1);
  color: var(--hl-accent-ink, #0b0e11);
  font: inherit;
  font-size: 16px;
  font-weight: 800;
  cursor: pointer;
}

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

.pm-ticket-blocker {
  min-height: 34px;
  margin: 0;
  color: #ff9ab0;
  font-size: 12px;
  line-height: 1.45;
}

.pm-ticket-blocker.is-ok {
  color: var(--hl-accent, #63d9c1);
}

.pm-order-info {
  margin-top: 14px;
  padding: 0;
}

.pm-order-info summary {
  min-height: 56px;
  display: flex;
  align-items: center;
  padding: 0 14px;
  color: #ffffff;
  font-weight: 800;
  cursor: pointer;
}

.pm-order-info dl {
  margin: 0;
  padding: 0 14px 14px;
  display: grid;
  gap: 8px;
}

.pm-order-info dl div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #8d9abc;
  font-size: 12px;
}

.pm-order-info dd {
  margin: 0;
  color: #ffffff;
  text-align: right;
}

.pm-signing-panel {
  margin-top: 14px;
  padding: 14px;
  display: grid;
  gap: 10px;
}

.pm-signing-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.pm-signing-head span {
  color: #8da0ce;
  font-size: 12px;
  font-weight: 800;
}

.pm-order-preview-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid #202532;
  border-radius: 8px;
  background: #0b0d12;
}

.pm-order-preview-panel[hidden] {
  display: none !important;
}

.pm-order-preview-panel div {
  min-width: 0;
}

.pm-order-preview-panel span {
  display: block;
  color: #64708f;
  font-size: 11px;
  font-weight: 800;
}

.pm-order-preview-panel strong {
  display: block;
  margin-top: 2px;
  color: #ffffff;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.pm-signing-panel label {
  display: grid;
  gap: 6px;
}

.pm-signing-panel textarea {
  width: 100%;
  min-height: 112px;
  resize: vertical;
  border: 1px solid #202532;
  border-radius: 8px;
  background: #0b0d12;
  color: #dfe8fb;
  padding: 10px;
  font: 12px/1.45 "IBM Plex Mono", monospace;
}

.pm-signing-panel pre {
  max-height: 190px;
  overflow: auto;
  margin: 0;
  border-radius: 8px;
  background: #0b0d12;
  color: #8492b3;
  padding: 10px;
  font: 12px/1.45 "IBM Plex Mono", monospace;
  white-space: pre-wrap;
}

.pm-empty-state {
  grid-column: 1 / -1;
  border: 1px dashed #263043;
  border-radius: 8px;
  background: #10141c;
  color: #8a96b4;
  padding: 28px;
  text-align: center;
}

.pm-user-state-table {
  width: 100%;
  max-width: 780px;
  display: grid;
  gap: 8px;
  text-align: left;
}

.pm-user-state-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  border: 1px solid #202532;
  border-radius: 8px;
  padding: 8px 10px;
  background: #0c0f14;
  color: #8fa1ca;
}

.pm-user-state-row strong {
  color: #ffffff;
}

.pm-cancel-template-button,
.pm-close-position-button {
  border: 1px solid #2f3b4e;
  border-radius: 8px;
  background: #151922;
  color: #ffffff;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  padding: 6px 9px;
  cursor: pointer;
}

.pm-close-position-button {
  border-color: rgba(74, 222, 128, 0.4);
  background: rgba(34, 197, 94, 0.12);
}

.pm-user-state-row--pending {
  border-color: rgba(245, 158, 11, 0.34);
  background: rgba(245, 158, 11, 0.08);
}

@media (max-width: 1480px) {
  .pm-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 336px) minmax(360px, 446px);
    grid-template-areas:
      "chart book ticket"
      "chart outcomes ticket";
  }
}

@media (max-width: 1160px) {
  .pm-market-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pm-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 446px);
    grid-template-areas:
      "chart ticket"
      "book ticket"
      "outcomes ticket";
  }

  .pm-book-panel,
  .pm-ticket-panel {
    max-width: none;
  }
}

@media (max-width: 760px) {
  .pm-category-tabs {
    gap: 18px;
    padding: 0 14px;
  }

  .pm-list-view,
  .pm-detail-view {
    padding-left: 12px;
    padding-right: 12px;
  }

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

  .pm-detail-header,
  .pm-detail-title-block,
  .pm-chip-row {
    align-items: stretch;
  }

  .pm-detail-header,
  .pm-detail-title-block {
    flex-direction: column;
  }

  .pm-detail-stats {
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }

  .pm-detail-stats div {
    text-align: left;
  }

  .pm-chart-wrap {
    height: 340px;
  }

  .pm-quick-amounts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .pm-search-inline {
    margin-left: 0;
    width: 100%;
  }
}

.pm-app-topbar {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 18px;
  border-bottom: 1px solid var(--hl-border, #2b2f36);
  background: var(--hl-bg, #0b0e11);
}

.pm-brand {
  display: inline-flex;
  align-items: center;
  flex: 0 1 auto;
  gap: 11px;
  min-width: 0;
  color: #ffffff;
  text-decoration: none;
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
}

.pm-brand-logo {
  width: 34px;
  height: 34px;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  object-position: center;
  background: transparent;
  filter: brightness(1.45) contrast(1.16);
}

.pm-brand-name {
  color: #f8fbff;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  text-shadow: none;
  white-space: nowrap;
}

.pm-top-actions {
  display: inline-flex;
  align-items: center;
  gap: 22px;
}

.pm-top-signal {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: end;
  justify-content: center;
  gap: 2px;
  color: #ffcc7a;
}

.pm-top-signal i {
  width: 4px;
  border: 2px solid currentColor;
  border-top-width: 3px;
  border-radius: 2px 2px 0 0;
}

.pm-top-signal i:nth-child(1) {
  height: 10px;
}

.pm-top-signal i:nth-child(2) {
  height: 16px;
}

.pm-top-signal i:nth-child(3) {
  height: 7px;
}

.pm-top-signin,
.pm-top-deposit,
.pm-top-safety,
.pm-top-stream {
  min-width: 70px;
  min-height: 36px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  background: var(--hl-accent, #63d9c1);
  color: var(--hl-accent-ink, #0b0e11);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.pm-top-safety,
.pm-top-stream {
  min-width: 74px;
  border: 1px solid #222835;
  background: #10141c;
  color: #cdd7ea;
}

.pm-top-stream {
  cursor: default;
  min-width: 104px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

.pm-top-stream.is-ok {
  border-color: var(--hl-accent-border, rgba(99, 217, 193, 0.42));
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.14));
  color: var(--hl-accent, #63d9c1);
}

.pm-top-stream.is-warn {
  border-color: #5b4826;
  background: #21180f;
  color: #ffc46d;
}

.pm-top-stream.is-error {
  border-color: var(--hl-red-border, rgba(242, 54, 69, 0.42));
  background: var(--hl-red-soft, rgba(242, 54, 69, 0.12));
  color: var(--hl-red, #f23645);
}

.pm-top-signin:hover,
.pm-top-signin:focus-visible,
.pm-top-deposit:hover,
.pm-top-deposit:focus-visible,
.pm-top-safety:hover,
.pm-top-safety:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.34);
  outline-offset: 2px;
}

.pm-top-signin.is-authenticated {
  min-width: 112px;
  border: 1px solid var(--hl-accent-border, rgba(99, 217, 193, 0.42));
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.14));
  color: var(--hl-accent, #63d9c1);
}

.pm-top-balance {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  border: 1px solid #202532;
  border-radius: 999px;
  background: #0f131c;
  color: #dfe8fb;
  font-size: 12px;
  font-weight: 800;
}

.pm-top-balance[hidden],
.pm-top-deposit[hidden] {
  display: none;
}

.pm-list-view {
  padding: 16px 18px 48px;
}

.pm-list-layout {
  display: block;
}

.pm-list-main {
  min-width: 0;
}

@media (max-width: 1280px) {
  .pm-list-layout {
    display: block;
  }
}

@media (max-width: 760px) {
  .pm-app-topbar {
    padding: 0 14px;
  }

  .pm-brand span {
    font-size: 18px;
  }

  .pm-brand-logo {
    width: 28px;
    height: 28px;
  }

  .pm-top-signal {
    display: none;
  }

  .pm-top-actions {
    gap: 10px;
  }

  .pm-top-safety,
  .pm-top-signin {
    min-width: 64px;
    padding: 0 12px;
  }

  .pm-list-view {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.pm-detail-view {
  padding: 16px 18px 40px;
}

.pm-detail-header {
  min-height: 64px;
  padding: 4px 4px 18px;
}

.pm-detail-grid {
  display: grid;
  grid-template-columns: minmax(500px, 1fr) minmax(300px, 336px) minmax(300px, 336px) minmax(360px, 446px);
  grid-template-areas:
    "chart book outcomes ticket"
    "chart book outcomes ticket";
  gap: 12px;
  align-items: stretch;
}

.pm-chart-panel {
  grid-area: chart;
  display: flex;
  flex-direction: column;
}

.pm-book-panel {
  grid-area: book;
  display: flex;
  flex-direction: column;
}

.pm-outcomes-panel {
  grid-area: outcomes;
  min-height: 504px;
  display: flex;
  flex-direction: column;
  border: 1px solid #1d2028;
  border-radius: 8px;
  background: #111318;
}

.pm-outcomes-panel .pm-panel-head {
  flex: 0 0 auto;
}

.pm-outcomes-panel .pm-outcomes-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

.pm-ticket-panel {
  grid-area: ticket;
  position: sticky;
  top: 12px;
  min-height: 530px;
  display: grid;
  gap: 14px;
  padding: 22px;
}

.pm-outcomes-list {
  display: grid;
  gap: 8px;
  padding: 10px 16px 16px;
}

.pm-outcome-row {
  min-height: 56px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: rgba(13, 16, 22, 0.55);
  backdrop-filter: blur(12px);
  color: #ffffff;
  font: inherit;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.22);
}

.pm-outcome-row__pct,
.pm-outcome-row em {
  color: #9fb0d0;
  font-style: normal;
  font-size: 13px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.pm-outcome-nav {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 8px;
  padding: 10px 12px 14px;
  max-height: min(72vh, 680px);
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
}

.pm-outcome-nav__chip {
  flex: 0 1 calc(33.333% - 6px);
  min-width: 104px;
  max-width: none;
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  background: rgba(13, 16, 22, 0.55);
  backdrop-filter: blur(12px);
  color: #fff;
  cursor: pointer;
  scroll-snap-align: start;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.pm-outcome-nav__chip.is-active {
  border-color: var(--hl-accent-border, rgba(99, 217, 193, 0.72));
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.12));
}

.pm-outcome-nav__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 700;
}

.pm-outcome-nav__label .pm-team-flag {
  margin-right: 4px;
}

.pm-outcome-nav__pct {
  font-size: 13px;
  font-weight: 700;
  color: #b8c7e6;
  font-variant-numeric: tabular-nums;
}

.pm-detail-title-block h1 {
  margin: 0;
  color: #f8fafc;
  font-size: clamp(22px, 2.4vw, 34px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.12;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.45);
}

.pm-detail-meta,
.pm-detail-title-meta {
  color: #9fb0d0;
}

.pm-market-card,
.pm-chart-panel,
.pm-book-panel,
.pm-outcomes-panel,
.pm-ticket-panel {
  background: rgba(17, 19, 24, 0.58);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow:
    0 10px 34px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.pm-ticket-panel .pm-auth-gate {
  display: none !important;
}

.pm-top-signin[hidden] {
  display: none !important;
}

.pm-ticket-market-heading {
  order: 1;
  display: flex;
  align-items: center;
  gap: 12px;
}

.pm-ticket-icon {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  font-size: 11px;
}

.pm-ticket-market-heading strong {
  min-width: 0;
  color: #ffffff;
  font-size: 18px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.pm-ticket-tabs {
  order: 2;
  margin-bottom: 10px;
}

.pm-outcome-pair {
  order: 3;
  margin-bottom: 8px;
}

.pm-outcome-pair button {
  min-height: 56px;
  grid-template-columns: auto auto;
  place-items: center;
  justify-content: center;
  gap: 6px;
}

.pm-outcome-pair span {
  color: inherit;
  font-size: 15px;
  font-weight: 900;
}

.pm-ticket-balance {
  min-height: 110px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto auto auto;
  gap: 12px;
  align-items: start;
  padding: 16px;
  border: 1px solid #1d2028;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: #0b0d12;
}

.pm-ticket-balance span {
  color: #7180a3;
  font-weight: 800;
}

.pm-ticket-balance strong {
  justify-self: end;
  color: #91a1cc;
}

.pm-ticket-balance output {
  display: none;
}

.pm-ticket-balance small {
  grid-column: 1 / -1;
  color: #6f7d9e;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.pm-ticket-panel .pm-order-form {
  order: 4;
  display: grid;
  gap: 8px;
}

.pm-order-field--address,
.pm-order-field--price,
.pm-order-field--size,
.pm-order-field--tif {
  display: none;
}

.pm-order-form.is-limit .pm-order-field--price,
.pm-order-form.is-limit .pm-order-field--tif {
  display: grid;
}

.pm-order-field--amount {
  margin-top: -8px;
  padding: 0 16px 16px;
  border: 1px solid #1d2028;
  border-top: 0;
  border-radius: 0 0 8px 8px;
  background: #0b0d12;
}

.pm-order-field--amount span {
  display: none;
}

.pm-order-field--amount input {
  height: 72px;
  min-height: 72px;
  border: 0;
  background: transparent;
  color: #667493;
  text-align: center;
  font-size: 44px;
  font-weight: 500;
  line-height: 1;
  opacity: 1;
}

.pm-quick-amounts {
  margin-top: -4px;
}

.pm-return-box {
  min-height: 48px;
}

.pm-builder-notice {
  order: 6;
  margin-bottom: 0;
}

.pm-ticket-panel .pm-builder-panel {
  order: 7;
}

.pm-ticket-panel .pm-order-info {
  order: 8;
}

.pm-ticket-panel .pm-signing-panel {
  order: 9;
}

@media (max-width: 1700px) {
  .pm-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 336px) minmax(360px, 446px);
    grid-template-areas:
      "chart book ticket"
      "chart outcomes ticket";
  }
}

@media (max-width: 1260px) {
  .pm-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 446px);
    grid-template-areas:
      "chart ticket"
      "book ticket"
      "outcomes ticket";
  }
}

@media (max-width: 980px) {
  .pm-detail-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "chart"
      "book"
      "outcomes"
      "ticket";
  }

  .pm-ticket-panel {
    position: static;
  }
}

.pm-detail-grid,
.pm-detail-grid > *,
.pm-ticket-panel,
.pm-ticket-panel > *,
.pm-order-info,
.pm-signing-panel,
.pm-builder-panel,
.pm-order-form,
.pm-order-field,
.pm-order-field input,
.pm-order-field select,
.pm-signing-panel textarea,
.pm-signing-panel pre {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.pm-ticket-panel {
  width: 100%;
  overflow: hidden;
}

.pm-order-info,
.pm-signing-panel,
.pm-builder-panel {
  width: 100%;
}

.pm-order-info dd,
.pm-signing-panel pre {
  overflow-wrap: anywhere;
}

.pm-market-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: auto;
  align-items: start;
}

.pm-market-card {
  height: auto;
  align-self: start;
}

.pm-legal-page {
  min-height: 100vh;
  background: #090b0f;
}

.pm-legal-shell {
  width: min(920px, calc(100% - 32px));
  margin: 0 auto;
  padding: 36px 0 72px;
  color: #e8eef8;
}

.pm-legal-shell header,
.pm-legal-shell section {
  border-bottom: 1px solid #202633;
  padding: 22px 0;
}

.pm-legal-shell h1,
.pm-legal-shell h2 {
  margin: 0 0 10px;
  letter-spacing: 0;
}

.pm-legal-shell h1 {
  font-size: 32px;
}

.pm-legal-shell h2 {
  color: #ffffff;
  font-size: 18px;
}

.pm-legal-shell p {
  margin: 10px 0 0;
  color: #aebbd0;
  line-height: 1.7;
}

.pm-legal-shell a {
  color: #83b4ff;
}

.pm-legal-back {
  display: inline-flex;
  margin-bottom: 18px;
  color: #83b4ff;
  text-decoration: none;
  font-weight: 800;
}

@media (max-width: 1160px) {
  .pm-detail-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "chart"
      "book"
      "outcomes"
      "ticket";
  }

  .pm-ticket-panel {
    position: static;
  }
}

@media (max-width: 760px) {
  .pm-list-view,
  .pm-detail-view {
    padding-left: 8px;
    padding-right: 8px;
  }

  .pm-detail-header,
  .pm-ticket-panel {
    padding-left: 14px;
    padding-right: 14px;
  }

  .pm-market-grid {
    gap: 10px;
  }
}

.pm-team-flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: 8px;
  background: transparent;
  border: 0;
  vertical-align: middle;
}

.pm-team-flag--xs {
  width: 32px;
  height: 32px;
}

.pm-team-flag--sm {
  width: 40px;
  height: 40px;
}

.pm-team-flag--md {
  width: 44px;
  height: 44px;
}

.pm-team-flag--lg {
  width: 56px;
  height: 56px;
}

.pm-team-flag__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  image-rendering: auto;
}

.pm-team-flag__fallback,
.pm-team-flag__draw-mark {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: #8ea0c7;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

.pm-outcome-row.is-active {
  border-color: var(--hl-accent-border, rgba(99, 217, 193, 0.72));
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.12));
}

.pm-outcome-row__label {
  min-width: 0;
  overflow: hidden;
  color: #ffffff;
  font-weight: 700;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-team-flag--draw {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.pm-team-flag--unknown {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.pm-team-flag-group {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.pm-market-icon--flag,
.pm-market-icon--flags {
  width: auto;
  min-width: 0;
  height: auto;
  padding: 0;
  background: transparent;
  border: 0;
}

.pm-card-head .pm-team-flag--xs {
  width: 22px;
  height: 16px;
}

.pm-card-head .pm-team-flag--sm {
  width: 28px;
  height: 21px;
}

.pm-outcome-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.pm-outcome-label__text {
  min-width: 0;
}

.pm-card-outcome-row__label .pm-outcome-label,
.pm-card-side strong .pm-outcome-label,
.pm-outcome-row__label .pm-outcome-label {
  width: 100%;
  justify-content: flex-start;
}

.pm-card-outcome-row__label .pm-outcome-label {
  gap: 8px;
}

.pm-card-outcome-row__label .pm-team-flag--xs {
  width: 16px;
  height: 12px;
  flex-shrink: 0;
}

.pm-outcome-row__label .pm-team-flag--xs {
  width: 18px;
  height: 13px;
  flex-shrink: 0;
}

.pm-detail-header .pm-market-icon--flag,
.pm-detail-header .pm-market-icon--flags,
.pm-ticket-panel .pm-market-icon--flag,
.pm-ticket-panel .pm-market-icon--flags {
  margin-right: 4px;
}

.pm-collection-toggle {
  width: 100%;
  min-height: 44px;
  border-radius: 8px;
  border: 1px dashed #3a4a66;
  background: rgba(255, 255, 255, 0.03);
  color: #9eb4e2;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.pm-collection-toggle:hover {
  border-color: #5f7ab8;
  color: #ffffff;
  background: rgba(95, 122, 184, 0.12);
}

.pm-collection-legs-scroll {
  display: grid;
  gap: 8px;
  max-height: min(52vh, 520px);
  overflow-y: auto;
  padding-right: 2px;
}

.pm-card-outcomes--collapsed .pm-collection-toggle {
  margin-top: 2px;
}

@media (max-width: 760px) {
  .pm-app-topbar {
    padding: 0 12px;
    gap: 10px;
  }

  .pm-category-tabs {
    gap: 16px;
    padding: 0 12px;
    min-height: 52px;
  }

  .pm-list-view,
  .pm-detail-view {
    padding: 10px 12px 28px;
  }

  .pm-chip-row {
    margin-bottom: 14px;
    gap: 8px;
  }

  .pm-search-inline {
    flex: 1 1 100%;
    min-width: 0;
  }

  .pm-market-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .pm-card-head h2 {
    font-size: 14px;
  }

  .pm-card-binary-side {
    min-height: 64px;
  }

  .pm-detail-header {
    padding: 10px 12px;
    margin-bottom: 10px;
  }

  .pm-detail-title-block h1 {
    font-size: 18px;
  }

  .pm-chart-panel {
    min-height: 0;
  }

  .pm-chart-wrap {
    height: 220px;
    padding: 12px 10px 8px;
  }

  .pm-book-panel,
  .pm-outcomes-panel {
    min-height: 0;
  }

  .pm-ticket-panel {
    padding: 16px 14px;
  }

  .pm-order-field--amount input {
    height: 56px;
    min-height: 56px;
    font-size: 32px;
  }

  .pm-quick-amounts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .pm-quick-amounts button:nth-child(4),
  .pm-quick-amounts button:nth-child(5) {
    grid-column: span 1;
  }
}

.pm-wallet-sign-overlay {
  position: absolute;
  inset: 0;
  z-index: 12;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  padding: 24px;
  text-align: center;
  color: #f8fafc;
  background: rgba(8, 10, 14, 0.88);
  backdrop-filter: blur(8px);
}

.pm-wallet-sign-overlay[hidden] {
  display: none !important;
}

.pm-wallet-sign-back {
  position: absolute;
  top: 14px;
  left: 14px;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: #f8fafc;
  cursor: pointer;
}

.pm-wallet-sign-icon {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(96, 165, 250, 0.2);
  color: #dbeafe;
  font-size: 28px;
  font-weight: 800;
}

.pm-wallet-sign-icon .pm-provider-icon {
  width: 46px;
  height: 46px;
}

.pm-wallet-sign-overlay h3 {
  margin: 8px 0 0;
  font-size: 22px;
}

.pm-wallet-sign-overlay p {
  margin: 0;
  color: rgba(226, 232, 240, 0.78);
  font-size: 14px;
}

.pm-wallet-sign-spinner {
  width: 28px;
  height: 28px;
  margin-top: 8px;
  border: 3px solid rgba(255, 255, 255, 0.18);
  border-top-color: #fff;
  border-radius: 999px;
  animation: pm-wallet-spin 0.8s linear infinite;
}

@keyframes pm-wallet-spin {
  to { transform: rotate(360deg); }
}

.pm-deposit-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0;
}

.pm-deposit-tabs button {
  min-height: 44px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.5);
  color: #e2e8f0;
  cursor: pointer;
}

.pm-deposit-tabs button.is-active {
  border-color: rgba(96, 165, 250, 0.55);
  background: rgba(37, 99, 235, 0.18);
}

.pm-deposit-tabs button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.pm-deposit-connected {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(96, 165, 250, 0.28);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.55);
}

.pm-deposit-wallet-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.pm-deposit-wallet-row small {
  display: block;
  color: rgba(226, 232, 240, 0.72);
}

#depositModalBalance {
  margin: 0;
  color: rgba(226, 232, 240, 0.78);
}

.pm-detail-bottom {
  margin-top: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  background: rgba(17, 19, 24, 0.58);
  backdrop-filter: blur(16px);
  box-shadow:
    0 10px 34px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  overflow: hidden;
}

.pm-detail-bottom .pm-panel-tabs {
  min-height: 52px;
  border-bottom: 1px solid #1d2028;
  padding: 0 18px;
  gap: 24px;
}

.pm-detail-bottom-body,
.pm-detail-bottom .pm-empty-position {
  min-height: 120px;
  padding: 18px;
}

.pm-detail-bottom .pm-user-state-table {
  display: grid;
  gap: 8px;
}

.pm-outcomes-panel {
  min-height: 0;
}

.pm-outcomes-list .pm-outcome-row {
  width: 100%;
}

.pm-outcomes-list .pm-outcome-row__label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.pm-outcomes-list .pm-outcome-row__pct {
  font-size: 15px;
  font-weight: 700;
  color: #ffffff;
}

.pm-ticket-panel {
  min-height: 530px;
  align-self: stretch;
}

@media (max-width: 1480px) {
  .pm-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 336px) minmax(360px, 446px) !important;
    grid-template-areas:
      "chart book ticket"
      "chart outcomes ticket" !important;
  }
}

@media (max-width: 1260px) {
  .pm-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 446px) !important;
    grid-template-areas:
      "chart ticket"
      "book ticket"
      "outcomes ticket" !important;
  }
}

@media (max-width: 980px) {
  .pm-detail-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "chart"
      "book"
      "outcomes"
      "ticket" !important;
  }

  .pm-ticket-panel {
    min-height: 0;
    align-self: auto;
  }

  .pm-chart-wrap {
    min-height: 320px;
  }

  .pm-chart-hero__match {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .pm-chart-hero__center {
    order: -1;
  }

  .pm-detail-stats {
    width: 100%;
    justify-content: flex-start;
    gap: 18px;
  }
}

/* Hyperliquid brand polish — predict market surfaces */
body.hg-markets.hg-predict-market-page {
  background: var(--hl-bg, #0b0e11);
}

.hg-predict-market-page .pm-brand-logo {
  filter: brightness(0) saturate(100%) invert(79%) sepia(28%) saturate(746%) hue-rotate(118deg) brightness(97%) contrast(92%);
}

.hg-predict-market-page .pm-brand-name {
  color: var(--hl-text, #ffffff);
}

.hg-predict-market-page .pm-chart-panel,
.hg-predict-market-page .pm-book-panel,
.hg-predict-market-page .pm-outcomes-panel,
.hg-predict-market-page .pm-ticket-panel,
.hg-predict-market-page .pm-order-info,
.hg-predict-market-page .pm-signing-panel {
  border-color: var(--hl-border-subtle, #1d2028);
  background: var(--hl-bg-panel, #111318);
}

.hg-predict-market-page .pm-market-card,
.hg-predict-market-page .pm-chart-panel,
.hg-predict-market-page .pm-book-panel,
.hg-predict-market-page .pm-outcomes-panel,
.hg-predict-market-page .pm-ticket-panel {
  background: var(--hl-bg-raised, #14161c);
  border-color: var(--hl-border-subtle, #1d2028);
  box-shadow: none;
  backdrop-filter: none;
}

.hg-predict-market-page .pm-detail-meta,
.hg-predict-market-page .pm-detail-title-meta,
.hg-predict-market-page .pm-card-binary-side__payout,
.hg-predict-market-page .pm-market-footer,
.hg-predict-market-page .pm-market-volume,
.hg-predict-market-page .pm-market-deadline,
.hg-predict-market-page .pm-detail-stats span,
.hg-predict-market-page .pm-book-head,
.hg-predict-market-page .pm-order-field span,
.hg-predict-market-page .pm-ticket-tabs button,
.hg-predict-market-page .pm-back-button {
  color: var(--hl-text-muted, #848e9c);
}

.hg-predict-market-page .pm-top-signin:hover,
.hg-predict-market-page .pm-top-signin:focus-visible,
.hg-predict-market-page .pm-top-deposit:hover,
.hg-predict-market-page .pm-top-deposit:focus-visible {
  outline: 2px solid var(--hl-accent-border, rgba(99, 217, 193, 0.55));
  outline-offset: 2px;
}

.hg-predict-market-page .pm-sign-button:hover:not(:disabled),
.hg-predict-market-page .pm-sign-button:focus-visible:not(:disabled) {
  filter: brightness(1.06);
  outline: 2px solid var(--hl-accent-border, rgba(99, 217, 193, 0.55));
  outline-offset: 2px;
}

.hg-predict-market-page .pm-close-position-button {
  border-color: var(--hl-accent-border, rgba(99, 217, 193, 0.42));
  background: var(--hl-accent-soft, rgba(99, 217, 193, 0.12));
  color: var(--hl-accent, #63d9c1);
}

.hg-predict-market-page .pm-ticket-blocker {
  color: var(--hl-red, #f23645);
}

/* Tactile glass redesign, scoped to the HIP-4 markets terminal. */
body.hg-markets.hg-predict-market-page {
  --pm-cold-ink: #071011;
  --pm-cold-plate: rgba(18, 25, 28, 0.62);
  --pm-cold-plate-strong: rgba(14, 19, 21, 0.82);
  --pm-glass-line: rgba(219, 233, 236, 0.22);
  --pm-glass-line-soft: rgba(219, 233, 236, 0.1);
  --pm-glass-top: rgba(255, 255, 255, 0.26);
  --pm-glass-bottom: rgba(255, 255, 255, 0.07);
  --pm-gold: #c59a5a;
  --pm-gold-bright: #f1ca82;
  --pm-gold-soft: rgba(197, 154, 90, 0.18);
  --pm-green: #66d1a2;
  --pm-green-soft: rgba(102, 209, 162, 0.13);
  --pm-red-soft: rgba(242, 82, 82, 0.13);
  --pm-touch-shadow:
    0 18px 54px rgba(0, 0, 0, 0.46),
    0 2px 1px rgba(255, 255, 255, 0.07) inset,
    0 -22px 48px rgba(0, 0, 0, 0.2) inset;
  color: rgba(230, 219, 195, 0.92);
  background:
    linear-gradient(180deg, #091113 0%, #111a1d 44%, #080d0f 100%);
  overflow-x: hidden;
}

.hg-predict-market-page .pm-root {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  min-height: 100dvh;
  padding-bottom: calc(118px + env(safe-area-inset-bottom));
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(5, 9, 10, 0.84) 0%, rgba(10, 17, 20, 0.48) 100%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 84px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.015) 0 1px, transparent 1px 58px),
    repeating-conic-gradient(from 12deg at 50% 48%, rgba(214, 227, 226, 0.035) 0deg 1deg, transparent 1deg 5deg),
    #0a1113;
}

.hg-predict-market-page .pm-root::before,
.hg-predict-market-page .pm-root::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.hg-predict-market-page .pm-root::before {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045) 0%, transparent 20%),
    repeating-linear-gradient(96deg, rgba(202, 222, 224, 0.035) 0 1px, transparent 1px 9px),
    repeating-conic-gradient(from 0deg at 49% 52%, rgba(195, 214, 216, 0.045) 0deg 1deg, transparent 1deg 4deg);
  mix-blend-mode: screen;
  opacity: 0.82;
}

.hg-predict-market-page .pm-root::after {
  background:
    linear-gradient(109deg, transparent 0 22%, rgba(255, 255, 255, 0.11) 35%, rgba(255, 255, 255, 0.025) 43%, transparent 58%),
    linear-gradient(180deg, rgba(5, 8, 10, 0) 0%, rgba(5, 8, 10, 0.48) 100%);
  transform: translate3d(-7%, 0, 0);
  animation: pm-surface-sheen 14s ease-in-out infinite alternate;
}

.hg-predict-market-page .pm-app-topbar,
.hg-predict-market-page .pm-category-tabs,
.hg-predict-market-page .pm-list-view,
.hg-predict-market-page .pm-detail-view,
.hg-predict-market-page .pm-glass-dock {
  position: relative;
  z-index: 1;
}

.hg-predict-market-page .pm-app-topbar {
  min-height: 46px;
  padding: 0 18px;
  border-bottom: 1px solid rgba(231, 213, 171, 0.13);
  background:
    linear-gradient(180deg, rgba(18, 23, 24, 0.88), rgba(11, 15, 17, 0.72)),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.024) 0 1px, transparent 1px 46px);
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.34);
  backdrop-filter: blur(22px) saturate(118%);
  -webkit-backdrop-filter: blur(22px) saturate(118%);
}

.hg-predict-market-page .pm-brand {
  gap: 8px;
  min-height: 46px;
  color: rgba(224, 215, 195, 0.76);
}

.hg-predict-market-page .pm-brand-logo {
  width: 22px;
  height: 22px;
  filter: sepia(0.4) saturate(0.82) hue-rotate(94deg) brightness(0.9);
  opacity: 0.68;
}

.hg-predict-market-page .pm-brand-name {
  color: rgba(224, 215, 195, 0.72);
  font-size: 14px;
  font-weight: 700;
}

.hg-predict-market-page .pm-top-actions {
  gap: 10px;
}

.hg-predict-market-page .pm-top-signin,
.hg-predict-market-page .pm-top-deposit {
  min-height: 32px;
  min-width: 96px;
  border: 1px solid rgba(244, 209, 139, 0.72);
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(239, 191, 109, 0.96), rgba(153, 104, 44, 0.92)),
    linear-gradient(90deg, rgba(255, 255, 255, 0.24), transparent 46%);
  color: #23190f;
  box-shadow:
    0 7px 18px rgba(0, 0, 0, 0.36),
    0 1px 0 rgba(255, 241, 202, 0.8) inset,
    0 -8px 13px rgba(87, 52, 20, 0.24) inset;
  text-shadow: 0 1px 0 rgba(255, 236, 195, 0.35);
}

.hg-predict-market-page .pm-top-signin:active,
.hg-predict-market-page .pm-top-deposit:active,
.hg-predict-market-page .pm-filter-chip:active,
.hg-predict-market-page .pm-refresh-inline:active,
.hg-predict-market-page .pm-dock-button:active,
.hg-predict-market-page .pm-card-outcome-row:active,
.hg-predict-market-page .pm-card-binary-side:active {
  transform: translateY(1px);
  box-shadow:
    0 1px 4px rgba(0, 0, 0, 0.48),
    0 2px 14px rgba(0, 0, 0, 0.28) inset;
}

.hg-predict-market-page .pm-category-tabs {
  min-height: 58px;
  padding: 0 22px;
  gap: 22px;
  border-bottom: 1px solid rgba(231, 213, 171, 0.12);
  background:
    linear-gradient(180deg, rgba(13, 19, 21, 0.84), rgba(9, 14, 16, 0.56));
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.hg-predict-market-page .pm-category-tabs .pm-category-chip {
  position: relative;
  min-height: 44px;
  color: rgba(214, 203, 178, 0.58);
  font-size: 14px;
  font-weight: 650;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
}

.hg-predict-market-page .pm-category-tabs .pm-category-chip::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
}

.hg-predict-market-page .pm-category-tabs .pm-category-chip.is-active {
  color: rgba(245, 213, 151, 0.96);
}

.hg-predict-market-page .pm-category-tabs .pm-category-chip.is-active::after {
  background: var(--pm-gold-bright);
  box-shadow: 0 0 18px rgba(241, 202, 130, 0.4);
}

.hg-predict-market-page .pm-list-view {
  padding: 14px 16px calc(138px + env(safe-area-inset-bottom));
}

.hg-predict-market-page .pm-chip-row {
  gap: 8px;
  margin-bottom: 18px;
}

.hg-predict-market-page .pm-live-chip,
.hg-predict-market-page .pm-filter-chip,
.hg-predict-market-page .pm-refresh-inline,
.hg-predict-market-page .pm-search-inline input {
  border: 1px solid rgba(237, 213, 167, 0.18);
  background:
    linear-gradient(180deg, rgba(33, 31, 25, 0.66), rgba(10, 13, 15, 0.52));
  color: rgba(224, 215, 195, 0.82);
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.24),
    0 1px 0 rgba(255, 255, 255, 0.08) inset;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.hg-predict-market-page .pm-live-chip {
  border-color: rgba(232, 186, 103, 0.54);
  background:
    linear-gradient(180deg, rgba(102, 75, 39, 0.58), rgba(24, 20, 14, 0.62));
  color: rgba(244, 209, 139, 0.94);
}

.hg-predict-market-page .pm-live-chip i,
.hg-predict-market-page .pm-live-dot i {
  width: 5px;
  height: 5px;
  background: var(--pm-green);
  box-shadow: 0 0 10px rgba(102, 209, 162, 0.72);
}

.hg-predict-market-page .pm-search-inline {
  min-width: min(276px, 100%);
}

.hg-predict-market-page .pm-search-inline input {
  height: 34px;
  border-radius: 8px;
  color: rgba(238, 238, 225, 0.9);
}

.hg-predict-market-page .pm-search-inline input::placeholder {
  color: rgba(223, 218, 202, 0.54);
}

.hg-predict-market-page .pm-search-inline input:focus {
  outline: 2px solid rgba(241, 202, 130, 0.46);
  outline-offset: 2px;
}

.hg-predict-market-page .pm-market-grid {
  grid-template-columns: repeat(3, minmax(320px, 1fr));
  gap: 10px;
}

.hg-predict-market-page .pm-market-card,
.hg-predict-market-page .pm-chart-panel,
.hg-predict-market-page .pm-book-panel,
.hg-predict-market-page .pm-outcomes-panel,
.hg-predict-market-page .pm-ticket-panel,
.hg-predict-market-page .pm-detail-bottom,
.hg-predict-market-page .pm-order-info,
.hg-predict-market-page .pm-signing-panel,
.hg-predict-market-page .pm-builder-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--pm-glass-line);
  border-radius: 8px;
  background:
    linear-gradient(155deg, var(--pm-glass-top) 0%, rgba(255, 255, 255, 0.055) 22%, rgba(8, 13, 15, 0.58) 64%, rgba(0, 0, 0, 0.2) 100%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.028) 0 1px, transparent 1px 21px),
    rgba(16, 22, 25, 0.58);
  box-shadow: var(--pm-touch-shadow);
  backdrop-filter: blur(22px) saturate(128%);
  -webkit-backdrop-filter: blur(22px) saturate(128%);
}

.hg-predict-market-page .pm-market-card {
  min-height: 224px;
  padding: 14px 13px 12px;
  gap: 12px;
  color: rgba(232, 224, 204, 0.88);
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    background-color 160ms ease;
}

.hg-predict-market-page .pm-market-card::before,
.hg-predict-market-page .pm-chart-panel::before,
.hg-predict-market-page .pm-book-panel::before,
.hg-predict-market-page .pm-outcomes-panel::before,
.hg-predict-market-page .pm-ticket-panel::before,
.hg-predict-market-page .pm-detail-bottom::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0, rgba(255, 255, 255, 0.07) 3px, transparent 9px),
    linear-gradient(111deg, transparent 8%, rgba(255, 255, 255, 0.13) 31%, rgba(255, 255, 255, 0.035) 45%, transparent 68%),
    repeating-linear-gradient(100deg, rgba(255, 255, 255, 0.026) 0 1px, transparent 1px 7px);
  opacity: 0.9;
}

.hg-predict-market-page .pm-market-card > *,
.hg-predict-market-page .pm-chart-panel > *,
.hg-predict-market-page .pm-book-panel > *,
.hg-predict-market-page .pm-outcomes-panel > *,
.hg-predict-market-page .pm-ticket-panel > *,
.hg-predict-market-page .pm-detail-bottom > * {
  position: relative;
  z-index: 1;
}

.hg-predict-market-page .pm-market-card:hover,
.hg-predict-market-page .pm-market-card:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(241, 202, 130, 0.54);
  box-shadow:
    0 22px 62px rgba(0, 0, 0, 0.58),
    0 0 0 1px rgba(241, 202, 130, 0.14),
    0 2px 1px rgba(255, 255, 255, 0.12) inset,
    0 -24px 52px rgba(0, 0, 0, 0.25) inset;
}

.hg-predict-market-page .pm-market-card.is-selected {
  border-color: rgba(241, 202, 130, 0.72);
  box-shadow:
    0 22px 66px rgba(0, 0, 0, 0.58),
    0 0 0 1px rgba(241, 202, 130, 0.28),
    0 0 28px rgba(197, 154, 90, 0.16),
    0 2px 1px rgba(255, 255, 255, 0.12) inset;
}

.hg-predict-market-page .pm-card-head {
  align-items: center;
}

.hg-predict-market-page .pm-card-head h2 {
  color: rgba(232, 219, 187, 0.92);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.28;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.74);
  overflow-wrap: anywhere;
}

.hg-predict-market-page .pm-card-head__brand {
  gap: 10px;
}

.hg-predict-market-page .pm-card-head__brand .pm-market-icon,
.hg-predict-market-page .pm-card-head__brand .pm-crypto-icon--md,
.hg-predict-market-page .pm-card-head__brand .pm-wc-trophy-icon--md,
.hg-predict-market-page .pm-card-head__brand .pm-match-split-flag--md {
  width: 34px;
  height: 34px;
  border-radius: 7px;
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.34),
    0 1px 0 rgba(255, 255, 255, 0.32) inset;
}

.hg-predict-market-page .pm-card-head .pm-team-flag--xs {
  width: 24px;
  height: 18px;
  border-radius: 4px;
}

.hg-predict-market-page .pm-card-spark {
  width: 28px;
  height: 28px;
  border: 1px solid rgba(241, 202, 130, 0.2);
  background: rgba(23, 20, 14, 0.28);
  color: rgba(241, 202, 130, 0.74);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08) inset;
}

.hg-predict-market-page .pm-card-outcomes {
  gap: 6px;
}

.hg-predict-market-page .pm-card-outcome-row {
  min-height: 38px;
  padding: 3px 5px 3px 0;
  border: 1px solid transparent;
  border-radius: 7px;
  color: rgba(226, 218, 198, 0.9);
  transition:
    background-color 140ms ease,
    border-color 140ms ease,
    transform 140ms ease;
}

.hg-predict-market-page .pm-card-outcome-row:hover,
.hg-predict-market-page .pm-card-outcome-row:focus-visible {
  border-color: rgba(241, 202, 130, 0.26);
  background:
    linear-gradient(90deg, rgba(197, 154, 90, 0.28), rgba(197, 154, 90, 0.08) 58%, transparent);
  outline: none;
}

.hg-predict-market-page .pm-card-outcome-row__label,
.hg-predict-market-page .pm-outcome-row__label {
  color: rgba(226, 218, 198, 0.94);
  font-size: 13px;
  font-weight: 560;
}

.hg-predict-market-page .pm-card-outcome-row__pct {
  min-width: 46px;
  min-height: 36px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(241, 202, 130, 0.38);
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(46, 43, 33, 0.54), rgba(10, 12, 13, 0.6));
  color: rgba(239, 220, 177, 0.9);
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.34),
    0 1px 0 rgba(255, 255, 255, 0.14) inset;
}

.hg-predict-market-page .pm-card-binary-sides {
  gap: 8px;
}

.hg-predict-market-page .pm-card-binary-side,
.hg-predict-market-page .pm-card-side,
.hg-predict-market-page .pm-outcome-row,
.hg-predict-market-page .pm-outcome-nav__chip,
.hg-predict-market-page .pm-collection-toggle {
  border: 1px solid rgba(225, 237, 237, 0.12);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.085), rgba(0, 0, 0, 0.16)),
    rgba(10, 14, 15, 0.45);
  color: rgba(232, 224, 204, 0.9);
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.24),
    0 1px 0 rgba(255, 255, 255, 0.1) inset;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  transition:
    transform 140ms ease,
    border-color 140ms ease,
    background-color 140ms ease;
}

.hg-predict-market-page .pm-card-binary-side {
  min-height: 64px;
}

.hg-predict-market-page .pm-card-binary-side--up,
.hg-predict-market-page .pm-card-side--yes {
  border-color: rgba(102, 209, 162, 0.38);
  background:
    linear-gradient(180deg, rgba(102, 209, 162, 0.12), rgba(4, 16, 13, 0.24)),
    rgba(10, 14, 15, 0.42);
  color: rgba(139, 239, 193, 0.94);
}

.hg-predict-market-page .pm-card-binary-side--down,
.hg-predict-market-page .pm-card-side--no {
  border-color: rgba(236, 115, 95, 0.36);
  background:
    linear-gradient(180deg, rgba(236, 115, 95, 0.11), rgba(20, 6, 6, 0.22)),
    rgba(10, 14, 15, 0.42);
  color: rgba(255, 156, 137, 0.94);
}

.hg-predict-market-page .pm-card-binary-side:hover,
.hg-predict-market-page .pm-card-side:hover,
.hg-predict-market-page .pm-outcome-row:hover,
.hg-predict-market-page .pm-outcome-nav__chip:hover,
.hg-predict-market-page .pm-collection-toggle:hover {
  transform: translateY(-1px);
  border-color: rgba(241, 202, 130, 0.42);
  background:
    linear-gradient(180deg, rgba(241, 202, 130, 0.12), rgba(0, 0, 0, 0.12)),
    rgba(16, 20, 20, 0.55);
}

.hg-predict-market-page .pm-card-binary-side__payout,
.hg-predict-market-page .pm-card-side em,
.hg-predict-market-page .pm-card-side .pm-side-meta {
  color: rgba(205, 197, 176, 0.66);
}

.hg-predict-market-page .pm-card-binary-side.is-unavailable,
.hg-predict-market-page .pm-card-outcome-row.is-unavailable,
.hg-predict-market-page .pm-card-side:disabled {
  opacity: 0.52;
  filter: saturate(0.65);
}

.hg-predict-market-page .pm-market-footer {
  color: rgba(168, 176, 166, 0.66);
  font-size: 12px;
}

.hg-predict-market-page .pm-live-dot {
  color: rgba(102, 209, 162, 0.9);
}

.hg-predict-market-page .pm-market-volume,
.hg-predict-market-page .pm-market-deadline {
  color: rgba(205, 197, 176, 0.58);
}

.hg-predict-market-page .pm-detail-view {
  padding-bottom: calc(142px + env(safe-area-inset-bottom));
}

.hg-predict-market-page .pm-detail-header {
  padding: 8px 4px 18px;
}

.hg-predict-market-page .pm-detail-title-block h1,
.hg-predict-market-page .pm-panel-head h2,
.hg-predict-market-page .pm-ticket-market-heading strong {
  color: rgba(240, 231, 207, 0.96);
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.6);
}

.hg-predict-market-page .pm-back-button {
  color: rgba(215, 205, 181, 0.72);
}

.hg-predict-market-page .pm-back-button {
  border: 1px solid rgba(237, 213, 167, 0.18);
  background:
    linear-gradient(180deg, rgba(33, 31, 25, 0.62), rgba(10, 13, 15, 0.56));
}

.hg-predict-market-page .pm-chart-grid {
  stroke: rgba(215, 226, 226, 0.1);
}

.hg-predict-market-page .pm-chart-label,
.hg-predict-market-page .pm-detail-meta,
.hg-predict-market-page .pm-detail-title-meta,
.hg-predict-market-page .pm-detail-stats span,
.hg-predict-market-page .pm-book-head,
.hg-predict-market-page .pm-order-field span,
.hg-predict-market-page .pm-ticket-tabs button,
.hg-predict-market-page .pm-panel-tabs button {
  color: rgba(205, 197, 176, 0.62);
}

.hg-predict-market-page .pm-detail-stats strong,
.hg-predict-market-page .pm-outcomes-list .pm-outcome-row__pct,
.hg-predict-market-page .pm-book-row,
.hg-predict-market-page .pm-book-mid {
  color: rgba(242, 232, 207, 0.96);
}

.hg-predict-market-page .pm-book-mid,
.hg-predict-market-page .pm-ticket-balance,
.hg-predict-market-page .pm-order-field--amount,
.hg-predict-market-page .pm-return-box {
  border-color: rgba(237, 213, 167, 0.14);
  background:
    linear-gradient(180deg, rgba(7, 11, 12, 0.72), rgba(4, 7, 8, 0.78));
}

.hg-predict-market-page .pm-order-field--amount input {
  color: rgba(236, 227, 203, 0.78);
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.48);
}

.hg-predict-market-page .pm-sign-button,
.hg-predict-market-page .pm-primary-button,
.hg-predict-market-page .pm-wallet-setup-button,
.hg-predict-market-page .pm-ghost-button,
.hg-predict-market-page .pm-quick-amounts button,
.hg-predict-market-page .pm-ticket-tabs button,
.hg-predict-market-page .pm-order-type-toggle button {
  border-radius: 8px;
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.28),
    0 1px 0 rgba(255, 255, 255, 0.12) inset;
}

.hg-predict-market-page .pm-glass-dock {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(8px + env(safe-area-inset-bottom));
  z-index: 20;
  min-height: 76px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 254px);
  gap: 16px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid rgba(241, 202, 130, 0.44);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(27, 30, 29, 0.82), rgba(7, 10, 11, 0.84)),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.032) 0 1px, transparent 1px 46px);
  box-shadow:
    0 -18px 44px rgba(0, 0, 0, 0.46),
    0 18px 64px rgba(0, 0, 0, 0.54),
    0 1px 0 rgba(255, 255, 255, 0.16) inset,
    0 0 0 1px rgba(255, 255, 255, 0.04) inset;
  backdrop-filter: blur(24px) saturate(125%);
  -webkit-backdrop-filter: blur(24px) saturate(125%);
}

.hg-predict-market-page .pm-glass-dock::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 2px;
  border-radius: 8px 8px 0 0;
  background: linear-gradient(90deg, transparent, rgba(248, 226, 176, 0.88), transparent);
  box-shadow: 0 0 22px rgba(241, 202, 130, 0.38);
  pointer-events: none;
}

.hg-predict-market-page .pm-dock-tabs {
  display: grid;
  grid-template-columns: repeat(5, minmax(62px, 1fr));
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.hg-predict-market-page .pm-dock-button {
  min-width: 0;
  min-height: 54px;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 5px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: rgba(221, 211, 187, 0.72);
  font: inherit;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
  transition:
    transform 140ms ease,
    color 140ms ease,
    background-color 140ms ease,
    border-color 140ms ease;
}

.hg-predict-market-page .pm-dock-button:hover,
.hg-predict-market-page .pm-dock-button:focus-visible,
.hg-predict-market-page .pm-dock-button.is-active {
  border-color: rgba(241, 202, 130, 0.22);
  background:
    linear-gradient(180deg, rgba(241, 202, 130, 0.12), rgba(255, 255, 255, 0.02));
  color: rgba(246, 219, 161, 0.98);
  outline: none;
}

.hg-predict-market-page .pm-dock-glyph {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(241, 202, 130, 0.36);
  border-radius: 999px;
  color: rgba(245, 220, 164, 0.9);
  font-family: var(--font-mono, "IBM Plex Mono", monospace);
  font-size: 11px;
  line-height: 1;
  box-shadow:
    0 6px 16px rgba(0, 0, 0, 0.32),
    0 1px 0 rgba(255, 255, 255, 0.13) inset;
}

@keyframes pm-surface-sheen {
  from {
    transform: translate3d(-9%, 0, 0);
    opacity: 0.55;
  }
  to {
    transform: translate3d(4%, 0, 0);
    opacity: 0.78;
  }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .hg-predict-market-page .pm-market-card,
  .hg-predict-market-page .pm-chart-panel,
  .hg-predict-market-page .pm-book-panel,
  .hg-predict-market-page .pm-outcomes-panel,
  .hg-predict-market-page .pm-ticket-panel,
  .hg-predict-market-page .pm-glass-dock {
    background: rgba(16, 21, 23, 0.94);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hg-predict-market-page .pm-root::after {
    animation: none;
    transform: none;
  }

  .hg-predict-market-page .pm-market-card,
  .hg-predict-market-page .pm-card-binary-side,
  .hg-predict-market-page .pm-card-outcome-row,
  .hg-predict-market-page .pm-dock-button {
    transition: none;
  }

}

@media (max-width: 1180px) {
  .hg-predict-market-page .pm-market-grid {
    grid-template-columns: repeat(2, minmax(300px, 1fr));
  }
}

@media (max-width: 760px) {
  .hg-predict-market-page .pm-root {
    padding-bottom: calc(158px + env(safe-area-inset-bottom));
  }

  .hg-predict-market-page .pm-app-topbar {
    min-height: 50px;
    padding: 0 12px;
  }

  .hg-predict-market-page .pm-category-tabs {
    min-height: 50px;
    gap: 16px;
    padding: 0 12px;
  }

  .hg-predict-market-page .pm-list-view,
  .hg-predict-market-page .pm-detail-view {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: calc(174px + env(safe-area-inset-bottom));
  }

  .hg-predict-market-page .pm-market-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .hg-predict-market-page .pm-market-card {
    min-height: 0;
  }

  .hg-predict-market-page .pm-glass-dock {
    grid-template-columns: 1fr;
    gap: 8px;
    min-height: 124px;
    padding: 8px;
  }

  .hg-predict-market-page .pm-dock-tabs {
    grid-template-columns: repeat(5, minmax(52px, 1fr));
    gap: 4px;
  }

  .hg-predict-market-page .pm-dock-button {
    min-height: 48px;
    font-size: 11px;
  }

  .hg-predict-market-page .pm-dock-glyph {
    width: 21px;
    height: 21px;
    font-size: 10px;
  }

}

@media (max-width: 430px) {
  .hg-predict-market-page .pm-dock-button span:last-child {
    display: none;
  }

  .hg-predict-market-page .pm-dock-button {
    min-height: 42px;
  }
}

/* Stable polished-metal pass using the approved full-bleed background asset. */
.hg-predict-market-page .pm-root {
  background:
    linear-gradient(180deg, rgba(3, 8, 10, 0.42), rgba(4, 10, 12, 0.3) 48%, rgba(2, 7, 9, 0.54)),
    url("/assets/markets-brushed-metal-bg-v2.png") center center / cover fixed no-repeat,
    #071012;
}

.hg-predict-market-page .pm-root::before {
  background:
    radial-gradient(ellipse 92% 76% at 50% 48%, transparent 28%, rgba(1, 5, 7, 0.28) 74%, rgba(0, 3, 5, 0.52) 100%),
    repeating-linear-gradient(96deg, rgba(228, 239, 241, 0.012) 0 1px, transparent 1px 13px);
  mix-blend-mode: normal;
  opacity: 1;
}

.hg-predict-market-page .pm-root::after {
  animation: none;
  transform: none;
  background:
    linear-gradient(111deg, transparent 0 24%, rgba(234, 244, 245, 0.035) 36%, transparent 52%),
    linear-gradient(180deg, rgba(2, 7, 9, 0.08), rgba(1, 5, 7, 0.3));
  opacity: 0.58;
}

.hg-predict-market-page .pm-app-topbar {
  min-height: 64px;
  padding: 0 24px;
}

.hg-predict-market-page .pm-brand {
  min-height: 64px;
  gap: 10px;
}

.hg-predict-market-page .pm-brand-logo {
  width: 30px;
  height: 30px;
}

.hg-predict-market-page .pm-brand-name {
  font-size: 18px;
  font-weight: 650;
}

.hg-predict-market-page .pm-top-signin,
.hg-predict-market-page .pm-top-deposit {
  min-width: 104px;
  min-height: 36px;
  font-size: 13px;
}

.hg-predict-market-page .pm-category-tabs {
  min-height: 60px;
  padding: 0 26px;
  gap: 28px;
}

.hg-predict-market-page .pm-category-tabs .pm-category-chip {
  min-height: 48px;
  font-size: 15px;
}

.hg-predict-market-page .pm-market-card,
.hg-predict-market-page .pm-chart-panel,
.hg-predict-market-page .pm-book-panel,
.hg-predict-market-page .pm-outcomes-panel,
.hg-predict-market-page .pm-ticket-panel,
.hg-predict-market-page .pm-detail-bottom,
.hg-predict-market-page .pm-order-info,
.hg-predict-market-page .pm-signing-panel,
.hg-predict-market-page .pm-builder-panel {
  border-color: rgba(205, 221, 225, 0.48);
  background:
    linear-gradient(162deg, rgba(222, 234, 237, 0.24) 0%, rgba(170, 190, 196, 0.1) 19%, rgba(50, 69, 75, 0.1) 38%, rgba(8, 16, 19, 0.5) 72%, rgba(3, 9, 11, 0.6) 100%),
    radial-gradient(ellipse 82% 38% at 38% 18%, rgba(229, 239, 241, 0.12), transparent 72%),
    repeating-linear-gradient(97deg, rgba(236, 245, 246, 0.018) 0 1px, transparent 1px 9px),
    rgba(12, 22, 26, 0.5);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.34),
    0 1px 0 rgba(247, 252, 252, 0.78) inset,
    1px 0 0 rgba(220, 233, 236, 0.2) inset,
    -1px 0 0 rgba(0, 0, 0, 0.3) inset,
    0 -1px 0 rgba(0, 0, 0, 0.54) inset,
    0 0 26px rgba(177, 205, 211, 0.07);
  backdrop-filter: blur(13px) brightness(0.82) saturate(82%);
  -webkit-backdrop-filter: blur(13px) brightness(0.82) saturate(82%);
}

.hg-predict-market-page .pm-market-card::before,
.hg-predict-market-page .pm-chart-panel::before,
.hg-predict-market-page .pm-book-panel::before,
.hg-predict-market-page .pm-outcomes-panel::before,
.hg-predict-market-page .pm-ticket-panel::before,
.hg-predict-market-page .pm-detail-bottom::before {
  background:
    linear-gradient(180deg, rgba(250, 253, 253, 0.82) 0, rgba(221, 237, 240, 0.34) 2px, transparent 9px),
    linear-gradient(110deg, transparent 5%, rgba(237, 246, 247, 0.18) 27%, rgba(237, 246, 247, 0.035) 47%, transparent 67%),
    repeating-linear-gradient(98deg, rgba(238, 246, 247, 0.014) 0 1px, transparent 1px 8px);
  opacity: 0.88;
}

.hg-predict-market-page .pm-market-card::after {
  top: 24%;
  height: 55%;
  background:
    radial-gradient(ellipse at 43% 0%, rgba(218, 232, 235, 0.18), rgba(119, 145, 153, 0.065) 42%, transparent 71%);
  opacity: 0.9;
}

.hg-predict-market-page .pm-market-card:hover,
.hg-predict-market-page .pm-market-card:focus-visible {
  border-color: rgba(231, 241, 243, 0.68);
  box-shadow:
    0 20px 50px rgba(0, 0, 0, 0.42),
    0 1px 0 rgba(255, 255, 255, 0.92) inset,
    1px 0 0 rgba(232, 242, 244, 0.28) inset,
    0 -1px 0 rgba(0, 0, 0, 0.6) inset,
    0 0 32px rgba(184, 211, 217, 0.12);
}

.hg-predict-market-page .pm-card-outcome-row.is-unavailable,
.hg-predict-market-page .pm-card-binary-side.is-unavailable,
.hg-predict-market-page .pm-card-side:disabled {
  opacity: 1;
  filter: none;
}

@media (max-width: 760px) {
  .hg-predict-market-page .pm-root {
    background-attachment: scroll;
  }
}

/* Reference fidelity pass: cool machined glass with device-specific navigation. */
body.hg-markets.hg-predict-market-page {
  --pm-glass-line: rgba(190, 207, 212, 0.34);
  --pm-glass-line-soft: rgba(190, 207, 212, 0.14);
  --pm-glass-top: rgba(202, 218, 223, 0.2);
  --pm-glass-bottom: rgba(11, 18, 21, 0.16);
  --pm-gold: #a98b59;
  --pm-gold-bright: #d5b978;
  --pm-touch-shadow:
    0 14px 38px rgba(0, 0, 0, 0.3),
    0 1px 0 rgba(238, 247, 248, 0.5) inset,
    0 -1px 0 rgba(0, 0, 0, 0.48) inset,
    0 0 18px rgba(171, 195, 202, 0.05);
  color: rgba(208, 202, 184, 0.84);
  background: #071012;
  color-scheme: dark;
}

.hg-predict-market-page .pm-root {
  padding-bottom: 0;
  background:
    radial-gradient(ellipse 46% 52% at 50% 47%, rgba(55, 75, 82, 0.2) 0%, rgba(20, 31, 35, 0.08) 54%, transparent 76%),
    linear-gradient(180deg, rgba(8, 14, 16, 0.9), rgba(10, 18, 21, 0.68) 49%, rgba(5, 10, 12, 0.94)),
    #071012;
}

.hg-predict-market-page .pm-root::before {
  background:
    radial-gradient(circle at 50% 48%, transparent 0 9%, rgba(192, 211, 216, 0.035) 9.2% 9.35%, transparent 9.55% 16%, rgba(192, 211, 216, 0.028) 16.2% 16.35%, transparent 16.55% 28%, rgba(192, 211, 216, 0.022) 28.2% 28.35%, transparent 28.55%),
    repeating-conic-gradient(from 2deg at 50% 48%, rgba(204, 222, 225, 0.028) 0deg 0.7deg, transparent 0.7deg 2.8deg),
    repeating-linear-gradient(98deg, rgba(218, 231, 233, 0.016) 0 1px, transparent 1px 12px);
  mix-blend-mode: screen;
  opacity: 0.72;
}

.hg-predict-market-page .pm-root::after {
  background:
    linear-gradient(111deg, transparent 0 18%, rgba(222, 235, 237, 0.055) 31%, rgba(222, 235, 237, 0.015) 43%, transparent 59%),
    radial-gradient(ellipse 36% 12% at 50% 48%, rgba(220, 234, 236, 0.08), transparent 72%),
    linear-gradient(180deg, transparent 52%, rgba(1, 5, 6, 0.4));
  opacity: 0.64;
}

.hg-predict-market-page .pm-app-topbar {
  min-height: 44px;
  border-bottom-color: rgba(151, 172, 177, 0.15);
  background:
    linear-gradient(180deg, rgba(8, 14, 16, 0.96), rgba(7, 12, 14, 0.88)),
    repeating-linear-gradient(90deg, rgba(221, 234, 236, 0.016) 0 1px, transparent 1px 54px);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
}

.hg-predict-market-page .pm-brand {
  min-height: 44px;
  gap: 8px;
}

.hg-predict-market-page .pm-brand-logo {
  width: 22px;
  height: 22px;
  object-fit: contain;
  filter: none;
  opacity: 1;
}

.hg-predict-market-page .pm-brand-name {
  color: rgba(188, 194, 190, 0.82);
  font-size: 13px;
  font-weight: 650;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.58);
}

.hg-predict-market-page .pm-category-tabs {
  min-height: 58px;
  border-bottom-color: rgba(157, 178, 183, 0.16);
  background:
    linear-gradient(180deg, rgba(11, 17, 19, 0.92), rgba(8, 14, 16, 0.76)),
    repeating-linear-gradient(90deg, rgba(214, 228, 231, 0.014) 0 1px, transparent 1px 70px);
}

.hg-predict-market-page .pm-category-tabs .pm-category-chip {
  color: rgba(184, 179, 158, 0.57);
  font-size: 13px;
  font-weight: 560;
}

.hg-predict-market-page .pm-category-tabs .pm-category-chip.is-active {
  color: rgba(220, 202, 158, 0.94);
}

.hg-predict-market-page .pm-list-view {
  padding-bottom: 28px;
}

.hg-predict-market-page .pm-market-card,
.hg-predict-market-page .pm-chart-panel,
.hg-predict-market-page .pm-book-panel,
.hg-predict-market-page .pm-outcomes-panel,
.hg-predict-market-page .pm-ticket-panel,
.hg-predict-market-page .pm-detail-bottom,
.hg-predict-market-page .pm-order-info,
.hg-predict-market-page .pm-signing-panel,
.hg-predict-market-page .pm-builder-panel {
  border-color: var(--pm-glass-line);
  background:
    linear-gradient(162deg, rgba(201, 216, 221, 0.18) 0%, rgba(126, 147, 154, 0.075) 21%, rgba(17, 28, 32, 0.5) 56%, rgba(5, 11, 13, 0.62) 100%),
    repeating-linear-gradient(96deg, rgba(226, 238, 240, 0.018) 0 1px, transparent 1px 11px),
    rgba(14, 23, 27, 0.52);
  box-shadow: var(--pm-touch-shadow);
  backdrop-filter: blur(18px) saturate(108%);
  -webkit-backdrop-filter: blur(18px) saturate(108%);
}

.hg-predict-market-page .pm-market-card::before,
.hg-predict-market-page .pm-chart-panel::before,
.hg-predict-market-page .pm-book-panel::before,
.hg-predict-market-page .pm-outcomes-panel::before,
.hg-predict-market-page .pm-ticket-panel::before,
.hg-predict-market-page .pm-detail-bottom::before {
  background:
    linear-gradient(180deg, rgba(240, 248, 249, 0.58) 0, rgba(211, 229, 233, 0.2) 2px, transparent 8px),
    linear-gradient(112deg, transparent 7%, rgba(226, 238, 240, 0.13) 25%, rgba(226, 238, 240, 0.028) 44%, transparent 65%),
    repeating-linear-gradient(98deg, rgba(230, 241, 242, 0.016) 0 1px, transparent 1px 8px);
  opacity: 0.72;
}

.hg-predict-market-page .pm-market-card::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: -12%;
  right: -12%;
  top: 27%;
  height: 48%;
  border-radius: 50%;
  background: radial-gradient(ellipse at 44% 0%, rgba(203, 219, 224, 0.13), rgba(93, 117, 125, 0.045) 42%, transparent 70%);
  transform: rotate(-5deg);
  pointer-events: none;
}

.hg-predict-market-page .pm-market-card {
  border-radius: 7px;
  color: rgba(211, 205, 186, 0.8);
}

.hg-predict-market-page .pm-market-card:hover,
.hg-predict-market-page .pm-market-card:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(208, 222, 225, 0.54);
  box-shadow:
    0 18px 46px rgba(0, 0, 0, 0.4),
    0 1px 0 rgba(247, 252, 252, 0.64) inset,
    0 -1px 0 rgba(0, 0, 0, 0.58) inset,
    0 0 24px rgba(169, 193, 199, 0.08);
}

.hg-predict-market-page .pm-card-head h2 {
  color: rgba(220, 211, 186, 0.88);
  font-size: 13px;
  font-weight: 560;
}

.hg-predict-market-page .pm-card-outcome-row__label,
.hg-predict-market-page .pm-outcome-row__label {
  color: rgba(210, 205, 186, 0.82);
  font-size: 12px;
  font-weight: 500;
}

.hg-predict-market-page .pm-card-outcome-row__pct {
  min-width: 44px;
  min-height: 34px;
  border-color: rgba(197, 178, 128, 0.46);
  background:
    linear-gradient(180deg, rgba(34, 39, 37, 0.4), rgba(7, 11, 12, 0.48));
  color: rgba(210, 198, 164, 0.78);
  box-shadow:
    0 5px 14px rgba(0, 0, 0, 0.26),
    0 1px 0 rgba(242, 245, 235, 0.08) inset;
}

.hg-predict-market-page .pm-glass-dock {
  display: none;
}

.hg-predict-market-page .pm-dock-icon {
  width: 100%;
  height: 100%;
  display: block;
}

@media (max-width: 760px) {
  .hg-predict-market-page .pm-app-topbar,
  .hg-predict-market-page .pm-category-tabs {
    display: none;
  }

  .hg-predict-market-page .pm-root {
    padding-bottom: calc(92px + env(safe-area-inset-bottom));
  }

  .hg-predict-market-page .pm-list-view,
  .hg-predict-market-page .pm-detail-view {
    padding-top: 10px;
    padding-bottom: calc(106px + env(safe-area-inset-bottom));
  }

  .hg-predict-market-page .pm-search-inline,
  .hg-predict-market-page .pm-refresh-inline {
    display: none;
  }

  .hg-predict-market-page .pm-chip-row {
    margin-bottom: 10px;
  }

  .hg-predict-market-page .pm-glass-dock {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 20;
    min-height: calc(78px + env(safe-area-inset-bottom));
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(86px, 28vw);
    gap: 6px;
    align-items: center;
    padding: 7px 8px calc(7px + env(safe-area-inset-bottom));
    border: 0;
    border-top: 1px solid rgba(205, 181, 120, 0.6);
    border-radius: 0;
    background:
      linear-gradient(180deg, rgba(17, 23, 24, 0.93), rgba(5, 9, 10, 0.96)),
      repeating-linear-gradient(90deg, rgba(235, 241, 239, 0.022) 0 1px, transparent 1px 42px);
    box-shadow:
      0 -14px 36px rgba(0, 0, 0, 0.46),
      0 1px 0 rgba(247, 232, 194, 0.18) inset;
    backdrop-filter: blur(24px) saturate(112%);
    -webkit-backdrop-filter: blur(24px) saturate(112%);
  }

  .hg-predict-market-page .pm-glass-dock::before {
    height: 1px;
    border-radius: 0;
    background: linear-gradient(90deg, transparent, rgba(230, 202, 137, 0.88) 32% 68%, transparent);
    box-shadow: 0 0 16px rgba(218, 188, 119, 0.24);
  }

  .hg-predict-market-page .pm-dock-tabs {
    grid-template-columns: repeat(5, minmax(38px, 1fr));
    gap: 1px;
  }

  .hg-predict-market-page .pm-dock-button {
    min-height: 56px;
    gap: 4px;
    padding: 3px 1px;
    border-radius: 6px;
    color: rgba(198, 188, 159, 0.7);
    font-size: 9px;
    font-weight: 540;
  }

  .hg-predict-market-page .pm-dock-button:hover,
  .hg-predict-market-page .pm-dock-button:focus-visible,
  .hg-predict-market-page .pm-dock-button.is-active {
    border-color: rgba(214, 185, 113, 0.18);
    background: linear-gradient(180deg, rgba(213, 183, 111, 0.1), transparent);
    color: rgba(226, 205, 151, 0.94);
  }

  .hg-predict-market-page .pm-dock-glyph {
    width: 22px;
    height: 22px;
    border: 0;
    border-radius: 0;
    color: rgba(218, 197, 143, 0.84);
    box-shadow: none;
  }

}

@media (max-width: 430px) {
  .hg-predict-market-page .pm-dock-button span:last-child {
    display: inline;
  }

  .hg-predict-market-page .pm-dock-button {
    min-height: 54px;
  }
}

/* Final cascade lock for the approved background and enlarged desktop chrome. */
body.hg-markets.hg-predict-market-page .pm-root {
  background:
    linear-gradient(180deg, rgba(3, 8, 10, 0.42), rgba(4, 10, 12, 0.3) 48%, rgba(2, 7, 9, 0.54)),
    url("/assets/markets-brushed-metal-bg-v2.png") center center / cover fixed no-repeat,
    #071012;
}

body.hg-markets.hg-predict-market-page .pm-root::before {
  background:
    radial-gradient(ellipse 92% 76% at 50% 48%, transparent 28%, rgba(1, 5, 7, 0.28) 74%, rgba(0, 3, 5, 0.52) 100%),
    repeating-linear-gradient(96deg, rgba(228, 239, 241, 0.012) 0 1px, transparent 1px 13px);
  mix-blend-mode: normal;
  opacity: 1;
}

body.hg-markets.hg-predict-market-page .pm-root::after {
  animation: none;
  transform: none;
  background:
    linear-gradient(111deg, transparent 0 24%, rgba(234, 244, 245, 0.035) 36%, transparent 52%),
    linear-gradient(180deg, rgba(2, 7, 9, 0.08), rgba(1, 5, 7, 0.3));
  opacity: 0.58;
}

body.hg-markets.hg-predict-market-page .pm-app-topbar,
body.hg-markets.hg-predict-market-page .pm-brand {
  min-height: 64px;
}

body.hg-markets.hg-predict-market-page .pm-app-topbar {
  padding: 0 24px;
}

body.hg-markets.hg-predict-market-page .pm-brand {
  gap: 10px;
}

body.hg-markets.hg-predict-market-page .pm-brand-logo {
  width: 42px;
  height: 42px;
  filter:
    invert(1)
    brightness(1.35)
    contrast(1.15)
    drop-shadow(0 0 7px rgba(255, 255, 255, 0.28));
  opacity: 1;
}

body.hg-markets.hg-predict-market-page .pm-brand-name {
  font-size: 18px;
  font-weight: 650;
}

body.hg-markets.hg-predict-market-page .pm-category-tabs {
  min-height: 60px;
  padding: 0 26px;
  gap: 28px;
}

body.hg-markets.hg-predict-market-page .pm-category-tabs .pm-category-chip {
  min-height: 48px;
  font-size: 15px;
}

body.hg-markets.hg-predict-market-page .pm-market-card,
body.hg-markets.hg-predict-market-page .pm-chart-panel,
body.hg-markets.hg-predict-market-page .pm-book-panel,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel,
body.hg-markets.hg-predict-market-page .pm-ticket-panel,
body.hg-markets.hg-predict-market-page .pm-detail-bottom,
body.hg-markets.hg-predict-market-page .pm-order-info,
body.hg-markets.hg-predict-market-page .pm-signing-panel,
body.hg-markets.hg-predict-market-page .pm-builder-panel {
  border-color: rgba(205, 221, 225, 0.48);
  background:
    linear-gradient(162deg, rgba(222, 234, 237, 0.24) 0%, rgba(170, 190, 196, 0.1) 19%, rgba(50, 69, 75, 0.1) 38%, rgba(8, 16, 19, 0.5) 72%, rgba(3, 9, 11, 0.6) 100%),
    radial-gradient(ellipse 82% 38% at 38% 18%, rgba(229, 239, 241, 0.12), transparent 72%),
    repeating-linear-gradient(97deg, rgba(236, 245, 246, 0.018) 0 1px, transparent 1px 9px),
    rgba(12, 22, 26, 0.5);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.34),
    0 1px 0 rgba(247, 252, 252, 0.78) inset,
    1px 0 0 rgba(220, 233, 236, 0.2) inset,
    -1px 0 0 rgba(0, 0, 0, 0.3) inset,
    0 -1px 0 rgba(0, 0, 0, 0.54) inset,
    0 0 26px rgba(177, 205, 211, 0.07);
  backdrop-filter: blur(13px) brightness(0.82) saturate(82%);
  -webkit-backdrop-filter: blur(13px) brightness(0.82) saturate(82%);
}

body.hg-markets.hg-predict-market-page .pm-market-card::before,
body.hg-markets.hg-predict-market-page .pm-chart-panel::before,
body.hg-markets.hg-predict-market-page .pm-book-panel::before,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel::before,
body.hg-markets.hg-predict-market-page .pm-ticket-panel::before,
body.hg-markets.hg-predict-market-page .pm-detail-bottom::before {
  background:
    linear-gradient(180deg, rgba(250, 253, 253, 0.82) 0, rgba(221, 237, 240, 0.34) 2px, transparent 9px),
    linear-gradient(110deg, transparent 5%, rgba(237, 246, 247, 0.18) 27%, rgba(237, 246, 247, 0.035) 47%, transparent 67%),
    repeating-linear-gradient(98deg, rgba(238, 246, 247, 0.014) 0 1px, transparent 1px 8px);
  opacity: 0.88;
}

body.hg-markets.hg-predict-market-page .pm-market-card::after {
  top: 24%;
  height: 55%;
  background: radial-gradient(ellipse at 43% 0%, rgba(218, 232, 235, 0.18), rgba(119, 145, 153, 0.065) 42%, transparent 71%);
  opacity: 0.9;
}

body.hg-markets.hg-predict-market-page .pm-card-outcome-row.is-unavailable,
body.hg-markets.hg-predict-market-page .pm-card-binary-side.is-unavailable,
body.hg-markets.hg-predict-market-page .pm-card-side:disabled {
  opacity: 1;
  filter: none;
}

@media (max-width: 760px) {
  body.hg-markets.hg-predict-market-page .pm-root {
    background-attachment: scroll;
  }
}

/* Optical glass edge: illuminated cross-section, refraction, and corner bloom. */
body.hg-markets.hg-predict-market-page .pm-market-card,
body.hg-markets.hg-predict-market-page .pm-chart-panel,
body.hg-markets.hg-predict-market-page .pm-book-panel,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel,
body.hg-markets.hg-predict-market-page .pm-ticket-panel,
body.hg-markets.hg-predict-market-page .pm-detail-bottom {
  isolation: isolate;
  border: 1px solid rgba(193, 211, 216, 0.5);
  box-shadow:
    0 20px 50px rgba(0, 0, 0, 0.34),
    0 -1px 22px rgba(202, 225, 231, 0.08),
    0 1px 0 rgba(255, 255, 255, 0.88) inset,
    0 2px 0 rgba(205, 226, 231, 0.2) inset,
    1px 0 0 rgba(225, 239, 242, 0.25) inset,
    -1px 0 0 rgba(132, 154, 160, 0.18) inset,
    0 -1px 0 rgba(190, 213, 219, 0.34) inset,
    0 -3px 16px rgba(192, 219, 225, 0.08) inset;
}

body.hg-markets.hg-predict-market-page .pm-market-card::before,
body.hg-markets.hg-predict-market-page .pm-chart-panel::before,
body.hg-markets.hg-predict-market-page .pm-book-panel::before,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel::before,
body.hg-markets.hg-predict-market-page .pm-ticket-panel::before,
body.hg-markets.hg-predict-market-page .pm-detail-bottom::before {
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(ellipse 30px 9px at 11px 1px, rgba(255, 255, 255, 0.68) 0, rgba(218, 239, 244, 0.2) 38%, transparent 74%),
    radial-gradient(ellipse 30px 9px at calc(100% - 11px) 1px, rgba(250, 254, 255, 0.62) 0, rgba(208, 233, 239, 0.18) 38%, transparent 74%),
    radial-gradient(ellipse 26px 8px at 11px 100%, rgba(213, 236, 241, 0.32) 0, transparent 72%),
    radial-gradient(ellipse 26px 8px at calc(100% - 11px) 100%, rgba(221, 241, 245, 0.36) 0, transparent 72%),
    linear-gradient(90deg, rgba(211, 231, 235, 0.16), rgba(255, 255, 255, 0.94) 18%, rgba(238, 249, 251, 0.68) 54%, rgba(203, 226, 232, 0.2)) left 8px top / calc(100% - 16px) 2px no-repeat,
    linear-gradient(90deg, rgba(169, 194, 201, 0.14), rgba(219, 240, 244, 0.7) 36%, rgba(247, 252, 253, 0.88) 68%, rgba(158, 185, 192, 0.12)) left 8px bottom / calc(100% - 16px) 2px no-repeat,
    linear-gradient(180deg, rgba(237, 248, 250, 0.66), rgba(181, 211, 218, 0.24) 24%, rgba(150, 180, 188, 0.12) 70%, rgba(218, 239, 243, 0.42)) left top 8px / 1px calc(100% - 16px) no-repeat,
    linear-gradient(180deg, rgba(230, 244, 247, 0.56), rgba(167, 198, 206, 0.2) 32%, rgba(137, 165, 173, 0.1) 72%, rgba(225, 242, 246, 0.44)) right top 8px / 1px calc(100% - 16px) no-repeat,
    linear-gradient(112deg, transparent 5%, rgba(244, 251, 252, 0.15) 28%, rgba(234, 246, 248, 0.03) 48%, transparent 68%),
    repeating-linear-gradient(98deg, rgba(238, 246, 247, 0.012) 0 1px, transparent 1px 8px);
  box-shadow:
    0 0 10px rgba(211, 235, 240, 0.1) inset,
    0 0 2px rgba(255, 255, 255, 0.5) inset;
  opacity: 1;
}

body.hg-markets.hg-predict-market-page .pm-market-card::after {
  left: -14%;
  right: -14%;
  top: 21%;
  height: 58%;
  border-radius: 50%;
  background:
    radial-gradient(ellipse at 43% 0%, rgba(230, 242, 245, 0.21), rgba(128, 157, 165, 0.07) 42%, transparent 72%);
  box-shadow: 0 -1px 0 rgba(225, 240, 244, 0.06) inset;
  opacity: 0.92;
}

body.hg-markets.hg-predict-market-page .pm-market-card {
  transition:
    transform 150ms ease,
    border-color 150ms ease,
    box-shadow 150ms ease;
}

body.hg-markets.hg-predict-market-page .pm-market-card:hover,
body.hg-markets.hg-predict-market-page .pm-market-card:focus-visible {
  border-color: rgba(231, 244, 247, 0.78);
  box-shadow:
    0 23px 58px rgba(0, 0, 0, 0.42),
    0 -2px 28px rgba(213, 237, 242, 0.14),
    0 1px 0 rgba(255, 255, 255, 1) inset,
    0 2px 0 rgba(220, 239, 243, 0.3) inset,
    1px 0 0 rgba(236, 247, 249, 0.34) inset,
    -1px 0 0 rgba(182, 207, 213, 0.24) inset,
    0 -1px 0 rgba(226, 242, 246, 0.52) inset,
    0 0 30px rgba(198, 225, 231, 0.12);
}

body.hg-markets.hg-predict-market-page .pm-market-card:active {
  transform: translateY(1px);
  border-color: rgba(190, 214, 220, 0.62);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.34),
    0 1px 0 rgba(229, 243, 246, 0.48) inset,
    0 4px 18px rgba(0, 0, 0, 0.18) inset,
    0 -1px 0 rgba(211, 232, 237, 0.32) inset;
}

/* Reference match: condensed type over a darker, genuinely translucent glass face. */
body.hg-markets.hg-predict-market-page {
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  font-stretch: condensed;
  letter-spacing: 0;
}

body.hg-markets.hg-predict-market-page .pm-brand-name,
body.hg-markets.hg-predict-market-page .pm-category-chip,
body.hg-markets.hg-predict-market-page .pm-market-card,
body.hg-markets.hg-predict-market-page .pm-filter-chip,
body.hg-markets.hg-predict-market-page .pm-live-chip,
body.hg-markets.hg-predict-market-page .pm-refresh-inline,
body.hg-markets.hg-predict-market-page .pm-search-inline input,
body.hg-markets.hg-predict-market-page .pm-dock-button {
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  letter-spacing: 0;
}

body.hg-markets.hg-predict-market-page .pm-market-card,
body.hg-markets.hg-predict-market-page .pm-chart-panel,
body.hg-markets.hg-predict-market-page .pm-book-panel,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel,
body.hg-markets.hg-predict-market-page .pm-ticket-panel,
body.hg-markets.hg-predict-market-page .pm-detail-bottom {
  border-color: rgba(195, 212, 217, 0.38);
  background:
    linear-gradient(160deg, rgba(221, 234, 237, 0.15) 0%, rgba(166, 188, 194, 0.055) 21%, rgba(49, 69, 75, 0.04) 39%, rgba(7, 15, 18, 0.26) 70%, rgba(2, 8, 10, 0.34) 100%),
    radial-gradient(ellipse 88% 42% at 37% 16%, rgba(230, 241, 243, 0.085), transparent 73%),
    repeating-linear-gradient(97deg, rgba(235, 244, 246, 0.012) 0 1px, transparent 1px 10px),
    rgba(8, 17, 20, 0.24);
  background-blend-mode: screen, normal, normal, normal;
  box-shadow:
    0 16px 38px rgba(0, 0, 0, 0.27),
    0 -1px 18px rgba(205, 227, 232, 0.055),
    0 1px 0 rgba(248, 253, 253, 0.66) inset,
    0 2px 0 rgba(205, 226, 231, 0.12) inset,
    1px 0 0 rgba(224, 238, 241, 0.16) inset,
    -1px 0 0 rgba(126, 150, 157, 0.1) inset,
    0 -1px 0 rgba(201, 222, 227, 0.24) inset,
    0 -3px 13px rgba(188, 215, 221, 0.05) inset;
  backdrop-filter: blur(8px) brightness(0.72) saturate(72%);
  -webkit-backdrop-filter: blur(8px) brightness(0.72) saturate(72%);
}

body.hg-markets.hg-predict-market-page .pm-market-card::before,
body.hg-markets.hg-predict-market-page .pm-chart-panel::before,
body.hg-markets.hg-predict-market-page .pm-book-panel::before,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel::before,
body.hg-markets.hg-predict-market-page .pm-ticket-panel::before,
body.hg-markets.hg-predict-market-page .pm-detail-bottom::before {
  background:
    radial-gradient(ellipse 30px 8px at 11px 1px, rgba(255, 255, 255, 0.5) 0, rgba(218, 239, 244, 0.14) 40%, transparent 76%),
    radial-gradient(ellipse 30px 8px at calc(100% - 11px) 1px, rgba(250, 254, 255, 0.46) 0, rgba(208, 233, 239, 0.13) 40%, transparent 76%),
    radial-gradient(ellipse 27px 7px at 11px 100%, rgba(213, 236, 241, 0.24) 0, transparent 74%),
    radial-gradient(ellipse 27px 7px at calc(100% - 11px) 100%, rgba(221, 241, 245, 0.28) 0, transparent 74%),
    linear-gradient(90deg, rgba(201, 224, 229, 0.11), rgba(255, 255, 255, 0.78) 20%, rgba(237, 248, 250, 0.52) 56%, rgba(195, 220, 226, 0.12)) left 7px top / calc(100% - 14px) 1px no-repeat,
    linear-gradient(180deg, rgba(222, 239, 243, 0.2), transparent 100%) left top / 100% 7px no-repeat,
    linear-gradient(90deg, rgba(161, 188, 195, 0.09), rgba(217, 237, 241, 0.52) 38%, rgba(246, 252, 253, 0.68) 68%, rgba(151, 180, 187, 0.08)) left 7px bottom / calc(100% - 14px) 1px no-repeat,
    linear-gradient(180deg, rgba(231, 245, 248, 0.48), rgba(169, 202, 210, 0.14) 28%, rgba(134, 165, 173, 0.07) 72%, rgba(214, 236, 241, 0.3)) left top 7px / 1px calc(100% - 14px) no-repeat,
    linear-gradient(180deg, rgba(224, 241, 245, 0.4), rgba(155, 188, 197, 0.12) 32%, rgba(123, 153, 161, 0.06) 72%, rgba(218, 238, 243, 0.32)) right top 7px / 1px calc(100% - 14px) no-repeat,
    linear-gradient(112deg, transparent 5%, rgba(244, 251, 252, 0.1) 28%, rgba(234, 246, 248, 0.02) 48%, transparent 68%);
  box-shadow:
    0 0 8px rgba(211, 235, 240, 0.065) inset,
    0 0 1px rgba(255, 255, 255, 0.38) inset;
}

body.hg-markets.hg-predict-market-page .pm-market-card::after {
  top: 22%;
  height: 54%;
  background: radial-gradient(ellipse at 43% 0%, rgba(224, 238, 241, 0.13), rgba(118, 148, 156, 0.035) 43%, transparent 73%);
  box-shadow: none;
  opacity: 0.82;
}

body.hg-markets.hg-predict-market-page .pm-market-card {
  min-height: 0;
  padding: 11px 11px 10px;
  gap: 8px;
  color: rgba(205, 197, 174, 0.8);
}

body.hg-markets.hg-predict-market-page .pm-card-head__brand {
  gap: 8px;
}

body.hg-markets.hg-predict-market-page .pm-card-head h2 {
  color: rgba(213, 203, 177, 0.88);
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0;
  text-shadow: 0 1px 7px rgba(0, 0, 0, 0.66);
}

body.hg-markets.hg-predict-market-page .pm-card-spark {
  width: 24px;
  height: 24px;
}

body.hg-markets.hg-predict-market-page .pm-card-spark__icon {
  width: 12px;
  height: 12px;
}

body.hg-markets.hg-predict-market-page .pm-card-outcomes {
  gap: 3px;
}

body.hg-markets.hg-predict-market-page .pm-card-outcome-row {
  min-height: 36px;
  gap: 8px;
  padding: 1px 4px 1px 0;
  border-radius: 5px;
}

body.hg-markets.hg-predict-market-page .pm-card-outcome-row__label,
body.hg-markets.hg-predict-market-page .pm-outcome-row__label,
body.hg-markets.hg-predict-market-page .pm-card-side,
body.hg-markets.hg-predict-market-page .pm-card-binary-side {
  color: rgba(202, 194, 173, 0.74);
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
}

body.hg-markets.hg-predict-market-page .pm-card-outcome-row .pm-team-flag--md,
body.hg-markets.hg-predict-market-page .pm-card-outcome-row .pm-team-flag--draw {
  width: 34px;
  height: 34px;
  border-radius: 6px;
}

body.hg-markets.hg-predict-market-page .pm-card-outcome-row__pct {
  box-sizing: border-box;
  width: 44px;
  min-width: 44px;
  min-height: 34px;
  padding: 0 4px;
  color: rgba(206, 194, 161, 0.78);
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  box-shadow:
    0 5px 12px rgba(0, 0, 0, 0.22),
    0 1px 0 rgba(241, 246, 239, 0.07) inset;
}

body.hg-markets.hg-predict-market-page .pm-collection-toggle {
  min-height: 34px;
  color: rgba(205, 195, 169, 0.78);
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  font-size: 12px;
  font-weight: 400;
}

body.hg-markets.hg-predict-market-page .pm-market-footer {
  color: rgba(160, 173, 164, 0.62);
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
}

body.hg-markets.hg-predict-market-page .pm-market-volume,
body.hg-markets.hg-predict-market-page .pm-market-deadline {
  color: rgba(188, 181, 160, 0.52);
}

/* Raised glossy glass: final tactile surface pass. */
body.hg-markets.hg-predict-market-page .pm-market-card,
body.hg-markets.hg-predict-market-page .pm-chart-panel,
body.hg-markets.hg-predict-market-page .pm-book-panel,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel,
body.hg-markets.hg-predict-market-page .pm-ticket-panel,
body.hg-markets.hg-predict-market-page .pm-detail-bottom {
  border-color: rgba(218, 235, 239, 0.56);
  background:
    radial-gradient(ellipse 78% 26% at 38% 7%, rgba(250, 254, 255, 0.17), rgba(205, 226, 232, 0.055) 48%, transparent 76%),
    radial-gradient(ellipse 58% 78% at 50% 106%, rgba(190, 217, 224, 0.075), transparent 64%),
    linear-gradient(162deg, rgba(236, 247, 249, 0.18) 0%, rgba(173, 198, 205, 0.072) 22%, rgba(34, 53, 60, 0.038) 45%, rgba(5, 13, 16, 0.31) 77%, rgba(2, 7, 9, 0.39) 100%),
    repeating-linear-gradient(96deg, rgba(240, 248, 249, 0.015) 0 1px, transparent 1px 9px),
    rgba(7, 16, 19, 0.25);
  background-blend-mode: screen, screen, normal, normal, normal;
  box-shadow:
    0 25px 58px rgba(0, 0, 0, 0.36),
    0 9px 20px rgba(0, 0, 0, 0.18),
    0 -2px 24px rgba(215, 238, 243, 0.11),
    0 1px 0 rgba(255, 255, 255, 0.86) inset,
    0 2px 0 rgba(223, 242, 246, 0.24) inset,
    0 8px 20px rgba(255, 255, 255, 0.035) inset,
    1px 0 0 rgba(234, 247, 249, 0.25) inset,
    -1px 0 0 rgba(130, 158, 166, 0.15) inset,
    0 -1px 0 rgba(229, 244, 247, 0.34) inset,
    0 -6px 18px rgba(0, 0, 0, 0.17) inset;
  backdrop-filter: blur(9px) brightness(0.76) saturate(78%);
  -webkit-backdrop-filter: blur(9px) brightness(0.76) saturate(78%);
}

body.hg-markets.hg-predict-market-page .pm-market-card::before,
body.hg-markets.hg-predict-market-page .pm-chart-panel::before,
body.hg-markets.hg-predict-market-page .pm-book-panel::before,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel::before,
body.hg-markets.hg-predict-market-page .pm-ticket-panel::before,
body.hg-markets.hg-predict-market-page .pm-detail-bottom::before {
  background:
    radial-gradient(ellipse 42px 11px at 13px 1px, rgba(255, 255, 255, 0.72) 0, rgba(223, 241, 246, 0.22) 42%, transparent 77%),
    radial-gradient(ellipse 42px 11px at calc(100% - 13px) 1px, rgba(255, 255, 255, 0.66) 0, rgba(214, 236, 242, 0.19) 42%, transparent 77%),
    radial-gradient(ellipse 35px 10px at 13px 100%, rgba(220, 242, 247, 0.36) 0, transparent 74%),
    radial-gradient(ellipse 35px 10px at calc(100% - 13px) 100%, rgba(224, 243, 247, 0.4) 0, transparent 74%),
    linear-gradient(90deg, rgba(204, 229, 235, 0.14), rgba(255, 255, 255, 0.96) 18%, rgba(243, 252, 253, 0.66) 56%, rgba(203, 228, 234, 0.15)) left 8px top / calc(100% - 16px) 2px no-repeat,
    linear-gradient(180deg, rgba(238, 249, 251, 0.3), transparent 100%) left top / 100% 10px no-repeat,
    linear-gradient(90deg, rgba(161, 191, 199, 0.12), rgba(222, 242, 246, 0.62) 36%, rgba(251, 254, 255, 0.76) 70%, rgba(151, 181, 189, 0.1)) left 8px bottom / calc(100% - 16px) 1px no-repeat,
    linear-gradient(180deg, rgba(237, 249, 251, 0.58), rgba(178, 211, 219, 0.17) 28%, rgba(132, 164, 173, 0.08) 72%, rgba(222, 242, 247, 0.36)) left top 8px / 1px calc(100% - 16px) no-repeat,
    linear-gradient(180deg, rgba(231, 246, 249, 0.5), rgba(162, 196, 205, 0.14) 32%, rgba(124, 155, 164, 0.07) 72%, rgba(224, 242, 246, 0.38)) right top 8px / 1px calc(100% - 16px) no-repeat,
    linear-gradient(111deg, transparent 5%, rgba(255, 255, 255, 0.16) 29%, rgba(238, 249, 251, 0.032) 49%, transparent 69%);
  box-shadow:
    0 0 12px rgba(217, 239, 244, 0.1) inset,
    0 0 2px rgba(255, 255, 255, 0.58) inset;
  opacity: 1;
  pointer-events: none;
}

body.hg-markets.hg-predict-market-page .pm-market-card::after,
body.hg-markets.hg-predict-market-page .pm-chart-panel::after,
body.hg-markets.hg-predict-market-page .pm-book-panel::after,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel::after,
body.hg-markets.hg-predict-market-page .pm-ticket-panel::after,
body.hg-markets.hg-predict-market-page .pm-detail-bottom::after {
  content: "";
  position: absolute;
  left: -18%;
  right: -18%;
  top: 18%;
  height: 62%;
  border-radius: 50%;
  background:
    radial-gradient(ellipse at 43% 0%, rgba(236, 247, 249, 0.19), rgba(128, 158, 167, 0.052) 43%, transparent 72%),
    linear-gradient(107deg, transparent 0 23%, rgba(255, 255, 255, 0.07) 35%, transparent 54%);
  box-shadow: 0 -1px 0 rgba(230, 244, 247, 0.08) inset;
  opacity: 0.92;
  pointer-events: none;
  z-index: 0;
}

body.hg-markets.hg-predict-market-page .pm-market-card > *,
body.hg-markets.hg-predict-market-page .pm-chart-panel > *,
body.hg-markets.hg-predict-market-page .pm-book-panel > *,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel > *,
body.hg-markets.hg-predict-market-page .pm-ticket-panel > *,
body.hg-markets.hg-predict-market-page .pm-detail-bottom > * {
  position: relative;
  z-index: 1;
}

body.hg-markets.hg-predict-market-page .pm-market-card:hover,
body.hg-markets.hg-predict-market-page .pm-market-card:focus-visible {
  border-color: rgba(238, 249, 251, 0.78);
  transform: translateY(-1px);
  box-shadow:
    0 30px 68px rgba(0, 0, 0, 0.42),
    0 12px 26px rgba(0, 0, 0, 0.2),
    0 -2px 30px rgba(221, 242, 247, 0.16),
    0 1px 0 rgba(255, 255, 255, 0.98) inset,
    0 2px 0 rgba(232, 247, 250, 0.3) inset,
    0 9px 22px rgba(255, 255, 255, 0.045) inset,
    1px 0 0 rgba(242, 251, 252, 0.32) inset,
    -1px 0 0 rgba(166, 195, 203, 0.2) inset,
    0 -1px 0 rgba(238, 249, 251, 0.44) inset,
    0 -6px 18px rgba(0, 0, 0, 0.15) inset;
}

body.hg-markets.hg-predict-market-page .pm-market-card:active {
  transform: translateY(1px);
  box-shadow:
    0 12px 26px rgba(0, 0, 0, 0.38),
    0 1px 0 rgba(232, 246, 249, 0.58) inset,
    0 5px 19px rgba(0, 0, 0, 0.24) inset,
    0 -1px 0 rgba(219, 240, 245, 0.3) inset;
}

body.hg-markets.hg-predict-market-page .pm-card-outcomes--collapsed {
  gap: 2px;
}

body.hg-markets.hg-predict-market-page .pm-card-outcomes--collapsed .pm-collection-toggle {
  min-height: 24px;
  margin-top: 1px;
  padding: 0 8px;
  border-radius: 5px;
  border-color: rgba(218, 235, 239, 0.28);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(0, 0, 0, 0.12)),
    rgba(5, 11, 13, 0.36);
  color: rgba(205, 195, 169, 0.7);
  font-size: 11px;
  line-height: 1;
  box-shadow:
    0 5px 14px rgba(0, 0, 0, 0.2),
    0 1px 0 rgba(255, 255, 255, 0.08) inset;
}

/* Liquid Glass v2: darker smoked panel material with edge-only shine. */
body.hg-markets.hg-predict-market-page .pm-market-card,
body.hg-markets.hg-predict-market-page .pm-chart-panel,
body.hg-markets.hg-predict-market-page .pm-book-panel,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel,
body.hg-markets.hg-predict-market-page .pm-ticket-panel,
body.hg-markets.hg-predict-market-page .pm-detail-bottom {
  border-color: rgba(198, 184, 124, 0.22);
  background:
    radial-gradient(ellipse 52% 12% at 50% 0%, rgba(255, 248, 214, 0.105), rgba(215, 205, 152, 0.035) 44%, transparent 72%),
    radial-gradient(ellipse 16px 14px at 13px 10px, rgba(255, 246, 214, 0.12), transparent 76%),
    radial-gradient(ellipse 16px 14px at calc(100% - 13px) 10px, rgba(255, 246, 214, 0.11), transparent 76%),
    radial-gradient(ellipse 72% 78% at 50% 84%, rgba(0, 0, 0, 0.28), transparent 74%),
    linear-gradient(180deg, rgba(255, 246, 214, 0.036) 0%, rgba(33, 45, 45, 0.11) 24%, rgba(8, 17, 18, 0.36) 68%, rgba(2, 6, 8, 0.54) 100%),
    repeating-linear-gradient(96deg, rgba(228, 219, 172, 0.011) 0 1px, transparent 1px 11px),
    rgba(4, 10, 12, 0.47);
  background-blend-mode: screen, screen, screen, multiply, normal, normal, normal;
  box-shadow:
    0 24px 54px rgba(0, 0, 0, 0.46),
    0 8px 22px rgba(0, 0, 0, 0.26),
    0 -1px 12px rgba(205, 190, 128, 0.035),
    0 1px 0 rgba(255, 250, 226, 0.22) inset,
    0 0 0 1px rgba(192, 176, 112, 0.12) inset,
    1px 0 0 rgba(255, 246, 214, 0.052) inset,
    -1px 0 0 rgba(0, 0, 0, 0.32) inset,
    0 -1px 0 rgba(12, 18, 18, 0.8) inset,
    0 -7px 18px rgba(0, 0, 0, 0.42) inset;
  backdrop-filter: blur(8px) saturate(88%) contrast(1.08) brightness(0.72);
  -webkit-backdrop-filter: blur(8px) saturate(88%) contrast(1.08) brightness(0.72);
}

body.hg-markets.hg-predict-market-page .pm-market-card::before,
body.hg-markets.hg-predict-market-page .pm-chart-panel::before,
body.hg-markets.hg-predict-market-page .pm-book-panel::before,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel::before,
body.hg-markets.hg-predict-market-page .pm-ticket-panel::before,
body.hg-markets.hg-predict-market-page .pm-detail-bottom::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(90deg, transparent 0%, rgba(192, 178, 122, 0.18) 12%, rgba(255, 250, 226, 0.5) 45%, rgba(255, 250, 226, 0.36) 58%, rgba(192, 178, 122, 0.16) 88%, transparent 100%) left 9px top / calc(100% - 18px) 1px no-repeat,
    radial-gradient(ellipse 34px 9px at 14px 1px, rgba(255, 250, 226, 0.36), rgba(196, 182, 124, 0.13) 47%, transparent 78%),
    radial-gradient(ellipse 34px 9px at calc(100% - 14px) 1px, rgba(255, 250, 226, 0.32), rgba(196, 182, 124, 0.12) 47%, transparent 78%),
    radial-gradient(ellipse 26px 10px at 14px calc(100% - 1px), rgba(183, 171, 116, 0.12), transparent 75%),
    radial-gradient(ellipse 26px 10px at calc(100% - 14px) calc(100% - 1px), rgba(183, 171, 116, 0.13), transparent 75%),
    linear-gradient(180deg, rgba(255, 247, 219, 0.11), rgba(201, 188, 129, 0.026) 28%, rgba(0, 0, 0, 0.16) 100%) left top / 1px 100% no-repeat,
    linear-gradient(180deg, rgba(255, 247, 219, 0.095), rgba(201, 188, 129, 0.022) 28%, rgba(0, 0, 0, 0.18) 100%) right top / 1px 100% no-repeat,
    linear-gradient(90deg, transparent, rgba(126, 117, 78, 0.14) 36%, rgba(255, 243, 203, 0.11) 50%, rgba(0, 0, 0, 0.2) 100%) left bottom / 100% 1px no-repeat;
  box-shadow:
    0 0 0 1px rgba(7, 13, 13, 0.58) inset,
    0 1px 1px rgba(255, 248, 218, 0.08) inset,
    0 -10px 20px rgba(0, 0, 0, 0.2) inset;
  opacity: 0.96;
  pointer-events: none;
  z-index: 0;
}

body.hg-markets.hg-predict-market-page .pm-market-card::after,
body.hg-markets.hg-predict-market-page .pm-chart-panel::after,
body.hg-markets.hg-predict-market-page .pm-book-panel::after,
body.hg-markets.hg-predict-market-page .pm-outcomes-panel::after,
body.hg-markets.hg-predict-market-page .pm-ticket-panel::after,
body.hg-markets.hg-predict-market-page .pm-detail-bottom::after {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  top: 0;
  height: 18px;
  border-radius: inherit;
  background:
    radial-gradient(ellipse 52% 9px at 50% 0%, rgba(255, 252, 232, 0.34), rgba(203, 190, 130, 0.092) 48%, transparent 82%),
    linear-gradient(90deg, transparent 3%, rgba(255, 250, 225, 0.1) 24%, rgba(255, 250, 225, 0.18) 49%, rgba(196, 183, 124, 0.07) 74%, transparent 97%);
  box-shadow:
    0 1px 0 rgba(255, 250, 226, 0.12) inset,
    0 9px 18px rgba(255, 245, 206, 0.028);
  opacity: 0.72;
  pointer-events: none;
  z-index: 0;
}

body.hg-markets.hg-predict-market-page .pm-market-card:hover,
body.hg-markets.hg-predict-market-page .pm-market-card:focus-visible {
  border-color: rgba(216, 198, 132, 0.34);
  box-shadow:
    0 28px 62px rgba(0, 0, 0, 0.5),
    0 10px 26px rgba(0, 0, 0, 0.28),
    0 -1px 15px rgba(205, 190, 128, 0.055),
    0 1px 0 rgba(255, 250, 226, 0.28) inset,
    0 0 0 1px rgba(203, 188, 122, 0.16) inset,
    1px 0 0 rgba(255, 246, 214, 0.07) inset,
    -1px 0 0 rgba(0, 0, 0, 0.3) inset,
    0 -1px 0 rgba(13, 18, 17, 0.82) inset,
    0 -7px 19px rgba(0, 0, 0, 0.4) inset;
}

body.hg-markets.hg-predict-market-page .pm-market-card:active {
  box-shadow:
    0 15px 34px rgba(0, 0, 0, 0.48),
    0 1px 0 rgba(255, 247, 219, 0.16) inset,
    0 5px 18px rgba(0, 0, 0, 0.34) inset,
    0 -1px 0 rgba(167, 153, 99, 0.14) inset;
}

body.hg-markets.hg-predict-market-page .pm-card-outcome-row__pct {
  border-color: rgba(196, 179, 113, 0.24);
  background:
    radial-gradient(ellipse 70% 28% at 50% 0%, rgba(255, 246, 212, 0.085), transparent 72%),
    linear-gradient(180deg, rgba(28, 37, 36, 0.56), rgba(5, 11, 12, 0.78));
  color: rgba(213, 199, 158, 0.82);
  box-shadow:
    0 7px 15px rgba(0, 0, 0, 0.26),
    0 1px 0 rgba(255, 247, 219, 0.11) inset,
    0 0 0 1px rgba(8, 14, 14, 0.54) inset,
    0 -2px 5px rgba(0, 0, 0, 0.28) inset;
}

body.hg-markets.hg-predict-market-page .pm-card-outcomes--collapsed .pm-collection-toggle {
  border-color: rgba(196, 179, 113, 0.2);
  background:
    radial-gradient(ellipse 62% 32% at 50% 0%, rgba(255, 246, 212, 0.07), transparent 75%),
    linear-gradient(180deg, rgba(24, 32, 31, 0.45), rgba(3, 8, 10, 0.62));
  color: rgba(209, 197, 162, 0.72);
  box-shadow:
    0 6px 14px rgba(0, 0, 0, 0.24),
    0 1px 0 rgba(255, 247, 219, 0.075) inset,
    0 -2px 5px rgba(0, 0, 0, 0.22) inset;
}

body.hg-markets.hg-predict-market-page .pm-market-card--sports-match {
  gap: 10px;
}

body.hg-markets.hg-predict-market-page .pm-match-card-body {
  display: grid;
  gap: 10px;
  min-width: 0;
}

body.hg-markets.hg-predict-market-page .pm-match-card-teams {
  display: grid;
  grid-template-columns: minmax(76px, 1fr) minmax(92px, auto) minmax(76px, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 108px;
  padding: 2px 2px 0;
}

body.hg-markets.hg-predict-market-page .pm-match-card-team,
body.hg-markets.hg-predict-market-page .pm-match-card-center {
  min-width: 0;
  display: grid;
  justify-items: center;
  text-align: center;
}

body.hg-markets.hg-predict-market-page .pm-match-card-team {
  gap: 7px;
}

body.hg-markets.hg-predict-market-page .pm-match-card-team .pm-team-flag--lg {
  width: 52px;
  height: 52px;
  border-radius: 9px;
  box-shadow:
    0 11px 22px rgba(0, 0, 0, 0.26),
    0 1px 0 rgba(255, 255, 255, 0.18) inset;
}

body.hg-markets.hg-predict-market-page .pm-match-card-team strong {
  max-width: 100%;
  color: rgba(234, 228, 211, 0.92);
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.hg-markets.hg-predict-market-page .pm-match-card-center {
  align-content: center;
  gap: 3px;
}

body.hg-markets.hg-predict-market-page .pm-match-card-time {
  color: rgba(244, 239, 222, 0.96);
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  font-size: 19px;
  font-weight: 750;
  line-height: 1.05;
  white-space: nowrap;
}

body.hg-markets.hg-predict-market-page .pm-match-card-state,
body.hg-markets.hg-predict-market-page .pm-match-card-date,
body.hg-markets.hg-predict-market-page .pm-match-card-volume {
  color: rgba(172, 178, 170, 0.64);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.15;
  white-space: nowrap;
}

body.hg-markets.hg-predict-market-page .pm-match-card-state {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

body.hg-markets.hg-predict-market-page .pm-match-card-volume[hidden] {
  display: none;
}

body.hg-markets.hg-predict-market-page .pm-match-card-outcomes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

body.hg-markets.hg-predict-market-page .pm-match-card-outcomes--1 {
  grid-template-columns: minmax(0, 1fr);
}

body.hg-markets.hg-predict-market-page .pm-match-card-outcomes--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.hg-markets.hg-predict-market-page .pm-match-card-outcome {
  min-width: 0;
  min-height: 48px;
  display: grid;
  grid-template-columns: 1fr;
  align-content: center;
  justify-items: center;
  gap: 2px;
  padding: 8px 6px;
  border-color: rgba(196, 179, 113, 0.22);
  background:
    radial-gradient(ellipse 72% 34% at 50% 0%, rgba(255, 246, 212, 0.07), transparent 72%),
    linear-gradient(180deg, rgba(22, 30, 30, 0.56), rgba(4, 10, 12, 0.68));
  box-shadow:
    0 7px 15px rgba(0, 0, 0, 0.23),
    0 1px 0 rgba(255, 247, 219, 0.075) inset,
    0 -2px 5px rgba(0, 0, 0, 0.24) inset;
}

body.hg-markets.hg-predict-market-page .pm-match-card-outcome:hover,
body.hg-markets.hg-predict-market-page .pm-match-card-outcome:focus-visible {
  border-color: rgba(216, 198, 132, 0.42);
  background:
    radial-gradient(ellipse 72% 34% at 50% 0%, rgba(255, 246, 212, 0.105), transparent 72%),
    linear-gradient(180deg, rgba(28, 37, 36, 0.64), rgba(6, 13, 14, 0.72));
}

body.hg-markets.hg-predict-market-page .pm-match-card-outcome .pm-card-outcome-row__label,
body.hg-markets.hg-predict-market-page .pm-match-card-outcome .pm-card-outcome-row__pct {
  width: auto;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: rgba(226, 216, 184, 0.86);
  font-family: "Roboto Condensed", "Arial Narrow", "Noto Sans JP", sans-serif;
  line-height: 1.1;
  text-align: center;
}

body.hg-markets.hg-predict-market-page .pm-match-card-outcome .pm-card-outcome-row__label {
  max-width: 100%;
  font-size: 13px;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.hg-markets.hg-predict-market-page .pm-match-card-outcome .pm-card-outcome-row__pct {
  font-size: 12px;
  font-weight: 650;
  color: rgba(180, 185, 177, 0.66);
}

@media (max-width: 640px) {
  body.hg-markets.hg-predict-market-page .pm-market-card--sports-match {
    gap: 8px;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-teams {
    grid-template-columns: minmax(56px, 1fr) minmax(74px, 0.82fr) minmax(56px, 1fr);
    gap: 6px;
    min-height: 92px;
    padding-inline: 0;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-team {
    gap: 5px;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-team .pm-team-flag--lg {
    width: 44px;
    height: 44px;
    border-radius: 8px;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-team strong {
    font-size: 12px;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-time {
    font-size: 16px;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-state,
  body.hg-markets.hg-predict-market-page .pm-match-card-date,
  body.hg-markets.hg-predict-market-page .pm-match-card-volume {
    font-size: 10px;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-outcomes {
    gap: 6px;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-outcome {
    min-height: 42px;
    padding: 7px 3px;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-outcome .pm-card-outcome-row__label {
    font-size: 12px;
  }

  body.hg-markets.hg-predict-market-page .pm-match-card-outcome .pm-card-outcome-row__pct {
    font-size: 11px;
  }
}

.pm-top-icon {
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.54);
  color: #e2e8f0;
  font-weight: 700;
  cursor: pointer;
}

.pm-top-icon[hidden],
.pm-reconnect-button[hidden],
.pm-account-menu[hidden],
.pm-onboarding-modal[hidden],
.pm-wallet-choice-button.is-filtered {
  display: none;
}

.pm-reconnect-button {
  border-color: rgba(96, 165, 250, 0.42);
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.26), rgba(15, 23, 42, 0.88));
}

.pm-reconnect-button .pm-provider-icon {
  width: 24px;
  height: 24px;
}

.pm-wallet-choice-search {
  display: block;
  margin: 10px 0 12px;
}

.pm-wallet-choice-search input {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.72);
  color: #f8fafc;
  padding: 0 12px;
}

.pm-account-menu,
.pm-onboarding-modal {
  position: fixed;
  inset: 0;
  z-index: 140;
  display: grid;
  place-items: start end;
  padding: 72px 18px 18px;
  background: rgba(2, 5, 10, 0.28);
  backdrop-filter: blur(10px);
}

.pm-onboarding-modal {
  place-items: center;
  padding: 20px;
  background: rgba(2, 5, 10, 0.78);
  backdrop-filter: blur(18px);
}

.pm-account-menu-backdrop {
  position: fixed;
  inset: 0;
}

.pm-account-menu-shell,
.pm-onboarding-shell {
  position: relative;
  z-index: 1;
  width: min(380px, calc(100vw - 32px));
  display: grid;
  gap: 12px;
  padding: 20px;
  border: 1px solid rgba(105, 137, 180, 0.32);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(3, 6, 12, 0.98), rgba(5, 14, 27, 0.98));
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.52);
}

.pm-account-menu-shell {
  width: min(448px, calc(100vw - 32px));
  max-height: calc(100dvh - 92px);
  overflow: auto;
  gap: 14px;
  padding: 22px;
  scrollbar-width: thin;
  scrollbar-color: rgba(197, 154, 90, 0.42) transparent;
}

.pm-onboarding-shell {
  width: min(620px, calc(100vw - 32px));
  max-height: min(88vh, 760px);
  overflow: auto;
}

.pm-onboarding-shell > header {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.pm-account-avatar {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(96, 165, 250, 0.2);
  color: #dbeafe;
  font-weight: 800;
}

.pm-account-menu-head {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding-right: 34px;
}

.pm-account-menu-head > div:last-child {
  min-width: 0;
}

.pm-account-menu-head span,
.pm-account-value-head span,
.pm-account-readiness-head span {
  color: rgba(205, 197, 176, 0.62);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pm-account-menu-head h2 {
  margin: 1px 0 3px;
}

.pm-account-menu-shell h2,
.pm-onboarding-shell h2,
.pm-onboarding-shell p {
  margin: 0;
}

.pm-account-address,
.pm-account-menu-shell button,
.pm-onboarding-actions button {
  min-height: 40px;
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.62);
  color: #e2e8f0;
  cursor: pointer;
}

.pm-account-address {
  width: fit-content;
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(226, 232, 240, 0.76) !important;
  text-align: left;
  font-family: var(--font-mono);
  font-size: 12px;
}

.pm-account-balance {
  color: #ffffff;
  font-size: 29px;
  line-height: 1;
}

.pm-account-portfolio,
.pm-account-readiness {
  display: grid;
  gap: 12px;
  padding: 15px;
  border: 1px solid rgba(237, 213, 167, 0.18);
  border-radius: 14px;
  background:
    radial-gradient(circle at 88% 2%, rgba(197, 154, 90, 0.15), transparent 38%),
    linear-gradient(160deg, rgba(25, 30, 29, 0.9), rgba(7, 12, 14, 0.82));
}

.pm-account-value-head,
.pm-account-readiness-head,
.pm-ticket-readiness__head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.pm-account-value-head > div,
.pm-account-readiness-head > div,
.pm-ticket-readiness__head > div {
  display: grid;
  gap: 5px;
}

.pm-account-freshness,
.pm-account-readiness-head strong,
.pm-ticket-readiness__head strong {
  width: fit-content;
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(148, 163, 184, 0.12);
  color: rgba(226, 232, 240, 0.84);
  font-size: 11px;
}

.pm-account-freshness[data-tone="ready"],
.pm-account-readiness-head strong[data-tone="ready"] {
  background: rgba(102, 209, 162, 0.12);
  color: #86e2bd;
}

.pm-account-freshness[data-tone="blocked"],
.pm-account-readiness-head strong[data-tone="blocked"] {
  background: rgba(242, 82, 82, 0.12);
  color: #ff9b9b;
}

.pm-account-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.pm-account-stats div {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid rgba(205, 221, 225, 0.1);
  border-radius: 10px;
  background: rgba(3, 8, 10, 0.46);
}

.pm-account-stats dt {
  color: rgba(205, 197, 176, 0.58);
  font-size: 10px;
}

.pm-account-stats dd {
  margin: 0;
  color: rgba(242, 232, 207, 0.96);
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 760;
}

.pm-account-icon-button {
  min-height: 30px !important;
  padding: 0 9px;
  font-size: 11px;
}

.pm-readiness-progress {
  --readiness-progress: 0%;
  min-height: 28px;
  display: flex;
  align-items: center;
  padding: 0 9px;
  border: 1px solid rgba(205, 221, 225, 0.1);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(102, 209, 162, 0.18) 0 var(--readiness-progress), transparent var(--readiness-progress) 100%),
    rgba(3, 8, 10, 0.5);
  color: rgba(226, 232, 240, 0.7);
  font-family: var(--font-mono);
  font-size: 10px;
}

.pm-readiness-steps {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pm-readiness-step {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
}

.pm-readiness-step__mark {
  width: 11px;
  height: 11px;
  margin-top: 4px;
  border: 2px solid rgba(148, 163, 184, 0.5);
  border-radius: 999px;
  background: rgba(3, 8, 10, 0.82);
  box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.06);
}

.pm-readiness-step.is-complete .pm-readiness-step__mark {
  border-color: #66d1a2;
  background: #66d1a2;
  box-shadow: 0 0 0 3px rgba(102, 209, 162, 0.12);
}

.pm-readiness-step.is-action .pm-readiness-step__mark {
  border-color: #f1ca82;
  background: #c59a5a;
  box-shadow: 0 0 0 3px rgba(197, 154, 90, 0.14);
}

.pm-readiness-step.is-blocked .pm-readiness-step__mark {
  border-color: #ef7777;
  background: rgba(242, 82, 82, 0.34);
  box-shadow: 0 0 0 3px rgba(242, 82, 82, 0.1);
}

.pm-readiness-step > div {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.pm-readiness-step__eyebrow {
  color: rgba(205, 197, 176, 0.5);
  font-size: 9px;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pm-readiness-step strong {
  color: rgba(240, 231, 207, 0.94);
  font-size: 12px;
}

.pm-readiness-step p,
.pm-account-readiness-footnote,
.pm-ticket-readiness > p {
  margin: 0;
  color: rgba(205, 197, 176, 0.62);
  font-size: 10px;
  line-height: 1.45;
}

.pm-readiness-steps.is-compact .pm-readiness-step p,
.pm-readiness-steps.is-compact .pm-readiness-step__eyebrow {
  display: none;
}

.pm-account-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.pm-account-actions .is-primary {
  grid-column: 1 / -1;
  border-color: rgba(241, 202, 130, 0.56);
  background: linear-gradient(180deg, rgba(197, 154, 90, 0.98), rgba(133, 91, 42, 0.98));
  color: #100d08;
  font-weight: 820;
}

.pm-account-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.pm-account-links a {
  min-height: 34px;
  display: grid;
  place-items: center;
  padding: 0 6px;
  border-radius: 9px;
  background: rgba(205, 221, 225, 0.05);
  font-size: 11px;
  text-align: center;
}

.pm-account-logout {
  background: transparent !important;
  color: rgba(226, 232, 240, 0.58) !important;
}

.pm-ticket-readiness {
  display: grid;
  gap: 11px;
  padding: 14px;
  border: 1px solid rgba(205, 221, 225, 0.16);
  border-radius: 12px;
  background:
    radial-gradient(circle at 92% 5%, rgba(197, 154, 90, 0.12), transparent 36%),
    rgba(4, 9, 11, 0.72);
}

.pm-ticket-readiness[data-tone="blocked"] {
  border-color: rgba(242, 82, 82, 0.28);
  background:
    radial-gradient(circle at 92% 5%, rgba(242, 82, 82, 0.1), transparent 38%),
    rgba(4, 9, 11, 0.76);
}

.pm-ticket-readiness[data-tone="ready"] {
  border-color: rgba(102, 209, 162, 0.34);
}

.pm-ticket-readiness__head span:first-child {
  color: rgba(205, 197, 176, 0.58);
  font-size: 10px;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pm-ticket-readiness__head strong {
  padding: 0;
  background: transparent;
  color: rgba(240, 231, 207, 0.96);
  font-size: 14px;
}

.pm-ticket-readiness__shield {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(241, 202, 130, 0.3);
  border-radius: 9px;
  background: rgba(197, 154, 90, 0.12);
  color: #f1ca82;
  font-size: 10px;
  font-weight: 840;
}

.pm-readiness-references {
  margin-top: 5px;
}

.pm-readiness-references summary {
  width: fit-content;
  color: rgba(241, 202, 130, 0.72);
  font-size: 10px;
  cursor: pointer;
}

.pm-readiness-references ul {
  display: grid;
  gap: 7px;
  margin: 7px 0 0;
  padding: 0;
  list-style: none;
}

.pm-readiness-references li {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid rgba(205, 221, 225, 0.1);
  border-radius: 8px;
  background: rgba(3, 8, 10, 0.52);
}

.pm-readiness-references li span {
  color: rgba(205, 197, 176, 0.62);
  font-size: 10px;
  line-height: 1.4;
}

.pm-readiness-references code {
  color: rgba(226, 232, 240, 0.45);
  font-size: 9px;
  overflow-wrap: anywhere;
}

.pm-account-menu-shell a {
  color: rgba(191, 219, 254, 0.92);
  text-decoration: none;
}

.pm-onboarding-steps,
.pm-onboarding-actions {
  display: grid;
  gap: 10px;
}

.pm-onboarding-step {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(100, 116, 139, 0.24);
  border-radius: 14px;
  background: rgba(15, 23, 42, 0.58);
}

.pm-onboarding-step > span {
  align-self: start;
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(148, 163, 184, 0.16);
  color: rgba(226, 232, 240, 0.82);
  font-size: 11px;
  text-transform: uppercase;
}

.pm-onboarding-step strong {
  color: #ffffff;
}

.pm-onboarding-step p {
  color: rgba(226, 232, 240, 0.72);
  font-size: 13px;
}

.pm-onboarding-step.is-complete {
  border-color: rgba(34, 197, 94, 0.32);
}

.pm-onboarding-step.is-blocked,
.pm-onboarding-step.is-required {
  border-color: rgba(245, 158, 11, 0.36);
}

.pm-deposit-panel {
  display: grid;
  gap: 12px;
}

.pm-deposit-panel[hidden] {
  display: none;
}

.pm-deposit-selectors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.pm-deposit-selectors label,
#depositCashPanel label {
  display: grid;
  gap: 6px;
  color: rgba(226, 232, 240, 0.74);
  font-size: 12px;
}

.pm-deposit-selectors select,
#onRampAmount {
  min-height: 40px;
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.7);
  color: #f8fafc;
  padding: 0 10px;
}

.pm-deposit-qr-wrap {
  display: grid;
  grid-template-columns: 168px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(100, 116, 139, 0.24);
  border-radius: 16px;
  background: rgba(15, 23, 42, 0.52);
}

#depositQrCanvas {
  width: 168px;
  height: 168px;
  border-radius: 14px;
  background: rgba(2, 6, 23, 0.76);
}

#depositAddressValue {
  display: block;
  margin: 6px 0 10px;
  padding: 10px;
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.72);
  color: #f8fafc;
  overflow-wrap: anywhere;
  font-size: 12px;
}

#copyDepositAddressButton,
#startOnRampButton {
  min-height: 38px;
  border: 1px solid rgba(96, 165, 250, 0.36);
  border-radius: 10px;
  background: rgba(37, 99, 235, 0.2);
  color: #dbeafe;
  cursor: pointer;
}

.pm-deposit-fee,
.pm-onramp-provider {
  color: rgba(226, 232, 240, 0.72);
  font-size: 13px;
}

.pm-onramp-provider {
  padding: 12px;
  border: 1px solid rgba(100, 116, 139, 0.24);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.52);
}

#onRampFrame {
  width: 100%;
  min-height: 420px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 14px;
  background: rgba(2, 6, 23, 0.7);
}

@media (max-width: 640px) {
  .pm-deposit-selectors,
  .pm-deposit-qr-wrap,
  .pm-onboarding-step {
    grid-template-columns: 1fr;
  }

  .pm-account-menu {
    place-items: end center;
    padding: 18px;
  }

  .pm-account-menu-shell {
    width: min(100%, 448px);
    max-height: calc(100dvh - 36px);
    border-radius: 18px 18px 10px 10px;
  }

  .pm-account-stats,
  .pm-account-links {
    grid-template-columns: 1fr;
  }

  .pm-account-stats div {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }
}

/* Mobile PWA performance and safe-area pass. Keep trading/auth data network-bound. */
body.hg-markets.hg-predict-market-page {
  overscroll-behavior-y: none;
  -webkit-tap-highlight-color: transparent;
}

body.hg-markets.hg-predict-market-page .pm-root {
  min-height: 100dvh;
  padding-top: env(safe-area-inset-top);
}

body.hg-markets.hg-predict-market-page .pm-dock-button,
body.hg-markets.hg-predict-market-page .pm-market-card,
body.hg-markets.hg-predict-market-page button,
body.hg-markets.hg-predict-market-page a {
  touch-action: manipulation;
}

@media (hover: none), (pointer: coarse) {
  body.hg-markets.hg-predict-market-page .pm-market-card,
  body.hg-markets.hg-predict-market-page .pm-card-binary-side,
  body.hg-markets.hg-predict-market-page .pm-card-outcome-row,
  body.hg-markets.hg-predict-market-page .pm-dock-button {
    transition: none;
  }

  body.hg-markets.hg-predict-market-page .pm-market-card:hover,
  body.hg-markets.hg-predict-market-page .pm-market-card:focus-visible {
    transform: none;
  }
}

@media (max-width: 760px) {
  body.hg-markets.hg-predict-market-page .pm-app-topbar {
    display: flex;
    min-height: 58px;
    padding: 0 10px;
    gap: 8px;
  }

  body.hg-markets.hg-predict-market-page .pm-brand {
    min-width: 0;
    gap: 8px;
  }

  body.hg-markets.hg-predict-market-page .pm-brand-name {
    max-width: 38vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 15px;
  }

  body.hg-markets.hg-predict-market-page .pm-top-actions {
    flex: 0 0 auto;
    margin-left: auto;
    gap: 6px;
  }

  body.hg-markets.hg-predict-market-page .pm-top-signin {
    min-width: 72px;
    min-height: 36px;
    padding: 0 12px;
    font-size: 12px;
    white-space: nowrap;
  }

  body.hg-markets.hg-predict-market-page .pm-root {
    padding-bottom: calc(76px + env(safe-area-inset-bottom));
  }

  body.hg-markets.hg-predict-market-page .pm-list-view,
  body.hg-markets.hg-predict-market-page .pm-detail-view {
    padding-bottom: calc(84px + env(safe-area-inset-bottom));
  }

  body.hg-markets.hg-predict-market-page .pm-chip-row {
    gap: 8px;
  }

  body.hg-markets.hg-predict-market-page .pm-glass-dock {
    grid-template-columns: minmax(0, 1fr);
    min-height: calc(62px + env(safe-area-inset-bottom));
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
    background: rgba(7, 10, 11, 0.96);
    box-shadow: 0 -8px 22px rgba(0, 0, 0, 0.36);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  body.hg-markets.hg-predict-market-page .pm-glass-dock::before {
    box-shadow: none;
  }

  body.hg-markets.hg-predict-market-page .pm-dock-tabs {
    grid-template-columns: repeat(5, minmax(42px, 1fr));
    gap: 2px;
  }

  body.hg-markets.hg-predict-market-page .pm-dock-button {
    min-height: 50px;
    gap: 3px;
    font-size: 10px;
    line-height: 1;
  }

  body.hg-markets.hg-predict-market-page .pm-dock-button span:last-child {
    display: block;
  }

  body.hg-markets.hg-predict-market-page .pm-dock-glyph {
    width: 20px;
    height: 20px;
    box-shadow: none;
  }

  body.hg-markets.hg-predict-market-page .pm-market-card {
    content-visibility: auto;
    contain-intrinsic-size: 220px;
  }

  body.hg-markets.hg-predict-market-page .pm-market-card,
  body.hg-markets.hg-predict-market-page .pm-chart-panel,
  body.hg-markets.hg-predict-market-page .pm-book-panel,
  body.hg-markets.hg-predict-market-page .pm-outcomes-panel,
  body.hg-markets.hg-predict-market-page .pm-ticket-panel,
  body.hg-markets.hg-predict-market-page .pm-detail-bottom {
    background: rgba(8, 17, 20, 0.9);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  body.hg-markets.hg-predict-market-page .pm-market-card::before,
  body.hg-markets.hg-predict-market-page .pm-market-card::after,
  body.hg-markets.hg-predict-market-page .pm-chart-panel::before,
  body.hg-markets.hg-predict-market-page .pm-book-panel::before,
  body.hg-markets.hg-predict-market-page .pm-outcomes-panel::before,
  body.hg-markets.hg-predict-market-page .pm-ticket-panel::before,
  body.hg-markets.hg-predict-market-page .pm-detail-bottom::before,
  body.hg-markets.hg-predict-market-page .pm-detail-bottom::after {
    display: none;
  }
}

/* Outcome-style detail cleanup: keep market data, book depth, and the ticket visible without extra motion panels. */
body.hg-markets.hg-predict-market-page .pm-detail-view {
  padding: 18px 24px 40px;
}

body.hg-markets.hg-predict-market-page .pm-detail-grid {
  grid-template-columns: minmax(620px, 1fr) minmax(320px, 380px) minmax(360px, 430px);
  grid-template-areas:
    "chart book ticket"
    "chart outcomes ticket";
  gap: 14px;
  align-items: start;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-chart-panel,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-book-panel,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-outcomes-panel,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-ticket-panel,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-detail-bottom,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-order-info {
  border-color: rgba(35, 40, 52, 0.94);
  background: rgba(13, 15, 21, 0.96);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-chart-panel::before,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-chart-panel::after,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-book-panel::before,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-book-panel::after,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-outcomes-panel::before,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-outcomes-panel::after,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-ticket-panel::before,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-ticket-panel::after,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-detail-bottom::before,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-detail-bottom::after {
  display: none;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-chart-wrap {
  min-height: 500px;
  padding: 18px 22px 12px;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-book-panel,
body.hg-markets.hg-predict-market-page .pm-detail-view .pm-outcomes-panel {
  min-height: 0;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-outcomes-panel {
  max-height: 312px;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-outcomes-panel .pm-outcomes-list {
  max-height: 238px;
  overflow-y: auto;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-ticket-panel {
  gap: 12px;
  padding: 22px;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-ticket-tabs {
  margin-bottom: 6px;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-selected-outcome {
  margin-bottom: 8px;
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-market-meta-panel {
  border-color: rgba(35, 40, 52, 0.92);
  background: rgba(9, 11, 16, 0.82);
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-chart-source-label {
  fill: rgba(183, 194, 221, 0.72);
}

body.hg-markets.hg-predict-market-page .pm-detail-view .pm-chart-label {
  fill: rgba(108, 121, 154, 0.9);
}

.pm-debug-overlay {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 80;
  width: min(420px, calc(100vw - 28px));
  max-height: min(520px, calc(100vh - 28px));
  overflow: auto;
  border: 1px solid rgba(66, 76, 99, 0.9);
  border-radius: 8px;
  background: rgba(9, 11, 16, 0.96);
  color: rgba(228, 235, 248, 0.94);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.42);
  padding: 12px;
  font: 12px/1.35 "IBM Plex Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
}

.pm-debug-overlay[hidden] {
  display: none;
}

.pm-debug-overlay__head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.pm-debug-overlay dl {
  display: grid;
  gap: 6px;
  margin: 0;
}

.pm-debug-overlay dl > div {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 8px;
}

.pm-debug-overlay dt {
  color: rgba(138, 151, 181, 0.92);
}

.pm-debug-overlay dd {
  margin: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 1320px) {
  body.hg-markets.hg-predict-market-page .pm-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(310px, 360px) minmax(340px, 420px);
  }
}

@media (max-width: 1160px) {
  body.hg-markets.hg-predict-market-page .pm-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 420px);
    grid-template-areas:
      "chart ticket"
      "book ticket"
      "outcomes ticket";
  }
}

@media (max-width: 760px) {
  body.hg-markets.hg-predict-market-page .pm-detail-view {
    padding: 12px 10px calc(84px + env(safe-area-inset-bottom));
  }

  body.hg-markets.hg-predict-market-page .pm-detail-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "chart"
      "book"
      "ticket"
      "outcomes";
    gap: 10px;
  }

  body.hg-markets.hg-predict-market-page .pm-detail-view .pm-ticket-panel {
    position: static;
  }

  body.hg-markets.hg-predict-market-page .pm-detail-view .pm-chart-wrap {
    min-height: 340px;
    padding: 12px 12px 8px;
  }

  body.hg-markets.hg-predict-market-page .pm-detail-view .pm-outcomes-panel {
    max-height: none;
  }
}

/* Outcome-style bottom-right language + legal chrome (desktop dock is hidden). */
.hg-predict-market-page .pm-legal-chrome {
  position: fixed;
  right: max(14px, env(safe-area-inset-right));
  bottom: calc(10px + env(safe-area-inset-bottom));
  z-index: 90;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 0;
  margin: 0;
  color: rgba(168, 168, 172, 0.92);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1;
  pointer-events: none;
}

.hg-predict-market-page .pm-legal-chrome > *,
.hg-predict-market-page .pm-legal-chrome a,
.hg-predict-market-page .pm-legal-chrome button {
  pointer-events: auto;
}

.hg-predict-market-page .pm-legal-chrome a {
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
  transition: color 140ms ease;
}

.hg-predict-market-page .pm-legal-chrome a:hover,
.hg-predict-market-page .pm-legal-chrome a:focus-visible {
  color: rgba(248, 248, 250, 0.98);
  outline: none;
}

.hg-predict-market-page .pm-legal-chrome__lang {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.hg-predict-market-page .pm-legal-chrome__lang-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(248, 248, 250, 0.98);
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
}

.hg-predict-market-page .pm-legal-chrome__lang-trigger:hover,
.hg-predict-market-page .pm-legal-chrome__lang-trigger:focus-visible {
  color: #fff;
  outline: none;
}

.hg-predict-market-page .pm-legal-chrome__globe {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  opacity: 0.88;
}

.hg-predict-market-page .pm-legal-chrome__lang-menu {
  position: absolute;
  right: 0;
  bottom: calc(100% + 8px);
  z-index: 2;
  min-width: 148px;
  max-height: min(320px, calc(100vh - 96px));
  overflow: auto;
  margin: 0;
  padding: 6px 0;
  list-style: none;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  background: rgba(28, 28, 32, 0.96);
  box-shadow:
    0 16px 40px rgba(0, 0, 0, 0.48),
    0 1px 0 rgba(255, 255, 255, 0.06) inset;
  backdrop-filter: blur(18px) saturate(120%);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
}

.hg-predict-market-page .pm-legal-chrome__lang-menu[hidden] {
  display: none;
}

.hg-predict-market-page .pm-legal-chrome__lang-menu [role="option"] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 14px;
  color: rgba(210, 210, 214, 0.92);
  cursor: pointer;
  white-space: nowrap;
}

.hg-predict-market-page .pm-legal-chrome__lang-menu [role="option"]:hover,
.hg-predict-market-page .pm-legal-chrome__lang-menu [role="option"]:focus-visible {
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  outline: none;
}

.hg-predict-market-page .pm-legal-chrome__lang-menu [role="option"].is-active {
  color: #fff;
}

.hg-predict-market-page .pm-legal-chrome__lang-menu [role="option"].is-active::after {
  content: "";
  width: 7px;
  height: 12px;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  transform: rotate(45deg) translateY(-1px);
  opacity: 0.95;
}

html[dir="rtl"] .hg-predict-market-page .pm-legal-chrome {
  right: auto;
  left: max(14px, env(safe-area-inset-left));
}

html[dir="rtl"] .hg-predict-market-page .pm-legal-chrome__lang-menu {
  right: auto;
  left: 0;
}

@media (max-width: 760px) {
  .hg-predict-market-page .pm-legal-chrome {
    right: 10px;
    bottom: calc(86px + env(safe-area-inset-bottom));
    gap: 10px;
    font-size: 11px;
  }

  .hg-predict-market-page .pm-legal-chrome__lang-trigger {
    font-size: 11px;
  }
}