| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <title>Ropedia Xperience-10M Task Suite</title> |
| <meta name="description" content="A research-development task lab for Ropedia Xperience-10M: multimodal sample exploration, 12 embodied-AI tasks, baseline models, and a multi-episode fine-tuning path."> |
| <meta name="theme-color" content="#020502"> |
| <meta name="robots" content="index, follow"> |
| <link rel="canonical" href="https://chaoyue0307.github.io/ropedia-xperience-10m-task-suite/"> |
| <link rel="icon" href="favicon.png" type="image/png" sizes="64x64"> |
| <link rel="apple-touch-icon" href="apple-touch-icon.png"> |
| <link rel="manifest" href="site.webmanifest"> |
| <meta property="og:title" content="Ropedia Xperience-10M Task Suite"> |
| <meta property="og:description" content="A Ropedia Xperience-10M research task lab with multimodal sample exploration, 12 task contracts, minimal and neural baselines, metrics, diagrams, and a scale-up plan."> |
| <meta property="og:type" content="website"> |
| <meta property="og:url" content="https://chaoyue0307.github.io/ropedia-xperience-10m-task-suite/"> |
| <meta property="og:image" content="https://chaoyue0307.github.io/ropedia-xperience-10m-task-suite/assets/brand/xperience10m-logo-social-card.png?v=xperience10m-logo-v2"> |
| <meta property="og:image:width" content="1200"> |
| <meta property="og:image:height" content="630"> |
| <meta name="twitter:card" content="summary_large_image"> |
| <meta name="twitter:title" content="Ropedia Xperience-10M Task Suite"> |
| <meta name="twitter:description" content="Xperience-10M research task lab with multimodal sample exploration, 12 task contracts, and minimal plus neural baselines."> |
| <meta name="twitter:image" content="https://chaoyue0307.github.io/ropedia-xperience-10m-task-suite/assets/brand/xperience10m-logo-social-card.png?v=xperience10m-logo-v2"> |
| <script type="application/ld+json"> |
| { |
| "@context": "https://schema.org", |
| "@type": "SoftwareSourceCode", |
| "name": "Ropedia Xperience-10M Task Suite", |
| "description": "Research-development embodied-AI task suite for the public Ropedia Xperience-10M sample and future multi-episode fine-tuning.", |
| "codeRepository": "https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite", |
| "url": "https://chaoyue0307.github.io/ropedia-xperience-10m-task-suite/", |
| "image": "https://chaoyue0307.github.io/ropedia-xperience-10m-task-suite/assets/brand/xperience10m-logo-social-card.png", |
| "programmingLanguage": ["Python", "HTML", "CSS", "JavaScript"], |
| "isBasedOn": "https://ropedia.com/dataset", |
| "license": "https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/LICENSE" |
| } |
| </script> |
| <link rel="preconnect" href="https://fonts.googleapis.com"> |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> |
| <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet"> |
| <style> |
| :root { |
| color-scheme: dark; |
| --ink: #f4f8ef; |
| --muted: #a5afa2; |
| --line: rgba(204, 255, 160, 0.24); |
| --soft-line: rgba(204, 255, 160, 0.14); |
| --page: #020502; |
| --panel: #061006; |
| --surface: #071207; |
| --blue: #9bdfff; |
| --cyan: #7ae5c3; |
| --green: #ccffa0; |
| --color-main: #ccffa0; |
| --amber: #d8f4a5; |
| --red: #ff8f7a; |
| --shadow: 0 28px 80px rgba(0, 0, 0, 0.42); |
| --radius: 8px; |
| --max: 1220px; |
| --ropedia-card: rgba(5, 10, 6, 0.84); |
| --ropedia-card-strong: rgba(5, 10, 6, 0.96); |
| --ropedia-pill: rgba(255, 255, 255, 0.05); |
| --font-ui: "Inter Tight", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; |
| --font-copy: "Inter Tight", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; |
| --font-btn: "Space Grotesk", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; |
| --font-mono: "Space Grotesk", "SF Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; |
| } |
| |
| * { box-sizing: border-box; } |
| html { scroll-padding-top: 64px; } |
| body { |
| margin: 0; |
| font-family: var(--font-copy); |
| color: var(--ink); |
| background: |
| radial-gradient(circle at 80% 10%, rgba(204, 255, 160, 0.12), transparent 28%), |
| radial-gradient(circle at 18% 24%, rgba(204, 255, 160, 0.06), transparent 22%), |
| radial-gradient(circle, rgba(204, 255, 160, 0.11) 1px, transparent 1.4px), |
| var(--page); |
| background-size: auto, auto, 22px 22px, auto; |
| line-height: 1.5; |
| text-rendering: optimizeLegibility; |
| font-synthesis-weight: none; |
| } |
| |
| a { color: inherit; } |
| .wrap { width: min(var(--max), calc(100% - 48px)); margin: 0 auto; } |
| .skip-link { |
| position: absolute; |
| left: 16px; |
| top: 12px; |
| transform: translateY(-160%); |
| background: var(--ink); |
| color: #020502; |
| padding: 10px 12px; |
| border-radius: 6px; |
| z-index: 40; |
| } |
| .skip-link:focus { transform: translateY(0); } |
| |
| .site-nav { |
| position: sticky; |
| top: 0; |
| z-index: 20; |
| background: rgba(2, 5, 2, 0.86); |
| backdrop-filter: blur(18px); |
| border-bottom: 1px solid var(--soft-line); |
| } |
| .nav-inner { |
| height: 64px; |
| display: flex; |
| align-items: center; |
| justify-content: space-between; |
| gap: 16px; |
| } |
| .brand { |
| display: flex; |
| align-items: center; |
| gap: 12px; |
| font-family: var(--font-ui); |
| font-weight: 700; |
| letter-spacing: 0; |
| text-decoration: none; |
| white-space: nowrap; |
| } |
| .brand-logo { |
| width: 38px; |
| height: 38px; |
| display: block; |
| border-radius: 8px; |
| border: 1px solid rgba(204, 255, 160, 0.42); |
| background: #061006; |
| object-fit: contain; |
| box-shadow: 0 0 18px rgba(122, 229, 195, 0.12); |
| } |
| .nav-links { |
| display: flex; |
| align-items: center; |
| gap: 7px; |
| font-family: var(--font-btn); |
| font-size: 13px; |
| color: #c6d0c2; |
| min-width: 0; |
| } |
| .nav-links a { |
| min-height: 36px; |
| display: inline-flex; |
| align-items: center; |
| justify-content: center; |
| padding: 0 10px; |
| border: 1px solid transparent; |
| border-radius: 999px; |
| background: var(--ropedia-pill); |
| backdrop-filter: blur(2px); |
| text-decoration: none; |
| transition: color 220ms cubic-bezier(0.16, 1, 0.3, 1), transform 220ms cubic-bezier(0.16, 1, 0.3, 1), border-color 220ms cubic-bezier(0.16, 1, 0.3, 1), background 220ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .nav-links a:hover { |
| color: var(--green); |
| border-color: var(--green); |
| background: rgba(255, 255, 255, 0.08); |
| transform: translateY(-1px); |
| } |
| a:focus-visible, button:focus-visible { |
| outline: 2px solid rgba(204, 255, 160, 0.54); |
| outline-offset: 3px; |
| } |
| .nav-action { |
| border: 1px solid var(--green); |
| background: var(--green); |
| color: #020502; |
| height: 36px; |
| padding: 0 11px; |
| display: inline-flex; |
| align-items: center; |
| gap: 6px; |
| text-decoration: none; |
| font-family: var(--font-btn); |
| font-weight: 680; |
| border-radius: 999px; |
| } |
| .nav-links a.nav-action { |
| border-color: var(--green); |
| background: var(--green); |
| color: #020502; |
| } |
| .nav-links a.nav-action:hover { |
| border-color: var(--green); |
| background: #f4f8ef; |
| color: #020502; |
| } |
| |
| .hero { |
| border-bottom: 1px solid var(--soft-line); |
| background: |
| radial-gradient(circle at 78% 28%, rgba(204, 255, 160, 0.20), transparent 18%), |
| radial-gradient(circle at 58% 36%, rgba(255, 255, 255, 0.10) 1px, transparent 2px), |
| linear-gradient(180deg, #020502, #020702 68%, #050b05); |
| background-size: auto, 16px 16px, auto; |
| } |
| .hero-inner { |
| min-height: 680px; |
| display: grid; |
| grid-template-columns: minmax(0, 1.08fr) minmax(420px, 0.92fr); |
| gap: 58px; |
| align-items: center; |
| padding: 86px 0 68px; |
| } |
| .eyebrow { |
| display: inline-flex; |
| align-items: center; |
| gap: 9px; |
| margin-bottom: 22px; |
| color: var(--green); |
| font-family: var(--font-btn); |
| font-size: 12px; |
| text-transform: uppercase; |
| letter-spacing: 0.08em; |
| } |
| .eyebrow::before { |
| content: ""; |
| width: 34px; |
| height: 1px; |
| background: var(--green); |
| } |
| h1 { |
| margin: 0; |
| font-family: var(--font-ui); |
| font-size: clamp(48px, 7vw, 92px); |
| line-height: 0.98; |
| letter-spacing: 0; |
| max-width: 860px; |
| text-wrap: balance; |
| color: #f7fff0; |
| } |
| .hero-copy { |
| margin: 26px 0 0; |
| max-width: 690px; |
| color: #c7d1c3; |
| font-size: 19px; |
| line-height: 1.65; |
| text-wrap: pretty; |
| } |
| .hero-actions { |
| display: flex; |
| flex-wrap: wrap; |
| gap: 12px; |
| margin-top: 34px; |
| } |
| .button { |
| height: 46px; |
| padding: 0 18px; |
| border-radius: 999px; |
| border: 1px solid rgba(255, 255, 255, 0.30); |
| display: inline-flex; |
| align-items: center; |
| gap: 10px; |
| text-decoration: none; |
| font-family: var(--font-btn); |
| font-weight: 700; |
| background: var(--ropedia-pill); |
| transition: transform 240ms cubic-bezier(0.16, 1, 0.3, 1), border-color 240ms cubic-bezier(0.16, 1, 0.3, 1), background 240ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .button:hover { transform: translateY(-2px); border-color: var(--green); background: rgba(204, 255, 160, 0.10); } |
| .button:active { transform: translateY(0) scale(0.98); } |
| .button.primary { |
| background: var(--ink); |
| color: #020502; |
| border-color: var(--green); |
| background: var(--green); |
| } |
| .hero-stats { |
| display: grid; |
| grid-template-columns: repeat(4, minmax(0, 1fr)); |
| gap: 10px; |
| margin-top: 42px; |
| max-width: 760px; |
| } |
| .stat { |
| border: 1px solid var(--line); |
| background: rgba(7, 18, 7, 0.82); |
| padding: 14px 14px 13px; |
| border-radius: var(--radius); |
| } |
| .stat strong { display: block; font-family: var(--font-mono); font-size: 21px; line-height: 1; font-variant-numeric: tabular-nums; } |
| .stat span { display: block; margin-top: 7px; font-size: 12px; color: var(--muted); } |
| .hero-panel { |
| background: rgba(7, 18, 7, 0.88); |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| box-shadow: var(--shadow); |
| padding: 18px; |
| } |
| .panel-top { |
| display: flex; |
| justify-content: space-between; |
| align-items: center; |
| border-bottom: 1px solid var(--soft-line); |
| padding: 6px 6px 14px; |
| color: var(--muted); |
| font-size: 13px; |
| font-family: var(--font-mono); |
| } |
| .signal { |
| display: grid; |
| grid-template-columns: 88px 1fr 74px; |
| gap: 14px; |
| align-items: center; |
| padding: 15px 6px; |
| border-bottom: 1px solid var(--soft-line); |
| } |
| .signal:last-child { border-bottom: 0; } |
| .signal code { |
| color: #e7f3df; |
| background: rgba(204, 255, 160, 0.08); |
| border: 1px solid var(--soft-line); |
| padding: 5px 7px; |
| border-radius: 5px; |
| font-size: 12px; |
| font-family: var(--font-mono); |
| } |
| .track { |
| position: relative; |
| height: 12px; |
| background: rgba(204, 255, 160, 0.16); |
| overflow: hidden; |
| border-radius: 999px; |
| } |
| .track > span { |
| position: absolute; |
| inset: 0 auto 0 0; |
| width: var(--w); |
| background: var(--c); |
| border-radius: inherit; |
| } |
| .signal strong { text-align: right; font-family: var(--font-mono); font-size: 13px; font-variant-numeric: tabular-nums; } |
| |
| main { display: flex; flex-direction: column; } |
| main > section { |
| padding: 88px 0 96px; |
| border-bottom: 1px solid var(--soft-line); |
| background: rgba(2, 5, 2, 0.72); |
| scroll-margin-top: 132px; |
| } |
| main > section:focus { outline: none; } |
| main.tabbed > section[hidden] { display: none; } |
| .project-tabs-shell { |
| order: 0; |
| position: sticky; |
| top: 64px; |
| z-index: 14; |
| border-bottom: 1px solid var(--soft-line); |
| background: rgba(2, 5, 2, 0.88); |
| backdrop-filter: blur(18px); |
| padding: 14px 0; |
| } |
| .project-tabs { |
| display: grid; |
| grid-template-columns: repeat(6, minmax(0, 1fr)); |
| gap: 10px; |
| } |
| .project-tab { |
| appearance: none; |
| min-width: 0; |
| min-height: 62px; |
| border: 1px solid var(--soft-line); |
| border-radius: var(--radius); |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.06), rgba(7, 18, 7, 0.82)), |
| var(--surface); |
| color: #dce8d6; |
| cursor: pointer; |
| padding: 12px 13px; |
| text-align: left; |
| font: inherit; |
| transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), border-color 220ms cubic-bezier(0.16, 1, 0.3, 1), background 220ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .project-tab:hover { transform: translateY(-1px); border-color: rgba(204, 255, 160, 0.42); } |
| .project-tab strong { |
| display: block; |
| color: var(--ink); |
| font-family: var(--font-ui); |
| font-size: 15px; |
| line-height: 1.12; |
| } |
| .project-tab span { |
| display: block; |
| margin-top: 5px; |
| color: var(--muted); |
| font-size: 11px; |
| line-height: 1.25; |
| } |
| .project-tab.active { |
| border-color: var(--green); |
| background: var(--green); |
| color: #020502; |
| box-shadow: 0 12px 34px rgba(204, 255, 160, 0.10); |
| } |
| .project-tab.active strong, |
| .project-tab.active span { color: #020502; } |
| .section-tabs { |
| display: flex; |
| gap: 8px; |
| overflow-x: auto; |
| padding-top: 12px; |
| padding-bottom: 2px; |
| scrollbar-width: thin; |
| scrollbar-color: rgba(204, 255, 160, 0.42) rgba(7, 18, 7, 0.72); |
| } |
| .section-tab { |
| appearance: none; |
| display: inline-flex; |
| align-items: center; |
| justify-content: center; |
| flex: 0 0 auto; |
| min-height: 38px; |
| border: 1px solid rgba(204, 255, 160, 0.18); |
| border-radius: 6px; |
| background: rgba(7, 18, 7, 0.78); |
| color: #c8d5c2; |
| cursor: pointer; |
| padding: 8px 12px; |
| font-family: var(--font-ui); |
| font-size: 13px; |
| font-weight: 660; |
| line-height: 1.15; |
| text-align: center; |
| white-space: nowrap; |
| transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), border-color 220ms cubic-bezier(0.16, 1, 0.3, 1), background 220ms cubic-bezier(0.16, 1, 0.3, 1), color 220ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .section-tab:hover { |
| transform: translateY(-1px); |
| border-color: rgba(204, 255, 160, 0.42); |
| color: var(--ink); |
| } |
| .section-tab.active { |
| border-color: rgba(204, 255, 160, 0.82); |
| background: rgba(204, 255, 160, 0.14); |
| color: var(--green); |
| } |
| .content-tabs { |
| display: flex; |
| gap: 8px; |
| overflow-x: auto; |
| padding: 2px 0 4px; |
| margin-bottom: 18px; |
| scrollbar-width: thin; |
| scrollbar-color: rgba(204, 255, 160, 0.42) rgba(7, 18, 7, 0.72); |
| } |
| .content-tab { |
| appearance: none; |
| flex: 0 0 auto; |
| min-width: 190px; |
| min-height: 56px; |
| border: 1px solid rgba(204, 255, 160, 0.18); |
| border-radius: 6px; |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.05), rgba(7, 18, 7, 0.72)), |
| rgba(2, 5, 2, 0.54); |
| color: #dce8d6; |
| cursor: pointer; |
| padding: 10px 12px; |
| text-align: left; |
| font: inherit; |
| transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), border-color 220ms cubic-bezier(0.16, 1, 0.3, 1), background 220ms cubic-bezier(0.16, 1, 0.3, 1), color 220ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .content-tab:hover { |
| transform: translateY(-1px); |
| border-color: rgba(204, 255, 160, 0.42); |
| color: var(--ink); |
| } |
| .content-tab strong { |
| display: block; |
| color: var(--ink); |
| font-family: var(--font-ui); |
| font-size: 14px; |
| line-height: 1.15; |
| } |
| .content-tab span { |
| display: block; |
| margin-top: 4px; |
| color: var(--muted); |
| font-size: 11px; |
| line-height: 1.25; |
| } |
| .content-tab.active { |
| border-color: rgba(204, 255, 160, 0.82); |
| background: rgba(204, 255, 160, 0.14); |
| color: var(--green); |
| } |
| .content-tab.active strong, |
| .content-tab.active span { color: var(--green); } |
| .tabbed-panel[hidden] { display: none; } |
| #overview { order: 1; } |
| #roadmap { order: 2; } |
| #reading-path { order: 3; } |
| #dataset-card { order: 4; } |
| #suite { order: 5; } |
| #pipeline { order: 6; } |
| #protocol { order: 7; } |
| #takeaways { order: 8; } |
| #models { order: 9; } |
| #neural { order: 10; } |
| #directions { order: 11; } |
| #extensions { order: 12; } |
| #architectures { order: 13; } |
| #walkthroughs { order: 14; } |
| #tasks { order: 15; } |
| #features { order: 16; } |
| #diagnostics { order: 17; } |
| #evidence { order: 18; } |
| #artifacts { order: 19; } |
| #omni-relay { order: 20; } |
| #run { order: 21; } |
| #suite { padding: 62px 0 76px; } |
| #suite .wrap { width: min(1680px, calc(100% - 48px)); } |
| #suite .section-head { max-width: var(--max); margin-inline: auto; } |
| .section-head { |
| display: flex; |
| justify-content: space-between; |
| align-items: end; |
| gap: 32px; |
| margin-bottom: 28px; |
| } |
| h2 { |
| margin: 0; |
| font-family: var(--font-ui); |
| font-size: clamp(30px, 4vw, 48px); |
| line-height: 1.05; |
| letter-spacing: 0; |
| text-wrap: balance; |
| } |
| .section-head p { |
| max-width: 560px; |
| margin: 0; |
| color: var(--muted); |
| font-size: 16px; |
| line-height: 1.65; |
| text-wrap: pretty; |
| } |
| |
| .pipeline-image, |
| .architecture-image, |
| .task-suite-image, |
| .chart { |
| width: 100%; |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| background: var(--surface); |
| box-shadow: 0 18px 46px rgba(0, 0, 0, 0.36); |
| } |
| .task-suite-image { |
| display: block; |
| margin-top: 30px; |
| } |
| .figure-pan { |
| overflow-x: auto; |
| overflow-y: hidden; |
| border-radius: var(--radius); |
| padding-bottom: 4px; |
| } |
| .figure-pan .task-suite-image { |
| margin-bottom: 0; |
| min-width: 0; |
| max-width: 100%; |
| height: auto; |
| } |
| .modality-atlas-panel { |
| margin-top: 0; |
| margin-bottom: 34px; |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.08), rgba(7, 18, 7, 0.88)), |
| var(--surface); |
| padding: clamp(26px, 3.2vw, 44px); |
| box-shadow: 0 18px 46px rgba(0, 0, 0, 0.28); |
| } |
| .atlas-head { |
| display: flex; |
| align-items: end; |
| justify-content: space-between; |
| gap: 24px; |
| margin-bottom: 18px; |
| padding-bottom: 16px; |
| border-bottom: 1px solid var(--soft-line); |
| } |
| .atlas-head h3 { |
| margin: 0; |
| font-family: var(--font-ui); |
| font-size: clamp(24px, 3vw, 36px); |
| line-height: 1.05; |
| } |
| .atlas-head p { |
| margin: 8px 0 0; |
| max-width: 780px; |
| color: var(--muted); |
| font-size: 15px; |
| line-height: 1.55; |
| } |
| .atlas-head a { |
| flex: none; |
| color: var(--cyan); |
| font-size: 13px; |
| font-weight: 700; |
| text-decoration: none; |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| padding: 9px 10px; |
| background: rgba(2, 5, 2, 0.44); |
| } |
| .atlas-head a:hover { border-color: var(--green); color: var(--ink); } |
| .modality-atlas { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(420px, 1fr)); |
| gap: clamp(24px, 2.4vw, 36px); |
| } |
| .atlas-card { |
| min-width: 0; |
| border: 1px solid var(--soft-line); |
| border-radius: var(--radius); |
| background: rgba(2, 9, 2, 0.84); |
| padding: clamp(24px, 2.4vw, 34px); |
| display: grid; |
| gap: 24px; |
| align-content: start; |
| } |
| .atlas-card.wide { grid-column: 1 / -1; } |
| .atlas-card img { |
| width: 100%; |
| aspect-ratio: 16 / 9; |
| object-fit: cover; |
| display: block; |
| border: 1px solid rgba(204, 255, 160, 0.16); |
| border-radius: 8px; |
| background: #020502; |
| } |
| .atlas-card.wide img { |
| aspect-ratio: 1500 / 470; |
| } |
| .atlas-top { |
| display: flex; |
| align-items: start; |
| justify-content: space-between; |
| gap: 16px; |
| } |
| .atlas-index { |
| display: block; |
| color: var(--muted); |
| font-family: var(--font-mono); |
| font-size: 15px; |
| font-variant-numeric: tabular-nums; |
| } |
| .atlas-card h4 { |
| margin: 6px 0 0; |
| font-family: var(--font-ui); |
| font-size: clamp(38px, 4.2vw, 64px); |
| line-height: 0.96; |
| text-transform: uppercase; |
| } |
| .atlas-type { |
| color: var(--green); |
| font-family: var(--font-mono); |
| font-size: 13.5px; |
| line-height: 1.2; |
| text-align: right; |
| text-transform: uppercase; |
| } |
| .atlas-rows { |
| display: grid; |
| grid-template-columns: 1fr; |
| gap: 0; |
| } |
| .atlas-row { |
| display: grid; |
| grid-template-columns: minmax(156px, 0.32fr) minmax(0, 1fr); |
| gap: 22px; |
| align-items: baseline; |
| border-top: 1px solid var(--soft-line); |
| padding: 13px 0 0; |
| min-width: 0; |
| } |
| .atlas-row + .atlas-row { margin-top: 12px; } |
| .atlas-row span { |
| display: block; |
| color: var(--muted); |
| font-family: var(--font-mono); |
| font-size: 12.5px; |
| line-height: 1.35; |
| text-transform: uppercase; |
| } |
| .atlas-row p { |
| margin: 0; |
| color: #edf8e8; |
| font-size: clamp(21px, 1.85vw, 28px); |
| font-weight: 700; |
| line-height: 1.18; |
| } |
| .atlas-card.audio-card { |
| border-color: rgba(216, 244, 165, 0.32); |
| background: |
| linear-gradient(180deg, rgba(216, 244, 165, 0.08), rgba(2, 9, 2, 0.88)), |
| rgba(2, 9, 2, 0.84); |
| } |
| .atlas-card.audio-card .atlas-type { color: var(--amber); } |
| .atlas-note { |
| margin: 16px 0 0; |
| color: var(--muted); |
| font-size: 13px; |
| line-height: 1.55; |
| } |
| .architecture-image { |
| display: block; |
| } |
| .callout-row { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(0, 1fr)); |
| gap: 18px; |
| margin-top: 18px; |
| } |
| .two-col { |
| display: grid; |
| grid-template-columns: minmax(0, 1fr) minmax(340px, 0.52fr); |
| gap: 30px; |
| align-items: start; |
| } |
| .callout { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| padding: 24px; |
| background: rgba(204, 255, 160, 0.06); |
| color: #eaf5e5; |
| } |
| .callout h3, .artifact h3 { margin: 0 0 8px; font-size: 17px; } |
| .callout p, .artifact p { margin: 0; color: #aab5a5; line-height: 1.6; } |
| |
| .snapshot-grid { |
| display: grid; |
| grid-template-columns: repeat(3, minmax(0, 1fr)); |
| gap: 16px; |
| } |
| .snapshot-card { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| padding: 20px; |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.08), rgba(7, 18, 7, 0.9)), |
| var(--surface); |
| min-height: 210px; |
| display: grid; |
| gap: 12px; |
| align-content: start; |
| } |
| .snapshot-card.gated { |
| border-color: rgba(216, 244, 165, 0.32); |
| background: |
| linear-gradient(180deg, rgba(216, 244, 165, 0.075), rgba(7, 18, 7, 0.9)), |
| var(--surface); |
| } |
| .snapshot-card h3 { margin: 0; font-size: 18px; line-height: 1.2; } |
| .snapshot-card p { margin: 0; color: var(--muted); line-height: 1.58; } |
| .snapshot-meta { |
| display: grid; |
| gap: 6px; |
| margin-top: 2px; |
| padding-top: 12px; |
| border-top: 1px solid var(--soft-line); |
| color: #dce8d6; |
| font-size: 13px; |
| } |
| .snapshot-meta span { |
| display: flex; |
| justify-content: space-between; |
| gap: 14px; |
| color: var(--muted); |
| } |
| .snapshot-meta strong { |
| color: var(--ink); |
| font-family: var(--font-mono); |
| font-variant-numeric: tabular-nums; |
| } |
| .snapshot-actions { |
| display: flex; |
| flex-wrap: wrap; |
| gap: 10px; |
| margin-top: 20px; |
| } |
| .snapshot-actions a { |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| color: var(--cyan); |
| font-size: 13px; |
| font-weight: 700; |
| padding: 9px 10px; |
| text-decoration: none; |
| background: rgba(2, 5, 2, 0.42); |
| } |
| .snapshot-actions a:hover { border-color: var(--green); color: var(--ink); } |
| |
| .roadmap-grid { |
| display: grid; |
| grid-template-columns: repeat(5, minmax(0, 1fr)); |
| gap: 14px; |
| align-items: stretch; |
| } |
| .roadmap-card { |
| position: relative; |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| padding: 18px; |
| min-height: 330px; |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.08), rgba(7, 18, 7, 0.92)), |
| var(--surface); |
| display: grid; |
| gap: 12px; |
| align-content: start; |
| } |
| .roadmap-card::before { |
| content: ""; |
| position: absolute; |
| left: 18px; |
| right: 18px; |
| top: 0; |
| height: 2px; |
| background: linear-gradient(90deg, var(--green), rgba(122, 229, 195, 0.2)); |
| } |
| .roadmap-card[data-status="active"] { |
| border-color: rgba(122, 229, 195, 0.42); |
| background: |
| linear-gradient(180deg, rgba(122, 229, 195, 0.11), rgba(7, 18, 7, 0.92)), |
| var(--surface); |
| } |
| .roadmap-card[data-status="next"] { |
| border-color: rgba(216, 244, 165, 0.36); |
| background: |
| linear-gradient(180deg, rgba(216, 244, 165, 0.09), rgba(7, 18, 7, 0.92)), |
| var(--surface); |
| } |
| .roadmap-status { |
| width: fit-content; |
| border: 1px solid var(--soft-line); |
| border-radius: 999px; |
| padding: 5px 8px; |
| color: var(--green); |
| background: rgba(2, 5, 2, 0.5); |
| font-family: var(--font-mono); |
| font-size: 11px; |
| font-weight: 700; |
| text-transform: uppercase; |
| letter-spacing: 0.06em; |
| } |
| .roadmap-card h3 { |
| margin: 0; |
| color: var(--ink); |
| font-size: 18px; |
| line-height: 1.18; |
| } |
| .roadmap-card p { |
| margin: 0; |
| color: var(--muted); |
| font-size: 13px; |
| line-height: 1.55; |
| } |
| .roadmap-meta { |
| display: grid; |
| gap: 8px; |
| padding-top: 10px; |
| border-top: 1px solid var(--soft-line); |
| } |
| .roadmap-meta strong { |
| display: block; |
| color: #dce8d7; |
| font-size: 12px; |
| line-height: 1.2; |
| } |
| .roadmap-links { |
| display: flex; |
| flex-wrap: wrap; |
| gap: 8px; |
| margin-top: 18px; |
| } |
| .roadmap-links a { |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| color: var(--cyan); |
| font-size: 13px; |
| font-weight: 700; |
| padding: 9px 10px; |
| text-decoration: none; |
| background: rgba(2, 5, 2, 0.42); |
| } |
| .roadmap-links a:hover { border-color: var(--green); color: var(--ink); } |
| |
| .brief-panel { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| padding: clamp(20px, 3vw, 32px); |
| margin-bottom: 24px; |
| background: |
| linear-gradient(135deg, rgba(204, 255, 160, 0.13), rgba(122, 229, 195, 0.045) 58%, rgba(7, 18, 7, 0.9)), |
| var(--surface); |
| box-shadow: 0 22px 70px rgba(0, 0, 0, 0.28); |
| } |
| .brief-panel-head { |
| display: grid; |
| grid-template-columns: minmax(0, 0.9fr) minmax(320px, 0.85fr); |
| gap: 28px; |
| align-items: end; |
| margin-bottom: 22px; |
| } |
| .brief-panel-head span { |
| display: block; |
| margin-bottom: 10px; |
| color: var(--green); |
| font-family: var(--font-mono); |
| font-size: 12px; |
| font-weight: 700; |
| text-transform: uppercase; |
| letter-spacing: 0.08em; |
| } |
| .brief-panel-head h3 { |
| margin: 0; |
| font-family: var(--font-ui); |
| font-size: clamp(30px, 4.8vw, 58px); |
| line-height: 0.98; |
| text-wrap: balance; |
| } |
| .brief-panel-head p { |
| margin: 0; |
| color: #c8d4c3; |
| line-height: 1.65; |
| font-size: 16px; |
| text-wrap: pretty; |
| } |
| .brief-grid { |
| display: grid; |
| grid-template-columns: repeat(3, minmax(0, 1fr)); |
| gap: 14px; |
| } |
| .brief-card { |
| border: 1px solid var(--soft-line); |
| border-radius: var(--radius); |
| padding: 18px; |
| background: rgba(2, 5, 2, 0.42); |
| min-height: 216px; |
| display: grid; |
| gap: 12px; |
| align-content: start; |
| } |
| .brief-card strong { |
| color: var(--ink); |
| font-family: var(--font-ui); |
| font-size: 18px; |
| line-height: 1.14; |
| } |
| .brief-card p, |
| .brief-card li { |
| margin: 0; |
| color: var(--muted); |
| font-size: 13px; |
| line-height: 1.55; |
| } |
| .brief-card ul { |
| display: grid; |
| gap: 8px; |
| margin: 0; |
| padding: 0; |
| list-style: none; |
| } |
| .brief-card li::before { |
| content: ""; |
| display: inline-block; |
| width: 6px; |
| height: 6px; |
| margin: 0 8px 1px 0; |
| border-radius: 999px; |
| background: var(--green); |
| } |
| .brief-actions { |
| display: flex; |
| flex-wrap: wrap; |
| gap: 10px; |
| margin-top: 18px; |
| } |
| .brief-actions a { |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| color: var(--blue); |
| font-size: 13px; |
| font-weight: 700; |
| padding: 8px 10px; |
| text-decoration: none; |
| background: rgba(2, 5, 2, 0.48); |
| } |
| .brief-actions a:first-child { |
| color: #020502; |
| background: var(--green); |
| border-color: var(--green); |
| } |
| .brief-actions a:hover { border-color: var(--green); color: var(--ink); } |
| .brief-actions a:first-child:hover { color: #020502; } |
| |
| .reading-grid { |
| display: grid; |
| grid-template-columns: repeat(4, minmax(0, 1fr)); |
| gap: 16px; |
| margin-bottom: 18px; |
| } |
| .reading-card { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| padding: 18px; |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.075), rgba(7, 18, 7, 0.9)), |
| var(--surface); |
| min-height: 270px; |
| display: grid; |
| gap: 12px; |
| align-content: start; |
| } |
| .reading-card .step-index { |
| width: 38px; |
| height: 38px; |
| display: grid; |
| place-items: center; |
| border: 1px solid rgba(204, 255, 160, 0.36); |
| border-radius: 8px; |
| color: #020502; |
| background: var(--green); |
| font-family: var(--font-mono); |
| font-weight: 700; |
| font-variant-numeric: tabular-nums; |
| } |
| .reading-card h3 { margin: 0; font-size: 17px; line-height: 1.22; } |
| .reading-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; } |
| .reading-links { |
| display: flex; |
| flex-wrap: wrap; |
| gap: 8px; |
| margin-top: 4px; |
| } |
| .reading-links a { |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| color: var(--cyan); |
| font-size: 12px; |
| font-weight: 700; |
| padding: 7px 8px; |
| text-decoration: none; |
| background: rgba(2, 5, 2, 0.42); |
| } |
| .reading-links a:hover { border-color: var(--green); color: var(--ink); } |
| .boundary-strip { |
| display: grid; |
| grid-template-columns: repeat(3, minmax(0, 1fr)); |
| gap: 16px; |
| margin-top: 18px; |
| } |
| .boundary-item { |
| border: 1px solid var(--soft-line); |
| border-radius: var(--radius); |
| padding: 18px; |
| background: rgba(204, 255, 160, 0.055); |
| } |
| .boundary-item strong { |
| display: block; |
| margin-bottom: 8px; |
| color: var(--ink); |
| font-size: 15px; |
| } |
| .boundary-item span { |
| color: var(--muted); |
| font-size: 13px; |
| line-height: 1.55; |
| } |
| |
| .evidence-grid { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(0, 1fr)); |
| gap: 18px; |
| } |
| .evidence-card { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| padding: 22px; |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.06), rgba(7, 18, 7, 0.88)), |
| var(--surface); |
| min-height: 230px; |
| display: grid; |
| gap: 12px; |
| align-content: start; |
| } |
| .evidence-card h3 { margin: 0; font-size: 18px; line-height: 1.2; } |
| .evidence-card p { margin: 0; color: var(--muted); line-height: 1.6; } |
| .evidence-card code { color: var(--ink); font-family: var(--font-mono); font-size: 12px; } |
| .evidence-card:last-child { grid-column: 1 / -1; } |
| .evidence-links { |
| display: flex; |
| flex-wrap: wrap; |
| gap: 10px; |
| margin-top: 4px; |
| } |
| .evidence-links a { |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| color: var(--blue); |
| font-size: 13px; |
| font-weight: 700; |
| padding: 7px 9px; |
| text-decoration: none; |
| background: rgba(2, 5, 2, 0.42); |
| } |
| .evidence-links a:hover { border-color: var(--green); color: var(--ink); } |
| |
| .models { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(0, 1fr)); |
| gap: 16px; |
| margin-bottom: 24px; |
| } |
| .model { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| padding: 18px; |
| background: var(--surface); |
| transition: transform 240ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 240ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .model:hover { transform: translateY(-3px); box-shadow: 0 18px 38px rgba(204, 255, 160, 0.08); } |
| .model h3 { margin: 0; font-size: 15px; } |
| .model .score { display: block; margin-top: 18px; font-family: var(--font-mono); font-size: 33px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; } |
| .model .meta { display: block; margin-top: 8px; color: var(--muted); font-size: 13px; } |
| |
| .task-toolbar { |
| display: flex; |
| gap: 10px; |
| flex-wrap: wrap; |
| margin-bottom: 18px; |
| } |
| .filter { |
| border: 1px solid var(--line); |
| background: var(--surface); |
| border-radius: 999px; |
| height: 36px; |
| padding: 0 14px; |
| font-weight: 650; |
| color: #d7e3d0; |
| cursor: pointer; |
| transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), background 220ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .filter:hover { transform: translateY(-1px); } |
| .filter.active { color: #020502; background: var(--green); border-color: var(--green); } |
| .task-grid { |
| display: grid; |
| grid-template-columns: repeat(3, minmax(0, 1fr)); |
| gap: 18px; |
| } |
| .task-card { |
| appearance: none; |
| width: 100%; |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| padding: 20px; |
| background: var(--surface); |
| color: inherit; |
| font: inherit; |
| text-align: left; |
| cursor: pointer; |
| display: grid; |
| gap: 15px; |
| min-height: 324px; |
| align-content: start; |
| transition: transform 240ms cubic-bezier(0.16, 1, 0.3, 1), border-color 240ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 240ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .task-card:hover { transform: translateY(-3px); border-color: var(--green); } |
| .task-card.active { |
| border-color: rgba(204, 255, 160, 0.72); |
| box-shadow: 0 20px 48px rgba(204, 255, 160, 0.08); |
| } |
| .task-card.hide { display: none; } |
| .task-card-media { |
| overflow: hidden; |
| border: 1px solid rgba(204, 255, 160, 0.18); |
| border-radius: 7px; |
| background: #020502; |
| } |
| .task-card-media img { |
| display: block; |
| width: 100%; |
| aspect-ratio: 16 / 8.5; |
| object-fit: cover; |
| transform: scale(1.01); |
| } |
| .task-top { display: flex; justify-content: space-between; gap: 14px; align-items: start; } |
| .task-name { |
| display: block; |
| font-family: var(--font-ui); |
| font-size: 21px; |
| font-weight: 700; |
| line-height: 1.08; |
| letter-spacing: 0; |
| text-wrap: balance; |
| } |
| .task-research-name { |
| display: block; |
| margin-top: 6px; |
| color: #d7e5d1; |
| font-size: 13px; |
| line-height: 1.35; |
| } |
| .tag { |
| font-size: 11px; |
| border-radius: 999px; |
| padding: 4px 8px; |
| color: #d8ead2; |
| background: rgba(204, 255, 160, 0.08); |
| white-space: nowrap; |
| } |
| .tag.supervised { background: rgba(155, 223, 255, 0.12); color: #9bdfff; } |
| .tag.forecast { background: rgba(204, 255, 160, 0.12); color: #ccffa0; } |
| .tag.retrieval { background: rgba(122, 229, 195, 0.12); color: #7ae5c3; } |
| .tag.diagnostic { background: rgba(216, 244, 165, 0.12); color: #d8f4a5; } |
| .task-card p { margin: 0; color: var(--muted); font-size: 13px; } |
| .task-contract { |
| display: grid; |
| gap: 8px; |
| color: #dce8d6; |
| font-size: 12px; |
| line-height: 1.4; |
| } |
| .task-contract span { |
| display: grid; |
| grid-template-columns: 58px minmax(0, 1fr); |
| gap: 10px; |
| align-items: baseline; |
| border-top: 1px solid var(--soft-line); |
| padding-top: 8px; |
| } |
| .task-contract strong { |
| color: var(--muted); |
| font-family: var(--font-mono); |
| font-size: 11px; |
| text-transform: uppercase; |
| letter-spacing: 0.04em; |
| } |
| .metric-row { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(0, 1fr)); |
| gap: 8px; |
| font-size: 12px; |
| } |
| .metric-row span { |
| display: block; |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| padding: 9px; |
| color: var(--muted); |
| min-width: 0; |
| } |
| .metric-row strong { |
| display: block; |
| color: var(--ink); |
| font-family: var(--font-mono); |
| font-size: 18px; |
| line-height: 1.1; |
| font-variant-numeric: tabular-nums; |
| word-break: break-word; |
| } |
| .mini-bar { height: 7px; background: rgba(204, 255, 160, 0.14); border-radius: 999px; overflow: hidden; } |
| .mini-bar span { display: block; height: 100%; width: var(--w); background: var(--c); } |
| |
| .artifact-grid { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(0, 1fr)); |
| gap: 18px; |
| } |
| .artifact-library { |
| display: grid; |
| gap: 24px; |
| } |
| .artifact-group { |
| border: 1px solid var(--soft-line); |
| border-radius: var(--radius); |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.045), rgba(7, 18, 7, 0.62)), |
| var(--panel); |
| padding: 20px; |
| } |
| .artifact-group-head { |
| display: grid; |
| grid-template-columns: minmax(0, 0.75fr) minmax(280px, 0.95fr); |
| gap: 24px; |
| align-items: end; |
| padding-bottom: 18px; |
| margin-bottom: 18px; |
| border-bottom: 1px solid var(--soft-line); |
| } |
| .artifact-group-head span { |
| display: block; |
| margin-bottom: 8px; |
| color: var(--green); |
| font-family: var(--font-mono); |
| font-size: 12px; |
| font-weight: 700; |
| text-transform: uppercase; |
| letter-spacing: 0.08em; |
| } |
| .artifact-group-head h3 { |
| margin: 0; |
| font-size: 24px; |
| line-height: 1.06; |
| } |
| .artifact-group-head p { |
| margin: 0; |
| color: var(--muted); |
| line-height: 1.6; |
| font-size: 14px; |
| } |
| .chart-grid { |
| display: grid; |
| grid-template-columns: minmax(0, 1fr); |
| gap: 22px; |
| align-items: start; |
| } |
| .direction-grid { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(0, 1fr)); |
| gap: 16px; |
| margin-bottom: 24px; |
| } |
| .direction-card { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| background: var(--surface); |
| padding: 18px; |
| min-height: 230px; |
| display: grid; |
| gap: 12px; |
| align-content: start; |
| } |
| .direction-card h3 { margin: 0; font-size: 16px; line-height: 1.25; } |
| .direction-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; } |
| .status-pill { |
| width: fit-content; |
| border-radius: 999px; |
| padding: 4px 9px; |
| background: rgba(204, 255, 160, 0.10); |
| color: var(--green); |
| font-size: 11px; |
| font-weight: 700; |
| } |
| .direction-counts { |
| display: grid; |
| grid-template-columns: repeat(3, minmax(0, 1fr)); |
| gap: 8px; |
| font-size: 12px; |
| color: #bcc8b7; |
| } |
| .direction-counts strong { |
| display: block; |
| font-family: var(--font-mono); |
| font-size: 18px; |
| color: var(--ink); |
| } |
| .baseline-strip { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(0, 1fr)); |
| gap: 14px; |
| margin-top: 18px; |
| } |
| .extension-grid { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(0, 1fr)); |
| gap: 16px; |
| margin: 22px 0 24px; |
| } |
| .extension-card { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| background: var(--surface); |
| padding: 18px; |
| display: grid; |
| gap: 12px; |
| align-content: start; |
| min-height: 282px; |
| } |
| .extension-card h3 { margin: 0; font-size: 15px; line-height: 1.3; } |
| .extension-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; } |
| .extension-metrics { |
| display: grid; |
| grid-template-columns: repeat(2, minmax(0, 1fr)); |
| gap: 8px; |
| font-size: 12px; |
| color: var(--muted); |
| } |
| .extension-metrics strong { |
| display: block; |
| font-family: var(--font-mono); |
| font-size: 18px; |
| color: var(--ink); |
| font-variant-numeric: tabular-nums; |
| } |
| .task-player { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| display: grid; |
| grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr); |
| gap: 24px; |
| padding: clamp(18px, 2.4vw, 28px); |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.07), rgba(7, 18, 7, 0.88)), |
| var(--surface); |
| box-shadow: 0 20px 58px rgba(0, 0, 0, 0.32); |
| } |
| .player-stage, |
| .player-copy { |
| min-width: 0; |
| } |
| .player-screen { |
| position: relative; |
| overflow: hidden; |
| border: 1px solid rgba(204, 255, 160, 0.22); |
| border-radius: var(--radius); |
| background: #020502; |
| aspect-ratio: 16 / 10; |
| } |
| .player-screen img { |
| width: 100%; |
| height: 100%; |
| object-fit: cover; |
| display: block; |
| } |
| .player-badge { |
| position: absolute; |
| left: 14px; |
| bottom: 14px; |
| max-width: calc(100% - 28px); |
| border: 1px solid rgba(204, 255, 160, 0.42); |
| border-radius: 6px; |
| background: rgba(2, 5, 2, 0.78); |
| color: #f4f8ef; |
| padding: 10px 12px; |
| backdrop-filter: blur(12px); |
| } |
| .player-badge strong { |
| display: block; |
| font-family: var(--font-ui); |
| font-size: clamp(20px, 2.4vw, 34px); |
| line-height: 1.08; |
| text-wrap: balance; |
| word-spacing: 0.06em; |
| } |
| .player-badge span { |
| display: block; |
| margin-top: 3px; |
| color: var(--green); |
| font-family: var(--font-mono); |
| font-size: 12px; |
| } |
| .player-frame-chip { |
| position: absolute; |
| left: 14px; |
| top: 14px; |
| border: 1px solid rgba(204, 255, 160, 0.36); |
| border-radius: 999px; |
| background: rgba(2, 5, 2, 0.74); |
| color: #dce8d6; |
| padding: 7px 10px; |
| font-family: var(--font-mono); |
| font-size: 11px; |
| font-weight: 700; |
| letter-spacing: 0.04em; |
| text-transform: uppercase; |
| backdrop-filter: blur(12px); |
| } |
| .player-frame-caption { |
| margin: 12px 0 0; |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| background: rgba(2, 5, 2, 0.48); |
| color: #dce8d6; |
| padding: 11px 12px; |
| font-size: 13px; |
| line-height: 1.5; |
| } |
| .player-controls { |
| display: flex; |
| align-items: center; |
| gap: 9px; |
| flex-wrap: wrap; |
| margin-top: 14px; |
| } |
| .player-controls button { |
| border: 1px solid var(--line); |
| border-radius: 6px; |
| background: rgba(2, 5, 2, 0.62); |
| color: #eaf5e5; |
| min-height: 38px; |
| padding: 0 12px; |
| font: inherit; |
| font-size: 13px; |
| font-weight: 700; |
| cursor: pointer; |
| } |
| .player-controls button.primary-control { |
| background: var(--green); |
| color: #020502; |
| border-color: var(--green); |
| } |
| .player-counter { |
| margin-left: auto; |
| color: var(--muted); |
| font-family: var(--font-mono); |
| font-size: 12px; |
| font-variant-numeric: tabular-nums; |
| } |
| .player-progress { |
| height: 6px; |
| margin-top: 12px; |
| border-radius: 999px; |
| background: rgba(204, 255, 160, 0.12); |
| overflow: hidden; |
| } |
| .player-progress span { |
| display: block; |
| width: 0; |
| height: 100%; |
| border-radius: inherit; |
| background: linear-gradient(90deg, var(--green), var(--cyan)); |
| transition: width 260ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .task-scrubber { |
| flex: 1 1 210px; |
| min-width: 180px; |
| accent-color: var(--green); |
| cursor: pointer; |
| } |
| .storyboard-steps { |
| display: grid; |
| grid-template-columns: repeat(4, minmax(0, 1fr)); |
| gap: 8px; |
| margin-top: 12px; |
| } |
| .story-button { |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| background: rgba(2, 5, 2, 0.52); |
| color: #dce8d6; |
| min-height: 48px; |
| padding: 9px 8px; |
| font: inherit; |
| text-align: left; |
| cursor: pointer; |
| } |
| .story-button strong { |
| display: block; |
| color: var(--ink); |
| font-family: var(--font-mono); |
| font-size: 11px; |
| text-transform: uppercase; |
| letter-spacing: 0.04em; |
| } |
| .story-button span { |
| display: block; |
| margin-top: 4px; |
| color: var(--muted); |
| font-size: 12px; |
| line-height: 1.25; |
| } |
| .story-button.active { |
| border-color: rgba(204, 255, 160, 0.72); |
| background: rgba(204, 255, 160, 0.12); |
| } |
| .modality-strip { |
| display: grid; |
| grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); |
| gap: 9px; |
| margin-top: 12px; |
| } |
| .modality-tile { |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| background: rgba(2, 5, 2, 0.48); |
| overflow: hidden; |
| min-width: 0; |
| } |
| .modality-tile img { |
| width: 100%; |
| aspect-ratio: 16 / 9; |
| object-fit: cover; |
| display: block; |
| background: #020502; |
| } |
| .modality-tile span { |
| display: block; |
| padding: 7px 8px; |
| color: #dce8d6; |
| font-family: var(--font-mono); |
| font-size: 11px; |
| line-height: 1.2; |
| text-transform: uppercase; |
| } |
| .player-copy { |
| display: grid; |
| gap: 18px; |
| align-content: start; |
| } |
| .player-kicker { |
| display: flex; |
| align-items: center; |
| gap: 10px; |
| flex-wrap: wrap; |
| } |
| .player-copy h3 { |
| margin: 0; |
| font-family: var(--font-ui); |
| font-size: clamp(30px, 3.4vw, 48px); |
| line-height: 1.02; |
| text-wrap: balance; |
| } |
| .player-copy p { |
| margin: 0; |
| color: var(--muted); |
| line-height: 1.62; |
| } |
| .player-case { |
| color: #eaf5e5; |
| font-size: 16px; |
| } |
| .flow-steps { |
| display: grid; |
| grid-template-columns: repeat(3, minmax(0, 1fr)); |
| gap: 10px; |
| } |
| .flow-step, |
| .module-list li { |
| border: 1px solid var(--soft-line); |
| background: rgba(204, 255, 160, 0.06); |
| border-radius: 6px; |
| padding: 10px; |
| min-width: 0; |
| } |
| .flow-step { |
| color: inherit; |
| font: inherit; |
| text-align: left; |
| cursor: pointer; |
| } |
| .flow-step.active { |
| border-color: rgba(204, 255, 160, 0.72); |
| background: rgba(204, 255, 160, 0.12); |
| } |
| .flow-step strong, |
| .module-list strong { |
| display: block; |
| margin-bottom: 5px; |
| color: var(--ink); |
| font-family: var(--font-mono); |
| font-size: 11px; |
| text-transform: uppercase; |
| letter-spacing: 0.04em; |
| } |
| .flow-step em { |
| display: block; |
| color: #dce8d6; |
| font-style: normal; |
| line-height: 1.38; |
| } |
| .module-list { |
| display: grid; |
| gap: 8px; |
| margin: 0; |
| padding: 0; |
| list-style: none; |
| color: #dce8d6; |
| font-size: 13px; |
| line-height: 1.45; |
| } |
| .task-selector { |
| display: grid; |
| grid-template-columns: repeat(4, minmax(0, 1fr)); |
| gap: 10px; |
| margin-top: 18px; |
| } |
| .selector-button { |
| border: 1px solid var(--soft-line); |
| border-radius: 6px; |
| background: rgba(2, 5, 2, 0.54); |
| color: #dce8d6; |
| font: inherit; |
| min-height: 64px; |
| padding: 10px; |
| text-align: left; |
| cursor: pointer; |
| } |
| .selector-button strong { |
| display: block; |
| color: var(--ink); |
| font-family: var(--font-ui); |
| font-size: 14px; |
| line-height: 1.15; |
| } |
| .selector-button span { |
| display: block; |
| margin-top: 4px; |
| color: var(--muted); |
| font-family: var(--font-mono); |
| font-size: 11px; |
| text-transform: uppercase; |
| } |
| .selector-button.active { |
| border-color: rgba(204, 255, 160, 0.72); |
| background: rgba(204, 255, 160, 0.12); |
| } |
| .walk-flow { |
| display: grid; |
| grid-template-columns: 0.72fr 1.15fr 0.72fr; |
| gap: 8px; |
| align-items: stretch; |
| font-size: 12px; |
| } |
| .walk-flow span { |
| border: 1px solid var(--soft-line); |
| background: rgba(204, 255, 160, 0.06); |
| border-radius: 6px; |
| padding: 9px; |
| min-height: 58px; |
| } |
| .walk-flow strong { display: block; color: var(--ink); font-size: 11px; margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.04em; } |
| .artifact { |
| border: 1px solid var(--line); |
| border-radius: var(--radius); |
| background: var(--surface); |
| padding: 18px; |
| min-height: 164px; |
| display: grid; |
| align-content: start; |
| transition: transform 240ms cubic-bezier(0.16, 1, 0.3, 1), border-color 240ms cubic-bezier(0.16, 1, 0.3, 1); |
| } |
| .artifact.primary-artifact { |
| grid-column: 1 / -1; |
| grid-template-columns: minmax(0, 1fr) auto; |
| gap: 18px; |
| align-items: end; |
| min-height: 0; |
| background: |
| linear-gradient(120deg, rgba(204, 255, 160, 0.13), rgba(122, 229, 195, 0.05)), |
| var(--surface); |
| } |
| .artifact:hover { transform: translateY(-3px); border-color: var(--green); } |
| .artifact h3 { line-height: 1.18; } |
| .artifact a { display: inline-block; margin-top: 14px; font-weight: 700; text-decoration: none; color: var(--blue); } |
| .artifact a:hover { text-decoration: underline; text-underline-offset: 4px; } |
| .repro-note { |
| margin: 0 0 18px; |
| color: var(--muted); |
| font-size: 14px; |
| line-height: 1.65; |
| } |
| |
| .code-panel { |
| background: #000; |
| color: #dff7d4; |
| border-radius: var(--radius); |
| padding: 18px; |
| overflow: auto; |
| font-family: var(--font-mono); |
| font-size: 13px; |
| line-height: 1.65; |
| border: 1px solid rgba(204, 255, 160, 0.24); |
| } |
| .code-panel button { |
| float: right; |
| margin-left: 16px; |
| height: 30px; |
| border: 1px solid rgba(204, 255, 160, 0.36); |
| color: #020502; |
| background: var(--green); |
| border-radius: 5px; |
| cursor: pointer; |
| font-weight: 700; |
| } |
| footer { |
| padding: 42px 0; |
| color: var(--muted); |
| font-size: 14px; |
| } |
| |
| |
| main > section { |
| background: #020502; |
| } |
| main > section:nth-of-type(2n + 1) { |
| background: #05060b; |
| } |
| .section-head { |
| padding-top: 24px; |
| border-top: 1px solid rgba(255, 255, 255, 0.16); |
| } |
| .section-head h2 { |
| color: #f5f7f0; |
| } |
| .section-head p, |
| .hero-copy, |
| .article-copy { |
| color: rgba(245, 247, 240, 0.76); |
| } |
| .eyebrow, |
| .roadmap-status, |
| .artifact-group-head span, |
| .brief-panel-head span, |
| .atlas-index, |
| .atlas-type, |
| .task-contract strong, |
| .walk-flow strong, |
| .flow-step strong, |
| .module-list strong, |
| .modality-tile span, |
| .selector-button span, |
| .player-frame-chip { |
| font-family: var(--font-btn); |
| } |
| .project-tab, |
| .content-tab, |
| .section-tab, |
| .filter, |
| .snapshot-actions a, |
| .reading-links a, |
| .roadmap-links a, |
| .brief-actions a, |
| .evidence-links a, |
| .atlas-head a, |
| .player-controls button, |
| .story-button, |
| .selector-button, |
| .code-panel button { |
| border-radius: 999px; |
| font-family: var(--font-btn); |
| } |
| .project-tab, |
| .content-tab, |
| .section-tab, |
| .filter, |
| .player-controls button, |
| .story-button, |
| .selector-button { |
| background: var(--ropedia-pill); |
| border-color: rgba(255, 255, 255, 0.12); |
| } |
| .project-tab:hover, |
| .content-tab:hover, |
| .section-tab:hover, |
| .filter:hover, |
| .player-controls button:hover, |
| .story-button:hover, |
| .selector-button:hover { |
| border-color: var(--green); |
| color: var(--green); |
| background: rgba(255, 255, 255, 0.08); |
| } |
| .project-tab.active, |
| .content-tab.active, |
| .section-tab.active, |
| .filter.active, |
| .story-button.active, |
| .selector-button.active { |
| border-color: var(--green); |
| color: #020502; |
| background: var(--green); |
| box-shadow: none; |
| } |
| .project-tab.active strong, |
| .project-tab.active span, |
| .content-tab.active strong, |
| .content-tab.active span, |
| .selector-button.active strong, |
| .selector-button.active span { |
| color: #020502; |
| } |
| .hero-panel, |
| .modality-atlas-panel, |
| .atlas-card, |
| .snapshot-card, |
| .roadmap-card, |
| .brief-panel, |
| .brief-card, |
| .reading-card, |
| .boundary-item, |
| .evidence-card, |
| .model, |
| .task-card, |
| .artifact-group, |
| .direction-card, |
| .extension-card, |
| .task-player, |
| .artifact, |
| .callout { |
| border-color: rgba(204, 255, 160, 0.18); |
| background: var(--ropedia-card); |
| } |
| .hero-panel, |
| .modality-atlas-panel, |
| .brief-panel, |
| .task-player, |
| .artifact.primary-artifact { |
| background: |
| linear-gradient(180deg, rgba(204, 255, 160, 0.07), rgba(5, 10, 6, 0.88)), |
| var(--ropedia-card-strong); |
| } |
| .snapshot-card:hover, |
| .roadmap-card:hover, |
| .reading-card:hover, |
| .evidence-card:hover, |
| .model:hover, |
| .task-card:hover, |
| .direction-card:hover, |
| .extension-card:hover, |
| .artifact:hover { |
| border-color: var(--green); |
| background: rgba(255, 255, 255, 0.06); |
| transform: translateY(-2px); |
| box-shadow: none; |
| } |
| .tag, |
| .status-pill, |
| .roadmap-status, |
| .player-frame-chip, |
| .frame-pill, |
| .metric-row span, |
| .player-badge, |
| .player-frame-caption, |
| .flow-step, |
| .module-list li, |
| .walk-flow span, |
| .modality-tile, |
| .signal code { |
| border-color: rgba(204, 255, 160, 0.18); |
| background: rgba(255, 255, 255, 0.05); |
| } |
| .tag, |
| .status-pill, |
| .roadmap-status { |
| color: var(--green); |
| } |
| .reading-card .step-index, |
| .button.primary, |
| .brief-actions a:first-child, |
| .player-controls button.primary-control, |
| .code-panel button { |
| background: var(--green); |
| border-color: var(--green); |
| color: #020502; |
| } |
| .track, |
| .mini-bar, |
| .player-progress { |
| background: rgba(204, 255, 160, 0.16); |
| } |
| .track > span, |
| .roadmap-card::before, |
| .mini-bar span, |
| .player-progress span, |
| .bar span { |
| background: linear-gradient(90deg, var(--green), rgba(204, 255, 160, 0.45)); |
| } |
| @media (max-width: 960px) { |
| .hero-inner, .two-col { grid-template-columns: 1fr; } |
| .hero-inner { min-height: 0; } |
| .project-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); } |
| .section-tabs { padding-top: 10px; } |
| .hero-stats, .models, .task-grid, .artifact-grid, .evidence-grid, .reading-grid, .snapshot-grid, .roadmap-grid, .brief-grid, .boundary-strip, .callout-row, .direction-grid, .baseline-strip, .extension-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } |
| .brief-panel-head { grid-template-columns: 1fr; align-items: start; } |
| .task-player { grid-template-columns: 1fr; } |
| .task-selector { grid-template-columns: repeat(3, minmax(0, 1fr)); } |
| .storyboard-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } |
| .modality-atlas { grid-template-columns: 1fr; } |
| .artifact-group-head { grid-template-columns: 1fr; align-items: start; } |
| .chart-grid { grid-template-columns: 1fr; } |
| .section-head { display: block; } |
| .section-head p { margin-top: 14px; } |
| .atlas-head { display: block; } |
| .atlas-head a { display: inline-flex; margin-top: 14px; } |
| } |
| @media (max-width: 1120px) { |
| .nav-links { display: none; } |
| } |
| @media (max-width: 640px) { |
| .wrap { width: min(100% - 28px, var(--max)); } |
| .project-tabs-shell { top: 64px; padding: 10px 0; } |
| .project-tabs { |
| display: grid; |
| grid-template-columns: repeat(5, minmax(0, 1fr)); |
| gap: 6px; |
| overflow: visible; |
| padding-bottom: 0; |
| scroll-snap-type: none; |
| } |
| .project-tab { |
| display: flex; |
| align-items: center; |
| justify-content: center; |
| min-height: 44px; |
| padding: 8px 5px; |
| text-align: center; |
| scroll-snap-align: none; |
| } |
| .project-tab strong { |
| font-size: 12px; |
| line-height: 1.05; |
| text-wrap: balance; |
| } |
| .project-tab span { |
| display: none; |
| } |
| .section-tabs { |
| flex-wrap: nowrap; |
| gap: 8px; |
| overflow-x: auto; |
| padding-top: 8px; |
| padding-bottom: 4px; |
| } |
| .section-tab { |
| flex: 0 0 auto; |
| min-height: 34px; |
| padding: 7px 10px; |
| font-size: 12px; |
| white-space: nowrap; |
| } |
| .content-tabs { |
| margin-bottom: 14px; |
| } |
| .content-tab { |
| min-width: min(76vw, 210px); |
| min-height: 52px; |
| } |
| main > section { scroll-margin-top: 112px; } |
| .hero-stats, .models, .task-grid, .artifact-grid, .evidence-grid, .reading-grid, .snapshot-grid, .roadmap-grid, .brief-grid, .boundary-strip, .chart-grid, .callout-row, .direction-grid, .baseline-strip, .extension-grid, .walk-flow, .flow-steps, .storyboard-steps, .task-selector, .atlas-rows { grid-template-columns: 1fr; } |
| .brief-panel { padding: 18px; } |
| .artifact-group { padding: 16px; } |
| .modality-atlas-panel { padding: 14px; } |
| .atlas-card { padding: 12px; } |
| .atlas-top { display: block; } |
| .atlas-type { margin-top: 8px; text-align: left; } |
| .atlas-row { grid-template-columns: 1fr; gap: 6px; } |
| .atlas-card.wide img { |
| aspect-ratio: 760 / 470; |
| object-fit: cover; |
| } |
| .artifact.primary-artifact { grid-template-columns: 1fr; } |
| .evidence-card:last-child { grid-column: auto; } |
| .hero-inner, section { padding: 46px 0; } |
| .signal { grid-template-columns: 1fr; } |
| .signal strong { text-align: left; } |
| .player-counter { width: 100%; margin-left: 0; } |
| .task-scrubber { flex-basis: 100%; } |
| .figure-pan { |
| margin-inline: 0; |
| padding-inline: 0; |
| } |
| .figure-pan .task-suite-image { |
| width: 100%; |
| min-width: 0; |
| max-width: 100%; |
| } |
| } |
| @media (prefers-reduced-motion: reduce) { |
| html { scroll-behavior: auto; } |
| *, *::before, *::after { |
| transition-duration: 1ms !important; |
| animation-duration: 1ms !important; |
| animation-iteration-count: 1 !important; |
| } |
| .motion-ready .reveal { opacity: 1; transform: none; } |
| } |
| </style> |
| </head> |
| <body> |
| <a class="skip-link" href="#main">Skip to content</a> |
| <nav class="site-nav"> |
| <div class="wrap nav-inner"> |
| <a class="brand" href="#top" aria-label="Ropedia Xperience-10M Task Suite home"> |
| <img class="brand-logo" src="assets/brand/xperience10m-logo-favicon-64.png" alt="" aria-hidden="true" width="38" height="38"> |
| <span>Ropedia Xperience-10M</span> |
| </a> |
| <div class="nav-links" aria-label="Page navigation"> |
| <a href="#overview">Overview</a> |
| <a href="#dataset-card">Data</a> |
| <a href="#suite">Tasks</a> |
| <a href="#pipeline">Method</a> |
| <a href="#models">Results</a> |
| <a href="#directions">Directions</a> |
| <a href="research_roadmap.html">Roadmap</a> |
| <a href="#walkthroughs">Demo</a> |
| <a href="single_episode_explorer.html">Explorer</a> |
| <a href="#artifacts">Files</a> |
| <a class="nav-action" href="https://huggingface.co/spaces/cy0307/ropedia-xperience-10m-task-suite">HF</a> |
| <a class="nav-action" href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite">Repo</a> |
| </div> |
| </div> |
| </nav> |
|
|
| <header class="hero" id="top"> |
| <div class="wrap hero-inner"> |
| <div> |
| <div class="eyebrow">public sample episode / multimodal task lab</div> |
| <h1>Ropedia Xperience-10M Research Task Lab.</h1> |
| <p class="hero-copy"> |
| This project uses the public Xperience-10M sample from Ropedia to explore |
| embodied-AI task design, multimodal feature construction, lightweight |
| baselines, and future Omni-model fine-tuning. It starts from the sample |
| episode available now, then keeps the same data contracts ready for |
| held-out multi-episode training when more Xperience-10M data is staged. |
| </p> |
| <div class="hero-actions"> |
| <a class="button primary" href="research_roadmap.html">Open roadmap</a> |
| <a class="button" href="#suite">Inspect 12 tasks</a> |
| <a class="button" href="single_episode_explorer.html">Open explorer</a> |
| <a class="button" href="https://cy0307-ropedia-xperience-10m-task-suite.static.hf.space/">Open HF app</a> |
| </div> |
| <div class="hero-stats"> |
| <div class="stat"><strong>5,821</strong><span>frames in sample episode</span></div> |
| <div class="stat"><strong>1,161</strong><span>20-frame windows</span></div> |
| <div class="stat"><strong>8,546</strong><span>feature dimensions</span></div> |
| <div class="stat"><strong>12+12+4</strong><span>core, neural, and extension probes</span></div> |
| </div> |
| </div> |
| <div class="hero-panel" aria-label="Signal summary"> |
| <div class="panel-top"> |
| <span>current feature allocation</span> |
| <span>aligned window</span> |
| </div> |
| <div class="signal"><code>mocap</code><div class="track"><span style="--w:24.8%;--c:#ccffa0"></span></div><strong>2,121</strong></div> |
| <div class="signal"><code>camera+imu</code><div class="track"><span style="--w:1.5%;--c:#7ae5c3"></span></div><strong>126</strong></div> |
| <div class="signal"><code>depth</code><div class="track"><span style="--w:11.5%;--c:#d8f4a5"></span></div><strong>980</strong></div> |
| <div class="signal"><code>video</code><div class="track"><span style="--w:48.2%;--c:#9bdfff"></span></div><strong>4,116</strong></div> |
| <div class="signal"><code>audio</code><div class="track"><span style="--w:2.0%;--c:#f0a45e"></span></div><strong>168</strong></div> |
| <div class="signal"><code>language</code><div class="track"><span style="--w:10.5%;--c:#f4f8ef"></span></div><strong>896</strong></div> |
| <div class="signal"><code>static</code><div class="track"><span style="--w:1.6%;--c:#a5afa2"></span></div><strong>139</strong></div> |
| </div> |
| </div> |
| </header> |
|
|
| <main id="main" class="tabbed" data-active-tab="start"> |
| <div class="project-tabs-shell" aria-label="Project section tabs"> |
| <div class="wrap project-tabs" role="tablist" aria-label="Project sections"> |
| <button type="button" class="project-tab active" id="tab-start" role="tab" data-tab-key="start" data-default-section="overview" aria-selected="true" aria-pressed="true" aria-controls="overview roadmap reading-path"> |
| <strong>Start</strong> |
| <span>project overview and roadmap</span> |
| </button> |
| <button type="button" class="project-tab" id="tab-data" role="tab" data-tab-key="data" data-default-section="dataset-card" aria-selected="false" aria-pressed="false" aria-controls="dataset-card suite walkthroughs tasks" tabindex="-1"> |
| <strong>Data & Tasks</strong> |
| <span>dataset sample and task suite</span> |
| </button> |
| <button type="button" class="project-tab" id="tab-method" role="tab" data-tab-key="method" data-default-section="pipeline" aria-selected="false" aria-pressed="false" aria-controls="protocol pipeline architectures features" tabindex="-1"> |
| <strong>Method</strong> |
| <span>pipeline and model design</span> |
| </button> |
| <button type="button" class="project-tab" id="tab-results" role="tab" data-tab-key="results" data-default-section="takeaways" aria-selected="false" aria-pressed="false" aria-controls="takeaways models neural diagnostics" tabindex="-1"> |
| <strong>Results</strong> |
| <span>takeaways and baselines</span> |
| </button> |
| <button type="button" class="project-tab" id="tab-directions" role="tab" data-tab-key="directions" data-default-section="directions" aria-selected="false" aria-pressed="false" aria-controls="directions extensions" tabindex="-1"> |
| <strong>Directions</strong> |
| <span>four tracks and probes</span> |
| </button> |
| <button type="button" class="project-tab" id="tab-resources" role="tab" data-tab-key="resources" data-default-section="artifacts" aria-selected="false" aria-pressed="false" aria-controls="evidence artifacts omni-relay run" tabindex="-1"> |
| <strong>Resources</strong> |
| <span>research artifacts and scale-up</span> |
| </button> |
| </div> |
| <div class="wrap section-tabs" id="sectionTabs" role="tablist" aria-label="Sections inside the selected project tab"></div> |
| </div> |
|
|
| <section id="overview" data-project-tab="start" role="tabpanel" aria-labelledby="tab-start" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Project overview and contributions.</h2> |
| <p>The page is organized like a compact research project: motivation and scope, dataset sample, task suite, method, baselines, research directions, interactive walkthroughs, and resources for continuing the work. The public sample is used as a real but bounded research system, not as a final full-dataset benchmark.</p> |
| </div> |
| <div class="brief-panel"> |
| <div class="brief-panel-head"> |
| <div> |
| <span>Project brief</span> |
| <h3>From one public episode to an extensible embodied-AI task lab.</h3> |
| </div> |
| <p>Xperience-10M is much larger than the public sample. This project focuses on the sample available now, turns it into clear task contracts and baseline artifacts, and keeps the same data contract ready for held-out multi-episode training when more episodes are staged.</p> |
| </div> |
| <div class="brief-grid" aria-label="Project brief cards"> |
| <article class="brief-card"> |
| <strong>What this is</strong> |
| <p>A research-development lab for understanding synchronized egocentric multimodal data, defining embodied-AI tasks, and testing small baselines before omni-model fine-tuning.</p> |
| </article> |
| <article class="brief-card"> |
| <strong>What is implemented</strong> |
| <ul> |
| <li>1,161 aligned windows from one public sample episode</li> |
| <li>12 task contracts with minimal and neural heads</li> |
| <li>Four research-direction maps and extension probes</li> |
| </ul> |
| </article> |
| <article class="brief-card"> |
| <strong>What comes next</strong> |
| <p>The next model-quality stage is a held-out episode pilot over the selected multi-episode relay, with no train/test episode leakage and a completed omni-model evaluation report.</p> |
| </article> |
| </div> |
| <div class="brief-grid" aria-label="Research capability map"> |
| <article class="brief-card"> |
| <strong>Data understanding</strong> |
| <p>Maps one public episode into synchronized windows across video, audio, depth, pose/SLAM, mocap, IMU, calibration, and language-derived signals.</p> |
| </article> |
| <article class="brief-card"> |
| <strong>Task design</strong> |
| <p>Defines embodied-AI inputs, process modules, outputs, metrics, and case-study walkthroughs instead of treating the sample as a generic classification file.</p> |
| </article> |
| <article class="brief-card"> |
| <strong>Evaluation discipline</strong> |
| <p>Keeps chronological splits, predictions, confusion matrices, leakage notes, and single-episode limitations explicit before claiming broader model quality.</p> |
| </article> |
| <article class="brief-card"> |
| <strong>Scale-up readiness</strong> |
| <p>Connects the same data contract to 32/128-episode held-out pilots, Qwen3-Omni LoRA, Cosmos-style world modeling, and later policy-model branches.</p> |
| </article> |
| </div> |
| <div class="brief-actions"> |
| <a href="research_roadmap.html">Open interactive roadmap</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/PROJECT_BRIEF.md">Read the brief</a> |
| <a href="data/project_brief.json">Project brief data</a> |
| <a href="#roadmap">Roadmap summary</a> |
| <a href="#reading-path">Reader path</a> |
| <a href="#takeaways">Current takeaways</a> |
| </div> |
| </div> |
| <div class="snapshot-grid"> |
| <article class="snapshot-card"> |
| <span class="status-pill">featured</span> |
| <h3>Interactive research roadmap</h3> |
| <p>Use this as the front door for the project: it links the 12 tasks, four research tracks, current sample evidence, and the multi-episode Qwen3-Omni scale-up path.</p> |
| <div class="snapshot-meta"> |
| <span>tracks <strong>4</strong></span> |
| <span>task contracts <strong>12</strong></span> |
| <span>roadmap phases <strong>5</strong></span> |
| </div> |
| <div class="snapshot-actions"> |
| <a href="research_roadmap.html">Open roadmap</a> |
| <a href="data/research_roadmap_interactive.json">roadmap data</a> |
| </div> |
| </article> |
| <article class="snapshot-card"> |
| <span class="status-pill">verified</span> |
| <h3>Multimodal episode pipeline</h3> |
| <p>One Xperience-10M public sample episode is converted into aligned windows and a documented feature contract.</p> |
| <div class="snapshot-meta"> |
| <span>frames <strong>5,821</strong></span> |
| <span>windows <strong>1,161</strong></span> |
| <span>features <strong>8,546</strong></span> |
| </div> |
| </article> |
| <article class="snapshot-card"> |
| <span class="status-pill">verified</span> |
| <h3>Task suite and baseline heads</h3> |
| <p>Every core task has a minimal baseline and a compact PyTorch MLP head over the same windows, splits, and labels.</p> |
| <div class="snapshot-meta"> |
| <span>core tasks <strong>12</strong></span> |
| <span>neural heads <strong>12</strong></span> |
| <span>extension probes <strong>4</strong></span> |
| </div> |
| </article> |
| <article class="snapshot-card"> |
| <span class="status-pill">verified</span> |
| <h3>Dataset source alignment</h3> |
| <p>The public description is aligned to the official gated Xperience-10M dataset card, including modalities, scale, access, and current project coverage.</p> |
| <div class="snapshot-meta"> |
| <span>full dataset <strong>gated</strong></span> |
| <span>sample scope <strong>1 episode</strong></span> |
| <span>raw data mirrored <strong>no</strong></span> |
| </div> |
| </article> |
| <article class="snapshot-card"> |
| <span class="status-pill">verified</span> |
| <h3>Public research artifacts</h3> |
| <p>Metrics, figures, walkthrough data, baseline weights, and project metadata are packaged across GitHub, GitHub Pages, and Hugging Face.</p> |
| <div class="snapshot-meta"> |
| <span>site integrity <strong>pass</strong></span> |
| <span>mirror parity <strong>pass</strong></span> |
| <span>live status <strong>pass</strong></span> |
| </div> |
| </article> |
| <article class="snapshot-card gated"> |
| <span class="status-pill">staging</span> |
| <h3>Omni-model scale-up path</h3> |
| <p>Full-dataset access is granted, a 128-episode relay is in progress with chunked parallel transfer and overlapping batch prefetch, and full training results require completed staging, held-out splits, training, and evaluation.</p> |
| <div class="snapshot-meta"> |
| <span>current stage <strong>accelerated relay staging</strong></span> |
| <span>selected set <strong>128 episodes</strong></span> |
| <span>held-out eval <strong>pending</strong></span> |
| </div> |
| </article> |
| <article class="snapshot-card gated"> |
| <span class="status-pill">not redistributed</span> |
| <h3>Data governance</h3> |
| <p>Raw MP4/HDF5/RRD files, private gated Xperience-10M data, and full Qwen weights are excluded from the public repo and HF mirrors.</p> |
| <div class="snapshot-meta"> |
| <span>raw Xperience-10M <strong>excluded</strong></span> |
| <span>full Qwen weights <strong>excluded</strong></span> |
| <span>derived artifacts <strong>included</strong></span> |
| </div> |
| </article> |
| </div> |
| <div class="snapshot-actions"> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/PROJECT_BRIEF.md">Project brief</a> |
| <a href="data/project_brief.json">brief data</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/PROJECT_STATUS.md">Project status</a> |
| <a href="data/project_status.json">status data</a> |
| <a href="data/research_roadmap.json">roadmap data</a> |
| <a href="data/project_packet.json">project packet</a> |
| <a href="data/live_publication_status.json">live publication status</a> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="roadmap" data-project-tab="start" role="tabpanel" aria-labelledby="tab-start" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Research roadmap.</h2> |
| <p>The project path is staged from the current public-sample task lab to multi-episode data staging, held-out Qwen3-Omni fine-tuning, robustness runs, and larger foundation/world-model extensions.</p> |
| </div> |
| <div class="roadmap-grid" aria-label="Research roadmap stages"> |
| <article class="roadmap-card" data-status="implemented"> |
| <span class="roadmap-status">implemented</span> |
| <h3>Public-Sample Task Lab</h3> |
| <p>One public episode is converted into aligned windows, task contracts, minimal baselines, neural heads, walkthroughs, and figures.</p> |
| <div class="roadmap-meta"> |
| <strong>Entry</strong><p>Public Xperience-10M sample episode available.</p> |
| <strong>Evidence</strong><p>Status, protocol, takeaways, summary metrics, and episode-task outputs.</p> |
| </div> |
| </article> |
| <article class="roadmap-card" data-status="active"> |
| <span class="roadmap-status">active</span> |
| <h3>Multi-Episode Data Staging</h3> |
| <p>Stage official gated episodes while preserving episode-level separation and recording missing-view coverage.</p> |
| <div class="roadmap-meta"> |
| <strong>Entry</strong><p>Gated data access and enough storage for selected episodes.</p> |
| <strong>Evidence</strong><p>Data access status, source discovery, and selected episode manifests.</p> |
| </div> |
| </article> |
| <article class="roadmap-card" data-status="next"> |
| <span class="roadmap-status">next</span> |
| <h3>Qwen3-Omni LoRA Pilot</h3> |
| <p>Train lightweight adapters on staged selected episodes and evaluate on held-out episodes with committed predictions, metrics, and run reports.</p> |
| <div class="roadmap-meta"> |
| <strong>Entry</strong><p>Selected episodes staged with no train/test episode leakage.</p> |
| <strong>Evidence</strong><p>Dataset manifest, training metadata, progress logs, metrics, and predictions.</p> |
| </div> |
| </article> |
| <article class="roadmap-card" data-status="next"> |
| <span class="roadmap-status">next</span> |
| <h3>Foundation-Model Selection Matrix</h3> |
| <p>Keep Qwen3-Omni as the first trainable held-out pilot, add Cosmos 3 for world modeling, and stage policy candidates after action targets are explicit.</p> |
| <div class="roadmap-meta"> |
| <strong>Entry</strong><p>Completed 128-episode staging or a smaller 3-8 episode preprocessing dry run.</p> |
| <strong>Evidence</strong><p>Foundation model plan, source links, model-specific entry conditions, and evaluation additions.</p> |
| </div> |
| </article> |
| <article class="roadmap-card" data-status="planned"> |
| <span class="roadmap-status">planned</span> |
| <h3>64-128 Episode Robustness Run</h3> |
| <p>Test whether pilot conclusions survive broader sessions, missing modalities, and stronger ablations.</p> |
| <div class="roadmap-meta"> |
| <strong>Entry</strong><p>Selected multi-episode pilot trains and evaluates cleanly.</p> |
| <strong>Evidence</strong><p>Metrics by session, task, modality, ablation, and failure type.</p> |
| </div> |
| </article> |
| <article class="roadmap-card" data-status="planned"> |
| <span class="roadmap-status">planned</span> |
| <h3>Cosmos 3 and Policy-Model Extensions</h3> |
| <p>Extend toward future-window prediction, action-conditioned world modeling, synthetic-data tests, policy-style next action, and affordance reasoning.</p> |
| <div class="roadmap-meta"> |
| <strong>Entry</strong><p>Enough multi-episode data, compute budget, and model-specific action or world-state targets.</p> |
| <strong>Evidence</strong><p>Task-specific held-out evaluations, qualitative inspection, and updated model cards.</p> |
| </div> |
| </article> |
| </div> |
| <div class="roadmap-links"> |
| <a href="research_roadmap.html">interactive roadmap</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/RESEARCH_ROADMAP.md">roadmap document</a> |
| <a href="data/research_roadmap.json">roadmap data</a> |
| <a href="data/foundation_model_plan.json">foundation model plan</a> |
| <a href="data/research_roadmap_interactive.json">interactive roadmap data</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/DATA_ACCESS_STATUS.md">data status</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/PROJECT_STATUS.md">project status</a> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="protocol" data-project-tab="method" role="tabpanel" aria-labelledby="tab-method" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Evaluation protocol is explicit.</h2> |
| <p>The protocol is generated from committed metric artifacts so readers can see the exact data unit, split, task targets, leakage controls, and current limitations before comparing scores.</p> |
| </div> |
| <div class="artifact-grid"> |
| <article class="artifact primary-artifact"><div><h3>Data unit</h3><p>One 20-frame aligned window from the public sample episode, stride 5 frames, 1,161 windows total, represented by 8,546 synchronized multimodal dimensions.</p></div><a href="data/evaluation_protocol.json">protocol data</a></article> |
| <article class="artifact"><h3>Split policy</h3><p>Single-episode chronological 70/30 train/test split. This avoids random future-window mixing; cross-episode generalization is measured in the later multi-episode pilot.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/EVALUATION_PROTOCOL.md">protocol document</a></article> |
| <article class="artifact"><h3>Metric contract</h3><p>All 12 tasks list input, target, primary metric, minimal baseline score, and neural MLP score from committed result files.</p><a href="data/summary_metrics.json">summary metrics</a></article> |
| <article class="artifact"><h3>Leakage controls</h3><p>Scalers fit on train windows only; future labels, target-side signals, caption/object labels, and contact labels stay on the target side unless explicitly queried.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/scripts/build_evaluation_protocol.py">builder script</a></article> |
| <article class="artifact"><h3>Audio ablation</h3><p>Audio and no-audio variants are evaluated across all 12 task contracts under the same chronological split.</p><a href="data/audio_ablation_summary.json">audio summary</a></article> |
| <article class="artifact"><h3>Foundation branch selection</h3><p>Qwen3-Omni is the first trainable baseline, Cosmos 3 becomes the world-model branch, and policy models wait for explicit action targets.</p><a href="data/foundation_model_plan.json">backbone plan</a></article> |
| <article class="artifact"><h3>Next evaluation stage</h3><p>This public-sample run covers single-episode task development. Cross-episode generalization, audio-visual learning, world modeling, policy targets, and held-out Qwen3-Omni training move to the multi-episode stage after selected data is staged.</p><a href="data/scope_claims_audit.json">pilot status</a></article> |
| <article class="artifact"><h3>Scale-up requirement</h3><p>The Omni pilot requires selected staged episodes, held-out episode splits, no train/test episode leakage, training metadata, predictions, metrics, and a run report.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/DATA_ACCESS_STATUS.md">data status</a></article> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="evidence" data-project-tab="resources" role="tabpanel" aria-labelledby="tab-resources" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Current experiments and next milestones.</h2> |
| <p>The project shows the completed public-sample task suite, then lays out the data requirements for the Qwen3-Omni scale-up path.</p> |
| </div> |
| <div class="evidence-grid"> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Aligned Xperience-10M sample windows</h3> |
| <p>5,821 frames become 1,161 synchronized 20-frame windows with an 8,546-dimensional representation.</p> |
| <div class="evidence-links"> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/episode_task_suite/summary_report.json">task-suite report</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/episode_task_suite/feature_manifest.json">feature manifest</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>12 minimal heads + 12 neural MLP heads</h3> |
| <p>Every task has a minimal interpretable head and a matching neural MLP run over the same windows, splits, and task contract.</p> |
| <div class="evidence-links"> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/tree/main/results/episode_task_suite">task artifacts</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/tree/main/results/episode_task_suite/neural_mlp">neural MLP outputs</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Audio contribution is measured task by task</h3> |
| <p>Audio variants improve the primary metric on 6 of 12 task contracts in this single-episode setting.</p> |
| <div class="evidence-links"> |
| <a href="data/audio_ablation_summary.json">audio summary</a> |
| <a href="assets/charts/audio_ablation_delta.svg">delta chart</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/audio_ablation/AUDIO_ABLATION_SUMMARY.md">report</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Four research directions are mapped by evidence type</h3> |
| <p>The Ropedia directions are labeled as direct, proxy, or diagnostic coverage, plus one coded extension probe per direction.</p> |
| <div class="evidence-links"> |
| <a href="data/research_directions.json">directions data</a> |
| <a href="data/research_direction_extensions.json">extension probes</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">current plan</span> |
| <h3>Foundation backbones are separated by role</h3> |
| <p>Qwen3-Omni stays first for held-out LoRA; Cosmos 3 is the world-model branch; OpenVLA/openpi/GR00T are policy candidates after action-space conversion.</p> |
| <div class="evidence-links"> |
| <a href="data/foundation_model_plan.json">foundation model plan</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/FOUNDATION_MODEL_PLAN.md">plan doc</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">staging</span> |
| <h3>Qwen3-Omni pilot setup</h3> |
| <p>The current Qwen3-Omni artifacts use one episode and 128 train windows. A 128-episode selected relay is in accelerated staging for held-out evaluation.</p> |
| <div class="evidence-links"> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/EVIDENCE_CONTRACT.md">evidence contract</a> |
| <a href="data/evidence_contract.json">evidence data</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Multi-episode pilot status is explicit</h3> |
| <p>The pilot status report separates setup artifacts, selected relay state, and completed held-out-episode metrics.</p> |
| <div class="evidence-links"> |
| <a href="data/scope_claims_audit.json">pilot status</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/scripts/validate_scope_claims.py">validator script</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Prepared mirrors stay synchronized</h3> |
| <p>The parity report compares critical JSON, figure, and validator files across the repo, HF Space bundle, artifact dataset bundle, and model bundle before upload.</p> |
| <div class="evidence-links"> |
| <a href="data/mirror_parity.json">mirror parity</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/scripts/validate_mirror_parity.py">validator script</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Figures are indexed</h3> |
| <p>The figure index records public visual assets, dimensions, SHA-256 hashes, source scripts, and the role each figure plays in the project narrative.</p> |
| <div class="evidence-links"> |
| <a href="data/figure_index.json">figure index</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/FIGURE_INDEX.md">figure index document</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/scripts/build_figure_index.py">builder script</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Brand assets are packaged consistently</h3> |
| <p>The generated logo system is packaged into the website header, favicon, README/HF cards, Open Graph preview, and brand-asset manifest.</p> |
| <div class="evidence-links"> |
| <a href="data/brand_assets.json">brand assets</a> |
| <a href="assets/brand/xperience10m-logo-social-card.png">logo card</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/scripts/build_brand_assets.py">builder script</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Public bundles stay lightweight</h3> |
| <p>The bundle report covers required assets, raw-data exclusion, Python cache exclusion, heavy archive exclusion, accidental HF token strings, and public-card figure freshness across GitHub and the HF bundles.</p> |
| <div class="evidence-links"> |
| <a href="data/publication_audit.json">bundle report</a> |
| <a href="data/artifact_index.json">artifact index</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/scripts/validate_publication_package.py">validator script</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Website references are validated</h3> |
| <p>The site validator checks local links, anchors, JSON bundles, and referenced image dimensions before publishing.</p> |
| <div class="evidence-links"> |
| <a href="data/website_integrity.json">website integrity</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/scripts/validate_website_integrity.py">validator script</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Release checks are collected</h3> |
| <p>The release-check manifest collects the automated validators and the live post-publish checks used to keep the release current.</p> |
| <div class="evidence-links"> |
| <a href="data/quality_gates.json">release checks</a> |
| <a href="data/live_publication_status.json">live publication</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/QUALITY_GATES.md">release-check document</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/scripts/build_quality_gates.py">builder script</a> |
| </div> |
| </article> |
| <article class="evidence-card"> |
| <span class="status-pill">verified</span> |
| <h3>Official dataset card is aligned</h3> |
| <p>The source-alignment note mirrors the public Hugging Face dataset-card facts, sample-card facts, and API metadata: gated access, sample license/tooling, modality coverage, episode layout, intended uses, and current project coverage.</p> |
| <div class="evidence-links"> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/XPERIENCE10M_DATASET_CARD_ALIGNMENT.md">alignment note</a> |
| <a href="data/xperience10m_dataset_card_alignment.json">alignment data</a> |
| <a href="https://huggingface.co/datasets/ropedia-ai/xperience-10m">official dataset</a> |
| </div> |
| </article> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="reading-path" data-project-tab="start" role="tabpanel" aria-labelledby="tab-start" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Research reading path.</h2> |
| <p>A newcomer should be able to move from the dataset sample to the task design, model baselines, current limitations, and scale-up plan without reading every file first.</p> |
| </div> |
| <div class="reading-grid"> |
| <article class="reading-card"> |
| <span class="step-index">01</span> |
| <h3>Understand the current scope</h3> |
| <p>Start with the project status, evidence contract, artifact index, scale-up readiness note, release package report, and website reference report. They separate implemented single-episode work from the prepared Qwen3-Omni scale-up.</p> |
| <div class="reading-links"> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/EVIDENCE_CONTRACT.md">contract</a> |
| <a href="data/evidence_contract.json">evidence data</a> |
| <a href="data/xperience10m_dataset_card_alignment.json">dataset card</a> |
| <a href="data/artifact_index.json">index</a> |
| <a href="data/figure_index.json">figures</a> |
| <a href="data/brand_assets.json">brand</a> |
| <a href="data/mirror_parity.json">mirrors</a> |
| <a href="data/project_status.json">status</a> |
| <a href="data/project_packet.json">packet</a> |
| <a href="data/scope_claims_audit.json">pilot status</a> |
| <a href="data/publication_audit.json">bundle</a> |
| <a href="data/website_integrity.json">site report</a> |
| </div> |
| </article> |
| <article class="reading-card"> |
| <span class="step-index">02</span> |
| <h3>Inspect one model input</h3> |
| <p>Use the window table and feature manifest to see the aligned sample unit, modality sources, and leakage controls.</p> |
| <div class="reading-links"> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/episode_task_suite/windows.csv">windows</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/episode_task_suite/feature_manifest.json">features</a> |
| </div> |
| </article> |
| <article class="reading-card"> |
| <span class="step-index">03</span> |
| <h3>Compare minimal vs neural heads</h3> |
| <p>Every task has a small interpretable baseline and a matching neural MLP head over the same feature contract and chronological split.</p> |
| <div class="reading-links"> |
| <a href="data/summary_metrics.json">summary metrics</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/tree/main/results/episode_task_suite/neural_mlp">neural heads</a> |
| </div> |
| </article> |
| <article class="reading-card"> |
| <span class="step-index">04</span> |
| <h3>Check the scale-up gate</h3> |
| <p>The multi-episode Qwen3-Omni path is prepared. The selected 128-episode result will be added after staging, preprocessing, training, and held-out evaluation pass.</p> |
| <div class="reading-links"> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/DATA_ACCESS_STATUS.md">data status</a> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/MULTI_EPISODE_ACCESS_STATUS.md">access status</a> |
| <a href="data/project_packet.json">project packet</a> |
| </div> |
| </article> |
| </div> |
| <div class="boundary-strip"> |
| <div class="boundary-item"><strong>Verified now</strong><span>One public episode, 5,821 frames, 1,161 aligned windows, 8,546 dimensions, 12 minimal heads, 12 neural heads, and 4 direction-extension probes.</span></div> |
| <div class="boundary-item"><strong>Next: multi-episode</strong><span>A selected 128-episode held-out Qwen3-Omni LoRA pilot is being staged and must pass manifest, training, and evaluation checks before metrics are reported.</span></div> |
| <div class="boundary-item"><strong>Not redistributed</strong><span>Raw videos, raw annotations, full Qwen weights, and private gated Xperience-10M data are not included in the public repo or HF bundles.</span></div> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="dataset-card" data-project-tab="data" role="tabpanel" aria-labelledby="tab-data" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Aligned with the official dataset card.</h2> |
| <p>The official Xperience-10M card describes a gated, large-scale 4D egocentric multimodal dataset. This project records that full upstream scope while focusing the implemented artifacts on one public sample episode.</p> |
| </div> |
| <div class="artifact-grid"> |
| <article class="artifact primary-artifact"><div><h3>Official scale</h3><p>About 10M experience units and 10,000 hours, with RGB video, audio, depth, camera pose/SLAM, hand/body mocap, IMU, captions, metadata, and calibration.</p></div><a href="data/xperience10m_dataset_card_alignment.json">alignment data</a></article> |
| <article class="artifact"><h3>HF file-size display</h3><p>The live Hugging Face page/API currently shows 31.9 TB hosted. This is recorded separately from the card's about-1PB full-scale storage statement.</p><a href="data/xperience10m_dataset_card_alignment.json">source data</a></article> |
| <article class="artifact"><h3>HF access path</h3><p>The source dataset is manually gated for approved non-commercial use, with an external agreement step noted by the public HF metadata.</p><a href="https://huggingface.co/datasets/ropedia-ai/xperience-10m">official HF dataset</a></article> |
| <article class="artifact"><h3>API listing snapshot</h3><p>HF API metadata observed 803 session folders and 12,103 episode folders with <code>annotation.hdf5</code>. This snapshot supports planning; it is not a local data inventory.</p><a href="data/xperience10m_dataset_card_alignment.json">metadata snapshot</a></article> |
| <article class="artifact"><h3>Public sample card</h3><p>The sample repo lists <code>cc-by-nc-4.0</code>, HOMIE Toolkit for videos/annotations, and Rerun 0.29.0 for <code>.rrd</code> visualization.</p><a href="https://huggingface.co/datasets/ropedia-ai/xperience-10m-sample">sample dataset</a></article> |
| <article class="artifact"><h3>Source notes</h3><p>The source notes summarize full-dataset facts, public sample-card facts, API-listing notes, and project coverage across the repo, website, and HF cards.</p><a href="data/source_alignment_audit.json">alignment report</a></article> |
| <article class="artifact"><h3>Episode layout</h3><p>Expected folders contain six MP4 streams and <code>annotation.hdf5</code>; <code>visualization.rrd</code> is treated as a viewer artifact and excluded from training downloads.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/XPERIENCE10M_DATASET_CARD_ALIGNMENT.md">alignment note</a></article> |
| <article class="artifact"><h3>Current project subset</h3><p>One public sample episode, 5,821 frames, 1,161 aligned windows, 8,546-dimensional task inputs, and no raw-data redistribution.</p><a href="data/modality_atlas.json">modality atlas</a></article> |
| <article class="artifact"><h3>Covered now</h3><p>Action/subtask labels, next-action prediction, temporal diagnostics, hand trajectory, contact, object relevance, caption grounding, retrieval, reconstruction, and misalignment.</p><a href="data/summary_metrics.json">summary metrics</a></article> |
| <article class="artifact"><h3>Responsible use</h3><p>The official card notes limited diversity and showcase/production quality. This project excludes identity, surveillance, biometric, sensitive-attribute, and safety-critical uses.</p><a href="data/xperience10m_dataset_card_alignment.json">use notes</a></article> |
| <article class="artifact"><h3>Later milestones</h3><p>Full audio-visual learning, caption generation, depth-pixel prediction, SLAM estimation, neural rendering, policy learning, cross-episode generalization, and held-out Qwen3-Omni evaluation.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/DATA_ACCESS_STATUS.md">data status</a></article> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="suite" data-project-tab="data" role="tabpanel" aria-labelledby="tab-data" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Ropedia Xperience-10M 12-task suite.</h2> |
| <p>The task map connects synchronized multimodal windows to 12 research task heads, then the modality atlas shows the sample streams used to build those contracts.</p> |
| </div> |
| <div class="figure-pan" id="task-suite-map"> |
| <img class="task-suite-image" src="assets/task_suite_infographic.png?v=xperience10m-taskfirst-v13-modality-xl" alt="Infographic showing all 12 Ropedia Xperience-10M tasks with enlarged full-width modality cards"> |
| </div> |
| <div class="modality-atlas-panel" id="modality-atlas" aria-labelledby="modality-atlas-title"> |
| <div class="atlas-head"> |
| <div> |
| <h3 id="modality-atlas-title">Readable modality atlas.</h3> |
| <p>Each Xperience-10M stream gets a large thumbnail, a plain sample-content line, and the exact current-baseline use. These are small derived images only; no raw MP4, HDF5, or RRD data is redistributed.</p> |
| </div> |
| <a href="data/modality_atlas.json">modality atlas</a> |
| </div> |
| <div class="modality-atlas"> |
| <article class="atlas-card"> |
| <div class="atlas-top"><div><span class="atlas-index">01</span><h4>Video</h4></div><span class="atlas-type">visual stream</span></div> |
| <img src="assets/modalities/video.jpg" alt="Public sample fisheye and stereo camera thumbnails" loading="eager" decoding="async"> |
| <div class="atlas-rows"><div class="atlas-row"><span>sample contains</span><p>6 synchronized camera MP4 streams</p></div><div class="atlas-row"><span>current baseline use</span><p>RGB/fisheye/stereo frame statistics</p></div></div> |
| </article> |
| <article class="atlas-card audio-card"> |
| <div class="atlas-top"><div><span class="atlas-index">02</span><h4>Audio</h4></div><span class="atlas-type">acoustic stream</span></div> |
| <img src="assets/modalities/audio.png" alt="AAC waveform thumbnail from the public sample MP4 stream" loading="eager" decoding="async"> |
| <div class="atlas-rows"><div class="atlas-row"><span>sample contains</span><p>Audio stream embedded in MP4</p></div><div class="atlas-row"><span>current baseline use</span><p>Acoustic signal</p></div></div> |
| </article> |
| <article class="atlas-card"> |
| <div class="atlas-top"><div><span class="atlas-index">03</span><h4>Depth</h4></div><span class="atlas-type">geometry map</span></div> |
| <img src="assets/modalities/depth.jpg" alt="Public sample depth and confidence thumbnails" loading="eager" decoding="async"> |
| <div class="atlas-rows"><div class="atlas-row"><span>sample contains</span><p>Depth map + confidence channel</p></div><div class="atlas-row"><span>current baseline use</span><p>Spatial geometry signal</p></div></div> |
| </article> |
| <article class="atlas-card"> |
| <div class="atlas-top"><div><span class="atlas-index">04</span><h4>Pose / SLAM</h4></div><span class="atlas-type">camera pose</span></div> |
| <img src="assets/modalities/pose_slam.png" alt="Public sample camera trajectory and sparse SLAM map thumbnail" loading="eager" decoding="async"> |
| <div class="atlas-rows"><div class="atlas-row"><span>sample contains</span><p>Trajectory + sparse SLAM map</p></div><div class="atlas-row"><span>current baseline use</span><p>Position + orientation features</p></div></div> |
| </article> |
| <article class="atlas-card"> |
| <div class="atlas-top"><div><span class="atlas-index">05</span><h4>Motion Capture</h4></div><span class="atlas-type">human motion</span></div> |
| <img src="assets/modalities/motion_capture.png" alt="Public sample body and hand motion capture thumbnail" loading="eager" decoding="async"> |
| <div class="atlas-rows"><div class="atlas-row"><span>sample contains</span><p>Body + hand joint tracks</p></div><div class="atlas-row"><span>current baseline use</span><p>3D mocap feature statistics</p></div></div> |
| </article> |
| <article class="atlas-card"> |
| <div class="atlas-top"><div><span class="atlas-index">06</span><h4>Inertial</h4></div><span class="atlas-type">wearable sensor</span></div> |
| <img src="assets/modalities/inertial.png" alt="Public sample accelerometer and gyroscope time-series thumbnail" loading="eager" decoding="async"> |
| <div class="atlas-rows"><div class="atlas-row"><span>sample contains</span><p>Accelerometer + gyroscope</p></div><div class="atlas-row"><span>current baseline use</span><p>Wearable motion statistics</p></div></div> |
| </article> |
| <article class="atlas-card wide"> |
| <div class="atlas-top"><div><span class="atlas-index">07</span><h4>Language</h4></div><span class="atlas-type">semantic annotation</span></div> |
| <img src="assets/modalities/language.png" alt="Public sample object tags and action caption thumbnail" loading="eager" decoding="async"> |
| <div class="atlas-rows"><div class="atlas-row"><span>sample contains</span><p>Object tags + action captions</p></div><div class="atlas-row"><span>current baseline use</span><p>Task labels + semantic targets</p></div></div> |
| </article> |
| </div> |
| <p class="atlas-note">The atlas redistributes only small derived thumbnails and metadata. Raw MP4, HDF5, and RRD files remain excluded from this repo and the Hugging Face mirrors.</p> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="pipeline" data-project-tab="method" role="tabpanel" aria-labelledby="tab-method" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>From raw episode to research artifacts.</h2> |
| <p>Every script works from one data contract: aligned multimodal windows, explicit labels, cached feature extraction, and a manifest that makes omitted modalities visible.</p> |
| </div> |
| <img class="pipeline-image" src="assets/pipeline_diagram.png?v=xperience10m-nn" alt="Verified Xperience-10M multimodal pipeline diagram"> |
| <div class="callout-row"> |
| <div class="callout"> |
| <h3>What this project enables</h3> |
| <p>It demonstrates the full development loop: reading Xperience-10M sample data, aligning modalities, converting them into model-ready windows, defining meaningful tasks, producing metrics, and packaging artifacts for continued research.</p> |
| </div> |
| <div class="callout"> |
| <h3>What still needs more data</h3> |
| <p>General embodied-intelligence model quality requires many episodes and held-out episode splits; the public sample is the development harness for that next stage.</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="takeaways" data-project-tab="results" role="tabpanel" aria-labelledby="tab-results" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>What the current results actually say.</h2> |
| <p>A generated takeaways layer reads the committed metrics, summarizes useful research signals, and identifies what still needs held-out episodes.</p> |
| </div> |
| <div class="artifact-grid"> |
| <article class="artifact primary-artifact"> |
| <div> |
| <h3>One episode becomes a benchmark contract</h3> |
| <p>The public sample is converted into 5,821 frames, 1,161 aligned 20-frame windows, and an 8,546-dimensional representation for repeatable task evaluation.</p> |
| </div> |
| <a href="data/research_takeaways.json">research takeaways</a> |
| </article> |
| <article class="artifact"> |
| <h3>Chronological split exposes class shift</h3> |
| <p>All-feature action reaches 0.9829 macro-F1 on its local split, while the 12-task chronological action head is 0.0500 macro-F1 with four unseen later action labels.</p> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/RESEARCH_TAKEAWAYS.md">takeaways</a> |
| </article> |
| <article class="artifact"> |
| <h3>Neural heads help dynamics</h3> |
| <p>Hand MPJPE improves from 0.8647 to 0.1079; temporal-order F1 rises from 0.5400 to 0.8520; misalignment F1 rises from 0.5052 to 0.7153.</p> |
| <a href="data/research_takeaways.json">metrics</a> |
| </article> |
| <article class="artifact"> |
| <h3>Retrieval and reconstruction remain open</h3> |
| <p>Ridge/cosine retrieval remains stronger than the neural projection here, and cross-modal feature reconstruction still has negative R2.</p> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/episode_task_suite/cross_modal_retrieval/metrics.json">retrieval metrics</a> |
| </article> |
| <article class="artifact"> |
| <h3>Scale means held-out episodes</h3> |
| <p>The next credible model-quality unit is a held-out multi-episode pilot across different sessions, not more adjacent windows from one sample.</p> |
| <a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/MULTI_EPISODE_ACCESS_STATUS.md">scale-up status</a> |
| </article> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="models" data-project-tab="results" role="tabpanel" aria-labelledby="tab-results" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Small baselines, no hidden machinery.</h2> |
| <p>Motion-only and current all-feature classifiers use lightweight heads so the comparison stays readable on a laptop and easy to inspect. The neural run keeps the same features and splits, then swaps in PyTorch MLP heads.</p> |
| </div> |
| <div class="models"> |
| <article class="model"><h3>Motion-only action</h3><span class="score">0.9688</span><span class="meta">macro-F1, 18 classes</span></article> |
| <article class="model"><h3>Current all-feature action</h3><span class="score">0.9829</span><span class="meta">macro-F1, 8,546 dimensions</span></article> |
| <article class="model"><h3>Motion-only subtask</h3><span class="score">0.9528</span><span class="meta">macro-F1, 14 classes</span></article> |
| <article class="model"><h3>Current all-feature subtask</h3><span class="score">0.9173</span><span class="meta">macro-F1, chronological caveats</span></article> |
| </div> |
| <img class="chart" src="assets/charts/model_macro_f1.svg" alt="Macro-F1 comparison chart"> |
| </div> |
| </section> |
|
|
| <section id="neural" data-project-tab="results" role="tabpanel" aria-labelledby="tab-results" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Neural MLP heads, same task contracts.</h2> |
| <p>The neural baseline uses small PyTorch MLP classifiers/regressors on the same 8,546-dimensional windows, chronological splits, and leakage filters. This isolates the value of a nonlinear head before moving to heavier Qwen/Omni experiments.</p> |
| </div> |
| <div class="models"> |
| <article class="model"><h3>Neural hand forecast</h3><span class="score">0.1079</span><span class="meta">MPJPE, down from 0.8647 minimal</span></article> |
| <article class="model"><h3>Neural temporal order</h3><span class="score">0.8520</span><span class="meta">F1, adjacent-window diagnostic</span></article> |
| <article class="model"><h3>Neural misalignment</h3><span class="score">0.7153</span><span class="meta">F1, shifted motion/visual/audio pairs</span></article> |
| <article class="model"><h3>Neural cross-modal retrieval</h3><span class="score">0.1300</span><span class="meta">MRR; ridge remains stronger here</span></article> |
| </div> |
| <div class="chart-grid"> |
| <img class="chart" src="assets/charts/episode_task_scores_neural_mlp.svg" alt="Neural MLP episode task score chart"> |
| <img class="chart" src="assets/charts/episode_task_scores_minimal_vs_neural.svg" alt="Minimal versus neural MLP episode task score chart"> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="directions" data-project-tab="directions" role="tabpanel" aria-labelledby="tab-directions" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>The 12 tasks organized into four research directions.</h2> |
| <p>Each task is mapped as direct, proxy, or diagnostic evidence for the Ropedia research tracks. The mapping uses two current baselines: minimal interpretable heads and neural MLP heads over the same feature contract.</p> |
| </div> |
| <div class="direction-grid"> |
| <article class="direction-card"> |
| <span class="status-pill">partially implemented</span> |
| <h3>A. Human Modeling & Motion Understanding</h3> |
| <p>Direct evidence comes from hand trajectory forecasting and contact prediction; action and object relevance are supporting proxies.</p> |
| <div class="direction-counts"><span><strong>2</strong>direct</span><span><strong>2</strong>proxy</span><span><strong>0</strong>diagnostic</span></div> |
| </article> |
| <article class="direction-card"> |
| <span class="status-pill">proxy tasks only</span> |
| <h3>B. 3D/4D Reconstruction & Neural Rendering</h3> |
| <p>Cross-modal retrieval, modality reconstruction, and misalignment detection check reconstruction prerequisites, not full geometry.</p> |
| <div class="direction-counts"><span><strong>0</strong>direct</span><span><strong>2</strong>proxy</span><span><strong>1</strong>diagnostic</span></div> |
| </article> |
| <article class="direction-card"> |
| <span class="status-pill">strongest implemented</span> |
| <h3>C. Egocentric Vision & Interaction</h3> |
| <p>Action, subtask, transition, next-action, object, caption, order, and alignment tasks directly stress egocentric understanding.</p> |
| <div class="direction-counts"><span><strong>6</strong>direct</span><span><strong>2</strong>proxy</span><span><strong>3</strong>diagnostic</span></div> |
| </article> |
| <article class="direction-card"> |
| <span class="status-pill">early proxy tasks</span> |
| <h3>D. Scene Reconstruction & World Modeling</h3> |
| <p>Current probes cover task state, object relevance, retrieval, reconstruction, temporal order, and alignment but no persistent map yet.</p> |
| <div class="direction-counts"><span><strong>0</strong>direct</span><span><strong>6</strong>proxy</span><span><strong>3</strong>diagnostic</span></div> |
| </article> |
| </div> |
| <img class="chart" src="assets/charts/research_direction_coverage.svg" alt="Coverage of the 12 Xperience-10M tasks across four research directions"> |
| <div class="baseline-strip"> |
| <div class="callout"> |
| <h3>Baseline 1: minimal heads</h3> |
| <p>Softmax, logistic, ridge, and retrieval heads keep every input/output contract readable. They are the first sanity check for whether a task is well-posed.</p> |
| </div> |
| <div class="callout"> |
| <h3>Baseline 2: neural MLP heads</h3> |
| <p>Small PyTorch MLP classifiers/regressors reuse the same features and splits. They test nonlinear gains before heavier Omni fine-tuning.</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="extensions" data-project-tab="directions" role="tabpanel" aria-labelledby="tab-directions" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Four extra probes make the directions actionable.</h2> |
| <p>These are new data-backed extension tasks computed from the same single-episode feature tensor. They add one concrete input, process, output, and metric for each research direction, while keeping the single-episode limitation explicit.</p> |
| </div> |
| <img class="chart" src="assets/charts/research_direction_extension_tasks.svg?v=xperience10m-ext" alt="Four Xperience-10M research-direction extension probes with minimal and neural metrics"> |
| <div class="extension-grid"> |
| <article class="extension-card"> |
| <span class="status-pill">A / motion</span> |
| <h3>Body and Hand Motion Intensity</h3> |
| <p><strong>Case:</strong> classify fast reach/pour windows as high motion and steady holding windows as low motion.</p> |
| <p><strong>Input:</strong> non-mocap video, depth, pose, IMU, SLAM, calibration, and language features.</p> |
| <p><strong>Output:</strong> high_motion or low_motion.</p> |
| <div class="extension-metrics"><span><strong>0.7827</strong>minimal macro-F1</span><span><strong>0.7986</strong>neural macro-F1</span></div> |
| </article> |
| <article class="extension-card"> |
| <span class="status-pill">B / views</span> |
| <h3>Multi-View Consistency Retrieval</h3> |
| <p><strong>Case:</strong> retrieve the synchronized stereo-left window from a fisheye-camera query.</p> |
| <p><strong>Input:</strong> fisheye_cam0 video features against stereo_left candidate features.</p> |
| <p><strong>Output:</strong> ranked synchronized view candidates.</p> |
| <div class="extension-metrics"><span><strong>0.5534</strong>minimal MRR</span><span><strong>0.3469</strong>neural MRR</span></div> |
| </article> |
| <article class="extension-card"> |
| <span class="status-pill">C / phase</span> |
| <h3>Action Phase Progress Estimation</h3> |
| <p><strong>Case:</strong> estimate whether a Pour coffee window is near the start, middle, or end of its action segment.</p> |
| <p><strong>Input:</strong> non-caption multimodal features.</p> |
| <p><strong>Output:</strong> 0-to-1 progress inside the current action.</p> |
| <div class="extension-metrics"><span><strong>0.3416</strong>minimal MAE</span><span><strong>0.3038</strong>neural MAE</span></div> |
| </article> |
| <article class="extension-card"> |
| <span class="status-pill">D / world</span> |
| <h3>Short-Horizon Ego-Motion Forecasting</h3> |
| <p><strong>Case:</strong> predict how the camera translation changes over the next 20 frames.</p> |
| <p><strong>Input:</strong> current sensors excluding camera translation and captions.</p> |
| <p><strong>Output:</strong> future camera-translation delta vector.</p> |
| <div class="extension-metrics"><span><strong>0.1989</strong>minimal MAE</span><span><strong>0.0989</strong>neural MAE</span></div> |
| </article> |
| </div> |
| <div class="callout-row"> |
| <div class="callout"> |
| <h3>What changed</h3> |
| <p>The four research directions now have coded extension probes, prediction/rank CSVs, JSON metrics, a Markdown summary, and a website chart generated from real sample-window features.</p> |
| </div> |
| <div class="callout"> |
| <h3>What still needs scale</h3> |
| <p>A full research result still needs many Xperience-10M episodes, held-out episode splits, stronger encoders, and direction-specific models such as body priors, renderers, or persistent scene graphs.</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="architectures" data-project-tab="method" role="tabpanel" aria-labelledby="tab-method" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>The 12 tasks share four head families.</h2> |
| <p>The diagram separates the shared episode-window representation from the task-specific heads, so the task contracts stay readable before scaling to larger models.</p> |
| </div> |
| <img class="architecture-image" src="assets/task_architectures.png?v=xperience10m-nn" alt="Verified minimal and neural architecture diagram for all 12 Ropedia Xperience-10M tasks"> |
| </div> |
| </section> |
|
|
| <section id="walkthroughs" data-project-tab="data" role="tabpanel" aria-labelledby="tab-data" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Interactive task walkthrough.</h2> |
| <p>Each task uses a common research name and a concrete case study, then opens into the input, middle modules, output, modality evidence, metric, and current limitation.</p> |
| </div> |
| <div class="task-player" id="taskPlayer"> |
| <div class="player-stage"> |
| <div class="player-screen"> |
| <img id="playerPoster" src="assets/modalities/video.jpg" alt="Representative sample modality for the selected task"> |
| <div class="player-frame-chip" id="playerFrameChip">Step 1 / 4 · Input</div> |
| <div class="player-badge"> |
| <strong id="playerBadgeTitle">Action Recognition</strong> |
| <span id="playerBadgeMeta">Egocentric Action Recognition</span> |
| </div> |
| </div> |
| <p class="player-frame-caption" id="playerFrameCaption">Input: inspect the 20-frame multimodal window before choosing the target.</p> |
| <div class="modality-strip" id="playerModalities" aria-label="Selected task modality evidence"></div> |
| <div class="player-controls"> |
| <button type="button" id="playerPrev">Previous</button> |
| <button type="button" class="primary-control" id="playerPlay">Play</button> |
| <button type="button" id="playerNext">Next</button> |
| <input class="task-scrubber" id="playerScrub" type="range" min="0" max="11" value="0" step="1" aria-label="Scrub through task cards"> |
| <span class="player-counter" id="playerCounter">01 / 12</span> |
| </div> |
| <div class="storyboard-steps" id="playerStoryboard" aria-label="Interactive walkthrough chapters"> |
| <button type="button" class="story-button active" data-stage="0" aria-pressed="true"><strong>Input</strong><span>What enters the model</span></button> |
| <button type="button" class="story-button" data-stage="1" aria-pressed="false"><strong>Process</strong><span>How the target is built</span></button> |
| <button type="button" class="story-button" data-stage="2" aria-pressed="false"><strong>Output</strong><span>What is predicted</span></button> |
| <button type="button" class="story-button" data-stage="3" aria-pressed="false"><strong>Evaluate</strong><span>Metric and limitation</span></button> |
| </div> |
| <div class="player-progress" aria-hidden="true"><span id="playerProgress"></span></div> |
| </div> |
| <article class="player-copy" aria-live="polite"> |
| <div class="player-kicker"> |
| <span class="tag supervised" id="playerFamily">supervised</span> |
| <span class="status-pill" id="playerArchitecture">multiclass classifier</span> |
| </div> |
| <h3 id="playerTitle">Action Recognition</h3> |
| <p class="player-case" id="playerCase">In the coffee-making sample, a pouring window maps to the current action label.</p> |
| <div class="flow-steps"> |
| <button type="button" class="flow-step active" data-stage="0" aria-pressed="true"><strong>Input</strong><em id="playerInput">20-frame multimodal window</em></button> |
| <button type="button" class="flow-step" data-stage="1" aria-pressed="false"><strong>Process</strong><em id="playerProcess">window features -> classifier</em></button> |
| <button type="button" class="flow-step" data-stage="2" aria-pressed="false"><strong>Output</strong><em id="playerOutput">current action class</em></button> |
| </div> |
| <ul class="module-list" id="playerModules"></ul> |
| <p id="playerMetric">Metric: macro-F1. Minimal 0.0500; neural MLP 0.0148.</p> |
| <p id="playerLimit">Current limitation: single-episode chronological split.</p> |
| </article> |
| </div> |
| <div class="task-selector" id="walkthroughSelector" aria-label="Task walkthrough selector"></div> |
| </div> |
| </section> |
|
|
| <section id="tasks" data-project-tab="data" role="tabpanel" aria-labelledby="tab-data" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Task cards and metrics.</h2> |
| <p>The 12 task cards use readable research names, representative modality thumbnails, explicit input-process-output contracts, and verified minimal versus neural scores from the committed result files.</p> |
| </div> |
| <div class="task-toolbar" aria-label="Task filters"> |
| <button class="filter active" data-filter="all">All tasks</button> |
| <button class="filter" data-filter="supervised">Supervised</button> |
| <button class="filter" data-filter="forecast">Forecast</button> |
| <button class="filter" data-filter="retrieval">Retrieval</button> |
| <button class="filter" data-filter="diagnostic">Diagnostic</button> |
| </div> |
| <div class="task-grid" id="taskGrid" aria-live="polite"></div> |
| </div> |
| </section> |
|
|
| <section id="features" data-project-tab="method" role="tabpanel" aria-labelledby="tab-method" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Every model input has a source.</h2> |
| <p>The point is not hidden complexity. Every input group maps back to a source modality and a manifest entry.</p> |
| </div> |
| <img class="chart" src="assets/charts/feature_blocks.svg" alt="All modality source chart"> |
| </div> |
| </section> |
|
|
| <section id="diagnostics" data-project-tab="results" role="tabpanel" aria-labelledby="tab-results" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Diagnostics separate memorization from signal.</h2> |
| <p>The charts make the main lesson visible: within-episode supervised labels are easy under some splits, while retrieval, grounding, forecasting, and alignment remain the useful probes.</p> |
| </div> |
| <div class="chart-grid"> |
| <img class="chart" src="assets/charts/episode_task_scores.svg" alt="Episode task suite score chart"> |
| <img class="chart" src="assets/charts/cross_modal_retrieval.svg" alt="Cross modal retrieval chart"> |
| <img class="chart" src="assets/charts/episode_task_scores_neural_mlp.svg" alt="Neural MLP task score chart"> |
| <img class="chart" src="assets/charts/episode_task_scores_minimal_vs_neural.svg" alt="Minimal versus neural score chart"> |
| <img class="chart" src="assets/charts/audio_ablation_delta.svg" alt="Measured audio delta chart across 12 task contracts"> |
| </div> |
| <p class="section-note"><a href="single_episode_explorer.html">Open the single-episode explorer</a> to inspect window-level labels, predictions, modality statistics, object labels, and diagnostic scores. The <a href="data/audio_ablation_summary.json">audio ablation summary</a> records the task-by-task audio contribution.</p> |
| </div> |
| </section> |
|
|
| <section id="artifacts" data-project-tab="resources" role="tabpanel" aria-labelledby="tab-resources" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Research artifacts for the next experiments.</h2> |
| <p>Metrics, predictions, manifests, lightweight model weights, and derived window artifacts are organized so the project can be inspected, extended, and scaled before rerunning the full pipeline. Raw Xperience-10M data and Qwen weights are not redistributed.</p> |
| </div> |
| <div class="artifact-library"> |
| <div class="content-tabs" role="tablist" aria-label="Artifact categories"> |
| <button type="button" class="content-tab active" id="artifact-tab-task-heads" role="tab" data-panel-target="artifact-panel-task-heads" aria-selected="true" aria-pressed="true" aria-controls="artifact-panel-task-heads"> |
| <strong>Task Heads</strong> |
| <span>windows, tasks, metrics</span> |
| </button> |
| <button type="button" class="content-tab" id="artifact-tab-public-surfaces" role="tab" data-panel-target="artifact-panel-public-surfaces" aria-selected="false" aria-pressed="false" aria-controls="artifact-panel-public-surfaces" tabindex="-1"> |
| <strong>Public Surfaces</strong> |
| <span>repo, HF, project map</span> |
| </button> |
| <button type="button" class="content-tab" id="artifact-tab-scale-up" role="tab" data-panel-target="artifact-panel-scale-up" aria-selected="false" aria-pressed="false" aria-controls="artifact-panel-scale-up" tabindex="-1"> |
| <strong>Scale-Up</strong> |
| <span>relay and Omni path</span> |
| </button> |
| <button type="button" class="content-tab" id="artifact-tab-checks" role="tab" data-panel-target="artifact-panel-checks" aria-selected="false" aria-pressed="false" aria-controls="artifact-panel-checks" tabindex="-1"> |
| <strong>Checks</strong> |
| <span>validators and parity</span> |
| </button> |
| </div> |
| <section class="artifact-group tabbed-panel" id="artifact-panel-task-heads" role="tabpanel" aria-labelledby="artifact-tab-task-heads"> |
| <div class="artifact-group-head"> |
| <div><span>Research artifacts</span><h3>From one episode to task heads</h3></div> |
| <p>Start with the files that define the sample windows, modality inputs, task contracts, metrics, walkthroughs, and research-direction mapping.</p> |
| </div> |
| <div class="artifact-grid"> |
| <article class="artifact primary-artifact"><div><h3>Task-suite report</h3><p>One JSON file with every task definition, split detail, feature dimension, and minimal/neural metric.</p></div><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/episode_task_suite/summary_report.json">task-suite report</a></article> |
| <article class="artifact"><h3>Windows table</h3><p>Window start/end frames and aligned action/subtask labels for the public sample episode.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/episode_task_suite/windows.csv">window table</a></article> |
| <article class="artifact"><h3>Feature manifest</h3><p>Technical source map for the current modality inputs used by the task suite.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/episode_task_suite/feature_manifest.json">feature manifest</a></article> |
| <article class="artifact"><h3>Neural MLP task results</h3><p>Per-task PyTorch MLP metrics, predictions, histories, and checkpoints for the same 12 task contracts.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/tree/main/results/episode_task_suite/neural_mlp">neural MLP outputs</a></article> |
| <article class="artifact"><h3>Four-direction taxonomy</h3><p>Generated JSON, CSV, Markdown, and website data mapping all 12 tasks to the four research tracks.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/tree/main/results/episode_task_suite/research_directions">research direction outputs</a></article> |
| <article class="artifact"><h3>Direction extension probes</h3><p>Four coded probes, one per research direction, with minimal and neural metrics plus prediction/rank CSVs.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/tree/main/results/episode_task_suite/research_direction_extensions">extension probe outputs</a></article> |
| <article class="artifact"><h3>Task walkthroughs</h3><p>Case studies for all 12 tasks, including input, middle process modules, output, metric, limitation, and task-player data.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/tree/main/results/episode_task_suite/task_walkthroughs">walkthrough outputs</a></article> |
| <article class="artifact"><h3>Audio ablation and raw upgrade</h3><p>All 72 task/variant rows comparing current audio, no audio, raw audio, replacement, and combined-input settings.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/tree/main/results/audio_ablation">audio ablation outputs</a></article> |
| <article class="artifact"><h3>Single-episode explorer</h3><p>Interactive window-level view of labels, predictions, modality statistics, object labels, and diagnostics.</p><a href="single_episode_explorer.html">open explorer</a></article> |
| <article class="artifact"><h3>Cross-modal retrieval</h3><p>The strongest self-supervised signal from the single episode.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/episode_task_suite/cross_modal_retrieval/metrics.json">retrieval metrics</a></article> |
| </div> |
| </section> |
|
|
| <section class="artifact-group tabbed-panel" id="artifact-panel-public-surfaces" role="tabpanel" aria-labelledby="artifact-tab-public-surfaces" hidden> |
| <div class="artifact-group-head"> |
| <div><span>Public surfaces</span><h3>Project map, mirrors, and runnable code</h3></div> |
| <p>Use these files to navigate the whole project, open the published mirrors, or reproduce the public-sample pipeline.</p> |
| </div> |
| <div class="artifact-grid"> |
| <article class="artifact primary-artifact"><div><h3>Artifact guide</h3><p>Human-readable map from project scope to data contract, task evidence, platform mirrors, and scale-up status.</p></div><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/ARTIFACT_GUIDE.md">artifact guide</a></article> |
| <article class="artifact"><h3>Reproduction scripts</h3><p>Training, visualization, taxonomy, walkthrough, validator, and omni-readiness scripts.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/tree/main/scripts">scripts/</a></article> |
| <article class="artifact"><h3>Hugging Face Space</h3><p>The dashboard packaged as a public static Space.</p><a href="https://huggingface.co/spaces/cy0307/ropedia-xperience-10m-task-suite">HF Space</a></article> |
| <article class="artifact"><h3>Derived HF artifacts</h3><p>Metrics, predictions, docs, and lightweight derived files without raw data redistribution.</p><a href="https://huggingface.co/datasets/cy0307/ropedia-xperience-10m-task-suite-artifacts">dataset repo</a></article> |
| <article class="artifact"><h3>HF baseline models</h3><p>Minimal NumPy softmax, ridge baselines, and neural task-head model files.</p><a href="https://huggingface.co/cy0307/ropedia-xperience-10m-task-baselines">model repo</a></article> |
| <article class="artifact"><h3>HF collection</h3><p>Space, artifacts, and model baselines grouped into one public project collection.</p><a href="https://huggingface.co/collections/cy0307/ropedia-xperience-10m-task-suite">collection</a></article> |
| <article class="artifact"><h3>Current all-feature action model</h3><p>Classifier metrics, predictions, confusion matrix, and model weights.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/min_all_modalities_action_model/metrics.json">model metrics</a></article> |
| <article class="artifact"><h3>Project packet</h3><p>Machine-readable 90-second project path and scope summary.</p><a href="data/project_packet.json">project packet</a></article> |
| </div> |
| </section> |
|
|
| <section class="artifact-group tabbed-panel" id="artifact-panel-scale-up" role="tabpanel" aria-labelledby="artifact-tab-scale-up" hidden> |
| <div class="artifact-group-head"> |
| <div><span>Scale-up path</span><h3>Prepared for multi-episode training</h3></div> |
| <p>The multi-episode Qwen3-Omni path is documented and scripted. Full-pilot metrics come after selected data is staged and held-out evaluation passes.</p> |
| </div> |
| <div class="artifact-grid"> |
| <article class="artifact primary-artifact"><div><h3>Project scope</h3><p>Connects implemented single-episode artifacts, setup-stage Omni work, current 128-episode relay, and later multi-episode milestones.</p></div><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/EVIDENCE_CONTRACT.md">evidence contract</a></article> |
| <article class="artifact"><h3>Foundation-model plan</h3><p>Backbone selection matrix covering Qwen3-Omni, Cosmos 3, GR00T, OpenVLA/openpi, Gemini Robotics, Octo, and SmolVLA-style policy candidates.</p><a href="data/foundation_model_plan.json">foundation model plan</a></article> |
| <article class="artifact"><h3>Multi-episode access status</h3><p>Public data-access path, selected 128-episode relay plan, and data requirements.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/MULTI_EPISODE_ACCESS_STATUS.md">access status</a></article> |
| <article class="artifact"><h3>Qwen3-Omni setup artifacts</h3><p>Manifests, metadata, metrics, and progress logs from the current setup run.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/episode_manifest.json">episode manifest</a></article> |
| <article class="artifact"><h3>Multi-episode data requirement</h3><p>The data status file defines what must be available before full pilot training and held-out metrics.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/DATA_ACCESS_STATUS.md">data requirement</a></article> |
| </div> |
| </section> |
|
|
| <section class="artifact-group tabbed-panel" id="artifact-panel-checks" role="tabpanel" aria-labelledby="artifact-tab-checks" hidden> |
| <div class="artifact-group-head"> |
| <div><span>Release resources</span><h3>Project files behind the research site</h3></div> |
| <p>These validator outputs support the public research artifacts by keeping links, mirrors, figures, source wording, and package boundaries consistent.</p> |
| </div> |
| <div class="artifact-grid"> |
| <article class="artifact"><h3>Artifact index</h3><p>Selective source-of-truth catalog with existence checks, sizes, and stable-file hashes.</p><a href="data/artifact_index.json">artifact index</a></article> |
| <article class="artifact"><h3>Task-surface integrity</h3><p>Checks that public task cards use readable research names, modality thumbnails, and the interactive walkthrough/player contract.</p><a href="data/task_surface_integrity.json">task-surface check</a></article> |
| <article class="artifact"><h3>Website integrity</h3><p>Checks local links, anchors, JSON files, and referenced website image dimensions.</p><a href="data/website_integrity.json">website integrity</a></article> |
| <article class="artifact"><h3>Rendered website check</h3><p>Records the latest browser-level load, tab, walkthrough deep-link, control-click, and console-health check.</p><a href="data/rendered_site_check.json">rendered website check</a></article> |
| <article class="artifact"><h3>Release checks</h3><p>One release map for automated validators and live post-publish checks.</p><a href="data/quality_gates.json">release checks</a></article> |
| <article class="artifact"><h3>Mirror parity</h3><p>Prepared repo, HF Space, artifact dataset, and model bundle parity for critical data, figures, website HTML, and validator files.</p><a href="data/mirror_parity.json">mirror parity</a></article> |
| <article class="artifact"><h3>Live publication</h3><p>Last public GitHub/HF URL verification after upload.</p><a href="data/live_publication_status.json">live publication</a></article> |
| <article class="artifact"><h3>Multi-episode pilot status</h3><p>Separates setup artifacts, selected relay state, and completed held-out-episode results.</p><a href="data/scope_claims_audit.json">pilot status</a></article> |
| <article class="artifact"><h3>Public project surface</h3><p>Presents repo, website, and Hugging Face cards with consistent naming, links, tab semantics, and reader-facing copy.</p><a href="data/public_surface_qa.json">public surface check</a></article> |
| <article class="artifact"><h3>Public bundle contents</h3><p>Summarizes raw-data exclusion, cache exclusion, archive exclusion, token-string checks, and public figure references.</p><a href="data/publication_audit.json">bundle report</a></article> |
| </div> |
| </section> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="omni-relay" data-project-tab="resources" role="tabpanel" aria-labelledby="tab-resources" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Qwen3-Omni pilot is in accelerated data staging.</h2> |
| <p>Full Xperience-10M access is granted. The current plan selects 128 metadata-balanced episodes across 128 different session UUIDs, with chunked parallel transfer and overlapping batch prefetch in progress and no held-out metrics reported yet.</p> |
| </div> |
| <div class="artifact-grid"> |
| <article class="artifact"><h3>Selection</h3><p>128 complete episodes selected from 128 unique top-level sessions, balanced across episode-size bands and split 96/16/16 for train/val/test.</p></article> |
| <article class="artifact"><h3>Transfer</h3><p>Download raw episodes only from official gated sources, exclude visualization.rrd, validate files, then stage them for training.</p></article> |
| <article class="artifact"><h3>Current LoRA artifact</h3><p>The current LoRA artifact uses the locally available sample data. The multi-episode result begins after selected data is staged, preprocessed, trained, and evaluated on held-out sessions.</p></article> |
| <article class="artifact"><h3>Backbone branches</h3><p>Qwen3-Omni is the immediate LoRA path; Cosmos 3 is the first world-model branch; GR00T/OpenVLA/openpi become policy branches after action targets are well-defined.</p><a href="data/foundation_model_plan.json">backbone plan</a></article> |
| </div> |
| </div> |
| </section> |
|
|
| <section id="run" data-project-tab="resources" role="tabpanel" aria-labelledby="tab-resources" tabindex="-1"> |
| <div class="wrap"> |
| <div class="section-head"> |
| <h2>Reproduce the suite.</h2> |
| <p>Raw Xperience-10M data is not redistributed here. The reproduction guide states the commands, expected outputs, exact-match reproduction record, and multi-episode requirements.</p> |
| </div> |
| <div class="artifact-grid"> |
| <article class="artifact"><h3>Reproducibility guide</h3><p>Human-readable commands, expected artifacts, and current scope for the public single-episode pipeline.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/REPRODUCIBILITY.md">reproducibility guide</a></article> |
| <article class="artifact"><h3>Reproducibility matrix</h3><p>Machine-readable command matrix covering sample download, baselines, 12 tasks, figures, and validation.</p><a href="data/reproducibility_matrix.json">reproducibility matrix</a></article> |
| <article class="artifact"><h3>Exact-match reproduction record</h3><p>The last metric rebuild reproduced the public-sample outputs from a fresh cache and matched the committed metrics.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/notes/reproducibility_audit.md">reproduction audit</a></article> |
| <article class="artifact"><h3>Website reference report</h3><p>Local HTML references, anchors, JSON bundles, and image dimensions are validated before publishing.</p><a href="data/website_integrity.json">website integrity</a></article> |
| <article class="artifact"><h3>Multi-episode pilot status</h3><p>The Qwen3-Omni pilot is prepared at the code and selection-plan level; final metrics follow completed staging, preprocessing, training, and held-out evaluation.</p><a href="https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite/blob/main/results/omni_finetune/DATA_ACCESS_STATUS.md">data requirement</a></article> |
| </div> |
| <p class="repro-note">Minimal path: install the toolkit dependencies, download the official sample, run the 12-task suite with neural heads, regenerate visualizations, then run the artifact index and publication validator.</p> |
| <pre class="code-panel"><button type="button" data-copy="setup">Copy</button><code id="setup">git clone https://github.com/Ropedia/HOMIE-toolkit.git |
| python3.12 -m venv .venv |
| source .venv/bin/activate |
| pip install -r HOMIE-toolkit/requirements.txt huggingface_hub hf_xet |
| git clone https://github.com/ChaoYue0307/ropedia-xperience-10m-task-suite.git |
| pip install -r ropedia-xperience-10m-task-suite/requirements.txt |
| pip install torch |
|
|
| hf download ropedia-ai/xperience-10m-sample \ |
| --repo-type dataset \ |
| --local-dir data/sample/xperience-10m-sample |
|
|
| cd ropedia-xperience-10m-task-suite |
| export WORKSPACE=/path/to/workspace |
| python scripts/episode_task_suite.py --workspace "$WORKSPACE" --include-neural |
| python scripts/research_direction_extension_tasks.py |
| python scripts/task_walkthroughs.py |
| python scripts/generate_visualizations.py |
| python scripts/render_overview_figures.py |
| python scripts/render_task_suite_infographic.py |
| python scripts/export_modality_atlas_assets.py |
| python scripts/validate_website_integrity.py |
| python scripts/validate_scope_claims.py |
| python scripts/build_artifact_index.py |
| python scripts/validate_mirror_parity.py |
| python scripts/validate_publication_package.py</code></pre> |
| </div> |
| </section> |
| </main> |
|
|
| <footer> |
| <div class="wrap"> |
| Built as a single-episode embodied-AI learning lab, with the next stage focused on multi-episode training and held-out episode evaluation. |
| </div> |
| </footer> |
|
|
| <script> |
| const modalityMeta = { |
| video: { label: "Video", src: "assets/modalities/video.jpg" }, |
| audio: { label: "Audio", src: "assets/modalities/audio.png" }, |
| depth: { label: "Depth", src: "assets/modalities/depth.jpg" }, |
| pose_slam: { label: "Pose / SLAM", src: "assets/modalities/pose_slam.png" }, |
| motion_capture: { label: "Motion Capture", src: "assets/modalities/motion_capture.png" }, |
| inertial: { label: "Inertial", src: "assets/modalities/inertial.png" }, |
| language: { label: "Language", src: "assets/modalities/language.png" } |
| }; |
| const familyAccent = { |
| supervised: "#9bdfff", |
| forecast: "#ccffa0", |
| retrieval: "#7ae5c3", |
| diagnostic: "#d8f4a5" |
| }; |
| let taskEntries = []; |
| let activeTaskIndex = 0; |
| let activeStageIndex = 0; |
| let activeFilter = "all"; |
| let playerTimer = null; |
| const storyStages = [ |
| { key: "input", label: "Input" }, |
| { key: "process", label: "Process" }, |
| { key: "output", label: "Output" }, |
| { key: "evaluate", label: "Evaluate" } |
| ]; |
| const tabSections = Array.from(document.querySelectorAll("[data-project-tab]")); |
| const tabButtons = Array.from(document.querySelectorAll("[data-tab-key]")); |
| const sectionTabs = document.getElementById("sectionTabs"); |
| const sectionConfig = [ |
| { id: "overview", label: "Project Overview" }, |
| { id: "roadmap", label: "Roadmap" }, |
| { id: "reading-path", label: "Reading Path" }, |
| { id: "dataset-card", label: "Dataset Card" }, |
| { id: "suite", label: "12-Task Map" }, |
| { id: "walkthroughs", label: "Interactive Walkthrough" }, |
| { id: "tasks", label: "Task Cards" }, |
| { id: "pipeline", label: "Pipeline" }, |
| { id: "protocol", label: "Evaluation Protocol" }, |
| { id: "architectures", label: "Model Architectures" }, |
| { id: "features", label: "Feature Blocks" }, |
| { id: "takeaways", label: "Research Takeaways" }, |
| { id: "models", label: "Minimal Baselines" }, |
| { id: "neural", label: "Neural Heads" }, |
| { id: "directions", label: "Four Directions" }, |
| { id: "extensions", label: "Extension Probes" }, |
| { id: "diagnostics", label: "Diagnostic Charts" }, |
| { id: "artifacts", label: "Research Artifacts" }, |
| { id: "evidence", label: "Research Progress" }, |
| { id: "omni-relay", label: "Omni Scale-Up" }, |
| { id: "run", label: "Reproduce" } |
| ]; |
| const sectionLabels = Object.fromEntries(sectionConfig.map((section) => [section.id, section.label])); |
| const sectionTabMap = Object.fromEntries(tabSections.map((section) => [section.id, section.dataset.projectTab])); |
| const tabDefaultSections = Object.fromEntries( |
| tabButtons.map((button) => [button.dataset.tabKey, button.dataset.defaultSection]) |
| ); |
| |
| function orderedSectionsForTab(tabKey) { |
| const configured = sectionConfig |
| .map(({ id }) => document.getElementById(id)) |
| .filter((section) => section?.dataset.projectTab === tabKey); |
| const configuredIds = new Set(configured.map((section) => section.id)); |
| const unconfigured = tabSections.filter((section) => ( |
| section.dataset.projectTab === tabKey && !configuredIds.has(section.id) |
| )); |
| return [...configured, ...unconfigured]; |
| } |
| |
| function labelForSection(section) { |
| return sectionLabels[section.id] || |
| section.querySelector("h2")?.textContent?.replace(/\.$/, "") || |
| section.id.replaceAll("-", " "); |
| } |
| |
| function renderSectionTabs(tabKey, activeSectionId) { |
| if (!sectionTabs) return; |
| const sections = orderedSectionsForTab(tabKey); |
| sectionTabs.replaceChildren(); |
| sections.forEach((section, index) => { |
| const button = document.createElement("button"); |
| const active = section.id === activeSectionId; |
| button.type = "button"; |
| button.className = `section-tab${active ? " active" : ""}`; |
| button.id = `section-tab-${section.id}`; |
| button.dataset.sectionTarget = section.id; |
| button.setAttribute("role", "tab"); |
| button.setAttribute("aria-controls", section.id); |
| button.setAttribute("aria-selected", active ? "true" : "false"); |
| button.setAttribute("aria-pressed", active ? "true" : "false"); |
| button.tabIndex = active ? 0 : -1; |
| button.textContent = labelForSection(section); |
| button.addEventListener("click", () => { |
| setProjectTab(tabKey, { |
| targetId: section.id, |
| pushHash: true, |
| scroll: true, |
| smooth: true |
| }); |
| }); |
| button.addEventListener("keydown", (event) => { |
| if (!["ArrowRight", "ArrowDown", "ArrowLeft", "ArrowUp", "Home", "End"].includes(event.key)) return; |
| event.preventDefault(); |
| const lastIndex = sections.length - 1; |
| let nextIndex = index; |
| if (event.key === "ArrowRight" || event.key === "ArrowDown") nextIndex = index === lastIndex ? 0 : index + 1; |
| if (event.key === "ArrowLeft" || event.key === "ArrowUp") nextIndex = index === 0 ? lastIndex : index - 1; |
| if (event.key === "Home") nextIndex = 0; |
| if (event.key === "End") nextIndex = lastIndex; |
| const nextSection = sections[nextIndex]; |
| const nextButton = sectionTabs.querySelector(`[data-section-target="${nextSection.id}"]`); |
| nextButton?.focus(); |
| setProjectTab(tabKey, { |
| targetId: nextSection.id, |
| pushHash: true, |
| scroll: true, |
| smooth: true |
| }); |
| }); |
| sectionTabs.appendChild(button); |
| }); |
| } |
| |
| function setProjectTab(tabKey, options = {}) { |
| const fallbackTab = tabDefaultSections[tabKey] ? tabKey : "start"; |
| const requestedId = options.targetId || tabDefaultSections[fallbackTab] || "overview"; |
| const targetId = sectionTabMap[requestedId] === fallbackTab |
| ? requestedId |
| : tabDefaultSections[fallbackTab] || "overview"; |
| document.getElementById("main").dataset.activeTab = fallbackTab; |
| document.getElementById("main").dataset.activeSection = targetId; |
| tabSections.forEach((section) => { |
| section.hidden = section.id !== targetId; |
| }); |
| tabButtons.forEach((button) => { |
| const active = button.dataset.tabKey === fallbackTab; |
| button.classList.toggle("active", active); |
| button.setAttribute("aria-selected", active ? "true" : "false"); |
| button.setAttribute("aria-pressed", active ? "true" : "false"); |
| button.tabIndex = active ? 0 : -1; |
| }); |
| renderSectionTabs(fallbackTab, targetId); |
| if (options.pushHash) { |
| history.pushState(null, "", `#${targetId}`); |
| } |
| if (options.scroll) { |
| requestAnimationFrame(() => { |
| document.getElementById(targetId)?.scrollIntoView({ |
| behavior: options.smooth ? "smooth" : "auto", |
| block: "start" |
| }); |
| }); |
| } |
| } |
| |
| function activateTabForHash(options = {}) { |
| const hashId = decodeURIComponent(window.location.hash.replace(/^#/, "")); |
| const tabKey = sectionTabMap[hashId] || "start"; |
| const targetId = sectionTabMap[hashId] ? hashId : tabDefaultSections[tabKey]; |
| setProjectTab(tabKey, { targetId, scroll: options.scroll, smooth: options.smooth }); |
| } |
| |
| function moveProjectTabFocus(currentIndex, key) { |
| const lastIndex = tabButtons.length - 1; |
| let nextIndex = currentIndex; |
| if (key === "ArrowRight" || key === "ArrowDown") nextIndex = currentIndex === lastIndex ? 0 : currentIndex + 1; |
| if (key === "ArrowLeft" || key === "ArrowUp") nextIndex = currentIndex === 0 ? lastIndex : currentIndex - 1; |
| if (key === "Home") nextIndex = 0; |
| if (key === "End") nextIndex = lastIndex; |
| const nextButton = tabButtons[nextIndex]; |
| nextButton.focus(); |
| setProjectTab(nextButton.dataset.tabKey, { |
| targetId: nextButton.dataset.defaultSection, |
| pushHash: true, |
| scroll: true, |
| smooth: true |
| }); |
| } |
| |
| tabButtons.forEach((button, index) => { |
| button.addEventListener("click", () => { |
| setProjectTab(button.dataset.tabKey, { |
| targetId: button.dataset.defaultSection, |
| pushHash: true, |
| scroll: true, |
| smooth: true |
| }); |
| }); |
| button.addEventListener("keydown", (event) => { |
| if (!["ArrowRight", "ArrowDown", "ArrowLeft", "ArrowUp", "Home", "End"].includes(event.key)) return; |
| event.preventDefault(); |
| moveProjectTabFocus(index, event.key); |
| }); |
| }); |
| window.addEventListener("hashchange", () => activateTabForHash({ scroll: true })); |
| activateTabForHash({ scroll: Boolean(window.location.hash) }); |
| |
| function initContentTabs() { |
| document.querySelectorAll(".content-tabs").forEach((tablist) => { |
| const buttons = Array.from(tablist.querySelectorAll("[data-panel-target]")); |
| if (!buttons.length) return; |
| |
| const activatePanel = (activeButton, options = {}) => { |
| buttons.forEach((button) => { |
| const active = button === activeButton; |
| const panel = document.getElementById(button.dataset.panelTarget); |
| button.classList.toggle("active", active); |
| button.setAttribute("aria-selected", active ? "true" : "false"); |
| button.setAttribute("aria-pressed", active ? "true" : "false"); |
| button.tabIndex = active ? 0 : -1; |
| if (panel) panel.hidden = !active; |
| }); |
| if (options.focus) activeButton.focus(); |
| }; |
| |
| buttons.forEach((button, index) => { |
| button.addEventListener("click", () => activatePanel(button)); |
| button.addEventListener("keydown", (event) => { |
| if (!["ArrowRight", "ArrowDown", "ArrowLeft", "ArrowUp", "Home", "End"].includes(event.key)) return; |
| event.preventDefault(); |
| const lastIndex = buttons.length - 1; |
| let nextIndex = index; |
| if (event.key === "ArrowRight" || event.key === "ArrowDown") nextIndex = index === lastIndex ? 0 : index + 1; |
| if (event.key === "ArrowLeft" || event.key === "ArrowUp") nextIndex = index === 0 ? lastIndex : index - 1; |
| if (event.key === "Home") nextIndex = 0; |
| if (event.key === "End") nextIndex = lastIndex; |
| activatePanel(buttons[nextIndex], { focus: true }); |
| }); |
| }); |
| |
| activatePanel(buttons.find((button) => button.classList.contains("active")) || buttons[0]); |
| }); |
| } |
| initContentTabs(); |
| |
| const escapeHtml = (value) => String(value ?? "") |
| .replaceAll("&", "&") |
| .replaceAll("<", "<") |
| .replaceAll(">", ">") |
| .replaceAll('"', """) |
| .replaceAll("'", "'"); |
| |
| const formatMetric = (value) => { |
| if (value === null || value === undefined || Number.isNaN(Number(value))) return "n/a"; |
| const numeric = Number(value); |
| if (Math.abs(numeric) >= 10) return numeric.toFixed(2); |
| return numeric.toFixed(4); |
| }; |
| |
| const metricBarWidth = (task) => { |
| const value = Number(task.metric?.neural_mlp ?? task.metric?.minimal ?? 0); |
| if (!Number.isFinite(value)) return 4; |
| if (task.metric?.name === "R2") return Math.max(4, Math.min(100, (value + 1) * 50)); |
| if (task.metric?.direction === "lower") return Math.max(4, Math.min(100, 100 / (1 + Math.max(value, 0)))); |
| return Math.max(4, Math.min(100, value * 100)); |
| }; |
| |
| const normalizeTasks = (payload) => Object.values(payload.tasks || {}); |
| |
| const modalityLabels = (task) => (task.modalities || []) |
| .map((key) => modalityMeta[key]?.label) |
| .filter(Boolean) |
| .join(", "); |
| |
| function stageNarration(task) { |
| const minimal = formatMetric(task.metric?.minimal); |
| const neural = formatMetric(task.metric?.neural_mlp); |
| const modules = (task.middle_modules || []).slice(0, 2).join(" "); |
| return [ |
| `Input: ${task.input_short}. Evidence shown here comes from ${modalityLabels(task)}.`, |
| `Process: ${task.process_short}. ${modules}`, |
| `Output: ${task.output_short}. Case study: ${task.case_study}`, |
| `Evaluate: ${task.metric.name}, ${task.metric.direction} is better. Minimal ${minimal}; neural MLP ${neural}. Limitation: ${task.failure_mode}` |
| ]; |
| } |
| |
| function renderTaskCards() { |
| const grid = document.getElementById("taskGrid"); |
| grid.innerHTML = taskEntries.map((task, index) => { |
| const family = task.task_family; |
| const poster = modalityMeta[task.poster_modality] || modalityMeta.video; |
| const minimal = formatMetric(task.metric?.minimal); |
| const neural = formatMetric(task.metric?.neural_mlp); |
| return ` |
| <button type="button" class="task-card" data-kind="${escapeHtml(family)}" data-index="${index}" aria-pressed="false"> |
| <span class="task-card-media" aria-hidden="true"> |
| <img src="${poster.src}" alt=""> |
| </span> |
| <div class="task-top"> |
| <span> |
| <span class="task-name">${escapeHtml(task.display_name)}</span> |
| <span class="task-research-name">${escapeHtml(task.research_name)}</span> |
| </span> |
| <span class="tag ${escapeHtml(family)}">${escapeHtml(family)}</span> |
| </div> |
| <p>${escapeHtml(task.card_blurb)}</p> |
| <div class="task-contract"> |
| <span><strong>Input</strong>${escapeHtml(task.input_short)}</span> |
| <span><strong>Middle</strong>${escapeHtml(task.process_short)}</span> |
| <span><strong>Output</strong>${escapeHtml(task.output_short)}</span> |
| </div> |
| <div class="metric-row"> |
| <span><strong>${minimal}</strong>minimal ${escapeHtml(task.metric?.name)}</span> |
| <span><strong>${neural}</strong>neural MLP</span> |
| </div> |
| <div class="mini-bar"><span style="--w:${metricBarWidth(task).toFixed(1)}%;--c:${familyAccent[family] || "#ccffa0"}"></span></div> |
| </button> |
| `; |
| }).join(""); |
| grid.querySelectorAll(".task-card").forEach((card) => { |
| card.addEventListener("click", () => { |
| pausePlayer(); |
| setActiveTask(Number(card.dataset.index)); |
| document.getElementById("walkthroughs").scrollIntoView({ behavior: "smooth", block: "start" }); |
| }); |
| }); |
| applyTaskFilter(activeFilter); |
| } |
| |
| function renderSelector() { |
| const selector = document.getElementById("walkthroughSelector"); |
| selector.innerHTML = taskEntries.map((task, index) => ` |
| <button type="button" class="selector-button" data-index="${index}" aria-pressed="false"> |
| <strong>${escapeHtml(task.display_name)}</strong> |
| <span>${escapeHtml(task.task_family)}</span> |
| </button> |
| `).join(""); |
| selector.querySelectorAll(".selector-button").forEach((button) => { |
| button.addEventListener("click", () => { |
| pausePlayer(); |
| setActiveTask(Number(button.dataset.index)); |
| }); |
| }); |
| } |
| |
| function renderPlayer(task, index) { |
| const poster = modalityMeta[task.poster_modality] || modalityMeta.video; |
| document.getElementById("playerPoster").src = poster.src; |
| document.getElementById("playerPoster").alt = `${task.display_name} representative ${poster.label} modality`; |
| document.getElementById("playerBadgeTitle").textContent = task.display_name; |
| document.getElementById("playerBadgeMeta").textContent = task.research_name; |
| document.getElementById("playerFamily").className = `tag ${task.task_family}`; |
| document.getElementById("playerFamily").textContent = task.task_family; |
| document.getElementById("playerArchitecture").textContent = task.architecture_family; |
| document.getElementById("playerTitle").textContent = task.display_name; |
| document.getElementById("playerCase").textContent = task.case_study; |
| document.getElementById("playerInput").textContent = task.input_short; |
| document.getElementById("playerProcess").textContent = task.process_short; |
| document.getElementById("playerOutput").textContent = task.output_short; |
| document.getElementById("playerModules").innerHTML = task.middle_modules.map((module, moduleIndex) => ( |
| `<li><strong>Module ${String(moduleIndex + 1).padStart(2, "0")}</strong>${escapeHtml(module)}</li>` |
| )).join(""); |
| document.getElementById("playerMetric").textContent = `${task.metric.name} (${task.metric.direction} is better). Minimal ${formatMetric(task.metric.minimal)}; neural MLP ${formatMetric(task.metric.neural_mlp)}.`; |
| document.getElementById("playerLimit").textContent = `Current limitation: ${task.failure_mode}`; |
| document.getElementById("playerScrub").max = Math.max(0, taskEntries.length - 1); |
| document.getElementById("playerScrub").value = index; |
| document.getElementById("playerModalities").innerHTML = task.modalities.map((key) => { |
| const modality = modalityMeta[key] || modalityMeta.video; |
| return `<span class="modality-tile"><img src="${modality.src}" alt="${escapeHtml(modality.label)} sample thumbnail"><span>${escapeHtml(modality.label)}</span></span>`; |
| }).join(""); |
| renderStageFrame(task, index); |
| } |
| |
| function renderStageFrame(task, index) { |
| const stage = storyStages[activeStageIndex] || storyStages[0]; |
| const narration = stageNarration(task); |
| const totalFrames = Math.max(1, taskEntries.length * storyStages.length); |
| const currentFrame = index * storyStages.length + activeStageIndex + 1; |
| document.getElementById("playerFrameChip").textContent = `Step ${activeStageIndex + 1} / ${storyStages.length} · ${stage.label}`; |
| document.getElementById("playerFrameCaption").textContent = narration[activeStageIndex] || narration[0]; |
| document.getElementById("playerCounter").textContent = `${String(index + 1).padStart(2, "0")} / ${String(taskEntries.length).padStart(2, "0")} · ${stage.label}`; |
| document.getElementById("playerProgress").style.width = `${(currentFrame / totalFrames) * 100}%`; |
| document.querySelectorAll("[data-stage]").forEach((button) => { |
| const active = Number(button.dataset.stage) === activeStageIndex; |
| button.classList.toggle("active", active); |
| button.setAttribute("aria-pressed", active ? "true" : "false"); |
| }); |
| } |
| |
| function updateActiveMarkers() { |
| document.querySelectorAll(".task-card").forEach((card) => { |
| const active = Number(card.dataset.index) === activeTaskIndex; |
| card.classList.toggle("active", active); |
| card.setAttribute("aria-pressed", active ? "true" : "false"); |
| }); |
| document.querySelectorAll(".selector-button").forEach((button) => { |
| const active = Number(button.dataset.index) === activeTaskIndex; |
| button.classList.toggle("active", active); |
| button.setAttribute("aria-pressed", active ? "true" : "false"); |
| }); |
| } |
| |
| function setActiveTask(index, options = {}) { |
| if (!taskEntries.length) return; |
| activeTaskIndex = (index + taskEntries.length) % taskEntries.length; |
| if (options.resetStage !== false) activeStageIndex = 0; |
| renderPlayer(taskEntries[activeTaskIndex], activeTaskIndex); |
| updateActiveMarkers(); |
| } |
| |
| function setActiveStage(index) { |
| if (!taskEntries.length) return; |
| activeStageIndex = (index + storyStages.length) % storyStages.length; |
| renderStageFrame(taskEntries[activeTaskIndex], activeTaskIndex); |
| } |
| |
| function advancePlayer() { |
| if (activeStageIndex < storyStages.length - 1) { |
| setActiveStage(activeStageIndex + 1); |
| return; |
| } |
| setActiveTask(activeTaskIndex + 1); |
| } |
| |
| function applyTaskFilter(filter) { |
| activeFilter = filter; |
| document.querySelectorAll(".filter").forEach((button) => { |
| const active = button.dataset.filter === filter; |
| button.classList.toggle("active", active); |
| button.setAttribute("aria-pressed", active ? "true" : "false"); |
| }); |
| document.querySelectorAll(".task-card").forEach((card) => { |
| card.classList.toggle("hide", filter !== "all" && card.dataset.kind !== filter); |
| }); |
| } |
| |
| function pausePlayer() { |
| if (playerTimer) { |
| window.clearInterval(playerTimer); |
| playerTimer = null; |
| document.getElementById("playerPlay").textContent = "Play"; |
| } |
| } |
| |
| function togglePlayer() { |
| if (playerTimer) { |
| pausePlayer(); |
| return; |
| } |
| document.getElementById("playerPlay").textContent = "Pause"; |
| playerTimer = window.setInterval(advancePlayer, 2600); |
| } |
| |
| async function initTaskSurface() { |
| try { |
| const response = await fetch("data/task_walkthroughs.json", { cache: "no-cache" }); |
| if (!response.ok) throw new Error(`task data ${response.status}`); |
| taskEntries = normalizeTasks(await response.json()); |
| renderTaskCards(); |
| renderSelector(); |
| setActiveTask(0); |
| } catch (error) { |
| document.getElementById("taskGrid").innerHTML = '<p class="repro-note">Task walkthrough data could not be loaded.</p>'; |
| document.getElementById("walkthroughSelector").innerHTML = ""; |
| } |
| } |
| |
| document.querySelectorAll(".filter").forEach((button) => { |
| button.addEventListener("click", () => applyTaskFilter(button.dataset.filter)); |
| }); |
| document.getElementById("playerPrev").addEventListener("click", () => { pausePlayer(); setActiveTask(activeTaskIndex - 1); }); |
| document.getElementById("playerNext").addEventListener("click", () => { pausePlayer(); setActiveTask(activeTaskIndex + 1); }); |
| document.getElementById("playerPlay").addEventListener("click", togglePlayer); |
| document.getElementById("playerScrub").addEventListener("input", (event) => { |
| pausePlayer(); |
| setActiveTask(Number(event.target.value)); |
| }); |
| document.querySelectorAll("[data-stage]").forEach((button) => { |
| button.addEventListener("click", () => { |
| pausePlayer(); |
| setActiveStage(Number(button.dataset.stage)); |
| }); |
| }); |
| initTaskSurface(); |
| |
| document.querySelectorAll("[data-copy]").forEach((button) => { |
| button.addEventListener("click", async () => { |
| const target = document.getElementById(button.dataset.copy); |
| try { |
| await navigator.clipboard.writeText(target.innerText); |
| } catch (error) { |
| return; |
| } |
| const previous = button.textContent; |
| button.textContent = "Copied"; |
| setTimeout(() => button.textContent = previous, 1300); |
| }); |
| }); |
| |
| </script> |
| </body> |
| </html> |
|
|
