@charset "UTF-8";
/*
  Latin Modern (GUST, GFL), converted from the OTF sources to WOFF2.
  Latin Modern has no Bengali coverage, so Noto Serif Bengali is listed after
  it in the stacks below for the হ য ব র ল pages.
*/
@font-face {
  font-family: "Latin Modern Roman";
  src: url("/assets/fonts/lmroman10-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Latin Modern Roman";
  src: url("/assets/fonts/lmroman10-bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Latin Modern Roman";
  src: url("/assets/fonts/lmroman10-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Latin Modern Roman";
  src: url("/assets/fonts/lmroman10-bolditalic.woff2") format("woff2");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Latin Modern Sans";
  src: url("/assets/fonts/lmsans10-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Latin Modern Sans";
  src: url("/assets/fonts/lmsans10-bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Latin Modern Mono";
  src: url("/assets/fonts/lmmono10-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
/*
  Dark is the default theme, so the dark palette lives on :root and the light
  one is applied only when the visitor has explicitly chosen it. That way a
  visitor with JavaScript disabled still gets a coherent dark page rather than
  dark text on a white ground.
*/
:root {
  color-scheme: dark;
  --ink: #ffe1c2;
  --muted: #b7aaa1;
  --paper: #121212;
  --paper-deep: #171522;
  --card: #181522;
  --red: #d21312;
  --red-bright: #ed4840;
  --navy: #ed8074;
  --navy-soft: #c15a52;
  --amber: #ffb43b;
  --amber-pale: #30213a;
  --line: #4c3b53;
  --box: #252858;
  --box-ink: #ffda4f;
  --strong: #ffda4f;
  --table-head: #30213a;
  --table-even: #211b2d;
  --footer-bg: #10101b;
  --shadow: 0 16px 42px rgba(0, 0, 0, 0.34);
  --serif: "Latin Modern Roman", "Noto Serif Bengali", Georgia, serif;
  --sans: "Latin Modern Sans", "Noto Serif Bengali", Arial, sans-serif;
  --mono: "Latin Modern Mono", monospace;
}

html[data-theme=light] {
  color-scheme: light;
  --ink: #29231f;
  --muted: #665c52;
  --paper: #fff6d9;
  --paper-deep: #f5e9c7;
  --card: #fffaf0;
  --red: #b51212;
  --red-bright: #d21312;
  --navy: #28205b;
  --navy-soft: #45418b;
  --amber: #b58418;
  --amber-pale: #efe1bd;
  --line: #d7c69e;
  --box: #efe1bd;
  --box-ink: #28205b;
  --strong: #8b0f13;
  --table-head: #28205b;
  --table-even: #f5ecd5;
  --footer-bg: #f1e3bd;
  --shadow: 0 16px 42px rgba(71, 46, 12, 0.14);
}

/*
  Base elements
*/
* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--paper);
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--serif);
  font-size: 17px;
  line-height: 1.72;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Text selection is intentionally disabled site-wide. */
* {
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

a {
  color: var(--red-bright);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

a:hover {
  color: var(--amber);
}

h1, h2, h3, h4, h5, h6 {
  color: var(--navy);
  font-family: var(--serif);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.15;
}

h1 {
  font-size: clamp(1.55rem, 2.8vw, 2.2rem);
}

h2 {
  font-size: 1.3rem;
}

h3 {
  font-size: 1.1rem;
}

strong {
  color: var(--strong);
}

hr {
  height: 0;
  margin: 2.5rem 0;
  border: 0;
  border-top: 1px solid var(--line);
}

img {
  max-width: 100%;
  height: auto;
  border-radius: 5px;
}

blockquote {
  margin: 1.6rem 0;
  padding: 1rem 1.35rem;
  color: var(--box-ink);
  background: var(--box);
  border-left: 0.25em solid var(--amber);
  border-radius: 0 5px 5px 0;
  line-height: 1.5;
}

blockquote p {
  margin: 0;
}

code, pre {
  font-family: var(--mono);
  font-size: 0.92em;
}

code {
  padding: 0.1em 0.35em;
  background: var(--amber-pale);
  border-radius: 3px;
}

pre {
  overflow-x: auto;
  padding: 1rem 1.2rem;
  background: var(--paper-deep);
  border: 1px solid var(--line);
  border-radius: 5px;
}

pre code {
  padding: 0;
  background: none;
}

/*
  Tables
*/
table {
  width: 100%;
  margin-bottom: 2rem;
  border-collapse: collapse;
  font-size: 0.95rem;
}

table th {
  color: var(--paper);
  background: var(--table-head);
  font-family: var(--sans);
  text-align: left;
}

table th, table td {
  padding: 0.6rem 0.85rem;
  border: 1px solid var(--line);
}

table tr:nth-child(even) td {
  background: var(--table-even);
}

@media (max-width: 30em) {
  body {
    font-size: 15px;
    line-height: 1.6;
  }
}
/*
  Theme toggle
*/
#theme-toggle {
  position: fixed;
  z-index: 20;
  top: 1rem;
  right: 1rem;
  width: 3.3rem;
  height: 3.3rem;
  padding: 0;
  color: var(--amber);
  background: var(--paper-deep);
  border: 1px solid var(--line);
  border-radius: 100px;
  font-family: var(--sans);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
}

#theme-toggle:hover {
  color: var(--red-bright);
}

#theme-toggle .theme-icon {
  display: inline-block;
  transform: translateY(-0.02em);
}

/*
  Masthead — the dark band carrying the site name and nav
*/
.masthead {
  /*
    The masthead stays dark in both themes — it is the site's identity band,
    and the reference design treats it the same way. Its colours are therefore
    deliberately fixed rather than themed: do not swap them for tokens, or the
    light theme loses the contrast these values assume.
  */
  --masthead-ink: #f0e7df;
  --masthead-dim: #d9d0c8;
  --masthead-accent: #ffe2ad;
  --masthead-rule: rgba(255, 226, 173, 0.22);
  color: var(--masthead-ink);
  background: #10101b;
  border-bottom: 5px solid #d21312;
}

.masthead-inner {
  max-width: 980px;
  margin: 0 auto;
  padding: 1.5rem 2.2rem 1.2rem;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 0.7rem;
  color: var(--masthead-accent);
  font-family: var(--sans);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}

.eyebrow::before {
  content: "";
  width: 2.6rem;
  height: 2px;
  background: #ed4840;
}

.masthead .site-name {
  display: block;
  margin: 0;
  color: #df6d68;
  font-family: var(--serif);
  font-size: clamp(2.1rem, 5vw, 3.4rem);
  font-weight: 600;
  letter-spacing: -0.045em;
  line-height: 1;
  text-decoration: none;
}

.masthead .site-name:hover {
  color: #ffb43b;
}

.subtitle {
  max-width: 46rem;
  margin: 0.9rem 0 0;
  color: var(--masthead-dim);
  font-family: var(--serif);
  font-size: clamp(1.02rem, 2vw, 1.24rem);
  line-height: 1.45;
}

/*
  Navigation
*/
.nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem 1.4rem;
  margin-top: 1.3rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--masthead-rule);
}

.nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  font-family: var(--sans);
  font-size: 0.9rem;
}

.nav-links a {
  color: var(--masthead-ink);
  text-decoration: none;
}

.nav-links a:hover,
.nav-links a[aria-current=page] {
  color: #ffb43b;
}

.nav-social {
  display: flex;
  gap: 0.9rem;
  font-size: 1rem;
}

.nav-social a {
  color: #bcb2aa;
  transition: color 0.35s;
}

.nav-social a:hover {
  color: #ed4840;
}

/*
  Page body
*/
.page {
  max-width: 820px;
  margin: 0 auto;
  padding: 3rem 2.2rem 5rem;
}

.page > h1:first-child {
  margin: 0 0 2rem;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid var(--line);
}

article h1 {
  margin: 3.4rem 0 1.1rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--line);
}

article h1:first-of-type {
  margin-top: 0.4rem;
  padding-top: 0;
  border-top: 0;
}

article h2 {
  margin: 2.2rem 0 0.6rem;
}

/*
  Home
*/
.bio {
  display: grid;
  grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
  gap: 2.8rem;
  align-items: start;
}

.bio-portrait img {
  display: block;
  width: 100%;
  border-radius: 6px;
  box-shadow: var(--shadow);
}

.bio-links {
  margin-top: 1.4rem;
  font-family: var(--sans);
  font-size: 0.86rem;
  line-height: 1.9;
}

.bio-links a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
}

.bio-links a i {
  flex: none;
  width: 1.1rem;
  color: var(--amber);
  font-size: 0.95rem;
  text-align: center;
}

.bio-links a:hover i {
  color: var(--red-bright);
}

.bio-text p:first-child {
  margin-top: 0;
}

@media (max-width: 768px) {
  .bio {
    grid-template-columns: 1fr;
    gap: 1.8rem;
  }
  .bio-portrait {
    max-width: 240px;
  }
}
/*
  Cards — publications, talks, courses. Applied to the ordered lists that
  kramdown generates on pages with `cards: true` in their front matter.
*/
.cards-page ol {
  margin: 0 0 2.5rem;
  padding: 0;
  list-style: none;
  counter-reset: card;
}

.cards-page ol > li {
  position: relative;
  margin-bottom: 0.9rem;
  padding: 1rem 1.35rem 1rem 3.2rem;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 6px;
}

.cards-page ol > li::before {
  counter-increment: card;
  content: counter(card);
  position: absolute;
  top: 0.95rem;
  left: 1.25rem;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
}

.cards-page ol > li p:first-child strong,
.cards-page ol > li > strong {
  color: var(--strong);
  font-size: 1.03rem;
}

.cards-page ol em {
  color: var(--muted);
  font-style: italic;
}

.cards-page ol > li p {
  margin: 0.15rem 0;
}

/*
  Reference lists — publications and talks, set as a numbered bibliography with
  a hanging indent rather than as cards. Opted into per list with {: .refs}.
*/
.cards-page ol.refs {
  margin: 0 0 2.5rem;
  padding-left: 2.5rem;
  counter-reset: ref;
}

.cards-page ol.refs > li {
  position: static;
  margin-bottom: 1.05rem;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  text-indent: -2.5rem;
  padding-left: 2.5rem;
  line-height: 1.6;
}

.cards-page ol.refs > li::before {
  counter-increment: ref;
  content: "[" counter(ref) "]";
  position: static;
  display: inline-block;
  width: 2.5rem;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
  text-indent: 0;
}

/* Own name is bolded for scanning, not accented — a reference list should stay
   typographically quiet. Selector has to out-specify the card-title rule
   above, which also matches `li p:first-child strong`. */
.cards-page ol.refs > li p:first-child strong,
.cards-page ol.refs > li strong {
  color: inherit;
  font-size: inherit;
}

.cards-page ol.refs em {
  color: inherit;
}

.cards-page ol.refs p {
  display: inline;
  margin: 0;
}

/*
  Posts
*/
.post-list {
  margin: 0 0 3rem;
  padding: 0;
  list-style: none;
}

.post-list li {
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--line);
}

.post-list a {
  text-decoration: none;
}

.post-date {
  display: block;
  margin: 0.4rem 0 1.5rem;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 0.8rem;
}

.post-excerpt {
  margin-bottom: 3rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--line);
}

.post-excerpt h2 {
  margin-top: 0;
}

/*
  Footer
*/
.footer {
  padding: 2rem 2.2rem;
  color: var(--muted);
  background: var(--footer-bg);
  border-top: 1px solid var(--line);
  font-family: var(--sans);
  font-size: 0.82rem;
  text-align: center;
}

.footer-social {
  display: flex;
  justify-content: center;
  gap: 1.1rem;
  margin-bottom: 0.9rem;
  font-size: 1.05rem;
}

.footer-social a {
  color: var(--muted);
  transition: color 0.35s;
}

.footer-social a:hover {
  color: var(--red-bright);
}

/*# sourceMappingURL=main.css.map */