/* Legacy (unused layouts) */
a[target="_blank"]::after{content:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg==);margin:0 3px 0 5px}
*{box-sizing:border-box}

/* Theme */
html[data-theme="dark"]{
  --bg:#0a0a0a;
  --fg:#ececec;
  --fg-soft:#d8d8d8;
  --fg-muted:#bcbcbc;
  --border:#222;
  --border-soft:#1a1a1a;
  --fill:#111;
  --fill-active:#ececec;
  --fill-active-fg:#0a0a0a;
  color-scheme:dark;
}
html[data-theme="light"]{
  --bg:#f7f7f5;
  --fg:#121212;
  --fg-soft:#444;
  --fg-muted:#777;
  --border:#ddd;
  --border-soft:#e8e8e6;
  --fill:#eee;
  --fill-active:#121212;
  --fill-active-fg:#f7f7f5;
  color-scheme:light;
}
html,body{margin:0;padding:0}
body.site{
  background:var(--bg);
  color:var(--fg);
  font-family:'Libre Baskerville',Georgia,serif;
  font-size:1.05rem;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  transition:background .2s,color .2s;
}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.15em}
a:hover{opacity:.72}

/* Shell */
.site-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  max-width:40rem;
  margin:0 auto;
  padding:1.25rem 1.5rem 0;
}
.site-main{
  max-width:40rem;
  margin:0 auto;
  padding:2rem 1.5rem 4rem;
}
.site-main--wide{max-width:42rem}
.site-main--home{padding-top:1.5rem}
.site-back{
  font-family:'Ubuntu Mono',monospace;
  font-size:.82rem;
  letter-spacing:.04em;
  color:var(--fg-muted);
  text-decoration:none;
}
.site-back:hover{color:var(--fg);opacity:1}
.site-back--empty{display:block;min-width:1px}

/* Theme toggle */
.theme-toggle{
  appearance:none;
  border:none;
  background:transparent;
  padding:.25rem;
  cursor:pointer;
  line-height:0;
}
.theme-toggle-track{
  display:block;
  width:2.5rem;
  height:1.35rem;
  border:1px solid var(--border);
  border-radius:999px;
  position:relative;
  transition:border-color .2s;
}
.theme-toggle-thumb{
  position:absolute;
  top:2px;
  left:2px;
  width:.85rem;
  height:.85rem;
  border-radius:50%;
  background:var(--fg);
  transition:transform .2s,background .2s;
}
html[data-theme="light"] .theme-toggle-thumb{transform:translateX(1.15rem)}

/* Typography */
.page-title{
  margin:0 0 1.75rem;
  font-family:'Fraunces',Georgia,serif;
  font-size:clamp(2rem,7vw,2.75rem);
  font-weight:300;
  line-height:1.08;
  letter-spacing:-.01em;
  font-variation-settings:'SOFT' 30,'WONK' 0.5;
}
.page-title--post{font-size:clamp(1.5rem,5vw,2.1rem);margin-bottom:0}
.section-label{
  margin:0 0 .75rem;
  font-family:'Ubuntu Mono',monospace;
  font-size:.8rem;
  letter-spacing:.06em;
  color:var(--fg-muted);
  text-transform:lowercase;
}
.prose{color:var(--fg-soft);font-size:1.02rem;line-height:1.8}
.prose p{margin:0 0 1.1rem}
.prose p:last-child{margin-bottom:0}
.prose h2,.prose h3{
  font-family:'Fraunces',Georgia,serif;
  font-size:1.3rem;
  font-weight:400;
  color:var(--fg);
  margin:1.75rem 0 .65rem;
}
.prose a{color:var(--fg);text-decoration:underline}
.prose img{max-width:100%;height:auto;display:block;margin:1.5rem 0}
.prose pre,.prose code{font-family:'Ubuntu Mono',monospace;font-size:.88em}
.prose pre{
  background:var(--fill);
  border:1px solid var(--border-soft);
  padding:1rem;
  overflow:auto;
  line-height:1.5;
}
.prose blockquote{
  margin:1.25rem 0;
  padding-left:1rem;
  border-left:1px solid var(--border);
  color:var(--fg-muted);
  font-style:italic;
}
.prose hr{border:none;border-top:1px solid var(--border);margin:2rem 0}
.prose ul,.prose ol{
  margin:0 0 1.1rem;
  padding-left:1.35rem;
}
.prose li{margin:0 0 .45rem}
.prose li:last-child{margin-bottom:0}
.prose ul ul,.prose ul ol,.prose ol ul,.prose ol ol{
  margin:.35rem 0 .15rem;
}

/* Home */
.home-role{margin:0 0 1rem;color:var(--fg-soft);font-size:1rem}
.home-name{
  margin:0;
  font-family:'Fraunces',Georgia,serif;
  font-size:clamp(2.75rem,10vw,4.5rem);
  font-weight:300;
  line-height:1;
  letter-spacing:-.02em;
  font-variation-settings:'SOFT' 35,'WONK' 0.6;
}
.home-name-line{display:block}
.home-name-accent{font-style:italic;color:var(--fg-soft);margin-top:.12em}
.home-meta{
  margin:1rem 0 0;
  font-family:'Ubuntu Mono',monospace;
  font-size:.82rem;
  letter-spacing:.03em;
  color:var(--fg-muted);
  line-height:1.5;
}
.home-skills{
  margin:1.5rem 0 2.5rem;
  font-family:'Ubuntu Mono',monospace;
  font-size:.82rem;
  letter-spacing:.04em;
  color:var(--fg-muted);
  line-height:1.6;
}
.home-notes{
  margin:0 0 3rem;
  padding:1.5rem 0 0;
  border-top:1px solid var(--fg);
}
.home-notes-header{
  display:grid;
  grid-template-columns:minmax(9rem,.75fr) 1.5fr;
  gap:1.5rem;
  align-items:start;
  margin-bottom:1.5rem;
}
.home-notes-header .section-label{margin-bottom:.2rem}
.home-notes-header h2{
  margin:0;
  font-family:'Fraunces',Georgia,serif;
  font-size:clamp(1.8rem,6vw,2.5rem);
  font-weight:300;
  line-height:1;
  letter-spacing:-.01em;
}
.home-notes-header h2 a{text-decoration:none}
.home-notes-header h2 span{
  display:inline-block;
  margin-left:.15em;
  font-family:'Ubuntu Mono',monospace;
  font-size:.45em;
  color:var(--fg-muted);
  vertical-align:top;
}
.home-notes-header>p{
  margin:.1rem 0 0;
  color:var(--fg-soft);
  font-size:.9rem;
  line-height:1.6;
}
.home-latest{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--border);
}
.home-latest li{border-bottom:1px solid var(--border)}
.home-latest a{
  display:grid;
  grid-template-columns:5.4rem 1fr;
  gap:1rem;
  align-items:baseline;
  padding:.8rem 0;
  text-decoration:none;
}
.home-latest time{
  font-family:'Ubuntu Mono',monospace;
  font-size:.78rem;
  letter-spacing:.03em;
  color:var(--fg-muted);
}
.home-latest span{
  font-size:.9rem;
  line-height:1.45;
}
.home-notes-all{
  display:inline-block;
  margin-top:.9rem;
  font-family:'Ubuntu Mono',monospace;
  font-size:.8rem;
  color:var(--fg-muted);
  text-decoration:none;
}
.home-notes-all:hover{color:var(--fg);opacity:1}
.home-elsewhere{margin:0}
.elsewhere-links{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 1.5rem;
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--border);
}
.elsewhere-links li{min-width:0;border-bottom:1px solid var(--border)}
.elsewhere-links a{
  display:flex;
  flex-direction:column;
  gap:.15rem;
  min-width:0;
  padding:.75rem 0;
  text-decoration:none;
}
.elsewhere-links a>span{font-size:.88rem}
.elsewhere-links small{
  overflow:hidden;
  color:var(--fg-muted);
  font-family:'Ubuntu Mono',monospace;
  font-size:.76rem;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Notes */
.notes-lede{margin:0 0 1rem;color:var(--fg-soft);line-height:1.75}
.feed-archive-note{
  margin:0 0 2rem;
  font-size:.95rem;
  font-style:italic;
  color:var(--fg-muted);
}
.feed-filter{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.5rem .55rem;
  margin:0 0 2.5rem;
}
.feed-filter-label{
  font-family:'Ubuntu Mono',monospace;
  font-size:.8rem;
  letter-spacing:.04em;
  color:var(--fg-muted);
  margin-right:.15rem;
}
.feed-filter-link{
  display:inline-block;
  font-family:'Ubuntu Mono',monospace;
  font-size:.82rem;
  letter-spacing:.04em;
  line-height:1;
  padding:.55rem .95rem;
  color:var(--fg-soft);
  text-decoration:none;
  border:1px solid var(--border);
  background:transparent;
  transition:color .15s,background .15s,border-color .15s;
}
.feed-filter-link::before{content:none}
.feed-filter-link:hover{
  color:var(--fg);
  border-color:var(--fg-muted);
  opacity:1;
}
.feed-filter-link.is-active{
  color:var(--fill-active-fg);
  background:var(--fill-active);
  border-color:var(--fill-active);
}
.category-summary{
  margin:0 0 1.5rem;
  font-size:.95rem;
  color:var(--fg-muted);
}
.category-summary strong{color:var(--fg);font-weight:400}
.posts{margin-top:.5rem}
.post-item{margin:0}
.post-header{margin:0 0 1rem}
.post-byline{
  display:flex;
  align-items:baseline;
  gap:.35rem;
  margin:0 0 .5rem;
  font-family:'Ubuntu Mono',monospace;
  font-size:.8rem;
  letter-spacing:.04em;
  color:var(--fg-muted);
}
.post-byline-sep{opacity:.45}
.post-proto{text-transform:lowercase}
.posts .post-title{
  margin:0;
  font-family:'Fraunces',Georgia,serif;
  font-size:clamp(1.2rem,3.5vw,1.5rem);
  font-weight:400;
  line-height:1.3;
  letter-spacing:.01em;
}
.posts .post-link{text-decoration:none;color:var(--fg)}
.posts .post-link:hover{opacity:.7}
.post-excerpt{color:var(--fg-soft);font-size:1rem;line-height:1.75}
.post-excerpt p{margin:0 0 .85rem}
.post-divider{
  margin:2.5rem 0;
  height:1px;
  background:var(--border);
}
.notes-back{margin:2.5rem 0 0;font-size:.9rem}
.notes-back a{text-decoration:none;color:var(--fg-muted)}
.notes-back a:hover{color:var(--fg);opacity:1}
.pagination{margin:3rem 0 0}
.pagination-links{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:1.5rem;
  flex-wrap:wrap;
}
.pagination-btn,.pagination-info{
  font-family:'Ubuntu Mono',monospace;
  font-size:.78rem;
  color:var(--fg-muted);
  text-decoration:none;
}
.pagination-btn:hover{color:var(--fg);opacity:1}

/* Post detail */
.post-header .page-title{margin-top:0}

/* Post figures */
.figure-grid{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  gap:1.25rem;
  flex-wrap:wrap;
  margin:2rem auto;
}
.figure-grid figure{
  margin:0;
  max-width:360px;
  flex:1 1 280px;
  text-align:center;
}
.figure-grid img{
  width:100%;
  height:auto;
  border-radius:8px;
  border:1px solid var(--border-soft);
}
.figure-grid figcaption{
  margin-top:.5rem;
  font-size:.88rem;
  color:var(--fg-muted);
  line-height:1.45;
}
.prose .figure-grid img{margin:0}
.prose p em,.prose li em{display:inline;font-style:italic}
.prose p.caption{
  margin:-.5rem 0 1.5rem;
  font-size:.88rem;
  color:var(--fg-muted);
  line-height:1.45;
  text-align:center;
}

@media(max-width:35em){
  .site-header,.site-main{padding-left:1.15rem;padding-right:1.15rem}
  .home-notes-header{grid-template-columns:1fr;gap:.75rem}
  .home-latest a{grid-template-columns:4.75rem 1fr;gap:.75rem}
  .elsewhere-links{grid-template-columns:1fr}
  .feed-filter-link{font-size:.78rem;padding:.5rem .8rem}
  .figure-grid{margin-left:0;margin-right:0}
  .figure-grid figure{flex:1 1 100%;max-width:100%;min-width:0}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}