/* publications.css */

/* Keep layout consistent with your other pages */
#publications .pub-wrap{
  display: inline-block;
}

/* Banner is H1: must be visible even if old base CSS hides h1 */
#publications #banner{
  display: block;                 /* CHANGED (was flex) */
  margin: 0 0 0.95rem 0;
  line-height: 1.15;
  /* allow normal wrapping */
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
}

/* If your fade-in JS creates per-letter spans, keep them inline */
#publications #banner .letter{
  display: inline-block;
}

/* OPTIONAL (recommended if you switch JS to “word wrapper” spans):
   This prevents breaking inside a word, while still wrapping between words. */
#publications #banner .word{
  display: inline-block;
  white-space: nowrap;
}

/* Small intro note */
#publications .note{
  width: 100%;
  border: 2px dashed black;
  padding: .75rem 1rem;
  background: #fcfcfc;
  box-sizing: border-box;
  font-size: 95%;
  margin-bottom: .75rem;
}

/* Tables */
#publications .pub-table{
  width: 100%;
  border-collapse: collapse;
  margin-top: .25rem;
  margin-bottom: 1.25rem;
}

#publications .pub-table td{
  vertical-align: top;
}

/* Column sizing */
#publications .col-year{ width: 12%; }
#publications .col-access{ width: 18%; }

@media (max-width: 800px){
  /* Target the research banner specifically */
  #research #banner{
    display: block !important;        /* prevent flex/column behavior */
    width: 100%;
    max-width: 26ch;                  /* controls where the wrap happens (tune 24–30ch) */
    margin: 0 auto 0.95rem auto;      /* center it */
    text-align: center;

    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
  }

  /* Your JS builds per-letter spans; keep them inline so the text wraps normally */
  #research #banner .letter{
    display: inline-block !important;
  }

  #publications .col-year{ width: 18%; }
  #publications .col-access{ width: 24%; }
}

/* Publication text helpers */
#publications .pub-title{ font-weight: bold; }
#publications .pub-meta{ font-size: 95%; }

/* Access column */
#publications .pub-actions{
  white-space: nowrap;
}

/* Pills and link buttons (matches your visual language) */
#publications .pill{
  display: inline-block;
  border: 2px dashed black;
  padding: .1rem .45rem;
  font-weight: bold;
  background: white;
  margin-right: .35rem;
  font-size: 85%;
  user-select: none;
}

#publications .linkbtn{
  display: inline-block;
  border: 2px dashed black;
  padding: .1rem .45rem;
  font-weight: bold;
  background: white;
  text-decoration: none;
  color: black;
  margin-left: .25rem;
}

#publications .linkbtn:hover{
  background: black;
  color: white;
}

/* Make fold titles feel clickable */
#publications .fold-title{
  user-select: none;
}