/* Shared rhythm, controls and responsive layout for the production workspace. */
:root {
  --radius: 12px;
  --shadow: none;
}
body[data-theme="dark"] {
  --bg: #0c111a;
  --bg-2: #0c111a;
  --panel: #151d28;
  --panel-2: #151d28;
  --surface: #101721;
  --line: #303b4b;
  --line-soft: #25303e;
  --text: #eaf0f7;
  --muted: #adbacb;
  --brand: #758cff;
  --brand-soft: #202b46;
  --ok: #71d5a1;
  --warn: #f0c878;
  --bad: #ff9ba6;
}
body {
  background: var(--bg);
  line-height: 1.55;
}
button,input,select,textarea {
  font: inherit;
}
button,a,summary,input,select,textarea {
  touch-action: manipulation;
}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 3px;
}
[hidden] {
  display: none !important;
}
.app {
  grid-template-columns: var(--sidebar-w) minmax(0,1fr);
}
.sidebar {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow: visible;
  z-index: auto;
  position: sticky;
  top: 0;
  height: 100dvh;
  gap: 24px;
  background: #101620;
  border-color: var(--line-soft);
}
.logo-card {
  display: block;
  min-width: 0;
  background: none;
  border: 0;
  padding: 0 10px 14px;
  border-radius: 0;
}
.logo-title {
  font-size: 25px;
  letter-spacing: -.03em;
}
.logo-sub {
  color: var(--muted);
}
.version {
  color: var(--muted);
  font-weight: 500;
}
.nav-btn {
  height: 44px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 14px;
  padding: 0 12px;
}
.nav-btn.active {
  background: var(--brand-soft);
  border-color: transparent;
  color: #d8e1ff;
}
.sidebar-footer {
  display: grid;
  gap: 8px;
  padding: 12px 10px 0;
  border-top: 1px solid var(--line-soft);
}
.account {
  margin: 0;
  overflow-wrap: anywhere;
  font-size: 13px;
}
.account-link {
  font-size: 13px;
  color: var(--muted);
  padding: 8px 0;
  text-decoration: none;
  min-height: 40px;
}
.topbar {
  height: 64px;
  background: #0c111af5;
  border-color: var(--line-soft);
  backdrop-filter: none;
}
.topbar strong {
  font-size: 18px;
  font-weight: 650;
}
.toolbar {
  min-width: 0;
  gap: 12px;
}
.pill {
  font-size: 13px;
  font-weight: 500;
  height: 36px;
  max-width: 340px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.content {
  margin: 0 auto;
}
.section-head {
  margin-top: 0;
  gap: 16px;
}
.section-head.section,.section {
  margin-top: 20px;
}
.section-head h2,h2 {
  font-size: 16px;
  font-weight: 650;
}
.card {
  background: var(--panel);
  box-shadow: none;
}
.card-pad,.order-card {
  padding: 20px;
}
.btn,.theme-btn,.subtab,.sample-file-btn {
  min-height: 40px;
  height: auto;
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  box-shadow: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.btn.primary {
  background: var(--brand);
  color: #0e1525;
  border-color: var(--brand);
  box-shadow: none;
}
.btn:not(.primary):hover,.question-link:hover {
  background: var(--brand-soft);
  color: var(--text);
}
.btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}
.btn.danger {
  color: var(--bad);
}
.compact-note,.key-note,.connection-url,.pack-version,.runner-note,.kpi .sub,.derived-count,.q-row-total,.q-cell .compact-note {
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
}
.field label,label,.grade-label {
  font-size: 14px;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 550;
}
.field label {
  margin-bottom: 8px;
}
.status {
  font-size: 13px;
  line-height: 1.4;
  font-weight: 550;
  border-radius: 6px;
  padding: 4px 8px;
}
.status:not(.ok):not(.bad):not(.run) {
  color: var(--muted);
  background: var(--surface);
}
.status.run {
  color: var(--warn);
}
.feature-tag {
  font-size: 13px;
}
.type-no {
  display: none;
}
select,input:not([type="checkbox"]):not([type="file"]),textarea {
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text);
  min-height: 40px;
  padding: 8px 12px;
}
input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--brand);
  flex: none;
}
textarea {
  line-height: 1.6;
  width: 100%;
  min-height: 140px;
}
input[type="file"] {
  font-size: 14px;
  max-width: 100%;
}
input[type="file"]::file-selector-button {
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  padding: 9px 12px;
  margin-right: 12px;
}
input[type="search"] {
  width: 100%;
}
th {
  font-size: 13px;
  font-weight: 550;
  text-transform: none;
  letter-spacing: 0;
  background: var(--surface);
  padding: 12px 16px;
}
td {
  padding: 14px 16px;
  vertical-align: middle;
}
table td small {
  font-size: 13px;
  color: var(--muted);
}
.table-wrap {
  border-radius: 12px;
}
.question-link {
  gap: 6px;
  font-size: 14px;
  font-weight: 550;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 4px 6px;
  border-radius: 6px;
  text-align: left;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.order-filters {
  display: grid;
  gap: 12px;
}
.orders-toolbar {
  margin: 16px 0;
}
.orders-toolbar .page-actions {
  flex: none;
}
.orders-heading {
  margin-bottom: 0;
}
.orders-heading h2 {
  font-size: 16px;
}
.order-reference {
  display: block;
  font-size: 13px;
  color: var(--muted);
  font-weight: 400;
}
.pager {
  margin-top: 16px;
  justify-content: flex-end;
  gap: 16px;
  font-size: 13px;
}
.order-selection {
  gap: 16px;
}
.bulk-quantity {
  gap: 12px;
  margin-bottom: 8px;
}
.bulk-quantity label {
  font-size: 14px;
  font-weight: 550;
}
.bulk-quantity input {
  font-size: 20px;
  font-weight: 650;
  width: 108px;
  text-align: center;
}
.bulk-quantity .compact-note {
  margin-left: auto;
}
#allocationMode {
  min-height: 20px;
  margin: 0 0 16px;
}
.quantity-matrix {
  grid-template-columns: minmax(175px,1.1fr) repeat(3,minmax(100px,1fr));
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}
.q-head {
  font-size: 13px;
  padding: 12px 16px;
  letter-spacing: 0;
  text-transform: none;
  background: var(--surface);
  font-weight: 550;
  text-align: center;
}
.q-head:first-child {
  text-align: left;
}
.q-row {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: transparent;
}
.q-type-name {
  font-size: 14px;
  font-weight: 550;
}
.q-row-total {
  gap: 6px;
}
.q-row-total input {
  width: 60px;
  font-size: 14px;
  height: 40px;
  min-height: 40px;
}
.q-cell {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px;
  border-left: 1px solid var(--line-soft);
  min-width: 0;
  background: transparent;
}
.q-cell.has-quantity {
  background: #202b462b;
}
.q-cell>input {
  width: 72px;
  height: 44px;
  font-size: 18px;
  font-weight: 600;
  text-align: center;
}
.q-cell-detail {
  margin: 0;
  min-width: 0;
}
.q-pack-actions {
  display: flex;
  justify-content: center;
  gap: 0;
}
.q-pack-actions .question-link {
  min-height: 40px;
  text-align: center;
}
.q-allocation {
  display: none;
}
.q-pack-editor {
  display: none;
}
.order-footer {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid var(--line-soft);
  margin-bottom: 20px;
}
.quantity-total {
  font-size: 20px;
  font-weight: 650;
}
#orderValidation {
  flex: 1;
  max-width: none;
}
#orderValidation[data-invalid="true"] {
  color: var(--warn);
}
.ai-model-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 20px;
}
.ai-model-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 16px;
  background: var(--surface);
  min-width: 0;
}
.model-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 32px;
  margin-bottom: 12px;
  gap: 10px;
}
.model-card-head>label {
  margin: 0;
}
.model-card-head .review-switch {
  margin: 0;
  font-size: 13px;
}
.review-switch {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ai-model-card input[type="search"] {
  margin: 0 0 8px;
}
.ai-model-card select {
  width: 100%;
}
.model-capability {
  min-height: 30px;
  margin: 10px 0 0;
  padding: 0;
  align-items: center;
  gap: 8px;
}
.model-capability small {
  display: none;
}
.model-capability .status {
  font-size: 13px;
}
.model-advanced {
  border-top: 1px solid var(--line-soft);
  margin-top: 12px;
  padding-top: 8px;
}
.model-advanced>summary {
  font-size: 13px;
  color: var(--muted);
  padding: 6px 0;
  min-height: 36px;
}
.ai-tuning {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-top: 12px;
}
.ai-tuning label {
  font-size: 13px;
  margin-bottom: 6px;
  display: block;
}
.order-action {
  margin-top: 20px;
  padding-top: 0;
  text-align: right;
}
.order-action .btn {
  min-width: 140px;
}
.ai-connections-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ai-connections-head h2 {
  margin: 0 0 4px;
}
.ai-connections-head p {
  margin: 0;
}
.prompt-stack {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
}
.prompt-card {
  padding: 20px;
}
.prompt-card h3 {
  font-size: 15px;
  margin: 0 0 12px;
}
.prompt-card .prompt-input {
  min-height: 320px;
}
.config-prompts>summary {
  color: var(--text);
}
#promptSaveStatus {
  color: var(--muted);
  font-size: 13px;
  margin-left: 12px;
}
.toolbar-line {
  position: static;
  top: auto;
  padding: 16px;
  gap: 12px;
  flex-wrap: wrap;
}
.grade-wrap {
  gap: 10px;
}
.grade-input {
  min-width: 100px;
  width: 120px;
}
.topic-select {
  min-width: 170px;
  flex: 1;
  max-width: none;
}
.toolbar-line #inputCount {
  width: 100%;
  padding-top: 6px;
}
.matrix {
  min-width: 0;
  grid-template-columns: minmax(155px,1fr) repeat(3,minmax(100px,1fr));
}
.matrix-head {
  font-size: 13px;
  text-transform: none;
  letter-spacing: 0;
  min-height: 44px;
  padding: 12px;
}
.matrix-row-head {
  font-size: 14px;
  padding: 14px;
}
.matrix-cell {
  padding: 14px 10px;
  min-width: 0;
}
.pack-cell {
  justify-content: center;
  gap: 8px;
}
.pack-count {
  font-size: 20px;
}
.matrix-cell .compact-note {
  display: none;
}
.matrix-cell .derived-count {
  font-size: 13px;
  color: var(--muted);
  margin-top: 8px;
}
.reference-grid {
  gap: 16px;
}
.reference-card h3 {
  font-size: 15px;
}
.reference-line .btn {
  min-width: 72px;
}
.detail-head {
  gap: 12px;
}
.detail-head #orderTitle {
  font-size: 16px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
}
.detail-actions>.btn {
  white-space: nowrap;
}
.detail-actions .danger {
  margin: 0 !important;
}
.runner-note {
  margin: 10px 0 16px;
  overflow-wrap: anywhere;
}
.kpis {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
}
.kpi {
  border: 1px solid var(--line);
  padding: 16px;
  min-width: 0;
}
.kpi .label {
  font-size: 13px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--muted);
}
.kpi .value {
  font-weight: 650;
  margin: 8px 0;
}
.kpi .value .status {
  font-size: 14px;
}
.kpi .sub {
  font-size: 13px;
}
.order-progress {
  margin: 16px 0;
  display: flex;
  align-items: center;
  gap: 16px;
}
.order-progress progress {
  width: 100%;
  height: 8px;
  border: 0;
  appearance: none;
  border-radius: 8px;
  overflow: hidden;
}
.order-progress progress::-webkit-progress-bar {
  background: var(--line-soft);
}
.order-progress progress::-webkit-progress-value {
  background: var(--ok);
}
.order-progress span {
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap;
}
.slot-filter {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 16px 0;
}
.slot-filter select {
  width: 220px;
}
.progress-table td {
  white-space: normal;
}
.slot-controls {
  min-width: 130px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.slot-controls>.btn {
  margin: 0;
}
.slot-review-toggle {
  font-size: 13px;
  gap: 8px;
  min-height: 40px;
  white-space: normal;
}
.slot-error {
  font-size: 13px;
  max-width: 280px;
  overflow-wrap: anywhere;
}
.slot-error details summary {
  color: var(--muted);
  min-height: 36px;
  cursor: pointer;
}
.slot-error pre,.technical-error {
  white-space: pre-wrap;
  font-size: 13px;
  overflow-wrap: anywhere;
}
.slot-versions {
  min-width: 120px;
}
.slot-versions>summary {
  min-height: 36px;
  display: flex;
  align-items: center;
  font-size: 13px;
}
.slot-versions>div {
  margin: 8px 0;
}
.fail-box {
  margin: 16px 0;
  padding: 16px;
  background: var(--bad-bg);
  border-color: #ff9ba640;
}
.fail-box .btn {
  margin: 12px 8px 0 0;
}
.fail-box p {
  margin: 0;
  font-size: 14px;
}
.result-filters {
  gap: 8px;
  display: flex;
  flex-wrap: wrap;
}
.result-filters select {
  width: 180px;
}
.result-filters input {
  width: 180px;
}
.metrics-table td,.metrics-table th {
  white-space: normal;
}
.empty {
  font-size: 14px;
  padding: 32px 20px;
  color: var(--muted);
}
.export-menu>div {
  min-width: 225px;
  z-index: 30;
}
.export-menu>summary {
  min-height: 40px;
  font-size: 14px;
}
.action-menu>div>.btn {
  justify-content: flex-start;
  width: 100%;
}
.action-menu .btn.danger {
  color: var(--bad);
}
details>summary {
  cursor: pointer;
}
dialog {
  width: min(1040px,calc(100vw - 40px));
  max-width: none;
  max-height: calc(100dvh - 40px);
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--panel);
  padding: 0;
  color: var(--text);
}
dialog::backdrop {
  background: #030812b8;
  backdrop-filter: blur(3px);
}
.modal-head {
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
  min-height: 64px;
}
.modal-head strong {
  font-size: 17px;
  font-weight: 600;
}
.close {
  width: 40px;
  height: 40px;
  min-height: 40px;
  font-size: 24px;
  border-radius: 8px;
}
.modal-body {
  padding: 20px;
  overflow: auto;
  max-height: none;
}
.modal-body h3 {
  font-size: 15px;
  font-weight: 600;
  margin: 20px 0 12px;
}
.modal-body label {
  font-size: 14px;
}
.modal-body .two {
  gap: 20px;
}
.modal-body .dialog-actions {
  margin-top: 20px;
  min-height: 56px;
  padding: 12px 0;
}
.modal-body .input-file {
  margin: 8px 0;
}
.modal-body details>summary {
  min-height: 40px;
  padding: 8px 0;
  font-size: 14px;
}
.docx-preview {
  margin: 12px 0;
  padding: 24px;
  border-radius: 8px;
  overflow: visible;
  max-height: none;
}
.docx-preview img {
  max-height: none;
  max-width: 100%;
  height: auto;
}
.docx-preview table {
  overflow-wrap: anywhere;
}
.docx-preview td {
  padding: 10px;
  vertical-align: top;
}
.docx-preview th {
  color: #171717;
}
.docx-preview p {
  margin: 6px 0;
}
#referenceDocxPreview {
  max-height: none;
  overflow: visible;
}
.collection-table {
  max-height: none;
  overflow-x: auto;
}
.collection-error {
  display: block;
  font-size: 13px;
  color: var(--bad);
  white-space: normal;
  max-width: 260px;
}
.pack-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid var(--line-soft);
}
.pack-row p {
  font-size: 13px;
  margin: 4px 0;
  color: var(--muted);
}
.pack-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.pack-actions .export-menu {
  margin: 0;
}
.pack-history-version {
  padding: 0;
  margin: 16px 0;
  border: 0;
}
.history-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
}
.history-toolbar select {
  max-width: 240px;
}
.pack-history-result>summary {
  white-space: normal;
  line-height: 1.5;
  display: block;
}
.pack-preview {
  font-size: 14px;
  line-height: 1.6;
}
.guide-details {
  margin: 16px 0;
}
.input-warning {
  font-size: 14px;
  line-height: 1.5;
}
.key-card {
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  padding: 0 0 20px;
  margin-bottom: 20px;
}
.key-card h3 {
  margin-top: 0;
}
.key-line {
  gap: 12px;
}
.base-url-field {
  margin: 12px 0;
}
.connection-management {
  margin: 12px 0;
}
.connection-management .reference-line {
  margin-bottom: 8px;
}
.connection-management .export-menu {
  flex: none;
}
.capability-result {
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}
.capability-result strong {
  font-size: 14px;
  font-weight: 550;
  overflow-wrap: anywhere;
}
.capability-result .status {
  flex: none;
}
.capability-check-bar .compact-note {
  margin: 0;
}
.key-note {
  font-size: 13px;
}
.modal-notice,#notice {
  font-size: 14px;
  line-height: 1.5;
  border-radius: 8px;
  padding: 12px 16px;
}
.modal-notice details,#notice details {
  font-size: 13px;
  margin-top: 8px;
}
.notice-close {
  border: 0;
  background: none;
  color: var(--muted);
  width: 32px;
  min-height: 32px;
  cursor: pointer;
  font-size: 20px;
}
#notice[data-error="true"] {
  position: relative;
  color: var(--bad);
}
.immutable-grid label {
  font-size: 13px;
}
.input-docx-text[hidden] {
  display: none;
}
.model-search-empty {
  font-size: 13px;
  color: var(--muted);
}
.question-breadcrumb {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.question-fallback[hidden] {
  display: none;
}
@media (max-width:1250px) {
  :root {
    --sidebar-w: 184px;
  }
  .topbar {
    padding: 0 20px;
  }
  .content {
    padding: 20px;
  }
  .detailPage .page-actions {
    flex-wrap: wrap;
  }
  .detail-head #orderTitle {
    max-width: 230px;
  }
  .detail-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  .quantity-matrix {
    grid-template-columns: 160px repeat(3,minmax(90px,1fr));
  }
  .q-row {
    flex-wrap: wrap;
  }
  .q-cell {
    gap: 4px;
    padding: 10px 6px;
  }
  .q-cell>input {
    width: 60px;
  }
  .q-pack-actions .question-link {
    font-size: 13px;
    padding: 4px;
  }
  .orders-toolbar {
    flex-wrap: wrap;
  }
  .order-filters {
    min-width: 300px;
  }
  .result-filters select {
    width: 155px;
  }
}
@media (max-width:980px) {
  .order-selection {
    grid-template-columns: 120px minmax(0,1fr);
  }
  .order-selection>.btn {
    grid-column: 1/-1;
    justify-self: start;
  }
  .ai-tuning,.prompt-stack {
    grid-template-columns: 1fr;
  }
  .kpis {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .section-head:has(.detail-head) {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .detail-actions {
    justify-content: flex-start;
  }
  .quantity-matrix {
    grid-template-columns: 150px repeat(3,minmax(90px,1fr));
  }
  .q-cell {
    flex-direction: column;
  }
  .q-cell-detail {
    margin: 0;
  }
  .reference-grid {
    grid-template-columns: 1fr;
  }
  .matrix {
    grid-template-columns: 140px repeat(3,minmax(70px,1fr));
  }
  .matrix-cell {
    padding: 10px 4px;
  }
  .pack-cell {
    flex-wrap: wrap;
  }
  .sample-file-btn {
    font-size: 13px;
    padding: 8px;
  }
  .model-card-head {
    flex-wrap: wrap;
  }
  .order-filters {
    grid-template-columns: minmax(150px,1fr) 180px;
  }
  .result-filters {
    width: 100%;
  }
  .order-footer {
    flex-wrap: wrap;
  }
  #orderValidation {
    text-align: left;
  }
}
@media (max-width:760px) {
  :root {
    --sidebar-w: 0px;
  }
  .sidebar {
    padding: 12px 16px;
    gap: 12px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .logo-card {
    min-width: 0 !important;
    padding: 0;
    align-items: center;
    gap: 10px;
  }
  .logo-title {
    font-size: 21px;
    margin: 0;
  }
  .logo-sub {
    font-size: 13px;
  }
  .nav-stack {
    grid-column: 1/-1;
    grid-row: 2;
    display: grid;
  }
  .nav-btn {
    padding: 8px 4px;
    font-size: 13px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .sidebar-footer {
    padding: 0;
    border: 0;
    font-size: 13px;
    gap: 0;
    max-width: 160px;
  }
  .sidebar-footer .account {
    font-size: 13px;
    text-align: right;
  }
  .account-link {
    padding: 4px 0;
    min-height: 32px;
    text-align: right;
  }
  .topbar {
    gap: 12px;
  }
  .topbar strong {
    font-size: 16px;
  }
  .pill {
    max-width: 160px;
    padding: 0 8px;
    font-size: 13px;
    height: 32px;
  }
  .toolbar {
    gap: 8px;
  }
  .card-pad,.order-card {
    padding: 16px;
  }
  .orders-heading h2 {
    display: none;
  }
  .orders-heading {
    justify-content: flex-end;
  }
  .order-filters {
    width: 100%;
    min-width: 0;
  }
  .orders-toolbar>.page-actions {
    width: 100%;
  }
  .ai-model-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .bulk-quantity label {
    width: auto;
  }
  .bulk-quantity .compact-note {
    width: 100%;
    margin: 0;
  }
  .quantity-matrix {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    min-width: 0;
  }
  .quantity-matrix .q-head:first-child {
    grid-column: 1/-1;
    text-align: left;
  }
  .quantity-matrix .q-head:not(:first-child) {
    font-size: 13px;
    padding: 10px 2px;
  }
  .quantity-matrix .q-row {
    grid-column: 1/-1;
    flex-direction: row;
    background: var(--surface);
    padding: 12px;
  }
  .quantity-matrix .q-cell {
    padding: 12px 4px;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .q-cell input {
    width: 64px;
  }
  .q-pack-actions button {
    font-size: 13px !important;
  }
  .q-cell .compact-note {
    font-size: 13px;
  }
  .quantity-total {
    font-size: 20px;
  }
  .order-footer {
    gap: 8px;
  }
  .order-footer .compact-note {
    font-size: 13px;
  }
  #orderValidation {
    width: 100%;
    flex-basis: 100%;
    order: 3;
  }
  .matrix {
    grid-template-columns: repeat(3,minmax(0,1fr));
    min-width: 0;
  }
  .matrix .matrix-head:first-child {
    grid-column: 1/-1;
  }
  .matrix .matrix-head:not(:first-child) {
    font-size: 13px;
    padding: 10px 2px;
  }
  .matrix-row-head {
    grid-column: 1/-1;
    background: var(--surface);
  }
  .matrix-cell {
    padding: 12px 5px;
  }
  .matrix-cell .pack-count {
    font-size: 20px;
  }
  .matrix-cell .sample-file-btn {
    font-size: 13px;
  }
  .toolbar-line {
    padding: 12px;
    gap: 10px;
  }
  .toolbar-line .grade-wrap {
    width: auto;
  }
  .topic-select {
    width: 100%;
    min-width: 0;
  }
  .toolbar-line #inputCount {
    padding: 0;
  }
  .subtabs {
    gap: 8px;
  }
  .subtab {
    font-size: 13px;
    white-space: normal;
    flex: 1;
  }
  .pack-row {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .pack-actions {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .detail-actions {
    gap: 8px;
  }
  .detail-actions .btn {
    font-size: 13px;
    padding: 8px 10px;
  }
  .detail-head #orderTitle {
    max-width: 200px;
    white-space: normal;
  }
  .kpis {
    gap: 8px;
  }
  .kpi {
    padding: 12px;
  }
  .kpi .value {
    font-size: 19px;
  }
  .result-filters {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .result-filters select,.result-filters input {
    width: 100%;
  }
  .result-filters input {
    grid-column: 1/-1;
  }
  .section-head:has(.result-filters) {
    flex-wrap: wrap;
  }
  .order-progress {
    gap: 8px;
    align-items: flex-start;
    flex-direction: column;
  }
  .order-progress span {
    font-size: 13px;
  }
  .slot-filter select {
    max-width: 200px;
  }
  .table-wrap {
    overflow-x: auto;
  }
  .progress-table {
    margin: 0 -8px;
  }
  .progress-table table {
    min-width: 650px;
  }
  dialog {
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
  }
  .modal-head {
    padding: 12px 16px;
  }
  .modal-head strong {
    font-size: 16px;
  }
  .modal-body {
    padding: 16px;
  }
  .modal-body .two {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .modal-body .dialog-actions {
    flex-wrap: wrap;
  }
  .docx-preview {
    padding: 12px;
    font-size: 11pt;
  }
  .docx-preview td {
    padding: 6px;
  }
  .export-menu>div {
    min-width: 220px;
    max-width: calc(100vw - 32px);
  }
  .ai-connections-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .history-toolbar {
    flex-wrap: wrap;
  }
  .collection-table table {
    min-width: 720px;
  }
  .slot-review-list {
    max-height: none;
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion:reduce) {
  * {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}
@media (max-width:760px) {
  .topbar strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .toolbar {
    flex-shrink: 0;
  }
  .toolbar:has(#save:not([hidden])) .pill {
    display: none;
  }
  .logo-sub {
    min-width: 0;
  }
  .sidebar-footer {
    overflow: hidden;
  }
  .account {
    max-width: 140px;
  }
  .q-cell .q-pack-actions {
    flex-wrap: wrap;
  }
  .bulk-quantity .compact-note {
    white-space: normal;
  }
  .pack-history-version .pack-preview {
    max-height: none;
    overflow: visible;
  }
  .slot-review-list label {
    font-size: 14px;
    min-height: 40px;
  }
}
.nav-stack {
  display: grid;
  gap: 8px;
}
.review-skipped,.attempt-list,.pack-order {
  font-size: 13px;
}
@media (max-width:760px) {
  .nav-stack {
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 4px;
  }
  .logo-card {
    display: flex;
  }
  .sidebar-footer {
    margin: 0;
  }
}
.modal-body:has(.document-preview-host)>.dialog-actions {
  position: static;
}
.media-conflict-list {
  display: grid;
  gap: 8px;
  margin: 0 0 16px;
  max-height: 240px;
  overflow: auto;
}
.media-conflict-list>div {
  display: grid;
  grid-template-columns: minmax(110px,1fr) minmax(120px,1.5fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  font-size: 14px;
}
.media-conflict-list span {
  color: var(--muted);
  font-size: 13px;
}
.media-model-field {
  margin: 12px 0;
}
.media-model-field label {
  display: block;
}
.media-model-field select {
  width: 100%;
}
.media-resolution-btn {
  display: block;
  margin-top: 8px;
}
@media (max-width:760px) {
  .media-conflict-list>div {
    grid-template-columns: 1fr;
  }
  .media-conflict-list span {
    font-size: 14px;
  }
}
/* Input workspace: shared baselines, one clear action per matrix cell. */
#inputsPage .subtabs {
  gap: 24px;
  margin: 0 0 20px;
  border-bottom: 1px solid var(--line-soft);
  overflow: auto;
}
#inputsPage .subtab {
  position: relative;
  flex: none;
  min-height: 44px;
  padding: 10px 0 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 14px;
  font-weight: 550;
}
#inputsPage .subtab.active {
  color: var(--text);
  background: transparent;
}
#inputsPage .subtab.active:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--brand);
}
#questionsPanel {
  overflow: visible;
  border-radius: 12px;
}
.input-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 20px 14px;
}
.input-selectors {
  display: grid;
  grid-template-columns: 120px minmax(180px,420px);
  gap: 16px;
  flex: 1;
  min-width: 0;
}
.input-selectors .field {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.input-selectors label {
  color: var(--muted);
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 20px;
}
.input-selectors select {
  width: 100%;
  max-width: none;
  min-width: 0;
  flex: none;
  min-height: 40px;
  height: 40px;
  font-size: 14px;
}
.input-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: none;
}
.input-actions .btn {
  height: 40px;
  min-height: 40px;
  padding: 8px 12px;
}
.input-actions .input-more {
  width: 40px;
  padding: 0;
  font-size: 24px;
  line-height: 1;
  list-style: none;
}
.input-more::-webkit-details-marker {
  display: none;
}
.input-summary {
  padding: 0 20px 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 20px;
}
.input-summary:empty {
  display: none;
}
#questionsPanel .matrix-wrap {
  padding: 0;
  overflow: hidden;
  border-radius: 0 0 12px 12px;
}
#matrix {
  border: 0;
  border-top: 1px solid var(--line-soft);
  border-radius: 0;
  min-width: 0;
  grid-template-columns: minmax(190px,1.05fr) repeat(3,minmax(110px,1fr));
}
#matrix .matrix-head {
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 550;
  background: var(--surface);
  border-color: var(--line-soft);
}
#matrix .matrix-head:first-child {
  justify-content: flex-start;
}
#matrix .matrix-row-head {
  display: flex;
  align-items: center;
  padding: 16px 20px;
  font-size: 14px;
  font-weight: 550;
  background: transparent;
  border-color: var(--line-soft);
}
#matrix .matrix-cell {
  display: flex;
  min-height: 84px;
  padding: 0;
  text-align: center;
  background: transparent;
  border-color: var(--line-soft);
}
.sample-cell-button {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-width: 0;
  min-height: 84px;
  padding: 14px 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text);
  font-family: inherit;
  cursor: pointer;
  transition: background .15s;
}
.sample-cell-main {
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
}
.sample-cell-main strong {
  font-size: 18px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  margin-right: 3px;
}
.sample-cell-sub {
  font-size: 13px;
  line-height: 20px;
  color: var(--muted);
  font-weight: 400;
}
.sample-cell-button:hover,.sample-cell-button:focus-visible {
  background: var(--brand-soft);
}
.sample-cell-button:hover .sample-cell-main,.sample-cell-button.is-empty .sample-cell-sub {
  color: var(--brand);
}
.sample-cell-button:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: -3px;
}
.sample-cell-button.is-empty .sample-cell-main {
  color: var(--muted);
}
@media (max-width:1200px) {
  .input-toolbar {
    flex-wrap: wrap;
    gap: 16px;
  }
  .input-selectors {
    grid-template-columns: 120px minmax(180px,1fr);
    flex-basis: 100%;
  }
  .input-actions {
    margin-left: auto;
  }
  .input-summary {
    padding-bottom: 16px;
  }
}
@media (max-width:760px) {
  #inputsPage .subtabs {
    gap: 20px;
    margin-bottom: 16px;
  }
  #inputsPage .subtab {
    font-size: 14px;
  }
  .input-toolbar {
    padding: 16px 14px 12px;
    gap: 12px;
  }
  .input-selectors {
    grid-template-columns: 100px minmax(0,1fr);
    gap: 12px;
  }
  .input-actions {
    width: 100%;
    margin: 0;
    justify-content: flex-end;
    gap: 6px;
  }
  .input-actions .btn {
    font-size: 14px;
    padding: 8px 10px;
  }
  .input-actions .input-more {
    padding: 0;
  }
  .input-summary {
    padding: 0 14px 14px;
  }
  #matrix {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
  #matrix .matrix-head:first-child {
    grid-column: 1/-1;
  }
  #matrix .matrix-head:not(:first-child) {
    padding: 10px 4px;
    font-size: 14px;
  }
  #matrix .matrix-row-head {
    grid-column: 1/-1;
    padding: 12px 14px;
    background: var(--surface);
  }
  #matrix .matrix-cell {
    min-height: 80px;
    border-right: 1px solid var(--line-soft);
  }
  #matrix .matrix-cell:nth-of-type(4n) {
    border-right: 0;
  }
  .sample-cell-button {
    min-height: 80px;
    padding: 12px 4px;
  }
  .sample-cell-main {
    font-size: 14px;
  }
  .sample-cell-sub {
    font-size: 12px;
  }
  #matrix>:nth-last-child(-n+4).matrix-row-head {
    border-bottom: 1px solid var(--line-soft);
  }
}
/* One image capability tag per production role. */
.capability-result {
  display: block;
}
.ability-model-heading {
  margin-bottom: 8px;
  min-width: 0;
}
.ability-model-heading>strong {
  overflow-wrap: anywhere;
  font-size: 14px;
}
.ability-model-heading .btn {
  flex-shrink: 0;
}
.capability-roles {
  grid-template-columns: repeat(2,minmax(0,1fr));
  min-width: 0;
}
.capability-role {
  flex-wrap: wrap;
  color: var(--muted);
}
.capability-tag {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 2px 8px;
  font-size: 14px;
  line-height: 1.5;
  background: var(--panel);
  color: var(--muted);
}
.capability-tag.image {
  color: var(--ok);
  border-color: currentColor;
}
.capability-tag.pending {
  font-style: italic;
}
.model-capability {
  display: block;
  margin-top: 8px;
  min-width: 0;
}
@media (max-width:520px) {
  .capability-role {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }
  .ability-model-heading {
    align-items: flex-start;
  }
}
/* Image preflight: compact choices with model fields inside the selected option. */
.sr-only {
  clip-path: inset(50%);
}
#modal:has(.media-order-dialog) {
  width: min(860px,calc(100vw - 32px));
}
.modal-body input[type="radio"] {
  width: 18px;
  height: 18px;
  min-height: 18px;
  padding: 0;
  margin: 2px 0 0;
  flex: 0 0 18px;
  accent-color: var(--brand);
}
.media-conflict-heading,.media-order-dialog .media-conflict-list>div {
  display: grid;
  grid-template-columns: minmax(120px,1fr) minmax(140px,1.2fr) minmax(140px,1fr);
  gap: 16px;
  align-items: start;
  padding: 10px 12px;
  overflow-wrap: anywhere;
}
.media-conflict-heading {
  font-size: 14px;
  font-weight: 550;
  color: var(--muted);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
}
.media-order-dialog .media-conflict-list {
  gap: 0;
  max-height: 180px;
  margin: 0 0 20px;
  border: 1px solid var(--line);
  border-top: 0;
  border-radius: 0 0 8px 8px;
}
.media-order-dialog .media-conflict-list>div {
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  border-radius: 0;
}
.media-order-dialog .media-conflict-list>div:last-child {
  border-bottom: 0;
}
.media-order-dialog .media-conflict-list span {
  font-size: 14px;
}
.media-options {
  display: grid;
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.media-option {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  min-width: 0;
}
.media-option:has(input:checked) {
  border-color: var(--brand);
  background: var(--brand-soft);
}
.media-option:has(input:focus-visible) {
  outline: 2px solid var(--brand);
  outline-offset: 3px;
}
.modal-body .media-option-label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  padding: 14px 16px;
  color: var(--text);
  cursor: pointer;
  line-height: 1.5;
}
.media-option-label>span {
  display: block;
  min-width: 0;
}
.media-option-label strong {
  font-size: 14px;
  font-weight: 600;
}
.media-option-note {
  display: block;
  margin-top: 4px;
  font-size: 14px;
  font-weight: 400;
  color: var(--muted);
}
.media-option:has(input:disabled) .media-option-label {
  cursor: not-allowed;
}
.media-fallback-fields {
  padding: 0 16px 16px 46px;
  min-width: 0;
}
.media-model-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
}
.media-model-grid:has(>.media-model-field:only-child) {
  grid-template-columns: 1fr;
}
.media-order-dialog .media-model-field {
  margin: 0;
  min-width: 0;
}
.modal-body .media-order-dialog .media-model-field label {
  margin: 0 0 6px;
  color: var(--text);
}
.media-order-dialog .media-model-field .compact-note {
  margin: 6px 0 0;
  font-size: 14px;
}
.media-config-link {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  font-size: 14px;
  margin-top: 4px;
}
.modal-body .media-dialog-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 20px;
  padding: 16px 0 0;
}
@media (max-width:600px) {
  .media-conflict-heading {
    display: none;
  }
  .media-order-dialog .media-conflict-list {
    border-top: 1px solid var(--line);
    border-radius: 8px;
  }
  .media-order-dialog .media-conflict-list>div {
    grid-template-columns: 1fr;
    gap: 3px;
  }
  .media-model-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .media-fallback-fields {
    padding-left: 16px;
  }
  .modal-body .media-dialog-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
/* Quantity controls and allocation status share the space above the matrix. */
.quantity-toolbar {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 8px 20px;
  margin-bottom: 16px;
}
.quantity-toolbar .bulk-quantity {
  margin: 0;
  min-width: 0;
}
.quantity-toolbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
}
.quantity-toolbar-actions .btn {
  flex-shrink: 0;
}
.quantity-toolbar-summary {
  grid-column: 1/-1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.quantity-toolbar #allocationMode {
  margin: 0;
  flex: 1;
  min-width: 0;
}
.quantity-toolbar #orderValidation {
  flex: 0 1 auto;
  width: auto;
  flex-basis: auto;
  order: 0;
  text-align: right;
  overflow-wrap: anywhere;
}
#orderMatrix {
  margin-bottom: 20px;
}
@media (max-width:640px) {
  .quantity-toolbar {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .quantity-toolbar-actions {
    justify-content: space-between;
  }
  .quantity-toolbar-summary {
    flex-wrap: wrap;
    gap: 4px;
  }
  .quantity-toolbar #allocationMode,.quantity-toolbar #orderValidation {
    flex-basis: 100%;
    text-align: left;
  }
}
.q-level-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
.q-level-head label {
  margin: 0;
  font-size: 14px;
  white-space: nowrap;
}
.q-level-head input {
  width: 72px;
  font-size: 18px;
  font-weight: 600;
  text-align: center;
}
.quantity-toolbar-summary:has(#orderValidation[hidden]) {
  display: none;
}
@media (max-width:760px) {
  .q-level-head {
    gap: 8px;
    padding: 10px 6px;
  }
}
/* Direct actions and compact, accessible controls. */
.ui-icon {
  width: 20px;
  height: 20px;
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}
.btn.icon-button,.question-link.icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  min-width: 40px;
  height: 40px;
  padding: 8px;
  border-radius: 8px;
}
.is-spinning {
  animation: ui-spin 1s linear infinite;
}
@keyframes ui-spin {
  to {
    transform: rotate(360deg);
  }
}
.status-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
}
.status-icon .ui-icon {
  width: 18px;
  height: 18px;
}
.order-selection {
  grid-template-columns: 140px minmax(0,1fr);
}
.orders-toolbar {
  display: flex;
  gap: 12px;
}
.order-filters {
  flex: 1 1 340px;
  max-width: 540px;
  grid-template-columns: minmax(180px,1fr) 170px;
  min-width: 0;
}
.orders-toolbar>.page-actions {
  flex: 1 1 auto;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}
.orders-toolbar .btn {
  white-space: nowrap;
}
#detailPage>.section-head {
  flex-wrap: wrap;
  gap: 12px;
}
.detail-head {
  min-width: 0;
}
.pack-actions,.input-actions {
  flex-wrap: wrap;
  gap: 8px;
}
.allocation-sample-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
[data-preview-allocation] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 6px;
  border-radius: 6px;
}
[data-preview-allocation][aria-expanded=true] {
  background: var(--surface);
  color: var(--accent);
}
.allocation-inline-preview {
  margin-top: 12px;
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
}
.allocation-inline-preview[hidden] {
  display: none;
}
.allocation-inline-preview .docx-preview {
  padding: 0;
  min-width: 0;
}
/* Shared sample management and quantity allocation dialog. */
.cell-editor-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 18px;
}
.cell-editor-heading p {
  margin: 0;
}
.cell-editor-heading label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
}
.cell-editor .cell-quantity-input {
  width: 78px;
  min-width: 0;
  flex: 0 0 78px;
  padding: 8px;
  font-variant-numeric: tabular-nums;
}
.cell-editor input[aria-invalid=true] {
  border-color: var(--bad);
}
.cell-pack-item {
  border-bottom: 1px solid var(--line);
}
.cell-pack-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) 114px 190px 82px 44px;
  align-items: center;
  gap: 14px;
  padding: 16px 0;
}
.cell-pack-meta {
  min-width: 0;
  overflow-wrap: anywhere;
}
.cell-pack-title {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  line-height: 1.5;
}
.cell-pack-title .feature-tag {align-self:center;}
.cell-pack-meta p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 13px;
}
.cell-editor .cell-pack-quantity {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0;
  font-size: 14px;
}
.cell-pack-quantity>span {white-space:nowrap;}
.cell-editor .cell-pack-row>.btn,.cell-editor .cell-pack-row>.cell-pack-menu>summary {
  box-sizing:border-box;
  height:44px;
  min-height:44px;
  margin:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.cell-editor .cell-pack-row>.cell-pack-menu>summary {width:44px;}
.cell-editor .cell-pack-row .cell-quantity-input {box-sizing:border-box;height:44px;min-height:44px;margin:0;}
.cell-editor .cell-editor-heading label {margin:0;}
.cell-editor .cell-view-sample {
  width: auto;
  height: auto;
  min-height: 40px;
  padding: 9px 12px;
  display: inline-flex;
  gap: 7px;
  white-space: nowrap;
}
.cell-delete-sample {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.cell-pack-menu {
  margin: 0;
}
.cell-pack-menu>summary {
  padding: 8px;
  min-width: 40px;
  justify-content: center;
}
.cell-pack-menu .btn.icon-button {
  width: 100%;
  justify-content: flex-start;
}
.cell-pack-preview {
  padding: 16px;
  margin: 0 0 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  min-width: 0;
}
.cell-pack-preview[hidden],.cell-derived-previews[hidden] {
  display: none;
}
.cell-pack-preview h3 {
  font-size: 16px;
  margin: 0 0 12px;
}
.cell-pack-preview>section+section {
  margin-top: 22px;
}
.cell-pack-preview .docx-preview {
  min-width: 0;
}
.cell-preview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 16px;
  margin-top: 16px;
  border-top: 1px solid var(--line);
}
.cell-preview-actions .btn {
  font-size: 14px;
  white-space: normal;
  text-align: left;
}
.cell-derived-previews {
  margin-top: 20px;
}
.cell-editor-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 20px;
}
.cell-editor-footer .dialog-actions {
  margin: 0;
  padding: 0;
  border-top: 0;
}
@media(max-width:760px) {
  .cell-pack-row {
    grid-template-columns: minmax(0,1fr) auto 40px;
    gap: 10px;
  }
  .cell-pack-meta {
    grid-column: 1 / -1;
  }
  .cell-editor .cell-pack-quantity {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-content: flex-start;
  }
  .cell-view-sample {
    grid-column: 1;
    grid-row: 3;
    justify-self: start;
  }
  .cell-delete-sample {
    grid-column: 2;
    grid-row: 3;
  }
  .cell-pack-menu {
    grid-column: 3;
    grid-row: 3;
  }
  .cell-pack-preview {
    padding: 12px;
  }
  .cell-preview-actions .btn {
    min-height: 44px;
  }
  .cell-editor-heading label {
    flex-wrap: wrap;
  }
}
#modalBody:has([data-preview-allocation]) td {
  vertical-align: top;
}
@media (max-width:760px) {
  .order-filters {
    flex-basis: 100%;
    max-width: none;
    grid-template-columns: minmax(0,1fr) 150px;
  }
  .orders-toolbar>.page-actions {
    justify-content: flex-start;
  }
  .detail-actions .btn.icon-button {
    padding: 8px;
    min-width: 40px;
  }
  .allocation-inline-preview {
    padding: 8px;
  }
}
@media (prefers-reduced-motion:reduce) {
  .is-spinning {
    animation: none;
  }
}
.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;
}
/* One question ledger combines source allocation, results, processing and API usage. */
#metricCards {
  display: contents;
}
.order-status-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.order-status-controls .value {
  min-width: 0;
}
.order-status-controls .status {
  white-space: normal;
}
.order-completed-at {
  display: block;
  margin-top: 12px;
  font-size: 14px;
  color: var(--muted);
}
.status-notice {
  margin-top: 8px;
  color: var(--bad);
  font-size: 14px;
}
.detail-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 20px 0 12px;
}
.detail-table-toolbar .result-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.detail-table-toolbar select {
  width: 170px;
}
.detail-table-toolbar input {
  width: 190px;
}
.detail-table-toolbar .page-actions {
  flex-wrap: wrap;
}
.unified-questions th {
  white-space: nowrap;
}
.unified-questions td {
  font-size: 14px;
  line-height: 1.5;
}
.unified-questions td>small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}
.unified-questions .question-link {
  overflow-wrap: anywhere;
  text-align: left;
}
.unified-questions td:nth-child(2) {
  min-width: 155px;
  max-width: 205px;
}
.unified-questions td:nth-child(4) {
  min-width: 150px;
  max-width: 220px;
}
.unified-questions td:nth-child(5) {
  min-width: 155px;
  max-width: 250px;
}
.unified-questions .slot-controls {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
}
.unified-questions [data-download-result] {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding: 8px;
}
.slot-api {
  min-width: 130px;
}
.slot-api>summary {
  cursor: pointer;
}
.slot-api>summary small {
  display: block;
  margin-top: 3px;
  font-size: 13px;
  color: var(--muted);
}
.api-stage {
  border-top: 1px solid var(--line);
  padding: 10px 0;
  margin-top: 8px;
}
.api-stage small {
  display: block;
  overflow-wrap: anywhere;
}
.api-total-stages {
  flex-wrap: wrap;
  font-size: 14px;
}
.unified-questions tfoot {
  background: var(--surface);
}
.ui-error {
  color: var(--bad);
}
.all-results-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  position: sticky;
  top: -24px;
  padding: 12px 0;
  z-index: 1;
  background: var(--panel);
}
.all-results-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.all-result {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px;
  min-width: 0;
}
.all-result h3 {
  margin: 0 0 12px;
  overflow-wrap: anywhere;
}
.all-result .docx-preview {
  padding: 0;
  min-width: 0;
}
.all-result .document-preview-host {
  overflow-x: auto;
}
.result-download-row {
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
}
@media (max-width:760px) {
  .detail-table-toolbar .result-filters {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }
  .detail-table-toolbar .result-filters>* {
    width: 100%;
    min-width: 0;
  }
  .detail-table-toolbar .result-filters input {
    grid-column: auto;
  }
  .all-results-toolbar {
    top: -16px;
  }
  .all-result {
    padding: 12px;
  }
  .order-status-controls {
    gap: 8px;
  }
}
#actionConfirmation {
  width: min(460px,calc(100vw - 32px));
}
#actionConfirmation .dialog-actions {
  position: static;
  justify-content: flex-end;
}
#actionConfirmation p {
  line-height: 1.5;
}
.input-categories {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.input-category {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0;
}
.input-category>summary {
  padding: 16px;
  cursor: pointer;
  font-weight: 600;
}
.input-category-body {
  padding: 0 16px 16px;
}
.input-pair,.snapshot-file {
  border-top: 1px solid var(--line);
  padding: 16px 0;
}
.input-pair h3,.snapshot-file h3 {
  margin: 0 0 8px;
  overflow-wrap: anywhere;
}
.input-pair h4,.snapshot-file h4 {
  margin: 16px 0 8px;
}
.input-pair .document-preview-host,.snapshot-file .document-preview-host {
  overflow-x: auto;
}
.input-text-preview {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.6;
  background: var(--surface);
  padding: 14px;
  border-radius: 8px;
}
.snapshot-config {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}
.snapshot-config strong {
  display: inline-block;
  min-width: 160px;
}
.snapshot-slot-config {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.snapshot-slot-config span {
  padding: 4px 8px;
  background: var(--surface);
  border-radius: 4px;
}
.capability-check-error {
  display: block;
  line-height: 1.45;
  overflow-wrap: anywhere;
  margin-top: 6px;
}
/* Shared source and ordering workspace. */
.workspace-source-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin: -2px 0 24px;
}
.workspace-source-toolbar .input-summary {
  padding: 0;
  font-size: 14px;
}
.workspace-source-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.topic-menu {
  position: relative;
}
.topic-menu>div {
  right: 0;
  left: auto;
  min-width: 230px;
}
.topic-menu .btn {
  justify-content: flex-start;
  width: 100%;
}
.workspace-references {
  margin: 0 0 24px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}
.workspace-references>summary,.image-advanced>summary {
  cursor: pointer;
  font-size: 14px;
  font-weight: 550;
  color: var(--muted);
}
.workspace-references[open]>.reference-grid {
  margin-top: 16px;
}
.workspace-ai-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 12px;
}
.workspace-ai-heading h2 {
  margin: 0;
  font-size: 16px;
}
#orderMatrix .q-cell {
  grid-template-columns: 72px minmax(0,1fr);
  gap: 12px;
  padding: 14px;
}
#orderMatrix .q-cell input {
  width: 72px;
}
#orderMatrix .q-pack-actions {
  align-items: center;
  gap: 2px 10px;
}
#orderMatrix .sample-management {
  font-size: 14px;
  min-height: 32px;
  padding: 0 3px;
  color: var(--brand);
}
.q-derived-count {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.5;
}
#orderMatrix .q-allocation {
  font-size: 13px;
  line-height: 1.5;
}
.generative-settings {
  margin-top: 14px;
}
.generative-settings>.check-line {
  margin: 0;
  font-size: 16px;
  color: var(--text);
  gap: 10px;
}
.generative-settings .image-description {
  margin: 8px 0 0;
  font-size: 14px;
}
.image-choice-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(260px,.8fr);
  gap: 20px;
  align-items: end;
  margin-top: 18px;
}
.image-choice-row .field {
  margin: 0;
}
.image-choice-row select {
  width: 100%;
  max-width: 100%;
}
.image-readiness {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
#imagePairStatus {
  display: grid;
  justify-items: start;
  gap: 6px;
  min-width: 0;
}
.image-status-note {
  color: var(--muted);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.image-readiness .btn {
  flex: none;
}
.image-advanced {
  border-top: 1px solid var(--line-soft);
  margin-top: 18px;
  padding-top: 12px;
}
.image-advanced-content {
  display: grid;
  grid-template-columns: minmax(180px,280px) minmax(0,1fr);
  gap: 12px 20px;
  padding-top: 16px;
}
.image-advanced-content .field {
  margin: 0;
}
.image-advanced-content .compact-note {
  margin: 0;
  font-size: 14px;
}
.image-management-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
#imagePairDetails:empty {
  display: none;
}
#imagePairDetails p {
  margin: 0 0 8px;
  overflow-wrap: anywhere;
}
#imageSettingsBody[hidden]+* {
  display: none;
}
@media (max-width:1050px) {
  .image-choice-row {
    grid-template-columns: 1fr;
  }
  .image-readiness {
    justify-content: flex-start;
  }
  .workspace-source-toolbar {
    align-items: flex-start;
  }
  #orderMatrix .q-cell {
    padding: 10px;
    grid-template-columns: 64px minmax(0,1fr);
    gap: 8px;
  }
  #orderMatrix .q-cell input {
    width: 64px;
  }
}
@media (max-width:760px) {
  .nav-btn {
    white-space: normal;
    height: auto;
    min-height: 44px;
  }
  .workspace-source-actions {
    width: 100%;
  }
  .workspace-source-toolbar {
    margin-bottom: 18px;
  }
  .workspace-source-actions .btn {
    padding: 8px 10px;
  }
  .workspace-source-actions>#importCollection {
    flex: 1;
  }
  .workspace-ai-heading {
    flex-wrap: wrap;
    gap: 4px;
  }
  #orderMatrix .q-cell {
    flex-direction: column;
    align-items: center;
    gap: 6px;
  }
  #orderMatrix .q-cell-detail {
    margin: 0;
    text-align: center;
  }
  #orderMatrix .q-pack-actions {
    justify-content: center;
    gap: 0 6px;
  }
  #orderMatrix .q-allocation {
    overflow-wrap: anywhere;
  }
  .image-choice-row {
    gap: 12px;
  }
  .image-readiness {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .image-advanced-content {
    grid-template-columns: 1fr;
  }
  .image-management-actions,#imagePairDetails {
    grid-column: auto;
  }
  .workspace-references {
    padding: 12px;
  }
  .generative-settings>.check-line {
    align-items: flex-start;
  }
  .image-readiness .btn {
    width: 100%;
  }
}
/* Explicit image token accounting: input/output labels and compact stage cards. */
.token-directions {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  margin: 8px 0;
  font-variant-numeric: tabular-nums;
}
.token-directions span {
  display: block;
  color: var(--muted);
  font-weight: 400;
}
.token-directions b {
  display: block;
  font-size: 14px;
  font-weight: 650;
  overflow-wrap: anywhere;
}
.token-directions b small {
  font-weight: 400;
}
.api-total-stages {
  display: grid;
}
.api-total-stages .api-stage {
  margin: 0;
  padding: 0 0 12px;
  border: 0;
}
.api-stage[data-usage-stage="Tạo ảnh"]>strong,.image-token-subtotal {
  color: var(--brand);
}
.slot-api .token-directions {
  gap: 8px;
}
.slot-api .api-stage {
  min-width: 170px;
}
.image-artifacts,.attempt-list {
  margin-top: 12px;
}
.image-artifacts>div,.attempt-list>div {
  padding: 8px 0;
  border-bottom: 1px solid var(--line-soft);
}
.image-artifacts a {
  display: inline-block;
  padding: 4px 0;
}
/* Full-width flow: sources and quantities, AI selection, then orders. */
:root {
  --sidebar-w: 176px;
}
body {
  font-size: 16px;
}
.content {
  padding: 20px 24px 40px;
  max-width: 1840px;
}
.sidebar {
  padding: 24px 12px;
}
.topbar {
  padding: 0 24px;
}
.logo-sub {
  font-size: 12px;
}
.workspace-shortcuts {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.workspace-shortcuts a {
  color: var(--muted);
  font-size: 14px;
  text-decoration: none;
  padding: 6px 12px;
  border-radius: 6px;
}
.workspace-shortcuts a:hover {
  background: var(--brand-soft);
  color: var(--text);
}
.workspace-stack {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: 20px;
  align-items: start;
}
.source-workspace,.ai-workspace {
  min-width: 0;
  scroll-margin-top: 88px;
}
.workspace-section-head,.workspace-ai-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 20px;
}
.workspace-section-head h2,.workspace-ai-heading h2 {
  font-size: 16px;
  margin: 0;
}
.step-marker {
  display: inline-flex;
  width: 24px;
  height: 24px;
  flex: none;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  background: var(--brand-soft);
  color: var(--brand);
  font-size: 13px;
  font-weight: 650;
}
.workspace-ai-heading {
  flex-wrap: wrap;
}
.workspace-ai-heading #openAIConfig {
  margin-left: auto;
  font-size: 14px;
  min-height: 36px;
  padding: 0;
}
.ai-workspace {
  position: static;
  padding: 20px;
}
.ai-workspace .ai-model-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.ai-workspace .model-card-head {
  margin-bottom: 8px;
}
.ai-workspace .model-advanced {
  margin-top: 8px;
  padding-top: 4px;
}
.ai-workspace .model-advanced>summary {
  font-size: 14px;
  min-height: 32px;
}
.ai-workspace .generative-settings {
  padding: 16px;
  margin-top: 16px;
}
.generative-settings>summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  min-height: 32px;
}
.ai-workspace .image-choice-row {
  grid-template-columns: minmax(0,1fr) minmax(200px,.8fr);
  margin-top: 12px;
}
.ai-workspace .image-readiness {
  flex-wrap: wrap;
}
.ai-workspace .order-action {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.ai-workspace #create {
  width: auto;
  min-width: 190px;
  min-height: 44px;
  flex: none;
}
.ai-workspace #orderPlanSummary {
  font-size: 14px;
  overflow-wrap: anywhere;
}
.workspace-source-toolbar {
  margin-bottom: 20px;
}
.source-workspace .workspace-references {
  margin: 16px 0 0;
}
.source-workspace .quantity-toolbar {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--line-soft);
}
.source-workspace #orderMatrix {
  margin-bottom: 0;
}
#orderValidation {
  text-align: left !important;
  color: var(--warn);
  font-size: 14px;
}
.order-selection {
  margin-bottom: 16px;
}
.compact-note,.key-note,.status,.connection-url,.runner-note,.q-allocation,.q-derived-count {
  font-size: 14px;
}
.q-pack-actions .question-link {
  font-size: 14px;
}
.embedded-orders {
  scroll-margin-top: 88px;
  margin-top: 28px;
  padding-top: 24px;
}
.embedded-orders>h2 {
  margin-bottom: 16px;
  font-size: 18px;
}
.orders-toolbar {
  margin-top: 0;
}
.orders-toolbar .page-actions {
  gap: 6px;
}
#deleteHistory {
  font-size: 13px;
}
.ai-connections-head {
  gap: 24px;
}
.config-prompts>summary {
  padding: 18px;
}
.prompt-stack {
  gap: 16px;
}
.config-prompts .exact-prompt {
  font-size: 14px;
}
.detail-actions {
  gap: 6px;
}
.detail-actions>.btn,.detail-actions summary {
  font-size: 14px;
}
.order-more-menu>div {
  right: 0;
  left: auto;
  min-width: 210px;
}
.order-more-menu .btn {
  justify-content: flex-start;
  width: 100%;
}
.kpis {
  gap: 12px;
}
.kpi .value {
  font-size: 24px;
}
.detail-table-toolbar {
  gap: 10px;
}
.slot-api>summary {
  font-size: 14px;
}
.slot-controls .question-link {
  min-height: 36px;
}
/* Connection checks remain readable while each result arrives. */
#modal:has(#checkAllConnections) {
  width: min(980px,calc(100vw - 32px));
}
.capability-check-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.capability-check-bar p {
  flex-basis: 100%;
  margin: 4px 0 8px;
}
.provider-capabilities {
  margin: 12px 0 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.provider-capabilities>summary {
  padding: 12px 16px;
  cursor: pointer;
  font-weight: 600;
}
.provider-capabilities>[id^="cap-results"] {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 0 16px;
  padding: 0 16px 16px;
}
.capability-result {
  min-width: 0;
  border-bottom: 1px solid var(--line-soft);
  padding: 12px 0;
}
.ability-model-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.ability-model-heading strong {
  font-size: 14px;
  overflow-wrap: anywhere;
}
.ability-model-heading .btn {
  font-size: 13px;
  min-height: 32px;
  padding: 4px 10px;
  flex: none;
}
.capability-roles {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.capability-role {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
}
.capability-check-error {
  font-size: 13px;
  color: var(--warn);
}
.reference-line {
  gap: 10px;
  flex-wrap: wrap;
}
.reference-line>span {
  flex: 1 1 240px;
}
.reference-line .connection-url {
  overflow-wrap: anywhere;
}
.check-line {
  font-size: 14px;
}
.pack-history-result {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  margin: 12px 0;
}
.pack-history-result>summary {
  cursor: pointer;
  font-size: 14px;
}
.pack-row {
  padding: 16px;
}
.pack-row>div {
  min-width: 0;
}
.pack-row p {
  overflow-wrap: anywhere;
}
.modal-body .dialog-actions {
  gap: 8px;
  flex-wrap: wrap;
}
@media (max-width:1200px) {
  .workspace-stack {
    gap: 16px;
  }
  .content {
    padding: 20px;
  }
  .source-workspace {
    padding: 16px;
  }
  .source-workspace .workspace-source-actions .btn {
    padding: 8px 10px;
  }
  #orderMatrix .q-cell {
    grid-template-columns: 60px minmax(0,1fr);
    padding: 8px;
    gap: 6px;
  }
  #orderMatrix .q-cell input {
    width: 60px;
  }
  .q-row {
    padding: 12px;
  }
  .q-type-name {
    font-size: 14px;
  }
}
@media (max-width:760px) {
  .topbar {
    padding: 0 16px;
    height: 56px;
  }
  .workspace-shortcuts {
    gap: 4px;
    margin-bottom: 12px;
  }
  .workspace-shortcuts a {
    padding: 6px 8px;
  }
  .ai-workspace .image-choice-row,.ai-workspace .image-advanced-content {
    grid-template-columns: 1fr;
  }
  .source-workspace,.ai-workspace {
    padding: 16px;
  }
  .ai-workspace .order-action {
    flex-direction: column;
    align-items: stretch;
  }
  .ai-workspace #create {
    width: 100%;
  }
  .provider-capabilities>[id^="cap-results"] {
    grid-template-columns: 1fr;
  }
  .workspace-section-head {
    margin-bottom: 16px;
  }
  .workspace-source-actions .btn {
    font-size: 14px;
  }
  .workspace-source-actions {
    gap: 6px;
  }
  .orders-toolbar .page-actions {
    gap: 6px;
    justify-content: flex-start;
  }
  .detail-actions {
    justify-content: flex-start;
  }
  .detail-head {
    width: 100%;
  }
  .compact-note {
    font-size: 14px;
  }
  .q-row {
    padding: 8px;
  }
  .q-row-total {
    flex-wrap: wrap;
  }
  .q-row-total input {
    width: 52px;
  }
  #orderMatrix .q-cell {
    display: flex;
    padding: 10px 4px;
  }
  .q-level-head label {
    font-size: 14px;
  }
  .q-level-head input {
    width: 52px;
  }
  .order-selection {
    grid-template-columns: 90px minmax(0,1fr);
    gap: 12px;
  }
  .unified-questions table {
    min-width: 1000px;
  }
  .reference-line .btn {
    font-size: 13px;
    min-height: 36px;
  }
  .workspace-shortcuts,.source-workspace,.ai-workspace,.embedded-orders {
    scroll-margin-top: 80px;
  }
}
/* The sidebar occupies exactly its grid track; page content never sits beneath it. */
.sidebar {
  width: auto;
  min-width: 0;
  grid-column: 1;
  grid-row: 1;
}
.main {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  width: 100%;
}
.content {
  min-width: 0;
  width: 100%;
}
.content>section {
  min-width: 0;
}
.topbar {
  position: sticky;
  top: 0;
}
.logo-card {
  padding-inline: 6px;
}
.logo-sub {
  line-height: 1.6;
  white-space: normal;
}
.sidebar .nav-stack {
  display: grid;
  gap: 8px;
}
.ai-workspace .ai-model-grid {
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 16px;
  align-items: start;
}
.ai-workspace .generative-settings {
  margin: 0;
}
.ai-workspace .image-choice-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin: 0;
}
.ai-workspace .image-advanced-content {
  grid-template-columns: minmax(0,1fr);
  gap: 12px;
  padding-top: 12px;
}
.ai-workspace .image-advanced {
  margin-top: 8px;
  padding-top: 4px;
}
.ai-workspace .image-advanced>summary {
  padding: 6px 0;
  min-height: 32px;
  font-size: 14px;
}
.image-readiness {
  flex-wrap: wrap;
  align-items: flex-start;
}
.image-readiness .btn {
  max-width: 100%;
  white-space: normal;
}
.image-management-actions,#imagePairDetails {
  grid-column: auto;
}
.image-description {
  margin: 0 !important;
}
.ai-workspace .model-card-head {
  min-height: 32px;
  align-items: center;
}
.ai-workspace .review-switch {
  min-height: 0;
  margin: 0;
}
.model-card-head .compact-note {
  font-size: 13px;
}
.image-status-note {
  font-size: 13px;
}
.order-action-summary {
  min-width: 0;
  display: grid;
  gap: 6px;
}
.quantity-toolbar-summary:has(#quantityValidation[hidden]) {
  display: none;
}
#quantityValidation {
  color: var(--warn);
  overflow-wrap: anywhere;
}
.detail-actions {
  flex-wrap: wrap;
  justify-content: flex-start;
  min-width: 0;
}
.section-head:has(.detail-head) {
  align-items: flex-start;
  flex-direction: column;
}
.detail-head #orderTitle {
  max-width: none;
  white-space: normal;
  overflow-wrap: anywhere;
}
.orders-toolbar {
  flex-wrap: wrap;
  align-items: flex-start;
}
.orders-toolbar .order-filters {
  min-width: min(100%,320px);
}
.orders-toolbar .page-actions {
  flex-wrap: wrap;
  min-width: 0;
}
.page-actions .btn {
  max-width: 100%;
  white-space: normal;
  text-align: left;
}
.q-row {
  flex-wrap: wrap;
}
.q-row-total {
  flex: none;
}
.q-cell-detail,.q-pack-actions {
  min-width: 0;
}
.q-pack-actions {
  flex-wrap: wrap;
}
.q-type-name {
  overflow-wrap: anywhere;
}
.config-prompts>p {
  margin: 16px 0;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.input-category>summary {
  white-space: normal;
  overflow-wrap: anywhere;
}
.prompt-input {
  width: 100%;
  max-width: 100%;
}
.unified-questions td {
  white-space: normal;
}
.unified-questions tfoot th {
  white-space: normal;
  vertical-align: top;
}
.unified-questions tfoot th small {
  display: block;
  margin-top: 6px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--muted);
}
.unified-questions tfoot td {
  padding: 16px;
}
.api-total-stages {
  grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
  gap: 20px;
}
.api-total-stages .api-stage {
  min-width: 0;
}
.api-total-stages+small {
  display: block;
  margin-top: 12px;
  line-height: 1.6;
}
.token-directions {
  gap: 16px;
}
.token-directions span {
  font-size: 13px;
}
#notice,#notice[data-error="true"] {
  position: fixed;
  inset: auto 24px 80px auto;
  left: auto;
  top: auto;
  transform: none;
  width: min(440px,calc(100vw - 48px));
  max-width: none;
  margin: 0;
  z-index: 40;
  max-height: min(320px,50dvh);
  overflow: auto;
  background: var(--panel);
  border: 1px solid var(--line);
  box-shadow: 0 8px 32px #0006;
  padding: 12px 16px;
}
#notice[data-error="true"] {
  background: var(--bad-bg);
}
.notice-close {
  float: right;
  margin: 0 0 4px 12px;
}
.technical-error {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
@media (min-width:761px) and (max-width:960px) {
  .app {
    display: grid;
    grid-template-columns: 176px minmax(0,1fr);
  }
  .sidebar {
    position: sticky;
    top: 0;
    height: 100dvh;
    display: flex;
    flex-direction: column;
  }
  .logo-card {
    display: block;
  }
  .sidebar-footer {
    display: grid;
    margin-top: auto;
  }
  .sidebar-footer .account {
    display: block;
  }
  .content {
    padding: 20px;
  }
  .topbar .pill {
    display: inline-flex;
    max-width: 200px;
  }
  .ai-workspace .ai-model-grid {
    grid-template-columns: 1fr;
  }
  .order-filters {
    grid-template-columns: minmax(0,1fr);
  }
}
@media (max-width:760px) {
  .app {
    display: block;
  }
  .sidebar {
    width: 100%;
    height: auto;
    position: static;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
  }
  .sidebar .nav-stack {
    grid-column: 1/-1;
    grid-row: 2;
  }
  .main {
    width: 100%;
  }
  .content {
    padding: 16px 12px 28px;
  }
  .ai-workspace .ai-model-grid {
    grid-template-columns: 1fr;
  }
  .api-total-stages {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .orders-toolbar .order-filters {
    min-width: 0;
    width: 100%;
  }
  .order-progress span {
    white-space: normal;
  }
  #notice,#notice[data-error="true"] {
    inset: auto 12px 16px;
    width: calc(100vw - 24px);
  }
  .topbar .pill {
    max-width: 150px;
  }
  .ai-workspace .model-card-head {
    flex-wrap: nowrap;
  }
}
/* Fixed legacy heights must not cut Vietnamese accents or number fields. */
button,input,select,textarea {
  line-height: 1.5;
}
select,input:not([type="checkbox"]):not([type="file"]) {
  height: auto;
  min-height: 44px;
  padding: 8px 12px;
}
#orderMatrix .q-cell input,.q-row-total input,.q-level-head input {
  padding: 6px 8px;
  line-height: 1.4;
  min-height: 44px;
  height: 44px;
}
.bulk-quantity input {
  min-height: 48px;
  height: 48px;
  padding: 6px 12px;
  line-height: 1.4;
}
/* Compact topic controls on one row, with natural wrapping on smaller screens. */
.source-workspace .order-selection {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 0;
}
.source-workspace .order-selection>.field {
  margin: 0;
  flex: 0 0 100px;
  min-width: 0;
}
.source-workspace .order-selection>.topic-field {
  flex: 0 1 260px;
  width: 260px;
  min-width: 180px;
}
.source-workspace .order-selection select {
  width: 100%;
  min-width: 0;
  text-overflow: ellipsis;
}
.source-workspace .workspace-source-actions {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  gap: 8px;
}
.source-workspace .workspace-source-actions .btn {
  min-height: 44px;
  white-space: normal;
}
#promptsPage .config-prompts>.section-head {
  margin-bottom: 20px;
}
@media (max-width:760px) {
  .sidebar .nav-stack {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
  .source-workspace .order-selection>.topic-field {
    flex: 1 1 180px;
    width: auto;
  }
  .source-workspace .workspace-source-actions {
    flex-basis: 100%;
  }
}
/* Connection tools are available directly on their own page. */
.connections-workspace {
  display: grid;
  gap: 20px;
  min-width: 0;
}
.connections-workspace>.key-card {
  margin: 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 12px;
  min-width: 0;
}
.connections-workspace .key-line {
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
}
.connections-workspace .key-line input {
  width: 100%;
  min-width: 0;
}
.connections-workspace .base-url-field {
  max-width: 760px;
}
.connections-workspace .key-card>label {
  display: block;
  margin-bottom: 8px;
}
.connections-workspace .provider-capabilities>[id^="cap-results"] {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 0 20px;
  padding: 0 16px 16px;
}
.connections-workspace .check-line {
  display: flex;
  align-items: flex-start;
}
.connections-workspace .connection-management>label {
  display: block;
  margin: 12px 0 8px;
}
@media (max-width:1200px) {
  .connections-workspace .provider-capabilities>[id^="cap-results"] {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}
@media (max-width:760px) {
  .connections-workspace>.key-card {
    padding: 16px;
  }
  .connections-workspace .provider-capabilities>[id^="cap-results"] {
    grid-template-columns: 1fr;
  }
}
/* Creation: summaries are the default; group edits remain directly available. */
#orderMatrix:not(.edit-group-totals) .q-row-total,
#orderMatrix:not(.edit-group-totals) .q-level-head input {
  display: none;
}
#orderMatrix.edit-group-totals .quantity-summary {
  display: none;
}
.quantity-summary {
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.quantity-toolbar-actions .check-line {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}
.field-error {
  color: var(--warn);
  font-size: 13px;
  line-height: 1.6;
  margin: 8px 0;
  overflow-wrap: anywhere;
}
.ai-workspace .ai-model-card {
  background: var(--surface);
}
.ai-workspace .model-inactive {
  background: transparent;
}
.ai-workspace .model-inactive .model-card-head {
  margin-bottom: 0;
}
.ai-workspace .model-inactive .compact-note {
  white-space: normal;
  text-align: right;
}
.ai-workspace .model-card-head {
  flex-wrap: wrap;
}
.model-picker {
  position: relative;
  display: flex;
  min-width: 0;
  width: 100%;
}
.ai-model-card .model-picker input {
  margin: 0;
  padding-right: 40px;
  width: 100%;
  text-overflow: ellipsis;
}
.model-picker-arrow {
  position: absolute;
  right: 1px;
  top: 1px;
  bottom: 1px;
  width: 36px;
  min-height: 40px;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.model-picker-options {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 320px;
  overflow-y: auto;
  overscroll-behavior: contain;
  z-index: 35;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 4px;
  background: var(--panel);
  box-shadow: 0 8px 24px #0005;
}
.model-picker-options > p {
  padding: 8px 12px;
}
.model-picker-option {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  min-height: 44px;
  border-radius: 6px;
  font-size: 14px;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.model-picker-option small {
  color: var(--muted);
  font-size: 12px;
}
.model-picker-option:hover,.model-picker-option.is-active {
  background: var(--brand-soft);
}
.model-picker-option[aria-selected="true"] {
  color: var(--brand);
}
/* Results: five columns; full controls and API traces expand below a question. */
.unified-questions table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
.unified-questions th:nth-child(1) {
  width: 48px;
}
.unified-questions th:nth-child(2) {
  width: 24%;
}
.unified-questions th:nth-child(3) {
  width: 24%;
}
.unified-questions th:nth-child(5) {
  width: 180px;
}
.unified-questions td {
  overflow-wrap: anywhere;
  vertical-align: top;
}
.unified-questions td small {
  display: block;
  margin: 4px 0;
}
.unified-questions .slot-controls {
  min-width: 0;
  gap: 6px;
}
.slot-detail-row:not(:has(.slot-extra[open])) {
  display: none;
}
.slot-detail-row > td {
  padding: 0 16px 16px;
  background: var(--surface);
}
.slot-detail-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,2fr);
  gap: 24px;
  padding: 16px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
}
.slot-detail-grid section {
  min-width: 0;
}
.slot-detail-grid h3 {
  margin: 0 0 12px;
  font-size: 14px;
}
.slot-detail-grid .slot-api {
  width: 100%;
  min-width: 0;
}
.order-api-summary > summary {
  min-height: 40px;
  color: var(--muted);
}
.api-total-stages {
  padding: 16px 0;
}
.status.ok {
  white-space: normal;
}
/* Dossiers and prompts load or unfold only the selected material. */
.history-filters,.connection-filters {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto auto;
  gap: 12px;
  margin: 16px 0;
  align-items: center;
}
.history-filters input,.connection-filters input {
  width: 100%;
  min-width: 0;
}
.history-filters select,.connection-filters select {
  min-width: 0;
  max-width: 100%;
}
.prompt-phase {
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.prompt-phase > h3 {
  margin: 0 0 12px;
  font-size: 15px;
}
.prompt-phase > h3 span,.prompt-card h3 span {
  display: block;
  margin-top: 4px;
  font-weight: 400;
}
#pipelinePromptCatalog {
  grid-template-columns: 1fr;
  gap: 16px;
}
.prompt-phase .input-category {
  margin: 0;
  padding: 0;
  border: 0;
  border-top: 1px solid var(--line-soft);
  border-radius: 0;
}
.prompt-phase .input-category > summary,.prompt-audit-question > summary {
  padding: 12px 0;
  min-height: 44px;
}
.prompt-audit-question {
  border-bottom: 1px solid var(--line);
}
.prompt-audit-question .snapshot-file {
  margin-left: 12px;
}
/* Connections are a comparison list, grouped by provider. */
.connection-provider {
  margin-top: 20px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
  min-width: 0;
}
.connections-workspace .provider-capabilities > [id^="cap-results"] {
  display: block;
  padding: 0;
}
.connections-workspace .capability-result {
  display: grid;
  grid-template-columns: minmax(0,1.3fr) minmax(0,1fr) minmax(0,1.4fr);
  gap: 12px;
  padding: 12px 0;
  align-items: center;
}
.connections-workspace .ability-model-heading {
  margin: 0;
}
.connections-workspace .capability-roles {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
}
.connections-workspace .model-checked-at {
  grid-column: 1/-1;
  margin: 0;
}
.connections-workspace .capability-check-error {
  grid-column: 1/-1;
}
.connections-workspace .model-availability {
  margin: 0;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.btn.primary.danger {
  color: var(--bad);
  background: var(--bad-bg);
  border-color: var(--bad);
}
@media (max-width: 1100px) {
  .unified-questions th:nth-child(5) {
    width: 148px;
  }
  .unified-questions td,.unified-questions th {
    padding: 12px;
  }
  .quantity-toolbar-actions {
    flex-wrap: wrap;
    gap: 8px;
  }
  .connections-workspace .capability-result {
    grid-template-columns: minmax(0,1.4fr) minmax(0,1fr);
  }
  .connections-workspace .model-availability {
    grid-column: 1/-1;
  }
}
@media (max-width: 760px) {
  .history-filters,.connection-filters {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .history-filters input,.connection-filters input,.history-filters .btn {
    grid-column: 1/-1;
  }
  .history-filters select {
    grid-column: 1/-1;
  }
  .connections-workspace .capability-result {
    grid-template-columns: 1fr;
  }
  .connections-workspace .capability-roles {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .connections-workspace .capability-role {
    flex-direction: row;
    align-items: center;
  }
  .unified-questions table,.unified-questions tbody,.unified-questions tfoot {
    display: block;
    min-width: 0;
    width: 100%;
  }
  .unified-questions thead {
    display: none;
  }
  .unified-questions tbody > tr[data-slot-position] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 12px;
    padding: 16px;
    border-bottom: 1px solid var(--line);
  }
  .unified-questions tbody > tr[data-slot-position] > td {
    display: block;
    padding: 0;
    border: 0;
    min-width: 0;
  }
  .unified-questions tbody > tr[data-slot-position] > td:first-child {
    grid-column: 1/-1;
    color: var(--muted);
    font-size: 12px;
  }
  .unified-questions tbody > tr[data-slot-position] > td:first-child:before {
    content: 'Câu ';
  }
  .unified-questions td[data-label]:before {
    content: attr(data-label);
    display: block;
    color: var(--muted);
    font-size: 12px;
    margin-bottom: 4px;
  }
  .unified-questions tbody > tr[data-slot-position] > td:last-child {
    grid-column: 1/-1;
  }
  .slot-detail-row:has(.slot-extra[open]) {
    display: block;
  }
  .slot-detail-row > td {
    display: block;
    padding: 12px;
  }
  .slot-detail-grid {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 12px;
  }
  .unified-questions tfoot tr,.unified-questions tfoot td,.unified-questions tfoot th {
    display: block;
    width: 100%;
  }
  .api-total-stages {
    grid-template-columns: 1fr;
  }
  .prompt-phase {
    padding: 16px;
  }
  .quantity-toolbar-actions {
    justify-content: flex-start;
  }
  .quantity-toolbar-actions .check-line {
    flex: 1;
    min-width: 0;
  }
}
/* Order costs */
.cost-settings {
  margin-top: 20px;
}
.cost-settings h3,.cost-details h3 {
  margin-top: 0;
}
.cost-form {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
}
.cost-form label {
  display: block;
  font-size: 14px;
  margin-bottom: 6px;
}
.cost-form input,.cost-form select {
  width: 100%;
  min-width: 0;
}
.cost-form .cost-full {
  grid-column: 1/-1;
}
.cost-settings [hidden] {
  display: none;
}
.cost-details {
  margin-bottom: 20px;
}
.cost-stages {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
}
.cost-stage {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.cost-stage strong,.cost-stage span {
  display: block;
}
.cost-stage span {
  margin-top: 8px;
  font-size: 16px;
}
.cost-stage small {
  font-size: 14px;
  color: var(--muted);
}
.cost-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin: 16px 0;
}
.cost-summary strong {
  display: block;
  margin-top: 4px;
  font-size: 18px;
}
.cost-estimate {
  padding: 16px;
  margin: 16px 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 14px;
}
.cost-estimate strong {
  display: block;
  font-size: 18px;
  margin-bottom: 8px;
}
.slot-cost {
  padding: 10px 0;
  font-size: 14px;
}
.cost-details .section-head {
  margin-bottom: 12px;
}
.cost-settings .cost-rate-summary {
  margin-top: 16px;
  max-height: 240px;
  overflow: auto;
}
.cost-rate-summary li {
  margin: 8px 0;
  overflow-wrap: anywhere;
}
#kpis {
  grid-template-columns: repeat(auto-fit,minmax(180px,1fr));
}
#metricCards .value {
  font-size: 21px;
}
@media (max-width:760px) {
  .cost-form,.cost-stages {
    grid-template-columns: 1fr;
  }
  #kpis {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .cost-details .section-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  #metricCards .value {
    font-size: 17px;
  }
  .cost-summary {
    gap: 12px;
  }
}
.order-cost-panel > summary {
  min-height: 44px;
  padding: 12px 0;
  font-size: 14px;
  color: var(--muted);
}
.ability-model-title {
  min-width: 0;
}
.ability-model-title > small {
  display: block;
  margin-top: 4px;
}

/* AI connections: one comparison row per model; details span the whole row. */
.connections-workspace .add-connection>summary {display:flex;align-items:center;gap:16px;cursor:pointer;list-style:none;}
.connections-workspace .add-connection>summary::before {content:'+';font-size:24px;color:var(--text);}
.connections-workspace .add-connection[open]>summary::before {content:'−';}
.connections-workspace .add-connection>summary span {color:var(--muted);font-size:14px;}
.add-connection-form {max-width:820px;padding-top:20px;}
.add-connection-form>label {display:block;margin:14px 0 6px;}
.connections-workspace>.saved-connection-list {border:0;padding:0;background:transparent;}
.connections-workspace .connection-filters {display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,210px) minmax(180px,220px);gap:12px;}
.batch-check-settings {padding:12px 0;border-bottom:1px solid var(--line);}
.batch-check-settings>h4 {margin:0;font-size:16px;font-weight:600;}
.connection-pricing>summary {cursor:pointer;font-weight:600;}
.batch-check-settings .capability-check-bar {margin-top:14px;}
.connections-workspace .connection-provider {margin-top:20px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);}
.connection-key-heading {display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:4px 0 12px;}
.connection-key-heading>span {flex:1;min-width:160px;overflow-wrap:anywhere;}
.connection-key-heading>span>strong {font-size:17px;}
.connection-key-heading .connection-url {display:block;margin-top:5px;font-size:13px;line-height:1.5;}
.connection-key-heading>.btn,.connection-key-heading>.key-maintenance>summary {min-height:44px;}
.connection-key-actions {display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px;max-width:100%;}
.connection-key-actions>.btn {min-height:44px;white-space:normal;}
@media(max-width:760px){.connection-key-actions{width:100%;justify-content:flex-start;}.connection-key-actions>.btn{flex:1 1 160px;}}
.connections-workspace .provider-capabilities {margin:0;border:0;background:transparent;}
.connections-workspace .provider-capabilities>summary {padding:12px 0;font-size:14px;}
.connections-workspace .capability-result {display:grid;grid-template-columns:minmax(140px,1fr) minmax(0,240px) minmax(0,320px) auto;gap:12px 20px;align-items:center;padding:12px 16px;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;justify-content:normal;}
.connections-workspace .capability-result:last-child {border-bottom:0;}

.connections-workspace .model-summary {display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;min-width:0;}
.connections-workspace .model-summary>small {margin:0;font-size:14px;line-height:1.5;color:var(--muted);}
.connections-workspace .model-summary>.model-availability {white-space:nowrap;}
.connections-workspace .ability-model-heading {display:block;min-width:0;margin:0;}
.connections-workspace .ability-model-title strong {display:block;overflow-wrap:anywhere;font-size:15px;line-height:1.6;}
.connections-workspace .ability-model-title small {display:block;margin:4px 0 0;font-size:13px;line-height:1.6;}
.connections-workspace .capability-roles {display:flex;gap:8px 16px;flex-wrap:wrap;}
.connections-workspace .capability-role {display:flex;align-items:center;gap:6px;font-size:14px;margin:0;}
.connections-workspace .capability-tag {font-size:13px;line-height:1.5;white-space:normal;}
.connections-workspace .model-capabilities,.connections-workspace .image-model-status {min-width:0;}
.connections-workspace .image-model-status>small {display:block;color:var(--muted);margin-top:6px;font-size:13px;line-height:1.5;}
.connections-workspace .model-row-actions {display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;min-width:0;grid-column:auto;grid-row:auto;max-width:none;}
.connections-workspace .model-row-actions .btn {min-height:40px;padding:8px 12px;font-size:14px;white-space:normal;}
.connections-workspace .model-test-details {grid-column:1/-1;min-width:0;margin:0;padding:16px;border:1px solid var(--line);border-radius:8px;background:var(--bg);}
.connections-workspace .model-test-details[hidden] {display:none;}
.connections-workspace .model-test-details .model-checked-at {display:block;font-size:13px;margin:12px 0;}
.connections-workspace .model-test-details .probe-summary,.connections-workspace .model-test-details .compact-note {font-size:14px;line-height:1.6;overflow-wrap:anywhere;margin:0 0 12px;}
.connections-workspace .model-test-details .capability-check-error {display:block;font-size:14px;line-height:1.6;margin:0 0 12px;}
.connections-workspace .connection-management {border:0;border-top:1px solid var(--line);padding:12px 0 0;margin-top:8px;}
.connections-workspace .connection-management>summary {padding:4px 0;font-size:14px;cursor:pointer;}
.connections-workspace .connection-image-models {margin:16px 0 0;padding:0;border:0;}
.connection-image-models h4 {margin:0;padding:12px 0;font-size:14px;}
.connection-pricing {margin-top:20px;padding:18px 20px;border:1px solid var(--line);border-radius:12px;background:var(--surface);}
.connection-pricing>.cost-settings {border:0;padding:20px 0 0;margin:0;box-shadow:none;}
#ordersBody td:last-child small {display:block;margin-top:5px;color:var(--muted);font-size:12px;}
#ordersBody .order-image-model {min-width:150px;overflow-wrap:anywhere;}
#ordersBody .order-stage-count {display:block;margin-top:6px;color:var(--muted);font-size:13px;line-height:1.5;}
@media(max-width:1100px) {
 .connections-workspace .connection-filters {grid-template-columns:minmax(0,1fr) 160px 180px;}
 .connections-workspace .capability-result,.connections-workspace .capability-result[data-model-kind="image"] {grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;}
 .connections-workspace .model-summary {grid-column:1;grid-row:2;}
 .connections-workspace .model-row-actions {grid-column:2;grid-row:1;}
 .connections-workspace .model-capabilities,.connections-workspace .image-model-status {grid-column:1/-1;grid-row:3;display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
 .connections-workspace .model-availability,.connections-workspace .image-model-status>small {margin:0;}
}
@media(max-width:760px) {
 .connections-workspace .connection-filters {grid-template-columns:1fr 1fr;}
 .connections-workspace .connection-filters input {grid-column:1/-1;}
 .connections-workspace .connection-provider {padding:12px;}
 .connections-workspace .capability-result {padding:14px 12px;}
 .connections-workspace .add-connection>summary {align-items:flex-start;flex-wrap:wrap;gap:8px;}
 .connections-workspace .add-connection>summary span {flex-basis:100%;padding-left:24px;}
}
@media(max-width:560px) {
 .connections-workspace .connection-filters,.connections-workspace .capability-result,.connections-workspace .capability-result[data-model-kind="image"] {grid-template-columns:minmax(0,1fr);}
 .connections-workspace .model-row-actions {grid-column:1;grid-row:4;justify-content:flex-start;}
 .connections-workspace .model-capabilities,.connections-workspace .image-model-status {grid-column:1;}
 .connection-key-heading>.btn {flex:1;}
 .prompt-references>.section-head {align-items:flex-start;flex-direction:column;gap:12px;}
}
.cost-estimate-items{display:grid;gap:12px;margin:14px 0}.cost-estimate-items>div{display:grid;gap:4px;padding:10px 0;border-bottom:1px solid var(--border,#304052)}.cost-estimate-items span,.cost-estimate-items small{overflow-wrap:anywhere}.cost-estimate-items small{color:var(--muted,#a4b0c1)}.cost-estimate-items a,#priceSource a{color:inherit;text-decoration:underline}
.workspace-ai-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-left:auto}.workspace-ai-heading .workspace-ai-actions .question-link{margin-left:0;font-size:14px;min-height:36px;padding:0}#ordersBody .order-key-name{display:block;margin-top:5px;overflow-wrap:anywhere;color:var(--muted);font-size:13px;line-height:1.5}@media(max-width:560px){.workspace-ai-actions{width:100%;margin-left:0;gap:16px}}

/* Phone order form: one expandable row per type, with the same underlying inputs. */
.mobile-topic-tools,.mobile-ai-jump,.q-mobile-row-toggle,.q-mobile-level {display:none;}
@media (max-width:760px) {
  #createPage {padding-bottom:calc(160px + env(safe-area-inset-bottom,0px));}
  #sourceWorkspace,#aiWorkspace {padding:14px;min-width:0;}
  .source-workspace .order-selection {display:grid;grid-template-columns:88px minmax(0,1fr);gap:12px;}
  .source-workspace .order-selection>.field,.source-workspace .order-selection>.topic-field {width:auto;min-width:0;}
  #createPage .field>label {font-size:14px;}
  #createPage input:not([type="checkbox"]):not([type="file"]),#createPage select {font-size:16px;}
  .mobile-topic-tools {display:block;grid-column:1/-1;justify-self:start;min-height:44px;font-size:14px;}
  .source-workspace .workspace-source-actions {grid-column:1/-1;width:100%;display:none;}
  .source-workspace .workspace-source-actions.mobile-expanded {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .source-workspace .workspace-source-actions .btn {width:100%;min-height:44px;}
  .source-workspace .workspace-source-actions #importCollection {grid-column:1/-1;}
  .source-workspace .quantity-toolbar {display:grid;grid-template-columns:1fr;gap:12px;margin-top:16px;padding-top:16px;}
  .quantity-toolbar .bulk-quantity {display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:12px;margin:0;}
  .bulk-quantity label {width:auto;font-size:16px;}
  .bulk-quantity #totalQuantity {width:100%;min-height:48px;font-size:22px;}
  .quantity-toolbar-actions {width:100%;justify-content:space-between;gap:12px;}
  .quantity-toolbar-actions .check-line {margin:0;font-size:14px;min-height:44px;align-items:center;}
  .quantity-toolbar-actions .check-line input {flex:none;width:22px;height:22px;}
  .quantity-toolbar-actions #clearQuantities {width:44px;min-width:44px;height:44px;flex:none;}
  .quantity-toolbar-summary {grid-column:auto;padding:0;border:0;}
  .mobile-ai-jump {display:flex;align-items:center;justify-content:flex-end;min-height:44px;margin:0 0 8px;font-size:14px;}
  #orderMatrix {grid-template-columns:minmax(0,1fr);border-radius:10px;}
  #orderMatrix .q-head,#orderMatrix .q-desktop-type,#orderMatrix .type-no {display:none;}
  #orderMatrix.edit-group-totals .q-level-head {display:grid;grid-template-columns:minmax(0,1fr) 76px;align-items:center;gap:12px;padding:10px 12px;grid-column:auto;text-align:left;}
  #orderMatrix .q-level-head label {font-size:14px;}
  #orderMatrix .q-level-head input {width:76px;margin:0;}
  #orderMatrix .q-row {display:block;grid-column:auto;padding:0;background:var(--surface);border-top:1px solid var(--line);}
  #orderMatrix .q-mobile-row-toggle {display:grid;grid-template-columns:minmax(0,1fr) auto 20px;align-items:center;gap:10px;width:100%;min-height:68px;padding:12px;border:0;background:transparent;color:var(--text);text-align:left;font:inherit;cursor:pointer;}
  .q-mobile-type-title {min-width:0;font-size:16px;font-weight:600;line-height:1.4;overflow-wrap:anywhere;}
  .q-mobile-type-title small {display:block;margin-top:3px;color:var(--muted);font-size:13px;font-weight:400;}
  .q-mobile-row-count {white-space:nowrap;color:var(--muted);font-size:14px;font-variant-numeric:tabular-nums;}
  .q-expand-symbol {color:var(--brand);font-size:22px;text-align:center;}
  #orderMatrix .q-row-total {margin:0;padding:0 12px 12px;justify-content:space-between;flex-wrap:nowrap;font-size:14px;}
  #orderMatrix .q-row-total input {width:76px;}
  #orderMatrix .q-cell {display:grid;grid-template-columns:minmax(0,1fr) 76px;grid-template-rows:auto auto;column-gap:12px;row-gap:0;padding:10px 12px;border-left:0;border-top:1px solid var(--line-soft);background:var(--panel);align-items:center;}
  #orderMatrix .q-cell.mobile-collapsed {display:none;}
  #orderMatrix .q-cell.has-quantity {background:var(--brand-soft);}
  #orderMatrix .q-mobile-level {display:block;grid-column:1;grid-row:1;margin:0;color:var(--text);font-size:14px;font-weight:550;}
  #orderMatrix .q-cell>input {grid-column:2;grid-row:1/3;width:76px;min-height:48px;height:48px;font-size:18px;}
  #orderMatrix .q-cell-detail {grid-column:1;grid-row:2;min-width:0;}
  #orderMatrix .q-pack-actions {justify-content:flex-start;flex-wrap:wrap;gap:0 12px;}
  #orderMatrix .q-pack-actions .question-link {min-height:44px;padding:0;text-align:left;font-size:14px!important;}
  #orderMatrix .q-derived-count {font-size:13px;}
  #orderMatrix .no-generated-results {display:none;}
  #aiWorkspace {scroll-margin-top:72px;}
  .workspace-ai-heading {gap:8px;margin-bottom:12px;}
  .workspace-ai-heading .workspace-ai-actions {width:100%;margin-left:0;gap:16px;}
  .workspace-ai-heading .workspace-ai-actions .question-link {min-height:44px;}
  .ai-workspace .ai-model-grid {gap:12px;}
  .ai-workspace .ai-model-card {padding:12px;}
  .ai-workspace .model-card-head {flex-wrap:wrap;}
  .ai-workspace .model-card-head>label {font-size:16px;}
  .ai-workspace .review-switch {min-height:44px;}
  .ai-workspace .model-advanced>summary,.ai-workspace .image-advanced>summary {min-height:44px;display:flex;align-items:center;font-size:14px;}
  .ai-workspace .ai-tuning {grid-template-columns:1fr;gap:12px;}
  .ai-workspace .order-action {position:fixed;inset:auto 0 0;z-index:80;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin:0;padding:12px max(12px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));border-top:1px solid var(--line);background:var(--panel);box-shadow:0 -8px 24px #0003;max-height:40dvh;overflow:auto;}
  .ai-workspace .order-action-summary {min-width:0;}
  .ai-workspace #create {width:auto;min-width:128px;min-height:48px;padding:10px 14px;font-size:14px;}
  .ai-workspace #orderPlanSummary,.ai-workspace #orderValidation {font-size:14px;line-height:1.5;}
  #notice,#notice[data-error="true"] {bottom:calc(116px + env(safe-area-inset-bottom,0px));}
  .modal-body input:not([type="checkbox"]):not([type="file"]),.modal-body select,.modal-body textarea {font-size:16px;}
  .modal-body label {font-size:14px;}
  .modal-body .dialog-actions {flex-wrap:wrap;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));}
  .modal-body .dialog-actions .btn {min-height:44px;}
  .slot-review-list label {min-height:44px;}
}

@media(max-width:760px){
 .connection-key-heading>span{flex-basis:100%;}
 .connection-key-heading>[data-check-key],.connection-key-heading>[data-check-flows]{flex:1 1 160px;white-space:normal;}
 .capability-check-bar{flex-wrap:wrap;}
}

.role-probe-results {display:grid;gap:8px;margin:12px 0 16px;}
.role-probe-result {display:flex;align-items:baseline;justify-content:space-between;gap:8px 20px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px;}
.role-probe-result strong {font-size:14px;color:var(--muted);}
.role-probe-result[data-state="passed"] strong {color:var(--good,#67d9a7);}

/* Prices belong to each connection/model row. */
.model-pricing {grid-column:1/-1;min-width:0;padding-top:2px;}
.model-price-fields,.price-extra,.key-pricing-controls,.pricing-settings-line {display:flex;align-items:flex-end;gap:8px 12px;flex-wrap:wrap;}
.inline-price-field {display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);margin:0;min-width:0;}
.inline-price-field>span {white-space:normal;}
.model-pricing input,.model-pricing select {width:104px;min-height:36px;padding:7px 9px;font-size:13px;}
.model-pricing .price-mode select {width:114px;}
.model-pricing .price-discount input {width:125px;}
.model-pricing .btn {min-height:36px;padding:6px 10px;font-size:13px;}
.price-more {border:0;background:transparent;color:var(--muted);font-size:12px;padding:8px 0;cursor:pointer;}
.price-more:hover {color:var(--text);text-decoration:underline;}
.price-extra {margin-top:8px;}
.price-extra[hidden],.inline-price-field[hidden] {display:none;}
.price-row-status {display:block;margin-top:6px;color:var(--muted);font-size:12px;line-height:1.6;overflow-wrap:anywhere;}
.price-row-status a,.research-result a,.cost-settings a {color:inherit;text-decoration:underline;}
.key-pricing-controls {margin:14px 0;padding-bottom:14px;border-bottom:1px solid var(--line);align-items:center;}
.key-pricing-controls input {width:180px;min-height:38px;padding:8px 10px;}
.key-pricing-controls small {flex:1;min-width:200px;line-height:1.6;}
.pricing-settings-line input {width:200px;min-height:40px;}
.research-source {margin:16px 0;padding:12px;border:1px solid var(--line);border-radius:8px;}
.research-source label {display:grid;gap:6px;margin-top:12px;font-size:13px;}
.research-source input,.research-source textarea {width:100%;box-sizing:border-box;}
.research-fx {display:flex;gap:8px;align-items:center;margin:16px 0;}
.research-fx input,.research-price-choice>input {width:18px;height:18px;flex-shrink:0;}
.research-price-choice {display:flex;align-items:flex-start;gap:10px;margin:12px 0;padding-bottom:12px;border-bottom:1px solid var(--line);font-size:14px;}
.research-price-choice span {min-width:0;overflow-wrap:anywhere;}
.research-price-choice small {display:block;color:var(--muted);margin-top:6px;font-size:12px;line-height:1.6;}
.research-price-choice details {font-size:12px;margin-top:8px;}
.research-result h3 {font-size:16px;margin-top:20px;}
@media(max-width:560px) {.model-pricing {grid-row:5;}.model-price-fields {gap:10px;}.model-pricing input,.model-pricing select,.model-pricing .price-discount input {width:120px;}.model-test-details {grid-row:6;}.key-pricing-controls small {flex-basis:100%;}.pricing-settings-line {align-items:stretch;}.pricing-settings-line .btn {width:100%;}}

/* 2.22: role-specific selection and focused connection views */
.ai-selection-hint{margin:0 0 20px;line-height:1.6}
.ai-zones{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;align-items:start}
.ai-zone{min-width:0;border:1px solid var(--line);border-radius:14px;background:var(--bg)}
.ai-zone-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;border-bottom:1px solid var(--line)}
.ai-zone-heading h3{font-size:17px;margin:0}
.zone-models{padding:0 20px}
.zone-models .ai-model-card{padding:18px 0;margin:0;border:0;border-radius:0;background:none;min-width:0}
.zone-models .ai-model-card+.ai-model-card{border-top:1px solid var(--line)}
.zone-models .model-card-head{margin-bottom:10px}
.zone-models .model-card-head label{font-size:14px;font-weight:600}
.zone-models .model-advanced,.zone-models .image-advanced{border:0;margin:10px 0 0;padding:0}
.zone-models .model-advanced summary,.zone-models .image-advanced summary{font-size:12px}
.zone-models .model-capability,.zone-models #imagePairStatus{margin:8px 0 0;font-size:12px}
.zone-models .model-capability .capability-tag{font-size:12px;padding:2px 7px}
.connections-list-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:12px 0 20px}
.connections-list-heading h3{margin:0}
.connections-workspace .batch-check-settings{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin:16px 0 24px}
.connections-workspace .batch-check-settings h4{margin:0 0 12px;font-size:14px}
.connections-workspace .capability-check-bar{gap:10px}
.connections-workspace #capabilityBatchProgress{flex-basis:100%;margin:8px 0 0;font-size:13px;line-height:1.7}
.connections-workspace #imageCheckContext{font-size:12px;margin:8px 0 0}
.connections-workspace .connection-provider{padding:18px 20px;margin:0 0 16px;border-radius:12px}
.connections-workspace .connection-key-heading{padding:0 0 12px}
.connections-workspace .connection-management{margin-top:12px}
.connections-workspace .capability-result{padding:12px 0;grid-template-columns:minmax(150px,1fr) minmax(110px,.6fr) minmax(180px,1fr) auto;gap:12px}
.connections-workspace .key-pricing-controls{padding:12px 0;border-top:1px solid var(--line);margin:0 0 8px}
@media(max-width:1050px){.ai-zones{grid-template-columns:1fr}.connections-workspace .capability-result{grid-template-columns:1fr auto}.connections-workspace .ability-stage-tags{grid-column:1/-1}}
@media(max-width:600px){.ai-zone-heading{padding:16px}.zone-models{padding:0 16px}.connections-workspace .connection-provider{padding:16px 12px}.connection-view-switch{width:100%}.connection-view-switch .btn{flex:1}.connections-workspace .capability-result{grid-template-columns:1fr}.connections-list-heading{gap:12px}}

.batch-pricing-controls{border-top:1px solid var(--line);margin-top:16px;padding-top:16px}.batch-pricing-controls>label{font-size:14px;font-weight:600}.batch-pricing-line{display:flex;align-items:center;gap:12px;margin-top:8px}.batch-pricing-line select{max-width:550px;min-width:0;flex:1}.batch-pricing-line .btn{white-space:nowrap}.batch-pricing-controls p{margin:8px 0 0}@media(max-width:700px){.batch-pricing-line{align-items:stretch;flex-direction:column}.batch-pricing-line select{max-width:none;width:100%}}

/* 2.24: one capability tag and one four-column model list. */
.connections-workspace .model-table-heading,.connections-workspace .capability-result{display:grid;grid-template-columns:minmax(180px,1.1fr) 100px minmax(290px,1.6fr) 100px;gap:12px;align-items:center}
.connections-workspace .model-table-heading{padding:12px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted);font-weight:600}
.model-table-heading small{display:block;font-weight:400;font-size:11px;line-height:1.4;margin-top:3px}
.connections-workspace .capability-result{padding:12px 0}
.connections-workspace .ability-model-heading{grid-column:1;grid-row:1}
.connections-workspace .ability-model-title strong{font-size:14px;overflow-wrap:anywhere;line-height:1.45}
.connections-workspace .model-row-actions{justify-content:flex-start;margin-top:6px;gap:6px}
.connections-workspace .model-row-actions .btn{min-height:28px;padding:4px 7px;font-size:12px}
.connections-workspace .model-capabilities,.connections-workspace .image-model-status{grid-column:2;grid-row:1;display:block}
.connections-workspace .model-pricing{display:contents}
.connections-workspace .model-price-cell{grid-column:3;grid-row:1;min-width:0}
.connections-workspace .model-discount-cell{grid-column:4;grid-row:1;min-width:0;align-self:center}
.connections-workspace .model-price-fields{gap:5px 7px;align-items:flex-end}
.connections-workspace .model-pricing input{width:80px;min-height:32px;padding:5px 7px;font-size:12px}
.connections-workspace .model-pricing .price-discount input{width:88px}
.connections-workspace .model-pricing .btn{font-size:12px;min-height:32px;padding:5px 7px}
.connections-workspace .price-more{padding:5px;min-width:28px;min-height:32px;font-weight:bold}
.connections-workspace .price-extra{padding:10px;border:1px solid var(--line);border-radius:8px;margin-top:8px}
.connections-workspace .price-row-status{flex-basis:100%;margin:0}
.connections-workspace .price-discount>span{font-size:11px}
.connections-workspace .model-test-details{grid-column:1/-1;grid-row:auto}
.connections-workspace .connection-image-models h4{margin:18px 0 4px;font-size:13px;color:var(--muted)}
.ai-workspace .ai-selection-hint{font-size:12px;margin:0 0 12px}
.ai-workspace .ai-zones{grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:14px}
.ai-workspace .ai-zone-heading{padding:10px 12px}
.ai-workspace .ai-zone-heading h3{font-size:15px}
.ai-workspace .zone-models{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:12px}
.ai-workspace .ai-zone:last-child .zone-models{grid-template-columns:repeat(2,minmax(0,1fr))}
.ai-workspace .zone-models .ai-model-card{padding:0;border:0}
.ai-workspace .zone-models .model-card-head{margin-bottom:6px}
.ai-workspace .zone-models .model-card-head label{font-size:12px}
.ai-workspace .zone-models .model-capability,.ai-workspace .zone-models #imagePairStatus{display:none}
.ai-workspace .zone-models .model-advanced,.ai-workspace .zone-models .image-advanced{margin-top:6px}
.ai-workspace .zone-models .model-picker input{font-size:13px;min-height:38px}
.ai-workspace .order-action{margin-top:16px;padding-top:16px}
@media(max-width:1150px){.ai-workspace .ai-zones{grid-template-columns:1fr}.ai-workspace .ai-zone:last-child .zone-models{grid-template-columns:repeat(2,minmax(0,1fr))}.connections-workspace .model-table-heading,.connections-workspace .capability-result{grid-template-columns:minmax(155px,1fr) 88px minmax(245px,1.4fr) 90px;gap:10px}}
@media(max-width:900px){.connections-workspace .model-table-heading{display:none}.connections-workspace .capability-result{grid-template-columns:minmax(0,1fr) 105px;gap:12px}.connections-workspace .model-capabilities,.connections-workspace .image-model-status{grid-column:2;grid-row:1}.connections-workspace .model-price-cell{grid-column:1;grid-row:2}.connections-workspace .model-discount-cell{grid-column:2;grid-row:2}.connections-workspace .model-price-cell:before{content:'Giá · USD';display:block;font-size:12px;color:var(--muted);margin-bottom:6px}.connections-workspace .model-test-details{grid-row:3}}
@media(max-width:560px){.ai-workspace .zone-models,.ai-workspace .ai-zone:last-child .zone-models{grid-template-columns:1fr;gap:12px}.ai-workspace .zone-models .ai-model-card{display:grid;grid-template-columns:96px minmax(0,1fr);gap:4px 8px;align-items:center}.ai-workspace .zone-models .model-card-head{grid-column:1;grid-row:1;margin:0}.ai-workspace .zone-models .field,.ai-workspace .zone-models #imageSettingsBody{grid-column:2;margin:0}.ai-workspace .zone-models .model-advanced{grid-column:2}.ai-workspace .zone-models .model-card-head label{font-size:13px}.ai-workspace .zone-models .model-advanced>summary,.ai-workspace .zone-models .image-advanced>summary{min-height:28px;font-size:12px}.connections-workspace .model-pricing input{font-size:16px;min-height:38px}.connections-workspace .model-price-fields{gap:8px}.connections-workspace .model-row-actions .btn{min-height:36px}}

/* A prompt section is one API-call case, including its attached instructions. */
.prompt-call {padding:0;overflow:hidden}
.prompt-call>summary {display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none;cursor:pointer;padding:20px;min-height:64px}
.prompt-call>summary::-webkit-details-marker {display:none}
.prompt-call-title {font-size:16px;font-weight:650}
.prompt-call-download {flex-shrink:0;white-space:nowrap}
.prompt-call[open]>summary {border-bottom:1px solid var(--line)}
.prompt-call-body {padding:20px}
.prompt-call-controls {display:flex;gap:20px;align-items:end;flex-wrap:wrap;margin-bottom:20px}
.prompt-call-controls label {display:grid;gap:8px;font-size:14px}
.prompt-call-controls select {min-width:220px}
.prompt-call-heading {display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0}
.prompt-call-body .prompt-call-heading h4 {margin:0}
.prompt-case-editor {display:grid;gap:24px}
.prompt-case-editor label {display:block;margin-bottom:8px}
.prompt-case-editor .compact-note {margin:0 0 8px}
.prompt-call-controls .prompt-equation-toggle {display:flex;align-items:center;gap:8px;min-height:42px}
.prompt-call-body h4 {font-size:16px;margin:24px 0 12px}
.prompt-call-body h4:first-of-type {margin-top:12px}
.prompt-call-files {display:grid;gap:6px;font-size:14px;line-height:1.6;padding-left:20px}
.prompt-call-extra {margin:16px 0}
.prompt-call-extra p {margin-bottom:8px;font-size:14px}
.prompt-call-extra p span {display:block;margin-top:4px}
.prompt-call-note {margin-top:20px;line-height:1.6}
@media(max-width:600px){.prompt-call>summary,.prompt-call-body{padding:16px}.prompt-call>summary{align-items:flex-start}.prompt-call-controls{gap:12px}}

/* 2.36: compact connection controls and direct order actions. */
.connections-workspace .connection-filters{grid-template-columns:minmax(220px,1fr) minmax(150px,200px) minmax(160px,210px) auto;align-items:center}
.connections-workspace .connection-filters input,.connections-workspace .connection-filters select,.connections-workspace #toggleAddConnection{min-height:44px}
.connections-workspace #toggleAddConnection{white-space:nowrap;padding:10px 16px}
.connections-workspace .add-connection-form{margin:16px 0;padding:0 16px 16px;border:1px solid var(--line);border-radius:12px}
.connections-workspace .batch-check-settings .capability-check-bar{margin-top:0;align-items:center}
.connections-workspace .batch-pricing-controls{display:contents}
.connections-workspace #batchPricingResearcher{flex:1 1 240px;min-width:200px;max-width:380px;min-height:44px}
.connections-workspace #collectAllPricesAuto{white-space:nowrap}
.connections-workspace #batchPricingStatus{flex-basis:100%;margin:8px 0 0}
.connections-workspace .connection-key-actions{align-items:flex-end}
.connections-workspace .connection-key-actions .key-pricing-controls{margin:0;padding:0;border:0;flex:none}
.connections-workspace .connection-key-actions .key-pricing-controls input{width:104px;min-height:44px}
.connections-workspace .connection-key-actions .key-pricing-controls label>span{font-size:13px}
#promptsPage .config-prompts>.prompt-actions{justify-content:flex-end}
#orderPlanSummary:empty{display:none}
@media(max-width:1000px){
 .connections-workspace .connection-filters{grid-template-columns:minmax(0,1fr) auto}
 .connections-workspace .connection-filters input{grid-column:1}
 .connections-workspace #toggleAddConnection{grid-column:2;grid-row:1}
 .connections-workspace .connection-filters select{grid-row:2}
 .connections-workspace .connection-key-actions{width:100%;justify-content:flex-start}
}
@media(max-width:600px){
 .connections-workspace .connection-filters{grid-template-columns:repeat(12,minmax(0,1fr));gap:8px}
 .connections-workspace .connection-filters input{grid-column:1/span 7}
 .connections-workspace #toggleAddConnection{grid-column:8/span 5;padding:10px 8px}
 .connections-workspace .connection-filters select{grid-column:1/span 6;min-width:0;width:100%}
 .connections-workspace #connectionState{grid-column:7/span 6}
 .connections-workspace #batchPricingResearcher{max-width:none;flex-basis:100%;width:100%}
 .connections-workspace #collectAllPricesAuto{white-space:normal}
 .connections-workspace .connection-key-actions .key-pricing-controls{flex:1 1 100%;}
 .connections-workspace .connection-key-actions .key-pricing-controls input{width:120px}
}

/* One compact entry to sample details and allocation in each matrix cell. */
#orderMatrix .q-cell-detail {
  display: grid;
  align-content: center;
  gap: 2px;
  margin: 0;
  text-align: left;
}
#orderMatrix .q-pack-actions {
  justify-content: flex-start;
  gap: 0;
}
#orderMatrix .q-pack-actions .sample-management {
  min-height: 28px;
  padding: 0;
  line-height: 1.5;
  text-align: left;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 600;
}
#orderMatrix .q-derived-count {
  line-height: 1.5;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}
@media (min-width:761px) {
  #orderMatrix .q-cell {
    display: grid;
    grid-template-columns: 4rem minmax(0,max-content);
    justify-content: center;
    align-items: center;
    min-height: 86px;
    padding: 12px;
    gap: 14px;
  }
  #orderMatrix .q-cell>input {
    width: 4rem;
    min-width: 0;
    height: 44px;
    min-height: 44px;
    margin: 0;
    padding: 6px;
    font-size: 18px;
    font-weight: 600;
  }
}
@media (min-width:761px) and (max-width:1100px) {
  #orderMatrix .q-cell {
    padding: 10px 8px;
    gap: 10px;
  }
}
@media (min-width:761px) and (max-width:980px) {
  #orderMatrix .q-cell {
    grid-template-columns: minmax(0,1fr);
    justify-items: center;
    gap: 8px;
  }
  #orderMatrix .q-cell-detail {
    text-align: center;
  }
  #orderMatrix .q-pack-actions {
    justify-content: center;
  }
  #orderMatrix .q-pack-actions .sample-management {
    text-align: center;
  }
}
@media (max-width:760px) {
  #orderMatrix .q-mobile-level {
    text-align: left;
  }
  #orderMatrix .q-cell>input {
    width: 4rem;
    justify-self: end;
  }
  #orderMatrix .q-pack-actions .sample-management {
    min-height: 44px;
  }
  #orderMatrix .no-generated-results {
    display: block;
  }
}

/* 2.47: keep each model's controls on one line and align allocation rows. */
#ordersBody .order-role-model {min-width:130px;line-height:1.5;overflow-wrap:anywhere;}
#ordersBody .order-role-model+.order-role-model {margin-top:12px;padding-top:10px;border-top:1px solid var(--line);}
#ordersBody .order-role-model .order-reference {display:block;margin:2px 0;font-size:13px;}
.connections-workspace .model-table-heading,
.connections-workspace .capability-result,
.connections-workspace .capability-result[data-model-kind="image"] {
  grid-template-columns:minmax(160px,1fr) 172px 112px minmax(400px,2.3fr);
  gap:10px;
}
.connections-workspace .capability-result {padding:8px 0;}
.connections-workspace .ability-model-heading {display:flex;align-items:center;justify-content:center;gap:10px;text-align:center;}
.connections-workspace .ability-model-title {min-width:0;flex:1;text-align:left;}
.connections-workspace .ability-model-title strong {font-size:14px;line-height:1.5;}
.connections-workspace .model-row-actions {flex:none;flex-wrap:nowrap;margin:0;gap:5px;}
.connections-workspace .model-row-actions .btn {font-size:14px;line-height:1.4;min-height:32px;padding:5px 6px;white-space:nowrap;}
/* 2.48: center each column and keep the price action with its inputs. */
.connections-workspace .model-table-heading>span {text-align:center;}
.connections-workspace .model-table-heading>span:first-child {text-align:left;}
.connections-workspace .model-table-heading>span:last-child {display:flex;align-items:baseline;justify-content:center;gap:6px;flex-wrap:wrap;}
.connections-workspace .model-table-heading small {display:inline;margin:0;font-size:12px;}
.connections-workspace .model-capabilities,
.connections-workspace .image-model-status {display:flex;align-items:center;justify-content:center;}
.connections-workspace .model-price-fields {align-items:center;justify-content:center;gap:6px 10px;}
.connections-workspace .model-price-fields .btn {font-size:14px;line-height:1.4;min-height:32px;padding:5px 6px;white-space:nowrap;}
.connections-workspace .model-discount-cell {display:flex;justify-content:center;}
.connections-workspace .model-price-cell .inline-price-field {flex-direction:row;align-items:center;gap:6px;font-size:14px;}
.connections-workspace .model-price-cell .inline-price-field>span {white-space:nowrap;}
.connections-workspace .model-pricing input {box-sizing:border-box;font-size:14px;width:calc(3ch + 22px);min-width:0;padding:5px 8px;font-variant-numeric:tabular-nums;text-align:center;appearance:textfield;}
.connections-workspace .model-pricing input::-webkit-inner-spin-button,
.connections-workspace .model-pricing input::-webkit-outer-spin-button {appearance:none;margin:0;}
.connections-workspace .model-pricing .price-discount,
.connections-workspace .key-pricing-controls .price-discount {flex-direction:row;align-items:center;gap:5px;}
.connections-workspace .model-pricing .price-discount input,
.connections-workspace .connection-key-actions .key-pricing-controls input {
  box-sizing:border-box;
  width:calc(3ch + 20px);
  min-width:0;
  padding:5px 8px;
  font-size:14px;
  font-variant-numeric:tabular-nums;
  text-align:center;
  appearance:textfield;
}
.connections-workspace .price-discount input::-webkit-inner-spin-button,
.connections-workspace .price-discount input::-webkit-outer-spin-button {appearance:none;margin:0;}
.connections-workspace .price-discount>span {font-size:14px;}
.connections-workspace .model-discount-cell:before {content:none;}
.connections-workspace .connection-key-actions {align-items:center;}
@media(max-width:1200px) {
  .connections-workspace .model-table-heading {display:none;}
  .connections-workspace .capability-result,
  .connections-workspace .capability-result[data-model-kind="image"] {grid-template-columns:minmax(0,1fr) 88px 62px;gap:8px 10px;}
  .connections-workspace .ability-model-heading {grid-column:1/-1;grid-row:1;}
  .connections-workspace .model-price-cell {grid-column:1;grid-row:2;}
  .connections-workspace .model-capabilities,.connections-workspace .image-model-status {grid-column:2;grid-row:2;}
  .connections-workspace .model-discount-cell {grid-column:3;grid-row:2;}
  .connections-workspace .model-price-cell:before {content:none;}
  .connections-workspace .model-test-details {grid-row:auto;}
}
@media(max-width:600px) {
  .connections-workspace .capability-result,
  .connections-workspace .capability-result[data-model-kind="image"] {grid-template-columns:minmax(0,1fr) 62px;padding:10px 0;}
  .connections-workspace .ability-model-heading {flex-wrap:wrap;}
  .connections-workspace .ability-model-title {flex-basis:100%;}
  .connections-workspace .model-row-actions {flex-wrap:wrap;}
  .connections-workspace .model-row-actions .btn {min-height:36px;}
  .connections-workspace .model-capabilities,.connections-workspace .image-model-status {grid-column:1;grid-row:2;}
  .connections-workspace .model-discount-cell {grid-column:2;grid-row:2;}
  .connections-workspace .model-price-cell {grid-column:1/-1;grid-row:3;}
  .connections-workspace .model-pricing input,.connections-workspace .connection-key-actions .key-pricing-controls input {font-size:16px;min-height:38px;}
}

/* 2.50: compact quantity fields with aligned controls in the matrix and sample details. */
.quantity-toolbar #totalQuantity {width:88px;text-align:center;}
.cell-editor .cell-quantity-input {box-sizing:border-box;width:56px;flex-basis:56px;text-align:center;}
@media(min-width:761px) {
  .cell-pack-row {grid-template-columns:minmax(0,1fr) 114px 168px 82px 44px;gap:12px;}
  #orderMatrix .q-cell {grid-template-columns:56px minmax(0,max-content);gap:12px;}
  #orderMatrix .q-cell>input {width:56px;}
}
@media(min-width:761px) and (max-width:980px) {#orderMatrix .q-cell {grid-template-columns:minmax(0,1fr);gap:8px;}}

/* 2.64: shared key intake, explicit checks, and one VND pricing column. */
.connections-workspace .connection-filters {grid-template-columns:minmax(280px,1fr) minmax(170px,210px) minmax(180px,220px);gap:12px;}
.connections-workspace .connection-filters input,.connections-workspace .connection-filters select {grid-column:auto;grid-row:auto;width:100%;min-width:0;}
.connections-summary {display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:16px 0 20px;font-size:14px;color:var(--muted);}
.connection-counts {display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;}
.connection-counts strong {font-size:14px;font-weight:600;color:var(--text);}
.connection-fx-note {font-size:13px;line-height:1.5;}
.connection-fx-note a {color:inherit;text-decoration:underline;text-underline-offset:3px;}
.connections-workspace .model-table-heading,.connections-workspace .capability-result,.connections-workspace .capability-result[data-model-kind="image"] {grid-template-columns:minmax(160px,1fr) 172px 112px minmax(400px,2.3fr);gap:12px;}
.connections-workspace .model-table-heading {display:grid;font-size:14px;}
.connections-workspace .ability-model-heading {grid-column:1;grid-row:1;display:block;text-align:left;}
.connections-workspace .model-row-actions {grid-column:2;grid-row:1;display:flex;align-items:center;justify-content:center;margin:0;gap:6px;flex-wrap:wrap;}
.connections-workspace .model-capabilities,.connections-workspace .image-model-status {grid-column:3;grid-row:1;}
.connections-workspace .model-price-cell {grid-column:4;grid-row:1;}
.connections-workspace .model-price-fields {justify-content:flex-start;gap:8px 10px;}
.connections-workspace .model-pricing input {width:94px;text-align:right;min-height:36px;}
.connections-workspace .model-pricing .price-discount input {width:52px;text-align:center;}
.connections-workspace .model-price-fields .price-discount {margin-left:auto;}
.connections-workspace .model-price-cell:before {content:none;}
.connections-workspace .model-test-details {grid-column:1/-1;grid-row:auto;}
.new-connection-form {max-width:620px;margin:0 auto;padding:4px 0 8px;}
.new-connection-form .dialog-actions {margin-top:24px;}
@media(min-width:1500px){.connections-workspace .model-table-heading,.connections-workspace .capability-result,.connections-workspace .capability-result[data-model-kind="image"] {grid-template-columns:minmax(180px,1.15fr) 184px 136px minmax(500px,2.3fr);gap:18px;}}
@media(max-width:1100px){
 .connections-workspace .model-table-heading {display:none;}
 .connections-workspace .capability-result,.connections-workspace .capability-result[data-model-kind="image"] {grid-template-columns:minmax(0,1fr) 172px 112px;gap:12px;}
 .connections-workspace .ability-model-heading {grid-column:1;grid-row:1;}
 .connections-workspace .model-row-actions {grid-column:2;grid-row:1;}
 .connections-workspace .model-capabilities,.connections-workspace .image-model-status {grid-column:3;grid-row:1;}
 .connections-workspace .model-price-cell {grid-column:1/-1;grid-row:2;}
 .connections-workspace .model-price-cell:before {content:'Giá · VNĐ / 1 triệu token';display:block;margin-bottom:8px;font-size:13px;color:var(--muted);}
 .connections-workspace [data-model-kind="image"] .model-price-cell:before {content:'Giá · VNĐ';}
}
@media(max-width:760px){
 .connections-workspace .connection-filters {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
 .connections-workspace .connection-filters input {grid-column:1/-1;}
 .connections-summary {align-items:flex-start;gap:8px;}
 .connection-fx-note {flex-basis:100%;}
 .connections-workspace .connection-key-actions .key-pricing-controls {flex:0 0 auto;}
 .connections-workspace .capability-result,.connections-workspace .capability-result[data-model-kind="image"] {grid-template-columns:minmax(0,1fr) 172px;}
 .connections-workspace .model-capabilities,.connections-workspace .image-model-status {grid-column:1;grid-row:2;justify-content:flex-start;}
 .connections-workspace .model-row-actions {grid-column:2;grid-row:1/span 2;justify-content:flex-end;}
 .connections-workspace .model-price-cell {grid-row:3;}
 .connections-workspace .model-price-fields .price-discount {margin-left:0;}
 .connections-workspace .model-pricing input {font-size:16px;min-height:38px;}
}
@media(max-width:440px){
 .connections-workspace .capability-result,.connections-workspace .capability-result[data-model-kind="image"] {grid-template-columns:minmax(0,1fr) 145px;gap:10px;}
 .connections-workspace .model-row-actions .btn {font-size:13px;padding:5px;}
 .connections-workspace .model-price-fields {gap:10px 8px;}
 .connections-workspace .model-price-fields .price-discount {flex-basis:100%;}
 .connection-counts {gap:12px;}
}
.connections-workspace .connection-filters #connectionModelSearch,
.connections-workspace .connection-filters #connectionProvider,
.connections-workspace .connection-filters #connectionState {grid-column:auto;grid-row:auto;}
@media(max-width:900px){
 .connections-workspace .connection-filters {grid-template-columns:repeat(2,minmax(0,1fr));}
 .connections-workspace .connection-filters #connectionModelSearch {grid-column:1/-1;grid-row:1;}
 .connections-workspace .connection-filters #connectionProvider {grid-column:1;grid-row:2;}
 .connections-workspace .connection-filters #connectionState {grid-column:2;grid-row:2;}
}