/* Confirmed manual layouts; loaded after the legacy page styles. */
html body { font-family: var(--font-cn); background: var(--paper); color: var(--ink); letter-spacing: 0; word-spacing: normal; overflow-x: visible; }
body h1, body h2, body h3, body h4 { font-family: var(--font-cn); letter-spacing: 0; }
[hidden], .content-card.is-hidden { display: none !important; }
.page-shell .feed-grid .content-card-text > a { min-height:180px; justify-content:flex-end; }
.page-shell .feed-grid .content-card-text .card-copy { flex:1; justify-content:flex-end; }
.category-results-empty { grid-column:1 / -1; padding:32px 0; margin:0; color:var(--muted); }
.category-results-empty a { color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.site-header .header-inner { max-width: 1440px; padding-inline: var(--gutter); gap: 32px; }
.site-header { height:64px; }
.site-header .brand { display:flex; align-items:center; justify-content:center; min-width:44px; width:44px; height:44px; overflow:hidden; }
/* The visible SVG circle occupies 400 of its 600 viewBox units. */
.site-header .brand-logo { width:48px; height:48px; max-width:none; flex-shrink:0; opacity:.8; }
html[data-theme="dark"] .site-header .brand-logo { content: url('HG_logo_white_v001.svg'); filter: none; }
.site-header .primary-nav { gap: 24px; letter-spacing: 0; font-family: 'DIN Next W1G', 'DIN Alternate', var(--font-cn); font-size: 14px; font-weight: 600; }
.site-header .primary-nav a { letter-spacing: 0; }
.site-header .header-tools { gap: 4px; }
.site-header .icon-button, .site-header .language-toggle { box-sizing:border-box; min-width:44px; width:44px; min-height:44px; height:44px; border:4px solid transparent; border-radius:50%; padding:0; transform:none; color:var(--ink); background:color-mix(in srgb,var(--ink) 4%,var(--paper)); background-clip:padding-box; }
.site-header button:hover { background-color:color-mix(in srgb,var(--ink) 9%,var(--paper)); background-clip:padding-box; border-color:transparent; color:var(--ink); transform:none; }
@media(max-width:640px) {
  .site-header { height:64px; }
  .site-header .header-inner { gap:16px; }
  .site-header .header-inner .brand { min-width:44px; width:44px; height:44px; }
  .site-header .header-inner .brand-logo { width:48px; height:48px; }
}
button:focus-visible, a:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 3px; }
.site-header .primary-nav a[aria-current="page"] { text-decoration: none; }
.site-header .primary-nav a::after { content:none; }
.filters .filter.is-active, .filters .filter.is-active:hover { background: var(--brand-cyan); color: #151515; box-shadow: none; }
.content-card > a:is(:hover,:focus-visible) .card-meta > span:last-child { text-decoration: none; }
.content-card .card-meta > span:last-child::after { content: ' ↗'; }
.page-shell { max-width: 1440px; padding-inline: var(--gutter); }
.page-shell .feed-intro { padding: 64px 0; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); display: grid; gap: 24px; }
.feed-status .feed-meta-line { display: flex; flex-wrap: wrap; flex-direction: column; align-items: flex-start; gap: 2px; font-size: 10px; line-height: 1.25; font-variant-numeric: tabular-nums; }
.feed-meta-line::before { content: 'LOCAL TIME'; }
.feed-meta-line .intro-date { margin: 0; font-size: 10px; line-height: inherit; letter-spacing: 0; }
.feed-meta-line .pixel-clock { font-size: 10px; }
.clock-date-line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.intro-copy { text-align: right; min-width: 0; }
.intro-copy .intro-title { font-family: 'DIN Next W1G', 'DIN Alternate', var(--font-cn); font-size: 44px; font-weight: 600; line-height: 1.1; letter-spacing: 0; white-space: normal; margin: 0; text-transform: uppercase; }
.intro-copy .intro-note { font-size: 12px; line-height: 1.6; color: var(--muted); max-width: 400px; margin: 16px 0 0 auto; }
.filter-bar { padding: 8px 0; border-bottom: 1px solid var(--line); }
.filter-label, .media-index, .card-description { display: none; }
.filters { display: flex; flex-wrap: wrap; gap: 4px; }
.filters .filter { font-size: 12px; letter-spacing: 0; padding: 8px 12px; min-height: 44px; border-radius: 4px; border: 0; }
.filter.is-active, .filters .filter:hover { background: var(--ink); color: var(--paper); }
.page-shell .feed-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 32px 24px; margin-top: 32px; }
.feed-grid .content-card { grid-column: span 4; grid-row: auto; min-width: 0; }
.page-shell .feed-grid.is-filtered .content-card { grid-column: span 4; grid-row: auto; }
.feed-grid:not(.is-filtered) .content-card:nth-child(1) { grid-column: span 7; grid-row: span 2; }
.feed-grid:not(.is-filtered) .content-card:nth-child(2), .feed-grid:not(.is-filtered) .content-card:nth-child(3) { grid-column: span 5; }
.content-card > a { height: 100%; display: flex; flex-direction: column; }
.content-card .card-media { aspect-ratio: 5 / 4; background: var(--line); }
.feed-grid:not(.is-filtered) .content-card:nth-child(1) .card-media { flex: 1; min-height: 0; }
.feed-grid:not(.is-filtered) .content-card:nth-child(2) .card-media, .feed-grid:not(.is-filtered) .content-card:nth-child(3) .card-media { aspect-ratio: 16 / 9; }
.content-card .card-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: none; filter: none; }
.content-card .media-type { right: 12px; top: 12px; padding: 6px 8px; background: var(--ink); color: var(--paper); border-radius: 4px; font-size: 12px; letter-spacing: 0; }
.content-card .card-copy { flex: none; padding: 16px 0; }
.content-card .card-kicker { color: var(--ink); font-size: 12px; margin: 0 0 8px; letter-spacing: 0; }
.content-card .card-title { font-size: 20px; font-weight: 600; line-height: 1.35; white-space: normal; text-transform: none; overflow-wrap: anywhere; margin: 0; max-width: none; letter-spacing: 0; }
.feed-grid:not(.is-filtered) .content-card:nth-child(-n+3) .card-title { min-height: 38px; line-height: 38px; }
.feed-grid:not(.is-filtered) .content-card:first-child .card-title { font-size: 24px; }
.content-card .card-meta { margin: 24px 0 0; padding: 0; font-size: 12px; letter-spacing: 0; flex-wrap: wrap; }
@media(min-width: 641px) {
  .feed-grid.is-filtered:not(.is-tag-list) .card-media,
  .feed-grid:not(.is-filtered) .content-card:nth-child(n+4) .card-media { flex-shrink: 0; }
  .feed-grid.is-filtered:not(.is-tag-list) .card-copy,
  .feed-grid:not(.is-filtered) .content-card:nth-child(n+4) .card-copy { flex: 1; display: flex; flex-direction: column; }
  .feed-grid.is-filtered:not(.is-tag-list) .card-meta,
  .feed-grid:not(.is-filtered) .content-card:nth-child(n+4) .card-meta { margin-top: auto; padding-top: 24px; }
}
.site-footer.site-footer { max-width: 1344px; margin: 48px auto 0; padding: 32px 0; display: flex; align-items: center; justify-content: space-between; gap: 24px; font-size: 12px; }
.site-footer .footer-mark { display: none; }
.site-footer .footer-copy { display: block !important; font-size: 12px; line-height: 1.6; }
.footer-info { display: flex; gap: 16px; margin-top: 8px; color: var(--muted); }
.footer-info a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.site-footer .social-links a { cursor: pointer; color: var(--muted); }
.site-footer .wechat-social { width: 44px; height: 44px; display: grid; place-items: center; padding: 0; border: 1px solid var(--ink); border-radius: 50%; color: var(--muted); background: transparent; cursor: pointer; }
.site-footer .social-links a:hover, .site-footer .social-links .wechat-social:hover { background: #333; color: #fff; border-color: #333; transform: none; }
.wechat-dialog { position: fixed; inset: 0; width: min(338px, calc(100% - 32px)); max-height: calc(100dvh - 32px); overflow: auto; box-sizing: border-box; margin: auto; padding: 32px 24px 24px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); color: var(--ink); text-align: center; }
.wechat-dialog::backdrop { background: rgb(0 0 0 / 35%); }
.wechat-dialog h2 { margin: 0 0 16px; font-size: 18px; line-height: 1.4; }
.wechat-dialog img { display: block; width: 258px; max-width: 100%; height: auto; margin: auto; }
.wechat-dialog p { margin: 16px 0 0; font-size: 14px; line-height: 1.6; }
.wechat-close { position: absolute; top: 0; right: 0; width: 44px; height: 44px; padding: 0; font-size: 24px; color: var(--ink); }
.page-shell .site-footer > .social-links, .content-page .site-footer > .social-links { display: flex; align-items: center; gap: 8px; visibility: visible; opacity: 1; }
.site-footer .social-links svg { display: block; width: 16px; height: 16px; }
.content-page .content-main { max-width: 1440px; padding: 48px var(--gutter) 0; margin: auto; }
.content-page .content-header { display: flex; flex-direction: column; gap: 0; max-width: 800px; margin: 0 auto 32px; padding: 0 0 16px; border: 0; border-bottom: 1px solid var(--line); }
.content-page .content-header .content-byline { margin-bottom: 0; }
.content-page.reading-post .content-header .reading-source { margin: 0; padding: 0; border: 0; font-size: 12px; line-height: 1.6; gap: 8px 24px; }
.content-header .content-type, .content-header .content-context-note { font-size: 12px; color: var(--muted); margin-bottom: 16px; }
.content-header .content-index { display: none; }
.content-page .content-title { font-family: var(--font-cn); font-size: 32px; font-weight: 600; line-height: 1.35; text-transform: none; white-space: normal; letter-spacing: 0; margin: 0 0 16px; overflow-wrap: anywhere; }
.content-page .content-deck { font-size: 14px; line-height: 1.6; max-width: 800px; margin: 0 auto 32px; padding: 0; border: 0; color: var(--muted); }
.article-tags { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 12px; line-height: 1.6; }
.article-tags a { color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.article-tags a:hover { color: var(--ink); }
.content-page .content-meta, .content-byline { display: flex; flex-wrap: wrap; gap: 16px; font-size: 12px; color: var(--muted); letter-spacing: 0; }
.article-reading-stats { display: inline-flex; align-items: baseline; gap: 4px; }
.article-reading-stats .reading-time::before { content: none; margin: 0; }
.tag-results-heading { display:flex; align-items:baseline; flex-wrap:wrap; gap:12px; margin-top:32px; }
.tag-results-heading h2 { margin:0; font-size:12px; line-height:1.4; font-weight:600; }
.tag-results-heading > span,.tag-results-heading a { font-size:12px; color:var(--muted); }
.tag-results-heading a { margin-left:auto; text-decoration:underline; text-underline-offset:3px; }
.page-shell .feed-grid.is-tag-list { display:block; margin-top:16px; padding-top:0; }
.is-tag-list .content-card { border-bottom:1px solid var(--line); }
.is-tag-list .content-card > a { display:grid; grid-template-columns:minmax(0,1fr); padding:16px 0; }
.is-tag-list .content-card .card-media { display:none; }
.is-tag-list .content-card .card-copy { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 24px; padding:0; border-bottom:0; }
.page-shell .feed-grid.is-tag-list .content-card .card-title { grid-column:1; grid-row:1; font-size:18px; line-height:1.6; min-height:0; }
.is-tag-list .content-card .card-kicker { grid-column:1; grid-row:2; margin:0; color:var(--muted); }
.is-tag-list .content-card .card-meta { grid-column:2; grid-row:1; align-self:baseline; margin:0; }
.is-tag-list .card-meta > span:last-child { display:none; }
.tag-results-empty { font-size:14px; color:var(--muted); margin:24px 0; }
@media(max-width:640px) {
  .is-tag-list .content-card .card-copy { grid-template-columns:minmax(0,1fr); gap:4px; }
  .page-shell .feed-grid.is-tag-list .content-card .card-title { font-size:16px; }
  .is-tag-list .content-card .card-meta { grid-column:1; grid-row:3; }
}
.content-page .content-hero { display: block; width: 100%; max-width: 1344px; height: auto; aspect-ratio: 2.35 / 1; object-fit: cover; border-radius: 0; margin: 0 auto 32px; }
.content-page .content-layout { display: block; max-width: 800px; margin: auto; padding: 0; }
.content-page .content-aside { display: none; }
.lab-overview { max-width: 800px; margin: 0 auto 48px; }
.content-page.lab-post .content-hero,
.content-page.reading-post .content-hero { max-width: 800px; aspect-ratio: 16 / 9; height: auto; object-fit: cover; object-position: center; }
.lab-overview h2 { font-size: 24px; line-height: 1.4; font-weight: 600; margin: 0 0 16px; }
.lab-overview .detail-fields { margin: 0; }
.lab-overview dd { white-space: pre-wrap; }
.lab-parameter-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px 0; margin: 0; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.lab-parameter-strip + .lab-parameter-strip { border-top: 0; }
.lab-parameter-strip > div { display: flex; align-items: baseline; gap: 10px; min-width: 0; padding: 0 12px; border-left: 1px solid var(--line); }
.lab-parameter-strip dt { flex: none; font-size: 10px; line-height: 1.4; font-weight: 600; text-transform: uppercase; color: var(--muted); margin: 0; }
.lab-parameter-strip dd { margin: 0; font-size: 14px; line-height: 1.4; font-weight: 600; overflow-wrap: anywhere; }
.lab-parameter-strip-wide { grid-template-columns: minmax(0, 1fr); }
.lab-model-row { display: grid; grid-template-columns: repeat(var(--lab-field-count, 2), minmax(0, 1fr)); gap: 10px 0; }
.lab-model-row > div { max-width: 100%; box-sizing: border-box; }
.lab-model-row dd { min-width: 0; }
.lab-settings-row { grid-template-columns: repeat(var(--lab-field-count, 5), minmax(0, 1fr)); }
@media (max-width: 640px) { .lab-parameter-strip,.lab-model-row,.lab-settings-row { display: grid; grid-template-columns: minmax(0, 1fr); padding: 10px 0; gap: 8px; } }
.lab-overview .detail-fields dt { font-weight: 600; color: var(--ink); }
.lab-post .content-body .comparison img { aspect-ratio: auto; height: auto; object-fit: contain; }
@media (max-width: 640px) {
  .lab-overview { margin-bottom: 32px; }
  .lab-overview h2 { font-size: 20px; }
  .lab-overview .detail-fields div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}
.content-page .content-body { width: 100%; max-width: 800px; font-size: 16px; line-height: 1.8; padding: 0; }
.content-body p, .content-body .lead { max-width: none; font-size: inherit; line-height: inherit; margin: 0 0 16px; }
.statement-page .content-body p { text-align: justify; text-align-last: left; text-justify: inter-character; }
.content-body h2, .content-body h3 { font-size: 24px; font-weight: 600; line-height: 1.4; margin: 32px 0 16px; }
.content-body h2 *, .content-body h3 * { font: inherit !important; letter-spacing: 0 !important; }
.content-body img { display: block; width: 100%; max-width: 100%; height: auto; margin: 24px auto; }
.content-body figure { margin: 24px 0; }
.content-body figure img { margin: 0; }
.content-body figcaption { margin-top: 8px; font-size: 14px; line-height: 1.6; color: var(--muted); }
.content-body pre { overflow: auto; padding: 16px; background: var(--surface); border-radius: 4px; font-size: 12px; }
.content-body .comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin: 24px 0; }
.content-body .comparison img { aspect-ratio: 3 / 2; object-fit: cover; }
.content-body .back-link { display: inline-flex; min-height: 44px; align-items: center; margin: 24px 0 16px; padding: 0; border: 0; font-size: 14px; }
.article-actions { border-top: 1px solid var(--line); padding-top: 24px; }
.share-simple { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; border: 1px solid var(--line); border-radius: 4px; padding: 8px 12px; font-size: 14px; }
.share-simple:hover { background: #333; color: #fff; }
.related-content { margin-top: 32px; }
.related-content-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:baseline; gap:16px; padding:16px 0; border-top:1px solid var(--line); }
.related-content-row a { min-width:0; font-size:16px; overflow-wrap:anywhere; }
.related-content-row time { color:var(--muted); font-size:12px; white-space:nowrap; }
.detail-fields { margin: 24px 0; }
.detail-fields div { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; border-bottom: 1px solid var(--line); padding: 12px 0; font-size: 14px; }
.detail-fields dt { color: var(--muted); } .detail-fields dd { margin: 0; overflow-wrap: anywhere; }
.content-body .resource-grid { display: block; margin: 24px 0; }
.content-body .resource-item { padding: 16px 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; }
.content-body .resource-item h3 { margin: 0 0 8px; font-size: 18px; }
.content-body .lab-stats { display: none; }
@media(max-width: 800px) { .intro-copy .intro-title { font-size: 32px; } .feed-grid .content-card { grid-column: span 6; } }
@media(max-width: 800px) { .page-shell .feed-grid.is-filtered .content-card { grid-column: span 6; } }
@media(min-width: 641px) and (max-width: 800px) {
  .feed-grid:not(.is-filtered) .content-card:nth-child(-n+3) .card-title { min-height: 0; line-height: 1.35; }
}
@media(max-width: 640px) {
  .site-menu-open .site-header .primary-nav {
    gap: 0;
    padding: 8px var(--gutter) 12px;
  }
  .site-menu-open .site-header .primary-nav a {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    min-height: 44px;
    padding: 8px 0;
    line-height: 20px;
    text-decoration: none;
  }
  .site-menu-open .site-header .primary-nav a::after { display: none; }
  .wechat-dialog .wechat-close:focus-visible {
    outline: none;
    box-shadow: none;
  }
  html[data-reading-scrolled="true"] .site-header {
    background: #f5f5f5;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  html[data-theme="dark"][data-reading-scrolled="true"] .site-header { background: #262626; }
  .page-shell .feed-intro { grid-template-columns: minmax(0, 1fr); padding: 32px 0; }
  .feed-status { margin: 0; } .intro-copy .intro-title { font-size: 22px; }
  .page-shell .feed-grid { grid-template-columns: minmax(0, 1fr); }
  .page-shell .feed-grid:not(.is-tag-list) { margin-top: 32px; padding-top: 0; }
  .feed-grid .content-card, .feed-grid:not(.is-filtered) .content-card:nth-child(-n+3) { grid-column: auto; grid-row: auto; }
  .page-shell .feed-grid.is-filtered .content-card { grid-column: auto; }
  .feed-grid:not(.is-filtered) .content-card:nth-child(-n+3) .card-media { aspect-ratio: 5 / 4; flex: none; }
  .content-card .card-title, .feed-grid:not(.is-filtered) .content-card:first-child .card-title { font-size: 18px; }
  .feed-grid:not(.is-filtered) .content-card:nth-child(-n+3) .card-title { min-height: 0; line-height: 1.35; }
  .site-footer.site-footer { margin-top: 32px; padding: 24px 0 36px; flex-wrap: wrap; }
  .site-footer .footer-credits { display: block; }
  .content-page .content-main { padding-top: 32px; }
  .content-page .content-title { font-size: 24px; line-height: 1.35; }
  .content-page .content-body { font-size: 14px; line-height: 1.6; }
  .content-body h2, .content-body h3 { font-size: 20px; line-height: 1.4; }
  .content-body .comparison { grid-template-columns: minmax(0, 1fr); }
  .detail-fields div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}
@media(max-width: 359px) { .intro-copy .intro-title { font-size: 16px; } }
.content-card .media-video { position:absolute; left:12px; bottom:12px; display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 8px; border-radius:4px; background:#333; color:#fff; font-size:12px; line-height:1; }
.content-card .media-video::before { content:""; width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:8px solid currentColor; }
.feed-grid[data-active-type]:not([data-active-type="all"]) .media-type { display:none; }
.statement-page .content-deck { width:100%; max-width:none; margin-left:0; margin-right:0; text-align:left; }
@media (max-width: 640px) {
  .content-page.statement-page .content-main { padding-top: 32px; }
  .content-page.about-draft-page main { padding-top: 0; }
  .content-page.about-draft-page main > .intro {
    padding-top: 32px;
    min-height: 0;
    justify-content: flex-start;
  }
  .content-page.statement-page .content-body,
  .content-page.statement-page .content-body :is(p, li),
  .content-page.about-draft-page main p,
  .content-page.about-draft-page .intro .bio .lead {
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0;
    word-spacing: 0;
    line-break: strict;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
  }
  .content-page.statement-page .content-body :is(p, li) {
    text-align: justify;
    text-align-last: left;
    text-justify: inter-ideograph;
  }
  .content-page.about-draft-page main p {
    text-align: center;
    text-align-last: auto;
  }
  .content-page.statement-page .content-body p,
  .content-page.about-draft-page main p {
    margin-bottom: 20px;
  }
  .content-page.about-draft-page main p:last-child { margin-bottom: 0; }
  .content-page.about-draft-page .philosophy .motto { white-space: normal; }
  .content-page.statement-page .content-body h2,
  .content-page.about-draft-page main h2 {
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0;
  }
  .content-page.statement-page .content-body h3,
  .content-page.about-draft-page main h3 {
    font-size: 18px;
    line-height: 1.4;
    letter-spacing: 0;
  }
  .content-page.statement-page .content-body :is(h4, h5) {
    font-size: 16px;
    line-height: 28px;
  }
  .content-page.about-draft-page .tools small { font-size: 12px; }
}

/* Content-sized LAB fields: keep each item together; wrap whole items. */
.lab-parameter-strip.lab-parameter-flow{display:flex;flex-wrap:wrap;gap:12px 0;padding:12px 0}
.lab-parameter-flow>div{flex:0 1 auto;width:max-content;max-width:100%;box-sizing:border-box;min-width:0}
.lab-parameter-flow dd{white-space:nowrap;overflow-wrap:normal;min-width:0;max-width:100%}
.lab-parameter-flow>div.lab-field-overlong{flex-basis:100%}
.lab-parameter-flow>div.lab-field-overlong dd{white-space:normal!important;overflow-wrap:anywhere}

.lab-parameter-strip.lab-parameter-flow dd{white-space:nowrap!important}
.lab-parameter-strip.lab-parameter-flow>.lab-field-overlong dd{white-space:normal!important;overflow-wrap:anywhere}

/* Preserve full-width separators between measured flex rows. */
.lab-parameter-strip.lab-parameter-flow{row-gap:24px}
.lab-parameter-flow dt{color:#8a8a8a}
html[data-theme="dark"] .lab-parameter-flow dt{color:#aaa}
