
      @font-face {
        font-family: "Open Sans";
        font-style: normal;
        font-weight: 400 700;
        font-display: swap;
        src: url("/static/open-sans-latin.woff2") format("woff2");
      }
      :root {
        color-scheme: light;
        font: 14px/1.45 "Open Sans", Arial, sans-serif;
        color: #292929;
        background: #f9f9f9;
        --accent: #f15a29;
        --border: #e1e1e1;
        --muted: #666;
      }
      * {
        box-sizing: border-box;
      }
      body {
        margin: 0;
      }
      [hidden] {
        display: none !important;
      }
      a {
        color: #a33312;
      }
      button,
      input,
      select,
      textarea {
        font: inherit;
        border: 1px solid #aab2b9;
        border-radius: 4px;
        padding: 6px 9px;
        min-height: 32px;
      }
      button {
        cursor: pointer;
        background: #fff;
        color: #0f1419;
        font-weight: 600;
      }
      button:hover {
        background: #fff1e9;
      }
      button.primary {
        background: var(--accent);
        border-color: var(--accent);
        color: #171717;
      }
      button.primary:hover {
        background: #e64b18;
      }
      button:disabled {
        cursor: default;
        background: #eef0f2;
        color: #68727b;
        border-color: var(--border);
      }
      input,
      select,
      textarea {
        background: #fff;
        color: inherit;
        width: 100%;
      }
      input[type="checkbox"] {
        min-height: 0;
        width: 15px;
        height: 15px;
        accent-color: #b63813;
      }
      textarea {
        resize: vertical;
        min-height: 64px;
      }
      :focus-visible {
        outline: 3px solid #b7350e;
        outline-offset: 3px;
      }
      .topbar {
        background: #0f1419;
        color: white;
        border-bottom: 2px solid var(--accent);
        padding: 12px max(20px, calc((100% - 1560px) / 2));
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
      }
      .brand {
        display: flex;
        align-items: center;
        gap: 16px;
        color: inherit;
        text-decoration: none;
      }
      .brand img {
        width: 84px;
        height: auto;
      }
      .brand span {
        border-left: 1px solid #59616a;
        padding-left: 16px;
        font-size: 15px;
        font-weight: 400;
      }
      .topbar a:focus-visible {
        outline-color: white;
      }
      .sign-out {
        color: white;
        background: transparent;
        border-color: #59616a;
        white-space: nowrap;
      }
      .sign-out:hover {
        background: #29323a;
      }
      .login-main {
        width: 100%;
        max-width: 420px;
        padding-top: clamp(32px, 10vh, 100px);
      }
      .login-card {
        background: white;
        border: 1px solid var(--border);
        border-radius: 4px;
        padding: 24px;
      }
      .login-card h1 {
        margin-bottom: 24px;
      }
      .login-card label {
        margin-bottom: 16px;
      }
      .login-card input {
        min-height: 38px;
      }
      .login-card button {
        width: 100%;
        min-height: 38px;
        margin-top: 4px;
      }
      .login-error {
        color: #a32020;
        margin: 0 0 16px;
      }
      .skip-link {
        position: absolute;
        top: -80px;
        left: 16px;
        background: white;
        padding: 12px;
        z-index: 5;
      }
      .skip-link:focus {
        top: 12px;
      }
      main {
        max-width: 1600px;
        margin: auto;
        padding: 18px 20px;
      }
      h1 {
        font-size: 25px;
        margin: 0;
        font-weight: 700;
      }
      h2 {
        font-size: 15px;
        margin: 0;
      }
      h3 {
        font-size: 14px;
        margin: 14px 0 6px;
      }
      p {
        margin: 8px 0;
      }
      p:empty {
        display: none;
      }
      small,
      .muted,
      dt {
        color: var(--muted);
      }
      .heading,
      .panel-heading,
      .actions,
      .pager {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        flex-wrap: wrap;
      }
      .heading {
        margin-bottom: 12px;
      }
      .actions {
        justify-content: flex-start;
      }
      .panel {
        border: 1px solid var(--border);
        background: white;
        border-radius: 4px;
        margin-bottom: 14px;
        min-width: 0;
      }
      .panel-heading {
        padding: 10px 14px;
        border-bottom: 1px solid var(--border);
      }
      .panel-body {
        padding: 12px 14px;
      }
      .view-tabs {
        display: flex;
        gap: 20px;
        border-bottom: 1px solid var(--border);
        margin-bottom: 18px;
      }
      .view-tabs button {
        border: 0;
        border-bottom: 3px solid transparent;
        border-radius: 0;
        padding: 10px 2px;
        background: transparent;
        color: var(--muted);
      }
      .view-tabs button[aria-selected="true"] {
        color: #292929;
        border-bottom-color: var(--accent);
      }
      .search-workspace > section + section {
        border-top: 1px solid var(--border);
      }
      .tag {
        display: inline-block;
        background: #fff1e9;
        color: #704021;
        border-radius: 3px;
        padding: 2px 7px;
        font-size: 12px;
      }
      .summary-item {
        display: inline-flex;
        align-items: baseline;
        gap: 7px;
        white-space: nowrap;
        color: var(--muted);
      }
      .summary-item strong {
        color: #292929;
        font-size: 18px;
        line-height: 1.3;
        font-variant-numeric: tabular-nums;
      }
      .status {
        margin: 0;
        padding: 8px 14px;
        background: #f7f8f9;
        border-top: 1px solid var(--border);
      }
      .error {
        color: #a02d19;
      }
      .filters {
        display: grid;
        grid-template-columns: minmax(180px, 1.5fr) repeat(3, minmax(120px, 1fr));
        gap: 8px 12px;
        margin-bottom: 10px;
      }
      label {
        display: block;
        font-size: 12px;
      }
      label > input,
      label > select,
      label > textarea {
        margin-top: 3px;
      }
      .form-field {
        margin-bottom: 8px;
      }
      fieldset {
        border: 0;
        margin: 0;
        padding: 0;
        min-width: 0;
      }
      legend {
        font-size: 12px;
        font-weight: 600;
        margin-bottom: 8px;
      }
      .platforms {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 7px 12px;
      }
      .settings-fields {
        display: grid;
        grid-template-columns: minmax(220px, 1fr) minmax(0, 3fr);
        gap: 12px 24px;
      }
      .selection-group {
        border: 1px solid var(--border);
        border-radius: 6px;
        padding: 14px;
        align-self: start;
      }
      .selection-group legend {
        padding: 0 6px;
        font-size: 14px;
        color: inherit;
      }
      .selection-actions {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin-bottom: 12px;
      }
      .selection-actions button {
        padding: 3px 8px;
        font-size: 12px;
      }
      .source-selection {
        background: #f3f5f6;
      }
      #source-options {
        grid-template-columns: 1fr;
      }
      #assay-options {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
      #discovery-options {
        grid-column: 1 / -1;
      }
      .advanced-fields {
        display: grid;
        grid-template-columns: minmax(220px, 1.4fr) minmax(260px, 1.4fr) minmax(120px, .6fr);
        gap: 12px;
        margin-top: 10px;
      }
      .discovery-actions {
        display: flex;
        align-items: center;
        gap: 12px;
        flex-wrap: wrap;
        margin-top: 12px;
      }
      .discovery-actions p {
        margin: 0;
        font-size: 12px;
      }
      #filters .actions {
        align-items: end;
      }
      #filters .actions label {
        display: flex;
        align-items: center;
        gap: 8px;
      }
      #filters .actions select {
        width: auto;
        margin: 0;
      }
      #filters .paper-filter {
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 32px;
      }
      #filters .paper-filter input {
        margin: 0;
      }
      #filters .organism-groups {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 18px;
        margin: 8px 0;
        padding: 6px 0;
      }
      #filters .organism-groups legend {
        font-size: 0.85rem;
        color: var(--muted);
      }
      #discovery-options > summary,
      #catalog-filters > summary {
        cursor: pointer;
        font-size: 12px;
        color: var(--muted);
      }
      #catalog-filters > summary {
        margin-bottom: 10px;
      }
      .platforms label {
        display: flex;
        align-items: center;
        gap: 7px;
      }
      .platforms input {
        margin: 0;
      }
      .dates {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
      }
      .field-error {
        color: #a02d19;
        margin: 3px 0;
        font-size: 12px;
      }
      [aria-invalid="true"] {
        border-color: #a02d19;
      }
      .table-wrap {
        overflow-x: auto;
      }
      table[aria-label="Search history"] {
        min-width: 620px;
      }
      table[aria-label="Search history"] td:nth-child(2) {
        white-space: nowrap;
      }
      table {
        border-collapse: collapse;
        width: 100%;
        text-align: left;
      }
      table[aria-label="Candidate catalog"] {
        table-layout: fixed;
        min-width: 1300px;
      }
      table[aria-label="Candidate catalog"] th:nth-child(1) { width: 8%; }
      table[aria-label="Candidate catalog"] th:nth-child(2) { width: 20%; }
      table[aria-label="Candidate catalog"] th:nth-child(3) { width: 7%; }
      table[aria-label="Candidate catalog"] th:nth-child(4) { width: 7%; }
      table[aria-label="Candidate catalog"] th:nth-child(5) { width: 7%; }
      table[aria-label="Candidate catalog"] th:nth-child(6) { width: 6%; }
      table[aria-label="Candidate catalog"] th:nth-child(7) { width: 7%; }
      table[aria-label="Candidate catalog"] th:nth-child(8) { width: 8%; }
      table[aria-label="Candidate catalog"] th:nth-child(9) { width: 7%; }
      table[aria-label="Candidate catalog"] th:nth-child(10) { width: 5%; }
      table[aria-label="Candidate catalog"] th:nth-child(11) { width: 6%; }
      table[aria-label="Candidate catalog"] th:nth-child(12) { width: 7%; }
      table[aria-label="Candidate catalog"] th:nth-child(13) { width: 5%; }
      #metadata { width: min(1100px, calc(100vw - 32px)); }
      #metadata-groups > details { margin: 12px 0; border: 1px solid var(--border); border-radius: 6px; }
      #metadata-groups > details > summary { padding: 12px; cursor: pointer; font-weight: 600; }
      .metadata-table { width: 100%; table-layout: fixed; min-width: 0; }
      .metadata-table th:first-child { width: 27%; }
      .metadata-table td { white-space: pre-wrap; }
      .metadata-value { margin-bottom: 12px; }
      .metadata-provenance { display: block; font-size: 11px; color: var(--muted); margin-top: 4px; }
      tbody tr:hover {
        background: #fdf9f6;
      }
      th {
        font-size: 12px;
        color: var(--muted);
        font-weight: 600;
        background: #f7f8f9;
      }
      th,
      td {
        padding: 9px 10px;
        border-bottom: 1px solid #e9ecee;
        vertical-align: top;
      }
      td {
        font-size: 13px;
        overflow-wrap: anywhere;
      }
      .catalog-title {
        line-height: 1.5;
      }
      .article-links {
        font-size: 12px;
      }
      .article-links a {
        display: block;
        margin-bottom: 6px;
      }
      .link-button {
        color: #a33312;
        padding: 0;
        border: 0;
        background: transparent;
        text-align: left;
        font-weight: 600;
        min-height: 0;
      }
      .link-button:hover {
        text-decoration: underline;
        background: transparent;
      }
      .accession {
        color: var(--muted);
        margin-top: 4px;
        font-size: 12px;
      }
      .pager {
        margin-top: 10px;
        font-size: 12px;
      }
      .page-size {
        display: flex;
        align-items: center;
        gap: 6px;
        white-space: nowrap;
      }
      .page-size select {
        width: auto;
        margin-top: 0;
      }
      .run-status {
        display: inline-flex;
        align-items: center;
        gap: 8px;
      }
      .run-status::before {
        content: "";
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #717171;
      }
      .run-status[data-state="running"]::before,
      .run-status[data-state="stop_requested"]::before {
        background: var(--accent);
      }
      .run-status[data-state="completed"]::before {
        background: #287443;
      }
      .run-status[data-state="failed"]::before {
        background: #a32020;
      }
      .counters {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
        gap: 10px;
        margin: 16px 0;
      }
      dt {
        font-size: 12px;
      }
      dd {
        margin: 4px 0 0;
        overflow-wrap: anywhere;
      }
      .counters dd {
        font-size: 18px;
        font-weight: 600;
        font-variant-numeric: tabular-nums;
      }
      progress {
        width: 100%;
        height: 10px;
        accent-color: #b63813;
      }
      pre {
        white-space: pre-wrap;
        overflow-wrap: anywhere;
        font:
          12px/1.6 ui-monospace,
          Consolas,
          monospace;
        background: #f7f8f9;
        border: 1px solid var(--border);
        padding: 12px;
        max-height: 300px;
        overflow-y: auto;
      }
      .events {
        max-height: 240px;
        overflow-y: auto;
        padding-left: 23px;
        font-size: 12px;
      }
      .events li {
        margin: 7px 0;
        overflow-wrap: anywhere;
      }
      dialog {
        border: 1px solid var(--border);
        border-radius: 6px;
        padding: 18px;
        width: min(800px, calc(100% - 32px));
        max-height: calc(100% - 40px);
        overflow-y: auto;
      }
      dialog::backdrop {
        background: #0f141980;
      }
      #detail, #files {
        padding: 0;
        width: min(960px, calc(100% - 24px));
        overflow: hidden;
      }
      #files {
        width: min(720px, calc(100% - 24px));
      }
      #file-list {
        list-style: none;
        margin: 0;
        padding: 0;
      }
      #file-list li {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 4px 16px;
        padding: 12px 0;
        border-bottom: 1px solid var(--border);
        overflow-wrap: anywhere;
      }
      #file-list .file-status {
        grid-column: 1 / -1;
        font-size: 12px;
      }
      #files-message:empty {
        display: none;
      }
      #detail[open], #files[open] {
        display: flex;
        flex-direction: column;
      }
      .detail-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 10px 18px;
        border-bottom: 1px solid var(--border);
        flex: none;
      }
      .detail-header h2 {
        margin: 0;
        font-size: 17px;
        overflow-wrap: anywhere;
      }
      .close-button {
        width: 34px;
        height: 34px;
        padding: 0;
        flex: none;
        display: grid;
        place-items: center;
      }
      .close-button svg {
        width: 20px;
        height: 20px;
      }
      .detail-body {
        overflow-y: auto;
        padding: 18px;
        min-height: 0;
      }
      .detail-body h3 {
        font-size: 20px;
        line-height: 1.4;
        margin: 0 0 10px;
      }
      .detail-facts {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 14px;
        padding: 12px;
        background: #f7f8f9;
        border-radius: 6px;
      }
      .detail-facts dt {
        color: var(--muted);
      }
      .detail-facts dd {
        font-weight: 600;
        font-size: 14px;
      }
      .detail-section {
        margin-top: 18px;
      }
      .detail-section h4 {
        margin: 0 0 10px;
        font-size: 15px;
      }
      .detail-section p,
      .detail-section li,
      .evidence-quote {
        white-space: pre-wrap;
        line-height: 1.65;
        overflow-wrap: anywhere;
      }
      .detail-section details {
        border-top: 1px solid var(--border);
        padding: 12px 0;
      }
      .evidence-item {
        margin: 14px 0;
        padding: 12px 16px;
        border-left: 3px solid var(--accent);
        background: #fafafa;
      }
      .evidence-quote {
        margin: 8px 0 0;
        font-size: 13px;
      }
      .badges {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
      }
      .badges .tag {
        font-size: 12px;
      }
      @media (max-width: 600px) {
        .detail-header,
        .detail-body {
          padding: 16px;
        }
        .detail-facts {
          grid-template-columns: repeat(2, minmax(0, 1fr));
          padding: 12px;
        }
      }
      .details-grid {
        display: grid;
        grid-template-columns: 150px minmax(0, 1fr);
        gap: 12px 20px;
      }
      .details-grid dt {
        font-size: 13px;
      }
      .details-grid dd {
        margin: 0;
        white-space: pre-wrap;
      }
      footer {
        max-width: 1600px;
        margin: 0 auto;
        padding: 0 20px 18px;
        font-size: 12px;
        color: var(--muted);
      }
      @media (max-width: 1000px) {
        .settings-fields {
          grid-template-columns: 1fr 2fr;
          gap: 12px 20px;
        }
        #assay-options {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .filters, .advanced-fields {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
      }
      @media (max-width: 600px) {
        .topbar {
          padding: 10px 14px;
          flex-wrap: wrap;
        }
        .brand {
          gap: 12px;
        }
        .brand span {
          padding-left: 12px;
          font-size: 15px;
        }
        .brand img {
          width: 80px;
        }
        main {
          padding: 14px 10px;
        }
        .panel-body,
        .panel-heading {
          padding: 12px;
        }
        .filters,
        .settings-fields,
        .advanced-fields {
          grid-template-columns: 1fr;
        }
        .counters {
          grid-template-columns: repeat(3, 1fr);
        }
        .details-grid {
          grid-template-columns: 1fr;
          gap: 4px;
        }
        .details-grid dd {
          margin-bottom: 12px;
        }
      }
      .dataset-identity { display: grid; gap: .5rem; white-space: nowrap; }
      .sample-toggle { font-size: .8rem; text-align: left; }
      .sample-row > td, .sample-controls > td { background: #f5f8fc; }
      .sample-branch { position: relative; }
      .sample-branch::before { content: ""; position: absolute; left: 1.4rem; top: 0; bottom: 0; border-left: 2px solid #b6c6d9; }
      .sample-branch::after { content: ""; position: absolute; left: 1.4rem; top: 1.5rem; width: calc(100% + .6rem); border-top: 2px solid #b6c6d9; }
      .sample-row.sample-last > .sample-branch::before { bottom: auto; height: 1.5rem; }
      .sample-content { padding: .4rem 1.2rem .4rem 2rem; }
      .sample-content > .link-button { font-weight: 600; }
      .sample-summary, .sample-controls-content { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.2rem; margin-top: .4rem; }
      .sample-protocol { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; line-height: 1.6; }
    