/* Reader tools share an independent rail; toggling them never reflows text. */
#calm-reader:not(.cr-focus){--cr-stable-toc:216px;--cr-stable-rail:0px;--cr-tool-width:420px;}
#calm-reader:not(.cr-focus) .cr-shell .cr-layout{
  grid-template-columns:var(--cr-stable-toc) minmax(0,1fr) var(--cr-stable-rail)!important;
  padding-right:0!important;
}
#calm-reader:not(.cr-focus) .cr-shell #cr-scroll{grid-column:2!important;min-width:0;}
#calm-reader:not(.cr-focus) .cr-shell .cr-toc{grid-column:1;display:block!important;}
#calm-reader:not(.cr-focus).cr-no-toc .cr-shell .cr-toc{visibility:hidden;pointer-events:none;}
#calm-reader:not(.cr-focus) .cr-shell .cr-panel{
  position:absolute;right:0;top:0;bottom:0;
  width:min(var(--cr-tool-width),100%);max-width:100%;z-index:6;
}
#calm-reader:not(.cr-focus) .cr-shell .cr-article{padding:36px 36px 140px!important;}
#calm-reader.cr-creation-open .cr-shell .cr-layout{padding-right:0!important;}
#calm-reader #reader-creation:not(:modal){width:min(420px,100%);max-width:100%;}
#calm-reader.cr-focus.cr-creation-open[data-width] .cr-article{
  padding:var(--cr-focus-padding-top) var(--cr-focus-padding-right) calc(var(--cr-focus-padding-bottom) + var(--cr-focus-footer-space,0px)) var(--cr-focus-padding-left)!important;
}
@media(min-width:1251px){
  #calm-reader:not(.cr-focus){--cr-stable-rail:420px;}
}
@media(max-width:800px){
  #calm-reader:not(.cr-focus){--cr-stable-toc:0px;--cr-tool-width:355px;}
  #calm-reader:not(.cr-focus) .cr-shell .cr-toc{display:none!important;}
  #calm-reader:not(.cr-focus).cr-mobile-toc .cr-shell .cr-toc{display:block!important;visibility:visible;pointer-events:auto;}
  #calm-reader:not(.cr-focus) .cr-shell .cr-article{padding:27px 32px 100px!important;}
  #calm-reader #reader-creation:not(:modal){width:min(360px,100%);}
}
@media(max-width:500px){
  #calm-reader:not(.cr-focus) .cr-shell .cr-article{padding:23px 25px 90px!important;}
  #calm-reader #reader-creation:not(:modal){width:100%;}
}

/* Center the reading column itself; keep navigation beside its left edge. */
@media(min-width:1101px){
 #calm-reader:not(.cr-focus){--cr-body-width:1040px;--cr-side-min:280px}
 #calm-reader[data-width="wide"]:not(.cr-focus){--cr-body-width:1200px}
 #calm-reader.cr-has-panel:not(.cr-focus){--cr-side-min:280px}
 #calm-reader:not(.cr-focus) .cr-shell .cr-layout{grid-template-columns:minmax(var(--cr-side-min),1fr) minmax(0,var(--cr-body-width)) minmax(var(--cr-side-min),1fr)!important;grid-template-rows:minmax(0,1fr);column-gap:0}
 #calm-reader:not(.cr-focus) .cr-layout>.cr-toc{grid-column:1;grid-row:1;justify-self:end;width:260px;max-width:100%;padding:28px 12px 20px 8px}
 #calm-reader:not(.cr-focus) .cr-toc-content{margin-right:0;padding-right:12px}
 #calm-reader:not(.cr-focus) .cr-layout>.cr-scroll{grid-column:2;grid-row:1;width:100%;min-height:0}
 #calm-reader:not(.cr-focus) .cr-shell .cr-scroll>.cr-article{width:100%;max-width:none;margin-inline:auto;padding-inline:24px!important}
 #calm-reader:not(.cr-focus) .cr-shell .cr-layout>.cr-panel{grid-column:3;grid-row:1;position:relative;inset:auto;justify-self:start;width:100%;max-width:340px;min-height:0}
 #calm-reader.cr-no-toc:not(.cr-focus) .cr-toc-restore{left:calc((100% - min(var(--cr-body-width),100% - var(--cr-side-min) * 2))/2 - 248px);top:28px}
 #calm-reader:not(.cr-focus) #reader-creation:not(:modal){width:min(340px,calc((100vw - min(var(--cr-body-width),100vw - var(--cr-side-min) * 2))/2));max-width:100%}
}