body.blocknet-page {
  --block-bg: #030a0f;
  --block-panel: rgba(4, 15, 22, 0.94);
  --block-cyan: #4bdcff;
  --block-blue: #5b87ff;
  --block-green: #55f5ac;
  --block-gold: #ffc857;
  --block-violet: #aa8cff;
  --block-line: rgba(75, 220, 255, 0.22);
  --block-copy: #c2d0da;
  --block-muted: #7f96a5;
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  color: var(--block-copy);
  background:
    radial-gradient(circle at 8% 18%, rgba(75, 220, 255, 0.11), transparent 30rem),
    radial-gradient(circle at 92% 42%, rgba(85, 245, 172, 0.07), transparent 32rem),
    linear-gradient(145deg, #02070b, #06121a 55%, #040811);
  font-family: "Trebuchet MS", "Segoe UI", sans-serif;
}

.blocknet-page *,
.blocknet-page *::before,
.blocknet-page *::after { box-sizing: border-box; }

.blocknet-page::before {
  position: fixed;
  inset: 72px 0 0;
  z-index: -1;
  content: "";
  opacity: 0.22;
  background-image:
    linear-gradient(rgba(75, 220, 255, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(75, 220, 255, 0.055) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, #000, transparent 92%);
}

.blocknet-shell {
  width: min(1180px, calc(100% - 28px));
  margin: 22px auto 54px;
}

.blocknet-console,
.blocknet-subpage-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid var(--block-line);
  border-radius: 27px;
  background:
    linear-gradient(rgba(75, 220, 255, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(75, 220, 255, 0.026) 1px, transparent 1px),
    rgba(3, 11, 17, 0.94);
  background-size: 48px 48px;
  box-shadow: 0 35px 90px rgba(0, 0, 0, 0.42), inset 0 1px rgba(255, 255, 255, 0.035);
}

.blocknet-console::before,
.blocknet-subpage-panel::before {
  position: absolute;
  top: -390px;
  right: -260px;
  z-index: -1;
  width: 680px;
  height: 680px;
  content: "";
  border: 1px solid rgba(75, 220, 255, 0.14);
  border-radius: 50%;
  box-shadow: 0 0 0 84px rgba(75, 220, 255, 0.018), 0 0 0 168px rgba(85, 245, 172, 0.01);
}

.blocknet-status {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  min-height: 42px;
  align-items: center;
  padding: 0 18px;
  color: #7893a5;
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(75, 220, 255, 0.16);
  background: rgba(1, 8, 12, 0.78);
}

.blocknet-status__lights { display: flex; gap: 6px; }
.blocknet-status__lights i { width: 7px; height: 7px; border-radius: 50%; background: #36576b; }
.blocknet-status__lights i:nth-child(2) { background: var(--block-gold); box-shadow: 0 0 10px rgba(255, 200, 87, 0.7); }
.blocknet-status__lights i:nth-child(3) { background: var(--block-cyan); box-shadow: 0 0 10px rgba(75, 220, 255, 0.7); }
.blocknet-status__online { justify-self: end; color: var(--block-green); }

.blocknet-home-page .blocknet-status__online {
  max-width: none;
  text-align: right;
  font-size: 0.67rem;
  letter-spacing: 0.12em;
  line-height: 1.35;
  white-space: nowrap;
}

.blocknet-home-page .blocknet-status > span:nth-child(2) {
  font-size: 0.72rem;
  letter-spacing: 0.2em;
}

.blocknet-home-hero {
  display: grid;
  grid-template-columns: 185px minmax(0, 1fr) minmax(320px, 0.78fr);
  align-items: center;
  gap: 26px;
  padding: 23px 24px 18px;
}

.blocknet-brand {
  display: block;
  min-width: 0;
  padding: 20px 0 25px;
}

.blocknet-brand__core {
  position: relative;
  display: grid;
  width: 148px;
  height: 148px;
  place-items: center;
  justify-self: center;
  border: 1px solid rgba(75, 220, 255, 0.43);
  border-radius: 42px;
  background: radial-gradient(circle, rgba(75, 220, 255, 0.2), rgba(4, 14, 21, 0.92) 64%);
  box-shadow: 0 0 44px rgba(75, 220, 255, 0.14), inset 0 0 30px rgba(75, 220, 255, 0.09);
  transform: rotate(-7deg);
}

.blocknet-brand__core::before,
.blocknet-brand__core span {
  position: absolute;
  content: "";
  border: 1px dashed rgba(75, 220, 255, 0.28);
  border-radius: 50%;
  inset: -18px;
  animation: blocknet-orbit 16s linear infinite;
}

.blocknet-brand__core span { inset: -30px; border-style: solid; border-color: transparent var(--block-green); animation-duration: 11s; animation-direction: reverse; }
.blocknet-brand__core img { width: 86px; transform: rotate(7deg); filter: drop-shadow(0 0 18px rgba(75, 220, 255, 0.35)); }

.blocknet-kicker {
  color: var(--block-cyan);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.19em;
  text-transform: uppercase;
}

.blocknet-brand h1 {
  margin: 0;
  color: #f6fbff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3.8rem, 7vw, 6.4rem);
  line-height: 0.88;
  letter-spacing: -0.06em;
  text-shadow: 0 0 34px rgba(75, 220, 255, 0.12);
  transform: none;
}

.blocknet-brand__copy p { width: min(100%, 430px); margin: 17px auto 0; color: #b8c8d1; font-size: 1.08rem; line-height: 1.48; }
.blocknet-brand__copy { width: 100%; text-align: center; }

.blocknet-home-metrics {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  align-self: start;
  padding: 0;
}

.blocknet-home-metric {
  --metric-rgb: 75, 220, 255;
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 84px;
  grid-template-columns: 46px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 13px 15px;
  overflow: hidden;
  border: 1px solid rgba(var(--metric-rgb), 0.25);
  border-radius: 14px;
  background:
    radial-gradient(circle at 10% 50%, rgba(var(--metric-rgb), 0.13), transparent 31%),
    linear-gradient(120deg, rgba(var(--metric-rgb), 0.065), rgba(2, 9, 14, 0.76));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.035), 0 14px 28px rgba(0, 0, 0, 0.16);
  text-decoration: none;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.blocknet-home-metric:hover,
.blocknet-home-metric:focus-visible {
  border-color: rgba(var(--metric-rgb), .62);
  background:
    radial-gradient(circle at 10% 50%, rgba(var(--metric-rgb), .19), transparent 34%),
    linear-gradient(120deg, rgba(var(--metric-rgb), .1), rgba(2, 9, 14, .8));
  box-shadow: inset 0 1px rgba(255, 255, 255, .05), 0 17px 34px rgba(0, 0, 0, .2), 0 0 24px rgba(var(--metric-rgb), .1);
  outline: none;
  transform: translateY(-2px);
}

.blocknet-home-metric::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  content: "";
  background: rgb(var(--metric-rgb));
  box-shadow: 0 0 15px rgb(var(--metric-rgb));
}

.blocknet-home-metric--apr { --metric-rgb: 85, 245, 172; }
.blocknet-home-metric--price { --metric-rgb: 255, 200, 87; }
.blocknet-home-metric__icon { display: grid; width: 42px; height: 42px; place-items: center; color: rgb(var(--metric-rgb)); font-family: Georgia, "Times New Roman", serif; font-size: 1rem; font-weight: 900; border: 1px solid rgba(var(--metric-rgb), 0.4); border-radius: 50%; background: rgba(var(--metric-rgb), 0.07); box-shadow: 0 0 19px rgba(var(--metric-rgb), 0.12); }
.blocknet-home-metric small { display: block; color: rgba(var(--metric-rgb), 0.92); font-size: 0.63rem; font-weight: 900; letter-spacing: 0.12em; }
.blocknet-home-metric strong { display: block; margin-top: 5px; color: #f0f9fc; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.18rem, 1.72vw, 1.48rem); line-height: 1; }
.blocknet-home-metric div > span:last-child { display: block; margin-top: 7px; color: #91a5b0; font-size: 0.7rem; line-height: 1.3; }
.blocknet-home-metric__pair { display: flex !important; flex-direction: column; align-items: flex-start; gap: 6px; font-size: clamp(1.03rem, 1.48vw, 1.22rem) !important; }
.blocknet-home-metric__pair span:first-child { color: #ffe199; }
.blocknet-home-metric__pair span:last-child { color: #a8ffd1; }
.blocknet-home-metrics__source {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 2px 2px 0;
  color: #8ba0ac;
  font-size: 0.7rem;
  line-height: 1.4;
}
.blocknet-home-metrics__source > span { width: 7px; height: 7px; flex: 0 0 7px; margin-top: 4px; border-radius: 50%; background: var(--block-green); box-shadow: 0 0 10px rgba(85, 245, 172, 0.65); }
.blocknet-home-metrics__source b { color: #b8c8d1; font-weight: 700; }

.blocknet-audiences {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 0 24px 16px;
}

.blocknet-audience {
  --lane-rgb: 75, 220, 255;
  display: block;
  position: relative;
  min-height: 176px;
  padding: 20px 24px 18px;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  border: 1px solid rgba(var(--lane-rgb), 0.3);
  border-radius: 21px;
  background:
    radial-gradient(circle at 93% 12%, rgba(var(--lane-rgb), 0.18), transparent 32%),
    linear-gradient(135deg, rgba(var(--lane-rgb), 0.08), rgba(3, 10, 16, 0.92) 48%);
  transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease;
}

.blocknet-audience--host { --lane-rgb: 85, 245, 172; }
.blocknet-audience:hover { transform: translateY(-4px); border-color: rgba(var(--lane-rgb), 0.58); box-shadow: 0 22px 44px rgba(0,0,0,.27), 0 0 28px rgba(var(--lane-rgb), 0.08); }
.blocknet-audience:focus-visible { outline: 2px solid rgb(var(--lane-rgb)); outline-offset: 4px; transform: translateY(-4px); }
.blocknet-audience__index { color: rgb(var(--lane-rgb)); font-size: 0.69rem; font-weight: 900; letter-spacing: 0.16em; }
.blocknet-audience__icon { position: absolute; top: 18px; right: 21px; display: grid; width: 52px; height: 52px; place-items: center; border: 1px solid rgba(var(--lane-rgb), 0.35); border-radius: 16px; background: rgba(var(--lane-rgb), 0.08); box-shadow: 0 0 25px rgba(var(--lane-rgb), 0.12); }
.blocknet-audience__icon svg { width: 28px; fill: none; stroke: rgb(var(--lane-rgb)); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.blocknet-audience h2 { max-width: calc(100% - 68px); margin: 24px 0 8px; color: #f3f8fb; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.65rem, 2.55vw, 2.15rem); line-height: 1; }
.blocknet-audience p { max-width: 500px; margin: 0; color: #b8c7d0; font-size: 1rem; line-height: 1.48; }
.blocknet-audience__signal { display: block; margin-top: 11px; color: rgb(var(--lane-rgb)); font-size: 0.64rem; font-weight: 900; letter-spacing: 0.13em; }
.blocknet-audience__link { display: inline-flex; align-items: center; gap: 8px; margin-top: 19px; padding: 9px 12px; border: 1px solid rgba(var(--lane-rgb), 0.34); border-radius: 8px; background: rgba(var(--lane-rgb), 0.08); color: rgb(var(--lane-rgb)); font-size: 0.72rem; font-weight: 900; letter-spacing: 0.08em; text-decoration: none; text-transform: uppercase; }
.blocknet-audience__link::after { content: "->"; font-size: 1rem; transition: transform 180ms ease; }
.blocknet-audience:hover .blocknet-audience__link::after,
.blocknet-audience:focus-visible .blocknet-audience__link::after { transform: translateX(5px); }
.blocknet-get-started-page .blocknet-audiences { padding: 0; }
.blocknet-get-started-page .blocknet-status { grid-template-columns: 1fr; }
.blocknet-get-started-page .blocknet-page-hero {
  grid-template-columns: minmax(0, 1fr);
  min-height: 180px;
  padding: 27px 42px 25px;
}
.blocknet-get-started-page .blocknet-page-hero__copy { max-width: 930px; }
.blocknet-get-started-page .blocknet-page-hero__copy h1 {
  font-size: clamp(2.2rem, 5.4vw, 4.8rem);
  white-space: nowrap;
}
.blocknet-get-started-page .blocknet-page-hero__copy p { margin-top: 13px; }
.blocknet-get-started-page .blocknet-content { padding-top: 0; }
.blocknet-get-started-page .blocknet-section-heading { align-items: center; margin: 0 0 15px; }
.blocknet-get-started-page .blocknet-section-heading h2 {
  margin-top: 0;
  font-size: clamp(1.35rem, 3.1vw, 2.7rem);
  white-space: nowrap;
}
.blocknet-get-started-page .blocknet-section-heading p { max-width: 430px; }
.blocknet-get-started-page .blocknet-audience { min-height: 230px; }
.blocknet-get-started-page .blocknet-audience h2 {
  font-size: clamp(1.4rem, 2.3vw, 1.95rem);
  white-space: nowrap;
}

.blocknet-started-route {
  --route-rgb: 75, 220, 255;
  position: relative;
  min-height: 96px;
  border-color: rgba(var(--route-rgb), 0.32);
  background: linear-gradient(135deg, rgba(var(--route-rgb), 0.11), rgba(3, 13, 19, 0.82));
}
.blocknet-started-route--power { --route-rgb: 85, 245, 172; }
.blocknet-overview-hero__metric.blocknet-started-route strong,
.blocknet-route-mobile-choice strong {
  display: block;
  margin-top: 0;
  color: rgb(var(--route-rgb));
  font-size: clamp(1.35rem, 2.35vw, 1.8rem);
}
.blocknet-overview-hero__metric.blocknet-started-route span,
.blocknet-route-mobile-choice > span {
  display: block;
  margin-top: 8px;
  color: #d0dee4;
  font-size: clamp(0.82rem, 1.15vw, 0.96rem);
  font-weight: 700;
}
.blocknet-route-connectors {
  display: grid;
  min-height: 92px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 0 42px;
  border-top: 1px solid rgba(75, 220, 255, 0.08);
}
.blocknet-route-arrow {
  --arrow-rgb: 75, 220, 255;
  position: relative;
  display: block;
  justify-self: center;
  width: 64px;
  height: 88px;
  color: rgb(var(--arrow-rgb));
  filter: drop-shadow(0 0 11px rgba(var(--arrow-rgb), 0.55));
  isolation: isolate;
}
.blocknet-route-arrow--power { --arrow-rgb: 85, 245, 172; }
.blocknet-route-arrow::before {
  position: absolute;
  z-index: 1;
  top: 8px;
  left: 50%;
  width: 38px;
  height: 68px;
  content: "";
  background: currentColor;
  clip-path: polygon(38% 0, 62% 0, 62% 58%, 100% 58%, 50% 100%, 0 58%, 38% 58%);
  transform: translateX(-50%);
}
.blocknet-route-arrow::after {
  position: absolute;
  z-index: 0;
  top: 13px;
  left: 2px;
  width: 60px;
  height: 60px;
  content: "";
  border: 1px solid rgba(var(--arrow-rgb), 0.14);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(var(--arrow-rgb), 0.14), transparent 68%);
}
.blocknet-started-routes .blocknet-audiences { padding-top: 0; }
.blocknet-route-pair { display: contents; }
.blocknet-route-mobile-choice,
.blocknet-route-mobile-arrow { display: none; }
.blocknet-get-started-page .blocknet-audience {
  display: flex;
  min-height: 270px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px;
  text-align: center;
}
.blocknet-get-started-page .blocknet-audience__icon {
  position: static;
  width: 58px;
  height: 58px;
  margin: 0 auto 12px;
}
.blocknet-get-started-page .blocknet-audience h2 {
  max-width: none;
  margin: 4px 0 11px;
  font-size: clamp(1.65rem, 2.6vw, 2.15rem);
}
.blocknet-get-started-page .blocknet-audience p {
  max-width: 520px;
  font-size: clamp(0.98rem, 1.2vw, 1.08rem);
  line-height: 1.55;
}
.blocknet-get-started-page .blocknet-audience__signal { margin-top: 14px; font-size: 0.69rem; }
.blocknet-get-started-page .blocknet-audience__link { margin-top: 20px; font-size: 0.76rem; }

@media (max-width: 700px) {
  .blocknet-get-started-page .blocknet-overview-hero__metrics--routes,
  .blocknet-route-connectors { display: none; }
  .blocknet-get-started-page .blocknet-audiences { gap: 30px; }
  .blocknet-route-pair { display: grid; min-width: 0; justify-items: stretch; }
  .blocknet-route-mobile-choice {
    display: flex;
    min-height: 94px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 16px;
    text-align: center;
    border: 1px solid rgba(var(--route-rgb), 0.32);
    border-radius: 13px;
  }
  .blocknet-route-mobile-arrow { display: block; margin: 2px auto 8px; }
  .blocknet-get-started-page .blocknet-audience { min-height: 300px; padding: 25px 20px; }
  .blocknet-get-started-page .blocknet-audience h2 { font-size: clamp(1.65rem, 8vw, 2rem); white-space: normal; }
  .blocknet-get-started-page .blocknet-audience p { font-size: 1.02rem; }
}

.blocknet-route-menu {
  margin-top: 14px;
}

.blocknet-home-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px;
  padding: 0 24px;
}

.blocknet-home-card {
  --tile-rgb: 75, 220, 255;
  position: relative;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 30px;
  min-height: 106px;
  align-items: center;
  gap: 12px;
  padding: 18px 20px;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  border: 1px solid rgba(var(--tile-rgb), 0.34);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(var(--tile-rgb), 0.1), rgba(4, 10, 16, 0.94) 55%);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.blocknet-home-card::before { position: absolute; inset: 0; content: ""; background: linear-gradient(112deg, transparent 28%, rgba(255,255,255,.16) 48%, transparent 68%); transform: translateX(-120%); transition: transform 460ms ease; }
.blocknet-home-card:hover { transform: translateY(-3px); border-color: rgba(var(--tile-rgb), 0.72); box-shadow: 0 18px 32px rgba(0,0,0,.25), 0 0 25px rgba(var(--tile-rgb), 0.1); }
.blocknet-home-card:hover::before { transform: translateX(120%); }
.blocknet-home-card svg { position: relative; width: 44px; fill: none; stroke: rgb(var(--tile-rgb)); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 8px rgba(var(--tile-rgb), 0.4)); }
.blocknet-home-card span { position: relative; display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.blocknet-home-card strong { color: #f1f6f9; font-size: 1.12rem; letter-spacing: 0.04em; }
.blocknet-home-card small { color: rgb(var(--tile-rgb)); font-size: 0.72rem; font-weight: 900; letter-spacing: 0.12em; }
.blocknet-home-card b { position: relative; color: rgb(var(--tile-rgb)); font-size: 1.16rem; }
.blocknet-home-card--supply { --tile-rgb: 255, 200, 87; }
.blocknet-home-card--start {
  --tile-rgb: 85, 245, 172;
  border-color: rgba(var(--tile-rgb), 0.72);
  background:
    radial-gradient(circle at 16% 50%, rgba(var(--tile-rgb), 0.2), transparent 34%),
    linear-gradient(135deg, rgba(var(--tile-rgb), 0.15), rgba(4, 10, 16, 0.96) 58%);
  box-shadow: 0 0 34px rgba(var(--tile-rgb), 0.12), inset 0 1px rgba(255, 255, 255, 0.06);
}
.blocknet-home-card--start strong { color: #eafff4; }
.blocknet-home-card--staking { --tile-rgb: 85, 245, 172; }
.blocknet-home-card--nodes { --tile-rgb: 91, 135, 255; }
.blocknet-home-card--sources { --tile-rgb: 194, 210, 220; }
.blocknet-home-card--dao { --tile-rgb: 170, 140, 255; }

@keyframes blocknet-orbit { to { transform: rotate(360deg); } }

@media (max-width: 820px) {
  .blocknet-status { grid-template-columns: 1fr auto; }
  .blocknet-status > span:nth-child(2) { display: none; }
  .blocknet-home-page .blocknet-status__online { max-width: 470px; font-size: 0.57rem; letter-spacing: 0.14em; white-space: normal; }
  .blocknet-home-hero { grid-template-columns: 1fr; justify-items: center; gap: 6px; padding: 22px 24px 17px; }
  .blocknet-brand { width: 100%; padding: 12px 16px 22px; }
  .blocknet-brand__core { width: 98px; height: 98px; border-radius: 29px; }
  .blocknet-brand__core img { width: 58px; }
  .blocknet-brand h1 { font-size: clamp(3.5rem, 14vw, 5.5rem); transform: none; }
  .blocknet-home-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .blocknet-home-metrics__source { grid-column: 1 / -1; }
  .blocknet-audiences { grid-template-columns: 1fr; }
  .blocknet-home-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-home-card--start { width: calc(50% - 5.5px); grid-column: 1 / -1; justify-self: center; }
}

@media (max-width: 540px) {
  .blocknet-shell { width: calc(100% - 12px); margin-top: 8px; }
  .blocknet-console { border-radius: 19px; }
  .blocknet-status { min-height: 37px; padding: 0 12px; font-size: 0.53rem; }
  .blocknet-home-hero { padding: 14px 10px 10px; }
  .blocknet-brand { grid-template-columns: 1fr; text-align: left; }
  .blocknet-brand__core { width: 88px; height: 88px; }
  .blocknet-home-page .blocknet-status__online { max-width: 240px; font-size: 0.47rem; letter-spacing: 0.09em; }
  .blocknet-home-metrics { grid-template-columns: 1fr; }
  .blocknet-home-metrics__source { grid-column: auto; padding: 0 4px 7px; }
  .blocknet-audiences { padding: 0 10px 10px; }
  .blocknet-audience { min-height: 205px; padding: 20px 18px; }
  .blocknet-audience h2 { margin-top: 34px; }
  .blocknet-route-menu { margin-top: 10px; }
  .blocknet-home-grid { grid-template-columns: 1fr; padding: 0 10px 12px; }
  .blocknet-home-card--start { width: 100%; grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .blocknet-brand__core::before,
  .blocknet-brand__core span { animation: none; }
  .blocknet-home-card,
  .blocknet-audience { transition: none; }
}

/* Shared Blocknet subpages */
.blocknet-subpage { width: min(1180px, calc(100% - 28px)); margin: 18px auto 54px; }
.blocknet-subnav {
  display: flex;
  min-height: 66px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-bottom: 12px;
  padding: 10px 12px;
  overflow-x: auto;
  border: 1px solid rgba(75, 220, 255, 0.2);
  border-radius: 17px;
  background: rgba(3, 10, 16, 0.9);
  scrollbar-width: thin;
}

.blocknet-subnav__home {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  place-items: center;
  border: 1px solid rgba(75, 220, 255, 0.28);
  border-radius: 11px;
  background: rgba(75, 220, 255, 0.08);
}

.blocknet-subnav__home img { width: 27px; filter: drop-shadow(0 0 9px rgba(75, 220, 255, 0.48)); }
.blocknet-subnav__home.is-active { border-color: rgba(75, 220, 255, 0.62); background: rgba(75, 220, 255, 0.15); box-shadow: 0 0 22px rgba(75, 220, 255, 0.13); }
.blocknet-subnav__link {
  --nav-rgb: 75, 220, 255;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  padding: 10px 15px;
  color: rgba(var(--nav-rgb), .9);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.045em;
  text-decoration: none;
  text-transform: uppercase;
  border: 1px solid rgba(var(--nav-rgb), .2);
  border-radius: 10px;
  background: rgba(var(--nav-rgb), .045);
  transition: color 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}
.blocknet-subnav__link:nth-of-type(2) { --nav-rgb: 85, 245, 172; }
.blocknet-subnav__link:nth-of-type(3) { --nav-rgb: 255, 200, 87; }
.blocknet-subnav__link:nth-of-type(4) { --nav-rgb: 85, 245, 172; }
.blocknet-subnav__link:nth-of-type(5) { --nav-rgb: 104, 146, 255; }
.blocknet-subnav__link:nth-of-type(6) { --nav-rgb: 75, 220, 255; }
.blocknet-subnav__link:nth-of-type(7) { --nav-rgb: 167, 123, 255; }

.blocknet-subnav__link:hover,
.blocknet-subnav__link.is-active { color: #f3fcff; border-color: rgba(var(--nav-rgb), .62); background: rgba(var(--nav-rgb), .15); box-shadow: 0 0 22px rgba(var(--nav-rgb), .13); }
.blocknet-subpage-panel { padding-bottom: 22px; }

.blocknet-page-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 24px;
  align-items: center;
  min-height: 230px;
  padding: 35px 42px 28px;
  border-bottom: 1px solid rgba(75, 220, 255, 0.16);
  background:
    radial-gradient(circle at 80% 14%, rgba(75, 220, 255, 0.14), transparent 30%),
    linear-gradient(125deg, rgba(6, 24, 34, 0.78), rgba(4, 9, 15, 0.4));
}

.blocknet-page-hero__copy h1 { margin: 7px 0 0; color: #f5f9fb; font-family: Georgia, "Times New Roman", serif; font-size: clamp(3.1rem, 6vw, 5.7rem); line-height: 0.9; letter-spacing: -0.055em; }
.blocknet-page-hero__copy p { max-width: 760px; margin: 18px 0 0; color: #aebfca; font-size: 1.03rem; line-height: 1.6; }
.blocknet-page-hero__copy strong { color: #e6f8ff; }
.blocknet-page-hero__mark { display: grid; width: 126px; height: 126px; place-items: center; justify-self: center; border: 1px solid rgba(75, 220, 255, 0.38); border-radius: 36px; background: radial-gradient(circle, rgba(75,220,255,.2), rgba(3,11,17,.94) 68%); box-shadow: 0 0 45px rgba(75,220,255,.14); transform: rotate(-7deg); }
.blocknet-page-hero__mark img { width: 74px; transform: rotate(7deg); filter: drop-shadow(0 0 16px rgba(75,220,255,.38)); }

.blocknet-staking-page .blocknet-status > span:nth-child(2) { color: var(--block-cyan); font-size: 0.68rem; letter-spacing: 0.17em; }
.blocknet-staking-page .blocknet-staking-hero { grid-template-columns: minmax(0, 1fr) 150px; }
.blocknet-staking-page .blocknet-page-hero__copy { text-align: left; }
.blocknet-staking-page .blocknet-page-hero__copy h1 { margin-top: 0; text-align: left; transform: none; }

@media (max-width: 820px) {
  .blocknet-staking-page .blocknet-status { grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
  .blocknet-staking-page .blocknet-status > span:nth-child(2) { display: block; justify-self: end; max-width: 290px; text-align: right; line-height: 1.35; }
  .blocknet-staking-page .blocknet-status > span:last-child { display: none; }
}

.blocknet-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; padding: 16px 22px 0; }
.blocknet-metric { min-height: 92px; padding: 16px; border: 1px solid rgba(75,220,255,.18); border-radius: 14px; background: rgba(5,14,21,.82); }
.blocknet-metric small { display: block; color: var(--block-muted); font-size: 0.6rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.blocknet-metric strong { display: block; margin-top: 7px; color: var(--block-green); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.35rem, 2.8vw, 2rem); line-height: 1; }
.blocknet-metric span { display: block; margin-top: 5px; color: #78909f; font-size: .66rem; }

.blocknet-content { padding: 16px 22px 0; }
.blocknet-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin: 6px 0 13px; }
.blocknet-section-heading span { color: var(--block-cyan); font-size: .62rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.blocknet-section-heading h2 { margin: 5px 0 0; color: #f2f6f8; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1; }
.blocknet-section-heading p { max-width: 470px; margin: 0; color: #8498a6; font-size: .78rem; line-height: 1.45; text-align: right; }

.blocknet-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.blocknet-card-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.blocknet-info-card { position: relative; min-height: 190px; padding: 23px; overflow: hidden; border: 1px solid rgba(75,220,255,.2); border-radius: 17px; background: linear-gradient(145deg, rgba(75,220,255,.07), rgba(3,10,16,.93) 48%); }
.blocknet-info-card::after { position: absolute; right: -42px; bottom: -54px; width: 120px; height: 120px; content: ""; border: 1px solid rgba(75,220,255,.12); border-radius: 50%; }
.blocknet-info-card__index { color: var(--block-cyan); font-size: .61rem; font-weight: 900; letter-spacing: .15em; }
.blocknet-info-card h3 { margin: 18px 0 8px; color: #eff6f9; font-family: Georgia, "Times New Roman", serif; font-size: 1.55rem; line-height: 1.05; }
.blocknet-info-card p { margin: 0; color: #9aadb9; font-size: .84rem; line-height: 1.58; }
.blocknet-info-card strong { color: #e7f8ff; }
.blocknet-info-card ul { margin: 11px 0 0; padding-left: 19px; color: #9aadb9; font-size: .82rem; line-height: 1.65; }
.blocknet-info-card a { color: var(--block-cyan); font-weight: 900; text-decoration: none; }

.blocknet-callout { margin-top: 12px; padding: 18px 21px; border: 1px solid rgba(85,245,172,.24); border-radius: 15px; background: linear-gradient(90deg, rgba(85,245,172,.09), rgba(5,13,19,.88)); color: #a9bdc7; font-size: .86rem; line-height: 1.55; }
.blocknet-callout strong { color: var(--block-green); }

.blocknet-source-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.blocknet-source { display: flex; min-height: 110px; flex-direction: column; justify-content: space-between; padding: 18px; color: inherit; text-decoration: none; border: 1px solid rgba(75,220,255,.2); border-radius: 15px; background: rgba(5,14,21,.84); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.blocknet-source:hover { transform: translateY(-3px); border-color: rgba(75,220,255,.58); box-shadow: 0 16px 30px rgba(0,0,0,.24), 0 0 22px rgba(75,220,255,.08); }
.blocknet-source small { color: var(--block-cyan); font-size: .58rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.blocknet-source strong { margin-top: 12px; color: #eff7fa; font-size: 1rem; }
.blocknet-source span { margin-top: 5px; color: #7e95a4; font-size: .7rem; }

/* Sources page mirrors the shared Supply and Staking hero composition. */
.blocknet-sources-page .blocknet-sources-hero {
  grid-template-areas:
    "copy mark"
    "metrics metrics";
  grid-template-columns: minmax(0, 1fr) 112px;
  align-items: center;
  gap: 25px 30px;
  min-height: 0;
  padding: 29px 30px 25px;
  background:
    radial-gradient(circle at 88% 10%, rgba(75, 220, 255, .13), transparent 32%),
    linear-gradient(125deg, rgba(6, 28, 38, .94), rgba(3, 9, 15, .5));
}
.blocknet-sources-page .blocknet-sources-hero .blocknet-page-hero__copy { grid-area: copy; max-width: none; text-align: left; }
.blocknet-sources-page .blocknet-sources-hero h1 { margin: 0; font-size: clamp(2.85rem, 4.8vw, 4.45rem); line-height: .92; text-align: left; white-space: nowrap; }
.blocknet-sources-page .blocknet-sources-hero p { max-width: 790px; margin-top: 16px; color: #d1e0e6; font-size: 1.03rem; line-height: 1.58; }
.blocknet-sources-page .blocknet-sources-hero > .blocknet-page-hero__mark { grid-area: mark; width: 104px; height: 104px; border-radius: 30px; }
.blocknet-sources-page .blocknet-sources-hero > .blocknet-page-hero__mark img { width: 61px; }
.blocknet-sources-hero__metrics { display: grid; grid-area: metrics; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.blocknet-sources-hero__metrics article {
  display: flex;
  min-height: 92px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 13px 12px;
  border: 1px solid rgba(75, 220, 255, .2);
  border-radius: 13px;
  background: rgba(3, 13, 19, .84);
  text-align: center;
}
.blocknet-sources-hero__metrics article:nth-child(2) { border-color: rgba(85, 245, 172, .24); }
.blocknet-sources-hero__metrics article:nth-child(3) { border-color: rgba(167, 123, 255, .25); }
.blocknet-sources-hero__metrics small { color: var(--block-cyan); font-size: .6rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.blocknet-sources-hero__metrics article:nth-child(2) small { color: var(--block-green); }
.blocknet-sources-hero__metrics article:nth-child(3) small { color: #b99aff; }
.blocknet-sources-hero__metrics strong { margin-top: 5px; color: #f0f8fa; font-family: Georgia, "Times New Roman", serif; font-size: 1.28rem; line-height: 1; }
.blocknet-sources-hero__metrics span { margin-top: 6px; color: #b9cbd3; font-size: .72rem; }
.blocknet-sources-page .blocknet-sources-directory { padding-top: 24px; }
.blocknet-sources-directory__heading { align-items: end; margin-bottom: 16px; }
.blocknet-sources-directory__heading h2 { font-size: clamp(2.2rem, 3.7vw, 3.05rem); white-space: nowrap; }
.blocknet-sources-page .blocknet-source-grid { gap: 12px; }
.blocknet-sources-page .blocknet-source {
  --source-rgb: 75, 220, 255;
  position: relative;
  min-height: 166px;
  justify-content: flex-start;
  padding: 23px 54px 22px 23px;
  overflow: hidden;
  border-color: rgba(var(--source-rgb), .25);
  background:
    radial-gradient(circle at 100% 0, rgba(var(--source-rgb), .13), transparent 43%),
    linear-gradient(145deg, rgba(7, 25, 33, .97), rgba(3, 11, 17, .97));
}
.blocknet-sources-page .blocknet-source::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  content: "";
  background: rgb(var(--source-rgb));
  box-shadow: 0 0 16px rgba(var(--source-rgb), .6);
}
.blocknet-sources-page .blocknet-source::after {
  position: absolute;
  right: 20px;
  bottom: 19px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  content: "↗";
  color: rgb(var(--source-rgb));
  font-size: 1rem;
  border: 1px solid rgba(var(--source-rgb), .35);
  border-radius: 50%;
  background: rgba(var(--source-rgb), .07);
}
.blocknet-sources-page .blocknet-source--docs { --source-rgb: 85, 245, 172; }
.blocknet-sources-page .blocknet-source--network { --source-rgb: 104, 146, 255; }
.blocknet-sources-page .blocknet-source--explorer { --source-rgb: 255, 200, 87; }
.blocknet-sources-page .blocknet-source--code { --source-rgb: 167, 123, 255; }
.blocknet-sources-page .blocknet-source--community { --source-rgb: 255, 126, 176; }
.blocknet-sources-page .blocknet-source small { color: rgb(var(--source-rgb)); font-size: .62rem; }
.blocknet-sources-page .blocknet-source strong { margin-top: 20px; color: #f3f9fb; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.35rem, 2vw, 1.65rem); line-height: 1; white-space: nowrap; }
.blocknet-sources-page .blocknet-source span { margin-top: 11px; color: #b0c2ca; font-size: .78rem; line-height: 1.45; }
.blocknet-sources-page .blocknet-source:hover { border-color: rgba(var(--source-rgb), .65); box-shadow: 0 16px 32px rgba(0,0,0,.25), 0 0 24px rgba(var(--source-rgb), .09); }
.blocknet-sources-page .blocknet-source:hover::after { color: #03110d; border-color: rgb(var(--source-rgb)); background: rgb(var(--source-rgb)); }

@media (max-width: 850px) {
  .blocknet-page-hero { grid-template-columns: 1fr 105px; padding: 28px 25px; }
  .blocknet-page-hero__mark { width: 96px; height: 96px; border-radius: 28px; }
  .blocknet-page-hero__mark img { width: 58px; }
  .blocknet-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-card-grid, .blocknet-source-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .blocknet-subpage { width: calc(100% - 12px); margin-top: 8px; }
  .blocknet-subnav { min-height: 62px; justify-content: flex-start; gap: 7px; padding: 8px; border-radius: 13px; }
  .blocknet-subnav__link { min-height: 40px; padding: 9px 13px; font-size: .68rem; }
  .blocknet-subpage-panel { border-radius: 18px; }
  .blocknet-page-hero { grid-template-columns: 1fr; text-align: center; }
  .blocknet-page-hero__mark { grid-row: 1; }
  .blocknet-page-hero__copy h1 { font-size: clamp(3rem, 15vw, 4.3rem); }
  .blocknet-get-started-page .blocknet-page-hero { min-height: 0; padding: 23px 18px 21px; text-align: left; }
  .blocknet-get-started-page .blocknet-page-hero__copy h1 { font-size: clamp(2.1rem, 9.5vw, 2.65rem); }
  .blocknet-get-started-page .blocknet-page-hero__copy p { margin-top: 12px; font-size: .94rem; line-height: 1.5; }
  .blocknet-get-started-page .blocknet-section-heading { gap: 7px; }
  .blocknet-get-started-page .blocknet-section-heading h2 { font-size: clamp(1.12rem, 5.2vw, 1.38rem); }
  .blocknet-get-started-page .blocknet-section-heading p { font-size: .74rem; }
  .blocknet-get-started-page .blocknet-audience h2 { font-size: clamp(1.32rem, 6.2vw, 1.65rem); }
  .blocknet-staking-page .blocknet-staking-hero { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 24px 18px; }
  .blocknet-staking-page .blocknet-page-hero__mark { grid-row: 1; justify-self: start; }
  .blocknet-staking-page .blocknet-page-hero__copy h1 { font-size: clamp(2.8rem, 14vw, 4rem); }
  .blocknet-staking-page .blocknet-status > span:nth-child(2) { max-width: 245px; font-size: 0.5rem; letter-spacing: 0.1em; }
  .blocknet-metrics, .blocknet-card-grid, .blocknet-card-grid--two, .blocknet-source-grid { grid-template-columns: 1fr; }
  .blocknet-metrics, .blocknet-content { padding-right: 10px; padding-left: 10px; }
  .blocknet-section-heading { align-items: start; flex-direction: column; }
  .blocknet-section-heading p { text-align: left; }
  .blocknet-sources-page .blocknet-sources-hero {
    grid-template-areas:
      "mark"
      "copy"
      "metrics";
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    padding: 24px 18px 20px;
  }
  .blocknet-sources-page .blocknet-sources-hero > .blocknet-page-hero__mark { justify-self: start; width: 82px; height: 82px; border-radius: 24px; }
  .blocknet-sources-page .blocknet-sources-hero > .blocknet-page-hero__mark img { width: 49px; }
  .blocknet-sources-page .blocknet-sources-hero h1 { font-size: clamp(1.58rem, 6.5vw, 1.85rem); white-space: nowrap; }
  .blocknet-sources-page .blocknet-sources-hero p { font-size: .96rem; }
  .blocknet-sources-hero__metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .blocknet-sources-hero__metrics article { min-height: 96px; padding: 10px 6px; }
  .blocknet-sources-hero__metrics strong { font-size: .9rem; }
  .blocknet-sources-hero__metrics span { font-size: .6rem; }
  .blocknet-sources-directory__heading h2 { font-size: clamp(1.35rem, 5.8vw, 1.55rem); white-space: nowrap; }
  .blocknet-sources-page .blocknet-source { min-height: 150px; }
}

/* Staking calculator */
.blocknet-live-source { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 14px 22px 0; padding: 14px 17px; border: 1px solid rgba(85,245,172,.23); border-radius: 14px; background: rgba(85,245,172,.055); }
.blocknet-live-source__state { display: flex; min-width: 0; align-items: center; gap: 10px; }
.blocknet-live-source__dot { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: var(--block-gold); box-shadow: 0 0 14px rgba(255,200,87,.72); }
.blocknet-live-source__dot.is-current { background: var(--block-green); box-shadow: 0 0 14px rgba(85,245,172,.75); }
.blocknet-live-source strong { display: block; color: #eaf6f9; font-size: .82rem; }
.blocknet-live-source small { display: block; margin-top: 3px; color: #79909e; font-size: .67rem; }
.blocknet-live-source a { flex: 0 0 auto; color: var(--block-cyan); font-size: .68rem; font-weight: 900; text-decoration: none; }

.blocknet-calculator { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr); gap: 13px; }
.blocknet-calculator__inputs, .blocknet-calculator__results { padding: 22px; border: 1px solid rgba(75,220,255,.2); border-radius: 17px; background: rgba(4,13,19,.9); }
.blocknet-calculator__inputs h3, .blocknet-calculator__results h3 { margin: 0 0 16px; color: #f0f6f8; font-family: Georgia, "Times New Roman", serif; font-size: 1.65rem; }
.blocknet-field { display: block; margin-top: 12px; }
.blocknet-field span { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 6px; color: #a6b6c0; font-size: .73rem; font-weight: 900; }
.blocknet-field small { color: #66808f; font-weight: 400; }
.blocknet-field input { width: 100%; height: 46px; padding: 0 13px; color: #eafcff; font: 900 1rem/1 "Trebuchet MS", sans-serif; border: 1px solid rgba(75,220,255,.27); border-radius: 10px; outline: none; background: rgba(75,220,255,.055); }
.blocknet-field input:focus { border-color: rgba(75,220,255,.72); box-shadow: 0 0 0 3px rgba(75,220,255,.08), 0 0 20px rgba(75,220,255,.08); }
.blocknet-field__hint {
  display: block;
  margin-top: 6px;
  color: #7f96a2;
  font-size: 0.67rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.4;
}
.blocknet-field--scenario input { border-color: rgba(85,245,172,.3); background: linear-gradient(90deg, rgba(85,245,172,.08), rgba(75,220,255,.04)); }
.blocknet-field--scenario input:focus { border-color: var(--block-green); box-shadow: 0 0 0 3px rgba(85,245,172,.08), 0 0 22px rgba(85,245,172,.09); }
.blocknet-calc-mode { display: block; margin-top: 10px; color: #708895; font-size: .66rem; line-height: 1.4; }
.blocknet-calc-button { width: 100%; min-height: 42px; margin-top: 15px; color: #04120d; font-weight: 900; letter-spacing: .06em; border: 0; border-radius: 10px; background: var(--block-green); cursor: pointer; box-shadow: 0 0 22px rgba(85,245,172,.16); }
.blocknet-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.blocknet-result {
  position: relative;
  display: flex;
  height: 78px;
  min-height: 0;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 8px 12px;
  overflow: hidden;
  text-align: center;
  border: 1px solid rgba(85,245,172,.2);
  border-radius: 13px;
  background:
    radial-gradient(circle at 50% 120%, rgba(85,245,172,.11), transparent 55%),
    linear-gradient(145deg, rgba(85,245,172,.075), rgba(3,11,16,.82));
}
.blocknet-result::before {
  position: absolute;
  top: 0;
  left: 27%;
  width: 46%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(85,245,172,.7), transparent);
}
.blocknet-result small { color: #9aadb6; font-size: .66rem; font-weight: 900; line-height: 1; letter-spacing: .1em; text-transform: uppercase; }
.blocknet-result strong { display: block; margin-top: 5px; color: var(--block-green); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.3rem, 2.35vw, 1.78rem); line-height: 1; text-shadow: 0 0 18px rgba(85,245,172,.13); }
.blocknet-result span { display: block; margin-top: 3px; color: #8ea2ac; font-size: .75rem; line-height: 1; }
.blocknet-result--reward strong { margin-top: 7px; }
.blocknet-formula { margin-top: 11px; padding: 12px 14px; color: #7f96a4; font: .69rem/1.5 Consolas, monospace; border: 1px solid rgba(75,220,255,.12); border-radius: 10px; background: rgba(0,0,0,.18); }

@media (max-width: 760px) {
  .blocknet-calculator { grid-template-columns: 1fr; }
  .blocknet-live-source { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 430px) {
  .blocknet-result-grid { grid-template-columns: 1fr; }
  .blocknet-staking-page .blocknet-result-grid { gap: 3px; }
  .blocknet-staking-page .blocknet-result { height: 72px; padding: 6px 10px; }
  .blocknet-staking-page .blocknet-result strong { margin-top: 3px; font-size: 1.3rem; }
  .blocknet-staking-page .blocknet-result span { margin-top: 2px; }
}

/* Service Node hero mirrors the Staking hero. */
.blocknet-service-page .blocknet-status > span:nth-child(2) {
  color: var(--block-cyan);
  font-size: 0.68rem;
  letter-spacing: 0.17em;
}

.blocknet-service-page .blocknet-service-hero {
  grid-template-areas:
    "copy mark"
    "metrics metrics";
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 15px 24px;
  min-height: 0;
  padding: 23px 30px 19px;
}

.blocknet-service-page .blocknet-page-hero__copy { grid-area: copy; text-align: left; }
.blocknet-service-page .blocknet-page-hero__mark {
  grid-area: mark;
  width: 104px;
  height: 104px;
  border-radius: 30px;
}
.blocknet-service-page .blocknet-page-hero__mark img { width: 61px; }
.blocknet-service-page .blocknet-page-hero__copy h1 {
  margin-top: 0;
  font-size: clamp(2.75rem, 5vw, 4.65rem);
  line-height: 0.92;
  text-align: left;
  transform: none;
}
.blocknet-service-page .blocknet-page-hero__copy p {
  max-width: 900px;
  margin-top: 13px;
  font-size: clamp(1rem, 1.35vw, 1.16rem);
  line-height: 1.52;
}
.blocknet-service-hero__easy {
  display: block;
  margin-top: 5px;
  color: #d8e6ec;
}

.blocknet-service-hero__metrics {
  grid-area: metrics;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  padding-top: 13px;
  border-top: 1px solid rgba(75, 220, 255, 0.15);
}
.blocknet-service-hero__metric {
  min-width: 0;
  min-height: 76px;
  padding: 10px 12px;
  border: 1px solid rgba(75, 220, 255, 0.17);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(75, 220, 255, 0.065), rgba(85, 245, 172, 0.025));
}
.blocknet-service-hero__metric small {
  display: block;
  color: #92a7b2;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}
.blocknet-service-hero__metric strong {
  display: block;
  margin-top: 5px;
  overflow-wrap: anywhere;
  color: var(--block-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.08rem, 1.75vw, 1.42rem);
  line-height: 1;
}
.blocknet-service-hero__metric > span {
  display: block;
  margin-top: 5px;
  color: #8ca1ac;
  font-size: 0.72rem;
}

@media (max-width: 930px) {
  .blocknet-service-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .blocknet-service-page .blocknet-status { grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
  .blocknet-service-page .blocknet-status > span:nth-child(2) { display: block; justify-self: end; max-width: 290px; text-align: right; line-height: 1.35; }
  .blocknet-service-page .blocknet-status > span:last-child { display: none; }
}

@media (max-width: 560px) {
  .blocknet-service-page .blocknet-service-hero {
    grid-template-areas:
      "mark"
      "copy"
      "metrics";
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 20px 17px;
  }
  .blocknet-service-page .blocknet-page-hero__mark {
    grid-row: auto;
    justify-self: start;
    width: 82px;
    height: 82px;
    border-radius: 24px;
  }
  .blocknet-service-page .blocknet-page-hero__mark img { width: 49px; }
  .blocknet-service-page .blocknet-page-hero__copy h1 { font-size: clamp(2.45rem, 12vw, 3.2rem); }
  .blocknet-service-page .blocknet-page-hero__copy p { font-size: 1rem; line-height: 1.55; }
  .blocknet-service-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Blocknet staking dashboard */
.blocknet-staking-page .blocknet-staking-hero {
  grid-template-areas:
    "copy mark"
    "metrics metrics";
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 15px 24px;
  min-height: 0;
  padding: 23px 30px 19px;
}

.blocknet-staking-page .blocknet-page-hero__copy { grid-area: copy; }
.blocknet-staking-page .blocknet-page-hero__mark {
  grid-area: mark;
  width: 104px;
  height: 104px;
  border-radius: 30px;
}
.blocknet-staking-page .blocknet-page-hero__mark img { width: 61px; }
.blocknet-staking-page .blocknet-page-hero__copy h1 {
  font-size: clamp(2.75rem, 5vw, 4.65rem);
  line-height: 0.92;
}
.blocknet-staking-page .blocknet-page-hero__copy p {
  max-width: 900px;
  margin-top: 13px;
  font-size: clamp(1rem, 1.35vw, 1.16rem);
  line-height: 1.52;
}
.blocknet-staking-hero__easy {
  display: block;
  margin-top: 5px;
  color: #d8e6ec;
}

.blocknet-staking-hero__metrics {
  grid-area: metrics;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 7px;
  padding-top: 13px;
  border-top: 1px solid rgba(75, 220, 255, 0.15);
}
.blocknet-staking-hero__metric {
  min-width: 0;
  min-height: 76px;
  padding: 10px 12px;
  border: 1px solid rgba(75, 220, 255, 0.17);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(75, 220, 255, 0.065), rgba(85, 245, 172, 0.025));
}
.blocknet-staking-hero__metric small {
  display: block;
  color: #92a7b2;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}
.blocknet-staking-hero__metric strong {
  display: block;
  margin-top: 5px;
  overflow-wrap: anywhere;
  color: var(--block-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.08rem, 1.75vw, 1.42rem);
  line-height: 1;
}
.blocknet-staking-hero__metric > span {
  display: block;
  margin-top: 5px;
  color: #8ca1ac;
  font-size: 0.72rem;
}
.blocknet-staking-hero__not-staked b { color: #ff6576; font-size: 0.94rem; font-weight: 900; line-height: 0; }
.blocknet-staking-hero__snapshot {
  display: inline-flex !important;
  width: auto;
  max-width: 100%;
  align-items: center;
  margin-top: 4px !important;
  padding: 3px 6px;
  overflow: hidden;
  color: #8ca4b0 !important;
  font-size: 0.57rem !important;
  font-weight: 800;
  letter-spacing: 0.015em;
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 1px solid rgba(75, 220, 255, 0.16);
  border-radius: 6px;
  background: rgba(75, 220, 255, 0.045);
}

.blocknet-source-chip {
  display: flex;
  min-height: 32px;
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
  padding: 5px 2px 9px;
  color: #718a98;
  font-size: 0.68rem;
  border-bottom: 1px solid rgba(75, 220, 255, 0.11);
}
.blocknet-source-chip strong { color: #dcebf0; font-size: 0.72rem; }
.blocknet-source-chip span { min-width: 0; }
.blocknet-source-chip a {
  margin-left: auto;
  color: var(--block-cyan);
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-decoration: none;
  text-transform: uppercase;
}
.blocknet-source-chip a:hover { color: #fff; }

.blocknet-section-heading--calculator {
  align-items: start;
  margin-top: 0;
}
.blocknet-section-heading--calculator > div:first-child { flex: 0 0 auto; }
.blocknet-section-heading--calculator h2 {
  font-size: clamp(2.15rem, 3.25vw, 2.8rem);
  white-space: nowrap;
}
.blocknet-section-heading__side {
  display: grid;
  min-width: 0;
  flex: 1 1 auto;
  gap: 8px;
  justify-items: end;
  overflow: hidden;
}
.blocknet-section-heading__side .blocknet-source-chip {
  display: grid;
  grid-template-areas:
    "dot status source"
    ". meta meta";
  grid-template-columns: 9px auto minmax(0, 1fr);
  width: 100%;
  min-height: 0;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 2px 0 7px;
  white-space: nowrap;
  border-bottom: 0;
}
.blocknet-section-heading__side .blocknet-source-chip > i { grid-area: dot; }
.blocknet-section-heading__side .blocknet-source-chip strong {
  grid-area: status;
  font-size: 0.66rem;
  white-space: nowrap;
}
.blocknet-section-heading__side .blocknet-source-chip span {
  grid-area: meta;
  justify-self: end;
  width: auto;
  color: #6f8794;
  font-size: 0.6rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
}
.blocknet-section-heading__side .blocknet-source-chip a {
  grid-area: source;
  justify-self: end;
  margin-left: 0;
  font-size: 0.6rem;
  white-space: nowrap;
}
.blocknet-section-heading__side .blocknet-source-chip--link {
  display: flex;
  justify-content: flex-end;
  padding: 4px 0;
}
.blocknet-section-heading__side > p {
  width: 100%;
  max-width: none;
  margin: 0;
  font-size: 0.72rem;
  line-height: 1.45;
}

.blocknet-field__control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px !important;
  margin: 0 !important;
}
.blocknet-field__control input { min-width: 0; }
.blocknet-field__control button {
  min-width: 104px;
  padding: 0 11px;
  color: #dffff0;
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  border: 1px solid rgba(85, 245, 172, 0.38);
  border-radius: 9px;
  background: rgba(85, 245, 172, 0.09);
  cursor: pointer;
}
.blocknet-field__control button:hover,
.blocknet-field__control button:focus-visible {
  border-color: var(--block-green);
  outline: none;
  box-shadow: 0 0 20px rgba(85, 245, 172, 0.12);
}

.blocknet-return-note {
  margin: 10px 0 0;
  padding: 13px 15px;
  color: #a9bcc5;
  font-size: 0.78rem;
  line-height: 1.55;
  border: 1px solid rgba(255, 200, 87, 0.2);
  border-left: 3px solid var(--block-gold);
  border-radius: 11px;
  background: rgba(255, 200, 87, 0.055);
}
.blocknet-return-note strong { color: var(--block-gold); }
.blocknet-calculator__results .blocknet-formula {
  display: grid;
  gap: 6px;
  margin-top: 10px;
  padding: 14px 16px;
  color: #a6bbc5;
  font: 0.84rem/1.55 Consolas, monospace;
}
.blocknet-calculator__results .blocknet-formula strong {
  color: var(--block-cyan);
  font: 900 0.68rem/1.2 "Trebuchet MS", sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.blocknet-calculator__results .blocknet-formula span:last-child { color: #d8e5ea; }

.blocknet-apr-history {
  margin: 17px 22px 0;
  padding: 23px;
  border: 1px solid rgba(75, 220, 255, 0.19);
  border-radius: 18px;
  background:
    radial-gradient(circle at 92% 0, rgba(85, 245, 172, 0.09), transparent 34%),
    linear-gradient(145deg, rgba(7, 21, 29, 0.96), rgba(3, 9, 14, 0.98));
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.24);
}
.blocknet-apr-history__header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
}
.blocknet-apr-history__header > div:first-child > span {
  color: var(--block-cyan);
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.16em;
}
.blocknet-apr-history__header h2 {
  margin: 6px 0 4px;
  color: #f2f8fa;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1;
}
.blocknet-apr-history__header p {
  max-width: 620px;
  margin: 0;
  color: #8298a5;
  font-size: 0.8rem;
  line-height: 1.5;
}
.blocknet-apr-history__ranges {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  width: min(100%, 650px);
  gap: 5px;
  overflow: visible;
}
.blocknet-apr-history__ranges button {
  min-width: 0;
  padding: 8px 5px;
  color: #78919e;
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.07em;
  border: 1px solid rgba(75, 220, 255, 0.15);
  border-radius: 8px;
  background: rgba(75, 220, 255, 0.035);
  cursor: pointer;
}
.blocknet-apr-history__ranges button:hover,
.blocknet-apr-history__ranges button.is-active {
  color: #03130d;
  border-color: var(--block-green);
  background: var(--block-green);
  box-shadow: 0 0 18px rgba(85, 245, 172, 0.13);
}
.blocknet-apr-history__summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 17px;
}
.blocknet-apr-history__summary article {
  padding: 12px 14px;
  border: 1px solid rgba(85, 245, 172, 0.14);
  border-radius: 11px;
  background: rgba(4, 14, 20, 0.72);
}
.blocknet-apr-history__summary small {
  display: block;
  color: #748b98;
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.blocknet-apr-history__summary strong {
  display: block;
  margin-top: 6px;
  color: var(--block-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.45rem;
}
.blocknet-apr-history__summary strong.is-negative { color: #ff6576; }
.blocknet-apr-history__stage {
  position: relative;
  min-height: 320px;
  margin-top: 10px;
  overflow-x: auto;
  border: 1px solid rgba(75, 220, 255, 0.12);
  border-radius: 14px;
  background:
    linear-gradient(rgba(255,255,255,0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.018) 1px, transparent 1px),
    rgba(1, 8, 13, 0.74);
  background-size: 38px 38px;
}
.blocknet-apr-history__stage svg { display: block; width: 100%; min-width: 680px; height: 320px; }
.blocknet-chart-grid { stroke: rgba(129, 166, 183, 0.16); stroke-width: 1; }
.blocknet-chart-label { fill: #708896; font: 600 13px "Trebuchet MS", sans-serif; }
.blocknet-chart-line { fill: none; stroke: url(#blocknetAprLine); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 8px rgba(85, 245, 172, 0.28)); }
.blocknet-chart-single { stroke: rgba(85, 245, 172, 0.32); stroke-width: 2; stroke-dasharray: 7 8; }
.blocknet-chart-point { fill: #55f5ac; stroke: #07131a; stroke-width: 3; }
.blocknet-apr-history__empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 25px;
  color: #839ba8;
  font-size: 0.82rem;
  text-align: center;
}
.blocknet-apr-history__empty[hidden] { display: none; }
.blocknet-apr-history__footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 11px;
  color: #718895;
  font-size: 0.68rem;
  line-height: 1.45;
}
.blocknet-apr-history__footer span:last-child { color: #b7a56e; text-align: right; }

@media (max-width: 930px) {
  .blocknet-staking-hero__metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .blocknet-staking-hero__metric:nth-child(4),
  .blocknet-staking-hero__metric:nth-child(5) { grid-column: span 1; }
  .blocknet-apr-history__header { align-items: start; flex-direction: column; }
  .blocknet-apr-history__ranges { grid-template-columns: repeat(6, minmax(0, 1fr)); width: 100%; }
  .blocknet-section-heading--calculator { flex-direction: column; }
  .blocknet-section-heading__side { width: 100%; justify-items: start; }
  .blocknet-section-heading__side .blocknet-source-chip { justify-content: flex-start; }
  .blocknet-section-heading__side > p { max-width: 700px; text-align: left; }
}

@media (max-width: 560px) {
  .blocknet-staking-page .blocknet-staking-hero {
    grid-template-areas:
      "mark"
      "copy"
      "metrics";
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 20px 17px;
  }
  .blocknet-staking-page .blocknet-page-hero__mark {
    grid-row: auto;
    justify-self: start;
    width: 82px;
    height: 82px;
    border-radius: 24px;
  }
  .blocknet-staking-page .blocknet-page-hero__mark img { width: 49px; }
  .blocknet-staking-page .blocknet-page-hero__copy h1 { font-size: clamp(2.45rem, 12vw, 3.2rem); }
  .blocknet-staking-page .blocknet-page-hero__copy p { font-size: 1rem; line-height: 1.55; }
  .blocknet-staking-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-staking-hero__metric:last-child { grid-column: 1 / -1; }
  .blocknet-source-chip { align-items: flex-start; flex-wrap: wrap; padding-inline: 2px; }
  .blocknet-source-chip span { order: 4; width: 100%; }
  .blocknet-source-chip a { margin-left: auto; }
  .blocknet-section-heading--calculator h2 { font-size: clamp(1.28rem, 5.6vw, 1.6rem); letter-spacing: -0.045em; white-space: nowrap; }
  .blocknet-section-heading__side .blocknet-source-chip { display: flex; justify-content: flex-start; white-space: normal; }
  .blocknet-section-heading__side .blocknet-source-chip > i,
  .blocknet-section-heading__side .blocknet-source-chip strong,
  .blocknet-section-heading__side .blocknet-source-chip span,
  .blocknet-section-heading__side .blocknet-source-chip a { grid-area: auto; }
  .blocknet-section-heading__side .blocknet-source-chip span { order: 4; width: 100%; white-space: normal; }
  .blocknet-section-heading__side .blocknet-source-chip a { margin-left: 0; }
  .blocknet-field__control { grid-template-columns: 1fr; }
  .blocknet-field__control button { min-height: 38px; }
  .blocknet-apr-history { margin-inline: 10px; padding: 17px 12px; }
  .blocknet-apr-history__summary { grid-template-columns: 1fr; }
  .blocknet-apr-history__footer { flex-direction: column; }
  .blocknet-apr-history__footer span:last-child { text-align: left; }
}

/* Audience routes and operator guides */
.blocknet-audience-page,
.blocknet-guide-page { --route-blue: #4bdcff; --route-green: #55f5ac; }

.blocknet-audience-hero,
.blocknet-guide-hero {
  grid-template-columns: minmax(0, 1fr) 142px;
  min-height: 265px;
  padding: 34px 42px;
  background:
    radial-gradient(circle at 84% 18%, rgba(85, 245, 172, 0.12), transparent 29%),
    linear-gradient(125deg, rgba(6, 28, 38, 0.92), rgba(3, 9, 15, 0.48));
}
.blocknet-audience-hero .blocknet-page-hero__copy,
.blocknet-guide-hero .blocknet-page-hero__copy { max-width: 880px; }
.blocknet-audience-hero .blocknet-page-hero__copy h1,
.blocknet-guide-hero .blocknet-page-hero__copy h1 { font-size: clamp(3.5rem, 7vw, 6.7rem); }
.blocknet-audience-hero .blocknet-page-hero__copy p,
.blocknet-guide-hero .blocknet-page-hero__copy p { max-width: 790px; font-size: 1.08rem; }
.blocknet-kicker { color: var(--block-cyan); font-size: 0.66rem; font-weight: 900; letter-spacing: 0.17em; text-transform: uppercase; }
.blocknet-page-hero__mark--xlite img { width: 92px; }

.blocknet-trader-status > span:nth-child(2) { justify-self: center; color: var(--block-cyan); font-size: .68rem; letter-spacing: .16em; }
.blocknet-trader-hero {
  grid-template-areas:
    "copy mark"
    "metrics metrics";
  grid-template-columns: minmax(0, 1fr) 112px;
  min-height: 0;
  align-items: center;
  gap: 24px 30px;
  padding: 29px 30px 25px;
  background:
    radial-gradient(circle at 88% 10%, rgba(75, 220, 255, .13), transparent 32%),
    linear-gradient(125deg, rgba(6, 28, 38, .94), rgba(3, 9, 15, .5));
}
.blocknet-trader-hero .blocknet-page-hero__copy { grid-area: copy; max-width: none; text-align: left; }
.blocknet-trader-hero .blocknet-page-hero__copy h1 { margin: 0; font-size: clamp(3.25rem, 5.3vw, 4.85rem); line-height: .92; text-align: left; white-space: nowrap; }
.blocknet-trader-hero .blocknet-page-hero__copy p { max-width: 760px; margin-top: 16px; color: #d3e0e6; font-size: 1.03rem; line-height: 1.58; }
.blocknet-trader-hero > .blocknet-page-hero__mark { grid-area: mark; width: 104px; height: 104px; border-radius: 30px; }
.blocknet-trader-hero > .blocknet-page-hero__mark img { width: 61px; }
.blocknet-trader-hero__metrics { display: grid; grid-area: metrics; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.blocknet-trader-hero__metric {
  display: flex;
  min-height: 94px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 13px 12px;
  overflow: hidden;
  border: 1px solid rgba(75, 220, 255, .2);
  border-radius: 13px;
  background: rgba(3, 13, 19, .84);
  text-align: center;
}
.blocknet-trader-hero__metric small { color: #b8cbd4; font-size: .6rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.blocknet-trader-hero__metric strong { margin-top: 5px; color: var(--block-green); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.35rem, 2vw, 1.65rem); line-height: 1; }
.blocknet-trader-hero__metric span { margin-top: 6px; color: #c4d2d8; font-size: .72rem; line-height: 1.3; }

.blocknet-trader-primer { padding-top: 20px; }
.blocknet-trader-primer .blocknet-section-heading { margin-top: 0; }
.blocknet-trader-primer .blocknet-section-heading h2 { font-size: clamp(2rem, 3.3vw, 2.85rem); }
.blocknet-trader-basics { gap: 10px; }
.blocknet-trader-basic {
  min-height: 260px;
  padding: 22px 23px;
  border-color: rgba(75, 220, 255, .25);
  background:
    radial-gradient(circle at 100% 0, rgba(75, 220, 255, .11), transparent 42%),
    linear-gradient(145deg, rgba(7, 25, 33, .96), rgba(3, 11, 17, .97));
}
.blocknet-trader-basic--xlite { border-color: rgba(85, 245, 172, .32); }
.blocknet-trader-basic--xlite .blocknet-info-card__index,
.blocknet-trader-basic--xlite h3 { color: var(--block-green); }
.blocknet-trader-basic--safety { border-color: rgba(75, 220, 255, .32); }
.blocknet-trader-basic--fee {
  border-color: rgba(255, 200, 87, .42);
  background:
    radial-gradient(circle at 100% 0, rgba(255, 200, 87, .15), transparent 42%),
    linear-gradient(145deg, rgba(28, 23, 10, .93), rgba(3, 11, 17, .97));
  box-shadow: inset 3px 0 var(--block-gold);
}
.blocknet-trader-basic--fee .blocknet-info-card__index,
.blocknet-trader-basic--fee h3,
.blocknet-trader-basic--fee a { color: var(--block-gold); }
.blocknet-trader-basic h3 { margin-top: 16px; font-size: clamp(1.45rem, 2.2vw, 1.85rem); }
.blocknet-trader-basic p { color: #b6c8d0; font-size: .9rem; line-height: 1.62; }
.blocknet-trader-basic > small { display: block; margin-top: 13px; color: #e7d9a7; font-size: .72rem; line-height: 1.45; }
.blocknet-trader-basic > a { display: inline-flex; margin-top: 15px; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; }

.blocknet-hoster-hero {
  grid-template-areas:
    "copy mark"
    "metrics metrics";
  grid-template-columns: minmax(0, 1fr) 112px;
  min-height: 0;
  align-items: center;
  gap: 24px 30px;
  padding: 29px 30px 25px;
  background:
    radial-gradient(circle at 88% 10%, rgba(85, 245, 172, .13), transparent 32%),
    linear-gradient(125deg, rgba(6, 28, 38, .94), rgba(3, 9, 15, .5));
}
.blocknet-hoster-hero .blocknet-page-hero__copy { grid-area: copy; max-width: none; text-align: left; }
.blocknet-hoster-hero .blocknet-page-hero__copy h1 { margin: 0; font-size: clamp(2.95rem, 4.8vw, 4.45rem); line-height: .92; text-align: left; white-space: nowrap; }
.blocknet-hoster-hero .blocknet-page-hero__copy p { max-width: 870px; margin-top: 16px; color: #d1e0e6; font-size: 1.03rem; line-height: 1.58; }
.blocknet-hoster-hero > .blocknet-page-hero__mark { grid-area: mark; width: 104px; height: 104px; border-radius: 30px; }
.blocknet-hoster-hero > .blocknet-page-hero__mark img { width: 61px; }
.blocknet-hoster-hero__metrics { display: grid; grid-area: metrics; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.blocknet-hoster-hero__metrics article {
  display: flex;
  min-height: 94px;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 13px 10px;
  overflow: hidden;
  border: 1px solid rgba(75, 220, 255, .2);
  border-radius: 13px;
  background: rgba(3, 13, 19, .84);
  text-align: center;
}
.blocknet-hoster-hero__metrics article:nth-child(2),
.blocknet-hoster-hero__metrics article:nth-child(5) { border-color: rgba(85, 245, 172, .25); }
.blocknet-hoster-hero__metrics article:nth-child(3) { border-color: rgba(104, 146, 255, .26); }
.blocknet-hoster-hero__metrics article:nth-child(4) { border-color: rgba(255, 200, 87, .25); }
.blocknet-hoster-hero__metrics small { color: #adc1ca; font-size: .58rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.blocknet-hoster-hero__metrics strong { max-width: 100%; margin-top: 6px; color: var(--block-green); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.12rem, 1.65vw, 1.48rem); line-height: 1.03; overflow-wrap: anywhere; }
.blocknet-hoster-hero__metrics span { margin-top: 6px; color: #b7c9d1; font-size: .68rem; line-height: 1.28; }
.blocknet-hoster-page .blocknet-hoster-status > span:nth-child(2) { display: block; justify-self: center; color: var(--block-cyan); }

.blocknet-hoster-page .blocknet-hoster-redundancy-section { padding-top: 20px; }
.blocknet-hoster-page .blocknet-hoster-redundancy-heading {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 8px;
  margin-bottom: 15px;
}
.blocknet-hoster-page .blocknet-hoster-redundancy-heading h2 {
  font-size: clamp(1.82rem, 2.55vw, 2.3rem);
  letter-spacing: -.025em;
  white-space: nowrap;
}
.blocknet-hoster-page .blocknet-hoster-redundancy-heading p { max-width: 780px; color: #a7bac3; font-size: .82rem; text-align: left; }

.blocknet-hoster-page .blocknet-hoster-deployment { padding-top: 25px; }
.blocknet-hoster-page .blocknet-hoster-deployment__heading { align-items: end; margin-bottom: 17px; }
.blocknet-hoster-page .blocknet-hoster-deployment__heading h2 { font-size: clamp(2.15rem, 3.55vw, 3rem); white-space: nowrap; }
.blocknet-hoster-page .blocknet-hoster-deployment__heading p { color: #a5b8c1; font-size: .82rem; }
.blocknet-hoster-page .blocknet-hoster-deployment__steps {
  position: relative;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 9px;
  padding: 10px;
  overflow: hidden;
  border: 1px solid rgba(75, 220, 255, .2);
  border-radius: 18px;
  background:
    linear-gradient(90deg, rgba(75, 220, 255, .07), rgba(85, 245, 172, .04)),
    rgba(2, 10, 15, .92);
}
.blocknet-hoster-page .blocknet-hoster-deployment__steps::before {
  position: absolute;
  top: 42px;
  right: 8%;
  left: 8%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, rgba(75,220,255,.25), rgba(85,245,172,.6), rgba(75,220,255,.25));
}
.blocknet-hoster-page .blocknet-hoster-deployment__steps article {
  position: relative;
  z-index: 1;
  display: block;
  min-height: 214px;
  padding: 15px 16px 17px;
  border-color: rgba(75, 220, 255, .16);
  border-radius: 13px;
  background: linear-gradient(155deg, rgba(7, 29, 37, .96), rgba(3, 12, 18, .97));
}
.blocknet-hoster-page .blocknet-hoster-deployment__steps article::after {
  position: absolute;
  top: 27px;
  right: -10px;
  z-index: 4;
  content: "→";
  color: var(--block-green);
  font-size: 1.05rem;
  font-weight: 900;
  text-shadow: 0 0 12px rgba(85, 245, 172, .55);
}
.blocknet-hoster-page .blocknet-hoster-deployment__steps article:last-child::after { display: none; }
.blocknet-hoster-page .blocknet-hoster-deployment__steps article > b {
  position: relative;
  width: 48px;
  height: 48px;
  color: #032016;
  font-size: .84rem;
  box-shadow: 0 0 0 7px rgba(2, 10, 15, .92), 0 0 25px rgba(85, 245, 172, .18);
}
.blocknet-hoster-page .blocknet-hoster-deployment__steps h3 { margin: 23px 0 9px; font-size: 1.02rem; line-height: 1.18; }
.blocknet-hoster-page .blocknet-hoster-deployment__steps p { color: #adc0c9; font-size: .76rem; line-height: 1.58; }

.blocknet-hoster-toolkit { padding-top: 25px; }
.blocknet-hoster-page .blocknet-hoster-toolkit__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.blocknet-hoster-toolkit__grid a {
  --tool-rgb: 75, 220, 255;
  position: relative;
  min-height: 168px;
  padding: 24px 25px;
  overflow: hidden;
  border-color: rgba(var(--tool-rgb), .26);
  background:
    radial-gradient(circle at 100% 0, rgba(var(--tool-rgb), .12), transparent 42%),
    linear-gradient(145deg, rgba(7, 25, 33, .96), rgba(3, 11, 17, .96));
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}
.blocknet-hoster-toolkit__grid a:nth-child(3n + 2) { --tool-rgb: 85, 245, 172; }
.blocknet-hoster-toolkit__grid a:nth-child(3n) { --tool-rgb: 167, 123, 255; }
.blocknet-hoster-toolkit__grid a::after {
  position: absolute;
  right: 22px;
  bottom: 18px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  content: "↗";
  color: rgb(var(--tool-rgb));
  font-size: 1rem;
  border: 1px solid rgba(var(--tool-rgb), .32);
  border-radius: 50%;
  background: rgba(var(--tool-rgb), .08);
  transition: color 180ms ease, border-color 180ms ease, background 180ms ease;
}
.blocknet-hoster-toolkit__grid a:hover { border-color: rgba(var(--tool-rgb), .62); box-shadow: 0 16px 34px rgba(0,0,0,.25), 0 0 26px rgba(var(--tool-rgb), .08); }
.blocknet-hoster-toolkit__grid a:hover::after { color: #03140e; border-color: rgb(var(--tool-rgb)); background: rgb(var(--tool-rgb)); }
.blocknet-hoster-toolkit__grid small { color: rgb(var(--tool-rgb)); font-size: .64rem; }
.blocknet-hoster-toolkit__grid strong { max-width: 82%; margin: 16px 0; font-size: clamp(1.25rem, 1.9vw, 1.55rem); line-height: 1.08; }
.blocknet-hoster-toolkit__grid span { padding-right: 42px; color: #afc2ca; font-size: .78rem; line-height: 1.4; }
.blocknet-hoster-support { padding-top: 25px; }

.blocknet-hero-actions,
.blocknet-footer-actions,
.blocknet-split-callout__actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 20px; }
.blocknet-action {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  padding: 11px 16px;
  color: #02120d;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
  border: 1px solid var(--block-green);
  border-radius: 10px;
  background: var(--block-green);
  box-shadow: 0 0 24px rgba(85, 245, 172, 0.12);
  transition: transform 180ms ease, box-shadow 180ms ease;
}
.blocknet-action:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(85, 245, 172, 0.18); }
.blocknet-action--ghost { color: #c8f7ff; border-color: rgba(75, 220, 255, 0.34); background: rgba(75, 220, 255, 0.055); box-shadow: none; }

.blocknet-metrics--live,
.blocknet-metrics--host { padding-top: 12px; }
.blocknet-metrics--host .blocknet-metric:nth-child(2) { border-color: rgba(255, 200, 87, 0.35); background: linear-gradient(145deg, rgba(255, 200, 87, 0.1), rgba(5, 14, 21, 0.88)); }
.blocknet-metrics--host .blocknet-metric:nth-child(2) strong { color: var(--block-gold); }

.blocknet-product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.blocknet-product {
  position: relative;
  display: flex;
  min-height: 286px;
  flex-direction: column;
  padding: 22px;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  border: 1px solid rgba(75, 220, 255, 0.2);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(75, 220, 255, 0.07), rgba(3, 10, 16, 0.95) 58%);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.blocknet-product::after { position: absolute; right: -35px; bottom: -58px; width: 130px; height: 130px; content: ""; border: 1px solid currentColor; border-radius: 50%; opacity: 0.09; }
.blocknet-product:hover { transform: translateY(-4px); border-color: rgba(75, 220, 255, 0.55); box-shadow: 0 20px 35px rgba(0, 0, 0, 0.25); }
.blocknet-product small { color: var(--block-cyan); font-size: 0.61rem; font-weight: 900; letter-spacing: 0.14em; }
.blocknet-product__logo { display: flex; height: 54px; align-items: center; margin-top: 16px; }
.blocknet-product__logo img { width: auto; max-width: 170px; max-height: 48px; object-fit: contain; object-position: left center; }
.blocknet-product--core .blocknet-product__logo img { max-width: 155px; }
.blocknet-product--dx .blocknet-product__logo img { max-width: 170px; filter: brightness(0) invert(1) drop-shadow(0 0 9px rgba(75,220,255,.18)); }
.blocknet-product__stack { display: grid; height: 54px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 16px; }
.blocknet-product__stack > span { display: grid; min-width: 0; place-items: center; padding: 7px; border: 1px solid rgba(75,220,255,.16); border-radius: 9px; background: rgba(75,220,255,.045); }
.blocknet-product__stack img { width: 100%; max-width: 66px; max-height: 34px; object-fit: contain; }
.blocknet-product__stack span:first-child img { width: 31px; }
.blocknet-product__stack span:last-child img { filter: brightness(0) invert(1); }
.blocknet-product strong { margin-top: 14px; color: #f2f8fa; font-family: Georgia, "Times New Roman", serif; font-size: 1.75rem; line-height: 1; }
.blocknet-product p { margin: 11px 0 20px; color: #b8c9d2; font-size: 0.86rem; line-height: 1.58; }
.blocknet-product > span { margin-top: auto; color: var(--block-green); font-size: 0.65rem; font-weight: 900; letter-spacing: 0.1em; }
.blocknet-product--xlite { border-color: rgba(85, 245, 172, 0.25); }
.blocknet-product--dx { border-color: rgba(255, 200, 87, 0.28); }
.blocknet-product--dx small, .blocknet-product--dx > span { color: var(--block-gold); }
.blocknet-product--setup { border-color: rgba(167, 123, 255, 0.28); }

.blocknet-trader-page .blocknet-trader-install { padding-top: 22px; }
.blocknet-trader-install__heading { align-items: end; margin-bottom: 16px; }
.blocknet-trader-install__heading h2 { font-size: clamp(2.25rem, 3.7vw, 3.2rem); white-space: nowrap; }
.blocknet-trader-install__heading p { color: #a9bbc4; font-size: .82rem; }
.blocknet-install-options { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.blocknet-install-option {
  position: relative;
  display: grid;
  min-height: 300px;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 18px;
  padding: 26px;
  overflow: hidden;
  border: 1px solid rgba(75, 220, 255, .24);
  border-radius: 18px;
  background:
    radial-gradient(circle at 100% 0, rgba(75, 220, 255, .11), transparent 40%),
    linear-gradient(145deg, rgba(7, 27, 36, .96), rgba(3, 11, 17, .97));
}
.blocknet-install-option--guided {
  border-color: rgba(85, 245, 172, .34);
  background:
    radial-gradient(circle at 100% 0, rgba(85, 245, 172, .14), transparent 42%),
    linear-gradient(145deg, rgba(6, 28, 31, .96), rgba(3, 11, 17, .97));
}
.blocknet-install-option--recommended {
  min-height: 0;
  grid-template-columns: minmax(0, 1fr);
  padding: 28px 30px;
  border-color: rgba(85, 245, 172, .48);
  background:
    radial-gradient(circle at 94% 10%, rgba(85, 245, 172, .2), transparent 35%),
    linear-gradient(145deg, rgba(7, 34, 34, .98), rgba(3, 11, 17, .98));
  box-shadow: inset 4px 0 var(--block-green), 0 18px 45px rgba(0, 0, 0, .2);
}
.blocknet-install-option__badge {
  position: absolute;
  top: 22px;
  right: 24px;
  padding: 8px 12px;
  color: #03140e;
  font-size: .62rem;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-radius: 999px;
  background: var(--block-green);
  box-shadow: 0 0 24px rgba(85, 245, 172, .24);
}
.blocknet-install-option--recommended .blocknet-install-option__copy { padding-right: 145px; }
.blocknet-install-option--recommended h3 { max-width: 720px; font-size: clamp(2rem, 3.5vw, 2.85rem); }
.blocknet-install-option--recommended .blocknet-install-option__copy > small { font-size: clamp(1.2rem, 2.1vw, 1.7rem); line-height: 1.1; }
.blocknet-install-option--recommended p { max-width: 940px; color: #c7d5da; font-size: clamp(1.05rem, 1.45vw, 1.2rem); line-height: 1.62; }
.blocknet-install-option--recommended .blocknet-install-option__chips span { color: #bfffe3; border-color: rgba(85, 245, 172, .28); background: rgba(85, 245, 172, .07); }
.blocknet-install-option--recommended .blocknet-release { max-width: 480px; }
.blocknet-install-option__number { display: grid; width: 54px; height: 54px; place-items: center; color: #03140e; font-size: .78rem; font-weight: 900; border-radius: 50%; background: var(--block-cyan); box-shadow: 0 0 24px rgba(75, 220, 255, .22); }
.blocknet-install-option--guided .blocknet-install-option__number { background: var(--block-green); box-shadow: 0 0 24px rgba(85, 245, 172, .22); }
.blocknet-install-option__copy { min-width: 0; }
.blocknet-install-option__copy > small { color: var(--block-cyan); font-size: .62rem; font-weight: 900; letter-spacing: .14em; }
.blocknet-install-option--guided .blocknet-install-option__copy > small { color: var(--block-green); }
.blocknet-install-option h3 { margin: 8px 0 10px; color: #f3f8fa; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.65rem, 2.6vw, 2.15rem); line-height: 1.02; }
.blocknet-install-option p { margin: 0; color: #b4c5cd; font-size: .86rem; line-height: 1.58; }
.blocknet-install-option__includes { margin-top: 24px; color: #effff7; font-size: .78rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.blocknet-install-option__chips { display: flex; flex-wrap: wrap; gap: 7px; margin: 10px 0 17px; }
.blocknet-install-option__chips span { padding: 7px 10px; color: #bceefa; font-size: .6rem; font-weight: 900; letter-spacing: .07em; border: 1px solid rgba(75, 220, 255, .24); border-radius: 999px; background: rgba(75, 220, 255, .06); }
.blocknet-install-option__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.blocknet-install-option .blocknet-action { min-height: 38px; padding: 9px 12px; font-size: .62rem; }
.blocknet-install-option .blocknet-action--download { width: min(100%, 480px); min-height: 58px; padding: 16px 24px; font-size: .82rem; letter-spacing: .1em; }
.blocknet-release { display: flex; align-items: center; gap: 9px; min-height: 42px; margin-top: 16px; padding: 8px 10px; border: 1px solid rgba(85, 245, 172, .2); border-radius: 10px; background: rgba(85, 245, 172, .045); }
.blocknet-release > i { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--block-green); box-shadow: 0 0 12px rgba(85, 245, 172, .75); }
.blocknet-release > span { display: block; min-width: 0; }
.blocknet-release b { display: block; overflow: hidden; color: #e7fff4; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.blocknet-release small,
.blocknet-trader-page .blocknet-product .blocknet-release small { display: block; margin-top: 2px; color: #91a8b2; font-size: .58rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
.blocknet-release.is-error { border-color: rgba(255, 200, 87, .22); background: rgba(255, 200, 87, .045); }
.blocknet-release.is-error > i { background: var(--block-gold); box-shadow: 0 0 12px rgba(255, 200, 87, .6); }
.blocknet-component-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin: 25px 0 13px; scroll-margin-top: 20px; }
.blocknet-component-heading > div > span { color: var(--block-cyan); font-size: .62rem; font-weight: 900; letter-spacing: .15em; }
.blocknet-component-heading h3 { margin: 6px 0 0; color: #f2f8fa; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.8rem, 3vw, 2.55rem); line-height: 1; }
.blocknet-component-heading p { max-width: 390px; margin: 0; color: #9eb2bc; font-size: .78rem; line-height: 1.48; text-align: right; }
.blocknet-trader-page .blocknet-product-grid--manual { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.blocknet-trader-page .blocknet-product-grid--manual .blocknet-product { min-height: 420px; }
.blocknet-trader-page .blocknet-product-grid--manual .blocknet-release { margin-top: auto; }
.blocknet-product__actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.blocknet-product__actions a { display: inline-flex; min-height: 34px; align-items: center; justify-content: center; padding: 8px 10px; color: #06140f; font-size: .58rem; font-weight: 900; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; border: 1px solid var(--block-green); border-radius: 8px; background: var(--block-green); transition: transform 180ms ease, box-shadow 180ms ease; }
.blocknet-product__actions a + a { color: #c5f4ff; border-color: rgba(75, 220, 255, .3); background: rgba(75, 220, 255, .055); }
.blocknet-product__actions a:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(85, 245, 172, .14); }
.blocknet-trader-page .blocknet-product--dx .blocknet-product__actions a:first-child { color: #261a00; border-color: var(--block-gold); background: var(--block-gold); }
.blocknet-trader-safety { font-size: .82rem; }

.blocknet-live-board {
  overflow: hidden;
  border: 1px solid rgba(75, 220, 255, 0.21);
  border-radius: 17px;
  background:
    linear-gradient(rgba(255,255,255,0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.018) 1px, transparent 1px),
    rgba(3, 12, 18, 0.92);
  background-size: 34px 34px;
}
.blocknet-live-board__head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 19px; border-bottom: 1px solid rgba(75, 220, 255, 0.14); background: rgba(75, 220, 255, 0.035); }
.blocknet-live-board__head small { display: block; color: var(--block-cyan); font-size: 0.56rem; font-weight: 900; letter-spacing: 0.15em; }
.blocknet-live-board__head strong { display: block; margin-top: 3px; color: #eaf5f8; font-size: 0.88rem; }
.blocknet-live-board__head > span { display: flex; align-items: center; gap: 8px; color: #8aa0ac; font-size: 0.64rem; text-align: right; }
.blocknet-live-board__head i { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: var(--block-green); box-shadow: 0 0 12px rgba(85,245,172,.7); }
.blocknet-token-list { display: flex; flex-wrap: wrap; gap: 8px; padding: 17px 19px; }
.blocknet-token { display: inline-flex; align-items: center; gap: 8px; padding: 6px 11px 6px 7px; color: #d8f8ff; font-size: 0.68rem; font-weight: 900; letter-spacing: 0.08em; border: 1px solid rgba(75, 220, 255, 0.23); border-radius: 999px; background: rgba(75, 220, 255, 0.06); }
.blocknet-token.is-muted { color: #718895; border-color: rgba(130, 155, 168, 0.18); background: rgba(130, 155, 168, 0.04); }
.blocknet-coin-icon { display: grid; width: 25px; height: 25px; flex: 0 0 25px; place-items: center; overflow: hidden; color: #d9faff; font-size: .52rem; font-weight: 900; letter-spacing: 0; border: 1px solid rgba(75,220,255,.2); border-radius: 50%; background: #071821; }
.blocknet-coin-icon img { width: 100%; height: 100%; object-fit: contain; }
.blocknet-coin-icon.is-fallback { background: linear-gradient(145deg, rgba(75,220,255,.18), rgba(85,245,172,.08)); }
.blocknet-market-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding: 15px 19px; border-top: 1px solid rgba(75,220,255,.12); border-bottom: 1px solid rgba(75,220,255,.12); background: rgba(2,10,15,.66); }
.blocknet-market-toolbar small { display: block; color: var(--block-green); font-size: .56rem; font-weight: 900; letter-spacing: .15em; }
.blocknet-market-toolbar strong { display: block; margin-top: 4px; color: #eaf7f9; font-size: .84rem; }
.blocknet-market-toolbar label { display: grid; min-width: min(100%, 300px); gap: 5px; }
.blocknet-market-toolbar label span { color: #718b98; font-size: .52rem; font-weight: 900; letter-spacing: .12em; }
.blocknet-market-toolbar input { width: 100%; height: 38px; padding: 0 12px; color: #e8f9fc; font: 700 .73rem/1 "Trebuchet MS", sans-serif; border: 1px solid rgba(75,220,255,.25); border-radius: 9px; outline: none; background: rgba(75,220,255,.045); }
.blocknet-market-toolbar input:focus { border-color: var(--block-green); box-shadow: 0 0 0 3px rgba(85,245,172,.07); }
.blocknet-market-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 15px 19px 19px; }
.blocknet-market-row { display: flex; width: 100%; min-width: 0; align-items: center; justify-content: space-between; gap: 15px; padding: 13px 14px; color: inherit; font: inherit; text-align: left; cursor: pointer; border: 1px solid rgba(85, 245, 172, 0.14); border-radius: 12px; background: rgba(85, 245, 172, 0.035); transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease; }
.blocknet-market-row:hover,
.blocknet-market-row:focus-visible,
.blocknet-market-row[aria-expanded="true"] { transform: translateY(-2px); border-color: rgba(85,245,172,.5); outline: none; background: rgba(85,245,172,.085); box-shadow: 0 13px 24px rgba(0,0,0,.2); }
.blocknet-market-row__pair { display: flex; min-width: 0; align-items: center; gap: 10px; }
.blocknet-market-row__logos { display: flex; min-width: 43px; align-items: center; }
.blocknet-market-row__logos .blocknet-coin-icon { width: 27px; height: 27px; flex-basis: 27px; }
.blocknet-market-row__logos .blocknet-coin-icon + .blocknet-coin-icon { margin-left: -10px; box-shadow: 0 0 0 3px #071117; }
.blocknet-market-row__pair > span:last-child { min-width: 0; }
.blocknet-market-row__pair strong { display: block; color: #edf9fb; font-size: .84rem; white-space: nowrap; }
.blocknet-market-row__pair small { display: block; margin-top: 4px; color: #9bb2bd; font-size: .55rem; font-weight: 900; letter-spacing: .08em; }
.blocknet-market-row__stats { display: grid; grid-template-columns: repeat(2, auto) 13px; gap: 11px; align-items: center; text-align: right; }
.blocknet-market-row__stats span { min-width: 54px; }
.blocknet-market-row__stats small { display: block; color: #96adb8; font-size: .52rem; font-weight: 900; letter-spacing: .07em; }
.blocknet-market-row__stats strong { display: block; margin-top: 3px; color: var(--block-green); font-family: Georgia, "Times New Roman", serif; font-size: 1rem; }
.blocknet-market-row__chevron { width: 9px; height: 9px; border-right: 2px solid var(--block-green); border-bottom: 2px solid var(--block-green); transform: rotate(45deg); transition: transform 180ms ease; }
.blocknet-market-row[aria-expanded="true"] .blocknet-market-row__chevron { transform: rotate(225deg); }
.blocknet-market-list > .blocknet-live-empty { grid-column: 1 / -1; }
.blocknet-live-empty { margin: 0; padding: 12px 0; color: #7f95a2; font-size: 0.78rem; line-height: 1.5; }

.blocknet-order-panel { grid-column: 1 / -1; margin-top: 3px; overflow: hidden; border: 1px solid rgba(75,220,255,.3); border-radius: 14px; background: rgba(2, 10, 15, .96); box-shadow: 0 18px 36px rgba(0,0,0,.25); }
.blocknet-order-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; border-bottom: 1px solid rgba(75,220,255,.14); background: linear-gradient(90deg, rgba(75,220,255,.09), rgba(85,245,172,.035)); }
.blocknet-order-panel > header small { display: block; color: var(--block-cyan); font-size: .51rem; font-weight: 900; letter-spacing: .14em; }
.blocknet-order-panel > header strong { display: block; margin-top: 3px; color: #eefbff; font-size: 1rem; }
.blocknet-order-panel__close { min-height: 32px; padding: 6px 11px; color: var(--block-cyan); font: 900 .58rem/1 "Trebuchet MS", sans-serif; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; border: 1px solid rgba(75,220,255,.28); border-radius: 8px; background: rgba(75,220,255,.055); }
.blocknet-order-panel__close:hover,
.blocknet-order-panel__close:focus-visible { color: #031116; outline: none; background: var(--block-cyan); }
.blocknet-order-list { padding: 6px 12px 12px; }
.blocknet-order-list__labels,
.blocknet-order-list__row { display: grid; grid-template-columns: 62px minmax(90px, 1fr) minmax(90px, 1fr) minmax(90px, 1fr) 156px 82px; gap: 12px; align-items: center; }
.blocknet-order-list__labels { padding: 9px 10px 7px; color: #839ca8; font-size: .52rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.blocknet-order-list__row { min-height: 42px; padding: 8px 10px; color: #c5d4da; font: 700 .7rem/1.25 "Trebuchet MS", sans-serif; border-top: 1px solid rgba(75,220,255,.08); }
.blocknet-order-list__row.is-sell { background: linear-gradient(90deg, rgba(255, 92, 112, .065), transparent 52%); }
.blocknet-order-list__row.is-buy { background: linear-gradient(90deg, rgba(85, 245, 172, .06), transparent 52%); }
.blocknet-order-list__row.is-sell:hover { background: rgba(255, 92, 112, .105); }
.blocknet-order-list__row.is-buy:hover { background: rgba(85, 245, 172, .1); }
.blocknet-order-list__row .is-side { justify-self: start; padding: 5px 8px; font-size: .55rem; font-weight: 900; letter-spacing: .08em; border-radius: 999px; }
.blocknet-order-list__row .is-side.is-sell { color: #ff7182; border: 1px solid rgba(255, 92, 112, .38); background: rgba(255, 92, 112, .09); }
.blocknet-order-list__row .is-side.is-buy { color: var(--block-green); border: 1px solid rgba(85,245,172,.32); background: rgba(85,245,172,.08); }
.blocknet-order-list__row.is-sell .is-price { color: #ff7182; }
.blocknet-order-list__row.is-buy .is-price { color: var(--block-green); }
.blocknet-order-list__row .is-time { color: #8299a5; font-size: .61rem; }
.blocknet-order-list__row .is-id { color: var(--block-cyan); font-family: Consolas, monospace; font-size: .61rem; }
.blocknet-order-book__section { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px; font-size: .58rem; font-weight: 900; letter-spacing: .11em; border-top: 1px solid rgba(75,220,255,.11); }
.blocknet-order-book__section.is-sell { color: #ff7182; }
.blocknet-order-book__section.is-buy { color: var(--block-green); }
.blocknet-order-book__section span { color: #829aa6; letter-spacing: .04em; }
.blocknet-order-book__spread { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 14px; margin: 5px 0; padding: 11px 10px; color: #eaf8fb; border-top: 1px solid rgba(75,220,255,.22); border-bottom: 1px solid rgba(75,220,255,.22); background: linear-gradient(90deg, rgba(75,220,255,.1), rgba(3,13,19,.82), rgba(85,245,172,.06)); }
.blocknet-order-book__spread strong { color: var(--block-cyan); font-size: .58rem; letter-spacing: .12em; }
.blocknet-order-book__spread span { font-family: Georgia, "Times New Roman", serif; font-size: .95rem; font-weight: 900; }
.blocknet-order-book__spread small { color: #9eb1bb; font-size: .62rem; }

.blocknet-split-callout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(250px, 0.55fr); gap: 30px; align-items: center; padding: 25px 28px; border: 1px solid rgba(85, 245, 172, 0.3); border-radius: 18px; background: radial-gradient(circle at 80% 0, rgba(85,245,172,.13), transparent 35%), rgba(4, 15, 20, 0.94); }
.blocknet-split-callout h2 { margin: 7px 0 9px; color: #f2f8fa; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4vw, 3.15rem); line-height: 1; }
.blocknet-split-callout p { margin: 0; color: #9aafb9; font-size: 0.86rem; line-height: 1.58; }
.blocknet-split-callout__actions { justify-content: flex-end; margin: 0; }

.blocknet-step-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; counter-reset: steps; }
.blocknet-step-list article { display: grid; min-height: 150px; grid-template-columns: 42px 1fr; gap: 15px; align-content: start; padding: 20px; border: 1px solid rgba(75, 220, 255, 0.18); border-radius: 15px; background: rgba(4, 13, 19, 0.9); }
.blocknet-step-list article > b { display: grid; width: 38px; height: 38px; place-items: center; color: #051711; font-size: 0.68rem; border-radius: 50%; background: var(--block-green); }
.blocknet-step-list h3 { margin: 5px 0 7px; color: #eff7fa; font-size: 1.02rem; }
.blocknet-step-list p { margin: 0; color: #8fa4af; font-size: 0.78rem; line-height: 1.55; }
.blocknet-step-list--compact article { min-height: 132px; }

.blocknet-fee-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; padding: 14px 22px 0; }
.blocknet-fee-strip article { padding: 17px 19px; border: 1px solid rgba(255, 200, 87, 0.25); border-radius: 14px; background: linear-gradient(145deg, rgba(255, 200, 87, 0.09), rgba(4, 13, 19, 0.9)); }
.blocknet-fee-strip small { display: block; color: var(--block-gold); font-size: 0.58rem; font-weight: 900; letter-spacing: 0.13em; }
.blocknet-fee-strip strong { display: block; margin-top: 7px; color: #fff2ca; font-family: Georgia, "Times New Roman", serif; font-size: 1.55rem; }
.blocknet-fee-strip span { display: block; margin-top: 5px; color: #8096a2; font-size: 0.67rem; }
.blocknet-callout--gold { border-color: rgba(255, 200, 87, 0.32); background: linear-gradient(90deg, rgba(255,200,87,.09), rgba(5,13,19,.9)); }
.blocknet-callout--gold strong { color: var(--block-gold); }
.blocknet-footer-actions { justify-content: flex-end; }

.blocknet-setup-track { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.blocknet-setup-track article { position: relative; min-height: 160px; padding: 21px; border: 1px solid rgba(75, 220, 255, 0.19); border-radius: 15px; background: rgba(4, 13, 19, 0.9); }
.blocknet-setup-track article:not(:last-child)::after { position: absolute; z-index: 2; top: 50%; right: -13px; content: "→"; color: var(--block-green); font-size: 1.2rem; }
.blocknet-setup-track small { color: var(--block-cyan); font-size: 0.58rem; font-weight: 900; letter-spacing: 0.14em; }
.blocknet-setup-track h3 { margin: 17px 0 8px; color: #eef8fa; font-size: 1.02rem; }
.blocknet-setup-track p { margin: 0; color: #8ea3ae; font-size: 0.76rem; line-height: 1.5; }
.blocknet-video-card { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(250px, .55fr); gap: 16px; padding: 14px; border: 1px solid rgba(75, 220, 255, .2); border-radius: 17px; background: rgba(4, 13, 19, .9); }
.blocknet-video-card iframe { width: 100%; min-height: 360px; border: 0; border-radius: 12px; }
.blocknet-video-card > div { align-self: center; padding: 22px; }
.blocknet-video-card h3 { margin: 8px 0 10px; color: #f1f8fa; font-family: Georgia, "Times New Roman", serif; font-size: 1.8rem; }
.blocknet-video-card p { color: #8fa5b0; font-size: .8rem; line-height: 1.55; }

.blocknet-redundancy { display: grid; grid-template-columns: minmax(150px, 1fr) .55fr minmax(170px, 1fr) .55fr minmax(150px, 1fr); gap: 10px; align-items: center; padding: 25px; border: 1px solid rgba(75, 220, 255, .2); border-radius: 18px; background: radial-gradient(circle at 50% 50%, rgba(85,245,172,.1), transparent 34%), rgba(3, 12, 18, .92); }
.blocknet-redundancy__node,
.blocknet-redundancy__coin { padding: 20px; text-align: center; border: 1px solid rgba(75, 220, 255, .26); border-radius: 15px; background: rgba(75, 220, 255, .055); }
.blocknet-redundancy__coin { border-color: rgba(85, 245, 172, .36); background: rgba(85, 245, 172, .07); }
.blocknet-redundancy small { display: block; color: var(--block-cyan); font-size: .56rem; font-weight: 900; letter-spacing: .14em; }
.blocknet-redundancy strong { display: block; margin-top: 9px; color: #f0fafc; font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; }
.blocknet-redundancy span { display: block; margin-top: 7px; color: #8299a5; font-size: .66rem; line-height: 1.4; }
.blocknet-redundancy__link { display: grid; grid-template-columns: 1fr; gap: 5px; text-align: center; }
.blocknet-redundancy__link i { height: 1px; background: linear-gradient(90deg, transparent, var(--block-green), transparent); }
.blocknet-redundancy__link b { color: var(--block-green); font-size: .53rem; letter-spacing: .12em; }

.blocknet-resource-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.blocknet-resource-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.blocknet-resource-grid a { display: flex; min-height: 145px; flex-direction: column; justify-content: space-between; padding: 20px; color: inherit; text-decoration: none; border: 1px solid rgba(75, 220, 255, .19); border-radius: 15px; background: rgba(4, 13, 19, .9); transition: transform 180ms ease, border-color 180ms ease; }
.blocknet-resource-grid a:hover { transform: translateY(-3px); border-color: rgba(75,220,255,.55); }
.blocknet-resource-grid small { color: var(--block-cyan); font-size: .57rem; font-weight: 900; letter-spacing: .14em; }
.blocknet-resource-grid strong { margin: 13px 0; color: #eef7fa; font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; }
.blocknet-resource-grid span { color: #79919e; font-size: .69rem; }

.blocknet-coverage-list { display: grid; gap: 7px; padding: 17px 19px 19px; }
.blocknet-coverage-row { display: grid; grid-template-columns: 72px minmax(100px, 1fr) 72px; gap: 14px; align-items: center; padding: 9px 12px; border: 1px solid rgba(75,220,255,.12); border-radius: 10px; background: rgba(75,220,255,.025); }
.blocknet-coverage-row strong { color: #e9f7fa; font-size: .75rem; }
.blocknet-coverage-row i { position: relative; height: 5px; overflow: hidden; border-radius: 999px; background: rgba(123, 151, 164, .16); }
.blocknet-coverage-row i::after { position: absolute; inset: 0 auto 0 0; width: var(--coverage); content: ""; border-radius: inherit; background: var(--block-green); }
.blocknet-coverage-row span { color: #8ca2ad; font-size: .67rem; text-align: right; }
.blocknet-coverage-row.is-critical i::after { background: #ff6576; }
.blocknet-coverage-row.is-thin i::after { background: var(--block-gold); }

.blocknet-commercial-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.blocknet-commercial { min-height: 300px; padding: 26px; border: 1px solid rgba(85, 245, 172, .26); border-radius: 18px; background: radial-gradient(circle at 100% 0, rgba(85,245,172,.12), transparent 38%), rgba(4, 14, 19, .94); }
.blocknet-commercial--planned { border-style: dashed; border-color: rgba(255, 200, 87, .32); background: radial-gradient(circle at 100% 0, rgba(255,200,87,.1), transparent 38%), rgba(4, 14, 19, .94); }
.blocknet-commercial small { color: var(--block-green); font-size: .59rem; font-weight: 900; letter-spacing: .14em; }
.blocknet-commercial > strong { display: block; margin-top: 17px; color: #edfff6; font-family: Georgia, "Times New Roman", serif; font-size: 2.6rem; }
.blocknet-commercial h3 { margin: 7px 0 11px; color: #eef7fa; font-size: 1.12rem; }
.blocknet-commercial p { color: #90a6b0; font-size: .8rem; line-height: 1.6; }
.blocknet-commercial a { display: inline-block; margin-top: 10px; color: var(--block-cyan); font-size: .67rem; font-weight: 900; text-decoration: none; }

@media (max-width: 980px) {
  .blocknet-trader-hero { grid-template-columns: minmax(0, 1fr) 96px; min-height: 0; }
  .blocknet-trader-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-trader-basics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-trader-basic:last-child { grid-column: 1 / -1; min-height: 0; }
  .blocknet-install-options { grid-template-columns: 1fr; }
  .blocknet-trader-page .blocknet-product-grid--manual { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-hoster-hero__metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .blocknet-hoster-hero__metrics article { grid-column: span 2; }
  .blocknet-hoster-hero__metrics article:nth-last-child(-n + 2) { grid-column: span 3; }
  .blocknet-hoster-page .blocknet-hoster-redundancy-heading { grid-template-columns: 1fr; gap: 9px; }
  .blocknet-hoster-page .blocknet-hoster-redundancy-heading p { max-width: none; text-align: left; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps::before,
  .blocknet-hoster-page .blocknet-hoster-deployment__steps article::after { display: none; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps article { min-height: 195px; padding-inline: 16px; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps article:last-child { grid-column: 1 / -1; min-height: 0; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps h3 { font-size: .98rem; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps p { font-size: .76rem; }
  .blocknet-product-grid,
  .blocknet-setup-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-redundancy { grid-template-columns: 1fr; }
  .blocknet-redundancy__link { grid-template-columns: 1fr auto 1fr; align-items: center; }
  .blocknet-resource-grid--three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-hoster-page .blocknet-hoster-toolkit__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .blocknet-audience-hero,
  .blocknet-guide-hero { grid-template-columns: 1fr 96px; padding: 26px 22px; }
  .blocknet-audience-hero .blocknet-page-hero__copy h1,
  .blocknet-guide-hero .blocknet-page-hero__copy h1 { font-size: clamp(3.2rem, 12vw, 5rem); }
  .blocknet-product-grid,
  .blocknet-step-list,
  .blocknet-fee-strip,
  .blocknet-resource-grid,
  .blocknet-resource-grid--three,
  .blocknet-commercial-grid { grid-template-columns: 1fr; }
  .blocknet-hoster-page .blocknet-hoster-toolkit__grid { grid-template-columns: 1fr; }
  .blocknet-trader-page .blocknet-product-grid--manual { grid-template-columns: 1fr; }
  .blocknet-trader-basics { grid-template-columns: 1fr; }
  .blocknet-trader-basic:last-child { grid-column: auto; }
  .blocknet-trader-install__heading h2 { white-space: normal; }
  .blocknet-component-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  .blocknet-component-heading p { max-width: none; text-align: left; }
  .blocknet-hoster-page .blocknet-hoster-redundancy-heading h2 { white-space: normal; }
  .blocknet-hoster-page .blocknet-hoster-deployment__heading h2 { white-space: normal; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps { grid-template-columns: 1fr; gap: 10px; padding: 10px; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps::before { display: none; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps article { min-height: 0; padding: 17px 18px; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps article::after { top: auto; right: 50%; bottom: -15px; content: "↓"; transform: translateX(50%); }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps h3 { margin-top: 16px; font-size: 1.08rem; }
  .blocknet-hoster-page .blocknet-hoster-deployment__steps p { font-size: .82rem; }
  .blocknet-video-card,
  .blocknet-split-callout { grid-template-columns: 1fr; }
  .blocknet-split-callout__actions { justify-content: flex-start; }
  .blocknet-video-card iframe { min-height: 260px; }
  .blocknet-market-list { grid-template-columns: 1fr; }
  .blocknet-trader-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-order-list__labels { display: none; }
  .blocknet-order-list__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; padding: 13px 10px; }
  .blocknet-order-list__row > span { display: grid; gap: 3px; }
  .blocknet-order-list__row > span::before { content: attr(data-label); color: #688390; font-size: .45rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
  .blocknet-order-list__row .is-side { justify-self: stretch; border: 0; border-radius: 0; background: transparent; }
}

@media (max-width: 560px) {
  .blocknet-audience-hero,
  .blocknet-guide-hero { grid-template-columns: 1fr; text-align: left; }
  .blocknet-audience-hero .blocknet-page-hero__mark,
  .blocknet-guide-hero .blocknet-page-hero__mark { grid-row: 1; justify-self: start; }
  .blocknet-audience-hero .blocknet-page-hero__copy h1,
  .blocknet-guide-hero .blocknet-page-hero__copy h1 { font-size: clamp(3.1rem, 16vw, 4.5rem); }
  .blocknet-trader-status { grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
  .blocknet-trader-status > span:nth-child(2) { display: block; justify-self: end; font-size: .47rem; letter-spacing: .1em; text-align: right; line-height: 1.35; }
  .blocknet-trader-status > span:last-child { display: none; }
  .blocknet-trader-hero {
    grid-template-areas:
      "mark"
      "copy"
      "metrics";
    grid-template-columns: minmax(0, 1fr);
    gap: 19px;
    padding: 24px 18px 20px;
  }
  .blocknet-trader-hero > .blocknet-page-hero__mark { justify-self: start; width: 82px; height: 82px; border-radius: 24px; }
  .blocknet-trader-hero > .blocknet-page-hero__mark img { width: 49px; }
  .blocknet-trader-hero .blocknet-page-hero__copy h1 { font-size: clamp(2.4rem, 12vw, 3.15rem); white-space: nowrap; }
  .blocknet-trader-hero .blocknet-page-hero__copy p { font-size: .96rem; }
  .blocknet-trader-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .blocknet-trader-hero__metric { min-height: 105px; padding: 12px 8px; }
  .blocknet-trader-hero__metric strong { font-size: 1.35rem; }
  .blocknet-trader-hero__metric span { font-size: .67rem; }
  .blocknet-install-option { grid-template-columns: 1fr; padding: 21px; }
  .blocknet-install-option__number { width: 46px; height: 46px; }
  .blocknet-install-option--recommended { padding: 22px 19px; }
  .blocknet-install-option--recommended .blocknet-install-option__copy { padding-right: 0; }
  .blocknet-install-option__badge { position: static; width: max-content; margin-bottom: 15px; }
  .blocknet-install-option--recommended h3 { font-size: 1.85rem; }
	  .blocknet-install-option--recommended .blocknet-install-option__copy > small { font-size: 1.15rem; }
	  .blocknet-install-option--recommended p { font-size: 1rem; }
  .blocknet-install-option__actions { align-items: stretch; flex-direction: column; }
  .blocknet-install-option .blocknet-action { width: 100%; }
  .blocknet-hoster-page .blocknet-hoster-status { grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
  .blocknet-hoster-page .blocknet-hoster-status > span:nth-child(2) { justify-self: end; font-size: .47rem; letter-spacing: .1em; text-align: right; line-height: 1.35; }
  .blocknet-hoster-hero {
    grid-template-areas:
      "mark"
      "copy"
      "metrics";
    grid-template-columns: minmax(0, 1fr);
    gap: 19px;
    padding: 24px 18px 20px;
  }
  .blocknet-hoster-hero > .blocknet-page-hero__mark { justify-self: start; width: 82px; height: 82px; border-radius: 24px; }
  .blocknet-hoster-hero > .blocknet-page-hero__mark img { width: 49px; }
  .blocknet-hoster-hero .blocknet-page-hero__copy h1 { font-size: clamp(1.78rem, 8vw, 2.2rem); white-space: nowrap; }
  .blocknet-hoster-hero .blocknet-page-hero__copy p { font-size: .96rem; }
  .blocknet-hoster-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-hoster-hero__metrics article,
  .blocknet-hoster-hero__metrics article:nth-last-child(-n + 2) { min-height: 108px; grid-column: auto; padding: 12px 8px; }
  .blocknet-hoster-hero__metrics article:last-child { grid-column: 1 / -1; }
  .blocknet-hoster-hero__metrics strong { font-size: 1.08rem; overflow-wrap: normal; }
  .blocknet-hoster-hero__metrics span { font-size: .65rem; }
  .blocknet-hoster-page .blocknet-hoster-deployment__heading h2 { font-size: clamp(1.5rem, 7vw, 1.85rem); white-space: nowrap; }
  .blocknet-hero-actions .blocknet-action,
  .blocknet-footer-actions .blocknet-action { width: 100%; }
  .blocknet-product-grid,
  .blocknet-setup-track { grid-template-columns: 1fr; }
  .blocknet-product { min-height: 205px; }
  .blocknet-live-board__head { align-items: flex-start; flex-direction: column; }
  .blocknet-live-board__head > span { text-align: left; }
  .blocknet-market-toolbar { align-items: stretch; flex-direction: column; }
  .blocknet-market-toolbar label { min-width: 0; }
  .blocknet-market-row { align-items: center; }
  .blocknet-market-row__stats { gap: 7px; }
  .blocknet-market-row__stats span { min-width: 44px; }
  .blocknet-order-panel > header { align-items: flex-start; }
  .blocknet-coverage-row { grid-template-columns: 58px minmax(80px, 1fr) 62px; gap: 8px; }
  .blocknet-video-card iframe { min-height: 205px; }
}

/* Shared overview hero for the integrated overview and Get Started */
.blocknet-home-general {
  margin-top: 28px;
  scroll-margin-top: 18px;
}

.blocknet-home-general .blocknet-content { padding-bottom: 24px; }

.blocknet-home-general .blocknet-status,
.blocknet-general-page .blocknet-status,
.blocknet-get-started-page .blocknet-status {
  grid-template-columns: 1fr auto 1fr;
}

.blocknet-home-general .blocknet-status > span:nth-child(2),
.blocknet-general-page .blocknet-status > span:nth-child(2),
.blocknet-get-started-page .blocknet-status > span:nth-child(2) {
  color: var(--block-cyan);
  font-size: 0.68rem;
  letter-spacing: 0.17em;
}

.blocknet-home-general .blocknet-overview-hero,
.blocknet-general-page .blocknet-overview-hero,
.blocknet-get-started-page .blocknet-overview-hero {
  grid-template-areas:
    "copy mark"
    "metrics metrics";
  grid-template-columns: minmax(0, 1fr) 112px;
  min-height: 0;
  gap: 15px 24px;
  align-items: center;
  padding: 23px 30px 19px;
}

.blocknet-overview-hero .blocknet-page-hero__copy {
  grid-area: copy;
  max-width: none;
  text-align: left;
}

.blocknet-overview-hero .blocknet-page-hero__copy h1,
.blocknet-overview-hero .blocknet-page-hero__copy h2 {
  margin: 0;
  color: #f5f9fb;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.75rem, 5vw, 4.65rem);
  line-height: 0.92;
  letter-spacing: -0.055em;
  white-space: normal;
  text-align: left;
  transform: none;
}

.blocknet-overview-hero .blocknet-page-hero__copy p {
  max-width: 900px;
  margin-top: 13px;
  color: #d5e2e8;
  font-size: clamp(1rem, 1.35vw, 1.16rem);
  line-height: 1.52;
}

.blocknet-overview-hero__easy { color: #d5e2e8; }

.blocknet-overview-hero .blocknet-page-hero__mark {
  grid-area: mark;
  width: 104px;
  height: 104px;
  border-radius: 30px;
}

.blocknet-overview-hero .blocknet-page-hero__mark img { width: 61px; }

.blocknet-overview-hero__metrics {
  grid-area: metrics;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  padding-top: 15px;
  border-top: 1px solid rgba(75, 220, 255, 0.16);
}

.blocknet-overview-hero__metrics--routes {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.blocknet-overview-hero__metric {
  display: flex;
  min-width: 0;
  min-height: 76px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 10px 12px;
  overflow: hidden;
  border: 1px solid rgba(75, 220, 255, 0.2);
  border-radius: 13px;
  background: rgba(3, 13, 19, 0.82);
  text-align: center;
}

.blocknet-overview-hero__metric small {
  color: #b8cbd4;
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  line-height: 1.25;
  text-transform: uppercase;
}

.blocknet-overview-hero__metric strong {
  margin-top: 5px;
  color: var(--block-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.12rem, 1.8vw, 1.42rem);
  line-height: 1.05;
}

.blocknet-overview-hero__metric span {
  margin-top: 4px;
  color: #b8cbd4;
  font-size: 0.67rem;
  line-height: 1.25;
}

@media (max-width: 820px) {
  .blocknet-home-general .blocknet-status,
  .blocknet-general-page .blocknet-status,
  .blocknet-get-started-page .blocknet-status {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
  }

  .blocknet-home-general .blocknet-status > span:nth-child(2),
  .blocknet-general-page .blocknet-status > span:nth-child(2),
  .blocknet-get-started-page .blocknet-status > span:nth-child(2) {
    display: block;
    justify-self: end;
    max-width: 330px;
    text-align: right;
    line-height: 1.35;
  }

  .blocknet-home-general .blocknet-status > span:last-child,
  .blocknet-general-page .blocknet-status > span:last-child,
  .blocknet-get-started-page .blocknet-status > span:last-child { display: none; }
}

@media (max-width: 560px) {
  .blocknet-home-general .blocknet-overview-hero,
  .blocknet-general-page .blocknet-overview-hero,
  .blocknet-get-started-page .blocknet-overview-hero {
    grid-template-areas:
      "mark"
      "copy"
      "metrics";
    grid-template-columns: minmax(0, 1fr);
    padding: 20px 17px;
  }

  .blocknet-overview-hero .blocknet-page-hero__mark {
    grid-row: auto;
    justify-self: start;
    width: 82px;
    height: 82px;
    border-radius: 24px;
  }

  .blocknet-overview-hero .blocknet-page-hero__mark img { width: 49px; }
  .blocknet-overview-hero .blocknet-page-hero__copy h1,
  .blocknet-overview-hero .blocknet-page-hero__copy h2 { font-size: clamp(2.45rem, 12vw, 3.2rem); }
  .blocknet-overview-hero .blocknet-page-hero__copy p { font-size: 1rem; line-height: 1.55; }
  .blocknet-overview-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-overview-hero__metrics--routes { grid-template-columns: minmax(0, 1fr); }
}

/* DAO governance dashboard */
.blocknet-dao-page .blocknet-status > span:nth-child(2) {
  color: var(--block-cyan);
  font-size: 0.68rem;
  letter-spacing: 0.17em;
}

.blocknet-dao-page .blocknet-dao-hero {
  grid-template-areas:
    "copy mark"
    "metrics metrics";
  grid-template-columns: minmax(0, 1fr) 112px;
  min-height: 0;
  gap: 15px 24px;
  padding: 23px 30px 19px;
}

.blocknet-dao-page .blocknet-page-hero__copy { grid-area: copy; text-align: left; }
.blocknet-dao-page .blocknet-page-hero__mark {
  grid-area: mark;
  width: 104px;
  height: 104px;
  border-radius: 30px;
}
.blocknet-dao-page .blocknet-page-hero__mark img { width: 61px; }
.blocknet-dao-page .blocknet-page-hero__copy h1 {
  margin-top: 0;
  font-size: clamp(2.75rem, 5vw, 4.65rem);
  line-height: 0.92;
  text-align: left;
  transform: none;
}
.blocknet-dao-page .blocknet-page-hero__copy p {
  max-width: 900px;
  margin-top: 13px;
  font-size: clamp(1rem, 1.35vw, 1.16rem);
  line-height: 1.52;
}
.blocknet-dao-hero__easy { display: block; margin-top: 5px; color: #d8e6ec; }

.blocknet-dao-hero__metrics {
  grid-area: metrics;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  padding-top: 13px;
  border-top: 1px solid rgba(75, 220, 255, 0.15);
}
.blocknet-dao-hero__metric {
  min-width: 0;
  min-height: 76px;
  padding: 10px 12px;
  border: 1px solid rgba(75, 220, 255, 0.17);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(75, 220, 255, 0.065), rgba(85, 245, 172, 0.025));
  text-align: center;
}
.blocknet-dao-hero__metric small {
  display: block;
  color: #a9bec8;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}
.blocknet-dao-hero__metric strong {
  display: block;
  margin-top: 5px;
  overflow-wrap: anywhere;
  color: var(--block-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.08rem, 1.75vw, 1.42rem);
  line-height: 1;
}
.blocknet-dao-hero__metric > span {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  color: #a9bec8;
  font-size: 0.72rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.blocknet-governance-content { display: grid; gap: 20px; }
.blocknet-governance-live,
.blocknet-governance-history {
  overflow: hidden;
  border: 1px solid rgba(75, 220, 255, 0.22);
  border-radius: 18px;
  background: rgba(3, 13, 19, 0.9);
}
.blocknet-governance-live__head,
.blocknet-governance-history__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 22px;
  border-bottom: 1px solid rgba(75, 220, 255, 0.15);
  background: linear-gradient(90deg, rgba(75, 220, 255, 0.055), rgba(85, 245, 172, 0.035));
}
.blocknet-governance-live__head > div:first-child > span,
.blocknet-governance-history__head > div > span {
  color: var(--block-cyan);
  font-size: 0.61rem;
  font-weight: 900;
  letter-spacing: 0.14em;
}
.blocknet-governance-live__head h2,
.blocknet-governance-history__head h2 {
  margin: 5px 0 0;
  color: #f3f8fa;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.65rem, 3vw, 2.25rem);
  line-height: 1;
}
.blocknet-governance-live__head p {
  margin: 7px 0 0;
  color: #b7c8d0;
  font-size: 0.82rem;
}
.blocknet-governance-source {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  color: #a9bec8;
  font-size: 0.68rem;
}
.blocknet-governance-source i { width: 7px; height: 7px; border-radius: 50%; background: var(--block-green); box-shadow: 0 0 12px rgba(85,245,172,.8); }
.blocknet-governance-source a,
.blocknet-proposal-card a,
.blocknet-proposal-table__row a { color: var(--block-cyan); font-size: 0.68rem; font-weight: 900; text-decoration: none; text-transform: uppercase; }
.blocknet-governance-source a:hover,
.blocknet-proposal-card a:hover,
.blocknet-proposal-table__row a:hover { color: #fff; }

.blocknet-proposal-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 12px; }
.blocknet-proposal-card {
  display: flex;
  min-height: 190px;
  flex-direction: column;
  justify-content: space-between;
  padding: 19px;
  border: 1px solid rgba(85, 245, 172, 0.2);
  border-radius: 14px;
  background: radial-gradient(circle at 100% 0, rgba(85,245,172,.09), transparent 35%), rgba(4, 15, 20, 0.94);
}
.blocknet-proposal-card > div { display: flex; justify-content: space-between; gap: 15px; }
.blocknet-proposal-card small { color: var(--block-green); font-size: 0.59rem; font-weight: 900; letter-spacing: 0.11em; }
.blocknet-proposal-card h3 { margin: 7px 0 0; color: #f0f8fa; font-family: Georgia, "Times New Roman", serif; font-size: 1.35rem; }
.blocknet-proposal-card p { margin: 14px 0; color: #b8c9d1; font-size: 0.8rem; line-height: 1.55; }
.blocknet-proposal-card footer { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; }
.blocknet-proposal-status { display: inline-flex; width: fit-content; align-items: center; justify-content: center; padding: 5px 8px; color: var(--block-green); font-size: 0.6rem; font-weight: 900; letter-spacing: 0.08em; border: 1px solid rgba(85,245,172,.34); border-radius: 999px; background: rgba(85,245,172,.08); text-transform: uppercase; white-space: nowrap; }
.blocknet-proposal-status.is-failed { color: #ff7887; border-color: rgba(255,101,118,.38); background: rgba(255,101,118,.08); }
.blocknet-proposal-status.is-open { color: var(--block-gold); border-color: rgba(255,200,87,.38); background: rgba(255,200,87,.08); }
.blocknet-proposal-votes { display: flex; flex-wrap: wrap; gap: 4px 8px; }
.blocknet-proposal-votes b { font-size: 0.65rem; }
.blocknet-proposal-votes .is-yes { color: var(--block-green); }
.blocknet-proposal-votes .is-no { color: #ff7887; }
.blocknet-proposal-votes small { width: 100%; color: #91a7b2; font-size: 0.59rem; }
.blocknet-governance-empty { margin: 0; padding: 25px; color: #b8c9d1; font-size: 0.82rem; text-align: center; }
.blocknet-governance-empty--open { grid-column: 1 / -1; display: grid; min-height: 120px; place-content: center; gap: 8px; border: 1px dashed rgba(85,245,172,.24); border-radius: 14px; background: rgba(85,245,172,.025); }
.blocknet-governance-empty--open strong { color: var(--block-green); font-family: Georgia, "Times New Roman", serif; font-size: 1.45rem; }

.blocknet-governance-history__head > p { margin: 0; color: #a9bec8; font-size: 0.72rem; }
.blocknet-governance-history__head > p b:first-child { color: var(--block-green); }
.blocknet-governance-history__head > p b:last-child { color: #ff7887; }
.blocknet-governance-history__head > p i { margin: 0 7px; color: #52707e; font-style: normal; }
.blocknet-proposal-table { padding: 12px; }
.blocknet-proposal-table__labels,
.blocknet-proposal-table__row {
  display: grid;
  grid-template-columns: minmax(190px, 2fr) minmax(105px, .82fr) minmax(115px, .9fr) minmax(105px, .9fr) 85px 64px;
  gap: 12px;
  align-items: center;
}
.blocknet-proposal-table__labels { padding: 2px 12px 9px; color: #78929e; font-size: 0.56rem; font-weight: 900; letter-spacing: 0.11em; text-transform: uppercase; }
.blocknet-proposal-table__row { min-height: 70px; padding: 10px 12px; border-top: 1px solid rgba(75,220,255,.1); }
.blocknet-proposal-table__row:hover { background: rgba(75,220,255,.025); }
.blocknet-proposal-table__row > span { min-width: 0; color: #dce8ed; font-size: 0.73rem; }
.blocknet-proposal-table__row > span > strong { display: block; overflow: hidden; color: #f0f8fa; font-size: 0.78rem; text-overflow: ellipsis; white-space: nowrap; }
.blocknet-proposal-table__row > span > small { display: block; margin-top: 4px; overflow: hidden; color: #9eb2bc; font-size: 0.65rem; text-overflow: ellipsis; white-space: nowrap; }
.blocknet-proposal-table__row > span > b:not(.blocknet-proposal-status) { color: #dce8ed; font-size: 0.74rem; }
.blocknet-proposal-amount { color: var(--block-gold) !important; font-family: Georgia, "Times New Roman", serif; font-size: 0.82rem !important; font-weight: 900; }

@media (max-width: 930px) {
  .blocknet-dao-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-proposal-table__labels { display: none; }
  .blocknet-proposal-table__row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px 18px; padding: 15px 12px; }
  .blocknet-proposal-table__row > span { display: grid; gap: 4px; }
  .blocknet-proposal-table__row > span::before { content: attr(data-label); color: #708b97; font-size: 0.52rem; font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase; }
}

@media (max-width: 820px) {
  .blocknet-dao-page .blocknet-status { grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
  .blocknet-dao-page .blocknet-status > span:nth-child(2) { display: block; justify-self: end; max-width: 300px; text-align: right; line-height: 1.35; }
  .blocknet-dao-page .blocknet-status > span:last-child { display: none; }
}

@media (max-width: 680px) {
  .blocknet-governance-live__head,
  .blocknet-governance-history__head { align-items: flex-start; flex-direction: column; gap: 13px; }
  .blocknet-governance-source { justify-content: flex-start; }
  .blocknet-proposal-grid { grid-template-columns: minmax(0, 1fr); }
  .blocknet-proposal-table__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .blocknet-dao-page .blocknet-dao-hero {
    grid-template-areas:
      "mark"
      "copy"
      "metrics";
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 20px 17px;
  }
  .blocknet-dao-page .blocknet-page-hero__mark { grid-row: auto; justify-self: start; width: 82px; height: 82px; border-radius: 24px; }
  .blocknet-dao-page .blocknet-page-hero__mark img { width: 49px; }
  .blocknet-dao-page .blocknet-page-hero__copy h1 { font-size: clamp(1.95rem, 9vw, 2.35rem); white-space: nowrap; }
  .blocknet-dao-page .blocknet-page-hero__copy p { font-size: 1rem; line-height: 1.55; }
  .blocknet-dao-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-dao-hero__metric { padding-inline: 8px; }
  .blocknet-dao-hero__metric > span { font-size: 0.65rem; line-height: 1.35; text-overflow: clip; white-space: normal; }
  .blocknet-proposal-table__row { grid-template-columns: minmax(0, 1fr); }
  .blocknet-proposal-card > div,
  .blocknet-proposal-card footer { align-items: flex-start; flex-direction: column; }
}

/* Blocknet landing hero follows the shared Supply and Staking composition. */
.blocknet-home-page .blocknet-home-hero {
  display: grid;
  grid-template-areas:
    "copy mark"
    "live live"
    "products products";
  grid-template-columns: minmax(0, 1fr) 112px;
  min-height: 0;
  align-items: center;
  gap: 17px 24px;
  padding: 23px 30px 19px;
}

.blocknet-home-hero__copy { grid-area: copy; min-width: 0; text-align: left; }
.blocknet-home-hero__copy h1 {
  margin: 0;
  color: #f5f9fb;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.75rem, 5vw, 4.65rem);
  line-height: 0.92;
  letter-spacing: -0.055em;
  white-space: nowrap;
  text-align: left;
}
.blocknet-home-hero__copy p {
  max-width: 920px;
  margin: 14px 0 0;
  color: #d5e2e8;
  font-size: clamp(1rem, 1.35vw, 1.16rem);
  line-height: 1.52;
}
.blocknet-home-hero__copy p > span { display: block; margin-top: 4px; }
.blocknet-home-page .blocknet-home-hero > .blocknet-page-hero__mark {
  grid-area: mark;
  width: 104px;
  height: 104px;
  border-radius: 30px;
}
.blocknet-home-page .blocknet-home-hero > .blocknet-page-hero__mark img { width: 61px; }

.blocknet-home-products {
  grid-area: products;
  display: grid;
  gap: 13px;
  padding-top: 16px;
  border-top: 1px solid rgba(75, 220, 255, 0.16);
}
.blocknet-home-products > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 11px;
}
.blocknet-home-products > header span {
  color: var(--block-cyan);
  font-size: 0.59rem;
  font-weight: 900;
  letter-spacing: 0.14em;
}
.blocknet-home-products > header h2 {
  margin: 5px 0 0;
  color: #f3f8fa;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.75rem, 3.4vw, 2.55rem);
  line-height: 1;
  letter-spacing: -0.035em;
  white-space: nowrap;
}
.blocknet-home-products > header p {
  max-width: 960px;
  margin: 0;
  color: #d3e0e6;
  font-size: clamp(0.92rem, 1.2vw, 1.04rem);
  line-height: 1.55;
  text-align: left;
}
.blocknet-home-products > header p strong { color: var(--block-green); }
.blocknet-home-products__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}
.blocknet-home-products__grid article {
  --product-rgb: 75, 220, 255;
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 91px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 11px 12px;
  overflow: hidden;
  text-align: center;
  border: 1px solid rgba(var(--product-rgb), 0.22);
  border-radius: 13px;
  background: linear-gradient(135deg, rgba(var(--product-rgb), 0.075), rgba(3, 13, 19, 0.83));
}
.blocknet-home-products__grid article:nth-child(2) { --product-rgb: 85, 245, 172; }
.blocknet-home-products__grid article:nth-child(3) { --product-rgb: 91, 135, 255; }
.blocknet-home-products__grid article:nth-child(4) { --product-rgb: 170, 140, 255; }
.blocknet-home-products__grid small {
  color: #b4c7d0;
  font-size: 0.6rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}
.blocknet-home-products__grid strong {
  margin-top: 6px;
  color: rgb(var(--product-rgb));
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.18rem, 1.9vw, 1.48rem);
  line-height: 1;
}
.blocknet-home-products__grid span { margin-top: 5px; color: #aec1ca; font-size: 0.7rem; }

.blocknet-home-page .blocknet-home-metrics {
  grid-area: live;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  align-self: auto;
  padding: 15px 0 0;
  border-top: 1px solid rgba(75, 220, 255, 0.16);
}
.blocknet-home-page .blocknet-home-metric {
  display: flex;
  min-height: 84px;
  align-items: center;
  justify-content: center;
  padding: 11px 13px;
  text-align: center;
  border-radius: 13px;
}
.blocknet-home-page .blocknet-home-metric small { color: #b4c7d0; font-size: 0.61rem; }
.blocknet-home-page .blocknet-home-metric strong { color: rgb(var(--metric-rgb)); font-size: clamp(1.16rem, 1.8vw, 1.48rem); }
.blocknet-home-page .blocknet-home-metric div > span:last-child { color: #aec1ca; font-size: 0.68rem; }
.blocknet-home-page .blocknet-home-metric__pair { align-items: center; gap: 4px; }
.blocknet-home-page .blocknet-home-metrics__source {
  grid-column: 1 / -1;
  justify-content: flex-end;
  margin: 1px 3px 0;
  font-size: 0.66rem;
  text-align: right;
}

.blocknet-home-page .blocknet-route-menu { margin-top: 14px; }
.blocknet-home-page .blocknet-home-general { margin-top: 18px; }
.blocknet-home-page .blocknet-home-general .blocknet-content { padding-top: 22px; }

.blocknet-home-connect {
  display: grid;
  gap: 13px;
  padding-top: 0;
  scroll-margin-top: 18px;
  border-top: 0;
}
.blocknet-home-connect .blocknet-section-heading { margin: 0; }
.blocknet-home-connect .blocknet-topology { margin-top: 0; }
.blocknet-home-connect .blocknet-callout { margin-top: 0; }

@media (max-width: 900px) {
  .blocknet-home-products > header { grid-template-columns: minmax(0, 1fr); gap: 7px; }
  .blocknet-home-products > header p { max-width: 700px; text-align: left; }
  .blocknet-home-products__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .blocknet-home-page .blocknet-status { grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
  .blocknet-home-page .blocknet-status > span:nth-child(2) { display: block; justify-self: end; max-width: 360px; text-align: right; line-height: 1.35; }
}

@media (max-width: 560px) {
  .blocknet-home-page .blocknet-home-hero {
    grid-template-areas:
      "mark"
      "copy"
      "live"
      "products";
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 20px 17px;
  }
  .blocknet-home-page .blocknet-home-hero > .blocknet-page-hero__mark { grid-row: auto; justify-self: start; width: 82px; height: 82px; border-radius: 24px; }
  .blocknet-home-page .blocknet-home-hero > .blocknet-page-hero__mark img { width: 49px; }
  .blocknet-home-hero__copy h1 { font-size: clamp(2rem, 10vw, 2.7rem); }
  .blocknet-home-hero__copy p { font-size: 1rem; line-height: 1.55; }
  .blocknet-home-products > header h2 { font-size: clamp(1.65rem, 8vw, 2.1rem); white-space: normal; }
  .blocknet-home-products__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-home-products__grid article { min-height: 88px; padding-inline: 8px; }
  .blocknet-home-page .blocknet-home-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blocknet-home-page .blocknet-home-metric--price { grid-column: 1 / -1; }
  .blocknet-home-page .blocknet-home-metrics__source { justify-content: flex-start; text-align: left; }
}