:root{
  --ink:#172331;
  --muted:#566372;
  --blue:#1f49ce;
  --paper:#fff;
  --wash:#f2f5f9;
  --line:#dbe1e9;
  --navy:#142738;
  --mono:ui-monospace,SFMono-Regular,Consolas,monospace;
  --serif:Georgia,'Times New Roman',serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}

*{
  box-sizing:border-box}
html{
  scroll-behavior:smooth;
  scroll-padding-top:2rem}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:1rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased}
a{
  color:var(--blue);
  text-underline-offset:.23em;
  text-decoration-thickness:1px}
a:hover{
  text-decoration:underline}
a:focus-visible,button:focus-visible,summary:focus-visible{
  outline:3px solid var(--blue);
  outline-offset:5px}
p{
  margin:0 0 1rem}
h1,h2,h3{
  font-weight:400;
  line-height:1.15;
  margin:0}
h1,h2{
  font-family:var(--serif);
  letter-spacing:-.035em}
h1{
  font-size:clamp(2.8rem,4.7vw,4.8rem)}
h2{
  font-size:clamp(2rem,3vw,2.8rem)}
h3{
  font-size:1.55rem;
  font-weight:550;
  letter-spacing:-.025em}
.site-header,main,.site-footer{
  max-width:1240px;
  margin:auto;
  padding-left:48px;
  padding-right:48px}
.site-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  min-height:113px;
  border-bottom:1px solid var(--line)}
.identity{
  font-size:1.125rem;
  font-weight:650;
  line-height:1.5;
  text-decoration:none;
  color:var(--ink);
  letter-spacing:-.02em}
.identity span{
  display:block;
  font-size:.875rem;
  font-weight:400;
  color:var(--muted);
  letter-spacing:0}
.site-header nav{
  display:flex;
  align-items:center;
  gap:30px}
.site-header nav a{
  font-size:.9375rem;
  color:var(--muted);
  text-decoration:none;
  white-space:nowrap}
.site-header nav a:hover,.site-header nav a[aria-current]{
  color:var(--blue)}
.site-header nav a[aria-current]{
  box-shadow:0 2px var(--blue);
  padding-bottom:5px}
.site-header nav .contact-link{
  color:var(--ink);
  margin-left:14px}
.skip-link{
  position:absolute;
  left:20px;
  top:-100px;
  background:var(--paper);
  padding:12px;
  z-index:5}
.skip-link:focus{
  top:12px}
.eyebrow{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.75rem;
  font-weight:650;
  line-height:1.6;
  color:var(--muted);
  margin-bottom:19px}
.blue-dot{
  display:inline-block;
  width:7px;
  height:7px;
  background:var(--blue);
  border-radius:50%;
  margin:0 9px 1px 0}
.hero{
  display:grid;
  grid-template-columns:1.35fr 1fr;
  gap:70px;
  padding:80px 0 88px;
  align-items:center}
.hero h1{
  margin-bottom:27px}
.hero-lede{
  font-size:1.2rem;
  max-width:550px;
  line-height:1.6}
.hero-context{
  color:var(--muted);
  max-width:540px;
  font-size:1rem}
.hero-actions{
  display:flex;
  align-items:center;
  gap:27px;
  margin-top:32px}
.button{
  display:inline-flex;
  gap:30px;
  align-items:center;
  justify-content:space-between;
  color:white;
  background:var(--blue);
  padding:13px 19px;
  text-decoration:none;
  font-weight:550;
  font-size:.9375rem}
.button:hover{
  background:#1637a4;
  text-decoration:none}
.text-link{
  font-size:.9375rem;
  font-weight:550;
  text-decoration:none}
.agenda{
  background:var(--navy);
  color:#fff;
  padding:28px 30px 20px;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:center}
.agenda-top{
  display:flex;
  justify-content:space-between;
  gap:12px}
.agenda .eyebrow,.agenda .small-mono{
  color:#b9cbdc}
.small-mono{
  font-family:var(--mono);
  font-size:.75rem;
  white-space:nowrap}
.agenda-question{
  font-family:var(--serif);
  font-size:1.9rem;
  line-height:1.25;
  letter-spacing:-.02em;
  margin:12px 0 26px}
.agenda-flow{
  list-style:none;
  margin:0;
  padding:0}
.agenda-flow li{
  border-top:1px solid #425363}
.agenda-flow a{
  color:#fff;
  display:grid;
  grid-template-columns:28px 1fr 15px;
  gap:12px;
  padding:20px 0;
  text-decoration:none;
  align-items:center}
.agenda-flow a:hover strong{
  text-decoration:underline}
.flow-number{
  font-family:var(--mono);
  font-size:.75rem;
  color:#afc7eb}
.agenda-flow strong{
  font-size:1.125rem;
  font-weight:550}
.agenda-flow small{
  display:block;
  font-size:.875rem;
  color:#c0cfdd;
  margin-top:2px}
.agenda-foot{
  font-size:.8125rem;
  color:#b9cbdc;
  border-top:1px solid #425363;
  padding-top:18px;
  margin:0}
.work-section,.notebook-section{
  border-top:1px solid var(--line);
  padding:51px 0 65px}
.section-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:35px}
.section-heading .eyebrow{
  margin-bottom:12px}
.program-row{
  display:grid;
  grid-template-columns:42px 1fr 270px;
  gap:22px;
  padding:30px 0;
  border-top:1px solid var(--line)}
.index-number{
  font: .8125rem var(--mono);
  color:var(--muted);
  padding-top:5px}
.program-row .eyebrow{
  font-size:.75rem;
  letter-spacing:.07em;
  margin-bottom:11px}
.program-row h3{
  margin-bottom:13px}
.program-row h3 a{
  color:var(--ink);
  text-decoration:none}
.program-row h3 a:hover{
  color:var(--blue)}
.program-row h3 span{
  font-size:1.1rem;
  margin-left:20px;
  color:var(--blue)}
.program-row p{
  color:var(--muted);
  max-width:540px;
  margin-bottom:0}
.program-question{
  padding-left:25px;
  border-left:1px solid var(--line)}
.program-question p{
  font-family:var(--serif);
  font-size:1.08rem;
  line-height:1.5;
  color:var(--ink);
  margin-top:14px}
.status,.outcome{
  font: .75rem var(--mono);
  display:inline-block;
  padding:4px 8px;
  background:var(--wash);
  color:var(--muted);
  line-height:1.5}
.section-intro{
  color:var(--muted);
  margin-top:-15px;
  margin-bottom:28px}
.note-row{
  display:grid;
  grid-template-columns:125px 1fr 140px;
  gap:24px;
  border-top:1px solid var(--line);
  padding:24px 0;
  align-items:start}
.note-row time{
  font:.8125rem/1.8 var(--mono);
  color:var(--muted)}
.note-row h3{
  font-family:var(--serif);
  font-size:1.45rem;
  line-height:1.3;
  margin-bottom:8px}
.note-row h3 a{
  color:var(--ink);
  text-decoration:none}
.note-row h3 a:hover{
  color:var(--blue)}
.note-row p{
  font-size:.9375rem;
  color:var(--muted);
  margin:0}
.note-row .outcome{
  justify-self:start}
.outcome-inconclusive,.outcome-invalidated{
  background:#fff1df;
  color:#80500d}
.outcome-engineering{
  background:#eaf2fa;
  color:#29536b}
.background-strip{
  border-top:1px solid var(--line);
  padding:54px 0;
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:35px}
.background-strip>div{
  max-width:650px}
.background-strip h2{
  margin-bottom:20px}
.background-strip p:not(.eyebrow){
  color:var(--muted)}
.contact-strip{
  background:var(--wash);
  margin:20px 0 75px;
  padding:36px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:36px}
.contact-strip h2{
  font-size:2rem;
  margin-bottom:13px}
.contact-strip p{
  max-width:620px;
  margin-bottom:0;
  color:var(--muted)}
.contact-strip .eyebrow{
  margin-bottom:12px}
.contact-strip .button{
  white-space:nowrap}
.site-footer{
  border-top:1px solid var(--line);
  padding-top:35px;
  padding-bottom:35px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:25px}
.footer-name{
  font-weight:600;
  color:var(--ink);
  text-decoration:none}
.site-footer p,.site-footer span{
  font-size:.8125rem;
  color:var(--muted);
  margin:3px 0 0}
.footer-links{
  display:flex;
  gap:24px;
  align-items:center;
  font-size:.875rem}
.footer-links a,.footer-note a{
  color:var(--muted);
  text-decoration:none}
.footer-note{
  border-top:1px solid var(--line);
  padding-top:18px;
  grid-column:1/-1;
  display:flex;
  justify-content:space-between;
  font-size:.8125rem}

.page-header{
  padding:58px 0 38px;
  border-bottom:1px solid var(--line);
  max-width:100%}
.page-header h1{
  max-width:900px;
  margin:15px 0 24px;
  font-size:clamp(2.5rem,4.5vw,4rem)}
.page-deck{
  font-size:1.25rem;
  max-width:780px;
  color:var(--muted);
  line-height:1.6}
.breadcrumbs{
  font-size:.875rem;
  color:var(--muted);
  margin-bottom:28px}
.breadcrumbs a{
  color:var(--muted)}
.page-meta{
  display:flex;
  gap:18px;
  align-items:center;
  flex-wrap:wrap;
  font-size:.875rem;
  color:var(--muted)}
.reading-layout{
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:55px;
  padding:45px 0 70px;
  align-items:start}
.contents{
  font-size:.875rem;
  position:sticky;
  top:30px}
.contents .eyebrow{
  margin-bottom:16px}
.contents ol{
  margin:0;
  padding:0;
  list-style:none}
.contents li{
  margin-bottom:11px}
.contents a{
  color:var(--muted);
  text-decoration:none}
.contents a:hover{
  color:var(--blue)}
.contents .back-link{
  display:block;
  border-top:1px solid var(--line);
  padding-top:20px;
  margin-top:24px}
.prose{
  max-width:750px;
  min-width:0;
  font-size:1.0625rem;
  overflow-wrap:anywhere}
.prose h2{
  font-size:1.9rem;
  letter-spacing:-.025em;
  border-top:1px solid var(--line);
  padding-top:30px;
  margin:40px 0 20px}
.prose h2:first-child{
  margin-top:0;
  padding-top:0;
  border:0}
.prose h3{
  font-size:1.25rem;
  margin:28px 0 12px}
.prose p,.prose ul,.prose ol{
  margin-bottom:20px}
.prose li{
  padding-left:3px;
  margin-bottom:9px}
.prose blockquote{
  margin:26px 0;
  padding:16px 22px;
  background:var(--wash);
  border-left:3px solid var(--blue);
  font-size:1rem}
.prose blockquote p:last-child{
  margin-bottom:0}
.table-scroll{
  overflow-x:auto;
  margin:25px 0;
  border:1px solid var(--line)}
.prose table{
  border-collapse:collapse;
  width:100%;
  text-align:left;
  font-size:.9375rem}
.prose th{
  font-weight:600;
  background:var(--wash)}
.prose th,.prose td{
  padding:13px 16px;
  border-bottom:1px solid var(--line);
  vertical-align:top;
  min-width:120px}
.prose tr:last-child td{
  border:0}
.prose code{
  font-family:var(--mono);
  font-size:.85em;
  background:var(--wash);
  padding:2px 4px}
.prose pre{
  overflow-x:auto;
  background:var(--navy);
  color:#e5eef7;
  padding:22px;
  line-height:1.6}
.prose pre code{
  background:none;
  padding:0}
.related-notes{
  border-top:1px solid var(--line);
  padding:38px 0 60px}
.related-notes h2{
  font-size:2rem;
  margin-bottom:24px}
.index-intro{
  padding:55px 0 35px;
  max-width:800px}
.index-intro h1{
  margin-bottom:22px}
.index-intro .page-deck{
  margin-bottom:0}
.index-list{
  padding-bottom:70px}
.notice{
  background:var(--wash);
  padding:20px 24px;
  font-size:.9375rem;
  margin-bottom:32px;
  color:var(--muted)}

@media(max-width:1000px){
  .site-header,main,.site-footer{
  padding-left:30px;
  padding-right:30px}
.site-header nav{
  gap:20px}
.hero{
  gap:35px;
  padding:55px 0 65px}
.agenda{
  padding:24px}
.hero h1{
  font-size:3.5rem}
.hero-actions{
  gap:20px;
  flex-wrap:wrap}
.program-row{
  grid-template-columns:30px 1fr 220px;
  gap:17px}
.reading-layout{
  grid-template-columns:175px minmax(0,1fr);
  gap:30px}
.contact-strip{
  padding:28px}
}

@media(max-width:760px){
  .site-header,main,.site-footer{
  padding-left:22px;
  padding-right:22px}
.site-header{
  align-items:flex-start;
  flex-direction:column;
  gap:18px;
  padding-top:22px;
  padding-bottom:18px}
.identity span{
  display:inline;
  margin-left:12px;
  font-size:.8125rem}
.site-header nav{
  width:100%;
  gap:20px;
  flex-wrap:wrap;
  row-gap:12px}
.site-header nav a{
  font-size:.875rem}
.site-header nav .contact-link{
  margin-left:auto}
.hero{
  grid-template-columns:1fr;
  gap:37px;
  padding:45px 0 50px}
.hero h1{
  font-size:clamp(2.8rem,8vw,4rem)}
.hero-lede{
  font-size:1.125rem}
.hero-actions{
  gap:25px}
.agenda{
  padding:25px;
  max-width:100%}
.agenda-question{
  font-size:1.65rem}
.agenda-flow a{
  padding:17px 0}
.agenda-foot{
  font-size:.8125rem}
.section-heading{
  align-items:start;
  margin-bottom:25px}
.section-heading .text-link{
  margin-top:40px;
  white-space:nowrap}
.program-row{
  grid-template-columns:24px 1fr;
  gap:15px;
  padding:25px 0}
.program-question{
  grid-column:2;
  border:0;
  padding:0}
.program-question p{
  display:none}
.program-row h3{
  font-size:1.35rem}
.program-row p{
  font-size:.9375rem}
.note-row{
  grid-template-columns:1fr auto;
  gap:10px 15px}
.note-row time{
  grid-column:1}
.note-row>div{
  grid-row:2;
  grid-column:1/-1}
.note-row>.outcome{
  grid-row:1;
  grid-column:2}
.background-strip{
  grid-template-columns:1fr;
  gap:8px}
.contact-strip{
  margin-bottom:45px;
  align-items:start;
  flex-direction:column;
  gap:24px;
  padding:26px}
.site-footer{
  grid-template-columns:1fr;
  gap:20px}
.footer-links{
  flex-wrap:wrap;
  gap:22px}
.footer-note{
  flex-direction:column;
  gap:12px}
.page-header{
  padding-top:32px}
.reading-layout{
  grid-template-columns:1fr;
  gap:32px;
  padding-top:27px}
.contents{
  position:static;
  border-bottom:1px solid var(--line);
  padding-bottom:20px}
.contents ol{
  display:flex;
  flex-wrap:wrap;
  gap:4px 20px}
.contents li{
  margin:0}
.contents .back-link{
  display:none}
.prose{
  font-size:1rem}
.page-deck{
  font-size:1.125rem}
.index-intro{
  padding:40px 0 30px}
.work-section,.notebook-section{
  padding-top:36px;
  padding-bottom:40px}
}

@media(prefers-reduced-motion:reduce){
  html{
  scroll-behavior:auto}
}

@media print{
  .site-header nav,.contents,.hero-actions,.contact-strip,.footer-links{
  display:none}
.site-header,main,.site-footer{
  padding:0}
.reading-layout{
  display:block}
.prose{
  max-width:100%}
a{
  color:inherit}
.agenda{
  background:white;
  color:black}
.agenda *{
  color:black!important}
}


.status,.outcome{
  font-size:.875rem}
.note-row time{
  font-size:.875rem}
.table-scroll:focus-visible{
  outline:3px solid var(--blue);
  outline-offset:3px}
