/* DEBO global typography system — shared by every route */
:root {
  --font-sans: "Aptos", "Segoe UI", "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", sans-serif;
  --font-display: Georgia, "Times New Roman", "Noto Serif CJK SC", "Source Han Serif SC", "Songti SC", STSong, SimSun, serif;
  --type-2xs: 11px;
  --type-xs: 12px;
  --type-sm: 13px;
  --type-body: 15px;
  --type-lead: 17px;
  --leading-tight: 1.12;
  --leading-copy: 1.68;
  --tracking-label: .12em;
  --tracking-ui: .025em;
}

html { font-size: 16px; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body, button, input, select, textarea { font-family: var(--font-sans) !important; font-kerning: normal; font-feature-settings: "kern" 1, "liga" 1; }
body { font-size: var(--type-body); line-height: var(--leading-copy); letter-spacing: .006em; }
html[lang="zh-CN"] body { line-height: 1.74; letter-spacing: .012em; }
p, li, dd, blockquote { text-wrap: pretty; }
h1, h2, h3, h4, .page-title { margin-block-start: 0; font-family: var(--font-display) !important; font-weight: 400; line-height: var(--leading-tight); text-wrap: balance; }
html[lang="en"] :is(h1, h2, h3, h4, .page-title) {
  letter-spacing: 0 !important;
  font-variant-ligatures: none;
  font-feature-settings: "kern" 1, "liga" 0, "clig" 0;
}
html[lang="zh-CN"] :is(h1, h2, h3, h4, .page-title) { letter-spacing: .018em !important; }
a, button, input, select, textarea { font-size: inherit; }
button, input, select, textarea { line-height: 1.35; letter-spacing: var(--tracking-ui); }
input::placeholder, textarea::placeholder { color: #817b72; opacity: 1; }
small { font-size: var(--type-xs); line-height: 1.45; }

/* Navigation and recurring utility text */
.unified-links { font-size: 14px !important; line-height: 1.25; letter-spacing: .04em !important; }
.language-toggle { font-size: 11.5px !important; letter-spacing: .065em !important; }
.footer, .home-footer { font-size: 11.5px !important; line-height: 1.55; letter-spacing: .055em; }
.scroll-cue small { font-size: 11.5px !important; }
.eyebrow, .portal-eyebrow,
.section-heading > div > p, .detail-section-head > div > p,
.trend-reading > header > p, .trend-board > header p, .trend-related > header p,
.pairing-logic > header > p, .pairing-atmosphere > header > p,
.pairing-materials > header p, .related-pairings > header p,
.curated-index-hero p:first-child, .discover-list-head > div > p,
.trend-detail-kicker, .pairing-kicker {
  font-family: var(--font-sans) !important;
  font-size: 11.5px !important;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: var(--tracking-label) !important;
}

/* Home */
.search-portal h1 { font-size: clamp(50px, 6.2vw, 88px) !important; line-height: .98; letter-spacing: -.006em !important; }
.portal-subtitle { font-size: 15.5px !important; line-height: 1.7; letter-spacing: .015em !important; }
.portal-search input { font-size: 15px !important; letter-spacing: .012em; }
.portal-tags button { font-size: 12.5px !important; letter-spacing: .025em; }

/* Library and favorites */
.page-title, .favorites-title h1, .resources-title-group h1 { font-size: clamp(50px, 5.2vw, 74px) !important; line-height: 1.03; }
.library-search input, .compact-search input, .favorites-search input { font-size: 15px !important; }
.filter-bar, .advanced-filters, .results-sort, .compact-library-toolbar,
.compact-filter-panel, .favorites-toolbar, .resource-filters { font-size: 12.5px !important; line-height: 1.45; }
.result-head, .resources-result, .favorite-result-count { font-size: 12px !important; line-height: 1.5; letter-spacing: .035em; }
.caption { font-size: 12.5px !important; line-height: 1.5 !important; }
.caption b { font-size: 12px !important; letter-spacing: .07em !important; }
.caption span { font-size: 12.5px !important; letter-spacing: .01em; }
.compact-filter-button b, .compact-result-count { font-size: 11.5px !important; }
.favorites-subtitle, .resources-lead { font-size: var(--type-lead) !important; line-height: 1.75; }
.favorites-empty h2, .resources-note h2, .favorites-dialog h2 { font-size: clamp(25px, 2.3vw, 34px) !important; }
.favorites-empty p, .resources-note p, .favorites-dialog p { font-size: 14px !important; line-height: 1.7; }
.resource-copy h3 { font-size: clamp(22px, 2vw, 28px) !important; line-height: 1.2; }
.resource-subtitle, .resource-facts { font-size: 13px !important; line-height: 1.6; }
.resource-meta, .resource-actions a { font-size: 11.5px !important; line-height: 1.4; letter-spacing: .065em !important; }

/* Inspiration landing and lists */
.editorial-hero h1, .curated-index-hero h1, .discover-intro h1 { font-size: clamp(54px, 6.5vw, 90px) !important; line-height: 1.04; }
.editorial-intro, .curated-index-hero > p:last-child, .discover-intro > p { font-size: clamp(15px, 1.25vw, 17px) !important; line-height: 1.82 !important; letter-spacing: .012em; }
.discover-intro > div > p { font-size: 11.5px !important; font-weight: 600; line-height: 1.45; letter-spacing: var(--tracking-label) !important; }
.inspiration-section-head h2, .discover-list-head h2 { font-size: clamp(30px, 3vw, 42px) !important; line-height: 1.15; }
.inspiration-section-head a, .list-return-discover a { font-size: 12.5px !important; letter-spacing: .045em; }
.editorial-card-copy small, .pairing-copy small, .curated-list-copy small { font-size: 11.5px !important; letter-spacing: .09em !important; }
.editorial-card-copy h3, .pairing-copy h3 { font-size: clamp(22px, 2.1vw, 30px) !important; line-height: 1.2; }
.editorial-card-copy p, .pairing-copy p, .curated-list-copy p { font-size: 14px !important; line-height: 1.7 !important; }
.space-card-copy strong { font-family: var(--font-display) !important; font-size: 21px !important; line-height: 1.2; }
.space-card-copy small { font-size: 11.5px !important; letter-spacing: .075em; }
.discover-tabs button { font-size: 13px !important; line-height: 1.35; }
.discover-tabs b, .discover-pager button { font-size: 11.5px !important; line-height: 1.35; }
.discover-list-head > p { font-size: 14px !important; line-height: 1.72; }
.curated-list-copy h2 { font-size: clamp(25px, 2.35vw, 34px) !important; line-height: 1.17; }
.curated-list-copy span { font-size: 12px !important; letter-spacing: .05em; }

/* Inspiration detail */
.trend-detail-copy h1, .pairing-hero-copy h1 { font-size: clamp(52px, 6vw, 88px) !important; line-height: 1.02; }
.trend-breadcrumb, #trendBoardCount { font-size: 11.5px !important; line-height: 1.45; }
.trend-detail-en { font-size: 13px !important; line-height: 1.4; letter-spacing: .09em !important; }
.trend-detail-lead, .pairing-lead { font-size: clamp(18px, 1.65vw, 23px) !important; line-height: 1.55 !important; }
.trend-detail-text, .pairing-summary { font-size: 14px !important; line-height: 1.78 !important; }
.trend-keywords span, .pairing-keywords span { font-size: 11.5px !important; line-height: 1.35; letter-spacing: .04em; }
.trend-reading h2, .trend-board h2, .trend-related h2,
.pairing-logic h2, .pairing-atmosphere h2, .pairing-materials h2, .related-pairings h2 {
  font-size: clamp(30px, 3vw, 43px) !important;
  line-height: 1.15;
}
.trend-reading > header > span, .pairing-logic > header > span,
.pairing-logic > header > strong { font-size: 14px !important; line-height: 1.72; }
.trend-reading-grid h3, .pairing-logic-grid h3, .pairing-material-copy h3,
.trend-related-grid h2, .related-pairing-grid h3 { font-size: clamp(20px, 1.9vw, 27px) !important; line-height: 1.22; }
.trend-reading-grid p, .pairing-logic-grid p, .pairing-material-copy,
.related-pairing-grid p { font-size: 13.5px !important; line-height: 1.72 !important; }
.trend-board-grid small, .pairing-material-copy dt, .pairing-material-copy dd,
.pairing-material-link, .pairing-space-links a, .trend-space-links a { font-size: 11.5px !important; line-height: 1.45; }
.trend-board-grid b { font-size: 11.5px !important; line-height: 1.35; letter-spacing: .065em; }

/* Material detail */
#detailName { font-size: clamp(56px, 6vw, 92px) !important; line-height: .98; }
.material-english { font-size: 18px !important; line-height: 1.35; letter-spacing: .07em !important; }
.material-summary { font-size: clamp(17px, 1.45vw, 20px) !important; line-height: 1.78 !important; }
.material-code span, .material-meta-grid dt, .technical-meta dt { font-size: 11.5px !important; line-height: 1.4; letter-spacing: .095em !important; }
.material-code b { font-size: 23px !important; line-height: 1; letter-spacing: .11em !important; }
.material-meta-grid dd, .technical-meta dd { font-size: 13.5px !important; line-height: 1.55; }
.hero-keywords span, .reading-keywords span, .material-keywords span, .steel-direction button,
.steel-selector-head span, .viewer-hint, .viewer-reset { font-size: 11.5px !important; line-height: 1.4; }
.steel-selector-head p, #resourceSectionEyebrow { font-size: 11.5px !important; font-weight: 600; line-height: 1.45; letter-spacing: var(--tracking-label) !important; }
.steel-option span, .direction-switch button, .direction-switch span { font-size: 11.5px !important; line-height: 1.4; }
.section-heading h2, .detail-section-head h2 { font-size: clamp(32px, 3.7vw, 50px) !important; line-height: 1.12; }
.section-heading > p, .detail-section-head > p { font-size: 14px !important; line-height: 1.72; }
.steel-selector-head h3, .reading-grid h3, .trend-card h3, .pairing-card-copy h3 { font-size: clamp(21px, 2vw, 28px) !important; line-height: 1.2; }
.reading-grid p, .trend-card p, .pairing-card-copy p { font-size: 13.5px !important; line-height: 1.75 !important; }
.similar-card small { font-size: 12px !important; line-height: 1.4; }
.primary-action, .material-open-button, .detail-back, .section-heading a,
.detail-neighbor-nav a { font-size: 12px !important; line-height: 1.4; letter-spacing: .055em; }

@media (max-width: 650px) {
  :root { --type-body: 14.5px; --type-lead: 16px; }
  .unified-links { font-size: 12px !important; letter-spacing: .02em !important; }
  .language-toggle { font-size: 10.5px !important; }
  .search-portal h1 { font-size: clamp(45px, 14vw, 64px) !important; }
  .page-title, .favorites-title h1, .resources-title-group h1 { font-size: clamp(44px, 13vw, 58px) !important; }
  .editorial-hero h1, .curated-index-hero h1 { font-size: clamp(45px, 13vw, 64px) !important; }
  .trend-detail-copy h1, .pairing-hero-copy h1, #detailName { font-size: clamp(45px, 13vw, 66px) !important; }
  .portal-subtitle, .editorial-intro, .favorites-subtitle, .resources-lead { font-size: 15px !important; }
  input, select, textarea { font-size: 16px !important; }
  .editorial-card-copy p, .pairing-copy p, .curated-list-copy p,
  .trend-detail-text, .pairing-summary, .reading-grid p { font-size: 13.5px !important; }
  .footer, .home-footer { font-size: 11px !important; }
}

@media (max-width: 390px) {
  .unified-links { font-size: 11.5px !important; }
  .language-toggle { font-size: 10.5px !important; }
  .portal-tags button, .filter-bar, .advanced-filters { font-size: 12px !important; }
}
