/* 10 Nov 2026: expandable sections on long client guides. Single default view with opening In short. */
details.guide-fold{
  border:1px solid #e6dff0;border-radius:.9rem;margin:0 0 .85rem;background:#fff;
  padding:0;
}
details.guide-fold > summary{
  cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  padding:.8rem 1rem;min-height:44px;border-radius:.9rem;
}
details.guide-fold > summary::-webkit-details-marker{display:none}
details.guide-fold > summary::after{
  content:"";flex:none;width:.55rem;height:.55rem;border-right:2px solid #3d2f6b;border-bottom:2px solid #3d2f6b;
  transform:rotate(45deg);margin-top:-.2rem;transition:transform .15s;
}
details.guide-fold[open] > summary{border-bottom:1px solid #e6dff0;border-radius:.9rem .9rem 0 0}
details.guide-fold[open] > summary::after{transform:rotate(225deg);margin-top:.15rem}
details.guide-fold > summary:focus-visible{outline:3px solid #c9b98a;outline-offset:2px}
details.guide-fold > summary h2{margin:0;padding:0;border:0;font-size:1.12rem;color:#2f2460;letter-spacing:-.01em}
details.guide-fold > .guide-fold-body{padding:.85rem 1rem 1.1rem}
/* Opening In short stays with the existing wiki-lede style; this only tightens spacing after a moved read-aloud. */
/* 10 Nov 2026: top read-aloud tidy (scoped to guide headers; HTML/helper wording unchanged). */
article[data-guide-view] header.wiki-head .readaloud{
  display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:.45rem .75rem;
  max-width:100%;margin:.45rem 0 .9rem;
}
article[data-guide-view] header.wiki-head .readaloud .btn.sm{
  min-height:42px;padding-left:1.05rem;padding-right:1.05rem;font-size:.95rem;
  flex:0 0 auto;
}
article[data-guide-view] header.wiki-head .readaloud .small{
  flex:1 1 14rem;min-width:0;max-width:100%;
  line-height:1.35;word-break:normal;overflow-wrap:normal;hyphens:none;
}
@media (max-width:40rem){
  article[data-guide-view] header.wiki-head .readaloud{
    flex-direction:column;align-items:flex-start;gap:.35rem;
  }
  article[data-guide-view] header.wiki-head .readaloud .small{flex:0 0 auto;width:100%}
}
@media (prefers-color-scheme:dark){
  details.guide-fold > summary h2{color:#e6defa}
  details.guide-fold{background:#1d1927;border-color:#3a3348}
  details.guide-fold > summary::after{border-color:#a89ad4}
  details.guide-fold[open] > summary{border-bottom-color:#3a3348}
}
@media print{
  details.guide-fold{
    display:block!important;border:0;background:transparent;margin:0 0 1rem;break-inside:auto;
  }
  details.guide-fold > summary{display:block;padding:0;min-height:0}
  details.guide-fold > summary::after{display:none}
  details.guide-fold > :not(summary),
  details.guide-fold > .guide-fold-body{display:block!important;padding:0}
  /* Chrome (and others that support it): closed <details> hide bodies via ::details-content/content-visibility, so display:block on children is not enough. */
  details.guide-fold::details-content{
    display:block!important;
    content-visibility:visible!important;
    visibility:visible!important;
    height:auto!important;
    overflow:visible!important;
  }
}

/* 10 Nov 2026 QA: guide tables scroll sideways instead of mid-word breaks (scoped; does not change global .wiki-table). */
article[data-guide-view] .table-wrap{
  overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;
  margin:1rem 0;
}
article[data-guide-view] .table-wrap:focus-visible{
  outline:3px solid #c9b98a;outline-offset:2px;
}
article[data-guide-view] .table-wrap .wiki-table{
  width:100%;min-width:36rem;
  word-break:normal;overflow-wrap:normal;hyphens:none;
}
article[data-guide-view] .table-wrap .wiki-table th,
article[data-guide-view] .table-wrap .wiki-table td{
  word-break:normal;overflow-wrap:normal;hyphens:none;
  min-width:9rem;
}
article[data-guide-view] .table-wrap .wiki-table a,
article[data-guide-view] .table-wrap .wiki-table *{
  word-break:normal;overflow-wrap:normal;hyphens:none;
}
@media print{
  article[data-guide-view] .table-wrap{overflow:visible!important}
  article[data-guide-view] .table-wrap .wiki-table{min-width:0}
  article[data-guide-view] .table-wrap .wiki-table th,
  article[data-guide-view] .table-wrap .wiki-table td{min-width:0}
}

/* 10 Nov 2026 rollout QA: legacy "More …" folds that sit directly in the article (outside .wrap) align with the text column. Guide pages only. */
article[data-guide-view] > details.cw-more{
  box-sizing:border-box;width:calc(100% - 2rem);max-width:calc(var(--measure, 40rem) - 2rem);
  margin-left:auto;margin-right:auto;
}
@media print{
  /* Legacy article <details> (e.g. cw-more link lists) print open too; JS opens them on beforeprint. */
  article[data-guide-view] details{display:block!important}
  article[data-guide-view] details > :not(summary){display:block!important}
  article[data-guide-view] details::details-content{
    display:block!important;content-visibility:visible!important;visibility:visible!important;height:auto!important;overflow:visible!important;
  }
}