body{font-family:'Noto Sans',sans-serif}.footer .icon-link{font-size:25px;color:#000}.link-block a{margin-top:5px;margin-bottom:5px}.dnerf{font-variant:small-caps}.teaser .hero-body{padding-top:0;padding-bottom:3rem}.teaser{font-family:'Google Sans',sans-serif}.publication-banner{max-height:parent}.publication-banner video{position:relative;left:auto;top:auto;transform:none;object-fit:fit}.publication-title{font-family:'Google Sans',sans-serif}.publication-authors{font-family:'Google Sans',sans-serif}.publication-venue{color:#555;width:fit-content;font-weight:bold}.publication-awards{color:#ff3860;width:fit-content;font-weight:bolder}.publication-authors a{color:hsl(204,86%,53%)!important}.publication-authors a:hover{text-decoration:underline}.author-block{display:inline-block}.publication-video{position:relative;width:100%;height:0;padding-bottom:56.25%;overflow:hidden;border-radius:10px!important}.publication-video iframe{position:absolute;top:0;left:0;width:100%;height:100%}.results-carousel{overflow:hidden}.results-carousel .item{margin:5px;overflow:hidden;padding:20px;font-size:0}.results-carousel video{margin:0}.slider-pagination .slider-page{background:#000}.eql-cntrb{font-size:smaller}.modal-content{max-width:90%;width:auto;height:auto;margin:0 auto;max-height:none;overflow:visible}.modal-content .image{display:flex;justify-content:center;align-items:center;overflow:visible;max-height:none}.modal-content .image img{max-height:90vh;width:auto;object-fit:contain;cursor:zoom-in;transition:transform .3s ease}.modal-content .image img.zoomed{transform:scale(2);cursor:zoom-out}#unconditionalBtn,#conditionalBtn{margin:1rem 0;background-color:#4a4a4a;color:white;transition:all .3s ease}#unconditionalBtn:hover,#conditionalBtn:hover{background-color:#363636;transform:scale(1.05)}.modal.is-active{display:flex!important;z-index:1000}
/* ---- page styles (as in the COP-GEN project page) ---- */
.hero-with-background{position:relative;background-image:url('../images/banner.jpg');background-size:cover;background-position:center;color:#fff}
.hero-with-background::before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,.55);z-index:1}
.hero-with-background .hero-body{position:relative;z-index:2}
.hero-with-background .title,.hero-with-background .subtitle,.hero-with-background .publication-authors{color:#fff;text-shadow:1px 1px 3px rgba(0,0,0,.8)}
.hero-with-background .publication-authors a{color:#9fd3ff!important}
.hero-with-background .button.is-dark{background-color:rgba(54,54,54,.85)}
.publication-links{margin-top:1rem}
.is-static-soon{cursor:default;opacity:.85}
.key-insight{background:linear-gradient(135deg,#2b4c7e 0%,#3d6f9e 100%);color:#fff;padding:1.25rem 1.5rem;border-radius:10px;margin:1.5rem 0;text-align:center}
.comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0;text-align:left}
.model-card{padding:1rem 1.25rem;border-radius:8px}
.model-card.siamese{background-color:#f5f5f5;border:2px solid #b5b5b5}
.model-card.predictive{background-color:#eaf1fb;border:2px solid #3273dc}
.model-card .title{margin-bottom:.5rem}
.results-table{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.88em}
.results-table th,.results-table td{padding:.3rem .5rem;text-align:center;border-bottom:1px solid #ddd;line-height:1.25;white-space:nowrap}
.results-table th{background-color:#f5f5f5;font-weight:600}
.results-table tr:hover{background-color:#fafafa}
.results-table .target-cell{text-align:left;font-weight:600}
.results-table .metric-cell{text-align:left;white-space:normal}
.results-table .best{font-weight:700;color:#2E7D32}
.results-table .second{text-decoration:underline}
.results-table .ours-row td{background-color:#eef4fc}
.results-table .baseline-row td{background-color:#f9fafc}
.details-table td{text-align:left}
.table-caption{font-size:.9em;color:#666;margin-top:.5rem;text-align:left}
.table-caption .best{font-weight:700;color:#2E7D32}
.table-caption .second{text-decoration:underline}
.table-container{overflow-x:auto;margin:1.5rem 0}
.result-figure{text-align:center;margin:1rem auto 1.5rem}
.result-figure img{max-width:100%;height:auto;display:block;margin:0 auto}
.figure-caption{font-size:.95em;margin:.6rem auto 0;text-align:justify;max-width:95%;color:#363636}
.zoomable{cursor:zoom-in}
.method-text{margin-top:1.5rem}
.method-pair{margin-top:.5rem}
.subsection-title{margin-top:2.5rem}
.paper-figure{margin-top:2.5rem}
.teaser .hero-body{padding-top:1.5rem}
/* metric plots */
.metric-control{display:flex;gap:.75rem;align-items:center;justify-content:center;margin:2rem 0 .75rem}
.metric-control .label{margin:0}
.plots-grid{display:grid;gap:1rem;grid-template-columns:repeat(3,minmax(0,1fr))}
.plot-panel{border:1px solid #ddd;border-radius:6px;margin:0;padding:.75rem;background:#fff}
.plot-panel .title{margin-bottom:.25rem}
.metric-svg{width:100%;height:auto}
.grid-line{stroke:#eee}
.axis-line{stroke:#888}
.dot-stem{stroke:#ccc}
.tick-label,.x-label{font-size:11px;fill:#555}
.axis-title{font-size:12px;fill:#333}
.dot-value{font-size:10px;fill:#333}
.dot-value-ours{fill:#3273dc;font-weight:700}
/* example galleries */
.example-tabs{margin:1rem 0 .75rem}
.example-tab.is-active{background-color:#363636;color:#fff;border-color:#363636}
.panel-grid{display:grid;gap:.5rem;margin-bottom:.5rem}
.panel-grid.cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}
.panel-grid.cols-12{grid-template-columns:repeat(12,minmax(0,1fr));gap:.3rem}
.panel-grid figure{margin:0;background:#fff;border:1px solid #ddd;border-radius:5px;padding:.3rem}
.panel-grid img{display:block;width:100%;height:auto;border-radius:3px;cursor:zoom-in}
.panel-grid figcaption{font-family:'Google Sans',sans-serif;font-size:.8rem;margin-top:.3rem;color:#333}
.panel-grid.cols-12 figcaption{font-size:.75rem}
.panel-grid .ours-panel{border:2px solid #3273dc}
@media screen and (max-width:1024px){
  .plots-grid,.comparison-grid{grid-template-columns:1fr}
  .panel-grid.cols-8{grid-template-columns:repeat(4,minmax(0,1fr))}
  .panel-grid.cols-12{grid-template-columns:repeat(6,minmax(0,1fr))}
}
/* idea framing */
.hero-thesis{margin-top:-.5rem!important;opacity:.95}
.highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.5rem}
.highlight{border:1px solid #dbe3ef;border-top:4px solid #3273dc;border-radius:8px;padding:1rem 1.1rem;background:#fff;text-align:left}
.highlight-value{font-family:'Google Sans',sans-serif;font-size:1.45rem;font-weight:700;color:#2b4c7e;margin-bottom:.35rem}
.highlight-label{font-size:.92rem;color:#4a4a4a;line-height:1.45}
.question-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:1.25rem 0;text-align:left}
.question-card{border-radius:8px;padding:1rem 1.1rem;background:#f7f9fc;border:1px solid #dbe3ef}
.question-card .title{margin:.35rem 0 .5rem}
.question-step{font-family:'Google Sans',sans-serif;font-size:.8rem;font-weight:700;color:#3273dc;text-transform:uppercase;letter-spacing:.04em}
.idea-note{font-size:1rem;color:#363636;text-align:justify;margin:0 0 1rem}
@media screen and (max-width:1024px){.highlights,.question-grid{grid-template-columns:1fr}}
/* layout fixes */
.link-block .button{margin-top:5px;margin-bottom:5px}
.method-pair .figure-caption{text-align:left;max-width:100%}
.plot-panel{max-width:1000px;margin:0 auto}
.tick-label,.x-label{font-size:12px}
.dot-value{font-size:10.5px}
.panel-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;max-width:1000px;margin:0 auto .5rem}
.panel-grid.cols-6{grid-template-columns:repeat(6,minmax(0,1fr));gap:.5rem;max-width:1100px;margin:0 auto .5rem}
.panel-grid.cols-4 figcaption{font-size:.9rem}
@media screen and (max-width:768px){.panel-grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}.panel-grid.cols-6{grid-template-columns:repeat(3,minmax(0,1fr))}}
.columns > .column{min-width:0}
.hero > .container{min-width:0;width:100%}
body{overflow-x:hidden}
.example-row{margin:0 auto 1.25rem;max-width:1600px}
.example-label{font-family:'Google Sans',sans-serif;font-weight:700;text-align:left;margin:0 0 .35rem}
#qualitative .content,#evidence .content,#qualitative .figure-caption,#evidence .figure-caption{max-width:1100px;margin-left:auto;margin-right:auto}
#qualitative .result-figure img,#evidence .result-figure img{max-width:1300px}
.panel-grid.cols-8{max-width:1600px;margin:0 auto}
.panel-grid.cols-12{max-width:1600px;margin:0 auto;gap:.3rem}
.hero-lead{max-width:720px;margin:0 auto 1.25rem;font-size:1.02rem;line-height:1.55;color:#f2f2f2;text-shadow:0 1px 3px rgba(0,0,0,.6)}
