/* Desktop filter/review workspaces. One geometry for all palettes; mobile is independent. */
html:not([data-ui="mobile"]) .main.filter-review-desktop-main {
  min-width: 0;
  overflow: hidden;
}

html:not([data-ui="mobile"]) .filter-review-desktop-main > .project-context-slot {
  justify-content: stretch;
}

html:not([data-ui="mobile"]) .filter-review-desktop-main > .project-context-content {
  min-height: 0;
  min-width: 0;
  overflow: hidden;
}

html:not([data-ui="mobile"]) .filter-review-project-context {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--ui-color-border-content);
  border-radius: 8px;
  background: var(--ui-color-surface-content-bg);
  color: var(--ui-color-text-body);
  box-sizing: border-box;
}

html:not([data-ui="mobile"]) .filter-review-context-summary {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 8px 18px;
  padding: 5px 12px;
  box-sizing: border-box;
}

html:not([data-ui="mobile"]) .filter-review-context-summary > span {
  min-width: 0;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  white-space: nowrap;
}

html:not([data-ui="mobile"]) .filter-review-context-summary small {
  flex: none;
  color: var(--ui-color-text-secondary);
  font-size: 11px;
  font-weight: 400;
}

html:not([data-ui="mobile"]) .filter-review-context-summary :is(strong, b) {
  min-width: 0;
  overflow: hidden;
  color: var(--ui-color-text-heading);
  font-size: 13px;
  text-overflow: ellipsis;
}

html:not([data-ui="mobile"]) .filter-review-context-client {
  max-width: 29%;
}

html:not([data-ui="mobile"]) .filter-review-context-client strong {
  font-size: 15px;
}

html:not([data-ui="mobile"]) .filter-review-context-favorable {
  max-width: 24%;
}

html:not([data-ui="mobile"]) .filter-review-context-summary > button {
  min-height: 30px;
  padding: 4px 9px;
  border-radius: 6px;
  font-size: 11px;
  line-height: 1.4;
  white-space: nowrap;
}

html:not([data-ui="mobile"]) .filter-review-context-summary > .filter-review-context-toggle {
  flex: none;
  margin-left: auto;
  border-color: var(--ui-color-action-secondary-border);
  background: var(--ui-color-action-secondary-bg);
  color: var(--ui-color-action-secondary-fg);
}

html:not([data-ui="mobile"]) .filter-review-context-summary > .filter-review-context-warning {
  border-color: var(--ui-color-status-warning-border);
  background: var(--ui-color-status-warning-bg);
  color: var(--ui-color-status-warning-fg);
}

html:not([data-ui="mobile"]) .filter-review-context-body {
  max-height: min(34dvh, 320px);
  overflow: auto;
  scrollbar-gutter: stable;
  border-top: 1px solid var(--ui-color-border-subtle);
}

html:not([data-ui="mobile"]) .filter-review-context-body[hidden],
html:not([data-ui="mobile"]) .filter-review-collapsible-sidebar > [data-filter-review-sidebar-content][hidden] {
  display: none !important;
}

html:not([data-ui="mobile"]) .filter-review-context-body > .project-reference-card {
  width: 100%;
  max-width: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

/* The original workflow menu stays inside the expanded, scrollable customer card. */
html:not([data-ui="mobile"]) .filter-review-context-body .project-reference-progress-panel {
  position: static;
  width: min(450px, 100%);
  margin-top: 6px;
}

html:not([data-ui="mobile"]) :is(.filter-workbench-screen, .review-screen) {
  min-width: 0;
  min-height: 0;
  gap: 8px;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-one-screen {
  border: 1px solid var(--ui-color-border-workspace);
  border-radius: 9px;
  background: var(--ui-color-surface-content-bg);
  box-shadow: none;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-workbench-head {
  min-height: 42px;
  gap: 12px;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-workbench-head h1 {
  font-size: 20px;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console {
  --filter-workspace-rail: 170px;
  --filter-workspace-summary: 260px;
  grid-template-columns: var(--filter-workspace-rail) minmax(0, 1fr) var(--filter-workspace-summary);
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console.is-sidebar-collapsed {
  --filter-workspace-rail: 76px;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console-nav {
  gap: 6px;
  padding: 8px;
  border-color: var(--ui-color-border-workspace);
  background: var(--ui-color-surface-content-bg);
  overflow-y: auto;
  overflow-x: hidden;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console-nav > button {
  min-height: 49px;
  border-radius: 7px;
  border-color: var(--ui-color-border-subtle);
  background: var(--ui-color-surface-content-bg);
  color: var(--ui-color-text-body);
  box-shadow: none;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console-nav > button.active {
  border-color: var(--ui-color-selection-control-border);
  background: var(--ui-color-selection-control-bg);
  color: var(--ui-color-selection-control-fg);
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console-nav > button i {
  background: var(--ui-color-surface-inset-bg);
  color: var(--ui-color-text-icon);
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console-nav > button.active i {
  background: var(--ui-color-action-primary-bg);
  color: var(--ui-color-action-primary-fg);
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console-summary {
  border-color: var(--ui-color-border-workspace);
  background: var(--ui-color-surface-content-bg);
  overflow-y: auto;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-stage-panel {
  overflow-y: auto;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-stage-title {
  min-height: 36px;
  margin-bottom: 7px;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-stage-title h2 {
  font-size: 16px;
}

html:not([data-ui="mobile"]) .filter-workbench-screen .filter-workbench-topline,
html:not([data-ui="mobile"]) .filter-workbench-screen .filter-action-bar {
  border-color: var(--ui-color-border-workspace);
  background: var(--ui-color-surface-content-bg);
}

html:not([data-ui="mobile"]) .filter-review-sidebar-head {
  min-width: 0;
  min-height: 31px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--ui-color-border-subtle);
}

html:not([data-ui="mobile"]) .filter-review-sidebar-head > strong {
  color: var(--ui-color-text-heading);
  font-size: 12px;
  white-space: nowrap;
}

html:not([data-ui="mobile"]) .filter-review-sidebar-head > .filter-review-sidebar-toggle {
  min-width: 0;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 4px 6px;
  border: 1px solid var(--ui-color-action-secondary-border);
  border-radius: 6px;
  background: var(--ui-color-action-secondary-bg);
  color: var(--ui-color-action-secondary-fg);
  box-shadow: none;
  font-size: 11px;
  text-align: center;
  white-space: nowrap;
}

html:not([data-ui="mobile"]) .filter-review-sidebar-caption {
  display: none;
  color: var(--ui-color-text-secondary);
  font-size: 11px;
}

html:not([data-ui="mobile"]) .is-sidebar-collapsed > .filter-review-collapsible-sidebar {
  align-self: stretch;
  align-content: start;
  grid-template-rows: auto;
  padding: 8px;
}

html:not([data-ui="mobile"]) .is-sidebar-collapsed > .filter-review-collapsible-sidebar > .filter-review-sidebar-head {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  padding-bottom: 0;
  border: 0;
}

html:not([data-ui="mobile"]) .is-sidebar-collapsed > .filter-review-collapsible-sidebar > .filter-review-sidebar-head > strong {
  display: none;
}

html:not([data-ui="mobile"]) .is-sidebar-collapsed .filter-review-sidebar-caption {
  display: block;
  text-align: center;
  white-space: nowrap;
}

html:not([data-ui="mobile"]) .review-screen .grid.two.review-layout {
  grid-template-columns: minmax(330px, 360px) minmax(0, 1fr);
}

html:not([data-ui="mobile"]) .review-screen .grid.two.review-layout.is-sidebar-collapsed {
  grid-template-columns: 76px minmax(0, 1fr);
}

html:not([data-ui="mobile"]) .review-screen .review-tools.filter-review-collapsible-sidebar {
  min-width: 0;
  align-self: stretch;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 7px;
  border: 1px solid var(--ui-color-border-workspace);
  border-radius: 9px;
  background: var(--ui-color-surface-content-bg);
  box-shadow: none;
}

html:not([data-ui="mobile"]) .review-screen .is-sidebar-collapsed > .review-tools.filter-review-collapsible-sidebar {
  grid-template-rows: auto;
}

html:not([data-ui="mobile"]) .review-screen .review-tool-pane {
  min-height: 0;
  overflow: auto;
  scrollbar-gutter: stable;
}

html:not([data-ui="mobile"]) .review-screen .review-preview-panel {
  min-width: 0;
  border: 1px solid var(--ui-color-border-workspace);
  border-radius: 9px;
  background: var(--ui-color-surface-content-bg);
  box-shadow: none;
}

html:not([data-ui="mobile"]) .review-screen .review-library-bar {
  flex-wrap: wrap;
  gap: 6px 8px;
  border-color: var(--ui-color-border-subtle);
}

html:not([data-ui="mobile"]) .review-screen .review-library-controls {
  justify-content: flex-end;
  flex-wrap: wrap;
  margin-left: auto;
}

/* Folding does not repaginate: all items of the existing page remain reachable. */
html:not([data-ui="mobile"]) .review-screen .review-preview-area {
  min-width: 0;
  overflow: hidden;
}

html:not([data-ui="mobile"]) .review-screen .review-page-groups {
  min-width: 0;
  overflow: auto;
  scrollbar-gutter: stable;
}

html:not([data-ui="mobile"]) .review-screen .flat-char-page .char-cloud {
  height: auto;
  min-height: 100%;
  align-content: start;
}

html:not([data-ui="mobile"]) .review-screen .review-finish {
  border: 1px solid var(--ui-color-border-workspace);
  background: var(--ui-color-surface-content-bg);
}

html:not([data-ui="mobile"]) .review-screen .review-finish-actions {
  flex-wrap: wrap;
}

html:not([data-ui="mobile"]) :is(.filter-review-context-toggle, .filter-review-sidebar-toggle):hover {
  border-color: var(--ui-color-action-secondary-hover-border);
  background: var(--ui-color-action-secondary-hover-bg);
  color: var(--ui-color-action-secondary-hover-fg);
}

html:not([data-ui="mobile"]) :is(.filter-review-context-toggle, .filter-review-sidebar-toggle):focus-visible {
  outline: 2px solid var(--ui-color-focus-content);
  outline-offset: 2px;
}

@media (max-width: 1500px) {
  html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console {
    --filter-workspace-rail: 150px;
    --filter-workspace-summary: 225px;
  }
  html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console.is-sidebar-collapsed {
    --filter-workspace-rail: 76px;
  }
}

@media (max-width: 1300px) {
  html:not([data-ui="mobile"]) .filter-review-context-summary {
    gap: 6px 11px;
  }
  html:not([data-ui="mobile"]) .filter-workbench-screen .filter-basic-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
  }
  html:not([data-ui="mobile"]) .filter-workbench-screen .filter-basic-grid > section:first-child {
    grid-row: auto;
  }
  html:not([data-ui="mobile"]) .filter-workbench-screen .filter-manual-basis {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }
  html:not([data-ui="mobile"]) .review-screen .grid.two.review-layout {
    grid-template-columns: 330px minmax(0, 1fr);
  }
  html:not([data-ui="mobile"]) .review-screen .grid.two.review-layout.is-sidebar-collapsed {
    grid-template-columns: 76px minmax(0, 1fr);
  }
}

@media (max-width: 1100px) {
  html:not([data-ui="mobile"]) .filter-review-context-summary {
    flex-wrap: wrap;
  }
  html:not([data-ui="mobile"]) .filter-review-context-client {
    max-width: 38%;
  }
  html:not([data-ui="mobile"]) .filter-review-context-summary > .filter-review-context-warning {
    margin-left: auto;
  }
  html:not([data-ui="mobile"]) .filter-workbench-screen .filter-console {
    --filter-workspace-summary: 195px;
  }
  html:not([data-ui="mobile"]) .filter-workbench-screen .filter-workbench-head {
    flex-wrap: wrap;
    gap: 6px;
  }
  html:not([data-ui="mobile"]) .filter-workbench-screen .filter-record-switcher {
    grid-template-columns: 32px minmax(180px, 260px) 32px;
  }
}