|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8" /> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
|
|
<title>SomAI - Patient Education Companion</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet"> |
|
|
<script> |
|
|
tailwind.config = { |
|
|
theme: { |
|
|
extend: { |
|
|
fontFamily: { |
|
|
sans: ['Inter', 'sans-serif'], |
|
|
mono: ['JetBrains Mono', 'monospace'], |
|
|
}, |
|
|
colors: { |
|
|
neon: { |
|
|
green: '#00ff80', |
|
|
yellow: '#ffc300', |
|
|
red: '#ff3300', |
|
|
blue: '#00ccff', |
|
|
bg: '#050505', |
|
|
panel: 'rgba(255, 255, 255, 0.03)', |
|
|
border: 'rgba(255, 255, 255, 0.1)', |
|
|
} |
|
|
}, |
|
|
animation: { |
|
|
'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite', |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
</script> |
|
|
<style> |
|
|
body { |
|
|
background-color: #050505; |
|
|
background-image: radial-gradient(circle at 50% 50%, #1a1a1a 0%, #000000 100%); |
|
|
color: white; |
|
|
font-family: 'Inter', sans-serif; |
|
|
} |
|
|
.glass-panel { |
|
|
background: rgba(10, 10, 10, 0.6); |
|
|
backdrop-filter: blur(16px); |
|
|
-webkit-backdrop-filter: blur(16px); |
|
|
border: 1px solid rgba(255, 255, 255, 0.08); |
|
|
} |
|
|
.glass-card { |
|
|
background: rgba(255, 255, 255, 0.03); |
|
|
border: 1px solid rgba(255, 255, 255, 0.05); |
|
|
transition: all 0.2s ease; |
|
|
} |
|
|
.glass-card:hover { |
|
|
background: rgba(255, 255, 255, 0.05); |
|
|
border-color: rgba(255, 255, 255, 0.1); |
|
|
} |
|
|
|
|
|
|
|
|
#printable-root { |
|
|
position: absolute; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 0; |
|
|
height: 0; |
|
|
overflow: hidden; |
|
|
visibility: hidden; |
|
|
} |
|
|
|
|
|
@media print { |
|
|
@page { size: auto; margin: 10mm; } |
|
|
|
|
|
body { |
|
|
background: white !important; |
|
|
color: black !important; |
|
|
overflow: visible !important; |
|
|
} |
|
|
|
|
|
#root { |
|
|
display: none !important; |
|
|
} |
|
|
|
|
|
#printable-root { |
|
|
position: relative !important; |
|
|
width: 100% !important; |
|
|
height: auto !important; |
|
|
overflow: visible !important; |
|
|
visibility: visible !important; |
|
|
display: block !important; |
|
|
z-index: 9999; |
|
|
} |
|
|
|
|
|
|
|
|
* { |
|
|
-webkit-print-color-adjust: exact !important; |
|
|
print-color-adjust: exact !important; |
|
|
} |
|
|
} |
|
|
</style> |
|
|
<script type="importmap"> |
|
|
{ |
|
|
"imports": { |
|
|
"@google/genai": "https://aistudiocdn.com/@google/genai@^1.30.0", |
|
|
"lucide-react": "https://aistudiocdn.com/lucide-react@^0.555.0", |
|
|
"react-dom": "https://aistudiocdn.com/react-dom@^19.2.0", |
|
|
"react-dom/": "https://aistudiocdn.com/react-dom@^19.2.0/", |
|
|
"recharts": "https://aistudiocdn.com/recharts@^3.5.1", |
|
|
"react/": "https://aistudiocdn.com/react@^19.2.0/", |
|
|
"react": "https://aistudiocdn.com/react@^19.2.0" |
|
|
} |
|
|
} |
|
|
</script> |
|
|
</head> |
|
|
<body> |
|
|
<div id="root"></div> |
|
|
<div id="printable-root"></div> |
|
|
<script type="module" src="/index.tsx"></script> |
|
|
</body> |
|
|
</html> |
