:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#07090f;--bg-2:#0c1019;--panel:#0e121cdb;--panel-solid:#0e121c;--line:#a0b4dc1f;--line-strong:#a0b4dc38;--text:#e8ecf4;--text-2:#aab3c5;--muted:#768099;--accent:#f5a524;--accent-soft:#f5a52424;--blue:#7aa7ff;--meta:#7aa7ff;--submeta:#b58cff;--acro:#4fd1a5;--telo:#8a93a8;--radius:12px;--font:"Inter Tight", system-ui, -apple-system, sans-serif;--serif:"Instrument Serif", Georgia, serif;--mono:"JetBrains Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:14px/1.5 var(--font);-webkit-font-smoothing:antialiased;overflow:hidden}button{font:inherit;color:inherit}.muted{color:var(--muted)}.small{font-size:12px}.app{grid-template:"top top top""left stage right"minmax(0,1fr)/300px minmax(0,1fr) 380px;height:100dvh;display:grid}.topbar{border-bottom:1px solid var(--line);background:var(--bg-2);grid-area:top;justify-content:space-between;align-items:center;gap:16px;padding:12px 20px;display:flex}.panel{background:var(--panel-solid);scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;padding:20px;overflow-y:auto}.panel.left{border-right:1px solid var(--line);grid-area:left}.panel.right{border-left:1px solid var(--line);grid-area:right}.stage{background:radial-gradient(70% 60% at 50% 45%,#3a549647,#0000 70%),radial-gradient(50% 40% at 80% 90%,#f5a5240f,#0000 70%),linear-gradient(#0a0e18,#05070c);grid-area:stage;min-height:0;position:relative;overflow:hidden}.stage canvas{display:block}.label-layer{pointer-events:none;position:absolute;inset:0}.brand{align-items:center;gap:12px;display:flex}.brand-mark{background:radial-gradient(circle at 50% 40%, #d9534f 0 3px, transparent 3.5px), linear-gradient(90deg, var(--accent) 0 44%, transparent 44% 56%, var(--accent) 56%);opacity:.95;border-radius:8px;width:22px;height:30px;position:relative;-webkit-mask:linear-gradient(#000 0 34%,#0000 34% 46%,#000 46%);mask:linear-gradient(#000 0 34%,#0000 34% 46%,#000 46%)}.brand-title{font-family:var(--serif);letter-spacing:.01em;font-size:24px;line-height:1}.brand-title em{color:var(--accent)}.brand-sub{color:var(--muted);margin-top:3px;font-size:12px}.toolbar{align-items:center;gap:8px;display:flex}.segmented{border:1px solid var(--line);background:#ffffff0a;border-radius:10px;padding:3px;display:inline-flex}.segmented button{cursor:pointer;color:var(--text-2);background:0 0;border:0;border-radius:7px;padding:6px 14px;font-size:13px;font-weight:500}.segmented button[aria-selected=true]{background:var(--accent);color:#1a1206}.icon-btn{cursor:pointer;border:1px solid var(--line);color:var(--text-2);background:#ffffff08;border-radius:10px;align-items:center;gap:6px;padding:7px 12px;font-size:13px;display:inline-flex}.icon-btn:hover{border-color:var(--line-strong);color:var(--text)}.icon-btn[aria-pressed=true]{color:var(--accent);border-color:#f5a52466}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.stage-nav{z-index:2;border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0a0d16b3;border-radius:14px;align-items:center;gap:10px;padding:6px;display:flex;position:absolute;top:16px;left:50%;transform:translate(-50%)}.stage-title{flex-direction:column;align-items:center;min-width:200px;padding:0 6px;display:flex}.stage-title strong{font-family:var(--serif);font-size:20px;font-weight:400;line-height:1.1}.stage-title span{color:var(--muted);font-size:11.5px}.nav-btn{border:1px solid var(--line);cursor:pointer;width:34px;height:34px;color:var(--text-2);background:#ffffff0a;border-radius:10px;font-size:20px;line-height:1}.nav-btn:hover{color:var(--accent);border-color:#f5a52466}body[data-mode=karyotype] .nav-btn,body[data-mode=karyotype] .stage-hint{visibility:hidden}.stage-hint{color:var(--muted);white-space:nowrap;pointer-events:none;font-size:12px;position:absolute;bottom:14px;left:50%;transform:translate(-50%)}.tooltip{z-index:3;pointer-events:none;border:1px solid var(--line-strong);background:#080a10eb;border-radius:10px;flex-direction:column;gap:2px;min-width:150px;padding:8px 10px;font-size:12px;display:flex;position:absolute;top:0;left:0;box-shadow:0 10px 30px #00000073}.tooltip[hidden]{display:none}.k-label{font:500 12px var(--mono);color:var(--text-2);background:#080a108c;border-radius:6px;padding:1px 6px}.anat-label{font:11.5px var(--font);color:var(--text-2);white-space:nowrap;padding-left:14px;position:relative}.anat-label:before{content:"";background:var(--muted);width:10px;height:1px;position:absolute;top:50%;left:0}.anat-label.strong{font-family:var(--serif);color:var(--text);font-size:17px}.anat-label.accent{color:#ff8f8a}.anat-label.accent:before{background:#ff8f8a}.ruler-label{font:10.5px var(--mono);color:var(--muted)}.section-title{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);justify-content:space-between;align-items:baseline;gap:8px;margin:26px 0 10px;font-size:11px;font-weight:600;display:flex}.section-title .small{text-transform:none;letter-spacing:0;font-weight:400}section:first-child>.section-title{margin-top:0}.section-lede{color:var(--text-2);margin:-2px 0 12px;font-size:12.5px}.picker{flex-direction:column;gap:10px;display:flex}.picker-row{align-items:flex-end;gap:4px;display:flex}.chip{cursor:pointer;background:0 0;border:1px solid #0000;border-radius:8px;flex-direction:column;flex:1 1 0;align-items:center;gap:4px;min-width:0;padding:6px 2px 4px;display:flex}.chip:hover{background:#ffffff0a}.chip[aria-current=true]{background:var(--accent-soft);border-color:#f5a52473}.chip-fig{align-items:flex-end;display:flex}.chip-label{font:500 11px var(--mono);color:var(--text-2)}.chip[aria-current=true] .chip-label{color:var(--accent)}.ideogram .arm-outline{fill:none;stroke:#ffffff47;stroke-width:.75px}.morph-list{flex-direction:column;gap:8px;display:flex}.morph{border-radius:var(--radius);border:1px solid var(--line);--m:var(--telo);grid-template-columns:24px 1fr;align-items:start;gap:12px;padding:10px 12px;transition:border-color .2s,background .2s;display:grid}.morph[data-morph=metacentric]{--m:var(--meta)}.morph[data-morph=submetacentric]{--m:var(--submeta)}.morph[data-morph=acrocentric]{--m:var(--acro)}.morph.active{border-color:color-mix(in srgb, var(--m) 60%, transparent);background:color-mix(in srgb, var(--m) 9%, transparent)}.morph p{color:var(--text-2);margin:2px 0 4px;font-size:12px;line-height:1.45}.morph-head{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.morph-name{color:var(--m);font-weight:600}.morph-ci{font:11px var(--mono);color:var(--muted);white-space:nowrap}.morph-members{font:11px var(--mono);color:var(--muted)}.morph-icon .chromatids{fill:color-mix(in srgb, var(--m) 70%, #fff 10%)}.morph-icon .stalk{stroke:var(--m);stroke-width:1.2px}.morph-icon .cen{fill:#d9534f;stroke:var(--panel-solid);stroke-width:1.2px}.anatomy{gap:8px;margin:0;display:grid}.anatomy dt{font-size:12.5px;font-weight:600}.anatomy dd{color:var(--text-2);margin:0 0 2px;font-size:12px}.stains{gap:7px;margin:0;padding:0;font-size:12px;list-style:none;display:grid}.stains li{grid-template-columns:18px 1fr;align-items:start;gap:10px;display:grid}.swatch{background:var(--c);border-radius:3px;width:18px;height:12px;margin-top:3px;display:inline-block;box-shadow:inset 0 0 0 1px #ffffff2e}.eyebrow{color:var(--muted);font-size:11.5px}.info-title{font-family:var(--serif);margin:4px 0 10px;font-size:40px;font-weight:400;line-height:1.05}.info-title span{color:var(--accent)}.tags{flex-wrap:wrap;gap:6px;display:flex}.tag{border:1px solid var(--line-strong);color:var(--text-2);border-radius:999px;padding:3px 9px;font-size:11.5px}.morph-tag{--m:var(--telo);color:var(--m);border-color:color-mix(in srgb, var(--m) 50%, transparent);background:color-mix(in srgb, var(--m) 10%, transparent)}.morph-tag[data-morph=metacentric]{--m:var(--meta)}.morph-tag[data-morph=submetacentric]{--m:var(--submeta)}.morph-tag[data-morph=acrocentric]{--m:var(--acro)}.ideo-wrap{border-radius:var(--radius);border:1px solid var(--line);background:#ffffff05;margin:18px 0 14px;padding:14px}.ideo-main{width:100%;height:auto;display:block;overflow:visible}.ideo-main .band{cursor:crosshair;transition:filter .12s}.ideo-main .band.hl{filter:drop-shadow(0 0 3px var(--accent)) brightness(1.25);stroke:var(--accent);stroke-width:1px}.arm-scale{font:10.5px var(--mono);color:var(--muted);gap:2px;margin-bottom:6px;display:flex}.arm-scale span{border-top:1px solid var(--line-strong);white-space:nowrap;min-width:0;padding-top:3px;overflow:hidden}.band-readout,.tooltip{font-variant-numeric:tabular-nums}.band-readout{flex-wrap:wrap;align-items:center;gap:4px 12px;min-height:22px;margin-top:10px;font-size:12px;display:flex}.readout-band{font:500 13px var(--mono);color:var(--accent)}.readout-stain{color:var(--text-2);align-items:center;gap:6px;display:inline-flex}.readout-stain .swatch{width:12px;height:10px;margin-top:0}.readout-range{font-family:var(--mono);color:var(--muted);font-size:11.5px}.stats{border-radius:var(--radius);background:var(--line);border:1px solid var(--line);grid-template-columns:repeat(3,1fr);gap:1px;display:grid;overflow:hidden}.stat{background:var(--panel-solid);padding:10px 10px 9px}.stat-value{font:500 15px var(--mono);font-variant-numeric:tabular-nums}.stat-label{color:var(--muted);margin-top:1px;font-size:11px}.size-compare{margin-top:12px}.size-bar{background:#ffffff0f;border-radius:99px;height:6px;margin-bottom:6px;overflow:hidden}.size-bar span{border-radius:inherit;background:linear-gradient(90deg, var(--blue), var(--accent));height:100%;transition:width .5s;display:block}.summary{color:var(--text);margin:0 0 10px;font-size:14px}.morph-note{color:var(--text-2);border-left:2px solid var(--line-strong);margin:0;padding-left:10px;font-size:12.5px}.loci{gap:6px;margin:0;padding:0;list-style:none;display:grid}.locus{text-align:left;cursor:default;border:1px solid var(--line);background:0 0;border-radius:10px;grid-template-columns:auto 1fr;gap:1px 10px;width:100%;padding:9px 11px;transition:border-color .15s,background .15s;display:grid}.locus:hover,.locus:focus-visible{background:var(--accent-soft);border-color:#f5a52480}.locus-band{font:500 11.5px var(--mono);color:var(--accent);grid-row:span 2;min-width:64px;padding-top:2px}.locus-name{font-size:13px;font-weight:600}.locus-note{color:var(--text-2);font-size:12px;line-height:1.45}.conditions{flex-wrap:wrap;gap:6px;display:flex}.condition{color:var(--text-2);background:#ffffff0d;border-radius:8px;padding:4px 10px;font-size:12px}.source{margin-top:24px;line-height:1.5}@media (width<=1180px){.app{grid-template:"top top""left stage"minmax(0,1.4fr)"left right"minmax(0,1fr)/270px minmax(0,1fr)}.panel.right{border-left:0;border-top:1px solid var(--line)}}@media (width<=760px){body{overflow:auto}.app{flex-direction:column;height:auto;display:flex}.topbar{flex-wrap:wrap;padding:12px 16px}.toolbar{width:100%}.icon-btn span{display:none}.stage{order:1;height:62vh;min-height:380px}.panel.right{border:0;border-top:1px solid var(--line);order:2;padding:16px}.panel.left{border:0;border-top:1px solid var(--line);order:3;padding:16px}.stage-title{min-width:150px}.stage-hint{display:none}.stats{grid-template-columns:repeat(2,1fr)}}