/* v1: one site-wide editorial type system.
   Serif is reserved for page and story titles; Sans carries UI, body and actions. */
:root {
  --u98-serif: "U98 Journal Serif", "Noto Serif SC", "Songti SC", SimSun, serif;
  --u98-sans: "U98 Journal Sans", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-display: var(--u98-serif);
  --font-body: var(--u98-sans);
  --font-mono: var(--u98-sans);
  --type-page-title: clamp(2.25rem, 1.7rem + 2vw, 3.25rem);
  --type-section-title: clamp(1.75rem, 1.4rem + 1.25vw, 2.5rem);
  --type-subsection-title: clamp(1.25rem, 1.1rem + .55vw, 1.5rem);
  --type-card-title: clamp(1.125rem, 1rem + .35vw, 1.375rem);
}

html { font-family: var(--u98-sans); font-synthesis: none; }
body,
button,
input,
select,
textarea { font-family: var(--u98-sans); }

body { font-weight: 400; text-rendering: optimizeLegibility; }
strong, b { font-weight: 600; }

.site-shell h1 {
  font-family: var(--u98-serif);
  font-size: var(--type-page-title);
  font-weight: 600;
  line-height: 1.38;
  letter-spacing: 0;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.site-shell h2 {
  font-family: var(--u98-sans);
  font-size: var(--type-section-title);
  font-weight: 600;
  line-height: 1.42;
  letter-spacing: -.015em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.site-shell h3,
.site-shell h4 {
  font-family: var(--u98-sans);
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: 0;
  text-wrap: pretty;
  overflow-wrap: anywhere;
}

/* Brand and navigation belong to the interface family. */
.brand-text,
.mark-number,
.desktop-nav,
.mobile-menu,
.mobile-app-nav,
.header-actions,
.site-footer { font-family: var(--u98-sans); }
.brand-text strong { font-weight: 600; letter-spacing: -.035em; }
.brand-text small { font-weight: 600; letter-spacing: .16em; }
.desktop-nav a,
.support-link,
.header-account-link { font-weight: 500; }

/* Stable hierarchy: page/story titles use Serif; sections, cards and controls use Sans. */
.page-intro h1,
.home-hero-simple h1,
.account-explainer h1,
.workspace-view-heading h2,
.comic-library-heading h1,
.comic-reader h1,
.xingye-card-page--reader .xingye-field-card-title h1 {
  max-inline-size: 18ch;
  font-family: var(--u98-serif);
  font-size: var(--type-page-title);
  font-weight: 600;
  line-height: 1.38;
  letter-spacing: 0;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

.section-heading h2,
.tools-hub-group > header h2,
.tool-router header h2,
.account-service-panel h2,
.workspace-overview-heading h2,
.workspace-view-heading h2,
.workspace-folder-preview h2,
.workspace-account-cue h2,
.workspace-account-grid h2,
.article-body h2,
.article-practical h2,
.article-observation h2,
.article-boundary h2,
.guide-situation-map-heading h2,
.guide-stage-panel-heading h2,
.content-action-bridge h2 {
  max-inline-size: 22ch;
  font-family: var(--u98-sans);
  font-size: var(--type-section-title);
  font-weight: 600;
  line-height: 1.42;
  letter-spacing: -.015em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

.content-card h3,
.content-card.has-comic-art .content-card-link h3,
.content-card.has-comic-art > h3,
.tools-hub-item .comic-entry-copy > h3,
.comic-entry-copy h3,
.guide-situation-point-heading h3,
.path-card h3,
.stage-card h3,
.audience-issue-card h3 {
  font-family: var(--u98-sans);
  font-size: var(--type-card-title);
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: 0;
  text-wrap: pretty;
  overflow-wrap: anywhere;
}

/* Observation stories keep their editorial voice without leaking into utility pages. */
:is(.xingye-page, .home-xingye-journal, .explore-xingye-entry) :is(h1, h2, h3),
.home-xingye-journal-rail strong,
.comic-list-item h2,
.comic-support h2,
.xingye-journal-entry-figure figcaption b {
  font-family: var(--u98-serif);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .01em;
}
.home-xingye-journal-heading h2,
.xingye-journal-overview h2,
.xingye-journal-entry-copy > h2 {
  max-inline-size: 20ch;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

/* All labels and numeric markers share one locally delivered family. */
:where(
  .home-entry-card > span,
  .audience-issue-card > span,
  .audience-next-strip span,
  .home-start-card > span,
  .home-resource-heading span,
  .home-resource-links span,
  .home-scope-points b,
  .home-depth-item > span,
  .assistant-beta-badge,
  .saved-recent-meta b,
  .home-xingye-entry::before,
  .home-xingye-index,
  .xingye-profile > figure figcaption,
  .xingye-method li > span,
  .xingye-featured-grid span,
  .xingye-episode-number,
  .xingye-note-mark,
  .xingye-article-note > div > p,
  .assistant-orbit-note::after,
  .assistant-progress span,
  .assistant-step-heading > span,
  .assistant-kicker,
  .assistant-choice-number,
  .assistant-role span,
  .assistant-result-status,
  .assistant-block-marker small,
  .assistant-footnote span,
  .assistant-support-card-heading > span,
  .support-card-presets > span,
  .support-card-preview-top small,
  .support-card-preview-grid section > span,
  .support-card-preview-footer span,
  .assistant-saved-empty > span,
  .assistant-library-item > span
) {
  font-family: var(--font-mono) !important;
  font-variant-numeric: tabular-nums;
}

.section-kicker,
.eyebrow,
.card-meta,
.tag,
.account-service-state,
.workspace-rail-heading,
.sidebar-box-kicker {
  font-family: var(--u98-sans);
  font-weight: 600;
  letter-spacing: .08em;
}

.button,
.text-button,
.filter-button,
.save-button,
summary,
label { font-family: var(--u98-sans); font-weight: 600; }

/* The account action is visible, but quieter than the content navigation. */
.header-account-link {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  padding: 0 12px;
  border: 1px solid rgba(25, 43, 58, .28);
  color: var(--visual-ink, var(--ink-950));
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}
.header-account-link:hover,
.header-account-link:focus-visible {
  border-color: var(--visual-coral, var(--signal-coral));
  color: var(--visual-coral, var(--signal-coral));
}
.header-account-link[data-account-state="signed-in"] {
  border-color: var(--comic-mint);
}

/* Narrow widths: reduce title pressure before allowing awkward one-character lines. */
@media (max-width: 1080px) {
  .header-account-link { padding-inline: 10px; font-size: 11px; }
  .home-start-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-start-card.has-comic-entry { grid-template-columns: 92px minmax(0, 1fr); }
}

@media (max-width: 820px) {
  .header-account-link { display: none; }
}

@media (max-width: 760px) {
  :root {
    --type-page-title: clamp(1.75rem, 1.45rem + 1.7vw, 2.125rem);
    --type-section-title: clamp(1.5rem, 1.3rem + 1vw, 1.875rem);
    --type-card-title: 1.125rem;
  }
  .page-intro h1,
  .home-hero-simple h1,
  .account-explainer h1,
  .workspace-view-heading h2,
  .comic-library-heading h1,
  .comic-reader h1 {
    max-inline-size: 15ch;
    line-height: 1.42;
  }
  .home-hero-simple h1 { font-size: 2rem; }
  .home-start-grid { grid-template-columns: 1fr; }
  .home-start-card.has-comic-entry { grid-template-columns: 86px minmax(0, 1fr); }
  .page-intro-grid { min-width: 0; }
  .comic-intro-copy { min-width: 0; }
  .section-heading h2,
  .tools-hub-group > header h2,
  .account-service-panel h2 { max-inline-size: none; }
  .account-explainer h1 { font-size: 2.125rem; }
  .account-service-panel h2 { margin-top: 2rem; }
  .mobile-menu a { font-family: var(--u98-sans); font-weight: 500; }
  .mobile-menu .mobile-account-entry { color: var(--visual-coral, var(--signal-coral)); font-weight: 600; }
}

@media (max-width: 360px) {
  :root { --type-page-title: 1.625rem; --type-section-title: 1.45rem; }
  .home-hero-simple h1 { font-size: 1.8rem; }
  .brand-text strong { font-size: 15px; }
}

/* v2: full-site typography audit.
   Keep one font family and reserve the large section scale for real sections. */
.comic-library,
.comic-reader { font-family: var(--u98-sans); }

.site-shell h2 {
  font-family: var(--u98-sans);
  font-size: var(--type-subsection-title);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
}

:is(
  .section-heading,
  .home-start-heading,
  .home-story-copy,
  .guide-story-copy,
  .guide-situation-map-heading,
  .guide-stage-panel-heading,
  .tools-hub-intro,
  .tools-hub-group > header,
  .tool-router > header,
  .account-service-panel,
  .workspace-overview-heading,
  .workspace-view-heading,
  .article-body,
  .article-practical,
  .article-observation,
  .article-boundary,
  .content-action-bridge,
  .assistant-step-heading,
  .assistant-result-heading,
  .assistant-support-card-heading,
  .assistant-library-heading
) h2,
.article-body section > h2 {
  max-inline-size: 22ch;
  font-family: var(--u98-sans);
  font-size: var(--type-section-title);
  font-weight: 600;
  line-height: 1.42;
  letter-spacing: -.015em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

:is(
  .home-xingye-journal-heading,
  .home-xingye-entry,
  .xingye-journal-overview,
  .xingye-journal-entry-copy,
  .home-xingye-copy,
  .explore-xingye-entry
) h2,
.home-xingye-lead-copy > h3 {
  font-family: var(--u98-serif);
  font-size: var(--type-section-title);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .01em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

.comic-list-item h2,
.comic-support h2 {
  font-family: var(--u98-serif);
  font-size: var(--type-subsection-title);
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: .01em;
}

:is(
  .workspace-folder-preview,
  .workspace-account-cue,
  .workspace-account-grid,
  .workspace-view-empty,
  .assistant-saved-heading
) h2 {
  font-size: var(--type-subsection-title);
  line-height: 1.5;
}

.sidebar-box h2 {
  margin-bottom: 12px;
  font-size: 1rem;
  line-height: 1.5;
  letter-spacing: 0;
}

.site-footer h2 {
  margin-bottom: 15px;
  font-size: .75rem;
  line-height: 1.5;
  letter-spacing: .12em;
}

/* The delivered Sans font contains 400–600. Do not request synthetic weights. */
:is(
  .mark-number,
  .home-xingye-journal-heading > div:last-child > a,
  .home-story-steps span,
  .home-story-actions > a:not(.button),
  .guide-story-copy nav a,
  .faq-list summary,
  .observation-save label,
  .xingye-journal-entry-actions > a:not(.button),
  .xingye-episode-neighbors b,
  .explore-xingye-entry span,
  .tool-router legend,
  .structured-brief-builder label,
  .shared-plan-builder label,
  .workspace-rail nav a:hover,
  .workspace-rail nav a.is-active,
  .workspace-folder-create summary,
  .workspace-tabs a.is-active,
  .workspace-continue-grid strong,
  .workspace-item-tools label,
  .cloud-email-form label,
  .cloud-otp-form label,
  .assistant-story-cue span,
  .xingye-article-note a,
  .xingye-card-boundary span,
  .xingye-field-note > span,
  .xingye-field-card-footer nav a,
  .support-card-preview-grid h3
) { font-weight: 600; }

@media (max-width: 760px) {
  :root { --type-subsection-title: 1.25rem; }
  input,
  select,
  textarea { font-size: 1rem !important; }
  .site-footer h2,
  .sidebar-box h2 { text-wrap: pretty; }

  /* Readable mobile baseline for meaningful copy and controls. */
  .home-start-card p,
  .home-story-steps p,
  .home-resource-heading p,
  .home-resource-links small,
  .home-xingye-brief p,
  .home-xingye-boundary,
  .guide-story-copy > p:not(.section-kicker),
  .guide-situation-map-heading > p,
  .guide-situation-point > p,
  .guide-stage-panel-heading > p,
  .content-card p,
  .assistant-step-heading p:not(.assistant-kicker),
  .assistant-choice small,
  .assistant-library-heading > p,
  .assistant-library-item p,
  .account-service-lead,
  .article-sidebar .sidebar-box p { font-size: .875rem; line-height: 1.65; }

  .home-start-card b,
  .home-start-utility a,
  .home-resource-links b,
  .home-xingye-actions > a:not(.button),
  .guide-story-copy nav a,
  .filter-button,
  .result-count,
  .listing-more-button,
  .card-link,
  .save-button,
  .assistant-context-bar button,
  .assistant-more-scenes summary,
  .account-device-link,
  .article-sidebar :is(a, button) { font-size: .875rem; }

  .assistant-choice-action { font-size: .8125rem; line-height: 1.55; }
  .assistant-context-bar button { min-height: 44px; }
}