/* Final typography + token-avatar normalization.
   This file is intentionally loaded last so delayed app styles cannot replace it. */
@font-face {
  font-family: "Geist Mono Local";
  src: url("./assets/fonts/geist-mono/GeistMono-Light.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 400;
  font-display: block;
}

@font-face {
  font-family: "Geist Mono Local";
  src: url("./assets/fonts/geist-mono/GeistMono-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 401 600;
  font-display: block;
}

@font-face {
  font-family: "Geist Mono Local";
  src: url("./assets/fonts/geist-mono/GeistMono-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 601 1000;
  font-display: block;
}

:root {
  --geist-mono-page: "Geist Mono Local", "Geist Mono", ui-monospace, monospace;
  --font-sans: var(--geist-mono-page);
  --font-ui: var(--geist-mono-page);
  --font-display: var(--geist-mono-page);
  --font-family-sans: var(--geist-mono-page);
  --font-mono: var(--geist-mono-page);
  --font-data: var(--geist-mono-page);
  --font-family-mono: var(--geist-mono-page);
  --parallel-interface-font: var(--geist-mono-page);
  --parallel-text-font: var(--geist-mono-page);
  --parallel-ui-font: var(--geist-mono-page);
  --parallel-number-font: var(--geist-mono-page);
  --parallel-font-ui: var(--geist-mono-page);
  --parallel-font-mono: var(--geist-mono-page);
  --parallel-font-data: var(--geist-mono-page);
}

/* Compact, flat top navigation matching the reference density. */
.primary-nav,
.pt-refined-nav-group,
.parallel-nav-cluster {
  height: auto !important;
  align-items: center !important;
  gap: 3px !important;
}

.primary-nav .nav-item,
.primary-nav .pt-refined-nav,
.primary-nav .parallel-nav-item {
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--text) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  transform: translate3d(0, 0, 0) !important;
  transform-style: preserve-3d !important;
  transition: color 150ms ease, background 150ms ease, box-shadow 150ms ease, transform 150ms ease !important;
  will-change: transform;
}

.primary-nav .nav-item:hover,
.primary-nav .nav-item:focus-visible {
  background: rgba(61, 83, 180, 0.2) !important;
  box-shadow: inset 0 0 0 1px rgba(97, 128, 255, 0.18) !important;
  color: #7797ff !important;
}

@media (min-width: 900px) and (hover: hover) and (pointer: fine) {
  .primary-nav .nav-item:hover {
    transform: perspective(135px) rotateX(var(--nav-rotate-x)) rotateY(var(--nav-rotate-y)) translate3d(var(--nav-shift-x), calc(-3px + var(--nav-shift-y)), 10px) !important;
  }
}

.primary-nav .nav-item.active,
.primary-nav .nav-item[aria-current="page"],
.primary-nav .nav-item[data-active="true"] {
  background: rgba(61, 83, 180, 0.3) !important;
  color: #7797ff !important;
}

/* The dock preset stays compact and visibly blue in every state. */
.parallel-preset-trigger,
.pt-preset-button,
.parallel-bottom-control.parallel-preset-control,
.parallel-preset-control {
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 78px !important;
  max-width: max-content !important;
  height: 21px !important;
  min-height: 21px !important;
  margin: 0 !important;
  padding: 0 7px !important;
  gap: 5px !important;
  border: 1px solid rgba(78, 105, 255, 0.58) !important;
  border-radius: 3px !important;
  background: rgba(42, 64, 170, 0.34) !important;
  box-shadow: none !important;
  color: #6f8fff !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0.025em !important;
  position: relative !important;
  transform: translateY(0) !important;
  transition: color 180ms ease, border-color 180ms ease, background 180ms ease, transform 180ms ease !important;
}

.parallel-preset-trigger:hover,
.parallel-preset-trigger:focus-visible,
.parallel-preset-trigger:active,
.parallel-preset-trigger[aria-expanded="true"],
.pt-preset-button:hover,
.parallel-preset-control:hover {
  border-color: rgba(93, 126, 255, 0.78) !important;
  background: rgba(49, 75, 190, 0.42) !important;
  color: #88a0ff !important;
}

.parallel-preset-trigger:active {
  transform: translateY(1px) !important;
}

.parallel-preset-trigger::before {
  width: 11px !important;
  height: 9px !important;
  background-size: 11px 1px, 8px 1px, 6px 1px !important;
}

.parallel-preset-trigger::after {
  position: absolute;
  z-index: 10050;
  left: 0;
  bottom: calc(100% + 7px);
  width: max-content;
  max-width: 180px;
  padding: 5px 7px;
  border: 1px solid rgba(83, 111, 164, 0.55);
  border-radius: 4px;
  background: rgba(7, 12, 20, 0.97);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.42);
  color: #dce8ff;
  content: attr(data-tooltip);
  font-size: 9px !important;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.2;
  opacity: 0;
  pointer-events: none;
  transform: translateY(3px);
  transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease;
  visibility: hidden;
  white-space: nowrap;
}

.parallel-preset-trigger:hover::after,
.parallel-preset-trigger:focus-visible::after {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
}

/* One shared grid keeps both readouts light, evenly spaced and aligned. */
.pnl-summary {
  grid-template-columns: 1fr auto 1fr !important;
  grid-template-rows: 34px 10px 11px !important;
  align-content: center !important;
  align-items: center !important;
  column-gap: 14px !important;
  row-gap: 3px !important;
}

.pnl-summary > .pnl-metric {
  display: contents !important;
  font-variant-numeric: tabular-nums lining-nums;
}

.pnl-summary > .pnl-metric > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100%;
  height: 34px !important;
  min-height: 34px !important;
  grid-row: 1;
  gap: 5px !important;
  line-height: 34px !important;
}

.pnl-summary > .pnl-metric:first-child > div,
.pnl-summary > .pnl-metric:first-child > small,
.pnl-summary > .pnl-metric:first-child > span {
  grid-column: 1;
}

.pnl-summary > .pnl-profit > div,
.pnl-summary > .pnl-profit > small,
.pnl-summary > .pnl-profit > span {
  grid-column: 3;
}

.pnl-summary > .pnl-metric img {
  align-self: center !important;
  flex: 0 0 auto;
}

.pnl-summary > .pnl-metric strong {
  display: inline-flex !important;
  align-items: center !important;
  height: 34px !important;
  font-weight: 600 !important;
  line-height: 34px !important;
  letter-spacing: -0.02em !important;
  font-feature-settings: "tnum" 1, "lnum" 1, "zero" 0 !important;
  font-variant-numeric: tabular-nums lining-nums;
  white-space: nowrap;
}

.pnl-summary > .pnl-metric:first-child strong,
.pnl-summary > .pnl-profit.neutral strong {
  color: color-mix(in srgb, var(--pnl-primary, var(--text)) 78%, transparent) !important;
}

.pnl-summary > .pnl-metric > small,
.pnl-summary > .pnl-metric > span {
  display: block !important;
  width: 100%;
  margin: 0 !important;
  line-height: 1.15 !important;
  font-variant-numeric: tabular-nums lining-nums;
  text-align: center;
}

.pnl-summary > .pnl-metric > small {
  grid-row: 2;
}

.pnl-summary > .pnl-metric > small[hidden] {
  display: none !important;
}

.pnl-summary > .pnl-metric > span {
  grid-row: 2;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 100% !important;
  align-self: start !important;
  justify-self: stretch !important;
  padding-top: 1px;
  text-align: center !important;
}

.pnl-summary > .pnl-brand {
  grid-column: 2;
  grid-row: 2;
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Reveal the app beneath wallet reports while keeping it clearly inactive. */
.wallet-scan-modal {
  background: rgba(2, 7, 14, 0.43) !important;
  -webkit-backdrop-filter: brightness(0.56) saturate(0.78) blur(2px) !important;
  backdrop-filter: brightness(0.56) saturate(0.78) blur(2px) !important;
}

@media (prefers-reduced-motion: reduce) {
  .primary-nav .nav-item,
  .parallel-preset-trigger,
  .parallel-preset-trigger::after {
    transition: none !important;
  }

  .primary-nav .nav-item:hover {
    transform: none !important;
  }
}

html,
body,
body *:not([class^="ri-"]):not([class*=" ri-"]):not(.remixicon):not(.icon-font),
button,
input,
select,
textarea,
[role="button"] {
  font-family: var(--geist-mono-page) !important;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

body *:not([class^="ri-"]):not([class*=" ri-"]):not(.remixicon):not(.icon-font)::before,
body *:not([class^="ri-"]):not([class*=" ri-"]):not(.remixicon):not(.icon-font)::after {
  font-family: var(--geist-mono-page) !important;
}

/* Glyph icons must keep their icon face; all readable interface text uses Geist Mono. */
[class^="ri-"],
[class*=" ri-"],
.remixicon,
.icon-font {
  font-family: "Parallel Remix Icons" !important;
}

button,
input,
select,
textarea {
  letter-spacing: normal;
}

/* Compact slash shortcut with equal space on both sides inside search. */
.topbar-search {
  position: relative !important;
  box-sizing: border-box !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 0 36px 0 10px !important;
}

.topbar-search input {
  padding-right: 0 !important;
}

.topbar-search kbd {
  position: absolute !important;
  top: 50% !important;
  right: 6px !important;
  box-sizing: border-box !important;
  display: inline-grid !important;
  flex: 0 0 22px !important;
  width: 22px !important;
  min-width: 22px !important;
  height: 16px !important;
  margin: 0 !important;
  align-self: auto !important;
  padding: 0 !important;
  place-items: center !important;
  border-radius: 999px !important;
  font-size: 8px !important;
  line-height: 1 !important;
  transform: translateY(-50%) !important;
}

@media (max-width: 1180px) {
  .topbar-search:not(:focus-within) kbd {
    display: none !important;
  }
}

:where(
  .mono,
  .numeric,
  .metric-value,
  .market-value,
  .token-age,
  .token-stat-value,
  .wallet-balance,
  .quick-buy-amount,
  [data-number],
  [data-numeric]
) {
  font-family: var(--parallel-font-mono) !important;
  font-variant-numeric: tabular-nums;
}

/* Remove the legacy pseudo badges/camera that were appearing permanently. */
.token-avatar::before,
.token-avatar::after {
  content: none !important;
  display: none !important;
}

.token-avatar {
  position: relative !important;
  isolation: isolate;
  overflow: visible !important;
  color: transparent !important;
  font-size: 0 !important;
}

/* The sole camera is centered inside the coin-image cover. */
.token-avatar-trigger > .token-avatar-camera {
  display: none !important;
}

.token-avatar > .token-avatar-camera {
  position: absolute !important;
  inset: 0 !important;
  z-index: 6 !important;
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: rgba(3, 8, 15, 0.58) !important;
  color: #fff !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
}

.token-avatar > .token-avatar-camera svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  stroke: currentColor !important;
}

@media (hover: hover) and (pointer: fine) {
  .token-avatar-trigger:hover .token-avatar > .token-avatar-camera,
  .token-avatar-trigger:focus-visible .token-avatar > .token-avatar-camera {
    opacity: 1 !important;
    visibility: visible !important;
  }
}

.pt-avatar-camera,
.parallel-camera-overlay,
[data-camera-overlay] {
  display: none !important;
}

.token-image-preview {
  z-index: 10000 !important;
}

.token-image-preview-art > b {
  display: none !important;
}

.token-avatar > .token-avatar-network {
  position: absolute !important;
  right: -4px !important;
  bottom: -4px !important;
  left: auto !important;
  top: auto !important;
  z-index: 8 !important;
  width: 14px !important;
  height: 14px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center;
  overflow: hidden !important;
  border: 1px solid #4da2ff !important;
  border-radius: 50% !important;
  background: #07111d !important;
  box-shadow: 0 0 0 2px #07101a;
  pointer-events: none;
}

.token-avatar > .token-avatar-network img {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 7px !important;
  height: 9px !important;
  display: block !important;
  object-fit: contain !important;
  transform: translate(-50%, -50%) !important;
}

@media (hover: none), (pointer: coarse) {
  .token-avatar > .token-avatar-camera {
    display: none !important;
  }
}