/* Shared analysis layout, following the Sequence Fetcher workspace. */
.analysis-workspace .tool-quick-guide { margin-top: 28px; padding: 23px; border: 1px solid var(--line, #dfe7eb); border-radius: 9px; background: #fff; box-shadow: 0 3px 5px #25435503; scroll-margin-top: 94px; }
.analysis-workspace .tool-quick-guide > h2 { margin: 0 0 14px; color: #00796b; font-size: .875rem; letter-spacing: 1.7px; font-weight: 700; }
.analysis-workspace .tool-quick-guide details { border-top: 1px solid var(--line, #dfe7eb); padding: 14px 0; }
.analysis-workspace .tool-quick-guide summary { cursor: pointer; color: #203b48; font-size: 1rem; font-weight: 600; }
.analysis-workspace .tool-quick-guide details[open] > summary, .analysis-workspace .tool-quick-guide a { color: #00796b; }
.analysis-workspace .tool-quick-guide p { margin: 10px 0 0; color: var(--muted, #71818b); font-size: .875rem; line-height: 1.8; }
.analysis-workspace .tool-quick-guide summary:focus-visible { outline: 3px solid #4db6ac; outline-offset: 3px; }
@media (max-width: 600px) { .analysis-workspace .tool-quick-guide { padding: 19px; } .analysis-workspace .tool-quick-guide summary { font-size: .9375rem; } }
.analysis-workspace { --text: #203b48; --muted: #71818b; --primary: #009688; --line: #dfe7eb; --anchor-offset: 94px; background: #fff; font-size: 1rem; }
.workspace-topbar { height: 74px; padding: 0 34px; display: flex; align-items: center; gap: 40px; background: #fff; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 30; }
.workspace-brand { display: flex; align-items: center; gap: 11px; font-size: 1.4375rem; font-weight: 750; letter-spacing: -.7px; white-space: nowrap; }
.workspace-brand-light { font-weight: 400; }
.workspace-topbar nav { display: flex; align-items: stretch; align-self: stretch; gap: 30px; font-size: 1rem; }
.workspace-topbar nav a { display: flex; align-items: center; border-bottom: 2px solid transparent; }
.workspace-topbar nav .active { color: var(--primary); border-color: var(--primary); }
.workspace-report { margin-left: auto; border: 0; background: none; color: var(--muted); font-size: 1rem; cursor: pointer; }
.workspace-back { color: var(--muted); font-size: 1rem; white-space: nowrap; }
.workspace-shell { display: grid; grid-template-columns: 220px minmax(0, 1fr); max-width: 1760px; margin: auto; }
.workspace-sidebar { position: sticky; top: 74px; height: calc(100dvh - 74px); overflow-y: auto; padding: 36px 18px; border-right: 1px solid var(--line); background: #fff; display: flex; flex-direction: column; }
.workspace-side-active { padding: 12px; border-radius: 6px; background: #e0f2f1; color: var(--primary); font-size: 1rem; font-weight: 650; }
.workspace-steps { display: grid; gap: 18px; padding: 24px 9px 30px 17px; color: var(--muted); font-size: 1rem; }
.workspace-help { padding: 15px 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 1rem; }
.workspace-related { display: grid; gap: 12px; margin-top: auto; padding: 30px 12px 0; color: var(--muted); font-size: 0.875rem; }
.workspace-related > span { font-size: 0.875rem; letter-spacing: 1.5px; color: #00796b; }
.workspace-sidebar a:hover { color: var(--primary); }
.workspace-skip { position: fixed; top: -100px; left: 20px; z-index: 50; padding: 12px; background: #fff; }
.workspace-skip:focus { top: 10px; }
.analysis-workspace :is(a, button, input, select, textarea):focus-visible { outline: 3px solid #4db6ac; outline-offset: 3px; }
.analysis-workspace .tool-page-main { width: 100%; max-width: 1400px; min-width: 0; margin: 0 auto; padding: 24px 40px 0; }
.analysis-workspace .container { width: 100%; }
.analysis-workspace .tool-page-hero { padding: 0 0 30px; }
.analysis-workspace .tool-crumbs { font-size: 0.875rem; }
.analysis-workspace .tool-page-header { display: block; margin-top: 30px; }
.analysis-workspace .tool-page-copy { padding: 0; border: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.analysis-workspace .tool-page-eyebrow { padding: 0; background: none; border-radius: 0; font-size: 0.875rem; letter-spacing: 1.7px; color: #00796b; }
.analysis-workspace .tool-page-copy h1 { margin: 9px 0 12px; font-size: 2.125rem; font-weight: 650; letter-spacing: -1.2px; line-height: 1.25; }
.analysis-workspace .tool-page-copy p { margin: 0; font-size: 1rem; line-height: 1.85; }
.analysis-workspace .tool-page-sidecard { padding: 16px 12px; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.analysis-workspace .tool-side-badge { padding: 0; border-radius: 0; background: none; font-size: 0.875rem; color: #00796b; }
.analysis-workspace .tool-side-grid { grid-template-columns: 1fr; gap: 14px; margin-top: 18px; }
.analysis-workspace .tool-side-grid div { padding: 0; background: none; }
.analysis-workspace .tool-side-grid label { font-size: 0.875rem; }
.analysis-workspace .tool-side-grid strong { margin-top: 3px; font-size: 1rem; font-weight: 600; }
.analysis-workspace .tool-workbench-section { padding: 0; }
.analysis-workspace :is(.typing-workbench, .tree-workbench) { padding: 22px; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: 0 3px 5px #25435503; -webkit-backdrop-filter: none; backdrop-filter: none; }
.analysis-workspace .typing-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.spacer-map-page #spacerForm + #configure-step { margin-top: 20px; }
.analysis-workspace .tree-toolbar { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); padding: 0; background: none; gap: 14px; }
@media (min-width: 601px) {
  .analysis-workspace .tree-toolbar:has(#modelProfileGroup:not([hidden])) { grid-template-columns: minmax(0, 1.2fr) repeat(2, minmax(0, 1fr)); }
}
.analysis-workspace .tree-toolbar-note { grid-column: 1 / -1; }
.analysis-workspace :is(.typing-toolbar-group, .tree-toolbar-group) { padding: 14px; border-radius: 6px; background: #f5f8fa; min-width: 0; }
.analysis-workspace :is(.toolbar-label, .panel-kicker) { font-size: 0.875rem; }
.analysis-workspace :is(.toolbar-note, .tree-toolbar-note p) { font-size: 1rem; }
.analysis-workspace :is(.typing-grid, .tree-input-grid) { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 20px; margin-top: 20px; }
.analysis-workspace :is(.typing-input-card, .tree-input-card, .upload-panel, .action-panel) { padding: 18px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.analysis-workspace :is(.typing-input-card, .tree-input-card) { align-content: start; gap: 14px; }
.analysis-workspace .panel-heading h2 { font-size: 1.125rem; letter-spacing: -.2px; }
.analysis-workspace :is(.panel-heading p, .typing-helper-text, .dropzone-meta, .customization-note, .customization-inline-note) { font-size: 0.875rem; }
.analysis-workspace :is(.field-label, .dropzone-title, .text-link-button) { font-size: 1rem; }
.analysis-workspace :is(.typing-textarea, .tree-textarea) { min-height: 260px; margin-top: 0; padding: 13px; border-radius: 5px; background: #fcfdfe; font: 1rem/1.8 Consolas, monospace; }
.analysis-workspace :is(.mode-picker-toggle, .mode-button, .tree-select, .toolbar-chip, .customization-input, .customization-select) { border-radius: 5px; font-size: 1rem; }
.analysis-workspace .mode-switch { flex-wrap: wrap; }
/* Match the homepage navigation teal throughout the tree workspace. */
.tree-builder-page {
  --primary: #009688;
  --primary-deep: #00796b;
  --accent: #00796b;
  --accent-soft: #e0f2f1;
  --text: #203b38;
  --muted: #687b78;
  --line: #dce7e5;
  --line-strong: #c6d8d5;
}
.tree-builder-page .workspace-sidebar { --sidebar-selected: var(--accent); --sidebar-selected-bg: var(--accent-soft); }
.tree-builder-page :is(.workspace-related > span, .tool-page-eyebrow, .tool-side-badge) { color: var(--accent); }
.tree-builder-page :is(a, button, input, select, textarea):focus-visible { outline-color: var(--accent); }
.tree-builder-page .tree-method-group .mode-button { background: var(--accent-soft); color: var(--accent); }
.tree-builder-page .tree-method-group .mode-button:hover { background: #ccebe7; }
.tree-builder-page .tree-method-group .mode-button.is-active { background: var(--accent); color: #fff; box-shadow: none; }
.tree-builder-page .tree-method-group .mode-button.is-active:hover { background: var(--primary-deep); }
.tree-builder-page .primary-button:hover { background: var(--primary-deep); }
.tree-builder-page :is(.tree-select, .tree-textarea):focus,
.tree-builder-page .upload-dropzone:focus-within { border-color: #80cbc4; box-shadow: 0 0 0 4px rgba(0, 150, 136, 0.1); }
.tree-builder-page :is(.icon-button, .compact-button):hover { border-color: #80cbc4; color: var(--accent); }
/* Match the neutral background of My Jobs' Retrieve a job panel. */
.tree-builder-page :is(.tree-toolbar-group, .tree-viewer-toolbar, .tree-newick-details, .tree-newick, .tree-log) { background: #f5f6f7; }
.tree-builder-page :is(.tree-textarea, .upload-dropzone) { background: #fcfefd; }
.tree-builder-page .tree-viewer { background: #f5f6f7; }
.tree-builder-page .tree-branches line { stroke: #558b84; }
.tree-builder-page .tree-leaf-node { fill: var(--accent); }
.tree-builder-page .tree-internal-node { fill: #9cc5bf; }
.tree-builder-page .job-badge[data-status=running] { background: var(--accent); }
.analysis-workspace .upload-dropzone { padding: 14px; border-radius: 5px; background: #fcfdfe; }
.spacer-map-page .dropzone-title { display: flex; align-items: center; gap: 8px; }
.spacer-map-page .spacer-upload-icon { flex: 0 0 20px; color: var(--primary); }
.spacer-map-page :is(.typing-toolbar-group, .spacer-svg-frame, .spacer-placeholder) { background: #f5f6f7; }
.tree-builder-page .dropzone-title { display: flex; align-items: center; gap: 8px; }
.tree-builder-page .tree-upload-icon { flex: 0 0 20px; color: var(--primary); }
.analysis-workspace :is(.primary-button, .ghost-button) { border-radius: 5px; padding: 10px 14px; font-size: 1rem; box-shadow: none; }
.analysis-workspace .primary-button { background: var(--primary); }
.analysis-workspace .job-access .text-button {
  border: 0;
  background: none;
  box-shadow: none;
  padding: 3px 0;
  font-weight: 400;
  cursor: pointer;
}
.analysis-workspace :is(.typing-results, .tree-results) { margin-top: 24px; }
.analysis-workspace :is(.result-card, .ct-spotlight, .result-metric-card) { border-radius: 9px; background: #fff; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.analysis-workspace :is(.ct-spotlight, .result-metric-card) { min-width: 0; padding: 18px; overflow-wrap: anywhere; }
.analysis-workspace .ct-spotlight strong { font-size: 1.5rem; line-height: 1.2; }
.analysis-workspace .ct-spotlight p { font-size: 0.875rem; }
.analysis-workspace .result-banner { border-radius: 7px; }
.analysis-workspace :is(.result-detail-grid, .tree-output-grid) { grid-template-columns: minmax(0, 1fr); }
.analysis-workspace :is(.spacer-svg-frame, .tree-viewer, .tree-newick, .tree-log) { border-radius: 6px; }
.analysis-workspace .site-footer { margin-top: 32px; padding: 20px 0; background: none; font-size: 0.875rem; }
@media (max-width: 1100px) {
  .analysis-workspace .tool-page-main { padding-right: 24px; padding-left: 24px; }
  .analysis-workspace :is(.typing-grid, .tree-input-grid) { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 850px) {
  .workspace-shell { display: block; }
  .workspace-sidebar { position: static; height: auto; padding: 14px 24px; border-right: 0; border-bottom: 1px solid var(--line); }
  .workspace-sidebar :is(.tool-page-sidecard, .workspace-help, .workspace-related) { display: none; }
  .workspace-steps { display: flex; flex-wrap: wrap; gap: 12px 20px; padding: 14px 12px 0; }
  .workspace-topbar { padding: 0 22px; gap: 24px; }
  .workspace-topbar nav { gap: 20px; }
  .workspace-back { display: none; }
}
@media (max-width: 600px) {
  .workspace-topbar { height: auto; min-height: 62px; padding: 12px 16px; gap: 12px; flex-wrap: wrap; }
  .workspace-brand { font-size: 1.25rem; }
  .workspace-brand img { width: 27px; height: 27px; }
  .workspace-topbar nav { order: 3; width: 100%; font-size: 0.875rem; }
  .workspace-topbar nav a { padding: 4px 0; }
  .workspace-sidebar { padding: 12px 16px; }
  .analysis-workspace .tool-page-main { padding: 20px 16px 0; }
  .analysis-workspace .tool-page-copy h1 { font-size: 1.75rem; }
  .analysis-workspace :is(.typing-toolbar, .tree-toolbar) { grid-template-columns: minmax(0, 1fr); }
  .analysis-workspace :is(.typing-workbench, .tree-workbench) { padding: 14px; }
  .analysis-workspace :is(.panel-heading, .result-banner) { flex-wrap: wrap; }
  .analysis-workspace .result-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analysis-workspace .customization-grid { grid-template-columns: minmax(0, 1fr); }
}

/* SpacerMap mode choices stay visible and wrap on narrow screens. */
.spacer-map-page .spacer-mode-options { display: flex; flex-wrap: wrap; gap: 12px 20px; }
.spacer-map-page .spacer-mode-choice { display: inline-flex; align-items: center; gap: 7px; margin: 0; font-size: 1rem; font-weight: 500; cursor: pointer; }
.spacer-map-page .spacer-mode-choice input { appearance: auto; width: 16px; height: 16px; margin: 0; padding: 0; flex: 0 0 16px; accent-color: #009688; cursor: pointer; }
.spacer-map-page .spacer-mode-choice input:focus-visible { outline: 2px solid #009688; outline-offset: 3px; }

/* BLAST-style group titles interrupt the upper border at the left. */
.spacer-map-page fieldset.spacer-block {
  min-width: 0;
  margin: 0;
  padding: 16px 18px 18px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
}
.spacer-map-page .spacer-block-title {
  max-width: 100%;
  padding: 0 7px;
  margin-left: -7px;
  text-align: left;
  color: var(--text);
}
.spacer-map-page .spacer-block-title h2 {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .01em;
  overflow-wrap: anywhere;
}
.spacer-map-page .spacer-block > .customization-stack { margin-top: 0; }
.spacer-cluster-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.spacer-cluster-toolbar span { color: #526779; font-size: 0.9rem; }
.spacer-network-caption { margin: 10px 0 0; color: #526779; font-size: 0.8rem; }
.cluster-network-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.cluster-network-controls select { padding: 9px 12px; border: 1px solid #cfdae3; border-radius: 8px; background: white; color: #263e50; font: inherit; }
.cluster-network-canvas { position: relative; height: clamp(360px, 65vh, 620px); width: 100%; border: 1px solid #d9e3ea; border-radius: 10px; background: #fff; }
.cluster-network-canvas:focus-visible { outline: 2px solid #009688; outline-offset: 2px; }
.cluster-network-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; padding: 12px 0 0; font-size: 0.85rem; color: #526779; }
.cluster-network-legend span { display: inline-flex; align-items: center; gap: 7px; }
.cluster-network-legend i { width: 10px; height: 10px; border-radius: 50%; }
#spacerClusterFigure { margin-bottom: 20px; }
.spacer-preview-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.spacer-preview-toolbar > span { margin-right: auto; color: var(--muted); font-size: .875rem; }
.spacer-preview-toolbar output { min-width: 64px; text-align: center; font-variant-numeric: tabular-nums; }
.spacer-preview-toolbar button:disabled { opacity: .45; cursor: default; }
.spacer-map-page #spacerFigure { position: relative; height: clamp(360px, 65vh, 640px); min-height: 0; padding: 0; overflow: hidden; }
.spacer-map-page #spacerFigure:focus-visible { outline: 2px solid #009688; outline-offset: 2px; }
.spacer-map-page #spacerFigure.has-preview { cursor: grab; touch-action: none; user-select: none; }
.spacer-map-page #spacerFigure.is-panning { cursor: grabbing; }
.spacer-map-page #spacerFigure > svg { position: absolute; top: 0; left: 0; max-width: none; max-height: none; transform-origin: 0 0; }
.spacer-map-page #spacerFigure > .spacer-placeholder { min-height: 0; height: 100%; }