/* Ansaur — sage + moss + scale red (tokens in ansaur-brand.css) */
@import url("ansaur-brand.css");

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--font-ui);
  font-size: var(--type-base);
  line-height: var(--leading-normal);
  color: var(--text-primary);
  background: var(--surface-base);
}

.proto-banner {
  background: var(--ansaur-moss);
  color: var(--text-on-rail);
  text-align: center;
  font-size: var(--type-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  padding: 4px;
}

/* --- Shared table --- */
.data-table { width: 100%; border-collapse: collapse; }
.data-table th {
  text-align: left;
  font-size: var(--type-xs);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
  background: var(--surface-inset);
  padding: 12px 18px;
  border-bottom: 1px solid var(--border-hairline);
}
.data-table td {
  padding: 14px 18px;
  border-bottom: 1px solid var(--border-hairline);
  vertical-align: middle;
}
.data-table tbody tr:hover { background: var(--ansaur-sage-soft); }

/* All Questions — section row tints */
.show-all-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 24px;
  padding: 0 32px 16px;
  font-size: var(--type-sm);
  color: var(--text-muted);
}
.show-all-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.show-all-swatch {
  width: 14px;
  height: 14px;
  border-radius: 3px;
  border: 1px solid var(--border-hairline);
  flex-shrink: 0;
}
.show-all-swatch-questions { background: var(--surface-base); }
.show-all-swatch-skipped { background: var(--surface-base); opacity: 0.55; }
.show-all-swatch-filmed { background: oklch(0.38 0.06 155 / 0.14); }
.show-all-swatch-written { background: oklch(0.52 0.08 250 / 0.14); }
.show-all-swatch-optimized { background: oklch(0.62 0.1 85 / 0.16); }
.show-all-swatch-replied { background: oklch(0.55 0.12 320 / 0.12); }
.show-all-swatch-first-page { background: oklch(0.46 0.075 155 / 0.12); }

.show-all-table tbody tr.row-section-questions { background: var(--surface-base); }
.show-all-table tbody tr.row-section-skipped { opacity: 0.55; }
.show-all-table tbody tr.row-section-filmed { background: oklch(0.38 0.06 155 / 0.1); }
.show-all-table tbody tr.row-section-written { background: oklch(0.52 0.08 250 / 0.08); }
.show-all-table tbody tr.row-section-optimized { background: oklch(0.62 0.1 85 / 0.1); }
.show-all-table tbody tr.row-section-replied { background: oklch(0.55 0.12 320 / 0.08); }
.show-all-table tbody tr.row-section-first-page { background: oklch(0.46 0.075 155 / 0.06); }

.show-all-table tbody tr.row-section-questions:hover { background: var(--ansaur-sage-soft); opacity: 1; }
.show-all-table tbody tr.row-section-skipped:hover { background: var(--ansaur-sage-soft); opacity: 0.72; }
.show-all-table tbody tr.row-section-filmed:hover { background: oklch(0.38 0.06 155 / 0.16); opacity: 1; }
.show-all-table tbody tr.row-section-written:hover { background: oklch(0.52 0.08 250 / 0.14); opacity: 1; }
.show-all-table tbody tr.row-section-optimized:hover { background: oklch(0.62 0.1 85 / 0.16); opacity: 1; }
.show-all-table tbody tr.row-section-replied:hover { background: oklch(0.55 0.12 320 / 0.14); opacity: 1; }
.show-all-table tbody tr.row-section-first-page:hover { background: oklch(0.46 0.075 155 / 0.1); opacity: 1; }

.section-cell { white-space: nowrap; }
.section-cell .section-pill + .section-pill { margin-left: 4px; }
.section-pill {
  display: inline-block;
  font-size: var(--type-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 2px 8px;
  border-radius: 999px;
  color: var(--text-muted);
}
.section-pill-questions { color: var(--text-primary); }
.section-pill-skipped { color: var(--text-muted); }
.section-pill-filmed { color: var(--ansaur-moss-deep); background: oklch(0.38 0.06 155 / 0.08); }
.section-pill-written { color: oklch(0.42 0.1 250); background: oklch(0.52 0.08 250 / 0.1); }
.section-pill-optimized { color: oklch(0.45 0.09 85); background: oklch(0.62 0.1 85 / 0.12); }
.section-pill-replied { color: oklch(0.48 0.12 320); background: oklch(0.55 0.12 320 / 0.1); }
.section-pill-first_page { color: var(--ansaur-moss-deep); background: oklch(0.46 0.075 155 / 0.08); }

.kw { font-family: var(--font-mono); font-size: var(--type-base); line-height: var(--leading-normal); }
.vol { font-family: var(--font-mono); font-size: var(--type-md); font-variant-numeric: tabular-nums; }
.vol-header--fetch {
  white-space: nowrap;
}
.vol-header-label {
  display: inline-block;
  margin-right: 6px;
}
.vol-fetch-link {
  display: inline;
  padding: 0;
  border: none;
  background: none;
  font-family: var(--font-ui);
  font-size: var(--type-xs);
  font-weight: 600;
  color: var(--ansaur-moss);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.vol-fetch-link:hover:not(:disabled) {
  color: var(--ansaur-moss-deep);
}
.vol-fetch-link:disabled {
  opacity: 0.55;
  cursor: default;
  text-decoration: none;
}

.vol-fill-card {
  width: min(640px, 100%);
}

.vol-fill-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.vol-fill-status {
  margin: 0;
  font-size: var(--type-md);
  font-weight: 600;
  color: var(--text-primary);
}

.vol-fill-current {
  margin: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
}

.vol-fill-steps {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.vol-fill-empty {
  margin: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
}

.vol-fill-step {
  padding: 10px 12px;
  border: 1px solid var(--border-hairline);
  border-radius: 8px;
  background: var(--surface-inset);
}

.vol-fill-step--running {
  border-color: var(--ansaur-moss);
}

.vol-fill-step--done .vol-fill-step-icon {
  color: var(--ansaur-moss-deep);
}

.vol-fill-step-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.vol-fill-step-icon {
  flex: 0 0 auto;
  font-weight: 700;
  color: var(--text-muted);
}

.vol-fill-step-title {
  flex: 1 1 auto;
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--text-primary);
}

.vol-fill-step-meta {
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-muted);
}

.vol-fill-samples {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.vol-fill-samples li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: var(--type-sm);
}

.vol-fill-sample-kw {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--font-mono);
}

.vol-fill-sample-vol {
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--text-primary);
}

.vol-fill-wait {
  margin: 8px 0 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
}
.badge {
  display: inline-block;
  padding: 3px 11px;
  border-radius: 999px;
  font-size: var(--type-sm);
  font-weight: 600;
  letter-spacing: 0.04em;
}
.badge-ranks {
  background: var(--signal-rank-yes);
  color: var(--text-on-rail);
  padding-inline: 8px;
  letter-spacing: 0.02em;
}
.badge-on-page {
  background: var(--ansaur-moss);
  color: var(--text-on-rail);
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
}
.job-idle { color: var(--text-muted); font-size: var(--type-base); margin: 0; }
.job-failed { border-color: var(--accent-red); background: var(--accent-red-soft); }
.job-failed .job-msg { color: var(--accent-red-deep); font-size: var(--type-md); white-space: pre-wrap; }
.badge-no { background: var(--signal-rank-no); color: var(--text-primary); }
.badge-check { background: var(--signal-check); color: var(--text-primary); }
.badge-filmed { background: var(--ansaur-moss-deep); color: var(--text-on-rail); }
.filmed-date { font-size: var(--type-sm); color: var(--text-muted); }

.first-page-link {
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--ansaur-moss);
  text-decoration: none;
}
.first-page-link:hover { color: var(--ansaur-moss-deep); }

.actions a, .actions button {
  font-size: var(--type-sm);
  color: var(--ansaur-moss);
  background: none;
  border: none;
  cursor: pointer;
  padding: 0 4px;
  font-family: var(--font-ui);
}
.actions button:hover { color: var(--ansaur-moss-deep); }

/* Action button groups (canonical A) */
.actions-cell,
.search-cell,
.row-tools-cell { min-width: 0; white-space: nowrap; }

.variant-a .is-mobile { display: none; }

.row-tools {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.row-tools-actions {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.row-tools-actions .btn-sm {
  font-size: var(--type-sm);
  padding: 7px 12px;
  color: oklch(0.50 0.09 27);
  border: var(--btn-chunky-border);
  background: var(--surface-base);
  box-shadow: var(--btn-chunky-shadow);
}
.row-tools-actions .btn-sm:hover:not(:disabled) {
  background: var(--ansaur-red-soft);
  color: oklch(0.44 0.11 27);
  transform: translate(-2px, -2px);
  box-shadow: var(--btn-chunky-shadow-hover);
}
.row-tools-actions .btn-sm:active:not(:disabled) {
  transform: translate(2px, 2px);
  box-shadow: var(--btn-chunky-shadow-press);
}
.row-tools-actions .btn-sm.btn-black,
.row-tools-actions .btn-sm.is-on {
  background: oklch(0.62 0.12 27);
  border-color: var(--nb-stroke);
  color: var(--ansaur-white);
}
.row-tools-actions .btn-sm.btn-black:hover:not(:disabled),
.row-tools-actions .btn-sm.is-on:hover:not(:disabled) {
  background: oklch(0.52 0.12 27);
  transform: translate(-2px, -2px);
  box-shadow: var(--btn-chunky-shadow-hover);
}

/* Questions workflow — green search row, red action row */
.panel-workflow .row-tools-actions .btn-sm,
.panel-workflow .toolbar .btn-sm,
.panel-workflow .search-bulk-actions .btn-sm {
  font-weight: 600;
  letter-spacing: 0.02em;
  border-radius: var(--btn-wf-radius);
  box-shadow: none;
  transform: none;
}
.panel-workflow .btn-search {
  font-weight: 600;
  letter-spacing: 0.02em;
  border: var(--btn-wf-search-border);
  border-radius: var(--btn-wf-radius);
  background: var(--btn-wf-search-bg);
  box-shadow: none;
  color: var(--btn-wf-search-color);
  transform: none;
}
.panel-workflow .row-tools-actions .btn-sm {
  font-size: var(--type-sm);
  padding: 7px 12px;
  border: var(--btn-wf-action-border);
  background: var(--btn-wf-action-bg);
  color: var(--btn-wf-action-color);
}
.panel-workflow .btn-search {
  font-size: var(--type-sm);
  padding: 7px 12px;
}
.panel-workflow .toolbar .btn-sm,
.panel-workflow .search-bulk-actions .btn-sm {
  font-size: var(--type-sm);
  padding: 7px 12px;
  border: var(--btn-wf-action-border);
  background: var(--btn-wf-action-bg);
  color: var(--btn-wf-action-color);
}
.panel-workflow .btn-search:hover {
  background: var(--btn-wf-search-bg-hover);
  color: var(--btn-wf-search-color);
  border-color: color-mix(in srgb, var(--ansaur-moss) 55%, var(--border-quiet-strong));
  transform: none;
  box-shadow: none;
}
.panel-workflow .row-tools-actions .btn-sm:hover:not(:disabled),
.panel-workflow .toolbar .btn-sm:hover:not(:disabled),
.panel-workflow .search-bulk-actions .btn-sm:hover:not(:disabled) {
  background: var(--btn-wf-action-bg-hover);
  color: var(--btn-wf-action-color);
  border-color: color-mix(in srgb, var(--ansaur-red) 50%, var(--border-quiet-strong));
  transform: none;
  box-shadow: none;
}
.panel-workflow .btn-search:active {
  transform: none;
  box-shadow: none;
  background: color-mix(in srgb, var(--ansaur-sage-soft) 100%, var(--surface-base));
}
.panel-workflow .row-tools-actions .btn-sm:active:not(:disabled),
.panel-workflow .toolbar .btn-sm:active:not(:disabled),
.panel-workflow .search-bulk-actions .btn-sm:active:not(:disabled) {
  transform: none;
  box-shadow: none;
  background: color-mix(in srgb, var(--ansaur-red-soft) 95%, var(--surface-base));
}
.panel-workflow .row-tools-actions .btn-sm.btn-black,
.panel-workflow .row-tools-actions .btn-sm.is-on {
  background: var(--btn-wf-action-on-bg);
  border-color: var(--btn-wf-action-on-border);
  color: var(--btn-wf-action-on-color);
}
.panel-workflow .row-tools-actions .btn-sm.btn-black:hover:not(:disabled),
.panel-workflow .row-tools-actions .btn-sm.is-on:hover:not(:disabled) {
  background: color-mix(in srgb, var(--ansaur-red-deep) 82%, var(--ansaur-moss-deep) 18%);
  border-color: var(--ansaur-red-deep);
  color: var(--text-on-rail);
  transform: none;
  box-shadow: none;
}
.panel-workflow .row-tools-actions .btn-sm.is-pending {
  opacity: 0.72;
  cursor: wait;
}
.panel-workflow .toolbar-filter-btn[aria-pressed="true"],
.panel-workflow .toolbar-filter-btn--open {
  background: var(--btn-wf-search-bg-hover);
  border-color: color-mix(in srgb, var(--ansaur-moss) 55%, var(--border-quiet-strong));
  color: var(--btn-wf-search-color);
  transform: none;
  box-shadow: none;
}
.panel-workflow .search-bulk-action-delete {
  background: var(--btn-wf-danger-bg);
  border: 1px solid var(--btn-wf-danger-border);
  color: var(--btn-wf-danger-color);
  font-weight: 600;
  box-shadow: none;
}
.panel-workflow .search-bulk-action-delete:hover:not(:disabled) {
  background: var(--btn-wf-danger-bg-hover);
  border-color: color-mix(in srgb, var(--ansaur-red-deep) 60%, transparent);
  transform: none;
  box-shadow: none;
}
.panel-workflow .row-tools-actions .btn-sm:focus-visible,
.panel-workflow .btn-search:focus-visible,
.panel-workflow .toolbar .btn-sm:focus-visible,
.panel-workflow .search-bulk-actions .btn-sm:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}
.reply-popover-actions .btn-sm {
  font-weight: 600;
  border: var(--btn-wf-action-border);
  border-radius: var(--btn-wf-radius);
  background: var(--btn-wf-action-bg);
  box-shadow: none;
  color: var(--btn-wf-action-color);
  transform: none;
}
.reply-popover-actions .btn-sm:hover:not(:disabled) {
  background: var(--btn-wf-action-bg-hover);
  color: var(--btn-wf-action-color);
  transform: none;
  box-shadow: none;
}
.reply-popover-actions .btn-sm.btn-black {
  background: var(--btn-wf-action-on-bg);
  border-color: var(--btn-wf-action-on-border);
  color: var(--btn-wf-action-on-color);
}
.reply-popover-actions .btn-sm.btn-black:hover:not(:disabled) {
  background: color-mix(in srgb, var(--ansaur-red-deep) 82%, var(--ansaur-moss-deep) 18%);
  border-color: var(--ansaur-red-deep);
  transform: none;
  box-shadow: none;
}

.rank-cell {
  min-width: 0;
  width: 1%;
  white-space: nowrap;
}

.th-rank {
  white-space: nowrap;
}
.th-rank-inner {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.th-rank-label {
  flex: 0 0 auto;
}
.rank-col-info-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  width: 27px;
  height: 27px;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  text-decoration: none;
  transition: color 0.15s ease, background-color 0.15s ease;
}
.rank-col-info-btn:hover {
  color: var(--ansaur-moss-deep);
  background: var(--ansaur-sage-soft);
}
.rank-col-info-btn:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}
.rank-col-info-icon {
  display: block;
  width: 20px;
  height: 20px;
}

.rank-toggle-btn {
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  padding: 5px 9px;
  border-radius: 4px;
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.1;
  white-space: nowrap;
  border: 1px solid transparent;
  cursor: pointer;
  transition:
    background 160ms cubic-bezier(0.23, 1, 0.32, 1),
    color 160ms cubic-bezier(0.23, 1, 0.32, 1),
    border-color 160ms cubic-bezier(0.23, 1, 0.32, 1),
    box-shadow 160ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 120ms cubic-bezier(0.23, 1, 0.32, 1);
}
.rank-toggle-btn:hover { filter: brightness(0.97); }
.rank-toggle-btn:active { transform: scale(0.96); }
.rank-toggle-ghost[data-state="pending"] {
  background: transparent;
  color: var(--text-muted);
  border: 1px dashed var(--ansaur-sage-muted);
}
.rank-toggle-ghost[data-state="yes"] {
  background: var(--ansaur-moss);
  color: var(--text-on-rail);
  border-color: var(--ansaur-moss);
}
.rank-toggle-ghost[data-state="no"] {
  background: var(--surface-base);
  color: var(--text-primary);
  border-color: var(--border-hairline);
  box-shadow: inset 0 0 0 1px var(--border-hairline);
}
.rank-on-page {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.rank-pos-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--ansaur-moss);
  color: var(--text-on-rail);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
@media (prefers-reduced-motion: reduce) {
  .rank-toggle-btn {
    transition: background 0.01ms, color 0.01ms, border-color 0.01ms, box-shadow 0.01ms;
  }
  .rank-toggle-btn:active { transform: none; }
}

.action-groups {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.action-research,
.action-workflow {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.action-chunky .action-research,
.action-chunky .action-workflow { gap: 6px; }

.row-search {
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}
.row-search-inline {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
}
.btn-search {
  display: inline-flex;
  align-items: center;
  font-size: var(--type-sm);
  font-weight: 700;
  padding: 7px 12px;
  border-radius: var(--btn-chunky-radius);
  border: var(--btn-chunky-border);
  box-shadow: var(--btn-chunky-shadow);
  background: var(--surface-base);
  color: var(--ansaur-moss);
  line-height: 1.2;
  font-family: var(--font-ui);
  text-decoration: none;
  white-space: nowrap;
  transition:
    transform 0.1s var(--ease-out-quart),
    box-shadow 0.1s var(--ease-out-quart),
    background 0.15s var(--ease-out-quart),
    color 0.15s var(--ease-out-quart);
}
.row-search-inline .btn-search:hover {
  background: var(--ansaur-sage-soft);
  color: var(--ansaur-moss-deep);
  transform: translate(-2px, -2px);
  box-shadow: var(--btn-chunky-shadow-hover);
}
.row-search-inline .btn-search:active {
  transform: translate(2px, 2px);
  box-shadow: var(--btn-chunky-shadow-press);
}
.row-workflow {
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}
.row-workflow .action-workflow {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.kw .social-badges {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-left: 8px;
  vertical-align: middle;
}
.social-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  font-size: var(--type-2xs);
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border: 1px solid var(--border-hairline);
  background: var(--surface-inset);
  color: var(--text-muted);
}
.social-badge-twitter { color: oklch(0.45 0.02 250); }
.social-badge-linkedin { color: oklch(0.42 0.08 250); }
.social-badge-reddit { color: oklch(0.5 0.16 35); }

.reply-popover {
  position: absolute;
  z-index: 10003;
  min-width: 220px;
  padding: 12px 14px;
  border-radius: 6px;
  background: var(--surface-base);
  border: 1px solid var(--border-hairline);
  box-shadow: 0 10px 28px oklch(0.34 0.06 155 / 0.16);
}
.reply-popover-kw {
  margin: 0 0 8px;
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-muted);
  line-height: 1.35;
}
.reply-popover-title {
  margin: 0 0 8px;
  font-size: var(--type-xs);
  font-weight: 600;
  color: var(--text-primary);
}
.reply-platforms {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}
.reply-chip {
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--ansaur-moss);
  background: transparent;
  color: var(--ansaur-moss);
  font-family: var(--font-ui);
  font-size: var(--type-sm);
  font-weight: 600;
  cursor: pointer;
  transition: background 140ms var(--ease-out-quart), color 140ms var(--ease-out-quart);
}
.reply-chip:hover {
  background: var(--ansaur-sage-soft);
}
.reply-chip.is-on {
  background: var(--ansaur-moss);
  color: var(--text-on-rail);
  border-color: var(--ansaur-moss);
}
.reply-popover-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.wf-card--written {
  border-color: oklch(0.52 0.08 250);
}
.wf-card--written .wf-card-badge {
  background: oklch(0.52 0.08 250);
  color: var(--text-on-rail);
}
.workflow-hide-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}
.workflow-hide-options {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
}
.workflow-hide-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--text-primary);
  cursor: pointer;
}
.workflow-hide-option input {
  margin: 0;
  accent-color: var(--ansaur-moss);
}

.wf-card--optimize {
  border-color: oklch(0.62 0.1 85);
}
.wf-card--optimize .wf-card-badge {
  background: oklch(0.62 0.1 85);
  color: var(--text-primary);
}
.wf-card--replied {
  border-color: oklch(0.55 0.12 320);
}
.wf-card--replied .wf-card-badge {
  background: oklch(0.55 0.12 320);
  color: var(--text-on-rail);
}
.action-divider {
  width: 1px;
  height: 28px;
  background: var(--border-hairline);
  flex-shrink: 0;
}

/* Chunky neubrut buttons — DESIGN.md: 3px moss stroke, hard offset shadow */
.btn-sm,
.btn-md,
.btn:not(.btn-export):not(.btn-inline-link) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-family: var(--font-ui);
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.2;
  cursor: pointer;
  border: var(--btn-chunky-border);
  border-radius: var(--btn-chunky-radius);
  box-shadow: var(--btn-chunky-shadow);
  transition:
    transform 0.1s var(--ease-out-quart),
    box-shadow 0.1s var(--ease-out-quart),
    background 0.15s var(--ease-out-quart),
    color 0.15s var(--ease-out-quart),
    border-color 0.15s var(--ease-out-quart);
}
.btn-sm {
  font-size: var(--type-sm);
  padding: 8px 14px;
}
.btn-md {
  font-size: var(--type-base);
  padding: 12px 20px;
}
.btn {
  font-size: var(--type-md);
  padding: 10px 18px;
}
.btn-sm:hover:not(:disabled),
.btn-md:hover:not(:disabled),
.btn:not(.btn-export):not(.btn-inline-link):hover:not(:disabled) {
  transform: translate(-2px, -2px);
  box-shadow: var(--btn-chunky-shadow-hover);
}
.btn-sm:active:not(:disabled),
.btn-md:active:not(:disabled),
.btn:not(.btn-export):not(.btn-inline-link):active:not(:disabled) {
  transform: translate(2px, 2px);
  box-shadow: var(--btn-chunky-shadow-press);
}
.btn-sm:disabled,
.btn-md:disabled,
.btn:not(.btn-export):disabled {
  opacity: 0.45;
  cursor: not-allowed;
  transform: none;
  box-shadow: var(--btn-chunky-shadow-press);
}

.btn-primary {
  background: var(--accent-red);
  color: var(--text-on-rail);
  border-color: var(--nb-stroke);
}
.btn-primary:hover:not(:disabled) {
  background: var(--accent-red-deep);
}
.btn-secondary {
  background: var(--surface-base);
  color: var(--nb-stroke);
  border-color: var(--nb-stroke);
}
.btn-secondary:hover:not(:disabled) {
  background: var(--ansaur-sage-soft);
}
.btn-ghost {
  background: var(--surface-base);
  color: var(--ansaur-moss);
  border-color: var(--nb-stroke);
}
.btn-ghost:hover:not(:disabled) {
  background: var(--ansaur-sage-soft);
  color: var(--ansaur-moss-deep);
}
.toolbar-filter-btn[aria-pressed="true"],
.toolbar-filter-btn--open {
  background: var(--ansaur-sage-soft);
  color: var(--ansaur-moss-deep);
  border-color: var(--nb-stroke);
  box-shadow: var(--btn-chunky-shadow-press);
  transform: translate(2px, 2px);
}
.btn-black {
  background: var(--ansaur-moss);
  color: var(--text-on-rail);
  border-color: var(--nb-stroke);
}
.btn-black:hover:not(:disabled) {
  background: var(--ansaur-moss-deep);
}
.btn-sm.btn-outline-dark,
.btn-md.btn-outline-dark,
.btn-sm.btn-outline-sage,
.btn-md.btn-outline-sage {
  background: var(--surface-base);
}
.btn-outline-dark {
  color: var(--ansaur-moss);
  border-color: var(--nb-stroke);
}
.btn-outline-dark:hover:not(:disabled) {
  background: var(--ansaur-sage-soft);
}
.btn-outline-sage {
  color: var(--ansaur-moss);
  border-color: var(--nb-stroke);
}
.btn-outline-sage:hover:not(:disabled) {
  background: var(--ansaur-sage-soft);
}

.jobs-hero-btn {
  padding: 14px 24px;
  font-size: var(--type-lg);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.jobs-seed-run-btn.jobs-hero-btn {
  text-transform: none;
  letter-spacing: 0.01em;
  font-size: var(--type-md);
  font-weight: 600;
  padding: 12px 18px;
}

.prefix-hide-dropdown {
  position: relative;
}
.prefix-hide-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 40;
  min-width: 11rem;
  max-height: 18rem;
  overflow-y: auto;
  padding: 8px 0;
  background: var(--surface-raised, #fff);
  border: 1px solid var(--border-hairline);
  border-radius: 6px;
  box-shadow: 0 8px 24px color-mix(in srgb, var(--ansaur-moss-deep) 12%, transparent);
}
.prefix-hide-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--text-primary);
  cursor: pointer;
  white-space: nowrap;
}
.prefix-hide-option:hover {
  background: var(--ansaur-sage-soft);
}
.prefix-hide-option input {
  margin: 0;
  accent-color: var(--ansaur-moss);
}
.prefix-hide-empty {
  margin: 0;
  padding: 6px 14px;
  font-size: var(--type-sm);
  color: var(--text-muted);
}
.btn-export {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  color: var(--ansaur-moss);
  text-decoration: none;
  border: none;
  outline: none;
  box-shadow: none;
  padding: 0;
  font-family: var(--font-ui);
  font-size: var(--type-sm);
  font-weight: 500;
  cursor: pointer;
}
.btn-export:hover:not(:disabled) {
  color: var(--ansaur-moss-deep);
  background: transparent;
}
.btn-export:disabled {
  opacity: 0.5;
  cursor: wait;
}
.grid-top-bar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 10px 24px 0;
}
.btn-icon {
  flex-shrink: 0;
  display: block;
}
.search {
  font-family: var(--font-ui);
  font-size: var(--type-base);
  padding: 10px 14px;
  border: 1px solid var(--border-hairline);
  border-radius: 4px;
  width: 220px;
  background: var(--surface-base);
}
.search:focus-visible {
  outline: none;
  border-color: var(--accent-primary);
  box-shadow: var(--focus-ring);
}
.progress-track {
  height: 6px;
  background: var(--surface-inset);
  border-radius: 3px;
  overflow: hidden;
  flex: 1;
  max-width: 200px;
}
.progress-fill {
  height: 100%;
  background: var(--ansaur-moss);
  border-radius: 3px;
}
.progress-track.wide { max-width: none; flex: 1; }

.page-header {
  padding: 20px 24px 8px;
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.page-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--type-2xl);
  margin: 0;
  letter-spacing: var(--display-tracking);
  line-height: 1.2;
}
.page-meta { color: var(--text-muted); font-size: var(--type-md); }
.toolbar-sort { color: var(--text-muted); font-size: var(--type-sm); flex-shrink: 0; white-space: nowrap; }
.toolbar-filters {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.nav-group-label {
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  margin: 20px 0 8px;
  text-transform: uppercase;
}
.nav-divider {
  height: 1px;
  margin: 16px 0 4px;
  background: var(--rail-divider);
  border: none;
}
.nav-divider-buffer {
  margin: 24px 0 8px;
}
.nav-group-buffer {
  margin-top: 4px;
}
.nav-soon { opacity: 0.85; }
.soon-badge {
  font-size: var(--type-2xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 2px 6px;
  border-radius: 3px;
  background: var(--ansaur-sage-soft);
  color: var(--text-muted);
  vertical-align: middle;
}

.run-panel { padding: 24px 32px 56px; max-width: 720px; }
.run-panel.jobs-desk {
  max-width: none;
  padding: 20px 28px 48px;
}
.run-section { margin-bottom: 28px; }
.run-page-header .page-meta { max-width: 40ch; }
.jobs-command-header .page-meta { max-width: none; }

/* --- Neubrutal surfaces & buttons (Run tab) --- */
.nb-surface {
  background: var(--surface-base);
  border: 3px solid var(--nb-stroke);
  border-radius: 0;
  box-shadow: var(--nb-shadow);
  padding: 20px;
}
.nb-btn {
  display: inline-block;
  margin: 0;
  padding: 14px 28px;
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: center;
  cursor: pointer;
  border: 3px solid var(--nb-stroke);
  border-radius: 0;
  box-shadow: var(--nb-shadow);
  transition: transform 0.08s ease-out, box-shadow 0.08s ease-out;
  line-height: 1.1;
}
.nb-btn:hover:not(:disabled) {
  transform: translate(-2px, -2px);
  box-shadow: var(--nb-shadow-lg);
}
.nb-btn:active:not(:disabled) {
  transform: translate(2px, 2px);
  box-shadow: var(--nb-shadow-press);
}
.nb-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  transform: none;
  box-shadow: var(--nb-shadow-press);
}
.nb-btn-red {
  background: var(--accent-red);
  color: var(--text-on-rail);
}
.nb-btn-red:hover:not(:disabled) { background: var(--accent-red-deep); }
.nb-btn-white {
  background: var(--surface-base);
  color: var(--nb-stroke);
}
.nb-btn-black {
  background: var(--nb-stroke);
  color: var(--text-on-rail);
}
.nb-btn-sm {
  padding: 10px 16px;
  font-size: var(--type-sm);
  letter-spacing: 0.03em;
}
.nb-badge {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  font-weight: 600;
  padding: 4px 10px;
  border: 2px solid var(--nb-stroke);
  box-shadow: 2px 2px 0 var(--nb-stroke);
}
.nb-badge-cost {
  background: var(--nb-yellow);
  color: var(--nb-stroke);
}
.nb-badge-optional {
  background: var(--surface-inset);
  color: var(--text-muted);
  margin-right: 8px;
}
.nb-field { display: flex; flex-direction: column; gap: 6px; margin: 12px 0; max-width: 100%; }
.nb-field-label, .nb-field .nb-field-label {
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.nb-input, .nb-textarea {
  font-family: var(--font-mono);
  font-size: var(--type-md);
  padding: 12px 14px;
  border: 3px solid var(--nb-stroke);
  border-radius: 0;
  background: var(--surface-base);
  color: var(--text-primary);
  width: 100%;
  box-shadow: inset 2px 2px 0 var(--input-inset);
}
.nb-input:focus, .nb-textarea:focus {
  outline: none;
  box-shadow: inset 2px 2px 0 var(--input-inset), 0 0 0 2px var(--ansaur-moss);
}
.nb-file {
  display: block;
  margin: 8px 0 16px;
  font-size: var(--type-md);
  font-family: var(--font-ui);
}

/* Pipeline */
.pipeline-header { margin-bottom: 20px; }
.pipeline-header-title {
  font-family: var(--font-display);
  font-size: var(--type-3xl);
  font-weight: 700;
  margin: 0 0 8px;
  letter-spacing: var(--display-tracking);
  line-height: 1.2;
}
.pipeline-header-lead {
  margin: 0;
  font-size: var(--type-base);
  line-height: 1.5;
  color: var(--text-muted);
  max-width: 48ch;
}
.pipeline-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.pipeline-step {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 12px;
  margin-bottom: 0;
  position: relative;
}
.pipeline-step:not(:last-child) .pipeline-rail::after {
  content: "";
  position: absolute;
  left: 23px;
  top: 48px;
  bottom: -8px;
  width: 3px;
  background: var(--nb-stroke);
}
.pipeline-rail { position: relative; padding-top: 8px; }
.pipeline-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  font-family: var(--font-display);
  font-size: var(--type-3xl);
  font-weight: 700;
  background: var(--ansaur-moss);
  color: var(--text-on-rail);
  border: 3px solid var(--nb-stroke);
  box-shadow: var(--nb-shadow);
}
.pipeline-step-optional .pipeline-num {
  background: var(--surface-inset);
  color: var(--text-muted);
}
.pipeline-card {
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pipeline-card-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}
.pipeline-title {
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
  margin: 0;
  flex: 1;
  min-width: 160px;
  letter-spacing: var(--display-tracking);
  line-height: 1.25;
}
.pipeline-outcome {
  margin: 0;
  font-size: var(--type-base);
  line-height: 1.45;
  color: var(--text-primary);
}
.pipeline-then {
  margin: 0;
  font-size: var(--type-md);
  color: var(--text-muted);
}
.pipeline-then strong { color: var(--ansaur-moss); }
.pipeline-card .nb-btn { align-self: flex-start; margin-top: 4px; }

.pipeline-dest {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  padding: 16px 20px;
}
.pipeline-dest-label {
  font-size: var(--type-md);
  font-weight: 600;
  color: var(--text-muted);
}
.pipeline-dest-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* Advanced jobs */
.advanced-fold {
  padding: 16px 20px;
}
.advanced-fold-summary {
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}
.advanced-fold-summary::-webkit-details-marker { display: none; }
.advanced-list { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.advanced-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  flex-wrap: wrap;
}
.advanced-row-text { flex: 1; min-width: 200px; }
.advanced-row .nb-btn { flex-shrink: 0; }

/* Harvest job groups */
.harvest-section { padding: 16px 20px; }
.harvest-group-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.harvest-group-text { flex: 1; min-width: 200px; }
.harvest-sub-fold { margin-top: 14px; border-top: 1px solid var(--border-hairline); padding-top: 12px; }
.harvest-sub-summary {
  font-family: var(--font-ui);
  font-size: var(--type-md);
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  color: var(--text-muted);
}
.harvest-sub-summary::-webkit-details-marker { display: none; }
.harvest-sub-list {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 280px;
  overflow-y: auto;
}
.harvest-sub-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px solid var(--border-hairline);
}
.harvest-sub-row:last-child { border-bottom: none; }
.harvest-sub-label { font-size: var(--type-md); }

/* Import */
.import-panel { margin-bottom: 12px; }
.import-panel-second { margin-top: 12px; }
.import-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 12px;
}
.import-file-hint {
  font-size: var(--type-sm);
  color: var(--text-muted);
  margin: 4px 0 8px;
}

/* Live progress */
.job-status-live {
  border-color: var(--ansaur-moss);
  background: var(--ansaur-sage-soft);
}
.job-active {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  margin-top: 12px;
}
.job-active-top {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 12px;
  font-size: var(--type-base);
  flex-wrap: wrap;
}
.job-active-top .mono { font-family: var(--font-mono); }
.job-idle { color: var(--text-muted); font-size: var(--type-base); margin: 12px 0 0; }
.job-failed .job-msg { color: var(--accent-red-deep); font-size: var(--type-md); white-space: pre-wrap; }

/* Global job bar (all panels) */
.global-job-bar {
  margin: 0 0 16px;
  padding: 12px 16px;
  border: 1px solid var(--border-hairline);
  background: var(--surface-raised);
  border-radius: 4px;
}
.global-job-live {
  border-color: var(--ansaur-moss);
  background: var(--ansaur-sage-soft);
}
.global-job-failed {
  border-color: var(--accent-red-deep);
}
.global-job-top {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 8px;
  font-size: var(--type-base);
}
.job-module-badge {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: var(--type-2xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 8px;
  background: var(--ansaur-moss-deep);
  color: var(--text-on-accent);
  border-radius: 2px;
}
.jobs-module-section {
  border-top: 2px solid var(--border-hairline);
  padding-top: 8px;
}

.run-heading {
  font-family: var(--font-display);
  font-size: var(--type-md);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0 0 12px;
}

.test-results { margin-top: 16px; padding-top: 12px; border-top: 3px solid var(--nb-stroke); }
.test-summary { font-weight: 700; margin: 0 0 8px; font-size: var(--type-base); }
.test-summary-ok { color: var(--accent-red); }
.test-summary-fail { color: var(--danger); }
.test-steps { list-style: none; margin: 0; padding: 0; }
.test-step {
  display: grid;
  grid-template-columns: 20px 140px 1fr;
  gap: 8px;
  padding: 6px 0;
  font-size: var(--type-md);
  border-bottom: 1px solid var(--border-hairline);
}
.test-step:last-child { border-bottom: none; }
.test-step-icon { font-weight: 700; }
.test-step.ok .test-step-icon { color: var(--accent-red); }
.test-step.warn .test-step-icon { color: var(--signal-check); }
.test-step.fail .test-step-icon { color: var(--danger); }
.test-step-name { font-weight: 600; }
.test-step-msg { font-family: var(--font-mono); font-size: var(--type-sm); color: var(--text-muted); }

/* Gaps / Filmed / Archived — keep row actions on one line */
@media (max-width: 1200px) {
  .search-cell,
  .row-tools-cell,
  .actions-cell { width: 1%; }
  .action-groups,
  .action-research,
  .action-workflow,
  .row-search,
  .row-search-inline,
  .row-tools-actions,
  .row-workflow {
    flex-wrap: nowrap;
  }
  .action-chunky .btn-md {
    font-size: var(--type-2xs);
    padding: 5px 8px;
    white-space: nowrap;
  }
  .rank-toggle-btn {
    font-size: var(--type-2xs);
    padding: 4px 7px;
  }
  .jobs-run-grid,
  .jobs-scout-grid,
  .jobs-auto-grid,
  .jobs-patrol-grid,
  .jobs-detail-grid {
    grid-template-columns: 1fr;
  }
  .jobs-command-body {
    grid-template-columns: 1fr;
  }
  .jobs-command-rail {
    position: static;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }
}

@media (max-width: 720px) {
  .pipeline-step { grid-template-columns: 1fr; }
  .pipeline-rail { display: none; }
  .pipeline-step:not(:last-child) .pipeline-rail::after { display: none; }
  .advanced-row { flex-direction: column; }
  .advanced-row .nb-btn { width: 100%; }
  .pipeline-dest { flex-direction: column; align-items: stretch; }
  .pipeline-dest-links .nb-btn { flex: 1; }
  .run-panel { padding: 16px; }
  .jobs-command-rail { grid-template-columns: 1fr; }
  .jobs-status-strip-inner { flex-direction: column; align-items: flex-start; }
  .jobs-hero-credits { margin-left: 0; width: 100%; }
  .jobs-auto-head { flex-direction: column; }
  .test-step { grid-template-columns: 20px 1fr; }
  .test-step-msg { grid-column: 2; }
}

.budget-line {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
  font-size: var(--type-base);
  padding: 16px;
  background: var(--surface-raised);
  border-radius: 6px;
  border: 1px solid var(--border-hairline);
}
.cap-input {
  width: 48px;
  font-family: var(--font-mono);
  font-size: var(--type-md);
  padding: 4px 6px;
  border: 1px solid var(--border-hairline);
  border-radius: 4px;
}

.coming-soon {
  padding: 48px 56px;
  max-width: 560px;
}
.cs-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--type-5xl);
  margin: 0;
  letter-spacing: var(--display-tracking);
  line-height: 1.15;
}
.cs-accent {
  width: 48px;
  height: 4px;
  background: var(--ansaur-moss);
  margin: 16px 0 24px;
}
.cs-lead {
  font-size: var(--type-lg);
  line-height: 1.55;
  color: var(--text-primary);
  margin: 0 0 20px;
}
.cs-list {
  margin: 0 0 24px;
  padding-left: 20px;
  line-height: 1.6;
  color: var(--text-muted);
}
.cs-tag {
  display: inline-block;
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 6px 12px;
  background: var(--ansaur-sage-soft);
  color: var(--ansaur-moss-deep);
  border-radius: 4px;
}

/* --- Variant A: Broadcast Rail --- */
.variant-a {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  min-height: 100vh;
  --shell-rail-active-width: 240px;
  --rail-toggle-inset-top: 4px;
  --rail-toggle-inset-left: 4px;
  --rail-toggle-slot: 32px;
  --shell-brand-left: 36px;
  --shell-chrome-width: 132px;
  --shell-chrome-height: 36px;
  --shell-control-height: 28px;
  --top-nav-height: 48px;
  --shell-chrome-top: var(--rail-toggle-inset-top);
  --rail-head-gap: 4px;
  --rail-top-inset: calc(var(--shell-chrome-top) + var(--shell-control-height) + var(--rail-head-gap));
  --shell-collapse-ms: 260ms;
  --shell-collapse-ease: cubic-bezier(0.32, 0.72, 0, 1);
}
.variant-a.is-rail-collapsed {
  --shell-chrome-top: calc((var(--top-nav-height) - var(--shell-control-height)) / 2);
  --shell-rail-active-width: 0px;
}
.variant-a .rail {
  flex: 0 0 240px;
  width: 240px;
  min-width: 240px;
  background: var(--surface-rail);
  color: var(--text-primary);
  border-right: 1px solid var(--border-hairline);
  padding: var(--rail-top-inset) 20px 0;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  align-self: flex-start;
  height: 100vh;
  max-height: 100vh;
  overflow: hidden;
  z-index: 200;
  box-sizing: border-box;
  isolation: isolate;
  transition:
    width var(--shell-collapse-ms) var(--shell-collapse-ease),
    flex-basis var(--shell-collapse-ms) var(--shell-collapse-ease),
    min-width var(--shell-collapse-ms) var(--shell-collapse-ease),
    padding var(--shell-collapse-ms) var(--shell-collapse-ease),
    opacity 200ms var(--ease-out-quart),
    border-color 200ms var(--ease-out-quart);
}
.rail-head {
  flex-shrink: 0;
  position: relative;
  z-index: 3;
  background: var(--surface-rail);
}
.rail-scroll {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-top: 8px;
  padding-bottom: 24px;
  scrollbar-width: thin;
  scrollbar-color: var(--border-hairline) transparent;
}
.rail-scroll::-webkit-scrollbar {
  width: 6px;
}
.rail-scroll::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: var(--border-hairline);
}
.rail-scroll > .nav-group-label:first-child {
  margin-top: 8px;
}
.variant-a.is-rail-collapsed .rail {
  flex-basis: 0;
  width: 0;
  min-width: 0;
  padding-left: 0;
  padding-right: 0;
  opacity: 0;
  border-right-color: transparent;
  pointer-events: none;
}
.rail-usage-stage {
  display: grid;
  position: relative;
  z-index: 2;
  margin-top: 0;
  margin-bottom: 8px;
}
.rail-usage-layer {
  grid-area: 1 / 1;
  position: relative;
  z-index: 1;
  margin-top: 10px;
  filter: blur(0);
}
.rail-usage-layer--generations {
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
}
.rail-usage-layer--generations .rail-credits--writers {
  margin-top: 0;
}
.variant-a.is-optlab-panel .rail-usage-layer--credits {
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
}
.variant-a.is-optlab-panel .rail-usage-layer--generations {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.variant-a.is-optlab-panel .main {
  align-self: stretch;
  min-height: 100dvh;
}
.variant-a.is-optlab-panel .content {
  display: flex;
  flex-direction: column;
}
.app-logo--research,
.app-logo--writer {
  transform-origin: 88% 100%;
}
.rail-credits {
  position: relative;
  z-index: 1;
  margin-top: 0;
  margin-bottom: 0;
  padding: 12px 12px 10px;
  background: var(--surface-base);
  border: 1px solid var(--border-hairline);
  border-radius: 6px;
}
.rail-credits--low .progress-fill.rail-credits-fill {
  background: var(--ansaur-amber, #c9a227);
}
.rail-credits--empty {
  border-color: var(--ansaur-red-deep);
  background: var(--ansaur-red-deep);
  color: var(--ansaur-white);
}
.rail-credits--empty .rail-credits-label,
.rail-credits--empty .rail-credits-meta,
.rail-credits--empty .rail-credits-foot {
  color: color-mix(in srgb, var(--ansaur-white) 88%, transparent);
}
.rail-credits--empty .rail-credits-topup {
  color: var(--ansaur-white);
}
.rail-credits--empty .rail-credits-topup:hover {
  color: color-mix(in srgb, var(--ansaur-white) 82%, var(--ansaur-red));
}
.rail-credits--empty .rail-credits-track {
  background: color-mix(in srgb, var(--ansaur-white) 18%, var(--ansaur-red-deep));
}
.rail-credits--empty .progress-fill.rail-credits-fill {
  background: color-mix(in srgb, var(--ansaur-white) 72%, transparent);
}
.rail-credits-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.rail-credits-label {
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.rail-credits-topup {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  font-size: var(--type-2xs);
  font-weight: 600;
  letter-spacing: 0.02em;
  text-align: right;
  white-space: nowrap;
  flex-shrink: 0;
  color: var(--text-faint);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.rail-credits-topup:hover {
  color: var(--ansaur-red);
}
.rail-credits-meta {
  font-size: var(--type-xs);
  color: var(--text-secondary, var(--text-muted));
}
.rail-credits-track {
  max-width: none;
  height: 5px;
  background: var(--surface-inset);
}
.rail-credits-fill {
  background: var(--ansaur-moss);
  transition: width 0.35s var(--ease-out-expo, ease-out);
}
.rail-credits-foot-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-top: 6px;
}
.rail-credits-foot {
  margin: 0;
  flex: 1;
  min-width: 0;
  font-size: var(--type-2xs);
  color: var(--text-muted);
  line-height: 1.3;
}
.rail-credits--loading {
  opacity: 0.55;
}
.rail-credits--writers {
  margin-top: 4px;
}
.rail-credits--writers .rail-credits-foot {
  margin: 6px 0 0;
}
.rail-user {
  position: relative;
  z-index: 1;
  margin-top: 8px;
  margin-bottom: 0;
  padding: 10px 12px;
  background: var(--surface-base);
  border: 1px solid var(--border-hairline);
  border-radius: 6px;
}
a.rail-user--link {
  display: block;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition:
    border-color 0.15s ease,
    background 0.15s ease;
}
a.rail-user--link:hover {
  border-color: var(--ansaur-sage-muted);
  background: color-mix(in srgb, var(--ansaur-sage-soft) 45%, var(--surface-base));
}
a.rail-user--link:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}
.rail-user--active {
  border-color: var(--ansaur-moss);
  background: color-mix(in srgb, var(--ansaur-sage-soft) 55%, var(--surface-base));
}
.rail-user--loading {
  opacity: 0.55;
}
.rail-user--local .rail-user-meta {
  margin: 4px 0 0;
  font-size: var(--type-xs);
  color: var(--text-muted);
}
.rail-user-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}
.rail-user-label {
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.rail-user-plan {
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ansaur-moss-deep);
  background: var(--ansaur-sage-soft);
  border-radius: 4px;
  padding: 2px 6px;
}
.rail-user-email {
  margin: 0;
  min-width: 0;
  max-width: 100%;
  font-size: var(--type-2xs);
  line-height: 1.3;
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.account-panel .account-dl {
  margin: 0;
  display: grid;
  gap: 12px;
}
.account-dl-row {
  display: grid;
  grid-template-columns: minmax(8rem, 11rem) 1fr;
  gap: 12px;
  align-items: baseline;
}
.account-dl-row dt {
  margin: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
}
.account-dl-row dd {
  margin: 0;
  font-size: var(--type-sm);
}
.account-email-value {
  overflow-wrap: anywhere;
}
.account-plan-badge {
  display: inline-block;
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ansaur-moss-deep);
  background: var(--surface-muted-fill);
  border: 1px solid var(--border-quiet);
  border-radius: 4px;
  padding: 3px 8px;
}
.account-credit-remaining {
  font-weight: 600;
  color: var(--text-primary);
}
.account-page-header .page-meta {
  max-width: 52ch;
}
.account-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 12px;
}
.account-actions--solo {
  margin-top: 0;
}
.account-actions--inline {
  margin-top: 8px;
}
.account-form {
  display: grid;
  gap: 12px;
  max-width: 28rem;
  margin-top: 0;
}
.account-form-hint {
  margin: -4px 0 0;
}
.account-subsection {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--border-quiet);
}
.account-subsection:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}
.account-subsection-title {
  margin: 0 0 8px;
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--text-primary);
}
.account-subsection-lead {
  margin-bottom: 8px;
}
.account-usage-block {
  margin-top: 16px;
}
.account-usage-lead {
  margin-bottom: 8px;
}
.account-usage-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--border-quiet);
  border-radius: 6px;
  background: var(--surface-base);
}
.account-usage-scroll:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}
.account-status {
  margin: 0 0 16px;
  padding: 10px 12px;
  border-radius: 6px;
  border: 1px solid var(--border-quiet);
  font-size: var(--type-sm);
  line-height: 1.45;
}
.account-status--success {
  background: var(--surface-muted-fill);
  border-color: var(--border-quiet-strong);
  color: var(--ansaur-moss-deep);
}
.account-status--error {
  background: color-mix(in srgb, var(--ansaur-red) 12%, var(--surface-base));
  border-color: color-mix(in srgb, var(--ansaur-red) 28%, var(--border-quiet));
  color: var(--ansaur-red-deep);
}
.account-usage-table {
  margin: 0;
  border: none;
}
.account-usage-table .num {
  text-align: right;
  width: 5rem;
}
.account-usage-empty td {
  padding: 16px;
  color: var(--text-muted);
  font-size: var(--type-md);
  line-height: 1.5;
}
.account-signout {
  color: var(--ansaur-red-deep);
}
.account-signout:hover:not(:disabled) {
  background: color-mix(in srgb, var(--ansaur-red) 8%, var(--surface-base));
  color: var(--ansaur-red-deep);
  border-color: color-mix(in srgb, var(--ansaur-red) 24%, var(--border-quiet-strong));
}
.account-panel[aria-busy="true"] .account-form input:disabled,
.account-panel[aria-busy="true"] [data-account-magic-link]:disabled,
.account-panel[aria-busy="true"] [data-account-signout]:disabled {
  cursor: wait;
  opacity: 0.72;
}
@media (max-width: 520px) {
  .account-dl-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .account-actions .btn-md {
    min-height: 44px;
  }
}
.rail-scroll > .nav-group-label:first-child {
  margin-top: 8px;
}
.variant-a .rail-wordmark {
  font-family: var(--font-wordmark);
  font-weight: 600;
  font-size: 1.5rem;
  margin: 0;
  letter-spacing: -0.02em;
  line-height: 1.1;
  flex: 1;
  min-width: 0;
}
.variant-a .rail-wordmark-brand {
  color: var(--ansaur-moss);
}
.variant-a .rail-wordmark-tld {
  color: var(--ansaur-sage);
  font-weight: 500;
}
/* legacy alias */
.variant-a .rail-title {
  font-family: var(--font-wordmark);
  font-weight: 600;
  font-size: 1.5rem;
  margin: 0 0 28px;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--ansaur-moss);
}
.rail-mascot-corner {
  position: absolute;
  top: 14px;
  right: 0;
  z-index: 0;
  width: 0;
  height: 0;
  overflow: visible;
  pointer-events: none;
}
.rail-mascot-corner .app-logo {
  --mascot-perch: translate(16%, -92%);
  position: absolute;
  top: 0;
  right: 0;
  width: var(--app-mascot-size);
  transform: var(--mascot-perch);
  z-index: 0;
  pointer-events: auto;
}
.rail-mascot-corner .app-logo--research {
  --mascot-perch: translate(16%, calc(-92% - 5px));
  width: 60px;
}
.variant-a:not(.is-optlab-panel) .app-logo--writer,
.variant-a.is-optlab-panel .app-logo--research {
  opacity: 0;
  pointer-events: none;
}
.app-logo {
  position: absolute;
  display: block;
  width: var(--app-mascot-size);
  flex-shrink: 0;
  line-height: 0;
  text-decoration: none;
  z-index: 1;
  transition: transform 160ms var(--ease-out-quart);
}
@media (hover: hover) and (pointer: fine) {
  .rail-mascot-corner .app-logo--research:hover {
    transform: translate(16%, calc(-92% - 7px));
  }
  .rail-mascot-corner .app-logo--writer:hover {
    transform: translate(16%, calc(-92% - 2px)) rotate(-2deg);
  }
}
.rail-mascot-corner .app-logo:active {
  transform: var(--mascot-perch) scale(0.97);
}
.app-logo img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: top center;
}
.app-logo--writer img {
  object-position: bottom center;
}
.variant-a .nav-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  margin: 0 -4px;
  border-radius: 4px;
  font-size: var(--type-base);
  color: var(--text-muted);
  text-decoration: none;
  font-weight: 500;
}
.variant-a .nav-label {
  flex: 1;
  min-width: 0;
}
.variant-a .nav-item:hover {
  color: var(--text-primary);
  background: var(--ansaur-sage-soft);
}
.variant-a .nav-item.active {
  background: var(--ansaur-sage);
  color: var(--ansaur-moss-deep);
  font-weight: 600;
}
.variant-a .nav-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.75rem;
  padding: 2px 9px;
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
  background: var(--ansaur-sage-soft);
  color: var(--ansaur-moss);
  flex-shrink: 0;
}
.variant-a .nav-item.active .nav-count {
  background: var(--ansaur-moss-deep);
  color: var(--text-on-rail);
}
.nav-group-parent {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 8px 6px;
  margin-top: 4px;
}
.nav-group-parent-label {
  font-size: var(--type-base);
  font-weight: 600;
  color: var(--text-primary);
  line-height: var(--leading-tight);
}
.variant-a .nav-sub-item {
  padding: 8px 12px 8px 32px;
  font-size: var(--type-md);
}
.variant-a .nav-sub-item.active {
  background: var(--ansaur-sage);
  color: var(--ansaur-moss-deep);
  font-weight: 600;
}
.variant-a .rail-footer { margin-top: auto; padding-top: 24px; }

/* Sidebar collapse toggle */
.rail-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  transition:
    transform 160ms var(--ease-out-quart),
    color 0.12s ease,
    border-color 0.12s ease,
    background 0.12s ease;
}
@media (hover: hover) and (pointer: fine) {
  .rail-toggle:hover {
    color: var(--text-primary);
    border-color: var(--border-hairline);
    background: var(--surface-base);
  }
  .rail-toggle:hover .rail-toggle-icon {
    transform: rotate(-8deg);
  }
}
.rail-toggle:active {
  transform: scale(0.97);
}
.rail-toggle:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}
.rail-toggle[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  padding: 4px 8px;
  border-radius: 4px;
  background: var(--ansaur-moss-deep);
  color: var(--text-on-rail);
  font-family: var(--font-ui);
  font-size: var(--type-xs);
  font-weight: 500;
  line-height: 1.3;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translateX(-50%) scale(0.97);
  transform-origin: top center;
  transition:
    opacity 140ms var(--ease-out-quart),
    transform 140ms var(--ease-out-quart),
    visibility 140ms var(--ease-out-quart);
  z-index: 20;
}
.rail-toggle[data-tooltip]:hover::after,
.rail-toggle[data-tooltip]:focus-visible::after {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) scale(1);
}
.rail-toggle-icon {
  display: inline-block;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.12em;
  transform-origin: center;
  transition: transform 180ms var(--ease-out-quart);
}
@keyframes rail-toggle-twist {
  0% { transform: rotate(0deg) scale(1); }
  42% { transform: rotate(-14deg) scale(0.94); }
  100% { transform: rotate(0deg) scale(1); }
}
.rail-toggle-icon--twist {
  animation: rail-toggle-twist 220ms var(--ease-out-quart);
}
.rail-toggle--shell {
  position: fixed;
  top: calc(var(--shell-chrome-top) + env(safe-area-inset-top, 0px));
  left: calc(var(--rail-toggle-inset-left) + env(safe-area-inset-left, 0px));
  z-index: 10060;
  width: var(--shell-control-height);
  height: var(--shell-control-height);
  transition: top var(--shell-collapse-ms) var(--shell-collapse-ease);
}
.rail-toggle--shell:active {
  transform: none;
}
.rail-toggle--shell:active .rail-toggle-icon {
  transform: scale(0.94);
}
.rail-toggle--shell .rail-toggle-icon {
  font-size: 1rem;
}
.shell-brand {
  position: fixed;
  top: calc(var(--shell-chrome-top) + env(safe-area-inset-top, 0px));
  left: calc(var(--shell-brand-left) + env(safe-area-inset-left, 0px));
  z-index: 10060;
  display: flex;
  align-items: center;
  height: var(--shell-control-height);
  font-family: var(--font-wordmark);
  font-weight: 600;
  font-size: 1.125rem;
  letter-spacing: -0.02em;
  line-height: 1.1;
  text-decoration: none;
  white-space: nowrap;
  transition: top var(--shell-collapse-ms) var(--shell-collapse-ease);
}
.shell-wordmark-brand {
  color: var(--ansaur-moss);
}
.shell-wordmark-tld {
  color: var(--ansaur-sage);
  font-weight: 500;
}
@media (max-width: 900px) {
  .variant-a:not(.is-rail-collapsed) .rail-toggle--shell,
  .variant-a:not(.is-rail-collapsed) .shell-brand {
    display: none;
  }
}
.rail-toggle--mobile {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .rail-toggle,
  .rail-toggle-icon,
  .rail-toggle[data-tooltip]::after {
    transition: none;
    animation: none;
  }
  .rail-toggle:active {
    transform: none;
  }
  .rail-toggle:hover .rail-toggle-icon {
    transform: none;
  }
  .variant-a .rail,
  .top-nav,
  .rail-toggle--shell,
  .shell-brand {
    transition: opacity 120ms ease;
  }
  .variant-a.is-rail-collapsed .top-nav {
    transform: none;
  }
}

/* Horizontal top nav (sidebar collapsed) */
.top-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 250;
  transform: translateY(-100%);
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  background: var(--surface-base);
  border-bottom: 1px solid transparent;
  box-shadow: none;
  transition:
    transform var(--shell-collapse-ms) var(--shell-collapse-ease),
    opacity 200ms var(--ease-out-quart),
    border-color 200ms var(--ease-out-quart),
    box-shadow 200ms var(--ease-out-quart);
}
.variant-a.is-rail-collapsed .top-nav {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
  overflow: visible;
  border-bottom-color: var(--border-hairline);
  box-shadow: 0 4px 16px oklch(0.34 0.06 155 / 0.08);
}
.variant-a.is-rail-collapsed .main {
  width: 100%;
  padding-top: calc(var(--top-nav-height) + env(safe-area-inset-top, 0px));
}
.top-nav-inner {
  display: flex;
  align-items: center;
  gap: 10px;
  height: var(--top-nav-height);
  min-height: var(--top-nav-height);
  padding: 0 16px 0 var(--shell-chrome-width);
  box-sizing: border-box;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.top-nav-inner::-webkit-scrollbar {
  display: none;
}
.top-nav-brand {
  flex-shrink: 0;
  font-family: var(--font-wordmark);
  font-weight: 600;
  font-size: 1.125rem;
  letter-spacing: -0.02em;
  line-height: 1.1;
  text-decoration: none;
  white-space: nowrap;
}
.top-nav-wordmark-brand {
  color: var(--ansaur-moss);
}
.top-nav-wordmark-tld {
  color: var(--ansaur-sage);
  font-weight: 500;
}
.top-nav-items {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1;
  min-width: 0;
}
.top-nav-divider {
  flex-shrink: 0;
  width: 1px;
  height: 20px;
  margin: 0 6px;
  background: var(--border-hairline);
}
.top-nav .nav-item {
  flex: 0 0 auto;
  padding: 8px 12px;
  margin: 0;
  font-size: var(--type-sm);
  white-space: nowrap;
}
.top-nav .nav-sub-item {
  padding: 8px 12px;
  font-size: var(--type-xs);
}
.top-nav .nav-count {
  min-width: 1.5rem;
  padding: 1px 7px;
  font-size: 0.65rem;
}

.variant-a .main { flex: 1; display: flex; flex-direction: column; min-width: 0; transition: flex var(--shell-collapse-ms) var(--shell-collapse-ease); }
.variant-a .toolbar {
  padding: 12px 24px;
  border-bottom: 1px solid var(--border-hairline);
  display: flex;
  gap: 12px;
  align-items: center;
}
.variant-a .toolbar .search {
  width: 240px;
  max-width: 100%;
  flex: 0 1 auto;
}
.variant-a .toolbar .toolbar-filters .search {
  width: 220px;
}
.variant-a .toolbar .btn-sm {
  flex-shrink: 0;
}
.search-volume-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  padding: 10px 24px;
  font-size: var(--type-md);
  color: var(--text-muted);
  background: var(--surface-inset);
  border-bottom: 1px solid var(--border-hairline);
}
.search-volume-bar strong {
  font-family: var(--font-mono);
  font-weight: 600;
  color: var(--text-primary);
}
.search-volume-count,
.search-volume-totals {
  color: var(--text-primary);
}
.search-volume-query {
  font-style: italic;
}
.search-volume-hint {
  font-size: var(--type-sm);
  opacity: 0.85;
}
.search-volume-sep {
  opacity: 0.45;
}
.search-bulk-actions {
  margin-left: auto;
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
}
.search-bulk-action-delete {
  border-color: color-mix(in srgb, var(--ansaur-red-deep) 60%, transparent);
  background: color-mix(in srgb, var(--ansaur-red) 16%, var(--surface));
  color: var(--ansaur-red-deep);
  font-weight: 700;
}
.search-bulk-action-delete:hover {
  background: color-mix(in srgb, var(--ansaur-red) 26%, var(--surface));
  border-color: var(--ansaur-red-deep);
}
.variant-a .content { flex: 1; overflow: auto; }

/* --- Variant B: Top Command --- */
.variant-b { min-height: 100vh; display: flex; flex-direction: column; }
.variant-b .topbar {
  background: var(--surface-rail);
  color: var(--text-on-rail);
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 32px;
  height: 56px;
}
.variant-b .topbar-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--type-xl);
  margin-right: 16px;
  letter-spacing: var(--display-tracking);
  line-height: 1.2;
}
.variant-b .tab {
  color: var(--text-on-rail-muted);
  text-decoration: none;
  font-weight: 600;
  padding: 16px 0;
  border-bottom: 3px solid transparent;
}
.variant-b .tab.active { color: var(--accent-red); border-bottom-color: var(--accent-red); }
.variant-b .topbar-right {
  margin-left: auto;
  display: flex;
  gap: 8px;
  align-items: center;
  font-family: var(--font-mono);
  font-size: var(--type-sm);
  color: var(--text-on-rail-muted);
}
.variant-b .subbar {
  padding: 12px 24px;
  background: var(--surface-raised);
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.variant-b .job-pills { display: flex; gap: 6px; flex-wrap: wrap; }
.variant-b .job-pill {
  font-size: var(--type-sm);
  padding: 4px 10px;
  border-radius: 4px;
  background: var(--surface-base);
  border: 1px solid var(--border-hairline);
  cursor: pointer;
}
.variant-b .job-pill:hover { border-color: var(--accent-red); color: var(--accent-red); }
.variant-b .content { flex: 1; padding: 0; overflow: auto; }

/* --- Variant C: Split Deck --- */
.variant-c { display: flex; min-height: 100vh; }
.variant-c .left {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.variant-c .left-header {
  padding: 20px 24px 12px;
  display: flex;
  align-items: baseline;
  gap: 16px;
}
.variant-c .left-header h1 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--type-4xl);
  margin: 0;
  color: var(--accent-red);
  letter-spacing: var(--display-tracking);
  line-height: 1.15;
}
.variant-c .left-header span { color: var(--text-muted); font-size: var(--type-md); }
.variant-c .toolbar { padding: 0 24px 12px; }
.variant-c .table-wrap { flex: 1; overflow: auto; }
.variant-c .right {
  width: 320px;
  flex-shrink: 0;
  background: var(--surface-rail);
  color: var(--text-on-rail);
  padding: 24px 20px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.variant-c .right h2 {
  font-family: var(--font-display);
  font-size: var(--type-base);
  font-weight: 700;
  margin: 0 0 12px;
  color: var(--text-on-rail-muted);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.variant-c .arch-item {
  padding: 10px 0;
  border-bottom: 1px solid var(--rail-chrome);
  font-size: var(--type-md);
}
.variant-c .arch-item .kw { color: var(--text-on-rail); font-size: var(--type-sm); }
.variant-c .arch-item .meta {
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-on-rail-muted);
  margin-top: 4px;
}
.variant-c .run-list { list-style: none; padding: 0; margin: 0; }
.variant-c .run-list li {
  padding: 10px 0;
  border-bottom: 1px solid var(--rail-chrome);
  display: flex;
  justify-content: space-between;
  font-size: var(--type-md);
}
.variant-c .run-list .cost { font-family: var(--font-mono); color: var(--text-on-rail-muted); }

/* --- Prototype switcher --- */
.proto-switcher {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--ansaur-moss-deep);
  color: var(--text-on-rail);
  padding: 10px 16px;
  border-radius: 999px;
  font-size: var(--type-md);
  font-weight: 600;
  box-shadow: 0 8px 32px oklch(0.34 0.06 155 / 0.4);
  z-index: 9999;
}
.proto-switcher button {
  background: var(--rail-chrome);
  border: none;
  color: var(--text-on-rail);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  font-size: var(--type-lg);
}
.proto-switcher button:hover { background: var(--accent-red); }

/* --- Settings panel --- */
.settings-panel,
.discovery-panel { padding: 24px; max-width: 900px; }
.settings-section-head {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 0;
}
.settings-section:not(.settings-section--collapsed) .settings-section-head { margin-bottom: 12px; }
.settings-section-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
}
.settings-section-toggle:hover .settings-section-title { color: var(--text-primary); }
.settings-section-toggle:focus-visible {
  outline: none;
  border-radius: 4px;
  box-shadow: var(--focus-ring);
}
.settings-section-title { margin: 0; transition: color 0.12s ease; }
.settings-section-chevron {
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 6px solid var(--text-muted);
  transition: transform 0.15s ease;
  flex-shrink: 0;
}
.settings-section:not(.settings-section--collapsed) .settings-section-chevron {
  transform: rotate(90deg);
}
.settings-section--collapsed .settings-section-body { display: none; }
.disc-hint { color: var(--text-muted); font-size: var(--type-md); margin: 0 0 12px; line-height: 1.5; }
.job-inline-status { color: var(--ansaur-moss-deep); font-weight: 500; }
.prefix-table { margin-bottom: 16px; }
.prefix-table .num {
  text-align: right;
  font-family: var(--font-mono);
  font-size: var(--type-md);
  color: var(--text-muted);
  width: 5rem;
}
.seed-preview-cell { font-size: var(--type-md); line-height: 1.45; }
.seed-part { color: var(--text-primary); }
.seed-phrase { color: var(--ansaur-moss-deep); }
.seed-sep, .seed-equals { color: var(--text-muted); font-family: var(--font-body); }
.prefix-off .kw,
.prefix-off .num { color: var(--text-muted); }
.prefix-table-scroll-hint {
  display: none;
  margin: 0 0 12px;
  font-size: var(--type-sm);
  color: var(--text-muted);
  line-height: 1.45;
}
.prefix-add { display: flex; gap: 12px; align-items: center; margin-top: 8px; }
.location-pickers-grid {
  display: grid;
  gap: 16px;
  margin: 16px 0;
}
@media (min-width: 720px) {
  .location-pickers-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.location-picker-label {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
}
.location-toggles label { margin-right: 16px; }
.location-kind-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  margin: 12px 0;
}
.location-kind-option { font-size: var(--type-md); }
.location-secondary-panel {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border-hairline);
}
.location-search-results {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
  max-height: 320px;
  overflow: auto;
  border: 1px solid var(--border-hairline);
  border-radius: 8px;
  padding: 6px;
  background: var(--surface-raised, #fff);
}
.location-search-more { margin: 4px 6px 2px; }
.location-search-hit {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  text-align: left;
  width: 100%;
  padding: 8px 10px;
  border: none;
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  font: inherit;
}
.location-search-hit:hover { background: color-mix(in srgb, var(--ansaur-sage) 18%, transparent); }
.prefix-edit-input { width: 100%; max-width: 360px; }
.prefix-root-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.prefix-root-group {
  border: 1px solid var(--border-quiet);
  border-radius: 8px;
  background: var(--surface-base);
  overflow: hidden;
}
.prefix-root-group:not([open]) > .prefix-group-panel {
  display: none;
}
.prefix-root-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
  transition: background 0.12s ease;
}
.prefix-root-summary:hover { background: var(--surface-hover-neutral); }
.prefix-root-summary:focus-visible {
  outline: none;
  background: var(--surface-hover-neutral);
  box-shadow: inset var(--focus-ring);
}
.prefix-root-summary::-webkit-details-marker { display: none; }
.prefix-root-name {
  font-weight: 500;
  font-size: var(--type-lg);
  color: var(--text-primary);
}
.prefix-root-meta {
  color: var(--text-muted);
  font-size: var(--type-md);
}
.prefix-root-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.prefix-badge {
  font-size: var(--type-sm);
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--border-quiet-strong);
  color: var(--text-muted);
}
.prefix-badge-focus {
  color: var(--text-muted);
  background: var(--surface-muted-fill);
  border-color: var(--border-quiet-strong);
}
.prefix-badge-excluded {
  color: var(--text-muted);
  background: color-mix(in srgb, var(--text-muted) 10%, transparent);
}
.prefix-row-excluded {
  background: var(--surface-muted-fill);
}
.prefix-row-excluded .kw { color: var(--text-muted); }
.prefix-row-excluded .prefix-badge-excluded { margin-left: 6px; vertical-align: middle; }
.prefix-phrase-cell { padding: 0; }
.prefix-phrase-btn {
  display: block;
  width: 100%;
  margin: 0;
  padding: 14px 18px;
  border: none;
  background: transparent;
  font: inherit;
  font-family: var(--font-mono);
  font-size: var(--type-base);
  line-height: var(--leading-normal);
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.prefix-phrase-btn:hover,
.prefix-phrase-btn:focus-visible {
  color: var(--text-primary);
  background: var(--surface-hover-neutral);
}
.prefix-phrase-btn:focus-visible {
  outline: none;
  box-shadow: inset var(--focus-ring);
}
.prefix-phrase-btn--excluded {
  color: var(--text-muted);
}
.prefix-phrase-btn--excluded:hover,
.prefix-phrase-btn--excluded:focus-visible {
  color: var(--text-primary);
}
.prefix-row-excluded .prefix-phrase-btn--excluded:hover,
.prefix-row-excluded .prefix-phrase-btn--excluded:focus-visible {
  background: color-mix(in srgb, var(--accent-secondary-quiet) 12%, var(--surface-base));
}
.prefix-group-panel { padding: 0 14px 14px; border-top: 1px solid var(--border-divider-quiet); }
.prefix-focus-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.prefix-focus-notice {
  margin: 0 0 12px;
  font-size: var(--type-md);
  color: var(--text-muted);
  line-height: 1.5;
}
.prefix-focus-cell { width: 3rem; text-align: center; }
.prefix-focus-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  cursor: pointer;
}
.prefix-focus-check input {
  accent-color: var(--text-muted);
  width: 1.125rem;
  height: 1.125rem;
}
.prefix-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-top: 8px;
}
.prefix-section-status--busy {
  background: var(--surface-hover-neutral);
  color: var(--text-muted);
}
.prefix-section-status {
  font-size: var(--type-sm);
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 4px;
  line-height: 1.45;
}
.prefix-section-status--error {
  background: var(--accent-red-soft);
  color: var(--accent-red-deep);
}
.prefix-section-status--success {
  background: var(--surface-muted-fill);
  color: var(--text-primary);
}
.prefix-section-status--info {
  background: var(--surface-hover-neutral);
  color: var(--text-muted);
}

/* Question prefixes — quiet tables, actions, touch targets */
[data-settings-section="question-prefixes"] .data-table th {
  background: var(--surface-table-header-quiet);
  border-bottom-color: var(--border-table-quiet);
}
[data-settings-section="question-prefixes"] .data-table td {
  border-bottom-color: var(--border-table-row-quiet);
}
[data-settings-section="question-prefixes"] .data-table tbody tr:hover {
  background: var(--surface-hover-neutral);
}
[data-settings-section="question-prefixes"] .btn-sm {
  min-height: 44px;
  padding: 10px 14px;
}
[data-settings-section="question-prefixes"] .btn-sm:focus-visible {
  outline: none;
  box-shadow: var(--btn-chunky-shadow), var(--focus-ring);
}
[data-settings-section="question-prefixes"] .btn-sm:active:not(:disabled):focus-visible {
  box-shadow: var(--btn-chunky-shadow-press), var(--focus-ring);
}
[data-settings-section="question-prefixes"] .btn-ghost {
  color: var(--text-muted);
  border-color: var(--border-quiet-strong);
}
[data-settings-section="question-prefixes"] .btn-ghost:hover:not(:disabled) {
  background: var(--surface-hover-neutral);
  color: var(--text-primary);
}
[data-settings-section="question-prefixes"] .btn-secondary {
  background: var(--accent-secondary-quiet);
  border-color: var(--accent-secondary-quiet);
  color: var(--text-on-rail);
}
[data-settings-section="question-prefixes"] .btn-secondary:hover:not(:disabled) {
  background: var(--accent-secondary-quiet-hover);
  border-color: var(--accent-secondary-quiet-hover);
}
[data-settings-section="question-prefixes"] .btn-secondary:focus-visible {
  outline: none;
  box-shadow: var(--btn-chunky-shadow), var(--focus-ring);
}
[data-settings-section="question-prefixes"] .btn-md {
  min-height: 44px;
}
[data-settings-section="question-prefixes"] .btn-md:focus-visible {
  outline: none;
  box-shadow: var(--btn-chunky-shadow), var(--focus-ring);
}
[data-settings-section="question-prefixes"] .prefix-add .search {
  flex: 1 1 12rem;
  min-width: 0;
  width: auto;
}
@media (max-width: 720px) {
  [data-settings-section="question-prefixes"] .prefix-add {
    flex-direction: column;
    align-items: stretch;
  }
  [data-settings-section="question-prefixes"] .prefix-add .search,
  [data-settings-section="question-prefixes"] .prefix-add .btn-md {
    width: 100%;
  }
  [data-settings-section="question-prefixes"] .prefix-root-badges {
    margin-left: 0;
    width: 100%;
  }
  [data-settings-section="question-prefixes"] .prefix-table-scroll-hint {
    display: block;
  }
  [data-settings-section="question-prefixes"] .prefix-phrase-table {
    min-width: 32rem;
  }
  [data-settings-section="question-prefixes"] .prefix-table-scroll {
    mask-image: linear-gradient(to right, #000 calc(100% - 1.5rem), transparent);
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 1.5rem), transparent);
  }
}
.prefix-root-tag {
  font-size: var(--type-sm);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.prefix-root-cell { color: var(--text-muted); font-size: var(--type-md); }
.prefix-phrase-table { margin-top: 0; }
.disc-rules { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; font-size: var(--type-base); }
.disc-rules label { display: flex; gap: 8px; align-items: center; }
.disc-rules input[type="text"],
.disc-rules input[type="number"] {
  padding: 6px 8px;
  border: 1px solid var(--border-hairline);
  border-radius: 4px;
  font-family: var(--font-mono);
  font-size: var(--type-md);
}
.location-country-select {
  width: 100%;
  max-width: 420px;
  padding: 8px 10px;
  border: 1px solid var(--border-hairline);
  border-radius: 4px;
  font: inherit;
  font-size: var(--type-md);
  background: var(--surface-raised, #fff);
}
.seed-preview { margin: 0; padding-left: 20px; color: var(--text-muted); font-size: var(--type-sm); }

/* Jobs desk — research command center */
.jobs-command { width: 100%; }

.jobs-command-header {
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding-bottom: 12px;
}
.jobs-header-text { min-width: 0; }

.jobs-status-strip {
  margin-bottom: 20px;
  padding: 12px 16px;
  border: 1px solid var(--border-hairline);
  background: var(--surface-raised);
  border-radius: var(--radius-sm);
}
.jobs-status-strip-idle {
  background: var(--ansaur-sage-soft);
  border-color: var(--ansaur-sage-muted);
}
.jobs-status-strip-live {
  background: var(--accent-red-soft);
  border-color: color-mix(in srgb, var(--accent-red) 25%, var(--border-hairline));
}
.jobs-status-strip-inner {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  width: 100%;
}
.jobs-status-label {
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  flex-shrink: 0;
}
.jobs-status-ready {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: var(--type-md);
  color: var(--text-muted);
}
.jobs-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ansaur-moss);
  flex-shrink: 0;
}
.jobs-status-strip-live .jobs-status-dot {
  background: var(--accent-red);
  animation: jobs-pulse 1.6s ease-out infinite;
}
@keyframes jobs-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}
.jobs-status-strip .job-active,
.jobs-status-strip .jobs-status-active {
  flex: 1;
  min-width: min(100%, 280px);
  margin: 0;
}

/* Scout page hero — town CRT patrol */
.scout-hero {
  width: 100%;
  margin-bottom: 28px;
  --scout-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --scout-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --scout-crt-width: min(640px, 96vw);
  --scout-crt-collapse-ms: 2.2s;
  --scout-crt-frame-ms: 2s;
  --scout-crt-open-delay: 0ms;
  --scout-crt-power-ms: 2.5s;
  --scout-crt-power-delay: 1.1s;
  --scout-crt-fx-ms: 2.6s;
  --scout-crt-content-in-ms: 0.95s;
  /* Calibrated to scout-crt-desk-8bit.png black screen (1536×1024) */
  --crt-screen-left: 26.17%;
  --crt-screen-top: 12.4%;
  --crt-screen-width: 44.47%;
  --crt-screen-height: 44.5%;
  --crt-screen-right: 29.36%;
  --crt-screen-bottom: 42.1%;
  transition: margin-bottom 0.7s var(--scout-ease-out);
}
.scout-hero--idle {
  margin-bottom: 14px;
}
.scout-hero--crt-on,
.scout-hero--crt-powering {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.scout-hero-crt-collapse {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  width: 100%;
  transform: translateY(10px);
  will-change: grid-template-rows, opacity, transform;
}
.scout-hero-crt-collapse-inner {
  min-height: 0;
  overflow: hidden;
}
.scout-hero--crt-powering .scout-hero-crt-collapse,
.scout-hero--crt-on .scout-hero-crt-collapse {
  grid-template-rows: 1fr;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition:
    grid-template-rows var(--scout-crt-collapse-ms) var(--scout-ease-drawer),
    opacity 1.1s var(--scout-ease-out) 0.08s,
    transform var(--scout-crt-collapse-ms) var(--scout-ease-drawer),
    visibility 0s linear 0s;
}
.scout-hero--crt-powering .scout-hero-crt-collapse {
  transition:
    grid-template-rows var(--scout-crt-collapse-ms) var(--scout-ease-drawer),
    opacity 1s var(--scout-ease-out) 0.06s,
    transform var(--scout-crt-collapse-ms) var(--scout-ease-drawer),
    visibility 0s linear 0s;
}
.scout-hero--crt-off .scout-hero-crt-collapse {
  grid-template-rows: 0fr;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition:
    grid-template-rows 0.62s var(--scout-ease-out),
    opacity 0.38s ease,
    transform 0.5s var(--scout-ease-out),
    visibility 0s linear 0.62s;
}
.scout-hero-crt-frame-wrap,
.crt-frame-wrap {
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 8px 0 4px;
  transform: translateY(18px) scale(0.97);
  opacity: 0;
  will-change: transform, opacity;
}
.scout-hero--crt-powering .scout-hero-crt-frame-wrap,
.scout-hero--crt-on .scout-hero-crt-frame-wrap,
.crt-host--powering .crt-frame-wrap,
.crt-host--on .crt-frame-wrap {
  transform: translateY(0) scale(1);
  opacity: 1;
  transition:
    transform var(--scout-crt-frame-ms) var(--scout-ease-drawer) 0.04s,
    opacity 1s var(--scout-ease-out) 0.1s;
}
.scout-hero--crt-off .scout-hero-crt-frame-wrap,
.crt-host--off .crt-frame-wrap {
  transform: translateY(10px) scale(0.97);
  opacity: 0;
  transition:
    transform 0.5s var(--scout-ease-out),
    opacity 0.32s ease;
}
.scout-hero-crt-frame,
.crt-frame {
  position: relative;
  width: var(--crt-width, var(--scout-crt-width));
  max-width: 100%;
  line-height: 0;
  filter: drop-shadow(0 14px 28px color-mix(in srgb, #000 45%, transparent));
}
.scout-crt-fs-btn {
  position: static;
  z-index: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  width: auto;
  height: auto;
  padding: 3px 7px;
  border-radius: 2px;
  border: 1px solid color-mix(in srgb, #fff 22%, transparent);
  background: color-mix(in srgb, #000 48%, transparent);
  color: rgba(255, 255, 255, 0.92);
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-transform: lowercase;
  white-space: nowrap;
  cursor: pointer;
  pointer-events: auto;
  transition:
    transform 160ms var(--scout-ease-out),
    background 160ms ease,
    border-color 160ms ease,
    color 160ms ease;
}
.scout-crt-fs-btn:hover {
  background: color-mix(in srgb, #000 62%, transparent);
  border-color: color-mix(in srgb, #fff 34%, transparent);
  color: #fff;
}
.scout-crt-fs-btn:active {
  transform: scale(0.97);
}
body.scout-crt-fs-active {
  overflow: hidden;
}
.scout-crt-fs-portal {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(10px, 2.5vh, 24px);
  pointer-events: none;
  visibility: hidden;
}
.scout-crt-fs-portal.is-open {
  visibility: visible;
  pointer-events: auto;
}
.scout-crt-fs-portal .scout-crt-fs-backdrop {
  position: fixed;
  inset: 0;
  z-index: 0;
  background: color-mix(in srgb, #070707 84%, transparent);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  opacity: 0;
  transition: opacity 340ms var(--scout-ease-out);
}
.scout-crt-fs-portal.is-open:not(.is-closing) .scout-crt-fs-backdrop {
  opacity: 1;
}
.scout-crt-fs-portal.is-closing .scout-crt-fs-backdrop {
  opacity: 0;
  transition: opacity 220ms var(--scout-ease-out);
}
.scout-crt-fs-stage {
  position: relative;
  z-index: 1;
  max-width: 100%;
  max-height: 100%;
  transform: scale(0.94);
  opacity: 0.88;
  transition:
    transform 420ms var(--scout-ease-drawer),
    opacity 300ms var(--scout-ease-out);
}
.scout-crt-fs-portal.is-ready .scout-crt-fs-stage {
  transform: scale(1);
  opacity: 1;
}
.scout-crt-fs-portal.is-closing .scout-crt-fs-stage {
  transform: scale(0.96);
  opacity: 0;
  transition:
    transform 220ms var(--scout-ease-out),
    opacity 200ms ease;
}
.scout-crt-fs-portal .scout-hero-crt-frame-wrap {
  padding: 0;
  transform: none;
  opacity: 1;
}
.scout-crt-fs-portal .scout-hero-crt-frame {
  --scout-crt-width: min(96vw, calc(92vh * 1536 / 1024));
  max-height: 92vh;
  filter: drop-shadow(0 22px 48px color-mix(in srgb, #000 58%, transparent));
}
.scout-hero-crt-frame-art,
.crt-frame-art {
  display: block;
  width: 100%;
  height: auto;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  user-select: none;
  pointer-events: none;
}
.scout-hero-crt-screen-slot,
.crt-screen-slot {
  position: absolute;
  inset: var(--crt-screen-top) var(--crt-screen-right) var(--crt-screen-bottom) var(--crt-screen-left);
  z-index: 2;
  transform-origin: center center;
  overflow: hidden;
  border-radius: 2px;
}
.scout-hero-crt-screen,
.crt-screen {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #050505;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 4%, transparent);
}
.scout-hero-crt-stage-wrap,
.crt-stage-wrap {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}
.scout-hero--crt-off .scout-hero-crt-screen-slot,
.crt-host--off .crt-screen-slot {
  transform: scaleY(0.04) scaleX(0.9);
  opacity: 0;
  visibility: hidden;
  filter: brightness(1) contrast(1);
}
.scout-hero--crt-powering .scout-hero-crt-screen-slot,
.crt-host--powering .crt-screen-slot {
  visibility: visible;
  transform: scaleY(0.04) scaleX(0.9);
  opacity: 0;
  filter: brightness(3) contrast(1.35) saturate(0.5);
  animation: scout-crt-power-on var(--crt-power-ms, var(--scout-crt-power-ms)) var(--scout-ease-out) var(--crt-power-delay, var(--scout-crt-power-delay)) forwards;
}
.scout-hero--crt-powering .scout-hero-stage .scout-hero-world-layer,
.scout-hero--crt-powering .scout-hero-stage .scout-town-npcs,
.scout-hero--crt-powering .scout-hero-stage .scout-hero-dino-wrap {
  opacity: 0;
  visibility: hidden;
}
.scout-hero--crt-on .scout-hero-stage .scout-hero-world-layer,
.scout-hero--crt-on .scout-hero-stage .scout-town-npcs {
  animation: scout-crt-content-in var(--scout-crt-content-in-ms) var(--scout-ease-out) forwards;
}
@keyframes scout-crt-content-in {
  0% {
    opacity: 0;
    filter: brightness(1.75) saturate(0.65);
  }
  100% {
    opacity: 1;
    filter: none;
  }
}
.scout-hero--crt-on .scout-hero-crt-screen-slot,
.crt-host--on .crt-screen-slot {
  transform: scaleY(1) scaleX(1);
  opacity: 1;
  visibility: visible;
  filter: none;
}
@keyframes scout-crt-power-on {
  0% {
    transform: scaleY(0.04) scaleX(0.9);
    opacity: 0;
    filter: brightness(3) contrast(1.35) saturate(0.5);
  }
  10% {
    transform: scaleY(0.07) scaleX(0.91);
    opacity: 0.55;
    filter: brightness(2.7) contrast(1.3) saturate(0.62);
  }
  24% {
    transform: scaleY(0.2) scaleX(0.94);
    opacity: 0.72;
    filter: brightness(2.15) contrast(1.2) saturate(0.78);
  }
  42% {
    transform: scaleY(0.48) scaleX(0.97);
    opacity: 0.86;
    filter: brightness(1.55) contrast(1.08) saturate(0.9);
  }
  62% {
    transform: scaleY(0.82) scaleX(0.99);
    opacity: 0.94;
    filter: brightness(1.22) contrast(1.04);
  }
  82% {
    transform: scaleY(1.015) scaleX(1);
    opacity: 0.98;
    filter: brightness(1.08) contrast(1.02);
  }
  100% {
    transform: scaleY(1) scaleX(1);
    opacity: 1;
    filter: brightness(1) contrast(1) saturate(1);
  }
}
.scout-hero-crt-fx,
.crt-fx {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 5;
  opacity: 0;
}
.scout-hero--crt-powering .scout-hero-crt-fx,
.scout-hero--crt-on .scout-hero-crt-fx,
.crt-host--powering .crt-fx,
.crt-host--on .crt-fx {
  opacity: 1;
}
.scout-hero--crt-powering .scout-hero-crt-fx,
.crt-host--powering .crt-fx {
  animation: scout-crt-fx-fade var(--crt-fx-ms, var(--scout-crt-fx-ms)) var(--scout-ease-out) var(--crt-power-delay, var(--scout-crt-power-delay)) forwards;
}
.scout-hero-crt-scanlines,
.crt-scanlines {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent 0,
    transparent 2px,
    color-mix(in srgb, #000 16%, transparent) 2px,
    color-mix(in srgb, #000 16%, transparent) 3px
  );
  opacity: 0.35;
  mix-blend-mode: multiply;
}
.scout-hero--crt-powering .scout-hero-crt-scanlines,
.crt-host--powering .crt-scanlines {
  animation: scout-crt-scan-roll var(--crt-power-ms, var(--scout-crt-power-ms)) linear var(--crt-power-delay, var(--scout-crt-power-delay));
}
@keyframes scout-crt-scan-roll {
  0% { transform: translateY(0); opacity: 0.65; }
  100% { transform: translateY(6px); opacity: 0.22; }
}
.scout-hero-crt-vignette,
.crt-vignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 50%, color-mix(in srgb, #000 30%, transparent) 100%);
  opacity: 0.42;
}
.scout-hero-crt-glare,
.crt-glare {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    125deg,
    color-mix(in srgb, #fff 14%, transparent) 0%,
    transparent 28%,
    transparent 72%,
    color-mix(in srgb, #fff 4%, transparent) 100%
  );
  opacity: 0.35;
  mix-blend-mode: soft-light;
  pointer-events: none;
}
@keyframes scout-crt-fx-fade {
  0% { opacity: 1; }
  100% { opacity: 0.55; }
}
.scout-hero-stage {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: #050505;
}
.scout-hero-world-layer {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: calc(var(--scout-world-zoom, 3) * 100%);
  transform: translateX(calc(var(--scout-cam-x, 0) * 1%));
  transition: transform 0.55s var(--scout-ease-out);
}
.scout-hero-world {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 94%;
  transform: scale(1.14);
  transform-origin: center bottom;
}

/* Scout town — NPCs, in-frame dialogue bar */
.scout-town-npcs {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}
.scout-town-npc {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: translate(-50%, 0);
  z-index: 2;
}
.scout-town-npc.is-talking {
  z-index: 6;
}
.scout-town-npc-sprite {
  width: 40px;
  height: 46px;
  background: url("/assets/scout-iso-idle-se.png") 0 0 / 100% 100% no-repeat;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  filter: hue-rotate(var(--npc-hue, 0deg)) saturate(0.92);
  opacity: 0.92;
}
.scout-town-npc.is-talking .scout-town-npc-sprite {
  opacity: 1;
  animation: scout-town-npc-talk 0.55s ease-in-out infinite;
}
@keyframes scout-town-npc-talk {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
.scout-town-npc-sign {
  margin-top: 2px;
  padding: 1px 5px;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ansaur-moss-deep);
  background: color-mix(in srgb, #fff 88%, var(--ansaur-sage-soft));
  border: 1px solid color-mix(in srgb, var(--ansaur-moss-deep) 18%, transparent);
  border-radius: 3px;
  white-space: nowrap;
  box-shadow: 0 1px 3px color-mix(in srgb, #000 12%, transparent);
}
.scout-town-message-bar {
  position: relative;
  flex: 0 0 auto;
  z-index: 8;
  display: flex;
  flex-wrap: nowrap;
  align-items: baseline;
  gap: 6px 8px;
  min-height: 34px;
  padding: 7px 10px 6px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.94) 0%, rgba(0, 0, 0, 0.72) 100%);
  border-bottom: 2px solid rgba(255, 255, 255, 0.14);
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.06);
  pointer-events: none;
}
.scout-crt-action-bar {
  position: relative;
  flex: 0 0 auto;
  z-index: 8;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-height: 32px;
  padding: 5px 10px 6px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.94) 100%);
  border-top: 2px solid rgba(255, 255, 255, 0.14);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  pointer-events: none;
}
.scout-crt-action-bar .scout-crt-fs-btn,
.scout-crt-action-bar .scout-crt-cancel {
  pointer-events: auto;
}
.scout-town-dialogue-speaker {
  flex: 0 0 auto;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #c8f0a0;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8);
}
.scout-town-dialogue-speaker::after {
  content: ":";
  margin-left: 2px;
  color: rgba(255, 255, 255, 0.55);
}
.scout-town-message-bar .scout-town-dialogue-text {
  flex: 1 1 auto;
  min-width: 0;
}
.scout-town-dialogue-text {
  margin: 0;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  line-height: 1.35;
  font-weight: 500;
  color: #f4f4f4;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.scout-town-dialogue-caret {
  flex: 0 0 auto;
  display: inline-block;
  width: 2px;
  height: 12px;
  margin-bottom: 1px;
  background: #c8f0a0;
  animation: scout-town-caret 0.8s step-end infinite;
}
.scout-crt-cancel {
  flex: 0 0 auto;
  pointer-events: auto;
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.82);
  border-color: rgba(255, 255, 255, 0.22);
  background: rgba(0, 0, 0, 0.35);
}
.scout-crt-cancel:hover {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.45);
  background: rgba(0, 0, 0, 0.55);
}
@keyframes scout-town-caret {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}
.scout-hero-goal {
  position: absolute;
  right: 4%;
  bottom: 18%;
  z-index: 3;
  transform: scale(1.15);
  transform-origin: bottom right;
}
.scout-hero-dino-wrap {
  --scout-sprite-w: 52px;
  --scout-sprite-h: 60px;
  position: absolute;
  left: var(--scout-x);
  bottom: var(--scout-y);
  z-index: 5;
  transform: translateX(-50%);
  overflow: visible;
  opacity: 0;
}
.scout-hero--crt-on .scout-hero-dino-wrap {
  opacity: 1;
}
.scout-hero-dino-wrap.is-entering {
  left: 8%;
  bottom: 34%;
  animation: scout-dino-enter 3.2s var(--scout-ease-out) forwards;
}
@keyframes scout-dino-enter {
  0% {
    left: 8%;
    bottom: 34%;
    opacity: 0;
    transform: translateX(-50%) scale(0.96);
  }
  18% {
    opacity: 0.35;
    transform: translateX(-50%) scale(0.97);
  }
  32% {
    opacity: 1;
    transform: translateX(-50%) scale(0.99);
  }
  100% {
    left: 12%;
    bottom: 34%;
    opacity: 1;
    transform: translateX(-50%) scale(1);
  }
}
.scout-hero-dino-wrap:not(.is-entering) {
  transition: none;
}
.scout-hero-sprite {
  width: var(--scout-sprite-w);
  height: var(--scout-sprite-h);
  background-repeat: no-repeat;
  background-position: 0 0;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  overflow: hidden;
}
.scout-hero-dino-wrap--se .scout-hero-sprite {
  background-image: url("/assets/scout-iso-walk-se.png");
}
.scout-hero-dino-wrap--sw .scout-hero-sprite {
  background-image: url("/assets/scout-iso-walk-sw.png");
}
.scout-hero-dino-wrap--ne .scout-hero-sprite {
  background-image: url("/assets/scout-iso-walk-ne.png");
}
.scout-hero-dino-wrap--nw .scout-hero-sprite {
  background-image: url("/assets/scout-iso-walk-nw.png");
}
.scout-hero-dino-wrap--se.is-idle .scout-hero-sprite {
  background-image: url("/assets/scout-iso-idle-se.png");
  background-size: 100% 100%;
  background-position: 0 0;
  animation: scout-pixel-idle-bob 1.4s ease-in-out infinite;
}
.scout-hero-dino-wrap--sw.is-idle .scout-hero-sprite {
  background-image: url("/assets/scout-iso-idle-sw.png");
  background-size: 100% 100%;
  background-position: 0 0;
  animation: scout-pixel-idle-bob 1.4s ease-in-out infinite;
}
.scout-hero-dino-wrap--ne.is-idle .scout-hero-sprite {
  background-image: url("/assets/scout-iso-idle-ne.png");
  background-size: 100% 100%;
  background-position: 0 0;
  animation: scout-pixel-idle-bob 1.4s ease-in-out infinite;
}
.scout-hero-dino-wrap--nw.is-idle .scout-hero-sprite {
  background-image: url("/assets/scout-iso-idle-nw.png");
  background-size: 100% 100%;
  background-position: 0 0;
  animation: scout-pixel-idle-bob 1.4s ease-in-out infinite;
}
.scout-hero-dino-wrap.is-walking .scout-hero-sprite {
  background-size: calc(var(--scout-sprite-w) * 4) var(--scout-sprite-h);
  background-position: calc(var(--scout-sprite-w) * var(--walk-frame, 0) * -1) 0;
}
@keyframes scout-pixel-idle-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
.scout-hero-dino-shadow {
  display: block;
  width: 22px;
  height: 5px;
  margin: -2px auto 0;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ansaur-moss-deep) 24%, transparent);
}
.scout-hero-dino-wrap.is-walking .scout-hero-dino-shadow {
  transform: scaleX(0.88);
  opacity: 0.4;
}
.scout-hero--crt-on .scout-hero-hud,
.scout-hero--crt-powering .scout-hero-hud {
  display: none;
}
.scout-hero-hud {
  padding: 14px 18px;
  border: 1px solid var(--ansaur-sage-muted);
  border-radius: 0 0 var(--radius-sm) var(--radius-sm);
  background: var(--surface-raised);
  box-shadow: var(--nb-shadow);
}
.scout-hero--crt-on .scout-hero-hud,
.scout-hero--crt-powering .scout-hero-hud {
  width: var(--scout-crt-width);
  max-width: 94vw;
  margin-top: -2px;
  border-radius: 0 0 8px 8px;
  border-top: none;
  box-shadow:
    0 8px 20px color-mix(in srgb, #000 12%, transparent),
    var(--nb-shadow);
}
.scout-hero-hud-live {
  background: var(--accent-red-soft);
  border-color: color-mix(in srgb, var(--accent-red) 22%, var(--border-hairline));
}
.scout-hero-hud-failed {
  background: color-mix(in srgb, var(--accent-red-soft) 65%, #fff);
  border-color: color-mix(in srgb, var(--accent-red) 30%, var(--border-hairline));
}
.scout-hero-hud-idle {
  background: var(--ansaur-sage-soft);
}
.scout-hero-hud-compact {
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  box-shadow: none;
}
.scout-hero--idle .scout-hero-hud-compact {
  border-color: var(--border-hairline);
  border-radius: var(--radius-sm);
}
.scout-hero-progress {
  margin: 8px 0 6px;
}
.scout-hero-hud-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 6px;
}
.scout-hero-hud-title {
  flex: 1;
  min-width: 120px;
}
.scout-hero-hud-count {
  color: var(--text-muted);
  font-size: var(--type-sm);
}
.scout-hero-hud-mission {
  margin: 0 0 4px;
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--ansaur-moss-deep);
}
.scout-hero-hud-msg,
.scout-hero-hud-idle-msg {
  margin: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
}
.scout-hero-hud-idle-msg {
  display: flex;
  align-items: center;
  gap: 10px;
}
.scout-hero--live .scout-hero-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--accent-red-soft) 8%, transparent) 0%,
    transparent 42%
  );
}
@media (max-width: 640px) {
  .scout-hero {
    --scout-crt-width: min(100%, 94vw);
  }
  .scout-hero-crt-frame-wrap {
    padding: 4px 0 2px;
  }
  .scout-town-dialogue-text {
    font-size: 10px;
  }
  .scout-hero-dino-wrap {
    --scout-sprite-w: 44px;
    --scout-sprite-h: 50px;
  }
  .scout-hero-marker {
    width: 22px;
    height: 22px;
    font-size: 12px;
  }
  .scout-hero-goal {
    transform: scale(0.95);
  }
}
@media (prefers-reduced-motion: reduce) {
  .scout-hero--crt-off .scout-hero-crt-frame-wrap {
    transform: none;
    opacity: 0;
    transition: none;
  }
  .scout-hero--crt-powering .scout-hero-crt-frame-wrap,
  .scout-hero--crt-on .scout-hero-crt-frame-wrap {
    transform: none;
    opacity: 1;
    transition: none;
  }
  .scout-hero--crt-off .scout-hero-crt-collapse {
    grid-template-rows: 0fr;
    opacity: 0;
    visibility: hidden;
  }
  .scout-hero--crt-powering .scout-hero-crt-collapse,
  .scout-hero--crt-on .scout-hero-crt-collapse {
    grid-template-rows: 1fr;
    opacity: 1;
    visibility: visible;
    transition: none;
  }
  .scout-hero--crt-off .scout-hero-crt-screen-slot,
  .scout-hero--crt-powering .scout-hero-crt-screen-slot {
    animation: none;
    transform: scaleY(1);
    opacity: 1;
    visibility: visible;
    filter: none;
  }
  .scout-hero--crt-off .scout-hero-crt-screen-slot {
    transform: scaleY(0.08);
    opacity: 0;
    visibility: hidden;
  }
  .scout-hero-crt-fx,
  .scout-town-npc.is-talking .scout-town-npc-sprite {
    animation: none !important;
  }
  .scout-town-dialogue-caret {
    display: none;
  }
  .scout-hero-dino-wrap.is-entering {
    animation: none;
    left: var(--scout-x);
    bottom: var(--scout-y);
    opacity: 1;
  }
  .scout-hero-dino-wrap.is-walking .scout-hero-sprite,
  .scout-hero-dino-wrap.is-idle .scout-hero-sprite,
  .scout-hero-dino-wrap.is-walking .scout-hero-dino-shadow {
    animation: none;
  }
  .scout-hero-world-layer {
    transition: none;
  }
  .scout-hero-dino-wrap:not(.is-entering) {
    transition: none;
  }
  .scout-crt-fs-portal.is-open:not(.is-closing) .scout-crt-fs-backdrop,
  .scout-crt-fs-portal .scout-crt-fs-stage,
  .scout-crt-fs-portal.is-closing .scout-crt-fs-stage {
    transition: none;
    transform: none;
    opacity: 1;
  }
}

/* Scout patrol scene (legacy strip — kept for reference) */
.scout-scene {
  --scout-progress: 0%;
  width: 100%;
  margin-top: 4px;
}
.scout-scene-mission {
  margin: 0 0 8px;
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--ansaur-moss-deep);
  letter-spacing: 0.01em;
}
.scout-scene-stage {
  position: relative;
  height: 132px;
  border: 1px solid var(--ansaur-sage-muted);
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--ansaur-sage-soft) 70%, #fff) 0%,
    color-mix(in srgb, var(--ansaur-sage) 35%, #fff) 58%,
    var(--ansaur-sage-muted) 58%,
    color-mix(in srgb, var(--ansaur-moss) 22%, var(--ansaur-sage-muted)) 100%
  );
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 55%, transparent);
}
.scout-scene-sky {
  position: absolute;
  inset: 0 0 42%;
  pointer-events: none;
}
.scout-cloud {
  position: absolute;
  display: block;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, #fff 82%, var(--ansaur-sage-soft));
  opacity: 0.9;
  animation: scout-cloud-drift 18s linear infinite;
}
.scout-cloud::before,
.scout-cloud::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: inherit;
}
.scout-cloud--a {
  width: 42px;
  top: 18%;
  left: 12%;
  animation-duration: 22s;
}
.scout-cloud--a::before { width: 18px; height: 18px; left: -6px; top: -5px; }
.scout-cloud--a::after { width: 22px; height: 22px; right: -4px; top: -7px; }
.scout-cloud--b {
  width: 34px;
  top: 32%;
  left: 48%;
  animation-duration: 26s;
  animation-delay: -8s;
}
.scout-cloud--b::before { width: 14px; height: 14px; left: -4px; top: -4px; }
.scout-cloud--b::after { width: 18px; height: 18px; right: -3px; top: -5px; }
.scout-cloud--c {
  width: 28px;
  top: 14%;
  left: 72%;
  animation-duration: 20s;
  animation-delay: -4s;
}
.scout-cloud--c::before { width: 12px; height: 12px; left: -3px; top: -3px; }
.scout-cloud--c::after { width: 16px; height: 16px; right: -2px; top: -4px; }
@keyframes scout-cloud-drift {
  from { transform: translateX(0); }
  to { transform: translateX(18px); }
}
.scout-scene-hills {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 38%;
  height: 28px;
  background:
    radial-gradient(ellipse 90px 24px at 18% 100%, color-mix(in srgb, var(--ansaur-moss) 18%, transparent), transparent 70%),
    radial-gradient(ellipse 110px 30px at 62% 100%, color-mix(in srgb, var(--ansaur-moss) 14%, transparent), transparent 72%),
    radial-gradient(ellipse 80px 22px at 88% 100%, color-mix(in srgb, var(--ansaur-moss) 16%, transparent), transparent 70%);
  pointer-events: none;
}
.scout-scene-ground {
  position: absolute;
  inset: auto 0 0;
  height: 42%;
}
.scout-scene-nest {
  position: absolute;
  left: 4%;
  bottom: 8px;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.scout-nest-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ansaur-moss-deep);
  opacity: 0.7;
}
.scout-nest-mound {
  display: block;
  width: 34px;
  height: 18px;
  border-radius: 50% 50% 40% 40%;
  background: color-mix(in srgb, var(--ansaur-moss) 35%, var(--ansaur-sage-muted));
  border: 1px solid color-mix(in srgb, var(--ansaur-moss-deep) 18%, transparent);
  box-shadow: inset 0 2px 0 color-mix(in srgb, #fff 35%, transparent);
}
.scout-scene-trail {
  position: absolute;
  left: 10%;
  right: 12%;
  top: 50%;
  height: 4px;
  transform: translateY(-50%);
  border-radius: 999px;
  background: color-mix(in srgb, var(--ansaur-moss-deep) 12%, var(--ansaur-sage-muted));
  overflow: hidden;
}
.scout-trail-fill {
  display: block;
  height: 100%;
  width: var(--scout-progress);
  border-radius: inherit;
  background: linear-gradient(90deg, var(--ansaur-moss), var(--ansaur-sage));
  transition: width 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.scout-trail-dots {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, color-mix(in srgb, var(--ansaur-moss-deep) 28%, transparent) 1px, transparent 1.5px);
  background-size: 14px 4px;
  opacity: 0.55;
  pointer-events: none;
}
.scout-scene-bush {
  position: absolute;
  bottom: 6px;
  width: 22px;
  height: 14px;
  border-radius: 50% 50% 42% 42%;
  background: color-mix(in srgb, var(--ansaur-moss) 42%, var(--ansaur-sage));
  border: 1px solid color-mix(in srgb, var(--ansaur-moss-deep) 14%, transparent);
}
.scout-scene-bush--1 { left: 34%; }
.scout-scene-bush--2 { left: 58%; width: 18px; height: 12px; opacity: 0.85; }
.scout-scene-bush::after {
  content: "";
  position: absolute;
  left: 8px;
  bottom: 2px;
  width: 14px;
  height: 10px;
  border-radius: inherit;
  background: inherit;
}
.scout-scene-goal-wrap {
  position: absolute;
  right: 3%;
  bottom: 4px;
  z-index: 2;
}
.scout-goal {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  animation: scout-goal-pulse 2.4s ease-in-out infinite;
}
@keyframes scout-goal-pulse {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
.scout-goal-search-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 78px;
  padding: 4px 6px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--ansaur-sage-muted);
  font-size: 9px;
  color: var(--text-muted);
  box-shadow: 0 2px 6px color-mix(in srgb, var(--ansaur-moss-deep) 10%, transparent);
}
.scout-goal-search-icon {
  font-size: 11px;
  color: var(--ansaur-moss);
  line-height: 1;
}
.scout-goal-bubbles {
  display: flex;
  gap: 3px;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 92px;
}
.scout-goal-bubbles span {
  font-size: 8px;
  padding: 2px 5px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--ansaur-sage-muted);
  color: var(--ansaur-moss-deep);
  white-space: nowrap;
}
.scout-goal-serp {
  width: 72px;
  padding: 4px;
  border-radius: 4px;
  background: #fff;
  border: 1px solid var(--ansaur-sage-muted);
  box-shadow: 0 2px 6px color-mix(in srgb, var(--ansaur-moss-deep) 10%, transparent);
}
.scout-goal-serp-row {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 4px;
  align-items: center;
  margin-bottom: 3px;
}
.scout-goal-serp-row:last-child { margin-bottom: 0; }
.scout-goal-serp-row span {
  font-size: 7px;
  font-weight: 700;
  color: var(--text-muted);
}
.scout-goal-serp-row i {
  display: block;
  height: 4px;
  border-radius: 2px;
  background: var(--ansaur-sage-muted);
}
.scout-goal-serp-row--you span { color: var(--accent-red); }
.scout-goal-serp-row--you i { background: color-mix(in srgb, var(--accent-red) 35%, var(--ansaur-sage-muted)); }
.scout-goal-screen {
  display: grid;
  place-items: center;
  width: 56px;
  height: 36px;
  border-radius: 4px;
  background: var(--ansaur-moss-deep);
  color: #fff;
  position: relative;
  box-shadow: 0 2px 6px color-mix(in srgb, var(--ansaur-moss-deep) 22%, transparent);
}
.scout-goal-play {
  font-size: 12px;
  line-height: 1;
  opacity: 0.95;
}
.scout-goal-screen-title {
  position: absolute;
  bottom: 3px;
  font-size: 6px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.75;
}
.scout-goal-binoculars {
  display: flex;
  gap: 3px;
  align-items: center;
}
.scout-goal-binoculars i {
  display: block;
  width: 10px;
  height: 10px;
  border: 2px solid var(--ansaur-moss-deep);
  border-radius: 50%;
  background: color-mix(in srgb, var(--ansaur-sage-soft) 80%, #fff);
}
.scout-goal-questions {
  position: relative;
  width: 56px;
  height: 40px;
}
.scout-goal-q {
  position: absolute;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  font-size: 14px;
  left: 18px;
  top: 6px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--ansaur-sage-muted);
  color: var(--ansaur-moss);
  font-weight: 700;
  box-shadow: 0 2px 5px color-mix(in srgb, var(--ansaur-moss-deep) 10%, transparent);
}
.scout-goal-q--sm { width: 16px; height: 16px; font-size: 10px; left: 0; top: 14px; }
.scout-goal-q--lg { width: 18px; height: 18px; font-size: 12px; right: 0; top: 2px; left: auto; }
.scout-goal-system {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--ansaur-sage-muted);
  color: var(--ansaur-moss);
  box-shadow: 0 2px 6px color-mix(in srgb, var(--ansaur-moss-deep) 10%, transparent);
}
.scout-goal-gear {
  animation: scout-gear-spin 4s linear infinite;
}
@keyframes scout-gear-spin {
  to { transform: rotate(360deg); }
}
.scout-scene-dino {
  position: absolute;
  left: var(--scout-progress);
  bottom: 10px;
  z-index: 3;
  width: 52px;
  transform: translateX(-50%);
  transition: left 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  animation: scout-dino-walk 0.55s ease-in-out infinite;
}
.scout-dino-img {
  display: block;
  width: 52px;
  height: auto;
  filter: drop-shadow(0 3px 4px color-mix(in srgb, var(--ansaur-moss-deep) 18%, transparent));
}
.scout-dino-shadow {
  display: block;
  width: 34px;
  height: 6px;
  margin: -2px auto 0;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ansaur-moss-deep) 18%, transparent);
  animation: scout-shadow-pulse 0.55s ease-in-out infinite;
}
@keyframes scout-dino-walk {
  0%, 100% { transform: translateX(-50%) translateY(0) rotate(-1deg); }
  50% { transform: translateX(-50%) translateY(-3px) rotate(1deg); }
}
@keyframes scout-shadow-pulse {
  0%, 100% { transform: scaleX(1); opacity: 0.55; }
  50% { transform: scaleX(0.82); opacity: 0.35; }
}
.scout-scene-foot {
  margin-top: 8px;
}
.scout-scene-msg {
  margin: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.scout-scene--spy .scout-scene-stage {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--accent-red-soft) 55%, #fff) 0%,
    color-mix(in srgb, var(--ansaur-sage-soft) 80%, #fff) 58%,
    var(--ansaur-sage-muted) 58%,
    color-mix(in srgb, var(--ansaur-moss) 22%, var(--ansaur-sage-muted)) 100%
  );
}
.scout-scene--scan .scout-trail-fill {
  background: linear-gradient(90deg, var(--accent-red), color-mix(in srgb, var(--accent-red) 55%, var(--ansaur-moss)));
}
@media (prefers-reduced-motion: reduce) {
  .scout-scene-dino,
  .scout-goal,
  .scout-goal-gear,
  .scout-cloud,
  .scout-dino-shadow {
    animation: none;
  }
  .scout-scene-dino {
    transform: translateX(-50%);
  }
}

.jobs-command-body {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: start;
}
.jobs-command-primary {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.jobs-scout-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  margin-bottom: 0;
}
.jobs-run-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 28px;
}

.jobs-zone {
  min-width: 0;
  padding: 18px 20px 20px;
  border: 1px solid var(--border-hairline);
  background: var(--surface-base);
}
.jobs-zone-head {
  margin-bottom: 14px;
}
.jobs-zone-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}
.jobs-zone-title-row .jobs-zone-kicker {
  margin: 0;
}
.jobs-crt-demo-btn {
  flex-shrink: 0;
}
.jobs-zone-kicker {
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
  letter-spacing: 0.02em;
  margin: 0 0 2px;
  color: var(--text-primary);
}
.jobs-zone-desc {
  margin: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  max-width: 42ch;
}
.jobs-auto-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.jobs-hero-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border-hairline);
}
.jobs-hero-row-single { border-bottom: none; padding-bottom: 0; margin-bottom: 12px; }
.jobs-seed-hero {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  margin-bottom: 4px;
}
.jobs-seed-kicker {
  margin: 0 0 2px;
  font-size: var(--type-xs);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.jobs-seed-empty {
  margin: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  line-height: 1.45;
}
.jobs-seed-run-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  text-align: left;
}
.jobs-seed-run-phrase {
  font-family: var(--font-ui);
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jobs-seed-run-credits {
  flex-shrink: 0;
  font-size: var(--type-xs);
  font-weight: 500;
  opacity: 0.85;
}
.jobs-zone-settings-link {
  margin: 8px 0 0;
  font-size: var(--type-sm);
}
.jobs-hero-credits {
  margin-left: auto;
  font-size: var(--type-sm);
  color: var(--text-muted);
}

.jobs-table { margin-bottom: 12px; }
.jobs-table .jobs-name-cell { min-width: 180px; }
.jobs-name { font-size: var(--type-base); font-weight: 600; }
.jobs-desc {
  margin: 3px 0 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  line-height: 1.45;
  max-width: 48ch;
}
.jobs-credits {
  white-space: nowrap;
  color: var(--text-muted);
  font-size: var(--type-sm);
}
.jobs-action { text-align: right; white-space: nowrap; width: 1%; }

.jobs-detail {
  margin-top: 12px;
  border-top: 1px solid var(--border-hairline);
  padding-top: 4px;
}
.jobs-detail-summary {
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--ansaur-moss);
  cursor: pointer;
  list-style: none;
  padding: 10px 0;
}
.jobs-detail-summary::-webkit-details-marker { display: none; }
.jobs-detail-summary::before {
  content: "+";
  display: inline-block;
  width: 1.2em;
  font-weight: 700;
  color: var(--text-muted);
}
.jobs-detail[open] .jobs-detail-summary::before { content: "−"; }
.jobs-detail-label {
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0 0 8px;
}
.jobs-detail-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  padding: 8px 0 4px;
}
.jobs-detail-col { min-width: 0; }
.jobs-detail-empty {
  font-size: var(--type-sm);
  color: var(--text-muted);
  padding: 8px 0;
}
.jobs-target-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 220px;
  overflow-y: auto;
}
.jobs-target-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px solid var(--border-hairline);
  font-size: var(--type-sm);
}
.jobs-target-item:last-child { border-bottom: none; }
.jobs-target-item.prefix-off {
  opacity: 0.45;
}
.jobs-target-credits {
  font-size: var(--type-xs);
  color: var(--text-muted);
  flex-shrink: 0;
}
.jobs-run-over {
  box-shadow: inset 0 0 0 1px var(--warning, #c9a227);
}

.jobs-auto-section {
  margin-bottom: 24px;
  padding: 18px 20px;
  border: 1px solid var(--border-hairline);
  background: var(--surface-base);
}
.jobs-auto-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}
.jobs-patrol-grid {
  grid-template-columns: 1fr;
}
.jobs-zone-probe {
  background: var(--ansaur-sage-soft);
  border-style: dashed;
}
.jobs-soon {
  margin: 8px 0 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  line-height: 1.5;
}
.probe-soon-badge {
  display: inline-block;
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 5px 10px;
  background: var(--ansaur-sage-muted);
  color: var(--ansaur-moss-deep);
  border-radius: 4px;
}
.probe-soon-panel {
  display: grid;
  gap: 12px;
}
.probe-soon-lead {
  margin: 0;
  font-size: var(--type-sm);
  line-height: 1.55;
  color: var(--text-primary);
  max-width: 48ch;
}
.probe-soon-list {
  margin: 0;
  padding-left: 18px;
  font-size: var(--type-sm);
  line-height: 1.55;
  color: var(--text-muted);
}
.probe-soon-list li + li { margin-top: 4px; }

/* Export plan: locked panels and upgrade CTAs */
.rail-plan-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 6px;
  background: var(--ansaur-sage-soft);
  border: 1px solid var(--border-hairline);
}
.rail-plan-meta {
  font-size: var(--type-xs);
  color: var(--text-muted);
}
.panel-upgrade-shell {
  padding: 0 24px 48px;
  max-width: 42rem;
}
.panel-upgrade-card {
  display: grid;
  gap: 12px;
  padding: 20px 22px;
  border: 1px solid var(--border-hairline);
  border-radius: 8px;
  background: var(--surface-base);
  box-shadow: 0 1px 0 oklch(0.34 0.06 155 / 0.06);
}
.panel-upgrade-card--compact {
  padding: 16px 18px;
  background: var(--ansaur-sage-soft);
  border-style: dashed;
}
.panel-upgrade-modal .panel-upgrade-card {
  margin-top: 4px;
  box-shadow: none;
}
.panel-upgrade-badge {
  display: inline-block;
  width: fit-content;
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 5px 10px;
  background: var(--ansaur-sage-muted);
  color: var(--ansaur-moss-deep);
  border-radius: 4px;
}
.panel-upgrade-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
  line-height: 1.25;
}
.panel-upgrade-lead {
  margin: 0;
  font-size: var(--type-sm);
  line-height: 1.55;
  color: var(--text-primary);
  max-width: 48ch;
}
.panel-upgrade-list {
  margin: 0;
  padding-left: 18px;
  font-size: var(--type-sm);
  line-height: 1.55;
  color: var(--text-muted);
}
.panel-upgrade-list li + li { margin-top: 4px; }
.panel-upgrade-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 4px;
}
.jobs-zone--locked {
  background: var(--ansaur-sage-soft);
  border-style: dashed;
}
.jobs-zone-locked {
  padding: 4px 0 8px;
}
.btn-inline-link {
  display: inline;
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  color: var(--ansaur-moss);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.btn-inline-link:hover { color: var(--accent-red); }

.probe-settings-section {
  padding: 20px;
  border: 1px dashed oklch(0.84 0.006 260);
  background: oklch(0.96 0.004 260);
  border-radius: 6px;
  color: var(--text-muted);
}
.probe-settings-section .probe-soon-badge {
  background: oklch(0.90 0.006 260);
  color: oklch(0.48 0.02 260);
}
.probe-settings-section .settings-section-title,
.probe-settings-section .probe-settings-legend {
  color: oklch(0.52 0.02 260);
}
.probe-settings-section .settings-section-toggle:hover .settings-section-title {
  color: oklch(0.42 0.02 260);
}
.probe-settings-section .disc-hint {
  color: oklch(0.58 0.015 260);
}
.probe-settings-head {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.probe-settings-head .run-heading { margin: 0; }
.probe-settings-block {
  margin: 20px 0 0;
  padding: 0;
  border: none;
}
.probe-settings-block:disabled,
.probe-settings-block[disabled] {
  pointer-events: none;
  opacity: 0.72;
}
.probe-settings-legend {
  font-size: var(--type-base);
  font-weight: 600;
  padding: 0;
  margin-bottom: 4px;
}
.probe-settings-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin-top: 8px;
}
.probe-settings-options--stack {
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.probe-settings-option {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: var(--type-base);
  color: oklch(0.58 0.015 260);
}
.probe-settings-option input {
  accent-color: oklch(0.65 0.01 260);
}
.probe-settings-age input[type="number"] {
  width: 5rem;
  padding: 4px 8px;
  border: 1px solid oklch(0.84 0.006 260);
  border-radius: 4px;
  font-family: var(--font-mono);
  background: oklch(0.98 0.003 260);
  color: oklch(0.58 0.015 260);
}
.probe-settings-footnote {
  margin-top: 8px;
  margin-bottom: 0;
  font-size: var(--type-sm);
}
.probe-settings-actions {
  margin-top: 16px;
  opacity: 0.65;
}
.probe-settings-actions .btn-md.btn-black {
  background: oklch(0.88 0.006 260);
  color: oklch(0.58 0.015 260);
  border-color: oklch(0.84 0.006 260);
  box-shadow: none;
}
.probe-settings-actions .btn-md.btn-black:hover {
  background: oklch(0.84 0.006 260);
  color: oklch(0.52 0.02 260);
}
.jobs-auto-col { min-width: 0; }
.jobs-auto-table .jobs-sched-when { white-space: nowrap; }

.jobs-import-block {
  padding: 12px 0;
  border-bottom: 1px solid var(--border-hairline);
}
.jobs-import-block:last-of-type { border-bottom: none; }
.jobs-import-textarea {
  width: 100%;
  min-height: 88px;
  margin: 8px 0 12px;
  resize: vertical;
}
.import-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.jobs-command-rail {
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: static;
}
.jobs-rail-panel {
  padding: 16px;
  border: 1px solid var(--border-hairline);
  background: var(--surface-raised);
}
.jobs-rail-title {
  font-family: var(--font-display);
  font-size: var(--type-base);
  font-weight: 700;
  letter-spacing: 0.02em;
  margin: 0 0 12px;
}
.jobs-rail-empty {
  margin: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  line-height: 1.5;
}
.jobs-rail-scroll {
  max-height: 320px;
  overflow-y: auto;
  margin: 0 -4px;
  padding: 0 4px;
}
.jobs-history-compact .jobs-when { font-size: var(--type-xs); white-space: nowrap; }

.jobs-budget-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.jobs-budget-stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.jobs-budget-stat-wide { grid-column: 1 / -1; }
.jobs-budget-stat dt {
  font-size: var(--type-2xs);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.jobs-budget-stat dd {
  margin: 0;
  font-size: var(--type-md);
  font-weight: 600;
  color: var(--text-primary);
}

.jobs-global-toggle,
.jobs-toggle,
.jobs-auto-add {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--text-primary);
  cursor: pointer;
}
.jobs-tz {
  display: block;
  font-size: var(--type-2xs);
  color: var(--text-muted);
  margin-top: 2px;
}

.jobs-status {
  display: inline-block;
  font-size: var(--type-2xs);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 2px;
  vertical-align: middle;
  margin-left: 6px;
}
.jobs-status-ok { background: var(--ansaur-sage-soft); color: var(--ansaur-moss-deep); }
.jobs-status-fail { background: var(--accent-red-soft); color: var(--accent-red-deep); }
.jobs-status-idle { background: var(--surface-inset); color: var(--text-muted); }

.jobs-summary {
  font-size: var(--type-sm);
  color: var(--text-muted);
  max-width: 36ch;
}
.jobs-history-table .jobs-when { white-space: nowrap; }

/* Legacy jobs helpers (other panels) */
.jobs-desk .jobs-desk-section { margin-bottom: 32px; }
.jobs-desk-header { margin-bottom: 16px; }
.jobs-desk-title {
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
  margin: 0 0 4px;
  letter-spacing: 0.02em;
}
.jobs-desk-lead {
  margin: 0;
  font-size: var(--type-md);
  color: var(--text-muted);
  max-width: 68ch;
}
.jobs-empty {
  margin: 0;
  padding: 16px;
  background: var(--ansaur-sage-soft);
  border: 1px solid var(--border-hairline);
  color: var(--text-muted);
  font-size: var(--type-md);
}

.toolbar-check { font-size: var(--type-md); color: var(--text-muted); display: flex; align-items: center; gap: 6px; }
.sort-select {
  font-family: var(--font-ui);
  font-size: var(--type-md);
  padding: 6px 8px;
  border: 1px solid var(--border-hairline);
  border-radius: 4px;
}
.sort-select--plain {
  border: none;
  background: transparent;
  padding: 6px 18px 6px 0;
  color: var(--text-muted);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 12px;
}
.sort-select--plain:focus {
  outline: none;
  color: var(--text-primary);
}
.sort-select--plain:focus-visible {
  outline: 2px solid var(--ansaur-moss);
  outline-offset: 2px;
  border-radius: 2px;
}
.text-muted { color: var(--text-muted); font-size: var(--type-sm); }
.age-fresh { color: var(--ansaur-moss); }
.age-mid { color: var(--signal-check); }
.age-stale { color: var(--text-faint); }

.desc-field-full { width: 100%; }

/* --- Workflow row animations (Skip / Film it) --- */
body.wf-busy [data-action] {
  pointer-events: none;
}

.wf-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: oklch(0.25 0.03 155 / 0.12);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s var(--ease-out-quart);
}
.wf-overlay.is-active {
  opacity: 1;
}

.wf-main-dimmed {
  filter: brightness(0.94) saturate(0.96);
  transition: filter 0.35s var(--ease-out-quart);
}

@media (min-width: 901px) {
  body.wf-busy .variant-a .rail {
    position: relative;
    z-index: 10002;
  }
}

tr.wf-row-vacating {
  pointer-events: none;
}
tr.wf-row-vacating {
  opacity: 0;
  transition: opacity 0.28s var(--ease-out-quart);
}
tr.wf-row-vacating td {
  border-bottom-color: transparent;
}

.wf-card {
  position: fixed;
  z-index: 10001;
  pointer-events: none;
  border-radius: 6px;
  overflow: hidden;
  will-change: transform, opacity;
  transform: translate(-50%, -50%);
  background: var(--surface-base);
  border: 2px solid var(--ansaur-moss);
  box-shadow: 0 8px 32px oklch(0.34 0.06 155 / 0.14);
}
.wf-card--skip {
  border-color: var(--ansaur-sage-muted);
  border-style: dashed;
}
.wf-card--skip .wf-card-badge {
  background: var(--surface-inset);
  color: var(--text-muted);
}
.wf-card--unskip .wf-card-badge {
  background: var(--ansaur-sage);
  color: var(--ansaur-moss-deep);
}
.wf-card-body {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  padding: 12px 16px;
  min-height: 48px;
}
.wf-card-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: var(--type-2xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  flex-shrink: 0;
  background: var(--ansaur-moss);
  color: var(--text-on-rail);
}
.wf-card-kw {
  font-family: var(--font-mono);
  font-size: var(--type-sm);
  font-weight: 500;
  color: var(--text-primary);
  flex: 1;
  min-width: 0;
  line-height: 1.35;
}
.wf-card-meta {
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-muted);
  width: 100%;
}
.wf-card.is-flying::after {
  content: "";
  position: absolute;
  right: -4px;
  top: 50%;
  width: 36px;
  height: 3px;
  margin-top: -1.5px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, oklch(0.46 0.075 155 / 0.4));
  opacity: 0.6;
}

.variant-a .nav-item.wf-nav-landing {
  color: var(--ansaur-moss-deep) !important;
  background: var(--ansaur-sage-soft);
  transition: background 0.25s var(--ease-out-quart), color 0.25s var(--ease-out-quart);
}
.variant-a .nav-item.wf-nav-pulse {
  animation: wf-nav-pulse 0.5s var(--ease-out-expo);
}
@keyframes wf-nav-pulse {
  0% { transform: scale(1); }
  40% { transform: scale(1.04); }
  100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .btn-sm:active:not(:disabled),
  .btn-md:active:not(:disabled),
  .btn:not(.btn-export):not(.btn-inline-link):active:not(:disabled),
  .row-tools-actions .btn-sm:active:not(:disabled),
  .row-search-inline .btn-search:active {
    transform: none;
  }
  .btn-sm:hover:not(:disabled),
  .btn-md:hover:not(:disabled),
  .btn:not(.btn-export):not(.btn-inline-link):hover:not(:disabled),
  .row-tools-actions .btn-sm:hover:not(:disabled),
  .row-search-inline .btn-search:hover {
    transform: none;
  }
  .wf-overlay,
  tr.wf-row-vacating,
  .wf-card.is-flying::after,
  .wf-nav-pulse,
  .rail-mascot-corner .app-logo,
  .rail-usage-layer,
  .variant-a .main {
    animation: none !important;
    transition: none !important;
  }
  .wf-main-dimmed { filter: none; }
}
.page-header .badge { margin-left: auto; }

/* Optimize Lab — workshop layout: article bench + tool shelf */
.brain-page {
  flex: 1;
  overflow: auto;
  padding-bottom: 64px;
}
.brain-page-inner {
  max-width: 76rem;
  margin: 0 auto;
  padding: 8px clamp(20px, 3vw, 32px) 0;
}
.brain-page .page-header {
  padding: 20px 0 4px;
  margin-bottom: 4px;
}
.brain-lead {
  margin: 8px 0 0;
  max-width: 52ch;
  font-size: var(--type-md);
  line-height: 1.6;
  color: var(--text-muted);
}

.optlab-col-label {
  margin: 0 0 12px;
  font-family: var(--font-display);
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
}

/* Studio: fixed-width article bench, fluid tool shelf */
.optlab-studio {
  display: grid;
  grid-template-columns: minmax(240px, 20rem) minmax(0, 1fr);
  gap: clamp(20px, 2.5vw, 36px);
  align-items: start;
  margin-top: 12px;
}
.optlab-workbench {
  position: sticky;
  top: 12px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-height: calc(100vh - 88px);
  overflow: auto;
  padding: 18px 20px;
  border: 1px solid var(--border-hairline);
  border-radius: 8px;
  background: var(--surface-base);
  transition: box-shadow 400ms var(--ease-out-quart), border-color 400ms var(--ease-out-quart);
}
.optlab-workbench--ready {
  border-color: var(--ansaur-moss);
  box-shadow: 0 0 0 3px oklch(0.46 0.075 155 / 0.12);
}
.optlab-toolshelf {
  min-width: 0;
  padding-top: 2px;
}
.optlab-toolshelf-head {
  margin-bottom: 4px;
}
.optlab-toolshelf-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.optlab-workshop-mode-tabs {
  margin-bottom: 0;
}
.optlab-tools-meta {
  font-size: var(--type-sm);
  color: var(--text-muted);
  white-space: nowrap;
}
.optlab-mode-hint {
  margin: 0 0 12px;
  font-size: var(--type-sm);
  line-height: 1.5;
  color: var(--text-muted);
}
.brain-filter-group .toolbar-filter-btn--muted {
  opacity: 0.5;
}
.brain-filter-group .toolbar-filter-btn--muted:hover:not(:disabled) {
  opacity: 0.72;
}

/* Starter picks */
.optlab-starters {
  margin-bottom: 4px;
  padding: 12px 14px;
  border-radius: 8px;
  background: var(--ansaur-sage-soft);
  border: 1px solid var(--border-hairline);
}
.optlab-starters-label {
  margin: 0 0 10px;
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.optlab-starters-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.optlab-starter-chip {
  padding: 6px 12px;
  border: 1px solid var(--border-hairline);
  border-radius: 999px;
  background: #fff;
  font-family: var(--font-display);
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--ansaur-moss-deep);
  cursor: pointer;
  transition: background-color 160ms var(--ease-out-quart), border-color 160ms var(--ease-out-quart), transform 120ms var(--ease-out-quart);
}
.optlab-starter-chip:hover {
  background: #fff;
  border-color: var(--ansaur-moss);
  transform: translateY(-1px);
}
.optlab-starter-chip:active {
  transform: translateY(0);
}
.optlab-starters-hint {
  margin: 10px 0 0;
  font-size: var(--type-xs);
  line-height: 1.45;
  color: var(--text-muted);
}

/* Session progress */
.optlab-session-banner {
  margin: 0;
  padding: 10px 14px;
  border-radius: 6px;
  font-size: var(--type-sm);
  font-weight: 600;
  line-height: 1.4;
  color: var(--ansaur-moss-deep);
  background: var(--ansaur-sage-soft);
  border: 1px solid var(--ansaur-sage-muted);
}

/* Rotating tip */
.optlab-tip {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 32px 0 0;
  padding-top: 20px;
  border-top: 1px solid var(--border-hairline);
  font-size: var(--type-sm);
  line-height: 1.55;
  color: var(--text-muted);
}
.optlab-tip-mark {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--ansaur-red);
  background: var(--ansaur-red-soft);
  border-radius: 999px;
}

.brain-toolbar {
  position: sticky;
  top: 0;
  z-index: 2;
  margin-bottom: 20px;
  padding: 10px 0 14px;
  background: linear-gradient(to bottom, var(--surface-base) 75%, oklch(1 0 0 / 0));
}
.brain-filter-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.brain-filter-group .toolbar-filter-btn[aria-pressed="true"],
.brain-filter-group .toolbar-filter-btn--open {
  background: var(--ansaur-sage-soft);
  color: var(--ansaur-moss-deep);
  border-color: var(--nb-stroke);
  box-shadow: var(--btn-chunky-shadow-press);
  transform: translate(2px, 2px);
}
.brain-cat-count {
  margin-left: 2px;
  font-family: var(--font-mono);
  font-size: 0.92em;
  font-weight: 400;
  opacity: 0.72;
}

.brain-desk {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.brain-section-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 12px;
  padding-bottom: 0;
  border-bottom: none;
}
.brain-section-name {
  font-family: var(--font-display);
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.brain-section-count {
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-muted);
  white-space: nowrap;
}

.brain-index {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
@media (min-width: 1100px) {
  .brain-index {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
}

.brain-entry {
  border: 1px solid var(--border-hairline);
  border-radius: 8px;
  background: #fff;
  scroll-margin-top: 80px;
  transition: border-color 180ms var(--ease-out-quart), box-shadow 180ms var(--ease-out-quart), transform 180ms var(--ease-out-quart);
  animation: optlab-card-in 420ms var(--ease-out-quart) both;
}
.brain-index .brain-entry:nth-child(1) { animation-delay: 0ms; }
.brain-index .brain-entry:nth-child(2) { animation-delay: 40ms; }
.brain-index .brain-entry:nth-child(3) { animation-delay: 80ms; }
.brain-index .brain-entry:nth-child(4) { animation-delay: 120ms; }
.brain-index .brain-entry:nth-child(n+5) { animation-delay: 160ms; }
.brain-entry:hover {
  border-color: var(--ansaur-sage-muted);
  box-shadow: 0 4px 14px oklch(0.25 0.03 155 / 0.06);
}
.brain-entry[open] {
  grid-column: 1 / -1;
  background: var(--ansaur-sage-soft);
  border-color: var(--ansaur-moss);
  box-shadow: 0 6px 20px oklch(0.25 0.03 155 / 0.08);
}
.brain-entry--used:not([open]) {
  border-color: var(--ansaur-moss);
  background: oklch(0.94 0.025 155 / 0.5);
}
.brain-entry--highlight {
  border-color: var(--ansaur-red);
  box-shadow: 0 0 0 2px var(--ansaur-red-soft);
}

.brain-cat-pill {
  display: inline-block;
  width: fit-content;
  margin-bottom: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1.3;
}
.brain-cat-pill--structure { color: var(--ansaur-moss-deep); background: oklch(0.88 0.035 155 / 0.7); }
.brain-cat-pill--seo { color: oklch(0.45 0.12 27); background: var(--ansaur-red-soft); }
.brain-cat-pill--enrich { color: oklch(0.42 0.08 85); background: oklch(0.92 0.04 85); }
.brain-cat-pill--reader_journey { color: oklch(0.4 0.06 250); background: oklch(0.93 0.03 250); }
.brain-cat-pill--internal_links { color: oklch(0.38 0.06 155); background: var(--ansaur-sage-soft); }
.brain-cat-pill--creative { color: oklch(0.42 0.1 330); background: oklch(0.94 0.04 330); }
.brain-cat-pill--meta { color: var(--text-muted); background: var(--surface-hover-neutral, oklch(0.97 0.008 155)); }

.brain-entry-summary {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
}
.brain-entry-summary::-webkit-details-marker { display: none; }
.brain-entry-summary::marker { content: ""; }
.brain-entry-summary:hover .brain-entry-name { color: var(--ansaur-moss-deep); }
.brain-entry[open] .brain-entry-summary {
  padding-bottom: 10px;
}

.brain-entry-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.brain-entry-actions .brain-entry-chevron {
  margin-left: auto;
}

.brain-entry-hook {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.brain-entry-name {
  font-family: var(--font-display);
  font-size: var(--type-md);
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1.25;
  transition: color 160ms var(--ease-out-quart);
}
.brain-entry-lead {
  font-size: var(--type-sm);
  color: var(--text-muted);
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.brain-copy-quick {
  flex-shrink: 0;
}
.brain-generate {
  flex-shrink: 0;
}
.brain-generate:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.brain-copy-quick.is-copied,
.brain-copy.is-copied {
  background: var(--ansaur-sage-muted);
  border-color: var(--ansaur-moss);
  color: var(--ansaur-moss-deep);
}

.brain-entry-chevron {
  width: 7px;
  height: 7px;
  border-right: 2px solid var(--text-muted);
  border-bottom: 2px solid var(--text-muted);
  transform: rotate(45deg);
  transition: transform 200ms var(--ease-out-quart);
  flex-shrink: 0;
}
.brain-entry[open] .brain-entry-chevron {
  transform: rotate(-135deg);
  margin-top: 3px;
}

.brain-entry-body {
  padding: 0 14px 20px 14px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.brain-facts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 24px;
}
.brain-fact p {
  margin: 0;
  font-size: var(--type-sm);
  line-height: 1.6;
  color: var(--text-primary);
}
.brain-fact-label {
  display: block;
  margin-bottom: 4px;
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.brain-when { color: var(--text-muted); }

.brain-example {
  padding: 14px 16px;
  border-radius: 6px;
  background: var(--surface-base);
  border: 1px solid var(--border-hairline);
}
.brain-example-label {
  display: block;
  margin-bottom: 8px;
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.brain-example-body {
  margin: 0;
  font-family: var(--font-mono);
  font-size: var(--type-sm);
  line-height: 1.6;
  white-space: pre-wrap;
  color: var(--text-primary);
}

.brain-hint {
  margin: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  line-height: 1.5;
}

.brain-notes-block {
  margin: 0 0 16px;
  padding: 14px 16px;
  border-radius: 6px;
  background: var(--ansaur-sage-soft);
  border: 1px solid var(--border-hairline);
}
.brain-notes-label {
  display: block;
  margin-bottom: 6px;
  font-family: var(--font-display);
  font-size: var(--type-sm);
  font-weight: 700;
  color: var(--text-primary);
}
.brain-notes-hint {
  margin: 0 0 10px;
  font-size: var(--type-sm);
  line-height: 1.5;
  color: var(--text-muted);
}
.brain-notes-input {
  width: 100%;
  min-height: 4.5rem;
  font-size: var(--type-sm);
  line-height: 1.55;
  padding: 10px 12px;
  resize: vertical;
}

.brain-prompt-block {
  padding: 16px 18px;
  border-radius: 6px;
  background: var(--surface-base);
  border: 1px solid var(--ansaur-moss);
}
.brain-prompt-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.brain-prompt-label {
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--ansaur-moss-deep);
}
.brain-prompt-body {
  margin: 0;
  padding: 12px 14px;
  border-radius: 4px;
  background: var(--surface-inset);
  border: 1px solid var(--border-hairline);
  font-family: var(--font-mono);
  font-size: var(--type-sm);
  line-height: 1.6;
  white-space: pre-wrap;
  color: var(--text-primary);
}

.brain-empty {
  margin: 32px 0;
  font-size: var(--type-md);
  color: var(--text-muted);
  line-height: 1.55;
}
.brain-footer-note {
  margin: 40px 0 0;
  padding-top: 20px;
  border-top: 1px solid var(--border-hairline);
  font-size: var(--type-sm);
  color: var(--text-muted);
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

@keyframes optlab-card-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes optlab-reveal {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .brain-entry,
  .optlab-output--fresh {
    animation: none !important;
  }
  .optlab-starter-chip:hover {
    transform: none;
  }
}

/* Optimize Lab — URL load, article preview, AI output */
.optlab-load {
  margin-bottom: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
}
.optlab-load-label {
  display: block;
  margin-bottom: 10px;
  font-family: var(--font-display);
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.optlab-load-row {
  display: flex;
  gap: 10px;
  align-items: stretch;
  flex-wrap: wrap;
}
.optlab-load-row-end {
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
}
.optlab-mode-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.optlab-optional {
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text-muted);
}
.optlab-load-label-spaced {
  margin-top: 14px;
}
.optlab-draft-title {
  width: 100%;
  font-size: var(--type-md);
  padding: 12px 16px;
}
.optlab-draft-text {
  width: 100%;
  min-height: 12rem;
  font-size: var(--type-md);
  line-height: 1.55;
  padding: 12px 16px;
  resize: vertical;
}
.optlab-draft-meta {
  font-size: var(--type-sm);
  color: var(--text-muted);
}
.optlab-hint-bottom {
  margin-top: 16px;
}
.optlab-url-input {
  flex: 1 1 16rem;
  min-width: 0;
  font-size: var(--type-md);
  padding: 12px 16px;
}
.optlab-hint {
  margin: 12px 0 0;
  font-size: var(--type-sm);
  line-height: 1.55;
  color: var(--text-muted);
}
.optlab-hint-warn {
  color: var(--ansaur-moss-deep);
}
.optlab-hint code {
  font-family: var(--font-mono);
  font-size: 0.92em;
}
.optlab-error {
  margin: 12px 0 0;
  font-size: var(--type-sm);
  line-height: 1.5;
  color: #9b2c2c;
}

.optlab-article {
  margin-bottom: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
}
.optlab-workbench .optlab-article {
  margin: 0;
  padding-top: 0;
  border-top: none;
}
.optlab-workbench .optlab-load {
  margin: 0;
}
.optlab-article-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.optlab-article-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
  line-height: 1.3;
}
.optlab-article-meta {
  margin: 6px 0 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
}
.optlab-article-meta a {
  color: var(--ansaur-moss-deep);
}
.optlab-article-preview summary {
  cursor: pointer;
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--text-muted);
}
.optlab-article-body {
  margin: 12px 0 0;
  padding: 14px;
  font-size: var(--type-sm);
  line-height: 1.55;
  white-space: pre-wrap;
  background: var(--ansaur-sage-soft);
  border-radius: 6px;
  max-height: 12rem;
  overflow: auto;
}

.optlab-output {
  margin: 0;
  padding: 14px 16px;
  border: 2px solid var(--ansaur-moss);
  border-radius: 8px;
  background: #fff;
}
.optlab-outputs {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.optlab-outputs-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.optlab-outputs-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-md);
  font-weight: 700;
  color: var(--text-primary);
}
.optlab-outputs-count {
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-muted);
  white-space: nowrap;
}
.optlab-outputs-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: min(52vh, 36rem);
  overflow: auto;
  padding-right: 2px;
}
.optlab-output-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.optlab-output--fresh {
  animation: optlab-reveal 500ms var(--ease-out-quart);
}
.optlab-output-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.optlab-output-label {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ansaur-moss-deep);
}
.optlab-output-title {
  margin: 4px 0 0;
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
}
.optlab-output-body {
  margin: 0;
  padding: 16px;
  font-size: var(--type-md);
  line-height: 1.6;
  white-space: pre-wrap;
  background: var(--ansaur-sage-soft);
  border-radius: 6px;
  max-height: 28rem;
  overflow: auto;
}

.optlab-output--queued,
.optlab-output--running {
  border-color: var(--border-hairline);
  background: var(--surface-inset);
}
.optlab-output--queued .optlab-output-label {
  color: var(--text-muted);
}
.optlab-output--running .optlab-output-label {
  color: var(--ansaur-moss-deep);
}
.optlab-output--error {
  border-color: #e8b4b4;
  background: #fff8f8;
}
.optlab-output-placeholder {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 12px 14px;
  font-size: var(--type-sm);
  color: var(--text-muted);
  background: var(--ansaur-sage-soft);
  border-radius: 6px;
}
.optlab-output-spinner {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  border: 2px solid var(--border-hairline);
  border-top-color: var(--ansaur-moss);
  border-radius: 50%;
  animation: optlab-spin 700ms linear infinite;
}
.optlab-output--queued .optlab-output-spinner {
  animation: none;
  border-top-color: var(--border-hairline);
  opacity: 0.55;
}
.optlab-output-error {
  margin: 0;
  padding: 12px 14px;
  font-size: var(--type-sm);
  line-height: 1.55;
  color: #9b2c2c;
  background: #fff0f0;
  border-radius: 6px;
}
.optlab-output-notes {
  margin: 0 0 12px;
  padding: 10px 12px;
  font-size: var(--type-sm);
  line-height: 1.5;
  color: var(--text-muted);
  background: var(--surface-inset);
  border-radius: 6px;
  border-left: 3px solid var(--ansaur-moss);
}
.optlab-output-notes-label {
  display: block;
  margin-bottom: 4px;
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ansaur-moss-deep);
}
@keyframes optlab-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .optlab-output-spinner {
    animation: none;
  }
}

@media (max-width: 960px) {
  .optlab-studio {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .optlab-workbench {
    position: static;
    max-height: none;
    overflow: visible;
  }
  .brain-toolbar {
    position: static;
    background: transparent;
    padding-top: 0;
  }
}
@media (max-width: 720px) {
  .brain-page-inner {
    padding: 0 20px;
  }
  .brain-page--grid .brain-page-inner {
    padding-left: 20px;
    padding-right: 20px;
  }
  .brain-entry-body {
    padding: 0 12px 18px 12px;
  }
  .brain-facts-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

.link-btn {
  display: inline;
  padding: 0;
  border: none;
  background: none;
  color: var(--ansaur-moss-deep);
  font: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.link-btn:hover { color: var(--ansaur-moss); }

.seed-add-reminder {
  margin: 10px 0 0;
  font-size: var(--type-sm);
  line-height: 1.45;
  color: var(--text-muted);
}

.jobs-zone-search--highlight {
  animation: jobs-zone-search-pulse 2s ease-out;
}

@keyframes jobs-zone-search-pulse {
  0%,
  100% {
    box-shadow: none;
  }
  15% {
    box-shadow: 0 0 0 3px oklch(0.72 0.08 155 / 0.35);
  }
}

@media (prefers-reduced-motion: reduce) {
  .jobs-zone-search--highlight {
    animation: none;
    box-shadow: 0 0 0 2px oklch(0.72 0.08 155 / 0.35);
  }
}

.seed-empty-cell {
  color: var(--text-muted);
  font-size: var(--type-md);
  line-height: 1.5;
}

.seed-onboard-backdrop {
  position: fixed;
  inset: 0;
  z-index: 11000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  background: oklch(0.25 0.03 155 / 0.28);
}

.seed-onboard-card {
  width: min(560px, 100%);
  max-height: min(90vh, 720px);
  display: flex;
  flex-direction: column;
  background: var(--surface-base);
  border: 2px solid var(--ansaur-moss);
  border-radius: 10px;
  box-shadow: 0 16px 48px oklch(0.34 0.06 155 / 0.18);
}

.seed-onboard-head {
  padding: 24px 24px 0;
}

.seed-onboard-kicker {
  margin: 0 0 8px;
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ansaur-moss-deep);
}

.seed-onboard-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-xl);
  font-weight: 600;
  line-height: 1.2;
  color: var(--text-primary);
}

.seed-onboard-body {
  padding: 16px 24px;
  overflow: auto;
}

.seed-onboard-lead {
  margin: 0 0 16px;
  font-size: var(--type-md);
  line-height: 1.55;
  color: var(--text-muted);
}

.seed-onboard-field {
  display: block;
}

.seed-finder-fields {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.seed-onboard-input {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  font: inherit;
  font-size: var(--type-md);
  line-height: 1.45;
}

.seed-onboard-input:focus {
  outline: 2px solid var(--ansaur-moss);
  outline-offset: 1px;
}

.seed-onboard-optional {
  font-weight: 500;
  color: var(--text-faint);
}

.seed-onboard-label {
  display: block;
  margin-bottom: 4px;
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--text-primary);
}

.seed-onboard-field-hint {
  display: block;
  margin: 0 0 8px;
  font-size: var(--type-sm);
  font-weight: 400;
  line-height: 1.4;
  color: var(--text-muted);
}

.seed-onboard-textarea {
  width: 100%;
  min-height: 96px;
  padding: 12px 14px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  font: inherit;
  font-size: var(--type-md);
  line-height: 1.45;
  resize: vertical;
}

.seed-onboard-textarea:focus {
  outline: 2px solid var(--ansaur-moss);
  outline-offset: 1px;
}

.seed-onboard-examples {
  margin: 10px 0 0;
  font-size: var(--type-sm);
  color: var(--text-faint);
}

.seed-onboard-topic-ref {
  margin: 0 0 12px;
  font-size: var(--type-sm);
  color: var(--text-muted);
}

.seed-onboard-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.seed-onboard-replace {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 14px 0 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  cursor: pointer;
}

.seed-onboard-replace input {
  margin-top: 3px;
  flex-shrink: 0;
}

.seed-onboard-option {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  cursor: pointer;
  transition: border-color 0.12s ease, background 0.12s ease;
}

.seed-onboard-option:hover {
  border-color: var(--ansaur-sage);
}

.seed-onboard-option--on {
  border-color: var(--ansaur-moss);
  background: oklch(0.46 0.075 155 / 0.06);
}

.seed-onboard-option input {
  margin-top: 4px;
  flex-shrink: 0;
}

.seed-onboard-option-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.seed-onboard-option-text {
  font-size: var(--type-md);
  font-weight: 500;
  color: var(--text-primary);
}

.seed-onboard-option-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: var(--type-xs);
}

.seed-onboard-kind {
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ansaur-moss-deep);
}

.seed-onboard-volume {
  font-family: var(--font-mono);
  color: var(--text-muted);
}

.seed-onboard-option-hint {
  font-size: var(--type-sm);
  color: var(--text-faint);
  line-height: 1.4;
}

.seed-onboard-footnote {
  margin: 12px 0 0;
  font-size: var(--type-sm);
  color: var(--text-faint);
}

.seed-onboard-error {
  margin: 12px 0 0;
  font-size: var(--type-sm);
  color: var(--signal-alert, #b42318);
}

.seed-onboard-saved {
  margin: 0;
  padding-left: 20px;
  color: var(--text-primary);
  font-size: var(--type-md);
  line-height: 1.6;
}

.seed-onboard-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 24px 24px;
  border-top: 1px solid var(--border-subtle);
}

/* Optimize Lab sidebar + settings */
.variant-a .nav-item.nav-soon {
  opacity: 0.72;
  cursor: pointer;
}
.variant-a .nav-item.nav-soon .soon-badge {
  margin-left: auto;
  flex-shrink: 0;
}
.variant-a .nav-item.nav-soon.active {
  opacity: 1;
}
.optlab-settings-panel .optlab-content-add {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 10px;
  align-items: center;
}
.optlab-content-url {
  max-width: 28rem;
  word-break: break-all;
  font-size: var(--type-sm);
}
.optlab-csv-import {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border-subtle);
}
.optlab-feed-import {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border-subtle);
}
.optlab-manual-add {
  margin-top: 16px;
}
.optlab-manual-add .optlab-csv-label {
  display: block;
  margin-bottom: 8px;
}
.optlab-feed-import-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
}
.optlab-csv-label {
  display: block;
  font-size: var(--type-sm);
  font-weight: 600;
  margin-bottom: 6px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Connections — spacious coming-soon desk */
.connections-page {
  flex: 1;
  overflow: auto;
  padding-bottom: 96px;
}
.connections-page-inner {
  max-width: 40rem;
  margin: 0 auto;
  padding: 12px 48px 0;
}
.connections-header {
  padding: 36px 0 48px;
}
.connections-kicker {
  margin: 0 0 12px;
  font-size: var(--type-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.connections-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.connections-title {
  margin: 0;
}
.connections-lead {
  margin: 0;
  max-width: 38ch;
  font-size: var(--type-md);
  line-height: 1.7;
  color: var(--text-muted);
}
.connections-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 28px;
  align-items: center;
  padding: 32px;
  margin-bottom: 56px;
  background: var(--ansaur-sage-soft);
  border-radius: var(--radius-md, 6px);
}
.connections-hero-mascot {
  flex-shrink: 0;
  width: 132px;
  height: 132px;
  border-radius: 50%;
  overflow: hidden;
  background: #fff;
}
.connections-hero-mascot img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 22%;
}
.connections-hero-title {
  margin: 0 0 12px;
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
  line-height: 1.3;
  color: var(--text-primary);
}
.connections-hero-text {
  margin: 0;
  max-width: 42ch;
  font-size: var(--type-md);
  line-height: 1.7;
  color: var(--text-muted);
}
.connections-flow,
.connections-platforms {
  margin-bottom: 56px;
}
.connections-platforms:last-of-type {
  margin-bottom: 48px;
}
.connections-group-hint {
  margin: -12px 0 20px;
  max-width: 48ch;
  font-size: var(--type-sm);
  line-height: 1.65;
  color: var(--text-muted);
}
.connections-section-label {
  margin: 0 0 24px;
  font-size: var(--type-xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.connections-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 20px;
}
.connections-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 20px;
  align-items: start;
  padding: 24px 0;
  border-top: 1px solid var(--border-hairline);
}
.connections-step:last-child {
  padding-bottom: 0;
}
.connections-step-num {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  font-family: var(--font-mono);
  font-size: var(--type-sm);
  font-weight: 500;
  color: var(--ansaur-moss-deep);
  background: var(--ansaur-sage-muted);
  border-radius: 50%;
}
.connections-step-copy {
  display: grid;
  gap: 6px;
  padding-top: 2px;
}
.connections-step-title {
  font-size: var(--type-md);
  font-weight: 600;
  color: var(--text-primary);
}
.connections-step-desc {
  font-size: var(--type-sm);
  line-height: 1.65;
  color: var(--text-muted);
  max-width: 42ch;
}
.connections-platform-list {
  display: grid;
  gap: 0;
  border: 1px solid var(--border-hairline);
  border-radius: var(--radius-md, 6px);
  overflow: hidden;
}
.connections-platform {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 28px 32px;
  background: var(--surface, #fff);
}
.connections-platform + .connections-platform {
  border-top: 1px solid var(--border-hairline);
}
.connections-platform-mark {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  font-family: var(--font-display);
  font-size: var(--type-md);
  font-weight: 700;
  color: var(--ansaur-moss-deep);
  background: var(--ansaur-sage-soft);
  border-radius: var(--radius-sm, 4px);
}
.connections-platform-body {
  min-width: 0;
}
.connections-platform-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 12px 16px;
  margin-bottom: 8px;
}
.connections-platform-name {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-md);
  font-weight: 700;
  line-height: 1.3;
}
.connections-platform-status {
  font-size: var(--type-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.connections-platform-desc {
  margin: 0;
  max-width: 46ch;
  font-size: var(--type-sm);
  line-height: 1.7;
  color: var(--text-muted);
}
.connections-platform-btn {
  flex-shrink: 0;
  opacity: 0.55;
  cursor: not-allowed;
}
.connections-footer {
  padding-top: 16px;
  border-top: 1px solid var(--border-hairline);
}
.connections-footer-text {
  margin: 0;
  max-width: 48ch;
  font-size: var(--type-sm);
  line-height: 1.7;
  color: var(--text-muted);
}

@media (max-width: 720px) {
  .connections-page-inner {
    padding: 8px 24px 0;
  }
  .connections-header {
    padding: 24px 0 36px;
  }
  .connections-hero {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 24px;
    margin-bottom: 40px;
  }
  .connections-hero-mascot {
    justify-self: center;
    width: 112px;
    height: 112px;
  }
  .connections-flow,
  .connections-platforms {
    margin-bottom: 40px;
  }
  .connections-platform {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 24px;
  }
  .connections-platform-btn {
    justify-self: start;
  }
  .optlab-settings-panel .optlab-content-add {
    grid-template-columns: 1fr;
  }
  .optlab-settings-panel .optlab-feed-import-row {
    grid-template-columns: 1fr;
  }
}

/* Mobile dashboard: sidebar → fixed top nav (must load after desktop .rail rules) */
@media (max-width: 900px) {
  .variant-a {
    flex-direction: column;
    min-height: 100dvh;
    --shell-rail-active-width: 0px;
  }
  .variant-a .main {
    order: 1;
    flex: 1;
    min-width: 0;
    min-height: 0;
    padding-top: calc(64px + env(safe-area-inset-top, 0px));
    padding-bottom: 0;
  }
  .variant-a.is-rail-collapsed .main {
    padding-top: calc(var(--top-nav-height) + env(safe-area-inset-top, 0px));
  }
  .variant-a .rail {
    order: 0;
    position: fixed;
    top: 0;
    bottom: auto;
    left: 0;
    right: 0;
    z-index: 10050;
    width: 100%;
    min-width: 0;
    max-width: 100vw;
    height: auto;
    max-height: none;
    min-height: 56px;
    flex: 0 0 auto;
    align-self: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 0;
    padding: calc(8px + env(safe-area-inset-top, 0px)) 10px 8px;
    border-right: none;
    border-bottom: 2px solid var(--ansaur-sage);
    background: var(--surface-base);
    box-shadow: 0 8px 28px oklch(0.34 0.06 155 / 0.14);
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    opacity: 1;
    pointer-events: auto;
    transition: none;
  }
  .variant-a.is-rail-collapsed .rail {
    display: none;
  }
  .rail-toggle--mobile {
    display: inline-flex;
    align-self: center;
    margin: 0 8px 0 4px;
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
  }
  .rail-toggle--mobile .rail-toggle-icon {
    font-size: 1rem;
  }
  .variant-a.is-rail-collapsed .top-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10050;
  }
  .variant-a.is-rail-collapsed .top-nav-inner {
    height: calc(var(--top-nav-height) + env(safe-area-inset-top, 0px));
    min-height: calc(var(--top-nav-height) + env(safe-area-inset-top, 0px));
    padding-top: env(safe-area-inset-top, 0px);
    padding-left: var(--shell-chrome-width);
  }
  .variant-a.is-rail-collapsed {
    --shell-chrome-top: calc(env(safe-area-inset-top, 0px) + (var(--top-nav-height) - var(--shell-control-height)) / 2);
  }
  .variant-a.is-rail-collapsed .rail-toggle--shell,
  .variant-a.is-rail-collapsed .shell-brand {
    top: var(--shell-chrome-top);
  }
  .variant-a .rail::-webkit-scrollbar,
  .variant-a .rail-scroll::-webkit-scrollbar {
    display: none;
  }
  .variant-a .rail-head,
  .variant-a .rail-credits,
  .variant-a .rail-user,
  .variant-a .rail-usage-stage,
  .variant-a .nav-group-label,
  .variant-a .nav-divider {
    display: none !important;
  }
  .variant-a .rail-scroll {
    display: flex;
    flex-direction: row;
    flex: 1;
    min-width: 0;
    min-height: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0;
    align-items: stretch;
  }
  .variant-a .nav-item {
    flex: 0 0 auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-width: 4.75rem;
    padding: 6px 10px;
    margin: 0;
    font-size: var(--type-2xs);
    font-weight: 600;
    text-align: center;
    line-height: 1.2;
    border-radius: 6px;
  }
  .variant-a .nav-sub-item {
    padding: 6px 10px;
    font-size: var(--type-2xs);
  }
  .variant-a .nav-label {
    flex: none;
    white-space: nowrap;
  }
  .variant-a .nav-count {
    min-width: 0;
    padding: 1px 6px;
    font-size: 0.65rem;
  }
  .variant-a .nav-item.nav-soon .soon-badge {
    font-size: 0.55rem;
    padding: 1px 4px;
  }
  body.wf-busy .variant-a .rail,
  body.wf-busy .variant-a.is-rail-collapsed .top-nav {
    position: fixed;
    z-index: 10002;
  }

  /* Toolbar — search, sort, export on one row */
  .variant-a .toolbar {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
  }
  .variant-a .toolbar .toolbar-filters .search {
    width: auto;
    min-width: 100px;
    flex: 1 1 100px;
  }
  .variant-a .toolbar .btn-sm,
  .toolbar-sort {
    flex-shrink: 0;
    white-space: nowrap;
  }

  /* Question rows: question / volume / search / actions */
  .variant-a .data-table thead { display: none; }
  .variant-a .data-table,
  .variant-a .data-table tbody { display: block; width: 100%; }
  .variant-a .data-table tbody tr.question-row {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border-hairline);
  }
  .variant-a .data-table tbody tr.question-row td {
    display: block;
    padding: 0;
    border: none;
  }
  .variant-a .data-table tbody tr.question-row td.kw {
    font-size: var(--type-sm);
    line-height: 1.35;
  }
  .variant-a .is-desktop { display: none !important; }
  .variant-a .is-mobile {
    display: block;
    width: 100%;
  }
  .variant-a .row-mobile-pack {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .variant-a .row-mobile-volumes {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 10px;
  }
  .variant-a .row-mobile-volumes .vol {
    font-family: var(--font-mono);
    font-size: var(--type-sm);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  .variant-a .row-mobile-volumes .vol-label {
    font-family: var(--font-ui);
    font-size: var(--type-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-muted);
  }
  .variant-a .row-mobile-volumes .rank-cell {
    flex: 0 0 auto;
  }
  .variant-a .row-mobile-search .row-search-inline {
    flex-wrap: wrap !important;
    gap: 4px;
    white-space: normal;
  }
  .variant-a .row-mobile-actions .row-tools-actions {
    flex-wrap: wrap !important;
    gap: 4px;
    white-space: normal;
  }
  .variant-a .row-mobile-search .btn-search {
    font-size: var(--type-xs);
    padding: 6px 10px;
  }
  .variant-a .row-mobile-actions .row-tools-actions .btn-sm {
    font-size: var(--type-sm);
    padding: 6px 10px;
  }
}

/* Optimize Lab — 6×4 tool grid */
.brain-page--grid {
  --optlab-tool-slot-h: 5.625rem;
  --optlab-mode-bg: var(--surface-base);
  --optlab-mode-ring: var(--ansaur-moss);
  --optlab-mode-ring-border: var(--border-hairline);
  --optlab-mode-ring-soft: oklch(0.46 0.075 155 / 0.45);
  --optlab-mode-ring-glow: oklch(0.46 0.075 155 / 0.12);
  --optlab-mode-ring-glow-md: oklch(0.46 0.075 155 / 0.16);
  --optlab-mode-ring-glow-lg: oklch(0.46 0.075 155 / 0.22);
  --optlab-mode-ring-glow-xl: oklch(0.46 0.075 155 / 0.28);
  --optlab-mode-ring-glow-land: oklch(0.46 0.075 155 / 0.35);
  --optlab-mode-ring-shadow: oklch(0.46 0.075 155 / 0.08);
  --optlab-mode-ring-inset: oklch(0.46 0.075 155 / 0.15);
  --optlab-mode-ring-dash: oklch(0.46 0.075 155 / 0.45);
  --optlab-mode-ring-drop-inset: oklch(0.94 0.025 155 / 0.8);
  --optlab-mode-ring-drop-pulse: oklch(0.80 0.055 155 / 0.35);
  --optlab-mode-wipe-mid: oklch(0.76 0.04 25);
  --optlab-flip-duration: 1200ms;
  --optlab-flip-stagger: 100ms;
  --optlab-flip-ease: cubic-bezier(0.77, 0, 0.175, 1);
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 100%;
  background-color: var(--optlab-mode-bg);
}
.brain-page--grid.brain-page--mode-transitioning {
  transition: background-color 1.8s cubic-bezier(0.77, 0, 0.175, 1);
}
.brain-page--grid.brain-page--mode-transitioning .optlab-grid-tool:not(.optlab-grid-tool--placeholder):not(:hover):not(.optlab-grid-tool--used):not(.optlab-grid-tool--dragging),
.brain-page--grid.brain-page--mode-transitioning .optlab-grid-well:not(.optlab-grid-well--dragover):not(.optlab-grid-well--ready),
.brain-page--grid.brain-page--mode-transitioning .optlab-grid-rail:not(.optlab-grid-rail--dragover),
.brain-page--grid.brain-page--mode-transitioning .optlab-grid-session:not(:hover):not(.optlab-grid-session--active):not(.optlab-grid-session--fresh) {
  transition:
    border-color 1.8s cubic-bezier(0.77, 0, 0.175, 1),
    box-shadow 1.8s cubic-bezier(0.77, 0, 0.175, 1),
    background 1.8s cubic-bezier(0.77, 0, 0.175, 1);
}
.brain-page--grid.brain-page--mode-transitioning .optlab-grid-well-dropzone-ring {
  transition:
    border-color 1.8s cubic-bezier(0.77, 0, 0.175, 1),
    box-shadow 1.8s cubic-bezier(0.77, 0, 0.175, 1);
}
.optlab-mode-bg-wipe {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  clip-path: ellipse(0% 0% at 0% 100%);
  --optlab-wipe-from: transparent;
  --optlab-wipe-to: transparent;
  --optlab-wipe-mid: var(--optlab-mode-wipe-mid);
}
/* Hue bridge wipe: soft origin → warm blush mid → destination mode color */
.optlab-mode-bg-wipe--from-bl {
  background: linear-gradient(
    to top right,
    var(--optlab-wipe-from) 0%,
    var(--optlab-wipe-from) 18%,
    var(--optlab-wipe-mid) 42%,
    var(--optlab-wipe-mid) 58%,
    var(--optlab-wipe-to) 82%,
    var(--optlab-wipe-to) 100%
  );
}
.optlab-mode-bg-wipe--from-tr {
  background: linear-gradient(
    to bottom left,
    var(--optlab-wipe-from) 0%,
    var(--optlab-wipe-from) 18%,
    var(--optlab-wipe-mid) 42%,
    var(--optlab-wipe-mid) 58%,
    var(--optlab-wipe-to) 82%,
    var(--optlab-wipe-to) 100%
  );
}
.optlab-mode-bg-wipe--from-br {
  background: linear-gradient(
    to top left,
    var(--optlab-wipe-from) 0%,
    var(--optlab-wipe-from) 18%,
    var(--optlab-wipe-mid) 42%,
    var(--optlab-wipe-mid) 58%,
    var(--optlab-wipe-to) 82%,
    var(--optlab-wipe-to) 100%
  );
}
.optlab-mode-bg-wipe--from-tl {
  background: linear-gradient(
    to bottom right,
    var(--optlab-wipe-from) 0%,
    var(--optlab-wipe-from) 18%,
    var(--optlab-wipe-mid) 42%,
    var(--optlab-wipe-mid) 58%,
    var(--optlab-wipe-to) 82%,
    var(--optlab-wipe-to) 100%
  );
}
.optlab-mode-bg-wipe--active {
  animation-duration: 1.8s;
  animation-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
  animation-fill-mode: forwards;
}
.optlab-mode-bg-wipe--settling {
  animation: none !important;
  clip-path: inset(0 0 0 0) !important;
  opacity: 1;
}
.optlab-mode-bg-wipe--active.optlab-mode-bg-wipe--from-bl {
  animation-name: optlab-mode-bg-wipe-bl;
}
.optlab-mode-bg-wipe--active.optlab-mode-bg-wipe--from-tr {
  animation-name: optlab-mode-bg-wipe-tr;
}
.optlab-mode-bg-wipe--active.optlab-mode-bg-wipe--from-br {
  animation-name: optlab-mode-bg-wipe-br;
}
.optlab-mode-bg-wipe--active.optlab-mode-bg-wipe--from-tl {
  animation-name: optlab-mode-bg-wipe-tl;
}
@keyframes optlab-mode-bg-wipe-bl {
  0% {
    clip-path: ellipse(0% 0% at 0% 100%);
  }
  40% {
    clip-path: ellipse(62% 48% at 0% 100%);
  }
  68% {
    clip-path: ellipse(118% 118% at 0% 100%);
  }
  86% {
    clip-path: inset(0 0 0 0);
  }
  100% {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes optlab-mode-bg-wipe-tr {
  0% {
    clip-path: ellipse(0% 0% at 100% 0%);
  }
  40% {
    clip-path: ellipse(62% 48% at 100% 0%);
  }
  68% {
    clip-path: ellipse(118% 118% at 100% 0%);
  }
  86% {
    clip-path: inset(0 0 0 0);
  }
  100% {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes optlab-mode-bg-wipe-br {
  0% {
    clip-path: ellipse(0% 0% at 100% 100%);
  }
  40% {
    clip-path: ellipse(62% 48% at 100% 100%);
  }
  68% {
    clip-path: ellipse(118% 118% at 100% 100%);
  }
  86% {
    clip-path: inset(0 0 0 0);
  }
  100% {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes optlab-mode-bg-wipe-tl {
  0% {
    clip-path: ellipse(0% 0% at 0% 0%);
  }
  40% {
    clip-path: ellipse(62% 48% at 0% 0%);
  }
  68% {
    clip-path: ellipse(118% 118% at 0% 0%);
  }
  86% {
    clip-path: inset(0 0 0 0);
  }
  100% {
    clip-path: inset(0 0 0 0);
  }
}
.brain-page--grid .brain-page-inner {
  position: relative;
  z-index: 1;
  flex: 1;
  width: 100%;
  max-width: none;
  margin: 0;
  padding-top: clamp(12px, 2vw, 20px);
  padding-left: clamp(20px, 2.5vw, 48px);
  padding-right: clamp(20px, 2.5vw, 48px);
  padding-bottom: clamp(24px, 3vh, 48px);
}
.brain-page--grid.brain-page--mode-enhance {
  --optlab-mode-bg: oklch(0.74 0.048 288);
  --optlab-mode-ring: oklch(0.46 0.10 288);
  --optlab-mode-wipe-color: oklch(0.72 0.065 288);
  --optlab-mode-ring-border: oklch(0.46 0.10 288 / 0.38);
  --optlab-mode-ring-soft: oklch(0.46 0.10 288 / 0.45);
  --optlab-mode-ring-glow: oklch(0.46 0.10 288 / 0.12);
  --optlab-mode-ring-glow-md: oklch(0.46 0.10 288 / 0.16);
  --optlab-mode-ring-glow-lg: oklch(0.46 0.10 288 / 0.22);
  --optlab-mode-ring-glow-xl: oklch(0.46 0.10 288 / 0.28);
  --optlab-mode-ring-glow-land: oklch(0.46 0.10 288 / 0.35);
  --optlab-mode-ring-shadow: oklch(0.46 0.10 288 / 0.08);
  --optlab-mode-ring-inset: oklch(0.46 0.10 288 / 0.15);
  --optlab-mode-ring-dash: oklch(0.46 0.10 288 / 0.45);
  --optlab-mode-ring-drop-inset: oklch(0.74 0.048 288 / 0.55);
  --optlab-mode-ring-drop-pulse: oklch(0.46 0.10 288 / 0.35);
}
.brain-page--grid.brain-page--mode-generate {
  --optlab-mode-bg: oklch(0.80 0.09 350);
  --optlab-mode-ring: oklch(0.52 0.15 350);
  --optlab-mode-wipe-color: oklch(0.77 0.11 350);
  --optlab-mode-ring-border: oklch(0.52 0.15 350 / 0.38);
  --optlab-mode-ring-soft: oklch(0.52 0.15 350 / 0.45);
  --optlab-mode-ring-glow: oklch(0.52 0.15 350 / 0.12);
  --optlab-mode-ring-glow-md: oklch(0.52 0.15 350 / 0.16);
  --optlab-mode-ring-glow-lg: oklch(0.52 0.15 350 / 0.22);
  --optlab-mode-ring-glow-xl: oklch(0.52 0.15 350 / 0.28);
  --optlab-mode-ring-glow-land: oklch(0.52 0.15 350 / 0.35);
  --optlab-mode-ring-shadow: oklch(0.52 0.15 350 / 0.08);
  --optlab-mode-ring-inset: oklch(0.52 0.15 350 / 0.15);
  --optlab-mode-ring-dash: oklch(0.52 0.15 350 / 0.45);
  --optlab-mode-ring-drop-inset: oklch(0.80 0.09 350 / 0.55);
  --optlab-mode-ring-drop-pulse: oklch(0.52 0.15 350 / 0.35);
}
.brain-page--grid.brain-page--mode-focus {
  --optlab-mode-bg: oklch(0.11 0 0);
  --optlab-mode-ring: oklch(0.72 0.02 85);
  --optlab-mode-wipe-color: oklch(0.14 0.005 85);
  --optlab-mode-ring-border: oklch(0.72 0.02 85 / 0.28);
  --optlab-mode-ring-soft: oklch(0.72 0.02 85 / 0.38);
  --optlab-mode-ring-glow: oklch(0.72 0.02 85 / 0.1);
  --optlab-mode-ring-glow-md: oklch(0.72 0.02 85 / 0.14);
  --optlab-mode-ring-glow-lg: oklch(0.72 0.02 85 / 0.18);
  --optlab-mode-ring-glow-xl: oklch(0.72 0.02 85 / 0.24);
  --optlab-mode-ring-glow-land: oklch(0.72 0.02 85 / 0.3);
  --optlab-mode-ring-shadow: oklch(0.72 0.02 85 / 0.06);
  --optlab-mode-ring-inset: oklch(0.72 0.02 85 / 0.12);
  --optlab-mode-ring-dash: oklch(0.72 0.02 85 / 0.38);
  --optlab-mode-ring-drop-inset: oklch(0.14 0.005 85 / 0.55);
  --optlab-mode-ring-drop-pulse: oklch(0.72 0.02 85 / 0.28);
}
.brain-page--grid.brain-page--mode-focus .optlab-tip {
  display: none;
}
.brain-page--grid .optlab-tip {
  margin-top: 18px;
}
.brain-page--grid .optlab-grid-frame {
  margin-top: 0;
}
.optlab-grid-well-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.optlab-grid-well-mode-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: center;
  gap: 6px;
}
.optlab-grid-well-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 12px 18px 0;
}
.optlab-grid-well-source-tabs,
.optlab-grid-well-toolbar {
  margin-bottom: 0;
}
.optlab-grid-well-toolbar {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: nowrap;
  flex: 1;
  min-width: 0;
}
.optlab-grid-well-header-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  width: 100%;
  min-height: 22px;
}
.optlab-grid-well-header-bar .optlab-mode-tabs.optlab-grid-well-toolbar,
.optlab-grid-well-header-bar .optlab-grid-well-toolbar {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 0;
  flex-wrap: nowrap;
  flex: 1;
  min-width: 0;
}
.optlab-grid-well-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin-left: auto;
}
.optlab-save-status {
  font-family: var(--font-mono);
  font-size: var(--type-2xs);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--text-muted);
  white-space: nowrap;
}
.optlab-grid-rail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}
.optlab-archive-clear-btn {
  flex-shrink: 0;
  font-size: var(--type-2xs);
  padding: 0 6px;
  height: 20px;
  min-height: 20px;
  white-space: nowrap;
}
.optlab-grid-session--editing {
  border-color: var(--optlab-mode-ring);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--optlab-mode-ring) 35%, transparent);
}
.optlab-grid-session-title-input {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 2px 4px;
  border: 1px solid var(--border-hairline);
  border-radius: 4px;
  background: var(--surface-base);
  font-family: var(--font-display);
  font-size: var(--type-sm);
  font-weight: 700;
  line-height: 1.3;
  color: var(--text-primary);
}
.optlab-grid-session-title-input:focus {
  outline: 2px solid var(--optlab-mode-ring);
  outline-offset: 1px;
}
.optlab-handoff-actions .btn-danger {
  background: var(--btn-wf-danger-bg);
  border: 1px solid var(--btn-wf-danger-border);
  color: var(--btn-wf-danger-color);
}
.optlab-handoff-actions .btn-danger:hover:not(:disabled) {
  background: var(--btn-wf-danger-bg-hover);
  border-color: color-mix(in srgb, var(--ansaur-red-deep) 60%, transparent);
}
.optlab-grid-well-header-bar .btn-sm {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 22px;
  min-height: 22px;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1;
  padding: 0 7px;
  gap: 3px;
  border: 2px solid var(--nb-stroke);
  border-radius: 3px;
  box-shadow: none;
  transform: none;
  white-space: nowrap;
  vertical-align: middle;
}
.optlab-grid-well-header-bar .btn-sm:hover:not(:disabled),
.optlab-grid-well-header-bar .btn-sm:active:not(:disabled),
.optlab-grid-well-header-bar .toolbar-filter-btn[aria-pressed="true"],
.optlab-grid-well-header-bar .toolbar-filter-btn--open {
  transform: none;
  box-shadow: none;
}
.optlab-article-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.optlab-article-head--actions-only {
  justify-content: flex-end;
  margin-bottom: 4px;
}
.optlab-mode-magic {
  position: relative;
  align-self: auto;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  -webkit-tap-highlight-color: transparent;
}
.optlab-mode-magic:focus-visible {
  outline: 2px solid var(--optlab-mode-ring);
  outline-offset: 4px;
  border-radius: 999px;
}
.optlab-mode-magic-track {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  align-items: center;
  width: 7.75rem;
  height: 2.25rem;
  padding: 3px;
  border-radius: 999px;
  border: 1px solid var(--border-hairline);
  background: var(--surface-inset);
}
.optlab-mode-magic-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: calc(33.333% - 3px);
  height: calc(100% - 6px);
  border-radius: 999px;
  background: var(--surface-base);
  border: 1px solid var(--border-hairline);
  box-shadow: 0 1px 2px oklch(0.34 0.06 155 / 0.08);
  transition: transform 240ms var(--ease-out-quart);
  z-index: 0;
}
.optlab-mode-magic--ideas .optlab-mode-magic-thumb {
  transform: translateX(100%);
}
.optlab-mode-magic--focus .optlab-mode-magic-thumb {
  transform: translateX(200%);
}
.optlab-mode-magic-face {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.optlab-mode-magic-face:focus-visible {
  outline: 2px solid var(--optlab-mode-ring);
  outline-offset: 2px;
  border-radius: 999px;
}
.optlab-mode-magic-glyph {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.125rem;
  line-height: 1;
  opacity: 0.45;
  transition: opacity 200ms var(--ease-out-quart);
}
.optlab-mode-magic--enhance .optlab-mode-magic-face--enhance .optlab-mode-magic-glyph,
.optlab-mode-magic--ideas .optlab-mode-magic-face--generate .optlab-mode-magic-glyph,
.optlab-mode-magic--focus .optlab-mode-magic-face--focus .optlab-mode-magic-glyph {
  opacity: 1;
}
.optlab-grid-inspect-foot {
  margin-top: 8px;
}
.optlab-grid-frame {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-template-rows: auto auto;
  gap: clamp(10px, 1.2vw, 14px);
  margin-top: 0;
  align-items: start;
}
.optlab-grid-frame--focus .optlab-grid-spine--placed {
  grid-column: 1 / -1;
  grid-row: 1 / -1;
  z-index: 3;
}
.optlab-grid-spine--expanding {
  z-index: 4;
  will-change: transform;
}
.optlab-grid-top-cell,
.optlab-grid-flank {
  transition:
    opacity 320ms var(--ease-out-quart),
    transform 420ms var(--ease-out-quart);
}
.optlab-grid-frame--focus .optlab-grid-top-cell,
.optlab-grid-frame--focus .optlab-grid-flank {
  opacity: 0;
  transform: scale(0.96);
  pointer-events: none;
}
.optlab-grid-frame--flipping {
  pointer-events: none;
}
.optlab-grid-top-cell {
  min-width: 0;
  height: var(--optlab-tool-slot-h);
}
.optlab-grid-tool-slot {
  position: relative;
  width: 100%;
  height: var(--optlab-tool-slot-h);
  min-height: var(--optlab-tool-slot-h);
  max-height: var(--optlab-tool-slot-h);
  flex-shrink: 0;
  overflow: visible;
  perspective: 1000px;
}
.optlab-grid-tool-turn {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transform: rotateY(0deg);
  transform-origin: center center;
  will-change: auto;
}
.optlab-grid-tool-face {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
}
.optlab-grid-tool-face--back {
  transform: rotateY(180deg);
}
.optlab-grid-tool-face--front:has(.optlab-grid-tool--dragging) {
  transform: scale(0.97);
  transition: transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.optlab-grid-flank--placed-left {
  grid-column: 1 / 3;
  grid-row: 2;
}
.optlab-grid-flank--placed-right {
  grid-column: 5 / 7;
  grid-row: 2;
}
.optlab-grid-spine--placed {
  grid-column: 3 / 5;
  grid-row: 2;
}
.optlab-grid-flank {
  display: flex;
  flex-direction: column;
  gap: clamp(10px, 1.2vw, 14px);
  min-width: 0;
  align-self: start;
}
.optlab-grid-flank-tools {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: var(--optlab-tool-slot-h);
  gap: clamp(10px, 1.2vw, 14px);
  align-content: start;
}
.optlab-grid-tool {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  height: 100%;
  padding: 10px 8px;
  border: 1px solid var(--border-hairline);
  border-radius: 10px;
  background: var(--surface-base);
  cursor: grab;
  user-select: none;
  text-align: center;
  box-sizing: border-box;
  backface-visibility: hidden;
  overflow: hidden;
  transition:
    border-color 160ms var(--ease-out-quart),
    box-shadow 160ms var(--ease-out-quart),
    opacity 160ms var(--ease-out-quart);
}
.brain-page--grid .optlab-grid-tool:not(.optlab-grid-tool--placeholder),
.brain-page--grid .optlab-grid-well,
.brain-page--grid .optlab-grid-rail,
.brain-page--grid .optlab-grid-session {
  border-color: var(--optlab-mode-ring-border);
}
.brain-page--grid .optlab-grid-well--focus {
  border-color: rgba(0, 0, 0, 0.28);
}
.optlab-grid-tool:hover {
  border-color: var(--optlab-mode-ring);
  box-shadow: 0 2px 0 var(--optlab-mode-ring-shadow);
}
.optlab-grid-tool:active {
  cursor: grabbing;
}
.optlab-grid-tool--used {
  border-color: var(--optlab-mode-ring-soft);
  background: var(--ansaur-sage-soft);
}
.optlab-grid-tool--placeholder {
  cursor: default;
  background: var(--surface-inset);
  border-style: dashed;
  border-color: var(--border-hairline);
  opacity: 0.55;
}
.optlab-grid-tool--placeholder:hover {
  border-color: var(--border-hairline);
  box-shadow: none;
}
.optlab-grid-tool--dragging {
  opacity: 0.38;
  border-style: dashed;
  border-color: var(--optlab-mode-ring);
  background: var(--ansaur-sage-soft);
  box-shadow: none;
}
.optlab-grid-drag-active .optlab-grid-tool:not(.optlab-grid-tool--dragging) {
  opacity: 0.55;
  transition: opacity 200ms var(--ease-out-quart);
}
.optlab-grid-drag-ghost {
  position: fixed;
  top: -1000px;
  left: -1000px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border: 2px solid var(--optlab-mode-ring);
  border-radius: 10px;
  background: var(--surface-base);
  box-shadow: 0 10px 28px oklch(0.34 0.06 155 / 0.18);
  pointer-events: none;
  white-space: nowrap;
}
.optlab-grid-drag-ghost-icon {
  width: 2.25rem;
  height: 2.25rem;
  padding: 4px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.optlab-grid-drag-ghost-icon .optlab-tool-icon-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.optlab-grid-drag-ghost-name {
  font-family: var(--font-display);
  font-size: var(--type-sm);
  font-weight: 700;
  color: var(--text-primary);
}
.optlab-grid-tool-icon {
  width: 2.75rem;
  height: 2.75rem;
  padding: 5px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.optlab-tool-icon-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.optlab-grid-tool:hover .optlab-tool-icon-img {
  animation: optlab-tool-icon-bob 1s ease-in-out infinite;
}
@keyframes optlab-tool-icon-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
@media (prefers-reduced-motion: reduce) {
  .optlab-grid-tool:hover .optlab-tool-icon-img { animation: none; }
}
.optlab-grid-tool-name {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  flex: 0 0 auto;
  min-height: calc(2 * 1.25 * 1em);
  max-height: calc(2 * 1.25 * 1em);
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-sm);
  font-weight: 700;
  line-height: 1.25;
  color: var(--text-primary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}
.optlab-grid-tool-placeholder-label {
  margin: auto;
  padding: 0 6px;
  font-size: var(--type-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.optlab-grid-spine {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
  min-width: 0;
}
.optlab-grid-well {
  position: relative;
  flex: 0 0 auto;
  padding: 0;
  border: 2px solid var(--border-hairline);
  border-radius: 10px;
  background: var(--surface-base);
  overflow: hidden;
  transition: border-color 280ms var(--ease-out-quart), box-shadow 280ms var(--ease-out-quart);
}
.optlab-grid-well-content {
  padding: 16px 18px;
}
.optlab-grid-well--focus {
  min-height: calc(100vh - 10rem);
  background: var(--optlab-mode-bg);
  border-color: oklch(0 0 0);
  color: oklch(0.93 0.01 85);
}
.optlab-grid-well--focus .optlab-grid-well-content {
  padding: 16px 20px 20px;
}
.optlab-grid-well--focus .optlab-draft-meta,
.optlab-grid-well--focus .optlab-save-status {
  color: oklch(0.72 0.02 85 / 0.6);
}
.optlab-grid-well-header--focus {
  padding-top: 12px;
}
.optlab-grid-well-toolbar--focus {
  margin-left: 0;
}
.optlab-article--focus .optlab-draft-title {
  font-size: var(--type-lg);
  padding: 14px 16px;
}
.optlab-draft-text--focus {
  min-height: calc(100vh - 14rem);
  font-size: var(--type-md);
  line-height: 1.6;
  padding: 14px 16px;
  resize: vertical;
}
.optlab-article--focus .optlab-draft-title,
.optlab-article--focus .optlab-draft-text--focus {
  background: oklch(0.965 0.008 85);
  color: oklch(0.26 0.01 85);
  border-color: oklch(0 0 0);
}
.optlab-article--focus .optlab-draft-title::placeholder,
.optlab-article--focus .optlab-draft-text--focus::placeholder {
  color: oklch(0.55 0.01 85);
}
.optlab-article--focus .optlab-draft-title:focus-visible,
.optlab-article--focus .optlab-draft-text--focus:focus-visible {
  border-color: oklch(0 0 0);
  box-shadow: 0 0 0 3px oklch(0 0 0 / 0.25);
}

/* Focus mode: darker green mode toggle to sit on the black canvas */
.brain-page--mode-focus .optlab-mode-magic-track {
  background: oklch(0.3 0.05 155);
  border-color: oklch(0.24 0.045 155);
}
.brain-page--mode-focus .optlab-mode-magic-thumb {
  background: oklch(0.43 0.07 155);
  border-color: oklch(0.5 0.075 155);
  box-shadow: 0 1px 2px oklch(0 0 0 / 0.3);
}

/* Focus mode: hide the nav bar completely for a distraction-free desk */
.variant-a.is-optlab-focus .top-nav {
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
  border-bottom-color: transparent;
  box-shadow: none;
}
.variant-a.is-optlab-focus .shell-brand {
  opacity: 0;
  pointer-events: none;
}
.variant-a.is-optlab-focus.is-rail-collapsed .main {
  padding-top: 0;
}
.optlab-grid-well-dropzone {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 20px;
  background: oklch(0.94 0.025 155 / 0.58);
  opacity: 0;
  pointer-events: none;
  transition: opacity 220ms var(--ease-out-quart);
  overflow: hidden;
}
.optlab-grid-well-dropzone.is-visible {
  opacity: 1;
}
.optlab-dropzone-swirl {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 220ms var(--ease-out-quart);
  mask-image: radial-gradient(ellipse 78% 68% at 50% 46%, #000 0%, #000 42%, transparent 92%);
  -webkit-mask-image: radial-gradient(ellipse 78% 68% at 50% 46%, #000 0%, #000 42%, transparent 92%);
}
.optlab-grid-well-dropzone.is-visible .optlab-dropzone-swirl {
  opacity: 1;
}
.optlab-dropzone-swirl-canvas {
  position: absolute;
  left: 50%;
  top: 46%;
  transform: translate(-50%, -50%);
  width: min(280px, 72%);
  height: min(280px, 58%);
  max-width: 100%;
  pointer-events: none;
}
.optlab-grid-well-dropzone-ring,
.optlab-grid-well-dropzone-label,
.optlab-grid-well-dropzone-tool {
  position: relative;
  z-index: 1;
}
.optlab-grid-well-dropzone.is-deny .optlab-dropzone-swirl {
  opacity: 0.45;
  filter: saturate(0.35) brightness(0.9);
}
.optlab-grid-well-dropzone.is-splash .optlab-dropzone-swirl::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    circle at 50% 48%,
    color-mix(in oklch, var(--optlab-mode-ring) 50%, white) 0%,
    transparent 55%
  );
  animation: optlab-dropzone-swirl-splash 480ms var(--ease-out-quart) forwards;
  pointer-events: none;
}
@keyframes optlab-dropzone-swirl-splash {
  0% {
    opacity: 0.9;
    transform: scale(0.6);
  }
  100% {
    opacity: 0;
    transform: scale(1.4);
  }
}
.optlab-grid-well-dropzone.is-ready .optlab-grid-well-dropzone-ring {
  border-color: var(--optlab-mode-ring);
  animation: optlab-drop-ring 1.1s var(--ease-out-quart) infinite;
}
.optlab-grid-well-dropzone.is-deny .optlab-grid-well-dropzone-ring {
  border-color: var(--text-muted);
  animation: none;
}
.optlab-grid-well-dropzone-ring {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  border: 2px dashed var(--optlab-mode-ring-dash);
  background: var(--surface-base);
  box-shadow: inset 0 0 0 4px var(--optlab-mode-ring-drop-inset);
}
.optlab-grid-well-dropzone-label {
  font-family: var(--font-display);
  font-size: var(--type-sm);
  font-weight: 700;
  color: var(--ansaur-moss-deep);
  text-align: center;
}
.optlab-grid-well-dropzone-tool {
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-muted);
  text-align: center;
}
@keyframes optlab-drop-ring {
  0%, 100% {
    transform: scale(1);
    box-shadow: inset 0 0 0 4px var(--optlab-mode-ring-drop-inset);
  }
  50% {
    transform: scale(1.06);
    box-shadow: inset 0 0 0 6px var(--optlab-mode-ring-drop-pulse);
  }
}
.optlab-grid-well--ready {
  border-color: var(--optlab-mode-ring);
  box-shadow: 0 0 0 3px var(--optlab-mode-ring-glow);
}
.optlab-grid-well--dragover {
  border-color: var(--optlab-mode-ring);
  box-shadow: 0 0 0 4px var(--optlab-mode-ring-glow-lg);
  animation: optlab-well-pulse 900ms var(--ease-out-quart) infinite;
}
.optlab-grid-well--landed {
  animation: optlab-well-land 520ms var(--ease-out-quart);
}
.optlab-grid-well--deny-shake {
  animation: optlab-well-shake 420ms var(--ease-out-quart);
}
@keyframes optlab-well-pulse {
  0%, 100% {
    box-shadow: 0 0 0 3px var(--optlab-mode-ring-glow-md);
  }
  50% {
    box-shadow: 0 0 0 7px var(--optlab-mode-ring-glow-xl);
  }
}
@keyframes optlab-well-land {
  0% {
    border-color: var(--optlab-mode-ring);
    box-shadow: 0 0 0 10px var(--optlab-mode-ring-glow-land);
  }
  100% {
    border-color: var(--optlab-mode-ring);
    box-shadow: 0 0 0 3px var(--optlab-mode-ring-glow);
  }
}
@keyframes optlab-well-shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-5px); }
  40% { transform: translateX(5px); }
  60% { transform: translateX(-3px); }
  80% { transform: translateX(3px); }
}
.optlab-grid-well .optlab-load {
  margin: 0;
}
.optlab-grid-well .optlab-article {
  margin: 0;
}
.optlab-article-surface {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0 -18px -16px;
  padding: 0 18px 16px;
  background: var(--surface-base);
}
.optlab-article-surface .optlab-article {
  padding-bottom: 4px;
}
.optlab-article-sections {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid var(--border-hairline);
  margin-top: 8px;
  padding-top: 4px;
}
.optlab-article-sections-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 0 8px;
}
.optlab-article-sections-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-sm);
  font-weight: 700;
  color: var(--text-primary);
}
.optlab-article-sections-count {
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-muted);
  white-space: nowrap;
}
.optlab-article-section {
  margin: 0;
  padding: 14px 0;
  border: none;
  border-top: 1px solid var(--border-hairline);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.optlab-article-section:first-of-type {
  border-top: none;
}
.optlab-article-section--fresh {
  animation: optlab-reveal 500ms var(--ease-out-quart);
}
.optlab-article-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.optlab-article-section-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-md);
  font-weight: 700;
  line-height: 1.3;
  color: var(--text-primary);
}
.optlab-article-section-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.optlab-article-section-body {
  margin: 0;
  padding: 0;
  font-size: var(--type-md);
  line-height: 1.6;
  white-space: pre-wrap;
  background: transparent;
  border-radius: 0;
  max-height: none;
  overflow: visible;
  color: var(--text-primary);
}
.optlab-article-section-body--reveal {
  animation: optlab-reveal 500ms var(--ease-out-quart);
}
.optlab-article-section-placeholder {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  background: transparent;
  border-radius: 0;
}
.optlab-article-section--queued .optlab-article-section-title,
.optlab-article-section--running .optlab-article-section-title {
  color: var(--text-muted);
}
.optlab-article-section--running .optlab-article-section-title {
  color: var(--ansaur-moss-deep);
}
.optlab-article-section-error {
  margin: 0;
  padding: 10px 12px;
  font-size: var(--type-sm);
  line-height: 1.55;
  color: #9b2c2c;
  background: #fff0f0;
  border-radius: 6px;
}
.optlab-article-section .optlab-output-notes {
  margin-bottom: 10px;
}
.optlab-grid-stack {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.optlab-grid-stack-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  flex-shrink: 0;
}
.optlab-grid-stack-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-sm);
  font-weight: 700;
  color: var(--text-primary);
}
.optlab-grid-stack-count {
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-muted);
}
.optlab-grid-stack-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: auto;
  max-height: min(48vh, 32rem);
  padding-right: 2px;
}
.optlab-grid-stack-list .optlab-output {
  padding: 12px 14px;
}
.optlab-grid-stack-list .optlab-output-body {
  font-size: var(--type-sm);
  max-height: 14rem;
}
.optlab-grid-rail {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  padding: 12px 14px;
  border: 2px solid var(--border-hairline);
  border-radius: 10px;
  background: var(--surface-base);
}
.optlab-grid-rail-label {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.optlab-grid-rail-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  overflow: auto;
  max-height: min(36vh, 24rem);
}
.optlab-grid-rail-list:has(.optlab-grid-rail-empty) {
  flex: 1 1 auto;
  min-height: 7.5rem;
  max-height: none;
  align-items: center;
  justify-content: center;
}
.optlab-grid-session {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--border-hairline);
  border-radius: 8px;
  background: var(--surface-base);
  text-align: left;
  cursor: grab;
  transition: border-color 160ms var(--ease-out-quart), background 160ms var(--ease-out-quart);
}
.optlab-grid-session:active {
  cursor: grabbing;
}
.optlab-grid-session:hover {
  border-color: var(--optlab-mode-ring);
  background: var(--ansaur-sage-soft);
}
.optlab-grid-session--active {
  border-color: var(--optlab-mode-ring);
  background: var(--ansaur-sage-soft);
  box-shadow: inset 0 0 0 1px var(--optlab-mode-ring-inset);
}
.optlab-grid-session--draft {
  border-color: var(--optlab-mode-ring-soft);
  background: color-mix(in oklch, var(--optlab-mode-bg) 40%, var(--surface-base));
}
.optlab-grid-session--idea {
  border-style: dashed;
}
.optlab-grid-session--fresh {
  animation: optlab-card-in 420ms var(--ease-out-quart) both;
  border-color: var(--optlab-mode-ring);
  box-shadow: 0 0 0 2px var(--optlab-mode-ring-glow-lg);
}
.optlab-grid-session--dragging {
  opacity: 0.55;
}
.optlab-grid-session-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: var(--type-2xs);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: oklch(0.42 0.10 350);
  background: oklch(0.92 0.04 350);
}
.optlab-grid-session-badge--idea {
  color: var(--text-muted);
  background: var(--surface-inset);
}
.optlab-grid-tool--x {
  border-color: color-mix(in oklch, var(--border-hairline) 70%, oklch(0.45 0.02 250));
}
.optlab-grid-tool-icon--x {
  color: oklch(0.45 0.02 250);
}
.optlab-tool-icon-svg--x {
  display: block;
  width: 1.35rem;
  height: 1.35rem;
}
.optlab-grid-session--tweet {
  border-color: color-mix(in oklch, var(--optlab-mode-ring-border) 75%, oklch(0.45 0.02 250));
}
.optlab-grid-session-badge--tweet {
  color: oklch(0.45 0.02 250);
  background: oklch(0.94 0.01 250);
}
.optlab-tweet-posts {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid var(--border-hairline);
  margin-top: 8px;
  padding-top: 4px;
}
.optlab-tweet-block .optlab-article-section-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}
.optlab-tweet-charcount {
  margin: 0 0 8px;
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  color: var(--text-muted);
}
.optlab-tweet-charcount--warn {
  color: #9b2c2c;
  font-weight: 600;
}
.optlab-tweet-hint {
  margin: 10px 0 0;
  font-size: var(--type-sm);
  line-height: 1.5;
  color: var(--text-muted);
}
.optlab-tweet-hint--preview {
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  word-break: break-word;
}
.optlab-tweet-body {
  font-size: var(--type-md);
}
.optlab-tweet-desk {
  padding: 4px 0 8px;
}
.optlab-tweet-desk-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.optlab-tweet-desk-technique {
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--text-muted);
}
.optlab-tweet-desk-source {
  margin: 0 0 10px;
  font-size: var(--type-sm);
}
.optlab-tweet-desk-source a {
  color: var(--ansaur-moss-deep);
}
.optlab-tweet-desk-body {
  margin: 0;
  padding: 14px;
  font-size: var(--type-md);
  line-height: 1.6;
  white-space: pre-wrap;
  background: var(--ansaur-sage-soft);
  border-radius: 8px;
}
.optlab-tweet-desk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.brain-cat-pill--promote {
  color: oklch(0.45 0.02 250);
  background: oklch(0.94 0.01 250);
}
.optlab-grid-rail--archive.optlab-grid-rail--dragover,
.optlab-grid-rail--desk.optlab-grid-rail--dragover {
  border-color: var(--optlab-mode-ring);
  box-shadow: 0 0 0 3px var(--optlab-mode-ring-glow-md);
  background: color-mix(in oklch, var(--optlab-mode-bg) 35%, var(--surface-base));
}
.optlab-trash-zone {
  position: fixed;
  bottom: clamp(16px, 3vh, 32px);
  left: calc(var(--shell-rail-active-width, 0px) / 2 + 50vw);
  z-index: 150;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 22px;
  border: 2px solid var(--border-hairline);
  border-radius: 14px;
  background: color-mix(in oklch, var(--surface-base) 92%, var(--text-muted));
  box-shadow: 0 8px 28px oklch(0.2 0.02 155 / 0.14);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%) translateY(12px);
  transition:
    opacity 180ms var(--ease-out-quart),
    transform 180ms var(--ease-out-quart),
    border-color 160ms var(--ease-out-quart),
    background 160ms var(--ease-out-quart),
    box-shadow 160ms var(--ease-out-quart);
}
.optlab-trash-zone--visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.optlab-trash-zone--over {
  border-color: oklch(0.55 0.2 25);
  background: oklch(0.55 0.2 25);
  box-shadow: 0 10px 32px oklch(0.45 0.18 25 / 0.35);
  transform: translateX(-50%) translateY(0) scale(1.05);
  --optlab-trash-slot: oklch(0.72 0.12 25 / 0.45);
}
.optlab-trash-zone--over .optlab-trash-pixel {
  color: #fff;
}
.optlab-trash-zone--over .optlab-trash-label {
  color: #fff;
}
.optlab-trash-pixel {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
}
.optlab-trash-pixel svg {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}
.optlab-trash-label {
  font-family: var(--font-mono);
  font-size: var(--type-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
}
body.optlab-session-drag-active .brain-page--grid::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 100;
  pointer-events: none;
  background: oklch(0.2 0.02 155 / 0.06);
}
@media (prefers-reduced-motion: reduce) {
  .optlab-trash-zone {
    transition: none;
  }
  .optlab-trash-zone--visible {
    transform: translateX(-50%) translateY(0);
  }
}
.optlab-handoff-backdrop {
  position: fixed;
  inset: 0;
  z-index: 220;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: oklch(0.2 0.02 155 / 0.28);
}
.optlab-handoff {
  width: min(100%, 28rem);
  padding: 22px 24px;
  border: 1px solid var(--border-hairline);
  border-radius: 12px;
  background: var(--surface-base);
  box-shadow: 0 18px 48px oklch(0.2 0.02 155 / 0.12);
}
.optlab-handoff-title {
  margin: 0 0 8px;
  font-family: var(--font-display);
  font-size: var(--type-lg);
  font-weight: 700;
  color: var(--text-primary);
}
.optlab-handoff-text {
  margin: 0 0 16px;
  font-size: var(--type-sm);
  line-height: 1.5;
  color: var(--text-muted);
}
.optlab-handoff-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.optlab-article--editable .optlab-article-edit-body {
  min-height: 14rem;
}
.optlab-grid-session-title {
  font-family: var(--font-display);
  font-size: var(--type-sm);
  font-weight: 700;
  line-height: 1.3;
  color: var(--text-primary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.optlab-grid-session-meta {
  font-family: var(--font-mono);
  font-size: var(--type-2xs);
  color: var(--text-muted);
}
.optlab-grid-rail-empty {
  margin: 0;
  padding: 1.25rem 0.75rem;
  font-size: var(--type-xs);
  line-height: 1.45;
  color: var(--text-muted);
  text-align: center;
}
.optlab-grid-inspect-backdrop {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: oklch(0.2 0.02 155 / 0.28);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(16px, 4vh, 48px) 16px;
  overflow: auto;
}
.optlab-grid-inspect {
  width: min(40rem, 100%);
  max-height: min(88vh, 52rem);
  overflow: auto;
  padding: 20px 22px 24px;
  border: 1px solid var(--border-hairline);
  border-radius: 10px;
  background: var(--surface-base);
  box-shadow: 0 16px 48px oklch(0.2 0.02 155 / 0.18);
}
.optlab-grid-inspect-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.optlab-grid-inspect-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-xl);
  font-weight: 700;
  line-height: 1.2;
}
.optlab-grid-inspect-lead {
  margin: 6px 0 0;
  font-size: var(--type-sm);
  color: var(--text-muted);
  line-height: 1.45;
}
.optlab-grid-inspect-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}
.optlab-output-skeleton {
  margin: 0;
  padding: 14px 16px;
  border-radius: 6px;
  background: var(--ansaur-sage-soft);
  filter: blur(5px);
  opacity: 0.85;
  pointer-events: none;
}
.optlab-output-skeleton-line {
  display: block;
  height: 0.65rem;
  margin-bottom: 0.5rem;
  border-radius: 4px;
  background: oklch(0.46 0.075 155 / 0.22);
}
.optlab-output-skeleton-line:last-child {
  margin-bottom: 0;
  width: 72%;
}
.optlab-output-body--reveal {
  animation: optlab-text-reveal 480ms var(--ease-out-quart) forwards;
}
@keyframes optlab-text-reveal {
  from {
    filter: blur(6px);
    opacity: 0.5;
  }
  to {
    filter: blur(0);
    opacity: 1;
  }
}
@media (max-width: 960px) {
  .brain-page--grid .brain-page-inner {
    overflow-x: clip;
  }
  .optlab-grid-frame {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: none;
    grid-auto-rows: auto;
  }
  .optlab-grid-top-cell {
    grid-column: auto !important;
    grid-row: auto !important;
  }
  .optlab-grid-flank--placed-left,
  .optlab-grid-flank--placed-right,
  .optlab-grid-spine--placed {
    grid-column: 1 / -1;
    grid-row: auto;
  }
  .optlab-grid-spine--placed {
    order: -1;
    min-width: 0;
  }
  .optlab-grid-well-header {
    padding-left: 14px;
    padding-right: 14px;
  }
  .optlab-grid-well-header-bar {
    flex-wrap: wrap;
    gap: 8px;
  }
  .optlab-grid-well-mode-wrap {
    width: 100%;
    justify-content: center;
  }
  .optlab-grid-well-toolbar {
    flex-wrap: wrap;
  }
  .optlab-grid-well-header-actions {
    margin-left: 0;
    width: 100%;
    justify-content: flex-end;
  }
  .brain-page--grid .optlab-grid-tool-name {
    font-size: var(--type-xs);
  }
}
@media (prefers-reduced-motion: reduce) {
  .optlab-mode-bg-wipe--active {
    animation: none;
  }
  .optlab-output-body--reveal {
    animation: none;
  }
  .optlab-grid-well--dragover,
  .optlab-grid-well--landed,
  .optlab-grid-well--deny-shake,
  .optlab-grid-well-dropzone.is-ready .optlab-grid-well-dropzone-ring {
    animation: none;
  }
  .optlab-grid-well-dropzone,
  .optlab-grid-drag-active .optlab-grid-tool:not(.optlab-grid-tool--dragging) {
    transition: none;
  }
  .optlab-dropzone-swirl-canvas {
    display: none !important;
  }
  .optlab-mode-magic-thumb {
    transition: none;
  }
  .optlab-grid-spine--expanding {
    transform: none !important;
    transition: none !important;
  }
  .optlab-grid-top-cell,
  .optlab-grid-flank {
    transition: none;
  }
  .optlab-grid-tool-turn {
    transform: none !important;
  }
}

/* Optimize Lab — large monitors: scale workshop density */
@media (min-width: 1200px) {
  .brain-page--grid .optlab-grid-tool-name {
    font-size: var(--type-md);
  }
}
@media (min-width: 1440px) {
  .brain-page--grid {
    --optlab-tool-slot-h: 6.25rem;
  }
  .brain-page--grid .optlab-grid-tool-name {
    font-size: var(--type-lg);
  }
  .brain-page--grid .optlab-grid-frame,
  .brain-page--grid .optlab-grid-flank {
    gap: clamp(12px, 1.4vw, 16px);
  }
  .brain-page--grid .optlab-grid-flank-tools {
    gap: clamp(12px, 1.4vw, 16px);
  }
}
@media (min-width: 1920px) {
  .brain-page--grid {
    --optlab-tool-slot-h: 7rem;
  }
  .brain-page--grid .brain-page-inner {
    padding-left: clamp(24px, 2.5vw, 56px);
    padding-right: clamp(24px, 2.5vw, 56px);
  }
  .brain-page--grid .optlab-grid-frame,
  .brain-page--grid .optlab-grid-flank,
  .brain-page--grid .optlab-grid-flank-tools {
    gap: clamp(14px, 1.5vw, 18px);
  }
  .brain-page--grid .optlab-grid-well-content {
    padding: 18px 22px;
  }
  .brain-page--grid .optlab-grid-rail-list {
    max-height: min(42vh, 28rem);
  }
  .brain-page--grid .optlab-draft-text {
    min-height: min(20rem, 38vh);
  }
}
@media (min-width: 2560px) {
  .brain-page--grid {
    --optlab-tool-slot-h: 7.75rem;
  }
  .brain-page--grid .brain-page-inner {
    padding-left: clamp(32px, 2.5vw, 64px);
    padding-right: clamp(32px, 2.5vw, 64px);
  }
  .brain-page--grid .optlab-grid-frame,
  .brain-page--grid .optlab-grid-flank,
  .brain-page--grid .optlab-grid-flank-tools {
    gap: clamp(16px, 1.6vw, 20px);
  }
  .brain-page--grid .optlab-grid-well-content {
    padding: 20px 26px;
  }
  .brain-page--grid .optlab-grid-rail-list {
    max-height: min(48vh, 32rem);
  }
  .brain-page--grid .optlab-draft-text {
    min-height: min(24rem, 44vh);
  }
}


/* Research wizard + export queue cap */
.nav-item.nav-cta {
  width: 100%;
  margin: 0 0 8px;
  padding: 10px 12px;
  border: 2px solid var(--ansaur-moss);
  border-radius: var(--radius-sm);
  background: var(--ansaur-sage-soft);
  color: var(--ansaur-moss-deep);
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}
.nav-item.nav-cta:hover {
  background: oklch(0.9 0.04 155 / 0.85);
  border-color: var(--ansaur-moss-deep);
}
.nav-item.nav-cta.nav-cta--wizard {
  position: relative;
  border-color: transparent;
  color: #fff;
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
  background-image: linear-gradient(
    90deg,
    #ff004c,
    #ff8a00,
    #ffe600,
    #00e676,
    #00c2ff,
    #7a5cff,
    #ff00d4,
    #ff004c
  );
  background-size: 300% 100%;
  background-position: 0% 50%;
  animation: navCtaWizardSlide 4s linear infinite;
  box-shadow:
    0 0 8px rgba(255, 0, 212, 0.55),
    0 0 18px rgba(0, 194, 255, 0.45);
}
.nav-item.nav-cta.nav-cta--wizard:hover {
  border-color: transparent;
  background-image: linear-gradient(
    90deg,
    #ff004c,
    #ff8a00,
    #ffe600,
    #00e676,
    #00c2ff,
    #7a5cff,
    #ff00d4,
    #ff004c
  );
  animation-duration: 2s;
  box-shadow:
    0 0 12px rgba(255, 0, 212, 0.7),
    0 0 26px rgba(0, 194, 255, 0.6);
}
@keyframes navCtaWizardSlide {
  to {
    background-position: 300% 50%;
  }
}
@media (prefers-reduced-motion: reduce) {
  .nav-item.nav-cta.nav-cta--wizard {
    animation: none;
  }
}
.research-wizard-hunt-banner {
  margin: 0 0 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--border, #d8e8de);
  border-radius: 8px;
  background: #f4faf6;
  color: var(--text, #2a3d30);
  font-size: 0.9375rem;
  line-height: 1.45;
}
.research-wizard-card {
  width: min(720px, 100%);
  max-height: min(92vh, 820px);
}
.research-wizard-crt {
  --crt-width: min(440px, 100%);
  --crt-power-ms: 2.5s;
  --crt-power-delay: 0.35s;
  --crt-fx-ms: 2.2s;
  --scout-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --scout-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --scout-crt-frame-ms: 1.4s;
  --crt-screen-left: 26.17%;
  --crt-screen-top: 12.4%;
  --crt-screen-right: 29.36%;
  --crt-screen-bottom: 42.1%;
  margin: 12px 0 14px;
  display: flex;
  justify-content: center;
}
.research-wizard-crt .crt-frame-wrap {
  padding: 0;
}
.research-wizard-crt-stage {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  overflow: hidden;
  background: #050505;
  padding: 5px 7px 6px;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 8px;
  line-height: 1.35;
  color: #6fe89a;
  text-shadow: 0 0 6px color-mix(in srgb, #6fe89a 35%, transparent);
}
.research-wizard-crt-status {
  flex: 0 0 auto;
  display: grid;
  gap: 2px;
  padding-bottom: 4px;
  border-bottom: 1px solid color-mix(in srgb, #6fe89a 22%, transparent);
}
.research-wizard-crt-live-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-bottom: 2px;
  border-radius: 50%;
  background: #ff5a5a;
  box-shadow: 0 0 6px color-mix(in srgb, #ff5a5a 70%, transparent);
  animation: jobs-pulse 1.6s ease-out infinite;
}
.research-wizard-crt-status-line {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #9dffba;
}
.research-wizard-crt-status-meta,
.research-wizard-crt-queue {
  margin: 0;
  color: color-mix(in srgb, #6fe89a 72%, #050505);
  font-size: 7px;
  letter-spacing: 0.02em;
}
.research-wizard-crt-stall {
  margin: 2px 0 0;
  color: #ffd56a;
  font-size: 7px;
}
.research-wizard-crt-feed {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.research-wizard-crt-feed-head {
  flex: 0 0 auto;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 2px 0 3px;
  color: color-mix(in srgb, #6fe89a 55%, #050505);
  font-size: 7px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-bottom: 1px dashed color-mix(in srgb, #6fe89a 18%, transparent);
}
.research-wizard-crt-feed-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding-top: 3px;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, #6fe89a 35%, transparent) transparent;
}
.research-wizard-crt-feed-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 1px 0;
  color: #8ef5b0;
}
.research-wizard-crt-feed-row--new {
  animation: research-wizard-crt-row-in 0.45s ease-out;
}
@keyframes research-wizard-crt-row-in {
  from {
    opacity: 0;
    transform: translateX(-4px);
    filter: brightness(1.8);
  }
  to {
    opacity: 1;
    transform: translateX(0);
    filter: none;
  }
}
.research-wizard-crt-feed-kw {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.research-wizard-crt-feed-vol {
  flex-shrink: 0;
  color: color-mix(in srgb, #6fe89a 70%, #050505);
}
.research-wizard-crt-feed-empty,
.research-wizard-crt-feed-more {
  margin: 4px 0 0;
  color: color-mix(in srgb, #6fe89a 60%, #050505);
  font-style: italic;
}
.crt-host--powering .research-wizard-crt-stage .research-wizard-crt-feed,
.crt-host--powering .research-wizard-crt-stage .research-wizard-crt-status {
  opacity: 0;
  visibility: hidden;
}
.crt-host--on .research-wizard-crt-stage .research-wizard-crt-feed,
.crt-host--on .research-wizard-crt-stage .research-wizard-crt-status {
  animation: crt-wizard-content-in var(--scout-crt-content-in-ms, 0.95s) var(--scout-ease-out) forwards;
}
@keyframes crt-wizard-content-in {
  0% {
    opacity: 0;
    filter: brightness(1.75) saturate(0.65);
  }
  100% {
    opacity: 1;
    filter: none;
  }
}
.research-wizard-table {
  margin-top: 8px;
}
.research-wizard-table .kw {
  max-width: 28rem;
}
.research-wizard-hunt-list {
  margin: 0;
  padding-left: 20px;
  line-height: 1.6;
}
.research-wizard-hunt-status {
  color: var(--text-muted);
  font-size: var(--type-sm);
}
.research-wizard-phrase-list {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.research-wizard-phrase-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle, #e2e8e4);
  border-radius: 8px;
  background: var(--surface-muted, #f8faf9);
}
.research-wizard-phrase-text {
  flex: 1;
  min-width: 0;
}
.research-wizard-phrase-status {
  font-size: var(--type-sm);
  color: var(--text-muted);
  white-space: nowrap;
}
.research-wizard-phrase-status--searching,
.research-wizard-phrase-status--queued {
  color: var(--accent-red, #c44);
}
.research-wizard-phrase-status--skipped_cap,
.research-wizard-phrase-status--skipped_credits {
  color: var(--accent-amber, #b45309);
}
.research-wizard-phrase-empty {
  color: var(--text-muted);
  font-size: var(--type-sm);
  padding: 8px 0;
}
.research-wizard-manual-add {
  margin-top: 12px;
}
.research-wizard-manual-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.research-wizard-manual-row .seed-onboard-input {
  flex: 1;
}
.research-wizard-progress-banner {
  margin: 12px 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.research-wizard-crt--compact .research-wizard-crt-stage {
  max-height: 180px;
}
.research-wizard-finish-notice {
  margin: 0 0 10px;
  padding: 8px 12px;
  border-radius: 8px;
  background: var(--surface-muted, #f4f7f5);
  font-size: var(--type-sm);
}
.research-wizard-unharvested-banner {
  margin-bottom: 12px;
}
.jobs-seed-run-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.jobs-seed-run-status {
  font-size: var(--type-xs, 11px);
  color: var(--text-muted);
  font-weight: 500;
}
.jobs-seed-run-btn--searching,
.jobs-seed-run-btn--queued {
  opacity: 0.85;
}
.research-wizard-hunt-status-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--surface-muted, #f4f7f5);
  font-size: var(--type-sm);
}
.research-wizard-hunt-status-bar .jobs-status-dot.is-live {
  background: var(--accent-red);
  animation: jobs-pulse 1.6s ease-out infinite;
}
.research-wizard-hunt-status-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.research-wizard-hunt-status-meta {
  color: var(--text-muted);
  flex-shrink: 0;
}
.research-wizard-hunt-stall {
  margin: 0 0 10px;
  padding: 8px 12px;
  border-radius: 8px;
  background: #fff8e6;
  color: #8a6116;
  font-size: var(--type-sm);
}
.research-wizard-hunt-empty {
  margin: 12px 0 0;
  color: var(--text-muted);
  font-size: var(--type-sm);
  font-style: italic;
}
.research-wizard-hunt-table-wrap {
  max-height: 220px;
  overflow-y: auto;
  margin-top: 12px;
  border: 1px solid var(--border-subtle, #d8e8de);
  border-radius: 8px;
}
.research-wizard-hunt-row--new {
  animation: research-wizard-row-in 0.45s ease-out;
}
@keyframes research-wizard-row-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.research-wizard-queue,
.queue-cap-label {
  font-size: var(--type-sm);
  font-weight: 600;
  color: var(--ansaur-moss-deep);
}
.grid-top-bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}
.grid-top-bar .btn-export[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}
.research-wizard-queue-full {
  margin: 0 0 10px;
  color: var(--signal-alert, #b42318);
  font-size: var(--type-sm);
}
.research-wizard-footnote a {
  color: var(--ansaur-moss);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.research-wizard-footnote a:hover {
  color: var(--ansaur-moss-deep);
}