bug fix

app.py

@@ -17,20 +17,293 @@ EGOFORCE_ROOT = Path(os.environ.get("EGOFORCE_ROOT", SPACE_ROOT / "EgoForce")).r
 EGOFORCE_ASSETS_REPO_ID = os.environ.get("EGOFORCE_ASSETS_REPO_ID", "chris10/EgoForce")
 ZEROGPU_DURATION_SECONDS = os.environ.get("ZEROGPU_DURATION_SECONDS", "600")
 ZEROGPU_SIZE = os.environ.get("ZEROGPU_SIZE", "large")
-HERO_CSS_SPACE_PATCH_MARKER = "/* EgoForce Space patch: prose-safe hero sizing */"
+HERO_CSS_SPACE_PATCH_MARKER = "/* EgoForce Space patch: dual-theme hero styling */"
 HERO_CSS_SPACE_PATCH = f"""
 {HERO_CSS_SPACE_PATCH_MARKER}
+:root,
+.gradio-container {{
+    --egoforce-bg-start: #fcf8f1;
+    --egoforce-bg-end: #f3ead8;
+    --egoforce-bg-accent: rgba(201, 95, 73, 0.14);
+    --egoforce-card-bg: linear-gradient(168deg, rgba(255, 251, 245, 0.96), rgba(246, 238, 225, 0.94));
+    --egoforce-card-border: rgba(173, 128, 93, 0.28);
+    --egoforce-shadow: 0 20px 52px rgba(111, 76, 44, 0.14);
+    --egoforce-text-primary: #1f2937;
+    --egoforce-text-secondary: #374151;
+    --egoforce-text-muted: #4b5563;
+    --egoforce-link-bg: rgba(255, 255, 255, 0.82);
+    --egoforce-link-border: rgba(128, 91, 58, 0.35);
+    --egoforce-link-text: #1f2937;
+    --egoforce-link-hover-bg: rgba(201, 95, 73, 0.15);
+    --egoforce-link-hover-border: rgba(201, 95, 73, 0.48);
+}}
+
+@media (prefers-color-scheme: dark) {{
+    :root,
+    .gradio-container {{
+        --egoforce-bg-start: #0b1020;
+        --egoforce-bg-end: #121a2f;
+        --egoforce-bg-accent: rgba(56, 189, 248, 0.18);
+        --egoforce-card-bg: linear-gradient(165deg, rgba(17, 24, 39, 0.94), rgba(30, 41, 59, 0.9));
+        --egoforce-card-border: rgba(125, 211, 252, 0.26);
+        --egoforce-shadow: 0 24px 56px rgba(2, 8, 23, 0.52);
+        --egoforce-text-primary: #e5e7eb;
+        --egoforce-text-secondary: #d1d5db;
+        --egoforce-text-muted: #cbd5e1;
+        --egoforce-link-bg: rgba(15, 23, 42, 0.62);
+        --egoforce-link-border: rgba(125, 211, 252, 0.4);
+        --egoforce-link-text: #e2e8f0;
+        --egoforce-link-hover-bg: rgba(14, 116, 144, 0.35);
+        --egoforce-link-hover-border: rgba(125, 211, 252, 0.65);
+    }}
+}}
+
+html.dark,
+body.dark,
+.dark,
+html[data-theme="dark"],
+body[data-theme="dark"] {{
+    --egoforce-bg-start: #0b1020;
+    --egoforce-bg-end: #121a2f;
+    --egoforce-bg-accent: rgba(56, 189, 248, 0.18);
+    --egoforce-card-bg: linear-gradient(165deg, rgba(17, 24, 39, 0.94), rgba(30, 41, 59, 0.9));
+    --egoforce-card-border: rgba(125, 211, 252, 0.26);
+    --egoforce-shadow: 0 24px 56px rgba(2, 8, 23, 0.52);
+    --egoforce-text-primary: #e5e7eb;
+    --egoforce-text-secondary: #d1d5db;
+    --egoforce-text-muted: #cbd5e1;
+    --egoforce-link-bg: rgba(15, 23, 42, 0.62);
+    --egoforce-link-border: rgba(125, 211, 252, 0.4);
+    --egoforce-link-text: #e2e8f0;
+    --egoforce-link-hover-bg: rgba(14, 116, 144, 0.35);
+    --egoforce-link-hover-border: rgba(125, 211, 252, 0.65);
+}}
+
+body,
+.gradio-container {{
+    background-image:
+        radial-gradient(circle at center top, var(--egoforce-bg-accent), rgba(0, 0, 0, 0) 36%),
+        linear-gradient(180deg, var(--egoforce-bg-start) 0%, var(--egoforce-bg-end) 100%) !important;
+    color: var(--egoforce-text-primary) !important;
+}}
+
+.egoforce-hero-card,
+.prose .egoforce-hero .egoforce-hero-card {{
+    background: var(--block-background-fill) !important;
+    background-image: linear-gradient(
+        168deg,
+        color-mix(in srgb, var(--block-background-fill) 94%, #ffffff 6%),
+        color-mix(in srgb, var(--block-background-fill) 96%, #000000 4%)
+    ) !important;
+    border: 1px solid var(--block-border-color) !important;
+    box-shadow: var(--egoforce-shadow) !important;
+}}
+
 .egoforce-hero-title,
 .prose .egoforce-hero .egoforce-hero-title {{
-  font-size: clamp(2.6rem, 6vw, 4.8rem) !important;
-  line-height: 1 !important;
+    font-size: clamp(2.6rem, 6vw, 4.8rem) !important;
+    line-height: 1 !important;
+    color: var(--egoforce-text-primary) !important;
+}}
+
+.egoforce-brand-black,
+.prose .egoforce-hero .egoforce-brand-black {{
+    color: var(--body-text-color) !important;
+    font-variant-caps: small-caps;
+    letter-spacing: 0.015em;
+}}
+
+.egoforce-brand-force,
+.prose .egoforce-hero .egoforce-brand-force {{
+    color: #b42018 !important;
+    font-variant-caps: small-caps;
+    letter-spacing: 0.015em;
+}}
+
+.egoforce-hero-subtitle,
+.egoforce-hero-authors,
+.egoforce-hero-venue,
+.prose .egoforce-hero .egoforce-hero-subtitle,
+.prose .egoforce-hero .egoforce-hero-authors,
+.prose .egoforce-hero .egoforce-hero-venue {{
+    color: var(--body-text-color) !important;
+}}
+
+.egoforce-hero-affiliations,
+.egoforce-hero-caption,
+.prose .egoforce-hero .egoforce-hero-affiliations,
+.prose .egoforce-hero .egoforce-hero-caption {{
+    color: var(--body-text-color-subdued) !important;
 }}
 
 .egoforce-hero-icon,
 .prose .egoforce-hero img.egoforce-hero-icon {{
-  height: clamp(3.2rem, 7vw, 5.4rem) !important;
-  width: auto !important;
-  max-width: none !important;
+    height: clamp(3.2rem, 7vw, 5.4rem) !important;
+    width: auto !important;
+    max-width: none !important;
+}}
+
+.egoforce-hero-link,
+.prose .egoforce-hero .egoforce-hero-link {{
+    background: var(--egoforce-link-bg) !important;
+    border-color: var(--egoforce-link-border) !important;
+    color: var(--egoforce-link-text) !important;
+}}
+
+.egoforce-hero-link:hover,
+.prose .egoforce-hero .egoforce-hero-link:hover {{
+    background: var(--egoforce-link-hover-bg) !important;
+    border-color: var(--egoforce-link-hover-border) !important;
+}}
+
+.egoforce-hero-link svg,
+.prose .egoforce-hero .egoforce-hero-link svg {{
+    color: var(--egoforce-link-text) !important;
+}}
+
+@media (prefers-color-scheme: dark) {{
+    body,
+    .gradio-container {{
+        background-image:
+            radial-gradient(circle at center top, rgba(56, 189, 248, 0.18), rgba(0, 0, 0, 0) 36%),
+            linear-gradient(180deg, #0b1020 0%, #121a2f 100%) !important;
+        color: #e5e7eb !important;
+    }}
+
+    .egoforce-hero-card,
+    .prose .egoforce-hero .egoforce-hero-card {{
+        background: linear-gradient(165deg, rgba(17, 24, 39, 0.94), rgba(30, 41, 59, 0.9)) !important;
+        border-color: rgba(125, 211, 252, 0.26) !important;
+        box-shadow: 0 24px 56px rgba(2, 8, 23, 0.52) !important;
+    }}
+
+    .egoforce-hero-title,
+    .egoforce-hero-subtitle,
+    .egoforce-hero-authors,
+    .egoforce-hero-affiliations,
+    .egoforce-hero-venue,
+    .egoforce-hero-caption,
+    .prose .egoforce-hero .egoforce-hero-title,
+    .prose .egoforce-hero .egoforce-hero-subtitle,
+    .prose .egoforce-hero .egoforce-hero-authors,
+    .prose .egoforce-hero .egoforce-hero-affiliations,
+    .prose .egoforce-hero .egoforce-hero-venue,
+    .prose .egoforce-hero .egoforce-hero-caption {{
+        color: #e5e7eb !important;
+    }}
+
+    .egoforce-brand-black,
+    .prose .egoforce-hero .egoforce-brand-black {{
+        color: #e5e7eb !important;
+    }}
+
+    .egoforce-brand-force,
+    .prose .egoforce-hero .egoforce-brand-force {{
+        color: #b42018 !important;
+    }}
+
+    .egoforce-hero-link,
+    .prose .egoforce-hero .egoforce-hero-link {{
+        background: rgba(15, 23, 42, 0.62) !important;
+        border-color: rgba(125, 211, 252, 0.4) !important;
+        color: #e2e8f0 !important;
+    }}
+
+    .egoforce-hero-link:hover,
+    .prose .egoforce-hero .egoforce-hero-link:hover {{
+        background: rgba(14, 116, 144, 0.35) !important;
+        border-color: rgba(125, 211, 252, 0.65) !important;
+    }}
+
+    .egoforce-hero-link svg,
+    .prose .egoforce-hero .egoforce-hero-link svg {{
+        color: #e2e8f0 !important;
+    }}
+}}
+
+html.dark .egoforce-hero-card,
+body.dark .egoforce-hero-card,
+html[data-theme="dark"] .egoforce-hero-card,
+body[data-theme="dark"] .egoforce-hero-card,
+.dark .egoforce-hero-card,
+html.dark .prose .egoforce-hero .egoforce-hero-card,
+body.dark .prose .egoforce-hero .egoforce-hero-card,
+html[data-theme="dark"] .prose .egoforce-hero .egoforce-hero-card,
+body[data-theme="dark"] .prose .egoforce-hero .egoforce-hero-card,
+.dark .prose .egoforce-hero .egoforce-hero-card {{
+    background: linear-gradient(165deg, rgba(17, 24, 39, 0.94), rgba(30, 41, 59, 0.9)) !important;
+    border-color: rgba(125, 211, 252, 0.26) !important;
+    box-shadow: 0 24px 56px rgba(2, 8, 23, 0.52) !important;
+}}
+
+html.dark .gradio-container,
+body.dark .gradio-container,
+html[data-theme="dark"] .gradio-container,
+body[data-theme="dark"] .gradio-container,
+.dark .gradio-container {{
+    background-image:
+        radial-gradient(circle at center top, rgba(56, 189, 248, 0.18), rgba(0, 0, 0, 0) 36%),
+        linear-gradient(180deg, #0b1020 0%, #121a2f 100%) !important;
+    color: #e5e7eb !important;
+}}
+
+html.dark .egoforce-hero-title,
+html.dark .egoforce-hero-subtitle,
+html.dark .egoforce-hero-authors,
+html.dark .egoforce-hero-affiliations,
+html.dark .egoforce-hero-venue,
+html.dark .egoforce-hero-caption,
+body.dark .egoforce-hero-title,
+body.dark .egoforce-hero-subtitle,
+body.dark .egoforce-hero-authors,
+body.dark .egoforce-hero-affiliations,
+body.dark .egoforce-hero-venue,
+body.dark .egoforce-hero-caption,
+html[data-theme="dark"] .egoforce-hero-title,
+html[data-theme="dark"] .egoforce-hero-subtitle,
+html[data-theme="dark"] .egoforce-hero-authors,
+html[data-theme="dark"] .egoforce-hero-affiliations,
+html[data-theme="dark"] .egoforce-hero-venue,
+html[data-theme="dark"] .egoforce-hero-caption,
+body[data-theme="dark"] .egoforce-hero-title,
+body[data-theme="dark"] .egoforce-hero-subtitle,
+body[data-theme="dark"] .egoforce-hero-authors,
+body[data-theme="dark"] .egoforce-hero-affiliations,
+body[data-theme="dark"] .egoforce-hero-venue,
+body[data-theme="dark"] .egoforce-hero-caption,
+.dark .egoforce-hero-title,
+.dark .egoforce-hero-subtitle,
+.dark .egoforce-hero-authors,
+.dark .egoforce-hero-affiliations,
+.dark .egoforce-hero-venue,
+.dark .egoforce-hero-caption {{
+    color: #e5e7eb !important;
+}}
+
+html.dark .egoforce-brand-black,
+body.dark .egoforce-brand-black,
+html[data-theme="dark"] .egoforce-brand-black,
+body[data-theme="dark"] .egoforce-brand-black,
+.dark .egoforce-brand-black {{
+    color: #e5e7eb !important;
+}}
+
+html.dark .egoforce-brand-force,
+body.dark .egoforce-brand-force,
+html[data-theme="dark"] .egoforce-brand-force,
+body[data-theme="dark"] .egoforce-brand-force,
+.dark .egoforce-brand-force {{
+    color: #b42018 !important;
+}}
+
+html.dark .egoforce-hero-link,
+body.dark .egoforce-hero-link,
+html[data-theme="dark"] .egoforce-hero-link,
+body[data-theme="dark"] .egoforce-hero-link,
+.dark .egoforce-hero-link {{
+    background: rgba(15, 23, 42, 0.62) !important;
+    border-color: rgba(125, 211, 252, 0.4) !important;
+    color: #e2e8f0 !important;
 }}
 """.strip()
 
@@ -193,6 +466,8 @@ def patch_upstream_gradio_hero_css(repo_root: Path) -> None:
 
     css_source = css_path.read_text(encoding="utf-8")
     if HERO_CSS_SPACE_PATCH_MARKER in css_source:
+        base_css = css_source.split(HERO_CSS_SPACE_PATCH_MARKER, 1)[0].rstrip()
+        css_path.write_text(f"{base_css}\n\n{HERO_CSS_SPACE_PATCH}\n", encoding="utf-8")
         return
 
     css_path.write_text(f"{css_source.rstrip()}\n\n{HERO_CSS_SPACE_PATCH}\n", encoding="utf-8")