:root {
  --webx-line: rgba(214,171,80,.14);
  --webx-line-strong: rgba(214,171,80,.3);
  --webx-surface: linear-gradient(180deg, rgba(13,13,16,.94), rgba(10,10,13,.98));
}

.skip-to-content {
  position: fixed;
  left: 14px;
  top: -60px;
  z-index: 1000;
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--webx-line-strong);
  background: linear-gradient(180deg, rgba(214,171,80,.96), rgba(171,126,40,.94));
  color: #090909;
  font-weight: 800;
  text-decoration: none;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
  transition: top .18s ease;
}

.skip-to-content:focus {
  top: 12px;
}

.site-bottom-bar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}

.site-bottom-bar__links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.site-bottom-bar__links a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid rgba(214,171,80,.10);
  background: #0d0d11;
  color: #f1efe7;
  text-decoration: none;
  font-family: Teko, Inter, sans-serif;
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: .03em;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

.site-bottom-bar__links a:hover,
.site-bottom-bar__links a:focus-visible {
  color: var(--gold-2);
  border-color: var(--webx-line-strong);
  background: linear-gradient(180deg, rgba(33,25,11,.45), rgba(11,11,13,.98));
}

.nav-utility {
  display: flex;
  align-items: center;
}

.nav-utility__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  min-width: 42px;
  height: 40px;
  border: 1px solid rgba(214,171,80,.10);
  background: #0d0d11;
  color: #f4f4f2;
  text-decoration: none;
  font-size: 18px;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

.nav-utility__button:hover,
.nav-utility__button:focus-visible,
.nav-utility__button.is-active {
  color: var(--gold-2);
  border-color: var(--webx-line-strong);
  background: linear-gradient(180deg, rgba(33,25,11,.45), rgba(11,11,13,.98));
}

.page-tools,
.resource-toolbar,
.content-links,
.related-stack,
.search-toolbar,
.search-result,
.faq-category,
.roadmap-column,
.legal-card,
.notfound-card {
  border: 1px solid var(--webx-line);
  background: var(--webx-surface);
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
}

.page-tools,
.resource-toolbar,
.search-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 14px;
}

.page-tools__spacer,
.resource-toolbar__spacer {
  flex: 1 1 auto;
}

.page-tools__button,
.resource-toolbar__button,
.content-links__item,
.search-filter,
.search-shortcut,
.related-link,
.faq-chip,
.notfound-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(214,171,80,.12);
  background: #0d0d11;
  color: #f4f4f2;
  text-decoration: none;
  font-weight: 700;
  letter-spacing: .02em;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

.page-tools__button:hover,
.resource-toolbar__button:hover,
.content-links__item:hover,
.search-filter:hover,
.search-shortcut:hover,
.related-link:hover,
.notfound-link:hover,
.page-tools__button:focus-visible,
.resource-toolbar__button:focus-visible,
.content-links__item:focus-visible,
.search-filter:focus-visible,
.search-shortcut:focus-visible,
.related-link:focus-visible,
.notfound-link:focus-visible {
  color: var(--gold-2);
  border-color: var(--webx-line-strong);
}

.page-tools__button--primary,
.search-filter.is-active,
.search-shortcut--primary,
.notfound-link--primary {
  background: linear-gradient(180deg, rgba(214,171,80,.96), rgba(171,126,40,.94));
  color: #090909;
  border-color: var(--webx-line-strong);
}

.page-tools__button--primary:hover,
.search-filter.is-active:hover,
.search-shortcut--primary:hover,
.notfound-link--primary:hover {
  color: #090909;
}

.page-tools__label,
.content-links__label,
.search-section__label,
.faq-category__eyebrow,
.roadmap-column__eyebrow,
.legal-card__eyebrow,
.notfound-card__eyebrow {
  color: rgba(214,171,80,.86);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.content-links {
  display: grid;
  gap: 10px;
  margin-top: 16px;
  padding: 14px;
}

.content-links__items,
.related-stack {
  display: grid;
  gap: 10px;
}

.related-link,
.search-result {
  justify-content: flex-start;
  min-height: unset;
  padding: 14px;
}

.related-link {
  display: grid;
  gap: 4px;
}

.related-link strong,
.search-result strong {
  font-size: 15px;
}

.related-link span,
.search-result p,
.faq-answer,
.roadmap-card p,
.legal-card p,
.notfound-card p {
  color: #b7b2aa;
  line-height: 1.7;
}

.related-link small,
.search-result small,
.search-result__meta {
  color: rgba(214,171,80,.72);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.faq-main,
.roadmap-main,
.search-main,
.legal-main,
.notfound-main {
  padding: 0 0 46px;
}

.resource-section,
.search-section,
.legal-section,
.notfound-section {
  padding: 14px 0 0;
}

.resource-grid,
.search-layout,
.legal-grid {
  display: grid;
  gap: 14px;
}

.resource-grid {
  grid-template-columns: 1fr;
}

.resource-toolbar {
  margin-bottom: 14px;
}

.resource-search {
  flex: 1 1 320px;
  min-width: min(100%, 320px);
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid rgba(214,171,80,.12);
  background: #0d0d11;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

.resource-search input,
.search-box input {
  width: 100%;
  background: transparent;
  border: 0;
  color: #fff;
  outline: none;
  font-size: 14px;
}

.faq-category,
.roadmap-column,
.legal-card,
.notfound-card {
  padding: 18px;
}

.faq-category__head,
.roadmap-column__head {
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
}

.faq-list,
.roadmap-list {
  display: grid;
  gap: 10px;
}

.faq-item {
  border: 1px solid rgba(214,171,80,.1);
  background: rgba(8,8,11,.84);
}

.faq-item__trigger {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  min-height: 56px;
  padding: 14px;
  border: 0;
  background: transparent;
  color: #fff;
  text-align: left;
  cursor: pointer;
}

.faq-item__trigger strong {
  font-size: 15px;
}

.faq-item__trigger span:last-child {
  color: rgba(214,171,80,.76);
  font-size: 22px;
  line-height: 1;
}

.faq-answer {
  display: none;
  padding: 0 14px 14px;
}

.faq-item.is-open .faq-answer {
  display: block;
}

.faq-item.is-open .faq-item__trigger span:last-child {
  transform: rotate(45deg);
}

.faq-tags {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.faq-chip {
  min-height: 32px;
  padding: 0 10px;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.resource-empty,
.search-empty {
  padding: 24px;
  text-align: center;
  border: 1px dashed rgba(214,171,80,.22);
  color: #b7b2aa;
}

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

.roadmap-column[data-tone="done"] {
  border-color: rgba(108, 214, 137, .22);
}

.roadmap-column[data-tone="progress"] {
  border-color: rgba(214,171,80,.24);
}

.roadmap-column[data-tone="planned"] {
  border-color: rgba(132, 168, 255, .2);
}

.roadmap-card {
  padding: 14px;
  border: 1px solid rgba(214,171,80,.1);
  background: rgba(8,8,11,.84);
}

.roadmap-card__badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  margin-bottom: 8px;
  border: 1px solid rgba(214,171,80,.14);
  background: #0d0d11;
  color: var(--gold-2);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.roadmap-notes {
  margin-top: 14px;
  padding: 18px;
}

.roadmap-notes ul {
  margin: 10px 0 0;
  padding-left: 18px;
  color: #b7b2aa;
}

.search-layout {
  grid-template-columns: minmax(0, 1fr);
}

.search-toolbar {
  flex-direction: column;
  align-items: stretch;
}

.search-box {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 0 16px;
  border: 1px solid rgba(214,171,80,.12);
  background: #0d0d11;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
}

.search-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  color: #b7b2aa;
  font-size: 13px;
}

.search-filters,
.search-shortcuts {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.search-results {
  display: grid;
  gap: 12px;
}

.search-result {
  display: grid;
  gap: 8px;
}

.search-result mark {
  background: rgba(214,171,80,.18);
  color: #f2e2af;
  padding: 0 .12em;
}

.search-result__meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.search-shortcut {
  justify-content: flex-start;
}

.search-shortcut__body {
  display: grid;
  gap: 4px;
}

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

.legal-card h2,
.notfound-card h1,
.faq-category h2,
.roadmap-column h2,
.search-section h2 {
  margin: 8px 0 10px;
  font-family: Teko, Inter, sans-serif;
  font-size: clamp(28px, 3.6vw, 44px);
  line-height: .95;
  text-transform: uppercase;
}

.legal-card ul,
.notfound-card ul {
  margin: 12px 0 0;
  padding-left: 18px;
  color: #b7b2aa;
}

.notfound-card {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}

.notfound-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 18px;
}

@media (max-width: 1200px) {
  .roadmap-grid,
  .legal-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 740px) {
  .site-bottom-bar__inner {
    align-items: flex-start;
  }

  .site-bottom-bar__links {
    justify-content: flex-start;
  }

  .search-meta {
    align-items: flex-start;
  }
}


.page-tools--inline {
  padding: 0;
  margin: 0 0 12px;
  border: 0;
  background: transparent;
  clip-path: none;
}

.rules-group__head {
  justify-content: space-between;
  flex-wrap: wrap;
}

.rules-group__head > div:first-of-type {
  flex: 1 1 220px;
}

.rules-group__head .page-tools {
  margin-left: auto;
  padding: 0;
  border: 0;
  background: transparent;
  clip-path: none;
}

.wiki-heading-link {
  min-height: 30px;
  padding: 0 10px;
  margin-left: 10px;
  font-size: 11px;
  vertical-align: middle;
}

.wiki-block h2 .wiki-heading-link,
.wiki-block h3 .wiki-heading-link,
.wiki-block h4 .wiki-heading-link {
  transform: translateY(-2px);
}

.announcement-related--ecosystem .announcement-related__date {
  text-transform: none;
  letter-spacing: normal;
  font-size: 12px;
  color: #b7b2aa;
}


.site-bottom-bar__quicklinks {
  display: grid;
  gap: 10px;
  justify-items: end;
}

.site-bottom-bar__eyebrow {
  color: rgba(214,171,80,.78);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.site-bottom-bar__links a {
  position: relative;
  min-height: 38px;
  padding: 0 14px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02);
  transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease;
}

.site-bottom-bar__links a:hover,
.site-bottom-bar__links a:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0,0,0,.24);
}

.resource-toolbar {
  justify-content: space-between;
  gap: 14px;
}

.resource-toolbar__note {
  display: grid;
  gap: 4px;
  min-width: min(100%, 260px);
  padding: 12px 14px;
  border: 1px solid rgba(214,171,80,.12);
  background: linear-gradient(180deg, rgba(21,17,10,.72), rgba(11,11,13,.96));
}

.resource-toolbar__note small {
  color: rgba(214,171,80,.8);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.resource-toolbar__note strong {
  color: #f4f0e6;
  font-size: 14px;
  line-height: 1.35;
}

.resource-toolbar__note--accent {
  border-color: rgba(214,171,80,.24);
  background: linear-gradient(180deg, rgba(41,31,13,.88), rgba(14,12,10,.96));
}

.faq-category,
.roadmap-column,
.search-toolbar,
.search-result,
.content-links,
.legal-card,
.notfound-card {
  box-shadow: 0 16px 34px rgba(0,0,0,.22);
}

.faq-category__head h2,
.roadmap-column__head h2,
.notfound-card h1,
.legal-card h2 {
  letter-spacing: .03em;
}

.faq-item,
.roadmap-card,
.related-link,
.search-result {
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.faq-item:hover,
.roadmap-card:hover,
.related-link:hover,
.search-result:hover {
  transform: translateY(-2px);
  border-color: rgba(214,171,80,.22);
  box-shadow: 0 14px 28px rgba(0,0,0,.18);
}

.faq-item__trigger {
  min-height: 60px;
}

.faq-item__trigger strong,
.roadmap-card strong,
.search-result strong,
.related-link strong {
  color: #f7f3ea;
}

.faq-item.is-open,
.roadmap-column[data-tone="progress"] .roadmap-card:first-child {
  border-color: rgba(214,171,80,.22);
  background: linear-gradient(180deg, rgba(22,18,12,.88), rgba(9,9,12,.92));
}

.roadmap-column__head {
  position: relative;
  padding-bottom: 12px;
}

.roadmap-column__head::after {
  content: '';
  width: 64px;
  height: 2px;
  background: linear-gradient(90deg, rgba(214,171,80,.9), rgba(214,171,80,0));
}

.search-toolbar {
  gap: 16px;
}

.search-shortcut {
  min-height: 48px;
  padding: 10px 14px;
}

.search-shortcut__body strong {
  color: #fff7e6;
}

.search-result {
  background: linear-gradient(180deg, rgba(14,14,17,.96), rgba(9,9,12,.98));
}

.page-tools,
.page-tools--inline,
.wiki-heading-link {
  display: none !important;
}

@media (max-width: 740px) {
  .site-bottom-bar__quicklinks {
    justify-items: start;
  }

  .resource-toolbar__note {
    min-width: 100%;
  }
}