/* Lightweight motion, with readable content even when JavaScript is unavailable. */
html { scroll-behavior: smooth; }
#about-me, #publications, #research-interests { scroll-margin-top: 85px; }
.social-icons a, .pub-filter-btn, .publications .teaser { transition: transform 240ms ease, color 240ms ease, background-color 240ms ease; }
.publications .title a { text-decoration-thickness: 1px; text-underline-offset: 4px; }
.publications .title a:hover { text-decoration: underline; }
@media (hover: hover) and (pointer: fine) {
  .publications .pub-row:hover .teaser { transform: translateY(-2px) scale(1.025); }
  .pub-filter-btn:hover { transform: translateY(-1px); }
}
@media (prefers-reduced-motion: no-preference) {
  .motion-reveal { animation: enter-softly 650ms cubic-bezier(.2,.65,.3,1) both; }
  @keyframes enter-softly { from { opacity: .35; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .social-icons a, .pub-filter-btn, .publications .teaser { transition: none; transform: none !important; }
}
@media (max-width: 480px) {
}
.intro-heading { margin: 60px 0 10px; }
.intro-heading h2 { margin: 0; }
.wrapper { display: flow-root; }
#site-footer { position: static !important; float: none !important; clear: both; inset: auto !important; display: block; width: 100%; box-sizing: border-box; padding: 18px 12px; }
.profile-photos { display: block; position: relative; width: 80%; max-width: 300px; margin: 0 auto; padding: 0; border: 0; background: none; cursor: pointer; line-height: 0; }
.profile-photos img { display: block; width: 100%; height: auto; border-radius: 0; }
.profile-photos .profile-alternate { position: absolute; inset: 0; height: 100%; object-fit: cover; opacity: 0; transition: opacity 280ms ease; }
.profile-photos.show-alternate .profile-alternate { opacity: 1; }
.profile-photos:focus-visible { outline: 2px solid #c47c2b; outline-offset: 4px; }

@media (prefers-reduced-motion: reduce) { .profile-photos .profile-alternate { transition: none; } }
@media print { .profile-photos .profile-alternate { display: none; } .motion-reveal { animation: none; } }

/* The small Loopy follows the pointer; images trigger a radial firework. */
.loopy-cursor { display: none; position: fixed; top: 0; left: 0; width: 28px; height: 28px; z-index: 10000; pointer-events: none; }
.loopy-cursor * { pointer-events: none; }
.loopy-character { display: block; width: 28px; height: 28px; background: url('../img/Loopy1.png') left center / auto 27px no-repeat; transform-origin: 50% 80%; }
.loopy-spark { position: absolute; left: 14px; top: 14px; width: 8px; height: 8px; border-radius: 50%; color: var(--global-theme-color, #1a3a5c); background: currentColor; box-shadow: 0 0 0 1px #fff9, 0 0 8px 2px currentColor; opacity: 0; }
.loopy-spark:nth-child(3n) { color: #c47c2b; width: 6px; height: 11px; }
.loopy-spark:nth-child(3n + 1) { color: var(--global-hover-color, #ffb81c); }
@media (hover: hover) and (pointer: fine) {
  html.loopy-active, html.loopy-active * { cursor: none !important; }
  .loopy-cursor.is-visible { display: block; }
}
@media (prefers-reduced-motion: no-preference) {

  .loopy-cursor.is-over-image .loopy-spark { animation: loopy-firework 1350ms ease-out var(--delay) infinite; }
  @keyframes loopy-wiggle { 0%, 100% { transform: rotate(-7deg) translateY(0); } 50% { transform: rotate(7deg) translateY(-3px); } }
  @keyframes loopy-firework {
    0% { opacity: 0; transform: translate(0, 0) scale(.4); }
    12%, 55% { opacity: 1; }
    100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.55); }
  }
}
@media print { .loopy-cursor { display: none !important; } }

/* Make paper links and controls visibly interactive. */
.paper-image-link { display: inline-block; border-radius: 8px; line-height: 0; }
.publications .abbr .badge { pointer-events: none; }
:is(button, a.btn, .social-icons a, #back-to-top) {
  transition: transform 180ms ease, background-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}
@media (hover: hover) and (pointer: fine) {
  :is(button, a.btn, .social-icons a, #back-to-top):hover { transform: translateY(-2px); }
  :is(button:not(.profile-photos), a.btn):hover {
    background-color: #c47c2b !important;
    color: #fff !important;
    box-shadow: 0 3px 8px rgba(26, 58, 92, .18) !important;
  }
}
:is(button, a.btn, .social-icons a, #back-to-top):active { transform: translateY(0) scale(.97); }
:is(button, a.btn, .social-icons a, .paper-image-link, #back-to-top):focus-visible {
  outline: 2px solid #c47c2b; outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
  :is(button, a.btn, .social-icons a, #back-to-top) { transition: none; transform: none !important; }
}

/* Reserve a line for social labels so they never cover profile text. */
.social-link-label {
  display: block; height: 22px; line-height: 22px; margin: 2px 0 5px;
  font-size: 13px; font-weight: 400; color: #1a3a5c; text-align: center;
  pointer-events: none;
}

/* Stable, generous targets: feedback must not move the click area. */
.publications ol.bibliography li .links a.btn {
  display: inline-flex; align-items: center; justify-content: center;
  box-sizing: border-box; min-height: 44px; min-width: 52px;
  padding: 8px 12px; line-height: 1.2; border-radius: 5px;
}
.pub-filter-btn { min-height: 44px; }
.social-icons a { width: 44px; height: 44px; line-height: 44px; }
:is(button, a.btn, .social-icons a, #back-to-top):is(:hover, :active) {
  transform: none !important;
}
:is(button:not(.profile-photos), a.btn):active {
  box-shadow: inset 0 0 0 2px rgba(26, 58, 92, .3) !important;
}