Rebuild company overview analysis page

components/analysis/bull-bear-panel.tsx

@@ -0,0 +1,56 @@
+import Link from 'next/link';
+import { Panel } from '@/components/ui/panel';
+import type { CompanyBullBear } from '@/lib/types';
+
+type BullBearPanelProps = {
+  bullBear: CompanyBullBear;
+  researchHref: string;
+  onLinkPrefetch?: () => void;
+};
+
+export function BullBearPanel(props: BullBearPanelProps) {
+  const hasContent = props.bullBear.bull.length > 0 || props.bullBear.bear.length > 0;
+
+  return (
+    <Panel
+      title="Bull vs Bear"
+      subtitle="The highest-level reasons investors may lean in or lean out right now."
+      className="pt-2"
+    >
+      {!hasContent ? (
+        <div className="border-t border-dashed border-[color:var(--line-weak)] py-5 text-sm text-[color:var(--terminal-muted)]">
+          No synthesis inputs are available yet. Add memo sections or filing context in Research to populate this debate surface.
+          <div className="mt-4">
+            <Link href={props.researchHref} onMouseEnter={props.onLinkPrefetch} onFocus={props.onLinkPrefetch} className="text-xs uppercase tracking-[0.14em] text-[color:var(--accent)] hover:text-[color:var(--accent-strong)]">
+              Open research workspace
+            </Link>
+          </div>
+        </div>
+      ) : (
+        <div className="grid gap-4 lg:grid-cols-2">
+          <section className="border-t border-[rgba(150,245,191,0.24)] pt-5">
+            <h3 className="text-lg font-semibold text-[color:var(--terminal-bright)]">Bull case</h3>
+            <ul className="mt-4 space-y-3">
+              {props.bullBear.bull.map((item) => (
+                <li key={item} className="border-t border-[rgba(150,245,191,0.16)] pt-3 text-sm leading-6 text-[color:var(--terminal-bright)]">
+                  {item}
+                </li>
+              ))}
+            </ul>
+          </section>
+
+          <section className="border-t border-[rgba(255,159,159,0.24)] pt-5">
+            <h3 className="text-lg font-semibold text-[color:var(--terminal-bright)]">Bear case</h3>
+            <ul className="mt-4 space-y-3">
+              {props.bullBear.bear.map((item) => (
+                <li key={item} className="border-t border-[rgba(255,159,159,0.16)] pt-3 text-sm leading-6 text-[color:var(--terminal-bright)]">
+                  {item}
+                </li>
+              ))}
+            </ul>
+          </section>
+        </div>
+      )}
+    </Panel>
+  );
+}