/* Homepage-specific rules. Legacy exports retain their existing styles. */
body { margin: 0; padding: 0; }
.post-header { padding: 20px 0; text-align: center; }
.post-title { margin: 0; font-size: 24px; font-family: Arial, sans-serif; }
.post { display: flow-root; overflow-wrap: anywhere; }
.post pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.profile-photo { float: right; width: 280px; height: auto; max-width: 100%; margin: 10px; }
.publication { margin-bottom: 2.5rem; }
.publication a { display: inline-block; margin-right: 0.5rem; font-weight: 400; }
.publication-meta { font-size: 0.85rem; font-weight: 400; }
.publication-status { color: #616161; }
.author-note { margin-top: 20px; padding-top: 8px; border-top: 1px solid #eee; color: #666; font-size: 12px; }
.journal-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 20px; }
.journal-item { display: flex; align-items: center; min-width: 0; }
.journal-item img { width: 60px; height: auto; margin-right: 10px; flex-shrink: 0; }
.journal-item .journal-logo--transparent { background: #fff; border-radius: 2px; padding: 3px; box-sizing: border-box; }
.journal-item a { color: #007bff; text-decoration: none; }
.journal-item a:hover { text-decoration: underline; }
.visitor-map { width: 200px; max-width: 100%; margin: 2rem auto; }
.visitor-intro, .visitor-stats { text-align: center; font-size: 0.85rem; }
.footer .footer-credit { margin: .75rem 0; color: var(--xw-muted, #69797d); font-size: .8rem; font-weight: 400; line-height: 1.6; }
.footer-credit a { text-decoration: underline; text-underline-offset: .15em; }
.skip-link { position: absolute; left: 1rem; top: -10rem; padding: 0.75rem; background: #fff; z-index: 10; }
.skip-link:focus { top: 1rem; }
a:focus-visible, button:focus-visible, textarea:focus-visible { outline: 2px solid #002147; outline-offset: 3px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
#citation-status.citation-feedback { position: fixed; bottom: 1rem; right: 1rem; max-width: calc(100vw - 2rem); margin: 0; padding: 0.75rem 1rem; background: #002147; color: #fff; border-radius: 4px; z-index: 20; }
#citation-dialog { width: min(42rem, 90vw); max-height: 85vh; overflow: auto; border: 1px solid #002147; }
#citation-dialog::backdrop { background: rgb(0 0 0 / 40%); }
#citation-text { box-sizing: border-box; width: 100%; margin-bottom: 1rem; font-family: monospace; }
@media (min-width: 48rem) { .sidebar { overflow-y: auto; } }
@media (max-width: 30rem) { .profile-photo { float: none; display: block; margin: 0 auto 1.5rem; } }
html, body { background: var(--xw-paper, #fff); color: var(--xw-ink, #002147); }
p, .post, .post-title, .post-description, table, .footer p { color: var(--xw-ink, #002147); }
a, p a, .journal-item a, .footer a { color: var(--xw-accent, #416d80); }
a:hover, .footer a:hover { color: var(--xw-ink, #293e46); }
.sidebar { background: #cee1e8; color: #203e4c; }
.sidebar h1.brand-title, .sidebar .brand-tagline, .sidebar .nav-item a { color: #203e4c; }
.sidebar .brand-tagline { font-weight: 400; line-height: 1.55; padding: 0 12px; }
.sidebar .nav-item a { font-size: .9rem; }
.nav-list--projects { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.nav-list--projects .nav-item { display: inline-flex; align-items: baseline; flex: 1 1 min-content; max-width: max-content; }
.sidebar .nav-list--projects a { margin-top: 0; font-weight: 700; letter-spacing: 0; }
@media (min-width: 48rem) { .nav-list--projects { justify-content: flex-end; } }
.publication-status, .author-note { color: var(--xw-muted, #69797d); }
.author-note { border-color: var(--xw-line, #d4dcd8); }
.education-list { display: grid; gap: 1.75rem; margin: .5rem 0 1.5rem; }
.education-entry { display: grid; grid-template-columns: 132px minmax(0, 1fr); align-items: center; gap: 24px; }
.education-logo { position: relative; display: grid; place-items: center; width: 132px; height: 90px; overflow: hidden; background: #fff; border-radius: 8px; }
.education-logo img { display: block; width: 116px; height: auto; max-height: 74px; object-fit: contain; }
.education-logo--neu img { width: 72px; }
/* The supplied NUS image has broad white margins. Show its full mark at the same visual scale as the other logos. */
.education-logo--nus img { position: absolute; left: 50%; top: 50%; width: 164px; max-width: none; max-height: none; transform: translate(-50%, -50%); }
.education-details { min-width: 0; }
.education-school { margin: 0 0 .4rem; font-size: 1rem; line-height: 1.4; }
.education-details p { margin: .15rem 0; line-height: 1.45; }
.education-programme { font-size: .9rem; }
.education-specialism, .education-result, .education-supervisor, .education-period { font-size: .85rem; }
.education-details .education-period { margin-top: .4rem; color: var(--xw-muted); font-variant-numeric: tabular-nums; }
#citation-dialog, #citation-text { background: var(--xw-paper, #fff); color: var(--xw-ink, #002147); border-color: var(--xw-line); }
#citation-dialog button { padding: 8px 16px; border: 1px solid var(--xw-line); background: var(--xw-paper); color: var(--xw-ink); }
.skip-link { background: var(--xw-paper); }
html[data-theme=dark] .sidebar { background: #192e3a; }
html[data-theme=dark] .sidebar h1.brand-title, html[data-theme=dark] .sidebar .brand-tagline, html[data-theme=dark] .sidebar .nav-item a { color: #d8e8ed; }
html[data-theme=dark] .profile-photo { filter: brightness(.9); }
html[data-theme=dark] .journal-item img { background: #e9eeea; border-radius: 3px; }
html[lang=zh-CN] h1.brand-title { font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif; font-size: 3.4rem; }
@media(max-width:30rem) {
 .education-entry { grid-template-columns: 90px minmax(0, 1fr); gap: 14px; }
 .education-logo { width: 90px; height: 68px; }
 .education-logo img { width: 82px; max-height: 56px; }
 .education-logo--neu img { width: 56px; }
 .education-logo--nus img { width: 112px; max-height: none; }
 .education-school { font-size: .9rem; }
 .education-programme, .education-specialism, .education-result, .education-supervisor, .education-period { font-size: .8rem; }
}
