:root{--paper:#eeede5;--ink:#343b2c;--muted:#696d5b;--line:#c9c6b9;--green:#344c3c;--cream:#f1ecdf;--copper:#945d3f;--burst-orange:#ce7b36;--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif;--mono:'Courier New',monospace;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6}::selection{background:#c9d0b8;color:#243427}a{color:inherit;text-decoration-thickness:1px;text-underline-offset:4px}a:focus-visible{outline:2px solid var(--copper);outline-offset:6px}.page{max-width:1180px;margin:auto;padding:0 48px}.masthead{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:96px;}.monogram{font-family:var(--serif);font-style:italic;font-size:32px;letter-spacing:-3px;text-decoration:none}.location{font-family:var(--mono);font-size:12px;color:var(--muted)}.contact{font-size:14px;text-decoration:none}.arrow{display:inline-block;transition:transform .22s ease}a:hover .arrow{transform:translate(3px,-3px)}.eyebrow{font-family:var(--mono);font-size:12px;line-height:1.5;letter-spacing:1.4px;text-transform:uppercase;font-weight:400;margin:0}.intro{padding:24px 0 20px;animation:arrive .75s ease both}.intro>.eyebrow{color:var(--muted)}h1{font-family:var(--serif);font-size:clamp(64px,8vw,100px);font-weight:400;line-height:1.08;letter-spacing:-5px;margin:18px 0 22px}.period{color:var(--copper)}.intro-bottom{display:flex;justify-content:space-between;align-items:end;gap:24px}.intro-bottom p{font-family:var(--serif);font-size:clamp(23px,3vw,31px);line-height:1.35;margin:0;letter-spacing:-.6px}.intro-bottom p span{color:var(--muted)}.jump{width:44px;height:44px;flex-shrink:0;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;text-decoration:none;transition:background .2s,transform .2s}.jump:hover{background:#dedfd1;transform:translateY(3px)}.columns{display:grid;grid-template-columns:minmax(0,.87fr) minmax(0,1.13fr);gap:64px;padding-top:16px;align-items:start}.background{padding-top:10px;animation:arrive .8s .1s ease both}.bio>.eyebrow,.history>.eyebrow{margin-bottom:18px;color:var(--muted)}.bio p{font-size:17px;line-height:1.65;margin:0 0 16px;max-width:35ch}.history{margin-top:36px}.work-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 0;text-decoration:none}.work-row strong{display:block;font-family:var(--serif);font-size:23px;font-weight:400;line-height:1.4}.work-row small{display:block;font-size:14px;color:var(--muted);margin-top:2px}.work-row .arrow{font-size:20px}.text-link{display:inline-block;font-size:14px;margin-top:12px}.off-hours{display:flex;align-items:center;gap:22px;margin-top:42px}.off-hours img{display:block;object-fit:cover;object-position:38% 50%;border:5px solid #e0d8c7;box-shadow:0 2px 4px #30251d15;transform:rotate(-5deg)}.off-hours p{font-size:14px;line-height:1.6;margin:7px 0 0;color:var(--muted)}.podcast{background:transparent;color:var(--ink);padding:10px 0 0;position:relative;animation:arrive .9s .16s ease both}.podcast-top{display:flex;justify-content:space-between;gap:16px;align-items:center}.podcast-top .eyebrow{letter-spacing:.7px}.issue{font-family:var(--mono);font-size:12px;white-space:nowrap;color:#c5cebd}.podcast h2{font-family:var(--serif);font-size:clamp(64px,7vw,92px);font-weight:400;line-height:.87;letter-spacing:-5px;margin:32px 0 22px;position:relative}.podcast h2 em{font-weight:400}.star{position:absolute;right:8px;top:17px;font-size:60px;color:#c5cba9;line-height:1;transition:transform .8s ease}.podcast:hover .star{transform:rotate(60deg)}.podcast-deck{font-family:var(--serif);font-size:23px;line-height:1.3;margin:0 0 13px}.podcast-detail{color:#d2d9cb;font-size:14px;line-height:1.5;max-width:33ch;margin-bottom:26px}.player-heading{display:flex;justify-content:space-between;align-items:center;padding:0 0 18px}.player-heading .eyebrow{letter-spacing:1px}iframe{display:block;max-width:100%;border:0;border-radius:12px;background:#243328}.show-links{display:flex;justify-content:space-between;gap:18px;margin-top:16px;flex-wrap:wrap}.show-links a{font-size:14px;text-decoration:none}.invitation{padding:42px 0 46px;margin-top:48px}.invitation>.eyebrow{color:var(--muted)}.invitation h2{font-family:var(--serif);font-weight:400;font-size:clamp(30px,4.5vw,47px);line-height:1.2;letter-spacing:-1.5px;margin:13px 0 12px}.invitation>a{font-size:16px}footer{margin-top:48px;padding:20px 0 26px;display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);font-size:12px;color:var(--muted)}footer a{text-decoration:none}.skip{position:absolute;left:20px;top:-80px;padding:12px;background:var(--paper);z-index:5}.skip:focus{top:10px}@keyframes arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:800px){.page{padding:0 28px}.columns{gap:30px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.podcast{padding:10px 0 0}.issue{display:none}h1{letter-spacing:-5px}.podcast h2{font-size:70px}.star{font-size:44px;right:0}.bio p{font-size:16px}}
@media(max-width:620px){.page{padding:0 22px}.masthead{min-height:76px}.location{font-size:12px}#sf-time{display:none}.contact{font-size:14px}.intro{padding:38px 0 30px}h1{font-size:clamp(56px,13.5vw,84px);letter-spacing:-4px;margin:20px 0}.intro>.eyebrow{letter-spacing:.4px}.intro-bottom p{font-size:22px}.columns{grid-template-columns:1fr;gap:30px;padding-top:28px}.podcast{padding:0}.podcast h2{font-size:86px}.star{font-size:62px;right:10px}.bio p{max-width:none}.background{padding-top:0}.history{margin-top:30px}.off-hours{margin-top:30px}.invitation{margin-top:36px;padding:30px 0 36px}footer{flex-wrap:wrap}footer>span:nth-child(2){display:none}}
.columns{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr)}
.bio p{max-width:43ch}.work-row{padding:16px 0;align-items:start}.work-row>span:first-child{min-width:0}.work-row .arrow{flex-shrink:0;margin-top:4px}.work-description{font-size:16px;line-height:1.55;margin:7px 0 0;color:var(--muted)}.work-row strong{font-size:22px}.work-row small{margin-top:4px}.history{margin-top:28px}.background,.podcast{padding-top:0}
@media(max-width:620px){.columns{grid-template-columns:1fr}.work-row{padding:14px 0}}
.masthead{min-height:80px}.intro{padding:8px 0 12px}h1{margin:18px 0 14px}.columns{grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:72px;padding-top:8px}.bio p{max-width:48ch}.personal{padding-top:4px;animation:arrive .8s .12s ease both}.listen-link{display:flex;align-items:center;justify-content:space-between;gap:20px;font-family:var(--serif);font-size:22px;line-height:1.4;text-decoration:none;color:var(--green)}.show-site{display:inline-block;margin-top:10px;font-size:14px;color:var(--muted);text-decoration:none}.personal-note{font-size:16px;line-height:1.65;color:var(--muted);margin:32px 0 0;max-width:27ch}.history>.eyebrow{margin-bottom:10px}footer{margin-top:36px}
@media(max-width:800px){.columns{gap:32px;grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr)}}
@media(max-width:620px){.masthead{min-height:68px}.intro{padding:12px 0 14px}h1{margin:12px 0}.columns{grid-template-columns:1fr;gap:28px;padding-top:6px}.personal{padding-top:0}.personal-note{max-width:36ch;margin-top:22px}.listen-link{justify-content:flex-start}.history{margin-top:26px}}
.page{max-width:860px}.columns{display:block}.bio p,.bio .personal-note{max-width:none}.bio .personal-note{font-size:16px;color:var(--muted);margin:12px 0 0}.podcast{margin-top:28px;width:100%;max-width:none}.history{width:100%;max-width:none}.history>.eyebrow{margin-bottom:4px}.history>.work-row:first-of-type{padding-top:0}
.site-nav,.footer-nav{display:flex;align-items:center;gap:22px}.site-nav{font-size:14px;flex-shrink:0}.site-nav a{text-decoration:none}.site-nav .contact{color:var(--copper);font-style:italic}.site-nav a,.footer-nav a,.personal-note a{transition:color .2s ease}.site-nav a:hover,.footer-nav a:hover,.personal-note a:hover{color:var(--copper)}.site-nav .contact:hover{color:var(--green)}.site-nav [aria-current]{text-decoration:underline;text-underline-offset:5px}.home-link{font-family:var(--serif);font-size:22px;text-decoration:none}.writing-page{min-height:100svh;display:flex;flex-direction:column}.writing-page main{flex:1}.writing-empty{margin:8px 0 48px;color:var(--muted)}
@media(max-width:380px){.masthead{flex-wrap:wrap;gap:8px;padding:16px 0}.site-nav,.footer-nav{gap:16px}}
.work-row small{color:var(--copper);font-style:italic}.site-nav{gap:12px}.nav-separator{color:var(--muted);font-style:normal}

/* Quiet material and interaction pass. */
body{
  background-color:var(--paper);
  background-image:
    radial-gradient(circle at 18% 8%,rgba(255,255,255,.24),transparent 38%),
    radial-gradient(circle at 84% 72%,rgba(52,76,60,.035),transparent 42%);
  background-size:100% 100%,100% 100%;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:1;
  pointer-events:none;
  background-image:linear-gradient(90deg,rgba(48,55,44,.018) 1px,transparent 1px),linear-gradient(rgba(148,93,63,.014) 1px,transparent 1px);
  background-size:5px 5px,7px 7px;
}
.page{position:relative;z-index:2}
a,.work-row strong{transition:color .2s ease,opacity .2s ease}
a:hover{color:var(--copper)}
.site-nav a{color:var(--copper)}
.site-nav a:hover{color:var(--green)}
.nav-separator{color:var(--muted)}
.podcast{
  margin-top:26px;
  padding:0;
  border-radius:12px;
  background:transparent;
  box-shadow:none;
}
.podcast iframe{height:152px;border-radius:12px}
@media(max-width:620px){.podcast{padding:0;border-radius:12px}.podcast iframe{height:152px}}
/* Writing archive. */
.site-nav .contact{font-style:normal}
.writing-intro{max-width:760px;padding-bottom:34px}
.writing-intro h1{margin-bottom:20px}
.writing-intro p{max-width:65ch;margin:0;font-family:var(--serif);font-size:21px;line-height:1.52;color:var(--muted)}
.writing-index{padding:10px 0 42px}
.writing-index>.eyebrow{margin-bottom:20px;color:var(--muted)}
.writing-list{display:grid;gap:30px;max-width:760px}
.writing-row{display:block;text-decoration:none}
.writing-row h2{margin:5px 0;font-family:var(--serif);font-size:30px;font-weight:400;line-height:1.25;transition:color .2s ease}
.writing-row p{max-width:62ch;margin:0;color:var(--muted);font-size:16px;line-height:1.55}
.writing-meta{display:block;font-family:var(--mono);font-size:12px;color:var(--copper);text-transform:uppercase}
.read-label{display:inline-block;margin-top:8px;font-size:14px;color:var(--green)}
.writing-row h2 a,.writing-row .read-label{text-decoration:none}
.writing-row h2 a:hover,.writing-row .read-label:hover{color:var(--copper)}
.article-page main{display:block}
.article{max-width:720px;padding:26px 0 34px}
.article-back{display:inline-block;margin-bottom:38px;font-size:14px;text-decoration:none}
.article>h1{font-size:58px;line-height:1.08;letter-spacing:0;margin:12px 0 20px}
.article-deck{margin:0 0 52px;font-family:var(--serif);font-size:23px;line-height:1.48;color:var(--muted)}
.article section{margin:0 0 44px}
.article section h2{font-family:var(--serif);font-size:30px;font-weight:400;line-height:1.25;margin:0 0 16px}
.article section h3{font-family:var(--serif);font-size:21px;font-weight:400;line-height:1.35;margin:24px 0 8px}
.article section p,.article section li{font-size:17px;line-height:1.72}
.article section p{margin:0 0 16px}
.article section ul{padding-left:22px;margin:12px 0 18px}
.article .source-link,.source-list{font-size:14px}
.source-link a,.source-list a{color:var(--copper)}
.source-link a:hover,.source-list a:hover{color:var(--green)}
.position-list,.program-list{display:grid;gap:20px}
.position-list h3,.program-list h3{margin-top:0}
.position-list p:last-child,.program-list p:last-child{margin-bottom:0}
@media(max-width:620px){.writing-intro{padding-top:24px}.writing-intro p{font-size:19px}.writing-row h2{font-size:27px}.article{padding-top:18px}.article-back{margin-bottom:30px}.article>h1{font-size:42px}.article-deck{font-size:20px;margin-bottom:40px}.article section h2{font-size:27px}.article section p,.article section li{font-size:16px}}

/* Expandable writing collections. */
.writing-intro{padding-bottom:22px}
.writing-collections{max-width:760px;padding:0 0 54px}
.collection,.subcollection{margin:0}
.collection+ .collection{margin-top:18px}
.collection>summary,.subcollection>summary{display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;list-style:none;color:var(--green)}
.collection>summary::-webkit-details-marker,.subcollection>summary::-webkit-details-marker{display:none}
.collection>summary{font-family:var(--serif);font-size:22px;line-height:1.35;padding:10px 0}
.collection>summary::after,.subcollection>summary::after{content:"+";color:var(--copper);font-family:var(--sans);font-size:20px;font-weight:400;transition:transform .2s ease,color .2s ease}
.collection[open]>summary::after,.subcollection[open]>summary::after{content:"−";color:var(--green)}
.collection>summary:hover,.subcollection>summary:hover{color:var(--copper)}
.collection-body{padding:18px 0 28px 22px}
.collection-intro{max-width:64ch;margin:0 0 30px;font-family:var(--serif);font-size:19px;line-height:1.6;color:var(--muted)}
.collection .writing-list{gap:28px}
.collection .writing-row h2{font-size:27px}
.mba-collection{padding-top:8px}
.subcollection+ .subcollection{margin-top:12px}
.subcollection>summary{font-family:var(--serif);font-size:27px;line-height:1.25;text-transform:none;padding:10px 0}
.subcollection>summary::after{font-size:17px}
.essay-stack{display:grid;gap:46px;padding:24px 0 30px 22px;max-width:680px}
.essay h3{margin:0 0 5px;font-family:var(--serif);font-size:27px;font-weight:400;line-height:1.3}
.essay-question{margin:0 0 22px;color:var(--copper);font-style:italic}
.essay p{font-size:17px;line-height:1.72;margin:0 0 17px}
.essay p:last-child{margin-bottom:0}
@media(max-width:620px){.writing-collections{padding-bottom:40px}.collection>summary{font-size:21px}.collection-body{padding-left:0}.collection .writing-row h2{font-size:25px}.collection-intro{font-size:18px}.essay-stack{padding-left:0;gap:40px}.essay h3{font-size:25px}.essay p{font-size:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

.bread-page .writing-intro{padding-bottom:12px}
.bread-form{max-width:440px;padding-bottom:42px}
.bread-form>label,.bread-form legend{display:block;font-weight:600;font-size:14px;margin:0 0 6px;padding:0}
.bread-form>label span,.bread-form p{color:var(--muted);font-weight:400}
.bread-form>input{display:block;width:100%;margin:0 0 17px;padding:9px 11px;border:1px solid var(--line);border-radius:3px;background:var(--cream);color:var(--ink);font:inherit}
.bread-form .bread-quantity{width:7rem}
.bread-form fieldset{border:0;margin:0 0 17px;padding:0;min-width:0}
.bread-form fieldset label{display:flex;align-items:center;gap:8px;min-height:32px;cursor:pointer}
.bread-form input[type=radio]{accent-color:var(--green);margin:0}
.bread-form button{border:1px solid var(--green);border-radius:3px;padding:10px 19px;background:var(--green);color:var(--cream);font:inherit;cursor:pointer}
.bread-form button:hover{background:var(--ink)}
.bread-form :is(input,button):focus-visible{outline:2px solid var(--copper);outline-offset:3px}
.bread-form p{font-size:14px;margin:8px 0 0}

/* Baking diary uses the writing archive's typography, rules and photo treatment. */
.diary-page .writing-intro{padding-bottom:22px}
.diary-archive{padding-bottom:50px}
.diary-month{max-width:760px;margin:0 0 29px}
.diary-month h2{font-family:var(--mono);font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);font-weight:400;margin:0 0 8px}
.diary-entry{border-top:1px solid var(--line)}
.diary-entry:last-child{border-bottom:1px solid var(--line)}
.diary-entry .diary-row{display:grid;grid-template-columns:88px 125px minmax(0,1fr);align-items:baseline;gap:14px;padding:13px 0;line-height:1.35}
.diary-entry time{font-family:var(--mono);font-size:12px;color:var(--copper)}
.diary-entry strong{font-family:var(--serif);font-weight:400;font-size:20px;color:var(--green)}
.diary-change{font-size:14px;color:var(--muted)}
.diary-entry summary{list-style:none;cursor:pointer;position:relative;padding-right:24px}
.diary-entry summary::-webkit-details-marker{display:none}
.diary-entry summary:focus-visible{outline:2px solid var(--copper);outline-offset:3px}
.diary-entry summary:hover strong{color:var(--copper)}
.diary-expand::after{content:"+";position:absolute;right:0;top:10px;color:var(--copper);font:20px var(--sans)}
.diary-entry details[open] .diary-expand::after{content:"−"}
.diary-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:14px;padding:0 0 22px 102px}
.diary-gallery a{display:block;min-width:0}
.diary-gallery img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border:5px solid #e0d8c7;box-shadow:0 2px 4px #30251d15}
@media(max-width:620px){.diary-entry .diary-row{grid-template-columns:61px minmax(0,1fr);gap:5px 10px}.diary-change{grid-column:2;font-size:13px}.diary-gallery{padding-left:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}

/* Bread belongs alongside the work on the home page. */
.home-bread{margin-top:24px}
.home-bread>.eyebrow{color:var(--muted);margin-bottom:5px}
.bread-links{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bread-links .text-link{margin-top:0}
/* Decorative only: never intercept clicks or keyboard focus. */
.click-burst-canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:20}
.cursor-glow{position:fixed;left:0;top:0;width:40px;height:40px;pointer-events:none;z-index:0;background:radial-gradient(circle,rgba(168,68,13,.05) 0%,rgba(168,68,13,.022) 50%,rgba(168,68,13,0) 85%);clip-path:polygon(25% 0,75% 0,75% 12.5%,87.5% 12.5%,87.5% 25%,100% 25%,100% 75%,87.5% 75%,87.5% 87.5%,75% 87.5%,75% 100%,25% 100%,25% 87.5%,12.5% 87.5%,12.5% 75%,0 75%,0 25%,12.5% 25%,12.5% 12.5%,25% 12.5%);will-change:transform}
.cursor-glow[hidden]{display:none}
.bio>.eyebrow,.games>.eyebrow{margin-bottom:12px;color:var(--muted)}
.games{margin-top:26px}.games p{font-size:15px;margin:0 0 5px}.games .games-note{color:var(--muted);font-size:14px}
.featured-writing{gap:19px;margin:0 0 38px}.featured-writing .writing-row h2{font-size:28px}
.personal-essay{max-width:680px}.personal-essay .essay-body p{font-size:17px;line-height:1.75;margin:0 0 20px}
@media(max-width:620px){.personal-essay .essay-body p{font-size:16px}.games{margin-top:22px}}
.sidequest-intro,.resume-intro{font-size:19px;line-height:1.6;color:var(--muted);margin:0 0 22px}
.bio>.eyebrow{margin-bottom:10px}
.sidequest-list>.work-row:first-child{padding-top:0}
.section-divider{border:0;border-top:1px solid var(--line);margin:35px 0 40px}
.resume-intro{margin-bottom:8px}
.resume-intro+.history{margin-top:0}
@media(max-width:620px){.sidequest-intro,.resume-intro{font-size:18px}}
.collection-body .diary-archive{padding-bottom:0}
.collection-body .diary-month:last-child{margin-bottom:0}
.inline-sabbatical{max-width:680px}
.diary-chart{max-width:760px;margin:4px 0 27px}
.diary-chart-top{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.diary-chart figcaption{font-family:var(--serif);font-size:20px;color:var(--green)}
.diary-chart-count{font-family:var(--mono);font-size:12px;color:var(--copper)}
.diary-chart svg{display:block;width:100%;height:auto}
.diary-chart .chart-baseline{stroke:var(--line);stroke-width:1}
.diary-chart .chart-trace{fill:none;stroke:var(--green);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.diary-chart .chart-label{font-family:var(--mono);font-size:11px;fill:var(--muted)}
.diary-estimate{margin:0;color:var(--muted);font-family:var(--serif);font-size:15px;font-style:italic}
@media(max-width:620px){.diary-chart .chart-label{font-size:20px}}
.home-link img{display:block;width:26px;height:26px;flex:none}
.home-link{display:inline-flex;align-items:center;gap:10px}

/* More breathing room, with shorter reading lines and quieter type. */
.page{max-width:1120px;padding-inline:38px}
.background{max-width:850px}
body{font-size:15px}
h1{font-size:clamp(52px,6vw,72px);letter-spacing:-3.3px}
#name{font-size:clamp(44px,4.5vw,56px);letter-spacing:-2.7px}
.home-link,.work-row strong{font-size:19px}
.sidequest-intro,.resume-intro{font-size:17px}
.work-description,.bio p,.writing-row p,.personal-note,.bio .personal-note{font-size:15px}
.work-row small,.site-nav,.contact,.text-link,.read-label{font-size:13px}
.work-row strong a{text-decoration:none}
.work-row strong a:hover{color:var(--copper)}
.writing-intro p,.collection-intro{font-size:17px}
.collection>summary{font-size:19px}
.subcollection>summary,.writing-row h2,.essay h3{font-size:24px}
.featured-writing .writing-row h2{font-size:25px}
.collection .writing-row h2{font-size:23px}
.essay p,.personal-essay .essay-body p,.article section p,.article section li{font-size:16px}
.article>h1{font-size:52px}
.article-deck{font-size:20px}
.article section h2{font-size:27px}
.article section h3{font-size:19px}
.diary-entry strong,.diary-chart figcaption{font-size:18px}
.diary-change,.games p,.diary-estimate{font-size:13px}
.bread-form>label,.bread-form legend,.bread-form p{font-size:13px}
.sidequest-intro,.resume-intro{margin-bottom:14px}
@media(max-width:800px){.page{padding-inline:28px}}
@media(max-width:620px){.page{padding-inline:22px}.article>h1{font-size:42px}.article section h2{font-size:24px}}

/* The index uses a shared left edge for project names and one for their notes. */
.home-page {
  --entry-gap: 24px;
  --section-gap: clamp(30px, 4vw, 44px);
}
.home-index { max-width: 850px; }
.home-page .intro { padding: 16px 0 28px; }
.home-page h1 { margin: 0; }
.home-index .sidequest-intro,
.home-index .resume-intro {
  margin: 0 0 16px;
  line-height: 1.55;
}
.home-index .section-divider { margin: var(--section-gap) 0; }
.index-section { display: grid; row-gap: var(--entry-gap); }
.index-section > .eyebrow {
  color: var(--muted);
  margin: 0 0 -8px;
}
.index-entry {
  display: grid;
  grid-template-columns: minmax(210px, 0.9fr) minmax(0, 1.65fr);
  column-gap: clamp(30px, 5vw, 64px);
  align-items: first baseline;
}
.index-entry h3 {
  margin: 0;
  font: 400 20px/1.25 var(--serif);
  text-wrap: pretty;
}
.index-entry h3 a { text-decoration: none; }
.index-role {
  margin: 4px 0 0;
  color: var(--copper);
  font-size: 13px;
  font-style: italic;
  line-height: 1.45;
}
.index-detail {
  min-width: 0;
  color: var(--muted);
  line-height: 1.52;
}
.index-detail > p { margin: 0; max-width: 54ch; }
.index-detail > p + p { margin-top: 8px; }
.home-index :is(.index-detail a, .sidequest-intro a),
.listen summary {
  text-decoration: underline;
  text-decoration-color: var(--line);
  text-underline-offset: 3px;
}
.home-index a:hover, .listen summary:hover {
  color: var(--copper);
  text-decoration-color: currentColor;
}
.index-links { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.index-links span { color: var(--copper); }
.listen { margin-top: 4px; }
.listen summary {
  width: fit-content;
  cursor: pointer;
  color: var(--muted);
  font-size: 13px;
  list-style: none;
}
.listen summary::-webkit-details-marker { display: none; }
.listen summary::after { content: " +"; color: var(--copper); }
.listen[open] summary::after { content: " −"; }
.listen iframe { margin-top: 12px; }
.index-section > .text-link { width: fit-content; margin: 0; }
summary:focus-visible { outline: 2px solid var(--copper); outline-offset: 4px; }

/* Consistent rhythm for the archive, reading column and bread form. */
.writing-page .writing-intro, .bread-page .writing-intro { padding: 16px 0 28px; }
.writing-intro h1 { margin: 0; }
.writing-collections { max-width: 720px; padding-bottom: 0; }
.writing-collections > .collection { border-bottom: 1px solid var(--line); }
.writing-collections > .collection:first-child { border-top: 1px solid var(--line); }
.writing-collections > .collection + .collection { margin-top: 0; }
.writing-collections > .collection > summary { padding: 14px 0; }
.collection-body { padding: 12px 0 28px; }
.collection-body > .inline-sabbatical { max-width: 65ch; }
.collection-body > .collection-intro { margin-bottom: 22px; }
.collection-body .essay-stack { padding-bottom: 0; }
.bread-form { padding-bottom: 0; }
.bread-form > input, .bread-form fieldset { margin-bottom: 20px; }
.bread-form fieldset label { width: fit-content; }
.bread-form > p { margin-top: 8px; }
.bread-form input { font-size: 16px; }
.bread-page { min-height: 100svh; display: flex; flex-direction: column; }
.bread-page main { flex: 1; }
.page > footer { margin-top: clamp(40px, 6vw, 64px); }
.footer-nav { flex-wrap: wrap; gap: 10px 20px; }

@media (max-width: 680px) {
  .home-page { --entry-gap: 24px; }
  .home-page .intro, .writing-page .writing-intro, .bread-page .writing-intro { padding: 16px 0 24px; }
  .index-entry { grid-template-columns: 1fr; row-gap: 5px; }
  .index-detail > p { max-width: 58ch; }
  .index-role { margin-top: 2px; }
  .home-index .sidequest-intro, .home-index .resume-intro { margin-bottom: 14px; }
  .writing-collections > .collection > summary { padding-block: 12px; }
}


.chart-controls {
  display: flex;
  gap: 16px;
  margin: 4px 0 12px;
}

.chart-controls button {
  padding: 5px 0 3px;
  border: 0;
  border-bottom: 1px solid transparent;
  background: transparent;
  color: var(--muted);
  font: 12px/1.5 var(--mono);
  cursor: pointer;
}

.chart-controls button[aria-pressed="true"] {
  border-bottom-color: currentColor;
  color: var(--green);
}

.chart-controls button:hover {
  color: var(--copper);
}

.chart-controls button:focus-visible {
  outline: 2px solid var(--copper);
  outline-offset: 3px;
}


.chart-controls[hidden] { display: none; }
.entry-note { display: inline-block; margin-top: 4px; font-size: 13px; }
.archive-link {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  margin: 0;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.archive-link a { color: var(--green); font: 19px/1.35 var(--serif); text-decoration: none; }
.archive-link a:hover { color: var(--copper); text-decoration: underline; }
.archive-link span { color: var(--muted); font: 12px var(--mono); }
@media (max-width: 680px) { .archive-link { padding-block: 12px; } }
