.site-header {
  position: sticky;
  z-index: 30;
  top: 0;
  border-bottom: 1px solid rgba(68, 88, 74, 0.08);
  background: rgba(248, 245, 239, 0.82);
  backdrop-filter: blur(18px);
}
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 76px;
  gap: var(--space-5);
}
.brand {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  flex: 0 0 auto;
  color: var(--forest);
  font-size: 18px;
  font-weight: 750;
  letter-spacing: 0.02em;
}
.brand__logo-slot {
  display: inline-block;
  width: 28px;
  height: 28px;
  border: 1.5px dashed rgba(68, 88, 74, 0.52);
  border-radius: 50%;
  background: rgba(229, 236, 229, 0.52);
}
.top-nav {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-right: auto;
  margin-left: var(--space-7);
}
.top-nav__link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 0 var(--space-3);
  border-bottom: 2px solid transparent;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 650;
}
.top-nav__link:hover, .top-nav__link--active {
  color: var(--forest);
  border-color: var(--moss);
}
.header-actions { display: flex; align-items: center; gap: var(--space-3); }
.header-actions__explore {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 650;
}
.header-actions__explore svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}
.button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 750;
  transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
}
.button:hover { transform: translateY(-1px); }
.button--compact { min-height: 44px; padding-inline: 15px; font-size: 14px; }
.button--primary {
  color: #f8fbf7;
  background: var(--forest);
  box-shadow: 0 9px 20px rgba(68, 88, 74, 0.2);
}
.button--primary:hover { background: #35493b; box-shadow: 0 13px 25px rgba(68, 88, 74, 0.24); }
.button--secondary { color: var(--forest); background: #f9fcf8; border-color: rgba(68, 88, 74, 0.16); }
.button--ghost { color: var(--forest); background: transparent; border-color: var(--line); }
.button--ghost:hover { background: var(--moss-pale); }
.page-grid {
  display: grid;
  grid-template-columns: 190px minmax(0, var(--content-max)) 212px;
  align-items: start;
  gap: var(--space-7);
  padding-block: var(--space-8) var(--space-10);
}
.home-content { min-width: 0; }
.rail { position: sticky; top: 100px; }
.rail__label, .side-panel__label {
  margin-bottom: var(--space-3);
  color: var(--ink-faint);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.side-nav { display: grid; gap: 4px; }
.side-nav__item {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding-inline: 10px;
  color: var(--ink-soft);
  border-radius: 12px;
  font-size: 14px;
  font-weight: 650;
}
.side-nav__item:hover, .side-nav__item--active { color: var(--forest); background: rgba(229, 236, 229, 0.7); }
.side-nav__icon { width: 20px; color: var(--moss-strong); font-size: 19px; text-align: center; }
.content-glass, .content-mist { position: relative; overflow: hidden; border: 1px solid var(--glass-border); }
.content-glass { background: var(--glass); box-shadow: var(--shadow-soft); backdrop-filter: blur(18px) saturate(105%); }
.content-mist { background: var(--mist); box-shadow: var(--shadow-soft); }
.content-glass::before {
  content: "";
  position: absolute;
  top: 18px;
  right: 18px;
  width: 7px;
  height: 12px;
  border: 1px solid rgba(111, 139, 116, 0.28);
  border-radius: 70% 30% 70% 30%;
  opacity: 0.7;
  transform: rotate(32deg);
  pointer-events: none;
}
@supports not (backdrop-filter: blur(1px)) {
  .content-glass { background: rgba(244, 249, 243, 0.96); }
  .site-header { background: rgba(248, 245, 239, 0.97); }
}
.rail-note {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  margin-top: var(--space-7);
  padding: 14px;
  border-radius: var(--radius-sm);
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.55;
}
.rail-note__sprout { color: var(--moss-strong); font-size: 25px; }
.intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 230px;
  align-items: end;
  gap: var(--space-7);
  padding: 4px 0 var(--space-7);
}
.eyebrow {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: var(--space-3);
  color: var(--moss-strong);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.eyebrow--quiet { color: var(--ink-faint); }
.eyebrow__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--moss);
  box-shadow: 0 0 0 5px rgba(111, 139, 116, 0.12);
}
.intro h1 { max-width: 590px; font-size: clamp(31px, 3.2vw, 42px); }
.intro__lede { max-width: 585px; margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; }
.intro__actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-5); margin-top: var(--space-6); }
.text-action { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--forest); font-size: 14px; font-weight: 750; }
.text-action:hover, .welcome-card__link:hover, .side-panel__link:hover { color: var(--moss-strong); }
.welcome-card {
  min-height: 188px;
  display: grid;
  grid-template-rows: 108px auto;
  border-radius: var(--radius-md);
}
.welcome-card__media { overflow: hidden; background: var(--moss-pale); }
.welcome-card__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; }
.welcome-card__body { padding: 11px 14px 13px; }
.welcome-card__kicker { color: var(--moss-strong); font-size: 12px; font-weight: 800; }
.welcome-card__copy { margin-top: 3px; color: var(--ink); font-size: 12px; line-height: 1.45; }
.welcome-card__link, .side-panel__link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  color: var(--forest);
  font-size: 12px;
  font-weight: 800;
}
.section-block { padding-top: var(--space-8); scroll-margin-top: 96px; }
.section-block--feed { border-top: 1px solid var(--line); }
.section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}
.section-heading h2, .help-callout h2, .side-panel h2 { font-size: clamp(24px, 2.7vw, 32px); }
.section-heading__actions { display: flex; align-items: center; gap: var(--space-3); }
.data-status { max-width: 210px; color: var(--ink-faint); font-size: 12px; text-align: right; }
.filter-row { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 8px; scrollbar-width: none; }
.filter-row::-webkit-scrollbar { display: none; }
.filter-chip {
  min-height: 44px;
  flex: 0 0 auto;
  padding: 0 14px;
  color: var(--ink-soft);
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
}
.filter-chip:hover, .filter-chip--active { color: var(--forest); background: var(--moss-pale); border-color: rgba(111, 139, 116, 0.35); }
.feed-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-3); }
.feed-card {
  min-width: 0;
  overflow: hidden;
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-soft);
  transition: transform 180ms ease, box-shadow 180ms ease;
}
.feed-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
.feed-card__link { display: block; height: 100%; color: inherit; }
.feed-card__media {
  position: relative;
  aspect-ratio: 1.08;
  overflow: hidden;
  background: linear-gradient(135deg, #dce8dc, #edf2e9);
}
.feed-card__media::after {
  content: "";
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: 9px;
  height: 15px;
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: 70% 30% 70% 30%;
  transform: rotate(32deg);
}
.feed-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 420ms ease; }
.feed-card:hover .feed-card__media img { transform: scale(1.035); }
.feed-card__media--failed { display: grid; place-items: center; padding: 18px; color: var(--ink-soft); text-align: center; }
.feed-card__media--failed img { display: none; }
.feed-card__body { padding: 14px 14px 16px; }
.feed-card__topline { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px; }
.feed-card__tag { padding: 3px 8px; color: var(--forest); background: var(--moss-pale); border-radius: 999px; font-size: 11px; font-weight: 800; }
.feed-card__count { color: var(--ink-faint); font-size: 11px; }
.feed-card h3 {
  display: -webkit-box;
  overflow: hidden;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.42;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.feed-card__meta { display: flex; justify-content: space-between; gap: 8px; margin-top: 10px; color: var(--ink-faint); font-size: 11px; }
.feed-card__source { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.feed-skeleton, .species-skeleton {
  min-height: 286px;
  border-radius: var(--radius-sm);
  background: linear-gradient(100deg, rgba(229,236,229,.52) 20%, rgba(255,255,255,.7) 36%, rgba(229,236,229,.52) 52%);
  background-size: 220% 100%;
  animation: shimmer 1.5s infinite linear;
}
@keyframes shimmer { to { background-position-x: -220%; } }
.state-panel { grid-column: 1 / -1; padding: var(--space-6); color: var(--ink-soft); background: var(--mist); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.state-panel p { margin-top: 4px; }
.state-panel .button { margin-top: var(--space-4); }
.empty-panel { grid-column: 1 / -1; padding: var(--space-6); color: var(--ink-soft); border: 1px dashed rgba(68, 88, 74, .27); border-radius: var(--radius-sm); }
.species-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.species-card {
  position: relative;
  min-height: 200px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  padding: 17px;
  color: white;
  background: var(--forest);
  border-radius: var(--radius-sm);
  isolation: isolate;
}
.species-card::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, rgba(27, 44, 32, 0.02), rgba(29, 43, 34, 0.84)); }
.species-card img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.species-card__difficulty { margin-bottom: 5px; color: #e7f1e8; font-size: 11px; font-weight: 800; }
.species-card h3 { color: #fff; font-size: 19px; }
.species-card__latin { margin-top: 2px; color: rgba(255,255,255,.78); font-size: 12px; font-style: italic; }
.species-skeleton { min-height: 200px; }
.help-callout {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--space-6);
  padding: clamp(24px, 5vw, 42px);
  border-radius: var(--radius-md);
}
.help-callout p:not(.eyebrow) { max-width: 560px; margin-top: var(--space-4); color: var(--ink-soft); font-size: 14px; }
.side-panel { padding: 18px; border-radius: var(--radius-sm); }
.side-panel h2 { font-size: 21px; }
.rule-list { display: grid; gap: 10px; margin: var(--space-5) 0 0; padding: 0; list-style: none; color: var(--ink-soft); font-size: 13px; }
.rule-list span { display: inline-flex; width: 18px; height: 18px; align-items: center; justify-content: center; margin-right: 6px; color: var(--forest); background: var(--moss-pale); border-radius: 50%; font-size: 11px; }
.source-panel { padding: 18px 4px 0; color: var(--ink-faint); font-size: 12px; line-height: 1.6; }
.source-panel a { display: inline-flex; min-height: 44px; align-items: center; color: var(--moss-strong); font-weight: 750; }
.mobile-nav { display: none; }
.site-footer { display: flex; justify-content: space-between; gap: var(--space-4); padding-block: 22px calc(22px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); color: var(--ink-faint); font-size: 12px; }
.site-footer a { min-height: 44px; display: inline-flex; align-items: center; color: var(--moss-strong); font-weight: 750; }

/* S04 · 只读帖子详情：正文、图片与异常态必须明确区分，不能用演示内容替代真实响应。 */
.detail-page { min-height: calc(100vh - 76px); padding-block: var(--space-7) var(--space-10); }
.detail-layout {
  display: grid;
  grid-template-columns: 190px minmax(0, var(--content-max)) 212px;
  align-items: start;
  gap: var(--space-7);
}
.detail-main, .detail-rail { min-width: 0; }
.detail-rail { position: sticky; top: 100px; }
.detail-rail__label { margin-bottom: var(--space-3); color: var(--ink-faint); font-size: 12px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.detail-rail__link {
  min-height: 44px;
  display: flex;
  align-items: center;
  padding-inline: 10px;
  color: var(--ink-soft);
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
}
.detail-rail__link:hover { color: var(--forest); background: rgba(229, 236, 229, .7); }
.detail-rail__stub { min-height: 148px; border-left: 1px solid var(--line); }
.detail-breadcrumb {
  min-height: 44px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: var(--space-4);
  color: var(--ink-faint);
  font-size: 13px;
}
.detail-breadcrumb a { min-height: 44px; display: inline-flex; align-items: center; color: var(--forest); font-weight: 750; }
.detail-breadcrumb a:hover { color: var(--moss-strong); }
.detail-breadcrumb span::before { content: "/"; margin-right: 9px; color: var(--leaf-line); }
.post-detail__card { padding: clamp(20px, 4vw, 38px); border-radius: var(--radius-md); }
.post-detail__topline { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.post-detail__read-only { padding: 3px 8px; color: var(--moss-strong); background: rgba(229, 236, 229, .68); border: 1px solid rgba(111, 139, 116, .26); border-radius: 999px; font-size: 11px; font-weight: 800; }
.post-detail__card h1 { max-width: 730px; margin-top: var(--space-4); font-size: clamp(29px, 3.5vw, 43px); overflow-wrap: anywhere; }
.post-detail__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 14px; margin-top: var(--space-3); color: var(--ink-faint); font-size: 13px; }
.post-detail__meta span + span::before { content: "·"; margin-right: 14px; color: var(--leaf-line); }
.post-detail__fixture-note { margin-top: var(--space-3); color: var(--moss-strong); font-size: 12px; font-weight: 750; }
.post-detail__body { margin-top: var(--space-6); color: var(--ink-soft); font-size: 16px; line-height: 1.86; overflow-wrap: anywhere; }
.post-detail__body p { max-width: 730px; }
.post-detail__media { margin-top: var(--space-6); }
.post-detail__media-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.post-detail__media-grid--1 { grid-template-columns: minmax(0, 1fr); max-width: 670px; }
.post-detail__media-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.post-detail__media-item { position: relative; min-width: 0; margin: 0; overflow: hidden; background: linear-gradient(135deg, #dce8dc, #edf2e9); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.post-detail__media-item img { width: 100%; aspect-ratio: 1.14; object-fit: cover; }
.post-detail__media-item figcaption { min-height: 34px; padding: 7px 9px; color: var(--ink-faint); background: rgba(255, 255, 255, .5); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.post-detail__media-item--failed { display: grid; place-items: center; min-height: 188px; padding: 18px; color: var(--ink-soft); text-align: center; }
.post-detail__media-item--failed img, .post-detail__media-item--failed figcaption { display: none; }
.post-detail__image-failure { font-size: 13px; }
.post-detail__no-media { margin-top: var(--space-6); padding: var(--space-5); color: var(--ink-soft); background: rgba(255, 255, 255, .46); border: 1px dashed rgba(68, 88, 74, .27); border-radius: var(--radius-sm); }
.post-detail__no-media strong { color: var(--forest); }
.post-detail__no-media p { margin-top: 4px; font-size: 14px; }
.post-detail__comments { margin-top: var(--space-6); padding: var(--space-5); border-radius: var(--radius-sm); }
.post-detail__comments h2 { font-size: 20px; }
.post-detail__comments p:not(.eyebrow) { margin-top: 5px; color: var(--ink-soft); font-size: 14px; }
.post-detail__comments > span { display: block; margin-top: var(--space-3); color: var(--moss-strong); font-size: 12px; font-weight: 750; }
.post-detail__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px; margin-top: var(--space-6); }
.post-detail__action-status { min-height: 22px; color: var(--ink-faint); font-size: 12px; }
.detail-source-card { padding: 18px; border-radius: var(--radius-sm); }
.detail-source-card h2 { font-size: 21px; }
.post-detail__source-list { display: grid; gap: 12px; margin: var(--space-5) 0 0; }
.post-detail__source-list div { padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.post-detail__source-list dt { color: var(--moss-strong); font-size: 11px; font-weight: 800; }
.post-detail__source-list dd { margin: 3px 0 0; color: var(--ink-soft); font-size: 13px; overflow-wrap: anywhere; }
.post-detail__source-copy, .detail-source-card__note { margin-top: var(--space-4); color: var(--ink-soft); font-size: 13px; line-height: 1.6; }
.detail-source-card__note { padding-top: var(--space-4); border-top: 1px solid var(--line); color: var(--ink-faint); font-size: 12px; }
.detail-skeleton { min-height: 490px; display: grid; align-content: start; gap: 16px; padding: clamp(20px, 4vw, 38px); border-radius: var(--radius-md); }
.detail-skeleton span { display: block; height: 16px; border-radius: 999px; background: linear-gradient(100deg, rgba(229,236,229,.52) 20%, rgba(255,255,255,.7) 36%, rgba(229,236,229,.52) 52%); background-size: 220% 100%; animation: shimmer 1.5s infinite linear; }
.detail-skeleton span:nth-child(1) { width: 19%; height: 24px; }
.detail-skeleton span:nth-child(2) { width: 84%; height: 44px; }
.detail-skeleton span:nth-child(3) { width: 61%; }
.detail-skeleton span:nth-child(4) { width: 100%; height: 228px; margin-top: var(--space-3); border-radius: var(--radius-sm); }
.detail-state-wrap { min-height: calc(100vh - 260px); display: grid; place-items: center; padding-block: var(--space-8); }
.detail-state { width: min(100%, 610px); padding: clamp(24px, 6vw, 48px); border-radius: var(--radius-md); text-align: center; }
.detail-state h1 { font-size: clamp(28px, 4vw, 38px); }
.detail-state p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); }
.detail-state__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: var(--space-6); }

/* S05 · 发布类型只做公开范围与后续流程预览；不在此页创建草稿、上传或保存内容。 */
body[data-page="create"] { overflow-x: clip; overflow-y: hidden; }
body[data-page="create"] .site-footer { display: none; }
.create-page {
  position: relative;
  min-height: calc(100svh - 76px);
  display: grid;
  place-items: center;
  padding-block: clamp(var(--space-6), 6vh, var(--space-9));
  isolation: isolate;
}
.create-page::before {
  content: "";
  position: fixed;
  z-index: 1;
  inset: 0;
  background: rgba(55, 73, 59, 0.33);
  backdrop-filter: blur(3px) saturate(86%);
  pointer-events: none;
}
.create-context {
  position: absolute;
  z-index: 0;
  inset: var(--space-7) 0;
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: var(--space-7);
  pointer-events: none;
}
.create-context__rail,
.create-context__content > span {
  border: 1px solid rgba(255, 255, 255, 0.56);
  background: rgba(244, 249, 243, 0.54);
  box-shadow: var(--shadow-soft);
}
.create-context__rail {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 28px 18px;
  border-radius: var(--radius-sm);
}
.create-context__rail span {
  display: block;
  width: 78%;
  height: 12px;
  border-radius: 999px;
  background: rgba(68, 88, 74, 0.24);
}
.create-context__rail span:nth-child(1) { width: 42%; height: 18px; margin-bottom: 10px; }
.create-context__rail span:nth-child(3) { width: 56%; }
.create-context__content {
  display: grid;
  align-content: start;
  gap: var(--space-4);
  padding: 44px clamp(var(--space-5), 5vw, var(--space-9));
}
.create-context__content > span {
  display: block;
  min-height: 148px;
  border-radius: var(--radius-md);
}
.create-context__content > span:nth-child(1) { min-height: 96px; }
.create-context__content > span:nth-child(3) { width: 76%; }
.create-dialog {
  position: relative;
  z-index: 2;
  width: min(100%, 640px);
  max-height: calc(100svh - 120px);
  padding: clamp(20px, 3vw, 28px);
  overflow-y: auto;
  border-radius: var(--radius-lg);
  background: rgba(250, 253, 249, 0.9);
  box-shadow: 0 34px 88px rgba(28, 43, 33, 0.28);
  scrollbar-color: rgba(68, 88, 74, 0.35) transparent;
  scrollbar-width: thin;
}
.create-dialog > * { position: relative; z-index: 1; }
.create-dialog__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
}
.create-dialog__header h1 { margin-top: 2px; font-size: clamp(28px, 2.8vw, 34px); }
.create-dialog__header p:not(.eyebrow) {
  max-width: 510px;
  margin-top: 6px;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.5;
}
.create-dialog__close {
  width: 44px;
  min-height: 44px;
  flex: 0 0 44px;
  display: grid;
  place-items: center;
  color: var(--forest);
  border: 1px solid rgba(111, 139, 116, 0.45);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.6);
  font-size: 24px;
  font-weight: 400;
  line-height: 1;
  transition: background-color 180ms ease, transform 180ms ease;
}
.create-dialog__close:hover { background: var(--moss-pale); transform: translateY(-1px); }
.create-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}
.create-option {
  min-width: 0;
  min-height: 148px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-rows: auto 1fr auto;
  column-gap: 10px;
  padding: 14px;
  color: var(--forest);
  text-align: left;
  background: rgba(250, 253, 249, 0.72);
  border: 1px solid rgba(111, 139, 116, 0.46);
  border-radius: var(--radius-sm);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease, background-color 180ms ease;
}
.create-option__icon {
  width: 38px;
  height: 38px;
  grid-column: 1;
  grid-row: 1;
  display: grid;
  place-items: center;
  color: var(--forest);
  background: rgba(255, 255, 255, 0.76);
  border-radius: 12px;
  font-size: 23px;
  font-weight: 650;
  line-height: 1;
}
.create-option__content {
  min-width: 0;
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: start;
}
.create-option__title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px 7px;
  color: var(--forest);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.create-option__badge {
  min-height: 20px;
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  color: var(--moss-strong);
  border: 1px solid rgba(111, 139, 116, 0.38);
  border-radius: 999px;
  background: rgba(229, 236, 229, 0.7);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.25;
  white-space: nowrap;
}
.create-option__copy {
  display: block;
  margin-top: 6px;
  color: var(--ink-soft);
  font-size: 12px;
  line-height: 1.58;
  overflow-wrap: anywhere;
}
.create-option__route {
  min-height: 24px;
  grid-column: 1 / -1;
  grid-row: 3;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  color: var(--forest);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.create-option__route b { flex: 0 0 auto; font-size: 16px; line-height: 1; }
.create-option--help {
  color: #824419;
  background: rgba(249, 239, 231, 0.8);
  border-color: rgba(188, 111, 60, 0.34);
}
.create-option--help .create-option__icon { color: #824419; }
.create-option--help .create-option__title,
.create-option--help .create-option__route { color: #824419; }
.create-option--help .create-option__badge {
  color: #824419;
  border-color: rgba(188, 111, 60, 0.36);
  background: rgba(255, 248, 241, 0.8);
}
.create-option--private {
  background: rgba(242, 248, 242, 0.78);
  border: 2px solid rgba(68, 88, 74, 0.72);
}
.create-option--private .create-option__badge { color: var(--forest); }
.create-option--selected {
  border-color: var(--forest);
  box-shadow: 0 0 0 2px rgba(68, 88, 74, 0.16), 0 14px 28px rgba(55, 73, 59, 0.12);
  transform: translateY(-2px);
}
@media (hover: hover) and (pointer: fine) {
  .create-option:hover {
    border-color: var(--forest);
    box-shadow: 0 12px 24px rgba(55, 73, 59, 0.1);
    transform: translateY(-2px);
  }
}
.create-selection-status {
  min-height: 22px;
  margin-top: 10px;
  color: var(--moss-strong);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.55;
}
.create-gate-note {
  margin-top: 6px;
  padding: 7px 10px;
  color: var(--ink-soft);
  background: rgba(229, 236, 229, 0.58);
  border: 1px solid rgba(111, 139, 116, 0.24);
  border-radius: var(--radius-xs);
  font-size: 11px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.create-dialog__footer {
  display: flex;
  align-items: center;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.create-dialog__footer .button { min-width: 166px; }

/* S06 · 图文编辑仅承载范围与恢复规则预览；真实草稿、上传和发布仍由 P2 能力门控。 */
body[data-page="compose"] { overflow-x: clip; }
.composer-header-status {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  color: var(--moss-strong);
  background: rgba(229, 236, 229, 0.72);
  border: 1px solid rgba(111, 139, 116, 0.32);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}
.composer-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.composer-heading { max-width: 760px; }
.composer-heading h1 { margin-top: var(--space-2); font-size: clamp(31px, 3.3vw, 42px); }
.composer-heading > p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; }
.composer-rules-reminder {
  width: max-content;
  max-width: 100%;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: var(--space-4);
  padding: 7px 11px;
  color: var(--forest);
  background: rgba(239, 247, 238, 0.68);
  border: 1px solid rgba(111, 139, 116, 0.34);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.composer-rules-reminder > span:first-child { color: var(--moss-strong); font-size: 10px; }
.composer-rules-reminder > span:last-child { font-size: 14px; line-height: 1; }
.composer-rules-reminder:hover { background: rgba(229, 236, 229, 0.88); text-decoration: none; }
.composer-view-toggle { display: none; }
.composer-status {
  min-height: 23px;
  margin-top: var(--space-4);
  color: var(--moss-strong);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.55;
}
.composer-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.82fr);
  align-items: start;
  gap: var(--space-5);
  margin-top: var(--space-4);
}
.composer-editor, .composer-preview { min-width: 0; padding: clamp(20px, 3vw, 30px); border-radius: var(--radius-md); }
.composer-editor { background: rgba(234, 242, 233, 0.9); }
.composer-preview { position: sticky; top: 96px; background: rgba(247, 252, 247, 0.88); }
.composer-panel-heading, .composer-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
}
.composer-panel-heading h2 { margin-top: 2px; font-size: clamp(24px, 2.5vw, 31px); }
.composer-draft-badge, .composer-preview-badge {
  min-height: 28px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  padding: 0 9px;
  color: var(--moss-strong);
  border: 1px solid rgba(111, 139, 116, 0.38);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.58);
  font-size: 10px;
  font-weight: 800;
}
.composer-preview-badge { color: var(--forest); }
.composer-scope-line {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  margin-top: var(--space-4);
  padding: 10px 12px;
  color: var(--ink-faint);
  background: rgba(255, 255, 255, 0.42);
  border: 1px solid var(--line);
  border-radius: var(--radius-xs);
  font-size: 11px;
  line-height: 1.5;
}
.composer-scope-line strong { color: var(--moss-strong); font-weight: 800; }
.composer-field { margin-top: var(--space-5); }
.composer-field label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-3);
  color: var(--forest);
  font-size: 12px;
  font-weight: 800;
}
.composer-field label span { color: var(--ink-faint); font-size: 11px; font-weight: 700; }
.composer-field input, .composer-field textarea {
  width: 100%;
  margin-top: 7px;
  padding: 12px 13px;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.64);
  border: 1px solid rgba(111, 139, 116, 0.44);
  border-radius: var(--radius-xs);
  font-size: 16px;
  line-height: 1.55;
}
.composer-field textarea { min-height: 134px; resize: vertical; }
.composer-field p { margin-top: 7px; color: var(--ink-faint); font-size: 11px; line-height: 1.55; }
.composer-public-fields { margin-top: var(--space-5); }
.composer-public-fields > p { color: var(--forest); font-size: 12px; font-weight: 800; }
.composer-public-fields > div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.composer-public-fields span, .composer-preview__tags span {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  color: var(--moss-strong);
  background: rgba(229, 236, 229, 0.78);
  border: 1px solid rgba(111, 139, 116, 0.3);
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
}
.composer-attachments { margin-top: var(--space-6); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.composer-section-heading h2, .composer-section-heading h3 { margin-top: 2px; font-size: 21px; }
.composer-section-heading > span, .composer-section-heading > p { max-width: 240px; color: var(--ink-faint); font-size: 11px; line-height: 1.55; text-align: right; }
.composer-attachment-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-4); }
.composer-attachment, .composer-add-attachment { min-width: 0; overflow: hidden; border: 1px solid rgba(111, 139, 116, 0.35); border-radius: var(--radius-xs); background: rgba(255, 255, 255, 0.48); }
.composer-attachment__media { position: relative; aspect-ratio: 1; overflow: hidden; background: var(--moss-pale); }
.composer-attachment__media img { width: 100%; height: 100%; object-fit: cover; }
.composer-attachment__media span {
  position: absolute;
  top: 7px;
  left: 7px;
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  color: var(--forest);
  background: rgba(255, 253, 248, 0.9);
  border-radius: 999px;
  font-size: 9px;
  font-weight: 800;
}
.composer-attachment > p { min-height: 43px; padding: 7px 8px; color: var(--ink-soft); font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.composer-attachment--failed { border-color: rgba(188, 111, 60, 0.4); background: rgba(249, 239, 231, 0.82); }
.composer-attachment--failed .composer-attachment__media span { color: #824419; background: rgba(255, 248, 241, 0.94); }
.composer-attachment--failed .button { width: calc(100% - 16px); min-height: 44px; margin: 0 8px 8px; padding-inline: 7px; font-size: 11px; }
.composer-attachment--queued { opacity: 0.82; }
.composer-add-attachment {
  min-height: 142px;
  display: grid;
  place-content: center;
  gap: 2px;
  padding: 10px;
  color: var(--forest);
  border-style: dashed;
  text-align: center;
}
.composer-add-attachment strong { font-size: 25px; line-height: 1; }
.composer-add-attachment span { font-size: 12px; font-weight: 800; }
.composer-add-attachment small { color: var(--ink-faint); font-size: 10px; }
.composer-attachment-note { margin-top: 10px; padding: 9px 10px; color: var(--ink-soft); background: rgba(255, 255, 255, 0.42); border: 1px solid rgba(111, 139, 116, 0.22); border-radius: var(--radius-xs); font-size: 11px; line-height: 1.55; }
.composer-protection {
  display: grid;
  gap: 4px;
  margin-top: var(--space-5);
  padding: 12px;
  color: var(--ink-soft);
  background: rgba(239, 247, 238, 0.62);
  border: 1px solid rgba(111, 139, 116, 0.34);
  border-radius: var(--radius-xs);
  font-size: 12px;
  line-height: 1.55;
}
.composer-protection strong { color: var(--forest); font-size: 12px; }
.composer-editor-actions { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr); gap: 10px; margin-top: var(--space-6); }
.composer-editor-actions .button { min-width: 0; padding-inline: 12px; font-size: 13px; }
.composer-editor-actions .button:disabled, .composer-preview__submit:disabled { cursor: not-allowed; opacity: 0.58; box-shadow: none; }
.composer-preview__lead { margin-top: var(--space-3); color: var(--ink-soft); font-size: 12px; line-height: 1.55; }
.composer-preview__media { position: relative; margin: var(--space-5) 0 0; overflow: hidden; border-radius: var(--radius-sm); background: var(--moss-pale); }
.composer-preview__media img { width: 100%; aspect-ratio: 1.28; object-fit: cover; }
.composer-preview__media figcaption { position: absolute; right: 10px; bottom: 10px; left: 10px; display: flex; justify-content: space-between; gap: 8px; }
.composer-preview__media figcaption span { padding: 3px 7px; color: var(--forest); background: rgba(255, 253, 248, 0.91); border-radius: 999px; font-size: 9px; font-weight: 800; }
.composer-preview__post { margin-top: var(--space-5); }
.composer-preview__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.composer-preview__post h3 { margin-top: var(--space-3); font-size: clamp(23px, 2.6vw, 31px); overflow-wrap: anywhere; }
.composer-preview__post > p:not(.composer-preview__source) { margin-top: var(--space-3); color: var(--ink-soft); font-size: 14px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.composer-preview__source { margin-top: var(--space-4); color: var(--ink-faint); font-size: 11px; line-height: 1.55; }
.composer-preview__boundary { margin-top: var(--space-5); padding: 11px; color: var(--ink-soft); background: rgba(229, 236, 229, 0.6); border: 1px solid rgba(111, 139, 116, 0.27); border-radius: var(--radius-xs); font-size: 11px; line-height: 1.55; }
.composer-preview__boundary strong { color: var(--forest); }
.composer-preview__submit { width: 100%; margin-top: var(--space-5); }
.composer-f02 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, 0.42); }
.composer-f02-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.composer-state-card { min-width: 0; min-height: 166px; padding: 14px; background: rgba(242, 248, 242, 0.74); border: 1px solid rgba(111, 139, 116, 0.36); border-radius: var(--radius-xs); }
.composer-state-card > span { min-height: 22px; display: inline-flex; align-items: center; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, 0.76); border-radius: 999px; font-size: 10px; font-weight: 800; }
.composer-state-card h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; overflow-wrap: anywhere; }
.composer-state-card p { margin-top: 6px; color: var(--ink-soft); font-size: 12px; line-height: 1.55; }
.composer-state-card--failure, .composer-state-card--pending { background: rgba(249, 239, 231, 0.7); border-color: rgba(188, 111, 60, 0.32); }
.composer-state-card--failure > span, .composer-state-card--pending > span { color: #824419; background: rgba(255, 248, 241, 0.86); }
.composer-state-card--failure h3, .composer-state-card--pending h3 { color: #824419; }
.composer-action-bar { display: none; }

/* S07 · 结构化求助仅用于五步、公开边界与 F03 状态的页面内预览；所有平台写入由 P2 门控。 */
body[data-page="help-composer"] { overflow-x: clip; }
.help-header-status {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  color: var(--moss-strong);
  background: rgba(229, 236, 229, 0.72);
  border: 1px solid rgba(111, 139, 116, 0.32);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}
.help-composer-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.help-composer-heading { max-width: 780px; }
.help-composer-heading h1 { margin-top: var(--space-2); font-size: clamp(31px, 3.3vw, 42px); }
.help-composer-heading > p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; line-height: 1.65; }
.help-mobile-header, .help-view-toggle { display: none; }
.help-composer-status { min-height: 23px; margin-top: var(--space-4); color: var(--moss-strong); font-size: 12px; font-weight: 700; line-height: 1.55; }
.help-composer-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(360px, 0.82fr);
  align-items: start;
  gap: var(--space-5);
  margin-top: var(--space-4);
}
.help-editor, .help-preview { min-width: 0; padding: clamp(20px, 3vw, 30px); border-radius: var(--radius-md); }
.help-editor { background: rgba(234, 242, 233, 0.9); }
.help-preview { position: sticky; top: 96px; background: rgba(247, 252, 247, 0.88); }
.help-panel-heading, .help-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); }
.help-panel-heading h2 { margin-top: 2px; font-size: clamp(24px, 2.5vw, 31px); }
.help-draft-badge, .help-preview-badge {
  min-height: 28px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  padding: 0 9px;
  color: var(--moss-strong);
  border: 1px solid rgba(111, 139, 116, 0.38);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.58);
  font-size: 10px;
  font-weight: 800;
}
.help-preview-badge { color: var(--forest); }
.help-editor-lede { margin-top: var(--space-3); color: var(--ink-soft); font-size: 12px; line-height: 1.55; }
.help-stepper { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; margin: var(--space-5) 0 0; padding: 0; list-style: none; }
.help-stepper button {
  width: 100%;
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 8px;
  color: var(--ink-soft);
  background: rgba(255, 255, 255, 0.42);
  border: 1px solid rgba(111, 139, 116, 0.32);
  border-radius: var(--radius-xs);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.3;
  text-align: left;
  overflow-wrap: anywhere;
}
.help-stepper button[aria-current="step"] { color: var(--forest); background: rgba(229, 236, 229, 0.84); border-color: var(--forest); box-shadow: inset 0 0 0 1px rgba(68, 88, 74, 0.1); }
.help-stepper__number { width: 18px; height: 18px; flex: 0 0 auto; display: grid; place-items: center; color: var(--moss-strong); background: rgba(255, 255, 255, 0.88); border: 1px solid rgba(111, 139, 116, 0.32); border-radius: 50%; font-size: 9px; }
.help-stepper__short { display: none; }
.help-step-panel { margin-top: var(--space-6); }
.help-step-copy h3 { margin-top: 2px; font-size: 22px; }
.help-step-copy > p:not(.eyebrow) { margin-top: 7px; color: var(--ink-soft); font-size: 12px; line-height: 1.6; }
.help-field { margin-top: var(--space-5); }
.help-field label, .help-measurement > span { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); color: var(--forest); font-size: 12px; font-weight: 800; }
.help-field label > span { color: var(--ink-faint); font-size: 11px; font-weight: 700; }
.help-field input, .help-field textarea, .help-field select, .help-measurement select {
  width: 100%;
  margin-top: 7px;
  padding: 12px 13px;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.64);
  border: 1px solid rgba(111, 139, 116, 0.44);
  border-radius: var(--radius-xs);
  font-size: 16px;
  line-height: 1.55;
}
.help-field textarea { min-height: 134px; resize: vertical; }
.help-field p { margin-top: 7px; color: var(--ink-faint); font-size: 11px; line-height: 1.55; }
.help-inline-note, .help-supplement, .help-protection {
  display: grid;
  gap: 4px;
  margin-top: var(--space-5);
  padding: 12px;
  color: var(--ink-soft);
  background: rgba(239, 247, 238, 0.62);
  border: 1px solid rgba(111, 139, 116, 0.34);
  border-radius: var(--radius-xs);
  font-size: 12px;
  line-height: 1.55;
}
.help-inline-note strong, .help-supplement strong, .help-protection strong { color: var(--forest); font-size: 12px; }
.help-measurement-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.help-measurement { min-width: 0; padding: 12px; background: rgba(255, 255, 255, 0.42); border: 1px solid rgba(111, 139, 116, 0.34); border-radius: var(--radius-xs); }
.help-measurement select { min-height: 44px; margin-top: 9px; padding: 8px 10px; font-size: 14px; }
.help-health-prompt { display: grid; gap: 4px; margin-top: 12px; padding: 12px; color: #824419; background: rgba(249, 239, 231, 0.74); border: 1px solid rgba(188, 111, 60, 0.32); border-radius: var(--radius-xs); font-size: 12px; line-height: 1.55; }
.help-health-prompt strong { font-size: 12px; }
.help-photo-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.help-photo, .help-add-photo { min-width: 0; overflow: hidden; border: 1px solid rgba(111, 139, 116, 0.35); border-radius: var(--radius-xs); background: rgba(255, 255, 255, 0.48); }
.help-photo__media { position: relative; aspect-ratio: 1; overflow: hidden; background: var(--moss-pale); }
.help-photo__media img { width: 100%; height: 100%; object-fit: cover; }
.help-photo__media span { position: absolute; top: 7px; left: 7px; min-height: 22px; display: inline-flex; align-items: center; padding: 1px 7px; color: var(--forest); background: rgba(255, 253, 248, 0.9); border-radius: 999px; font-size: 9px; font-weight: 800; }
.help-photo > p { min-height: 40px; padding: 7px 8px; color: var(--ink-soft); font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.help-photo--failed { border-color: rgba(188, 111, 60, 0.4); background: rgba(249, 239, 231, 0.82); }
.help-photo--failed .help-photo__media span { color: #824419; background: rgba(255, 248, 241, 0.94); }
.help-photo--failed .button { width: calc(100% - 16px); min-height: 44px; margin: 0 8px 8px; padding-inline: 7px; font-size: 11px; }
.help-add-photo { min-height: 136px; display: grid; place-content: center; gap: 2px; padding: 10px; color: var(--forest); border-style: dashed; text-align: center; }
.help-add-photo strong { font-size: 25px; line-height: 1; }
.help-add-photo span { font-size: 12px; font-weight: 800; }
.help-add-photo small { color: var(--ink-faint); font-size: 10px; }
.help-public-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: var(--space-5); padding: 12px; border: 1px solid rgba(111, 139, 116, 0.3); border-radius: var(--radius-xs); }
.help-public-fields legend { padding: 0 4px; color: var(--forest); font-size: 12px; font-weight: 800; }
.help-public-fields label { min-height: 44px; display: flex; align-items: center; gap: 7px; color: var(--ink-soft); font-size: 11px; font-weight: 700; line-height: 1.35; }
.help-public-fields input { width: 18px; height: 18px; flex: 0 0 auto; accent-color: var(--forest); }
.help-inline-preview { display: none; margin-top: var(--space-5); padding: 14px; border-radius: var(--radius-xs); background: rgba(247, 252, 247, 0.88); }
.help-inline-preview h4 { margin-top: 5px; color: var(--forest); font-size: 18px; line-height: 1.35; }
.help-inline-preview p:not(.eyebrow) { margin-top: 7px; color: var(--ink-soft); font-size: 12px; line-height: 1.6; }
.help-editor-actions { display: grid; grid-template-columns: auto auto minmax(0, 1fr) minmax(0, 1fr); gap: 10px; margin-top: var(--space-6); }
.help-editor-actions .button { min-width: 0; padding-inline: 12px; font-size: 13px; }
.help-preview__lead { margin-top: var(--space-3); color: var(--ink-soft); font-size: 12px; line-height: 1.55; }
.help-preview__media { position: relative; margin: var(--space-5) 0 0; overflow: hidden; border-radius: var(--radius-sm); background: var(--moss-pale); }
.help-preview__media img { width: 100%; aspect-ratio: 1.28; object-fit: cover; }
.help-preview__media figcaption { position: absolute; right: 10px; bottom: 10px; left: 10px; display: flex; justify-content: space-between; gap: 8px; }
.help-preview__media figcaption span { padding: 3px 7px; color: var(--forest); background: rgba(255, 253, 248, 0.91); border-radius: 999px; font-size: 9px; font-weight: 800; }
.help-preview__post { margin-top: var(--space-5); }
.help-preview__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.help-preview__tags span { min-height: 26px; display: inline-flex; align-items: center; padding: 2px 9px; color: var(--moss-strong); background: rgba(229, 236, 229, 0.78); border: 1px solid rgba(111, 139, 116, 0.3); border-radius: 999px; font-size: 10px; font-weight: 800; }
.help-preview__post h3 { margin-top: var(--space-3); font-size: clamp(23px, 2.6vw, 31px); overflow-wrap: anywhere; }
.help-preview__measurements { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: var(--space-4); }
.help-preview__measurements > div { min-width: 0; padding: 8px; background: rgba(229, 236, 229, 0.58); border: 1px solid rgba(111, 139, 116, 0.25); border-radius: 10px; }
.help-preview__measurements dt { color: var(--ink-faint); font-size: 9px; font-weight: 800; }
.help-preview__measurements dd { margin: 4px 0 0; color: var(--forest); font-size: 12px; font-weight: 800; overflow-wrap: anywhere; }
.help-preview__state, .help-preview__copy { margin-top: var(--space-4); color: var(--ink-soft); font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.help-preview__state strong { color: var(--forest); }
.help-preview__source { margin-top: var(--space-4); color: var(--ink-faint); font-size: 11px; line-height: 1.55; }
.help-preview__boundary { margin-top: var(--space-5); padding: 11px; color: var(--ink-soft); background: rgba(229, 236, 229, 0.6); border: 1px solid rgba(111, 139, 116, 0.27); border-radius: var(--radius-xs); font-size: 11px; line-height: 1.55; }
.help-preview__boundary strong { color: var(--forest); }
.help-preview__submit { width: 100%; margin-top: var(--space-5); }
.help-preview__submit:disabled, .help-state-card .button:disabled { cursor: not-allowed; opacity: 0.58; box-shadow: none; }
.help-f03 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, 0.42); }
.help-section-heading h2 { margin-top: 2px; font-size: clamp(23px, 2.5vw, 30px); }
.help-section-heading > p { max-width: 260px; color: var(--ink-faint); font-size: 11px; line-height: 1.55; text-align: right; }
.help-f03-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.help-state-card { min-width: 0; min-height: 222px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, 0.74); border: 1px solid rgba(111, 139, 116, 0.36); border-radius: var(--radius-xs); }
.help-state-card > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, 0.76); border-radius: 999px; font-size: 10px; font-weight: 800; }
.help-state-card h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; overflow-wrap: anywhere; }
.help-state-card p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; }
.help-state-card .button { min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.help-state-card--failure, .help-state-card--pending { background: rgba(249, 239, 231, 0.7); border-color: rgba(188, 111, 60, 0.32); }
.help-state-card--failure > span, .help-state-card--pending > span { color: #824419; background: rgba(255, 248, 241, 0.86); }
.help-state-card--failure h3, .help-state-card--pending h3 { color: #824419; }
.help-action-bar { display: none; }

/* S08 · 求助详情仅演示公开资料、角色边界与 F03 状态重算；平台写入保持 P2 门控。 */
body[data-page="help-detail"] { overflow-x: clip; }
.help-detail-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.help-detail-heading { max-width: 840px; }
.help-detail-heading h1 { margin-top: var(--space-2); font-size: clamp(31px, 3.3vw, 42px); }
.help-detail-heading > p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; line-height: 1.7; }
.help-detail-mobile-header, .help-detail-mobile-bar { display: none; }
.help-detail-modebar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(460px, .94fr); align-items: center; gap: var(--space-5); margin-top: var(--space-5); padding: 14px 16px; border-radius: var(--radius-sm); }
.help-detail-modebar__intro .eyebrow { margin-bottom: 5px; }
.help-detail-modebar__intro > p:not(.eyebrow) { color: var(--ink-soft); font-size: 12px; line-height: 1.6; }
.help-detail-modebar__controls { min-width: 0; display: grid; gap: 8px; }
.help-detail-role-tabs, .help-detail-scenario-tabs { display: grid; gap: 5px; padding: 4px; border: 1px solid rgba(111, 139, 116, .28); border-radius: 14px; background: rgba(255, 255, 255, .5); }
.help-detail-role-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.help-detail-scenario-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.help-detail-role-tabs button, .help-detail-scenario-tabs button { min-height: 44px; min-width: 0; padding: 7px 8px; color: var(--ink-soft); background: transparent; border: 1px solid transparent; border-radius: 10px; font-size: 12px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.help-detail-role-tabs button[aria-selected="true"], .help-detail-scenario-tabs button[aria-pressed="true"] { color: var(--forest); background: rgba(255, 255, 255, .9); border-color: rgba(111, 139, 116, .36); box-shadow: 0 4px 10px rgba(68, 88, 74, .06); }
.help-detail-status { min-height: 23px; margin-top: var(--space-3); color: var(--moss-strong); font-size: 12px; font-weight: 700; line-height: 1.55; }
.help-detail-layout { display: grid; grid-template-columns: 176px minmax(0, 1fr) minmax(264px, 300px); align-items: start; gap: var(--space-5); margin-top: var(--space-4); }
.help-detail-rail, .help-detail-side { position: sticky; top: 96px; }
.help-detail-rail .rail-note { margin-top: var(--space-5); }
.help-detail-main-column { min-width: 0; }
.help-detail-post { padding: clamp(20px, 3vw, 30px); border-radius: var(--radius-md); }
.help-detail-post__header, .help-detail-reply__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.help-detail-chip-row { display: flex; flex-wrap: wrap; gap: 6px; }
.help-detail-chip, .help-detail-state-badge, .help-detail-post__scope { min-height: 27px; display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.3; }
.help-detail-chip { color: var(--moss-strong); background: rgba(229, 236, 229, .79); border: 1px solid rgba(111, 139, 116, .3); }
.help-detail-chip--quiet { color: var(--ink-soft); background: rgba(255, 255, 255, .48); }
.help-detail-state-badge { color: var(--forest); background: rgba(239, 247, 238, .92); border: 1px solid rgba(68, 88, 74, .29); }
body[data-help-detail-state="accepted"] .help-detail-state-badge { color: #365b40; background: rgba(218, 237, 220, .9); border-color: rgba(54, 91, 64, .34); }
.help-detail-post__scope { flex: 0 0 auto; color: var(--ink-faint); background: rgba(255, 255, 255, .58); border: 1px solid rgba(111, 139, 116, .24); }
.help-detail-post h2 { max-width: 760px; margin-top: var(--space-4); font-size: clamp(26px, 3vw, 36px); overflow-wrap: anywhere; }
.help-detail-post__meta { margin-top: 8px; color: var(--ink-faint); font-size: 12px; line-height: 1.55; }
.help-detail-post__meta strong { color: var(--forest); }
.help-detail-media { position: relative; margin: var(--space-5) 0 0; overflow: hidden; border-radius: var(--radius-sm); background: var(--moss-pale); }
.help-detail-media img { width: 100%; aspect-ratio: 1.65; object-fit: cover; }
.help-detail-media figcaption { position: absolute; right: 10px; bottom: 10px; left: 10px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 7px; }
.help-detail-media figcaption span { min-height: 24px; display: inline-flex; align-items: center; padding: 2px 8px; color: var(--forest); background: rgba(255, 253, 248, .91); border-radius: 999px; font-size: 9px; font-weight: 800; }
.help-detail-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: var(--space-5); }
.help-detail-facts > div { min-width: 0; padding: 10px; background: rgba(229, 236, 229, .55); border: 1px solid rgba(111, 139, 116, .25); border-radius: 10px; }
.help-detail-facts dt { color: var(--ink-faint); font-size: 10px; font-weight: 800; }
.help-detail-facts dd { margin: 4px 0 0; color: var(--forest); font-size: 13px; font-weight: 800; overflow-wrap: anywhere; }
.help-detail-copy { display: grid; gap: 10px; margin-top: var(--space-5); }
.help-detail-copy p { color: var(--ink-soft); font-size: 14px; line-height: 1.75; overflow-wrap: anywhere; }
.help-detail-copy strong { color: var(--forest); }
.help-detail-health { display: grid; gap: 4px; margin-top: var(--space-5); padding: 12px; color: #824419; background: rgba(249, 239, 231, .72); border: 1px solid rgba(188, 111, 60, .32); border-radius: var(--radius-xs); font-size: 12px; line-height: 1.55; }
.help-detail-health strong { font-size: 12px; }
.help-detail-boundary, .help-detail-public-note { margin-top: var(--space-5); padding: 11px; color: var(--ink-soft); background: rgba(229, 236, 229, .54); border: 1px solid rgba(111, 139, 116, .28); border-radius: var(--radius-xs); font-size: 11px; line-height: 1.6; }
.help-detail-boundary strong, .help-detail-public-note strong { color: var(--forest); }
.help-detail-post__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: var(--space-5); }
.help-detail-post__actions .button { min-height: 44px; padding-inline: 13px; font-size: 12px; }
.help-detail-post__actions > span { color: var(--ink-faint); font-size: 11px; line-height: 1.55; }
.help-detail-replies { margin-top: var(--space-6); }
.help-detail-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); }
.help-detail-section-heading h2 { margin-top: 2px; font-size: clamp(23px, 2.5vw, 30px); }
.help-detail-section-heading h2 span { color: var(--moss-strong); }
.help-detail-section-heading > p { max-width: 275px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.help-detail-empty { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 10px; margin-top: var(--space-4); padding: 17px; border-radius: var(--radius-sm); }
.help-detail-empty > span { color: var(--moss-strong); font-size: 26px; line-height: 1; }
.help-detail-empty h3 { color: var(--forest); font-size: 16px; }
.help-detail-empty p { margin-top: 4px; color: var(--ink-soft); font-size: 12px; line-height: 1.6; }
.help-detail-reply { margin-top: var(--space-4); padding: 18px; border-radius: var(--radius-sm); }
.help-detail-reply__header > div { display: grid; gap: 2px; }
.help-detail-reply__header strong { color: var(--forest); font-size: 14px; }
.help-detail-reply__header span { color: var(--ink-faint); font-size: 10px; font-weight: 700; }
.help-detail-reply__accepted { min-height: 26px; flex: 0 0 auto; display: inline-flex; align-items: center; padding: 2px 8px; color: #365b40; background: rgba(218, 237, 220, .82); border: 1px solid rgba(54, 91, 64, .28); border-radius: 999px; font-size: 10px; font-weight: 800; }
.help-detail-reply > p { margin-top: var(--space-4); color: var(--ink-soft); font-size: 13px; line-height: 1.75; overflow-wrap: anywhere; }
.help-detail-reply__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--space-4); }
.help-detail-reply__actions .button { min-height: 44px; padding-inline: 12px; font-size: 11px; }
.help-detail-remove { min-height: 44px; padding: 0 8px; color: var(--ink-faint); background: transparent; border: 0; font-size: 11px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.help-detail-response-entry { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-top: var(--space-4); padding: 15px 16px; border-radius: var(--radius-sm); }
.help-detail-response-entry > div { min-width: 0; }
.help-detail-response-entry strong { color: var(--forest); font-size: 14px; }
.help-detail-response-entry p { margin-top: 3px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; }
.help-detail-response-entry .button { min-width: 132px; min-height: 44px; padding-inline: 11px; font-size: 12px; }
.help-detail-side { min-width: 0; padding: 18px; border-radius: var(--radius-md); }
.help-detail-side__section + .help-detail-side__section { margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid rgba(111, 139, 116, .24); }
.help-detail-side h2 { margin-top: 2px; font-size: 24px; overflow-wrap: anywhere; }
.help-detail-side h3 { margin-top: 2px; font-size: 18px; }
.help-detail-side__section > p:not(.eyebrow) { margin-top: 8px; color: var(--ink-soft); font-size: 12px; line-height: 1.6; }
.help-detail-state-list { display: grid; gap: 8px; margin: var(--space-4) 0 0; }
.help-detail-state-list > div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding-bottom: 8px; border-bottom: 1px solid rgba(111, 139, 116, .18); }
.help-detail-state-list dt { color: var(--ink-faint); font-size: 10px; font-weight: 800; }
.help-detail-state-list dd { margin: 0; color: var(--forest); font-size: 11px; font-weight: 800; text-align: right; overflow-wrap: anywhere; }
.help-detail-no-auto { display: grid; gap: 4px; margin-top: var(--space-5); padding: 11px; color: var(--ink-soft); background: rgba(255, 255, 255, .52); border: 1px solid rgba(111, 139, 116, .28); border-radius: var(--radius-xs); font-size: 11px; line-height: 1.55; }
.help-detail-no-auto strong { color: var(--forest); }
.help-detail-public-note { margin-top: var(--space-5); }
.help-detail-f03 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, .42); }
.help-detail-f03-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.help-detail-state-card { min-width: 0; min-height: 230px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-xs); }
.help-detail-state-card > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .76); border-radius: 999px; font-size: 10px; font-weight: 800; }
.help-detail-state-card h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; overflow-wrap: anywhere; }
.help-detail-state-card p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.help-detail-state-card .button { width: 100%; min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.help-detail-state-card .button + .button { margin-top: 7px; }
/* S08 动态状态必须互斥；组件 display 值不得覆盖 hidden 语义。 */
.help-detail-page [hidden] { display: none !important; }

/* S09 · 登录门只恢复原任务；表单状态、返回语义与账号边界均为本地页面内预览。 */
body[data-page="login"] { overflow-x: clip; }
.login-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.login-heading { max-width: 760px; }
.login-heading h1 { margin-top: var(--space-2); font-size: clamp(31px, 3.3vw, 42px); }
.login-heading > p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; line-height: 1.7; }
.login-mobile-header, .login-mobile-action-bar { display: none; }
.login-workbench { display: grid; grid-template-columns: minmax(286px, .76fr) minmax(0, 1.24fr); align-items: stretch; gap: var(--space-5); margin-top: var(--space-6); padding: clamp(14px, 2.2vw, 22px); border-radius: var(--radius-lg); }
.login-brand-guidance { min-width: 0; display: flex; flex-direction: column; padding: 14px; border-radius: var(--radius-md); }
.login-brand-guidance__media { position: relative; min-height: 360px; margin: 0; overflow: hidden; border: 1px solid rgba(111, 139, 116, .28); border-radius: var(--radius-sm); background: var(--moss-pale); }
.login-brand-guidance__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 17%; }
.login-brand-guidance__media figcaption { position: absolute; right: 9px; bottom: 9px; left: 9px; min-height: 25px; display: inline-flex; align-items: center; width: max-content; max-width: calc(100% - 18px); padding: 2px 8px; color: var(--forest); background: rgba(255, 253, 248, .9); border-radius: 999px; font-size: 10px; font-weight: 800; }
.login-brand-guidance__copy { display: grid; gap: 8px; padding: var(--space-4) 3px 2px; }
.login-brand-guidance__copy h2 { font-size: clamp(22px, 2.15vw, 30px); overflow-wrap: anywhere; }
.login-brand-guidance__copy > p:not(.eyebrow) { color: var(--ink-soft); font-size: 12px; line-height: 1.65; }
.login-brand-guidance__promise { display: grid; gap: 3px; margin-top: 2px; padding: 11px; color: var(--ink-soft); background: rgba(229, 236, 229, .62); border: 1px solid rgba(111, 139, 116, .29); border-radius: var(--radius-xs); font-size: 11px; line-height: 1.55; }
.login-brand-guidance__promise strong { color: var(--forest); font-size: 11px; }
.login-form-panel { min-width: 0; align-self: center; padding: clamp(2px, .6vw, 7px); }
.login-form-panel h2 { margin-top: 3px; font-size: clamp(25px, 2.55vw, 33px); overflow-wrap: anywhere; }
.login-form-panel__intro { margin-top: 8px; color: var(--ink-soft); font-size: 13px; line-height: 1.65; }
.login-return-context { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; margin-top: var(--space-5); padding: 13px; background: rgba(247, 251, 246, .77); border: 1px solid rgba(111, 139, 116, .33); border-radius: var(--radius-xs); }
.login-return-context__label { color: var(--moss-strong); font-size: 10px; font-weight: 800; }
.login-return-context h3 { margin-top: 3px; font-size: 15px; overflow-wrap: anywhere; }
.login-return-context__tag { min-height: 25px; align-self: start; display: inline-flex; align-items: center; max-width: 130px; padding: 2px 8px; color: var(--forest); background: rgba(229, 236, 229, .84); border: 1px solid rgba(111, 139, 116, .28); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.login-return-context > p { grid-column: 1 / -1; color: var(--ink-soft); font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
.login-field { margin-top: var(--space-5); }
.login-field label, .login-code-panel > label { display: block; color: var(--forest); font-size: 12px; font-weight: 800; }
.login-field input { width: 100%; min-height: 46px; margin-top: 7px; padding: 11px 12px; color: var(--ink); background: rgba(255, 255, 255, .68); border: 1px solid rgba(111, 139, 116, .4); border-radius: var(--radius-xs); line-height: 1.3; }
.login-field input::placeholder { color: var(--ink-faint); }
.login-field__error { margin-top: 6px; color: #a0572b; font-size: 11px; font-weight: 700; line-height: 1.5; }
.login-send-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--space-4); }
.login-send-row .button, .login-form-actions .button { min-height: 44px; min-width: 132px; padding-inline: 13px; font-size: 12px; }
.login-inline-state { display: grid; gap: 3px; margin-top: 10px; padding: 11px; border-radius: var(--radius-xs); font-size: 11px; line-height: 1.55; }
.login-inline-state strong { font-size: 11px; }
.login-inline-state--failure { color: #824419; background: rgba(249, 239, 231, .74); border: 1px solid rgba(188, 111, 60, .32); }
.login-inline-state--pending { color: #824419; background: rgba(249, 239, 231, .62); border: 1px solid rgba(188, 111, 60, .29); }
.login-inline-state--success { color: #365b40; background: rgba(218, 237, 220, .66); border: 1px solid rgba(54, 91, 64, .28); }
.login-code-panel { margin-top: var(--space-5); }
.login-code-line { min-width: 0; display: flex; align-items: center; gap: 18px; margin-top: 7px; }
.login-code-cells { min-width: 0; flex: 1 1 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 7px; max-width: 364px; }
.login-code-cells input { width: 100%; min-width: 0; min-height: 44px; padding: 0; color: var(--forest); background: rgba(255, 255, 255, .7); border: 1px solid rgba(111, 139, 116, .4); border-radius: 10px; font-size: 16px; font-weight: 800; line-height: 1; text-align: center; }
.login-verified-badge { min-height: 28px; flex: 0 0 auto; display: inline-flex; align-items: center; padding: 2px 8px; color: #365b40; background: rgba(218, 237, 220, .84); border: 1px solid rgba(54, 91, 64, .28); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.2; white-space: nowrap; }
.login-code-panel__hint { margin-top: 7px; color: var(--ink-faint); font-size: 10px; line-height: 1.55; }
.login-no-write, .login-account-boundary { display: grid; gap: 3px; margin-top: 10px; padding: 11px; border-radius: var(--radius-xs); font-size: 11px; line-height: 1.55; }
.login-no-write { color: var(--ink-soft); background: rgba(229, 236, 229, .58); border: 1px solid rgba(111, 139, 116, .28); }
.login-no-write strong { color: var(--forest); }
.login-account-boundary { color: #824419; background: rgba(249, 239, 231, .64); border: 1px solid rgba(188, 111, 60, .3); }
.login-account-boundary strong { color: #824419; }
.login-status { min-height: 19px; margin-top: 10px; color: var(--moss-strong); font-size: 11px; font-weight: 700; line-height: 1.55; }
.login-form-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--space-4); }
.login-form-actions .button--ghost { margin-left: auto; }
.login-f01 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, .42); }
.login-f01__heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); }
.login-f01__heading h2 { margin-top: 2px; max-width: 740px; font-size: clamp(23px, 2.5vw, 30px); }
.login-f01__heading > p { max-width: 278px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.login-f01-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.login-state-card { min-width: 0; min-height: 208px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-xs); }
.login-state-card > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; max-width: 100%; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .76); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.login-state-card h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; overflow-wrap: anywhere; }
.login-state-card p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.login-state-card .button { width: 100%; min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.login-state-card--failure, .login-state-card--pending { background: rgba(249, 239, 231, .7); border-color: rgba(188, 111, 60, .32); }
.login-state-card--failure > span, .login-state-card--pending > span { color: #824419; background: rgba(255, 248, 241, .86); }
.login-state-card--failure h3, .login-state-card--pending h3 { color: #824419; }
.login-state-card--success { background: rgba(237, 247, 238, .72); border-color: rgba(80, 120, 89, .31); }
.login-state-card--success > span { color: #365b40; background: rgba(218, 237, 220, .86); }
.login-page [hidden] { display: none !important; }

/* S10 · 搜索仅呈现公开入口；筛选、空/错/加载和私密排除都在页面内预览。 */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
body[data-page="search"] { overflow-x: clip; }
.search-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.search-heading { max-width: 830px; }
.search-heading h1 { margin-top: var(--space-2); font-size: clamp(31px, 3.3vw, 42px); }
.search-heading > p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; line-height: 1.7; }
.search-mobile-header, .search-mobile-nav { display: none; }
.search-workbench { margin-top: var(--space-6); padding: clamp(14px, 2.2vw, 22px); border-radius: var(--radius-lg); }
.search-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding: 12px; background: rgba(247, 251, 246, .68); border: 1px solid rgba(111, 139, 116, .28); border-radius: var(--radius-sm); }
.search-input-wrap { min-width: 0; min-height: 48px; display: grid; grid-template-columns: 26px minmax(0, 1fr) 32px; align-items: center; gap: 5px; padding: 0 8px; color: var(--moss-strong); background: rgba(255, 255, 255, .74); border: 1px solid rgba(111, 139, 116, .42); border-radius: var(--radius-xs); }
.search-input-wrap > span { display: grid; place-items: center; font-size: 19px; }
.search-input-wrap input { width: 100%; min-width: 0; min-height: 44px; padding: 0; color: var(--ink); background: transparent; border: 0; outline: 0; font-size: 16px; line-height: 1.3; }
.search-input-wrap input::placeholder { color: var(--ink-faint); }
.search-input-wrap__clear { width: 28px; height: 28px; display: grid; place-items: center; padding: 0; color: var(--ink-faint); background: transparent; border: 0; border-radius: 50%; font-size: 18px; line-height: 1; }
.search-input-wrap__clear:hover { color: var(--forest); background: rgba(229, 236, 229, .72); }
.search-toolbar__submit { min-width: 138px; min-height: 48px; padding-inline: 14px; font-size: 12px; }
.search-tabs { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; padding: 4px; background: rgba(229, 236, 229, .65); border: 1px solid rgba(111, 139, 116, .25); border-radius: var(--radius-xs); }
.search-tabs button { min-height: 42px; min-width: 0; padding: 7px 8px; color: var(--ink-soft); background: transparent; border: 1px solid transparent; border-radius: 10px; font-size: 12px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.search-tabs button span { color: var(--ink-faint); font-size: 10px; }
.search-tabs button[aria-selected="true"] { color: var(--forest); background: rgba(255, 255, 255, .9); border-color: rgba(111, 139, 116, .34); box-shadow: 0 4px 10px rgba(68, 88, 74, .06); }
.search-tabs button[aria-selected="true"] span { color: var(--moss-strong); }
.search-toolbar__filters { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.search-public-scope, .search-current-filter { min-height: 27px; display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.3; }
.search-public-scope { color: var(--moss-strong); background: rgba(229, 236, 229, .82); border: 1px solid rgba(111, 139, 116, .28); }
.search-current-filter { color: var(--forest); background: rgba(255, 255, 255, .64); border: 1px solid rgba(111, 139, 116, .26); }
.search-toolbar__filters .button { min-height: 40px; min-width: 0; padding-inline: 11px; font-size: 11px; }
.search-toolbar__filters .button--secondary { margin-left: auto; }
.search-status { min-height: 20px; margin-top: 9px; color: var(--moss-strong); font-size: 11px; font-weight: 700; line-height: 1.55; }
.search-layout { display: grid; grid-template-columns: 178px minmax(0, 1fr) minmax(244px, 274px); align-items: start; gap: var(--space-5); margin-top: var(--space-3); }
.search-filter-rail, .search-scope-rail { min-width: 0; position: sticky; top: 96px; padding: 15px; border-radius: var(--radius-sm); }
.search-filter-rail__section, .search-scope-rail__section { display: grid; gap: 4px; padding: 11px 0; border-bottom: 1px solid rgba(111, 139, 116, .2); }
.search-filter-rail__section strong, .search-scope-rail__section strong { color: var(--forest); font-size: 12px; }
.search-filter-rail__section span, .search-scope-rail__section span { color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.search-filter-rail__private { display: grid; gap: 4px; margin-top: var(--space-4); padding: 10px; color: #824419; background: rgba(249, 239, 231, .68); border: 1px solid rgba(188, 111, 60, .29); border-radius: var(--radius-xs); font-size: 10px; line-height: 1.55; }
.search-filter-rail__private strong { color: #824419; font-size: 10px; }
.search-filter-rail > .button { width: 100%; min-height: 44px; margin-top: var(--space-5); padding-inline: 8px; font-size: 11px; }
.search-main-column { min-width: 0; }
.search-results-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); padding: 3px 2px 0; }
.search-results-heading h2 { margin-top: 2px; font-size: clamp(23px, 2.5vw, 30px); overflow-wrap: anywhere; }
.search-results-heading h2 > span:first-child { color: var(--moss-strong); }
.search-results-heading > p { max-width: 260px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.search-result-group { margin-top: var(--space-5); }
.search-result-group > header { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.search-result-group h3 { color: var(--forest); font-size: 16px; }
.search-result-card { min-width: 0; display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 13px; align-items: stretch; padding: 10px; border-radius: var(--radius-sm); transition: transform .18s ease, box-shadow .18s ease; }
.search-result-card + .search-result-card { margin-top: 9px; }
.search-result-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lift); }
.search-result-card__media { position: relative; min-height: 110px; margin: 0; overflow: hidden; border-radius: 10px; background: var(--moss-pale); }
.search-result-card__media img { width: 100%; height: 100%; object-fit: cover; }
.search-result-card__media figcaption { position: absolute; right: 6px; bottom: 6px; left: 6px; min-height: 20px; display: inline-flex; align-items: center; width: max-content; max-width: calc(100% - 12px); padding: 1px 6px; color: var(--forest); background: rgba(255, 253, 248, .91); border-radius: 999px; font-size: 8px; font-weight: 800; line-height: 1.2; }
.search-result-card > div { min-width: 0; align-self: center; }
.search-result-card__chips { display: flex; flex-wrap: wrap; gap: 5px; }
.search-result-card__chips span { min-height: 22px; display: inline-flex; align-items: center; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .78); border: 1px solid rgba(111, 139, 116, .24); border-radius: 999px; font-size: 9px; font-weight: 800; line-height: 1.25; }
.search-result-card h4 { margin-top: 8px; color: var(--forest); font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.search-result-card p { margin-top: 5px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.search-result-card small { display: block; margin-top: 7px; color: var(--ink-faint); font-size: 10px; line-height: 1.45; }
.search-result-card--copy { display: block; min-height: 122px; padding: 15px; }
.search-result-card--user { grid-template-columns: 42px minmax(0, 1fr); min-height: 106px; }
.search-user-avatar { width: 38px; height: 38px; align-self: center; display: grid; place-items: center; color: white; background: var(--moss-strong); border-radius: 50%; font-size: 14px; font-weight: 800; }
.search-skeleton { min-height: 294px; display: grid; gap: 10px; align-content: center; margin-top: var(--space-5); padding: 20px; border-radius: var(--radius-sm); }
.search-skeleton span { height: 62px; display: block; background: linear-gradient(90deg, rgba(255,255,255,.36), rgba(255,255,255,.78), rgba(255,255,255,.36)); background-size: 200% 100%; border-radius: var(--radius-xs); animation: search-skeleton-shift 1.35s ease-in-out infinite; }
.search-skeleton p { color: var(--ink-faint); font-size: 11px; text-align: center; }
@keyframes search-skeleton-shift { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }
.search-empty, .search-error { display: grid; gap: 7px; margin-top: var(--space-5); padding: 20px; border-radius: var(--radius-sm); }
.search-empty h3, .search-error h3 { font-size: 20px; }
.search-empty p, .search-error p { color: var(--ink-soft); font-size: 12px; line-height: 1.65; }
.search-empty .button, .search-error .button { width: max-content; min-height: 44px; margin-top: 4px; padding-inline: 13px; font-size: 11px; }
.search-error { color: #824419; background: rgba(249, 239, 231, .68); border: 1px solid rgba(188, 111, 60, .31); }
.search-error h3 { color: #824419; }
.search-private-note { display: grid; gap: 3px; margin-top: var(--space-5); padding: 11px; color: #824419; background: rgba(249, 239, 231, .66); border: 1px solid rgba(188, 111, 60, .29); border-radius: var(--radius-xs); font-size: 11px; line-height: 1.55; }
.search-private-note strong { color: #824419; font-size: 11px; }
.search-mobile-rules { display: none; }
.search-scope-rail__section + .search-scope-rail__section { margin-top: 2px; }
.search-scope-rail .button { width: 100%; min-height: 44px; margin-top: var(--space-5); padding-inline: 8px; font-size: 11px; }
.search-f06 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, .42); }
.search-f06__heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); }
.search-f06__heading h2 { margin-top: 2px; max-width: 760px; font-size: clamp(23px, 2.5vw, 30px); }
.search-f06__heading > p { max-width: 278px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.search-f06-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.search-state-card { min-width: 0; min-height: 208px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-xs); }
.search-state-card > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; max-width: 100%; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .76); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.search-state-card h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; overflow-wrap: anywhere; }
.search-state-card p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.search-state-card .button { width: 100%; min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.search-state-card--failure { background: rgba(249, 239, 231, .7); border-color: rgba(188, 111, 60, .32); }
.search-state-card--failure > span { color: #824419; background: rgba(255, 248, 241, .86); }
.search-state-card--failure h3 { color: #824419; }
.search-page [hidden] { display: none !important; }

/* S11 · 四类公开图鉴、三维待补资料筛选与不补位的无结果规则。 */
body[data-page="species"] { overflow-x: clip; }
.species-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.species-heading { max-width: 840px; }
.species-heading h1 { margin-top: var(--space-2); font-size: clamp(31px, 3.3vw, 42px); }
.species-heading > p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; line-height: 1.7; }
.species-mobile-header, .species-mobile-nav { display: none; }
.species-workbench { margin-top: var(--space-6); padding: clamp(14px, 2.2vw, 22px); border-radius: var(--radius-lg); }
.species-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding: 12px; background: rgba(247, 251, 246, .68); border: 1px solid rgba(111, 139, 116, .28); border-radius: var(--radius-sm); }
.species-input-wrap { min-width: 0; min-height: 48px; display: grid; grid-template-columns: 26px minmax(0, 1fr) 44px; align-items: center; gap: 5px; padding: 0 8px; color: var(--moss-strong); background: rgba(255, 255, 255, .74); border: 1px solid rgba(111, 139, 116, .42); border-radius: var(--radius-xs); }
.species-input-wrap > span { display: grid; place-items: center; font-size: 19px; }
.species-input-wrap input { width: 100%; min-width: 0; min-height: 44px; padding: 0; color: var(--ink); background: transparent; border: 0; outline: 0; font-size: 16px; line-height: 1.3; }
.species-input-wrap input::placeholder { color: var(--ink-faint); }
.species-input-wrap__clear { width: 44px; height: 44px; display: grid; place-items: center; padding: 0; color: var(--ink-faint); background: transparent; border: 0; border-radius: 50%; font-size: 18px; line-height: 1; }
.species-input-wrap__clear:hover { color: var(--forest); background: rgba(229, 236, 229, .72); }
.species-toolbar__submit { min-width: 138px; min-height: 48px; padding-inline: 14px; font-size: 12px; }
.species-categories { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr 1.45fr 1fr 1fr; gap: 5px; padding: 4px; background: rgba(229, 236, 229, .65); border: 1px solid rgba(111, 139, 116, .25); border-radius: var(--radius-xs); }
.species-categories button { min-height: 44px; min-width: 0; padding: 7px 8px; color: var(--ink-soft); background: transparent; border: 1px solid transparent; border-radius: 10px; font-size: 12px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.species-categories button span { color: var(--ink-faint); font-size: 10px; }
.species-categories button[aria-selected="true"] { color: var(--forest); background: rgba(255, 255, 255, .9); border-color: rgba(111, 139, 116, .34); box-shadow: 0 4px 10px rgba(68, 88, 74, .06); }
.species-categories button[aria-selected="true"] span { color: var(--moss-strong); }
.species-toolbar__conditions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.species-public-scope, .species-current-category { min-height: 27px; display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.3; }
.species-public-scope { color: var(--moss-strong); background: rgba(229, 236, 229, .82); border: 1px solid rgba(111, 139, 116, .28); }
.species-current-category { color: var(--forest); background: rgba(255, 255, 255, .64); border: 1px solid rgba(111, 139, 116, .26); }
.species-toolbar__conditions .button { min-height: 44px; min-width: 0; padding-inline: 11px; font-size: 11px; }
.species-toolbar__conditions .button--secondary { margin-left: auto; }
.species-status { min-height: 20px; margin-top: 9px; color: var(--moss-strong); font-size: 11px; font-weight: 700; line-height: 1.55; }
.species-layout { display: grid; grid-template-columns: 178px minmax(0, 1fr) minmax(228px, 254px); align-items: start; gap: var(--space-5); margin-top: var(--space-3); }
.species-filter-rail, .species-scope-rail { min-width: 0; position: sticky; top: 96px; padding: 15px; border-radius: var(--radius-sm); }
.species-filter-rail__section, .species-scope-rail__section { display: grid; gap: 5px; padding: 11px 0; border-bottom: 1px solid rgba(111, 139, 116, .2); }
.species-filter-rail__section strong, .species-scope-rail__section strong { color: var(--forest); font-size: 12px; }
.species-filter-rail__section span, .species-scope-rail__section span { color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.species-filter-rail__section button { min-height: 44px; justify-self: start; padding: 3px 9px; color: #824419; background: rgba(249, 239, 231, .66); border: 1px solid rgba(188, 111, 60, .28); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; }
.species-filter-rail__section button[aria-pressed="true"] { color: #fff8f1; background: #9b633d; border-color: #9b633d; }
.species-filter-rail__scope { display: grid; gap: 4px; margin-top: var(--space-4); padding: 10px; color: #824419; background: rgba(249, 239, 231, .68); border: 1px solid rgba(188, 111, 60, .29); border-radius: var(--radius-xs); font-size: 10px; line-height: 1.55; }
.species-filter-rail__scope strong { color: #824419; font-size: 10px; }
.species-filter-rail > .button { width: 100%; min-height: 44px; margin-top: var(--space-5); padding-inline: 8px; font-size: 11px; }
.species-main-column { min-width: 0; }
.species-mobile-filter-panel { display: none; }
.species-results-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); padding: 3px 2px 0; }
.species-results-heading h2 { margin-top: 2px; font-size: clamp(23px, 2.5vw, 30px); overflow-wrap: anywhere; }
.species-results-heading h2 > span:first-child { color: var(--moss-strong); }
.species-results-heading > p { max-width: 274px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.species-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: var(--space-5); }
.species-list-card { min-width: 0; min-height: 156px; display: grid; grid-template-columns: 106px minmax(0, 1fr); gap: 12px; align-items: stretch; padding: 10px; border-radius: var(--radius-sm); transition: transform .18s ease, box-shadow .18s ease; }
.species-list-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lift); }
.species-list-card__media { position: relative; min-height: 134px; margin: 0; overflow: hidden; border-radius: 10px; background: var(--moss-pale); }
.species-list-card__media img { width: 100%; height: 100%; object-fit: cover; }
.species-list-card__media figcaption { position: absolute; right: 6px; bottom: 6px; left: 6px; min-height: 20px; display: inline-flex; align-items: center; width: max-content; max-width: calc(100% - 12px); padding: 1px 6px; color: var(--forest); background: rgba(255, 253, 248, .91); border-radius: 999px; font-size: 8px; font-weight: 800; line-height: 1.2; }
.species-list-card__copy { min-width: 0; align-self: center; display: grid; align-content: center; gap: 4px; }
.species-list-card__category { min-height: 21px; display: inline-flex; align-items: center; justify-self: start; max-width: 100%; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .8); border: 1px solid rgba(111, 139, 116, .23); border-radius: 999px; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.species-list-card h3 { margin-top: 2px; color: var(--forest); font-size: 16px; line-height: 1.3; overflow-wrap: anywhere; }
.species-list-card__latin { color: var(--ink-soft); font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.species-list-card__tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.species-list-card__tags span { min-height: 20px; display: inline-flex; align-items: center; padding: 1px 6px; color: #824419; background: rgba(249, 239, 231, .67); border: 1px solid rgba(188, 111, 60, .25); border-radius: 999px; font-size: 8px; font-weight: 800; line-height: 1.25; }
.species-list-card__meta-rail { min-width: 0; margin-top: 3px; padding: 6px 8px; color: var(--ink-soft); background: rgba(229, 236, 229, .5); border: 1px solid rgba(111, 139, 116, .24); border-radius: 8px; font-size: 9px; line-height: 1.42; overflow-wrap: anywhere; }
.species-unknown-note, .species-handoff-note { display: grid; gap: 4px; margin-top: var(--space-5); padding: 12px; border-radius: var(--radius-xs); font-size: 11px; line-height: 1.55; }
.species-unknown-note { color: var(--ink-soft); background: rgba(229, 236, 229, .55); border: 1px solid rgba(111, 139, 116, .28); }
.species-unknown-note strong, .species-handoff-note strong { color: var(--forest); font-size: 11px; }
.species-handoff-note { color: var(--ink-soft); background: rgba(244, 249, 243, .72); border: 1px solid rgba(111, 139, 116, .28); }
.species-no-match { display: grid; gap: 7px; margin-top: var(--space-5); padding: 20px; color: #824419; background: rgba(249, 239, 231, .69); border: 1px solid rgba(188, 111, 60, .31); border-radius: var(--radius-sm); }
.species-no-match h3 { color: #824419; font-size: 20px; }
.species-no-match > p:not(.eyebrow) { color: #824419; font-size: 12px; line-height: 1.65; }
.species-no-match > div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 3px; }
.species-no-match .button { min-height: 44px; padding-inline: 13px; font-size: 11px; }
.species-scope-rail__section + .species-scope-rail__section { margin-top: 2px; }
.species-scope-rail .button { width: 100%; min-height: 44px; margin-top: var(--space-5); padding-inline: 8px; font-size: 11px; }
.species-f11 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, .42); }
.species-f11__heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); }
.species-f11__heading h2 { margin-top: 2px; max-width: 780px; font-size: clamp(23px, 2.5vw, 30px); }
.species-f11__heading > p { max-width: 278px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.species-f11-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.species-state-card { min-width: 0; min-height: 208px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-xs); }
.species-state-card > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; max-width: 100%; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .76); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.species-state-card h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; overflow-wrap: anywhere; }
.species-state-card p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.species-state-card .button { width: 100%; min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.species-state-card--failure { background: rgba(249, 239, 231, .7); border-color: rgba(188, 111, 60, .32); }
.species-state-card--failure > span { color: #824419; background: rgba(255, 248, 241, .86); }
.species-state-card--failure h3 { color: #824419; }
.species-page [hidden] { display: none !important; }

/* S12 · 来源关联事实、参数待补与公开内容边界。 */
body[data-page="species-detail"] { overflow-x: clip; }
.species-detail-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.species-detail-heading { max-width: 760px; }
.species-detail-heading > p:not(.eyebrow) { margin-top: var(--space-3); color: var(--ink-soft); font-size: 15px; line-height: 1.7; }
.species-detail-mobile-header, .species-detail-mobile-nav { display: none; }
.species-detail-context { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: var(--space-5); color: var(--ink-faint); font-size: 11px; font-weight: 750; line-height: 1.5; }
.species-detail-context a { min-height: 38px; display: inline-flex; align-items: center; padding: 4px 10px; color: var(--forest); background: rgba(255, 255, 255, .62); border: 1px solid rgba(111, 139, 116, .28); border-radius: 999px; }
.species-detail-status { min-height: 20px; margin-top: 8px; color: var(--moss-strong); font-size: 11px; font-weight: 750; line-height: 1.55; }
.species-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(244px, 276px); align-items: start; gap: var(--space-5); margin-top: var(--space-3); }
.species-detail-article { min-width: 0; }
.species-detail-hero { display: grid; grid-template-columns: minmax(220px, .86fr) minmax(0, 1fr); gap: clamp(14px, 2.5vw, 26px); align-items: stretch; padding: clamp(12px, 2.3vw, 20px); border-radius: var(--radius-md); }
.species-detail-hero--no-media { grid-template-columns: 1fr; }
.species-detail-hero__media { position: relative; min-height: 218px; margin: 0; overflow: hidden; border-radius: var(--radius-sm); background: var(--moss-pale); }
.species-detail-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.species-detail-hero__media figcaption { position: absolute; right: 8px; bottom: 8px; left: 8px; display: inline-flex; align-items: center; width: max-content; max-width: calc(100% - 16px); min-height: 22px; padding: 2px 7px; color: var(--forest); background: rgba(255, 253, 248, .91); border-radius: 999px; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.species-detail-hero__copy { min-width: 0; align-self: center; display: grid; align-content: center; gap: 7px; padding: 4px 0; }
.species-detail-hero__category { min-height: 24px; display: inline-flex; align-items: center; justify-self: start; max-width: 100%; padding: 2px 8px; color: var(--moss-strong); background: rgba(229, 236, 229, .81); border: 1px solid rgba(111, 139, 116, .25); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.species-detail-hero h1 { color: var(--forest); font-size: clamp(28px, 3vw, 38px); line-height: 1.2; overflow-wrap: anywhere; }
.species-detail-hero__latin { color: var(--ink-soft); font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.species-detail-hero__source { color: var(--ink-faint); font-size: 11px; line-height: 1.6; }
.species-detail-directory { display: grid; gap: 8px; margin-top: var(--space-5); padding: 12px; background: rgba(229, 236, 229, .49); border: 1px solid rgba(111, 139, 116, .28); border-radius: var(--radius-sm); }
.species-detail-directory > p { color: var(--forest); font-size: 11px; font-weight: 800; }
.species-detail-directory > div { display: flex; flex-wrap: wrap; gap: 6px; }
.species-detail-directory a { min-height: 36px; display: inline-flex; align-items: center; padding: 3px 10px; color: var(--ink-soft); background: rgba(255, 255, 255, .72); border: 1px solid rgba(111, 139, 116, .26); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.3; }
.species-detail-directory a:hover, .species-detail-directory__active { color: #fff; background: var(--forest); border-color: var(--forest); }
.species-detail-fact { display: grid; gap: 8px; margin-top: var(--space-4); padding: clamp(14px, 2.1vw, 18px); border-radius: var(--radius-sm); }
.species-detail-fact > div { display: grid; gap: 2px; }
.species-detail-fact h2, .species-detail-parameters h2, .species-detail-related h2, .species-detail-no-profile h2 { color: var(--forest); font-size: 20px; line-height: 1.35; }
.species-detail-fact > p { color: var(--ink-soft); font-size: 13px; line-height: 1.75; }
.species-detail-fact__source { min-height: 32px; display: inline-flex; align-items: center; justify-self: start; max-width: 100%; padding: 3px 8px; color: var(--moss-strong); background: rgba(229, 236, 229, .72); border: 1px solid rgba(111, 139, 116, .22); border-radius: 999px; font-size: 9px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.species-detail-parameters { display: grid; gap: 10px; margin-top: var(--space-4); padding: clamp(15px, 2.3vw, 20px); color: #824419; background: rgba(249, 239, 231, .72); border: 1px solid rgba(188, 111, 60, .33); border-radius: var(--radius-sm); }
.species-detail-parameters h2 { color: #824419; }
.species-detail-parameters > p { color: #824419; font-size: 12px; line-height: 1.65; }
.species-detail-parameters dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 2px 0 0; }
.species-detail-parameters dl > div { display: grid; gap: 4px; min-width: 0; padding: 10px; background: rgba(255, 248, 241, .83); border: 1px solid rgba(188, 111, 60, .25); border-radius: 10px; }
.species-detail-parameters dt { color: #824419; font-size: 10px; font-weight: 800; }
.species-detail-parameters dd { margin: 0; color: #824419; font-size: 11px; font-weight: 800; line-height: 1.4; overflow-wrap: anywhere; }
.species-detail-related { display: grid; gap: 9px; margin-top: var(--space-4); padding: clamp(15px, 2.3vw, 20px); border-radius: var(--radius-sm); }
.species-detail-related > div { display: grid; gap: 2px; }
.species-detail-related > p:not(.species-detail-related__note) { color: var(--ink-soft); font-size: 12px; line-height: 1.65; }
.species-detail-related .button { min-height: 44px; width: min(100%, 278px); padding-inline: 13px; font-size: 11px; }
.species-detail-related__note { padding: 10px; color: var(--moss-strong); background: rgba(229, 236, 229, .68); border: 1px solid rgba(111, 139, 116, .25); border-radius: 10px; font-size: 11px; line-height: 1.6; }
.species-detail-no-profile { display: grid; gap: 8px; margin-top: var(--space-4); padding: 20px; border-radius: var(--radius-sm); }
.species-detail-no-profile > p:not(.eyebrow) { color: var(--ink-soft); font-size: 12px; line-height: 1.65; }
.species-detail-no-profile .button { min-height: 44px; width: min(100%, 260px); margin-top: 2px; }
.species-detail-source-rail { position: sticky; top: 96px; display: grid; gap: 11px; padding: 15px; border-radius: var(--radius-sm); }
.species-detail-source-list { display: grid; gap: 9px; }
.species-detail-source-card { display: grid; gap: 6px; min-width: 0; padding: 11px; background: rgba(242, 248, 242, .72); border: 1px solid rgba(111, 139, 116, .29); border-radius: 10px; }
.species-detail-source-card strong { color: var(--forest); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.species-detail-source-card a { color: var(--moss-strong); font-size: 10px; font-weight: 800; line-height: 1.5; overflow-wrap: anywhere; text-decoration: underline; text-decoration-color: rgba(111, 139, 116, .45); text-underline-offset: 3px; }
.species-detail-source-card span { color: var(--ink-soft); font-size: 10px; line-height: 1.55; overflow-wrap: anywhere; }
.species-detail-source-boundary { display: grid; gap: 4px; padding: 11px; color: #824419; background: rgba(249, 239, 231, .7); border: 1px solid rgba(188, 111, 60, .29); border-radius: 10px; }
.species-detail-source-boundary strong { color: #824419; font-size: 11px; }
.species-detail-source-boundary span { font-size: 10px; line-height: 1.55; }
.species-detail-source-rail > .button { min-height: 44px; width: 100%; margin-top: 2px; padding-inline: 8px; font-size: 11px; }
.species-detail-f12 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, .42); }
.species-detail-f12__heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); }
.species-detail-f12__heading h2 { margin-top: 2px; max-width: 780px; color: var(--forest); font-size: clamp(23px, 2.5vw, 30px); line-height: 1.32; }
.species-detail-f12__heading > p { max-width: 278px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.species-detail-f12-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.species-detail-state-card { min-width: 0; min-height: 208px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-xs); }
.species-detail-state-card > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; max-width: 100%; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .76); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.species-detail-state-card h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.species-detail-state-card p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.species-detail-state-card .button { width: 100%; min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.species-detail-state-card--missing { background: rgba(249, 239, 231, .7); border-color: rgba(188, 111, 60, .32); }
.species-detail-state-card--missing > span { color: #824419; background: rgba(255, 248, 241, .86); }
.species-detail-state-card--missing h3 { color: #824419; }
.species-detail-page [hidden] { display: none !important; }

/* S13 · 知识首页：十类入口、来源状态与文章入口使用同一套雨林玻璃层级。 */
body[data-page="knowledge"] { overflow-x: clip; }
.knowledge-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.knowledge-heading { max-width: 790px; }
.knowledge-heading > p:not(.eyebrow) { margin-top: var(--space-3); color: var(--ink-soft); font-size: 15px; line-height: 1.72; }
.knowledge-mobile-header, .knowledge-mobile-nav { display: none; }
.knowledge-workbench { margin-top: var(--space-6); padding: clamp(16px, 2.35vw, 26px); border-radius: var(--radius-md); }
.knowledge-toolbar { display: grid; grid-template-columns: minmax(250px, 1fr) auto auto; align-items: center; gap: 10px; }
.knowledge-input-wrap { min-width: 0; min-height: 46px; display: grid; grid-template-columns: 24px minmax(0, 1fr) 30px; align-items: center; gap: 4px; padding: 0 7px 0 11px; background: rgba(255, 255, 255, .72); border: 1px solid rgba(111, 139, 116, .28); border-radius: 999px; }
.knowledge-input-wrap > span { color: var(--moss-strong); font-size: 20px; line-height: 1; text-align: center; }
.knowledge-input-wrap input { width: 100%; min-width: 0; height: 42px; padding: 0; color: var(--ink); background: transparent; border: 0; outline: 0; font-size: 13px; }
.knowledge-input-wrap input::placeholder { color: var(--ink-faint); }
.knowledge-input-wrap button { min-width: 30px; min-height: 30px; padding: 0; color: var(--moss-strong); background: transparent; border: 0; border-radius: 50%; font-size: 20px; line-height: 1; }
.knowledge-input-wrap button:hover { background: rgba(229, 236, 229, .8); }
.knowledge-current-context { min-height: 32px; display: inline-flex; align-items: center; max-width: 100%; padding: 4px 10px; color: var(--moss-strong); background: rgba(229, 236, 229, .77); border: 1px solid rgba(111, 139, 116, .21); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.knowledge-toolbar__reset { min-height: 44px; padding-inline: 12px; font-size: 11px; white-space: nowrap; }
.knowledge-categories { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-top: var(--space-4); }
.knowledge-categories button { min-width: 0; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 5px 9px; color: var(--ink-soft); background: rgba(255, 255, 255, .55); border: 1px solid rgba(111, 139, 116, .27); border-radius: 10px; font-size: 11px; font-weight: 800; line-height: 1.35; text-align: center; overflow-wrap: anywhere; transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease; }
.knowledge-categories button:hover { color: var(--forest); background: rgba(229, 236, 229, .9); transform: translateY(-1px); }
.knowledge-categories button[aria-selected="true"] { color: #f8fbf7; background: var(--forest); border-color: var(--forest); box-shadow: 0 7px 16px rgba(68, 88, 74, .16); }
.knowledge-status { min-height: 21px; margin-top: 9px; color: var(--moss-strong); font-size: 11px; font-weight: 750; line-height: 1.55; }
.knowledge-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(256px, 286px); align-items: start; gap: var(--space-5); margin-top: var(--space-3); }
.knowledge-main-column { min-width: 0; }
.knowledge-results-heading { display: flex; align-items: end; justify-content: space-between; gap: var(--space-5); margin: var(--space-3) 2px var(--space-4); }
.knowledge-results-heading h2 { color: var(--forest); font-size: clamp(22px, 2.3vw, 29px); line-height: 1.28; overflow-wrap: anywhere; }
.knowledge-results-heading > p { max-width: 360px; color: var(--ink-faint); font-size: 11px; line-height: 1.62; text-align: right; }
.knowledge-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.knowledge-card { position: relative; min-width: 0; min-height: 100%; display: flex; flex-direction: column; overflow: hidden; border-radius: var(--radius-sm); transition: transform .2s ease, box-shadow .2s ease; }
.knowledge-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
.knowledge-card-grid[data-knowledge-card-count="1"] .knowledge-card:not([hidden]) { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(280px, .82fr) minmax(0, 1.18fr); min-height: 282px; }
.knowledge-card-grid[data-knowledge-card-count="1"] .knowledge-card:not([hidden]) .knowledge-card__media { min-height: 282px; }
.knowledge-card-grid[data-knowledge-card-count="1"] .knowledge-card:not([hidden]) .knowledge-card__copy { padding: clamp(16px, 2vw, 23px); }
.knowledge-card-grid[data-knowledge-card-count="1"] .knowledge-card:not([hidden]) h3 { font-size: clamp(19px, 2vw, 25px); }
.knowledge-card-grid[data-knowledge-card-count="1"] .knowledge-card:not([hidden]) .knowledge-card__copy > p { max-width: 610px; font-size: 13px; }
.knowledge-card-grid[data-knowledge-card-count="1"] .knowledge-card:not([hidden]) .knowledge-card__fields { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.knowledge-card__media { position: relative; min-height: 164px; margin: 0; overflow: hidden; background: var(--moss-pale); }
.knowledge-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .28s ease; }
.knowledge-card:hover .knowledge-card__media img { transform: scale(1.035); }
.knowledge-card__media figcaption { position: absolute; right: 8px; bottom: 8px; left: 8px; width: max-content; max-width: calc(100% - 16px); min-height: 21px; display: inline-flex; align-items: center; padding: 2px 7px; color: var(--forest); background: rgba(255, 253, 248, .91); border-radius: 999px; font-size: 8px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.knowledge-card__copy { position: relative; z-index: 1; min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 13px; }
.knowledge-card__chips { display: flex; flex-wrap: wrap; gap: 5px; }
.knowledge-card__chips span { min-height: 21px; display: inline-flex; align-items: center; max-width: 100%; padding: 2px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .8); border: 1px solid rgba(111, 139, 116, .18); border-radius: 999px; font-size: 8px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.knowledge-card h3 { color: var(--forest); font-size: 16px; line-height: 1.38; overflow-wrap: anywhere; }
.knowledge-card__copy > p { color: var(--ink-soft); font-size: 11px; line-height: 1.62; overflow-wrap: anywhere; }
.knowledge-card__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; margin: auto 0 0; }
.knowledge-card__fields > div { min-width: 0; display: grid; gap: 2px; padding: 7px; background: rgba(255, 255, 255, .48); border: 1px solid rgba(111, 139, 116, .19); border-radius: 9px; }
.knowledge-card__fields dt { color: var(--ink-faint); font-size: 8px; font-weight: 800; }
.knowledge-card__fields dd { margin: 0; color: var(--forest); font-size: 9px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.knowledge-card small { color: var(--ink-faint); font-size: 9px; line-height: 1.5; overflow-wrap: anywhere; }
.knowledge-empty, .knowledge-skeleton, .knowledge-error { display: grid; gap: 8px; margin-top: 12px; padding: clamp(16px, 2vw, 22px); border-radius: var(--radius-sm); }
.knowledge-empty { border: 1px dashed rgba(68, 88, 74, .28); }
.knowledge-empty h3, .knowledge-error h3 { color: var(--forest); font-size: 20px; line-height: 1.38; overflow-wrap: anywhere; }
.knowledge-empty > p:not(.eyebrow), .knowledge-error > p:not(.eyebrow) { color: var(--ink-soft); font-size: 12px; line-height: 1.65; }
.knowledge-empty .button, .knowledge-error .button { width: max-content; min-height: 44px; margin-top: 3px; padding-inline: 13px; font-size: 11px; }
.knowledge-skeleton { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; min-height: 184px; }
.knowledge-skeleton > span { min-height: 102px; display: block; border-radius: 12px; background: linear-gradient(100deg, rgba(229, 236, 229, .72) 8%, rgba(255,255,255,.9) 18%, rgba(229, 236, 229, .72) 33%); background-size: 220% 100%; animation: knowledge-skeleton-shift 1.4s linear infinite; }
.knowledge-skeleton > p { grid-column: 1 / -1; color: var(--moss-strong); font-size: 11px; font-weight: 750; line-height: 1.5; }
@keyframes knowledge-skeleton-shift { to { background-position-x: -220%; } }
.knowledge-error { color: #824419; background: rgba(249, 239, 231, .72); border: 1px solid rgba(188, 111, 60, .3); }
.knowledge-error h3 { color: #824419; }
.knowledge-mobile-boundaries { display: none; }
.knowledge-source-rail { position: sticky; top: 96px; display: grid; gap: 11px; padding: 15px; border-radius: var(--radius-sm); }
.knowledge-source-rail__section { display: grid; gap: 5px; min-width: 0; padding: 11px; background: rgba(242, 248, 242, .72); border: 1px solid rgba(111, 139, 116, .27); border-radius: 10px; }
.knowledge-source-rail__section strong { color: var(--forest); font-size: 11px; line-height: 1.45; }
.knowledge-source-rail__section a { color: var(--moss-strong); font-size: 10px; font-weight: 800; line-height: 1.5; overflow-wrap: anywhere; text-decoration: underline; text-decoration-color: rgba(111, 139, 116, .45); text-underline-offset: 3px; }
.knowledge-source-rail__section span { color: var(--ink-soft); font-size: 10px; line-height: 1.55; overflow-wrap: anywhere; }
.knowledge-source-rail__section--pending { background: rgba(249, 239, 231, .68); border-color: rgba(188, 111, 60, .29); }
.knowledge-source-rail__section--pending strong, .knowledge-source-rail__section--pending span { color: #824419; }
.knowledge-source-rail > .button { min-height: 44px; width: 100%; margin-top: 2px; padding-inline: 8px; font-size: 11px; }
.knowledge-f05 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, .42); }
.knowledge-f05__heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); }
.knowledge-f05__heading h2 { max-width: 790px; color: var(--forest); font-size: clamp(23px, 2.5vw, 30px); line-height: 1.32; }
.knowledge-f05__heading > p { max-width: 290px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.knowledge-f05-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.knowledge-state-card { min-width: 0; min-height: 212px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-xs); }
.knowledge-state-card > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; max-width: 100%; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .76); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.knowledge-state-card h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.knowledge-state-card p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.knowledge-state-card .button { width: 100%; min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.knowledge-state-card--failure { background: rgba(249, 239, 231, .7); border-color: rgba(188, 111, 60, .32); }
.knowledge-state-card--failure > span { color: #824419; background: rgba(255, 248, 241, .86); }
.knowledge-state-card--failure h3 { color: #824419; }
.knowledge-page [hidden] { display: none !important; }

/* S14 · 知识文章：资料范围、事实、待补参数、审核与收藏返回保持独立。 */
body[data-page="knowledge-article"] { overflow-x: clip; }
.knowledge-article-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.knowledge-article-heading { max-width: 800px; }
.knowledge-article-heading > p:not(.eyebrow) { margin-top: var(--space-3); color: var(--ink-soft); font-size: 15px; line-height: 1.72; }
.knowledge-article-mobile-header, .knowledge-article-mobile-nav { display: none; }
.knowledge-article-status { min-height: 21px; margin-top: var(--space-4); color: var(--moss-strong); font-size: 11px; font-weight: 750; line-height: 1.55; }
.knowledge-article-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(258px, 288px); align-items: start; gap: var(--space-5); margin-top: var(--space-3); }
.knowledge-article-reading { min-width: 0; }
.knowledge-article-hero { display: grid; gap: var(--space-4); padding: clamp(16px, 2.5vw, 28px); border-radius: var(--radius-md); }
.knowledge-article-hero__context { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; color: var(--ink-faint); font-size: 10px; font-weight: 800; line-height: 1.45; }
.knowledge-article-hero__context a { min-height: 34px; display: inline-flex; align-items: center; padding: 3px 9px; color: var(--forest); background: rgba(255, 255, 255, .62); border: 1px solid rgba(111, 139, 116, .26); border-radius: 999px; }
.knowledge-article-hero__context > span { min-height: 22px; display: inline-flex; align-items: center; padding: 2px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .78); border-radius: 999px; }
.knowledge-article-hero__title { display: grid; gap: 6px; min-width: 0; }
.knowledge-article-hero__title .eyebrow { margin: 0; }
.knowledge-article-hero__title h2 { color: var(--forest); font-size: clamp(28px, 3vw, 39px); line-height: 1.2; overflow-wrap: anywhere; }
.knowledge-article-hero__title > p:not(.eyebrow) { max-width: 760px; color: var(--ink-soft); font-size: 14px; line-height: 1.7; }
.knowledge-article-source-summary { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 5px 10px; padding: 12px; background: rgba(255, 255, 255, .56); border: 1px solid rgba(111, 139, 116, .27); border-radius: var(--radius-xs); }
.knowledge-article-source-summary > span { min-height: 22px; display: inline-flex; align-items: center; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .79); border-radius: 999px; font-size: 9px; font-weight: 800; }
.knowledge-article-source-summary strong { min-width: 0; color: var(--forest); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.knowledge-article-source-summary p { grid-column: 1 / -1; color: var(--ink-soft); font-size: 10px; line-height: 1.55; }
.knowledge-article-source-summary small { color: var(--ink-faint); font-size: 9px; font-weight: 750; white-space: nowrap; }
.knowledge-article-content { display: grid; gap: 12px; margin-top: var(--space-4); }
.knowledge-article-feature-media { position: relative; min-height: 306px; margin: 0; overflow: hidden; border-radius: var(--radius-sm); background: var(--moss-pale); }
.knowledge-article-feature-media img { width: 100%; height: 100%; object-fit: cover; }
.knowledge-article-feature-media figcaption, .knowledge-article-gallery figcaption { position: absolute; right: 9px; bottom: 9px; left: 9px; width: max-content; max-width: calc(100% - 18px); min-height: 22px; display: inline-flex; align-items: center; padding: 2px 7px; color: var(--forest); background: rgba(255, 253, 248, .91); border-radius: 999px; font-size: 8px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; }
.knowledge-article-fact { display: grid; gap: 8px; padding: clamp(15px, 2vw, 20px); border-radius: var(--radius-sm); }
.knowledge-article-fact > div { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.knowledge-article-fact > div > span { min-height: 22px; display: inline-flex; align-items: center; padding: 2px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .8); border: 1px solid rgba(111, 139, 116, .2); border-radius: 999px; font-size: 9px; font-weight: 800; }
.knowledge-article-fact h3 { color: var(--forest); font-size: 18px; line-height: 1.35; }
.knowledge-article-fact > p { color: var(--ink-soft); font-size: 13px; line-height: 1.72; }
.knowledge-article-fact > a { min-height: 36px; justify-self: start; display: inline-flex; align-items: center; padding: 3px 9px; color: var(--moss-strong); background: rgba(229, 236, 229, .68); border: 1px solid rgba(111, 139, 116, .22); border-radius: 999px; font-size: 10px; font-weight: 800; }
.knowledge-article-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.knowledge-article-gallery figure { position: relative; min-width: 0; min-height: 180px; margin: 0; overflow: hidden; border-radius: var(--radius-sm); background: var(--moss-pale); }
.knowledge-article-gallery img { width: 100%; height: 100%; object-fit: cover; }
.knowledge-article-skeleton, .knowledge-article-error, .knowledge-article-unavailable { display: grid; gap: 8px; margin-top: var(--space-4); padding: clamp(16px, 2vw, 22px); border-radius: var(--radius-sm); }
.knowledge-article-skeleton { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; min-height: 204px; }
.knowledge-article-skeleton > span { min-height: 118px; display: block; border-radius: 12px; background: linear-gradient(100deg, rgba(229, 236, 229, .72) 8%, rgba(255,255,255,.9) 18%, rgba(229, 236, 229, .72) 33%); background-size: 220% 100%; animation: knowledge-article-skeleton-shift 1.4s linear infinite; }
.knowledge-article-skeleton > p { grid-column: 1 / -1; color: var(--moss-strong); font-size: 11px; font-weight: 750; line-height: 1.5; }
@keyframes knowledge-article-skeleton-shift { to { background-position-x: -220%; } }
.knowledge-article-error { color: #824419; background: rgba(249, 239, 231, .72); border: 1px solid rgba(188, 111, 60, .3); }
.knowledge-article-error h3, .knowledge-article-unavailable h3 { color: #824419; font-size: 20px; line-height: 1.38; overflow-wrap: anywhere; }
.knowledge-article-error > p:not(.eyebrow), .knowledge-article-unavailable > p:not(.eyebrow) { color: #824419; font-size: 12px; line-height: 1.65; }
.knowledge-article-error .button, .knowledge-article-unavailable .button { width: max-content; min-height: 44px; margin-top: 3px; padding-inline: 13px; font-size: 11px; }
.knowledge-article-unavailable { border: 1px dashed rgba(68, 88, 74, .28); }
.knowledge-article-unavailable h3, .knowledge-article-unavailable > p:not(.eyebrow) { color: var(--forest); }
.knowledge-article-rail { position: sticky; top: 96px; display: grid; gap: 11px; }
.knowledge-article-directory { padding: 13px; border-radius: var(--radius-sm); }
.knowledge-article-directory summary { min-height: 32px; display: flex; align-items: center; color: var(--forest); cursor: pointer; font-size: 12px; font-weight: 800; }
.knowledge-article-directory nav { display: grid; gap: 5px; margin-top: 8px; }
.knowledge-article-directory a { min-height: 32px; display: inline-flex; align-items: center; padding: 3px 8px; color: var(--ink-soft); background: rgba(255, 255, 255, .52); border: 1px solid rgba(111, 139, 116, .18); border-radius: 8px; font-size: 10px; font-weight: 750; }
.knowledge-article-directory a:hover { color: var(--forest); background: rgba(229, 236, 229, .78); }
.knowledge-article-parameters { display: grid; gap: 8px; padding: 14px; color: #824419; background: rgba(249, 239, 231, .72); border: 1px solid rgba(188, 111, 60, .31); border-radius: var(--radius-sm); }
.knowledge-article-parameters .eyebrow { margin-bottom: 3px; color: #824419; }
.knowledge-article-parameters h3 { color: #824419; font-size: 17px; line-height: 1.35; }
.knowledge-article-parameters > p { color: #824419; font-size: 11px; line-height: 1.6; }
.knowledge-article-parameters dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 2px 0 0; }
.knowledge-article-parameters dl > div { min-width: 0; display: grid; gap: 2px; padding: 8px; background: rgba(255, 248, 241, .85); border: 1px solid rgba(188, 111, 60, .23); border-radius: 8px; }
.knowledge-article-parameters dt { color: #824419; font-size: 8px; font-weight: 800; }
.knowledge-article-parameters dd { margin: 0; color: #824419; font-size: 9px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.knowledge-article-source, .knowledge-article-review, .knowledge-article-favorite-gate { display: grid; gap: 6px; padding: 14px; border-radius: var(--radius-sm); }
.knowledge-article-source .eyebrow, .knowledge-article-review .eyebrow, .knowledge-article-favorite-gate .eyebrow { margin-bottom: 1px; }
.knowledge-article-source strong, .knowledge-article-review h3, .knowledge-article-favorite-gate h3 { color: var(--forest); font-size: 13px; line-height: 1.42; overflow-wrap: anywhere; }
.knowledge-article-source a { color: var(--moss-strong); font-size: 10px; font-weight: 800; line-height: 1.5; overflow-wrap: anywhere; text-decoration: underline; text-decoration-color: rgba(111, 139, 116, .45); text-underline-offset: 3px; }
.knowledge-article-source span, .knowledge-article-review p, .knowledge-article-favorite-gate p { color: var(--ink-soft); font-size: 10px; line-height: 1.58; overflow-wrap: anywhere; }
.knowledge-article-review--pending { background: rgba(249, 239, 231, .7); border: 1px solid rgba(188, 111, 60, .29); }
.knowledge-article-review--pending h3, .knowledge-article-review--pending p { color: #824419; }
.knowledge-article-review--approved { background: rgba(229, 236, 229, .72); border: 1px solid rgba(111, 139, 116, .29); }
.knowledge-article-favorite-gate .button { width: 100%; min-height: 44px; margin-top: 3px; padding-inline: 8px; font-size: 10px; }
.knowledge-article-return-notice { display: grid; gap: 4px; margin-top: var(--space-4); padding: 13px; border-radius: var(--radius-xs); }
.knowledge-article-return-notice strong { color: var(--forest); font-size: 12px; }
.knowledge-article-return-notice span { color: var(--ink-soft); font-size: 11px; line-height: 1.6; }
.knowledge-article-f05 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, .42); }
.knowledge-article-f05__heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); }
.knowledge-article-f05__heading h2 { max-width: 790px; color: var(--forest); font-size: clamp(23px, 2.5vw, 30px); line-height: 1.32; }
.knowledge-article-f05__heading > p { max-width: 292px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.knowledge-article-f05-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.knowledge-article-state-card { min-width: 0; min-height: 216px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-xs); }
.knowledge-article-state-card > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; max-width: 100%; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .76); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.knowledge-article-state-card h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.knowledge-article-state-card p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.knowledge-article-state-card .button { width: 100%; min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.knowledge-article-state-card--missing, .knowledge-article-state-card--failure { background: rgba(249, 239, 231, .7); border-color: rgba(188, 111, 60, .32); }
.knowledge-article-state-card--missing > span, .knowledge-article-state-card--failure > span { color: #824419; background: rgba(255, 248, 241, .86); }
.knowledge-article-state-card--missing h3, .knowledge-article-state-card--failure h3 { color: #824419; }
.knowledge-article-page [hidden] { display: none !important; }

/* S15 · 求助中心：公开筛选、状态语义与 S07/S08 路径保持独立。 */
body[data-page="help-center"] { overflow-x: clip; }
.help-center-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.help-center-heading { max-width: 820px; }
.help-center-heading h1 { margin-top: var(--space-2); font-size: clamp(31px, 3.3vw, 42px); }
.help-center-heading > p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; line-height: 1.72; }
.help-center-mobile-header, .help-center-mobile-nav { display: none; }
.help-center-workbench { margin-top: var(--space-6); padding: clamp(16px, 2.35vw, 26px); border-radius: var(--radius-md); }
.help-center-toolbar { display:flex; align-items:center; justify-content:space-between; gap:var(--space-5); }
.help-center-toolbar > div { min-width:0; }
.help-center-toolbar .eyebrow { margin-bottom:5px; }
.help-center-toolbar p:not(.eyebrow) { max-width:650px; color:var(--ink-soft); font-size:12px; line-height:1.6; }
.help-center-toolbar__create { flex:0 0 auto; min-height:44px; padding-inline:15px; font-size:12px; white-space:nowrap; }
.help-center-filter-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.94fr) auto; align-items:end; gap:12px; margin-top:var(--space-4); }
.help-center-filter-group { min-width:0; display:grid; gap:7px; }
.help-center-filter-label { color:var(--ink-faint); font-size:10px; font-weight:800; letter-spacing:.08em; }
.help-center-filter-options { display:grid; gap:5px; padding:4px; background:rgba(255,255,255,.5); border:1px solid rgba(111,139,116,.25); border-radius:14px; }
.help-center-filter-options--species { grid-template-columns:repeat(4,minmax(0,1fr)); }
.help-center-filter-options--status { grid-template-columns:repeat(3,minmax(0,1fr)); }
.help-center-filter-options button { min-width:0; min-height:44px; padding:5px 7px; color:var(--ink-soft); background:transparent; border:1px solid transparent; border-radius:10px; font-size:11px; font-weight:800; line-height:1.3; overflow-wrap:anywhere; transition:color .18s ease,background .18s ease,border-color .18s ease,transform .18s ease; }
.help-center-filter-options button:hover { color:var(--forest); background:rgba(229,236,229,.82); transform:translateY(-1px); }
.help-center-filter-options button[aria-selected="true"] { color:#f8fbf7; background:var(--forest); border-color:var(--forest); box-shadow:0 7px 16px rgba(68,88,74,.16); }
.help-center-filter-context { min-width:0; display:grid; gap:7px; }
.help-center-filter-context > span { min-height:32px; display:inline-flex; align-items:center; max-width:100%; padding:4px 10px; color:var(--moss-strong); background:rgba(229,236,229,.77); border:1px solid rgba(111,139,116,.21); border-radius:999px; font-size:10px; font-weight:800; line-height:1.35; overflow-wrap:anywhere; }
.help-center-filter-context .button { min-height:44px; padding-inline:10px; font-size:10px; white-space:nowrap; }
.help-center-status { min-height:22px; margin-top:var(--space-3); color:var(--moss-strong); font-size:11px; font-weight:750; line-height:1.55; }
.help-center-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(264px,292px); align-items:start; gap:var(--space-5); margin-top:var(--space-3); }
.help-center-main-column { min-width:0; }
.help-center-results-heading { display:flex; align-items:end; justify-content:space-between; gap:var(--space-5); margin:var(--space-3) 2px var(--space-4); }
.help-center-results-heading h2 { color:var(--forest); font-size:clamp(22px,2.3vw,29px); line-height:1.28; overflow-wrap:anywhere; }
.help-center-results-heading > p { max-width:330px; color:var(--ink-faint); font-size:11px; line-height:1.62; text-align:right; }
.help-center-card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.help-center-card { min-width:0; min-height:100%; display:flex; flex-direction:column; overflow:hidden; border-radius:var(--radius-sm); transition:transform .2s ease,box-shadow .2s ease; }
.help-center-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-lift); }
.help-center-card-grid[data-help-center-card-count="1"] .help-center-card:not([hidden]) { grid-column:1 / -1; display:grid; grid-template-columns:minmax(250px,.74fr) minmax(0,1.26fr); min-height:250px; }
.help-center-card-grid[data-help-center-card-count="1"] .help-center-card:not([hidden]) .help-center-card__media { min-height:250px; }
.help-center-card-grid[data-help-center-card-count="1"] .help-center-card:not([hidden]) .help-center-card__copy { padding:clamp(16px,2vw,23px); }
.help-center-card-grid[data-help-center-card-count="1"] .help-center-card:not([hidden]) h3 { font-size:clamp(19px,2vw,25px); }
.help-center-card__media { position:relative; min-height:168px; margin:0; overflow:hidden; background:var(--moss-pale); }
.help-center-card__media img { width:100%; height:100%; object-fit:cover; transition:transform .28s ease; }
.help-center-card:hover .help-center-card__media img { transform:scale(1.035); }
.help-center-card__media figcaption { position:absolute; right:8px; bottom:8px; left:8px; width:max-content; max-width:calc(100% - 16px); min-height:21px; display:inline-flex; align-items:center; padding:2px 7px; color:var(--forest); background:rgba(255,253,248,.91); border-radius:999px; font-size:8px; font-weight:800; line-height:1.25; overflow-wrap:anywhere; }
.help-center-card__copy { min-width:0; flex:1; display:flex; flex-direction:column; gap:8px; padding:13px; }
.help-center-card__chips { display:flex; flex-wrap:wrap; gap:5px; }
.help-center-card__chips span { min-height:22px; display:inline-flex; align-items:center; max-width:100%; padding:2px 7px; color:var(--moss-strong); background:rgba(229,236,229,.8); border:1px solid rgba(111,139,116,.18); border-radius:999px; font-size:9px; font-weight:800; line-height:1.25; overflow-wrap:anywhere; }
.help-center-card__chips .help-center-card__status--waiting { color:#824419; background:rgba(249,239,231,.72); border-color:rgba(188,111,60,.3); }
.help-center-card__chips .help-center-card__status--replied { color:var(--forest); background:rgba(239,247,238,.92); border-color:rgba(68,88,74,.28); }
.help-center-card__chips .help-center-card__status--solved { color:#365b40; background:rgba(218,237,220,.86); border-color:rgba(54,91,64,.3); }
.help-center-card h3 { color:var(--forest); font-size:16px; line-height:1.38; overflow-wrap:anywhere; }
.help-center-card__copy > p { color:var(--ink-soft); font-size:11px; line-height:1.62; overflow-wrap:anywhere; }
.help-center-card__facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; margin:auto 0 0; }
.help-center-card__facts > div { min-width:0; display:grid; gap:2px; padding:7px; background:rgba(255,255,255,.48); border:1px solid rgba(111,139,116,.19); border-radius:9px; }
.help-center-card__facts dt { color:var(--ink-faint); font-size:8px; font-weight:800; }
.help-center-card__facts dd { margin:0; color:var(--forest); font-size:9px; font-weight:800; line-height:1.35; overflow-wrap:anywhere; }
.help-center-card__foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px 10px; margin-top:2px; }
.help-center-card__foot small { min-width:0; color:var(--ink-faint); font-size:9px; line-height:1.5; overflow-wrap:anywhere; }
.help-center-card__foot a { min-height:34px; display:inline-flex; align-items:center; padding:3px 9px; color:var(--moss-strong); background:rgba(229,236,229,.68); border:1px solid rgba(111,139,116,.22); border-radius:999px; font-size:10px; font-weight:800; white-space:nowrap; }
.help-center-empty,.help-center-skeleton,.help-center-error { display:grid; gap:8px; margin-top:12px; padding:clamp(16px,2vw,22px); border-radius:var(--radius-sm); }
.help-center-empty { border:1px dashed rgba(68,88,74,.28); }
.help-center-empty h3,.help-center-error h3 { color:var(--forest); font-size:20px; line-height:1.38; overflow-wrap:anywhere; }
.help-center-empty > p:not(.eyebrow),.help-center-error > p:not(.eyebrow) { color:var(--ink-soft); font-size:12px; line-height:1.65; }
.help-center-empty .button,.help-center-error .button { width:max-content; min-height:44px; margin-top:3px; padding-inline:13px; font-size:11px; }
.help-center-skeleton { grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; min-height:188px; }
.help-center-skeleton > span { min-height:106px; display:block; border-radius:12px; background:linear-gradient(100deg,rgba(229,236,229,.72) 8%,rgba(255,255,255,.9) 18%,rgba(229,236,229,.72) 33%); background-size:220% 100%; animation:help-center-skeleton-shift 1.4s linear infinite; }
.help-center-skeleton > p { grid-column:1 / -1; color:var(--moss-strong); font-size:11px; font-weight:750; line-height:1.5; }
@keyframes help-center-skeleton-shift { to { background-position-x:-220%; } }
.help-center-error { color:#824419; background:rgba(249,239,231,.72); border:1px solid rgba(188,111,60,.3); }
.help-center-error .eyebrow,.help-center-error h3,.help-center-error p { color:#824419; }
.help-center-rail { position:sticky; top:96px; display:grid; gap:11px; padding:15px; border-radius:var(--radius-sm); }
.help-center-rail__section { display:grid; gap:5px; min-width:0; padding:11px; background:rgba(242,248,242,.72); border:1px solid rgba(111,139,116,.27); border-radius:10px; }
.help-center-rail__section .eyebrow { margin-bottom:1px; }
.help-center-rail__section h2 { color:var(--forest); font-size:14px; line-height:1.45; overflow-wrap:anywhere; }
.help-center-rail__section p:not(.eyebrow) { color:var(--ink-soft); font-size:10px; line-height:1.58; overflow-wrap:anywhere; }
.help-center-state-list { display:grid; gap:6px; margin:3px 0 0; }
.help-center-state-list > div { display:flex; align-items:baseline; justify-content:space-between; gap:8px; padding-bottom:6px; border-bottom:1px solid rgba(111,139,116,.18); }
.help-center-state-list dt { color:var(--ink-faint); font-size:9px; font-weight:800; }
.help-center-state-list dd { margin:0; color:var(--forest); font-size:9px; font-weight:800; text-align:right; overflow-wrap:anywhere; }
.help-center-rail__section--health { background:rgba(249,239,231,.68); border-color:rgba(188,111,60,.29); }
.help-center-rail__section--health .eyebrow,.help-center-rail__section--health p:not(.eyebrow) { color:#824419; }
.help-center-rail > .button { width:100%; min-height:44px; margin-top:2px; padding-inline:8px; font-size:11px; }
.help-center-f15 { margin-top:var(--space-7); padding:clamp(20px,3vw,30px); border:1px solid var(--line); border-radius:var(--radius-md); background:rgba(255,255,255,.42); }
.help-center-f15__heading { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--space-4); }
.help-center-f15__heading h2 { max-width:790px; color:var(--forest); font-size:clamp(23px,2.5vw,30px); line-height:1.32; }
.help-center-f15__heading > p { max-width:292px; color:var(--ink-faint); font-size:11px; line-height:1.6; text-align:right; }
.help-center-f15-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; margin-top:var(--space-5); }
.help-center-state-card { min-width:0; min-height:216px; display:flex; flex-direction:column; align-items:stretch; padding:13px; background:rgba(242,248,242,.74); border:1px solid rgba(111,139,116,.36); border-radius:var(--radius-xs); }
.help-center-state-card > span { min-height:22px; align-self:flex-start; display:inline-flex; align-items:center; max-width:100%; padding:1px 7px; color:var(--moss-strong); background:rgba(229,236,229,.76); border-radius:999px; font-size:10px; font-weight:800; line-height:1.25; overflow-wrap:anywhere; }
.help-center-state-card h3 { margin-top:var(--space-3); color:var(--forest); font-size:16px; line-height:1.35; overflow-wrap:anywhere; }
.help-center-state-card p { margin-top:6px; color:var(--ink-soft); font-size:11px; line-height:1.55; overflow-wrap:anywhere; }
.help-center-state-card .button { width:100%; min-height:44px; margin-top:auto; padding-inline:7px; font-size:11px; }
.help-center-state-card--failure { background:rgba(249,239,231,.7); border-color:rgba(188,111,60,.32); }
.help-center-state-card--failure > span { color:#824419; background:rgba(255,248,241,.86); }
.help-center-state-card--failure h3 { color:#824419; }
.help-center-page [hidden] { display:none !important; }

/* S16 · 本人管理面与访客公开面必须从页面结构、动态 DOM 和路径语义同时隔离。 */
body[data-page="user-profile"] { overflow-x: clip; }
.user-profile-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.user-profile-heading { max-width: 830px; }
.user-profile-heading h1 { margin-top: var(--space-2); color: var(--forest); font-size: clamp(31px, 3.3vw, 42px); }
.user-profile-heading > p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; line-height: 1.72; }
.user-profile-mobile-header, .user-profile-mobile-nav { display: none; }
.user-profile-identity { display: grid; grid-template-columns: 74px minmax(0, 1fr) auto; align-items: center; gap: clamp(12px, 2vw, 22px); margin-top: var(--space-6); padding: clamp(16px, 2.4vw, 24px); border-radius: var(--radius-md); }
.user-profile-avatar { width: 74px; height: 74px; display: grid; place-items: center; background: rgba(229, 236, 229, .92); border: 1px solid rgba(111, 139, 116, .45); border-radius: 50%; box-shadow: inset 0 0 0 6px rgba(250, 253, 249, .56); }
.user-profile-avatar::before { content: ""; width: 19px; height: 19px; display: block; border: 2px solid var(--moss-strong); border-radius: 50%; transform: translateY(7px); }
.user-profile-avatar span { width: 36px; height: 20px; display: block; border: 2px solid var(--moss-strong); border-radius: 22px 22px 14px 14px; transform: translateY(-8px); }
.user-profile-identity__copy { min-width: 0; }
.user-profile-identity__copy .eyebrow { margin-bottom: 4px; }
.user-profile-identity h2 { color: var(--forest); font-size: clamp(22px, 2.3vw, 30px); overflow-wrap: anywhere; }
.user-profile-identity__copy > p:not(.eyebrow) { max-width: 610px; margin-top: 5px; color: var(--ink-soft); font-size: 12px; line-height: 1.62; }
.user-profile-metrics { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.user-profile-metrics span { min-height: 24px; display: inline-flex; align-items: center; padding: 2px 8px; color: var(--moss-strong); background: rgba(229, 236, 229, .77); border: 1px solid rgba(111, 139, 116, .22); border-radius: 999px; font-size: 9px; font-weight: 800; line-height: 1.3; }
.user-profile-owner-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.user-profile-owner-actions .button, .user-profile-follow { min-height: 44px; padding-inline: 13px; font-size: 11px; white-space: nowrap; }
.user-profile-follow { min-width: 150px; justify-content: center; }
.user-profile-status { min-height: 22px; margin-top: 9px; color: var(--moss-strong); font-size: 11px; font-weight: 750; line-height: 1.55; }
.user-profile-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; margin-top: var(--space-3); padding: 4px; background: rgba(255, 255, 255, .55); border: 1px solid rgba(111, 139, 116, .25); border-radius: 14px; }
body[data-user-profile-role="visitor"] .user-profile-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.user-profile-tabs button { min-width: 0; min-height: 44px; padding: 4px 8px; color: var(--ink-soft); background: transparent; border: 1px solid transparent; border-radius: 10px; font-size: 11px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease; }
.user-profile-tabs button:hover { color: var(--forest); background: rgba(229, 236, 229, .75); transform: translateY(-1px); }
.user-profile-tabs button[aria-selected="true"] { color: #f8fbf7; background: var(--forest); border-color: var(--forest); box-shadow: 0 7px 16px rgba(68, 88, 74, .16); }
.user-profile-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(252px, 290px); align-items: start; gap: var(--space-5); margin-top: var(--space-4); }
.user-profile-content { min-width: 0; display: grid; gap: 12px; }
.user-profile-content > section > header { display: grid; gap: 3px; margin: 2px 2px 9px; }
.user-profile-content > section > header .eyebrow { margin-bottom: 3px; }
.user-profile-content > section > header h2 { color: var(--forest); font-size: clamp(21px, 2.2vw, 28px); line-height: 1.3; overflow-wrap: anywhere; }
.user-profile-post-card, .user-profile-pet-card, .user-profile-private-pet, .user-profile-collection { min-width: 0; overflow: hidden; border-radius: var(--radius-sm); }
.user-profile-post-card { display: grid; gap: 8px; padding: clamp(16px, 2.2vw, 22px); }
.user-profile-post-card > span, .user-profile-collection__label { min-height: 23px; display: inline-flex; align-items: center; align-self: start; width: max-content; max-width: 100%; padding: 2px 8px; color: var(--moss-strong); background: rgba(229, 236, 229, .78); border: 1px solid rgba(111, 139, 116, .2); border-radius: 999px; font-size: 9px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; }
.user-profile-post-card h3, .user-profile-pet-card h3, .user-profile-private-pet h3, .user-profile-collection h3 { color: var(--forest); font-size: clamp(17px, 1.8vw, 22px); line-height: 1.38; overflow-wrap: anywhere; }
.user-profile-post-card p, .user-profile-pet-card p, .user-profile-private-pet p, .user-profile-collection p { color: var(--ink-soft); font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
.user-profile-post-card a, .user-profile-pet-card a, .user-profile-private-pet a { min-height: 36px; display: inline-flex; align-items: center; align-self: start; margin-top: 2px; padding: 3px 9px; color: var(--moss-strong); background: rgba(229, 236, 229, .68); border: 1px solid rgba(111, 139, 116, .22); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.35; }
.user-profile-pet-card, .user-profile-private-pet, .user-profile-collection { display: grid; grid-template-columns: minmax(164px, .72fr) minmax(0, 1.28fr); }
.user-profile-pet-card figure, .user-profile-private-pet figure, .user-profile-collection figure { position: relative; min-height: 198px; margin: 0; overflow: hidden; background: var(--moss-pale); }
.user-profile-pet-card figure img, .user-profile-private-pet figure img, .user-profile-collection figure img { width: 100%; height: 100%; object-fit: cover; }
.user-profile-pet-card figcaption, .user-profile-private-pet figcaption, .user-profile-collection figcaption { position: absolute; right: 8px; bottom: 8px; left: 8px; min-height: 21px; display: inline-flex; align-items: center; width: max-content; max-width: calc(100% - 16px); padding: 2px 7px; color: var(--forest); background: rgba(255, 253, 248, .91); border-radius: 999px; font-size: 8px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.user-profile-pet-card > div, .user-profile-private-pet__copy, .user-profile-collection__copy { min-width: 0; display: flex; flex-direction: column; gap: 8px; padding: clamp(16px, 2.2vw, 22px); }
.user-profile-chip-row { display: flex; flex-wrap: wrap; gap: 5px; }
.user-profile-chip-row span { min-height: 22px; display: inline-flex; align-items: center; max-width: 100%; padding: 2px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .8); border: 1px solid rgba(111, 139, 116, .18); border-radius: 999px; font-size: 9px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.user-profile-chip-row .user-profile-chip--private { color: #824419; background: rgba(249, 239, 231, .72); border-color: rgba(188, 111, 60, .3); }
.user-profile-pet-card a, .user-profile-private-pet a { margin-top: auto; }
.user-profile-private-pet { border: 1px solid rgba(188, 111, 60, .28); }
.user-profile-private-pet__copy { background: rgba(249, 239, 231, .36); }
.user-profile-private-pet figure { min-height: 182px; }
.user-profile-collection figure { min-height: 172px; }
.user-profile-collection__copy { justify-content: center; }
.user-profile-empty, .user-profile-error { display: grid; gap: 7px; padding: clamp(17px, 2.2vw, 23px); border-radius: var(--radius-sm); }
.user-profile-empty { border: 1px dashed rgba(68, 88, 74, .29); }
.user-profile-empty h3, .user-profile-error h3 { color: var(--forest); font-size: 20px; line-height: 1.38; overflow-wrap: anywhere; }
.user-profile-empty > p:not(.eyebrow), .user-profile-error > p:not(.eyebrow) { color: var(--ink-soft); font-size: 12px; line-height: 1.65; }
.user-profile-empty .button, .user-profile-error .button { width: max-content; min-height: 44px; margin-top: 2px; padding-inline: 13px; font-size: 11px; }
.user-profile-error { color: #824419; background: rgba(249, 239, 231, .73); border: 1px solid rgba(188, 111, 60, .31); }
.user-profile-error .eyebrow, .user-profile-error h3, .user-profile-error p { color: #824419; }
.user-profile-rail { position: sticky; top: 96px; display: grid; gap: 11px; padding: 15px; border-radius: var(--radius-sm); }
.user-profile-rail section { display: grid; gap: 5px; min-width: 0; padding: 11px; background: rgba(242, 248, 242, .72); border: 1px solid rgba(111, 139, 116, .27); border-radius: 10px; }
.user-profile-rail .eyebrow { margin-bottom: 1px; }
.user-profile-rail h2 { color: var(--forest); font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.user-profile-rail p:not(.eyebrow) { color: var(--ink-soft); font-size: 10px; line-height: 1.6; overflow-wrap: anywhere; }
.user-profile-rail__warning { background: rgba(249, 239, 231, .67) !important; border-color: rgba(188, 111, 60, .29) !important; }
.user-profile-rail__warning .eyebrow, .user-profile-rail__warning p { color: #824419 !important; }
.user-profile-rail > .button { width: 100%; min-height: 44px; margin-top: 2px; padding-inline: 8px; font-size: 11px; }
.user-profile-f16 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, .42); }
.user-profile-f16 > header { display: flex; align-items: end; justify-content: space-between; gap: var(--space-4); }
.user-profile-f16 h2 { max-width: 790px; color: var(--forest); font-size: clamp(23px, 2.5vw, 30px); line-height: 1.32; }
.user-profile-f16 > header > p { max-width: 292px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.user-profile-f16-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.user-profile-f16-grid article { min-width: 0; min-height: 216px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-xs); }
.user-profile-f16-grid article > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; max-width: 100%; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .76); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.user-profile-f16-grid h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.user-profile-f16-grid p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.user-profile-f16-grid .button { width: 100%; min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.user-profile-f16__failure { background: rgba(249, 239, 231, .7) !important; border-color: rgba(188, 111, 60, .32) !important; }
.user-profile-f16__failure > span { color: #824419 !important; background: rgba(255, 248, 241, .86) !important; }
.user-profile-f16__failure h3 { color: #824419 !important; }
body[data-page="user-profile"] [hidden] { display: none !important; }

/* S17 · 本人资料编辑：独立草稿、失败恢复与确认返回。 */
.profile-edit-page { min-height: calc(100svh - 76px); padding-block: var(--space-7) var(--space-10); }
.profile-edit-heading { max-width: 870px; }
.profile-edit-heading h1 { margin-top: var(--space-2); color: var(--forest); font-size: clamp(31px, 3.3vw, 42px); }
.profile-edit-heading > p:not(.eyebrow) { max-width: 790px; margin-top: var(--space-4); color: var(--ink-soft); font-size: 15px; line-height: 1.72; }
.profile-edit-mobile-header, .profile-edit-mobile-save-bar { display: none; }
.profile-edit-workbench { display: grid; grid-template-columns: minmax(0, 1.48fr) minmax(272px, .72fr); align-items: start; gap: clamp(16px, 2.5vw, 28px); margin-top: var(--space-6); padding: clamp(18px, 2.8vw, 30px); border-radius: var(--radius-md); }
.profile-edit-form-panel { min-width: 0; display: grid; gap: 14px; }
.profile-edit-form-panel > header { display: grid; gap: 5px; }
.profile-edit-form-panel > header .eyebrow { margin-bottom: 0; }
.profile-edit-form-panel > header h2 { color: var(--forest); font-size: clamp(24px, 2.6vw, 32px); }
.profile-edit-form-panel > header > p:not(.eyebrow) { max-width: 680px; color: var(--ink-soft); font-size: 12px; line-height: 1.65; }
.profile-edit-status { min-height: 20px; color: var(--moss-strong); font-size: 11px; font-weight: 750; line-height: 1.55; }
.profile-edit-avatar-card { display: grid; grid-template-columns: 78px minmax(0, 1fr) auto; align-items: center; gap: clamp(12px, 1.6vw, 18px); min-width: 0; padding: clamp(14px, 2vw, 20px); background: rgba(250, 253, 249, .64); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-sm); }
.profile-edit-avatar-card > div { min-width: 0; }
.profile-edit-avatar-card .eyebrow { margin-bottom: 3px; }
.profile-edit-avatar-card h3 { color: var(--forest); font-size: 15px; line-height: 1.4; overflow-wrap: anywhere; }
.profile-edit-avatar-card p:not(.eyebrow) { margin-top: 4px; color: var(--ink-soft); font-size: 10px; line-height: 1.58; overflow-wrap: anywhere; }
.profile-edit-avatar-card .button { min-width: 116px; min-height: 44px; padding-inline: 12px; font-size: 10px; white-space: nowrap; }
.profile-edit-avatar { width: 78px; height: 78px; display: grid; place-items: center; flex: 0 0 auto; background: rgba(229, 236, 229, .94); border: 1px solid rgba(111, 139, 116, .48); border-radius: 50%; box-shadow: inset 0 0 0 6px rgba(250, 253, 249, .58); }
.profile-edit-avatar::before { content: ""; width: 20px; height: 20px; display: block; border: 2px solid var(--moss-strong); border-radius: 50%; transform: translateY(8px); }
.profile-edit-avatar span { width: 38px; height: 21px; display: block; border: 2px solid var(--moss-strong); border-radius: 22px 22px 14px 14px; transform: translateY(-9px); }
body[data-profile-edit-state="avatar-error"] .profile-edit-avatar-card, body[data-profile-edit-state="validation"] .profile-edit-avatar-card { background: rgba(249, 239, 231, .46); border-color: rgba(188, 111, 60, .58); }
body[data-profile-edit-state="avatar-error"] .profile-edit-avatar, body[data-profile-edit-state="validation"] .profile-edit-avatar { background: rgba(249, 239, 231, .9); border-color: rgba(188, 111, 60, .68); }
body[data-profile-edit-state="avatar-error"] .profile-edit-avatar::before, body[data-profile-edit-state="validation"] .profile-edit-avatar::before, body[data-profile-edit-state="avatar-error"] .profile-edit-avatar span, body[data-profile-edit-state="validation"] .profile-edit-avatar span { border-color: #9a5424; }
.profile-edit-avatar-error, .profile-edit-save-error, .profile-edit-confirmed, .profile-edit-saving, .profile-edit-leave { display: grid; gap: 5px; min-width: 0; padding: 14px; border-radius: var(--radius-xs); }
.profile-edit-avatar-error, .profile-edit-save-error { color: #824419; background: rgba(249, 239, 231, .72); border: 1px solid rgba(188, 111, 60, .36); }
.profile-edit-avatar-error strong, .profile-edit-save-error strong { color: #824419; font-size: 13px; line-height: 1.42; }
.profile-edit-avatar-error span, .profile-edit-save-error span { color: #824419; font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
.profile-edit-save-error .button { justify-self: start; min-height: 40px; margin-top: 3px; padding-inline: 13px; font-size: 10px; }
.profile-edit-saving { color: var(--moss-strong); background: rgba(229, 236, 229, .62); border: 1px solid rgba(111, 139, 116, .36); }
.profile-edit-saving strong, .profile-edit-confirmed strong, .profile-edit-leave h3 { color: var(--forest); font-size: 14px; line-height: 1.42; }
.profile-edit-saving span, .profile-edit-confirmed span, .profile-edit-leave > p:not(.eyebrow) { color: var(--ink-soft); font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
.profile-edit-confirmed { background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .4); }
.profile-edit-confirmed .button { justify-self: start; min-height: 40px; margin-top: 3px; padding-inline: 13px; font-size: 10px; }
.profile-edit-leave { position: fixed; z-index: 80; top: 50%; left: 50%; width: min(calc(100vw - 32px), 470px); max-height: calc(100svh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); overflow: auto; transform: translate(-50%, -50%); background: rgba(255, 253, 248, .96); border: 1px solid rgba(68, 88, 74, .3); box-shadow: 0 14px 30px rgba(55, 73, 59, .16), 0 0 0 100vmax rgba(35, 54, 39, .2); }
.profile-edit-leave .eyebrow { margin-bottom: 0; }
.profile-edit-leave > div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.profile-edit-leave .button { min-height: 42px; padding-inline: 13px; font-size: 10px; }
.profile-edit-field { min-width: 0; display: grid; gap: 5px; }
.profile-edit-field label { color: var(--forest); font-size: 11px; font-weight: 800; line-height: 1.45; }
.profile-edit-field label span { color: var(--ink-faint); font-weight: 650; }
.profile-edit-field input, .profile-edit-field textarea { width: 100%; min-width: 0; color: var(--ink); background: rgba(255, 255, 255, .76); border: 1px solid rgba(111, 139, 116, .42); border-radius: 12px; outline: none; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72); transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease; }
.profile-edit-field input { min-height: 50px; padding: 11px 14px; }
.profile-edit-field textarea { min-height: 108px; padding: 12px 14px; resize: vertical; line-height: 1.6; }
.profile-edit-field input:focus, .profile-edit-field textarea:focus { background: rgba(255, 255, 255, .94); border-color: var(--moss-strong); box-shadow: 0 0 0 4px rgba(111, 139, 116, .14); }
.profile-edit-field input[aria-invalid="true"] { color: #824419; background: rgba(255, 250, 246, .9); border-color: rgba(188, 111, 60, .78); box-shadow: 0 0 0 3px rgba(188, 111, 60, .1); }
.profile-edit-field-hint { color: var(--ink-faint); font-size: 10px; line-height: 1.5; }
.profile-edit-field-error { color: #824419; font-size: 10px; font-weight: 750; line-height: 1.5; }
.profile-edit-save-note { display: grid; gap: 4px; min-width: 0; padding: 13px 14px; border-radius: var(--radius-xs); }
.profile-edit-save-note strong { color: var(--forest); font-size: 12px; }
.profile-edit-save-note span { color: var(--ink-soft); font-size: 10px; line-height: 1.6; }
.profile-edit-actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-top: 2px; }
.profile-edit-actions .button { min-height: 48px; min-width: 158px; padding-inline: 20px; font-size: 12px; }
.profile-edit-actions .button--primary { margin-left: auto; }
.profile-edit-actions .button:disabled, .profile-edit-mobile-save-bar .button:disabled { color: rgba(248, 251, 247, .66); background: rgba(111, 139, 116, .42); box-shadow: none; cursor: not-allowed; transform: none; }
.profile-edit-rail { position: sticky; top: 96px; display: grid; gap: 10px; min-width: 0; padding: 15px; background: rgba(248, 252, 247, .44); border: 1px solid rgba(111, 139, 116, .29); border-radius: var(--radius-sm); }
.profile-edit-rail section { display: grid; gap: 4px; min-width: 0; padding: 11px; background: rgba(242, 248, 242, .72); border: 1px solid rgba(111, 139, 116, .27); border-radius: 10px; }
.profile-edit-rail .eyebrow { margin-bottom: 0; }
.profile-edit-rail h2 { color: var(--forest); font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.profile-edit-rail p:not(.eyebrow) { color: var(--ink-soft); font-size: 10px; line-height: 1.6; overflow-wrap: anywhere; }
.profile-edit-rail__warning { background: rgba(249, 239, 231, .67) !important; border-color: rgba(188, 111, 60, .29) !important; }
.profile-edit-rail__warning .eyebrow, .profile-edit-rail__warning p { color: #824419 !important; }
.profile-edit-f17 { margin-top: var(--space-7); padding: clamp(20px, 3vw, 30px); border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255, 255, 255, .42); }
.profile-edit-f17 > header { display: flex; align-items: end; justify-content: space-between; gap: var(--space-4); }
.profile-edit-f17 h2 { max-width: 790px; color: var(--forest); font-size: clamp(23px, 2.5vw, 30px); line-height: 1.32; }
.profile-edit-f17 > header > p { max-width: 292px; color: var(--ink-faint); font-size: 11px; line-height: 1.6; text-align: right; }
.profile-edit-f17-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: var(--space-5); }
.profile-edit-f17-grid article { min-width: 0; min-height: 210px; display: flex; flex-direction: column; align-items: stretch; padding: 13px; background: rgba(242, 248, 242, .74); border: 1px solid rgba(111, 139, 116, .36); border-radius: var(--radius-xs); }
.profile-edit-f17-grid article > span { min-height: 22px; align-self: flex-start; display: inline-flex; align-items: center; max-width: 100%; padding: 1px 7px; color: var(--moss-strong); background: rgba(229, 236, 229, .76); border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.profile-edit-f17-grid h3 { margin-top: var(--space-3); color: var(--forest); font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.profile-edit-f17-grid p { margin-top: 6px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.profile-edit-f17-grid .button { width: 100%; min-height: 44px; margin-top: auto; padding-inline: 7px; font-size: 11px; }
.profile-edit-f17__failure { background: rgba(249, 239, 231, .7) !important; border-color: rgba(188, 111, 60, .32) !important; }
.profile-edit-f17__failure > span { color: #824419 !important; background: rgba(255, 248, 241, .86) !important; }
.profile-edit-f17__failure h3 { color: #824419 !important; }
body[data-page="profile-edit"] [hidden] { display: none !important; }
body[data-page="profile-edit"][data-profile-edit-state="leave-confirm"] { overflow: hidden; }