:root{
    --bg:#fafaf9;
    --surface:#ffffff;
    --text:#202124;
    --muted:#687078;
    --line:#e4e6e8;
    /* --accent:#2457a6; */
    /* --accent:#b8aea1; */
    /* --accent:#75695e; */
    --accent:#8f8172;
    --max:1050px;
}
*{
    box-sizing:border-box
}
html{
    overflow-y:scroll
}
body{
    margin:0;
    background:var(--bg);
    color:var(--text);
    font:16px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
a{
    color:var(--accent);
    text-decoration:none
}
a:hover{
    text-decoration:underline
}
.site-header{
    position:sticky;top:0;
    z-index:10;background:color-mix(in srgb,var(--bg) 94%,transparent);
    backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line)
}
.nav-wrap{
    width:100%;
    max-width:var(--max);
    min-height:70px;
    margin:auto;
    padding:14px 24px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px
}
.brand{
    color:var(--text);
    display:flex;
    flex-direction:column;
    line-height:1.25
}
.brand strong{
    font-size:1.05rem
}
.brand span{
    color:var(--muted);
    font-size:.82rem
}
nav{
    display:flex;
    align-items:center;
    gap:20px
}
nav a{
    color:var(--text);
    font-size:.94rem;
    white-space:nowrap
}
nav a.active{
    color:var(--accent);
    font-weight:650
}
.theme-button,
.menu-button{
    border:0;
    background:transparent;
    color:var(--text);
    cursor:pointer;padding:6px;font-size:1.1rem
}
.menu-button{
    display:none
}
main{
    max-width:var(--max);
    margin:auto;padding:60px 24px 100px
}
.hero{
    display:grid;
    grid-template-columns:1fr 300px;
    gap:60px;
    align-items:center;
    margin-bottom:90px
}
h1{
    font-size:clamp(2.5rem,6vw,4.5rem);
    line-height:1.05;
    letter-spacing:-.04em;
    margin:.1em 0 .2em
}
h2{
    margin-top:0;
    font-size:1.45rem
}
h3{
    margin:0 0 4px;
    font-size:1.04rem;
    line-height:1.4
}
.lead{
    font-size:1.25rem;
    color:var(--muted);
    max-width:650px
}
.eyebrow{
    color:var(--accent);
    text-transform:uppercase;
    letter-spacing:.13em;
    font-size:.76rem;
    font-weight:700
}
.card{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:14px;
    padding:22px
}
.section-heading{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    margin-bottom:18px
}
.news-item{
    display:grid;
    grid-template-columns:125px 1fr;
    gap:24px;
    padding:15px 0;
    border-top:1px solid var(--line)
}
.news-item time,
.meta{
    color:var(--muted);
    font-variant-numeric:tabular-nums
}
.publication{
    padding:20px 0;
    border-top:1px solid var(--line)
}
.venue{
    color:var(--muted);
    font-size:.94rem
}
.page-intro{
    margin-bottom:55px
}
.year{
    margin-bottom:50px
}
.year>h2{
    color:var(--muted);
    border-bottom:2px solid var(--text);
    padding-bottom:8px
}
.simple-item{
    display:grid;
    grid-template-columns:150px 1fr;
    gap:25px;
    padding:20px 0;
    border-top:1px solid var(--line)
}
.simple-item h2{
    margin:0
}
.grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
    margin:20px 0 55px
}
.people-grid {
    grid-template-columns: 1fr;
}
.prose{
    max-width:700px
}
footer{
    border-top:1px solid var(--line);
    padding:28px 24px;
    color:var(--muted);
    font-size:.85rem
}
footer div{
    max-width:var(--max);
    margin:auto
}
/* @media(max-width:700px){ */
/*     .menu-button{ */
/*         display:block */
/*     } */
/*     nav{ */
/*         display:none; */
/*         position:absolute; */
/*         left:0; */
/*         right:0; */
/*         top:70px; */
/*         background:var(--bg); */
/*         border-bottom:1px solid var(--line); */
/*         padding:15px 24px; */
/*         flex-direction:column; */
/*         align-items:flex-start */
/*     } */
/*     nav.open{ */
/*         display:flex */
/*     } */
/*     .hero{ */
/*         grid-template-columns:1fr; */
/*         gap:25px; */
/*         margin-bottom:60px */
/*     } */
/*     main{ */
/*         padding-top:40px */
/*     } */
/*     .news-item, */
/*     .simple-item{ */
/*         grid-template-columns:1fr;gap:3px */
/*     } */
/*     .grid{ */
/*         grid-template-columns:1fr */
/*     } */
/* } */
@media(max-width:700px){
    .menu-button{
        display:block
    }
    nav{
        display:none;
        position:fixed;
        left:0;
        right:0;
        top:70px;
        max-height:calc(100dvh - 70px);
        overflow-y:auto;
        background:var(--bg);
        border-bottom:1px solid var(--line);
        padding:15px 24px;
        flex-direction:column;
        align-items:flex-start
    }
    nav.open{
        display:flex
    }
    .hero{
        grid-template-columns:1fr;
        gap:25px;
        margin-bottom:60px
    }
    main{
        padding-top:40px
    }
    .news-item,
    .simple-item{
        grid-template-columns:1fr;
        gap:3px
    }
    .grid{
        grid-template-columns:1fr
    }
}

/* Dark neutral theme */
html[data-theme="dark"]{
    --bg: #111817;
    --surface: #372f29;
    --text: #f3f4f6;
    --muted: #aeb8c7;
    --line: #374151;
    --accent: #ddd7cc;
}

/* Light red / pink theme */
html[data-theme="light-red"]{
    --bg: #fff7f9;
    --surface: #ffffff;
    --text: #2b2024;
    --muted: #806b73;
    --line: #f0dfe5;
    --accent: #b4235a;
}

/* Dark red / pink theme */
html[data-theme="dark-red"]{
    --bg: #29131d;
    --surface: #3a1d2a;
    --text: #fff1f5;
    --muted: #d4aebb;
    --line: #5b3545;
    --accent: #ff8fbd;
}

/* Light green / lime theme */
html[data-theme="light-green"]{
    --bg: #f8fcf4;
    --surface: #ffffff;
    --text: #20291f;
    --muted: #71806b;
    --line: #e0ead9;
    --accent: #4d8c19;
}

/* Dark green / lime theme */
html[data-theme="dark-green"]{
    --bg: #172512;
    --surface: #293b20;
    --text: #f4faef;
    --muted: #b8cbaa;
    --line: #435b35;
    --accent: #b9ef68;
}

/* Light blue theme */
html[data-theme="light-blue"]{
    --bg: #f5f9ff;
    --surface: #ffffff;
    --text: #202b3d;
    --muted: #687991;
    --line: #dce7f5;
    /* --accent: #2457a6; */
    --accent: #3978c9;
}

/* Dark blue theme */
html[data-theme="dark-blue"]{
    /* --bg: #101d35; */
    /* --surface: #1b2d4b; */
    /* --text: #f1f6ff; */
    /* --muted: #aebed6; */
    /* --line: #344b70; */
    /* --accent: #82b5ff; */
    --bg: #111a2b;
    --surface: #20293b;
    --text: #edf3fc;
    --muted: #aab6c8;
    --line: #394555;
    --accent: #82b5ff;
}

/* Light purple theme */
html[data-theme="light-purple"]{
    --bg: #faf7ff;
    --surface: #ffffff;
    --text: #292333;
    --muted: #756b80;
    --line: #e5dced;
    --accent: #7135b8;
}

/* Dark purple theme */
html[data-theme="dark-purple"]{
    --bg: #21152f;
    --surface: #2d1d40;
    --text: #f8f5fc;
    --muted: #c4b8d1;
    --line: #49365a;
    --accent: #d0a0ff;
}

/* Light orange theme */
html[data-theme="light-orange"]{
    --bg: #fff8f2;
    --surface: #ffffff;
    --text: #30251f;
    --muted: #806f64;
    --line: #f0dfd2;
    --accent: #f06a00;
}

/* Dark orange theme */
html[data-theme="dark-orange"]{
    --bg: #2d1608;
    --surface: #42210d;
    --text: #fff7f0;
    --muted: #d5b9a5;
    --line: #654024;
    --accent: #ffab66;
}

/* Light teal theme */
html[data-theme="light-teal"]{
    --bg: #f3fcfc;
    --surface: #ffffff;
    --text: #203033;
    --muted: #698083;
    --line: #d9e9e9;
    --accent: #087f83;
}

/* Dark teal theme */
html[data-theme="dark-teal"]{
    --bg: #102a2d;
    --surface: #1b3b3f;
    --text: #effcfc;
    --muted: #b0d0d2;
    --line: #34585c;
    --accent: #7de5e5;
}

/* Light slate theme */
[data-theme="light-slate"] {
    --bg: #f6f8fa;
    --surface: #ffffff;
    --text: #202428;
    --muted: #66717d;
    --line: #dfe3e7;
    --accent: #475569;
}

/* Dark slate theme */
[data-theme="dark-slate"] {
    --bg: #11161c;
    --surface: #1b222b;
    --text: #edf1f5;
    --muted: #a4adb8;
    --line: #303944;
    --accent: #94a3b8;
}
.profile-photo{
    width:220px;
    flex:0 0 220px
}
.profile-photo img{
    display:block;
    width:220px;
    height:270px;
    object-fit:cover;
    border:1px solid var(--line);
    border-radius:12px
}
.pub-links{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:8px;
    font-size:.88rem
}
.pub-link{
    display:inline-flex;
    align-items:center;
    gap:5px;
    font-weight:650
}
.pub-link span{
    font-size:1rem
}

@media(max-width:700px){
    .profile-photo{margin:auto}
}
.img-haldoi{
    height:1.5em
}
.theme-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 32px;
    height: 32px;
    padding: 6px;

    border: 0;
    background: transparent;
    color: var(--text);
    cursor: pointer;

    font-size: 1.1rem;
    line-height: 1;
}
.theme-button:not(.ready) {
    color: transparent;
}

/* Theme picker */
.theme-picker { position: relative; }
.theme-picker > summary { list-style: none; }
.theme-picker > summary::-webkit-details-marker { display: none; }
.theme-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 1000;
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 4px;
    padding: 8px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgb(0 0 0 / 15%);
}
.theme-option {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 7px;
    background: transparent;
    color: var(--text);
    cursor: pointer;
}
.theme-option:hover, .theme-option:focus-visible, .theme-option.active {
    border-color: var(--accent);
    background: var(--bg);
}
.theme-symbol {
    font-size: 1.25rem; line-height: 1;
}
.theme-symbol-light {
    color: var(--theme-color);
}
.theme-symbol-dark {
    color: var(--theme-color);
}
.theme-current-symbol {
    color: var(--accent);
    font-size: 1.15rem;
    line-height: 1;
}
.theme-option[data-theme="light"] {
    /* --theme-color: var(--text); */
    --theme-color: #8f8172;
}
.theme-option[data-theme="dark"] {
    /* --theme-color: var(--text); */
    --theme-color: #ddd7cc;
}
.theme-option[data-theme="light-red"] {
    /* --theme-color: #c62828; */
    --theme-color: #b4235a;
}
.theme-option[data-theme="dark-red"] {
    --theme-color: #ff8fbd;
}
.theme-option[data-theme="light-green"] {
    /* --theme-color: #65a30d; */
    --theme-color: #4d8c19;
}
.theme-option[data-theme="dark-green"] {
    --theme-color: #b9ef68;
}
.theme-option[data-theme="light-blue"] {
    /* --theme-color: #2457a6; */
    --theme-color: #3978c9;
}
.theme-option[data-theme="dark-blue"] {
    --theme-color: #82b5ff;
}
.theme-option[data-theme="light-purple"] {
    /* --theme-color: #7c3aed; */
    --theme-color: #7135b8;
}
.theme-option[data-theme="dark-purple"] {
    --theme-color: #d0a0ff;
}
.theme-option[data-theme="light-orange"] {
    /* --theme-color: #ea580c; */
    --theme-color: #f06a00;
}
.theme-option[data-theme="dark-orange"] {
    --theme-color: #ffab66;
}
.theme-option[data-theme="light-teal"] {
    /* --theme-color: #0891b2; */
    --theme-color: #087f83;
}
.theme-option[data-theme="dark-teal"] {
    --theme-color: #7de5e5;
}
.theme-option[data-theme="light-slate"] {
    /* --theme-color: #0891b2; */
    --theme-color: #475569;
}
.theme-option[data-theme="dark-slate"] {
    --theme-color: #94a3b8;
}
@media (max-width:700px){
    .theme-menu{
        grid-template-columns:repeat(4,32px);
        right:auto;
        left:0;
        max-width:calc(100vw - 48px);
    }
}
