@font-face {
  font-family:'DM Sans';
  src:url('/assets/fonts/dm-sans.woff2') format('woff2');
  font-style:normal;
  font-weight:100 1000;
  font-display:swap;
}
@font-face {
  font-family:'Instrument Serif';
  src:url('/assets/fonts/instrument-serif.woff2') format('woff2');
  font-style:normal;
  font-weight:400;
  font-display:swap;
}

:root {
  color-scheme:light;
  --paper:#f6f3ec;
  --ink:#2d2b25;
  --green:#9b4f36;
  --green-hover:#793b29;
  --muted:#746f66;
  --line:#dcd6ca;
  --surface:#eee9df;
  --surface-hover:#e7e0d4;
  --selection:#ead4bd;
  --on-accent:#fff;
  --grid:#ddd5c6;
  --sans:'DM Sans',sans-serif;
  --serif:'Instrument Serif',Georgia,serif;
  --mono:'SFMono-Regular',Consolas,'Liberation Mono',monospace;
}
:root[data-theme="dark"] {
  color-scheme:dark;
  --paper:#1d1c19;
  --ink:#eee9df;
  --green:#e5a382;
  --green-hover:#f4c5a9;
  --muted:#aba69b;
  --line:#3a3832;
  --surface:#26241f;
  --surface-hover:#302d27;
  --selection:#594431;
  --on-accent:#211c15;
  --grid:#3a362e;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:32px; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:15px; line-height:1.75; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { color:inherit; font:inherit; cursor:pointer; }
a,button { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible { outline:2px solid var(--green); outline-offset:5px; }
button:disabled { cursor:default; opacity:.5; }
::selection { background:var(--selection); color:var(--ink); }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { font-weight:500; }
h1,h2 { line-height:1.12; letter-spacing:-1.6px; }
h1 em,h2 em { font-style:normal; font-weight:inherit; color:var(--muted); }
img,svg { display:block; max-width:100%; }
.wrap { width:min(1100px,calc(100% - 96px)); margin-inline:auto; }
[hidden] { display:none!important; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.skip-link { position:fixed; top:-100px; left:20px; z-index:100; background:var(--green); color:var(--on-accent); padding:10px 20px; }
.skip-link:focus { top:12px; }
body,.notebook-cover,.project-card,.launch-screen,.education-section,.mobile-nav,.filter,.button {
  transition:background-color .25s ease,color .25s ease,border-color .25s ease;
}

/* Navigation */
.site-header { height:96px; display:flex; align-items:center; gap:20px; border-bottom:1px solid var(--line); position:relative; z-index:10; }
.brand { display:inline-flex; align-items:center; font-family:var(--sans); font-size:17px; font-weight:500; letter-spacing:-.6px; white-space:nowrap; }
.brand-symbol { color:var(--green); margin-right:13px; font-size:15px; }
.brand-period { color:var(--green); margin-left:1px; }
.desktop-nav { margin-left:auto; display:flex; gap:28px; align-items:center; }
.desktop-nav a { font-size:12px; color:var(--muted); padding:13px 0; position:relative; transition:color .2s; }
.desktop-nav a:hover,.desktop-nav a[aria-current] { color:var(--ink); }
.desktop-nav a[aria-current]::after { content:''; height:1px; background:var(--ink); position:absolute; left:0; right:0; bottom:5px; }
.header-controls { display:flex; align-items:center; gap:8px; margin-left:12px; }
.theme-toggle { display:grid; place-items:center; width:40px; height:40px; flex-shrink:0; position:relative; background:transparent; border:1px solid transparent; border-radius:4px; color:var(--muted); transition:background-color .2s,color .2s; }
.theme-toggle:hover { color:var(--ink); background:var(--surface); }
.theme-toggle svg { width:17px; height:17px; position:absolute; stroke:currentColor; fill:none; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; transition:opacity .25s,transform .4s; }
.theme-sun { opacity:0; transform:rotate(-65deg) scale(.6); }
[data-theme="dark"] .theme-sun { opacity:1; transform:rotate(0) scale(1); }
[data-theme="dark"] .theme-moon { opacity:0; transform:rotate(65deg) scale(.6); }
.menu-toggle,.mobile-nav { display:none; }

/* Shared type and controls */
.eyebrow { display:flex; align-items:center; gap:9px; font-family:var(--mono); font-size:9px; font-weight:400; letter-spacing:1.4px; line-height:1.6; color:var(--green); }
.muted { color:var(--muted); }
.status-dot { display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--green); flex-shrink:0; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:24px; border:1px solid var(--green); border-radius:3px; background:var(--green); color:var(--on-accent); font-size:12px; font-weight:500; padding:11px 18px; line-height:1.7; }
.button:hover { background:var(--green-hover); border-color:var(--green-hover); }
.button span,.text-link span,.row-arrow,.cover-arrow { display:inline-block; transition:transform .25s; }
.button span,.text-link span { font-size:18px; }
.button:hover span,.text-link:hover span { transform:translate(2px,-2px); }
.text-link { display:inline-flex; align-items:center; gap:18px; font-size:12px; line-height:1.8; }
.text-link:hover { color:var(--green); }
.circle-link { width:34px; height:34px; display:grid; place-items:center; color:var(--muted); border:1px solid var(--line); border-radius:3px; transition:color .2s,background .2s; }
.circle-link:hover { color:var(--green); background:var(--surface); }

/* Hero */
.hero { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); align-items:center; gap:60px; padding:74px 0 64px; }
.hero h1 { font-size:clamp(44px,4.7vw,64px); font-weight:500; letter-spacing:-2.8px; line-height:1.09; margin:24px 0; }
.hero h1 em { color:var(--muted); }
.hero-description { max-width:430px; color:var(--muted); font-size:14px; line-height:1.95; }
.hero-actions { display:flex; align-items:center; gap:27px; margin-top:31px; }
.hero-footnote { font-family:var(--mono); font-size:9px; color:var(--muted); letter-spacing:.1px; margin-top:28px; }
.hero-introduction { display:flex; align-items:flex-start; gap:17px; max-width:480px; }
.hero-introduction>img { width:48px; height:64px; flex-shrink:0; border:1px solid var(--line); border-radius:3px; object-fit:cover; object-position:50% 35%; filter:saturate(.7); margin-top:5px; }
.hero-introduction .hero-description { flex:1; min-width:0; }

/* Persistent site terminal. The prompt stays visible when output is minimized. */
html { scroll-padding-bottom:calc(var(--terminal-height,0px) + 24px); }
body { padding-bottom:var(--terminal-height,0px); }
.terminal-dock { position:fixed; inset:auto 0 0; z-index:40; border-top:1px solid var(--line); background:var(--paper); box-shadow:0 -10px 40px #0000000c; padding-bottom:env(safe-area-inset-bottom); }
.terminal-dock[data-expanded="true"] { box-shadow:0 -18px 60px #00000024; }
.terminal { min-width:0; font:12px/1.7 var(--mono); }
.terminal-meta { display:flex; align-items:center; justify-content:space-between; gap:15px; min-height:40px; color:var(--muted); font-size:9px; }
.terminal-meta>span:first-child { color:var(--green); letter-spacing:1px; }
.terminal-hint { font-size:9px; color:var(--muted); }
.terminal-output { height:min(200px,calc(var(--terminal-viewport,100dvh) * .32)); overflow:auto; min-height:0; padding:5px 12px 12px 0; scrollbar-width:thin; scrollbar-color:var(--line) transparent; overscroll-behavior:contain; overflow-wrap:anywhere; }
.terminal-output:focus-visible { outline:1px solid var(--green); outline-offset:2px; }
.terminal-muted { color:var(--muted); }
.terminal-line+.terminal-line { margin-top:6px; }
.terminal-echo { margin-bottom:9px; color:var(--ink); white-space:pre-wrap; }
.terminal-echo>span,.terminal-prompt { color:var(--green); }
.terminal-entry+.terminal-entry { margin-top:22px; }
.terminal-directory { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 48px; }
.terminal-directory a { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 12px; align-items:baseline; padding:7px 4px; line-height:1.5; border-radius:2px; }
.terminal-directory a>span:first-child { color:var(--green); }
.terminal-directory a>span:nth-child(2) { grid-column:1/-1; grid-row:2; color:var(--muted); font:12px/1.5 var(--sans); }
.terminal-entry-kind { grid-column:2; grid-row:1; color:var(--muted); font:9px/1.5 var(--mono); white-space:nowrap; }
.terminal-group-label { color:var(--muted); font-size:9px; letter-spacing:.4px; margin:12px 0 3px; }
.terminal-directory a:hover { background:var(--surface-hover); }
.terminal-directory a:hover .terminal-entry-kind { color:var(--green); }
.terminal-directory a:focus-visible { outline-offset:1px; }
.terminal-help { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px 48px; padding:4px 0 16px; }
.terminal-help>div { display:grid; gap:2px; }
.terminal-help code { font:inherit; color:var(--green); }
.terminal-help span { color:var(--muted); }
.terminal-suggestions { display:flex; flex-wrap:wrap; gap:9px; padding:5px 0 9px; margin-left:-5px; }
.terminal-suggestions button { padding:6px; background:none; border:0; color:var(--green); font:10px var(--mono); border-radius:2px; }
.terminal-suggestions button:hover { background:var(--surface-hover); }
.terminal-suggestions button:focus-visible { outline-offset:1px; }
.terminal-form { display:flex; align-items:center; gap:12px; min-height:64px; }
[data-expanded="true"] .terminal-form { border-top:1px solid var(--line); }
.terminal-label { display:flex; align-items:center; gap:10px; padding-right:22px; margin-right:9px; border-right:1px solid var(--line); color:var(--green); white-space:nowrap; }
.terminal-label>span { color:var(--muted); font-size:11px; }
.terminal-path { flex-shrink:0; max-width:22ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-size:11px; }
.terminal-prompt { flex-shrink:0; }
.terminal-form input { flex:1; width:100%; min-width:0; padding:12px 0; background:none; border:0; border-radius:0; color:var(--ink); font:12px var(--mono); outline:none; caret-color:var(--green); }
.terminal-form:focus-within .terminal-label { color:var(--green-hover); }
.terminal-form input:focus { box-shadow:0 1px 0 var(--green); }
.terminal-form input::placeholder { color:var(--muted); opacity:.85; }
.terminal-run,.terminal-expand { display:flex; align-items:center; justify-content:center; flex-shrink:0; height:36px; background:none; color:var(--muted); border:1px solid transparent; border-radius:3px; }
.terminal-run { width:36px; font:18px var(--mono); }
.terminal-run:hover,.terminal-expand:hover { background:var(--surface-hover); color:var(--green); }
.terminal-expand { min-width:80px; gap:13px; padding:0 10px; border-color:var(--line); font:10px var(--mono); }
.terminal-chevron { font-size:16px; line-height:1; transform:translateY(3px); }
[data-expanded="true"] .terminal-chevron { transform:rotate(180deg) translateY(2px); }
.terminal-shortcut { flex-shrink:0; font:9px var(--mono); color:var(--muted); margin-right:12px; }
.terminal-launch { display:flex; align-items:center; justify-content:center; gap:10px; height:36px; padding:0 8px; border:1px solid var(--line); border-radius:4px; background:transparent; color:var(--muted); font:13px var(--mono); }
.terminal-launch:hover { color:var(--green); background:var(--surface); }
.terminal-launch kbd { font:9px var(--mono); }
@media(prefers-reduced-motion:no-preference) {
  .terminal-entry:not(.terminal-initial) { animation:terminal-line-in .18s ease-out both; }
  @keyframes terminal-line-in { from { opacity:0; transform:translateY(3px); } to { opacity:1; transform:translateY(0); } }
}
@media(max-width:1050px) {
  .terminal-launch kbd,.terminal-shortcut { display:none; }
  .terminal-directory { gap:4px 24px; }
}
@media(max-width:760px) {
  .terminal-launch { width:34px; padding:0; border-color:transparent; }
  .terminal-form { min-height:60px; gap:8px; }
  .terminal-form input { font-size:16px; }
  .terminal-label { padding-right:10px; margin-right:0; }
  .terminal-label>span,.terminal-expand-label { display:none; }
  .terminal-path { max-width:8ch; font-size:10px; }
  .terminal-run,.terminal-expand { width:32px; min-width:32px; padding:0; }
  .terminal-meta { flex-wrap:wrap; gap:0 12px; padding-block:8px; }
  .terminal-meta,.terminal-hint { font-size:8px; }
  .terminal-output { height:min(210px,calc(var(--terminal-viewport,100dvh) * .32)); font-size:11px; padding-right:3px; }
  .terminal-directory,.terminal-help { grid-template-columns:minmax(0,1fr); }
  .terminal-directory a>span:nth-child(2) { font-size:11px; }
  .terminal-suggestions { padding-bottom:6px; }
}
@media(max-width:375px) {
  .site-header .brand-symbol { display:none; }
  .terminal-label { display:none; }
  .terminal-path { max-width:7ch; }
}
@media print {
  .terminal-dock,.terminal-launch { display:none!important; }
  body { padding-bottom:0; }
}

.current-chapter { display:flex; align-items:center; gap:27px; padding:22px 0; border-block:1px solid var(--line); }
.chapter-label { display:flex; align-items:center; gap:9px; padding-right:26px; border-right:1px solid var(--line); min-height:37px; font-family:var(--mono); font-size:8px; letter-spacing:1px; }
.chapter-role { font-size:12px; line-height:1.8; }
.chapter-role strong { font-weight:500; }
.chapter-role>span { display:block; font-size:11px; color:var(--muted); }
.chapter-detail { font-size:11px; margin-left:auto; line-height:1.8; }
.chapter-detail span { display:block; font-family:var(--mono); font-size:8px; color:var(--muted); }

/* Homepage sections */
.section { padding-block:76px; }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:25px; margin-bottom:32px; }
.section-heading h2 { font-size:34px; letter-spacing:-1.2px; margin-top:14px; }
.section-heading p:not(.eyebrow) { color:var(--muted); font-size:12px; margin-top:13px; }
.section-heading>.text-link { white-space:nowrap; margin-bottom:3px; }
.notebook-grid { display:grid; grid-template-columns:1fr 1.08fr; gap:65px; }
.notebook-cover { border:1px solid var(--line); border-radius:4px; background:var(--surface); padding:25px; display:flex; flex-direction:column; min-height:350px; }
.notebook-cover:hover { border-color:var(--green); }
.cover-top,.cover-bottom { display:flex; justify-content:space-between; align-items:center; gap:10px; color:var(--muted); }
.cover-top { font-family:var(--mono); font-size:8px; letter-spacing:.8px; }
.cover-center { margin-block:auto; padding:25px 0; }
.code-mark { display:block; font-family:var(--mono); font-size:24px; color:var(--green); margin-bottom:24px; letter-spacing:2px; }
.notebook-cover h3 { font-size:27px; line-height:1.35; letter-spacing:-.9px; }
.cover-bottom { font-size:10px; }
.cover-arrow { color:var(--green); font-size:21px; }
.notebook-cover:hover .cover-arrow { transform:translate(3px,-3px); }
.topic-row { display:block; padding:23px 25px 23px 0; border-bottom:1px solid var(--line); position:relative; transition:padding .2s; }
.topic-row:first-child { padding-top:0; }
.topic-row:last-child { border:0; padding-bottom:0; }
.topic-row:hover { padding-left:5px; }
.topic-tag { font-family:var(--mono); color:var(--muted); font-size:8px; letter-spacing:1px; }
.topic-row h3 { font-size:18px; letter-spacing:-.4px; margin-top:7px; }
.topic-row p { font-size:12px; color:var(--muted); margin-top:7px; line-height:1.85; max-width:350px; }
.row-arrow { position:absolute; right:0; top:41px; color:var(--muted); font-size:19px; }
.topic-row:first-child .row-arrow { top:18px; }
.topic-row:hover .row-arrow { color:var(--green); transform:translate(2px,-2px); }
.video-feature { display:grid; grid-template-columns:1fr 1.08fr; gap:65px; align-items:center; border-block:1px solid var(--line); padding:48px 0; }
.video-feature h2,.more-than-code h2 { font-size:34px; letter-spacing:-1.2px; line-height:1.25; margin-top:17px; }
.video-feature-detail>p { color:var(--muted); font-size:13px; line-height:1.9; }
.video-feature-detail p.video-status { font-family:var(--mono); font-size:8px; letter-spacing:1.1px; color:var(--green); margin-bottom:13px; }
.video-feature-detail>.text-link { margin-top:22px; }
.more-than-code { display:grid; grid-template-columns:1fr 1.08fr; align-items:center; gap:65px; }
.more-than-code h2 { margin-bottom:24px; }
.more-than-code>div>p:not(.eyebrow) { font-size:13px; line-height:1.95; color:var(--muted); }
.more-than-code>div>p+p { margin-top:18px; }

/* Writing */
.page-intro { padding:69px 0 45px; }
.page-intro h1 { font-size:56px; margin:20px 0 23px; letter-spacing:-2px; }
.page-intro>p:not(.eyebrow) { font-size:14px; color:var(--muted); line-height:1.9; }
.writing-toolbar { display:flex; justify-content:space-between; align-items:center; gap:18px; border-bottom:1px solid var(--line); padding-bottom:19px; }
.filters { display:flex; gap:7px; flex-wrap:wrap; }
.filter { background:transparent; border:1px solid transparent; padding:8px 15px; border-radius:3px; font-family:var(--mono); color:var(--muted); font-size:10px; }
.filter.active { background:var(--surface); border-color:var(--line); color:var(--green); }
.filter:hover { background:var(--surface-hover); }
.filter span { font-size:8px; margin-left:7px; opacity:.8; }
.rss-link { font-family:var(--mono); font-size:9px; color:var(--muted); white-space:nowrap; }
.rss-link:hover { color:var(--green); }
.writing-empty { display:flex; align-items:center; flex-direction:column; text-align:center; padding:55px 20px 65px; }
.empty-notebook { width:66px; margin-bottom:26px; }
.empty-notebook svg { fill:var(--surface); stroke:var(--muted); stroke-width:1.2; }
.empty-notebook .pencil { fill:var(--paper); stroke:var(--green); }
.writing-empty .eyebrow { font-size:8px; }
.writing-empty h2 { font-size:29px; margin:16px 0 20px; letter-spacing:-1px; }
.writing-empty>p:not(.eyebrow) { font-size:13px; color:var(--muted); line-height:1.9; max-width:490px; }
.writing-empty>.text-link { margin-top:25px; }
.writing-footnote { border-top:1px solid var(--line); padding:30px 0 45px; display:flex; align-items:center; justify-content:center; gap:20px; color:var(--muted); font-size:12px; }
.little-star { font-size:24px; color:var(--green); }
.post-row { display:flex; gap:25px; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); padding:28px 0; }
.post-row h2 { font-size:26px; letter-spacing:-.8px; margin:13px 0; }
.post-row p { color:var(--muted); font-size:13px; }
.post-row .row-arrow { position:static; }
.post-row:hover h2 { color:var(--green); }

/* Videos */
.video-launch { padding-bottom:55px; }
.launch-screen { min-height:300px; display:flex; flex-direction:column; justify-content:space-between; background:var(--surface); border:1px solid var(--line); border-radius:4px; padding:24px 28px; background-image:radial-gradient(var(--grid) .7px,transparent .7px); background-size:24px 24px; }
.launch-caption { font-family:var(--mono); font-size:8px; letter-spacing:1.5px; color:var(--muted); }
.launch-caption:last-child { text-align:right; }
.launch-title { text-align:center; font-size:49px; font-weight:500; letter-spacing:-2px; line-height:1.1; padding:20px 0; }
.launch-title em { font-style:normal; color:var(--muted); }
.launch-description { display:grid; grid-template-columns:1fr 1fr; gap:75px; padding:34px 0 15px; }
.soon-pill { display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); border-radius:3px; padding:5px 9px; font-family:var(--mono); font-size:8px; color:var(--green); }
.launch-description h2 { font-size:33px; margin-top:18px; line-height:1.25; }
.launch-description p { font-size:13px; color:var(--muted); line-height:1.95; }
.launch-description p+p { margin-top:16px; }
.launch-description .text-link { margin-top:21px; }
.video-topics { padding-bottom:65px; }
.video-topics>div { display:grid; grid-template-columns:repeat(3,1fr); gap:35px; margin-top:24px; }
.video-topics article { border-top:1px solid var(--line); padding-top:21px; }
.video-topics article>span { font-family:var(--mono); font-size:8px; letter-spacing:1px; color:var(--muted); }
.video-topics h3 { font-size:19px; letter-spacing:-.5px; line-height:1.4; margin:13px 0; }
.video-topics p { font-size:12px; color:var(--muted); }

/* About */
.about-intro { display:grid; grid-template-columns:1.3fr 1fr; gap:110px; align-items:center; padding:65px 0; }
.about-intro h1 { font-size:56px; letter-spacing:-2.1px; margin:23px 0; line-height:1.12; }
.about-intro>div>p:not(.eyebrow) { font-size:14px; color:var(--muted); line-height:1.9; max-width:460px; }
.about-links { display:flex; gap:27px; margin-top:25px; }
.about-portrait { width:285px; max-width:100%; justify-self:end; }
.about-portrait img { width:100%; height:360px; object-fit:cover; object-position:50% 42%; filter:saturate(.75); border-radius:3px; }
.about-portrait figcaption { display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:8px; color:var(--muted); padding-top:16px; }
.about-story { border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 2fr; gap:70px; padding:47px 0 60px; }
.about-story>.eyebrow { align-self:start; padding-top:6px; }
.about-story .large-copy { font-size:27px; font-weight:500; letter-spacing:-.8px; line-height:1.4; margin-bottom:24px; }
.about-story .large-copy em { font-style:normal; color:var(--green); }
.about-story>div>p:not(.large-copy) { font-size:14px; color:var(--muted); line-height:1.95; margin-top:17px; }
.about-story strong { font-weight:500; color:var(--ink); }
.experience-section { padding:26px 0 60px; }
.experience-row { display:grid; grid-template-columns:1fr 1.3fr 1.8fr; gap:36px; border-top:1px solid var(--line); padding:27px 0; }
.experience-date { font-family:var(--mono); font-size:9px; color:var(--muted); padding-top:4px; }
.experience-date>span { display:block; font-size:7px; margin-top:8px; letter-spacing:.5px; }
.experience-date .current-label { display:table; padding:2px 6px; border:1px solid var(--line); border-radius:2px; color:var(--green); }
.experience-company h3 { font-size:16px; letter-spacing:-.4px; }
.experience-company p { font-size:11px; color:var(--muted); margin-top:4px; }
.experience-row>p { font-size:12px; line-height:1.9; color:var(--muted); padding-top:2px; }
.projects-section { padding:10px 0 60px; }
.project-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.project-card { display:flex; flex-direction:column; padding:23px 0; border-top:1px solid var(--line); }
.project-card-top { display:flex; justify-content:space-between; align-items:center; font-family:var(--mono); font-size:8px; letter-spacing:.3px; color:var(--muted); }
.project-card-top>span:nth-child(2) { font-size:18px; }
.project-card h3 { font-size:21px; letter-spacing:-.7px; line-height:1.3; margin:25px 0 13px; }
.project-card>p { font-size:12px; color:var(--muted); line-height:1.9; margin-bottom:24px; }
.project-detail { font-family:var(--mono); font-size:8px; color:var(--muted); margin-top:auto; }
a.project-card:hover h3 { color:var(--green); }
.education-section { display:grid; grid-template-columns:1.3fr 1fr; align-items:center; gap:40px; border:1px solid var(--line); background:var(--surface); border-radius:4px; overflow:hidden; }
.education-section>img { width:100%; height:230px; object-fit:cover; object-position:57% center; filter:saturate(.55); }
.education-section>div { padding:25px 25px 25px 0; }
.education-section h2 { font-size:34px; margin:15px 0; }
.education-section p:not(.eyebrow) { font-size:12px; color:var(--muted); line-height:1.95; }
.education-section strong { color:var(--ink); font-weight:500; }
.about-offline { padding-block:60px; }

/* Article typography and footer */
.article { max-width:740px; padding-top:55px; }
.article-header { border-bottom:1px solid var(--line); padding-bottom:30px; }
.article-back { color:var(--muted); margin-bottom:34px; }
.article-header h1 { font-size:48px; line-height:1.18; margin:21px 0; }
.article-description { font-size:16px; color:var(--muted); line-height:1.85; }
.article-author { display:flex; align-items:center; gap:11px; font-size:12px; margin-top:26px; }
.article-author img { width:36px; height:36px; object-fit:cover; object-position:50% 34%; border-radius:3px; }
.prose { font-size:16px; line-height:1.95; padding:33px 0; overflow-wrap:anywhere; }
.prose p,.prose ul,.prose ol,.prose blockquote,.prose pre,.prose table { margin:0 0 24px; }
.prose h2 { font-size:28px; margin:40px 0 20px; letter-spacing:-.8px; }
.prose h3 { font-size:21px; margin:31px 0 15px; letter-spacing:-.5px; }
.prose a { color:var(--green); text-decoration:underline; text-underline-offset:3px; }
.prose blockquote { border-left:2px solid var(--green); padding-left:22px; color:var(--muted); }
.prose pre { background:var(--surface); border:1px solid var(--line); border-radius:4px; padding:20px; overflow-x:auto; font-size:12px; line-height:1.8; }
.prose code { font-family:var(--mono); font-size:.85em; background:var(--surface); padding:2px 5px; border-radius:3px; }
.prose pre code { padding:0; }
.prose img { border-radius:4px; margin:25px auto; }
.prose table { border-collapse:collapse; width:100%; display:block; overflow:auto; }
.prose th,.prose td { border:1px solid var(--line); padding:9px 14px; text-align:left; }
.article-footer { display:flex; justify-content:space-between; align-items:center; gap:20px; border-top:1px solid var(--line); padding:24px 0 60px; font-size:12px; color:var(--muted); }
.not-found { padding:65px 0 90px; text-align:center; }
.not-found>.eyebrow { justify-content:center; }
.not-found-star { display:block; font-size:75px; color:var(--green); margin:28px 0 20px; line-height:1; }
.not-found h1 { font-size:48px; }
.not-found p:not(.eyebrow) { color:var(--muted); margin:24px 0; }
.not-found>.button { margin-top:10px; }
.site-footer { border-top:1px solid var(--line); }
.footer-top { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:26px 0; }
.footer-top>p { font-size:12px; color:var(--muted); }
.footer-top>.text-link { font-size:11px; }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:18px 0 28px; border-top:1px solid var(--line); font-family:var(--mono); font-size:9px; color:var(--muted); }
.social-links { display:flex; gap:22px; }
.social-links a:hover { color:var(--green); }

/* Entrance motion */
@keyframes enter { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@keyframes menu-enter { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }
@media(prefers-reduced-motion:no-preference) {
  .hero-copy>* { animation:enter .65s cubic-bezier(.2,.7,.2,1) both; }
  .hero-copy>h1 { animation-delay:.07s; }
  .hero-copy>.hero-introduction { animation-delay:.14s; }
  .hero-copy>.hero-actions { animation-delay:.21s; }
  .hero-copy>.hero-footnote { animation-delay:.28s; }
  .page-intro,.about-intro,.article-header,.not-found { animation:enter .65s ease-out both; }
  .mobile-nav:not([hidden]) { animation:menu-enter .2s ease-out both; }
  [data-reveal] { transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1),background-color .25s,color .25s; }
  [data-reveal="pending"] { opacity:0; transform:translateY(16px); }
  [data-reveal="visible"] { opacity:1; transform:translateY(0); }
}

@media(max-width:1050px) {
  .wrap { width:calc(100% - 64px); }
  .hero { gap:35px; }
  .hero h1 { font-size:48px; letter-spacing:-2px; }
  .hero-actions { gap:20px; }
  .hero-actions .text-link { font-size:11px; gap:10px; }
  .notebook-grid,.video-feature,.more-than-code { gap:36px; }
  .about-intro { gap:55px; }
  .about-intro h1 { font-size:49px; }
  .about-story { gap:45px; }
  .experience-row { gap:24px; }
  .project-grid { gap:24px; }
}
@media(max-width:800px) and (min-width:761px) {
  .hero { grid-template-columns:minmax(0,1fr) minmax(0,.95fr); gap:25px; }
  .hero h1 { font-size:41px; letter-spacing:-1.8px; }
  .hero-actions { flex-wrap:wrap; gap:16px; }
  .desktop-nav { gap:20px; }
}
@media(max-width:760px) {
  .wrap { width:calc(100% - 40px); }
  .site-header { height:80px; gap:10px; }
  .brand { font-size:12px; }
  .brand-symbol { font-size:14px; margin-right:9px; }
  .desktop-nav { display:none; }
  .header-controls { margin-left:auto; gap:5px; }
  .menu-toggle { display:flex; align-items:center; gap:8px; font-size:11px; padding:9px 0 9px 6px; background:none; border:0; }
  .menu-toggle svg { width:20px; fill:none; stroke:var(--ink); stroke-width:1.3; }
  .mobile-nav { display:flex; position:absolute; top:79px; left:-20px; right:-20px; padding:13px 25px 23px; background:var(--paper); border-bottom:1px solid var(--line); flex-direction:column; }
  .mobile-nav a { padding:12px 0; color:var(--muted); font-size:14px; }
  .mobile-nav a[aria-current] { color:var(--green); }
  .hero { grid-template-columns:minmax(0,1fr); gap:33px; padding:44px 0 35px; }
  .hero h1 { font-size:47px; letter-spacing:-2px; margin:21px 0; }
  .hero-description { font-size:14px; max-width:480px; }
  .hero-actions { gap:24px; flex-wrap:wrap; margin-top:25px; }
  .hero-footnote { margin-top:22px; font-size:8px; }
  .current-chapter { display:grid; grid-template-columns:1fr auto; gap:13px 10px; padding:21px 0; }
  .chapter-label { grid-column:1/-1; min-height:0; border:0; padding:0; font-size:8px; }
  .chapter-role { grid-column:1; grid-row:2; }
  .chapter-detail { margin:0; grid-column:1; grid-row:3; font-size:10px; }
  .chapter-detail span { display:inline; margin-left:12px; font-size:8px; }
  .current-chapter>.circle-link { grid-column:2; grid-row:2/4; }
  .section { padding-block:52px; }
  .section-heading { gap:15px; margin-bottom:26px; }
  .section-heading h2 { font-size:28px; letter-spacing:-1px; }
  .section-heading p:not(.eyebrow) { font-size:12px; max-width:280px; }
  .section-heading>.text-link { font-size:10px; gap:7px; }
  .section-heading>.text-link span { font-size:15px; }
  .notebook-grid,.more-than-code { grid-template-columns:minmax(0,1fr); gap:30px; }
  .notebook-cover { min-height:310px; padding:24px; }
  .notebook-cover h3 { font-size:26px; }
  .topic-row { padding:22px 27px 22px 0; }
  .topic-row h3 { font-size:19px; }
  .topic-row p { max-width:100%; }
  .video-feature { grid-template-columns:minmax(0,1fr); gap:24px; padding-block:35px; }
  .video-feature h2,.more-than-code h2 { font-size:29px; letter-spacing:-1px; }
  .more-than-code { gap:22px; }
  .more-than-code h2 { margin-bottom:21px; }
  .page-intro { padding:44px 0 32px; }
  .page-intro h1 { font-size:42px; letter-spacing:-1.6px; margin:18px 0 20px; }
  .page-intro>p:not(.eyebrow) { font-size:13px; }
  .desktop-break { display:none; }
  .writing-toolbar { flex-direction:column; align-items:flex-start; gap:17px; }
  .filters { flex-wrap:nowrap; gap:4px; }
  .filter { min-height:42px; font-size:9px; padding:7px 11px; }
  .filter span { margin-left:5px; font-size:7px; }
  .rss-link { font-size:9px; margin-left:2px; }
  .writing-empty { padding:40px 0 45px; }
  .writing-empty .eyebrow { font-size:7px; letter-spacing:1px; }
  .writing-empty h2 { font-size:26px; }
  .writing-empty>p:not(.eyebrow) { font-size:12px; max-width:330px; }
  .writing-empty>.text-link { font-size:11px; gap:11px; }
  .empty-notebook { width:59px; margin-bottom:22px; }
  .writing-footnote { padding:25px 0 35px; align-items:flex-start; gap:17px; font-size:11px; }
  .post-row h2 { font-size:23px; }
  .post-row .eyebrow { font-size:7px; letter-spacing:.8px; }
  .post-row p { font-size:12px; }
  .launch-screen { min-height:260px; padding:21px; }
  .launch-caption { font-size:7px; }
  .launch-title { font-size:41px; letter-spacing:-1.5px; }
  .launch-description { grid-template-columns:minmax(0,1fr); gap:22px; padding:28px 0 0; }
  .launch-description h2 { font-size:30px; }
  .video-launch { padding-bottom:40px; }
  .video-topics { padding-bottom:48px; }
  .video-topics>div { grid-template-columns:minmax(0,1fr); gap:24px; margin-top:20px; }
  .video-topics article { padding-top:18px; }
  .video-topics h3 { margin:10px 0; }
  .about-intro { grid-template-columns:minmax(0,1fr); gap:30px; padding:44px 0; }
  .about-intro h1 { font-size:44px; letter-spacing:-1.7px; margin:20px 0; }
  .about-intro>div>p:not(.eyebrow) { font-size:13px; }
  .about-portrait { width:260px; justify-self:start; }
  .about-portrait img { height:330px; }
  .about-story { grid-template-columns:minmax(0,1fr); gap:23px; padding:30px 0 43px; }
  .about-story>.eyebrow { padding:0; }
  .about-story .large-copy { font-size:25px; }
  .about-story>div>p:not(.large-copy) { font-size:13px; }
  .experience-section { padding:12px 0 35px; }
  .experience-row { grid-template-columns:minmax(0,1fr); gap:9px; padding:23px 0; }
  .experience-date { display:flex; align-items:center; gap:12px; padding:0; font-size:8px; }
  .experience-date>span { margin:0; font-size:7px; }
  .experience-company h3 { font-size:17px; }
  .experience-company p { margin-top:2px; }
  .experience-row>p { max-width:480px; }
  .projects-section { padding:0 0 44px; }
  .projects-section .section-heading { flex-direction:column; align-items:flex-start; }
  .project-grid { grid-template-columns:minmax(0,1fr); gap:15px; }
  .project-card { padding:20px 0; }
  .project-card h3 { font-size:23px; margin-top:22px; }
  .project-card>p { margin-bottom:20px; }
  .education-section { grid-template-columns:minmax(0,1fr); gap:0; }
  .education-section>img { height:180px; }
  .education-section>div { padding:25px; }
  .education-section h2 { font-size:31px; }
  .about-offline { padding-block:44px; }
  .article { padding-top:33px; }
  .article-back { margin-bottom:25px; }
  .article-header .eyebrow { font-size:7px; letter-spacing:.7px; }
  .article-header h1 { font-size:36px; letter-spacing:-1.3px; }
  .article-description { font-size:14px; }
  .prose { font-size:15px; }
  .prose h2 { font-size:25px; }
  .article-footer { padding-bottom:44px; align-items:flex-start; font-size:11px; }
  .article-footer>.text-link { font-size:10px; }
  .not-found { padding:44px 0 65px; }
  .not-found h1 { font-size:36px; }
  .not-found p:not(.eyebrow) { font-size:13px; }
  .not-found-star { font-size:65px; }
  .footer-top { padding-block:24px; }
  .footer-top>p { font-size:11px; }
  .footer-top>.text-link { font-size:10px; gap:12px; }
  .footer-bottom { flex-direction:column; align-items:flex-start; gap:14px; padding:17px 0 25px; font-size:8px; }
  .social-links { gap:24px; }
}
@media(max-width:375px) {
  .wrap { width:calc(100% - 32px); }
  .brand { font-size:11px; }
  .brand-symbol { margin-right:6px; font-size:12px; }
  .header-controls { gap:0; }
  .theme-toggle { width:35px; }
  .menu-toggle { font-size:10px; gap:5px; }
  .hero h1 { font-size:40px; letter-spacing:-1.7px; }
  .hero-actions { gap:18px; }
  .hero-actions .text-link { font-size:10px; gap:8px; }
  .button { padding:10px 13px; gap:16px; font-size:11px; }
  .chapter-detail span { margin-left:6px; font-size:7px; }
  .section-heading { flex-direction:column; align-items:flex-start; gap:14px; }
  .page-intro h1 { font-size:38px; }
  .about-intro h1 { font-size:40px; }
  .filter { padding:7px 9px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none!important; transition:none!important; }
  [data-reveal] { opacity:1; transform:none; }
}
@media print {
  [data-reveal] { opacity:1!important; transform:none!important; }
  .theme-toggle,.menu-toggle { display:none!important; }
}

/* Channel pages share the site's type and palette. */
.channel-wordmark { text-transform:lowercase; text-wrap:balance; }
.channel-period { color:var(--green); }
.channel-hero { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:72px; align-items:center; padding:72px 0 62px; }
.channel-intro h1 { max-width:9ch; font-size:clamp(64px,7.6vw,94px); line-height:1.02; letter-spacing:-4.5px; margin:25px 0; }
.channel-tagline { font-size:20px; line-height:1.5; letter-spacing:-.5px; }
.channel-description { max-width:470px; margin-top:17px; color:var(--muted); font-size:14px; line-height:1.9; }
.channel-hero .hero-actions { gap:22px; flex-wrap:wrap; }
.channel-hero .hero-footnote { margin-top:23px; }
.curiosity-map { border:1px solid var(--line); border-radius:5px; overflow:hidden; background:var(--surface); }
.curiosity-chrome { height:43px; padding:0 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); font:10px var(--mono); color:var(--muted); }
.curiosity-chrome>span:last-child { color:var(--green); font-size:18px; }
.curiosity-body { padding:27px 28px; background-image:radial-gradient(var(--grid) .65px,transparent .65px); background-size:21px 21px; }
.curiosity-caption { display:block; font:8px/1.6 var(--mono); letter-spacing:.8px; color:var(--muted); margin-bottom:25px; }
.curiosity-step { position:relative; display:flex; align-items:center; gap:20px; padding:0 0 28px; }
.curiosity-step::before { content:''; position:absolute; left:13px; top:28px; bottom:0; border-left:1px solid var(--line); }
.curiosity-step>span { z-index:1; display:grid; place-items:center; width:28px; height:28px; flex-shrink:0; background:var(--surface); border:1px solid var(--line); border-radius:3px; font:9px var(--mono); color:var(--muted); }
.curiosity-step>p { font-size:19px; letter-spacing:-.5px; }
.curiosity-loop { padding-bottom:0; }
.curiosity-loop::before { display:none; }
.curiosity-loop>span { color:var(--green); font-size:17px; border-color:var(--green); }
.curiosity-loop>p { color:var(--green); }
.curiosity-loop em { font-style:normal; }
.curiosity-bottom { margin:30px 0 0; padding-top:17px; border-top:1px solid var(--line); }
.channel-status { display:flex; align-items:center; gap:25px; border-block:1px solid var(--line); padding:22px 0; }
.channel-status .soon-pill { flex-shrink:0; }
.channel-status>p { font-size:12px; color:var(--muted); }
.channel-topics,.published-videos { padding-block:65px; }
.topic-list-note { font:8px/1.7 var(--mono); color:var(--muted); letter-spacing:.6px; text-align:right; }
.first-topic { display:grid; grid-template-columns:1fr 2.3fr; border:1px solid var(--line); border-radius:4px; overflow:hidden; background:var(--surface); }
.first-topic-label { padding:30px; display:flex; flex-direction:column; justify-content:space-between; gap:26px; border-right:1px solid var(--line); background-image:radial-gradient(var(--grid) .65px,transparent .65px); background-size:21px 21px; }
.first-topic-label .eyebrow { font-size:8px; }
.topic-monogram { font:clamp(28px,4vw,42px)/1.4 var(--mono); letter-spacing:-2px; color:var(--green); }
.first-topic-copy { padding:31px 35px; }
.first-topic-copy h3 { font-size:29px; line-height:1.25; letter-spacing:-1px; }
.first-topic-copy>p { color:var(--muted); font-size:13px; line-height:1.9; margin-top:16px; }
.topic-tags { display:flex; flex-wrap:wrap; gap:7px 17px; margin:20px 0; }
.topic-tags>span { font:9px/1.6 var(--mono); color:var(--muted); }
.topic-tags>span::before { content:'↳ '; color:var(--green); }
.first-topic-copy .text-link { font-size:11px; }
.rabbit-hole-list { margin-top:25px; }
.rabbit-hole { border-bottom:1px solid var(--line); }
.rabbit-hole summary { display:grid; grid-template-columns:180px minmax(0,1fr) 24px; gap:24px; align-items:center; padding:26px 0; cursor:pointer; list-style:none; }
.rabbit-hole summary::-webkit-details-marker { display:none; }
.rabbit-hole summary:focus-visible { outline:2px solid var(--green); outline-offset:5px; }
.rabbit-hole-category { font:8px/1.7 var(--mono); letter-spacing:.5px; color:var(--muted); }
.rabbit-hole-title { font-size:20px; font-weight:500; line-height:1.4; letter-spacing:-.5px; }
.disclosure-icon { color:var(--green); font:22px/1 var(--mono); justify-self:end; transition:transform .2s; }
.rabbit-hole[open] .disclosure-icon { transform:rotate(45deg); }
.rabbit-hole summary:hover .rabbit-hole-title { color:var(--green); }
.rabbit-hole-body { padding:0 48px 26px 204px; }
.rabbit-hole-body p { color:var(--muted); font-size:13px; line-height:1.9; max-width:650px; }
.rabbit-hole-body code { font:11px var(--mono); color:var(--ink); }
.rabbit-hole-body .topic-tag { display:block; margin-top:17px; font-size:7px; }
.channel-about { display:grid; grid-template-columns:1fr 1.5fr; gap:80px; border-top:1px solid var(--line); padding-block:43px 65px; }
.channel-about h2 { font-size:36px; margin-top:19px; }
.channel-about>div>p:not(.eyebrow) { color:var(--muted); font-size:13px; line-height:1.95; }
.channel-about>div>p+p { margin-top:15px; }
.channel-about .text-link { margin-top:20px; }
.about-channel-link { color:var(--green); text-decoration:underline; text-underline-offset:3px; }
.published-videos { border-bottom:1px solid var(--line); }
.published-video { display:grid; grid-template-columns:50px minmax(0,1fr) auto; gap:24px; align-items:center; padding:27px 0; border-top:1px solid var(--line); }
.episode-number { font:13px var(--mono); color:var(--green); }
.published-video h3 { font-size:25px; letter-spacing:-.7px; line-height:1.3; margin:12px 0; }
.published-video p { font-size:13px; color:var(--muted); }
.episode-watch { font:10px var(--mono); color:var(--green); }
.published-video:hover h3 { color:var(--green); }
.social-links { flex-wrap:wrap; }
@media(max-width:1050px) {
  .channel-hero { gap:35px; }
  .channel-intro h1 { font-size:74px; }
  .curiosity-body { padding:23px 20px; }
  .curiosity-step { gap:14px; }
  .curiosity-step>p { font-size:17px; }
  .first-topic-label { padding:25px; }
}
@media(max-width:760px) {
  .channel-hero { grid-template-columns:minmax(0,1fr); padding:44px 0 35px; gap:36px; }
  .channel-intro h1 { font-size:76px; letter-spacing:-3.5px; }
  .channel-intro>.eyebrow { font-size:8px; letter-spacing:1px; }
  .channel-tagline { font-size:18px; }
  .channel-description { font-size:13px; }
  .curiosity-map { width:100%; max-width:460px; justify-self:center; }
  .curiosity-body { padding:25px; }
  .curiosity-step>p { font-size:20px; }
  .channel-status { align-items:flex-start; flex-direction:column; gap:12px; padding:21px 0; }
  .channel-topics,.published-videos { padding-block:43px; }
  .channel-topics .section-heading { align-items:flex-start; flex-direction:column; gap:17px; }
  .topic-list-note { text-align:left; }
  .first-topic { grid-template-columns:minmax(0,1fr); }
  .first-topic-label { padding:20px 24px; flex-direction:row; align-items:center; flex-wrap:wrap; gap:14px; border-right:0; border-bottom:1px solid var(--line); }
  .first-topic-label .topic-tag { display:none; }
  .topic-monogram { font-size:25px; margin-left:auto; }
  .first-topic-copy { padding:25px 24px; }
  .first-topic-copy h3 { font-size:26px; }
  .rabbit-hole summary { grid-template-columns:minmax(0,1fr) 20px; gap:9px 16px; padding-block:23px; }
  .rabbit-hole-category { grid-column:1; }
  .rabbit-hole-title { grid-column:1; font-size:19px; }
  .disclosure-icon { grid-column:2; grid-row:1/3; }
  .rabbit-hole-body { padding:0 30px 24px 0; }
  .channel-about { grid-template-columns:minmax(0,1fr); gap:25px; padding-block:34px 45px; }
  .channel-about h2 { font-size:30px; }
  .published-video { grid-template-columns:28px minmax(0,1fr); gap:14px; }
  .episode-watch { grid-column:2; }
  .published-video h3 { font-size:22px; }
}
@media(max-width:375px) {
  .channel-intro h1 { font-size:62px; letter-spacing:-3px; }
  .channel-intro>.eyebrow { font-size:7px; letter-spacing:.5px; }
  .channel-hero .hero-actions { gap:18px; }
  .channel-tagline { font-size:17px; }
}

/* A personal blog: a short introduction, quiet tools, and room for reading. */
.writing-index-page>.wrap,.writing-index-page .blog-index,.writing-index-page .terminal.wrap { width:min(900px,calc(100% - 96px)); }
.writing-index-page .site-header { height:88px; }
.writing-index-page .site-footer .footer-top { display:none; }
.writing-index-page .site-footer .footer-bottom { border-top:0; padding-block:24px; }
.blog-index { padding-block:0 48px; }
.author-intro { padding-block:43px 39px; max-width:680px; }
.intro-label { color:var(--muted); font:10px/1.6 var(--mono); letter-spacing:1.3px; }
.author-intro h1 { font:400 58px/1.08 var(--serif); letter-spacing:-1.1px; margin:13px 0 17px; }
.intro-description { color:var(--muted); font-size:16px; line-height:1.8; max-width:610px; }
.intro-link { display:inline-flex; align-items:center; gap:13px; font-size:12px; color:var(--green); margin-top:17px; }
.intro-link:hover { color:var(--green-hover); text-decoration:underline; text-underline-offset:4px; }
.writing-collection { border-top:1px solid var(--line); padding-top:26px; }
.blog-heading { display:flex; align-items:center; justify-content:space-between; gap:28px; }
.writing-heading { display:flex; align-items:center; gap:22px; }
.writing-heading h2 { font:400 32px/1.2 var(--serif); letter-spacing:-.3px; white-space:nowrap; }
.writing-heading .rss-link { font:11px var(--sans); }
.blog-search { display:flex; align-items:center; gap:11px; min-height:42px; width:285px; border:1px solid var(--line); background:transparent; border-radius:4px; padding:0 12px; transition:border-color .2s,background .2s; }
.blog-search:focus-within { border-color:var(--green); background:var(--surface); }
.search-icon { width:15px; height:15px; fill:none; stroke:var(--muted); stroke-width:1.4; flex-shrink:0; }
.blog-search input { flex:1; width:100%; min-width:0; font:13px/1.6 var(--sans); color:var(--ink); border:0; outline:0; padding:10px 0; background:none; border-radius:0; caret-color:var(--green); }
.blog-search input::placeholder { color:var(--muted); }
.blog-search input::-webkit-search-cancel-button { display:none; }
.search-shortcut { border:1px solid var(--line); border-radius:3px; width:20px; height:22px; display:grid; place-items:center; font:10px var(--mono); color:var(--muted); }
.search-clear { width:24px; height:28px; display:grid; place-items:center; flex-shrink:0; padding:0; border:0; background:none; color:var(--muted); font:20px var(--sans); border-radius:3px; }
.search-clear:hover { background:var(--surface-hover); color:var(--ink); }
.search-hint { color:var(--muted); font:11px/1.7 var(--sans); margin-top:10px; }
.blog-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:17px 0 13px; border-bottom:1px solid var(--line); }
.blog-toolbar .filters { display:flex; gap:7px; flex-wrap:wrap; }
.blog-toolbar .filter { font:12px var(--sans); min-height:32px; padding:6px 12px; border:1px solid transparent; border-radius:20px; }
.blog-toolbar .filter.active { color:var(--ink); background:var(--surface); border-color:var(--line); }
.search-count { color:var(--muted); font:11px/1.6 var(--sans); text-align:right; margin-left:auto; }
.blog-index .post-row { display:grid; grid-template-columns:110px minmax(0,1fr) 18px; align-items:baseline; gap:26px; padding:27px 0; }
.blog-index .post-row time { color:var(--muted); font:11px/1.7 var(--sans); }
.blog-index .post-row h2 { font:400 31px/1.15 var(--serif); letter-spacing:-.2px; margin:0; overflow-wrap:anywhere; transition:color .15s; }
.blog-index .post-row p { font-size:14px; line-height:1.75; margin-top:9px; overflow-wrap:anywhere; }
.post-meta { display:flex; gap:8px; color:var(--muted); font:11px/1.6 var(--sans); margin-top:12px; }
.blog-index .row-arrow { position:static; font-size:17px; }
.blog-index .post-row:hover .row-arrow { color:var(--green); transform:translate(2px,-2px); }
.blog-index .post-match { padding-left:13px; border-left:2px solid var(--line); font:11px/1.8 var(--mono); margin-top:15px; }
.blog-index mark { background:var(--selection); color:var(--ink); border-radius:2px; }
.blog-empty { padding:30px 0 22px; }
.blog-empty h2 { font:400 27px/1.3 var(--serif); letter-spacing:0; overflow-wrap:anywhere; }
.blog-empty p { color:var(--muted); font-size:13px; margin-top:8px; }
.reset-search { background:none; border:0; padding:0; color:var(--green); margin-top:18px; }
.article-header h1 { font:400 56px/1.08 var(--serif); letter-spacing:-.8px; }
.article-description { font-size:18px; line-height:1.7; }
.prose { font-family:Georgia,serif; font-size:18px; line-height:1.85; }
.prose h2,.prose h3 { font-family:var(--sans); }
.prose h2 { font-size:26px; }
.prose h3 { font-size:21px; }
.prose table { font-size:16px; line-height:1.7; }
.prose th,.prose td { overflow-wrap:normal; }
.prose th:first-child,.prose td:first-child { white-space:nowrap; }
.prose .toc { margin:30px 0 40px; padding:22px 0; border-block:1px solid var(--line); font:13px/1.65 var(--sans); }
.prose .toctitle { display:block; color:var(--muted); font:10px var(--mono); letter-spacing:1px; text-transform:uppercase; margin-bottom:14px; }
.prose .toc ul { list-style:none; padding:0; margin:0; columns:2; column-gap:26px; }
.prose .toc li { break-inside:avoid; padding:4px 0; }
.prose .toc a { color:var(--muted); text-decoration:none; }
.prose .toc a:hover { color:var(--green); text-decoration:underline; }
.article-flow { margin:32px 0; padding:24px; border:1px solid var(--line); background:var(--surface); border-radius:4px; }
.prose .article-flow ol { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; list-style:none; padding:0; margin:0; font:12px/1.7 var(--sans); }
.article-flow li { position:relative; }
.article-flow li+li::before { content:'→'; position:absolute; left:-23px; top:27px; color:var(--muted); }
.article-flow strong,.article-flow span { display:block; }
.article-flow strong { font-size:15px; font-weight:500; margin:10px 0 6px; }
.article-flow span { color:var(--muted); }
.article-flow .flow-step { font:9px/1.5 var(--mono); letter-spacing:.5px; }
.article-flow figcaption { border-top:1px solid var(--line); margin-top:22px; padding-top:15px; color:var(--muted); font:11px/1.7 var(--sans); }
@media(max-width:600px) {
  .prose .toc ul { columns:1; }
  .article-flow { padding:20px; }
  .prose .article-flow ol { grid-template-columns:1fr; gap:20px; }
  .article-flow li+li { border-top:1px solid var(--line); padding-top:18px; }
  .article-flow li+li::before { content:none; }
}

/* Open, compact welcome; a larger scrollback appears once a command is run. */
.terminal-dock { --paper:#24231f; --ink:#f3eee3; --muted:#b6b0a3; --line:#48453c; --surface:#2b2924; --surface-hover:#353229; --green:#e4b18c; --green-hover:#f5ceb0; --selection:#594431; color:var(--ink); background:var(--paper); }
.terminal-dock[data-expanded="true"] { box-shadow:0 -8px 24px #0000000a; }
.terminal-meta { min-height:34px; }
.terminal-welcome { color:var(--ink); font:13px/1.6 var(--sans); padding:1px 0 6px; }
.terminal-output { height:min(180px,calc(var(--terminal-viewport,100dvh) * .28)); }
.terminal-dock[data-welcome="true"] .terminal-output { display:none; }
.terminal-dock[data-welcome="false"] .terminal-welcome { display:none; }
.terminal-suggestions { gap:10px 25px; padding:4px 0 13px; margin-left:0; }
.terminal-suggestions button { display:flex; align-items:baseline; gap:8px; padding:3px 0; }
.terminal-suggestions code { font:11px var(--mono); }
.terminal-suggestions span { color:var(--muted); font:11px var(--sans); }
.terminal-form { min-height:58px; }
.terminal-expand { min-width:86px; }
@media(prefers-reduced-motion:no-preference) {
  .author-intro { animation:enter .45s ease-out both; }
}
@media(max-width:760px) {
  .writing-index-page>.wrap,.writing-index-page .blog-index,.writing-index-page .terminal.wrap { width:calc(100% - 40px); }
  .writing-index-page .site-header { height:76px; }
  .writing-index-page .mobile-nav { top:75px; }
  .brand { font-size:15px; }
  .blog-index { padding-bottom:30px; }
  .author-intro { padding-block:29px 28px; }
  .intro-label { font-size:9px; }
  .author-intro h1 { font-size:46px; margin-block:11px 13px; }
  .intro-description { font-size:14px; line-height:1.75; }
  .intro-link { margin-top:13px; }
  .writing-collection { padding-top:22px; }
  .blog-heading { align-items:stretch; flex-direction:column; gap:16px; }
  .writing-heading { justify-content:space-between; }
  .writing-heading h2 { font-size:30px; }
  .blog-search { width:100%; }
  .blog-search input { font-size:16px; padding-block:9px; }
  .blog-search input::placeholder { font-size:13px; }
  .search-shortcut { display:none; }
  .blog-toolbar { gap:10px; padding-top:13px; }
  .blog-toolbar .filter { min-height:38px; padding-inline:11px; font-size:11px; }
  .search-count { font-size:11px; }
  .blog-index .post-row { grid-template-columns:minmax(0,1fr) 18px; gap:8px 16px; padding-block:24px; }
  .blog-index .post-row time { grid-column:1; }
  .post-copy { grid-column:1; }
  .blog-index .post-row .row-arrow { grid-column:2; grid-row:2; }
  .blog-index .post-row h2 { font-size:29px; }
  .blog-index .post-row p { font-size:13px; }
  .blog-empty { padding-block:26px; }
  .blog-empty h2 { font-size:26px; }
  .article-header h1 { font-size:42px; }
  .prose { font-size:17px; }
  .terminal-meta { gap:0 12px; min-height:31px; padding-block:7px; }
  .terminal-hint { font-size:8px; }
  .terminal-welcome { font-size:12px; padding-bottom:3px; }
  .terminal-suggestions { gap:4px 18px; padding-bottom:9px; }
  .terminal-suggestions button { gap:7px; }
  .terminal-suggestions span { font-size:10px; }
  .terminal-suggestions button[data-command="about"],.terminal-suggestions button[data-command="help"] { display:none; }
  .terminal-form { gap:7px; min-height:54px; }
  .terminal-form input { font-size:16px; }
  .terminal-form input::placeholder { font-size:11px; }
  .terminal-expand { min-width:32px; width:32px; }
  .terminal-output { height:min(155px,calc(var(--terminal-viewport,100dvh) * .24)); }
}
@media(max-width:375px) {
  .writing-index-page>.wrap,.writing-index-page .blog-index,.writing-index-page .terminal.wrap { width:calc(100% - 32px); }
  .brand { font-size:14px; }
  .blog-toolbar .filter { padding-inline:9px; }
}