/*
 * Parallel Pulse geometry contract
 *
 * Loaded after every visual/refinement layer. Keep positional dimensions here
 * so future styling can change colour, texture and animation without moving the
 * first rendered frame or producing a post-load correction.
 */

:root {
  --parallel-workspace-gap: 18px;
  --parallel-stream-header-height: 52px;
  --parallel-token-metrics-width: 132px;
  --parallel-footer-market-width: 82px;
}

/* Keep the compact star exactly as drawn while giving it a taller, slightly
   wider invisible hit target. The narrow horizontal expansion avoids taking
   clicks away from the adjacent hide and Quick Buy controls. */
html body .token-card .watch-button::before {
  position: absolute;
  inset: -6px -2px;
  border-radius: 10px;
  background: transparent;
  content: "";
}

/* Keep the compact token metadata tucked beneath and slightly left of the name. */
@media (min-width: 900px) {
  html body .token-card .token-meta {
    transform: translate(-2px, -2px) !important;
  }
}

.market-strip {
  padding-inline: 0 !important;
}

.market-strip > .market-stat {
  justify-content: center !important;
  padding-inline: var(--parallel-workspace-gap) !important;
}

@media (min-width: 900px) {
  .main-content {
    padding: 7px var(--parallel-workspace-gap) var(--parallel-workspace-gap) !important;
  }

  .pulse-toolbar {
    width: 100% !important;
    min-height: 54px !important;
    margin: 0 0 6px !important;
  }

  .pulse-toolbar .page-heading {
    width: auto !important;
    min-width: 196px !important;
    min-height: 54px !important;
    padding: 10px 0 8px !important;
  }

  .pulse-toolbar .command-bar {
    position: static !important;
    right: auto !important;
    width: 306px !important;
    min-width: 306px !important;
    max-width: 306px !important;
    flex: 0 0 306px !important;
    margin: 0 !important;
    justify-self: end !important;
    transform: none !important;
  }

  .pulse-grid {
    box-sizing: border-box !important;
    width: 100% !important;
    height: calc(100dvh - 191px) !important;
    min-height: 520px !important;
    margin: 0 !important;
  }

  .stream-header {
    height: var(--parallel-stream-header-height) !important;
    min-height: var(--parallel-stream-header-height) !important;
    flex: 0 0 var(--parallel-stream-header-height) !important;
  }

  .stream-scrollbar {
    top: calc(var(--parallel-stream-header-height) + 2px) !important;
  }

  .stream-column .token-card {
    /* Reserve the custom-scrollbar gutter from the first rendered frame. */
    padding-right: 16px !important;
  }

  .token-card-top {
    grid-template-columns: minmax(0, 1fr) var(--parallel-token-metrics-width) !important;
  }

  .token-performance,
  .token-value {
    width: var(--parallel-token-metrics-width) !important;
    min-width: var(--parallel-token-metrics-width) !important;
    max-width: var(--parallel-token-metrics-width) !important;
  }

  .token-avatar-trigger,
  .token-avatar,
  .token-cover-art {
    aspect-ratio: 1 / 1;
  }

  .token-name-row,
  .token-name-copy,
  .token-name-copy > span {
    min-width: 0;
  }

  .token-name-copy > span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .status-market {
    box-sizing: border-box !important;
    width: var(--parallel-footer-market-width) !important;
    min-width: var(--parallel-footer-market-width) !important;
    max-width: var(--parallel-footer-market-width) !important;
    flex: 0 0 var(--parallel-footer-market-width) !important;
  }

  .status-market > strong {
    width: 48px !important;
    min-width: 48px !important;
    justify-content: center !important;
    font-variant-numeric: tabular-nums;
  }

  .status-bar {
    box-sizing: border-box !important;
    position: fixed !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 34px !important;
    min-height: 34px !important;
    padding-inline: 12px !important;
  }

  /* End the older flex/absolute footer cascade here. Keeping all three
     anchors in a single grid prevents telemetry from jumping into Pulse. */
  .status-bar > .parallel-preset-trigger {
    position: static !important;
    grid-column: 1 !important;
    justify-self: start !important;
    margin: 0 !important;
  }

  .status-bar > :is(.status-items, .parallel-footer-center) {
    position: static !important;
    inset: auto !important;
    grid-column: 2 !important;
    justify-self: center !important;
    width: max-content !important;
    max-width: 52vw !important;
    margin: 0 !important;
    transform: none !important;
  }

  .status-bar > .status-right {
    position: static !important;
    grid-column: 3 !important;
    justify-self: end !important;
    margin: 0 !important;
  }
}

/* Keep token rows geometrically fixed. Cursor glows are disabled so hovering
   cannot create an oversized visual layer between neighbouring rows. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body article.token-card {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
    transition: none !important;
  }

  html body article.token-card::before,
  html body article.token-card::after {
    content: none !important;
    display: none !important;
  }

  html body article.token-card:hover {
    z-index: auto !important;
    border-radius: 0 !important;
    background: var(--parallel-bg) !important;
    box-shadow: none !important;
  }
}

/* Use the supplied SVG Repo pause mark as a colour-aware mask, preserving the
   existing live-feed status size while replacing the hand-built bars. */
html body .stream-pause-indicator {
  width: 12px !important;
  height: 12px !important;
  gap: 0 !important;
  color: var(--blue) !important;
}

html body .stream-pause-indicator > i {
  display: none !important;
}

html body .stream-pause-icon {
  display: block;
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  background: currentColor;
  -webkit-mask: url("assets/pause-svgrepo-com.svg") center / contain no-repeat;
  mask: url("assets/pause-svgrepo-com.svg") center / contain no-repeat;
}

/* Reuse the supplied pause mark for the tracked-trades hover freeze. */
html body .wallet-manager-live-pause {
  display: inline-flex;
  width: 12px;
  height: 12px;
  align-items: center;
  justify-content: center;
  color: var(--blue);
}

html body .wallet-manager-live-pause[hidden] {
  display: none !important;
}

/* Dev-sold uses the blue network treatment across the complete compact chip. */
html body .risk-chip.sold {
  border-color: color-mix(in srgb, var(--blue) 38%, var(--border)) !important;
  background: var(--blue-soft) !important;
  color: var(--blue) !important;
}

html body .risk-chip.sold svg {
  color: var(--blue) !important;
  stroke: var(--blue) !important;
}

/* Dedicated import-wallet mark; other download/import symbols are untouched. */
html body .wallet-actions-grid .wallet-import-mark {
  display: block;
  width: 14px;
  height: 14px;
  background: currentColor;
  -webkit-mask: url("assets/import-2-svgrepo-com.svg") center / contain no-repeat;
  mask: url("assets/import-2-svgrepo-com.svg") center / contain no-repeat;
}

/* At compressed desktop widths, protect the full project name first and let
   the ticker use the remaining space. Narrower metrics recover enough room
   without changing row height or the three-column Pulse layout. */
@media (min-width: 900px) and (max-width: 1279px) {
  :root {
    --parallel-token-metrics-width: 104px;
  }

  .token-card-top {
    gap: 8px !important;
  }

  .token-card-top .token-identity {
    grid-template-columns: 48px minmax(0, 1fr) !important;
    column-gap: 8px !important;
  }

  .token-name-copy {
    flex: 0 0 auto !important;
    max-width: none !important;
    overflow: visible !important;
  }

  .token-name-copy > span {
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .token-context {
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  .token-context-trigger {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

/* Keep the real search field and its slash shortcut at ordinary compact
   desktop widths. Only the genuinely narrow state collapses to a 30px
   magnifier circle; focusing that circle still expands the existing field. */
@media (min-width: 1020px) and (max-width: 1180px) {
  .parallel-stable-search {
    width: 190px !important;
    min-width: 190px !important;
    max-width: 190px !important;
    flex: 0 0 190px !important;
    justify-content: flex-start !important;
    padding: 0 34px 0 10px !important;
  }

  .topbar-search > svg {
    display: block !important;
    flex: 0 0 15px !important;
    transform: none !important;
  }

  .topbar-search input {
    display: block !important;
    width: 100% !important;
    flex: 1 1 auto !important;
    opacity: 1 !important;
  }

  .topbar-search:not(:focus-within) .parallel-search-slash,
  .topbar-search:focus-within .parallel-search-slash {
    display: inline-grid !important;
  }
}

@media (max-width: 1023px) {
  .parallel-stable-search:not(:focus-within) {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
  }

  .topbar-search:not(:focus-within) > svg {
    display: block !important;
    margin: 0 !important;
    transform: none !important;
  }

  .topbar-search:not(:focus-within) input {
    width: 0 !important;
    min-width: 0 !important;
    flex: 0 0 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
  }

  .topbar-search:not(:focus-within) .parallel-search-slash {
    display: none !important;
  }
}

/* Axiom-like light mode: white structural chrome, neutral canvas and subtle
   separators. These selectors are last in the cascade by design. */
html[data-theme="light"] .topbar,
html[data-theme="light"] .market-strip,
html[data-theme="light"] .pair-activity-strip,
html[data-theme="light"] .status-bar {
  background: #ffffff !important;
  border-color: #dfe3e8 !important;
  box-shadow: none !important;
}

html[data-theme="light"] .main-content {
  background: #f6f7f9 !important;
}

html[data-theme="light"] .pulse-grid,
html[data-theme="light"] .stream-column,
html[data-theme="light"] .stream-list,
html[data-theme="light"] .stream-header,
html[data-theme="light"] .token-card {
  background: #ffffff !important;
  border-color: #dfe3e8 !important;
}

html[data-theme="light"] .token-card:hover {
  background: #ffffff !important;
}

@media (min-width: 1181px) {
  .parallel-stable-header {
    grid-template-columns: 133px minmax(438px, 1fr) 554px !important;
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 14px !important;
  }

  .parallel-stable-brand {
    width: 133px !important;
    min-width: 133px !important;
    max-width: 133px !important;
    height: 48px !important;
  }

  .parallel-stable-mark {
    width: 22px !important;
    height: 22px !important;
    flex: 0 0 22px !important;
  }

  .primary-nav.pt-refined-nav-group.parallel-nav-cluster {
    width: 438px !important;
    min-width: 438px !important;
    max-width: 438px !important;
    height: 32px !important;
    align-self: center !important;
    flex-wrap: nowrap !important;
  }

  .parallel-stable-actions {
    width: 554px !important;
    min-width: 554px !important;
    max-width: 554px !important;
    height: 48px !important;
    justify-self: end !important;
    flex-wrap: nowrap !important;
  }

  .parallel-stable-search {
    width: 235px !important;
    min-width: 235px !important;
    max-width: 235px !important;
    height: 30px !important;
    flex: 0 0 235px !important;
  }

  .parallel-stable-network {
    width: 70px !important;
    min-width: 70px !important;
    max-width: 70px !important;
    height: 38px !important;
  }

  .topbar-actions .icon-button[data-action="notifications"] {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
  }

  .parallel-stable-theme {
    width: 56px !important;
    min-width: 56px !important;
    max-width: 56px !important;
    height: 30px !important;
  }

  .parallel-stable-wallet {
    width: 131px !important;
    min-width: 131px !important;
    max-width: 131px !important;
    height: 30px !important;
    min-height: 30px !important;
    border-radius: 999px !important;
  }

  .pair-chip-avatar,
  .pair-chip-avatar img {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    aspect-ratio: 1 / 1;
  }

  .primary-nav .nav-item,
  .parallel-stable-network,
  .topbar-actions .icon-button[data-action="notifications"],
  .parallel-stable-theme {
    transform: none !important;
    will-change: auto !important;
  }
}

/* Compact desktop contract.
   The public preview renders this density, so keep the real Pulse at the same
   proportions whenever the window is narrower than the full desktop shell.
   These rules intentionally live last: older desktop rules otherwise enlarge
   the rows again and let the focused search float over the navigation. */
@media (min-width: 900px) and (max-width: 1279px) {
  :root {
    --parallel-stream-header-height: 36px;
    --parallel-token-metrics-width: 104px;
  }

  .pulse-toolbar {
    min-height: 34px !important;
    margin-bottom: 6px !important;
  }

  .pulse-toolbar .page-heading {
    min-height: 34px !important;
    padding: 4px 0 !important;
  }

  .pulse-toolbar .page-heading h1 {
    font-size: 18px !important;
  }

  .stream-header {
    min-height: var(--parallel-stream-header-height) !important;
    height: var(--parallel-stream-header-height) !important;
    flex-basis: var(--parallel-stream-header-height) !important;
    padding: 0 8px !important;
    gap: 6px !important;
  }

  .stream-title h2 {
    font-size: 11.5px !important;
  }

  .stream-search {
    width: min(100%, 170px) !important;
    max-width: 170px !important;
    height: 27px !important;
    padding: 0 8px !important;
    gap: 5px !important;
  }

  .stream-search svg {
    width: 10px !important;
    height: 10px !important;
  }

  .stream-search input {
    font-size: 8px !important;
  }

  .stream-tools {
    gap: 2px !important;
  }

  .stream-tools button,
  .stream-tools .stream-filter-button {
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
  }

  .stream-tools svg {
    width: 11px !important;
    height: 11px !important;
  }

  .stream-tools .stream-filter-button svg {
    width: 14px !important;
    height: 14px !important;
  }

  .stream-column .token-card {
    padding: 6px 16px 6px 8px !important;
  }

  .token-card-top {
    gap: 7px !important;
  }

  .token-card-top .token-identity {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    column-gap: 6px !important;
  }

  .token-avatar-stack {
    width: 42px !important;
    gap: 5px !important;
  }

  .token-avatar-trigger,
  .token-avatar {
    width: 34px !important;
    height: 34px !important;
    border-radius: 5px !important;
  }

  .token-avatar-camera {
    width: 17px !important;
    height: 17px !important;
  }

  .token-avatar-camera svg {
    width: 11px !important;
    height: 11px !important;
  }

  .token-name-row {
    gap: 3px !important;
  }

  .token-name-copy > span {
    font-size: 10.5px !important;
  }

  .token-context-trigger,
  .token-name-row > span {
    font-size: 7.5px !important;
  }

  .token-ca-copy {
    width: 42px !important;
    font-size: 6.5px !important;
    line-height: 1 !important;
  }

  .token-meta {
    margin-top: 2px !important;
    gap: 4px !important;
    font-size: 8px !important;
  }

  .holder-count {
    gap: 2px !important;
  }

  .holder-count svg {
    width: 10px !important;
    height: 10px !important;
  }

  .holder-count b {
    font-size: 8px !important;
  }

  .token-social {
    height: 13px !important;
    gap: 3px !important;
  }

  .social-trigger {
    width: 12px !important;
    height: 13px !important;
    flex-basis: 12px !important;
  }

  .social-symbol .profile-social-mark,
  .website-social svg {
    width: 11px !important;
    height: 11px !important;
    flex-basis: 11px !important;
  }

  .token-value {
    gap: 2px !important;
  }

  .token-stat-line {
    gap: 3px !important;
  }

  .token-stat-line small {
    font-size: 7px !important;
  }

  .token-stat-line b {
    font-size: 10.5px !important;
  }

  .token-tx-stat {
    transform: translateY(1px) !important;
  }

  .token-tx-stat b {
    font-size: 7px !important;
  }

  .transaction-split-track {
    width: 28px !important;
  }

  .token-card-footer {
    margin-top: 4px !important;
    gap: 6px !important;
  }

  .risk-row {
    gap: 3px !important;
  }

  .risk-chip {
    height: 18px !important;
    padding: 0 5px !important;
    gap: 2px !important;
    font-size: 6.8px !important;
  }

  .risk-chip svg {
    width: 9px !important;
    height: 9px !important;
  }

  .card-actions {
    gap: 2px !important;
  }

  .watch-button,
  .token-safety-button {
    width: 22px !important;
    height: 22px !important;
  }

  .watch-button svg,
  .token-safety-button svg {
    width: 11px !important;
    height: 11px !important;
  }

  .quick-buy {
    height: 23px !important;
    padding: 0 8px !important;
    gap: 4px !important;
    font-size: 8px !important;
  }
}

/* Keep all six navigation items and the header controls in separate grid
   tracks at compact desktop widths. Search focus expands inside the actions
   track instead of becoming an absolute layer over Rewards/News. */
@media (min-width: 900px) and (max-width: 1180px) {
  .parallel-stable-header {
    grid-template-columns: 110px minmax(330px, 1fr) auto !important;
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 10px !important;
    column-gap: 4px !important;
  }

  .parallel-stable-brand {
    width: 110px !important;
    min-width: 110px !important;
    max-width: 110px !important;
  }

  .primary-nav.pt-refined-nav-group.parallel-nav-cluster {
    display: flex !important;
    width: 100% !important;
    min-width: 330px !important;
    max-width: none !important;
    flex-wrap: nowrap !important;
    gap: 1px !important;
    overflow: hidden !important;
  }

  .primary-nav .nav-item,
  .primary-nav .nav-item:nth-last-child(-n + 2) {
    display: inline-flex !important;
    min-width: 0 !important;
    height: 30px !important;
    padding: 0 7px !important;
    font-size: 10.5px !important;
    white-space: nowrap !important;
  }

  .parallel-stable-actions {
    position: relative !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 48px !important;
    gap: 4px !important;
    justify-self: end !important;
    flex-wrap: nowrap !important;
  }

  .parallel-stable-search,
  .parallel-stable-search:focus-within {
    position: relative !important;
    right: auto !important;
    z-index: 1 !important;
    width: 170px !important;
    min-width: 170px !important;
    max-width: 170px !important;
    height: 30px !important;
    flex: 0 0 170px !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    padding: 0 30px 0 9px !important;
  }

  .parallel-stable-search > svg,
  .parallel-stable-search:focus-within > svg {
    display: block !important;
    width: 13px !important;
    height: 13px !important;
    flex: 0 0 13px !important;
    margin: 0 !important;
    transform: none !important;
  }

  .parallel-stable-search input,
  .parallel-stable-search:focus-within input {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    padding: 0 !important;
    opacity: 1 !important;
  }

  .parallel-stable-search .parallel-search-slash {
    display: inline-grid !important;
  }

  .parallel-stable-network {
    width: 54px !important;
    min-width: 54px !important;
    max-width: 54px !important;
  }

  .topbar-actions .icon-button[data-action="notifications"] {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
  }

  .parallel-stable-theme {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
  }

  .parallel-stable-wallet {
    width: 110px !important;
    min-width: 110px !important;
    max-width: 110px !important;
    height: 30px !important;
    min-height: 30px !important;
    border-radius: 999px !important;
  }
}

/* Keep the compact wallet balance centred inside the same-height pill as search. */
@media (min-width: 900px) {
  .parallel-stable-wallet .wallet-copy {
    justify-content: center !important;
    line-height: 1 !important;
  }
}

@media (min-width: 900px) and (max-width: 1019px) {
  .parallel-stable-search:not(:focus-within) {
    position: relative !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    flex-basis: 30px !important;
    padding: 0 !important;
  }
}

/* Keep the fixed navigation and status rails on the same canvas as Pulse. */
html:not([data-theme="light"]) .topbar,
html:not([data-theme="light"]) .status-bar {
  background: var(--parallel-bg) !important;
}

/* Pull the lower controls closer to the token details without changing the
   row dividers or the three-column feed geometry. */
@media (min-width: 900px) {
  html body .stream-column .token-card {
    padding-bottom: 4px !important;
  }

  html body .stream-column .token-card-footer {
    margin-top: 2px !important;
  }
}

@media (min-width: 900px) and (max-width: 1279px) {
  html body .stream-column .token-card {
    min-height: 84px !important;
  }
}

/* Navigation tabs must remain separate surfaces. The older pointer tilt could
   translate a hovered tab over its neighbour, most visibly on Pulse/Portfolio. */
@media (min-width: 900px) {
  html body .primary-nav.pt-refined-nav-group.parallel-nav-cluster {
    gap: 4px !important;
  }

  html body .primary-nav .nav-item {
    flex: 0 0 auto !important;
    margin: 0 !important;
    transform: none !important;
    will-change: auto !important;
  }
}

/* Slightly reduce the avatar's Sui network badge as one proportional unit. */
html body .token-avatar > .token-avatar-network {
  right: -2px !important;
  bottom: -2px !important;
  width: 9px !important;
  height: 9px !important;
  box-shadow: 0 0 0 1.25px #07101a !important;
}

html body .token-avatar > .token-avatar-network img {
  width: 4.5px !important;
  height: 5.8px !important;
}

/* Give the contract address breathing room beneath the protruding Sui badge. */
html body .token-avatar-stack > .token-ca-copy {
  margin-top: 2px !important;
}

/* Keep the Balance styling unchanged while making the PNL total reflect its
   state. Zero is treated as a non-loss, so it shares the positive colour. */
html body .pnl-summary .pnl-profit.neutral strong,
html body .pnl-summary .pnl-profit.positive strong {
  color: var(--pnl-increase, var(--positive)) !important;
}

html body .pnl-summary .pnl-profit.negative strong {
  color: var(--pnl-decrease, var(--negative)) !important;
}

/* PNL window controls are intentionally hidden until the panel is hovered.
   Give the revealed icons enough neutral contrast on the light surface. */
html[data-theme="light"] body .pnl-tracker:hover .pnl-toolbar button,
html[data-theme="light"] body .pnl-tracker:focus-within .pnl-toolbar button {
  color: #778292 !important;
}

html[data-theme="light"] body .pnl-toolbar button:hover,
html[data-theme="light"] body .pnl-toolbar button:focus-visible,
html[data-theme="light"] body .pnl-toolbar button.active {
  border-color: transparent !important;
  background: transparent !important;
  color: #4f5968 !important;
}

/* Built-in PNL background: the same deep navy atmosphere as the waitlist.
   Uploaded images still replace this surface through has-custom-background. */
html body .pnl-tracker:not(.has-custom-background) .pnl-summary,
html body .pnl-background-preview:not(.has-custom-background) {
  background-color: #070c18 !important;
  background:
    radial-gradient(circle at 18% 9%, rgba(77, 115, 255, 0.2), transparent 34%),
    radial-gradient(circle at 78% 22%, rgba(50, 86, 190, 0.1), transparent 38%),
    linear-gradient(155deg, #10183a 0%, #080d20 42%, #020307 100%) !important;
}

/* The PNL summary always has an opaque base. Custom artwork is raised above
   that base and covers the complete summary instead of being hidden behind it. */
html body .pnl-tracker .pnl-summary {
  background-color: #070c18 !important;
}

html body .pnl-tracker.has-custom-background .pnl-summary::before {
  z-index: 0 !important;
  inset: -18px !important;
  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

html body .pnl-tracker.has-custom-background .pnl-summary::after {
  z-index: 1 !important;
}

html body .pnl-tracker.has-custom-background .pnl-summary > * {
  position: relative;
  z-index: 2;
}

/* Let the PNL artwork run all the way to the panel's top border. The toolbar
   remains interactive on hover, but it overlays the artwork instead of
   reserving a separate blank strip above it. */
html body .pnl-tracker .pnl-toolbar {
  position: absolute !important;
  z-index: 4 !important;
  inset: 0 0 auto !important;
  background: transparent !important;
}

/* Preserve the artwork area's established height, but centre Balance, the
   Parallel mark and PNL as one unit instead of offsetting them from the top. */
html body .pnl-tracker .pnl-summary {
  min-height: 111px !important;
  padding: 12px 24px 5px !important;
  align-content: center !important;
}

/* Keep the coin context labels compact without changing the sizing of
   unrelated menus or image/social previews. */
html body .token-card .holder-count::after,
html body .token-card .risk-chip::after,
html body .token-card .card-action-button::after {
  max-width: 128px !important;
  padding: 3px 5px !important;
  border-radius: 4px !important;
  font-size: 6.5px !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
}

/* Keep every Trading Settings preset tab exactly the same size, including
   the selected state. Flex shares are used here to override legacy widths. */
html body .parallel-preset-tabs {
  display: flex !important;
  align-items: stretch !important;
  width: 100% !important;
  gap: 4px !important;
}

html body .parallel-preset-tabs > .parallel-tab-button {
  flex: 1 1 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 6px !important;
  margin: 0 !important;
  place-items: center !important;
}

/* ARIA selection is the sole preset highlight state. */
html body .parallel-preset-tabs > .parallel-tab-button[aria-selected="false"] {
  border-color: transparent !important;
  background: var(--terminal-tab) !important;
  color: #aab3c1 !important;
  box-shadow: none !important;
}

/* Token menus and metric hints must paint above neighbouring rows. Keep the
   normal clipped geometry until an actual hover/focus surface is active. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body article.token-card:has(.token-context:hover),
  html body article.token-card:has(.token-context:focus-within),
  html body article.token-card:has([data-tooltip]:hover),
  html body article.token-card:has([data-tooltip]:focus-visible),
  html body article.token-card:has([data-copy-tooltip]:hover),
  html body article.token-card:has([data-copy-tooltip]:focus-visible),
  html body article.token-card:has([data-social-preview]:hover),
  html body article.token-card:has([data-social-preview]:focus-visible) {
    overflow: visible !important;
    isolation: auto !important;
    z-index: 1000 !important;
  }

html body article.token-card:has(.risk-chip:hover),
  html body article.token-card:has(.risk-chip:focus-visible),
  html body article.token-card:has(.card-action-button:hover),
  html body article.token-card:has(.card-action-button:focus-visible) {
  }

  html body article.token-card:has(.token-context:hover) > .token-card-top,
  html body article.token-card:has(.token-context:focus-within) > .token-card-top,
  html body article.token-card:has([data-tooltip]:hover) > .token-card-top,
  html body article.token-card:has([data-tooltip]:hover) > .token-card-footer,
  html body article.token-card:has([data-social-preview]:hover) > .token-card-top,
  html body article.token-card:has([data-social-preview]:focus-visible) > .token-card-top {
    z-index: 1001 !important;
  }

  html body .token-context-menu,
  html body .token-card [data-tooltip]::after,
  html body .token-card [data-copy-tooltip]::after,
  html body .token-card .x-profile-preview,
  html body .token-card .website-social::after {
    z-index: 10000 !important;
  }

  /* Total-holder hints use viewport coordinates so the token list's scroll
     clipping cannot cut them off beneath the sticky stream header. */
  html body .holder-count::after {
    position: fixed !important;
    top: var(--holder-tooltip-y, 0px) !important;
    right: auto !important;
    bottom: auto !important;
    left: var(--holder-tooltip-x, 0px) !important;
    transform: translate(-50%, calc(-100% + 3px)) !important;
  }

  html body .holder-count:hover::after,
  html body .holder-count:focus-visible::after {
    transform: translate(-50%, -100%) !important;
  }

  /* Footer hints open upward, keeping them clear of the next token row. */
  html body .token-card-footer .risk-chip::after,
  html body .token-card-footer .card-action-button::after {
    top: auto !important;
    bottom: calc(100% + 7px) !important;
  }
}

/* Keep coin context hints on the visible token card. Fixed positioning lets
   them paint over the measured stream scrollbar, while JavaScript clamps the
   horizontal coordinate before the scrollbar gutter. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body .token-card .risk-chip::after,
  html body .token-card .card-action-button::after {
    position: fixed !important;
    z-index: 20000 !important;
    top: var(--coin-context-tooltip-y, 0px) !important;
    right: auto !important;
    bottom: auto !important;
    left: var(--coin-context-tooltip-x, 0px) !important;
    max-width: 128px !important;
    pointer-events: none !important;
    transform: translate(-50%, calc(-100% + 3px)) !important;
  }

  html body .token-card .risk-chip:hover::after,
  html body .token-card .risk-chip:focus-visible::after,
  html body .token-card .card-action-button:hover::after,
  html body .token-card .card-action-button:focus-visible::after {
    transform: translate(-50%, -100%) !important;
  }

  /* The hint itself is fixed above the scrollbar. Do not raise the opaque
     token-card background, otherwise it masks the scrollbar for that row. */
  html body article.token-card:has(.risk-chip:hover),
  html body article.token-card:has(.risk-chip:focus-visible),
  html body article.token-card:has(.card-action-button:hover),
  html body article.token-card:has(.card-action-button:focus-visible) {
    z-index: auto !important;
  }

  html body article.token-card:has(.risk-chip:hover) > .token-card-footer,
  html body article.token-card:has(.risk-chip:focus-visible) > .token-card-footer,
  html body article.token-card:has(.card-action-button:hover) > .token-card-footer,
  html body article.token-card:has(.card-action-button:focus-visible) > .token-card-footer {
    z-index: auto !important;
  }

}

/* Names, ticker menus, holder totals and social/website previews use the same
   viewport layer as the compact risk hints. Never lift the opaque token row:
   doing so paints it over the custom stream scrollbar for that one row. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body .token-context-menu {
    position: fixed !important;
    z-index: 20000 !important;
    top: var(--token-context-menu-y, 0px) !important;
    right: auto !important;
    bottom: auto !important;
    left: var(--token-context-menu-x, 0px) !important;
    transform: none !important;
  }

  html body .token-name-copy::after {
    position: fixed !important;
    z-index: 20000 !important;
    top: var(--copy-tooltip-y, 0px) !important;
    right: auto !important;
    bottom: auto !important;
    left: var(--copy-tooltip-x, 50vw) !important;
    transform: translate(-50%, calc(-100% + 3px)) !important;
  }

  html body .token-name-copy:hover::after,
  html body .token-name-copy:focus-visible::after {
    transform: translate(-50%, -100%) !important;
  }

  html body .token-card .holder-count::after,
  html body .token-card .x-profile-preview,
  html body .token-card .website-social::after {
    z-index: 20000 !important;
  }

  html body article.token-card:has(.token-context:hover),
  html body article.token-card:has(.token-context:focus-within),
  html body article.token-card:has(.holder-count:hover),
  html body article.token-card:has(.holder-count:focus-visible),
  html body article.token-card:has([data-copy-tooltip]:hover),
  html body article.token-card:has([data-copy-tooltip]:focus-visible),
  html body article.token-card:has([data-social-preview]:hover),
  html body article.token-card:has([data-social-preview]:focus-visible) {
    z-index: auto !important;
  }

  html body article.token-card:has(.token-context:hover) > .token-card-top,
  html body article.token-card:has(.token-context:focus-within) > .token-card-top,
  html body article.token-card:has(.holder-count:hover) > .token-card-top,
  html body article.token-card:has(.holder-count:focus-visible) > .token-card-top,
  html body article.token-card:has([data-copy-tooltip]:hover) > .token-card-top,
  html body article.token-card:has([data-copy-tooltip]:focus-visible) > .token-card-top,
  html body article.token-card:has([data-social-preview]:hover) > .token-card-top,
  html body article.token-card:has([data-social-preview]:focus-visible) > .token-card-top {
    z-index: 1 !important;
  }

  html body article.token-card:has(.holder-count:hover) > .token-card-footer,
  html body article.token-card:has(.holder-count:focus-visible) > .token-card-footer,
  html body article.token-card:has([data-social-preview]:hover) > .token-card-footer,
  html body article.token-card:has([data-social-preview]:focus-visible) > .token-card-footer {
    z-index: 1 !important;
  }
}

/* Preserve the compact 32px nav surface while extending its pointer hit area
   through the full 48px header. This removes the dead strip above/below it. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body .primary-nav.pt-refined-nav-group.parallel-nav-cluster {
    overflow: visible !important;
  }

  html body .primary-nav .nav-item {
    position: relative !important;
    overflow: visible !important;
  }

  html body .primary-nav .nav-item::before {
    content: "";
    position: absolute;
    inset: -8px 0;
    pointer-events: auto;
  }
}

/* Compact semantic notifications. Alert confirmations stay centered at the
   top; Quick Buy and watchlist state stay close to the lower-right controls. */
html body .parallel-stable-brand .parallel-stable-mark {
  margin-right: 4px !important;
}

html body .copy-toast-region {
  top: 10px;
  width: min(420px, calc(100vw - 24px));
  align-items: center;
  gap: 5px;
}

html body .copy-toast {
  grid-template-columns: 19px minmax(0, 1fr) 19px;
  width: max-content;
  max-width: 100%;
  min-height: 40px;
  padding: 5px 8px;
  column-gap: 6px;
  border-radius: 6px;
}

html body .copy-toast .top-notice-icon,
html body .copy-toast .copy-toast-icon {
  width: 18px;
  height: 18px;
}

html body .copy-toast .top-notice-icon svg {
  width: 17px;
  height: 17px;
}

html body .copy-toast .top-notice-close,
html body .toast .top-notice-close {
  width: 19px;
  height: 19px;
}

html body .copy-toast .top-notice-close svg,
html body .toast .top-notice-close svg {
  width: 13px;
  height: 13px;
}

html body .toast-region {
  width: min(270px, calc(100vw - 24px));
  align-items: flex-end;
  gap: 5px;
}

html body .toast {
  pointer-events: auto;
}

html body .toast.toast-state {
  position: relative;
  display: flex;
  width: min(180px, 100%);
  min-height: 38px;
  justify-content: center;
  padding: 6px 29px 6px 10px;
  border-radius: 6px;
}

html body .toast.toast-state b {
  width: auto;
  line-height: 1;
}

html body .toast.toast-state .top-notice-close {
  position: absolute;
  top: 50%;
  right: 7px;
  transform: translateY(-50%);
}

html body .toast.toast-watchlist {
  grid-template-columns: 18px minmax(0, 1fr) 18px;
  width: min(250px, 100%);
  min-height: 42px;
  padding: 5px 8px;
  column-gap: 7px;
  border-radius: 6px;
  text-align: left;
}

html body .toast-watchlist-icon {
  display: grid;
  width: 17px;
  height: 17px;
  place-items: center;
}

html body .toast-watchlist-icon svg {
  width: 15px;
  height: 15px;
  overflow: visible;
  stroke: currentColor;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

html body .toast-watchlist.is-added .toast-watchlist-icon {
  color: #ffc75a;
}

html body .toast-watchlist.is-added .toast-watchlist-icon path {
  fill: currentColor;
}

html body .toast-watchlist.is-removed .toast-watchlist-icon {
  color: var(--blue);
}

html body .toast-watchlist.is-removed .toast-watchlist-icon path {
  fill: none;
}

html body .toast-watchlist-copy {
  justify-items: start;
  align-content: center;
  min-width: 0;
}

html body .toast.toast-watchlist b,
html body .toast.toast-watchlist small {
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html body .toast.toast-watchlist small {
  margin-top: 2px;
}

/* Keep the two theme glyphs optically centred as one compact control. */
html body .parallel-stable-theme .theme-track {
  grid-template-columns: repeat(2, 14px) !important;
  column-gap: 4px !important;
  justify-content: center !important;
  transform: none !important;
}

/* Keep the top navigation search copy compact without affecting column filters. */
html body .topbar-search.parallel-stable-search input {
  padding-inline: 4px !important;
  font-size: 9px !important;
  line-height: 13px !important;
}

@media (min-width: 1020px) and (max-width: 1279px) {
  html body .topbar-search.parallel-stable-search input {
    padding-inline: 2px !important;
    font-size: 7px !important;
    line-height: 10px !important;
  }
}

/* Enlarge only the Pulse coin cover by a further 15%. The avatar column now
   matches the visible cover, so the cover and Snipers chip share one left edge. */
@media (min-width: 1280px) {
  html body .stream-column .token-card {
    padding-top: 13px !important;
    /* Compensate for the Pulse grid's 1px outer edge so the visible left
       gap matches the cover's 13px top gap. */
    padding-left: 12px !important;
  }

  html body .token-card-top .token-identity {
    grid-template-columns: 63px minmax(0, 1fr) !important;
    padding-left: 0 !important;
  }

  html body .token-avatar-stack {
    width: 63px !important;
    gap: 10px !important;
  }

  html body .token-avatar-trigger,
  html body .token-avatar {
    width: 63px !important;
    height: 63px !important;
  }

  html body .token-avatar-stack > .token-ca-copy {
    width: 63px !important;
    margin-top: 3px !important;
  }

  html body .stream-column .risk-row {
    margin-left: 0 !important;
  }
}

@media (min-width: 900px) and (max-width: 1279px) {
  html body .stream-column .token-card {
    /* Match the cover's 6px top inset at this compact desktop width. */
    padding-left: 6px !important;
  }

  html body .token-card-top .token-identity {
    grid-template-columns: 39px minmax(0, 1fr) !important;
    padding-left: 0 !important;
  }

  html body .token-avatar-stack {
    width: 39px !important;
    justify-items: start !important;
    gap: 6px !important;
  }

  html body .token-avatar-trigger,
  html body .token-avatar {
    width: 39px !important;
    height: 39px !important;
  }

  html body .token-avatar-stack > .token-ca-copy {
    width: 39px !important;
    margin-top: 3px !important;
  }
}

/* Keep the lower token controls on one compact top baseline. The risk chips
   now begin at the same distance below the contract label as Quick Buy, while
   the card divider follows the controls without an empty lower strip. */
@media (min-width: 900px) {
  html body .stream-column .token-card {
    padding-bottom: 2px !important;
  }

  html body .stream-column .token-card-footer {
    align-items: flex-start !important;
    margin-top: 1px !important;
  }

  html body .stream-column .risk-row {
    align-self: flex-start !important;
    margin: 0 !important;
  }

  html body .stream-column .card-actions {
    align-self: flex-start !important;
    margin-bottom: -8px !important;
    transform: translateY(-8px) !important;
  }
}

@media (min-width: 900px) and (max-width: 1279px) {
  html body .stream-column .card-actions {
    margin-bottom: -5px !important;
    transform: translateY(-5px) !important;
  }
}

/* Action tooltips paint above the row without changing the token-card height. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
html body article.token-card:has(.card-action-button:hover),
  html body article.token-card:has(.card-action-button:focus-visible) {
  }
}

/* Trades always show the compact preset group on the toolbar's right edge. */
html body [data-wallet-manager-view="trades"] .wallet-manager-activity-controls {
  margin-left: auto;
}

html body .wallet-manager-filter-symbol {
  display: grid;
  width: 20px;
  height: 27px;
  flex: 0 0 20px;
  place-items: center;
  color: var(--text-muted);
}

html body .wallet-manager-filter-symbol svg {
  width: 11px;
  height: 11px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
}

/* Match Trades token covers to the network-badged covers used by Pulse. */
html body [data-wallet-manager-view="trades"] .wallet-manager-token-mark {
  position: relative;
  overflow: visible;
}

html body .wallet-manager-token-network {
  position: absolute;
  right: -2px;
  bottom: -2px;
  z-index: 3;
  display: grid;
  width: 9px;
  height: 9px;
  place-items: center;
  border: 1px solid var(--blue);
  border-radius: 50%;
  background: #07111d;
  box-sizing: border-box;
  box-shadow: 0 0 0 1.25px #07101a;
  pointer-events: none;
}

html body .wallet-manager-token-mark .wallet-manager-token-network img {
  position: static;
  width: 4.5px;
  height: 5.8px;
  border-radius: 0;
  object-fit: contain;
}

/* Compact the Pulse trading controls to 65% of their former footprint. Keep
   every inner element on the same scale and reclaim the toolbar's unused
   height so the feed begins immediately beneath the controls. */
@media (min-width: 900px) {
  html body .pulse-toolbar {
    min-height: 35px !important;
    margin-bottom: 4px !important;
  }

  html body .pulse-toolbar .page-heading {
    min-height: 35px !important;
    padding: 4px 0 !important;
  }

  html body .pulse-toolbar .command-bar {
    width: 197px !important;
    min-width: 197px !important;
    max-width: 197px !important;
    min-height: 26px !important;
    flex: 0 0 197px !important;
    gap: 5px !important;
    padding-inline: 5px !important;
  }

  html body .pulse-toolbar .parallel-control-item {
    margin: 0 !important;
  }

  html body .pulse-toolbar .command-button {
    width: 75px !important;
    min-width: 75px !important;
    height: 26px !important;
    min-height: 26px !important;
    flex: 0 0 75px !important;
    gap: 4px !important;
    padding: 0 7px !important;
    font-size: 7.5px !important;
  }

  html body .pulse-toolbar .command-button svg {
    width: 9px !important;
    height: 9px !important;
  }

  html body .pulse-toolbar .alert-label {
    min-width: 43px !important;
    grid-template-columns: 29px 13px !important;
    gap: 1px !important;
  }

  html body .pulse-toolbar .quick-buy-setting {
    box-sizing: border-box !important;
    width: 107px !important;
    min-width: 107px !important;
    height: 26px !important;
    min-height: 26px !important;
    flex: 0 0 107px !important;
    gap: 2px !important;
    padding: 2px !important;
    border-radius: 7px !important;
    font-size: 6.5px !important;
  }

  html body .pulse-toolbar .quick-buy-toggle {
    width: 47px !important;
    min-width: 47px !important;
    height: 18px !important;
    min-height: 18px !important;
    flex: 0 0 47px !important;
    gap: 1px !important;
    padding: 0 4px !important;
    border-radius: 5px !important;
  }

  html body .pulse-toolbar .quick-buy-toggle > span {
    width: 36px !important;
    font-size: 6.5px !important;
  }

  html body .pulse-toolbar .quick-buy-state {
    width: 16px !important;
    min-width: 16px !important;
    font-size: 5px !important;
    letter-spacing: 0.08em !important;
  }

  html body .pulse-toolbar .quick-buy-amount {
    flex: 1 1 auto !important;
    gap: 3px !important;
    padding-left: 2px !important;
  }

  html body .pulse-toolbar .quick-buy-setting img {
    width: 8px !important;
    height: 10px !important;
  }

  html body .pulse-toolbar .quick-buy-setting input {
    width: 35px !important;
    height: 18px !important;
    min-height: 18px !important;
    padding: 0 3px !important;
    border-radius: 5px !important;
    font-size: 7px !important;
  }

  html body .pulse-grid {
    height: calc(100dvh - 170px) !important;
  }
}

/* Scale only the four token-risk pills to 70% of their former footprint.
   Their footer stays in normal flow so the action row keeps its baseline. */
@media (min-width: 900px) {
  html body .stream-column .risk-row {
    min-height: 14px !important;
    height: 14px !important;
    align-items: center !important;
    gap: 3px !important;
  }

  html body .stream-column .risk-chip {
    box-sizing: border-box !important;
    min-width: 27px !important;
    height: 14px !important;
    min-height: 14px !important;
    padding: 0 5px !important;
    gap: 2px !important;
    font-size: 6.3px !important;
    line-height: 8px !important;
  }

  html body .stream-column .risk-chip svg {
    width: 8px !important;
    height: 8px !important;
  }
}

/* Risk hints always open below the green/DS pill on the viewport layer. The
   hovered card keeps exactly the same padding, so its divider never moves. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body .token-card .risk-chip::after {
    top: var(--coin-context-tooltip-y, 0px) !important;
    bottom: auto !important;
    transform: translate(-50%, -3px) !important;
  }

  html body .token-card .risk-chip:hover::after,
  html body .token-card .risk-chip:focus-visible::after {
    transform: translate(-50%, 0) !important;
  }

html body .stream-column article.token-card:has(.risk-chip:hover),
  html body .stream-column article.token-card:has(.risk-chip:focus-visible) {
  }
}

/* Reference-style token identity: the cover owns most of the left column,
   the compact CA sits directly beneath it, and the risk pills start beside
   the cover on the same text column as the token name and metadata. */
@media (min-width: 1280px) {
  html body .token-card-top .token-identity {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    column-gap: 12px !important;
  }

  html body .token-avatar-stack {
    width: 72px !important;
    gap: 4px !important;
  }

  html body .token-avatar-trigger,
  html body .token-avatar {
    width: 72px !important;
    height: 72px !important;
  }

  html body .token-avatar-stack > .token-ca-copy {
    width: 72px !important;
    margin-top: 0 !important;
    text-align: center !important;
  }

  html body .stream-column .risk-row {
    margin-left: 84px !important;
  }
}

/* The in-app browser uses this compact desktop range. Keep the same reference
   layout here instead of falling back to the old 39px cover/left-aligned pills. */
@media (min-width: 900px) and (max-width: 1279px) {
  html body .token-card-top .token-identity {
    grid-template-columns: 60px minmax(0, 1fr) !important;
    column-gap: 8px !important;
  }

  html body .token-avatar-stack {
    width: 60px !important;
    gap: 4px !important;
  }

  html body .token-avatar-trigger,
  html body .token-avatar {
    width: 60px !important;
    height: 60px !important;
  }

  html body .token-avatar-stack > .token-ca-copy {
    width: 60px !important;
    margin-top: 0 !important;
    text-align: center !important;
  }

  html body .stream-column .risk-row {
    margin-left: 68px !important;
  }
}

/* Anchor the lower controls beside the cover instead of stacking them beneath
   the CA. This lets the divider sit four pixels below the gray address—the
   same spacing used between the cover and that address. */
@media (min-width: 900px) {
  html body .stream-column .token-card {
    position: relative !important;
    padding-bottom: 1px !important;
  }

  html body .stream-column .token-card-footer {
    position: absolute !important;
    z-index: 2 !important;
    right: 16px !important;
    bottom: 2px !important;
    width: auto !important;
    margin: 0 !important;
  }
}

@media (min-width: 900px) and (max-width: 1279px) {
  html body .stream-column .token-card {
    min-height: 0 !important;
    padding-bottom: 1px !important;
  }

  html body .stream-column .token-card-footer {
    left: 6px !important;
  }
}

@media (min-width: 1280px) {
  html body .stream-column .token-card-footer {
    left: 12px !important;
  }
}

@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
html body .stream-column article.token-card:has(.risk-chip:hover),
  html body .stream-column article.token-card:has(.risk-chip:focus-visible),
  html body .stream-column article.token-card:has(.card-action-button:hover),
  html body .stream-column article.token-card:has(.card-action-button:focus-visible) {
  }

  html body .stream-column article.token-card:has(.risk-chip:hover) > .token-card-footer,
  html body .stream-column article.token-card:has(.risk-chip:focus-visible) > .token-card-footer,
  html body .stream-column article.token-card:has(.card-action-button:hover) > .token-card-footer,
  html body .stream-column article.token-card:has(.card-action-button:focus-visible) > .token-card-footer {
    z-index: 2 !important;
  }
}

/* Hover zoom belongs to the cover art only. Scaling the avatar wrapper also
   scales and shifts its Sui badge, making the droplet appear off-centre. */
@media (hover: hover) and (pointer: fine) {
  html body .token-avatar-trigger:hover .token-avatar,
  html body .token-avatar-trigger:focus-visible .token-avatar,
  html body .token-avatar-trigger.is-preview-open .token-avatar {
    transform: none !important;
  }
}

/* Centre the wallet icon, Sui balance and chevron as one group. The pill's
   dimensions stay fixed; only its previously left-heavy contents move right. */
@media (min-width: 900px) {
  html body .parallel-stable-wallet {
    justify-content: center !important;
  }
}

/* Preserve the footer's three-part composition while scaling its complete
   visual system down to roughly three quarters of the previous footprint. */
@media (min-width: 900px) {
  :root {
    --parallel-footer-h: 26px;
    --parallel-footer-market-width: 63px;
  }

  html body .status-bar {
    height: var(--parallel-footer-h) !important;
    min-height: var(--parallel-footer-h) !important;
    gap: 9px !important;
    padding-inline: 9px !important;
    font-size: 7px !important;
    line-height: 10px !important;
  }

  html body .status-bar > .parallel-preset-trigger {
    box-sizing: border-box !important;
    height: 17px !important;
    min-height: 17px !important;
    padding: 0 5px !important;
    gap: 4px !important;
    border-radius: 3px !important;
    font-size: 8px !important;
    line-height: 1 !important;
  }

  html body .status-bar > .parallel-preset-trigger::before {
    width: 9px !important;
    height: 7px !important;
    background:
      linear-gradient(currentColor 0 0) 0 0 / 9px 1px,
      linear-gradient(currentColor 0 0) 2px 3px / 7px 1px,
      linear-gradient(currentColor 0 0) 0 6px / 5px 1px !important;
    background-repeat: no-repeat !important;
  }

  html body .status-bar > :is(.status-items, .parallel-footer-center) {
    gap: 9px !important;
    font-size: 7px !important;
    line-height: 10px !important;
  }

  html body .status-items button {
    height: 17px !important;
    min-height: 17px !important;
    padding: 0 6px !important;
    border-radius: 3px !important;
    font-size: 7px !important;
    line-height: 1 !important;
  }

  html body .status-right {
    gap: 6px !important;
  }

  html body .status-actions {
    gap: 4px !important;
  }

  html body .status-action {
    box-sizing: border-box !important;
    height: 19px !important;
    min-height: 19px !important;
    padding: 0 6px !important;
    gap: 4px !important;
    border-radius: 5px !important;
    font-size: 8px !important;
    line-height: 1 !important;
  }

  html body .status-action svg {
    width: 9px !important;
    height: 9px !important;
  }

  html body .status-separator {
    height: 14px !important;
  }

  html body .status-market {
    width: var(--parallel-footer-market-width) !important;
    min-width: var(--parallel-footer-market-width) !important;
    max-width: var(--parallel-footer-market-width) !important;
    height: var(--parallel-footer-h) !important;
    padding: 0 6px !important;
    grid-template-columns: 8px max-content !important;
    column-gap: 5px !important;
    font-size: 7px !important;
    line-height: 10px !important;
  }

  html body .status-market > img {
    width: 8px !important;
    height: 10px !important;
  }

  html body .status-market > strong {
    width: 37px !important;
    min-width: 37px !important;
    height: 11px !important;
    font-size: 7px !important;
  }
}

/* Social context cards stay on the viewport layer: compact website details
   and richer real-account X profiles never reflow or resize a token row. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body .token-card .token-meta {
    position: relative !important;
    top: -2px !important;
    left: -2px !important;
    transform: none !important;
  }

  html body .website-social::after {
    display: none !important;
    content: none !important;
  }

  html body .token-card :is(.x-profile-preview, .website-preview) {
    box-sizing: border-box !important;
    position: fixed !important;
    z-index: 20000 !important;
    top: var(--social-preview-y, 0px) !important;
    left: var(--social-preview-x, 0px) !important;
    display: block !important;
    border: 1px solid color-mix(in srgb, var(--border-strong) 88%, var(--blue)) !important;
    background: color-mix(in srgb, var(--bg-elevated) 96%, #101a28) !important;
    box-shadow: 0 16px 38px rgba(0, 0, 0, .46) !important;
    color: var(--text-soft) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translate(-50%, -3px) !important;
    transform-origin: center top !important;
    transition: opacity 120ms ease, transform 120ms ease, visibility 120ms step-end !important;
    visibility: hidden !important;
  }

  html body .token-card .x-profile-preview {
    width: 252px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 10px !important;
    font-family: var(--font-sans) !important;
    text-align: left !important;
  }

  html body .token-card .website-preview {
    width: 178px !important;
    padding: 7px 9px !important;
    border-radius: 6px !important;
    font-family: var(--font-mono) !important;
    text-align: left !important;
  }

  html body .x-social:hover .x-profile-preview,
  html body .x-social:focus-visible .x-profile-preview,
  html body .website-social:hover .website-preview,
  html body .website-social:focus-visible .website-preview {
    opacity: 1 !important;
    transform: translate(-50%, 0) !important;
    visibility: visible !important;
    transition: opacity 120ms ease, transform 120ms ease, visibility 0s !important;
  }

  html body .x-social:hover .x-profile-preview,
  html body .x-social:focus-visible .x-profile-preview {
    pointer-events: auto !important;
  }

  html body .x-social::before {
    position: fixed !important;
    z-index: 19999 !important;
    top: calc(var(--social-preview-y, 0px) - 5px) !important;
    left: calc(var(--social-preview-x, 0px) - 126px) !important;
    width: 252px !important;
    height: 7px !important;
    content: "" !important;
    pointer-events: none !important;
  }

  html body .x-social:hover::before,
  html body .x-social:focus-visible::before {
    pointer-events: auto !important;
  }

  html body .website-preview-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    line-height: 1 !important;
  }

  html body .website-preview-head b {
    min-width: 0 !important;
    overflow: hidden !important;
    color: var(--text) !important;
    font-size: 8.5px !important;
    font-weight: 750 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body .website-preview-head em {
    flex: 0 0 auto !important;
    color: var(--positive) !important;
    font-size: 6.5px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    letter-spacing: .05em !important;
  }

  html body .website-preview > small {
    display: block !important;
    margin-top: 5px !important;
    overflow: hidden !important;
    color: var(--text-muted) !important;
    font-size: 7px !important;
    line-height: 1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body .x-preview-cover {
    display: block !important;
    height: 38px !important;
    background:
      radial-gradient(circle at 78% 35%, color-mix(in srgb, var(--social-color) 38%, transparent), transparent 34%),
      linear-gradient(122deg, color-mix(in srgb, var(--social-color) 28%, #172334), #101720 64%, color-mix(in srgb, var(--social-color) 18%, #101720)) !important;
  }

  html body .x-preview-body {
    display: block !important;
    padding: 0 10px 10px !important;
  }

  html body .x-preview-head {
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) 18px !important;
    min-height: 36px !important;
    align-items: end !important;
    gap: 7px !important;
    margin-top: -16px !important;
  }

  html body .x-preview-avatar {
    display: grid !important;
    width: 36px !important;
    height: 36px !important;
    place-items: center !important;
    border: 2px solid var(--bg-elevated) !important;
    border-radius: 50% !important;
    background: color-mix(in srgb, var(--social-color) 30%, #111a24) !important;
    color: color-mix(in srgb, var(--social-color) 64%, white) !important;
    font-family: var(--font-mono) !important;
    font-size: 8px !important;
    font-weight: 800 !important;
  }

  html body .x-preview-identity {
    min-width: 0 !important;
    padding-bottom: 2px !important;
  }

  html body .x-preview-identity b {
    display: flex !important;
    min-width: 0 !important;
    align-items: center !important;
    gap: 4px !important;
    overflow: hidden !important;
    color: var(--text) !important;
    font-size: 9.5px !important;
    line-height: 1.2 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body .x-preview-identity b i {
    display: inline-grid !important;
    width: 10px !important;
    height: 10px !important;
    flex: 0 0 10px !important;
    place-items: center !important;
    border-radius: 50% !important;
    background: var(--blue) !important;
    color: #06101d !important;
    font-size: 6.5px !important;
    font-style: normal !important;
  }

  html body .x-preview-identity small {
    display: block !important;
    margin-top: 2px !important;
    color: var(--text-muted) !important;
    font-family: var(--font-mono) !important;
    font-size: 7px !important;
    line-height: 1 !important;
  }

  html body .x-preview-brand {
    display: grid !important;
    width: 18px !important;
    height: 18px !important;
    margin-bottom: 4px !important;
    place-items: center !important;
    color: var(--text) !important;
  }

  html body .x-preview-brand .x-brand-mark {
    width: 13px !important;
    height: 13px !important;
  }

  html body .x-preview-bio {
    display: block !important;
    margin-top: 8px !important;
    color: var(--text-soft) !important;
    font-size: 8px !important;
    line-height: 1.45 !important;
  }

  html body .x-preview-meta,
  html body .x-preview-stats {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 7px !important;
    color: var(--text-muted) !important;
    font-size: 7px !important;
    line-height: 1.2 !important;
  }

  html body .x-preview-meta {
    justify-content: space-between !important;
  }

  html body .x-preview-stats b {
    color: var(--text) !important;
    font-size: 7.5px !important;
  }

  html body .x-preview-action {
    display: grid !important;
    height: 22px !important;
    margin-top: 8px !important;
    place-items: center !important;
    border: 1px solid color-mix(in srgb, var(--blue) 48%, var(--border-strong)) !important;
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--blue) 7%, transparent) !important;
    color: var(--blue) !important;
    font-size: 7.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
  }
}

/* One shared foreground tier for every token-card overlay. The active card's
   transparent content layer must sit above its absolute footer, later rows,
   and the custom scrollbar; otherwise risk pills cut through menus/previews. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body article.token-card:has(.token-context:hover),
  html body article.token-card:has(.token-context:focus-within),
  html body article.token-card:has(.holder-count:hover),
  html body article.token-card:has(.holder-count:focus-visible),
  html body article.token-card:has([data-copy-tooltip]:hover),
  html body article.token-card:has([data-copy-tooltip]:focus-visible),
  html body article.token-card:has([data-social-preview]:hover),
  html body article.token-card:has([data-social-preview]:focus-visible) {
    overflow: visible !important;
    isolation: auto !important;
  }

  html body article.token-card:has(.token-context:hover) > .token-card-top,
  html body article.token-card:has(.token-context:focus-within) > .token-card-top,
  html body article.token-card:has(.holder-count:hover) > .token-card-top,
  html body article.token-card:has(.holder-count:focus-visible) > .token-card-top,
  html body article.token-card:has([data-copy-tooltip]:hover) > .token-card-top,
  html body article.token-card:has([data-copy-tooltip]:focus-visible) > .token-card-top,
  html body article.token-card:has([data-social-preview]:hover) > .token-card-top,
  html body article.token-card:has([data-social-preview]:focus-visible) > .token-card-top {
    z-index: 30001 !important;
  }

  html body article.token-card:has(.risk-chip:hover) > .token-card-footer,
  html body article.token-card:has(.risk-chip:focus-visible) > .token-card-footer,
  html body article.token-card:has(.card-action-button:hover) > .token-card-footer,
  html body article.token-card:has(.card-action-button:focus-visible) > .token-card-footer {
    z-index: 30001 !important;
  }

  html body .token-card .token-context-menu,
  html body .token-card .token-name-copy[data-copy-tooltip]::after,
  html body .token-card .holder-count::after,
  html body .token-card .risk-chip::after,
  html body .token-card .card-action-button::after,
  html body .token-card .x-profile-preview,
  html body .token-card .website-preview {
    z-index: 30002 !important;
  }
}

/* Subtle whole-row hover, inspired by the reference. When the synced custom
   scrollbar is present, its exact eight-pixel gutter stays on the resting
   surface colour so the rail reads as one uninterrupted top-to-bottom strip. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body article.token-card:hover {
    --pulse-row-hover-bg: color-mix(
      in srgb,
      var(--parallel-bg-hover) 46%,
      var(--parallel-bg)
    );
    background: var(--pulse-row-hover-bg) !important;
  }

  html body .stream-column:has(.stream-scrollbar:not(.inactive)) article.token-card:hover {
    background: linear-gradient(
      to right,
      var(--pulse-row-hover-bg) 0 calc(100% - 8px),
      var(--parallel-bg) calc(100% - 8px) 100%
    ) !important;
  }
}

/* Risk and action hints must not raise the identity layer above the absolute
   footer. That stacking inversion repeatedly moved the hovered pill behind the
   identity, producing a hover/lost-hover loop and a flashing tooltip. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body .stream-column article.token-card:has(.risk-chip:hover) > .token-card-top,
  html body .stream-column article.token-card:has(.risk-chip:focus-visible) > .token-card-top,
  html body .stream-column article.token-card:has(.card-action-button:hover) > .token-card-top,
  html body .stream-column article.token-card:has(.card-action-button:focus-visible) > .token-card-top {
    z-index: 1 !important;
  }

  html body .stream-column article.token-card:has(.risk-chip:hover) > .token-card-footer,
  html body .stream-column article.token-card:has(.risk-chip:focus-visible) > .token-card-footer,
  html body .stream-column article.token-card:has(.card-action-button:hover) > .token-card-footer,
  html body .stream-column article.token-card:has(.card-action-button:focus-visible) > .token-card-footer {
    z-index: 30001 !important;
  }
}

/* Compact the desktop market search vertically while preserving enough width
   for the complete placeholder. The slash shortcut is a true horizontal pill
   instead of a nearly full-height rounded square. */
@media (min-width: 1020px) {
  html body .topbar-search.parallel-stable-search,
  html body .topbar-search.parallel-stable-search:focus-within {
    height: 26px !important;
    min-height: 26px !important;
    gap: 5px !important;
    padding: 0 30px 0 9px !important;
  }

  html body .topbar-search.parallel-stable-search > svg,
  html body .topbar-search.parallel-stable-search:focus-within > svg {
    width: 13px !important;
    height: 13px !important;
    flex-basis: 13px !important;
  }

  html body .topbar-search.parallel-stable-search .parallel-search-slash {
    right: 5px !important;
    width: 21px !important;
    min-width: 21px !important;
    height: 15px !important;
    min-height: 15px !important;
    flex-basis: 21px !important;
    border-radius: 999px !important;
    font-size: 7.5px !important;
    line-height: 1 !important;
  }
}
/* Compact wallet dropdown: preserve every control while reducing the panel's
   overall footprint and using one consistent spacing rhythm. */
html body #walletPanel.wallet-panel {
  top: 48px;
  right: 8px !important;
  width: min(238px, calc(100vw - 16px)) !important;
  max-height: calc(100vh - 54px) !important;
  padding: 6px !important;
  border-radius: 8px !important;
}

html body #walletPanel .panel-header {
  min-height: 15px !important;
  margin-bottom: 3px !important;
}

html body #walletPanel .panel-header h2 {
  font-size: 11px !important;
  line-height: 15px !important;
}

html body #walletPanel .wallet-summary {
  min-height: 48px !important;
  margin-bottom: 4px !important;
  padding: 5px 7px !important;
  border-radius: 7px !important;
}

html body #walletPanel .wallet-summary::after {
  top: -21px !important;
  right: -10px !important;
  width: 92px !important;
  height: 103px !important;
}

html body #walletPanel .wallet-summary span,
html body #walletPanel .wallet-summary small {
  font-size: 6.5px !important;
}

html body #walletPanel .wallet-summary strong {
  margin: 2px 0 1px !important;
  font-size: 15px !important;
}

html body #walletPanel .wallet-address-copy,
html body #walletPanel .wallet-row-copy {
  width: 12px !important;
  height: 12px !important;
}

html body #walletPanel .wallet-address-copy svg,
html body #walletPanel .wallet-row-copy svg {
  width: 8px !important;
  height: 8px !important;
}

html body #walletPanel .wallet-list {
  border-radius: 8px !important;
}

html body #walletPanel .wallet-row {
  grid-template-columns: minmax(0, 1fr) 20px 20px !important;
  min-height: 35px !important;
}

html body #walletPanel .wallet-row:first-child {
  border-radius: 7px 7px 0 0 !important;
}

html body #walletPanel .wallet-row:last-child {
  border-radius: 0 0 7px 7px !important;
}

html body #walletPanel .wallet-select {
  grid-template-columns: 20px minmax(0, 1fr) max-content !important;
  min-height: 35px !important;
  padding: 2px 1px 2px 4px !important;
}

html body #walletPanel .wallet-avatar,
html body #walletPanel .wallet-delete,
html body #walletPanel .wallet-primary {
  width: 18px !important;
  height: 18px !important;
  border-radius: 5px !important;
}

html body #walletPanel .wallet-avatar {
  font-size: 6px !important;
}

html body #walletPanel .wallet-delete svg,
html body #walletPanel .wallet-primary svg {
  width: 8px !important;
  height: 8px !important;
}

html body #walletPanel .wallet-name-line {
  gap: 2px !important;
}

html body #walletPanel .wallet-name-line,
html body #walletPanel .wallet-address-line,
html body #walletPanel .wallet-row-balance,
html body #walletPanel .wallet-row b,
html body #walletPanel .wallet-row small {
  line-height: 1.1 !important;
}

html body #walletPanel .wallet-name-line b {
  max-width: 72px !important;
  font-size: 7.5px !important;
}

html body #walletPanel .wallet-rename {
  width: 11px !important;
  height: 11px !important;
  flex-basis: 11px !important;
}

html body #walletPanel .wallet-rename svg {
  width: 7px !important;
  height: 7px !important;
}

html body #walletPanel .wallet-address-line small,
html body #walletPanel .wallet-row-balance small {
  margin-top: 1px !important;
  font-size: 5.75px !important;
}

html body #walletPanel .wallet-row-balance b {
  font-size: 7px !important;
}

html body #walletPanel .wallet-actions-grid {
  gap: 3px !important;
  margin: 4px 0 !important;
}

html body #walletPanel .wallet-actions-grid button {
  min-height: 25px !important;
  gap: 4px !important;
  padding: 0 4px !important;
  border-radius: 6px !important;
  font-size: 7px !important;
}

html body #walletPanel .wallet-actions-grid .wallet-action-icon {
  width: 15px !important;
  height: 15px !important;
  border-radius: 4px !important;
}

html body #walletPanel .wallet-actions-grid .wallet-action-icon svg,
html body #walletPanel .wallet-actions-grid .wallet-import-mark {
  width: 9px !important;
  height: 9px !important;
}

html body #walletPanel .wallet-actions-grid .wallet-action-symbol {
  font-size: 12px !important;
}

html body #walletPanel .wallet-transfer-actions {
  gap: 4px !important;
}

html body #walletPanel .wallet-transfer-actions button {
  min-height: 26px !important;
  font-size: 7.5px !important;
}

/* Compact profile affordance and account menu, modelled on the supplied
   reference while staying within the terminal's existing density. */
html body .profile-menu-trigger {
  position: relative;
  display: grid;
  width: 30px;
  min-width: 30px;
  height: 30px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #f7f9fc;
  cursor: pointer;
}

html body .profile-menu-trigger,
html body .profile-menu-trigger:hover,
html body .profile-menu-trigger:focus,
html body .profile-menu-trigger:focus-visible,
html body .profile-menu-trigger[aria-expanded="true"] {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .profile-avatar {
  position: relative;
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  border: 0;
  outline: 0;
  border-radius: 999px;
  background-color: #6d5cff;
  background-image: var(--profile-avatar-gradient, linear-gradient(135deg, #ff4fd8, #7857ff 48%, #26d9ff));
  background-position: center;
  background-size: cover;
  box-shadow: none;
  opacity: 0;
  overflow: hidden;
}

html body .profile-avatar.is-ready {
  opacity: 1;
}

html body .profile-avatar::after {
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  background: linear-gradient(145deg, rgba(255, 255, 255, .32), transparent 42%, rgba(0, 0, 0, .16));
  content: "";
  pointer-events: none;
}

html body .profile-menu-trigger:hover .profile-avatar,
html body .profile-menu-trigger[aria-expanded="true"] .profile-avatar {
  border: 0;
  outline: 0;
  box-shadow: none;
  filter: saturate(1.12) brightness(1.06);
}

html body .profile-notification-badge {
  position: absolute;
  z-index: 2;
  top: -2px;
  right: -2px;
  display: inline-grid;
  min-width: 14px;
  height: 14px;
  padding: 0 3px;
  place-items: center;
  border: 2px solid var(--bg);
  border-radius: 999px;
  background: var(--negative);
  color: #fff;
  font: 800 7px/1 var(--font-mono);
}

html body .profile-notification-badge[hidden],
html body .profile-menu-notification-count[hidden] {
  display: none !important;
}

html body .profile-menu {
  position: fixed;
  inset: auto;
  z-index: 2147483647;
  top: 56px;
  right: 8px;
  width: min(190px, calc(100vw - 16px));
  margin: 0 !important;
  padding: 6px;
  border: 1px solid var(--border-strong);
  border-radius: 7px;
  background: color-mix(in srgb, var(--bg-elevated) 96%, #fff 4%);
  box-shadow: 0 16px 38px rgba(0, 0, 0, .46);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: none;
  transform-origin: top right;
  transition: none;
}

/* Native popovers live in the browser top layer, so the account menu stays
   above sticky rails, dialogs, and token hover surfaces after a click. */
html body .profile-menu[popover]:not(:popover-open) {
  display: none !important;
}

html body .profile-menu[popover]:popover-open {
  display: block !important;
}

html body .profile-menu.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

html body .profile-menu-item {
  display: grid;
  grid-template-columns: 17px minmax(0, 1fr) auto;
  width: 100%;
  min-height: 31px;
  align-items: center;
  gap: 7px;
  padding: 0 7px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--text-soft);
  cursor: default;
  font-size: 9.5px;
  font-weight: 675;
  line-height: 1;
  text-align: left;
}

html body .profile-menu-item:hover,
html body .profile-menu-item:focus-visible {
  outline: 0;
  background: var(--surface-hover);
  color: var(--text);
}

html body .profile-menu-item > svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.75;
}

html body .profile-menu-item[data-profile-menu-item="updates"],
html body .profile-menu-logout {
  margin-top: 3px;
}

html body .profile-menu-notification-count {
  display: inline-grid;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  place-items: center;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: var(--surface-3);
  color: var(--text-soft);
  font: 750 7px/1 var(--font-mono);
}

html body .profile-menu-logout,
html body .profile-menu-logout:hover,
html body .profile-menu-logout:focus-visible {
  color: var(--negative);
}

html[data-theme="light"] body .profile-avatar {
  border: 0;
  outline: 0;
  box-shadow: none;
}

html[data-theme="light"] body .parallel-stable-network .sui-wordmark {
  filter: brightness(0) !important;
}

html[data-theme="light"] body .parallel-stable-wallet .wallet-icon,
html[data-theme="light"] body .parallel-stable-wallet .wallet-icon svg {
  color: #080b10 !important;
}

/* Match the wallet pill to the compact global-search pill at desktop widths. */
@media (min-width: 1020px) {
  html body .parallel-stable-wallet {
    height: 26px !important;
    min-height: 26px !important;
  }
}

/* Axiom-reference silhouette for desktop Pulse rows. The cover and name keep
   their existing horizontal anchor while the lower information bands gain the
   same breathing room, edge inset, and control proportions as the reference. */
@media (min-width: 900px) {
  html body .stream-column .token-card {
    container: parallel-token-card / inline-size;
    height: 116px !important;
    min-height: 116px !important;
    padding: 13px 24px 1px 12px !important;
  }

  html body .stream-column .token-avatar-stack {
    gap: 9px !important;
  }

  html body .stream-column .token-meta {
    position: relative !important;
    top: 3px !important;
    left: -2px !important;
    transform: none !important;
  }

  html body .stream-column .token-performance {
    transform: translateY(3px) !important;
  }

  html body .stream-column .token-card-footer {
    right: 24px !important;
    bottom: 12px !important;
    left: 12px !important;
    gap: 4px !important;
  }

  html body .stream-column .risk-row {
    height: 20px !important;
    min-height: 20px !important;
    align-items: center !important;
    gap: 5px !important;
  }

  html body .stream-column .risk-chip {
    box-sizing: border-box !important;
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 7px !important;
    flex: 0 0 auto !important;
    gap: 4px !important;
    border-radius: 6px !important;
    font-size: 8.5px !important;
    line-height: 11px !important;
  }

  html body .stream-column .risk-chip:nth-child(1) {
    width: 54px !important;
    min-width: 54px !important;
  }

  html body .stream-column .risk-chip:nth-child(2) {
    width: 59px !important;
    min-width: 59px !important;
  }

  html body .stream-column .risk-chip:nth-child(3) {
    width: 50px !important;
    min-width: 50px !important;
  }

  html body .stream-column .risk-chip:nth-child(4) {
    width: 48px !important;
    min-width: 48px !important;
  }

  html body .stream-column .risk-chip svg {
    width: 11px !important;
    height: 11px !important;
  }

  html body .stream-column .card-actions {
    gap: 4px !important;
    margin-bottom: -8px !important;
    transform: translateY(-8px) !important;
  }

  html body .stream-column :is(.watch-button, .token-safety-button) {
    width: 22px !important;
    height: 26px !important;
    border-radius: 6px !important;
  }

  html body .stream-column :is(.watch-button, .token-safety-button) svg {
    width: 13px !important;
    height: 13px !important;
  }

  html body .stream-column .quick-buy {
    box-sizing: border-box !important;
    width: 68px !important;
    min-width: 68px !important;
    height: 26px !important;
    min-height: 26px !important;
    justify-content: center !important;
    gap: 5px !important;
    padding: 0 10px !important;
    font-size: 9.5px !important;
  }

  html body .stream-column .quick-buy img {
    width: 10px !important;
    height: 13px !important;
  }
}

@container parallel-token-card (max-width: 420px) {
  html body .stream-column .risk-row {
    height: 18px !important;
    min-height: 18px !important;
    gap: 3px !important;
  }

  html body .stream-column .risk-chip {
    height: 18px !important;
    min-height: 18px !important;
    padding: 0 4px !important;
    gap: 2px !important;
    font-size: 7px !important;
    line-height: 9px !important;
  }

  html body .stream-column .risk-chip:nth-child(1) {
    width: 33px !important;
    min-width: 33px !important;
  }

  html body .stream-column .risk-chip:nth-child(2) {
    width: 36px !important;
    min-width: 36px !important;
  }

  html body .stream-column .risk-chip:nth-child(3),
  html body .stream-column .risk-chip:nth-child(4) {
    width: 33px !important;
    min-width: 33px !important;
  }

  html body .stream-column .risk-chip svg {
    width: 9px !important;
    height: 9px !important;
  }
}

/* Axiom responsive contract -------------------------------------------------
   Three feeds genuinely compress until 1024px. Below that threshold the
   workspace becomes one active feed with a tab rail, and below 700px the
   desktop chrome is exchanged for the compact trading header and bottom nav. */
html body :is(.mobile-paste-ca, .mobile-bottom-nav, .responsive-stream-switcher) {
  display: none;
}

@media (min-width: 701px) {
  html body .topbar.parallel-stable-header {
    height: 59px !important;
    min-height: 59px !important;
  }

  html body .parallel-stable-brand,
  html body .parallel-stable-actions {
    height: 59px !important;
  }

  html body .market-strip {
    height: 34px !important;
    min-height: 34px !important;
  }

  html body .pulse-toolbar,
  html body .pulse-toolbar .page-heading {
    min-height: 55px !important;
  }

  html body .pulse-toolbar {
    margin-bottom: 4px !important;
  }

  html body .pulse-grid {
    height: calc(100dvh - 206px) !important;
  }
}

/* The cover is 72px wide and its Sui badge protrudes 2px beyond that edge.
   Reserve a constant outer gutter before the metrics and keep equal spacing
   between pills at every responsive width. */
html body .stream-column .risk-row {
  margin-left: 84px !important;
  gap: 5px !important;
}

html body .stream-column .token-avatar > .token-avatar-network {
  right: -2px !important;
}

/* Remove the browser's rectangular focus ring from editable controls. Their
   existing field or pill wrapper remains the visible focus indicator. */
html body :is(input, textarea, select, [contenteditable="true"]):focus,
html body :is(input, textarea, select, [contenteditable="true"]):focus-visible {
  outline: 0 !important;
  outline-offset: 0 !important;
}

/* Match the Sui hover/background capsule to the theme toggle's vertical
   footprint while preserving the extra width required by the wordmark. */
@media (min-width: 701px) {
  html body .parallel-stable-network,
  html body .parallel-stable-theme {
    box-sizing: border-box !important;
    height: 30px !important;
    min-height: 30px !important;
    padding-block: 0 !important;
    border-radius: 999px !important;
  }
}

@media (min-width: 1024px) {
  html body .pulse-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    padding-bottom: 0 !important;
    overflow: hidden !important;
    scroll-snap-type: none !important;
  }

  html body .stream-column {
    display: flex !important;
    min-width: 0 !important;
    scroll-snap-align: none !important;
  }

  html body .stream-column .token-card {
    height: 116px !important;
    min-height: 116px !important;
    padding: 13px 24px 1px 12px !important;
  }

  html body .stream-column .token-identity {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    column-gap: 11px !important;
  }

  html body .stream-column .token-avatar-stack,
  html body .stream-column .token-avatar-stack > .token-ca-copy {
    width: 72px !important;
  }

  html body .stream-column :is(.token-avatar-trigger, .token-avatar) {
    width: 72px !important;
    height: 72px !important;
  }

  html body .stream-column .token-card-footer {
    right: 24px !important;
    bottom: 12px !important;
    left: 12px !important;
  }

  html body .stream-column .risk-row {
    height: 20px !important;
    min-height: 20px !important;
    gap: 5px !important;
  }

  html body .stream-column .risk-chip {
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 7px !important;
    gap: 4px !important;
    border-radius: 6px !important;
    font-size: 8.5px !important;
    line-height: 11px !important;
  }

  html body .stream-column .risk-chip:nth-child(1) { width: 54px !important; min-width: 54px !important; }
  html body .stream-column .risk-chip:nth-child(2) { width: 59px !important; min-width: 59px !important; }
  html body .stream-column .risk-chip:nth-child(3) { width: 50px !important; min-width: 50px !important; }
  html body .stream-column .risk-chip:nth-child(4) { width: 48px !important; min-width: 48px !important; }

  html body .stream-column .risk-chip svg {
    width: 11px !important;
    height: 11px !important;
  }
}

/* Compact the desktop wordmark and surrounding actions while preserving the
   navigation rail; the complete search pill is restored by the final override. */
@media (min-width: 1024px) and (max-width: 1519px) {
  html body .parallel-stable-header {
    grid-template-columns: 42px minmax(0, 1fr) max-content !important;
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 12px !important;
    column-gap: 6px !important;
  }

  html body .parallel-stable-brand {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
  }

  html body .parallel-stable-brand .brand-name {
    display: none !important;
  }

  html body .parallel-stable-brand .parallel-stable-mark {
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
  }

  html body .primary-nav.pt-refined-nav-group.parallel-nav-cluster {
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    gap: 1px !important;
    overflow: hidden !important;
  }

  html body .primary-nav .nav-item {
    display: inline-flex !important;
    min-width: 0 !important;
    height: 30px !important;
    padding: 0 9px !important;
    font-size: 10.5px !important;
    white-space: nowrap !important;
  }

  html body .parallel-stable-actions {
    position: relative !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 48px !important;
    gap: 5px !important;
    justify-self: end !important;
  }

  html body .parallel-stable-search:not(:focus-within) {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
  }

  html body .parallel-stable-search:not(:focus-within) > svg {
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    margin: 0 !important;
  }

  html body .parallel-stable-search:not(:focus-within) :is(input, .parallel-search-slash) {
    display: none !important;
  }

  html body .parallel-stable-search:focus-within {
    position: absolute !important;
    z-index: 20 !important;
    right: 0 !important;
    width: min(260px, calc(100vw - 24px)) !important;
    min-width: 180px !important;
    height: 30px !important;
    padding: 0 30px 0 9px !important;
  }

  html body .parallel-stable-search:focus-within input {
    display: block !important;
    width: 100% !important;
    flex: 1 1 auto !important;
    opacity: 1 !important;
  }

  html body .parallel-stable-search:focus-within .parallel-search-slash {
    display: inline-grid !important;
  }

  /* The compressed three-column references prioritize market data; card
     actions return in the dedicated mobile composition below. */
  html body .stream-column .card-actions {
    display: none !important;
  }
}

@media (min-width: 1024px) and (max-width: 1120px) {
  html body .primary-nav .nav-item:nth-child(n + 5) {
    display: none !important;
  }

  html body .parallel-stable-wallet {
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    padding: 0 7px !important;
    gap: 4px !important;
  }

  html body .parallel-stable-wallet .wallet-copy {
    display: none !important;
  }

  html body .stream-header {
    grid-template-columns: minmax(28px, max-content) minmax(40px, 1fr) max-content !important;
    padding: 0 6px !important;
    gap: 4px !important;
  }

  html body .stream-title {
    min-width: 0 !important;
    max-width: 54px !important;
    overflow: hidden !important;
  }

  html body .stream-title h2 {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body .stream-search {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 92px !important;
  }

  html body .stream-column .token-card {
    height: 140px !important;
    min-height: 140px !important;
  }

  html body .stream-column .token-card-top {
    grid-template-columns: minmax(0, 1fr) 92px !important;
    gap: 6px !important;
  }

  html body .stream-column .token-name-row,
  html body .stream-column .token-meta {
    max-width: 100% !important;
    overflow: hidden !important;
  }

  html body .stream-column .token-name-copy > span {
    font-size: 12.5px !important;
  }

  html body .stream-column .token-context-trigger {
    font-size: 8.5px !important;
  }

  html body .stream-column .token-meta {
    gap: 5px !important;
    font-size: 9px !important;
  }

  html body .stream-column .token-stat-line b {
    font-size: 12px !important;
  }

  html body .stream-column .token-stat-line small,
  html body .stream-column .token-tx-stat b {
    font-size: 8px !important;
  }
}

/* Single-stream desktop/tablet state: the tab rail becomes the first row in
   the panel and only its selected feed participates in layout. */
@media (max-width: 1023px) {
  html,
  body {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html body {
    overflow-x: hidden !important;
  }

  html body .main-content {
    padding: 8px 12px 12px !important;
  }

  html body .pulse-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 45px minmax(0, 1fr) !important;
    width: 100% !important;
    height: calc(100dvh - 206px) !important;
    min-height: 420px !important;
    padding: 0 !important;
    overflow: hidden !important;
    scroll-snap-type: none !important;
  }

  html body .responsive-stream-switcher {
    display: flex !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    align-items: stretch !important;
    gap: 18px !important;
    padding: 0 20px !important;
    overflow: hidden !important;
    border-bottom: 1px solid var(--border) !important;
    background: var(--surface) !important;
  }

  html body .responsive-stream-switcher > button {
    position: relative !important;
    display: inline-flex !important;
    min-width: max-content !important;
    height: 44px !important;
    align-items: center !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--text-muted) !important;
    font-size: 12px !important;
    font-weight: 730 !important;
    cursor: pointer !important;
  }

  html body .responsive-stream-switcher > button.active {
    color: var(--text) !important;
  }

  html body .responsive-stream-switcher > button.active::after {
    position: absolute !important;
    right: 0 !important;
    bottom: 1px !important;
    left: 0 !important;
    height: 2px !important;
    background: var(--text) !important;
    content: "" !important;
  }

  html body .responsive-stream-network,
  html body .responsive-stream-preset {
    display: none !important;
  }

  html body .stream-column {
    display: none !important;
    grid-column: 1 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
    height: 100% !important;
    border-right: 0 !important;
    scroll-snap-align: none !important;
  }

  html body .stream-column.is-compact-active {
    display: flex !important;
  }

  html body .stream-header {
    height: 47px !important;
    min-height: 47px !important;
    flex-basis: 47px !important;
    grid-template-columns: max-content minmax(0, 1fr) max-content !important;
    padding: 0 12px !important;
    gap: 10px !important;
  }

  html body .stream-title h2 {
    font-size: 12px !important;
  }

  html body .stream-search {
    width: min(100%, 200px) !important;
    max-width: 200px !important;
    height: 29px !important;
  }

  html body .stream-scrollbar {
    top: 49px !important;
  }

  html body .stream-column .token-card {
    container: parallel-token-card / inline-size;
    height: 140px !important;
    min-height: 140px !important;
    padding: 13px 24px 1px 12px !important;
  }

  html body .stream-column .token-card-top {
    grid-template-columns: minmax(0, 1fr) 108px !important;
    gap: 10px !important;
  }

  html body .stream-column .token-name-copy > span {
    font-size: 14px !important;
  }

  html body .stream-column .token-context-trigger {
    font-size: 9px !important;
  }

  html body .stream-column .token-meta {
    gap: 6px !important;
    font-size: 9.5px !important;
  }

  html body .stream-column .token-stat-line b {
    font-size: 13px !important;
  }

  html body .stream-column .token-stat-line small,
  html body .stream-column .token-tx-stat b {
    font-size: 8px !important;
  }

  html body .stream-column .token-identity {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    column-gap: 11px !important;
  }

  html body .stream-column .token-avatar-stack,
  html body .stream-column .token-avatar-stack > .token-ca-copy {
    width: 72px !important;
  }

  html body .stream-column :is(.token-avatar-trigger, .token-avatar) {
    width: 72px !important;
    height: 72px !important;
  }

  html body .stream-column .token-card-footer {
    position: absolute !important;
    right: 24px !important;
    bottom: 12px !important;
    left: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 6px !important;
    margin: 0 !important;
  }

  html body .stream-column .risk-row {
    height: 20px !important;
    min-height: 20px !important;
    gap: 5px !important;
  }

  html body .stream-column .risk-chip {
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 7px !important;
    gap: 4px !important;
    border-radius: 6px !important;
    font-size: 8.5px !important;
    line-height: 11px !important;
  }

  html body .stream-column .risk-chip:nth-child(1) { width: 54px !important; min-width: 54px !important; }
  html body .stream-column .risk-chip:nth-child(2) { width: 59px !important; min-width: 59px !important; }
  html body .stream-column .risk-chip:nth-child(3) { width: 50px !important; min-width: 50px !important; }
  html body .stream-column .risk-chip:nth-child(4) { width: 48px !important; min-width: 48px !important; }

  html body .stream-column .risk-chip svg {
    width: 11px !important;
    height: 11px !important;
  }

  html body .stream-column .card-actions {
    display: none !important;
  }

  html body .mobile-menu {
    display: none !important;
  }
}

@media (min-width: 701px) and (max-width: 1023px) {
  html body .parallel-stable-header {
    grid-template-columns: 42px minmax(0, 1fr) max-content !important;
    min-height: 59px !important;
    padding: 0 10px !important;
    column-gap: 4px !important;
  }

  html body .parallel-stable-brand {
    width: 42px !important;
    min-width: 42px !important;
  }

  html body .parallel-stable-brand .brand-name {
    display: none !important;
  }

  html body .primary-nav.pt-refined-nav-group.parallel-nav-cluster {
    display: flex !important;
    min-width: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
  }

  html body .primary-nav .nav-item {
    display: inline-flex !important;
    min-width: 0 !important;
    padding: 0 7px !important;
    font-size: 9.5px !important;
    white-space: nowrap !important;
  }

  html body .primary-nav .nav-item:nth-child(n + 5) {
    display: none !important;
  }

  html body .parallel-stable-actions {
    height: 59px !important;
    gap: 4px !important;
  }

  html body .parallel-stable-network {
    width: 48px !important;
    min-width: 48px !important;
  }

  html body .parallel-stable-theme {
    width: 32px !important;
    min-width: 32px !important;
  }

  html body .parallel-stable-wallet {
    width: 38px !important;
    min-width: 38px !important;
    padding: 0 !important;
  }

  html body .parallel-stable-wallet :is(.wallet-copy, .chevron) {
    display: none !important;
  }
}

/* Mobile mirrors Axiom's separate shell: no ticker strip or desktop toolbar,
   an account/search row above the stream tabs, and a fixed five-item nav. */
@media (max-width: 700px) {
  html body .app-shell {
    min-height: 100dvh !important;
    padding-bottom: 64px !important;
  }

  html body .topbar.parallel-stable-header {
    position: sticky !important;
    top: 0 !important;
    display: grid !important;
    grid-template-columns: 24px minmax(0, 1fr) !important;
    width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 7px !important;
    gap: 5px !important;
    border-bottom: 1px solid var(--border) !important;
  }

  html body .parallel-stable-brand {
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 42px !important;
  }

  html body .parallel-stable-brand .brand-name {
    display: none !important;
  }

  html body .parallel-stable-brand .parallel-stable-mark {
    width: 12px !important;
    height: 12px !important;
    margin: 0 !important;
  }

  html body .primary-nav,
  html body .parallel-stable-network,
  html body .parallel-stable-theme,
  html body .market-strip,
  html body .pulse-toolbar {
    display: none !important;
  }

  html body .topbar-actions.parallel-stable-actions {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    justify-content: flex-end !important;
    gap: 5px !important;
  }

  html body .parallel-stable-wallet {
    order: 1 !important;
    width: 91px !important;
    min-width: 91px !important;
    max-width: 91px !important;
    height: 31px !important;
    min-height: 31px !important;
    gap: 4px !important;
    padding: 0 8px !important;
    border-radius: 999px !important;
  }

  html body .parallel-stable-wallet .wallet-copy {
    display: flex !important;
  }

  html body .parallel-stable-wallet .wallet-copy b {
    font-size: 9px !important;
  }

  html body .parallel-stable-wallet .chevron {
    display: block !important;
    width: 10px !important;
    height: 10px !important;
    flex: 0 0 10px !important;
  }

  html body .mobile-paste-ca {
    order: 2 !important;
    display: inline-flex !important;
    width: 81px !important;
    min-width: 81px !important;
    height: 31px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 0 8px !important;
    border: 1px solid var(--border) !important;
    border-radius: 999px !important;
    background: var(--surface-2) !important;
    color: var(--text) !important;
    font-size: 8.5px !important;
    font-weight: 750 !important;
    white-space: nowrap !important;
  }

  html body .mobile-paste-ca svg {
    width: 12px !important;
    height: 12px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
  }

  html body .parallel-stable-search:not(:focus-within) {
    order: 3 !important;
    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;
    height: 31px !important;
    flex: 0 0 31px !important;
    justify-content: center !important;
    padding: 0 !important;
    border-radius: 50% !important;
  }

  html body .parallel-stable-search:not(:focus-within) :is(input, .parallel-search-slash) {
    display: none !important;
  }

  html body .parallel-stable-search:focus-within {
    position: absolute !important;
    z-index: 50 !important;
    right: 0 !important;
    width: min(300px, calc(100vw - 36px)) !important;
    height: 31px !important;
    padding: 0 30px 0 9px !important;
  }

  html body .profile-menu-trigger {
    order: 4 !important;
    width: 31px !important;
    min-width: 31px !important;
    height: 31px !important;
  }

  html body .mobile-menu {
    order: 5 !important;
    display: grid !important;
    width: 31px !important;
    min-width: 31px !important;
    height: 31px !important;
  }

  html body .main-content {
    width: 100% !important;
    height: calc(100dvh - 106px) !important;
    min-height: 0 !important;
    padding: 4px 4px 0 !important;
  }

  html body .pulse-grid {
    grid-template-rows: 52px minmax(0, 1fr) !important;
    height: 100% !important;
    min-height: 0 !important;
    border-radius: 4px !important;
  }

  html body .responsive-stream-switcher {
    display: flex !important;
    height: 52px !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 0 9px !important;
    overflow: hidden !important;
  }

  html body .responsive-stream-network {
    display: inline-flex !important;
    width: 61px !important;
    min-width: 61px !important;
    height: 31px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 0 9px !important;
    border: 1px solid var(--border) !important;
    border-radius: 999px !important;
    background: var(--surface-2) !important;
    color: var(--text) !important;
  }

  html body .responsive-stream-network img {
    width: 11px !important;
    height: 14px !important;
  }

  html body .responsive-stream-network b {
    font-size: 9px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  html body .responsive-stream-network i {
    display: none !important;
  }

  html body .responsive-stream-switcher > button {
    height: 31px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    font-size: 10px !important;
  }

  html body .responsive-stream-switcher > button.active {
    background: var(--surface-3) !important;
  }

  html body .responsive-stream-switcher > button.active::after {
    content: none !important;
  }

  html body .responsive-stream-preset {
    display: inline-flex !important;
    min-width: 45px !important;
    height: 31px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    border: 1px solid var(--border) !important;
    border-radius: 999px !important;
    color: var(--text) !important;
    font-size: 9px !important;
  }

  html body .responsive-stream-preset svg {
    width: 14px !important;
    height: 14px !important;
    fill: none !important;
    stroke: var(--blue) !important;
    stroke-width: 1.7 !important;
  }

  html body .stream-column.is-compact-active {
    grid-row: 2 !important;
  }

  html body .stream-column .stream-header {
    display: none !important;
  }

  html body .stream-scrollbar {
    top: 2px !important;
  }

  html body .stream-column .token-card {
    height: 142px !important;
    min-height: 142px !important;
    padding: 12px 18px 1px 11px !important;
  }

  html body .stream-column .token-card-top {
    grid-template-columns: minmax(0, 1fr) 101px !important;
    gap: 8px !important;
  }

  html body .stream-column .token-identity {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    column-gap: 11px !important;
  }

  html body .stream-column .token-avatar-stack,
  html body .stream-column .token-avatar-stack > .token-ca-copy {
    width: 72px !important;
  }

  html body .stream-column :is(.token-avatar-trigger, .token-avatar) {
    width: 72px !important;
    height: 72px !important;
  }

  html body .stream-column .token-name-row {
    min-width: 0 !important;
    gap: 4px !important;
  }

  html body .stream-column .token-name-copy > span {
    font-size: 13px !important;
  }

  html body .stream-column .token-context-trigger {
    max-width: 58px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body .stream-column .token-meta {
    width: max-content !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    overflow: hidden !important;
    font-size: 9px !important;
    line-height: 14px !important;
    white-space: nowrap !important;
  }

  html body .stream-column .token-meta > :is(.token-age, .holder-count, .token-social),
html body .stream-column .token-meta .social-trigger {
    flex-shrink: 0 !important;
  }

  html body .stream-column .token-meta :is(.x-profile-preview, .website-preview) {
    display: none !important;
  }

  html body .stream-column .token-stat-line b {
    font-size: 12px !important;
  }

  html body .stream-column .token-tx-stat b,
  html body .stream-column .token-stat-line small {
    font-size: 8px !important;
  }

  html body .stream-column .token-card-footer {
    right: 18px !important;
    bottom: 10px !important;
    left: 11px !important;
  }

  html body .stream-column .card-actions {
    display: flex !important;
    margin: 0 !important;
    transform: none !important;
  }

  html body .stream-column .card-actions > :not(.quick-buy) {
    display: none !important;
  }

  html body .stream-column .quick-buy {
    display: inline-flex !important;
    width: 68px !important;
    min-width: 68px !important;
    height: 26px !important;
    min-height: 26px !important;
    justify-content: center !important;
  }

  html body .mobile-bottom-nav {
    position: fixed !important;
    z-index: 80 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    width: 100% !important;
    box-sizing: border-box !important;
    height: 64px !important;
    min-height: 64px !important;
    padding: 5px 5px 4px !important;
    overflow: visible !important;
    border-top: 1px solid var(--border) !important;
    background: color-mix(in srgb, var(--surface) 96%, transparent) !important;
    backdrop-filter: blur(18px) !important;
  }

  html body .mobile-bottom-nav button {
    display: grid !important;
    height: 54px !important;
    min-height: 54px !important;
    grid-template-rows: 28px 14px !important;
    place-items: center !important;
    align-content: center !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--text-muted) !important;
    font-size: 8px !important;
    line-height: 12px !important;
  }

  html body .mobile-bottom-nav button > span {
    display: block !important;
    min-width: 0 !important;
    min-height: 12px !important;
    overflow: visible !important;
    color: inherit !important;
    font-size: 8px !important;
    line-height: 12px !important;
    opacity: 1 !important;
    visibility: visible !important;
    white-space: nowrap !important;
  }

  html body .mobile-bottom-nav button.active {
    background: transparent !important;
    box-shadow: none !important;
    color: var(--text) !important;
    outline: 0 !important;
    transform: none !important;
  }

  html body .mobile-bottom-nav button:is(:hover, :focus, :focus-visible, :active),
  html body .mobile-bottom-nav button.active:is(:hover, :focus, :focus-visible, :active) {
    background: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
    transform: none !important;
  }

  html body .mobile-bottom-nav button::before,
  html body .mobile-bottom-nav button::after {
    display: none !important;
    content: none !important;
  }

  html body .mobile-bottom-nav svg {
    width: 18px !important;
    height: 18px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.7 !important;
  }

  html body .mobile-bottom-nav button.active svg {
    color: var(--blue) !important;
  }

  html body .status-bar {
    display: none !important;
  }
}

/* The wallet tracker entrance animation retains opacity/transform values after
   opening. Important drag-state values let pointer hold and movement visibly
   fade the panel in the same way as the PnL tracker. */
html body .wallet-manager-window.dragging {
  filter: blur(2.4px) !important;
  opacity: 0.62 !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.28) !important;
  cursor: grabbing !important;
  transform: scale(1) !important;
}

/* Match Axiom's fully rounded metric capsules without changing the existing
   chip widths, icon scale or spacing. */
html body .stream-column .risk-chip {
  border-radius: 999px !important;
}

/* Protocol badge labels use the body-level tooltip, outside clipped coin art. */
html body .stream-column .token-avatar-network {
  pointer-events: auto !important;
  overflow: visible !important;
}

/* Larger invisible hover target; the badge art and row dimensions stay put. */
html body .stream-column .token-avatar-network::before {
  content: "";
  position: absolute;
  width: 30px;
  height: 30px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
}

html body .stream-column .token-avatar-network img {
  pointer-events: none !important;
}

html body .token-protocol-context {
  z-index: 30003;
  max-width: 128px !important;
  padding: 3px 5px !important;
  border: 1px solid var(--border-strong) !important;
  border-radius: 4px !important;
  background: var(--bg-elevated) !important;
  box-shadow: var(--panel-shadow) !important;
  color: var(--text-soft) !important;
  font: 600 6.5px/1.1 var(--twk-everett-page) !important;
}

/* Neutral pill surfaces follow the pair beneath them, including hover and
   light mode. Keep every status text/icon colour and existing dimension. */
html body .stream-column .token-card .risk-chip {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
}

@media (max-width: 430px) {
  html body .parallel-stable-wallet {
    width: 84px !important;
    min-width: 84px !important;
  }

  html body .mobile-paste-ca {
    width: 71px !important;
    min-width: 71px !important;
    padding-inline: 6px !important;
  }

  html body .responsive-stream-switcher {
    gap: 2px !important;
    padding-inline: 6px !important;
  }

  html body .responsive-stream-network {
    width: 57px !important;
    min-width: 57px !important;
    padding-inline: 6px !important;
  }

  html body .responsive-stream-switcher > button {
    padding-inline: 7px !important;
    font-size: 9px !important;
  }

  html body .responsive-stream-preset {
    min-width: 41px !important;
  }
}

/* Keep the complete global-search pill throughout the three-column desktop
   layout. Below 1024px the navigation and content switch together, so the
   compact magnifier state can take over without crowding the final News item. */
@media (min-width: 1024px) and (max-width: 1519px) {
  html body .topbar-search.parallel-stable-search,
  html body .topbar-search.parallel-stable-search:focus-within {
    position: relative !important;
    right: auto !important;
    z-index: 1 !important;
    display: flex !important;
    width: 235px !important;
    min-width: 235px !important;
    max-width: 235px !important;
    height: 26px !important;
    min-height: 26px !important;
    flex: 0 0 235px !important;
    justify-content: flex-start !important;
    gap: 5px !important;
    padding: 0 30px 0 9px !important;
    border-radius: 999px !important;
  }

  html body .topbar-search.parallel-stable-search > svg,
  html body .topbar-search.parallel-stable-search:focus-within > svg {
    display: block !important;
    width: 13px !important;
    height: 13px !important;
    flex: 0 0 13px !important;
    margin: 0 !important;
    transform: none !important;
  }

  html body .topbar-search.parallel-stable-search:not(:focus-within) input,
  html body .topbar-search.parallel-stable-search:focus-within input {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    padding: 0 2px !important;
    opacity: 1 !important;
  }

  html body .topbar-search.parallel-stable-search .parallel-search-slash,
  html body .topbar-search.parallel-stable-search:focus-within .parallel-search-slash {
    display: inline-grid !important;
  }
}

@media (min-width: 1024px) and (max-width: 1139px) {
  html body .primary-nav .nav-item:nth-child(n + 5) {
    display: inline-flex !important;
  }
}

@media (min-width: 701px) and (max-width: 1023px) {
  html body .topbar-search.parallel-stable-search:not(:focus-within) {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    flex: 0 0 30px !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
  }

  html body .topbar-search.parallel-stable-search:not(:focus-within) > svg {
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 14px !important;
    margin: 0 !important;
  }

  html body .topbar-search.parallel-stable-search:not(:focus-within) :is(input, .parallel-search-slash) {
    display: none !important;
  }
}

/* Axiom-style hover safety rail. These destructive controls live on the
   cover's left edge and appear only while the row is being inspected. */
@media (min-width: 701px) and (hover: hover) and (pointer: fine) {
  html body .stream-column .token-avatar-stack,
  html body .stream-column .token-card-top,
  html body .stream-column .token-identity {
    overflow: visible !important;
  }

  html body .stream-column .token-hover-safety {
    position: absolute !important;
    z-index: 28 !important;
    top: 1px !important;
    /* Leave only the rail's rightmost eight pixels over the cover. The rest
       sits in the card's left inset, matching Axiom without crossing the
       stream boundary at compact desktop widths. */
    left: -10px !important;
    display: grid !important;
    width: 18px !important;
    grid-template-rows: repeat(2, 18px) !important;
    gap: 4px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
    transform: none !important;
    transition: none !important;
  }

  html body .stream-column .token-card:hover .token-hover-safety,
  html body .stream-column .token-card:focus-within .token-hover-safety {
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
    transform: none !important;
  }

  html body .stream-column .token-hover-safety .token-safety-button {
    position: relative !important;
    display: grid !important;
    box-sizing: border-box !important;
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    padding: 0 !important;
    place-items: center !important;
    border: 1px solid #2b3442 !important;
    border-radius: 4px !important;
    background: rgba(12, 16, 23, 0.96) !important;
    box-shadow: 1px 0 4px rgba(0, 0, 0, 0.28) !important;
    color: #6f7f96 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    transition: none !important;
    will-change: auto !important;
    backdrop-filter: blur(5px) !important;
  }

  html body .stream-column .token-hover-safety .token-safety-button + .token-safety-button {
    margin-top: 0 !important;
  }

  html body .stream-column .token-hover-safety .token-safety-button:hover,
  html body .stream-column .token-hover-safety .token-safety-button:focus-visible {
    z-index: 2 !important;
    border-color: #46536a !important;
    background: #171d27 !important;
    color: #aab7c9 !important;
    box-shadow:
      inset 0 0 0 1px color-mix(in srgb, var(--blue) 16%, transparent),
      2px 3px 8px rgba(0, 0, 0, 0.34) !important;
    outline: 0 !important;
    transform: none !important;
  }

  html body .stream-column .token-hover-safety .token-safety-button:active {
    transform: none !important;
  }

  html body .stream-column .token-hover-safety .token-safety-button svg {
    width: 10px !important;
    height: 10px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    stroke-width: 1.8 !important;
  }

  /* Restore the tactile header motion that the stability layer intentionally
     removed while the responsive shell was being locked. */
  html body .parallel-stable-network,
  html body .parallel-stable-theme {
    transform: translate3d(0, 0, 0) !important;
    transform-style: preserve-3d !important;
    transition:
      color 150ms ease,
      background-color 150ms ease,
      box-shadow 150ms ease,
      transform 160ms cubic-bezier(0.16, 1, 0.3, 1) !important;
    will-change: transform !important;
  }

  html body .parallel-stable-network:hover,
  html body .parallel-stable-network:focus-visible,
  html body .parallel-stable-theme:hover,
  html body .parallel-stable-theme:focus-visible {
    border-color: transparent !important;
    background: color-mix(in srgb, var(--blue) 12%, transparent) !important;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--blue) 12%, transparent) !important;
    color: var(--blue) !important;
    outline: 0 !important;
    transform:
      perspective(135px)
      rotateX(var(--header-rotate-x, 0deg))
      rotateY(var(--header-rotate-y, 0deg))
      translate3d(var(--header-shift-x, 0px), calc(-3px + var(--header-shift-y, 0px)), 10px) !important;
  }

  html body .parallel-stable-network:active,
  html body .parallel-stable-theme:active {
    transform: translateY(0) scale(0.95) !important;
  }
}

/* Later responsive rules narrowed the navigation rail with overflow clipping,
   which shaved the top edge from its blue hover surface. Keep the responsive
   widths, but let the complete tab paint within the header. */
@media (min-width: 701px) {
  html body .topbar.parallel-stable-header,
  html body .primary-nav.pt-refined-nav-group.parallel-nav-cluster,
  html body .primary-nav .nav-item {
    overflow: visible !important;
  }
}

@media (max-width: 700px), (hover: none), (pointer: coarse) {
  html body .stream-column .token-hover-safety {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .parallel-stable-network,
  html body .parallel-stable-theme {
    transition-duration: 0.01ms !important;
  }
}

/* Pulse is a viewport-sized trading surface. Lock the document itself so the
   browser never exposes a second, outer scrollbar; stream lists retain their
   own contained scrolling for market rows. */
html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden !important;
  overscroll-behavior: none;
}

html body .app-shell {
  width: 100%;
  height: 100dvh;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* Axiom desktop chrome proportions. The primary header, secondary activity
   rail and fixed status footer use the same measured vertical scale as the
   supplied 100%-zoom reference. */
.pair-activity-control-label {
  display: none;
}

@media (min-width: 1024px) {
  :root {
    --parallel-footer-h: 35px;
    --parallel-footer-market-width: 82px;
    --parallel-inset-divider-h: 14px;
  }

  html body .app-shell {
    padding-bottom: var(--parallel-footer-h) !important;
  }

  html body .topbar.parallel-stable-header,
  html body .parallel-stable-brand,
  html body .parallel-stable-actions {
    height: 64px !important;
    min-height: 64px !important;
  }

  html body .market-strip {
    height: 28px !important;
    min-height: 28px !important;
  }

  html body .status-bar {
    height: var(--parallel-footer-h) !important;
    min-height: var(--parallel-footer-h) !important;
    gap: 12px !important;
    padding-inline: 12px !important;
    font-size: 8.5px !important;
    line-height: 12px !important;
  }

  html body .status-bar > .parallel-preset-trigger {
    height: 23px !important;
    min-height: 23px !important;
    padding: 0 7px !important;
    gap: 5px !important;
    font-size: 9px !important;
  }

  html body .status-bar > .parallel-preset-trigger::before {
    width: 11px !important;
    height: 9px !important;
    background:
      linear-gradient(currentColor 0 0) 0 0 / 11px 1px,
      linear-gradient(currentColor 0 0) 2px 4px / 9px 1px,
      linear-gradient(currentColor 0 0) 0 8px / 7px 1px !important;
    background-repeat: no-repeat !important;
  }

  html body .status-bar > :is(.status-items, .parallel-footer-center) {
    gap: 10px !important;
    font-size: 8px !important;
    line-height: 12px !important;
  }

  html body .status-items button {
    height: 22px !important;
    min-height: 22px !important;
    padding: 0 7px !important;
    font-size: 8px !important;
  }

  html body .status-right {
    gap: 8px !important;
  }

  html body .status-actions {
    gap: 5px !important;
  }

  html body .status-action {
    height: 25px !important;
    min-height: 25px !important;
    padding: 0 8px !important;
    gap: 5px !important;
    font-size: 9px !important;
  }

  html body .status-action svg {
    width: 11px !important;
    height: 11px !important;
  }

  html body .status-separator {
    height: var(--parallel-inset-divider-h) !important;
  }

  html body .status-market {
    width: var(--parallel-footer-market-width) !important;
    min-width: var(--parallel-footer-market-width) !important;
    max-width: var(--parallel-footer-market-width) !important;
    height: var(--parallel-footer-h) !important;
    padding: 0 8px !important;
    grid-template-columns: 11px max-content !important;
    column-gap: 6px !important;
    font-size: 8px !important;
    line-height: 12px !important;
  }

  html body .status-market > img {
    width: 11px !important;
    height: 14px !important;
  }

  html body .status-market > strong {
    width: 48px !important;
    min-width: 48px !important;
    height: 14px !important;
    font-size: 8.5px !important;
  }

  /* Keep the activity controls locked to the right. Their labels reveal into
     the unused left space, matching Axiom's compact icon-to-label hover. */
  html body .pair-activity-controls {
    position: relative !important;
    height: 28px !important;
    align-self: center !important;
    margin-left: 8px !important;
    border-left: 0 !important;
  }

  html body .pair-activity-controls::before,
  html body .pair-activity-controls button + button::before,
  html body .hotkeys-strip-action::before {
    position: absolute !important;
    top: 50% !important;
    left: 0 !important;
    width: 1px !important;
    height: 22px !important;
    background: var(--border) !important;
    content: "" !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
  }

  html body .pair-activity-controls button,
  html body .hotkeys-strip-action {
    --pair-control-hover-w: 126px;
    position: relative !important;
    display: inline-flex !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 22px !important;
    min-height: 22px !important;
    align-self: center !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    font-family: var(--font-mono) !important;
    color: var(--text-muted) !important;
    transition:
      width 150ms ease,
      min-width 150ms ease,
      gap 150ms ease,
      padding 150ms ease,
      color 130ms ease,
      background-color 130ms ease !important;
  }

  html body .pair-activity-controls button[data-pair-mode="recent"] {
    --pair-control-hover-w: 108px;
  }

  html body .hotkeys-strip-action {
    --pair-control-hover-w: 82px;
    flex: 0 0 auto !important;
  }

  html body .pair-activity-controls button.active {
    background: transparent !important;
    color: var(--blue) !important;
  }

  html body .pair-activity-controls button:is(:hover, :focus-visible),
  html body .hotkeys-strip-action:is(:hover, :focus-visible) {
    width: var(--pair-control-hover-w) !important;
    min-width: var(--pair-control-hover-w) !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    padding: 0 10px !important;
    background: var(--surface-2) !important;
    color: var(--text) !important;
    outline: 0 !important;
  }

  html body .pair-activity-controls svg,
  html body .hotkeys-strip-action svg {
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 14px !important;
  }

  html body .pair-activity-control-label {
    display: block !important;
    max-width: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    font-size: 8.5px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    transition: max-width 150ms ease, opacity 110ms ease !important;
  }

  html body :is(
    .pair-activity-controls button,
    .hotkeys-strip-action
  ):is(:hover, :focus-visible) .pair-activity-control-label {
    max-width: 104px !important;
    opacity: 1 !important;
  }

  html body .hotkeys-strip-action::after {
    display: none !important;
  }
}

/* Keep the right activity rail compact. Context is revealed as a small
   floating label rather than widening a control inside the rail. */
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
  html body .market-strip,
  html body .pair-activity,
  html body .pair-activity-controls,
  html body .pair-activity-controls button,
  html body .hotkeys-strip-action {
    overflow: visible !important;
  }

  html body .pair-activity-items {
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  html body .pair-activity-controls button:is(:hover, :focus-visible),
  html body .hotkeys-strip-action:is(:hover, :focus-visible) {
    width: 40px !important;
    min-width: 40px !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
  }

  html body .pair-activity-control-label {
    position: absolute !important;
    z-index: 90 !important;
    top: calc(100% + 5px) !important;
    left: 50% !important;
    display: block !important;
    width: max-content !important;
    max-width: none !important;
    padding: 4px 6px !important;
    overflow: visible !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
    background: var(--surface-2) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28) !important;
    color: var(--text-soft) !important;
    opacity: 0 !important;
    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    pointer-events: none !important;
    transform: translate(-50%, -3px) !important;
    transition: opacity 110ms ease, transform 110ms ease, visibility 110ms step-end !important;
    visibility: hidden !important;
    white-space: nowrap !important;
  }

  /* Edge controls always open their context back into the viewport instead
     of centring beyond the first or last visible pixel of the page. */
  html body .pair-activity-controls > :first-child .pair-activity-control-label {
    right: auto !important;
    left: 3px !important;
    transform: translateY(-3px) !important;
  }

  html body .pair-activity-controls > :last-child .pair-activity-control-label {
    right: 3px !important;
    left: auto !important;
    transform: translateY(-3px) !important;
  }

  html body :is(
    .pair-activity-controls button,
    .hotkeys-strip-action
  ):is(:hover, :focus-visible) .pair-activity-control-label {
    max-width: none !important;
    opacity: 1 !important;
    transform: translate(-50%, 0) !important;
    transition: opacity 110ms ease, transform 110ms ease, visibility 0s !important;
    visibility: visible !important;
  }

  html body .pair-activity-controls > :is(:first-child, :last-child):is(:hover, :focus-visible) .pair-activity-control-label {
    transform: translateY(0) !important;
  }
}

/* Metric pills size to their actual icon/value content. This removes the
   empty left/right space created by the earlier per-position fixed widths. */
@media (min-width: 701px) {
  html body .stream-column .risk-chip,
  html body .stream-column .risk-chip:nth-child(1),
  html body .stream-column .risk-chip:nth-child(2),
  html body .stream-column .risk-chip:nth-child(3),
  html body .stream-column .risk-chip:nth-child(4) {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    gap: 3px !important;
    padding-inline: 5px !important;
  }
}

/* Dedicated Axiom-style Pulse action notifications. They use their own
   top-centred stack so general application feedback keeps its existing home. */
html body .pulse-action-toast-region {
  position: fixed;
  z-index: 210;
  top: 72px;
  left: 50%;
  display: flex;
  width: min(310px, calc(100vw - 24px));
  flex-direction: column;
  align-items: center;
  gap: 8px;
  pointer-events: none;
  transform: translateX(-50%);
}

html body .toast.pulse-action-toast {
  display: grid;
  box-sizing: border-box;
  width: max-content;
  min-width: 188px;
  max-width: 100%;
  height: 52px;
  min-height: 52px;
  grid-template-columns: 18px max-content 18px;
  align-items: center;
  column-gap: 8px;
  padding: 0 11px;
  border: 1px solid #363a45;
  border-radius: 3px;
  background: #181a20;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
  color: #f0f2f7;
  pointer-events: auto;
  transform-origin: top center;
}

html body .toast.pulse-action-toast.is-dev-blacklisted {
  min-width: 274px;
}

html body .pulse-action-toast-icon {
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  color: #4266ff;
}

html body .pulse-action-toast-icon svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.65;
}

html body .toast.pulse-action-toast > b {
  width: auto;
  color: #f0f2f7;
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 650;
  line-height: 1;
  text-align: left;
  white-space: nowrap;
}

html body .toast.pulse-action-toast .top-notice-close {
  width: 18px;
  height: 18px;
  color: #727988;
}

html body .toast.pulse-action-toast .top-notice-close:hover,
html body .toast.pulse-action-toast .top-notice-close:focus-visible {
  color: #b7bdc9;
  outline: 0;
}

html body .toast.pulse-action-toast .top-notice-close svg {
  width: 14px;
  height: 14px;
  stroke-width: 1.8;
}

@media (max-width: 700px) {
  html body .pulse-action-toast-region {
    top: 50px;
  }

  html body .toast.pulse-action-toast.is-dev-blacklisted {
    min-width: min(274px, 100%);
  }
}

/* Reduce empty space inside the desktop wallet capsule while preserving the
   icon, balance and chevron as one centred group. */
@media (min-width: 1121px) {
  html body .parallel-stable-wallet {
    width: 104px !important;
    min-width: 104px !important;
    max-width: 104px !important;
    flex: 0 0 104px !important;
    gap: 5px !important;
    padding-inline: 6px !important;
  }
}

/* Keep the full desktop search affordance, but remove its unused horizontal
   space so it sits closer to the compact wallet and network controls. */
@media (min-width: 1024px) {
  html body .topbar-search.parallel-stable-search,
  html body .topbar-search.parallel-stable-search:focus-within {
    width: 175px !important;
    min-width: 175px !important;
    max-width: 175px !important;
    flex: 0 0 175px !important;
  }
}

/* Compact each desktop stream-header action group horizontally. The search
   copy remains complete, while the alert/filter buttons keep their hit height. */
@media (min-width: 1121px) {
  html body .stream-header {
    column-gap: 2px !important;
  }

  html body .stream-header .stream-search {
    width: 170px !important;
    min-width: 170px !important;
    max-width: 170px !important;
    padding-inline: 8px !important;
  }

  html body .stream-header .stream-tools {
    gap: 2px !important;
  }

  html body .stream-header .stream-tools button,
  html body .stream-header .stream-tools .stream-filter-button {
    width: 22px !important;
    min-width: 22px !important;
  }
}

/* Reclaim the compact brand column's unused trailing space so the navigation
   sits at the same visual distance from the mark as the tabs sit from one
   another. Keep the mark itself fixed and move the whole tab cluster together. */
@media (min-width: 701px) and (max-width: 1519px) {
  html body .primary-nav.pt-refined-nav-group.parallel-nav-cluster {
    justify-self: start !important;
    justify-content: flex-start !important;
    gap: 4px !important;
    margin-left: -12px !important;
    margin-right: 0 !important;
  }
}

/* At compact-desktop widths the placeholder uses the smaller header type.
   Match the capsule to that content so the shortcut follows the full copy
   instead of leaving a wide, inactive strip between them. */
@media (min-width: 1024px) and (max-width: 1279px) {
  html body .topbar-search.parallel-stable-search,
  html body .topbar-search.parallel-stable-search:focus-within {
    width: 164px !important;
    min-width: 164px !important;
    max-width: 164px !important;
    flex: 0 0 164px !important;
    gap: 4px !important;
    padding-right: 27px !important;
  }
}

/* The compact desktop cover is 72px wide, so align the lower metrics with its
   right edge and keep the Sui badge inside that edge. This removes the badge / 
   first-pill collision without consuming the action area. */
@media (min-width: 900px) and (max-width: 1279px) {
  html body .stream-column .token-card-footer {
    right: 18px !important;
  }

  html body .stream-column .risk-row {
    margin-left: 84px !important;
  }

  html body .stream-column .token-avatar > .token-avatar-network {
    right: -2px !important;
  }
}

/* Card actions use available row space instead of a viewport-wide hide rule.
   Quick Buy is the persistent primary action; Watchlist is the first optional
   control removed when an individual card truly becomes too narrow. */
@media (min-width: 701px) {
  html body .stream-column .card-actions {
    display: flex !important;
    align-items: center !important;
    gap: 2px !important;
    margin: 0 !important;
    transform: none !important;
  }

  html body .stream-column .watch-button {
    display: grid !important;
    width: 20px !important;
    min-width: 20px !important;
  }

  html body .stream-column .quick-buy {
    display: inline-flex !important;
    width: 64px !important;
    min-width: 64px !important;
    padding-inline: 8px !important;
  }
}

@container parallel-token-card (max-width: 430px) {
  html body .stream-column .watch-button {
    display: none !important;
  }

  html body .stream-column .quick-buy {
    display: inline-flex !important;
  }
}

/* Quick Buy is a solid primary action. On compressed multi-column cards it
   leaves the normal flow, then returns above the row while that coin is being
   inspected. Touch layouts keep the action visible because they have no hover. */
html body .stream-column .quick-buy {
  width: auto !important;
  min-width: 64px !important;
  border-color: #526fff !important;
  background: #526fff !important;
  color: #05070c !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12) inset !important;
  white-space: nowrap !important;
}

html body .stream-column .quick-buy:hover,
html body .stream-column .quick-buy:focus-visible {
  border-color: #7088ff !important;
  background: #7088ff !important;
  color: #05070c !important;
}

html body .stream-column .quick-buy:disabled {
  border-color: var(--border) !important;
  background: var(--surface-2) !important;
  color: var(--text-muted) !important;
  box-shadow: none !important;
}

html body .stream-column .quick-buy b {
  color: inherit !important;
  font: inherit !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

@media (hover: hover) and (pointer: fine) {
  html body .stream-column .token-card:hover {
    z-index: 60 !important;
  }

  @container parallel-token-card (max-width: 520px) {
    html body .stream-column .token-card-footer {
      overflow: visible !important;
    }

    html body .stream-column .card-actions {
      position: absolute !important;
      z-index: 80 !important;
      right: 0 !important;
      bottom: 0 !important;
      display: flex !important;
      margin: 0 !important;
      opacity: 0 !important;
      pointer-events: none !important;
      transform: none !important;
      transition: none !important;
      visibility: hidden !important;
    }

    html body .stream-column .card-actions > :not(.quick-buy) {
      display: none !important;
    }

    html body .stream-column .token-card:is(:hover, :focus-within) .card-actions {
      opacity: 1 !important;
      pointer-events: auto !important;
      transform: none !important;
      visibility: visible !important;
    }
  }
}

/* Stream-header priority: the complete search control keeps one stable width.
   The title owns the remaining track and only ellipsizes at the exact point
   where its full copy would otherwise collide with search. */
@media (min-width: 701px) {
  html body .stream-header {
    grid-template-columns: minmax(0, 1fr) 190px max-content !important;
    column-gap: 4px !important;
  }

  html body .stream-header .stream-title {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: hidden !important;
  }

  html body .stream-header .stream-title h2 {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body .stream-header .stream-search {
    width: 190px !important;
    min-width: 190px !important;
    max-width: 190px !important;
    justify-self: end !important;
    flex: 0 0 190px !important;
    padding-inline: 8px !important;
  }
}

/* When the balance copy is intentionally hidden, centre the wallet glyph and
   chevron as a compact pair with an even optical gap on both sides. */
@media (min-width: 1024px) and (max-width: 1120px) {
  html body .parallel-stable-wallet {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    flex: 0 0 44px !important;
    justify-content: center !important;
    gap: 3px !important;
    padding-inline: 5px !important;
  }

  html body .parallel-stable-wallet .wallet-icon {
    width: 14px !important;
    height: 14px !important;
    flex-basis: 14px !important;
  }

  html body .parallel-stable-wallet .wallet-icon svg {
    width: 13px !important;
    height: 13px !important;
  }

  html body .parallel-stable-wallet .chevron {
    width: 10px !important;
    height: 10px !important;
    flex-basis: 10px !important;
  }
}

/* Tablet header: distribute every compact action on one even rhythm and keep
   the wallet's disclosure chevron visible beside its centred glyph. */
@media (min-width: 701px) and (max-width: 1023px) {
  html body .parallel-stable-actions {
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
  }

  html body .parallel-stable-network {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    justify-content: center !important;
    gap: 4px !important;
  }

  html body .parallel-stable-wallet {
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    flex: 0 0 48px !important;
    justify-content: center !important;
    gap: 3px !important;
    padding-inline: 5px !important;
  }

  html body .parallel-stable-wallet .wallet-copy {
    display: none !important;
  }

  html body .parallel-stable-wallet .wallet-icon {
    width: 14px !important;
    height: 14px !important;
    flex-basis: 14px !important;
  }

  html body .parallel-stable-wallet .wallet-icon svg {
    width: 13px !important;
    height: 13px !important;
  }

  html body .parallel-stable-wallet .chevron {
    display: block !important;
    width: 10px !important;
    height: 10px !important;
    flex: 0 0 10px !important;
  }

  /* Preserve the desktop panel silhouette when only one feed is active. */
  html body .pulse-grid {
    overflow: hidden !important;
    border: 1px solid var(--border-strong) !important;
    border-radius: 8px !important;
    background: var(--surface) !important;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 2%, transparent) !important;
  }

  html body .responsive-stream-switcher {
    border-radius: 7px 7px 0 0 !important;
    background: var(--surface) !important;
  }

  html body .stream-column.is-compact-active {
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 0 7px 7px !important;
    background: var(--surface) !important;
  }

  html body .stream-column.is-compact-active :is(.stream-header, .stream-list) {
    background: var(--surface) !important;
  }
}

/* A direct file:// page cannot reliably load an external SVG as a CSS mask in
   Edge. Embed the existing Parallel mark so every instance retains its normal
   current-colour treatment without depending on cross-file mask permissions. */
html body .parallel-logo-mark {
  -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCIgZmlsbD0ibm9uZSI+CiAgPHBhdGggZD0iTTUuNCA3LjVIMjUuNE00IDE0SDI0TTIuNiAyMC41SDIyLjYiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyLjUiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiLz4KPC9zdmc+Cg==") center / contain no-repeat !important;
  mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCIgZmlsbD0ibm9uZSI+CiAgPHBhdGggZD0iTTUuNCA3LjVIMjUuNE00IDE0SDI0TTIuNiAyMC41SDIyLjYiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyLjUiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiLz4KPC9zdmc+Cg==") center / contain no-repeat !important;
}

/* Compact tablet workspace: keep heading and controls on one line, matching
   the desktop toolbar rather than introducing a tall intermediate stack. */
@media (min-width: 701px) and (max-width: 1023px) {
  html body .parallel-stable-wallet {
    height: 26px !important;
    min-height: 26px !important;
    border-radius: 999px !important;
  }

  html body .main-content {
    padding-top: 6px !important;
  }

  html body .pulse-toolbar {
    display: flex !important;
    width: 100% !important;
    min-height: 40px !important;
    height: 40px !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin: 0 0 6px !important;
  }

  html body .pulse-toolbar .page-heading {
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 40px !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body .pulse-toolbar .page-heading h1 {
    margin: 0 !important;
  }

  html body .pulse-toolbar .command-bar {
    position: static !important;
    right: auto !important;
    width: 197px !important;
    min-width: 197px !important;
    max-width: 197px !important;
    min-height: 26px !important;
    flex: 0 0 197px !important;
    align-items: center !important;
    gap: 5px !important;
    margin: 0 !important;
    padding-inline: 5px !important;
    transform: none !important;
  }

  html body .pulse-grid {
    height: calc(100dvh - 191px) !important;
  }
}

/* Ease compact/full-layout measurement changes without animating content or
   compromising the user's reduced-motion preference. */
@media (min-width: 701px) {
  html body :is(
    .parallel-stable-header,
    .parallel-stable-actions,
    .parallel-stable-wallet,
    .pulse-toolbar,
    .pulse-toolbar .page-heading,
    .pulse-toolbar .command-bar,
    .pulse-grid
  ) {
    transition:
      width 160ms ease,
      height 160ms ease,
      min-height 160ms ease,
      gap 160ms ease,
      padding 160ms ease,
      margin 160ms ease !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body :is(
    .parallel-stable-header,
    .parallel-stable-actions,
    .parallel-stable-wallet,
    .pulse-toolbar,
    .pulse-toolbar .page-heading,
    .pulse-toolbar .command-bar,
    .pulse-grid
  ) {
    transition: none !important;
  }
}

/* Stream filters share Hide All's compact neutral hover instead of the older
   blue hover treatment. A configured filter remains blue while idle. */
html body .stream-tools .stream-filter-button.parallel-utility-hover {
  overflow: visible !important;
  border: 0 !important;
  border-radius: 4px !important;
}

/* Keep the complete pair-activity cluster at the secondary bar's left edge.
   The list still shrinks and scrolls when populated, but no longer inserts an
   automatic spacer that pushes the mode and hotkey controls to the right. */
html body .market-strip {
  justify-content: flex-start !important;
}

html body .market-strip > .pair-activity {
  width: auto !important;
  max-width: 100% !important;
  flex: 0 1 auto !important;
  justify-content: flex-start !important;
  padding-left: 0 !important;
}

html body .pair-activity-items {
  width: auto !important;
  max-width: calc(100vw - 170px) !important;
  flex: 0 1 auto !important;
  padding-left: 12px !important;
  border-left: 1px solid var(--border) !important;
}

html body .pair-activity-items::before {
  display: none !important;
  margin-left: 0 !important;
  content: none !important;
}

html body .pair-activity-controls {
  margin-left: 0 !important;
}

html body .pair-activity-controls::before {
  display: none !important;
  content: none !important;
}

html body .pair-activity-controls > button::before {
  display: none !important;
  content: none !important;
}

/* Activity icons share one divider after the group. Remove their legacy
   right borders so utility hover cannot reveal an extra line beside a glyph. */
html body .pair-activity-controls > button.parallel-utility-hover,
html body .pair-activity-controls > button.parallel-utility-hover:is(:hover, :focus-visible, :active) {
  border: 0 !important;
  outline: none !important;
}

/* Standard neutral interaction for compact utility controls. Add
   .parallel-utility-hover to future icon-like actions; pair-mode controls also
   use .parallel-selectable-icon so the selected view remains blue. */
html body button.parallel-utility-hover {
  transition:
    background-color 120ms ease,
    border-color 120ms ease,
    color 120ms ease,
    transform 120ms ease !important;
}

html body button.parallel-utility-hover:is(:hover, :focus-visible) {
  border-color: var(--border) !important;
  background: color-mix(in srgb, var(--surface-2) 84%, transparent) !important;
  color: var(--text-soft) !important;
  outline: 0 !important;
  transform: translateY(-1px) !important;
}

html body button.parallel-utility-hover:active {
  background: color-mix(in srgb, var(--surface-3) 88%, transparent) !important;
  color: var(--text) !important;
  transform: translateY(0) scale(.94) !important;
}

html body .pair-activity-controls button.parallel-selectable-icon.active,
html body .pair-activity-controls button.parallel-selectable-icon.active:is(:hover, :focus-visible, :active) {
  color: var(--blue) !important;
}

html body .status-action.parallel-utility-hover:is(:hover, :focus-visible) svg {
  color: inherit !important;
}

@media (prefers-reduced-motion: reduce) {
  html body button.parallel-utility-hover,
  html body button.parallel-utility-hover:is(:hover, :focus-visible, :active) {
    transition: none !important;
    transform: none !important;
  }
}

/* Use one canvas shade for the empty feed area and every rendered coin row.
   Keeping hover/focus on the same shade prevents the old near-black card fill
   from returning while a coin is being inspected. */
html body {
  --parallel-dim-surface: #080b12;
  --parallel-pair-surface: var(--bg-elevated);
  --parallel-dim-surface-hover: #0b0f17;
}

html[data-theme="light"] body {
  --parallel-dim-surface: #ffffff;
  --parallel-pair-surface: #ffffff;
  --parallel-dim-surface-hover: #f4f6f8;
}

html body .stream-column {
  --parallel-stream-canvas: var(--parallel-pair-surface);
  background: var(--parallel-stream-canvas) !important;
}

html body .stream-column :is(.token-list, article.token-card) {
  background: var(--parallel-stream-canvas) !important;
}

@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body .stream-column article.token-card:is(:hover, :focus-within) {
    background: var(--parallel-dim-surface-hover) !important;
  }

  html body .stream-column.stream-scrollable article.token-card:is(:hover, :focus-within) {
    background: linear-gradient(
      to right,
      var(--parallel-dim-surface-hover) 0 calc(100% - 8px),
      var(--parallel-stream-canvas) calc(100% - 8px) 100%
    ) !important;
  }
}

html body .stream-column .stream-header {
  background: var(--parallel-pair-surface) !important;
}

html[data-theme="light"] body .stream-column {
  --parallel-stream-canvas: #ffffff;
}

/* The compact trading controls and wallet use the same dimmed surface as the
   feed. Quick Buy's blue active state remains a separate semantic highlight. */
html body :is(
  .parallel-stable-wallet,
  .pulse-toolbar .command-button,
  .pulse-toolbar .quick-buy-setting,
  .pulse-toolbar .quick-buy-setting input,
  .pulse-toolbar .quick-buy-toggle:not(.active)
) {
  background: var(--parallel-dim-surface) !important;
}

/* Keep the top activity buttons' full hit targets, but draw their hover shade
   tightly around the glyph instead of filling the complete 40px control. */
html body :is(
  .pair-activity-controls button,
  .hotkeys-strip-action
).parallel-utility-hover:is(:hover, :focus-visible, :active) {
  background: transparent !important;
}

html body :is(
  .pair-activity-controls button,
  .hotkeys-strip-action
).parallel-utility-hover > svg {
  box-sizing: content-box !important;
  padding: 3px 7px !important;
  border-radius: 4px !important;
  transition: background-color 120ms ease, box-shadow 120ms ease !important;
}

html body :is(
  .pair-activity-controls button,
  .hotkeys-strip-action
).parallel-utility-hover:is(:hover, :focus-visible) > svg {
  background: color-mix(in srgb, var(--surface-2) 84%, transparent) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2) !important;
}

html body :is(
  .pair-activity-controls button,
  .hotkeys-strip-action
).parallel-utility-hover:active > svg {
  background: color-mix(in srgb, var(--surface-3) 88%, transparent) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18) !important;
}

@media (prefers-reduced-motion: reduce) {
  html body :is(
    .pair-activity-controls button,
    .hotkeys-strip-action
  ).parallel-utility-hover > svg {
    transition: none !important;
  }
}

/* Keep each coin's Quick Buy pill anchored to the right while letting its
   width follow the complete amount text, including unusually long presets. */
html body .stream-column .card-actions {
  width: max-content !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  overflow: visible !important;
}

html body .stream-column .quick-buy {
  width: max-content !important;
  max-width: none !important;
  min-width: 64px !important;
  flex: 0 0 auto !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

/* Navigation destinations that are intentionally unavailable remain legible,
   but cannot receive pointer or keyboard interaction. */
html body .primary-nav .nav-item:disabled {
  opacity: 1 !important;
  cursor: default !important;
  pointer-events: none !important;
}

/* Floating controls must stay visible at every supported viewport. The old
   compact rule hid Wallet Tracker entirely on touch and narrow screens. */
html body #walletManager:not([hidden]) {
  display: flex !important;
}

html body #pnlTracker:not([hidden]) {
  display: block !important;
}

@media (max-width: 899px), (hover: none), (pointer: coarse) {
  html body #walletManager:not([hidden]) {
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 76px) !important;
  }
}

/* All three market columns share the same blue-black row lift. The final
   eight pixels stay on the resting canvas so the scrollbar remains a clean,
   uninterrupted rail instead of being swallowed by a hovered card. */
@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  html body .stream-column article.token-card:is(:hover, :focus-within) {
    background: var(--parallel-dim-surface-hover) !important;
  }

  html body .stream-column.stream-scrollable article.token-card:is(:hover, :focus-within) {
    background: linear-gradient(
      to right,
      var(--parallel-dim-surface-hover) 0 calc(100% - 8px),
      var(--parallel-stream-canvas) calc(100% - 8px) 100%
    ) !important;
  }

  html body .stream-column .stream-scrollbar:not(.inactive) {
    z-index: 120 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  html body .stream-column .stream-scrollbar:is(:hover, :focus-visible) .stream-scrollbar-thumb {
    background: color-mix(in srgb, var(--border-strong) 82%, white 18%) !important;
  }
}

/* Hybrid-pointer browsers can fail the pointer:fine media query while still
   producing mouse hover. Keep the requested row and scrollbar colours exact. */
html body .stream-column article.token-card::before,
html body .stream-column article.token-card::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  opacity: 0 !important;
}

html body .stream-column article.token-card:hover,
html body .stream-column article.token-card:focus-within {
  background: #0b0f17 !important;
}

/* Match and exceed the older :has(.stream-scrollbar) selector's specificity.
   Without this, embedded Chromium keeps the older neutral color-mix even
   though this lock appears later in the stylesheet. */
html body .stream-column.stream-scrollable:has(.stream-scrollbar:not(.inactive)) article.token-card:hover,
html body .stream-column.stream-scrollable:has(.stream-scrollbar:not(.inactive)) article.token-card:focus-within {
  background: linear-gradient(
    to right,
    #0b0f17 0 calc(100% - 8px),
    var(--parallel-stream-canvas) calc(100% - 8px) 100%
  ) !important;
}

html body .stream-column .stream-scrollbar:not(.inactive) {
  z-index: 120 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body .stream-column .stream-scrollbar:is(:hover, :focus-visible) .stream-scrollbar-thumb {
  background: color-mix(in srgb, var(--border-strong) 82%, white 18%) !important;
}

/* Keep compact Pulse controls and token data visually stable at every width. */
html body .pair-activity-controls button.parallel-selectable-icon.active,
html body .pair-activity-controls button.parallel-selectable-icon.active:is(:hover, :focus-visible, :active) {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--blue) !important;
}

/* Website previews must never participate in the metadata row's layout. */
html body .token-card .website-preview {
  position: fixed;
  z-index: 20000;
  display: block;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

html body .stream-column .token-meta {
  min-height: 18px !important;
  gap: 6px !important;
  line-height: 18px !important;
}

html body .stream-column .token-meta :is(.token-age, .holder-count b) {
  font-size: 12.5px !important;
  line-height: 18px !important;
}

/* Keep the larger glyphs readable when three feed columns are tightly packed. */
@container parallel-token-card (max-width: 360px) {
  html body .stream-column .token-meta {
    width: 100% !important;
    flex-wrap: wrap !important;
    row-gap: 3px !important;
    overflow: visible !important;
  }
}

html body .stream-column .token-meta .holder-count {
  gap: 4px !important;
  align-items: center !important;
}

html body .stream-column .token-meta .holder-count > svg {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 17px !important;
}

html body .stream-column .token-meta .token-social {
  height: 18px !important;
  gap: 5px !important;
  flex: 0 0 auto !important;
}

html body .stream-column .token-meta .social-trigger {
  width: 17px !important;
  height: 18px !important;
  flex: 0 0 17px !important;
}

html body .stream-column .token-meta :is(.social-symbol .profile-social-mark, .website-social > svg) {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 17px !important;
}

html body .stream-column .token-performance {
  min-width: 101px !important;
}

html body .stream-column .token-stat-line small,
html body .stream-column .token-tx-stat b {
  font-size: 8px !important;
  line-height: 1 !important;
}

html body .stream-column .token-stat-line:not(.token-tx-stat) b {
  font-size: 12px !important;
  line-height: 1 !important;
}

/* The compact footer must contribute height rather than overlap the cover
   badge and contract address inside the old fixed-height desktop card. */
@media (min-width: 900px) {
  html body .stream-column .token-card {
    height: auto !important;
    padding-bottom: 12px !important;
  }
}

/* Once a three-column token card becomes compact enough to put its risk
   baseline below the cover, begin that row at the cover's left edge. */
@container parallel-token-card (max-width: 420px) {
  html body .stream-column .token-card-footer {
    position: relative !important;
    inset: auto !important;
    margin: 10px 0 0 !important;
    min-height: 26px !important;
  }

  html body .stream-column .risk-row {
    margin-left: 0 !important;
    justify-content: flex-start !important;
  }

  html body .stream-column .risk-chip {
    justify-content: center !important;
  }
}

/* Medium-weight percentages and the original unthickened holding glyphs. */
html body .stream-column .risk-chip b {
  font-weight: 500 !important;
}

html body .stream-column .risk-chip svg {
  width: 12px !important;
  height: 12px !important;
  flex: 0 0 12px !important;
}

/* Keep the camera overlay aligned with the inset, rounded artwork. */
html body .stream-column .token-avatar-camera {
  position: absolute !important;
  top: 2px !important;
  right: 2px !important;
  bottom: 2px !important;
  left: 2px !important;
  inset: 2px !important;
  display: block !important;
  box-sizing: border-box !important;
  width: calc(100% - 4px) !important;
  height: calc(100% - 4px) !important;
  margin: 0 !important;
  padding: 0 !important;
  background: rgba(3, 8, 15, 0.58) !important;
  border-radius: 4px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: none !important;
}

html body .stream-column .token-avatar-camera .parallel-camera-icon {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  background: none !important;
  fill: currentColor !important;
  stroke: none !important;
  -webkit-mask: none !important;
  mask: none !important;
  transform: translate(-50%, -50%) !important;
}

html body .stream-column .token-avatar-trigger:is(:hover, :focus-visible) .token-avatar-camera {
  opacity: 1 !important;
  visibility: visible !important;
}

html body .stream-column .token-avatar-trigger:is(:hover, :focus-visible) .token-avatar {
  border-color: var(--blue) !important;
  border-width: 1px !important;
  outline: none !important;
  box-shadow: none !important;
}

/* A uniform 2px inner gap separates the picture from its progress frame. */
html body .stream-column .token-avatar[data-cover-platform] {
  background: var(--bg-elevated) !important;
}

/* Hover may dim the artwork, but it must never zoom or resize it. */
html body .stream-column .token-cover-art {
  inset: 2px !important;
  width: calc(100% - 4px) !important;
  height: calc(100% - 4px) !important;
  border-radius: 4px !important;
  transition: filter 150ms ease !important;
}

html body .stream-column .token-avatar-trigger:is(:hover, :focus-visible, .is-preview-open) .token-cover-art {
  transform: none !important;
}

/* Borderless control language: search fields keep their framed containers,
   while buttons use fill and brightness for separation and interaction. */
html body button {
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}

html body button:focus-visible {
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
  filter: brightness(1.1);
}

/* The positions header and its data rows always share one live column grid. */
html body .wallet-scan-table-head,
html body .wallet-scan-row {
  grid-template-columns: var(--wallet-scan-grid) !important;
}

/* The share controls sit directly on the modal backdrop: no gray footer slab. */
html body .pnl-share-panel,
html body .pnl-share-layout,
html body .pnl-share-controls {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .pnl-share-card {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* Share PnL is a permanent labelled action, not a hover-only tooltip. */
html body .wallet-scan-share-action {
  display: inline-flex !important;
  width: max-content !important;
  min-width: 74px !important;
  height: 26px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  padding: 0 6px !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

html body .wallet-scan-share-action > span {
  position: static !important;
  display: inline !important;
  width: auto !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  font: 650 8px/1 var(--font-sans) !important;
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
  white-space: nowrap !important;
}

html body .wallet-scan-share-action:is(:hover, :focus-visible) {
  background: transparent !important;
  color: var(--blue) !important;
}

/* Pair platform covers. The original blue Sui treatment remains selectable.
   Only the cover frame and its badge inherit this accent; token art stays intact. */
html body .stream-column .token-avatar[data-cover-platform="sui"] {
  --cover-accent: var(--blue);
}

html body .stream-column .token-avatar[data-cover-platform="suipump"] {
  --cover-accent: #84cc16;
}

html body .stream-column .token-avatar[data-cover-platform="turbos"] {
  --cover-accent: #ef4444;
}

html body .stream-column .token-avatar[data-cover-platform="cetus"] {
  --cover-accent: #50f5cd;
}

/* Completed covers retain their original native 1px platform frame. */
html body .stream-column .token-avatar[data-cover-platform]:not([data-cover-platform="sui"]),
html body .stream-column .token-avatar-trigger:is(:hover, :focus-visible, .is-preview-open) .token-avatar[data-cover-platform]:not([data-cover-platform="sui"]) {
  border: 1px solid var(--cover-accent, var(--blue)) !important;
  outline: none !important;
  box-shadow: none !important;
}

html body .stream-column .token-avatar[data-cover-platform]:not([data-cover-platform="sui"]) > .token-avatar-network {
  border-color: var(--cover-accent, var(--blue)) !important;
}

/* Only unfinished covers use a progress overlay. The path starts just left
   of the badge, follows bottom/left/top/right, and ends beneath its upper edge.
   The filled stroke matches the original frame; only the remainder is dimmer. */
html body .stream-column .token-card[data-bonding-complete="false"] .token-avatar[data-cover-platform],
html body .stream-column .token-card[data-bonding-complete="false"] .token-avatar-trigger:is(:hover, :focus-visible, .is-preview-open) .token-avatar[data-cover-platform] {
  border: 1px solid transparent !important;
  outline: none !important;
  box-shadow: none !important;
}
html body .stream-column .token-avatar > .token-bonding-outline {
  position: absolute !important;
  inset: -1px !important;
  width: calc(100% + 2px) !important;
  height: calc(100% + 2px) !important;
  display: block !important;
  z-index: 7 !important;
  overflow: visible !important;
  pointer-events: none !important;
  fill: none !important;
  background: none !important;
  transform: none !important;
}

html body .stream-column .token-card[data-bonding-complete="true"] .token-avatar > .token-bonding-outline {
  display: none !important;
}

html body .stream-column .token-bonding-outline > :is(rect, path) {
  fill: none !important;
  vector-effect: non-scaling-stroke;
}

html body .stream-column .token-bonding-track {
  stroke: color-mix(in srgb, var(--cover-accent, var(--blue)) 35%, var(--bg-elevated)) !important;
  stroke-width: 0.5px !important;
}

html body .stream-column .token-bonding-fill {
  stroke: var(--cover-accent, var(--blue)) !important;
  stroke-width: 1px !important;
  stroke-dasharray: var(--bonding-progress, 0) 100;
  stroke-linecap: butt;
}

/* Match the original 5px cover corners in the compact desktop layout. */
@media (min-width: 900px) and (max-width: 1279px) {
  html body .stream-column .token-bonding-track {
    rx: 4.5px;
  }

  html body .stream-column .token-bonding-fill {
    d: path("M59 71.5H5A4.5 4.5 0 0 1 .5 67V5A4.5 4.5 0 0 1 5 .5H67A4.5 4.5 0 0 1 71.5 5V64");
  }
}

/* Give the platform marks enough room to read while retaining the badge's
   existing corner anchor and keeping it clear of the contract and risk pills. */
html body .stream-column .token-avatar[data-cover-platform]:not([data-cover-platform="sui"]) > .token-avatar-network {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  background: #07111d !important;
}

html body .stream-column .token-avatar[data-cover-platform]:not([data-cover-platform="sui"]) > .token-avatar-network img {
  width: 12px !important;
  height: 12px !important;
  object-fit: contain !important;
}