/* Reuse the homepage's material tokens and optical/motion vocabulary. */
@import url("../liquid-glass.css?v=6");

:is(.project-command,.copy-button,.project-nav .icon-button),
.project-template :is(.publication-links .button,.slider-navigation-previous,.slider-navigation-next) {
  background:var(--lg-solid);
  background-image:var(--lg-sheen);
  border-color:transparent;
  color:var(--ink);
  box-shadow:inset 0 1px 1px var(--lg-rim),inset 0 -1px 1px var(--lg-bottom),var(--lg-shadow);
  transition:background-color var(--lg-theme-time) ease,color var(--lg-theme-time) ease,
    box-shadow 220ms ease,transform 220ms var(--lg-ease);
}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  :is(.project-command,.copy-button,.project-nav .icon-button),
  .project-template :is(.publication-links .button,.slider-navigation-previous,.slider-navigation-next) {
    background-color:var(--lg-tint);
    -webkit-backdrop-filter:blur(14px) saturate(135%);
    backdrop-filter:blur(14px) saturate(135%);
  }
}
.project-hero .project-actions .project-command {
  transition:background-color var(--lg-theme-time) ease,color var(--lg-theme-time) ease,
    box-shadow 220ms ease,transform 220ms var(--lg-ease);
}
.project-hero .project-actions .project-command:active {transition-duration:80ms}
.project-command.primary {
  background-color:#0071e3;
  background-image:linear-gradient(165deg,rgba(255,255,255,.28),transparent 55%,rgba(1,44,115,.16));
  color:#fff;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.65),inset 0 -1px 1px rgba(0,53,145,.4),0 8px 20px -12px rgba(0,79,180,.65);
}
/* A legible, thicker material for citation text; research pixels stay unfiltered. */
pre {
  background:var(--lg-solid);
  background-image:var(--lg-sheen);
  border-color:transparent;
  box-shadow:inset 0 1px 1px var(--lg-rim),inset 0 -1px 1px var(--lg-bottom),var(--lg-card-shadow);
}
.research-image,.qualitative-panel,
.project-template :is(.results-carousel img,.teaser video,.results-carousel video,.publication-video) {
  background-color:#fff;
  border-color:rgba(255,255,255,.8);
  box-shadow:0 1px 2px rgba(45,65,90,.09),0 12px 30px -12px rgba(45,65,90,.29),0 0 0 4px rgba(255,255,255,.3);
}
html[data-theme=dark] :is(.research-image,.qualitative-panel),
html.project-template[data-theme=dark] :is(.results-carousel img,.teaser video,.results-carousel video,.publication-video) {
  border-color:rgba(255,255,255,.65);
  box-shadow:0 2px 5px rgba(0,0,0,.25),0 14px 32px -12px rgba(0,0,0,.55),0 0 0 4px rgba(255,255,255,.08);
}
.project-hero,.project-band,pre,.project-template :is(body,.hero,.footer,#BibTeX) {
  transition:background-color var(--lg-theme-time) ease,color var(--lg-theme-time) ease,
    border-color var(--lg-theme-time) ease,box-shadow var(--lg-theme-time) ease;
}
.author-line,.author-line a,.affiliations p,.affiliations sup,.eyebrow,.section-label,
.corresponding,.abstract-copy,.project-band h2,figcaption,.project-notice {
  transition:color var(--lg-theme-time) ease;
}
.project-command svg,.copy-button svg,.project-nav a svg {
  transition:transform 220ms var(--lg-ease);
}
@media(hover:hover) and (pointer:fine){
  :is(.project-command,.copy-button,.project-nav .icon-button):hover,
  .project-template :is(.publication-links .button,.slider-navigation-previous,.slider-navigation-next):hover {
    background-color:var(--surface);
    color:var(--blue);
    box-shadow:inset 0 1px 1px var(--lg-rim),inset 0 -1px 1px var(--lg-bottom),0 8px 24px -10px rgba(39,63,92,.3);
    text-decoration:none;
    transform:translateY(-2px);
  }
  .project-command.primary:hover {background-color:#0077ed;color:#fff}
  .project-command:hover svg {transform:translateX(2px)}
  .project-nav a:hover svg {transform:translateX(-2px)}
}
:is(.project-command,.copy-button,.project-nav .icon-button):active,
.project-template .publication-links .button:active {
  transform:scale(.97);
  filter:none;
  transition-duration:80ms;
}
.copy-button.is-copied {
  color:var(--blue);
  box-shadow:inset 0 1px 1px var(--lg-rim),0 0 0 4px color-mix(in srgb,var(--blue) 10%,transparent),var(--lg-shadow);
}
@media(min-width:761px){
  html[data-refraction=on] .project-nav .icon-button {
    -webkit-backdrop-filter:blur(1px) url("#lg-circle") saturate(135%);
    backdrop-filter:blur(1px) url("#lg-circle") saturate(135%);
  }
}
@media(prefers-reduced-motion:reduce){
  html {scroll-behavior:auto!important}
  *,*::before,*::after {transition:none!important}
  :is(.project-command,.copy-button,.project-nav .icon-button):is(:hover,:active),
  .project-command svg,.copy-button svg,.project-nav a svg,
  .project-template :is(.publication-links .button,.slider-navigation-previous,.slider-navigation-next):is(:hover,:active) {transform:none!important}
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){
  :is(.project-command,.copy-button,.project-nav .icon-button),pre,
  .project-template :is(.publication-links .button,.slider-navigation-previous,.slider-navigation-next) {
    background-color:var(--lg-solid);background-image:none;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  }
  .project-command.primary {background:#0071e3;color:#fff}
}
@media(prefers-contrast:more){
  :is(.project-command,.copy-button,.project-nav .icon-button),
  .project-template :is(.publication-links .button,.slider-navigation-previous,.slider-navigation-next) {outline:1px solid var(--ink)}
}

/* Template palette only: keep Bulma's fonts, spacing and carousel geometry. */
html.project-template {
  --bg: #f5f5f7;
  --surface: #ffffff;
  --ink: #1d1d1f;
  --muted: #68686d;
  --blue: #0066cc;
  --line: #dedee3;
  color-scheme: light;
  background: var(--surface);
}

html.project-template[data-theme="dark"] {
  --bg: #111113;
  --surface: #1d1d20;
  --ink: #f5f5f7;
  --muted: #ababaf;
  --blue: #75baff;
  --line: #37373c;
  color-scheme: dark;
}

html.project-template body,
html.project-template .hero,
html.project-template #BibTeX {
  background-color: var(--surface);
  color: var(--muted);
}

html.project-template .hero.is-light,
html.project-template .footer {
  background-color: var(--bg);
  color: var(--muted);
}

html.project-template .title,
html.project-template .content :is(h1, h2, h3, h4, h5, h6),
html.project-template .hero.is-light .title,
html.project-template strong,
html.project-template .publication-authors,
html.project-template .footer .icon-link {
  color: var(--ink);
}

html.project-template .subtitle,
html.project-template .hero.is-light .subtitle,
html.project-template .publication-venue,
html.project-template .eql-cntrb {
  color: var(--muted);
}

html.project-template a {
  color: var(--blue);
}

/* The original author-link declaration uses !important. */
html.project-template .publication-authors a {
  color: var(--blue) !important;
}

html.project-template .publication-links .button.is-dark {
  color: var(--blue);
}

html.project-template pre,
html.project-template pre code {
  color: var(--ink);
}

html.project-template .slider-pagination .slider-page {
  background-color: var(--muted);
  box-shadow: 0 1px 3px rgb(29 29 31 / 12%);
  transition: background-color 180ms ease, box-shadow 180ms ease, transform 240ms ease;
}

html.project-template .slider-pagination .slider-page.is-active {
  background-color: var(--blue);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 12%, transparent);
}

html.project-template :is(a, button, .slider-page):focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
  html.project-template .slider-pagination .slider-page {
    transition: none;
  }
}

@media(prefers-reduced-motion:reduce){
  /* Bulma needs transitionend to finish each carousel step. */
  html.project-template .slider-container {transition:transform 1ms linear!important}
}
