:root {
  --orange: #ff5b21;
  --orange-text: #ff5b1a;
  --orange-dark: #f44b15;
  --orange-soft: #fff0e8;
  --orange-gradient: linear-gradient(135deg, #ff6804 0%, #ff832f 100%);
  --ink: #2f3033;
  --text: #50545a;
  --muted: #8494aa;
  --line: #dfe6ef;
  --cover: #f5f5f5;
  --shell: 1416px;
}

/* Imported from the ClaritView prototype and adapted for the site shell. */
.macro-data-page, .macro-data-page * { box-sizing: border-box; }

html { scroll-behavior: smooth; }

.macro-data-page {
  margin: 0;
  color: var(--ink);
  background: #fff url("/uploads/2026/macro-data/hero-background.png") center top / 100% auto no-repeat;
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.macro-data-page button, .macro-data-page input, .macro-data-page select { font: inherit; }
.macro-data-page button, .macro-data-page a { -webkit-tap-highlight-color: transparent; }
.macro-data-page a { color: inherit; text-decoration: none; }
.macro-data-page button { color: inherit; }
.shell { width: min(var(--shell), calc(100% - 48px)); margin-inline: auto; }
.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; }

.hero {
  height: 338px;
  position: relative;
  overflow: hidden;
  background: transparent;
}
.hero-inner { position: relative; padding-top: 49px; }
.eyebrow { display: inline-flex; align-items: center; height: 29px; padding: 0 14px; border-radius: 15px; color: var(--orange-text); background: #fff0e8; font-size: 14px; }
.eyebrow span { margin-right: 6px; font-size: 9px; }
.hero h1 { margin: 14px 0 10px; font-size: 30px; line-height: 1.35; letter-spacing: -.4px; }
.hero h1 span { color: var(--orange-text); font-size: 34px; font-weight: 500; }
.hero-copy { margin: 0; color: #515258; font-size: 18px; line-height: 1.55; white-space: nowrap; }
.stats { display: flex; gap: 63px; margin-top: 25px; }
.stat { display: flex; flex-direction: column; min-width: 80px; }
.stat strong { display: flex; align-items: flex-end; height: 39px; font-family: Arial, sans-serif; font-size: 38px; line-height: 1; font-weight: 500; letter-spacing: -1.3px; }
.stat strong em { color: var(--orange-text); font-family: inherit; font-size: 19px; line-height: 1; font-style: normal; font-weight: 700; letter-spacing: 0; }
.stat strong sup { color: var(--orange-text); font-family: "Microsoft YaHei", sans-serif; font-size: 15px; line-height: 1; margin-left: 2px; font-weight: 700; letter-spacing: 0; }
.stat span { margin-top: 3px; font-size: 14px; color: #4f5155; }

.catalog { position: relative; min-height: 1051px; padding-top: 69px; padding-bottom: 59px; background: #fff; }
.search-panel {
  position: absolute;
  z-index: 5;
  top: -28px;
  left: 50%;
  transform: translateX(-50%);
  width: min(1120px, calc(100% - 48px));
  height: 56px;
  padding: 7px 11px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.2fr);
  align-items: center;
  background: rgba(255,255,255,.97);
  border-radius: 17px;
  box-shadow: 0 17px 30px rgba(34, 47, 62, .11);
}
.search-section { min-width: 0; height: 42px; padding: 0 16px; display: flex; align-items: center; }
.search-section + .search-section { position: relative; }
.search-section + .search-section::before { content: ""; position: absolute; left: 0; top: 50%; width: 1px; height: 32px; background: #e3e8ef; transform: translateY(-50%); }
.keyword-section { padding-left: 8px; }
.filter-section { justify-content: center; padding: 0 12px; }
.hs-section { gap: 7px; padding-inline: 16px; }
.keyword-field { display: flex; align-items: center; flex: 1 1 auto; min-width: 0; height: 42px; }
.keyword-field > img { position: relative; top: 2px; flex: 0 0 20px; width: 20px; height: 20px; object-fit: contain; margin-right: 11px; }
.keyword-field input, .hs-input input, .product-input input { border: 0; outline: none; width: 100%; background: transparent; color: #465264; }
.keyword-field input { font-size: 16px; }
.keyword-field input::-webkit-search-cancel-button { display: none; -webkit-appearance: none; appearance: none; }
.keyword-field input::-ms-clear { display: none; width: 0; height: 0; }
.macro-data-page input::placeholder { color: #8494aa; opacity: 1; }
.select-field { position: relative; width: 97px; height: 38px; }
.filter-section > .select-field:first-child { left: 0; }
.select-native { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.select-trigger { width: 100%; height: 100%; padding: 0 26px 0 16px; display: flex; align-items: center; border: 0; outline: 0; background: transparent; color: #303238; text-align: left; cursor: pointer; }
.select-trigger:focus-visible { border-radius: 8px; outline: 2px solid rgba(255, 104, 4, .3); outline-offset: -2px; }
.select-field::after { content: ""; position: absolute; width: 22px; height: 22px; right: 1px; top: 8px; background: url("data:image/png;base64,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") center / contain no-repeat; pointer-events: none; }
.select-field.is-open::after { background-image: url("data:image/png;base64,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"); }
.select-field.is-open::after { transform: translateY(-5.5px); }
.select-field.is-open .select-trigger { color: var(--orange-text); }
.select-menu { position: absolute; z-index: 40; top: calc(100% + 21px); left: 0; min-width: 120px; padding: 6px; border: 1px solid #edf0f4; border-radius: 11px; background: rgba(255, 255, 255, .98); box-shadow: 0 14px 34px rgba(35, 48, 63, .14); opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .16s ease, transform .16s ease; }
.select-field.is-open .select-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.select-option { width: 100%; height: 34px; padding: 0 12px; display: flex; align-items: center; border: 0; border-radius: 7px; background: transparent; color: #52657d; text-align: left; cursor: pointer; transition: .14s ease; }
.select-option:hover, .select-option:focus-visible { outline: 0; color: var(--orange-text); background: #fff5ef; }
.select-option.active { color: var(--orange-text); background: #fff0e8; font-weight: 600; }
.macro-data-page .primary-btn { flex: 0 0 auto; border: 0; border-radius: 10px; background: var(--orange-gradient); color: #fff; cursor: pointer; transition: .18s ease; box-shadow: 0 5px 11px rgba(255,91,33,.2); }
.primary-btn:hover { background: var(--orange-gradient); filter: brightness(.96); transform: translateY(-1px); }
.primary-btn:active { transform: translateY(0); }
.search-btn { width: 72px; height: 40px; }
.hs-mark { display: flex; align-items: center; gap: 7px; color: var(--orange-text); font-size: 16px; white-space: nowrap; }
.hs-mark img { width: 1em; height: 1em; object-fit: contain; }
.hs-input, .product-input { flex: 1 1 70px; min-width: 0; height: 40px; overflow: hidden; border: 1px solid #d9e1eb; border-radius: 10px; background: #fff; }
.hs-input input, .product-input input { height: 100%; padding: 0 14px; }
.hs-input input:focus, .product-input input:focus { background: #fff; }
.hs-input input:-webkit-autofill,
.hs-input input:-webkit-autofill:hover,
.hs-input input:-webkit-autofill:focus,
.product-input input:-webkit-autofill,
.product-input input:-webkit-autofill:hover,
.product-input input:-webkit-autofill:focus { -webkit-text-fill-color: #465264 !important; -webkit-box-shadow: 0 0 0 1000px #fff inset !important; caret-color: #465264; }
.product-input { margin-left: 9px; }
.hs-btn { width: 88px; height: 40px; }
.match-count { color: #8494aa; font-size: 14px; white-space: nowrap; }
.match-count em, .result-total em { color: var(--orange-text); font-style: normal; margin-left: 2px; }
.encode-report-link { color: var(--orange-text); font-size: 14px; white-space: nowrap; margin-left: 12px; }
.encode-report-link:hover { color: #ff6804; text-decoration: underline; }

.hs-preview { position: absolute; z-index: 50; top: calc(100% + 6px); left: 0; right: 0; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 20px 50px rgba(15, 23, 42, .14); }
.hs-preview[hidden] { display: none; }
.hs-preview .hsp-hd { padding: 10px 16px 8px; display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 13px; border-bottom: 1px solid #f1f5f9; }
.hs-preview .hsp-hd strong { color: var(--orange-text); font-weight: 600; }
.hs-preview .hsp-close { width: 22px; height: 22px; padding: 0; display: flex; align-items: center; justify-content: center; border: 0; border-radius: 50%; color: var(--muted); background: transparent; cursor: pointer; font-size: 18px; line-height: 1; transition: all .15s ease; }
.hs-preview .hsp-close:hover { background: #f1f5f9; color: var(--ink); }
.hs-preview .hsp-list { padding: 4px 0; max-height: 320px; overflow-y: auto; }
.hs-preview .hsp-item { display: flex; align-items: center; gap: 10px; padding: 10px 16px; cursor: pointer; border-bottom: 1px solid #f8fafc; transition: background .15s ease; text-decoration: none; color: inherit; }
.hs-preview .hsp-item:last-child { border-bottom: 0; }
.hs-preview .hsp-item:hover { background: var(--orange-soft); }
.hs-preview .hsp-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--orange); flex-shrink: 0; }
.hs-preview .hsp-info { flex: 1; min-width: 0; }
.hs-preview .hsp-title { display: block; color: var(--ink); font-size: 14px; font-weight: 600; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hs-preview .hsp-meta { display: flex; align-items: center; gap: 8px; margin-top: 2px; color: var(--muted); font-size: 12px; }
.hs-preview .hsp-tag { padding: 1px 6px; border-radius: 3px; color: var(--orange-text); background: var(--orange-soft); font-weight: 600; }
.hs-preview .hsp-arr { color: var(--muted); flex-shrink: 0; }
.hs-preview .hsp-arr svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.sort-row { height: 101px; display: flex; align-items: center; justify-content: center; gap: 14px; }
.sort-label { color: #8b9bb0; font-size: 14px; margin-right: 4px; }
.sort-pill, .clear-btn { display: inline-flex; align-items: center; justify-content: center; height: 41px; padding: 0 20px; border: 1px solid #d7e0ea; border-radius: 21px; color: #617690; background: #fff; cursor: pointer; transition: .18s ease; text-decoration: none; }
.sort-pill:hover { border-color: #ff9d78; color: var(--orange-text); }
.sort-pill.active { border-color: #ff6804; color: #fff; background: var(--orange-gradient); box-shadow: 0 5px 11px rgba(255,91,33,.18); }
.clear-btn { border-color: transparent; color: #b3b6bc; background: #f6f6f6; }
.clear-btn:hover { color: #7f8791; }
.result-total { color: #8494aa; font-size: 14px; }

.report-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 25px 18px; }
.report-card { height: 365px; overflow: hidden; border: 1px solid var(--line); border-radius: 19px; background: #fff; cursor: pointer; transition: .2s ease; }
.report-card:hover { box-shadow: 0 7px 18px rgba(43, 57, 71, .08); }
.report-card.featured { border-color: var(--orange); box-shadow: 0 7px 18px rgba(43, 57, 71, .04); }
.report-cover { position: relative; height: 175px; overflow: hidden; background: var(--cover); }
.report-image { width: 100%; height: 100%; display: block; object-fit: cover; }
.hot-badge { position: absolute; top: 14px; right: 14px; min-width: 47px; height: 24px; padding: 0 10px; display: grid; place-items: center; border-radius: 5px; color: #fff; background: #ff3e3e; font-size: 12px; font-weight: 700; }
.report-body { height: 190px; padding: 20px 19px 14px; }
.report-tags { display: flex; gap: 8px; height: 24px; }
.report-tags span { padding: 4px 9px 3px; border-radius: 4px; color: #5a6068; background: #f0f3f7; font-size: 12px; }
.report-tags span:first-child { color: var(--orange-text); background: #fff0bd; }
.report-card h2 { margin: 4px 0 6px; font-size: 18px; line-height: 1.5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-card p { height: 46px; margin: 0; color: #74869d; font-size: 14px; line-height: 1.65; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.report-meta { display: flex; justify-content: space-between; align-items: center; height: 34px; margin-top: 11px; padding-top: 12px; border-top: 1px solid #e6ebf1; font-size: 13px; }
.report-meta time { color: #8d9cb0; }
.report-meta time, .report-meta a { display: inline-flex; align-items: center; }
.report-meta time img { width: 16px; height: 17px; margin-right: 6px; object-fit: contain; }
.report-meta a { gap: 5px; color: var(--orange-text); }
.report-meta a img { width: 15px; height: 6px; object-fit: contain; }

.pagination { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 29px; }
.page-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 39px; padding: 0 13px; border: 1px solid #dfe6ee; border-radius: 6px; color: #697d97; background: #fff; cursor: pointer; line-height: 1; }
.page-btn span { display: inline-flex; align-items: center; justify-content: center; font-size: 18px; line-height: 1; }
.page-btn.page { width: 39px; padding: 0; }
.page-btn.active { border-color: #ff6804; color: #fff; background: var(--orange-gradient); }
.page-btn:disabled { color: #cad6e4; cursor: default; }
.page-btn.disabled { color: #cad6e4; cursor: default; }
.page-btn:not(:disabled):not(.active):not(.disabled):hover { border-color: #ff9d78; color: var(--orange-text); }

.toast { position: fixed; z-index: 100; left: 50%; bottom: 28px; transform: translate(-50%, 20px); padding: 11px 20px; border-radius: 8px; color: #fff; background: rgba(34,34,34,.9); box-shadow: 0 8px 28px rgba(0,0,0,.18); opacity: 0; visibility: hidden; transition: .24s ease; font-size: 14px; }
.toast.show { opacity: 1; visibility: visible; transform: translate(-50%, 0); }

.no-result-notice { position: absolute; z-index: 6; top: 40px; right: 24px; width: min(720px, calc(100% - 48px)); margin: 0; overflow: hidden; border: 0; border-radius: 14px; background: #fff; box-shadow: 0 10px 30px rgba(70, 86, 106, .08); }
.no-result-notice[hidden] { display: none; }
.no-result-header { height: 40px; padding: 0 15px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #edf1f5; }
.no-result-header h2 { margin: 0; color: #8ca0b8; font-size: 14px; line-height: 1; font-weight: 400; }
.macro-data-page .no-result-close { width: 28px; height: 28px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 50%; outline: 0; color: #9bafc4; background: transparent; cursor: pointer; }
.no-result-close span { position: relative; top: -1px; font-size: 21px; line-height: 1; font-weight: 300; }
.no-result-close:hover, .no-result-close:focus-visible { color: #ff6b24; background: #fff3ed; }
.no-result-body { min-height: 82px; padding: 15px 20px 17px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.no-result-body p { margin: 0; color: #8ca0b8; font-size: 14px; line-height: 1.5; }
.no-result-body p:first-child { font-size: 15px; }
.no-result-body strong { font-weight: 600; }

@media (max-width: 1220px) {
  .search-panel { width: calc(100% - 64px); grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.2fr); }
  .match-count { display: none; }
}

@media (max-width: 1050px) {
  .report-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .macro-data-page { background-size: auto 432px; }
  .hero { height: auto; min-height: 364px; }
  .hero-inner { padding-top: 38px; padding-bottom: 50px; }
  .hero h1 { font-size: 27px; }
  .hero h1 span { font-size: 30px; }
  .hero-copy { font-size: 16px; white-space: normal; }
  .stats { gap: 28px; flex-wrap: wrap; }
  .stat strong { font-size: 32px; }
  .catalog { padding-top: 188px; }
  .search-panel { top: -36px; width: calc(100% - 48px); height: auto; padding: 14px; display: flex; flex-direction: column; gap: 9px; border-radius: 14px; }
  .search-section { flex: 0 0 42px; width: 100%; padding: 0; }
  .search-section + .search-section::before { display: none; }
  .keyword-field { border: 1px solid #d9e1eb; border-radius: 9px; padding-left: 10px; }
  .filter-section { justify-content: stretch; gap: 9px; }
  .filter-section .search-btn { width: 100%; height: 42px; }
  .filter-section > .select-field:first-child { left: 0; }
  .select-field { width: calc((100% - 90px) / 2); border: 1px solid #d9e1eb; border-radius: 9px; }
  .select-menu { top: calc(100% + 8px); }
  .hs-section { gap: 9px; }
  .hs-input, .product-input { flex: 1 1 130px; }
  .product-input { margin-left: 0; }
  .report-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 18px; }
}

@media (max-width: 620px) {
  .shell { width: min(100% - 28px, var(--shell)); }
  .hero { min-height: 0; }
  .hero-inner { padding-top: 30px; padding-bottom: 38px; }
  .hero h1 { font-size: 22px; }
  .hero h1 span { font-size: 25px; }
  .hero-copy { font-size: 15px; }
  .stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 34px; }
  .search-panel { top: -28px; width: calc(100% - 28px); padding: 12px; gap: 10px; }
  .keyword-field { padding-left: 10px; }
  .filter-section { display: grid; grid-template-columns: 1fr; gap: 8px; height: auto; flex-basis: auto; }
  .select-field { width: 100%; height: 40px; }
  .search-btn { grid-column: 1 / -1; width: 100%; height: 42px; }
  .hs-section { display: grid; grid-template-columns: 44px minmax(0, 1fr) minmax(0, 1fr); gap: 8px; height: auto; flex-basis: auto; }
  .hs-mark { justify-content: flex-start; gap: 5px; font-size: 14px; }
  .hs-input, .product-input { width: 100%; height: 40px; }
  .hs-input input, .product-input input { padding-inline: 11px; }
  .product-input { margin-left: 0; }
  .hs-btn { grid-column: 1 / -1; width: 100%; height: 42px; }
  .catalog { padding-top: 272px; }
  .sort-row { height: auto; padding: 30px 0 24px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; overflow: visible; }
  .sort-label, .result-total { display: none; }
  .sort-pill, .clear-btn { width: 100%; padding-inline: 10px; white-space: nowrap; }
  .report-grid { grid-template-columns: 1fr; gap: 18px; }
  .report-card { height: 352px; }
  .report-cover { height: 165px; }
  .report-body { height: 187px; padding-inline: 16px; }
  .pagination { gap: 6px; margin-top: 24px; }
  .toast { max-width: calc(100% - 28px); text-align: center; }
  .no-result-notice { width: calc(100% - 28px); border-radius: 12px; }
  .no-result-header { padding-inline: 12px; }
  .no-result-body { min-height: 78px; padding: 14px 12px 16px; }
  .no-result-body p, .no-result-body p:first-child { font-size: 14px; }
}