::-webkit-scrollbar {
 width:8px;
 height:8px;
 background:#212020
}
::-webkit-scrollbar-thumb {
 background:#888
}
::-webkit-scrollbar-thumb:hover {
 background:#dcdcdc
}
html {
 line-height:1.15;
 -webkit-text-size-adjust:100%
}
.franklin-content { 
  padding-left: 5%;
  text-align: left
}
body {
 margin:0
}
main {
 display:block
}
h1 {
 font-size:2em;
 margin:.67em 0
}
hr {
 box-sizing:content-box;
 height:0;
 overflow:visible
}
pre {
 font-family:JuliaMono,monospace,monospace;
 font-display:auto;
 font-size:1em
}
a {
 background-color:transparent
}
abbr[title] {
 border-bottom:none;
 text-decoration:underline;
 text-decoration:underline dotted
}
b,
strong {
 font-weight:bolder
}
code,
kbd,
samp {
 font-family:monospace,monospace;
 font-display:auto;
 font-size:1em
}
small {
 font-size:80%
}
sub,
sup {
 font-size:75%;
 line-height:0;
 position:relative;
 vertical-align:baseline
}
sub {
 bottom:-.25em
}
sup {
 top:-.5em
}
img {
 border-style:none
}
button,
input,
optgroup,
select,
textarea {
 font-family:inherit;
 font-display:auto;
 font-size:100%;
 line-height:1.15;
 margin:0
}
button,
input {
 overflow:visible
}
button,
select {
 text-transform:none
}
button,
[type=button],
[type=reset],
[type=submit] {
 -webkit-appearance:button
}
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
 border-style:none;
 padding:0
}
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
 outline:1px dotted ButtonText
}
fieldset {
 padding:.35em .75em .625em
}
legend {
 box-sizing:border-box;
 color:inherit;
 display:table;
 max-width:100%;
 padding:0;
 white-space:normal
}
progress {
 vertical-align:baseline
}
textarea {
 overflow:auto
}
[type=checkbox],
[type=radio] {
 box-sizing:border-box;
 padding:0
}
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
 height:auto
}
[type=search] {
 -webkit-appearance:textfield;
 outline-offset:-2px
}
[type=search]::-webkit-search-decoration {
 -webkit-appearance:none
}
::-webkit-file-upload-button {
 -webkit-appearance:button;
 font:inherit
}
details {
 display:block
}
summary {
 display:list-item
}
template {
 display:none
}
[hidden] {
 display:none
}
code[class*=language-],
pre[class*=language-] {
 color:#ccc;
 background:0 0;
 font-family:JuliaMono,Consolas,Monaco,andale mono,ubuntu mono,monospace;
 font-display:auto;
 text-align:left;
 white-space:pre;
 word-spacing:normal;
 word-break:normal;
 word-wrap:normal;
 line-height:1.5;
 -moz-tab-size:4;
 -o-tab-size:4;
 tab-size:4;
 -webkit-hyphens:none;
 -moz-hyphens:none;
 -ms-hyphens:none;
 hyphens:none
}
pre[class*=language-] {
 padding:1em;
 margin:.5em 0;
 overflow:auto
}
:not(pre)>code[class*=language-],
pre[class*=language-] {
 background:#2d2d2d
}
:not(pre)>code[class*=language-] {
 padding:.1em;
 border-radius:.3em;
 white-space:normal
}
.token.comment,
.token.block-comment,
.token.prolog,
.token.doctype,
.token.cdata {
 color:#999
}
.token.punctuation {
 color:#ccc
}
.token.tag,
.token.attr-name,
.token.namespace,
.token.deleted {
 color:#e2777a
}
.token.function-name {
 color:#6196cc
}
.token.boolean,
.token.number,
.token.function {
 color:#f08d49
}
.token.property,
.token.class-name,
.token.constant,
.token.symbol {
 color:#f8c555
}
.token.selector,
.token.important,
.token.atrule,
.token.keyword,
.token.builtin {
 color:#cc99cd
}
.token.string,
.token.char,
.token.attr-value,
.token.regex,
.token.variable {
 color:#7ec699
}
.token.operator,
.token.entity,
.token.url {
 color:#67cdcc
}
.token.important,
.token.bold {
 font-weight:700
}
.token.italic {
 font-style:italic
}
.token.entity {
 cursor:help
}
.token.inserted {
 color:green
}
:root {
 --phoneWidth: (max-width: 684px);
 --tabletWidth: (max-width: 900px)
}
@font-face {
 font-family:inter ui;
 font-style:normal;
 font-display:auto;
 font-weight:400;
 src:url(../assets/fonts/Inter-UI-Regular.woff2) format("woff2"),
 url(../assets/fonts/Inter-UI-Regular.woff) format("woff")
}
@font-face {
 font-family:inter ui;
 font-style:italic;
 font-display:auto;
 font-weight:400;
 src:url(../assets/fonts/Inter-UI-Italic.woff2) format("woff2"),
 url(../assets/fonts/Inter-UI-Italic.woff) format("woff")
}
@font-face {
 font-family:inter ui;
 font-style:normal;
 font-display:auto;
 font-weight:600;
 src:url(../assets/fonts/Inter-UI-Medium.woff2) format("woff2"),
 url(../assets/fonts/Inter-UI-Medium.woff) format("woff")
}
@font-face {
 font-family:inter ui;
 font-style:italic;
 font-display:auto;
 font-weight:600;
 src:url(../assets/fonts/Inter-UI-MediumItalic.woff2) format("woff2"),
 url(../assets/fonts/Inter-UI-MediumItalic.woff) format("woff")
}
@font-face {
 font-family:inter ui;
 font-style:normal;
 font-display:auto;
 font-weight:800;
 src:url(../assets/fonts/Inter-UI-Bold.woff2) format("woff2"),
 url(../assets/fonts/Inter-UI-Bold.woff) format("woff")
}
@font-face {
 font-family:inter ui;
 font-style:italic;
 font-display:auto;
 font-weight:800;
 src:url(../assets/fonts/Inter-UI-BoldItalic.woff2) format("woff2"),
 url(../assets/fonts/Inter-UI-BoldItalic.woff) format("woff")
}

@font-face {
    font-family: JuliaMono;
    src: url("../assets/fonts/JuliaMono-RegularLatin.woff2") format("woff2");
    font-display: auto;
    font-weight: 400;
    unicode-range: U+00-7F; /* Basic Latin characters */
}

@font-face {
    font-family: JuliaMono;
    src: url("../assets/fonts/JuliaMono-BoldLatin.woff2") format("woff2");
    font-display: auto;
    font-weight: 700;
    unicode-range: U+00-7F; /* Basic Latin characters */
}

@font-face {
    font-family: JuliaMono;
    src: url("../assets/fonts/JuliaMono-Regular.woff2") format("woff2");
    font-display: auto;
    font-weight: 400;
}

@font-face {
    font-family: JuliaMono;
    src: url("../assets/fonts/JuliaMono-Bold.woff2") format("woff2");
    font-display: auto;
    font-weight: 700;
}

.button-container {
 display:table;
 margin-left:auto;
 margin-right:auto
}
button,
.button,
a.button {
 position:relative;
 display:flex;
 align-items:center;
 justify-content:center;
 padding:8px 18px;
 margin-bottom:5px;
 background:#eaeaea;
 text-decoration:none;
 text-align:center;
 font-weight:500;
 border-radius:8px;
 border:1px solid transparent;
 appearance:none;
 cursor:pointer;
 outline:none
}
.dark-theme button,
.dark-theme .button,
.dark-theme a.button {
 background:#3b3d42;
 color:inherit
}
button.outline,
.button.outline,
a.button.outline {
 background:transparent;
 border-color:#eaeaea;
 box-shadow:none;
 padding:8px 18px
}
.dark-theme button.outline,
.dark-theme .button.outline,
.dark-theme a.button.outline {
 border-color:#3b3d42;
 color:inherit
}
button.outline :hover,
.button.outline :hover,
a.button.outline :hover {
 transform:none;
 box-shadow:none
}
button.primary,
.button.primary,
a.button.primary {
 box-shadow:0 4px 6px rgba(50,50,93,.11),0 1px 3px rgba(0,0,0,.08)
}
button.primary:hover,
.button.primary:hover,
a.button.primary:hover {
 box-shadow:0 2px 6px rgba(50,50,93,.21),0 1px 3px rgba(0,0,0,.08)
}
button.link,
.button.link,
a.button.link {
 background:0 0;
 font-size:1rem
}
button.small,
.button.small,
a.button.small {
 font-size:.8rem
}
button.wide,
.button.wide,
a.button.wide {
 min-width:200px;
 padding:14px 24px
}
.code-toolbar {
 margin-bottom:20px
}
.code-toolbar .toolbar-item a {
 position:relative;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 padding:3px 8px;
 margin-bottom:5px;
 background:#eaeaea;
 text-decoration:none;
 text-align:center;
 font-size:13px;
 font-weight:500;
 border-radius:8px;
 border:1px solid transparent;
 appearance:none;
 cursor:pointer;
 outline:none
}
.dark-theme .code-toolbar .toolbar-item a {
 background:#3b3d42;
 color:inherit
}
.header {
 background:#fafafa;
 display:flex;
 align-items:center;
 justify-content:center;
 position:relative;
 padding:20px
}
.dark-theme .header {
 background:#252627;
}
.header__right {
 display:flex;
 flex-direction:row;
 align-items:center
}
@media(max-width:684px) {
 .header__right {
  flex-direction:row-reverse
 }
}
.header__inner {
 display:flex;
 align-items:center;
 justify-content:space-between;
 margin:0 auto;
 width:760px;
 max-width:100%
}
.theme-toggle {
 display:flex;
 align-items:center;
 justify-content:center;
 line-height:1;
 cursor:pointer
}
.theme-toggler {
 fill:currentColor
}
.unselectable {
 user-select:none;
 -webkit-user-select:none;
 -moz-user-select:none;
 -ms-user-select:none
}
.logo {
 display:flex;
 align-items:center;
 text-decoration:none;
 font-weight:700;
 font-display:auto;
 font-family:JuliaMono,monospace,monospace
}
.logo img {
 height:44px
}
.logo__mark {
 margin-right:5px
}
.logo__text {
 font-size:1.125rem
}
.logo__cursor {
 display:inline-block;
 width:10px;
 /*height:1rem;*/
 height:1.125rem;
 background:#39b54a;
 /*margin-left:5px;*/
 border-radius:1px;
 animation:cursor 1.5s infinite;
}
@media(prefers-reduced-motion:reduce) {
 .logo__cursor {
  animation:none
 }
}
@keyframes cursor {
 0% {
  opacity:0
 }
 50% {
  opacity:1
 }
 100% {
  opacity:0
 }
}
.menu {
 background:#fafafa;
 border-right:1px solid;
 margin-right:18px;
 z-index:9999
}
.dark-theme .menu {
 background:#252627
}
@media(max-width:684px) {
 .menu {
  position:absolute;
  top:50px;
  right:0;
  border:none;
  margin:0;
  padding:10px
 }
}
.menu__inner {
 display:flex;
 align-items:center;
 justify-content:flex-start;
 max-width:100%;
 margin:0 auto;
 padding:0 15px;
 /*font-size:1rem;*/
 font-size:1.125rem;
 font-family: JuliaMono, monospace, monospace;
 font-weight: 700;
 list-style:none
}
.menu__inner li {
 margin:0 12px
}
@media(max-width:684px) {
 .menu__inner {
  flex-direction:column;
  align-items:flex-start;
  padding:0
 }
 .menu__inner li {
  margin:0;
  padding:5px
 }
}
.menu-trigger {
 width:24px;
 height:24px;
 fill:currentColor;
 margin-left:10px;
 cursor:pointer
}
.menu a {
 display:inline-block;
 margin-right:15px;
 text-decoration:none
}
.menu a:hover {
 text-decoration:underline
}
.menu a:last-of-type {
 margin-right:0
}
html {
 box-sizing:border-box;
 line-height:1.6;
 letter-spacing:.06em;
 scroll-behavior:smooth
}
*,
*:before,
*:after {
 box-sizing:inherit
}
body {
 margin:0;
 padding:0;
 font-family:inter ui,-apple-system,BlinkMacSystemFont,roboto,segoe ui,Helvetica,Arial,sans-serif;
 font-display:auto;
 font-size:1rem;
 line-height:1.54;
 background-color:#fff;
 color:#222;
 text-rendering:optimizeLegibility;
 -webkit-font-smoothing:antialiased;
 /*font-feature-settings:"liga","tnum","case","calt","zero","ss01","locl";*/
 -webkit-overflow-scrolling:touch;
 -webkit-text-size-adjust:100%;
 display:flex;
 min-height:100vh;
 flex-direction:column
}
@media(max-width:684px) {
 body {
  font-size:1rem
 }
}
body.dark-theme {
 /* Original theme colors */
 background-color:#292a2d;
 /* color:#a9a9b3; */
 /* Adopted colors from Firefox reader view */
 /* background-color:#333; */
 color:#eee;
}
h2,
h3,
h4,
h5,
h6 {
 display:flex;
 align-items:center;
 line-height:1.3
}
h1 {
 font-size:2.625rem;
 margin:0 0 20px
}
h2 {
 font-size:1.625rem
}
h3 {
 font-size:1.375rem
}
h4 {
 font-size:1.125rem
}
@media(max-width:684px) {
 h1 {
  font-size:2rem
 }
 h2 {
  font-size:1.4rem
 }
 h3 {
  font-size:1.15rem
 }
 h4 {
  font-size:1.125rem
 }
}
a {
 color:inherit
}
img {
 display:block;
 max-width:100%
}
img.left {
 margin-right:auto
}
img.center {
 margin-left:auto;
 margin-right:auto
}
img.right {
 margin-left:auto
}
figure {
 display:table;
 max-width:100%;
 margin:25px 0
}
figure.left {
 margin-right:auto
}
figure.center {
 margin-left:auto;
 margin-right:auto
}
figure.right {
 margin-left:auto
}
figure figcaption {
 font-size:14px;
 margin-top:5px;
 opacity:.8
}
figure figcaption.left {
 text-align:left
}
figure figcaption.center {
 text-align:center
}
figure figcaption.right {
 text-align:right
}
code {
 font-family:JuliaMono,Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;
 font-display:auto;
 font-feature-settings:normal;
 background:#eaeaea;
 /*padding:1px 6px;*/
 padding:1px 3px;
 margin:0 2px;
 border-radius:5px;
 /*font-size:.95rem*/
 font-size:.95em
}
.dark-theme code {
 background:#3b3d42
}
pre {
 background:#212020;
 padding:20px;
 border-radius:8px;
 /*font-size:.95rem;*/
 font-size:.95em;
 overflow:auto
}
@media(max-width:684px) {
 pre {
  /*white-space:pre-wrap;*/
  word-wrap:break-word
 }
}
pre code {
 background:0 0!important;
 color:#ccc;
 margin:0;
 padding:0;
 font-size:inherit
}
/*.dark-theme pre code {
 color:inherit
}*/
blockquote {
 border-left:2px solid;
 margin:40px;
 padding:10px 20px
}
@media(max-width:684px) {
 blockquote {
  margin:10px;
  padding:10px
 }
}
blockquote:before {
 content:'”';
 font-family:Georgia,serif;
 font-display:auto;
 font-size:3.875rem;
 position:absolute;
 left:-40px;
 top:-20px
}
blockquote p:first-of-type {
 margin-top:0
}
blockquote p:last-of-type {
 margin-bottom:0
}
ul,
ol {
 margin-left:40px;
 padding:0
}
@media(max-width:684px) {
 ul,
 ol {
  margin-left:20px
 }
}
ol ol {
 list-style-type:lower-alpha
}
.container {
 flex:1;
 display:flex;
 flex-direction:column;
 justify-content:center;
 text-align:center
}
.content {
 display:flex;
 flex-direction:column;
 flex:1 auto;
 align-items:center;
 justify-content:center;
 margin:50px 0
}
@media(max-width:684px) {
 .content {
  margin-top:0
 }
}
hr {
 width:100%;
 border:none;
 background:#dcdcdc;
 height:1px
}
.dark-theme hr {
 background:#4a4b50
}
.hidden {
 display:none
}
@media(max-width:684px) {
 .hide-on-phone {
  display:none
 }
}
@media(max-width:900px) {
 .hide-on-tablet {
  display:none
 }
}
.screen-reader-text {
 border:0;
 clip:rect(1px,1px,1px,1px);
 clip-path:inset(50%);
 height:1px;
 margin:-1px;
 overflow:hidden;
 padding:0;
 position:absolute!important;
 width:1px;
 word-wrap:normal!important
}
.screen-reader-text:focus {
 background-color:#f1f1f1;
 border-radius:3px;
 box-shadow:0 0 2px 2px rgba(0,0,0,.6);
 clip:auto!important;
 clip-path:none;
 color:#21759b;
 display:block;
 font-size:14px;
 font-size:.875rem;
 font-weight:700;
 height:auto;
 left:5px;
 line-height:normal;
 padding:15px 23px 14px;
 text-decoration:none;
 top:5px;
 width:auto;
 z-index:100000
}
.posts {
 width:100%;
 max-width:800px;
 text-align:left;
 padding:20px;
 margin:20px auto
}
@media(max-width:900px) {
 .posts {
  max-width:660px
 }
}
.posts:not(:last-of-type) {
 border-bottom:1px solid #dcdcdc
}
.dark-theme .posts:not(:last-of-type) {
 border-color:#4a4b50
}
.posts-group {
 display:flex;
 margin-bottom:1.9em;
 line-height:normal
}
@media(max-width:900px) {
 .posts-group {
  display:block
 }
}
.posts-list {
 flex-grow:1;
 margin:0;
 padding:0;
 list-style:none
}
.posts .post-title {
 font-size:1rem;
 margin:5px 0
}
.posts .post-year {
 padding-top:6px;
 margin-right:1.8em;
 font-size:1.6em;
 opacity:.6
}
@media(max-width:900px) {
 .posts .post-year {
  margin:-6px 0 4px
 }
}
.posts .post-item {
 border-bottom:1px grey dashed
}
.posts .post-item a {
 display:flex;
 justify-content:space-between;
 align-items:baseline;
 padding:12px 0;
 text-decoration:none
}
.posts .post-day {
 flex-shrink:0;
 margin-left:1em;
 opacity:.6
}
.post {
 width:100%;
 max-width:800px;
 text-align:left;
 padding:20px;
 margin:20px auto
}
@media(max-width:900px) {
 .post {
  max-width:600px
 }
}
.post-date:after {
 content:'—'
}
.post-title {
 font-size:2.625rem;
 margin:0 0 20px
}
@media(max-width:684px) {
 .post-title {
  font-size:2rem
 }
}
.post-title a {
 text-decoration:none
}
.post-tags {
 display:block;
 margin-bottom:20px;
 font-size:1rem;
 opacity:.5
}
.post-tags a {
 text-decoration:none
}
.post-content {
 margin-top:30px
}
.post-cover {
 border-radius:8px;
 margin:40px -50px;
 width:860px;
 max-width:860px
}
@media(max-width:900px) {
 .post-cover {
  margin:20px 0;
  width:100%
 }
}
.post-info {
/* display: flex;
 justify-content: space-between;*/
 margin-top:30px;
 font-size:.8rem;
 line-height:normal;
 opacity:.6
}
.post-info p {
 margin:.8em 0
}
.post-info a:hover {
 border-bottom:1px solid #fff
}
.post-info svg {
 margin-right:.5em
}
.post-info .tag {
 margin-right:.5em
}
.post-info .tag::before {
 content:"#"
}
.post-info .feather {
 display:inline-block;
 vertical-align:-.125em;
 width:1em;
 height:1em
}

.post-info svg {
  display:inline-block;
  vertical-align:-.125em;
  width:1em;
  height:1em
 }

.post .flag {
 border-radius:50%;
 margin:0 5px
}
.pagination {
 margin-top:20px
}
.pagination__title {
 display:flex;
 text-align:center;
 position:relative;
 margin:30px 0 20px
}
.pagination__title-h {
 text-align:center;
 margin:0 auto;
 padding:5px 10px;
 background:#fff;
 color:#999;
 font-size:.8rem;
 text-transform:uppercase;
 text-decoration:none;
 letter-spacing:.1em;
 z-index:1
}
.dark-theme .pagination__title-h {
 background:#292a2d;
 color:#73747b
}
.pagination__title hr {
 position:absolute;
 left:0;
 right:0;
 width:100%;
 margin-top:15px;
 z-index:0
}
.pagination__buttons {
 display:flex;
 align-items:center;
 justify-content:center
}
.pagination__buttons a {
 text-decoration:none;
 font-weight:700
}
.button {
 position:relative;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 background:#eaeaea;
 font-size:1rem;
 font-weight:600;
 border-radius:8px;
 max-width:40%;
 padding:0;
 cursor:pointer;
 appearance:none
}
.dark-theme .button {
 background:#3b3d42
}
.button+.button {
 margin-left:10px
}
.button a {
 display:flex;
 padding:8px 16px;
 text-decoration:none;
 text-overflow:ellipsis;
 white-space:nowrap;
 overflow:hidden
}
.button__text {
 text-overflow:ellipsis;
 white-space:nowrap;
 overflow:hidden
}
.button.next .button__icon {
 margin-left:8px
}
.button.previous .button__icon {
 margin-right:8px
}
.footer {
 padding:40px 20px;
 flex-grow:0;
 opacity: .8;
 /*color:#999*/
}
.footer__inner {
 display:flex;
 align-items:center;
 justify-content:center;
 margin:0 auto;
 width:760px;
 max-width:100%
}
@media(max-width:900px) {
 .footer__inner {
  flex-direction:column
 }
}
.footer__content {
 display:flex;
 flex-direction:row;
 align-items:center;
 font-size:0.8rem;
 opacity: .8;
 /*color:#999*/
}
@media(max-width:900px) {
 .footer__content {
  flex-direction:column;
  margin-top:10px
 }
}
.footer__content>*:not(:last-child) {
 border-right:1px solid;
 padding:0 15px
}
@media(max-width:900px) {
 .footer__content>*:not(:last-child) {
  border:none
 }
}
.footer__content>*:last-child {
 padding:0 15px
}

/*
.post-info {
 display:flex;
 flex-direction:row;
 align-items:center
}
*/
/*.post-info .right{
  display: inline-flex;
  flex-direction:row;
  align-items:center
}
*/

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  text-decoration: none;
}
/*
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
  text-decoration: underline;
}
*/

/*.post-content h1 {
 font-size:2.625rem;
 margin:0 0 20px
}
*/
a {
  outline: 0;
}

.social-icons svg {
  font-size: 1.5em;
  height: 1.5em;
  width: 1.5em;
}

#spotlight {
  display: flex;
  /*height: 100vh;*/
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /*max-width: 93%;*/
  margin: auto;
  font-size: 1.5rem;
}
#spotlight.error-404 {
  flex-direction: row;
  line-height: normal;
}
p.img-404 svg {
  width: 180px;
  max-width: 100%;
  height: auto;
}
.animated.slower {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}
.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}
@keyframes flash {
 0%,
 50%,
 to {
  opacity:1
 }
 25%,
 75% {
  opacity:0
 }
}
.banner-404 {
  margin-left: 2em;
}
#spotlight.error-404 {
  line-height: normal;
}
#spotlight {
  font-size: 1.5rem;
}
.banner-404 h1 {
  font-size: 3em;
  margin: .5rem 0;
}
h1 code {
  background: inherit;
  font-size: 0.95em;
}
.dark-theme h1 code {
  background: inherit;
}
.tag-page-title svg {
  height: 1em;
  width: 1em;
  vertical-align: -0.4rem;
}
.posts .post-item a .post-title:hover {
  text-decoration: underline;
}
* {
  font-variant-ligatures: none;
}
