:root {
  --font-ui: -apple-system, BlinkMacSystemFont, 'PingFang SC',
    'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif;
  --font-editorial: 'Songti SC', STSong, 'SimSun', 'Times New Roman',
    serif;
}

html,
body,
.nn-page-root,
.embedded-doc {
  max-width: 100%;
  overflow-x: clip;
}

html,
body {
  margin: 0;
}

.nn-page-root,
.embedded-doc,
.nn-page-root button,
.nn-page-root input,
.nn-page-root select,
.nn-page-root textarea {
  font-family: var(--font-ui) !important;
  font-variant-numeric: tabular-nums;
}

.nn-page-root .hero-title,
.nn-page-root .agent-name,
.nn-page-root .profile-name,
.nn-page-root .profile-title,
.nn-page-root .article,
.nn-page-root .article h1,
.nn-page-root .article h2,
.nn-page-root .article h3,
.nn-page-root .article h4,
.nn-page-root .pull-quote p,
.nn-page-root .related h2,
.nn-page-root .related-head h2,
.nn-page-root .article-cta-card h3,
.nn-page-root .cta-intro,
.nn-page-root .cta-prompt {
  font-family: var(--font-editorial) !important;
}

.nn-page-root .nav,
.nn-page-root .nav-links,
.nn-page-root .btn,
.nn-page-root .crumbs,
.nn-page-root .hero-eyebrow,
.nn-page-root .filter-chips,
.nn-page-root .profile-role,
.nn-page-root .profile-tags,
.nn-page-root .profile-meta,
.nn-page-root .profile-meta-strip,
.nn-page-root .agent-tagline,
.nn-page-root .agent-block-title,
.nn-page-root .agent-cta,
.nn-page-root .related .lede,
.nn-page-root .related-head .lede,
.nn-page-root .rel-name,
.nn-page-root .rel-desc,
.nn-page-root .article-cta .cta-note,
.nn-page-root .article-cta .cta-inputbar,
.nn-page-root .byline,
.nn-page-root .site-footer {
  font-family: var(--font-ui) !important;
}

@media (max-width: 700px) {
  .nn-page-root .container {
    width: 100%;
    min-width: 0;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .nn-page-root .article-body {
    width: 100%;
    min-width: 0;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .nn-page-root .article-body > .article {
    width: 100%;
    min-width: 0;
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
  }

  .nn-page-root .framework li,
  .nn-page-root .principle-list li,
  .nn-page-root .prompt-grid,
  .nn-page-root .cta-prompts {
    min-width: 0;
  }

  .nn-page-root .site-footer {
    padding-top: 42px;
    padding-bottom: 24px;
  }

  .nn-page-root .site-footer .foot-top {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 28px 20px !important;
    margin-bottom: 28px !important;
  }

  .nn-page-root .site-footer .foot-brand {
    grid-column: 1 / -1;
  }

  .nn-page-root .site-footer .foot-brand p {
    margin-bottom: 0;
  }

  .nn-page-root .site-footer .foot-col h4 {
    margin-bottom: 12px;
  }

  .nn-page-root .site-footer .foot-col ul {
    gap: 8px;
  }

  .nn-page-root .site-footer .foot-col:last-child {
    grid-column: 1 / -1;
  }

  .nn-page-root .site-footer .foot-col:last-child ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 20px;
  }

  .nn-page-root .site-footer .foot-bottom {
    align-items: flex-start;
    gap: 10px;
    padding-top: 20px;
  }
}
