/* Slides: every screen (TeXmacs exports it as div.toggle) is a 16:10 frame. */
html, body { margin: 0; height: 100%; background: #dcdcdc; }
body { font-family: 'Fira Sans', 'Avenir', sans-serif; color: #3a3a3a; }
div.toggle { box-sizing: border-box; background: #f2f2f2; overflow: auto;
             width: min(100vw, 160vh); height: min(62.5vw, 100vh);
             margin: 0 auto; padding: 3% 4% 4%;
             font-size: calc(min(100vw, 160vh) / 58); line-height: 1.35;
             text-align: justify; position: relative; }
div.toggle.empty { display: none !important; }
div.toggle p { margin: .45em 0; }
div.toggle img { max-width: 100%; max-height: calc(min(62.5vw, 100vh) * 0.66); width: auto; }
div.toggle table { max-width: 100%; }
.slide-title { color: #800000; font-weight: 600; font-size: 1.15em;
               border-left: 1px solid #800000; padding: .5em .5em .5em .7em; margin-bottom: .6em; }
.slide-block { border-top: 1px solid #9a9a9a; border-bottom: 1px solid #9a9a9a;
               padding: .3em .3em; margin: .5em 0; }
.slide-box { border: 1px solid #9a9a9a; padding: .3em .5em; margin: .5em 0; }
body.deck div.toggle { display: none !important; position: absolute; top: 50%; left: 50%;
                       transform: translate(-50%, -50%); box-shadow: 0 2px 12px rgba(0,0,0,.25); }
body.deck div.toggle.current { display: flex !important; flex-direction: column;
                               justify-content: safe center; }
/* the title stays at the top of the frame, the content is centred below it */
div.toggle:has(.slide-title) { padding-top: calc(4% + 3.2em); }
.slide-title { position: absolute; top: 4%; left: 4%; right: 4%; margin: 0; }
body.overview div.toggle { display: block !important; margin: 1.5em auto; box-shadow: 0 1px 6px rgba(0,0,0,.2); }
#cqft-counter { position: fixed; right: 1em; bottom: .6em; font-size: 13px; color: #777; }
#cqft-help { position: fixed; left: 1em; bottom: .6em; font-size: 12px; color: #999; }
mjx-container[display="true"] { overflow-x: auto; overflow-y: hidden; }
@media print {
  html, body { background: #fff; height: auto; }
  body.deck div.toggle, body.overview div.toggle { display: block !important; position: static;
    transform: none; box-shadow: none; page-break-after: always; width: 100%; height: auto; }
  #cqft-counter, #cqft-help { display: none; }
}
