npm - gramene-search - Versions diffs - 2.23.1 → 2.24.0 - Mend

gramene-search 2.23.1 → 2.24.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/README.md CHANGED Viewed

@@ -13,4 +13,37 @@ to <code>return true;</code>
 <code>npm run build</code>
 compiles js for use in the sorghum-webapp assuming you have cloned that in the same parent directory
-<code>npm run start-maize</code> launches the maize pangenome subsite
+<code>npm run start-maize</code> launches the maize pangenome subsite
+## Primers tab
+The Primers gene-detail tab embeds <code>PrimerDesigner</code> from
+<a href="https://github.com/warelab/gramene-primers">gramene-primers</a>: PCR/qPCR primer design,
+a genome specificity check and a pan-genome coverage check, served by the gramene-swagger
+<code>/primers</code> endpoints. It appears after Sequences only on sites that set
+<code>details.primers</code>:
+- <code>primers: true</code> uses the site's <code>grameneData</code> API.
+- <code>primers: {apiBase: 'https://data.sorghumbase.org/sorghum_v11', pangenome: false}</code>
+  points the tab at another swagger base URL (it must serve <code>/primers</code>);
+  <code>pangenome: false</code> hides the pan-genome check.
+Leave the key unset (or <code>false</code>) where the API has no <code>/primers</code> endpoints.
+The designer state is kept in <code>uiViewState.byGene[geneId].primers</code> and saved with
+shared views; a restored view re-runs the design, and an expired check job shows "Re-run check".
+A pasted sequence stays in that store, so it survives switching detail tabs, but it is left out
+of saved views; design responses and check results are not saved either.
+Gene links in check results open in a new tab, so the design and a running check stay put.
+Styles are injected at runtime, so no CSS import is needed.
+<code>gramene-primers</code> is a dependency (<code>^0.1.1</code>). To try unreleased gramene-primers changes,
+install a packed tarball over it (not <code>npm link</code> or <code>file:</code>, which load a second React);
+the next <code>npm install</code> puts the registry version back.
+```bash
+cd ../gramene-primers && npm run pack:local       # gramene-primers-0.1.1.tgz
+cd ../gramene-search && npm install --no-save ../gramene-primers/gramene-primers-0.1.1.tgz && rm -rf .parcel-cache
+```
+Run the sorghum demo against a swagger that serves <code>/primers</code>:
+```bash
+PRIMERS_API=https://data.sorghumbase.org/sorghum_v11a SUBSITE=sorghum npx parcel src/sorghum.html --port 1234
+```
+In the sorghum demo (<code>src/demo.js</code>) the tab is shown only when <code>PRIMERS_API</code> is set;
+it becomes <code>details.primers.apiBase</code>.

package/dist/index.css CHANGED Viewed

@@ -713,9 +713,18 @@ table.xrefs th:nth-child(3), table.xrefs td:nth-child(3) {
 @media (width >= 992px) {
   .gene-detail-tabs > div {
-    flex: 0 0 12.5%;
-    width: 12.5%;
-    max-width: 12.5%;
+    flex: 0 0 20%;
+    width: 20%;
+    max-width: 20%;
+  }
+}
+@media (width >= 1510px) {
+  .gene-detail-tabs > div {
+    flex: 1 1 0;
+    width: auto;
+    min-width: max-content;
+    max-width: none;
   }
 }
@@ -745,6 +754,22 @@ table.xrefs th:nth-child(3), table.xrefs td:nth-child(3) {
   background-color: #557b74;
 }
+.gene-detail-tab-fullscreen {
+  box-sizing: content-box;
+  cursor: pointer;
+  border-radius: 3px;
+  padding: 3px;
+  position: absolute;
+  top: 50%;
+  right: 5px;
+  transform: translateY(-50%);
+}
+.gene-detail-tab-fullscreen:hover {
+  color: #557b74;
+  background-color: #fff;
+}
 .result-gene-summary {
   flex-flow: row;
   justify-content: flex-start;

package/dist/index.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"mappings":"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","sources":["ff42af53a3828e08","src/components/styles.css","src/components/results/genes.css","msa.less","tree.less","src/components/results/details/tree-view.css","node_modules/react-simple-tree-menu/src/sass/main.scss","src/components/results/details/VEP.css","src/components/results/details/sequences.css","main.less","src/components/results/expression.css","src/components/results/geneList.css","src/components/exporter/styles.css","src/components/exprViz/styles.css","src/components/attrTable/styles.css","src/components/results/ontologyEnrichment.css","src/components/facets/styles.css"],"sourcesContent":["@import \"5abb1db407612521\";\n@import \"1caf78728b2f5137\";\n@import \"2166a150e9f31214\";\n@import \"938d6be3f57789df\";\n@import \"996096824b9f7d5a\";\n@import \"aa165d1be5d1c755\";\n@import \"41a1dcf3bc8b5377\";\n@import \"c52016833805a9f9\";\n@import \"6f643ac0480217ea\";\n@import \"c6576577b854e1eb\";\n@import \"2e4f466f4d9add63\";\n@import \"b02f188cedfc7aaa\";\n@import \"c165ffd6f0d0851d\";\n@import \"f46a3e1dc6586595\";\n@import \"0d0d5189ac663932\";\n@import \"11adedcd1a1dabc7\";\n","/* ── Main search layout: sidebar + content ──────────────────────────────── /\n.search-views-layout {\n display: flex;\n align-items: flex-start;\n}\n\n.search-views-content {\n flex: 1 1 0;\n min-width: 0; / prevent flex children from overflowing /\n}\n\n.gramene-sidebar,\n.sorghumbase-sidebar {\n flex: 0 0 250px;\n position: sticky;\n top: 0;\n align-self: flex-start;\n padding-left: 8px;\n padding-right: 8px;\n padding-bottom: 8px;\n}\n\n.gramene-sidebar {\n background-color: #557b74;\n}\n.sorghumbase-sidebar {\n background-color: #a03e34;\n}\n\n/ ── Mobile: stack sidebar above content ────────────────────────────────── /\n@media (max-width: 767px) {\n .search-views-layout {\n flex-direction: column;\n }\n .gramene-sidebar,\n .sorghumbase-sidebar {\n flex: 0 0 auto;\n position: static;\n width: 100%;\n }\n .search-views-content {\n width: 100%;\n }\n}\n.gramene-auth-container,\n.sorghumbase-auth-container,\n.gramene-filter-container,\n.sorghumbase-filter-container {\n}\n.gramene-filter {\n padding-left: 4px;\n padding-right: 4px;\n padding-bottom: 4px;\n background-color: white;\n font-size: 0.875rem; / ~14px — explicit instead of 'small' keyword /\n}\n.gramene-filter span:hover {\n font-weight:bolder;\n}\n.gramene-filter-AND {\n background-color: #ffcd82;\n}\n.gramene-filter-OR {\n background-color: #c5eeb9;\n}\n/ An expansion decorates a node rather than being one, so it tints whatever node\n carries it — leaf or group — the way .gramene-filter-NOT adds a border. /\n.gramene-filter-EXPAND {\n background-color: #c3dcf5;\n}\n.gramene-filter-expansion {\n display: block;\n text-align: center;\n font-style: italic;\n font-size: 0.8rem;\n color: #1c4f80;\n}\n.gramene-filter-NOT {\n border-left-color: #ff5354;\n border-left-style: inset;\n border-left-width: 4px;\n padding-left: 4px;\n}\n.gramene-filter-operation {\n text-align: center;\n font-style: italic;\n}\n.gramene-filter-marked {\n font-weight: bolder;\n /background-color: #feff96;/\n}\n.gramene-filter-menu ul {\n border-top-style: solid;\n border-top-width: 2px;\n padding-left: 0;\n}\n.gramene-filter-menu li {\n display: block;\n cursor: pointer;\n padding: 8px 8px 8px 15px; / vertical padding makes tap targets ~36px+ /\n}\n.gramene-filter-menu li:hover {\n background-color: #feff96;\n}\n/ Group heading for the expansion radios — a label, not a command. /\n.gramene-filter-menu li.gramene-filter-menu-label {\n cursor: default;\n font-weight: bold;\n padding-bottom: 2px;\n}\n.gramene-filter-menu li.gramene-filter-menu-label:hover {\n background-color: transparent;\n}\n.gramene-filter-menu li.gramene-filter-menu-radio {\n padding-top: 4px;\n padding-bottom: 4px;\n padding-left: 25px;\n}\n.gramene-filter-menu li.gramene-filter-menu-radio input {\n margin-right: 6px;\n vertical-align: middle;\n cursor: pointer;\n}\n\n.gramene-view-header {\n width: 100%;\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-evenly;\n font-size: larger;\n font-weight: bold;\n background-color: #fff3a96e;\n border-top: solid;\n border-top-color: #557b74;\n color: #a03e34;\n}\n\n.gramene-view-container {\n}\n.gramene-view {\n padding-left: 0px;\n padding-right: 10px;\n margin-bottom: 0;\n background-color: white;\n}\n.gramene-view-span-on {\n padding-left: 5px;\n cursor: pointer;\n vertical-align: text-bottom;\n color: #a03e34;\n}\n.gramene-view-span-off {\n padding-left: 5px;\n cursor: pointer;\n vertical-align: text-bottom;\n}\n.gramene-view li {\n display: block;\n cursor: pointer;\n padding-left: 5px;\n border-left-style: inset;\n border-left-width: 8px;\n margin-bottom: 2px;\n}\n\n.gramene-view-on {\n border-left-color: #40a0ff;\n font-weight: bold;\n}\n.gramene-view-off {\n border-left-color: #ff6d68;\n}\n.gramene-view-disabled {\n color: darkgray;\n border-left-color: #efefef;\n cursor: default!important;\n}\n#gramene-suggestion button {\n border-radius: .6rem;\n line-height: 1;\n}\n#gramene-suggestion button:focus {\n color: #fff;\n background-color: #6c757d;\n border-color: #6c757d;\n}\n\n/ ── Collapsible sidebar sections ─────────────────────────────────────── /\n.sidebar-section {\n margin-bottom: 4px;\n}\n\n.sidebar-section-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: pointer;\n padding: 2px 4px 2px 6px;\n color: cornsilk;\n user-select: none;\n border-top: 3px solid;\n}\n\n/ Dark background + matching top border per site /\n.gramene-sidebar .sidebar-section-header {\n background-color: #557b74;\n border-top-color: #3d5b55;\n}\n.sorghumbase-sidebar .sidebar-section-header {\n background-color: #a03e34;\n border-top-color: #7a2f27;\n}\n\n.sidebar-section-header:hover {\n background: rgba(255,255,255,0.1);\n}\n.gramene-sidebar .sidebar-section-header:hover {\n background-color: #4a6d66;\n}\n.sorghumbase-sidebar .sidebar-section-header:hover {\n background-color: #8c352d;\n}\n\n.sidebar-section-actions {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n color: cornsilk;\n}\n\n.sidebar-section-toggle {\n font-size: 0.85rem;\n font-weight: bold;\n}\n.sidebar-section-toggle svg {\n stroke: currentColor;\n stroke-width: 2;\n}\n\n.sidebar-section-body {\n background-color: #fff3a9;\n padding: 4px;\n}\n\n/ ── Mobile: compact sidebar when stacked at top ─────────────────────── /\n@media (max-width: 767px) {\n / Tighten sidebar padding /\n .gramene-sidebar,\n .sorghumbase-sidebar {\n padding: 4px 8px;\n }\n\n / Views: display as a compact inline flow /\n .gramene-view {\n display: flex;\n flex-wrap: wrap;\n gap: 2px 8px;\n padding: 2px 4px;\n }\n .gramene-view li {\n display: inline-flex;\n align-items: center;\n padding-left: 4px;\n margin-bottom: 0;\n font-size: 0.8rem;\n border-left-width: 4px;\n }\n\n / View header: smaller /\n .gramene-view-header {\n font-size: small;\n padding: 2px 0;\n }\n\n / Filters: compact /\n .gramene-filter {\n font-size: 0.8rem;\n padding: 2px 4px;\n }\n .gramene-filter-menu li {\n padding: 4px 4px 4px 10px;\n }\n\n / Suggestion buttons: reasonable tap area /\n #gramene-suggestion button {\n padding: 0.35rem 0.6rem;\n margin-bottom: 2px;\n font-size: 0.8rem;\n }\n\n / Prevent iOS zoom-on-focus (requires >= 16px) without forcing extra height /\n #search-input {\n font-size: 1rem;\n }\n}\n\n/ ── Taxonomy modal tree ─────────────────────────────────────────────────── /\n.tax-tree { margin-top: 8px; font-size: 14px; }\n.tax-node { border-radius: 2px; }\n.tax-row { display: flex; align-items: center; gap: 4px; padding: 2px 4px; }\n.tax-chevron { cursor: pointer; width: 14px; display: inline-flex; align-items: center; }\n.tax-chevron-spacer { display: inline-block; width: 14px; }\n.tax-label { }\n.tax-label-internal { font-weight: 600; }\n.tax-sep { color: #888; font-weight: normal; }\n.tax-count { color: #555; font-size: 12px; margin-left: 4px; }\n.tax-self-leaf { margin-left: 8px; font-size: 12px; color: #444; display: inline-flex; align-items: center; gap: 2px; }\n\n.tax-ellipsis { cursor: help; color: #666; }\n.tax-ellipsis-full { display: none; }\n.tax-ellipsis:hover .tax-ellipsis-short { display: none; }\n.tax-ellipsis:hover .tax-ellipsis-full { display: inline; color: #333; }\n\n.tax-search { position: relative; margin: 8px 0; }\n.tax-search-input { width: 100%; padding: 4px 8px; font-size: 14px;\n border: 1px solid #bbb; border-radius: 3px; }\n.tax-search-results { position: absolute; left: 0; right: 0; top: 100%;\n max-height: 280px; overflow-y: auto; z-index: 10;\n background: white; border: 1px solid #bbb;\n border-top: none; border-radius: 0 0 3px 3px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1); }\n.tax-search-hit { padding: 4px 8px; cursor: pointer; font-size: 13px; }\n.tax-search-hit:hover,\n.tax-search-hit-active { background: #e3ecff; }\n.tax-search-name { font-weight: 600; }\n.tax-search-syn { color: #777; font-style: italic; }\n.tax-search-rank { color: #0366d6; font-size: 11px; text-transform: uppercase;\n margin-left: 4px; }\n.tax-search-count { color: #555; font-size: 12px; }\n.tax-search-empty { padding: 6px 8px; color: #777; font-style: italic; font-size: 13px; }\n\n.tax-node-highlight { outline: 2px solid #ffc107;\n animation: taxFlash 1.6s ease-out; }\n@keyframes taxFlash {\n 0% { background-color: #fff3cd; }\n 100% { background-color: transparent; }\n}\n\n\n\n/ Genomic interval form, at the foot of the Filters section. Sits inside the\n sidebar, so it inherits the section body's background rather than setting one. /\n.gramene-interval {\n margin-top: 0.4rem;\n border-top: 1px solid rgba(0, 0, 0, 0.15);\n padding-top: 0.35rem;\n}\n\n.gramene-interval-toggle {\n cursor: pointer;\n font-size: 0.8rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.3rem;\n}\n\n.gramene-interval-form {\n margin-top: 0.4rem;\n}\n\n.gramene-interval-range {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n}\n\n/ Positions are numbers; tabular figures keep the two boxes visually aligned. /\n.gramene-interval-range input {\n font-variant-numeric: tabular-nums;\n}\n\n.gramene-interval-dash {\n opacity: 0.6;\n}\n\n.gramene-interval-error {\n font-size: 0.75rem;\n color: #a03e34;\n margin-top: 0.25rem;\n}\n\n\n/ Inline editor, rendered under the node it edits. Sits on the node's own\n background so it reads as part of that filter rather than a separate panel. /\n.gramene-filter-editor {\n padding: 4px 2px 2px;\n border-top: 1px dashed rgba(0, 0, 0, 0.2);\n margin-top: 2px;\n}\n\n.gramene-interval-actions {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.4rem;\n}\n\n/ The submit button spans the form when it stands alone (the add form), and\n shares the row with cancel when editing. /\n.gramene-interval-actions .gramene-interval-submit {\n flex: 1 1 auto;\n margin-top: 0;\n}\n\n.gramene-interval-cancel {\n flex: 0 0 auto;\n padding: 0 0.25rem;\n font-size: 0.75rem;\n}\n",".visible-detail {\n border: 1px solid #557B74;\n padding: 6px 12px;\n}\n.detail {\n margin-right: auto;\n margin-left: auto;\n padding-left: 15px;\n padding-right: 15px;\n}\n.table {\n width: 100%;\n max-width: 100%;\n}\n.xrefs {\n border-collapse: collapse;\n border-spacing: 0;\n border-color: grey;\n table-layout: auto;\n width: 100%;\n}\n/ Col 1 (PubMed link) and col 2 (Curation source): shrink to content /\ntable.xrefs th:nth-child(1),\ntable.xrefs td:nth-child(1),\ntable.xrefs th:nth-child(2),\ntable.xrefs td:nth-child(2) {\n width: 1%;\n white-space: nowrap;\n}\n/ Col 3 (Title/Description): fill remaining space /\ntable.xrefs th:nth-child(3),\ntable.xrefs td:nth-child(3) {\n width: 100%;\n}\n/ Legacy column-width classes — kept for other tables that use them /\n.xref-name-col { white-space: nowrap; }\n.xref-value-col { }\n.xref-80-col { }\n.xref-70-col { }\n.xref-10-col { white-space: nowrap; }\n.xref-id-list {\n padding-left: 0;\n list-style: none;\n}\n.result-gene {\n padding: 0.2em;\n border: 5px solid white;\n}\n.result-gene:hover {\n border-color: antiquewhite;\n}\n.gene-title {\n /padding-top:0.5em;/\n}\n.gene-id {\n /white-space: nowrap;/\n color: black;\n}\n.gene-name {\n color: #557B74;\n margin-bottom: 0;\n}\n.gene-description {\n margin-bottom: 0;\n}\n.gene-species {\n white-space: nowrap;\n font-style: italic;\n font-size:small;\n font-weight: bold;\n}\n.gene-synonyms {\n font-size: small;\n}\n.gene-alt-ids {\n font-size: small;\n color: #6c757d;\n}\n.gene-extras {\n border: dashed 1px blue;\n}\n.gene-panlink {\n float: right;\n margin-left: 0.5rem;\n margin-bottom: 0.25rem;\n}\n.gene-panlink img {\n height: 60px;\n width: auto;\n max-width: 100%;\n vertical-align: top;\n}\n.suggestion-panlink img {\n height: 60px;\n width: auto;\n max-width: 100%;\n}\n@media (max-width: 1200px) {\n .gene-panlink img,\n .suggestion-panlink img {\n height: 30px;\n }\n}\n@media (max-width: 767px) {\n / Allow the ortholog/TAIR box to stack below the gene title on mobile.\n It stays inside .result-gene-summary, so it still appears above .gene-detail-tabs. /\n .result-gene-summary {\n flex-wrap: wrap;\n }\n .result-gene-title-body {\n flex: 1 1 100%;\n }\n .model-ortholog,\n .closest-ortholog,\n .gene-summary-tair {\n flex: 1 1 100%;\n max-width: 100%;\n width: auto;\n margin-left: 0;\n margin-top: 8px;\n }\n / Stack ortholog box contents vertically on narrow screens /\n .model-ortholog,\n .closest-ortholog {\n grid-template-columns: 1fr;\n }\n .model-ortholog h3.gene-id,\n .closest-ortholog h3.gene-id {\n grid-column: 1;\n grid-row: 2;\n }\n .model-ortholog .gene-species,\n .closest-ortholog .gene-species {\n grid-column: 1;\n grid-row: 3;\n text-align: left;\n }\n .model-ortholog .rep-identity,\n .closest-ortholog .rep-identity {\n grid-column: 1;\n grid-row: 4;\n text-align: left;\n }\n .model-ortholog p,\n .closest-ortholog p {\n grid-row: 5;\n }\n / Show descriptions on mobile (no hover available) /\n .model-ortholog p,\n .closest-ortholog p {\n display: block;\n }\n / PanLink: stop floating, display inline next to gene title /\n .gene-panlink {\n float: none;\n display: inline;\n margin-left: 0.25rem;\n margin-bottom: 0;\n vertical-align: middle;\n }\n / Papers table only: hide \"Curation source\" column on small screens /\n table.xrefs-pubs th:nth-child(2),\n table.xrefs-pubs td:nth-child(2) {\n display: none;\n }\n}\n.gene-curation {\n flex-shrink: 0;\n margin-top: 20px;\n border: 1px solid grey;\n}\n.gene-curation span {\n width: 20px;\n display: inline-block;\n color: white;\n text-align: center;\n}\n.gene-curation .okay {\n background-color: #0c00f3;\n}\n.gene-curation .flagged {\n background-color: darkorange;\n}\n.gene-detail-tabs {\n display: flex;\n flex-wrap: wrap;\n width: 100%;\n}\n/ Tab items: 4-per-row by default, overrides Bootstrap col-md-1 (8.33%) /\n.gene-detail-tabs > div {\n flex: 0 0 25%;\n width: 25%;\n max-width: 25%;\n box-sizing: border-box;\n padding: 6px 4px;\n min-height: 36px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n/ At wide viewports, all 8 fit comfortably in one row /\n@media (min-width: 992px) {\n .gene-detail-tabs > div {\n flex: 0 0 12.5%;\n width: 12.5%;\n max-width: 12.5%;\n }\n}\n.gene-detail-tab-closed {\n color: darkgreen;\n cursor: pointer;\n /background-color: lightgray;/\n}\n.gene-detail-tab-disabled {\n /color: white;/\n /background-color: lightgray;/\n color: lightgray;\n cursor: not-allowed;\n}\n.gene-detail-tab-empty {\n color: darkgreen;\n cursor: pointer;\n font-style: oblique;\n /background-color: lightgray;/\n}\n.gene-detail-tab-empty::before {\n content: \"Add \";\n}\n.gene-detail-tab-expanded {\n color: white;\n background-color: #557B74;\n cursor: pointer;\n}\n.result-gene-summary {\n display: flex;\n flex-flow: row nowrap;\n justify-content: flex-start;\n align-items: flex-start;\n}\n.result-gene-summary .species-name {\n white-space: nowrap;\n font-style: italic;\n}\n.result-gene-title-body {\n flex: 1 1 auto;\n max-width: 1036px;\n width: 100%;\n}\n.model-ortholog, .closest-ortholog, .gene-summary-tair {\n cursor: pointer;\n flex: 0 0 auto;\n max-width: 380px;\n width: 380px;\n font-size: smaller;\n margin-top: 10px;\n padding: 0.25rem 0.5rem 0.5rem;\n margin-left: 1rem;\n border: 1px solid darkorange;\n}\n\n/ Ortholog boxes: grid — title row, then gene name left / species+identity right /\n.model-ortholog, .closest-ortholog {\n display: grid;\n grid-template-columns: 1fr auto;\n gap: 0 0.5rem;\n align-items: center;\n}\n\n/ Gene name: left column, smaller font to fit alongside species /\n.model-ortholog h3.gene-id,\n.closest-ortholog h3.gene-id {\n grid-column: 1;\n grid-row: 2;\n margin: 0;\n font-size: 1.5em;\n overflow-wrap: break-word;\n word-break: break-all;\n min-width: 0;\n}\n\n/ Species: right column, top of the pair /\n.model-ortholog .gene-species,\n.closest-ortholog .gene-species {\n grid-column: 2;\n grid-row: 2;\n text-align: right;\n align-self: end;\n}\n\n/ Identity: right column, below species (same row group as gene name) /\n.model-ortholog .rep-identity,\n.closest-ortholog .rep-identity {\n grid-column: 2;\n grid-row: 3;\n text-align: right;\n margin-left: 0;\n padding-right: 0;\n padding-top: 0;\n align-self: start;\n}\n\n/ Description: hidden by default; show on hover/focus /\n.model-ortholog p,\n.closest-ortholog p {\n grid-column: 1 / -1;\n grid-row: 4;\n display: none;\n margin: 0.25rem 0 0;\n}\n.model-ortholog:hover p,\n.model-ortholog:focus p,\n.closest-ortholog:hover p,\n.closest-ortholog:focus p {\n display: block;\n}\n\n.model-ortholog {\n border: 1px dotted darkorange;\n}\n.closest-ortholog {\n border: 1px dotted darkgreen;\n}\n\n.gene-summary-tair {\n border: 1px dotted darkblue;\n}\n.gene-summary-tair .rest {\n display: none;\n}\n\n.gene-summary-tair:hover .rest {\n display: inline;\n}\n.gene-summary-tair:focus .rest {\n display: inline;\n}\n.gene-summary-tair:hover .ellipsis {\n display: none;\n}\n.gene-summary-tair:focus .ellipsis {\n display: none;\n}\n\n/ this is the \"title\" of the closest ortholog box /\n.closest-ortholog::before,\n.model-ortholog::before,\n.gene-summary-tair::before {\n display: block;\n grid-column: 1 / -1;\n grid-row: 1;\n text-align: center;\n border: dotted 1px;\n padding: 0 0.5rem;\n margin: -0.25rem -0.5rem 0.25rem; / bleed to box edges /\n background: #fff;\n}\n\n.model-ortholog::before {\n content: \"Model Species Homolog\";\n color: orange;\n}\n.closest-ortholog::before {\n content: \"Closest Annotated Homolog\";\n color: darkgreen;\n}\n\n/ this is the \"title\" of the closest ortholog box /\n.gene-summary-tair::before {\n content: \"TAIR Curated Description\";\n color: darkblue;\n}\n\n.rep-identity {\n margin-left: auto;\n padding-right: 10px;\n padding-top: 5px;\n font-style: italic;\n}\n.rep-identity::after {\n content: \"% identity\";\n}\n.eFP::before {\n content: url(\"../../static/images/BAR-logo.png\");\n padding-right:5px;\n position: relative;\n top: 5px;\n}\n.eFP::after {\n content: 'New!';\n color: red;\n padding-left:2px;\n font-weight: bold;\n font-style: italic;\n font-size: x-small;\n line-height: normal;\n vertical-align: super;\n}\n.gxa::before {\n content: url(\"../../static/images/expression-atlas-logo.png\");\n padding-right:5px;\n position: relative;\n top: 5px;\n}\n.gene-search-pic-sugg {\n width: 100%;\n height: 200px;\n background: url(\"../../static/images/suggestions.png\");\n background-size: contain;\n background-repeat: no-repeat;\n}\n.gene-search-pic-results {\n width: 100%;\n height: 200px;\n background: url(\"../../static/images/results.png\");\n background-size: contain;\n background-repeat: no-repeat;\n}\n.gene-search-pic-genetree {\n width: 100%;\n height: 200px;\n background: url(\"../../static/images/genetree.png\");\n background-size: contain;\n background-repeat: no-repeat;\n}\n\n/ tbrowse portals its tooltips/popups to document.body; without an\n explicit z-index they render behind the bootstrap modal (z-index\n ~1050) when a detail panel is in fullscreen mode. /\n.tbrowse-root,\n.tbrowse-tooltip,\n.tbrowse-fieldpicker,\n.tbrowse-msa-mask-panel {\n z-index: 1100 !important;\n}\n",null,null,"/ ===== Pathways layout ===== /\n\n.pathways-layout {\n display: flex;\n align-items: stretch;\n}\n\n.pathways-tree-toggle {\n flex: 0 0 auto;\n width: 24px;\n border: 1px solid #ccc;\n border-right: none;\n background: #f5f5f5;\n cursor: pointer;\n font-size: 12px;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n color: #666;\n border-radius: 4px 0 0 4px;\n}\n.pathways-tree-toggle:hover {\n background: #e0e0e0;\n color: #333;\n}\n\n.pathways-tree-panel {\n flex: 0 0 250px;\n width: 250px;\n height: 100%;\n overflow-y: auto;\n overflow-x: hidden;\n border: 1px solid #ccc;\n border-right: none;\n}\n\n.pathways-diagram-panel {\n flex: 1 1 auto;\n min-width: 0;\n}\n\n.pathways-resize-handle,\n.details-resize-handle {\n height: 6px;\n background: #e0e0e0;\n border: 1px solid #ccc;\n border-top: none;\n cursor: ns-resize;\n transition: background 0.15s;\n}\n.pathways-resize-handle:hover,\n.details-resize-handle:hover {\n background: #179ed3;\n}\n\n/ ===== Compact tree items (react-simple-tree-menu overrides) ===== /\n\n.pathways-tree-panel .rstm-tree-item-group {\n border-top: none;\n}\n\n.pathways-tree-panel .rstm-tree-item {\n padding: 0.2rem 0.4rem;\n font-size: 0.8rem;\n line-height: 1.3;\n border-bottom: 1px solid #eee;\n}\n/ Override inline padding-left set by react-simple-tree-menu.\n The library uses: 0.75 + iconSize(hasNodes?0:1) + level1.75 rem\n We shrink the per-level indent from 1.75rem to 0.75rem /\n.pathways-tree-panel .rstm-tree-item-level0 { padding-left: 0.4rem !important; }\n.pathways-tree-panel .rstm-tree-item-level0 > .rstm-toggle-icon { margin-left: 0; }\n.pathways-tree-panel .rstm-tree-item-level1 { padding-left: 1.15rem !important; }\n.pathways-tree-panel .rstm-tree-item-level2 { padding-left: 1.9rem !important; }\n.pathways-tree-panel .rstm-tree-item-level3 { padding-left: 2.65rem !important; }\n.pathways-tree-panel .rstm-tree-item-level4 { padding-left: 3.4rem !important; }\n.pathways-tree-panel .rstm-tree-item-level5 { padding-left: 4.15rem !important; }\n.pathways-tree-panel .rstm-tree-item-level6 { padding-left: 4.9rem !important; }\n.pathways-tree-panel .rstm-tree-item-level7 { padding-left: 5.65rem !important; }\n\n.pathways-tree-panel .rstm-tree-item--active {\n color: white;\n background: #179ed3;\n border-bottom-color: #127aa8;\n}\n\n.pathways-tree-panel .rstm-toggle-icon-symbol {\n width: 1rem;\n height: 1rem;\n line-height: 1rem;\n font-size: 0.7rem;\n}\n\n/ ===== Legacy tree-view classes ===== /\n\n.tree-view-root {}\n\n.tree-view-node {\n margin-left: 8px;\n}\n\n.tree-view-node-collapse-toggle.collapse-spacer {\n width: 12px;\n display: inline-block;\n}\n\n.tree-view-node-collapse-toggle {\n margin-right: 2px;\n width: 12px;\n}\n\n.tree-view-node-label {\n font-size: smaller;\n margin-left: 2px;\n padding: 1px;\n border: 1px solid #fff;\n}\n\n.tree-view-node-label.selected {\n border: 1px solid #003f81;\n border-radius: 3px;\n background-color: #808080;\n}\n\n.tree-view-node-checkbox {}\n.tree-view-node-children {}\n\n\n.pathways-tree-empty {\n padding: 0.6rem;\n font-size: 0.8rem;\n line-height: 1.3;\n color: #666;\n}\n",null,".button-like-link {\n display: inline-block;\n padding: 0;\n background-color: #fff0;\n color: #007bff;\n text-decoration: underline;\n border: none;\n cursor: pointer;\n}\n","/ styles.css /\n.fasta-container {\n position: relative;\n padding: 2ch;\n background-color: #fcfffd;\n border-color: #557b74;\n border-style: dashed;\n line-height: 0.925em;\n /margin: auto; !* Center the container !/\n}\n.styled-span {\n display: flex;\n align-items: center;\n text-align: center;\n}\n.vertical-line {\n flex-grow: 1;\n height: 20px;\n background-color: black;\n}\n.horizontal-line {\n width: 60px;\n min-width: 15px;\n height: 3px;\n background-color: black;\n margin: 0;\n}\ncode.fasta {\n white-space: pre-wrap;\n color: #595959;\n}\n.header {\n color: black;\n}\n.upstream {\n color: #80a0a0;\n}\n.downstream {\n color: #80a0a0;\n}\n.intron {\n color: #aaaaaa;\n}\n.utr5 {\n background-color: #aaccaf;\n}\n.utr5-other {\n background-color: #cfe1d2;\n}\n.cds {\n background-color: #a7b4d3;\n}\n.cds-other {\n background-color: #d0d8e6;\n}\n.utr3 {\n background-color: #c5a3bf;\n}\n.utr3-other {\n background-color: #dcc9d9;\n}\n.square-utr5 {\n width: 20px;\n height: 20px;\n background: linear-gradient(to bottom right, #aaccaf 0%, #aaccaf 50%, #cfe1d2 50%, #cfe1d2 100%);\n}\n.square-cds {\n width: 20px;\n height: 20px;\n background: linear-gradient(to bottom right, #a7b4d3 0%, #a7b4d3 50%, #d0d8e6 50%, #d0d8e6 100%);\n}\n.square-utr3 {\n width: 20px;\n height: 20px;\n background: linear-gradient(to bottom right, #c5a3bf 0%, #c5a3bf 50%, #dcc9d9 50%, #dcc9d9 100%);\n}\n\n.flanking-guide {\n display: grid;\n grid-template-columns: auto 60px auto 60px auto;\n align-items: center;\n row-gap: 2px;\n column-gap: 0;\n width: fit-content;\n}\n/* Row 1 /\n.flanking-label-left {\n text-align: right;\n padding-right: 0.5rem;\n}\n.flanking-center-label {\n text-align: center;\n white-space: nowrap;\n padding: 0 0.25rem;\n}\n.flanking-guide > .horizontal-line {\n height: 3px;\n background-color: black;\n align-self: center;\n}\n.flanking-label-right {\n text-align: left;\n padding-left: 0.5rem;\n}\n/ Row 2 /\n.flanking-value-left {\n text-align: right;\n min-width: 5ch;\n padding-right: 0.5rem;\n}\n.flanking-value-right {\n text-align: left;\n min-width: 5ch;\n padding-left: 0.5rem;\n}\n\n.reverse-slide {\n direction: rtl;\n}\n.fasta-key {\n position: absolute;\n top: 9px;\n right: 40px;\n background: none;\n border: none;\n cursor: default;\n font-family: monospace;\n font-size: 11pt;\n color: #555;\n}\n.copy-button {\n position: absolute;\n top: 3px;\n right: -5px;\n background: none;\n border: none;\n cursor: pointer;\n font-size: 1.5rem;\n color: #555;\n}\n.notification {\n position: absolute;\n top: 0;\n right: 0;\n background-color: #050505;\n color: #fff;\n padding: 5px;\n z-index: 999;\n font-weight: bold;\n font-style: italic;\n font-size: smaller;\n}\n",null,".accordion-button {\n padding:0.4rem!important;\n}\n.accordion-button:hover {\n background-color: #dbe8f3;\n}","/ Gene-list identifier resolver. Bucket chrome follows facets/styles.css so the\n three buckets read the same way as the Refine sidebar's facet groups. /\n\n.glr {\n margin-top: 0.75rem;\n}\n\n.glr-bucket {\n border: 1px solid #dee2e6;\n border-radius: 4px;\n margin-bottom: 0.5rem;\n}\n\n.glr-bucket-header {\n display: flex;\n align-items: center;\n gap: 0.4rem;\n padding: 0.35rem 0.5rem;\n cursor: pointer;\n background: #f8f9fa;\n border-radius: 4px 4px 0 0;\n}\n\n.glr-bucket-title {\n font-weight: 600;\n font-size: 0.9rem;\n}\n\n.glr-bucket-count {\n font-size: 0.75rem;\n color: #666;\n background: #fff;\n padding: 0 0.4rem;\n border-radius: 10px;\n border: 1px solid #ddd;\n font-variant-numeric: tabular-nums;\n}\n\n/ Pushed right, and clicks inside must not toggle the bucket (see bulk()). /\n.glr-bucket-actions {\n margin-left: auto;\n}\n\n.glr-bucket-body {\n padding: 0.5rem;\n max-height: 420px;\n overflow-y: auto;\n}\n\n/ Tone is carried by the header edge only — enough to distinguish the three\n buckets at a glance without colouring the whole panel. /\n.glr-bucket-warn .glr-bucket-header { border-left: 4px solid #f0ad4e; }\n.glr-bucket-ok .glr-bucket-header { border-left: 4px solid #5cb85c; }\n.glr-bucket-bad .glr-bucket-header { border-left: 4px solid #d9534f; }\n\n.glr-hint {\n font-size: 0.8rem;\n color: #555;\n margin-bottom: 0.5rem;\n}\n\n.glr-search {\n margin-bottom: 0.5rem;\n}\n\n.glr-row {\n display: flex;\n gap: 0.75rem;\n padding: 0.35rem 0;\n border-top: 1px solid #f0f0f0;\n}\n\n.glr-input {\n flex: 0 0 190px;\n font-family: monospace;\n font-size: 0.8rem;\n word-break: break-all;\n}\n\n.glr-input-count {\n margin-left: 0.35rem;\n font-variant-numeric: tabular-nums;\n}\n\n.glr-candidates {\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.glr-candidate {\n display: flex;\n align-items: baseline;\n gap: 0.4rem;\n font-size: 0.8rem;\n padding: 1px 4px;\n border-radius: 3px;\n opacity: 0.55;\n cursor: pointer;\n margin-bottom: 0;\n}\n\n.glr-candidate-kept {\n opacity: 1;\n background: #eef6ff;\n}\n\n.glr-candidate-id {\n font-family: monospace;\n flex: 0 0 auto;\n}\n\n.glr-candidate-species {\n font-style: italic;\n color: #446;\n flex: 0 0 auto;\n}\n\n/ Descriptions vary wildly in length; keep rows one line tall. /\n.glr-candidate-desc {\n color: #777;\n flex: 1 1 auto;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.glr-only {\n border: none;\n background: none;\n color: #a03e34;\n text-decoration: underline;\n font-size: 0.75rem;\n padding: 0 2px;\n flex: 0 0 auto;\n}\n\n.glr-more {\n border: none;\n background: none;\n color: #a03e34;\n text-decoration: underline;\n font-size: 0.8rem;\n padding: 4px 0 0 0;\n}\n\n.glr-resolved-row {\n display: flex;\n gap: 0.4rem;\n font-family: monospace;\n font-size: 0.8rem;\n padding: 1px 0;\n}\n\n.glr-arrow { color: #999; }\n.glr-resolved-id { color: #446; }\n\n.glr-unknown {\n font-size: 0.8rem;\n max-height: 200px;\n overflow: auto;\n margin-bottom: 0;\n}\n\n/ The count of what will actually be saved. Deliberately prominent: with\n include-all-by-default a single ambiguous id can add 15 genes. /\n.glr-summary {\n margin-top: 0.75rem;\n padding: 0.5rem 0.75rem;\n border: 1px solid #cfe3f7;\n background: #eef6ff;\n border-radius: 4px;\n font-size: 0.9rem;\n}\n\n.glr-summary-total {\n font-size: 1.1rem;\n font-weight: 600;\n}\n\n.glr-summary-detail {\n color: #555;\n font-size: 0.8rem;\n}\n\n/ Per-genome bulk actions. A plain \"prefer sorghum\" is useless on this index —\n ~94 of its genomes are sorghum accessions, so a conflict can be sorghum on both\n sides. Only genomes that would actually narrow a row are offered. /\n.glr-genomes {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 0.3rem;\n margin-bottom: 0.5rem;\n}\n\n.glr-genomes-label { margin: 0 0.2rem 0 0; }\n\n.glr-genome-btn { font-size: 0.75rem; padding: 0.1rem 0.4rem; }\n\n.glr-genome-count { margin-left: 0.3rem; font-weight: normal; }\n\n.glr-row-toggle {\n border: none;\n background: none;\n padding: 0 2px 0 0;\n color: #666;\n}\n\n.glr-row-bulk { margin-top: 2px; }\n\n.glr-collapsed { font-size: 0.8rem; color: #777; }\n\n.glr-muted { color: #bbb; }\n",".exporter-view {\n display: grid;\n grid-template-columns: 1fr 8px 1fr;\n gap: 0;\n padding: 0.75rem;\n min-height: 400px;\n}\n\n.exporter-view > .exporter-pane:first-child {\n margin-right: 0.5rem;\n}\n\n.exporter-view > .exporter-pane.exporter-right-pane {\n margin-left: 0.5rem;\n}\n\n.exporter-divider {\n cursor: col-resize;\n background: transparent;\n position: relative;\n align-self: stretch;\n}\n\n.exporter-divider::before {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n width: 2px;\n background: #d0d4da;\n border-radius: 1px;\n transition: background 0.15s;\n}\n\n.exporter-divider:hover::before,\n.exporter-divider.dragging::before {\n background: #7a8aa0;\n width: 3px;\n}\n\n.exporter-pane {\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n background: #fff;\n display: flex;\n flex-direction: column;\n max-height: 70vh;\n overflow: hidden;\n}\n\n.exporter-pane-header {\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid #e0e0e0;\n background: #f8f9fa;\n font-size: 0.9rem;\n}\n\n.exporter-pane-header-row {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.exporter-field-search-inline {\n margin-left: auto;\n margin-bottom: 0;\n max-width: 220px;\n height: 1.75rem;\n font-size: 0.85rem;\n padding: 0.15rem 0.5rem;\n}\n\n.exporter-pane-body {\n flex: 1;\n overflow-y: auto;\n padding: 0.5rem;\n}\n\n.exporter-panel-empty {\n padding: 1rem;\n color: #888;\n text-align: center;\n font-size: 0.9rem;\n}\n\n/ --- FieldTree --- /\n\n.exporter-field-tree {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.exporter-field-search {\n margin-bottom: 0.5rem;\n font-size: 0.9rem;\n}\n\n.exporter-field-tree-body {\n flex: 1;\n overflow-y: auto;\n}\n\n.exporter-group {\n margin-bottom: 0.25rem;\n}\n\n.exporter-group-header {\n cursor: pointer;\n padding: 0.25rem 0.5rem;\n background: #eef1f4;\n border-radius: 3px;\n display: flex;\n align-items: center;\n gap: 0.4rem;\n user-select: none;\n font-size: 0.9rem;\n}\n\n.exporter-group-header:hover {\n background: #e3e7ec;\n}\n\n.exporter-group-chevron {\n display: inline-flex;\n align-items: center;\n color: #666;\n}\n\n.exporter-group-count {\n font-size: 0.75rem;\n color: #666;\n background: #fff;\n padding: 0 0.4rem;\n border-radius: 10px;\n border: 1px solid #ddd;\n}\n\n.exporter-group-actions {\n margin-left: auto;\n display: inline-flex;\n gap: 0.25rem;\n}\n\n.exporter-group-action {\n font-size: 0.7rem;\n padding: 0.05rem 0.4rem;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n color: #333;\n cursor: pointer;\n line-height: 1.4;\n}\n\n.exporter-group-action:hover:not(:disabled) {\n background: #f0f4f8;\n border-color: #88a;\n}\n\n.exporter-group-action:disabled {\n opacity: 0.4;\n cursor: default;\n}\n\n.exporter-group-fields {\n list-style: none;\n margin: 0.25rem 0 0.5rem 1.25rem;\n padding: 0;\n}\n\n.exporter-group-fields li {\n padding: 0.1rem 0.25rem;\n font-size: 0.85rem;\n}\n\n.exporter-group-fields label {\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 0.35rem;\n margin: 0;\n padding: 0.1rem 0.25rem;\n border-radius: 2px;\n width: 100%;\n}\n\n.exporter-group-fields label:hover {\n background: #f0f4f8;\n}\n\n.exporter-field-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exporter-field-badge {\n font-size: 0.7rem;\n color: #888;\n font-family: monospace;\n}\n\n.exporter-group-truncated {\n color: #888;\n font-size: 0.8rem;\n padding-left: 0.5rem;\n}\n\n/ --- SelectedFields --- /\n\n.exporter-selected {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.exporter-selected-header {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.25rem 0;\n margin-bottom: 0.5rem;\n border-bottom: 1px solid #eee;\n}\n\n.exporter-selected-count {\n font-size: 0.75rem;\n color: #666;\n background: #eef1f4;\n padding: 0 0.5rem;\n border-radius: 10px;\n}\n\n.exporter-clear-btn {\n margin-left: auto;\n font-size: 0.8rem;\n padding: 0;\n}\n\n.exporter-selected-list {\n list-style: none;\n margin: 0;\n padding: 0;\n overflow-y: auto;\n flex: 1;\n}\n\n.exporter-selected-list li {\n display: flex;\n align-items: center;\n gap: 0.4rem;\n padding: 0.25rem 0.35rem;\n border-bottom: 1px solid #f0f0f0;\n font-size: 0.85rem;\n}\n\n.exporter-selected-index {\n font-family: monospace;\n color: #888;\n min-width: 1.75rem;\n}\n\n.exporter-selected-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exporter-selected-group {\n color: #888;\n}\n\n.exporter-selected-actions {\n display: flex;\n gap: 0.15rem;\n}\n\n.exporter-selected-actions button {\n padding: 0.1rem 0.35rem;\n line-height: 1;\n}\n\n/ --- Right pane (selected + preview) --- /\n\n.exporter-right-pane {\n max-height: 70vh;\n}\n\n.exporter-right-split {\n display: flex;\n flex-direction: column;\n flex: 1;\n overflow: hidden;\n}\n\n.exporter-selected-section {\n flex: 0 0 auto;\n max-height: 35%;\n overflow-y: auto;\n padding: 0.5rem;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.exporter-preview-section {\n flex: 1;\n overflow: hidden;\n padding: 0.5rem;\n display: flex;\n flex-direction: column;\n}\n\n/ --- Preview --- /\n\n.exporter-preview {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.exporter-preview-toolbar {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n padding-bottom: 0.35rem;\n margin-bottom: 0.35rem;\n border-bottom: 1px solid #eee;\n font-size: 0.85rem;\n}\n\n.exporter-preview-format label {\n margin-right: 0.5rem;\n cursor: pointer;\n}\n\n.exporter-preview-format input {\n margin-right: 0.25rem;\n}\n\n.exporter-preview-status {\n margin-left: auto;\n color: #888;\n}\n\n.exporter-cutoffs-btn {\n display: inline-flex;\n align-items: center;\n gap: 0.25rem;\n padding: 0.1rem 0.5rem;\n font-size: 0.8rem;\n}\n\n.exporter-modal-backdrop {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.35);\n z-index: 1050;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.exporter-modal {\n background: #fff;\n border-radius: 6px;\n box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);\n width: min(420px, 90vw);\n display: flex;\n flex-direction: column;\n}\n\n.exporter-modal-header {\n display: flex;\n align-items: center;\n padding: 0.6rem 0.9rem;\n border-bottom: 1px solid #eee;\n}\n\n.exporter-modal-close {\n margin-left: auto;\n background: transparent;\n border: 0;\n font-size: 1.25rem;\n line-height: 1;\n color: #666;\n cursor: pointer;\n padding: 0 0.25rem;\n}\n\n.exporter-modal-body {\n padding: 0.9rem;\n display: flex;\n flex-direction: column;\n gap: 0.85rem;\n}\n\n.exporter-modal-field label {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n font-size: 0.85rem;\n font-weight: 500;\n}\n\n.exporter-modal-field input {\n font: inherit;\n padding: 0.25rem 0.5rem;\n border: 1px solid #c0c4ca;\n border-radius: 3px;\n}\n\n.exporter-modal-field small {\n color: #777;\n font-size: 0.75rem;\n margin-top: 0.15rem;\n}\n\n.exporter-modal-footer {\n display: flex;\n justify-content: flex-end;\n gap: 0.5rem;\n padding: 0.6rem 0.9rem;\n border-top: 1px solid #eee;\n}\n\n.exporter-preview-status.error {\n color: #c33;\n}\n\n.exporter-preview-body {\n flex: 1;\n overflow: auto;\n background: #fafbfc;\n border: 1px solid #eee;\n border-radius: 3px;\n}\n\n.exporter-preview-empty {\n padding: 1rem;\n color: #888;\n text-align: center;\n}\n\n.exporter-preview-tsv-scroll {\n overflow: auto;\n max-width: 100%;\n}\n\n.exporter-preview-tsv {\n border-collapse: collapse;\n font-size: 0.8rem;\n font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n width: auto;\n}\n\n.exporter-preview-tsv th,\n.exporter-preview-tsv td {\n padding: 0.2rem 0.5rem;\n border: 1px solid #e5e7ea;\n max-width: 420px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exporter-preview-tsv th {\n position: relative;\n}\n\n.exporter-preview-col-resizer {\n position: absolute;\n top: 0;\n right: -3px;\n width: 6px;\n height: 100%;\n cursor: col-resize;\n user-select: none;\n z-index: 2;\n}\n\n.exporter-preview-col-resizer::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n width: 1px;\n background: transparent;\n transition: background 0.15s;\n}\n\n.exporter-preview-col-resizer:hover::after,\n.exporter-preview-col-resizer:active::after {\n background: #7a8aa0;\n width: 2px;\n}\n\n.exporter-preview-tsv th {\n background: #f0f3f6;\n text-align: left;\n position: sticky;\n top: 0;\n z-index: 1;\n padding: 0.15rem 0.25rem;\n}\n\n.exporter-preview-th-inner {\n display: flex;\n align-items: center;\n gap: 0.15rem;\n min-width: 0;\n}\n\n.exporter-preview-th-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exporter-preview-reorder-btn {\n flex: 0 0 auto;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 3px;\n padding: 0;\n line-height: 1;\n color: #555;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n}\n\n.exporter-preview-reorder-btn:hover:not(:disabled) {\n background: #fff;\n border-color: #bbb;\n color: #111;\n}\n\n.exporter-preview-reorder-btn:disabled {\n opacity: 0.25;\n cursor: default;\n}\n\n.exporter-preview-fields-count {\n color: #666;\n display: inline-flex;\n align-items: center;\n gap: 0.35rem;\n}\n\n.exporter-preview-tsv tr:hover td {\n background: #f4f7fa;\n}\n\n.exporter-preview-empty-row {\n text-align: center;\n color: #888;\n padding: 1rem !important;\n}\n\n.exporter-preview-json {\n margin: 0;\n padding: 0.5rem;\n font-size: 0.75rem;\n line-height: 1.4;\n}\n\n/ --- Export footer --- /\n\n.exporter-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 0.75rem;\n padding: 0.5rem 0.75rem;\n border-top: 1px solid #e0e0e0;\n background: #f8f9fa;\n flex: 0 0 auto;\n}\n\n.exporter-footer-summary {\n color: #555;\n}\n",".exprviz-view {\n padding: 0.5rem;\n}\n\n.exprviz-tabs {\n margin-bottom: 0.5rem;\n}\n\n.exprviz-tab-panel {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n padding: 0.5rem 0;\n / Constrain children so the grid scrolls internally instead of bleeding\n * out and forcing the page to scroll horizontally. /\n min-width: 0;\n overflow: hidden;\n}\n\n.exprviz-toolbar {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n/ Host applications (e.g. sorghum-webapp) sometimes ship global stylesheets\n * that override `.btn` / `.btn-sm` with `!important` — fat padding, custom\n * font-weight, transformed text — which leaves our toolbar buttons at\n * inconsistent sizes (since plain `<Button>` and `<ToggleButton>` inside a\n * `<ToggleButtonGroup>` pick up different rules). Re-state Bootstrap 5's\n * small-button metrics here with higher specificity and `!important`, scoped\n * to `.exprviz-toolbar`, so the toolbar always looks the same regardless of\n * what the host's theme does. /\n.exprviz-toolbar .btn,\n.exprviz-toolbar .btn.btn-sm,\n.exprviz-toolbar .btn-group > .btn,\n.exprviz-toolbar .btn-group > .btn.btn-sm,\n.exprviz-toolbar .btn-group-sm > .btn,\n.exprviz-toolbar label.btn {\n padding: 0.25rem 0.5rem !important;\n font-size: 0.875rem !important;\n line-height: 1.5 !important;\n font-weight: 400 !important;\n text-transform: none !important;\n letter-spacing: normal !important;\n height: auto !important;\n min-height: 0 !important;\n border-radius: 0.2rem !important;\n}\n\n/ Restore the squared-off inner edges within a ToggleButtonGroup. /\n.exprviz-toolbar .btn-group > .btn:not(:first-child):not(:last-child),\n.exprviz-toolbar .btn-group > .btn:not(:first-child):not(:last-child).btn-sm {\n border-radius: 0 !important;\n}\n.exprviz-toolbar .btn-group > .btn:first-child:not(:last-child),\n.exprviz-toolbar .btn-group > .btn:first-child:not(:last-child).btn-sm {\n border-top-right-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n}\n.exprviz-toolbar .btn-group > .btn:last-child:not(:first-child),\n.exprviz-toolbar .btn-group > .btn:last-child:not(:first-child).btn-sm {\n border-top-left-radius: 0 !important;\n border-bottom-left-radius: 0 !important;\n}\n\n.exprviz-toolbar .btn-group {\n vertical-align: middle;\n}\n\n/ Same idea for the status text — host stylesheets sometimes restyle\n * <span>s in unexpected ways. /\n.exprviz-toolbar .exprviz-status {\n font-weight: 400 !important;\n text-transform: none !important;\n letter-spacing: normal !important;\n}\n\n.exprviz-status {\n color: #666;\n font-size: 0.85rem;\n margin-left: 0.5rem;\n}\n\n.exprviz-warning {\n color: #b06000;\n background: #fff8e0;\n border: 1px solid #f0d080;\n border-radius: 3px;\n padding: 2px 6px;\n font-size: 0.8rem;\n cursor: help;\n}\n\n.exprviz-body {\n display: flex;\n flex-direction: column;\n min-width: 0;\n overflow: hidden;\n}\n\n.exprviz-plot {\n border: 1px solid #ddd;\n background: #fff;\n min-height: 120px;\n overflow: hidden;\n}\n\n.exprviz-resizer {\n height: 8px;\n margin: 2px 0;\n background: #f0f0f0;\n border-top: 1px solid #ddd;\n border-bottom: 1px solid #ddd;\n cursor: row-resize;\n flex: none;\n}\n\n.exprviz-resizer::before {\n content: '';\n display: block;\n width: 36px;\n height: 2px;\n background: #aaa;\n border-radius: 1px;\n margin: 3px auto;\n}\n\n.exprviz-resizer:hover,\n.exprviz-resizer:active {\n background: #e0e8f5;\n}\n\n.exprviz-resizer:hover::before,\n.exprviz-resizer:active::before {\n background: #2a6ebb;\n}\n\n.exprviz-pc-container {\n width: 100%;\n height: 100%;\n}\n\n.exprviz-pc-container svg {\n display: block;\n}\n\n.exprviz-pc-lines path {\n fill: none;\n stroke: steelblue;\n}\n\n.exprviz-pc-line-in {\n stroke-opacity: 0.4;\n}\n\n.exprviz-pc-line-out {\n stroke-opacity: 0.04;\n}\n\n.exprviz-pc-lines path:not(.exprviz-pc-line-in):not(.exprviz-pc-line-out) {\n stroke-opacity: 0.25;\n}\n\n.exprviz-pc-lines path.exprviz-pc-line-hover {\n stroke: #d62728;\n stroke-opacity: 1;\n stroke-width: 2;\n}\n\n.exprviz-pc-axis-dragging .domain,\n.exprviz-pc-axis-dragging .tick line {\n stroke: #555;\n}\n\n.exprviz-pc-axis-dragging .exprviz-pc-axis-label {\n font-weight: bold;\n}\n\n.exprviz-plot-empty,\n.exprviz-table-empty {\n padding: 1rem;\n color: #888;\n}\n\n.exprviz-pc-tooltip {\n position: fixed;\n z-index: 1000;\n background: #fff;\n border: 1px solid #bbb;\n border-radius: 3px;\n box-shadow: 0 2px 6px rgba(0,0,0,0.15);\n padding: 6px 8px;\n font-size: 0.78rem;\n line-height: 1.35;\n max-width: 360px;\n pointer-events: none;\n color: #222;\n}\n\n.exprviz-pc-tip-section {\n margin-top: 4px;\n font-size: 0.72rem;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #888;\n}\n\n.exprviz-pc-tip-row {\n margin-left: 0.4rem;\n}\n\n.exprviz-pc-tip-key {\n font-weight: 600;\n}\n\n/ ---- heatmap ---- /\n\n.exprviz-hm-container {\n width: 100%;\n height: 100%;\n position: relative;\n / Horizontal scroll lives on the outer container so the sticky-positioned\n * column header and the cell body translate together — column labels\n * always stay aligned with the cells beneath them. /\n overflow-x: auto;\n}\n\n.exprviz-hm-inner {\n display: flex;\n flex-direction: column;\n height: 100%;\n min-width: 100%;\n}\n\n.exprviz-hm-container svg {\n display: block;\n}\n\n.exprviz-hm-header {\n flex: 0 0 auto;\n background: #fff;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.exprviz-hm-body {\n flex: 1 1 auto;\n overflow-y: auto;\n overflow-x: hidden;\n min-height: 0;\n}\n\n.exprviz-hm-collabel {\n fill: #222;\n}\n\n.exprviz-hm-rowlabels text {\n fill: #444;\n}\n\n.exprviz-hm-cells rect {\n shape-rendering: crispEdges;\n cursor: crosshair;\n}\n\n.exprviz-hm-legend {\n position: absolute;\n top: 6px;\n right: 6px;\n display: flex;\n gap: 6px;\n background: rgba(255, 255, 255, 0.92);\n border: 1px solid #d0d7de;\n border-radius: 3px;\n padding: 3px 6px;\n font-size: 0.72rem;\n line-height: 1.1;\n pointer-events: auto;\n z-index: 2;\n}\n\n.exprviz-hm-legend-bin {\n display: flex;\n align-items: center;\n gap: 3px;\n}\n\n.exprviz-hm-legend-swatch {\n display: inline-block;\n width: 14px;\n height: 14px;\n border: 1px solid rgba(0, 0, 0, 0.15);\n}\n\n.exprviz-hm-legend-label {\n color: #333;\n font-variant-numeric: tabular-nums;\n}\n\n.exprviz-table {\n height: 480px;\n min-width: 0;\n overflow: hidden;\n}\n\n.exprviz-aggrid {\n width: 100%;\n height: 100%;\n / Block the browser's edge-of-scroll back/forward gesture when the user\n * scrolls all the way left or right inside the grid. /\n overscroll-behavior-x: contain;\n}\n\n/ ag-grid's scrolling viewports — make sure the back/forward gesture is\n * contained at every level, not just on our outer wrapper. /\n.exprviz-aggrid .ag-body-viewport,\n.exprviz-aggrid .ag-body-horizontal-scroll-viewport,\n.exprviz-aggrid .ag-center-cols-viewport {\n overscroll-behavior-x: contain;\n}\n\n/ Group-header rows: subtle tinting so each metadata level reads as a band.\n * The :first-of-type column-group rule covers the topmost (study) row. /\n.exprviz-aggrid .ag-header-group-cell {\n font-size: 0.78rem;\n border-right: 1px solid #e0e0e0;\n}\n\n.exprviz-aggrid .ag-header-group-cell-label {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 0 6px;\n}\n\n.exprviz-aggrid .exprviz-hg-factors {\n background: #eef6ff;\n color: #1e3a5f;\n}\n\n.exprviz-aggrid .exprviz-hg-chars {\n background: #f5f5f0;\n color: #4a4a30;\n}\n\n.exprviz-aggrid .exprviz-hg-collapsed {\n font-style: italic;\n color: #666;\n}\n\n/ The label cells stacked above the Gene ID and Name columns — Study/Title,\n * every Factor/<factor type> row, every Characteristic/<char type> row,\n * and the collapsed-section placeholders — are rendered via the\n * LabelHeaderGroup / ToggleHeaderGroup React components. Both render a\n * full-width div that right-aligns its content, so the alignment is\n * baked into the component DOM and doesn't depend on overriding\n * ag-grid's internal CSS. The leaf cells (\"Gene ID\" / \"Name\") are not\n * wrapped in these components and keep ag-grid's default left alignment. /\n.exprviz-label-header {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n text-align: right;\n padding-right: 6px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.exprviz-toggle-header {\n cursor: pointer;\n user-select: none;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n width: 100%;\n padding-right: 6px;\n}\n\n.exprviz-toggle-header:hover {\n color: #2a6ebb;\n}\n\n.exprviz-toggle-caret {\n display: inline-block;\n width: 0.9em;\n font-size: 0.75em;\n color: #888;\n margin-right: 2px;\n}\n\n.exprviz-toggle-header:hover .exprviz-toggle-caret {\n color: #2a6ebb;\n}\n\n.exprviz-fields-layout {\n display: grid;\n grid-template-columns: 320px 1fr;\n gap: 0.75rem;\n height: 60vh;\n}\n\n.exprviz-tree {\n overflow-y: auto;\n border: 1px solid #eee;\n padding: 0.4rem 0.5rem;\n font-size: 0.85rem;\n}\n\n.exprviz-tree-search {\n width: 100%;\n box-sizing: border-box;\n padding: 4px 6px;\n margin-bottom: 0.4rem;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 0.85rem;\n}\n\n.exprviz-tree-group {\n margin-bottom: 0.5rem;\n}\n\n.exprviz-tree-group-header {\n cursor: pointer;\n user-select: none;\n padding: 2px 0;\n}\n\n.exprviz-tree-caret {\n display: inline-block;\n width: 1em;\n color: #888;\n}\n\n.exprviz-tree-type {\n margin-left: 0.5rem;\n border-left: 2px solid transparent;\n padding-left: 0.25rem;\n}\n\n.exprviz-tree-type.is-active {\n border-left-color: #2a6ebb;\n}\n\n.exprviz-tree-type-header {\n cursor: pointer;\n user-select: none;\n display: flex;\n align-items: center;\n padding: 2px 0;\n}\n\n.exprviz-tree-type-header:hover {\n background: #f5f8ff;\n}\n\n.exprviz-tree-type-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exprviz-tree-type-count {\n color: #888;\n font-variant-numeric: tabular-nums;\n margin-left: 0.5rem;\n}\n\n.exprviz-tree-values {\n margin: 0.25rem 0 0.5rem 1.25rem;\n padding-left: 0.25rem;\n border-left: 1px dashed #e0e0e0;\n}\n\n.exprviz-values-toolbar {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n margin-bottom: 0.25rem;\n}\n\n.exprviz-tree-value {\n display: flex;\n align-items: center;\n gap: 0.4rem;\n padding: 1px 0;\n cursor: pointer;\n}\n\n.exprviz-tree-value:hover {\n background: #fafaff;\n}\n\n.exprviz-tree-value-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exprviz-tree-value-count {\n color: #888;\n font-variant-numeric: tabular-nums;\n font-size: 0.8em;\n}\n\n.exprviz-tree-empty {\n color: #999;\n margin-left: 1rem;\n}\n\n.exprviz-fields-preview {\n overflow: auto;\n border: 1px solid #eee;\n}\n\n.exprviz-fields-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.85rem;\n}\n\n.exprviz-fields-table th,\n.exprviz-fields-table td {\n padding: 4px 8px;\n border-bottom: 1px solid #f0f0f0;\n white-space: nowrap;\n text-align: left;\n}\n\n.exprviz-fields-table thead th {\n position: sticky;\n top: 0;\n background: #fafafa;\n z-index: 1;\n border-bottom: 1px solid #ddd;\n}\n\n.exprviz-col-factor {\n background: #eef6ff;\n}\n\n.exprviz-col-char {\n background: #f5f5f0;\n}\n\n.exprviz-fields-table tbody tr:hover {\n background: #fafaff;\n}\n\n",".attrtable-view {\n display: flex;\n flex-direction: column;\n width: 100%;\n}\n\n.attrtable-toolbar {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n padding: 0.25rem 0 0.5rem;\n}\n\n.attrtable-status {\n font-size: small;\n}\n\n/ pale → dark = low → high, matching the tbrowse Expression zone /\n.attrtable-legend {\n display: flex;\n align-items: center;\n gap: 1px;\n margin-left: auto;\n}\n\n.attrtable-legend span {\n width: 12px;\n height: 12px;\n display: inline-block;\n border: 1px solid rgba(0, 0, 0, 0.08);\n}\n\n.attrtable-notice {\n padding: 0.4rem 0.75rem;\n margin-bottom: 0.5rem;\n font-size: small;\n}\n\n.attrtable-columns-panel {\n border: 1px solid #dee2e6;\n border-radius: 4px;\n padding: 0.5rem;\n margin-bottom: 0.5rem;\n max-height: 320px;\n overflow-y: auto;\n}\n\n.attrtable-columns-head {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n margin-bottom: 0.5rem;\n}\n\n.attrtable-field-search {\n flex: 1;\n}\n\n.attrtable-aggrid {\n width: 100%;\n height: 600px;\n / Block the browser's edge-of-scroll back/forward gesture when scrolling\n * all the way left or right inside the grid. /\n overscroll-behavior-x: contain;\n}\n\n.attrtable-aggrid .ag-body-viewport,\n.attrtable-aggrid .ag-body-horizontal-scroll-viewport,\n.attrtable-aggrid .ag-center-cols-viewport {\n overscroll-behavior-x: contain;\n}\n\n.attrtable-empty {\n padding: 1rem;\n color: #6c757d;\n}\n\n/ Cell click popover — spells out the clicked value(s) and offers an\n * \"add filter\" per value. Rendered outside the grid so its text is selectable\n * (ag-grid cells disable text selection). /\n.attrtable-popover {\n position: fixed;\n z-index: 1080;\n min-width: 200px;\n max-width: 280px;\n background: #fff;\n border: 1px solid #c6ccd2;\n border-radius: 5px;\n box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);\n padding: 6px;\n user-select: text;\n}\n\n.attrtable-popover-title {\n font-weight: 600;\n font-size: 12px;\n color: #495057;\n padding: 2px 4px 6px;\n border-bottom: 1px solid #edeff2;\n margin-bottom: 4px;\n}\n\n.attrtable-popover-row {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 2px 4px;\n}\n\n.attrtable-popover-val {\n flex: 1;\n font-size: 13px;\n word-break: break-word;\n}\n\n.attrtable-popover-btn {\n flex: 0 0 auto;\n white-space: nowrap;\n padding: 1px 8px;\n font-size: 12px;\n}\n\n/ Vertical headers for the narrow organ columns: full tissue names read\n * bottom-to-top, centred within each column so they stay inside the cell and\n * never cross the column separators (which they did when slanted). /\n\n/ The quartz theme gives header cells 16px of horizontal padding, which on a\n * 22px organ column leaves the label no room (its container collapses to 0 and\n * overflow:hidden clips it). Zero it so the vertical label uses the full column\n * width — the column itself stays 22px, so the heatmap doesn't get wider. /\n.attrtable-aggrid .attrtable-organ-header {\n padding-left: 0 !important;\n padding-right: 0 !important;\n}\n\n.attrtable-rot-header {\n height: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n cursor: pointer;\n}\n\n/ Left-justified: the label is anchored at the bottom-left and rises straight\n * up, so every tissue name starts on the same line just above the heatmap\n * (rather than floating centred in the tall header). /\n.attrtable-rot-header > span {\n position: absolute;\n / Rotating -90° about the baseline throws the glyph height to the left of\n * the pivot, so anchor the pivot ~13px in to keep the text inside its own\n * 22px column. /\n left: 13px;\n bottom: 3px;\n transform-origin: left bottom;\n transform: rotate(-90deg);\n white-space: nowrap;\n font-size: 10px;\n line-height: 1;\n}\n\n/ Tight heatmap cells: colour fills the whole (narrow) cell, no padding. /\n.attrtable-aggrid .attrtable-organ-cell {\n padding: 0 !important;\n}\n\n/ Drop the theme's resize-handle grip (a 2px bar drawn on every header cell's\n * right edge) — it read as a heavy, header-only column separator. Resizing by\n * dragging the edge still works; only the decoration is gone. /\n.attrtable-aggrid .ag-header-cell-resize::after {\n display: none;\n}\n\n/ Column separators between all columns, clearly visible in both the header and\n * the body (the theme's default border is near-invisible on white). /\n.attrtable-aggrid .ag-cell,\n.attrtable-aggrid .ag-header-cell {\n border-right: 1px solid #c6ccd2;\n}\n\n/ ...except within the expression heatmap: the organ columns read as one\n * continuous block, so drop their internal separators. The last organ column\n * keeps its right border so the heatmap's outer edge is still divided from the\n * next column. /\n.attrtable-aggrid .attrtable-organ-cell,\n.attrtable-aggrid .attrtable-organ-header {\n border-right: none;\n}\n\n.attrtable-aggrid .attrtable-organ-cell.attrtable-organ-last,\n.attrtable-aggrid .attrtable-organ-header.attrtable-organ-last {\n border-right: 1px solid #c6ccd2;\n}\n\n/ With the tall header (organ heatmap shown), sit the plain column labels at\n * the bottom so they line up with the base of the slanted organ labels. /\n.attrtable-aggrid.attrtable-tall-header .ag-header-cell-label {\n align-items: flex-end;\n padding-bottom: 3px;\n}\n",".oe-view {\n padding: 0.25rem 0.5rem;\n}\n\n.oe-layout {\n display: flex;\n align-items: flex-start;\n gap: 0.75rem;\n}\n\n.oe-layout-tree {\n max-height: 80vh;\n overflow: auto;\n border: 1px solid #e1e4e8;\n border-radius: 4px;\n padding: 0.25rem 0.5rem;\n background: #fafbfc;\n font-size: 13px;\n min-width: 0;\n}\n\n.oe-splitter {\n flex: 0 0 6px;\n cursor: col-resize;\n background: transparent;\n border-left: 1px solid #e1e4e8;\n border-right: 1px solid #e1e4e8;\n margin: 0 1px;\n align-self: stretch;\n}\n\n.oe-splitter:hover,\n.oe-splitter:active {\n background: #d6e9ff;\n}\n\n.oe-layout-panel {\n flex: 1 1 auto;\n min-width: 0;\n}\n\n.oe-tree-leaf {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 2px 4px;\n cursor: pointer;\n border-radius: 2px;\n}\n\n.oe-tree-leaf:hover {\n background: #eef5ff;\n}\n\n.oe-tree-leaf-active {\n background: #d6e9ff !important;\n font-weight: 600;\n}\n\n.oe-tree-leaf-name {\n flex: 1 1 auto;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.oe-tree-leaf-count {\n color: #555;\n font-size: 12px;\n font-variant-numeric: tabular-nums;\n}\n\n.oe-loading {\n padding: 1rem;\n}\n\n.oe-summary {\n font-size: 0.9rem;\n margin: 0.25rem 0 0.5rem 0;\n}\n\n.oe-controls {\n display: flex;\n flex-wrap: wrap;\n gap: 0.75rem;\n align-items: end;\n margin-bottom: 0.5rem;\n padding: 0.5rem;\n background-color: #f6f8fa;\n border: 1px solid #e1e4e8;\n border-radius: 4px;\n}\n\n.oe-control {\n min-width: 100px;\n}\n\n.oe-control-grow {\n flex-grow: 1;\n min-width: 200px;\n}\n\n.oe-control .form-label {\n font-size: 0.8rem;\n margin-bottom: 0.15rem;\n}\n\n.oe-help {\n display: inline-flex;\n align-items: center;\n margin-left: 3px;\n color: #6c757d;\n cursor: help;\n vertical-align: middle;\n font-size: 0.85em;\n}\n\n.oe-help:hover,\n.oe-help:focus {\n color: #0366d6;\n outline: none;\n}\n\n.oe-switch {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.oe-ont-title {\n font-weight: 600;\n margin-right: 0.5rem;\n}\n\n.oe-ont-badge {\n font-weight: normal;\n}\n\n.oe-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.85rem;\n}\n\n.oe-table th,\n.oe-table td {\n padding: 0.25rem 0.5rem;\n border-bottom: 1px solid #eee;\n text-align: left;\n}\n\n.oe-table th {\n background: #f0f3f6;\n position: sticky;\n top: 0;\n}\n\n.oe-sort-th {\n cursor: pointer;\n user-select: none;\n white-space: nowrap;\n}\n\n.oe-sort-th:hover {\n background: #dde3ea;\n}\n\n.oe-sort-th-active {\n background: #dde3ea;\n color: #003366;\n}\n\n.oe-table tbody tr {\n cursor: pointer;\n}\n\n.oe-table tbody tr:hover {\n background-color: #eef5ff;\n}\n\n.oe-num {\n text-align: right !important;\n font-variant-numeric: tabular-nums;\n}\n\n.oe-term-id {\n font-family: monospace;\n white-space: nowrap;\n}\n\n.oe-term-name {\n max-width: 32rem;\n}\n\n.oe-term-type {\n white-space: nowrap;\n color: #555;\n font-size: 0.8rem;\n}\n","/ Sidebar \"Refine\" section: facet-count groups. Lives inside .sidebar-section-body\n * (pale-yellow), so text/controls are tuned for that background. /\n\n.facet-group {\n margin-bottom: 3px;\n}\n\n.facet-group-header {\n display: flex;\n align-items: center;\n gap: 4px;\n cursor: pointer;\n padding: 2px 2px;\n font-weight: 600;\n font-size: 0.82rem;\n color: #5a3a1a;\n user-select: none;\n}\n.facet-group-header:hover {\n background: rgba(0, 0, 0, 0.06);\n border-radius: 3px;\n}\n\n.facet-group-caret {\n display: inline-flex;\n font-size: 0.68rem;\n}\n\n.facet-group-title {\n flex: 1;\n}\n\n/ count of distinct values in the group (not a click target) /\n.facet-group-nvals {\n color: #8a6d3b;\n font-weight: 400;\n font-size: 0.7rem;\n}\n\n.facet-group-body {\n padding: 0 2px 2px 14px;\n}\n\n.facet-row {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 1px 0;\n font-size: 0.8rem;\n}\n\n/ selectable label; ellipsis when a TF-family name is long /\n.facet-val {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: #333;\n}\n\n/ the clickable count — adds the field:value filter */\n.facet-count {\n flex: 0 0 auto;\n border: none;\n background: #e7d27a;\n color: #5a3a1a;\n border-radius: 3px;\n padding: 0 6px;\n font-size: 0.72rem;\n line-height: 1.5;\n font-variant-numeric: tabular-nums;\n cursor: pointer;\n}\n.facet-count:hover {\n background: #a03e34;\n color: #fff;\n}\n\n.facet-more {\n border: none;\n background: none;\n color: #a03e34;\n cursor: pointer;\n font-size: 0.75rem;\n padding: 2px 0 2px 0;\n text-decoration: underline;\n}\n\n.facet-status {\n font-size: 0.78rem;\n color: #8a6d3b;\n font-style: italic;\n padding: 2px;\n}\n"],"names":[],"version":3,"file":"index.css.map"}
1	+ {"mappings":"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","sources":["ff42af53a3828e08","src/components/styles.css","src/components/results/genes.css","msa.less","tree.less","src/components/results/details/tree-view.css","node_modules/react-simple-tree-menu/src/sass/main.scss","src/components/results/details/VEP.css","src/components/results/details/sequences.css","main.less","src/components/results/expression.css","src/components/results/geneList.css","src/components/exporter/styles.css","src/components/exprViz/styles.css","src/components/attrTable/styles.css","src/components/results/ontologyEnrichment.css","src/components/facets/styles.css"],"sourcesContent":["@import \"5abb1db407612521\";\n@import \"1caf78728b2f5137\";\n@import \"2166a150e9f31214\";\n@import \"938d6be3f57789df\";\n@import \"996096824b9f7d5a\";\n@import \"aa165d1be5d1c755\";\n@import \"41a1dcf3bc8b5377\";\n@import \"c52016833805a9f9\";\n@import \"6f643ac0480217ea\";\n@import \"c6576577b854e1eb\";\n@import \"2e4f466f4d9add63\";\n@import \"b02f188cedfc7aaa\";\n@import \"c165ffd6f0d0851d\";\n@import \"f46a3e1dc6586595\";\n@import \"0d0d5189ac663932\";\n@import \"11adedcd1a1dabc7\";\n","/* ── Main search layout: sidebar + content ──────────────────────────────── /\n.search-views-layout {\n display: flex;\n align-items: flex-start;\n}\n\n.search-views-content {\n flex: 1 1 0;\n min-width: 0; / prevent flex children from overflowing /\n}\n\n.gramene-sidebar,\n.sorghumbase-sidebar {\n flex: 0 0 250px;\n position: sticky;\n top: 0;\n align-self: flex-start;\n padding-left: 8px;\n padding-right: 8px;\n padding-bottom: 8px;\n}\n\n.gramene-sidebar {\n background-color: #557b74;\n}\n.sorghumbase-sidebar {\n background-color: #a03e34;\n}\n\n/ ── Mobile: stack sidebar above content ────────────────────────────────── /\n@media (max-width: 767px) {\n .search-views-layout {\n flex-direction: column;\n }\n .gramene-sidebar,\n .sorghumbase-sidebar {\n flex: 0 0 auto;\n position: static;\n width: 100%;\n }\n .search-views-content {\n width: 100%;\n }\n}\n.gramene-auth-container,\n.sorghumbase-auth-container,\n.gramene-filter-container,\n.sorghumbase-filter-container {\n}\n.gramene-filter {\n padding-left: 4px;\n padding-right: 4px;\n padding-bottom: 4px;\n background-color: white;\n font-size: 0.875rem; / ~14px — explicit instead of 'small' keyword /\n}\n.gramene-filter span:hover {\n font-weight:bolder;\n}\n.gramene-filter-AND {\n background-color: #ffcd82;\n}\n.gramene-filter-OR {\n background-color: #c5eeb9;\n}\n/ An expansion decorates a node rather than being one, so it tints whatever node\n carries it — leaf or group — the way .gramene-filter-NOT adds a border. /\n.gramene-filter-EXPAND {\n background-color: #c3dcf5;\n}\n.gramene-filter-expansion {\n display: block;\n text-align: center;\n font-style: italic;\n font-size: 0.8rem;\n color: #1c4f80;\n}\n.gramene-filter-NOT {\n border-left-color: #ff5354;\n border-left-style: inset;\n border-left-width: 4px;\n padding-left: 4px;\n}\n.gramene-filter-operation {\n text-align: center;\n font-style: italic;\n}\n.gramene-filter-marked {\n font-weight: bolder;\n /background-color: #feff96;/\n}\n.gramene-filter-menu ul {\n border-top-style: solid;\n border-top-width: 2px;\n padding-left: 0;\n}\n.gramene-filter-menu li {\n display: block;\n cursor: pointer;\n padding: 8px 8px 8px 15px; / vertical padding makes tap targets ~36px+ /\n}\n.gramene-filter-menu li:hover {\n background-color: #feff96;\n}\n/ Group heading for the expansion radios — a label, not a command. /\n.gramene-filter-menu li.gramene-filter-menu-label {\n cursor: default;\n font-weight: bold;\n padding-bottom: 2px;\n}\n.gramene-filter-menu li.gramene-filter-menu-label:hover {\n background-color: transparent;\n}\n.gramene-filter-menu li.gramene-filter-menu-radio {\n padding-top: 4px;\n padding-bottom: 4px;\n padding-left: 25px;\n}\n.gramene-filter-menu li.gramene-filter-menu-radio input {\n margin-right: 6px;\n vertical-align: middle;\n cursor: pointer;\n}\n\n.gramene-view-header {\n width: 100%;\n display: flex;\n flex-wrap: nowrap;\n justify-content: space-evenly;\n font-size: larger;\n font-weight: bold;\n background-color: #fff3a96e;\n border-top: solid;\n border-top-color: #557b74;\n color: #a03e34;\n}\n\n.gramene-view-container {\n}\n.gramene-view {\n padding-left: 0px;\n padding-right: 10px;\n margin-bottom: 0;\n background-color: white;\n}\n.gramene-view-span-on {\n padding-left: 5px;\n cursor: pointer;\n vertical-align: text-bottom;\n color: #a03e34;\n}\n.gramene-view-span-off {\n padding-left: 5px;\n cursor: pointer;\n vertical-align: text-bottom;\n}\n.gramene-view li {\n display: block;\n cursor: pointer;\n padding-left: 5px;\n border-left-style: inset;\n border-left-width: 8px;\n margin-bottom: 2px;\n}\n\n.gramene-view-on {\n border-left-color: #40a0ff;\n font-weight: bold;\n}\n.gramene-view-off {\n border-left-color: #ff6d68;\n}\n.gramene-view-disabled {\n color: darkgray;\n border-left-color: #efefef;\n cursor: default!important;\n}\n#gramene-suggestion button {\n border-radius: .6rem;\n line-height: 1;\n}\n#gramene-suggestion button:focus {\n color: #fff;\n background-color: #6c757d;\n border-color: #6c757d;\n}\n\n/ ── Collapsible sidebar sections ─────────────────────────────────────── /\n.sidebar-section {\n margin-bottom: 4px;\n}\n\n.sidebar-section-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: pointer;\n padding: 2px 4px 2px 6px;\n color: cornsilk;\n user-select: none;\n border-top: 3px solid;\n}\n\n/ Dark background + matching top border per site /\n.gramene-sidebar .sidebar-section-header {\n background-color: #557b74;\n border-top-color: #3d5b55;\n}\n.sorghumbase-sidebar .sidebar-section-header {\n background-color: #a03e34;\n border-top-color: #7a2f27;\n}\n\n.sidebar-section-header:hover {\n background: rgba(255,255,255,0.1);\n}\n.gramene-sidebar .sidebar-section-header:hover {\n background-color: #4a6d66;\n}\n.sorghumbase-sidebar .sidebar-section-header:hover {\n background-color: #8c352d;\n}\n\n.sidebar-section-actions {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n color: cornsilk;\n}\n\n.sidebar-section-toggle {\n font-size: 0.85rem;\n font-weight: bold;\n}\n.sidebar-section-toggle svg {\n stroke: currentColor;\n stroke-width: 2;\n}\n\n.sidebar-section-body {\n background-color: #fff3a9;\n padding: 4px;\n}\n\n/ ── Mobile: compact sidebar when stacked at top ─────────────────────── /\n@media (max-width: 767px) {\n / Tighten sidebar padding /\n .gramene-sidebar,\n .sorghumbase-sidebar {\n padding: 4px 8px;\n }\n\n / Views: display as a compact inline flow /\n .gramene-view {\n display: flex;\n flex-wrap: wrap;\n gap: 2px 8px;\n padding: 2px 4px;\n }\n .gramene-view li {\n display: inline-flex;\n align-items: center;\n padding-left: 4px;\n margin-bottom: 0;\n font-size: 0.8rem;\n border-left-width: 4px;\n }\n\n / View header: smaller /\n .gramene-view-header {\n font-size: small;\n padding: 2px 0;\n }\n\n / Filters: compact /\n .gramene-filter {\n font-size: 0.8rem;\n padding: 2px 4px;\n }\n .gramene-filter-menu li {\n padding: 4px 4px 4px 10px;\n }\n\n / Suggestion buttons: reasonable tap area /\n #gramene-suggestion button {\n padding: 0.35rem 0.6rem;\n margin-bottom: 2px;\n font-size: 0.8rem;\n }\n\n / Prevent iOS zoom-on-focus (requires >= 16px) without forcing extra height /\n #search-input {\n font-size: 1rem;\n }\n}\n\n/ ── Taxonomy modal tree ─────────────────────────────────────────────────── /\n.tax-tree { margin-top: 8px; font-size: 14px; }\n.tax-node { border-radius: 2px; }\n.tax-row { display: flex; align-items: center; gap: 4px; padding: 2px 4px; }\n.tax-chevron { cursor: pointer; width: 14px; display: inline-flex; align-items: center; }\n.tax-chevron-spacer { display: inline-block; width: 14px; }\n.tax-label { }\n.tax-label-internal { font-weight: 600; }\n.tax-sep { color: #888; font-weight: normal; }\n.tax-count { color: #555; font-size: 12px; margin-left: 4px; }\n.tax-self-leaf { margin-left: 8px; font-size: 12px; color: #444; display: inline-flex; align-items: center; gap: 2px; }\n\n.tax-ellipsis { cursor: help; color: #666; }\n.tax-ellipsis-full { display: none; }\n.tax-ellipsis:hover .tax-ellipsis-short { display: none; }\n.tax-ellipsis:hover .tax-ellipsis-full { display: inline; color: #333; }\n\n.tax-search { position: relative; margin: 8px 0; }\n.tax-search-input { width: 100%; padding: 4px 8px; font-size: 14px;\n border: 1px solid #bbb; border-radius: 3px; }\n.tax-search-results { position: absolute; left: 0; right: 0; top: 100%;\n max-height: 280px; overflow-y: auto; z-index: 10;\n background: white; border: 1px solid #bbb;\n border-top: none; border-radius: 0 0 3px 3px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1); }\n.tax-search-hit { padding: 4px 8px; cursor: pointer; font-size: 13px; }\n.tax-search-hit:hover,\n.tax-search-hit-active { background: #e3ecff; }\n.tax-search-name { font-weight: 600; }\n.tax-search-syn { color: #777; font-style: italic; }\n.tax-search-rank { color: #0366d6; font-size: 11px; text-transform: uppercase;\n margin-left: 4px; }\n.tax-search-count { color: #555; font-size: 12px; }\n.tax-search-empty { padding: 6px 8px; color: #777; font-style: italic; font-size: 13px; }\n\n.tax-node-highlight { outline: 2px solid #ffc107;\n animation: taxFlash 1.6s ease-out; }\n@keyframes taxFlash {\n 0% { background-color: #fff3cd; }\n 100% { background-color: transparent; }\n}\n\n\n\n/ Genomic interval form, at the foot of the Filters section. Sits inside the\n sidebar, so it inherits the section body's background rather than setting one. /\n.gramene-interval {\n margin-top: 0.4rem;\n border-top: 1px solid rgba(0, 0, 0, 0.15);\n padding-top: 0.35rem;\n}\n\n.gramene-interval-toggle {\n cursor: pointer;\n font-size: 0.8rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.3rem;\n}\n\n.gramene-interval-form {\n margin-top: 0.4rem;\n}\n\n.gramene-interval-range {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n}\n\n/ Positions are numbers; tabular figures keep the two boxes visually aligned. /\n.gramene-interval-range input {\n font-variant-numeric: tabular-nums;\n}\n\n.gramene-interval-dash {\n opacity: 0.6;\n}\n\n.gramene-interval-error {\n font-size: 0.75rem;\n color: #a03e34;\n margin-top: 0.25rem;\n}\n\n\n/ Inline editor, rendered under the node it edits. Sits on the node's own\n background so it reads as part of that filter rather than a separate panel. /\n.gramene-filter-editor {\n padding: 4px 2px 2px;\n border-top: 1px dashed rgba(0, 0, 0, 0.2);\n margin-top: 2px;\n}\n\n.gramene-interval-actions {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n margin-top: 0.4rem;\n}\n\n/ The submit button spans the form when it stands alone (the add form), and\n shares the row with cancel when editing. /\n.gramene-interval-actions .gramene-interval-submit {\n flex: 1 1 auto;\n margin-top: 0;\n}\n\n.gramene-interval-cancel {\n flex: 0 0 auto;\n padding: 0 0.25rem;\n font-size: 0.75rem;\n}\n",".visible-detail {\n border: 1px solid #557B74;\n padding: 6px 12px;\n}\n.detail {\n margin-right: auto;\n margin-left: auto;\n padding-left: 15px;\n padding-right: 15px;\n}\n.table {\n width: 100%;\n max-width: 100%;\n}\n.xrefs {\n border-collapse: collapse;\n border-spacing: 0;\n border-color: grey;\n table-layout: auto;\n width: 100%;\n}\n/ Col 1 (PubMed link) and col 2 (Curation source): shrink to content /\ntable.xrefs th:nth-child(1),\ntable.xrefs td:nth-child(1),\ntable.xrefs th:nth-child(2),\ntable.xrefs td:nth-child(2) {\n width: 1%;\n white-space: nowrap;\n}\n/ Col 3 (Title/Description): fill remaining space /\ntable.xrefs th:nth-child(3),\ntable.xrefs td:nth-child(3) {\n width: 100%;\n}\n/ Legacy column-width classes — kept for other tables that use them /\n.xref-name-col { white-space: nowrap; }\n.xref-value-col { }\n.xref-80-col { }\n.xref-70-col { }\n.xref-10-col { white-space: nowrap; }\n.xref-id-list {\n padding-left: 0;\n list-style: none;\n}\n.result-gene {\n padding: 0.2em;\n border: 5px solid white;\n}\n.result-gene:hover {\n border-color: antiquewhite;\n}\n.gene-title {\n /padding-top:0.5em;/\n}\n.gene-id {\n /white-space: nowrap;/\n color: black;\n}\n.gene-name {\n color: #557B74;\n margin-bottom: 0;\n}\n.gene-description {\n margin-bottom: 0;\n}\n.gene-species {\n white-space: nowrap;\n font-style: italic;\n font-size:small;\n font-weight: bold;\n}\n.gene-synonyms {\n font-size: small;\n}\n.gene-alt-ids {\n font-size: small;\n color: #6c757d;\n}\n.gene-extras {\n border: dashed 1px blue;\n}\n.gene-panlink {\n float: right;\n margin-left: 0.5rem;\n margin-bottom: 0.25rem;\n}\n.gene-panlink img {\n height: 60px;\n width: auto;\n max-width: 100%;\n vertical-align: top;\n}\n.suggestion-panlink img {\n height: 60px;\n width: auto;\n max-width: 100%;\n}\n@media (max-width: 1200px) {\n .gene-panlink img,\n .suggestion-panlink img {\n height: 30px;\n }\n}\n@media (max-width: 767px) {\n / Allow the ortholog/TAIR box to stack below the gene title on mobile.\n It stays inside .result-gene-summary, so it still appears above .gene-detail-tabs. /\n .result-gene-summary {\n flex-wrap: wrap;\n }\n .result-gene-title-body {\n flex: 1 1 100%;\n }\n .model-ortholog,\n .closest-ortholog,\n .gene-summary-tair {\n flex: 1 1 100%;\n max-width: 100%;\n width: auto;\n margin-left: 0;\n margin-top: 8px;\n }\n / Stack ortholog box contents vertically on narrow screens /\n .model-ortholog,\n .closest-ortholog {\n grid-template-columns: 1fr;\n }\n .model-ortholog h3.gene-id,\n .closest-ortholog h3.gene-id {\n grid-column: 1;\n grid-row: 2;\n }\n .model-ortholog .gene-species,\n .closest-ortholog .gene-species {\n grid-column: 1;\n grid-row: 3;\n text-align: left;\n }\n .model-ortholog .rep-identity,\n .closest-ortholog .rep-identity {\n grid-column: 1;\n grid-row: 4;\n text-align: left;\n }\n .model-ortholog p,\n .closest-ortholog p {\n grid-row: 5;\n }\n / Show descriptions on mobile (no hover available) /\n .model-ortholog p,\n .closest-ortholog p {\n display: block;\n }\n / PanLink: stop floating, display inline next to gene title /\n .gene-panlink {\n float: none;\n display: inline;\n margin-left: 0.25rem;\n margin-bottom: 0;\n vertical-align: middle;\n }\n / Papers table only: hide \"Curation source\" column on small screens /\n table.xrefs-pubs th:nth-child(2),\n table.xrefs-pubs td:nth-child(2) {\n display: none;\n }\n}\n.gene-curation {\n flex-shrink: 0;\n margin-top: 20px;\n border: 1px solid grey;\n}\n.gene-curation span {\n width: 20px;\n display: inline-block;\n color: white;\n text-align: center;\n}\n.gene-curation .okay {\n background-color: #0c00f3;\n}\n.gene-curation .flagged {\n background-color: darkorange;\n}\n.gene-detail-tabs {\n display: flex;\n flex-wrap: wrap;\n width: 100%;\n}\n/ Tab items: 4-per-row by default, overrides Bootstrap col-md-1 (8.33%) /\n.gene-detail-tabs > div {\n flex: 0 0 25%;\n width: 25%;\n max-width: 25%;\n box-sizing: border-box;\n padding: 6px 4px;\n min-height: 36px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n/ From 992px up to the one-row breakpoint below: 5 per row /\n@media (min-width: 992px) {\n .gene-detail-tabs > div {\n flex: 0 0 20%;\n width: 20%;\n max-width: 20%;\n }\n}\n/ At wide viewports, the tabs share one row; a tab never shrinks below its label.\n The breakpoint keeps the widest label clear of the full-screen icon: with 9 tabs\n (sorghum), 9 × (Germplasm 84px + 54px icon clearance) + 266px sidebar ≈ 1510px /\n@media (min-width: 1510px) {\n .gene-detail-tabs > div {\n flex: 1 1 0;\n width: auto;\n max-width: none;\n min-width: max-content;\n }\n}\n.gene-detail-tab-closed {\n color: darkgreen;\n cursor: pointer;\n /background-color: lightgray;/\n}\n.gene-detail-tab-disabled {\n /color: white;/\n /background-color: lightgray;/\n color: lightgray;\n cursor: not-allowed;\n}\n.gene-detail-tab-empty {\n color: darkgreen;\n cursor: pointer;\n font-style: oblique;\n /background-color: lightgray;/\n}\n.gene-detail-tab-empty::before {\n content: \"Add \";\n}\n.gene-detail-tab-expanded {\n color: white;\n background-color: #557B74;\n cursor: pointer;\n}\n/ \"View full screen\" icon on the expanded tab; inverts on hover. The padding\n holds the hover background, so right: 5px keeps the glyph 8px from the edge /\n.gene-detail-tab-fullscreen {\n position: absolute;\n right: 5px;\n top: 50%;\n transform: translateY(-50%);\n box-sizing: content-box;\n padding: 3px;\n border-radius: 3px;\n cursor: pointer;\n}\n.gene-detail-tab-fullscreen:hover {\n color: #557B74;\n background-color: white;\n}\n.result-gene-summary {\n display: flex;\n flex-flow: row nowrap;\n justify-content: flex-start;\n align-items: flex-start;\n}\n.result-gene-summary .species-name {\n white-space: nowrap;\n font-style: italic;\n}\n.result-gene-title-body {\n flex: 1 1 auto;\n max-width: 1036px;\n width: 100%;\n}\n.model-ortholog, .closest-ortholog, .gene-summary-tair {\n cursor: pointer;\n flex: 0 0 auto;\n max-width: 380px;\n width: 380px;\n font-size: smaller;\n margin-top: 10px;\n padding: 0.25rem 0.5rem 0.5rem;\n margin-left: 1rem;\n border: 1px solid darkorange;\n}\n\n/ Ortholog boxes: grid — title row, then gene name left / species+identity right /\n.model-ortholog, .closest-ortholog {\n display: grid;\n grid-template-columns: 1fr auto;\n gap: 0 0.5rem;\n align-items: center;\n}\n\n/ Gene name: left column, smaller font to fit alongside species /\n.model-ortholog h3.gene-id,\n.closest-ortholog h3.gene-id {\n grid-column: 1;\n grid-row: 2;\n margin: 0;\n font-size: 1.5em;\n overflow-wrap: break-word;\n word-break: break-all;\n min-width: 0;\n}\n\n/ Species: right column, top of the pair /\n.model-ortholog .gene-species,\n.closest-ortholog .gene-species {\n grid-column: 2;\n grid-row: 2;\n text-align: right;\n align-self: end;\n}\n\n/ Identity: right column, below species (same row group as gene name) /\n.model-ortholog .rep-identity,\n.closest-ortholog .rep-identity {\n grid-column: 2;\n grid-row: 3;\n text-align: right;\n margin-left: 0;\n padding-right: 0;\n padding-top: 0;\n align-self: start;\n}\n\n/ Description: hidden by default; show on hover/focus /\n.model-ortholog p,\n.closest-ortholog p {\n grid-column: 1 / -1;\n grid-row: 4;\n display: none;\n margin: 0.25rem 0 0;\n}\n.model-ortholog:hover p,\n.model-ortholog:focus p,\n.closest-ortholog:hover p,\n.closest-ortholog:focus p {\n display: block;\n}\n\n.model-ortholog {\n border: 1px dotted darkorange;\n}\n.closest-ortholog {\n border: 1px dotted darkgreen;\n}\n\n.gene-summary-tair {\n border: 1px dotted darkblue;\n}\n.gene-summary-tair .rest {\n display: none;\n}\n\n.gene-summary-tair:hover .rest {\n display: inline;\n}\n.gene-summary-tair:focus .rest {\n display: inline;\n}\n.gene-summary-tair:hover .ellipsis {\n display: none;\n}\n.gene-summary-tair:focus .ellipsis {\n display: none;\n}\n\n/ this is the \"title\" of the closest ortholog box /\n.closest-ortholog::before,\n.model-ortholog::before,\n.gene-summary-tair::before {\n display: block;\n grid-column: 1 / -1;\n grid-row: 1;\n text-align: center;\n border: dotted 1px;\n padding: 0 0.5rem;\n margin: -0.25rem -0.5rem 0.25rem; / bleed to box edges /\n background: #fff;\n}\n\n.model-ortholog::before {\n content: \"Model Species Homolog\";\n color: orange;\n}\n.closest-ortholog::before {\n content: \"Closest Annotated Homolog\";\n color: darkgreen;\n}\n\n/ this is the \"title\" of the closest ortholog box /\n.gene-summary-tair::before {\n content: \"TAIR Curated Description\";\n color: darkblue;\n}\n\n.rep-identity {\n margin-left: auto;\n padding-right: 10px;\n padding-top: 5px;\n font-style: italic;\n}\n.rep-identity::after {\n content: \"% identity\";\n}\n.eFP::before {\n content: url(\"../../static/images/BAR-logo.png\");\n padding-right:5px;\n position: relative;\n top: 5px;\n}\n.eFP::after {\n content: 'New!';\n color: red;\n padding-left:2px;\n font-weight: bold;\n font-style: italic;\n font-size: x-small;\n line-height: normal;\n vertical-align: super;\n}\n.gxa::before {\n content: url(\"../../static/images/expression-atlas-logo.png\");\n padding-right:5px;\n position: relative;\n top: 5px;\n}\n.gene-search-pic-sugg {\n width: 100%;\n height: 200px;\n background: url(\"../../static/images/suggestions.png\");\n background-size: contain;\n background-repeat: no-repeat;\n}\n.gene-search-pic-results {\n width: 100%;\n height: 200px;\n background: url(\"../../static/images/results.png\");\n background-size: contain;\n background-repeat: no-repeat;\n}\n.gene-search-pic-genetree {\n width: 100%;\n height: 200px;\n background: url(\"../../static/images/genetree.png\");\n background-size: contain;\n background-repeat: no-repeat;\n}\n\n/ tbrowse portals its tooltips/popups to document.body; without an\n explicit z-index they render behind the bootstrap modal (z-index\n ~1050) when a detail panel is in fullscreen mode. /\n.tbrowse-root,\n.tbrowse-tooltip,\n.tbrowse-fieldpicker,\n.tbrowse-msa-mask-panel {\n z-index: 1100 !important;\n}\n",null,null,"/ ===== Pathways layout ===== /\n\n.pathways-layout {\n display: flex;\n align-items: stretch;\n}\n\n.pathways-tree-toggle {\n flex: 0 0 auto;\n width: 24px;\n border: 1px solid #ccc;\n border-right: none;\n background: #f5f5f5;\n cursor: pointer;\n font-size: 12px;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n color: #666;\n border-radius: 4px 0 0 4px;\n}\n.pathways-tree-toggle:hover {\n background: #e0e0e0;\n color: #333;\n}\n\n.pathways-tree-panel {\n flex: 0 0 250px;\n width: 250px;\n height: 100%;\n overflow-y: auto;\n overflow-x: hidden;\n border: 1px solid #ccc;\n border-right: none;\n}\n\n.pathways-diagram-panel {\n flex: 1 1 auto;\n min-width: 0;\n}\n\n.pathways-resize-handle,\n.details-resize-handle {\n height: 6px;\n background: #e0e0e0;\n border: 1px solid #ccc;\n border-top: none;\n cursor: ns-resize;\n transition: background 0.15s;\n}\n.pathways-resize-handle:hover,\n.details-resize-handle:hover {\n background: #179ed3;\n}\n\n/ ===== Compact tree items (react-simple-tree-menu overrides) ===== /\n\n.pathways-tree-panel .rstm-tree-item-group {\n border-top: none;\n}\n\n.pathways-tree-panel .rstm-tree-item {\n padding: 0.2rem 0.4rem;\n font-size: 0.8rem;\n line-height: 1.3;\n border-bottom: 1px solid #eee;\n}\n/ Override inline padding-left set by react-simple-tree-menu.\n The library uses: 0.75 + iconSize(hasNodes?0:1) + level1.75 rem\n We shrink the per-level indent from 1.75rem to 0.75rem /\n.pathways-tree-panel .rstm-tree-item-level0 { padding-left: 0.4rem !important; }\n.pathways-tree-panel .rstm-tree-item-level0 > .rstm-toggle-icon { margin-left: 0; }\n.pathways-tree-panel .rstm-tree-item-level1 { padding-left: 1.15rem !important; }\n.pathways-tree-panel .rstm-tree-item-level2 { padding-left: 1.9rem !important; }\n.pathways-tree-panel .rstm-tree-item-level3 { padding-left: 2.65rem !important; }\n.pathways-tree-panel .rstm-tree-item-level4 { padding-left: 3.4rem !important; }\n.pathways-tree-panel .rstm-tree-item-level5 { padding-left: 4.15rem !important; }\n.pathways-tree-panel .rstm-tree-item-level6 { padding-left: 4.9rem !important; }\n.pathways-tree-panel .rstm-tree-item-level7 { padding-left: 5.65rem !important; }\n\n.pathways-tree-panel .rstm-tree-item--active {\n color: white;\n background: #179ed3;\n border-bottom-color: #127aa8;\n}\n\n.pathways-tree-panel .rstm-toggle-icon-symbol {\n width: 1rem;\n height: 1rem;\n line-height: 1rem;\n font-size: 0.7rem;\n}\n\n/ ===== Legacy tree-view classes ===== /\n\n.tree-view-root {}\n\n.tree-view-node {\n margin-left: 8px;\n}\n\n.tree-view-node-collapse-toggle.collapse-spacer {\n width: 12px;\n display: inline-block;\n}\n\n.tree-view-node-collapse-toggle {\n margin-right: 2px;\n width: 12px;\n}\n\n.tree-view-node-label {\n font-size: smaller;\n margin-left: 2px;\n padding: 1px;\n border: 1px solid #fff;\n}\n\n.tree-view-node-label.selected {\n border: 1px solid #003f81;\n border-radius: 3px;\n background-color: #808080;\n}\n\n.tree-view-node-checkbox {}\n.tree-view-node-children {}\n\n\n.pathways-tree-empty {\n padding: 0.6rem;\n font-size: 0.8rem;\n line-height: 1.3;\n color: #666;\n}\n",null,".button-like-link {\n display: inline-block;\n padding: 0;\n background-color: #fff0;\n color: #007bff;\n text-decoration: underline;\n border: none;\n cursor: pointer;\n}\n","/ styles.css /\n.fasta-container {\n position: relative;\n padding: 2ch;\n background-color: #fcfffd;\n border-color: #557b74;\n border-style: dashed;\n line-height: 0.925em;\n /margin: auto; !* Center the container !/\n}\n.styled-span {\n display: flex;\n align-items: center;\n text-align: center;\n}\n.vertical-line {\n flex-grow: 1;\n height: 20px;\n background-color: black;\n}\n.horizontal-line {\n width: 60px;\n min-width: 15px;\n height: 3px;\n background-color: black;\n margin: 0;\n}\ncode.fasta {\n white-space: pre-wrap;\n color: #595959;\n}\n.header {\n color: black;\n}\n.upstream {\n color: #80a0a0;\n}\n.downstream {\n color: #80a0a0;\n}\n.intron {\n color: #aaaaaa;\n}\n.utr5 {\n background-color: #aaccaf;\n}\n.utr5-other {\n background-color: #cfe1d2;\n}\n.cds {\n background-color: #a7b4d3;\n}\n.cds-other {\n background-color: #d0d8e6;\n}\n.utr3 {\n background-color: #c5a3bf;\n}\n.utr3-other {\n background-color: #dcc9d9;\n}\n.square-utr5 {\n width: 20px;\n height: 20px;\n background: linear-gradient(to bottom right, #aaccaf 0%, #aaccaf 50%, #cfe1d2 50%, #cfe1d2 100%);\n}\n.square-cds {\n width: 20px;\n height: 20px;\n background: linear-gradient(to bottom right, #a7b4d3 0%, #a7b4d3 50%, #d0d8e6 50%, #d0d8e6 100%);\n}\n.square-utr3 {\n width: 20px;\n height: 20px;\n background: linear-gradient(to bottom right, #c5a3bf 0%, #c5a3bf 50%, #dcc9d9 50%, #dcc9d9 100%);\n}\n\n.flanking-guide {\n display: grid;\n grid-template-columns: auto 60px auto 60px auto;\n align-items: center;\n row-gap: 2px;\n column-gap: 0;\n width: fit-content;\n}\n/* Row 1 /\n.flanking-label-left {\n text-align: right;\n padding-right: 0.5rem;\n}\n.flanking-center-label {\n text-align: center;\n white-space: nowrap;\n padding: 0 0.25rem;\n}\n.flanking-guide > .horizontal-line {\n height: 3px;\n background-color: black;\n align-self: center;\n}\n.flanking-label-right {\n text-align: left;\n padding-left: 0.5rem;\n}\n/ Row 2 /\n.flanking-value-left {\n text-align: right;\n min-width: 5ch;\n padding-right: 0.5rem;\n}\n.flanking-value-right {\n text-align: left;\n min-width: 5ch;\n padding-left: 0.5rem;\n}\n\n.reverse-slide {\n direction: rtl;\n}\n.fasta-key {\n position: absolute;\n top: 9px;\n right: 40px;\n background: none;\n border: none;\n cursor: default;\n font-family: monospace;\n font-size: 11pt;\n color: #555;\n}\n.copy-button {\n position: absolute;\n top: 3px;\n right: -5px;\n background: none;\n border: none;\n cursor: pointer;\n font-size: 1.5rem;\n color: #555;\n}\n.notification {\n position: absolute;\n top: 0;\n right: 0;\n background-color: #050505;\n color: #fff;\n padding: 5px;\n z-index: 999;\n font-weight: bold;\n font-style: italic;\n font-size: smaller;\n}\n",null,".accordion-button {\n padding:0.4rem!important;\n}\n.accordion-button:hover {\n background-color: #dbe8f3;\n}","/ Gene-list identifier resolver. Bucket chrome follows facets/styles.css so the\n three buckets read the same way as the Refine sidebar's facet groups. /\n\n.glr {\n margin-top: 0.75rem;\n}\n\n.glr-bucket {\n border: 1px solid #dee2e6;\n border-radius: 4px;\n margin-bottom: 0.5rem;\n}\n\n.glr-bucket-header {\n display: flex;\n align-items: center;\n gap: 0.4rem;\n padding: 0.35rem 0.5rem;\n cursor: pointer;\n background: #f8f9fa;\n border-radius: 4px 4px 0 0;\n}\n\n.glr-bucket-title {\n font-weight: 600;\n font-size: 0.9rem;\n}\n\n.glr-bucket-count {\n font-size: 0.75rem;\n color: #666;\n background: #fff;\n padding: 0 0.4rem;\n border-radius: 10px;\n border: 1px solid #ddd;\n font-variant-numeric: tabular-nums;\n}\n\n/ Pushed right, and clicks inside must not toggle the bucket (see bulk()). /\n.glr-bucket-actions {\n margin-left: auto;\n}\n\n.glr-bucket-body {\n padding: 0.5rem;\n max-height: 420px;\n overflow-y: auto;\n}\n\n/ Tone is carried by the header edge only — enough to distinguish the three\n buckets at a glance without colouring the whole panel. /\n.glr-bucket-warn .glr-bucket-header { border-left: 4px solid #f0ad4e; }\n.glr-bucket-ok .glr-bucket-header { border-left: 4px solid #5cb85c; }\n.glr-bucket-bad .glr-bucket-header { border-left: 4px solid #d9534f; }\n\n.glr-hint {\n font-size: 0.8rem;\n color: #555;\n margin-bottom: 0.5rem;\n}\n\n.glr-search {\n margin-bottom: 0.5rem;\n}\n\n.glr-row {\n display: flex;\n gap: 0.75rem;\n padding: 0.35rem 0;\n border-top: 1px solid #f0f0f0;\n}\n\n.glr-input {\n flex: 0 0 190px;\n font-family: monospace;\n font-size: 0.8rem;\n word-break: break-all;\n}\n\n.glr-input-count {\n margin-left: 0.35rem;\n font-variant-numeric: tabular-nums;\n}\n\n.glr-candidates {\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.glr-candidate {\n display: flex;\n align-items: baseline;\n gap: 0.4rem;\n font-size: 0.8rem;\n padding: 1px 4px;\n border-radius: 3px;\n opacity: 0.55;\n cursor: pointer;\n margin-bottom: 0;\n}\n\n.glr-candidate-kept {\n opacity: 1;\n background: #eef6ff;\n}\n\n.glr-candidate-id {\n font-family: monospace;\n flex: 0 0 auto;\n}\n\n.glr-candidate-species {\n font-style: italic;\n color: #446;\n flex: 0 0 auto;\n}\n\n/ Descriptions vary wildly in length; keep rows one line tall. /\n.glr-candidate-desc {\n color: #777;\n flex: 1 1 auto;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.glr-only {\n border: none;\n background: none;\n color: #a03e34;\n text-decoration: underline;\n font-size: 0.75rem;\n padding: 0 2px;\n flex: 0 0 auto;\n}\n\n.glr-more {\n border: none;\n background: none;\n color: #a03e34;\n text-decoration: underline;\n font-size: 0.8rem;\n padding: 4px 0 0 0;\n}\n\n.glr-resolved-row {\n display: flex;\n gap: 0.4rem;\n font-family: monospace;\n font-size: 0.8rem;\n padding: 1px 0;\n}\n\n.glr-arrow { color: #999; }\n.glr-resolved-id { color: #446; }\n\n.glr-unknown {\n font-size: 0.8rem;\n max-height: 200px;\n overflow: auto;\n margin-bottom: 0;\n}\n\n/ The count of what will actually be saved. Deliberately prominent: with\n include-all-by-default a single ambiguous id can add 15 genes. /\n.glr-summary {\n margin-top: 0.75rem;\n padding: 0.5rem 0.75rem;\n border: 1px solid #cfe3f7;\n background: #eef6ff;\n border-radius: 4px;\n font-size: 0.9rem;\n}\n\n.glr-summary-total {\n font-size: 1.1rem;\n font-weight: 600;\n}\n\n.glr-summary-detail {\n color: #555;\n font-size: 0.8rem;\n}\n\n/ Per-genome bulk actions. A plain \"prefer sorghum\" is useless on this index —\n ~94 of its genomes are sorghum accessions, so a conflict can be sorghum on both\n sides. Only genomes that would actually narrow a row are offered. /\n.glr-genomes {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 0.3rem;\n margin-bottom: 0.5rem;\n}\n\n.glr-genomes-label { margin: 0 0.2rem 0 0; }\n\n.glr-genome-btn { font-size: 0.75rem; padding: 0.1rem 0.4rem; }\n\n.glr-genome-count { margin-left: 0.3rem; font-weight: normal; }\n\n.glr-row-toggle {\n border: none;\n background: none;\n padding: 0 2px 0 0;\n color: #666;\n}\n\n.glr-row-bulk { margin-top: 2px; }\n\n.glr-collapsed { font-size: 0.8rem; color: #777; }\n\n.glr-muted { color: #bbb; }\n",".exporter-view {\n display: grid;\n grid-template-columns: 1fr 8px 1fr;\n gap: 0;\n padding: 0.75rem;\n min-height: 400px;\n}\n\n.exporter-view > .exporter-pane:first-child {\n margin-right: 0.5rem;\n}\n\n.exporter-view > .exporter-pane.exporter-right-pane {\n margin-left: 0.5rem;\n}\n\n.exporter-divider {\n cursor: col-resize;\n background: transparent;\n position: relative;\n align-self: stretch;\n}\n\n.exporter-divider::before {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n width: 2px;\n background: #d0d4da;\n border-radius: 1px;\n transition: background 0.15s;\n}\n\n.exporter-divider:hover::before,\n.exporter-divider.dragging::before {\n background: #7a8aa0;\n width: 3px;\n}\n\n.exporter-pane {\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n background: #fff;\n display: flex;\n flex-direction: column;\n max-height: 70vh;\n overflow: hidden;\n}\n\n.exporter-pane-header {\n padding: 0.5rem 0.75rem;\n border-bottom: 1px solid #e0e0e0;\n background: #f8f9fa;\n font-size: 0.9rem;\n}\n\n.exporter-pane-header-row {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.exporter-field-search-inline {\n margin-left: auto;\n margin-bottom: 0;\n max-width: 220px;\n height: 1.75rem;\n font-size: 0.85rem;\n padding: 0.15rem 0.5rem;\n}\n\n.exporter-pane-body {\n flex: 1;\n overflow-y: auto;\n padding: 0.5rem;\n}\n\n.exporter-panel-empty {\n padding: 1rem;\n color: #888;\n text-align: center;\n font-size: 0.9rem;\n}\n\n/ --- FieldTree --- /\n\n.exporter-field-tree {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.exporter-field-search {\n margin-bottom: 0.5rem;\n font-size: 0.9rem;\n}\n\n.exporter-field-tree-body {\n flex: 1;\n overflow-y: auto;\n}\n\n.exporter-group {\n margin-bottom: 0.25rem;\n}\n\n.exporter-group-header {\n cursor: pointer;\n padding: 0.25rem 0.5rem;\n background: #eef1f4;\n border-radius: 3px;\n display: flex;\n align-items: center;\n gap: 0.4rem;\n user-select: none;\n font-size: 0.9rem;\n}\n\n.exporter-group-header:hover {\n background: #e3e7ec;\n}\n\n.exporter-group-chevron {\n display: inline-flex;\n align-items: center;\n color: #666;\n}\n\n.exporter-group-count {\n font-size: 0.75rem;\n color: #666;\n background: #fff;\n padding: 0 0.4rem;\n border-radius: 10px;\n border: 1px solid #ddd;\n}\n\n.exporter-group-actions {\n margin-left: auto;\n display: inline-flex;\n gap: 0.25rem;\n}\n\n.exporter-group-action {\n font-size: 0.7rem;\n padding: 0.05rem 0.4rem;\n background: #fff;\n border: 1px solid #ccc;\n border-radius: 3px;\n color: #333;\n cursor: pointer;\n line-height: 1.4;\n}\n\n.exporter-group-action:hover:not(:disabled) {\n background: #f0f4f8;\n border-color: #88a;\n}\n\n.exporter-group-action:disabled {\n opacity: 0.4;\n cursor: default;\n}\n\n.exporter-group-fields {\n list-style: none;\n margin: 0.25rem 0 0.5rem 1.25rem;\n padding: 0;\n}\n\n.exporter-group-fields li {\n padding: 0.1rem 0.25rem;\n font-size: 0.85rem;\n}\n\n.exporter-group-fields label {\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 0.35rem;\n margin: 0;\n padding: 0.1rem 0.25rem;\n border-radius: 2px;\n width: 100%;\n}\n\n.exporter-group-fields label:hover {\n background: #f0f4f8;\n}\n\n.exporter-field-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exporter-field-badge {\n font-size: 0.7rem;\n color: #888;\n font-family: monospace;\n}\n\n.exporter-group-truncated {\n color: #888;\n font-size: 0.8rem;\n padding-left: 0.5rem;\n}\n\n/ --- SelectedFields --- /\n\n.exporter-selected {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.exporter-selected-header {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.25rem 0;\n margin-bottom: 0.5rem;\n border-bottom: 1px solid #eee;\n}\n\n.exporter-selected-count {\n font-size: 0.75rem;\n color: #666;\n background: #eef1f4;\n padding: 0 0.5rem;\n border-radius: 10px;\n}\n\n.exporter-clear-btn {\n margin-left: auto;\n font-size: 0.8rem;\n padding: 0;\n}\n\n.exporter-selected-list {\n list-style: none;\n margin: 0;\n padding: 0;\n overflow-y: auto;\n flex: 1;\n}\n\n.exporter-selected-list li {\n display: flex;\n align-items: center;\n gap: 0.4rem;\n padding: 0.25rem 0.35rem;\n border-bottom: 1px solid #f0f0f0;\n font-size: 0.85rem;\n}\n\n.exporter-selected-index {\n font-family: monospace;\n color: #888;\n min-width: 1.75rem;\n}\n\n.exporter-selected-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exporter-selected-group {\n color: #888;\n}\n\n.exporter-selected-actions {\n display: flex;\n gap: 0.15rem;\n}\n\n.exporter-selected-actions button {\n padding: 0.1rem 0.35rem;\n line-height: 1;\n}\n\n/ --- Right pane (selected + preview) --- /\n\n.exporter-right-pane {\n max-height: 70vh;\n}\n\n.exporter-right-split {\n display: flex;\n flex-direction: column;\n flex: 1;\n overflow: hidden;\n}\n\n.exporter-selected-section {\n flex: 0 0 auto;\n max-height: 35%;\n overflow-y: auto;\n padding: 0.5rem;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.exporter-preview-section {\n flex: 1;\n overflow: hidden;\n padding: 0.5rem;\n display: flex;\n flex-direction: column;\n}\n\n/ --- Preview --- /\n\n.exporter-preview {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.exporter-preview-toolbar {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n padding-bottom: 0.35rem;\n margin-bottom: 0.35rem;\n border-bottom: 1px solid #eee;\n font-size: 0.85rem;\n}\n\n.exporter-preview-format label {\n margin-right: 0.5rem;\n cursor: pointer;\n}\n\n.exporter-preview-format input {\n margin-right: 0.25rem;\n}\n\n.exporter-preview-status {\n margin-left: auto;\n color: #888;\n}\n\n.exporter-cutoffs-btn {\n display: inline-flex;\n align-items: center;\n gap: 0.25rem;\n padding: 0.1rem 0.5rem;\n font-size: 0.8rem;\n}\n\n.exporter-modal-backdrop {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.35);\n z-index: 1050;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.exporter-modal {\n background: #fff;\n border-radius: 6px;\n box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);\n width: min(420px, 90vw);\n display: flex;\n flex-direction: column;\n}\n\n.exporter-modal-header {\n display: flex;\n align-items: center;\n padding: 0.6rem 0.9rem;\n border-bottom: 1px solid #eee;\n}\n\n.exporter-modal-close {\n margin-left: auto;\n background: transparent;\n border: 0;\n font-size: 1.25rem;\n line-height: 1;\n color: #666;\n cursor: pointer;\n padding: 0 0.25rem;\n}\n\n.exporter-modal-body {\n padding: 0.9rem;\n display: flex;\n flex-direction: column;\n gap: 0.85rem;\n}\n\n.exporter-modal-field label {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n font-size: 0.85rem;\n font-weight: 500;\n}\n\n.exporter-modal-field input {\n font: inherit;\n padding: 0.25rem 0.5rem;\n border: 1px solid #c0c4ca;\n border-radius: 3px;\n}\n\n.exporter-modal-field small {\n color: #777;\n font-size: 0.75rem;\n margin-top: 0.15rem;\n}\n\n.exporter-modal-footer {\n display: flex;\n justify-content: flex-end;\n gap: 0.5rem;\n padding: 0.6rem 0.9rem;\n border-top: 1px solid #eee;\n}\n\n.exporter-preview-status.error {\n color: #c33;\n}\n\n.exporter-preview-body {\n flex: 1;\n overflow: auto;\n background: #fafbfc;\n border: 1px solid #eee;\n border-radius: 3px;\n}\n\n.exporter-preview-empty {\n padding: 1rem;\n color: #888;\n text-align: center;\n}\n\n.exporter-preview-tsv-scroll {\n overflow: auto;\n max-width: 100%;\n}\n\n.exporter-preview-tsv {\n border-collapse: collapse;\n font-size: 0.8rem;\n font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n width: auto;\n}\n\n.exporter-preview-tsv th,\n.exporter-preview-tsv td {\n padding: 0.2rem 0.5rem;\n border: 1px solid #e5e7ea;\n max-width: 420px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exporter-preview-tsv th {\n position: relative;\n}\n\n.exporter-preview-col-resizer {\n position: absolute;\n top: 0;\n right: -3px;\n width: 6px;\n height: 100%;\n cursor: col-resize;\n user-select: none;\n z-index: 2;\n}\n\n.exporter-preview-col-resizer::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n width: 1px;\n background: transparent;\n transition: background 0.15s;\n}\n\n.exporter-preview-col-resizer:hover::after,\n.exporter-preview-col-resizer:active::after {\n background: #7a8aa0;\n width: 2px;\n}\n\n.exporter-preview-tsv th {\n background: #f0f3f6;\n text-align: left;\n position: sticky;\n top: 0;\n z-index: 1;\n padding: 0.15rem 0.25rem;\n}\n\n.exporter-preview-th-inner {\n display: flex;\n align-items: center;\n gap: 0.15rem;\n min-width: 0;\n}\n\n.exporter-preview-th-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exporter-preview-reorder-btn {\n flex: 0 0 auto;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 3px;\n padding: 0;\n line-height: 1;\n color: #555;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n}\n\n.exporter-preview-reorder-btn:hover:not(:disabled) {\n background: #fff;\n border-color: #bbb;\n color: #111;\n}\n\n.exporter-preview-reorder-btn:disabled {\n opacity: 0.25;\n cursor: default;\n}\n\n.exporter-preview-fields-count {\n color: #666;\n display: inline-flex;\n align-items: center;\n gap: 0.35rem;\n}\n\n.exporter-preview-tsv tr:hover td {\n background: #f4f7fa;\n}\n\n.exporter-preview-empty-row {\n text-align: center;\n color: #888;\n padding: 1rem !important;\n}\n\n.exporter-preview-json {\n margin: 0;\n padding: 0.5rem;\n font-size: 0.75rem;\n line-height: 1.4;\n}\n\n/ --- Export footer --- /\n\n.exporter-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 0.75rem;\n padding: 0.5rem 0.75rem;\n border-top: 1px solid #e0e0e0;\n background: #f8f9fa;\n flex: 0 0 auto;\n}\n\n.exporter-footer-summary {\n color: #555;\n}\n",".exprviz-view {\n padding: 0.5rem;\n}\n\n.exprviz-tabs {\n margin-bottom: 0.5rem;\n}\n\n.exprviz-tab-panel {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n padding: 0.5rem 0;\n / Constrain children so the grid scrolls internally instead of bleeding\n * out and forcing the page to scroll horizontally. /\n min-width: 0;\n overflow: hidden;\n}\n\n.exprviz-toolbar {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n/ Host applications (e.g. sorghum-webapp) sometimes ship global stylesheets\n * that override `.btn` / `.btn-sm` with `!important` — fat padding, custom\n * font-weight, transformed text — which leaves our toolbar buttons at\n * inconsistent sizes (since plain `<Button>` and `<ToggleButton>` inside a\n * `<ToggleButtonGroup>` pick up different rules). Re-state Bootstrap 5's\n * small-button metrics here with higher specificity and `!important`, scoped\n * to `.exprviz-toolbar`, so the toolbar always looks the same regardless of\n * what the host's theme does. /\n.exprviz-toolbar .btn,\n.exprviz-toolbar .btn.btn-sm,\n.exprviz-toolbar .btn-group > .btn,\n.exprviz-toolbar .btn-group > .btn.btn-sm,\n.exprviz-toolbar .btn-group-sm > .btn,\n.exprviz-toolbar label.btn {\n padding: 0.25rem 0.5rem !important;\n font-size: 0.875rem !important;\n line-height: 1.5 !important;\n font-weight: 400 !important;\n text-transform: none !important;\n letter-spacing: normal !important;\n height: auto !important;\n min-height: 0 !important;\n border-radius: 0.2rem !important;\n}\n\n/ Restore the squared-off inner edges within a ToggleButtonGroup. /\n.exprviz-toolbar .btn-group > .btn:not(:first-child):not(:last-child),\n.exprviz-toolbar .btn-group > .btn:not(:first-child):not(:last-child).btn-sm {\n border-radius: 0 !important;\n}\n.exprviz-toolbar .btn-group > .btn:first-child:not(:last-child),\n.exprviz-toolbar .btn-group > .btn:first-child:not(:last-child).btn-sm {\n border-top-right-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n}\n.exprviz-toolbar .btn-group > .btn:last-child:not(:first-child),\n.exprviz-toolbar .btn-group > .btn:last-child:not(:first-child).btn-sm {\n border-top-left-radius: 0 !important;\n border-bottom-left-radius: 0 !important;\n}\n\n.exprviz-toolbar .btn-group {\n vertical-align: middle;\n}\n\n/ Same idea for the status text — host stylesheets sometimes restyle\n * <span>s in unexpected ways. /\n.exprviz-toolbar .exprviz-status {\n font-weight: 400 !important;\n text-transform: none !important;\n letter-spacing: normal !important;\n}\n\n.exprviz-status {\n color: #666;\n font-size: 0.85rem;\n margin-left: 0.5rem;\n}\n\n.exprviz-warning {\n color: #b06000;\n background: #fff8e0;\n border: 1px solid #f0d080;\n border-radius: 3px;\n padding: 2px 6px;\n font-size: 0.8rem;\n cursor: help;\n}\n\n.exprviz-body {\n display: flex;\n flex-direction: column;\n min-width: 0;\n overflow: hidden;\n}\n\n.exprviz-plot {\n border: 1px solid #ddd;\n background: #fff;\n min-height: 120px;\n overflow: hidden;\n}\n\n.exprviz-resizer {\n height: 8px;\n margin: 2px 0;\n background: #f0f0f0;\n border-top: 1px solid #ddd;\n border-bottom: 1px solid #ddd;\n cursor: row-resize;\n flex: none;\n}\n\n.exprviz-resizer::before {\n content: '';\n display: block;\n width: 36px;\n height: 2px;\n background: #aaa;\n border-radius: 1px;\n margin: 3px auto;\n}\n\n.exprviz-resizer:hover,\n.exprviz-resizer:active {\n background: #e0e8f5;\n}\n\n.exprviz-resizer:hover::before,\n.exprviz-resizer:active::before {\n background: #2a6ebb;\n}\n\n.exprviz-pc-container {\n width: 100%;\n height: 100%;\n}\n\n.exprviz-pc-container svg {\n display: block;\n}\n\n.exprviz-pc-lines path {\n fill: none;\n stroke: steelblue;\n}\n\n.exprviz-pc-line-in {\n stroke-opacity: 0.4;\n}\n\n.exprviz-pc-line-out {\n stroke-opacity: 0.04;\n}\n\n.exprviz-pc-lines path:not(.exprviz-pc-line-in):not(.exprviz-pc-line-out) {\n stroke-opacity: 0.25;\n}\n\n.exprviz-pc-lines path.exprviz-pc-line-hover {\n stroke: #d62728;\n stroke-opacity: 1;\n stroke-width: 2;\n}\n\n.exprviz-pc-axis-dragging .domain,\n.exprviz-pc-axis-dragging .tick line {\n stroke: #555;\n}\n\n.exprviz-pc-axis-dragging .exprviz-pc-axis-label {\n font-weight: bold;\n}\n\n.exprviz-plot-empty,\n.exprviz-table-empty {\n padding: 1rem;\n color: #888;\n}\n\n.exprviz-pc-tooltip {\n position: fixed;\n z-index: 1000;\n background: #fff;\n border: 1px solid #bbb;\n border-radius: 3px;\n box-shadow: 0 2px 6px rgba(0,0,0,0.15);\n padding: 6px 8px;\n font-size: 0.78rem;\n line-height: 1.35;\n max-width: 360px;\n pointer-events: none;\n color: #222;\n}\n\n.exprviz-pc-tip-section {\n margin-top: 4px;\n font-size: 0.72rem;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #888;\n}\n\n.exprviz-pc-tip-row {\n margin-left: 0.4rem;\n}\n\n.exprviz-pc-tip-key {\n font-weight: 600;\n}\n\n/ ---- heatmap ---- /\n\n.exprviz-hm-container {\n width: 100%;\n height: 100%;\n position: relative;\n / Horizontal scroll lives on the outer container so the sticky-positioned\n * column header and the cell body translate together — column labels\n * always stay aligned with the cells beneath them. /\n overflow-x: auto;\n}\n\n.exprviz-hm-inner {\n display: flex;\n flex-direction: column;\n height: 100%;\n min-width: 100%;\n}\n\n.exprviz-hm-container svg {\n display: block;\n}\n\n.exprviz-hm-header {\n flex: 0 0 auto;\n background: #fff;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.exprviz-hm-body {\n flex: 1 1 auto;\n overflow-y: auto;\n overflow-x: hidden;\n min-height: 0;\n}\n\n.exprviz-hm-collabel {\n fill: #222;\n}\n\n.exprviz-hm-rowlabels text {\n fill: #444;\n}\n\n.exprviz-hm-cells rect {\n shape-rendering: crispEdges;\n cursor: crosshair;\n}\n\n.exprviz-hm-legend {\n position: absolute;\n top: 6px;\n right: 6px;\n display: flex;\n gap: 6px;\n background: rgba(255, 255, 255, 0.92);\n border: 1px solid #d0d7de;\n border-radius: 3px;\n padding: 3px 6px;\n font-size: 0.72rem;\n line-height: 1.1;\n pointer-events: auto;\n z-index: 2;\n}\n\n.exprviz-hm-legend-bin {\n display: flex;\n align-items: center;\n gap: 3px;\n}\n\n.exprviz-hm-legend-swatch {\n display: inline-block;\n width: 14px;\n height: 14px;\n border: 1px solid rgba(0, 0, 0, 0.15);\n}\n\n.exprviz-hm-legend-label {\n color: #333;\n font-variant-numeric: tabular-nums;\n}\n\n.exprviz-table {\n height: 480px;\n min-width: 0;\n overflow: hidden;\n}\n\n.exprviz-aggrid {\n width: 100%;\n height: 100%;\n / Block the browser's edge-of-scroll back/forward gesture when the user\n * scrolls all the way left or right inside the grid. /\n overscroll-behavior-x: contain;\n}\n\n/ ag-grid's scrolling viewports — make sure the back/forward gesture is\n * contained at every level, not just on our outer wrapper. /\n.exprviz-aggrid .ag-body-viewport,\n.exprviz-aggrid .ag-body-horizontal-scroll-viewport,\n.exprviz-aggrid .ag-center-cols-viewport {\n overscroll-behavior-x: contain;\n}\n\n/ Group-header rows: subtle tinting so each metadata level reads as a band.\n * The :first-of-type column-group rule covers the topmost (study) row. /\n.exprviz-aggrid .ag-header-group-cell {\n font-size: 0.78rem;\n border-right: 1px solid #e0e0e0;\n}\n\n.exprviz-aggrid .ag-header-group-cell-label {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 0 6px;\n}\n\n.exprviz-aggrid .exprviz-hg-factors {\n background: #eef6ff;\n color: #1e3a5f;\n}\n\n.exprviz-aggrid .exprviz-hg-chars {\n background: #f5f5f0;\n color: #4a4a30;\n}\n\n.exprviz-aggrid .exprviz-hg-collapsed {\n font-style: italic;\n color: #666;\n}\n\n/ The label cells stacked above the Gene ID and Name columns — Study/Title,\n * every Factor/<factor type> row, every Characteristic/<char type> row,\n * and the collapsed-section placeholders — are rendered via the\n * LabelHeaderGroup / ToggleHeaderGroup React components. Both render a\n * full-width div that right-aligns its content, so the alignment is\n * baked into the component DOM and doesn't depend on overriding\n * ag-grid's internal CSS. The leaf cells (\"Gene ID\" / \"Name\") are not\n * wrapped in these components and keep ag-grid's default left alignment. /\n.exprviz-label-header {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n text-align: right;\n padding-right: 6px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.exprviz-toggle-header {\n cursor: pointer;\n user-select: none;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n width: 100%;\n padding-right: 6px;\n}\n\n.exprviz-toggle-header:hover {\n color: #2a6ebb;\n}\n\n.exprviz-toggle-caret {\n display: inline-block;\n width: 0.9em;\n font-size: 0.75em;\n color: #888;\n margin-right: 2px;\n}\n\n.exprviz-toggle-header:hover .exprviz-toggle-caret {\n color: #2a6ebb;\n}\n\n.exprviz-fields-layout {\n display: grid;\n grid-template-columns: 320px 1fr;\n gap: 0.75rem;\n height: 60vh;\n}\n\n.exprviz-tree {\n overflow-y: auto;\n border: 1px solid #eee;\n padding: 0.4rem 0.5rem;\n font-size: 0.85rem;\n}\n\n.exprviz-tree-search {\n width: 100%;\n box-sizing: border-box;\n padding: 4px 6px;\n margin-bottom: 0.4rem;\n border: 1px solid #ccc;\n border-radius: 3px;\n font-size: 0.85rem;\n}\n\n.exprviz-tree-group {\n margin-bottom: 0.5rem;\n}\n\n.exprviz-tree-group-header {\n cursor: pointer;\n user-select: none;\n padding: 2px 0;\n}\n\n.exprviz-tree-caret {\n display: inline-block;\n width: 1em;\n color: #888;\n}\n\n.exprviz-tree-type {\n margin-left: 0.5rem;\n border-left: 2px solid transparent;\n padding-left: 0.25rem;\n}\n\n.exprviz-tree-type.is-active {\n border-left-color: #2a6ebb;\n}\n\n.exprviz-tree-type-header {\n cursor: pointer;\n user-select: none;\n display: flex;\n align-items: center;\n padding: 2px 0;\n}\n\n.exprviz-tree-type-header:hover {\n background: #f5f8ff;\n}\n\n.exprviz-tree-type-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exprviz-tree-type-count {\n color: #888;\n font-variant-numeric: tabular-nums;\n margin-left: 0.5rem;\n}\n\n.exprviz-tree-values {\n margin: 0.25rem 0 0.5rem 1.25rem;\n padding-left: 0.25rem;\n border-left: 1px dashed #e0e0e0;\n}\n\n.exprviz-values-toolbar {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n margin-bottom: 0.25rem;\n}\n\n.exprviz-tree-value {\n display: flex;\n align-items: center;\n gap: 0.4rem;\n padding: 1px 0;\n cursor: pointer;\n}\n\n.exprviz-tree-value:hover {\n background: #fafaff;\n}\n\n.exprviz-tree-value-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.exprviz-tree-value-count {\n color: #888;\n font-variant-numeric: tabular-nums;\n font-size: 0.8em;\n}\n\n.exprviz-tree-empty {\n color: #999;\n margin-left: 1rem;\n}\n\n.exprviz-fields-preview {\n overflow: auto;\n border: 1px solid #eee;\n}\n\n.exprviz-fields-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.85rem;\n}\n\n.exprviz-fields-table th,\n.exprviz-fields-table td {\n padding: 4px 8px;\n border-bottom: 1px solid #f0f0f0;\n white-space: nowrap;\n text-align: left;\n}\n\n.exprviz-fields-table thead th {\n position: sticky;\n top: 0;\n background: #fafafa;\n z-index: 1;\n border-bottom: 1px solid #ddd;\n}\n\n.exprviz-col-factor {\n background: #eef6ff;\n}\n\n.exprviz-col-char {\n background: #f5f5f0;\n}\n\n.exprviz-fields-table tbody tr:hover {\n background: #fafaff;\n}\n\n",".attrtable-view {\n display: flex;\n flex-direction: column;\n width: 100%;\n}\n\n.attrtable-toolbar {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n padding: 0.25rem 0 0.5rem;\n}\n\n.attrtable-status {\n font-size: small;\n}\n\n/ pale → dark = low → high, matching the tbrowse Expression zone /\n.attrtable-legend {\n display: flex;\n align-items: center;\n gap: 1px;\n margin-left: auto;\n}\n\n.attrtable-legend span {\n width: 12px;\n height: 12px;\n display: inline-block;\n border: 1px solid rgba(0, 0, 0, 0.08);\n}\n\n.attrtable-notice {\n padding: 0.4rem 0.75rem;\n margin-bottom: 0.5rem;\n font-size: small;\n}\n\n.attrtable-columns-panel {\n border: 1px solid #dee2e6;\n border-radius: 4px;\n padding: 0.5rem;\n margin-bottom: 0.5rem;\n max-height: 320px;\n overflow-y: auto;\n}\n\n.attrtable-columns-head {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n margin-bottom: 0.5rem;\n}\n\n.attrtable-field-search {\n flex: 1;\n}\n\n.attrtable-aggrid {\n width: 100%;\n height: 600px;\n / Block the browser's edge-of-scroll back/forward gesture when scrolling\n * all the way left or right inside the grid. /\n overscroll-behavior-x: contain;\n}\n\n.attrtable-aggrid .ag-body-viewport,\n.attrtable-aggrid .ag-body-horizontal-scroll-viewport,\n.attrtable-aggrid .ag-center-cols-viewport {\n overscroll-behavior-x: contain;\n}\n\n.attrtable-empty {\n padding: 1rem;\n color: #6c757d;\n}\n\n/ Cell click popover — spells out the clicked value(s) and offers an\n * \"add filter\" per value. Rendered outside the grid so its text is selectable\n * (ag-grid cells disable text selection). /\n.attrtable-popover {\n position: fixed;\n z-index: 1080;\n min-width: 200px;\n max-width: 280px;\n background: #fff;\n border: 1px solid #c6ccd2;\n border-radius: 5px;\n box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);\n padding: 6px;\n user-select: text;\n}\n\n.attrtable-popover-title {\n font-weight: 600;\n font-size: 12px;\n color: #495057;\n padding: 2px 4px 6px;\n border-bottom: 1px solid #edeff2;\n margin-bottom: 4px;\n}\n\n.attrtable-popover-row {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 2px 4px;\n}\n\n.attrtable-popover-val {\n flex: 1;\n font-size: 13px;\n word-break: break-word;\n}\n\n.attrtable-popover-btn {\n flex: 0 0 auto;\n white-space: nowrap;\n padding: 1px 8px;\n font-size: 12px;\n}\n\n/ Vertical headers for the narrow organ columns: full tissue names read\n * bottom-to-top, centred within each column so they stay inside the cell and\n * never cross the column separators (which they did when slanted). /\n\n/ The quartz theme gives header cells 16px of horizontal padding, which on a\n * 22px organ column leaves the label no room (its container collapses to 0 and\n * overflow:hidden clips it). Zero it so the vertical label uses the full column\n * width — the column itself stays 22px, so the heatmap doesn't get wider. /\n.attrtable-aggrid .attrtable-organ-header {\n padding-left: 0 !important;\n padding-right: 0 !important;\n}\n\n.attrtable-rot-header {\n height: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n cursor: pointer;\n}\n\n/ Left-justified: the label is anchored at the bottom-left and rises straight\n * up, so every tissue name starts on the same line just above the heatmap\n * (rather than floating centred in the tall header). /\n.attrtable-rot-header > span {\n position: absolute;\n / Rotating -90° about the baseline throws the glyph height to the left of\n * the pivot, so anchor the pivot ~13px in to keep the text inside its own\n * 22px column. /\n left: 13px;\n bottom: 3px;\n transform-origin: left bottom;\n transform: rotate(-90deg);\n white-space: nowrap;\n font-size: 10px;\n line-height: 1;\n}\n\n/ Tight heatmap cells: colour fills the whole (narrow) cell, no padding. /\n.attrtable-aggrid .attrtable-organ-cell {\n padding: 0 !important;\n}\n\n/ Drop the theme's resize-handle grip (a 2px bar drawn on every header cell's\n * right edge) — it read as a heavy, header-only column separator. Resizing by\n * dragging the edge still works; only the decoration is gone. /\n.attrtable-aggrid .ag-header-cell-resize::after {\n display: none;\n}\n\n/ Column separators between all columns, clearly visible in both the header and\n * the body (the theme's default border is near-invisible on white). /\n.attrtable-aggrid .ag-cell,\n.attrtable-aggrid .ag-header-cell {\n border-right: 1px solid #c6ccd2;\n}\n\n/ ...except within the expression heatmap: the organ columns read as one\n * continuous block, so drop their internal separators. The last organ column\n * keeps its right border so the heatmap's outer edge is still divided from the\n * next column. /\n.attrtable-aggrid .attrtable-organ-cell,\n.attrtable-aggrid .attrtable-organ-header {\n border-right: none;\n}\n\n.attrtable-aggrid .attrtable-organ-cell.attrtable-organ-last,\n.attrtable-aggrid .attrtable-organ-header.attrtable-organ-last {\n border-right: 1px solid #c6ccd2;\n}\n\n/ With the tall header (organ heatmap shown), sit the plain column labels at\n * the bottom so they line up with the base of the slanted organ labels. /\n.attrtable-aggrid.attrtable-tall-header .ag-header-cell-label {\n align-items: flex-end;\n padding-bottom: 3px;\n}\n",".oe-view {\n padding: 0.25rem 0.5rem;\n}\n\n.oe-layout {\n display: flex;\n align-items: flex-start;\n gap: 0.75rem;\n}\n\n.oe-layout-tree {\n max-height: 80vh;\n overflow: auto;\n border: 1px solid #e1e4e8;\n border-radius: 4px;\n padding: 0.25rem 0.5rem;\n background: #fafbfc;\n font-size: 13px;\n min-width: 0;\n}\n\n.oe-splitter {\n flex: 0 0 6px;\n cursor: col-resize;\n background: transparent;\n border-left: 1px solid #e1e4e8;\n border-right: 1px solid #e1e4e8;\n margin: 0 1px;\n align-self: stretch;\n}\n\n.oe-splitter:hover,\n.oe-splitter:active {\n background: #d6e9ff;\n}\n\n.oe-layout-panel {\n flex: 1 1 auto;\n min-width: 0;\n}\n\n.oe-tree-leaf {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 2px 4px;\n cursor: pointer;\n border-radius: 2px;\n}\n\n.oe-tree-leaf:hover {\n background: #eef5ff;\n}\n\n.oe-tree-leaf-active {\n background: #d6e9ff !important;\n font-weight: 600;\n}\n\n.oe-tree-leaf-name {\n flex: 1 1 auto;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.oe-tree-leaf-count {\n color: #555;\n font-size: 12px;\n font-variant-numeric: tabular-nums;\n}\n\n.oe-loading {\n padding: 1rem;\n}\n\n.oe-summary {\n font-size: 0.9rem;\n margin: 0.25rem 0 0.5rem 0;\n}\n\n.oe-controls {\n display: flex;\n flex-wrap: wrap;\n gap: 0.75rem;\n align-items: end;\n margin-bottom: 0.5rem;\n padding: 0.5rem;\n background-color: #f6f8fa;\n border: 1px solid #e1e4e8;\n border-radius: 4px;\n}\n\n.oe-control {\n min-width: 100px;\n}\n\n.oe-control-grow {\n flex-grow: 1;\n min-width: 200px;\n}\n\n.oe-control .form-label {\n font-size: 0.8rem;\n margin-bottom: 0.15rem;\n}\n\n.oe-help {\n display: inline-flex;\n align-items: center;\n margin-left: 3px;\n color: #6c757d;\n cursor: help;\n vertical-align: middle;\n font-size: 0.85em;\n}\n\n.oe-help:hover,\n.oe-help:focus {\n color: #0366d6;\n outline: none;\n}\n\n.oe-switch {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.oe-ont-title {\n font-weight: 600;\n margin-right: 0.5rem;\n}\n\n.oe-ont-badge {\n font-weight: normal;\n}\n\n.oe-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.85rem;\n}\n\n.oe-table th,\n.oe-table td {\n padding: 0.25rem 0.5rem;\n border-bottom: 1px solid #eee;\n text-align: left;\n}\n\n.oe-table th {\n background: #f0f3f6;\n position: sticky;\n top: 0;\n}\n\n.oe-sort-th {\n cursor: pointer;\n user-select: none;\n white-space: nowrap;\n}\n\n.oe-sort-th:hover {\n background: #dde3ea;\n}\n\n.oe-sort-th-active {\n background: #dde3ea;\n color: #003366;\n}\n\n.oe-table tbody tr {\n cursor: pointer;\n}\n\n.oe-table tbody tr:hover {\n background-color: #eef5ff;\n}\n\n.oe-num {\n text-align: right !important;\n font-variant-numeric: tabular-nums;\n}\n\n.oe-term-id {\n font-family: monospace;\n white-space: nowrap;\n}\n\n.oe-term-name {\n max-width: 32rem;\n}\n\n.oe-term-type {\n white-space: nowrap;\n color: #555;\n font-size: 0.8rem;\n}\n","/ Sidebar \"Refine\" section: facet-count groups. Lives inside .sidebar-section-body\n * (pale-yellow), so text/controls are tuned for that background. /\n\n.facet-group {\n margin-bottom: 3px;\n}\n\n.facet-group-header {\n display: flex;\n align-items: center;\n gap: 4px;\n cursor: pointer;\n padding: 2px 2px;\n font-weight: 600;\n font-size: 0.82rem;\n color: #5a3a1a;\n user-select: none;\n}\n.facet-group-header:hover {\n background: rgba(0, 0, 0, 0.06);\n border-radius: 3px;\n}\n\n.facet-group-caret {\n display: inline-flex;\n font-size: 0.68rem;\n}\n\n.facet-group-title {\n flex: 1;\n}\n\n/ count of distinct values in the group (not a click target) /\n.facet-group-nvals {\n color: #8a6d3b;\n font-weight: 400;\n font-size: 0.7rem;\n}\n\n.facet-group-body {\n padding: 0 2px 2px 14px;\n}\n\n.facet-row {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 1px 0;\n font-size: 0.8rem;\n}\n\n/ selectable label; ellipsis when a TF-family name is long /\n.facet-val {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: #333;\n}\n\n/ the clickable count — adds the field:value filter */\n.facet-count {\n flex: 0 0 auto;\n border: none;\n background: #e7d27a;\n color: #5a3a1a;\n border-radius: 3px;\n padding: 0 6px;\n font-size: 0.72rem;\n line-height: 1.5;\n font-variant-numeric: tabular-nums;\n cursor: pointer;\n}\n.facet-count:hover {\n background: #a03e34;\n color: #fff;\n}\n\n.facet-more {\n border: none;\n background: none;\n color: #a03e34;\n cursor: pointer;\n font-size: 0.75rem;\n padding: 2px 0 2px 0;\n text-decoration: underline;\n}\n\n.facet-status {\n font-size: 0.78rem;\n color: #8a6d3b;\n font-style: italic;\n padding: 2px;\n}\n"],"names":[],"version":3,"file":"index.css.map"}