:root {
  --cd-bg: #efede8;
  --cd-surface: #ffffff;
  --cd-text: #20262c;
  --cd-muted: #5f6b76;
  --cd-accent: #2d5168;
  --cd-accent-strong: #b55c3b;
  --cd-accent-warm: #d88a5b;
  --cd-accent-gold: #d5b46a;
  --cd-accent-soft: #a9c4d1;
  --cd-border: #d7d9d4;
  --cd-inline-code-bg: rgba(216, 138, 91, 0.14);
  --cd-inline-code-border: rgba(181, 92, 59, 0.2);
  --cd-inline-code-text: inherit;
  --cd-particle-rgb: 216, 138, 91;
  --cd-particle-line-rgb: 181, 92, 59;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --cd-bg: #11161b;
  --cd-surface: #172028;
  --cd-text: #e6ecef;
  --cd-muted: #aab5bc;
  --cd-accent: #8ab5cf;
  --cd-accent-strong: #f0aa76;
  --cd-accent-warm: #d98f67;
  --cd-accent-gold: #d6b76d;
  --cd-accent-soft: #385566;
  --cd-border: #2e3a43;
  --cd-inline-code-bg: rgba(240, 170, 118, 0.14);
  --cd-inline-code-border: rgba(240, 170, 118, 0.18);
  --cd-inline-code-text: inherit;
  --cd-particle-rgb: 240, 170, 118;
  --cd-particle-line-rgb: 217, 143, 103;
  color-scheme: dark;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--cd-bg);
  color: var(--cd-text);
  line-height: 1.7;
  position: relative;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -3;
  background:
    radial-gradient(circle at top left, rgba(169, 196, 209, 0.28), transparent 34%),
    radial-gradient(circle at 82% 18%, rgba(213, 180, 106, 0.18), transparent 24%),
    radial-gradient(circle at 70% 78%, rgba(181, 92, 59, 0.12), transparent 26%),
    linear-gradient(180deg, #f1efe9 0%, #e7e2d9 100%);
}

:root[data-theme="dark"] body::before {
  background:
    radial-gradient(circle at top left, rgba(56, 85, 102, 0.55), transparent 34%),
    radial-gradient(circle at 82% 18%, rgba(214, 183, 109, 0.14), transparent 24%),
    radial-gradient(circle at 70% 78%, rgba(217, 143, 103, 0.12), transparent 24%),
    linear-gradient(180deg, #0f1419 0%, #131b21 100%);
}

#particles-layer {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -2;
  pointer-events: none;
  opacity: 0.75;
}

.back-to-top {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1040;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border: 1px solid rgba(32, 38, 44, 0.08);
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(23, 32, 40, 0.9), rgba(23, 32, 40, 0.78)),
    rgba(23, 32, 40, 0.58);
  color: #f5f2ea;
  box-shadow: 0 16px 30px rgba(32, 38, 44, 0.22);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  opacity: 0;
  visibility: hidden;
  transform: translateY(0.5rem);
  pointer-events: none;
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.back-to-top:hover,
.back-to-top:focus-visible {
  color: #ffffff;
  border-color: rgba(240, 170, 118, 0.26);
  box-shadow: 0 0 0 4px rgba(240, 170, 118, 0.18), 0 20px 36px rgba(32, 38, 44, 0.28);
  outline: none;
}

.back-to-top-icon {
  font-size: 1.15rem;
  line-height: 1;
}

:root[data-theme="dark"] .back-to-top {
  border-color: rgba(32, 38, 44, 0.08);
  background:
    linear-gradient(180deg, rgba(248, 246, 241, 0.92), rgba(248, 246, 241, 0.76)),
    rgba(248, 246, 241, 0.58);
  color: #172028;
  box-shadow: 0 18px 32px rgba(0, 0, 0, 0.28);
}

:root[data-theme="dark"] .back-to-top:hover,
:root[data-theme="dark"] .back-to-top:focus-visible {
  color: #11161b;
  border-color: rgba(45, 81, 104, 0.2);
  box-shadow: 0 0 0 4px rgba(138, 181, 207, 0.16), 0 20px 38px rgba(0, 0, 0, 0.34);
}

.navbar {
  border-bottom: 1px solid rgba(32, 38, 44, 0.08);
  background: rgba(248, 246, 241, 0.9);
  backdrop-filter: blur(10px);
  transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
  box-shadow: 0 8px 20px rgba(32, 38, 44, 0.03);
}

:root[data-theme="dark"] .navbar {
  border-bottom-color: rgba(230, 236, 239, 0.08);
  background: rgba(17, 22, 27, 0.84);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
}

.navbar-brand,
.nav-link,
h1,
h2,
h3,
h4 {
  letter-spacing: 0.01em;
}

code:not(.sourceCode) {
  padding: 0.16rem 0.42rem;
  border: 1px solid var(--cd-inline-code-border);
  border-radius: 0.42rem;
  background-color: var(--cd-inline-code-bg) !important;
  color: var(--cd-inline-code-text) !important;
  font-size: 0.92em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

pre > code:not(.sourceCode) {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent !important;
}

.quarto-title-block .description,
.page-intro,
.lead-block {
  color: var(--cd-muted);
}

.hero,
.page-shell {
  padding: 1.5rem;
  margin: 1.5rem 0 2rem;
  border: 1px solid var(--cd-border);
  border-radius: 0.9rem;
  box-shadow: 0 10px 30px rgba(32, 38, 44, 0.04);
  position: relative;
  overflow: hidden;
}

.hero {
  background:
    linear-gradient(135deg, rgba(213, 180, 106, 0.08), rgba(255, 255, 255, 0) 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.42) 0%, rgba(255, 255, 255, 0.5) 100%);
  border-color: rgba(32, 38, 44, 0.05);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.page-shell {
  background:
    linear-gradient(135deg, rgba(213, 180, 106, 0.08), rgba(255, 255, 255, 0) 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.8) 100%);
}

:root[data-theme="dark"] .hero,
:root[data-theme="dark"] .page-shell {
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.22);
}

:root[data-theme="dark"] .hero {
  background:
    linear-gradient(135deg, rgba(214, 183, 109, 0.08), rgba(255, 255, 255, 0) 28%),
    linear-gradient(180deg, rgba(23, 32, 40, 0.48) 0%, rgba(19, 27, 33, 0.44) 100%);
  border-color: rgba(230, 236, 239, 0.06);
}

:root[data-theme="dark"] .page-shell {
  background:
    linear-gradient(135deg, rgba(214, 183, 109, 0.08), rgba(255, 255, 255, 0) 28%),
    linear-gradient(180deg, rgba(23, 32, 40, 0.96) 0%, rgba(19, 27, 33, 0.92) 100%);
}

.hero::after,
.page-shell::after {
  content: "";
  position: absolute;
  inset: auto -12% -36% auto;
  width: 16rem;
  height: 16rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(213, 180, 106, 0.26) 0%, rgba(213, 180, 106, 0) 72%);
  pointer-events: none;
}

.hero h2,
.page-shell h2 {
  margin-top: 0;
}

.contact-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 0 0 2rem;
}

.contact-option-card {
  padding: 1.3rem;
  border: 1px solid var(--cd-border);
  border-radius: 0.9rem;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 10px 26px rgba(32, 38, 44, 0.05);
}

.contact-option-card h2 {
  margin-top: 0;
}

.contact-email {
  margin: 1.4rem 0 0;
  font-size: clamp(0.92rem, 0.86rem + 0.25vw, 1.05rem);
  overflow-wrap: anywhere;
  text-align: center;
}

.contact-email a {
  font-weight: 700;
}

.contact-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.7rem;
  margin: 1.15rem 0 1.35rem;
}

.contact-actions > p {
  margin: 0;
}

.contact-option-card code {
  display: inline-block;
  max-width: 100%;
  padding: 0.45rem 0.65rem;
  overflow-wrap: anywhere;
  white-space: normal;
}

.fingerprint-help {
  margin: 0.35rem 0 0.65rem;
  color: var(--cd-muted);
  font-size: 0.86rem;
  font-style: italic;
  line-height: 1.35;
}

.fingerprint-help p {
  margin: 0;
}

:root[data-theme="dark"] .contact-option-card {
  background: rgba(23, 32, 40, 0.82);
}

.feature-card,
.section-card {
  height: 100%;
  padding: 1.25rem;
  border: 1px solid var(--cd-border);
  border-radius: 0.85rem;
  box-shadow: 0 8px 24px rgba(32, 38, 44, 0.04);
  position: relative;
  overflow: hidden;
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.feature-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.5)),
    rgba(255, 255, 255, 0.16);
  border-color: rgba(32, 38, 44, 0.05);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.section-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.98)),
    var(--cd-surface);
}

:root[data-theme="dark"] .feature-card,
:root[data-theme="dark"] .section-card {
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
}

:root[data-theme="dark"] .feature-card {
  background:
    linear-gradient(180deg, rgba(23, 32, 40, 0.48), rgba(23, 32, 40, 0.44)),
    rgba(23, 32, 40, 0.18);
  border-color: rgba(230, 236, 239, 0.06);
}

:root[data-theme="dark"] .section-card {
  background:
    linear-gradient(180deg, rgba(23, 32, 40, 0.98), rgba(23, 32, 40, 0.96)),
    var(--cd-surface);
}

.section-card::before {
  content: "";
  display: block;
  width: 100%;
  height: 7rem;
  margin: -1.25rem -1.25rem 1rem;
  background-color: #eef2f1;
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid rgba(32, 38, 44, 0.08);
}

:root[data-theme="dark"] .section-card::before {
  border-bottom-color: rgba(230, 236, 239, 0.08);
}

.feature-card-figure {
  margin: 0.45rem 0 1rem;
}

.feature-card-figure p {
  margin: 0;
}

.feature-card-image {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 2.25;
  object-fit: cover;
  border: 1px solid rgba(32, 38, 44, 0.08);
  border-radius: 0.82rem;
  background: rgba(255, 255, 255, 0.32);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  box-shadow: 0 10px 22px rgba(32, 38, 44, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

:root[data-theme="dark"] .feature-card-image {
  border-color: rgba(230, 236, 239, 0.08);
  background: rgba(23, 32, 40, 0.38);
}

.feature-card:hover,
.feature-card:focus-within,
.section-card:hover,
.section-card:focus-within {
  transform: translateY(-4px);
  border-color: rgba(181, 92, 59, 0.28);
  box-shadow: 0 18px 40px rgba(32, 38, 44, 0.1);
}

:root[data-theme="dark"] .feature-card:hover,
:root[data-theme="dark"] .feature-card:focus-within,
:root[data-theme="dark"] .section-card:hover,
:root[data-theme="dark"] .section-card:focus-within {
  box-shadow: 0 22px 46px rgba(0, 0, 0, 0.28);
}

.feature-card h3,
.section-card h3 {
  margin-top: 0;
  color: var(--cd-accent);
}

.feature-card h3 {
  position: relative;
  display: inline-block;
}

.feature-card h3::after {
  content: "";
  display: block;
  width: 60%;
  height: 0.18rem;
  margin-top: 0.35rem;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--cd-accent), var(--cd-accent-warm));
}

.feature-card p:last-child,
.section-card p:last-child,
.section-card ul:last-child {
  margin-bottom: 0;
}

.feature-card .card-body,
.section-card .card-body {
  position: relative;
  z-index: 1;
}

.feature-link {
  align-self: flex-start;
  font-weight: 600;
}

.grid {
  row-gap: 1rem;
}

a {
  color: var(--cd-accent);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.16em;
  transition: color 180ms ease, text-decoration-color 180ms ease, background-size 220ms ease, background-position 220ms ease, box-shadow 220ms ease;
}

a:hover,
a:focus {
  color: var(--cd-accent-strong);
}

.feature-card a,
.section-card a,
.hero a,
.page-shell a,
.page-footer a,
.nav-link {
  text-decoration: none;
  background-image: linear-gradient(90deg, currentColor, var(--cd-accent-warm));
  background-repeat: no-repeat;
  background-position: 0 calc(100% - 0.05rem);
  background-size: 0 2px;
}

.feature-card a:hover,
.feature-card a:focus,
.section-card a:hover,
.section-card a:focus,
.hero a:hover,
.hero a:focus,
.page-shell a:hover,
.page-shell a:focus,
.page-footer a:hover,
.page-footer a:focus,
.nav-link:hover,
.nav-link:focus,
.nav-link.active {
  background-size: 100% 2px;
}

.feature-card a::after,
.section-card a::after {
  content: " \2192";
  display: inline-block;
  color: var(--cd-accent-warm);
  transition: transform 180ms ease, color 180ms ease;
}

.feature-card a:hover::after,
.feature-card a:focus::after,
.section-card a:hover::after,
.section-card a:focus::after {
  transform: translateX(0.18rem);
  color: var(--cd-accent-strong);
}

.hero a,
.page-shell a,
.page-footer a {
  box-shadow: inset 0 -0.08rem 0 rgba(213, 180, 106, 0.28);
}

.hero a:hover,
.hero a:focus,
.page-shell a:hover,
.page-shell a:focus,
.page-footer a:hover,
.page-footer a:focus {
  box-shadow: inset 0 -0.75rem 0 rgba(213, 180, 106, 0.18);
}

.navbar-brand {
  color: var(--cd-accent-strong);
  display: inline-flex;
  align-items: center;
  gap: 0.62rem;
  text-decoration: none;
  transition: color 180ms ease, transform 180ms ease;
}

.lab-territory {
  margin-top: 2.2rem;
  padding-top: 1.35rem;
  border-top: 1px solid rgba(45, 81, 104, 0.2);
}

.lab-territory > h3 {
  margin-top: 0;
}

.lab-index {
  margin: 0 0 2.2rem;
  padding: 1.25rem 1.35rem;
  border: 1px solid var(--cd-border);
  border-radius: 0.9rem;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 10px 30px rgba(32, 38, 44, 0.04);
}

:root[data-theme="dark"] .lab-index {
  background: rgba(23, 32, 40, 0.76);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.2);
}

.lab-index > h2 {
  margin: 0 0 1rem;
  font-size: 1.25rem;
}

.lab-index-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem 1.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lab-index-item {
  padding-top: 0.8rem;
  border-top: 1px dashed rgba(45, 81, 104, 0.2);
}

.lab-index-item > a {
  color: var(--cd-text);
  font-weight: 650;
  text-decoration-color: rgba(181, 92, 59, 0.32);
  text-underline-offset: 0.18em;
}

.lab-index-item > a:hover,
.lab-index-item > a:focus-visible {
  color: var(--cd-accent-strong);
  text-decoration-color: currentColor;
}

.lab-index-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.32rem;
  margin-top: 0.55rem;
}

.lab-index .lab-project-tag {
  padding: 0.2rem 0.48rem;
  font-size: 0.74rem;
}

.lab-project-list,
.teaching-sample-list {
  display: grid;
  gap: 2rem;
  margin-top: 1.35rem;
}

.lab-project,
.teaching-sample {
  display: block;
  padding: 1.25rem 0 0.5rem;
  border-top: 1px dashed rgba(45, 81, 104, 0.2);
}

.lab-project-visual {
  display: block;
  width: 100%;
  border-radius: 0.8rem;
  overflow: hidden;
  background: rgba(169, 196, 209, 0.12);
  box-shadow: 0 10px 24px rgba(32, 38, 44, 0.1);
}

.lab-project-image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  margin: 0;
  transition: transform 220ms ease;
}

.lab-project-visual:hover .lab-project-image,
.lab-project-visual:focus-visible .lab-project-image {
  transform: scale(1.025);
}

.lab-project-header > h4 {
  margin: 0 0 0.65rem;
}

.teaching-sample-header > h3 {
  margin: 0 0 0.65rem;
}

.lab-project-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0 0 1rem;
}

.lab-project-tag {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.28rem 0.62rem;
  background: rgba(169, 196, 209, 0.18);
  color: var(--cd-accent);
  font-size: 0.85rem;
  line-height: 1.15;
  text-decoration: none;
}

a.lab-project-tag:hover,
a.lab-project-tag:focus-visible {
  background: rgba(169, 196, 209, 0.34);
  color: var(--cd-accent-strong);
}

:root[data-theme="dark"] .lab-project-tag {
  background: rgba(56, 85, 102, 0.42);
  color: var(--cd-accent);
}

.lab-project-copy > p {
  text-align: justify;
  text-wrap: pretty;
}

.lab-project-copy {
  margin-top: 1.15rem;
}

.lab-project-copy > p:has(> .feature-link:only-child) {
  text-align: left;
}

.topic-explorer {
  margin-top: 2rem;
}

.topic-explorer-loading,
.topic-results-empty {
  padding: 1.1rem 1.2rem;
  border: 1px dashed rgba(45, 81, 104, 0.24);
  border-radius: 0.8rem;
  color: var(--cd-muted);
}

.topic-explorer-heading {
  margin-bottom: 1rem;
}

.topic-filter-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 1.1rem;
  border: 1px solid var(--cd-border);
  border-radius: 0.9rem;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 10px 30px rgba(32, 38, 44, 0.04);
}

.topic-filter {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  border: 1px solid rgba(45, 81, 104, 0.16);
  border-radius: 999px;
  padding: 0.34rem 0.68rem;
  background: rgba(169, 196, 209, 0.12);
  color: var(--cd-text);
  font-size: 0.86rem;
  line-height: 1.2;
  text-decoration: none;
}

.topic-filter > span {
  color: var(--cd-muted);
  font-size: 0.76rem;
}

.topic-filter:hover,
.topic-filter:focus-visible,
.topic-filter.is-active {
  border-color: rgba(181, 92, 59, 0.28);
  background: rgba(181, 92, 59, 0.12);
  color: var(--cd-accent-strong);
}

.topic-filter.is-active {
  font-weight: 700;
}

.topic-results-status {
  margin: 1rem 0 1.4rem;
  color: var(--cd-muted);
  font-family: ui-monospace, "Cascadia Code", "JetBrains Mono", "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 0.86rem;
}

.topic-result-group {
  margin-top: 2rem;
}

.topic-result-group > h3 {
  padding-bottom: 0.55rem;
  border-bottom: 1px dashed rgba(45, 81, 104, 0.22);
}

.topic-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.topic-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 1.1rem 1.15rem;
  border: 1px solid var(--cd-border);
  border-radius: 0.85rem;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 8px 24px rgba(32, 38, 44, 0.04);
}

.topic-card > h4 {
  margin: 0 0 0.55rem;
  font-size: 1.05rem;
  line-height: 1.35;
}

.topic-card > h4 a {
  color: var(--cd-text);
  text-decoration-color: rgba(181, 92, 59, 0.32);
  text-underline-offset: 0.18em;
}

.topic-card > h4 a:hover,
.topic-card > h4 a:focus-visible {
  color: var(--cd-accent-strong);
  text-decoration-color: currentColor;
}

.topic-card-date {
  order: -1;
  margin: 0 0 0.45rem;
  color: var(--cd-muted);
  font-size: 0.78rem;
}

.topic-card-description {
  margin: 0 0 0.9rem;
  color: var(--cd-muted);
  font-size: 0.92rem;
  text-wrap: pretty;
}

.topic-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: auto;
}

.topic-card-tag {
  border-radius: 999px;
  padding: 0.22rem 0.5rem;
  background: rgba(169, 196, 209, 0.18);
  color: var(--cd-accent);
  font-size: 0.74rem;
  line-height: 1.15;
  text-decoration: none;
}

.topic-card-tag:hover,
.topic-card-tag:focus-visible {
  background: rgba(169, 196, 209, 0.34);
  color: var(--cd-accent-strong);
}

:root[data-theme="dark"] .topic-filter-list,
:root[data-theme="dark"] .topic-card {
  background: rgba(23, 32, 40, 0.76);
}

:root[data-theme="dark"] .topic-filter,
:root[data-theme="dark"] .topic-card-tag {
  background: rgba(56, 85, 102, 0.42);
}

.navbar-brand:hover,
.navbar-brand:focus-visible {
  color: var(--cd-accent);
  transform: translateY(-1px);
}

.navbar-brand:focus-visible {
  outline: 2px solid rgba(181, 92, 59, 0.34);
  outline-offset: 0.3rem;
  border-radius: 0.25rem;
}

.navbar-title {
  font-family: ui-monospace, "Cascadia Code", "JetBrains Mono", "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: clamp(1.18rem, 1rem + 0.42vw, 1.46rem);
  font-weight: 720;
  letter-spacing: 0.035em;
  line-height: 1;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.42);
}

:root[data-theme="dark"] .navbar-title {
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.34);
}

.brand-house-icon {
  width: 2.05rem;
  height: 2.05rem;
  flex: 0 0 auto;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 2px 2px rgba(32, 38, 44, 0.13));
}

.brand-house-roof {
  stroke: var(--cd-accent-strong);
  stroke-width: 2.35;
}

.brand-house-roof-detail {
  stroke: var(--cd-accent-gold);
  stroke-width: 1.05;
  opacity: 0.9;
}

.brand-house-wall,
.brand-house-chimney,
.brand-house-ground {
  stroke: var(--cd-accent);
}

.brand-house-door {
  stroke: var(--cd-accent-strong);
}

.brand-house-window {
  fill: rgba(213, 180, 106, 0.34);
  stroke: var(--cd-accent-gold);
}

.nav-link {
  transition: color 180ms ease, transform 180ms ease;
}

.navbar .nav-link {
  position: relative;
  background-image: none;
}

.navbar .navbar-nav > .nav-item {
  position: relative;
}

.navbar .nav-link::before {
  content: "";
  position: absolute;
  left: 0.5rem;
  right: 0.5rem;
  bottom: 0.3rem;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, currentColor, var(--cd-accent-warm));
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 220ms ease;
}

.nav-link:hover,
.nav-link:focus {
  transform: translateY(-1px);
}

.navbar .nav-link:hover::before,
.navbar .nav-link:focus::before,
.navbar .nav-link.active::before {
  transform: scaleX(1);
}

.navbar .dropdown-toggle::after {
  margin-left: 0.42rem;
  vertical-align: 0.18em;
  color: var(--cd-accent-warm);
  transition: transform 180ms ease;
}

.navbar .dropdown-toggle[aria-expanded="true"]::after {
  transform: rotate(180deg);
}

.navbar .nav-link .bi {
  margin-right: 0.35rem;
  font-size: 0.95em;
}

.navbar .nav-link .nav-external-icon {
  margin-left: 0.22rem;
  font-size: 0.78em;
  color: var(--cd-accent-warm);
  line-height: 1;
}

.navbar .nav-link[href*="github.com"] .bi {
  color: var(--cd-accent);
}

.navbar .nav-link[href*="/blog/"] {
  font-weight: 600;
}

.navbar .nav-link[href*="/blog/"] .bi,
.navbar .nav-link[href$="blog/index.html"] .bi {
  color: var(--cd-accent-strong);
}

@media (min-width: 992px) {
  .navbar .navbar-nav > .nav-item:not(:nth-last-child(-n + 3)),
  .navbar .navbar-nav > .nav-item:nth-last-child(3) {
    margin-left: 0.35rem;
    padding-left: 0.6rem;
  }

  .navbar .navbar-nav > .nav-item:nth-last-child(-n + 2) {
    margin-left: 0.55rem;
  }

  .navbar .navbar-nav > .nav-item:last-child {
    margin-right: 0.35rem;
    padding-right: 0.6rem;
  }

  .navbar .navbar-nav > .nav-item:not(:nth-last-child(-n + 3))::before,
  .navbar .navbar-nav > .nav-item:nth-last-child(3)::before {
    content: "|";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-54%);
    color: rgba(32, 38, 44, 0.34);
    font-weight: 500;
    pointer-events: none;
  }

  .navbar .navbar-nav > .nav-item:last-child::after {
    position: absolute;
    top: 50%;
    transform: translateY(-54%);
    color: rgba(32, 38, 44, 0.34);
    font-weight: 500;
    pointer-events: none;
  }

  .navbar .navbar-nav > .nav-item:last-child::after {
    content: "|";
    right: 0;
  }

  :root[data-theme="dark"] .navbar .navbar-nav > .nav-item:not(:nth-last-child(-n + 3))::before,
  :root[data-theme="dark"] .navbar .navbar-nav > .nav-item:nth-last-child(3)::before,
  :root[data-theme="dark"] .navbar .navbar-nav > .nav-item:last-child::after {
    color: rgba(230, 236, 239, 0.36);
  }
}

.nav-projects-dropdown .nav-dropdown-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
}

.nav-dropdown-caret {
  color: var(--cd-accent-warm);
  font-size: 0.72em;
  line-height: 1;
  transition: transform 180ms ease;
}

.nav-projects-dropdown .nav-dropdown-toggle[aria-expanded="true"] .nav-dropdown-caret {
  transform: rotate(180deg);
}

.navbar .dropdown-menu {
  display: none;
  margin-top: 0.55rem;
  padding: 0.4rem;
  border: 1px solid rgba(32, 38, 44, 0.08);
  border-radius: 0.9rem;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 18px 36px rgba(32, 38, 44, 0.1);
}

.nav-projects-dropdown.is-open .dropdown-menu,
.navbar .dropdown-menu.show {
  display: block;
}

.navbar .dropdown-item {
  border-radius: 0.65rem;
  padding: 0.55rem 0.8rem;
  color: var(--cd-text);
  transition: background-color 180ms ease, color 180ms ease;
}

.navbar .dropdown-item:hover,
.navbar .dropdown-item:focus,
.navbar .dropdown-item.active,
.navbar .dropdown-item:active {
  background: rgba(169, 196, 209, 0.18);
  color: var(--cd-accent-strong);
}

:root[data-theme="dark"] .navbar .dropdown-menu {
  border-color: rgba(230, 236, 239, 0.08);
  background: rgba(23, 32, 40, 0.98);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.32);
}

:root[data-theme="dark"] .navbar .dropdown-item {
  color: var(--cd-text);
}

:root[data-theme="dark"] .navbar .dropdown-item:hover,
:root[data-theme="dark"] .navbar .dropdown-item:focus,
:root[data-theme="dark"] .navbar .dropdown-item.active,
:root[data-theme="dark"] .navbar .dropdown-item:active {
  background: rgba(56, 85, 102, 0.38);
  color: var(--cd-accent-strong);
}

.callout {
  border-radius: 0.85rem;
  backdrop-filter: blur(4px);
}

:root[data-theme="dark"] .callout {
  background-color: rgba(23, 32, 40, 0.86);
  border-color: rgba(138, 181, 207, 0.18);
}

.quiet-list li {
  margin-bottom: 0.45rem;
}

.page-intro {
  max-width: 52rem;
  margin-bottom: 1.5rem;
  font-size: 1.08rem;
}

.blog-landing {
  padding: 1.8rem;
}

.home-title-banner {
  margin: 0.4rem 0 1.5rem;
}

.home-title-banner-image {
  display: block;
  width: 100%;
  aspect-ratio: 21 / 6.2;
  object-fit: cover;
  object-position: center;
  border-radius: 1rem;
  border: 1px solid rgba(32, 38, 44, 0.08);
  background: #eef2f1;
  box-shadow: 0 16px 34px rgba(32, 38, 44, 0.08);
}

.home-title-banner figcaption,
.blog-page-banner figcaption {
  display: none;
}

.blog-page-banner {
  margin: 0.9rem 0 1.2rem;
}

.blog-page-banner-image {
  display: block;
  width: 100%;
  aspect-ratio: 9 / 1;
  object-fit: cover;
  object-position: center 44%;
  border-radius: 1rem;
  border: 1px solid rgba(32, 38, 44, 0.08);
  background: #eef2f1;
  box-shadow: 0 16px 34px rgba(32, 38, 44, 0.08);
}

.blog-landing-note {
  margin: 0 0 1.35rem;
}

.blog-landing-note .blog-title-intro,
.blog-landing-note .blog-title-note {
  display: block;
  font-family: "Consolas", "SFMono-Regular", "Liberation Mono", monospace;
  font-size: 0.94rem;
  line-height: 1.65;
}

.blog-landing-note .blog-title-intro {
  color: var(--cd-text);
}

.blog-landing-note .blog-title-note {
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px dashed rgba(45, 81, 104, 0.22);
  color: var(--cd-muted);
}

.heading-icon,
.card-heading-icon,
.blog-heading-icon,
.paragraph-icon {
  display: inline-block;
  min-width: 1.05em;
  color: var(--cd-accent-strong);
  line-height: 1;
}

.heading-icon::before,
.card-heading-icon::before,
.blog-heading-icon::before,
.paragraph-icon::before {
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.heading-icon,
.blog-heading-icon,
.paragraph-icon {
  margin-right: 0.5rem;
  font-size: 0.95em;
  vertical-align: -0.08em;
}

.card-heading-icon {
  margin-right: 0.4rem;
  font-size: 0.92em;
  vertical-align: -0.06em;
}

.blog-title .blog-heading-icon,
.content > h2 .blog-heading-icon,
.content > h2 .heading-icon,
.card-title .card-heading-icon {
  vertical-align: -0.08em;
}

.blog-highlight-figure {
  margin: 0;
  padding: 1rem;
  border: 1px solid rgba(32, 38, 44, 0.08);
  border-radius: 1rem;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.84)),
    var(--cd-surface);
  box-shadow: 0 16px 36px rgba(32, 38, 44, 0.08);
}

.blog-highlight-image {
  width: 100%;
  border-radius: 0.8rem;
  border: 1px solid rgba(32, 38, 44, 0.08);
  background: #eef2f1;
}

.blog-highlight-caption {
  margin-top: 0.8rem;
  color: var(--cd-muted);
  font-size: 0.94rem;
  text-align: center;
}

.blog-highlight-figure figcaption {
  display: none;
}

.section-divider {
  margin: 2rem 0 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(32, 38, 44, 0.1);
}

.small-note {
  color: var(--cd-muted);
  font-size: 0.95rem;
}

.page-footer {
  border-top: 0;
}

.footer {
  margin-top: 3rem;
  background: #2b343c;
}

.nav-footer {
  min-height: 3.75rem;
  padding: 0.95rem 1rem;
  background: #2b343c;
  color: #f2ede4;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  justify-content: center;
  text-align: center;
}

.nav-footer-left,
.nav-footer-right {
  display: none;
}

.nav-footer-center {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 0;
  color: #f2ede4;
  font-size: 0.92rem;
  line-height: 1.6;
}

.nav-footer-center p {
  margin: 0;
}

.nav-footer a,
.nav-footer a:hover,
.nav-footer a:focus {
  color: #f6c793;
  background: none;
  box-shadow: none;
  text-decoration: underline;
  text-decoration-color: rgba(246, 199, 147, 0.5);
}

.footer-heart {
  display: inline-block;
  margin: 0 0.18rem;
  color: #e18947;
  font-size: 1.05em;
  transform: translateY(-0.02em);
}

.quarto-listing-container-default {
  margin-top: 1.5rem;
}

.quarto-listing-container-default .quarto-post {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.1rem;
  align-items: start;
  padding: 1.15rem 1.2rem;
  margin-bottom: 1rem;
  border: 1px solid var(--cd-border);
  border-radius: 0.95rem;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.92)),
    var(--cd-surface);
  box-shadow: 0 12px 28px rgba(32, 38, 44, 0.05);
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.quarto-listing-container-default .quarto-post:hover,
.quarto-listing-container-default .quarto-post:focus-within {
  transform: translateY(-3px);
  border-color: rgba(181, 92, 59, 0.26);
  box-shadow: 0 18px 38px rgba(32, 38, 44, 0.09);
}

.quarto-listing-container-default .listing-title {
  margin-bottom: 0.45rem;
  font-size: 1.15rem;
}

.quarto-listing-container-default .listing-title a {
  color: var(--cd-text);
  background: none;
  box-shadow: none;
}

.quarto-listing-container-default .listing-description {
  color: var(--cd-muted);
}

.quarto-listing-container-default .listing-description p {
  margin-bottom: 0;
}

.quarto-listing-container-default .listing-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.7rem;
}

.quarto-listing-container-default .listing-category,
.quarto-category {
  border-radius: 999px;
  padding: 0.28rem 0.62rem;
  background: rgba(169, 196, 209, 0.18);
  color: var(--cd-accent);
  font-size: 0.85rem;
  line-height: 1.15;
}

.quarto-listing-container-default .metadata {
  min-width: 8.5rem;
  padding-left: 1rem;
  border-left: 1px solid rgba(32, 38, 44, 0.08);
}

.quarto-listing-container-default .metadata a {
  background: none;
  box-shadow: none;
  color: inherit;
}

.quarto-listing-container-default .listing-date,
.quarto-listing-container-default .listing-author {
  color: var(--cd-muted);
  font-size: 0.92rem;
}

#quarto-margin-sidebar .quarto-listing-category-title {
  margin-bottom: 0.8rem;
  color: var(--cd-accent);
}

#quarto-margin-sidebar .quarto-listing-category {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

#quarto-margin-sidebar .quarto-listing-category .category {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  min-height: 1.9rem;
  border-radius: 999px;
  padding: 0.3rem 0.68rem;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(32, 38, 44, 0.16);
  box-shadow: 0 2px 6px rgba(32, 38, 44, 0.05);
  color: var(--cd-text);
  font-size: 0.82rem;
  font-weight: 620;
  line-height: 1.15;
  text-decoration: none;
  transition:
    background-color 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    color 160ms ease,
    transform 160ms ease;
}

#quarto-margin-sidebar .quarto-listing-category .category.active,
#quarto-margin-sidebar .quarto-listing-category .category:hover,
#quarto-margin-sidebar .quarto-listing-category .category:focus-visible {
  background: rgba(169, 196, 209, 0.18);
  border-color: rgba(56, 85, 102, 0.34);
  box-shadow: 0 4px 10px rgba(32, 38, 44, 0.09);
  color: var(--cd-accent-strong);
  transform: translateY(-1px);
}

#quarto-margin-sidebar .quarto-listing-category .category:focus-visible {
  outline: 2px solid rgba(181, 92, 59, 0.34);
  outline-offset: 2px;
}

#quarto-margin-sidebar .quarto-listing-category .quarto-category-count {
  color: var(--cd-muted);
  font-family: ui-monospace, "Cascadia Code", "SFMono-Regular", Consolas, monospace;
  font-size: 0.76em;
  font-weight: 600;
}

.quarto-title-block > div:has(> .description) {
  margin-top: 1.15rem;
  padding: 1.1rem 1.2rem 0.9rem;
  border: 1px solid var(--cd-border);
  border-bottom: 0;
  border-radius: 0.9rem 0.9rem 0 0;
  background:
    linear-gradient(135deg, rgba(169, 196, 209, 0.16), rgba(255, 255, 255, 0.2)),
    rgba(255, 255, 255, 0.72);
  box-shadow: 0 12px 28px rgba(32, 38, 44, 0.05);
}

.quarto-title-block .description {
  margin: 0;
  color: var(--cd-text);
  font-family: "Consolas", "SFMono-Regular", "Liberation Mono", monospace;
  font-size: 0.94rem;
  line-height: 1.65;
}

.blog-index-page .quarto-title-block > div:has(> .description) {
  display: none;
}

.blog-index-page .quarto-title-meta {
  display: none;
}

.quarto-title-meta {
  gap: 1rem;
  margin-top: 0;
  padding: 0.85rem 1.2rem 1.05rem;
  border: 1px solid var(--cd-border);
  border-top: 1px dashed rgba(45, 81, 104, 0.22);
  border-radius: 0 0 0.9rem 0.9rem;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 12px 28px rgba(32, 38, 44, 0.05);
  font-family: "Consolas", "SFMono-Regular", "Liberation Mono", monospace;
}

.quarto-title-meta-heading {
  color: var(--cd-accent);
  font-family: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.quarto-title-meta-contents,
.quarto-title-meta-contents p,
.quarto-title-meta .date {
  color: var(--cd-text);
  font-family: inherit;
  font-size: 0.86rem;
}

.article-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem 1.25rem;
  margin-top: 1rem;
  padding: 1rem 1.2rem;
}

.article-actions-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8rem;
}

.article-actions-label {
  color: var(--cd-accent);
  font-family: "Consolas", "SFMono-Regular", "Liberation Mono", monospace;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.article-actions-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.article-action-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.48rem 0.8rem;
  border: 1px solid rgba(45, 81, 104, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.75);
  color: var(--cd-text);
  box-shadow: none;
  font-family: "Consolas", "SFMono-Regular", "Liberation Mono", monospace;
  font-size: 0.82rem;
  line-height: 1.2;
  text-decoration: none;
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

.article-action-chip:hover,
.article-action-chip:focus {
  transform: translateY(-1px);
  border-color: rgba(181, 92, 59, 0.3);
  background: rgba(255, 255, 255, 0.9);
  color: var(--cd-accent-strong);
}

.article-action-button {
  cursor: pointer;
}

.article-action-chip .bi {
  font-size: 0.95rem;
  line-height: 1;
}

.article-action-button.is-confirmed {
  border-color: rgba(93, 138, 86, 0.3);
  background: rgba(226, 244, 222, 0.92);
  color: #355e31;
}

:root[data-theme="dark"] .quarto-title-block > div:has(> .description),
:root[data-theme="dark"] .quarto-title-meta {
  background:
    linear-gradient(135deg, rgba(56, 85, 102, 0.34), rgba(23, 32, 40, 0.16)),
    rgba(23, 32, 40, 0.86);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
}

:root[data-theme="dark"] .quarto-title-meta {
  border-top-color: rgba(138, 181, 207, 0.25);
}

:root[data-theme="dark"] .blog-landing-note .blog-title-note {
  border-top-color: rgba(138, 181, 207, 0.25);
}

:root[data-theme="dark"] .quarto-listing-container-default .quarto-post {
  background:
    linear-gradient(180deg, rgba(23, 32, 40, 0.98), rgba(19, 27, 33, 0.95)),
    var(--cd-surface);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.24);
}

:root[data-theme="dark"] .quarto-listing-container-default .quarto-post:hover,
:root[data-theme="dark"] .quarto-listing-container-default .quarto-post:focus-within {
  box-shadow: 0 22px 42px rgba(0, 0, 0, 0.3);
}

:root[data-theme="dark"] .quarto-listing-container-default .listing-title a,
:root[data-theme="dark"] .quarto-title-meta-contents,
:root[data-theme="dark"] .quarto-title-meta-contents p,
:root[data-theme="dark"] .quarto-title-meta .date {
  color: var(--cd-text);
}

:root[data-theme="dark"] .article-action-chip {
  background: rgba(23, 32, 40, 0.88);
  border-color: rgba(138, 181, 207, 0.16);
  color: var(--cd-text);
}

:root[data-theme="dark"] .article-action-chip:hover,
:root[data-theme="dark"] .article-action-chip:focus {
  background: rgba(31, 43, 52, 0.96);
  border-color: rgba(246, 199, 147, 0.28);
  color: var(--cd-accent);
}

:root[data-theme="dark"] .article-action-button.is-confirmed {
  background: rgba(44, 72, 42, 0.94);
  border-color: rgba(114, 184, 108, 0.28);
  color: #d9efd4;
}

:root[data-theme="dark"] .quarto-listing-container-default .listing-category,
:root[data-theme="dark"] .quarto-category {
  background: rgba(56, 85, 102, 0.42);
  color: var(--cd-accent);
}

:root[data-theme="dark"] .quarto-listing-container-default .metadata {
  border-left-color: rgba(230, 236, 239, 0.08);
}

:root[data-theme="dark"] #quarto-margin-sidebar .quarto-listing-category .category {
  background: rgba(23, 32, 40, 0.9);
  border-color: rgba(230, 236, 239, 0.08);
  color: var(--cd-text);
}

:root[data-theme="dark"] #quarto-margin-sidebar .quarto-listing-category .category.active,
:root[data-theme="dark"] #quarto-margin-sidebar .quarto-listing-category .category:hover,
:root[data-theme="dark"] #quarto-margin-sidebar .quarto-listing-category .category:focus-visible {
  background: rgba(56, 85, 102, 0.34);
  border-color: rgba(169, 196, 209, 0.34);
  color: var(--cd-accent-strong);
}

.site-links {
  border-radius: 0.9rem;
  overflow: hidden;
  border: 1px solid var(--cd-border);
  box-shadow: 0 10px 24px rgba(32, 38, 44, 0.04);
}

.site-links .list-group-item,
.status-item {
  background: rgba(255, 255, 255, 0.82);
  border-color: rgba(32, 38, 44, 0.08);
  color: var(--cd-text);
}

.site-links .list-group-item {
  padding: 0.9rem 1rem;
}

.site-links .list-group-item p {
  margin: 0;
}

.site-links .list-group-item a {
  display: block;
  color: inherit;
  text-decoration: none;
  background: none;
  box-shadow: none;
}

.site-pill-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
}

.site-pill-grid > p {
  margin: 0;
}

.site-pill {
  --site-accent: var(--cd-accent);
  --site-accent-soft: rgba(169, 196, 209, 0.18);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 0.85rem;
  min-height: 4.8rem;
  width: 100%;
  max-width: 100%;
  height: 100%;
  padding: 0.85rem 0.95rem;
  border: 1px solid rgba(32, 38, 44, 0.08);
  border-radius: 1.1rem;
  color: var(--cd-text);
  text-decoration: none;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--site-accent) 17%, rgba(255, 255, 255, 0.72)), rgba(255, 255, 255, 0.44)),
    rgba(255, 255, 255, 0.32);
  box-shadow: 0 10px 24px rgba(32, 38, 44, 0.05);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease, background 220ms ease;
}

.site-pill:hover,
.site-pill:focus {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--site-accent) 36%, rgba(32, 38, 44, 0.1));
  color: var(--cd-text);
  box-shadow: 0 16px 32px rgba(32, 38, 44, 0.08);
}

.site-pill-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 0.85rem;
  background: rgba(255, 255, 255, 0.54);
  border: 1px solid rgba(32, 38, 44, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.site-pill-icon-github {
  color: color-mix(in srgb, var(--site-accent) 86%, black);
}

.site-pill-glyph {
  font-size: 1.3rem;
  line-height: 1;
}

.site-pill-favicon {
  display: block;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 0.35rem;
}

.site-pill-copy {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}

.site-pill-label {
  font-weight: 700;
  line-height: 1.15;
}

.site-pill-meta {
  color: var(--cd-text-soft);
  font-size: 0.87rem;
  line-height: 1.2;
}

.site-pill-launch {
  flex: 0 0 auto;
  color: color-mix(in srgb, var(--site-accent) 72%, var(--cd-text));
  font-size: 1rem;
  line-height: 1;
}

.status-item {
  border-radius: 0.85rem;
  padding: 0.95rem 1rem;
  border: 1px solid rgba(32, 38, 44, 0.08);
  height: 100%;
}

.status-pill-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
}

.status-pill {
  --status-progress: 50%;
  --status-accent: var(--cd-accent);
  min-height: 2.9rem;
  padding: 0.52rem 0.88rem;
  border: 1px solid rgba(32, 38, 44, 0.08);
  border-radius: 999px;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--status-accent) 17%, rgba(255, 255, 255, 0.72)) 0 var(--status-progress), rgba(255, 255, 255, 0.44) var(--status-progress) 100%),
    rgba(255, 255, 255, 0.32);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  box-shadow: 0 10px 22px rgba(32, 38, 44, 0.05);
}

.status-pill > p {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.9rem;
  width: 100%;
  margin: 0;
}

.status-pill-label {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--cd-text);
  font-weight: 600;
  line-height: 1.15;
}

.status-pill-value {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.2rem 0.54rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--status-accent) 16%, rgba(255, 255, 255, 0.76));
  color: color-mix(in srgb, var(--status-accent) 82%, black);
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.01em;
}

.status-note {
  margin-top: 0.8rem;
}

.site-links .list-group-item:hover,
.site-links .list-group-item:focus {
  background: rgba(169, 196, 209, 0.14);
  color: var(--cd-accent-strong);
}

.archive-link-list .list-group-item {
  padding: 0.68rem 0.9rem;
}

.archive-link-list .list-group-item strong {
  display: block;
  margin-bottom: 0.32rem;
  color: var(--cd-text);
}

.archive-link-list .list-group-item p:last-child {
  margin-bottom: 0;
}

.archive-compact-link {
  display: inline-block;
  max-width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--cd-accent);
  font-family: "Consolas", "SFMono-Regular", "Liberation Mono", monospace;
  font-size: 0.88rem;
  letter-spacing: 0.01em;
  line-height: 1.4;
  word-break: break-all;
  box-shadow: none;
  transition: transform 180ms ease, color 180ms ease;
}

.archive-compact-link::after {
  content: none;
}

.archive-compact-link:hover,
.archive-compact-link:focus {
  color: var(--cd-accent-strong);
  box-shadow: none;
}

.archive-link-list .small-note {
  display: block;
  margin-top: 0.18rem;
  color: var(--cd-accent-warm);
  font-family: "Consolas", "SFMono-Regular", "Liberation Mono", monospace;
  font-size: 0.82rem;
  line-height: 1.45;
}

:root[data-theme="dark"] .archive-link-list .list-group-item strong {
  color: var(--cd-text);
}

:root[data-theme="dark"] .archive-compact-link {
  color: var(--cd-accent);
  box-shadow: none;
}

:root[data-theme="dark"] .archive-compact-link:hover,
:root[data-theme="dark"] .archive-compact-link:focus {
  color: var(--cd-accent-strong);
  box-shadow: none;
}

:root[data-theme="dark"] .archive-link-list .small-note {
  color: var(--cd-accent-gold);
}

:root[data-theme="dark"] .page-footer {
  border-top-color: rgba(230, 236, 239, 0.08);
}

:root[data-theme="dark"] .blog-highlight-figure {
  background: rgba(23, 32, 40, 0.82);
  border-color: rgba(230, 236, 239, 0.08);
}

:root[data-theme="dark"] .blog-page-banner-image,
:root[data-theme="dark"] .home-title-banner-image,
:root[data-theme="dark"] .blog-highlight-image {
  border-color: rgba(230, 236, 239, 0.08);
  background: rgba(17, 22, 27, 0.72);
}

:root[data-theme="dark"] .site-links {
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
}

:root[data-theme="dark"] .site-links .list-group-item,
:root[data-theme="dark"] .status-item {
  background: rgba(23, 32, 40, 0.9);
  border-color: rgba(230, 236, 239, 0.08);
  color: var(--cd-text);
}

:root[data-theme="dark"] .site-pill {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--site-accent) 22%, rgba(17, 22, 27, 0.8)), rgba(23, 32, 40, 0.5)),
    rgba(23, 32, 40, 0.38);
  border-color: rgba(230, 236, 239, 0.08);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
}

:root[data-theme="dark"] .site-pill:hover,
:root[data-theme="dark"] .site-pill:focus {
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.24);
}

:root[data-theme="dark"] .site-pill-icon {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(230, 236, 239, 0.08);
}

:root[data-theme="dark"] .site-pill-icon-github,
:root[data-theme="dark"] .site-pill-launch {
  color: color-mix(in srgb, var(--site-accent) 76%, white);
}

:root[data-theme="dark"] .status-pill {
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--status-accent) 22%, rgba(17, 22, 27, 0.8)) 0 var(--status-progress), rgba(23, 32, 40, 0.5) var(--status-progress) 100%),
    rgba(23, 32, 40, 0.38);
  border-color: rgba(230, 236, 239, 0.08);
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.18);
}

:root[data-theme="dark"] .status-pill-value {
  background: color-mix(in srgb, var(--status-accent) 17%, rgba(17, 22, 27, 0.82));
  color: color-mix(in srgb, var(--status-accent) 76%, white);
}

:root[data-theme="dark"] .site-links .list-group-item:hover,
:root[data-theme="dark"] .site-links .list-group-item:focus {
  background: rgba(56, 85, 102, 0.34);
  color: var(--cd-accent-strong);
}

.theme-switcher {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-right: 0.75rem;
  padding: 0.2rem;
  border: 1px solid rgba(32, 38, 44, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(12px);
  box-shadow: 0 8px 18px rgba(32, 38, 44, 0.08);
}

:root[data-theme="dark"] .theme-switcher {
  border-color: rgba(230, 236, 239, 0.12);
  background: rgba(17, 22, 27, 0.86);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.theme-nav-wrapper {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.55rem;
  justify-content: flex-end;
}

.language-switcher {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.12rem;
  padding: 0.12rem;
  border: 1px solid rgba(32, 38, 44, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 8px 18px rgba(32, 38, 44, 0.08);
  backdrop-filter: blur(12px);
}

.language-option {
  --language-flag: none;
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.08rem;
  min-height: 1.18rem;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #ffffff;
  font-family: "Consolas", "SFMono-Regular", "Liberation Mono", monospace;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1;
  text-decoration: none;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.94);
  transition: color 180ms ease, transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.language-option::before,
.language-option::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
}

.language-option::before {
  z-index: -2;
  background-image: var(--language-flag);
  background-position: center;
  background-size: cover;
  filter: grayscale(0.58) saturate(0.5) brightness(0.78);
  opacity: 0.4;
  transition: filter 180ms ease, opacity 180ms ease;
}

.language-option::after {
  z-index: -1;
  background: rgba(8, 10, 12, 0.78);
  transition: background-color 180ms ease;
}

.language-option-es {
  --language-flag: url("../icons/flag-es.svg");
}

.language-option-en {
  --language-flag: url("../icons/flag-en-gb.svg");
}

.language-code {
  position: relative;
  z-index: 1;
}

.language-option.is-active {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.42);
  box-shadow: 0 0 0 1px rgba(45, 81, 104, 0.16), 0 3px 8px rgba(32, 38, 44, 0.16);
  cursor: default;
}

.language-option.is-active::before {
  filter: grayscale(0.18) saturate(0.7) brightness(0.82);
  opacity: 0.74;
}

.language-option.is-active::after {
  background: rgba(8, 10, 12, 0.7);
}

.language-option.is-inactive:hover,
.language-option.is-inactive:focus-visible {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.48);
  transform: translateY(-1px);
  outline: none;
}

.language-option.is-inactive:hover::before,
.language-option.is-inactive:focus-visible::before {
  filter: grayscale(0.28) saturate(0.66) brightness(0.82);
  opacity: 0.62;
}

:root[data-theme="dark"] .language-switcher {
  border-color: rgba(230, 236, 239, 0.12);
  background: rgba(17, 22, 27, 0.86);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.theme-switcher-label {
  padding: 0 0.45rem 0 0.5rem;
  color: var(--cd-muted);
  font-size: 0.84rem;
  line-height: 1;
}

.theme-option {
  border: 0;
  border-radius: 999px;
  padding: 0.38rem 0.72rem;
  background: transparent;
  color: var(--cd-muted);
  font-weight: 600;
  line-height: 1;
  transition: background-color 180ms ease, color 180ms ease, transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.theme-option:hover,
.theme-option:focus-visible {
  color: var(--cd-text);
  background: rgba(169, 196, 209, 0.16);
  outline: none;
}

.theme-option.is-active,
.theme-option[aria-pressed="true"] {
  color: #ffffff;
  background: linear-gradient(90deg, var(--cd-accent), var(--cd-accent-warm));
  box-shadow: 0 8px 18px rgba(45, 81, 104, 0.2);
}

:root[data-theme="dark"] .theme-option.is-active,
:root[data-theme="dark"] .theme-option[aria-pressed="true"] {
  color: #11161b;
}

.theme-option.btn-outline-secondary {
  --bs-btn-color: var(--cd-muted);
  --bs-btn-border-color: transparent;
  --bs-btn-hover-color: var(--cd-text);
  --bs-btn-hover-bg: rgba(169, 196, 209, 0.16);
  --bs-btn-hover-border-color: transparent;
  --bs-btn-active-color: var(--cd-text);
  --bs-btn-active-bg: rgba(169, 196, 209, 0.22);
  --bs-btn-active-border-color: transparent;
  --bs-btn-focus-shadow-rgb: 169, 196, 209;
}

.theme-option.btn-primary {
  --bs-btn-color: #ffffff;
  --bs-btn-bg: transparent;
  --bs-btn-border-color: transparent;
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: transparent;
  --bs-btn-hover-border-color: transparent;
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: transparent;
  --bs-btn-active-border-color: transparent;
  --bs-btn-focus-shadow-rgb: 45, 81, 104;
}

:root[data-theme="dark"] .theme-option.btn-primary {
  --bs-btn-color: #11161b;
  --bs-btn-hover-color: #11161b;
  --bs-btn-active-color: #11161b;
}

.reveal-on-scroll {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 520ms ease, transform 520ms ease;
}

.reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.section-card::before {
  background-image:
    linear-gradient(135deg, rgba(169, 196, 209, 0.7), rgba(255, 255, 255, 0.22)),
    linear-gradient(45deg, rgba(213, 180, 106, 0.2), rgba(255, 255, 255, 0));
}

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

  .navbar,
  a,
  .feature-card,
  .section-card,
  .quarto-listing-container-default .quarto-post,
  .language-option,
  .theme-option,
  .reveal-on-scroll {
    transition: none;
  }

  .reveal-on-scroll {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 991.98px) {
  .hero,
  .page-shell,
  .feature-card,
  .section-card {
    padding: 1.1rem;
  }

  .theme-switcher {
    gap: 0.2rem;
    margin: 0.6rem 0 0;
    width: 100%;
    justify-content: center;
  }

  .theme-switcher-label {
    display: none;
  }

  .status-pill-grid {
    grid-template-columns: 1fr;
  }

  .lab-index-list {
    grid-template-columns: 1fr;
  }

  .topic-card-grid {
    grid-template-columns: 1fr;
  }

  .contact-options {
    grid-template-columns: 1fr;
  }

  .back-to-top {
    right: 0.8rem;
    bottom: 0.8rem;
    width: 2.75rem;
    height: 2.75rem;
  }

  .site-pill-grid {
    grid-template-columns: 1fr;
  }

  .theme-nav-wrapper {
    width: 100%;
    justify-content: center;
  }

  .nav-projects-dropdown .nav-dropdown-toggle {
    width: 100%;
    justify-content: space-between;
  }

  .navbar .dropdown-menu {
    position: static;
    float: none;
    width: 100%;
    margin-top: 0.35rem;
    box-shadow: none;
  }

  .blog-landing {
    padding: 1.15rem;
  }

  .home-title-banner-image {
    aspect-ratio: 16 / 6.8;
  }

  .blog-page-banner-image {
    aspect-ratio: 16 / 3.2;
  }

  .section-card::before {
    height: 5.5rem;
    margin: -1.1rem -1.1rem 0.9rem;
  }

  .feature-card-image {
    aspect-ratio: 16 / 2.6;
  }

  .quarto-listing-container-default .quarto-post {
    grid-template-columns: 1fr;
  }

  .quarto-listing-container-default .metadata {
    min-width: 0;
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid rgba(32, 38, 44, 0.08);
    padding-top: 0.8rem;
  }

  .article-actions,
  .article-actions-group,
  .article-actions-list {
    align-items: stretch;
  }
}

/* Keep the persistent controls visible when the active navigation item makes
   the desktop header a little wider (notably on Docencia and Blog). */
@media (min-width: 992px) and (max-width: 1399.98px) {
  .navbar .nav-link {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
  }

  .theme-nav-wrapper {
    gap: 0.35rem;
  }

  .theme-switcher {
    gap: 0.12rem;
    margin-right: 0;
  }

  .theme-switcher-label {
    display: none;
  }

  .theme-option {
    padding-right: 0.52rem;
    padding-left: 0.52rem;
  }
}

@media (min-width: 992px) and (max-width: 1100px) {
  .site-pill-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.article-print-cover {
  display: none;
}

@media print {
  #quarto-header,
  #quarto-margin-sidebar,
  .article-actions,
  .nav-footer,
  .back-to-top,
  .theme-nav-wrapper,
  #particles-layer {
    display: none !important;
  }

  body {
    background: #fff !important;
    color: #111 !important;
  }

  main.content {
    max-width: none !important;
  }

  .article-print-cover {
    display: block !important;
    width: 100%;
    max-width: 1200px;
    height: auto;
    margin: 0 auto 1.5rem;
    break-inside: avoid;
  }

  p,
  li,
  blockquote {
    orphans: 3;
    widows: 3;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    break-after: avoid-page;
    break-inside: avoid;
  }

  h1 + *,
  h2 + *,
  h3 + *,
  h4 + *,
  h5 + *,
  h6 + *,
  figure,
  table,
  pre,
  .callout {
    break-inside: avoid;
  }

  .page-shell,
  .quarto-title-meta,
  .quarto-title-block > div:has(> .description) {
    box-shadow: none !important;
    background: #fff !important;
    border-color: #d2d8dd !important;
  }

  a[href] {
    color: #111 !important;
    text-decoration: underline !important;
    box-shadow: none !important;
  }
}