/* Shared controls for actual sidebars; no remount or layout animation on collapse. */
.names-screen {
  --names-fold-text: #285f4c;
  --names-fold-bg: #e7f2eb;
  --names-fold-border: #83ad97;
}
body[data-theme="tech"] .names-screen {
  --names-fold-text: #c1ebdc;
  --names-fold-bg: #203e3c;
  --names-fold-border: #639f96;
}
body[data-theme="ink"] .names-screen {
  --names-fold-text: #f0d8aa;
  --names-fold-bg: #302f29;
  --names-fold-border: #a88e62;
}
.names-screen .names-sidebar-collapse-head {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  flex: 0 0 auto; min-width: 0; padding: 2px 0 8px;
}
.names-screen .names-sidebar-collapse-head strong { font-size: 14px; color: rgba(var(--ui-source-6852c6842910b4-rgb, 40, 95, 76), var(--ui-source-6852c6842910b4-alpha, 1)); }
.names-screen .names-collapsible-sidebar { min-width: 0; }
.names-screen .names-collapsible-sidebar .fixed-character-entry { grid-template-columns: minmax(0, .55fr) minmax(0, 1fr); }
.names-screen .names-collapsible-sidebar .fixed-character-entry :is(label, input, .fixed-character-partner-summary) { min-width: 0; }
body[data-theme] .names-screen :is(.names-panel-toggle, .guided-names-sidebar-toggle, .pronunciation-conditions-toggle, .high-quality-conditions-toggle) {
  flex: 0 0 auto; width: auto; height: 34px; min-height: 34px; padding: 5px 11px;
  border: 1px solid rgba(var(--ui-source-223ced63c6f0b4-rgb, 131, 173, 151), var(--ui-source-223ced63c6f0b4-alpha, 1)); border-radius: 6px;
  background: rgba(var(--ui-source-d851ea2ec7184b-rgb, 231, 242, 235), var(--ui-source-d851ea2ec7184b-alpha, 1)); color: rgba(var(--ui-source-6852c6842910b4-rgb, 40, 95, 76), var(--ui-source-6852c6842910b4-alpha, 1));
  font-size: 12px; font-weight: 600; line-height: 22px; white-space: nowrap;
  box-shadow: inset 0 1px 0 rgba(var(--ui-source-307617cdaa800b-rgb, 255, 255, 255), var(--ui-source-307617cdaa800b-alpha, 0.0392156863));
}
body[data-theme] .names-screen :is(.names-panel-toggle, .guided-names-sidebar-toggle, .pronunciation-conditions-toggle, .high-quality-conditions-toggle):hover {
  border-color: rgba(var(--ui-source-180d370bcfb192-rgb, 40, 95, 76), var(--ui-source-180d370bcfb192-alpha, 1)); background: rgba(var(--ui-source-d851ea2ec7184b-rgb, 231, 242, 235), var(--ui-source-d851ea2ec7184b-alpha, 1)); color: rgba(var(--ui-source-6852c6842910b4-rgb, 40, 95, 76), var(--ui-source-6852c6842910b4-alpha, 1));
}
body[data-theme] .names-screen :is(.names-panel-toggle, .guided-names-sidebar-toggle, .pronunciation-conditions-toggle, .high-quality-conditions-toggle):focus-visible {
  outline: 2px solid rgba(var(--ui-source-fd6c6d76829b0a-rgb, 40, 95, 76), var(--ui-source-fd6c6d76829b0a-alpha, 1)); outline-offset: 3px;
}
.names-screen .names-left-tools.names-collapsible-sidebar { grid-template-rows: auto auto minmax(0, 1fr); }
.names-screen .names-left-tools.names-collapsible-sidebar.regular-controls-collapsed { grid-template-rows: auto minmax(0, 1fr); }
.names-screen .strict-name-workbench-char-sidebar.names-collapsible-sidebar { display: flex; flex-direction: column; }
.names-screen .strict-name-workbench-char-sidebar.names-collapsible-sidebar > .name-char-picker { flex: 1; height: auto; min-height: 0; }
.names-screen .strict-name-workbench-body.names-panel-layout.is-sidebar-collapsed,
.names-screen.names-combination-results-screen .names-panel-layout.is-sidebar-collapsed,
.names-screen.guided-names-screen .guided-names-workbench.is-collapsed { grid-template-columns: 76px minmax(0, 1fr); }
.names-screen .names-panel-layout.is-sidebar-collapsed > .names-collapsible-sidebar {
  display: flex; flex-direction: column; padding: 8px 4px; overflow: hidden; min-height: 0;
}
.names-screen .is-sidebar-collapsed > .names-collapsible-sidebar > [data-names-panel-content] { display: none !important; }
.names-screen .is-sidebar-collapsed .names-sidebar-collapse-head { flex-direction: column; padding: 0; }
.names-screen .is-sidebar-collapsed .names-sidebar-collapse-head strong { display: none; }
body[data-theme] .names-screen .is-sidebar-collapsed .names-panel-toggle,
body .guided-names-screen .guided-names-collapsed-rail .guided-names-sidebar-toggle { width: 66px; height: 34px; padding: 5px 4px; }
.names-screen .guided-names-collapsed-rail > span { color: rgba(var(--ui-source-6852c6842910b4-rgb, 40, 95, 76), var(--ui-source-6852c6842910b4-alpha, 1)); }

/* Regular cards use the same declarations as verb cards in styles.css. */
body[data-theme] .names-screen .names-result-panel.regular-name-display {
  --regular-name-min-width: 190px; --regular-name-row-height: 84px;
  --regular-name-column-gap: 8px; --regular-name-row-gap: 8px;
  --action-image-name-row-height: var(--regular-name-row-height);
}
body[data-theme] .names-screen .regular-name-display .regular-combination-card .quick-name-main {
  height: auto; align-items: center; justify-content: center; padding: 4px 6px;
}
body[data-theme] .names-screen .regular-name-display .regular-combination-card .name-text {
  display: block; font-family: "NameHuiwenMincho", "Songti SC", serif;
  font-size: 34px; font-weight: 400; line-height: 1.15; letter-spacing: .025em;
  text-align: center;
}
body[data-theme="ink"] .names-screen .regular-name-display .regular-card-actions button {
  border-color: var(--ink-n-line); background: rgba(11, 20, 29, .66); color: var(--ink-n-gold);
}
body[data-theme="ink"] .names-screen .regular-name-display .regular-card-actions button:is(.status-favorite, .status-candidate) {
  border-color: var(--ink-n-gold-line); background: #2b2d28; color: #f0dab1;
}
body[data-theme="ink"] .names-screen .names-collapsible-sidebar .temporary-library-sidebar {
  border-color: var(--ink-n-line); background: var(--ink-n-surface); color: var(--ink-n-text);
}

@media (max-width: 900px) {
  body[data-theme] .main.screen-main.with-project-context:has(.names-panel-layout) { overflow-y: auto; }
  body[data-theme] .project-context-content:has(.names-panel-layout),
  body[data-theme] .names-screen:has(.names-panel-layout) {
    display: flex; flex-direction: column; flex: 0 0 auto; height: auto; min-height: 0; overflow: visible;
  }
  body[data-theme] .names-screen .names-panel-layout,
  body[data-theme] .names-screen.action-image-workbench-v2 .names-panel-layout,
  body[data-theme] .names-screen .names-panel-layout.is-sidebar-collapsed {
    display: flex; flex-direction: column; flex: 0 0 auto; height: auto; min-height: 0; overflow: visible;
    width: 100%; min-width: 0;
  }
  body[data-theme] .names-screen .names-panel-layout > .names-collapsible-sidebar {
    flex: 0 0 auto; width: 100%; min-width: 0; max-height: 50vh; overflow: auto; box-sizing: border-box;
  }
  body[data-theme] .names-screen .names-panel-layout > .names-result-panel {
    flex: 0 0 auto; width: 100%; min-width: 0; height: auto; overflow: hidden; box-sizing: border-box;
  }
  body[data-theme] .names-screen .names-panel-layout > .names-result-panel .screen-list-area {
    height: 50vh; min-height: 320px; max-height: 520px; overflow: auto;
  }
  body[data-theme] .names-screen .names-panel-layout .names-sidebar-collapse-head {
    position: sticky; top: 0; z-index: 2; background: rgba(var(--ui-source-d851ea2ec7184b-rgb, 231, 242, 235), var(--ui-source-d851ea2ec7184b-alpha, 1)); padding: 5px 7px; border-radius: 6px;
  }
  body[data-theme] .names-screen .names-panel-layout .names-project-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-theme] .names-screen .names-panel-layout .names-project-row .names-control-actions { grid-column: 1 / -1; }
  body[data-theme] .names-screen .names-panel-layout .names-control-panel { min-width: 0; }
  body[data-theme] .names-screen .names-panel-layout .names-control-panel :is(input, select) { min-width: 0; max-width: 100%; }
  .names-screen .strict-name-workbench-body.names-panel-layout,
  .names-screen.names-combination-results-screen .names-panel-layout,
  .names-screen .strict-name-workbench-body.names-panel-layout.is-sidebar-collapsed,
  .names-screen.names-combination-results-screen .names-panel-layout.is-sidebar-collapsed,
  .names-screen.guided-names-screen .guided-names-workbench.is-collapsed { grid-template-columns: minmax(0, 1fr); }
  .names-screen .names-collapsible-sidebar { max-height: 50vh; }
  .names-screen .names-collapsible-sidebar > .names-char-sidebar { min-height: 0; overflow: auto; }
  .names-screen .names-panel-layout.is-sidebar-collapsed > .names-collapsible-sidebar { max-height: none; }
  .names-screen .is-sidebar-collapsed .names-sidebar-collapse-head { flex-direction: row; justify-content: space-between; width: 100%; }
  .names-screen .is-sidebar-collapsed .names-sidebar-collapse-head strong { display: block; }
  body[data-theme] .names-screen .names-result-panel.regular-name-display { --regular-name-min-width: 190px; --regular-name-row-height: 84px; }
}

/* One visible page of names. The measured grid owns both capacity and row height.
 * Only the combination workbenches opt in; other shared name lists are untouched. */
body:has(.names-viewport-screen),
body:has(.names-viewport-screen) #app,
body:has(.names-viewport-screen) .app-shell {
  height: 100dvh;
  min-height: 0;
  overflow: hidden;
}
body[data-theme] .main.screen-main:has(.names-viewport-screen) {
  height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box;
}
/* Automatic client workspaces render the names screen directly inside main. */
body[data-theme] .main.screen-main:has(> .names-viewport-screen) {
  display: flex;
  flex-direction: column;
}
body[data-theme] .main .project-context-content:has(.names-viewport-screen) {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 0 !important;
  min-height: 0 !important;
  height: auto !important;
  gap: 6px;
  overflow: hidden !important;
}
body[data-theme] .names-screen.names-viewport-screen {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 0 !important;
  min-height: 0 !important;
  min-width: 0;
  height: auto !important;
  gap: 6px;
  overflow: hidden !important;
}
body[data-theme] .names-viewport-screen > :not(.names-workbench):not(.strict-name-workbench-body):not(.guided-names-workbench):not(.names-ai-combo-workspace):not([data-name-ranking-workspace]) {
  flex: 0 0 auto;
  min-width: 0;
}
body[data-theme] .names-viewport-screen > .page-head { margin: 0; }
body[data-theme] .names-viewport-screen > .name-combination-mode {
  display: flex; flex-wrap: nowrap !important; overflow-x: auto; overflow-y: hidden;
  min-height: 34px; max-height: 40px; margin: 0; padding: 2px 0;
  scrollbar-width: none;
}
body[data-theme] .names-viewport-screen > .name-combination-mode > span { display: none; }
body[data-theme] .names-viewport-screen > .name-combination-mode button { flex: 0 0 auto; }
body[data-theme] .names-viewport-screen :is(.names-workbench, .strict-name-workbench-body, .guided-names-workbench, .names-ai-combo-workspace) {
  display: grid !important;
  flex: 1 1 0 !important;
  min-width: 0;
  min-height: 0 !important;
  height: auto !important;
  overflow: hidden !important;
}
body[data-theme] .names-viewport-screen :is(.names-workbench, .strict-name-workbench-body, .guided-names-workbench) {
  grid-template-columns: clamp(220px, 23%, 320px) minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 8px;
}
body[data-theme] .names-viewport-screen :is(.names-panel-layout.is-sidebar-collapsed, .guided-names-workbench.is-collapsed) {
  grid-template-columns: 76px minmax(0, 1fr) !important;
}
body[data-theme] .names-viewport-screen :is(.names-workbench, .strict-name-workbench-body, .guided-names-workbench) > :is(.names-collapsible-sidebar, .guided-names-sidebar) {
  min-height: 0 !important;
  max-height: none;
  height: auto !important;
  min-width: 0;
  overflow: auto;
  box-sizing: border-box;
}
body[data-theme] .names-viewport-screen .names-viewport-panel {
  --names-screen-min-width: 190px;
  --names-screen-min-height: 84px;
  --names-screen-gap: 8px;
  display: flex !important;
  flex-direction: column;
  flex: 1 1 0 !important;
  min-height: 0 !important;
  min-width: 0;
  height: auto !important;
  max-height: none;
  overflow: hidden !important;
  box-sizing: border-box;
  gap: 6px;
}
body[data-theme] .names-viewport-panel > * { flex: 0 0 auto; min-width: 0; }
body[data-theme] .names-viewport-panel.guided-names-results { --names-screen-min-height: 122px; }
body[data-theme] .names-viewport-panel.pronunciation-result-panel { --names-screen-min-height: 102px; }
body[data-theme] .names-viewport-panel.strict-name-workbench-results { --names-screen-min-height: 184px; --names-screen-min-width: 210px; }
body[data-theme] .names-viewport-panel:has(.pronunciation-name-card.with-strict-proof) { --names-screen-min-height: 170px; }
body[data-theme] .names-viewport-panel:has(.action-image-with-proof) { --names-screen-min-height: 145px; }
body[data-theme] .names-viewport-screen .names-viewport-area {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  min-width: 0;
  height: auto !important;
  max-height: none !important;
  overflow: hidden !important;
  scrollbar-gutter: auto !important;
  padding: 2px !important;
  box-sizing: border-box;
}
body[data-theme] .names-viewport-screen .names-viewport-grid {
  display: grid !important;
  grid-template-columns: repeat(var(--names-screen-columns, 1), minmax(0, 1fr)) !important;
  grid-template-rows: none !important;
  grid-auto-flow: row !important;
  grid-auto-rows: var(--names-screen-card-height, var(--names-screen-min-height, 84px)) !important;
  gap: var(--names-screen-gap, 8px) !important;
  align-content: start !important;
  align-items: stretch !important;
  min-height: 0 !important;
  min-width: 0;
  height: 100% !important;
  max-height: none !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box;
}
body[data-theme] .names-viewport-screen .names-viewport-grid[data-names-screen-full="true"] {
  grid-template-rows: repeat(var(--names-screen-rows, 1), minmax(0, 1fr)) !important;
  grid-auto-rows: minmax(0, 1fr) !important;
}
body[data-theme] .names-viewport-screen .names-viewport-grid > :is(.name-item, .smart-funnel-name-card) {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  min-width: 0;
  box-sizing: border-box;
}
body[data-theme] .names-viewport-screen .names-viewport-grid > [data-names-viewport-overflow] {
  display: none !important;
}
body[data-theme] .names-viewport-screen .names-viewport-grid .name-text,
body[data-theme] .names-viewport-screen .names-viewport-grid .guided-name-card-name {
  max-width: 100%;
  overflow: visible;
  text-overflow: clip;
}
body[data-theme] .names-viewport-screen .bottom-actions {
  flex: 0 0 auto;
  min-height: 30px;
  margin: 0;
  padding-top: 4px;
  gap: 6px;
}
body[data-theme] .names-viewport-screen .names-ai-combo-workspace { grid-template-columns: minmax(0, 1fr) !important; }
body[data-theme] .names-viewport-screen .names-ai-combo-results:has(.names-ai-combo-list-area) {
  min-height: 0 !important;
  overflow: hidden !important;
}
body[data-theme] .names-viewport-screen .ai-name-motion-field[data-ai-motion-phase="results"]:has(.names-ai-combo-list-area) {
  display: flex; flex-direction: column; flex: 1 1 0 !important;
  min-height: 0 !important; height: auto !important; overflow: hidden;
}
body[data-theme] .names-viewport-screen .ai-name-motion-results:has(.names-ai-combo-list-area) {
  display: flex; flex-direction: column; flex: 1 1 0;
  min-height: 0; height: 100%; overflow: hidden; gap: 6px;
}
/* Keep the library heading readable when the single-screen sidebar narrows. */
body[data-theme] .names-viewport-screen .names-left-tools .name-char-picker-head {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px;
}
body[data-theme] .names-viewport-screen .names-left-tools .name-char-picker-actions { flex-wrap: wrap; }
body[data-theme] .names-viewport-screen .names-left-tools .name-char-picker-actions > button { flex: 0 0 auto; white-space: nowrap; }
body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .quick-name-item.with-strict-proof { grid-template-rows: minmax(0, 1fr) auto; }
body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .with-strict-proof .quick-name-main {
  flex-direction: column; align-items: stretch; justify-content: center; gap: 4px;
}
body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .with-strict-proof .name-text { text-align: center; }
body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .strict-name-proof-summary { width: 100%; box-sizing: border-box; }
body[data-theme="tech"] .names-viewport-screen[data-names-viewport-mode="temporary"] .name-item .name-text { color: #243448; }
body[data-theme="tech"] .names-viewport-screen[data-names-viewport-mode="temporary"] .strict-name-proof-summary small { color: #594d38; }

@media (max-width: 1100px) {
  body[data-theme] .names-viewport-screen :is(.names-workbench, .strict-name-workbench-body, .guided-names-workbench) {
    grid-template-columns: 210px minmax(0, 1fr) !important;
  }
  body[data-theme] .names-viewport-screen :is(.names-panel-layout.is-sidebar-collapsed, .guided-names-workbench.is-collapsed) {
    grid-template-columns: 76px minmax(0, 1fr) !important;
  }
}
@media (max-width: 600px) {
  body[data-theme] .main.screen-main:has(.names-viewport-screen) { padding-left: 8px; padding-right: 8px; padding-bottom: 8px; gap: 4px; }
  body[data-theme] .names-viewport-screen { gap: 4px; }
  body[data-theme] .names-viewport-screen > .page-head h1 { font-size: 18px; }
  body[data-theme] .names-viewport-screen > .page-head .muted { display: none; }
  body[data-theme] .names-viewport-screen :is(.names-workbench, .strict-name-workbench-body, .guided-names-workbench),
  body[data-theme] .names-viewport-screen :is(.names-panel-layout.is-sidebar-collapsed, .guided-names-workbench.is-collapsed) {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 112px) minmax(0, 1fr) !important;
    gap: 4px;
  }
  body[data-theme] .names-viewport-screen :is(.names-panel-layout.is-sidebar-collapsed, .guided-names-workbench.is-collapsed) { grid-template-rows: 42px minmax(0, 1fr) !important; }
  body[data-theme] .names-viewport-screen :is(.names-collapsible-sidebar, .guided-names-sidebar) { padding: 5px 7px !important; }
  body[data-theme] .names-viewport-screen .names-sidebar-collapse-head { padding: 0 0 4px; }
  body[data-theme] .names-viewport-screen .guided-names-collapsed-rail { flex-direction: row; padding: 0; }
  body[data-theme] .names-viewport-screen .guided-names-collapsed-rail > span { writing-mode: horizontal-tb; }
  body[data-theme] .names-viewport-screen .names-viewport-panel { padding: 6px !important; --names-screen-min-width: 160px; --names-screen-gap: 6px; gap: 4px; }
  body[data-theme] .names-viewport-panel > :is(.section-head, .action-image-result-header, .high-quality-result-header, .pronunciation-result-header, .guided-names-result-head) {
    display: flex !important; flex-wrap: wrap; gap: 4px; padding: 0;
  }
  body[data-theme] .names-viewport-panel :is(h2, .action-image-result-title h2) { font-size: 15px; }
  body[data-theme] .names-viewport-panel :is(.name-stats, .template-name-stats, .action-image-stats, .pronunciation-stats, .high-quality-stats) {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    width: 100% !important; max-width: none; gap: 3px;
  }
  body[data-theme] .names-viewport-panel :is(.name-stats, .template-name-stats, .action-image-stats, .pronunciation-stats, .high-quality-stats) > div { padding: 3px 4px !important; min-height: 0; }
  body[data-theme] .names-viewport-panel :is(.name-stats, .template-name-stats, .action-image-stats, .pronunciation-stats, .high-quality-stats) strong { font-size: 16px; line-height: 18px; }
  body[data-theme] .names-viewport-panel :is(.name-stats, .template-name-stats, .action-image-stats, .pronunciation-stats, .high-quality-stats) span { font-size: 9px; white-space: normal; }
  body[data-theme] .names-viewport-screen .names-viewport-grid :is(.name-text, .guided-name-card-name) { font-size: 28px !important; }
  body[data-theme] .names-viewport-screen .bottom-actions { flex-wrap: nowrap; font-size: 10px; }
  body[data-theme] .names-viewport-screen .bottom-actions button { padding: 3px 6px; min-height: 28px; font-size: 11px; }
  body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .names-result-panel > .compact-page-head {
    display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; margin: 0;
  }
  body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .compact-page-head .row { gap: 4px; flex-wrap: wrap; }
  body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .compact-page-head button { min-height: 26px; padding: 3px 6px; font-size: 11px; }
}
@media (max-height: 760px), (max-width: 600px) {
  body[data-theme] .names-viewport-screen .names-viewport-panel > :is(.section-head, .action-image-result-header, .high-quality-result-header, .pronunciation-result-header) {
    max-height: 120px; overflow: auto; flex-shrink: 1;
  }
  body[data-theme] .names-viewport-screen .names-viewport-panel :is(.action-image-condition-fields, .pronunciation-condition-fields, .high-quality-condition-fields) {
    max-height: 74px; overflow: auto;
  }
  body[data-theme] .names-viewport-screen > .nameology-combination-banner { max-height: 38px; overflow: auto; }
  body[data-theme] .names-viewport-panel .guided-names-result-head p { margin: 0; }
  body[data-theme] .names-viewport-panel .guided-names-result-meta { padding-bottom: 4px; }
}
/* Workbenches whose controls are above the list have no side column. */
body[data-theme] .names-viewport-screen .names-workbench:not(:has(> .names-left-tools, > .action-image-workbench-sidebar, > .names-collapsible-sidebar)) {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
}
body[data-theme] .names-viewport-screen .names-collapsible-sidebar .names-project-row {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
body[data-theme] .names-viewport-screen .names-collapsible-sidebar .names-project-row .names-control-actions {
  grid-column: 1 / -1;
}
body[data-theme] .names-viewport-screen .names-collapsible-sidebar .names-find-row {
  grid-template-columns: minmax(0, 1fr) auto !important;
}
body[data-theme] .names-viewport-screen .names-collapsible-sidebar .names-find-row .names-control-actions button {
  min-width: 0; padding: 5px 10px;
}
body[data-theme] .names-viewport-screen .name-combination-tabs {
  flex-wrap: nowrap !important;
  height: 34px; min-height: 34px; max-height: 34px;
  overflow-x: auto; overflow-y: hidden;
  margin: 0;
}
body[data-theme] .names-viewport-screen .name-combination-tabs > :is(button, label) { flex: 0 0 auto; }
body[data-theme] .names-viewport-screen .name-combination-tabs > span { display: none; }
@media (max-width: 900px) {
  body[data-theme] .names-viewport-screen .shared-name-filter-mode-row > * { flex: 0 0 auto; }
  body[data-theme] .names-viewport-screen .shared-name-filter-mode-row .name-combination-tabs { width: max-content; }
}
/* Short viewports keep the names legible by compressing the surrounding chrome. */
@media (max-height: 500px) {
  body:has(.names-viewport-screen) { --ink-topbar-height: 42px; }
  body[data-theme] .main:has(.names-viewport-screen) > .tech-topbar {
    height: 42px !important; min-height: 0; padding-top: 4px; padding-bottom: 4px;
  }
  body[data-theme] .app-shell:has(.names-viewport-screen) > .mobile-nav-toggle {
    top: 5px; height: 32px; min-height: 32px; padding-top: 3px; padding-bottom: 3px;
  }
  body[data-theme] .main.screen-main:has(.names-viewport-screen) {
    padding-top: 48px !important; padding-bottom: 6px !important;
    padding-left: 10px; padding-right: 10px; gap: 3px;
  }
  body[data-theme="classic"] .main.screen-main:has(.names-viewport-screen) { padding-top: 6px !important; }
  body[data-theme] .names-viewport-screen { gap: 3px !important; }
  body[data-theme] .names-viewport-screen > :is(.page-head, .strict-name-workbench-topline) {
    min-height: 26px; height: 26px; padding: 0; overflow: hidden;
  }
  body[data-theme] .names-viewport-screen > .page-head h1,
  body[data-theme] .names-viewport-screen > .strict-name-workbench-topline h1 { font-size: 16px; }
  body[data-theme] .names-viewport-screen > .page-head p { display: none; }
  body[data-theme] .names-viewport-screen > .page-head button { min-height: 25px; height: 25px; padding: 2px 8px; font-size: 10px; }
  body[data-theme] .names-viewport-screen > .name-combination-mode,
  body[data-theme] .names-viewport-screen .name-combination-tabs { min-height: 30px; height: 30px; max-height: 30px; padding: 0; }
  body[data-theme] .names-viewport-screen .name-combination-mode button { min-height: 26px; height: 26px; padding: 2px 7px; font-size: 10px; }
  body[data-theme] .names-viewport-screen .names-viewport-panel { padding: 5px !important; gap: 3px !important; }
  body[data-theme] .names-viewport-panel > :is(.page-head, .section-head, .action-image-result-header, .high-quality-result-header, .pronunciation-result-header, .guided-names-result-head) {
    min-height: 32px; max-height: 46px; padding: 0 !important; margin: 0; overflow: auto;
  }
  body[data-theme] .names-viewport-panel :is(.name-stats, .template-name-stats, .action-image-stats, .pronunciation-stats, .high-quality-stats) {
    display: flex !important; flex-wrap: nowrap; width: 100%; max-width: none; gap: 5px; margin: 0;
  }
  body[data-theme] .names-viewport-panel :is(.name-stats, .template-name-stats, .action-image-stats, .pronunciation-stats, .high-quality-stats) > div {
    display: flex; flex: 1 1 0; align-items: center; gap: 4px;
    min-height: 0; padding: 2px 4px !important;
  }
  body[data-theme] .names-viewport-panel :is(.name-stats, .template-name-stats, .action-image-stats, .pronunciation-stats, .high-quality-stats) strong { font-size: 14px; line-height: 18px; }
  body[data-theme] .names-viewport-panel :is(.name-stats, .template-name-stats, .action-image-stats, .pronunciation-stats, .high-quality-stats) span { margin: 0; font-size: 9px; line-height: 12px; }
  body[data-theme] .names-viewport-panel :is(.names-result-meta, .guided-names-result-meta) { margin: 0; padding: 0; max-height: 35px; overflow: auto; }
  body[data-theme] .names-viewport-panel .bottom-actions { min-height: 27px; height: 27px; padding-top: 0; flex-wrap: nowrap; }
  body[data-theme] .names-viewport-panel .bottom-actions button { height: 25px; min-height: 25px; font-size: 10px; padding: 2px 5px; }
  body[data-theme] .names-viewport-panel :is(.strict-name-workbench-topline, .strict-name-workbench-toolbar) { min-height: 0; max-height: 38px; overflow: auto; padding: 0; }
  body[data-theme] .names-viewport-panel .strict-name-workbench-active-filters { min-height: 23px; max-height: 23px; overflow: auto; }
}
@media (max-height: 500px) and (max-width: 900px) {
  body[data-theme="classic"] .main.screen-main:has(.names-viewport-screen) { padding-top: 44px !important; }
}
@media (max-height: 500px) and (max-width: 600px) {
  body[data-theme] .names-viewport-screen :is(.names-workbench, .strict-name-workbench-body, .guided-names-workbench) { grid-template-rows: 42px minmax(0, 1fr) !important; }
  body[data-theme] .names-viewport-screen .names-workbench:not(:has(> .names-left-tools, > .action-image-workbench-sidebar, > .names-collapsible-sidebar)) { grid-template-rows: minmax(0, 1fr) !important; }
}
/* Geometry is synchronous: reduced-motion's global duration must not animate
 * the default transition-property:all between two different page capacities. */
body[data-theme] .main:has(.names-viewport-screen),
body[data-theme] .project-context-content:has(.names-viewport-screen),
body[data-theme] .names-viewport-screen,
body[data-theme] .names-viewport-screen :is(.names-workbench, .strict-name-workbench-body, .guided-names-workbench, .names-ai-combo-workspace, .names-collapsible-sidebar, .guided-names-sidebar, .names-viewport-panel, .names-viewport-area, .names-viewport-grid),
body[data-theme] .names-viewport-screen .names-viewport-panel > * {
  transition-property: none !important;
}
body[data-theme] .names-viewport-screen .ai-name-motion-results:has(.names-ai-combo-list-area) {
  padding: 4px !important;
}
@media (max-height: 500px) {
  body[data-theme] .project-context-content:has(.names-viewport-screen) > .name-pool-identity.strict {
    flex: 0 0 auto; margin: 0; min-height: 0; padding: 3px 7px; max-height: 32px; gap: 5px;
  }
  body[data-theme] .project-context-content:has(.names-viewport-screen) > .name-pool-identity.strict :is(small, p) { display: none; }
  body[data-theme] .project-context-content:has(.names-viewport-screen) > .name-pool-identity.strict strong { font-size: 12px; }
  body[data-theme] .project-context-content:has(.names-viewport-screen) > .name-pool-identity.strict button { min-height: 24px; height: 24px; padding: 2px 6px; font-size: 10px; }
  body[data-theme] .names-viewport-panel .ai-combo-result-toolbar { min-height: 28px; padding: 3px 5px; margin: 0; }
  body[data-theme] .names-viewport-panel .ai-combo-result-toolbar-content { min-height: 22px; }
  body[data-theme] .names-viewport-panel .smart-funnel-pagination { flex: 0 0 auto; min-height: 27px; margin: 0; }
  body[data-theme] .names-viewport-panel .smart-funnel-pagination button { min-height: 26px; height: 26px; padding: 2px 6px; }
}
body[data-theme] .names-viewport-screen *,
body[data-theme] .names-viewport-screen *::before,
body[data-theme] .names-viewport-screen *::after { transition-property: none !important; }
@media (max-height: 500px) {
  body[data-theme] .main:has(.names-viewport-screen) > .smart-compact-context-slot { top: 44px !important; }
  body[data-theme] .main:has(.names-viewport-screen) .smart-compact-context-slot .project-reference-card {
    max-height: calc(100dvh - 130px) !important; overflow: auto;
  }
  body[data-theme] .project-context-content:has(.names-viewport-screen) > .name-pool-identity.strict { overflow: hidden; }
  body[data-theme] .names-viewport-screen .pronunciation-review-note { margin: 0; padding: 2px 5px; font-size: 9px; line-height: 12px; }
  body[data-theme] .names-viewport-screen .pronunciation-name-card .name-text { font-size: 26px !important; line-height: 1.1; }
  body[data-theme] .names-viewport-screen .pronunciation-name-card .quick-name-main { padding: 4px 6px; gap: 2px; }
  body[data-theme] .names-viewport-screen .pronunciation-name-card .pronunciation-reading { font-size: 10px; line-height: 12px; margin: 0; }
  body[data-theme] .names-viewport-screen .pronunciation-name-card .strict-name-proof-summary { padding: 3px 5px; gap: 1px; }
  body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .with-strict-proof .quick-name-main { padding: 3px 5px; gap: 2px; }
  body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .with-strict-proof .name-text { font-size: 24px !important; line-height: 1.15; flex: 0 0 auto; }
  body[data-theme] .names-viewport-screen[data-names-viewport-mode="temporary"] .strict-name-proof-summary { padding: 3px 5px; gap: 1px; }
}
/* Project-context names pages must reserve the fixed technology-theme header. */
body[data-theme="tech"] .main.screen-main.with-project-context:has(.names-viewport-screen) {
  padding-top: 94px;
}
@media (max-width: 900px) {
  body[data-theme="tech"] .main.screen-main.with-project-context:has(.names-viewport-screen) {
    padding-top: 88px;
  }
}
@media (max-height: 500px) {
  body[data-theme="tech"] .main.screen-main.with-project-context:has(.names-viewport-screen) {
    padding-top: 48px !important;
  }
}

/* Shortlist feedback stays centered over the active name list without changing its capacity. */
.names-screen .names-message-host { position: relative; }
.names-screen .names-message-host > .floating-message.names-result-message {
  position: absolute;
  z-index: 20;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  translate: -50% -50%;
  width: max-content;
  max-width: min(680px, calc(100% - 24px));
  margin: 0;
  box-sizing: border-box;
}

/* Theme-matched shortlist confirmation, without a dismiss control. */
.names-screen .names-message-host > .floating-message.names-result-message {
  --names-toast-bg: #f6faf7;
  --names-toast-border: #c8ded2;
  --names-toast-text: #285747;
  --names-toast-icon-bg: #e1efe7;
  --names-toast-shadow: rgba(var(--ui-source-f56fdd52a2fee4-rgb, 35, 74, 57), var(--ui-source-f56fdd52a2fee4-alpha, 0.13));
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px 12px 13px;
  border: 1px solid rgba(var(--ui-source-ec4953ef04a208-rgb, 200, 222, 210), var(--ui-source-ec4953ef04a208-alpha, 1));
  border-radius: 12px;
  background: rgba(var(--ui-source-d650235f94a474-rgb, 246, 250, 247), var(--ui-source-d650235f94a474-alpha, 1));
  color: rgba(var(--ui-source-77de32727a9d23-rgb, 40, 87, 71), var(--ui-source-77de32727a9d23-alpha, 1));
  box-shadow: 0 8px 24px rgba(var(--ui-source-f56fdd52a2fee4-rgb, 35, 74, 57), var(--ui-source-f56fdd52a2fee4-alpha, 0.13));
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .02em;
  animation: names-toast-enter 120ms ease-out;
}
.names-result-message .names-result-message-icon {
  display: grid;
  place-items: center;
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  padding: 0;
  border-radius: 50%;
  background: rgba(var(--ui-source-c30344a8fbe648-rgb, 225, 239, 231), var(--ui-source-c30344a8fbe648-alpha, 1));
  color: rgba(var(--ui-source-894ca95c02a24a-rgb, 40, 87, 71), var(--ui-source-894ca95c02a24a-alpha, 1));
}
.names-result-message-icon svg { display: block; width: 18px; height: 18px; }
body[data-theme="tech"] .names-screen .names-message-host > .floating-message.names-result-message {
  --names-toast-bg: #142e38;
  --names-toast-border: #3b726d;
  --names-toast-text: #d4eee4;
  --names-toast-icon-bg: #245447;
  --names-toast-shadow: rgba(0, 9, 17, .28);
}
body[data-theme="ink"] .names-screen .names-message-host > .floating-message.names-result-message {
  --names-toast-bg: #21332d;
  --names-toast-border: #567361;
  --names-toast-text: #d4e5d6;
  --names-toast-icon-bg: #354f40;
  --names-toast-shadow: rgba(0, 0, 0, .26);
}
@keyframes names-toast-enter {
  from { opacity: 0; transform: translateY(4px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .names-screen .names-message-host > .floating-message.names-result-message { animation: none; }
}
