@charset "UTF-8";

@import "https://rsms.me/inter/inter.css";

@import "https://cdn.jsdelivr.net/gh/tonsky/FiraCode@1.207/distr/fira_code.css";

@font-face {
    font-family:"CMU Typewriter Text";
    src:url(../font/cmuntt.ttf);
    font-weight:400;
    font-style:normal;
    font-display:swap
}

@font-face {
    font-family:"CMU Concrete";
    src:url(../font/cmunorm.ttf);
    font-weight:400;
    font-style:normal;
    font-display:swap
}

@font-face {
    font-family:"CMU Concrete";
    src:url(../font/cmunobx.ttf);
    font-weight:700;
    font-style:normal;
    font-display:swap
}

html {
    font-family:'Inter',sans-serif
}

body {
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px;
    width:87.5%;
    margin-left:auto;
    margin-right:auto;
    padding-left:12.5%;
    font-family:inherit;
    background-color:#fffff8;
    color:#111;
    max-width:1400px;
    counter-reset:sidenote-counter
}

h1 {
    font-weight:400;
    margin-top:4rem;
    margin-bottom:1.5rem;
    font-size:2.3rem;
    line-height:1
}

h2 {
    font-weight:400;
    margin-top:2.1rem;
    margin-bottom:1.4rem;
    font-size:2rem;
    line-height:1
}

h3 {
    font-weight:400;
    font-size:1.7rem;
    margin-top:2rem;
    margin-bottom:1.4rem;
    line-height:1
}

hr {
    display:block;
    height:1px;
    width:55%;
    border:0;
    border-top:1px solid #ccc;
    margin:1em 0;
    padding:0
}

p.subtitle {
    margin-top:1rem;
    margin-bottom:1rem;
    font-size:1.1rem;
    display:block;
    line-height:1
}

.danger {
    color:red
}

article {
    padding:5rem 0
}

section {
    padding-top:1rem;
    padding-bottom:1rem
}

p,ol,ul {
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px
}

p {
    margin-top:1.4rem;
    margin-bottom:1.4rem;
    padding-right:0;
    vertical-align:baseline
}

div.epigraph {
    margin:5em 0
}

div.epigraph > blockquote {
    margin-top:3em;
    margin-bottom:3em
}

div.epigraph > blockquote,div.epigraph > blockquote > p {
    font-style: normal;
}

div.epigraph > blockquote > footer {
    font-style:normal;
}

div.epigraph > blockquote > footer > cite {
    font-style:italic
}

blockquote {
    font-size:18px;
    letter-spacing:-.014em;
    line-height:25px;
}

blockquote p {
    width:55%;
    margin-right:40px;
    font-size: 18px;
}

blockquote footer {
    width:55%;
    font-size:1.1rem;
    text-align:right;
}

section > p,section > footer,section > table {
    width:55%
}

section > ol,section > ul {
    width:50%;
    -webkit-padding-start:5%
}

li:not(:first-child) {
    margin-top:.25rem
}

figure {
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline;
    max-width:55%;
    -webkit-margin-start:0;
    -webkit-margin-end:0;
    margin:0 0 3em
}

figcaption {
    float:right;
    clear:right;
    margin-top:0;
    margin-bottom:0;
    vertical-align:baseline;
    position:relative;
    max-width:40%;
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px
}

figure.fullwidth figcaption {
    margin-right:24%
}

a:link,a:visited {
    color:inherit
}

a:link::selection,a:link::-moz-selection {
    text-shadow:.03em 0 #b4d5fe,-.03em 0 #b4d5fe,0 .03em #b4d5fe,0 -.03em #b4d5fe,.06em 0 #b4d5fe,-.06em 0 #b4d5fe,.09em 0 #b4d5fe,-.09em 0 #b4d5fe,.12em 0 #b4d5fe,-.12em 0 #b4d5fe,.15em 0 #b4d5fe,-.15em 0 #b4d5fe;
    background:#b4d5fe
}

img {
    max-width:100%
}

.sidenote,.marginnote {
    float:right;
    clear:right;
    margin-right:-60%;
    width:50%;
    margin-top:0;
    margin-bottom:0;
    vertical-align:baseline;
    position:relative;
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px
}

.sidenote-number {
    counter-increment:sidenote-counter
}

.sidenote-number:after,.sidenote:before {
    font-family:inherit;
    position:relative;
    vertical-align:baseline
}

.sidenote-number:after {
    content:counter(sidenote-counter);
    font-size:inherit;
    top:-.5rem;
    left:.1rem
}

.sidenote:before {
    content:counter(sidenote-counter) " ";
    font-family:inherit;
    font-size:inherit;
    top:-.5rem
}

blockquote .sidenote,blockquote .marginnote {
    margin-right:-82%;
    min-width:59%;
    text-align:left
}

div.fullwidth,table.fullwidth {
    width:100%
}

div.table-wrapper {
    overflow-x:auto
}

.sans {
    font-family:"Inter",sans-serif
}

code,pre > code {
    font-family:"Fira Code","Consolas","Liberation Mono",Menlo,Courier,monospace;
    -webkit-text-size-adjust:100%;
    font-size:14px;
    letter-spacing:-.011em;
    line-height:22px
}

.sans > code {
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px
}

h1 > code,h2 > code,h3 > code {
    font-size:.8em
}

.marginnote > code,.sidenote > code {
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px
}

pre > code {
    width:52.5%;
    margin-left:2.5%;
    overflow-x:auto;
    display:block;
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px
}

pre.fullwidth > code {
    width:90%
}

.fullwidth {
    max-width:90%;
    clear:both
}

span.newthought {
    font-variant:small-caps;
    font-size:1.2em
}

input.margin-toggle {
    display:none
}

label.sidenote-number {
    display:inline
}

label.margin-toggle:not(.sidenote-number) {
    display:none
}

.iframe-wrapper {
    position:relative;
    padding-bottom:56.25%;
    padding-top:25px;
    height:0
}

.iframe-wrapper iframe {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%
}

@media (max-width: 760px) {
    body {
        width:84%;
        padding-left:8%;
        padding-right:8%
    }

    hr,section > p,section > footer,section > table {
        width:100%
    }

    pre > code {
        width:97%
    }

    section > ol {
        width:90%
    }

    section > ul {
        width:90%
    }

    figure {
        max-width:90%
    }

    figcaption,figure.fullwidth figcaption {
        margin-right:0;
        max-width:none
    }

    blockquote {
        margin-left:1.5em;
        margin-right:0
    }

    blockquote p,blockquote footer {
        width:100%
    }

    label.margin-toggle:not(.sidenote-number) {
        display:inline
    }

    .sidenote,.marginnote {
        display:none
    }

    .margin-toggle:checked + .sidenote,.margin-toggle:checked + .marginnote {
        display:block;
        float:left;
        left:1rem;
        clear:both;
        width:95%;
        margin:1rem 2.5%;
        vertical-align:baseline;
        position:relative
    }

    label {
        cursor:pointer
    }

    div.table-wrapper,table {
        width:85%
    }

    img {
        width:100%
    }
}

ul {
    list-style-type:square
}

div.epigraph > blockquote > p {
    font-family:"CMU Typewriter Text",monospace;
    font-style:normal
    font-size: 18px;
}

blockquote,blockquote > p {
    font-family:"CMU Typewriter Text",monospace
}

blockquote cite::before {
    content:'\2014  ';
}

cite {
    font-style:normal
}

pre {
    background:rgba(255,255,248,1);
    width:unset
}

pre > code {
    margin-left:2.5%;
    font-family:"Fira Code",monospace;
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px
}

code {
    font-family:"Fira Code",monospace;
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px
}

header > h1,header > h2,header > h3 {
    font-family:"CMU Concrete";
    font-weight:700;
    width:87.5%
}

h1,h2,h3 {
    font-family:"CMU Concrete";
    font-style:normal;
    font-weight:400
}

address {
    font-style:normal
}

address > p {
    display:block;
    font-size:14px;
    letter-spacing:-.006em;
    line-height:20px;
    font-style:normal
}

address > p a {
    display:inline-block
}

nav#TOC ul li {
    font-family:"Inter",sans-serif;
    font-weight:400;
    font-style:normal
}

nav#essays ul {
    max-width: 40%;
}

.numeral {
    font-family:"CMU Concrete",serif
}
