:root {
  --ink: #0f1f33;
  --ink-soft: #5a6f84;
  --paper: #f4f8fc;
  --paper-2: #e8f1f8;
  --line: #d0e0ec;
  --accent: #1677c5;
  --accent-2: #0d5a9c;
  --accent-soft: rgba(22, 119, 197, 0.1);
  --danger: #c43d3d;
  --ok: #1a9b6e;
  --card: #ffffff;
  --shadow: 0 10px 36px rgba(15, 70, 120, 0.07);
  --shadow-lg: 0 22px 56px rgba(15, 70, 120, 0.12);
  --radius: 12px;
  --font-display: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-body: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
  background:
    linear-gradient(180deg, #eaf3fb 0%, var(--paper) 28%, #f7fafc 100%);
  background-attachment: fixed;
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--accent); }

.wrap {
  width: min(1160px, calc(100% - 2rem));
  margin: 0 auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  backdrop-filter: blur(18px) saturate(1.2);
  background: rgba(255, 255, 255, 0.88);
  border-bottom: 1px solid rgba(176, 200, 220, 0.55);
  box-shadow: 0 8px 28px rgba(15, 70, 120, 0.04);
}
.site-header::before {
  content: "";
  display: block;
  height: 3px;
  background: linear-gradient(90deg, #0d5a9c 0%, #1677c5 42%, #5eb0e8 100%);
}

.site-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  min-height: 4.25rem;
  padding: 0.65rem 0;
}

.brand {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-shrink: 0;
  font-family: var(--font-display);
  letter-spacing: 0.04em;
  transition: opacity 0.2s ease;
}
.brand:hover { opacity: 0.88; color: inherit; }
.brand__logo {
  width: 2.5rem;
  height: 2.5rem;
  object-fit: cover;
  object-position: center 12%;
  border-radius: 0.55rem;
  flex-shrink: 0;
  box-shadow: 0 1px 4px rgba(15, 55, 95, 0.12);
}
.brand__copy {
  display: flex;
  align-items: baseline;
  gap: 0.45rem;
}
.brand strong {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--accent-2);
  background: linear-gradient(120deg, #0d5a9c 0%, #1677c5 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.brand__tagline {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--ink-soft);
  font-size: 0.82rem;
  font-family: var(--font-body);
  letter-spacing: 0.02em;
  font-weight: 500;
}
.brand__pipe {
  color: #9aadc0;
  font-weight: 400;
}

.site-header__menu-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 2.75rem;
  min-height: 44px;
  padding: 0.55rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.9);
  cursor: pointer;
  transition: all 0.2s ease;
}
.site-header__menu-toggle:hover {
  background: rgba(22, 119, 197, 0.08);
  border-color: rgba(22, 119, 197, 0.35);
}
.site-header__menu-toggle:active { transform: scale(0.98); }
.site-header__menu-toggle:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.site-header__menu-toggle-bar {
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: var(--ink);
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.site-header.is-nav-open .site-header__menu-toggle-bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.site-header.is-nav-open .site-header__menu-toggle-bar:nth-child(2) {
  opacity: 0;
}
.site-header.is-nav-open .site-header__menu-toggle-bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

.site-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem 1.5rem;
  flex: 1 1 auto;
  min-width: 0;
}

.site-nav__list {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-nav__item {
  position: relative;
}
.site-nav__item.is-active > .site-nav__trigger,
.site-nav__item.is-active > .site-nav__link {
  color: var(--accent);
}
.site-nav__item.is-active > .site-nav__trigger::after,
.site-nav__item.is-active > .site-nav__link::after {
  content: "";
  position: absolute;
  left: 0.85rem;
  right: 0.85rem;
  bottom: 0.2rem;
  height: 2px;
  border-radius: 2px;
  background: var(--accent);
}

.site-nav__trigger,
.site-nav__link,
.site-nav__account-trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-height: 44px;
  padding: 0.45rem 0.85rem;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.2;
  cursor: pointer;
  transition: all 0.2s ease;
}
.site-nav__trigger:hover,
.site-nav__link:hover,
.site-nav__account-trigger:hover {
  color: var(--accent);
  background: rgba(22, 119, 197, 0.08);
}
.site-nav__trigger:active,
.site-nav__link:active,
.site-nav__account-trigger:active {
  transform: scale(0.98);
}
.site-nav__trigger:focus-visible,
.site-nav__link:focus-visible,
.site-nav__account-trigger:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.site-nav__chevron {
  width: 0.45rem;
  height: 0.45rem;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-1px) rotate(45deg);
  opacity: 0.65;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.site-nav__item.is-open .site-nav__chevron {
  transform: translateY(1px) rotate(225deg);
  opacity: 1;
}

.site-nav__panel {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 50;
  display: grid;
  gap: 0.2rem;
  min-width: 17.5rem;
  padding: 0.75rem;
  margin-top: 0.35rem;
  border: 1px solid rgba(176, 200, 220, 0.85);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow:
    0 4px 6px rgba(15, 55, 95, 0.04),
    0 18px 40px rgba(15, 55, 95, 0.12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
}
/* ???????????????????? */
.site-nav__panel::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -0.45rem;
  height: 0.45rem;
}
.site-nav__item.is-open > .site-nav__panel,
.site-nav__item:focus-within > .site-nav__panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}
.site-nav__panel--supplier { min-width: 18rem; }
.site-nav__panel--account {
  left: auto;
  right: 0;
  min-width: 16.5rem;
}

.site-nav__panel-label {
  margin: 0 0 0.35rem;
  padding: 0.25rem 0.65rem;
  color: var(--ink-soft);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.site-nav__panel-link {
  display: grid;
  gap: 0.15rem;
  padding: 0.7rem 0.75rem;
  border-radius: 12px;
  color: var(--ink);
  transition: all 0.2s ease;
}
.site-nav__panel-link:hover {
  color: var(--ink);
  background: rgba(22, 119, 197, 0.08);
}
.site-nav__panel-link:active { transform: scale(0.98); }
.site-nav__panel-link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
.site-nav__panel-link.is-active {
  background: rgba(22, 119, 197, 0.12);
}
.site-nav__panel-link.is-active .site-nav__panel-title {
  color: var(--accent);
}
.site-nav__panel-title {
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.35;
}
.site-nav__panel-desc {
  color: var(--ink-soft);
  font-size: 0.8rem;
  line-height: 1.45;
}
.site-nav__panel-link--danger .site-nav__panel-title {
  color: var(--danger);
}
.site-nav__logout-form {
  margin: 0;
}
.site-nav__logout-btn {
  width: 100%;
  border: none;
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.site-nav__panel-divider {
  height: 1px;
  margin: 0.35rem 0.35rem;
  background: rgba(176, 200, 220, 0.7);
}

.site-nav__aside {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin-left: auto;
}

.site-nav__account-trigger {
  max-width: 14rem;
  border: 1px solid rgba(176, 200, 220, 0.8);
  background: rgba(255, 255, 255, 0.85);
}
.site-nav__account-trigger:hover {
  border-color: rgba(22, 119, 197, 0.35);
}
.site-nav__account-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 50%;
  background: var(--ink);
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 600;
  flex-shrink: 0;
}
.site-nav__account-email {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.88rem;
  font-weight: 500;
}

.site-nav__auth {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
}
.site-nav__login {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.35rem 0.55rem;
  color: var(--ink);
  font-weight: 500;
  border-radius: 10px;
  transition: all 0.2s ease;
}
.site-nav__login:hover {
  color: var(--accent);
  background: rgba(22, 119, 197, 0.08);
}
.site-nav__login:active { transform: scale(0.98); }
.site-nav__login:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.site-nav__register {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 3.6rem;
  padding: 0.55rem 1.2rem;
  border-radius: 8px;
  background: linear-gradient(180deg, #2a8ad4 0%, #1677c5 100%);
  color: #ffffff;
  font-weight: 500;
  line-height: 1;
  box-shadow: 0 6px 16px rgba(22, 119, 197, 0.25);
  transition: all 0.2s ease;
}
.site-nav__register:hover {
  background: #125e9e;
  color: #fff;
  transform: translateY(-1px);
  filter: brightness(0.96);
}
.site-nav__register:active { transform: scale(0.98); }
.site-nav__register:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

@media (max-width: 1024px) {
  .site-header__menu-toggle { display: inline-flex; }

  .site-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
    padding: 0.85rem 1rem 1.15rem;
    border-bottom: 1px solid rgba(176, 200, 220, 0.7);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 18px 36px rgba(15, 55, 95, 0.12);
  }
  .site-header.is-nav-open .site-nav { display: flex; }

  .site-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0.2rem;
  }
  .site-nav__item.is-active > .site-nav__trigger::after,
  .site-nav__item.is-active > .site-nav__link::after {
    display: none;
  }
  .site-nav__trigger,
  .site-nav__link,
  .site-nav__account-trigger {
    width: 100%;
    justify-content: space-between;
  }
  .site-nav__panel {
    position: static;
    min-width: 0;
    margin-top: 0.25rem;
    margin-bottom: 0.35rem;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
    display: none;
  }
  .site-nav__item.is-open > .site-nav__panel { display: grid; }
  .site-nav__item:focus-within > .site-nav__panel {
    /* ???? is-open??? focus-within ?????? */
    display: none;
  }
  .site-nav__item.is-open:focus-within > .site-nav__panel { display: grid; }

  .site-nav__aside {
    margin-left: 0;
    padding-top: 0.65rem;
    border-top: 1px solid rgba(176, 200, 220, 0.55);
  }
  .site-nav__account-trigger { max-width: none; }
  .site-nav__auth {
    width: 100%;
    justify-content: stretch;
  }
  .site-nav__login,
  .site-nav__register {
    flex: 1 1 auto;
    justify-content: center;
  }
}

@media (max-width: 768px) {
  .brand__tagline { display: none; }
  .site-header__bar { min-height: 3.75rem; }
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 0.7rem 1.35rem;
  min-height: 44px;
  font: inherit;
  font-weight: 500;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: all 0.2s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: scale(0.98); }
.btn-primary {
  background: linear-gradient(180deg, #1a3a58 0%, #0f1f33 100%);
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(15, 31, 51, 0.18);
}
.btn-primary:hover { background: #163a5c; color: #fff; filter: brightness(0.96); }
.btn-accent {
  background: linear-gradient(180deg, #2a8ad4 0%, #1677c5 100%);
  color: #ffffff;
  box-shadow: 0 8px 22px rgba(22, 119, 197, 0.28);
}
.btn-accent:hover { background: #125e9e; color: #fff; filter: brightness(0.96); }
.btn-ghost {
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(22, 119, 197, 0.28);
  color: var(--accent-2);
}
.btn-ghost:hover {
  background: rgba(22, 119, 197, 0.08);
  border-color: rgba(22, 119, 197, 0.45);
  color: var(--accent-2);
}
.btn-danger {
  background: transparent;
  border-color: #e8b4b4;
  color: var(--danger);
}

.hero {
  padding: 3.2rem 0 1.5rem;
  animation: rise 0.7s ease both;
}
.catalog-hero {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
  padding-bottom: 1.1rem;
}
.catalog-hero-copy { flex: 1 1 18rem; }
.catalog-stat {
  display: grid;
  gap: 0.15rem;
  min-width: 7.5rem;
  padding: 0.85rem 1.05rem;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  text-align: right;
}
.catalog-stat strong {
  font-family: var(--font-display);
  font-size: 1.85rem;
  line-height: 1;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
}
.catalog-stat span {
  color: var(--ink-soft);
  font-size: 0.82rem;
}
.hero h1 {
  margin: 0 0 0.75rem;
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3.1rem);
  line-height: 1.2;
  max-width: 14ch;
}
/* 动态名称（商品/供方/需求标题）勿用窄 ch 限制，避免英文词被截断换行 */
.catalog-hero h1,
.product-hero h1,
.agent-product-hero h1 {
  max-width: none;
  width: 100%;
  text-align: left;
  overflow-wrap: break-word;
  text-wrap: pretty;
}
.hero p {
  margin: 0;
  max-width: 38rem;
  color: var(--ink-soft);
  font-size: 1.05rem;
  line-height: 1.7;
}


.toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: end;
  margin: 1.75rem 0 1rem;
  padding: 1rem;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.toolbar .field.grow {
  flex: 1 1 220px;
  min-width: 180px;
}
.toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Catalog filters */
.catalog-filters {
  display: grid;
  gap: 1.1rem;
  margin: 1.25rem 0 1rem;
  padding: 1.25rem 1.35rem 1.3rem;
  border-radius: calc(var(--radius) + 6px);
  border: 1px solid rgba(176, 200, 220, 0.75);
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.98) 0%, rgba(235, 244, 251, 0.94) 100%);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.8) inset,
    0 20px 48px rgba(15, 55, 95, 0.07);
  position: relative;
  overflow: visible;
  z-index: 5;
}
.catalog-filters::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  border-radius: calc(var(--radius) + 6px) calc(var(--radius) + 6px) 0 0;
  background: linear-gradient(90deg, var(--accent) 0%, #3d8fc9 45%, var(--accent-2) 100%);
  opacity: 0.9;
  pointer-events: none;
}

.catalog-filters__search,
.catalog-filters-search {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: stretch;
}
.catalog-search-field {
  position: relative;
  flex: 1 1 18rem;
  min-width: 12rem;
  gap: 0;
}
.catalog-search-icon {
  position: absolute;
  left: 0.95rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  width: 1.15rem;
  height: 1.15rem;
  color: #7a8792;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  transition: color 0.2s ease;
}
/* Higher specificity than .field input so left padding for icon is not overridden */
.field.catalog-search-field > input {
  width: 100%;
  min-height: 48px;
  padding: 0.85rem 1.1rem 0.85rem 2.85rem;
  border-radius: 14px;
  border: 1px solid rgba(168, 196, 218, 0.95);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.85) inset;
  font-size: 1rem;
  transition: all 0.2s ease;
}
.field.catalog-search-field > input::placeholder {
  color: #9aa3ab;
}
.field.catalog-search-field > input:hover {
  border-color: #9bb0c4;
  background: #fff;
}
.field.catalog-search-field > input:focus {
  outline: none;
  border-color: var(--accent);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(22, 119, 197, 0.12);
}
.catalog-search-field:focus-within .catalog-search-icon {
  color: var(--accent);
}

.catalog-filters__actions,
.catalog-filters-search .toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  flex: 0 0 auto;
  align-items: center;
}
.catalog-filters__submit,
.catalog-filters-submit {
  min-width: 6.5rem;
  min-height: 48px;
  padding-inline: 1.35rem;
  border-radius: 14px;
  box-shadow: 0 10px 22px rgba(15, 55, 95, 0.14);
}
.catalog-filters__reset {
  min-height: 48px;
  border-radius: 14px;
}

.catalog-filters__panel,
.catalog-filters-panel {
  display: grid;
  gap: 0.85rem;
  padding: 1rem 1rem 1.05rem;
  border-radius: 16px;
  border: 1px solid rgba(176, 200, 220, 0.55);
  background: rgba(255, 255, 255, 0.55);
}
.catalog-filters__heading,
.catalog-filters-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.55rem 0.75rem;
}
.catalog-filters__heading-label,
.catalog-filters-heading > span:first-child {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #6d7a86;
}
.catalog-filters__badge,
.catalog-filters-heading em {
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  font-size: 0.75rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  color: var(--accent);
  background: rgba(22, 119, 197, 0.1);
  border: 1px solid rgba(22, 119, 197, 0.2);
}
.catalog-filters__hint {
  color: #8a959f;
  font-size: 0.8rem;
}

.catalog-filters__grid,
.catalog-filters-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.85rem 0.75rem;
}
.catalog-filters__field,
.catalog-filters .field {
  min-width: 0;
  gap: 0.4rem;
  position: relative;
}
.catalog-filters__field > label,
.catalog-filters .field > label {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #5f6d79;
  padding-left: 0.1rem;
}

.catalog-filters__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0;
  padding: 0.85rem 0 0;
  list-style: none;
  border-top: 1px dashed rgba(176, 200, 220, 0.7);
}
.catalog-filters__chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  border: 1px solid rgba(22, 119, 197, 0.22);
  background: rgba(22, 119, 197, 0.08);
  color: #125e9e;
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.catalog-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem 1.25rem;
  flex-wrap: wrap;
  margin: 0 0 1rem;
  padding: 0.7rem 0.15rem;
}
.catalog-range {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
}
.catalog-range strong {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.catalog-pagesize {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
}
.catalog-pagesize label {
  color: var(--ink-soft);
  font-size: 0.85rem;
  font-weight: 500;
  white-space: nowrap;
}
.catalog-pagesize .fancy-select {
  min-width: 6.5rem;
}
.catalog-pagesize .fancy-select-trigger {
  min-height: 2.4rem;
  border-radius: 10px;
  background: #fff;
}

/* Fancy select */
.fancy-select {
  position: relative;
  width: 100%;
}
.fancy-select-native {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.fancy-select-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
  width: 100%;
  min-height: 44px;
  padding: 0.55rem 0.65rem 0.55rem 0.85rem;
  border-radius: 12px;
  border: 1px solid rgba(168, 196, 218, 0.9);
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 55, 95, 0.04);
  color: var(--ink);
  font: inherit;
  font-size: 0.9rem;
  line-height: 1.25;
  text-align: left;
  cursor: pointer;
  transition: all 0.2s ease;
}
.fancy-select-value {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fancy-select-chevron {
  flex: 0 0 auto;
  color: #7b8792;
  transition: transform 0.2s ease, color 0.2s ease;
}
.fancy-select-trigger:hover {
  border-color: #9bb0c4;
  background: #ffffff;
  filter: brightness(0.98);
}
.fancy-select-trigger:active {
  transform: scale(0.98);
}
.fancy-select-trigger:focus {
  outline: none;
}
.fancy-select-trigger:focus-visible {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(22, 119, 197, 0.14);
}
.fancy-select.is-active .fancy-select-trigger {
  border-color: rgba(22, 119, 197, 0.42);
  background: linear-gradient(180deg, #f0f7fc 0%, #e8f3fa 100%);
  color: #125e9e;
  font-weight: 600;
}
.fancy-select.is-active .fancy-select-chevron {
  color: var(--accent);
}
.fancy-select.is-open .fancy-select-trigger {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(22, 119, 197, 0.12);
}
.fancy-select.is-open .fancy-select-chevron {
  transform: rotate(180deg);
  color: var(--accent);
}
.fancy-select-menu {
  position: absolute;
  top: calc(100% + 0.4rem);
  left: 0;
  right: 0;
  z-index: 40;
  margin: 0;
  padding: 0.4rem;
  list-style: none;
  max-height: min(18rem, 55vh);
  overflow: auto;
  border-radius: 14px;
  border: 1px solid rgba(168, 196, 218, 0.95);
  background: rgba(255, 255, 255, 0.99);
  box-shadow:
    0 4px 8px rgba(15, 55, 95, 0.04),
    0 20px 40px rgba(15, 55, 95, 0.14);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px) scale(0.98);
  transform-origin: top center;
  transition:
    opacity 0.16s ease,
    transform 0.16s ease,
    visibility 0.16s ease;
  scrollbar-width: thin;
  scrollbar-color: #d0e0ec transparent;
  text-align: left;
}
.fancy-select.is-open .fancy-select-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.fancy-select-option {
  padding: 0.6rem 0.75rem;
  border-radius: 10px;
  font-size: 0.9rem;
  color: var(--ink);
  cursor: pointer;
  transition: all 0.2s ease;
  text-align: left;
}
.fancy-select-option:hover,
.fancy-select-option:focus {
  background: rgba(22, 119, 197, 0.09);
  color: #125e9e;
  outline: none;
}
.fancy-select-option.is-selected {
  background: rgba(22, 119, 197, 0.14);
  color: #125e9e;
  font-weight: 600;
  position: relative;
  padding-right: 1.85rem;
}
.fancy-select-option.is-selected::after {
  content: "";
  position: absolute;
  right: 0.75rem;
  top: 50%;
  width: 0.4rem;
  height: 0.7rem;
  border-right: 2px solid var(--accent);
  border-bottom: 2px solid var(--accent);
  transform: translateY(-60%) rotate(45deg);
}
.fancy-select-option.is-disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

@media (max-width: 1024px) {
  .catalog-filters__grid,
  .catalog-filters-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 768px) {
  .catalog-filters {
    padding: 1rem 0.9rem 1.05rem;
  }
  .catalog-filters__actions,
  .catalog-filters-search .toolbar-actions {
    width: 100%;
  }
  .catalog-filters__actions .btn,
  .catalog-filters-search .toolbar-actions .btn {
    flex: 1;
    min-height: 44px;
  }
  .catalog-filters__grid,
  .catalog-filters-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .catalog-filters__panel,
  .catalog-filters-panel {
    padding: 0.85rem;
  }
  .catalog-bar {
    align-items: stretch;
  }
  .catalog-pagesize {
    width: 100%;
    justify-content: space-between;
  }
  .catalog-pagesize .fancy-select {
    flex: 1 1 auto;
    max-width: 10rem;
  }
}

.field { display: flex; flex-direction: column; gap: 0.35rem; min-width: 120px; }
.field label { font-size: 0.8rem; color: var(--ink-soft); }
.field input, .field select, .field textarea {
  border: 1px solid var(--line);
  background: #fffdf9;
  border-radius: 12px;
  padding: 0.65rem 0.8rem;
  font: inherit;
  color: var(--ink);
}
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(22, 119, 197, 0.15);
}
.field textarea { min-height: 110px; resize: vertical; }

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1rem;
  padding-bottom: 1.25rem;
}

.product {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  padding: 1.15rem;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  transition: transform 0.2s ease, border-color 0.2s ease;
  animation: rise 0.55s ease both;
  min-height: 12.5rem;
}
.product:hover {
  transform: translateY(-4px);
  border-color: rgba(22, 119, 197, 0.4);
  box-shadow: var(--shadow-lg);
}
.product .meta {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.chip {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  background: #e8f3fb;
  color: var(--accent);
  border: 1px solid #c5dced;
  font-size: 0.75rem;
  font-weight: 600;
}
.chip.warm { background: #e7f0f8; color: var(--accent-2); border-color: #bfd4e8; }
.chip.chip-type-timeseries { background: #e4eef6; color: #2a5f86; border-color: #c5d9ea; }
.chip.chip-type-image { background: #e8efe4; color: #3d6b3a; border-color: #c9dbc4; }
.chip.chip-type-json_nlp { background: #efe8f4; color: #5a3d73; border-color: #d8c8e4; }
.chip.chip-type-api_stream { background: #f4ece4; color: #7a4e28; border-color: #e2d0bc; }
.chip.free {
  background: #e8f3fb;
  color: #125e9e;
  border-color: #b7cfe0;
}
.chip-warn {
  background: #e7f0f8;
  color: #0d5a9c;
  border-color: #bfd4e8;
}
.chip-muted {
  background: #eef3f8;
  color: var(--ink-soft);
  border-color: var(--line);
  font-weight: 500;
}
.product h2 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.25rem;
  line-height: 1.35;
}
.product p,
.product-desc {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.55;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.product-provider {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.4;
}
/* 各市场目录页共用标题区（技能市场定稿样式） */
.catalog-page-head {
  display: grid;
  gap: 1rem;
  padding: 2.4rem 0 1.25rem;
  animation: rise 0.7s ease both;
}
.catalog-page-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.88rem;
  color: var(--ink-soft);
}
.catalog-page-breadcrumb a {
  color: var(--ink-soft);
  text-decoration: none;
}
.catalog-page-breadcrumb a:hover {
  color: var(--accent);
  text-decoration: underline;
}
.catalog-page-breadcrumb__sep {
  opacity: 0.55;
}
.catalog-page-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
}
.catalog-page-title-row h1 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.85rem, 3.2vw, 2.55rem);
  line-height: 1.2;
  max-width: none;
}
.catalog-page-live {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.95rem;
  white-space: nowrap;
}
.catalog-page-live__dot {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: #22a06b;
  box-shadow: 0 0 0 3px rgba(34, 160, 107, 0.16);
}
.catalog-page-live strong {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  font-size: 1.05rem;
}
.catalog-page-desc {
  display: grid;
  gap: 0.35rem;
  max-width: 52rem;
}
.catalog-page-desc p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.6;
  font-size: 0.95rem;
}
.catalog-page-desc__guide {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-left: 0.15rem;
  font-weight: 600;
}
.catalog-page-desc__guide::before {
  content: "";
  width: 0.85rem;
  height: 0.85rem;
  background: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M6.5 3.5a.75.75 0 0 1 0-1.5h6a.75.75 0 0 1 .75.75v6a.75.75 0 0 1-1.5 0V4.56L4.28 12.03a.75.75 0 1 1-1.06-1.06L10.94 3.5H6.5z'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M6.5 3.5a.75.75 0 0 1 0-1.5h6a.75.75 0 0 1 .75.75v6a.75.75 0 0 1-1.5 0V4.56L4.28 12.03a.75.75 0 1 1-1.06-1.06L10.94 3.5H6.5z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.catalog-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}
.skill-catalog-toolbar {
  display: grid;
  grid-template-columns: minmax(12rem, 1.4fr) minmax(16rem, 1.6fr) auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.85rem;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow);
}
.skill-catalog-toolbar__search {
  margin: 0;
}
.skill-catalog-toolbar__filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
}
.skill-catalog-toolbar__filters .fancy-select-trigger {
  min-height: 44px;
  width: 100%;
}
.skill-catalog-toolbar__submit {
  min-height: 44px;
  white-space: nowrap;
}
.skill-catalog-chips {
  margin: 0;
}
.skill-catalog {
  padding-bottom: 2rem;
}
.skill-guide {
  display: grid;
  gap: 1.5rem;
  padding: 2.4rem 0 2.5rem;
}
.skill-guide__head h1 {
  margin: 0 0 0.5rem;
  font-family: var(--font-display);
  font-size: clamp(1.85rem, 3vw, 2.4rem);
}
.skill-guide__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.85rem;
}
.skill-guide__step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  padding: 1.1rem 1.2rem;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.9);
}
.skill-guide__step h2 {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
}
.skill-guide__step p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.55;
}
.skill-guide__index {
  font-family: var(--font-display);
  font-weight: 700;
  color: var(--accent);
}
.skill-guide__panel {
  padding: 1.25rem 1.35rem;
  border-radius: 18px;
  border: 1px solid rgba(150, 186, 214, 0.95);
  background: linear-gradient(165deg, #f0f7fc 0%, #ffffff 55%);
}
.skill-guide__panel h2 {
  margin: 0 0 0.4rem;
}
.skill-guide__panel > p {
  margin: 0 0 1rem;
  color: var(--ink-soft);
}
.skill-guide__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}
@media (max-width: 900px) {
  .skill-catalog-toolbar {
    grid-template-columns: 1fr;
  }
  .skill-catalog-toolbar__filters {
    grid-template-columns: 1fr;
  }
  .skill-catalog-toolbar__submit {
    width: 100%;
  }
}
.skill-catalog__grid {
  align-items: stretch;
}
.skill-card {
  min-height: 0;
}
.skill-card .meta {
  max-height: 4.5rem;
  overflow: hidden;
}
.skill-card .meta .chip {
  max-width: 11rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.skill-card .product-desc {
  -webkit-line-clamp: 3;
  min-height: 4.2em;
}
.skill-card .row .btn {
  width: 100%;
  justify-content: center;
}
.skill-share-form__note {
  margin-top: 0.25rem;
}
.skill-share-form__note p {
  margin: 0;
  line-height: 1.55;
}
.product .row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-top: auto;
}
.price {
  font-family: var(--font-display);
  font-size: 1.2rem;
}
.price.is-free { color: var(--accent); }
.price small { font-size: 0.75rem; color: var(--ink-soft); }

.pager {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  margin: 0.35rem 0 2.75rem;
  padding: 1rem 1.1rem 1.05rem;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.pager-inner {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  width: 100%;
  max-width: 36rem;
}
.pager-list {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.pager-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.4rem;
  height: 2.4rem;
  padding: 0 0.85rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fffdf9;
  color: var(--ink);
  font: inherit;
  font-size: 0.92rem;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.pager-btn:hover {
  color: var(--accent);
  border-color: #b7cfe0;
  background: #eef6f1;
  transform: translateY(-1px);
}
.pager-btn.is-current {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff;
  font-weight: 600;
  cursor: default;
  transform: none;
}
.pager-btn.is-current:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff;
}
.pager-btn.is-disabled {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
  transform: none;
}
.pager-prev,
.pager-next {
  min-width: 5.2rem;
  font-size: 0.88rem;
  font-weight: 500;
}
.pager-gap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.4rem;
  color: #8a949e;
  font-size: 0.95rem;
  line-height: 1;
}
.pager-meta {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
}
@media (max-width: 520px) {
  .pager-inner {
    flex-wrap: wrap;
    row-gap: 0.55rem;
  }
  .pager-list {
    order: -1;
    width: 100%;
  }
  .pager-prev,
  .pager-next {
    flex: 1 1 auto;
  }
}

.panel {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) + 4px);
  box-shadow: var(--shadow);
  padding: 1.5rem;
  margin: 1.5rem 0 3rem;
  animation: rise 0.55s ease both;
}
.panel h1, .panel h2 {
  font-family: var(--font-display);
  margin-top: 0;
}
.guide-block + .guide-block {
  margin-top: 1.75rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(176, 200, 220, 0.65);
}
.guide-block h2 {
  margin-bottom: 0.65rem;
  font-size: 1.25rem;
}
.guide-body {
  white-space: pre-wrap;
  line-height: 1.75;
  color: var(--ink);
  font-size: 0.98rem;
}
.split {
  display: grid;
  grid-template-columns: 1.4fr 0.9fr;
  gap: 1.25rem;
}
@media (max-width: 860px) {
  .split { grid-template-columns: 1fr; }
  .hero h1 { max-width: none; }
}

/* ?? ????????? ?? */
.product-hero {
  padding: 2rem 0 0.85rem;
  animation: rise 0.7s ease both;
}
.product-hero .meta {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
  margin-bottom: 0.65rem;
}
.product-hero h1 {
  margin: 0 0 0.5rem;
  max-width: none;
  width: 100%;
  text-align: left;
  font-family: var(--font-display);
  font-size: clamp(1.65rem, 3.2vw, 2.35rem);
  line-height: 1.35;
  overflow-wrap: break-word;
  text-wrap: pretty;
}
.product-hero-desc {
  margin: 0;
  max-width: 40rem;
  color: var(--ink-soft);
  font-size: 0.98rem;
  line-height: 1.65;
}
.product-layout {
  align-items: start;
  padding-bottom: 2.5rem;
  gap: 1.25rem;
  grid-template-columns: 1.55fr 0.85fr;
}
.product-modules {
  margin: 0;
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 28rem;
}
.module-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0.35rem;
  padding: 0.6rem 0.7rem;
  border-bottom: 1px solid rgba(176, 200, 220, 0.75);
  background:
    linear-gradient(180deg, #e4eef7 0%, #eef5fb 55%, #f7fafc 100%);
}
.module-tab {
  position: relative;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--ink-soft);
  font: inherit;
  font-size: 0.9rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  padding: 0.55rem 1.05rem;
  min-height: 44px;
  margin: 0;
  cursor: pointer;
  transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}
.module-tab::after {
  content: none;
}
.module-tab:hover {
  color: var(--ink);
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(176, 200, 220, 0.65);
}
.module-tab:active {
  transform: scale(0.98);
}
.module-tab:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  z-index: 1;
}
.module-tab.is-active {
  color: #fff;
  font-weight: 600;
  background: linear-gradient(160deg, var(--accent-2) 0%, var(--accent) 100%);
  border-color: transparent;
  box-shadow: 0 6px 16px rgba(13, 90, 156, 0.22);
  z-index: 1;
}
.module-tab.is-active::after {
  content: none;
}
.module-pages {
  flex: 1 1 auto;
  min-height: 16rem;
  padding: 1.35rem 1.4rem 1.1rem;
  background: var(--card);
}
.use-case-taxonomy {
  display: grid;
  gap: 0.55rem;
  margin-bottom: 0.35rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(176, 200, 220, 0.55);
}
.module-page { animation: rise 0.3s ease both; }
.module-page[hidden] { display: none !important; }
.module-page-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.module-page-head h2 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.2rem;
}
.module-page-index {
  flex-shrink: 0;
  font-size: 0.8rem;
  color: #8a949e;
  font-variant-numeric: tabular-nums;
}

.content-block { display: grid; gap: 0.55rem; }
.content-block.compact { gap: 0.35rem; }
.block-lead {
  margin: 0 0 0.35rem;
  color: var(--ink-soft);
  font-size: 0.95rem;
  line-height: 1.6;
}
.block-text {
  margin: 0;
  line-height: 1.65;
  font-size: 0.95rem;
  color: var(--ink);
}
.fact-row {
  display: grid;
  grid-template-columns: 1.6rem 1fr;
  gap: 0.55rem;
  align-items: start;
  padding: 0.65rem 0.8rem;
  border-radius: 12px;
  background: rgba(232, 241, 248, 0.72);
  border: 1px solid rgba(176, 200, 220, 0.55);
  line-height: 1.55;
  font-size: 0.95rem;
}
.fact-num {
  font-weight: 700;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
}
.fact-bullet {
  width: 6px;
  height: 6px;
  margin-top: 0.55rem;
  border-radius: 50%;
  background: var(--accent);
  justify-self: center;
}
.note-warn {
  margin: 0.35rem 0 0;
  padding: 0.75rem 0.9rem;
  border-radius: 12px;
  background: #fff4e8;
  border: 1px solid rgba(196, 120, 45, 0.28);
  color: #8a3f16;
  font-size: 0.9rem;
  line-height: 1.55;
}

.step-list {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}
.step-item {
  display: grid;
  grid-template-columns: 1.75rem 1fr;
  gap: 0.75rem;
  align-items: start;
  padding: 0.8rem 0.9rem;
  border: 1px solid rgba(176, 200, 220, 0.75);
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfe 100%);
  box-shadow: 0 4px 14px rgba(15, 70, 120, 0.04);
}
.step-num {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background: linear-gradient(160deg, var(--accent-2), var(--accent));
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.82rem;
  font-weight: 700;
}
.step-item strong {
  display: block;
  margin-bottom: 0.2rem;
  font-size: 0.95rem;
}
.step-item p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.55;
}
.step-item code,
.block-text code,
.fact-row code {
  font-size: 0.84em;
  padding: 0.08em 0.35em;
  border-radius: 6px;
  background: rgba(15, 55, 95, 0.06);
}

/* 详情页重点条：一眼看清交付要点 */
.key-points {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0 0 0.9rem;
}
.key-point {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 0.8rem;
  border-radius: 10px;
  border: 1px solid rgba(22, 119, 197, 0.28);
  background: linear-gradient(180deg, #f4f9fd 0%, #e8f3fb 100%);
  color: var(--accent-2);
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.3;
}
.key-point.is-accent {
  border-color: rgba(22, 119, 197, 0.45);
  background: linear-gradient(180deg, #e8f3fb 0%, #d7ebf8 100%);
}
.key-point.is-warn {
  border-color: rgba(196, 120, 45, 0.35);
  background: linear-gradient(180deg, #fff8f0 0%, #ffefdf 100%);
  color: #8a3f16;
}
.fact-meta {
  display: grid;
  gap: 0.45rem;
  margin: 0.15rem 0;
}
.fact-meta-item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.55rem;
  align-items: baseline;
  padding: 0.65rem 0.85rem;
  border-radius: 12px;
  border: 1px solid rgba(176, 200, 220, 0.7);
  background: linear-gradient(180deg, #ffffff 0%, #f5f9fc 100%);
  font-size: 0.92rem;
  line-height: 1.5;
}
.fact-meta-label {
  flex-shrink: 0;
  padding: 0.12rem 0.5rem;
  border-radius: 8px;
  background: rgba(22, 119, 197, 0.12);
  color: var(--accent-2);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.fact-meta-value {
  color: var(--ink);
  word-break: break-word;
}

.aside-note {
  margin-top: 1.1rem;
  padding: 0.95rem 1.05rem;
  border-radius: 14px;
  background: rgba(232, 241, 248, 0.75);
  border: 1px solid rgba(176, 200, 220, 0.75);
}
.aside-note h3 {
  margin: 0 0 0.55rem;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--accent-2);
}
.module-cta { margin: 1rem 0 0; }
.schema-code {
  max-height: 22rem;
  margin: 0;
}

.module-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 1.15rem 0.95rem;
  border-top: 1px solid rgba(176, 200, 220, 0.65);
  background: rgba(232, 241, 248, 0.55);
}
.module-pager-label {
  font-size: 0.85rem;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
}
.module-pager .btn {
  min-width: 5.5rem;
  padding: 0.5rem 0.95rem;
  font-size: 0.9rem;
}
.module-pager .btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  transform: none;
}
.product-aside { position: sticky; top: 4.5rem; }
.product-compliance {
  margin: 1rem 0 0;
  padding: 1.05rem 1.15rem;
}
.product-compliance h2 {
  font-size: 1.05rem;
  margin: 0 0 0.65rem;
}
.compliance-list {
  margin: 0;
  display: grid;
  gap: 0.55rem;
}
.compliance-list > div {
  display: grid;
  grid-template-columns: 3rem 1fr;
  gap: 0.5rem;
  font-size: 0.9rem;
  line-height: 1.45;
}
.compliance-list dt {
  margin: 0;
  color: #8a949e;
  font-weight: 500;
}
.compliance-list dd {
  margin: 0;
  color: var(--ink-soft);
  word-break: break-word;
}
@media (max-width: 860px) {
  .product-layout { grid-template-columns: 1fr; }
  .product-modules { min-height: 0; }
  .product-aside { position: static; }
  .module-tabs {
    gap: 0.3rem;
    padding: 0.5rem;
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  .module-tab {
    flex: 0 0 auto;
    padding: 0.5rem 0.9rem;
    font-size: 0.85rem;
    min-height: 44px;
  }
  .module-pages {
    min-height: 0;
    padding: 1.1rem 1rem 0.9rem;
  }
}

.side-box {
  padding: 1.15rem;
  border-radius: 12px;
  background:
    radial-gradient(280px 160px at 100% 0%, rgba(94, 176, 232, 0.35) 0%, transparent 60%),
    linear-gradient(160deg, #0d5a9c 0%, #1677c5 100%);
  color: #ffffff;
  box-shadow: 0 14px 32px rgba(13, 90, 156, 0.22);
}
.side-box .price { font-size: 1.8rem; }
.side-box .muted { color: rgba(240, 248, 255, 0.75); font-size: 0.9rem; }
.side-actions { display: grid; gap: 0.6rem; margin-top: 1rem; }
.side-actions .btn { width: 100%; }
.product-buy-form {
  display: grid;
  gap: 0.65rem;
}
.product-buy-form__field {
  display: grid;
  gap: 0.3rem;
  text-align: left;
}
.product-buy-form__field label {
  font-size: 0.82rem;
  color: rgba(240, 248, 255, 0.88);
}
.product-buy-form__field .req { color: #ffd7a8; }
.product-buy-form__field select {
  min-height: 44px;
  width: 100%;
  padding: 0.45rem 0.65rem;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  font: inherit;
  font-size: 0.9rem;
}
.product-buy-form__field select:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}
.product-buy-form__field select option {
  color: #0f1f33;
  background: #ffffff;
}
/* 购买侧栏：自定义下拉（深蓝底） */
.product-buy-form__field .fancy-select-trigger {
  border-color: rgba(255, 255, 255, 0.42);
  background: rgba(8, 48, 88, 0.35);
  color: #ffffff;
  box-shadow: none;
}
.product-buy-form__field .fancy-select-trigger:hover {
  background: rgba(8, 48, 88, 0.48);
  border-color: rgba(255, 255, 255, 0.55);
}
.product-buy-form__field .fancy-select-trigger:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}
.product-buy-form__field .fancy-select.is-open .fancy-select-trigger {
  border-color: rgba(255, 255, 255, 0.7);
  background: rgba(8, 48, 88, 0.55);
}
.product-buy-form__field .fancy-select.is-placeholder .fancy-select-value {
  color: rgba(240, 248, 255, 0.72);
}
.product-buy-form__field .fancy-select-chevron {
  color: rgba(255, 255, 255, 0.85);
}
.product-buy-form__field .fancy-select-menu {
  border: 1px solid rgba(176, 200, 220, 0.95);
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(8, 40, 72, 0.28);
}
.product-buy-form__field .fancy-select-option {
  color: var(--ink);
}
.product-buy-form__error {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.4;
  color: #ffe0a8;
}
.product-buy-form__error[hidden] {
  display: none;
}
.product-buy-form__field.is-invalid .fancy-select-trigger,
.product-buy-form__field.is-invalid select {
  border-color: #ffd7a8;
}
.side-hint {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.5;
  color: rgba(240, 248, 255, 0.72);
}
.side-hint code {
  font-size: 0.78rem;
  word-break: break-all;
}
.side-box .btn-primary { background: #ffffff; color: #0f1f33; }
.side-box .btn-ghost { border-color: rgba(244,255,249,0.35); color: #ffffff; }

.flash {
  margin: 1rem 0 0;
  padding: 0.85rem 1rem;
  border-radius: 10px;
  background: #e8f3fb;
  color: var(--accent-2);
  border: 1px solid #c5dced;
}
.flash.error {
  background: #f8e8e8;
  color: var(--danger);
  border-color: #e8c4c4;
}

.table {
  width: 100%;
  border-collapse: collapse;
}
.table th, .table td {
  text-align: left;
  padding: 0.75rem 0.4rem;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
  font-size: 0.95rem;
}
.table .col-actions {
  text-align: right;
  white-space: nowrap;
  width: 1%;
}
.table-wrap { overflow-x: auto; }
.order-product-cell {
  display: grid;
  gap: 0.2rem;
}
.order-product-cell a {
  color: inherit;
  text-decoration: none;
}
.order-product-cell a:hover { color: var(--accent); }
.order-id {
  font-size: 0.78rem;
  word-break: break-all;
}
.order-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: flex-end;
}
.order-lifecycle {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.82rem;
  background: var(--accent-soft);
  color: var(--accent-2);
}
.order-lifecycle--completed { background: rgba(26, 155, 110, 0.12); color: var(--ok); }
.order-lifecycle--disputed { background: rgba(196, 61, 61, 0.12); color: var(--danger); }
.order-lifecycle--cancelled { background: rgba(90, 111, 132, 0.12); color: var(--ink-soft); }
.orders-page .hero h1 {
  max-width: none;
}
.orders-filters {
  margin: 0 0 1rem;
}
.orders-filters .catalog-filters-search {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: end;
}
.orders-filters .field {
  min-width: 9rem;
}
.orders-filters .field.grow {
  flex: 1 1 14rem;
  min-width: 12rem;
}
.orders-result-meta {
  margin: 0 0 0.85rem;
  font-size: 0.9rem;
}

.demands-filters .catalog-filters-search {
  align-items: flex-end;
}
.demands-filters__facet {
  flex: 0 1 11.5rem;
  min-width: 10rem;
}
.demands-filters__facet--type {
  flex: 0 1 13.5rem;
  min-width: 11.5rem;
}
.demands-filters .toolbar-actions {
  align-self: flex-end;
  padding-bottom: 1px;
}

/* 筛选条内 Fancy Select：更精致的触发器与下拉层 */
.catalog-filters .fancy-select-trigger {
  min-height: 48px;
  padding: 0.7rem 0.75rem 0.7rem 0.95rem;
  border-radius: 14px;
  border: 1px solid rgba(168, 196, 218, 0.95);
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfe 100%);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 1px 2px rgba(15, 55, 95, 0.04);
  font-size: 0.92rem;
}
.catalog-filters .fancy-select-trigger:hover {
  border-color: #8eacc4;
  background: #ffffff;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 4px 12px rgba(15, 55, 95, 0.06);
  filter: none;
}
.catalog-filters .fancy-select-trigger:focus-visible {
  border-color: var(--accent);
  box-shadow: 0 0 0 4px rgba(22, 119, 197, 0.12);
}
.catalog-filters .fancy-select.is-placeholder .fancy-select-value {
  color: #7a8792;
  font-weight: 500;
}
.catalog-filters .fancy-select.is-active .fancy-select-trigger {
  border-color: rgba(22, 119, 197, 0.45);
  background: linear-gradient(180deg, #f3f9fd 0%, #e7f2fa 100%);
  color: #125e9e;
  font-weight: 600;
}
.catalog-filters .fancy-select.is-open .fancy-select-trigger {
  border-color: var(--accent);
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(22, 119, 197, 0.12);
}
.catalog-filters .fancy-select-chevron {
  width: 16px;
  height: 16px;
  color: #6f7f8c;
}
.catalog-filters .fancy-select-menu {
  z-index: 80;
  padding: 0.45rem;
  border-radius: 16px;
  border: 1px solid rgba(160, 190, 214, 0.95);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(248, 252, 255, 0.99) 100%);
  box-shadow:
    0 8px 16px rgba(15, 55, 95, 0.06),
    0 24px 48px rgba(15, 55, 95, 0.16);
}
.catalog-filters .fancy-select-option {
  padding: 0.68rem 0.85rem;
  border-radius: 11px;
  font-size: 0.92rem;
  letter-spacing: 0.01em;
}
.catalog-filters .fancy-select-option:hover,
.catalog-filters .fancy-select-option:focus {
  background: linear-gradient(90deg, rgba(22, 119, 197, 0.1) 0%, rgba(22, 119, 197, 0.05) 100%);
  color: #0f5f9e;
}
.catalog-filters .fancy-select-option.is-selected {
  background: linear-gradient(90deg, rgba(22, 119, 197, 0.16) 0%, rgba(22, 119, 197, 0.08) 100%);
  color: #0f5f9e;
}

.form-grid .fancy-select-trigger {
  min-height: 44px;
  border-radius: 12px;
}
.form-grid .fancy-select-menu {
  z-index: 60;
}

.order-dispute { position: relative; }
.order-dispute > summary {
  list-style: none;
  cursor: pointer;
}
.order-dispute > summary::-webkit-details-marker { display: none; }
.order-dispute__form {
  position: absolute;
  right: 0;
  z-index: 5;
  display: grid;
  gap: 0.45rem;
  min-width: 220px;
  margin-top: 0.35rem;
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: var(--shadow);
}
.order-dispute__form textarea {
  width: 100%;
  resize: vertical;
  font: inherit;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.trade-certificate__meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem 1.5rem;
  margin: 0 0 1.25rem;
}
.trade-certificate__meta dt {
  margin: 0;
  font-size: 0.82rem;
  color: var(--ink-soft);
}
.trade-certificate__meta dd {
  margin: 0.2rem 0 0;
  word-break: break-all;
}
.integration-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 1rem;
}
.integrations-hero {
  margin-bottom: 1.35rem;
}
.integrations-hero h1 {
  max-width: none;
  width: 100%;
  text-align: left;
  line-height: 1.25;
  overflow-wrap: break-word;
  text-wrap: pretty;
}
.integrations-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1.1rem;
}

.apps-market-hero {
  margin-bottom: 1.35rem;
}
.apps-market-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1.1rem;
}
.apps-catalog {
  margin-bottom: 2rem;
}
.integrations-hero__stats {
  display: grid;
  gap: 0.75rem;
  min-width: min(15rem, 100%);
}
.integrations-stat {
  display: grid;
  gap: 0.15rem;
  padding: 0.95rem 1.05rem;
  border-radius: 14px;
  border: 1px solid rgba(176, 200, 220, 0.75);
  background:
    radial-gradient(180px 100px at 100% 0%, rgba(94, 176, 232, 0.22) 0%, transparent 65%),
    #ffffff;
  box-shadow: 0 6px 18px rgba(15, 70, 120, 0.05);
}
.integrations-stat strong {
  font-size: 1.35rem;
  line-height: 1.2;
  color: var(--accent-2);
}
.integrations-stat span {
  font-size: 0.84rem;
  color: var(--ink-soft);
}

.integrations-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
  margin: 0 0 1.75rem;
}
.integrations-point {
  display: grid;
  gap: 0.4rem;
  padding: 1.05rem 1.1rem;
  border: 1px solid rgba(176, 200, 220, 0.8);
  border-radius: 14px;
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.98) 0%, #f4f9fd 100%);
  box-shadow: 0 8px 22px rgba(15, 70, 120, 0.05);
  transition: all 0.2s ease;
}
.integrations-point:hover {
  border-color: rgba(22, 119, 197, 0.35);
  transform: translateY(-2px);
}
.integrations-point strong {
  font-size: 1.02rem;
  color: var(--ink);
}
.integrations-point p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.55;
}

.integrations-list-section {
  margin-bottom: 1.75rem;
}
.integrations-catalog {
  margin-bottom: 1.75rem;
}
.integrations-catalog .integration-list {
  display: grid;
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.integrations-section-head {
  margin: 0 0 1rem;
}
.integrations-section-head h2 {
  margin: 0 0 0.35rem;
  font-size: 1.25rem;
}
.integrations-section-head p {
  margin: 0;
}

.integration-card {
  display: grid;
  gap: 1rem;
  padding: 1.2rem 1.25rem;
  border: 1px solid rgba(176, 200, 220, 0.8);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(15, 70, 120, 0.05);
  transition: all 0.2s ease;
}
.integration-card:hover {
  border-color: rgba(22, 119, 197, 0.35);
  box-shadow: 0 14px 32px rgba(15, 70, 120, 0.08);
}
.integration-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.85rem 1rem;
}
.integration-card__identity {
  flex: 1 1 auto;
  min-width: 0;
}
.integration-card__title {
  margin: 0 0 0.4rem;
  font-size: 1.12rem;
  line-height: 1.35;
  overflow-wrap: break-word;
}
.integration-card__desc {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.95rem;
  line-height: 1.6;
}
.integration-card__mode {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  border: 1px solid rgba(22, 119, 197, 0.28);
  background:
    linear-gradient(135deg, rgba(232, 243, 251, 0.95) 0%, rgba(220, 236, 248, 0.98) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 4px 12px rgba(22, 119, 197, 0.08);
  color: var(--accent-2);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  line-height: 1;
  white-space: nowrap;
}
.integration-card__mode--native {
  border-color: rgba(26, 155, 110, 0.28);
  background:
    linear-gradient(135deg, rgba(232, 248, 240, 0.95) 0%, rgba(220, 242, 232, 0.98) 100%);
  color: #0f7a52;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 4px 12px rgba(26, 155, 110, 0.08);
}
.integration-card__mode--webhook {
  border-color: rgba(180, 120, 40, 0.3);
  background:
    linear-gradient(135deg, rgba(255, 247, 234, 0.95) 0%, rgba(255, 240, 220, 0.98) 100%);
  color: #9a5b12;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 4px 12px rgba(180, 120, 40, 0.08);
}
.integration-card__guide {
  display: grid;
  gap: 0.4rem;
}
.integration-card__label {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--ink-soft);
  letter-spacing: 0.02em;
}
.integration-card__steps {
  margin: 0;
  padding: 0.85rem 0.95rem;
  border-radius: 12px;
  border: 1px solid #d7e5f0;
  background: #f5f9fc;
  white-space: pre-wrap;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.86rem;
  line-height: 1.55;
  color: var(--ink);
  overflow: auto;
}
.integration-card__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}
.integration-card__slug {
  font-size: 0.78rem;
  color: var(--ink-soft);
}
.integrations-empty {
  text-align: center;
  padding: 2rem 1.25rem;
}
.integrations-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  margin: 0 0 2rem;
  padding: 0.95rem 1.15rem;
}
.integrations-links a {
  color: var(--accent-2);
  text-decoration: underline;
  text-underline-offset: 0.12em;
  transition: all 0.2s ease;
}
.integrations-links a:hover {
  color: var(--accent);
}

@media (max-width: 1024px) {
  .integrations-points {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .integrations-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }
  .integrations-stat {
    text-align: center;
  }
}

/* 兼容旧类名（若其它页引用） */
.integration-list__item {
  padding: 1rem 1.15rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
}
.integration-list__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.5rem;
}
.integration-list__head h2 {
  margin: 0;
  font-size: 1.1rem;
}
.integration-list__guide {
  margin: 0.75rem 0 0;
  padding: 0.75rem 0.9rem;
  white-space: pre-wrap;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.85rem;
  background: var(--paper-2);
  border-radius: 8px;
  overflow: auto;
}
.asset-market-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.asset-market-steps__item {
  display: grid;
  gap: 0.4rem;
  align-content: start;
  padding: 1.05rem 1.1rem;
  border: 1px solid rgba(176, 200, 220, 0.8);
  border-radius: 14px;
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.98) 0%, #f4f9fd 100%);
  box-shadow: 0 8px 22px rgba(15, 70, 120, 0.05);
  transition: all 0.2s ease;
}
.asset-market-steps__item:hover {
  border-color: rgba(22, 119, 197, 0.35);
  transform: translateY(-2px);
}
.asset-market-steps__index {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--accent);
}
.asset-market-steps__item strong {
  font-size: 1.05rem;
  line-height: 1.3;
}
.asset-market-steps__item span {
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.55;
}

.asset-market-hero {
  margin-bottom: 1.5rem;
}
.asset-market-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1.1rem;
}
.asset-market-hero__stats {
  display: grid;
  gap: 0.75rem;
  min-width: min(16rem, 100%);
}
.asset-market-stat {
  display: grid;
  gap: 0.15rem;
  padding: 0.95rem 1.05rem;
  border-radius: 14px;
  border: 1px solid rgba(176, 200, 220, 0.75);
  background:
    radial-gradient(180px 100px at 100% 0%, rgba(94, 176, 232, 0.22) 0%, transparent 65%),
    #ffffff;
  box-shadow: 0 6px 18px rgba(15, 70, 120, 0.05);
}
.asset-market-stat strong {
  font-size: 1.55rem;
  line-height: 1.15;
  color: var(--accent-2);
}
.asset-market-stat span {
  font-size: 0.84rem;
  color: var(--ink-soft);
}

.asset-market-flow,
.asset-market-list-section {
  margin-bottom: 1.75rem;
}
.asset-market-section-head {
  margin: 0 0 1rem;
}
.asset-market-section-head h2 {
  margin: 0 0 0.35rem;
  font-size: 1.25rem;
}
.asset-market-section-head p {
  margin: 0;
}
.asset-market-section-head--row {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 0.75rem 1rem;
}
.asset-market-pagesize {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 10rem;
  padding: 0.35rem 0.45rem 0.35rem 0.75rem;
  border: 1px solid rgba(176, 200, 220, 0.85);
  border-radius: 999px;
  background:
    linear-gradient(180deg, #ffffff 0%, #f5f9fc 100%);
  box-shadow: 0 4px 14px rgba(15, 70, 120, 0.05);
}
.asset-market-pagesize label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--ink-soft);
  white-space: nowrap;
}
.asset-market-pagesize select,
.asset-market-pagesize .fancy-select {
  min-width: 6.5rem;
}
.asset-market-pagesize .fancy-select-trigger {
  min-height: 2.15rem;
  padding: 0.35rem 0.55rem 0.35rem 0.7rem;
  border: none;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--accent-2);
}
.asset-market-pagesize .fancy-select-trigger:hover {
  background: rgba(22, 119, 197, 0.08);
}
.asset-market-pagesize .fancy-select.is-open .fancy-select-trigger {
  background: rgba(22, 119, 197, 0.12);
}
.asset-market-pagesize .fancy-select-chevron {
  color: var(--accent);
}
.asset-market-pager {
  margin-top: 1.25rem;
}

.asset-market-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.asset-card {
  display: grid;
  gap: 0.95rem;
  padding: 1.15rem 1.2rem;
  border: 1px solid rgba(176, 200, 220, 0.8);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(15, 70, 120, 0.05);
  transition: all 0.2s ease;
}
.asset-card:hover {
  border-color: rgba(22, 119, 197, 0.35);
  box-shadow: 0 14px 32px rgba(15, 70, 120, 0.08);
}
.asset-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.85rem;
}
.asset-card__identity {
  flex: 1 1 auto;
  min-width: 0;
}
.asset-card__title {
  margin: 0 0 0.3rem;
  font-size: 1.08rem;
  line-height: 1.35;
  overflow-wrap: break-word;
}
.asset-card__provider {
  margin: 0;
  font-size: 0.88rem;
}
.asset-card__status {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.4rem;
  max-width: none;
  padding: 0.35rem 0.75rem 0.35rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(26, 155, 110, 0.28);
  background:
    linear-gradient(135deg, rgba(232, 248, 240, 0.95) 0%, rgba(220, 242, 232, 0.98) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 4px 12px rgba(26, 155, 110, 0.08);
  color: #0f7a52;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1;
  white-space: nowrap;
}
.asset-card__status-dot {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  background: #1a9b6e;
  box-shadow: 0 0 0 3px rgba(26, 155, 110, 0.18);
  flex-shrink: 0;
}
.asset-card__meta {
  display: grid;
  gap: 0.65rem;
  margin: 0;
  padding: 0.8rem 0.9rem;
  border-radius: 12px;
  background: #f5f9fc;
  border: 1px solid #d7e5f0;
}
.asset-card__meta div {
  display: grid;
  gap: 0.2rem;
}
.asset-card__meta dt {
  font-size: 0.78rem;
  color: var(--ink-soft);
}
.asset-card__meta dd {
  margin: 0;
  line-height: 1.5;
  overflow-wrap: break-word;
}
.asset-card__block {
  display: grid;
  gap: 0.35rem;
}
.asset-card__label {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--ink-soft);
  letter-spacing: 0.02em;
}
.asset-card__listings {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.3rem;
}
.asset-card__listings a {
  color: var(--accent-2);
  text-decoration: underline;
  text-underline-offset: 0.12em;
  transition: all 0.2s ease;
}
.asset-card__listings a:hover {
  color: var(--accent);
}
.asset-card__disclosure {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: break-word;
}
.asset-card__block > .muted,
.asset-card__meta .muted {
  margin: 0;
}

.asset-market-empty {
  text-align: center;
  padding: 2rem 1.25rem;
}
.asset-market-empty__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.65rem;
  margin-top: 1rem;
}

.asset-market-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  margin: 0 0 2rem;
  padding: 0.95rem 1.15rem;
}
.asset-market-links a {
  color: var(--accent-2);
  text-decoration: underline;
  text-underline-offset: 0.12em;
  transition: all 0.2s ease;
}
.asset-market-links a:hover {
  color: var(--accent);
}

@media (max-width: 1024px) {
  .asset-market-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 768px) {
  .asset-market-steps,
  .asset-market-grid {
    grid-template-columns: 1fr;
  }
  .asset-market-hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }
  .asset-market-stat {
    text-align: center;
  }
}
.inline-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.25rem;
}
.panel-title {
  margin: 0 0 0.85rem;
  font-size: 1.15rem;
}
.catalog-simple-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.85rem;
}
.catalog-simple-list li {
  display: grid;
  gap: 0.2rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--line);
}
.catalog-simple-list li:last-child { border-bottom: none; padding-bottom: 0; }

/* —— 专区落地页 —— */
.zone-hero {
  align-items: end;
}
.zone-hero h1 {
  max-width: none;
  white-space: nowrap;
}
.zone-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 1.1rem;
}
.zone-hero__stat {
  display: grid;
  gap: 0.2rem;
  min-width: 7.5rem;
  padding: 0.95rem 1.15rem;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  text-align: right;
}
.zone-hero__stat strong {
  font-family: var(--font-display);
  font-size: 1.85rem;
  line-height: 1;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
}
.zone-hero__stat span {
  color: var(--ink-soft);
  font-size: 0.82rem;
}
.zone-catalog {
  margin: 0.5rem 0 2rem;
}
.zone-product-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.95rem;
}
.zone-product-card {
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(176, 200, 220, 0.55);
  box-shadow: var(--shadow);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.zone-product-card:hover {
  transform: translateY(-2px);
  border-color: rgba(22, 119, 197, 0.35);
  box-shadow: var(--shadow-lg);
}
.zone-product-card__link {
  display: grid;
  gap: 0.55rem;
  height: 100%;
  padding: 1.05rem 1.1rem 1.1rem;
  color: inherit;
  text-decoration: none;
}
.zone-product-card__link:hover {
  color: inherit;
}
.zone-product-card__head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.zone-product-card__type,
.zone-product-card__badge {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.5rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 650;
}
.zone-product-card__type {
  background: #eef5fb;
  color: var(--accent-2);
  border: 1px solid rgba(22, 119, 197, 0.18);
}
.zone-product-card__badge {
  background: rgba(26, 155, 110, 0.12);
  color: #0f7a52;
  border: 1px solid rgba(26, 155, 110, 0.2);
}
.zone-product-card h2 {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.4;
  font-family: var(--font-display);
}
.zone-product-card p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.6;
}
.zone-product-card__foot {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.75rem;
  padding-top: 0.35rem;
  border-top: 1px solid rgba(176, 200, 220, 0.45);
  color: var(--ink-soft);
  font-size: 0.78rem;
}
.zone-product-card__source {
  color: var(--ink);
  opacity: 0.75;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 960px) {
  .zone-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .zone-hero h1 {
    white-space: normal;
  }
}
@media (max-width: 640px) {
  .zone-product-grid {
    grid-template-columns: 1fr;
  }
}

.ecosystem-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
}
.ecosystem-grid article {
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
}
.ecosystem-grid h2 { margin: 0 0 0.4rem; font-size: 1.05rem; }
.ecosystem-grid p { margin: 0; color: var(--ink-soft); }
.merchant-category-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.45rem 1rem;
}
.merchant-category-list code {
  margin-right: 0.35rem;
  font-size: 0.8rem;
}

.ecosystem-hero {
  margin-bottom: 2rem;
}
.ecosystem-hero h1 {
  max-width: none;
  width: 100%;
  text-align: left;
  line-height: 1.25;
  overflow-wrap: normal;
  word-break: keep-all;
  text-wrap: pretty;
}
.ecosystem-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1.1rem;
}
.ecosystem-hero__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  min-width: min(18rem, 100%);
}
.ecosystem-stat {
  display: grid;
  gap: 0.15rem;
  padding: 0.95rem 1.05rem;
  border-radius: 14px;
  border: 1px solid rgba(176, 200, 220, 0.75);
  background:
    radial-gradient(180px 100px at 100% 0%, rgba(94, 176, 232, 0.22) 0%, transparent 65%),
    #ffffff;
  box-shadow: 0 6px 18px rgba(15, 70, 120, 0.05);
}
.ecosystem-stat strong {
  font-size: 1.35rem;
  line-height: 1.2;
  color: var(--accent-2);
}
.ecosystem-stat span {
  font-size: 0.84rem;
  color: var(--ink-soft);
}

.ecosystem-section-head {
  margin: 0 0 1.15rem;
}
.ecosystem-section-head__eyebrow {
  margin: 0 0 0.35rem;
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.ecosystem-section-head h2 {
  margin: 0 0 0.35rem;
  font-size: 1.35rem;
}
.ecosystem-section-head p {
  margin: 0;
}
.ecosystem-section-head--row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.85rem 1rem;
}

.ecosystem-benefits,
.ecosystem-journey,
.ecosystem-categories,
.ecosystem-partners {
  margin-bottom: 2.35rem;
}

/* 权益：色调分层的特色磁贴，非统一白框 */
.ecosystem-benefit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.ecosystem-benefit-card {
  position: relative;
  display: grid;
  gap: 0.65rem;
  align-content: start;
  min-height: 15.5rem;
  padding: 1.25rem 1.2rem 1.3rem;
  overflow: hidden;
  border: 0;
  border-radius: 20px;
  color: var(--ink);
  box-shadow: 0 14px 36px rgba(15, 55, 95, 0.08);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.ecosystem-benefit-card::after {
  content: "";
  position: absolute;
  right: -1.5rem;
  bottom: -1.5rem;
  width: 7rem;
  height: 7rem;
  border-radius: 50%;
  opacity: 0.35;
  pointer-events: none;
}
.ecosystem-benefit-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 42px rgba(15, 55, 95, 0.12);
}
.ecosystem-benefit-card--1 {
  background:
    linear-gradient(155deg, #1677c5 0%, #0f5f9e 55%, #0b4d82 100%);
  color: #fff;
}
.ecosystem-benefit-card--1::after {
  background: rgba(255, 255, 255, 0.18);
}
.ecosystem-benefit-card--2 {
  background:
    linear-gradient(165deg, #ffffff 0%, #eef6fc 100%);
  border: 1px solid rgba(22, 119, 197, 0.18);
}
.ecosystem-benefit-card--2::after {
  background: rgba(22, 119, 197, 0.12);
}
.ecosystem-benefit-card--3 {
  background:
    linear-gradient(165deg, #f4fbf8 0%, #e6f5ee 100%);
  border: 1px solid rgba(26, 155, 110, 0.2);
}
.ecosystem-benefit-card--3::after {
  background: rgba(26, 155, 110, 0.14);
}
.ecosystem-benefit-card--4 {
  background:
    linear-gradient(165deg, #fffaf3 0%, #fff1df 100%);
  border: 1px solid rgba(180, 120, 40, 0.22);
}
.ecosystem-benefit-card--4::after {
  background: rgba(180, 120, 40, 0.14);
}
.ecosystem-benefit-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.ecosystem-benefit-card__icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.55) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}
.ecosystem-benefit-card__glyph {
  width: 1.3rem;
  height: 1.3rem;
  display: block;
}
.ecosystem-benefit-card--1 .ecosystem-benefit-card__icon {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}
.ecosystem-benefit-card--2 .ecosystem-benefit-card__icon {
  background: rgba(22, 119, 197, 0.14);
  color: #125e9e;
}
.ecosystem-benefit-card--3 .ecosystem-benefit-card__icon {
  background: rgba(26, 155, 110, 0.16);
  color: #0f7a52;
}
.ecosystem-benefit-card--4 .ecosystem-benefit-card__icon {
  background: rgba(180, 120, 40, 0.16);
  color: #9a5b12;
}
.ecosystem-benefit-card__index {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  opacity: 0.8;
}
.ecosystem-benefit-card h3 {
  margin: 0;
  font-size: 1.12rem;
}
.ecosystem-benefit-card p {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.55;
  opacity: 0.88;
}
.ecosystem-benefit-card--2 p,
.ecosystem-benefit-card--3 p,
.ecosystem-benefit-card--4 p {
  color: var(--ink-soft);
  opacity: 1;
}
.ecosystem-benefit-card__link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.9rem;
  font-weight: 650;
  color: inherit;
  text-decoration: none;
}
.ecosystem-benefit-card--1 .ecosystem-benefit-card__link {
  color: #fff;
}
.ecosystem-benefit-card--2 .ecosystem-benefit-card__link {
  color: #125e9e;
}
.ecosystem-benefit-card--3 .ecosystem-benefit-card__link {
  color: #0f7a52;
}
.ecosystem-benefit-card--4 .ecosystem-benefit-card__link {
  color: #9a5b12;
}

/* 入驻路径：时间线，而非卡片网格 */
.ecosystem-journey {
  padding: 1.5rem 1.4rem 1.55rem;
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(15, 55, 95, 0.04) 0%, rgba(15, 55, 95, 0.015) 100%);
  border: 1px solid rgba(176, 200, 220, 0.55);
}
.ecosystem-timeline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0.35rem 0 0;
  padding: 0;
  list-style: none;
}
.ecosystem-timeline__item {
  position: relative;
  display: grid;
  gap: 0.85rem;
  padding: 0 0.85rem 0 0;
}
.ecosystem-timeline__item:not(:last-child) .ecosystem-timeline__rail::after {
  content: "";
  position: absolute;
  top: 1.15rem;
  left: 2.4rem;
  right: -0.85rem;
  height: 2px;
  background: linear-gradient(90deg, rgba(22, 119, 197, 0.55), rgba(22, 119, 197, 0.12));
}
.ecosystem-timeline__rail {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 2.4rem;
}
.ecosystem-timeline__dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 999px;
  border: 2px solid rgba(22, 119, 197, 0.35);
  background: #fff;
  color: #125e9e;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  box-shadow: 0 6px 16px rgba(22, 119, 197, 0.12);
  z-index: 1;
}
.ecosystem-timeline__body {
  display: grid;
  gap: 0.35rem;
}
.ecosystem-timeline__body strong {
  font-size: 1.05rem;
}
.ecosystem-timeline__body span {
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.55;
}

/* 分类：目录式左侧色轨 + 标签芯片 */
.ecosystem-categories {
  padding: 0;
}
.ecosystem-category-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.95rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ecosystem-category-card {
  display: grid;
  gap: 0.7rem;
  padding: 1.2rem 1.25rem 1.25rem 1.15rem;
  border-radius: 18px;
  border: 1px solid rgba(176, 200, 220, 0.7);
  border-left-width: 4px;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 252, 255, 0.96) 100%);
  box-shadow: 0 10px 28px rgba(15, 70, 120, 0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ecosystem-category-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(15, 70, 120, 0.09);
}
.ecosystem-category-card--0 { border-left-color: #1677c5; }
.ecosystem-category-card--1 { border-left-color: #1a9b6e; }
.ecosystem-category-card--2 { border-left-color: #b87828; }
.ecosystem-category-card--3 { border-left-color: #5b6fd6; }
.ecosystem-category-card--4 { border-left-color: #0f8ca8; }
.ecosystem-category-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}
.ecosystem-category-card__key {
  display: inline-block;
  margin-bottom: 0.3rem;
  color: #7a8792;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.72rem;
  letter-spacing: 0.02em;
}
.ecosystem-category-card__head h3 {
  margin: 0;
  font-size: 1.08rem;
  line-height: 1.35;
}
.ecosystem-category-card__count {
  flex: 0 0 auto;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: rgba(15, 55, 95, 0.06);
  color: #3d4d5c;
  font-size: 0.78rem;
  font-weight: 650;
  white-space: nowrap;
}
.ecosystem-category-card__summary {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.93rem;
  line-height: 1.6;
}
.ecosystem-category-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ecosystem-category-card__tags li {
  padding: 0.28rem 0.6rem;
  border-radius: 999px;
  background: rgba(22, 119, 197, 0.08);
  color: #125e9e;
  font-size: 0.78rem;
  font-weight: 560;
}

/* 伙伴：头像条风格，区别于分类卡 */
.ecosystem-partners {
  padding: 1.4rem 1.35rem 1.5rem;
  border-radius: 22px;
  background: #0f2f4d;
  color: #e8eef5;
}
.ecosystem-partners .ecosystem-section-head__eyebrow {
  color: #7eb7e4;
}
.ecosystem-partners .ecosystem-section-head h2 {
  color: #ffffff;
}
.ecosystem-partners .ecosystem-section-head .muted {
  color: #a8b7c7;
}
.ecosystem-partner-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ecosystem-partner-card a {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.9rem 1rem;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.05);
  text-decoration: none;
  color: inherit;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.ecosystem-partner-card a:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(126, 183, 228, 0.45);
  transform: translateY(-1px);
}
.ecosystem-partner-card__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 12px;
  background: linear-gradient(145deg, #2a6fad 0%, #1a4f7e 100%);
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  flex: 0 0 auto;
}
.ecosystem-partner-card__copy {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}
.ecosystem-partner-card__copy strong {
  font-size: 0.95rem;
  line-height: 1.35;
  overflow-wrap: break-word;
}
.ecosystem-partner-card__copy span {
  color: #9db0c3;
  font-size: 0.8rem;
}

.ecosystem-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 0.75rem;
  margin-bottom: 2rem;
  padding: 1rem 1.1rem;
  border-radius: 16px;
  border: 1px dashed rgba(176, 200, 220, 0.9);
  background: rgba(255, 255, 255, 0.7);
}
.ecosystem-links a {
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  background: rgba(22, 119, 197, 0.08);
  color: #125e9e;
  font-size: 0.88rem;
  font-weight: 560;
  text-decoration: none;
}
.ecosystem-links a:hover {
  background: rgba(22, 119, 197, 0.14);
}

@media (max-width: 1024px) {
  .ecosystem-benefit-grid,
  .ecosystem-timeline,
  .ecosystem-partner-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .ecosystem-timeline__item:nth-child(2n) .ecosystem-timeline__rail::after {
    display: none;
  }
}
@media (max-width: 768px) {
  .ecosystem-hero__stats {
    width: 100%;
    min-width: 0;
  }
  .ecosystem-benefit-grid,
  .ecosystem-timeline,
  .ecosystem-category-grid,
  .ecosystem-partner-grid {
    grid-template-columns: 1fr;
  }
  .ecosystem-timeline__item:not(:last-child) .ecosystem-timeline__rail::after {
    display: none;
  }
  .ecosystem-journey {
    padding: 1.2rem 1.05rem;
  }
}
.ai-ready-guide {
  margin-bottom: 1.25rem;
  padding: 0.9rem 1rem;
  border-radius: var(--radius);
  background: var(--paper-2);
}
.ai-ready-guide ol { margin: 0.4rem 0 0; padding-left: 1.2rem; }
.agent-invoke-panel { margin: 0 0 1.25rem; }
.agent-invoke-meta {
  display: grid;
  gap: 0.65rem;
  margin: 0 0 0.75rem;
}
.agent-invoke-meta dt { margin: 0; color: var(--ink-soft); font-size: 0.85rem; }
.agent-invoke-meta dd { margin: 0.15rem 0 0; word-break: break-all; }
.supplier-auth-note { max-width: 560px; }
.markdown-body {
  display: grid;
  gap: 0.65rem;
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--ink);
}
.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4 {
  margin: 0.4rem 0 0;
  font-family: var(--font-display, inherit);
  line-height: 1.35;
}
.markdown-body p,
.markdown-body ul,
.markdown-body ol {
  margin: 0;
}
.markdown-body ul,
.markdown-body ol {
  padding-left: 1.25rem;
}
.markdown-body pre {
  overflow: auto;
  background: #0f1f33;
  color: #e8efe9;
  padding: 0.85rem 1rem;
  border-radius: 12px;
  font-size: 0.84rem;
}
.markdown-body code {
  font-size: 0.88em;
}
.markdown-body a { color: var(--accent); }

/* 商品说明卡：能力标签芯片 + 公开说明卡片 */
.markdown-body.product-md {
  gap: 0.85rem;
}
.markdown-body.product-md > h1,
.markdown-body.product-md > h2,
.markdown-body.product-md > h3 {
  margin: 0.35rem 0 0;
  padding: 0.15rem 0 0.15rem 0.7rem;
  border-left: 3px solid var(--accent);
  color: var(--accent-2);
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.markdown-body.product-md > h1:first-child,
.markdown-body.product-md > h2:first-child,
.markdown-body.product-md > h3:first-child {
  margin-top: 0;
}
.markdown-body.product-md > ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.markdown-body.product-md > ul > li {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.3rem 0.8rem;
  border-radius: 10px;
  border: 1px solid rgba(22, 119, 197, 0.22);
  background: linear-gradient(180deg, #f4f9fd 0%, #e8f3fb 100%);
  color: var(--accent-2);
  font-size: 0.88rem;
  font-weight: 500;
  line-height: 1.35;
}
.markdown-body.product-md > ol {
  margin: 0;
  padding: 0.7rem 0.9rem 0.7rem 1.6rem;
  border-radius: 12px;
  border: 1px solid rgba(176, 200, 220, 0.65);
  background: rgba(247, 251, 254, 0.9);
}
.markdown-body.product-md > ol > li {
  margin: 0.25rem 0;
  color: var(--ink);
}
.markdown-body.product-md > p {
  margin: 0;
  padding: 0.85rem 1rem;
  border-radius: 12px;
  border: 1px solid rgba(176, 200, 220, 0.7);
  background: linear-gradient(180deg, #ffffff 0%, #f5f9fc 100%);
  color: var(--ink-soft);
  word-break: break-word;
}
.markdown-body.product-md > p .md-ext-link,
.markdown-body.product-md a.md-ext-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  max-width: 100%;
  padding: 0.2rem 0.55rem;
  border-radius: 8px;
  background: var(--accent-soft);
  color: var(--accent-2);
  font-weight: 600;
  text-decoration: none;
  word-break: break-all;
  transition: background 0.2s ease, color 0.2s ease;
}
.markdown-body.product-md > p .md-ext-link:hover,
.markdown-body.product-md a.md-ext-link:hover {
  background: rgba(22, 119, 197, 0.16);
  color: var(--accent-2);
}
.markdown-body.product-md > blockquote {
  margin: 0;
  padding: 0.75rem 1rem;
  border-left: 3px solid var(--accent);
  border-radius: 0 12px 12px 0;
  background: rgba(232, 241, 248, 0.65);
  color: var(--ink-soft);
}
.markdown-body.product-md > pre {
  margin: 0;
}

/* 技能说明：长要点纵向堆叠，避免 chip 横向挤压重叠 */
.markdown-body.product-md--skill {
  gap: 0.95rem;
}
.markdown-body.product-md--skill > ul {
  display: grid;
  gap: 0.5rem;
}
.markdown-body.product-md--skill > ul > li {
  display: block;
  width: 100%;
  min-height: 0;
  padding: 0.7rem 0.9rem;
  border-radius: 12px;
  border: 1px solid rgba(176, 200, 220, 0.7);
  background: linear-gradient(180deg, #ffffff 0%, #f5f9fc 100%);
  color: var(--ink);
  font-size: 0.92rem;
  font-weight: 500;
  line-height: 1.55;
  word-break: break-word;
}
.markdown-body.product-md--skill > ol {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.5rem;
  border: none;
  background: transparent;
}
.markdown-body.product-md--skill > ol > li {
  display: grid;
  grid-template-columns: 1.6rem 1fr;
  gap: 0.55rem;
  align-items: start;
  margin: 0;
  padding: 0.7rem 0.9rem;
  border-radius: 12px;
  border: 1px solid rgba(176, 200, 220, 0.7);
  background: linear-gradient(180deg, #ffffff 0%, #f5f9fc 100%);
  color: var(--ink);
  font-size: 0.92rem;
  font-weight: 500;
  line-height: 1.55;
  word-break: break-word;
  counter-increment: skill-step;
}
.markdown-body.product-md--skill > ol {
  counter-reset: skill-step;
}
.markdown-body.product-md--skill > ol > li::before {
  content: counter(skill-step);
  font-weight: 700;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
}
.markdown-body.product-md--skill > ul > li code {
  font-size: 0.84em;
  padding: 0.08em 0.35em;
  border-radius: 6px;
  background: rgba(15, 55, 95, 0.06);
  word-break: break-all;
}
.markdown-body.product-md--skill > p {
  border-color: rgba(22, 119, 197, 0.22);
  background: linear-gradient(180deg, #f7fbfe 0%, #eef6fb 100%);
  color: var(--ink);
  font-size: 0.95rem;
}
.markdown-body.product-md--skill a.md-ext-link {
  display: inline;
  padding: 0;
  background: transparent;
  font-weight: 600;
  word-break: break-word;
}

.module-page .block-text {
  padding: 0.15rem 0;
}
.module-page#module-boundary .block-text {
  padding: 0.9rem 1rem;
  border-radius: 12px;
  border: 1px solid rgba(176, 200, 220, 0.7);
  background: linear-gradient(180deg, #ffffff 0%, #f5f9fc 100%);
  color: var(--ink-soft);
}
.muted { color: var(--ink-soft); }
.empty {
  padding: 2.5rem 1rem;
  text-align: center;
  color: var(--ink-soft);
}
pre.code {
  overflow: auto;
  background: #0f1f33;
  color: #e8efe9;
  padding: 1rem;
  border-radius: 14px;
  font-size: 0.85rem;
  line-height: 1.55;
}
.code-langs {
  margin: 0.75rem 0 0;
}
.code-lang-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0 0 0.7rem;
  padding: 0.35rem;
  border-radius: 12px;
  background: rgba(232, 241, 248, 0.55);
  border: 1px solid rgba(176, 200, 220, 0.45);
}
.code-lang-tab {
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--ink-soft);
  font: inherit;
  font-size: 0.84rem;
  font-weight: 500;
  padding: 0.45rem 0.85rem;
  min-height: 40px;
  cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}
.code-lang-tab:hover {
  color: var(--ink);
  background: rgba(255, 255, 255, 0.85);
  border-color: rgba(176, 200, 220, 0.65);
}
.code-lang-tab:active {
  transform: scale(0.98);
}
.code-lang-tab:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.code-lang-tab.is-active {
  color: var(--accent-2);
  border-color: rgba(22, 119, 197, 0.28);
  background: #fff;
  font-weight: 600;
  box-shadow: 0 1px 0 rgba(22, 119, 197, 0.12), inset 0 -2px 0 var(--accent);
}
.code-lang-pane[hidden] { display: none !important; }
.code-lang-pane pre.code { margin: 0; }
.key-reveal {
  display: grid;
  gap: 0.5rem;
}
.key-plain {
  display: block;
  word-break: break-all;
  padding: 0.75rem 0.9rem;
  border-radius: 10px;
  background: #0f1f33;
  color: #e8efe9;
  font-size: 0.9rem;
}
.purchase-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}

.usage-steps {
  margin: 0;
  padding-left: 1.2rem;
  line-height: 1.75;
  color: var(--ink);
}
.usage-steps li { margin: 0.55rem 0; }

.keys-hero h1 { margin-bottom: 0.35rem; }
.keys-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}
.keys-section-head h2 {
  margin: 0;
  font-size: 1.2rem;
}

/* 已购页：分区导航 + 分类总览，缩短单屏长度 */
.purchases-page {
  display: grid;
  gap: 1rem;
  padding-bottom: 2rem;
}
.purchases-page__hero {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(16rem, 1fr);
  gap: 1rem 1.5rem;
  align-items: end;
  padding: 1.15rem 1.25rem;
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) + 4px);
  background:
    linear-gradient(135deg, rgba(232, 243, 251, 0.9) 0%, rgba(255, 255, 255, 0.96) 55%),
    #ffffff;
  box-shadow: var(--shadow);
}
.purchases-page__hero h1 {
  margin: 0 0 0.35rem;
  font-size: clamp(1.45rem, 2.2vw, 1.75rem);
}
.purchases-page__hero-copy p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.95rem;
  line-height: 1.55;
}
.purchases-page__hero-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5rem;
}
.purchases-stat {
  display: grid;
  gap: 0.15rem;
  justify-items: center;
  padding: 0.65rem 0.4rem;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid #d7e5f0;
}
.purchases-stat__value {
  font-size: 1.2rem;
  font-weight: 750;
  color: var(--accent-2);
  line-height: 1.1;
}
.purchases-stat__label {
  font-size: 0.75rem;
  color: var(--ink-soft);
  font-weight: 600;
}
.purchases-page__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  position: sticky;
  top: 0.65rem;
  z-index: 20;
  padding: 0.4rem;
  border: 1px solid #d7e5f0;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  box-shadow: 0 6px 20px rgba(15, 70, 120, 0.06);
}
.purchases-page__nav-link {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0.4rem 0.9rem;
  border-radius: 10px;
  color: var(--ink-soft);
  font-size: 0.9rem;
  font-weight: 650;
  text-decoration: none;
  transition: all 0.2s ease;
}
.purchases-page__nav-link:hover {
  background: #eef4f9;
  color: var(--ink);
}
.purchases-page__nav-link:active { transform: scale(0.98); }
.purchases-page__nav-link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.purchases-page__nav-link.is-active {
  background: var(--accent);
  color: #ffffff;
}
.purchases-overview__intro {
  display: grid;
  gap: 0.25rem;
  margin-bottom: 1rem;
}
.purchases-overview__heading {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}
.purchases-overview__lead {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.5;
}
.purchases-overview__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
}
.purchases-overview__card {
  --ov-accent: var(--accent);
  --ov-soft: rgba(22, 119, 197, 0.12);
  --ov-deep: #0d5a9c;
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.85rem 1rem;
  align-items: center;
  text-align: left;
  min-height: 7.5rem;
  padding: 1.15rem 1.15rem 1.15rem 1.1rem;
  border: 1px solid rgba(15, 70, 120, 0.12);
  border-radius: 18px;
  background:
    radial-gradient(120% 90% at 100% 0%, var(--ov-soft) 0%, transparent 55%),
    linear-gradient(165deg, #ffffff 0%, #f5f9fc 100%);
  color: inherit;
  font: inherit;
  cursor: pointer;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(15, 70, 120, 0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.purchases-overview__card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.9rem;
  bottom: 0.9rem;
  width: 3px;
  border-radius: 999px;
  background: var(--ov-accent);
}
.purchases-overview__card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--ov-accent) 45%, #d0e0ec);
  box-shadow: 0 16px 34px rgba(15, 70, 120, 0.1);
}
.purchases-overview__card:active { transform: scale(0.985); }
.purchases-overview__card:focus-visible {
  outline: 2px solid var(--ov-accent);
  outline-offset: 2px;
}
.purchases-overview__card--api {
  --ov-accent: #1677c5;
  --ov-soft: rgba(22, 119, 197, 0.16);
  --ov-deep: #0d5a9c;
}
.purchases-overview__card--download {
  --ov-accent: #1a9b6e;
  --ov-soft: rgba(26, 155, 110, 0.14);
  --ov-deep: #147a56;
}
.purchases-overview__card--external {
  --ov-accent: #c47a1a;
  --ov-soft: rgba(196, 122, 26, 0.14);
  --ov-deep: #9a5e12;
}
.purchases-overview__card--service {
  --ov-accent: #3d6e99;
  --ov-soft: rgba(61, 110, 153, 0.14);
  --ov-deep: #2c5478;
}
.purchases-overview__card--muted {
  --ov-accent: #7a8b9c;
  --ov-soft: rgba(122, 139, 156, 0.12);
  --ov-deep: #5a6f84;
  background: linear-gradient(165deg, #f8fafc 0%, #f1f4f7 100%);
}
.purchases-overview__card-mark {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: 14px;
  background: var(--ov-soft);
  border: 1px solid color-mix(in srgb, var(--ov-accent) 22%, transparent);
  flex-shrink: 0;
}
.purchases-overview__glyph {
  display: block;
  width: 1.15rem;
  height: 1.15rem;
  border: 2px solid var(--ov-deep);
  border-radius: 4px;
  position: relative;
}
.purchases-overview__glyph--api {
  border-radius: 5px;
  box-shadow: inset 0 0 0 2px transparent;
}
.purchases-overview__glyph--api::before,
.purchases-overview__glyph--api::after {
  content: "";
  position: absolute;
  left: 2px;
  right: 2px;
  height: 2px;
  background: var(--ov-deep);
  border-radius: 2px;
}
.purchases-overview__glyph--api::before { top: 3px; }
.purchases-overview__glyph--api::after { bottom: 3px; }
.purchases-overview__glyph--download {
  border-top-width: 0;
  border-radius: 0 0 4px 4px;
  height: 0.85rem;
  margin-top: 0.35rem;
}
.purchases-overview__glyph--download::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -0.45rem;
  width: 2px;
  height: 0.7rem;
  background: var(--ov-deep);
  transform: translateX(-50%);
}
.purchases-overview__glyph--download::after {
  content: "";
  position: absolute;
  left: 50%;
  top: -0.15rem;
  width: 0.55rem;
  height: 0.55rem;
  border-right: 2px solid var(--ov-deep);
  border-bottom: 2px solid var(--ov-deep);
  transform: translateX(-50%) rotate(45deg);
}
.purchases-overview__glyph--external {
  border-radius: 999px;
}
.purchases-overview__glyph--external::before {
  content: "";
  position: absolute;
  right: -1px;
  top: -1px;
  width: 0.45rem;
  height: 0.45rem;
  border-top: 2px solid var(--ov-deep);
  border-right: 2px solid var(--ov-deep);
}
.purchases-overview__glyph--service {
  border-radius: 999px;
  width: 1rem;
  height: 1rem;
}
.purchases-overview__glyph--service::before {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: inherit;
  border: 2px solid var(--ov-deep);
}
.purchases-overview__glyph--muted {
  border-style: dashed;
  opacity: 0.85;
}
.purchases-overview__card-main {
  display: grid;
  gap: 0.28rem;
  min-width: 0;
}
.purchases-overview__card-kicker {
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ov-deep);
}
.purchases-overview__card-title {
  font-size: 1.2rem;
  font-weight: 750;
  letter-spacing: -0.02em;
  color: var(--ink);
  line-height: 1.2;
}
.purchases-overview__card-desc {
  font-size: 0.86rem;
  color: var(--ink-soft);
  line-height: 1.45;
}
.purchases-overview__card-aside {
  display: grid;
  gap: 0.55rem;
  justify-items: end;
  align-content: center;
}
.purchases-overview__card-metric {
  display: grid;
  justify-items: end;
  gap: 0.05rem;
  line-height: 1;
}
.purchases-overview__card-metric b {
  font-size: 1.85rem;
  font-weight: 780;
  letter-spacing: -0.03em;
  color: var(--ov-deep);
}
.purchases-overview__card-metric small {
  font-size: 0.72rem;
  font-weight: 650;
  color: var(--ink-soft);
}
.purchases-overview__card-cta {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0.2rem 0.7rem;
  border-radius: 999px;
  background: var(--ov-deep);
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 700;
}
.purchases-overview__card:hover .purchases-overview__card-cta {
  background: var(--ink);
}
.purchases-group__sub {
  margin: 0.2rem 0 0;
  font-size: 0.88rem;
}
.purchases-keys-panel,
#purchases-guide {
  scroll-margin-top: 4.5rem;
}
.purchases-keys-panel {
  margin: 0;
  overflow: hidden;
}
.purchases-keys-panel__summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  padding: 1rem 1.15rem;
  cursor: pointer;
  list-style: none;
  transition: background 0.2s ease;
}
.purchases-keys-panel__summary::-webkit-details-marker { display: none; }
.purchases-keys-panel__summary::marker { content: ""; }
.purchases-keys-panel__summary:hover { background: #f3f8fc; }
.purchases-keys-panel__summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}
.purchases-keys-panel__title {
  margin: 0;
  font-size: 1.15rem;
}
.purchases-keys-panel__sub {
  margin: 0.25rem 0 0;
  font-size: 0.88rem;
}
.purchases-keys-panel__chevron {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0.2rem 0.7rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--accent);
  font-size: 0.82rem;
  font-weight: 700;
}
.purchases-keys-panel__chevron::before {
  content: "展开";
}
.purchases-keys-panel[open] .purchases-keys-panel__chevron {
  background: var(--accent-soft);
}
.purchases-keys-panel[open] .purchases-keys-panel__chevron::before {
  content: "收起";
}
.purchases-keys-panel__body {
  padding: 0 1.15rem 1.15rem;
  border-top: 1px solid var(--line);
}
.keys-step-num {
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 999px;
  background: var(--ink);
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.9rem;
  flex-shrink: 0;
}

/* 我的购买：可折叠指引，把主区留给归类列表 */
.purchases-guide {
  margin: 0;
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) + 2px);
  background: var(--card);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.purchases-guide__summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  padding: 0.95rem 1.15rem;
  cursor: pointer;
  list-style: none;
  transition: background 0.2s ease;
}
.purchases-guide__summary::-webkit-details-marker { display: none; }
.purchases-guide__summary::marker { content: ""; }
.purchases-guide__summary:hover { background: #f3f8fc; }
.purchases-guide__summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}
.purchases-guide__title {
  font-weight: 700;
  color: var(--ink);
}
.purchases-guide__hint { font-size: 0.88rem; }
.purchases-guide[open] .purchases-guide__hint { display: none; }
.purchases-guide__body {
  display: grid;
  gap: 1rem;
  padding: 0 1.15rem 1.15rem;
  border-top: 1px solid var(--line);
  padding-top: 1rem;
}
.purchases-guide__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
}
.purchases-guide__steps li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.65rem;
  align-items: start;
}
.purchases-guide__steps strong { display: block; margin-bottom: 0.15rem; }
.purchases-guide__steps p { margin: 0; font-size: 0.88rem; line-height: 1.5; }
.purchases-guide__steps code {
  font-size: 0.8rem;
  background: #eef3f8;
  padding: 0.05rem 0.3rem;
  border-radius: 6px;
}
.purchases-guide__tips {
  margin: 0;
  padding-left: 1.1rem;
  line-height: 1.7;
  color: var(--ink-soft);
  font-size: 0.92rem;
}
.purchases-guide__tips li { margin: 0.25rem 0; }

.purchases-panel { margin: 0; scroll-margin-top: 4.5rem; }
.purchases-panel__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.purchases-panel__head h2 {
  margin: 0;
  font-size: 1.2rem;
}
.purchases-panel__sub {
  margin: 0.2rem 0 0;
  font-size: 0.9rem;
}
.purchases-jump {
  color: var(--accent);
  font-size: 0.92rem;
  font-weight: 600;
  white-space: nowrap;
  transition: color 0.2s ease;
}
.purchases-jump:hover { color: var(--accent-2); }

.purchases-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.15rem;
  padding: 0.35rem;
  border-radius: 12px;
  background: #eef4f9;
  border: 1px solid #d7e5f0;
}
.purchases-filters__tab {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 44px;
  padding: 0.45rem 0.95rem;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--ink-soft);
  font: inherit;
  font-size: 0.92rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}
.purchases-filters__tab:hover {
  background: rgba(255, 255, 255, 0.72);
  color: var(--ink);
}
.purchases-filters__tab:active { transform: scale(0.98); }
.purchases-filters__tab:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.purchases-filters__tab.is-active {
  background: #ffffff;
  color: var(--accent-2);
  border-color: #c5dced;
  box-shadow: 0 1px 4px rgba(15, 70, 120, 0.08);
}
.purchases-filters__count {
  display: inline-flex;
  min-width: 1.35rem;
  justify-content: center;
  padding: 0.05rem 0.35rem;
  border-radius: 999px;
  background: rgba(22, 119, 197, 0.1);
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 700;
}
.purchases-filters__tab.is-active .purchases-filters__count {
  background: var(--accent-soft);
}

.purchases-groups {
  display: grid;
  gap: 1.35rem;
}
.purchases-group__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.35rem 0.75rem;
  margin-bottom: 0.7rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid var(--line);
}
.purchases-group__head h3 {
  margin: 0;
  font-size: 1.02rem;
  font-weight: 700;
}
.purchases-list {
  display: grid;
  gap: 0.75rem;
}
.purchases-empty-filter {
  margin: 0.5rem 0 0;
  text-align: center;
  padding: 1.5rem 0.5rem;
}

.purchase-card {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #ffffff;
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(15, 70, 120, 0.04);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  scroll-margin-top: 5.5rem;
}
.purchase-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #c5d5e4;
}
.purchase-card--api {
  border-color: #c5dced;
  background:
    linear-gradient(110deg, rgba(232, 243, 251, 0.72) 0%, rgba(255, 255, 255, 0.96) 38%),
    #ffffff;
}
.purchase-card--api::before {
  background: linear-gradient(180deg, #1677c5 0%, #0d5a9c 100%);
}
.purchase-card--download::before {
  background: linear-gradient(180deg, #1a9b6e 0%, #147a56 100%);
}
.purchase-card--inactive {
  opacity: 0.8;
  background: #f7f9fb;
}
.purchase-card--inactive::before {
  background: #9aaebb;
}
.purchase-card--key-issued {
  border-color: #1a6fb3;
  box-shadow: 0 0 0 1px rgba(22, 119, 197, 0.18), var(--shadow-lg);
}
.purchase-card:hover {
  border-color: #b7cfe0;
  box-shadow: 0 12px 28px rgba(15, 70, 120, 0.08);
}
.purchase-card--key-issued:hover {
  border-color: #1a6fb3;
  box-shadow: 0 0 0 1px rgba(22, 119, 197, 0.18), var(--shadow-lg);
}
.purchase-card__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(9.5rem, 11rem);
  gap: 1rem 1.35rem;
  align-items: stretch;
  padding: 1.2rem 1.25rem 1.25rem 1.35rem;
}
.purchase-card__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.45rem 0.7rem;
}
.purchase-card__title {
  margin: 0;
  font-size: 1.12rem;
  line-height: 1.3;
  letter-spacing: -0.015em;
  font-weight: 750;
}
.purchase-card__slug {
  display: inline-block;
  font-size: 0.76rem;
  color: var(--ink-soft);
  background: rgba(238, 243, 248, 0.95);
  border: 1px solid #e1eaf2;
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
}
.purchase-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.55rem;
  align-items: center;
  margin-top: 0.65rem;
  font-size: 0.88rem;
}
.purchase-card__time { font-size: 0.84rem; }

.purchase-card__callout {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.95rem;
  padding: 0.7rem 0.8rem;
  border: 1px solid #d3e4f1;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(15, 31, 51, 0.03) 0%, rgba(255, 255, 255, 0.9) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}
.purchase-card__call-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.55rem;
  align-items: center;
}
.purchase-card__call-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  padding: 0.18rem 0.45rem;
  border-radius: 8px;
  background: #1677c5;
  color: #ffffff;
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.04em;
}
.purchase-card__call-code {
  min-width: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: #18324a;
  word-break: break-all;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}
.purchase-card__icon-btn {
  appearance: none;
  border: 1px solid transparent;
  background: #e8f3fb;
  color: var(--accent-2);
  border-radius: 999px;
  padding: 0.28rem 0.7rem;
  font-size: 0.76rem;
  font-weight: 700;
  min-height: 32px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.purchase-card__icon-btn:hover {
  background: #d7ebfa;
}
.purchase-card__icon-btn:active { transform: scale(0.98); }
.purchase-card__icon-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.purchase-card__icon-btn.is-copied {
  background: #e6f5ef;
  color: var(--ok);
}

.purchase-card__prefixes {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.85rem;
  padding: 0.7rem 0.8rem;
  border-radius: 14px;
  background: #f4f8fc;
  border: 1px solid #e0ebf4;
}
.purchase-card__prefixes-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.purchase-card__prefixes-label {
  color: var(--ink-soft);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.purchase-card__prefix-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.purchase-card__prefix {
  font-size: 0.78rem;
  background: #ffffff;
  color: var(--accent-2);
  border: 1px solid #d3e6f5;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  box-shadow: 0 1px 2px rgba(15, 70, 120, 0.04);
}
.purchase-card__prefix-more {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 0.55rem;
  border-radius: 999px;
  background: #e8f3fb;
  color: var(--accent);
  font-size: 0.76rem;
  font-weight: 700;
}
.purchase-card__prefixes-link {
  font-size: 0.82rem;
  font-weight: 650;
}
.purchase-card__actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: stretch;
  justify-content: center;
  padding: 0.85rem;
  border-radius: 14px;
  background: linear-gradient(180deg, #f7fbfe 0%, #eef4f9 100%);
  border: 1px solid #d7e5f0;
}
.purchase-card__actions form,
.purchase-card__actions .btn {
  width: 100%;
}
.purchase-card__actions .btn {
  min-height: 44px;
  justify-content: center;
  transition: all 0.2s ease;
}
.purchase-card__actions .btn:active { transform: scale(0.98); }
.purchase-card__external-hint {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.4;
  text-align: center;
}

/* 凭证面板：深色终端感 + 清晰操作区 */
.purchase-card__credential {
  margin: 0;
  padding: 1.15rem 1.2rem 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(22, 119, 197, 0.28) 0%, transparent 55%),
    linear-gradient(165deg, #10263a 0%, #0f1f33 55%, #122a40 100%);
  color: #eef4f8;
  animation: rise 0.35s ease both;
}
.purchase-card__credential-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.65rem 1rem;
  margin-bottom: 0.95rem;
}
.purchase-card__credential-kicker {
  margin: 0 0 0.2rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #8ec4ef;
}
.purchase-card__credential-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #ffffff;
}
.purchase-card__credential-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  background: rgba(250, 204, 21, 0.16);
  border: 1px solid rgba(250, 204, 21, 0.35);
  color: #f6e27a;
  font-size: 0.78rem;
  font-weight: 700;
}
.purchase-card__credential-field {
  display: grid;
  gap: 0.55rem;
  padding: 0.85rem 0.95rem;
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.purchase-card__credential-field-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.purchase-card__credential-label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(232, 243, 251, 0.72);
}
.purchase-card__credential-copy {
  min-height: 40px;
  padding-inline: 1rem;
}
.purchase-card__credential-value {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #f4f8fb;
  font-size: 0.92rem;
  line-height: 1.55;
  word-break: break-all;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}
.purchase-card__credential-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.85rem;
}
.purchase-card__snippet-btn,
.purchase-card__credential-actions .btn-ghost {
  border-color: rgba(255, 255, 255, 0.22);
  color: #e8f3fb;
  background: rgba(255, 255, 255, 0.06);
  min-height: 40px;
}
.purchase-card__snippet-btn:hover,
.purchase-card__credential-actions .btn-ghost:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
}
.purchase-card__credential .btn.is-copied,
.purchase-card__snippet-btn.is-copied {
  background: #e6f5ef !important;
  color: var(--ok) !important;
  border-color: #b9dcc8 !important;
}
.purchase-card__credential-note {
  margin: 0.85rem 0 0;
  font-size: 0.84rem;
  line-height: 1.55;
  color: rgba(232, 243, 251, 0.72);
}
.purchase-card__credential-note code {
  color: #d7ebfa;
  background: rgba(255, 255, 255, 0.08);
  padding: 0.05rem 0.35rem;
  border-radius: 5px;
  font-size: 0.8rem;
}

.chip-ok {
  background: #e6f5ef;
  color: var(--ok);
  border-color: #b9dcc8;
}

.key-banner {
  margin: 0 0 1.15rem;
  padding: 1.05rem 1.15rem;
  border-radius: var(--radius);
  background: linear-gradient(135deg, #14352d 0%, #1677c5 70%);
  color: #ffffff;
  box-shadow: var(--shadow);
  animation: rise 0.35s ease both;
}
.key-banner a { color: #d7f5ea; }
.key-banner-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.7rem;
}
.key-banner-product {
  margin: 0 0 0.7rem;
  font-size: 0.9rem;
  line-height: 1.5;
  color: rgba(240, 248, 255, 0.92);
}
.key-banner-product code {
  color: #fff;
  background: rgba(0, 0, 0, 0.22);
  padding: 0.05rem 0.35rem;
  border-radius: 6px;
}
.key-banner-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.65rem;
  align-items: stretch;
}
.key-banner .key-plain {
  margin: 0;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid rgba(255, 255, 255, 0.18);
}
.key-banner-hint {
  margin: 0.65rem 0 0;
  color: rgba(240, 248, 255, 0.82) !important;
  font-size: 0.88rem;
  line-height: 1.55;
  word-break: break-all;
}
.key-banner-hint code {
  color: #fff;
  background: rgba(0, 0, 0, 0.22);
  padding: 0.05rem 0.35rem;
  border-radius: 6px;
}
.key-banner .btn.is-copied {
  background: #e8f3fb;
  color: var(--accent);
  border-color: #c5dced;
}
.keys-table__product-link {
  color: inherit;
  text-decoration: none;
}
.keys-table__product-link:hover {
  color: var(--accent);
  text-decoration: underline;
}
.keys-table__product-link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.status-pill {
  display: inline-flex;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 600;
}
.status-on {
  background: #e8f3fb;
  color: var(--accent);
}
.status-off {
  background: #eef3f8;
  color: var(--ink-soft);
}

.keys-list-panel { margin-top: 0; }
.keys-table-wrap { overflow-x: auto; }
.keys-table tr.is-revoked td { opacity: 0.62; }
.btn-sm {
  padding: 0.4rem 0.85rem;
  font-size: 0.85rem;
}
.keys-empty {
  display: grid;
  gap: 0.85rem;
  justify-items: center;
  padding: 2rem 1rem;
}
.keys-empty-hint { margin: 0.25rem 0 0; }

@media (max-width: 1024px) {
  .purchases-page__hero {
    grid-template-columns: 1fr;
  }
  .purchases-guide__steps {
    grid-template-columns: 1fr;
  }
  .purchases-overview__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .purchases-page__hero-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .purchases-page__nav {
    top: 0.35rem;
  }
  .purchases-overview__card {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .purchases-overview__card-aside {
    grid-column: 1 / -1;
    grid-template-columns: 1fr auto;
    justify-items: start;
    align-items: center;
    width: 100%;
  }
  .purchases-overview__card-metric {
    justify-items: start;
    grid-auto-flow: column;
    align-items: baseline;
    gap: 0.35rem;
  }
  .purchases-overview__card-metric b {
    font-size: 1.45rem;
  }
  .purchase-card__body {
    grid-template-columns: 1fr;
  }
  .purchase-card__actions {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .purchase-card__actions form,
  .purchase-card__actions .btn {
    flex: 1 1 auto;
    width: auto;
  }
  .key-banner-row { grid-template-columns: 1fr; }
  .purchase-card__call-row {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .purchase-card__call-row .purchase-card__icon-btn {
    grid-column: 2;
    justify-self: start;
  }
  .purchase-card__credential-actions .btn {
    flex: 1 1 auto;
    justify-content: center;
  }
  .purchases-filters__tab { flex: 1 1 auto; justify-content: center; }
  .purchases-group__head {
    align-items: stretch;
  }
  .purchases-group__head .btn {
    width: 100%;
    justify-content: center;
    min-height: 44px;
  }
}

/* —— API 文档页 —— */
.api-docs-page {
  padding-bottom: 2.5rem;
  animation: rise 0.65s ease both;
}
.api-docs-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(16rem, 0.85fr);
  gap: 1.75rem;
  align-items: stretch;
  margin: 0 0 1.5rem;
  padding: 2.4rem 0 0.35rem;
}
.api-docs-hero__eyebrow {
  margin: 0 0 0.55rem;
  color: var(--accent-2);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.api-docs-hero h1 {
  margin: 0 0 0.85rem;
  max-width: none;
  width: 100%;
  font-family: var(--font-display);
  font-size: clamp(2rem, 3.6vw, 2.85rem);
  line-height: 1.18;
  text-align: left;
  white-space: nowrap;
}
.api-docs-hero__lead,
.api-docs-hero__desc {
  margin: 0;
  max-width: 40rem;
  color: var(--ink-soft);
  font-size: 1.02rem;
  line-height: 1.75;
  text-align: left;
  text-wrap: pretty;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.api-docs-hero__lead {
  color: var(--ink);
  font-weight: 500;
}
.api-docs-hero__desc {
  margin-top: 0.5rem;
}
.api-docs-hero__desc code,
.api-docs-hero__path {
  font-size: 0.9em;
  white-space: nowrap;
}
.api-docs-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 1.25rem;
}
.api-docs-hero__panel {
  display: grid;
  align-content: start;
  gap: 0.85rem;
  padding: 1.25rem 1.3rem 1.35rem;
  border-radius: 18px;
  background:
    linear-gradient(155deg, #13263d 0%, #0f1f33 48%, #163552 100%);
  color: #d7e4f0;
  box-shadow: var(--shadow-lg);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.api-docs-hero__panel-label {
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(215, 228, 240, 0.55);
  font-weight: 600;
}
.api-docs-hero__path {
  display: block;
  padding: 0.7rem 0.85rem;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #9fd0f5;
  font-size: 0.88rem;
  line-height: 1.45;
  overflow-x: auto;
}
.api-docs-hero__meta {
  list-style: none;
  margin: 0.25rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
}
.api-docs-hero__meta li {
  display: grid;
  gap: 0.15rem;
  padding: 0.55rem 0.65rem;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.07);
}
.api-docs-hero__meta span {
  font-size: 0.72rem;
  color: rgba(215, 228, 240, 0.55);
}
.api-docs-hero__meta strong {
  font-size: 0.92rem;
  font-weight: 600;
  color: #fff;
  font-variant-numeric: tabular-nums;
}

.api-docs-highlights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
  margin: 0 0 1.5rem;
}
.api-docs-highlight {
  position: relative;
  padding: 1.15rem 1.2rem 1.2rem;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(176, 200, 220, 0.55);
  box-shadow: 0 8px 28px rgba(15, 70, 120, 0.05);
  overflow: hidden;
}
.api-docs-highlight::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(180deg, var(--accent), var(--accent-2));
}
.api-docs-highlight:nth-child(2)::before {
  background: linear-gradient(180deg, #1a9b6e, #0f7a55);
}
.api-docs-highlight:nth-child(3)::before {
  background: linear-gradient(180deg, #c47a1a, #9a5c0f);
}
.api-docs-highlight__index {
  display: block;
  margin-bottom: 0.45rem;
  font-family: var(--font-display);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--accent);
}
.api-docs-highlight:nth-child(2) .api-docs-highlight__index { color: #1a9b6e; }
.api-docs-highlight:nth-child(3) .api-docs-highlight__index { color: #b06a12; }
.api-docs-highlight h2 {
  margin: 0 0 0.4rem;
  font-size: 1.05rem;
  font-family: var(--font-display);
}
.api-docs-highlight p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.65;
}
.api-docs-highlight code {
  font-size: 0.88em;
}

.api-docs-main {
  padding: 1.5rem 1.55rem 1.75rem;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(176, 200, 220, 0.55);
  box-shadow: var(--shadow);
}
.api-docs-note {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.95rem;
  align-items: start;
  margin: 0 0 1.75rem;
  padding: 1.05rem 1.15rem;
  border-radius: 14px;
  background: linear-gradient(120deg, #eef6fc 0%, #f7fbfe 100%);
  border: 1px solid #c9dceb;
}
.api-docs-note__badge {
  padding: 0.28rem 0.55rem;
  border-radius: 8px;
  background: var(--ink);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.api-docs-note__body strong {
  display: block;
  margin-bottom: 0.3rem;
  color: var(--accent-2);
  font-size: 0.98rem;
}
.api-docs-note__body p {
  margin: 0;
  color: var(--ink);
  line-height: 1.7;
  font-size: 0.94rem;
}

.api-docs-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}
.api-docs-step {
  display: grid;
  grid-template-columns: 2.75rem 1fr;
  gap: 1.1rem;
  align-items: start;
  padding: 0 0 2rem;
}
.api-docs-step:last-child {
  padding-bottom: 0.35rem;
}
.api-docs-step__rail {
  position: relative;
  display: flex;
  justify-content: center;
  min-height: 100%;
}
.api-docs-step__rail::after {
  content: "";
  position: absolute;
  top: 2.5rem;
  bottom: -2rem;
  left: 50%;
  width: 2px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, rgba(22, 119, 197, 0.35), rgba(176, 200, 220, 0.25));
}
.api-docs-step:last-child .api-docs-step__rail::after {
  display: none;
}
.api-docs-step__num {
  position: relative;
  z-index: 1;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ink);
  color: #fff;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.95rem;
  box-shadow: 0 8px 18px rgba(15, 31, 51, 0.18);
}
.api-docs-step__head {
  margin-bottom: 0.55rem;
}
.api-docs-step__eyebrow {
  margin: 0 0 0.25rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
}
.api-docs-step__body h2 {
  margin: 0;
  font-size: 1.3rem;
  font-family: var(--font-display);
  line-height: 1.3;
}
.api-docs-step__body > p {
  margin: 0.45rem 0 0.7rem;
  line-height: 1.7;
  color: var(--ink);
}
.api-docs-muted {
  color: var(--ink-soft) !important;
  font-size: 0.92rem;
}
.api-docs-checklist {
  margin: 0.35rem 0 0.9rem;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.45rem;
}
.api-docs-checklist li {
  position: relative;
  padding: 0.65rem 0.85rem 0.65rem 2.15rem;
  border-radius: 12px;
  background: #f5f9fc;
  border: 1px solid rgba(176, 200, 220, 0.45);
  line-height: 1.55;
}
.api-docs-checklist li::before {
  content: "";
  position: absolute;
  left: 0.85rem;
  top: 50%;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  transform: translateY(-50%);
  background: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}
.api-docs-callout {
  margin: 0.85rem 0 0;
  padding: 0.9rem 1rem;
  border-radius: 12px;
  background: #0f1f33;
  color: #d7e4f0;
}
.api-docs-callout strong {
  display: block;
  margin-bottom: 0.3rem;
  color: #9fd0f5;
  font-size: 0.88rem;
}
.api-docs-callout p {
  margin: 0;
  line-height: 1.65;
  font-size: 0.92rem;
}
.api-docs-callout code {
  color: #c8ebff;
}
.api-docs-callout--soft {
  background: linear-gradient(120deg, #f0f6fb, #f8fbfd);
  color: var(--ink);
  border: 1px solid rgba(176, 200, 220, 0.55);
}
.api-docs-callout--soft strong {
  color: var(--accent-2);
}
.api-docs-callout--soft code {
  color: var(--ink);
}

.api-docs-table-wrap {
  margin: 0.75rem 0 0.85rem;
  overflow-x: auto;
  border-radius: 14px;
  border: 1px solid rgba(176, 200, 220, 0.55);
  background: #fff;
}
.api-docs-table {
  margin: 0;
  width: 100%;
  border-collapse: collapse;
}
.api-docs-table th,
.api-docs-table td {
  padding: 0.75rem 0.95rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid rgba(176, 200, 220, 0.45);
  font-size: 0.9rem;
  line-height: 1.55;
}
.api-docs-table th {
  background: #f3f8fc;
  color: var(--ink-soft);
  font-weight: 600;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.api-docs-table tr:last-child td {
  border-bottom: none;
}
.api-docs-table code {
  font-size: 0.84em;
  word-break: break-all;
}
.api-docs-method {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.45rem;
  border-radius: 6px;
  background: rgba(26, 155, 110, 0.12);
  color: #147a56;
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
}
.api-docs-status {
  display: inline-flex;
  min-width: 2.4rem;
  justify-content: center;
  padding: 0.18rem 0.4rem;
  border-radius: 6px;
  font-weight: 700;
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}
.api-docs-status--warn {
  background: rgba(196, 122, 26, 0.12);
  color: #9a5c0f;
}
.api-docs-status--danger {
  background: rgba(196, 61, 61, 0.12);
  color: #a83232;
}
.api-docs-status--muted {
  background: #eef3f8;
  color: var(--ink-soft);
}

.api-docs-code {
  margin: 0.9rem 0 0.35rem;
  padding: 0.55rem;
  border-radius: 16px;
  background: #f2f7fb;
  border: 1px solid rgba(176, 200, 220, 0.5);
}
.api-docs-code .code-lang-tabs {
  margin-bottom: 0.55rem;
  background: transparent;
  border: none;
  padding: 0.15rem;
}
.api-docs-code .code-lang-tab.is-active {
  box-shadow: 0 1px 0 rgba(22, 119, 197, 0.1), inset 0 -2px 0 var(--accent);
}
.api-docs-code pre.code {
  margin: 0;
  border-radius: 12px;
}
.api-docs-sample {
  margin: 0.7rem 0 0.85rem;
}

.api-docs-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 2rem;
  padding: 1.25rem 1.35rem;
  border-radius: 16px;
  background:
    linear-gradient(125deg, rgba(22, 119, 197, 0.08), rgba(15, 31, 51, 0.04));
  border: 1px solid rgba(22, 119, 197, 0.18);
}
.api-docs-foot__copy h2 {
  margin: 0 0 0.3rem;
  font-size: 1.15rem;
  font-family: var(--font-display);
}
.api-docs-foot__copy p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.6;
  max-width: 34rem;
}
.api-docs-foot__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

@media (max-width: 900px) {
  .api-docs-hero {
    grid-template-columns: 1fr;
  }
  .api-docs-hero h1 {
    white-space: normal;
    text-wrap: pretty;
  }
  .api-docs-highlights {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .api-docs-step {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }
  .api-docs-step__rail {
    justify-content: flex-start;
    min-height: auto;
  }
  .api-docs-step__rail::after {
    display: none;
  }
  .api-docs-note {
    grid-template-columns: 1fr;
  }
  .api-docs-main {
    padding: 1.15rem 1rem 1.35rem;
  }
  .api-docs-hero__meta {
    grid-template-columns: 1fr 1fr;
  }
  .api-docs-foot {
    align-items: stretch;
  }
  .api-docs-foot__actions .btn {
    flex: 1 1 auto;
    justify-content: center;
  }
}
.site-footer {
  margin-top: 3rem;
  padding: 0;
  color: #a8adbc;
  font-size: 0.9rem;
  border-top: none;
  background: #1a1c2e;
}

.hint {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
  color: #7a8694;
  line-height: 1.45;
  min-height: 1.15em;
}
.hint:empty {
  margin: 0;
  min-height: 0;
}
.hint.ok { color: var(--ok); }
.hint.err { color: var(--danger); }
.hint.warn { color: var(--accent-2); }

/* ?? ??/???? ?? */
.auth-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 11rem);
  padding: 1.5rem 0 2.5rem;
  text-align: center;
  gap: 0.35rem;
}
.auth-page .auth-brand {
  margin-bottom: 0.25rem;
}

.auth-switch {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  margin-bottom: 1.35rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(176, 200, 220, 0.7);
}
.auth-switch-link {
  color: var(--ink);
  font-weight: 500;
  padding: 0.2rem 0.1rem;
}
.auth-switch-link.is-active {
  color: var(--accent);
  box-shadow: inset 0 -2px 0 var(--accent);
}
.auth-switch-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.6rem;
  padding: 0.55rem 1.1rem;
  border-radius: 999px;
  background: transparent;
  border: 1px solid var(--line);
  color: var(--ink);
  font-weight: 500;
  line-height: 1;
}
.auth-switch-btn.is-active,
.auth-switch-btn:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff !important;
}

.auth-card {
  width: min(440px, 100%);
  margin: 0 auto;
  padding: 1.35rem 1.35rem 1.25rem;
  text-align: left;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(176, 200, 220, 0.85);
  border-radius: 20px;
  box-shadow: 0 14px 36px rgba(15, 55, 95, 0.07);
  animation: rise 0.55s ease both;
}

.auth-card .field { gap: 0.4rem; margin-bottom: 0.15rem; }
.auth-card .field label {
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--ink);
}
.auth-card .field input {
  border: 1px solid #c8d8e6;
  background: #fff;
  border-radius: 12px;
  padding: 0.78rem 0.9rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.auth-card .field input::placeholder { color: #8a9aab; }
.auth-card .field input:hover { border-color: #a8bcd0; }
.auth-card .field input:focus {
  outline: none;
  border-color: #3d8fc9;
  box-shadow: 0 0 0 3px rgba(22, 119, 197, 0.14);
}
.auth-card .field input.is-ok {
  border-color: #6aabdb;
}
.auth-card .field input.is-err {
  border-color: #d17a7a;
  box-shadow: 0 0 0 3px rgba(155, 44, 44, 0.1);
}

.pwd-block { margin-top: 0.15rem; }
.pwd-meter {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.35rem;
  margin-top: 0.55rem;
}
.pwd-seg {
  height: 6px;
  border-radius: 999px;
  background: #e0ebf3;
  transition: background 0.2s ease;
}
.pwd-meter.low .pwd-seg:nth-child(1) { background: #d97757; }
.pwd-meter.medium .pwd-seg:nth-child(1),
.pwd-meter.medium .pwd-seg:nth-child(2) { background: #c4a035; }
.pwd-meter.high .pwd-seg { background: var(--ok); }

.pwd-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin: 0.45rem 0 0;
  font-size: 0.78rem;
  color: #7a8694;
}
.pwd-level {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-weight: 600;
}
.pwd-level .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #d0e0ec;
}
.pwd-low { color: #c45c26; }
.pwd-low .dot { background: #d97757; }
.pwd-medium { color: #9a7400; }
.pwd-medium .dot { background: #c4a035; }
.pwd-high { color: var(--ok); }
.pwd-high .dot { background: var(--ok); }

.auth-actions {
  display: grid;
  gap: 0.55rem;
  margin-top: 0.55rem;
}
.auth-actions .btn {
  width: 100%;
  justify-content: center;
  padding: 0.78rem 1rem;
  border-radius: 12px;
  font-weight: 500;
}
.auth-actions .btn-ghost {
  background: transparent;
}

@keyframes shake-x {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}
.btn.shake { animation: shake-x 0.35s ease; }

@keyframes rise {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes hero-orbit {
  0%, 100% { transform: translateY(0) scale(1); opacity: 0.9; }
  50% { transform: translateY(12px) scale(1.03); opacity: 1; }
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
}
.form-grid .full { grid-column: 1 / -1; }
@media (max-width: 700px) {
  .form-grid { grid-template-columns: 1fr; }
}

.demand-list {
  display: grid;
  gap: 0.85rem;
  margin-top: 1.25rem;
}
.demand-card {
  display: grid;
  gap: 0.55rem;
  padding: 1.1rem 1.2rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: var(--shadow);
}
.demand-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.demand-card__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.15rem;
}
.demand-card__desc {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.55;
}
.demand-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.offer-list {
  display: grid;
  gap: 0.75rem;
  margin-top: 1rem;
}
.offer-card {
  padding: 1rem 1.1rem;
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) - 4px);
  background: rgba(255, 255, 255, 0.96);
}
.offer-card__head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  align-items: baseline;
  justify-content: space-between;
}

/* ?? Agent market / About pages (amp.chinadep.com layout) ?? */
.btn:active {
  transform: scale(0.98);
}
.btn:focus-visible,
.agent-scenario-nav__link:focus-visible,
.site-footer a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.site-footer__top {
  display: grid;
  grid-template-columns: minmax(12rem, 1.35fr) repeat(2, minmax(7.5rem, 0.85fr)) minmax(15rem, 1.2fr);
  gap: 2rem 2.5rem;
  padding: 2.75rem 0 2.25rem;
}
.site-footer__brand {
  display: grid;
  gap: 0.85rem;
  align-content: start;
}
.site-footer__brand-link {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  color: #ffffff;
  transition: opacity 0.2s ease;
}
.site-footer__brand-link:hover {
  opacity: 0.88;
  color: #ffffff;
}
.site-footer__logo {
  width: 2.25rem;
  height: 2.25rem;
  object-fit: cover;
  object-position: center 12%;
  border-radius: 0.45rem;
  flex-shrink: 0;
}
.site-footer__brand-name {
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.3;
}
.site-footer__brand-sep {
  margin: 0 0.2rem;
  font-weight: 500;
  opacity: 0.7;
}
.site-footer__tagline {
  margin: 0;
  color: #a8adbc;
  font-size: 0.88rem;
  line-height: 1.65;
  max-width: 18rem;
}
.site-footer__heading {
  margin: 0 0 1rem;
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.site-footer__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.7rem;
}
.site-footer__list a {
  color: #a8adbc;
  transition: color 0.2s ease, background 0.2s ease;
}
.site-footer__list a:hover {
  color: #ffffff;
}
.site-footer__list--contact li {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  color: #a8adbc;
  line-height: 1.5;
}
.site-footer__company-name {
  white-space: nowrap;
  word-break: keep-all;
}
.site-footer__icon {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-top: 0.2rem;
  flex-shrink: 0;
  border-radius: 0.2rem;
  background: currentColor;
  /* CSS-only contact icons (phone / company) */
  -webkit-mask: no-repeat center / contain;
  mask: no-repeat center / contain;
}
.site-footer__icon--phone {
  color: #e07ab5;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.79 19.79 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.81.36 1.6.68 2.34a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.74.32 1.53.55 2.34.68A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.79 19.79 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.81.36 1.6.68 2.34a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.74.32 1.53.55 2.34.68A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
}
.site-footer__icon--company {
  color: #7aa8e0;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V7l7-4 7 4v14'/%3E%3Cpath d='M9 21v-4h6v4'/%3E%3Cpath d='M9 9h.01M15 9h.01M9 13h.01M15 13h.01'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V7l7-4 7 4v14'/%3E%3Cpath d='M9 21v-4h6v4'/%3E%3Cpath d='M9 9h.01M15 9h.01M9 13h.01M15 13h.01'/%3E%3C/svg%3E");
}
.site-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 1.1rem 0 1.35rem;
}
.site-footer__bottom-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.65rem 1.35rem;
  font-size: 0.82rem;
  color: #8b90a0;
}
.site-footer__legal {
  margin: 0;
}
.site-footer__legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1.15rem;
}
.site-footer__legal-links a {
  color: #8b90a0;
  transition: color 0.2s ease;
}
.site-footer__legal-links a:hover {
  color: #ffffff;
}

@media (max-width: 1024px) {
  .site-footer__top {
    grid-template-columns: 1fr 1fr;
    gap: 1.75rem 2rem;
  }
}
@media (max-width: 768px) {
  .site-footer__top {
    grid-template-columns: 1fr;
    padding: 2.25rem 0 1.75rem;
    gap: 1.5rem;
  }
  .site-footer__tagline {
    max-width: none;
  }
  .site-footer__bottom-inner {
    flex-direction: column;
    text-align: center;
  }
}

.auth-brand {
  display: grid;
  justify-items: center;
  gap: 0.55rem;
  margin-bottom: 0.75rem;
  animation: rise 0.7s ease both;
}
.auth-brand__logo {
  width: 7.5rem;
  height: 7.5rem;
  object-fit: contain;
  border-radius: 1.1rem;
  box-shadow: 0 10px 28px rgba(15, 55, 95, 0.12);
}
.auth-brand__company {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.88rem;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.agent-section-head {
  margin-bottom: 1.4rem;
}
.agent-section-head .muted {
  margin: 0 0 0.55rem;
  letter-spacing: 0.06em;
  font-size: 0.78rem;
  color: var(--accent);
  font-weight: 600;
  line-height: 1.3;
}
.agent-section-head h2 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  line-height: 1.25;
  font-weight: 700;
  color: var(--ink);
}

.agent-hero {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-bottom: 0.5rem;
  padding: 4.5rem max(1rem, calc((100vw - 1160px) / 2)) 3.6rem;
  overflow: hidden;
  isolation: isolate;
  animation: rise 0.7s ease both;
  background:
    radial-gradient(900px 420px at 88% 18%, rgba(64, 156, 220, 0.42) 0%, transparent 58%),
    radial-gradient(700px 380px at 8% 90%, rgba(13, 90, 156, 0.22) 0%, transparent 55%),
    linear-gradient(135deg, #c8e4f7 0%, #dceefb 38%, #eef6fc 72%, #f4f9fd 100%);
}
.agent-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    radial-gradient(rgba(22, 119, 197, 0.12) 1px, transparent 1px),
    linear-gradient(rgba(22, 119, 197, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(22, 119, 197, 0.07) 1px, transparent 1px);
  background-size: 24px 24px, 48px 48px, 48px 48px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.65), transparent 90%);
  pointer-events: none;
}
.agent-hero::after {
  content: "";
  position: absolute;
  right: max(-2rem, calc((100vw - 1160px) / 2 - 4rem));
  top: 12%;
  width: min(420px, 42vw);
  height: min(420px, 42vw);
  border-radius: 50%;
  border: 1px solid rgba(22, 119, 197, 0.22);
  box-shadow:
    inset 0 0 0 28px rgba(255, 255, 255, 0.22),
    0 0 0 56px rgba(22, 119, 197, 0.06),
    0 0 0 1px rgba(22, 119, 197, 0.1);
  pointer-events: none;
  z-index: -1;
  animation: hero-orbit 14s ease-in-out infinite;
}
.agent-hero__eyebrow {
  margin: 0 0 0.75rem;
  color: var(--accent);
  font-weight: 600;
  letter-spacing: 0.1em;
  font-size: 0.8rem;
}
.agent-hero h1 {
  margin: 0 0 0.9rem;
  font-family: var(--font-display);
  font-size: clamp(2.45rem, 5.2vw, 3.6rem);
  line-height: 1.1;
  max-width: 10ch;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #0a2744;
}
.agent-hero__lead {
  margin: 0 0 1.7rem;
  max-width: 36rem;
  color: var(--ink-soft);
  font-size: 1.1rem;
  font-weight: 400;
  line-height: 1.7;
}
.agent-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.agent-hero__actions .btn {
  min-height: 44px;
}
.agent-hero__stat {
  margin: 1.25rem 0 0;
  font-size: 0.92rem;
  font-weight: 400;
}
.agent-hero__stat strong {
  color: var(--accent-2);
  font-variant-numeric: tabular-nums;
  font-size: 1.35rem;
  font-weight: 700;
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", "SF Mono", Consolas, monospace;
  letter-spacing: 0.02em;
  padding: 0.05rem 0.35rem;
  background: rgba(22, 119, 197, 0.1);
  border-radius: 6px;
  vertical-align: -0.08em;
}

.agent-home-hero__network {
  position: absolute;
  right: max(-1rem, calc((100vw - 1160px) / 2 - 1.5rem));
  top: 10%;
  width: min(420px, 44vw);
  height: auto;
  color: rgba(13, 90, 156, 0.36);
  pointer-events: none;
  z-index: -1;
  animation: market-network-pulse 8s ease-in-out infinite;
}
.agent-home-hero__cta .agent-home-hero__cta-arrow {
  display: inline-block;
  transition: transform 0.2s ease;
}
.agent-home-hero__cta:hover {
  transform: translateY(-3px);
  filter: brightness(0.96);
}
.agent-home-hero__cta:hover .agent-home-hero__cta-arrow {
  transform: translateX(3px);
}
.agent-home-hero__cta:active {
  transform: scale(0.98);
}
.agent-home-hero__count {
  display: inline-block;
  margin: 0 0.15rem;
  padding: 0.05rem 0.35rem;
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", "SF Mono", Consolas, monospace;
  font-size: 1.35rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  line-height: 1;
  color: var(--accent-2);
  background: rgba(22, 119, 197, 0.1);
  border-radius: 6px;
  vertical-align: -0.08em;
}

/* ?????? Hero???????? + ?????? */
.market-hero {
  background:
    radial-gradient(900px 420px at 88% 18%, rgba(64, 156, 220, 0.48) 0%, transparent 58%),
    radial-gradient(700px 380px at 8% 90%, rgba(13, 90, 156, 0.28) 0%, transparent 55%),
    linear-gradient(135deg, #c5e2f6 0%, #dceefb 38%, #eef6fc 72%, #f4f9fd 100%);
}
.market-hero::before {
  background-image:
    radial-gradient(rgba(22, 119, 197, 0.14) 1px, transparent 1px),
    linear-gradient(rgba(22, 119, 197, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(22, 119, 197, 0.08) 1px, transparent 1px);
  background-size: 24px 24px, 48px 48px, 48px 48px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.7), transparent 90%);
  opacity: 1;
}
.market-hero::after {
  border-color: rgba(22, 119, 197, 0.28);
  box-shadow:
    inset 0 0 0 28px rgba(255, 255, 255, 0.22),
    0 0 0 56px rgba(22, 119, 197, 0.07),
    0 0 0 1px rgba(22, 119, 197, 0.12);
  opacity: 0.95;
}
.market-hero__network {
  position: absolute;
  right: max(-1rem, calc((100vw - 1160px) / 2 - 1.5rem));
  top: 8%;
  width: min(440px, 46vw);
  height: auto;
  color: rgba(13, 90, 156, 0.38);
  pointer-events: none;
  z-index: -1;
  animation: market-network-pulse 8s ease-in-out infinite;
}
.market-hero__network-nodes circle:nth-child(odd) {
  opacity: 0.85;
}
.market-hero__network-nodes circle:nth-child(even) {
  opacity: 1;
}
.market-hero__cta .market-hero__cta-arrow {
  display: inline-block;
  transition: transform 0.2s ease;
}
.market-hero__cta:hover {
  transform: translateY(-3px);
  filter: brightness(0.96);
}
.market-hero__cta:hover .market-hero__cta-arrow {
  transform: translateX(3px);
}
.market-hero__cta:active {
  transform: scale(0.98);
}
.market-hero__count {
  display: inline-block;
  margin: 0 0.15rem;
  padding: 0.05rem 0.35rem;
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", "SF Mono", Consolas, monospace;
  font-size: 1.35rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  line-height: 1;
  color: var(--accent-2);
  background: rgba(22, 119, 197, 0.1);
  border-radius: 6px;
  vertical-align: -0.08em;
}

@keyframes market-network-pulse {
  0%, 100% { opacity: 0.72; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(-6px); }
}

/* ?? / ????????????????? gateway ?? */
.agent-gateway {
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(0, 1fr);
  gap: 1.25rem;
  margin: 1.75rem 0 2.4rem;
  align-items: stretch;
}
a.agent-gateway__feature {
  position: relative;
  display: grid;
  gap: 0.75rem;
  align-content: start;
  min-height: 100%;
  padding: 2rem 1.85rem 5.25rem;
  border-radius: 24px;
  overflow: hidden;
  color: #ffffff;
  text-decoration: none;
  background:
    radial-gradient(380px 200px at 92% 8%, rgba(255, 255, 255, 0.18) 0%, transparent 55%),
    linear-gradient(145deg, #0d5a9c 0%, #1677c5 52%, #3d9adf 100%);
  box-shadow: 0 18px 40px rgba(13, 90, 156, 0.22);
  animation: rise 0.7s ease both;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
a.agent-gateway__feature:hover {
  color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 22px 48px rgba(13, 90, 156, 0.28);
  filter: brightness(1.03);
}
a.agent-gateway__feature:active {
  transform: scale(0.985);
}
a.agent-gateway__feature:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 3px;
}
.agent-gateway__kicker {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  opacity: 0.88;
}
.agent-gateway__feature .agent-gateway__kicker {
  color: rgba(255, 255, 255, 0.88);
}
.agent-gateway__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.55rem, 2.4vw, 1.95rem);
  font-weight: 700;
  line-height: 1.25;
  color: #ffffff;
}
.agent-gateway__body {
  margin: 0;
  max-width: 28rem;
  color: rgba(255, 255, 255, 0.88);
  font-weight: 400;
  line-height: 1.65;
}
.agent-gateway__cta {
  justify-self: start;
  margin-top: 0.35rem;
  background: #ffffff;
  color: var(--accent-2);
  border-color: transparent;
  box-shadow: 0 8px 20px rgba(8, 40, 70, 0.16);
  pointer-events: none;
}
.agent-gateway__orb {
  position: absolute;
  right: -3rem;
  bottom: -4rem;
  width: 14rem;
  height: 14rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.22) 0%, transparent 68%);
  animation: market-network-pulse 9s ease-in-out infinite;
}
.agent-gateway__mark {
  position: absolute;
  right: 1.6rem;
  bottom: 1.4rem;
  width: 4.5rem;
  height: 4.5rem;
}
.agent-gateway__mark-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.35);
}
.agent-gateway__mark-ring:nth-child(2) {
  inset: 0.65rem;
  border-color: rgba(255, 255, 255, 0.5);
}
.agent-gateway__mark-dot {
  position: absolute;
  inset: 1.55rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.85);
}

.agent-gateway__rail {
  position: relative;
  display: grid;
  gap: 0.7rem;
  align-content: start;
  padding: 1.85rem 1.7rem 1.6rem;
  border-radius: 24px;
  border: 1px solid rgba(176, 200, 220, 0.85);
  background:
    linear-gradient(165deg, #f5fafd 0%, #ffffff 48%, #f8fbfe 100%);
  box-shadow: var(--shadow);
  animation: rise 0.8s ease both;
  overflow: hidden;
}
.agent-gateway__rail .agent-gateway__kicker {
  display: inline-flex;
  justify-self: start;
  padding: 0.28rem 0.65rem;
  border-radius: 6px;
  background: rgba(22, 119, 197, 0.1);
  color: var(--accent-2);
  opacity: 1;
  letter-spacing: 0.04em;
}
.agent-gateway__rail-title {
  margin: 0.15rem 0 0;
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-weight: 700;
  color: #0a2744;
  line-height: 1.3;
}
.agent-gateway__rail-body {
  margin: 0;
  color: var(--ink-soft);
  font-weight: 400;
  line-height: 1.65;
}
.agent-gateway__points {
  list-style: none;
  margin: 0.25rem 0 0.35rem;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.agent-gateway__points li {
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  border: 1px solid rgba(22, 119, 197, 0.2);
  background: rgba(22, 119, 197, 0.06);
  color: var(--accent-2);
  font-size: 0.86rem;
  font-weight: 500;
}
.agent-gateway__link {
  justify-self: start;
  margin-top: 0.35rem;
  color: var(--accent-2);
  font-weight: 600;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  transition: all 0.2s ease;
}
.agent-gateway__link:hover {
  color: var(--accent);
  transform: translateX(3px);
}
.agent-gateway__link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.btn__arrow {
  display: inline-block;
  transition: transform 0.2s ease;
}

/* ??????????????????????????? */
.market-gateway {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
  margin: 1.75rem 0 2.25rem;
  align-items: stretch;
}
a.market-gateway__feature {
  position: relative;
  display: grid;
  gap: 0.75rem;
  align-content: start;
  min-height: 100%;
  padding: 2rem 2rem 5.25rem;
  border-radius: 24px;
  overflow: hidden;
  color: #ffffff;
  text-decoration: none;
  background:
    radial-gradient(420px 220px at 92% 8%, rgba(255, 235, 59, 0.28) 0%, transparent 55%),
    linear-gradient(145deg, #0d5a9c 0%, #1677c5 52%, #3d9adf 100%);
  box-shadow: 0 18px 40px rgba(13, 90, 156, 0.22);
  animation: rise 0.7s ease both;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
a.market-gateway__feature:hover {
  color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 22px 48px rgba(13, 90, 156, 0.28);
  filter: brightness(0.97);
}
a.market-gateway__feature:active {
  transform: scale(0.99);
}
a.market-gateway__feature:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 3px;
}
.market-gateway__orb {
  position: absolute;
  right: -2.5rem;
  bottom: -3rem;
  width: 11rem;
  height: 11rem;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.22);
  box-shadow: inset 0 0 0 18px rgba(255, 255, 255, 0.06);
  pointer-events: none;
  animation: hero-orbit 12s ease-in-out infinite;
}
.market-gateway__chart {
  position: absolute;
  right: 1.6rem;
  bottom: 1.35rem;
  display: flex;
  align-items: flex-end;
  gap: 0.38rem;
  height: 4.75rem;
  padding: 0.55rem 0.65rem 0.45rem;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(4px);
  pointer-events: none;
  z-index: 1;
}
.market-gateway__bar {
  display: block;
  width: 0.55rem;
  border-radius: 4px 4px 2px 2px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 235, 59, 0.75) 100%);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}
.market-gateway__bar:nth-child(1) { height: 38%; }
.market-gateway__bar:nth-child(2) { height: 58%; }
.market-gateway__bar:nth-child(3) { height: 46%; }
.market-gateway__bar:nth-child(4) { height: 78%; }
.market-gateway__bar:nth-child(5) { height: 64%; }
.market-gateway__bar:nth-child(6) { height: 92%; }
.market-gateway__kicker {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.82);
}
.market-gateway__feature .market-gateway__kicker {
  color: rgba(255, 235, 59, 0.95);
}
.market-gateway__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.45rem, 2.4vw, 1.85rem);
  font-weight: 700;
  line-height: 1.3;
  color: #ffffff;
  max-width: none;
}
.market-gateway__body {
  margin: 0 0 0.35rem;
  max-width: 32rem;
  color: rgba(255, 255, 255, 0.88);
  font-size: 1rem;
  line-height: 1.65;
}
.market-gateway__feature .market-gateway__cta,
.market-gateway__feature .btn {
  justify-self: start;
  min-height: 48px;
  padding-inline: 1.55rem;
  font-size: 1.02rem;
  font-weight: 600;
  background: #ffffff;
  color: #0d5a9c;
  border-color: #ffffff;
  pointer-events: none;
  transition: all 0.2s ease;
}
a.market-gateway__feature:hover .market-gateway__cta {
  filter: brightness(0.94);
  background: #f4f8fc;
  color: #0d5a9c;
  transform: translateY(-1px);
}
.market-gateway__rail {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 0.75rem;
  align-content: stretch;
  min-width: 0;
  min-height: 100%;
  padding: 2rem 2rem 1.65rem;
  border-radius: 24px;
  background:
    linear-gradient(165deg, #f0f7fc 0%, #ffffff 48%, #f7fbfe 100%);
  border: 1px solid rgba(150, 186, 214, 0.95);
  box-shadow: 0 12px 36px rgba(15, 70, 120, 0.09);
  animation: rise 0.85s ease both;
  transition: all 0.2s ease;
  overflow: visible;
}
.market-gateway__rail:hover {
  border-color: rgba(22, 119, 197, 0.45);
  box-shadow: var(--shadow-lg);
}
.market-gateway__rail .market-gateway__kicker {
  color: var(--accent);
}
.market-gateway__rail-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2vw, 1.45rem);
  font-weight: 700;
  line-height: 1.35;
  color: #0a2744;
  max-width: none;
  overflow-wrap: anywhere;
}
.market-gateway__steps {
  list-style: none;
  margin: 0.2rem 0 0.35rem;
  padding: 0;
  display: grid;
  gap: 0;
  min-width: 0;
}
.market-gateway__steps li {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 0.65rem 0;
  color: var(--ink-soft);
  font-size: 0.95rem;
  line-height: 1.55;
  min-width: 0;
}
.market-gateway__steps li:not(:last-child)::before {
  content: "";
  position: absolute;
  left: 1.05rem;
  top: 2.45rem;
  bottom: 0;
  width: 2px;
  background: linear-gradient(180deg, rgba(22, 119, 197, 0.45), rgba(22, 119, 197, 0.12));
  border-radius: 1px;
}
.market-gateway__step-index {
  position: relative;
  z-index: 1;
  display: inline-grid;
  place-items: center;
  width: 2.15rem;
  height: 2.15rem;
  flex-shrink: 0;
  border-radius: 50%;
  background: linear-gradient(145deg, #1677c5, #5eb0e8);
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 700;
  box-shadow: 0 4px 12px rgba(22, 119, 197, 0.28);
}
.market-gateway__step-copy {
  display: grid;
  gap: 0.2rem;
  padding-top: 0.15rem;
  min-width: 0;
  flex: 1 1 auto;
}
.market-gateway__step-copy strong {
  color: #0a2744;
  font-weight: 600;
  font-size: 0.98rem;
}
.market-gateway__step-copy span {
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.55;
}
/* ?????????????? */
.market-gateway__rail-mark {
  position: absolute;
  right: 1.25rem;
  bottom: 1.25rem;
  width: 3.25rem;
  height: 3.25rem;
  margin: 0;
  opacity: 0.55;
  pointer-events: none;
}
.market-gateway__rail-mark-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1.5px solid rgba(22, 119, 197, 0.22);
}
.market-gateway__rail-mark-ring:nth-child(2) {
  inset: 0.55rem;
  border-color: rgba(22, 119, 197, 0.35);
}
.market-gateway__rail-mark-dot {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.7rem;
  height: 0.7rem;
  margin: -0.35rem 0 0 -0.35rem;
  border-radius: 50%;
  background: linear-gradient(145deg, #1677c5, #5eb0e8);
  box-shadow: 0 0 0 4px rgba(22, 119, 197, 0.12);
}
.market-gateway__link {
  position: relative;
  z-index: 1;
  justify-self: start;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding-right: 3.5rem;
  color: var(--accent);
  font-weight: 600;
  white-space: nowrap;
  transition: all 0.2s ease;
}
.market-gateway__link:hover {
  color: var(--accent-2);
  filter: brightness(0.92);
  transform: translateY(-1px);
}

.market-capability {
  margin: 2.6rem 0;
  animation: rise 0.8s ease both;
}
.market-capability--band {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-top: 0.5rem;
  margin-bottom: 2.6rem;
  padding: 2.4rem max(1rem, calc((100vw - 1160px) / 2)) 2.2rem;
  background:
    linear-gradient(180deg, #e8f0f6 0%, #f0f5f9 55%, #f4f8fc 100%);
  border-top: 1px solid rgba(176, 200, 220, 0.65);
  border-bottom: 1px solid rgba(176, 200, 220, 0.45);
}
.market-capability__head {
  margin-bottom: 0.85rem;
}

.capability-carousel {
  margin-top: 0.35rem;
  padding: 1.35rem 1.25rem 1.15rem;
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(220, 238, 251, 0.85) 0%, rgba(243, 249, 254, 0.95) 100%);
  border: 1px solid rgba(176, 200, 220, 0.75);
}
.capability-carousel__viewport {
  overflow: hidden;
  border-radius: 18px;
}
.capability-carousel__track {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  transition: transform 0.45s ease;
  will-change: transform;
}
.capability-carousel__slide {
  flex: 0 0 100%;
  min-width: 100%;
  padding: 0.15rem;
}
.capability-carousel__panel {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.25rem 1.5rem;
  align-items: center;
  min-height: 9.5rem;
  padding: 1.6rem 1.7rem;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid rgba(176, 200, 220, 0.65);
  box-shadow: 0 10px 28px rgba(15, 70, 120, 0.06);
}
.capability-carousel__index {
  display: inline-grid;
  place-items: center;
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 700;
  color: #0d5a9c;
  background:
    radial-gradient(circle at 30% 30%, #fff8c4 0%, transparent 50%),
    linear-gradient(145deg, #e8f4fc 0%, #d6ebf8 100%);
  border: 1px solid rgba(22, 119, 197, 0.2);
}
.capability-carousel__copy h3 {
  margin: 0 0 0.45rem;
  font-family: var(--font-display);
  font-size: 1.35rem;
  font-weight: 700;
  color: #0a2744;
}
.capability-carousel__copy p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 1rem;
  line-height: 1.65;
  max-width: 40rem;
}
.capability-carousel__controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  margin-top: 1rem;
}
.capability-carousel__btn {
  display: inline-grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  min-height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(22, 119, 197, 0.28);
  background: #ffffff;
  color: var(--accent);
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  transition: all 0.2s ease;
}
.capability-carousel__btn:hover {
  background: rgba(22, 119, 197, 0.08);
  filter: brightness(0.96);
}
.capability-carousel__btn:active {
  transform: scale(0.98);
}
.capability-carousel__btn:focus-visible,
.capability-carousel__dot:focus-visible,
.market-gateway__link:focus-visible,
.market-marquee__chip:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.capability-carousel__dots {
  display: flex;
  gap: 0.45rem;
  align-items: center;
}
.capability-carousel__dot {
  width: 0.55rem;
  height: 0.55rem;
  padding: 0;
  border: none;
  border-radius: 999px;
  background: rgba(22, 119, 197, 0.28);
  cursor: pointer;
  transition: all 0.2s ease;
}
.capability-carousel__dot.is-active {
  width: 1.35rem;
  background: var(--accent);
}

.market-marquee-section {
  margin: 2.6rem 0;
  animation: rise 0.85s ease both;
}
.market-marquee {
  position: relative;
  margin-top: 0.35rem;
  padding: 1.1rem 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #f4f9fd 0%, #eaf4fb 50%, #f4f9fd 100%);
  border: 1px solid rgba(176, 200, 220, 0.7);
  overflow: hidden;
}
.market-marquee__viewport {
  overflow: hidden;
}
.market-marquee__track {
  display: flex;
  width: max-content;
  animation: market-marquee-scroll 32s linear infinite;
}
.market-marquee:hover .market-marquee__track,
.market-marquee:focus-within .market-marquee__track {
  animation-play-state: paused;
}
.market-marquee.is-static .market-marquee__track {
  animation: none;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
  gap: 0.55rem;
  padding: 0 1rem;
}
.market-marquee.is-static .market-marquee__group[aria-hidden="true"] {
  display: none;
}
.market-marquee__group {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0 0.35rem;
  gap: 0.7rem;
}
.market-marquee__chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.35rem 1.15rem;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid rgba(22, 119, 197, 0.22);
  color: var(--ink);
  font-weight: 500;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(15, 70, 120, 0.05);
  transition: all 0.2s ease;
}
.market-marquee__chip:hover {
  color: #ffffff;
  background: var(--accent);
  border-color: var(--accent);
  filter: brightness(0.96);
}
.market-marquee__chip:active {
  transform: scale(0.98);
}
.market-marquee__fade {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 3.5rem;
  z-index: 1;
  pointer-events: none;
}
.market-marquee__fade--left {
  left: 0;
  background: linear-gradient(90deg, #f4f9fd 0%, transparent 100%);
}
.market-marquee__fade--right {
  right: 0;
  background: linear-gradient(270deg, #f4f9fd 0%, transparent 100%);
}
.market-marquee__hint {
  margin: 0.85rem 0 0;
  text-align: center;
  font-size: 0.88rem;
}

@keyframes market-marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (max-width: 1024px) {
  .market-gateway {
    grid-template-columns: 1fr;
  }
  .market-hero__network {
    width: min(320px, 58vw);
    opacity: 0.65;
  }
}

@media (max-width: 768px) {
  .capability-carousel__panel {
    grid-template-columns: 1fr;
    justify-items: start;
    min-height: 0;
    gap: 0.85rem;
  }
  a.market-gateway__feature,
  .market-gateway__rail {
    padding: 1.5rem 1.35rem;
  }
  a.market-gateway__feature {
    padding-bottom: 5rem;
  }
  .market-gateway__chart {
    right: 1.1rem;
    bottom: 1rem;
    height: 3.75rem;
  }
  .market-gateway__link {
    padding-right: 3rem;
    white-space: normal;
  }
  .market-hero__network {
    display: none;
  }
  .market-hero__count {
    font-size: 1.2rem;
  }
  .market-capability--band {
    padding-top: 1.85rem;
    padding-bottom: 1.75rem;
  }
  .market-marquee {
    border-radius: 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .market-gateway__orb,
  .about-markets__orb,
  .market-hero__network,
  .agent-home-hero__network,
  .about-hero__network,
  .agent-gateway__orb,
  .market-marquee__track,
  .capability-carousel__track {
    animation: none !important;
  }
  .capability-carousel__track {
    transition: none !important;
  }
}

.agent-overview,
.agent-scenarios,
.agent-advantage,
.agent-listings,
.agent-partner,
.about-mission,
.about-features,
.about-markets,
.about-values,
.about-contact {
  margin: 2.6rem 0;
  animation: rise 0.8s ease both;
}

/* ????????? + ?????????????? */
.agent-overview--band {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-top: 0.35rem;
  margin-bottom: 2.6rem;
  padding: 2.75rem max(1rem, calc((100vw - 1160px) / 2)) 2.6rem;
  background:
    linear-gradient(180deg, #e8f0f6 0%, #f0f5f9 55%, #f4f8fc 100%);
  border-block: 1px solid rgba(176, 200, 220, 0.45);
  position: relative;
}
.agent-overview--band::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(rgba(22, 119, 197, 0.08) 1px, transparent 1px);
  background-size: 22px 22px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.4), transparent 92%);
  pointer-events: none;
}
.agent-overview--band > * {
  position: relative;
  z-index: 1;
}

.agent-overview__lead {
  margin: 0 0 1.5rem;
  max-width: 42rem;
  color: var(--ink-soft);
  font-size: 1.05rem;
  font-weight: 400;
  line-height: 1.7;
}

.agent-pillars {
  list-style: none;
  margin: 0 0 2.25rem;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
}
.agent-pillars__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1.15rem 1.1rem 1.2rem;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(176, 200, 220, 0.55);
  box-shadow: 0 8px 22px rgba(15, 70, 120, 0.05);
  transition: all 0.2s ease;
}
.agent-pillars__item:hover {
  transform: translateY(-2px);
  border-color: rgba(22, 119, 197, 0.35);
  box-shadow: 0 12px 28px rgba(15, 70, 120, 0.08);
}
.agent-pillars__icon {
  flex-shrink: 0;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 10px;
  background-color: rgba(22, 119, 197, 0.1);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.2rem 1.2rem;
}
.agent-pillars__icon--compliance {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d5a9c' stroke-width='1.85' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 4.5-3 7.5-7 9-4-1.5-7-4.5-7-9V6l7-3z'/%3E%3Cpath d='M9.5 12l1.8 1.8L15 10'/%3E%3C/svg%3E");
}
.agent-pillars__icon--value {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d5a9c' stroke-width='1.85' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 8v8M9.5 10.5c.4-1 1.4-1.5 2.5-1.5s2.1.6 2.5 1.5c.3.8-.2 1.5-1.2 1.8l-2.6.9c-1 .3-1.5 1-1.2 1.8.4 1 1.4 1.5 2.5 1.5s2.1-.5 2.5-1.5'/%3E%3C/svg%3E");
}
.agent-pillars__icon--discover {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d5a9c' stroke-width='1.85' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M16 16l4 4'/%3E%3C/svg%3E");
}
.agent-pillars__icon--trial {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d5a9c' stroke-width='1.85' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3Crect x='5' y='7' width='14' height='14' rx='2'/%3E%3Cpath d='M9.5 13.5l1.8 1.8 3.4-3.6'/%3E%3C/svg%3E");
}
.agent-pillars__label {
  font-family: var(--font-display);
  font-size: 1.02rem;
  font-weight: 700;
  color: #0a2744;
  line-height: 1.3;
}

.agent-pain {
  margin-top: 0.25rem;
  padding-top: 1.75rem;
  border-top: 1px solid rgba(176, 200, 220, 0.65);
}
.agent-pain__head {
  margin-bottom: 1.15rem;
}
.agent-pain h3,
.agent-pain__head h3 {
  margin: 0 0 0.4rem;
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 700;
  color: #0a2744;
}
.agent-pain__hint {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.95rem;
  font-weight: 400;
  line-height: 1.55;
}
.agent-pain__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.9rem;
  counter-reset: none;
}
.agent-pain__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1.4fr);
  gap: 1rem;
  align-items: center;
  padding: 1.25rem 1.35rem;
  background: #ffffff;
  border-radius: 16px;
  border: 1px solid rgba(176, 200, 220, 0.75);
  box-shadow: 0 8px 24px rgba(15, 70, 120, 0.045);
  transition: all 0.2s ease;
}
.agent-pain__item:hover {
  border-color: rgba(22, 119, 197, 0.35);
  box-shadow: 0 12px 30px rgba(15, 70, 120, 0.08);
}
.agent-pain__index {
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", "SF Mono", Consolas, monospace;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 0.04em;
  line-height: 1;
  opacity: 0.85;
}
.agent-pain__side {
  display: grid;
  gap: 0.4rem;
  align-content: start;
}
.agent-pain__badge {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  padding: 0.18rem 0.5rem;
  border-radius: 4px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.3;
  color: #8a4b16;
  background: rgba(196, 120, 52, 0.12);
}
.agent-pain__badge--ok {
  color: #0f6b4a;
  background: rgba(26, 155, 110, 0.12);
}
.agent-pain__title {
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 700;
  color: #1a2f44;
  line-height: 1.4;
}
.agent-pain__action {
  margin: 0;
  padding: 0.7rem 0.85rem;
  border-radius: 10px;
  background: rgba(26, 155, 110, 0.07);
  color: #556778;
  font-size: 0.95rem;
  font-weight: 400;
  line-height: 1.6;
}
.agent-pain__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: rgba(22, 119, 197, 0.1);
  color: var(--accent-2);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1;
}

.agent-scenario-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0 0 1.25rem;
}
.agent-scenario-nav__link {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0.35rem 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: var(--ink-soft);
  font-size: 0.9rem;
  transition: all 0.2s ease;
}
.agent-scenario-nav__link:hover {
  color: var(--accent);
  background: rgba(22, 119, 197, 0.08);
}
.agent-scenario-nav__link.is-active {
  color: #ffffff;
  background: var(--accent);
  border-color: var(--accent);
  font-weight: 500;
}

.agent-showcase {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.agent-showcase__item {
  display: grid;
  gap: 0.45rem;
  align-content: start;
  padding: 1.3rem 1.35rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #ffffff;
  box-shadow: var(--shadow);
  transition: all 0.2s ease;
}
.agent-showcase__item:hover {
  border-color: rgba(22, 119, 197, 0.4);
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}
.agent-showcase__scenario {
  margin: 0;
  color: var(--accent);
  font-size: 0.82rem;
  font-weight: 500;
}
.agent-showcase__name {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.15rem;
}
.agent-showcase__tags,
.agent-showcase__summary {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.6;
}
.agent-showcase__tags {
  font-size: 0.88rem;
}
.agent-showcase__provider {
  margin: 0;
  font-size: 0.82rem;
}
.agent-showcase__item .btn {
  justify-self: start;
  margin-top: 0.35rem;
  min-height: 44px;
}

.agent-advantage__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.15rem;
}
.agent-advantage__item {
  display: grid;
  gap: 0.55rem;
  align-content: start;
  padding: 1.55rem 1.45rem 1.5rem;
  border-radius: 16px;
  border: 1px solid rgba(176, 200, 220, 0.75);
  background:
    linear-gradient(180deg, #ffffff 0%, #f8fbfe 100%);
  box-shadow: 0 10px 28px rgba(15, 70, 120, 0.05);
  transition: all 0.2s ease;
}
.agent-advantage__item:hover {
  transform: translateY(-3px);
  border-color: rgba(22, 119, 197, 0.35);
  box-shadow: 0 16px 36px rgba(15, 70, 120, 0.1);
}
.agent-advantage__index {
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", "SF Mono", Consolas, monospace;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--accent);
  opacity: 0.8;
}
.agent-advantage__item h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 700;
  color: #0a2744;
}
.agent-advantage__item p {
  margin: 0;
  color: var(--ink-soft);
  font-weight: 400;
  line-height: 1.65;
}

.agent-listings__head {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.agent-listings__stat {
  text-align: right;
}
.agent-listings__filters {
  margin-top: 0;
}

.agent-partner {
  display: flex;
  flex-wrap: wrap;
  gap: 1.35rem;
  align-items: center;
  justify-content: space-between;
  margin-top: 2.8rem;
  margin-bottom: 1rem;
  padding: 2.1rem 2rem;
  border-radius: 20px;
  border: 1px solid rgba(22, 119, 197, 0.28);
  background:
    radial-gradient(520px 220px at 100% 0%, rgba(94, 176, 232, 0.35) 0%, transparent 60%),
    linear-gradient(120deg, #0d5a9c 0%, #1677c5 48%, #2a8ad4 100%);
  color: #ffffff;
  box-shadow: 0 18px 42px rgba(13, 90, 156, 0.22);
}
.agent-partner__copy {
  flex: 1 1 18rem;
}
.agent-partner__copy h2 {
  margin: 0 0 0.5rem;
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 2.2vw, 1.65rem);
  color: #ffffff;
}
.agent-partner__copy p {
  margin: 0;
  color: rgba(255, 255, 255, 0.88);
  font-weight: 400;
  line-height: 1.65;
  max-width: 40rem;
}
.agent-partner__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}
.agent-partner__actions .btn {
  min-height: 44px;
}
.agent-partner__actions .btn-accent {
  background: #ffffff;
  color: var(--accent-2);
  box-shadow: 0 8px 20px rgba(8, 40, 70, 0.18);
}
.agent-partner__actions .btn-accent:hover {
  background: #f0f7fc;
  color: var(--accent-2);
  filter: none;
}
.agent-partner__actions .btn-ghost {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.55);
  color: #ffffff;
}
.agent-partner__actions .btn-ghost:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: #ffffff;
  color: #ffffff;
}

/* ?????Hero ?? + ??? / ??? / ??? / ??? */
.about-hero {
  background:
    radial-gradient(900px 420px at 88% 18%, rgba(64, 156, 220, 0.4) 0%, transparent 58%),
    radial-gradient(700px 380px at 8% 90%, rgba(13, 90, 156, 0.2) 0%, transparent 55%),
    linear-gradient(135deg, #c8e4f7 0%, #dceefb 38%, #eef6fc 72%, #f4f9fd 100%);
}
.about-hero h1 {
  max-width: 14ch;
}
.about-hero__network {
  position: absolute;
  right: max(-1rem, calc((100vw - 1160px) / 2 - 1.5rem));
  top: 10%;
  width: min(420px, 44vw);
  height: auto;
  color: rgba(13, 90, 156, 0.36);
  pointer-events: none;
  z-index: -1;
  animation: market-network-pulse 8s ease-in-out infinite;
}
.about-hero__network-nodes circle:nth-child(odd) {
  opacity: 0.85;
}
.about-hero__network-nodes circle:nth-child(even) {
  opacity: 0.55;
}
.about-hero__cta .about-hero__cta-arrow {
  display: inline-block;
  transition: transform 0.2s ease;
}
.about-hero__cta:hover {
  transform: translateY(-3px);
  filter: brightness(0.96);
}
.about-hero__cta:hover .about-hero__cta-arrow {
  transform: translateX(3px);
}
.about-hero__cta:active {
  transform: scale(0.98);
}

.about-mission--band {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-top: 0.35rem;
  margin-bottom: 2.6rem;
  padding: 2.75rem max(1rem, calc((100vw - 1160px) / 2)) 2.6rem;
  background:
    linear-gradient(180deg, #e8f0f6 0%, #f0f5f9 55%, #f4f8fc 100%);
  border-block: 1px solid rgba(176, 200, 220, 0.45);
  position: relative;
}
.about-mission--band::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(22, 119, 197, 0.08) 1px, transparent 1px);
  background-size: 22px 22px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.4), transparent 92%);
  pointer-events: none;
}
.about-mission--band > * {
  position: relative;
  z-index: 1;
}
.about-mission__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: 1.35rem;
  align-items: stretch;
  margin-bottom: 2rem;
}
.about-intro__body {
  display: grid;
  gap: 0;
  max-width: none;
  padding: 1.6rem 1.55rem;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(176, 200, 220, 0.65);
  box-shadow: 0 10px 28px rgba(15, 70, 120, 0.05);
}
.about-intro__body p {
  margin: 0 0 1.5rem;
  color: var(--ink-soft);
  font-size: 1.02rem;
  line-height: 1.75;
}
.about-intro__body p:last-child {
  margin-bottom: 0;
}
.about-mission__aside {
  display: grid;
  align-content: start;
  gap: 0.65rem;
  padding: 1.7rem 1.55rem;
  border-radius: 18px;
  background:
    radial-gradient(280px 160px at 100% 0%, rgba(94, 176, 232, 0.28) 0%, transparent 60%),
    linear-gradient(155deg, #0d5a9c 0%, #1677c5 55%, #2a8ad4 100%);
  color: #ffffff;
  box-shadow: 0 16px 36px rgba(13, 90, 156, 0.2);
}
.about-mission__aside-kicker {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.78);
}
.about-mission__aside-line {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 2vw, 1.45rem);
  font-weight: 700;
  line-height: 1.35;
  color: #ffffff;
}
.about-mission__aside-note {
  margin: 0.55rem 0 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.95rem;
  line-height: 1.65;
}

.about-lifecycle {
  padding-top: 1.65rem;
  border-top: 1px solid rgba(176, 200, 220, 0.65);
}
.about-lifecycle__head {
  margin-bottom: 1.15rem;
}
.about-lifecycle__head h3 {
  margin: 0 0 0.35rem;
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 700;
  color: #0a2744;
}
.about-lifecycle__hint {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.95rem;
  line-height: 1.55;
}
.about-lifecycle__track {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.75rem;
}
.about-lifecycle__step {
  position: relative;
  display: grid;
  gap: 0.4rem;
  align-content: start;
  padding: 1.15rem 1.05rem 1.2rem;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(176, 200, 220, 0.6);
  box-shadow: 0 8px 22px rgba(15, 70, 120, 0.05);
  transition: all 0.2s ease;
}
.about-lifecycle__step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 1.55rem;
  right: -0.55rem;
  width: 0.55rem;
  height: 2px;
  background: linear-gradient(90deg, rgba(22, 119, 197, 0.45), rgba(22, 119, 197, 0.12));
  z-index: 1;
}
.about-lifecycle__step:hover {
  transform: translateY(-2px);
  border-color: rgba(22, 119, 197, 0.35);
  box-shadow: 0 12px 28px rgba(15, 70, 120, 0.08);
}
.about-lifecycle__index {
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", "SF Mono", Consolas, monospace;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--accent);
  opacity: 0.85;
}
.about-lifecycle__label {
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 700;
  color: #0a2744;
  line-height: 1.3;
}
.about-lifecycle__desc {
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.55;
}

.about-features--band {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-top: 0.5rem;
  margin-bottom: 2.6rem;
  padding: 2.4rem max(1rem, calc((100vw - 1160px) / 2)) 2.2rem;
  background:
    linear-gradient(180deg, #e8f0f6 0%, #f0f5f9 55%, #f4f8fc 100%);
  border-block: 1px solid rgba(176, 200, 220, 0.45);
}

.about-markets__bento {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 1.15rem;
  align-items: stretch;
}
a.about-markets__feature {
  position: relative;
  display: grid;
  gap: 0.7rem;
  align-content: start;
  min-height: 100%;
  padding: 2rem 2rem 5.5rem;
  overflow: hidden;
  border-radius: 24px;
  color: #ffffff;
  text-decoration: none;
  background:
    radial-gradient(420px 220px at 92% 8%, rgba(255, 235, 59, 0.26) 0%, transparent 55%),
    linear-gradient(145deg, #0d5a9c 0%, #1677c5 52%, #3d9adf 100%);
  box-shadow: 0 18px 40px rgba(13, 90, 156, 0.22);
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
a.about-markets__feature:hover {
  color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 22px 48px rgba(13, 90, 156, 0.28);
  filter: brightness(0.97);
}
a.about-markets__feature:active {
  transform: scale(0.99);
}
a.about-markets__feature:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 3px;
}
.about-markets__kicker {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: rgba(255, 235, 59, 0.95);
}
.about-markets__feature h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.45rem, 2.4vw, 1.85rem);
  font-weight: 700;
  line-height: 1.3;
  color: #ffffff;
}
.about-markets__feature > p {
  margin: 0 0 0.35rem;
  max-width: 32rem;
  color: rgba(255, 255, 255, 0.88);
  font-size: 1rem;
  line-height: 1.65;
}
.about-markets__feature .about-markets__cta {
  justify-self: start;
  min-height: 48px;
  padding-inline: 1.55rem;
  font-size: 1.02rem;
  font-weight: 600;
  background: #ffffff;
  color: #0d5a9c;
  border-color: #ffffff;
  pointer-events: none;
  transition: all 0.2s ease;
}
a.about-markets__feature:hover .about-markets__cta {
  filter: brightness(0.94);
  background: #f4f8fc;
  transform: translateY(-1px);
}
.about-markets__orb {
  position: absolute;
  right: -2.5rem;
  bottom: -3rem;
  width: 11rem;
  height: 11rem;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.22);
  box-shadow: inset 0 0 0 18px rgba(255, 255, 255, 0.06);
  pointer-events: none;
  animation: hero-orbit 12s ease-in-out infinite;
}
.about-markets__stack {
  display: grid;
  gap: 1rem;
  min-height: 100%;
}
a.about-markets__rail {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.9rem;
  align-items: center;
  min-height: 44px;
  padding: 1.35rem 1.4rem;
  border-radius: 18px;
  background: linear-gradient(165deg, #f0f7fc 0%, #ffffff 48%, #f7fbfe 100%);
  border: 1px solid rgba(150, 186, 214, 0.95);
  box-shadow: 0 12px 32px rgba(15, 70, 120, 0.07);
  color: inherit;
  text-decoration: none;
  transition: all 0.2s ease;
}
a.about-markets__rail:hover {
  color: inherit;
  border-color: rgba(22, 119, 197, 0.45);
  box-shadow: var(--shadow-lg);
  transform: translateY(-2px);
  filter: brightness(0.99);
}
a.about-markets__rail:active {
  transform: scale(0.98);
}
a.about-markets__rail:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
.about-markets__rail-index {
  display: inline-grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", "SF Mono", Consolas, monospace;
  font-size: 0.82rem;
  font-weight: 700;
  color: #ffffff;
  background: linear-gradient(145deg, #1677c5, #5eb0e8);
  box-shadow: 0 4px 12px rgba(22, 119, 197, 0.28);
}
.about-markets__rail-copy {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.about-markets__rail-copy h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.08rem;
  font-weight: 700;
  color: #0a2744;
}
.about-markets__rail-copy p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.55;
}
.about-markets__rail-arrow {
  color: var(--accent);
  font-size: 1.15rem;
  font-weight: 600;
  transition: transform 0.2s ease;
}
a.about-markets__rail:hover .about-markets__rail-arrow {
  transform: translateX(3px);
}

.about-values--band {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 2.4rem max(1rem, calc((100vw - 1160px) / 2)) 2.2rem;
  background:
    linear-gradient(180deg, #e8f0f6 0%, #f0f5f9 55%, #f4f8fc 100%);
  border-block: 1px solid rgba(176, 200, 220, 0.45);
}
.about-values__strip {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-radius: 20px;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(176, 200, 220, 0.75);
  box-shadow: 0 12px 32px rgba(15, 70, 120, 0.06);
}
.about-values__cell {
  display: grid;
  gap: 0.55rem;
  align-content: start;
  padding: 1.7rem 1.45rem 1.65rem;
  border-right: 1px solid rgba(176, 200, 220, 0.65);
  transition: background 0.2s ease;
}
.about-values__cell:last-child {
  border-right: none;
}
.about-values__cell:hover {
  background: rgba(22, 119, 197, 0.04);
}
.about-values__word {
  font-family: var(--font-display);
  font-size: clamp(1.45rem, 2.2vw, 1.75rem);
  font-weight: 700;
  line-height: 1.2;
  color: #0a2744;
  letter-spacing: 0.06em;
}
.about-values__line {
  color: var(--ink-soft);
  font-size: 0.98rem;
  line-height: 1.6;
}

.about-contact__company {
  margin: 0 0 1.25rem;
  font-size: 0.95rem;
  line-height: 1.6;
}
.about-contact__company a {
  color: var(--accent);
  font-weight: 600;
  transition: all 0.2s ease;
}
.about-contact__company a:hover {
  filter: brightness(0.92);
}
.about-contact__company a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.about-contact__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}
a.about-contact__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  padding: 1.15rem 1.25rem;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid rgba(176, 200, 220, 0.7);
  box-shadow: 0 8px 22px rgba(15, 70, 120, 0.04);
  color: inherit;
  text-decoration: none;
  transition: all 0.2s ease;
}
a.about-contact__row:hover {
  color: inherit;
  border-color: rgba(22, 119, 197, 0.4);
  box-shadow: 0 12px 28px rgba(15, 70, 120, 0.08);
  filter: brightness(0.99);
}
a.about-contact__row:active {
  transform: scale(0.99);
}
a.about-contact__row:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
.about-contact__badge {
  display: inline-grid;
  place-items: center;
  min-width: 3.1rem;
  min-height: 2.4rem;
  padding: 0.3rem 0.55rem;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #0d5a9c;
  background: rgba(22, 119, 197, 0.1);
}
.about-contact__badge--buyer {
  color: #0f6b4a;
  background: rgba(26, 155, 110, 0.12);
}
.about-contact__badge--tech {
  color: #6b4f12;
  background: rgba(196, 155, 52, 0.14);
}
.about-contact__copy {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.about-contact__copy h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.08rem;
  font-weight: 700;
  color: #0a2744;
}
.about-contact__copy p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.95rem;
  line-height: 1.55;
}
.about-contact__btn {
  min-height: 44px;
  pointer-events: none;
  white-space: nowrap;
}

@media (max-width: 1024px) {
  .agent-advantage__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .about-markets__bento {
    grid-template-columns: 1fr;
  }
  .about-values__strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .about-values__cell:nth-child(2n) {
    border-right: none;
  }
  .about-values__cell:nth-child(-n+2) {
    border-bottom: 1px solid rgba(176, 200, 220, 0.65);
  }
  .about-mission__layout {
    grid-template-columns: 1fr;
  }
  .about-lifecycle__track {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .about-lifecycle__step:not(:last-child)::after {
    display: none;
  }
  .agent-pillars {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .agent-gateway {
    grid-template-columns: 1fr;
  }
  .agent-pain__item {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem 1rem;
  }
  .agent-pain__index {
    grid-row: 1 / span 3;
    align-self: start;
    margin-top: 0.2rem;
  }
  .agent-pain__arrow {
    display: none;
  }
  .agent-pain__side--solution {
    grid-column: 2;
  }
}

@media (max-width: 768px) {
  .agent-showcase,
  .agent-advantage__grid,
  .about-lifecycle__track {
    grid-template-columns: 1fr;
  }
  .about-values__strip {
    grid-template-columns: 1fr;
  }
  .about-values__cell {
    border-right: none;
    border-bottom: 1px solid rgba(176, 200, 220, 0.65);
  }
  .about-values__cell:last-child {
    border-bottom: none;
  }
  a.about-contact__row {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem 1rem;
  }
  .about-contact__btn {
    grid-column: 2;
    justify-self: start;
  }
  a.about-markets__feature {
    padding: 1.5rem 1.35rem 5rem;
  }
  .agent-pillars {
    grid-template-columns: 1fr 1fr;
  }
  .agent-pain__item {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .agent-overview--band,
  .about-mission--band,
  .about-features--band,
  .about-values--band {
    padding-top: 2rem;
    padding-bottom: 1.85rem;
  }
  .agent-hero,
  .about-hero {
    padding-top: 3.2rem;
    padding-bottom: 2.6rem;
  }
  .agent-hero::after {
    width: 240px;
    height: 240px;
    opacity: 0.55;
  }
  .agent-home-hero__network,
  .about-hero__network {
    opacity: 0.45;
    width: min(280px, 70vw);
  }
  .agent-hero h1,
  .about-hero h1 {
    max-width: none;
  }
  .agent-partner {
    align-items: stretch;
  }
  .agent-partner__actions {
    width: 100%;
  }
  .agent-partner__actions .btn {
    flex: 1 1 auto;
  }
  a.agent-gateway__feature {
    padding-bottom: 4.5rem;
  }
}

/* ?? ????????????????/API ??? ?? */
.agent-product-hero {
  margin: 0 0 1.75rem;
  padding: 1.5rem 0 0.25rem;
}
.agent-product-hero__crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
  margin: 0 0 0.85rem;
  font-size: 0.88rem;
}
.agent-product-hero__crumb a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
.agent-product-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0 0 0.75rem;
}
.agent-product-hero h1 {
  margin: 0 0 0.75rem;
  font-family: var(--font-display);
  font-size: clamp(1.7rem, 2.4vw, 2.25rem);
  line-height: 1.25;
}
.agent-product-hero__desc {
  margin: 0 0 1rem;
  max-width: 46rem;
  color: var(--ink-soft);
  font-size: 1.05rem;
  line-height: 1.65;
}
.agent-product-hero__provider {
  margin: 0.85rem 0 0;
}
.agent-product-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.agent-product-tags__item {
  padding: 0.28rem 0.65rem;
  border: 1px solid var(--line);
  border-radius: 0.35rem;
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink-soft);
  font-size: 0.84rem;
}
.agent-product-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(18rem, 0.9fr);
  gap: 1.35rem;
  align-items: start;
  margin-bottom: 2.5rem;
}
.agent-product-main {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.agent-product-panel {
  padding: 1.25rem 1.35rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
}
.agent-product-panel__head {
  margin: 0 0 0.85rem;
}
.agent-product-panel__head h2,
.agent-product-panel h2,
.agent-product-contact h2,
.agent-product-inquire h2 {
  margin: 0 0 0.65rem;
  font-family: var(--font-display);
  font-size: 1.15rem;
}
.agent-product-panel--note {
  background: rgba(244, 241, 234, 0.55);
}
.agent-product-steps {
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.agent-product-steps li {
  display: grid;
  gap: 0.2rem;
  padding: 0.75rem 0.9rem;
  border-left: 3px solid var(--accent);
  background: rgba(255, 255, 255, 0.85);
}
.agent-product-steps span {
  color: var(--ink-soft);
  line-height: 1.55;
}
.agent-product-boundary {
  margin: 0;
  padding-left: 1.15rem;
  color: var(--ink-soft);
  line-height: 1.65;
}
.agent-product-boundary li {
  margin-bottom: 0.45rem;
}
.agent-product-aside {
  position: sticky;
  top: 4.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.agent-product-contact,
.agent-product-inquire {
  padding: 1.2rem 1.25rem 1.35rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
}
.agent-product-contact__list {
  margin: 0 0 0.85rem;
  display: grid;
  gap: 0.65rem;
}
.agent-product-contact__list > div {
  display: grid;
  grid-template-columns: 3.5rem minmax(0, 1fr);
  gap: 0.5rem;
  align-items: baseline;
}
.agent-product-contact__list dt {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.85rem;
}
.agent-product-contact__list dd {
  margin: 0;
  word-break: break-word;
}
.agent-product-contact__mail {
  width: 100%;
  justify-content: center;
  min-height: 44px;
}
.agent-product-contact__source {
  margin: 0.85rem 0 0;
  font-size: 0.88rem;
}
.agent-product-inquire__lead {
  margin: 0 0 1rem;
  line-height: 1.55;
}
.agent-inquire-form {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}
.agent-inquire-form .field input,
.agent-inquire-form .field select,
.agent-inquire-form .field textarea {
  width: 100%;
}
.agent-inquire-form .field input.is-err,
.agent-inquire-form .field select.is-err,
.agent-inquire-form .field textarea.is-err {
  border-color: #b42318;
}
.agent-inquire-form .req {
  color: #b42318;
}
.field-error {
  margin: 0;
  color: #b42318;
  font-size: 0.82rem;
  line-height: 1.4;
}
.agent-inquire-form__submit {
  width: 100%;
  min-height: 44px;
  justify-content: center;
  position: relative;
}
.agent-inquire-form__submit .btn-spinner {
  width: 1rem;
  height: 1rem;
  margin-left: 0.5rem;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: agent-spin 0.7s linear infinite;
}
@keyframes agent-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 1024px) {
  .agent-product-layout {
    grid-template-columns: 1fr;
  }
  .agent-product-aside {
    position: static;
  }
}

/* 隐私政策 / 用户协议 */
.legal-shell {
  display: grid;
  gap: 1.5rem;
  padding: 0 0 3.5rem;
  animation: rise 0.55s ease both;
}
.legal-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.25rem 2rem;
  align-items: end;
  padding: 1.75rem 1.85rem;
  border: 1px solid rgba(176, 200, 220, 0.75);
  border-radius: 20px;
  background:
    linear-gradient(125deg, rgba(22, 119, 197, 0.12) 0%, transparent 38%),
    linear-gradient(180deg, #ffffff 0%, #eef5fb 100%);
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}
.legal-hero::before {
  content: "";
  position: absolute;
  inset: auto -8% -40% auto;
  width: min(280px, 45vw);
  height: min(280px, 45vw);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(22, 119, 197, 0.14), transparent 68%);
  pointer-events: none;
}
.legal-hero__copy {
  position: relative;
  z-index: 1;
  min-width: 0;
}
.legal-hero__eyebrow {
  margin: 0 0 0.45rem;
  color: var(--accent-2);
  font-weight: 650;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: 0.78rem;
}
.legal-hero h1 {
  margin: 0 0 0.55rem;
  font-family: var(--font-display);
  font-size: clamp(1.9rem, 3.6vw, 2.55rem);
  line-height: 1.2;
  color: var(--ink);
  letter-spacing: -0.02em;
}
.legal-hero__lead {
  margin: 0 0 1.1rem;
  max-width: 36rem;
  color: var(--ink-soft);
  font-size: 1.02rem;
  line-height: 1.65;
}
.legal-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.5rem;
  margin: 0;
}
.legal-hero__meta > div {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}
.legal-hero__meta dt {
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.legal-hero__meta dd {
  margin: 0;
  color: var(--ink);
  font-weight: 600;
  font-size: 0.95rem;
}
.legal-hero__switch {
  position: relative;
  z-index: 1;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  padding: 0.3rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(176, 200, 220, 0.7);
  align-self: start;
}
.legal-hero__switch-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0.4rem 1.05rem;
  border-radius: 999px;
  color: var(--ink-soft);
  text-decoration: none;
  font-weight: 500;
  font-size: 0.92rem;
  transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease;
}
.legal-hero__switch-link:hover {
  color: var(--accent);
  background: rgba(22, 119, 197, 0.08);
}
.legal-hero__switch-link:active {
  transform: scale(0.98);
}
.legal-hero__switch-link.is-active {
  background: var(--accent);
  color: #fff;
  font-weight: 650;
}
.legal-hero__switch-link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.legal-layout {
  display: grid;
  grid-template-columns: minmax(11rem, 14rem) minmax(0, 1fr);
  gap: 1.5rem 2rem;
  align-items: start;
}
.legal-toc {
  position: sticky;
  top: 5.5rem;
  padding: 1rem 0.85rem;
  border-radius: 16px;
  border: 1px solid rgba(176, 200, 220, 0.7);
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfe 100%);
  box-shadow: 0 8px 24px rgba(15, 70, 120, 0.04);
}
.legal-toc__title {
  margin: 0 0.4rem 0.65rem;
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.legal-toc__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.15rem;
  counter-reset: legal-toc;
}
.legal-toc__list li {
  counter-increment: legal-toc;
}
.legal-toc__list a {
  display: grid;
  grid-template-columns: 1.4rem minmax(0, 1fr);
  gap: 0.35rem;
  align-items: baseline;
  padding: 0.45rem 0.5rem;
  border-radius: 10px;
  color: var(--ink-soft);
  text-decoration: none;
  font-size: 0.9rem;
  line-height: 1.4;
  transition: background 0.15s ease, color 0.15s ease;
}
.legal-toc__list a::before {
  content: counter(legal-toc, decimal-leading-zero);
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  color: rgba(22, 119, 197, 0.7);
}
.legal-toc__list a:hover {
  background: rgba(22, 119, 197, 0.08);
  color: var(--accent);
}
.legal-toc__list a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
.legal-doc {
  min-width: 0;
  padding: 1.6rem 1.75rem 1.85rem;
  border-radius: 18px;
  border: 1px solid rgba(176, 200, 220, 0.7);
  background: #ffffff;
  box-shadow: var(--shadow);
  color: var(--ink-soft);
  font-size: 1rem;
  line-height: 1.75;
}
.legal-doc__lead {
  margin: 0 0 1.75rem;
  padding-bottom: 1.35rem;
  border-bottom: 1px solid rgba(176, 200, 220, 0.55);
  color: var(--ink);
  font-size: 1.05rem;
  line-height: 1.75;
}
.legal-doc__section {
  margin: 0 0 1.85rem;
  scroll-margin-top: 5.75rem;
}
.legal-doc__section:last-child {
  margin-bottom: 0;
}
.legal-doc__section h2 {
  display: flex;
  align-items: baseline;
  gap: 0.65rem;
  margin: 0 0 0.9rem;
  font-family: var(--font-display);
  font-size: 1.22rem;
  line-height: 1.35;
  color: var(--ink);
  letter-spacing: -0.01em;
}
.legal-doc__index {
  flex-shrink: 0;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--accent);
  opacity: 0.85;
}
.legal-doc__section h3 {
  margin: 1.15rem 0 0.55rem;
  font-size: 1.02rem;
  color: var(--ink);
}
.legal-doc__section p {
  margin: 0 0 0.85rem;
}
.legal-doc__section ul,
.legal-doc__section ol {
  margin: 0 0 0.95rem;
  padding-left: 1.25rem;
}
.legal-doc__section li {
  margin-bottom: 0.5rem;
}
.legal-doc__section li:last-child {
  margin-bottom: 0;
}
.legal-doc__section a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.legal-doc__section a:hover {
  filter: brightness(0.9);
}
.legal-doc__section--contact {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(176, 200, 220, 0.55);
}
.legal-doc__contact {
  list-style: none;
  margin: 0 0 1.15rem;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}
.legal-doc__contact li {
  display: grid;
  grid-template-columns: 5.5rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: baseline;
  margin: 0;
  padding: 0.7rem 0.85rem;
  border-radius: 12px;
  background: linear-gradient(180deg, #f7fbfe 0%, #f0f7fc 100%);
  border: 1px solid rgba(176, 200, 220, 0.55);
}
.legal-doc__contact-label {
  font-size: 0.78rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
}
.legal-doc__note {
  margin: 0;
  padding: 0.95rem 1.05rem;
  border-radius: 12px;
  border-left: 3px solid rgba(22, 119, 197, 0.5);
  background: rgba(22, 119, 197, 0.06);
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.65;
}

.auth-agree {
  margin-top: 0.35rem;
}
.auth-agree__label {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--ink-soft);
  cursor: pointer;
  font-weight: 400;
}
.auth-agree__label input[type="checkbox"] {
  width: 1.1rem;
  height: 1.1rem;
  margin-top: 0.2rem;
  flex-shrink: 0;
  accent-color: var(--accent);
  cursor: pointer;
}
.auth-agree__label a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.auth-agree__label a:hover {
  filter: brightness(0.9);
}
.auth-agree .hint {
  margin-top: 0.35rem;
  margin-left: 1.65rem;
}

@media (max-width: 900px) {
  .legal-layout {
    grid-template-columns: 1fr;
  }
  .legal-toc {
    position: static;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.65rem 1rem;
    align-items: start;
  }
  .legal-toc__title {
    margin: 0.35rem 0 0;
  }
  .legal-toc__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 768px) {
  .legal-hero {
    grid-template-columns: 1fr;
    padding: 1.35rem 1.25rem;
  }
  .legal-hero__switch {
    justify-self: start;
  }
  .legal-doc {
    padding: 1.25rem 1.15rem 1.4rem;
  }
  .legal-doc__contact li {
    grid-template-columns: 1fr;
    gap: 0.2rem;
  }
  .legal-toc__list {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  .legal-shell {
    animation: none;
  }
}

/* —— P1：对比 / 关联 / 沙箱 —— */
.compare-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(176, 200, 220, 0.85);
  border-radius: 12px;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(235, 244, 251, 0.94));
  box-shadow: 0 10px 24px rgba(15, 55, 95, 0.05);
}
.compare-bar__text {
  margin: 0;
}
.compare-bar__actions {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
.compare-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 2.25rem;
  padding: 0.3rem 0.75rem 0.3rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(168, 196, 218, 0.95);
  background: #fff;
  color: #5b6573;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
  transition: all 0.2s ease;
}
.compare-toggle input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.compare-toggle__mark {
  width: 1rem;
  height: 1rem;
  border-radius: 4px;
  border: 1.5px solid #9aafc2;
  background: #fff;
  flex: 0 0 auto;
  transition: all 0.2s ease;
  box-shadow: inset 0 0 0 0 rgba(22, 119, 197, 0.15);
}
.compare-toggle__text {
  white-space: nowrap;
}
.compare-toggle:hover {
  border-color: rgba(22, 119, 197, 0.45);
  color: #125e9e;
  background: rgba(22, 119, 197, 0.04);
}
.compare-toggle:active {
  transform: scale(0.98);
}
.compare-toggle:focus-within {
  outline: 2px solid var(--accent, #1677c5);
  outline-offset: 2px;
}
.compare-toggle.is-checked {
  border-color: rgba(22, 119, 197, 0.55);
  background: rgba(22, 119, 197, 0.1);
  color: #125e9e;
}
.compare-toggle.is-checked .compare-toggle__mark {
  border-color: #1677c5;
  background: #1677c5
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 5 8.6 9.5 3.5' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
    center / 0.7rem 0.7rem no-repeat;
}
.compare-table-wrap {
  overflow-x: auto;
}
.compare-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 36rem;
}
.compare-table th,
.compare-table td {
  border: 1px solid var(--border, #d8dee6);
  padding: 0.65rem 0.75rem;
  text-align: left;
  vertical-align: top;
}
.compare-table thead th {
  background: var(--surface-muted, #f4f7fb);
}
.compare-table tbody th {
  width: 8rem;
  font-weight: 600;
  background: var(--surface, #fff);
}
.compare-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
}
.related-panel {
  display: grid;
  gap: 0.85rem;
}
.related-panel__head h2 {
  margin: 0 0 0.25rem;
}
.related-panel__sub {
  margin: 0;
  font-size: 0.85rem;
  color: #6a7682;
  line-height: 1.45;
}
.related-cards {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}
.related-card {
  display: grid;
  gap: 0.45rem;
  padding: 0.75rem 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(176, 200, 220, 0.8);
  background: linear-gradient(180deg, #fff 0%, #f5f9fc 100%);
  transition: all 0.2s ease;
}
.related-card:hover {
  border-color: rgba(22, 119, 197, 0.35);
  background: #fff;
}
.related-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.related-card__title {
  font-weight: 650;
  color: var(--ink, #15202b);
  line-height: 1.35;
  text-decoration: none;
}
.related-card__title:hover {
  color: #125e9e;
}
.related-card__desc {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: #6a7682;
}
.related-card__actions {
  display: flex;
  gap: 0.45rem;
}
.related-card__btn {
  min-height: 2rem;
  padding: 0.25rem 0.7rem;
  font-size: 0.8rem;
}
.related-panel__compare {
  justify-self: stretch;
  text-align: center;
  min-height: 2.5rem;
}
.sandbox-form {
  margin-top: 0.5rem;
}
.btn.is-disabled {
  pointer-events: none;
  opacity: 0.55;
}