.mini-body { background: #f5f6f7; color: #20282c; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; font-size: calc(28 * var(--rpx)); line-height: 1.6; }
view, text, input, button, image, scroll-view { box-sizing: border-box; }
button { padding: 0; margin: 0; font-size: inherit; font-weight: inherit; line-height: inherit; border-radius: 0; background: transparent; color: inherit; }
button::after { border: 0; }
button[disabled] { color: #858d91; background: #edf0f1; }
.page { padding: calc(36 * var(--rpx)) calc(28 * var(--rpx)) calc(52 * var(--rpx)); }
.page-title { font-size: calc(44 * var(--rpx)); line-height: 1.35; font-weight: 700; }
.muted { color: #687079; }
.icon { display: block; width: calc(44 * var(--rpx)); height: calc(44 * var(--rpx)); flex-shrink: 0; }
.search { display: flex; align-items: center; gap: calc(16 * var(--rpx)); height: calc(92 * var(--rpx)); padding: 0 calc(24 * var(--rpx)); background: #fff; border: calc(1 * var(--rpx)) solid #e6eaed; border-radius: calc(16 * var(--rpx)); }
.search .icon { width: calc(36 * var(--rpx)); height: calc(36 * var(--rpx)); }
.search input { min-width: 0; flex: 1; height: calc(76 * var(--rpx)); font-size: calc(27 * var(--rpx)); }
.input-placeholder { color: #687079; }
.clear-search { min-width: calc(64 * var(--rpx)); min-height: calc(76 * var(--rpx)); color: #556268; font-size: calc(24 * var(--rpx)); }
.section-heading { display: flex; justify-content: space-between; align-items: center; gap: calc(16 * var(--rpx)); margin: calc(40 * var(--rpx)) 0 calc(24 * var(--rpx)); }
.section-title { font-size: calc(38 * var(--rpx)); line-height: 1.35; font-weight: 700; }
.section-subtitle { margin-top: calc(8 * var(--rpx)); color: #687079; font-size: calc(24 * var(--rpx)); }
.text-button { min-height: calc(72 * var(--rpx)); display: flex; align-items: center; gap: calc(8 * var(--rpx)); color: #176b61; font-size: calc(25 * var(--rpx)); white-space: nowrap; }
.text-button .icon { width: calc(24 * var(--rpx)); height: calc(24 * var(--rpx)); }
.product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(28 * var(--rpx)) calc(20 * var(--rpx)); }
.primary-button { padding: calc(24 * var(--rpx)) calc(32 * var(--rpx)); border-radius: calc(14 * var(--rpx)); background: #176b61; color: #fff; font-size: calc(28 * var(--rpx)); font-weight: 600; text-align: center; }
.secondary-button { padding: calc(22 * var(--rpx)) calc(30 * var(--rpx)); border: calc(1 * var(--rpx)) solid #d8e1e0; border-radius: calc(14 * var(--rpx)); color: #176b61; text-align: center; background: #fff; }
.empty { padding: calc(80 * var(--rpx)) calc(28 * var(--rpx)); text-align: center; }
.empty .icon { width: calc(68 * var(--rpx)); height: calc(68 * var(--rpx)); margin: 0 auto calc(24 * var(--rpx)); }
.empty-title { font-size: calc(32 * var(--rpx)); font-weight: 600; }
.empty-copy { margin: calc(12 * var(--rpx)) 0 calc(32 * var(--rpx)); color: #687079; font-size: calc(26 * var(--rpx)); }
.empty .secondary-button { display: inline-block; }
.page-note { margin-top: calc(40 * var(--rpx)); color: #687079; font-size: calc(22 * var(--rpx)); text-align: center; }
.end-note { margin: calc(36 * var(--rpx)) 0 0; color: #687079; font-size: calc(22 * var(--rpx)); text-align: center; }
.surface { background: #fff; border-radius: calc(20 * var(--rpx)); }
.service-float { position: fixed; right: calc(24 * var(--rpx)); bottom: calc(40 * var(--rpx)); z-index: 5; display: flex; flex-direction: column; align-items: center; justify-content: center; width: calc(100 * var(--rpx)); height: calc(112 * var(--rpx)); border-radius: calc(50 * var(--rpx)); background: #fff; box-shadow: 0 calc(6 * var(--rpx)) calc(28 * var(--rpx)) rgba(32, 40, 44, .12); color: #176b61; font-size: calc(22 * var(--rpx)); }
.service-float .icon { width: calc(42 * var(--rpx)); height: calc(42 * var(--rpx)); }
.load-more { margin: calc(36 * var(--rpx)) auto; }
.unavailable-note { margin: calc(24 * var(--rpx)) 0; padding: calc(24 * var(--rpx)); background: #f5f6f7; color: #596963; font-size: calc(24 * var(--rpx)); line-height: 1.7; }
.unavailable-note button { margin-top: calc(16 * var(--rpx)); }

product-card { display: block; min-width: 0; }
.product-card { height: 100%; overflow: hidden; background: #fff; border-radius: calc(24 * var(--rpx)); }
.product-photo { display: block; width: 100%; height: calc(304 * var(--rpx)); background: #e7ecee; }
.product-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: calc(18 * var(--rpx)); color: #687079; font-size: calc(22 * var(--rpx)); }
.placeholder-icon { width: calc(80 * var(--rpx)); height: calc(80 * var(--rpx)); }
.product-body { padding: calc(24 * var(--rpx)) calc(24 * var(--rpx)) calc(26 * var(--rpx)); }
.product-name { font-size: calc(30 * var(--rpx)); line-height: 1.45; font-weight: 600; overflow-wrap: anywhere; }
.product-code { font-size: calc(21 * var(--rpx)); color: #687079; margin: calc(6 * var(--rpx)) 0 calc(18 * var(--rpx)); }
.product-spec { display: flex; gap: calc(16 * var(--rpx)); font-size: calc(25 * var(--rpx)); line-height: 1.6; color: #525d64; }
.product-spec text:first-child { flex-shrink: 0; }
.product-composition { margin-top: calc(10 * var(--rpx)); font-size: calc(22 * var(--rpx)); line-height: 1.6; color: #687079; overflow-wrap: anywhere; }
.product-footer { display: flex; align-items: center; justify-content: space-between; margin-top: calc(22 * var(--rpx)); padding-top: calc(18 * var(--rpx)); border-top: calc(1 * var(--rpx)) solid #edf0f2; }
.product-action { font-size: calc(26 * var(--rpx)); font-weight: 600; line-height: 1.6; color: #176b61; }
.card-arrow { width: calc(28 * var(--rpx)); height: calc(28 * var(--rpx)); }

.category-subtitle { margin: calc(12 * var(--rpx)) 0 calc(30 * var(--rpx)); }
.category-scroll { width: 100%; overflow-x: auto; margin-top: calc(24 * var(--rpx)); }
.category-primary { display: flex; border-bottom: calc(1 * var(--rpx)) solid #dce2e5; }
.category-tab { position: relative; flex: 1; min-width: 0; padding: calc(24 * var(--rpx)) calc(8 * var(--rpx)); font-size: calc(28 * var(--rpx)); color: #687079; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.category-many { display: inline-flex; min-width: 100%; }
.category-many .category-tab { flex: 0 0 auto; min-width: calc(180 * var(--rpx)); max-width: calc(320 * var(--rpx)); padding-left: calc(24 * var(--rpx)); padding-right: calc(24 * var(--rpx)); }
.category-context { flex: 1; min-width: 0; padding-right: calc(24 * var(--rpx)); overflow-wrap: anywhere; word-break: break-all; }
.category-total { flex-shrink: 0; white-space: nowrap; }
.category-tab.selected { color: #176b61; font-weight: 700; }
.category-tab.selected::before { content: ''; position: absolute; bottom: calc(-1 * var(--rpx)); left: 30%; width: 40%; height: calc(5 * var(--rpx)); border-radius: calc(4 * var(--rpx)); background: #176b61; }
.subcategory-row { display: flex; flex-wrap: wrap; gap: calc(16 * var(--rpx)); padding: calc(24 * var(--rpx)) 0 0; }
.subcategory { padding: calc(14 * var(--rpx)) calc(24 * var(--rpx)); font-size: calc(24 * var(--rpx)); color: #59636a; background: #fff; border-radius: calc(10 * var(--rpx)); }
.subcategory.selected { background: #e7f0ed; color: #14594f; }
.category-count { display: flex; justify-content: space-between; margin: calc(28 * var(--rpx)) 0 calc(22 * var(--rpx)); font-size: calc(24 * var(--rpx)); color: #687079; }

.detail-page { padding-bottom: calc(calc(180 * var(--rpx)) + env(safe-area-inset-bottom)); }
.detail-photo { display: block; width: 100%; height: calc(650 * var(--rpx)); background: #e7ecee; }
.detail-no-photo { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: calc(18 * var(--rpx)); height: calc(340 * var(--rpx)); background: #edf0f1; color: #687079; }
.detail-no-photo .icon { width: calc(84 * var(--rpx)); height: calc(84 * var(--rpx)); }
.detail-no-photo .muted { font-size: calc(24 * var(--rpx)); }
.detail-intro { padding: calc(34 * var(--rpx)) calc(32 * var(--rpx)) calc(32 * var(--rpx)); background: #fff; }
.detail-title { font-size: calc(42 * var(--rpx)); font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.detail-category { margin-top: calc(12 * var(--rpx)); font-size: calc(24 * var(--rpx)); color: #687079; }
.detail-section { background: #fff; margin-top: calc(20 * var(--rpx)); padding: calc(32 * var(--rpx)); }
.detail-section-title { font-size: calc(32 * var(--rpx)); font-weight: 700; margin-bottom: calc(12 * var(--rpx)); }
.parameter-row { display: flex; gap: calc(28 * var(--rpx)); padding: calc(24 * var(--rpx)) 0; border-bottom: calc(1 * var(--rpx)) solid #edf0f2; font-size: calc(28 * var(--rpx)); line-height: 1.7; }
.parameter-row:last-child { border-bottom: 0; }
.parameter-label { color: #687079; width: calc(130 * var(--rpx)); flex-shrink: 0; }
.parameter-value { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.parameter-value.emphasized { color: #d72f34; }
.detail-hint { margin: calc(24 * var(--rpx)) calc(32 * var(--rpx)); font-size: calc(23 * var(--rpx)); color: #687079; }
.detail-actions { display: flex; align-items: center; gap: calc(30 * var(--rpx)); position: fixed; bottom: 0; left: 0; right: 0; z-index: 10; padding: calc(20 * var(--rpx)) calc(28 * var(--rpx)) calc(calc(20 * var(--rpx)) + env(safe-area-inset-bottom)); background: #fff; border-top: calc(1 * var(--rpx)) solid #e6eaed; }
.detail-action-icon { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: calc(4 * var(--rpx)); min-width: calc(76 * var(--rpx)); min-height: calc(88 * var(--rpx)); font-size: calc(22 * var(--rpx)); color: #59676a; }
.detail-action-icon .icon { width: calc(40 * var(--rpx)); height: calc(40 * var(--rpx)); }
.detail-contact { flex: 1; padding: calc(25 * var(--rpx)) calc(12 * var(--rpx)); }
.detail-thumbnails { display: flex; gap: calc(16 * var(--rpx)); padding: calc(20 * var(--rpx)) calc(32 * var(--rpx)); flex-wrap: wrap; }
.detail-thumbnail { width: calc(112 * var(--rpx)); height: calc(112 * var(--rpx)); border-radius: calc(8 * var(--rpx)); }
.detail-description { white-space: pre-wrap; overflow-wrap: break-word; line-height: 1.8; font-size: calc(28 * var(--rpx)); }

.brand-cover { width: 100%; height: calc(470 * var(--rpx)); display: block; background: #e1e7e6; }
.brand-content { position: relative; margin-top: calc(-44 * var(--rpx)); padding: 0 calc(28 * var(--rpx)) calc(48 * var(--rpx)); }
.brand-card { padding: calc(32 * var(--rpx)); }
.brand-card-heading { display: flex; gap: calc(20 * var(--rpx)); align-items: center; }
.brand-logo { width: calc(88 * var(--rpx)); height: calc(88 * var(--rpx)); flex-shrink: 0; }
.brand-name { font-size: calc(38 * var(--rpx)); font-weight: 700; line-height: 1.4; }
.brand-subtitle { font-size: calc(24 * var(--rpx)); color: #687079; }
.brand-share { margin-left: auto; padding: calc(16 * var(--rpx)); }
.brand-share .icon { width: calc(38 * var(--rpx)); height: calc(38 * var(--rpx)); }
.brand-tags { display: flex; gap: calc(12 * var(--rpx)); flex-wrap: wrap; margin: calc(26 * var(--rpx)) 0; }
.brand-tag { color: #525d64; background: #f0f2f3; padding: calc(6 * var(--rpx)) calc(16 * var(--rpx)); border-radius: calc(6 * var(--rpx)); font-size: calc(23 * var(--rpx)); }
.brand-description { line-height: 1.9; color: #4d5b61; font-size: calc(27 * var(--rpx)); }
.brand-introduction { margin-top: calc(18 * var(--rpx)); }
.brand-contact-actions { display: flex; justify-content: space-between; padding-top: calc(28 * var(--rpx)); margin-top: calc(28 * var(--rpx)); border-top: calc(1 * var(--rpx)) solid #e6eaed; }
.brand-contact-actions button { flex: 1; display: flex; flex-direction: column; align-items: center; gap: calc(12 * var(--rpx)); padding: calc(10 * var(--rpx)) 0; font-size: calc(25 * var(--rpx)); }
.brand-contact-actions button + button { border-left: calc(1 * var(--rpx)) solid #e6eaed; }
.brand-contact-actions .icon { width: calc(44 * var(--rpx)); height: calc(44 * var(--rpx)); }
.brand-information { margin-top: calc(24 * var(--rpx)); padding: calc(30 * var(--rpx)) calc(32 * var(--rpx)); }
.brand-info-title { font-size: calc(29 * var(--rpx)); font-weight: 600; margin-bottom: calc(18 * var(--rpx)); }
.brand-info-row { display: flex; gap: calc(28 * var(--rpx)); color: #687079; font-size: calc(26 * var(--rpx)); padding: calc(12 * var(--rpx)) 0; }
.brand-info-row text:first-child { width: calc(65 * var(--rpx)); flex-shrink: 0; }
.brand-info-row text:last-child { overflow-wrap: anywhere; }
.brand-browse { width: 100%; margin-top: calc(30 * var(--rpx)); }

.brand-without-cover .brand-content { margin-top: 0; padding-top: calc(28 * var(--rpx)); }

.mine-heading { display: flex; gap: calc(24 * var(--rpx)); align-items: center; margin: calc(12 * var(--rpx)) 0 calc(42 * var(--rpx)); }
.mine-avatar { width: calc(104 * var(--rpx)); height: calc(104 * var(--rpx)); display: flex; align-items: center; justify-content: center; background: #fff; border-radius: calc(52 * var(--rpx)); }
.mine-avatar .icon { width: calc(58 * var(--rpx)); height: calc(58 * var(--rpx)); }
.mine-tabs { display: flex; gap: calc(28 * var(--rpx)); margin-bottom: calc(32 * var(--rpx)); border-bottom: calc(1 * var(--rpx)) solid #dce2e5; }
.mine-tab { position: relative; padding: calc(22 * var(--rpx)) calc(4 * var(--rpx)); color: #687079; font-size: calc(28 * var(--rpx)); }
.mine-tab text { font-size: calc(24 * var(--rpx)); padding-left: calc(8 * var(--rpx)); }
.mine-tab.selected { color: #176b61; font-weight: 600; }
.mine-tab.selected::before { position: absolute; content: ''; height: calc(5 * var(--rpx)); left: calc(4 * var(--rpx)); right: calc(4 * var(--rpx)); bottom: calc(-1 * var(--rpx)); background: #176b61; border-radius: calc(4 * var(--rpx)); }
.mine-empty { background: #fff; border-radius: calc(20 * var(--rpx)); }
.mine-empty .primary-button { display: inline-block; margin-top: calc(8 * var(--rpx)); padding-left: calc(56 * var(--rpx)); padding-right: calc(56 * var(--rpx)); }