@font-face {
  font-family: "Iosevka Term";
  src: url("assets/iosevka-term-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Iosevka Term";
  src: url("assets/iosevka-term-bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: dark; scroll-padding-top: 1.5rem; background: var(--color-bg); scrollbar-gutter: stable; scrollbar-color: var(--color-rule-active) var(--color-bg); }
body { margin: 0; background: var(--color-bg); color: var(--color-ink); font-family: var(--font-body); font-size: var(--text-body); line-height: 1.55; font-synthesis: none; }
a { color: inherit; text-decoration: none; text-underline-offset: .23em; }
a:hover { color: var(--color-accent); text-decoration: underline; }
a:active, button:active { color: var(--color-bright); }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 4px; }
::selection { color: var(--color-bg); background: var(--color-accent); }
h1, h2, h3, p, pre, dl, figure { margin: 0; }
h1, h2, h3 { font-size: inherit; font-weight: 400; overflow-wrap: anywhere; }
pre, code, button, input { font: inherit; }
code { color: var(--color-ink); }
button { cursor: pointer; }
.page-shell { position: relative; max-width: var(--page-width); padding: 0 2rem; margin: 0 auto; }
html.entry-running { overflow: hidden; }
.entry-running [data-entry-file] { opacity: 0; visibility: hidden; }
.entry-running [data-entry-file].entry-visible { opacity: 1; visibility: visible; }
.entry-terminal { position: absolute; inset: 1.6rem 2rem auto; z-index: 1; opacity: 0; pointer-events: none; font-size: 1rem; line-height: 1.5; }
.entry-terminal[hidden] { display: none; }
.entry-line { display: flex; align-items: baseline; gap: 1ch; }
.entry-path { color: var(--color-accent); white-space: nowrap; }
.entry-prompt { color: var(--color-dim); }
.entry-input { min-width: 0; overflow-wrap: anywhere; color: var(--color-bright); }
.entry-caret { display: inline-block; width: .65ch; height: 1px; margin-left: .2ch; background: var(--color-accent); vertical-align: -.15em; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 2; top: .75rem; left: .75rem; padding: .5rem 1rem; background: var(--color-accent); color: var(--color-bg); transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }
.site-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; column-gap: 2rem; padding: 1rem 0 .75rem; border-bottom: 1px solid var(--color-rule); font-size: 1rem; }
.home-link { color: var(--color-ink); padding-block: .5rem; }
nav { display: flex; gap: 1.75rem; }
nav a { color: var(--color-muted); display: inline-flex; align-items: center; min-height: 40px; }
nav a[aria-current="page"] { color: var(--color-bright); text-decoration: underline; }
.articles-index { padding-top: 2.75rem; }
.articles-index h1 { font-size: 1.1875rem; margin-bottom: 1rem; }
.identity { width: min(100%, 40rem); container-type: inline-size; padding-top: 1rem; }
.ascii-name { color: var(--color-ink); font-size: min(.875rem, 2cqw); line-height: 1.05; font-weight: 400; letter-spacing: 0; white-space: pre; user-select: none; }
.current { margin-top: 1.75rem; line-height: 1.8; }
.current > div { display: grid; grid-template-columns: 11ch minmax(0, 1fr); }
.current dt { color: var(--color-dim); }
.current dd { margin: 0; overflow-wrap: anywhere; }
.current a { color: var(--color-accent); text-decoration: underline; }
h2 { color: var(--color-ink); font-size: 1rem; margin-bottom: 1.35rem; }
h2 span { color: var(--color-dim); }
.workspace-columns { display: grid; grid-template-columns: minmax(0, 1fr) 25ch; align-items: start; gap: 3rem; margin-top: 2.75rem; }
.work-column { min-width: 0; }
.working-tree { max-width: 52rem; }
.work-entry h3 { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 1.5ch; row-gap: 0; font-size: 1.1875rem; }
.work-entry h3 > a { display: inline-block; color: var(--color-bright); padding-block: .15rem; }
.work-entry h3 > a:hover { color: var(--color-accent); }
.language { color: var(--color-dim); font-size: var(--text-small); white-space: nowrap; }
.work-entry > p { max-width: 70ch; margin-top: .15rem; }
.detail { color: var(--color-muted); }
.run-fragment { margin: 1rem 0 .5rem 2ch; padding-left: 1.5ch; border-left: 1px solid var(--color-rule-active); max-width: 100%; }
.run-fragment figcaption { color: var(--color-muted); font-size: var(--text-small); margin-bottom: .35rem; }
.run-fragment pre { font-size: .9375rem; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.source-note { display: inline-block; padding-block: .3rem; font-size: var(--text-small); color: var(--color-dim); }
.work-entry .aside-note { margin-left: 3.5ch; font-size: var(--text-small); color: var(--color-muted); }
.vm-entry { margin: 2.35rem 0 1.85rem 2ch; }
.unfinished { color: var(--color-muted); }
.unfinished > span { color: var(--color-dim); }
.amice-entry { margin-left: .5ch; }
.small-tools { margin-top: 2.5rem; max-width: 58rem; }
.small-tools h2 { margin-bottom: .5rem; color: var(--color-dim); }
.tool-index > div { display: grid; grid-template-columns: 25ch minmax(0, 1fr); gap: 1ch; align-items: baseline; }
.tool-index dt a { display: inline-block; padding-block: .3rem; }
.tool-index dd { margin: 0; color: var(--color-muted); font-size: .9375rem; }
.notebook { margin-top: 1.75rem; padding-left: 1.5rem; border-left: 1px solid var(--color-rule); min-width: 0; }
.notebook h2 { margin-bottom: 1rem; }
.note-row { margin-bottom: 1.75rem; }
.note-date { display: block; margin-bottom: .25rem; color: var(--color-dim); font-size: var(--text-small); }
.note-row p { color: var(--color-muted); font-size: .9375rem; margin-top: .2rem; }
.note-row h3 > a { display: inline-block; padding-block: .1rem; }
.report-note { margin-top: 1.65rem; }
.site-footer { margin-top: 3.5rem; padding: 1.25rem 0 1.75rem; border-top: 1px solid var(--color-rule); font-size: var(--text-small); color: var(--color-dim); }
.footer-comment { margin-bottom: .35rem; color: var(--color-muted); }
.revision-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: .25rem 2ch; }
.eof-link { display: inline-block; padding-block: .4rem; margin-left: auto; color: var(--color-muted); }
.eof-link:hover { text-decoration-style: dotted; }
.scratch { max-width: 48rem; padding: 2.5rem 1.5rem; margin: 0 auto; }
.scratch > header { color: var(--color-muted); margin-bottom: 3rem; }
.scratch h1 { font-size: 1.25rem; margin-bottom: 1rem; }
.scratch .equation { white-space: pre-wrap; overflow-wrap: anywhere; margin-bottom: 1.75rem; color: var(--color-bright); }
.byte-fields { display: flex; flex-wrap: wrap; border: 0; padding: 0; margin: 0 0 1.5rem; gap: 1rem 2rem; }
.byte-fields label { display: flex; align-items: center; gap: 1ch; }
.byte-fields input { width: 7ch; min-height: 40px; border: 1px solid var(--color-rule-active); border-radius: 0; background: var(--color-bg); color: var(--color-ink); padding: .25rem .5ch; }
.byte-fields input:invalid { border-color: var(--color-accent); }
.byte-output { display: block; white-space: pre; line-height: 1.7; font-size: .9375rem; margin-bottom: 1.5rem; }
.scratch .detail { font-size: .9375rem; max-width: 52ch; }
@media (max-width: 52rem) {
  .workspace-columns { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .notebook { margin-top: 3rem; padding-left: 0; border-left: 0; max-width: 62ch; }
}
@media (max-width: 42rem) {
  .page-shell { padding-inline: 1.25rem; }
  .entry-terminal { inset-inline: 1.25rem; font-size: .875rem; }
  .identity { padding-top: 1rem; }
  .current { font-size: .9375rem; margin-top: 1.25rem; }
  .current > div { grid-template-columns: 10ch minmax(0, 1fr); }
  .vm-entry { margin-left: 1ch; }
  .amice-entry { margin-left: 0; }
  .tool-index > div { grid-template-columns: minmax(0, 1fr); gap: 0; margin-bottom: .7rem; }
  .tool-index dd { padding-left: 2ch; }
  .notebook { margin: 3rem 0; }
  .note-row { grid-template-columns: minmax(0, 1fr); gap: .15rem; }
  .run-fragment { margin-left: .5ch; padding-left: 1ch; }
  .work-entry .aside-note { margin-left: 1.5ch; }
  .revision-line { flex-direction: column; gap: .15rem; }
  .eof-link { margin-left: 0; }
}
@media (max-width: 25rem) {
  .page-shell { padding-inline: 1rem; }
  .entry-terminal { inset-inline: 1rem; }
  .site-header { column-gap: 1rem; }
  nav { gap: 1rem; }
  .current > div { grid-template-columns: minmax(0, 1fr); margin-bottom: .35rem; }
  .current dd { padding-left: 2ch; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}