@font-face {
    font-family: "Frutiger Notes";
    src: url("fonts/Frutiger-Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap
}

@font-face {
    font-family: "Frutiger Notes";
    src: url("fonts/Frutiger-Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap
}

:root {
    --paper: #fbfaf7;
    --ink: #171411;
    --muted: #6b635b;
    --rule: #d7d0c6;
    --soft: #f2efe8;
    --block: #eeeeee;
    --accent: #325d8a;
    --accent-dark: #173f64;
    --accent-soft: #f4f8fb;
    --brown: #8a4c20;
    --brown-soft: #faf4ee;
    --serif: Georgia, "Times New Roman", Times, serif;
    --sans: "Frutiger Notes", "Frutiger", "Helvetica Neue", Arial, sans-serif;
    --environment-label-weight: 600;
    --page-total: 828px;
    --rail-width: 270px;
    --rail-gutter: 2cm;
    --rail-left: max(24px, calc((100vw - var(--page-total))/2 - var(--rail-width) - var(--rail-gutter)));
    --page-top: 32px;
    --anchor-offset: 32px
}

.index-page {
    max-width: 880px;
    margin: 72px auto;
    padding: 0 24px;
}
.index-page h1 { font-size: clamp(2rem, 4.5vw, 3.5rem); line-height: 1.12; }
.index-authors { color: var(--muted); }
.index-edition { color: var(--muted); font-size: .9rem; }
.chapter-index { list-style: none; padding: 0; margin: 40px 0; }
.chapter-index li { display: flex; gap: 22px; border-top: 1px solid var(--rule); padding: 16px 0; }
.index-number { color: var(--muted); min-width: 24px; font-variant-numeric: tabular-nums; }

html {
    /* Display course and lecture typography at 90% of its original size. */
    font-size: 90%;
    background: var(--paper);
    scroll-behavior: smooth;
    scroll-padding-top: var(--anchor-offset)
}

body {
    margin: 0;
    color: var(--ink);
    background: var(--paper);
    font-family: var(--serif);
    font-size: 1.125rem;
    line-height: 1.58
}

.paragraph-marker {
    display: inline-block;
    width: .5em;
    height: .5em;
    vertical-align: .04em;
    background: currentColor;
    flex: none
}

.paragraph-marker-triangle-right {
    height: .55em;
    clip-path: polygon(0 0, 100% 50%, 0 100%)
}

.paragraph-marker-triangle-up {
    width: .55em;
    clip-path: polygon(0 100%, 50% 0, 100% 100%)
}

h1,
h2,
h3,
h4,
strong,
b,
.env-title,
.lecture-kicker,
.course-title,
.course-event,
.lecture-rail-heading,
.lecture-rail-tool,
.lecture-rail-link.is-current,
.lecture-section-link.is-active,
.citation-note-key {
    font-family: var(--sans);
    font-synthesis: none
}

a {
    color: var(--accent);
    text-decoration: none
}

a:hover {
    color: var(--accent-dark);
    text-decoration: underline
}

.citation {
    color: var(--brown)
}

.citation-author {
    color: var(--brown)
}

.citation:hover {
    color: #5f3213
}

.citation-wrap {
    position: relative
}

/* Quotes inset their text on both sides. Keep notes on the article's rail. */
.lecture-content blockquote {
    --sidenote-quote-inset: 40px;
    margin-inline: var(--sidenote-quote-inset)
}

.citation-note {
    float: right;
    clear: right;
    width: 210px;
    margin: .2rem calc(-234px - var(--sidenote-inset, 0px) - var(--sidenote-quote-inset, 0px)) .7rem calc(24px + var(--sidenote-inset, 0px) + var(--sidenote-quote-inset, 0px));
    color: var(--brown);
    font-family: var(--serif);
    font-size: .78rem;
    font-weight: 400;
    line-height: 1.35;
    text-align: left
}

.env-title .citation-note,
.env-heading .citation-note,
.citation-note * {
    font-weight: 400
}

.citation-note a {
    color: var(--brown);
    font-family: var(--serif);
    font-weight: 400
}

:is(.citation-note, .bib-entry) a:is([href^="https://"], [href^="http://"])::before {
    --link-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.1 0l3-3a5 5 0 0 0-7.1-7.1l-1.7 1.7M14 11a5 5 0 0 0-7.1 0l-3 3a5 5 0 0 0 7.1 7.1l1.7-1.7'/%3E%3C/g%3E%3C/svg%3E");
    content: "";
    display: inline-block;
    width: .95em;
    height: .95em;
    margin-right: .2em;
    vertical-align: -.12em;
    background-color: currentColor;
    -webkit-mask: var(--link-icon) center / contain no-repeat;
    mask: var(--link-icon) center / contain no-repeat
}

.citation-note-key {
    font-family: "Frutiger Notes", var(--serif);
    font-weight: 700;
    color: var(--brown)
}

.citation-note-bracket {
    color: var(--ink)
}

.citation-note-authors[hidden] {
    display: none
}

.footnote .citation-note,
.citation-note .citation-note {
    display: none
}

.notes-heading,
.env.statement[id],
figure[id],
.equation[id] {
    scroll-margin-top: var(--anchor-offset)
}

.site-masthead {
    max-width: 780px;
    margin: 0 auto;
    padding: 28px 24px 16px;
    border-bottom: 1px solid var(--rule)
}

.course-title {
    font-size: 1.06rem;
    font-weight: 700
}

.course-title-link {
    display: block !important;
    padding: 0 !important;
    color: var(--ink) !important
}

.course-title-link:hover {
    color: var(--accent) !important;
    text-decoration: none !important;
    background: transparent !important
}

.course-authors {
    margin-top: 2px;
    color: var(--muted);
    font-size: .92rem
}

.top-links {
    display: flex;
    gap: 14px;
    margin-top: 10px;
    font-size: .9rem
}

.course-sidenote {
    float: right;
    clear: right;
    width: 210px;
    margin: .1rem -234px 1rem 24px;
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.35;
    text-align: left
}

.lecture-citation-sidenote {
    float: right;
    clear: right;
    width: 210px;
    margin: 0 -234px 1.2rem 24px;
    color: var(--muted);
    font-size: .72rem;
    line-height: 1.28;
    text-align: left
}

.lecture-citation-link {
    display: flex;
    align-items: center;
    gap: .34rem;
    margin: 0 0 .65rem !important;
    padding: 0 !important;
    background: transparent;
    border: 0;
    color: var(--accent) !important;
    font-family: "Frutiger Notes", var(--serif);
    font-size: .72rem;
    font-weight: 700;
    line-height: 1.1
}

.lecture-citation-pdf::before {
    content: "";
    display: inline-block;
    width: 1rem;
    height: 1.18rem;
    flex: 0 0 auto;
    background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 24'%3E%3Cpath d='M4 1.5h8.4L18.5 7.6V22.5H4z' fill='%23f4f8fb' stroke='%23325d8a' stroke-width='1.5'/%3E%3Cpath d='M12.3 1.5v6.3h6.2' fill='none' stroke='%23325d8a' stroke-width='1.5' stroke-linejoin='round'/%3E%3Crect x='1.5' y='11' width='17' height='7.2' rx='1.4' fill='%23325d8a'/%3E%3Ctext x='10' y='16.2' text-anchor='middle' font-family='Arial, Helvetica, sans-serif' font-size='5.6' font-weight='700' fill='white'%3EPDF%3C/text%3E%3C/svg%3E")
}

.lecture-citation-github svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 auto;
    fill: currentColor
}

.lecture-citation-link:hover {
    color: var(--accent-dark) !important;
    background: transparent !important;
    text-decoration: none
}

.lecture-citation-details {
    margin: 0
}

.lecture-citation-details.is-animating pre {
    overflow: hidden;
    transition: height .28s ease, opacity .2s ease, margin-top .28s ease,
        padding-top .28s ease, padding-bottom .28s ease
}

.lecture-citation-title {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    cursor: pointer;
    color: var(--brown);
    font-family: "Frutiger Notes", var(--serif);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase
}

.lecture-citation-title::before {
    content: "";
    width: 0;
    height: 0;
    border-top: .28em solid transparent;
    border-bottom: .28em solid transparent;
    border-left: .42em solid currentColor;
    transition: transform .16s ease
}

.lecture-citation-details[open] .lecture-citation-title::before {
    transform: rotate(90deg)
}

.lecture-citation-title::-webkit-details-marker {
    display: none
}

.lecture-citation-title::marker {
    content: ""
}

.lecture-citation-sidenote pre {
    margin: .35rem 0 0;
    padding: .45rem .5rem;
    overflow-x: auto;
    background: #fffdf9;
    border-left: 2px solid var(--rule);
    white-space: pre-wrap
}

.lecture-citation-sidenote code {
    font-size: .72rem;
    line-height: 1.25
}

.lecture-rail {
    position: fixed;
    top: var(--page-top);
    left: var(--rail-left);
    bottom: 24px;
    width: 270px;
    padding: .2rem 0 1rem;
    border-left: 1px solid var(--rule);
    font-size: .84rem;
    line-height: 1.25;
    overflow-y: auto;
    scrollbar-width: thin
}

.lecture-rail-course {
    margin: 0 0 .7rem;
    padding: 0 .3rem .75rem .75rem;
    border-bottom: 1px solid var(--rule)
}

.lecture-rail .course-event {
    display: block;
    margin: 0 0 .28rem;
    padding: 0;
    color: var(--brown);
    background: transparent;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase
}

.lecture-rail .course-event:hover {
    padding: 0;
    color: var(--brown);
    background: transparent;
    text-decoration: none
}

.lecture-rail-course .course-title {
    color: var(--ink);
    font-size: .84rem;
    line-height: 1.25
}

.lecture-rail-course .course-authors {
    margin-top: .28rem;
    color: var(--muted);
    font-size: .76rem;
    line-height: 1.28
}

.lecture-rail-heading {
    margin: .1rem 0 .35rem;
    padding: 0 .3rem 0 .75rem;
    color: var(--ink);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase
}

.lecture-rail-section-heading {
    margin-top: .85rem;
    padding-top: .7rem;
    border-top: 1px solid var(--rule);
    color: var(--muted)
}

.lecture-rail a {
    display: block;
    padding: .32rem .3rem .32rem .75rem;
    color: var(--muted)
}

.lecture-rail a:hover {
    color: var(--ink);
    text-decoration: none
}

.lecture-rail-link span {
    display: inline-block;
    width: 1.45rem;
    color: var(--muted);
    font-variant-numeric: tabular-nums
}

.lecture-rail-link.is-current {
    color: var(--ink);
    font-weight: 700;
    background: var(--brown-soft);
    border-left: 6px solid var(--brown);
    margin-left: -5px
}

.lecture-section-link {
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr);
    column-gap: .4rem;
    align-items: baseline;
    font-size: .78rem
}

.lecture-section-no {
    color: var(--muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.lecture-section-title {
    min-width: 0
}

.lecture-section-l2 {
    padding-left: 1.25rem !important
}

.lecture-section-l3 {
    padding-left: 1.75rem !important;
    font-size: .74rem
}

.lecture-section-link.is-active {
    color: var(--ink);
    font-weight: 700;
    background: var(--accent-soft);
    border-left: 6px solid var(--accent);
    margin-left: -5px
}

.page-shell {
    max-width: 780px;
    margin: 0 auto;
    padding: var(--page-top) 24px 64px;
    position: relative
}

.lecture-content {
    counter-reset: algorithm
}

.lecture-kicker {
    margin: 0 0 .25rem;
    margin-block-start: 0;
    color: var(--brown);
    font-size: .86rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase
}

.lecture-title,
.lecture-content .lecture-title {
    display: inline-block;
    max-width: 100%;
    margin: 0 0 1.85rem;
    padding-bottom: .32rem;
    border-bottom: 4px solid #000;
    font-size: 2.65rem;
    line-height: 1.06;
    letter-spacing: 0
}

.lecture-content .lecture-title::before {
    content: none
}

.lecture-metadata {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 2.5rem;
    margin: -.4rem 0 1.8rem;
    padding-bottom: 1.3rem;
    border-bottom: 1px solid var(--rule);
    font-family: var(--sans);
    font-synthesis: none;
    line-height: 1.4
}

.lecture-metadata-label {
    display: block;
    margin-bottom: .3rem;
    color: var(--muted);
    font-size: .65rem;
    letter-spacing: .09em;
    text-transform: uppercase
}

.lecture-metadata .lecture-instructor,
.lecture-metadata .lecture-date {
    margin: 0;
    font-size: .95rem
}

.lecture-metadata .lecture-date {
    color: var(--muted)
}

.toc {
    margin: 0 0 2rem;
    padding: .85rem 1rem;
    background: #fffdf9;
    border: 1px solid var(--rule);
    font-size: .95rem
}

.toc ol {
    margin: 0;
    padding-left: 0;
    list-style: none
}

.toc li {
    margin: .12rem 0
}

.toc a {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    column-gap: .5rem;
    align-items: baseline
}

.toc .toc-l1 {
    margin-left: 0
}

.toc .toc-l2 {
    margin-left: 1.1rem
}

.toc .toc-l3 {
    margin-left: 2.2rem;
    font-size: .92em
}

.toc-no {
    color: var(--muted);
    font-variant-numeric: tabular-nums;
    text-align: left
}

.toc-title {
    min-width: 0
}

.lecture-content h1,
.lecture-content h2,
.lecture-content h3,
.lecture-content h4 {
    line-height: 1.18;
    letter-spacing: 0
}

.lecture-content h1,
.lecture-content h2,
.lecture-content h3 {
    position: relative
}

.lecture-content h1::before,
.lecture-content h2::before,
.lecture-content h3::before {
    content: "";
    position: absolute;
    left: -1.05rem;
    top: .18em;
    bottom: .16em;
    width: 4px;
    background: #bdb7ad
}

.lecture-content h2::before {
    width: 3px;
    background: #c8c2b9
}

.lecture-content h3::before {
    width: 2px;
    background: #d1cbc3
}

.lecture-content h1 {
    margin: 2.2rem 0 .8rem;
    padding-top: .15rem;
    font-size: 1.75rem
}

.lecture-content h2 {
    margin: 2rem 0 .65rem;
    font-size: 1.38rem
}

.lecture-content h3 {
    margin: 1.55rem 0 .45rem;
    font-size: 1.12rem
}

.lecture-content .secno {
    color: var(--muted);
    font-weight: 400
}

.lecture-content .secno::after {
    content: " "
}

.lecture-content p {
    margin: .72rem 0
}

.lecture-content p.lecture-kicker {
    margin: 0 0 .25rem
}

.lecture-content ul,
.lecture-content ol {
    padding-left: 1.35rem
}

.lecture-content li {
    margin: .25rem 0
}

code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    font-size: .92em
}

.env {
    margin: 1.1rem 0;
    padding: .42rem .85rem;
    border: 1px solid #d8d8d8;
    border-radius: 3px
}

.env.statement {
    --sidenote-inset: calc(.85rem + 1px);
    background: var(--block)
}

.env.proof {
    background: transparent;
    border: 0;
    border-left: 1.5px solid #a8a098;
    border-radius: 0;
    padding: .16rem 0 .16rem .85rem
}

.env-heading {
    margin: .15rem 0 .35rem
}

.env.statement>.env-heading,
.env.proof>.env-heading {
    display: inline;
    margin: 0 .25em 0 0
}

.env.statement>.env-body,
.env.proof>.env-body {
    display: contents
}

.env.statement>.env-body>p:first-child,
.env.proof>.env-body>p:first-child {
    display: inline;
    margin: 0
}

.env.statement>.env-body>p:first-child+*,
.env.proof>.env-body>p:first-child+* {
    margin-top: .65rem
}

.env-title,
.env-title strong {
    font-weight: var(--environment-label-weight);
    font-synthesis: none
}

.env-heading .env-title {
    display: inline;
    white-space: normal
}

.env-heading .env-title-numbered {
    font-size: 0
}

.env-heading .env-title-numbered>* {
    font-size: 1.125rem
}

.env-heading .env-kind,
.env-heading .env-number,
.env-heading .env-extra,
.env-heading .env-punct {
    display: inline
}

.env-heading .env-number {
    margin-left: .28em
}

.env-heading .env-extra {
    margin-left: .36em
}

.env-body>:first-child {
    margin-top: 0
}

.env-body>:last-child {
    margin-bottom: 0
}

.env.statement:has(.placed-figure-right[style*="--place-dy:-"]) .env-body p:not(.env-heading) {
    max-width: 66%
}

.env.proof .env-title {
    font-family: var(--sans);
    font-style: normal;
    font-weight: var(--environment-label-weight)
}

.env.algorithm {
    --algorithm-rule: 2.25px solid #111;
    --algorithm-midrule: 1.25px solid #1f1f1f;
    counter-increment: algorithm;
    padding: .15rem 0 .45rem;
    background: transparent;
    border: 0;
    border-radius: 0
}

.env.algorithm .env-title {
    margin: 0 0 .45rem;
    padding: .38rem 0 .42rem;
    border-top: var(--algorithm-rule);
    border-bottom: var(--algorithm-midrule);
    font-size: .98em;
    font-weight: 400;
    line-height: 1.28;
    text-align: left
}

/* Superscripts must not change the title row's height or baseline. */
.env.algorithm .env-title sup {
    line-height: 0;
    vertical-align: baseline;
    position: relative;
    top: -.5em
}

.env.algorithm .env-title strong {
    font-weight: 400
}

.env.algorithm .env-title::before {
    content: "Algorithm " counter(algorithm) ". ";
    margin-right: .25rem;
    font-family: "Frutiger Notes", var(--serif);
    font-weight: var(--environment-label-weight)
}

.env.algorithm .env-title>strong:first-child {
    display: none
}

.pseudocode {
    --pseudo-indent: 1.42rem;
    --pseudo-number-width: 2.4ch;
    --pseudo-number-gap: .55rem;
    --pseudo-gutter: calc(var(--pseudo-number-width) + var(--pseudo-number-gap));
    --pseudo-stroke: #252525;
    margin: .1rem 0 0;
    padding: .12rem 0 .08rem;
    border-bottom: var(--algorithm-rule);
    font-size: .94em;
    line-height: 1.36;
    text-align: left
}

.pseudo-number {
    grid-column: 1;
    grid-row: 1;
    color: #666;
    font-size: .85em;
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap
}

.pseudo-unnumbered {
    --pseudo-number-width: 0px;
    --pseudo-number-gap: 0px
}

/* Preserve large mathematical tables without widening the whole page. */
.lecture-content table:not(.bibliography-table) {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
    text-align: left
}

.lecture-content table:not(.bibliography-table) :is(th, td) {
    padding: .45rem .6rem;
    text-align: left;
    vertical-align: top
}

.lecture-content table:not(.bibliography-table) th {
    border-bottom: 1px solid var(--rule)
}

.lecture-content .table-centered table :is(th, td) {
    text-align: center;
    vertical-align: middle
}

.lecture-content .table-centered table {
    width: max-content;
    margin-inline: auto
}

.lecture-table {
    position: relative;
    max-width: 100%;
    overflow-x: auto;
    margin: .75rem 0
}

/* Compact table rows cannot accommodate full references in their margins.
   Their inline citation links lead to the complete lecture bibliography. */
.lecture-table .citation-note {
    display: none
}

.lecture-table.has-overflow::after {
    content: "Scroll horizontally to see the full table →";
    display: block;
    margin-top: .35rem;
    color: var(--muted);
    font-size: .78rem;
    text-align: left
}

.lecture-content .lecture-table .equation {
    width: max-content;
    max-width: none;
    overflow: visible
}

.lecture-content .lecture-table .equation-line {
    display: flex;
    width: max-content;
    gap: .5rem
}

.lecture-content .lecture-table .equation-aligned .equation-line {
    display: contents
}

.lecture-content .wrapped-figure .equation {
    width: 100%;
    max-width: 100%;
    overflow-x: auto
}

.pseudo-line {
    display: grid;
    grid-template-columns: var(--pseudo-number-width) minmax(0, 1fr);
    column-gap: var(--pseudo-number-gap);
    align-items: first baseline;
    position: relative;
    margin: 0;
    min-height: 1.32em;
    padding-top: .11rem;
    padding-bottom: .11rem
}

.pseudo-text {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    max-width: 100%;
    padding-left: calc(var(--indent) * var(--pseudo-indent));
    text-indent: 0;
    overflow-wrap: break-word
}

.pseudo-text > p {
    margin: 0;
    text-indent: 0
}

.pseudo-text strong {
    font-weight: 700
}

.pseudo-text .equation {
    margin: .16rem 0;
    padding-left: var(--pseudo-indent);
    padding-right: 0;
    overflow-x: auto
}

.pseudo-text .equation::before,
.pseudo-text .equation::after {
    content: "";
    position: absolute;
    left: calc(.48 * var(--pseudo-indent) - .18rem);
    border-color: var(--pseudo-stroke)
}

.pseudo-text .equation::before {
    top: -.12rem;
    bottom: .58em;
    border-left: 1.25px solid var(--pseudo-stroke)
}

.pseudo-text .equation::after {
    bottom: .58em;
    width: .48rem;
    border-bottom: 1.25px solid var(--pseudo-stroke)
}

.pseudo-text .equation-line {
    grid-template-columns: minmax(0, 1fr)
}

.pseudo-text .equation-math {
    grid-column: 1
}

.pseudo-line>p {
    display: contents;
    margin: 0
}

.pseudo-guide {
    position: absolute;
    top: -.12rem;
    bottom: -.12rem;
    left: calc(var(--pseudo-gutter) + (var(--guide) - .52) * var(--pseudo-indent));
    border-left: 1.25px solid var(--pseudo-stroke)
}

.pseudo-guide-end {
    bottom: .58em
}

.pseudo-guide-end::after {
    content: "";
    position: absolute;
    left: -1.25px;
    bottom: 0;
    width: .48rem;
    border-bottom: 1.25px solid var(--pseudo-stroke)
}

.equation {
    box-sizing: border-box;
    position: relative;
    margin: 1rem 0;
    overflow-x: auto;
    /* Keep small KaTeX height overflows from catching vertical page scrolls. */
    overflow-y: hidden;
    padding-right: 0;
    text-align: center
}

.equation.is-overwide {
    clear: right
}

.equation-line {
    display: grid;
    grid-template-columns: minmax(0, 3.5rem) minmax(0, 1fr) minmax(3.5rem, max-content);
    align-items: center;
    column-gap: .35rem;
    width: 100%
}

.equation-line+.equation-line {
    margin-top: .35rem
}

.equation-aligned {
    display: grid;
    --equation-align-gutter: .28rem;
    grid-template-columns: minmax(0, 1fr) max-content max-content minmax(0, 1fr) minmax(0, max-content);
    align-items: center;
    column-gap: var(--equation-align-gutter);
    row-gap: .35rem
}

.equation-aligned .equation-line {
    display: contents
}

.equation-aligned .equation-line+.equation-line {
    margin-top: 0
}

.equation-math {
    grid-column: 2;
    justify-self: center;
    min-width: max-content;
    line-height: 0
}

.equation-align-left {
    grid-column: 2;
    justify-self: end;
    min-width: 0;
    line-height: 0
}

.equation-align-right {
    grid-column: 3;
    justify-self: start;
    min-width: max-content;
    line-height: 0
}

.equation-align-full {
    grid-column: 1 / 5;
    justify-self: center;
    min-width: max-content;
    line-height: 0
}

.equation .eqno {
    grid-column: 3;
    justify-self: end;
    color: var(--muted);
    font-size: .95em;
    font-variant-numeric: tabular-nums;
    line-height: 1
}

.equation-aligned .eqno {
    grid-column: 5;
    align-self: center
}

.equation .typst-frame {
    display: inline-block;
    max-width: none;
    height: auto;
    vertical-align: middle
}

span[role="math"] {
    display: inline-block;
    max-width: 100%;
    line-height: 1;
    vertical-align: -.12em
}

span[role="math"] .typst-frame {
    display: inline-block;
    max-width: 100%;
    height: auto
}

.math-katex-source {
    display: inline;
    line-height: normal;
    vertical-align: baseline
}

span[role="math"].math-katex-source {
    max-width: none;
    vertical-align: baseline
}

.math-katex-source .katex {
    font-size: 1.15em;
    vertical-align: baseline
}

.equation .math-katex-source {
    display: inline-block;
    line-height: 1.15;
    vertical-align: middle
}

.equation .katex-display {
    margin: .25rem 0
}

.rendered-figure,
.lecture-content figure.typst {
    position: relative;
    margin: 1.25rem 0;
    text-align: center
}

.rendered-figure svg:not(.katex svg),
.rendered-figure img,
.lecture-content figure.typst svg:not(.katex svg),
.lecture-content figure.typst img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto
}

.placed-figure {
    float: right;
    clear: right;
    width: min(34%, 260px);
    margin: var(--place-dy, .15rem) 0 .9rem 1.1rem;
    text-align: center
}

.placed-figure-left {
    float: left;
    clear: left;
    margin: var(--place-dy, .15rem) 1.1rem .9rem 0
}

.placed-figure svg:not(.katex svg),
.placed-figure img,
.placed-figure .typst-frame {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto
}

.html-stack {
    display: flex;
    flex-direction: column;
    gap: .8rem;
    margin: 1rem 0
}

.html-stack-row {
    flex-direction: row;
    align-items: center;
    justify-content: space-between
}

.html-stack-item {
    min-width: 0
}

.html-stack-row>.html-stack-item {
    flex: 1 1 0
}

.html-stack-row>.html-stack-item:has(.placed-figure) {
    flex: 0 1 34%
}

.html-stack .placed-figure {
    float: none;
    clear: none;
    width: auto;
    margin: 0
}

.wrapped-figure {
    display: grid;
    position: relative;
    grid-template-columns: minmax(0, calc(var(--text-width, 65%) - .6rem)) minmax(0, 1fr);
    gap: 1.2rem;
    align-items: center;
    margin: 1rem 0
}

.wrapped-figure-left {
    grid-template-columns: minmax(0, 1fr) minmax(0, calc(var(--text-width, 65%) - .6rem))
}

.wrapped-figure:has(> .wrapped-figure-text .algorithm):has(> .wrapped-figure-media .algorithm) {
    align-items: start
}

.wrapped-figure-left .wrapped-figure-media {
    grid-column: 1;
    grid-row: 1
}

.wrapped-figure-left .wrapped-figure-text {
    grid-column: 2
}

.wrapped-figure-text,
.wrapped-figure-media {
    min-width: 0
}

.wrapped-figure-media > :first-child,
.wrapped-figure-text > :first-child {
    margin-top: 0
}

.wrapped-figure-media > :last-child,
.wrapped-figure-text > :last-child {
    margin-bottom: 0
}

.wrapped-figure-media svg:not(.katex svg),
.wrapped-figure-media img,
.wrapped-figure-media .typst-frame {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto
}

.lecture-image {
    display: inline-block;
    max-width: 100%;
    vertical-align: middle;
    line-height: 0
}

.lecture-image svg {
    display: block;
    max-width: 100%;
    height: auto !important
}

.media-alignment {
    margin: 1rem 0
}

.wrapped-figure .citation-wrap {
    position: static
}

.wrapped-figure .citation-note,
.wrapped-figure .footnote {
    position: absolute;
    float: none;
    left: calc(100% + 24px + var(--sidenote-inset, 0px) + var(--sidenote-quote-inset, 0px));
    margin: 0
}

figcaption {
    margin-top: .5rem;
    color: var(--ink);
    text-align: left
}

figcaption .figcaption-label {
    color: var(--ink);
    font-family: "Frutiger Notes", var(--serif);
    font-weight: var(--environment-label-weight)
}

.typst-frame {
    max-width: 100%;
    height: auto
}

.callout {
    margin: 1rem 0;
    padding: .72rem .95rem .78rem;
    border: 1px solid var(--rule);
    border-left: 3px solid var(--rule);
    background: var(--soft);
    line-height: 1.48
}

.callout-info {
    border-left-color: #4f86a8;
    background: #eef6fb
}

.callout-warning {
    border-left-color: #c47a2c;
    background: #fff3dd
}

.callout-highlight {
    border-left-color: #b59b45;
    background: #f7f1df
}

.callout-title {
    margin: 0 0 .35rem;
    color: var(--ink);
    font-family: "Frutiger Notes", var(--serif);
    font-weight: 700
}

.callout-body>*:first-child {
    margin-top: 0
}

.callout-body>*:last-child {
    margin-bottom: 0
}

.special-comment {
    margin: 1rem 0;
    padding: .55rem .8rem .65rem 1rem;
    border-left: 3px solid var(--rule);
    background: #fffdf9;
    color: var(--muted);
    font-size: .94rem
}

.special-comment::before {
    content: "\25B8";
    margin-right: .35rem;
    color: var(--muted)
}

.special-comment-text {
    display: inline
}

.special-comment-figure {
    display: block;
    max-width: 100%;
    margin: .55rem auto 0;
    text-align: center
}

.special-comment-figure .typst-frame {
    display: inline-block;
    max-width: 100%
}

.figure-body .typst-frame {
    display: block;
    max-width: 100%;
    margin: 0 auto
}

.figure-body .html-image {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto
}

.footnote-ref {
    font-size: .68em;
    line-height: 0;
    vertical-align: super
}

.footnote-ref a {
    color: var(--accent);
    text-decoration: none
}

.footnote {
    float: right;
    clear: right;
    width: 210px;
    margin: .2rem calc(-234px - var(--sidenote-inset, 0px) - var(--sidenote-quote-inset, 0px)) .7rem calc(24px + var(--sidenote-inset, 0px) + var(--sidenote-quote-inset, 0px));
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.35;
    text-align: left
}

.footnote-num {
    font-size: .78em;
    line-height: 0;
    vertical-align: super;
    margin-right: .3em;
    color: var(--accent)
}

.bibliography,
.endnotes {
    margin-top: 2.5rem;
    padding-top: .75rem;
    border-top: 1px solid var(--rule)
}

.bibliography {
    font-size: 1rem
}

.endnotes {
    display: none;
    font-size: .92rem
}

.bibliography h1,
.endnotes h1 {
    border-top: 0;
    margin-top: 0
}

.bibliography ol {
    list-style: none;
    margin: 0;
    padding: 0
}

.bibliography-table {
    border-collapse: collapse;
    width: 100%;
    table-layout: fixed;
    overflow-wrap: anywhere
}

.bibliography-table code {
    white-space: normal;
    overflow-wrap: anywhere
}

.bibliography-table td {
    padding: .34rem 0;
    vertical-align: baseline
}

.bibliography-table .bib-key {
    width: 5.4rem;
    padding-right: .7rem;
    white-space: nowrap
}

.bibliography li {
    display: grid;
    grid-template-columns: 5.4rem minmax(0, 1fr);
    column-gap: .7rem;
    align-items: baseline;
    margin: .58rem 0;
    padding-left: 0;
    text-indent: 0
}

.endnotes p {
    display: grid;
    grid-template-columns: 1.75rem minmax(0, 1fr);
    column-gap: .4rem;
    align-items: baseline;
    margin: .58rem 0;
    padding-left: 0;
    text-indent: 0
}

.footnote-backref {
    display: inline-block;
    font-variant-numeric: tabular-nums;
    text-align: right
}

.footnote-backref::after {
    content: ".";
    color: var(--muted)
}

.footnote-body,
.bib-entry {
    min-width: 0
}

.bibliography li> :not(.prefix) {
    min-width: 0
}

.bib-math {
    font-family: var(--serif)
}

.bib-key,
.bibliography .prefix {
    color: var(--ink);
    font-size: 1em;
    font-variant-numeric: tabular-nums;
    text-align: left
}

.bib-key a,
.bibliography .prefix a {
    color: inherit;
    text-decoration: none
}

mark {
    background: #fff1a8;
    padding: 0 .15em
}

.todo {
    background: #ffd39a;
    color: #4a2500;
    border-radius: 2px
}

@media(max-width:1220px) {

    .citation-note,
    .footnote,
    .course-sidenote {
        display: none
    }

    .lecture-citation-sidenote {
        float: none;
        clear: both;
        width: auto;
        margin: .75rem 0 2rem;
        color: var(--muted);
        font-size: .78rem
    }

    .lecture-citation-sidenote pre {
        max-width: 100%
    }

    .lecture-citation-sidenote code {
        font-size: .76rem
    }

    .endnotes {
        display: block
    }

    .footnote-ref {
        margin-right: .1em
    }
}

@media(min-width:1260px) {
    .equation.is-overwide {
        width: calc(100% + 234px);
        max-width: calc(100vw - 48px);
        overflow-x: auto
    }

    .equation.is-overwide.equation-aligned {
        justify-content: start
    }

    .rendered-figure figcaption {
        position: absolute;
        top: .2rem;
        left: calc(100% + 24px);
        width: 210px;
        margin-top: 0;
        color: var(--muted);
        font-family: var(--serif);
        font-size: .78rem;
        line-height: 1.35;
        text-align: left
    }

    .env.statement .rendered-figure figcaption,
    .env.statement figure.typst figcaption,
    .env.proof .rendered-figure figcaption,
    .env.proof figure.typst figcaption {
        top: .2rem;
        left: calc(100% + 24px + .85rem + 1px)
    }
}

@media(max-width:1259px) {
    .equation.is-overwide {
        overflow-x: auto;
        padding-right: 0
    }

    .equation.is-overwide .equation-line {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: .5rem;
        width: max-content;
        min-width: 100%
    }

    .equation.is-overwide .equation-math,
    .equation.is-overwide .typst-frame {
        flex: 0 0 auto
    }

    .equation.is-overwide .eqno {
        flex: 0 0 auto;
        padding-left: .35rem
    }

    .equation.is-overwide.equation-aligned {
        width: 100%;
        max-width: 100%;
        min-width: 0
    }

    .equation.is-overwide.equation-aligned .equation-line {
        display: contents;
        width: auto;
        min-width: 0
    }

    .equation.is-overwide.equation-aligned .eqno {
        padding-left: 0
    }
}

@media(min-width:1401px) {
    .compact-course-nav {
        display: none
    }

    .toc {
        display: none
    }
}

@media(max-width:1400px) {
    .compact-course-nav {
        margin-bottom: 1.3rem;
        font: 600 .85rem var(--heading-font, sans-serif)
    }

    .lecture-rail {
        display: none
    }
}

@media(max-width:900px) {

    .lecture-content h1::before,
    .lecture-content h2::before,
    .lecture-content h3::before {
        display: none
    }

    .placed-figure,
    .placed-figure-left {
        float: none;
        clear: both;
        width: auto;
        margin: 1rem 0;
        text-align: center
    }

    .env.statement:has(.placed-figure-right[style*="--place-dy:-"]) .env-body p:not(.env-heading) {
        max-width: none
    }

    .html-stack-row {
        flex-direction: column;
        align-items: stretch
    }

    .html-stack-row>.html-stack-item,
    .html-stack-row>.html-stack-item:has(.placed-figure) {
        flex: 1 1 auto
    }

}

@media(max-width:640px) {
    .wrapped-figure,
    .wrapped-figure-left {
        display: flex;
        flex-direction: column;
        align-items: stretch
    }

    .wrapped-figure-media {
        text-align: center
    }

    body {
        font-size: 1.03125rem
    }

    .site-masthead,
    .page-shell {
        padding-left: 17px;
        padding-right: 17px
    }

    .lecture-title,
    .lecture-content .lecture-title {
        font-size: 2.12rem;
        line-height: 1.08
    }
}
