/* =========================================================
   MR-PHILO / AcadHomepage-style academic homepage
   Static GitHub Pages version with working light/dark theme
   ========================================================= */

:root{
  --bg:#ffffff;
  --text:#494e52;
  --muted:#7a8288;
  --subtle:#9aa1a7;
  --border:#f2f3f3;
  --masthead-bg:#ffffff;
  --card-bg:#ffffff;
  --link:#224b8d;
  --link-hover:#163b72;
  --accent:#6c5ce7;
  --accent-soft:#f8f7fc;
  --tag-bg:#f6f8fb;
  --tag-border:#e9ecef;
  --shadow:0 8px 22px rgba(0,0,0,.07);
  --avatar-border:#f2f3f3;
  --code-bg:#fafafa;
}

html[data-theme="dark"]{
  --bg:#1a1a1a;
  --text:#e0e0e0;
  --muted:#b5bac1;
  --subtle:#8d949e;
  --border:#343a40;
  --masthead-bg:#242424;
  --card-bg:#242424;
  --link:#8ab4f8;
  --link-hover:#b9d3ff;
  --accent:#a29bfe;
  --accent-soft:#2a2738;
  --tag-bg:#262b33;
  --tag-border:#3a404a;
  --shadow:0 8px 22px rgba(0,0,0,.28);
  --avatar-border:#3a3a3a;
  --code-bg:#2d2d2d;
}

*{box-sizing:border-box}

html{
  min-height:100%;
  scroll-behavior:smooth;
  background:var(--bg);
}

body{
  margin:0;
  padding:0;
  min-height:100vh;
  color:var(--text);
  background:var(--bg);
  font-family:"Trebuchet MS", Helvetica, Arial, sans-serif;
  font-size:14px;
  line-height:1.5;
  transition:background-color .25s ease,color .25s ease;
}

a{
  color:var(--link);
  text-decoration:none;
}

a:hover{
  color:var(--link-hover);
  text-decoration:underline;
}

p{margin:0 0 .6em}

strong{color:var(--text)}

/* =========================================================
   Masthead
   ========================================================= */
.masthead{
  position:sticky;
  top:0;
  z-index:20;
  background:var(--masthead-bg);
  border-bottom:1px solid var(--border);
  animation:intro .3s both;
  animation-delay:.15s;
  transition:background-color .25s ease,border-color .25s ease;
}

.masthead__inner-wrap{
  max-width:1280px;
  margin:0 auto;
  padding:.5em 1em;
  font-family:"Trebuchet MS", Helvetica, Arial, sans-serif;
}

.masthead__menu ul{
  margin:0;
  padding:0;
  clear:both;
  list-style-type:none;
}

.greedy-nav{
  position:relative;
  min-width:250px;
  background:transparent;
}

.greedy-nav button{
  display:none;
}

.visible-links{
  display:flex;
  align-items:center;
  gap:1.2em;
}

.masthead__menu-item{
  display:block;
  white-space:nowrap;
}

.masthead__menu-item--lg{
  padding-right:2em;
  font-weight:700;
}

.masthead__menu-item a{
  color:var(--muted);
  font-size:1em;
  text-decoration:none;
}

.masthead__menu-item--lg a{
  color:var(--text);
}

.masthead__menu-item a:hover{
  color:var(--link);
  text-decoration:none;
}

#theme-toggle{
  margin-left:auto;
}

#theme-toggle a{
  cursor:pointer;
}

#theme-icon{
  width:1em;
  text-align:center;
  transition:transform .25s ease;
}

#theme-toggle a:hover #theme-icon{
  transform:rotate(18deg);
}

.hidden{display:none}

/* =========================================================
   Main layout: sidebar + page, following AcadHomepage rhythm
   ========================================================= */
#main{
  max-width:1280px;
  margin:1em auto 2em;
  padding-left:1em;
  padding-right:1em;
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  column-gap:3em;
  animation:intro .3s both;
  animation-delay:.35s;
}

.sidebar{
  transform:translate3d(0,0,0);
  margin-bottom:1em;
}

.sidebar.sticky{
  position:sticky;
  top:4.5em;
  align-self:start;
}

.profile_box{
  display:block;
}

.author__avatar{
  display:block;
  width:auto;
  height:auto;
}

.author__avatar img{
  display:block;
  max-width:175px;
  min-width:75px;
  width:100%;
  height:auto;
  border-radius:50%;
  padding:5px;
  border:1px solid var(--avatar-border);
  background:var(--card-bg);
  transition:border-color .25s ease,background-color .25s ease;
}

.author__content{
  display:block;
  width:100%;
  padding:0;
  line-height:1;
}

.author__name{
  margin:10px 0;
  color:var(--text);
  font-family:"Trebuchet MS", Helvetica, Arial, sans-serif;
  font-size:1.4em;
  font-weight:700;
}

.author__pronouns{
  margin:0 0 .4em;
  color:var(--muted);
  font-size:1em;
}

.author__bio{
  margin:10px 0 20px;
  color:var(--muted);
  font-size:1em;
  line-height:1.45;
}

.author__urls-wrapper{
  position:relative;
  display:block;
  font-family:"Trebuchet MS", Helvetica, Arial, sans-serif;
  z-index:10;
}

.author__urls{
  display:block;
  position:relative;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  list-style-type:none;
  color:var(--muted);
}

.author__urls li{
  margin-bottom:5px;
  color:var(--muted);
  font-size:1em;
  line-height:1.5;
  white-space:normal;
}

.author__urls a{
  display:inline-block;
  color:inherit;
  font-weight:400;
  text-decoration:none;
}

.author__urls a:hover{
  color:var(--link);
  text-decoration:underline;
}

.author__urls_sm{
  display:none;
}

/* =========================================================
   Page content
   ========================================================= */
.page{
  min-width:0;
}

.page__inner-wrap,
.page__content{
  width:100%;
}

.page__content h1{
  margin:1em 0 .5em;
  padding-bottom:.5em;
  border-bottom:1px solid var(--border);
  color:var(--text);
  font-size:1.4em;
  line-height:1.2;
  font-weight:700;
  transition:border-color .25s ease;
}

.page__content h3{
  margin:0 0 .4em;
  color:var(--text);
  font-size:1.05em;
  line-height:1.25;
}

.about-intro{
  margin-top:.2em;
}

.about-intro p{
  margin-bottom:.8em;
  color:var(--text);
  font-size:1em;
}

.intro-highlight{
  color:var(--link);
  font-weight:700;
}

.research-interests{
  display:flex;
  flex-wrap:wrap;
  gap:.5em;
  margin:.8em 0 1em;
}

.interest-tag{
  display:inline-flex;
  align-items:center;
  gap:.35em;
  padding:.35em .7em;
  border:1px solid var(--tag-border);
  border-radius:999px;
  background:var(--tag-bg);
  color:var(--text);
  font-size:.9em;
  line-height:1.2;
}

/* =========================================================
   Timeline
   ========================================================= */
.timeline{
  position:relative;
  margin-left:.2em;
  padding-left:1.4em;
  border-left:2px solid var(--accent);
}

.timeline-item{
  position:relative;
  margin-bottom:1em;
}

.timeline-item::before{
  content:"";
  position:absolute;
  left:-1.72em;
  top:.32em;
  width:.55em;
  height:.55em;
  border-radius:50%;
  background:var(--accent);
  border:2px solid var(--bg);
  box-shadow:0 0 0 1px var(--accent);
}

.timeline-date{
  display:block;
  margin-bottom:.2em;
  color:var(--link);
  font-size:.9em;
  font-weight:700;
}

.timeline-title{
  color:var(--text);
  font-size:1em;
  font-weight:700;
}

.timeline-subtitle,
.timeline-location{
  color:var(--muted);
  font-size:.95em;
}

/* =========================================================
   Publication cards, matching the Mr-Philo purple academic card style
   ========================================================= */
.pub-box{
  display:flex;
  align-items:stretch;
  gap:1.2em;
  margin-bottom:1em;
  padding:1em;
  border:1px solid var(--border);
  border-left:4px solid var(--accent);
  border-radius:8px;
  background:linear-gradient(135deg,var(--card-bg) 0%,var(--accent-soft) 100%);
  box-shadow:var(--shadow);
  transition:transform .2s ease,box-shadow .25s ease,background .25s ease,border-color .25s ease;
}

.pub-box:hover{
  transform:translateY(-2px);
}

.pub-box-image{
  position:relative;
  width:220px;
  min-width:220px;
  min-height:135px;
  overflow:hidden;
  border-radius:6px;
  background:linear-gradient(135deg,#6c5ce7 0%,#a29bfe 100%);
}

.pub-venue{
  position:absolute;
  top:.75em;
  left:0;
  z-index:2;
  padding:.3em .75em;
  border-radius:0 4px 4px 0;
  background:rgba(255,255,255,.94);
  color:#6c5ce7;
  font-size:.72em;
  font-weight:700;
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}

.paper-thumb{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  min-height:135px;
  padding:2.8em 1em 1em;
  color:#fff;
  font-size:1.08em;
  font-weight:700;
  text-align:center;
  line-height:1.25;
  text-shadow:0 2px 10px rgba(0,0,0,.18);
}

.pub-box-text{
  min-width:0;
  flex:1;
}

.pub-authors{
  margin:.25em 0 .35em;
  color:var(--muted);
  font-size:.95em;
}

.pub-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.8em;
  margin:.35em 0;
  color:var(--subtle);
  font-size:.85em;
}

.pub-meta span{
  display:inline-flex;
  align-items:center;
  gap:.3em;
}

.pub-excerpt{
  margin:.4em 0 0;
  color:var(--text);
  font-size:.95em;
}

.pub-links{
  display:flex;
  flex-wrap:wrap;
  gap:.5em;
  margin-top:.6em;
}

.pub-links img{
  max-height:22px;
}

.site-footer{
  margin:2em 0 0;
  padding-top:1em;
  border-top:1px solid var(--border);
  color:var(--subtle);
  font-size:.9em;
}

@keyframes intro{
  from{opacity:0; transform:translateY(-3px)}
  to{opacity:1; transform:translateY(0)}
}

/* =========================================================
   Responsive
   ========================================================= */
@media(max-width:925px){
  #main{
    display:block;
    margin-top:1em;
  }

  .sidebar.sticky{
    position:relative;
    top:auto;
  }

  .profile_box{
    display:flex;
    align-items:center;
    gap:1em;
    margin-bottom:1.2em;
  }

  .author__avatar{
    width:80px;
    min-width:80px;
  }

  .author__avatar img{
    width:75px;
    min-width:75px;
    padding:0;
    border:0;
  }

  .author__content{
    width:auto;
    min-width:120px;
  }

  .author__name{
    margin:0 0 .2em;
    font-size:1.2em;
  }

  .author__bio{
    margin:.2em 0;
  }

  .author__urls-wrapper{
    margin-left:auto;
  }

  .author__urls{
    display:none;
  }

  .author__urls_sm{
    display:block;
    font-size:1.45em;
    white-space:nowrap;
  }

  .author__urls_sm a{
    color:var(--muted);
    text-decoration:none;
  }

  .pub-box{
    flex-direction:column;
  }

  .pub-box-image{
    width:100%;
    min-width:0;
  }
}

@media(max-width:640px){
  .visible-links{
    gap:.85em;
    flex-wrap:wrap;
  }

  .masthead__menu-item--lg{
    padding-right:.5em;
  }

  .masthead__menu-item a{
    font-size:.92em;
  }

  #theme-toggle{
    margin-left:0;
  }
}