/* Section layout below the hero. Hero and publication block keep flight.css/home.css; colours reuse their tokens. */
.ax-section{padding:104px var(--gutter);background:var(--paper)}
.ax-section+.ax-section:not(.ax-dark){border-top:1px solid var(--line)}
.ax-dark{background:var(--night);color:#e6ebea}
.ax-dark+.ax-section{border-top:0}
.ax-wrap{max-width:1080px;margin:0 auto}
.ax-section h2{font-size:clamp(30px,3.1vw,44px);letter-spacing:-.045em;line-height:1.12;font-weight:600;margin-bottom:18px}
.ax-section h2:before{content:'';display:block;width:56px;height:4px;border-radius:2px;background:var(--lab-gradient);margin-bottom:22px}
.ax-lead{font-size:18px;line-height:1.7;color:var(--subtle);max-width:820px}
.ax-dark .ax-lead{color:#afbdc4}
.ax-sub{font-size:22px;font-weight:600;letter-spacing:-.03em;margin:64px 0 16px}
.ax-section p{max-width:820px}

/* media */
.ax-media{margin:0}
.ax-media video{display:block;width:100%;height:auto;border-radius:10px;background:#0b151b}
.ax-media figcaption,.ax-figure figcaption{font-size:var(--text-min);color:var(--subtle);margin-top:10px;line-height:1.55}
.ax-wide{margin-top:40px}
.ax-wide video{aspect-ratio:16/9;box-shadow:0 18px 50px #10202a26}
.ax-figure{margin:40px 0 0}
.ax-figure img{width:100%;height:auto;border-radius:10px}
.ax-white img{background:#fff;padding:18px;border:1px solid var(--line)}
.ax-dark .ax-white img{border-color:#ffffff22}

/* method: View / Probe pair and the loop rail */
.mx-title{font-size:24px;font-weight:600;letter-spacing:-.03em;margin:80px 0 10px}
.mx-intro{color:#afbdc4;line-height:1.7}
.mx-pair{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:30px}
.mx-tool{border-radius:14px;padding:26px 26px 26px;background:#16262f;border:1px solid #ffffff14;border-top:4px solid var(--accent);display:flex;flex-direction:column}
.mx-view{--accent:var(--view)}
.mx-probe{--accent:var(--probe)}
.mx-tag{font-size:var(--text-min);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.mx-tool h4{font-size:22px;font-weight:600;letter-spacing:-.03em;margin:8px 0 10px;color:#fff}
.mx-tool p:not(.mx-tag){color:#c3cfd4;line-height:1.7;flex:1}
.mx-tool .ax-media{margin-top:20px}
.mx-loop{margin-top:30px}
.mx-loop video{box-shadow:0 18px 50px #0006}
.mx-rail{list-style:none;margin:14px 0 0;padding:0;display:flex;gap:6px}
.mx-rail li{flex:var(--w) 1 0;min-width:0;--c:#5d6f77}
.mx-rail li.v{--c:var(--view)}
.mx-rail li.p{--c:var(--probe)}
.mx-rail li.ok{--c:var(--lab-teal)}
.mx-rail li.go{--c:var(--lab-blue)}
.mx-rail li.go a{border-top-style:dashed;background:#5697d81f}
.mx-rail button,.mx-rail a{all:unset;box-sizing:border-box;cursor:pointer;display:block;width:100%;padding:12px 12px 10px;border-top:4px solid var(--c);background:#ffffff08;border-radius:0 0 8px 8px;color:#c3cfd4;transition:background .15s}
.mx-rail button:hover,.mx-rail button:focus-visible,.mx-rail li.on button,.mx-rail a:hover,.mx-rail a:focus-visible{background:#ffffff1a;color:#fff}
.mx-rail button:focus-visible,.mx-rail a:focus-visible{outline:2px solid var(--c);outline-offset:2px}
.mx-rail b{display:block;font-size:var(--text-min);font-weight:600;color:#fff}
.mx-rail span{display:block;font-size:var(--text-min);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* method figure: animated build-up (static/js/method-loop.js); without JS the SVG shows the final figure */
.mx-anim .mx-stage{background:#fff;border-radius:10px;padding:18px}
.mx-svg{display:block;width:100%;height:auto;overflow:visible}
.mx-svg g,.mx-svg image,.mx-svg path,.mx-svg polygon,.mx-svg rect{transform-box:view-box}
#mx-hl{stroke:var(--lab-teal);opacity:0}
.mx-steps{display:grid;grid-template-columns:1fr auto;gap:12px 24px;margin-top:14px;align-items:start}
.mx-steps ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;grid-column:1}
.mx-steps li{font-size:var(--text-min);padding:4px 12px;border-radius:999px;border:1px solid #ffffff2a;color:#8fa1a9;transition:color .3s,background .3s,border-color .3s}
.mx-steps li.on{color:#0e1b22;background:#e6ebea;border-color:#e6ebea}
.mx-steps li .v{color:var(--view)}
.mx-steps li .p{color:var(--probe)}
.mx-steps li.on .v{color:#1f6f66}
.mx-steps li.on .p{color:#a2551f}
.mx-say{display:none;grid-column:1;margin:4px 0 0;color:#e6ebea;font-size:17px;line-height:1.6;min-height:3.2em}
.mx-anim.armed .mx-say.on{display:block}
.mx-anim:not(.armed) .mx-say{display:none}
.mx-tools{grid-column:2;grid-row:1;font-size:var(--text-min);color:#8fa1a9;white-space:nowrap}
.mx-steps a,.mx-replay{all:unset;cursor:pointer;color:#c3cfd4;text-decoration:underline;text-underline-offset:3px}
.mx-steps a:focus-visible,.mx-replay:focus-visible{outline:2px solid var(--lab-teal);outline-offset:2px}

/* sim -> real handoff */
.mx-handoff{display:grid;grid-template-columns:5fr 7fr;gap:40px;align-items:center;margin-top:40px;padding:28px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(110deg,#6dbfbe14,#5697d810)}
.mx-hand-steps{list-style:none;margin:0;padding:0;display:grid;gap:0}
.mx-hand-steps li{position:relative;padding:0 0 22px 34px}
.mx-hand-steps li:last-child{padding-bottom:0}
.mx-hand-steps li:not(:last-child):after{content:'';position:absolute;left:8px;top:22px;bottom:2px;width:2px;background:var(--line)}
.mx-dot{position:absolute;left:0;top:4px;width:18px;height:18px;border-radius:50%;border:3px solid var(--paper);box-shadow:0 0 0 1px var(--line)}
.mx-dot.sim{background:var(--lab-teal)}
.mx-dot.code{background:var(--teal)}
.mx-dot.real{background:var(--lab-blue)}
.mx-hand-steps b{display:block;font-weight:600}
.mx-hand-steps span:not(.mx-dot){display:block;color:var(--subtle);line-height:1.6}
.mx-badge{display:block;width:max-content;font-size:var(--text-min);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--teal);margin-bottom:4px}

/* real-world: one large video per task */
.ax-stack{display:grid;gap:40px;margin-top:44px}
.ax-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.ax-card .ax-media video{border-radius:0;aspect-ratio:auto}
.ax-card-body{padding:24px 28px 26px;display:grid;grid-template-columns:1fr auto;column-gap:40px;align-items:center}
.ax-card-body h3{font-size:22px;font-weight:600;letter-spacing:-.03em;grid-column:1}
.ax-card-body p{color:var(--subtle);margin-top:6px;line-height:1.6;grid-column:1}
.ax-card-body .ax-stat{grid-column:2;grid-row:1 / span 2;margin:0;text-align:right;color:var(--ink)}
.ax-stat b{font-size:22px;color:var(--teal)}

/* results */
.ax-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.ax-stats>div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px 24px;display:flex;flex-direction:column;gap:6px}
.ax-num{font-size:38px;font-weight:600;letter-spacing:-.05em;color:#6c7c82}
.ax-stats span:last-child{font-size:var(--text-min);color:var(--subtle)}
.ax-ours{border-color:var(--teal)!important;box-shadow:inset 0 0 0 1px var(--teal)}
.ax-ours .ax-num{color:var(--teal)}

/* disclosures */
.ax-more{margin-top:36px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ax-more>summary{cursor:pointer;list-style:none;padding:20px 0;font-weight:500;display:flex;justify-content:space-between}
.ax-more>summary::-webkit-details-marker{display:none}
.ax-more>summary::after{content:"+";font-size:22px;line-height:1}
.ax-more[open]>summary::after{content:"–"}
.ax-more-body{padding:0 0 28px}
.ax-more-body p{color:var(--subtle)}

/* tables inherit .res styling from home.css */
.ax-section .table-wrap{margin-top:16px;overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:10px}

/* lists and abstract */
.ax-list{margin:8px 0 0;padding-left:22px;max-width:860px}
.ax-list li{line-height:1.7;color:var(--subtle);margin:10px 0}
.ax-abstract p{line-height:1.8;color:var(--ink);text-align:justify}

@media(max-width:860px){
  .ax-section{padding:64px var(--gutter)}
  .mx-pair,.ax-stats,.mx-handoff,.mx-steps{grid-template-columns:1fr}
  .mx-tools{grid-column:1;grid-row:auto}
  .mx-handoff{padding:20px}
  .mx-rail{flex-wrap:wrap}
  .mx-rail li{flex:1 1 30%}
  .mx-rail span{white-space:normal}
  .ax-card-body{grid-template-columns:1fr}
  .ax-card-body .ax-stat{grid-column:1;grid-row:auto;text-align:left;margin-top:10px}
  .ax-lead{font-size:17px}
}

/* ---------------------------------------------------------------- hero: title only */
.hero-paper-title{margin-top:18px;max-width:1040px;color:#f1f5f6;font-size:clamp(22px,2.9vw,46px);line-height:1.22;font-weight:500;letter-spacing:-.02em;text-wrap:balance;text-shadow:0 2px 18px #0006}

/* ---------------------------------------------------------------- compact author line */
.ax-authors{padding:30px var(--gutter) 26px;text-align:center;border-bottom:1px solid var(--line)}
.ax-author-list{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 18px;max-width:1080px;margin:0 auto;font-size:16px;color:var(--ink)}
.ax-author-note{margin-top:8px;font-size:var(--text-min);color:var(--subtle)}

/* ---------------------------------------------------------------- overview diagram (static/js/overview.js) */
.ov-ours{margin-top:40px;padding:26px 28px 24px;background:#f6f5f1;border:1px solid var(--line);border-radius:16px}
.ov-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}
.ov-title{display:grid;font-size:clamp(24px,2.6vw,36px);font-weight:600;letter-spacing:-.035em;line-height:1.15;color:var(--ink)}
.ov-title>span{grid-area:1 / 1}
.ov-title em{font-style:normal;color:#3d8fbf}
.ov-say{display:grid;margin:-4px 0 16px;min-height:3.2em}
.ov-say>p{grid-area:1 / 1;margin:0;max-width:960px!important;font-size:clamp(16px,1.4vw,19px);line-height:1.6;color:var(--ink)}
.ov-say b{font-weight:600}
.ov-say .a{color:#3d8fbf}.ov-say .v,.ov-title .v{color:#2a8f8a}.ov-say .p,.ov-title .p{color:#7d55b5}
.ov-title>span,.ov-say>p{opacity:0;transition:opacity .35s ease;pointer-events:none}
.ov-title>span.on,.ov-say>p.on,.ov-ours:not(.armed) .t2,.ov-ours:not(.armed) .c2{opacity:1;pointer-events:auto}
.ov-q{display:flex;align-items:center;justify-content:center;width:3.4cqw;height:3.4cqw;border-radius:50%;background:#f2b84b;color:#3a2a06;font-size:2cqw;font-weight:700;box-shadow:0 .3cqw .9cqw #10202a26;opacity:0;z-index:2}
.ov-tag{flex:none;padding:4px 10px;border-radius:6px;background:#dceaf2;color:#2c4a5a;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.ov-scroll{padding:6px 2px}
.ov-canvas{position:relative;container-type:inline-size;min-width:720px;width:100%}
.ov-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ov-lines path{fill:none;stroke:#20303a;stroke-width:1.5;vector-effect:non-scaling-stroke}
.ov-lines marker path{fill:#20303a;stroke:none}
.ov-lines .ov-conn{stroke:#3d8fbf}
.ov-dot{fill:#3d8fbf}
.ov-node{position:absolute;box-sizing:border-box;transform-origin:center}
.ov-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6cqw;background:#fbfcfc;border:1px solid #cfd8d6;border-radius:1.1cqw;box-shadow:0 .25cqw .9cqw #10202a0d;font-size:1.6cqw;font-weight:500;color:var(--ink);line-height:1.15;text-align:center}
.ov-ic{display:flex;align-items:center;justify-content:center;gap:1cqw;height:3cqw}
.ov-i{height:2.5cqw;width:auto}
.ov-i-sq{height:3cqw;border-radius:.3cqw}
.ov-doc{width:2cqw;height:2cqw;fill:none;stroke:#3a4a52;stroke-width:1.4;stroke-linejoin:round}
button.ov-node{font:inherit;cursor:pointer;margin:0}
button.ov-af{padding:0}
.ov-af{background:#dcecf6;border-color:#7fb6d6;font-size:1.6cqw;font-weight:500}
.ov-refine{background:#f8efd9;border-color:#e3d3a9}
.ov-verdict{isolation:isolate;display:flex;align-items:center;justify-content:center;font-size:1.6cqw;font-weight:500;color:var(--ink)}
.ov-dia{position:absolute;inset:0;width:100%;height:100%;z-index:-1;overflow:visible}
.ov-dia polygon{fill:#fbfcfc;stroke:#cfd8d6;stroke-width:1;vector-effect:non-scaling-stroke;filter:drop-shadow(0 .25cqw .6cqw #10202a12)}
/* diagnostic panel */
.ov-diag{all:unset;position:absolute;box-sizing:border-box;cursor:pointer;background:#dcebf4;border-radius:1.2cqw;padding:1.2cqw 1.3cqw;display:flex;flex-direction:column;justify-content:space-between;font-size:1.4cqw;color:var(--ink);--acc:#3d8fbf;transition:box-shadow .2s}
.ov-diag-t,.ov-diag-b{white-space:nowrap;font-size:1.3cqw;display:flex;justify-content:space-between;align-items:center;font-weight:500}
.ov-diag-b{font-weight:600}
.ov-diag i{font-style:normal;font-size:1.8cqw}
.ov-down{margin:-.6cqw 0 0 .6cqw}
.ov-drone{width:100%;height:auto;max-height:58%;object-fit:contain}
/* View / Probe cards */
.ov-card{all:unset;position:absolute;box-sizing:border-box;display:flex;flex-direction:column;gap:.7cqw;padding:.8cqw;border-radius:1.2cqw;border:.15cqw solid var(--acc);background:#fbfdfd;cursor:pointer;font-size:1.3cqw;color:var(--ink);transition:box-shadow .2s}
.ov-view{--acc:#2a8f8a;--tint:#e1efed}
.ov-probe{--acc:#7d55b5;--tint:#ece5f4}
.ov-af{--acc:#3d8fbf}
.ov-card-head{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.2cqw .8cqw;padding:.8cqw 1cqw;border-radius:.8cqw;background:var(--tint)}
.ov-card-head img{width:2.2cqw;height:2.2cqw;object-fit:contain}
.ov-card-head b{font-size:2.1cqw;letter-spacing:.02em;color:var(--acc)}
.ov-card-head span{grid-column:1 / -1;font-size:1.4cqw}
.ov-pair{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.6cqw;padding:0 .4cqw}
.ov-pair img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:.4cqw}
.ov-pair i{font-style:normal;color:var(--acc);font-size:1.6cqw}
.ov-labels{display:grid;grid-template-columns:1fr 1fr;text-align:center;font-size:1.4cqw;color:#5b6a70}
.ov-labels b{color:var(--acc)}
.ov-foot{text-align:center;color:var(--acc);font-size:1.35cqw}
.ov-ours.ready .ov-hot:hover,.ov-hot:focus-visible{box-shadow:0 0 0 .3cqw color-mix(in srgb,var(--acc) 25%,transparent),0 1cqw 2.4cqw #10202a1f}
.ov-hot:focus-visible{outline:.25cqw solid var(--acc);outline-offset:.3cqw}
.ov-hot.on{box-shadow:0 0 0 .35cqw color-mix(in srgb,var(--acc) 35%,transparent),0 1cqw 2.4cqw #10202a1f!important}
/* Blocks stay still after the build-up; hover and keyboard-focus highlights remain. */
.ov-bottom{display:grid;margin-top:12px}
.ov-bottom>p{grid-area:1 / 1;margin:0;max-width:none;font-size:var(--text-min);color:var(--subtle)}
.ov-bottom .b1{display:flex;justify-content:space-between;gap:12px}
.ov-bottom .b1 span:first-child{color:var(--ink);font-weight:600}
.ov-actions{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 16px;margin:0 0 18px}
.ov-steps{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ov-steps button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:var(--text-min);color:var(--subtle);transition:background .2s,color .2s,border-color .2s}
.ov-steps button span{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#e8ecea;color:var(--ink);font-size:13px;font-weight:600}
.ov-steps button.done span{background:#cfe3ec}
.ov-steps button.on{border-color:var(--ink);color:var(--ink);font-weight:500}
.ov-steps button.on span{background:var(--ink);color:#fff}
.ov-steps button:hover{border-color:#9aa8ad;color:var(--ink)}
.ov-steps button:focus-visible,.ov-next:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.ov-next{all:unset;cursor:pointer;padding:8px 18px;border-radius:999px;background:var(--ink);color:#fff;font-size:var(--text-min);font-weight:500;transition:background .2s}
.ov-next:hover{background:#2c4452}
.ov-ours:not(.armed) .ov-actions{display:none}
/* detail panel */
.ov-detail{position:relative;margin-top:18px;padding:44px 28px 26px;border-radius:12px;background:#fff;border:1px solid var(--line);animation:ov-in .3s ease-out}
.ov-detail article{display:grid;grid-template-columns:5fr 6fr;gap:30px;align-items:center}
.ov-detail h3{font-size:22px;font-weight:600;letter-spacing:-.03em;margin:6px 0 10px}
.ov-detail p{color:var(--subtle);line-height:1.7}
.ov-kicker{font-size:var(--text-min);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#3d8fbf!important}
.ov-kicker.v{color:#2a8f8a!important}.ov-kicker.p{color:#7d55b5!important}
.ov-link{margin-top:10px}
.ov-link a{color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.ov-close{all:unset;position:absolute;top:8px;right:10px;font-size:26px;line-height:1;color:var(--subtle);cursor:pointer;padding:4px 8px;border-radius:6px}
.ov-close:hover,.ov-close:focus-visible{background:#e3e8e6;color:var(--ink)}
@keyframes ov-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.ax-more-tight{margin-top:0;border-top:0}
.ov-swipe{display:none;font-style:normal;font-size:var(--text-min);color:var(--teal)}
@media(max-width:860px){
  .ov-steps{flex-wrap:nowrap;gap:6px}
  .ov-steps button:not(.on){font-size:0;gap:0;padding:5px}
  .ov-actions{flex-wrap:nowrap}
  .ov-steps button,.ov-next{white-space:nowrap}
  .ov-scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
  .ov-ours{padding:18px 14px}
  .ov-detail{padding:40px 16px 20px}
  .ov-detail article{grid-template-columns:1fr}
  .ov-swipe{display:inline}
  .ax-author-list{font-size:15px;gap:2px 12px}
  .ov-bottom .b1{flex-direction:column;gap:2px}
}
@media(prefers-reduced-motion:reduce){.ov-hint svg{animation:none!important}}
/* Method diagram: three screens cross-fade in turn (static/js/overview.js) */
.ov-canvas{transition:opacity .35s ease}
.ov-canvas.ov-fading{opacity:0}
.ax-lead .ax-v{color:#2a8f8a}
.ax-lead .ax-p{color:#7d55b5}
.ov-ours{margin-top:32px;padding-top:22px}
.ov-figlink{margin:10px 0 0;text-align:right;font-size:var(--text-min)}
.ov-figlink a{color:var(--subtle);text-decoration:underline;text-underline-offset:3px}
.ax-author-list sup,.ax-affil sup{font-size:.68em;margin-left:1px;color:var(--subtle)}
.ax-affil{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 18px;max-width:1080px;margin:8px auto 0;font-size:var(--text-min);color:var(--subtle)}
.ax-affil sup{margin:0 2px 0 0}
.ov-cap{display:grid;margin:0 0 10px;font-size:clamp(18px,1.6vw,22px);font-weight:600;letter-spacing:-.015em;line-height:1.3;color:var(--ink)}
.ov-cap>span{grid-area:1 / 1}
.ov-cap .k0{opacity:0}
.ov-cap b{font-weight:700;color:#2f84b5}
.ov-cap .k1{font-weight:500}
.ov-caprow{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 10px}
.ov-caprow .ov-cap{margin:0}
.ov-replay{all:unset;flex:none;cursor:pointer;padding:5px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:var(--text-min);color:var(--subtle);transition:color .2s,border-color .2s}
.ov-replay:hover{color:var(--ink);border-color:#9aa8ad}
.ov-replay:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
/* White page (trial): the page colour token switches to white; dark sections stay dark */
body.ax-page{--paper:#ffffff;background:#ffffff}
.ov-ours{background:#f7f9f9;border-color:#e3e8e8}
.ax-card,.ax-stats>div,.ax-section .table-wrap{border-color:#e3e8e8}
/* No top navigation bar: the mobile hero no longer needs room for it */
@media(max-width:760px){.ax-page .hero-film{padding-top:0}}

/* ---- How-it-works diagram: one type scale, one icon size, shared edges ---- */
.ov-scroll{padding:6px 0}
.ov-canvas .ov-box,.ov-canvas .ov-verdict,.ov-canvas button.ov-af{font-family:inherit;font-size:1.55cqw;font-weight:500;line-height:1.2;color:var(--ink)}
.ov-ic{height:2.6cqw;gap:.9cqw}
.ov-ic .ov-i,.ov-ic img,.ov-ic svg{height:2.3cqw;width:auto;max-width:3cqw;object-fit:contain}
.ov-ic .ov-i-sq{height:2.3cqw;border-radius:.25cqw}
.ov-doc{width:auto;height:2.3cqw;stroke-width:1.6}
/* View / Probe cards: header, photos and labels share the same inner edges and columns */
.ov-card{padding:.9cqw;gap:.8cqw}
.ov-card-head{padding:.8cqw 1cqw}
.ov-pair,.ov-labels{display:grid;grid-template-columns:1fr 2cqw 1fr;align-items:center;gap:0;padding:0}
.ov-pair i{text-align:center;font-size:1.5cqw}
.ov-labels{font-size:1.3cqw}
.ov-labels>*{text-align:center}
.ov-labels>:first-child{grid-column:1}
.ov-labels>:last-child{grid-column:3}
.ov-foot{font-size:1.3cqw}
/* diagnostic-program panel: same inner padding and text size as the cards */
.ov-diag{padding:1.2cqw 1.3cqw}
.ov-diag-t,.ov-diag-b{font-size:1.3cqw}

/* ---- ASPIRE-like reading layout: one column for text and figures ---- */
.ax-wrap{max-width:880px}
.ax-section p,.ax-lead{max-width:none!important}
.ax-lead{font-size:17px;line-height:1.66;color:#46555c}
.ax-lead .ax-strong{font-weight:700;color:var(--ink)}
/* the diagram box uses the full column, so its inner padding stays small */
.ov-ours{padding:18px 18px 20px}

/* left section rail (wide screens only) */
.ax-rail{position:fixed;left:24px;top:50%;transform:translateY(-50%);z-index:50;display:none;flex-direction:column;gap:2px;opacity:0;pointer-events:none;transition:opacity .3s}
.ax-rail.shown{opacity:1;pointer-events:auto}
.ax-rail a{font-size:13px;line-height:1.2;color:#6b7a81;text-decoration:none;padding:7px 10px 7px 12px;border-left:2px solid transparent;transition:color .2s,border-color .2s}
.ax-rail a:hover{color:var(--ink)}
.ax-rail a.active{color:var(--teal);font-weight:600;border-left-color:var(--teal)}
.ax-rail a:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
@media(min-width:1180px){.ax-rail{display:flex}}
.ax-rail.dark a{color:#93a5ad}
.ax-rail.dark a:hover{color:#fff}
.ax-rail.dark a.active{color:var(--lab-teal);border-left-color:var(--lab-teal)}
.ov-card{gap:.6cqw;padding-bottom:1.1cqw}
/* author list: second line starts at Jia-Bin Huang */
.ax-author-list .ax-break{flex-basis:100%;height:0}
@media(max-width:760px){.ax-author-list .ax-break{display:none}}
/* author block hierarchy: names > affiliations > note */
.ax-author-list{font-weight:500;color:var(--ink)}
.ax-affil{font-size:14px}
.ax-author-note{font-size:13px;color:#8d999f;margin-top:6px}

/* ---- Compact type scale (after ASPIRE / ScholarCatalyst): body 15-16px, titles ~30px ---- */
.ax-section{padding-top:80px;padding-bottom:80px}
.ax-section h2{font-size:clamp(24px,2.2vw,30px);letter-spacing:-.03em;margin-bottom:14px}
.ax-section h2:before{width:44px;height:3px;margin-bottom:16px}
.ax-lead{font-size:16px;line-height:1.62}
.ax-section p,.ax-section li,.ax-section td,.ax-section th,.ax-section summary{font-size:15px}
.ax-section figcaption,.ax-media figcaption,.ax-section .caption,.ax-note{font-size:14px!important;line-height:1.5}
.ax-section .table-wrap td,.ax-section .table-wrap th{font-size:14px}
.ax-sub{font-size:19px;margin:48px 0 12px}
.ax-card-body h3{font-size:19px}
.ax-stat b{font-size:19px}
.ax-num{font-size:30px}
.ov-cap{font-size:18px}
.ov-detail h3{font-size:19px}
.ov-detail p,.ov-kicker{font-size:15px}
/* case studies (styles come from home.css) */
.ax-section .case-summary strong{font-size:clamp(19px,1.7vw,22px);letter-spacing:-.02em}
.ax-section .case-summary>span:last-child{font-size:15px}
.ax-section h3.title.is-5{font-size:19px}
.ax-section .cstep-title{font-size:17px}
.ax-section .quote,.ax-section .tag,.ax-section .decision{font-size:14px}
.ax-abstract p{font-size:15px;line-height:1.7}
.ax-section .ax-lead{font-size:16px}
.ax-section .ov-cap{font-size:18px}
/* diagnostic-program panel: centred column, program -> robot -> evidence read top to bottom */
.ov-diag{flex-direction:column;align-items:center;justify-content:center;gap:.3cqw;text-align:center;padding:1.1cqw 1cqw}
.ov-diag-t,.ov-diag-b{display:block;font-size:1.4cqw;font-weight:600;white-space:nowrap}
.ov-diag .ov-arr{font-style:normal;font-size:2.6cqw;line-height:1;color:#3d8fbf;font-weight:400}
.ov-diag .ov-drone{width:88%;max-height:48%;margin:.1cqw 0}
/* diagnostic-program panel, drawn like the paper figure: program comes in from the cards
   (right) and turns down into the robot; evidence leaves the robot and turns right */
.ov-diag{display:block;padding:0}
.ov-diag>*{position:absolute}
.ov-diag-arrows{inset:0;width:100%;height:100%;overflow:visible}
.ov-diag-arrows path{fill:none;stroke:#20303a;stroke-width:1.6;vector-effect:non-scaling-stroke}
.ov-diag-arrows marker path{fill:#20303a;stroke:none}
.ov-diag .ov-diag-t{left:7%;top:5%;font-size:1.35cqw;font-weight:500;white-space:nowrap}
.ov-diag .ov-diag-b{left:7%;bottom:3.5%;font-size:1.35cqw;font-weight:500;white-space:nowrap}
.ov-diag .ov-drone{left:12%;top:31%;width:84%;height:42%;max-height:none;object-fit:contain;margin:0}
/* View / Probe footers a little larger */
.ov-foot{font-size:1.55cqw}
.ax-card .ax-vcap{padding:10px 28px 0;margin:0;font-size:14px;color:var(--subtle)}
.ov-under{margin:12px 0 0;font-size:14px;line-height:1.5;color:var(--subtle)}
.ov-under{margin:10px 2px 0;font-size:13px;line-height:1.5;color:#8d999f}
.ax-lead+.ax-lead{margin-top:14px}
.ov-caprow .ov-cap{flex:1}
/* affiliations: two lines (1-3, then 4-5), as in the paper */
.ax-affil .ax-break{flex-basis:100%;height:0}
@media(max-width:760px){.ax-affil .ax-break{display:none}}

/* ---- one step smaller overall (measured against ASPIRE: authors 15.7, affiliations 14.4, body 15.7-16, captions 14.7) ---- */
.ax-author-list{font-size:15px}
.ax-affil{font-size:13px}
.ax-author-note{font-size:12px}
.ax-section h2{font-size:clamp(23px,2vw,27px)}
.ax-section .ax-lead{font-size:15px;line-height:1.62}
.ax-section p,.ax-section li,.ax-section td,.ax-section th,.ax-section summary{font-size:14.5px}
.ax-section figcaption,.ax-media figcaption,.ax-section .caption,.ax-note{font-size:13.5px!important}
.ax-section .table-wrap td,.ax-section .table-wrap th{font-size:13.5px}
.ax-sub,.ax-card-body h3,.ov-detail h3,.ax-section h3.title.is-5{font-size:17.5px}
.ax-num{font-size:27px}
.ax-section .ov-cap{font-size:16.5px}
.ov-detail p,.ov-kicker{font-size:14.5px}
.ax-section .case-summary strong{font-size:clamp(18px,1.5vw,20px)}
.ax-section .case-summary>span:last-child{font-size:14.5px}
.ax-section .cstep-title{font-size:16px}
.ax-section .quote,.ax-section .tag,.ax-section .decision{font-size:13.5px}
.ax-abstract p{font-size:14.5px}
.hero-paper-title{font-size:clamp(20px,2.6vw,40px)}

/* ---- type sizes matched to ASPIRE (computed values at 1440px) ---- */
.ax-author-list{font-size:.98rem;font-weight:500}
.ax-affil{font-size:.9rem}
.ax-author-note{font-size:.86rem}
.ax-section h2{font-size:clamp(1.55rem,2.3vw,2.05rem);letter-spacing:-.022em;line-height:1.12}
.ax-section .ax-lead{font-size:1rem;line-height:1.6}
.ax-section p,.ax-section li,.ax-section td,.ax-section th,.ax-section summary{font-size:.98rem}
.ax-section figcaption,.ax-media figcaption,.ax-section .caption,.ax-note{font-size:.92rem!important;line-height:1.5}
.ax-section .table-wrap td,.ax-section .table-wrap th{font-size:.92rem}
.ax-sub,.ax-card-body h3,.ov-detail h3,.ax-section h3.title.is-5{font-size:1.18rem}
.ax-section .ov-cap{font-size:1.18rem}
.ax-num{font-size:1.8rem}
.ov-detail p,.ov-kicker{font-size:.98rem}
.ax-section .case-summary strong{font-size:1.38rem}
.ax-section .case-summary>span:last-child{font-size:.98rem}
.ax-section .cstep-title{font-size:1.06rem}
.ax-section .quote,.ax-section .tag,.ax-section .decision{font-size:.92rem}
.ax-abstract p{font-size:.98rem}
/* Retain the collaborator's minimal hero: no bottom rule or visible control strip. */
.ax-page .hero-film .hero-bottom{display:none!important}
/* no horizontal rules between page sections */
.ax-section+.ax-section:not(.ax-dark){border-top:0}
.ax-authors{border-bottom:0}
/* author homepages: same look as plain names, underline on hover */
.ax-author-link{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s,color .2s}
.ax-author-link:hover,.ax-author-link:focus-visible{color:var(--teal);border-bottom-color:currentColor}
/* TL;DR under the author list (replaces the full abstract) */
.ax-tldr{max-width:760px;margin:18px auto 0;padding:14px 18px;text-align:left;font-size:.98rem;line-height:1.6;color:#33454d;background:#f4f7f7;border-left:3px solid var(--teal);border-radius:0 8px 8px 0}
.ax-tldr>b:first-child{color:var(--teal);margin-right:6px;letter-spacing:.02em}
.ax-tldr .ax-v{color:#2a8f8a}.ax-tldr .ax-p{color:#7d55b5}
/* TL;DR card styled like the Method diagram box: same column width, background, border and radius */
.ax-tldr{max-width:880px;margin:36px auto 0;padding:20px 24px 22px;text-align:left;font-size:1rem;line-height:1.65;color:var(--ink);
  background:#f7f9f9;border:1px solid #e3e8e8;border-left:1px solid #e3e8e8;border-radius:16px}
.ax-tldr>b:first-child{display:block;margin:0 0 8px;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#2f84b5}
.ax-tldr>b:first-child:before{content:'';display:inline-block;vertical-align:middle;width:22px;height:3px;margin:-2px 10px 0 0;border-radius:2px;background:var(--lab-gradient)}
@media(max-width:760px){.ax-tldr{margin-top:26px;padding:16px 16px 18px;font-size:.95rem}}
.ax-authors .ax-tldr{width:100%;box-sizing:border-box}
.ax-authors .ax-tldr{max-width:1120px}
.ax-authors .ax-tldr{margin-top:56px}
.ax-tldr .ax-v{color:#2a8f8a}.ax-tldr .ax-p{color:#7d55b5}
@media(max-width:760px){.ax-authors .ax-tldr{margin-top:36px}}
/* Results: success-rate cards with bars (static/js/results-stats.js drives them on scroll) */
.ax-stats>div{position:relative;overflow:hidden;will-change:transform,opacity}
.ax-bar{display:block;height:6px;margin-top:12px;border-radius:3px;background:#e9eeee;overflow:hidden}
.ax-bar>i{display:block;height:100%;border-radius:3px;background:#a9b6bd}
.ax-stats>div:nth-child(1) .ax-bar>i{width:31.7%}
.ax-stats>div:nth-child(2) .ax-bar>i{width:48.3%;background:#4c79a8}
.ax-ours .ax-bar>i{width:75%;background:#e5582f}
.ax-num{font-variant-numeric:tabular-nums}
.ax-ours{transition:box-shadow .5s,border-color .5s}
.ax-stats.ax-live:not(.ax-done) .ax-ours{box-shadow:none}
.ax-stats.ax-done .ax-ours{box-shadow:inset 0 0 0 1px var(--teal),0 14px 34px #286d8c22}
/* Author block on one centre axis: title, authors, affiliations, note, then the arXiv / Code
   buttons in a centred row (overrides the side column from responsive.css), then the TL;DR. */
.ax-authors .publication-layout{grid-template-columns:minmax(0,1fr);gap:0;max-width:1120px}
.ax-authors .publication-links{grid-row:auto;flex-direction:row;justify-content:center;justify-self:center;gap:10px;margin:22px 0 0;padding:0;border:0}
.ax-authors .publication-hint{top:auto;bottom:calc(100% + 6px);left:50%;right:auto;transform:translateX(-50%)}
/* TL;DR, after C-Slerp: centred heading with a highlighter underline, one short narrow paragraph,
   key phrases marked; no card. */
.ax-authors .ax-tldr{max-width:740px;margin:56px auto 0;padding:0;background:none;border:0;border-radius:0;text-align:left}
.ax-tldr h2{margin:0 0 14px;text-align:center;font-size:1.6rem;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.ax-tldr h2 span{padding:0 4px;background:linear-gradient(transparent 58%,rgba(16,29,37,.1) 58%,rgba(16,29,37,.1) 96%,transparent 96%)}
.ax-tldr h2:before{display:none}
.ax-tldr p{margin:0;font-size:1rem;line-height:1.65;color:var(--ink)}
.ax-mark{font-weight:600;padding:0 1px;background:linear-gradient(transparent 62%,rgba(40,109,140,.22) 62%,rgba(40,109,140,.22) 96%,transparent 96%);-webkit-box-decoration-break:clone;box-decoration-break:clone}
@media(max-width:760px){.ax-authors .ax-tldr{margin-top:40px}.ax-tldr h2{font-size:1.35rem}}
/* TL;DR: one point larger; justified so the block reads as centred under the title */
.ax-tldr p{font-size:1.0625rem;line-height:1.66;text-align:justify;text-align-last:center;hyphens:manual}
.ax-tldr h2{font-size:1.7rem}
/* section titles no larger than the paper title (36px) */
.ax-page .ax-section h2{font-size:clamp(1.5rem,2.3vw,2rem)}
.ax-tldr p{text-align:center;text-align-last:auto;text-wrap:balance}

/* diagram captions: one style for both screens (same size, weight and colour); only the
   names carry colour, matching the blocks below */
.ax-section .ov-cap{font-size:1.18rem}
.ov-cap .k0,.ov-cap .k1{font-weight:600;color:var(--ink)}
.ov-cap .k1 b{font-weight:700;color:var(--ink)}
.ov-cap .ov-cap-af{color:#2f84b5}
/* the "click a highlighted block" bar appears with the clickable third screen */
.ov-ours.armed .ov-explore{transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s}
.ov-ours.armed:not(.ready) .ov-explore{opacity:0;visibility:hidden;transform:translateY(6px)}
.ov-ours.armed.ready .ov-explore{opacity:1;visibility:visible;transform:none;transition:opacity .4s ease,transform .4s ease,visibility 0s}
/* captions are measured and moved by overview.js: each line is only as wide as its text */
.ov-caprow .ov-cap{flex:1;min-width:0}
.ov-cap>span{justify-self:start;width:max-content;max-width:100%;transform-origin:center;white-space:nowrap}
.ov-ours{position:relative}
/* "Click a highlighted block" line: text and cursor icon only, no box */
.ax-section .ov-explore{border:0;background:none;padding:0 2px;margin:8px 0 14px}
@media(max-width:860px){.ov-cap>span{white-space:normal;width:auto}}
/* "Click a highlighted block": centred line above the diagram */
.ax-section .ov-explore{justify-content:center}
.ax-section .ov-clickhint{flex:0 1 auto;justify-content:center}
/* Active Feedback panel and beam (behind the cards), after the paper figure */
.ov-lines .ov-afpanel{fill:#e8f2f8;stroke:#7fb6d6;stroke-width:1.2;vector-effect:non-scaling-stroke}
.ov-lines .ov-beam{fill:#cfe5f1;stroke:none;opacity:0}
.ov-ours.armed .ov-afpanel{opacity:0}
/* the clickable blocks (Active Feedback, diagnostic program, View, Probe) stay visibly highlighted */
.ov-ours.ready .ov-hot{box-shadow:0 0 0 .32cqw color-mix(in srgb,var(--acc) 30%,transparent),0 .8cqw 2cqw color-mix(in srgb,var(--acc) 22%,transparent)}
.ov-ours.ready:not(.touched) .ov-hot{animation:ov-glow 2.2s ease-in-out infinite}
.ov-ours.ready:not(.touched) .ov-probe{animation-delay:.35s}
.ov-ours.ready:not(.touched) .ov-af,.ov-ours.ready:not(.touched) .ov-diag{animation-delay:.7s}
@keyframes ov-glow{0%,100%{box-shadow:0 0 0 .32cqw color-mix(in srgb,var(--acc) 30%,transparent),0 .8cqw 2cqw color-mix(in srgb,var(--acc) 22%,transparent)}
  50%{box-shadow:0 0 0 .6cqw color-mix(in srgb,var(--acc) 22%,transparent),0 .8cqw 2.6cqw color-mix(in srgb,var(--acc) 30%,transparent)}}
@media(prefers-reduced-motion:reduce){.ov-ours .ov-hot{animation:none!important}}
/* View / Probe: heavier before -> after arrows, bold footers */
.ov-pair i{position:relative;display:block;height:2cqw;font-size:0;color:var(--acc)}
.ov-pair i::before{content:'';position:absolute;left:.15cqw;right:.75cqw;top:50%;height:.32cqw;margin-top:-.16cqw;border-radius:.16cqw;background:currentColor}
.ov-pair i::after{content:'';position:absolute;right:.1cqw;top:50%;margin-top:-.62cqw;border-left:.85cqw solid currentColor;border-top:.62cqw solid transparent;border-bottom:.62cqw solid transparent}
.ov-foot{font-weight:700}
/* TL;DR heading without the grey highlighter */
.ax-tldr h2 span{background:none;padding:0}
/* Replay: the click hint disappears at once (it only fades in when screen 3 is ready) */
.ov-ours.armed:not(.ready) .ov-explore{transition:none}
/* TL;DR heading uses the section-title marker (short gradient bar), centred and one step smaller */
.ax-tldr h2{font-size:1.55rem;font-weight:600;letter-spacing:-.02em;color:var(--ink);margin:0 0 14px}
.ax-tldr h2:before{content:'';display:block!important;width:44px;height:3px;margin:0 auto 14px;border-radius:2px;background:var(--lab-gradient)}
.ax-section .ov-intro{margin:0 0 4px;color:#46555c}
/* task instruction shown above the Active Feedback trial clip */
.ov-detail .ov-task{margin:0 0 8px;font-size:.92rem;line-height:1.5;color:var(--ink)}
.ov-task b{display:inline-block;margin-right:6px;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#2f84b5}
.ov-detail .ov-why{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.ov-why b{color:var(--ink)}
/* trial caption under the Active Feedback clip: small and faint, two lines */
.ov-detail article[data-ov="af"] figcaption{font-size:.78rem!important;line-height:1.5;color:#8d999f;letter-spacing:-.005em}
.ov-detail article[data-ov="af"] figcaption b{color:#6b7a81}
/* TL;DR about 1.5x wider */
.ax-authors .ax-tldr{max-width:1110px}
/* TL;DR about 4/5 of the previous width */
.ax-authors .ax-tldr{max-width:890px}

/* TL;DR emphasis: a soft full-height tint in the site's teal-to-blue palette instead of a half-height marker */
.ax-mark{font-weight:600;color:#1d5f7d;padding:.06em .3em;border-radius:.35em;
  background:linear-gradient(90deg,rgba(109,191,190,.2),rgba(86,151,216,.2));
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
/* TL;DR emphasis back to a highlighter stroke (lower part of the line), coloured with the teal-to-blue tint */
.ax-mark{color:inherit;padding:0 2px;border-radius:0;
  background:linear-gradient(90deg,rgba(109,191,190,.42),rgba(86,151,216,.42)) no-repeat 0 88%/100% .5em}
.ax-mark{background-image:linear-gradient(90deg,rgba(109,191,190,.26),rgba(86,151,216,.26))}
/* small, faint captions under the View / Probe clips */
.ov-detail .ov-vcap{font-size:.8rem!important;line-height:1.5;color:#8d999f}
/* Active Feedback trial caption: a little larger and darker than before */
.ov-detail article[data-ov="af"] figcaption{font-size:.86rem!important;color:#5f6b72}
.ov-detail article[data-ov="af"] figcaption b{color:var(--ink)}
/* one caption style under all three demo clips (Active Feedback, View, Probe) */
.ov-detail figcaption.ov-vcap{font-size:.92rem!important;line-height:1.5;color:#5f6b72;margin-top:8px}
.ov-detail article[data-ov] figcaption.ov-vcap{font-size:.92rem!important;color:#5f6b72}