@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600;1,700;1,800&display=swap";:root{font-family:Manrope,system-ui,sans-serif;color:#e7edf5;background:#07111f;font-synthesis:none;--ink:#e7edf5;--muted:#96a8bd;--line:rgba(162,190,216,.18);--panel:#0d1b2c;--panel2:#10243a;--accent:#67e8f9;--warm:#f1c98e}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:radial-gradient(ellipse at 15% -10%,#163252 0,transparent 50%),#07111f}button,input{font:inherit}button{cursor:pointer}.app-shell{max-width:1520px;margin:0 auto;min-height:100vh;padding:0 28px}.topbar{height:82px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:11px;margin-right:auto}.brand-mark{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--accent);color:var(--accent);font-size:14px}.brand strong{display:block;font-size:13px;letter-spacing:.02em}.brand div span{display:block;font-size:10px;color:var(--muted);margin-top:4px;letter-spacing:.06em;text-transform:uppercase}.topbar nav{display:flex;gap:24px}.topbar nav a,.footer-links a{color:var(--muted);font-size:11px;text-decoration:none}.topbar nav a:hover,.footer-links a:hover{color:var(--ink)}.status-dot{font:10px DM Mono,monospace;color:#9bd9ad;display:flex;align-items:center;gap:7px}.status-dot i{width:6px;height:6px;border-radius:50%;background:#53df89;box-shadow:0 0 12px #53df89}.hero{padding:64px 0 28px;display:grid;grid-template-columns:280px 1fr;gap:42px}.eyebrow,.section-kicker{font:10px DM Mono,monospace;color:#7dd3fc;letter-spacing:.14em}.hero h1{font-size:42px;line-height:1.08;letter-spacing:-.05em;margin:16px 0 20px}.hero h1 em{font-style:normal;color:var(--warm)}.hero p{font-size:14px;line-height:1.75;color:var(--muted);margin:0 0 28px}.hero-note{border-top:1px solid var(--line);padding-top:14px;display:flex;gap:14px;color:var(--muted);font-size:11px}.hero-note span:first-child{color:var(--accent);font-family:DM Mono}.body-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.body-panel{background:linear-gradient(155deg,#1a3a5780,#091627b8);border:1px solid var(--line);border-radius:18px;padding:18px;min-width:0}.body-panel h3{margin:7px 0 10px;font-size:16px;letter-spacing:-.02em}.body-panel h3 span,.selection-bar strong+span{color:var(--muted);font-weight:400}.anatomy-canvas{height:310px;position:relative;background:radial-gradient(circle at 50% 48%,rgba(58,117,158,.19),transparent 58%);border-radius:12px;overflow:hidden}.anatomy-canvas canvas{touch-action:none}.anatomy-watermark{position:absolute;left:13px;bottom:10px;color:#c4e0f373;font:9px DM Mono,monospace;pointer-events:none}.tooltip{background:#081522;border:1px solid rgba(126,231,255,.5);border-radius:6px;padding:8px 10px;color:#e5f7ff;font:10px DM Mono,monospace;white-space:nowrap;box-shadow:0 8px 24px #0006}.organ-picker{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.organ-chip{background:transparent;border:1px solid var(--line);border-radius:20px;color:var(--muted);padding:6px 9px;font-size:10px}.organ-chip:hover,.organ-chip.active{color:var(--ink);border-color:var(--accent);background:#67e8f914}.selection-bar{display:flex;align-items:end;justify-content:space-between;padding:25px 2px 19px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:24px}.selection-bar strong{display:block;margin-top:7px;font-size:19px;letter-spacing:-.03em}.selection-hint{color:var(--muted);font-size:11px}.ftu-section,.expression-section{padding:26px 0}.ftu-shell{display:grid;grid-template-columns:285px 1fr;min-height:390px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#0b1929}.ftu-nav{background:#0e2135;border-right:1px solid var(--line);padding:21px 15px}.ftu-nav h3{font-size:15px;margin:8px 0 16px}.ftu-nav h3 span{font:10px DM Mono;color:var(--muted);margin-left:5px}.ftu-item{display:flex;width:100%;justify-content:space-between;gap:10px;text-align:left;border:0;border-left:2px solid transparent;background:transparent;color:var(--muted);padding:10px 8px;font-size:11px;line-height:1.3}.ftu-item span{color:#5e7894}.ftu-item:hover,.ftu-item.active{color:var(--ink);background:#67e8f914;border-left-color:var(--accent)}.ftu-detail{padding:25px 28px}.detail-head{display:flex;justify-content:space-between;gap:20px;align-items:start}.detail-head h3{font-size:24px;letter-spacing:-.04em;margin:8px 0 3px}.muted{color:var(--muted);font-size:11px;line-height:1.7}.source-pill{border:1px solid var(--line);border-radius:20px;color:var(--accent);font:10px DM Mono;padding:8px 11px;text-decoration:none;white-space:nowrap}.illustration-preview{display:flex;align-items:center;gap:28px;min-height:160px;margin-top:24px;border:1px solid var(--line);border-radius:12px;padding:20px;background:radial-gradient(circle at 25% 40%,rgba(38,130,142,.23),transparent 35%),#0b1929}.illustration-grid{height:115px;width:170px;position:relative;border:1px solid rgba(126,231,255,.22);border-radius:50%;background:radial-gradient(circle,#123d52,transparent 64%)}.dot{position:absolute;width:16px;height:16px;background:#a7f3d0;border-radius:50%;box-shadow:0 0 18px #34d399}.dot.one{left:42px;top:24px}.dot.two{right:32px;top:42px;background:#f1c98e}.dot.three{left:70px;bottom:20px;background:#a78bfa}.tube{position:absolute;width:110px;height:20px;border:2px solid #67e8f9;border-radius:50%;left:27px;top:51px;transform:rotate(-24deg);opacity:.75}.tube.small{width:70px;left:48px;top:68px;transform:rotate(22deg);border-color:#f1c98e}.illustration-preview strong{font-size:15px}.illustration-preview p{color:var(--muted);font-size:11px;margin:8px 0}.illustration-preview a{color:var(--accent);font-size:10px;text-decoration:none}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:20px}.detail-grid>div{border-top:1px solid var(--line);padding-top:13px}.detail-grid h4,.expression-info h4{font-size:12px;margin:0 0 7px}.empty-panel,.empty-expression{display:grid;place-items:center;text-align:center;border:1px dashed var(--line);border-radius:16px;min-height:230px;padding:30px}.empty-icon{font-size:26px;color:#69d4e7;margin-bottom:5px}.empty-panel h3,.empty-expression h4{font-size:15px;margin:5px 0}.empty-panel p,.empty-expression p{max-width:500px;color:var(--muted);font-size:11px;line-height:1.7}.expression-shell{border:1px solid var(--line);border-radius:16px;padding:24px;background:linear-gradient(130deg,#0b1a2b,#0b1524)}.expression-head{display:flex;justify-content:space-between;gap:20px;align-items:end}.expression-head h3{font-size:21px;margin:8px 0 3px}.expression-head h3 span{font-size:12px;color:var(--muted);font-weight:400}.gene-picker{display:flex;align-items:end;gap:7px}.gene-picker label{display:block;font:10px DM Mono;color:var(--muted);margin-right:3px}.gene-picker input{width:110px;background:#07111f;border:1px solid var(--line);border-radius:6px;color:var(--ink);padding:8px 9px;font-size:11px;text-transform:uppercase}.gene-picker button{border:1px solid var(--accent);background:#67e8f91a;color:var(--accent);border-radius:6px;padding:8px 11px;font-size:11px}.expression-grid{display:grid;grid-template-columns:1fr 250px;gap:15px;margin-top:25px}.model-card{min-height:300px;border:1px solid var(--line);border-radius:12px;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 50%,rgba(50,116,128,.18),transparent 60%)}.expression-canvas{height:270px!important}.legend{position:absolute;bottom:13px;left:18px;right:18px}.legend>span{display:inline-block;height:8px;width:25%;margin-right:0}.legend>div{display:flex;justify-content:space-between;color:var(--muted);font:9px DM Mono;margin-top:4px}.expression-info{border-left:1px solid var(--line);padding:10px 6px 10px 22px}.metric{border-top:1px solid var(--line);padding:14px 0}.metric strong{display:block;font-size:24px;color:var(--accent)}.metric span{font-size:10px;color:var(--muted)}.provenance{font:9px DM Mono;color:var(--muted);line-height:1.5}.loading-state,.error-state{margin-top:24px;border-radius:10px;padding:20px;font-size:12px}.loading-state{background:#67e8f912;color:var(--accent)}.error-state{background:#fb718514;border:1px solid rgba(251,113,133,.3);color:#fecdd3}.error-state span{display:block;color:var(--muted);margin-top:5px;font-size:11px}.ftu-nav .empty-copy{color:var(--muted);font-size:11px;line-height:1.6}footer{border-top:1px solid var(--line);padding:25px 0 45px;display:flex;justify-content:space-between;gap:24px;color:var(--muted);font-size:10px}footer strong{color:var(--ink);font-size:11px}footer p{margin:6px 0 0}.footer-links{display:flex;gap:15px;align-items:start;flex-wrap:wrap;justify-content:end}.footer-links span{font:9px DM Mono;color:#70859c}@media(max-width:1000px){.hero{grid-template-columns:1fr;gap:22px}.hero-copy{max-width:600px}.body-grid{max-width:760px}.app-shell{padding:0 18px}}@media(max-width:680px){.topbar{height:auto;padding:17px 0;flex-wrap:wrap}.topbar nav{order:3;width:100%;justify-content:space-between}.status-dot{margin-left:auto}.hero{padding-top:35px}.hero h1{font-size:34px}.body-grid,.ftu-shell,.expression-grid,.detail-grid{grid-template-columns:1fr}.ftu-nav{border-right:0;border-bottom:1px solid var(--line)}.ftu-detail{padding:20px}.expression-head{align-items:start;flex-direction:column}.gene-picker{width:100%}.gene-picker input{flex:1}.illustration-preview{align-items:start;flex-direction:column}.selection-bar{align-items:start;flex-direction:column;gap:8px}footer{flex-direction:column}.footer-links{justify-content:start}}.official-ftu-host{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff;min-height:620px;color:#1f2937}.official-ftu-host hra-ftu-ui{display:block;min-height:620px;width:100%}.official-ftu-badge{background:#0e2135;color:#9fe8f5;padding:10px 16px;font:10px DM Mono,monospace;letter-spacing:.04em}.ftu-runtime-note{margin:8px 0;color:#f7caca;font-size:10px}.official-ftu-frame{display:block;width:100%;height:900px;border:0;background:#fff}.body-panel{position:relative;padding:18px}.body-label{position:absolute;z-index:2;top:30px;left:31px;margin:0;color:var(--ink);font-size:14px;letter-spacing:-.02em;text-shadow:0 2px 10px #07111fcc;pointer-events:none}.anatomy-canvas{height:560px}.reference-organ-picker{margin:0;border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:#0b1929c7;align-self:stretch}.reference-organ-picker .section-kicker{margin-bottom:8px;display:block}.shared-organ-picker{margin-top:0;display:flex;flex-direction:column;align-items:stretch;gap:6px}.shared-organ-picker .organ-chip{padding:8px 12px;text-align:left;width:100%}.hero{padding-top:32px}.body-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 220px;align-items:start;gap:16px}@media(max-width:1000px){.body-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.reference-organ-picker{grid-column:1 / -1}}@media(max-width:680px){.anatomy-canvas{height:480px}.body-label{top:28px;left:28px}.body-grid{grid-template-columns:1fr}}.expression-panels{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-top:24px}.expression-panel{min-width:0;border:1px solid var(--line);border-radius:14px;padding:16px;background:linear-gradient(145deg,#0d2033,#0a1624)}.panel-heading{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:10px}.panel-heading h4{margin:0;font-size:13px}.panel-heading span{font:9px DM Mono,monospace;color:var(--muted)}.anatomy-model-wrap{height:330px;position:relative;border-radius:10px;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(77,127,151,.18),transparent 65%)}.anatomy-model-wrap canvas{height:100%!important;touch-action:none}.model-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:var(--muted);font:10px DM Mono,monospace;pointer-events:none}.model-error{height:100%;min-height:240px;display:flex;flex-direction:column;justify-content:center;gap:8px;color:#fecdd3;font-size:11px}.model-error span,.model-error code{color:var(--muted);font-size:10px;overflow-wrap:anywhere}.viewer-actions{position:absolute;right:10px;top:10px;display:flex;gap:5px}.viewer-actions button{border:1px solid var(--line);border-radius:5px;background:#07111fcc;color:var(--muted);padding:5px 8px;font:9px DM Mono,monospace}.viewer-actions button:hover{color:var(--ink);border-color:var(--accent)}.model-tooltip{position:absolute;left:10px;bottom:10px;display:flex;flex-direction:column;gap:3px;border:1px solid var(--line);border-radius:6px;background:#07111fe8;padding:7px 9px;color:var(--ink);font:9px DM Mono,monospace;pointer-events:none}.model-tooltip span{color:var(--muted)}.expression-panel .legend{position:static;margin:12px 2px 0}.viridis-strip{height:8px;border-radius:4px;background:linear-gradient(90deg,#440154,#482878,#3e4989,#31688e,#26828e,#1f9e89,#35b779,#6ece58,#b5de2b,#fde725)}.panel-metrics{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px;color:var(--muted);font:9px DM Mono,monospace}.panel-metrics strong{color:var(--ink);font-weight:500;margin-left:4px}.panel-note{border-top:1px solid var(--line);margin-top:12px;padding-top:10px;color:var(--muted);font-size:10px;line-height:1.5}.panel-note strong{display:block;color:var(--ink);margin-bottom:4px}.hpo-pending{border-top:1px solid var(--line);margin-top:12px;padding-top:10px;display:flex;flex-direction:column;gap:5px}.hpo-pending strong{font-size:11px;color:var(--ink)}.hpo-pending span{color:var(--muted);font-size:10px;line-height:1.5}.expression-panel .provenance{margin-top:12px}@media(max-width:800px){.expression-panels{grid-template-columns:1fr}.anatomy-model-wrap{height:300px}}.ftu-section{margin:0 -28px;padding:58px 28px 66px;background:linear-gradient(180deg,#07111f,#b8d8e9 20%,#b8d8e9 80%,#07111f)}@media(max-width:680px){.ftu-section{margin:0 -18px;padding:46px 18px 54px}}.selection-bar{background:linear-gradient(180deg,transparent 0%,transparent 78%,#b8d8e9 100%)}.transition-band{margin:0 -28px;background:linear-gradient(180deg,#b8d8e9,#b8d8e9 42%,#07111f,#07111f)}.transition-band .ftu-section,.transition-band .expression-section{margin:0;padding-left:28px;padding-right:28px;background:transparent}@media(max-width:680px){.transition-band{margin:0 -18px}.transition-band .ftu-section,.transition-band .expression-section{padding-left:18px;padding-right:18px}}.hero{margin:0 -28px;padding-left:28px;padding-right:28px;background:linear-gradient(180deg,transparent 0%,transparent 80%,#b8d8e9 100%)}@media(max-width:680px){.hero{margin:0 -18px;padding-left:18px;padding-right:18px}}.hero,.transition-band{border:0;outline:0}.hero{margin:0;padding-left:0;padding-right:0;background:transparent}.selection-bar{background:transparent}.transition-band{margin:0;background:transparent}.transition-band .ftu-section,.transition-band .expression-section{margin:0;padding:26px 0;background:transparent}.hpo-strip{height:8px;border-radius:4px;background:linear-gradient(90deg,#f973a8,#fb7185,#f59e0b,#fde047)}.hpo-strip{background:linear-gradient(90deg,#7f1d1d,#dc2626,#f97316,#facc15,#fde047)}.association-note{margin:12px 0 0;font-size:10px;line-height:1.45}.expression-panels{grid-template-columns:minmax(0,2fr) minmax(260px,.78fr);align-items:stretch}.visualization-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;min-width:0}.expression-panel{min-width:0}.association-details{min-width:0;min-height:0;border:1px solid var(--line);border-radius:14px;padding:16px;background:linear-gradient(145deg,#0d2033,#0a1624);height:100%;box-sizing:border-box;overflow:hidden}.association-details .panel-heading{margin-bottom:14px}.association-details h5{margin:0 0 8px;font-size:11px;color:var(--ink)}.hpo-term-list{list-style:none;margin:0;padding:0;height:calc(100% - 34px);min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:7px}.hpo-term-list li{font-size:10px;line-height:1.35;padding-left:10px;position:relative}.hpo-term-list li:before{content:"•";position:absolute;left:0;color:#f97316}.hpo-term-list a{color:var(--muted);text-decoration:none}.hpo-term-list a:hover{color:var(--accent);text-decoration:underline}@media(max-width:1100px){.expression-panels{grid-template-columns:1fr}.association-details{height:420px}.visualization-pair{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:800px){.visualization-pair{grid-template-columns:1fr}.association-details{height:400px}.hpo-term-list{height:calc(100% - 34px)}}.expression-head{align-items:center}.expression-title{flex:1;text-align:center}.expression-title h3{margin:0;font-size:21px;font-weight:800;letter-spacing:-.04em}.expression-level{margin-top:3px;font-size:16px;color:var(--ink)}.expression-organ{margin-top:4px;font-size:21px;font-weight:600;letter-spacing:-.03em}.expression-source-note{margin:10px 0 0;color:var(--muted);font-size:10px;line-height:1.5}.expression-source-note a{color:var(--accent);text-decoration:underline}.expression-panel:nth-child(2) .panel-heading{align-items:flex-start}.expression-panel:nth-child(2) .panel-heading span{max-width:58%;line-height:1.35;text-align:right}.official-ftu-heading{padding:18px 22px 15px;text-align:center;background:#fff;color:#1f2937}.official-ftu-heading h3{margin:0;font-size:21px;font-weight:800;letter-spacing:-.04em}.official-ftu-heading>div:not(.official-ftu-organ){font-size:16px;margin-top:3px}.official-ftu-organ{margin-top:4px;font-size:21px;font-weight:600;letter-spacing:-.03em}.official-ftu-heading p{margin:12px 0 0;text-align:left;color:#64748b;font-size:10px;line-height:1.5}.hero h1{margin-bottom:6px}.hero-level{font-size:18px;color:var(--ink);margin-bottom:18px}.hero-detail{margin-top:4px}.shared-organ-picker .organ-chip{font-size:14px;line-height:1.75}.hero-level,.expression-level,.official-ftu-heading>div:not(.official-ftu-organ){font-style:italic}.hero-level em,.expression-level em,.official-ftu-heading em{display:inline-block;font-style:italic;transform:skew(-9deg);transform-origin:left center}.hero-level em,.expression-level em,.official-ftu-heading em{font-family:Georgia,Times New Roman,serif!important;font-style:italic!important;font-weight:700;letter-spacing:-.01em;transform:skew(-10deg)!important}.panel-heading h4{font-size:12px;line-height:1.35}.panel-heading h4 a{color:var(--accent);text-decoration:underline}.visualization-pair .panel-heading h4,.association-details .panel-heading h4{font-size:16px;line-height:1.35;font-weight:700}.official-ftu-heading{background:#0b1a2b;color:var(--ink);border-bottom:1px solid var(--line)}.official-ftu-heading>div:not(.official-ftu-organ){color:var(--ink)}.official-ftu-organ{color:var(--ink)}.official-ftu-heading p{margin:12px 0 0;text-align:left;color:#96a8bd;font-size:14px;line-height:1.75;font-family:Manrope,system-ui,sans-serif;font-weight:400}.hpo-term-list li{font-size:14px;line-height:1.75;padding-left:14px}.expression-panels{align-items:stretch;grid-template-rows:460px;grid-auto-rows:460px}.visualization-pair{height:460px;align-self:stretch}.expression-panel{height:460px;display:flex;flex-direction:column}.expression-panel .anatomy-model-wrap{flex:0 0 300px}.expression-panel .legend{flex:0 0 auto}.association-details{height:460px;min-height:0;display:flex;flex-direction:column;overflow:hidden}.association-details .hpo-term-list{flex:1 1 auto;min-height:0;overflow-y:auto}@media(max-width:1100px){.expression-panels{grid-template-rows:auto;grid-auto-rows:auto}.visualization-pair,.expression-panel,.association-details{height:auto}.association-details{height:420px}}@media(max-width:800px){.visualization-pair,.expression-panel{height:auto}.association-details{height:400px}}.visualization-pair .panel-heading{height:76px;min-height:76px;align-items:flex-start;overflow:visible}.visualization-pair .panel-heading h4{overflow-wrap:anywhere}.visualization-pair .expression-source-note{font-size:8px;font-weight:400;line-height:1.5}.visualization-pair .expression-panel{display:grid;grid-template-rows:auto minmax(0,1fr) auto}.visualization-pair .panel-heading{height:auto;min-height:76px;flex-direction:column;align-items:flex-start;justify-content:flex-start}.visualization-pair .expression-source-note{margin:4px 0 0;font-size:12px;line-height:1.35;min-height:0}.visualization-pair .expression-source-slot{display:none}.anatomy-canvas.is-loading canvas{opacity:0}.reference-model-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--muted);font:11px DM Mono,monospace;background:#07111f47;z-index:4}.loading-spinner{width:28px;height:28px;border:3px solid rgba(125,211,252,.25);border-top-color:var(--accent);border-radius:50%;animation:reference-spin .85s linear infinite}@keyframes reference-spin{to{transform:rotate(360deg)}}.as-hover-panel{position:absolute;left:12px;bottom:12px;z-index:5;max-width:min(320px,calc(100% - 24px));padding:9px 11px;background:#081522e6;border:1px solid rgba(126,231,255,.35);border-radius:8px;color:#e5f7ff;font-size:11px;line-height:1.4;pointer-events:none;overflow-wrap:anywhere;box-shadow:0 8px 24px #0006}.as-hover-panel strong{display:block;font-size:13px;margin:2px 0 3px}.as-hover-eyebrow{color:#7dd3fc;font:9px DM Mono,monospace;letter-spacing:.12em}
