@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap";
*{box-sizing:border-box;margin:0;padding:0}:root{--helix-teal:#0d9488;--helix-teal-light:#14b8a6;--helix-teal-dark:#134e4a;--helix-teal-subtle:#ccfbf1;--discovery-coral:#f97316;--discovery-coral-light:#fb923c;--discovery-coral-subtle:#fff7ed;--bio-purple:#7c3aed;--bio-purple-light:#a78bfa;--bio-purple-subtle:#ede9fe;--midnight:#0f172a;--slate-900:#1e293b;--slate-700:#334155;--slate-500:#64748b;--slate-400:#94a3b8;--slate-200:#e2e8f0;--slate-100:#f1f5f9;--cloud:#f8fafc;--white:#fff;--success:#10b981;--success-subtle:#d1fae5;--warning:#f59e0b;--warning-subtle:#fef3c7;--error:#ef4444;--error-subtle:#fee2e2;--font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-mono:"JetBrains Mono","Monaco","Menlo",monospace;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;--shadow-glow:0 0 20px #0d948826;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-full:9999px}body{font-family:var(--font-sans);background:var(--cloud);min-height:100vh;color:var(--slate-900);line-height:1.6}.container{max-width:1200px;margin:0 auto;padding:2rem}.header{text-align:center;border-bottom:1px solid var(--slate-200);margin-bottom:2.5rem;padding-bottom:2rem;position:relative}.logo{justify-content:center;align-items:center;gap:.75rem;margin-bottom:.75rem;display:inline-flex}.logo-icon{width:48px;height:48px;position:relative}.logo-icon svg{width:100%;height:100%}.header h1{letter-spacing:-.025em;background:linear-gradient(135deg,var(--helix-teal)0%,var(--helix-teal-dark)50%,var(--bio-purple)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:2.25rem;font-weight:800}.header .subtitle{color:var(--slate-500);margin-top:.25rem;font-size:1.125rem;font-weight:500}.header .badge{background:var(--helix-teal-subtle);color:var(--helix-teal-dark);border-radius:var(--radius-full);border:1px solid #0d948833;align-items:center;gap:.5rem;margin-top:1rem;padding:.375rem 1rem;font-size:.8rem;font-weight:600;display:inline-flex}.badge-dot{background:var(--helix-teal);border-radius:50%;width:6px;height:6px;animation:2s infinite pulse}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}.query-section{background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);border:1px solid var(--slate-200);margin-bottom:1.75rem;padding:1.75rem}.query-section h2{color:var(--slate-500);text-transform:uppercase;letter-spacing:.05em;margin-bottom:1rem;font-size:.875rem;font-weight:600}.query-input-wrapper{gap:.75rem;display:flex}.query-input{border:2px solid var(--slate-200);border-radius:var(--radius-md);font-size:1rem;font-family:var(--font-sans);background:var(--cloud);flex:1;padding:1rem 1.25rem;transition:all .2s}.query-input::placeholder{color:var(--slate-400)}.query-input:focus{border-color:var(--helix-teal);background:var(--white);outline:none;box-shadow:0 0 0 3px #0d94881a}.query-button{background:linear-gradient(135deg,var(--helix-teal)0%,var(--helix-teal-dark)100%);color:var(--white);border-radius:var(--radius-md);font-size:1rem;font-weight:600;font-family:var(--font-sans);cursor:pointer;border:none;align-items:center;gap:.5rem;padding:1rem 2rem;transition:all .2s;display:flex}.query-button:hover:not(:disabled){box-shadow:var(--shadow-lg),var(--shadow-glow);transform:translateY(-2px)}.query-button:active:not(:disabled){transform:translateY(0)}.query-button:disabled{opacity:.5;cursor:not-allowed}.example-queries{flex-wrap:wrap;gap:.5rem;margin-top:1.25rem;display:flex}.example-query{background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius-full);font-size:.8rem;font-family:var(--font-sans);color:var(--slate-700);cursor:pointer;padding:.5rem .875rem;transition:all .2s}.example-query:hover{background:var(--helix-teal);color:var(--white);border-color:var(--helix-teal);transform:translateY(-1px)}.results-section{grid-template-columns:1fr 1fr;gap:1.5rem;display:grid}.result-card{background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);border:1px solid var(--slate-200);padding:1.5rem}.result-card h3{color:var(--helix-teal-dark);text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:.625rem;margin-bottom:1.25rem;font-size:.8rem;font-weight:700;display:flex}.result-card h3:before{content:"";background:linear-gradient(180deg,var(--helix-teal)0%,var(--bio-purple)100%);border-radius:2px;width:4px;height:18px}.answer-text{color:var(--slate-700);font-size:.95rem;line-height:1.8}.answer-text p{margin-bottom:1rem}.answer-text strong{color:var(--slate-900);font-weight:600}.answer-text h4{color:var(--helix-teal-dark);margin-top:1.25rem;margin-bottom:.5rem;font-size:1rem;font-weight:700}.answer-text li{margin-bottom:.375rem;margin-left:1.25rem}.context-preview{background:var(--slate-100);border-radius:var(--radius-md);font-family:var(--font-mono);color:var(--slate-600);white-space:pre-wrap;border:1px solid var(--slate-200);min-height:200px;max-height:400px;padding:1.25rem;font-size:.8rem;line-height:1.6;overflow-y:auto}.records-list{flex-direction:column;gap:.875rem;display:flex}.record-item{background:var(--slate-100);border-radius:var(--radius-md);border-left:4px solid var(--helix-teal);padding:1rem 1.25rem;transition:all .2s}.record-item:hover{box-shadow:var(--shadow-sm);transform:translate(2px)}.record-item.outlier{border-left-color:var(--discovery-coral);background:var(--discovery-coral-subtle)}.record-item .gene{color:var(--slate-900);font-size:1.05rem;font-weight:700;font-family:var(--font-mono);flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.record-item .meta{color:var(--slate-500);margin-top:.375rem;font-size:.8rem}.record-item .notes{color:var(--slate-700);margin-top:.5rem;font-size:.875rem;line-height:1.5}.status-badge{border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.03em;font-size:.65rem;font-weight:700;font-family:var(--font-sans);align-items:center;padding:.2rem .6rem;display:inline-flex}.status-badge.validated{background:var(--success-subtle);color:#047857}.status-badge.outlier{background:var(--discovery-coral-subtle);color:#c2410c}.status-badge.under_review{background:var(--bio-purple-subtle);color:#6d28d9}.loading{color:var(--slate-500);justify-content:center;align-items:center;padding:2.5rem;font-weight:500;display:flex}.loading:after{content:"";border:3px solid var(--slate-200);border-top-color:var(--helix-teal);border-radius:50%;width:22px;height:22px;margin-left:.875rem;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.metadata-bar{background:var(--slate-100);border-radius:var(--radius-md);color:var(--slate-500);font-size:.8rem;font-family:var(--font-mono);justify-content:space-between;align-items:center;margin-top:1.25rem;padding:.875rem 1rem;display:flex}.metadata-bar span{align-items:center;gap:.375rem;display:flex}.full-width{grid-column:1/-1}@media (max-width:900px){.results-section{grid-template-columns:1fr}.metadata-bar{flex-wrap:wrap;gap:.5rem}}@media (max-width:600px){.container{padding:1rem}.header{margin-bottom:1.5rem;padding-bottom:1.25rem}.logo-icon{width:40px;height:40px}.header h1{font-size:1.625rem}.header .subtitle{font-size:.95rem}.header .badge{padding:.3rem .75rem;font-size:.7rem}.query-section{padding:1.25rem}.query-section h2{font-size:.75rem}.query-input-wrapper{flex-direction:column}.query-input{padding:.875rem 1rem;font-size:.95rem}.query-button{justify-content:center;width:100%;padding:.875rem 1.25rem;font-size:.95rem}.example-queries{gap:.4rem}.example-query{padding:.4rem .7rem;font-size:.7rem}.result-card{border-radius:var(--radius-md);padding:1.25rem}.result-card h3{font-size:.75rem}.answer-text{font-size:.9rem;line-height:1.7}.record-item{padding:.875rem 1rem}.record-item .gene{font-size:.95rem}.record-item .meta{font-size:.7rem}.record-item .notes{font-size:.8rem}.status-badge{padding:.15rem .5rem;font-size:.6rem}.context-preview{min-height:150px;max-height:280px;padding:1rem;font-size:.7rem}.metadata-bar{flex-direction:column;align-items:flex-start;gap:.4rem;padding:.75rem;font-size:.7rem}.loading{padding:1.75rem;font-size:.9rem}}@media (max-width:380px){.container{padding:.75rem}.header h1{font-size:1.375rem}.example-query{padding:.35rem .6rem;font-size:.65rem}}