.research-carousel .research-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
}

/* The entry reveal must not remain a transformed ancestor of a native scroller. */
.research-carousel.reveal.is-visible { transform: none; }

.research-carousel-controls { display: flex; align-items: center; gap: 8px; }
.research-carousel-controls[hidden] { display: none; }
.research-view-switch[hidden], .research-filters[hidden], .research-slide[hidden] { display: none; }
.research-carousel[data-research-view="featured"] .research-heading { grid-template-columns: minmax(0, 1fr) auto auto; }
.research-view-switch {
  display: flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: #07121c;
}
.research-view-switch button, .research-filters button {
  min-height: 44px;
  border: 0;
  background: transparent;
  color: #b0c5d4;
  font: 600 16px/1.4 var(--sans);
  cursor: pointer;
}
.research-view-switch button { padding: 8px 16px; border-radius: 3px; }
.research-view-switch button[aria-pressed="true"] { background: #183247; color: var(--white); }
.research-view-switch button:hover, .research-filters button:hover { color: var(--white); }
.research-filters { display: flex; flex-wrap: wrap; gap: 4px 24px; margin: 4px 0 14px; }
.research-filters button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  border-bottom: 2px solid transparent;
}
.research-filters button[aria-pressed="true"] { color: var(--white); border-bottom-color: var(--cyan); }
.research-filters button:not([data-research-topic="all"])::before {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #72cfff;
  content: "";
}
.research-filters button[data-research-topic="ai"]::before { background: #7edbd6; }
.research-filters button[data-research-topic="toolflow"]::before { background: #b3a4f2; }
.research-nav {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: transparent;
  color: var(--cyan);
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease, opacity 160ms ease;
}
.research-nav .arrow-icon { width: 18px; height: 18px; }
.research-nav:hover:not([aria-disabled="true"]) { border-color: var(--cyan); background: #102b3e; }
.research-nav[aria-disabled="true"] { opacity: .35; cursor: default; }

.research-track {
  position: relative;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 96px) / 3);
  gap: 16px;
  margin: 0;
  padding: 4px 0 16px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  transform: translateZ(0);
  list-style: none;
  scrollbar-width: thin;
  scrollbar-color: #316a8d transparent;
}
.research-track:focus-visible { outline-offset: 6px; }
.research-slide { display: flex; min-width: 0; scroll-snap-align: start; }
.research-card {
  --research-accent: #72cfff;
  --research-rgb: 114, 207, 255;
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 354px;
  flex: 1;
  flex-direction: column;
  padding: 0 24px 8px 0;
}
.research-card::after {
  position: absolute;
  top: 8px;
  right: 0;
  bottom: 8px;
  width: 1px;
  background: linear-gradient(transparent, var(--line) 28%, var(--line) 75%, transparent);
  content: "";
}
.research-card-systolic { --research-accent: #7edbd6; --research-rgb: 126, 219, 214; }
.research-card-hisim { --research-accent: #9aaef7; --research-rgb: 154, 174, 247; }
.research-card-claire { --research-accent: #7eb8ff; --research-rgb: 126, 184, 255; }
.research-card-insensor { --research-accent: #7adacb; --research-rgb: 122, 218, 203; }
.research-card-integration { --research-accent: #91c4f5; --research-rgb: 145, 196, 245; }
.research-card-ai { --research-accent: #7edbd6; --research-rgb: 126, 219, 214; }
.research-card-toolflow { --research-accent: #b3a4f2; --research-rgb: 179, 164, 242; }

/* Paper-specific, schematic artwork, not reproduced figures or measured data. */
.research-visual {
  position: relative;
  height: 112px;
  flex: 0 0 auto;
  margin-bottom: 18px;
  isolation: isolate;
  contain: layout paint;
  color: var(--research-accent);
  pointer-events: none;
}
.research-visual::before, .research-visual::after {
  position: absolute;
  z-index: -1;
  inset: -6px 0;
  content: "";
}
.research-visual::before {
  background: radial-gradient(ellipse at 52% 55%, rgba(var(--research-rgb), .09), transparent 67%);
  opacity: .6;
  transition: opacity 250ms ease;
}
.research-visual::after {
  background-image: radial-gradient(rgba(var(--research-rgb), .2) .65px, transparent .85px);
  background-size: 12px 12px;
  mask-image: radial-gradient(ellipse at center, #000, transparent 73%);
}
.research-visual svg { display: block; width: 100%; height: 100%; overflow: visible; stroke: currentColor; stroke-width: 1; }
.research-visual .diagram-faint { opacity: .25; }
.research-visual .diagram-surface { fill: #091723; stroke-opacity: .45; }
.research-visual .diagram-top { fill: #102738; stroke-opacity: .85; }
.research-visual .diagram-grid { stroke-opacity: .45; }
.research-visual .diagram-vias { stroke-dasharray: 2 4; stroke-opacity: .55; }
.research-visual .diagram-signal { stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.research-visual .diagram-node { fill: currentColor; stroke: none; }
.research-visual .diagram-terminal { fill: var(--black-2); stroke-opacity: .55; }
/* Keep the artwork still as papers pass beneath the mouse during scrolling. */

.research-card-meta {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 0 0 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  font-family: var(--mono);
  font-size: 16px;
  letter-spacing: .015em;
  line-height: 1.5;
}
.research-card-meta::before {
  position: absolute;
  top: -1px;
  left: 0;
  width: 36px;
  height: 2px;
  background: var(--research-accent);
  content: "";
  transform-origin: left;
  transition: transform 300ms ease;
}
.research-card:is(:hover, :focus-within) .research-card-meta::before { transform: scaleX(2); }
.research-card-meta > span { color: var(--research-accent); }
.research-card-meta > time { padding-left: 16px; border-left: 1px solid var(--line-strong); color: #b0c5d4; }
.research-card h4 {
  margin: 0 0 20px;
  color: #bdccd7;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -.018em;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.research-title-name { color: var(--white); font-weight: 650; }
.research-card-link {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-block: 8px;
  color: var(--research-accent);
  font-size: 16px;
  font-weight: 650;
  line-height: 1.3;
}
.research-card-link .arrow-icon { width: 18px; height: 18px; margin-right: 3px; transition: transform 160ms ease; }
.research-card-link:hover { color: var(--white); }
.research-card-link:hover .arrow-icon { transform: translate(2px, -2px); }

/* One publication list, two presentations. Without JS, all papers remain readable. */
.research-carousel[data-research-view="all"] .research-track {
  grid-auto-flow: row;
  grid-auto-columns: auto;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 40px;
  padding: 0;
  overflow: visible;
  scroll-snap-type: none;
  transform: none;
}
.research-carousel[data-research-view="all"] .research-slide { scroll-snap-align: none; }
.research-carousel[data-research-view="all"] .research-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-content: start;
  align-items: center;
  min-height: 0;
  padding: 14px 0 22px 18px;
  border-top: 1px solid var(--line);
}
.research-carousel[data-research-view="all"] .research-card::before {
  position: absolute;
  top: 25px;
  left: 0;
  width: 2px;
  height: 22px;
  background: var(--research-accent);
  content: "";
}
.research-carousel[data-research-view="all"] .research-card::after,
.research-carousel[data-research-view="all"] .research-visual,
.research-carousel[data-research-view="all"] .research-card-meta::before { display: none; }
.research-carousel[data-research-view="all"] .research-card-meta {
  grid-column: 1;
  grid-row: 1;
  min-height: 44px;
  gap: 4px 12px;
  margin: 0;
  padding: 0;
  border: 0;
}
.research-carousel[data-research-view="all"] .research-card-meta > time { padding-left: 12px; }
.research-carousel[data-research-view="all"] .research-card h4 { grid-column: 1 / -1; grid-row: 2; margin: 0; font-size: 20px; }
.research-carousel[data-research-view="all"] .research-card-link { grid-column: 2; grid-row: 1; justify-content: end; gap: 8px; margin: 0; white-space: nowrap; }
.research-card-meta .research-accepted { color: #c0d2db; font-family: var(--sans); }
.research-availability, .research-award { grid-column: 1 / -1; margin: 4px 0 0; font-size: 16px; line-height: 1.5; }
.research-availability { color: #a7bbc9; }
.research-award { color: #d4c299; }

@media (max-width: 1100px) {
  .research-track { grid-auto-columns: calc((100% - 64px) / 2); }
}

@media (max-width: 900px) {
  .research-carousel[data-research-view="all"] .research-track { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 680px) {
  .research-carousel .research-heading { margin-bottom: 12px; }
  .research-carousel[data-research-view] .research-heading { grid-template-columns: minmax(0, 1fr) auto; gap: 12px 8px; }
  .research-carousel[data-research-view] .research-heading h3 { grid-column: 1 / -1; }
  .research-view-switch { justify-self: start; gap: 0; padding: 3px; }
  .research-view-switch button { padding-inline: 11px; }
  .research-carousel-controls { gap: 6px; }
  .research-filters { gap: 4px 20px; margin-bottom: 12px; }
  .research-track { grid-auto-columns: calc(100% - 40px); }
  .research-card { min-height: 354px; padding-right: 20px; }
  .research-visual { height: 96px; margin-bottom: 14px; }
  .research-card h4 { font-size: 20px; }
  .research-carousel[data-research-view="all"] .research-card { column-gap: 8px; padding-left: 14px; }
  /* Smaller type for the compact mobile list; keep full-size tap targets. */
  .research-carousel[data-research-view="all"] .research-filters button { font-size: 14px; }
  .research-carousel[data-research-view="all"] .research-card h4 { font-size: 17px; line-height: 1.4; }
  .research-carousel[data-research-view="all"] .research-card-meta { gap: 4px 8px; font-size: 13px; }
  .research-carousel[data-research-view="all"] .research-card-meta > time { padding-left: 8px; }
  .research-carousel[data-research-view="all"] .research-card-link { font-size: 14px; }
  .research-carousel[data-research-view="all"] .research-card-link .arrow-icon { width: 16px; height: 16px; }
}

@media (max-width: 380px) {
  .research-view-switch button { padding-inline: 7px; white-space: nowrap; }
  .research-carousel[data-research-view="all"] .research-card { grid-template-columns: minmax(0, 1fr); }
  .research-carousel[data-research-view="all"] .research-card-meta { min-height: 44px; }
  .research-carousel[data-research-view="all"] .research-card-link { grid-column: 1; grid-row: auto; justify-content: start; }
}

@media (prefers-reduced-motion: reduce) {
  /* The global .01ms duration creates one-frame border/size flashes on view
     changes. Reduced-motion publication layouts must switch immediately. */
  .research-carousel, .research-carousel *,
  .research-carousel *::before, .research-carousel *::after { transition: none !important; }
  .research-card:is(:hover, :focus-within) .diagram-lift { transform: none; }
  .research-visual::before, .research-visual .diagram-lift,
  .research-card-meta::before, .research-card-link .arrow-icon { transition: none; }
}