/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: local('Lato Italic'), local('Lato-Italic'), url(https://fonts.gstatic.com/s/lato/v15/S6u8w4BMUTPHjxsAUi-qNiXg7eU0.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: local('Lato Italic'), local('Lato-Italic'), url(https://fonts.gstatic.com/s/lato/v15/S6u8w4BMUTPHjxsAXC-qNiXg7Q.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url(https://fonts.gstatic.com/s/lato/v15/S6u_w4BMUTPHjxsI5wq_FQftx9897sxZ.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url(https://fonts.gstatic.com/s/lato/v15/S6u_w4BMUTPHjxsI5wq_Gwftx9897g.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v15/S6uyw4BMUTPHjxAwXiWtFCfQ7A.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v15/S6uyw4BMUTPHjx4wXiWtFCc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v15/S6u9w4BMUTPHh6UVSwaPGQ3q5d0N7w.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v15/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

a {
  color: #1772d0;
  text-decoration: none;
}

a:focus,
a:hover {
  color: #f09228;
  text-decoration: none;
}

body,
td,
th,
tr,
p,
a {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 14px;
}

strong {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 14px;
}

h2 {
  margin: 0;
  font-weight: normal;
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 22px;
}

.papertitle {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: 700;
}

.name {
  padding-top: 20px;
  margin: 0;
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 32px;
}

.one {
  width: 160px;
  height: 160px;
  position: relative;
}

.two {
  width: 160px;
  height: 160px;
  position: absolute;
  transition: opacity .2s ease-in-out;
  -moz-transition: opacity .2s ease-in-out;
  -webkit-transition: opacity .2s ease-in-out;
}

.fade {
  transition: opacity .2s ease-in-out;
  -moz-transition: opacity .2s ease-in-out;
  -webkit-transition: opacity .2s ease-in-out;
}

span.highlight {
  background-color: #ffffd0;
}

/* Journey images grid styling */
.journey-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  margin: 20px 0;
}

.journey-image {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  aspect-ratio: 1;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  cursor: pointer;
}

.journey-image:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 8px 20px rgba(23, 114, 208, 0.2);
}

.journey-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.journey-image:hover img {
  transform: scale(1.05);
}

/* Bio text improvements */
.bio-paragraph {
  font-size: 15px;
  line-height: 1.6;
  color: #333;
  margin-bottom: 12px;
}

.phd-callout {
  background: linear-gradient(135deg, rgba(23, 114, 208, 0.1) 0%, rgba(240, 146, 40, 0.05) 100%);
  padding: 12px 16px;
  border-radius: 8px;
  border-left: 4px solid #1772d0;
  font-weight: 500;
  text-align: center;
  margin-top: 16px;
}

.research-journey-header {
  margin-bottom: 16px;
}

.research-journey-subtitle {
  color: #666;
  margin-bottom: 16px;
  font-size: 14px;
}

.colored-box {
    color: black;
    padding: 20px;
    display: inline-block;
    border-radius: 10px;
}

/* Photography carousel */
.photo-carousel {
  position: relative;
  width: 100%;
  max-width: 800px;
  margin: 8px auto 0 auto;
  overflow: hidden;
  border-radius: 10px;
}

.photo-slides {
  position: relative;
  width: 100%;
}

.photo-slide {
  display: none;
}

.photo-slide.active {
  display: block;
}

.photo-slide img {
  width: 100%;
  height: auto;
  display: block;
}

.photo-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.4);
  color: #fff;
  border: none;
  width: 36px;
  height: 36px;
  border-radius: 18px;
  cursor: pointer;
}

.photo-prev { left: 10px; }
.photo-next { right: 10px; }

.photo-dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 8px;
  display: flex;
  justify-content: center;
  gap: 8px;
}

.photo-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.6);
  cursor: pointer;
}

.photo-dot.active {
  background: rgba(255,255,255,0.95);
}

/* Accessibility & legibility enhancements */
/* Makes the overall page larger, increases line-height, spacing and widens the main container */
body,
td,
th,
tr,
p,
a {
  /* increase base size for better legibility */
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: #111 !important;
}

h2 {
  font-size: 26px !important;
}

.papertitle {
  font-size: 16px !important;
}

.name {
  font-size: 40px !important;
}

p {
  margin-bottom: 1rem;
}

/* Override inline max-width styles where they use max-width:800px */
table[style*="max-width:800px"] {
  max-width: 1000px !important;
}
table[style*="max-width:800px"] td {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

.photo-carousel {
  max-width: 1000px;
}

.colored-box {
  padding: 24px;
}

/* Improve link contrast and spacing */
a {
  color: #0b66b2 !important;
  text-decoration: none;
}

a:focus,
a:hover {
  color: #d2691e !important;
  text-decoration: none;
}

/* Responsive: slightly smaller on narrow viewports */
@media (max-width: 600px) {
  body, td, th, tr, p, a {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }
  .name { font-size: 28px !important; }
  h2 { font-size: 20px !important; }
  table[style*="max-width:800px"] { max-width: 100% !important; }
}

/* ============================================ */
/* Creative Research Section Styling */
/* ============================================ */

/* Background images integrated into UI sections */

/* Main wrapper and body backgrounds - animated only */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background: transparent;
}

/* Add rotation animation for dynamic effect */
@keyframes rotate1 { from { transform: rotate(-8deg); } to { transform: rotate(8deg); } }
@keyframes rotate2 { from { transform: rotate(6deg); } to { transform: rotate(-10deg); } }
@keyframes rotate3 { from { transform: rotate(-12deg); } to { transform: rotate(5deg); } }
@keyframes rotate4 { from { transform: rotate(10deg); } to { transform: rotate(-8deg); } }
@keyframes float1 { 0%, 100% { transform: translateY(0px) rotate(-8deg); } 50% { transform: translateY(-12px) rotate(2deg); } }
@keyframes float2 { 0%, 100% { transform: translateY(0px) rotate(6deg); } 50% { transform: translateY(15px) rotate(-8deg); } }
@keyframes float3 { 0%, 100% { transform: translateY(0px) rotate(-12deg); } 50% { transform: translateY(-10px) rotate(4deg); } }
@keyframes float4 { 0%, 100% { transform: translateY(0px) rotate(10deg); } 50% { transform: translateY(18px) rotate(-6deg); } }

/* Apply animations to animated background layer */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image: 
    url('images/a1.png'), 
    url('images/a3.png'), 
    url('images/a4.png'),
    url('images/a6.png'),
    url('images/a7.png');
  background-position: 
    50px 50px,
    calc(100% - 60px) 20%,
    50px calc(100% - 50px),
    calc(100% - 50px) calc(100% - 80px),
    40px calc(100% - 60px);
  background-size: 
    210px,
    210px,
    210px,
    210px,
    210px;
  background-repeat: no-repeat;
  background-attachment: fixed;
  opacity: 0.5;
  filter: none;
  mix-blend-mode: screen;
  transform-origin: center;
}

/* Ensure main wrapper and content sit above the background */
.main-wrapper {
  position: relative;
  z-index: 1;
}

/* Journey section background */
table[style*="margin-bottom: 20px"] {
  position: relative;
}

/* Research section - no background images inside boxes */
table[style*="border-spacing:0px 10px"] {
  position: relative;
}

/* Ensure text remains readable over backgrounds */
table[style*="width:100%"] td {
  position: relative;
  z-index: 1;
}

/* Hide decorations on small screens */
@media (max-width: 700px) {
  body::before { display: none; }
  table[style*="border-spacing:0px 10px"] { background-image: none; }
}

/* Year headers - make them more prominent and visually distinct */
h3[style*="color:#1772d0"] {
  background: linear-gradient(135deg, #1772d0 0%, #0f5fa8 100%) !important;
  color: white !important;
  padding: 12px 20px !important;
  border-radius: 8px !important;
  margin: 28px 0 16px 0 !important;
  font-size: 20px !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 2px 8px rgba(23, 114, 208, 0.15) !important;
  display: inline-block !important;
  font-weight: 600 !important;
}

/* Research paper rows - style as cards with landscape images */
table[style*="border-spacing:0px 10px"] tr[onmouseout] {
  background: #f8f9fa !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  margin-bottom: 16px !important;
  display: flex !important;
  width: 100% !important;
  align-items: flex-start !important;
  gap: 0 !important;
  padding: 0 !important;
}

table[style*="border-spacing:0px 10px"] tr[onmouseout] td:first-child {
  flex: 0 0 240px !important;
  padding: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 164px !important;
}

table[style*="border-spacing:0px 10px"] tr[onmouseout] td:last-child {
  flex: 1 1 auto !important;
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

/* Paper card hover effect - lift and enhance shadow */
table[style*="border-spacing:0px 10px"] tr[onmouseout]:hover {
  background: #fff !important;
  box-shadow: 0 8px 20px rgba(23, 114, 208, 0.15), 0 4px 12px rgba(0, 0, 0, 0.1) !important;
  transform: translateY(-4px) !important;
}

/* Highlighted papers (yellow background) - enhance styling */
table[style*="border-spacing:0px 10px"] tr[bgcolor="#ffffd0"] {
  background: linear-gradient(135deg, #ffffd0 0%, #fff9e6 100%) !important;
  border-left: 4px solid #ffd700 !important;
}

table[style*="border-spacing:0px 10px"] tr[bgcolor="#ffffd0"]:hover {
  box-shadow: 0 8px 20px rgba(255, 215, 0, 0.2), 0 4px 12px rgba(0, 0, 0, 0.1) !important;
  border-left-color: #ffbc00 !important;
}

/* Image containers - landscape orientation */
table[style*="border-spacing:0px 10px"] .one {
  width: 240px !important;
  height: 140px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
  margin-right: 12px !important;
  position: relative !important;
  flex-shrink: 0 !important;
}

table[style*="border-spacing:0px 10px"] .one img {
  width: 240px !important;
  height: 140px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  display: block !important;
  transition: transform 0.4s ease !important;
}

table[style*="border-spacing:0px 10px"] .two {
  width: 240px !important;
  height: 140px !important;
  border-radius: 8px !important;
}

table[style*="border-spacing:0px 10px"] .two img {
  width: 240px !important;
  height: 140px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}

table[style*="border-spacing:0px 10px"] tr[onmouseout]:hover .one img {
  transform: scale(1.05) !important;
}

/* Paper card container for collapsible view */
.paper-card {
  cursor: pointer !important;
  user-select: none !important;
}

/* Compact header (always visible) */
.paper-header {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

/* Details section (hidden by default) */
.paper-details {
  display: none !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid #e0e0e0 !important;
}

/* Details shown when card is expanded */
.paper-card.expanded .paper-details {
  display: block !important;
}

/* Details content styling */
.paper-details div {
  font-size: 12px !important;
  margin: 6px 0 !important;
  color: #666 !important;
}

.paper-details em {
  color: #555 !important;
  font-style: italic !important;
  font-weight: 500 !important;
}

.paper-details a {
  color: #1772d0 !important;
  margin-right: 12px !important;
}

/* Conference/journal name styling */
table[style*="border-spacing:0px 10px"] td[style*="padding:8px"] em {
  color: #555 !important;
  font-style: italic !important;
  font-weight: 500 !important;
}

/* Research intro section styling */
table[style*="border-spacing:0px;border-collapse:separate;margin-right:auto;margin-left:auto;"] 
  td[style*="padding:16px;width:100%;vertical-align:middle"] {
  background: linear-gradient(135deg, rgba(23, 114, 208, 0.03) 0%, rgba(240, 146, 40, 0.02) 100%) !important;
  padding: 24px 20px !important;
  border-radius: 8px !important;
  border-left: 4px solid #1772d0 !important;
  margin-bottom: 20px !important;
}

/* Responsive adjustments for research cards */
@media (max-width: 900px) {
  table[style*="border-spacing:0px 10px"] tr[onmouseout] {
    flex-direction: row !important;
  }
  
  table[style*="border-spacing:0px 10px"] .one {
    width: 200px !important;
    height: 120px !important;
  }
  
  table[style*="border-spacing:0px 10px"] .one img {
    width: 200px !important;
    height: 120px !important;
  }
  
  table[style*="border-spacing:0px 10px"] .two {
    width: 200px !important;
    height: 120px !important;
  }
  
  table[style*="border-spacing:0px 10px"] .two img {
    width: 200px !important;
    height: 120px !important;
  }
  
  table[style*="border-spacing:0px 10px"] tr[onmouseout] td:first-child {
    flex: 0 0 200px !important;
    min-height: 144px !important;
  }
}

@media (max-width: 768px) {
  table[style*="border-spacing:0px 10px"] tr[onmouseout] {
    display: flex !important;
    flex-direction: column !important;
    margin-bottom: 20px !important;
  }
  
  table[style*="border-spacing:0px 10px"] td {
    display: block !important;
    width: 100% !important;
    padding: 12px !important;
  }
  
  table[style*="border-spacing:0px 10px"] tr[onmouseout] td:first-child {
    text-align: center !important;
    margin-bottom: 0 !important;
    min-height: auto !important;
    flex: 1 !important;
  }
  
  table[style*="border-spacing:0px 10px"] .one {
    width: 100% !important;
    height: auto !important;
    max-width: 300px !important;
    margin: 0 auto 12px auto !important;
  }
  
  table[style*="border-spacing:0px 10px"] .one img {
    width: 100% !important;
    height: auto !important;
  }
  
  table[style*="border-spacing:0px 10px"] .two {
    width: 100% !important;
    height: auto !important;
    max-width: 300px !important;
  }
  
  table[style*="border-spacing:0px 10px"] .two img {
    width: 100% !important;
    height: auto !important;
  }
  
  h3[style*="color:#1772d0"] {
    margin-left: 0 !important;
  }
}

/* ===================================================== */
/* Publications compact mode                             */
/* Applies only to the publications table we marked      */
/* with class="publications pubs-compact"                */
/* ===================================================== */

table.publications {
  border-spacing: 0 6px !important; /* tighter gaps between rows */
}

/* Compact row card spacing */
table.publications tr[onmouseout] {
  margin-bottom: 8px !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08) !important; /* subtler shadow */
}

/* Smaller thumbnail column */
table.publications tr[onmouseout] td:first-child {
  flex: 0 0 180px !important;
  padding: 8px !important;
  min-height: 120px !important;
}

/* Shrink preview image containers */
table.publications .one,
table.publications .two {
  width: 180px !important;
  height: 110px !important;
  border-radius: 6px !important;
}

table.publications .one img,
table.publications .two img {
  width: 180px !important;
  height: 110px !important;
  object-fit: cover !important;
  border-radius: 6px !important;
}

/* Tighten content padding */
table.publications tr[onmouseout] td:last-child {
  padding: 10px !important;
}

/* Slightly smaller title to reduce wrapping */
table.publications .papertitle {
  font-size: 15px !important;
  line-height: 1.3 !important;
}

/* Compact details when expanded */
table.publications .paper-details {
  margin-top: 8px !important;
  padding-top: 8px !important;
}

/* Optional: smaller metadata text inside details */
table.publications .paper-details div {
  font-size: 12px !important;
  margin: 4px 0 !important;
}

/* Make the toggle arrow a bit more compact */
table.publications .paper-toggle {
  font-size: 12px !important;
  color: #777 !important;
}

/* Rotate the toggle when expanded */
.paper-card.expanded .paper-toggle {
  display: inline-block !important;
  transform: rotate(180deg);
}

/* ===================================================== */
/* Generic compact list cards (Projects, Hobbies, etc.)  */
/* Target tables with class .compact-list                */
/* ===================================================== */

table.compact-list {
  border-spacing: 0 8px !important;
}

/* Make item rows look like compact two-column cards */
table.compact-list tr.item-row {
  background: #f8f9fa !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important; /* center the whole card within the table */
  gap: 0 !important;
  padding: 0 !important;
  margin-bottom: 12px !important;
}

/* Thumbnail column */
table.compact-list tr.item-row td:first-child {
  flex: 0 0 240px !important;
  padding: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 140px !important;
}

/* Thumbnails */
table.compact-list tr.item-row td:first-child img {
  width: 240px !important;
  height: 140px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
}

/* Content column */
table.compact-list tr.item-row td:last-child {
  flex: 1 1 auto !important;
  padding: 16px !important;
  text-align: left !important;
}

/* Title link (first link in content) */
table.compact-list tr.item-row td:last-child > a:first-child {
  font-weight: 700 !important;
  font-size: 16px !important;
}

/* Slightly smaller body text inside item */
table.compact-list tr.item-row td:last-child br + * {
  font-size: 14px !important;
}

/* Responsive adjustments for compact lists */
@media (max-width: 768px) {
  table.compact-list tr.item-row {
    flex-direction: column !important;
  }
  table.compact-list tr.item-row td:first-child img {
    width: 100% !important;
    height: auto !important;
    max-width: 320px !important;
  }
}

/* ================= Projects-specific centering tweaks ================= */
/* Center the project cards and constrain their width */
table.projects-list tr.item-row {
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Center the details (right column) content and constrain reading width */
table.projects-list tr.item-row td:last-child {
  text-align: left !important;            /* keep text readable */
  flex: 0 1 620px !important;             /* constrain details width */
  max-width: 620px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Make the first link (title) stand out a bit when centered */
table.projects-list tr.item-row td:last-child > a:first-child {
  display: inline-block !important;
  margin-bottom: 6px !important;
}

/* Make tbody a flex column so rows can be centered as blocks */
table.projects-list tbody {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important; /* center rows */
}

/* Override inline td widths (20%/80%) so our flex sizing applies */
table.projects-list tr.item-row td {
  width: auto !important;
}

/* ================= Hobbies-specific centering tweaks ================= */
/* Apply same centered layout to hobbies page */
table.hobbies-list tr.item-row {
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

table.hobbies-list tr.item-row td:last-child {
  text-align: left !important;
  flex: 0 1 620px !important;
  max-width: 620px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

table.hobbies-list tr.item-row td:last-child > a:first-child,
table.hobbies-list tr.item-row td:last-child > strong:first-child {
  display: inline-block !important;
  margin-bottom: 6px !important;
}

table.hobbies-list tbody {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

table.hobbies-list tr.item-row td {
  width: auto !important;
}

/* Keep section header rows (without .item-row class) at full width */
table.hobbies-list tr:not(.item-row) {
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 auto !important;
}