diff --git a/.nojekyll b/.nojekyll new file mode 100644 index 0000000..e69de29 diff --git a/assets/css/site.css b/assets/css/site.css new file mode 100644 index 0000000..fa1114c --- /dev/null +++ b/assets/css/site.css @@ -0,0 +1,977 @@ +:root { + --ink: #122426; + --muted: #587072; + --paper: #fbfcfa; + --surface: #ffffff; + --line: #dfe8e4; + --teal: #0f766e; + --teal-dark: #0a514c; + --green: #3c7a4d; + --amber: #b66a18; + --rose: #a54032; + --shadow: 0 18px 50px rgba(32, 48, 47, 0.12); + --radius: 8px; + --max: 1180px; +} + +* { + box-sizing: border-box; +} + +html { + scroll-behavior: smooth; +} + +body { + margin: 0; + background: var(--paper); + color: var(--ink); + font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; + line-height: 1.6; + overflow-x: clip; + text-rendering: optimizeLegibility; +} + +img { + display: block; + max-width: 100%; + height: auto; +} + +a { + color: var(--teal-dark); + text-decoration-thickness: 0.08em; + text-underline-offset: 0.18em; +} + +a:hover { + color: var(--teal); +} + +button, +a { + -webkit-tap-highlight-color: transparent; +} + +:focus-visible { + outline: 3px solid rgba(15, 118, 110, 0.45); + outline-offset: 3px; +} + +.skip-link { + position: fixed; + left: 1rem; + top: 1rem; + z-index: 20; + transform: translateY(-160%); + background: var(--ink); + color: white; + padding: 0.7rem 0.9rem; + border-radius: var(--radius); +} + +.skip-link:focus { + transform: translateY(0); +} + +.sr-only { + position: absolute; + width: 1px; + height: 1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; +} + +.site-header { + position: sticky; + top: 0; + z-index: 10; + background: rgba(251, 252, 250, 0.92); + border-bottom: 1px solid rgba(223, 232, 228, 0.9); + backdrop-filter: blur(16px); +} + +.nav-shell { + width: min(var(--max), calc(100% - 2rem)); + min-height: 68px; + margin: 0 auto; + display: flex; + align-items: center; + justify-content: space-between; + gap: 1rem; +} + +.brand { + display: inline-flex; + align-items: center; + gap: 0.65rem; + color: var(--ink); + font-weight: 800; + text-decoration: none; +} + +.brand-mark { + display: grid; + width: 34px; + height: 34px; + place-items: center; + border-radius: 7px; + background: var(--teal); + color: white; + font-size: 1rem; +} + +.nav-links { + display: flex; + align-items: center; + gap: 0.35rem; +} + +.nav-links a { + min-height: 44px; + display: inline-flex; + align-items: center; + padding: 0.45rem 0.75rem; + border-radius: 7px; + color: #294345; + font-size: 0.94rem; + font-weight: 650; + text-decoration: none; +} + +.nav-links a:hover { + background: #edf5f1; + color: var(--teal-dark); +} + +.nav-toggle { + display: none; + width: 44px; + height: 44px; + border: 1px solid var(--line); + border-radius: 7px; + background: white; + padding: 0; +} + +.nav-toggle span[aria-hidden="true"] { + display: block; + width: 18px; + height: 2px; + margin: 4px auto; + background: var(--ink); + border-radius: 1px; +} + +.hero { + padding: 4.2rem 0 3.7rem; + background: + linear-gradient(180deg, #f6faf7 0%, var(--paper) 78%), + var(--paper); +} + +.hero-inner, +.content { + width: min(var(--max), calc(100% - 2rem)); + margin: 0 auto; +} + +.hero-inner { + display: block; +} + +.hero-copy, +.hero-figure, +.split > *, +.citation-layout > *, +.figure-panel { + min-width: 0; +} + +.eyebrow, +.section-kicker { + margin: 0 0 0.8rem; + color: var(--teal-dark); + font-size: 0.78rem; + font-weight: 800; + letter-spacing: 0; + text-transform: uppercase; + overflow-wrap: anywhere; +} + +h1, +h2, +h3 { + margin: 0; + line-height: 1.08; + letter-spacing: 0; +} + +h1 { + max-width: 1180px; + margin-inline: auto; + color: #0c2225; + font-size: clamp(2.6rem, 4.7vw, 4.55rem); + overflow-wrap: anywhere; +} + +h2 { + max-width: 760px; + font-size: clamp(1.9rem, 3.6vw, 3.2rem); +} + +.hero-summary, +.lead { + color: #39575a; + font-size: 1.12rem; + overflow-wrap: break-word; +} + +.hero-summary { + max-width: 760px; + margin: 1.35rem auto 1.5rem; +} + +.hero-copy { + text-align: center; +} + +.authors { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 0.35rem 0.85rem; + max-width: 1120px; + margin-inline: auto; + color: #243c3f; + font-weight: 700; +} + +.affiliations { + display: flex; + flex-direction: column; + align-items: center; + gap: 0.18rem; + margin-top: 0.8rem; + color: var(--muted); + font-size: 0.96rem; +} + +.logo-row { + display: flex; + align-items: center; + justify-content: center; + gap: 1.2rem; + flex-wrap: wrap; + margin: 1.3rem 0 1.6rem; +} + +.logo-row img { + width: auto; + max-height: 48px; + object-fit: contain; +} + +.actions { + display: flex; + justify-content: center; + gap: 0.75rem; + flex-wrap: wrap; + max-width: 560px; + margin-inline: auto; +} + +.button, +.copy-button { + min-height: 44px; + display: inline-flex; + align-items: center; + justify-content: center; + border: 1px solid #b7cac5; + border-radius: 7px; + background: white; + color: var(--teal-dark); + padding: 0.76rem 1rem; + font: inherit; + font-weight: 800; + text-decoration: none; + cursor: pointer; +} + +.button.primary { + background: var(--teal-dark); + border-color: var(--teal-dark); + color: white; +} + +.button.is-disabled { + border-color: #c7d8d2; + border-style: dashed; + color: #647b7d; + background: #f8fbf9; + cursor: not-allowed; +} + +.button:hover, +.copy-button:hover { + transform: translateY(-1px); +} + +.button.is-disabled:hover { + transform: none; +} + +.hero-figure { + max-width: 1140px; + margin: 1.65rem auto 0; +} + +.hero-figure figcaption { + text-align: center; +} + +.hero-card { + max-width: 1120px; + margin: 1.65rem auto 0; + padding: clamp(1.4rem, 3vw, 2rem); + border: 1px solid #cfe0da; + border-radius: var(--radius); + background: rgba(255, 255, 255, 0.72); + box-shadow: 0 16px 46px rgba(30, 58, 55, 0.09); + text-align: left; +} + +.hero-card h2 { + font-size: clamp(1.4rem, 2.5vw, 2rem); +} + +.hero-card p { + margin: 1rem 0 0; + color: #39575a; + font-size: 1.08rem; +} + +.hero-metrics { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1rem; + margin-top: 1.5rem; +} + +.hero-metrics div { + min-height: 135px; + display: grid; + align-content: center; + justify-items: center; + padding: 1rem; + border: 1px solid #d6e5e0; + border-radius: var(--radius); + background: #f9fcfa; + text-align: center; +} + +.hero-metrics strong { + color: var(--teal-dark); + font-size: clamp(2rem, 4vw, 3.2rem); + line-height: 1; +} + +.hero-metrics span { + margin-top: 0.65rem; + color: var(--muted); + font-weight: 750; +} + +.figure-panel, +.wide-figure figure { + margin: 0; +} + +.hero-figure img, +.figure-panel img, +.wide-figure img { + width: 100%; + border: 1px solid var(--line); + border-radius: var(--radius); + background: white; + box-shadow: var(--shadow); +} + +figcaption { + color: var(--muted); + font-size: 0.92rem; + margin-top: 0.7rem; +} + +.figure-link { + display: inline-flex; + margin-left: 0.45rem; + color: var(--teal-dark); + font-weight: 800; + white-space: nowrap; +} + +.section { + padding: 5rem 0; + scroll-margin-top: 78px; +} + +.metrics-band { + background: #eef6f2; + border-top: 1px solid var(--line); + border-bottom: 1px solid var(--line); +} + +.results-band { + background: #f7f8f3; + border-top: 1px solid var(--line); + border-bottom: 1px solid var(--line); +} + +.citation-band { + background: #edf5f5; + border-top: 1px solid var(--line); +} + +.metric-grid { + display: grid; + grid-template-columns: repeat(4, minmax(0, 1fr)); + gap: 1rem; + margin-top: 2rem; +} + +.metric-card { + min-height: 210px; + padding: 1.35rem; + border: 1px solid #cfe0da; + border-radius: var(--radius); + background: var(--surface); +} + +.metric-value { + display: block; + color: var(--teal-dark); + font-size: clamp(1.7rem, 3vw, 2.35rem); + font-weight: 900; + line-height: 1.05; +} + +.metric-label { + display: block; + margin-top: 0.7rem; + color: var(--ink); + font-weight: 850; +} + +.metric-card p { + margin: 0.7rem 0 0; + color: var(--muted); + font-size: 0.95rem; +} + +.split, +.method-body { + display: grid; + grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr); + gap: clamp(2rem, 5vw, 4rem); + align-items: start; +} + +.split p, +.method-body p { + color: #375256; + font-size: 1.03rem; +} + +.method-intro .lead { + max-width: 100%; +} + +.method-body { + margin-top: 2rem; + align-items: center; +} + +.method-detail { + min-width: 0; +} + +.check-list { + list-style: none; + padding: 0; + margin: 1.25rem 0 0; +} + +.check-list li { + position: relative; + padding-left: 1.5rem; + margin: 0.55rem 0; + color: #284548; +} + +.check-list li::before { + content: ""; + position: absolute; + top: 0.68rem; + left: 0; + width: 0.55rem; + height: 0.55rem; + border-radius: 50%; + background: var(--green); +} + +.wide-figure { + margin-top: 3rem; +} + +.method-steps { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1rem; + margin-top: 2rem; +} + +.method-steps article, +.insight-card { + padding: 1.2rem; + border: 1px solid var(--line); + border-radius: var(--radius); + background: white; +} + +.method-steps span { + color: var(--teal-dark); + font-size: 0.82rem; + font-weight: 900; +} + +.method-steps h3, +.insight-card h3, +.story-copy h3 { + margin-top: 0.35rem; + font-size: 1.2rem; +} + +.method-steps p, +.insight-card p, +.story-copy p { + color: #486266; +} + +.table-grid { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 1.1rem; + margin-top: 2rem; +} + +.paper-table-grid { + display: grid; + gap: 1.25rem; + margin-top: 2rem; +} + +.utility-grid { + display: grid; + grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.85fr); + gap: 1.1rem; + margin-top: 1.25rem; +} + +.table-wrap { + overflow-x: auto; + border: 1px solid var(--line); + border-radius: var(--radius); + background: white; +} + +table { + width: 100%; + border-collapse: collapse; + min-width: 420px; + font-size: 0.95rem; +} + +.paper-table { + min-width: 980px; + font-size: 0.86rem; +} + +.paper-table th, +.paper-table td { + padding: 0.56rem 0.72rem; +} + +.paper-table caption { + font-size: 0.98rem; +} + +caption { + caption-side: top; + padding: 1rem 1rem 0.2rem; + color: var(--ink); + text-align: left; + font-weight: 850; +} + +th, +td { + padding: 0.72rem 1rem; + border-bottom: 1px solid #edf1ef; + text-align: left; + vertical-align: top; +} + +thead th { + color: #36565a; + font-size: 0.78rem; + text-transform: uppercase; +} + +tbody tr:last-child th, +tbody tr:last-child td { + border-bottom: 0; +} + +.best-row th, +.best-row td { + background: #eef8f1; + color: #173d31; + font-weight: 850; +} + +.figure-grid { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 1.25rem; + margin-top: 2rem; +} + +.insight-grid { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1rem; + margin-top: 2rem; +} + +.ablation-table { + margin-top: 1.25rem; +} + +.insight-number { + display: block; + color: var(--teal-dark); + font-size: clamp(1.8rem, 3vw, 2.5rem); + font-weight: 950; + line-height: 1; +} + +.ablation-stack { + display: grid; + gap: 2.2rem; + margin-top: 2.5rem; +} + +.story-block { + display: grid; + grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr); + gap: clamp(1.3rem, 4vw, 3rem); + align-items: center; +} + +.story-block.reverse { + grid-template-columns: minmax(0, 1.28fr) minmax(260px, 0.72fr); +} + +.story-block.reverse .story-copy { + order: 2; +} + +.story-copy { + min-width: 0; +} + +.wide-panel { + min-width: 0; +} + +.paired-figures { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 1rem; +} + +.scheduler-figures .figure-panel img { + height: clamp(300px, 25vw, 380px); + object-fit: contain; +} + +.qualitative-band { + background: #f7faf8; + border-top: 1px solid var(--line); + border-bottom: 1px solid var(--line); +} + +.qualitative-layout { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 1.25rem; + margin-top: 2rem; +} + +.figure-note { + max-width: 1080px; + margin: 1rem 0 0; + color: #486266; + font-size: 1.03rem; +} + +.full-panel { + grid-column: 1 / -1; +} + +.content-warning { + display: grid; + grid-template-columns: minmax(260px, 0.45fr) minmax(0, 1fr); + gap: 1.2rem; + align-items: center; + padding: 1rem; + border: 1px solid #d7e5e0; + border-radius: var(--radius); + background: white; +} + +.content-warning strong { + color: var(--teal-dark); + font-size: 1.15rem; +} + +.content-warning p { + color: #486266; +} + +.qualitative-paper-figure { + margin-bottom: 0.75rem; +} + +.citation-layout { + display: grid; + grid-template-columns: minmax(260px, 0.65fr) minmax(0, 1.35fr); + gap: clamp(1.4rem, 4vw, 3rem); + align-items: start; +} + +.bibtex-box { + position: relative; + border: 1px solid #c7dbd8; + border-radius: var(--radius); + background: #102326; + box-shadow: var(--shadow); +} + +.bibtex-box pre { + margin: 0; + overflow-x: auto; + padding: 1.4rem; + color: #eef8f1; + font-size: 0.9rem; + line-height: 1.55; + white-space: pre-wrap; + overflow-wrap: anywhere; +} + +.copy-button { + position: absolute; + top: 0.75rem; + right: 0.75rem; + min-height: 38px; + padding: 0.45rem 0.8rem; + border-color: rgba(255,255,255,0.35); + background: rgba(255,255,255,0.12); + color: white; +} + +.site-footer { + padding: 2.2rem 0; + background: #102326; + color: #d4e4df; +} + +.footer-content { + display: flex; + align-items: center; + justify-content: space-between; + gap: 1rem; + flex-wrap: wrap; +} + +.footer-content p { + margin: 0; +} + +.footer-content code { + color: #ffffff; +} + +@media (max-width: 1000px) { + .nav-toggle { + display: block; + flex: 0 0 auto; + } + + .nav-links { + position: absolute; + left: 1rem; + right: 1rem; + top: 68px; + display: none; + flex-direction: column; + align-items: stretch; + padding: 0.55rem; + border: 1px solid var(--line); + border-radius: var(--radius); + background: white; + box-shadow: var(--shadow); + } + + .nav-links.is-open { + display: flex; + } + + .nav-links a { + justify-content: center; + } + + h1 { + font-size: clamp(2.1rem, 5.8vw, 3.15rem); + } + + .hero-inner, + .split, + .method-body, + .citation-layout, + .story-block, + .story-block.reverse, + .content-warning { + grid-template-columns: 1fr; + } + + .story-block.reverse .story-copy { + order: 0; + } + + .hero-inner { + gap: 2.4rem; + } + + .metric-grid, + .table-grid, + .utility-grid, + .figure-grid, + .method-steps, + .insight-grid, + .qualitative-layout { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } +} + +@media (max-width: 760px) { + html { + scroll-padding-top: 70px; + } + + .hero-inner, + .content, + .nav-shell { + width: calc(100% - 2rem); + max-width: var(--max); + } + + .hero { + padding-top: 2.8rem; + } + + h1 { + font-size: clamp(2.05rem, 8.8vw, 2.8rem); + line-height: 1.1; + } + + .hero-summary, + .lead { + font-size: 1rem; + } + + .metric-grid, + .table-grid, + .utility-grid, + .figure-grid, + .method-steps, + .insight-grid, + .paired-figures, + .qualitative-layout, + .hero-metrics { + grid-template-columns: 1fr; + } + + .metric-card { + min-height: 0; + } + + .actions { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + align-items: stretch; + gap: 0.7rem; + } + + .button { + width: 100%; + padding-inline: 0.65rem; + } + + .button.primary { + grid-column: 1 / -1; + } + + .scheduler-figures .figure-panel img { + height: auto; + } +} + +@media (max-width: 480px) { + .hero-inner, + .content, + .nav-shell { + width: calc(100% - 1.5rem); + max-width: var(--max); + } + + h1 { + font-size: clamp(1.85rem, 8.6vw, 2.1rem); + line-height: 1.13; + } + + .section { + padding: 3.6rem 0; + } + + .authors { + gap: 0.25rem 0.55rem; + } + + .bibtex-box pre { + padding: 4rem 1rem 1rem; + font-size: 0.82rem; + } +} + +@media (prefers-reduced-motion: reduce) { + *, + *::before, + *::after { + scroll-behavior: auto !important; + transition: none !important; + animation: none !important; + } +} diff --git a/assets/img/alpha-sensitivity-1016.webp b/assets/img/alpha-sensitivity-1016.webp new file mode 100644 index 0000000..a37ac6c Binary files /dev/null and b/assets/img/alpha-sensitivity-1016.webp differ diff --git a/assets/img/alpha-sensitivity-720.webp b/assets/img/alpha-sensitivity-720.webp new file mode 100644 index 0000000..0d793ad Binary files /dev/null and b/assets/img/alpha-sensitivity-720.webp differ diff --git a/assets/img/alpha-sensitivity.png b/assets/img/alpha-sensitivity.png new file mode 100644 index 0000000..42e2461 Binary files /dev/null and b/assets/img/alpha-sensitivity.png differ diff --git a/assets/img/geneval-qualitative-1600.webp b/assets/img/geneval-qualitative-1600.webp new file mode 100644 index 0000000..450615b Binary files /dev/null and b/assets/img/geneval-qualitative-1600.webp differ diff --git a/assets/img/geneval-qualitative-960.webp b/assets/img/geneval-qualitative-960.webp new file mode 100644 index 0000000..3fc142c Binary files /dev/null and b/assets/img/geneval-qualitative-960.webp differ diff --git a/assets/img/geneval-qualitative.png b/assets/img/geneval-qualitative.png new file mode 100644 index 0000000..b327481 Binary files /dev/null and b/assets/img/geneval-qualitative.png differ diff --git a/assets/img/mbzuai_logo.png b/assets/img/mbzuai_logo.png new file mode 100644 index 0000000..b1832da Binary files /dev/null and b/assets/img/mbzuai_logo.png differ diff --git a/assets/img/method-pipeline-1600.webp b/assets/img/method-pipeline-1600.webp new file mode 100644 index 0000000..a20b8c4 Binary files /dev/null and b/assets/img/method-pipeline-1600.webp differ diff --git a/assets/img/method-pipeline-960.webp b/assets/img/method-pipeline-960.webp new file mode 100644 index 0000000..4f20a46 Binary files /dev/null and b/assets/img/method-pipeline-960.webp differ diff --git a/assets/img/msu.png b/assets/img/msu.png new file mode 100644 index 0000000..b1fa9aa Binary files /dev/null and b/assets/img/msu.png differ diff --git a/assets/img/ood-safety-1600.webp b/assets/img/ood-safety-1600.webp new file mode 100644 index 0000000..6e88bc5 Binary files /dev/null and b/assets/img/ood-safety-1600.webp differ diff --git a/assets/img/ood-safety-960.webp b/assets/img/ood-safety-960.webp new file mode 100644 index 0000000..9c42c82 Binary files /dev/null and b/assets/img/ood-safety-960.webp differ diff --git a/assets/img/ood-safety.png b/assets/img/ood-safety.png new file mode 100644 index 0000000..bbcca5b Binary files /dev/null and b/assets/img/ood-safety.png differ diff --git a/assets/img/qualitative-full-1600.webp b/assets/img/qualitative-full-1600.webp new file mode 100644 index 0000000..b0b7de9 Binary files /dev/null and b/assets/img/qualitative-full-1600.webp differ diff --git a/assets/img/qualitative-full-960.webp b/assets/img/qualitative-full-960.webp new file mode 100644 index 0000000..9476e3e Binary files /dev/null and b/assets/img/qualitative-full-960.webp differ diff --git a/assets/img/qualitative-full.png b/assets/img/qualitative-full.png new file mode 100644 index 0000000..df31aec Binary files /dev/null and b/assets/img/qualitative-full.png differ diff --git a/assets/img/safeclip-utility-1600.webp b/assets/img/safeclip-utility-1600.webp new file mode 100644 index 0000000..a0e8695 Binary files /dev/null and b/assets/img/safeclip-utility-1600.webp differ diff --git a/assets/img/safeclip-utility-960.webp b/assets/img/safeclip-utility-960.webp new file mode 100644 index 0000000..93ded85 Binary files /dev/null and b/assets/img/safeclip-utility-960.webp differ diff --git a/assets/img/safeclip-utility.png b/assets/img/safeclip-utility.png new file mode 100644 index 0000000..c9fd9da Binary files /dev/null and b/assets/img/safeclip-utility.png differ diff --git a/assets/img/scheduler-ablation-1200.webp b/assets/img/scheduler-ablation-1200.webp new file mode 100644 index 0000000..c0fb68e Binary files /dev/null and b/assets/img/scheduler-ablation-1200.webp differ diff --git a/assets/img/scheduler-ablation-960.webp b/assets/img/scheduler-ablation-960.webp new file mode 100644 index 0000000..601defc Binary files /dev/null and b/assets/img/scheduler-ablation-960.webp differ diff --git a/assets/img/scheduler-ablation.png b/assets/img/scheduler-ablation.png new file mode 100644 index 0000000..6621c3e Binary files /dev/null and b/assets/img/scheduler-ablation.png differ diff --git a/assets/img/steering-1600.webp b/assets/img/steering-1600.webp new file mode 100644 index 0000000..679fa7e Binary files /dev/null and b/assets/img/steering-1600.webp differ diff --git a/assets/img/steering-960.webp b/assets/img/steering-960.webp new file mode 100644 index 0000000..da2b230 Binary files /dev/null and b/assets/img/steering-960.webp differ diff --git a/assets/img/steering-analysis-1600.webp b/assets/img/steering-analysis-1600.webp new file mode 100644 index 0000000..e8e1cd4 Binary files /dev/null and b/assets/img/steering-analysis-1600.webp differ diff --git a/assets/img/steering-analysis-960.webp b/assets/img/steering-analysis-960.webp new file mode 100644 index 0000000..a21c3e2 Binary files /dev/null and b/assets/img/steering-analysis-960.webp differ diff --git a/assets/img/steering-utility-1600.webp b/assets/img/steering-utility-1600.webp new file mode 100644 index 0000000..a02087e Binary files /dev/null and b/assets/img/steering-utility-1600.webp differ diff --git a/assets/img/steering-utility-960.webp b/assets/img/steering-utility-960.webp new file mode 100644 index 0000000..2db7605 Binary files /dev/null and b/assets/img/steering-utility-960.webp differ diff --git a/assets/img/steering-utility.png b/assets/img/steering-utility.png new file mode 100644 index 0000000..12a6654 Binary files /dev/null and b/assets/img/steering-utility.png differ diff --git a/assets/img/steering.png b/assets/img/steering.png new file mode 100644 index 0000000..3d4ef6b Binary files /dev/null and b/assets/img/steering.png differ diff --git a/assets/img/teaser-1600.webp b/assets/img/teaser-1600.webp new file mode 100644 index 0000000..5e986b3 Binary files /dev/null and b/assets/img/teaser-1600.webp differ diff --git a/assets/img/teaser-960.webp b/assets/img/teaser-960.webp new file mode 100644 index 0000000..a9ea202 Binary files /dev/null and b/assets/img/teaser-960.webp differ diff --git a/assets/img/teaser.png b/assets/img/teaser.png new file mode 100644 index 0000000..0ed6fa9 Binary files /dev/null and b/assets/img/teaser.png differ diff --git a/assets/img/unsafe-normal-reward-900.webp b/assets/img/unsafe-normal-reward-900.webp new file mode 100644 index 0000000..4812b08 Binary files /dev/null and b/assets/img/unsafe-normal-reward-900.webp differ diff --git a/assets/img/unsafe-normal-reward-960.webp b/assets/img/unsafe-normal-reward-960.webp new file mode 100644 index 0000000..57853f8 Binary files /dev/null and b/assets/img/unsafe-normal-reward-960.webp differ diff --git a/assets/img/unsafe-normal-reward.png b/assets/img/unsafe-normal-reward.png new file mode 100644 index 0000000..1b7e410 Binary files /dev/null and b/assets/img/unsafe-normal-reward.png differ diff --git a/assets/js/site.js b/assets/js/site.js new file mode 100644 index 0000000..417f9f9 --- /dev/null +++ b/assets/js/site.js @@ -0,0 +1,36 @@ +const navToggle = document.querySelector(".nav-toggle"); +const navLinks = document.querySelector("#site-nav"); + +if (navToggle && navLinks) { + navToggle.addEventListener("click", () => { + const isOpen = navLinks.classList.toggle("is-open"); + navToggle.setAttribute("aria-expanded", String(isOpen)); + }); + + navLinks.addEventListener("click", (event) => { + if (event.target instanceof HTMLAnchorElement) { + navLinks.classList.remove("is-open"); + navToggle.setAttribute("aria-expanded", "false"); + } + }); +} + +document.querySelectorAll("[data-copy-target]").forEach((button) => { + button.addEventListener("click", async () => { + const targetId = button.getAttribute("data-copy-target"); + const target = targetId ? document.getElementById(targetId) : null; + if (!target) return; + + const text = target.textContent ? target.textContent.trim() : ""; + try { + await navigator.clipboard.writeText(text); + const previous = button.textContent; + button.textContent = "Copied"; + window.setTimeout(() => { + button.textContent = previous; + }, 1600); + } catch { + button.textContent = "Select text"; + } + }); +}); diff --git a/assets/papers/safediff-r1.pdf b/assets/papers/safediff-r1.pdf new file mode 100644 index 0000000..d0cccb7 Binary files /dev/null and b/assets/papers/safediff-r1.pdf differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..f5e7ad8 --- /dev/null +++ b/index.html @@ -0,0 +1,707 @@ + + + + + + SafeDiffusion-R1 | Online Reward Steering for Safe Diffusion Post-Training + + + + + + + +
+ +
+ +
+
+
+
+

Safe text-to-image diffusion post-training

+

SafeDiffusion-R1: Online Reward Steering for Safe Diffusion Post-Training

+

+ Online GRPO with geometry-aware reward steering in CLIP/HPSv2 space for safer + diffusion models without paired safe/unsafe image supervision or reward model fine-tuning. +

+ +
+ Komal Kumar1 + Ankan Deria1 + Abhishek Basu1 + Fahad Shamshad1 + Hisham Cholakkal1 + Karthik Nandakumar1,2 +
+ +
+ 1Mohamed bin Zayed University of Artificial Intelligence, UAE + 2Michigan State University, USA +
+ +
+ MBZUAI logo + Michigan State University logo +
+ +
+ Paper + Code + HF Checkpoint +
+ +
+ + + SafeDiffusion-R1 teaser showing the safety-utility trade-off across GRPO training variants. + +
+ Full teaser: online reward steering improves the safety-utility trade-off during diffusion post-training. +
+
+ +
+

TL;DR

+

+ SafeDiffusion-R1 safely unlearns unsafe visual concepts by steering the reward target, + not by filtering prompts or training a separate safety classifier. The model still sees + diverse prompts, but unsafe prompt embeddings are rewarded through a safe geometric direction. +

+
+
+ 18.07% + Inappropriate content
down from 48.9% +
+
+ 31 / 15 + NudeNet detections
main / aggressive variant +
+
+ 47.83% + GenEval utility
up from 42.08% +
+
+
+
+ +
+
+ +
+
+
Headline results
+

Safer generations without sacrificing compositional utility

+
+
+ 48.9% -> 18.07% + I2P inappropriate rate +

Q16 overall inappropriate content rate for SD v1.4 compared with the main SafeDiffusion-R1 configuration.

+
+
+ 646 -> 31 + NudeNet detections +

Main reported model on I2P nudity detection, using the paper's threshold 0.6 protocol.

+
+
+ 646 -> 15 + Aggressive unsafe-anchor variant +

Lowest NudeNet detection count, with the paper's noted trade-off in broader OOD safety.

+
+
+ 42.08% -> 47.83% + GenEval overall +

Compositional generation improves when post-training with GenEval and nudity prompts.

+
+
+
+
+ +
+
+
Method
+

Reward steering in embedding space

+

+ SafeDiffusion-R1 keeps the original prompt as the model condition, but changes how unsafe prompts + are rewarded. It estimates a safety direction from safe and unsafe text anchors in HPSv2/CLIP + embedding space, then steers unsafe prompt embeddings toward that direction before computing + image-text reward. +

+
+ +
+
+ + + Embedding-space safety steering diagram showing unsafe text embeddings shifted toward a safe direction. + +
Safety is represented as a direction from unsafe anchors toward safe anchors.
+
+ +
+

+ The online GRPO loop samples multiple images per prompt, scores them with the steering reward, + normalizes advantages within each prompt group, and applies a clipped policy objective with KL + regularization. This turns unsafe prompt exposure into a safety-learning signal instead of a + reward for matching unsafe content. +

+
    +
  • No paired safe/unsafe image supervision required.
    • +
  • No separately fine-tuned safety reward model required.
    • +
  • Uses online policy samples rather than static offline generations.
    • +
  • Steering strength is set to alpha = 0.5 in the main experiments.
    • +
+
+
+ +
+
+ 01 +

Build a safety direction

+

Safe and unsafe anchor phrases are embedded with HPSv2/CLIP; their normalized mean difference defines v_safe.

+
+
+ 02 +

Steer reward targets

+

Unsafe prompt embeddings are shifted toward v_safe only for reward computation, while the diffusion model still receives the original prompt.

+
+
+ 03 +

Optimize on-policy

+

GRPO samples multiple images per prompt, normalizes rewards within each prompt group, and updates the policy with tight clipping plus KL control.

+
+
+ +
+
+ + + SafeDiffusion-R1 GRPO reward steering pipeline from prompts and anchors to steered rewards and policy loss. + +
Online sampling, steered rewards, group-relative advantages, and policy optimization.
+
+
+
+ +
+
+
Results
+

Safety and utility benchmarks

+

+ SafeDiffusion-R1 is evaluated on I2P safety metrics and GenEval compositional utility. + The main configuration improves broad inappropriate-content safety, while the aggressive + unsafe-anchor variant reports the lowest NudeNet detection count. +

+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Nudity detection on I2P with NudeNet threshold 0.6; lower is better.
MethodBreast FGenitalia FBreast MGenitalia MButtocksFeetBellyArmpitsTotal
SD v1.41832146104442171129646
DoCo16229486364122168250906
Ablating, CA298226774566180153838
Safe-DPO SD2.188131921454110125425
FMN15517192125911743424
ESD-x1016161012377753312
SLD-Med3912633217247212
UCE3551147296229182
SA3994015324915163
ESD-u141855243133121
Receler1311295102639115
MACE160972391917109
RECE806408231766
CPE, one word11232515131566
CPE, four words61322881040
AdvUnlearn11000130823
SAeUron4001321718
SafeDiffusion-R1, main10120891031
SafeDiffusion-R1, unsafe-anchor variant3000043515
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
OOD inappropriate content rate on I2P with Q16; lower is better. NS means not supported.
MethodHateHarassmentViolenceSelf-harmSexualShockingIllegalOverall
SD v1.444.237.546.347.960.259.540.048.9
EraseDiffNSNSNS40.649.849.4NS44.9
SPMNSNSNS15.8852.569.1NS54.6
FMN37.725.047.846.859.158.137.047.8
Ablating40.832.943.347.460.357.837.945.9
ESD-x34.130.240.536.840.245.228.936.6
SLD22.522.131.830.052.440.522.133.7
ESD-u26.824.035.133.735.040.126.732.8
UCE36.429.534.130.825.541.129.031.3
Receler28.621.727.124.829.434.821.327.0
CASTEER29.0025.6127.7826.2220.7334.0017.6125.58
Safe-DPONS22.5932.4333.3320.7NS30.3019.82
SafeDiffusion-R116.0225.1217.3315.8611.6014.6026.0018.07
SafeDiffusion-R1, unsafe-anchor variant30.7439.5632.0136.8327.1826.1740.4433.43
+
+
+ +
+
+ + + + + + + + + + + + + + + + + + + + + +
Task-wise GenEval accuracy, higher is better.
TaskSD1.4RECESD-SafeR1, GenEval + nudityR1, nudity only
single_object97.81%94.69%97.19%99.06%96.88%
two_object39.65%27.02%38.64%61.36%43.94%
counting31.56%29.69%34.38%30.00%35.00%
colors74.73%71.01%77.13%76.33%78.19%
position3.00%4.00%3.00%9.75%4.00%
color_attr5.75%3.75%5.00%10.50%6.75%
Overall42.08%38.36%42.55%47.83%44.12%
+
+ +
+ + + + + + + + + + + + + + + + + + + +
CLIP-T and FID for nudity-erased models.
ModelCLIP-TFID
Baseline SD1.40.31337.35
EraseDiff0.179307.70
ESD0.30340.73
FMN0.31138.10
SPM0.31238.05
UCE0.31137.41
SafeDiffusion-R10.31152.28
R1, negative anchor0.31248.50
+
+
+
+
+ +
+
+
Ablation
+

Why steering reward is the stable choice

+

+ The paper studies scheduler choice, reward design, anchor construction, and steering strength. + The pattern is consistent: direct negative penalties suppress unsafe content but damage utility, + while geometric steering keeps the reward informative for both unsafe and benign prompts. +

+
+ +
+
+ 0.002 +

Lowest MeanUnsafe

+

Steering reward reaches MeanUnsafe 0.002 while keeping CLIP-T at 28.74, outperforming SafeCLIP and LLaVA-penalty variants.

+
+
+ alpha = 0.5 +

Moderate steering

+

The default steering strength improves safety while preserving the gap between safe and unsafe prompt clusters.

+
+
+ 9 schedulers +

Robust inference

+

With safety steering, multiple schedulers converge toward near-zero unsafe score by epoch 300.

+
+
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Reward design ablation, lower MeanUnsafe is better.
RewardCLIP-TMeanUnsafe
Base SD v1.427.070.990
SafeCLIP, 7K positive28.760.246
SafeCLIP + LLaVA penalty28.440.151
-1 x CLIP, negative only23.310.018
Steering reward28.740.002
+
+
+ +
+
+
+
Steering strength
+

Anchors move prompts toward safety without collapsing geometry

+

+ UMAP visualizations show that synonyms, keyword-minimal prompts, and negations are all pushed + toward the safe side as steering strength increases. The important behavior is not just higher + safe score; the relative separation between safe and unsafe prompts remains useful. +

+
+
+ + + UMAP and safety score analysis for steering strength across prompt perturbation strategies. + +
+ Prompt steering remains consistent across synonyms, minimal keywords, and negation. + Open full-size +
+
+
+ +
+
+
Reward design
+

Negative-only reward is safe but not useful

+

+ A pure negative CLIP penalty can drive unsafe score down, but this comparison shows utility collapse: + CLIP-T drops to 23.31 and FID rises to 167.49. Steering reward avoids that failure mode by using + positive and negative anchors to define a direction rather than only punishing unsafe alignment. +

+
+
+ + + Utility comparison of SafeCLIP variants and steering reward on benign prompts. + +
+ Utility comparison: steering reward preserves benign prompt quality more reliably than weaker reward variants. + Open full-size +
+
+
+ +
+
+
Schedulers
+

Safety becomes less sensitive to sampler choice

+

+ Without steering, unsafe scores remain high and scheduler-dependent. With steering, the gap + between nine schedulers largely disappears as training progresses, indicating that safety is + learned by the model rather than patched at inference. +

+
+
+
+ + + Unsafe score without safety steering stays high across training. + +
Without steering, unsafe score remains high.
+
+
+ + + Scheduler ablation showing unsafe score decreases over training epochs for multiple schedulers. + +
With steering, schedulers converge near zero.
+
+
+
+
+
+ +
+
+
Qualitative results
+

Safety suppression with utility preservation

+

+ Paper qualitative examples show how SafeDiffusion-R1 suppresses unsafe visual concepts while + preserving benign composition, color attributes, and spatial relations across checkpoints and + prompt categories. +

+

+ The first grid compares SafeDiffusion-R1 with prior safety and erasure methods on the same + challenging prompts, making it easier to judge whether the unsafe concept is removed without + destroying the intended scene. +

+
+ +
+
+ + + Full paper qualitative comparison showing outputs before and after SafeDiffusion-R1 safety post-training. + +
+ Method-by-method qualitative comparison: the Ours column suppresses unsafe concepts while keeping the scene coherent. + Open full-size +
+
+ +
+ + + Benign GenEval qualitative comparison showing compositional prompt outputs across methods. + +
+ Benign GenEval-style prompts: SafeDiffusion-R1 keeps semantic structure and visual coherence. + Open full-size +
+
+ +
+ + + Utility preservation across SafeDiffusion-R1 training checkpoints on benign prompts. + +
Training progression: compositional utility is preserved across checkpoints.
+
+ +
+ + + OOD inappropriate content category progression across harm classes. + +
Category progression supports OOD generalization beyond nudity prompts.
+
+
+
+ +
+
+
+
Citation
+

BibTeX

+

+ Please cite SafeDiffusion-R1 if this project page, paper, or released checkpoints support your work. +

+
+
+ + 
@misc{safediff_r1_2026,
+  title  = {SafeDiffusion-R1: Online Reward Steering for Safe Diffusion Post-Training},
+  author = {Kumar, Komal and Deria, Ankan and Basu, Abhishek and Shamshad, Fahad and Cholakkal, Hisham and Nandakumar, Karthik},
+  year   = {2026},
+  note   = {Project page}
+}
+
+
+
+
+ + + + + +