:root {
  --type-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI",
    "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei",
    "Noto Sans CJK SC", "Source Han Sans SC", sans-serif;
  --type-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo,
    "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", monospace;
  --content-card-padding: 24px;
  --content-card-gap: 16px;
  --content-card-rows: 2;
}

/* Explicit CJK fallbacks also cover English pages containing Chinese names. */
html:root {
  --font: var(--type-sans);
  --sans: var(--type-sans);
  --ch-font: var(--type-sans);
  --mono: var(--type-mono);
  --ch-mono: var(--type-mono);
}

html body,
html :is(button, input, select, textarea) {
  font-family: var(--type-sans);
}

html :is(h1, h2, h3, h4, p, button, input, select, textarea, a, span,
  dt, dd, th, td, label, summary, .eyebrow) {
  letter-spacing: 0;
}

.card {
  --card-heading-gap: 16px;
}
.card.compact-card {
  --card-heading-gap: 8px;
}
.card :is(.template-top h3),
.card.workflow-card h3,
.card.path-panel h3 {
  margin-bottom: var(--card-heading-gap);
}
.card.path-panel .path-choose {
  margin-top: 0;
}
.card :is(.template-card-summary),
.card.workflow-card p {
  margin-top: 0;
}
.content-card-grid {
  row-gap: var(--content-card-gap);
}
.content-card-grid:has(.content-card-action) {
  --content-card-rows: 3;
}
.card.content-card {
  display: grid;
  grid-row: span var(--content-card-rows);
  grid-template-rows: subgrid;
  gap: var(--card-heading-gap);
  padding: var(--content-card-padding);
  border-radius: 8px;
  align-content: start;
}
.content-card > :is(h3, p, a),
.content-card-heading > :is(h3, p) {
  margin: 0;
}
.content-card h3 {
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
}
.card.content-card p {
  font-size: 16px;
  line-height: 28px;
}
.content-card > .content-card-action {
  align-self: end;
  margin-top: calc(20px - var(--card-heading-gap));
  font-size: 14px;
  line-height: 22px;
}
.content-card-heading .eyebrow {
  margin-bottom: 8px;
}
.card.content-card .eyebrow {
  font-size: 12px;
  line-height: 20px;
}
.template-grid > .template-card {
  grid-row: span 5;
  grid-template-rows: subgrid;
  row-gap: var(--content-card-gap);
}
.template-grid .template-top h3 {
  font-size: 20px;
  line-height: 28px;
  margin-bottom: var(--card-heading-gap);
}
.template-grid .template-top {
  align-items: stretch;
}
.template-grid .template-top > div {
  display: grid;
  grid-template-rows: auto 1fr;
}
.template-grid .template-top p {
  margin-top: 0;
  min-height: 0;
}
.template-grid .template-bestfor {
  min-height: 0;
}
.template-grid .spec-list {
  grid-template-rows: repeat(6, 1fr);
}
.template-grid .spec-line {
  min-height: 44px;
}
/* Shared tracks keep landing facts aligned as summaries and notes wrap. */
@supports (grid-template-rows: subgrid) {
  #landingTemplateGrid > .template-card {
    display: grid;
    grid-row: span 5;
    grid-template-rows: subgrid;
  }
  #landingTemplateGrid .template-card-summary { min-height: 0; }
  #landingTemplateGrid .spec-list {
    grid-row: span 2;
    grid-template-rows: subgrid;
  }
}
/* Template values share a first-line baseline when a value has a note. */
.template-card .spec-line { align-items: flex-start; line-height: 22px; }
.template-card .spec-value {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-end;
  gap: 2px 6px;
  min-width: 0;
  text-align: right;
}
.template-card .spec-note {
  color: var(--muted);
  font-family: var(--type-sans);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
}
@supports not (grid-template-rows: subgrid) {
  .template-grid > .template-card {
    grid-template-rows: auto auto auto 1fr auto;
  }
  .card.content-card {
    display: flex;
    flex-direction: column;
  }
  .content-card > .content-card-action {
    margin-top: auto;
    padding-top: calc(20px - var(--card-heading-gap));
  }
}

html:lang(zh-CN) body {
  line-height: 1.75;
  line-break: strict;
}
html:lang(zh-CN) :is(.section-head h2, .final-cta h2) {
  font-size: 40px;
  line-height: 1.3;
}
html:lang(zh-CN) :is(.subpage-intro h1, .pagehead h1) {
  font-size: 48px;
  line-height: 1.25;
}
html:lang(zh-CN) .hero h1 {
  line-height: 1.08;
  font-weight: 650;
  letter-spacing: 0.08em;
}
html:lang(zh-CN) .hero h1 span {
  letter-spacing: inherit;
}
html:lang(zh-CN) :is(.card p, .section-head p, .template-card-summary,
  .template-bestfor, .path-panel p, .package-panel p, .ip-card p) {
  line-height: 1.75;
}
html:lang(zh-CN) .lead {
  font-size: 18px;
  line-height: 32px;
}
/* Memory tools share title and lead line boxes across languages. */
html .subpage-intro:is(.sram-head, .rom-head) h1 {
  font-size: 48px;
  line-height: 60px;
}
html .subpage-intro:is(.sram-head, .rom-head) .lead {
  font-size: 18px;
  line-height: 32px;
}
html:lang(zh-CN) .final-cta .lead {
  margin-top: 20px;
}
html:lang(zh-CN) :is(.card, .panel, .community-box) p + p {
  margin-top: 16px;
}
html :is(.section-head, .subpage-intro) .eyebrow {
  font-size: 13px;
  line-height: 20px;
  margin-bottom: 12px;
}
html:lang(zh-CN) :is(.workflow-card h3, .template-top h3) {
  line-height: 28px;
}
html:lang(zh-CN) .template-top p {
  margin-top: 0;
}
.card:is(.template-card, .path-panel),
html:lang(zh-CN) .package-panel {
  padding: var(--content-card-padding);
  gap: var(--content-card-gap);
}
html:lang(zh-CN) :is(.spec-line, .template-specs) {
  line-height: 22px;
}
html:lang(zh-CN) :is(.event p, .line-node p, .milestone-desc,
  .qr-copy span, .footer-mission > span, .detail-note, .hint) {
  line-height: 1.75;
}

/* Prose gets breathing room; fixed controls and technical registers keep
   their own line boxes, so language switching cannot enlarge a toolbar. */
html:lang(zh-CN) :is(.substrate-root, .auth-shell, .admin-console-workspace) {
  line-height: 24px;
}
html:lang(zh-CN) :is(.auth-card-sub, .auth-alert, .auth-hint,
  .wiz-hint, .wiz-step-sub, .rail-empty, .o-context, .acct-meta,
  .success p, .stage .note, .pipe .stage-body .note) {
  font-size: 14px;
  line-height: 24px;
}
html:lang(zh-CN) :is(.auth-card-title, .wiz-title, .wiz-step-title) {
  line-height: 1.4;
}
html:lang(zh-CN) .substrate-root :is(.stage .fact, .pipe .stage-body .fact,
  .field-hint, .file-list .file-error, .acct-hint, .prog-note) {
  font-size: 13px;
  line-height: 22px;
}
html:lang(zh-CN) .substrate-root .stage {
  padding-top: 14px;
  padding-bottom: 14px;
}
html:lang(zh-CN) .substrate-root .field {
  gap: 8px;
  margin-bottom: 16px;
}
html:lang(zh-CN) .substrate-root .field-grid {
  gap: 16px;
}
html:lang(zh-CN) :is(.auth-field-hint, .preview-feedback, .field-error) {
  font-size: 13px;
  line-height: 22px;
}
html:lang(zh-CN) :is(.wiz-body, .auth-card) p + p {
  margin-top: 12px;
}
html:lang(zh-CN) :is(.auth-alert, .wiz-hint, .form-error, .toast) {
  overflow-wrap: anywhere;
}
html:lang(zh-CN) .substrate-root .sec-head :is(h2, .count) {
  flex-shrink: 0;
  white-space: nowrap;
}
@media (max-width: 720px) {
  :root {
    --content-card-padding: 20px;
  }
  html:lang(zh-CN) :is(.section-head h2, .final-cta h2) {
    font-size: 28px;
  }
  html:lang(zh-CN) :is(.subpage-intro h1, .pagehead h1) {
    font-size: 32px;
  }
  html .subpage-intro:is(.sram-head, .rom-head) h1 {
    font-size: 32px;
    line-height: 40px;
  }
  html:lang(zh-CN) .hero h1,
  html:lang(en) .hero h1 {
    font-size: 40px;
  }
  html:lang(zh-CN) .hero .lead {
    font-size: 18px;
    line-height: 28px;
  }
}
@media (max-width: 360px) {
  html:lang(zh-CN) .hero h1,
  html:lang(en) .hero h1 {
    font-size: 36px;
  }
}