.site-page {
  background: var(--background-default);
  color: var(--foreground-default);
}

.button {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  line-height: 16px;
  text-decoration: none;
  transition: background var(--motion), border-color var(--motion), color var(--motion);
}

.button--dark {
  background: var(--shade-900);
  color: white;
}

.button--dark:hover {
  background: var(--shade-800);
}

html[data-theme="dark"] .button--dark:hover {
  background: var(--mint-100);
  color: var(--shade-900);
}

.home-console {
  padding: 58px 0 64px;
  border-top: 1px solid rgba(255, 255, 255, .12);
  background: var(--shade-900);
}

.home-console__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(410px, .95fr);
  align-items: center;
  gap: 72px;
}

.home-console__intro {
  max-width: 680px;
}

.home-console h1 {
  max-width: 650px;
  margin: 14px 0 18px;
  color: white;
  font-size: 68px;
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: 0;
}

.home-console__intro > p {
  max-width: 620px;
  margin: 0;
  color: var(--shade-300);
  font-size: 17px;
  line-height: 28px;
}

.home-console__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.button--accent {
  background: var(--mint-100);
  color: var(--shade-900);
}

.button--accent:hover {
  background: var(--mint-150);
}

.button--ghost {
  border-color: rgba(255, 255, 255, .24);
  color: white;
}

.button--ghost:hover {
  background: rgba(255, 255, 255, .08);
}

.home-console__trackers {
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 8px;
  background: rgba(255, 255, 255, .045);
}

.console-heading {
  display: flex;
  justify-content: space-between;
  padding: 4px 4px 10px;
  color: var(--shade-400);
  font-size: var(--font-caption);
  font-weight: 600;
  line-height: 16px;
  text-transform: uppercase;
}

.console-note {
  margin: 10px 4px 2px;
  color: var(--shade-400);
  font-size: var(--font-label);
  line-height: 20px;
}

.site-section {
  padding: 80px 0;
}

.site-section--well {
  background: var(--background-well);
}

.site-section__heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}

.site-section__heading h2 {
  max-width: 760px;
  margin: 7px 0 0;
  font-size: 32px;
  line-height: 38px;
}

.text-link {
  color: var(--foreground-default);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.text-link:hover {
  color: var(--brand-accent-strong);
}

.asset-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  grid-auto-rows: 1fr;
}

.asset-card {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto 20px;
  align-items: center;
  gap: 14px;
  min-height: 104px;
  height: 100%;
  padding: 18px;
  border: 1px solid var(--border-default);
  border-radius: 8px;
  background: var(--surface-default);
  color: var(--foreground-default);
  text-decoration: none;
  transition: border-color var(--motion), transform var(--motion), box-shadow var(--motion);
}

.asset-card:hover {
  border-color: var(--mint-150);
  box-shadow: var(--shadow-card);
  transform: translateY(-2px);
}

.asset-card__mark {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  clip-path: polygon(29.289% 0, 70.711% 0, 100% 29.289%, 100% 70.711%, 70.711% 100%, 29.289% 100%, 0 70.711%, 0 29.289%);
  color: var(--shade-900);
  background: color-mix(in srgb, var(--asset-mark-color) 35%, white);
  font-size: 18px;
  font-weight: 600;
}

.asset-card__mark--lunc, .asset-symbol--lunc, .market-sheet__symbol--lunc { --asset-mark-color: #efd07a; }
.asset-card__mark--shib, .asset-symbol--shib, .market-sheet__symbol--shib { --asset-mark-color: #ea9aa5; }
.asset-card__mark--eth, .asset-symbol--eth, .market-sheet__symbol--eth { --asset-mark-color: #a9b9ef; }
.asset-card__mark--xrp, .asset-symbol--xrp, .market-sheet__symbol--xrp { --asset-mark-color: #b8c3cb; }
.asset-card__mark--trx, .asset-symbol--trx, .market-sheet__symbol--trx { --asset-mark-color: #ef8f8f; }
.asset-card__mark--hype, .asset-symbol--hype, .market-sheet__symbol--hype { --asset-mark-color: #8de4d0; }
.asset-card__mark--icp, .asset-symbol--icp, .market-sheet__symbol--icp { --asset-mark-color: #c0b1f2; }
.asset-card__mark--leo-token, .asset-symbol--leo-token, .market-sheet__symbol--leo-token { --asset-mark-color: #172d3e; background: #172d3e; }
.asset-card__mark img { width: 72%; height: 72%; border-radius: 50%; object-fit: contain; }
.asset-card__mark img + span { display: none; }

.asset-card__body {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.asset-card__body > span:first-child {
  display: flex;
  align-items: baseline;
  gap: 7px;
}

.asset-card__body strong { font-size: 15px; }
.asset-card__body small,
.asset-card__body > span:last-child { color: var(--foreground-muted); font-size: var(--font-small); line-height: 20px; }

.asset-card__status {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 0 9px;
  border-radius: 999px;
  font-size: var(--font-caption);
  font-weight: 600;
  white-space: nowrap;
}

.asset-card__status.is-loading { background: rgba(98, 106, 124, .14); color: var(--foreground-muted); }
.asset-card__status.is-source { background: var(--status-good-bg); color: var(--status-good); }
.asset-card__status.is-partial,
.asset-card__status.is-prototype { background: var(--status-warn-bg); color: var(--status-warn); }
.asset-card__status.is-unavailable { background: var(--status-bad-bg); color: var(--status-bad); }
.asset-card__arrow { font-size: 17px; }

.asset-card--compact {
  grid-template-columns: 38px minmax(0, 1fr) auto;
  min-height: 74px;
  margin-top: 6px;
  padding: 12px;
  border-color: rgba(255, 255, 255, .1);
  background: rgba(255, 255, 255, .055);
  color: white;
}

.asset-card--compact:hover { border-color: rgba(174, 217, 209, .55); box-shadow: none; transform: none; }
.asset-card--compact .asset-card__mark { width: 36px; height: 36px; font-size: 14px; }
.asset-card--compact .asset-card__body small,
.asset-card--compact .asset-card__body > span:last-child { color: var(--shade-400); }
.asset-card--compact .asset-card__arrow { display: none; }


.coverage-radar {
  display: grid;
  grid-template-columns: minmax(220px, .72fr) minmax(0, 1.28fr);
  align-items: center;
  gap: 32px;
  margin-top: 32px;
  padding: 28px;
  border: 1px solid var(--border-default);
  border-radius: 8px;
  background: var(--surface-subtle);
}

.coverage-radar__copy h3 {
  margin: 8px 0 10px;
  font-size: 24px;
  line-height: 30px;
}

.coverage-radar__copy p {
  margin: 0;
  color: var(--foreground-light);
  font-size: 14px;
  line-height: 22px;
}

.coverage-radar__assets {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px 12px;
}

.radar-asset { display: grid; justify-items: center; gap: 9px; text-align: center; }
.radar-asset > span:last-child { display: grid; gap: 2px; }
.radar-asset strong { font-size: 13px; line-height: 16px; }
.radar-asset small { color: var(--foreground-light); font-size: 11px; line-height: 14px; }

.radar-asset__mark {
  display: grid;
  width: 72px;
  height: 72px;
  place-items: center;
  clip-path: polygon(29.289% 0, 70.711% 0, 100% 29.289%, 100% 70.711%, 70.711% 100%, 29.289% 100%, 0 70.711%, 0 29.289%);
  background: var(--surface-default);
  box-shadow: inset 0 0 0 1px var(--border-default);
}

.radar-asset__mark img { width: 52%; height: 52%; object-fit: contain; }

.verification-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 16px;
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: 8px;
  background: var(--border-default);
}

.verification-strip > div {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 3px 10px;
  padding: 20px;
  background: var(--surface-default);
}

.verification-strip span { grid-row: 1 / 3; color: var(--brand-accent-strong); font-size: var(--font-label); font-weight: 600; }
.verification-strip strong { font-size: 15px; line-height: 20px; }
.verification-strip small { color: var(--foreground-muted); font-size: var(--font-small); line-height: 22px; }

.post-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.post-card[hidden] { display: none; }

.post-card {
  min-width: 0;
  border: 1px solid var(--border-default);
  border-radius: 8px;
  background: var(--surface-default);
}

.post-card a,
.post-card__content {
  display: grid;
  min-height: 260px;
  align-content: start;
  padding: 24px;
  color: var(--foreground-default);
  text-decoration: none;
}

.post-card:not(.is-planned):hover { border-color: var(--mint-150); box-shadow: var(--shadow-card); }
.post-card.is-planned { background: color-mix(in srgb, var(--surface-default) 82%, var(--background-well)); }
.post-card.is-planned .post-card__category { color: var(--foreground-muted); }
.post-card__category { color: var(--brand-accent-strong); font-size: var(--font-label); font-weight: 600; text-transform: uppercase; }
.post-card h3 { margin: 14px 0 10px; font-size: 21px; line-height: 27px; }
.post-card p { margin: 0; color: var(--foreground-light); font-size: 14px; line-height: 22px; }
.post-card__meta { display: flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 24px; color: var(--foreground-muted); font-size: var(--font-small); line-height: 20px; }
.post-card__meta i { width: 3px; height: 3px; border-radius: 50%; background: currentColor; }

.category-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.category-grid a {
  display: grid;
  min-height: 220px;
  padding: 22px;
  border: 1px solid var(--border-default);
  border-radius: 8px;
  background: var(--surface-default);
  color: var(--foreground-default);
  text-decoration: none;
}

.category-grid a:hover { border-color: var(--mint-150); }
.category-grid span { color: var(--foreground-muted); font-size: var(--font-label); line-height: 18px; text-transform: uppercase; }
.category-grid strong { margin-top: 10px; font-size: 20px; }
.category-grid p { margin: 10px 0 0; color: var(--foreground-light); font-size: 13px; line-height: 20px; }
.category-grid i { align-self: end; justify-self: end; font-size: 18px; font-style: normal; }

.method-callout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 40px;
}

.method-callout h2 { margin: 7px 0 8px; font-size: 30px; line-height: 36px; }
.method-callout p { max-width: 680px; margin: 0; color: var(--foreground-light); font-size: 14px; line-height: 24px; }

.page-intro {
  padding: 72px 0 54px;
  border-bottom: 1px solid var(--border-default);
  background: var(--background-well);
}

.page-intro__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
  align-items: end;
  gap: 80px;
}

.page-intro h1 {
  max-width: 760px;
  margin: 10px 0 12px;
  font-size: 46px;
  line-height: 52px;
}

.page-intro p { max-width: 720px; margin: 0; color: var(--foreground-light); font-size: 16px; line-height: 26px; }
.page-intro__note { display: grid; gap: 7px; padding-left: 18px; border-left: 3px solid var(--mint-150); }
.page-intro__note strong { font-size: 13px; }
.page-intro__note span { color: var(--foreground-light); font-size: var(--font-small); line-height: 22px; }
.page-intro--compact { padding-bottom: 46px; }
.page-intro--compact h1 { font-size: 42px; line-height: 48px; }

.category-content { min-height: 520px; padding-top: 42px; }
.filter-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--border-default); }
.filter-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.filter-chips button { min-height: 34px; padding: 0 12px; border: 1px solid var(--border-default); border-radius: 999px; background: var(--surface-default); color: var(--foreground-light); font: inherit; font-size: var(--font-label); font-weight: 600; cursor: pointer; }
.filter-chips button[aria-pressed="true"] { border-color: var(--shade-900); background: var(--shade-900); color: white; }
.post-search input { width: 240px; height: 38px; padding: 0 12px; border: 1px solid var(--border-default); border-radius: 6px; background: var(--surface-default); color: var(--foreground-default); font: inherit; font-size: var(--font-small); }
.post-search input:focus { outline: 3px solid var(--brand-accent-soft); border-color: var(--mint-150); }
.filter-result { margin: 18px 0 14px; color: var(--foreground-muted); font-size: var(--font-label); font-weight: 600; text-transform: uppercase; }
.content-empty { justify-items: center; gap: 6px; padding: 70px 20px; color: var(--foreground-muted); }
.content-empty:not([hidden]) { display: grid; }

.source-key { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 24px; }
.source-key > div { display: grid; grid-template-columns: 12px minmax(0, 1fr); gap: 3px 10px; padding: 18px; border: 1px solid var(--border-default); border-radius: 8px; }
.source-key i { width: 9px; height: 9px; margin-top: 4px; border-radius: 50%; }
.source-key i.is-source { background: var(--status-good); }
.source-key i.is-prototype { background: var(--status-warn); }
.source-key strong { font-size: var(--font-small); }
.source-key span { grid-column: 2; color: var(--foreground-muted); font-size: var(--font-label); line-height: 20px; }

.article-header {
  padding: 70px 0 0;
  background: var(--background-well);
}

.article-header__inner { max-width: 980px; }
.article-kicker { color: var(--brand-accent-strong); font-size: var(--font-label); font-weight: 600; text-decoration: none; text-transform: uppercase; }
.article-header h1 { max-width: 900px; margin: 12px 0 16px; font-size: 52px; line-height: 58px; }
.article-deck { max-width: 800px; margin: 0; color: var(--foreground-light); font-size: 18px; line-height: 29px; }

.article-meta {
  display: grid;
  grid-template-columns: 1.2fr .8fr 1fr;
  margin-top: 36px;
  border-top: 1px solid var(--border-default);
}

.article-meta > span { display: grid; gap: 3px; padding: 15px 18px 15px 0; }
.article-meta > span + span { padding-left: 18px; border-left: 1px solid var(--border-default); }
.article-meta strong { font-size: var(--font-label); line-height: 18px; }
.article-meta small { color: var(--foreground-muted); font-size: var(--font-caption); line-height: 18px; }

.article-layout {
  display: grid;
  grid-template-columns: minmax(0, 760px) minmax(230px, 280px);
  justify-content: center;
  gap: 80px;
  padding-top: 56px;
  padding-bottom: 90px;
}

.article-body { max-width: none; }
.article-disclosure { display: flex; gap: 12px; margin-bottom: 32px; padding: 14px 16px; border: 1px solid var(--border-default); border-radius: 6px; background: var(--background-well); font-size: var(--font-small); line-height: 22px; }
.article-disclosure span { color: var(--foreground-light); }
.article-lead { font-size: 19px !important; line-height: 31px !important; }
.prose h2 { margin: 48px 0 14px; font-size: 28px; line-height: 35px; }
.prose p, .prose li { color: var(--foreground-light); font-size: 16px; line-height: 28px; }
.prose ol, .prose ul { padding-left: 24px; }
.prose li + li { margin-top: 8px; }
.prose blockquote { margin: 32px 0; padding: 22px 26px; border-left: 4px solid var(--mint-150); background: var(--background-well); color: var(--foreground-default); font-size: 21px; font-weight: 600; line-height: 31px; }
.article-points { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 26px 0; }
.article-points > div { display: grid; gap: 6px; padding: 16px; border: 1px solid var(--border-default); border-radius: 6px; }
.article-points strong { font-size: var(--font-small); }
.article-points span { color: var(--foreground-muted); font-size: var(--font-label); line-height: 20px; }
.formula-panel { display: grid; gap: 8px; margin: 26px 0; padding: 24px; border-radius: 8px; background: var(--shade-900); color: white; }
.formula-panel span { color: var(--mint-100); font-size: var(--font-label); font-weight: 600; text-transform: uppercase; }
.formula-panel strong { font-size: 23px; line-height: 30px; }
.formula-panel small { color: var(--shade-300); font-size: var(--font-label); line-height: 20px; }
.article-table-wrap { overflow-x: auto; margin: 26px 0; }
.article-table-wrap table { width: 100%; min-width: 600px; border-collapse: collapse; font-size: var(--font-small); }
.article-table-wrap th, .article-table-wrap td { padding: 13px; border: 1px solid var(--border-default); text-align: left; }
.article-table-wrap th { background: var(--background-well); color: var(--foreground-muted); font-weight: 600; }
.article-update { display: grid; gap: 5px; margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--border-default); }
.article-update strong { font-size: var(--font-small); }
.article-update span { color: var(--foreground-muted); font-size: var(--font-label); line-height: 20px; }

.article-sidebar { display: grid; align-content: start; gap: 16px; }
.article-sidebar > nav, .article-sidebar > div { display: grid; gap: 10px; padding: 18px; border: 1px solid var(--border-default); border-radius: 8px; background: var(--surface-default); }
.article-sidebar > nav { position: sticky; top: 94px; }
.article-sidebar strong { font-size: var(--font-label); text-transform: uppercase; }
.article-sidebar a { color: var(--foreground-light); font-size: var(--font-small); line-height: 22px; text-decoration: none; }
.article-sidebar a:hover { color: var(--brand-accent-strong); }
.article-sidebar p { margin: 0; color: var(--foreground-muted); font-size: var(--font-label); line-height: 20px; }

.static-content { padding-top: 52px; }
.legal-prose { max-width: 780px; }
.legal-prose h2:first-child { margin-top: 0; }
.status-callout { display: grid; gap: 5px; margin-top: 30px; padding: 18px; border: 1px solid var(--status-warn); border-radius: 8px; background: var(--status-warn-bg); }
.status-callout strong { font-size: var(--font-small); }
.status-callout span { color: var(--foreground-light); font-size: var(--font-small); line-height: 22px; }


@media (max-width: 1080px) {
  .home-console h1 { font-size: 56px; line-height: 60px; }
  .home-console__grid { grid-template-columns: 1fr; gap: 38px; }
  .home-console__trackers { max-width: 720px; }
  .category-grid { grid-template-columns: repeat(2, 1fr); }
  .article-layout { grid-template-columns: minmax(0, 760px); }
  .article-sidebar { display: none; }
}

@media (max-width: 900px) {
  .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-intro__grid { grid-template-columns: 1fr; gap: 28px; }
}

@media (max-width: 760px) {
  .home-console { padding: 42px 0 48px; }
  .home-console h1 { font-size: 42px; line-height: 45px; }
  .home-console__intro > p { font-size: 15px; line-height: 25px; }
  .site-section { padding: 58px 0; }
  .site-section__heading { align-items: start; }
  .site-section__heading h2 { font-size: 27px; line-height: 33px; }
  .asset-card-grid, .verification-strip, .source-key { grid-template-columns: 1fr; }
  .coverage-radar { grid-template-columns: 1fr; padding: 24px; }
  .post-grid { grid-template-columns: 1fr; }
  .post-card a { min-height: 220px; }
  .filter-toolbar { display: grid; }
  .post-search, .post-search input { width: 100%; }
  .method-callout { grid-template-columns: 1fr; }
  .page-intro { padding: 52px 0 38px; }
  .page-intro h1, .page-intro--compact h1 { font-size: 36px; line-height: 41px; }
  .article-header { padding-top: 48px; }
  .article-header h1 { font-size: 38px; line-height: 43px; }
  .article-deck { font-size: 16px; line-height: 26px; }
  .article-meta { grid-template-columns: 1fr; }
  .article-meta > span, .article-meta > span + span { padding: 12px 0; border-left: 0; border-top: 1px solid var(--border-default); }
  .article-meta > span:first-child { border-top: 0; }
  .article-layout { padding-top: 36px; padding-bottom: 64px; }
  .article-points { grid-template-columns: 1fr; }
  .article-lead { font-size: 17px !important; line-height: 28px !important; }
  .prose h2 { margin-top: 40px; font-size: 25px; line-height: 31px; }
  .prose p, .prose li { font-size: 15px; line-height: 26px; }
}

@media (max-width: 520px) {
  .home-console h1 { font-size: 36px; line-height: 40px; }
  .home-console__actions .button { width: 100%; }
  .asset-card { grid-template-columns: 42px minmax(0, 1fr) 18px; padding: 14px; }
  .asset-card__mark { width: 40px; height: 40px; }
  .coverage-radar__assets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .radar-asset__mark { width: 64px; height: 64px; }
  .asset-card__status { grid-column: 2; justify-self: start; }
  .asset-card__arrow { grid-column: 3; grid-row: 1 / 3; }
  .asset-card--compact { grid-template-columns: 34px minmax(0, 1fr) auto; }
  .asset-card--compact .asset-card__status { grid-column: 3; grid-row: 1; align-self: center; }
  .category-grid { grid-template-columns: 1fr; }
  .category-grid a { min-height: 190px; }
  .site-section__heading { display: grid; }
  .article-disclosure { display: grid; }
  .formula-panel strong { font-size: 18px; line-height: 25px; }
}

@media (max-width: 520px) {
  .home-console { padding-block: 30px 34px; }
  .home-console__grid { gap: 22px; }
  .home-console h1 { margin-block: 10px 12px; font-size: 33px; line-height: 36px; }
  .home-console__intro > p { font-size: 14px; line-height: 22px; }
  .home-console__actions { gap: 8px; margin-top: 18px; }
  .home-console__actions .button { width: auto; min-width: 0; flex: 1 1 145px; padding-inline: 10px; }
  .home-console__trackers { padding: 8px; }
  .asset-card--compact { min-height: 62px; padding: 9px; }
  .asset-card--compact .asset-card__body > span:last-child, .console-note { display: none; }
}
.logo-showcase-section {
  overflow: hidden;
  background: var(--shade-900);
  color: white;
}

.logo-showcase__heading { align-items: start; }
.logo-showcase__heading h2 { color: white; }
.logo-showcase__heading p {
  max-width: 620px;
  margin: 10px 0 0;
  color: var(--shade-300);
  font-size: 15px;
  line-height: 24px;
}

.logo-showcase__groups { display: grid; gap: 36px; }
.logo-showcase__group {
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .14);
}
.logo-showcase__group h3 {
  margin: 0 0 22px;
  color: var(--mint-100);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.logo-showcase__grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 22px 14px;
}
.logo-showcase__grid--tracked { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.logo-showcase__asset {
  display: grid;
  min-width: 0;
  justify-items: center;
  gap: 12px;
  color: white;
  text-align: center;
  text-decoration: none;
}
.logo-showcase__asset > span:last-child { display: grid; gap: 3px; }
.logo-showcase__asset strong { font-size: 14px; line-height: 18px; }
.logo-showcase__asset small { color: var(--shade-300); font-size: 12px; line-height: 16px; }
.logo-showcase__asset em { color: var(--mint-100); font-size: 10px; font-style: normal; font-weight: 600; line-height: 14px; text-transform: uppercase; }
.logo-showcase__hexagon {
  display: grid;
  width: 108px;
  height: 108px;
  place-items: center;
  clip-path: polygon(50% 0, 93.301% 25%, 93.301% 75%, 50% 100%, 6.699% 75%, 6.699% 25%);
  background: linear-gradient(145deg, rgba(174, 217, 209, .24), rgba(255, 255, 255, .08));
  transition: background var(--motion), transform var(--motion);
}
.logo-showcase__hexagon img { width: 58%; height: 58%; object-fit: contain; }
a.logo-showcase__asset:hover .logo-showcase__hexagon {
  background: linear-gradient(145deg, rgba(174, 217, 209, .42), rgba(255, 255, 255, .14));
  transform: translateY(-3px);
}

@media (max-width: 1080px) {
  .logo-showcase__grid, .logo-showcase__grid--tracked { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .logo-showcase__grid, .logo-showcase__grid--tracked { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .logo-showcase__hexagon { width: 94px; height: 94px; }
}
.logo-showcase__heading--network {
  display: block;
  margin: 42px 0 22px;
  padding-top: 28px;
  border-top: 1px solid rgba(255, 255, 255, .14);
}
.logo-showcase__heading--network h3 { margin: 0; color: white; font-size: 24px; line-height: 30px; }
.logo-showcase__heading--network p { max-width: 620px; margin: 8px 0 0; color: var(--shade-300); font-size: 14px; line-height: 22px; }

.shape-comparison {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.shape-comparison__option {
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 8px;
  background: rgba(255, 255, 255, .055);
}
.shape-comparison__option > strong { margin-top: 8px; color: white; font-size: 16px; line-height: 20px; }
.shape-comparison__option > p { margin: 0; color: var(--shade-300); font-size: 12px; line-height: 19px; }
.shape-comparison__marks { display: flex; min-height: 104px; align-items: center; justify-content: center; gap: 8px; }
.shape-comparison__mark {
  position: relative;
  display: grid;
  width: 82px;
  height: 82px;
  flex: 0 1 82px;
  place-items: center;
  background: linear-gradient(145deg, rgba(174, 217, 209, .34), rgba(255, 255, 255, .1));
}
.shape-comparison__mark img { width: 48%; height: 48%; object-fit: contain; transform: translateY(-5px); }
.shape-comparison__mark small { position: absolute; bottom: 10px; color: white; font-size: 9px; font-weight: 600; line-height: 11px; }
.shape-comparison__mark--octagon {
  clip-path: polygon(29.289% 0, 70.711% 0, 100% 29.289%, 100% 70.711%, 70.711% 100%, 29.289% 100%, 0 70.711%, 0 29.289%);
}
.shape-comparison__mark--hexagon {
  clip-path: polygon(50% 0, 93.301% 25%, 93.301% 75%, 50% 100%, 6.699% 75%, 6.699% 25%);
}

@media (max-width: 900px) {
  .shape-comparison { grid-template-columns: repeat(3, minmax(260px, 1fr)); overflow-x: auto; padding-bottom: 8px; }
}

/* Homepage asset comparison */
.home-comparison-section {
  border-block: 1px solid var(--border-default);
}

.asset-comparison__heading {
  align-items: flex-end;
}

.asset-comparison__heading > div:first-child p {
  max-width: 680px;
  margin: 10px 0 0;
  color: var(--foreground-light);
  font-size: var(--font-small);
  line-height: 22px;
}

.asset-comparison__controls {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px;
  border-radius: 999px;
  background: var(--surface-subtle);
}

.asset-comparison__controls > span {
  padding: 0 8px 0 10px;
  color: var(--foreground-muted);
  font-size: var(--font-caption);
  font-weight: 600;
  text-transform: uppercase;
}

.asset-comparison__controls button {
  min-height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--foreground-light);
  font-size: var(--font-label);
  font-weight: 600;
}

.asset-comparison__controls button:hover {
  color: var(--foreground-default);
}

.asset-comparison__controls button[aria-pressed="true"] {
  background: var(--surface-default);
  box-shadow: var(--shadow-floating);
  color: var(--foreground-default);
}

.asset-comparison {
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-card);
  background: var(--surface-default);
}


.asset-comparison__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.asset-comparison__row {
  min-width: 0;
  min-height: 82px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--border-default);
  transition: background var(--motion);
}

.asset-comparison__row:hover {
  background: var(--surface-subtle);
}

.asset-comparison__rank {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 8px;
  background: var(--surface-subtle);
  color: var(--foreground-default);
  font-size: var(--font-label);
  font-weight: 600;
}

.asset-comparison__identity {
  display: grid;
  min-width: 0;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  color: var(--foreground-default);
  text-decoration: none;
}

.asset-comparison__identity > span:last-child,
.asset-comparison__tracked,
.asset-comparison__metric {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.asset-comparison__identity strong,
.asset-comparison__tracked strong,
.asset-comparison__metric strong {
  overflow: hidden;
  color: var(--foreground-default);
  font-size: var(--font-small);
  font-weight: 600;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.asset-comparison__identity small,
.asset-comparison__tracked small,
.asset-comparison__metric small {
  overflow: hidden;
  color: var(--foreground-muted);
  font-size: var(--font-caption);
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.asset-comparison__mark {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  clip-path: polygon(29.289% 0, 70.711% 0, 100% 29.289%, 100% 70.711%, 70.711% 100%, 29.289% 100%, 0 70.711%, 0 29.289%);
  background: color-mix(in srgb, var(--asset-mark-color) 35%, white);
  color: var(--shade-900);
  font-size: 16px;
  font-weight: 600;
}

.asset-comparison__mark--lunc { --asset-mark-color: #efd07a; }
.asset-comparison__mark--shib { --asset-mark-color: #ea9aa5; }
.asset-comparison__mark--eth { --asset-mark-color: #a9b9ef; }
.asset-comparison__mark--xrp { --asset-mark-color: #b8c3cb; }
.asset-comparison__mark--trx { --asset-mark-color: #ef8f8f; }
.asset-comparison__mark--hype { --asset-mark-color: #8de4d0; }
.asset-comparison__mark--icp { --asset-mark-color: #c0b1f2; }
.asset-comparison__mark--leo-token { --asset-mark-color: #172d3e; background: #172d3e; }
.asset-comparison__mark img { width: 72%; height: 72%; border-radius: 50%; object-fit: contain; }
.asset-comparison__mark img + span { display: none; }

.asset-comparison__state {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  justify-self: start;
  padding: 0 9px;
  border-radius: 999px;
  background: var(--surface-subtle);
  color: var(--foreground-muted);
  font-size: var(--font-caption);
  font-weight: 600;
  white-space: nowrap;
}

.asset-comparison__state.is-live { background: var(--status-good-bg); color: var(--status-good); }
.asset-comparison__state.is-partial,
.asset-comparison__state.is-prototype { background: var(--status-warn-bg); color: var(--status-warn); }
.asset-comparison__state.is-degraded,
.asset-comparison__state.is-unavailable { background: var(--status-bad-bg); color: var(--status-bad); }
.asset-comparison__row[data-comparison-available="false"] .asset-comparison__metric strong { color: var(--foreground-muted); }

.asset-comparison__footer {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  padding: 14px 18px;
  color: var(--foreground-muted);
  font-size: var(--font-caption);
  line-height: 18px;
}

.asset-comparison__footer p { margin: 0; }
.asset-comparison__status { align-self: start; font-weight: 600; text-align: left; }

@media (max-width: 900px) {
  .asset-comparison__heading { display: grid; align-items: start; }
  .asset-comparison__controls { justify-self: start; }
  .asset-comparison__footer { grid-template-columns: 1fr; }
  .asset-comparison__status { align-self: start; text-align: left; }
  .asset-comparison__row { grid-template-columns: 36px minmax(0, 1fr) auto; min-height: 96px; }
  .asset-comparison__rank { grid-row: 1 / 3; }
  .asset-comparison__identity { grid-column: 2; }
  .asset-comparison__state { grid-column: 3; grid-row: 1; }
  .asset-comparison__tracked { grid-column: 2; grid-row: 2; }
  .asset-comparison__metric { grid-column: 3; grid-row: 2; text-align: right; }
}

@media (max-width: 560px) {
  .asset-comparison__controls { display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); border-radius: 12px; }
  .asset-comparison__controls > span { grid-column: 1 / -1; padding-top: 5px; }
  .asset-comparison__controls button { min-width: 0; height: auto; min-height: 42px; padding: 6px 8px; line-height: 16px; }
  .asset-comparison__row { grid-template-columns: 28px minmax(0, 1fr); gap: 8px 10px; padding: 14px; }
  .asset-comparison__rank { grid-row: 1 / 5; }
  .asset-comparison__identity { grid-column: 2; }
  .asset-comparison__state { grid-column: 2; grid-row: 2; }
  .asset-comparison__tracked { grid-column: 2; grid-row: 3; display: flex; align-items: baseline; gap: 6px; }
  .asset-comparison__metric { grid-column: 2; grid-row: 4; display: flex; align-items: baseline; gap: 6px; text-align: left; }
  .asset-comparison__footer { grid-template-columns: 1fr; }
  .asset-comparison__status { text-align: left; }
}

/* Horizontal comparison bars */
.asset-comparison__row {
  display: grid;
  min-height: 112px;
  grid-template-columns: minmax(250px, .8fr) minmax(260px, 1.45fr) minmax(128px, .45fr);
  align-items: center;
  gap: 28px;
  padding: 18px 22px;
}

.asset-comparison__row:last-child { border-bottom: 0; }

.asset-comparison__identity-block {
  display: grid;
  min-width: 0;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}

.asset-comparison__identity-block .asset-comparison__rank { grid-row: 1; }
.asset-comparison__identity-block .asset-comparison__identity { grid-column: 2; }

.asset-comparison__plot {
  display: grid;
  min-width: 0;
  gap: 9px;
}

.asset-comparison__bar {
  display: block;
  width: 100%;
  height: 16px;
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: 5px;
  background: var(--surface-subtle);
}

.asset-comparison__bar > i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--mint-150), var(--brand-accent-strong));
  transition: width 240ms ease;
}

.asset-comparison__bar-details {
  display: flex;
  min-width: 0;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

.asset-comparison__bar-details > small {
  overflow: hidden;
  color: var(--foreground-muted);
  font-size: var(--font-caption);
  line-height: 16px;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.asset-comparison__tracked {
  display: inline-flex;
  min-width: 0;
  align-items: baseline;
  gap: 5px;
  white-space: nowrap;
}

.asset-comparison__tracked strong {
  overflow: hidden;
  color: var(--foreground-default);
  font-size: var(--font-label);
  font-weight: 600;
  line-height: 16px;
  text-overflow: ellipsis;
}

.asset-comparison__tracked small {
  color: var(--foreground-muted);
  font-size: var(--font-caption);
}

.asset-comparison__metric {
  display: grid;
  min-width: 0;
  gap: 3px;
  justify-items: end;
  text-align: right;
}

.asset-comparison__metric strong {
  font-size: 24px;
  line-height: 28px;
}

.asset-comparison__row[data-comparison-available="false"] .asset-comparison__bar {
  background: repeating-linear-gradient(135deg, var(--surface-subtle), var(--surface-subtle) 5px, var(--border-default) 5px, var(--border-default) 8px);
}

.asset-comparison__footer { border-top: 1px solid var(--border-default); }

@media (max-width: 900px) {
  .asset-comparison__row { grid-template-columns: minmax(0, 1fr) auto; gap: 16px 24px; }
  .asset-comparison__identity-block { grid-column: 1; grid-row: 1; }
  .asset-comparison__metric { grid-column: 2; grid-row: 1; }
  .asset-comparison__plot { grid-column: 1 / -1; grid-row: 2; }
}

@media (max-width: 560px) {
  .asset-comparison__row { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 16px 14px; }
  .asset-comparison__identity-block { grid-column: 1; grid-row: 1; }
  .asset-comparison__metric { grid-column: 1; grid-row: 2; justify-items: start; text-align: left; }
  .asset-comparison__plot { grid-column: 1; grid-row: 3; }
  .asset-comparison__bar-details { display: grid; gap: 4px; }
  .asset-comparison__bar-details > small { text-align: left; white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
  .asset-comparison__bar > i { transition: none; }
}

/* Production asset directory */
.assets-page .page-intro { padding: 44px 0 34px; }
.assets-page .page-intro__grid { grid-template-columns: minmax(0, 1fr) minmax(240px, 300px); align-items: end; gap: 40px; }
.assets-page .page-intro h1 { margin: 8px 0; font-size: 38px; line-height: 44px; letter-spacing: -.02em; text-wrap: balance; }
.assets-page .page-intro p { max-width: 690px; font-size: 15px; line-height: 24px; }

.assets-directory-section { min-height: 560px; padding: 30px 0 72px; }
.assets-directory__toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.assets-directory__search { position: relative; display: block; }
.assets-directory__search svg { position: absolute; top: 50%; left: 12px; width: 15px; color: var(--foreground-muted); transform: translateY(-50%); }
.assets-directory__search input { width: 260px; height: 40px; padding: 0 34px 0 36px; border: 1px solid var(--border-default); border-radius: 6px; outline: 0; background: var(--surface-default); color: var(--foreground-default); }
.assets-directory__search input::placeholder { color: var(--foreground-muted); }
.assets-directory__search input:focus { border-color: var(--mint-150); box-shadow: 0 0 0 3px var(--brand-accent-soft); }
.assets-directory__tools { display: flex; align-items: center; gap: 10px; }
.assets-directory__count { color: var(--foreground-muted); font-size: var(--font-caption); font-weight: 600; }

.assets-rank-control { position: relative; display: flex; min-width: 224px; height: 42px; align-items: center; gap: 10px; padding: 0 9px 0 13px; border: 1px solid var(--shade-700); border-radius: 8px; background: var(--shade-900); color: white; transition: border-color var(--motion), box-shadow var(--motion); }
.assets-rank-control:hover, .assets-rank-control:focus-within { border-color: var(--mint-150); box-shadow: 0 0 0 3px var(--brand-accent-soft); }
.assets-rank-label { flex: 0 0 auto; color: var(--mint-100); font-size: 10px; font-weight: 600; letter-spacing: .07em; line-height: 14px; text-transform: uppercase; }
.assets-rank-trigger { display: inline-flex; min-width: 0; height: 40px; flex: 1 1 auto; align-items: center; justify-content: flex-end; gap: 8px; padding: 0 2px; border: 0; background: transparent; color: white; font-size: var(--font-label); font-weight: 600; white-space: nowrap; }
.assets-rank-trigger svg { width: 12px; flex: 0 0 12px; transition: transform var(--motion); }
.assets-rank-trigger[aria-expanded="true"] svg { transform: rotate(180deg); }
.assets-rank-menu { position: absolute; z-index: 20; top: calc(100% + 8px); right: 0; display: grid; width: 248px; gap: 2px; padding: 6px; border: 1px solid var(--border-default); border-radius: 8px; background: var(--surface-default); box-shadow: var(--shadow-floating); }
.assets-rank-menu[hidden] { display: none; }
.assets-rank-option { display: flex; width: 100%; min-height: 38px; align-items: center; justify-content: space-between; gap: 14px; padding: 0 10px; border: 0; border-radius: 6px; background: transparent; color: var(--foreground-light); font-size: var(--font-label); font-weight: 600; text-align: left; }
.assets-rank-option:hover, .assets-rank-option:focus-visible { outline: 0; background: var(--surface-subtle); color: var(--foreground-default); }
.assets-rank-option[aria-selected="true"] { background: var(--brand-accent-soft); color: var(--brand-accent-strong); }
.assets-rank-option__check { color: var(--status-good); font-size: var(--font-caption); opacity: 0; }
.assets-rank-option[aria-selected="true"] .assets-rank-option__check { opacity: 1; }

.assets-directory { overflow: hidden; border: 1px solid var(--border-default); border-radius: 8px; background: var(--surface-default); }
.assets-directory__scroll { overflow-x: auto; }
.assets-directory table { width: 100%; min-width: 1000px; border-collapse: collapse; table-layout: fixed; }
.assets-directory col.is-rank { width: 5%; }
.assets-directory col.is-asset { width: 19%; }
.assets-directory col.is-price { width: 11%; }
.assets-directory col.is-market-cap { width: 13%; }
.assets-directory col.is-volume { width: 12%; }
.assets-directory col.is-burned { width: 16%; }
.assets-directory col.is-burn-share { width: 11%; }
.assets-directory col.is-burn-value { width: 13%; }
.assets-directory th, .assets-directory td { padding: 0 12px; border-bottom: 1px solid var(--border-default); white-space: nowrap; }
.assets-directory thead th { height: 42px; background: var(--background-well); color: var(--foreground-muted); font-size: 11px; font-weight: 600; letter-spacing: .02em; text-align: right; }
.assets-directory thead th:first-child, .assets-directory thead th:nth-child(2) { text-align: left; }
.assets-directory thead button { display: inline-flex; width: calc(100% + 12px); height: 42px; align-items: center; justify-content: flex-end; gap: 5px; margin: 0 -6px; padding: 0 6px; border: 0; background: transparent; color: inherit; font: inherit; }
.assets-directory thead th:nth-child(2) button { justify-content: flex-start; }
.assets-directory thead button:hover, .assets-directory th[aria-sort] button { color: var(--foreground-default); }
.assets-directory [data-assets-sort-arrow] { width: 10px; font-size: 10px; line-height: 1; }
.assets-directory tbody tr { height: 70px; cursor: pointer; transition: background var(--motion); }
.assets-directory tbody tr:last-child td { border-bottom: 0; }
.assets-directory tbody tr:hover { background: color-mix(in srgb, var(--brand-accent-soft) 58%, var(--surface-default)); }
.assets-directory tbody td { color: var(--foreground-default); font-size: 14px; line-height: 20px; text-align: right; }
.assets-directory tbody td:first-child, .assets-directory tbody td:nth-child(2) { text-align: left; }
.assets-directory__rank { color: var(--foreground-muted) !important; font-variant-numeric: tabular-nums; }
.assets-directory__asset { display: inline-flex; min-width: 0; align-items: center; gap: 10px; text-decoration: none; }
.assets-directory__mark { --asset-mark-color: var(--mint-100); display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; clip-path: polygon(29.289% 0, 70.711% 0, 100% 29.289%, 100% 70.711%, 70.711% 100%, 29.289% 100%, 0 70.711%, 0 29.289%); background: color-mix(in srgb, var(--asset-mark-color) 35%, white); color: var(--shade-900); font-size: var(--font-label); font-weight: 600; }
.assets-directory__mark--lunc { --asset-mark-color: #efd07a; }
.assets-directory__mark--shib { --asset-mark-color: #ea9aa5; }
.assets-directory__mark--eth { --asset-mark-color: #a9b9ef; }
.assets-directory__mark--xrp { --asset-mark-color: #b8c3cb; }
.assets-directory__mark--trx { --asset-mark-color: #ef8f8f; }
.assets-directory__mark--hype { --asset-mark-color: #8de4d0; }
.assets-directory__mark--icp { --asset-mark-color: #c0b1f2; }
.assets-directory__mark--leo-token { --asset-mark-color: #172d3e; background: #172d3e; }
.assets-directory__mark img { width: 72%; height: 72%; border-radius: 50%; object-fit: contain; }
.assets-directory__mark img + span { display: none; }
.assets-directory__identity { display: grid; min-width: 0; gap: 1px; }
.assets-directory__identity strong { overflow: hidden; font-size: 14px; line-height: 18px; text-overflow: ellipsis; }
.assets-directory__identity > span { display: inline-flex; align-items: center; gap: 6px; color: var(--foreground-muted); font-size: 11px; line-height: 14px; }
.assets-directory__state { width: 6px; height: 6px; border-radius: 50%; background: var(--border-strong); box-shadow: 0 0 0 3px var(--surface-subtle); }
.assets-directory__state.is-live { background: var(--status-good); box-shadow: 0 0 0 3px var(--status-good-bg); }
.assets-directory__state.is-degraded, .assets-directory__state.is-prototype { background: var(--status-warn); box-shadow: 0 0 0 3px var(--status-warn-bg); }
.assets-directory__state.is-unavailable { background: var(--foreground-muted); }
.assets-directory__numeric { font-family: var(--font-sans); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.assets-directory__numeric--strong { font-weight: 600; }
.assets-directory__burn-cell { display: grid; gap: 4px; justify-items: end; }
.assets-directory__burn-cell strong { font-size: 14px; line-height: 20px; }
.assets-directory__burn-bar { display: block; width: 76px; height: 3px; overflow: hidden; border-radius: 999px; background: var(--surface-subtle); }
.assets-directory__burn-bar i { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--mint-150); transition: width 240ms ease; }
.assets-directory__empty { min-height: 220px; place-items: center; color: var(--foreground-muted); text-align: center; }
.assets-directory__empty:not([hidden]) { display: grid; }
.assets-directory__empty div { display: grid; gap: 3px; }
.assets-directory__empty strong { color: var(--foreground-default); font-size: var(--font-small); }
.assets-directory__footer { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding: 13px 14px; border-top: 1px solid var(--border-default); background: var(--background-well); color: var(--foreground-muted); font-size: 11px; line-height: 17px; }
.assets-directory__footer p { max-width: 710px; margin: 0; }
.assets-directory__footer [data-assets-status] { flex: 0 0 auto; text-align: right; white-space: nowrap; }

@media (max-width: 900px) {
  .assets-page .page-intro__grid { grid-template-columns: 1fr; align-items: start; gap: 22px; }
  .assets-page .page-intro__note { width: 100%; max-width: 300px; }
}

@media (max-width: 760px) {
  .assets-page .page-intro { padding: 36px 0 30px; }
  .assets-page .page-intro h1 { font-size: 32px; line-height: 38px; }
  .assets-directory__toolbar { display: grid; grid-template-columns: 1fr; }
  .assets-directory__search, .assets-directory__search input { width: 100%; }
  .assets-directory__tools { justify-content: space-between; }
  .assets-directory { margin-right: -16px; border-right: 0; border-radius: 8px 0 0 8px; }
  .assets-directory table { min-width: 960px; }
  .assets-directory th:first-child, .assets-directory td:first-child { position: sticky; z-index: 2; left: 0; background: var(--surface-default); }
  .assets-directory thead th:first-child { z-index: 4; background: var(--background-well); }
  .assets-directory tbody tr:hover td:first-child { background: var(--brand-accent-soft); }
}

@media (max-width: 520px) {
  .assets-page .page-intro h1 { font-size: 29px; line-height: 34px; }
  .assets-page .page-intro__note { width: 100%; max-width: none; }
  .assets-directory-section { padding-top: 22px; }
  .assets-rank-control { min-width: 0; flex: 1 1 auto; }
  .assets-rank-menu { width: min(248px, calc(100vw - 24px)); }
  .assets-directory__count { display: none; }
  .assets-directory { margin-right: -12px; }
  .assets-directory__footer { display: grid; }
  .assets-directory__footer [data-assets-status] { text-align: left; white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
  .assets-rank-trigger svg, .assets-directory__burn-bar i { transition: none; }
}

/* Live service status */
.status-hero {
  padding: 68px 0 52px;
  border-bottom: 1px solid var(--border-default);
  background: var(--background-well);
}
.status-hero__inner {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 32px;
}
.status-hero h1 {
  max-width: 720px;
  margin: 12px 0 14px;
  font-size: 52px;
  font-weight: 600;
  line-height: 58px;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.status-hero p {
  max-width: 700px;
  margin: 0;
  color: var(--foreground-light);
  font-size: 17px;
  line-height: 28px;
}
.status-refresh {
  display: inline-flex;
  min-height: 42px;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
  padding: 0 15px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  background: var(--surface-default);
  color: var(--foreground-default);
  cursor: pointer;
  font-size: var(--font-label);
  transition: background var(--motion), border-color var(--motion), color var(--motion);
}
.status-refresh:hover { border-color: var(--border-strong); background: var(--surface-subtle); }
.status-refresh:disabled { cursor: wait; opacity: .72; }
.status-refresh svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.status-refresh.is-busy svg { animation: status-spin 900ms linear infinite; }

.status-dashboard {
  --status-good: #08783f;
  --status-good-bg: #d8f7e3;
  --status-warn: #8a4b00;
  --status-warn-bg: #ffe9a6;
  padding: 48px 0 88px;
}
html[data-theme="dark"] .status-dashboard {
  --status-good: #5bea91;
  --status-good-bg: #143f27;
  --status-warn: #ffd24a;
  --status-warn-bg: #4b3700;
}
.status-overall {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  min-height: 94px;
  padding: 20px 22px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-card);
  background: var(--surface-default);
}
.status-overall.is-operational { border-color: var(--status-good); background: var(--status-good-bg); }
.status-overall.is-degraded { border-color: var(--status-warn); background: var(--status-warn-bg); }
.status-overall.is-outage { border-color: var(--status-bad); background: var(--status-bad-bg); }
.status-overall__icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 999px;
  background: var(--surface-subtle);
}
.status-overall__icon i { width: 12px; height: 12px; border-radius: 999px; background: var(--foreground-muted); }
.status-overall.is-operational .status-overall__icon i { background: var(--status-good); }
.status-overall.is-degraded .status-overall__icon i { background: var(--status-warn); }
.status-overall.is-outage .status-overall__icon i { background: var(--status-bad); }
.status-overall.is-operational .status-overall__icon,
.status-overall.is-degraded .status-overall__icon,
.status-overall.is-outage .status-overall__icon {
  background: var(--surface-default);
  box-shadow: inset 0 0 0 1px currentColor;
}
.status-overall__copy { display: grid; gap: 3px; min-width: 0; }
.status-overall__copy strong { font-size: 18px; line-height: 25px; }
.status-overall__copy span { color: var(--foreground-light); font-size: var(--font-small); line-height: 22px; }
.status-overall__badge {
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--surface-subtle);
  border: 1px solid transparent;
  color: var(--foreground-light);
  font-size: var(--font-caption);
  line-height: 16px;
  text-transform: uppercase;
}
.status-overall.is-operational .status-overall__badge { border-color: var(--status-good); color: var(--status-good); }
.status-overall.is-degraded .status-overall__badge { border-color: var(--status-warn); color: var(--status-warn); }
.status-overall.is-outage .status-overall__badge { border-color: var(--status-bad); color: var(--status-bad); }
.status-meta {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 10px 2px 0;
  color: var(--foreground-muted);
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 18px;
}

.status-section { margin-top: 54px; }
.status-section__heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 17px;
}
.status-section__heading h2 { margin: 8px 0 0; font-size: 28px; line-height: 35px; letter-spacing: -.015em; }
.status-section__heading p { max-width: 680px; margin: 8px 0 0; color: var(--foreground-light); font-size: var(--font-small); line-height: 22px; }
.status-section__note { color: var(--foreground-muted); font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; }
.status-service-list, .status-asset-list {
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  background: var(--surface-default);
}
.status-service-row {
  display: grid;
  grid-template-columns: auto minmax(180px, .8fr) minmax(220px, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 76px;
  padding: 15px 18px;
  border-top: 1px solid var(--border-default);
}
.status-service-row:first-child { border-top: 0; }
.status-service-row__dot, .status-mechanism__dot, .status-legend i {
  display: block;
  width: 10px;
  height: 10px;
  flex: 0 0 10px;
  border-radius: 999px;
  background: var(--foreground-muted);
}
.status-service-row.is-operational .status-service-row__dot,
.status-mechanism[data-state="operational"] .status-mechanism__dot,
.status-legend i.is-operational { background: var(--status-good); }
.status-service-row.is-degraded .status-service-row__dot,
.status-mechanism[data-state="degraded"] .status-mechanism__dot,
.status-legend i.is-degraded { background: var(--status-warn); }
.status-service-row.is-outage .status-service-row__dot,
.status-mechanism[data-state="outage"] .status-mechanism__dot,
.status-legend i.is-outage { background: var(--status-bad); }
.status-service-row__identity { display: grid; gap: 2px; min-width: 0; }
.status-service-row__identity strong { font-size: var(--font-small); line-height: 21px; }
.status-service-row__identity span, .status-service-row__detail { color: var(--foreground-muted); font-size: var(--font-label); line-height: 20px; }
.status-service-row__detail { text-align: right; overflow-wrap: anywhere; }
.status-service-row__state { min-width: 88px; color: var(--foreground-light); font-size: var(--font-label); text-align: right; }
.status-service-row.is-operational .status-service-row__state { color: var(--status-good); }
.status-service-row.is-degraded .status-service-row__state { color: var(--status-warn); }
.status-service-row.is-outage .status-service-row__state { color: var(--status-bad); }

.status-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 13px; color: var(--foreground-muted); font-size: var(--font-caption); line-height: 18px; }
.status-legend span { display: inline-flex; align-items: center; gap: 6px; }
.status-asset { border-top: 1px solid var(--border-default); }
.status-asset:first-child { border-top: 0; }
.status-asset__summary {
  display: grid;
  width: 100%;
  grid-template-columns: 38px minmax(0, 1fr) auto 22px;
  align-items: center;
  gap: 13px;
  min-height: 76px;
  padding: 13px 17px;
  border: 0;
  background: transparent;
  color: var(--foreground-default);
  cursor: pointer;
  text-align: left;
  transition: background var(--motion), color var(--motion);
}
.status-asset__summary:hover { background: var(--background-well); }
.status-asset__mark {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid var(--border-default);
  border-radius: 999px;
  background: var(--background-well);
  color: var(--foreground-light);
  font-size: var(--font-label);
}
.status-asset__identity { display: grid; gap: 1px; min-width: 0; }
.status-asset__identity strong { overflow: hidden; font-size: var(--font-small); line-height: 21px; text-overflow: ellipsis; white-space: nowrap; }
.status-asset__identity span { color: var(--foreground-muted); font-size: var(--font-caption); font-weight: 400; line-height: 18px; }
.status-asset__state { min-width: 86px; color: var(--status-good); font-size: var(--font-label); text-align: right; }
.status-asset[data-state="degraded"] .status-asset__state { color: var(--status-warn); }
.status-asset[data-state="outage"] .status-asset__state { color: var(--status-bad); }
.status-asset__chevron { color: var(--foreground-muted); font-size: 18px; text-align: center; transition: transform var(--motion); }
.status-asset__summary[aria-expanded="true"] .status-asset__chevron { transform: rotate(180deg); }
.status-asset__details { padding: 0 17px 13px 68px; background: var(--background-well); }
.status-asset__details[hidden] { display: none; }
.status-mechanism {
  display: grid;
  grid-template-columns: auto minmax(180px, 1fr) minmax(190px, auto) auto;
  align-items: center;
  gap: 12px;
  min-height: 62px;
  padding: 11px 13px;
  border-top: 1px solid var(--border-default);
}
.status-mechanism:first-child { border-top: 0; }
.status-mechanism__identity { display: grid; gap: 1px; min-width: 0; }
.status-mechanism__identity strong { font-size: var(--font-label); line-height: 20px; overflow-wrap: anywhere; }
.status-mechanism__identity span, .status-mechanism__timing { color: var(--foreground-muted); font-family: var(--font-mono); font-size: 10px; line-height: 17px; }
.status-mechanism__timing { text-align: right; }
.status-mechanism__state { min-width: 76px; color: var(--status-good); font-size: var(--font-caption); text-align: right; }
.status-mechanism[data-state="degraded"] .status-mechanism__state { color: var(--status-warn); }
.status-mechanism[data-state="outage"] .status-mechanism__state { color: var(--status-bad); }
.status-loading-row, .status-empty { display: flex; min-height: 76px; align-items: center; gap: 11px; padding: 17px; color: var(--foreground-muted); font-size: var(--font-small); }
.status-loading-row i { width: 8px; height: 8px; border-radius: 999px; background: var(--foreground-muted); animation: status-pulse 1.2s ease-in-out infinite; }
.status-empty { display: grid; gap: 3px; }
.status-empty strong { color: var(--foreground-default); }

.status-notice-list { display: grid; gap: 8px; }
.status-notice {
  display: grid;
  gap: 3px;
  padding: 15px 17px;
  border: 1px solid var(--border-default);
  border-left: 3px solid var(--status-good);
  border-radius: 8px;
  background: var(--surface-default);
}
.status-notice[data-state="operational"] { background: var(--status-good-bg); }
.status-notice[data-state="degraded"] { border-left-color: var(--status-warn); background: var(--status-warn-bg); }
.status-notice[data-state="outage"] { border-left-color: var(--status-bad); background: var(--status-bad-bg); }
.status-notice.is-loading { border-left-color: var(--foreground-muted); }
.status-notice strong { font-size: var(--font-small); line-height: 21px; }
.status-notice span { color: var(--foreground-light); font-size: var(--font-label); line-height: 20px; }
.status-history-note { max-width: 760px; margin: 18px 0 0; color: var(--foreground-muted); font-size: var(--font-caption); line-height: 20px; }

@keyframes status-spin { to { transform: rotate(360deg); } }
@keyframes status-pulse { 50% { opacity: .35; } }

@media (max-width: 820px) {
  .status-hero__inner, .status-section__heading { align-items: start; }
  .status-service-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .status-service-row__detail { grid-column: 2 / 4; grid-row: 2; text-align: left; }
  .status-section__heading--assets { display: grid; }
  .status-legend { justify-content: flex-start; }
  .status-mechanism { grid-template-columns: auto minmax(0, 1fr) auto; }
  .status-mechanism__timing { grid-column: 2 / 4; grid-row: 2; text-align: left; }
}

@media (max-width: 620px) {
  .status-hero { padding: 46px 0 38px; }
  .status-hero__inner { display: grid; gap: 22px; }
  .status-hero h1 { font-size: 38px; line-height: 43px; }
  .status-hero p { font-size: 15px; line-height: 25px; }
  .status-refresh { width: 100%; justify-content: center; }
  .status-dashboard { padding: 30px 0 64px; }
  .status-overall { grid-template-columns: auto minmax(0, 1fr); padding: 17px; }
  .status-overall__badge { grid-column: 2; justify-self: start; }
  .status-meta { display: grid; gap: 2px; }
  .status-section { margin-top: 42px; }
  .status-section__heading { display: grid; gap: 8px; }
  .status-section__heading h2 { font-size: 25px; line-height: 31px; }
  .status-service-row { grid-template-columns: auto minmax(0, 1fr); gap: 10px; padding: 14px; }
  .status-service-row__state { grid-column: 2; grid-row: 2; min-width: 0; text-align: left; }
  .status-service-row__detail { grid-column: 2; grid-row: 3; }
  .status-asset__summary { grid-template-columns: 36px minmax(0, 1fr) 18px; padding: 12px; }
  .status-asset__state { grid-column: 2; grid-row: 2; min-width: 0; text-align: left; }
  .status-asset__chevron { grid-column: 3; grid-row: 1 / 3; }
  .status-asset__details { padding: 0 12px 12px; }
  .status-mechanism { grid-template-columns: auto minmax(0, 1fr); padding-inline: 7px; }
  .status-mechanism__state { grid-column: 2; grid-row: 2; min-width: 0; text-align: left; }
  .status-mechanism__timing { grid-column: 2; grid-row: 3; }
}

@media (prefers-reduced-motion: reduce) {
  .status-refresh.is-busy svg, .status-loading-row i { animation: none; }
}