.site-nav { display: flex; align-items: center; gap: 24px; font-size: 12px; }
.site-nav a { min-height: 44px; display: inline-flex; align-items: center; white-space: nowrap; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--green); }
.site-nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 8px; }
.topbar .hello { margin-left: 18px; }
.wallpaper { grid-template-rows: 72px minmax(0,1fr) 44px; min-height: 760px; }
.scene-more { display: flex; justify-content: center; align-items: center; font-size: 11px; color: var(--muted); }
.scene-more a { padding: 12px; }
.scene-more span { margin-left: 12px; color: var(--green); }
.home-collection, .catalog-main, .detail-main, .about-main { width: min(1100px, calc(100% - 80px)); margin-inline: auto; }
.home-collection { padding: 72px 0 24px; border-top: 1px solid #e7eae5; scroll-margin-top: 24px; }
.project-update { margin: 0 0 32px; padding: 18px 20px; border-left: 3px solid var(--green); background: #f7f9f5; overflow-wrap: anywhere; }
.project-update:empty { display: none; }
.project-update .catalog-eyebrow { display: inline-block; margin: 0 12px 0 0; }
.project-update strong { font-size: 14px; font-weight: 500; }
.project-update p { font-size: 12px; line-height: 1.8; margin: 8px 0 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.catalog-eyebrow { font: 10px/1.6 Consolas, monospace; color: var(--green); margin: 0 0 16px; }
.section-heading h2, .home-tools h2 { font-size: 24px; font-weight: 500; margin: 0; }
.text-link { font-size: 12px; min-height: 44px; display: inline-flex; align-items: center; gap: 20px; flex-shrink: 0; }
.text-link:hover, .entry h2 a:hover { color: var(--green); }
.entry-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px 28px; }
.entry { min-width: 0; }
.entry-cover { display: block; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 4px; background: #f6f7f3; }
.entry-cover img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.entry-cover:hover img { transform: scale(1.035); }
.entry-cover.tool-cover img { object-fit: contain; padding: 28px; }
.entry-meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 20px; font-size: 10px; color: #747e73; }
.entry-status { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.entry-status::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--green); }
.entry-status.is-growing::before { background: var(--coral); }
.entry h2 { font-size: 18px; line-height: 1.5; font-weight: 500; margin: 10px 0; overflow-wrap: anywhere; }
.entry h2 a { display: flex; justify-content: space-between; align-items: start; gap: 16px; }
.entry h2 span { color: var(--green); font-size: 16px; }
.entry > p { color: #697167; font-size: 13px; line-height: 1.9; margin: 0; }
.entry > .entry-note { margin-top: 16px; font-size: 11px; color: #747e73; }
.entry-tags { display: flex; flex-wrap: wrap; list-style: none; padding: 0; margin: 16px 0 0; gap: 8px 14px; font-size: 10px; color: #76816e; }
.entry-detail-link { font-size: 11px; margin-top: 20px; display: inline-block; color: var(--green); padding-block: 10px; }
.home-tools { margin-top: 64px; padding: 36px 0; border-top: 1px solid #e7eae5; display: grid; grid-template-columns: 200px 1fr auto; gap: 32px; align-items: center; }
.compact-tool { display: flex; align-items: center; gap: 18px; }
.compact-tool img { width: 80px; height: 64px; object-fit: contain; }
.compact-tool strong { font-size: 14px; font-weight: 500; }
.compact-tool small { font-size: 12px; line-height: 1.8; display: block; margin-top: 6px; color: #697167; }
.compact-tool > span:last-child { margin-left: auto; color: var(--green); }
.site-footer { min-height: 90px; border-top: 1px solid #e7eae5; margin-top: 36px; }
.inner-page { min-height: 100svh; display: flex; flex-direction: column; }
.inner-page .topbar { min-height: 80px; }
.inner-page .site-footer { margin-top: auto; }
.catalog-main { padding: 64px 0 96px; flex: 1; }
.catalog-heading { display: grid; grid-template-columns: 1fr 160px; align-items: center; margin-bottom: 44px; gap: 24px; }
.catalog-heading h1, .detail-heading h1, .about-heading h1 { font-family: Arial, "PingFang SC", "Microsoft YaHei", sans-serif; font-size: 44px; line-height: 1.2; font-weight: 600; margin: 0; overflow-wrap: anywhere; }
.catalog-intro { font-size: 14px; line-height: 1.9; color: #697167; max-width: 540px; margin: 18px 0 0; }
.catalog-heading > img { width: 160px; height: 120px; object-fit: contain; transform: rotate(-6deg); }
.catalog-toolbar { display: flex; align-items: end; gap: 16px; padding: 24px 0; margin-bottom: 12px; border-top: 1px solid #e7eae5; }
.catalog-toolbar label { display: grid; gap: 8px; font-size: 11px; color: #697167; }
.search-field { flex: 1; max-width: 420px; }
.catalog-toolbar input, .catalog-toolbar select { font: inherit; font-size: 13px; color: var(--ink); height: 44px; border: 1px solid #d8ded5; background: #fff; border-radius: 4px; padding: 0 14px; width: 100%; }
.catalog-toolbar input:focus-visible, .catalog-toolbar select:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.category-field { width: 170px; }
.catalog-count { font-size: 11px; color: #697167; margin-left: auto; margin-bottom: 15px; white-space: nowrap; }
.empty-state, .load-state, .error-state { grid-column: 1 / -1; text-align: center; padding: 56px 20px; font-size: 14px; color: #697167; line-height: 1.9; }
.empty-state h2 { color: var(--ink); font-size: 22px; }
.empty-state button, .more-button { min-height: 44px; padding: 10px 24px; background: #fff; border: 1px solid #d8ded5; border-radius: 4px; color: var(--green); }
.more-button { display: block; margin: 44px auto 0; }
[hidden] { display: none !important; }
.catalog-fallback { color: #697167; font-size: 14px; line-height: 2; padding-block: 24px; }
.detail-main { padding: 36px 0 80px; }
.back-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 12px; color: #697167; }
.detail-heading { padding: 40px 0; max-width: 780px; }
.detail-summary { font-size: 16px; line-height: 1.9; color: #697167; margin: 20px 0 0; }
.detail-image { width: 100%; height: auto; max-height: 460px; object-fit: cover; display: block; background: #f6f7f3; border-radius: 4px; }
.detail-body { display: grid; grid-template-columns: minmax(0,1fr) 270px; gap: 80px; padding: 48px 0 56px; }
.detail-body h2 { font-size: 22px; font-weight: 500; margin: 0 0 24px; }
.detail-body p { font-size: 14px; color: #697167; line-height: 2; }
.detail-body dl { margin: 0; }
.detail-body dl > div { display: flex; justify-content: space-between; gap: 20px; padding: 15px 0; border-bottom: 1px solid #e7eae5; font-size: 12px; line-height: 1.6; }
.detail-body dt { color: #697167; flex-shrink: 0; }
.detail-body dd { margin: 0; text-align: right; }
.detail-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 30px; }
.action-link { display: inline-flex; min-height: 44px; align-items: center; gap: 36px; border-bottom: 1px solid var(--green); font-size: 13px; color: var(--green); }
.availability-note { font-size: 12px; color: #697167; padding: 14px 0; }
.related-projects { border-top: 1px solid #e7eae5; padding-top: 40px; }
.related-projects .entry-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.related-projects h2 { font-size: 22px; font-weight: 500; }
.related-projects .entry h2 { font-size: 18px; }
.about-main { padding: 64px 0 96px; flex: 1; }
.about-layout { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 80px; align-items: center; }
.about-portrait { width: 100%; height: auto; }
.about-copy { font-size: 15px; line-height: 2; color: #697167; margin-top: 30px; max-width: 560px; }
.about-links { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 32px; }
@media (max-width:800px) {
  .topbar-caption { display: none; }
  .topbar .signature { margin-right: auto; }
  .site-nav { gap: 20px; }
  .entry-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .home-tools { grid-template-columns: 1fr auto; }
  .home-tools > div:first-child { grid-column: 1 / -1; }
  .detail-body { grid-template-columns: minmax(0,1fr) 230px; gap: 36px; }
  .about-layout { grid-template-columns: minmax(0,1fr) 220px; gap: 30px; }
}
@media (max-width:600px) {
  .wallpaper { grid-template-rows: 64px minmax(0,1fr) 44px; min-height: 800px; }
  .topbar .hello { display: none; }
  .site-nav { gap: 20px; font-size: 11px; }
  .home-collection, .catalog-main, .detail-main, .about-main { width: calc(100% - 40px); }
  .home-collection { padding-top: 40px; }
  .section-heading { gap: 12px; margin-bottom: 24px; }
  .section-heading h2, .home-tools h2 { font-size: 22px; }
  .catalog-eyebrow { font-size: 9px; margin-bottom: 12px; }
  .entry-grid, .related-projects .entry-grid { grid-template-columns: minmax(0,1fr); gap: 36px; }
  .entry-meta { margin-top: 16px; }
  .home-tools { margin-top: 40px; grid-template-columns: minmax(0,1fr); gap: 24px; }
  .compact-tool img { width: 64px; }
  .site-footer { min-height: 100px; }
  .inner-page .topbar { min-height: 64px; }
  .catalog-main, .about-main { padding-top: 40px; padding-bottom: 56px; }
  .catalog-heading { grid-template-columns: minmax(0,1fr) 86px; margin-bottom: 28px; gap: 12px; }
  .catalog-heading > img { width: 86px; height: 90px; }
  .catalog-heading h1, .detail-heading h1, .about-heading h1 { font-size: 32px; }
  .catalog-intro { font-size: 13px; }
  .catalog-toolbar { flex-wrap: wrap; gap: 12px; padding-block: 20px; }
  .search-field { flex-basis: 100%; max-width: none; }
  .category-field { width: 160px; }
  .detail-main { padding-top: 20px; }
  .detail-heading { padding: 28px 0; }
  .detail-summary { font-size: 14px; }
  .detail-image { aspect-ratio: 3 / 2; object-fit: cover; }
  .detail-body { grid-template-columns: minmax(0,1fr); gap: 28px; padding-block: 32px; }
  .about-layout { display: flex; flex-direction: column-reverse; align-items: start; gap: 24px; }
  .about-portrait { width: 180px; align-self: center; }
  .about-copy { font-size: 14px; }
}
