/* ==========================================================================
   INDUSTRIAL STYLE — Dr. Xunzhu (Daniel) Tang
   Dark hero + light content · amber accent · engineered grid aesthetic
   ========================================================================== */

:root {
  /* Dark palette (hero / nav / footer) */
  --ink-900: #111416;
  --ink-800: #181c1f;
  --ink-700: #22272b;
  --ink-600: #30363b;
  --ink-line: #343b40;

  /* Light palette (content) */
  --paper: #f5f7fa;
  --paper-card: #ffffff;
  --paper-line: #d9dee7;

  /* Accent */
  --amber: #315fbd;
  --amber-dark: #234991;
  --steel: #637083;

  /* Text */
  --tx-dark: #16191d;
  --tx-mid: #4b5563;
  --tx-light: #8a919c;
  --tx-on-dark: #e7e9ec;
  --tx-on-dark-dim: #9aa3ae;

  --font-head: 'Source Sans 3', sans-serif;
  --font-body: 'Source Sans 3', sans-serif;
  --font-mono: 'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;

  --maxw: 1120px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 76px; }

body {
  font-family: var(--font-body);
  background: var(--paper);
  color: var(--tx-dark);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; }

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

/* ==========================================================================
   NAV
   ========================================================================== */
nav.ind-nav {
  position: sticky; top: 0; z-index: 100;
  background: rgba(16, 18, 20, 0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--ink-line);
}

.nav-container {
  display: flex; align-items: center; justify-content: space-between;
  height: 64px;
}

.nav-brand {
  font-family: var(--font-mono);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--tx-on-dark);
  text-decoration: none;
  letter-spacing: 0.02em;
}
.nav-brand .tick { color: var(--amber); }

.nav-menu {
  display: flex; list-style: none; gap: 0.25rem; flex-wrap: wrap;
}
.nav-menu a {
  display: block;
  padding: 0.45rem 0.8rem;
  font-family: var(--font-mono);
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--tx-on-dark-dim);
  text-decoration: none;
  border: 1px solid transparent;
  transition: color .2s, border-color .2s;
}
.nav-menu a:hover, .nav-menu a.active {
  color: var(--amber);
  border-color: var(--ink-line);
}

/* ==========================================================================
   HERO (dark industrial)
   ========================================================================== */
.hero {
  background:
    linear-gradient(rgba(16,18,20,0.0), rgba(16,18,20,0.0)),
    repeating-linear-gradient(0deg, transparent 0 47px, rgba(255,255,255,0.035) 47px 48px),
    repeating-linear-gradient(90deg, transparent 0 47px, rgba(255,255,255,0.035) 47px 48px),
    var(--ink-900);
  color: var(--tx-on-dark);
  border-bottom: 3px solid var(--amber);
  position: relative;
  overflow: hidden;
}

.hero::after {
  content: '';
  position: absolute; top: -120px; right: -120px;
  width: 420px; height: 420px;
  background: radial-gradient(circle, rgba(245,158,11,0.14) 0%, transparent 65%);
  pointer-events: none;
}

.hero-inner {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 3.5rem;
  align-items: center;
  padding: 4.5rem 0 3.5rem;
}

.hero-photo-frame {
  position: relative;
  width: 300px;
}
.hero-photo-frame::before {
  content: '';
  position: absolute; inset: 14px -14px -14px 14px;
  border: 1px solid var(--ink-line);
  z-index: 0;
}
.hero-photo-frame img {
  position: relative; z-index: 1;
  width: 100%; display: block;
  filter: grayscale(12%) contrast(1.04);
  border: 1px solid var(--ink-line);
}
.hero-photo-frame .corner {
  position: absolute; z-index: 2;
  width: 22px; height: 22px;
  border-color: var(--amber); border-style: solid; border-width: 0;
}
.corner.tl { top: -6px; left: -6px; border-top-width: 3px; border-left-width: 3px; }
.corner.br { bottom: -6px; right: -6px; border-bottom-width: 3px; border-right-width: 3px; }

.hero-kicker {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  color: var(--amber);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  margin-bottom: 0.9rem;
}

.hero h1 {
  font-family: var(--font-head);
  font-size: clamp(2.4rem, 5vw, 3.6rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin-bottom: 0.4rem;
}
.hero h1 .alias { color: var(--tx-on-dark-dim); font-weight: 500; }

.hero-affil {
  font-size: 0.98rem;
  color: var(--tx-on-dark-dim);
  margin-bottom: 1.6rem;
}
.hero-affil a { color: var(--tx-on-dark-dim); text-decoration: underline dotted; }
.hero-affil a { text-decoration: none; border-bottom: 1px solid var(--ink-line); }
.hero-affil a:hover { color: var(--amber); border-bottom-color: var(--amber); }

/* Identity rows */
.identity-list { display: flex; flex-direction: column; gap: 0.55rem; margin-bottom: 1.8rem; }
.identity-row {
  display: flex; align-items: baseline; gap: 0.9rem;
  border-left: 3px solid var(--amber);
  padding: 0.35rem 0 0.35rem 0.9rem;
  background: rgba(255,255,255,0.03);
}
.identity-role {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--amber);
  min-width: 108px;
}
.identity-what { font-family: var(--font-head); font-size: 1.05rem; font-weight: 600; color: var(--tx-on-dark); }
.identity-what .ctx { font-family: var(--font-body); font-weight: 400; font-size: 0.88rem; color: var(--tx-on-dark-dim); }

.hero-social { display: flex; gap: 0.6rem; }
.hero-social a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px;
  border: 1px solid var(--ink-line);
  color: var(--tx-on-dark-dim);
  text-decoration: none;
  font-size: 1.05rem;
  transition: all .2s;
}
.hero-social a:hover { border-color: var(--amber); color: var(--amber); transform: translateY(-2px); }

/* Stats strip */
.stats-strip {
  border-top: 1px solid var(--ink-line);
  background: var(--ink-800);
}
.stats-strip .container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.stat-cell {
  padding: 1.3rem 1rem;
  text-align: center;
  border-right: 1px solid var(--ink-line);
}
.stat-cell:first-child { border-left: 1px solid var(--ink-line); }
.stat-cell .num {
  font-family: var(--font-head);
  font-size: 1.9rem; font-weight: 700;
  color: var(--amber);
  line-height: 1.1;
}
.stat-cell .lbl {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tx-on-dark-dim);
  margin-top: 0.3rem;
}

/* ==========================================================================
   SECTIONS (light)
   ========================================================================== */
.section { padding: 4rem 0 1rem; }

.sec-head {
  display: flex; align-items: baseline; gap: 1.1rem;
  margin-bottom: 2rem;
  border-bottom: 2px solid var(--tx-dark);
  padding-bottom: 0.8rem;
}
.sec-index {
  font-family: var(--font-mono);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--amber-dark);
  letter-spacing: 0.06em;
}
.sec-title {
  font-family: var(--font-head);
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  letter-spacing: -0.01em;
}
.sec-note {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--tx-light);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.sec-note a { color: var(--amber-dark); text-decoration: none; }
.sec-note a:hover { text-decoration: underline; }

/* About */
.about-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 2.5rem; }
.about-text p { margin-bottom: 1rem; color: var(--tx-mid); font-size: 1.0rem; }
.about-text strong { color: var(--tx-dark); }
.about-text a { color: var(--amber-dark); text-decoration: none; }
.about-text a:hover { text-decoration: underline; }

.ri-box {
  background: var(--paper-card);
  border: 1px solid var(--paper-line);
  border-top: 3px solid var(--amber);
  padding: 1.5rem;
}
.ri-box h3 {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tx-light);
  margin-bottom: 1rem;
}
.ri-box ul { list-style: none; }
.ri-box li {
  padding: 0.5rem 0;
  border-bottom: 1px dashed var(--paper-line);
  font-size: 0.92rem;
  color: var(--tx-mid);
}
.ri-box li:last-child { border-bottom: none; }
.ri-box li i { color: var(--amber-dark); width: 22px; }

/* Ventures */
.venture-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem; }
.venture-card {
  background: var(--paper-card);
  border: 1px solid var(--paper-line);
  padding: 1.8rem 1.6rem;
  position: relative;
  transition: transform .2s, box-shadow .2s;
}
.venture-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--ink-700);
}
.venture-card.featured::before { background: var(--amber); }
.venture-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(16,18,20,0.10); }

.venture-tag {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--amber-dark);
  border: 1px solid var(--amber);
  padding: 0.2rem 0.55rem;
  margin-bottom: 1rem;
}
.venture-card h3 {
  font-family: var(--font-head);
  font-size: 1.35rem;
  font-weight: 700;
  margin-bottom: 0.3rem;
}
.venture-sub {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--tx-light);
  letter-spacing: 0.06em;
  margin-bottom: 0.9rem;
}
.venture-card p { font-size: 0.9rem; color: var(--tx-mid); margin-bottom: 1.1rem; }
.venture-links { display: flex; gap: 0.8rem; flex-wrap: wrap; }
.venture-links a {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--tx-dark);
  text-decoration: none;
  border-bottom: 2px solid var(--amber);
  padding-bottom: 1px;
}
.venture-links a:hover { color: var(--amber-dark); }

/* News */
.news-list { list-style: none; border-top: 1px solid var(--paper-line); }
.news-item {
  display: grid;
  grid-template-columns: 92px 130px 1fr;
  gap: 1.2rem;
  align-items: baseline;
  padding: 0.75rem 0.4rem;
  border-bottom: 1px solid var(--paper-line);
  font-size: 0.93rem;
  color: var(--tx-mid);
}
.news-item:hover { background: rgba(245,158,11,0.05); }
.news-date {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  color: var(--tx-light);
}
.news-badge {
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
  padding: 0.18rem 0.4rem;
  border: 1px solid var(--paper-line);
  color: var(--tx-mid);
  background: var(--paper-card);
  white-space: nowrap;
}
.news-badge.accepted { border-color: var(--amber); color: var(--amber-dark); }
.news-badge.award { background: var(--ink-800); color: var(--amber); border-color: var(--ink-800); }
.news-item b { color: var(--tx-dark); }

/* Publications */
.pub-year {
  font-family: var(--font-head);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--tx-dark);
  margin: 2.2rem 0 0.8rem;
  display: flex; align-items: center; gap: 0.8rem;
}
.pub-year::after { content: ''; flex: 1; height: 1px; background: var(--paper-line); }
.pub-year .count {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--tx-light);
  font-weight: 400;
}

.pub-item {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  column-gap: 0.9rem;
  row-gap: 0.12rem;
  position: relative;
  padding: 1rem 0.5rem;
  border-bottom: 1px solid var(--paper-line);
  transition: background .15s;
}
.pub-item:hover { background: rgba(245,158,11,0.05); }

.pub-item::before {
  content: '';
  grid-column: 1;
  grid-row: 1;
  width: 6px;
  height: 6px;
  margin-top: 0.55rem;
  background: var(--tx-dark);
}

.pub-item > div { display: contents; }

.pub-venue {
  grid-column: 2;
  grid-row: 3;
  font-family: var(--font-body);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--tx-dark);
  padding-top: 0;
  word-break: break-word;
}
.pub-venue::before { content: 'Accepted in '; font-weight: 400; }
.pub-item.under-review .pub-venue::before { content: 'Submitted to '; }
.pub-item.revision .pub-venue::before { content: ''; }
.pub-item.preprint .pub-venue::before { content: ''; }

.pub-title {
  grid-column: 2;
  grid-row: 2;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.08rem;
  font-weight: 500;
  line-height: 1.35;
}
.pub-title a { color: #23588f; text-decoration: none; }
.pub-title a:hover { color: #153d69; text-decoration: underline; }

.venue-tags {
  display: inline-flex;
  gap: 0.35rem;
  margin-left: 0.55rem;
  vertical-align: middle;
  flex-wrap: wrap;
}

.venue-rank {
  display: inline-flex;
  align-items: center;
  min-height: 1.4rem;
  padding: 0.08rem 0.42rem;
  border: 1px solid #bfc4c7;
  background: #f0f1ee;
  color: #4a545b;
  font-family: var(--font-mono);
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.venue-rank.ccf-a,
.venue-rank.top {
  border-color: #d6a15b;
  background: #fff7e9;
  color: #97500f;
}

.venue-rank.ccf-b { border-color: #8fa6b5; background: #eef4f7; color: #405f71; }
.venue-rank.ccf-c { border-color: #a8ada7; background: #f1f2ef; color: #58605a; }
.venue-rank.core-a-star { border-color: #718bb5; background: #e9f0fb; color: #234f91; }
.venue-rank.core-a { border-color: #91a6c2; background: #eef3f8; color: #3d5f88; }
.venue-rank.core-b { border-color: #a8b2bd; background: #f1f3f5; color: #586573; }
.venue-rank.core-na { border-color: #c7cbd0; background: #f5f5f4; color: #767c84; }

.pub-authors {
  grid-column: 2;
  grid-row: 1;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.98rem;
  line-height: 1.45;
  color: var(--tx-dark);
  margin-top: 0;
}
.pub-authors strong { color: var(--tx-dark); font-weight: 700; }

.pub-meta {
  grid-column: 2;
  grid-row: 4;
  margin-top: 0.3rem;
  display: flex;
  gap: 0.9rem;
  flex-wrap: wrap;
  align-items: center;
}
.pub-status {
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.12rem 0.45rem;
  border: 1px dashed var(--tx-light);
  color: var(--tx-light);
}
.pub-status.first {
  border: 1px solid var(--amber);
  color: var(--amber-dark);
  border-style: solid;
}
.pub-links-line a {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--steel);
  text-decoration: none;
  margin-right: 0.9rem;
}
.pub-links-line a:hover { color: var(--amber-dark); }

/* Grants & Awards */
.grant-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.grant-card {
  background: var(--paper-card);
  border: 1px solid var(--paper-line);
  border-left: 4px solid var(--amber);
  padding: 1.5rem;
}
.grant-card.dark {
  background: var(--ink-800);
  border-color: var(--ink-line);
  border-left-color: var(--amber);
  color: var(--tx-on-dark);
}
.grant-card.dark .grant-detail { color: var(--tx-on-dark-dim); }
.grant-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: 0.5rem; }
.grant-name { font-family: var(--font-head); font-size: 1.1rem; font-weight: 700; }
.grant-amt {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--amber-dark);
  white-space: nowrap;
}
.grant-card.dark .grant-amt { color: var(--amber); }
.grant-detail { font-size: 0.88rem; color: var(--tx-mid); }
.grant-role {
  display: inline-block;
  margin-top: 0.8rem;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.2rem 0.55rem;
  border: 1px solid var(--paper-line);
  color: var(--tx-light);
}
.grant-card.dark .grant-role { border-color: var(--ink-line); color: var(--tx-on-dark-dim); }

.award-row {
  display: flex; align-items: center; gap: 1.2rem;
  background: var(--paper-card);
  border: 1px solid var(--paper-line);
  padding: 1.1rem 1.4rem;
  margin-top: 1.5rem;
}
.award-row i { font-size: 1.6rem; color: var(--amber); }
.award-row .t { font-family: var(--font-head); font-weight: 700; }
.award-row .s { font-size: 0.85rem; color: var(--tx-mid); }

/* Service / teaching two-col */
.svc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.svc-block {
  background: var(--paper-card);
  border: 1px solid var(--paper-line);
  padding: 1.5rem;
}
.svc-block h3 {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tx-light);
  margin-bottom: 1rem;
  padding-bottom: 0.6rem;
  border-bottom: 2px solid var(--amber);
}
.svc-block ul { list-style: none; }
.svc-block li {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 0.45rem 0;
  border-bottom: 1px dashed var(--paper-line);
  font-size: 0.88rem;
  color: var(--tx-mid);
}
.svc-block li:last-child { border-bottom: none; }
.svc-block li .yr {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--tx-light);
  white-space: nowrap;
}

/* Contact */
.contact-band {
  background:
    repeating-linear-gradient(0deg, transparent 0 47px, rgba(255,255,255,0.03) 47px 48px),
    repeating-linear-gradient(90deg, transparent 0 47px, rgba(255,255,255,0.03) 47px 48px),
    var(--ink-900);
  color: var(--tx-on-dark);
  border-top: 3px solid var(--amber);
  margin-top: 4rem;
  padding: 3.5rem 0;
}
.contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; margin-top: 2rem; }
.contact-cell {
  border: 1px solid var(--ink-line);
  padding: 1.4rem;
}
.contact-cell h4 {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--amber);
  margin-bottom: 0.7rem;
}
.contact-cell p, .contact-cell a { font-size: 0.9rem; color: var(--tx-on-dark-dim); text-decoration: none; }
.contact-cell a:hover { color: var(--amber); }
.contact-band .sec-head { border-bottom-color: var(--ink-line); }
.contact-band .sec-title { color: var(--tx-on-dark); }
.contact-band .sec-index { color: var(--amber); }

/* Footer */
footer.ind-footer {
  background: var(--ink-800);
  border-top: 1px solid var(--ink-line);
  color: var(--tx-on-dark-dim);
  padding: 1.6rem 0;
  font-family: var(--font-mono);
  font-size: 0.75rem;
}
footer.ind-footer .container { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0.6rem; }
footer.ind-footer a { color: var(--tx-on-dark-dim); text-decoration: none; }
footer.ind-footer a:hover { color: var(--amber); }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 900px) {
  .hero-inner { grid-template-columns: 1fr; gap: 2rem; padding: 3rem 0 2.5rem; }
  .hero-photo-frame { width: 220px; margin: 0 auto; }
  .stats-strip .container { grid-template-columns: repeat(2, 1fr); }
  .stat-cell { border-left: 1px solid var(--ink-line); }
  .about-grid, .venture-grid, .grant-grid, .svc-grid, .contact-grid { grid-template-columns: 1fr; }
  .news-item { grid-template-columns: 80px 1fr; }
  .news-badge { display: none; }
  .pub-item { grid-template-columns: 8px minmax(0, 1fr); column-gap: 0.65rem; }
  .nav-menu { display: none; }
  .nav-container { justify-content: flex-start; }
  .nav-brand { font-size: 0.88rem; }
}

/* Cool editorial theme */
body { background: var(--paper); color: #18202b; }

nav.ind-nav {
  background: rgba(245, 247, 250, 0.94);
  border-bottom: 1px solid var(--paper-line);
  box-shadow: none;
}
.nav-brand { color: #18202b; letter-spacing: 0.01em; }
.nav-menu a {
  color: #687486;
  text-transform: none;
  letter-spacing: 0.015em;
  font-family: var(--font-body);
  font-size: 0.82rem;
  font-weight: 600;
}
.nav-menu a:hover,
.nav-menu a.active { color: var(--amber-dark); border-color: transparent; }

.hero {
  background: radial-gradient(circle at 88% 8%, rgba(49, 95, 189, 0.08), transparent 30%), #f5f7fa;
  color: #18202b;
  border-bottom: 1px solid var(--paper-line);
}
.hero::after { display: none; }
.hero-inner { padding: 4.75rem 0 4rem; grid-template-columns: 290px minmax(0, 1fr); }
.hero-photo-frame::before { border-color: #cbd2de; }
.hero-photo-frame img { border: 1px solid #bcc6d5; filter: none; }
.corner.tl,
.corner.br { border-color: var(--amber); }
.hero-kicker {
  color: var(--amber-dark);
  text-transform: none;
  letter-spacing: 0.06em;
  font-weight: 600;
}
.hero h1 { color: #18202b; font-size: clamp(2.55rem, 5vw, 4rem); }
.hero h1 .alias { color: #667286; }
.hero-affil { color: #647083; }
.hero-affil a { color: #44536a; border-bottom-color: #aeb8c7; }
.hero-award {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: fit-content;
  margin: 0.85rem 0 1.4rem;
  padding: 0.7rem 1rem;
  border: 1px solid #c49a3d;
  background: linear-gradient(100deg, #fff8dc 0%, #f2d47b 35%, #fff6d1 58%, #d6aa49 100%);
  background-size: 220% 100%;
  color: #68460a;
  box-shadow: 0 8px 24px rgba(151, 112, 26, 0.14), inset 0 1px 0 rgba(255,255,255,0.72);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.15rem, 1.55vw, 1.45rem);
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}
.hero-award i { color: #9a6b0f; font-size: 1.1em; }

@media (prefers-reduced-motion: no-preference) {
  .hero-award { animation: award-shimmer 4.8s ease-in-out infinite; }
}

@keyframes award-shimmer {
  0%, 72%, 100% { background-position: 100% 50%; }
  36% { background-position: 0% 50%; }
}

.identity-list { gap: 0; border-top: 1px solid var(--paper-line); }
.identity-row {
  background: transparent;
  border-left: 0;
  border-bottom: 1px solid var(--paper-line);
  padding: 0.85rem 0;
}
.identity-role {
  color: #647083;
  min-width: 124px;
  letter-spacing: 0.045em;
  text-transform: none;
  font-size: 0.75rem;
}
.identity-what { color: #18202b; }
.identity-what .ctx { color: #667286; }
.identity-what { font-size: 1.2rem; }
.identity-what .ctx { font-size: 1rem; }
.identity-role { font-size: 0.83rem; }
.hero-social a {
  border-color: #cbd2de;
  color: #526074;
  background: rgba(255,255,255,0.55);
}
.hero-social a:hover { color: var(--amber-dark); border-color: var(--amber); }

.stats-strip { background: #eef1f5; border-top: 1px solid var(--paper-line); }
.stat-cell { border-color: #d2d8e1; padding: 1.2rem 1rem; }
.stat-cell:first-child { border-left-color: #d2d8e1; }
.stat-cell .num { color: #1e2a3a; font-size: 1.65rem; }
.stat-cell .lbl {
  color: #6b7687;
  text-transform: none;
  letter-spacing: 0.025em;
  font-family: var(--font-body);
  font-weight: 600;
}

.hero-recognition {
  padding: 1.25rem 0 1.45rem;
  border-top: 1px solid #d4c38e;
  background: linear-gradient(105deg, #fffaf0 0%, #f5ecd3 48%, #eef3fa 100%);
}
.hero-recognition-head {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.85rem;
  color: #72500f;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.08rem;
  font-weight: 700;
}
.hero-recognition-head i { color: #b07b18; }
.hero-recognition-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid #d9c993;
  background: rgba(255,255,255,0.56);
}
.hero-recognition-item {
  min-width: 0;
  padding: 0.9rem 1rem 1rem;
  border-right: 1px solid #ded3ad;
}
.hero-recognition-item:last-child { border-right: 0; }
.hero-recognition-item span {
  display: block;
  margin-bottom: 0.3rem;
  color: #8c681f;
  font-size: 0.78rem;
  font-weight: 700;
}
.hero-recognition-item strong {
  display: block;
  color: #26354b;
  font-size: 1rem;
  line-height: 1.35;
}

.section { padding-top: 5.25rem; }
.sec-head { border-bottom: 1px solid #bfc7d2; padding-bottom: 0.7rem; }
.sec-index { display: none; }
.sec-title { color: #18202b; font-size: clamp(1.85rem, 3vw, 2.45rem); }
.sec-note { text-transform: none; letter-spacing: 0.02em; }

.ri-box,
.venture-card,
.grant-card,
.award-row,
.svc-block {
  background: rgba(255,255,255,0.72);
  border-color: var(--paper-line);
  box-shadow: none;
}
.ri-box { border-top: 1px solid var(--paper-line); }
.ri-box h3,
.svc-block h3 {
  text-transform: none;
  letter-spacing: 0.035em;
  color: #596579;
}
.ri-box li i { color: var(--amber-dark); }

.venture-card { padding: 2rem; }
.venture-card::before { background: #c6cfdb; height: 1px; }
.venture-card.featured::before { background: var(--amber); }
.venture-card:hover { box-shadow: 0 14px 38px rgba(42, 58, 82, 0.09); }
.venture-tag {
  color: #536177;
  border: 0;
  padding: 0;
  text-transform: none;
  letter-spacing: 0.035em;
}
.venture-sub { color: #6b7687; letter-spacing: 0.025em; }

.news-item:hover,
.pub-item:hover { background: rgba(49, 95, 189, 0.045); }
.news-badge { border-color: #c5ccd6; color: #5d6878; background: #f7f8fa; }
.news-badge.accepted { border-color: #9fb1ce; color: #31578f; }
.news-badge.award { background: #e8edf5; color: #31578f; border-color: #bdc9da; }
.pub-title a { color: #27579d; }
.pub-title a:hover { color: #183f79; }
.pub-status.first { border-color: #9fb2cf; color: #31578f; }
.venue-rank.ccf-a,
.venue-rank.top { border-color: #9fb2cf; background: #eef3fa; color: #31578f; }

.grant-card { border-left-color: var(--amber); }
.grant-card.dark {
  background: #e9eef5;
  border-color: #ccd5e1;
  border-left-color: var(--amber);
  color: #18202b;
}
.grant-card.dark .grant-detail,
.grant-card.dark .grant-role { color: #596579; }
.grant-card.dark .grant-amt { color: var(--amber-dark); }
.award-row i { color: var(--amber-dark); }
.svc-block h3 { border-bottom-color: #a9b9d0; }

.recognition-panel {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--paper-line);
}
.recognition-panel h3 {
  margin-bottom: 1rem;
  color: #253247;
  font-family: var(--font-head);
  font-size: 1.1rem;
  font-weight: 650;
}
.recognition-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--paper-line);
  border: 1px solid var(--paper-line);
}
.recognition-item {
  min-height: 10rem;
  padding: 1.4rem;
  background: rgba(255,255,255,0.82);
}
.recognition-type {
  display: block;
  margin-bottom: 0.65rem;
  color: #315fbd;
  font-family: var(--font-mono);
  font-size: 0.69rem;
  font-weight: 600;
  letter-spacing: 0.035em;
}
.recognition-item strong {
  display: block;
  margin-bottom: 0.45rem;
  color: #1c2738;
  font-family: var(--font-head);
  font-size: 1rem;
}
.recognition-item p {
  color: #647083;
  font-size: 0.88rem;
  line-height: 1.55;
}

.contact-band {
  background: #e9edf3;
  color: #18202b;
  border-top: 1px solid var(--paper-line);
}
.contact-band .sec-head { border-bottom-color: #bdc6d2; }
.contact-band .sec-title { color: #18202b; }
.contact-cell { border-color: #c7cfda; background: rgba(255,255,255,0.52); }
.contact-cell h4 { color: var(--amber-dark); text-transform: none; letter-spacing: 0.04em; }
.contact-cell p,
.contact-cell a { color: #596579; }

footer.ind-footer {
  background: #e1e6ed;
  border-top-color: #c8d0db;
  color: #5d6878;
}
footer.ind-footer a { color: #45536a; }

@media (max-width: 900px) {
  .hero-inner { grid-template-columns: 1fr; padding: 3.25rem 0 3rem; }
  .identity-row { align-items: flex-start; }
  .hero-award {
    margin: 0.85rem 0 1.2rem;
    padding: 0.65rem 0.8rem;
    font-size: 1.05rem;
    white-space: normal;
  }
  .recognition-grid { grid-template-columns: 1fr; }
  .recognition-item { min-height: auto; }
  .hero-recognition-grid { grid-template-columns: 1fr; }
  .hero-recognition-item {
    border-right: 0;
    border-bottom: 1px solid #ded3ad;
  }
  .hero-recognition-item:last-child { border-bottom: 0; }
}

/* Academic typography and publication rhythm inspired by yinghuali.github.io */
:root {
  --font-head: Georgia, 'Times New Roman', serif;
  --font-body: Georgia, 'Times New Roman', serif;
}

body { font-family: var(--font-body); }
.nav-menu a,
.stat-cell .lbl,
.sec-note { font-family: var(--font-body); }

.sec-title,
.pub-year { color: #527bbd; }

.pub-year {
  margin: 2rem 0 0.65rem;
  padding-bottom: 0.28rem;
  border-bottom: 1px solid #cfd5dc;
  font-size: 1.2rem;
  line-height: 1.25;
}
.pub-year::after { display: none; }
.pub-year .count {
  color: #737b84;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.78rem;
}

.pub-item {
  grid-template-columns: 0.55rem minmax(0, 1fr);
  column-gap: 0.45rem;
  row-gap: 0.05rem;
  padding: 0.48rem 0 0.55rem;
  border-bottom: 0;
  transition: none;
}
.pub-item:hover { background: transparent; }
.pub-item::before {
  width: 0.28rem;
  height: 0.28rem;
  margin-top: 0.48rem;
  border-radius: 50%;
  background: #20252b;
}
.pub-authors {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.92rem;
  line-height: 1.32;
  color: #171b20;
}
.pub-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.96rem;
  font-weight: 400;
  line-height: 1.32;
}
.pub-title a { color: #224b8d; }
.pub-title a:hover { color: #17376b; }
.pub-venue {
  display: block;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.9rem;
  font-weight: 400;
  line-height: 1.32;
  color: #1d2228;
}
.pub-venue::before { font-weight: 400; }

.venue-tags {
  display: inline;
  margin-left: 0.18rem;
  font-family: Georgia, 'Times New Roman', serif;
  white-space: normal;
}
.venue-tags::before { content: '('; font-weight: 700; }
.venue-tags::after { content: ')'; font-weight: 700; }
.venue-rank,
.venue-rank.ccf-a,
.venue-rank.ccf-b,
.venue-rank.ccf-c,
.venue-rank.core-a-star,
.venue-rank.core-a,
.venue-rank.core-b,
.venue-rank.core-na,
.venue-rank.top {
  display: inline;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #1d2228;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: inherit;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.venue-rank + .venue-rank::before { content: ', '; }

.pub-meta {
  margin-top: 0.08rem;
  gap: 0.55rem;
}
.pub-status,
.pub-status.first {
  padding: 0;
  border: 0;
  color: #69717b;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.78rem;
  font-style: italic;
  letter-spacing: 0;
  text-transform: none;
}
.pub-links-line a {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.78rem;
}

@media (max-width: 900px) {
  .pub-item {
    grid-template-columns: 0.45rem minmax(0, 1fr);
    column-gap: 0.4rem;
    padding: 0.55rem 0;
  }
  .pub-authors,
  .pub-title { font-size: 0.92rem; }
  .pub-venue { font-size: 0.86rem; }
}