/* QilyLean Curated Brief Unified Layout Standard
 * Canonical rule for EVERY curated brief:
 * - same sitewide 1180px content axis as the rest of QilyLean
 * - content may differ; page width/layout framework may not
 * - no private 920/1080/1220/1240/1560 article axis, no per-issue hero width, no standalone layout
 * - typography must follow one hierarchy; body/supporting text never outranks headings
 */

:root{
  --qily-brief-content-axis:var(--qily-wide-content,1180px);
  --qily-brief-gutter:var(--qily-wide-gutter,clamp(14px,2.2vw,40px));
  --qily-brief-media-axis:1040px;

  --qily-brief-font-h1:clamp(30px,2.05vw,36px);
  --qily-brief-font-h2:clamp(23px,1.5vw,28px);
  --qily-brief-font-h3:clamp(19px,1.25vw,22px);
  --qily-brief-font-lead:clamp(18px,1.15vw,20px);
  --qily-brief-font-body:clamp(16px,.95vw,18px);
  --qily-brief-font-small:14px;
}

/* All curated-brief outer regions use the same sitewide horizontal safety gutter. */
html body.qily-knowledge-brief-page :is(
  .knowledge-brief-top-nav,
  .knowledge-brief-hero,
  .knowledge-brief-map,
  .knowledge-brief-section
){
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:var(--qily-brief-gutter)!important;
  padding-right:var(--qily-brief-gutter)!important;
  box-sizing:border-box!important;
}

/* One and only one content axis for hero, navigation, article sections and maps. */
html body.qily-knowledge-brief-page :is(
  .knowledge-brief-top-nav,
  .knowledge-brief-hero,
  .knowledge-brief-map,
  .knowledge-brief-section
) > .module-inner,
html body.qily-knowledge-brief-page .lean-brief-toc.module-inner,
html body.qily-knowledge-brief-page main[data-qily-knowledge-brief] > .module-inner{
  width:min(var(--qily-brief-content-axis),100%)!important;
  max-width:var(--qily-brief-content-axis)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* Per-issue copy classes must never create a second/narrower content axis. */
html body.qily-knowledge-brief-page :is(
  .lean-brief-copy,
  .brief-copy,
  .article-copy,
  .post-copy,
  .prose
){
  width:100%!important;
  max-width:100%!important;
  max-inline-size:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}

html body.qily-knowledge-brief-page .knowledge-brief-article{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* Titles and section headings follow the same axis; do not add issue-specific width caps. */
html body.qily-knowledge-brief-page :is(
  .knowledge-brief-hero h1,
  .knowledge-brief-hero .module-lead,
  .knowledge-brief-section .module-heading
){
  width:100%!important;
  max-width:100%!important;
  max-inline-size:none!important;
}

/* Unified typography hierarchy: H1 > H2 > H3/card title > lead/body > caption.
   Body, table text, callouts and diagram captions must never visually outrank their headings. */
html body.qily-knowledge-brief-page .knowledge-brief-hero h1{
  font-size:var(--qily-brief-font-h1)!important;
  line-height:1.16!important;
}
html body.qily-knowledge-brief-page .knowledge-brief-hero .module-lead{
  font-size:var(--qily-brief-font-lead)!important;
  line-height:1.62!important;
}
html body.qily-knowledge-brief-page .knowledge-brief-section :is(.module-heading h2,h2){
  font-size:var(--qily-brief-font-h2)!important;
  line-height:1.28!important;
}
html body.qily-knowledge-brief-page .knowledge-brief-section :is(.module-heading h3,h3),
html body.qily-knowledge-brief-page :is(.brief-role-shift strong,.brief-viewpoint p,.brief-chain-step strong,.brief-case-flow strong){
  font-size:var(--qily-brief-font-h3)!important;
  line-height:1.45!important;
}
html body.qily-knowledge-brief-page main[data-qily-knowledge-brief] :is(p,li,dd,dt,blockquote,td),
html body.qily-knowledge-brief-page :is(.brief-terminology-audit,.lean-brief-case-note){
  font-size:var(--qily-brief-font-body)!important;
  line-height:1.72!important;
}
html body.qily-knowledge-brief-page :is(.lean-brief-table th,.lean-brief-toc a){
  font-size:clamp(16px,.9vw,18px)!important;
  line-height:1.45!important;
}
html body.qily-knowledge-brief-page :is(figcaption,.knowledge-brief-map small,.brief-chain-step span,.brief-viewpoint cite){
  font-size:var(--qily-brief-font-small)!important;
  line-height:1.6!important;
}

/* Text blocks naturally use the available column width. */
html body.qily-knowledge-brief-page main[data-qily-knowledge-brief] :is(p,li,dd,dt,blockquote){
  max-width:none!important;
  max-inline-size:none!important;
}

/* Diagrams stay inside the unified page axis but use a shared media scale.
   This prevents compact SVG viewBoxes from being enlarged to the full 1180px content axis,
   which would make embedded SVG type visually larger than site headings. */
html body.qily-knowledge-brief-page .lean-brief-diagram{
  width:min(100%,var(--qily-brief-media-axis))!important;
  max-width:var(--qily-brief-media-axis)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html body.qily-knowledge-brief-page .lean-brief-diagram img{
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
}

@media(max-width:620px){
  :root{
    --qily-brief-gutter:15px;
    --qily-brief-font-h1:clamp(27px,7.2vw,32px);
    --qily-brief-font-h2:clamp(21px,5.8vw,25px);
    --qily-brief-font-h3:clamp(18px,5vw,21px);
    --qily-brief-font-lead:17px;
    --qily-brief-font-body:16px;
  }
  html body.qily-knowledge-brief-page :is(
    .knowledge-brief-top-nav,
    .knowledge-brief-hero,
    .knowledge-brief-map,
    .knowledge-brief-section
  ) > .module-inner,
  html body.qily-knowledge-brief-page .lean-brief-toc.module-inner{
    width:100%!important;
    max-width:100%!important;
  }
}


/* QILY-BRIEF-FEEDBACK-AXIS-V3 | 2026-09-21
 * Message/discussion panels are part of the curated-brief reading surface.
 * Their outer border must align exactly with the canonical 1180px article axis.
 */
html body.qily-knowledge-brief-page main[data-qily-knowledge-brief] > .brief-feedback{
  width:min(var(--qily-brief-content-axis),calc(100% - var(--qily-brief-gutter) - var(--qily-brief-gutter)))!important;
  max-width:var(--qily-brief-content-axis)!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}


/* QILY-BRIEF-MOBILE-VISUAL-TYPE-V4 | 2026-09-24
 * Shared typography authority for mobile-first curated-brief diagrams/cards.
 * Per-issue CSS owns composition and color only; type scale remains global.
 */
html body.qily-knowledge-brief-page .tripod-svg .beam-title{
  font-size:var(--qily-brief-font-h2)!important;
}
html body.qily-knowledge-brief-page .tripod-svg :is(.leg-title,.core-title){
  font-size:var(--qily-brief-font-h3)!important;
}
html body.qily-knowledge-brief-page .tripod-svg :is(.beam-sub,.verify-title){
  font-size:var(--qily-brief-font-body)!important;
}
html body.qily-knowledge-brief-page .tripod-svg :is(
  .leg-sub,.figure-note,.cause-node .sub,.flow-box .sub,.core-sub,.verify-sub,.feedback-label
){
  font-size:var(--qily-brief-font-small)!important;
}
html body.qily-knowledge-brief-page .tripod-svg :is(.cause-node text,.flow-box text){
  font-size:var(--qily-brief-font-body)!important;
}
html body.qily-knowledge-brief-page .priority-strip i{
  font-size:var(--qily-brief-font-h3)!important;
}

@media(max-width:680px){
  html body.qily-knowledge-brief-page .tripod-mobile-visual .mobile-visual-head strong{
    font-size:var(--qily-brief-font-h3)!important;
  }
  html body.qily-knowledge-brief-page .tripod-mobile-visual .mobile-visual-head span,
  html body.qily-knowledge-brief-page .tripod-mobile-visual :is(.mobile-visual-base,.mobile-role-card span,.mobile-factor-grid b,.tripod-figure figcaption){
    font-size:var(--qily-brief-font-small)!important;
  }
  html body.qily-knowledge-brief-page .tripod-mobile-visual .mobile-role-card strong,
  html body.qily-knowledge-brief-page .tripod-mobile-visual .mobile-role-card b,
  html body.qily-knowledge-brief-page .tripod-mobile-visual .mobile-verify-box strong,
  html body.qily-knowledge-brief-page .tripod-mobile-visual .mobile-flow-stack>div>strong{
    font-size:var(--qily-brief-font-body)!important;
  }
  html body.qily-knowledge-brief-page .tripod-mobile-visual :is(
    .mobile-factor-grid span,.mobile-verify-box span,.mobile-flow-stack>div>span,.mobile-feedback-strip
  ){
    font-size:var(--qily-brief-font-small)!important;
  }
  html body.qily-knowledge-brief-page .tripod-mobile-visual .mobile-flow-stack>div>b{
    font-size:var(--qily-brief-font-small)!important;
  }
  html body.qily-knowledge-brief-page .tripod-mobile-visual :is(.mobile-down-arrow,.mobile-flow-stack>i){
    font-size:var(--qily-brief-font-h2)!important;
  }
}
