
:root {
  --bg: #fbfaf5;
  --bg-elev: #f5f2ea;
  --ink: #1c1a17;
  --ink-soft: #4a463f;
  --ink-muted: #857f74;
  --line: #e5e0d3;
  --line-soft: #efeadd;
  --accent: #a8323e;
  --accent-soft: #c76a72;
  --accent-bg: #fdf1f1;
  --link: #4b5967;
  --link-hover: var(--accent);
  --portrait-ring: #8b867f;
  --ochre: #8c6d2a;
  --news-highlight: #805c24;

  --serif: "Fraunces", "Noto Serif SC", "EB Garamond", Georgia, "Times New Roman", serif;
  --sans: "Inter", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;

  --measure: 46rem;
  --wide: 52rem;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #141312;
    --bg-elev: #1d1b19;
    --ink: #ecebe6;
    --ink-soft: #c7c3bb;
    --ink-muted: #8a857b;
    --line: #2a2724;
    --line-soft: #23211e;
    --accent: #e47580;
    --accent-soft: #c76a72;
    --accent-bg: #2a1e20;
    --link: #c4cbd2;
    --portrait-ring: #75716b;
    --ochre: #c8a450;
    --news-highlight: #e6d39b;
  }
}


*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.65;
  color: var(--ink);
  background: var(--bg);
  font-feature-settings: "ss01", "ss02", "onum";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }

a {
  color: var(--link);
  text-decoration-line: none;
  text-decoration-thickness: 1px;
  text-decoration-color: color-mix(in srgb,currentColor 42%,transparent);
  text-underline-offset: .18em;
  text-decoration-skip-ink: auto;
  transition: color .18s ease, text-decoration-color .18s ease;
}
a:hover { color: var(--link-hover); }

h1, h2, h3, h4 {
  font-family: var(--serif);
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.18;
  margin: 0 0 .5em;
}

h1 { font-size: clamp(1.9rem, 1.2rem + 2vw, 2.6rem); }
h2 {
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--ink-soft);
  font-style: italic;
  font-feature-settings: "ss01";
}
em { font-style: italic; color: var(--ink-soft); }
strong { font-weight: 600; color: var(--ink); }

p { margin: 0 0 1em; }


.container {
  width: 100%;
  max-width: var(--wide);
  margin: 0 auto;
  padding: 0 1.5rem;
}

main.container { padding-top: 2.5rem; padding-bottom: 5rem; padding-inline:clamp(1.25rem,4vw,3rem); }

main > section {
  max-width: var(--measure);
  margin: 0 auto 3.5rem;
}

main > section.hero,
main > section.highlights,
main > section.posts-preview { max-width: var(--measure); }


.site-header {
  padding: 1.4rem 0;
  border-bottom: 1px solid var(--line-soft);
  background: var(--bg);
  position: sticky;
  top: 0;
  z-index: 10;
  backdrop-filter: saturate(1.1) blur(6px);
}
.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}
.brand {
  display:inline-flex;
  align-items:center;
  gap:.65rem;
  font-family: var(--serif);
  font-weight: 500;
  font-size: 1.15rem;
  letter-spacing: -0.01em;
  background: none;
}
.brand-label {color:inherit; transition:color .18s ease;}
.brand-home {display:inline-flex; align-items:center; gap:.65rem; flex:none; border-radius:.25rem; background:none; text-decoration:none; padding:0;}
.brand-mark {width:2.25rem; height:2.25rem; flex:none; object-fit:contain; border-radius:50%; box-shadow:0 0 0 1px color-mix(in srgb,var(--ink-muted) 25%,transparent); transition:transform .22s cubic-bezier(.2,.7,.2,1),box-shadow .22s ease; transform-origin:center;}
.brand-home:is(:hover,:focus-visible) .brand-mark {transform:scale(1.12); box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 55%,transparent);}
.brand-home:focus-visible {outline:2px solid var(--accent); outline-offset:5px;}
@media(prefers-reduced-motion:reduce){.brand-mark {transition:none;}.brand-home:is(:hover,:focus-visible) .brand-mark {transform:none;}}
.heading-symbol {display:inline-block; width:.58em; height:.58em; vertical-align:.07em; margin-left:.25em; overflow:visible; color:var(--ochre);}
.heading-symbol--orbit {color:var(--accent-soft);}
.section-symbol {display:inline-block; width:.8em; height:.8em; vertical-align:.02em; margin-left:.4em; overflow:visible; color:var(--ochre);}
.section-symbol--writing {color:var(--accent-soft);}
.nav-links {
  display: flex;
  gap: 1.2rem;
  font-family: var(--sans);
  font-size: .88rem;
  align-items: baseline;
}
.nav-links a {
  background: none;
  color: var(--ink-soft);
  padding-bottom: 2px;
  border-bottom: 1px solid transparent;
}
.nav-links a:hover { color: var(--accent); border-bottom-color: var(--accent); }
.nav-links a.active { color: var(--ink); border-bottom-color: var(--ink); }
.nav-divider { color: var(--ink-muted); }
.lang-toggle { font-family: var(--serif); font-style: italic; }


.hero {
  display: flex;
  gap: 1.6rem;
  align-items: flex-start;
  margin-top: 1rem !important;
  margin-bottom: 2.2rem !important;
}
.avatar-wrap {
  flex-shrink: 0;
  width: 128px;
  height: 128px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--bg-elev);
}
.avatar { width: 100%; height: 100%; object-fit: cover; }
.portrait-wrap { background: var(--bg); border-color:var(--portrait-ring); }

.portrait-wrap--original {background:linear-gradient(to bottom,color-mix(in srgb,#fff 95%,var(--bg)) 5%,var(--bg) 5%);}
.portrait-wrap--original .avatar {opacity:.95; filter:none; mask-image:none;}
.avatar--portrait {
  transform: translateY(5%) scale(1.3);
  transform-origin: 50% 0;
}
.avatar--art {object-fit:contain;}
.hero-text h1 {
  font-size:clamp(1.7rem,1.05rem + 1.6vw,2.2rem);
  margin-top: -.2rem;
  margin-bottom: .3rem;
}
.hero-ch {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-muted);
  font-size: .7em;
  margin-left: .3em;
}
.tagline {
  font-family: var(--sans);
  font-size: .95rem;
  color: var(--ink-soft);
  margin-bottom: .1rem;
  letter-spacing: .01em;
}
.hero-sub {
  font-style: italic;
  color: var(--ink-soft);
  margin-bottom: 0;
}
.accent { color: var(--accent); font-style: italic; font-family: var(--serif); }

.hero-contact {
  margin-top: .25rem;
  margin-bottom: .2rem;
  font-size: .72rem;
  gap: .4rem .9rem;
}
.hero-contact a {
  display:inline-flex;
  align-items:center;
  gap:.3rem;
  color: var(--ochre);
  background: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 1px;
  transition: border-color .15s ease, color .15s ease;
}
.hero-contact a:hover {
  color: var(--ochre);
  border-bottom-color: var(--ochre);
}
.contact-symbol {width:.9rem; height:.9rem; flex:none; color:inherit; opacity:.9;}


.bio p { font-size: 1.05rem; }
.bio p:last-child { margin-bottom: 0; }


.bio-expand summary {
  list-style: none;
  cursor: pointer;
  outline: none;
}
.bio-expand summary::-webkit-details-marker { display: none; }
.bio-expand summary::marker { content: ""; }
.hero-intro summary { font-style: normal; }
.hero-intro summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 5px;
  border-radius: 2px;
}
.bio-expand .expand-arrow {
  display: inline-block;
  color: var(--ink-muted);
  font-style: normal;
  font-family: var(--sans);
  transition: transform .25s ease, color .15s ease;
  margin-left: .2em;
  vertical-align: 0;
}
.bio-expand summary:hover .expand-arrow { color: var(--accent); }
.bio-expand[open] .expand-arrow { transform: rotate(180deg); }
.bio-more {
  margin-top: 1.2rem;
  animation: bio-fade .3s ease;
}
.bio-more p { font-size: 1.05rem; }
.bio-more p:last-child { margin-bottom: 0; }
@keyframes bio-fade {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}


.section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 1rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--line-soft);
}
.section-head h2 { margin: 0; }
.section-link {
  font-family: var(--sans);
  font-size: .82rem;
  color: var(--ink-muted);
  background: none;
}
.section-link:hover { color: var(--accent); }


.news-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.news-list li {
  display: grid;
  grid-template-columns: 5.5rem 1fr;
  gap: 1rem;
  padding: .55rem 0;
  border-bottom: 1px dashed var(--line-soft);
  font-size: .98rem;
}
.news-list li:last-child { border-bottom: none; }
.news-reflection {
  display: block;
  margin-top: .3rem;
  color: var(--ink-soft);
  font-size: .94em;
}
.news-date {
  font-family: var(--sans);
  font-size: .82rem;
  color: var(--ink-muted);
  letter-spacing: .02em;
  padding-top: .2rem;
}
.news-content a {
  color: var(--accent);
  background: none;
  border-bottom: 1px solid var(--line);
}
.news-content a:hover { border-bottom-color: var(--accent); }


.pub-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.pub-item {
  padding: 1rem 0;
  border-bottom: 1px solid var(--line-soft);
}
.pub-item:last-child { border-bottom: none; }
.pub-title {
  font-size: 1.08rem;
  font-weight: 500;
  margin-bottom: .2rem;
  line-height: 1.4;
}
.pub-title a { background: none; border-bottom: 1px solid var(--line); }
.pub-title a:hover { border-bottom-color: var(--accent); }
.pub-meta {
  font-family: var(--sans);
  font-size: .85rem;
  color: var(--ink-soft);
  margin-bottom: .3rem;
}
.pub-venue { font-style: italic; font-family: var(--serif); color: var(--accent); }
.pub-desc {
  font-size: .95rem;
  color: var(--ink-soft);
  font-style: italic;
}
.pub-links {
  margin-top: .4rem;
  font-family: var(--sans);
  font-size: .82rem;
  display: flex;
  gap: .6rem;
}
.pub-links a {
  background: none;
  color: var(--ink-muted);
  border: 1px solid var(--line);
  padding: .1rem .5rem;
  border-radius: 2px;
  transition: all .15s ease;
}
.pub-links a:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-bg);
}

.pub-list.compact .pub-item { padding: .7rem 0; }


.pub-year {
  font-family: var(--serif);
  font-style: italic;
  color: var(--ink-muted);
  font-size: 1.5rem;
  margin: 2rem 0 .5rem;
  padding-bottom: .3rem;
  border-bottom: 1px solid var(--line);
}
.pub-year:first-of-type { margin-top: 0; }


.filter-bar {
  display: flex;
  gap: .4rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
  font-family: var(--sans);
  font-size: .82rem;
}
.filter-chip {
  background: none;
  border: 1px solid var(--line);
  border-radius: 2rem;
  padding: .25rem .8rem;
  color: var(--ink-soft);
  cursor: pointer;
  transition: all .15s ease;
  font-family: inherit;
  font-size: inherit;
}
.filter-chip:hover { color: var(--accent); border-color: var(--accent); }
.filter-chip.active {
  background: var(--ink);
  color: var(--bg);
  border-color: var(--ink);
}


.post-list { list-style: none; padding: 0; margin: 0; }
.post-list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: .7rem 0;
  border-bottom: 1px dashed var(--line-soft);
  gap: 1rem;
}
.post-list li:last-child { border-bottom: none; }
.post-title {
  font-size: 1.05rem;
  background: none;
  border-bottom: 1px solid var(--line);
}
.post-title:hover { border-bottom-color: var(--accent); }
.post-date {
  font-family: var(--sans);
  font-size: .8rem;
  color: var(--ink-muted);
  white-space: nowrap;
  flex-shrink: 0;
}


.contact-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
  font-family: var(--sans);
  font-size: .92rem;
  letter-spacing: .01em;
}
.contact-links a {
  color: var(--ink-soft);
  background: none;
  border-bottom: 1px solid var(--line);
  padding-bottom: 2px;
}
.contact-links a:hover { color: var(--accent); border-bottom-color: var(--accent); }


.blog-controls {
  margin: 2rem 0 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .9rem;
}
.blog-search {
  width: 100%;
  padding: .55rem 1rem;
  font-family: var(--sans);
  font-size: .92rem;
  border: 1px solid var(--line);
  border-radius: 2rem;
  background: var(--bg);
  color: var(--ink);
  transition: border-color .15s ease;
}
.blog-search::placeholder { color: var(--ink-muted); }
.blog-search:focus {
  outline: none;
  border-color: var(--accent);
}
.blog-tags {
  display: flex;
  gap: .3rem;
  flex-wrap: wrap;
}
.notebook-page .blog-tags .filter-chip {
  padding:.08rem .32rem;
  border-radius:3px;
  font:400 .62rem/1.4 var(--mono);
}
.notebook-page .post-tag-inline {padding:0 .25rem; font-size:.6rem; line-height:1.4;}

.post-list-item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: .7rem 0;
  border-bottom: 1px dashed var(--line-soft);
  gap: 1rem;
}
.post-list-item:last-child { border-bottom: none; }
.post-list-main {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  min-width: 0;
}
.post-list-tags {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  font-family: var(--sans);
}
.post-tag-inline {
  font-size: .72rem;
  color: var(--ink-muted);
  letter-spacing: .02em;
}
.muted-note {
  color: var(--ink-muted);
  font-style: italic;
  padding: .8rem 0;
}


.post-tags {
  display: flex;
  gap: .4rem;
  flex-wrap: wrap;
  margin-top: .6rem;
  font-family: var(--sans);
}
.post-tag {
  display: inline-block;
  font-size: .74rem;
  color: var(--ink-muted);
  background: var(--bg-elev);
  border: 1px solid var(--line);
  padding: .1rem .55rem;
  border-radius: 2rem;
  letter-spacing: .02em;
  text-decoration: none;
  background-image: none;
}
.post-tag:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-bg);
}


.post-header {
  margin-bottom: 2.2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--line-soft);
}
.post-header h1 { margin-bottom: .3rem; }
.post-meta {
  font-family: var(--sans);
  font-size: .85rem;
  color: var(--ink-muted);
  letter-spacing: .02em;
}
.post-body { font-size: 1.05rem; }
.post-body p { margin-bottom: 1.2em; }
.post-body h2 {
  margin-top: 2.5rem;
  margin-bottom: .8rem;
  font-style: normal;
  color: var(--ink);
  font-size: 1.4rem;
  border-bottom: none;
  padding-bottom: 0;
}
.post-body h3 { margin-top: 1.8rem; font-size: 1.15rem; }
.post-body blockquote {
  margin: 1.5em 0;
  padding: .2em 1.2em;
  border-left: 2px solid var(--accent);
  color: var(--ink-soft);
  font-style: italic;
}
.post-body code {
  font-family: "SF Mono", ui-monospace, Menlo, monospace;
  font-size: .88em;
  background: var(--bg-elev);
  padding: .12em .4em;
  border-radius: 3px;
}
.post-body pre {
  font-family: "SF Mono", ui-monospace, Menlo, monospace;
  font-size: .88rem;
  background: var(--bg-elev);
  padding: 1rem 1.2rem;
  border-radius: 4px;
  overflow-x: auto;
  line-height: 1.5;
  border: 1px solid var(--line);
}
.post-body pre code { background: none; padding: 0; }
.post-body hr {
  border: none;
  height: 1px;
  background: var(--line);
  margin: 2.5rem 0;
}
.post-body ul,
.post-body ol {
  margin: 0 0 1.2em;
  padding-left: 1.4em;
}
.post-body li { margin-bottom: .3em; }
.post-body img {
  max-width: 100%;
  border-radius: 4px;
  margin: 1.5em 0;
}
.post-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.2em 0;
  font-size: .95em;
}
.post-body th,
.post-body td {
  padding: .5em .8em;
  border-bottom: 1px solid var(--line-soft);
  text-align: left;
}
.post-body th {
  font-family: var(--sans);
  font-size: .85em;
  color: var(--ink-soft);
  letter-spacing: .02em;
  font-weight: 600;
}
.post-nav {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--line-soft);
  font-family: var(--sans);
  font-size: .88rem;
}


.wide-main > section { max-width: var(--wide); }
.music-intro { max-width: var(--measure); }
.music-section { margin-bottom: 3.5rem; }
.music-section h2 {
  margin-bottom: 1.2rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--line-soft);
}
.music-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 2.2rem 1.8rem;
}
.music-card { display: flex; flex-direction: column; }
.music-cover {
  display: block;
  aspect-ratio: 1 / 1;
  background: linear-gradient(135deg, var(--c1, var(--bg-elev)), var(--c2, var(--bg)));
  border-radius: 4px;
  margin-bottom: .8rem;
  position: relative;
  overflow: hidden;
  transition: transform .22s ease, box-shadow .22s ease;
  text-decoration: none;
}
.music-init {
  position: absolute;
  bottom: .8rem;
  left: .9rem;
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.5rem;
  color: rgba(255, 255, 255, 0.72);
  letter-spacing: .03em;
  z-index: 1;
  pointer-events: none;
}
.music-cover img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
  display: block;
}
.music-cover:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}
.music-cover.empty {
  background: var(--bg-elev);
  border: 1px dashed var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-muted);
  font-family: var(--sans);
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: lowercase;
}
.music-title {
  font-size: 1.05rem;
  font-weight: 500;
  margin: 0 0 .15rem;
  line-height: 1.3;
}
.music-title.muted { color: var(--ink-muted); font-style: italic; font-weight: 400; }
.music-meta {
  font-family: var(--sans);
  font-size: .82rem;
  color: var(--ink-muted);
  margin: 0 0 .4rem;
  letter-spacing: .01em;
}
.music-desc {
  font-size: .92rem;
  font-style: italic;
  color: var(--ink-soft);
  margin: 0 0 .6rem;
  line-height: 1.5;
}
.music-links {
  display: flex;
  gap: .5rem;
  font-family: var(--sans);
  font-size: .78rem;
  margin-top: auto;
}
.music-links a {
  background: none;
  color: var(--ink-muted);
  border: 1px solid var(--line);
  padding: .1rem .55rem;
  border-radius: 2px;
  transition: all .15s ease;
}
.music-links a:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-bg);
}


.music-detail { max-width: var(--measure); }
.back-link {
  display: inline-block;
  margin-bottom: 1.8rem;
  font-family: var(--sans);
  font-size: .85rem;
  color: var(--ink-muted);
  background: none;
  letter-spacing: .02em;
}
.back-link:hover { color: var(--accent); }
.detail-header {
  display: flex;
  gap: 2rem;
  align-items: flex-start;
  margin-bottom: 2.5rem;
}
.detail-cover {
  flex-shrink: 0;
  width: 220px;
  aspect-ratio: 1 / 1;
  background: linear-gradient(135deg, var(--c1, var(--bg-elev)), var(--c2, var(--bg)));
  border-radius: 4px;
  position: relative;
  overflow: hidden;
}
.detail-cover img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
  display: block;
}
.detail-cover .music-init {
  font-size: 2rem;
  bottom: 1rem;
  left: 1.1rem;
}
.detail-meta { flex: 1; min-width: 0; }
.detail-meta h1 { margin-bottom: .4rem; font-size: 2rem; }
.detail-composer {
  font-family: var(--sans);
  color: var(--ink-soft);
  font-size: .95rem;
  margin-bottom: 1.4rem;
  letter-spacing: .01em;
}
.detail-specs {
  margin: 0;
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: .35rem 1.2rem;
  font-family: var(--sans);
  font-size: .85rem;
}
.detail-specs dt {
  color: var(--ink-muted);
  letter-spacing: .02em;
  text-transform: lowercase;
}
.detail-specs dd { margin: 0; color: var(--ink-soft); }

.detail-section {
  margin-top: 2.8rem;
}
.detail-section h2 {
  font-size: 1.2rem;
  font-style: italic;
  color: var(--ink-soft);
  margin-bottom: .8rem;
  padding-bottom: .4rem;
  border-bottom: 1px solid var(--line-soft);
}
.detail-section p { font-size: 1.02rem; margin-bottom: 1em; }
.detail-section p:last-child { margin-bottom: 0; }

.score-embed,
.audio-embed {
  background: var(--bg-elev);
  border: 1px dashed var(--line);
  border-radius: 4px;
  padding: 1.8rem;
  text-align: center;
}
.placeholder-text {
  font-style: italic;
  color: var(--ink-muted);
  margin: 0 0 .8rem;
}
.score-embed a,
.audio-embed a {
  display: inline-block;
  font-family: var(--sans);
  font-size: .82rem;
  color: var(--ink-muted);
  border: 1px solid var(--line);
  padding: .3rem .8rem;
  border-radius: 2px;
  background: var(--bg);
  margin: 0 .25rem;
}
.score-embed a:hover,
.audio-embed a:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-bg);
}
.detail-audio audio {
  width: 100%;
  margin-bottom: .5rem;
}

.detail-footer {
  margin-top: 3.5rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--line-soft);
  font-family: var(--sans);
  font-size: .88rem;
}

@media (max-width: 640px) {
  .detail-header { flex-direction: column; gap: 1.2rem; }
  .detail-cover { width: 150px; }
  .detail-meta h1 { font-size: 1.6rem; }
}


.site-footer {
  border-top: 1px solid var(--line-soft);
  padding: 2rem 0;
  font-family: var(--sans);
  font-size: .82rem;
  color: var(--ink-muted);
}
.site-footer .muted { color: var(--ink-muted); font-style: italic; font-family: var(--serif); }


@media (max-width: 640px) {
  body { font-size: 17px; }
  .nav { flex-direction: column; align-items: flex-start; gap: .8rem; }
  .nav-links { flex-wrap: wrap; gap: .9rem; }
  .hero { flex-direction: column; gap: 1rem; }
  .avatar-wrap { width: 104px; height: 104px; }
  .news-list li { grid-template-columns: 4.5rem 1fr; gap: .6rem; }
  main.container { padding-top: 1.5rem; }
}


.news-window {max-height:28rem; overflow-y:scroll; scrollbar-gutter:stable; padding:0 .75rem 0 0; border-bottom:1px solid var(--line); scrollbar-width:thin; scrollbar-color:color-mix(in srgb,var(--ink-muted) 40%,var(--bg)) var(--bg);}
.news-window:focus-visible {outline:1px solid var(--accent); outline-offset:4px;}
.news-tag {display:inline-block; margin-right:.4rem; font-family:var(--sans); font-size:.62rem; font-weight:500; font-style:normal; color:var(--ink-soft); border:1px solid var(--line); border-radius:3px; padding:0 .35rem; vertical-align:middle;}
.news-window .news-list {margin:0;}

@supports selector(::-webkit-scrollbar) {
 .news-window {scrollbar-width:auto; scrollbar-color:auto;}
 .news-window::-webkit-scrollbar {width:4px;}
 .news-window::-webkit-scrollbar-track {background:color-mix(in srgb,var(--ink-muted) 8%,var(--bg)); border-radius:8px;}
 .news-window::-webkit-scrollbar-thumb {background:color-mix(in srgb,var(--ink-muted) 40%,var(--bg)); border-radius:8px;}
 .news-window::-webkit-scrollbar-thumb:hover {background:color-mix(in srgb,var(--ink-muted) 68%,var(--bg));}
}
@media print {.news-window {max-height:none; overflow:visible;}}


.publications-page .pub-item { padding:.75rem 0; }
.publications-page .pub-title { font-size:1rem; line-height:1.35; }
.publications-page .pub-meta { font-size:.73rem; line-height:1.55; margin-bottom:.35rem; }
.research-tags { display:flex; flex-wrap:wrap; gap:.3rem; margin:.3rem 0; }
.research-tag { font:500 .62rem/1.6 var(--sans); padding:.05rem .4rem; border:1px solid var(--line); border-radius:3px; color:var(--ink-soft); background:var(--bg-elev); }
.pub-summary { margin-top:.3rem; }
.pub-summary summary { font:400 .73rem/1.6 var(--sans); color:var(--ink-soft); cursor:pointer; width:fit-content; }
.pub-summary summary:hover { color:var(--accent); }
.pub-summary summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.pub-summary .pub-desc { padding:.45rem 0 .2rem; font-size:.88rem; font-style:normal; line-height:1.65; }
.publications-page .pub-links { margin-top:.25rem; font-size:.7rem; }
@media print { .pub-summary > .pub-desc { display:block; } }


:root { --mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; }
.news-date, .post-date, .post-meta, .post-date-text, .pub-year,
.filter-chip, .news-tag, .research-tag,
.post-tag, .post-tag-inline, .pub-links, .pub-summary summary {
  font-family:var(--mono); font-variant-numeric:tabular-nums; font-style:normal;
}
.news-tag, .research-tag, .post-tag, .post-tag-inline {
  display:inline-block; font-size:.65rem; line-height:1.7; padding:.04rem .4rem;
  color:var(--ink-soft); background:var(--bg-elev); border:1px solid var(--line); border-radius:3px;
}
.pub-year { font-size:1.05rem; letter-spacing:.04em; }

.notebook-page main { position:relative; }
.notebook-eyebrow, .notebook-index { font:400 .68rem/1.6 var(--mono); letter-spacing:.08em; color:var(--ink-soft); }
.notebook-eyebrow { margin-bottom:1rem; }
.notebook-mark { display:inline-block; color:var(--accent); margin-left:.25em; transform:rotate(-12deg); }
.notebook-intro { max-width:32rem; color:var(--ink-soft); font-size:.95rem; }
.notebook-index { display:flex; justify-content:space-between; gap:1rem; padding:.6rem 0; border-bottom:1px dashed var(--line); }
.notebook-page .blog-search { font-family:var(--mono); font-size:.8rem; }
.notebook-page .post-list-item { padding:.6rem 0; }
.notebook-page .post-list-main { display:block; line-height:1.4; }
.note-excerpt { font-size:.9rem; line-height:1.6; color:var(--ink-soft); margin:.4rem 0; }
.notebook-page .post-list-tags { margin-top:.12rem; gap:.3rem; }
.notebook-article .post-body blockquote { border-left:2px solid var(--accent); }
@media(max-width:600px) { .notebook-index { font-size:.6rem; } }


.pub-status { display:flex; flex-wrap:wrap; align-items:baseline; gap:.25rem .65rem; margin:.35rem 0; font:400 .72rem/1.6 var(--sans); color:var(--ink-soft); }
.pub-state { display:inline-block; border:1px solid var(--line); border-radius:3px; padding:.02rem .4rem; font-size:.67rem; }
.pub-submission { color:var(--ink-soft); }


.about-heading { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; }
.about-heading h1 { margin-bottom:0; }
.about-education .news-content { line-height:1.6; }
.about-school { display:block; color:var(--ink-muted); font-size:.9rem; }
.about-diploma { display:block; font-size:.85rem; }
.about-honour { display:block; margin-top:.15rem; color:var(--ink-muted); font:400 .72rem/1.65 var(--sans); }
.about-note { color:var(--ink-soft); font-size:.9rem; }
.experience-entry { padding:1rem 0; border-bottom:1px solid var(--line-soft); }
.experience-entry:first-child { padding-top:.25rem; }
.experience-entry:last-child { border-bottom:0; }
.experience-entry h3 { font-size:1.05rem; line-height:1.4; margin-bottom:.3rem; }
.experience-entry p:last-child { margin-bottom:0; }
.experience-entry > p:not(.experience-meta) { font-size:.97rem; color:var(--ink-soft); }
.experience-meta { font:400 .76rem/1.65 var(--sans); color:var(--ink-soft); margin-bottom:.55rem; }
.earlier-research { margin-top:1rem; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:.8rem 0; }
.earlier-research > summary { font:400 .83rem/1.6 var(--sans); color:var(--ink-soft); cursor:pointer; }
.earlier-research > summary:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.earlier-research[open] > summary { margin-bottom:1rem; }
.about-related { font:400 .8rem/1.6 var(--sans); margin:1rem 0 0; }
.technical-background { margin:0; }
.technical-background > div { display:grid; grid-template-columns:10.5rem minmax(0,1fr); gap:1rem; padding:.65rem 0; border-bottom:1px solid var(--line-soft); }
.technical-background > div:last-child { border-bottom:0; }
.technical-background dt { font:500 .76rem/1.65 var(--sans); color:var(--ink); }
.technical-background dd { margin:0; font-size:.95rem; color:var(--ink-soft); }
@media(max-width:600px) {
  .technical-background > div { grid-template-columns:1fr; gap:.25rem; }
  .about-heading { flex-wrap:wrap; }
}


.about-page main {position:relative; isolation:isolate; overflow-x:clip;}
.about-heading {position:relative; display:block; min-height:0; padding-top:.3rem; margin-bottom:1rem;}
.about-title-row {position:relative; z-index:1; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:start; gap:1.5rem; max-width:27.25rem;}
.about-title-row h1 {margin:0;}
.about-availability {margin:.2rem 0 0; padding:.65rem .8rem; border:1px solid color-mix(in srgb,var(--ink-muted) 24%,transparent); border-radius:7px; background:color-mix(in srgb,var(--bg-elev) 38%,transparent); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); font:400 .77rem/1.65 var(--sans); color:var(--ink-soft);}
.about-availability strong {display:block; font-weight:500; color:var(--ink);}
.availability-types {display:block; margin-bottom:.3rem; color:var(--ink-muted); font-size:.72rem;}
.about-title {display:flex; flex-wrap:wrap; align-items:baseline; column-gap:1.4rem; row-gap:.25rem;}
.about-title .section-link {display:inline-block; margin:0 0 .2rem; white-space:nowrap;}
.about-education .news-content .about-program {color:var(--link); background:none; border-bottom:0;}
.about-education .news-content .about-program:is(:hover,:focus-visible) {color:var(--link-hover); border-bottom-color:var(--link-hover);}

.about-photo {
 position:absolute; z-index:-1; pointer-events:none; right:-4.5rem; top:-2.5rem;
 width:22.44rem; height:20.57rem; overflow:hidden; opacity:.26;
 --photo-feather:radial-gradient(ellipse closest-side at 55% 46%,
   #000 18%, rgba(0,0,0,.96) 32%, rgba(0,0,0,.78) 48%,
   rgba(0,0,0,.42) 66%, rgba(0,0,0,.12) 84%, transparent 100%);
 -webkit-mask-image:var(--photo-feather); mask-image:var(--photo-feather);
 -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
 -webkit-mask-size:100% 100%; mask-size:100% 100%;
}
.about-photo img {width:100%; height:100%; object-fit:cover; object-position:50% 38%;}
.about-education-section .section-head, .about-education > li:first-child {max-width:24rem;}
@media(prefers-color-scheme:dark) {.about-photo {opacity:.48;}}
@media(max-width:700px) {
 .about-photo {right:-.5rem; width:15.9rem; height:16.83rem; top:-1.5rem; opacity:.2;}
}
@media(max-width:560px) {
 .about-title-row {max-width:100%; gap:1rem;}
 .about-availability {font-size:.76rem; margin-top:.2rem;}
 .about-education-section .section-head, .about-education > li:first-child {max-width:none;}
}
@media(max-width:420px) {
 .about-photo {width:13.09rem; height:14.96rem; opacity:.14;}
}
@media print {.about-photo {display:none;} .about-education-section .section-head, .about-education > li:first-child {max-width:none;}}


.migrated-article { max-width:var(--measure); margin:0 auto; }
.migrated-article .post-header h1 { font-size:clamp(1.9rem,1.2rem + 2vw,2.6rem); line-height:1.2; }
.language-switch { display:flex; gap:.35rem; margin:1.25rem 0; }
.language-switch button { cursor:pointer; border:1px solid var(--line); border-radius:3px; padding:.3rem .65rem; background:transparent; color:var(--ink-soft); font:400 .73rem/1.6 var(--sans); }
.language-switch button[aria-pressed="true"] { background:var(--ink); color:var(--bg); border-color:var(--ink); }
.language-switch button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.post-edition[hidden] { display:none; }
.source-image-gallery figure { margin:0 0 1.5rem; }
.source-image-gallery img { width:100%; height:auto; }
.source-image-gallery figcaption { font:400 .7rem/1.6 var(--mono); color:var(--ink-muted); text-align:right; margin-top:.3rem; }
.post-source-link { font:400 .78rem/1.6 var(--sans); margin-top:2rem; color:var(--ink-soft); }
@media(max-width:600px) { .migrated-article .post-header h1 { overflow-wrap:anywhere; } }


.blog-heading-row { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.blog-heading-row h1 { margin-bottom:0; }
.collection-heading {font-size:clamp(1.7rem,2.8vw,2.4rem); font-weight:400; line-height:1.14; letter-spacing:-.025em;}
.collection-heading .blog-heading-kicker {font-size:.7em; color:var(--ink-muted);}
.collection-heading .collection-title {font:inherit; color:var(--ink);}
.blog-language { display:flex; gap:.2rem; flex-shrink:0; font-family:var(--sans); }
.blog-language button { border:0; background:none; color:var(--ink-muted); padding:.3rem .5rem; cursor:pointer; font:inherit; font-size:.8rem; }
.blog-language button[aria-pressed="true"] { color:var(--ink); text-decoration:underline; text-underline-offset:.35rem; }
.blog-heading-row + .hero-sub { margin-top:1.5rem; }
.source-text-page { margin:0 0 2rem; }
.source-text-page p { margin:0 0 1rem; }
.source-text-page h2 { margin-top:2rem; }
.source-page-marker { display:block; font-family:var(--sans); font-size:.65rem; letter-spacing:.1em; color:var(--ink-muted); margin-bottom:1rem; }
.migration-state { font-family:var(--sans); font-size:.7rem; color:var(--ink-muted); }
.original-figure { margin:2rem 0; }
.original-figure img { width:100%; height:auto; }
.original-figure figcaption { font-size:.75rem; color:var(--ink-muted); line-height:1.5; }
@media(max-width:450px) { .blog-heading-row {gap:.5rem;} .blog-language button{padding:.3rem; font-size:.75rem;} }
.original-figure-crop {overflow:hidden; position:relative;}
.original-figure-crop img {width:100%; max-width:none; height:auto; display:block;}

.generated-figure {scroll-margin-top:6.8rem;}
.figure-zoom-label {display:inline-block; white-space:nowrap; margin-left:.35rem; font-family:var(--sans); font-size:.68rem; text-decoration:none;}
.generated-figure .figure-image-link {display:block; line-height:0; cursor:zoom-in; text-decoration:none;}
.generated-figure img {
  -webkit-mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 6%,#000 94%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 6%,#000 94%,transparent);
  mask-composite:intersect;
}

.post-body {overflow-wrap:anywhere;}
.post-body pre {white-space:pre; overflow-x:auto; overflow-wrap:normal;}
.post-body table {display:block; overflow-x:auto; max-width:100%; border-collapse:collapse;}
.post-body th,.post-body td {padding:.55rem .7rem; border:1px solid var(--line); text-align:left;}
.post-edition[lang="zh-Hans"] .post-body {line-height:1.95;}


.blog-section-nav {display:flex; flex-wrap:wrap; gap:.8rem 1.6rem; margin:1.5rem 0; padding-bottom:.8rem; border-bottom:1px solid var(--line); font: .82rem var(--sans);}
.blog-section-nav a {display:inline-flex; align-items:baseline; gap:.45rem; background:none; color:var(--ink-muted); padding-bottom:.2rem;}
.collection-caveat {font-size:.64rem; color:var(--ink-muted); font-style:italic;}
.blog-section-nav a[aria-current="page"] {color:var(--ink); text-decoration:none;}
.truth-page .hero-sub {font-size:1.05rem; line-height:1.75; max-width:37rem;}
.truth-start {margin:2.5rem 0 3rem;}
.truth-start[hidden] {display:none;}
.truth-start > h2 {font:.7rem var(--sans); color:var(--ink-muted); letter-spacing:.1em; text-transform:uppercase; margin-bottom:1.3rem;}
.truth-paths {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.6rem; list-style:none; margin:0; padding:0;}
.truth-paths li {margin:0; padding:0;}
.truth-paths a {display:block; background:none; height:100%; padding-top:.8rem; border-top:1px solid var(--line);}
.truth-paths a:hover {border-top-color:var(--accent);}
.truth-path-number {font:.65rem var(--sans); color:var(--ink-muted);}
.truth-paths h3 {font-size:1.08rem; line-height:1.4; margin:.65rem 0;}
.truth-paths p {font: .83rem/1.65 var(--sans); color:var(--ink-soft); margin:0;}
.collection-breadcrumb {display:inline-block; background:none; margin-bottom:1.2rem; color:var(--ink-muted);}
@media(max-width:560px) {
 .truth-paths {grid-template-columns:1fr; gap:1.15rem;}
 .truth-paths h3 {margin:.3rem 0;}
 .truth-start {margin:2rem 0;}
 .truth-page .blog-heading-row {align-items:flex-start;}
 .truth-page .blog-language {padding-top:.6rem;}
}
.migration-state {display:block; margin-top:.35rem;}
.blog-tags[hidden] {display:none;}


body a[href] {color:var(--link); background-image:none; text-decoration-line:none;}
body :is(.post-body,.bio-more,.experience-entry) a[href],
body .news-window .news-content a[href] {text-decoration-line:underline;}
body a[href]:is(:hover,:focus-visible,:active),
body .nav-links a.active,
body .blog-section-nav a[aria-current="page"] {color:var(--link-hover); text-decoration-color:currentColor;}
body :is(.nav-links a,.hero-contact a,.news-content a,.pub-title a,a.post-title,.contact-links a,.blog-section-nav a) {border-bottom:0;}
body a.brand-home {text-decoration:none;}
a[href] :is(strong,em) {color:inherit;}
.collection-caveat {color:inherit; opacity:1;}


:root {--title-link:var(--ink); --title-link-hover:var(--link-hover);}
body .pub-title a[href], body a.post-title[href] {color:var(--title-link);}
body .pub-title a[href]:is(:hover,:focus-visible,:active), body a.post-title[href]:is(:hover,:focus-visible,:active) {color:var(--title-link-hover);}
.pub-meta, .pub-meta strong, .pub-venue {color:var(--ink-muted);}
.pub-state, .pub-submission, .research-tag {color:var(--ink-muted);}


.notebook-page .post-list > .post-series {display:block; padding:.45rem 0 .12rem; margin:.75rem 0; border:0;}
.series-heading {font-size:1.13rem; line-height:1.4; font-style:normal; color:var(--ink); margin:0 0 .25rem;}
.series-label {font:400 .68rem/1.5 var(--mono); color:var(--ink-muted);}
.series-heading .series-emphasis {color:var(--ink); font-style:italic; font-weight:600;}
.series-posts {list-style:none; padding:.12rem .9rem; margin:0; border:1px solid var(--line); border-radius:7px;}
.notebook-page .series-posts .series-entry {display:grid; grid-template-columns:1.6rem minmax(0,1fr) auto; gap:.5rem; padding:.48rem 0; margin:0; border-bottom:1px solid var(--line-soft); align-items:baseline;}
.notebook-page .series-posts .series-entry:last-child {border-bottom:0;}
.series-part {font:400 .65rem/1.6 var(--mono); color:var(--ink-muted);}
.series-posts .post-title {font-size:.99rem; line-height:1.35;}
.series-posts .post-date {font-size:.67rem;}
.series-continuation {margin:.3rem .9rem 0; font:400 .7rem/1.5 var(--sans); color:var(--ink-muted);}
.article-series-link {display:block; width:fit-content; margin:0 0 .8rem; font:400 .76rem/1.5 var(--sans); background:none;}
@media(max-width:560px) {
 .series-posts {padding:.1rem .7rem;}
 .notebook-page .series-posts .series-entry {grid-template-columns:1.4rem minmax(0,1fr); gap:.4rem .5rem;}
 .series-entry .post-date {grid-column:2;}
}
.series-heading {scroll-margin-top:6rem;}


.about-education > li:first-child {max-width:28rem;}
main > .home-opportunities {margin-top:0; margin-bottom:1.75rem;}
.opportunity-note .opportunity-copy {
 margin:0; padding:0 0 0 .9rem; border-left:2px solid var(--line);
 font:400 .81rem/1.65 var(--sans); color:var(--ink-soft);
}
.opportunity-copy strong {font-weight:500; color:var(--ink);}
.opportunity-copy .availability-types {display:inline; margin:0 0 0 .3rem; font-size:.73rem;}
.opportunity-copy .availability-fields {display:block; margin-top:.25rem;}

.site-guide {max-width:var(--measure); margin:0 auto 2.4rem; padding:.9rem 0 1rem; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem; border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);}
.guide-link {font:500 .8rem/1.5 var(--sans); background:none;}
.site-guide p {margin:.35rem 0 0; font:400 .72rem/1.65 var(--sans); color:var(--ink-muted);}
@media(max-width:520px) {
 .site-guide {grid-template-columns:1fr; gap:.85rem;}
 .site-guide p {margin-top:.15rem;}
 .opportunity-copy .availability-types {display:block; margin:.1rem 0 .25rem;}
}


.about-degree-line {display:flex; flex-wrap:wrap; align-items:baseline; column-gap:.7rem; row-gap:.05rem;}
.about-degree-line .about-honour {display:inline; margin:0; font-size:.62rem; line-height:1.5; white-space:nowrap;}


.notebook-page main.container {padding-top:1.7rem;}
.notebook-page .blog-heading-row + .hero-sub {margin-top:.65rem;}
.notebook-page .blog-section-nav {margin:.85rem 0 .7rem; padding-bottom:.6rem;}
.notebook-page .blog-controls {margin:.8rem 0 .7rem; gap:.5rem;}
.notebook-page .blog-search {padding:.42rem .85rem;}
.notebook-page .notebook-index {padding:.35rem 0;}


.tag-explanation {position:fixed; z-index:80; width:max-content; max-width:min(300px,calc(100vw - 24px)); padding:.65rem .8rem; background:var(--bg-elev); color:var(--ink-soft); border:1px solid var(--line); border-radius:6px; box-shadow:0 8px 28px rgba(0,0,0,.25); font:400 .75rem/1.65 var(--sans);}
.tag-explanation[hidden] {display:none;}
.tag-explanation strong {display:block; margin-bottom:.25rem; font-weight:500; color:var(--ink);}
.tag-explanation span {display:block;}
.collection-lock {width:.72rem; height:.72rem; flex-shrink:0; align-self:center; margin-left:-.15rem;}
.series-entry .post-list-tags {display:inline-flex; margin:0 0 0 .35rem; vertical-align:middle;}
.series-header {display:flex; flex-wrap:wrap; align-items:baseline; gap:.25rem .6rem; margin-bottom:.4rem;}
.series-header .series-heading {margin:0;}
.series-tag-list {display:inline-flex; flex-wrap:wrap; gap:.25rem;}


main > section.news {margin-bottom:2rem;}
.posts-preview .section-head {margin-bottom:.35rem; padding-bottom:.35rem;}
main > section.posts-preview {margin-bottom:1.5rem;}
.recent-posts-window {max-height:11rem; overflow-y:auto; scrollbar-gutter:stable; padding-right:.7rem; scrollbar-width:thin; scrollbar-color:var(--ink-muted) transparent;}
.recent-posts-window:focus-visible {outline:1px solid var(--link); outline-offset:5px;}
.recent-posts-window .post-list {padding:0; margin:0; list-style:none;}
.recent-posts-window li {display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:baseline; gap:.65rem; padding:.35rem 0; border-bottom:1px solid var(--line-soft);}
.recent-posts-window li:last-child {border-bottom:0;}
.recent-posts-window .post-title {font-size:.95rem; line-height:1.3;}
.recent-posts-window .post-date {font-size:.64rem; white-space:nowrap;}


.hero-sub .latent-structure {white-space:nowrap;}


.hero-intro .headline-lead,.hero-intro .headline-explanation {display:block;}
.notebook-page .notebook-index {justify-content:flex-end;}
@media(min-width:900px){
 .hero-intro summary {font-size:1rem; line-height:1.55;}
 .hero-intro .headline-lead {white-space:nowrap;}
}


.publications-heading-row {display:block;}
.publications-heading-row h1 {margin:0;}
.publications-scholar {display:inline-flex; align-items:center; justify-content:center; width:.58em; height:.58em; vertical-align:.07em; margin-left:.25em; color:var(--link); text-decoration:none; border:0; transition:color .2s ease,transform .2s ease;}
.publications-scholar svg {width:100%; height:100%;}
.publications-scholar:hover {color:var(--link-hover); transform:translateY(-1px);}
.publications-scholar:focus-visible {outline:1px solid var(--accent); outline-offset:3px; border-radius:3px;}

.about-contact a {display:inline-flex; align-items:center; gap:.3rem;}


.hero-intro .headline-ending {white-space:nowrap;}
.hero-text {min-width:0;}
@media(max-width:640px) {
 .site-header {padding:.8rem 0;}
 .nav {flex-direction:row; flex-wrap:wrap; align-items:center; gap:.4rem .75rem;}
 .brand {font-size:1rem;}
 .brand-home {gap:.4rem;}
 .brand-mark {width:1.8rem; height:1.8rem;}
 .nav-links {font-size:.75rem; gap:.75rem; margin-left:auto;}
 .nav-links a {display:inline-flex; align-items:center; min-height:2rem; padding-bottom:0;}
 main > section {margin-bottom:2.5rem;}
 .hero {display:grid; grid-template-columns:5rem minmax(0,1fr); column-gap:.9rem; row-gap:.4rem; align-items:center; margin-top:.5rem !important; margin-bottom:1.7rem !important;}
 .hero .avatar-wrap {width:5rem; height:5rem; grid-column:1; grid-row:1 / 3;}
 .hero-text {display:contents;}
 .hero-text h1 {grid-column:2; align-self:end; font-size:1.7rem; margin:0;}
 .hero .tagline {grid-column:2; align-self:start; margin:0; font-size:.8rem; line-height:1.5;}
 .hero-contact {grid-column:1 / -1; gap:.25rem 1rem; margin:.25rem 0; font-size:.8rem;}
 .hero-contact a {min-height:2rem;}
 .hero-intro {grid-column:1 / -1;}
 .hero-intro summary {font-size:1rem; line-height:1.6;}
 .hero-intro .headline-lead {white-space:normal;}
 .hero-intro .headline-lead,.hero-intro .headline-explanation {text-wrap:balance;}
 .hero-intro .bio-more {margin-top:.8rem;}
 .hero-intro .bio-more p {font-size:1rem;}
 .blog-heading-row {display:grid; grid-template-columns:minmax(0,1fr); gap:.35rem;}
 .blog-language {justify-self:end;}
 .notebook-page .blog-heading-row + .hero-sub {margin-top:.35rem;}
 .notebook-page .blog-search {font-size:1rem;}
 .notebook-page .blog-tags .filter-chip {min-height:1.75rem; padding:.15rem .4rem; font-size:.65rem;}
 .notebook-page .post-list > .post-list-item {display:grid; grid-template-columns:minmax(0,1fr); gap:.25rem;}
 .notebook-page .post-list > .post-list-item > .post-date {font-size:.68rem;}
 .notebook-page .series-posts .series-entry {grid-template-columns:1.3rem minmax(0,1fr); gap:.25rem .4rem;}
 .notebook-page .series-entry .post-date {grid-column:2; font-size:.68rem;}
 .series-entry .post-list-tags {display:flex; margin:.18rem 0 0;}
 .about-education > li {grid-template-columns:minmax(0,1fr); gap:.2rem;}
 .about-education .news-date {font-size:.7rem;}
 .about-education .about-diploma a {display:inline-block;}
 .about-degree-line {row-gap:.15rem;}
 .technical-background > div {grid-template-columns:minmax(0,1fr); gap:.25rem;}
}
@media(max-width:360px) {
 .nav-links {width:100%; margin-left:0; justify-content:space-between;}
 .hero {grid-template-columns:4.5rem minmax(0,1fr); column-gap:.7rem;}
 .hero .avatar-wrap {width:4.5rem; height:4.5rem;}
 .hero-text h1 {font-size:1.55rem;}
}


.post-body h2,.post-body h3 {scroll-margin-top:6.5rem;}
.heading-anchor {font:400 .65em/1 var(--sans); margin-left:.45em; opacity:0; text-decoration:none !important; border:0 !important;}
.post-body h2:hover .heading-anchor,.post-body h3:hover .heading-anchor,.heading-anchor:focus-visible {opacity:.8;}
.article-outline {margin:1.4rem 0 1.8rem; padding:.65rem .85rem; border-block:1px solid var(--line); font:400 .8rem/1.8 var(--sans); color:var(--ink-soft);}
.article-outline summary {cursor:pointer; color:var(--ink-soft);}
.article-outline summary span {float:right; color:var(--ink-muted);}
.article-outline ol {margin:.6rem 0 .25rem; padding-left:1.2rem;}
.article-outline .outline-level-3 {margin-left:.6rem; font-size:.95em;}
.article-outline a {text-decoration:none !important; border:0 !important;}
.article-outline .reading-guide-label {margin:.85rem 0 .3rem; color:var(--ink-muted); font:500 .7rem/1.5 var(--sans); letter-spacing:.05em;}
.article-outline .article-tldr > p:not(.reading-guide-label) {margin:.35rem 0 .65rem; color:var(--ink); font:400 .9rem/1.85 var(--sans);}
.article-outline .article-contents {border-top:1px solid var(--line); margin-top:.85rem; padding-top:.1rem;}
.post-body > .article-lead {font-style:italic; color:var(--ink-soft);}
.post-body .math-display {margin:1.6rem 0; max-width:100%; overflow-x:auto; overflow-y:hidden; padding:.3rem .2rem; scrollbar-width:thin; scrollbar-color:var(--ink-muted) transparent;}
.post-body .katex {font-size:1.08em; overflow-wrap:normal; word-break:normal;}

.post-body .katex .accent {color:inherit; font-family:inherit; font-style:normal;}
.post-body .katex-display {margin:.4rem 0;}
.post-body .katex-display > .katex {max-width:none; white-space:nowrap;}
.post-body .article-table {margin:1.7rem 0; max-width:100%;}
.article-table > figcaption {font:400 .75rem/1.6 var(--sans); color:var(--ink-muted); margin-bottom:.5rem;}
.table-scroll {position:relative; max-width:100%; overflow-x:auto; scrollbar-width:thin; scrollbar-color:var(--ink-muted) transparent;}
.post-body .table-scroll table {display:table; width:100%; margin:0; font:400 .84rem/1.65 var(--sans); border-collapse:collapse;}
.post-body .table-scroll .katex {position:relative;}
.post-body .table-scroll th {text-align:left; font-weight:500; color:var(--ink); background:var(--bg-elev);}
.post-body .table-scroll th,.post-body .table-scroll td {min-width:6rem; padding:.6rem .75rem; border:1px solid var(--line); vertical-align:top;}
.post-body .note-callout {margin:1.6rem 0; padding:.85rem 1rem; border-left:2px solid var(--accent); background:var(--bg-elev);}
.note-callout-label {display:block; color:var(--ink-muted); font:400 .68rem/1.6 var(--sans); margin-bottom:.45rem; letter-spacing:.03em;}
.note-callout p:last-child {margin-bottom:0;}
.post-body .original-caption {margin-top:2rem; padding:.65rem 0; border-top:1px solid var(--line); color:var(--ink-soft); font-size:.88em;}
.original-caption summary {cursor:pointer; font:400 .75rem/1.7 var(--sans); color:var(--ink-muted);}
.original-caption[open] summary {margin-bottom:.8rem;}
.post-body .related-reading {margin-top:2.2rem; padding-top:1rem; border-top:1px solid var(--line);}
.post-body .related-reading h2 {font:500 .8rem/1.7 var(--sans); color:var(--ink-muted); margin:0 0 .6rem;}
.post-body .related-reading ul {list-style:none; padding:0; margin:0;}
.post-body .related-reading li {margin:.35rem 0; font-size:.92em;}
.related-reading a {text-decoration:none !important; border:0 !important;}
.related-reading a span {color:var(--accent); margin-right:.25rem;}
.figure-number {font-weight:500;}
.figure-source {margin-left:.3em;}
@media(max-width:640px) {
 .post-body .math-display {font-size:.84em;}
 .post-body .table-scroll table {font-size:.74rem;}
 .article-outline {font-size:.75rem;}
 .heading-anchor {opacity:.55;}
}
@media(prefers-reduced-motion:no-preference) {
 .heading-anchor {transition:opacity .15s ease;}
}


.article-outline.numbered-outline ol {list-style:none; padding-left:0;}
.article-outline.numbered-outline .outline-level-3 {margin-left:1rem;}


.guided-reading {
 --reading-focus:#805100;
 --reading-section:#805c24;
 --reading-tint:rgba(190,140,35,.09);
 --reading-edge:rgba(140,100,25,.28);
}
@media(prefers-color-scheme:dark) {
 .guided-reading {
  --reading-focus:#f5d96c;
  --reading-section:#dac38e;
  --reading-tint:rgba(245,217,108,.055);
  --reading-edge:rgba(245,217,108,.24);
 }
}
.guided-reading .post-body > h2 {
 font-size:clamp(1.45rem,1.2rem + .6vw,1.7rem);
 line-height:1.35; margin:3.2rem 0 1.1rem; padding-top:1.15rem;
 border-top:1px solid var(--line); color:var(--ink); font-weight:500;
}
.guided-reading .post-body > h3 {
 display:flex; align-items:baseline; flex-wrap:wrap; gap:.3rem .6rem;
 font-size:1.24rem; line-height:1.5; font-weight:500;
 margin:2.25rem 0 .95rem; padding:.08rem 0;
 border-left:0; color:var(--reading-section);
}
.guided-reading .subsection-number {
 font:500 .78rem/1.5 var(--sans); font-variant-numeric:tabular-nums;
 color:var(--reading-focus); letter-spacing:.02em;
}
.guided-reading .subsection-title {flex:1; min-width:0;}
.guided-reading h3 .heading-anchor {margin-left:0;}
.guided-reading .reading-highlight {
 color:var(--reading-focus); background:color-mix(in srgb,var(--reading-focus) 9%,transparent);
 border-radius:2px; padding:.03em .13em; font-weight:500;
 -webkit-box-decoration-break:clone; box-decoration-break:clone;
}
.guided-reading .post-body .note-callout {
 margin:1.7rem 0; padding:1rem 1.15rem;
 border:1px solid var(--reading-edge); border-left:3px solid var(--reading-focus);
 border-radius:0 6px 6px 0; background:var(--reading-tint);
}
.guided-reading .note-callout-label {
 color:var(--reading-section); font-size:.7rem;
 letter-spacing:.045em; text-transform:uppercase; margin-bottom:.55rem;
}
.guided-reading .note-callout .reading-highlight {background:transparent; padding:0;}
.guided-reading .article-outline .outline-level-2 {margin-top:.45rem;}
.guided-reading .article-outline .outline-level-2 > a {color:var(--ink); font-weight:500;}
.guided-reading .article-outline .outline-level-3 > a {color:var(--reading-section);}
@media(max-width:640px) {
 .guided-reading .post-body > h2 {font-size:1.4rem; margin-top:2.7rem;}
 .guided-reading .post-body > h3 {
  font-size:1.12rem; margin-left:0; padding-left:0; gap:.25rem .5rem;
 }
 .guided-reading .subsection-number {font-size:.73rem;}
 .guided-reading .post-body .note-callout {padding:.85rem .8rem;}
}


.generated-figure.text-diagram img {
  -webkit-mask-image:linear-gradient(to right,transparent,#000 1%,#000 99%,transparent),linear-gradient(to bottom,transparent,#000 1%,#000 99%,transparent);
  mask-image:linear-gradient(to right,transparent,#000 1%,#000 99%,transparent),linear-gradient(to bottom,transparent,#000 1%,#000 99%,transparent);
}
.generated-figure.text-diagram figcaption {margin-top:.65rem;}


.generated-figure .original-figure-crop img {margin:0; border-radius:0;}

.about-photo > picture,.portrait-wrap > picture {display:block;width:100%;height:100%;}

.news .news-content strong {color:var(--news-highlight);font-weight:500;}

.research-tabs {display:flex;flex-wrap:wrap;gap:.1rem 1rem;margin:.2rem 0 .85rem;border-bottom:1px solid var(--line);}
.research-tabs [role="tab"] {appearance:none;display:block;min-height:2.5rem;padding:.45rem .08rem;background:none;border:0;border-bottom:2px solid transparent;border-radius:0;color:var(--ink-soft);font:400 .74rem/1.5 var(--sans);text-align:left;cursor:pointer;}
.research-tabs [role="tab"]:hover {color:var(--accent);}
.research-tabs [role="tab"][aria-selected="true"] {color:var(--ink);border-bottom-color:var(--accent);}
.research-tabs [role="tab"]:focus-visible,.research-panel:focus-visible {outline:1px solid var(--accent);outline-offset:4px;}
.research-tabs[hidden],.research-panel[hidden] {display:none;}
.research-panel-label {margin:1rem 0 .35rem;font:500 .76rem/1.6 var(--sans);color:var(--ink-muted);}
.research-tabs-ready .research-panel-label {display:none;}
.research-panel > .experience-entry:first-of-type {padding-top:.25rem;}
.research-panel .experience-entry h3 {margin-bottom:.12rem;}
.research-panel .experience-meta {margin-bottom:.9rem;}
@media(max-width:640px) {
 .research-tabs {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 .8rem;}
 .research-tabs [role="tab"] {min-width:0;min-height:2.65rem;font-size:.72rem;}
}
@media print {
 .research-tabs {display:none;}
 .research-panel[hidden],.research-tabs-ready .research-panel-label {display:block;}
}
