File size: 50,725 Bytes
8e874f5
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
79487ea
f8d083d
8e874f5
 
 
 
f8d083d
8e874f5
 
 
f8d083d
8e874f5
 
 
f8d083d
8e874f5
 
f8d083d
 
 
 
 
8e874f5
 
 
 
f8d083d
8e874f5
 
f8d083d
 
 
 
 
 
8e874f5
f8d083d
8e874f5
 
 
f8d083d
8e874f5
 
f8d083d
 
 
 
 
8e874f5
 
 
 
90f1cca
8e874f5
 
90f1cca
 
 
f8d083d
90f1cca
 
f8d083d
 
8e874f5
 
 
f8d083d
8e874f5
 
 
f8d083d
 
 
 
 
 
 
 
 
 
 
8e874f5
 
f8d083d
8e874f5
 
 
f8d083d
8e874f5
 
 
 
 
f8d083d
 
 
8e874f5
 
 
 
 
 
 
79487ea
8e874f5
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>QAFD-RAG: Query-Aware Flow Diffusion for Graph-Based RAG</title>
  <link rel="preconnect" href="https://fonts.googleapis.com" />
  <link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
  <style>
    :root {
      --navy-900: #0a1628; --navy-800: #0f2140; --navy-700: #1e3a5f;
      --blue-600: #2563eb; --blue-500: #3b82f6; --blue-400: #60a5fa;
      --blue-300: #93c5fd; --blue-200: #bfdbfe; --blue-100: #dbeafe; --blue-50: #eff6ff;
      --slate-900: #0f172a; --slate-800: #1e293b; --slate-700: #334155;
      --slate-500: #64748b; --slate-400: #94a3b8; --slate-300: #cbd5e1;
      --slate-200: #e2e8f0; --slate-100: #f1f5f9; --slate-50: #f8fafc;
      --white: #ffffff; --radius: 10px; --radius-lg: 16px;
    }
    * { margin: 0; padding: 0; box-sizing: border-box; }
    body { font-family: 'DM Sans', -apple-system, sans-serif; color: var(--slate-800); line-height: 1.6; background: var(--white); -webkit-font-smoothing: antialiased; }

    .hero {
      background: linear-gradient(155deg, #d6e6f7 0%, #dbeafe 40%, #e8f1fc 70%, #eff6ff 100%);
      color: var(--slate-800); padding: 36px 20px 40px; text-align: center;
      position: relative; overflow: hidden;
    }
    .hero::before {
      content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
      background: radial-gradient(ellipse at 30% 50%, rgba(37,99,235,0.04) 0%, transparent 60%),
                  radial-gradient(ellipse at 70% 30%, rgba(59,130,246,0.03) 0%, transparent 50%);
      pointer-events: none;
    }
    .hero-content { position: relative; z-index: 1; }

    .graph-wrap {
      margin: 0 auto 16px; width: 480px; height: 280px;
      animation: logoFadeIn 1s ease-out;
    }
    @keyframes logoFadeIn { from { opacity:0; transform: scale(0.9) translateY(10px); } to { opacity:1; transform: scale(1) translateY(0); } }
    @keyframes waterFlow { 0% { stroke-dashoffset: var(--len); opacity:0.85; } 100% { stroke-dashoffset:0; opacity:0.85; } }
    @keyframes pipeFadeIn { 0% { opacity:0; } 100% { opacity: var(--pipe-op, 0.7); } }
    @keyframes sheenFadeIn { 0% { opacity:0; } 100% { opacity: var(--sheen-op, 0.4); } }
    @keyframes nodeAppear { 0% { transform:scale(0); opacity:0; } 60% { transform:scale(1.2); opacity:1; } 100% { transform:scale(1); opacity:1; } }
    @keyframes fadeUp { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
    @keyframes seedPulse { 0%,100% { r: 14; } 50% { r: 17; } }
    
    
    
    

    .btn-group { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; animation:fadeUp 0.6s ease-out 0.6s both; }
    .btn { display:inline-flex; align-items:center; gap:7px; padding:10px 22px; border-radius:50px; font-size:0.9rem; font-weight:600; text-decoration:none; transition:all 0.2s; font-family:inherit; }
    .btn:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,0.2); }
    .btn-primary { background:var(--blue-600); color:#fff; }
    .btn-outline { background:rgba(30,58,138,0.06); color:var(--slate-800); border:1.5px solid var(--slate-300); }
    .btn-outline:hover { border-color:var(--blue-500); background:rgba(37,99,235,0.08); }
    .btn svg { width:17px; height:17px; flex-shrink:0; }

    .container { max-width:940px; margin:0 auto; padding:0 24px; }
    section { padding:64px 0; }
    section.alt { background:var(--slate-50); }
    section h2 { font-size:1.7rem; font-weight:700; margin-bottom:10px; text-align:center; letter-spacing:-0.3px; }
    section .section-sub { text-align:center; color:var(--slate-500); font-size:1rem; margin-bottom:32px; max-width:600px; margin-left:auto; margin-right:auto; }
    .about-text { font-size:1.02rem; line-height:1.85; color:var(--slate-500); text-align:center; max-width:680px; margin:0 auto 36px; }
    .duo-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
    .card { background:var(--white); border:1px solid var(--slate-200); border-radius:var(--radius-lg); padding:28px; transition:box-shadow 0.2s; }
    .card:hover { box-shadow:0 4px 20px rgba(0,0,0,0.06); }
    .card h3 { color:var(--blue-600); font-size:1.05rem; font-weight:700; margin-bottom:10px; }
    .card p, .card li { font-size:0.93rem; color:var(--slate-500); line-height:1.7; }
    .card ol { padding-left:18px; } .card li { margin-bottom:6px; } .card li strong { color:var(--slate-800); }
    .figure-row { display:flex; gap:18px; justify-content:center; flex-wrap:wrap; margin-top:8px; }
    .figure-card { text-align:center; background:var(--white); border:1px solid var(--slate-200); border-radius:var(--radius-lg); padding:16px; flex:1; min-width:220px; max-width:280px; transition:box-shadow 0.2s, transform 0.2s; }
    .figure-card:hover { box-shadow:0 6px 24px rgba(0,0,0,0.07); transform:translateY(-2px); }
    .figure-card img { width:100%; border-radius:6px; }
    .figure-card .caption { margin-top:10px; font-size:0.88rem; font-weight:700; color:var(--slate-700); }
    .figure-card .caption small { font-weight:500; color:var(--slate-400); }
    .bench-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; }
    .bench-item { background:var(--white); border:1px solid var(--slate-200); border-radius:var(--radius-lg); padding:22px 18px; text-align:center; transition:box-shadow 0.2s; }
    .bench-item:hover { box-shadow:0 4px 16px rgba(0,0,0,0.06); }
    .bench-item .task { font-weight:700; font-size:1rem; color:var(--blue-600); margin-bottom:4px; }
    .bench-item .dataset { font-size:0.85rem; color:var(--slate-500); }
    .bench-item .metrics { font-size:0.78rem; color:var(--slate-400); margin-top:6px; }
    .models-text { text-align:center; color:var(--slate-500); font-size:1rem; line-height:2; }
    .models-text strong { color:var(--slate-700); }
    pre { background:var(--slate-900); color:var(--slate-300); border-radius:var(--radius-lg); padding:24px; overflow-x:auto; font-size:0.85rem; line-height:1.65; margin-top:16px; }
    code { font-family:'JetBrains Mono','SF Mono',monospace; }
    pre .comment { color:var(--slate-500); } pre .string { color:#7dd3fc; } pre .keyword { color:var(--blue-400); }
    section h3 { font-size:1.1rem; font-weight:700; margin:28px 0 8px; color:var(--slate-700); }
    footer { background:var(--slate-900); color:var(--slate-400); padding:36px 20px; text-align:center; font-size:0.85rem; }
    footer a { color:var(--blue-300); text-decoration:none; } footer a:hover { text-decoration:underline; }
    footer .sep { margin:0 8px; opacity:0.4; }
    @media (max-width:768px) {
      .hero h1 { font-size:2.2rem; }
      .graph-wrap { width:100%; max-width:480px; height:auto; aspect-ratio:420/280; }
      .duo-grid { grid-template-columns:1fr; }
      .figure-card { max-width:100%; }
    }
  </style>
</head>
<body>
<header class="hero">
  <div class="hero-content">
    <div class="graph-wrap">
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 420 280" width="100%" height="100%">
        <defs>
          <radialGradient id="src" cx="40%" cy="32%"><stop offset="0%" stop-color="#1E40AF"/><stop offset="45%" stop-color="#1E3A8A"/><stop offset="100%" stop-color="#172554"/></radialGradient>
          <radialGradient id="srcSp" cx="34%" cy="26%"><stop offset="0%" stop-color="#FFF" stop-opacity="0.9"/><stop offset="18%" stop-color="#93C5FD" stop-opacity="0.3"/><stop offset="100%" stop-color="#FFF" stop-opacity="0"/></radialGradient>
          <radialGradient id="srcGl" cx="50%" cy="50%" r="50%"><stop offset="0%" stop-color="#3B82F6" stop-opacity="0.5"/><stop offset="50%" stop-color="#1E3A8A" stop-opacity="0.15"/><stop offset="100%" stop-color="#172554" stop-opacity="0"/></radialGradient>
          <radialGradient id="s1" cx="38%" cy="28%"><stop offset="0%" stop-color="#60A5FA"/><stop offset="45%" stop-color="#2563EB"/><stop offset="100%" stop-color="#1E3A8A"/></radialGradient>
          <radialGradient id="s1sp" cx="32%" cy="24%"><stop offset="0%" stop-color="#FFF" stop-opacity="0.85"/><stop offset="22%" stop-color="#BFDBFE" stop-opacity="0.2"/><stop offset="100%" stop-color="#FFF" stop-opacity="0"/></radialGradient>
          <radialGradient id="m1" cx="38%" cy="28%"><stop offset="0%" stop-color="#93C5FD"/><stop offset="50%" stop-color="#3B82F6"/><stop offset="100%" stop-color="#2563EB"/></radialGradient>
          <radialGradient id="m1sp" cx="32%" cy="24%"><stop offset="0%" stop-color="#FFF" stop-opacity="0.7"/><stop offset="20%" stop-color="#FFF" stop-opacity="0.12"/><stop offset="100%" stop-color="#FFF" stop-opacity="0"/></radialGradient>
          <radialGradient id="w1" cx="38%" cy="28%"><stop offset="0%" stop-color="#BFDBFE"/><stop offset="50%" stop-color="#93C5FD"/><stop offset="100%" stop-color="#60A5FA"/></radialGradient>
          <radialGradient id="w1sp" cx="32%" cy="24%"><stop offset="0%" stop-color="#FFF" stop-opacity="0.75"/><stop offset="18%" stop-color="#FFF" stop-opacity="0.12"/><stop offset="100%" stop-color="#FFF" stop-opacity="0"/></radialGradient>
          <radialGradient id="st1" cx="38%" cy="28%"><stop offset="0%" stop-color="#DBEAFE"/><stop offset="50%" stop-color="#BFDBFE"/><stop offset="100%" stop-color="#93C5FD"/></radialGradient>
          <radialGradient id="lf" cx="38%" cy="28%"><stop offset="0%" stop-color="#EFF6FF"/><stop offset="50%" stop-color="#DBEAFE"/><stop offset="100%" stop-color="#BFDBFE"/></radialGradient>
          <linearGradient id="pSh" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" stop-color="#FFF" stop-opacity="0.25"/><stop offset="40%" stop-color="#93C5FD" stop-opacity="0.08"/><stop offset="100%" stop-color="#FFF" stop-opacity="0"/></linearGradient>
          <filter id="sB" x="-80%" y="-80%" width="260%" height="260%"><feGaussianBlur in="SourceGraphic" stdDeviation="7" result="b1"/><feGaussianBlur in="SourceGraphic" stdDeviation="3" result="b2"/><feMerge><feMergeNode in="b1"/><feMergeNode in="b2"/></feMerge></filter>
          <filter id="nG" x="-40%" y="-40%" width="180%" height="180%"><feGaussianBlur stdDeviation="2.5" result="b"/><feMerge><feMergeNode in="b"/><feMergeNode in="SourceGraphic"/></feMerge></filter>
          <filter id="sG" x="-40%" y="-40%" width="180%" height="180%"><feGaussianBlur stdDeviation="4" result="b"/><feMerge><feMergeNode in="b"/><feMergeNode in="SourceGraphic"/></feMerge></filter>
        </defs>

        <!-- ========= BACKGROUND KNOWLEDGE GRAPH (always visible, gray) ========= -->
        <g opacity="0.15" stroke="#94A3B8" stroke-width="0.7" fill="none">
          <line x1="15" y1="60" x2="40" y2="30"/><line x1="40" y1="30" x2="75" y2="22"/>
          <line x1="15" y1="60" x2="10" y2="110"/><line x1="10" y1="110" x2="25" y2="160"/>
          <line x1="25" y1="160" x2="12" y2="210"/><line x1="12" y1="210" x2="40" y2="250"/>
          <line x1="40" y1="30" x2="50" y2="75"/><line x1="50" y1="75" x2="30" y2="120"/>
          <line x1="30" y1="120" x2="55" y2="155"/><line x1="55" y1="155" x2="25" y2="160"/>
          <line x1="75" y1="22" x2="95" y2="55"/><line x1="95" y1="55" x2="75" y2="95"/>
          <line x1="75" y1="95" x2="50" y2="75"/><line x1="95" y1="55" x2="130" y2="40"/>
          <line x1="75" y1="95" x2="110" y2="120"/><line x1="55" y1="155" x2="85" y2="180"/>
          <line x1="85" y1="180" x2="65" y2="220"/><line x1="65" y1="220" x2="40" y2="250"/>
          <line x1="85" y1="180" x2="120" y2="200"/><line x1="120" y1="200" x2="100" y2="240"/>
          <line x1="100" y1="240" x2="130" y2="265"/><line x1="350" y1="22" x2="385" y2="15"/>
          <line x1="385" y1="15" x2="410" y2="40"/><line x1="410" y1="40" x2="405" y2="85"/>
          <line x1="405" y1="85" x2="410" y2="135"/><line x1="410" y1="135" x2="400" y2="180"/>
          <line x1="400" y1="180" x2="408" y2="230"/><line x1="408" y1="230" x2="390" y2="260"/>
          <line x1="350" y1="22" x2="370" y2="60"/><line x1="370" y1="60" x2="405" y2="85"/>
          <line x1="370" y1="60" x2="355" y2="100"/><line x1="355" y1="100" x2="375" y2="140"/>
          <line x1="375" y1="140" x2="400" y2="180"/><line x1="375" y1="140" x2="350" y2="175"/>
          <line x1="350" y1="175" x2="370" y2="215"/><line x1="370" y1="215" x2="390" y2="260"/>
          <line x1="350" y1="175" x2="320" y2="200"/><line x1="320" y1="200" x2="340" y2="240"/>
          <line x1="340" y1="240" x2="308" y2="260"/><line x1="130" y1="40" x2="170" y2="18"/>
          <line x1="170" y1="18" x2="220" y2="12"/><line x1="220" y1="12" x2="275" y2="18"/>
          <line x1="275" y1="18" x2="320" y2="12"/><line x1="320" y1="12" x2="350" y2="22"/>
          <line x1="130" y1="265" x2="175" y2="270"/><line x1="175" y1="270" x2="220" y2="265"/>
          <line x1="220" y1="265" x2="260" y2="255"/><line x1="260" y1="255" x2="308" y2="260"/>
          
          
          
          <line x1="320" y1="200" x2="290" y2="220"/>
          <line x1="290" y1="220" x2="260" y2="255"/>
          <line x1="130" y1="40" x2="158" y2="92"/><line x1="110" y1="120" x2="158" y2="148"/>
          <line x1="120" y1="200" x2="158" y2="175"/><line x1="355" y1="100" x2="325" y2="118"/>
          <line x1="375" y1="140" x2="335" y2="165"/><line x1="275" y1="18" x2="270" y2="45"/>
          <line x1="170" y1="18" x2="210" y2="60"/>
          <line x1="262" y1="92" x2="262" y2="148"/><line x1="210" y1="60" x2="262" y2="92"/>
          <line x1="158" y1="92" x2="210" y2="60"/><line x1="262" y1="148" x2="210" y2="175"/>
          <line x1="210" y1="175" x2="158" y2="148"/><line x1="158" y1="92" x2="158" y2="148"/>
          <line x1="262" y1="92" x2="305" y2="68"/><line x1="305" y1="68" x2="325" y2="118"/>
          <line x1="325" y1="118" x2="262" y2="148"/><line x1="158" y1="92" x2="112" y2="62"/>
          <line x1="112" y1="62" x2="92" y2="35"/><line x1="210" y1="60" x2="210" y2="25"/>
          <line x1="210" y1="175" x2="210" y2="218"/><line x1="210" y1="218" x2="190" y2="250"/>
          <line x1="325" y1="118" x2="335" y2="165"/><line x1="305" y1="68" x2="322" y2="35"/>
          <line x1="158" y1="148" x2="118" y2="178"/>
        </g>
        <g fill="#B0BEC5" opacity="0.22">
          <circle cx="15" cy="60" r="2.5"/><circle cx="40" cy="30" r="2.2"/><circle cx="75" cy="22" r="2.2"/>
          <circle cx="10" cy="110" r="2"/><circle cx="25" cy="160" r="2.2"/><circle cx="12" cy="210" r="2"/>
          <circle cx="40" cy="250" r="2"/><circle cx="50" cy="75" r="2.2"/><circle cx="30" cy="120" r="2"/>
          <circle cx="55" cy="155" r="2.2"/><circle cx="95" cy="55" r="2.5"/><circle cx="75" cy="95" r="2.2"/>
          <circle cx="110" cy="120" r="2"/><circle cx="130" cy="40" r="2.2"/><circle cx="85" cy="180" r="2"/>
          <circle cx="65" cy="220" r="2"/><circle cx="120" cy="200" r="2.2"/><circle cx="100" cy="240" r="2"/>
          <circle cx="130" cy="265" r="2"/><circle cx="170" cy="18" r="2.2"/><circle cx="220" cy="12" r="2.2"/>
          <circle cx="275" cy="18" r="2"/><circle cx="320" cy="12" r="2"/><circle cx="350" cy="22" r="2.2"/>
          <circle cx="385" cy="15" r="2"/><circle cx="410" cy="40" r="2"/><circle cx="405" cy="85" r="2.2"/>
          <circle cx="410" cy="135" r="2"/><circle cx="400" cy="180" r="2.2"/><circle cx="408" cy="230" r="2"/>
          <circle cx="390" cy="260" r="2"/><circle cx="370" cy="60" r="2.5"/><circle cx="355" cy="100" r="2.5"/>
          <circle cx="375" cy="140" r="2.2"/><circle cx="350" cy="175" r="2.2"/><circle cx="370" cy="215" r="2"/>
          <circle cx="320" cy="200" r="2.2"/><circle cx="340" cy="240" r="2"/><circle cx="308" cy="260" r="2"/>
          <circle cx="290" cy="220" r="2"/><circle cx="260" cy="255" r="2"/><circle cx="175" cy="270" r="2"/>
          <circle cx="220" cy="265" r="2"/><circle cx="270" cy="45" r="2"/><circle cx="210" cy="60" r="2"/>
          <circle cx="325" cy="118" r="3"/><circle cx="305" cy="68" r="2.8"/>
          <circle cx="262" cy="148" r="2.8"/><circle cx="262" cy="92" r="2.8"/>
          <circle cx="210" cy="175" r="2.5"/><circle cx="158" cy="92" r="2.5"/>
          <circle cx="158" cy="148" r="2.2"/><circle cx="112" cy="62" r="2.2"/>
          <circle cx="92" cy="35" r="2"/><circle cx="210" cy="25" r="2"/>
          <circle cx="210" cy="218" r="2.2"/><circle cx="190" cy="250" r="2"/>
          <circle cx="335" cy="165" r="2"/><circle cx="118" cy="178" r="2"/>
          <circle cx="322" cy="35" r="2"/>
        </g>

        <!--
          PHASE 1: BUILD — water shoots from source, pipe+node appear where it lands
          PHASE 2: LOOP — after build, continuous flow from source outward
          
          Each element uses <animate> with begin= for precise timing.
          Pipe: starts invisible, fades in when water arrives
          Node: starts invisible, pops when pipe reaches it
          Water: draws from source outward using stroke-dashoffset
        -->

        <!-- ======= SOURCE (0s) ======= -->
        <circle cx="325" cy="118" r="20" fill="url(#srcGl)" filter="url(#sB)" opacity="0"><animate attributeName="opacity" to="1" dur="0.4s" begin="0.2s" fill="freeze"/></circle>
        <g filter="url(#sG)" opacity="0"><animate attributeName="opacity" to="1" dur="0.4s" begin="0.2s" fill="freeze"/>
          <circle cx="325" cy="118" r="14" fill="url(#src)"/><circle cx="325" cy="118" r="14" fill="url(#srcSp)"/>
          <ellipse cx="320" cy="111" rx="4.5" ry="3" fill="#FFF" opacity="0.5"/>
        </g>

        <!-- ======= HOP 1: Source→G(305,68) and Source→D(262,148) ======= -->
        <!-- Water Source→G -->
        <path d="M325,118 C318,100 312,85 305,68" fill="none" stroke="#7DD3FC" stroke-width="5.5" stroke-linecap="round" stroke-dasharray="55" stroke-dashoffset="55" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.6s" begin="0.5s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="0.5s" fill="freeze"/></path>
        <!-- Pipe Source→G fades in -->
        <path d="M305,68 C312,85 318,100 325,118" fill="none" stroke="#172554" stroke-width="10" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.9" dur="0.3s" begin="0.7s" fill="freeze"/></path>
        <path d="M305,68 C312,85 318,100 325,118" fill="none" stroke="url(#pSh)" stroke-width="4.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.55" dur="0.3s" begin="0.75s" fill="freeze"/></path>
        <!-- G node pops -->
        <g filter="url(#nG)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="0.85s" fill="freeze"/>
          <circle cx="305" cy="68" r="9" fill="url(#s1)"/><circle cx="305" cy="68" r="9" fill="url(#s1sp)"/>
        </g>

        <!-- Water Source→D -->
        <path d="M325,118 C305,128 282,138 262,148" fill="none" stroke="#7DD3FC" stroke-width="5" stroke-linecap="round" stroke-dasharray="75" stroke-dashoffset="75" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.7s" begin="0.55s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="0.55s" fill="freeze"/></path>
        <path d="M262,148 C282,138 305,128 325,118" fill="none" stroke="#172554" stroke-width="9.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.88" dur="0.3s" begin="0.8s" fill="freeze"/></path>
        <path d="M262,148 C282,138 305,128 325,118" fill="none" stroke="url(#pSh)" stroke-width="4.2" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.52" dur="0.3s" begin="0.85s" fill="freeze"/></path>
        <g filter="url(#nG)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="0.95s" fill="freeze"/>
          <circle cx="262" cy="148" r="10" fill="url(#s1)"/><circle cx="262" cy="148" r="10" fill="url(#s1sp)"/>
        </g>

        <!-- ======= HOP 2: G→C and D→C (converging) ======= -->
        <path d="M305,68 C290,72 275,82 262,92" fill="none" stroke="#7DD3FC" stroke-width="5" stroke-linecap="round" stroke-dasharray="55" stroke-dashoffset="55" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.6s" begin="1.0s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="1.0s" fill="freeze"/></path>
        <path d="M262,92 C275,82 290,72 305,68" fill="none" stroke="#172554" stroke-width="9.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.86" dur="0.3s" begin="1.2s" fill="freeze"/></path>
        <path d="M262,92 C275,82 290,72 305,68" fill="none" stroke="url(#pSh)" stroke-width="4.2" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.5" dur="0.3s" begin="1.25s" fill="freeze"/></path>

        <path d="M262,148 C262,130 262,110 262,92" fill="none" stroke="#7DD3FC" stroke-width="5" stroke-linecap="round" stroke-dasharray="56" stroke-dashoffset="56" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.55s" begin="1.05s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="1.05s" fill="freeze"/></path>
        <path d="M262,92 C262,110 262,130 262,148" fill="none" stroke="#172554" stroke-width="9.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.84" dur="0.3s" begin="1.25s" fill="freeze"/></path>
        <path d="M262,92 C262,110 262,130 262,148" fill="none" stroke="url(#pSh)" stroke-width="4.2" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.5" dur="0.3s" begin="1.3s" fill="freeze"/></path>

        <g filter="url(#nG)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="1.35s" fill="freeze"/>
          <circle cx="262" cy="92" r="10" fill="url(#s1)"/><circle cx="262" cy="92" r="10" fill="url(#s1sp)"/>
        </g>

        <!-- ======= HOP 3: C→B→A (6-ring top) and D→E→F (6-ring bottom) ======= -->
        <!-- C→B -->
        <path d="M262,92 C245,78 228,68 210,60" fill="none" stroke="#93C5FD" stroke-width="4.2" stroke-linecap="round" stroke-dasharray="62" stroke-dashoffset="62" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.6s" begin="1.5s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="1.5s" fill="freeze"/></path>
        <path d="M210,60 C228,68 245,78 262,92" fill="none" stroke="#1E3A8A" stroke-width="8.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.72" dur="0.3s" begin="1.7s" fill="freeze"/></path>
        <path d="M210,60 C228,68 245,78 262,92" fill="none" stroke="url(#pSh)" stroke-width="3.8" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.45" dur="0.3s" begin="1.75s" fill="freeze"/></path>
        <g filter="url(#nG)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="1.85s" fill="freeze"/>
          <circle cx="210" cy="60" r="9" fill="url(#s1)"/><circle cx="210" cy="60" r="9" fill="url(#s1sp)"/>
        </g>

        <!-- B→A -->
        <path d="M210,60 C192,68 175,80 158,92" fill="none" stroke="#93C5FD" stroke-width="3.8" stroke-linecap="round" stroke-dasharray="65" stroke-dashoffset="65" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.6s" begin="1.9s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="1.9s" fill="freeze"/></path>
        <path d="M158,92 C175,80 192,68 210,60" fill="none" stroke="#1E3A8A" stroke-width="8" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.7" dur="0.3s" begin="2.1s" fill="freeze"/></path>
        <path d="M158,92 C175,80 192,68 210,60" fill="none" stroke="url(#pSh)" stroke-width="3.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.45" dur="0.3s" begin="2.15s" fill="freeze"/></path>
        <g filter="url(#nG)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="2.25s" fill="freeze"/>
          <circle cx="158" cy="92" r="9" fill="url(#s1)"/><circle cx="158" cy="92" r="9" fill="url(#s1sp)"/>
        </g>

        <!-- D→E -->
        <path d="M262,148 C245,158 228,168 210,175" fill="none" stroke="#93C5FD" stroke-width="3.8" stroke-linecap="round" stroke-dasharray="62" stroke-dashoffset="62" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.6s" begin="1.5s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="1.5s" fill="freeze"/></path>
        <path d="M210,175 C228,168 245,158 262,148" fill="none" stroke="#1E3A8A" stroke-width="7.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.68" dur="0.3s" begin="1.7s" fill="freeze"/></path>
        <path d="M210,175 C228,168 245,158 262,148" fill="none" stroke="url(#pSh)" stroke-width="3.2" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.42" dur="0.3s" begin="1.75s" fill="freeze"/></path>
        <g filter="url(#nG)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="1.85s" fill="freeze"/>
          <circle cx="210" cy="175" r="8" fill="url(#m1)"/><circle cx="210" cy="175" r="8" fill="url(#m1sp)"/>
        </g>

        <!-- E→F -->
        <path d="M210,175 C192,168 175,158 158,148" fill="none" stroke="#BFDBFE" stroke-width="2.8" stroke-linecap="round" stroke-dasharray="65" stroke-dashoffset="65" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.6s" begin="1.9s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="1.9s" fill="freeze"/></path>
        <path d="M158,148 C175,158 192,168 210,175" fill="none" stroke="#1D4ED8" stroke-width="5.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.5" dur="0.3s" begin="2.1s" fill="freeze"/></path>
        <g filter="url(#nG)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="2.25s" fill="freeze"/>
          <circle cx="158" cy="148" r="7" fill="url(#m1)"/><circle cx="158" cy="148" r="7" fill="url(#m1sp)"/>
        </g>

        <!-- F→A ring close -->
        <path d="M158,148 C158,130 158,112 158,92" fill="none" stroke="#BFDBFE" stroke-width="2.2" stroke-linecap="round" stroke-dasharray="56" stroke-dashoffset="56" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.5s" begin="2.3s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="2.3s" fill="freeze"/></path>
        <path d="M158,92 C158,112 158,130 158,148" fill="none" stroke="#1D4ED8" stroke-width="5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.48" dur="0.3s" begin="2.5s" fill="freeze"/></path>

        <!-- ======= HOP 4: BRANCHES ======= -->
        <!-- A→M1 -->
        <path d="M158,92 C142,80 128,70 112,62" fill="none" stroke="#93C5FD" stroke-width="3.2" stroke-linecap="round" stroke-dasharray="52" stroke-dashoffset="52" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.5s" begin="2.4s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="2.4s" fill="freeze"/></path>
        <path d="M112,62 C128,70 142,80 158,92" fill="none" stroke="#1E3A8A" stroke-width="6.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.58" dur="0.3s" begin="2.55s" fill="freeze"/></path>
        <path d="M112,62 C128,70 142,80 158,92" fill="none" stroke="url(#pSh)" stroke-width="2.8" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.38" dur="0.3s" begin="2.6s" fill="freeze"/></path>
        <g filter="url(#nG)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="2.7s" fill="freeze"/>
          <circle cx="112" cy="62" r="7.5" fill="url(#m1)"/><circle cx="112" cy="62" r="7.5" fill="url(#m1sp)"/>
        </g>
        <!-- M1→leaf -->
        <path d="M112,62 C104,52 98,42 92,35" fill="none" stroke="#DBEAFE" stroke-width="1.5" stroke-linecap="round" stroke-dasharray="35" stroke-dashoffset="35" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.4s" begin="2.8s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="2.8s" fill="freeze"/></path>
        <path d="M92,35 C98,42 104,52 112,62" fill="none" stroke="#3B82F6" stroke-width="2.8" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.25" dur="0.3s" begin="2.95s" fill="freeze"/></path>
        <circle cx="92" cy="35" r="3" fill="url(#lf)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="3.05s" fill="freeze"/></circle>

        <!-- B→M2 up -->
        <path d="M210,60 C210,48 210,35 210,25" fill="none" stroke="#BFDBFE" stroke-width="2" stroke-linecap="round" stroke-dasharray="35" stroke-dashoffset="35" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.4s" begin="2.1s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="2.1s" fill="freeze"/></path>
        <path d="M210,25 C210,35 210,48 210,60" fill="none" stroke="#2563EB" stroke-width="4" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.35" dur="0.3s" begin="2.25s" fill="freeze"/></path>
        <circle cx="210" cy="25" r="5" fill="url(#w1)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="2.35s" fill="freeze"/></circle>

        <!-- E→M3 down -->
        <path d="M210,175 C210,190 210,205 210,218" fill="none" stroke="#BFDBFE" stroke-width="2" stroke-linecap="round" stroke-dasharray="43" stroke-dashoffset="43" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.4s" begin="2.1s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="2.1s" fill="freeze"/></path>
        <path d="M210,218 C210,205 210,190 210,175" fill="none" stroke="#2563EB" stroke-width="4" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.38" dur="0.3s" begin="2.25s" fill="freeze"/></path>
        <circle cx="210" cy="218" r="5.5" fill="url(#w1)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="2.35s" fill="freeze"/></circle>
        <!-- M3→leaf -->
        <path d="M210,218 C202,232 196,242 190,250" fill="none" stroke="#DBEAFE" stroke-width="1.3" stroke-linecap="round" stroke-dasharray="38" stroke-dashoffset="38" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.4s" begin="2.5s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="2.5s" fill="freeze"/></path>
        <path d="M190,250 C196,242 202,232 210,218" fill="none" stroke="#93C5FD" stroke-width="1.8" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.16" dur="0.3s" begin="2.65s" fill="freeze"/></path>
        <circle cx="190" cy="250" r="2.5" fill="url(#lf)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="2.75s" fill="freeze"/></circle>

        <!-- Source→ext -->
        <path d="M325,118 C328,132 332,150 335,165" fill="none" stroke="#BFDBFE" stroke-width="1.8" stroke-linecap="round" stroke-dasharray="50" stroke-dashoffset="50" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.5s" begin="2.0s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="2.0s" fill="freeze"/></path>
        <path d="M335,165 C332,150 328,132 325,118" fill="none" stroke="#2563EB" stroke-width="3.2" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.28" dur="0.3s" begin="2.15s" fill="freeze"/></path>
        <circle cx="335" cy="165" r="4" fill="url(#w1)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="2.3s" fill="freeze"/></circle>

        <!-- STARVED -->
        <path d="M158,148 C142,158 130,168 118,178" fill="none" stroke="#DBEAFE" stroke-width="1" stroke-linecap="round" stroke-dasharray="45" stroke-dashoffset="45" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.7s" begin="3.0s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="3.0s" fill="freeze"/></path>
        <path d="M118,178 C130,168 142,158 158,148" fill="none" stroke="#60A5FA" stroke-width="2" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.13" dur="0.3s" begin="3.2s" fill="freeze"/></path>
        <circle cx="118" cy="178" r="3.5" fill="url(#st1)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="3.3s" fill="freeze"/></circle>

        <path d="M305,68 C310,55 316,42 322,35" fill="none" stroke="#DBEAFE" stroke-width="1" stroke-linecap="round" stroke-dasharray="40" stroke-dashoffset="40" opacity="0"><animate attributeName="stroke-dashoffset" to="0" dur="0.7s" begin="3.1s" fill="freeze"/><animate attributeName="opacity" to="0.85" dur="0.1s" begin="3.1s" fill="freeze"/></path>
        <path d="M322,35 C316,42 310,55 305,68" fill="none" stroke="#60A5FA" stroke-width="2.5" stroke-linecap="round" opacity="0"><animate attributeName="opacity" to="0.18" dur="0.3s" begin="3.3s" fill="freeze"/></path>
        <circle cx="322" cy="35" r="3.5" fill="url(#st1)" opacity="0"><animate attributeName="opacity" to="1" dur="0.3s" begin="3.4s" fill="freeze"/></circle>

        <!-- ======= PHASE 2: CONTINUOUS WATER LOOP from source outward (4s+) ======= -->
        <g fill="none" stroke-linecap="round" opacity="0">
          <animate attributeName="opacity" to="1" dur="0.5s" begin="4s" fill="freeze"/>
          <!-- 5-ring -->
          <path d="M325,118 C318,100 312,85 305,68" stroke="#7DD3FC" stroke-width="5.5" stroke-dasharray="12 8"><animate attributeName="stroke-dashoffset" values="0;-40" dur="1s" begin="4s" repeatCount="indefinite"/></path>
          <path d="M325,118 C305,128 282,138 262,148" stroke="#7DD3FC" stroke-width="5" stroke-dasharray="12 8"><animate attributeName="stroke-dashoffset" values="0;-40" dur="1.2s" begin="4s" repeatCount="indefinite"/></path>
          <path d="M305,68 C290,72 275,82 262,92" stroke="#7DD3FC" stroke-width="5" stroke-dasharray="12 8"><animate attributeName="stroke-dashoffset" values="0;-40" dur="1.1s" begin="4s" repeatCount="indefinite"/></path>
          <path d="M262,148 C262,130 262,110 262,92" stroke="#7DD3FC" stroke-width="5" stroke-dasharray="12 8"><animate attributeName="stroke-dashoffset" values="0;-40" dur="1s" begin="4s" repeatCount="indefinite"/></path>
          <!-- 6-ring top (outward from C) -->
          <path d="M262,92 C245,78 228,68 210,60" stroke="#93C5FD" stroke-width="4" stroke-dasharray="10 8"><animate attributeName="stroke-dashoffset" values="0;-36" dur="1.4s" begin="4s" repeatCount="indefinite"/></path>
          <path d="M210,60 C192,68 175,80 158,92" stroke="#93C5FD" stroke-width="3.8" stroke-dasharray="10 8"><animate attributeName="stroke-dashoffset" values="0;-36" dur="1.5s" begin="4s" repeatCount="indefinite"/></path>
          <!-- 6-ring bottom (outward from D) -->
          <path d="M262,148 C245,158 228,168 210,175" stroke="#93C5FD" stroke-width="3.5" stroke-dasharray="10 8"><animate attributeName="stroke-dashoffset" values="0;-36" dur="1.3s" begin="4s" repeatCount="indefinite"/></path>
          <path d="M210,175 C192,168 175,158 158,148" stroke="#BFDBFE" stroke-width="2.5" stroke-dasharray="8 8"><animate attributeName="stroke-dashoffset" values="0;-32" dur="1.6s" begin="4s" repeatCount="indefinite"/></path>
          <path d="M158,148 C158,130 158,112 158,92" stroke="#BFDBFE" stroke-width="2" stroke-dasharray="8 8"><animate attributeName="stroke-dashoffset" values="0;-32" dur="1.8s" begin="4s" repeatCount="indefinite"/></path>
          <!-- Branches (outward) -->
          <path d="M158,92 C142,80 128,70 112,62" stroke="#93C5FD" stroke-width="3" stroke-dasharray="8 7"><animate attributeName="stroke-dashoffset" values="0;-30" dur="1.4s" begin="4s" repeatCount="indefinite"/></path>
          <path d="M210,60 C210,48 210,35 210,25" stroke="#BFDBFE" stroke-width="2" stroke-dasharray="6 7"><animate attributeName="stroke-dashoffset" values="0;-26" dur="1.6s" begin="4s" repeatCount="indefinite"/></path>
          <path d="M210,175 C210,190 210,205 210,218" stroke="#BFDBFE" stroke-width="2" stroke-dasharray="6 7"><animate attributeName="stroke-dashoffset" values="0;-26" dur="1.5s" begin="4s" repeatCount="indefinite"/></path>
          <path d="M325,118 C328,132 332,150 335,165" stroke="#BFDBFE" stroke-width="1.5" stroke-dasharray="5 6"><animate attributeName="stroke-dashoffset" values="0;-22" dur="1.7s" begin="4s" repeatCount="indefinite"/></path>
        </g>
      </svg>
    </div>
    <h1 style="font-size:2.8rem;font-weight:700;letter-spacing:-1px;margin-bottom:24px;color:var(--navy-900);animation:fadeUp 0.6s ease-out 0.3s both;">QAFD-RAG</h1>
    <div class="btn-group">
      <a class="btn btn-primary" href="https://openreview.net/pdf?id=n28wnc2QTc"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm-1 2l5 5h-5V4zM6 20V4h5v7h7v9H6z"/></svg> Paper</a>
      <a class="btn btn-outline" href="https://github.com/Tarzanagh/QAFD-RAG"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.3 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61-.546-1.385-1.335-1.755-1.335-1.755-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.605-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 21.795 24 17.295 24 12 24 5.37 18.63 0 12 0z"/></svg> Code</a>
      <a class="btn btn-outline" href="https://huggingface.co/tarzanagh/QAFD-RAG"><svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 95 88" fill="none"><path fill="#FFD21E" d="M47.21 76.5a34.75 34.75 0 1 0 0-69.5 34.75 34.75 0 0 0 0 69.5Z"/><path fill="#FF9D0B" d="M81.96 41.75a34.75 34.75 0 1 0-69.5 0 34.75 34.75 0 0 0 69.5 0Zm-73.5 0a38.75 38.75 0 1 1 77.5 0 38.75 38.75 0 0 1-77.5 0Z"/><path fill="#3A3B45" d="M58.5 32.3c1.28.44 1.78 3.06 3.07 2.38a5 5 0 1 0-6.76-2.07c.61 1.15 2.55-.72 3.7-.32ZM34.95 32.3c-1.28.44-1.79 3.06-3.07 2.38a5 5 0 1 1 6.76-2.07c-.61 1.15-2.56-.72-3.7-.32Z"/><path fill="#FF323D" d="M46.96 56.29c9.83 0 13-8.76 13-13.26 0-2.34-1.57-1.6-4.09-.36-2.33 1.15-5.46 2.74-8.9 2.74-7.19 0-13-6.88-13-2.38s3.16 13.26 13 13.26Z"/><path fill="#3A3B45" fill-rule="evenodd" d="M39.43 54a8.7 8.7 0 0 1 5.3-4.49c.4-.12.81.57 1.24 1.28.4.68.82 1.37 1.24 1.37.45 0 .9-.68 1.33-1.35.45-.7.89-1.38 1.32-1.25a8.61 8.61 0 0 1 5 4.17c3.73-2.94 5.1-7.74 5.1-10.7 0-2.34-1.57-1.6-4.09-.36l-.14.07c-2.31 1.15-5.39 2.67-8.77 2.67s-6.45-1.52-8.77-2.67c-2.6-1.29-4.23-2.1-4.23.29 0 3.05 1.46 8.06 5.47 10.97Z" clip-rule="evenodd"/><path fill="#FF9D0B" d="M70.71 37a3.25 3.25 0 1 0 0-6.5 3.25 3.25 0 0 0 0 6.5ZM24.21 37a3.25 3.25 0 1 0 0-6.5 3.25 3.25 0 0 0 0 6.5ZM17.52 48c-1.62 0-3.06.66-4.07 1.87a5.97 5.97 0 0 0-1.33 3.76 7.1 7.1 0 0 0-1.94-.3c-1.55 0-2.95.59-3.94 1.66a5.8 5.8 0 0 0-.8 7 5.3 5.3 0 0 0-1.79 2.82c-.24.9-.48 2.8.8 4.74a5.22 5.22 0 0 0-.37 5.02c1.02 2.32 3.57 4.14 8.52 6.1 3.07 1.22 5.89 2 5.91 2.01a44.33 44.33 0 0 0 10.93 1.6c5.86 0 10.05-1.8 12.46-5.34 3.88-5.69 3.33-10.9-1.7-15.92-2.77-2.78-4.62-6.87-5-7.77-.78-2.66-2.84-5.62-6.25-5.62a5.7 5.7 0 0 0-4.6 2.46c-1-1.26-1.98-2.25-2.86-2.82A7.4 7.4 0 0 0 17.52 48Zm0 4c.51 0 1.14.22 1.82.65 2.14 1.36 6.25 8.43 7.76 11.18.5.92 1.37 1.31 2.14 1.31 1.55 0 2.75-1.53.15-3.48-3.92-2.93-2.55-7.72-.68-8.01.08-.02.17-.02.24-.02 1.7 0 2.45 2.93 2.45 2.93s2.2 5.52 5.98 9.3c3.77 3.77 3.97 6.8 1.22 10.83-1.88 2.75-5.47 3.58-9.16 3.58-3.81 0-7.73-.9-9.92-1.46-.11-.03-13.45-3.8-11.76-7 .28-.54.75-.76 1.34-.76 2.38 0 6.7 3.54 8.57 3.54.41 0 .7-.17.83-.6.79-2.85-12.06-4.05-10.98-8.17.2-.73.71-1.02 1.44-1.02 3.14 0 10.2 5.53 11.68 5.53.11 0 .2-.03.24-.1.74-1.2.33-2.04-4.9-5.2-5.21-3.16-8.88-5.06-6.8-7.33.24-.26.58-.38 1-.38 3.17 0 10.66 6.82 10.66 6.82s2.02 2.1 3.25 2.1c.28 0 .52-.1.68-.38.86-1.46-8.06-8.22-8.56-11.01-.34-1.9.24-2.85 1.31-2.85Z"/><path fill="#FFD21E" d="M38.6 76.69c2.75-4.04 2.55-7.07-1.22-10.84-3.78-3.77-5.98-9.3-5.98-9.3s-.82-3.2-2.69-2.9c-1.87.3-3.24 5.08.68 8.01 3.91 2.93-.78 4.92-2.29 2.17-1.5-2.75-5.62-9.82-7.76-11.18-2.13-1.35-3.63-.6-3.13 2.2.5 2.79 9.43 9.55 8.56 11-.87 1.47-3.93-1.71-3.93-1.71s-9.57-8.71-11.66-6.44c-2.08 2.27 1.59 4.17 6.8 7.33 5.23 3.16 5.64 4 4.9 5.2-.75 1.2-12.28-8.53-13.36-4.4-1.08 4.11 11.77 5.3 10.98 8.15-.8 2.85-9.06-5.38-10.74-2.18-1.7 3.21 11.65 6.98 11.76 7.01 4.3 1.12 15.25 3.49 19.08-2.12Z"/><path fill="#FF9D0B" d="M77.4 48c1.62 0 3.07.66 4.07 1.87a5.97 5.97 0 0 1 1.33 3.76 7.1 7.1 0 0 1 1.95-.3c1.55 0 2.95.59 3.94 1.66a5.8 5.8 0 0 1 .8 7 5.3 5.3 0 0 1 1.78 2.82c.24.9.48 2.8-.8 4.74a5.22 5.22 0 0 1 .37 5.02c-1.02 2.32-3.57 4.14-8.51 6.1-3.08 1.22-5.9 2-5.92 2.01a44.33 44.33 0 0 1-10.93 1.6c-5.86 0-10.05-1.8-12.46-5.34-3.88-5.69-3.33-10.9 1.7-15.92 2.78-2.78 4.63-6.87 5.01-7.77.78-2.66 2.83-5.62 6.24-5.62a5.7 5.7 0 0 1 4.6 2.46c1-1.26 1.98-2.25 2.87-2.82A7.4 7.4 0 0 1 77.4 48Zm0 4c-.51 0-1.13.22-1.82.65-2.13 1.36-6.25 8.43-7.76 11.18a2.43 2.43 0 0 1-2.14 1.31c-1.54 0-2.75-1.53-.14-3.48 3.91-2.93 2.54-7.72.67-8.01a1.54 1.54 0 0 0-.24-.02c-1.7 0-2.45 2.93-2.45 2.93s-2.2 5.52-5.97 9.3c-3.78 3.77-3.98 6.8-1.22 10.83 1.87 2.75 5.47 3.58 9.15 3.58 3.82 0 7.73-.9 9.93-1.46.1-.03 13.45-3.8 11.76-7-.29-.54-.75-.76-1.34-.76-2.38 0-6.71 3.54-8.57 3.54-.42 0-.71-.17-.83-.6-.8-2.85 12.05-4.05 10.97-8.17-.19-.73-.7-1.02-1.44-1.02-3.14 0-10.2 5.53-11.68 5.53-.1 0-.19-.03-.23-.1-.74-1.2-.34-2.04 4.88-5.2 5.23-3.16 8.9-5.06 6.8-7.33-.23-.26-.57-.38-.98-.38-3.18 0-10.67 6.82-10.67 6.82s-2.02 2.1-3.24 2.1a.74.74 0 0 1-.68-.38c-.87-1.46 8.05-8.22 8.55-11.01.34-1.9-.24-2.85-1.31-2.85Z"/><path fill="#FFD21E" d="M56.33 76.69c-2.75-4.04-2.56-7.07 1.22-10.84 3.77-3.77 5.97-9.3 5.97-9.3s.82-3.2 2.7-2.9c1.86.3 3.23 5.08-.68 8.01-3.92 2.93.78 4.92 2.28 2.17 1.51-2.75 5.63-9.82 7.76-11.18 2.13-1.35 3.64-.6 3.13 2.2-.5 2.79-9.42 9.55-8.55 11 .86 1.47 3.92-1.71 3.92-1.71s9.58-8.71 11.66-6.44c2.08 2.27-1.58 4.17-6.8 7.33-5.23 3.16-5.63 4-4.9 5.2.75 1.2 12.28-8.53 13.36-4.4 1.08 4.11-11.76 5.3-10.97 8.15.8 2.85 9.05-5.38 10.74-2.18 1.69 3.21-11.65 6.98-11.76 7.01-4.31 1.12-15.26 3.49-19.08-2.12Z"/></svg> Code + Knowledge Graphs</a>
    </div>
  </div>
</header>

<!-- ============ ABSTRACT ============ -->
<section>
  <div class="container">
    <h2 style="font-size:1.55rem;font-weight:700;color:var(--slate-800);margin-bottom:16px;">Query-Aware Flow Diffusion for Graph-Based<br/>Retrieval-Augmented Generation</h2>
    <p class="about-text" style="text-align:justify;">Graph-based RAG systems leverage interconnected knowledge structures to capture complex relationships, enabling multi-hop reasoning. Yet most existing methods suffer from (i) heuristic designs lacking theoretical guarantees and (ii) static exploration strategies that ignore the query&rsquo;s holistic meaning. We propose <strong style="color:var(--blue-600);">QAFD-RAG</strong>, a training-free framework that dynamically adapts graph traversal to each query&rsquo;s semantics. The central innovation is <em>query-aware traversal</em>: edges are dynamically weighted by how well their endpoints align with the query embedding, guiding flow along semantically relevant paths while suppressing irrelevant regions. This enables the <strong>first statistical guarantees</strong> for query-aware graph retrieval, with <strong>exponential convergence</strong> and complexity scaling with the retrieved subgraph rather than the full graph.</p>
  </div>
</section>

<!-- ============ KEY CONTRIBUTIONS ============ -->
<section class="alt">
  <div class="container">
    <h2>Key Contributions</h2>
    <div class="duo-grid" style="grid-template-columns:1fr 1fr 1fr;gap:16px;">
      <div class="card"><h3>Query-Aware Framework</h3><p>First principled flow diffusion method for graph-based RAG that incorporates query semantics via alignment-based edge weighting. Adapts flow probabilities <strong>online</strong>, guiding traversal toward semantically relevant regions.</p></div>
      <div class="card"><h3>Provable Guarantees</h3><p><strong>Exponential convergence</strong> to a query-dependent stationary distribution. <strong>Recovery guarantees</strong> ensuring relevant subgraphs are retrieved with high probability under mild signal-to-noise conditions.</p></div>
      <div class="card"><h3>State-of-the-Art Results</h3><p>Leads in <strong>96%</strong> of UltraDomain comparisons. Best F1/EM on HotpotQA (<strong>73.4/58.1</strong>) and MuSiQue (<strong>48.0/33.5</strong>). Outperforms GraphRAG, LightRAG, and RAPTOR across all benchmarks.</p></div>
    </div>
  </div>
</section>

<!-- ============ APPROACH COMPARISON ============ -->
<section>
  <div class="container">
    <h2>Approach Comparison</h2>
    <p class="section-sub">Query: <em>&ldquo;Introduce Steve Jobs&rsquo;s products in Apple.&rdquo;</em></p>
    <div class="figure-row">
      <div class="figure-card"><img src="figs/GraphRAG.png" alt="GraphRAG"/><div class="caption">GraphRAG<br/><small>Community Detection</small></div></div>
      <div class="figure-card"><img src="figs/LightRAG.png" alt="LightRAG"/><div class="caption">LightRAG<br/><small>One-Hop Entity-Centric</small></div></div>
      <div class="figure-card"><img src="figs/QAFD-RAG.png" alt="QAFD-RAG"/><div class="caption">QAFD-RAG (Ours)<br/><small>Query-Aware Flow Diffusion</small></div></div>
    </div>
    <p style="margin-top:24px;font-size:0.92rem;color:var(--slate-500);line-height:1.75;max-width:860px;margin-left:auto;margin-right:auto;"><strong style="color:var(--slate-700);">GraphRAG</strong> retrieves entire communities, mixing relevant and irrelevant nodes. <strong style="color:var(--slate-700);">LightRAG</strong> extracts 1-hop neighborhoods without semantic alignment. <strong style="color:var(--slate-700);">QAFD-RAG</strong> reweights edges by query meaning, suppressing irrelevant clusters (Amazon River, Apple fruit) and reinforcing reasoning paths (Apple &rarr; Mac &rarr; macOS). Edge thickness reflects weight; node color indicates importance.</p>
  </div>
</section>

<!-- ============ HOW IT WORKS ============ -->
<section class="alt">
  <div class="container">
    <h2>How It Works</h2>
    <p class="section-sub">A two-stage pipeline from raw documents to grounded answers</p>
    <div class="duo-grid">
      <div class="card"><h3>Stage 1 &mdash; Knowledge Graph Construction</h3><ol><li><strong>Document Chunking</strong> &mdash; Split into context-preserving chunks.</li><li><strong>Entity &amp; Relationship Extraction</strong> &mdash; LLM builds a structured KG with entities as nodes and relationships as edges.</li><li><strong>Embedding</strong> &mdash; All nodes embedded into vector space for similarity matching.</li></ol></div>
      <div class="card"><h3>Stage 2 &mdash; Query-Aware Retrieval</h3><ol><li><strong>Seed Selection</strong> &mdash; Query matched to KG entities via embedding similarity; LLM reranker filters top seeds.</li><li><strong>Flow Diffusion</strong> &mdash; Mass injected at seeds and propagated via push-relabel with <em>query-aware edge weights</em>.</li><li><strong>Response Generation</strong> &mdash; Top-ranked subgraph assembled into context for LLM answer generation.</li></ol></div>
    </div>
  </div>
</section>

<!-- ============ BENCHMARKS ============ -->
<section>
  <div class="container">
    <h2>Benchmarks</h2>
    <p class="section-sub">Evaluated on UltraDomain QA (11 domains), multi-hop QA, text-to-SQL, and summarization. Full results in the <a href="https://openreview.net/pdf?id=n28wnc2QTc" style="color:var(--blue-600);">paper</a>.</p>
    <div class="bench-grid">
      <div class="bench-item"><div class="task">UltraDomain QA</div><div class="dataset">11 domains &middot; 5 quality metrics</div><div class="metrics">Leads in <strong>96%</strong> of comparisons (48/50)</div></div>
      <div class="bench-item"><div class="task">Multi-hop QA</div><div class="dataset">MuSiQue &middot; HotpotQA &middot; 2Wiki</div><div class="metrics">Best F1 on HotpotQA (<strong>73.4</strong>) &amp; MuSiQue (<strong>48.0</strong>)</div></div>
      <div class="bench-item"><div class="task">Text-to-SQL</div><div class="dataset">Spider2-lite (SQLite &middot; Snowflake)</div><div class="metrics"><strong>26.7%</strong> SQLite &middot; <strong>23.7%</strong> Snowflake</div></div>
      <div class="bench-item"><div class="task">Summarization</div><div class="dataset">SQuALITY</div><div class="metrics">BLEU &middot; ROUGE &middot; METEOR</div></div>
    </div>
  </div>
</section>

<!-- ============ QUICK START ============ -->
<section class="alt">
  <div class="container">
    <h2>Quick Start</h2>
    <p class="section-sub">Get running in minutes with pre-built knowledge graphs</p>
<pre><code><span class="comment"># Option 1: Clone from HuggingFace (code + pre-built KGs)</span>
git clone https://huggingface.co/tarzanagh/QAFD-RAG
<span class="keyword">cd</span> QAFD-RAG

<span class="comment"># Option 2: Clone from GitHub (code only) + download KGs</span>
git clone https://github.com/Tarzanagh/QAFD-RAG.git
<span class="keyword">cd</span> QAFD-RAG
huggingface-cli download tarzanagh/QAFD-RAG --include <span class="string">"kg/multihop/*"</span> --local-dir .

<span class="comment"># Install and run</span>
pip install -r requirements.txt
export OPENAI_API_KEY=<span class="string">"sk-..."</span>
python benchmarks/run.py --task multihop --dataset musique --questions 10</code></pre>
  </div>
</section>

<!-- ============ CITATION ============ -->
<section>
  <div class="container">
    <h2>Citation</h2>
<pre><code>@inproceedings{zhou2026qafd,
  title={Query-Aware Flow Diffusion for Graph-Based RAG with Retrieval Guarantees},
  author={Zhou, Zhuoping and Ataee Tarzanagh, Davoud and Didari, Sima and Hu, Wenjun
          and Gutow, Baruch and Verkholyak, Oxana and Faraki, Masoud and Hao, Heng
          and Moon, Hankyu and Min, Seungjai},
  booktitle={International Conference on Learning Representations (ICLR)},
  year={2026}
}</code></pre>
  </div>
</section>

<footer>
  <p>QAFD-RAG <span class="sep">·</span><a href="https://openreview.net/pdf?id=n28wnc2QTc">Paper</a> <span class="sep">·</span><a href="https://github.com/Tarzanagh/QAFD-RAG">GitHub</a> <span class="sep">·</span><a href="https://huggingface.co/tarzanagh/QAFD-RAG">HuggingFace</a></p>
  <p style="margin-top:8px;opacity:0.6;">Contact: tarzanagh [at] gmail [dot] com</p>
</footer>
</body>
</html>