/* Figma 70:5262. Private differences on the shared case-study components. */
.ai-coding-page {
  --font-sans: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --coding-figure-radius: 12px;
  --coding-rule-width: 1px;
  --coding-workflow-width: 890px;
}
.ai-coding-page .brand { flex-direction: column; align-items: flex-start; justify-content: center; gap: 0; }
.ai-coding-page .brand-name,
.ai-coding-page .brand-portfolio { line-height: var(--leading-body); }
.ai-coding-page .directory-project { margin-bottom: 0; }
.ai-coding-page .chapter-nav > ol { padding-top: var(--space-6); }
.ai-coding-page .section-header { border-top-width: var(--coding-rule-width); }
.ai-coding-page .coding-figure { margin-block: var(--space-6) 0; }
/* These native exports already contain the 24px top gap as transparent pixels. */
.ai-coding-page .coding-figure--workflow { max-width: var(--coding-workflow-width); margin-top: 0; }
.ai-coding-page .coding-figure--popovers,
.ai-coding-page .coding-figure--dialogs { margin-top: 0; }
.ai-coding-page .coding-figure .figure-link { border-radius: var(--coding-figure-radius); overflow: hidden; }
.ai-coding-page .coding-figure--commits figcaption,
.ai-coding-page .coding-figure--branch figcaption { color: var(--ink); opacity: .3; font-size: var(--text-small); }
.ai-coding-page .coding-case > h3 { margin-bottom: 0; }
.ai-coding-page #case-overview + .coding-case { margin-top: var(--space-8); }
.ai-coding-page .coding-case + .coding-case {
  border-top: var(--coding-rule-width) solid var(--rule);
  padding-top: var(--space-6);
}
.ai-coding-page .coding-field { margin-top: var(--space-6); }
.ai-coding-page .case-footer { margin-top: var(--space-14); }
@media (max-width: 700px) {
  .ai-coding-page .site-header { gap: var(--space-3); }
  .ai-coding-page .brand { max-width: 54%; }
  .ai-coding-page .brand-portfolio { display: block; font-size: 9px; line-height: var(--leading-small); }
}