:root {
  color-scheme: light;
  --bg: #eef3f8;
  --panel: rgba(255, 255, 255, 0.92);
  --panel-solid: #ffffff;
  --panel-soft: #edf7fb;
  --panel-tint: #f6fbff;
  --line: #d4e1ea;
  --line-strong: #c6d0df;
  --text: #0f172a;
  --muted: #64748b;
  --accent: #4f5bd5;
  --accent-dark: #30378f;
  --accent-soft: #dfe4ff;
  --aqua: #14a098;
  --aqua-soft: #e2f8ee;
  --warn: #9a5a12;
  --danger: #b73d3d;
  --blue: #2563eb;
  --radius-card: 16px;
  --radius-control: 12px;
  --shadow: 0 14px 30px rgba(37, 99, 111, 0.055), 0 4px 10px rgba(37, 99, 111, 0.035);
  --shadow-soft: 0 10px 24px rgba(37, 99, 111, 0.045), 0 2px 6px rgba(37, 99, 111, 0.03);
}

.competitor-workbench {
  background: #fff;
  border: 1px solid #d9e2ec;
  color: #172033;
  min-height: calc(100vh - 118px);
}

.competitor-local-header {
  align-items: center;
  border-bottom: 1px solid #d9e2ec;
  display: flex;
  height: 48px;
  justify-content: space-between;
  padding: 0 12px;
}

.competitor-local-header nav,
.competitor-local-header > div,
.competitor-detail-bar,
.competitor-chart-head,
.competitor-legend,
.competitor-settings > div {
  align-items: center;
  display: flex;
  gap: 8px;
}

.competitor-local-header button,
.competitor-detail-bar button,
.competitor-settings button {
  background: transparent;
  border: 0;
  color: #536174;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  height: 32px;
  padding: 0 8px;
}

.competitor-local-header nav button.active,
.competitor-detail-bar button.active {
  border-bottom: 2px solid #2563eb;
  color: #1d4ed8;
  font-weight: 700;
}

.competitor-icon-button {
  background: #fff;
  border: 1px solid #bdcad8;
  border-radius: 4px;
  color: #1f3b59;
  cursor: pointer;
  height: 28px;
  min-width: 28px;
  padding: 0 6px;
}

.competitor-local-header input,
.competitor-detail select,
.competitor-settings input,
.competitor-settings select,
.competitor-table select {
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  color: #243247;
  font: inherit;
  font-size: 12px;
  height: 28px;
  max-width: 240px;
  padding: 3px 7px;
}

.competitor-product-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); min-height: calc(100vh - 168px); }
.competitor-rail { background: #f8fafc; border-right: 1px solid #d9e2ec; padding: 8px; }
.competitor-rail > label { color: #64748b; display: none; font-size: 11px; }
.competitor-rail select { margin-top: 3px; width: 100%; }
.competitor-rail-list { display: grid; gap: 3px; }
.competitor-rail-list button { background: transparent; border: 1px solid transparent; border-radius: 4px; color: #334155; cursor: pointer; display: grid; gap: 3px; min-height: 48px; padding: 7px; text-align: left; }
.competitor-rail-list button:hover, .competitor-rail-list button.active { background: #eaf2ff; border-color: #b8d2fb; }
.competitor-rail-list strong { font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.competitor-rail-list span { color: #718096; font-size: 11px; }
.competitor-detail { min-width: 0; padding: 10px 12px 12px; }
.competitor-detail-bar { justify-content: space-between; min-height: 34px; }
.competitor-detail-bar > div:first-child { display: grid; gap: 2px; min-width: 0; }
.competitor-detail-bar strong { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.competitor-detail-bar span { color: #718096; font-size: 11px; }
.competitor-metric-tabs { display: flex; flex-wrap: wrap; gap: 2px; }
.competitor-chart-wrap { border: 1px solid #d9e2ec; margin-top: 8px; padding: 8px 10px 4px; }
.competitor-chart-head { justify-content: space-between; min-height: 24px; }
.competitor-legend { color: #52647a; flex-wrap: wrap; font-size: 11px; }
.competitor-legend span { align-items: center; display: inline-flex; gap: 4px; }
.competitor-legend i { border-top: 2px solid #2563eb; display: inline-block; width: 18px; }
.competitor-legend i.estimated { border-top-style: dashed; }
.competitor-chart { display: block; height: 245px; overflow: visible; width: 100%; }
.competitor-chart text { fill: #77869a; font-size: 10px; }
.competitor-chart-axis { stroke: #dce5ed; stroke-width: 1; }
.competitor-chart-line { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.4; }
.competitor-chart-line.estimated { stroke-dasharray: 7 5; }
.competitor-chart-empty, .competitor-empty { align-items: center; color: #758398; display: flex; font-size: 13px; justify-content: center; min-height: 160px; padding: 12px; text-align: center; }
.competitor-facts { border: 1px solid #d9e2ec; border-top: 0; display: grid; grid-template-columns: repeat(4, 1fr); }
.competitor-facts span { border-right: 1px solid #d9e2ec; color: #68788d; font-size: 11px; padding: 7px 9px; }
.competitor-facts span:last-child { border-right: 0; }
.competitor-facts b { color: #1e293b; display: block; font-size: 14px; margin-top: 2px; }
.competitor-table-scroll { margin-top: 8px; overflow: auto; }
.competitor-table { border-collapse: collapse; font-size: 12px; min-width: 780px; width: 100%; }
.competitor-table th { background: #f8fafc; color: #536174; font-size: 11px; font-weight: 700; text-align: left; }
.competitor-table td, .competitor-table th { border: 1px solid #d9e2ec; line-height: 16px; padding: 5px 7px; vertical-align: middle; }
.competitor-table td:first-child, .competitor-table th:first-child { min-width: 220px; }
.competitor-table a { color: #1d4ed8; text-decoration: none; }
.competitor-series-toggle { align-items: center; cursor: pointer; display: flex; gap: 6px; min-width: 0; }
.competitor-series-toggle input { margin: 0; }
.competitor-series-toggle i { border-radius: 50%; height: 8px; min-width: 8px; }
.competitor-series-toggle span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.competitor-runs { padding: 10px 12px; }
.competitor-settings { border: 1px solid #d9e2ec; font-size: 12px; padding: 0 10px 8px; }
.competitor-settings summary { cursor: pointer; font-weight: 700; padding: 8px 0; }
.competitor-settings > div { flex-wrap: wrap; }
.competitor-settings label { align-items: center; display: inline-flex; gap: 5px; color: #52647a; }
.competitor-switch input { accent-color: #2563eb; }
.competitor-binding-picker { display: grid; gap: 4px; min-width: 180px; }
.competitor-binding-picker input, .competitor-binding-picker select { max-width: none; width: 100%; }
.competitor-freshness-error { color: #b42318; font-size: 11px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 900px) {
  .competitor-workbench { border-left: 0; border-right: 0; min-height: calc(100vh - 96px); }
  .competitor-local-header { overflow: hidden; padding: 0 8px; }
  .competitor-local-header nav { min-width: 0; overflow-x: auto; }
  .competitor-local-header nav button { flex: 0 0 auto; }
  .competitor-local-header input { display: none; }
  .competitor-freshness-error { display: none; }
  .competitor-product-layout { display: block; }
  .competitor-rail { border-bottom: 1px solid #d9e2ec; border-right: 0; padding: 6px 10px; }
  .competitor-rail > label { display: grid; }
  .competitor-rail-list { display: none; }
  .competitor-detail { padding: 8px; }
  .competitor-detail-bar { align-items: flex-start; flex-direction: column; }
  .competitor-chart { height: 190px; }
  .competitor-facts { grid-template-columns: repeat(2, 1fr); }
  .competitor-facts span:nth-child(2) { border-right: 0; }
  .competitor-facts span:nth-child(-n + 2) { border-bottom: 1px solid #d9e2ec; }
  .competitor-table th:first-child, .competitor-table td:first-child { background: #fff; left: 0; position: sticky; z-index: 1; }
  .competitor-table th:first-child { background: #f8fafc; z-index: 2; }
}

/* AI model playground: task-first request rail and evidence workspace. */
.ai-hub-debug-title-meta {
  align-items: center;
  display: flex;
  gap: 8px;
}

.ai-hub-debug-title-meta span {
  background: #f8fafc;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  padding: 8px 10px;
}

.ai-hub-debug-title-meta strong {
  color: #172033;
  font-size: 15px;
}

.ai-hub-debug-layout {
  align-items: stretch;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(410px, 460px) minmax(0, 1fr);
  min-height: clamp(460px, calc(100vh - 260px), 820px);
  min-width: 0;
}

.ai-hub-debug-request,
.ai-hub-debug-output {
  min-width: 0;
}

.ai-hub-debug-request {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: clamp(460px, calc(100vh - 260px), 820px);
  overflow: auto;
  padding: 14px;
}

.ai-hub-debug-output {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 100%;
  padding: 14px;
}

.ai-hub-debug-step {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.ai-hub-debug-step + .ai-hub-debug-step {
  border-top: 1px solid #e2e8f0;
  padding-top: 14px;
}

.ai-hub-debug-step-head {
  align-items: flex-start;
  display: flex;
  gap: 10px;
}

.ai-hub-debug-step-head > span {
  align-items: center;
  background: #eef3ff;
  border: 1px solid #cddbf9;
  border-radius: 7px;
  color: #3158d6;
  display: inline-flex;
  flex: 0 0 28px;
  font-size: 12px;
  font-weight: 900;
  height: 28px;
  justify-content: center;
}

.ai-hub-debug-step-head h2,
.ai-hub-debug-step-head p {
  margin: 0;
}

.ai-hub-debug-step-head h2 {
  color: #172033;
  font-size: 15px;
}

.ai-hub-debug-step-head p {
  color: #718096;
  font-size: 11px;
  line-height: 1.5;
  margin-top: 2px;
}

.ai-hub-debug-request label,
.ai-hub-debug-model-picker,
.ai-hub-debug-advanced-body {
  color: #334155;
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  min-width: 0;
}

.ai-hub-debug-request input,
.ai-hub-debug-request select,
.ai-hub-debug-request textarea {
  background: #fff;
  border: 1px solid #cbd8e7;
  border-radius: 8px;
  box-sizing: border-box;
  color: #172033;
  font: inherit;
  min-height: 40px;
  min-width: 0;
  outline: none;
  padding: 8px 10px;
  transition: border-color 140ms ease, box-shadow 140ms ease;
  width: 100%;
}

.ai-hub-debug-request input:focus,
.ai-hub-debug-request select:focus,
.ai-hub-debug-request textarea:focus {
  border-color: #4b68df;
  box-shadow: 0 0 0 3px rgba(75, 104, 223, 0.14);
}

.ai-hub-debug-request textarea {
  line-height: 1.5;
  min-height: 88px;
  resize: vertical;
}

.ai-hub-debug-input-label textarea {
  min-height: 96px;
}

.ai-hub-debug-parameter-grid {
  display: grid;
  gap: 9px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ai-hub-debug-model-picker {
  border: 0;
  margin: 0;
  padding: 0;
}

.ai-hub-debug-add-model {
  align-items: end;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.ai-hub-debug-add-model button,
.ai-hub-debug-model-chips button,
.ai-hub-debug-result button {
  background: #fff;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  color: #3158d6;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  min-height: 36px;
  padding: 6px 10px;
  transition: transform 140ms cubic-bezier(0.23, 1, 0.32, 1), border-color 140ms ease, background-color 140ms ease;
}

.ai-hub-debug-add-model button:active,
.ai-hub-debug-model-chips button:active,
.ai-hub-debug-result button:active,
.ai-hub-debug-run-action .primary:active {
  transform: scale(0.98);
}

.ai-hub-debug-add-model button:disabled,
.ai-hub-debug-model-chips button:disabled,
.ai-hub-debug-result button:disabled {
  color: #94a3b8;
  cursor: not-allowed;
  transform: none;
}

.ai-hub-debug-model-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.ai-hub-debug-model-chips > span {
  align-items: center;
  background: #eef3ff;
  border: 1px solid #cddbf9;
  border-radius: 8px;
  color: #26416f;
  display: inline-flex;
  font-size: 11px;
  gap: 7px;
  max-width: 100%;
  overflow-wrap: anywhere;
  padding: 5px 6px 5px 9px;
}

.ai-hub-debug-model-chips button {
  background: transparent;
  border: 0;
  color: #5b6f8d;
  min-height: 24px;
  padding: 2px 4px;
}

.ai-hub-debug-model-chips em {
  color: #718096;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
}

.ai-hub-debug-advanced {
  border: 1px solid #dbe5f0;
  border-radius: 9px;
  flex: 0 0 auto;
  overflow: hidden;
}

.ai-hub-debug-advanced > button {
  align-items: center;
  background: #f8fafc;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: flex;
  font: inherit;
  justify-content: space-between;
  min-height: 44px;
  padding: 8px 11px;
  text-align: left;
  width: 100%;
}

.ai-hub-debug-advanced > button span {
  display: grid;
  gap: 2px;
}

.ai-hub-debug-advanced > button strong {
  color: #25344a;
  font-size: 12px;
}

.ai-hub-debug-advanced > button em {
  color: #718096;
  font-size: 10px;
  font-style: normal;
}

.ai-hub-debug-advanced > button b {
  color: #64748b;
  font-size: 13px;
  transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1);
}

.ai-hub-debug-advanced > button[aria-expanded="true"] b {
  transform: rotate(180deg);
}

.ai-hub-debug-advanced-body {
  border-top: 1px solid #e2e8f0;
  padding: 11px;
}

.ai-hub-debug-error {
  background: #fff4f2;
  border: 1px solid #f0c5bf;
  border-radius: 8px;
  color: #a13e33;
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
  padding: 9px 10px;
}

.ai-hub-debug-run-action {
  align-items: center;
  background: #fff;
  border-top: 1px solid #dbe5f0;
  bottom: 0;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
  margin: auto -14px -14px;
  padding: 12px 14px;
  position: sticky;
  z-index: 2;
}

.ai-hub-debug-run-action > span {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.ai-hub-debug-run-action .primary {
  background: #3158d6;
  border: 1px solid #3158d6;
  border-radius: 8px;
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  min-height: 42px;
  min-width: 156px;
  padding: 8px 14px;
  transition: transform 140ms cubic-bezier(0.23, 1, 0.32, 1), background-color 140ms ease;
}

.ai-hub-debug-run-action .primary:disabled {
  background: #94a3b8;
  border-color: #94a3b8;
  cursor: not-allowed;
  transform: none;
}

.ai-hub-debug-results {
  align-content: start;
  display: grid;
  flex: 1 1 auto;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  min-height: 0;
}

.ai-hub-debug-empty {
  align-content: center;
  background: #fbfcfe;
  border: 1px dashed #cbd8e7;
  border-radius: 10px;
  display: grid;
  gap: 24px;
  grid-column: 1 / -1;
  grid-template-columns: minmax(220px, 0.8fr) minmax(300px, 1.2fr);
  min-height: 100%;
  padding: clamp(20px, 4vw, 48px);
}

.ai-hub-debug-empty h3,
.ai-hub-debug-empty p {
  margin: 0;
}

.ai-hub-debug-empty h3 {
  color: #172033;
  font-size: 20px;
  margin-top: 10px;
}

.ai-hub-debug-empty p {
  color: #64748b;
  font-size: 12px;
  line-height: 1.65;
  margin-top: 6px;
  max-width: 360px;
}

.ai-hub-debug-empty-mark {
  color: #3158d6;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.ai-hub-debug-empty ol {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ai-hub-debug-empty li {
  align-items: center;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 9px;
  display: grid;
  gap: 3px 9px;
  grid-template-columns: 26px minmax(0, 1fr);
  padding: 9px 10px;
}

.ai-hub-debug-empty li > span {
  align-items: center;
  background: #eef3ff;
  border-radius: 7px;
  color: #3158d6;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  grid-row: 1 / span 2;
  height: 26px;
  justify-content: center;
}

.ai-hub-debug-empty li strong {
  color: #25344a;
  font-size: 12px;
}

.ai-hub-debug-empty li em {
  color: #718096;
  font-size: 10px;
  font-style: normal;
}

.ai-hub-debug-result {
  align-content: start;
  background: #fff;
  border: 1px solid #dbe5f0;
  border-left: 4px solid #49a078;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 14px;
}

.ai-hub-debug-result.pending {
  border-left-color: #d59a28;
}

.ai-hub-debug-result.failed {
  border-left-color: #d65b4a;
}

.ai-hub-debug-result header,
.ai-hub-debug-result footer {
  align-items: center;
  display: flex;
  gap: 9px;
  justify-content: space-between;
  min-width: 0;
}

.ai-hub-debug-result header > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.ai-hub-debug-result strong {
  color: #25344a;
  font-size: 14px;
  overflow-wrap: anywhere;
}

.ai-hub-debug-result header span:not(.ai-hub-status),
.ai-hub-debug-pending,
.ai-hub-debug-result-error {
  color: #718096;
  font-size: 12px;
  line-height: 1.5;
  margin: 0;
}

.ai-hub-debug-result-error {
  color: #a13e33;
}

.ai-hub-debug-result pre {
  background: #101827;
  border-radius: 8px;
  color: #dbeafe;
  font: 12px/1.55 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  margin: 0;
  max-height: 360px;
  overflow: auto;
  padding: 11px;
  white-space: pre-wrap;
  word-break: break-word;
}

.ai-hub-debug-result-metrics {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.ai-hub-debug-result-metrics div {
  background: #f8fafc;
  border-radius: 7px;
  display: grid;
  gap: 2px;
  padding: 7px 8px;
}

.ai-hub-debug-result-metrics dt {
  color: #718096;
  font-size: 10px;
}

.ai-hub-debug-result-metrics dd {
  color: #25344a;
  font-size: 12px;
  font-weight: 900;
  margin: 0;
}

.ai-hub-debug-result footer {
  flex-wrap: wrap;
  justify-content: flex-start;
}

.ai-hub-debug-result code {
  color: #64748b;
  font-size: 11px;
  overflow-wrap: anywhere;
}

.ai-hub-debug-result a {
  color: #3158d6;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

@media (max-width: 980px) {
  .ai-hub-debug-layout {
    grid-template-columns: minmax(360px, 420px) minmax(0, 1fr);
  }

  .ai-hub-debug-empty {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  .ai-hub-debug-title-meta {
    align-items: stretch;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .ai-hub-debug-layout {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .ai-hub-debug-request {
    max-height: none;
    overflow: visible;
    padding-bottom: 88px;
  }

  .ai-hub-debug-input-label textarea {
    min-height: 126px;
  }

  .ai-hub-debug-output {
    min-height: 440px;
  }

  .ai-hub-debug-parameter-grid,
  .ai-hub-debug-add-model,
  .ai-hub-debug-empty {
    grid-template-columns: 1fr;
  }

  .ai-hub-debug-add-model button {
    min-height: 44px;
    width: 100%;
  }

  .ai-hub-debug-run-action {
    bottom: 0;
    box-shadow: 0 -8px 18px rgba(37, 52, 75, 0.08);
    grid-template-columns: 1fr;
    left: 12px;
    margin: 0;
    padding-bottom: max(12px, env(safe-area-inset-bottom));
    position: fixed;
    right: 12px;
  }

  .ai-hub-debug-run-action > span {
    display: none;
  }

  .ai-hub-debug-run-action .primary {
    min-height: 48px;
    width: 100%;
  }

  .ai-hub-debug-result header {
    align-items: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ai-hub-debug-add-model button,
  .ai-hub-debug-model-chips button,
  .ai-hub-debug-result button,
  .ai-hub-debug-run-action .primary,
  .ai-hub-debug-advanced > button b {
    transition: none;
  }
}

.category-template-page {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: calc(100vh - 120px);
}

.ct-header {
  align-items: center;
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  padding: 14px 16px;
}

.ct-header p {
  color: #64748b;
  font-size: 12px;
  margin: 0 0 4px;
}

.ct-header h1 {
  color: #0f172a;
  font-size: 22px;
  margin: 0;
}

.ct-header-actions,
.ct-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ct-kpis {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(7, minmax(110px, 1fr));
}

.ct-kpi {
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  padding: 10px 12px;
}

.ct-kpi span {
  color: #64748b;
  display: block;
  font-size: 12px;
}

.ct-kpi strong {
  color: #0f172a;
  display: block;
  font-size: 22px;
  line-height: 1.2;
  margin-top: 3px;
}

.ct-tabs {
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 10px;
  display: flex;
  gap: 4px;
  overflow-x: auto;
  padding: 6px;
}

.ct-tabs button {
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: #475569;
  cursor: pointer;
  font-weight: 700;
  padding: 8px 12px;
  white-space: nowrap;
}

.ct-tabs button.active {
  background: #e8f1ff;
  color: #1d4ed8;
}

.ct-toolbar,
.ct-grid-form {
  align-items: center;
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 10px;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(220px, 1.4fr) minmax(130px, 0.7fr) minmax(120px, 0.7fr) minmax(140px, 0.8fr) auto auto minmax(160px, 1fr);
  padding: 10px;
}

.ct-grid-form {
  grid-template-columns: repeat(6, minmax(130px, 1fr));
  margin-bottom: 10px;
}

.ct-grid-form-binding {
  grid-template-columns: repeat(4, minmax(140px, 1fr));
}

.ct-toolbar input,
.ct-toolbar select,
.ct-grid-form input,
.ct-grid-form select,
.ct-grid-form textarea {
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  color: #0f172a;
  font: inherit;
  min-height: 34px;
  min-width: 0;
  padding: 6px 9px;
}

.ct-grid-form textarea {
  grid-column: span 2;
  resize: vertical;
}

.ct-toolbar button,
.ct-grid-form button,
.ct-header button,
.ct-panel button,
.ct-drawer button {
  background: #fff;
  border: 1px solid #b9c9df;
  border-radius: 7px;
  color: #0f172a;
  cursor: pointer;
  font-weight: 700;
  min-height: 32px;
  padding: 6px 10px;
}

.ct-toolbar button:hover,
.ct-grid-form button:hover,
.ct-panel button:hover,
.ct-drawer button:hover {
  border-color: #2563eb;
  color: #1d4ed8;
}

.ct-toolbar button:disabled,
.ct-grid-form button:disabled,
.ct-panel button:disabled,
.ct-drawer button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.ct-notice {
  color: #2563eb;
  font-size: 13px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ct-panel {
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 10px;
  overflow: hidden;
}

.ct-panel-head {
  align-items: center;
  background: #f8fafc;
  border-bottom: 1px solid #dbe6f2;
  display: flex;
  justify-content: space-between;
  padding: 10px 12px;
}

.ct-panel-head h2 {
  color: #0f172a;
  font-size: 16px;
  margin: 0;
}

.ct-panel-head span {
  color: #64748b;
  font-size: 12px;
}

.msw-page {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: calc(100vh - 120px);
}

.msw-ops-command {
  display: grid;
  gap: 0;
  overflow: visible;
}

.msw-ops-command-head {
  align-items: center;
  background: #ffffff;
  border-bottom: 1px solid #dbe6f2;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 18px;
}

.msw-ops-command-head > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.msw-ops-command-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
}

.msw-ops-command-head h2 {
  color: #0f172a;
  font-size: 22px;
  line-height: 1.25;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-ops-command-head p {
  color: #475569;
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-ops-verdict {
  border-radius: 8px;
  flex: 0 0 auto;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
  padding: 9px 12px;
}

.msw-ops-verdict.go {
  background: #ecfdf5;
  border: 1px solid #86efac;
  color: #166534;
}

.msw-ops-verdict.guarded {
  background: #eff6ff;
  border: 1px solid #93c5fd;
  color: #1d4ed8;
}

.msw-ops-verdict.manual {
  background: #fff7ed;
  border: 1px solid #fdba74;
  color: #9a3412;
}

.msw-ops-verdict.blocked {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
}

.msw-ops-decision {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(260px, 1.35fr) repeat(2, minmax(220px, 1fr));
  padding: 12px 14px;
}

.msw-ops-decision article {
  background: #f8fafc;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 11px 12px;
}

.msw-ops-decision span,
.msw-ops-decision p {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-ops-decision span {
  font-weight: 900;
}

.msw-ops-decision strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-commercialization-gate {
  background: #fff7ed;
  border-bottom: 1px solid #fed7aa;
  border-top: 1px solid #fed7aa;
  display: grid;
  gap: 10px;
  padding: 12px 14px;
}

.msw-commercialization-gate.is-ready {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.msw-commercialization-gate-head {
  align-items: start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-width: 0;
}

.msw-commercialization-gate-head > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.msw-commercialization-gate-head span {
  color: #9a3412;
  font-size: 11px;
  font-weight: 900;
}

.msw-commercialization-gate.is-ready .msw-commercialization-gate-head span {
  color: #166534;
}

.msw-commercialization-gate-head strong {
  color: #0f172a;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-commercialization-gate-head p {
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-commercialization-gate-body {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) minmax(180px, 0.65fr);
}

.msw-commercialization-gate-body > div {
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(251, 146, 60, 0.34);
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 9px;
}

.msw-commercialization-gate.is-ready .msw-commercialization-gate-body > div {
  border-color: rgba(34, 197, 94, 0.32);
}

.msw-commercialization-gate-body b,
.msw-commercialization-gate-body span {
  overflow-wrap: anywhere;
}

.msw-commercialization-gate-body b {
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
}

.msw-commercialization-gate-body span {
  color: #0f172a;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
}

.msw-commercialization-gate-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.msw-commercialization-gate-actions button {
  background: #ffffff;
  border: 1px solid #f59e0b;
  border-radius: 7px;
  color: #9a3412;
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
  min-height: 32px;
  padding: 7px 11px;
}

.msw-commercialization-gate-actions button:hover {
  background: #fffbeb;
  border-color: #d97706;
}

.msw-ops-command-actions {
  border-top: 1px solid #edf2f7;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 14px;
}

.msw-ops-command-actions button,
.msw-ops-task-actions button {
  background: #ffffff;
  border: 1px solid #b9c9df;
  border-radius: 7px;
  color: #0f172a;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  min-height: 34px;
  padding: 7px 11px;
  white-space: nowrap;
}

.msw-ops-command-actions button:first-child {
  background: #0f172a;
  border-color: #0f172a;
  color: #ffffff;
}

.msw-ops-command-actions button:hover,
.msw-ops-task-actions button:hover {
  background: #eff6ff;
  border-color: #2563eb;
  color: #1d4ed8;
}

.msw-ops-command-actions button:first-child:hover {
  background: #1e293b;
  border-color: #1e293b;
  color: #ffffff;
}

.msw-ops-command-actions button:disabled,
.msw-ops-task-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.msw-ops-task-grid {
  border-top: 1px solid #edf2f7;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 14px;
}

.msw-ops-task-card {
  align-content: start;
  background: #ffffff;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
}

.msw-ops-task-card.is-primary {
  border-color: #93c5fd;
  box-shadow: inset 3px 0 0 #2563eb;
}

.msw-ops-task-card > div:first-child {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.msw-ops-task-card span {
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
}

.msw-ops-task-card strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-ops-task-card p {
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-ops-task-card dl {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.msw-ops-task-card dl div {
  background: #f8fafc;
  border: 1px solid #edf2f7;
  border-radius: 7px;
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 6px 7px;
}

.msw-ops-task-card dt,
.msw-ops-task-card dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}

.msw-ops-task-card dt {
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
}

.msw-ops-task-card dd {
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
}

.msw-ops-task-actions,
.msw-ops-task-actions .msw-l2-sample-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.msw-ops-detail-stack {
  background: #ffffff;
  border: 1px solid #cbd8e7;
  border-radius: 10px;
  overflow: hidden;
}

.msw-ops-detail-stack > summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  list-style: none;
  padding: 12px 14px;
}

.msw-ops-detail-stack > summary::-webkit-details-marker {
  display: none;
}

.msw-ops-detail-stack > summary strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.msw-ops-detail-stack > summary span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  text-align: right;
}

.msw-ops-detail-stack > div {
  border-top: 1px solid #dbe6f2;
  display: grid;
  gap: 12px;
  padding: 12px;
}

.msw-intake-bar {
  align-items: center;
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 10px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 12px 14px;
}

.msw-real-inbox {
  background: #fff;
  border: 1px solid #c9d8ec;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
}

.msw-real-inbox-head {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.msw-real-inbox-head > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.msw-real-source-form {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
}

.msw-real-source-form label {
  color: #0f172a;
  display: flex;
  flex-direction: column;
  font-size: 12px;
  font-weight: 700;
  gap: 4px;
  min-width: 0;
}

.msw-real-source-form .wide {
  grid-column: 1 / -1;
}

.msw-real-source-form input,
.msw-real-source-form select,
.msw-real-source-form textarea {
  border: 1px solid #cbd8e7;
  border-radius: 8px;
  color: #0f172a;
  font: inherit;
  min-width: 0;
  padding: 8px 10px;
}

.msw-real-source-form textarea {
  resize: vertical;
}

.msw-real-source-actions {
  align-items: center;
  display: flex;
  gap: 10px;
  grid-column: 1 / -1;
  justify-content: flex-end;
}

.msw-inline-check {
  align-items: center;
  flex-direction: row !important;
  font-weight: 600 !important;
}

.msw-inline-check input {
  min-width: auto;
  padding: 0;
}

.msw-real-source-actions button {
  background: #1d4ed8;
  border: 1px solid #1d4ed8;
  border-radius: 7px;
  color: #fff;
  cursor: pointer;
  font-weight: 700;
  min-height: 36px;
  padding: 7px 12px;
}

.msw-real-source-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.msw-watch-create-form {
  grid-template-columns: minmax(0, 1fr);
}

.msw-watch-create-form label,
.msw-watch-create-form .wide,
.msw-watch-create-form .msw-real-source-actions {
  grid-column: 1 / -1;
}

.msw-intake-reference {
  background: #f8fafc;
}

.msw-intake-reference summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  flex: 1;
  gap: 10px;
}

.msw-intake-reference .msw-button-row {
  margin-left: auto;
}

.msw-live-import {
  align-items: stretch;
  background: #f8fafc;
  border: 1px solid #dbe6f2;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(220px, 0.8fr) minmax(320px, 1.4fr) auto;
  padding: 12px 14px;
}

.msw-live-import > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.msw-live-import textarea {
  border: 1px solid #cbd8e7;
  border-radius: 8px;
  color: #0f172a;
  font: inherit;
  min-height: 72px;
  padding: 8px 10px;
  resize: vertical;
}

.msw-live-import button {
  align-self: center;
  background: #fff;
  border: 1px solid #b9c9df;
  border-radius: 7px;
  color: #0f172a;
  cursor: pointer;
  font-weight: 700;
  min-height: 36px;
  padding: 7px 12px;
}

.msw-live-import-actions {
  align-self: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.msw-live-import-actions .primary {
  background: #1d4ed8;
  border-color: #1d4ed8;
  color: #fff;
}

@media (max-width: 860px) {
  .msw-ops-command-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .msw-commercialization-gate-head {
    flex-direction: column;
  }

  .msw-commercialization-gate-body {
    grid-template-columns: 1fr;
  }

  .msw-commercialization-gate-actions,
  .msw-commercialization-gate-actions button {
    width: 100%;
  }

  .msw-ops-decision,
  .msw-ops-task-grid,
  .msw-ops-task-card dl {
    grid-template-columns: 1fr;
  }

  .msw-ops-command-actions,
  .msw-ops-command-actions button,
  .msw-ops-task-actions button {
    width: 100%;
  }

  .msw-ops-command-actions {
    flex-direction: column;
  }

  .msw-ops-detail-stack > summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .msw-ops-detail-stack > summary span {
    text-align: left;
  }

  .msw-real-source-form {
    grid-template-columns: 1fr;
  }

  .msw-real-source-actions,
  .msw-real-inbox-head {
    align-items: stretch;
    flex-direction: column;
  }

  .msw-live-import {
    display: flex;
    flex-direction: column;
  }

  .msw-live-import-actions,
  .msw-live-import button {
    align-self: stretch;
  }

  .msw-live-import-actions {
    flex-direction: column;
  }
}

.msw-real-inbox strong,
.msw-intake-bar strong,
.msw-live-import strong,
.msw-panel-head h2,
.msw-platform-layout h3 {
  color: #0f172a;
  margin: 0;
}

.msw-real-inbox-head span,
.msw-intake-bar span,
.msw-live-import span,
.msw-panel-head span,
.msw-list-item span,
.msw-list-item em,
.msw-muted {
  color: #64748b;
  font-size: 12px;
}

.msw-button-row,
.msw-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.msw-actions {
  flex: 0 0 auto;
  max-width: min(180px, 44%);
}

.msw-button-row button,
.msw-actions button,
.page-hero-actions button {
  background: #fff;
  border: 1px solid #b9c9df;
  border-radius: 7px;
  color: #0f172a;
  cursor: pointer;
  font-weight: 700;
  min-height: 32px;
  padding: 6px 10px;
  white-space: nowrap;
}

.msw-button-row button:hover,
.msw-actions button:hover,
.page-hero-actions button:hover {
  border-color: #2563eb;
  color: #1d4ed8;
}

.msw-button-row button:disabled,
.msw-actions button:disabled,
.page-hero-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.page-hero-actions button.primary,
.msw-button-row button.primary {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}

.msw-grid {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
}

.msw-technical-evidence {
  background: #fff;
  border: 1px solid #cbd8e7;
  border-radius: 10px;
  overflow: hidden;
}

.msw-technical-evidence > summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  list-style: none;
  padding: 12px 14px;
}

.msw-technical-evidence > summary::-webkit-details-marker {
  display: none;
}

.msw-technical-evidence > summary strong {
  color: #0f172a;
  font-size: 14px;
}

.msw-technical-evidence > summary span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  text-align: right;
}

.msw-technical-evidence-body {
  border-top: 1px solid #dbe6f2;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px;
}

.msw-panel {
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 10px;
  min-width: 0;
  overflow: hidden;
}

.msw-panel-wide {
  grid-column: 1 / -1;
}

.msw-panel-head {
  align-items: center;
  background: #f8fafc;
  border-bottom: 1px solid #dbe6f2;
  display: flex;
  justify-content: space-between;
  padding: 10px 12px;
}

.msw-panel-head h2 {
  font-size: 15px;
}

.msw-readiness {
  overflow: visible;
}

.msw-shop-sync {
  overflow: visible;
}

.msw-shop-sync-body {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(280px, 0.85fr) repeat(2, minmax(240px, 1fr));
  padding: 12px;
}

.msw-shop-sync-copy,
.msw-shop-context-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.msw-shop-sync-copy strong,
.msw-shop-context-list > strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-shop-sync-copy span,
.msw-shop-sync-copy code,
.msw-shop-sync-result span,
.msw-shop-sync-result em {
  color: #64748b;
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.msw-shop-sync-copy code {
  background: #f1f5f9;
  border-radius: 5px;
  padding: 1px 4px;
}

.msw-shop-sync-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.msw-shop-sync-actions button {
  background: #fff;
  border: 1px solid #b9c9df;
  border-radius: 7px;
  color: #0f172a;
  cursor: pointer;
  font-weight: 700;
  min-height: 32px;
  padding: 6px 10px;
}

.msw-shop-sync-actions button:hover {
  border-color: #2563eb;
  color: #1d4ed8;
}

.msw-shop-sync-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.msw-shop-sync-result {
  background: #f8fbff;
  border: 1px solid #d7e2f0;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 38px;
  padding: 8px 10px;
}

.msw-shop-sync-result > div {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.msw-shop-sync-result em {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  font-style: normal;
  padding: 2px 7px;
}

.msw-shop-sync-result .msw-openapi-request-model {
  align-items: stretch;
  flex-direction: column;
  gap: 4px;
}

.msw-shop-sync-result .msw-openapi-request-model em {
  border-radius: 6px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  line-height: 1.5;
  white-space: normal;
}

.msw-scoped-sync-plan .msw-scoped-sync-targets,
.msw-scoped-sync-plan .msw-scoped-sync-commands,
.msw-scoped-sync-plan .msw-scoped-sync-coverage {
  align-items: stretch;
  flex-direction: column;
}

.msw-scoped-sync-plan .msw-scoped-sync-targets em,
.msw-scoped-sync-plan .msw-scoped-sync-commands em,
.msw-scoped-sync-plan .msw-scoped-sync-coverage em {
  border-radius: 6px;
  line-height: 1.5;
  white-space: normal;
}

.msw-openapi-request-model code {
  background: #eef4ff;
  border-radius: 4px;
  padding: 1px 4px;
}

.msw-shop-context-row {
  align-items: center;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  min-height: 46px;
  padding: 8px 10px;
}

.msw-shop-context-row > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.msw-shop-context-row strong,
.msw-shop-context-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.msw-shop-context-row strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-shop-context-row span {
  color: #64748b;
  font-size: 12px;
}

.msw-shop-context-status {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 0 0 auto;
}

.msw-readiness-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  padding: 12px;
}

.msw-readiness-card {
  align-items: flex-start;
  background: #f8fbff;
  border: 1px solid #d7e2f0;
  border-radius: 8px;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  min-width: 0;
  padding: 9px 10px;
}

.msw-readiness-card > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-readiness-card strong {
  color: #0f172a;
  font-size: 13px;
  line-height: 1.35;
}

.msw-readiness-card span,
.msw-readiness-action em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-readiness-card.msw-readiness-blocked {
  background: #fff7ed;
  border-color: #fdba74;
}

.msw-readiness-blocker-line {
  border-top: 1px solid #e5edf5;
  color: #9a3412;
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
  padding: 10px 12px 0;
}

.msw-readiness-action-groups {
  border-top: 1px solid #e5edf5;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 12px;
}

.msw-readiness-actions {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.msw-readiness-actions h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-readiness-actions > div {
  display: grid;
  gap: 7px;
}

.msw-business-launch {
  display: grid;
  gap: 0;
}

.msw-business-launch-hero {
  align-items: center;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 16px;
}

.msw-business-launch-hero > div {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.msw-business-launch-hero strong {
  color: #0f172a;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-business-launch-hero span {
  color: #475569;
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.msw-business-launch-chain {
  border-bottom: 1px solid #e2e8f0;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding: 14px 16px;
}

.msw-business-launch-chain dl {
  background: #ffffff;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  display: grid;
  gap: 5px;
  margin: 0;
  min-width: 0;
  padding: 10px;
}

.msw-business-launch-chain dt,
.msw-business-launch-chain dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-business-launch-chain dt {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.msw-business-launch-chain dd {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

.msw-business-launch-sample {
  align-items: stretch;
  border-bottom: 1px solid #e2e8f0;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(220px, 1.5fr) repeat(4, minmax(110px, 0.55fr));
  padding: 14px 16px;
}

.msw-business-launch-sample > div,
.msw-business-launch-sample dl {
  background: #f8fafc;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  display: grid;
  gap: 5px;
  margin: 0;
  min-width: 0;
  padding: 10px;
}

.msw-business-launch-sample strong,
.msw-business-launch-sample dd {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.35;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-business-launch-sample span,
.msw-business-launch-sample dt {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.4;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-business-launch-proof {
  border-bottom: 1px solid #e2e8f0;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  padding: 16px;
}

.msw-business-launch-plan,
.msw-business-launch-evidence {
  background: #ffffff;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 12px;
}

.msw-business-launch-plan h3,
.msw-business-launch-evidence h3 {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
  margin: 0;
}

.msw-business-launch-plan article,
.msw-business-launch-evidence article {
  align-items: start;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 9px;
}

.msw-business-launch-plan article {
  grid-template-columns: 36px minmax(0, 1fr) auto;
}

.msw-business-launch-evidence article {
  grid-template-columns: minmax(0, 1fr) auto;
}

.msw-business-launch-plan b {
  align-items: center;
  background: #f1f5f9;
  border-radius: 8px;
  color: #334155;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  height: 32px;
  justify-content: center;
  width: 36px;
}

.msw-business-launch-plan article > div,
.msw-business-launch-evidence article > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.msw-business-launch-plan strong,
.msw-business-launch-evidence strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.msw-business-launch-plan span,
.msw-business-launch-plan em,
.msw-business-launch-evidence span,
.msw-business-launch-evidence em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.msw-business-launch-plan em,
.msw-business-launch-evidence em {
  color: #2563eb;
  font-weight: 800;
}

.msw-business-launch-layout {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(280px, 0.75fr);
  padding: 16px;
}

.msw-business-launch-today,
.msw-business-launch-streams,
.msw-business-launch-emergency {
  background: #ffffff;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
}

.msw-business-launch-today h3,
.msw-business-launch-streams h3,
.msw-business-launch-emergency h3 {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
  margin: 0;
}

.msw-business-launch-task,
.msw-business-launch-stream,
.msw-business-launch-emergency article {
  align-items: start;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 10px;
}

.msw-business-launch-task {
  grid-template-columns: 32px minmax(0, 1fr) auto;
}

.msw-business-launch-task.is-blocked {
  border-color: #fecaca;
}

.msw-business-launch-task-side {
  align-items: end;
  display: grid;
  gap: 8px;
  justify-items: end;
  min-width: 108px;
}

.msw-business-launch-action {
  border: 1px solid #bfd0e6;
  border-radius: 8px;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 900;
  min-height: 32px;
  padding: 0 10px;
  white-space: nowrap;
}

.msw-business-launch-action:hover {
  background: #eff6ff;
  border-color: #93c5fd;
}

.msw-business-launch-stream {
  grid-template-columns: minmax(0, 1fr) auto;
}

.msw-business-launch-task > b {
  align-items: center;
  background: #eef2f7;
  border-radius: 8px;
  color: #334155;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  height: 32px;
  justify-content: center;
  width: 32px;
}

.msw-business-launch-task div,
.msw-business-launch-stream div,
.msw-business-launch-emergency article {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.msw-business-launch-task strong,
.msw-business-launch-stream strong,
.msw-business-launch-emergency strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.msw-business-launch-task span,
.msw-business-launch-task em,
.msw-business-launch-stream span,
.msw-business-launch-emergency span,
.msw-business-launch-emergency em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.msw-business-launch-task em,
.msw-business-launch-emergency em {
  color: #2563eb;
  font-weight: 800;
}

.msw-focus-pulse {
  animation: msw-focus-pulse 1.6s ease-out;
  outline: 3px solid rgba(37, 99, 235, 0.32);
  outline-offset: 4px;
}

@keyframes msw-focus-pulse {
  0% {
    outline-color: rgba(37, 99, 235, 0.55);
  }
  100% {
    outline-color: rgba(37, 99, 235, 0);
  }
}

@media (max-width: 1100px) {
  .msw-business-launch-chain,
  .msw-business-launch-sample,
  .msw-business-launch-proof,
  .msw-business-launch-layout {
    grid-template-columns: 1fr;
  }

  .msw-business-launch-task,
  .msw-business-launch-stream,
  .msw-business-launch-plan article,
  .msw-business-launch-evidence article {
    grid-template-columns: 1fr;
  }

  .msw-business-launch-task-side {
    align-items: start;
    justify-items: start;
    min-width: 0;
  }
}

.msw-controlled-window-board {
  display: grid;
  gap: 0;
}

.msw-controlled-window-primary {
  align-items: center;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-width: 0;
  padding: 14px;
}

.msw-controlled-window-primary > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.msw-controlled-window-primary strong {
  color: #0f172a;
  font-size: 16px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.msw-controlled-window-primary span,
.msw-controlled-window-primary em {
  color: #475569;
  font-size: 13px;
  font-style: normal;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.msw-controlled-window-primary em {
  color: #9a3412;
}

.msw-controlled-window-copy-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.msw-controlled-window-copy-actions button {
  background: #ffffff;
  border: 1px solid #bfd0e5;
  border-radius: 8px;
  color: #0f172a;
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  padding: 8px 10px;
  white-space: nowrap;
}

.msw-controlled-window-copy-actions button:hover:not(:disabled) {
  background: #eff6ff;
  border-color: #2563eb;
  color: #1d4ed8;
}

.msw-controlled-window-copy-actions button:disabled {
  background: #f1f5f9;
  color: #94a3b8;
  cursor: not-allowed;
}

.msw-controlled-window-ops-ref {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
  min-width: 220px;
  padding: 8px 10px;
}

.msw-controlled-window-ops-ref span {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.msw-controlled-window-ops-ref strong {
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
}

.msw-controlled-window-ops-ref button {
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  color: #1d4ed8;
  cursor: pointer;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.2;
  padding: 6px 8px;
}

.msw-controlled-window-ops-ref button:hover {
  background: #eff6ff;
  border-color: #2563eb;
}

.msw-controlled-window-copy-fallback {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  margin: 12px;
  padding: 12px;
}

.msw-controlled-window-copy-fallback h3 {
  color: #9a3412;
  font-size: 14px;
  margin: 0 0 4px;
}

.msw-controlled-window-copy-fallback span {
  color: #7c2d12;
  font-size: 12px;
  line-height: 1.45;
}

.msw-controlled-window-copy-fallback pre {
  background: #ffffff;
  border: 1px solid #fed7aa;
  border-radius: 8px;
  color: #0f172a;
  font-size: 12px;
  line-height: 1.5;
  margin: 0;
  max-height: 220px;
  overflow: auto;
  padding: 10px;
  white-space: pre-wrap;
  word-break: break-word;
}

.msw-controlled-window-layout {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(260px, 0.95fr) minmax(300px, 1.15fr) minmax(280px, 0.9fr);
  padding: 12px;
}

.msw-controlled-window-evidence,
.msw-controlled-window-actions,
.msw-controlled-window-rules section {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.msw-controlled-window-evidence h3,
.msw-controlled-window-actions h3,
.msw-controlled-window-rules h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-controlled-window-authority {
  background: #ecfdf5;
  border: 1px solid #bbf7d0;
  border-radius: 8px;
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 8px;
}

.msw-controlled-window-authority span {
  color: #166534;
  font-size: 11px;
  font-weight: 900;
}

.msw-controlled-window-authority strong {
  color: #064e3b;
  font-size: 13px;
  font-weight: 900;
}

.msw-controlled-window-authority code {
  background: #ffffff;
  border: 1px solid #bbf7d0;
  border-radius: 6px;
  color: #0f172a;
  font-size: 12px;
  font-weight: 800;
  overflow-wrap: anywhere;
  padding: 6px;
}

.msw-controlled-window-authority em {
  color: #166534;
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}

.msw-controlled-window-evidence > strong {
  color: #0f172a;
  font-size: 13px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-controlled-window-evidence > div,
.msw-controlled-window-rules dl {
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.msw-controlled-window-evidence dl,
.msw-controlled-window-rules dl div {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 3px;
  margin: 0;
  min-width: 0;
  padding: 7px;
}

.msw-controlled-window-evidence dt,
.msw-controlled-window-evidence dd,
.msw-controlled-window-rules dt,
.msw-controlled-window-rules dd {
  font-size: 12px;
  line-height: 1.25;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-controlled-window-evidence dt,
.msw-controlled-window-rules dt {
  color: #64748b;
  font-weight: 800;
}

.msw-controlled-window-evidence dd,
.msw-controlled-window-rules dd {
  color: #0f172a;
  font-weight: 900;
}

.msw-controlled-window-evidence p,
.msw-controlled-window-rules p {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-controlled-window-task {
  align-items: start;
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-left: 3px solid #0f766e;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  min-width: 0;
  padding: 8px;
}

.msw-controlled-window-task.is-blocked {
  background: #fff7ed;
  border-left-color: #f97316;
}

.msw-controlled-window-task > b {
  align-items: center;
  background: #ecfdf5;
  border-radius: 6px;
  color: #047857;
  display: inline-flex;
  font-size: 11px;
  height: 24px;
  justify-content: center;
  width: 32px;
}

.msw-controlled-window-task > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-controlled-window-task strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-controlled-window-task span,
.msw-controlled-window-task em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-controlled-window-rules {
  align-content: start;
  display: grid;
  gap: 10px;
  min-width: 0;
}

.msw-controlled-window-rules section > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.msw-controlled-window-rules span {
  background: #f1f5f9;
  border-radius: 999px;
  color: #475569;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.25;
  padding: 5px 8px;
}

.msw-controlled-window-rules span.is-acceptance {
  background: #eef6ff;
  color: #1d4ed8;
}

.msw-controlled-window-rules strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-operator-mission {
  display: grid;
  gap: 0;
}

.msw-operator-primary {
  align-items: center;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-width: 0;
  padding: 12px;
}

.msw-operator-primary > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.msw-operator-primary strong {
  color: #0f172a;
  font-size: 15px;
}

.msw-operator-primary span {
  color: #475569;
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.msw-operator-primary-action {
  align-items: center;
  background: #2563eb;
  border: 1px solid #1d4ed8;
  border-radius: 8px;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  justify-content: center;
  line-height: 1.2;
  margin-top: 4px;
  max-width: max-content;
  min-height: 34px;
  padding: 8px 12px;
}

.msw-operator-task-action.msw-operator-primary-action {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
  margin-top: 0;
}

.msw-operator-layout {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  padding: 12px;
}

.msw-operator-task-list,
.msw-operator-side {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.msw-operator-task-list h3,
.msw-operator-side h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-operator-task {
  align-items: start;
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 6px 8px;
  grid-template-columns: 32px minmax(0, 1fr) minmax(110px, auto) auto auto;
  min-width: 0;
  padding: 9px;
}

.msw-operator-task.is-blocked {
  background: #fff7ed;
  border-color: #fed7aa;
}

.msw-operator-task > b {
  align-items: center;
  background: #eef6ff;
  border-radius: 6px;
  color: #1d4ed8;
  display: inline-flex;
  font-size: 11px;
  height: 24px;
  justify-content: center;
  line-height: 1;
  width: 32px;
}

.msw-operator-task > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-operator-task strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-operator-task span,
.msw-operator-task em,
.msw-operator-task small {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-operator-task small {
  align-self: center;
  background: #f1f5f9;
  border-radius: 999px;
  color: #475569;
  font-weight: 800;
  padding: 5px 7px;
}

.msw-platform-feedback {
  background: #f8fafc;
  border: 1px solid #dbe6f3;
  border-radius: 6px;
  display: grid;
  gap: 5px 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 4px 0 0;
  padding: 8px;
}

.msw-platform-feedback dt,
.msw-platform-feedback dd {
  margin: 0;
  min-width: 0;
}

.msw-platform-feedback dt,
.msw-platform-feedback .is-message {
  grid-column: 1 / -1;
}

.msw-platform-feedback dt {
  color: #0f172a;
  font-size: 12px;
  font-weight: 800;
}

.msw-platform-feedback dd {
  align-items: baseline;
  display: flex;
  gap: 5px;
}

.msw-platform-feedback dd span {
  color: #64748b;
  flex: 0 0 auto;
  font-size: 11px;
}

.msw-platform-feedback dd strong {
  color: #0f172a;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.msw-operator-task-action {
  align-self: center;
  background: #0f172a;
  border: 1px solid #0f172a;
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  min-height: 30px;
  padding: 0 10px;
  white-space: nowrap;
}

.msw-operator-task-action:hover {
  background: #1e293b;
  border-color: #1e293b;
}

.msw-delivery-review-checklist textarea {
  background: #f8fafc;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  color: #0f172a;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 12px;
  line-height: 1.5;
  min-height: 220px;
  padding: 12px;
  resize: vertical;
  width: 100%;
}

.msw-delivery-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 12px 12px;
}

.msw-delivery-review-actions button {
  background: #0f172a;
  border: 1px solid #0f172a;
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  min-height: 34px;
  padding: 0 12px;
}

.msw-delivery-review-actions button + button {
  background: #ffffff;
  color: #991b1b;
  border-color: #fecaca;
}

.msw-delivery-readiness {
  display: grid;
  gap: 0;
}

.msw-delivery-readiness-summary {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 12px;
}

.msw-delivery-readiness-summary > div {
  background: #f8fafc;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
}

.msw-delivery-readiness-summary strong,
.msw-delivery-readiness-summary span {
  overflow-wrap: anywhere;
}

.msw-delivery-readiness-summary strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.msw-delivery-readiness-summary span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.msw-delivery-readiness-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.32fr);
  padding: 0 12px 12px;
}

.msw-delivery-readiness-grid section,
.msw-delivery-readiness-grid aside {
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.msw-delivery-readiness-grid h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-delivery-readiness-gate {
  align-items: start;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 9px;
}

.msw-delivery-readiness-gate.is-blocked {
  border-color: #fecaca;
}

.msw-delivery-readiness-gate > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-delivery-readiness-gate strong,
.msw-delivery-readiness-gate span {
  overflow-wrap: anywhere;
}

.msw-delivery-readiness-gate strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

.msw-delivery-readiness-gate span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.msw-delivery-readiness-grid aside div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.msw-delivery-readiness-grid aside span {
  background: #eef2ff;
  border-radius: 999px;
  color: #3730a3;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 8px;
}

.msw-delivery-readiness-grid aside button {
  background: #0f172a;
  border: 1px solid #0f172a;
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  min-height: 34px;
  padding: 0 12px;
}

.msw-delivery-handoff {
  display: grid;
  gap: 0;
}

.msw-delivery-handoff-brief {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(260px, 0.85fr) minmax(0, 1fr) minmax(300px, 0.9fr);
  padding: 12px;
}

.msw-delivery-handoff-scope,
.msw-delivery-handoff-evidence,
.msw-delivery-handoff-runbook {
  background: #f8fafc;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  align-self: start;
  min-width: 0;
  padding: 12px;
}

.msw-delivery-handoff-scope h3,
.msw-delivery-handoff-evidence h3,
.msw-delivery-handoff-runbook h3 {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
  margin: 0;
}

.msw-delivery-handoff-scope > strong {
  color: #0f172a;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.msw-delivery-handoff-runbook > strong {
  color: #334155;
  font-size: 13px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.msw-delivery-handoff-scope dl,
.msw-delivery-handoff-evidence dl,
.msw-delivery-handoff-inputs dl {
  display: grid;
  gap: 6px;
  margin: 0;
}

.msw-delivery-handoff-scope dl div {
  display: grid;
  gap: 4px;
  grid-template-columns: minmax(130px, 0.5fr) minmax(0, 1fr);
}

.msw-delivery-handoff-scope dt,
.msw-delivery-handoff-evidence dt,
.msw-delivery-handoff-inputs dt {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.msw-delivery-handoff-scope dd,
.msw-delivery-handoff-evidence dd,
.msw-delivery-handoff-inputs dd {
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-delivery-handoff-scope p,
.msw-delivery-handoff-runbook p {
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  margin: 0;
}

.msw-delivery-handoff-evidence > div {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.msw-delivery-handoff-evidence dl,
.msw-delivery-handoff-inputs dl {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 8px;
}

.msw-delivery-handoff-evidence dt span,
.msw-delivery-handoff-inputs dt span {
  color: #94a3b8;
  display: block;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 11px;
  font-weight: 800;
}

.msw-delivery-handoff-inputs {
  display: grid;
  gap: 8px;
}

.msw-delivery-handoff-packet-authority {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.msw-delivery-handoff-packet-authority strong,
.msw-delivery-handoff-packet-authority dl,
.msw-delivery-handoff-packet-authority dt,
.msw-delivery-handoff-packet-authority dd {
  overflow-wrap: anywhere;
}

.msw-delivery-handoff-packet-authority strong {
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
}

.msw-delivery-handoff-packet-authority dl {
  background: #f1f5f9;
  border-radius: 6px;
  display: grid;
  gap: 3px;
  margin: 0;
  padding: 6px 8px;
}

.msw-delivery-handoff-packet-authority dt {
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
}

.msw-delivery-handoff-packet-authority dd {
  color: #334155;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 10px;
  font-weight: 800;
  margin: 0;
}

.msw-delivery-handoff-runbook ul {
  color: #475569;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  line-height: 1.5;
  margin: 0;
  padding-left: 18px;
}

.msw-delivery-handoff-packet-list {
  list-style: disc;
}

.msw-delivery-handoff-packet-list li {
  display: grid;
  gap: 2px;
}

.msw-delivery-handoff-packet-list strong,
.msw-delivery-handoff-packet-list span {
  overflow-wrap: anywhere;
}

.msw-delivery-handoff-copy {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  color: #334155;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 12px;
  line-height: 1.5;
  margin: 0;
  max-height: 220px;
  overflow: auto;
  overflow-wrap: anywhere;
  padding: 10px;
  white-space: pre-wrap;
}

.msw-delivery-handoff-summary {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  padding: 12px;
}

.msw-delivery-handoff-summary > div {
  background: #f8fafc;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
}

.msw-delivery-handoff-summary strong,
.msw-delivery-handoff-summary span {
  overflow-wrap: anywhere;
}

.msw-delivery-handoff-summary strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

.msw-delivery-handoff-summary span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.msw-delivery-handoff-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr) minmax(220px, 0.45fr);
  padding: 0 12px 12px;
}

.msw-delivery-handoff-grid section,
.msw-delivery-handoff-grid aside {
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.msw-delivery-handoff-grid h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-delivery-handoff-step {
  align-items: start;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 9px;
}

.msw-delivery-handoff-step.is-blocked {
  border-color: #fecaca;
}

.msw-delivery-handoff-step > div,
.msw-delivery-handoff-command {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.msw-delivery-handoff-step strong,
.msw-delivery-handoff-step span,
.msw-delivery-handoff-command strong,
.msw-delivery-handoff-command code {
  overflow-wrap: anywhere;
}

.msw-delivery-handoff-step strong,
.msw-delivery-handoff-command strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

.msw-delivery-handoff-step span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.msw-delivery-handoff-command {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 9px;
}

.msw-delivery-handoff-command code {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 6px;
  color: #334155;
  display: block;
  font-size: 12px;
  line-height: 1.45;
  padding: 8px;
  white-space: normal;
}

.msw-delivery-handoff-grid aside ul {
  color: #475569;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  line-height: 1.5;
  margin: 0;
  padding-left: 18px;
}

.msw-delivery-handoff-grid section ul {
  color: #475569;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  line-height: 1.5;
  margin: 0;
  padding-left: 18px;
}

.msw-delivery-handoff-grid aside div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.msw-delivery-handoff-grid aside span {
  background: #eef2ff;
  border-radius: 999px;
  color: #3730a3;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 8px;
}

.msw-delivery-handoff-freeze {
  align-content: start;
}

.msw-service-env {
  display: grid;
  gap: 0;
}

.msw-service-env-summary {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  padding: 12px;
}

.msw-service-env-summary > div {
  background: #f8fafc;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
}

.msw-service-env-summary strong,
.msw-service-env-summary span {
  overflow-wrap: anywhere;
}

.msw-service-env-summary strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

.msw-service-env-summary span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.msw-service-env-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr) minmax(220px, 0.45fr);
  padding: 0 12px 12px;
}

.msw-service-env-grid section,
.msw-service-env-grid aside {
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.msw-service-env-grid h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-service-env-gate {
  align-items: start;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 9px;
}

.msw-service-env-gate.is-blocked {
  border-color: #fecaca;
}

.msw-service-env-gate > div,
.msw-service-env-commands {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.msw-service-env-gate strong,
.msw-service-env-gate span,
.msw-service-env-commands code,
.msw-service-env-grid aside p {
  overflow-wrap: anywhere;
}

.msw-service-env-gate strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

.msw-service-env-gate span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.msw-service-env-commands code {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  color: #334155;
  display: block;
  font-size: 12px;
  line-height: 1.45;
  padding: 8px;
  white-space: normal;
}

.msw-service-env-grid aside p {
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  margin: 0;
}

.msw-service-env-grid aside div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.msw-service-env-grid aside span {
  background: #eef2ff;
  border-radius: 999px;
  color: #3730a3;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 8px;
}

.msw-service-env-grid aside button {
  background: #0f172a;
  border: 1px solid #0f172a;
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  min-height: 34px;
  padding: 0 12px;
  justify-self: start;
}

.msw-service-env-confirmation-ledger,
.msw-service-env-confirmation-list {
  display: grid;
  gap: 0;
}

.msw-service-env-confirmation-list {
  gap: 10px;
  padding: 12px;
}

.msw-service-env-confirmation-row {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(180px, 1fr) minmax(340px, 1.6fr);
  min-width: 0;
  padding: 10px;
}

.msw-service-env-confirmation-row.is-confirmed {
  border-color: #bbf7d0;
}

.msw-service-env-confirmation-row > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-service-env-confirmation-row strong,
.msw-service-env-confirmation-row span,
.msw-service-env-confirmation-row dd {
  overflow-wrap: anywhere;
}

.msw-service-env-confirmation-row dl {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}

.msw-service-env-confirmation-row dt {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.msw-service-env-confirmation-row dd {
  color: #0f172a;
  font-size: 12px;
  font-weight: 800;
  margin: 0;
}

.msw-delivery-review-ledger,
.msw-delivery-review-list {
  display: grid;
  gap: 0;
}

.msw-delivery-review-list {
  gap: 10px;
  padding: 12px;
}

.msw-delivery-review-row {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(180px, 1fr) minmax(260px, 1.4fr);
  min-width: 0;
  padding: 10px;
}

.msw-delivery-review-row.is-approved {
  border-color: #bbf7d0;
}

.msw-delivery-review-row.is-blocked {
  border-color: #fecaca;
}

.msw-delivery-review-row > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-delivery-review-row strong,
.msw-delivery-review-row span,
.msw-delivery-review-row dd {
  overflow-wrap: anywhere;
}

.msw-delivery-review-row dl {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.msw-delivery-review-row dt {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.msw-delivery-review-row dd {
  color: #0f172a;
  font-size: 12px;
  font-weight: 800;
  margin: 0;
}

.app-toast {
  background: #0f172a;
  border: 1px solid #1e293b;
  border-radius: 8px;
  bottom: 18px;
  box-shadow: 0 14px 35px rgba(15, 23, 42, 0.18);
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
  left: 50%;
  max-width: min(520px, calc(100vw - 32px));
  opacity: 0;
  padding: 10px 14px;
  pointer-events: none;
  position: fixed;
  transform: translate(-50%, 12px);
  transition:
    opacity 0.18s ease,
    transform 0.18s ease;
  z-index: 10000;
}

.app-toast.visible {
  opacity: 1;
  transform: translate(-50%, 0);
}

.msw-operator-evidence,
.msw-operator-safety,
.msw-operator-frozen {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 10px;
}

.msw-operator-evidence div {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
}

.msw-operator-evidence span,
.msw-operator-evidence strong,
.msw-operator-safety span,
.msw-operator-frozen span {
  font-size: 12px;
  line-height: 1.35;
  min-width: 0;
  overflow-wrap: anywhere;
}

.msw-operator-evidence span {
  color: #64748b;
}

.msw-operator-evidence strong {
  color: #0f172a;
  text-align: right;
}

.msw-operator-safety span {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 7px;
  color: #9a3412;
  padding: 6px 7px;
}

.msw-operator-frozen div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.msw-operator-frozen span {
  background: #f1f5f9;
  border: 1px solid #dbe6f3;
  border-radius: 999px;
  color: #475569;
  font-weight: 800;
  padding: 5px 8px;
}

.msw-single-run-sop {
  display: grid;
  gap: 0;
}

.msw-single-run-current {
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(260px, 0.9fr) minmax(260px, 1.05fr) minmax(280px, 1.05fr);
  min-width: 0;
  padding: 12px;
}

.msw-single-run-current-copy,
.msw-single-run-evidence-chain,
.msw-single-run-policy {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.msw-single-run-current h3,
.msw-single-run-policy h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-single-run-current-copy strong,
.msw-single-run-policy strong,
.msw-single-run-acceptance strong,
.msw-single-run-freeze strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.msw-single-run-current-copy span,
.msw-single-run-current-copy em,
.msw-single-run-policy span {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.msw-single-run-current-copy em {
  color: #9a3412;
}

.msw-single-run-evidence-item {
  align-items: center;
  border: 1px solid #dbe6f3;
  border-left: 3px solid #0f766e;
  border-radius: 8px;
  display: grid;
  gap: 6px;
  grid-template-columns: minmax(82px, 0.55fr) minmax(0, 1fr) auto;
  min-width: 0;
  padding: 7px 8px;
}

.msw-single-run-evidence-item.is-missing {
  border-left-color: #f97316;
  background: #fff7ed;
}

.msw-single-run-evidence-item span,
.msw-single-run-evidence-item strong,
.msw-single-run-evidence-item em {
  font-size: 12px;
  line-height: 1.25;
  min-width: 0;
  overflow-wrap: anywhere;
}

.msw-single-run-evidence-item span {
  color: #64748b;
  font-weight: 800;
}

.msw-single-run-evidence-item strong {
  color: #0f172a;
  font-weight: 900;
}

.msw-single-run-evidence-item em {
  background: #ecfdf5;
  border-radius: 999px;
  color: #047857;
  font-style: normal;
  font-weight: 900;
  padding: 4px 7px;
  white-space: nowrap;
}

.msw-single-run-policy dl {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.msw-single-run-policy dl div {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 7px;
}

.msw-single-run-policy dt,
.msw-single-run-policy dd {
  font-size: 12px;
  line-height: 1.25;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-single-run-policy dt {
  color: #64748b;
  font-weight: 800;
}

.msw-single-run-policy dd {
  color: #0f172a;
  font-weight: 900;
}

.msw-single-run-acceptance,
.msw-single-run-freeze {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.msw-single-run-acceptance span,
.msw-single-run-freeze span {
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.25;
  padding: 4px 7px;
}

.msw-single-run-acceptance span {
  background: #eef6ff;
  color: #1d4ed8;
}

.msw-single-run-freeze span {
  background: #f1f5f9;
  color: #475569;
}

.msw-single-run-summary {
  background: #fbfdff;
  border-bottom: 1px solid #e2e8f0;
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 12px;
}

.msw-single-run-summary > div {
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 9px;
}

.msw-single-run-summary strong {
  color: #0f172a;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.msw-single-run-summary span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-single-run-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, 0.55fr);
  padding: 12px;
}

.msw-single-run-steps,
.msw-single-run-side,
.msw-single-run-stop,
.msw-single-run-fallback {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.msw-single-run-steps h3,
.msw-single-run-side h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-single-run-step {
  align-items: start;
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 7px 8px;
  grid-template-columns: 32px minmax(0, 1fr) auto minmax(96px, auto);
  min-width: 0;
  padding: 9px;
}

.msw-single-run-step.is-blocked {
  background: #fff7ed;
  border-color: #fed7aa;
}

.msw-single-run-step > b {
  align-items: center;
  background: #f0fdf4;
  border-radius: 6px;
  color: #166534;
  display: inline-flex;
  font-size: 11px;
  height: 24px;
  justify-content: center;
  line-height: 1;
  width: 32px;
}

.msw-failure-path {
  display: grid;
  gap: 0;
}

.msw-failure-path-summary {
  background: #fbfdff;
  border-bottom: 1px solid #e2e8f0;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 12px;
}

.msw-failure-path-summary > div,
.msw-failure-path-detail section,
.msw-failure-path-list article {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px;
}

.msw-failure-path-summary > div.is-pass {
  border-left: 3px solid #0f766e;
}

.msw-failure-path-summary > div.is-missing {
  background: #fff7ed;
  border-left: 3px solid #f97316;
}

.msw-failure-path-summary span,
.msw-failure-path-summary em,
.msw-failure-path-detail span,
.msw-failure-path-list span,
.msw-failure-path-list em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-failure-path-summary strong,
.msw-failure-path-detail h3,
.msw-failure-path-list strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.25;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-failure-path-detail {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 12px;
}

.msw-failure-path-detail section {
  align-content: start;
}

.msw-failure-path-detail section > span {
  background: #f1f5f9;
  border-radius: 999px;
  color: #475569;
  display: inline-flex;
  font-weight: 800;
  margin-right: 6px;
  padding: 5px 8px;
  width: fit-content;
}

.msw-failure-path-list {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0 12px 12px;
}

.msw-single-run-step > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-single-run-step strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-single-run-step span,
.msw-single-run-step em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-single-run-action {
  align-self: center;
  min-width: 0;
}

.msw-single-run-action button,
.msw-single-run-action span {
  border: 1px solid #bfd0e4;
  border-radius: 8px;
  color: #0f172a;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  padding: 6px 8px;
}

.msw-single-run-action button {
  background: #ffffff;
  cursor: pointer;
}

.msw-single-run-action button:disabled {
  background: #f1f5f9;
  color: #94a3b8;
  cursor: not-allowed;
}

.msw-single-run-stop,
.msw-single-run-fallback {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  padding: 10px;
}

.msw-single-run-stop span {
  background: #fff1f2;
  border: 1px solid #fecdd3;
  border-radius: 7px;
  color: #b91c1c;
  font-size: 12px;
  font-weight: 800;
  padding: 6px 7px;
}

.msw-single-run-fallback strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-single-run-fallback span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.msw-close-loop-records {
  display: grid;
  gap: 0;
}

.msw-close-loop-record-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  padding: 12px;
}

.msw-close-loop-card {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 10px;
}

.msw-close-loop-card.needs-fallback {
  background: #fff7ed;
  border-color: #fed7aa;
}

.msw-close-loop-head {
  align-items: start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  min-width: 0;
}

.msw-close-loop-head > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-close-loop-head strong {
  color: #0f172a;
  font-size: 14px;
  overflow-wrap: anywhere;
}

.msw-close-loop-head span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-close-loop-chain {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.msw-close-loop-chain h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-close-loop-chain-step {
  align-items: start;
  background: #f8fbff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
  padding: 8px;
}

.msw-close-loop-chain-step > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-close-loop-chain-step strong,
.msw-close-loop-chain-step span,
.msw-close-loop-chain-step em {
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-close-loop-chain-step strong {
  color: #0f172a;
}

.msw-close-loop-chain-step span {
  color: #475569;
  font-weight: 800;
}

.msw-close-loop-chain-step em {
  color: #64748b;
  font-style: normal;
}

.msw-close-loop-fallback {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 8px;
}

.msw-close-loop-fallback strong {
  color: #0f172a;
  font-size: 12px;
}

.msw-close-loop-fallback span,
.msw-close-loop-fallback em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-close-loop-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
  min-width: 0;
}

.msw-close-loop-actions span {
  color: #475569;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.3;
  margin-right: auto;
  overflow-wrap: anywhere;
}

.msw-close-loop-actions button {
  background: #0f172a;
  border: 1px solid #0f172a;
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  min-height: 32px;
  padding: 0 12px;
}

.msw-close-loop-actions button:hover {
  background: #1e293b;
  border-color: #1e293b;
}

.msw-close-loop-actions button:disabled {
  background: #e2e8f0;
  border-color: #cbd5e1;
  color: #64748b;
  cursor: not-allowed;
}

.msw-close-loop-archive-ledger {
  display: grid;
  gap: 0;
}

.msw-archive-ledger-list {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.msw-archive-ledger-row {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(180px, 1fr) minmax(260px, 1.4fr) auto;
  min-width: 0;
  padding: 10px;
}

.msw-archive-ledger-row > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-archive-ledger-row strong {
  color: #0f172a;
  font-size: 14px;
  overflow-wrap: anywhere;
}

.msw-archive-ledger-row span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-archive-ledger-row dl {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  min-width: 0;
}

.msw-archive-ledger-row dl div {
  background: #f8fbff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  min-width: 0;
  padding: 7px 8px;
}

.msw-archive-ledger-row dt {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  margin: 0 0 3px;
}

.msw-archive-ledger-row dd {
  color: #0f172a;
  font-size: 12px;
  font-weight: 800;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-archive-ledger-row button {
  background: #0f172a;
  border: 1px solid #0f172a;
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  min-height: 34px;
  padding: 0 12px;
  white-space: nowrap;
}

.msw-archive-ledger-row button:hover {
  background: #1e293b;
  border-color: #1e293b;
}

.msw-readiness-action {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 8px;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px 9px;
}

.msw-readiness-action strong {
  color: #166534;
  font-size: 13px;
}

.msw-readiness-action.msw-readiness-blocked {
  background: #fff1f2;
  border-color: #fecdd3;
  cursor: not-allowed;
}

.msw-readiness-action.msw-readiness-blocked strong {
  color: #b91c1c;
}

.msw-l2-sample-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  padding: 12px;
}

.msw-l2-sample-card {
  background: #f8fbff;
  border: 1px solid #d7e2f0;
  border-radius: 8px;
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 10px;
}

.msw-l2-sample-card strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-l2-sample-card span,
.msw-l2-sample-card em,
.msw-l2-sample-card p {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.4;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-l2-sample-card b {
  color: #334155;
  display: inline-block;
  margin-right: 6px;
}

.msw-l2-next-sample {
  background: #f8fbff;
  border: 1px solid #cbdcf0;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  margin: 12px;
  padding: 12px;
}

.msw-l2-next-sample > div:first-child {
  display: grid;
  gap: 4px;
}

.msw-l2-next-sample strong {
  color: #0f172a;
  font-size: 14px;
}

.msw-l2-next-sample span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.45;
}

.msw-l2-next-sample-actions {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.msw-l2-next-sample-actions button {
  background: #ffffff;
  border: 1px solid #cbdcf0;
  border-radius: 8px;
  cursor: pointer;
  display: grid;
  gap: 4px;
  min-height: 74px;
  padding: 10px;
  text-align: left;
}

.msw-l2-next-sample-actions button:hover {
  border-color: #2563eb;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.09);
}

.msw-l2-next-sample-actions button b {
  color: #1d4ed8;
  font-size: 13px;
  margin: 0;
}

.msw-l2-verified-entry {
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  padding: 8px;
}

.msw-l2-verified-entry b {
  color: #0f172a;
  font-size: 12px;
  margin: 0;
}

.msw-l2-verified-entry span,
.msw-l2-verified-entry em,
.msw-l2-verified-entry small {
  font-size: 11px;
  line-height: 1.35;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-l2-verified-entry.is-enabled {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.msw-l2-verified-entry.is-enabled span {
  color: #166534;
  font-weight: 800;
}

.msw-l2-verified-entry.is-frozen {
  background: #fff7ed;
  border-color: #fed7aa;
}

.msw-l2-verified-entry.is-frozen span {
  color: #9a3412;
  font-weight: 800;
}

.msw-l2-step-plan {
  background: #ffffff;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 7px;
  padding: 8px;
}

.msw-l2-step-plan > b {
  color: #0f172a;
  font-size: 12px;
  margin: 0;
}

.msw-l2-step-plan ol {
  display: grid;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.msw-l2-step-plan li {
  align-items: start;
  display: grid;
  gap: 3px 6px;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  min-width: 0;
}

.msw-l2-step-plan li > span {
  align-items: center;
  background: #eef6ff;
  border-radius: 6px;
  color: #1d4ed8;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  height: 22px;
  justify-content: center;
  line-height: 1;
  width: 28px;
}

.msw-l2-step-plan li > strong {
  align-self: center;
  font-size: 12px;
  line-height: 1.35;
  min-width: 0;
}

.msw-l2-step-plan li > em {
  align-self: center;
  background: #f1f5f9;
  border-radius: 999px;
  color: #475569;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  padding: 5px 7px;
  white-space: nowrap;
}

.msw-l2-step-plan li > small {
  color: #64748b;
  font-size: 11px;
  grid-column: 2 / 4;
  line-height: 1.35;
  min-width: 0;
  overflow-wrap: anywhere;
}

.msw-l2-step-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  grid-column: 2 / 4;
}

.msw-l2-step-actions button {
  background: #ffffff;
  border: 1px solid #bfdbfe;
  border-radius: 6px;
  color: #1d4ed8;
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  padding: 5px 7px;
}

.msw-l2-step-actions button:hover {
  background: #eff6ff;
}

.msw-l2-sample-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}

.msw-l2-sample-actions button {
  background: #ffffff;
  border: 1px solid #bfdbfe;
  border-radius: 6px;
  color: #1d4ed8;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  padding: 5px 8px;
}

.msw-l2-sample-actions button:hover {
  background: #eff6ff;
}

.msw-current-sample {
  display: grid;
  gap: 12px;
}

.msw-current-sample-head {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #d7e2f0;
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 12px;
}

.msw-current-sample-head > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.msw-current-sample-head strong {
  color: #0f172a;
  font-size: 15px;
}

.msw-current-sample-head span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.45;
}

.msw-current-sample-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.msw-current-sample-actions button {
  background: #fff;
  border: 1px solid #2563eb;
  border-radius: 6px;
  color: #1d4ed8;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  min-height: 34px;
  padding: 7px 10px;
}

.msw-current-sample-layout {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) 260px;
}

.msw-current-sample-steps {
  display: grid;
  gap: 8px;
}

.msw-current-sample-step {
  align-items: start;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 6px 10px;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  padding: 10px;
}

.msw-current-sample-step b {
  align-items: center;
  background: #eef6ff;
  border-radius: 6px;
  color: #1d4ed8;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  height: 24px;
  justify-content: center;
  width: 34px;
}

.msw-current-sample-step div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-current-sample-step strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-current-sample-step span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.msw-current-sample-step em {
  align-self: center;
  background: #f1f5f9;
  border-radius: 999px;
  color: #475569;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  padding: 5px 8px;
  white-space: nowrap;
}

.msw-current-sample-step.is-pass {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.msw-current-sample-step.is-pass em {
  background: #dcfce7;
  color: #166534;
}

.msw-current-sample-step.is-now {
  background: #fff7ed;
  border-color: #fed7aa;
}

.msw-current-sample-step.is-now em {
  background: #ffedd5;
  color: #9a3412;
}

.msw-current-sample-step.is-locked {
  background: #f8fafc;
  border-color: #e2e8f0;
}

.msw-current-sample-step.is-locked em {
  background: #e2e8f0;
  color: #475569;
}

.msw-current-sample-proof {
  align-self: start;
  border: 1px solid #dbe6f3;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 12px;
}

.msw-current-sample-proof h3 {
  color: #0f172a;
  font-size: 13px;
  margin: 0;
}

.msw-current-sample-proof span {
  background: #f8fafc;
  border-radius: 6px;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  padding: 7px 8px;
}

.msw-current-sample-proof small {
  color: #64748b;
  font-size: 11px;
  line-height: 1.4;
}

@media (max-width: 900px) {
  .msw-controlled-window-layout,
  .msw-operator-layout,
  .msw-current-sample-layout {
    grid-template-columns: 1fr;
  }

  .msw-controlled-window-primary {
    align-items: flex-start;
    flex-direction: column;
  }

  .msw-controlled-window-copy-actions {
    justify-content: flex-start;
    width: 100%;
  }

  .msw-controlled-window-evidence > div,
  .msw-controlled-window-rules dl,
  .msw-controlled-window-task {
    grid-template-columns: 1fr;
  }

  .msw-delivery-readiness-summary,
  .msw-delivery-readiness-grid,
  .msw-delivery-handoff-brief,
  .msw-delivery-handoff-summary,
  .msw-delivery-handoff-grid,
  .msw-service-env-summary,
  .msw-service-env-grid {
    grid-template-columns: 1fr;
  }

  .msw-delivery-handoff-evidence > div,
  .msw-delivery-handoff-scope dl div {
    grid-template-columns: 1fr;
  }

  .msw-single-run-current,
  .msw-single-run-summary,
  .msw-single-run-grid,
  .msw-failure-path-summary,
  .msw-failure-path-detail,
  .msw-failure-path-list {
    grid-template-columns: 1fr;
  }

  .msw-single-run-policy dl,
  .msw-single-run-evidence-item {
    grid-template-columns: 1fr;
  }

  .msw-single-run-evidence-item em {
    justify-self: start;
    white-space: normal;
  }

  .msw-close-loop-record-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .msw-archive-ledger-row {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .msw-archive-ledger-row dl {
    grid-template-columns: 1fr;
  }

  .msw-archive-ledger-row button {
    justify-self: start;
    white-space: normal;
  }

  .msw-service-env-confirmation-row {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .msw-service-env-confirmation-row dl {
    grid-template-columns: 1fr;
  }

  .msw-operator-task {
    grid-template-columns: 32px minmax(0, 1fr) auto;
  }

  .msw-operator-task small {
    grid-column: 2 / 4;
    justify-self: start;
  }

  .msw-operator-task-action {
    grid-column: 2 / 3;
    justify-self: start;
  }

  .msw-single-run-step {
    grid-template-columns: 32px minmax(0, 1fr) auto;
  }

  .msw-single-run-action {
    grid-column: 2 / 4;
  }
}

.msw-list-item {
  align-items: flex-start;
  border-bottom: 1px solid #e5edf5;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
  min-width: 0;
  padding: 11px 12px;
}

.msw-list-item:last-child {
  border-bottom: 0;
}

.msw-list-item.msw-source-row-focus {
  background: #eff6ff;
  box-shadow: inset 3px 0 0 #2563eb;
}

.msw-list-item.msw-fact-row-focus {
  background: #f0fdf4;
  box-shadow: inset 3px 0 0 #16a34a;
}

.msw-list-item.msw-platform-package-row-focus {
  background: #fff7ed;
  box-shadow: inset 3px 0 0 #f97316;
}

.msw-list-item > div:first-child {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.msw-list-item strong {
  color: #0f172a;
  font-size: 14px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.msw-list-item span,
.msw-list-item em {
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-ai-business-task {
  background: #fbfdff;
}

.msw-ai-business-task .msw-actions {
  max-width: min(230px, 48%);
}

.msw-ai-primary-action {
  background: #2563eb !important;
  border-color: #1d4ed8 !important;
  color: #fff !important;
  min-width: 128px;
}

.msw-ai-primary-action:hover {
  background: #1d4ed8 !important;
  color: #fff !important;
}

.msw-platform-primary-action {
  background: #2563eb !important;
  border-color: #1d4ed8 !important;
  color: #fff !important;
  min-width: 128px;
}

.msw-platform-primary-action:hover {
  background: #1d4ed8 !important;
  color: #fff !important;
}

.msw-platform-secondary-actions {
  flex: 1 1 100%;
  min-width: 0;
}

.msw-platform-secondary-actions summary {
  color: #475569;
  cursor: pointer;
  font-size: 12px;
  line-height: 1.4;
  list-style-position: inside;
}

.msw-platform-secondary-actions div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.msw-platform-business-result {
  align-items: flex-start;
  background: #f8fafc;
  border: 1px solid #d7e2f0;
  border-radius: 7px;
  display: grid;
  gap: 2px;
  margin-top: 6px;
  max-width: 720px;
  padding: 7px 9px;
}

.msw-platform-business-result strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-platform-business-result span {
  color: #475569;
  font-size: 12px;
}

.msw-platform-business-result.ready {
  background: #ecfdf5;
  border-color: #bbf7d0;
}

.msw-platform-business-result.ready strong {
  color: #047857;
}

.msw-platform-business-result.missing {
  background: #fffbeb;
  border-color: #fde68a;
}

.msw-platform-business-result.missing strong {
  color: #b45309;
}

.msw-platform-business-result.manual {
  background: #fff1f2;
  border-color: #fecdd3;
}

.msw-platform-business-result.manual strong {
  color: #be123c;
}

.msw-ai-business-flow {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 6px;
}

.msw-ai-step {
  background: #f8fafc;
  border: 1px solid #d7e2f0;
  border-radius: 6px;
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 6px 8px;
}

.msw-ai-step strong {
  font-size: 12px;
}

.msw-ai-step em {
  color: #64748b;
  font-size: 11px;
  font-style: normal;
}

.msw-ai-step.done {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.msw-ai-step.active {
  background: #eff6ff;
  border-color: #bfdbfe;
}

.msw-list-meta {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.msw-source-assets {
  border-top: 1px dashed #d8e3ef;
  display: flex;
  flex: 1 1 100%;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  padding-top: 8px;
}

.msw-source-asset-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.msw-source-asset-row > span {
  color: #0f172a;
  flex: 1 1 160px;
  font-weight: 700;
  min-width: 0;
}

.msw-source-asset-row > em {
  flex: 0 1 auto;
}

.msw-exception-panel {
  border-color: #fdba74;
}

.msw-exception-panel .msw-panel-head {
  background: #fff7ed;
  border-bottom-color: #fed7aa;
}

.msw-exception-item {
  background: #fffaf5;
}

.msw-exception-item .msw-field-list span {
  background: #fff7ed;
  color: #9a3412;
}

.msw-exception-actions {
  align-items: flex-end;
  gap: 6px;
}

.msw-exception-actions button {
  background: #fff;
  border: 1px solid #fdba74;
  border-radius: 7px;
  color: #9a3412;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  min-height: 30px;
  padding: 5px 9px;
}

.msw-exception-audit {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.msw-exception-audit span {
  background: #fff;
  border: 1px solid #fed7aa;
  border-radius: 999px;
  color: #9a3412;
  font-size: 11px;
  padding: 3px 7px;
}

.msw-blocker-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.msw-blocker-list span {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 6px;
  color: #9a3412;
  font-size: 11px;
  line-height: 1.35;
  padding: 3px 6px;
}

.msw-detail-stack {
  display: grid;
  gap: 8px;
  flex: 1 0 100%;
  margin-top: 8px;
}

.msw-mini-card {
  background: #f8fbff;
  border: 1px solid #d7e2f0;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  padding: 8px 10px;
}

.msw-mini-card strong,
.msw-mini-card span,
.msw-mini-card em {
  overflow-wrap: anywhere;
}

.msw-fact-grid {
  display: grid;
  flex: 1 0 100%;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 8px 0 0;
}

.msw-fact-grid div {
  background: #f8fbff;
  border: 1px solid #d7e2f0;
  border-radius: 8px;
  min-width: 0;
  padding: 8px 10px;
}

.msw-fact-grid dt,
.msw-fact-grid dd {
  margin: 0;
}

.msw-fact-grid dt {
  color: #64748b;
  font-size: 12px;
}

.msw-fact-grid dd {
  color: #172033;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.msw-field-list {
  display: flex;
  flex: 1 0 100%;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.msw-field-list span {
  background: #edf4ff;
  border-radius: 999px;
  color: #35506f;
  font-size: 12px;
  font-weight: 700;
  overflow-wrap: anywhere;
  padding: 5px 8px;
}

.msw-preflight {
  align-items: flex-start;
  background: #f8fafc;
  border: 1px solid #dbe5f1;
  border-radius: 8px;
  display: grid;
  flex: 1 0 100%;
  gap: 6px;
  margin-top: 8px;
  padding: 8px 10px;
}

.msw-preflight em,
.msw-preflight small {
  color: #526276;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.msw-preflight > div {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.msw-detail-modal {
  width: min(1080px, calc(100vw - 24px));
}

.msw-detail-modal .modal-body {
  display: grid;
  gap: 12px;
}

.msw-detail-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.msw-detail-grid div,
.msw-detail-section {
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  min-width: 0;
  padding: 9px 10px;
}

.msw-detail-grid dt,
.msw-detail-grid dd,
.msw-detail-section h3 {
  margin: 0;
}

.msw-detail-grid dt,
.msw-detail-section h3 span {
  color: #64748b;
  font-size: 12px;
}

.msw-detail-grid dd {
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
  margin-top: 3px;
  overflow-wrap: anywhere;
}

.msw-detail-section {
  display: grid;
  gap: 8px;
}

.msw-detail-section h3 {
  color: #0f172a;
  display: flex;
  font-size: 14px;
  gap: 8px;
  justify-content: space-between;
}

.msw-detail-section pre {
  background: #f8fafc;
  border: 1px solid #e5edf5;
  border-radius: 8px;
  color: #334155;
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
  max-height: 260px;
  overflow: auto;
  padding: 10px;
  white-space: pre-wrap;
  word-break: break-word;
}

.msw-review-form {
  display: grid;
  gap: 12px;
}

.msw-review-version-list {
  display: grid;
  gap: 8px;
}

.msw-review-version {
  background: #f8fbff;
  border: 1px solid #d7e2f0;
  border-radius: 8px;
  color: #0f172a;
  cursor: pointer;
  display: grid;
  gap: 6px;
  padding: 9px 10px;
}

.msw-review-version-head {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.msw-review-version-head strong {
  font-size: 14px;
}

.msw-review-version-head em,
.msw-review-version > span,
.msw-review-claims span,
.msw-review-note span,
.msw-review-check span {
  color: #64748b;
  font-size: 12px;
}

.msw-review-claims {
  border-top: 1px solid #e5edf5;
  display: grid;
  gap: 5px;
  padding-top: 7px;
}

.msw-review-claims label,
.msw-review-check {
  align-items: center;
  display: flex;
  gap: 7px;
}

.msw-review-comparison {
  overflow: hidden;
}

.msw-review-comparison-summary {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.msw-review-comparison-summary div,
.msw-review-guidance,
.msw-review-conflicts,
.msw-review-tags {
  background: #f8fbff;
  border: 1px solid #d7e2f0;
  border-radius: 8px;
  min-width: 0;
  padding: 7px 8px;
}

.msw-review-comparison-summary strong,
.msw-review-comparison-summary span,
.msw-review-guidance span,
.msw-review-guidance em,
.msw-review-conflicts strong,
.msw-review-conflicts span,
.msw-review-conflicts em,
.msw-review-tags strong,
.msw-review-tags span {
  overflow-wrap: anywhere;
}

.msw-review-comparison-summary div,
.msw-review-guidance {
  display: grid;
  gap: 3px;
}

.msw-review-comparison-summary strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-review-comparison-summary span,
.msw-review-guidance span,
.msw-review-guidance em,
.msw-review-conflicts span,
.msw-review-conflicts em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
}

.msw-review-tags {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.msw-review-tags strong {
  color: #334155;
  font-size: 12px;
}

.msw-review-tags span {
  background: #e8f1ff;
  border-radius: 999px;
  color: #35506f;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 7px;
}

.msw-review-comparison-table {
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  display: grid;
  overflow: hidden;
}

.msw-review-comparison-row {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(100px, 0.8fr) minmax(82px, 0.55fr) minmax(0, 2.4fr);
  padding: 7px 8px;
}

.msw-review-comparison-row + .msw-review-comparison-row {
  border-top: 1px solid #e5edf5;
}

.msw-review-comparison-row.head {
  background: #eef5ff;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.msw-review-comparison-row.needs-review {
  background: #fffaf0;
}

.msw-review-comparison-row strong,
.msw-review-comparison-row span,
.msw-review-comparison-row em {
  color: #334155;
  font-size: 12px;
  font-style: normal;
  overflow-wrap: anywhere;
}

.msw-review-comparison-row div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-review-conflicts {
  display: grid;
  gap: 5px;
}

.msw-review-conflicts div {
  display: grid;
  gap: 2px;
}

.msw-review-note {
  display: grid;
  gap: 6px;
}

.msw-review-note textarea {
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  color: #0f172a;
  font: inherit;
  min-height: 74px;
  padding: 9px 10px;
  resize: vertical;
}

.msw-review-overrides {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.msw-review-overrides label {
  display: grid;
  gap: 5px;
}

.msw-review-overrides span {
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.msw-review-overrides textarea {
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  color: #0f172a;
  font: inherit;
  min-height: 46px;
  padding: 8px 9px;
  resize: vertical;
}

.msw-review-assignment p {
  color: #64748b;
  font-size: 12px;
  line-height: 1.55;
  margin: 0;
}

.msw-review-assignment button {
  justify-self: start;
}

.msw-review-actions {
  justify-content: flex-end;
  margin-top: 0;
  padding: 0;
}

.msw-review-terminal {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: space-between;
}

.msw-review-terminal strong,
.msw-review-terminal span {
  overflow-wrap: anywhere;
}

.msw-platform-target-controls {
  border-top: 1px solid #e5edf5;
  display: grid;
  gap: 8px;
  margin-top: 8px;
  padding-top: 8px;
}

.msw-platform-target-head {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(120px, 1fr) minmax(120px, 180px) auto;
}

.msw-platform-target-head strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-platform-target-head span {
  color: #64748b;
  font-size: 12px;
}

.msw-inline-warning {
  background: #fffbeb;
  border: 1px solid #f59e0b;
  border-radius: 6px;
  color: #92400e;
  font-size: 12px;
  line-height: 1.45;
  padding: 8px 10px;
}

.msw-platform-target-head input {
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  min-height: 32px;
  padding: 0 9px;
}

.msw-platform-target-grid {
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.msw-platform-target {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-width: 0;
  padding: 8px;
}

.msw-platform-target span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.msw-platform-target strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-platform-target em,
.msw-platform-target small {
  color: #64748b;
  font-size: 11px;
  font-style: normal;
  overflow-wrap: anywhere;
}

.msw-platform-field-editor {
  background: #f8fbff;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 10px;
}

.msw-platform-field-editor-head {
  align-items: flex-start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.msw-platform-field-editor-head > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-platform-field-editor strong {
  color: #0f172a;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.msw-platform-field-editor span,
.msw-platform-field-editor em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  overflow-wrap: anywhere;
}

.msw-platform-field-editor textarea {
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  color: #0f172a;
  font: inherit;
  min-height: 42px;
  padding: 8px 9px;
  resize: vertical;
}

.msw-platform-field-editor-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.msw-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 0;
}

.msw-tag {
  align-items: center;
  background: #eef2f7;
  border: 1px solid #dbe5ef;
  border-radius: 999px;
  color: #475569;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  max-width: 100%;
  min-height: 22px;
  overflow-wrap: normal;
  padding: 2px 7px;
  white-space: nowrap;
  word-break: normal;
}

.msw-tag.success {
  background: #e8f8ee;
  border-color: #b7e6c5;
  color: #15803d;
}

.msw-tag.warning {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #c2410c;
}

.msw-tag.danger {
  background: #fff1f2;
  border-color: #fecdd3;
  color: #b91c1c;
}

.msw-workbench-error {
  align-items: flex-start;
  background: #fff7ed;
  border: 1px solid #fdba74;
  border-radius: 10px;
  color: #9a3412;
  display: flex;
  gap: 10px;
  padding: 11px 13px;
}

.msw-workbench-error strong {
  color: #7c2d12;
  flex: 0 0 auto;
  font-size: 13px;
}

.msw-workbench-error span {
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.msw-empty {
  color: #64748b;
  font-size: 13px;
  padding: 14px;
}

.msw-subpanel {
  background: #f8fafc;
  border-top: 1px solid #e5edf5;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px;
}

.msw-platform-layout {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1.8fr) minmax(260px, 0.8fr);
}

.msw-platform-layout > aside {
  background: #f8fafc;
  border-left: 1px solid #e5edf5;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
}

.msw-platform-layout h3 {
  font-size: 13px;
  margin-top: 4px;
}

.msw-platform-groups {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.msw-platform-safety-note {
  background: #f8fafc;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
  padding: 9px 11px;
}

.msw-platform-group {
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  overflow: hidden;
}

.msw-platform-group-head {
  align-items: flex-start;
  background: #f8fafc;
  border-bottom: 1px solid #e5edf5;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding: 10px 12px;
}

.msw-platform-group-head > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.msw-platform-group-head strong {
  color: #0f172a;
  font-size: 14px;
}

.msw-platform-group-head span,
.msw-platform-group-meta span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
}

.msw-platform-group-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
  max-width: 60%;
}

.msw-platform-group-meta span {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 3px 7px;
}

.msw-capability,
.msw-live-metadata,
.msw-compact-row {
  align-items: center;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-height: 34px;
  padding: 7px 9px;
}

.msw-capability > div,
.msw-live-metadata > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.msw-capability span,
.msw-live-metadata span,
.msw-compact-row span {
  color: #475569;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.msw-capability-meta {
  color: #64748b;
  font-size: 11px;
  font-style: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.msw-live-blockers {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 3px;
}

.msw-live-blockers .msw-tag {
  font-size: 10px;
  line-height: 1.2;
}

.msw-manual-groups {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.msw-manual-group {
  border-top: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 8px;
}

.msw-manual-group:first-child {
  border-top: 0;
  padding-top: 0;
}

.msw-manual-group-head {
  align-items: flex-start;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.msw-manual-group-head strong {
  color: #0f172a;
  flex: 0 0 auto;
  font-size: 12px;
}

.msw-manual-group-head span {
  color: #64748b;
  font-size: 11px;
  line-height: 1.35;
  text-align: right;
}

.msw-manual-row span {
  white-space: normal;
}

.msw-watch-refresh-status {
  grid-column: 1 / -1;
}

.msw-watch-refresh-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
}

.msw-watch-refresh-grid div {
  background: #f8fafc;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-height: 62px;
  padding: 10px;
}

.msw-watch-refresh-grid span,
.msw-watch-refresh-line {
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
}

.msw-watch-refresh-grid strong {
  color: #0f172a;
  font-size: 15px;
  overflow-wrap: anywhere;
}

.msw-watch-refresh-health.pass {
  color: #15803d;
}

.msw-watch-refresh-health.pending {
  color: #b45309;
}

.msw-watch-refresh-health.warning {
  color: #b91c1c;
}

.msw-watch-refresh-line {
  margin-top: 10px;
  overflow-wrap: anywhere;
}

.msw-watch-row {
  align-items: stretch;
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 10px;
}

.msw-watch-row.readonly {
  background: #fffaf0;
  border-color: #fed7aa;
}

.msw-watch-main {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.msw-watch-title,
.msw-watch-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.msw-watch-title strong {
  color: #0f172a;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.msw-watch-grid {
  display: grid;
  gap: 5px 10px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.msw-watch-grid span,
.msw-watch-line {
  color: #475569;
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.msw-watch-blockers {
  color: #c2410c;
}

.msw-watch-actions {
  align-content: flex-start;
  justify-content: flex-end;
  max-width: 180px;
}

.msw-watch-actions button {
  background: #fff;
  border: 1px solid #b9c9df;
  border-radius: 7px;
  color: #0f172a;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  min-height: 28px;
  padding: 4px 8px;
}

.msw-watch-actions button:hover {
  border-color: #2563eb;
  color: #1d4ed8;
}

.msw-watch-actions button.primary {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}

.msw-watch-actions button.danger {
  border-color: #fecaca;
  color: #b91c1c;
}

.msw-execution-center {
  overflow: visible;
}

.msw-execution-columns {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
  padding: 12px;
}

.msw-execution-columns > section,
.msw-execution-list,
.msw-execution-task-list {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.msw-execution-subhead {
  align-items: flex-start;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
}

.msw-execution-subhead strong {
  color: #0f172a;
  font-size: 13px;
}

.msw-execution-subhead span,
.msw-execution-gate-note,
.msw-execution-result span,
.msw-execution-outcome span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.msw-execution-task-row,
.msw-execution-row {
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.msw-execution-task-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.msw-execution-task-row > div:first-child,
.msw-execution-row-main > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.msw-execution-task-row strong,
.msw-execution-row-main strong {
  color: #0f172a;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.msw-execution-task-row span,
.msw-execution-row-main span {
  color: #64748b;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.msw-execution-row-main,
.msw-execution-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: space-between;
}

.msw-execution-fields {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin: 0;
}

.msw-execution-fields div {
  background: #f8fbff;
  border: 1px solid #d7e2f0;
  border-radius: 8px;
  min-width: 0;
  padding: 7px 8px;
}

.msw-execution-fields dt,
.msw-execution-fields dd {
  margin: 0;
}

.msw-execution-fields dt {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.msw-execution-fields dd {
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.msw-execution-actions {
  justify-content: flex-end;
}

.msw-execution-actions button {
  background: #fff;
  border: 1px solid #b9c9df;
  border-radius: 7px;
  color: #0f172a;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  min-height: 30px;
  padding: 5px 8px;
}

.msw-execution-actions button:hover {
  border-color: #2563eb;
  color: #1d4ed8;
}

.msw-execution-actions button.msw-action-next {
  background: #eff6ff;
  border-color: #2563eb;
  color: #1d4ed8;
}

.msw-execution-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.msw-execution-outcome,
.msw-execution-result {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  padding: 8px 9px;
}

.msw-execution-checklist,
.msw-execution-report {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 8px 9px;
}

.msw-execution-checklist > div:first-child,
.msw-execution-report > strong {
  align-items: center;
  color: #0f172a;
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  gap: 6px;
}

.msw-check-grid,
.msw-execution-report dl {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin: 0;
}

.msw-check,
.msw-execution-report dl div {
  background: #fff;
  border: 1px solid #d7e2f0;
  border-radius: 7px;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 7px 8px;
}

.msw-check.pass {
  border-color: #bbf7d0;
}

.msw-check.blocked,
.msw-check.failed {
  border-color: #fecaca;
}

.msw-check span,
.msw-execution-report dd {
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-check em,
.msw-execution-report dt {
  color: #64748b;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  margin: 0;
  overflow-wrap: anywhere;
}

.msw-execution-result {
  margin: 12px 12px 0;
}

.msw-execution-result.success {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.msw-execution-result.error {
  background: #fff7ed;
  border-color: #fdba74;
}

.msw-execution-gate-note {
  margin: 0;
}

.msw-compact-row strong {
  color: #0f172a;
  font-size: 12px;
}

.msw-compact-row button {
  background: #fff;
  border: 1px solid #b9c9df;
  border-radius: 7px;
  color: #0f172a;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  min-height: 28px;
  padding: 4px 8px;
}

.msw-compact-row button:hover {
  border-color: #2563eb;
  color: #1d4ed8;
}

.msw-action-reason {
  color: #c2410c;
}

.msw-readonly-panel {
  min-height: 140px;
}

@media (max-width: 1180px) {
  .msw-grid {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  }

  .msw-panel-wide {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .msw-intake-bar,
  .msw-list-item {
    align-items: stretch;
    flex-direction: column;
  }

  .msw-grid,
  .msw-readiness-action-groups,
  .msw-shop-sync-body,
  .msw-execution-columns,
  .msw-platform-layout {
    grid-template-columns: 1fr;
  }

  .msw-fact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .msw-ai-business-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .msw-detail-grid {
    grid-template-columns: 1fr;
  }

  .msw-panel-wide {
    grid-column: 1 / -1;
  }

  .msw-platform-layout > aside {
    border-left: 0;
    border-top: 1px solid #e5edf5;
  }

  .msw-actions,
  .msw-execution-actions,
  .msw-button-row {
    justify-content: flex-start;
  }

  .msw-execution-task-row,
  .msw-execution-subhead {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .msw-workbench-error {
    flex-direction: column;
  }

  .msw-fact-grid {
    grid-template-columns: 1fr;
  }
}

.ct-panel-tools {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.ct-split {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(360px, 0.9fr) minmax(520px, 1.2fr);
}

.ct-table-wrap {
  max-width: 100%;
  overflow: auto;
}

.ct-table-wrap-short {
  max-height: 520px;
}

.ct-table {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
  min-width: 980px;
  width: 100%;
}

.ct-table th,
.ct-table td {
  border-bottom: 1px solid #e2e8f0;
  border-right: 1px solid #e2e8f0;
  line-height: 1.35;
  max-width: 260px;
  padding: 8px 9px;
  text-align: left;
  vertical-align: top;
}

.ct-table th {
  background: #f1f5f9;
  color: #334155;
  font-weight: 800;
  position: sticky;
  top: 0;
  z-index: 1;
}

.ct-table tr:hover td {
  background: #f8fbff;
}

.ct-coverage .ct-table {
  min-width: 1680px;
}

.ct-ellipsis {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
  white-space: nowrap;
}

.ct-status {
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  padding: 5px 8px;
  white-space: nowrap;
}

.ct-status-ok {
  background: #dcfce7;
  color: #166534;
}

.ct-status-warn {
  background: #fff7ed;
  color: #c2410c;
}

.ct-status-muted {
  background: #eef2ff;
  color: #334155;
}

.ct-validation-groups {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  padding: 12px;
}

.ct-automation-note {
  background: #f8fbff;
  border-bottom: 1px solid #e2e8f0;
  color: #475569;
  font-size: 13px;
  padding: 10px 12px;
}

.ct-manual-panel {
  background: #fff;
  border: 1px solid #dbe6f2;
  border-radius: 10px;
  display: grid;
  gap: 12px;
  overflow: hidden;
  padding-bottom: 12px;
}

.ct-manual-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, minmax(140px, 1fr)) auto auto;
  padding: 0 12px;
}

.ct-manual-grid input,
.ct-manual-grid select,
.ct-manual-upload input,
.ct-manual-upload textarea {
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  color: #0f172a;
  font: inherit;
  min-height: 34px;
  min-width: 0;
  padding: 6px 9px;
}

.ct-manual-grid button,
.ct-manual-upload button {
  background: #fff;
  border: 1px solid #b9c9df;
  border-radius: 7px;
  color: #0f172a;
  cursor: pointer;
  font-weight: 700;
  min-height: 34px;
  padding: 6px 10px;
}

.ct-manual-grid button:disabled {
  color: #94a3b8;
  cursor: not-allowed;
}

.ct-manual-upload {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) 240px;
  padding: 0 12px;
}

.ct-manual-upload label,
.ct-manual-side {
  display: grid;
  gap: 8px;
}

.ct-manual-upload label span {
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.ct-manual-upload textarea {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  min-height: 190px;
  resize: vertical;
}

.ct-manual-side pre {
  background: #0f172a;
  border-radius: 8px;
  color: #e2e8f0;
  margin: 0;
  max-height: 150px;
  overflow: auto;
  padding: 8px;
}

.ct-manual-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.ct-manual-summary span {
  background: #f7faff;
  border: 1px solid #d8e2ef;
  border-radius: 999px;
  color: #42526e;
  font-size: 12px;
  font-weight: 700;
  padding: 5px 9px;
}

.ct-validation-groups section {
  border: 1px solid #dbe6f2;
  border-radius: 8px;
  min-height: 140px;
  padding: 10px;
}

.ct-validation-groups h3 {
  align-items: center;
  display: flex;
  font-size: 14px;
  justify-content: space-between;
  margin: 0 0 8px;
}

.ct-validation-item {
  border-top: 1px solid #e2e8f0;
  padding: 8px 0;
}

.ct-validation-item p {
  margin: 4px 0;
}

.ct-validation-item em {
  color: #64748b;
  font-style: normal;
}

.ct-drawer {
  background: #fff;
  border-left: 1px solid #dbe6f2;
  box-shadow: -16px 0 32px rgba(15, 23, 42, 0.12);
  bottom: 0;
  max-width: min(980px, 88vw);
  overflow: auto;
  padding: 18px;
  position: fixed;
  right: 0;
  top: 0;
  width: 760px;
  z-index: 40;
}

.ct-drawer h2 {
  margin: 0 42px 4px 0;
}

.ct-drawer-close {
  position: absolute;
  right: 14px;
  top: 14px;
}

.ct-drawer pre {
  background: #0f172a;
  border-radius: 8px;
  color: #e2e8f0;
  max-height: 240px;
  overflow: auto;
  padding: 10px;
}

@media (max-width: 1100px) {
  .ct-kpis {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }

  .ct-toolbar,
  .ct-grid-form,
  .ct-grid-form-binding,
  .ct-manual-grid,
  .ct-manual-upload,
  .ct-split,
  .ct-validation-groups {
    grid-template-columns: 1fr;
  }
}

/* Temu product collection follows a Feishu-like horizontal field table:
   only selector and row number are frozen; product fields scroll naturally. */
.temu-product-table th[data-field="media"],
.temu-product-table td[data-column="media"],
.temu-product-table th[data-field="main_image"],
.temu-product-table td[data-column="main_image"],
.temu-product-table th[data-field="video"],
.temu-product-table td[data-column="video"],
.temu-product-table th[data-field="title"],
.temu-product-table td[data-column="title"],
.temu-product-table th[data-field^="product_image_"],
.temu-product-table td[data-column^="product_image_"] {
  position: static;
  left: auto;
  z-index: auto;
  box-shadow: none;
}

.temu-product-table tbody tr:hover td[data-column="video"],
.temu-product-table tbody tr:hover td[data-column="title"],
.temu-product-table tbody tr:hover td[data-column^="product_image_"] {
  background: inherit;
}

.temu-product-ai-header-run {
  opacity: 1 !important;
  width: auto;
  min-width: auto;
  height: 20px;
  padding: 0 6px;
  border: 1px solid #c7d2fe;
  border-radius: 4px;
  background: #eef2ff;
  color: #2563eb;
  font-size: 11px;
  font-weight: 800;
}

.performance-toolbar input,
.performance-toolbar select {
  min-width: 150px;
}

.performance-toolbar button {
  min-width: 72px;
  white-space: nowrap;
}

.performance-stats .performance-stat em {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
}

.performance-grid {
  margin-top: 14px;
}

.performance-source-list {
  display: grid;
  gap: 10px;
}

.performance-mini {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-tint);
}

.performance-mini > div {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.performance-mini strong,
.performance-kr strong {
  display: block;
}

.performance-mini span,
.performance-kpi-head span,
.performance-okr-head span,
.performance-kpi-meta,
.performance-initiative-row,
.performance-kr span {
  color: var(--muted);
  font-size: 12px;
}

.performance-mini p,
.performance-okr-card p {
  margin: 0;
  color: #334155;
  line-height: 1.6;
}

.performance-mini-status {
  display: flex;
  align-items: center;
  gap: 8px;
}

.cycle-toolbar .toolbar-left {
  align-items: center;
}

.cycle-stats {
  margin-top: 14px;
}

.cycle-visual-panel {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.cycle-visual-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.cycle-visual-card,
.cycle-factor-strip article,
.cycle-report-card {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-tint);
}

.cycle-visual-card.risk,
.cycle-report-card.risk,
.cycle-person.risk {
  border-left: 4px solid var(--danger);
}

.cycle-visual-card span,
.cycle-visual-card em,
.cycle-factor-strip span,
.cycle-report-card em,
.cycle-report-card p,
.cycle-person span,
.cycle-person em,
.cycle-person small {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.cycle-visual-card strong {
  font-size: 26px;
}

.cycle-factor-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.cycle-board-layout {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 14px;
  margin-top: 14px;
}

.cycle-board-layout.single {
  grid-template-columns: minmax(0, 1fr);
}

.cycle-queue-panel,
.cycle-detail,
.cycle-column,
.cycle-column-list,
.cycle-people-list {
  display: grid;
  gap: 12px;
  align-content: start;
}

.cycle-person {
  display: grid;
  gap: 5px;
  width: 100%;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  text-align: left;
}

.cycle-person.active {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.cycle-person.watch,
.cycle-report-card.watch {
  border-left: 4px solid #d9902f;
}

.cycle-columns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.cycle-report-head,
.cycle-score-line,
.cycle-report-actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.cycle-report-head strong {
  display: block;
  margin-top: 3px;
}

.cycle-report-head > div:last-child,
.cycle-report-actions {
  flex-wrap: wrap;
}

.cycle-report-card p {
  display: grid;
  gap: 3px;
  margin: 0;
  line-height: 1.55;
}

.cycle-report-card p b {
  color: var(--text);
}

.cycle-history-panel {
  margin-top: 14px;
}

.cycle-history-panel summary {
  cursor: pointer;
  font-weight: 700;
}

.performance-table-panel {
  margin-top: 14px;
}

.work-report-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-solid);
  box-shadow: var(--shadow-soft);
}

.work-report-head span,
.work-report-head p,
.work-report-stat-strip em,
.work-report-queue-item em,
.work-report-queue-item small,
.work-report-card-head span,
.work-report-card-meta,
.work-report-score-row span {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.work-report-head h1 {
  margin: 3px 0;
  font-size: 24px;
  line-height: 1.2;
}

.work-report-head p {
  margin: 0;
}

.work-report-head-actions,
.work-report-card-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.work-report-toolbar {
  margin-top: 10px;
}

.work-report-stat-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.work-report-stat-strip article {
  display: grid;
  gap: 2px;
  min-height: 74px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.work-report-stat-strip article.risk {
  border-left: 4px solid var(--danger);
}

.work-report-stat-strip strong {
  font-size: 24px;
  line-height: 1.1;
}

.work-report-layout {
  display: grid;
  grid-template-columns: minmax(250px, 320px) minmax(0, 1fr);
  gap: 12px;
  margin-top: 12px;
  align-items: start;
}

.work-report-layout.single {
  grid-template-columns: minmax(0, 1fr);
}

.work-report-layout.single .work-report-queue {
  display: none;
}

.work-report-queue,
.work-report-main,
.work-report-card-list,
.work-report-queue-list {
  display: grid;
  gap: 10px;
  align-content: start;
}

.work-report-queue {
  position: sticky;
  top: 76px;
}

.work-report-queue-item {
  display: grid;
  gap: 5px;
  width: 100%;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  text-align: left;
}

.work-report-queue-item span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.work-report-queue-item.risk,
.work-report-card.risk {
  border-left: 4px solid var(--danger);
}

.work-report-queue-item.watch,
.work-report-card.watch {
  border-left: 4px solid #d9902f;
}

.work-report-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel-tint);
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.work-report-card.focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 91, 213, 0.16);
}

.work-report-card-head,
.work-report-score-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.work-report-card-head strong {
  display: block;
  margin-top: 3px;
  line-height: 1.35;
}

.work-report-tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.work-report-score-row {
  align-items: center;
}

.work-report-score-row .progress-track {
  max-width: 180px;
}

.work-report-card-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.95fr 0.95fr;
  gap: 8px;
}

.work-report-card-grid section {
  display: grid;
  gap: 4px;
  min-height: 84px;
  padding: 9px 10px;
  border: 1px solid rgba(212, 225, 234, 0.9);
  border-radius: 8px;
  background: #fff;
}

.work-report-card-grid b {
  font-size: 13px;
}

.work-report-card-grid p {
  margin: 0;
  color: #334155;
  font-size: 13px;
  line-height: 1.55;
}

.work-report-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.work-report-card-meta span {
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
}

.work-report-card-actions {
  justify-content: flex-start;
}

.work-report-history-panel summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
  font-weight: 700;
}

.work-report-history-panel summary span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
}

.work-report-empty {
  min-height: 140px;
}

.daily-visual-board {
  display: grid;
  gap: 14px;
}

.daily-fallback-notice {
  margin: 0;
}

.daily-visual-summary {
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(260px, 1.1fr) minmax(260px, 1.2fr);
  gap: 12px;
}

.daily-submit-ring-card,
.daily-focus-card,
.daily-department-card,
.daily-person-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.daily-submit-ring-card,
.daily-focus-card,
.daily-department-card {
  min-height: 190px;
  padding: 14px;
}

.daily-submit-ring-card {
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
}

.daily-submit-ring {
  display: grid;
  place-items: center;
  width: 126px;
  aspect-ratio: 1;
  border-radius: 50%;
}

.daily-submit-ring > div {
  display: grid;
  place-items: center;
  width: 86px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--line);
}

.daily-submit-ring strong,
.daily-focus-card strong {
  color: var(--text);
  font-size: 28px;
  line-height: 1;
}

.daily-submit-ring span,
.daily-focus-card span,
.daily-department-card > span {
  color: var(--muted);
  font-size: 12px;
}

.daily-ring-legend,
.daily-focus-list,
.daily-dept-bars {
  display: grid;
  gap: 8px;
}

.daily-ring-legend span {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #334155;
  font-size: 12px;
}

.daily-ring-legend i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
}

.daily-ring-legend i.ok {
  background: #18a77d;
}

.daily-ring-legend i.submitted {
  background: #4f5bd5;
}

.daily-ring-legend i.draft {
  background: #d9902f;
}

.daily-ring-legend i.risk {
  background: #d94f4f;
}

.daily-focus-card {
  display: grid;
  align-content: start;
  gap: 8px;
}

.daily-focus-card em {
  color: var(--muted);
  font-style: normal;
}

.daily-focus-list button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfd;
  text-align: left;
}

.daily-focus-list button.risk {
  border-left: 4px solid var(--danger);
}

.daily-focus-list button.watch {
  border-left: 4px solid #d9902f;
}

.daily-focus-list button span {
  color: #4f5bd5;
  font-weight: 700;
}

.daily-department-card {
  display: grid;
  align-content: start;
  gap: 12px;
}

.daily-dept-row {
  display: grid;
  gap: 6px;
}

.daily-dept-row > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.daily-dept-row b {
  color: var(--text);
}

.daily-dept-row em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.daily-dept-track {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #e6eef4;
}

.daily-dept-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #d9902f, #d94f4f);
}

.daily-person-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
  gap: 12px;
}

.daily-department-comparison {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.daily-comparison-head,
.daily-dept-summary-title,
.daily-dept-pressure,
.daily-comparison-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.daily-comparison-head span {
  color: var(--muted);
  font-size: 12px;
}

.daily-comparison-head h3 {
  margin: 2px 0 0;
  font-size: 18px;
}

.daily-comparison-head em,
.daily-dept-summary-title span,
.daily-dept-pressure span {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.daily-dept-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
}

.daily-dept-summary-card {
  display: grid;
  gap: 11px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfd;
}

.daily-dept-summary-card.risk {
  border-left: 4px solid var(--danger);
}

.daily-dept-summary-card.watch {
  border-left: 4px solid #d9902f;
}

.daily-dept-summary-title strong {
  font-size: 16px;
}

.daily-dept-summary-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.daily-dept-summary-metrics span {
  display: grid;
  gap: 2px;
  min-height: 54px;
  padding: 7px 8px;
  border: 1px solid rgba(212, 225, 234, 0.85);
  border-radius: 8px;
  background: #fff;
}

.daily-dept-summary-metrics b {
  font-size: 18px;
  line-height: 1.1;
}

.daily-dept-summary-metrics em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.daily-dept-stacked,
.daily-dept-pressure div,
.daily-inline-bar {
  display: flex;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e6eef4;
}

.daily-dept-stacked i {
  display: block;
  height: 100%;
}

.daily-dept-stacked .done {
  background: #18a77d;
}

.daily-dept-stacked .submitted {
  background: #4f5bd5;
}

.daily-dept-stacked .draft {
  background: #d9902f;
}

.daily-dept-stacked .risk {
  background: #d94f4f;
}

.daily-dept-pressure div {
  flex: 1;
}

.daily-dept-pressure i,
.daily-inline-bar b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #d9902f, #d94f4f);
}

.daily-comparison-table {
  display: grid;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.daily-comparison-row {
  display: grid;
  grid-template-columns: 92px 130px 104px minmax(160px, 1fr) minmax(160px, 1fr) minmax(160px, 1fr);
  justify-content: stretch;
  padding: 9px 10px;
  border-top: 1px solid var(--line);
  background: #fff;
}

.daily-comparison-row:first-child {
  border-top: 0;
}

.daily-comparison-row.head {
  position: sticky;
  top: 0;
  z-index: 1;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  background: #f8fbfd;
}

.daily-comparison-row > span,
.daily-comparison-row > strong {
  min-width: 0;
}

.daily-inline-bar {
  margin-top: 5px;
}

.daily-theme-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

.daily-theme-chips span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 4px 7px;
  border: 1px solid #d7e7df;
  border-radius: 999px;
  background: #f2fbf7;
  color: #17624f;
  font-size: 12px;
}

.daily-theme-chips.risk span {
  border-color: #f0d0d0;
  background: #fff6f6;
  color: #9f3737;
}

.daily-theme-chips.plan span {
  border-color: #d5ddff;
  background: #f5f7ff;
  color: #3948ad;
}

.daily-theme-chips span.empty-chip {
  border-color: var(--line);
  background: #f8fbfd;
  color: var(--muted);
}

.daily-theme-chips em {
  color: inherit;
  font-size: 10px;
  font-style: normal;
  opacity: 0.72;
}

.daily-person-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.daily-person-card:hover,
.work-report-card:hover {
  border-color: rgba(79, 91, 213, 0.45);
  box-shadow: 0 10px 24px rgba(30, 41, 59, 0.08);
}

.daily-person-card.focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 91, 213, 0.16);
}

.daily-person-card.risk {
  border-left: 4px solid var(--danger);
}

.daily-person-card.watch {
  border-left: 4px solid #d9902f;
}

.daily-person-head,
.daily-person-body,
.daily-person-meta,
.daily-person-tags {
  display: flex;
  gap: 10px;
}

.daily-person-head {
  align-items: center;
}

.daily-person-avatar {
  display: grid;
  flex: 0 0 42px;
  place-items: center;
  width: 42px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #e8f5f2;
  color: #14735c;
  font-weight: 800;
}

.daily-person-head strong {
  display: block;
  margin-top: 2px;
  font-size: 16px;
}

.daily-person-head span,
.daily-person-meta span {
  color: var(--muted);
  font-size: 12px;
}

.daily-person-tags {
  flex-wrap: wrap;
  justify-content: flex-end;
  margin-left: auto;
}

.daily-person-body {
  align-items: stretch;
}

.daily-score-ring {
  display: grid;
  flex: 0 0 74px;
  place-items: center;
  width: 74px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: conic-gradient(#4f5bd5 calc(var(--score) * 1%), #e6eef4 0);
}

.daily-score-ring strong,
.daily-score-ring span {
  grid-area: 1 / 1;
}

.daily-score-ring strong {
  align-self: center;
  color: #111827;
  font-size: 18px;
  z-index: 1;
}

.daily-score-ring span {
  align-self: end;
  margin-bottom: 13px;
  color: var(--muted);
  font-size: 10px;
  z-index: 1;
}

.daily-score-ring::after {
  content: "";
  grid-area: 1 / 1;
  width: 52px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
}

.daily-person-snippets {
  display: grid;
  flex: 1;
  gap: 7px;
  min-width: 0;
}

.daily-person-snippets p {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 8px;
  margin: 0;
  color: #334155;
  font-size: 13px;
  line-height: 1.45;
}

.daily-person-snippets b {
  color: var(--text);
}

.daily-person-meta {
  flex-wrap: wrap;
}

.daily-person-meta span {
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fbfd;
}

.work-report-detail-modal {
  width: min(1080px, calc(100vw - 28px));
}

.work-report-detail-modal .modal-head {
  align-items: flex-start;
}

.work-report-detail-modal .modal-head span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.work-report-detail-body {
  display: grid;
  gap: 12px;
}

.work-report-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 118px minmax(180px, 0.5fr);
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.work-report-detail-hero.risk {
  border-left: 4px solid var(--danger);
}

.work-report-detail-hero.watch {
  border-left: 4px solid #d9902f;
}

.work-report-detail-hero span,
.work-report-detail-tags span {
  color: var(--muted);
  font-size: 12px;
}

.work-report-detail-hero strong {
  display: block;
  margin: 3px 0;
  font-size: 24px;
}

.work-report-detail-hero p {
  margin: 0;
  color: #334155;
  line-height: 1.55;
}

.work-report-detail-score {
  display: grid;
  place-items: center;
  width: 104px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle at center, #fff 58%, transparent 59%), conic-gradient(#4f5bd5 0 var(--score-deg), #e6eef4 var(--score-deg) 360deg);
}

.work-report-detail-score strong {
  font-size: 26px;
}

.work-report-detail-tags,
.work-report-source-pills,
.work-report-detail-kv {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.work-report-detail-tags {
  align-content: center;
}

.work-report-detail-tags > span,
.work-report-source-pills span,
.work-report-detail-kv span {
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fbfd;
}

.work-report-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.work-report-detail-block,
.work-report-detail-review,
.work-report-detail-sources {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.work-report-detail-block h3,
.work-report-detail-review h3,
.work-report-detail-sources h3 {
  margin: 0 0 8px;
  font-size: 14px;
}

.work-report-detail-block p,
.work-report-detail-review p {
  margin: 0;
  color: #334155;
  line-height: 1.65;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.work-report-detail-block p.muted {
  color: var(--muted);
}

.work-report-detail-review {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 0.35fr);
  gap: 12px;
}

.work-report-detail-review > div:last-child {
  display: grid;
  align-content: start;
  gap: 4px;
}

.work-report-detail-review span {
  color: var(--muted);
  font-size: 12px;
}

.work-report-detail-kv span {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  border-radius: 8px;
}

.work-report-detail-kv b {
  margin-right: 6px;
}

.work-report-detail-kv em {
  color: #334155;
  font-style: normal;
  overflow-wrap: anywhere;
}

.daily-hub {
  display: grid;
  gap: 12px;
  min-width: 0;
  max-width: 100%;
}

.daily-hub > *,
.daily-hub-hero > div,
.daily-hub-main,
.daily-hub-side,
.daily-hub-management,
.daily-hub-report-strip,
.daily-report-flow {
  min-width: 0;
  max-width: 100%;
}

.daily-hub-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow-soft);
}

.daily-hub-hero span,
.daily-hub-hero p,
.daily-hub-kpis em,
.daily-hub-priority-item em,
.daily-hub-priority-item small,
.daily-hub-dept-card span,
.daily-hub-dept-card em,
.daily-hub-report-head span,
.daily-hub-missing-note span,
.daily-hub-section-head span,
.daily-hub-audit summary span {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.daily-hub-hero h1 {
  margin: 3px 0;
  font-size: 26px;
  line-height: 1.2;
}

.daily-hub-hero p {
  margin: 0;
}

.daily-hub-actions,
.daily-hub-inline-actions,
.daily-hub-report-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  min-width: 0;
}

.daily-hub-toolbar {
  margin-top: 0;
  min-width: 0;
}

.daily-hub-period-range {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
}

.daily-hub-kpis {
  display: grid;
  grid-template-columns: repeat(7, minmax(110px, 1fr));
  gap: 10px;
  min-width: 0;
}

.daily-hub-kpis article {
  display: grid;
  gap: 3px;
  min-width: 0;
  min-height: 76px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.daily-hub-kpis article.risk {
  border-left: 4px solid var(--danger);
}

.daily-hub-kpis article.watch {
  border-left: 4px solid #d9902f;
}

.daily-hub-kpis span {
  color: #26364f;
  font-size: 13px;
  font-weight: 700;
}

.daily-hub-kpis strong {
  font-size: 26px;
  line-height: 1;
}

.daily-hub-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.daily-hub-tabs button {
  flex: 0 0 auto;
  border-color: transparent;
  background: transparent;
}

.daily-hub-tabs button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-weight: 800;
}

.daily-hub-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 304px;
  gap: 12px;
  align-items: start;
}

.daily-hub-side,
.daily-hub-main,
.daily-hub-tab-panel,
.daily-hub-priority-list,
.daily-hub-missing-list,
.daily-hub-report-strip,
.daily-hub-review-grid {
  display: grid;
  gap: 12px;
  align-content: start;
}

.daily-hub-side {
  position: sticky;
  top: 76px;
}

.daily-hub-priority-item,
.daily-hub-missing-row,
.daily-hub-report-card,
.daily-hub-dept-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.daily-hub-priority-item {
  display: grid;
  gap: 5px;
  width: 100%;
  padding: 10px;
  text-align: left;
}

.daily-hub-priority-item span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.daily-hub-priority-item.risk,
.daily-hub-report-card.risk,
.daily-hub-dept-card.risk {
  border-left: 4px solid var(--danger);
}

.daily-hub-priority-item.watch,
.daily-hub-report-card.watch,
.daily-hub-dept-card.watch {
  border-left: 4px solid #d9902f;
}

.daily-hub-priority-item.missing,
.daily-hub-report-card.missing {
  border-left: 4px solid #475569;
  background: #f8fbfd;
}

.daily-hub-missing-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
}

.daily-hub-missing-row strong,
.daily-hub-missing-row span {
  display: block;
}

.daily-hub-missing-row span,
.daily-hub-missing-row em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.daily-hub-work-summary {
  display: grid;
  gap: 12px;
}

.daily-hub-summary-text {
  margin: 0;
  color: var(--text);
  font-size: 14px;
  line-height: 1.55;
}

.daily-hub-summary-keywords,
.daily-hub-summary-columns,
.daily-hub-summary-depts {
  display: grid;
  gap: 10px;
}

.daily-hub-summary-keywords {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.daily-hub-summary-columns {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
}

.daily-hub-summary-list {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.daily-hub-summary-list h3 {
  margin: 0;
  color: var(--text);
  font-size: 14px;
}

.daily-hub-summary-list > div {
  display: grid;
  gap: 6px;
}

.daily-hub-summary-item {
  display: grid;
  gap: 4px;
  width: 100%;
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdff;
  text-align: left;
}

.daily-hub-summary-item.risk {
  border-color: #f0d0d0;
  background: #fff8f7;
}

.daily-hub-summary-item.plan {
  border-color: #d5ddff;
  background: #f8f9ff;
}

.daily-hub-summary-item span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.daily-hub-summary-item em {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.daily-hub-summary-item strong {
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
  text-overflow: ellipsis;
}

.daily-hub-summary-depts {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.daily-hub-summary-depts button {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid #d9e6ee;
  border-radius: 8px;
  background: #f8fbfd;
  text-align: left;
}

.daily-hub-summary-depts span,
.daily-hub-summary-depts em {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.daily-hub-departments {
  display: grid;
  gap: 12px;
}

.daily-hub-dept-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
}

.daily-hub-dept-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  text-align: left;
}

.daily-hub-dept-card > div:first-child {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.daily-hub-dept-card strong {
  font-size: 16px;
}

.daily-hub-dept-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.daily-hub-dept-metrics span {
  display: grid;
  gap: 2px;
  min-height: 50px;
  padding: 7px;
  border: 1px solid rgba(212, 225, 234, 0.85);
  border-radius: 8px;
  background: #f8fbfd;
}

.daily-hub-dept-metrics b {
  color: var(--text);
  font-size: 17px;
}

.daily-hub-stack {
  display: flex;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e6eef4;
}

.daily-hub-stack i {
  display: block;
  height: 100%;
}

.daily-hub-stack .done {
  background: #18a77d;
}

.daily-hub-stack .risk {
  background: #d94f4f;
}

.daily-hub-dept-table {
  display: grid;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.daily-hub-dept-row {
  display: grid;
  grid-template-columns: 90px 110px 120px minmax(170px, 1fr) minmax(170px, 1fr) minmax(170px, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 900px;
  padding: 9px 10px;
  border-top: 1px solid var(--line);
  background: #fff;
}

.daily-hub-dept-row:first-child {
  border-top: 0;
}

.daily-hub-dept-row.head {
  position: sticky;
  top: 0;
  z-index: 1;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  background: #f8fbfd;
}

.daily-hub-employee-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 12px;
}

.daily-hub-report-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.daily-hub-report-card:hover,
.daily-hub-dept-card:hover,
.daily-hub-priority-item:hover {
  border-color: rgba(79, 91, 213, 0.45);
  box-shadow: 0 10px 24px rgba(30, 41, 59, 0.08);
}

.daily-hub-report-card.compact .daily-hub-report-body {
  grid-template-columns: 68px minmax(0, 1fr);
}

.daily-hub-report-head,
.daily-hub-report-body,
.daily-hub-section-head,
.daily-hub-audit summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.daily-hub-report-head {
  align-items: center;
}

.daily-hub-report-head strong {
  display: block;
  margin-top: 2px;
  font-size: 16px;
}

.daily-hub-report-body {
  align-items: stretch;
  justify-content: flex-start;
}

.daily-hub-report-actions {
  justify-content: flex-start;
}

.daily-hub-missing-note {
  display: grid;
  gap: 4px;
  min-height: 78px;
  padding: 10px;
  border: 1px dashed var(--line-strong);
  border-radius: 8px;
  background: #fff;
}

.daily-hub-section-head {
  align-items: center;
}

.daily-hub-section-head h2 {
  margin: 2px 0 0;
  font-size: 20px;
}

.daily-hub-section-head strong {
  font-size: 18px;
}

.daily-hub-audit summary {
  align-items: center;
  cursor: pointer;
  font-weight: 800;
}

.daily-hub-audit {
  max-width: 100%;
  overflow-x: auto;
}

.daily-hub-audit:not([open]) > :not(summary) {
  display: none !important;
}

.daily-hub-workbench {
  display: grid;
  grid-template-columns: 174px minmax(0, 1fr) 304px;
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.daily-hub-date-rail,
.daily-hub-management {
  position: sticky;
  top: 76px;
  display: grid;
  gap: 10px;
  align-content: start;
}

.daily-hub-date-rail {
  padding: 10px;
}

.daily-hub-date-rail button {
  display: grid;
  gap: 3px;
  width: 100%;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: #f8fbfd;
  color: var(--text);
  text-align: left;
}

.daily-hub-date-rail button:hover,
.daily-hub-date-rail button.active {
  border-color: rgba(79, 91, 213, 0.38);
  background: #eef2ff;
}

.daily-hub-date-rail button.warn {
  border-left: 4px solid var(--danger);
}

.daily-hub-date-rail strong,
.daily-hub-date-rail span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.daily-hub-date-rail span {
  color: var(--muted);
  font-size: 11px;
}

.daily-hub-report-strip {
  min-width: 0;
  padding: 12px;
}

.daily-report-flow {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.daily-report-day-group {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.daily-report-day-group > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 11px;
  border-bottom: 1px solid var(--line);
  background: #f8fbfd;
}

.daily-report-day-group > header div {
  display: grid;
  gap: 1px;
}

.daily-report-day-group > header span,
.daily-report-day-group > header em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.daily-report-row {
  display: grid;
  grid-template-columns: 76px minmax(104px, 0.72fr) minmax(108px, 0.72fr) minmax(150px, 1.35fr) minmax(124px, 1fr) minmax(124px, 1fr) minmax(110px, auto);
  gap: 8px;
  align-items: center;
  min-width: 0;
  min-height: 58px;
  padding: 8px 10px;
  border-top: 1px solid #e8f0f6;
  background: #fff;
  cursor: pointer;
  transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.daily-report-day-group .daily-report-row:first-of-type {
  border-top: 0;
}

.daily-report-row:hover,
.daily-report-row:focus-visible {
  background: #fbfdff;
  box-shadow: inset 3px 0 0 rgba(79, 91, 213, 0.42);
  outline: none;
}

.daily-report-row.risk,
.daily-report-row.missing {
  box-shadow: inset 4px 0 0 rgba(217, 79, 79, 0.82);
}

.daily-report-row.watch {
  box-shadow: inset 4px 0 0 rgba(217, 144, 47, 0.82);
}

.daily-report-row-date,
.daily-report-row-owner,
.daily-report-row-status,
.daily-report-row p,
.daily-report-row-empty {
  min-width: 0;
}

.daily-report-row-date {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.daily-report-row-owner {
  display: grid;
  gap: 2px;
}

.daily-report-row-owner strong,
.daily-report-row-owner span,
.daily-report-row p,
.daily-report-row-empty {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.daily-report-row-owner span,
.daily-report-row p b,
.daily-report-row-status em,
.daily-report-row-empty {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.daily-report-row-status {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}

.daily-report-row p {
  display: flex;
  gap: 6px;
  margin: 0;
  color: var(--text);
  line-height: 1.35;
}

.daily-report-row p b {
  flex: 0 0 auto;
  font-weight: 800;
}

.daily-report-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: flex-end;
}

.daily-report-row-actions button {
  min-height: 28px;
  padding: 4px 7px;
  border-radius: 7px;
  font-size: 12px;
  white-space: nowrap;
}

.daily-hub-workbench .daily-report-row {
  grid-template-columns: 72px minmax(96px, 0.72fr) minmax(100px, 0.72fr) minmax(0, 1.6fr) minmax(88px, auto);
}

.daily-hub-workbench .daily-report-row p:nth-of-type(2),
.daily-hub-workbench .daily-report-row p:nth-of-type(3) {
  display: none;
}

.daily-hub-workbench .daily-report-row-actions {
  justify-content: flex-end;
}

.daily-hub-management .panel,
.daily-hub-compact-summary,
.daily-hub-compact-depts {
  min-width: 0;
}

.daily-hub-management .panel {
  padding: 10px;
}

.daily-hub-compact-summary,
.daily-hub-compact-depts {
  display: grid;
  gap: 10px;
}

.daily-hub-mini-columns {
  display: grid;
  gap: 8px;
}

.daily-hub-mini-columns section {
  display: grid;
  gap: 6px;
}

.daily-hub-mini-columns h3 {
  margin: 0;
  color: var(--text);
  font-size: 13px;
}

.daily-hub-compact-depts .daily-hub-summary-depts {
  grid-template-columns: 1fr;
}

.daily-hub-compact-depts .daily-hub-summary-depts button {
  padding: 8px;
}

.daily-detail-backdrop {
  align-items: stretch;
  justify-content: flex-end;
  padding: 0;
}

.daily-detail-drawer {
  width: min(760px, 94vw);
  max-width: none;
  height: 100vh;
  max-height: 100vh;
  margin: 0;
  border-radius: 12px 0 0 12px;
  box-shadow: -20px 0 48px rgba(15, 23, 42, 0.22);
}

.daily-detail-drawer .modal-body {
  overflow: auto;
}

/* Manager weekly action timeline. Keep these rules scoped so the legacy daily views retain their layout. */
.daily-weekly-timeline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 304px;
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.daily-weekly-timeline-main,
.daily-weekly-timeline-summary,
.daily-weekly-timeline-list {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.daily-weekly-timeline-main {
  padding: 14px;
}

.daily-weekly-timeline-summary {
  position: sticky;
  top: 76px;
}

.daily-weekly-timeline-summary .panel {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.daily-weekly-date-strip {
  display: grid;
  grid-template-columns: repeat(7, minmax(92px, 1fr));
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  padding: 2px 2px 5px;
  scrollbar-width: thin;
}

.daily-weekly-date-strip button,
.daily-weekly-queue-cards button,
.daily-weekly-timeline-summary button {
  min-height: 44px;
}

.daily-weekly-date-strip button {
  display: grid;
  gap: 3px;
  min-width: 92px;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfd;
  color: var(--text);
  text-align: left;
}

.daily-weekly-date-strip button:hover,
.daily-weekly-date-strip button.active {
  border-color: rgba(79, 91, 213, 0.5);
  background: var(--accent-soft);
  color: var(--accent-dark);
}

.daily-weekly-date-strip strong,
.daily-weekly-date-strip span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.daily-weekly-date-strip strong {
  font-size: 13px;
}

.daily-weekly-date-strip span {
  color: var(--muted);
  font-size: 11px;
}

.daily-weekly-queue-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.daily-weekly-queue-cards button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 8px;
  align-content: center;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
}

.daily-weekly-queue-cards button:hover,
.daily-weekly-queue-cards button.active {
  border-color: rgba(79, 91, 213, 0.52);
  background: var(--accent-soft);
  color: var(--accent-dark);
}

.daily-weekly-queue-cards span,
.daily-weekly-queue-cards em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.daily-weekly-queue-cards span {
  font-size: 12px;
  font-weight: 800;
}

.daily-weekly-queue-cards strong {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  font-size: 22px;
  line-height: 1;
}

.daily-weekly-queue-cards em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.daily-weekly-timeline-row {
  display: grid;
  grid-template-columns: minmax(116px, 0.8fr) minmax(112px, 0.66fr) minmax(146px, 1.2fr) minmax(146px, 1.2fr) minmax(108px, 0.72fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  min-height: 84px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.daily-weekly-timeline-row[role="button"] {
  cursor: pointer;
}

.daily-weekly-timeline-row:hover {
  border-color: rgba(79, 91, 213, 0.52);
  box-shadow: var(--shadow-soft);
  transform: translateY(-1px);
}

.daily-weekly-timeline-row.overdue_missing,
.daily-weekly-timeline-row.missing {
  border-left-color: var(--danger);
  background: #fff9f8;
}

.daily-weekly-timeline-row.waiting_employee {
  border-left-color: #d9902f;
  background: #fffdf8;
}

.daily-weekly-timeline-row.needs_support {
  border-left-color: #197d9a;
  background: #f7fcfe;
}

.daily-weekly-timeline-owner,
.daily-weekly-timeline-queue,
.daily-weekly-timeline-action {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.daily-weekly-timeline-owner strong,
.daily-weekly-timeline-owner span,
.daily-weekly-timeline-row p,
.daily-weekly-timeline-action strong,
.daily-weekly-timeline-action span {
  overflow-wrap: anywhere;
}

.daily-weekly-timeline-owner strong,
.daily-weekly-timeline-action strong {
  font-size: 13px;
  line-height: 1.4;
}

.daily-weekly-timeline-owner span,
.daily-weekly-timeline-queue em,
.daily-weekly-timeline-action span {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.daily-weekly-timeline-queue {
  justify-items: start;
}

.daily-weekly-timeline-row p {
  display: flex;
  gap: 6px;
  min-width: 0;
  margin: 0;
  color: var(--text);
  font-size: 12px;
  line-height: 1.45;
}

.daily-weekly-timeline-row p b {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 11px;
}

.daily-weekly-summary-metric {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfd;
}

.daily-weekly-summary-metric span {
  color: var(--muted);
  font-size: 12px;
}

.daily-weekly-summary-metric strong {
  color: var(--accent-dark);
  font-size: 22px;
  line-height: 1;
}

.daily-weekly-timeline-summary button {
  width: 100%;
}

.daily-weekly-timeline-row:focus-visible,
.daily-weekly-date-strip button:focus-visible,
.daily-weekly-queue-cards button:focus-visible,
.daily-weekly-timeline-summary button:focus-visible {
  outline: 3px solid rgba(79, 91, 213, 0.48);
  outline-offset: 2px;
}

@supports (outline-color: color-mix(in srgb, var(--accent) 55%, transparent)) {
  .daily-weekly-timeline-row:focus-visible,
  .daily-weekly-date-strip button:focus-visible,
  .daily-weekly-queue-cards button:focus-visible,
  .daily-weekly-timeline-summary button:focus-visible {
    outline-color: color-mix(in srgb, var(--accent) 55%, transparent);
  }
}

@media (max-width: 900px) {
  .daily-weekly-timeline {
    grid-template-columns: minmax(0, 1fr) minmax(232px, 280px);
    gap: 10px;
  }

  .daily-weekly-timeline-main,
  .daily-weekly-timeline-summary .panel {
    padding: 12px;
  }

  .daily-weekly-queue-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .daily-weekly-timeline-row {
    grid-template-columns: minmax(122px, 0.9fr) minmax(118px, 0.8fr) minmax(0, 1.35fr);
  }

  .daily-weekly-timeline-row p:nth-of-type(2) {
    display: flex;
    grid-column: 1 / span 2;
  }

  .daily-weekly-timeline-action {
    display: grid;
    grid-column: 3;
    grid-row: 2;
  }
}

@media (max-width: 680px) {
  .daily-weekly-timeline {
    grid-template-columns: minmax(0, 1fr);
  }

  .daily-weekly-timeline-summary {
    position: static;
  }

  .daily-weekly-date-strip {
    grid-template-columns: repeat(7, minmax(88px, 1fr));
    padding-bottom: 7px;
  }

  .daily-weekly-date-strip button {
    min-width: 88px;
  }

  .daily-weekly-timeline-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    min-height: 0;
  }

  .daily-weekly-timeline-row p:nth-of-type(2),
  .daily-weekly-timeline-action {
    grid-column: auto;
    grid-row: auto;
  }

  .daily-weekly-timeline-row p:nth-of-type(2) {
    display: flex;
  }

  .daily-weekly-timeline-action {
    display: grid;
  }
}

.performance-okr-list,
.performance-kpi-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.performance-kpi-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.performance-okr-card,
.performance-kpi-card {
  display: grid;
  gap: 12px;
}

.performance-okr-head,
.performance-kpi-head,
.performance-kpi-meta,
.performance-progress-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.performance-okr-head,
.performance-kpi-head {
  align-items: flex-start;
}

.performance-okr-head h2,
.performance-kpi-head h2 {
  margin: 3px 0 0;
  font-size: 18px;
}

.performance-okr-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.progress-track {
  height: 7px;
  min-width: 120px;
  flex: 1;
  overflow: hidden;
  border-radius: 999px;
  background: #dbe7ee;
}

.progress-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--aqua), var(--accent));
}

.performance-kr-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.performance-kr {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.performance-initiative-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.performance-initiative-row span {
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-soft);
}

.performance-kpi-values {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.performance-kpi-values strong {
  font-size: 28px;
}

.performance-self-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding: 18px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--aqua);
  border-radius: 12px;
  background: var(--panel-solid);
  box-shadow: var(--shadow-soft);
}

.performance-self-hero > div,
.performance-self-layout > *,
.performance-self-side .panel {
  min-width: 0;
}

.performance-self-side .compact-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}

.performance-self-side .compact-table th,
.performance-self-side .compact-table td {
  overflow-wrap: anywhere;
  white-space: normal;
}

.performance-self-hero.watch {
  border-left-color: #d9902f;
}

.performance-self-hero.risk {
  border-left-color: var(--danger);
}

.performance-self-hero span,
.performance-section-head span,
.performance-draft-preview .panel-head span,
.performance-self-kpi small,
.performance-self-kr-meta {
  color: var(--muted);
  font-size: 12px;
}

.performance-self-hero h2,
.performance-section-head h2 {
  margin: 4px 0;
}

.performance-self-hero p {
  margin: 0;
  color: #334155;
}

.performance-period-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.performance-period-tabs button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-dark);
}

.performance-self-stats {
  margin-top: 14px;
}

.performance-self-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
  gap: 14px;
  margin-top: 14px;
}

.performance-self-main,
.performance-self-side,
.performance-self-objectives,
.performance-action-list {
  display: grid;
  gap: 12px;
  align-content: start;
}

.performance-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid rgba(198, 208, 223, 0.86);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(248, 252, 255, 0.88), rgba(255, 255, 255, 0.94)),
    var(--panel-solid);
  box-shadow: var(--shadow-soft);
}

.performance-section-head h2 {
  margin: 4px 0 0;
  font-size: 20px;
  line-height: 1.25;
}

.performance-section-head span {
  display: block;
  letter-spacing: 0;
}

.performance-section-head button {
  flex: 0 0 auto;
  min-width: 96px;
  min-height: 36px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  white-space: nowrap;
}

.performance-self-objective {
  display: grid;
  gap: 12px;
}

.performance-self-kr-list,
.performance-self-kpis,
.performance-draft-grid {
  display: grid;
  gap: 10px;
}

.performance-self-kpis,
.performance-draft-grid {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.performance-self-kr,
.performance-self-kpi,
.performance-action,
.performance-draft-block {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-tint);
}

.performance-self-kr > div,
.performance-self-kpi > div,
.performance-self-kpi p,
.performance-action > div {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.performance-self-kpi p,
.performance-action p {
  margin: 0;
}

.performance-self-kpi b {
  font-size: 24px;
}

.performance-self-kr-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.performance-next-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.performance-next-actions span {
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 12px;
}

.performance-action.watch {
  border-left: 4px solid #d9902f;
}

.performance-action.risk {
  border-left: 4px solid var(--danger);
}

.performance-action span {
  color: var(--muted);
  font-size: 12px;
}

.performance-action button {
  justify-self: flex-start;
}

.performance-empty-action {
  display: grid;
  gap: 10px;
  align-content: start;
  min-height: 132px;
  padding: 18px 20px;
  border-radius: var(--radius-card);
  background:
    radial-gradient(circle at 100% 0, rgba(79, 91, 213, 0.10), transparent 32%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 252, 255, 0.92)),
    var(--panel-solid);
}

.performance-empty-action strong {
  font-size: 18px;
  line-height: 1.35;
}

.performance-empty-action p {
  margin: 0;
  max-width: 560px;
  color: var(--muted);
  line-height: 1.65;
}

.performance-empty-action button {
  justify-self: flex-start;
  margin-top: 2px;
  min-height: 36px;
  padding: 0 16px;
  border-radius: 999px;
}

.performance-self-objectives > .performance-empty-action,
.performance-self-kpis > .performance-empty-action {
  grid-column: 1 / -1;
}

.performance-evidence-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.performance-evidence-column {
  display: grid;
  align-content: start;
  gap: 10px;
}

.performance-evidence-column .panel-head span {
  min-width: 26px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--panel-soft);
  color: var(--muted);
  text-align: center;
  font-size: 12px;
}

.performance-evidence-list,
.performance-draft-block ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.performance-evidence-list li {
  display: grid;
  gap: 4px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.performance-evidence-list span,
.performance-evidence-list em,
.performance-draft-block span,
.performance-draft-block p {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.performance-draft-preview {
  margin-top: 14px;
}

.performance-draft-preview .panel-head > div:first-child {
  display: grid;
  gap: 3px;
}

.performance-draft-block {
  background: #fff;
}

.performance-draft-block ul {
  line-height: 1.55;
}

.performance-draft-block li {
  position: relative;
  padding-left: 12px;
}

.performance-draft-block li::before {
  position: absolute;
  left: 0;
  content: "•";
  color: var(--accent);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background:
    radial-gradient(circle at 74% 16%, rgba(220, 232, 255, 0.46), transparent 26%),
    radial-gradient(circle at 12% 86%, rgba(215, 244, 239, 0.42), transparent 28%),
    linear-gradient(135deg, rgba(20, 160, 152, 0.06), transparent 36%),
    var(--bg);
  color: var(--text);
  font-family: "Microsoft YaHei", "PingFang SC", "Segoe UI", Arial, sans-serif;
  font-size: 14px;
  letter-spacing: 0;
}

.security-watermark {
  position: fixed;
  inset: 0;
  z-index: 900;
  pointer-events: none;
  background-repeat: repeat;
  opacity: 0.34;
  mix-blend-mode: multiply;
}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  border: 1px solid var(--line-strong);
  background: rgba(255, 255, 255, 0.94);
  color: var(--text);
  min-height: 32px;
  padding: 0 10px;
  border-radius: var(--radius-control);
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.025);
}

button:hover {
  border-color: var(--accent);
  color: var(--accent-dark);
  background: #fff;
}

button.primary {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

button.primary:hover {
  background: var(--accent-dark);
  color: #fff;
}

button.danger {
  border-color: #e2b8b8;
  color: var(--danger);
}

button.icon {
  width: 32px;
  padding: 0;
}

button.icon.text-icon {
  width: auto;
  min-width: 34px;
  min-height: 26px;
  padding: 0 6px;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
}

input,
textarea,
select {
  width: 100%;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.94);
  color: var(--text);
  border-radius: var(--radius-control);
  padding: 7px 9px;
  outline: none;
}

textarea {
  min-height: 88px;
  resize: vertical;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 91, 213, 0.12);
}

.login-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(320px, 420px) 1fr;
  background:
    radial-gradient(circle at 78% 22%, rgba(220, 232, 255, 0.48), transparent 28%),
    var(--bg);
}

.login-panel {
  background: #fff;
  padding: 44px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-shadow: var(--shadow);
}

.login-brand {
  margin-bottom: 34px;
}

.login-brand h1 {
  margin: 0;
  font-size: 26px;
  line-height: 1.25;
}

.login-aside {
  padding: 44px 64px;
}

.field {
  display: grid;
  gap: 5px;
  margin-bottom: 10px;
}

.field label {
  color: #37454d;
  font-weight: 600;
}

.error {
  color: var(--danger);
  margin: 10px 0 0;
}

.app-shell {
  height: 100vh;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 220px 1fr;
  overflow: hidden;
  transition: grid-template-columns 0.18s ease;
}

.sidebar {
  height: 100vh;
  min-height: 0;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.58), rgba(219, 228, 245, 0.26)),
    #edf4fa;
  border-right: 1px solid var(--line-strong);
  box-shadow: inset -10px 0 18px rgba(148, 163, 184, 0.08), inset -1px 0 0 rgba(255, 255, 255, 0.72);
  color: var(--text);
  display: flex;
  flex-direction: column;
  min-width: 0;
  backdrop-filter: blur(20px);
  font-family: "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  transition: box-shadow 0.18s ease, background 0.18s ease;
}

.brand {
  padding: 12px 14px 10px;
  border-bottom: 1px solid rgba(198, 208, 223, 0.74);
}

.sidebar > .brand {
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.brand-main {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0;
}

.brand-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
}

.brand .brand-logo {
  display: none;
  width: 36px;
  height: 36px;
  margin-top: 0;
  border: 1px solid rgba(79, 91, 213, 0.22);
  border-radius: 12px;
  place-items: center;
  background:
    linear-gradient(135deg, rgba(79, 91, 213, 0.12), rgba(255, 255, 255, 0.86)),
    rgba(255, 255, 255, 0.7);
  color: var(--accent-dark);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  flex: 0 0 auto;
}

.brand-copy {
  min-width: 0;
}

.brand strong {
  display: block;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--text);
}

.brand span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.25;
  margin-top: 4px;
}

.brand .brand-subline {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.brand-subline em {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 0 7px;
  border: 1px solid rgba(79, 91, 213, 0.22);
  border-radius: 999px;
  background: rgba(79, 91, 213, 0.1);
  color: var(--accent-dark);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
}

.sidebar-collapse-btn {
  width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  border-color: rgba(148, 163, 184, 0.24);
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.58);
  color: #64748b;
  box-shadow: none;
  flex: 0 0 auto;
  font-family: "Segoe UI", Arial, sans-serif;
}

.sidebar-collapse-btn:hover {
  border-color: rgba(79, 91, 213, 0.36);
  background: rgba(255, 255, 255, 0.84);
  color: var(--accent-dark);
}

.sidebar-collapse-icon {
  display: block;
  margin-top: -1px;
  color: inherit;
  font-size: 24px;
  font-weight: 500;
  line-height: 1;
}

.sidebar-edit-toggle {
  min-height: 28px;
  padding: 0 9px;
  border-color: rgba(148, 163, 184, 0.28);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.58);
  color: #46566f;
  box-shadow: none;
  font-size: 12px;
  font-weight: 700;
}

.sidebar-edit-toggle:hover,
.sidebar-edit-toggle.active {
  border-color: rgba(79, 91, 213, 0.42);
  background: rgba(79, 91, 213, 0.12);
  color: var(--accent-dark);
}

.sidebar-editbar {
  display: grid;
  gap: 7px;
  padding: 8px 10px;
  border-bottom: 1px solid rgba(198, 208, 223, 0.72);
  background: rgba(255, 255, 255, 0.7);
}

.sidebar-editbar span {
  color: #46566f;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

.sidebar-editbar > div {
  display: flex;
  gap: 6px;
}

.sidebar-editbar button {
  flex: 1 1 0;
  min-height: 28px;
  padding: 0 7px;
  font-size: 12px;
}

.nav {
  flex: 1 1 auto;
  min-height: 0;
  padding: 6px 10px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow: hidden;
}

.nav-group {
  display: grid;
  gap: 2px;
}

.nav button {
  width: 100%;
  justify-content: flex-start;
  text-align: left;
  border: 1px solid transparent;
  border-radius: var(--radius-control);
  background: transparent;
  color: #273449;
  display: flex;
  gap: 9px;
  align-items: center;
  box-shadow: none;
  font-weight: 500;
  line-height: 1.2;
  min-width: 0;
  overflow: hidden;
}

.nav-title-label,
.nav-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nav .nav-title {
  min-height: 21px;
  justify-content: space-between;
  gap: 6px;
  padding: 0 6px;
  border-color: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
}

.nav .nav-title:hover {
  border-color: rgba(174, 185, 255, 0.32);
  background: rgba(255, 255, 255, 0.46);
}

.nav-title-meta {
  margin-left: auto;
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-radius: 999px;
  padding: 0 5px;
  background: rgba(255, 255, 255, 0.6);
  color: #64748b;
  font-size: 10px;
  line-height: 1.4;
}

.nav-title-chevron {
  width: 14px;
  color: #94a3b8;
  font-size: 11px;
  text-align: center;
  transition: transform 0.16s ease;
}

.nav-group.expanded .nav-title {
  color: #46566f;
}

.nav-group.expanded .nav-title-chevron {
  transform: rotate(180deg);
}

.nav-items {
  display: grid;
  gap: 2px;
  min-height: 0;
}

.nav-group.collapsed .nav-items {
  display: none;
}

.nav-items button {
  min-height: 22px;
  padding: 0 6px;
  font-size: 13px;
  font-weight: 500;
}

.nav button:hover {
  border-color: rgba(174, 185, 255, 0.46);
  background: rgba(255, 255, 255, 0.58);
  color: var(--accent-dark);
}

.nav button.active {
  border-color: #aeb9ff;
  background:
    linear-gradient(90deg, rgba(79, 91, 213, 0.12), rgba(255, 255, 255, 0.78)),
    rgba(255, 255, 255, 0.82);
  color: #1f2a78;
  font-weight: 600;
}

.nav .mark {
  width: 28px;
  height: 17px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: rgba(148, 163, 184, 0.16);
  color: #64748b;
  font-size: 9px;
  font-weight: 700;
  line-height: 1;
  flex: 0 0 auto;
}

.nav button.active .mark {
  background: var(--accent-soft);
  color: var(--accent-dark);
}

.sidebar-editing .nav button[draggable="true"] {
  cursor: grab;
}

.sidebar-editing .nav {
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
}

.sidebar-editing .nav button[draggable="true"]:active {
  cursor: grabbing;
}

.sidebar-editing .nav button.nav-dragging {
  opacity: 0.5;
}

.nav-drop-preview {
  height: 26px;
  display: grid;
  place-items: center;
  margin: 2px 0;
  border: 1px dashed rgba(79, 91, 213, 0.62);
  border-radius: 8px;
  background: rgba(79, 91, 213, 0.1);
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 800;
  pointer-events: none;
}

.nav-drop-preview span {
  line-height: 1;
}

.sidebar-editing .nav-group.nav-drop-target {
  border-radius: 10px;
  background: rgba(79, 91, 213, 0.06);
}

.sidebar-editing .nav-items.nav-drop-target,
.sidebar-editing .nav-group.nav-drop-target .nav-items {
  outline: 1px dashed rgba(79, 91, 213, 0.58);
  outline-offset: 2px;
  background: rgba(79, 91, 213, 0.07);
}

.nav-edit-empty {
  min-height: 30px;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(148, 163, 184, 0.46);
  border-radius: 8px;
  color: var(--muted);
  font-size: 12px;
}

.sidebar-foot {
  margin-top: auto;
  padding: 7px 10px 9px;
  border-top: 1px solid rgba(198, 208, 223, 0.72);
}

.user-chip {
  display: grid;
  gap: 2px;
  margin-bottom: 6px;
  font-size: 12px;
}

.sidebar-foot button {
  min-height: 26px;
  padding: 0 8px;
}

.user-chip strong {
  color: var(--text);
}

.user-chip span {
  color: var(--muted);
}

@media (min-width: 761px) {
  .app-shell.sidebar-collapsed {
    grid-template-columns: 72px 1fr;
  }

  .sidebar-collapsed .sidebar > .brand {
    min-height: 86px;
    padding: 10px 8px 8px;
    display: grid;
    justify-items: center;
    gap: 8px;
  }

  .sidebar-collapsed .brand-main {
    justify-content: center;
  }

  .sidebar-collapsed .brand-actions {
    display: grid;
    justify-items: center;
    gap: 6px;
  }

  .sidebar-collapsed .brand .brand-logo {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: inline-grid;
  }

  .sidebar-collapsed .brand-copy {
    display: none;
  }

  .sidebar-collapsed .sidebar-edit-toggle {
    display: none;
  }

  .sidebar-collapsed .sidebar-collapse-btn {
    width: 34px;
    height: 30px;
    min-height: 30px;
  }

  .sidebar-collapsed .sidebar-collapse-icon {
    margin-top: -2px;
  }

  .sidebar-collapsed .nav {
    padding: 8px 8px;
    gap: 5px;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
  }

  .sidebar-collapsed .nav-group {
    gap: 5px;
    padding-top: 5px;
    border-top: 1px solid rgba(198, 208, 223, 0.72);
  }

  .sidebar-collapsed .nav-group:first-child {
    padding-top: 0;
    border-top: 0;
  }

  .sidebar-collapsed .nav .nav-title {
    display: none;
  }

  .sidebar-collapsed .nav-group.collapsed .nav-items,
  .sidebar-collapsed .nav-group.expanded .nav-items {
    display: grid;
    gap: 5px;
  }

  .sidebar-collapsed .nav-items button {
    min-height: 38px;
    padding: 0;
    justify-content: center;
    border-radius: 10px;
  }

  .sidebar-collapsed .nav-label {
    display: none;
  }

  .sidebar-collapsed .nav .mark {
    width: 40px;
    height: 22px;
    border-radius: 999px;
    font-size: 9px;
  }

  .sidebar-collapsed .nav button.active {
    border-color: rgba(79, 91, 213, 0.42);
    box-shadow: inset 3px 0 0 rgba(79, 91, 213, 0.55);
  }

  .sidebar-collapsed .sidebar-foot {
    padding: 8px;
    display: grid;
    gap: 7px;
  }

  .sidebar-collapsed .user-chip {
    display: none;
  }

  .sidebar-collapsed .sidebar-foot button {
    width: 100%;
    min-height: 34px;
    padding: 0;
    font-size: 0;
  }

  .sidebar-collapsed .sidebar-foot button::before {
    content: "OUT";
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
  }
}

.content {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.topbar {
  min-height: 50px;
  background: rgba(255, 255, 255, 0.82);
  border-bottom: 1px solid var(--line);
  display: none;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
  backdrop-filter: blur(18px);
}

.topbar.embedded {
  display: none;
}

.topbar.embedded.previewing {
  min-height: 44px;
  display: none;
  justify-content: flex-end;
  padding: 8px 24px 0;
  border-bottom: 0;
  background: transparent;
  backdrop-filter: none;
}

.topbar.embedded.previewing > div:first-child,
.topbar.embedded.previewing #refreshBtn {
  display: none;
}

.topbar-title {
  min-width: 0;
}

.topbar h1 {
  margin: 0;
  font-size: 18px;
  line-height: 1.25;
}

.topbar p {
  margin: 3px 0 0;
  color: var(--muted);
}

.topbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.knowledge-shell {
  display: grid;
  gap: 12px;
}

.knowledge-toolbar select {
  width: 150px;
}

.knowledge-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.knowledge-toolbar .toolbar-left {
  display: grid;
  grid-template-columns: 150px minmax(260px, 1fr) 64px;
  gap: 8px;
  min-width: 0;
}

.knowledge-toolbar .toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
  min-width: max-content;
}

.knowledge-toolbar button {
  min-width: 64px;
  min-height: 34px;
  padding: 0 13px;
  border-radius: 999px;
  white-space: nowrap;
  word-break: keep-all;
  line-height: 1;
}

.knowledge-tabs {
  width: fit-content;
  max-width: 100%;
  margin-bottom: 0;
  gap: 3px;
  padding: 3px;
  border-radius: var(--radius-control);
  overflow-x: auto;
  flex-wrap: nowrap;
}

.knowledge-tabs button {
  min-height: 30px;
  padding: 0 12px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  word-break: keep-all;
}

.knowledge-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
  gap: 12px;
  align-items: start;
}

.knowledge-map-card,
.knowledge-detail {
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  box-shadow: var(--shadow);
}

.knowledge-metrics {
  margin-bottom: 10px;
}

.knowledge-map {
  width: 100%;
  min-height: 560px;
  display: block;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, #fbfdfe, #f4faf9);
}

.kg-ring {
  fill: none;
  stroke: #dbe8ed;
  stroke-dasharray: 4 8;
}

.kg-ring-label {
  fill: var(--muted);
  font-size: 12px;
}

.kg-center {
  fill: #102331;
  stroke: rgba(13, 148, 136, 0.34);
  stroke-width: 8;
}

.kg-center-title,
.kg-center-sub {
  text-anchor: middle;
  fill: #fff;
  pointer-events: none;
}

.kg-center-title {
  font-weight: 700;
  font-size: 14px;
}

.kg-center-sub {
  font-size: 11px;
  opacity: 0.78;
}

.kg-edge {
  stroke: #a8b8c0;
  stroke-width: 1.2;
  opacity: 0.72;
}

.kg-edge.soft {
  stroke-dasharray: 4 5;
}

.kg-edge.highlight {
  stroke: var(--accent);
  stroke-width: 2.4;
  opacity: 1;
}

.kg-node {
  cursor: pointer;
}

.kg-node circle {
  stroke: #fff;
  stroke-width: 3;
  filter: drop-shadow(0 4px 10px rgba(15, 35, 49, 0.16));
}

.kg-node text {
  fill: #1f303a;
  font-size: 11px;
  text-anchor: middle;
  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.78);
  stroke-width: 3px;
  stroke-linejoin: round;
}

.kg-node.selected circle,
.kg-node.highlight circle {
  stroke: #facc15;
  stroke-width: 4;
}

.knowledge-detail {
  position: sticky;
  top: 72px;
  display: grid;
  gap: 12px;
}

.knowledge-detail-head span {
  color: var(--muted);
  font-size: 12px;
}

.knowledge-detail-head h2 {
  margin: 6px 0 10px;
  font-size: 20px;
  line-height: 1.3;
}

.knowledge-detail-list {
  margin: 0;
  display: grid;
  gap: 8px;
}

.knowledge-detail-list dt {
  color: var(--muted);
  font-weight: 700;
}

.knowledge-detail-list dd {
  margin: -4px 0 4px;
  line-height: 1.55;
}

.knowledge-empty {
  min-height: 360px;
  display: grid;
  place-items: center;
}

.knowledge-split {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(360px, 1.1fr);
  gap: 12px;
  align-items: start;
}

.knowledge-split.wide {
  grid-template-columns: minmax(360px, 1fr) minmax(420px, 1.2fr);
}

.knowledge-entry-form textarea {
  min-height: 132px;
  resize: vertical;
}

.knowledge-entry-form select,
.knowledge-quick-modal select {
  width: 100%;
}

.knowledge-target-field {
  max-width: 260px;
  opacity: 0.78;
}

.knowledge-target-field label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.knowledge-target-field select {
  min-height: 38px;
  border-color: rgba(212, 225, 234, 0.75);
  background: rgba(248, 252, 255, 0.72);
  color: var(--muted);
  font-size: 13px;
}

.knowledge-quick-modal .knowledge-target-field {
  margin-top: -4px;
}

.knowledge-entry-form {
  display: grid;
}

.knowledge-entry-form .field {
  margin: 0;
  padding: 16px 16px 0;
  gap: 8px;
}

.knowledge-entry-form .field label {
  width: fit-content;
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
}

.knowledge-entry-form .knowledge-quick-input {
  min-height: 156px;
  border-radius: var(--radius-control);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 252, 255, 0.92)),
    #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.knowledge-entry-form .panel-actions {
  justify-content: flex-end;
  padding: 12px 16px 16px;
}

.knowledge-quick-modal {
  width: min(620px, 100%);
}

.knowledge-quick-input {
  width: 100%;
  min-height: 120px;
  resize: vertical;
  font-size: 15px;
  line-height: 1.6;
}

.knowledge-entry-list,
.knowledge-recommend-list,
.knowledge-gap-matrix {
  display: grid;
  gap: 10px;
}

.knowledge-entry-card,
.knowledge-kb-card,
.knowledge-recommend-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
  display: grid;
  gap: 8px;
  min-width: 0;
}

.knowledge-entry-card p,
.knowledge-kb-card p,
.knowledge-recommend-card p {
  margin: 0;
  color: #334155;
  line-height: 1.55;
}

.knowledge-card-meta,
.knowledge-score-row {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.knowledge-kb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
}

.knowledge-score-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.knowledge-heatmap {
  display: grid;
  gap: 10px;
}

.heat-row,
.gap-row {
  display: grid;
  gap: 6px;
}

.heat-row {
  grid-template-columns: 100px minmax(120px, 1fr) 54px;
  align-items: center;
}

.heat-row span,
.gap-row span {
  color: var(--muted);
  font-size: 12px;
}

.heat-row div,
.gap-bar {
  height: 10px;
  border-radius: 999px;
  background: #edf2f7;
  overflow: hidden;
}

.heat-row i,
.gap-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0d9488, #2563eb);
}

.heat-row b,
.gap-row b {
  color: #102331;
}

.knowledge-source-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.knowledge-source-chips span {
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef7ff;
  color: #1d4ed8;
  font-size: 12px;
}

.gap-row {
  grid-template-columns: minmax(120px, 1fr) 110px minmax(120px, 0.8fr) 54px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.knowledge-manager-shell {
  display: grid;
  gap: 12px;
}

.knowledge-manager-overview .panel-head {
  align-items: center;
  gap: 12px;
}

.knowledge-manager-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.knowledge-manager-actions button {
  border-radius: 999px;
  white-space: nowrap;
}

.knowledge-manager-metrics {
  margin-bottom: 0;
}

.knowledge-manager-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.knowledge-manager-card {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.76), rgba(255, 255, 255, 0.96)),
    var(--panel-solid);
  box-shadow: var(--shadow-soft);
}

.knowledge-manager-card-head,
.knowledge-manager-row {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.knowledge-manager-card-head span,
.knowledge-manager-row span,
.knowledge-manager-shell .muted {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.knowledge-manager-card-head strong,
.knowledge-manager-row strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.knowledge-manager-list {
  display: grid;
}

.knowledge-manager-row {
  padding: 9px 0;
  border-top: 1px solid rgba(212, 225, 234, 0.72);
}

.knowledge-manager-row:first-child {
  padding-top: 0;
  border-top: 0;
}

.knowledge-table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.knowledge-table-actions button {
  min-height: 28px;
  padding: 0 9px;
  border-radius: 999px;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .knowledge-layout,
  .knowledge-split,
  .knowledge-split.wide,
  .knowledge-manager-grid {
    grid-template-columns: 1fr;
  }

  .knowledge-detail {
    position: static;
  }
}

.main {
  flex: 1 1 auto;
  min-height: 0;
  padding: 26px 28px 30px;
  overflow-x: hidden;
  overflow-y: auto;
}

.app-embedded-shell {
  min-height: 100vh;
  background: var(--bg);
}

.app-embedded-main {
  min-height: 100vh;
  padding: 0;
  overflow: auto;
}

.topbar.embedded + .main {
  padding-top: 0;
}

.topbar.embedded.previewing + .main {
  padding-top: 0;
}

.watch-center-page {
  background: #f0f2f5;
  border-radius: 12px;
  color: #111827;
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: calc(100vh - 96px);
  padding: 0;
}

.watch-center-header {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 0 0 2px;
}

.watch-center-title {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  min-width: 0;
}

.watch-center-title h1 {
  font-size: 24px;
  line-height: 1.1;
  margin: 0;
}

.watch-center-title h1::before {
  content: "▮▮▮";
  color: #1677ff;
  font-size: 16px;
  letter-spacing: 1px;
  margin-right: 8px;
  vertical-align: 2px;
}

.watch-center-tabs {
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 9px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05);
  display: flex;
  overflow: hidden;
}

.watch-center-tabs button {
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: #666;
  font-size: 14px;
  font-weight: 700;
  min-height: 38px;
  padding: 0 22px;
}

.watch-center-tabs button.active {
  background: #1677ff;
  color: #fff;
}

.watch-center-platform {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-left: auto;
}

.watch-center-platform span {
  color: #94a3b8;
  font-size: 12px;
  font-weight: 700;
}

.watch-center-platform select {
  background: #fff;
  border: 1px solid #d8dee8;
  border-radius: 8px;
  min-height: 38px;
  min-width: 160px;
  width: auto;
}

.watch-center-refreshbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.watch-center-refreshbar button {
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  min-height: 36px;
  padding: 0 14px;
}

.watch-center-refreshbar button.primary {
  background: #1677ff;
  border-color: #1677ff;
}

.watch-center-refreshbar > em {
  color: #a8adb6;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  margin-left: auto;
}

.watch-center-auto-toggle {
  align-items: center;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: #999;
  display: inline-flex;
  gap: 8px;
  padding: 0 8px;
}

.watch-center-auto-toggle span {
  background: #d9d9d9;
  border-radius: 999px;
  display: inline-flex;
  height: 20px;
  position: relative;
  width: 38px;
}

.watch-center-auto-toggle span::after {
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
  content: "";
  height: 16px;
  left: 2px;
  position: absolute;
  top: 2px;
  transition: left 0.18s ease;
  width: 16px;
}

.watch-center-auto-toggle.on span {
  background: #52c41a;
}

.watch-center-auto-toggle.on span::after {
  left: 20px;
}

.watch-center-filterbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.watch-center-filter-label,
.watch-center-result {
  color: #9ca3af;
  font-size: 12px;
  font-weight: 700;
}

.watch-center-result {
  margin-left: auto;
}

.watch-center-filter {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
  color: #4b5563;
  font-size: 12px;
  min-height: 30px;
  padding: 0 14px;
}

.watch-center-filter.active {
  background: #e6f7ff;
  border-color: #1677ff;
  color: #1677ff;
}

.watch-center-ai {
  align-items: center;
  background: linear-gradient(135deg, #f0f6ff, #f6ffed);
  border: 1px solid #b7d4ff;
  border-radius: 12px;
  display: flex;
  gap: 14px;
  min-height: 52px;
  padding: 12px 18px;
}

.watch-center-ai span {
  background: #1677ff;
  border-radius: 999px;
  color: #fff;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  padding: 5px 12px;
}

.watch-center-ai p {
  color: #1f2937;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  margin: 0;
}

.watch-center-ai strong {
  color: #1677ff;
}

.watch-center-highlight {
  background: #fff7e6;
  border-radius: 4px;
  color: #d46b08;
  padding: 1px 5px;
}

.watch-center-stats {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.watch-center-stat {
  background: #fff;
  border: 1px solid #edf0f5;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
  min-height: 76px;
  padding: 14px 16px;
}

.watch-center-stat span {
  color: #a3a3a3;
  display: block;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 4px;
}

.watch-center-stat strong {
  display: block;
  font-size: 28px;
  line-height: 1;
}

.watch-center-stat.blue strong {
  color: #1677ff;
}

.watch-center-stat.green strong {
  color: #52c41a;
}

.watch-center-stat.orange strong {
  color: #fa8c16;
}

.watch-center-stat.red strong {
  color: #ff4d4f;
}

.watch-center-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(360px, 1fr));
}

.watch-center-card {
  background: #fff;
  border: 1px solid #edf0f5;
  border-radius: 12px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}

.watch-center-card-head {
  align-items: center;
  border-bottom: 1px solid #f0f2f5;
  display: grid;
  gap: 12px;
  grid-template-columns: 68px minmax(0, 1fr);
  min-height: 94px;
  padding: 16px 18px;
}

.watch-center-cover,
.watch-center-avatar {
  border-radius: 9px;
  height: 64px;
  object-fit: cover;
  width: 64px;
}

.watch-center-avatar {
  align-items: center;
  background: #eef6ff;
  color: #1677ff;
  display: flex;
  font-size: 24px;
  font-weight: 800;
  justify-content: center;
}

.watch-center-card-title {
  min-width: 0;
}

.watch-center-card-title h2 {
  color: #111827;
  font-size: 16px;
  line-height: 1.35;
  margin: 0 0 6px;
  max-height: 44px;
  overflow: hidden;
}

.watch-center-card-title p {
  color: #8b8f98;
  display: flex;
  flex-wrap: wrap;
  font-size: 13px;
  font-weight: 700;
  gap: 8px;
  margin: 0;
}

.watch-center-card-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px 18px 16px;
}

.watch-center-card-body section h3 {
  color: #1677ff;
  font-size: 13px;
  line-height: 1.2;
  margin: 0 0 7px;
}

.watch-center-chart-label {
  color: #999;
  display: flex;
  font-size: 11px;
  font-weight: 700;
  justify-content: space-between;
  margin-bottom: 4px;
}

.watch-center-chart-bars {
  align-items: flex-end;
  display: flex;
  gap: 4px;
  height: 70px;
  padding: 5px 2px 0;
}

.watch-center-chart-bars i {
  border-radius: 3px 3px 0 0;
  flex: 1 1 10px;
  min-width: 10px;
  position: relative;
}

.watch-center-chart-bars.green i {
  background: #48c713;
}

.watch-center-chart-bars.blue i {
  background: #83cdf7;
}

.watch-center-chart-bars i span {
  background: #111827;
  border-radius: 4px;
  bottom: 100%;
  color: #fff;
  display: none;
  font-size: 10px;
  left: 50%;
  padding: 2px 5px;
  position: absolute;
  transform: translateX(-50%);
  white-space: nowrap;
}

.watch-center-chart-bars i:hover span {
  display: block;
}

.watch-center-chart-empty,
.watch-center-missing {
  align-items: center;
  background: #f8fafc;
  border: 1px dashed #d9e2ef;
  border-radius: 8px;
  color: #94a3b8;
  display: flex;
  font-size: 12px;
  font-weight: 700;
  min-height: 44px;
  padding: 8px 10px;
}

.watch-center-change-row {
  align-items: center;
  border-bottom: 1px solid #f5f6f8;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  min-height: 28px;
}

.watch-center-change-row span {
  color: #666;
  flex: 0 0 82px;
  font-size: 13px;
}

.watch-center-change-row div {
  align-items: center;
  display: flex;
  gap: 7px;
  justify-content: flex-end;
  min-width: 0;
}

.watch-center-change-row em {
  color: #999;
  font-size: 12px;
  font-style: normal;
  text-decoration: line-through;
}

.watch-center-change-row b {
  color: #1677ff;
  font-size: 12px;
}

.watch-center-change-row strong {
  color: #333;
  font-size: 14px;
}

.watch-center-change-row i {
  border-radius: 4px;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  padding: 2px 6px;
}

.watch-center-change-row i.up {
  background: #f6ffed;
  color: #52c41a;
}

.watch-center-change-row i.down {
  background: #fff2f0;
  color: #ff4d4f;
}

.watch-center-change-row i.warn,
.watch-center-change-row i.flat {
  background: #fffbe6;
  color: #d48806;
}

.watch-center-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.watch-center-tags span {
  background: #e6f7ff;
  border-radius: 5px;
  color: #1677ff;
  font-size: 12px;
  font-weight: 800;
  padding: 3px 8px;
}

.watch-center-alert {
  border-radius: 7px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.6;
  padding: 8px 10px;
}

.watch-center-alert.good {
  background: #f6ffed;
  color: #389e0d;
}

.watch-center-alert.warn {
  background: #fffbe6;
  color: #d48806;
}

.watch-center-alert.bad {
  background: #fff2f0;
  color: #ff4d4f;
}

.watch-center-store-stats {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.watch-center-store-stats div {
  background: #fafafa;
  border-radius: 8px;
  padding: 9px 6px;
  text-align: center;
}

.watch-center-store-stats strong {
  color: #111827;
  display: block;
  font-size: 18px;
}

.watch-center-store-stats span {
  color: #999;
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-top: 2px;
}

.watch-center-backend-facts {
  background: #f8fbff;
  border: 1px solid #e2efff;
  border-radius: 8px;
  padding: 10px;
}

.watch-center-backend-facts h3 {
  color: #1677ff;
  font-size: 12px;
  margin: 0 0 8px;
}

.watch-center-backend-facts > div {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.watch-center-backend-facts p {
  margin: 0;
  min-width: 0;
}

.watch-center-backend-facts span {
  color: #8c8c8c;
  display: block;
  font-size: 11px;
  font-weight: 700;
}

.watch-center-backend-facts strong {
  color: #1f2937;
  display: block;
  font-size: 13px;
  line-height: 1.35;
  margin-top: 2px;
  overflow-wrap: anywhere;
}

.watch-center-store-trace {
  align-items: center;
  background: #fafafa;
  border: 1px solid #f0f0f0;
  border-radius: 8px;
  color: #8c8c8c;
  display: flex;
  font-size: 12px;
  justify-content: space-between;
  padding: 8px 10px;
}

.watch-center-store-trace strong {
  color: #1f2937;
  font-size: 13px;
}

.watch-center-card-foot {
  align-items: center;
  border-top: 1px solid #f5f6f8;
  color: #999;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  min-height: 56px;
  padding: 10px 18px;
}

.watch-center-card-foot > span {
  font-size: 12px;
  font-weight: 700;
}

.watch-center-card-foot > div {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}

.watch-center-card-btn {
  align-items: center;
  background: #fff;
  border: 1px solid #d9d9d9;
  border-radius: 6px;
  color: #475569;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  min-height: 30px;
  padding: 0 10px;
  text-decoration: none;
}

.watch-center-card-btn:hover {
  border-color: #1677ff;
  color: #1677ff;
}

.watch-center-card-btn.danger {
  border-color: #ff4d4f;
  color: #ff4d4f;
}

.watch-center-card-btn:disabled {
  color: #b4b8c1;
  cursor: not-allowed;
}

.watch-center-empty {
  align-items: center;
  background: #fff;
  border: 1px dashed #cad5e3;
  border-radius: 12px;
  color: #64748b;
  display: flex;
  flex-direction: column;
  gap: 8px;
  grid-column: 1 / -1;
  justify-content: center;
  min-height: 220px;
  padding: 28px;
  text-align: center;
}

.watch-center-empty strong {
  color: #111827;
  font-size: 18px;
}

.toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.toolbar-left,
.toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.search {
  width: min(360px, 45vw);
}

.filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
}

.filter-bar select {
  min-width: 118px;
  max-width: 180px;
}

.material-filter-bar {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
}

.material-view-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.material-view-toggle button {
  min-height: 30px;
  padding: 0 10px;
  border-color: transparent;
  background: transparent;
}

.material-view-toggle button.active {
  background: var(--accent);
  color: #fff;
}

.material-gallery {
  display: grid;
  gap: 14px;
}

.material-gallery-group {
  display: grid;
  gap: 8px;
}

.material-gallery-heading {
  display: flex;
  align-items: center;
  gap: 8px;
}

.material-gallery-heading h2 {
  margin: 0;
  font-size: 16px;
}

.material-gallery-heading span {
  display: inline-grid;
  place-items: center;
  min-width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #e8f1f2;
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
}

.material-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap: 10px;
}

.material-card {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 10px 22px rgba(20, 33, 43, 0.04);
}

.material-card-image {
  width: 100%;
  aspect-ratio: 1;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #f7fafc;
  cursor: zoom-in;
  overflow: hidden;
}

.material-card-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.material-card-image.empty-image {
  display: grid;
  place-items: center;
  color: var(--muted);
}

.material-card-body {
  display: grid;
  gap: 4px;
  padding: 9px;
}

.material-card-body strong,
.material-card-body span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.material-card-body strong {
  font-size: 14px;
}

.material-card-body span {
  color: var(--muted);
  font-size: 12px;
}

.material-card-thumbs {
  display: flex;
  gap: 5px;
  margin-top: 2px;
}

.material-card-thumbs button {
  width: 30px;
  height: 30px;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border-radius: 6px;
  overflow: hidden;
}

.material-card-thumbs img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.material-card-actions {
  display: flex;
  gap: 6px;
  padding: 0 9px 9px;
}

.material-card-actions button {
  flex: 1 1 0;
  min-width: 0;
  min-height: 30px;
}

.material-card-actions button.active,
.material-compare-tray button.active,
.material-insight-actions button.active,
.material-color-point button.active {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.attendance-admin {
  display: grid;
  gap: 14px;
}

.attendance-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.attendance-shortcut-groups {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.attendance-shortcut-group {
  display: grid;
  gap: 8px;
  align-content: start;
}

.attendance-shortcut-group h3 {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.attendance-shortcut-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.attendance-shortcut-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-height: 36px;
  min-width: 0;
}

.attendance-shortcut-actions .mark {
  flex: 0 0 auto;
  width: 28px;
  height: 22px;
  border-radius: 6px;
  background: #edf2f7;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
}

.attendance-shortcut-actions button span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.attendance-tag {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: #e8f7f4;
  color: #0f766e;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.attendance-tag.warn {
  background: #fff7d6;
  color: #a16207;
}

.attendance-tag.danger {
  background: #fee2e2;
  color: #b91c1c;
}

.attendance-request-list {
  display: grid;
  gap: 8px;
}

.attendance-request {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
}

.attendance-request strong,
.attendance-request span {
  display: block;
}

.attendance-request span,
.attendance-request p {
  color: var(--muted);
  font-size: 12px;
}

.attendance-request p {
  margin: 4px 0 0;
}

.attendance-request-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.material-science-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 12px;
  align-items: start;
}

.material-map-main {
  min-width: 0;
}

.material-map-legend {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 8px;
}

.material-map-legend strong {
  font-size: 16px;
}

.material-map-legend span {
  color: var(--muted);
  font-size: 12px;
}

.material-color-map {
  display: grid;
  grid-template-columns: 56px repeat(9, minmax(96px, 1fr));
  gap: 6px;
  min-width: 980px;
  overflow: visible;
}

.material-map-axis {
  min-height: 30px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #eef4f6;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}

.material-map-axis.color-red {
  background: #ffe5e8;
}

.material-map-axis.color-orange {
  background: #ffe9d5;
}

.material-map-axis.color-yellow {
  background: #fff6c7;
}

.material-map-axis.color-green {
  background: #dcfce7;
}

.material-map-axis.color-cyan {
  background: #cffafe;
}

.material-map-axis.color-blue {
  background: #dbeafe;
}

.material-map-axis.color-purple {
  background: #ede9fe;
}

.material-map-axis.color-pink {
  background: #fce7f3;
}

.material-map-axis.color-gray {
  background: #e5e7eb;
}

.lightness-label {
  min-height: 132px;
}

.material-map-cell {
  min-height: 132px;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 6px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
}

.material-color-point {
  position: relative;
  width: 74px;
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 5px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 8px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--material-color), white 78%), #fff 46%),
    #fff;
  box-shadow: inset 0 3px 0 var(--material-color);
}

.material-color-point.selected {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.material-color-point > button:first-child {
  width: 100%;
  aspect-ratio: 1;
  min-width: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

.material-color-point img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.image-preview-mini {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 22px;
  min-height: 22px;
  padding: 0;
  border-radius: 6px;
  border-color: rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.9);
  color: var(--text);
  font-size: 12px;
  line-height: 1;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.1);
}

.image-preview-mini:hover {
  border-color: var(--accent);
  color: var(--accent-dark);
}

.material-color-point strong,
.material-color-point span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.material-color-point strong {
  font-size: 11px;
}

.material-color-point span {
  color: var(--muted);
  font-size: 10px;
}

.material-color-point [data-compare-material] {
  min-height: 24px;
  padding: 0 4px;
  font-size: 10px;
}

.material-phenomena {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}

.material-phenomena span {
  min-height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: rgba(15, 118, 110, 0.1);
  color: var(--accent-dark);
  font-size: 10px;
  line-height: 18px;
}

.material-insight-panel {
  position: sticky;
  top: 12px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 28px rgba(20, 33, 43, 0.06);
}

.material-insight-cover {
  border-radius: 8px;
  background: color-mix(in srgb, var(--material-color), white 78%);
  overflow: hidden;
  box-shadow: inset 0 4px 0 var(--material-color);
}

.material-insight-cover button {
  width: 100%;
  aspect-ratio: 1.1;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: hidden;
}

.material-insight-cover img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.material-insight-body {
  display: grid;
  gap: 6px;
}

.material-insight-body > strong {
  font-size: 16px;
}

.material-insight-body > span {
  color: var(--muted);
  font-size: 12px;
}

.material-insight-actions {
  display: flex;
  gap: 6px;
}

.material-insight-actions button {
  flex: 1 1 0;
  min-width: 0;
}

.material-insight-thumbs,
.material-card-thumbs {
  display: flex;
  gap: 5px;
}

.material-insight-thumbs button {
  width: 42px;
  height: 42px;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border-radius: 6px;
  overflow: hidden;
}

.material-insight-thumbs img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.material-similar-band {
  display: grid;
  gap: 6px;
}

.material-similar-band h3 {
  margin: 4px 0 0;
  font-size: 14px;
}

.material-similar-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 5px;
  border-color: color-mix(in srgb, var(--material-color), #94a3b8 45%);
  background: color-mix(in srgb, var(--material-color), white 86%);
}

.material-similar-item img {
  width: 42px;
  height: 42px;
  border-radius: 6px;
  object-fit: cover;
}

.material-similar-item span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}

.material-compare-tray {
  display: grid;
  gap: 8px;
  margin: 0 0 12px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 16px 34px rgba(20, 33, 43, 0.12);
  backdrop-filter: blur(12px);
}

.material-compare-head {
  display: flex;
  align-items: center;
  gap: 8px;
}

.material-compare-head span {
  color: var(--muted);
  font-size: 12px;
}

.material-compare-head button {
  margin-left: auto;
  min-height: 30px;
}

.material-compare-items {
  display: flex;
  gap: 8px;
  overflow-x: auto;
}

.material-compare-item {
  flex: 0 0 180px;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 30px;
  align-items: center;
  gap: 7px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
}

.material-compare-item > button:first-child {
  width: 46px;
  height: 46px;
  min-width: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

.material-compare-item img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.material-compare-item strong,
.material-compare-item span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.material-compare-item span,
.material-compare-empty {
  color: var(--muted);
  font-size: 12px;
}

.material-compare-empty {
  padding: 8px 2px;
}

.grid {
  display: grid;
  gap: 14px;
}

.stats {
  grid-template-columns: repeat(6, minmax(130px, 1fr));
}

.stat {
  position: relative;
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.78) 0%, rgba(255, 255, 255, 0.94) 36%),
    var(--panel-solid);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  padding: 16px;
  box-shadow: var(--shadow);
  overflow: hidden;
}

.stat span {
  color: var(--muted);
}

.stat strong {
  display: block;
  margin-top: 8px;
  font-size: 26px;
}

.stat::after {
  content: "";
  display: block;
  height: 4px;
  margin-top: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--aqua), rgba(79, 91, 213, 0.18));
}

.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  gap: 14px;
  margin-top: 14px;
}

.page-hero {
  min-height: 132px;
  display: grid;
  grid-template-columns: minmax(220px, 0.82fr) minmax(0, 1.18fr);
  gap: 18px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background:
    radial-gradient(circle at 80% 22%, rgba(220, 232, 255, 0.5), transparent 34%),
    linear-gradient(135deg, rgba(237, 247, 251, 0.9), rgba(255, 255, 255, 0.95)),
    rgba(255, 255, 255, 0.9);
  padding: 22px;
  box-shadow: var(--shadow);
}

.page-hero-copy {
  min-width: 0;
}

.page-hero-copy span {
  color: var(--muted);
  font-size: 14px;
}

.page-hero-copy h2 {
  margin: 6px 0 0;
  font-size: 30px;
  line-height: 1.16;
}

.page-hero-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}

.page-hero-kpis div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.86);
  padding: 12px;
  box-shadow: 0 6px 16px rgba(37, 99, 111, 0.035);
}

.page-hero-kpis span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.page-hero-kpis strong {
  display: block;
  margin-top: 6px;
  font-size: 22px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page-hero-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: -4px;
}

.page-hero-product_publish_workbench {
  display: none;
  min-height: 0;
  grid-template-columns: minmax(220px, 0.42fr) minmax(0, 1fr);
  padding: 0;
}

.page-hero-product_publish_workbench .page-hero-copy h2 {
  font-size: 26px;
}

.page-hero-product_publish_workbench .page-hero-kpis {
  grid-template-columns: repeat(6, minmax(98px, 1fr));
}

.page-hero-product_publish_workbench .page-hero-kpis div {
  padding: 10px 12px;
}

.page-hero-product_publish_workbench .page-hero-kpis strong {
  margin-top: 4px;
  font-size: 20px;
}

.page-hero + .toolbar,
.page-hero + .ha-shell,
.page-hero + .knowledge-shell,
.page-hero + .notice,
.page-hero + .grid,
.page-hero + .panel,
.page-hero + .role-toolbar,
.page-hero + .print-consumable-shell,
.page-hero + .production-management-shell,
.page-hero + .attendance-admin {
  margin-top: 14px;
}

.page-hero-review_dashboard {
  min-height: 96px;
  grid-template-columns: minmax(150px, 0.34fr) minmax(0, 1.66fr);
  gap: 10px;
  padding: 12px;
}

.page-hero-review_dashboard .page-hero-copy h2 {
  font-size: 24px;
}

.page-hero-review_dashboard .page-hero-kpis {
  grid-template-columns: repeat(5, minmax(96px, 1fr));
  gap: 6px;
}

.page-hero-review_dashboard .page-hero-kpis div {
  padding: 8px 10px;
}

.page-hero-review_dashboard .page-hero-kpis strong {
  margin-top: 3px;
  font-size: 18px;
}

.page-hero-products {
  min-height: 54px;
  grid-template-columns: minmax(170px, 0.42fr) minmax(0, 1.58fr);
  gap: 8px;
  padding: 7px 10px;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.page-hero-products .page-hero-copy span {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.page-hero-products .page-hero-copy h2 {
  margin-top: 2px;
  font-size: 19px;
  line-height: 1.05;
}

.page-hero-products .page-hero-kpis {
  grid-template-columns: repeat(5, minmax(88px, 1fr));
  gap: 5px;
}

.page-hero-products .page-hero-kpis div {
  padding: 5px 7px;
  border-radius: 7px;
  box-shadow: none;
}

.page-hero-products .page-hero-kpis span {
  font-size: 10.5px;
  line-height: 1.1;
}

.page-hero-products .page-hero-kpis strong {
  margin-top: 1px;
  font-size: 15px;
  line-height: 1.1;
}

.page-hero-products + .sku-sheet-toolbar {
  margin-top: 6px;
}

.page-hero-home_assistant {
  min-height: 42px;
  grid-template-columns: 1fr;
  gap: 0;
  padding: 6px 10px;
}

.page-hero-home_assistant .page-hero-copy h2 {
  margin-top: 2px;
  font-size: 18px;
}

.page-hero-home_assistant .page-hero-copy span {
  font-size: 12px;
}

.page-hero-home_assistant .page-hero-kpis {
  display: none;
}

.page-hero-home_assistant .page-hero-kpis div {
  padding: 5px 7px;
  border-radius: 8px;
}

.page-hero-home_assistant .page-hero-kpis span {
  font-size: 10px;
}

.page-hero-home_assistant .page-hero-kpis strong {
  margin-top: 2px;
  font-size: 14px;
}

.page-hero-home_assistant .page-hero-actions {
  margin-top: -2px;
}

.page-hero-home_assistant .page-hero-actions button {
  min-height: 28px;
  padding: 0 10px;
}

.page-hero + .production-screen-shell {
  margin-top: 8px;
}

.ha-config-disclosure {
  margin-top: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.ha-config-disclosure[hidden] {
  display: none !important;
}

.ha-config-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 38px;
  padding: 8px 12px;
  cursor: pointer;
  list-style: none;
}

.ha-config-disclosure > summary::-webkit-details-marker {
  display: none;
}

.ha-config-disclosure > summary strong {
  color: var(--text);
  font-size: 13px;
}

.ha-config-disclosure > summary span {
  color: var(--muted);
  font-size: 11px;
  text-align: right;
}

.ha-config-disclosure[open] {
  padding-bottom: 10px;
}

.ha-config-disclosure .ha-shell {
  margin: 0;
  padding: 0 10px 10px;
}

.ha-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 14px;
}

.ha-intake-panel,
.ha-summary-panel,
.ha-choice-panel,
.ha-scope-panel,
.ha-route-panel {
  min-width: 0;
}

.ha-intake-panel .panel-head span,
.ha-choice-panel .panel-head span,
.ha-scope-panel .panel-head span,
.ha-route-panel .panel-head span {
  color: var(--muted);
  font-size: 12px;
}

.ha-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 14px;
}

.ha-form-grid label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ha-form-grid label.wide {
  grid-column: 1 / -1;
}

.ha-form-grid label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.ha-form-grid textarea {
  min-height: 112px;
  resize: vertical;
}

.ha-connect-panel {
  display: grid;
  gap: 12px;
  margin: 0 14px 14px;
  padding: 12px;
  border: 1px solid rgba(20, 160, 152, 0.24);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(236, 253, 245, 0.64), rgba(255, 255, 255, 0.92));
}

.ha-connect-panel > div:first-child {
  display: grid;
  gap: 4px;
}

.ha-connect-panel strong {
  color: var(--text);
  font-size: 13px;
}

.ha-connect-panel span,
.ha-connect-panel em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.5;
}

.ha-connect-panel #haServerConfigBadge {
  width: fit-content;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(100, 116, 139, 0.12);
  color: var(--muted);
  font-weight: 800;
}

.ha-connect-panel #haServerConfigBadge.ready {
  background: rgba(20, 160, 152, 0.14);
  color: #0f766e;
}

.ha-connect-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ha-connect-actions button {
  min-height: 32px;
}

.ha-connection-result {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.8);
}

.ha-connection-result.pending {
  border-color: rgba(79, 91, 213, 0.28);
  background: rgba(239, 242, 255, 0.78);
}

.ha-connection-result.success {
  border-color: rgba(20, 160, 152, 0.34);
  background: rgba(236, 253, 245, 0.78);
}

.ha-connection-result.error {
  border-color: rgba(220, 38, 38, 0.28);
  background: rgba(254, 242, 242, 0.82);
}

.ha-result-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.ha-result-grid div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.86);
}

.ha-result-grid strong,
.ha-result-grid span,
.ha-result-grid em {
  min-width: 0;
  overflow-wrap: anywhere;
}

.ha-result-grid span {
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-weight: 800;
}

.ha-realtime-panel {
  margin: 0 14px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.78);
  overflow: hidden;
}

.ha-realtime-panel .panel-head {
  align-items: start;
}

.ha-realtime-panel .panel-head > div:first-child {
  display: grid;
  gap: 4px;
}

.ha-realtime-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  max-width: 100%;
  min-width: 0;
  justify-content: flex-end;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-gutter: stable;
}

.ha-realtime-actions button {
  flex: 0 0 auto;
  min-height: 28px;
  padding: 0 9px;
}

.ha-realtime-status {
  display: grid;
  gap: 4px;
  margin: 12px 14px 0;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8fbff;
}

.ha-realtime-status strong {
  color: var(--text);
  font-size: 14px;
}

.ha-realtime-status span {
  color: var(--muted);
  font-size: 12px;
}

.ha-realtime-status.streaming {
  border-color: rgba(20, 160, 152, 0.34);
  background: rgba(236, 253, 245, 0.78);
}

.ha-realtime-status.not_configured {
  border-color: rgba(100, 116, 139, 0.24);
  background: rgba(248, 250, 252, 0.9);
}

.ha-realtime-status.reconnecting,
.ha-realtime-status.connecting,
.ha-realtime-status.authenticating,
.ha-realtime-status.subscribing,
.ha-realtime-status.snapshot_loading {
  border-color: rgba(79, 91, 213, 0.28);
  background: rgba(239, 242, 255, 0.78);
}

.ha-realtime-status.auth_invalid,
.ha-realtime-status.dependency_missing {
  border-color: rgba(220, 38, 38, 0.28);
  background: rgba(254, 242, 242, 0.82);
}

.ha-realtime-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  padding: 12px 14px;
}

.ha-realtime-kpis div {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.82);
}

.ha-realtime-kpis span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.ha-realtime-kpis strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text);
  font-size: 20px;
  line-height: 1;
}

.ha-realtime-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0 14px 14px;
}

.ha-realtime-grid section {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(248, 251, 255, 0.86);
}

.ha-realtime-grid h3 {
  margin: 0 0 10px;
  color: var(--text);
  font-size: 13px;
}

.ha-realtime-bars,
.ha-realtime-list {
  display: grid;
  gap: 8px;
}

.ha-realtime-bar {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 34px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #ffffff;
  overflow: hidden;
}

.ha-realtime-bar span,
.ha-realtime-bar strong {
  position: relative;
  z-index: 1;
}

.ha-realtime-bar span {
  min-width: 0;
  overflow: hidden;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ha-realtime-bar strong {
  color: var(--text);
  font-size: 12px;
}

.ha-realtime-bar em {
  position: absolute;
  inset: 0 auto 0 0;
  background: linear-gradient(90deg, rgba(20, 160, 152, 0.18), rgba(79, 91, 213, 0.1));
}

.ha-realtime-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #ffffff;
}

.ha-realtime-row strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text);
  font-size: 12px;
}

.ha-realtime-row span {
  color: var(--accent-dark);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: 12px;
  font-weight: 800;
}

.ha-realtime-row em {
  grid-column: 1 / -1;
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.ha-realtime-row .ha-realtime-inline-action {
  grid-column: 1 / -1;
  justify-self: start;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 11px;
}

.ha-realtime-row .ha-realtime-inline-action.danger {
  border-color: rgba(190, 18, 60, 0.28);
  color: #be123c;
  background: #fff1f2;
}

.ha-realtime-empty {
  padding: 10px;
  border: 1px dashed var(--line);
  border-radius: 9px;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}

.production-screen-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 8px;
  align-items: start;
  height: auto;
  min-height: 0;
  margin-bottom: 8px;
  overflow: visible;
}

.production-screen-shell > .panel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: visible;
}

.production-screen-shell .panel-head {
  min-height: 30px;
  padding: 5px 8px;
}

.production-screen-shell .panel-head h2 {
  font-size: 12px;
}

.production-screen-shell .panel-head span {
  font-size: 10px;
}

.production-screen-main {
  grid-column: 1 / 2;
  grid-row: 1;
  overflow: visible;
}

.production-screen-main > .panel-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  flex: 0 0 auto;
  gap: 5px;
}

.production-screen-main > .panel-head > div:first-child {
  min-width: 0;
}

.production-screen-main > .panel-head h2,
.production-screen-main > .panel-head span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.production-screen-main .ha-realtime-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  width: 100%;
  min-width: 0;
  overflow: visible !important;
  max-width: none;
  transform: none;
}

.production-screen-main .ha-realtime-actions button {
  flex: 0 1 auto;
  min-width: 66px;
  min-height: 28px;
  padding: 0 9px;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}

.production-screen-main .ha-realtime-actions button.primary {
  min-width: 88px;
}

.production-screen-time-filters {
  display: grid;
  grid-template-columns: 94px 148px 148px;
  align-items: end;
  justify-content: start;
  gap: 5px 6px;
}

.production-screen-time-filters label {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.production-screen-time-filters span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.production-screen-time-filters select,
.production-screen-time-filters input {
  width: 100%;
  min-width: 0;
  min-height: 26px;
  padding: 3px 8px;
  border-radius: 7px;
  font-size: 11px;
}

.production-screen-orders-panel {
  grid-column: 1 / 2;
  grid-row: 2;
}

.production-screen-side-panel {
  grid-column: 2 / 3;
  grid-row: 1 / span 2;
  max-height: clamp(360px, calc(100vh - 130px), 760px);
  overflow: hidden;
}

.production-screen-handoff-panel {
  margin-top: 8px;
  overflow: hidden;
}

.production-screen-handoff-panel > summary.panel-head {
  cursor: pointer;
  list-style: none;
}

.production-screen-handoff-panel > summary.panel-head::-webkit-details-marker {
  display: none;
}

.production-screen-handoff-panel > summary.panel-head > strong {
  flex: 0 0 auto;
  color: var(--accent-dark);
  font-size: 12px;
}

.production-screen-handoff-panel[open] > summary.panel-head > strong {
  color: var(--muted);
}

.production-screen-handoff-tools {
  display: flex;
  justify-content: flex-end;
  padding: 5px 8px 0;
}

.production-screen-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  flex: 0 0 auto;
  gap: 4px;
  padding: 5px 8px;
}

.production-screen-kpis div {
  gap: 2px;
  min-height: 36px;
  padding: 4px 6px;
  border-radius: 7px;
}

.production-screen-kpis span {
  font-size: 9px;
}

.production-screen-kpis strong {
  font-size: 15px;
}

.production-screen-progress {
  display: grid;
  flex: 0 0 auto;
  gap: 4px;
  padding: 0 8px 5px;
}

.production-screen-progress > div:first-child {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.production-screen-progress strong {
  color: var(--text);
  font-size: 18px;
  line-height: 1;
}

.production-screen-flow {
  display: grid;
  flex: 0 0 48px;
  grid-auto-flow: column;
  grid-auto-columns: minmax(96px, 1fr);
  grid-auto-rows: 40px;
  grid-template-columns: none;
  gap: 4px;
  height: 48px;
  padding: 0 8px 4px;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: auto;
  scrollbar-gutter: stable;
}

.production-screen-flow-item {
  position: relative;
  display: grid;
  gap: 1px;
  min-width: 0;
  min-height: 0;
  height: 40px;
  padding: 4px 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(248, 251, 255, 0.9);
  overflow: hidden;
}

.production-screen-flow-item span,
.production-screen-flow-item strong,
.production-screen-flow-item em {
  position: relative;
  z-index: 1;
}

.production-screen-flow-item span {
  color: var(--accent-dark);
  font-size: 9px;
  font-weight: 900;
}

.production-screen-flow-item strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text);
  font-size: 10px;
  line-height: 1.1;
}

.production-screen-flow-item em {
  color: var(--muted);
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
}

.production-screen-flow-item i {
  position: absolute;
  inset: auto auto 0 0;
  height: 3px;
  background: linear-gradient(90deg, rgba(20, 160, 152, 0.85), rgba(79, 91, 213, 0.75));
}

.production-screen-compact-section {
  display: grid;
  gap: 4px;
  margin: 0 8px 8px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(248, 251, 255, 0.86);
}

.production-screen-compact-section h3,
.production-screen-record-group h3 {
  margin: 0;
  color: var(--text);
  font-size: 11px;
}

.production-screen-orders-panel {
  align-self: stretch;
  min-height: 0;
}

.production-screen-order-list {
  display: grid;
  align-content: start;
  gap: 5px;
  padding: 8px;
  scrollbar-gutter: stable;
}

.production-screen-order-list {
  flex: 1 1 auto;
  min-height: 0;
  max-height: clamp(180px, calc(100vh - 430px), 420px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.production-screen-order {
  display: grid;
  gap: 5px;
  min-width: 0;
  min-height: 96px;
  max-height: 112px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #ffffff;
}

.production-screen-order > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.production-screen-order strong {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.production-screen-order p {
  display: -webkit-box;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: #334155;
  font-size: 10px;
  line-height: 1.24;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.production-screen-order em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
}

.production-screen-order-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 3px;
}

.production-screen-order-metrics span {
  min-width: 0;
  padding: 3px 4px;
  border-radius: 5px;
  background: #f8fbff;
  color: #475569;
  font-size: 9px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.production-screen-side-grid,
.production-screen-handoff-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 8px;
}

.production-screen-handoff-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.production-screen-side-grid section,
.production-screen-handoff-grid section {
  min-width: 0;
  max-height: 320px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(248, 251, 255, 0.86);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.production-screen-side-grid h3,
.production-screen-handoff-grid h3 {
  margin: 0 0 4px;
  color: var(--text);
  font-size: 11px;
}

.production-screen-record-list {
  display: grid;
  align-content: start;
  gap: 6px;
  flex: 1 1 auto;
  min-height: 0;
  max-height: clamp(360px, calc(100vh - 170px), 700px);
  padding: 8px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.production-screen-record-group {
  display: grid;
  gap: 5px;
  min-width: 0;
  align-content: start;
  max-height: 220px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(248, 251, 255, 0.86);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.production-screen-record-group h3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.production-screen-record-group h3 span {
  min-width: 22px;
  padding: 1px 6px;
  border-radius: 999px;
  background: #eef6ff;
  color: #31547a;
  font-size: 10px;
  font-weight: 900;
  text-align: center;
}

.production-screen-record {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 2px 6px;
  min-width: 0;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
}

.production-screen-record strong {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.production-screen-record span {
  color: var(--accent-dark);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: 11px;
  font-weight: 900;
}

.production-screen-record.failed span {
  color: #be123c;
}

.production-screen-record em {
  grid-column: 1 / 3;
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.production-screen-record .ha-realtime-inline-action {
  grid-column: 3;
  grid-row: 1 / span 2;
  align-self: center;
  justify-self: end;
  min-height: 22px;
  padding: 1px 7px;
  border-radius: 6px;
  border-color: var(--line);
  background: #f8fbff;
  color: #334155;
  font-size: 10px;
}

.production-screen-decision-panel {
  margin-top: 8px;
  overflow: visible;
}

.production-screen-decision-panel > summary {
  cursor: pointer;
  list-style: none;
}

.production-screen-decision-panel > summary::-webkit-details-marker {
  display: none;
}

.production-screen-decision-panel > summary > strong {
  color: var(--muted);
  font-size: 11px;
}

.production-screen-decision-db {
  padding: 7px 8px 8px;
}

.production-screen-decision-scope {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 11px;
}

.production-screen-decision-scope strong {
  color: var(--text);
}

.production-screen-decision-filters {
  display: grid;
  grid-template-columns: 108px 108px minmax(220px, 360px) auto auto;
  gap: 5px 6px;
  align-items: end;
  justify-content: start;
  margin-bottom: 5px;
}

.production-screen-decision-filters label {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.production-screen-decision-filters span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.production-screen-decision-filters select,
.production-screen-decision-filters input {
  width: 100%;
  min-width: 0;
  min-height: 26px;
  padding: 3px 8px;
  border-radius: 7px;
  font-size: 11px;
}

.production-screen-decision-filters > strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fbff;
  color: #334155;
  font-size: 11px;
  white-space: nowrap;
}

.production-screen-decision-filters button {
  min-height: 26px;
  padding: 0 8px;
  font-size: 11px;
  border-radius: 999px;
}

.production-screen-decision-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 11px;
}

.production-screen-decision-pager > div {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.production-screen-decision-pager strong {
  min-width: 58px;
  color: #334155;
  text-align: center;
  white-space: nowrap;
}

.production-screen-decision-pager button {
  min-height: 25px;
  padding: 0 8px;
  font-size: 11px;
  border-radius: 999px;
}

.production-screen-decision-pager button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.production-screen-decision-table-wrap {
  max-height: clamp(260px, calc(100vh - 260px), 520px);
  overflow-x: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.production-screen-decision-table {
  width: 100%;
  min-width: 1100px;
  border-collapse: collapse;
  font-size: 10px;
}

.production-screen-decision-table th,
.production-screen-decision-table td {
  padding: 5px 7px;
  border-bottom: 1px solid #e2edf7;
  color: #475569;
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
}

.production-screen-decision-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f8fbff;
  color: #1f3450;
  font-weight: 900;
}

.production-screen-decision-table td:nth-child(5),
.production-screen-decision-table td:nth-child(10) {
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.production-screen-decision-table strong {
  color: var(--text);
}

.production-screen-decision-table span {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 1px 6px;
  border-radius: 999px;
  background: #eef6ff;
  color: #31547a;
  font-weight: 900;
}

.production-screen-decision-table tr.failed span {
  background: #fff1f2;
  color: #be123c;
}

.production-screen-decision-table tr.non_work_order span {
  background: #ecfeff;
  color: #0f766e;
}

.production-screen-decision-table tr.counted span {
  background: #f0fdf4;
  color: #15803d;
}

.production-screen-decision-table tr.ignored {
  opacity: 0.68;
}

.production-screen-decision-table tr.ignored span {
  background: #f1f5f9;
  color: #64748b;
}

.ha-summary-panel {
  align-self: start;
}

.ha-summary-panel .panel-head button {
  min-height: 30px;
  padding: 0 10px;
}

.ha-summary-score {
  display: grid;
  gap: 8px;
  padding: 16px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(135deg, rgba(226, 248, 238, 0.7), rgba(255, 255, 255, 0.9));
}

.ha-summary-score strong {
  font-size: 34px;
  line-height: 1;
}

.ha-summary-score span {
  color: var(--accent-dark);
  font-size: 13px;
  font-weight: 800;
}

.ha-summary-lines {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
}

.ha-summary-lines div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.ha-summary-lines span {
  color: var(--muted);
  font-size: 12px;
}

.ha-summary-lines strong {
  overflow: hidden;
  color: var(--text);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ha-summary-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 16px 16px;
}

.ha-summary-tags span,
.ha-summary-tags em {
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-soft);
  color: #285a65;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.ha-summary-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.58);
}

.ha-detail-grid,
.ha-ops-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.ha-detail-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ha-ops-grid {
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  align-items: start;
}

.ha-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
}

.ha-check {
  position: relative;
  display: grid;
  gap: 5px;
  min-height: 76px;
  padding: 11px 12px 11px 34px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.78);
  cursor: pointer;
}

.ha-check.selected {
  border-color: rgba(20, 160, 152, 0.42);
  background: linear-gradient(135deg, rgba(226, 248, 238, 0.74), rgba(255, 255, 255, 0.92));
}

.ha-check input {
  position: absolute;
  top: 13px;
  left: 12px;
}

.ha-check span {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
}

.ha-check em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
}

.ha-scope-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
}

.ha-scope-card {
  display: grid;
  gap: 7px;
  min-height: 132px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.74);
}

.ha-scope-card.active {
  border-color: rgba(79, 91, 213, 0.34);
  background: linear-gradient(180deg, rgba(223, 228, 255, 0.48), rgba(255, 255, 255, 0.92));
}

.ha-scope-card span {
  width: 34px;
  padding: 3px 0;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}

.ha-scope-card strong {
  color: var(--text);
  font-size: 14px;
}

.ha-scope-card p {
  margin: 0;
  color: #334155;
  font-size: 12px;
  line-height: 1.55;
}

.ha-scope-card em {
  margin-top: auto;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.45;
}

.ha-api-list {
  display: grid;
  gap: 8px;
  padding: 0 14px 14px;
}

.ha-api-list div {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 8px 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.74);
}

.ha-api-list span {
  display: inline-grid;
  place-items: center;
  min-height: 24px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-size: 11px;
  font-weight: 800;
}

.ha-api-list strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: 12px;
}

.ha-api-list em {
  grid-column: 2;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.ha-timeline {
  display: grid;
  gap: 9px;
  padding: 14px;
}

.ha-timeline div {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 44px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.72);
}

.ha-timeline div.active {
  border-color: rgba(20, 160, 152, 0.38);
  background: var(--aqua-soft);
}

.ha-timeline span {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 24px;
  border-radius: 999px;
  background: #ffffff;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.ha-timeline strong {
  color: var(--text);
  font-size: 13px;
}

.ha-summary-copy {
  padding: 0 14px 14px;
}

.ha-summary-copy pre {
  max-height: 260px;
  overflow: auto;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8fbff;
  color: #334155;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  font-size: 12px;
  line-height: 1.65;
  white-space: pre-wrap;
}

.eyebrow {
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.priority-紧急 {
  background: #fdeeee;
  color: var(--danger);
}

.priority-高 {
  background: #fff4db;
  color: #9a5b00;
}

.priority-历史 {
  background: #eef1f5;
  color: var(--muted);
}

.check-row {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
}

.compact-empty {
  margin: 12px;
}

.split-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.7fr);
  gap: 14px;
  margin-top: 14px;
}

.panel {
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.72) 0%, rgba(255, 255, 255, 0.94) 36%),
    var(--panel-solid);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  overflow: hidden;
  box-shadow: var(--shadow);
}

.panel-head {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 16px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.56);
}

.panel-head h2 {
  margin: 0;
  font-size: 15px;
}

.sidebar-nav-manager {
  display: grid;
  grid-template-columns: minmax(230px, 300px) minmax(0, 1fr);
  gap: 14px;
}

.sidebar-nav-preview-panel,
.sidebar-nav-editor-panel {
  min-width: 0;
}

.sidebar-nav-preview-panel .panel-head span,
.sidebar-nav-savebar span {
  color: var(--muted);
  font-size: 12px;
}

.sidebar-nav-preview {
  height: min(620px, calc(100vh - 260px));
  min-height: 420px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.58), rgba(219, 228, 245, 0.26)),
    #edf4fa;
}

.preview-brand {
  flex-shrink: 0;
}

.preview-nav {
  padding: 8px 10px 12px;
  overflow: auto;
}

.sidebar-nav-editor-list {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.sidebar-nav-edit-group {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  overflow: hidden;
}

.sidebar-nav-edit-group-head {
  min-height: 48px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  padding: 10px;
  border-bottom: 1px solid var(--line);
  background: var(--panel-tint);
}

.sidebar-nav-title-field {
  display: grid;
  gap: 5px;
}

.sidebar-nav-title-field label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.sidebar-nav-move-actions,
.sidebar-nav-module-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

.sidebar-nav-move-actions .icon,
.sidebar-nav-module-row .icon {
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  padding: 0;
}

.sidebar-nav-module-list {
  display: grid;
  gap: 6px;
  padding: 10px;
}

.sidebar-nav-module-row {
  min-height: 34px;
  display: grid;
  grid-template-columns: 34px minmax(150px, 1fr) minmax(140px, 190px) 28px 28px;
  gap: 7px;
}

.sidebar-nav-module-row .mark {
  width: 32px;
  height: 22px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: rgba(148, 163, 184, 0.16);
  color: #64748b;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
}

.sidebar-nav-edit-group input,
.sidebar-nav-edit-group select {
  min-height: 30px;
  width: 100%;
}

.sidebar-nav-empty-group {
  padding: 10px;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.52);
}

.sidebar-nav-savebar {
  position: sticky;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(14px);
}

.status-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
}

.security-grid {
  margin-top: 14px;
}

.security-bars {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.security-bars div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: var(--panel-tint);
}

.security-bars span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
}

.security-bars strong {
  color: var(--text);
}

.security-severity {
  display: inline-flex;
  min-width: 36px;
  justify-content: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef7f6;
  color: var(--accent-dark);
  font-size: 12px;
}

.security-severity.medium {
  background: #fff7e6;
  color: #9a5a12;
}

.security-severity.high,
.security-severity.critical {
  background: #fdeeee;
  color: var(--danger);
}

.status-pill {
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  padding: 12px;
  background: var(--panel-tint);
}

.status-pill span {
  display: block;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.status-pill strong {
  display: block;
  font-size: 22px;
  margin-top: 6px;
}

.table-wrap {
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.72), rgba(255, 255, 255, 0.94) 36%),
    var(--panel-solid);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  overflow: auto;
  box-shadow: var(--shadow);
}

table {
  width: 100%;
  border-collapse: collapse;
  min-width: 980px;
}

th,
td {
  border-bottom: 1px solid var(--line);
  padding: 7px 9px;
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
  line-height: 1.25;
}

th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: rgba(244, 249, 251, 0.96);
  color: #475569;
  font-size: 12px;
  backdrop-filter: blur(12px);
}

td {
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
}

tr:hover td {
  background: #f6fbfd;
}

.skc-parent-row td {
  background: rgba(247, 250, 252, 0.72);
}

.skc-group-table {
  min-width: 760px;
  table-layout: fixed;
}

.skc-group-table th:nth-child(1),
.skc-group-table td:nth-child(1) {
  width: 44px;
}

.skc-group-table th:nth-child(2),
.skc-group-table td:nth-child(2) {
  width: 130px;
}

.skc-group-table th:nth-child(4),
.skc-group-table td:nth-child(4) {
  width: 78px;
}

.skc-group-table th:nth-child(7),
.skc-group-table td:nth-child(7) {
  width: 138px;
}

.skc-group-table th:nth-child(8),
.skc-group-table td:nth-child(8) {
  width: 132px;
}

.skc-child-row > td {
  padding: 0;
  background: #fff;
  max-width: 0;
  overflow: hidden;
}

.nested-sku-scroll {
  max-width: 100%;
  overflow-x: auto;
}

.nested-sku-table {
  min-width: 1120px;
  border-left: 42px solid #f3f7f9;
}

.nested-sku-table th {
  position: static;
}

.compact-empty {
  padding: 14px 18px 14px 60px;
}

.product-workbench-toolbar {
  align-items: center;
  min-height: 30px;
  gap: 6px;
  margin-bottom: 5px;
  flex-wrap: nowrap;
}

.product-entry-tabs {
  min-height: 26px;
  padding: 2px;
}

.product-entry-tabs button {
  min-height: 22px;
  padding: 0 8px;
  font-size: 12px;
  white-space: nowrap;
}

.skc-workbench-table {
  min-width: 1040px;
  table-layout: fixed;
}

.skc-workbench-table th:nth-child(1),
.skc-workbench-table td:nth-child(1) {
  width: 240px;
}

.skc-workbench-table th:nth-child(2),
.skc-workbench-table td:nth-child(2) {
  width: 180px;
}

.skc-workbench-table th:nth-child(3),
.skc-workbench-table td:nth-child(3) {
  width: 92px;
}

.skc-workbench-table th:nth-child(4),
.skc-workbench-table td:nth-child(4) {
  width: 178px;
}

.skc-workbench-table th:nth-child(5),
.skc-workbench-table td:nth-child(5),
.skc-workbench-table th:nth-child(6),
.skc-workbench-table td:nth-child(6) {
  width: 128px;
}

.skc-workbench-table th:nth-child(7),
.skc-workbench-table td:nth-child(7) {
  width: 180px;
}

.skc-workbench-table .skc-child-row > td {
  max-width: none;
  overflow: visible;
}

.skc-title-cell,
.sku-name-cell,
.sku-mini-stack,
.status-stack,
.production-summary {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.skc-title-cell strong,
.sku-name-cell strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.skc-title-cell span,
.sku-name-cell span,
.subtle-code,
.muted-inline,
.sku-mini-stack span,
.production-summary span {
  color: var(--muted);
  font-size: 12px;
}

.platform-chip-list,
.material-color-rail,
.sku-platform-links {
  display: flex;
  align-items: center;
  gap: 3px;
  flex-wrap: wrap;
  min-width: 0;
}

.platform-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  min-height: 19px;
  max-width: 100%;
  padding: 1px 5px;
  border: 1px solid rgba(148, 163, 184, 0.34);
  border-radius: 999px;
  background: #f8fafc;
  color: #334155;
  font-size: 11px;
  line-height: 1.1;
}

.platform-chip strong,
.platform-chip small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platform-chip em {
  font-style: normal;
  color: #0f766e;
  font-weight: 800;
}

.platform-chip.more,
.material-overflow {
  color: #475569;
  background: #eef2ff;
}

.ecommerce-platform-shell {
  display: grid;
  gap: 10px;
  margin-top: 8px;
}

.page-hero-platforms {
  min-height: 58px;
  grid-template-columns: minmax(170px, 0.42fr) minmax(0, 1.58fr);
  gap: 8px;
  padding: 8px 12px;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.page-hero-platforms .page-hero-copy span {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.page-hero-platforms .page-hero-copy h2 {
  margin-top: 2px;
  font-size: 20px;
  line-height: 1.08;
}

.page-hero-platforms .page-hero-kpis {
  grid-template-columns: repeat(4, minmax(90px, 1fr));
  gap: 6px;
}

.page-hero-platforms .page-hero-kpis div {
  padding: 6px 8px;
  border-radius: 7px;
  box-shadow: none;
}

.page-hero-platforms .page-hero-kpis span {
  font-size: 10.5px;
  line-height: 1.1;
}

.page-hero-platforms .page-hero-kpis strong {
  margin-top: 2px;
  font-size: 16px;
  line-height: 1.05;
}

.ecommerce-control-panel {
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.platform-sync-cards {
  display: grid;
  grid-template-columns: repeat(5, minmax(92px, 1fr));
  gap: 6px;
  margin: 0;
}

.platform-sync-cards article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "label value"
    "note value";
  align-items: center;
  column-gap: 8px;
  min-height: 42px;
  padding: 6px 8px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-left: 3px solid #0f766e;
  border-radius: 7px;
  background: #fff;
  box-shadow: none;
}

.platform-sync-cards span,
.platform-sync-cards small {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.08;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platform-sync-cards span {
  grid-area: label;
  font-weight: 800;
}

.platform-sync-cards small {
  grid-area: note;
}

.platform-sync-cards strong {
  grid-area: value;
  color: var(--text);
  font-size: 18px;
  line-height: 1;
}

.model-management-cards {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  margin: 6px 0;
}

.model-management-cards article {
  min-width: 0;
  padding: 5px 8px;
  border: 1px solid #e2e8f0;
  border-left: 3px solid #2563eb;
  border-radius: 8px;
  background: #fff;
}

.model-management-cards article:nth-child(2) {
  border-left-color: #059669;
}

.model-management-cards article:nth-child(3),
.model-management-cards article:nth-child(6) {
  border-left-color: #dc2626;
}

.model-management-cards article:nth-child(4) {
  border-left-color: #d97706;
}

.model-management-cards span,
.model-management-cards small {
  display: block;
  color: #64748b;
  font-size: 11px;
  line-height: 1.08;
  font-weight: 700;
}

.model-management-cards strong {
  display: block;
  margin: 1px 0;
  color: #0f172a;
  font-size: 16px;
  line-height: 1.05;
}

.modal-note {
  margin: 0 0 10px;
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
}

.form-error {
  margin: 0 0 10px;
  padding: 8px 10px;
  border: 1px solid #fecaca;
  border-radius: 8px;
  background: #fef2f2;
  color: #991b1b;
  font-size: 12px;
  font-weight: 800;
}

.model-management-table {
  min-width: 1050px;
  table-layout: fixed;
}

.model-col-identity {
  min-width: 250px;
}

.model-col-file {
  min-width: 230px;
}

.model-col-cost {
  min-width: 170px;
}

.model-col-sku-summary {
  min-width: 190px;
}

.model-col-specs {
  min-width: 160px;
}

.model-col-status {
  min-width: 70px;
}

.model-management-table th,
.model-management-table td {
  padding: 3px 5px;
}

.model-identity-cell,
.model-file-cell,
.model-cost-cell,
.model-production-cell,
.model-product-link-cell,
.model-sku-summary-cell,
.model-spec-cell {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.model-identity-with-preview {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.model-preview-cell,
.model-preview-placeholder {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid #dbe3ee;
  border-radius: 6px;
  background: #f8fafc;
}

.model-preview-cell {
  padding: 0;
  cursor: zoom-in;
}

.model-preview-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.model-preview-placeholder {
  background: linear-gradient(135deg, #e0f2fe 0%, #eef2ff 52%, #f8fafc 100%);
  color: #1e3a8a;
}

.model-preview-placeholder strong {
  font-size: 11px;
  line-height: 1;
}

.model-preview-placeholder span,
.sku-image-placeholder span {
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
}

.model-identity-cell strong,
.model-file-cell strong,
.model-production-cell strong {
  color: #0f172a;
  overflow-wrap: anywhere;
  font-size: 12px;
  line-height: 1.25;
}

.model-identity-cell span,
.model-file-cell span,
.model-cost-cell span,
.model-cost-cell small,
.model-production-cell span,
.model-production-cell small,
.model-product-link-cell span {
  color: #334155;
  font-size: 11px;
}

.model-cost-cell {
  position: relative;
  align-content: center;
  padding-right: 35px;
}

.model-cost-cell strong {
  color: #0f766e;
  font-size: 13px;
  line-height: 1.1;
}

.model-cost-cell.is-manual strong {
  color: #b45309;
}

.model-cost-cell.is-missing strong {
  color: #b91c1c;
  font-size: 11px;
}

.model-cost-cell span,
.model-cost-cell small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-cost-cell small {
  color: #64748b;
  font-size: 10px;
}

.model-cost-cell button {
  position: absolute;
  top: 50%;
  right: 0;
  min-height: 20px;
  padding: 1px 5px;
  border: 1px solid #cbd5e1;
  border-radius: 5px;
  background: #fff;
  color: #1d4ed8;
  font-size: 10px;
  font-weight: 800;
  transform: translateY(-50%);
}

.model-cost-cell button:hover {
  border-color: #93c5fd;
  background: #eff6ff;
}

.model-product-link-cell button {
  justify-self: start;
  padding: 0;
  border: 0;
  background: transparent;
  color: #0f172a;
  font-weight: 800;
  cursor: pointer;
}

.model-product-link-cell button strong {
  color: #2563eb;
}

.model-management-table .model-product-link-cell {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  white-space: nowrap;
}

.model-management-table .model-product-link-cell button {
  flex: 0 0 auto;
  line-height: 1.15;
}

.model-management-table .model-product-link-cell span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-management-table .sku-sheet-actions {
  flex-wrap: nowrap;
  gap: 1px;
}

.model-management-table .sku-sheet-actions .text-icon {
  width: auto;
  min-width: 0;
  min-height: 18px;
  padding: 1px 3px;
  font-size: 10px;
  line-height: 1;
}

.model-chip-list,
.model-color-list,
.model-pack-list,
.model-issue-list {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  min-width: 0;
}

.model-sku-summary-cell,
.model-spec-cell {
  overflow: hidden;
}

.model-spec-cell .model-color-list,
.model-spec-cell .model-pack-list,
.model-sku-summary-cell .model-chip-list {
  min-height: 17px;
}

.model-chip-list span,
.model-chip-list em,
.model-issue-list span {
  display: inline-flex;
  align-items: center;
  min-height: 17px;
  padding: 0 5px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  color: #334155;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
}

.model-analysis-list {
  display: grid;
  gap: 10px;
}

.model-cost-detail-grid,
.model-cost-formula-card {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.model-cost-detail-grid > div,
.model-cost-formula-card > div {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid #dbe3ee;
  border-radius: 8px;
  background: #f8fafc;
}

.model-cost-detail-grid span,
.model-cost-formula-card span {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.model-cost-detail-grid strong,
.model-cost-formula-card strong {
  color: #0f172a;
  font-size: 13px;
}

.model-cost-audit {
  display: grid;
  gap: 3px;
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid #a7f3d0;
  border-left: 4px solid #059669;
  border-radius: 8px;
  background: #ecfdf5;
}

.model-cost-audit.is-manual {
  border-color: #fed7aa;
  border-left-color: #d97706;
  background: #fff7ed;
}

.model-cost-audit strong,
.model-cost-audit span,
.model-cost-audit small {
  color: #334155;
  font-size: 11px;
}

.model-cost-audit strong {
  color: #0f172a;
  font-size: 12px;
}

.model-cost-modal {
  width: min(620px, calc(100vw - 32px));
}

.model-cost-modal .modal-head > div {
  min-width: 0;
}

.model-cost-modal .modal-head p {
  margin: 3px 0 0;
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-cost-formula-card {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 10px;
}

.model-cost-form-grid {
  grid-template-columns: minmax(160px, 0.45fr) minmax(0, 1fr);
}

.model-cost-form-grid textarea {
  min-height: 76px;
  resize: vertical;
}

@media (max-width: 760px) {
  .model-management-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .model-cost-detail-grid,
  .model-cost-formula-card,
  .model-cost-form-grid {
    grid-template-columns: 1fr;
  }

  .model-cost-modal {
    width: calc(100vw - 20px);
  }
}

.model-analysis-block {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 1px solid #dbeafe;
  border-left: 4px solid #2563eb;
  border-radius: 8px;
  background: #f8fbff;
}

.model-analysis-block > strong {
  color: #0f172a;
  font-size: 13px;
}

.model-analysis-block > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.model-analysis-block span,
.model-analysis-block article {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid #dbeafe;
  border-radius: 999px;
  background: #fff;
  color: #1e3a8a;
  font-size: 12px;
  font-weight: 700;
}

.model-analysis-conflict {
  border-color: #fed7aa;
  border-left-color: #f97316;
  background: #fff7ed;
}

.model-analysis-conflict article {
  display: grid;
  justify-items: start;
  border-color: #fed7aa;
  border-radius: 8px;
  color: #9a3412;
}

.model-analysis-conflict article em {
  color: #c2410c;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.model-color-list span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 19px;
  padding: 1px 6px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #fff;
  color: #334155;
  font-size: 11px;
  font-weight: 700;
}

.model-color-list em {
  color: #64748b;
  font-style: normal;
  font-weight: 800;
}

.model-management-row.status-missing_model td:first-child {
  box-shadow: inset 4px 0 0 #dc2626;
}

.model-management-row.status-model_field_conflict td:first-child {
  box-shadow: inset 4px 0 0 #f59e0b;
}

.model-sku-matrix {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
}

.model-sku-matrix article {
  display: grid;
  gap: 3px;
  padding: 9px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.model-sku-matrix strong {
  overflow-wrap: anywhere;
}

.model-sku-matrix span,
.model-sku-matrix em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
}

.model-drawer-actions,
.skc-model-upload {
  margin-top: 10px;
}

.ecommerce-platform-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 8px;
  min-height: 36px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.ecommerce-platform-toolbar .toolbar-left {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 58px;
  gap: 6px;
  min-width: 0;
}

.ecommerce-platform-toolbar .toolbar-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: nowrap;
  min-width: max-content;
}

.ecommerce-platform-toolbar .search {
  min-height: 32px;
  height: 32px;
}

.ecommerce-platform-toolbar button,
.ecommerce-platform-toolbar select {
  min-height: 32px;
  height: 32px;
  padding: 0 9px;
  border-radius: 7px;
  white-space: nowrap;
}

.ecommerce-platform-toolbar select {
  width: auto;
  max-width: 132px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--text);
}

.platform-config-strip {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 0;
  background: transparent;
}

.platform-config-head,
.platform-config-list,
.platform-config-list article {
  display: flex;
  align-items: center;
  gap: 8px;
}

.platform-config-head {
  min-width: 118px;
  justify-content: flex-start;
}

.platform-config-head span {
  color: var(--muted);
  font-size: 12px;
  margin-right: 0;
}

.platform-config-head button {
  display: none;
}

.platform-config-list {
  flex-wrap: nowrap;
  min-width: 0;
  overflow-x: auto;
  padding: 6px 1px;
  scrollbar-width: thin;
}

.platform-config-list article {
  flex: 0 0 206px;
  max-width: 206px;
  min-height: 38px;
  padding: 5px 7px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 7px;
  background: #fff;
}

.platform-config-list article > div {
  display: grid;
  gap: 2px;
  min-width: 0;
  flex: 1;
}

.platform-config-list strong,
.platform-config-list span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platform-config-list span {
  color: var(--muted);
  font-size: 11px;
}

.ecommerce-platform-table-wrap {
  margin-top: 0;
  border-radius: 0 0 8px 8px;
}

.ecommerce-table-panel {
  display: grid;
  min-width: 0;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  overflow: hidden;
}

.ecommerce-table-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 36px;
  padding: 6px 9px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.28);
  background: linear-gradient(90deg, rgba(240, 249, 255, 0.88), rgba(248, 250, 252, 0.92));
}

.ecommerce-table-head div {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}

.ecommerce-table-head strong {
  color: #0f172a;
  font-size: 13px;
}

.ecommerce-table-head span,
.ecommerce-table-head em {
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ecommerce-platform-table-wrap.sku-sheet-wrap {
  max-height: calc(100vh - 270px);
  border: 0;
  box-shadow: none;
}

.sku-sheet-table.ecommerce-platform-table {
  width: max-content;
  min-width: max-content;
}

.ecommerce-platform-table th,
.ecommerce-platform-table td {
  height: 54px;
  padding: 2px 4px;
}

.ecommerce-platform-table .sku-sheet-group-row th {
  height: 18px;
  padding: 1px 4px;
}

.ecommerce-platform-table .sku-sheet-column-row th {
  top: 18px;
  height: 28px;
}

.ecommerce-platform-table th:nth-child(1),
.ecommerce-platform-table td:nth-child(1) {
  width: 50px;
  min-width: 50px;
  max-width: 50px;
  text-align: center;
}

.ecommerce-platform-table th:nth-child(2),
.ecommerce-platform-table td:nth-child(2) {
  left: 50px;
  width: clamp(172px, 9vw, 182px);
  min-width: 172px;
  max-width: 182px;
}

.ecommerce-platform-table .name-col {
  width: clamp(88px, 6vw, 108px);
  min-width: 88px;
  max-width: 108px;
}

.ecommerce-platform-table .status-col {
  width: clamp(66px, 4.5vw, 82px);
  min-width: 66px;
  max-width: 82px;
}

.ecommerce-platform-table .owner-col {
  width: clamp(56px, 4vw, 68px);
  min-width: 56px;
  max-width: 68px;
}

.ecommerce-platform-table .color-col {
  width: clamp(112px, 7vw, 132px);
  min-width: 112px;
  max-width: 132px;
}

.ecommerce-platform-table .number-col {
  width: clamp(48px, 3.5vw, 60px);
  min-width: 48px;
  max-width: 60px;
}

.ecommerce-platform-table .title-col {
  width: clamp(138px, 10vw, 176px);
  min-width: 138px;
  max-width: 176px;
}

.ecommerce-platform-table .platform-col {
  width: clamp(118px, 8vw, 142px);
  min-width: 118px;
  max-width: 142px;
}

.ecommerce-platform-table .route-col,
.ecommerce-platform-table .warehouse-col {
  width: clamp(94px, 6vw, 114px);
  min-width: 94px;
  max-width: 114px;
}

.ecommerce-platform-table .note-col,
.ecommerce-platform-table .actions-col {
  width: clamp(78px, 5vw, 96px);
  min-width: 78px;
  max-width: 96px;
}

.sku-sheet-table.ecommerce-platform-table th:nth-child(1),
.sku-sheet-table.ecommerce-platform-table td:nth-child(1),
.sku-sheet-table.ecommerce-platform-table .image-col {
  width: 50px;
  min-width: 50px;
  max-width: 50px;
  text-align: center;
}

.sku-sheet-table.ecommerce-platform-table th:nth-child(2),
.sku-sheet-table.ecommerce-platform-table td:nth-child(2),
.sku-sheet-table.ecommerce-platform-table .sku-main-col {
  left: 50px;
  width: 182px;
  min-width: 182px;
  max-width: 182px;
}

.sku-sheet-table.ecommerce-platform-table .name-col {
  width: 88px;
  min-width: 88px;
  max-width: 88px;
}

.sku-sheet-table.ecommerce-platform-table .status-col {
  width: 66px;
  min-width: 66px;
  max-width: 66px;
}

.sku-sheet-table.ecommerce-platform-table .owner-col {
  width: 56px;
  min-width: 56px;
  max-width: 56px;
}

.sku-sheet-table.ecommerce-platform-table .color-col {
  width: 112px;
  min-width: 112px;
  max-width: 112px;
}

.sku-sheet-table.ecommerce-platform-table .number-col {
  width: 48px;
  min-width: 48px;
  max-width: 48px;
}

.sku-sheet-table.ecommerce-platform-table .title-col {
  width: 138px;
  min-width: 138px;
  max-width: 138px;
}

.sku-sheet-table.ecommerce-platform-table .platform-col {
  width: 118px;
  min-width: 118px;
  max-width: 118px;
}

.sku-sheet-table.ecommerce-platform-table .route-col,
.sku-sheet-table.ecommerce-platform-table .warehouse-col {
  width: 94px;
  min-width: 94px;
  max-width: 94px;
}

.sku-sheet-table.ecommerce-platform-table .stock-request-col {
  width: 74px;
  min-width: 74px;
  max-width: 74px;
}

.sku-sheet-table.ecommerce-platform-table .stock-delivery-col {
  width: 102px;
  min-width: 102px;
  max-width: 102px;
}

.sku-sheet-table.ecommerce-platform-table .sku-todo-col {
  width: 150px;
  min-width: 150px;
  max-width: 150px;
}

.sku-sheet-table.ecommerce-platform-table .workflow-col {
  width: 132px;
  min-width: 132px;
  max-width: 132px;
}

.sku-sheet-table.ecommerce-platform-table th.workflow-col,
.sku-sheet-table.ecommerce-platform-table td.workflow-col {
  position: sticky;
  right: 0;
  z-index: 6;
  background: linear-gradient(90deg, rgba(248, 250, 252, 0.96), #ffffff 34%);
  box-shadow: -8px 0 14px rgba(15, 23, 42, 0.08), -1px 0 0 rgba(148, 163, 184, 0.32);
}

.sku-sheet-table.ecommerce-platform-table th.workflow-col {
  z-index: 10;
  background: linear-gradient(90deg, #eef6ff, #ffffff);
}

.ecommerce-platform-table .sku-sheet-group-row th:last-child {
  position: sticky;
  right: 0;
  z-index: 11;
  background: linear-gradient(90deg, #e0f2fe, #f8fafc);
  box-shadow: -8px 0 14px rgba(15, 23, 42, 0.08);
}

.platform-product-image,
.platform-product-empty-image {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  border: 1px solid rgba(148, 163, 184, 0.32);
  background: #f8fafc;
  overflow: hidden;
}

.platform-product-image {
  display: inline-flex;
  padding: 0;
  cursor: zoom-in;
}

.platform-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.platform-product-empty-image {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.platform-product-sku,
.platform-product-title,
.platform-product-platform,
.platform-product-link {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.platform-product-sku {
  align-content: center;
  justify-content: center;
  width: 100%;
}

.platform-product-sku strong,
.platform-product-title strong,
.platform-product-platform strong,
.platform-product-link strong {
  overflow: hidden;
  color: var(--text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platform-product-sku span,
.platform-product-sku small,
.platform-product-title span,
.platform-product-platform span,
.platform-product-platform small,
.platform-product-link span,
.platform-product-link small {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.platform-product-detail-link {
  display: block;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.platform-product-detail-link strong {
  display: block;
}

.platform-product-detail-link:hover strong,
.platform-product-detail-link:focus-visible strong {
  color: #2563eb;
  text-decoration: underline;
}

.sku-workflow-cell {
  display: grid;
  align-content: center;
  gap: 4px;
  min-width: 0;
}

.sku-workflow-status-line {
  display: flex;
  align-items: center;
  gap: 3px;
  min-width: 0;
}

.sku-workflow-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 62px;
  min-height: 18px;
  padding: 1px 5px;
  border: 1px solid rgba(148, 163, 184, 0.36);
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

button.sku-workflow-pill {
  cursor: pointer;
}

button.sku-workflow-pill:disabled {
  cursor: default;
  opacity: 1;
}

.sku-workflow-pill.has-task {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #c2410c;
}

.sku-workflow-pill.has-stock {
  border-color: #bbf7d0;
  background: #ecfdf5;
  color: #047857;
}

.sku-workflow-pill.is-empty {
  background: #f8fafc;
  color: #94a3b8;
}

.sku-stock-panel-btn {
  width: 100%;
  min-height: 24px;
  padding: 2px 6px;
  border-color: #86efac;
  border-radius: 8px;
  background: linear-gradient(180deg, #dcfce7, #bbf7d0);
  color: #065f46;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.1;
}

.sku-stock-delivery-select {
  width: 94px;
  min-width: 0;
  height: 28px;
  padding: 2px 20px 2px 8px;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 999px;
  background-color: rgba(248, 250, 252, 0.94);
  color: #0f172a;
  font-size: 11px;
  font-weight: 800;
}

.sku-todo-input {
  width: 92px;
  min-width: 0;
  height: 28px;
  padding: 3px 7px;
  border: 1px solid rgba(148, 163, 184, 0.38);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
  color: #0f172a;
  font-size: 11px;
}

.sku-todo-input::placeholder {
  color: #94a3b8;
}

.ecommerce-stock-modal {
  width: min(680px, calc(100vw - 28px));
}

.ecommerce-stock-modal .modal-head > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.ecommerce-stock-modal .modal-head span {
  overflow: hidden;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ecommerce-stock-body {
  display: grid;
  gap: 12px;
}

.ecommerce-stock-summary {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(240, 249, 255, 0.86), rgba(255, 255, 255, 0.92));
}

.ecommerce-stock-summary > div {
  min-width: 0;
}

.ecommerce-stock-summary strong,
.ecommerce-stock-summary span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ecommerce-stock-summary strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.ecommerce-stock-summary span {
  color: #64748b;
  font-size: 12px;
}

.ecommerce-stock-summary em {
  padding: 5px 8px;
  border-radius: 999px;
  background: #ecfdf5;
  color: #047857;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}

.ecommerce-stock-fields {
  display: grid;
  grid-template-columns: minmax(120px, 0.6fr) minmax(170px, 0.9fr);
  gap: 10px;
}

.ecommerce-stock-fields label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #334155;
  font-size: 12px;
  font-weight: 900;
}

.ecommerce-stock-fields input,
.ecommerce-stock-fields select,
.ecommerce-stock-fields textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  font: inherit;
  font-weight: 700;
}

.ecommerce-stock-fields input,
.ecommerce-stock-fields select {
  height: 34px;
  padding: 5px 9px;
}

.ecommerce-stock-fields textarea {
  resize: vertical;
  min-height: 92px;
  padding: 8px 9px;
}

.ecommerce-stock-note-field {
  grid-column: 1 / -1;
}

.ecommerce-stock-hint {
  padding: 8px 10px;
  border-left: 3px solid #0ea5e9;
  border-radius: 6px;
  background: #f0f9ff;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.platform-product-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.platform-product-pager div {
  display: flex;
  gap: 8px;
}

.temu-product-bitable {
  display: grid;
  min-height: calc(100vh - 104px);
  border: 1px solid #dfe5eb;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}

.temu-product-bitable-titlebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 72px;
  padding: 12px 18px;
  border-bottom: 1px solid #e5e9ef;
  background: #fff;
}

.temu-product-bitable-titlebar h1 {
  margin: 2px 0 0;
  color: #1f2937;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0;
}

.temu-product-bitable-titlebar span {
  color: #7b8794;
  font-size: 12px;
}

.temu-product-bitable-stats {
  display: grid;
  grid-template-columns: repeat(3, auto auto);
  gap: 4px 8px;
  align-items: baseline;
  color: #7b8794;
  font-size: 12px;
}

.temu-product-bitable-stats strong {
  color: #1f2937;
  font-size: 14px;
  font-weight: 800;
}

.temu-product-view-tabs {
  display: flex;
  align-items: end;
  gap: 4px;
  height: 42px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 16px;
  border-bottom: 1px solid #e5e9ef;
  background: #f7f8fa;
}

.temu-product-view-tabs button {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 34px;
  min-width: 0;
  padding: 0 12px;
  border: 0;
  border-radius: 7px 7px 0 0;
  background: transparent;
  color: #5b6472;
  font-size: 13px;
  font-weight: 700;
}

.temu-product-view-tabs button.active {
  background: #fff;
  color: #2563eb;
  box-shadow: inset 0 -2px 0 #2563eb;
}

.temu-product-view-tabs button span {
  color: inherit;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-view-tabs button small {
  display: block;
  max-width: 148px;
  overflow: hidden;
  color: #8b96a5;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-tab-add {
  width: 34px;
  justify-content: center;
  color: #8b96a5;
}

.temu-product-bitable-toolbar {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 52px;
  padding: 8px 12px;
  border-bottom: 1px solid #e5e9ef;
  background: #fff;
}

.temu-product-bitable-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex-wrap: wrap;
}

.temu-product-bitable-actions button,
.temu-product-column-picker summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  height: 30px;
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #4b5563;
  font-size: 12px;
  font-weight: 700;
}

.temu-product-bitable-actions button:hover,
.temu-product-column-picker summary:hover {
  border-color: #d8e0e8;
  background: #f5f7fa;
}

.temu-product-bitable-actions button.primary,
.temu-product-bitable-actions button.active {
  border-color: rgba(37, 99, 235, 0.18);
  background: #eff6ff;
  color: #2563eb;
}

.temu-product-bitable-actions .temu-product-ai-add-field-btn {
  border-color: rgba(37, 99, 235, 0.28);
  background: #2563eb;
  color: #fff;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.18);
}

.temu-product-bitable-actions .temu-product-ai-add-field-btn:hover {
  border-color: #1d4ed8;
  background: #1d4ed8;
}

.temu-product-bitable-actions button em {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #e8f0ff;
  color: #2563eb;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}

.temu-product-toolbar-notice {
  max-width: 360px;
  overflow: hidden;
  padding: 6px 9px;
  border-radius: 6px;
  background: #f8fafc;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-toolbar-popover {
  position: absolute;
  top: calc(100% + 6px);
  left: 12px;
  z-index: 12;
  width: min(620px, calc(100vw - 280px));
  padding: 12px;
  border: 1px solid #d8e0e8;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.16);
}

.temu-product-toolbar-popover.narrow {
  width: 320px;
}

.temu-product-toolbar-popover header,
.temu-product-toolbar-popover footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.temu-product-toolbar-popover header {
  margin-bottom: 10px;
}

.temu-product-toolbar-popover header strong {
  color: #1f2937;
  font-size: 14px;
}

.temu-product-toolbar-popover p {
  margin: 8px 0 0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.5;
}

.temu-product-toolbar-filter-grid {
  display: grid;
  grid-template-columns: minmax(150px, 1.3fr) repeat(3, minmax(106px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.temu-product-toolbar-popover input,
.temu-product-toolbar-popover select {
  height: 32px;
  min-height: 32px;
  border-radius: 6px;
  font-size: 12px;
}

.temu-product-toolbar-choice-row,
.temu-product-row-height-options,
.temu-product-color-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.temu-product-row-height-options button.active {
  border-color: rgba(37, 99, 235, 0.26);
  background: #eff6ff;
  color: #2563eb;
}

.temu-product-selection-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 6px 12px;
  border-bottom: 1px solid #dbeafe;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 700;
}

.temu-product-selection-bar strong {
  margin-right: 4px;
}

.temu-product-selection-bar button {
  height: 26px;
  min-height: 26px;
  padding: 0 9px;
  border-color: rgba(37, 99, 235, 0.18);
  border-radius: 6px;
  background: #fff;
  color: #1d4ed8;
  font-size: 12px;
}

.temu-product-grid-shell {
  min-width: 0;
  min-height: 420px;
}

.temu-product-sheet-only {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: calc(100vh - 72px);
  border: 1px solid #dfe5eb;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.temu-product-table-wrap {
  width: 100%;
  max-height: calc(100vh - 116px);
  overflow: auto;
  background: #fff;
}

.temu-product-table {
  width: 100%;
  min-width: 3180px;
  border-collapse: separate;
  border-spacing: 0;
}

.temu-product-table th,
.temu-product-table td {
  border-right: 1px solid #e5e9ef;
  border-bottom: 1px solid #e5e9ef;
  padding: 7px 10px;
  text-align: left;
  vertical-align: middle;
}

.temu-product-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 38px;
  background: #f7f8fa;
  color: #4b5563;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.temu-product-table tbody tr {
  min-height: 96px;
  background: #fff;
}

.temu-product-table tbody tr:hover {
  background: #f7fbff;
}

.temu-product-table tbody tr.selected,
.temu-product-table tbody tr.selected .temu-product-check-col,
.temu-product-table tbody tr.selected .temu-product-row-number-col {
  background: #eff6ff;
}

.temu-product-check-col,
.temu-product-row-number-col {
  position: sticky;
  left: 0;
  z-index: 3;
  width: 42px;
  min-width: 42px;
  max-width: 42px;
  background: #fff;
  text-align: center !important;
}

.temu-product-row-number-col {
  left: 42px;
  z-index: 3;
  color: #8b96a5;
  font-size: 12px;
}

.temu-product-table.no-selection .temu-product-row-number-col {
  left: 0;
}

th.temu-product-check-col,
th.temu-product-row-number-col {
  z-index: 4;
  background: #f7f8fa;
}

.temu-product-check-col input {
  width: 15px;
  height: 15px;
  accent-color: #2563eb;
}

.temu-product-field-header {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.temu-product-field-header span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 22px;
  height: 18px;
  border-radius: 4px;
  background: #edf2f7;
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
}

.temu-product-field-header strong {
  min-width: 0;
  overflow: hidden;
  color: #374151;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-field-header button {
  margin-left: auto;
  width: 22px;
  height: 22px;
  min-height: 22px;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: #9aa4b2;
  font-size: 14px;
}

.temu-product-field-header button:hover {
  background: #e9eef5;
  color: #4b5563;
}

.temu-product-field-menu-popover {
  position: fixed;
  z-index: 1000;
  display: grid;
  gap: 4px;
  width: 250px;
  max-height: min(76vh, 620px);
  overflow: auto;
  padding: 8px;
  border: 1px solid #d8e0e8;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.16);
}

.temu-product-field-menu-title {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 8px 8px;
  border-bottom: 1px solid #eef2f7;
}

.temu-product-field-menu-title span {
  display: inline-grid;
  place-items: center;
  min-width: 24px;
  height: 20px;
  border-radius: 5px;
  background: #edf2f7;
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
}

.temu-product-field-menu-title strong {
  color: #1f2937;
  font-size: 13px;
}

.temu-product-field-menu-popover button {
  justify-content: flex-start;
  width: 100%;
  height: 30px;
  min-height: 30px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #374151;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
}

.temu-product-field-menu-popover button:hover {
  background: #f3f6f9;
}

.temu-product-field-menu-popover button:disabled {
  cursor: not-allowed;
  color: #9aa4b2;
  background: transparent;
}

.temu-product-table td[data-column="media"] {
  width: 260px;
  min-width: 260px;
}

.temu-product-table td[data-column="product"] {
  width: 390px;
  min-width: 390px;
}

.temu-product-table td[data-column="category_attrs"] {
  width: 320px;
  min-width: 320px;
}

.temu-product-table td[data-column="commercial"] {
  width: 220px;
  min-width: 220px;
}

.temu-product-table td[data-column="sku_summary"] {
  width: 420px;
  min-width: 420px;
}

.temu-product-table td[data-column="store"],
.temu-product-table td[data-column="fulfillment"] {
  width: 260px;
  min-width: 260px;
}

.temu-product-table td[data-column="reviews"] {
  width: 360px;
  min-width: 360px;
}

.temu-product-table td[data-column="assets"] {
  width: 310px;
  min-width: 310px;
}

.temu-product-table td[data-column="seo_ai"] {
  width: 380px;
  min-width: 380px;
}

.temu-product-table td[data-column="title"] {
  width: 300px;
  min-width: 300px;
  max-width: 300px;
}

.temu-product-table td[data-column="goods_id"],
.temu-product-table td[data-column="price"],
.temu-product-table td[data-column="sales"],
.temu-product-table td[data-column="review"],
.temu-product-table td[data-column="review_sample_score"],
.temu-product-table td[data-column="review_sample_date"],
.temu-product-table td[data-column="sku1_id"],
.temu-product-table td[data-column="sku1_price"],
.temu-product-table td[data-column="sku1_stock"],
.temu-product-table td[data-column="sku2_id"],
.temu-product-table td[data-column="sku2_price"],
.temu-product-table td[data-column="sku2_stock"],
.temu-product-table td[data-column="sku3_id"],
.temu-product-table td[data-column="sku3_price"],
.temu-product-table td[data-column="sku3_stock"],
.temu-product-table td[data-column="mall"],
.temu-product-table td[data-column="seo"],
.temu-product-table td[data-column="collected_at"] {
  width: 150px;
  min-width: 150px;
}

.temu-product-table td[data-column="category"] {
  width: 260px;
  min-width: 260px;
}

.temu-product-table td[data-column="material"],
.temu-product-table td[data-column="power_mode"],
.temu-product-table td[data-column="age_group"],
.temu-product-table td[data-column="origin"],
.temu-product-table td[data-column="sku_prices"],
.temu-product-table td[data-column="sku_stock"],
.temu-product-table td[data-column="shop_sold"],
.temu-product-table td[data-column="shop_score"],
.temu-product-table td[data-column="seller_type"],
.temu-product-table td[data-column="image_count"],
.temu-product-table td[data-column="video_url"] {
  width: 150px;
  min-width: 150px;
}

.temu-product-table td[data-column="sku_summary"],
.temu-product-table td[data-column="shipping_title"],
.temu-product-table td[data-column="return_policy"],
.temu-product-table td[data-column="image_specs"],
.temu-product-table td[data-column="review_sample_sku"],
.temu-product-table td[data-column="sku1_style"],
.temu-product-table td[data-column="sku1_spec"],
.temu-product-table td[data-column="sku2_style"],
.temu-product-table td[data-column="sku2_spec"],
.temu-product-table td[data-column="sku3_style"],
.temu-product-table td[data-column="sku3_spec"] {
  width: 220px;
  min-width: 220px;
}

.temu-product-table td[data-column="sku_styles"],
.temu-product-table td[data-column="review_sample_text"],
.temu-product-table td[data-column="review2_text"],
.temu-product-table td[data-column="review3_text"],
.temu-product-table td[data-column="seo_title"],
.temu-product-table td[data-column="seo_description"],
.temu-product-table td[data-column="seo_keywords"] {
  width: 320px;
  min-width: 320px;
}

.temu-product-table td[data-column="ai_outputs"] {
  width: 280px;
  min-width: 280px;
}

.temu-product-table td[data-column="sku_images"],
.temu-product-table td[data-column="sku1_image"],
.temu-product-table td[data-column="sku2_image"],
.temu-product-table td[data-column="sku3_image"],
.temu-product-table td[data-column="review_sample_images"] {
  width: 220px;
  min-width: 220px;
}

.temu-product-table td[data-column="media_gallery"] {
  width: 300px;
  min-width: 300px;
}

.temu-product-table td[data-column="source_url"] {
  width: 140px;
  min-width: 140px;
  max-width: 140px;
}

.temu-product-table td[data-column="media"] {
  width: 260px;
  min-width: 260px;
}

.temu-product-table td[data-column="product"] {
  width: 390px;
  min-width: 390px;
}

.temu-product-table td[data-column="category_attrs"] {
  width: 320px;
  min-width: 320px;
}

.temu-product-table td[data-column="commercial"] {
  width: 220px;
  min-width: 220px;
}

.temu-product-table td[data-column="sku_summary"] {
  width: 420px;
  min-width: 420px;
}

.temu-product-table td[data-column="store"],
.temu-product-table td[data-column="fulfillment"] {
  width: 260px;
  min-width: 260px;
}

.temu-product-table td[data-column="reviews"] {
  width: 360px;
  min-width: 360px;
}

.temu-product-table td[data-column="assets"] {
  width: 310px;
  min-width: 310px;
}

.temu-product-table td[data-column="seo_ai"] {
  width: 380px;
  min-width: 380px;
}

.temu-product-cell {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.temu-product-info-cell {
  display: grid;
  gap: 6px;
  min-width: 0;
  align-content: start;
}

.temu-product-main-cell {
  gap: 7px;
}

.temu-product-platform-cell {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.temu-product-platform-cell strong {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  padding: 2px 7px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  color: #0f172a;
  background: #f8fafc;
  font-size: 12px;
  line-height: 1.3;
}

.temu-product-platform-cell small {
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-title-text {
  display: -webkit-box;
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.38;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.temu-product-title-text .temu-product-editable {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: 13px;
  line-height: 1.38;
  white-space: normal;
}

.temu-product-link-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.temu-product-link-actions span,
.temu-product-sub-meta span {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-sub-meta {
  display: flex;
  gap: 8px;
  min-width: 0;
}

.temu-product-info-line {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: baseline;
  gap: 6px;
  min-width: 0;
}

.temu-product-info-line em,
.temu-product-metric-grid em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.temu-product-info-line strong {
  overflow: hidden;
  color: var(--ink);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

.temu-product-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  min-height: 22px;
  padding: 2px 7px;
  border: 1px solid #d8e5f0;
  border-radius: 999px;
  background: #f6f9fc;
  color: #334155;
  font-size: 11px;
  font-weight: 800;
}

.temu-product-pill em {
  color: #64748b;
  font-style: normal;
  font-weight: 700;
}

.temu-product-pill strong {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-pill.good {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

.temu-product-pill.warn {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #9a3412;
}

.temu-product-metric-cell {
  display: grid;
  gap: 6px;
}

.temu-product-metric-cell > strong {
  font-size: 14px;
}

.temu-product-metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
}

.temu-product-metric-grid span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 5px 6px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #f8fafc;
}

.temu-product-metric-grid b {
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-sku-variants {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  min-width: 0;
  padding-bottom: 2px;
}

.temu-product-sku-variants span {
  display: grid;
  grid-template-columns: 34px minmax(72px, 1fr);
  grid-template-rows: auto auto;
  column-gap: 6px;
  flex: 0 0 124px;
  min-width: 0;
  padding: 5px;
  border: 1px solid #d8e5f0;
  border-radius: 7px;
  background: #fbfdff;
}

.temu-product-sku-variants img {
  grid-row: 1 / span 2;
  width: 34px;
  height: 34px;
  border: 1px solid #d8e0e8;
  border-radius: 5px;
  object-fit: cover;
}

.temu-product-sku-variants b,
.temu-product-sku-variants em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-sku-variants b {
  color: var(--ink);
  font-size: 11px;
}

.temu-product-sku-variants em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
}

.temu-product-review-summary p,
.temu-product-info-cell p {
  margin: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-review-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.temu-product-review-head strong {
  color: #1d4ed8;
  font-size: 14px;
}

.temu-product-review-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.temu-product-cell strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.35;
}

.temu-product-cell small {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-source-link:hover {
  color: var(--accent);
  text-decoration: underline;
}

.temu-product-editable {
  min-width: 0;
  width: 100%;
  overflow: hidden;
  padding: 4px 6px;
  border: 1px solid transparent;
  border-radius: 5px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

td[data-column="title"] .temu-product-editable {
  font-size: 13px;
  font-weight: 800;
  padding-right: 10px;
}

.temu-product-editable:hover {
  border-color: #d8e0e8;
  background: #f8fbff;
}

.temu-product-editable:focus {
  overflow: auto;
  border-color: #2563eb;
  outline: 0;
  background: #fff;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
  text-overflow: clip;
}

.temu-product-editable.saving {
  border-color: #f59e0b;
  background: #fffbeb;
}

.temu-product-editable.saved {
  border-color: #22c55e;
  background: #f0fdf4;
}

.temu-product-editable.error {
  border-color: #ef4444;
  background: #fff1f2;
}

.temu-product-inline-score {
  display: flex;
  align-items: center;
  gap: 4px;
}

.temu-product-inline-score .temu-product-editable {
  width: 54px;
  flex: 0 0 54px;
}

.temu-product-inline-thumbs {
  display: flex;
  gap: 5px;
  align-items: center;
  overflow-x: auto;
  max-width: 100%;
  min-width: 0;
  padding-bottom: 2px;
}

.temu-product-inline-thumbs img {
  width: 36px;
  height: 36px;
  object-fit: cover;
  border: 1px solid #d8e0e8;
  border-radius: 6px;
  background: #eef3f8;
}

.temu-product-inline-thumbs em {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #eef6ff;
  color: #1d4ed8;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.temu-product-source-link {
  display: block;
  overflow: hidden;
  max-width: 240px;
  color: #2563eb;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-link-cell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid #bfdbfe;
  border-radius: 6px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.temu-product-link-cell:hover {
  border-color: #93c5fd;
  background: #dbeafe;
}

.temu-product-table-media {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.temu-product-media-strip {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  overflow-y: hidden;
  max-width: 100%;
  padding: 1px 0 4px;
  scrollbar-width: thin;
}

.temu-product-media-strip a {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
}

.temu-product-media-more {
  display: inline-grid;
  place-items: center;
  flex: 0 0 34px;
  width: 34px;
  height: 48px;
  border: 1px solid #d8e0e8;
  border-radius: 6px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.temu-product-table-media img,
.temu-product-table-media video {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #eef3f8;
}

.temu-product-table-media small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.temu-product-no-media {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  min-height: 28px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.temu-product-column-picker {
  position: relative;
}

.temu-product-column-picker summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0 9px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  list-style: none;
  white-space: nowrap;
}

.temu-product-column-picker summary::-webkit-details-marker {
  display: none;
}

.temu-product-column-picker[open] summary {
  border-color: rgba(37, 99, 235, 0.36);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.temu-product-column-picker > div {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 4;
  width: 190px;
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
}

.temu-product-column-picker > div > p {
  margin: 0 0 4px;
  padding: 7px 8px;
  border-radius: 6px;
  background: #f8fafc;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
}

.temu-product-column-picker label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  padding: 4px 6px;
  border-radius: 6px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.temu-product-column-picker label:hover {
  background: #f4f8fb;
}

.temu-product-column-picker input {
  width: 15px;
  height: 15px;
  accent-color: var(--accent);
}

.temu-product-sheet-hint {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.temu-product-sheet-only {
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  min-height: calc(100vh - 56px);
}

.temu-product-grid-shell {
  min-height: 0;
}

.temu-product-table-wrap {
  max-height: calc(100vh - 188px);
}

.temu-product-table {
  width: max-content;
  min-width: 100%;
  table-layout: fixed;
}

.temu-product-table th,
.temu-product-table td {
  height: 42px;
  padding: 5px 8px;
}

.temu-product-row-height-low .temu-product-table th,
.temu-product-row-height-low .temu-product-table td {
  height: 34px;
  padding-top: 3px;
  padding-bottom: 3px;
}

.temu-product-row-height-high .temu-product-table th,
.temu-product-row-height-high .temu-product-table td {
  height: 58px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.temu-product-row-height-extra .temu-product-table th,
.temu-product-row-height-extra .temu-product-table td {
  height: 76px;
  padding-top: 10px;
  padding-bottom: 10px;
}

.temu-product-table td {
  position: relative;
}

.temu-product-table .temu-product-check-col,
.temu-product-table .temu-product-row-number-col {
  position: sticky;
  z-index: 6;
  background: #fff;
}

.temu-product-table .temu-product-check-col {
  left: 0;
  width: 42px;
  min-width: 42px;
  max-width: 42px;
}

.temu-product-table .temu-product-row-number-col {
  left: 42px;
  width: 46px;
  min-width: 46px;
  max-width: 46px;
}

.temu-product-table.no-selection .temu-product-row-number-col {
  left: 0;
}

.temu-product-table th.temu-product-check-col,
.temu-product-table th.temu-product-row-number-col {
  z-index: 8;
  background: #f7f8fa;
}

.temu-product-table td[rowspan] {
  vertical-align: top;
}

.temu-product-table tbody tr {
  min-height: 42px;
}

.temu-product-row-number-col {
  width: 46px;
  min-width: 46px;
  max-width: 46px;
}

.temu-product-table th[data-field],
.temu-product-table td[data-column] {
  box-sizing: border-box;
}

.temu-product-table th[data-field="media"],
.temu-product-table td[data-column="media"] {
  position: sticky;
  left: 88px;
  z-index: 3;
  background: #fff;
}

.temu-product-table th[data-field="media"] {
  z-index: 5;
}

.temu-product-table th[data-field="title"],
.temu-product-table td[data-column="title"] {
  position: sticky;
  left: 88px;
  z-index: 3;
  background: #fff;
  box-shadow: 1px 0 0 #dbe2ea;
}

.temu-product-table th[data-field="title"] {
  z-index: 5;
}

.temu-product-table tbody tr:hover td[data-column="media"],
.temu-product-table tbody tr:hover td[data-column="title"] {
  background: #f7fbff;
}

.temu-product-table tbody tr.selected td[data-column="media"],
.temu-product-table tbody tr.selected td[data-column="title"] {
  background: #eff6ff;
}

.temu-product-group-base .temu-product-field-header span,
.temu-product-table th.temu-product-group-base {
  border-top: 3px solid #60a5fa;
}

.temu-product-group-collector .temu-product-field-header span,
.temu-product-table th.temu-product-group-collector {
  border-top: 3px solid #f59e0b;
}

.temu-product-group-category .temu-product-field-header span,
.temu-product-table th.temu-product-group-category {
  border-top: 3px solid #34d399;
}

.temu-product-group-commercial .temu-product-field-header span,
.temu-product-table th.temu-product-group-commercial {
  border-top: 3px solid #f59e0b;
}

.temu-product-group-sku .temu-product-field-header span,
.temu-product-table th.temu-product-group-sku {
  border-top: 3px solid #8b5cf6;
}

.temu-product-group-store .temu-product-field-header span,
.temu-product-table th.temu-product-group-store {
  border-top: 3px solid #14b8a6;
}

.temu-product-group-review .temu-product-field-header span,
.temu-product-table th.temu-product-group-review {
  border-top: 3px solid #f43f5e;
}

.temu-product-group-asset .temu-product-field-header span,
.temu-product-table th.temu-product-group-asset {
  border-top: 3px solid #06b6d4;
}

.temu-product-group-seo_ai .temu-product-field-header span,
.temu-product-table th.temu-product-group-seo_ai {
  border-top: 3px solid #6366f1;
}

.temu-product-table td.temu-product-group-category {
  background: #fbfffd;
}

.temu-product-table td.temu-product-group-commercial {
  background: #fffdf8;
}

.temu-product-table td.temu-product-group-sku {
  background: #fdfcff;
}

.temu-product-table td.temu-product-group-review {
  background: #fffafb;
}

.temu-product-table td.temu-product-group-asset {
  background: #f8feff;
}

.temu-product-table td.temu-product-group-seo_ai {
  background: #fbfbff;
}

.temu-product-table td.temu-product-group-collector {
  background: #fffdf8;
}

.temu-product-table tbody tr.temu-product-collector-caution .temu-product-row-number-col {
  box-shadow: inset 3px 0 0 #f59e0b;
}

.temu-product-field-header {
  position: relative;
  height: 24px;
  padding-right: 22px;
}

.temu-product-field-header span {
  height: 17px;
  min-width: 24px;
  background: #f1f5f9;
}

.temu-product-field-header button {
  opacity: 0;
}

.temu-product-table th:hover .temu-product-field-header button {
  opacity: 1;
}

.temu-product-col-resize {
  position: absolute;
  top: -7px;
  right: -8px;
  width: 8px;
  height: 38px;
  cursor: col-resize;
}

.temu-product-col-resize:hover {
  background: rgba(37, 99, 235, 0.16);
}

.temu-product-cell-selected {
  outline: 2px solid #2563eb;
  outline-offset: -2px;
  background: #eff6ff !important;
}

.temu-product-cell-selected::after {
  content: "";
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 6px;
  height: 6px;
  border: 1px solid #fff;
  background: #2563eb;
}

.temu-product-peer-cursor {
  box-shadow: inset 0 0 0 2px #7c3aed;
}

.temu-product-peer-label {
  position: absolute;
  top: -19px;
  left: 4px;
  z-index: 6;
  max-width: 90px;
  overflow: hidden;
  padding: 2px 6px;
  border-radius: 5px;
  background: #7c3aed;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-source-cell {
  display: grid;
  gap: 3px;
  align-content: center;
}

.temu-product-source-cell span {
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-source-cell .temu-product-editable {
  max-width: 100%;
  padding: 1px 3px;
  color: #64748b;
  font-size: 10px;
  font-weight: 700;
}

.temu-product-source-cell .temu-product-editable:focus {
  min-width: 360px;
}

.temu-product-table-media {
  gap: 2px;
}

.temu-product-media-strip {
  gap: 3px;
  padding: 0;
}

.temu-product-table-media img,
.temu-product-table-media video {
  width: 34px;
  height: 34px;
  border-radius: 4px;
}

.temu-product-media-more {
  flex-basis: 28px;
  width: 28px;
  height: 34px;
  border-radius: 4px;
  font-size: 10px;
}

.temu-product-table-media small {
  font-size: 10px;
}

.temu-product-cell {
  gap: 2px;
}

.temu-product-cell strong,
.temu-product-editable {
  font-size: 12px;
}

.temu-product-editable {
  min-height: 24px;
  padding: 2px 5px;
}

.temu-product-editable:focus {
  position: relative;
  z-index: 7;
  min-width: 220px;
  white-space: normal;
}

.temu-product-inline-thumbs img {
  width: 30px;
  height: 30px;
  border-radius: 4px;
}

.temu-product-column-picker > div {
  width: 390px;
  max-height: 520px;
  overflow: auto;
  grid-template-columns: 1fr;
}

.temu-product-column-picker > div > header {
  position: sticky;
  top: -8px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 6px;
  border-bottom: 1px solid #edf2f7;
  background: #fff;
}

.temu-product-column-picker > div > header strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.temu-product-column-picker > div > header span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-field-config-search {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px;
  border: 1px solid #edf2f7;
  border-radius: 6px;
  background: #f8fafc;
}

.temu-product-field-config-search span {
  color: #64748b;
  font-size: 12px;
  font-weight: 850;
}

.temu-product-field-config-search input {
  min-width: 0;
  flex: 1;
  border: 0;
  background: transparent;
  color: #0f172a;
  font-size: 13px;
  outline: none;
}

.temu-product-column-picker section {
  display: grid;
  gap: 4px;
  align-content: start;
  padding: 6px;
  border: 1px solid #edf2f7;
  border-radius: 6px;
}

.temu-product-column-picker section > strong {
  color: #334155;
  font-size: 12px;
}

.temu-product-field-config-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 30px 30px;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 5px 4px;
  border-radius: 6px;
}

.temu-product-field-config-row:hover {
  background: #f8fafc;
}

.temu-product-field-config-row.is-hidden {
  opacity: 0.56;
}

.temu-product-field-config-type {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 22px;
  border-radius: 6px;
  background: #eef4ff;
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
}

.temu-product-field-config-row b,
.temu-product-field-config-row small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-field-config-row b {
  color: #0f172a;
  font-size: 12px;
  font-weight: 850;
}

.temu-product-field-config-row small {
  color: #94a3b8;
  font-size: 10px;
  font-weight: 700;
}

.temu-product-field-config-eye,
.temu-product-field-config-more,
.temu-product-field-config-add {
  min-height: 28px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-field-config-eye:hover,
.temu-product-field-config-more:hover,
.temu-product-field-config-add:hover {
  border-color: #d8e0e8;
  background: #f1f5f9;
}

.temu-product-field-config-eye:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.temu-product-field-config-add {
  width: 100%;
  justify-content: flex-start;
  margin-top: 4px;
  color: #2563eb;
}

.temu-product-field-drawer {
  border-bottom: 1px solid #e5e9ef;
  background: #fbfcfe;
}

.temu-product-field-drawer > summary {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  padding: 0 14px;
  color: #4b5563;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  list-style: none;
}

.temu-product-field-drawer > summary::-webkit-details-marker {
  display: none;
}

.temu-product-field-drawer > summary::before {
  content: "+";
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 5px;
  background: #eef2f7;
  color: #64748b;
}

.temu-product-field-drawer[open] > summary::before {
  content: "-";
}

.temu-product-field-drawer > summary strong {
  color: #7b8794;
  font-size: 12px;
  font-weight: 700;
}

.temu-product-field-drawer > summary button {
  margin-left: auto;
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid #d6e1ec;
  border-radius: 6px;
  background: #fff;
  color: #39506b;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-field-center {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.8fr);
  gap: 12px;
  padding: 0 12px 12px;
}

.temu-product-field-paths,
.temu-product-ai-shortcuts {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: var(--shadow-soft);
}

.temu-product-field-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
}

.temu-product-field-head h2 {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
}

.temu-product-field-head span,
.temu-product-field-head em {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.temu-product-path-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
  max-height: 230px;
  overflow: auto;
  padding: 10px;
}

.temu-product-path-groups details {
  min-width: 0;
  border: 1px solid rgba(183, 202, 217, 0.72);
  border-radius: 8px;
  background: #f8fbfc;
}

.temu-product-path-groups summary {
  cursor: pointer;
  padding: 8px 10px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}

.temu-product-path-groups summary span {
  color: var(--muted);
  font-weight: 700;
}

.temu-product-path-groups details > div {
  display: grid;
  gap: 5px;
  padding: 0 8px 8px;
}

.temu-product-path-groups button {
  display: grid;
  gap: 2px;
  min-width: 0;
  min-height: 42px;
  padding: 6px 8px;
  border: 1px solid rgba(183, 202, 217, 0.72);
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  text-align: left;
}

.temu-product-path-groups button.copied {
  border-color: #22c55e;
  box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.16);
}

.temu-product-path-groups button strong,
.temu-product-path-groups button code {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-path-groups button strong {
  font-size: 12px;
}

.temu-product-path-groups button code,
.temu-product-ai-card code,
.temu-product-ai-output-grid code {
  width: fit-content;
  max-width: 100%;
  overflow: hidden;
  padding: 2px 6px;
  border-radius: 999px;
  background: #eef6ff;
  color: #255b8f;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-shortcuts {
  display: grid;
  align-content: start;
}

.temu-product-ai-select {
  display: grid;
  gap: 5px;
  padding: 10px 12px 0;
}

.temu-product-ai-select span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-card {
  display: grid;
  gap: 8px;
  margin: 10px 12px 12px;
  padding: 10px;
  border: 1px solid rgba(183, 202, 217, 0.72);
  border-radius: 8px;
  background: #f8fbfc;
}

.temu-product-ai-card strong {
  color: var(--ink);
  font-size: 14px;
}

.temu-product-ai-card p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.temu-product-ai-card > div,
.temu-product-ai-output-grid article > div:last-child {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

.temu-product-ai-run-result {
  margin: 0 12px 12px;
  padding: 7px 9px;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-shortcut-panel {
  border-bottom: 1px solid #dbe5ee;
  background: #fbfcfe;
}

.temu-product-ai-field-drawer {
  position: fixed;
  top: 96px;
  left: clamp(360px, 47vw, 760px);
  z-index: 120;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  width: min(520px, calc(100vw - 32px));
  max-height: calc(100vh - 126px);
  overflow: hidden;
  border: 1px solid #dbe5ee;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.18);
}

.temu-product-ai-shortcut-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid #e5e9ef;
}

.temu-product-ai-shortcut-panel > header span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-shortcut-panel > header h2 {
  margin: 2px 0 0;
  color: #0f172a;
  font-size: 16px;
}

.temu-product-ai-shortcut-grid {
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr);
  gap: 12px;
  padding: 12px;
}

.temu-product-ai-drawer-body {
  display: grid;
  gap: 12px;
  min-height: 0;
  overflow: auto;
  padding: 12px;
}

.temu-product-ai-field-drawer .temu-product-ai-shortcut-form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.temu-product-ai-form-row {
  display: grid;
  grid-template-columns: 1fr 160px;
  gap: 10px;
}

.temu-product-ai-title-field input,
.temu-product-ai-field-type-card input,
.temu-product-ai-field-type-card select {
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  background: #fff;
  color: #0f172a;
  font-weight: 800;
}

.temu-product-ai-field-type-card {
  display: grid;
  gap: 6px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.temu-product-ai-field-type-card > strong {
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-ai-type-row {
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) minmax(170px, 0.8fr);
  align-items: center;
  gap: 8px !important;
  min-height: 42px;
  padding: 7px 8px;
  border: 1px solid #dbe5ee;
  border-radius: 7px;
  background: #f8fafc;
}

.temu-product-ai-model-row {
  border-color: #c7d7ff;
  background: #eef4ff;
}

.temu-product-ai-type-icon {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 24px;
  border-radius: 6px;
  background: #e9f1ff;
  color: #315ec9;
  font-size: 11px;
  font-weight: 900;
}

.temu-product-ai-type-row b,
.temu-product-ai-type-row small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-type-row b {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

.temu-product-ai-type-row small {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.temu-product-ai-row-action {
  justify-self: end;
  min-height: 30px;
  padding: 0 12px;
  border-color: #c7d7ff;
  border-radius: 7px;
  background: #fff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-ai-row-action:hover {
  background: #eff6ff;
}

.temu-product-ai-prompt-card {
  display: grid;
  gap: 8px;
  grid-column: 1 / -1;
  padding: 10px;
  border-radius: 8px;
  background: #f5f6f8;
}

.temu-product-ai-prompt-card > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-ai-prompt-card button {
  min-height: 28px;
  border-color: transparent;
  background: transparent;
  color: #2563eb;
  font-weight: 900;
}

.temu-product-ai-prompt-card textarea {
  min-height: 190px;
  padding: 12px;
  border: 1px solid #cfd8e3;
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  font-size: 14px;
  line-height: 1.7;
}

.temu-product-ai-image-config {
  display: grid;
  gap: 10px;
  padding: 10px;
  border-radius: 8px;
  background: #f5f6f8;
}

.temu-product-ai-image-config h3 {
  margin: 0;
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-ai-config-line {
  display: grid;
  gap: 6px;
}

.temu-product-ai-config-line > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-ai-config-line button {
  min-height: 26px;
  padding: 0;
  border-color: transparent;
  background: transparent;
  color: #2563eb;
  font-weight: 900;
}

.temu-product-ai-seedream-config {
  border: 1px solid #e1e7ef;
  background: #f8fafc;
}

.temu-product-ai-inline-radio {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

.temu-product-ai-reference-value {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 42px;
  padding: 8px;
  border: 1px solid #dbe5ee;
  border-radius: 7px;
  background: #fff;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-config-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.temu-product-ai-config-grid label {
  display: grid;
  gap: 5px;
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-ai-config-grid input,
.temu-product-ai-config-grid select {
  min-height: 32px;
  padding: 0 8px;
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  background: #fff;
  color: #0f172a;
  font-weight: 800;
}

.temu-product-ai-config-section {
  display: grid;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #e1e7ef;
  border-radius: 8px;
  background: #fff;
}

.temu-product-ai-config-section summary {
  cursor: pointer;
  color: #334155;
  font-size: 12px;
  font-weight: 900;
  list-style: none;
}

.temu-product-ai-config-section summary::-webkit-details-marker {
  display: none;
}

.temu-product-ai-config-section > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.temu-product-ai-reference-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.temu-product-ai-reference-control > div {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 6px;
}

.temu-product-ai-reference-control button {
  min-height: 28px;
  padding: 0 9px;
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-ai-config-section label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-right: 12px;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-config-section select {
  min-height: 32px;
  width: 100%;
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  background: #fff;
  color: #0f172a;
  font-weight: 800;
}

.temu-product-ai-config-chip {
  display: inline-flex;
  align-items: center;
  max-width: 190px;
  min-height: 24px;
  padding: 0 8px;
  overflow: hidden;
  border-radius: 6px;
  background: #eef4ff;
  color: #315ec9;
  font-size: 12px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-shortcut-picker,
.temu-product-ai-provider-panel {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #d8e2ec;
  border-radius: 8px;
  background: #fff;
}

.temu-product-ai-shortcut-picker summary {
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  list-style: none;
}

.temu-product-ai-shortcut-picker summary::-webkit-details-marker {
  display: none;
}

.temu-product-ai-shortcut-picker summary strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

.temu-product-ai-shortcut-picker summary span {
  overflow: hidden;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-section-title,
.temu-product-ai-provider-panel > header,
.temu-product-ai-reference-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.temu-product-ai-section-title div {
  display: grid;
  gap: 2px;
}

.temu-product-ai-section-title strong,
.temu-product-ai-provider-panel > header strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.temu-product-ai-section-title span,
.temu-product-ai-provider-panel > header span,
.temu-product-ai-reference-toolbar span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.temu-product-ai-section-title em {
  max-width: 190px;
  overflow: hidden;
  color: #315ec9;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-shortcut-list {
  display: grid;
  gap: 10px;
  max-height: 280px;
  overflow: auto;
}

.temu-product-ai-shortcut-list .temu-product-ai-shortcut-group > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.temu-product-ai-shortcut-list [data-temu-product-ai-preset] {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 2px 8px;
  min-height: 58px;
  padding: 8px;
  border: 1px solid #d8e2ec;
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  text-align: left;
}

.temu-product-ai-shortcut-list [data-temu-product-ai-preset].active,
.temu-product-ai-shortcut-list [data-temu-product-ai-preset]:hover {
  border-color: #8bb7ff;
  background: #f2f7ff;
}

.temu-product-ai-shortcut-list [data-temu-product-ai-preset] span {
  grid-row: span 2;
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 24px;
  border-radius: 6px;
  background: #eaf2ff;
  color: #315ec9;
  font-size: 11px;
  font-weight: 900;
}

.temu-product-ai-shortcut-list [data-temu-product-ai-preset] b,
.temu-product-ai-shortcut-list [data-temu-product-ai-preset] em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-shortcut-list [data-temu-product-ai-preset] em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
}

.temu-product-ai-shortcut-grid aside {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
}

.temu-product-ai-shortcut-grid aside > strong {
  color: #334155;
  font-size: 12px;
}

.temu-product-ai-shortcut-search {
  display: grid;
  gap: 4px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-shortcut-search input {
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #d8e2ec;
  border-radius: 8px;
  background: #fff;
}

.temu-product-ai-path-center-link {
  border-color: #e5e7eb !important;
  background: #f3f4f6 !important;
}

.temu-product-ai-shortcut-group {
  display: grid;
  gap: 6px;
}

.temu-product-ai-shortcut-group h3 {
  margin: 8px 0 2px;
  color: #6b7280;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-shortcut-grid aside button {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 2px 8px;
  min-height: 54px;
  padding: 8px;
  border: 1px solid #d8e2ec;
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  text-align: left;
}

.temu-product-ai-shortcut-grid aside button[hidden],
.temu-product-ai-shortcut-group[hidden] {
  display: none;
}

.temu-product-ai-shortcut-grid aside button.active,
.temu-product-ai-shortcut-grid aside button:hover {
  border-color: #8bb7ff;
  background: #f2f7ff;
}

.temu-product-ai-shortcut-grid aside button span {
  grid-row: span 2;
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 22px;
  border-radius: 6px;
  background: #eaf2ff;
  color: #315ec9;
  font-size: 11px;
  font-weight: 900;
}

.temu-product-ai-shortcut-grid aside button b,
.temu-product-ai-shortcut-grid aside button em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-shortcut-grid aside button em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
}

.temu-product-ai-shortcut-form {
  display: grid;
  grid-template-columns: minmax(220px, 0.7fr) minmax(180px, 0.35fr);
  gap: 10px;
  min-width: 0;
}

.temu-product-ai-shortcut-form label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-shortcut-form label.wide,
.temu-product-ai-reference-box,
.temu-product-ai-selected-shortcut,
.temu-product-ai-run-options,
.temu-product-ai-shortcut-form footer {
  grid-column: 1 / -1;
}

.temu-product-ai-existing-fields {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid #e0e7ff;
  border-radius: 8px;
  background: #fbfbff;
}

.temu-product-ai-existing-fields > div:last-child {
  display: grid;
  gap: 6px;
}

.temu-product-ai-existing-fields article {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid #e5e9ef;
  border-radius: 7px;
  background: #fff;
}

.temu-product-ai-existing-fields article.active {
  border-color: #93c5fd;
  background: #eff6ff;
}

.temu-product-ai-existing-fields article > span {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 24px;
  border-radius: 6px;
  background: #eef2ff;
  color: #4f46e5;
  font-size: 11px;
  font-weight: 900;
}

.temu-product-ai-existing-fields strong,
.temu-product-ai-existing-fields small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-existing-fields strong {
  color: #111827;
  font-size: 13px;
  font-weight: 900;
}

.temu-product-ai-existing-fields small {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.temu-product-ai-existing-fields button {
  height: 28px;
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid #d8e0e8;
  border-radius: 6px;
  background: #fff;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-existing-fields button:hover {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

.temu-product-ai-shortcut-form textarea {
  min-height: 74px;
  resize: vertical;
}

.temu-product-ai-selected-shortcut {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) minmax(96px, max-content) max-content;
  gap: 8px;
  align-items: center;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid #d8e2ec;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
}

.temu-product-ai-selected-shortcut span,
.temu-product-ai-selected-shortcut small {
  color: #64748b;
  font-weight: 800;
}

.temu-product-ai-selected-shortcut button {
  min-height: 30px;
  padding: 0 10px;
  border-color: #8bb7ff;
  color: #1d4ed8;
  font-weight: 900;
}

.temu-product-ai-selected-shortcut strong {
  color: #0f172a;
}

.temu-product-ai-selected-shortcut em {
  overflow: hidden;
  color: #0f172a;
  font-style: normal;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-default-card {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #e5e9ef;
  border-radius: 8px;
  background: #f8fafc;
}

.temu-product-ai-default-card > strong {
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-ai-suggestion-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.temu-product-ai-suggestion-row button {
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid #d8e2ec;
  border-radius: 8px;
  background: #fff;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-suggestion-row button.active,
.temu-product-ai-suggestion-row button:hover:not(:disabled) {
  border-color: #8bb7ff;
  background: #eef4ff;
  color: #1d4ed8;
}

.temu-product-ai-shortcut-empty {
  padding: 12px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-shortcut-flyout {
  position: absolute;
  top: 62px;
  left: calc(100% + 10px);
  z-index: 2;
  display: grid;
  gap: 10px;
  width: clamp(280px, calc(100vw - 620px), 360px);
  max-height: calc(100vh - 160px);
  overflow: auto;
  padding: 12px;
  border: 1px solid #d8e2ec;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16);
}

.temu-product-ai-shortcut-flyout header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.temu-product-ai-shortcut-flyout header strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.temu-product-ai-shortcut-flyout header button {
  min-height: 28px;
  padding: 0 9px;
  border-color: #d8e2ec;
  border-radius: 7px;
  background: #fff;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-run-options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid #d8e2ec;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-run-options label {
  display: inline-flex;
  grid-template-columns: none;
  align-items: center;
  gap: 5px;
  margin: 0;
}

.temu-product-ai-run-options input[type="number"] {
  width: 96px;
  min-height: 30px;
}

.temu-product-ai-auto-update {
  margin-left: auto !important;
}

.temu-product-ai-reference-box {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #d8e2ec;
  border-radius: 8px;
  background: #fff;
}

.temu-product-ai-reference-box[hidden] {
  display: none;
}

.temu-product-ai-reference-box > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #64748b;
  font-size: 12px;
}

.temu-product-ai-reference-groups {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  max-height: 230px;
  overflow: auto;
}

.temu-product-ai-reference-groups details {
  border: 1px solid #e5e9ef;
  border-radius: 8px;
  background: #fbfcfe;
}

.temu-product-ai-reference-groups summary {
  cursor: pointer;
  padding: 7px 9px;
  color: #334155;
  font-size: 12px;
  font-weight: 900;
}

.temu-product-ai-reference-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 5px 8px;
  border-top: 1px solid #eef2f7;
}

.temu-product-ai-reference-row.active {
  background: #eef4ff;
}

.temu-product-ai-reference-row > button:first-child {
  display: grid;
  gap: 2px;
  min-width: 0;
  min-height: 34px;
  padding: 4px 6px;
  border: 0;
  background: transparent;
  color: #0f172a;
  text-align: left;
}

.temu-product-ai-reference-row > button:first-child span,
.temu-product-ai-reference-row > button:first-child small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-reference-row > button:first-child span {
  font-size: 13px;
  font-weight: 900;
}

.temu-product-ai-reference-row > button:first-child small {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.temu-product-ai-copy-path {
  min-height: 24px;
  padding: 0 7px;
  border-radius: 6px;
  font-size: 11px;
}

.temu-product-ai-copy-path.copied::after {
  content: "已复制";
  margin-left: 4px;
  color: #1d4ed8;
}

.temu-product-ai-shortcut-form footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  position: sticky;
  bottom: -12px;
  padding: 10px 0 0;
  background: #fff;
  border-top: 1px solid #eef2f7;
}

.temu-product-ai-shortcut-form footer > div {
  display: inline-flex;
  gap: 8px;
}

.temu-product-ai-provider-panel {
  background: #f8fafc;
}

.temu-product-ai-provider-panel label {
  display: grid;
  gap: 5px;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-ai-provider-panel input {
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #d8e2ec;
  border-radius: 8px;
  background: #fff;
}

.temu-product-ai-field-cell {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.temu-product-ai-field-cell > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.temu-product-ai-field-cell strong,
.temu-product-ai-field-cell span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-field-cell strong {
  color: #0f172a;
  font-size: 12px;
}

.temu-product-ai-field-cell.failed strong {
  color: #b91c1c;
}

.temu-product-ai-field-cell span {
  color: #64748b;
  font-size: 11px;
}

.temu-product-ai-field-cell.failed span {
  color: #ef4444;
}

.temu-product-ai-field-cell button {
  flex: 0 0 auto;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 6px;
  font-size: 11px;
}

.temu-product-ai-field-cell.object-field {
  align-items: flex-start;
}

.temu-product-ai-object-result {
  max-width: 280px;
  margin-top: 3px;
  color: #334155;
  font-size: 11px;
}

.temu-product-ai-object-result summary {
  cursor: pointer;
  color: #2563eb;
  font-weight: 900;
}

.temu-product-ai-object-result section {
  margin-top: 5px;
  padding: 6px;
  border: 1px solid #dbe5ee;
  border-radius: 6px;
  background: #f8fafc;
}

.temu-product-ai-object-result b,
.temu-product-ai-object-result p {
  display: block;
  overflow: visible;
  margin: 0;
  white-space: normal;
}

.temu-product-ai-object-result p {
  margin-top: 3px;
  line-height: 1.45;
}

.temu-product-bitable-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  padding: 7px 12px;
  border-top: 1px solid #e5e9ef;
  background: #fff;
  color: #7b8794;
  font-size: 12px;
  font-weight: 700;
}

.temu-product-bitable-footer div {
  display: flex;
  gap: 6px;
}

.temu-product-bitable-footer button {
  height: 28px;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 6px;
  font-size: 12px;
}

.temu-product-ai-cell {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.temu-product-ai-cell strong,
.temu-product-ai-cell span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-ai-cell strong {
  color: var(--ink);
  font-size: 12px;
}

.temu-product-ai-cell span {
  color: var(--muted);
  font-size: 12px;
}

.temu-product-table th[data-field="main_image"],
.temu-product-table td[data-column="main_image"] {
  position: sticky;
  left: 88px;
  z-index: 3;
  background: #fff;
}

.temu-product-table th[data-field="video"],
.temu-product-table td[data-column="video"] {
  position: sticky;
  left: 174px;
  z-index: 3;
  background: #fff;
}

.temu-product-table th[data-field="title"],
.temu-product-table td[data-column="title"] {
  left: 260px;
}

.temu-product-table th[data-field="main_image"],
.temu-product-table th[data-field="video"],
.temu-product-table th[data-field="title"] {
  z-index: 5;
}

.temu-product-table tbody tr:hover td[data-column="main_image"],
.temu-product-table tbody tr:hover td[data-column="video"],
.temu-product-table tbody tr:hover td[data-column="title"] {
  background: #f7fbff;
}

.temu-product-table tbody tr.selected td[data-column="main_image"],
.temu-product-table tbody tr.selected td[data-column="video"],
.temu-product-table tbody tr.selected td[data-column="title"] {
  background: #eff6ff;
}

.temu-product-table th[data-field="video"],
.temu-product-table td[data-column="video"],
.temu-product-table th[data-field="title"],
.temu-product-table td[data-column="title"] {
  position: relative;
  left: auto;
  z-index: auto;
  box-shadow: none;
}

.temu-product-single-media {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 46px;
  height: 46px;
  padding: 0;
  overflow: hidden;
  border: 1px solid #d8e0e8;
  border-radius: 6px;
  background: #f4f8fb;
  cursor: zoom-in;
}

.temu-product-single-media img,
.temu-product-single-media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.temu-product-single-media small {
  position: absolute;
  right: 2px;
  bottom: 2px;
  max-width: 42px;
  padding: 1px 3px;
  overflow: hidden;
  border-radius: 3px;
  background: rgba(15, 23, 42, 0.68);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-sku-image-cell,
.temu-product-sku-empty-image {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  padding: 0;
  overflow: hidden;
  border: 1px solid #d8e0e8;
  border-radius: 6px;
  background: #f4f8fb;
  color: #7b8794;
  cursor: zoom-in;
  font-size: 11px;
  font-weight: 800;
}

.temu-product-sku-image-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.temu-product-video-thumb span {
  position: absolute;
  right: 3px;
  bottom: 3px;
  padding: 1px 4px;
  border-radius: 4px;
  background: rgba(15, 23, 42, 0.78);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
}

.temu-product-detail-btn {
  width: 100%;
  min-height: 26px;
  padding: 0 8px;
  border: 1px solid #bfdbfe;
  border-radius: 6px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-detail-btn:hover {
  background: #dbeafe;
}

.temu-product-sku-detail-list {
  display: grid;
  gap: 4px;
  max-height: 150px;
  overflow: auto;
  padding-right: 2px;
}

.temu-product-sku-detail-row {
  display: grid;
  grid-template-columns: 34px minmax(92px, 1fr) 62px 92px;
  align-items: center;
  gap: 6px;
  min-height: 38px;
  padding: 3px 4px;
  border: 1px solid #e1eaf2;
  border-radius: 6px;
  background: #fbfdff;
}

.temu-product-sku-detail-row a,
.temu-product-sku-detail-row .temu-product-sku-empty-image {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  overflow: hidden;
  border: 1px solid #d8e0e8;
  border-radius: 5px;
  background: #f4f8fb;
  color: #7b8794;
  font-size: 10px;
  font-weight: 800;
}

.temu-product-sku-detail-row img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.temu-product-sku-detail-row strong,
.temu-product-sku-detail-row small,
.temu-product-sku-detail-row em,
.temu-product-sku-detail-row b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-sku-detail-row strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
}

.temu-product-sku-detail-row small {
  display: block;
  color: #6b7b91;
  font-size: 11px;
  font-weight: 700;
}

.temu-product-sku-detail-row em,
.temu-product-sku-detail-row b {
  color: #475569;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.temu-product-seo-prompt-cell .temu-product-editable {
  min-height: 40px;
  white-space: normal;
}

.temu-product-seo-review-bundle-cell {
  display: grid;
  gap: 6px;
  align-content: start;
}

.temu-product-seo-review-bundle-cell .temu-product-seo-prompt-cell .temu-product-editable {
  min-height: 34px;
  max-height: 62px;
  overflow: auto;
  padding: 6px 8px;
  border: 1px solid #e0e7ff;
  border-radius: 6px;
  background: #fbfbff;
}

.temu-product-bundle-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.temu-product-bundle-meta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.temu-product-bundle-meta small {
  display: block;
  overflow: hidden;
  color: #60708a;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-collector-cell {
  display: grid;
  gap: 4px;
  align-content: center;
  min-width: 0;
}

.temu-product-collector-cell small {
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-collector-cell .temu-product-collector-warning {
  color: #9a5a12;
}

.temu-product-collector-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 22px;
  padding: 0 7px;
  overflow: hidden;
  border: 1px solid #d8e0e8;
  border-radius: 6px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-collector-badge.good {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #15803d;
}

.temu-product-collector-badge.warn {
  border-color: #fde68a;
  background: #fffbeb;
  color: #9a5a12;
}

.temu-product-collector-badge.danger {
  border-color: #fecdd3;
  background: #fff1f2;
  color: #b73d3d;
}

.temu-product-collector-badge.muted {
  border-color: #e2e8f0;
  background: #f8fafc;
  color: #64748b;
}

.temu-product-missing-field-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-content: flex-start;
}

.temu-product-missing-field-cell span,
.temu-product-missing-field-cell em {
  max-width: 100%;
  padding: 2px 6px;
  overflow: hidden;
  border: 1px solid #fde68a;
  border-radius: 6px;
  background: #fffbeb;
  color: #9a5a12;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-detail-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 950;
  display: flex;
  justify-content: flex-end;
  background: rgba(15, 23, 42, 0.24);
}

.temu-product-detail-drawer {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  width: min(760px, calc(100vw - 42px));
  height: 100%;
  border-left: 1px solid #d8e0e8;
  background: #fff;
  box-shadow: -18px 0 36px rgba(15, 23, 42, 0.16);
}

.temu-product-detail-drawer header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 64px;
  padding: 12px 16px;
  border-bottom: 1px solid #e5e9ef;
}

.temu-product-detail-drawer h2 {
  margin: 0;
  color: var(--ink);
  font-size: 18px;
}

.temu-product-detail-drawer header span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.temu-product-detail-drawer header button {
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #d8e0e8;
  border-radius: 6px;
  background: #fff;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.temu-product-detail-drawer-body {
  display: grid;
  align-content: start;
  gap: 12px;
  min-height: 0;
  overflow: auto;
  padding: 14px;
}

.temu-product-detail-drawer-body section,
.temu-product-detail-drawer-body .temu-product-raw {
  border: 1px solid #d8e0e8;
  border-radius: 8px;
  background: #fff;
}

.temu-product-detail-drawer-body h3 {
  margin: 0;
  padding: 10px 12px;
  border-bottom: 1px solid #e5e9ef;
  font-size: 14px;
}

.temu-product-collector-alert {
  margin: 10px 12px 0;
  padding: 8px 10px;
  border: 1px solid #fde68a;
  border-radius: 6px;
  background: #fffbeb;
  color: #9a5a12;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
}

.temu-product-drawer-kv {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 0;
  padding: 6px 0;
}

.temu-product-drawer-kv > div {
  display: contents;
}

.temu-product-drawer-kv span,
.temu-product-drawer-kv strong {
  min-width: 0;
  padding: 7px 12px;
  border-bottom: 1px solid #eef2f7;
  font-size: 12px;
}

.temu-product-drawer-kv span {
  color: #64748b;
  font-weight: 800;
}

.temu-product-drawer-kv strong {
  overflow-wrap: anywhere;
  color: var(--ink);
  font-weight: 700;
}

.temu-product-list {
  display: grid;
  gap: 0;
}

.temu-product-row {
  display: grid;
  grid-template-columns: 78px minmax(260px, 1.8fr) minmax(120px, 0.55fr) minmax(140px, 0.7fr) minmax(140px, 0.7fr);
  gap: 14px;
  align-items: center;
  min-height: 92px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.78);
}

.temu-product-row:last-child {
  border-bottom: 0;
}

.temu-product-cover {
  width: 64px;
  height: 64px;
  overflow: hidden;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f4f8fb;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.temu-product-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.temu-product-main,
.temu-product-metrics,
.temu-product-status {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.temu-product-main button {
  overflow: hidden;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.35;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-main button:hover {
  color: var(--accent);
  text-decoration: underline;
}

.temu-product-main span,
.temu-product-main small,
.temu-product-metrics span,
.temu-product-status span {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-metrics strong,
.temu-product-status strong {
  color: var(--ink);
  font-size: 15px;
}

.temu-product-status .tag {
  width: fit-content;
}

.temu-product-detail-modal {
  width: min(1120px, calc(100vw - 28px));
}

.temu-product-detail-modal .modal-head span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.temu-product-detail-body {
  display: grid;
  gap: 14px;
}

.temu-product-detail-body section,
.temu-product-raw {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.temu-product-detail-body h3 {
  margin: 0;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
}

.temu-product-overview,
.temu-product-detail-summary {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 14px;
  padding: 12px;
}

.temu-product-detail-kv,
.temu-product-detail-summary > div:last-child {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 8px 10px;
  align-content: start;
}

.temu-product-detail-kv span,
.temu-product-detail-summary span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.temu-product-detail-kv strong,
.temu-product-detail-kv a,
.temu-product-detail-summary strong,
.temu-product-detail-summary a {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-subtable-wrap {
  overflow: auto;
}

.temu-product-subtable {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
}

.temu-product-subtable th,
.temu-product-subtable td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: 12px;
  line-height: 1.45;
  text-align: left;
  vertical-align: top;
}

.temu-product-subtable th {
  background: #f4f8fb;
  color: #475569;
  font-weight: 800;
  white-space: nowrap;
}

.temu-product-subtable img {
  width: 44px;
  height: 44px;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #eef3f8;
}

.temu-product-media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px;
  padding: 12px;
}

.temu-product-media-grid article {
  min-width: 0;
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfc;
}

.temu-product-media-grid article > a:first-child {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  border-radius: 7px;
  background: #eef3f8;
}

.temu-product-media-grid img,
.temu-product-media-grid video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.temu-product-media-grid em {
  position: absolute;
  right: 6px;
  bottom: 6px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.78);
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.temu-product-media-grid strong,
.temu-product-media-grid span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-media-grid strong {
  color: var(--ink);
  font-size: 12px;
}

.temu-product-media-grid span {
  color: var(--muted);
  font-size: 11px;
}

.temu-product-open-original {
  color: #2563eb;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.temu-product-review-table {
  min-width: 1050px;
}

.temu-product-review-images {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.temu-product-review-images img {
  width: 42px;
  height: 42px;
}

.temu-product-seo-grid {
  display: grid;
  gap: 8px;
  padding: 12px;
}

.temu-product-seo-grid > div {
  min-width: 0;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfc;
}

.temu-product-seo-grid span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.temu-product-seo-grid strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.temu-product-ai-output-grid {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.temu-product-ai-output-grid article {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfc;
}

.temu-product-ai-output-grid article > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.temu-product-ai-output-grid strong {
  color: var(--ink);
  font-size: 13px;
}

.temu-product-ai-output-grid span {
  color: var(--muted);
  font-size: 12px;
}

.temu-product-ai-output-grid p {
  margin: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
}

.temu-product-media {
  display: grid;
  gap: 8px;
  align-content: start;
}

.temu-product-media img,
.temu-product-media video {
  width: 180px;
  height: 180px;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f4f8fb;
}

.temu-product-video-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid rgba(37, 99, 235, 0.24);
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.temu-product-video-thumb {
  position: relative;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  text-decoration: none;
}

.temu-product-video-thumb video {
  display: block;
}

.temu-product-video-thumb span {
  position: absolute;
  right: 3px;
  bottom: 3px;
  padding: 1px 5px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.76);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
}

.temu-product-flat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 12px;
}

.temu-product-flat-grid > div {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfc;
}

.temu-product-flat-grid span {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-product-flat-grid strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.temu-product-sample-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}

.temu-product-sample-list pre,
.temu-product-raw pre {
  max-height: 280px;
  overflow: auto;
  margin: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #0f172a;
  color: #e2e8f0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 11px;
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.temu-product-raw summary {
  cursor: pointer;
  padding: 10px 12px;
  color: var(--ink);
  font-size: 14px;
  font-weight: 800;
}

.temu-product-raw pre {
  margin: 0 12px 12px;
  max-height: 360px;
}

@media (max-width: 1180px) {
  .temu-product-field-center {
    grid-template-columns: 1fr;
  }

  .ecommerce-platform-toolbar {
    grid-template-columns: 1fr;
  }

  .ecommerce-platform-toolbar .toolbar-right {
    justify-content: flex-start;
    flex-wrap: wrap;
    min-width: 0;
  }

  .temu-product-toolbar .toolbar-left {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }

  .temu-product-row {
    grid-template-columns: 68px minmax(230px, 1.4fr) minmax(110px, 0.6fr) minmax(120px, 0.6fr);
  }

  .temu-product-status {
    grid-column: 2 / -1;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
  }

  .platform-sync-cards {
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
}

  .platform-config-strip {
    grid-template-columns: 1fr;
  }
}

.material-color-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  min-height: 19px;
  max-width: 96px;
  padding: 1px 5px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 999px;
  background: #fff;
  font-size: 11px;
}

.material-color-chip span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.material-dot {
  width: 10px;
  height: 10px;
  flex: 0 0 10px;
  border-radius: 50%;
  border: 1px solid rgba(15, 23, 42, 0.18);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
}

.material-overflow {
  display: inline-flex;
  align-items: center;
  min-height: 19px;
  padding: 1px 5px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}

.sku-count-badge,
.production-inline {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #ecfdf5;
  color: #166534;
  font-size: 12px;
  font-weight: 800;
}

.status-stack span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.status-stack strong {
  color: var(--text);
}

.production-summary strong {
  color: #0f766e;
}

.sku-detail-table {
  min-width: 1080px;
  border-left: 42px solid #f3f7f9;
}

.sku-detail-table th,
.sku-detail-table td {
  padding-top: 8px;
  padding-bottom: 8px;
}

.sku-detail-table th:nth-child(1),
.sku-detail-table td:nth-child(1) {
  width: 150px;
}

.sku-detail-table th:nth-child(2),
.sku-detail-table td:nth-child(2) {
  width: 210px;
}

.sku-detail-table th:nth-child(3),
.sku-detail-table td:nth-child(3),
.sku-detail-table th:nth-child(4),
.sku-detail-table td:nth-child(4) {
  width: 180px;
}

.sku-detail-table th:nth-child(8),
.sku-detail-table td:nth-child(8) {
  width: 150px;
}

.sku-platform-links span {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  max-width: 138px;
  padding: 1px 5px;
  border-radius: 999px;
  background: #f1f5f9;
  font-size: 11px;
}

.sku-platform-links b {
  color: #0f766e;
}

.material-binding-section .section-hint {
  max-width: 420px;
}

.material-binding-grid {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 260px;
  overflow: hidden;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.material-binding-grid.compact {
  max-height: 220px;
}

.material-picker-selected {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-height: 28px;
}

.material-picker-empty {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.material-selected-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 180px;
  min-height: 26px;
  padding: 2px 6px;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  background: #eff6ff;
  color: #1e3a8a;
  font-size: 12px;
  font-weight: 800;
}

.material-selected-chip span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.material-selected-chip b {
  color: #64748b;
  font-size: 13px;
  line-height: 1;
}

.material-picker-tools {
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(180px, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.material-picker-tools select,
.material-picker-tools input {
  width: 100%;
  min-height: 30px;
  padding: 4px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  font-size: 12px;
}

.material-picker-tools span {
  min-width: 56px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  text-align: right;
}

.material-binding-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(178px, 1fr));
  gap: 6px;
  overflow: auto;
  padding-right: 2px;
}

.material-picker-no-results {
  display: grid;
  place-items: center;
  min-height: 88px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  color: #64748b;
  font-size: 13px;
  font-weight: 800;
  background: #f8fafc;
}

.material-picker-no-results[hidden] {
  display: none;
}

.material-picker-pager {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-height: 28px;
  border-top: 1px solid #e2e8f0;
  padding-top: 6px;
}

.material-picker-pager span {
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.material-picker-pager button {
  min-height: 26px;
  height: 26px;
  padding: 0 8px;
  border-radius: 7px;
  font-size: 12px;
}

.material-picker-pager button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.material-binding-item[hidden],
.material-picker-pager[hidden] {
  display: none;
}

.material-binding-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 42px;
  padding: 6px 8px;
  border: 1px solid rgba(148, 163, 184, 0.3);
  border-radius: 8px;
  background: #fff;
  font-size: 12px;
  cursor: pointer;
}

.material-binding-item:hover {
  border-color: #93c5fd;
  background: #f8fbff;
}

.material-binding-item.selected {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: inset 3px 0 0 #2563eb;
}

.material-binding-item input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.material-option-text {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.material-option-text strong,
.material-option-text small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.material-option-text strong {
  color: #0f172a;
  font-size: 12px;
}

.material-option-text small {
  color: #64748b;
  font-size: 11px;
}

@media (max-width: 720px) {
  .material-picker-tools {
    grid-template-columns: 1fr;
  }

  .material-picker-tools span {
    text-align: left;
  }
}

.sku-sheet-toolbar .toolbar-left {
  flex: 1 1 520px;
}

.sku-sheet-toolbar {
  box-sizing: border-box;
  height: 32px;
  min-height: 32px;
}

.sku-sheet-toolbar .search {
  min-width: min(520px, 52vw);
  height: 28px;
  padding: 4px 8px;
}

.sku-sheet-toolbar button {
  min-height: 28px;
  height: 28px;
  padding: 0 8px;
  font-size: 12px;
}

.sku-filter-strip {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  height: 32px;
  min-height: 32px;
  margin: 4px 0 6px;
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.sku-filter-strip::-webkit-scrollbar {
  display: none;
}

.sku-filter-strip label {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.sku-filter-strip select {
  min-width: 108px;
  height: 26px;
  padding: 2px 6px;
  border: 1px solid #d1d5db;
  border-radius: 7px;
  background: #fff;
  font-size: 12px;
}

.sku-filter-strip button {
  flex: 0 0 auto;
  height: 26px;
  padding: 0 7px;
  font-size: 12px;
}

.sku-filter-check {
  flex: 0 0 auto;
  min-height: 24px;
  padding: 0 5px;
  gap: 4px;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  background: #f8fafc;
}

.sku-pagination {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 30px;
  margin: 0 0 5px;
  padding: 3px 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.sku-pagination-summary {
  white-space: nowrap;
}

.sku-pagination-controls {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  min-width: 0;
  flex-wrap: wrap;
}

.sku-pagination-controls button {
  min-height: 24px;
  height: 24px;
  padding: 0 7px;
  font-size: 12px;
}

.sku-pagination-controls button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.sku-pagination-controls label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.sku-pagination-controls select {
  height: 24px;
  padding: 1px 5px;
  border: 1px solid #d1d5db;
  border-radius: 7px;
  background: #fff;
  font-size: 12px;
}

.sku-sheet-wrap {
  max-height: calc(100vh - 182px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.sku-sheet-table {
  width: max-content;
  min-width: max-content;
  table-layout: auto;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 11px;
  color: #1f2937;
}

.sku-sheet-table th,
.sku-sheet-table td {
  height: 64px;
  padding: 2px 4px;
  border-right: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
  background: #fff;
  vertical-align: middle;
  overflow: hidden;
  white-space: normal;
  line-height: 1.18;
}

.sku-sheet-table th {
  height: 30px;
  position: sticky;
  top: 0;
  z-index: 5;
  background: #f8fafc;
  color: #111827;
  font-weight: 800;
  text-align: left;
  white-space: nowrap;
  box-shadow: inset 0 -1px 0 #dbe2ea;
}

.sku-sheet-table .sku-sheet-group-row th {
  top: 0;
  z-index: 8;
  height: 22px;
  padding: 2px 4px;
  border-bottom: 1px solid #cbd5e1;
  color: #475569;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sku-sheet-table .sku-sheet-column-row th {
  top: 22px;
}

.sku-sheet-table .sku-sheet-group-row th:nth-child(1),
.sku-sheet-table .sku-sheet-group-row th:nth-child(2) {
  left: auto;
  width: auto;
  box-shadow: inset 0 -1px 0 #cbd5e1;
}

.sku-header-cell {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  min-width: 0;
}

.sku-header-cell span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sku-ai-header-btn {
  display: inline-grid;
  flex: 0 0 auto;
  width: 24px;
  height: 20px;
  min-height: 20px;
  padding: 0;
  place-items: center;
  border: 1px solid #93c5fd;
  border-radius: 6px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}

.sku-ai-header-btn:hover:not(:disabled) {
  border-color: #2563eb;
  background: #dbeafe;
}

.sku-ai-header-btn:disabled {
  opacity: 0.55;
  cursor: progress;
}

.sku-sheet-table tbody tr:nth-child(even) td {
  background: #fbfcfe;
}

.sku-sheet-table tbody tr:hover td {
  background: #f0f7ff;
}

.sku-sheet-row {
  cursor: pointer;
}

.sku-sheet-table th:nth-child(1),
.sku-sheet-table td:nth-child(1) {
  position: sticky;
  left: 0;
  z-index: 4;
  width: 66px;
  min-width: 66px;
  max-width: 66px;
  background: #fff;
}

.sku-sheet-table th:nth-child(1) {
  z-index: 7;
  background: #f8fafc;
}

.sku-sheet-table th:nth-child(2),
.sku-sheet-table td:nth-child(2) {
  position: sticky;
  left: 66px;
  z-index: 4;
  width: clamp(214px, 12vw, 240px);
  min-width: 214px;
  max-width: 240px;
  background: #fff;
  box-shadow: 1px 0 0 #cbd5e1;
}

.sku-sheet-table th:nth-child(2) {
  z-index: 7;
  background: #f8fafc;
}

.sku-sheet-table .sku-sheet-group-row th,
.sku-sheet-table .sku-sheet-group-row th:nth-child(1),
.sku-sheet-table .sku-sheet-group-row th:nth-child(2) {
  position: sticky;
  top: 0;
  left: auto;
  z-index: 8;
  width: auto;
  background-color: #f1f5f9;
  box-shadow: inset 0 -1px 0 #cbd5e1;
}

.sku-sheet-table tbody tr:nth-child(even) td:nth-child(1),
.sku-sheet-table tbody tr:nth-child(even) td:nth-child(2) {
  background-color: #fbfcfe;
}

.sku-sheet-table tbody tr:hover td:nth-child(1),
.sku-sheet-table tbody tr:hover td:nth-child(2) {
  background-color: #f0f7ff;
}

.sku-sheet-table .image-col {
  width: 66px;
  min-width: 66px;
  max-width: 66px;
}

.sku-sheet-table .name-col {
  width: clamp(102px, 7vw, 126px);
  min-width: 102px;
  max-width: 126px;
}

.sku-sheet-table .sku-main-col {
  width: clamp(214px, 12vw, 240px);
  min-width: 214px;
  max-width: 240px;
}

.sku-sheet-table .status-col {
  width: clamp(76px, 5vw, 94px);
  min-width: 76px;
  max-width: 94px;
}

.sku-sheet-table .actions-col {
  width: clamp(90px, 6vw, 112px);
  min-width: 90px;
  max-width: 112px;
}

.sku-sheet-table .days-col,
.sku-sheet-table .number-col,
.sku-sheet-table .price-col,
.sku-sheet-table .rate-col {
  width: clamp(58px, 4.5vw, 76px);
  min-width: 58px;
  max-width: 76px;
}

.sku-sheet-table .title-col {
  width: clamp(168px, 12vw, 220px);
  min-width: 168px;
  max-width: 220px;
}

.sku-sheet-table .category-col {
  width: clamp(104px, 7vw, 132px);
  min-width: 104px;
  max-width: 132px;
}

.sku-sheet-table .code-col {
  width: clamp(92px, 6vw, 112px);
  min-width: 92px;
  max-width: 112px;
}

.sku-sheet-table .sku-code-col {
  width: clamp(102px, 7vw, 122px);
  min-width: 102px;
  max-width: 122px;
}

.sku-sheet-table .color-col {
  width: clamp(126px, 8vw, 148px);
  min-width: 126px;
  max-width: 148px;
}

.sku-sheet-table .platform-col {
  width: clamp(136px, 9vw, 164px);
  min-width: 136px;
  max-width: 164px;
}

.sku-sheet-table .platform-tag-col {
  width: clamp(96px, 6vw, 120px);
  min-width: 96px;
  max-width: 120px;
}

.sku-sheet-table .route-col {
  width: clamp(108px, 7vw, 128px);
  min-width: 108px;
  max-width: 128px;
}

.sku-sheet-table .warehouse-col {
  width: clamp(106px, 7vw, 128px);
  min-width: 106px;
  max-width: 128px;
}

.sku-sheet-table .pack-col,
.sku-sheet-table .note-col,
.sku-sheet-table .source-col,
.sku-sheet-table .label-col {
  width: clamp(92px, 6vw, 112px);
  min-width: 92px;
  max-width: 112px;
}

.sku-sheet-table .link-col {
  width: clamp(82px, 5vw, 98px);
  min-width: 82px;
  max-width: 98px;
}

.sku-sheet-table .date-col {
  width: clamp(86px, 5vw, 100px);
  min-width: 86px;
  max-width: 100px;
}

.sku-sheet-table .owner-col {
  width: clamp(58px, 4vw, 72px);
  min-width: 58px;
  max-width: 72px;
}

.sku-sheet-table .ops-col {
  width: clamp(72px, 5vw, 96px);
  min-width: 72px;
  max-width: 96px;
}

.sku-image-cell {
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  place-items: center;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #f8fafc;
  overflow: hidden;
  cursor: zoom-in;
}

.sku-thumb {
  width: 44px;
  height: 44px;
  object-fit: cover;
  display: block;
}

.sku-image-empty {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px dashed #cbd5e1;
  border-radius: 7px;
  color: #94a3b8;
  background: #f8fafc;
  font-size: 11px;
}

.sku-image-placeholder {
  gap: 2px;
  border-style: solid;
  background: linear-gradient(135deg, #e0f2fe 0%, #eef2ff 100%);
  color: #1e3a8a;
  font-weight: 800;
}

.sku-image-placeholder strong {
  font-size: 13px;
  line-height: 1;
}

.sku-main-code {
  display: grid;
  gap: 1px;
  min-width: 0;
  align-content: center;
}

.sku-main-code .sku-code-line,
.platform-product-sku .sku-code-line {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  column-gap: 3px;
  align-items: baseline;
  min-width: 0;
  overflow: hidden;
  color: #334155;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.22;
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: 0;
}

.platform-product-sku .sku-code-line {
  grid-template-columns: max-content minmax(0, 1fr);
  column-gap: 6px;
  text-align: left;
}

.sku-main-code .sku-code-line b,
.platform-product-sku .sku-code-line b {
  min-width: 0;
  overflow: hidden;
  color: #64748b;
  font-weight: 800;
  text-overflow: ellipsis;
}

.platform-product-sku .sku-code-line b {
  overflow: visible;
  text-overflow: clip;
}

.sku-main-code .sku-code-line em,
.platform-product-sku .sku-code-line em {
  min-width: 0;
  overflow: hidden;
  color: #0f172a;
  font-style: normal;
  font-weight: 900;
  text-overflow: ellipsis;
}

.sku-main-code .sku-code-line.platform-sku em,
.sku-main-code .sku-code-line.platform-skc em,
.platform-product-sku .sku-code-line.platform-sku em,
.platform-product-sku .sku-code-line.platform-skc em {
  color: #475569;
  font-weight: 800;
}

.sku-title-text {
  display: -webkit-box;
  max-height: 51px;
  overflow: hidden;
  color: #111827;
  font-size: 11px;
  line-height: 1.16;
  word-break: break-word;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.sku-category-text {
  display: -webkit-box;
  max-height: 51px;
  overflow: hidden;
  color: #111827;
  font-size: 11px;
  line-height: 1.16;
  word-break: break-word;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.sku-sheet-status {
  display: inline-flex;
  align-items: center;
  min-height: 21px;
  max-width: 100%;
  padding: 2px 6px;
  border-radius: 7px;
  background: #e8f7ef;
  color: #166534;
  font-weight: 800;
  line-height: 1.1;
}

.sku-sheet-status.warn {
  background: #fff7ed;
  color: #c2410c;
}

.sku-sheet-status.danger {
  background: #fef2f2;
  color: #b91c1c;
}

.sku-association-workbench {
  display: grid;
  gap: 8px;
  margin: 6px 0;
  padding: 10px;
  border: 1px solid #d6dde8;
  border-radius: 8px;
  background: #fff;
}

.sku-association-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.sku-association-head > div:first-child {
  min-width: 0;
}

.sku-association-head span {
  display: block;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.sku-association-head h3 {
  margin: 2px 0 0;
  color: #0f172a;
  font-size: 15px;
}

.sku-association-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
  gap: 8px;
}

.sku-association-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 10px;
  min-width: 0;
  padding: 9px 10px 9px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  background: #f8fafc;
  border-left-width: 4px;
}

.sku-association-card > i {
  display: inline-grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 999px;
  background: #e5e7eb;
  color: #334155;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}

.sku-association-card strong {
  display: block;
  color: #0f172a;
  font-size: 13px;
}

.sku-association-card p {
  margin: 2px 0 0;
  color: #64748b;
  font-size: 12px;
}

.sku-association-card dl {
  grid-column: 1 / -1;
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin: 0;
}

.sku-association-card dl div {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 22px;
  padding: 1px 7px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #e2e8f0;
}

.sku-association-card dt {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.sku-association-card dd {
  margin: 0;
  color: #111827;
  font-size: 12px;
  font-weight: 800;
}

.sku-association-card.tone-model {
  border-left-color: #2563eb;
}

.sku-association-card.tone-sales {
  border-left-color: #059669;
}

.sku-association-card.tone-platform {
  border-left-color: #7c3aed;
}

.sku-association-card.tone-fulfillment {
  border-left-color: #0891b2;
}

.sku-association-card.tone-exception {
  border-left-color: #dc2626;
}

.sku-association-rules,
.sku-association-alerts {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.sku-association-rules span {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 2px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.sku-association-alerts button {
  display: inline-flex;
  max-width: 420px;
  min-height: 30px;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border: 1px solid #fed7aa;
  border-radius: 7px;
  background: #fff7ed;
  color: #9a3412;
  font-size: 12px;
}

.sku-association-alerts button span,
.sku-association-alerts button em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sku-association-alerts button em {
  color: #c2410c;
  font-style: normal;
}

.sku-association-status {
  display: inline-flex;
  min-height: 19px;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 2px 6px;
  border-radius: 999px;
  background: #e8f7ef;
  color: #166534;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
}

.sku-association-status.warn {
  background: #fff7ed;
  color: #c2410c;
}

.sku-association-status.danger {
  background: #fef2f2;
  color: #b91c1c;
}

.sku-inline-tag {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 18px;
  padding: 1px 6px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #334155;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
}

.sku-inline-tag.tone-prepack {
  background: #e8eef7;
  color: #334155;
}

.sku-inline-tag.tone-bundle {
  background: #ecfeff;
  color: #0e7490;
}

.sku-inline-tag.tone-expanded {
  background: #f3e8ff;
  color: #7e22ce;
}

.sku-inline-tag.tone-multi {
  background: #eef2ff;
  color: #4338ca;
}

.sku-inline-tag.tone-warn {
  background: #fff7ed;
  color: #c2410c;
}

.sku-tag-stack {
  display: flex;
  align-items: center;
  gap: 3px;
  flex-wrap: wrap;
  min-width: 0;
}

.sku-route-cell,
.sku-warehouse-cell {
  display: grid;
  align-content: center;
  gap: 2px;
  min-width: 0;
}

.sku-route-cell span,
.sku-route-cell small,
.sku-route-cell em,
.sku-warehouse-cell span,
.sku-warehouse-cell small {
  min-width: 0;
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sku-warehouse-cell strong {
  min-width: 0;
  overflow: hidden;
  color: #111827;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sku-sheet-table th.group-basic,
.sku-sheet-table td.sku-col-basic {
  background-image: linear-gradient(90deg, rgba(5, 150, 105, 0.06), rgba(5, 150, 105, 0));
}

.sku-sheet-table th.group-model,
.sku-sheet-table td.sku-col-model {
  background-image: linear-gradient(90deg, rgba(37, 99, 235, 0.06), rgba(37, 99, 235, 0));
}

.sku-sheet-table th.group-platform,
.sku-sheet-table td.sku-col-platform {
  background-image: linear-gradient(90deg, rgba(124, 58, 237, 0.06), rgba(124, 58, 237, 0));
}

.sku-sheet-table th.group-route,
.sku-sheet-table td.sku-col-route {
  background-image: linear-gradient(90deg, rgba(8, 145, 178, 0.07), rgba(8, 145, 178, 0));
}

.sku-sheet-table th.group-warehouse,
.sku-sheet-table td.sku-col-warehouse {
  background-image: linear-gradient(90deg, rgba(71, 85, 105, 0.06), rgba(71, 85, 105, 0));
}

.sku-sheet-table th.group-opsdata,
.sku-sheet-table td.sku-col-opsdata {
  background-image: linear-gradient(90deg, rgba(217, 119, 6, 0.05), rgba(217, 119, 6, 0));
}

.sku-sheet-table th.group-actions,
.sku-sheet-table td.sku-col-actions {
  background-image: linear-gradient(90deg, rgba(15, 23, 42, 0.05), rgba(15, 23, 42, 0));
}

.sku-sheet-table .platform-row-missing td {
  background-color: #fffbeb;
}

.sku-sheet-table .platform-row-missing:hover td {
  background-color: #fff7ed;
}

.sku-sheet-table.model-management-table {
  min-width: 1020px;
  table-layout: fixed;
}

.sku-sheet-table.model-management-table th,
.sku-sheet-table.model-management-table td {
  height: 38px;
  padding: 2px 5px;
  line-height: 1.14;
}

.sku-sheet-table.model-management-table .sku-sheet-group-row th {
  left: auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 16px;
  padding: 0 5px;
  z-index: 10;
}

.sku-sheet-table.model-management-table .sku-sheet-column-row th {
  top: 16px;
  z-index: 9;
}

.sku-sheet-table.model-management-table .sku-sheet-column-row th:nth-child(1),
.sku-sheet-table.model-management-table tbody td:nth-child(1) {
  left: auto;
  width: 250px;
  min-width: 250px;
  max-width: 250px;
  box-shadow: none;
}

.sku-sheet-table.model-management-table tbody td:nth-child(1),
.sku-sheet-table.model-management-table tbody td:nth-child(2) {
  position: static;
  left: auto;
  z-index: auto;
}

.sku-sheet-table.model-management-table .sku-sheet-column-row th:nth-child(2),
.sku-sheet-table.model-management-table tbody td:nth-child(2) {
  left: auto;
  width: 230px;
  min-width: 230px;
  max-width: 230px;
  box-shadow: none;
}

.sku-sheet-table.model-management-table .sku-sheet-column-row th:nth-child(3),
.sku-sheet-table.model-management-table tbody td:nth-child(3) {
  width: 170px;
  min-width: 170px;
  max-width: 170px;
}

.sku-sheet-table.model-management-table .sku-sheet-column-row th:nth-child(4),
.sku-sheet-table.model-management-table tbody td:nth-child(4) {
  width: 190px;
  min-width: 190px;
  max-width: 190px;
}

.sku-sheet-table.model-management-table .sku-sheet-column-row th:nth-child(5),
.sku-sheet-table.model-management-table tbody td:nth-child(5) {
  width: 70px;
  min-width: 70px;
  max-width: 70px;
}

.sku-sheet-table.model-management-table .sku-sheet-column-row th:nth-child(6),
.sku-sheet-table.model-management-table tbody td:nth-child(6) {
  width: 70px;
  min-width: 70px;
  max-width: 70px;
}

.model-management-table .model-identity-cell strong,
.model-management-table .model-file-cell strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-line-clamp: unset;
}

.model-management-table .model-identity-cell {
  display: block;
}

.model-management-table .model-identity-cell span,
.model-management-table .model-identity-cell small {
  display: inline-block;
  margin-right: 6px;
  color: #334155;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
}

.model-management-table .model-chip-list span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-management-table .model-chip-list,
.model-management-table .model-color-list,
.model-management-table .model-pack-list,
.model-management-table .model-issue-list {
  flex-wrap: nowrap;
  overflow: hidden;
}

.model-management-table .model-color-list span,
.model-management-table .model-pack-list .sku-inline-tag,
.model-management-table .model-issue-list span {
  flex: 0 0 auto;
}

.sku-sheet-row.assoc-danger td:first-child {
  box-shadow: inset 3px 0 0 #dc2626;
}

.sku-sheet-row.assoc-warn td:first-child {
  box-shadow: inset 3px 0 0 #f59e0b;
}

.sku-sheet-row.assoc-ok td:first-child {
  box-shadow: inset 3px 0 0 #16a34a;
}

.ecommerce-platform-table .sku-sheet-row.assoc-danger td:first-child,
.ecommerce-platform-table .sku-sheet-row.assoc-warn td:first-child,
.ecommerce-platform-table .sku-sheet-row.assoc-ok td:first-child {
  box-shadow: none;
}

.sku-action-tags {
  display: flex;
  align-items: center;
  gap: 3px;
  flex-wrap: wrap;
}

.sku-action-tags span,
.sku-action-tags em {
  display: inline-flex;
  align-items: center;
  min-height: 19px;
  padding: 1px 5px;
  border-radius: 7px;
  background: #eef2ff;
  color: #334155;
  font-style: normal;
  font-weight: 700;
}

.sku-sheet-actions {
  flex-wrap: nowrap;
  gap: 4px;
}

.sku-detail-backdrop {
  align-items: stretch;
  justify-content: flex-end;
  padding: 0;
  background: rgba(15, 23, 42, 0.28);
}

.sku-detail-drawer {
  display: flex;
  flex-direction: column;
  width: min(760px, 92vw);
  height: 100vh;
  background: #f8fafc;
  border-left: 1px solid #cbd5e1;
  box-shadow: -18px 0 40px rgba(15, 23, 42, 0.18);
}

.sku-detail-head,
.sku-detail-foot {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid #e2e8f0;
  background: #fff;
}

.sku-detail-foot {
  border-top: 1px solid #e2e8f0;
  border-bottom: 0;
  justify-content: flex-end;
}

.sku-detail-head span {
  display: block;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.sku-detail-head h2 {
  margin: 2px 0;
  font-size: 20px;
  letter-spacing: 0;
}

.sku-detail-head p {
  margin: 0;
  color: #64748b;
}

.sku-detail-body {
  flex: 1 1 auto;
  overflow: auto;
  padding: 14px;
}

.sku-detail-section {
  position: relative;
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-left-width: 4px;
  border-radius: 8px;
  background: #fff;
}

.sku-detail-section-summary {
  border-left-color: #059669;
}

.sku-detail-section-model {
  border-left-color: #2563eb;
}

.sku-detail-section-platform {
  border-left-color: #7c3aed;
}

.sku-detail-section-route {
  border-left-color: #0891b2;
}

.sku-detail-section-warehouse {
  border-left-color: #475569;
}

.sku-detail-section-exception {
  border-left-color: #dc2626;
  background: #fffafa;
}

.sku-detail-section-image,
.sku-detail-section-material,
.sku-detail-section-fields {
  border-left-color: #94a3b8;
}

.sku-detail-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.sku-detail-section-head h3 {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  font-size: 14px;
}

.sku-detail-section-head h3::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.55;
}

.sku-detail-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  gap: 8px;
}

.sku-detail-image-grid button {
  padding: 0;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  overflow: hidden;
  background: #f8fafc;
  cursor: zoom-in;
}

.sku-detail-thumb {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  display: block;
}

.sku-detail-platforms,
.sku-detail-materials,
.sku-bom-list,
.sku-exception-list {
  display: grid;
  gap: 8px;
}

.sku-detail-platforms article,
.sku-detail-materials article,
.sku-bom-list article,
.sku-exception-list article {
  display: grid;
  gap: 3px;
  padding: 9px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.sku-detail-platforms strong,
.sku-detail-materials strong,
.sku-bom-list strong,
.sku-exception-list strong {
  color: #0f172a;
}

.sku-detail-platforms span,
.sku-detail-platforms em,
.sku-detail-materials span,
.sku-bom-list span,
.sku-bom-list em,
.sku-exception-list span {
  color: #64748b;
  font-style: normal;
  font-size: 12px;
}

.sku-detail-materials article {
  grid-template-columns: auto 1fr;
  align-items: center;
}

.sku-detail-materials article span {
  grid-column: 2;
}

.sku-detail-field-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(176px, 1fr));
  gap: 8px;
}

.sku-detail-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(138px, 1fr));
  gap: 8px;
}

.sku-association-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(152px, 1fr));
  gap: 8px;
}

.sku-detail-field-grid > div,
.sku-detail-summary-grid > div,
.sku-association-detail-grid > div {
  min-width: 0;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  background: #f8fafc;
}

.sku-detail-field-grid span,
.sku-detail-summary-grid span,
.sku-association-detail-grid span {
  display: block;
  margin-bottom: 4px;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.sku-detail-field-grid strong,
.sku-detail-summary-grid strong,
.sku-association-detail-grid strong {
  display: block;
  min-width: 0;
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.sku-bom-list {
  margin-top: 8px;
}

.sku-bom-list article {
  grid-template-columns: minmax(0, 1.3fr) auto auto;
  align-items: center;
}

.sku-exception-list article.warning {
  border-color: #fed7aa;
  background: #fff7ed;
}

.sku-exception-list article.danger {
  border-color: #fecaca;
  background: #fef2f2;
}

.sku-association-editor textarea {
  min-height: 74px;
  resize: vertical;
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: 12px;
}

.product-section.sku-editor-basic,
.product-section.sku-editor-sales,
.product-section.sku-editor-model,
.product-section.sku-editor-fulfillment,
.product-section.sku-editor-platform,
.product-section.sku-editor-warehouse {
  border-left-width: 4px;
}

.product-section.sku-editor-basic {
  border-left-color: #059669;
}

.product-section.sku-editor-sales {
  border-left-color: #16a34a;
}

.product-section.sku-editor-model {
  border-left-color: #2563eb;
  background: #f8fbff;
}

.product-section.sku-editor-fulfillment {
  border-left-color: #0891b2;
  background: #f8fdff;
}

.product-section.sku-editor-platform {
  border-left-color: #7c3aed;
}

.product-section.sku-editor-warehouse {
  border-left-color: #475569;
}

.sku-editor-readonly-list {
  display: grid;
  gap: 8px;
  padding: 8px;
}

.sku-editor-readonly-list article {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  background: #fff;
}

.sku-editor-readonly-list strong,
.sku-editor-readonly-list span,
.sku-editor-readonly-list em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sku-editor-readonly-list span,
.sku-editor-readonly-list em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
}

.sku-editor-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
  gap: 8px;
  padding: 8px;
}

.sku-editor-summary-grid > div {
  min-width: 0;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  background: #fff;
}

.sku-editor-summary-grid span {
  display: block;
  margin-bottom: 4px;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.sku-editor-summary-grid strong {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.actions {
  display: flex;
  gap: 6px;
  align-items: center;
}

.actions .text-icon {
  flex: 0 0 auto;
}

.json-block {
  max-height: 320px;
  margin: 0;
  padding: 12px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 12px;
  line-height: 1.45;
  color: #24313a;
  background: #f7fafc;
}

.tag {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  max-width: 160px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--panel-soft);
  color: var(--accent-dark);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.success {
  background: #dcfce7;
  color: #166534;
}

.tag.danger {
  background: #fee2e2;
  color: var(--danger);
}

.inline-task-btn {
  min-width: 86px;
  min-height: 34px;
  border-color: rgba(42, 111, 151, 0.35);
  background: #eef7ff;
  color: #1266a7;
  font-weight: 700;
}

.inline-task-btn.secondary {
  background: #f5f7f9;
  color: #334155;
}

.segmented {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.segmented button.active {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.print-consumable-shell {
  display: grid;
  gap: 14px;
}

.public-media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
  padding: 14px;
}

.public-media-card {
  min-width: 0;
  display: grid;
  grid-template-rows: 168px minmax(0, 1fr);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: #ffffff;
}

.public-media-thumb {
  width: 100%;
  height: 168px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: var(--panel-soft);
}

.public-media-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.public-media-thumb span {
  color: var(--muted);
  font-size: 13px;
}

.public-media-card-body {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 12px;
}

.public-media-card-body h3 {
  margin: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.public-media-card-body p {
  min-height: 36px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.public-media-card-body input {
  width: 100%;
  min-width: 0;
  font-size: 12px;
}

.production-management-shell {
  display: grid;
  gap: 14px;
}

.production-workbench-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
  gap: 14px;
  align-items: start;
}

.production-demand-panel,
.production-schedule-panel,
.production-print-panel,
.production-audit-panel {
  grid-column: 1 / -1;
}

.production-panel {
  min-width: 0;
}

.production-panel .panel-head {
  align-items: flex-start;
  gap: 12px;
}

.production-panel .panel-head > div {
  min-width: 0;
}

.production-panel .panel-head span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.production-table-wrap {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.production-table-wrap table {
  min-width: 1060px;
}

.production-preview-body {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.production-preview-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(116px, 1fr));
  gap: 10px;
}

.production-preview-summary div {
  min-height: 68px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
}

.production-preview-summary span,
.production-gantt-row span,
.production-printer-card dt {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.production-preview-summary strong {
  display: block;
  margin-top: 6px;
  color: var(--text);
  font-size: 22px;
}

.production-strategy {
  padding: 10px 12px;
  border: 1px solid rgba(20, 160, 152, 0.24);
  border-radius: 8px;
  background: var(--aqua-soft);
  color: #0f5d56;
  font-size: 13px;
  font-weight: 700;
}

.production-conflicts {
  display: grid;
  gap: 8px;
}

.production-conflicts span {
  padding: 8px 10px;
  border: 1px solid #fed7aa;
  border-radius: 8px;
  background: #fff7ed;
  color: #9a3412;
  font-size: 12px;
}

.production-gantt-list {
  display: grid;
  gap: 10px;
}

.production-gantt-row {
  position: relative;
  min-height: 72px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.65fr);
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  overflow: hidden;
}

.production-gantt-row strong {
  display: block;
  overflow: hidden;
  color: var(--text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.production-gantt-row em {
  position: absolute;
  left: 12px;
  right: auto;
  bottom: 7px;
  width: var(--pm-width, 34%);
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--aqua), var(--accent));
}

.production-printer-grid {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.production-printer-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.production-printer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.production-printer-head strong {
  display: block;
  color: var(--text);
}

.production-printer-head span {
  color: var(--muted);
  font-size: 12px;
}

.production-printer-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
  margin: 0;
}

.production-printer-card dd {
  margin: 2px 0 0;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.production-printer-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 8px;
  padding: 14px;
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.58);
}

.production-printer-form input,
.production-printer-form select {
  width: 100%;
  min-width: 0;
}

.production-printer-form button {
  min-width: 120px;
}

.production-material-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px;
}

.production-material-list span {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
}

.consumable-table table {
  min-width: 1180px;
}

.consumable-thumb {
  width: 42px;
  height: 42px;
  border-radius: 6px;
  border: 1px solid var(--line);
  object-fit: cover;
  background: #fff;
  display: block;
}

.image-preview-trigger {
  display: inline-flex;
  padding: 0;
  min-width: 0;
  min-height: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}

.thumb-row {
  display: flex;
  gap: 6px;
  align-items: center;
}

.inline-number-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(86px, 1fr));
  gap: 8px;
  min-width: 280px;
}

.inline-number-grid label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 12px;
}

.inline-number-grid input {
  width: 100%;
  min-width: 0;
  height: 34px;
  padding: 6px 8px;
}

.muted-line {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.subtle {
  background: #fbfcfd;
  color: var(--muted);
}

.consumable-recognize-grid {
  display: grid;
  grid-template-columns: minmax(260px, 420px) minmax(260px, 1fr);
  gap: 14px;
  align-items: start;
}

.recognize-preview {
  margin-bottom: 12px;
}

.recognize-preview .consumable-thumb {
  width: 96px;
  height: 96px;
}

.panel-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.compact-table {
  min-width: 640px;
}

.task-notice-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 66px;
  justify-content: center;
}

.task-notice-btn strong {
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  padding: 0 5px;
  background: var(--danger);
  color: #fff;
  font-size: 12px;
}

.task-hero {
  min-height: 96px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background:
    radial-gradient(circle at 78% 28%, rgba(220, 232, 255, 0.48), transparent 34%),
    linear-gradient(135deg, rgba(237, 247, 251, 0.9), rgba(255, 255, 255, 0.94)),
    rgba(255, 255, 255, 0.9);
  display: grid;
  grid-template-columns: minmax(220px, 0.42fr) minmax(0, 1.58fr);
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  box-shadow: var(--shadow);
}

.task-hero span {
  color: var(--muted);
}

.task-hero h2 {
  margin: 4px 0 0;
  font-size: 24px;
}

.task-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 6px;
}

.task-kpis div,
.task-metric-list div,
.task-detail-grid div {
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.86);
  padding: 12px;
  min-width: 0;
  box-shadow: 0 6px 16px rgba(37, 99, 111, 0.035);
}

.task-kpis span,
.task-metric-list span,
.task-detail-grid span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.task-kpis strong,
.task-metric-list strong,
.task-detail-grid strong {
  display: block;
  margin-top: 6px;
  font-size: 21px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-module-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(152px, 1fr));
  gap: 8px;
  margin: 10px 0;
}

.task-module-card {
  min-width: 0;
  min-height: 82px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 4px 8px;
  align-content: start;
  align-items: center;
  text-align: left;
  border-color: var(--line);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.76), rgba(255, 255, 255, 0.96) 42%),
    #fff;
  padding: 10px;
  box-shadow: var(--shadow-soft);
}

.task-module-card span {
  width: 32px;
  height: 26px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(79, 91, 213, 0.18);
  border-radius: 999px;
  background: rgba(79, 91, 213, 0.08);
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
}

.task-module-card strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 15px;
}

.task-module-card b {
  justify-self: end;
  font-size: 20px;
  line-height: 1.1;
}

.task-module-card em {
  grid-column: 1 / -1;
  overflow: hidden;
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-module-card.active {
  border-color: var(--accent);
  background:
    linear-gradient(180deg, rgba(238, 242, 255, 0.92), rgba(255, 255, 255, 0.98) 46%),
    #fff;
  box-shadow: 0 0 0 3px rgba(79, 91, 213, 0.12), var(--shadow-soft);
}

.task-module-card.active span {
  background: var(--accent);
  color: #fff;
}

.task-layout {
  display: grid;
  grid-template-columns: minmax(560px, 7fr) minmax(300px, 3fr);
  gap: 14px;
  align-items: start;
}

.task-list-panel,
.task-detail-panel {
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.72), rgba(255, 255, 255, 0.94) 36%),
    var(--panel-solid);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow);
  min-width: 0;
}

.task-list-head {
  height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 14px;
  border-bottom: 1px solid var(--line);
}

.task-list-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

.task-card-list {
  display: grid;
  gap: 14px;
  padding: 12px;
  max-height: calc(100vh - 330px);
  overflow: auto;
}

.task-card-group {
  display: grid;
  gap: 8px;
}

.task-card-group-collapsible {
  border-top: 1px solid var(--line);
  padding-top: 8px;
}

.task-card-group-collapsible summary {
  display: block;
  list-style: none;
  cursor: pointer;
}

.task-card-group-collapsible summary::-webkit-details-marker {
  display: none;
}

.task-card-group-collapsible:not([open]) .task-card-group-head {
  min-height: 42px;
  padding: 4px 8px;
  border: 1px dashed var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.58);
}

.task-card-group-collapsible:not([open]) .task-card-group-head::after {
  content: "展开";
  flex: 0 0 auto;
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
}

.task-card-group-collapsible[open] .task-card-group-body {
  margin-top: 8px;
}

.task-card-group-head {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 2px;
}

.task-card-group-head div {
  min-width: 0;
}

.task-card-group-head strong,
.task-card-group-head span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-card-group-head strong {
  font-size: 14px;
}

.task-card-group-head span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.task-card-group-head b {
  flex: 0 0 auto;
  min-width: 42px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 12px;
}

.task-card-group-body {
  display: grid;
  gap: 10px;
}

.task-group-empty {
  min-height: 54px;
  display: grid;
  place-items: center;
  border: 1px dashed var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.62);
  color: var(--muted);
  font-size: 13px;
}

.task-card {
  width: 100%;
  height: auto;
  min-height: 132px;
  text-align: left;
  display: grid;
  gap: 8px;
  align-content: start;
  border-color: var(--line);
  border-radius: var(--radius-control);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.66), rgba(255, 255, 255, 0.96) 40%),
    #fff;
  padding: 12px;
  box-shadow: var(--shadow-soft);
}

.task-card.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 91, 213, 0.12), var(--shadow-soft);
}

.task-card-top,
.task-card-foot,
.task-card-meta,
.task-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.task-card strong {
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-type,
.task-card-meta,
.task-card-foot {
  color: var(--muted);
  font-size: 12px;
}

.task-card-meta span,
.task-card-foot span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-card-foot b {
  display: inline-flex;
  margin-left: 4px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #fff1f1;
  color: var(--danger);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.task-manager-workspace {
  display: grid;
  gap: 12px;
}

.task-manager-workspace-head,
.task-manager-focus,
.task-manager-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.72), rgba(255, 255, 255, 0.94) 36%),
    var(--panel-solid);
  box-shadow: var(--shadow);
}

.task-manager-workspace-head {
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
}

.task-manager-workspace-head span,
.task-manager-workspace-head h2 {
  display: block;
  margin: 0;
}

.task-manager-workspace-head span,
.task-manager-section-head span,
.task-manager-intervention-main > p,
.task-manager-bottleneck span,
.task-manager-department-list span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.task-manager-workspace-head h2 {
  margin-top: 2px;
  font-size: 21px;
}

.task-manager-focus {
  min-height: 94px;
  display: flex;
  align-items: center;
  padding: 16px 20px;
  border-color: rgba(79, 91, 213, 0.38);
  background:
    linear-gradient(120deg, rgba(79, 91, 213, 0.97), rgba(101, 93, 205, 0.89)),
    var(--accent);
  color: #fff;
}

.task-manager-focus span,
.task-manager-focus strong,
.task-manager-focus p {
  display: block;
  margin: 0;
}

.task-manager-focus span {
  color: rgba(255, 255, 255, 0.76);
  font-size: 12px;
  font-weight: 800;
}

.task-manager-focus strong {
  margin-top: 3px;
  font-size: 23px;
  line-height: 1.25;
}

.task-manager-focus p {
  margin-top: 4px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
}

.task-manager-signal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.task-manager-signal-grid > div {
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: var(--shadow-soft);
}

.task-manager-signal-grid span,
.task-manager-signal-grid strong {
  display: block;
}

.task-manager-signal-grid span {
  color: var(--muted);
  font-size: 12px;
}

.task-manager-signal-grid strong {
  margin-top: 4px;
  color: var(--text);
  font-size: 24px;
  line-height: 1;
}

.task-manager-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 360px);
  gap: 14px;
  align-items: start;
}

.task-manager-panel {
  padding: 12px;
}

.task-manager-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 1px 1px 10px;
  border-bottom: 1px solid var(--line);
}

.task-manager-section-head h3 {
  margin: 0;
  color: var(--text);
  font-size: 16px;
}

.task-manager-intervention-list,
.task-manager-bottleneck-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.task-manager-intervention-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(210px, 244px);
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.82);
  padding: 10px;
}

.task-manager-intervention-row.priority-urgent,
.task-manager-intervention-row.priority-high {
  border-color: rgba(241, 139, 51, 0.4);
}

.task-manager-intervention-row:focus {
  outline: 0;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 91, 213, 0.12);
}

.task-manager-intervention-main,
.task-manager-intervention-actions {
  min-width: 0;
}

.task-manager-intervention-meta,
.task-manager-risk-list,
.task-manager-risk-list > span,
.task-manager-intervention-actions,
.task-manager-priority-editor {
  display: flex;
  align-items: center;
  gap: 6px;
}

.task-manager-intervention-meta {
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 11px;
}

.task-manager-intervention-main > strong {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  color: var(--text);
  font-size: 14px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-manager-intervention-main > p {
  margin: 3px 0 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-manager-risk-list {
  flex-wrap: wrap;
  margin-top: 7px;
}

.task-manager-risk-list > span {
  min-width: 0;
}

.task-manager-risk-list em {
  overflow: hidden;
  color: #6d4d26;
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-manager-intervention-deadline {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.task-manager-intervention-actions {
  display: grid;
  justify-items: start;
  gap: 7px;
}

.task-manager-action-guidance {
  display: grid;
  gap: 2px;
  width: 100%;
}

.task-manager-action-guidance strong {
  color: var(--text);
  font-size: 12px;
}

.task-manager-action-guidance span {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.task-manager-action-primary,
.task-manager-more-actions-body {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  width: 100%;
}

.task-manager-more-actions {
  width: 100%;
}

.task-manager-more-actions summary {
  width: fit-content;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 800;
}

.task-manager-more-actions[open] summary {
  margin-bottom: 7px;
}

.task-manager-more-actions-body {
  align-items: stretch;
  padding-top: 7px;
  border-top: 1px solid var(--line);
}

.task-manager-remind-note,
.task-manager-remind-note input {
  width: 100%;
}

.task-manager-remind-note > span {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.task-manager-remind-note input,
.task-manager-priority-editor select {
  min-height: 34px;
}

.task-manager-intervention-actions .task-inline-action-bar {
  justify-content: flex-start;
}

.task-manager-intervention-actions .task-inline-action-bar button,
.task-manager-priority-editor button {
  min-height: 34px;
  padding: 6px 9px;
  font-size: 12px;
}

.task-manager-priority-editor {
  width: 100%;
}

.task-manager-priority-editor select {
  min-width: 0;
  flex: 1 1 auto;
}

.task-manager-intervention-actions .task-action-feedback {
  min-height: 0;
}

.task-manager-bottleneck {
  display: grid;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.8);
  padding: 10px;
}

.task-manager-bottleneck.is-pool {
  border-color: rgba(241, 139, 51, 0.35);
  background: rgba(255, 248, 238, 0.72);
}

.task-manager-bottleneck > div:first-child {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.task-manager-bottleneck strong,
.task-manager-bottleneck span {
  min-width: 0;
}

.task-manager-bottleneck p {
  margin: 0;
  color: #6d4d26;
  font-size: 12px;
}

.task-manager-load-track {
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(79, 91, 213, 0.12);
}

.task-manager-load-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #c46d6d;
}

.task-manager-department-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.task-manager-department-list > div {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.78);
  padding: 9px 10px;
}

.task-manager-department-list strong {
  flex: 1 0 100%;
  color: var(--text);
  font-size: 13px;
}

.task-manager-secondary-links {
  padding-bottom: 2px;
}

.task-suggestion-inbox {
  width: min(900px, calc(100vw - 32px));
  max-height: min(760px, calc(100vh - 32px));
  display: flex;
  flex-direction: column;
}

.task-suggestion-inbox .modal-head {
  align-items: flex-start;
}

.task-suggestion-inbox .modal-head span {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.task-suggestion-inbox .modal-body {
  display: grid;
  gap: 12px;
  overflow: auto;
}

.task-suggestion-inbox-tabs,
.task-suggestion-inbox-toolbar,
.task-suggestion-inbox-toolbar > div,
.task-suggestion-inbox-row,
.task-suggestion-inbox-row > div:first-of-type,
.task-suggestion-inbox-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.task-suggestion-inbox-tabs {
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.task-suggestion-inbox-tabs button {
  min-height: 34px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.task-suggestion-inbox-tabs button.active {
  border-radius: var(--radius-control);
  background: rgba(79, 91, 213, 0.1);
  color: var(--accent);
}

.task-suggestion-inbox-tabs b {
  margin-left: 4px;
  color: inherit;
}

.task-suggestion-inbox-toolbar {
  flex-wrap: wrap;
  justify-content: space-between;
}

.task-suggestion-inbox-toolbar > label {
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
}

.task-suggestion-inbox-note {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: min(100%, 250px);
}

.task-suggestion-inbox-note input {
  min-height: 34px;
  min-width: 0;
  flex: 1 1 auto;
}

.task-suggestion-inbox-toolbar > div {
  flex-wrap: wrap;
}

.task-suggestion-inbox-list {
  display: grid;
  gap: 8px;
}

.task-suggestion-inbox-row {
  align-items: flex-start;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.78);
  padding: 10px;
}

.task-suggestion-inbox-check {
  flex: 0 0 auto;
  padding-top: 3px;
}

.task-suggestion-inbox-content {
  min-width: 0;
  flex: 1 1 auto;
}

.task-suggestion-inbox-content > div:first-child {
  justify-content: flex-start;
  min-width: 0;
}

.task-suggestion-inbox-content strong {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-suggestion-inbox-content span,
.task-suggestion-inbox-content p {
  display: block;
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.task-suggestion-inbox-content p {
  color: #53646e;
}

.task-suggestion-inbox-actions {
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.task-suggestion-inbox-actions a {
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.task-suggestion-inbox-actions a:hover {
  color: var(--accent);
  text-decoration: underline;
}

.task-employee-workspace {
  display: grid;
  gap: 12px;
}

.task-employee-workspace-head {
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.72), rgba(255, 255, 255, 0.94) 36%),
    var(--panel-solid);
  box-shadow: var(--shadow);
}

.task-employee-workspace-head span,
.task-employee-workspace-head h2 {
  display: block;
  margin: 0;
}

.task-employee-workspace-head span {
  color: var(--muted);
  font-size: 12px;
}

.task-employee-workspace-head h2 {
  margin-top: 2px;
  font-size: 21px;
}

.task-workspace-switch {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.82);
}

.task-workspace-switch button,
.task-employee-text-link {
  min-height: 30px;
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 800;
}

.task-workspace-switch button {
  border: 0;
  background: transparent;
}

.task-workspace-switch button.active {
  background: rgba(79, 91, 213, 0.1);
  color: var(--accent);
}

.task-employee-execution-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 14px;
  align-items: start;
}

.task-employee-current,
.task-employee-next,
.task-employee-summary {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.72), rgba(255, 255, 255, 0.94) 36%),
    var(--panel-solid);
  box-shadow: var(--shadow);
}

.task-employee-current {
  padding: 14px;
}

.task-employee-next,
.task-employee-summary {
  padding: 12px;
}

.task-employee-section-head,
.task-employee-current-top,
.task-employee-current-meta,
.task-employee-secondary-links,
.task-inline-action-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.task-employee-section-head h3,
.task-employee-current h3 {
  margin: 0;
  color: var(--text);
  font-size: 16px;
  line-height: 1.35;
}

.task-employee-section-head span,
.task-employee-next-row span,
.task-employee-summary p,
.task-inline-evidence small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.task-employee-section-head b {
  flex: 0 0 auto;
  min-width: 28px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 12px;
}

.task-employee-current-top {
  align-items: flex-start;
  margin-bottom: 12px;
}

.task-employee-current-meta {
  justify-content: flex-start;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 12px;
}

.task-employee-deadline {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.84);
  padding: 4px 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.task-employee-requirement,
.task-employee-risks {
  margin: 0 0 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: var(--panel-tint);
  padding: 9px 11px;
  color: #35444d;
  font-size: 13px;
  line-height: 1.55;
}

.task-employee-requirement strong,
.task-employee-risks strong {
  color: var(--text);
}

.task-employee-requirement p {
  margin: 4px 0 0;
  white-space: pre-wrap;
}

.task-employee-risks {
  border-color: rgba(241, 139, 51, 0.28);
  background: rgba(255, 248, 238, 0.86);
}

.task-employee-next-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.task-employee-next-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.82);
  padding: 9px;
}

.task-employee-next-row[data-task-employee-next-selected="true"] {
  border-color: rgba(20, 160, 152, 0.5);
  background: rgba(237, 251, 249, 0.9);
}

.task-employee-next-context {
  flex: 1 0 100%;
  border-top: 1px solid rgba(20, 160, 152, 0.18);
  padding-top: 8px;
}

.task-employee-next-context > span {
  color: var(--muted);
  font-size: 12px;
}

.task-employee-next-row.priority-urgent,
.task-employee-next-row.priority-high {
  border-color: rgba(241, 139, 51, 0.36);
}

.task-employee-next-row > div,
.task-employee-next-row strong {
  min-width: 0;
}

.task-employee-next-row strong {
  display: block;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-employee-next-row small {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
}

.task-employee-next-row em {
  max-width: 92px;
  overflow: hidden;
  color: #b45309;
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-employee-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.task-employee-summary p {
  min-height: 18px;
  margin-bottom: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-employee-text-link {
  min-height: auto;
  padding: 2px 0;
  border: 0;
  background: transparent;
  text-align: left;
}

.task-employee-text-link:hover {
  color: var(--accent);
  text-decoration: underline;
}

.task-employee-secondary-links {
  justify-content: flex-start;
  flex-wrap: wrap;
  padding: 0 2px;
}

.task-inline-action-form {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.task-employee-action-panel {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(79, 91, 213, 0.3);
  border-radius: var(--radius-control);
  background: rgba(240, 241, 255, 0.68);
  padding: 10px;
}

.task-employee-action-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.task-employee-action-heading strong {
  color: var(--text);
  font-size: 13px;
}

.task-employee-action-heading span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  text-align: right;
}

.task-employee-action-panel .task-inline-action-bar {
  gap: 10px;
}

.task-inline-action-form label,
.task-inline-evidence {
  display: grid;
  gap: 5px;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
}

.task-inline-action-form textarea {
  width: 100%;
  resize: vertical;
}

.task-inline-evidence {
  border: 1px dashed var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.7);
  padding: 9px;
}

.task-inline-evidence input {
  width: 100%;
  font-weight: 400;
}

.task-inline-action-bar {
  justify-content: flex-start;
  flex-wrap: wrap;
}

.task-inline-action-bar button {
  min-height: 40px;
}

.task-action-feedback {
  min-height: 18px;
  color: var(--danger);
  font-size: 12px;
  line-height: 1.4;
}

.task-employee-head {
  height: auto;
  min-height: 58px;
}

.task-employee-head > div:first-child {
  min-width: 0;
}

.task-employee-head strong,
.task-employee-head span {
  display: block;
}

.task-employee-head span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.task-employee-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
}

.task-employee-kpi-grid .task-metric-list,
.task-employee-kpi-grid div {
  min-width: 0;
}

.task-employee-kpi-grid > div {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
}

.task-employee-kpi-grid span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.task-employee-kpi-grid strong {
  display: block;
  margin-top: 4px;
  font-size: 20px;
}

.task-workbench-section {
  display: grid;
  gap: 8px;
}

.task-workbench-section-collapsible {
  border-top: 1px solid var(--line);
  padding-top: 8px;
}

.task-workbench-section-collapsible summary {
  display: block;
  list-style: none;
  cursor: pointer;
}

.task-workbench-section-collapsible summary::-webkit-details-marker {
  display: none;
}

.task-workbench-section-collapsible:not([open]) .task-workbench-section-head {
  min-height: 42px;
  padding: 6px 8px;
  border: 1px dashed var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.64);
}

.task-workbench-section-collapsible:not([open]) .task-workbench-section-head::after {
  content: "展开";
  flex: 0 0 auto;
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}

.task-workbench-section-collapsible[open] .task-workbench-card-list {
  margin-top: 8px;
}

.task-workbench-section-head {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.task-workbench-section-head div {
  min-width: 0;
}

.task-workbench-section-head strong,
.task-workbench-section-head span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-kpis div {
  min-height: 50px;
  display: grid;
  align-content: center;
  padding: 6px 8px;
}

.task-kpis span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-kpis strong {
  margin-top: 2px;
  font-size: 18px;
}

.task-workbench-section-head span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.task-workbench-section-head b {
  flex: 0 0 auto;
  min-width: 42px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 12px;
}

.task-workbench-card-list {
  display: grid;
  gap: 8px;
}

.task-workbench-card {
  width: 100%;
  min-width: 0;
  min-height: 116px;
  display: grid;
  gap: 8px;
  align-content: start;
  text-align: left;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.66), rgba(255, 255, 255, 0.96) 40%),
    #fff;
  box-shadow: var(--shadow-soft);
}

.task-workbench-card.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 91, 213, 0.12), var(--shadow-soft);
}

.task-workbench-card.priority-urgent {
  border-color: rgba(224, 72, 72, 0.34);
}

.task-workbench-card.priority-high {
  border-color: rgba(241, 139, 51, 0.36);
}

.task-workbench-card-top,
.task-workbench-card-foot,
.task-workbench-card-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.task-workbench-card-top {
  justify-content: flex-start;
}

.task-workbench-card-foot {
  justify-content: space-between;
}

.task-workbench-card strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 15px;
}

.task-workbench-card-top > span,
.task-workbench-card-meta,
.task-workbench-card-foot {
  color: var(--muted);
  font-size: 12px;
}

.task-workbench-card-meta span,
.task-workbench-card-foot span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-workbench-card-foot small {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 4px;
}

.task-workbench-card-foot b {
  display: inline-flex;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(224, 72, 72, 0.1);
  color: var(--danger);
  font-size: 12px;
}

.task-assigner-layout {
  display: grid;
  grid-template-columns: minmax(640px, 7fr) minmax(300px, 3fr);
  gap: 14px;
  align-items: start;
}

.task-assigner-main {
  min-width: 0;
  display: grid;
  gap: 12px;
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.72), rgba(255, 255, 255, 0.94) 36%),
    var(--panel-solid);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.task-assigner-kpis {
  border-bottom: 0;
  padding-bottom: 0;
}

.task-assigner-board {
  display: grid;
  gap: 8px;
  padding: 0 12px;
}

.task-assigner-group-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(248px, 1fr));
  gap: 10px;
  max-height: 340px;
  overflow: auto;
}

.task-assigner-group {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.84);
}

.task-assigner-group.is-risk {
  border-color: rgba(224, 72, 72, 0.34);
  background: rgba(255, 247, 247, 0.86);
}

.task-assigner-gantt {
  display: grid;
  gap: 8px;
  padding: 0 12px 12px;
}

.task-assigner-gantt-legend {
  justify-content: flex-end;
}

.task-assigner-gantt-axis {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
  padding-left: 210px;
  color: var(--muted);
  font-size: 12px;
}

.task-assigner-gantt-axis span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-assigner-gantt-list {
  display: grid;
  gap: 8px;
  max-height: 420px;
  overflow: auto;
}

.task-assigner-gantt-group {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.82);
}

.task-assigner-gantt-group.is-risk {
  border-color: rgba(224, 72, 72, 0.34);
  background: rgba(255, 247, 247, 0.86);
}

.task-assigner-gantt-person {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.task-assigner-gantt-person strong,
.task-assigner-gantt-person span,
.task-assigner-gantt-person em {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-assigner-gantt-person span,
.task-assigner-gantt-person em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.task-assigner-gantt-rows {
  display: grid;
  gap: 6px;
}

.task-assigner-gantt-row {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(190px, 0.9fr) minmax(220px, 1.4fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(248, 251, 255, 0.78);
  text-align: left;
}

.task-assigner-gantt-row strong,
.task-assigner-gantt-row span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-assigner-gantt-row span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.task-assigner-main > .task-workbench-section {
  padding: 0 12px 12px;
}

.task-assigner-main > .task-workbench-section + .task-workbench-section {
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.task-assigner-archive {
  display: grid;
  gap: 8px;
  padding: 0 12px 12px;
  border-top: 1px solid var(--line);
  padding-top: 8px;
}

.task-assigner-archive-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.task-assigner-archive-metrics span {
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--muted);
  font-size: 12px;
}

.task-assigner-archive-metrics b {
  display: block;
  margin-top: 3px;
  color: var(--text);
  font-size: 17px;
}

.task-assigner-archive-list {
  display: grid;
  gap: 8px;
}

.task-assigner-archive-card {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
  text-align: left;
}

.task-assigner-archive-card.is-late {
  border-color: rgba(224, 72, 72, 0.34);
  background: rgba(255, 247, 247, 0.86);
}

.task-assigner-archive-card strong,
.task-assigner-archive-card span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-assigner-archive-card span,
.task-assigner-archive-card em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.task-assigner-archive-card b {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  background: rgba(13, 148, 136, 0.12);
  color: #0f766e;
  font-size: 12px;
}

.task-assigner-archive-card.is-late b {
  background: rgba(224, 72, 72, 0.12);
  color: #c0262d;
}

.task-detail-panel {
  padding: 14px;
  position: sticky;
  top: 86px;
}

.task-detail-head {
  align-items: flex-start;
  margin-bottom: 12px;
}

.task-detail-meta-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.task-detail-meta-line span {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-detail-meta-line b {
  flex: 0 0 auto;
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(79, 91, 213, 0.08);
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.task-detail-head h3 {
  display: -webkit-box;
  margin: 4px 0 0;
  overflow: hidden;
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1.28;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  word-break: break-word;
}

.task-detail-head > div {
  min-width: 0;
}

.task-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.task-layout > .task-detail-panel .task-detail-grid,
.task-assigner-layout > .task-detail-panel .task-detail-grid,
.task-admin-workbench > .task-detail-panel .task-detail-grid {
  grid-template-columns: 1fr;
}

.task-detail-grid div {
  min-height: 64px;
  display: grid;
  align-content: center;
  padding: 9px 12px;
}

.task-detail-grid strong {
  font-size: 14px;
  line-height: 1.35;
}

.task-description {
  margin: 10px 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: var(--panel-tint);
  padding: 10px 12px;
  color: #35444d;
  line-height: 1.55;
  white-space: pre-wrap;
}

.task-evidence-operator-package {
  display: grid;
  gap: 10px;
  margin: 10px 0;
  border: 1px solid #bfdbfe;
  border-radius: var(--radius-control);
  background: #f8fbff;
  padding: 12px;
}

.task-evidence-operator-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.task-evidence-operator-head strong {
  color: #0f172a;
  font-size: 15px;
  font-weight: 900;
}

.task-evidence-operator-head span {
  max-width: 60%;
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
  text-align: right;
}

.task-evidence-operator-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.task-evidence-operator-grid article {
  display: grid;
  gap: 7px;
  min-width: 0;
  border: 1px solid #dbeafe;
  border-radius: var(--radius-control);
  background: #fff;
  padding: 10px;
}

.task-evidence-operator-grid article > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.task-evidence-operator-grid strong {
  min-width: 0;
  color: #111827;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.3;
}

.task-evidence-operator-grid em {
  flex: 0 0 auto;
  max-width: 52%;
  border-radius: 999px;
  background: #e0f2fe;
  padding: 2px 7px;
  color: #075985;
  overflow: hidden;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-evidence-operator-grid p,
.task-evidence-operator-grid span {
  margin: 0;
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
  word-break: break-word;
}

.task-evidence-operator-grid span {
  color: #334155;
}

.task-evidence-source-audit {
  display: grid;
  gap: 8px;
  margin: 10px 0;
  border: 1px solid #d1d5db;
  border-radius: var(--radius-control);
  background: #fff;
  padding: 10px 12px;
}

.task-evidence-source-audit > strong {
  color: #111827;
  font-size: 14px;
  font-weight: 900;
}

.task-evidence-source-audit > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.task-evidence-source-audit span {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid #e5e7eb;
  border-radius: var(--radius-control);
  background: #f9fafb;
  padding: 8px 10px;
  color: #475569;
  font-size: 12px;
  line-height: 1.4;
  word-break: break-word;
}

.task-evidence-source-audit b {
  color: #111827;
  font-size: 13px;
}

.task-evidence-source-audit em {
  width: fit-content;
  border-radius: 999px;
  background: #fef3c7;
  padding: 2px 7px;
  color: #92400e;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.task-evidence-source-audit p {
  margin: 0;
  color: #334155;
  font-size: 12px;
  line-height: 1.45;
}

.task-evidence-forbidden {
  display: grid;
  gap: 5px;
  margin: 0;
  border: 1px solid #fecaca;
  border-radius: var(--radius-control);
  background: #fff7f7;
  padding: 9px 12px 9px 26px;
  color: #991b1b;
  font-size: 12px;
  line-height: 1.45;
}

.task-evidence-source-assets {
  display: grid;
  gap: 8px;
  margin: 10px 0;
  border: 1px solid #bfdbfe;
  border-radius: var(--radius-control);
  background: #eff6ff;
  padding: 10px 12px;
}

.task-evidence-source-assets > strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.task-evidence-source-assets > span,
.task-evidence-source-assets > p {
  margin: 0;
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
}

.task-evidence-source-assets .msw-l2-step-actions {
  justify-content: flex-start;
}

@media (max-width: 760px) {
  .task-evidence-operator-head {
    display: grid;
  }

  .task-evidence-operator-head span {
    max-width: none;
    text-align: left;
  }

  .task-evidence-operator-grid {
    grid-template-columns: 1fr;
  }

  .task-evidence-source-audit > div {
    grid-template-columns: 1fr;
  }
}

.task-attachments {
  margin: 0 0 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: #fff;
  padding: 10px 12px;
}

.task-attachments h4 {
  margin: 0 0 8px;
  font-size: 14px;
}

.task-attachment-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.task-attachment-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}

.task-attachment-image-card {
  position: relative;
  min-width: 0;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: #fff;
  overflow: hidden;
  box-shadow: var(--shadow-soft);
}

.task-attachment-image-card > button:not(.task-attachment-delete) {
  width: 100%;
  aspect-ratio: 4 / 3;
  display: block;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #f8fafc;
  overflow: hidden;
}

.task-attachment-image-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.task-attachment-image-card figcaption {
  min-height: 34px;
  display: flex;
  align-items: center;
  padding: 6px 8px;
  border-top: 1px solid var(--line);
}

.task-attachment-image-card a {
  min-width: 0;
  overflow: hidden;
  color: var(--accent-dark);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-attachment-card {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: var(--panel-tint);
  padding: 0 9px;
  color: var(--accent-dark);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-attachment-file-wrap {
  position: relative;
  display: inline-flex;
  max-width: 100%;
}

.task-attachment-delete {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 26px;
  height: 26px;
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(224, 72, 72, 0.4);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #c0262d;
  font-size: 18px;
  line-height: 1;
  box-shadow: var(--shadow-soft);
  z-index: 2;
}

.task-attachment-file-wrap .task-attachment-delete {
  top: -9px;
  right: -9px;
}

.task-attachment-delete:hover {
  border-color: rgba(224, 72, 72, 0.8);
  background: #fff7f7;
}

.task-attachment-delete:disabled {
  cursor: wait;
  opacity: 0.6;
}

.task-attachment-card.with-preview {
  gap: 8px;
  width: min(100%, 280px);
  min-height: 74px;
  padding: 6px;
  background: #fff;
}

.task-attachment-thumb {
  flex: 0 0 62px;
  width: 62px;
  height: 62px;
  min-height: 62px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  overflow: hidden;
}

.task-attachment-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.task-attachment-link {
  min-width: 0;
  overflow: hidden;
  color: var(--accent-dark);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

.task-actions button {
  min-height: 34px;
  padding: 0 13px;
}

.task-suggestion-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(241, 139, 51, 0.32);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(255, 250, 242, 0.94), rgba(255, 255, 255, 0.96)),
    #fff;
  box-shadow: var(--shadow-soft);
}

.task-suggestion-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.task-suggestion-head strong,
.task-suggestion-card strong {
  display: block;
  color: var(--text);
}

.task-suggestion-head span,
.task-suggestion-card span {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.task-suggestion-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
}

.task-suggestion-card,
.task-suggestion-more {
  min-width: 0;
  min-height: 64px;
  display: grid;
  align-items: center;
  gap: 8px;
  text-align: left;
  border: 1px solid rgba(241, 139, 51, 0.28);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.88);
}

.task-suggestion-card {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 9px 10px;
}

.task-suggestion-card:hover,
.task-suggestion-more:hover {
  border-color: #f18b33;
  box-shadow: 0 0 0 3px rgba(241, 139, 51, 0.1);
}

.task-suggestion-card strong,
.task-suggestion-card span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-suggestion-card em {
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(241, 139, 51, 0.14);
  color: #b85c00;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}

.task-suggestion-more {
  justify-content: center;
  padding: 0 12px;
  color: #b85c00;
  font-weight: 800;
}

.task-auto-sync-modal {
  max-width: 760px;
}

.task-auto-sync-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.task-auto-sync-head span {
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.task-auto-sync-list {
  display: grid;
  gap: 8px;
  max-height: min(56vh, 520px);
  overflow: auto;
}

.task-auto-candidate {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: #fff;
  padding: 12px;
}

.task-auto-candidate input {
  margin-top: 2px;
}

.task-auto-candidate span {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.task-auto-candidate strong,
.task-auto-candidate em,
.task-auto-candidate small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-auto-candidate strong b {
  display: inline-block;
  margin-right: 6px;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(241, 139, 51, 0.14);
  color: #b85c00;
  font-size: 12px;
}

.task-auto-candidate em,
.task-auto-candidate small {
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
}

.task-timeline h4 {
  margin: 0 0 8px;
}

.task-event {
  display: grid;
  grid-template-columns: 104px 64px 1fr;
  gap: 8px;
  align-items: start;
  border-top: 1px solid var(--line);
  padding: 8px 0;
}

.task-event span,
.task-event p {
  margin: 0;
  color: var(--muted);
}

.task-stats-grid {
  display: grid;
  grid-template-columns: minmax(260px, 0.8fr) minmax(300px, 1fr);
  gap: 14px;
}

.task-stats-grid .panel:last-child {
  grid-column: 1 / -1;
}

.task-metric-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
}

.task-admin-review {
  display: grid;
  gap: 14px;
}

.task-admin-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.task-admin-kpis > div {
  min-height: 78px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.74), rgba(255, 255, 255, 0.96) 42%),
    #fff;
  box-shadow: var(--shadow-soft);
}

.task-admin-kpis span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.task-admin-kpis strong {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 24px;
}

.task-admin-overview-grid {
  display: grid;
  grid-template-columns: minmax(520px, 1.35fr) minmax(320px, 0.65fr);
  gap: 14px;
  align-items: stretch;
}

.task-admin-employee-board,
.task-admin-archive,
.task-admin-gantt-panel {
  min-width: 0;
}

.task-admin-employee-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px;
  padding: 12px;
  max-height: 440px;
  overflow: auto;
}

.task-admin-employee-card {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.84);
}

.task-admin-employee-card.is-risk {
  border-color: rgba(224, 72, 72, 0.34);
  background: rgba(255, 247, 247, 0.86);
}

.task-admin-employee-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.task-admin-employee-head strong,
.task-admin-employee-head span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-admin-employee-head strong {
  color: var(--text);
}

.task-admin-employee-head span,
.task-admin-employee-head em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.task-admin-employee-head em {
  flex: 0 0 auto;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(79, 91, 213, 0.08);
  color: var(--accent);
  font-weight: 700;
}

.task-admin-employee-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.task-admin-employee-metrics span {
  min-width: 0;
  padding: 6px;
  border-radius: 8px;
  background: rgba(241, 247, 253, 0.9);
  color: var(--muted);
  font-size: 12px;
}

.task-admin-employee-metrics b {
  color: var(--text);
}

.task-admin-employee-tasks {
  display: grid;
  gap: 6px;
}

.task-admin-employee-task,
.task-admin-gantt-row,
.task-admin-archive-list button {
  width: 100%;
  min-width: 0;
  text-align: left;
}

.task-admin-employee-task {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 6px;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.task-admin-employee-task.is-overdue {
  border-color: rgba(224, 72, 72, 0.42);
}

.task-admin-employee-task span,
.task-admin-employee-task small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-admin-employee-task small {
  grid-column: 1 / 2;
  color: var(--muted);
  font-size: 12px;
}

.task-priority-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(79, 91, 213, 0.08);
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.5;
}

.task-priority-chip.urgent {
  background: rgba(224, 72, 72, 0.12);
  color: #c0262d;
}

.task-priority-chip.high {
  background: rgba(241, 139, 51, 0.14);
  color: #b85c00;
}

.task-priority-chip.low {
  background: rgba(100, 116, 139, 0.1);
  color: #475569;
}

.task-admin-gantt-panel {
  overflow: hidden;
}

.task-admin-gantt-panel .panel-head {
  gap: 10px;
  flex-wrap: wrap;
}

.task-admin-gantt-tools {
  min-width: 0;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.task-gantt-filters {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.task-gantt-filters select {
  min-width: 132px;
  max-width: 190px;
  height: 32px;
  padding: 0 28px 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--text);
  font-size: 12px;
}

.task-gantt-filter-reset {
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  font-weight: 700;
}

.task-gantt-filter-reset:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.task-gantt-filter-count {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.task-admin-legend {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.task-admin-legend span {
  padding: 3px 7px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.task-admin-legend .urgent {
  background: rgba(241, 139, 51, 0.14);
  color: #b85c00;
}

.task-admin-legend .overdue {
  background: rgba(224, 72, 72, 0.12);
  color: #c0262d;
}

.task-admin-legend .done {
  background: rgba(13, 148, 136, 0.12);
  color: #0f766e;
}

.task-admin-gantt-axis {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
  padding: 10px 12px 6px 252px;
  color: var(--muted);
  font-size: 12px;
}

.task-admin-gantt-axis span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-admin-gantt-list {
  display: grid;
  gap: 6px;
  padding: 0 12px 12px;
  max-height: 430px;
  overflow: auto;
}

.task-admin-gantt-row {
  display: grid;
  grid-template-columns: 106px minmax(120px, 1fr) minmax(220px, 2fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
}

.task-admin-gantt-row strong,
.task-admin-gantt-row span,
.task-admin-gantt-row em {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-admin-gantt-row span,
.task-admin-gantt-row em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.task-admin-gantt-track {
  position: relative;
  height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(205, 217, 232, 0.55);
}

.task-admin-gantt-track i {
  position: absolute;
  top: 0;
  bottom: 0;
  border-radius: inherit;
  background: var(--accent);
}

.task-admin-gantt-track i.urgent,
.task-admin-gantt-track i.high {
  background: #f18b33;
}

.task-admin-gantt-track i.overdue {
  background: #e04848;
}

.task-admin-gantt-track i.done {
  background: #0d9488;
}

.task-admin-gantt-track i.low {
  background: #64748b;
}

.task-admin-archive {
  display: grid;
  gap: 12px;
}

.task-admin-archive-bar {
  display: flex;
  height: 14px;
  margin: 12px 12px 0;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(205, 217, 232, 0.55);
}

.task-admin-archive-bar i.done {
  background: #0d9488;
}

.task-admin-archive-bar i.open {
  background: #4f5bd5;
}

.task-admin-archive-bar i.cancel {
  background: #94a3b8;
}

.task-admin-archive-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 8px;
  padding: 0 12px;
}

.task-admin-archive-metrics span {
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--muted);
  font-size: 12px;
}

.task-admin-archive-metrics b {
  display: block;
  margin-top: 3px;
  color: var(--text);
  font-size: 18px;
}

.task-admin-archive-list {
  display: grid;
  gap: 6px;
  padding: 0 12px 12px;
  max-height: 194px;
  overflow: auto;
}

.task-admin-archive-list button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
}

.task-admin-archive-list span,
.task-admin-archive-list em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-admin-archive-list em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.task-admin-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.task-admin-departments {
  grid-column: 1 / -1;
}

.task-admin-load-panel,
.task-admin-critical-panel {
  grid-column: span 6;
}

.task-review-table td,
.task-review-table th {
  white-space: nowrap;
}

.task-review-table {
  min-width: 0;
  table-layout: fixed;
}

.task-review-table th:nth-child(1),
.task-review-table td:nth-child(1) {
  width: 15%;
}

.task-review-table th:nth-child(2),
.task-review-table td:nth-child(2),
.task-review-table th:nth-child(3),
.task-review-table td:nth-child(3),
.task-review-table th:nth-child(4),
.task-review-table td:nth-child(4) {
  width: 13%;
}

.task-review-table th:nth-child(5),
.task-review-table td:nth-child(5) {
  width: 22%;
}

.task-review-table th:nth-child(6),
.task-review-table td:nth-child(6) {
  width: 24%;
}

.task-review-table tr.is-risk td:first-child strong {
  color: var(--danger);
}

.task-review-progress {
  min-width: 110px;
  display: grid;
  grid-template-columns: minmax(52px, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.task-review-progress span {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(205, 217, 232, 0.72);
}

.task-review-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}

.task-review-progress b {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.task-review-assignee-list,
.task-review-critical-list {
  display: grid;
  gap: 8px;
  padding: 12px;
  max-height: 360px;
  overflow: auto;
}

.task-review-assignee,
.task-review-critical {
  min-width: 0;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.78);
}

.task-review-assignee {
  grid-template-columns: minmax(0, 1fr) minmax(120px, 0.46fr);
  align-items: center;
}

.task-review-assignee strong,
.task-review-critical strong {
  display: block;
  overflow: hidden;
  color: var(--text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-review-assignee span,
.task-review-critical span,
.task-review-critical em {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-review-assignee.is-risk {
  border-color: rgba(224, 72, 72, 0.32);
  background: rgba(255, 247, 247, 0.82);
}

.task-review-critical {
  width: 100%;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  text-align: left;
}

.task-review-critical:hover {
  border-color: var(--accent);
}

.task-review-critical small {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

.task-review-critical small b:not(.task-priority-chip) {
  min-width: 0;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(79, 91, 213, 0.08);
  color: var(--accent);
  font-size: 11px;
}

.task-admin-workbench {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(320px, 3fr);
  gap: 14px;
  align-items: start;
}

.task-admin-filters {
  display: grid;
  grid-template-columns: 130px 130px minmax(160px, 1fr) auto;
  gap: 8px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
}

.task-admin-task-list {
  display: grid;
  gap: 8px;
  max-height: 540px;
  overflow: auto;
  padding: 12px;
}

.task-admin-task-row {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 10px;
  align-items: center;
  text-align: left;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.82);
}

.task-admin-task-row.active,
.task-admin-task-row:hover {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 91, 213, 0.1);
}

.task-admin-task-row > div {
  min-width: 0;
}

.task-admin-task-row strong,
.task-admin-task-row span,
.task-admin-task-row em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-admin-task-row strong {
  color: var(--text);
}

.task-admin-task-row span,
.task-admin-task-row em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.task-admin-task-row small {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.task-admin-task-row small b:not(.task-priority-chip) {
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(79, 91, 213, 0.08);
  color: var(--accent);
  font-size: 11px;
}

.task-admin-pager {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 12px 12px;
}

.task-admin-pager span {
  color: var(--muted);
  font-size: 12px;
}

.task-admin-detail-panel {
  position: sticky;
  top: 12px;
}

.temu-return-hero {
  margin-bottom: 12px;
}

.temu-return-kpis {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.receipt-hero {
  margin-bottom: 12px;
}

.receipt-kpis {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.receipt-workbench {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(360px, 1.1fr);
  gap: 12px;
  margin-bottom: 12px;
  min-width: 0;
}

.receipt-manual,
.receipt-photo,
.receipt-result-body {
  min-width: 0;
}

.receipt-scan-box {
  display: grid;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #f8fafc;
}

.receipt-scan-head,
.receipt-scan-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.receipt-scan-head {
  justify-content: space-between;
}

.receipt-scan-head strong {
  font-size: 14px;
}

.receipt-scan-actions {
  justify-content: flex-end;
}

.receipt-scan-video {
  width: 100%;
  aspect-ratio: 4 / 3;
  max-height: 360px;
  display: block;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: #0f172a;
  object-fit: cover;
}

.success-text {
  color: #0f766e;
}

.danger-text {
  color: var(--danger);
}

.receipt-toolbar,
.receipt-inline-form {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 160px 150px;
  gap: 8px;
  padding: 12px;
}

.receipt-inline-form {
  grid-template-columns: minmax(180px, 1fr) 110px minmax(160px, 1fr) auto;
  padding: 0;
  margin-top: 10px;
}

.receipt-result {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin-top: 12px;
}

.receipt-result-media {
  min-height: 110px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  overflow: hidden;
}

.receipt-result-media img {
  width: 100%;
  height: 100%;
  max-height: 170px;
  object-fit: cover;
  display: block;
}

.receipt-list {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.receipt-card {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(150px, auto);
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.receipt-card-main,
.receipt-card-side,
.receipt-card-link {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.receipt-card-main strong {
  font-size: 16px;
  overflow-wrap: anywhere;
}

.receipt-card-main span,
.receipt-card-side span,
.receipt-card-link {
  color: var(--muted);
  font-size: 12px;
  overflow-wrap: anywhere;
}

.receipt-card-side {
  justify-items: end;
  text-align: right;
}

.receipt-card-link {
  grid-column: 1 / -1;
}

.linklike {
  width: auto;
  min-height: auto;
  justify-content: flex-start;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent-dark);
  font-weight: 700;
}

.receipt-linked-list {
  display: grid;
  gap: 8px;
}

.receipt-linked-list > div:not(.empty) {
  display: grid;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #f8fafc;
}

.receipt-linked-list span {
  color: var(--muted);
  font-size: 12px;
}

.temu-return-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 140px 130px 130px 140px 110px auto auto;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
}

.temu-return-data-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.temu-return-insight {
  min-width: 0;
  min-height: 92px;
  display: grid;
  align-content: center;
  gap: 5px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.temu-return-insight span,
.temu-return-insight small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 12px;
}

.temu-return-insight strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
}

.temu-return-analysis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.temu-return-wide-panel {
  grid-column: span 2;
}

.temu-return-bars {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.temu-return-bar {
  display: grid;
  gap: 5px;
}

.temu-return-bar div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  font-size: 12px;
}

.temu-return-bar strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-return-bar span {
  color: var(--muted);
}

.temu-return-bar i {
  display: block;
  height: 7px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--accent), #2563eb);
}

.temu-return-action-insights {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}

.temu-return-action-insights > div,
.temu-return-concentration > div,
.temu-return-risk-grid > div {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 5px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.temu-return-action-insights strong,
.temu-return-concentration strong,
.temu-return-risk-grid strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-return-action-insights span,
.temu-return-concentration span,
.temu-return-concentration em,
.temu-return-risk-grid span,
.temu-return-risk-grid em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
}

.temu-return-action-insights span {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.temu-return-concentration,
.temu-return-risk-grid {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.temu-return-concentration strong,
.temu-return-risk-grid strong {
  font-size: 18px;
}

.temu-return-buckets {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.temu-return-buckets > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.temu-return-buckets > div > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.temu-return-buckets strong,
.temu-return-buckets span,
.temu-return-buckets small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-return-buckets span,
.temu-return-buckets small {
  color: var(--muted);
  font-size: 12px;
}

.temu-return-buckets i {
  display: block;
  height: 7px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--accent), #2563eb);
}

.temu-return-action-queue {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}

.temu-return-action-queue button {
  width: 100%;
  min-width: 0;
  min-height: 96px;
  display: grid;
  gap: 7px;
  align-content: start;
  text-align: left;
  border-color: var(--line);
  background: #fff;
  padding: 12px;
}

.temu-return-action-queue button:hover {
  border-color: var(--accent);
}

.temu-return-action-queue div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.temu-return-action-queue strong,
.temu-return-action-queue span,
.temu-return-action-queue p,
.temu-return-action-queue small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-return-action-queue p,
.temu-return-action-queue small {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.temu-return-layout {
  display: grid;
  grid-template-columns: minmax(360px, 0.78fr) minmax(460px, 1.22fr);
  gap: 14px;
  align-items: start;
}

.temu-return-list-panel,
.temu-return-detail-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 12px 28px rgba(20, 33, 43, 0.04);
}

.temu-return-package-list {
  display: grid;
  gap: 10px;
  padding: 12px;
  max-height: calc(100vh - 420px);
  overflow: auto;
}

.temu-return-package {
  width: 100%;
  min-height: 118px;
  height: auto;
  display: grid;
  gap: 8px;
  align-content: start;
  text-align: left;
  border-color: var(--line);
  background: #fff;
  padding: 12px;
}

.temu-return-package.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.12);
}

.temu-return-package-top,
.temu-return-package-foot,
.temu-return-package-meta,
.temu-return-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.temu-return-package-top strong,
.temu-return-package-meta span,
.temu-return-package-foot span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.temu-return-package-meta,
.temu-return-package-foot {
  color: var(--muted);
  font-size: 12px;
}

.temu-return-package-meta > span {
  flex: 1 1 0;
}

.temu-return-package-meta > span:nth-child(2) {
  text-align: center;
}

.temu-return-package-meta > span:nth-child(3) {
  text-align: right;
}

.temu-return-waybill {
  display: grid;
  gap: 2px;
  color: var(--text);
  line-height: 1.2;
  min-width: 0;
}

.temu-return-waybill b,
.temu-return-waybill em,
.temu-return-waybill small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-style: normal;
  min-width: 0;
}

.temu-return-waybill b {
  color: var(--muted);
  font-weight: 500;
}

.temu-return-waybill em {
  font-size: 13px;
  font-weight: 700;
}

.temu-return-waybill small {
  color: var(--muted);
}

.temu-return-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.temu-return-flags b {
  border-radius: 999px;
  background: #fff7e6;
  color: var(--warn);
  padding: 2px 7px;
  font-size: 12px;
}

.temu-return-detail-panel {
  padding: 16px;
  position: sticky;
  top: 86px;
}

.temu-return-detail-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}

.temu-return-detail-head span {
  color: var(--muted);
}

.temu-return-detail-head h3 {
  margin: 5px 0 0;
  font-size: 20px;
}

.temu-return-action {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

.temu-return-action .field {
  margin-bottom: 0;
}

.temu-return-action .field.full,
.temu-return-actions {
  grid-column: 1 / -1;
}

.temu-return-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
}

.temu-return-detail-section {
  margin-top: 14px;
}

.temu-return-detail-section h4 {
  margin: 0 0 8px;
  font-size: 14px;
}

.temu-return-timeline {
  display: grid;
  gap: 8px;
}

.temu-return-timeline div {
  border-top: 1px solid var(--line);
  padding-top: 8px;
}

.temu-return-timeline span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 3px;
}

.temu-return-timeline p {
  margin: 0;
  line-height: 1.5;
}

.temu-return-raw {
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
  padding: 10px 12px;
}

.temu-return-raw pre {
  max-height: 260px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 12px;
}

.empty {
  padding: 22px;
  color: var(--muted);
  text-align: center;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 20;
  background: rgba(15, 23, 42, 0.38);
  display: grid;
  place-items: center;
  padding: 22px;
}

.modal {
  width: min(980px, 100%);
  max-height: min(760px, calc(100dvh - 24px));
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.78), rgba(255, 255, 255, 0.97) 34%),
    rgba(255, 255, 255, 0.97);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.role-editor-modal {
  width: min(1180px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
}

.role-editor-body {
  min-height: 0;
  overflow: auto;
}

.modal-head,
.modal-foot {
  min-height: 50px;
  padding: 9px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  flex-shrink: 0;
}

.modal-foot {
  border-top: 1px solid var(--line);
  border-bottom: 0;
  justify-content: flex-end;
  gap: 8px;
}

.modal-head h2 {
  margin: 0;
  font-size: 17px;
}

.ops-workflow-shell {
  display: grid;
  gap: 14px;
}

.ops-decision-toolbar { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:10px 12px; border-bottom:1px solid var(--line); background:var(--panel-tint); }
.ops-decision-toolbar input { flex:1 1 280px; min-width:180px; }
.ops-data-quality { margin-left:auto; padding:5px 9px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:11px; font-weight:700; }
.ops-data-quality.is-risk { border-color:#fed7aa; background:#fff7ed; color:#c2410c; }
.ops-data-quality.is-ok { border-color:#a7f3d0; background:#ecfdf5; color:#047857; }
.ops-decision-layout { display:grid; grid-template-columns:minmax(300px,.78fr) minmax(0,1.7fr); min-height:560px; }
.ops-decision-list { max-height:680px; overflow-y:auto; border-right:1px solid var(--line); background:#f8fafc; }
.ops-decision-row { width:100%; min-height:72px; display:grid; grid-template-columns:46px minmax(0,1fr) 34px; gap:10px; align-items:center; padding:10px 12px; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; text-align:left; }
.ops-decision-row:hover,.ops-decision-row.active { background:#fff; }
.ops-decision-row.active { box-shadow:inset 3px 0 0 var(--blue); }
.ops-decision-row> b,.ops-decision-score> b { display:inline-flex; align-items:center; justify-content:center; min-height:26px; padding:3px 7px; border-radius:6px; background:#eef2ff; color:#3730a3; font-size:11px; }
.ops-decision-row .priority-p0 { background:#fff1f2; color:#be123c; }
.ops-decision-row .priority-p1 { background:#fff7ed; color:#c2410c; }
.ops-decision-row span,.ops-decision-row strong,.ops-decision-row em { min-width:0; display:block; }
.ops-decision-row strong { overflow:hidden; color:var(--text); font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.ops-decision-row em { margin-top:4px; overflow:hidden; color:var(--muted); font-size:11px; font-style:normal; text-overflow:ellipsis; white-space:nowrap; }
.ops-decision-row> i { color:var(--text-soft); font-size:17px; font-style:normal; font-weight:800; text-align:right; }
.ops-decision-detail { min-width:0; padding:18px 20px; }
.ops-decision-detail> header { display:flex; justify-content:space-between; gap:18px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.ops-decision-detail h2,.ops-decision-detail h3,.ops-decision-detail p { margin:0; }
.ops-decision-detail header>div>span,.ops-decision-detail header p,.ops-decision-action>span { color:var(--muted); font-size:12px; }
.ops-decision-detail header h2 { margin:5px 0; font-size:19px; }
.ops-decision-score { min-width:94px; display:grid; justify-items:end; gap:3px; }
.ops-decision-score strong { color:var(--text); font-size:28px; line-height:1; }
.ops-decision-score span { color:var(--muted); font-size:11px; }
.ops-decision-metrics { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin-top:14px; }
.ops-decision-metrics>div { padding:10px; border:1px solid var(--line); border-radius:7px; background:var(--panel-tint); }
.ops-decision-metrics span,.ops-decision-metrics strong { display:block; }
.ops-decision-metrics span { color:var(--muted); font-size:11px; }
.ops-decision-metrics strong { margin-top:4px; color:var(--text); font-size:16px; }
.ops-decision-evidence { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:14px; }
.ops-decision-evidence>div,.ops-decision-action { padding:13px; border:1px solid var(--line); border-radius:7px; background:#fff; }
.ops-decision-evidence h3,.ops-decision-action h3 { font-size:14px; }
.ops-decision-evidence ul { margin:8px 0 0; padding-left:18px; color:var(--text-soft); font-size:12px; line-height:1.6; }
.ops-decision-evidence ul.is-warning { color:#9a3412; }
.ops-decision-evidence p,.ops-decision-action p { margin-top:8px; color:var(--muted); font-size:12px; }
.ops-decision-action { margin-top:10px; border-color:#c7d2fe; background:#f8faff; }
.ops-decision-action h3 { margin-top:4px; color:#1e3a8a; }
.ops-decision-action>div { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.ops-decision-empty { min-height:220px; display:grid; place-items:center; padding:24px; color:var(--muted); font-size:13px; text-align:center; }
@media (max-width:900px) { .ops-decision-layout{grid-template-columns:1fr}.ops-decision-list{max-height:320px;border-right:0;border-bottom:1px solid var(--line)}.ops-decision-metrics{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:520px) { .ops-decision-detail{padding:14px 12px}.ops-decision-detail>header,.ops-decision-evidence{grid-template-columns:1fr;display:grid}.ops-decision-score{justify-items:start}.ops-data-quality{width:100%;margin-left:0} }

.ops-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-solid);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}

.ops-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.ops-panel-head h2,
.ops-suggestion-group h3,
.ops-workflow-detail-body h3 {
  margin: 0;
  color: var(--text);
  font-size: 16px;
}

.ops-panel-head span,
.ops-suggestion-card p,
.ops-suggestion-card em,
.ops-suggestion-meta span,
.ops-sku-stack span,
.ops-sku-stack em,
.ops-workflow-title span,
.ops-detail-step-grid span,
.ops-detail-step-grid em,
.ops-completed-list span,
.ops-task-window-head span {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.ops-panel-head b,
.ops-suggestion-group h3 span {
  display: inline-flex;
  min-width: 28px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--panel-soft);
  color: var(--accent-dark);
  font-size: 12px;
}

.ops-suggestion-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 12px;
  padding: 14px;
}

.ops-module-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  align-items: start;
  padding: 12px;
}

@media (max-width: 1180px) {
  .ops-module-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }
}

@media (max-width: 760px) {
  .ops-module-grid {
    grid-template-columns: 1fr;
  }
}

.ops-module-card {
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  align-content: start;
  gap: 6px;
  min-width: 0;
  height: clamp(420px, 56vh, 560px);
  max-height: 560px;
  min-height: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-tint);
}

.ops-module-card.tone-price {
  border-left-color: #2563eb;
}

.ops-module-card.tone-sku {
  border-left-color: #64748b;
}

.ops-module-card.tone-jit,
.ops-module-card.tone-stock {
  border-left-color: #d9902f;
}

.ops-module-card.tone-stock-order {
  border-left-color: #f97316;
}

.ops-module-card.tone-sales {
  border-left-color: #16a34a;
}

.ops-module-card.tone-review {
  border-left-color: #7c3aed;
}

.ops-module-card.tone-traffic {
  border-left-color: #0891b2;
}

.ops-module-card.tone-competitor {
  border-left-color: #0f766e;
}

.ops-module-card header,
.ops-mini-issue,
.ops-followup-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.ops-module-card header strong {
  display: block;
  font-size: 13px;
  line-height: 1.15;
}

.ops-module-card header span,
.ops-mini-issue span,
.ops-module-items > em,
.ops-followup-row span {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.ops-module-card header b {
  display: inline-flex;
  min-width: 24px;
  height: 22px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #fff;
  color: var(--accent-dark);
  font-size: 12px;
}

.ops-module-buckets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(64px, 1fr));
  gap: 4px;
}

.ops-module-buckets button {
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  background: #fff;
}

.ops-module-buckets button.active {
  box-shadow: inset 0 0 0 1px currentColor;
}

.ops-module-buckets .bucket-all {
  border-color: #cbd5e1;
  background: #f8fafc;
  color: #475569;
}

.ops-module-quality {
  padding: 6px 7px;
  border: 1px solid #bbf7d0;
  border-radius: 6px;
  background: #f0fdf4;
}

.ops-module-quality.is-warning {
  border-color: #fed7aa;
  background: #fff7ed;
}

.ops-module-quality strong,
.ops-module-quality span {
  font-size: 10.5px;
}

.ops-module-quality strong {
  margin-right: 5px;
  color: #047857;
}

.ops-module-quality.is-warning strong {
  color: #c2410c;
}

.ops-module-quality span {
  color: var(--muted);
}

.ops-module-quality p {
  margin: 3px 0 0;
  color: #475569;
  font-size: 10.5px;
  line-height: 1.35;
}

.ops-module-buckets .bucket-activity,
.ops-mini-issue.kind-activity {
  border-color: #bfdbfe;
  background: #eff6ff;
}

.ops-module-buckets .bucket-activity,
.ops-mini-issue.kind-activity {
  color: #1d4ed8;
}

.ops-module-buckets .bucket-declared,
.ops-mini-issue.kind-declared {
  border-color: #fed7aa;
  background: #fff7ed;
}

.ops-module-buckets .bucket-declared,
.ops-mini-issue.kind-declared {
  color: #c2410c;
}

.ops-module-buckets .bucket-launch,
.ops-mini-issue.kind-launch,
.ops-module-buckets .bucket-mapping,
.ops-mini-issue.kind-mapping {
  border-color: #c7d2fe;
  background: #eef2ff;
  color: #3730a3;
}

.ops-module-buckets .bucket-jit,
.ops-mini-issue.kind-jit {
  border-color: #fde68a;
  background: #fffbeb;
  color: #92400e;
}

.ops-module-buckets .bucket-stock,
.ops-mini-issue.kind-stock {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

.ops-module-buckets .bucket-stock-request,
.ops-mini-issue.kind-stock-request {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #c2410c;
}

.ops-module-buckets .bucket-stock-check,
.ops-mini-issue.kind-stock-check {
  border-color: #fde68a;
  background: #fffbeb;
  color: #92400e;
}

.ops-module-buckets .bucket-stock-receive,
.ops-mini-issue.kind-stock-receive {
  border-color: #bae6fd;
  background: #f0f9ff;
  color: #0369a1;
}

.ops-module-buckets .bucket-warehouse,
.ops-mini-issue.kind-warehouse {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

.ops-module-buckets .bucket-trend,
.ops-mini-issue.kind-trend {
  border-color: #a7f3d0;
  background: #ecfdf5;
  color: #047857;
}

.ops-module-buckets .bucket-review,
.ops-mini-issue.kind-review,
.ops-module-buckets .bucket-diagnosis,
.ops-mini-issue.kind-diagnosis {
  border-color: #ddd6fe;
  background: #f5f3ff;
  color: #5b21b6;
}

.ops-module-buckets .bucket-traffic,
.ops-mini-issue.kind-traffic {
  border-color: #a5f3fc;
  background: #ecfeff;
  color: #0e7490;
}

.ops-module-buckets .bucket-competitor,
.ops-mini-issue.kind-competitor {
  border-color: #99f6e4;
  background: #f0fdfa;
  color: #0f766e;
}

.ops-module-items,
.ops-followup-list {
  display: grid;
  gap: 5px;
}

.ops-module-items {
  align-content: start;
  grid-auto-rows: max-content;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 2px;
}

.ops-module-empty {
  min-height: 28px;
  display: grid;
  align-items: center;
  padding: 6px 8px;
  border: 1px dashed var(--line);
  border-radius: 6px;
  color: var(--muted);
  font-size: 11px;
}

.ops-mini-issue {
  grid-template-columns: minmax(0, 1fr) 104px;
  align-self: start;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.ops-mini-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  margin-top: 5px;
}

.ops-mini-facts span {
  padding: 2px 4px;
  border: 1px solid color-mix(in srgb, currentColor 18%, transparent);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.68);
  color: #334155;
  font-size: 10px;
  line-height: 1.2;
}

.ops-mini-source {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 5px;
  align-items: center;
  margin-top: 5px;
  font-size: 10px;
}

.ops-mini-source strong {
  color: #047857;
}

.ops-mini-source.is-review strong,
.ops-mini-source.is-stale strong {
  color: #c2410c;
}

.ops-mini-source span {
  color: var(--muted);
  font-size: 10px;
}

.ops-mini-issue.kind-activity {
  border-left: 4px solid #2563eb;
}

.ops-mini-issue.kind-declared {
  border-left: 4px solid #f97316;
}

.ops-mini-title,
.ops-mini-title-static {
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-align: left;
}

.ops-mini-title {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: currentColor;
  cursor: pointer;
}

.ops-mini-title:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.ops-mini-codes {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  column-gap: 5px;
  row-gap: 1px;
  margin-top: 3px;
  font-size: 10.5px;
  line-height: 1.18;
}

.ops-mini-codes span {
  color: var(--muted);
  font-weight: 700;
  text-align: right;
}

.ops-mini-codes strong {
  min-width: 0;
  overflow: hidden;
  color: #53627a;
  font-size: 10.5px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ops-mini-actions,
.ops-followup-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
}

.ops-mini-actions {
  display: grid;
  grid-template-columns: 24px 54px 22px;
  justify-content: end;
  align-self: center;
  gap: 4px;
}

.ops-mini-actions b,
.ops-followup-row b {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}

.ops-mini-actions button,
.ops-followup-actions button {
  min-height: 22px;
  padding: 2px 6px;
  font-size: 11px;
}

.ops-mini-actions .primary {
  padding-inline: 0;
}

.ops-skc-detail-drawer {
  width: min(820px, 94vw);
}

.ops-skc-sku-list {
  display: grid;
  gap: 8px;
}

.ops-skc-sku-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.ops-skc-sku-list strong,
.ops-skc-sku-list span,
.ops-skc-sku-list em {
  display: block;
  min-width: 0;
}

.ops-skc-sku-list strong {
  overflow: hidden;
  color: #0f172a;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ops-skc-sku-list span,
.ops-skc-sku-list em {
  margin-top: 2px;
  color: #64748b;
  font-size: 12px;
  font-style: normal;
}

.ops-followup-list {
  padding: 12px;
}

.ops-followup-row {
  grid-template-columns: minmax(0, 1.5fr) minmax(120px, 0.8fr) auto;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
}

.ops-followup-row.is-done {
  opacity: 0.76;
}

.ops-followup-row strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ops-manual-followup-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.ops-manual-followup-form .full,
.ops-manual-followup-form .check-row {
  grid-column: 1 / -1;
}

.ops-manual-followup-form .check-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ops-suggestion-group {
  display: grid;
  gap: 10px;
  align-content: start;
}

.ops-suggestion-group h3 {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.ops-suggestion-group > div,
.ops-completed-list,
.ops-detail-step-grid {
  display: grid;
  gap: 10px;
}

.ops-suggestion-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, auto);
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-tint);
}

.ops-suggestion-card.severity-urgent {
  border-left-color: var(--danger);
}

.ops-suggestion-card.severity-high {
  border-left-color: #d9902f;
}

.ops-suggestion-main,
.ops-suggestion-meta,
.ops-sku-stack,
.ops-workflow-title,
.ops-detail-step-grid article,
.ops-task-window-head > div {
  display: grid;
  gap: 5px;
}

.ops-suggestion-main span,
.ops-risk-tag,
.ops-ok-tag {
  width: fit-content;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-size: 12px;
}

.ops-suggestion-card p {
  margin: 0;
  line-height: 1.5;
}

.ops-suggestion-meta {
  justify-items: end;
}

.ops-suggestion-meta > div,
.ops-workflow-filters,
.ops-log-form {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.ops-workflow-filters {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}

.ops-workflow-filters input {
  min-width: min(420px, 100%);
}

.ops-workflow-table th,
.ops-workflow-table td {
  vertical-align: middle;
}

.ops-workflow-title {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
}

.ops-step-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 220px;
}

.ops-step-pills button,
.ops-step-pills span {
  min-height: 28px;
  padding: 4px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 12px;
}

.ops-step-pills .active {
  border-color: var(--blue);
  background: #eff6ff;
  color: var(--blue);
}

.ops-step-pills .done {
  border-color: #22a06b;
  background: #ecfdf5;
  color: #047857;
}

.ops-step-pills .canceled {
  border-color: #f0b4b4;
  background: #fff1f2;
  color: var(--danger);
}

.ops-risk-tag {
  background: #fff1f2;
  color: var(--danger);
}

.ops-ok-tag {
  background: var(--aqua-soft);
  color: #047857;
}

.ops-completed-list {
  padding: 14px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.ops-completed-list button {
  display: grid;
  gap: 5px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
  text-align: left;
}

.ops-workflow-detail-modal {
  width: min(1080px, calc(100vw - 34px));
}

.ops-workflow-detail-body {
  display: grid;
  gap: 16px;
}

.ops-detail-step-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.ops-detail-step-grid article {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
}

.ops-detail-step-grid article.active {
  border-left: 4px solid var(--blue);
}

.ops-detail-step-grid article.done {
  border-left: 4px solid #22a06b;
}

.ops-detail-step-grid article.waiting {
  border-left: 4px solid var(--line-strong);
}

.ops-log-form {
  align-items: stretch;
}

.ops-log-form input {
  min-width: 180px;
}

.ops-log-form textarea {
  flex: 1 1 360px;
  min-height: 78px;
}

.ops-task-window {
  position: fixed;
  z-index: 70;
  width: min(340px, calc(100vw - 24px));
  max-height: min(720px, calc(100dvh - 40px));
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-solid);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.22);
  overflow: hidden;
}

.ops-task-window-head,
.ops-task-window-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
}

.ops-task-window-foot {
  border-top: 1px solid var(--line);
  border-bottom: 0;
  justify-content: flex-end;
}

.ops-task-window-body {
  min-height: 0;
  overflow: auto;
  padding: 12px;
}

.ops-task-window .task-detail-actions {
  display: none;
}

.modal-body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 12px;
  overflow: auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

.model-split-modal {
  width: min(1040px, calc(100vw - 28px));
}

.model-split-body {
  display: grid;
  gap: 10px;
}

.model-split-target {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-left: 4px solid #0ea5e9;
  border-radius: 8px;
  background: rgba(248, 251, 255, 0.8);
}

.model-split-target span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
}

.model-split-note {
  margin: 0;
}

.model-split-scroll {
  max-height: min(420px, 52vh);
}

.model-split-table {
  min-width: 940px;
  border-left-width: 0;
}

.model-split-table th:first-child,
.model-split-table td:first-child {
  width: 38px;
  text-align: center;
}

.model-split-table input[type="checkbox"] {
  width: 16px;
  height: 16px;
}

.model-split-count {
  justify-self: end;
  font-size: 12px;
  color: var(--muted);
}

.modal-actions {
  min-height: 50px;
  padding: 9px 12px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  border-top: 1px solid var(--line);
  flex-shrink: 0;
}

.image-preview-backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(6, 12, 16, 0.58);
}

.image-preview-modal {
  position: relative;
  width: min(720px, calc(100vw - 32px));
  max-height: calc(100dvh - 48px);
  padding: 14px;
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
}

.image-preview-modal img,
.image-preview-modal video {
  display: block;
  max-width: 100%;
  max-height: calc(100dvh - 108px);
  margin: 0 auto;
  border-radius: 6px;
  object-fit: contain;
}

.image-preview-modal video {
  background: #020617;
}

.image-preview-close {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 1;
  background: rgba(255, 255, 255, 0.92);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.task-create-modal {
  width: min(720px, 100%);
}

.task-create-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
}

.task-create-grid textarea {
  min-height: 120px;
}

.task-type-field {
  min-width: 0;
}

.task-type-custom {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 6px;
  margin-top: 6px;
}

.task-type-custom[hidden] {
  display: none;
}

.task-type-custom input {
  min-width: 0;
}

.task-type-custom button {
  min-height: 34px;
}

.field-hint {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.task-attachment-upload {
  margin-top: 12px;
}

.material-upload-modal {
  width: min(1180px, 100%);
}

.material-upload-box {
  display: grid;
  grid-template-columns: minmax(260px, 420px) minmax(260px, 1fr);
  gap: 12px;
  align-items: start;
  margin-bottom: 12px;
}

.material-upload-actions {
  justify-content: flex-end;
  margin-bottom: 8px;
}

.material-upload-table table {
  min-width: 1040px;
}

.product-modal {
  width: min(1040px, 100%);
}

.skc-group-modal {
  height: min(760px, calc(100dvh - 24px));
}

.work-order-modal {
  width: min(1080px, 100%);
}

.work-order-editor {
  display: grid;
  gap: 10px;
}

.work-order-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
  padding: 10px;
}

.attachment-drop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
  border: 1px dashed var(--line);
  border-radius: var(--radius-control);
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.72);
  cursor: pointer;
}

.attachment-drop:focus-visible {
  outline: 3px solid rgba(79, 91, 213, 0.18);
  border-color: var(--accent);
}

.attachment-drop.dragging,
.attachment-drop.has-file {
  border-color: var(--accent);
  background: rgba(79, 91, 213, 0.06);
}

.attachment-drop strong {
  display: block;
  margin-bottom: 5px;
}

.attachment-drop span {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.attachment-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.task-attachment-summary {
  min-width: min(100%, 360px);
  flex: 1 1 360px;
}

.task-attachment-preview-list {
  display: grid;
  flex: 1 0 100%;
  gap: 8px;
}

.task-attachment-preview-list:empty {
  display: none;
}

.task-attachment-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(205, 217, 232, 0.9);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
}

.task-attachment-preview > div {
  min-width: 0;
}

.task-attachment-preview strong {
  display: block;
  margin: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-attachment-preview small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.task-attachment-preview button {
  flex: 0 0 auto;
}

.product-editor {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}

.skc-group-editor {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}

.product-editor > .product-section,
.product-editor > .model-panel {
  flex: 0 0 auto;
}

.skc-group-editor > .product-section,
.skc-group-editor > .skc-style-section {
  flex: 0 0 auto;
}

.product-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
  overflow: hidden;
}

.product-section-head {
  min-height: 32px;
  padding: 6px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
}

.product-section-head h3 {
  flex: 0 0 auto;
  margin: 0;
  font-size: 14px;
}

.section-hint {
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 8px;
}

.skc-form-grid {
  padding: 8px;
}

.skc-parent-section {
  border-color: #a9d7cf;
  background: linear-gradient(180deg, #f3fbf9 0%, #fbfcfd 100%);
  box-shadow: 0 8px 24px rgba(22, 124, 113, 0.08);
}

.skc-parent-head {
  min-height: 44px;
  border-bottom-color: #cbe6e1;
  background: #eaf8f5;
}

.skc-section-title {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 9px;
}

.skc-section-title.compact {
  gap: 7px;
}

.skc-section-title h3 {
  margin: 0;
  color: var(--text);
  font-size: 15px;
  line-height: 1.2;
}

.skc-section-title p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.2;
}

.skc-step {
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  background: var(--primary);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}

.skc-default-mark {
  min-width: 38px;
  height: 24px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  background: #fff2d4;
  color: #6f4700;
  font-size: 12px;
  font-weight: 800;
}

.skc-parent-badge,
.skc-apply-badge {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.skc-parent-badge {
  color: var(--primary);
  background: #fff;
  border: 1px solid #b9dfd9;
}

.skc-apply-badge {
  color: #5a3b00;
  background: #fff2d4;
  border: 1px solid #f0cd83;
}

.skc-group-image-panel {
  margin: 0 8px 8px;
  border: 1px solid #cbe6e1;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.skc-group-image-head {
  min-height: 42px;
  padding: 7px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
}

.skc-group-image-head h4 {
  margin: 0;
  font-size: 14px;
}

.skc-group-image-head span {
  color: var(--muted);
  font-size: 12px;
}

.skc-group-image-grid {
  padding: 8px;
}

.skc-style-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
  overflow: hidden;
}

.skc-variant-section {
  border-color: #d4e1e6;
  background: #f7fafb;
}

.skc-style-toolbar {
  min-height: 36px;
  padding: 7px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
}

.skc-main-toolbar {
  min-height: 48px;
  background: #fff;
}

.skc-style-toolbar h3 {
  margin: 0;
  font-size: 14px;
}

.skc-style-toolbar p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.skc-style-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
}

.skc-style-count {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.skc-style-sync-status {
  color: var(--primary);
  font-size: 12px;
  white-space: nowrap;
}

.skc-style-list {
  display: grid;
  gap: 8px;
  padding: 8px;
}

.skc-variant-workbench {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  padding: 10px;
}

.skc-sku-pane,
.skc-defaults-pane {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.skc-sku-pane {
  background: #fbfcfd;
}

.skc-defaults-pane {
  border-color: #cbe6e1;
  background: #fff;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
}

.skc-pane-head {
  min-height: 38px;
  padding: 7px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--line);
}

.skc-defaults-pane .skc-pane-head {
  min-height: 44px;
  border-bottom-color: #cbe6e1;
  background: #eaf8f5;
}

.skc-sku-pane .skc-pane-head {
  background: #f7fafb;
}

.skc-pane-head strong {
  font-size: 14px;
}

.skc-pane-head span {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.skc-common-sku {
  padding: 8px;
}

.skc-common-sku > .skc-style-block:first-child {
  margin-top: 0;
  border-top: 0;
  padding-top: 0;
}

.skc-upload-compact {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.skc-defaults-pane .skc-upload-compact {
  grid-template-columns: 1fr;
}

.skc-defaults-pane .product-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.skc-sku-table-wrap {
  overflow-x: auto;
  padding: 0;
}

.skc-sku-table {
  width: 100%;
  min-width: 780px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.skc-sku-table th,
.skc-sku-table td {
  border-bottom: 1px solid var(--line);
  padding: 8px 7px;
  text-align: left;
  vertical-align: middle;
}

.skc-sku-table th {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.skc-sku-table td:nth-child(1) {
  width: 28%;
}

.skc-sku-table td:nth-child(2),
.skc-sku-table td:nth-child(3) {
  width: 18%;
}

.skc-sku-table input {
  width: 100%;
  min-height: 34px;
  padding: 6px 8px;
  background: #fff;
}

.sku-status {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  border: 1px solid #cfe7e2;
  border-radius: 999px;
  padding: 2px 8px;
  color: var(--primary);
  background: #eefaf7;
  font-size: 12px;
  white-space: nowrap;
}

.sku-status.empty {
  border-color: var(--line);
  color: var(--muted);
  background: #fff;
}

.sku-status.overridden {
  border-color: #f5c781;
  color: #8a5600;
  background: #fff8e9;
}

.skc-sku-row-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.skc-sku-row-actions button:not(.icon) {
  min-height: 32px;
  padding: 5px 9px;
}

.skc-sku-table tr.has-override td {
  background: #fffdf7;
}

.skc-sku-detail-row > td {
  padding: 0 8px 10px;
  background: #fff;
}

.skc-sku-detail {
  display: grid;
  gap: 8px;
  border: 1px solid #dbe7ec;
  border-radius: 8px;
  background: #fbfcfd;
  padding: 8px;
}

.skc-sku-detail > .skc-style-block:first-child {
  margin-top: 0;
  border-top: 0;
  padding-top: 0;
}

.skc-style-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 8px;
}

.skc-style-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.skc-style-card-actions {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 8px;
}

.skc-style-head strong {
  font-size: 14px;
}

.skc-style-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.skc-style-grid .wide {
  grid-column: span 2;
}

.skc-style-grid .full {
  grid-column: 1 / -1;
}

.skc-style-block {
  margin-top: 8px;
  border-top: 1px solid var(--line);
  padding-top: 8px;
}

.skc-style-block-head {
  min-height: 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.skc-style-block-head h4 {
  margin: 0;
  font-size: 13px;
}

.skc-style-block-head span {
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.skc-style-upload-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.skc-style-upload-row span,
.skc-style-upload-row a {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.skc-style-file .model-upload {
  justify-content: flex-start;
}

.review-grid {
  align-items: start;
}

.review-field {
  margin-bottom: 0;
}

.review-field input {
  min-height: 34px;
}

.review-field small {
  min-height: 15px;
  color: var(--muted);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.auto-metrics,
.accessory-grid {
  display: grid;
  gap: 6px;
}

.auto-metrics {
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  padding: 6px 8px;
}

.auto-metrics div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: rgba(255, 255, 255, 0.92);
  min-height: 30px;
  padding: 5px 7px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.auto-metrics span,
.empty-inline {
  color: var(--muted);
}

.auto-metrics span {
  display: inline;
  flex: 0 0 auto;
  font-size: 12px;
}

.auto-metrics strong {
  display: block;
  margin-top: 0;
  min-width: 0;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.accessory-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.product-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 128px));
  gap: 6px;
  padding: 8px;
}

.product-image-card {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: #fff;
  overflow: hidden;
  box-shadow: var(--shadow-soft);
}

.product-image-card img,
.image-placeholder {
  width: 100%;
  aspect-ratio: 1 / 1;
  display: block;
  object-fit: cover;
  background: var(--panel-soft);
}

.image-placeholder {
  display: grid;
  place-items: center;
  color: var(--muted);
}

.product-image-meta {
  display: grid;
  gap: 4px;
  padding: 6px;
}

.product-image-meta strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-image-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.pending-images {
  display: grid;
  gap: 6px;
  padding: 0 8px 8px;
}

.pending-title {
  color: var(--muted);
  font-weight: 700;
}

.pending-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 128px));
  gap: 8px;
}

.pending-image-card {
  position: relative;
  min-width: 0;
  border: 1px dashed var(--line);
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
}

.pending-image-card img {
  width: 100%;
  aspect-ratio: 1 / 1;
  display: block;
  object-fit: cover;
  background: #eef4f6;
}

.pending-image-remove {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 1;
  width: 24px;
  min-height: 24px;
  padding: 0;
  border-color: rgba(183, 61, 61, 0.35);
  background: rgba(255, 255, 255, 0.92);
  color: var(--danger);
  line-height: 1;
}

.pending-image-meta {
  display: grid;
  gap: 4px;
  padding: 6px;
}

.pending-image-meta strong,
.pending-image-meta span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pending-image-meta span {
  color: var(--muted);
  font-size: 12px;
}

.pending-image-original {
  min-height: 28px;
  padding: 4px 6px;
}

.pending-image-row {
  min-height: 34px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  border: 1px dashed var(--line);
  border-radius: 6px;
  background: #fff;
  padding: 6px 8px;
}

.pending-image-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pending-image-row b {
  font-size: 13px;
}

.model-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
  overflow: hidden;
}

.model-panel-head {
  min-height: 32px;
  padding: 6px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
}

.model-panel-head h3 {
  flex: 0 0 auto;
  margin: 0;
  font-size: 14px;
}

.model-upload {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
  color: var(--muted);
}

.model-link-input {
  width: min(320px, 34vw);
  min-width: 180px;
}

.model-upload span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.model-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 6px;
  padding: 6px 8px;
}

.model-summary div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  min-height: 30px;
  padding: 5px 7px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.model-summary span,
.model-empty {
  color: var(--muted);
}

.model-summary span {
  display: inline;
  flex: 0 0 auto;
  font-size: 12px;
}

.model-summary strong {
  display: block;
  margin-top: 0;
  min-width: 0;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.model-empty {
  padding: 8px;
}

.field.wide {
  grid-column: span 2;
}

.field.full {
  grid-column: 1 / -1;
}

.permission-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
}

.permission-toolbar div {
  margin-right: auto;
}

.permission-toolbar strong {
  color: var(--text);
}

.permission-search {
  display: flex;
  flex: 0 1 360px;
  align-items: center;
  gap: 8px;
  min-width: min(360px, 100%);
}

.permission-search span {
  flex: 0 0 auto;
  color: var(--muted);
  font-weight: 700;
  white-space: nowrap;
}

.permission-search input {
  width: 100%;
  min-height: 34px;
}

.permission-type-select {
  display: flex;
  flex: 0 1 170px;
  align-items: center;
  gap: 8px;
  min-width: 150px;
}

.permission-type-select span {
  flex: 0 0 auto;
  color: var(--muted);
  font-weight: 700;
  white-space: nowrap;
}

.permission-type-select select {
  width: 100%;
  min-height: 34px;
}

.permission-empty {
  margin-top: 10px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  color: var(--muted);
  background: rgba(246, 251, 255, 0.72);
}

.role-workbench {
  display: grid;
  grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.role-audit-panel {
  position: sticky;
  top: 12px;
}

.role-audit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}

.role-audit-grid div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.72);
}

.role-audit-grid span,
.role-domain-row span,
.role-domain-row em,
.role-card-head span,
.role-card p,
.role-card-metrics span,
.role-group-chips em,
.role-empty-chip,
.role-more-chip {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.role-audit-grid strong {
  display: block;
  margin-top: 6px;
  font-size: 24px;
}

.role-domain-map {
  display: grid;
  gap: 9px;
  padding: 0 12px 12px;
}

.role-domain-map h3 {
  margin: 2px 0 0;
  font-size: 13px;
}

.role-domain-row {
  display: grid;
  grid-template-columns: minmax(110px, 1fr) minmax(90px, 0.9fr) 42px;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.role-domain-row strong,
.role-domain-row span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.role-domain-row em {
  text-align: right;
}

.role-domain-bar,
.role-coverage-line {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e6eef5;
}

.role-domain-bar i,
.role-coverage-line i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--aqua), var(--accent));
}

.role-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 14px;
}

.role-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  padding: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(246, 251, 255, 0.96)),
    var(--panel-solid);
  box-shadow: var(--shadow-soft);
}

.role-card.is-system {
  border-left: 4px solid var(--accent);
}

.role-card-head {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.role-avatar {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid #c8d6e8;
  border-radius: 10px;
  background: linear-gradient(135deg, #eef7ff, #e5edff);
  color: var(--accent-dark);
  font-weight: 800;
}

.role-card h3,
.role-card p {
  margin: 0;
}

.role-card h3,
.role-card-head span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.role-card h3 {
  font-size: 17px;
}

.role-card p {
  min-height: 38px;
  line-height: 1.55;
}

.role-card-badges,
.role-card-actions,
.role-group-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.role-card-badges {
  justify-content: flex-end;
}

.role-card-badges span,
.role-group-chips span,
.role-empty-chip,
.role-more-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  max-width: 100%;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
}

.role-card-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.role-card-metrics div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px;
  background: rgba(246, 251, 255, 0.72);
}

.role-card-metrics strong {
  display: block;
  margin-top: 4px;
  font-size: 20px;
}

.role-group-chips span {
  min-width: 0;
  background: var(--panel-tint);
}

.role-group-chips b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.role-card-actions {
  justify-content: flex-end;
  padding-top: 2px;
}

.role-card-actions button {
  min-height: 32px;
  padding: 0 11px;
}

.permission-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 4px;
  margin-top: 8px;
}

.permission-section {
  display: grid;
  gap: 6px;
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: rgba(246, 251, 255, 0.58);
}

.permission-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-weight: 700;
}

.permission-section-title > div {
  min-width: 0;
}

.permission-section-title span,
.permission-section-title em {
  display: block;
}

.permission-section-title em {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
}

.permission-section-title button {
  min-height: 26px;
  padding: 0 8px;
  font-size: 12px;
}

.role-preview-modal {
  width: min(900px, 100%);
}

.preview-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.preview-metrics div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fbfcfd;
}

.preview-metrics span {
  display: block;
  color: var(--muted);
}

.preview-metrics strong {
  display: block;
  margin-top: 6px;
  font-size: 22px;
}

.role-preview-note {
  border: 1px solid #d5c598;
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff8e3;
  color: #5d4412;
  margin-bottom: 12px;
}

.role-preview-groups {
  display: grid;
  gap: 12px;
}

.role-preview-groups section {
  display: grid;
  gap: 8px;
}

.role-preview-groups h3 {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.role-preview-modules {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.role-preview-modules span {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 9px;
  background: rgba(255, 255, 255, 0.72);
}

.role-preview-modules b,
.role-preview-modules em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.role-preview-modules em {
  margin-top: 3px;
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
}

.check-item {
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  min-height: 32px;
  padding: 5px 7px;
  font-size: 12px;
  background: rgba(255, 255, 255, 0.64);
}

.check-item:has(input:checked) {
  border-color: rgba(79, 91, 213, 0.42);
  background: rgba(223, 228, 255, 0.62);
}

.check-item:focus-within {
  border-color: rgba(37, 99, 235, 0.72);
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.18);
}

.check-item input {
  width: auto;
}

.check-item span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .role-workbench {
    grid-template-columns: 1fr;
  }

  .role-audit-panel {
    position: static;
  }
}

@media (max-width: 720px) {
  .role-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .role-toolbar .toolbar-left,
  .role-toolbar .toolbar-right {
    width: 100%;
    flex-wrap: wrap;
  }

  .role-toolbar .search {
    width: 100%;
  }

  .role-card-grid,
  .role-audit-grid,
  .role-card-metrics {
    grid-template-columns: 1fr;
  }

  .role-card-head {
    grid-template-columns: 40px minmax(0, 1fr);
  }

  .role-card-badges {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }

  .role-domain-row {
    grid-template-columns: minmax(0, 1fr) 46px;
  }

  .role-domain-bar {
    grid-column: 1 / -1;
    order: 3;
  }
}

.import-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 14px;
}

.mapping-box {
  min-height: 290px;
  font-family: Consolas, "Courier New", monospace;
}

.review-toolbar select,
.review-toolbar input {
  min-width: 126px;
}

.review-toolbar {
  display: grid;
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 10px;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid rgba(183, 202, 217, 0.72);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(248, 252, 255, 0.82), rgba(255, 255, 255, 0.68)),
    rgba(255, 255, 255, 0.64);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(14px);
}

.review-toolbar .toolbar-left {
  display: grid;
  grid-template-columns: minmax(150px, 1.05fr) minmax(150px, 1.05fr) minmax(150px, 1fr) repeat(2, minmax(142px, 0.9fr)) minmax(72px, 0.42fr);
  gap: 8px;
  width: 100%;
}

.review-toolbar .toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.review-toolbar button {
  min-width: 72px;
  white-space: nowrap;
}

.review-toolbar .toolbar-right button {
  min-width: 92px;
  padding: 0 12px;
  border-radius: 999px;
}

.review-toolbar .toolbar-left > *,
.review-toolbar .toolbar-right > * {
  box-shadow: 0 8px 18px rgba(93, 117, 142, 0.08);
}

.review-agent-output {
  margin: 0;
  max-height: 360px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  padding: 10px;
  font-family: Consolas, "Courier New", monospace;
  white-space: pre-wrap;
}

.review-import-modal {
  width: min(1120px, 94vw);
}

.review-import-preview table {
  min-width: 980px;
}

.review-evidence-table {
  min-width: 1220px;
}

.review-evidence-table th:nth-child(3),
.review-evidence-table td:nth-child(3) {
  min-width: 260px;
}

.review-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px;
  margin: 8px 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: rgba(255, 255, 255, 0.86);
  padding: 8px;
  box-shadow: 0 8px 18px rgba(37, 99, 111, 0.04);
}

.review-toolbar .toolbar-left {
  display: grid;
  grid-template-columns:
    minmax(160px, 1.2fr)
    minmax(128px, 0.8fr)
    minmax(112px, 0.75fr)
    minmax(120px, 0.7fr)
    minmax(120px, 0.7fr)
    auto;
  gap: 8px;
  align-items: center;
}

.review-toolbar .toolbar-right {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.review-toolbar select,
.review-toolbar input,
.review-toolbar button {
  min-width: 0;
  height: 32px;
}

.review-toolbar + .notice {
  margin: 0 0 8px;
  padding: 7px 10px;
  font-size: 13px;
  line-height: 1.35;
}

.review-detail-panel {
  margin-bottom: 12px;
}

.review-detail-panel .panel-head {
  align-items: center;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  padding: 8px 10px;
}

.review-detail-panel .panel-head > div {
  min-width: 0;
}

.review-detail-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.review-detail-collapse-btn {
  min-width: 64px;
}

.review-detail-panel.is-collapsed .panel-head {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}

.review-detail-pagination {
  margin-top: 8px;
}

.review-detail-wrap {
  max-height: 660px;
}

.review-detail-filterbar {
  display: grid;
  grid-template-columns:
    minmax(84px, 0.42fr)
    minmax(126px, 0.58fr)
    minmax(126px, 0.58fr)
    minmax(220px, 1.25fr)
    minmax(116px, 0.58fr)
    minmax(126px, 0.62fr)
    minmax(138px, 0.68fr)
    minmax(150px, 0.78fr)
    auto
    auto;
  gap: 8px;
  align-items: center;
  margin: 0 0 10px;
}

.review-detail-filterbar input {
  width: 100%;
}

.review-detail-filterbar select {
  width: 100%;
}

.review-detail-filterbar input,
.review-detail-filterbar select {
  min-width: 0;
  height: 36px;
}

.review-detail-filterbar button {
  height: 36px;
  min-width: 68px;
  padding: 0 12px;
  white-space: nowrap;
}

.review-detail-body {
  min-width: 0;
  overflow-x: auto;
}

.review-detail-time-board {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px;
  height: clamp(360px, calc(100vh - 260px), 620px);
  overflow: hidden;
}

.review-detail-time-section {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(183, 202, 217, 0.76);
  border-left: 4px solid #64748b;
  border-radius: 8px;
  background: #f8fbfe;
  overflow: hidden;
}

.review-detail-time-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 34px;
  padding: 7px 10px;
  border-bottom: 1px solid rgba(183, 202, 217, 0.72);
  background: #f5f9fc;
  color: #475569;
}

.review-detail-time-section:nth-child(1) {
  border-left-color: #2563eb;
}

.review-detail-time-section:nth-child(2) {
  border-left-color: #059669;
}

.review-detail-time-section:nth-child(3) {
  border-left-color: #ca8a04;
}

.review-detail-time-section > header strong {
  color: var(--text);
  font-size: 14px;
}

.review-detail-time-section > header span {
  color: var(--muted);
  font-size: 12px;
}

.review-detail-time-list {
  display: grid;
  gap: 7px;
  align-content: start;
  min-height: 0;
  padding: 8px;
  overflow-y: auto;
  scrollbar-width: thin;
}

.review-detail-time-row {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 8px;
  border: 1px solid rgba(183, 202, 217, 0.72);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.88);
}

.review-detail-time-row:last-child {
  border-bottom: 1px solid rgba(183, 202, 217, 0.72);
}

.review-detail-time-row time {
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

.review-detail-time-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.review-detail-title-link {
  width: fit-content;
  max-width: 100%;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.32;
  text-align: left;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.review-detail-title-link:hover {
  color: #255b8f;
  text-decoration: underline;
}

.review-detail-time-main span,
.review-detail-time-score span,
.review-detail-time-source,
.review-detail-time-media {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-detail-time-score {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  min-width: 0;
}

.review-detail-time-score b {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 2px 7px;
  background: #e9f5ff;
  color: var(--text);
  font-size: 12px;
  line-height: 1.2;
}

.review-detail-time-score span {
  flex: 1 1 auto;
  min-width: 0;
}

.review-detail-time-media {
  text-align: left;
}

.review-detail-time-empty {
  display: grid;
  place-items: center;
  min-height: 90px;
  border: 1px dashed rgba(148, 163, 184, 0.54);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.58);
  color: var(--muted);
  font-size: 12px;
}

.review-detail-star-board {
  display: grid;
  grid-template-columns: repeat(5, minmax(180px, 1fr));
  gap: 8px;
  height: clamp(360px, calc(100vh - 260px), 620px);
  min-width: 980px;
  overflow: hidden;
}

.review-detail-star-section {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(183, 202, 217, 0.76);
  border-left: 4px solid #64748b;
  border-radius: 8px;
  background: #f8fbfe;
  overflow: hidden;
}

.review-detail-star-section.tone-star-1 {
  border-left-color: #dc2626;
  background: #fff7f7;
}

.review-detail-star-section.tone-star-2 {
  border-left-color: #f97316;
  background: #fff8ed;
}

.review-detail-star-section.tone-star-3 {
  border-left-color: #ca8a04;
  background: #fffbeb;
}

.review-detail-star-section.tone-star-4 {
  border-left-color: #2563eb;
  background: #f5f9ff;
}

.review-detail-star-section.tone-star-5 {
  border-left-color: #059669;
  background: #f0fdf8;
}

.review-detail-star-section > header {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: space-between;
  min-height: 36px;
  padding: 7px 8px;
  border-bottom: 1px solid rgba(183, 202, 217, 0.72);
  background: rgba(255, 255, 255, 0.64);
}

.review-detail-star-head-main {
  display: flex;
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.review-detail-star-section > header strong {
  flex: 0 0 auto;
  color: var(--text);
  font-size: 14px;
  line-height: 1.2;
}

.review-detail-media-toggle {
  display: inline-flex;
  gap: 3px;
  align-items: center;
  flex: 0 0 auto;
  min-width: 0;
  height: 24px;
  min-height: 24px;
  padding: 0 6px;
  border: 1px solid rgba(183, 202, 217, 0.86);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: #475569;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.review-detail-media-toggle b {
  color: #1f3f8b;
  font-size: 11px;
}

.review-detail-media-toggle.active {
  border-color: #65a30d;
  background: #84cc16;
  color: #17320a;
  box-shadow: 0 0 0 2px rgba(132, 204, 22, 0.18);
}

.review-detail-media-toggle.active b {
  color: #17320a;
}

.review-detail-media-toggle:disabled {
  cursor: wait;
  opacity: 0.62;
}

.review-detail-star-section > header span {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 2px 7px;
  background: #fff;
  color: #1f3f8b;
  font-size: 12px;
  font-weight: 700;
  box-shadow: inset 0 0 0 1px rgba(183, 202, 217, 0.75);
}

.review-detail-star-list {
  display: grid;
  gap: 7px;
  align-content: start;
  min-height: 0;
  padding: 8px;
  overflow-y: auto;
  scrollbar-width: thin;
}

.review-detail-star-item {
  display: grid;
  min-width: 0;
  padding: 8px;
  border: 1px solid rgba(183, 202, 217, 0.72);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.88);
}

.review-detail-star-content {
  display: grid;
  min-width: 0;
}

.review-detail-star-content.with-media {
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}

.review-detail-star-media {
  position: relative;
  width: 52px;
  height: 52px;
  min-width: 52px;
  min-height: 52px;
  padding: 0;
  border: 1px solid rgba(183, 202, 217, 0.9);
  border-radius: 6px;
  background: #eef5fb;
  overflow: hidden;
  cursor: zoom-in;
}

.review-detail-star-media img,
.review-detail-star-media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.review-detail-star-media span,
.review-detail-star-media em {
  position: absolute;
  right: 3px;
  bottom: 3px;
  border-radius: 4px;
  padding: 1px 4px;
  background: rgba(15, 23, 42, 0.72);
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.2;
}

.review-detail-star-media.video em {
  top: 3px;
  bottom: auto;
}

.review-detail-star-copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.review-detail-star-main {
  display: grid;
  min-width: 0;
}

.review-detail-star-review {
  display: -webkit-box;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: #40516a;
  font-size: 12px;
  line-height: 1.42;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.review-detail-star-average {
  width: fit-content;
  min-width: 0;
  border-radius: 999px;
  padding: 3px 8px;
  background: #e9f5ff;
  color: #39536f;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.review-detail-star-empty {
  display: grid;
  place-items: center;
  min-height: 90px;
  border: 1px dashed rgba(148, 163, 184, 0.54);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.58);
  color: var(--muted);
  font-size: 12px;
}

.review-detail-modal {
  width: min(980px, calc(100vw - 28px));
}

.review-detail-modal-body {
  display: grid;
  gap: 12px;
}

.review-detail-modal-title,
.review-detail-modal-grid > div,
.review-detail-modal-text,
.review-detail-modal-media {
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(183, 202, 217, 0.72);
  border-radius: 7px;
  background: #fbfdff;
}

.review-detail-modal-title {
  display: grid;
  gap: 4px;
}

.review-detail-modal-title strong {
  color: var(--text);
  font-size: 16px;
  line-height: 1.35;
}

.review-detail-modal-title span {
  color: var(--muted);
  font-size: 12px;
}

.review-detail-modal-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(120px, 0.55fr) minmax(0, 1fr);
  gap: 10px;
}

.review-detail-modal h3 {
  margin: 0 0 7px;
  color: #475569;
  font-size: 13px;
}

.review-detail-modal-text p {
  margin: 0;
  color: var(--text);
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.review-detail-review-cell {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.review-detail-review-cell p {
  margin: 0;
  color: var(--text);
  line-height: 1.35;
  overflow-wrap: anywhere;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.review-detail-inline-media .review-media-strip {
  min-width: 0;
  gap: 4px;
}

.review-detail-inline-media .review-media-thumb {
  width: 44px;
  height: 44px;
}

.review-detail-inline-snapshot {
  padding-top: 0;
}

.review-backend-product,
.review-backend-platform,
.review-backend-sku,
.review-backend-review,
.review-detail-meta,
.review-detail-product-sku,
.review-detail-rating,
.review-detail-original,
.review-detail-snapshot {
  display: grid;
  gap: 3px;
  align-content: start;
}

.review-backend-product strong,
.review-backend-product span,
.review-backend-product b,
.review-backend-product em,
.review-backend-platform strong,
.review-backend-platform span,
.review-backend-sku strong,
.review-backend-sku span,
.review-backend-review p,
.review-detail-meta strong,
.review-detail-meta span,
.review-detail-product-sku strong,
.review-detail-product-sku span,
.review-detail-original p,
.review-detail-original span,
.review-detail-snapshot strong,
.review-detail-snapshot span,
.review-detail-snapshot em,
.review-rating-value {
  display: block;
}

.review-backend-product strong,
.review-backend-platform strong,
.review-backend-sku strong,
.review-detail-meta strong,
.review-detail-product-sku strong {
  color: var(--text);
  line-height: 1.28;
}

.review-detail-product-sku strong,
.review-detail-product-sku span,
.review-backend-platform span,
.review-detail-meta span {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.review-backend-product span,
.review-backend-platform span,
.review-backend-sku span,
.review-detail-meta span,
.review-detail-product-sku span {
  color: var(--muted);
  font-style: normal;
}

.review-backend-product em {
  width: fit-content;
  border-radius: 4px;
  padding: 2px 7px;
  background: rgba(15, 23, 42, 0.32);
  color: #fff;
  font-size: 12px;
  font-style: normal;
}

.review-backend-product b {
  width: fit-content;
  border-radius: 4px;
  padding: 2px 6px;
  background: #e7f7ff;
  color: #0875c9;
  font-size: 12px;
}

.review-backend-review p {
  margin: 0 0 8px;
  overflow-wrap: anywhere;
}

.review-detail-original p {
  margin: 0;
  overflow-wrap: anywhere;
}

.review-snapshot-line {
  color: #475569;
  overflow-wrap: anywhere;
}

.review-detail-snapshot span {
  color: #475569;
  overflow-wrap: anywhere;
}

.review-detail-original p,
.review-detail-snapshot span {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.review-detail-snapshot em {
  color: var(--muted);
  font-style: normal;
}

.review-rating-value {
  color: var(--text);
  line-height: 1.35;
}

.review-detail-tags,
.review-detail-status {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.review-detail-status span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 2px 7px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  white-space: nowrap;
}

.review-media-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  min-width: 132px;
}

.review-media-thumb {
  position: relative;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fafc;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  font-size: 11px;
  text-decoration: none;
  cursor: zoom-in;
}

.review-media-thumb img,
.review-media-thumb video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.review-media-thumb.video span {
  position: absolute;
  left: 3px;
  bottom: 3px;
  padding: 1px 4px;
  border-radius: 4px;
  color: #fff;
  background: rgba(15, 23, 42, 0.72);
}

.review-media-more {
  color: var(--muted);
  font-size: 12px;
}

.review-media-pending {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 4px 8px;
  border: 1px dashed #f2b56b;
  border-radius: 6px;
  background: #fff8ed;
  color: #8a4b0f;
  font-size: 12px;
  white-space: nowrap;
}

.review-media-pending em {
  color: var(--muted);
  font-style: normal;
}

.review-command-center {
  display: grid;
  grid-template-columns: minmax(360px, 0.82fr) minmax(0, 1.55fr);
  gap: 18px;
  align-items: start;
  margin-bottom: 18px;
}

.review-command-center .review-radar-panel {
  margin-bottom: 0;
  position: sticky;
  top: 84px;
  max-height: calc(100vh - 104px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}

.review-command-workbench {
  min-width: 0;
}

.review-decision-rail {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.review-decision-rail article {
  position: relative;
  min-height: 118px;
  display: grid;
  gap: 6px;
  align-content: start;
  overflow: hidden;
  border: 1px solid rgba(20, 184, 166, 0.22);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(240, 253, 250, 0.95), rgba(255, 255, 255, 0.96) 58%),
    radial-gradient(circle at 100% 0, rgba(45, 212, 191, 0.24), transparent 38%);
  padding: 12px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.review-decision-rail article::after {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, #14b8a6, #38bdf8);
}

.review-decision-rail span {
  width: fit-content;
  border: 1px solid rgba(15, 118, 110, 0.22);
  border-radius: 999px;
  padding: 2px 7px;
  color: #0f766e;
  background: rgba(255, 255, 255, 0.78);
  font-size: 11px;
  font-weight: 700;
}

.review-decision-rail strong {
  font-size: 13px;
  color: var(--muted);
}

.review-decision-rail b {
  color: #0f172a;
  font-size: 28px;
  line-height: 1;
}

.review-decision-rail em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  overflow-wrap: anywhere;
}

.review-product-summary-strip {
  margin-bottom: 14px;
}

.review-workbench-section {
  margin-bottom: 16px;
  border-color: rgba(15, 23, 42, 0.08);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.04);
}

.review-workbench-section .panel-head {
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  padding-bottom: 10px;
  margin-bottom: 12px;
}

.review-workbench-section .panel-head h2 {
  position: relative;
  padding-left: 10px;
}

.review-workbench-section .panel-head h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  bottom: 3px;
  width: 3px;
  border-radius: 999px;
  background: #14b8a6;
}

.review-workbench-section:last-child {
  margin-bottom: 0;
}

.review-radar-media-preview {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 34px;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
}

.review-radar-media-preview.empty {
  border: 1px dashed var(--line);
  border-radius: 6px;
  padding: 5px 7px;
  background: #f8fafc;
}

.review-radar-media-preview > em {
  font-style: normal;
  white-space: nowrap;
}

.review-radar-media-thumb {
  position: relative;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fafc;
  cursor: zoom-in;
}

.review-media-thumb:hover,
.review-radar-media-thumb:hover {
  border-color: var(--accent);
}

.review-radar-media-thumb img,
.review-radar-media-thumb video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.review-radar-media-thumb em {
  position: absolute;
  left: 3px;
  bottom: 3px;
  border-radius: 4px;
  padding: 1px 4px;
  color: #fff;
  background: rgba(15, 23, 42, 0.72);
  font-size: 10px;
  font-style: normal;
}

.review-media-overview-panel {
  margin-bottom: 14px;
}

.review-media-wall {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(390px, 1fr));
  gap: 12px;
  padding: 14px;
}

.review-media-card {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  min-height: 124px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.78), rgba(255, 255, 255, 0.96) 38%),
    #fff;
  padding: 14px;
  box-shadow: var(--shadow-soft);
}

.review-media-card-preview .review-media-strip {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, 44px);
  gap: 6px;
  align-content: start;
}

.review-media-card-preview .review-media-thumb {
  width: 44px;
  height: 44px;
  border-radius: 10px;
}

.review-media-card-copy {
  min-width: 0;
}

.review-media-card-copy strong,
.review-media-card-copy em {
  display: block;
}

.review-media-card-copy strong {
  line-height: 1.28;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.review-media-card-copy p {
  margin: 6px 0;
  color: var(--text);
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.45;
}

.review-media-card-copy em {
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
}

.notice {
  border: 1px solid #d5c598;
  background: #fff8e3;
  color: #5d4412;
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 14px;
}

.notice.success {
  border-color: #abefc6;
  background: #f6fef9;
  color: #067647;
}

.review-radar-panel {
  margin-bottom: 14px;
}

.review-radar-panel .panel-head {
  align-items: flex-start;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.segmented {
  display: inline-flex;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.segmented button,
.segmented button {
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  padding: 7px 10px;
  font-size: 13px;
  white-space: nowrap;
}

.segmented button.active,
.segmented button.active {
  background: #fff;
  color: var(--text);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.knowledge-tabs {
  max-width: 100%;
  margin-bottom: 0;
  gap: 3px;
  padding: 3px;
  border-radius: var(--radius-control);
  overflow-x: auto;
  flex-wrap: nowrap;
}

.knowledge-tabs button {
  min-height: 30px;
  padding: 0 12px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  word-break: keep-all;
}

.review-radar-list {
  display: grid;
  gap: 8px;
  max-height: none;
  overflow: auto;
  padding-right: 4px;
}

.review-product-radar-row {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(220px, 1.7fr) minmax(120px, 0.8fr) minmax(120px, 0.8fr) repeat(4, minmax(96px, 0.7fr));
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  padding: 10px;
  text-align: left;
  color: var(--text);
}

.review-product-radar-row:hover,
.review-product-radar-row.selected {
  border-color: #0f9f95;
  box-shadow: 0 10px 24px rgba(15, 159, 149, 0.12);
}

.review-product-radar-row.selected {
  background: #f0fdfa;
}

.review-command-center .review-product-radar-row {
  grid-template-columns: minmax(0, 1fr) minmax(108px, 0.46fr) minmax(108px, 0.46fr);
  gap: 10px 12px;
  align-items: start;
  min-height: 126px;
  padding: 14px;
  border-radius: var(--radius-card);
  overflow: hidden;
}

.review-command-center .review-product-main {
  grid-column: 1;
  grid-row: 1 / span 3;
  display: grid;
  gap: 6px;
  align-content: start;
  padding: 0 12px 0 0;
  border-right: 1px solid rgba(212, 225, 234, 0.78);
  border-bottom: 0;
}

.review-command-center .review-product-main strong {
  display: -webkit-box;
  min-height: 24px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  font-size: 17px;
  line-height: 1.35;
}

.review-command-center .review-product-main em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-command-center .review-radar-media-preview {
  min-height: 42px;
  margin-top: 2px;
  overflow: hidden;
}

.review-command-center .review-radar-media-preview.empty {
  min-height: 34px;
  align-items: center;
}

.review-command-center .review-radar-media-thumb {
  width: 38px;
  height: 38px;
  border-radius: 9px;
}

.review-command-center .review-product-radar-row > span:not(.review-product-main):not(.review-radar-metrics) {
  display: block;
  min-width: 0;
}

.review-command-center .review-product-radar-row > span:nth-of-type(2),
.review-command-center .review-product-radar-row > span:nth-of-type(3) {
  align-self: stretch;
  min-width: 0;
}

.review-command-center .review-product-radar-row > span:nth-of-type(2) {
  grid-column: 2;
  grid-row: 1;
  margin-top: 0;
}

.review-command-center .review-product-radar-row > span:nth-of-type(3) {
  grid-column: 3;
  grid-row: 1;
  margin-top: 0;
}

.review-command-center .review-product-radar-row > .review-radar-metrics:nth-of-type(4) {
  grid-column: 2 / 4;
  grid-row: 2;
}

.review-command-center .review-product-radar-row > .review-radar-metrics:nth-of-type(5) {
  grid-column: 2 / 4;
  grid-row: 3;
}

.review-command-center .review-product-radar-row > .review-radar-metrics:nth-of-type(n + 6) {
  display: none;
}

.review-product-main {
  min-width: 0;
}

.review-product-main strong,
.review-product-main em {
  display: block;
  overflow-wrap: anywhere;
}

.review-product-main em,
.review-radar-metrics em {
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
}

.review-score {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3px 8px;
  align-items: center;
  min-width: 0;
}

.review-score span {
  color: var(--muted);
  font-size: 12px;
}

.review-score strong {
  font-size: 14px;
}

.review-score i {
  grid-column: 1 / -1;
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
  background: #e5e7eb;
}

.review-score b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #16a34a;
}

.review-score.risk b {
  background: #dc2626;
}

.review-score.opportunity b {
  background: #2563eb;
}

.review-radar-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: center;
}

.review-command-center .review-radar-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
  padding-top: 2px;
}

.review-radar-metrics span {
  display: grid;
  gap: 2px;
}

.review-command-center .review-radar-metrics span {
  min-height: 30px;
  align-content: start;
}

.review-radar-metrics b {
  font-size: 17px;
}

.review-radar-metrics.danger b {
  color: #b42318;
}

.review-product-hero {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) minmax(240px, 0.8fr) auto;
  gap: 14px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background:
    radial-gradient(circle at 100% 0, rgba(20, 160, 152, 0.16), transparent 32%),
    linear-gradient(180deg, rgba(246, 251, 255, 0.86), rgba(255, 255, 255, 0.96) 40%),
    #fff;
  color: var(--text);
  padding: 14px;
  margin-bottom: 12px;
  box-shadow: var(--shadow);
}

.review-product-title-block {
  min-width: 0;
}

.review-product-cover {
  width: 72px;
  height: 72px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: var(--panel-tint);
  display: grid;
  place-items: center;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}

.review-product-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.review-product-hero strong {
  display: block;
  font-size: 20px;
  margin-bottom: 4px;
  overflow-wrap: anywhere;
}

.review-product-hero p {
  margin: 0 0 8px;
  color: var(--muted);
}

.review-section-kicker {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 6px;
  border: 1px solid rgba(20, 160, 152, 0.28);
  border-radius: 999px;
  padding: 3px 8px;
  color: #10845f;
  background: rgba(226, 248, 238, 0.72);
  font-size: 12px;
}

.review-product-codes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.review-product-codes span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 3px 8px;
  background: rgba(255, 255, 255, 0.76);
  color: #475569;
  font-size: 12px;
}

.review-product-scores {
  display: grid;
  gap: 8px;
}

.review-product-hero .review-score span,
.review-product-hero .review-score strong {
  color: var(--text);
}

.review-product-hero .review-score i {
  background: #dce8ec;
}

.review-product-hero .primary {
  border-color: rgba(255, 255, 255, 0.24);
  background: #14b8a6;
  color: #fff;
}

.review-dist-pills {
  display: grid;
  gap: 8px;
}

.review-dist-pills span {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 10px;
  background: #fff;
}

.review-dist-pills em {
  color: var(--muted);
  font-style: normal;
  text-align: right;
}

.review-matrix-wrap {
  overflow: auto;
}

.review-aspect-matrix {
  min-width: 860px;
}

.review-aspect-matrix th:first-child {
  width: 210px;
  position: sticky;
  left: 0;
  z-index: 2;
  background: #fff;
  box-shadow: 10px 0 18px rgba(15, 23, 42, 0.04);
}

.review-aspect-matrix th strong,
.review-aspect-matrix th span {
  display: block;
}

.review-aspect-matrix th span {
  color: var(--muted);
  font-weight: 400;
  font-size: 12px;
  margin-top: 3px;
}

.review-heat-cell {
  width: 100%;
  min-height: 74px;
  display: grid;
  gap: 2px;
  border: 1px solid rgba(6, 78, 59, 0.08);
  border-radius: 8px;
  padding: 8px;
  text-align: left;
  background: #f6fef9;
  color: #064e3b;
}

.review-heat-cell:not(:disabled):hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.review-heat-cell:disabled {
  opacity: 0.48;
  cursor: default;
}

.review-heat-cell strong,
.review-heat-cell span,
.review-heat-cell em {
  display: block;
}

.review-heat-cell em {
  font-style: normal;
  font-size: 12px;
}

.review-heat-cell.heat-中 {
  background: #fffaeb;
  color: #93370d;
}

.review-heat-cell.heat-高 {
  background: #fef3f2;
  color: #912018;
}

.review-observation-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
}

.review-observation-card {
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)),
    radial-gradient(circle at top right, rgba(20, 184, 166, 0.13), transparent 34%);
  padding: 12px;
  display: grid;
  gap: 10px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.review-observation-card.severity-高 {
  border-color: #fecdca;
}

.review-observation-head,
.review-observation-foot,
.review-observation-foot div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.review-observation-head strong {
  margin-left: auto;
  font-size: 18px;
}

.review-observation-card h3 {
  margin: 0;
  font-size: 16px;
}

.review-observation-card p,
.review-observation-card dl {
  margin: 0;
}

.review-observation-card dl {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 5px 8px;
  color: var(--muted);
}

.review-observation-card dt {
  color: var(--text);
  font-weight: 700;
}

.review-observation-foot {
  justify-content: space-between;
  color: var(--muted);
  font-size: 12px;
}

.review-psychology-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
}

.review-psychology-grid section,
.review-action-board section,
.review-action-board article,
.review-evidence-summary,
.review-unit-list span {
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 8px;
  background: #fff;
}

.review-psychology-grid section {
  padding: 12px;
  display: grid;
  gap: 8px;
  background:
    linear-gradient(180deg, #ffffff, #fbfdff),
    radial-gradient(circle at 100% 0, rgba(56, 189, 248, 0.12), transparent 36%);
}

.review-psychology-grid section > div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.review-psychology-grid span,
.review-psychology-grid em {
  color: var(--muted);
  font-style: normal;
}

.review-psychology-grid p,
.review-psychology-grid blockquote {
  margin: 0;
}

.review-psychology-grid blockquote {
  color: var(--muted);
  border-left: 3px solid #d0d5dd;
  padding-left: 8px;
}

.review-action-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(220px, 1fr));
  gap: 12px;
  overflow-x: auto;
}

.review-action-board section {
  padding: 10px;
  min-width: 220px;
  background: #fbfdff;
}

.review-action-board h3 {
  margin: 0 0 8px;
  font-size: 15px;
}

.review-action-board article {
  padding: 10px;
  margin-bottom: 8px;
  background: #fff;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035);
}

.review-action-board article p {
  margin: 6px 0;
  color: var(--muted);
}

.review-action-board article div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
}

.review-evidence-drawer {
  width: min(1080px, 94vw);
  max-height: 92vh;
  margin-left: auto;
  background: #fff;
  border-radius: 8px 0 0 8px;
  overflow: auto;
  box-shadow: -18px 0 42px rgba(15, 23, 42, 0.18);
}

.review-evidence-summary {
  padding: 12px;
  margin-bottom: 12px;
}

.review-evidence-summary p {
  margin: 6px 0 0;
  color: var(--muted);
}

.review-unit-list {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
}

.review-unit-list span {
  display: grid;
  gap: 4px;
  padding: 8px;
}

.review-unit-list em {
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
}

.temu-embed-shell {
  min-height: calc(100vh - 124px);
  display: grid;
  grid-template-rows: minmax(560px, 1fr);
}

.temu-embed-frame {
  width: 100%;
  height: 100%;
  min-height: 560px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(20, 33, 43, 0.04);
}

.prompt-guide-main-embed {
  min-height: calc(100vh - 286px);
  display: grid;
  grid-template-rows: minmax(680px, 1fr);
  margin-top: 14px;
}

.prompt-guide-main-frame {
  width: 100%;
  height: 100%;
  min-height: 680px;
  display: block;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.prompt-image-main-embed,
.ecommerce-image-studio-main-embed,
.product-publish-main-embed,
.receiver-export-main-embed,
.task3d-main-embed,
.cloisonne-generator-main-embed,
.bridge-monitor-main-embed {
  min-height: calc(100vh - 286px);
  display: grid;
  grid-template-rows: minmax(720px, 1fr);
  margin-top: 14px;
}

.product-publish-main-embed {
  min-height: calc(100vh - 92px);
  grid-template-rows: minmax(calc(100vh - 92px), 1fr);
  margin-top: 0;
}

.product-publish-main-frame {
  min-height: calc(100vh - 92px);
}

.prompt-image-main-frame,
.ecommerce-image-studio-main-frame,
.product-publish-main-frame,
.receiver-export-main-frame,
.task3d-main-frame,
.cloisonne-generator-main-frame,
.bridge-monitor-main-frame {
  width: 100%;
  height: 100%;
  min-height: 720px;
  display: block;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body[data-qyg-ui-view="ecommerce_image_studio"] .content,
body[data-qyg-ui-view="ecommerce_image_studio"] .main {
  min-height: 0;
  overflow: hidden;
}

body[data-qyg-ui-view="ecommerce_image_studio"] .topbar {
  display: none !important;
}

body[data-qyg-ui-view="ecommerce_image_studio"] .main {
  padding: 0 !important;
}

body[data-qyg-ui-view="ecommerce_image_studio"] .ecommerce-image-studio-main-embed {
  width: 100%;
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  margin: 0;
}

body[data-qyg-ui-view="ecommerce_image_studio"] .ecommerce-image-studio-main-frame {
  width: 100%;
  height: 100%;
  min-height: 0;
  border: 0;
  background: #fff;
}

.receiver-export-main-embed {
  min-height: calc(100vh - 56px);
  grid-template-rows: minmax(calc(100vh - 56px), 1fr);
  margin-top: 0;
}

.receiver-export-main-frame {
  min-height: calc(100vh - 56px);
}

.temu-frame-wrap {
  position: relative;
  min-height: 560px;
}

.temu-frame-wrap .temu-embed-frame {
  display: block;
}

.temu-embed-campaigns,
.temu-embed-campaigns .temu-frame-wrap,
.temu-embed-campaigns .temu-embed-frame {
  min-height: calc(100vh - 44px);
}

.temu-embed-campaigns {
  margin-top: 26px;
}

.temu-embed-campaigns .temu-embed-frame {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* Locked card surface: keep structure, share the reference-like card treatment. */
:is(
  .knowledge-map-card,
  .knowledge-detail,
  .knowledge-entry-card,
  .knowledge-kb-card,
  .knowledge-recommend-card,
  .material-card,
  .material-insight-panel,
  .material-color-point,
  .attendance-request,
  .receipt-card,
  .receipt-result,
  .temu-return-action,
  .temu-return-package-card,
  .temu-return-detail-panel,
  .review-media-card,
  .review-product-radar-row,
  .review-dist-pills span,
  .review-observation-card,
  .review-psychology-grid section,
  .review-action-board section,
  .review-action-board article,
  .review-evidence-summary,
  .review-unit-list span,
  .temu-embed-frame
) {
  border-color: var(--line);
  border-radius: var(--radius-card);
  background:
    linear-gradient(180deg, rgba(246, 251, 255, 0.72), rgba(255, 255, 255, 0.95) 36%),
    var(--panel-solid);
  box-shadow: var(--shadow-soft);
}

:is(
  .knowledge-entry-card,
  .knowledge-kb-card,
  .knowledge-recommend-card,
  .material-card,
  .material-color-point,
  .attendance-request,
  .review-action-board article,
  .review-dist-pills span,
  .review-unit-list span
) {
  border-radius: var(--radius-control);
}

.hidden {
  display: none !important;
}

@media (max-width: 1280px) {
  .task-module-grid {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }
}

@media (max-width: 1100px) {
  .stats {
    grid-template-columns: repeat(3, minmax(130px, 1fr));
  }

  .performance-evidence-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cycle-board-layout,
  .cycle-columns,
  .work-report-layout,
  .work-report-card-grid,
  .daily-visual-summary,
  .daily-hub-workbench,
  .daily-hub-dashboard-grid,
  .daily-hub-summary-columns,
  .daily-hub-summary-keywords,
  .daily-hub-kpis {
    grid-template-columns: 1fr;
  }

  .work-report-queue,
  .daily-hub-side,
  .daily-hub-date-rail,
  .daily-hub-management {
    position: static;
  }

  .daily-hub-date-rail {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }

  .daily-hub-date-rail .panel-head {
    grid-column: 1 / -1;
  }

  .daily-hub-management {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .work-report-stat-strip {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }

  .cycle-visual-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .task-detail-panel,
  .task-admin-detail-panel,
  .temu-return-detail-panel {
    position: static;
  }

  .task-employee-execution-grid {
    grid-template-columns: 1fr;
  }

  .task-manager-main-grid {
    grid-template-columns: 1fr;
  }

  .temu-return-toolbar,
  .temu-return-data-strip,
  .temu-return-analysis,
  .temu-return-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .temu-return-toolbar input:first-child,
  .temu-return-wide-panel,
  .temu-return-detail-panel {
    grid-column: 1 / -1;
  }

  .receipt-workbench {
    grid-template-columns: 1fr;
  }

  .receipt-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .task-employee-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .task-admin-gantt-axis {
    padding-left: 12px;
  }

  .task-admin-gantt-tools,
  .task-gantt-filters {
    justify-content: flex-start;
  }

  .task-gantt-filters select {
    max-width: none;
    flex: 1 1 140px;
  }

  .task-assigner-gantt-axis {
    padding-left: 0;
  }

  .task-assigner-gantt-group {
    grid-template-columns: 1fr;
  }

  .task-admin-gantt-row {
    grid-template-columns: 92px minmax(100px, 1fr);
  }

  .task-admin-gantt-row .task-admin-gantt-track,
  .task-admin-gantt-row .task-priority-chip {
    grid-column: 1 / -1;
  }

  .task-assigner-gantt-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .task-assigner-gantt-row .task-admin-gantt-track {
    grid-column: 1 / -1;
  }

  .review-command-center .review-radar-panel {
    position: static;
    max-height: none;
  }

  .review-decision-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .review-product-hero {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .review-product-scores,
  .review-product-hero .primary {
    grid-column: 1 / -1;
  }

  .review-toolbar {
    grid-template-columns: 1fr;
  }

  .review-toolbar .toolbar-left {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .review-toolbar .toolbar-left button {
    justify-content: center;
  }

  .review-toolbar .toolbar-right {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

@media (max-width: 760px) {
  body {
    font-size: 13px;
  }

  .cycle-visual-grid,
  .cycle-factor-strip,
  .cycle-columns,
  .work-report-stat-strip,
  .work-report-card-grid,
  .daily-visual-summary,
  .daily-dept-summary-grid,
  .daily-person-grid,
  .daily-hub-kpis,
  .daily-hub-dashboard-grid,
  .daily-hub-dept-cards,
  .daily-hub-employee-grid,
  .daily-hub-summary-columns,
  .daily-hub-summary-keywords,
  .daily-hub-summary-depts,
  .daily-hub-review-grid {
    grid-template-columns: 1fr;
  }

  .cycle-report-head,
  .cycle-score-line,
  .cycle-report-actions,
  .work-report-head,
  .daily-hub-hero,
  .work-report-card-head,
  .work-report-score-row,
  .daily-hub-report-head,
  .daily-hub-report-body,
  .daily-hub-section-head {
    display: grid;
    justify-content: stretch;
  }

  .work-report-head-actions,
  .daily-hub-actions,
  .daily-hub-inline-actions,
  .work-report-card-actions,
  .daily-hub-report-actions,
  .work-report-tags {
    justify-content: flex-start;
  }

  .daily-submit-ring-card,
  .daily-person-body {
    grid-template-columns: 1fr;
  }

  .daily-submit-ring-card,
  .daily-person-body {
    display: grid;
  }

  .work-report-detail-hero,
  .work-report-detail-grid,
  .work-report-detail-review {
    grid-template-columns: 1fr;
  }

  .daily-comparison-head,
  .daily-dept-summary-title,
  .daily-dept-pressure {
    align-items: flex-start;
    flex-direction: column;
  }

  .daily-dept-summary-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .daily-comparison-row {
    grid-template-columns: 88px 118px 96px minmax(150px, 1fr) minmax(150px, 1fr) minmax(150px, 1fr);
    min-width: 820px;
  }

  .daily-hub-dept-row {
    grid-template-columns: 88px 104px 112px minmax(150px, 1fr) minmax(150px, 1fr) minmax(150px, 1fr);
    min-width: 820px;
  }

  .daily-report-row {
    grid-template-columns: 72px minmax(92px, 1fr) minmax(0, 1.4fr) minmax(0, 1fr);
  }

  .daily-report-row-status,
  .daily-report-row p:nth-of-type(2),
  .daily-report-row p:nth-of-type(3) {
    display: none;
  }

  .daily-report-row-actions {
    justify-content: flex-start;
  }

  .daily-hub-management {
    grid-template-columns: 1fr;
  }

  .daily-hub {
    gap: 10px;
  }

  .daily-hub-hero {
    max-width: 100%;
    padding: 12px;
  }

  .daily-hub-hero h1 {
    font-size: 22px;
    overflow-wrap: anywhere;
  }

  .daily-hub-hero p {
    overflow-wrap: anywhere;
  }

  .daily-hub-actions {
    justify-content: flex-start;
  }

  .daily-hub-actions button {
    flex: 1 1 128px;
    min-width: 0;
    justify-content: center;
  }

  .daily-hub-toolbar {
    display: grid;
    width: 100%;
    max-width: 100%;
  }

  .daily-hub-toolbar .toolbar-left {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    min-width: 0;
  }

  .daily-hub-toolbar .toolbar-left > * {
    width: 100%;
    max-width: none;
    min-width: 0;
  }

  .daily-hub-period-range {
    justify-content: flex-start;
    white-space: normal;
  }

  .daily-hub-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
  }

  .daily-hub-tabs button {
    flex: 0 0 auto;
  }

  .daily-hub-date-rail {
    grid-template-columns: 1fr;
  }

  .daily-report-day-group > header {
    display: grid;
    justify-content: stretch;
  }

  .daily-detail-drawer {
    width: 100vw;
    border-radius: 0;
  }

  .daily-hub-dept-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .production-workbench-grid,
  .production-gantt-row,
  .production-printer-card dl {
    grid-template-columns: 1fr;
  }

  .production-demand-panel,
  .production-schedule-panel,
  .production-print-panel,
  .production-audit-panel {
    grid-column: auto;
  }

  .production-panel .panel-head {
    display: grid;
  }

  .production-panel .panel-actions {
    width: 100%;
    justify-content: stretch;
  }

  .production-panel .panel-actions button {
    flex: 1 1 130px;
  }

  .production-printer-form {
    grid-template-columns: 1fr;
  }

  .production-preview-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .task-module-grid {
    grid-template-columns: 1fr;
  }

  .task-employee-workspace-head,
  .task-manager-workspace-head,
  .task-employee-current-top,
  .task-employee-section-head,
  .task-employee-action-heading,
  .task-manager-section-head {
    align-items: stretch;
    flex-direction: column;
  }

  .task-workspace-switch {
    width: 100%;
  }

  .task-workspace-switch button {
    flex: 1 1 0;
  }

  .task-employee-summary-grid {
    grid-template-columns: 1fr;
  }

  .task-employee-deadline {
    width: fit-content;
  }

  .task-manager-signal-grid {
    grid-template-columns: 1fr;
  }

  .task-manager-intervention-row {
    grid-template-columns: 1fr;
  }

  .task-manager-intervention-deadline {
    order: 1;
  }

  .task-manager-intervention-actions {
    order: 2;
    width: 100%;
  }

  .task-suggestion-inbox {
    width: 100vw;
    max-height: 100vh;
    border-radius: 0;
  }

  .task-suggestion-inbox-toolbar,
  .task-suggestion-inbox-row {
    align-items: stretch;
    flex-direction: column;
  }

  .task-suggestion-inbox-toolbar > div,
  .task-suggestion-inbox-actions {
    justify-content: flex-start;
  }

  .task-suggestion-inbox-note {
    width: 100%;
  }

  .temu-return-toolbar,
  .temu-return-data-strip,
  .temu-return-analysis,
  .temu-return-layout {
    grid-template-columns: 1fr;
  }

  .temu-return-toolbar input:first-child,
  .temu-return-wide-panel,
  .temu-return-detail-panel {
    grid-column: auto;
  }

  .temu-return-action-insights,
  .temu-return-action-queue {
    grid-template-columns: 1fr;
  }

  .task-employee-kpi-grid,
  .task-assigner-group-grid {
    grid-template-columns: 1fr;
  }

  .task-employee-head,
  .task-workbench-card-top,
  .task-workbench-card-foot,
  .task-workbench-card-meta {
    align-items: stretch;
    flex-direction: column;
  }

  .task-employee-head .task-list-actions {
    width: 100%;
    justify-content: stretch;
  }

  .task-employee-head .task-list-actions button {
    flex: 1 1 130px;
  }

  .task-assigner-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .task-assigner-archive-card {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .task-assigner-archive-card b {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .task-review-assignee,
  .task-review-critical {
    grid-template-columns: 1fr;
  }

  .task-admin-filters,
  .task-admin-task-row {
    grid-template-columns: 1fr;
  }

  .task-review-critical small {
    justify-content: flex-start;
  }

  .review-decision-rail,
  .review-media-card,
  .performance-evidence-grid,
  .performance-self-kpis,
  .performance-draft-grid {
    grid-template-columns: 1fr;
  }

  .performance-self-hero,
  .performance-section-head,
  .performance-self-kpi > div,
  .performance-self-kpi p,
  .performance-action > div {
    align-items: stretch;
    flex-direction: column;
  }

  .review-toolbar .toolbar-left {
    grid-template-columns: 1fr;
  }

  .review-product-hero {
    grid-template-columns: 56px minmax(0, 1fr);
    padding: 12px;
  }

  .review-product-cover {
    width: 56px;
    height: 56px;
  }

  .page-hero {
    min-height: 0;
    padding: 16px;
  }

  .page-hero-copy h2 {
    font-size: 24px;
  }

  .page-hero-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-hero-product_publish_workbench {
    grid-template-columns: 1fr;
  }

  .page-hero-product_publish_workbench .page-hero-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  button {
    min-height: 30px;
    padding: 0 8px;
  }

  button.icon {
    width: 30px;
  }

  input,
  textarea,
  select {
    padding: 6px 8px;
  }

  .receipt-hero {
    grid-template-columns: 1fr;
    align-items: stretch;
    padding: 12px;
  }

  .receipt-hero h2 {
    font-size: 22px;
  }

  .task-kpis.receipt-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .receipt-kpis div {
    padding: 9px 10px;
  }

  .receipt-kpis strong {
    font-size: 19px;
  }

  .receipt-workbench,
  .receipt-toolbar,
  .receipt-inline-form,
  .receipt-result,
  .receipt-card {
    grid-template-columns: 1fr;
  }

  .receipt-toolbar,
  .receipt-inline-form {
    padding: 10px;
  }

  .receipt-inline-form {
    margin-top: 10px;
  }

  .receipt-scan-head {
    display: grid;
    justify-content: stretch;
  }

  .receipt-scan-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .receipt-scan-actions button {
    width: 100%;
    justify-content: center;
  }

  .receipt-scan-video {
    max-height: 300px;
  }

  .receipt-inline-form button {
    width: 100%;
    justify-content: center;
  }

  .receipt-result {
    gap: 10px;
    padding: 10px;
  }

  .receipt-result-media {
    min-height: 160px;
  }

  .receipt-result-media img {
    max-height: 240px;
    object-fit: contain;
    background: #fff;
  }

  .receipt-list {
    padding: 10px;
  }

  .receipt-card {
    gap: 8px;
    padding: 10px;
  }

  .receipt-card-side {
    justify-items: start;
    text-align: left;
  }

  .receipt-result strong {
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .sidebar-nav-manager {
    grid-template-columns: 1fr;
  }

  .sidebar-nav-preview {
    height: auto;
    min-height: 260px;
    max-height: 360px;
  }

  .sidebar-nav-edit-group-head {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .sidebar-nav-move-actions {
    justify-content: flex-end;
  }

  .sidebar-nav-module-row {
    grid-template-columns: 34px minmax(0, 1fr) 28px 28px;
  }

  .sidebar-nav-module-row select {
    grid-column: 2 / -1;
  }

  .sidebar-nav-savebar {
    align-items: stretch;
    flex-direction: column;
  }

  th,
  td {
    padding: 6px 8px;
  }

  .modal-backdrop {
    padding: 8px;
    place-items: start center;
  }

  .modal {
    width: 100%;
    max-height: calc(100dvh - 16px);
  }

  .skc-group-modal {
    height: calc(100dvh - 16px);
  }

  .modal-head,
  .modal-foot {
    min-height: 46px;
    padding: 8px 10px;
  }

  .modal-body {
    padding: 8px;
  }

  .product-editor {
    gap: 8px;
  }

  .skc-style-toolbar {
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
  }

  .skc-style-actions {
    justify-content: space-between;
  }

  .skc-variant-workbench {
    grid-template-columns: 1fr;
    padding: 8px;
  }

  .skc-pane-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .skc-section-title {
    align-items: flex-start;
  }

  .skc-group-image-head {
    align-items: stretch;
    flex-direction: column;
    gap: 7px;
  }

  .skc-defaults-pane .product-form-grid {
    grid-template-columns: 1fr;
  }

  .skc-upload-compact {
    grid-template-columns: 1fr;
  }

  .skc-sku-table-wrap {
    padding: 6px;
  }

  .skc-style-card-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .skc-style-block-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .skc-style-grid {
    grid-template-columns: 1fr;
  }

  .skc-style-grid .wide,
  .skc-style-grid .full {
    grid-column: auto;
  }

  .product-section-head,
  .model-panel-head {
    align-items: stretch;
    flex-direction: column;
    gap: 6px;
  }

  .product-section-head h3,
  .model-panel-head h3 {
    line-height: 1.25;
  }

  .model-upload {
    justify-content: flex-start;
  }

  .model-link-input {
    width: 100%;
    min-width: 0;
  }

  .model-upload span {
    line-height: 1.35;
  }

  .attachment-drop {
    align-items: stretch;
    flex-direction: column;
  }

  .attachment-actions {
    width: 100%;
  }

  .attachment-actions button,
  .attachment-actions a {
    width: 100%;
    justify-content: center;
  }

  .pending-image-row {
    grid-template-columns: minmax(0, 1fr) auto auto;
  }

  .login-shell,
  .app-shell {
    grid-template-columns: 1fr;
  }

  .app-shell {
    min-height: 100dvh;
    grid-template-rows: 92px minmax(0, 1fr);
  }

  .app-shell.sidebar-editing {
    grid-template-rows: 132px minmax(0, 1fr);
  }

  .login-aside {
    display: none;
  }

  .sidebar {
    height: 92px;
    min-height: 0;
    max-height: none;
    overflow: hidden;
  }

  .sidebar-editing .sidebar {
    height: 132px;
  }

  .content {
    min-height: 0;
  }

  .brand {
    min-height: 34px;
    padding: 7px 10px 5px;
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .brand strong {
    font-size: 15px;
  }

  .brand span {
    display: none;
  }

  .sidebar-collapse-btn {
    display: none;
  }

  .sidebar-edit-toggle {
    min-height: 26px;
    padding: 0 7px;
  }

  .sidebar-editbar {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
  }

  .sidebar-editbar span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .sidebar-editbar > div {
    flex: 0 0 auto;
  }

  .sidebar-editbar button {
    min-height: 26px;
    padding: 0 7px;
  }

  .nav {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 5px 8px 8px;
  }

  .nav::-webkit-scrollbar {
    display: none;
  }

  .nav-group {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
  }

  .nav .nav-title {
    display: flex;
    min-height: 30px;
    padding: 0 8px;
    border-color: rgba(148, 163, 184, 0.24);
    background: rgba(255, 255, 255, 0.62);
  }

  .nav-items,
  .nav-group.collapsed .nav-items {
    display: none;
  }

  .nav-group.expanded .nav-items {
    display: flex;
    align-items: center;
    gap: 4px;
  }

  .nav button {
    width: auto;
    min-height: 30px;
    padding: 0 8px;
    gap: 5px;
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .nav .mark {
    width: 28px;
    height: 16px;
    font-size: 9px;
  }

  .sidebar-foot {
    display: none;
  }

  .topbar,
  .toolbar {
    height: auto;
    padding: 8px;
  }

  .topbar {
    min-height: 48px;
    align-items: center;
    flex-direction: row;
    gap: 8px;
  }

  .topbar h1 {
    font-size: 18px;
  }

  .topbar p {
    display: none;
  }

  .topbar-actions {
    flex: 0 0 auto;
  }

  .toolbar {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
  }

  .toolbar-left,
  .toolbar-right {
    width: auto;
  }

  .toolbar-left {
    flex: 1 1 100%;
  }

  .toolbar-right {
    margin-left: auto;
  }

  .search {
    width: 100%;
  }

  .filter-bar select,
  .filter-bar button {
    flex: 1 1 130px;
    max-width: none;
  }

  .material-science-shell {
    grid-template-columns: 1fr;
    padding-bottom: 12px;
  }

  .material-color-map {
    display: grid;
    grid-template-columns: 1fr;
    min-width: 0;
  }

  .material-map-axis:not(.lightness-label) {
    display: none;
  }

  .lightness-label {
    min-height: 30px;
    position: sticky;
    top: 0;
    z-index: 1;
  }

  .material-map-cell {
    min-height: 0;
  }

  .material-color-point {
    width: calc(50% - 3px);
  }

  .material-insight-panel {
    position: static;
  }

  .material-gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .material-compare-tray {
    margin-bottom: 10px;
  }

  .attendance-kpis,
  .attendance-shortcut-groups,
  .attendance-request {
    grid-template-columns: 1fr;
  }

  .attendance-shortcut-actions {
    grid-template-columns: 1fr;
  }

  .attendance-request-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .main {
    padding: 8px;
  }

  .stats,
  .status-list,
  .ha-form-grid,
  .ha-check-grid,
  .ha-scope-grid,
  .ha-result-grid,
  .ha-realtime-kpis,
  .ha-realtime-grid,
  .product-image-grid,
  .model-summary,
  .auto-metrics,
  .product-form-grid,
  .task-create-grid,
  .accessory-grid,
  .task-metric-list,
  .form-grid,
  .permission-grid,
  .preview-metrics,
  .role-preview-modules {
    grid-template-columns: 1fr;
  }

  .task-kpis {
    grid-template-columns: repeat(auto-fit, minmax(84px, 1fr));
  }

  .task-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .auto-metrics,
  .model-summary,
  .product-form-grid,
  .accessory-grid,
  .product-image-grid,
  .pending-image-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .field.wide {
    grid-column: 1 / -1;
  }

  .page-hero-kpis {
    grid-template-columns: 1fr;
  }

  .permission-toolbar {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .role-editor-modal {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
  }

  .permission-search,
  .permission-type-select,
  .permission-toolbar > button {
    flex: 1 1 100%;
    width: 100%;
    min-width: 0;
  }

  .permission-search input,
  .permission-type-select select,
  .permission-toolbar > button {
    min-height: 32px;
  }

  .permission-toolbar div {
    width: 100%;
    margin-right: 0;
  }

  .ha-connect-actions button {
    flex: 1 1 150px;
  }

  .ha-realtime-panel .panel-head {
    display: grid;
    gap: 10px;
  }

  .ha-realtime-actions {
    justify-content: flex-start;
  }

  .ha-realtime-actions button {
    flex: 1 1 120px;
  }
}

@media (max-width: 820px) {
  .production-screen-shell {
    height: auto;
    min-height: 0;
    grid-template-columns: 1fr;
    grid-template-rows: none;
    overflow: visible;
  }

  .production-screen-main,
  .production-screen-orders-panel,
  .production-screen-side-panel,
  .production-screen-handoff-panel {
    grid-column: 1 / -1;
    grid-row: auto;
    overflow: visible;
  }

  .production-screen-flow {
    grid-auto-flow: row;
    grid-auto-columns: initial;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow-x: visible;
  }

  .production-screen-side-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .production-screen-order-list,
  .production-screen-record-list {
    max-height: none;
    overflow: visible;
  }
}

@media (max-width: 760px) {
  .page-hero-home_assistant {
    grid-template-columns: 1fr;
  }

  .production-screen-shell {
    gap: 10px;
  }

  .production-screen-main > .panel-head {
    grid-template-columns: 1fr;
  }

  .production-screen-main .ha-realtime-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
    overflow-x: visible;
  }

  .production-screen-main .ha-realtime-actions button {
    flex: 1 1 118px;
    min-height: 44px;
  }

  .production-screen-time-filters {
    grid-template-columns: 1fr 1fr;
  }

  .production-screen-time-filters label:first-child {
    grid-column: 1 / -1;
  }

  .production-screen-kpis,
  .production-screen-flow,
  .production-screen-side-grid,
  .production-screen-handoff-grid {
    grid-template-columns: 1fr;
  }

  .production-screen-order-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .production-screen-flow-item {
    min-height: 74px;
  }

  .production-screen-side-grid,
  .production-screen-handoff-grid,
  .production-screen-order-list {
    padding: 10px;
  }

  .production-screen-record-list {
    max-height: none;
  }

  .production-screen-decision-filters {
    grid-template-columns: 1fr 1fr;
  }

  .production-screen-decision-filters .wide,
  .production-screen-decision-filters > strong,
  .production-screen-decision-filters button {
    grid-column: 1 / -1;
  }

  .production-screen-decision-pager {
    align-items: stretch;
    flex-direction: column;
  }

  .production-screen-decision-pager > div {
    justify-content: space-between;
  }

  .production-screen-decision-table-wrap {
    max-height: none;
    overflow-x: auto;
    overflow-y: visible;
  }
}

#app .task-workspace button,
#app .task-workspace select,
#app .task-workspace .task-link-button {
  min-height: 40px;
}

#app .task-workspace button:focus-visible,
#app .task-workspace select:focus-visible,
#app .task-workspace textarea:focus-visible,
#app .task-workspace [tabindex]:focus-visible {
  outline: 3px solid rgba(42, 105, 151, 0.32);
  outline-offset: 2px;
}

@media (max-width: 1100px) {
  .task-layout,
  .task-assigner-layout,
  .task-admin-workbench {
    grid-template-columns: 1fr;
  }

  .task-manager-main-grid,
  .task-employee-main-grid,
  .task-employee-execution-grid {
    grid-template-columns: 1fr;
  }

  .task-detail-panel {
    position: static;
  }
}

@media (max-width: 760px) {
  .task-workspace-switch,
  .task-manager-signals,
  .task-manager-signal-grid,
  .task-department-summary,
  .task-manager-department-list {
    grid-template-columns: 1fr;
  }

  .task-workspace-switch {
    display: grid;
  }

  .task-detail-panel,
  .task-current-card,
  .task-employee-current,
  .task-intervention-row,
  .task-manager-intervention-row {
    width: 100%;
    min-width: 0;
  }

  .task-employee-current h3,
  .task-employee-next-row strong,
  .task-manager-intervention-main > strong {
    overflow-wrap: anywhere;
    white-space: normal;
  }
}

@media (max-width: 480px) {
  .task-detail-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
}

@media (max-width: 760px) {
}

@media (max-width: 1180px) {
}

@media (min-width: 1500px) {
}

.notification-workspace {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

.notification-topbar {
  display: grid;
  grid-template-columns: minmax(260px, max-content) minmax(220px, 1fr) max-content;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
}

.notification-tabs {
  min-width: 0;
}

.notification-table-wrap table {
  min-width: 980px;
}

.notification-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 9px;
  border: 1px solid #d6dde3;
  border-radius: 6px;
  background: #f6f8fa;
  color: #4b5563;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

.notification-tag.success {
  border-color: #b8dec4;
  background: #eef8f0;
  color: #25723e;
}

.notification-tag.warning {
  border-color: #efd194;
  background: #fff8e8;
  color: #8a5b00;
}

.notification-tag.danger {
  border-color: #f0b8b8;
  background: #fff0f0;
  color: #a83232;
}

.notification-checks > div {
  display: flex;
  min-height: 40px;
  gap: 14px;
  align-items: center;
  flex-wrap: wrap;
}

.notification-checks label {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  margin: 0;
  font-weight: 500;
}

.notification-modal {
  width: min(940px, calc(100vw - 28px));
}

.notification-preview-modal {
  width: min(1040px, calc(100vw - 28px));
}

.notification-preview-result {
  margin-top: 14px;
}

.notification-preview-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.85fr) minmax(260px, 1fr) minmax(260px, 1fr);
  gap: 12px;
}

.notification-preview-grid section {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
}

.notification-preview-grid h3 {
  margin: 0 0 8px;
  font-size: 15px;
}

.notification-preview-grid p {
  margin: 0;
  color: #4b5563;
  line-height: 1.6;
  white-space: pre-wrap;
}

.notification-json {
  max-height: 340px;
  min-height: 120px;
  margin: 0;
  overflow: auto;
  padding: 10px;
  border-radius: 6px;
  background: #16202a;
  color: #eaf0f5;
  font-size: 12px;
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

@media (max-width: 980px) {
  .notification-topbar {
    grid-template-columns: 1fr;
  }

  .notification-topbar .toolbar-left,
  .notification-topbar .toolbar-right {
    width: 100%;
  }

  .notification-preview-grid {
    grid-template-columns: 1fr;
  }

  .review-toolbar {
    grid-template-columns: 1fr;
  }

  .review-toolbar .toolbar-left {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .review-toolbar .toolbar-left button {
    justify-self: start;
  }

  .review-toolbar .toolbar-right {
    justify-content: flex-start;
  }

  .review-detail-filterbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .review-detail-filterbar input {
    grid-column: 1 / -1;
  }

  .review-detail-time-board {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  }

  .review-detail-time-section {
    min-width: 0;
  }

  .review-detail-star-board {
    grid-template-columns: repeat(5, minmax(160px, 1fr));
    min-width: 880px;
  }
}

@media (max-width: 760px) {
  .main {
    padding: 12px 8px 18px;
  }

  .page-hero-review_dashboard {
    grid-template-columns: 96px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 0;
    padding: 8px 10px;
  }

  .page-hero-review_dashboard .page-hero-copy span {
    font-size: 11px;
  }

  .page-hero-review_dashboard .page-hero-copy h2 {
    margin-top: 1px;
    font-size: 18px;
    line-height: 1.08;
  }

  .page-hero-review_dashboard .page-hero-kpis {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 4px;
  }

  .page-hero-review_dashboard .page-hero-kpis div {
    min-height: 40px;
    padding: 4px 5px;
    border-radius: 6px;
  }

  .page-hero-review_dashboard .page-hero-kpis span {
    font-size: 10px;
    line-height: 1.1;
  }

  .page-hero-review_dashboard .page-hero-kpis strong {
    margin-top: 2px;
    font-size: 14px;
  }

  .review-toolbar {
    gap: 7px;
    margin: 7px 0;
    padding: 7px;
  }

  .review-toolbar .toolbar-left {
    grid-template-columns: 88px 88px 78px 104px 104px 58px;
    gap: 6px;
    overflow-x: auto;
  }

  .review-toolbar .toolbar-right {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    justify-content: flex-start;
    gap: 6px;
    overflow-x: auto;
  }

  .review-toolbar .toolbar-right button,
  .review-toolbar .toolbar-left button {
    min-width: 58px;
    height: 30px;
    padding: 0 8px;
    font-size: 12px;
  }

  .review-toolbar select,
  .review-toolbar input {
    height: 30px;
    padding: 5px 7px;
    font-size: 12px;
  }

  .review-toolbar + .notice {
    margin-bottom: 7px;
    padding: 6px 8px;
    font-size: 12px;
  }

  .review-detail-panel .panel-head {
    align-items: center;
    gap: 8px;
    min-height: 38px;
  }

  .review-detail-head-actions {
    flex: 0 0 auto;
  }

  .review-detail-filterbar {
    grid-template-columns: 76px 118px 118px 150px 78px 82px 104px 112px 56px 56px;
    gap: 6px;
    overflow-x: auto;
  }

  .review-detail-filterbar button {
    min-width: 56px;
    width: 100%;
    height: 30px;
    padding: 0 8px;
    font-size: 12px;
  }

  .review-detail-filterbar input,
  .review-detail-filterbar select {
    grid-column: auto;
    height: 30px;
    padding: 5px 7px;
    font-size: 12px;
  }

  .review-detail-time-board {
    grid-template-columns: 760px;
    max-height: min(480px, calc(100vh - 250px));
    overflow-x: auto;
  }

  .review-detail-time-section {
    min-width: 0;
  }

  .review-detail-star-board {
    grid-template-columns: repeat(5, minmax(154px, 1fr));
    min-width: 820px;
    height: clamp(300px, calc(100vh - 250px), 480px);
  }

  .review-detail-star-section {
    min-width: 0;
  }

  .review-detail-modal-grid {
    grid-template-columns: 1fr;
  }

  .sku-pagination.review-detail-pagination {
    align-items: stretch;
    flex-direction: column;
  }

  .review-command-center {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 430px) {
  .page-hero-review_dashboard {
    grid-template-columns: 1fr;
  }

  .page-hero-review_dashboard .page-hero-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .review-detail-filterbar input {
    grid-column: auto;
  }
}

.finance-page {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.finance-hero {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-end;
  padding: 20px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: linear-gradient(135deg, #f8fbfc 0%, #eef5f1 52%, #f9f3ea 100%);
}

.finance-hero span,
.finance-hero small,
.finance-panel .panel-head span {
  color: #5b6673;
  font-size: 12px;
}

.finance-hero h1 {
  margin: 4px 0 0;
  font-size: 28px;
  letter-spacing: 0;
}

.finance-hero-state {
  min-width: 126px;
  padding: 10px 12px;
  border: 1px solid rgba(32, 45, 57, 0.12);
  border-radius: 8px;
  background: #fff;
  text-align: right;
}

.finance-hero-state b {
  display: block;
  color: #1f8a5b;
}

.finance-hero-state.warn b {
  color: #c84630;
}

.finance-filterbar {
  display: grid;
  grid-template-columns: repeat(9, minmax(104px, 1fr)) auto auto;
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
}

.finance-filterbar label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #4b5563;
  font-size: 12px;
  font-weight: 600;
}

.finance-filterbar input,
.finance-filterbar select,
.finance-import-box input {
  min-width: 0;
  height: 34px;
  padding: 0 9px;
  border: 1px solid #d6dde3;
  border-radius: 6px;
  background: #fff;
  color: #202d39;
}

.finance-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 12px;
}

.finance-kpi {
  min-height: 118px;
  padding: 14px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.finance-kpi:hover,
.finance-kpi.active {
  border-color: rgba(37, 91, 143, 0.38);
  box-shadow: 0 8px 22px rgba(32, 45, 57, 0.08);
}

.finance-kpi.active {
  background: #f5f9fc;
}

.finance-kpi span {
  display: block;
  color: #5b6673;
  font-size: 12px;
}

.finance-kpi strong {
  display: block;
  margin-top: 6px;
  font-size: 23px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.finance-kpi em {
  display: block;
  margin-top: 6px;
  color: #5b6673;
  font-size: 11px;
  font-style: normal;
}

.finance-sparkline {
  width: 100%;
  height: 34px;
  margin-top: 8px;
}

.finance-kpi-drilldown {
  display: grid;
  gap: 8px;
}

.finance-kpi-drill-grid {
  display: grid;
  grid-template-columns: minmax(320px, 0.8fr) minmax(0, 1.2fr);
  gap: 10px;
  min-width: 0;
}

.finance-kpi-daily {
  overflow: auto;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
}

.finance-kpi-daily table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  font-size: 12px;
}

.finance-kpi-daily th,
.finance-kpi-daily td {
  padding: 7px 8px;
  border-bottom: 1px solid rgba(32, 45, 57, 0.08);
  text-align: right;
  white-space: nowrap;
}

.finance-kpi-daily th:first-child,
.finance-kpi-daily td:first-child {
  text-align: left;
}

.finance-kpi-daily tr {
  cursor: pointer;
}

.finance-kpi-daily tbody tr:hover {
  background: #f5f9fc;
}

.finance-panel .panel-head.compact {
  margin-bottom: 6px;
}

.finance-kpi-modal {
  width: min(1180px, calc(100vw - 28px));
  max-height: min(820px, calc(100dvh - 28px));
}

.finance-kpi-modal .modal-body {
  display: grid;
  gap: 10px;
  overflow: auto;
  padding: 12px;
}

.finance-kpi-modal-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.finance-kpi-modal-summary article,
.finance-kpi-modal-card {
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
}

.finance-kpi-modal-summary span {
  display: block;
  color: #5b6673;
  font-size: 11px;
}

.finance-kpi-modal-summary strong {
  display: block;
  margin-top: 4px;
  overflow: hidden;
  color: #202d39;
  font-size: 17px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-kpi-modal-grid {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
  gap: 10px;
  min-width: 0;
}

.finance-kpi-modal-card.wide {
  grid-column: 1 / -1;
}

.finance-kpi-modal-card h3,
.finance-kpi-modal-head h3 {
  margin: 0 0 8px;
  color: #202d39;
  font-size: 14px;
}

.finance-kpi-modal-card.muted {
  background: #f8fafb;
}

.finance-kpi-modal-head {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.finance-kpi-modal-head h3 {
  margin: 0;
}

.finance-kpi-modal-head.compact {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(32, 45, 57, 0.08);
}

.finance-kpi-modal-head span {
  color: #5b6673;
  font-size: 11px;
}

.finance-kpi-daily.compact {
  max-height: 330px;
}

.finance-sparkline path,
.finance-sparkline polyline {
  fill: none;
  stroke: #255b8f;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.finance-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 4px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #f6f8fa;
}

.finance-tabs button,
.segmented.mini button {
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #4b5563;
  white-space: nowrap;
}

.finance-tabs button.active,
.segmented.mini button.active {
  background: #fff;
  color: #202d39;
  box-shadow: 0 1px 3px rgba(32, 45, 57, 0.12);
}

.finance-layout-2 {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.85fr);
  gap: 14px;
}

.finance-panel {
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
}

.finance-panel .panel-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 10px;
}

.finance-panel .panel-head h2 {
  margin: 0;
  font-size: 16px;
}

.finance-panel-head-stack {
  align-items: flex-start;
}

.finance-panel-head-stack > div:first-child {
  min-width: 240px;
}

.finance-sku-metric-tabs {
  flex: 0 0 auto;
  align-self: flex-start;
}

.finance-chart-svg {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 220px;
}

.finance-chart-scroll {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 4px;
}

.finance-chart-scroll::after {
  display: block;
  margin-top: 2px;
  color: #7b8794;
  content: "共 " attr(data-points) " 个日点，横向滚动查看全部";
  font-size: 10px;
  text-align: right;
}

.finance-chart-scroll.compact {
  padding-bottom: 0;
}

.finance-chart-scroll.compact::after {
  content: attr(data-points) " 个日点";
}

.finance-chart-scroll .finance-chart-svg {
  width: auto;
  max-width: none;
}

.finance-chart-svg .axis {
  stroke: #cbd5df;
  stroke-width: 1;
}

.finance-trend-snapshot {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 8px;
}

.finance-trend-snapshot button {
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #f8fafb;
  text-align: left;
}

.finance-trend-snapshot button.good {
  border-color: rgba(31, 138, 91, 0.22);
  background: #f0f8f3;
}

.finance-trend-snapshot button.bad {
  border-color: rgba(200, 70, 48, 0.22);
  background: #fff4f1;
}

.finance-trend-snapshot span {
  display: block;
  color: #5b6673;
  font-size: 11px;
}

.finance-trend-snapshot strong {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: #202d39;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-trend-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 4px;
  color: #5b6673;
  font-size: 12px;
}

.finance-trend-legend span {
  display: inline-flex;
  gap: 5px;
  align-items: center;
}

.finance-trend-legend i {
  width: 10px;
  height: 10px;
  border-radius: 999px;
}

.finance-trend-legend .settlement {
  background: #1f8a5b;
}

.finance-trend-legend .expense {
  background: #c84630;
}

.finance-trend-legend .withdrawal {
  background: #255b8f;
}

.finance-trend-legend .operating {
  background: #b8771a;
}

.finance-trend-legend em {
  margin-left: auto;
  font-style: normal;
}

.finance-chart-svg text {
  fill: #4b5563;
  font-size: 11px;
}

.finance-waterfall rect,
.finance-trend rect,
.finance-trend .operating-point,
.finance-pareto rect {
  cursor: pointer;
}

.finance-trend .grid {
  stroke: rgba(32, 45, 57, 0.05);
  stroke-width: 1;
}

.finance-trend .grid.major {
  stroke: rgba(32, 45, 57, 0.1);
}

.finance-waterfall rect.positive,
.finance-trend .settlement {
  fill: #1f8a5b;
}

.finance-waterfall rect.negative,
.finance-trend .expense {
  fill: #c84630;
}

.finance-waterfall rect.total,
.finance-trend .withdrawal {
  fill: #255b8f;
}

.finance-trend .operating-line,
.finance-pareto .pareto-line {
  fill: none;
  stroke: #b8771a;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.finance-trend .operating-point {
  fill: #fff;
  stroke: #b8771a;
  stroke-width: 2.2;
}

.finance-trend .operating-point.negative {
  stroke: #c84630;
}

.finance-trend [data-finance-modal-date].active,
.finance-trend [data-finance-modal-range].active,
.finance-mini-trend [data-finance-modal-date].active,
.finance-mini-trend [data-finance-modal-range].active {
  opacity: 1;
  outline: 2px solid #202d39;
  outline-offset: 2px;
}

.finance-kpi-daily tr.active {
  background: #eef6ff;
  box-shadow: inset 3px 0 0 #255b8f;
}

.finance-grain-controls {
  display: inline-flex;
  gap: 4px;
  padding: 3px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #f6f8fa;
}

.finance-grain-controls button {
  padding: 5px 9px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #5b6673;
  font-size: 12px;
}

.finance-grain-controls button.active {
  background: #fff;
  color: #202d39;
  box-shadow: 0 1px 3px rgba(32, 45, 57, 0.13);
}

.finance-trend .context-series {
  opacity: 0.46;
}

.finance-trend .focus-series {
  opacity: 1;
}

.finance-metric-matrix {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.finance-metric-matrix article {
  min-width: 0;
  padding: 9px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #f8fafb;
}

.finance-metric-matrix article.active {
  border-color: color-mix(in srgb, var(--metric-color) 46%, #d8e1ea);
  background: #fff;
  box-shadow: inset 3px 0 0 var(--metric-color);
}

.finance-metric-head {
  display: flex;
  gap: 8px;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 4px;
}

.finance-metric-head span {
  color: #5b6673;
  font-size: 11px;
  font-weight: 700;
}

.finance-metric-head strong {
  overflow: hidden;
  color: #202d39;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-mini-trend {
  min-height: 92px;
}

.finance-mini-trend rect {
  cursor: pointer;
  opacity: 0.78;
}

.finance-mini-trend rect:hover {
  opacity: 1;
}

.finance-mini-trend polyline {
  fill: none;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.finance-metric-matrix button {
  width: 100%;
  margin-top: 4px;
  overflow: hidden;
  padding: 5px 6px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 6px;
  background: #fff;
  color: #5b6673;
  font-size: 11px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-metric-matrix button:hover {
  border-color: rgba(37, 91, 143, 0.28);
  color: #255b8f;
}

.cost-workbench-shell {
  display: grid;
  gap: 12px;
}

.cost-workbench-cards {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.cost-workbench-cards article {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
}

.cost-workbench-cards span {
  display: block;
  color: #5b6673;
  font-size: 12px;
}

.cost-workbench-cards strong {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  color: #202d39;
  font-size: 20px;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cost-workbench-cards small {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  color: #7b8794;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cost-workbench-toolbar {
  align-items: center;
}

.cost-period-chip {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 0 10px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 999px;
  background: #fff;
  color: #4b5563;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.cost-workbench-table-panel {
  min-width: 0;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.cost-workbench-table-wrap {
  max-height: calc(100vh - 330px);
  min-height: 360px;
}

.cost-workbench-table {
  min-width: 1380px;
}

.cost-workbench-table .trend-col {
  width: 210px;
  min-width: 210px;
}

.cost-workbench-table .roi-col {
  width: 210px;
  min-width: 210px;
}

.cost-sku-cell,
.cost-money-cell,
.cost-status-stack,
.cost-roi-editor {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.cost-sku-cell strong,
.cost-money-cell strong {
  overflow: hidden;
  color: #202d39;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cost-sku-cell span,
.cost-money-cell span {
  overflow: hidden;
  color: #5b6673;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cost-sku-cell small,
.cost-money-cell small {
  overflow: hidden;
  color: #7b8794;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cost-money-cell.negative strong,
.cost-money-cell.negative span {
  color: #c84630;
}

.cost-price-trend {
  display: block;
  width: 180px;
  height: 56px;
}

.cost-price-trend polyline {
  fill: none;
  stroke: #255b8f;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cost-price-trend circle {
  fill: #fff;
  stroke: #1f8a5b;
  stroke-width: 1.8;
}

.cost-price-trend text {
  fill: #7b8794;
  font-size: 9px;
}

.cost-trend-empty {
  display: grid;
  width: 180px;
  height: 56px;
  place-items: center;
  border: 1px dashed rgba(32, 45, 57, 0.18);
  border-radius: 6px;
  color: #7b8794;
  font-size: 11px;
}

.cost-roi-editor {
  grid-template-columns: 70px minmax(0, 1fr) 44px;
  align-items: center;
}

.cost-roi-editor input {
  min-width: 0;
  height: 28px;
  padding: 0 7px;
  border: 1px solid #d6dde3;
  border-radius: 6px;
  background: #fff;
  color: #202d39;
  font-size: 12px;
}

.cost-roi-editor button {
  min-height: 28px;
  padding: 0 8px;
  border-radius: 6px;
  font-size: 12px;
  white-space: nowrap;
}

.cost-status-stack {
  align-content: start;
}

.cost-workbench-pager {
  margin-top: -2px;
}

@media (max-width: 980px) {
  .cost-workbench-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cost-workbench-toolbar {
    grid-template-columns: 1fr;
  }
}

.finance-day-detail {
  background: #fbfdff;
}

.finance-day-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.finance-day-kpis article {
  min-width: 0;
  padding: 9px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
}

.finance-day-kpis span {
  display: block;
  color: #5b6673;
  font-size: 11px;
}

.finance-day-kpis strong {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: #202d39;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-day-detail-grid {
  display: grid;
  grid-template-columns: minmax(260px, 0.42fr) minmax(0, 1fr);
  gap: 10px;
}

.finance-day-detail-grid section {
  min-width: 0;
}

.finance-day-detail-grid h4 {
  margin: 0 0 6px;
  color: #202d39;
  font-size: 13px;
}

.finance-day-breakdown {
  display: grid;
  gap: 6px;
}

.finance-day-breakdown div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  padding: 8px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
}

.finance-day-breakdown span {
  overflow: hidden;
  color: #202d39;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-day-breakdown strong {
  color: #202d39;
  font-size: 12px;
}

.finance-day-breakdown em {
  grid-column: 1 / -1;
  color: #7b8794;
  font-size: 11px;
  font-style: normal;
}

.finance-day-breakdown p {
  margin: 0;
  padding: 10px;
  border: 1px dashed rgba(32, 45, 57, 0.18);
  border-radius: 8px;
  color: #7b8794;
  font-size: 12px;
}

.finance-heatmap rect {
  cursor: pointer;
  stroke: rgba(32, 45, 57, 0.08);
}

.finance-pareto rect {
  fill: #255b8f;
}

.finance-donut-wrap {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 12px;
  align-items: center;
}

.finance-donut {
  width: 190px;
  height: 190px;
  transform: rotate(-90deg);
}

.finance-donut text {
  transform: rotate(90deg);
  transform-origin: center;
  fill: #202d39;
}

.finance-donut .donut-bg,
.finance-donut .donut-segment {
  fill: none;
  stroke-width: 18;
}

.finance-donut .donut-bg {
  stroke: #e8edf2;
}

.finance-donut .donut-total {
  font-size: 20px;
  font-weight: 700;
}

.finance-donut .donut-caption {
  font-size: 11px;
  fill: #5b6673;
}

.finance-donut-legend,
.finance-risk-grid,
.finance-mini-stats,
.finance-day-grid,
.finance-rank-list,
.finance-recon-grid,
.finance-coverage-summary,
.finance-import-box {
  display: grid;
  gap: 8px;
}

.finance-donut-legend {
  font-size: 12px;
}

.finance-donut-legend span {
  display: flex;
  gap: 7px;
  align-items: center;
  min-width: 0;
}

.finance-donut-legend i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: 0 0 auto;
}

.finance-risk-grid article,
.finance-mini-stats div {
  padding: 10px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #f8fbfc;
}

.finance-risk-grid article.danger {
  border-color: rgba(200, 70, 48, 0.35);
  background: #fff4f1;
}

.finance-risk-grid article.warning {
  border-color: rgba(184, 119, 26, 0.35);
  background: #fff8ea;
}

.finance-risk-grid article.info {
  border-color: rgba(37, 91, 143, 0.26);
  background: #f0f6fb;
}

.finance-risk-grid span,
.finance-mini-stats span {
  display: block;
  color: #5b6673;
  font-size: 12px;
}

.finance-risk-grid strong,
.finance-mini-stats strong {
  display: block;
  margin-top: 4px;
  color: #202d39;
  font-size: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-risk-grid p {
  margin: 6px 0 0;
  color: #4b5563;
  font-size: 12px;
  line-height: 1.5;
}

.finance-mini-stats {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.finance-day-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.finance-site-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.finance-site-grid button {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
  color: #202d39;
  text-align: left;
}

.finance-site-grid button.active {
  border-color: rgba(37, 91, 143, 0.45);
  background: #f1f7fc;
  box-shadow: inset 3px 0 0 #255b8f;
}

.finance-site-grid button.empty {
  background: #f8fafb;
  color: #7b8794;
}

.finance-site-grid span {
  color: #5b6673;
  font-size: 12px;
}

.finance-site-grid strong {
  color: #202d39;
  font-size: 18px;
}

.finance-site-grid strong.warn,
.finance-site-grid small.warn {
  color: #b66a00;
}

.finance-site-grid em,
.finance-site-grid small {
  overflow: hidden;
  color: #5b6673;
  font-size: 12px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-day-grid button,
.finance-rank-list button,
.finance-recon-grid button {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
  color: #202d39;
  text-align: left;
}

.finance-rank-list button {
  grid-template-columns: 26px 1fr auto;
  align-items: center;
}

.finance-rank-list button.finance-rank-detail {
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: start;
}

.finance-rank-list span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-rank-list .finance-rank-detail > strong {
  grid-column: 2;
  color: #202d39;
  font-size: 15px;
  text-align: left;
  line-height: 1.25;
}

.finance-rank-list .finance-rank-detail span {
  display: grid;
  gap: 4px;
  white-space: normal;
}

.finance-rank-list .finance-rank-detail span strong,
.finance-rank-list .finance-rank-detail span em,
.finance-rank-list .finance-rank-detail span small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-rank-list .finance-rank-detail span em,
.finance-rank-list .finance-rank-detail span small {
  color: #5b6673;
  font-style: normal;
  font-size: 12px;
}

.finance-rank-list .finance-rank-detail span small.warn,
.finance-muted {
  color: #b8771a;
}

.finance-rank-list .finance-rank-detail.active {
  border-color: rgba(37, 91, 143, 0.45);
  background: #f1f7fc;
  box-shadow: inset 3px 0 0 #255b8f;
}

.finance-muted {
  margin: 8px 0 0;
  font-size: 12px;
  line-height: 1.45;
}

.product-penalty-summary,
.product-penalty-detail {
  display: grid;
  gap: 10px;
}

.product-penalty-main {
  grid-template-columns: minmax(0, 1.35fr) minmax(360px, 0.75fr);
}

.product-penalty-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.product-penalty-alias-warn {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.product-penalty-alias-warn span {
  padding: 5px 8px;
  border: 1px solid rgba(184, 119, 26, 0.32);
  border-radius: 6px;
  background: #fff8ea;
  color: #7a530d;
  font-size: 12px;
}

.product-penalty-rank .finance-rank-list {
  max-height: 640px;
  overflow: auto;
}

.product-penalty-rank .finance-rank-list button.finance-rank-detail {
  padding: 9px;
}

.product-penalty-rank .finance-rank-detail > strong {
  color: #c84630;
}

.product-penalty-pager {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}

.product-penalty-pager span {
  color: #5b6673;
  font-size: 12px;
  text-align: center;
}

.product-penalty-rate {
  align-self: start;
  padding: 6px 10px;
  border: 1px solid rgba(200, 70, 48, 0.25);
  border-radius: 6px;
  background: #fff4f1;
  color: #c84630;
}

.product-penalty-rate.muted {
  border-color: rgba(91, 102, 115, 0.2);
  background: #f8fafb;
  color: #5b6673;
}

.product-penalty-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: 10px;
}

.product-penalty-detail h3 {
  margin: 4px 0 8px;
  font-size: 14px;
}

.finance-table-wrap.compact {
  max-height: 360px;
  overflow: auto;
}

.finance-table-wrap.compact table {
  font-size: 12px;
}

.finance-table-wrap.compact th,
.finance-table-wrap.compact td {
  padding: 6px 7px;
  white-space: nowrap;
}

.finance-table-wrap.compact tr.warn {
  background: #fff8ea;
}

.product-penalty-category-list,
.product-penalty-source-list {
  display: grid;
  gap: 6px;
}

.product-penalty-category-list div,
.product-penalty-source-list div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 7px 8px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 6px;
  background: #f8fbfc;
  font-size: 12px;
}

.product-penalty-category-list span,
.product-penalty-source-list span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-penalty-source-list em {
  color: #5b6673;
  font-style: normal;
}

.finance-recon-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.finance-recon-grid .matched {
  border-color: rgba(31, 138, 91, 0.26);
  background: #f0f8f3;
}

.finance-recon-grid .mismatch {
  border-color: rgba(200, 70, 48, 0.32);
  background: #fff4f1;
}

.finance-scatter circle {
  cursor: pointer;
  fill: rgba(37, 91, 143, 0.55);
  stroke: #255b8f;
}

.finance-scatter circle.missing {
  fill: rgba(200, 70, 48, 0.28);
  stroke: #c84630;
}

.finance-scatter circle.skc {
  fill: rgba(200, 70, 48, 0.28);
  stroke: #c84630;
}

.finance-table-wrap {
  max-height: 430px;
  overflow: auto;
}

.finance-table-wrap table {
  min-width: 720px;
}

.finance-table-wrap td,
.finance-table-wrap th {
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-status {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 999px;
  background: #eef3f7;
  color: #4b5563;
  font-size: 12px;
}

.finance-status.reconciled,
.finance-status.matched {
  background: #e9f7ee;
  color: #1f7a4f;
}

.finance-status.reconcile_failed,
.finance-status.mismatch {
  background: #fff1ed;
  color: #c84630;
}

.finance-coverage-summary {
  grid-template-columns: repeat(10, minmax(0, 1fr));
  gap: 5px;
}

.finance-coverage-summary article {
  padding: 6px 8px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 8px;
  background: #fff;
}

.finance-coverage-summary span {
  display: block;
  color: #5b6673;
  font-size: 11px;
}

.finance-coverage-summary strong {
  display: block;
  margin-top: 2px;
  color: #202d39;
  font-size: 16px;
}

.finance-coverage-controls {
  display: grid;
  grid-template-columns: minmax(110px, 0.6fr) minmax(110px, 0.6fr) minmax(180px, 1fr) auto;
  gap: 6px;
  align-items: end;
  margin-bottom: 8px;
}

.finance-coverage-controls label {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: #5b6673;
  font-size: 11px;
  font-weight: 700;
}

.finance-coverage-controls select,
.finance-coverage-controls input {
  min-width: 0;
  height: 34px;
  padding: 0 9px;
  border: 1px solid #d3dde7;
  border-radius: 8px;
  background: #fff;
  color: #202d39;
  font-size: 12px;
}

.finance-coverage-controls button {
  height: 34px;
  padding: 0 12px;
  border: 1px solid #d3dde7;
  border-radius: 8px;
  background: #fff;
  color: #202d39;
  font-weight: 700;
}

.coverage-store-pickbar {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 7px;
  align-items: start;
  min-width: 0;
}

.coverage-store-pickbar > span {
  padding-top: 7px;
  color: #5b6673;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.coverage-store-picklist {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

.coverage-store-picklist button {
  max-width: none;
  min-height: 28px;
  height: auto;
  padding: 0 9px;
  overflow: visible;
  border-color: #d9e2eb;
  background: #f8fbfc;
  color: #425466;
  font-size: 11px;
  line-height: 1.25;
  text-align: left;
  white-space: normal;
}

.coverage-store-picklist button.active {
  border-color: rgba(37, 91, 143, 0.42);
  background: #eef6fc;
  color: #255b8f;
}

.coverage-month-group {
  display: grid;
  gap: 4px;
  margin-top: 7px;
}

.coverage-month-head {
  display: grid;
  grid-template-columns: auto auto 1fr;
  gap: 6px;
  align-items: center;
  min-width: 0;
  padding: 5px 8px;
  border: 1px solid rgba(37, 91, 143, 0.12);
  border-radius: 8px;
  background: #f7fafc;
}

.coverage-month-head strong {
  color: #202d39;
  font-size: 13px;
}

.coverage-month-head span,
.coverage-month-head em {
  overflow: hidden;
  color: #5b6673;
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-coverage-grid {
  display: grid;
  grid-template-columns: minmax(132px, 0.82fr) repeat(var(--coverage-cols, 4), minmax(88px, 1fr));
  gap: 4px;
  overflow-x: auto;
  padding-bottom: 3px;
}

.coverage-head {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 4px 6px;
  border-bottom: 1px solid #dbe2e8;
  background: #fff;
  color: #5b6673;
  font-size: 11px;
  font-weight: 700;
}

.coverage-store,
.coverage-cell {
  min-width: 0;
  min-height: 34px;
  padding: 4px 6px;
  border: 1px solid rgba(32, 45, 57, 0.12);
  border-radius: 8px;
  background: #fff;
  color: #202d39;
  text-align: left;
}

button.coverage-store,
button.coverage-cell {
  cursor: pointer;
}

.coverage-store strong,
.coverage-cell b,
.coverage-cell-line {
  display: flex;
  gap: 5px;
  align-items: center;
  overflow: hidden;
  color: #202d39;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.coverage-cell-line {
  width: 100%;
}

.coverage-cell-line b {
  flex: 0 0 auto;
}

.coverage-cell-line em {
  min-width: 0;
  overflow: hidden;
  color: #5b6673;
  font-size: 10px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.coverage-dot {
  width: 7px;
  height: 7px;
  padding: 0;
  border-radius: 999px;
  flex: 0 0 auto;
}

.coverage-dot.ready {
  background: #37a66b;
}

.coverage-dot.empty-state {
  background: #4f8fc7;
}

.coverage-dot.missing {
  background: #d45b44;
}

.coverage-dot.duplicate {
  background: #c78a2c;
}

.coverage-store span,
.coverage-cell > span:not(.coverage-cell-line),
.coverage-cell > em {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: #5b6673;
  font-size: 10px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.coverage-store.no-data {
  border-style: dashed;
}

.coverage-row-status-ready {
  border-color: rgba(31, 138, 91, 0.28);
  background: #f0f8f3;
}

.coverage-row-status-warning,
.coverage-row-status-duplicate {
  border-color: rgba(184, 119, 26, 0.32);
  background: #fff8ea;
}

.coverage-row-status-missing,
.coverage-cell.missing,
.coverage-cell.error {
  border-color: rgba(200, 70, 48, 0.32);
  background: #fff4f1;
}

.coverage-cell.ready {
  border-color: rgba(31, 138, 91, 0.28);
  background: #f0f8f3;
}

.coverage-cell.empty {
  border-color: rgba(37, 91, 143, 0.24);
  background: #f0f6fb;
}

.coverage-cell.duplicate {
  border-color: rgba(184, 119, 26, 0.32);
  background: #fff8ea;
}

.finance-coverage-legend {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.finance-coverage-legend span {
  display: flex;
  gap: 8px;
  align-items: center;
  min-width: 0;
  color: #4b5563;
  font-size: 12px;
}

.finance-coverage-legend i {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  flex: 0 0 auto;
}

.finance-coverage-legend .ready {
  background: #37a66b;
}

.finance-coverage-legend .empty {
  background: #4f8fc7;
}

.finance-coverage-legend .missing {
  background: #d45b44;
}

.finance-coverage-legend .duplicate {
  background: #c78a2c;
}

.finance-duplicate-groups {
  display: grid;
  gap: 8px;
}

.finance-duplicate-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 8px;
}

.finance-duplicate-toolbar button,
.finance-duplicate-title button {
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid #d3dde7;
  border-radius: 8px;
  background: #fff;
  color: #202d39;
  font-size: 12px;
  font-weight: 700;
}

.finance-duplicate-toolbar button.danger {
  border-color: rgba(200, 70, 48, 0.34);
  background: #fff4f1;
  color: #b83d28;
}

.finance-duplicate-toolbar button:disabled,
.finance-duplicate-title button:disabled {
  border-color: #d8e0e8;
  background: #f3f6f8;
  color: #8a96a3;
}

.finance-duplicate-toolbar span {
  color: #5b6673;
  font-size: 11px;
}

.finance-duplicate-group {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid rgba(184, 119, 26, 0.22);
  border-radius: 8px;
  background: #fffaf0;
}

.finance-duplicate-title {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.finance-duplicate-title strong,
.finance-duplicate-row strong {
  overflow: hidden;
  color: #202d39;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-duplicate-title span {
  color: #5b6673;
  font-size: 11px;
  white-space: nowrap;
}

.finance-duplicate-table {
  display: grid;
  gap: 5px;
}

.finance-duplicate-row {
  display: grid;
  grid-template-columns: 24px 72px minmax(180px, 1.5fr) minmax(130px, 0.8fr) minmax(260px, 1.4fr) auto;
  gap: 7px;
  align-items: center;
  min-width: 0;
  padding: 6px;
  border: 1px solid rgba(32, 45, 57, 0.1);
  border-radius: 7px;
  background: #fff;
}

.finance-duplicate-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.finance-duplicate-check input {
  width: 16px;
  height: 16px;
  accent-color: #c84630;
}

.finance-duplicate-row.effective {
  border-color: rgba(31, 138, 91, 0.26);
  background: #f0f8f3;
}

.finance-duplicate-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  background: #fff2d8;
  color: #9b6417;
  font-size: 11px;
  font-weight: 700;
}

.finance-duplicate-row.effective .finance-duplicate-badge {
  background: #dff3e8;
  color: #1f7a4f;
}

.finance-duplicate-row em,
.finance-duplicate-row small {
  overflow: hidden;
  color: #5b6673;
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-duplicate-row button {
  height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(200, 70, 48, 0.3);
  border-radius: 8px;
  background: #fff4f1;
  color: #b83d28;
  font-weight: 700;
}

.finance-duplicate-row button:disabled {
  border-color: #d8e0e8;
  background: #f3f6f8;
  color: #8a96a3;
}

.finance-import-box label {
  display: grid;
  gap: 5px;
  color: #4b5563;
  font-size: 12px;
  font-weight: 600;
}

.finance-chart-empty,
.finance-loading {
  display: grid;
  min-height: 160px;
  place-items: center;
  border: 1px dashed #cbd5df;
  border-radius: 8px;
  color: #5b6673;
  background: #f8fbfc;
}

@media (max-width: 1180px) {
  .finance-filterbar {
    grid-template-columns: repeat(3, minmax(140px, 1fr));
  }

  .finance-coverage-summary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .finance-coverage-controls {
    grid-template-columns: repeat(4, minmax(120px, 1fr));
  }

  .finance-coverage-controls button {
    grid-column: span 4;
  }

  .finance-kpi-grid {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }

  .finance-trend-snapshot {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .finance-layout-2 {
    grid-template-columns: 1fr;
  }

  .product-penalty-main,
  .product-penalty-detail-grid {
    grid-template-columns: 1fr;
  }

  .finance-kpi-drill-grid {
    grid-template-columns: 1fr;
  }

  .finance-kpi-modal-grid,
  .finance-kpi-modal-summary {
    grid-template-columns: 1fr;
  }

  .finance-metric-matrix {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-day-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-day-detail-grid {
    grid-template-columns: 1fr;
  }

  .finance-recon-grid,
  .finance-day-grid,
  .finance-site-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-duplicate-row {
    grid-template-columns: 24px 72px minmax(160px, 1fr) minmax(130px, 0.8fr) auto;
  }

  .finance-duplicate-row small {
    grid-column: 3 / -1;
  }

  .temu-product-toolbar .toolbar-left {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
  }

  .temu-product-row {
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 10px;
  }

  .temu-product-metrics,
  .temu-product-status {
    grid-column: 2;
  }

  .temu-product-detail-summary,
  .temu-product-flat-grid,
  .temu-product-sample-list {
    grid-template-columns: 1fr;
  }

  .temu-product-media img {
    width: 100%;
    height: auto;
    max-height: 280px;
  }

  .watch-center-grid {
    grid-template-columns: 1fr;
  }

  .watch-center-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .finance-hero {
    align-items: stretch;
    flex-direction: column;
  }

  .finance-filterbar,
  .finance-kpi-grid,
  .finance-trend-snapshot,
  .finance-recon-grid,
  .finance-day-grid,
  .finance-site-grid,
  .finance-mini-stats,
  .product-penalty-kpis,
  .finance-donut-wrap {
    grid-template-columns: 1fr;
  }

  .finance-kpi strong {
    font-size: 20px;
  }

  .finance-coverage-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-coverage-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-coverage-controls button {
    grid-column: span 2;
  }

  .coverage-store-pickbar {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .coverage-store-pickbar > span {
    padding-top: 0;
  }

  .coverage-month-head {
    grid-template-columns: 1fr auto;
  }

  .coverage-month-head em {
    grid-column: 1 / -1;
  }

  .finance-coverage-grid {
    grid-template-columns: minmax(130px, 0.9fr) repeat(var(--coverage-cols, 4), minmax(102px, 1fr));
  }

  .finance-coverage-legend {
    grid-template-columns: 1fr;
  }

  .finance-duplicate-title {
    align-items: flex-start;
    grid-template-columns: 1fr;
  }

  .finance-duplicate-row {
    grid-template-columns: 1fr;
  }

  .finance-panel .panel-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .finance-chart-svg {
    min-height: 190px;
  }

  .finance-metric-matrix {
    grid-template-columns: 1fr;
  }

  .finance-mini-trend {
    min-height: 88px;
  }

  .finance-day-kpis {
    grid-template-columns: 1fr;
  }

  .temu-product-toolbar .toolbar-left,
  .temu-product-toolbar .toolbar-right {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .temu-product-row {
    padding: 10px;
  }

  .temu-product-cover {
    width: 56px;
    height: 56px;
  }

  .temu-product-main button {
    white-space: normal;
  }

  .temu-product-detail-modal {
    width: calc(100vw - 16px);
  }

  .watch-center-page {
    border-radius: 0;
    margin: -8px;
  }

  .watch-center-header,
  .watch-center-title,
  .watch-center-refreshbar,
  .watch-center-ai,
  .watch-center-card-foot {
    align-items: stretch;
    flex-direction: column;
  }

  .watch-center-platform {
    margin-left: 0;
    width: 100%;
  }

  .watch-center-platform select,
  .watch-center-tabs,
  .watch-center-refreshbar button,
  .watch-center-auto-toggle {
    width: 100%;
  }

  .watch-center-tabs button {
    flex: 1 1 0;
    padding: 0 10px;
  }

  .watch-center-refreshbar > em,
  .watch-center-result {
    margin-left: 0;
  }

  .watch-center-stats,
  .watch-center-store-stats {
    grid-template-columns: 1fr;
  }

  .watch-center-card-head {
    grid-template-columns: 56px minmax(0, 1fr);
    padding: 14px;
  }

  .watch-center-cover,
  .watch-center-avatar {
    height: 56px;
    width: 56px;
  }

  .watch-center-card-body,
  .watch-center-card-foot {
    padding-left: 14px;
    padding-right: 14px;
  }

  .watch-center-card-foot > div {
    width: 100%;
  }

  .watch-center-card-btn {
    justify-content: center;
    width: 100%;
  }
}

/* AI model diagnostic center: a single-page surface beneath the global sidebar. */
.ai-hub {
  align-content: start;
  background: #edf2f8;
  display: grid;
  gap: 16px;
  margin: -18px;
  min-height: calc(100vh - 56px);
  padding: 18px;
}

.ai-hub-platform {
  gap: 14px;
  min-width: 0;
}

.ai-hub-page-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  min-width: 0;
}

.ai-hub-domain-tabs,
.ai-hub-trace-actions,
.ai-hub-filter-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.ai-hub-domain-tabs {
  border-bottom: 0;
  padding: 0;
}

.ai-hub-domain-tabs button,
.ai-hub-trace-actions button,
.ai-hub-filter-actions button {
  background: #fff;
  border: 1px solid #cbd8e7;
  border-radius: 8px;
  color: #25344a;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  min-height: 36px;
  padding: 7px 12px;
}

.ai-hub-domain-tabs button.active {
  background: #172033;
  border-color: #172033;
  color: #fff;
}

.ai-hub-domain-tabs button:disabled {
  background: transparent;
  border-color: transparent;
  color: #94a3b8;
}

.ai-hub-domain-select-label {
  display: none;
}

.ai-hub-domain-select {
  border: 1px solid #cbd8e7;
  border-radius: 8px;
  color: #172033;
  font: inherit;
  font-weight: 800;
  min-height: 40px;
  padding: 0 32px 0 10px;
}

.ai-hub-subnav {
  align-items: center;
  border-bottom: 1px solid #d8e2ee;
  display: flex;
  gap: 4px;
  min-width: 0;
  overflow-x: auto;
  padding: 0 2px 8px;
}

.ai-hub-subnav button {
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: #64748b;
  cursor: pointer;
  flex: 0 0 auto;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  min-height: 32px;
  padding: 6px 10px;
}

.ai-hub-subnav button.active {
  background: #e7edf7;
  color: #172033;
}

.ai-hub-page-title,
.ai-hub-section-head {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-width: 0;
}

.ai-hub-page-title {
  background: linear-gradient(135deg, #ffffff 0%, #f6f9fe 100%);
  border-color: #d9e4f2;
  padding: 20px;
}

.ai-hub-page-title > div,
.ai-hub-section-head > div {
  min-width: 0;
}

.ai-hub-page-title h1,
.ai-hub-page-title p,
.ai-hub-section-head h2,
.ai-hub-section-head p,
.ai-hub-state h1,
.ai-hub-state p,
.ai-hub-call-chain-intro p,
.ai-hub-error-panel h2,
.ai-hub-error-panel p {
  margin: 0;
}

.ai-hub-page-title h1,
.ai-hub-state h1 {
  color: #152238;
  font-size: 24px;
  line-height: 1.25;
}

.ai-hub-page-title p:not(.ai-hub-eyebrow),
.ai-hub-call-chain-intro p,
.ai-hub-state p {
  color: #64748b;
  line-height: 1.55;
  margin-top: 5px;
}

.ai-hub-eyebrow {
  color: #526b8d;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.ai-hub-refresh-time,
.ai-hub-section-head > span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  white-space: nowrap;
}

.ai-hub-diagnose-box {
  border-color: #cbdcf1;
  padding: 16px;
}

.ai-hub-diagnose-box form,
.ai-hub-trace-filters form {
  display: grid;
  gap: 9px;
}

.ai-hub-diagnose-box label,
.ai-hub-trace-filters label {
  color: #334155;
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  min-width: 0;
}

.ai-hub-diagnose-controls {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.ai-hub-diagnose-box input,
.ai-hub-trace-filters input,
.ai-hub-trace-filters select {
  background: #fff;
  border: 1px solid #cbd8e7;
  border-radius: 8px;
  color: #172033;
  font: inherit;
  min-height: 40px;
  min-width: 0;
  padding: 8px 10px;
}

.ai-hub-diagnose-controls .primary,
.ai-hub-filter-actions .primary,
.ai-hub-trace-actions .primary {
  background: #1d4ed8;
  border-color: #1d4ed8;
  color: #fff;
}

.ai-hub-metric-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.ai-hub-metric-grid article,
.ai-hub-metric-grid > button,
.ai-hub-detail-summary article {
  background: #fff;
  border: 1px solid #dbe5f0;
  border-radius: 10px;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 13px;
}

.ai-hub-metric-grid > button {
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition: border-color 140ms ease, transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}

.ai-hub-metric-grid > button:hover { border-color: #8fa7cb; }
.ai-hub-metric-grid > button:active { transform: scale(0.985); }

.ai-hub-metric-grid article.risk {
  background: #fff8f7;
  border-color: #f0c5bf;
}

.ai-hub-metric-grid span,
.ai-hub-detail-summary span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.ai-hub-metric-grid strong,
.ai-hub-detail-summary strong {
  color: #172033;
  font-size: 20px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.ai-hub-metric-grid small {
  font-size: 12px;
}

.ai-hub-metric-grid em {
  color: #7c8ba0;
  font-size: 11px;
  font-style: normal;
}

.ai-hub-issue-list,
.ai-hub-call-chain-intro,
.ai-hub-trace-table,
.ai-hub-trace-filters,
.ai-hub-preview-panel,
.ai-hub-trace-timeline,
.ai-hub-error-panel {
  border-color: #dbe5f0;
}

.ai-hub-issue-list,
.ai-hub-call-chain-intro,
.ai-hub-trace-table,
.ai-hub-trace-timeline {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.ai-hub-issue-rows {
  display: grid;
  gap: 7px;
}

.ai-hub-issue-rows button {
  align-items: center;
  background: #fff;
  border: 1px solid #e1e9f2;
  border-radius: 8px;
  cursor: pointer;
  display: grid;
  gap: 10px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-width: 0;
  padding: 10px 11px;
  text-align: left;
}

.ai-hub-issue-rows strong,
.ai-hub-issue-rows em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-hub-issue-rows strong {
  color: #25344a;
  font-size: 13px;
}

.ai-hub-issue-rows em {
  color: #7c8ba0;
  font-size: 12px;
  font-style: normal;
}

.ai-hub-status {
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  padding: 4px 7px;
  white-space: nowrap;
}

.ai-hub-status.ok {
  background: #e8f7ee;
  color: #167243;
}

.ai-hub-status.risk {
  background: #fff0ed;
  color: #bd3e2d;
}

.ai-hub-status.watch {
  background: #fff8df;
  color: #936000;
}

.ai-hub-status.neutral {
  background: #eef2f7;
  color: #536276;
}

.ai-hub-trace-filters form {
  align-items: end;
  grid-template-columns: minmax(180px, 1.3fr) repeat(4, minmax(130px, 0.8fr)) auto;
}

.ai-hub-filter-actions {
  align-self: end;
}

.ai-hub-trace-table-scroll {
  overflow-x: auto;
}

.ai-hub-trace-table table {
  border-collapse: collapse;
  min-width: 960px;
  width: 100%;
}

.ai-hub-trace-table th,
.ai-hub-trace-table td {
  border-bottom: 1px solid #e5ecf4;
  color: #435268;
  font-size: 12px;
  padding: 10px 9px;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.ai-hub-trace-table th {
  background: #f7f9fc;
  color: #617189;
  font-size: 11px;
  font-weight: 900;
}

.ai-hub-trace-table tbody tr {
  cursor: pointer;
}

.ai-hub-trace-table tbody tr:hover,
.ai-hub-trace-table tbody tr:focus-visible {
  background: #f1f6fd;
  outline: 2px solid #6a96d7;
  outline-offset: -2px;
}

.ai-hub-trace-table td strong,
.ai-hub-trace-table td span:not(.ai-hub-status) {
  display: block;
}

.ai-hub-trace-table td span:not(.ai-hub-status) {
  color: #7c8ba0;
  font-size: 11px;
  margin-top: 2px;
}

.ai-hub-trace-cards {
  display: none;
}

.ai-hub-trace-pagination {
  align-items: center;
  border-top: 1px solid #e5ecf4;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding-top: 12px;
}

.ai-hub-trace-pagination button {
  background: #fff;
  border: 1px solid #cbd8e7;
  border-radius: 8px;
  color: #25344a;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  min-height: 36px;
  padding: 7px 12px;
}

.ai-hub-trace-pagination button:disabled {
  color: #94a3b8;
  cursor: not-allowed;
  opacity: 0.72;
}

.ai-hub-trace-pagination span {
  color: #64748b;
  font-size: 12px;
  text-align: center;
}

.ai-hub-detail-summary {
  display: grid;
  gap: 9px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.ai-hub-detail-summary strong {
  font-size: 14px;
}

.ai-hub-trace-detail-layout {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
}

.ai-hub-trace-detail-main {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.ai-hub-preview-panel,
.ai-hub-error-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.ai-hub-preview-panel pre {
  background: #101927;
  border-radius: 8px;
  color: #dcecff;
  font: 12px/1.55 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  margin: 0;
  max-height: 360px;
  overflow: auto;
  padding: 12px;
  white-space: pre-wrap;
  word-break: break-word;
}

.ai-hub-error-panel {
  background: #fff8f7;
  border-color: #f0c5bf;
}

.ai-hub-error-panel h2 {
  color: #a63427;
  font-size: 15px;
}

.ai-hub-error-panel p {
  color: #76413b;
  line-height: 1.5;
}

.ai-hub-trace-timeline ol {
  display: grid;
  gap: 11px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ai-hub-trace-timeline li {
  border-left: 3px solid #cbd8e7;
  display: grid;
  gap: 5px;
  padding: 2px 0 2px 10px;
}

.ai-hub-trace-timeline li.ok {
  border-color: #48a871;
}

.ai-hub-trace-timeline li.risk {
  border-color: #d65b4a;
}

.ai-hub-trace-timeline li > div {
  align-items: flex-start;
  display: flex;
  gap: 7px;
  justify-content: space-between;
}

.ai-hub-trace-timeline strong {
  color: #25344a;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.ai-hub-trace-timeline p,
.ai-hub-trace-timeline em {
  color: #718096;
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
  margin: 0;
}

.ai-hub-trace-timeline em {
  color: #a13e33;
}

.ai-hub-title-stats {
  align-items: center;
  display: flex;
  gap: 8px;
}

.ai-hub-title-stats span {
  background: #f7f9fc;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  padding: 8px 10px;
}

.ai-hub-title-stats strong { color: #172033; font-size: 15px; }

.ai-hub-catalog-toolbar {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(240px, 1fr) minmax(180px, 260px) auto;
  padding: 14px;
}

.ai-hub-catalog-toolbar label,
.ai-hub-provider-config label {
  color: #334155;
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  min-width: 0;
}

.ai-hub-catalog-toolbar input,
.ai-hub-catalog-toolbar select,
.ai-hub-provider-config input,
.ai-hub-provider-config textarea {
  background: #fff;
  border: 1px solid #cbd8e7;
  border-radius: 8px;
  color: #172033;
  font: inherit;
  min-height: 40px;
  min-width: 0;
  padding: 8px 10px;
  width: 100%;
}

.ai-hub-catalog-toolbar > span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  padding: 0 2px 10px;
  white-space: nowrap;
}

.ai-hub-model-directory,
.ai-hub-provider-catalog,
.ai-hub-provider-config,
.ai-hub-routing-table,
.ai-hub-evidence-table,
.ai-hub-access-layout > .panel {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.ai-hub-model-list { display: grid; gap: 8px; }

.ai-hub-model-row {
  align-items: center;
  background: #fff;
  border: 1px solid #e0e8f1;
  border-radius: 9px;
  display: grid;
  gap: 12px;
  grid-template-columns: auto minmax(240px, 1fr) minmax(140px, auto) auto;
  min-width: 0;
  padding: 11px 12px;
}

.ai-hub-model-row[hidden] { display: none; }

.ai-hub-model-avatar {
  align-items: center;
  background: #edf3ff;
  border: 1px solid #d0def8;
  border-radius: 8px;
  color: #3158d6;
  display: inline-flex;
  flex: 0 0 34px;
  font-size: 12px;
  font-weight: 900;
  height: 34px;
  justify-content: center;
  width: 34px;
}

.ai-hub-model-row > div { min-width: 0; }
.ai-hub-model-row strong,
.ai-hub-provider-card strong { color: #172033; display: block; font-size: 13px; overflow-wrap: anywhere; }
.ai-hub-model-row > div > span,
.ai-hub-provider-card em { color: #64748b; display: block; font-size: 11px; font-style: normal; margin-top: 2px; }
.ai-hub-model-row p,
.ai-hub-provider-card p { color: #718096; font-size: 11px; line-height: 1.45; margin: 4px 0 0; overflow-wrap: anywhere; }

.ai-hub-model-capabilities { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.ai-hub-model-capabilities em { background: #f1f5f9; border-radius: 999px; color: #526177; font-size: 10px; font-style: normal; font-weight: 700; padding: 4px 7px; }

.ai-hub-model-row > button,
.ai-hub-provider-card > button,
.ai-hub-section-head > button,
.ai-hub-provider-config-actions button,
.ai-hub-provider-config .ai-hub-section-head > button {
  background: #fff;
  border: 1px solid #cbd8e7;
  border-radius: 7px;
  color: #3158d6;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  min-height: 36px;
  padding: 7px 10px;
}

.ai-hub-provider-layout {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 390px);
}

.ai-hub-provider-grid { display: grid; gap: 9px; grid-template-columns: repeat(2, minmax(0, 1fr)); }

.ai-hub-provider-card {
  background: #fafbfd;
  border: 1px solid #dfe7f0;
  border-radius: 9px;
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 12px;
}

.ai-hub-provider-card.configured { background: #fff; border-color: #bcd8c7; }
.ai-hub-provider-card.active { border-color: #6683df; box-shadow: 0 0 0 2px rgba(49, 88, 214, 0.15); }
.ai-hub-provider-card header { align-items: center; display: grid; gap: 9px; grid-template-columns: auto minmax(0, 1fr) auto; }

.ai-hub-provider-card dl,
.ai-hub-guardrail-list { display: grid; gap: 5px; margin: 0; }
.ai-hub-provider-card dl div,
.ai-hub-guardrail-list div { align-items: baseline; display: flex; gap: 10px; justify-content: space-between; }
.ai-hub-provider-card dt,
.ai-hub-provider-card dd,
.ai-hub-guardrail-list dt,
.ai-hub-guardrail-list dd { font-size: 11px; margin: 0; }
.ai-hub-provider-card dt,
.ai-hub-guardrail-list dt { color: #7c8ba0; }
.ai-hub-provider-card dd,
.ai-hub-guardrail-list dd { color: #25344a; font-weight: 800; overflow-wrap: anywhere; text-align: right; }

.ai-hub-provider-config { max-height: calc(100vh - 185px); overflow: auto; position: sticky; top: 12px; }
.ai-hub-provider-config form { display: grid; gap: 10px; }
.ai-hub-provider-config textarea { line-height: 1.45; resize: vertical; }
.ai-hub-config-check { align-items: center; grid-template-columns: auto minmax(0, 1fr); }
.ai-hub-config-check input { min-height: auto; width: auto; }
.ai-hub-provider-config-actions { display: flex; justify-content: flex-end; }
.ai-hub-provider-config-actions .primary { background: #3158d6; border-color: #3158d6; color: #fff; min-width: 130px; }

.ai-hub-config-empty,
.ai-hub-config-status {
  background: #f7f9fc;
  border: 1px dashed #cbd8e7;
  border-radius: 8px;
  color: #64748b;
  font-size: 12px;
  line-height: 1.55;
  margin: 0;
  padding: 14px;
}

.ai-hub-governance-grid { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ai-hub-governance-grid article { display: grid; gap: 7px; padding: 16px; }
.ai-hub-governance-grid article.watch { background: #fffaf0; border-color: #ecd8a2; }
.ai-hub-governance-grid span,
.ai-hub-governance-grid p { color: #718096; font-size: 11px; margin: 0; }
.ai-hub-governance-grid strong { color: #172033; font-size: 18px; }
.ai-hub-governance-grid p { line-height: 1.45; }

.ai-hub-routing-table table,
.ai-hub-evidence-table table { border-collapse: collapse; min-width: 720px; width: 100%; }
.ai-hub-routing-table th,
.ai-hub-routing-table td,
.ai-hub-evidence-table th,
.ai-hub-evidence-table td { border-bottom: 1px solid #e5ecf4; color: #435268; font-size: 12px; padding: 10px 9px; text-align: left; }
.ai-hub-routing-table th,
.ai-hub-evidence-table th { background: #f7f9fc; color: #617189; font-size: 11px; }
.ai-hub-evidence-table td strong,
.ai-hub-evidence-table td span { display: block; }
.ai-hub-evidence-table td span { color: #7c8ba0; font-size: 11px; margin-top: 2px; }

.ai-hub-access-layout { align-items: start; display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ai-hub-permission-list { display: grid; gap: 7px; }
.ai-hub-permission-list article { align-items: center; background: #f8fafc; border: 1px solid #e3eaf2; border-radius: 8px; display: flex; gap: 10px; justify-content: space-between; padding: 10px; }
.ai-hub-permission-list strong,
.ai-hub-permission-list code { display: block; }
.ai-hub-permission-list strong { color: #25344a; font-size: 12px; }
.ai-hub-permission-list code { color: #7c8ba0; font-size: 10px; margin-top: 2px; }

.ai-hub-state {
  align-content: center;
  display: grid;
  gap: 5px;
  min-height: 150px;
  padding: 20px;
}

.ai-hub-state.error {
  background: #fff8f7;
  border-color: #f0c5bf;
}

.ai-hub-state h1 {
  font-size: 18px;
}

.ai-hub-loading-state {
  align-items: center;
  grid-template-columns: auto minmax(0, 1fr);
}

.ai-hub-loading-indicator {
  animation: aiHubLoadingSpin 0.9s linear infinite;
  border: 3px solid #dbeafe;
  border-radius: 50%;
  border-top-color: #2563eb;
  height: 22px;
  width: 22px;
}

@keyframes aiHubLoadingSpin {
  to { transform: rotate(360deg); }
}

.ai-hub-platform button:focus-visible,
.ai-hub-platform input:focus-visible,
.ai-hub-platform select:focus-visible,
.ai-hub-platform [tabindex="0"]:focus-visible {
  outline: 3px solid rgba(37, 99, 235, 0.42);
  outline-offset: 2px;
}

.sr-only {
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

@media (max-width: 1120px) {
  .ai-hub-metric-grid,
  .ai-hub-detail-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ai-hub-trace-filters form {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }

  .ai-hub-provider-layout { grid-template-columns: 1fr; }
  .ai-hub-provider-config { max-height: none; position: static; }
}

@media (max-width: 820px) {
  .ai-hub {
    margin: -12px;
    min-height: calc(100vh - 48px);
    padding: 12px;
  }

  .ai-hub-page-head {
    align-items: stretch;
  }

  .ai-hub-domain-tabs {
    display: none;
  }

  .ai-hub-subnav { display: none; }

  .ai-hub-domain-select-label {
    display: block;
    width: 100%;
  }

  .ai-hub-domain-select {
    background: #fff;
    width: 100%;
  }

  .ai-hub-page-title,
  .ai-hub-section-head,
  .ai-hub-trace-detail-head {
    align-items: stretch;
    flex-direction: column;
  }

  .ai-hub-page-title {
    padding: 16px;
  }

  .ai-hub-refresh-time,
  .ai-hub-section-head > span {
    white-space: normal;
  }

  .ai-hub-diagnose-controls,
  .ai-hub-trace-filters form,
  .ai-hub-metric-grid,
  .ai-hub-detail-summary,
  .ai-hub-trace-detail-layout,
  .ai-hub-catalog-toolbar,
  .ai-hub-provider-grid,
  .ai-hub-governance-grid,
  .ai-hub-access-layout {
    grid-template-columns: 1fr;
  }

  .ai-hub-title-stats { align-items: stretch; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .ai-hub-catalog-toolbar > span { padding-bottom: 0; }
  .ai-hub-model-row { align-items: start; grid-template-columns: auto minmax(0, 1fr); }
  .ai-hub-model-capabilities,
  .ai-hub-model-row > button { grid-column: 1 / -1; justify-content: flex-start; width: 100%; }

  .ai-hub-diagnose-controls .primary,
  .ai-hub-filter-actions,
  .ai-hub-filter-actions button,
  .ai-hub-trace-actions,
  .ai-hub-trace-actions button {
    min-height: 44px;
    width: 100%;
  }

  .ai-hub-filter-actions,
  .ai-hub-trace-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .ai-hub-issue-rows button {
    align-items: flex-start;
    grid-template-columns: 1fr;
  }

  .ai-hub-issue-rows strong,
  .ai-hub-issue-rows em {
    white-space: normal;
  }

  .ai-hub-trace-table-scroll {
    display: none;
  }

  .ai-hub-trace-cards {
    display: grid;
    gap: 9px;
  }

  .ai-hub-trace-card {
    background: #fff;
    border: 1px solid #dbe5f0;
    border-radius: 9px;
    cursor: pointer;
    display: grid;
    gap: 7px;
    padding: 12px;
  }

  .ai-hub-trace-card > div,
  .ai-hub-trace-card dl {
    align-items: center;
    display: flex;
    gap: 7px;
    justify-content: space-between;
    margin: 0;
  }

  .ai-hub-trace-card > div > span:first-child,
  .ai-hub-trace-card p,
  .ai-hub-trace-card dt {
    color: #718096;
    font-size: 11px;
  }

  .ai-hub-trace-card strong {
    color: #25344a;
    font-size: 14px;
    overflow-wrap: anywhere;
  }

  .ai-hub-trace-card p {
    line-height: 1.45;
    margin: 0;
  }

  .ai-hub-trace-card dl {
    align-items: stretch;
  }

  .ai-hub-trace-card dl div {
    background: #f7f9fc;
    border-radius: 6px;
    display: grid;
    flex: 1 1 0;
    gap: 2px;
    min-width: 0;
    padding: 7px;
  }

  .ai-hub-trace-card dt,
  .ai-hub-trace-card dd {
    margin: 0;
  }

  .ai-hub-trace-card dd {
    color: #25344a;
    font-size: 12px;
    font-weight: 800;
    overflow-wrap: anywhere;
  }

  .ai-hub-trace-timeline {
    padding: 14px;
  }

  .ai-hub-trace-pagination {
    align-items: stretch;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ai-hub-trace-pagination span {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .ai-hub-trace-pagination button {
    min-height: 44px;
    width: 100%;
  }
}

/* Review action center */
.review-action-center {
  gap: 12px;
}

.review-action-center-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  padding: 8px 2px 12px;
  border-bottom: 1px solid #d8e1e8;
}

.review-action-center-header > div {
  min-width: 0;
}

.review-action-center-header span {
  color: #587087;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.review-action-center-header h2 {
  margin: 3px 0 4px;
  color: #17283a;
  font-size: 24px;
  line-height: 1.2;
}

.review-action-center-header p {
  margin: 0;
  color: #667587;
  font-size: 13px;
}

.review-action-center-header aside {
  display: grid;
  grid-template-columns: auto auto;
  gap: 2px 8px;
  align-items: center;
  min-width: 220px;
  padding-left: 18px;
  border-left: 1px solid #d8e1e8;
}

.review-action-center-header aside b {
  grid-row: 1 / span 2;
  color: #224b6d;
  font-size: 28px;
  line-height: 1;
}

.review-action-center-header aside span,
.review-action-center-header aside em {
  color: #6a7889;
  font-size: 11px;
  font-style: normal;
}

.review-workspace-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  border: 1px solid #d6e0e8;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.review-workspace-tabs button {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  min-height: 50px;
  padding: 8px 12px;
  border: 0;
  border-right: 1px solid #e1e7ec;
  border-radius: 0;
  background: #fff;
  color: #516174;
  text-align: left;
}

.review-workspace-tabs button:last-child {
  border-right: 0;
}

.review-workspace-tabs button.active {
  box-shadow: inset 0 -3px #245f8f;
  background: #f1f6fa;
  color: #183b59;
}

.review-workspace-tabs button > span {
  display: grid;
  min-width: 0;
}

.review-workspace-tabs strong,
.review-workspace-tabs em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-workspace-tabs strong {
  color: inherit;
  font-size: 13px;
}

.review-workspace-tabs em {
  color: #7a8797;
  font-size: 10px;
  font-style: normal;
}

.review-workspace-tabs b {
  flex: 0 0 auto;
  min-width: 26px;
  padding: 3px 6px;
  border-radius: 999px;
  background: #eaf0f5;
  color: #52677a;
  font-size: 11px;
  text-align: center;
}

.review-workspace-tabs button.active b {
  background: #d8e8f4;
  color: #1d517b;
}

.review-workspace-content,
.review-action-selection,
.review-diagnosis-workspace,
.review-trends-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  width: 100%;
  min-width: 0;
}

.review-workspace-content > *,
.review-action-selection > *,
.review-diagnosis-workspace > *,
.review-trends-workspace > * {
  max-width: 100%;
  min-width: 0;
}

.review-action-layout {
  display: grid;
  grid-template-columns: minmax(460px, 0.82fr) minmax(0, 1.35fr);
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.review-issue-queue-panel {
  position: sticky;
  top: 76px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  max-height: calc(100vh - 92px);
  margin: 0;
  overflow: hidden;
}

.review-issue-queue-panel .panel-head {
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 10px;
  border-bottom: 1px solid #e1e7ec;
}

.review-queue-sort button {
  padding: 6px 8px;
  font-size: 11px;
}

.review-issue-queue {
  display: grid;
  gap: 6px;
  align-content: start;
  min-height: 0;
  padding: 8px;
  overflow-y: auto;
}

.review-issue-row {
  display: grid;
  grid-template-columns: 42px minmax(150px, 1fr) repeat(3, minmax(64px, 0.36fr));
  grid-template-rows: auto auto;
  gap: 5px 8px;
  align-items: center;
  width: 100%;
  min-width: 0;
  min-height: 88px;
  padding: 9px;
  border: 1px solid #dce4ea;
  border-radius: 7px;
  background: #fff;
  color: #243548;
  text-align: left;
}

.review-issue-row:hover,
.review-issue-row.selected {
  border-color: #4c7ca4;
  box-shadow: inset 3px 0 #2f6b9a;
}

.review-issue-row.selected {
  background: #f1f6fa;
}

.review-priority {
  display: grid;
  grid-column: 1;
  grid-row: 1 / span 2;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 900;
}

.review-priority.critical {
  background: #fee5e2;
  color: #a52d24;
}

.review-priority.high {
  background: #fff0d9;
  color: #935a13;
}

.review-priority.medium {
  background: #e3eef7;
  color: #2f668f;
}

.review-priority.watch {
  background: #e7f2ec;
  color: #2d6a4f;
}

.review-issue-product {
  display: grid;
  grid-column: 2;
  grid-row: 1 / span 2;
  gap: 3px;
  min-width: 0;
}

.review-issue-product strong,
.review-issue-product em,
.review-issue-product small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-issue-product strong {
  color: #1f3042;
  font-size: 12px;
}

.review-issue-product em,
.review-issue-product small {
  color: #6f7e90;
  font-size: 9px;
  font-style: normal;
}

.review-issue-metric {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.review-issue-metric b {
  overflow: hidden;
  color: #26394d;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-issue-metric em,
.review-issue-meta em,
.review-issue-meta small {
  overflow: hidden;
  color: #788596;
  font-size: 8px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-issue-metric.danger b {
  color: #aa3027;
}

.review-issue-meta {
  display: flex;
  grid-column: 3 / -1;
  grid-row: 2;
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.review-issue-meta b {
  color: #46627b;
  font-size: 9px;
}

.review-product-hero {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  grid-template-columns: 64px minmax(220px, 1fr) minmax(320px, 0.9fr) auto;
  gap: 12px;
  margin: 0;
  padding: 12px;
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}

.review-product-cover {
  width: 64px;
  height: 64px;
  border-radius: 6px;
}

.review-product-hero strong {
  margin-bottom: 3px;
  font-size: 16px;
}

.review-product-hero p {
  display: -webkit-box;
  margin-bottom: 6px;
  overflow: hidden;
  font-size: 11px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.review-section-kicker {
  margin-bottom: 4px;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 9px;
}

.review-product-codes span {
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 9px;
}

.review-product-direct-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(64px, 1fr));
  align-self: stretch;
  border: 1px solid #e0e6eb;
  border-radius: 7px;
  overflow: hidden;
}

.review-product-direct-stats > span {
  display: grid;
  gap: 2px;
  align-content: center;
  min-width: 0;
  padding: 7px 8px;
  border-right: 1px solid #e5eaef;
}

.review-product-direct-stats > span:last-child {
  border-right: 0;
}

.review-product-direct-stats em,
.review-product-direct-stats small {
  overflow: hidden;
  color: #718093;
  font-size: 8px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-product-direct-stats b {
  overflow: hidden;
  color: #203448;
  font-size: 17px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-product-direct-stats .danger b,
.review-product-direct-stats .danger small {
  color: #aa3027;
}

.review-product-hero .primary {
  background: #2c6797;
}

.review-decision-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) repeat(3, minmax(110px, 0.36fr));
  overflow: hidden;
  border: 1px solid #d6e0e8;
  border-radius: 8px;
  background: #fff;
}

.review-decision-summary > div {
  padding: 12px;
}

.review-decision-summary > div > span {
  color: #6a788a;
  font-size: 9px;
}

.review-decision-summary > div > strong {
  display: block;
  margin-top: 3px;
  color: #20394f;
  font-size: 14px;
  line-height: 1.35;
}

.review-decision-summary > div > p {
  margin: 4px 0 0;
  color: #6b7888;
  font-size: 9px;
  line-height: 1.4;
}

.review-decision-summary dl {
  display: contents;
  margin: 0;
}

.review-decision-summary dl > div {
  display: grid;
  gap: 3px;
  align-content: center;
  min-width: 0;
  padding: 10px;
  border-left: 1px solid #e1e7ec;
}

.review-decision-summary dt,
.review-decision-summary small {
  overflow: hidden;
  color: #748193;
  font-size: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-decision-summary dd {
  margin: 0;
  color: #2a4054;
  font-size: 19px;
  font-weight: 850;
}

.review-decision-summary .improved dd {
  color: #24654e;
}

.review-decision-summary .worsened dd {
  color: #a92f26;
}

.review-queue-action-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
  min-width: 0;
}

.review-queue-action-grid .review-workbench-section {
  margin: 0;
}

.review-comparison-diagnosis {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.review-comparison-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.review-comparison-panel {
  overflow: hidden;
  min-width: 0;
  border: 1px solid #d5dee6;
  border-radius: 8px;
  background: #fff;
}

.review-comparison-panel > header {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
  min-height: 44px;
  padding: 9px 11px;
  border-bottom: 1px solid #e1e7ec;
  background: #fafcfd;
}

.review-comparison-panel > header > div {
  display: grid;
  min-width: 0;
}

.review-comparison-panel > header strong {
  color: #203448;
  font-size: 12px;
}

.review-comparison-panel > header span,
.review-comparison-panel > header em {
  color: #6e7c8d;
  font-size: 9px;
  font-style: normal;
}

.review-comparison-panel > header em {
  flex: 0 0 auto;
}

.review-comparison-panel > header em.danger {
  color: #a92f26;
  font-weight: 800;
}

.review-comparison-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  padding: 8px 11px 2px;
  color: #6e7c8d;
  font-size: 8px;
}

.review-comparison-legend span::before {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 5px;
  border-radius: 2px;
  background: #b8c4cf;
  content: "";
}

.review-comparison-legend .current::before {
  background: #2c6797;
}

.review-comparison-legend .peer::before {
  background: #788797;
}

.review-comparison-row {
  display: grid;
  grid-template-columns: 94px minmax(180px, 1fr) 74px;
  gap: 9px;
  align-items: center;
  margin: 0 11px;
  padding: 9px 0;
  border-bottom: 1px solid #edf0f3;
}

.review-comparison-name {
  display: grid;
  gap: 2px;
}

.review-comparison-name strong {
  color: #25384b;
  font-size: 10px;
}

.review-comparison-name em {
  color: #7a8797;
  font-size: 8px;
  font-style: normal;
}

.review-comparison-bars {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.review-comparison-bars > span {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 42px;
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.review-comparison-bars em {
  overflow: hidden;
  color: #6e7b8c;
  font-size: 8px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-comparison-bars strong {
  color: #26394d;
  font-size: 9px;
  text-align: right;
}

.review-comparison-track {
  display: block;
  width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: 2px;
  background: #edf0f3;
}

.review-comparison-track b {
  display: block;
  height: 100%;
  background: #b8c4cf;
}

.review-comparison-bars .current .review-comparison-track b {
  background: #2c6797;
}

.review-comparison-delta {
  display: grid;
  gap: 2px;
  padding: 6px;
  border-radius: 6px;
  background: #f0f3f6;
  color: #53667a;
  text-align: center;
}

.review-comparison-delta b {
  font-size: 10px;
}

.review-comparison-delta em {
  font-size: 7px;
  font-style: normal;
}

.review-comparison-delta.improved {
  background: #edf7f2;
  color: #24654e;
}

.review-comparison-delta.worsened {
  background: #fff0ee;
  color: #a92f26;
}

.review-comparison-panel > footer {
  margin: 2px 11px 10px;
  padding: 7px 8px;
  border: 1px solid #dce4ea;
  border-radius: 6px;
  background: #f7f9fb;
  color: #5c6b7d;
  font-size: 8px;
  line-height: 1.4;
}

.review-comparison-panel > footer.warning {
  border-color: #e5c68d;
  background: #fff9ed;
  color: #7e5c2d;
}

.review-quality-comparison,
.review-remediation-comparison {
  grid-column: 1 / -1;
}

.review-quality-main {
  display: grid;
  grid-template-columns: 135px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 12px;
}

.review-quality-number {
  display: grid;
  gap: 2px;
  padding-right: 12px;
  border-right: 1px solid #e1e7ec;
}

.review-quality-number span,
.review-quality-number em {
  color: #728093;
  font-size: 8px;
  font-style: normal;
}

.review-quality-number strong {
  color: #aa3027;
  font-size: 29px;
  line-height: 1;
}

.review-quality-scale-wrap {
  min-width: 0;
}

.review-quality-labels {
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
  color: #718093;
  font-size: 8px;
}

.review-quality-scale {
  position: relative;
  display: grid;
  grid-template-columns: 60fr 10fr 30fr;
  height: 14px;
  border-radius: 3px;
}

.review-quality-scale .severe {
  background: #e4aaa4;
}

.review-quality-scale .attention {
  background: #e5ca8d;
}

.review-quality-scale .normal {
  background: #a9c8b9;
}

.review-quality-scale > b {
  position: absolute;
  top: -7px;
  width: 2px;
  height: 28px;
  transform: translateX(-1px);
  background: #7d1712;
}

.review-quality-scale-wrap p {
  margin: 8px 0 0;
  color: #6b7889;
  font-size: 8px;
}

.review-quality-trend {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 7px;
  padding: 0 12px 10px;
}

.review-quality-trend > span {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid #dce3e9;
  border-radius: 6px;
  background: #f8fafb;
}

.review-quality-trend em {
  color: #748193;
  font-size: 8px;
  font-style: normal;
}

.review-quality-trend b {
  color: #a9362e;
  font-size: 13px;
}

.review-comparison-empty,
.review-remediation-empty {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 12px;
  padding: 10px;
  border: 1px solid #e3c58e;
  border-radius: 7px;
  background: #fff9ed;
  color: #75582f;
}

.review-comparison-empty {
  display: grid;
}

.review-comparison-empty strong,
.review-comparison-empty span {
  display: block;
  font-size: 9px;
}

.review-remediation-empty > b {
  display: grid;
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  place-items: center;
  border-radius: 50%;
  background: #f0dbaf;
}

.review-remediation-empty span {
  display: grid;
  gap: 3px;
}

.review-remediation-empty strong,
.review-remediation-empty em {
  font-size: 9px;
  font-style: normal;
}

.review-remediation-flow {
  display: grid;
  grid-template-columns: 1fr 20px 1fr 20px 1fr;
  gap: 5px;
  align-items: stretch;
  padding: 0 12px 12px;
}

.review-remediation-flow > span {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid #dce3e9;
  border-radius: 6px;
  background: #f8fafb;
}

.review-remediation-flow em {
  color: #748193;
  font-size: 8px;
  font-style: normal;
}

.review-remediation-flow b {
  color: #26394c;
  font-size: 9px;
}

.review-remediation-flow > i {
  display: grid;
  place-items: center;
  color: #8290a0;
  font-style: normal;
}

.review-remediation-windows {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 12px;
}

.review-remediation-windows article {
  display: grid;
  gap: 6px;
  padding: 9px;
  border: 1px solid #dce3e9;
  border-radius: 7px;
  background: #f8fafb;
}

.review-remediation-windows article > span,
.review-remediation-windows article > em {
  color: #6a7889;
  font-size: 8px;
  font-style: normal;
}

.review-remediation-windows dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
}

.review-remediation-windows dl > div {
  display: grid;
  gap: 2px;
}

.review-remediation-windows dt,
.review-remediation-windows dd {
  margin: 0;
  font-size: 8px;
}

.review-remediation-windows dd {
  color: #26394c;
  font-weight: 700;
}

.review-data-quality {
  margin: 0;
}

.review-data-quality > .panel-head {
  margin: 0;
  padding-bottom: 8px;
  border-bottom: 1px solid #e2e7ec;
}

.review-data-quality > .panel-head > em {
  color: #8b5d1e;
  font-size: 10px;
  font-style: normal;
}

.review-data-quality > div:last-child {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}

.review-data-quality article {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 9px 10px;
  border-right: 1px solid #e4e9ee;
}

.review-data-quality article:last-child {
  border-right: 0;
}

.review-data-quality article > span {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: space-between;
}

.review-data-quality article strong,
.review-data-quality article em,
.review-data-quality article b,
.review-data-quality article small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-data-quality article strong {
  color: #26394c;
  font-size: 10px;
}

.review-data-quality article em {
  padding: 2px 5px;
  border-radius: 4px;
  background: #e9f2ed;
  color: #2d6a4f;
  font-size: 8px;
  font-style: normal;
}

.review-data-quality article.status-stale em,
.review-data-quality article.status-unknown em,
.review-data-quality article.status-unavailable em,
.review-data-quality article.status-pending em {
  background: #fff1dc;
  color: #8c5a17;
}

.review-data-quality article b,
.review-data-quality article small {
  color: #6d7b8c;
  font-size: 8px;
}

.review-diagnosis-workspace .review-workbench-section,
.review-trends-workspace > .panel {
  margin: 0;
}

.review-trends-workspace .dashboard-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 1100px) {
  .review-action-layout,
  .review-comparison-grid,
  .review-queue-action-grid,
  .review-trends-workspace .dashboard-grid {
    grid-template-columns: 1fr;
  }

  .review-issue-queue-panel {
    position: static;
    max-height: 620px;
  }

  .review-quality-comparison,
  .review-remediation-comparison {
    grid-column: auto;
  }

  .review-product-hero {
    grid-template-columns: 64px minmax(0, 1fr) auto;
  }

  .review-product-direct-stats {
    grid-column: 1 / -1;
  }

  .review-decision-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .review-decision-summary > div {
    grid-column: 1 / -1;
  }

  .review-decision-summary dl > div:first-child {
    border-left: 0;
  }

  .review-data-quality > div:last-child {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .review-data-quality article:nth-child(2) {
    border-right: 0;
  }

  .review-data-quality article:nth-child(-n + 2) {
    border-bottom: 1px solid #e4e9ee;
  }
}

@media (max-width: 720px) {
  .review-action-center-header {
    grid-template-columns: 1fr;
  }

  .review-action-center-header aside {
    padding: 8px 0 0;
    border-top: 1px solid #d8e1e8;
    border-left: 0;
  }

  .review-workspace-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .review-workspace-tabs button:nth-child(2) {
    border-right: 0;
  }

  .review-workspace-tabs button:nth-child(-n + 2) {
    border-bottom: 1px solid #e1e7ec;
  }

  .review-product-hero {
    grid-template-columns: 54px minmax(0, 1fr);
  }

  .review-product-cover {
    width: 54px;
    height: 54px;
  }

  .review-product-hero > button {
    grid-column: 1 / -1;
    width: 100%;
  }

  .review-product-direct-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .review-product-direct-stats > span:nth-child(2) {
    border-right: 0;
  }

  .review-product-direct-stats > span:nth-child(-n + 2) {
    border-bottom: 1px solid #e5eaef;
  }

  .review-decision-summary {
    grid-template-columns: 1fr;
  }

  .review-decision-summary > div,
  .review-decision-summary dl > div {
    grid-column: auto;
    border-top: 1px solid #e1e7ec;
    border-left: 0;
  }

  .review-decision-summary > div {
    border-top: 0;
  }

  .review-issue-row {
    grid-template-columns: 38px minmax(0, 1fr) repeat(2, minmax(58px, 0.32fr));
  }

  .review-issue-metric:nth-of-type(4) {
    display: none;
  }

  .review-issue-meta {
    grid-column: 3 / -1;
  }

  .review-comparison-row {
    grid-template-columns: 82px minmax(0, 1fr);
  }

  .review-comparison-delta {
    grid-column: 2;
  }

  .review-quality-main,
  .review-remediation-windows,
  .review-data-quality > div:last-child {
    grid-template-columns: 1fr;
  }

  .review-quality-number {
    padding: 0 0 8px;
    border-right: 0;
    border-bottom: 1px solid #e1e7ec;
  }

  .review-remediation-flow {
    grid-template-columns: 1fr;
  }

  .review-remediation-flow > i {
    transform: rotate(90deg);
  }

  .review-data-quality article,
  .review-data-quality article:nth-child(2) {
    border-right: 0;
    border-bottom: 1px solid #e4e9ee;
  }

  .review-data-quality article:last-child {
    border-bottom: 0;
  }
}

@media (min-width: 1600px) {
  body {
    --qyg-wide-font-size: clamp(15px, calc(12.5px + 0.17vw), 16px);
    --qyg-wide-sidebar-width: clamp(232px, 12vw, 248px);
    --qyg-wide-sidebar-collapsed-width: clamp(72px, 4vw, 80px);
    --qyg-wide-brand-height: clamp(66px, 3.5vw, 72px);
    --qyg-wide-control-height: clamp(36px, 1.95vw, 40px);
    --qyg-wide-nav-item-height: clamp(28px, 1.5vw, 32px);
    --qyg-wide-topbar-height: clamp(52px, 2.75vw, 58px);
    --qyg-wide-gap: clamp(14px, 0.9vw, 18px);
    --qyg-wide-gap-compact: clamp(8px, 0.55vw, 12px);
    --qyg-wide-main-padding-inline: clamp(28px, 1.75vw, 40px);
    --qyg-wide-main-padding-block-start: clamp(24px, 1.55vw, 34px);
    --qyg-wide-main-padding-block-end: clamp(28px, 1.75vw, 40px);
    --qyg-wide-surface-padding: clamp(16px, 1.15vw, 24px);
    --qyg-wide-hero-title-size: clamp(28px, 1.55vw, 32px);
    --qyg-wide-section-title-size: clamp(24px, 1.3vw, 28px);
    font-size: var(--qyg-wide-font-size);
  }

  .app-shell {
    grid-template-columns: var(--qyg-wide-sidebar-width) minmax(0, 1fr);
  }

  .app-shell.sidebar-collapsed {
    grid-template-columns: var(--qyg-wide-sidebar-collapsed-width) minmax(0, 1fr);
  }

  .app-shell .sidebar > .brand {
    min-height: var(--qyg-wide-brand-height);
  }

  .app-shell .sidebar .brand {
    padding: var(--qyg-wide-gap) var(--qyg-wide-surface-padding) var(--qyg-wide-gap-compact);
  }

  .app-shell .sidebar .brand strong {
    font-size: clamp(16px, 0.9vw, 18px);
  }

  .app-shell .sidebar .brand span {
    font-size: clamp(13px, 0.72vw, 14px);
  }

  .app-shell .sidebar .nav {
    gap: clamp(3px, 0.22vw, 5px);
    padding: var(--qyg-wide-gap-compact) var(--qyg-wide-gap);
  }

  .app-shell .sidebar .nav-group,
  .app-shell .sidebar .nav-items {
    gap: clamp(3px, 0.22vw, 5px);
  }

  .app-shell .sidebar .nav .nav-title {
    min-height: clamp(24px, 1.35vw, 28px);
    padding-inline: var(--qyg-wide-gap-compact);
    font-size: clamp(12px, 0.68vw, 14px);
  }

  .app-shell .sidebar .nav-items button {
    min-height: var(--qyg-wide-nav-item-height);
    padding-inline: var(--qyg-wide-gap-compact);
    font-size: clamp(13px, 0.72vw, 14px);
  }

  .app-shell .sidebar .sidebar-foot button {
    min-height: clamp(30px, 1.65vw, 34px);
  }

  .app-shell .content > .topbar {
    min-height: var(--qyg-wide-topbar-height);
    padding-inline: var(--qyg-wide-main-padding-inline);
  }

  .app-shell .content > .main {
    padding:
      var(--qyg-wide-main-padding-block-start)
      var(--qyg-wide-main-padding-inline)
      var(--qyg-wide-main-padding-block-end);
  }

  button,
  #main.main button {
    min-height: var(--qyg-wide-control-height);
    padding-inline: var(--qyg-wide-gap);
  }

  input,
  select,
  #main.main input,
  #main.main select {
    min-height: var(--qyg-wide-control-height);
    padding: var(--qyg-wide-gap-compact) var(--qyg-wide-gap);
  }

  textarea,
  #main.main textarea {
    padding: var(--qyg-wide-gap-compact) var(--qyg-wide-gap);
  }

  #main.main .toolbar,
  #main.main .toolbar-left,
  #main.main .toolbar-right {
    gap: var(--qyg-wide-gap-compact);
  }

  #main.main .toolbar {
    margin-bottom: var(--qyg-wide-gap);
  }

  #main.main .grid,
  #main.main .dashboard-grid,
  #main.main .split-grid {
    gap: var(--qyg-wide-gap);
  }

  #main.main .dashboard-grid,
  #main.main .split-grid {
    margin-top: var(--qyg-wide-gap);
  }

  #main.main .page-hero {
    min-height: clamp(120px, 7vw, 148px);
    gap: var(--qyg-wide-gap);
    padding: var(--qyg-wide-surface-padding);
  }

  #main.main .page-hero-copy span {
    font-size: clamp(14px, 0.78vw, 15px);
  }

  #main.main .page-hero-copy h2 {
    font-size: var(--qyg-wide-hero-title-size);
  }

  #main.main .page-hero-kpis {
    gap: var(--qyg-wide-gap-compact);
  }

  #main.main .page-hero-kpis div {
    padding: clamp(12px, 0.8vw, 16px);
  }

  #main.main .page-hero-kpis span {
    font-size: clamp(12px, 0.68vw, 13px);
  }

  #main.main .page-hero-kpis strong {
    font-size: clamp(21px, 1.2vw, 25px);
  }

  #main.main .page-hero-review_dashboard {
    min-height: clamp(96px, 5.5vw, 116px);
    gap: var(--qyg-wide-gap-compact);
    padding: clamp(14px, 0.85vw, 18px);
  }

  #main.main .page-hero-review_dashboard .page-hero-copy h2 {
    font-size: var(--qyg-wide-section-title-size);
  }

  #main.main .page-hero-review_dashboard .page-hero-kpis {
    gap: var(--qyg-wide-gap-compact);
  }

  #main.main .page-hero-review_dashboard .page-hero-kpis div {
    padding: var(--qyg-wide-gap-compact) var(--qyg-wide-gap);
  }

  #main.main .page-hero-review_dashboard .page-hero-kpis span {
    font-size: clamp(11px, 0.62vw, 12px);
  }

  #main.main .page-hero-review_dashboard .page-hero-kpis strong {
    font-size: clamp(18px, 1vw, 21px);
  }

  #main.main .page-hero-home_assistant {
    min-height: clamp(46px, 2.6vw, 54px);
    padding: var(--qyg-wide-gap-compact) clamp(12px, 0.75vw, 16px);
  }

  #main.main .page-hero-home_assistant .page-hero-copy h2 {
    font-size: clamp(18px, 1.02vw, 21px);
  }

  #main.main .page-hero-home_assistant .page-hero-copy span {
    font-size: clamp(12px, 0.68vw, 14px);
  }

  #main.main .page-hero-home_assistant .page-hero-actions button {
    min-height: clamp(32px, 1.7vw, 36px);
  }

  #main.main .panel-head {
    min-height: clamp(42px, 2.45vw, 50px);
    padding: var(--qyg-wide-gap-compact) var(--qyg-wide-surface-padding);
  }

  #main.main .panel-head h2 {
    font-size: clamp(15px, 0.85vw, 17px);
  }

  #main.main .stat {
    padding: clamp(14px, 0.9vw, 18px);
  }

  #main.main .task-hero {
    min-height: clamp(96px, 5.3vw, 112px);
    gap: var(--qyg-wide-gap);
    padding: clamp(14px, 0.85vw, 18px) var(--qyg-wide-surface-padding);
  }

  #main.main .task-hero h2 {
    font-size: var(--qyg-wide-section-title-size);
  }

  #main.main .task-kpis {
    gap: var(--qyg-wide-gap-compact);
  }

  #main.main .task-kpis div,
  #main.main .task-metric-list div,
  #main.main .task-detail-grid div {
    padding: clamp(12px, 0.8vw, 16px);
  }
}