/* Shared reading shell for every fengshui knowledge article.
   Loaded after each topic's styles; topic colours and diagram sizes stay local. */
body.ls-knowledge-page {
  --knowledge-page-width: 1200px;
  --knowledge-page-gutter: clamp(16px, 2.5vw, 32px);
  margin: 0;
}
body.ls-knowledge-page .lk-site {
  width: 100%;
  max-width: none;
}
body.ls-knowledge-page header,
body.ls-knowledge-page main.lk-article-shell,
body.ls-knowledge-page main.story,
body.ls-knowledge-page main.nine-page,
body.ls-knowledge-page main.culture-main,
body.ls-knowledge-page main.knowledge-main,
body.ls-knowledge-page > footer,
body.ls-knowledge-page .lk-site-footer {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--knowledge-page-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--knowledge-page-gutter);
  padding-right: var(--knowledge-page-gutter);
  min-width: 0;
}
body.ls-knowledge-page .culture-hero {
  box-sizing: border-box;
  width: calc(100% - 2 * var(--knowledge-page-gutter));
  max-width: calc(var(--knowledge-page-width) - 2 * var(--knowledge-page-gutter));
  margin-left: auto;
  margin-right: auto;
  padding-left: clamp(22px, 4vw, 52px);
  padding-right: clamp(22px, 4vw, 52px);
  border-radius: 18px;
}
body.ls-knowledge-page .lk-article-heading,
body.ls-knowledge-page .lk-cover,
body.ls-knowledge-page .lk-reading-grid,
body.ls-knowledge-page .lk-related {
  width: 100%;
  max-width: none;
  min-width: 0;
  box-sizing: border-box;
}
/* Grid children must be able to shrink before tables or form fields overflow. */
body.ls-knowledge-page main :is(section, article, aside, figure, form, fieldset),
body.ls-knowledge-page :is(.columns, .birth-grid, .search-grid, .math-grid, .story-grid, .star-layout, .bagua-grid) > * {
  min-width: 0;
}
body.ls-knowledge-page main {
  overflow-wrap: anywhere;
}
body.ls-knowledge-page main :is(input, select, textarea, img, svg, canvas) {
  max-width: 100%;
}
body.ls-knowledge-page :is(.lk-table-wrap, .condition-table-wrap, .table-scroll) {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
body.ls-knowledge-page header {
  flex-wrap: wrap;
  gap: 12px 24px;
}
@media (max-width: 700px) {
  body.ls-knowledge-page .culture-hero h1 {
    white-space: normal;
  }
  body.ls-knowledge-page main.story table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }
}
@media print {
  body.ls-knowledge-page { --knowledge-page-gutter: 0px; }
}
