/*
  Compatibility layer for the runtime JSON architecture.
  The editorial visual language is inherited from the reference design;
  this file only maps newer runtime-rendered components to that system.
*/

/* Runtime states */
.runtime-loading,
.runtime-error,
.runtime-empty{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:120px;
  padding:28px;
  border:1px solid var(--line, #d9ddde);
  color:var(--muted, #68737d);
  background:var(--paper-soft, #f4f6f6);
  font-size:13px;
  text-align:center;
}
.runtime-error{border-color:#d8b2b0;color:#8b3538;background:#fbf4f3}

/* Homepage runtime gallery/news parity */
.news-showcase{
  --news-showcase-height:clamp(535px,46vw,610px);
  align-items:stretch;
}
.activity-panel,.updates-panel{
  min-width:0;
  height:var(--news-showcase-height);
  display:flex;
  flex-direction:column;
}
.highlight-slider{display:flex;flex:1;min-height:0;flex-direction:column}
.highlight-viewport{position:relative;flex:1;min-height:0;overflow:hidden}
.highlight-slide{height:100%}
.highlight-slide img{width:100%;height:100%;object-fit:cover}
.highlight-controls{flex:0 0 34px}
.home-news-list[data-runtime-home-news]{
  display:grid;
  grid-template-rows:repeat(5,minmax(0,1fr));
  flex:1;
  min-height:0;
  overflow:hidden;
  border-top:1px solid var(--line, #d9ddde);
}
.home-news-item{
  min-height:0;
  overflow:hidden;
}
.home-news-item>a,
a.home-news-item{
  display:flex;
  min-height:0;
  height:100%;
  flex-direction:column;
  justify-content:center;
  color:inherit;
}
.home-news-item h3{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.home-news-item p{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}

/* Current three-direction homepage structure */
.research-focus-list{border-top:1px solid var(--line, #d9ddde)}
.research-focus-item{
  display:grid;
  grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr);
  gap:clamp(34px,5vw,76px);
  align-items:center;
  padding:48px 0;
  border-bottom:1px solid var(--line, #d9ddde);
}
.research-focus-item:nth-child(even) .research-focus-figure{order:2}
.research-focus-figure{display:block;overflow:hidden;background:var(--paper-soft,#f1f3f3)}
.research-focus-figure img{width:100%;aspect-ratio:16/10;object-fit:contain;transition:transform .35s ease}
.research-focus-figure:hover img{transform:scale(1.018)}
.research-focus-copy{max-width:720px}
.research-focus-head{display:grid;grid-template-columns:42px 1fr;gap:18px;align-items:start}
.research-focus-head>span{padding-top:7px;color:var(--red,#a13e43);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;letter-spacing:.1em}
.research-focus-head h3{margin:0;font-family:var(--serif,Georgia,serif);font-size:clamp(27px,3vw,39px);font-weight:600;line-height:1.15}
.research-focus-copy>p{margin:18px 0 22px;color:var(--text,#33465a);line-height:1.75}
.research-focus-questions{margin:0 0 24px;padding:0;list-style:none;border-top:1px solid var(--line,#d9ddde)}
.research-focus-questions li{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid var(--line,#d9ddde);font-size:14px;line-height:1.45}
.research-focus-questions li span{color:var(--red,#a13e43);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px}

/* Runtime publications */
[data-runtime-publications-list] .publication,
[data-runtime-direction-publications] .direction-publication-card{
  animation:none;
}
.publication-result-count{color:var(--muted,#68737d);font-size:13px}
.publication-empty{padding:40px 0;border-top:1px solid var(--line,#d9ddde);color:var(--muted,#68737d)}

/* Direction publication portfolio rendered from JSON */
.direction-publications-grid{display:grid;gap:24px}
.direction-publication-card{
  display:grid;
  grid-template-columns:minmax(220px,31%) minmax(0,1fr);
  gap:28px;
  padding:24px 0;
  border-top:1px solid var(--line,#d9ddde);
}
.direction-publication-card:last-child{border-bottom:1px solid var(--line,#d9ddde)}
.direction-publication-figure{overflow:hidden;background:var(--paper-soft,#f1f3f3)}
.direction-publication-figure img{width:100%;height:100%;min-height:180px;object-fit:contain}
.direction-publication-content h3{margin:7px 0 10px;font-family:var(--serif,Georgia,serif);font-size:22px;line-height:1.3;font-weight:600}
.direction-publication-authors,.direction-publication-venue,.direction-publication-abstract{margin:7px 0;color:var(--text,#33465a);font-size:13px;line-height:1.58}
.direction-publication-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}

/* Runtime people structure (schema v2) */
.people-runtime-root{min-height:160px}
.people-group-section{padding:56px 0;border-top:1px solid var(--line,#d9ddde)}
.people-group-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:30px}
.people-group-heading h2{margin:0;font-family:var(--serif,Georgia,serif);font-size:clamp(27px,3vw,38px);font-weight:600}
.people-group-count{color:var(--red,#a13e43);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}
.people-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 28px}
.person{min-width:0}
.person-photo{position:relative;overflow:hidden;background:#eef1f1;aspect-ratio:4/5}
.person-photo img{width:100%;height:100%;object-fit:contain;object-position:center bottom;transition:transform .3s ease}
.person:hover .person-photo img{transform:scale(1.018)}
.person-body{padding:16px 0 0;border-top:3px solid var(--ink,#13283f)}
.person h3{margin:0;font-family:var(--serif,Georgia,serif);font-size:21px;line-height:1.25;font-weight:600}
.person-role{margin:4px 0;color:var(--red,#a13e43);font-size:11px;font-weight:750;letter-spacing:.06em;text-transform:uppercase}
.person-bio{margin:8px 0;color:var(--text,#33465a);font-size:13px;line-height:1.55}
.person-keywords{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.person-keywords span,.research-tag{padding:4px 8px;border:1px solid var(--line,#d9ddde);color:var(--muted,#68737d);font-size:10px;line-height:1.2}

/* News list links and static detail pages */
.news-row-link{display:grid;color:inherit}
.news-row-link:hover h2,.news-row-link:hover h3{color:var(--red,#a13e43)}
.news-detail-article{max-width:900px;margin:0 auto}
.news-detail-body{font-family:var(--serif,Georgia,serif);font-size:18px;line-height:1.85}
.news-detail-body h2{margin:48px 0 14px;font-size:30px;line-height:1.25}
.news-detail-body figure{margin:38px 0}
.news-detail-body figcaption{margin-top:10px;color:var(--muted,#68737d);font-family:var(--sans,Arial,sans-serif);font-size:12px}

/* Gallery runtime */
.gallery-item{scroll-margin-top:120px}
.gallery-item img{width:100%;aspect-ratio:4/3;object-fit:cover}

@media(max-width:980px){
  .research-focus-item{grid-template-columns:1fr;gap:26px}
  .research-focus-item:nth-child(even) .research-focus-figure{order:0}
  .people-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .direction-publication-card{grid-template-columns:220px minmax(0,1fr)}
}
@media(max-width:720px){
  .news-showcase{--news-showcase-height:auto;grid-template-columns:1fr}
  .activity-panel,.updates-panel{height:auto}
  .highlight-viewport{aspect-ratio:4/3;min-height:0}
  .home-news-list[data-runtime-home-news]{display:block;overflow:visible}
  .home-news-item{min-height:132px}
  .people-grid{grid-template-columns:1fr 1fr;gap:28px 14px}
  .direction-publication-card{grid-template-columns:1fr}
  .direction-publication-figure img{min-height:0;aspect-ratio:16/9}
}
@media(max-width:480px){
  .people-grid{grid-template-columns:1fr}
}

/* Home research overview: explicit aligned table structure. */
.research-at-glance .research-at-glance-heading{
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  align-items:end;
  gap:16px;
  padding-bottom:14px;
  border-bottom:0;
}
.research-at-glance .research-at-glance-heading span{
  margin:0;
  padding-bottom:3px;
  font-size:10px;
  line-height:1.2;
  letter-spacing:.13em;
  text-align:left;
}
.research-at-glance .research-at-glance-heading h2{
  margin:0;
  color:#fff;
  font-size:24px;
  line-height:1.15;
  text-align:left;
}
.research-map{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1fr;
  margin-top:2px;
  border:1px solid rgba(255,255,255,.22);
  border-bottom:0;
}
.research-map-row{
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 24px;
  align-items:center;
  gap:12px;
  min-height:62px;
  padding:10px 14px;
  border-bottom:1px solid rgba(255,255,255,.22);
  color:#fff;
  text-decoration:none;
  transition:background-color .18s ease,color .18s ease;
}
.research-map-row:hover,
.research-map-row:focus-visible{
  color:#fff;
  background:rgba(255,255,255,.08);
}
.research-map-row .profile-index{
  display:flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  margin:0;
  border:1px solid rgba(255,255,255,.28);
  color:#ffabb0;
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:12px;
  font-weight:750;
  line-height:1;
}
.research-map-title{
  min-width:0;
  color:#fff;
  font-size:14px;
  font-weight:650;
  line-height:1.42;
  letter-spacing:.01em;
}
.research-map-arrow{
  color:#8fe1e5;
  font-size:18px;
  line-height:1;
  text-align:right;
}
.research-map-axis{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:16px;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(2,24,43,.22);
}
.research-map-axis span{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  min-height:44px;
  padding:9px 5px;
  border-right:1px solid rgba(255,255,255,.22);
  color:#dcecf2;
  font-size:12px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:.08em;
  text-align:center;
}
.research-map-axis span:last-child{border-right:0}
.research-map-axis span:not(:last-child)::after{
  content:"›";
  position:absolute;
  right:-7px;
  top:50%;
  z-index:2;
  display:grid;
  place-items:center;
  width:13px;
  height:18px;
  transform:translateY(-50%);
  color:#7edbe0;
  background:#0c456f;
  font-size:15px;
  line-height:1;
}

@media(max-width:720px){
  .research-at-glance .research-at-glance-heading{
    grid-template-columns:1fr;
    gap:4px;
  }
  .research-map-row{
    grid-template-columns:42px minmax(0,1fr) 20px;
    gap:9px;
    min-height:58px;
    padding:9px 11px;
  }
  .research-map-row .profile-index{width:30px;height:30px;font-size:11px}
  .research-map-title{font-size:13px}
  .research-map-axis span{min-height:40px;font-size:11px;letter-spacing:.04em}
}

/* Refined home research overview: light editorial grouping, not a table. */
.research-at-glance{
  color:var(--text);
  background:rgba(255,255,255,.94);
  border:1px solid rgba(8,47,80,.10);
  border-top:3px solid var(--brand-blue);
  box-shadow:0 18px 42px rgba(8,47,80,.09);
  padding:27px 30px 25px;
}
.research-at-glance::after{display:none}
.research-at-glance .research-at-glance-heading{
  display:block;
  padding:0 0 15px;
  border-bottom:1px solid rgba(8,47,80,.12);
}
.research-at-glance .research-at-glance-heading h2{
  margin:0;
  color:var(--brand-navy);
  font-family:var(--serif);
  font-size:24px;
  font-weight:720;
  line-height:1.2;
  text-align:left;
}
.research-map{
  display:grid;
  gap:0;
  margin-top:4px;
  border:0;
  background:transparent;
}
.research-map-row{
  position:relative;
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 22px;
  align-items:center;
  gap:10px;
  min-height:58px;
  padding:10px 2px;
  border:0;
  border-bottom:1px solid rgba(8,47,80,.10);
  color:var(--brand-navy);
  background:transparent;
  text-decoration:none;
  transition:padding-left .18s ease,background-color .18s ease;
}
.research-map-row::before{
  content:"";
  position:absolute;
  left:-30px;
  top:15px;
  bottom:15px;
  width:2px;
  background:var(--brand-blue);
  opacity:0;
  transition:opacity .18s ease;
}
.research-map-row--neurosymbolic::before{background:var(--brand-cyan)}
.research-map-row--control::before{background:var(--brand-red)}
.research-map-row:hover,
.research-map-row:focus-visible{
  color:var(--brand-navy);
  background:rgba(8,47,80,.025);
  padding-left:8px;
}
.research-map-row:hover::before,
.research-map-row:focus-visible::before{opacity:1}
.research-map-row .profile-index{
  display:block;
  width:auto;
  height:auto;
  margin:0;
  border:0;
  color:var(--brand-blue);
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:11px;
  font-weight:800;
  line-height:1;
  letter-spacing:.08em;
}
.research-map-row--neurosymbolic .profile-index{color:#238d96}
.research-map-row--control .profile-index{color:var(--brand-red)}
.research-map-title{
  color:var(--brand-navy);
  font-size:14px;
  font-weight:650;
  line-height:1.42;
}
.research-map-arrow{
  color:rgba(8,47,80,.48);
  font-size:17px;
  text-align:right;
}
.research-map-axis{
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  margin-top:21px;
  padding-top:17px;
  border:0;
  background:transparent;
}
.research-map-axis::before{
  content:"";
  position:absolute;
  left:7%;
  right:7%;
  top:7px;
  height:1px;
  background:linear-gradient(90deg,rgba(29,93,171,.28),rgba(35,141,150,.32),rgba(190,54,61,.28));
}
.research-map-axis span{
  position:relative;
  display:block;
  min-height:0;
  padding:0 4px;
  border:0;
  color:#536675;
  font-size:11px;
  font-weight:700;
  line-height:1.3;
  letter-spacing:.08em;
  text-align:center;
}
.research-map-axis span::before{
  content:"";
  position:absolute;
  left:50%;
  top:-14px;
  width:7px;
  height:7px;
  transform:translateX(-50%);
  border:2px solid #fff;
  border-radius:50%;
  background:var(--brand-blue);
  box-shadow:0 0 0 1px rgba(29,93,171,.25);
}
.research-map-axis span:nth-child(2)::before,
.research-map-axis span:nth-child(3)::before{background:#238d96}
.research-map-axis span:nth-child(4)::before{background:var(--brand-red)}
.research-map-axis span:not(:last-child)::after{display:none}

@media(max-width:720px){
  .research-at-glance{padding:23px 20px 22px}
  .research-at-glance .research-at-glance-heading{padding-bottom:12px}
  .research-at-glance .research-at-glance-heading h2{font-size:22px}
  .research-map-row{
    grid-template-columns:38px minmax(0,1fr) 18px;
    min-height:55px;
    padding:9px 0;
  }
  .research-map-row::before{left:-20px}
  .research-map-row:hover,.research-map-row:focus-visible{padding-left:5px}
  .research-map-title{font-size:13px}
  .research-map-axis{margin-top:19px;padding-top:16px}
  .research-map-axis span{font-size:10px;letter-spacing:.04em}
}

/* Teaching page: same editorial system and true runtime JSON source. */
.course-hero .runtime-loading,
.course-summary-section .runtime-loading,
.course-outline-section .runtime-loading{
  grid-column:1 / -1;
}
.course-summary-section{
  padding-top:36px;
  padding-bottom:20px;
  background:#fff;
}
.course-facts{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border-top:1px solid var(--rule,#d7e0e4);
  border-bottom:1px solid var(--rule,#d7e0e4);
  background:transparent;
  box-shadow:none;
}
.course-fact{
  min-width:0;
  margin:0;
  padding:20px 24px 19px;
  border:0;
  border-right:1px solid var(--rule,#d7e0e4);
  color:var(--text,#314550);
  background:transparent;
}
.course-fact:first-child{padding-left:0}
.course-fact:last-child{padding-right:0;border-right:0}
.course-fact span{
  display:block;
  color:var(--muted,#667781);
  font-size:10px;
  font-weight:800;
  line-height:1.3;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.course-fact strong{
  display:block;
  margin-top:7px;
  color:var(--navy,#10364d);
  font-family:var(--serif,Georgia,serif);
  font-size:18px;
  font-weight:650;
  line-height:1.35;
}
.course-outline-section{padding-top:54px}
.course-outline-heading{margin-bottom:28px}
.lecture-list{
  border-top:2px solid var(--navy,#10364d);
  background:transparent;
}
.lecture-list .lecture{
  display:grid;
  grid-template-columns:52px minmax(210px,270px) minmax(250px,1fr) minmax(205px,230px);
  gap:24px;
  align-items:start;
  margin:0;
  padding:24px 0;
  border:0;
  border-bottom:1px solid var(--rule,#d7e0e4);
  background:transparent;
  transform:none;
}
.lecture-list .lecture:hover{
  background:linear-gradient(90deg,rgba(35,106,154,.045),transparent 72%);
  transform:none;
}
.lecture-number{
  padding-top:1px;
  color:var(--red,#c94d3f);
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:12px;
  font-weight:800;
  line-height:1.4;
  letter-spacing:.08em;
}
.lecture-list .lecture h3{
  margin:0;
  color:var(--navy,#10364d);
  font-family:var(--serif,Georgia,serif);
  font-size:19px;
  font-weight:650;
  line-height:1.35;
}
.lecture-list .lecture p{
  margin:0;
  color:var(--text,#314550);
  font-size:14px;
  line-height:1.65;
}
.lecture-materials{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  min-width:0;
  border-top:1px solid var(--rule,#d7e0e4);
}
.course-material-link{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 16px;
  align-items:center;
  gap:10px;
  min-height:42px;
  padding:9px 0;
  border:0;
  border-bottom:1px solid var(--rule,#d7e0e4);
  background:transparent;
  color:var(--navy,#10364d);
  font-size:12px;
  font-weight:700;
  line-height:1.35;
  text-decoration:none;
  transition:color .18s ease,padding-left .18s ease,background .18s ease;
}
.course-material-link:hover,
.course-material-link:focus-visible{
  padding-left:7px;
  border-color:var(--rule,#d7e0e4);
  background:rgba(8,123,120,.04);
  color:var(--teal,#087b78);
  transform:none;
}
.course-material-kind{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  min-height:0;
  border:0;
  color:var(--red,#c94d3f);
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:9px;
  font-weight:850;
  letter-spacing:.08em;
}
.course-material-arrow{
  color:var(--teal,#087b78);
  font-size:14px;
  line-height:1;
  text-align:right;
}

@media(max-width:1050px){
  .lecture-list .lecture{
    grid-template-columns:46px minmax(190px,230px) minmax(220px,1fr);
  }
  .lecture-materials{
    grid-column:2 / 4;
    grid-template-columns:repeat(2,minmax(0,210px));
    gap:22px;
    border-top:0;
  }
  .course-material-link{border-top:1px solid var(--rule,#d7e0e4)}
}
@media(max-width:720px){
  .course-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .course-fact{padding:17px 18px}
  .course-fact:first-child{padding-left:0}
  .course-fact:nth-child(2){padding-right:0;border-right:0}
  .course-fact:nth-child(-n+2){border-bottom:1px solid var(--rule,#d7e0e4)}
  .course-fact:nth-child(3){padding-left:0}
  .course-fact:last-child{padding-right:0}
  .lecture-list .lecture{
    grid-template-columns:38px minmax(0,1fr);
    gap:10px 14px;
    padding:21px 0;
  }
  .lecture-list .lecture h3,
  .lecture-list .lecture p,
  .lecture-materials{grid-column:2}
  .lecture-materials{grid-template-columns:1fr;gap:0;margin-top:5px}
}
