:root{color-scheme:light;--ink:#111;--quiet:#626262;--rule:#d9d9d9;--gutter:32px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:28px}
body{margin:0;background:#fff;color:var(--ink);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
a,button,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--ink);outline-offset:6px}
a:hover{text-decoration:underline;text-underline-offset:5px}
figure,p,h1,h2,h3{margin:0}
img{display:block;width:100%;height:auto}
.page-width{width:calc(100% - var(--gutter)*2);max-width:1800px;margin-inline:auto}
.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--rule);font-size:13px;letter-spacing:-.01em}
.lab-link{font-weight:600;letter-spacing:.02em}
.lab-link span{font-weight:400;margin-left:18px;letter-spacing:0}
nav{display:flex;gap:30px}
nav a{display:flex;gap:13px}
.hero{padding-top:53px}
h1{font-size:clamp(66px,12.5vw,220px);font-weight:400;letter-spacing:-.075em;line-height:.98;margin-left:-.065em}
.title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;margin:34px 0 43px}
.project-heading{min-width:0;max-width:1100px}
.project-details{margin-top:26px}
.project-details .authors{margin-top:0}
.subtitle{font-size:clamp(22px,2.1vw,34px);line-height:1.18;letter-spacing:-.035em}
.project-meta{font-size:12px;line-height:1.6;text-align:right;color:var(--quiet)}
.hero-image{aspect-ratio:1.64;object-fit:cover;object-position:50% 47%;background:#bbc5c7}
figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:13px;font-size:11px;line-height:1.4;letter-spacing:.005em}
figcaption span:first-child{color:var(--quiet)}
.introduction,.publication{display:grid;grid-template-columns:1fr 2fr;column-gap:30px}
.introduction{padding-block:110px 100px}
.eyebrow{font-size:13px;line-height:1.4;font-weight:400;letter-spacing:-.01em}
.intro-copy{max-width:880px}
.intro-copy>p:first-child{font-size:clamp(28px,3.1vw,48px);line-height:1.16;letter-spacing:-.045em}
.body-copy{font-size:17px;line-height:1.55;max-width:660px;margin-top:26px;letter-spacing:-.015em}
.image-pair{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.image-frame{aspect-ratio:1.26;overflow:hidden;background:#e8ebea}
.image-frame img{height:100%;object-fit:cover}
.image-pair figure:first-child img{object-position:50% 50%}
.image-pair figure:nth-child(2) img{object-position:50% 50%}
.carousel-viewport{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab;outline-offset:4px}
.carousel-viewport::-webkit-scrollbar{display:none}
.carousel-viewport:focus-visible{outline:2px solid var(--ink)}
.carousel-slide{position:relative;flex:0 0 100%;height:100%;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always}
.carousel-slide img{user-select:none;pointer-events:none}
.carousel-slide.shifted-view img{position:absolute;width:134.316%;height:auto;max-width:none;left:-7.895%;top:-33.156%;object-fit:fill}
.carousel-viewport.is-dragging{scroll-snap-type:none;cursor:grabbing;user-select:none}
.carousel-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px;font-size:11px}
.carousel-controls[hidden]{display:none}
.swipe-hint{color:var(--quiet)}
.swipe-hint span{margin-left:8px}
.carousel-buttons{display:flex;align-items:center;gap:10px;flex-shrink:0}
.carousel-buttons button{display:grid;place-items:center;width:32px;height:32px;background:#fff;border:1px solid var(--rule);border-radius:50%;cursor:pointer;font-size:17px;padding:0}
.carousel-buttons button:hover{border-color:var(--ink)}
.carousel-buttons button:disabled{opacity:.25;cursor:default}
.carousel-count{font-variant-numeric:tabular-nums;min-width:29px;text-align:center}
.project-video{margin-top:100px}
.video-heading{display:flex;justify-content:space-between;align-items:baseline;gap:24px;margin-bottom:22px}
.video-heading a{font-size:12px}
.video-heading a span{margin-left:12px}
.video-frame{aspect-ratio:16/9;background:#111}
.video-frame iframe{display:block;width:100%;height:100%;border:0}
.video-caption{font-size:11px;color:var(--quiet);margin-top:13px}
.press-link{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;font-size:12px;margin-top:22px;line-height:1.5}
.press-link a{text-decoration:underline;text-underline-offset:4px;white-space:nowrap}
.press-link a span{margin-left:7px}
.press-link>span{color:var(--quiet)}
.publication{margin-top:110px;padding-top:28px;border-top:1px solid var(--rule);padding-bottom:80px}
.paper-title{max-width:780px;font-size:clamp(25px,2.7vw,40px);line-height:1.18;letter-spacing:-.04em}
.authors{margin-top:28px;font-size:16px;line-height:1.65;letter-spacing:-.015em}
.publication-note{font-size:12px;color:var(--quiet);margin-top:13px}
.paper-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.citation-fallback{font-size:12px;color:var(--quiet);margin-top:24px}
.citation-fallback summary{cursor:pointer;display:inline-block}
pre{font-size:12px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:16px;color:var(--ink)}
.research{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.research>summary{list-style:none;padding:27px 0;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:24px;font-weight:400;letter-spacing:-.025em}
.research>summary::-webkit-details-marker{display:none}
.expand-mark{font-size:28px;font-weight:300;line-height:1;transition:transform .2s}
.research[open] .expand-mark{transform:rotate(45deg)}
.paper-content{max-width:820px;margin:30px auto 88px;font-family:Georgia,"Times New Roman",serif;font-size:18px;line-height:1.65;overflow-wrap:break-word}
.paper-content h2,.paper-content h3{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;letter-spacing:-.025em;line-height:1.25}
.paper-content h2{font-size:32px;margin:56px 0 22px}
.paper-content h3{font-size:25px;margin:34px 0 18px}
.paper-content p{margin:0 0 18px}
.paper-content figure{margin:38px 0}
.paper-content figcaption{display:block;font:12px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif;color:var(--quiet)}
.paper-content .equation{text-align:center;font-family:Georgia,"Times New Roman",serif;font-size:22px;padding:14px 0}
.site-footer{padding-top:32px;padding-bottom:38px;display:flex;justify-content:space-between;gap:24px;font-size:11px;line-height:1.5;margin-top:80px}
.site-footer p{color:var(--quiet)}
.skip-link{position:absolute;left:16px;top:-80px;background:#fff;padding:14px;border:1px solid;z-index:10}
.skip-link:focus{top:16px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1900px){.hero{padding-top:70px}.title-row{margin-top:45px}}
@media(max-width:900px){.image-pair figcaption{display:block}.image-pair figcaption span{display:block}.image-pair figcaption span+span{margin-top:3px}.project-meta{max-width:210px}.introduction,.publication{grid-template-columns:1fr 2.2fr}}
@media(max-width:640px){:root{--gutter:16px}.site-header{height:68px;font-size:11px}.lab-link span{margin-left:10px}nav{gap:20px}nav a{gap:8px}.hero{padding-top:38px}h1{font-size:12.3vw;letter-spacing:-.075em}.title-row{display:block;margin:25px 0 27px}.subtitle{font-size:22px;line-height:1.2}.project-meta{text-align:left;margin-top:21px;font-size:10px;line-height:1.5;max-width:none}.hero-image{aspect-ratio:1.04;object-position:58% 45%}figcaption{font-size:10px;gap:20px}figcaption span:last-child{text-align:right;max-width:180px}.introduction,.publication{display:block}.introduction{padding-block:64px 58px}.eyebrow{font-size:11px;margin-bottom:24px}.intro-copy>p:first-child{font-size:32px}.body-copy{font-size:16px;margin-top:23px}.image-pair{grid-template-columns:1fr;gap:32px}.image-pair figcaption{display:flex}.image-pair figcaption span+span{margin-top:0}.image-frame{aspect-ratio:1.25}.publication{margin-top:65px;padding-top:24px;padding-bottom:50px}.paper-title{font-size:29px}.authors{font-size:15px;margin-top:24px}.publication-note{font-size:11px;line-height:1.5}.paper-actions{font-size:13px;gap:26px;margin-top:26px}.desktop-break{display:none}.research>summary{font-size:22px;padding:23px 0}.paper-content{font-size:17px;margin:20px auto 50px}.paper-content h2{font-size:28px;margin-top:40px}.paper-content h3{font-size:23px}.site-footer{flex-wrap:wrap;justify-content:space-between;margin-top:52px;padding-top:0;gap:18px;font-size:10px}.site-footer p{order:3;flex-basis:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.expand-mark{transition:none}}
@media(max-width:640px){.project-video{margin-top:64px}.video-heading{margin-bottom:18px;gap:18px}.video-heading .eyebrow{margin-bottom:0}.video-heading a{font-size:11px}.swipe-hint{font-size:10px}.carousel-controls{gap:8px}.carousel-buttons{gap:8px}.press-link{font-size:11px}}

/* Match the shared HCIE Bootstrap buttons (css/bootstrap.css and custom-style.css).
   DOI and Video use the lab's exact colors; citation uses its orange resource color. */
.paper-actions .btn{display:inline-block;padding:3px 10px;margin-bottom:0;font-family:inherit;font-size:13px;font-weight:normal;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;touch-action:manipulation;cursor:pointer;user-select:none;background-image:none;border:0 solid transparent;border-radius:4px;text-decoration:none;color:#fff}
.paper-actions .btn-doi{background-color:#e95a44;border-color:#e95a44}
.paper-actions .btn-doi:hover,.paper-actions .btn-doi:focus{background-color:#f87560}
.paper-actions .btn-vdo{background-color:#1d5c00;border-color:#1d5c00}
.paper-actions .btn-vdo:hover,.paper-actions .btn-vdo:focus{background-color:#2f9400}
.paper-actions .btn-citation{background-color:#ff9600;border-color:#ff9600}
.paper-actions .btn-citation:hover,.paper-actions .btn-citation:focus{background-color:#ffaf3d}
.institution-logos{display:flex;align-items:center;gap:25px}
.lab-link{display:flex;align-items:center;gap:12px}
.lab-link img{width:auto;height:36px}
.lab-link span{font-size:9px;font-weight:500;line-height:1.5;letter-spacing:.08em;margin-left:0}
.mit-link{border-left:1px solid var(--rule);padding-left:24px}
.mit-link img{height:29px;width:auto}
.authors a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.authors a:hover{color:#626262}
@media(max-width:640px){.institution-logos{gap:14px}.lab-link{gap:8px}.lab-link img{height:29px}.lab-link span{font-size:7px}.mit-link{padding-left:14px}.mit-link img{height:24px}.paper-actions{gap:10px}}
@media(max-width:380px){.institution-logos{gap:10px}.mit-link{padding-left:10px}.lab-link span{display:none}}